@import url('https://cdn.jsdelivr.net/gh/sun-typeface/SUIT@2/fonts/static/woff2/SUIT.css?family=SUIT');
/* 

img{width:100%;}
body { font-weight: 400; color:#333;padding:0; margin:0; font-size:18px; letter-spacing: -1px; height:100%; font-family: 'SUIT', sans-serif, 'Noto Sans KR', sans-serif; background:#ffffff;min-width:320px;-webkit-text-size-adjust: none; }
body.is_hidden{overflow:hidden}
html, h1, h2, h3, h4, h5, h6, form, fieldset, td, tr, table ,tbody {margin:0;padding:0;border:0; border-spacing: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
label, input, button, select {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em}
button,input[type=submit] {cursor:pointer;}
input[type=text], input[type=password], input[type=submit], input[type=image], button {-webkit-appearance:none}
textarea, select {font-size:1em;}
textarea {border-radius:0;-webkit-appearance:none}
select{background:#fff}
p {margin:0;padding:0;}
hr {display:none;}
button {background-color:unset; border:0; }
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {text-decoration:none;}
ul,li,dl,dt,dd {padding:0;margin:0; list-style: none;}
ul {list-style:none;}
*, :after, :before {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
} */


.clear::after{content:""; display:table; clear:both;}
.suit_en{letter-spacing: normal;}

.junior_index{width:100%; margin:0 auto; line-height: 1.5;}

