/*
 *	Name: main.css
 *	Time: 2017-11-23
 *	Autor: StevE.Zhang @ Sumaart.com
 *
 */

 html { max-width: 750px; margin: 0 auto; position: relative; -webkit-text-size-adjust:none; }
 .wr-main {width: 6.7rem; margin-left: auto; margin-right: auto;}
 .tl-c {text-align: center;}
 .wr-inb {font-size: 0; letter-spacing: 0;}

 /**********special_01**********/

 /* btn-sp-01 */
.btn-sp-01 {display: inline-block; width: 2.5rem; height: .68rem; border-width: .02rem; border-style: outset; border-radius: .34rem; font-size: .24rem; line-height: .64rem; color: #fff; text-align: center;}
.btn-sp-01.color-y {background: #dcb365; border-color: #f7d799;}
.btn-sp-01.color-b {background: #1c4da1; border-color: #3373e1;}

body.special_01 > header {width: 7.5rem; height: 1rem; background: #161218; position: fixed; top: 0; left: 0; right: 0; margin: auto; padding-top: .16rem; padding-bottom: .16rem; z-index: 10; opacity: 0; visibility: hidden; transition: all .5s;}
body.special_01 > header.show {opacity: 1; visibility: visible;}
body.special_01 > header .btn-sp-01 {float: left; margin-right: .25rem;}
body.special_01 > header .btn-nav {display: block; height: .68rem; float: right; font-size: .24rem; line-height: .68rem; color: #fff; text-align: right;}
body.special_01 > header .btn-nav::after {content: ""; display: inline-block; vertical-align: top; width: .21rem; height: .13rem; background: url(../special_01/images/btn_down.png) center center no-repeat; background-size: contain; margin-left: .52rem; margin-top: .27rem;}
body.special_01 > header ul {position: absolute; display: none; top: 1rem; background: #161218; left: 0; right: 0; margin: auto;}
body.special_01 > header ul li {border-top: 2px solid #1b1b1b;}
body.special_01 > header ul li a {display: block; height: .8rem; font-size: .24rem; line-height: .8rem; color: #fff; text-align: center;}
body.special_01 > header .btn-sp-01 {width: 1.68rem; height: .5rem; border-radius: .25rem; font-size: .22rem;  line-height: .5rem; }

/* sec-01 */
body.special_01 .sec-01 {height: 11.8rem; padding-top: 1.75rem; background: url(../special_01/images/bg_sec01.jpg) center center no-repeat; background-size: cover; position: relative;}
body.special_01 .sec-01 .wrapper {height: 10.05rem; padding-top: 2.25rem; background: url(../special_01/images/bg_sec01_inner.png) top center no-repeat; background-size: 100% auto;}
body.special_01 .sec-01 .wrapper h1 {margin-bottom: .65rem;}
body.special_01 .sec-01 .wrapper h1 img {max-width: 100%; height: auto; margin-left: auto; margin-right: auto;}
body.special_01 .sec-01 .wrapper h2.type-01 {margin-bottom: .25rem;}
body.special_01 .sec-01 .wrapper h2.type-02 {margin-bottom: .57rem;}
body.special_01 .sec-01 .wrapper h2.type-01 img {width: 2.14rem; height: auto; margin-left: auto; margin-right: auto;}
body.special_01 .sec-01 .wrapper h2.type-02 img {width: 2.44rem; height: auto; margin-left: auto; margin-right: auto;}
body.special_01 .sec-01 .wrapper .btn-sp-01 {display: block; margin-left: auto; margin-right: auto;}
body.special_01 .sec-01 .wrapper .btn-sp-01.color-y {margin-bottom: .3rem;}
body.special_01 .sec-01 .wrapper .btn-sp-01.color-b {margin-bottom: .6rem;}
body.special_01 .sec-01 .wrapper p {width: 5rem; margin-left: auto; margin-right: auto; font-size: .24rem; line-height: .36rem; color: #fff; text-align: center;}

/* first navigation */
body.special_01 .sec-01 .wr-nav {position: absolute;; height: 1.62rem; left: 0; right: 0; top: 0; margin: auto;}
body.special_01 .sec-01 .wr-nav .logo {display: block; width: .94rem; height: .94rem; float: left; margin-top: .34rem; background: url(../special_01/images/logo.png) center center no-repeat; background-size: contain;}
body.special_01 .sec-01 .wr-nav nav {float: right; margin-top: .63rem; position: relative;}
body.special_01 .sec-01 .wr-nav nav > a {display: block; height: .36rem; font-size: .24rem; line-height: .36rem; color: #fff; text-align: right;}
body.special_01 .sec-01 .wr-nav nav > a:after {content: ""; display: inline-block; vertical-align: top; margin-top: .11rem; margin-left: .52rem; width: .21rem; height: .13rem; background: url(../special_01/images/btn_down.png) center center no-repeat; background-size: contain;}
body.special_01 .sec-01 .wr-nav nav ul {position: absolute; top: .6rem; left: 0; right: 0; margin: auto; opacity: 0; visibility: hidden; transition: all .5s;}
body.special_01 .sec-01 .wr-nav nav ul li a {display: block; font-size: .2rem; line-height: .4rem; color: #fff;}
body.special_01 .sec-01 .wr-nav nav.open-sub ul {opacity: 1; visibility: visible; z-index: 20;}

/* h2-sp-01 */
.h2-sp-01 {height: 1.45rem; margin-left: auto; padding-top: .4rem; margin-right: auto; overflow: hidden;}
.h2-sp-01 span {display: block; font-size: .36rem; line-height: .42rem; text-align: center; color: #fff; letter-spacing: .04rem;}
.h2-sp-01.bg-01 {width: 2.93rem; background: url(../special_01/images/bg_h2_01.png) center center no-repeat; background-size: cover;}
.h2-sp-01.bg-01 span {margin-right: .4rem;}
.h2-sp-01.bg-02 {width: 3.15rem; background: url(../special_01/images/bg_h2_02.png) center center no-repeat; background-size: cover;}
.h2-sp-01.bg-02 span {margin-right: .05rem;}
.h2-sp-01.bg-03 {width: 4.24rem; background: url(../special_01/images/bg_h2_03.png) center center no-repeat; background-size: cover;}
.h2-sp-01.bg-03 span {margin-right: .05rem;}
.h2-sp-01.bg-04 {width: 4.66rem; background: url(../special_01/images/bg_h2_04.png) center center no-repeat; background-size: cover; }
.h2-sp-01.bg-04 span {margin-right: .05rem;color: #000;}

/* sec-02 */
body.special_01 .sec-02 {padding-top: .63rem; padding-bottom: .7rem; background: #292125;}
body.special_01 .sec-02 ul {margin-top: .75rem; margin-left: -0.15rem; margin-right: -0.15rem;}

/* li-sp-01 */
.li-sp-01 {display: inline-block; vertical-align: top; width: 2.3rem; padding-left: .15rem; padding-right: .15rem; margin-bottom: .48rem;}
.li-sp-01 a{display: block;}
.li-sp-01 a .wr-pic {width: 2rem; height: 2rem; position: relative; border: 1px solid #dab163; box-shadow: 0 0 .2rem #dab163; background: rgba(218, 177, 100, .1);}
.li-sp-01 a .wr-pic img {position: absolute; width: 1.6rem; height: 1.6rem; left: 0; right: 0; margin: auto; top: .19rem;}
.li-sp-01 a h3 {margin-top: .16rem; font-size: .24rem; line-height: .36rem; color: #dab163; text-align: center;}
.li-sp-01 a p {font-size: .2rem; line-height: .34rem; margin-top: .06rem; color: #fff; text-align: center;}

sec-03
body.special_01 .sec-03 .h2-sp-01 {margin-bottom: .5rem;}
body.special_01 .sec-03 {padding-top: .65rem; padding-bottom: 1rem; background: radial-gradient(#210223, #0a0825);}
body.special_01 .sec-03 .cont h3 {font-size: .36rem;; line-height: .42rem; color: #dcb365; text-align: center; margin-bottom: .3rem;}
body.special_01 .sec-03 .cont h3 img {width: 1.04rem; height: auto; margin-left: auto; margin-right: auto;}
body.special_01 .sec-03 .cont ul {margin-top: .8rem; padding-left: .36rem; position: relative;}
body.special_01 .sec-03 .cont ul li {position: relative;margin-bottom: .8rem;}
body.special_01 .sec-03 .cont ul li:before{content: '';position: absolute;top: .18rem;left: -0.26rem;width: 1px;height: 100%;background-color: #dcb365;}
body.special_01 .sec-03 .cont ul::before {content: ""; display: block; width: 1px; height: 100%; background: transparent; position: absolute; left: .1rem; top: .18rem;}
body.special_01 .sec-03 .cont ul h4 {font-size: .35rem; line-height: .36rem; color: #fff; margin-bottom: .25rem;}
body.special_01 .sec-03 .cont ul h4.color-y {color: #dcb365;}
body.special_01 .sec-03 .cont ul h4 span {display: block; font-size: .2rem; line-height: .36rem; color: #666;}
body.special_01 .sec-03 .cont ul h4.wr-time {margin-bottom: .6rem; position: relative;}
body.special_01 .sec-03 .cont ul h4.wr-time span {color: #fff; position: relative;}
body.special_01 .sec-03 .cont ul h4.wr-time span::after {content: ""; display: block; width: 1.45rem; height: 1px; position: absolute; left: 0; bottom: 0; background: url(../special_01/images/deco.png) center center no-repeat;}
body.special_01 .sec-03 .cont ul h4.wr-time i {display: block; position: absolute; left: -.36rem; top: 0; bottom: 0; margin: auto; width: .2rem; height: .2rem; border: .02rem outset #f3d293; border-radius: 50%; background: #dcb365;}
body.special_01 .sec-03 .cont .wr-row {margin-bottom: .2rem;}
body.special_01 .sec-03 .cont .wr-row .wr-l {display: inline-block; vertical-align: top; width: 1.64rem;}
body.special_01 .sec-03 .cont .wr-row .wr-l.w100 {width: 6.3rem;}
body.special_01 .sec-03 .cont .wr-row .wr-l .t-01 {font-size: .24rem; line-height: .4rem; color: #fff;}
body.special_01 .sec-03 .cont .wr-row .wr-r {display: inline-block; vertical-align: top; width: 4.66rem;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i {margin-bottom: .2rem;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i span {display: inline-block; vertical-align: top;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i span.t-02 {width: 1.36rem; font-size: .36rem; line-height: .4rem; color: #dcb365;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i span.t-02.w-100 {width: 4.66rem;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i span.t-03 {width: 3.3rem; font-size: .24rem; line-height: .36rem; color: #fff;}
body.special_01 .sec-03 .cont .wr-row .wr-r p.wr-row-i span.t-04 {font-size: .26rem; line-height: .4rem; color: #666;}

/* sec-04 */
body.special_01 .sec-04 {padding-top: .8rem; padding-bottom: 1.3rem; background: #231d1d;}
body.special_01 .sec-04 .wr-pics {margin-top: 1.3rem;}
body.special_01 .sec-04 .wr-pics .slick-slide {width: 5.41rem; position: relative;}
body.special_01 .sec-04 .wr-pics .slick-slide img {width: 5.41rem; height: 3.2rem; margin-bottom: .4rem; transform-origin: right center; transform: scale(.8, .8); filter: brightness(0.2); transition: all .5s;}
body.special_01 .sec-04 .wr-pics .slick-slide.slick-active + .slick-slide img {transform-origin: left center;}
body.special_01 .sec-04 .wr-pics .slick-slide h3 { width: 3.65rem; height: .8rem; margin-left: auto; margin-right: auto; overflow: hidden; font-size: .24rem; line-height: .4rem; color: #fff; text-align: center; opacity: 0; transition: all .8s;}
body.special_01 .sec-04 .wr-pics .slick-slide .btn-play {display: block; width: .7rem; height: .7rem; border-radius: 50%; background: url(../special_01/images/btn_play.png) center center no-repeat; background-size: contain; position: absolute; left: 0; right: 0; margin: auto; top: 1.28rem; opacity: 0; transform: scale(.3, .3); transition: all .5s;}
body.special_01 .sec-04 .wr-pics .slick-slide.slick-active img {transform: scale(1, 1); filter: brightness(1);}
body.special_01 .sec-04 .wr-pics .slick-slide.slick-active h3 {opacity: 1;}
body.special_01 .sec-04 .wr-pics .slick-slide.slick-active .btn-play {transform: scale(1, 1); opacity: 1;}
body.special_01 .sec-04 .wr-pics .slick-dots {font-size: 0; letter-spacing: 0; text-align: center; margin-top: .35rem;}
body.special_01 .sec-04 .wr-pics .slick-dots li {display: inline-block; vertical-align: top; margin-left: .08rem; margin-right: .08rem;}
body.special_01 .sec-04 .wr-pics .slick-dots li button {display: block; padding: 0; margin: 0; width: .18rem; height: .18rem; border: 2px solid #dcb365; border-radius: 50%; outline: none; background: transparent; position: relative;}
body.special_01 .sec-04 .wr-pics .slick-dots li button::after {content: ""; display: block; width: .06rem; height: .06rem; border-radius: 50%; background: #dcb365; opacity: 0; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; transition: all .5s;}
body.special_01 .sec-04 .wr-pics .slick-dots li.slick-active button::after {opacity: 1;}
body.special_01 .sec-04 .wr-txts {margin-top: .7rem;}
body.special_01 .sec-04 .wr-txts li {height: 2rem; border-bottom: 1px solid #fff; padding-top: .35rem; padding-left: .1rem; padding-right: .1rem;}
body.special_01 .sec-04 .wr-txts li h3 {font-size: .24rem; line-height: .36rem; color: #fff; max-height: 1.08rem; overflow: hidden;}
body.special_01 .sec-04 .wr-txts li p {font-size: .2rem; line-height: .24rem; color: #666; margin-top: .15rem;}
body.special_01 .sec-04 .btn-more {display: block; width: 1.7rem; height: .6rem; font-size: .24rem; line-height: .6rem; color: #fff; text-align: center; position: relative; margin-left: auto; margin-right: auto; margin-top: .7rem;}
body.special_01 .sec-04 .btn-more::after {content: ""; display: block; position: absolute; height: 1px; left: 0; right: 0; bottom: 0; margin: auto; background: url(../special_01/images/deco.png) center center no-repeat; background-size: contain;}

/* fixed vide */
.player-bg{position:absolute;top:0;right:0;bottom:0;left:0}
.player-bg:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:#ef6c72;filter:alpha(Opacity=27);opacity:.27}
.player-bg .ico{position:absolute;top:50%;left:50%;margin:-30px 0 0 -24px;width:48px;height:48px;font-size:48px;color:#fff}
.fixed-video{position:fixed;z-index:1000;top:0;right:0;bottom:0;left:0}
.fixed-video-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,.5)}
.fixed-video-box{position:absolute;z-index:1;top:50%;left:50%;width: 90%;padding-top: 62.8%;background-color:#000;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
.fixed-video-box video{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.fixed-video-box .icon-close{position:absolute;top:-15px;right:-15px;width:30px;height:30px;font-size:30px;color:#fff;cursor:pointer}
.no-video .fixed-video{display:none}

.group-guests-tab{margin-top: -.15rem;margin-bottom: .15rem;font-size: .28rem;line-height: 2;text-align: center}
.group-guests-tab span{display: inline-block;vertical-align: top;margin: 0 20px;color: #999;cursor: pointer}
.group-guests-tab span.current{color: #dab163}
.group-guests{display: none}
.group-guests.is-active{display: block}


/* sec-05 */
body.special_01 .sec-05 {padding-top: .9rem; padding-bottom: 1.3rem;}
body.special_01 .sec-05 .h2-sp-01 {margin-bottom: .9rem;}
body.special_01 .sec-05 .cont h3 {font-size: .2rem; line-height: .24rem; color: #dcb365; text-align: center;}
body.special_01 .sec-05 .cont h3:before {content: ""; display: block; height: 1px; margin-bottom: .25rem; background: url(../special_01/images/hr.png) center center no-repeat; background-size: contain;}
body.special_01 .sec-05 .cont img {width: 100%; height: auto; margin-top: .5rem; margin-bottom: .3rem;}

/* footer */
body.special_01 footer {height: .72rem; background: #03011f; overflow: hidden;}
body.special_01 footer p {font-size: .22rem; line-height: .36rem; color: #666; text-align: center; margin-top: .1rem;}

/* pop-support */
body.special_01 > .pop-support {position: fixed; width: 7.5rem; height: 100%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; display: none; background: rgba(0,0,0,.9); z-index: 200;}
body.special_01 > .pop-support .wrapper {position: absolute; width: 4.21rem; height: 3.18rem; left: 0; right: 0; top: 0; bottom: 0; margin: auto;}
body.special_01 > .pop-support .wrapper .info {width: 4.21rem; height: 2rem; background: url(../special_01/images/bg_pop_support.png) center center no-repeat; background-size: contain;}
body.special_01 > .pop-support .wrapper a {display: block; width: 1.87rem; height: .52rem; margin-left: auto; margin-right: auto; background: #dcb365; border: 2px outset #f7d696; border-radius: .26rem; font-size: .24rem; line-height: .48rem; color: #fff; margin-top: 1.18rem; text-align: center;}


/* end */
.layer-bg{
    display: none;position: fixed;z-index:100;top: 0;right: 0;bottom: 0;left: 0;background-color: rgba(0,0,0,.5);
}
.layer-box{
    display: none;position: fixed;z-index: 200;top: 50%;left: 50%;width: 90%;padding-bottom: 30px;border-radius: .03rem;background-color: #fff;
    -webkit-transform:translate(-50%, -50%);
}
.layer-title{
    position: relative;margin-bottom: 20px;font-size: 16px;line-height: 50px;border-bottom: 1px solid rgba(0,0,0,.1);text-align: center;color: #007ffe;
}
.layer-close{
    position: absolute;top:5px;right: 0;width: 40px;height: 40px;
}
.layer-close:before, .layer-close:after{content: '';position: absolute;top: 19px;left: 10px;width: 20px;height: 1px;background-color: #333;}
.layer-close:before{
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.layer-close:after{
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.layer-input_label{margin-right: 20px;margin-left: 20px;font-size: 12px;line-height: 24px;color: #333;}
.layer-input{margin-bottom: 10px;margin-right: 20px;margin-left: 20px;}
.layer-input.mb20{margin-bottom: 20px;}
.layer-input input{
    padding: 0  10px;display: block;width: 100%;height: 40px;border: 1px solid rgba(0,0,0,.1);font-size: 14px;color: #333;
}
.layer-input select{
    padding-left: 5px;display: block;width: 100%;border: 1px solid rgba(0,0,0,.1);font-size: 14px;height: 40px;margin: 0;color: #333;
}
.layer-submit{
    display: block;margin-right: auto;margin-left: auto;width: 200px;height: 40px;border: 0;border-radius: 3px;font-size: 14px;background-color: #007ffe;color: #fff;
}
.layer-input-verify{position: relative;padding-right: 140px;margin-bottom: 20px;}
.layer-input-verify img{position: absolute;top: 0;right: 0;width: 120px;height: 40px;}
.form-error{font-size: 12px;line-height: 20px;}