/* BASIC css start */
/* 섹션 공통 */
section { width: 100%; margin-bottom:60px } 
section .sec_inner { padding:0 5%; margin:0 auto } 
section h2 { font-family: 'Noto Sans KR', sans-serif; font-size: 26px; font-weight: bold; letter-spacing: -.5px; color: #000; margin-bottom:29px; line-height:1.3 } 

/* sec1 */
#sec1 { } 
#sec1 .swiper { width: 100%; } 
#sec1 .swiper ul { width: 100%; } 
#sec1 .swiper ul li { width: 100%; } 
#sec1 .swiper ul li a { display: block; width: 100%; } 
#sec1 .swiper ul li a img { width: 100%; } 
#sec1 .swiper-pagination { } 
#sec1 .swiper-pagination-bullet { background-color:#fff !important; margin:0 4px; opacity: .6; transition: width .5s; transform: scale(.9); } 
#sec1 .swiper-pagination-bullet-active { width:20px; border-radius: 10px !important; opacity: 1 !important; } 

/* sec2 */
#sec2 { margin-bottom:30px !important } 
#sec2 h2 { font-size: 22px !important } 
#sec2 .sec_inner { padding: 0 0 0 5%; } 
#sec2 .tumb { } 
#sec2 .tumb a { border-radius: 50%; overflow: hidden; } 
#sec2 .tumb a img { } 

/* How it works */
#works_wrap .sec_inner { padding: 0 5%; } 
#works_wrap .sec_inner .item_cont { display: flex; flex-direction: column; gap: 12px; } 
#works_wrap .sec_inner .item_cont li { position: relative; display: block; padding: 28px 24px; border-radius: 6px; } 
#works_wrap .sec_inner .item_cont li:nth-child(1) { background: url('/design/whatson/img/mo/kit-icon-01.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li:nth-child(2) { background: url('/design/whatson/img/mo/kit-icon-02.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li:nth-child(3) { background: url('/design/whatson/img/mo/kit-icon-03.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li:nth-child(4) { background: url('/design/whatson/img/mo/kit-icon-04.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li:nth-child(5) { background: url('/design/whatson/img/mo/kit-icon-05.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li:nth-child(6) { background: url('/design/whatson/img/mo/kit-icon-06.svg') no-repeat right 28px bottom 28px #FFEFEC; } 
#works_wrap .sec_inner .item_cont li a { display:block; } 
#works_wrap .sec_inner .item_cont li a span { display: inline-block; font-size: 12px; font-weight: 700; color: #fff; background: var(--point-color); padding: 0 10px; border-radius: 28px; height: 18px; line-height: 18px; margin-bottom: 8px; } 
#works_wrap .sec_inner .item_cont li a h3 { font-size: 20px; font-weight: 700; color: #000; margin-bottom: 10px; line-height: 1.25; } 
#works_wrap .sec_inner .item_cont li a p { font-size: 14px; font-weight: 400; color: #595959; line-height: 19px; } 
#works_wrap .sec_inner .item_cont li a img { width:100%; } 
.swiper_btn_prev { position: absolute; top: 15%; left: 1%; z-index: 10; } 
.swiper_btn_next { position: absolute; top: 15%; right: 1%; z-index: 9; } 

.btn_more { text-align: center; } 
.btn_more a { display: inline-block; color: #000; font-size: 14px; font-weight: 700; background: var(--point-color); color: #fff; padding: 13px 28.5px; border-radius: 40px; line-height: 1; } 
.btn_more a img { vertical-align: middle; margin-left: 3px; } 

/* 키트 활동 소개 */
#info_wrap { position: relative; background: #FAFAFA; padding: 56px 0; margin-bottom: 72px; } 
#info_wrap h2 { margin-bottom: 12px; } 
#info_wrap p { font-size: 15px; font-weight: 400; color: #595959; margin-bottom: 28px; line-height: 21px; } 
#info_wrap ul { display: flex; flex-direction: column; gap: 16px; } 
.mainVideo { position: relative; width: 100%; padding-bottom: 56.25%; border-radius: 6px; overflow: hidden; } 
.mainVideo iframe { position: absolute; width: 100%; height: 100%; } 

/* sec5 */
#sec5 { } 
#sec5 .sec5_banner { width: 100%; } 
#sec5 .sec5_banner a { display: block; width: 100%; } 
#sec5 .sec5_banner a img { width: 100%; } 

/* sec7 */
#sec7 { } 
#sec7 ul { width: 100%; } 
#sec7 ul li { width:100%; float } 
#sec7 ul li:first-child { margin-bottom: 72px; } 
#sec7 ul li a { display: block; width: 100%; } 
#sec7 ul li a img { width: 100%; } 


/* sec8 */
#sec8 { margin-bottom: 72px !important; } 
#sec8 .sec_inner { padding: 0 5% !important; text-align: left; } 
#sec8 h2 { font-size: 24px !important; margin-bottom:20px !important; line-height:19px } 
#sec8 h2 span { margin-right:6px; display: inline-block; width: 15px; height: 15px; background: url(//skin.makeshop.co.kr/skin/leaflet/MO_img/insta.png) no-repeat center center; background-size: contain; } 
#sec8 .sec8_tit>span { font-size:13px; display:inline-block; padding: 11px 16px; border-radius: 40px; background-color: var(--point-color); color: #fff; margin-bottom: 28px; } 
#sec8 .sec8_tit>span img { vertical-align: baseline; margin-left: 3px; } 
#sec8 ul { display: flex; flex-wrap: wrap; gap: 6px; justify-content: space-between; } 
#sec8 ul li { width: 31.9%; } 
#sec8 ul li a { display: inline-block; } 
#sec8 ul li a img { width: 100%; } 

/* 타이틀 공통 */
.tit_wrap { position: relative; padding: 0 18px; font-size: 15px; font-weight: 400; line-height: 21px; color: #595959; margin-bottom: 28px; } 
.tit_wrap p { font-size: 26px; font-weight: 700; color: #000; line-height: 34px; margin-bottom: 12px; } 

/* Whatson Level */
.level_wrap { position: relative; margin-bottom: 72px; overflow:hidden;} 
.level_wrap .level_cont { padding: 0 18px; } 
.level_wrap .level_cont .level_step { display: flex; align-items: center; margin-bottom: 16px; justify-content: space-around; } 
.level_wrap .level_cont .level_step span { position:relative; width: 100%; font-size:15px; font-weight:700; color:#000; text-align: center; } 
.level_wrap .level_cont .level_step span:not(:first-child)::before { content: ''; position: absolute; left: 0; width: 1px; height: 10px; background-color: #ccc; top: 50%; transform: translateY(-50%); } 
.level_wrap .level_cont .level_step span.swiper-slide-thumb-active { color: var(--point-color); } 
.level_wrap .swiper { width: 100%; } 
.level_wrap .swiper ul { width: 100%; } 
.level_wrap .swiper ul li { width: 100%; } 
.level_wrap .swiper ul li.mainVideo:after { content:''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 5; } 
.level_wrap .swiper ul li a { display: block; width: 100%; } 
.level_wrap .swiper ul li a img { width: 100%; } 
#tabcont_swiper .swiper-slide img {width: 100%;}


/* Look what your kids can do at home */
.home_wrap { position: relative; margin-bottom: 72px; } 
.home_wrap .swiper { padding: 0 18px 0; } 
.home_wrap .swiper .swiper-slide { margin-bottom:34px; } 
.home_wrap .swiper .swiper-slide a { display: block; } 
.home_wrap .swiper .swiper-slide a img { width: 100%; margin-bottom: 16px; } 
.home_wrap .swiper .swiper-slide a h3 { font-size: 18px; font-weight: 700; color: #000; margin-bottom: 6px; } 
.home_wrap .swiper .swiper-slide a p { font-size: 14px; font-weight: 400; line-height: 18px; color: #595959; } 
.home_wrap .swiper .swiper-pagination { bottom:0; } 
.home_wrap .swiper-pagination-bullet { background-color:#888 !important; margin:0 4px; opacity: .6; transition: width .5s; transform: scale(.9); } 
.home_wrap .swiper-pagination-bullet-active { width:20px; border-radius: 10px !important; opacity: 1 !important; } 

/* 매달 새로운 과학 키트 도착! */
.new_kit_wrap { margin-bottom:86px; } 
.new_kit_wrap .tit_wrap { margin-bottom:20px; } 
.new_kit_wrap .thumb { padding: 0 18px; margin-bottom: 20px; } 
.new_kit_list { position:relative; box-shadow:0px 1px 5px 2px #ddd; border-radius:6px; margin:0 18px 16px; padding:24px; } 
.new_kit_list .nk_step { display:inline-block; font-size:12px; font-weight:700; color:#fff; background:var(--point-color); border-radius:18px; padding:2px 10px; margin-bottom:12px; } 
/*.new_kit_list b { display:block; font-size:13px; font-weight:700; color:#000; margin-bottom:5px; line-height:1.25; } */
.new_kit_list .nk_price { display:flex; gap:6px; margin-bottom:12px; align-items:baseline; } 
.new_kit_list .nk_price .normal { font-size:20px; font-weight:700; color:#000; } 
.new_kit_list .nk_price .normal b{font-size:18px;}
.new_kit_list .nk_price .consumer { font-size:15px; font-weight:400; color:#999; text-decoration:line-through; } 
.new_kit_list p { font-size:14px; font-weight:400; color:#595959; line-height:19px; margin-bottom:12px; } 
.new_kit_list a {display:block;font-size:13px;font-weight:700;color:#000;padding:8px 0;text-align:center;border:2px solid #000;border-radius:48px;width:90%;margin: 0 auto 10px;} 
.new_kit_list .nk_benefit {border-top:1px solid #ddd;padding-top:20px;margin-top: 20px;} 
.new_kit_list .nk_benefit h4 { font-size:15px; font-weight:700; color:#000; margin-bottom:8px; line-height:1.25; } 
.new_kit_list .nk_benefit ul { display:flex; flex-wrap:wrap; align-items: flex-start; } 
.new_kit_list .nk_benefit ul li { width:50%; line-height:20px; font-size:14px; font-weight:500; color: #595959; } 
.new_kit_list .nk_benefit ul li b {line-height:20px; font-size:14px; color: #000;}

#footer { margin-top:0 !important } 

/* BASIC css end */

