img{max-width:100%}#app{padding-bottom:72px;padding-bottom:calc(constant(safe-area-inset-bottom) + 72px);padding-bottom:calc(env(safe-area-inset-bottom) + 72px)}body,html{min-width:320px;overflow-x:hidden;background-color:#101010!important}.btn{display:inline-block;height:48px;padding:0 20px;font-size:14px;line-height:46px;color:#fff;text-align:center}.btn-primary{border:1px solid #1351f9;border-radius:4px;background-color:#1351f9}.btn-floating{position:fixed;bottom:0;left:16px;right:16px;z-index:10;padding-bottom:calc(constant(safe-area-inset-bottom));padding-bottom:calc(env(safe-area-inset-bottom));opacity:0;-webkit-transition:all .5s ease-in-out;transition:all .5s ease-in-out}.btn-floating.on{bottom:24px;opacity:1}.sub-title,.title{color:#fff}.title{font-size:32px;line-height:44px}.sub-title{font-size:16px;line-height:24px}.sub-title span{display:block}.notice{padding:0 50px;opacity:0}.notice span{position:relative;padding-left:6px;font-size:12px;line-height:18px;color:hsla(0,0%,100%,.7)}.notice span:before{content:"";display:inline-block;position:absolute;top:9px;left:0;width:1px;height:1px;border:1px solid hsla(0,0%,100%,.7);border-radius:50%;background-color:hsla(0,0%,100%,.7);-webkit-box-sizing:border-box;box-sizing:border-box}.header{position:fixed;top:0;left:0;right:0;z-index:10;padding:11px 16px;background-color:rgba(16,16,16,.9);font-size:0}.header h1{display:inline-block;padding:7px 0}.header .link-login{position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);padding:0 16px;font-size:14px;line-height:56px;color:#fff}.main{text-align:center}.section{padding:50px 0}.section:last-child{padding-bottom:0}.title+.sub-title{margin-top:20px}.sub-title+.btn{margin:40px 0}#section1{padding-top:96px}#section1 #fluidSwiper{opacity:0}#fluidSwiper .swiper-wrapper{-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}#section1.on #fluidSwiper{-webkit-transition-property:opacity;transition-property:opacity;-webkit-transition-duration:1.5s;transition-duration:1.5s;-webkit-transition-delay:1.5s;transition-delay:1.5s;opacity:1}#section1 .swiper-slide:nth-child(6n-4){margin-top:120px}#section1 .swiper-slide:nth-child(6n-3){margin-top:40px}#section1 .swiper-slide:nth-child(6n-2){margin-top:90px}#section1 .swiper-slide:nth-child(6n-1){margin-top:30px}#section1 .swiper-slide:nth-child(6n){margin-top:70px}#section2{padding:50px 0 40px}.coupon{position:relative;top:10px;width:280px;margin:20px auto 0;padding:20px 29px 20px;opacity:0}.coupon:after{content:"";display:block;height:8px;margin-top:10px;background-image:-webkit-gradient(linear,left top,right top,from(rgba(16,16,16,0)),color-stop(51%,#303030),to(rgba(16,16,16,0)));background-image:linear-gradient(90deg,rgba(16,16,16,0) 0,#303030 51%,rgba(16,16,16,0))}.coupon img{position:relative;z-index:1}.coupon+.notice{margin-top:20px}#section3 .content-area{background-image:url(../img/03-contents-img-device@3x.2ea59292.png);background-repeat:no-repeat;background-position:top;background-size:64% auto;opacity:0;-webkit-transition:opacity 1.5s ease-in-out .5s;transition:opacity 1.5s ease-in-out .5s}#fadeSwiper{margin-top:64px;padding-top:30px}#fadeSwiper .swiper-wrapper{-webkit-transition-timing-function:ease-in-out!important;transition-timing-function:ease-in-out!important}#fadeSwiper .swiper-slide .content-image{position:relative}#fadeSwiper .swiper-slide .content-image:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;background-color:rgba(0,0,0,.5);-webkit-transition:background-color .5s ease-in-out;transition:background-color .5s ease-in-out}#fadeSwiper .swiper-slide-active .content-image:before{background-color:transparent}#textFadeSwiper .swiper-slide .content-text{opacity:0;-webkit-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out}#textFadeSwiper .swiper-slide.swiper-slide-thumb-active .content-text{opacity:1;-webkit-transition:opacity 1.5s ease-in-out;transition:opacity 1.5s ease-in-out}#textFadeSwiper .swiper-pagination.swiper-pagination-bullets{position:static;width:60%;margin:56px auto 0;font-size:0}#textFadeSwiper .swiper-pagination-bullet{width:auto;height:auto;padding:4px 0;margin:0 6px;border-bottom:2px solid transparent;border-radius:0;background-color:transparent;color:#717171;font-size:16px;line-height:24px;opacity:1}#textFadeSwiper .swiper-pagination-bullet.swiper-pagination-bullet-active{border-bottom:3px solid #fff;color:#fff}.content-text{width:60%;margin:0 auto;padding:12px 28px 0;font-size:0;text-align:left}.content-title{position:relative;padding-right:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:18px;color:#fff}.content-title:after{content:"";position:absolute;top:6px;right:0;width:0;height:0;border-top:5px solid #a5a5a5;border-bottom:8px solid transparent;border-right:4px solid transparent;border-left:4px solid transparent}.content-metadata{font-size:10px;line-height:12px;color:#a5a5a5}.content-title+.content-metadata{margin-top:4px}.content-metadata span{display:inline-block;vertical-align:middle}.content-metadata .icon-dotted{margin:0 4px;border:1px solid #a5a5a5;border-radius:50%}.quick-vod-area{height:228px;margin-top:40px;background:url(../img/04-quick-vod-background@3x.118cf910.png) repeat-x 50%/contain}.timer{height:24px;overflow:hidden;font-size:0;text-align:center;opacity:1;-webkit-transition:opacity .5s ease-in-out 4.5s,height 1s ease-in-out 4.5s;transition:opacity .5s ease-in-out 4.5s,height 1s ease-in-out 4.5s}.section.on .timer{height:0;opacity:0}.timer .timer-icon,.timer div,.timer img,.timer span{display:inline-block;vertical-align:middle}.timer img{width:24px;height:24px}.timer .timer-frame{overflow:hidden;height:24px;margin-left:8px}.timer ol,.timer span{font-size:16px;line-height:24px;color:#fff}.timer ol{display:-ms-flexbox;display:-webkit-box;display:flex;-moz-flex-direction:column-reverse;-ms-flex-direction:column-reverse;-webkit-box-orient:vertical;-webkit-box-direction:reverse;flex-direction:column-reverse;position:relative;top:-400%}.device{position:relative;width:300px;height:184px;margin:20px auto 0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABbgAAAOEAgMAAAAeWr9dAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTAAAAAAAAAAAAAu23DQAAAADdFJOUwC+jGQ+iOMAAATXSURBVHja7dy7CYBAEEXRwdSirGLrsRVjm7AFG/ITb7KwCAOL5+YPhlPAxKPEAgFu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3LiFG7dw4xZu3LiFG7dw4xZu3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LhxCzdu4cYt3LhxCzdu4cYt3LhxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3LiFG7dw4xZu3LiFG7dw4xZu3LiFG7dw48aNADdu4cYt3LhxCzdu4cYt3LhxCzdu4cYt3LhxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3LiFG7dw4xZu3LiFG7dw4xZu3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LhxCzdu4cYt3LhxCzdu4cYt3LhxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hx40aAG7dw4xZu3LiFG7dw4xZu3LiFG7dw4xZu3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LhxCzdu4cYt3LhxCzdu4cYt3LhxCzdu4cYt3LhxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu4caNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3MKNG7dw4xZu3LiFG7dw4xZu3LiFG7dw4xZu3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFG7dw48Yt3LiFGzdu4cYt3LiFGzdu4cYt3LiFGzdu4cYt3LhxI8CNW7hxCzdu3MKNW7hxCzdu3MKNW7hxCzdu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7hx4xZu3MKNW7izuctIrfXxZbhiqJZK+w7hxi3cuIUbN27hxi3cuIUbN27hxi3cuHHjxo1buHELN27cwo1buHELN27cwo1buHHjxo0bt3DjFm7cuHHjxi3cuIUbN27hxi3cuIX7e9Pe11FxX53r7e/cc+q/2xM3bty4cePGjRs3bty4cePGjRs3bty4cePGjRs37lYvAYacMX2/bNAAAAAASUVORK5CYII=);background-repeat:no-repeat;background-position:50%;background-size:contain;-webkit-transition:all 1s ease-in-out 4.5s;transition:all 1s ease-in-out 4.5s}.section.on .device{width:258px;height:144px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABP4AAALKAgMAAADfVXfSAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURUdwTAAAAAAAAAAAAAu23DQAAAADdFJOUwC2RU5feP8AAATjSURBVHja7di9TWNBFIbhgwkQELgEl0AJdhMkRHRiOqEUXIIjRLISJTgARADm18a7OPGd764Q0vOW8OjOPWemat3R6Yt2689ZbXc4BbN711t+A36duvkOeMmkW+ffDjCRjj34APv8BH2A4Sd4wqN7EyO4t0F8TKOh5QZwRCM7w05wU/O13z6Lpu7WgEMWbV2sAMcosp+gX2Bji0+/PRLZT/CARGPP7nG9TJErEK3dmiE9rNJmSDhFvCS092QI9zCGDeFwDI8wZJc5W0y4x9hisj1mQCHo0RoYL4Keo8NF0B6dtLRHx5v0kEKSi0h8FXERCa8iAEPAMYSkmatwehkGGAJOISTNAQIE+LsBGUQtAAIECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIECBAgQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBAgQIAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAAAQIECBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIECBAgQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQIAAAQIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQIECBAgQIACCBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBAgQAEECBCgAAIECFAAAQIEKIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAEECBCgAAIECBAgQIAAAQIUQIAAAQogQIAABRAgQIACCBAgQAH874BTCAB/sDlAgAB/N+AVhKRbgCngGELSrEYQkiYAU8ATCEkXNYSQVHUAIei56phC0LJqn0LQU9UehaC7qgGFoMcqrwlJ8zdAl+HoKlyuItlFpFxFsouITTrco23S4R5tj0m3GHtM0OID0B7T3OwD0BiOhrAxHA5hzwnRU4Ipkt6E3xujSGaIKdLcys9PMPwF+gmGv0AvWo1NvgC9JzS/JHw2cIYbutkAOsPZCTaHW3qov7sE0rXzfwAPgUQfoE8w/AAN4mQErw4xwQ5d13ZHp1x27P5sw/YKgQ8IM9XhwXkAAAAASUVORK5CYII=)}.viewport{position:absolute;top:4px;right:4px;bottom:20px;left:4px;border-radius:0;overflow:hidden;-webkit-transition:bottom 1s ease-in-out 4.5s,border-radius 1s ease-in-out 4.5s;transition:bottom 1s ease-in-out 4.5s,border-radius 1s ease-in-out 4.5s}.section.on .viewport{bottom:4px;border-radius:6px}.viewport img.screen{display:block;position:absolute;top:50%;left:50%;max-width:unset;max-height:100%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.device .tag-quick-vod{position:absolute;top:12px;left:-40px;width:100px;height:29px;opacity:0;-webkit-transition:all 1s ease 5.5s;transition:all 1s ease 5.5s}.section.on .device .tag-quick-vod{left:-19px;opacity:1}.section .link-privacy{display:block;position:relative;z-index:30;padding:40px 0;text-align:center}.section .link-privacy span{font-size:12px;line-height:18px;color:#a5a5a5;text-decoration:underline}.section .sub-title,.section .title{position:relative;top:40px;opacity:0}.section .title{-webkit-transition:top .8s ease-in-out .4s,opacity 1s ease-in-out .6s;transition:top .8s ease-in-out .4s,opacity 1s ease-in-out .6s}.section .sub-title{-webkit-transition:top .8s ease-in-out .6s,opacity 1s ease-in-out .8s;transition:top .8s ease-in-out .6s,opacity 1s ease-in-out .8s}.section.on .sub-title,.section.on .title{top:0;opacity:1}.section .btn-animation{position:relative;opacity:0;-webkit-animation:btnAnimation 1s ease 1.2s 1 normal forwards;animation:btnAnimation 1s ease 1.2s 1 normal forwards}@-webkit-keyframes btnAnimation{0%{opacity:0}to{opacity:1}}@keyframes btnAnimation{0%{opacity:0}to{opacity:1}}.section.on .coupon{top:0;opacity:1;-webkit-transition:top 1s ease-in-out 1.6s,opacity 1s ease-in-out 1.3s;transition:top 1s ease-in-out 1.6s,opacity 1s ease-in-out 1.3s}@-webkit-keyframes couponMotion{0%{top:0}25%{top:-10px}75%{top:20px}to{top:0}}@keyframes couponMotion{0%{top:0}25%{top:-10px}75%{top:20px}to{top:0}}.section.on .coupon img{-webkit-animation:couponMotion 1.6s linear 1.7s;animation:couponMotion 1.6s linear 1.7s}@-webkit-keyframes shadowMotion{0%{opacity:1}66%{opacity:0}to{opacity:1}}@keyframes shadowMotion{0%{opacity:1}66%{opacity:0}to{opacity:1}}.section.on .coupon:after{-webkit-animation:shadowMotion .9s linear 2.1s;animation:shadowMotion .9s linear 2.1s}.section.on .notice{opacity:1;-webkit-transition:opacity .8s ease-in-out 2.8s;transition:opacity .8s ease-in-out 2.8s}#section3.on .content-area{opacity:1}.section.on .timer ol{-webkit-animation:timerAnimation 2s ease-in-out 1.5s 1 normal forwards;animation:timerAnimation 2s ease-in-out 1.5s 1 normal forwards}@-webkit-keyframes timerAnimation{0%{top:-400%}25%{top:-300%}50%{top:-200%}75%{top:-100%}to{top:0}}@keyframes timerAnimation{0%{top:-400%}25%{top:-300%}50%{top:-200%}75%{top:-100%}to{top:0}}@media (min-width:768px) and (orientation:portrait),(min-width:1024px) and (orientation:landscape){.sub-title span{display:inline}.notice{margin-top:0}#section1 .swiper-slide:nth-child(6n-4){margin-top:180px}#section1 .swiper-slide:nth-child(6n-3){margin-top:60px}#section1 .swiper-slide:nth-child(6n-2){margin-top:135px}#section1 .swiper-slide:nth-child(6n-1){margin-top:45px}#section1 .swiper-slide:nth-child(6n){margin-top:105px}.coupon{width:370px;margin-top:30px;padding:30px 39px}.coupon:after{height:10px;margin-top:20px}.coupon+.notice{margin-top:30px}#section3 .content-area{background-size:29% auto}#textFadeSwiper .swiper-pagination.swiper-pagination-bullets,.content-text{width:29%}.btn-floating{width:480px;left:50%;right:auto;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.quick-vod-area{height:344px}.device{width:489px;height:301px}.section.on .device{width:413px;height:230px}.viewport{top:6px;right:6px;bottom:33px;left:6px}.section.on .viewport{bottom:6px;border-radius:17px}.device .tag-quick-vod{width:160px;height:46px;top:20px}.section.on .device .tag-quick-vod{left:-24px}}@media screen and (min-width:1024px){#section3 .content-area{background-size:25% auto}#textFadeSwiper .swiper-pagination.swiper-pagination-bullets,.content-text{width:25%}}@media screen and (max-width:374px){#textFadeSwiper .swiper-pagination.swiper-pagination-bullets{width:100%}}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{border-left:0;border-right:0;border-top:0}