@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;
} */

.needs8_index img{width: 100%;}
.clear::after{content:""; display:table; clear:both;}
.suit_en{letter-spacing: normal;}
.needs8_index{width:100%; height: 100%; font-size: 1.8rem;}
.needs8_index .main_banner{width:100%; height: 100%; background-image: url(https://igm.or.kr/class/img/8NEEDs/8needs_bg02.jpg);
background-size: cover; background-position: bottom; background-repeat: no-repeat;  padding:120px 0;}
.needs8_index .main_banner .layout3{ padding-bottom:120px; align-content: center; max-width: 1024px;}
.needs8_index .main_banner_tit{ margin:0 auto; width:100%; max-width: 1024px;}
.needs8_index .main_banner_tit h1{font-weight: 800; text-align: center; font-size: 4rem; line-height: 1.4;}
.needs8_index .main_banner_tit span{font-weight: 900; font-size: 3.6rem; background: linear-gradient(170deg, #bda881 10%,  #645945 25%, #bda881 50%,  #7c6e54 75%, #bda881 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; }
.needs8_index .main_banner h6{text-align: center;}
.needs8_index .needs8_reward{background-image: url(https://igm.or.kr/class/img/8NEEDs/8needs01.png); background-size: 100%; background-repeat: no-repeat;
  background-position: center;  list-style: none; padding:80px 0; width:28%; margin:0 auto; max-width: 360px;}
.needs8_index .needs8_reward p{font-size: 2rem; text-align: center; color:#000000;}
.needs8_index .needs8_reward p span{font-weight: 800; font-size: 2.4rem; text-align: center; color:#000000;}

.needs8_index .section01{width:100%;padding:80px 0;}
.needs8_index .section01_tit{width:100%; max-width: 1024px; margin:0 auto; text-align: center;}
.needs8_index .section01_tit h4{font-size: 3rem; background: linear-gradient(170deg, #bda881 10%,  #645945 25%, #bda881 50%,  #7c6e54 75%, #bda881 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 800;}
.needs8_index .section01_tit p{font-size: 2rem; line-height: 1.5;}
.needs8_index .section01_con{width:100%; max-width: 1024px; padding:40px; margin:80px auto; justify-content: center; background-color: #f2f2f2; border-radius: 10px;}
.needs8_index .section01_con h4{font-weight: 800; font-size: 3rem; line-height: 1.5;}
.needs8_index .section01_text{padding-left:3%;}
.needs8_index .section01_text li{width:100%; padding:0; margin-top:20px; list-style: none; color:#000;}
.needs8_index .section01_text span{display: inline-block; padding: 1px 5px; width:100px; text-align: center; border-radius: 3px; color:#ffffff;}


.needs8_index .section02{width:100%; padding-bottom:120px;}
.needs8_index .section02_tit{width:100%; max-width: 1024px; margin:0 auto; padding-bottom:80px; text-align: center;}
.needs8_index .section02_tit h4{font-size: 3rem; font-weight: 900;}
.needs8_index .section02_tit p{font-size: 2rem; line-height: 1.5;}
.needs8_index .section02_con{width:100%; max-width: 1024px; margin:0 auto; justify-content: center; list-style: none;}
.needs8_index .section02_con .layout3{margin:0 auto;}
.needs8_index .section02_con h5{background-color: #bda881; color:#ffffff; padding:0 10px; margin-bottom:15px;}
.needs8_index .section02_con h4{text-align: center; margin-top:10px; padding-top: 15px; border-top:1px solid#bda881; color:#bda881; font-weight:800;}
.needs8_index .section02_con p{color:#000; }
.needs8_index .section02_text{padding:20px; margin:15px auto; box-sizing: border-box; background-color: #f2f2f2;}

.needs8_index .section03{width:100%; padding:120px 0;background-image: url(https://igm.or.kr/class/img/8NEEDs/8needs_bg04.jpg); background-size: cover; background-repeat: no-repeat;
  background-position: center; }
.needs8_index .section03_tit{width:100%; max-width: 1024px; margin:0 auto; padding-bottom:40px; text-align: center;}
.needs8_index .section03_tit h4{font-size: 3rem; font-weight: 900;}
.needs8_index .section03_tit p{font-size: 2rem; line-height: 1.5;}
.needs8_index .section03_img{width:100%; max-width: 960px; margin:0 auto;}
.needs8_index .section04{width:100%; padding:120px 0;}
.needs8_index .section04_tit h4{font-size: 3rem; font-weight: 800; text-align: center; margin-bottom:60px;}
.needs8_index .section04_con{width:100%; max-width: 960px; margin:0 auto; justify-content: center; list-style: none;}
.needs8_index .section04_con .layout3{margin:10px auto; background-color:#f2f2f2f2;}
.needs8_index .section04_con_tit{padding:20px 0; width:40%; margin:0 auto; background-repeat: no-repeat; background-size: cover;}
.needs8_index .section04_con_text{ width:100% !important;}
.needs8_index .section04_con h5{color:#7c6e54; text-align:right; font-weight: 800; padding:5px 0; justify-content: center;}
.needs8_index .section04_con p{ font-size: 1.8rem; padding:5px 20px; margin-bottom:5px; background-color:#ffffff; }

.needs8_index .section05{width:100%; padding:120px 0; max-width: 1024px; margin:0 auto; }
.needs8_index .section05_tit{width:100%;  text-align: center;}
.needs8_index .section05_tit h4{font-size: 3rem; font-weight: 900;}
.needs8_index .section05_con li{list-style: none; padding:40px 30px; box-shadow: 4px 2px 12px rgba(85, 53, 17, 0.2); border-radius: 5px !important;}
.needs8_index .section05_con h5{padding:8px 0; color:#7c6e54; border-bottom:1px solid#bda881; margin-bottom:12px;}


@media (min-width: 1900px) {.needs8_index .main_banner{background-image: url(https://igm.or.kr/class/img/8NEEDs/8needs_bg00.jpg);}
}

@media (max-width: 1024px) {
  .needs8_index .section03_img{width:95%; margin:0 auto;}
}

@media (max-width: 868px) {
    .needs8_index .needs8_reward{width:50%; padding:140px 0; min-height:340px; float:left;}
    .needs8_index .section01_text{padding-left: 0; padding-top:40px;}
    .needs8_index .section04_con_tit{background-image: none !important; padding:0; padding-top:20px;}
  .needs8_index .section04_con h5{text-align: center}
  .renew_contents .layout3 li{margin-top:0;}
}
@media (max-width: 691px) {
  .needs8_index .needs8_reward{padding:100px 0; min-height:280px;}
}
@media (max-width: 480px) {
  .needs8_index .main_banner{background-image:none; background:linear-gradient(180deg, #f2f2f2 0%,  #c0c0c0 100%);}
  .needs8_index .main_banner .layout3{padding-bottom:0;}
    .needs8_index .needs8_reward{width:80%; float:none; padding:80px 0; min-height:240px;}
  .needs8_index .main_banner_tit h1{font-size: 3rem}
  .needs8_index .section01_con{padding:20px;}
  .needs8_index .section01_con h4{font-size: 2.2rem;}
  .needs8_index .section01_text span{display: block; margin:10px 0;}
  .needs8_index .section05_con li{padding:20px 15px;}
  .ex-list li .list-cont h3{font-size: 2.4rem;}
  .ex-list li .list-cont p{p font-size: 2rem;}
}