/* 202510 신규 모바일*/

html, body{
    min-width:320px;
}
.section{max-width:720px;margin:0 auto;}

.pdb-6 {padding-bottom: 6%;}

.logo-wrap {align-items:center; width:70px; padding: 20px 0 0;}
/* sticky 기본 */
.gnb-sticky{position: sticky; position: -webkit-sticky; top: 0; z-index: 1000; background:#fff;}
.gnb-sticky.is-fixed{position: fixed; top: 0; left: 50%; transform: translateX(-50%); width: 100%; background:#fff;}
.gnb-sticky-spacer{ height:0; }
.gnb-wrap {display: flex; justify-content: center; align-items: center; width: 100%;}
.gnb-tab {display: inline-block; padding: 20px 0 10px; cursor: pointer; font-size: 16px; text-align: center;
    width: 50%; color: #a1a1a1; font-weight: bold; background: #fff; border-bottom:3px solid #fff;}
.gnb-tab.active {color: #1db9ff; border-bottom:4px solid #1db9ff !important;}

/* sticky 변형 */
.gnb-sticky-wrap {position:absolute;bottom: 0;}
.gnb-sticky2 {position: sticky; position: -webkit-sticky;z-index: 1000;}
.gnb-sticky2.is-fixed {position: fixed; top: 0;  left: 50%; transform: translateX(-50%); width: 100%;}
.gnb-sticky2 .gnb-wrap {display: flex; justify-content: center; align-items: center; width: 100%; background: #ffe9af;}
.gnb-sticky2 .gnb-tab {display: inline-block; padding: 0px; cursor: pointer; font-size: 16px; text-align: center;
    width: 50%; color: #a1a1a1; font-weight: bold; border-bottom:0px; background:none;}
.gnb-sticky2 .gnb-tab.active {color: #1db9ff; border-bottom:0px;}

.homeCont, .featureCont {display: none;}
.homeCont {display: block;}

.btn-img {position: absolute; transform: translateX(-50%);width: 100%;}
.btn-img.st1 {left: 50%; top: 87%;width: 80%;}
.btn-img.st1_1 {left: 50%; top: 83%;width: 80%;}
.btn-img.st1_2 {left: 50%; top: 88%;width: 80%;}
.btn-img.st1_3 {left: 50%; top: 93.5%;width: 80%;}
.btn-img.st1_4 {left: 50%; top: 87%;width: 72%;}
.btn-img.st1_5 {left: 53%; top: 71%;width: 75%;}
.btn-img.st1_6 {left: 53%; top: 71%;width: 75%;}
.btn-img.st1_7 {left: 50.5%; top: 76%;width: 68%;}
.btn-img.st1_8 {left: 50%; top: 81%;width: 72%;}

.main-video-box {position:relative; width:100%; margin-bottom:-1%; overflow:hidden;}
.main-video-box video {width:100%; height:100%; object-fit:cover;}

.video-wrap {position: relative; width: 100%; height: 50vh; overflow: hidden;}
.video-wrap .video-box video {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%; min-height: 130px; object-fit: cover;}
.video-wrap .video-layer {position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.4); width: 100%; height: 100%;}
.video-wrap .video-txt {position: absolute; top: 20%; left: 0; font-family: 'SBAggroB';
    color: white; width: 100%; height: 100%; background-color: transparent;font-size:clamp(3em, 7vw, 5em); font-weight: 500; letter-spacing: normal;
    display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}

.video-wrap2 {position: relative; width: 100%; height: 50vh; overflow: hidden;}
.video-wrap2 .video-box video {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:100%; min-height: 130px; object-fit: cover;}

.gif-wrap {position: relative; max-width: 720px;}
.gif-wrap.st1_1 {position:absolute;top:41.5%;left:12%;width:76%;}
.gif-wrap.st1_2 {position:absolute;top:44%;left:12%;width:76%;}
.gif-wrap.st1_3 {position:absolute;top:35%;left:12%;width:76%;}
.gif-wrap.st1_4 {position:absolute;top:75%;left:12%;width:76%;}
.gif-wrap.st1_5 {position:absolute;top:46%;left:12%;width:76%;}
.gif-wrap.st1_6 {position:absolute;top:44%;left:12%;width:76%;}
.gif-wrap.st1_7 {position:absolute;top:35%;left:12%;width:76%;}
.gif-wrap.st1_8 {position:absolute;top:40%;left:12%;width:60%;border:9px solid #000;border-radius: 12px;}
.gif-wrap.st2 {position:absolute;top:44%;left:12%;width:76%;}
.gif-wrap.st3 {padding:0 9% 10%;}
.gif-wrap.st4 {padding:0 9% 10%;background: #edebe7;}
.gif-wrap.st5 {padding:0% 9%;background: #effaff;}
.gif-wrap.st6 {padding:0 9% 10%;background: #f5f5f5;}
.gif-wrap.st7 {padding:0 5% 5%;background: #fffce2;}
.gif-wrap.library {padding:0 9% 10%;position:absolute;bottom:1%;}

.gif-box {width:100%;object-fit:cover;}
.gif-box img {object-fit: cover;border-radius: 20px;}
.gif-box.st1 {border: solid #d3d3d3;border-radius: 23px; border-width: 3px 3px 7px; box-sizing: border-box;}

/* 기본 스와이프 */
.mySwiper3,.mySwiper4,.mySwiper6 {margin-left:5%; padding-bottom: 7%;}

/*  단비교육 라인업 */
.mySwiper2 .mySwiper {position: relative;}
.mySwiper2 .mySwiper .swiper-slide {max-width: 120px !important; width: 100px !important; height: 80%;color: #5d5d5d;}
.mySwiper2 .mySwiper .swiper-slide-thumb-active {background-color: #16b73b;color: #fff;}
.mySwiper2 .swiper-button-next:after {
  content: "";position: absolute;top:120%; right:180%;
  background: url('https://s.wink.co.kr/marketing/events/images/2025/newLD/newLD_t10_img3_btn_left.png') no-repeat;
  background-size:contain;width: 7vw;height: 7vw; min-width: 34px;min-height: 34px;max-width: 100px; max-height: 60px;}
@media (max-width: 720px){
  .mySwiper2 .swiper-button-next:after  {position: absolute;top:70%; right:70%;min-width: 33px;min-height: 33px;}
}
.mySwiper2 .swiper-button-prev:after{
  content: "";position: absolute;top:120%; left:220%;
  background: url('https://s.wink.co.kr/marketing/events/images/2025/newLD/newLD_t10_img3_btn_right.png') no-repeat;
  background-size:contain;width: 7vw;height: 7vw; min-width: 34px;min-height: 34px;max-width: 100px; max-height: 60px;
}
@media (max-width: 720px){
  .mySwiper2 .swiper-button-prev:after  {position: absolute;top:70%; left:100%;min-width: 33px;min-height: 33px;}
}

.mySwiper2 .swiper-wrapper.tab-area {width:100% !important;flex-wrap:wrap;flex-direction: row;}
.mySwiper2 .swiper-wrapper.tab-area .swiper-slide {max-width: 26% !important;width: 90% !important; text-align:center;color:#fff;}

.mySwiper2 .swiper-wrapper.tab-cont {padding-top: 0px;}
.mySwiper2 .swiper-wrapper.tab-cont .swiper-slide img { border:0px;}

.tab-container {display: flex; position:relative; margin:0 5%; background:#333; border-radius:20px 20px 0 0;}
.tab-button { background-color: #444; cursor: pointer; margin: 0 auto; font-size: 1em; font-weight:bold;}
.tab-button.st1 {padding: 2% 8%; border-radius:20px 0 0 0;}
@media (min-width: 620px) {
  .tab-button.st1 {padding: 2% 7%;}
}
.tab-button.st2 {padding: 2% 7%; border-radius:0 0 0 0;border-left: 1px solid #000;}
@media (min-width: 620px) {
  .tab-button.st2 {padding: 2% 7%;}
}
.tab-button.st3 {padding: 2% 4%; border-radius:0 20px 0 0;border-left: 1px solid #000;}
@media (min-width: 620px) {
  .tab-button.st3 {padding: 2% 7%;}
}
.tab-button.st1.active {background-color: #ff0076;border-bottom: 3px solid #d60063; border-radius:20px 20px 0 0; margin-top: -2%;}
.tab-button.st2.active {background-color: #0fc600;border-bottom: 3px solid #0ca600; border-radius:20px 20px 0 0; margin-top: -2%;}
.tab-button.st3.active {background-color: #900bf2;border-bottom: 3px solid #7809cb; border-radius:20px 20px 0 0; margin-top: -2%;}

.tab-content {display: none; }
.tab-content.active {display: block;}

.tab-button-next {width: 40px;height:64px;font-weight: bolder;color:#fff;position: absolute;top:77%; right:0%;}
.tab-button-next:after {background-image:none !important;width: 100%;height:100%;content: "";}
.tab-button-prev {width: 40px;height:64px;font-weight: bolder;color:#fff;position: absolute;top:77%; left:0%;}
.tab-button-prev:after {background-image:none !important;width: 100%;height:100%;content: "";}

/*  특장점 체크포인트 */
.mySwiper5 {background:url('https://s.wink.co.kr/marketing/events/images/newLD/newLD_t107_img16.jpg') 52% 80% no-repeat; background-size: 75%;}
@media (max-width: 720px) {
  .mySwiper5 {background:url('https://s.wink.co.kr/marketing/events/images/newLD/newLD_t107_img16.jpg') 54% 70% no-repeat; background-size: 75%;}
}
.mySwiper5 .tab-area .swiper-slide {display: inline-block; padding: 10px 6px; border-radius: 9999px; background: #ddd;
  color: #9aa0a6;font-weight: 600;white-space: nowrap; transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;}
.mySwiper5 .tab-area .swiper-slide.is-active {background: #15b73a;color: #fff;transform: translateY(-1px);}

.mySwiper5 .swiper-pagination {position: relative;margin-top: 8%;}
@media (max-width: 720px){
  .mySwiper5 .swiper-pagination {position: relative;margin-top: 10%;}
}
.mySwiper5 .swiper-pagination-bullet-active {background-color:#16b73b;}

.mySwiper5 .swiper-button-next:after {
  content: "";position: absolute;top:120%; right:180%;
  background: url('https://us.wink.co.kr/mobile/1.1.0/renewalV2/common/arrow-indigo-right-gray.png') no-repeat;
  background-size:contain;width: 7vw;height: 7vw; min-width: 34px;min-height: 34px;max-width: 60px; max-height: 60px;}
@media (max-width: 720px){
  .mySwiper5 .swiper-button-next:after  {position: absolute;top:70%; right:70%;min-width: 33px;min-height: 33px;}
}
.mySwiper5 .swiper-button-prev:after{
  content: "";position: absolute;top:120%; left:220%;
  background: url('https://us.wink.co.kr/mobile/1.1.0/renewalV2/common/arrow-indigo-left-gray.png') no-repeat;
  background-size:contain;width: 7vw;height: 7vw; min-width: 34px;min-height: 34px;max-width: 60px; max-height: 60px;
}
@media (max-width: 720px){
  .mySwiper5 .swiper-button-prev:after  {position: absolute;top:70%; left:100%;min-width: 33px;min-height: 33px;}
}

.mySwiper5 .swiper-wrapper.tab-area {width:100% !important;flex-wrap:wrap;flex-direction: row; padding: 0 4% 8%;}
.mySwiper5 .swiper-wrapper.tab-area .swiper-slide {border-radius: 40px;max-width: 26% !important;width: 90% !important;font-size:1.7em;letter-spacing:-0.5px;padding: 0.7em; margin:0 0.7em 0.7em 0; text-align:center;color:#fff;font-weight: bold;}
@media (max-width: 720px) {
  .mySwiper5 .swiper-wrapper.tab-area .swiper-slide {border-radius: 20px;font-size:0.9em;}
}
.mySwiper5 .swiper-wrapper.tab-cont {padding-top: 0px;}
.mySwiper5 .swiper-wrapper.tab-cont .swiper-slide img { border:4px solid #fff;}

.section-19 .mySwiper .swiper-wrapper {
  transform: none !important;
}



.floating-banner {position: fixed;bottom: 0;  left: 50%;transform: translateX(-50%);z-index: 9999;max-width: 720px;background:none;padding:0;width:100%;}
.floating-banner img {width: 100%; height: auto; display: block; margin: 0 auto;}

.company-info li {width: 100%;}
.company-info .link {padding: 5px 0;}

footer {font-family:Pretendard, sans-serif; padding-bottom:60px; border-top:1px solid #e1e1e1; }