/* 2024 신규 모바일*/

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

.pdb-12 {padding-bottom: 12%;}
.pdb-50 {padding-bottom: 50%;}
.pdt-12 {padding-top: 6%;}

.bg-st1 {background: #fff4f8;} /*연분홍*/
.bg-st2 {background: #effaff;} /*연하늘*/
.bg-st3 {background: #535455;} /*진회색*/
.bg-st4 {background: #ffe6ef;} /*진분홍*/
.bg-st5 {background: #ededed;} /*연회색*/
.bg-st6 {background: #f1f3f6;} /*연회색*/
.bg-st7 {background: #f5f5f5;} /*연회색*/
.bg-st8 {background: #4fa7ff;} /*진파랑*/
.bg-st9 {background: #d3ebff;} /*연하늘*/
.bg-st10 {background: #fef37d;} /*연노랑*/
.bg-st11 {background: #e5f5ff;} /*연하늘*/
.bg-st12 {background: #ff89a9;} /*진분홍*/
.bg-st13 {background: #ffe7f5;} /*중분홍*/
.bg-st14 {background: #e9f3ff;} /*연하늘*/
.bg-st15 {background: #30b1ff;} /*진파랑*/

.cats-area {max-width: 720px;position:relative;display:block;}
.cats-btn {position:absolute;top:19%;right:8%;width:25%;}
.cats-btn2 {position:absolute;top:58%;left:7.5%;width:40%;}

.video-wrap {max-width: 720px;padding:0 6% 10%;background:#e6f4ff;background-size : contain;}
.video-wrap .video-box video {width:100%;object-fit: cover;border: 5px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}
.video-wrap.st1 {background:#fff;}
.video-wrap.st2 {background:#fff4f9;}
.video-wrap.st3 {background:#effaff;}
.video-wrap.st4 {background:#fff;padding:0 0 5%;}
.video-wrap.st5 {background:#fffdea;padding:0 0 5%;}

.video-wrap2 {max-width: 720px;padding:0 5% 5%;background: url('https://s.wink.co.kr/marketing/events/images/newLD/newLD_t102_img2.jpg');background-size : contain;}
.video-wrap2 .video-box video {width:100%;object-fit: cover;border: 5px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}
.video-wrap2 .gift-img {position:absolute;width:35%;top:35%;left:3%;z-index:10;}

.video-wrap3 {max-width: 720px;padding:0 6% 10%;background:#e6f4ff;background: url('https://s.wink.co.kr/marketing/events/images/2024/newLD/newLD_t7_img2.jpg'); background-size :  cover;}
.video-wrap3 .video-box video {width:100%;object-fit: cover;border: 5px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}

.video-wrap4 {max-width: 720px;padding:0;background:#ff4a92;background: url('https://s.wink.co.kr/marketing/events/images/2024/youtube/youtube_t1_img12.jpg'); background-size :  cover;}
.video-wrap4 .video-box video {width:100%;object-fit: cover;}

.video-wrap5 {max-width: 720px;padding:0 18% 4%;background:#ddf4ff;background: url('https://s.wink.co.kr/marketing/events/images/2024/youtube/youtube_t2_img3.jpg') bottom no-repeat; background-size :  cover;}
.video-wrap5 .video-box video {width:100%; object-fit: cover;border: 6px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}
.video-wrap5 .character1 {position: absolute; bottom:2%;left: 10.5%;width: 15%;z-index:99; filter: drop-shadow(0 1px 2px #444);}
.video-wrap5 .character2 {position: absolute; top:40.8%;right: 6.5%;width: 16%;z-index:99;}

.video-wrap6 {max-width: 720px;padding:0 18% 4%;background:#ddf4ff;background: url('https://s.wink.co.kr/marketing/events/images/2024/youtube/youtube_t3_img2.jpg') bottom no-repeat; background-size :  cover;}
.video-wrap6.st1 {max-width: 720px;padding:0 18% 4%;background:#ddf4ff;background: url('https://s.wink.co.kr/marketing/events/images/2024/youtube/youtube_t3_img2_1.jpg') bottom no-repeat; background-size :  cover;}
.video-wrap6 .video-box video {width:100%; object-fit: cover;border: 6px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}

.video-wrap7 {max-width: 720px;padding:0 8% 12%;background:#ddf4ff;background: url('https://s.wink.co.kr/marketing/events/images/2025/newLD/newLD_t2_img2.jpg') bottom no-repeat; background-size :  cover;}
.video-wrap7 .video-box video {width:100%; object-fit: cover;border: 6px solid #fff;border-radius: 20px;box-shadow: 0px 4px rgba(0, 0, 0, 0.1);}

.video-wrap8 {position: relative; width: 100%; height: 50vh; overflow: hidden;}
.video-wrap8 .video-box video {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width:150%; min-height: 130px; object-fit: cover;}
.video-wrap8 .video-layer {position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.4); width: 100%; height: 100%;}
.video-wrap8 .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;}

.gif-wrap {max-width: 720px;padding:0 6% 10%;text-align: center;}
.gif-wrap.st1 {background: #f5f5f5;}
.gif-wrap.st2 {padding:0 9% 0%;}
.gif-wrap.st3 {padding:0 9% 10%;}
.gif-wrap.st4 {background: #edebe7;}
.gif-wrap.st5 {padding:0% 9%;background: #effaff;}
.gif-wrap.st6 {padding:0%;}
.gif-wrap.st7 {padding:0 6% 3%;}
.gif-wrap.st8 {padding:7% 12% 0%; background:url('https://s.wink.co.kr/marketing/events/images/newLD/newLD_t100_img13_0.jpg') repeat-y;background-size: contain;}
.gif-wrap.st9 {padding:5%; background:url('https://s.wink.co.kr/marketing/events/images/wbooks/wbooks_t6_img12.jpg') no-repeat bottom;background-size: contain;}
.gif-wrap.library {position:absolute;bottom:1%;}
.gif-wrap .gift {position:absolute;bottom:3%;right:5%;width:30%;}
.gif-wrap .gift2 {position:absolute;top:3%;right:5%;width:30%;}
.gif-wrap .gift3 {position:absolute;bottom:1%;right:5%;width:30%;}
.gif-wrap2 {position: relative;max-width: 720px;background-size : contain;}
.gif-wrap3 {position:relative;display:block;text-align:center;max-width: 720px;}

.gif-box {width:100%;object-fit: cover;}
.gif-box img {object-fit: cover;border-radius: 20px;}
.gif-box.st1 {border: 3px solid #e4e4e4;border-radius: 22px;box-shadow: 0px 4px rgba(211, 211, 211, 0.8);}
.gif-box.st2 {position:absolute;top:33%;left:12%;width:76%;}
.gif-box.st2_1 {position:absolute;top:20.5%;left:12%;width:76%;}
.gif-box.st2_2 {position:absolute;top:32.5%;left:12%;width:76%;}
.gif-box.st2_3 {position:absolute;top:44.5%;left:12%;width:76%;}
.gif-box.st2_4 {position:absolute;top:17%;left:12%;width:76%;}
.gif-box.st2_5 {position:absolute;top:42.5%;left:12%;width:76%;}
.gif-box.st3 {position:absolute;top:68%;left:12%;width:76%;}
.gif-box.st4 {border: 4px solid #fff;border-radius: 21px;box-shadow: 0px 4px rgba(211, 211, 211, 0.8);}
/* 202312 예전랜딩
.gif-box.st5 {position:absolute;top:48%;right:11.3%;width:39%;}
.gif-box.st5 img {border-radius: 4px;}
*/
.gif-box.st5 {position:absolute;top:55.2%;right:11.3%;width:39%;}
.gif-box.st5 img {border-radius: 4px;}
.gif-box.st6 {position:absolute;top:45.2%;right:11.3%;width:39%;}
.gif-box.st6 img {border-radius: 4px;}
.gif-box.st7 {position:absolute;top:55.2%;right:11.3%;width:39%;}
.gif-box.st7 img {border-radius: 4px;}
.gif-box.st8 {position:absolute;top:49.2%;right:11.5%;width:39%;}
.gif-box.st8 img {border-radius: 4px;}
.gif-box.st9 {border: 4px solid #ff5f8b;border-radius: 24px;position:absolute;top:62%;left:12%;width:76%;}
.gif-box.st9_1 {border: 4px solid #ff5f8b;border-radius: 24px;position:absolute;top:47.5%;left:12%;width:76%;}
.gif-box.st10 {border: 4px solid #33a1ff;border-radius: 24px;position:absolute;top:64%;left:12%;width:76%;}
.gif-box.st11 {border: 4px solid #ff5f8b;border-radius: 24px;position:absolute;bottom:2.7%;left:12%;width:76%;}
.gif-box.st12 {border: 6px solid #000;border-radius:12px;}
.gif-box.st12 img {border-radius: 6px;}
.gif-box.st13 {border-radius: 24px;position:absolute;top:68%;left:7%;width:86%;}
.gif-box.st14 {position:absolute;bottom:4.5%;left:12%;width:76%;}
.gif-box.st14_1 {position:absolute;bottom:11.5%;left:12%;width:76%;}

.gif-box2 {position:absolute;top:8%;left:13%;width:74%;}
.gif-box2 img {object-fit: cover;border-radius:25px;}

.gif-box4 {position:absolute;top:55.2%;right:11.3%;width:39%;}
.gif-box4 img {border-radius: 4px;}

.mySwiper .swiper-slide {max-width: 120px !important; width: 100px !important; height: 80%;background-color: #dddddd;color: #5d5d5d;border-radius:15px;padding:6px 4px;margin:0 5px 5px 0; font-weight: bold;font-size: 0.9em;}
.mySwiper .swiper-slide-thumb-active {background-color: #16b73b;color: #fff;}
.mySwiper2 {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) {
  .mySwiper2 {background:url('https://s.wink.co.kr/marketing/events/images/newLD/newLD_t107_img16.jpg') 54% 70% no-repeat; background-size: 75%;}
}
.mySwiper3 {margin-left:8%;}
.mySwiper4 {background:#535455;padding:10% 1% 10% 3%;}
.mySwiper5 {margin-left:8%;}
.mySwiper6 {background:#ededed url('https://s.wink.co.kr/marketing/events/images/2024/newLD/newLD_t10_img30_1.jpg') 50% 50% no-repeat; background-size: 85%;padding:2% 8%;}
.mySwiper7 {background:#effafe url('https://s.wink.co.kr/marketing/events/images/2024/newLD/newLD_t11_img2.jpg') no-repeat; background-size: contain;padding:5% 18%;}
.mySwiper8 {margin-left:8%;}
.mySwiper9 {background:#76caff; background-size: contain; padding:8% 22% 12%;}
.mySwiper10 {background:#fff; background-size: contain; padding:8% 22% 12%;}

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

.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){
  .swiper-button-next:after  {position: absolute;top:70%; right:70%;min-width: 33px;min-height: 33px;}
}
.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){
  .swiper-button-prev:after  {position: absolute;top:70%; left:100%;min-width: 33px;min-height: 33px;}
}

.swiper-wrapper.tab-area {width:100% !important;flex-wrap:wrap;flex-direction: row; padding: 0 4% 8%;}
.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) {
  .swiper-wrapper.tab-area .swiper-slide {border-radius: 20px;font-size:0.9em;}
}
.swiper-wrapper.tab-cont {padding-top: 0px;}
.swiper-wrapper.tab-cont .swiper-slide img { border:4px solid #fff;}

.button-container {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: -130%;padding-bottom: 30px;}
.button-container img {max-width: 100%; width: 77%; display: block; margin: 0 auto;}

.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 {padding-bottom:60px; border-top:1px solid #e1e1e1;}

/* 유튜브 움직이는 텍스트 랜딩 */
.ani-area {padding:20% 0 22%; background:#33bcff; background: url('https://s.wink.co.kr/marketing/events/images/2024/youtube/youtube_t1_img2.jpg'); background-size :  cover;}
.ani-area img {display:block; margin: auto;padding-bottom: 3%;}
.ani-area .ani1 {width: 56%;}
.ani-area .ani2 {width: 86%;}
.ani-area .ani3 {width: 68%; padding-left: 22%;}
.tit-no1 {position: absolute; top: 58%; left: 0%;width: 42%;}
.ani1, .ani2, .ani3 {opacity: 0;transform: translateY(50px);transition: opacity 0.5s ease, transform 0.5s ease;}
.animated {opacity: 1; transform: translateY(0);}