@charset "UTF-8";
/* 优惠列表--裸装样式*/

/* 外层容器底色 *//*START*/
.promo_component_wrp { background-color: #272727; }
.promo_component_wrp, .promo_component_wrp * { box-sizing: border-box; }
/*-----------*//*END*/

/*优惠类别导航 裸装样式(B站基底)*/
.promo_cate_li {
    background-color: #1b1b1b;
    background-color: rgba(0,0,0,0.4);
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    margin: 0 auto;
    width: 990px;
}
.promo_cate_li ul {
    width: 100%;
    margin: 0;
    padding: 0.175em;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    list-style: none;
    font-size: 0.75em;
    font-weight: bold;
    text-align: center;
    background-color: #000;
}
.promo_cate_li ul li {
    background-color: rgba(255, 255, 255, 0);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0);
    color: #fff;
    margin: 0 0;
    padding: 0.971em 10px;
}
.promo_cate_li ul li a { color: #fff;}
.promo_cate_li ul li:hover {
    color: #ffdf1b;

}
.promo_cate_li ul li a {
    color: #fff;
    display: block;
    width: 100%;
    height: 100%;
}
.promo_cate_li ul li.default_current a,
.promo_cate_li ul li:hover a {
    color: #ffdf1b;
    text-decoration: none;
}
/* --------------------------------end */

/* 优惠列表 str(裸装版) */
ul.promo_li_wrp {
    display: flex;
    background-color: #151515;
    color: #fff;
    flex-direction: row;
    flex-wrap: wrap;
    font-size: 16px;
    justify-content: space-between;
    list-style: none;
    margin: 0 auto;
    padding: 10px 10px;
    position: relative;
    width: 990px;
}
ul.promo_li_wrp > li {
    display: flex;
    flex-direction: column;
    width: 460px;
    padding: 10px 10px;
}
ul.promo_li_wrp > li::after {
    content: "";
    clear: both;
}
ul.promo_li_wrp > li a {
    color: #fff;
}
/* 列表封面图 .promo_cover */
ul.promo_li_wrp > li .promo_cover {
    display: flex;
    width: 100%;
    height: 198px;
    justify-content: center;
    align-items: center;
    position: relative;
}
ul.promo_li_wrp > li .promo_cover > .switch_btn {
    display: none;
}
.promo_cover > .turn_on_below span {}

    /* 只有B站会用到这组hover的遮罩效果  str*/
    ul.promo_li_wrp > li .promo_cover .tra-mask {
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 255, 255, .2);
        display: none;
    }
    ul.promo_li_wrp > li .promo_cover:hover .tra-mask {
        display: block;
    }
    /* 只有B站会用到这组hover的遮罩  end*/

ul.promo_li_wrp > li h3.promo_name {
    font-size: 18px;
    color: inherit;
    margin: 0;
    padding: 12px 0;
}
ul.promo_li_wrp > li .promo-time {
    color: inherit;
    font-size: 12px;
    padding: 10px 0;
    height: 1.2em;
    overflow: hidden;
}
/* ul.promo_li_wrp>li .promo-time span~span::before {
    display: inline;
    content: " ~ ";
} */
ul.promo_li_wrp > li .promo-text-collapse {
    display: none;
    font-size: 14px;
    padding: 5px 0;
}
ul.promo_li_wrp > li .btn-wrp {
    text-align: center;
    padding: 5px 0;
    display: flex;
    justify-content: space-between;
}
ul.promo_li_wrp > li .btn-wrp button {
    font-size: 15px;
    width: 49%;
    line-height: 29px;
    background-color: transparent;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.16);
    margin-bottom: 5px;
    cursor: pointer;
    border-radius: 10px;
}
ul.promo_li_wrp > li .btn-wrp button:hover {
    background-color: #ffb100;
}
    /* promo列表页内容((被展开的内容)) */
    .promo_li_content {
        width: 100%;
		display:none;
    }
    .promo_li_content {
        max-width: 100%;
        color: inherit;
    }
    .promo_li_content img {
        max-width: 100%;
    }

/* 返回上一页按钮预设隐藏*/
a.promo_goback{
    display: none;
}
/* -------------------------------------------------- */

