@charset "utf-8";
/*-------------------------------------------------

オンライン韓国語3DAYS

-------------------------------------------------*/
p{
    line-height: 1.4;
}
.main{
  background: url(/lpi/jh_korean/img/main_bg.jpg) no-repeat center top;
  min-width: 1400px;
  background-size: 100%;
  min-height: 1450px;
}
@media screen and (min-width: 1400px) and (max-width: 1459px) {
.main{
  min-height: 1500px;
}
}
@media screen and (min-width: 1460px) and (max-width: 1499px) {
.main{
  min-height: 1550px;
}
}
@media screen and (min-width: 1500px) and (max-width: 1549px) {
.main{
  min-height: 1600px;
}
}
@media screen and (min-width: 1550px) and (max-width: 1599px) {
.main{
  min-height: 1650px;
}
}
@media screen and (min-width: 1600px) and (max-width: 1620px) {
.main{
  min-height: 1700px;
}
}
@media screen and (min-width: 1621px) and (max-width: 1699px) {
.main{
  min-height: 1750px;
}
}

@media screen and (min-width: 1700px) and (max-width: 1800px) {
.main{
  min-height: 1850px;
}
}

@media screen and (min-width: 1801px) {
.main{
  min-height: 1960px;
}
}

.main .inner{
  width: 100%;
  margin: 0 auto;
  position: relative;
  min-height: 1400px;
}
.main .inner .main_leftTop{
  position: absolute;
  top:4%;
  left:4%;
}
.main .inner .main_rightTop {
  position: absolute;
  top: 7%;
  right: 9%;
}
.main .inner .main_leftCenter {
  position: absolute;
  top: 35%;
  left: 3%;
}

.main .inner .main_rightCenter{
  position: absolute;
  top: 24%;
  right: 4%;
}
.main .inner .main_leftBtm{
  position: absolute;
  bottom: 8%;
  left: 3%;
}

.main .inner .main_rightBtm {
  position: absolute;
  bottom: 15%;
  right: 3%;
}
.main_btm{
  background: url(/lpi/jh_korean/img/bg.jpg) repeat-y  center top;
  min-width: 1400px;
  background-size: 100%;
  padding-bottom: 60px;
}
.main_btm h1{
  text-align: center;
}
.main_btm h1 img{
  margin-top:-120px;
}
.main_btm .read{
  width: 100%;
  max-width: 1235px;
  margin:20px auto;
  font-size: 2.4rem;
  font-weight: bold;
  color:#6A3906;
}

.main_btm ul{
  width: 1050px;
  margin: 60px auto 0;
  display: flex;
  flex-wrap: wrap;
}
.main_btm ul li{
  margin: 0 0 30px 0;
}

.main_btm ul li:nth-child(odd){
  width: 240px;
}

.main_btm ul li:nth-child(even){
  width: calc(100% - 280px);
}
.main_btm ul li:nth-child(odd) div{
  background-color: #1D50A2;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 3rem;
  padding: 5px 30px;
  border-radius: 12px;
  margin-right: 40px;
  width: 200px;
}
.main_btm ul li p .month,
.main_btm ul li:nth-child(even) p{
  color: #1D50A2;
  font-size: 5rem;
  font-weight: bold;
}

.main_btm ul li p .month_pink {
  color: #E4007F;
  font-size: 5rem;
  font-weight: bold;
}

.main_btm ul li p .other,
.main_btm ul li p .year {
  font-size: 3.6rem;
}
.main_btm ul li p .month span{
  font-size: 4.5rem;
  vertical-align: top;
}
.main_btm ul li p .circle{
  background-color: #1D50A2;
  border-radius: 50%;
  color: #fff;
  font-size: 2rem;
  padding: 4px 7px 2px;
  vertical-align: middle;
  display: inline-block;
  margin: 0 0 5px 5px;
}
.main_btm ul li p .circle_pink{
  background-color: #E4007F;
  border-radius: 50%;
  color: #fff;
  font-size: 2rem;
  padding: 4px 7px 2px;
  vertical-align: middle;
  display: inline-block;
  margin: 5px 0 5px 5px;
}

.main_btm ul li:nth-child(even) p:nth-of-type(2) ,
.main_btm ul li:nth-of-type(6)  p:nth-of-type(1) {
  font-size: 3rem;
}
.main_btm ul li:nth-child(even) p:nth-of-type(2) span{
  font-size: 2.8rem;
  font-weight: normal;
}

.main_btm ul li:nth-of-type(6) p:nth-of-type(1) span.exemption{
  background-color: #E4007F;
  color: #fff;
  text-align: center;
  font-weight: bold;
  font-size: 2.8rem;
  padding: 2px 30px;
  border-radius: 50px;
  margin-top: 10px;
  display: inline-block;
}
.main_btm ul li:nth-child(even) .note{
  font-size: 2rem;
  font-weight:normal;
}