.junior_index .main_banner{width:100%; margin:0 auto; padding:280px 0; background-image:url(https://igm.or.kr/class/img/junior/SJ_bg01.jpg);
background-size: cover; background-position-y: 70%;}

.junior_index .main_banner_text{width:100%; max-width: 1024px; margin:0 auto;}
.junior_index .main_banner_text h1{ font-size: 10.4rem; line-height: 1.3; font-weight: 900; color:#ffffff;}
.junior_index .main_banner_text h5{ font-weight: 400; font-size: 2.2rem;  line-height: 1.3;  color:#ffffff;}

.section{width:100%;}
.junior_index .section01{padding:120px 0;
background-size: cover;  background-position: bottom;}
.junior_index .section01_tit{width:100%; margin:0 auto; max-width: 1024px; position: relative;}
.junior_index .section01_tit p{ font-weight: 400; font-size: 1.8rem;z-index: 111;}
.junior_index .section01_tit h2{font-size: 1.8rem; z-index: 111;}
.junior_index .section01_img{width:100%; max-width: 560px; position: absolute; top:-75%; left:50%;}

.junior_index .section02{width:100%; padding:120px 0; background: linear-gradient(180deg, #8a74fa 5%, #523ccc 100%);}
.junior_index .section02_tit{width:100%; margin:0 auto; padding-top:60px; max-width: 1024px; text-align: center; color:#ffffff;}
.junior_index .section02_tit h2{font-size: 3rem; color:#ffffff;}
.junior_index .section02_tit h3{font-size: 3rem; margin-top:20px; padding:10px 36px; color:#ffffff; display: inline-block; background-color: #523ccc; border-radius: 50px;}
.junior_index .section02_tit p{font-size: 2.4rem; padding:60px 0; color:#ffffff; text-align: center;}
.junior_index .section02 .renew_contents {margin: 0px auto; max-width: 1024px;}
.junior_index .section02 .layout2 li{width:100%; padding: 40px 20px; background-color:#ffffff; transition: 0.5s; transition-delay: 300ms;
box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2); position: relative;}
.junior_index .section02 .layout2 li:hover{ transition: all .3s; transform: translateY(-10px);}
.junior_index .section02 .layout2 li p{font-weight: 600; font-size: 1.8rem; color:#333333; padding-bottom:140px;}
.junior_index .section02_con{text-align: center; position: absolute; bottom:10%; left:50%; transform: translateX(-50%); 
  padding:10px 20px; background-color: #ffee00; width:80%; border-radius: 5px;}

  .junior_index .section02 > p{font-size: 2.4rem; padding-top:60px; color:#ffffff; text-align: center;}


.junior_index .section03{width:100%; padding:120px 0; background-color: #523ccc;}
.junior_index .section03_tit{width:100%; margin:0 auto; max-width: 1024px; text-align: center; color:#ffffff;}
.junior_index .section03_tit h2{font-size: 3rem; display: inline-block;  padding:10px 36px; background-color:#8060ff; border-radius: 50px;}
.junior_index .section03 .renew_contents{width:100%; max-width: 1024px;}
.junior_index .section03 .section03_con{width:100%; margin:80px auto;  border-radius: 15px; box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2); background-color:#ffffff;}
.junior_index .section03_con h3{ text-align: center; padding:10px; color:#ffffff;background: linear-gradient(120deg, #a796ff 5%, #775bff 100%); font-size: 2rem; border-radius: 15px 15px 0 0;} 
.junior_index .section03_con h4{padding-bottom:40px; font-weight: 900; color:#523ccc;  font-size: 3rem; line-height: 1.3;} 
.junior_index .section03_con_text{padding:40px 0; width:70%; margin:0 auto;} 
.junior_index .section03_con p{ padding:6px 0;  font-size: 1.8rem; line-height: 1.3;} 



.junior_index .section04{width:100%; padding:140px 0; background-color:#333333;}
.junior_index .section04_tit{width:100%; margin:0 auto; max-width: 1024px; }
.junior_index .section04_tit h5{font-size: 2.2rem; font-weight: 400; color:#ffffff;}
.junior_index .section04_tit h2{font-size: 2.6rem; color:#ffffff;}
.junior_index .section04 h6{font-size: 2.4rem;  font-weight: 800; color:#333333;}
.junior_index .section04 .layout2{ margin-bottom:20px;}
.junior_index .section04 li{ transition: 0.5s; transition-delay: 300ms;
  background-color: #ffffff; box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2);}
.junior_index .section04 li:hover{transition: all .3s; transform: translateY(-5px);}
.junior_index .section04_img{float:left; width: 30%; background-color: #8060ff; border-radius: 15px;}
.junior_index .section04_text{float:left; margin-left:4%; width:66%;}



.junior_index .section05{width:100%; background: linear-gradient(180deg,#523ccc 5%, #8a74fa 100%);}
.junior_index .section05_tit{width:100%; margin:0 auto;  padding:200px 0 600px;
background-image:url(https://igm.or.kr/class/img/junior/SJ05.png); background-attachment: fixed;
background-size: cover; background-position:bottom;}
.junior_index .section05_tit h2{font-size: 4rem; color:#ffffff; text-align: right; max-width: 1024px; width:100%; margin:0 auto;}






@media (max-width: 1024px) {

.junior_index .main_banner{ padding:220px 0;}
.junior_index .main_banner_text{width:80%;}
.junior_index .section01{padding:80px 0;}
  .junior_index .section01_tit{width:80%; }
  .junior_index .section01_img{max-width:360px; top:-55%; left:80%; transform: translateX(-50%);}
.junior_index .section02 .renew_contents {margin: 0px auto; max-width:none; width:90%;}
.junior_index .section03 .renew_contents{width:90%; max-width: none;}
.junior_index .section03 .section03_con{width:90%;}
.junior_index .section04_tit{max-width: none; width:90%;}
.junior_index .section05_tit h2{max-width: none; width:90%;}
.junior_index .section05_tit{padding: 200px 0 480px;}

}

@media (max-width: 767px) {
.junior_index .main_banner{background-position: right; padding:0; padding-bottom:200px;} 
.junior_index .main_banner_text{text-align: center; padding:80px 0;}
  .junior_index .section01_img{max-width:200px; top:-30%; left:80%; transform: translateX(-50%); display: none;}
.junior_index .section01_tit p{text-align: center;}
.junior_index .section01_tit h2{text-align: center;}
.junior_index .section02{padding:60px 0;}
.junior_index .section02 .layout2 li{margin:40px auto;}
.junior_index .section02_tit h2{font-size: 2.4rem;}
.junior_index .section02_tit h3{font-size: 2.4rem;}
.junior_index .section02_tit p{font-size: 2rem;}
.junior_index .section02 .layout2 li{ background-image: none !important;}
.junior_index .section02 .layout2 li p{text-align: center; font-size:2rem; padding-bottom:60px}
.junior_index .section04_tit h5{text-align: center;}
.junior_index .section04_tit h2{text-align: center;}
.junior_index .section04_img{width:20%;}
.junior_index .section05_tit h2{text-align: center; font-size: 3rem;} 
.junior_index .section05_tit{background-position:20%, 100%; padding:100px 0 480px; background-attachment: unset;}
.junior_index .section04 p{font-size:2rem; padding-top:10px;}

}


@media (max-width: 480px) {
  .junior_index .main_banner{background-position: 80%;}
  .junior_index .main_banner_text h5{font-size: 2rem;}
  .junior_index .main_banner_text h1{font-size: 6rem;}
  .junior_index .section02_tit h2{font-size: 2rem;}
  .junior_index .section02_tit h3{font-size: 2rem;}
  .junior_index .section02_tit p{padding:60px 0 30px;}
  .junior_index .section02 .layout2 li{margin:20px auto;}
  .junior_index .section02 > p{font-size: 2rem; padding-top:30px;}
  .junior_index .section03{padding:90px 0;}
  
  .junior_index .section03_tit{width:90%;}
  .junior_index .section03_tit h2{font-size:2rem;}
  .junior_index .section03 .section03_con{width:100%;}
  .junior_index .section03_con_text{width:90%;}
  .junior_index .section03_con p{font-size: 1.6rem;}
  .junior_index .section04_tit h5{font-size: 1.8rem;}
  .junior_index .section04_tit h2{font-size: 2rem;}
  .junior_index .section04 p{font-size: 1.8rem;}
  .junior_index .section05_tit h2{font-size: 2.4rem;}
  .junior_index .section05_tit{background-image: url(https://igm.or.kr/class/img/junior/SJ11.png);
  background-position:bottom; padding:100px 0 320px;}
  .junior_index .section05_tit h2{font-size: 2rem;}

}