/*列表封面图 type1(B站 )*//*START*/
ul.type1.promo_li_wrp > li { width: 480px; }
ul.type1.promo_li_wrp > li .promo-time { display: none; }
ul.type1.promo_li_wrp > li .btn-wrp { display: none; }
/* ----------------- *//*END*/

/* 优惠分类列表 type2版本(非B站)*/
.type2.promo_cate_li {
    background-color: transparent;
}
.type2.promo_cate_li ul {
    background-color: transparent;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 0 0 0.175em 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.type2.promo_cate_li ul li {
    height: 53px;
    line-height: 53px;
    font-size: 15px;
    color: #363636;
    padding: 0 20px;
    font-weight: normal;
    border-radius: 0;
}
.type2.promo_cate_li ul > li:hover,
.type2.promo_cate_li ul > li.default_current{
    color: #fff;
}

.type2.promo_cate_li ul li a { color: #363636; }
.type2.promo_cate_li ul li.default_current a,
.type2.promo_cate_li ul li:hover a { color: #fff; }
/* --------------------------------end */

/* 优惠列表 type2版本(非B站)*/
ul.type2.promo_li_wrp {
    padding: 0;
    margin-top: 15px;
}
ul.type2.promo_li_wrp > li {
    width: 100%;
    padding: 0;
}
ul.type2.promo_li_wrp > li::after {}
ul.type2.promo_li_wrp > li a {}

/* 列表封面图 type2版本(非B站) */
ul.type2.promo_li_wrp > li .promo_cover {}
ul.type2.promo_li_wrp > li .promo_cover > .tra-mask { display: none; }
/* ul.type2.promo_li_wrp > li .promo_cover>.switch_btn { display: block;} */
ul.type2.promo_li_wrp > li .promo_cover > .turn_on_below span {}

/*-------------------------------------end*/

ul.type2.promo_li_wrp > li h3.promo_name { display: none; }
ul.type2.promo_li_wrp > li .promo-time { display: none; }
ul.type2.promo_li_wrp > li .btn-wrp { display: none; }
ul.type2.promo_li_wrp > li .btn-wrp button {}
ul.type2.promo_li_wrp > li .btn-wrp button:hover {}

/* -------------------------------------------------- */


/*-优惠业内页 页头导航选单(裸装) str */
ul.promo_page_nav {
    display: flex;
    width: 990px;
    height: 35px;
    line-height: 35px;
    margin: 0 auto;
    font-size: 16px;
    color: #fff;
    list-style: none;
    justify-content: center;
    background-color: #151515;
}
ul.promo_page_nav li {
    padding: 0 20px 0 20px;
    margin: 0 20px;
    font-size: 12px;
    font-weight: bold;
}
ul.promo_page_nav li a {
    color: #fff;
}
ul.promo_page_nav li.slected a,
ul.promo_page_nav li a:hover {
    color: #ffdf1b;
}
/*-优惠业内页 页头导航选单 end*/

/*- 优惠页内容内容 STR -*/
.promo_content_wrp {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 990px;
    margin: 0 auto;
    background-color: #151515;
}
.promo_content_wrp .tit_img {
    width: 100%;
    margin-bottom: 25px;
}
.promo_content_wrp .tit_img img {
    max-width: 100%;
    height: auto;
}
.promo_content_wrp > ul.navLeft {
    width: 250px;
    margin-left: 10px;
    list-style: none;
    font-size: 15px;
}
.promo_content_wrp > ul.navLeft a {
    color: #fff;
    line-height: 30px;
}
.promo_content_wrp > ul.navLeft li.current a,
.promo_content_wrp > ul.navLeft a:hover {
    color: #ffdf1b;
}
.promo_content_wrp > .navRight {
    width: 680px;
    margin-right: 10px;
    font-size: 15px;
}
.promo_content_wrp > .navRight > h2.promo_tit_name {
    font-size: 24px;
    color: #ddd;
    font-weight: bold;
    margin: 0;
    padding: 0 0 17px 0;
}
.promo_content ul, .promo_content ol{
    padding-left: 40px;
    margin: 0;
    list-style: disc;
    list-style-position: outside;
}
.promo_content li{
    list-style: inherit;
}
/*- 優惠頁內頁內容 end -*/

/***************************/
/*  優惠頁內頁样式设定        */
/*  type1 内页左侧是文字列表  */
/*  type2 内页左侧是图文列表  */
/***************************/
/*- 優惠頁內頁左侧列表(type1 文字列表) -*/
.type1.promo_content_wrp > ul.navLeft {}
.type1.promo_content_wrp > ul.navLeft a {}
.type1.promo_content_wrp > ul.navLeft img { display: none;}

/*- 優惠頁內頁左侧列表(type2 图文列表) -*/
.type2.promo_content_wrp > ul.navLeft {}
.type2.promo_content_wrp > ul.navLeft a {}
.type2.promo_content_wrp > ul.navLeft img {}


/*动画开关*//*type2列表点击图片封面划开内容*//*START*/
.type2.promo_li_wrp > li > a > .promo_cover > .switch_btn {
    text-align: center;
    position: absolute;
    width: 32px;
    padding: 49px 18px;
    height: auto;
    vertical-align: middle;
    top: 0;
    right: 0;
    font-size: 18px;
    line-height: 20px;
    background-color: #cb323e;
}

.type2.promo_li_wrp > li > a > .promo_cover > .switch_btn.up {
    display: none;
}

.type2.promo_li_wrp > li > a .promo_cover > .switch_btn.down {
    display: block;
}

.type2.promo_li_wrp > li > a.selected > .promo_cover > .switch_btn.up {
    display: block;
}

.type2.promo_li_wrp > li > a.selected > .promo_cover > .switch_btn.down.hide {
    display: none;
}

.type2.promo_content_wrp{
    position: relative;
}
.type2.promo_content_wrp .navLeft li a {
    display: none;
}
.type2.promo_content_wrp .navLeft li img:last-child {
    display: none;
}
/*动画开关*//*END*/




.type2.promo_content_wrp .navLeft li img.zooin {
    width:266px;
    height:150px;
    left: 0px;
    position:absolute;
    animation-name:topwh;
    animation-duration:1s;
    animation-fill-mode: forwards;
}

@keyframes topwh {
    0% {
        top:500px;
    }
    50% {
        width:266px;
        height:150px;
        top:0px;
    }
    100% {
        top:0px;
        width: 1000px;
        height: 385px;
    }
}

/*lazyloading css (图片缓载入)*/
.load_box {
    width: 460px;
    height: 198px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    /*background-color: #fff;*/
}

.load_box::after {
    position: absolute;
    top:calc(50% - 23px);
    z-index: 99;
    content: "";
    display: block;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 5px solid #fff;
    border-color: #fff transparent #fff transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

.img_success.load_box::after {
    display: none;
}

.img_success img {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    left:0;
}
@keyframes lds-dual-ring {
    0% {
    transform: rotate(0deg);
    }
    100% {
    transform: rotate(360deg);
    }
}
/* ------------------------------------------ */

/*给优惠弹窗使用的modal弹窗样式start*/
.to_bootstrap .modal-dialog {
    width: 600px;
    height: 60vh;
    margin: 20vh auto;
}
.modal-body.promo_content {
    max-height: 480px;
    overflow: auto;
}
/*给优惠弹窗使用的modal弹窗样式end*/

/*loading*/
#tit_img {
    position: relative;
    min-height: 400px;
}
#tit_img #LoadingDiv {
    display: none;
    position: absolute;
    opacity: 0.4;
    background: url('/images/www/loaderSpinner.gif') no-repeat center center #000;
    width: 990px;
    height: 100%;
}

/* 英文版版面修正 for type2 */
.en .type2.promo_li_wrp > li > a > .promo_cover > .switch_btn{
    min-width: 170px;
    width: auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.en .type2.promo_li_wrp > li > a.selected > .promo_cover > .switch_btn.up{
    display: flex;
}

.en .promo_content_wrp > ul.navLeft li {
    padding: 10px 5px;
}

.en .promo_content_wrp > ul.navLeft li a{
    line-height: 1.5;
}