.main_btm ul li:nth-of-type(6)  p span  {
  font-size: 1.8rem;
  font-weight:normal;
}
.entry{
  max-width: 650px;
  width: 90%;
  padding: 60px 0 120px;
  margin: 0 auto;
}
.entry .btn{
  position: relative;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: 100%;
  padding: 20px;
  background: #FFF67F;
  border-style: solid;
  border-width: 2px;
  border-color: #FFF67F;
  border-radius: 100px;
  color: #E4007F;
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
  outline: none;
  transition: all .3s;
  cursor: pointer;
  font-family: initial;
  font-size: 2.6rem;
}
.entry .btn i:first-child {
  margin: 0 8px 0 0;
}

.entry .btn .icon-right:last-child {
  position: absolute;
  top: 50%;
  right: 15px;
  margin: -0.5em 0 0;
}

.entry .btn:hover {
  background: #fff;
  color: #E4007F;
  text-decoration: none;
  border-color: #E4007F;
  opacity: 1;
}

@media screen and (max-width: 720px) {
.main{
  background: url(/lpi/jh_korean/img/main_bg_sp.jpg) no-repeat center top;
  background-size: contain;
  min-width: auto;
  min-height: auto;
  padding-top: 103.6111%;
  position: relative;
}
.main .inner {
  width: 100%;
  margin: 0 auto;
  min-height: auto;
  position: initial;
}
.main .inner .main_leftTop{
  width: 40%;
  left: 3%;
  top: 2%;
}
.main .inner .main_rightTop{
  width: 35%;
  top: 3%;
  right: 3%;
}
.main .inner .main_leftCenter{
  width: 35%;
  top: 27%;
  left: 2%;
}

.main .inner .main_rightCenter {
  width: 35%;
  top: 20%;
  right: 2%;
}
.main .inner .main_leftBtm {
  width: 40%;
  bottom: 12%;
  left: 1%;
}

.main .inner .main_rightBtm{
  width: 35%;
  right: 0;
  bottom: 16%;
}

.main .inner  img{
    width: 100%;
  }
.main_btm{
  background: url(/lpi/jh_korean/img/bg_sp.jpg) repeat-y  center top;
  background-size: contain;
  min-width: auto;
} 
.main_btm h1 {
  text-align: center;
  padding: 0 10px 10px10px;
}
.main_btm h1 img {
  margin-top: 0;
  width: 100%;
}
.main_btm .read {
  width: 90%;
  font-size: 1.6rem;
}
.main_btm ul{
  width: 100%;
  margin: 30px auto 0;
  display: block;
  padding: 0 15px 0 20px;
}
.main_btm ul li {
  margin: 0 0 10px 0;
}
 .main_btm ul li:nth-child(odd) {
  width: 100%;
} 
 .main_btm ul li:nth-child(even) {
  width: 100%;
  margin: 0 0 30px 0;
} 

.main_btm ul li:nth-child(odd) div{
  font-size: 2rem;
  margin-right: 0;
  width: 100%;
  padding: 2px 30px;
}
.main_btm ul li:nth-child(even) p {
  font-size: 2.6rem;
} 
.main_btm ul li p .circle,
.main_btm ul li p .circle_pink{
  font-size: 1.4rem;
}
.main_btm ul li p .other,
.main_btm ul li p .year {
  font-size: 2.4rem;
}
.main_btm ul li p .month {
  font-size: 3.4rem;
}
.main_btm ul li p .month span {
  font-size: 3rem;
  vertical-align: top;
}
.main_btm ul li p .month_pink {
  font-size: 3.4rem;
}
.main_btm ul li:nth-child(even) p:nth-of-type(2), 
  .main_btm ul li:nth-of-type(6) p:nth-of-type(1) {
  font-size: 1.8rem;
    line-height: 1.4;
}
.main_btm ul li:nth-child(even) p:nth-of-type(2) span {
  font-size: 1.6rem;
}  
.main_btm ul li:nth-of-type(6) p span {
  font-size: 1.4rem;
  font-weight: normal;
}
.main_btm ul li:nth-of-type(6) p:nth-of-type(1) span.exemption {
    font-size: 1.8rem;
    margin: 20px auto 0;
    width: 70%;
    display: block ruby;
    padding: 5px 0;
  }
.main_btm ul li:nth-child(even) .note {
  font-size: 1.4rem;
}
.entry {
  width: 90%;
  padding: 30px 0 60px;
}
.entry .btn {
  padding: 10px 0;
  font-size: 2rem;
}

}