@charset "UTF-8";

#wrapper{min-width:1024px; padding-top:136px;}
.contentWrap{width:1024px; margin: 0 auto;}
#container .section{position:relative;}
#container .section .contWver2{width:860px; margin:0 auto;}

.slick-dots{width: 100%; text-align: center; padding: 20px 0 10px;}
.slick-dots li button{display:block; text-indent:-9999px; border-radius:50%; width:18px; height:18px; background:#fff; overflow:hidden; border:1px solid #c5c5c5;}
.slick-dots li{display:inline-block; margin:0 4px}
.slick-dots li.slick-active button{background:#634587; border-color: #634587;}

#header{position: fixed; top: 0; width: 100%; padding: 20px 0; background: #f4f4f4;z-index: 13;}
#header h1 {text-align:center;}
#header h1 a span{display:inline-block; width:100%; vertical-align:middle;}
#header h1 a span:first-of-type{padding-bottom:10px;}

#container .sec01{height:970px; background:url(/static/images/main/visualImg2.jpg)no-repeat 50% 50%; text-align: center;}
#container .sec01 p{padding: 85px 0 12px;font-size:25px;font-weight:400;color:#cec3ff;text-align: center;}
#container .sec01 p span{ display:block; opacity: 0;}
#container .sec01 p span:last-of-type{padding-top: 20px;}
#container .sec01 p b{color:#ffffff;}
#container .sec01 .btnArea{position: absolute; left: 50%; bottom:55px; transform: translateX(-50%);}
#container .sec01 .videoTab{display: flex; max-width: 680px; margin: 0 auto; }
#container .sec01 .videoTab .tabA, #container .sec01 .videoTab .tabB{width: 338px; height:60px; text-align: center; line-height: 60px;background: #d2c5e2;}
#container .sec01 .videoTab .tabA{margin-right: 4px;}
#container .sec01 .videoTab .active{background: #a385c5;}
#container .sec01 .videoTab .tabA a, #container .sec01 .videoTab .tabB a{display: block; width: 100%; height: 100%; font-size: 26px; color:#fff;}
#container .videoArea{position: absolute; left: 50%; transform: translateX(-50%); top: 467px; width: 680px;  margin: 0 auto;}
#container .videoArea .pcPlayBtn{position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); z-index: 11;}
#container .videoArea .btnArea{position: absolute; right: 0; bottom: -55px;}

#container .sec01 .title{color: #fff; font-size: 34px;padding: 60px 0 30px;}
#container .sec01 .visualCont{padding: 45px 0 0;}
#container .sec01 .visualCont span{display: block;color: #fff;font-size: 22px;padding: 30px 0;line-height: 8px;}
#container .sec01 .visualCont span > span{font-size: 30px;}
#container .sec01 .visualCont .btnArea{padding-bottom: 40px;}
#container .sec01 .visualCont ul{display:flex; justify-content:center;}
#container .sec01 .visualCont ul li:first-of-type{margin-right:20px;}

#container .sec02 .comIntroArea{text-align:center;}
#container .sec02 .comIntroArea p{ font-size: 22px; color: #666666; line-height: 42px; padding-bottom: 50px;}
#container .sec09{height:459px; background:url(/static/images/main/mainbg03.jpg)no-repeat 50% 50%;}
#container .sec09 .title{padding-top: 30px;  font-size: 34px;text-align: center;}
#container .sec09 .titex{display: block; font-size: 22px; padding-top: 10px; line-height: 36px;}
#container .sec09 .titex b{font-size:30px;}
#container .sec09 .btnArea{padding-top: 40px; text-align: center;}
#container .sec09 .btnArea a{margin-left: -330px;}

#container .sec03{background: #f1f1f1;}
#container .sec03 strong{ display: inline-block; color: #5d358c; font-size: 20px; font-weight: 600; padding-top: 30px; padding-bottom: 20px;}
#container .sec03 .supportComArea{padding-bottom:20px}
#container .sec03 .supportComSlide{width: 855px; margin: 0 auto;}
#container .sec04{background:url(/static/images/main/mainbg01.jpg);}
#container .sec04 .contentWrap{text-align: center;}
#container .sec04 .imgArea{padding: 30px 0 40px;}
#container .textSlide{width:720px; margin:0 auto;}
#container .textSlide p{ position: relative; font-size: 28px; color: #fff; padding: 10px 50px;}
#container .textSlide p:before,
#container .textSlide p:after{ content:''; position: absolute; width:46px; height: 34px; opacity: 0.5;}
#container .textSlide p:before{top: 0; left: 0; background:url(/static/images/main/iconImg03.png) no-repeat;}
#container .textSlide p:after{bottom: 0; right:0; background:url(/static/images/main/iconImg04.png) no-repeat;}
#container .sec04 .btnArea{padding: 20px 0 40px; box-sizing: border-box;}
#container .sec04 b{color: #fff799;}
#container .sec04 .prizeTxt{position: relative;    padding-top: 30px; font-size:24px; color:#fff;}
#container .sec04 .prizeTxt:before{ content:''; position: absolute; top: 50%;left: 140px; width: 69px; height: 70px; transform: translateY(-50%); background:url(/static/images/main/iconImg06.png)no-repeat 50% 50%;}
#container .sec05{background:#f5f5f5; text-align:center;}
#container .sec05 strong{display:inline-block; padding: 40px 0 30px;}
#container .sec05 .title{line-height: 35px;}
#container .sec05 .title b{font-size:34px; color: #5d358c;}
#container .sec05 .title span{display:block; padding-top: 10px; font-size: 22px; color: #333333;}
#container .productArea .pordutTit{padding:50px 0 20px;}
#container .productSlide{width: 890px; margin: 0 auto;}
#container .productSlide .productList li{display: inline-block; width: 212px; vertical-align: top; margin-right: 10px; background: #fff;}
#container .productSlide .productList li:last-of-type{margin-right:0;}
#container .productSlide .productList li .thum{position:relative; padding: 0;}
#container .productSlide .productList li .thum .deliveryIcon{position:absolute; top:0; right:10px;}
#container .productSlide .productList li p{ height: 53px; margin-top: 10px; padding: 0px 5px; letter-spacing: -1.3px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#container .productSlide .productList li .btnArea{padding: 20px 0;}
#container .productSlide .productList li .btnArea .buyBtn{padding: 8px 35px; font-size: 21px;  color: #fff;}
#container .productSlide .productList li .btnArea .buyBtn.btn01{background: #55bae4;}
#container .productSlide .productList li .btnArea .buyBtn.btn02{background: #5d358c;}
#container .productSlide .slick-dots{padding: 20px 0 30px;}

#container .sec06 {background:url(/static/images/main/mainbg01.jpg); text-align:center;}
#container .header{text-align:center;}
#container .header strong{display:inline-block; padding: 40px 0 20px; }
#container .header p{font-size:34px; color:#fff;}
#container .sec06 .header .hashArea{padding: 20px 0 40px;}
#container .sec06 .header .hashArea span{ display:inline-block; vertical-align:top; margin-right: 10px; margin-bottom:10px; padding: 5px 12px; font-size: 22px; color: #5d358c; border-radius: 30px; background: #fff;}
#container .sec06 .header .hashArea span:last-of-type{margin-right:0;}
#container .sec06 .thumListArea {padding-bottom: 50px;}
#container .sec06 .thumListArea li{display:inline-block; vertical-align:middle;}
#container .sec06 .thumListArea img:first-of-type{margin-right:10px;}
#container .sec10{padding: 30px 0 45px; background: url(/static/images/main/sec10_bg.jpg);}
#container .sec10 .cardSlideWrap{padding-top:30px;}
#container .sec10 .cardSlide{width: 562px; margin: 0 auto;}
#container .sec10 .cardSlide .slick-slide img{border-radius: 20px; border:2px solid #fff;}
#container .sec10 .cardSlide .slick-arrow{text-indent:-9999px; position:absolute; top: 50%; transform: translateY(-50%); width:33px; height:61px;}
#container .sec10 .cardSlide .slick-prev{left:-45px; background:url(/static/images/main/prev.png) no-repeat 50% 50%;}
#container .sec10 .cardSlide .slick-next{right:-45px; background:url(/static/images/main/next.png) no-repeat 50% 50%;}
#container .sec10 .cardTab ul{display: flex;justify-content:center; text-align:center;}
#container .sec10 .cardTab ul li{width: 130px; margin-right: 14px; opacity:0.7; }
#container .sec10 .cardTab ul li:last-of-type{margin-right:0;}
#container .sec10 .cardTab ul li a{display:block;width: 100%; height:100%;}
#container .sec10 .cardTab ul li a img{width:100%;  border-radius: 10px; border: 2px solid #fff;}
#container .sec10 .cardTab ul li a span{display:block; font-size: 22px;color: #fff;padding-top: 10px;}
#container .sec10 .cardTab ul li.on{opacity:1;}
#container .sec10 .cardTab ul li.on  a span{font-weight: bold;}

#container .sec07 .newsList{padding: 50px 0 80px;}
#container .sec07 .newsList li{position: relative; padding: 10px;  border-bottom: 1px solid #dbdbdb; }
#container .sec07 .newsList li:last-of-type{border-bottom: 0;}
#container .sec07 .newsList li a{width:100%; height:100%;}
#container .sec07 .newsList li p{ height: 28px; font-size: 18px; padding-right: 70px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#container .sec07 .newsList .moreBtn{ position: absolute; top: 50%; right: 10px; width: 52px; height: 13px; margin-top: -5px; background: url(/static/images/main/moreBtn.png) no-repeat; text-indent:-999999px;}
#container .sec08{height:393px;	background:url(/static/images/main/mainbg02.jpg)no-repeat 50% 50% #0e101a; text-align: center;}
#container .sec08 p{padding:55px 0 30px; font-size:30px; font-weight: 500; color: #fff;}
#container .sec08 > span{display:block; text-align:center; padding-top:26px; font-size:20px; color:#fff;}
#container .sec08 p > span{ width: 420px; margin: 20px auto 0; padding: 10px 0; font-size: 20px; line-height: 27px; box-sizing: border-box;}
#container .sec08 p > span b{color:#fff799; }
.textdec{position: relative; display: block;}
.textdec:before,
.textdec:after{content:'';position: absolute;width: 30px;height: 26px;opacity: 0.5;}
/* .textdec:before{top: 0; left: 0; background:url(/static/images/main/iconImg03.png) no-repeat; background-size: 100%;}
.textdec:after{bottom: 0; right:0; background:url(/static/images/main/iconImg04.png) no-repeat; background-size: 100%;} */

#container .sec11 {background:url(/static/images/main/mainbg05.jpg)50% 50%; height:434px; text-align:center;}
#container .sec11 strong{font-size: 34px;}
#container .sec11 .title{padding-top: 45px;  font-size: 34px;text-align: center;}
#container .sec11 p > span{font-size: 22px; padding-top:15px; display: block; color: #1d1d1e; line-height:1.5;}

#footer{background:#3b3b3b; text-align: center;}
#footer .sec01 ul li a,
#footer .sec02 .copy,
#footer .sec02 .copy p{font-size: 15px; color:#818181;}
#footer .section{position:relative;}
#footer .sec01{padding: 50px 0 20px; border-bottom:1px solid #5e5e5e;}
#footer .sec01 ul li{display:inline-block; vertical-align:top;}
#footer .sec01 ul li:after{content: '|';display: inline-block;color: #818181;padding: 0 15px;box-sizing: border-box;}
#footer .sec01 ul li:last-of-type:after{display:none;}
#footer .sec01 ul li a:first-of-type{ color:#d7d7d7;}
#footer .sec02{padding: 30px 0 70px;}
#footer .sec02 .copy{padding-top:10px}
#footer .sec02 .copy span{display:block;}

#layerBgArea{position:fixed; top:0; left:0; width:100%; height:100%; z-index:11; background:#000; opacity:.4;}
.applyPopOpen{ position:absolute; left:50%; transform: translateX(-50%); width:495px; text-align: center; border-radius: 10px; background:#fff; overflow: hidden; z-index:11;}
.applyPopOpen .popClose{position:absolute;top: 12px;right:12px;}
.applyPopOpen .cont01{padding: 40px 0 20px; background: url(/static/images/main/popBg.png);}
.applyPopOpen .cont01 .header p {color: #fff; letter-spacing: -1px; font-family:"NotoSans",sans-serif; }
.applyPopOpen .cont01 .header .title{ padding: 10px 0; font-size:30px;}
.applyPopOpen .cont01 .header .tit2{font-size:22px;}
.applyPopOpen .cont01 .header .tit2 span{display: inline-block; text-decoration: underline;}
.applyPopOpen .popProductImg{width: 278px; height: 278px; overflow: hidden; margin: 35px auto 10px auto; border-radius: 50%;}
.applyPopOpen .popProductImg img{width:100%; height:100%;}
.applyPopOpen .popCom p{font-size: 20px; color: #151515; padding-top: 10px;}
.applyPopOpen .cont02{padding: 25px;}
.applyPopOpen textarea,
.applyPopOpen input{border: 1px solid #e8e8e8;}
.applyPopOpen textarea,
.applyPopOpen input{font-size: 24px;}
.applyPopOpen .cont02 textarea{height: 130px; padding: 10px;}
.applyPopOpen .userInfoArea{padding: 30px 20px 10px; border-bottom: 1px dashed #e4e4e4;}
.applyPopOpen .userInfoArea li{position:relative; padding-left: 115px; margin-bottom: 15px;}
.applyPopOpen .userInfoArea li label,
.applyPopOpen .userInfoArea li span{font-size: 22px;}
.applyPopOpen .userInfoArea li label{ position:absolute; top:0; left:0; width:100px; padding: 6px 15px; margin-right: 10px; border-radius: 20px; background: #5d358c; color: #fff;}
.applyPopOpen .userInfoArea li .numWrap{position: relative; padding-left:40px;}
.applyPopOpen .userInfoArea li span{display:inline-block; vertical-align:middle;}
.applyPopOpen .userInfoArea li span:first-of-type{position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.applyPopOpen .userInfoArea li span:nth-of-type(2),
.applyPopOpen .userInfoArea li span:nth-of-type(3){position: relative; width:49%; padding-left:20px;}
.applyPopOpen .userInfoArea li span:nth-of-type(2):before,
.applyPopOpen .userInfoArea li span:nth-of-type(3):before{ content:'-'; position: absolute; top: 6px; left: 5px;}
.applyPopOpen .checkArea{text-align: left; padding: 12px 0;}
.applyPopOpen .checkArea input{ width:30px; height: 30px; appearance: none; -moz-appearance: none; -webkit-appearance: none; cursor: pointer; border: 0; box-shadow: none; outline: none; border-radius: 0 !important; background: rgba(255,255,255,0) url(/static/images/common/check.png) no-repeat 0 0 !important;}
.applyPopOpen .checkArea input:checked{background:rgba(255,255,255,0) url(/static/images/common/checked.png) no-repeat 0 0 !important;}
.applyPopOpen .checkArea label{font-size: 18px; color: #333333;}

.popInfoBox{padding: 20px; font-size: 16px; text-align: left; background: #f5f5f5;}
.popInfoBox li{position:relative; padding-left: 10px;}
.popInfoBox li:before{ content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 3px; height: 3px; border-radius: 50%; background: #333333;}
.applyPopOpen .btnArea{padding-bottom: 30px;}
.floatingPop{ position: fixed; bottom: 0; left: 0; width: 100%; height: 49px; text-align: center; background: url(/static/images/main/floatingBg.png); z-index:11;}
.floatingPop .flotingIcon{ position:absolute; top: -227px; right:88%; width:178px; height:274px; background: url(/static/images/main/floatingPop.png)no-repeat; animation-name:floatMotion; animation-duration: 20s; animation-fill-mode: both; animation-iteration-count:1;}
.floatingBtn{ position: fixed; bottom: 50px; left: 50%; z-index: 100; margin-left: 360px;}
.floatingWrap{width: 161px;padding-top: 25px;}
.floatingWrap p{font-size:18px;color:#3f517a; letter-spacing: -1px;}
.floatingWrap p b{font-size:24px;}

.newPdtPopup{ position:absolute; top:200px; left:50%; transform: translateX(-50%); width:478px; height:1017px; z-index:15; background:url(/static/images/main/bg_letter.png) no-repeat 0 0;}
.newPdtPopup .popInner{position:relative;}
.newPdtPopup .letter {margin:536px 0 111px 73px; width:324px; height:325px;}
.newPdtPopup .letter .slick-prev, .newPdtPopup .letter .slick-next {position:absolute; left:-46px; top:172px; width:17px; height:36px; overflow:hidden; text-indent:100%; white-space:nowrap; background:url(/static/images/main/btn_prev.png) no-repeat 0 0;}
.newPdtPopup .letter .slick-next {left:initial; right:-46px; background-image:url(/static/images/main/btn_next.png);}
.newPdtPopup .btnArea{position:absolute; bottom: 4%; left: 50%; transform: translateX(-50%); width: 60%;}
.newPdtPopup .closeBtn{position:absolute; top: 2%; right: 2%; width: 4%;}
.newPdtPopup #todayClose{background: #fff; margin-right:20px; text-align: right; line-height: 1;}
.newPdtPopup #todayClose label{cursor: pointer;}
.newPdtPopup #todayClose input[type=checkbox]{margin-top: -6px; margin-left:2px; width: 22px; height: 22px; background: url(/static/images/common/check.png)no-repeat center/100%; cursor: pointer;}
.newPdtPopup #todayClose input[type=checkbox]:checked{background: url(/static/images/common/checked.png)no-repeat center/100%;}

@keyframes floatMotion {
    from {
        right:88%;
    }
    to{
        right:5%;
    }
}