/*   f0c70c    */
.content{ text-align:justify; line-height:2}
.content p{ margin-bottom:1.5rem;}
.line{ height:0.7rem;width:100%; background:#f0c70c;}
.level{position:relative; z-index:5;}
.goback{cursor:pointer;}
.left img,.right img{width:100%;}
.allcenter{display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;
-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}

@media screen and (max-width:1000px){
	.line{ height:2px}
}


.icon_weixin{ background:url(../image/icon_weixin.svg) bottom center no-repeat; background-size:auto 100%;}
.icon_weibo{ background:url(../image/icon_weibo.svg) bottom center no-repeat; background-size:auto 100%;}

#guide{ background:#000; text-align:center}
#guide img{max-width:220px; padding-top:40%;}

/*首页*/
#header{position:fixed; margin:4rem 0 0 3%; z-index:40; height:100px;width:30%;}
#header .logo{width:50%; min-width:120px; height:4rem; background:url(../image/logo.svg) no-repeat left top; background-size: auto 100%;cursor:pointer;}
#header .logo img{height:100%;width:auto;}
#header .logo:hover{ }

#header .brand1{width:70%;background:url(../image/logo_1.svg) no-repeat left top; background-size:100% auto;}
#header .brand2{width:70%;background:url(../image/logo_2.svg) no-repeat left top; background-size:100% auto;}
#header .brand3{width:70%;background:url(../image/logo_3.svg) no-repeat left top; background-size:100% auto;}
#header .brand4{width:70%;background:url(../image/logo_4.svg) no-repeat left top; background-size:100% auto;}


#header .brand1:hover,#header .brand2:hover,#header .brand3:hover,#header .brand4:hover{ width:80%;}

@media screen and (max-width:1000px){
	#header{margin:5% 0 0 5%;width:50%;}
	#header .logo{width:100%;height:2.5rem;}
	
	
}



/*首页-卡宾先生*/
.index_cbxs{display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;overflow:hidden;background: #000 url(../upload/HOME/KBBG.jpg) no-repeat top left; background-size: auto 100%;}

.index_cbxs .left_info{width:35%; position:absolute; z-index:5;left:3%; color:#FFF; text-align:left;cursor:pointer;}
.index_cbxs .left_info:hover{ opacity:0.6}
.index_cbxs .left_info h1{font-size: 4.5rem; font-weight:normal;}
.index_cbxs .left_info h2{font-size: 5rem;}
.index_cbxs .left_info .line{ margin:4rem 0;}
.index_cbxs .left_info .content{ font-size:1.6rem;width:70%;}

.index_cbxs .photo{width:100%; height:100%; pointer-events:none;}
.index_cbxs .photo li{position:absolute; z-index:2;}
.index_cbxs .photo li img{ height:100%; width:auto;}
.index_cbxs .photo li:nth-child(2){text-align:left;}
.index_cbxs .photo li:nth-child(2) img{ margin-right:2rem;}

@media screen and (max-width:1200px){
	.index_cbxs .left_info .content{font-size:1.4rem;width:100%;}
}
@media screen and (max-width:1000px){
	.index_cbxs .left_info{width:80%; margin-top:6rem;pointer-events:none;}
	
	.index_cbxs .left_info .content{ font-size:1.2rem;}
	.index_cbxs .photo li:nth-child(2){ display:none}
	.index_cbxs .photo li:nth-child(1){width:1000px;}
	.index_cbxs .photo li img{width:auto;display:block}
	
	.index_cbxs .left_info h1{font-size: 3.5rem; font-weight:normal;}
	.index_cbxs .left_info h2{font-size: 4rem;}
	.index_cbxs .left_info .line{ margin:1.5rem 0;}

}


/*首页 集团品牌*/
.index_brand{ background:#000;}
.index_brand ul{ clear:both; margin:0 2.5%;}
.index_brand li{width:22%; float:left; text-align:center; border:0px solid #222; margin-right:4%; background:#111}
.index_brand li:nth-child(4n){ margin-right:0;}
.index_brand li img{width:60%;}


@media screen and (max-width:1000px){
	.index_brand ul{ margin:0 5%;}
	.index_brand li{width:100%; margin:4% 0; height:10rem; padding:2rem 0}
	.index_brand li img{width:50%;}
}


/*首页 简介*/
.index_about{ background:#000; color:#FFF;}
.index_about .left{width:50%; height:100%;float:left;}
.index_about .left{ }
.index_about .right{width:50%; height:100%; padding:12rem 0 0 8rem; float:right; overflow:hidden}
.index_about .right h1{ font-size:7.6rem;width:100%; line-height:1;-moz-hyphens: auto;-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;word-wrap: break-word;}
.index_about .right .line{ margin:5rem 0; z-index:-1;}
.index_about .right h2{ font-size:4rem;margin-bottom:2rem;}
.index_about .right .content{font-size:1.6rem;width:75%;}


@media screen and (max-width:1200px){
	.index_about .right{padding:8rem 0 0 6rem;}
}
@media screen and (max-width:1000px){
	.index_about .left{ background-size:auto 100%;}
	.index_about .left{width:100%; height:auto;}
	.index_about .right{width:100%; height:auto;padding:0 5%; float:left;}
	.index_about .right h1{font-size: 4rem; position:absolute;width:90%; margin-top:-8.5rem; color:#FFF;}
	.index_about .right h2{font-size: 1.8rem;}
	.index_about .right .line{ margin:2rem 0;}
	.index_about .right .content{ font-size:1rem;width:100%; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 9;overflow: hidden;font-size:1.3rem; height:21rem; overflow:hidden}
	/*.index_about .mobile{width:100%; float:left;}*/
}




/*首页 集团新闻*/
.index_news{ background:#000;}
.index_news ul{ width:80%; margin:0 10%;position:absolute;}
.index_news li{ float:left;width:48%;cursor:pointer;}
.index_news li .title{ position:absolute; margin-top:3rem; margin-left:3rem; color:#FFF;line-height:1.3;font-weight:normal;}
.index_news li .title h1{ text-align:left; font-size:8rem; line-height:1; position:absolute;font-family:"alternategothic-webfont"; font-weight:normal;}
.index_news li .title span{ font-size:1.8rem;}
.index_news li:hover{ opacity:0.8}

@media screen and (max-width:1000px){
	.index_news ul{ width:90%; height:100%; margin:0 5%;}
	.index_news li{width:100%;}
	.index_news li .title h1{font-size:5rem; margin-top:10rem;}
}



/*about*/
#about h1{font-size:10rem;color:#000;-webkit-text-stroke:1px gray;text-stroke:1px gray;line-height:1;-moz-hyphens: auto;-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;word-wrap: break-word;}
#about h2{font-size:4.5rem;color:#FFF; margin-bottom:2.5rem;}
#about .left,#about .right{width:50%; float:left}
#about .line{ margin:4rem 0;}

#about .index_about{ background:#000;}


.about_brand{ clear:both; padding:15rem 0;background:#000;}
.about_brand .left{ padding:0 8rem 10rem 0; text-align:right;}
.about_brand .right{padding-left:8rem;}
.about_brand .right .content{font-size:1.4rem;width:85%;color:#FFF}

.about_detail{background:#000; padding:25rem 0 15rem 0; clear:both;}
.about_detail .left{ text-align:right; padding-right:8rem;}
.about_detail .left ul{ padding:4rem 0;}
.about_detail .left ul li{ font-size:2.2rem; font-weight:bold; color:#888;}
.about_detail .left ul li span{ font-size:5rem;}
.about_detail .right{display:table-cell;display:inline-block}

.about_show{clear:both; padding:15rem 0;background:#000;}
.about_show .left{padding-right:8rem; text-align:right;}
.about_show .swiper-slide .title{color:#FFF; margin:0 auto; margin-top:-4.4rem; font-size:2rem; text-align:center;background:rgba(0,0,0,0.5);width:100%; padding:1rem 0; overflow:hidden; }
.about_show .show_year{ margin:0 auto; margin:2rem 0; text-align:center; color:#FFF;}
.about_show .show_year a{ color:#FFF; margin:0 1rem; font-size:1.2rem;}

.about_grossover{background:#000;padding:5rem 0;}
.about_grossover .right{ padding-left:8rem; overflow:hidden}
.about_grossover .brandlist li{ margin:4rem 0;width:45%;-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray; opacity:0.5}
.about_grossover .brandlist li:hover,.about_grossover .brandlist .active{-webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);filter:none; opacity:1;}


.about_joinus{background:#000; text-align:center; padding:10rem 0}
.about_joinus .joinus{ background:#FFF; min-height:500px; margin-top:-4rem; padding:7rem 10%}
.about_joinus .joinus li{ text-align:left;cursor:pointer;}
.about_joinus .joinus li h3{ margin-bottom:1rem; font-size:2.2rem;}
.about_joinus .joinus li p{ margin-bottom:1rem; font-size:1.4rem; line-height:2}
.about_joinus .waterfall-width-column li:nth-child(1){ margin-top:0;}
.about_joinus .waterfall-width-column li{ margin-bottom:7rem;}


@media screen and (max-width:1000px){
	#about .left,#about .right{width:100%;}
	#about .index_about .right{width:100%; height:auto;padding:1rem  5%; float:left;}
	#about .index_about .right h1{position:relative;width:90%; margin-top:1rem;}
	#about .index_about .right h2{}
	
	
	#about h1{font-size: 5rem;}
	#about h2{font-size: 2rem;}
	#about .line{ margin:1rem 0; z-index:-1;}
	#about .content{ font-size:1rem;}
	
	.about_brand{padding:10rem 0 5rem 0;}
	.about_brand .left{ padding:0 5%;}
	.about_brand .right{ padding:0 5%; text-align:left}
	.about_brand .right .content{width:100%;}
	
	.about_detail .left h1{}
	.about_detail .left{ text-align:left;padding:0 5%;}
	.about_detail .left ul{ padding:2rem 0;}
	.about_detail .left ul li{ font-size:1.5rem;}
	.about_detail .left ul li span{ font-size:3rem;}
	
	.about_show{padding:1rem 5%;}
	.about_show .left{padding-right:0; text-align:left;}
	.about_show .swiper-slide .title{font-size:1.2rem;margin-top:-2.4rem; padding:0.5rem 0}
	.about_show .show_year{ margin:1rem 0;}
	.about_show .show_year a{margin:0 0.5rem;}
	
	.about_grossover .right{padding:0 5%;}
	.about_grossover .brandlist li{ margin:1rem 0;width:45%;-webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%); opacity:1; float:left;margin-right:10%;}
	.about_grossover .brandlist li:nth-child(2n+0){ margin-right:0;}
	
	.about_joinus{}	
	#about .about_joinus .line{ margin-top:-2rem; z-index:10;}
	.about_joinus .joinus{margin-top:-1rem;padding:3rem 5%}
	.about_joinus .joinus li p{ font-size:1rem;}
}



/*卡宾先生*/

.cabbeen_top{}
.cabbeen_movie{width:100%; height:100%; background:#FFF;/* background:url(../upload/Cabbeen/bg.jpg) center; */text-align:center; padding:10% 20%;}
.cabbeen_movie h3{ padding:2rem 0; color:#000;}


@media screen and (max-width:1000px){
	.cabbeen_movie{ padding:25% 0 10% 0; background:#ffcb00}
	.cabbeen_movie h3{ padding:1rem 0;}
}
.cabbeen_honer {width:100%; height:100%;background:#FFF; padding:15%;}
.cabbeen_honer .left{width:50%; float:left; padding-right:4rem; overflow:hidden}
.cabbeen_honer .right{width:50%; float:right; padding-left:4rem;}
.cabbeen_honer .right h1{ font-size:4rem;color:#f0c70c; margin-bottom:3rem; position:relative}
.cabbeen_honer .right h1 span{ font-size:2rem; position:absolute; margin-top:2rem; margin-left:4px}
.cabbeen_honer .right li{ margin:2rem 0; font-size:1.4rem;}



.cabbeen_honer .swiper-container{ padding: 0 0 6rem 0;height: auto;}
.cabbeen_honer .swiper-wrapper{height: auto;}
.cabbeen_honer .swiper-pagination-bullet {width:5rem; height:2.3rem;text-align: center; line-height: 2;font-size: 1.2rem;color:#000;opacity: 1;background: rgba(0,0,0,0);}
.cabbeen_honer .swiper-pagination-bullet:hover,.cabbeen_honer .swiper-pagination-bullet-active {color:#fff;background: #f0c70c;}


.cabbeen_subject{ background:#000;width:100%;}
.cabbeen_subject ul{ padding:10%;clear:both}
.cabbeen_subject ul li{width:24.25%;position: relative;float:left; margin-right:1%; margin-top:1%; text-align:center}.cabbeen_subject ul li img{width:100%;}
.cabbeen_subject ul li span{display: block;position: absolute;top: 0;left: 0;opacity: 0;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}
.cabbeen_subject ul li a{ position:absolute; top:50%; z-index:5; margin:0 auto;width:100%; color:#FFF; letter-spacing:1rem; font-size:1.5rem; font-weight:bold; padding:0 2rem;opacity: 0}
.cabbeen_subject ul li:hover a{ opacity:1}
.cabbeen_subject ul li span:hover{opacity: 1;cursor: pointer;}
.cabbeen_subject ul li:nth-child(4n+0){ margin-right:0;}

.popup{background:#fff;overflow-y: auto;}
.popup img{width:100%;}
.popup .close{width:3rem; height:3rem; background:url(../image/icon_close.svg) no-repeat; background-size:100% 100%; position:fixed; right:2.5%; top:2rem;cursor:pointer;}
.popup ul .width70{width:50%; margin:5rem auto;}
.popup ul .txt{width:50%; margin:5rem auto; font-size:1.8rem; line-height:2; text-align:justify}
.popup ul .txt>h3{ font-size:2.4rem; color:#000; margin-bottom:2rem;}
.popup ul .txt>h4{ font-size:1.8rem; margin:1rem 0}
.popup ul .txt p{ font-size:1.4rem; margin:1rem 0;}

.popup .serieslist{ text-align:center; padding-top:15%;}
.popup .serieslist li{font-size:4rem; font-family:"alternategothic-webfont"; font-weight:normal; text-align:center}
.bottom_close{width:3rem; height:3rem; background:url(../image/icon_close.svg) no-repeat; background-size:100% 100%;cursor:pointer; margin:0 auto;}


@media screen and (max-width:1000px){
	
	.cabbeen_honer { padding:0 0 10% 0;}
	.cabbeen_honer .left{width:100%; padding:0}
	.cabbeen_honer .right{width:100%; float:left; padding:0 5%}
	.cabbeen_honer .right h1{ font-size:32px;margin-bottom:1rem; margin-top:1rem;}
	.cabbeen_honer .right h1 span{ margin-top:16px;}

	.cabbeen_honer .right li{ margin:1rem 0; font-size:1rem;}
	
	.cabbeen_honer .swiper-container{ padding:0 0 4rem 0;}
	.cabbeen_honer .swiper-pagination-bullet {width:10%; height:2rem;text-align: center; line-height: 2;font-size: 1.2rem;}
	
	.cabbeen_subject ul{ padding:5%;}
	.cabbeen_subject ul li{width:49%;margin-right:2%; margin-top:2%; text-align:center}
	.cabbeen_subject ul li img{width:100%;}
	.cabbeen_subject ul li:nth-child(2n+0){ margin-right:0;}
	.cabbeen_subject ul li a{top:30%;font-size:1rem;padding:0 0.5rem;letter-spacing:2px;}
	
	.popup .close{width:2rem; height:2rem;right:5%; top:2.5%;}
	.popup ul { padding:0 5%;}
	.popup ul .width70{width:100%; margin:5rem 0;}
	.popup ul .txt{width:100%; margin:5rem 0; font-size:1.2rem; line-height:2;}

}


/*Vip*/
.page_vip{width:100%;position:relative; z-index:5; padding-top:20rem;}
.page_vip li img{width:100%;}
@media screen and (max-width:1000px){
	.page_vip{padding-top:10rem;}
}

/*BRAND*/
.brand_top{ background:#000;}
.brand_subject{ background:#FFF;width:100%; padding:10rem 0 5rem 0; clear:both;}
.brand_subject ul{width:70%; margin:0 auto;}
.brand_subject ul li{ margin-bottom:8rem;width:45%; margin-right:10%; float:left;}
.brand_subject ul li:hover{ opacity:0.7;cursor:pointer;}
.brand_subject ul li h2{ line-height:1; margin-top:2rem; color:#000; font-size:6rem; font-family:"alternategothic-webfont"; font-weight:normal; }
.brand_subject ul li h2 img{ height:100%;width:auto;}
.brand_subject ul li h5{ font-size:2rem; margin-bottom:2rem;margin-top:1rem;}
.brand_subject ul li:nth-child(2n+0){ margin-right:0}

.brand_subject ul li img{width:100%;}

.brand_about{width:100%;overflow:hidden}
.brand_about .index_about{ background:#442180}
/*.brand_about .right h1{ font-size:14rem;color:#442180; -webkit-text-stroke: 1px white;text-stroke: 1px gray;line-height:1;-moz-hyphens: auto;-ms-hyphens: auto;-webkit-hyphens: auto;hyphens: auto;word-wrap: break-word;}*/
/*.brand_about .right h1{width:80%; z-index:10;}*/
.brand_about .right{ padding-bottom:4rem;}
.brand_about .right h1{ height:6rem;}
.brand_about .right h1 img{width:auto; height:100%;}
.brand_about .right .content{ font-size:1.6rem;}
.brand_about .swiper-slide{width:100%;}


.brand_bg_1{background:#ffcb00; color:#FFF}/*卡宾休闲 大卡宾*/
.brand_bg_1 .index_about{ color:#000}
.brand_bg_1 .index_about .line{ background:#000;}
.brand_bg_2{background:#451875; color:#FFF}/*2am*/
.brand_bg_3{background:#153e35; color:#FFF}/*卡宾都市 Urban*/
.brand_bg_4{background:#ef001e; color:#FFF}/*卡宾儿童*/
.brand_bg_5{}

.brand_bg_1 .line,.brand_bg_2 .line,.brand_bg_3 .line,.brand_bg_4 .line{ height:0.7rem;width:100%; background:#FFF;}

.brand_series{width:100%; padding:10% 0; background:#FFF}
.brand_series .left{width:11%; float:left; text-align:center;overflow:hidden}
/*.brand_series .left h2{width:60%; margin:10rem auto 4rem auto;}*/
.brand_series .left h3{font-size:5rem; margin-top:5rem; font-family:"alternategothic-webfont"; font-weight:normal; color:#000; line-height:1;}
.brand_series .left h5{ font-size:2.2rem; color:#FFF; font-weight:normal}
.brand_series .left .more{width:2.6rem; height:3rem; margin:0 auto; margin-top:150%;background:url(../image/more_b.svg) no-repeat; background-size:100% 100%;cursor:pointer;}

.brand_series .right{width:89%; float:right;overflow:hidden; position:relative}
.brand_series .right li{width:25%; float:left;position: relative;}
.brand_series .right li img,.brand_series .right li span img{width:100%; height:auto;}
.brand_series .right li span{display: block;position: absolute;top: 0;left: 0;opacity: 0;-webkit-transition: all 0.6s ease 0s;-moz-transition: all 0.6s ease 0s;transition: all 0.6s ease 0s;width:100%}
.brand_series .right li span:hover{opacity: 1;cursor: pointer;}



@media screen and (max-width:1000px){
	
	.brand_subject{ padding:5rem 5%;}
	.brand_subject ul{width:100%;}
	.brand_subject ul li{ margin-bottom:8rem;width:100%;}
/*	.brand_subject ul .left{width:70%;}
	.brand_subject ul .right{width:90%;}*/
	.brand_subject ul li{ margin-bottom:6rem;}
	.brand_subject ul li h2{margin-top:1rem;font-size:4rem;}
	.brand_subject ul li h5{ font-size:1.6rem; margin-bottom:1rem;}
/*	.brand_subject ul .left h2,.brand_subject ul .left h5,.brand_subject ul .left span{ padding-left:5%;}
	.brand_subject ul .right h2,.brand_subject ul .right h5,.brand_subject ul .right span{ padding-right:5%;}*/
	
	.brand_about .right h1{ padding-top:3rem; display:none}
	.brand_about .right .content{ font-size:1.2rem;}
	
	
	
	.brand_series .left{width:100%; float:left; text-align:left; padding:5%;}
	.brand_series .left h2{ display:none;}
	.brand_series .left h3{font-size:5rem; margin-top:5rem;width:50%;}
	.brand_series .left h5{ font-size:1.8rem;width:50%;}
	.brand_series .left .more{width:2.6rem; height:3rem; margin:0 auto; margin:0; margin-top:-5rem; float:right;}
	.brand_series .right{width:100%;}
	.brand_series .right li{width:50%;} 
	
	
}


.brand_shop{background:#FFF;width:100%;}
.brand_shop .swiper-container-shop{width:70%; float:left} 
.brand_shop .swiper-slide h2{ position:absolute; margin-top:-7rem; margin-left:5rem; color:#FFF; font-size:3rem;}

.brand_shop .swiper-slide {width:100;height:auto;}
.brand_shop .swiper-slide img{width:100%;}

.brand_shop .shop_info{width:30%; float:left; min-height:400px}
.brand_shop .shop_info>ul{ padding:16%; font-size:1.8rem;}
.brand_shop .shop_info>ul h3{ font-size:2.2rem; border-bottom:2px solid #000; font-weight:normal; margin:2rem 0; padding-bottom:1rem;}
.brand_shop .shop_info>ul .shop_list{}
.brand_shop .shop_info>ul .shop_list li{ margin-top:2rem; border-bottom:1px solid #ddd; padding-bottom:2rem;}
.brand_shop .shop_info>ul .shop_list li h5{ font-size:1.8rem;margin-bottom:2rem;}
.brand_shop .shop_info>ul .shop_list li h5 span{ float:right;font-weight:normal; }
.brand_shop .shop_info>ul .shop_list li p{ padding-left:3rem; font-size:1.4rem; background:url(../image/map.svg) left center no-repeat; height:2rem; background-size:auto 100%; margin-bottom:2rem; clear:both}

.area_select{ padding-bottom:6rem;}
.area_select li{width:40%; float:left; margin-right:20%; border-bottom:1px solid #000; padding-bottom:0.5rem;}
.area_select li:nth-child(2n){ margin-right:0;}
.area_select li select{ border:0; font-size:1.8rem; background:url(../image/goDown.svg) center right no-repeat; background-size:auto 80%;width:100%;}

@media screen and (max-width:1000px){
	.brand_shop .swiper-container-shop{width:100%; }
	.brand_shop .shop_info{width:100%;}
	.brand_shop .swiper-slide h2{ font-size:2rem; margin-top:-4rem; margin-left:5%;}
	.brand_shop .shop_info>ul{ padding:5%;}
	.brand_shop .shop_info>ul h3{ display:none;}
}

/*show*/
.show_top img{ width:100%}
.show_list{ background:#FFF; min-height:1100px;padding:6rem 0 10rem 0}
.show_list img{width:100%;}
.show_list .title{font-size:8rem; font-family:"alternategothic-webfont"; font-weight:normal;width:auto; color:#000;line-height:1;-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg); position:absolute;transform-origin: top left; margin-left:8rem; margin-top:0rem}

/*.show_list .title{font-size:8rem; font-family:"alternategothic-webfont"; font-weight:normal;width:auto; color:#000; margin-top:10rem; margin-left:1%; line-height:1;-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg); position:absolute}*/


.show_list ul{width:80%;margin:0 auto;}

.waterfall-width-column {column-count: 2;column-gap:10%;}
.waterfall-width-column li{ margin-bottom:5rem;}
.waterfall-width-column li.show-title{line-height:1; margin-top:2rem; color:#000; font-size:6rem; font-family:"alternategothic-webfont"; font-weight:normal;}
.waterfall-width-column li.show-title img{ text-align:left}
.waterfall-width-column li.show-title p{font-size:2rem; margin-bottom:2rem;margin-top:1.5rem; font-weight:bold}
.waterfall-width-column li:nth-child(1){ margin-top:0rem;}

.show_list .next{width:80%; margin:0 auto; text-align:right;font-size:8rem; font-family:"alternategothic-webfont"; font-weight:normal; padding:5rem 0 0 0;cursor:pointer;}

@media screen and (max-width:1000px){
	.show_list{padding:3rem 5% 10rem 5%}
	.show_list .title{/* margin-top:0rem;font-size:4rem;-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);margin:0*/ display:none}
	.waterfall-width-column li.show-title p{font-size:1.6rem;}
	.show_list ul{width:100%;}
	.waterfall-width-column {column-count: 1;column-gap:0%;}
	.waterfall-width-column li{ margin-bottom:2rem;}
	
	.show_list .next{width:100%;text-align:right;font-size:4rem;}
}

/* footer*/
.float_div{width:100%;}
#footer{background:#000;position:fixed; z-index:0;width:100%; bottom:0;color:#FFF; opacity:0;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;
-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.index_footer{ background:#000; text-align:center;width:100%; height:100%; padding-top:15%;}
.index_footer ul{width:60%;}
.index_footer img{width:100%;}
.index_footer li{ padding-bottom:4rem; color:#FFF;}
.index_footer li:nth-child(1){width:16%; margin:0 auto;}
.index_footer li:nth-child(2) a{ margin:0 2rem; color:#FFF; font-size:1.2rem;padding-left:2rem}
.index_footer li .weixin{background:url(../image/icon_weixin_w.svg) no-repeat left center; background-size:auto 100%;}
.index_footer li .weibo{background:url(../image/icon_weibo_w.svg) no-repeat left center; background-size:auto 100%;}
.index_footer li .tmall{background:url(../image/icon_tmall_w.svg) no-repeat left center; background-size:auto 100%;}
.index_footer li .jd{background:url(../image/icon_jd_w.svg) no-repeat left center; background-size:auto 100%;}
.index_footer li:nth-child(3){width:15%; margin:0 auto;}
.index_footer li:nth-child(3) img{width:100%;}
.copyright{width:100%; position:absolute; z-index:0; bottom:0; border-top:1px solid #404040; padding:1.5rem 0; text-align:center; font-size:1rem; color:#FFF;}

.index_footer .brand li:nth-child(1){width:40%;}
.index_footer .brand li:nth-child(3){width:80%;}


.index_footer li:nth-child(4){ margin:0 auto; margin-top:5rem;width:70%;}
.index_footer li:nth-child(4) a{width:20%; float:left; margin:0 2.5%;}
.index_footer li:nth-child(4) a:hover{ opacity:0.7;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;transition: all 0.3s ease 0s;}

@media screen and (max-width:1000px){
	.index_footer ul{width:90%;}
	.index_footer li:nth-child(1){width:30%;}
	.index_footer li:nth-child(2) a{font-size:12px; margin:0 1rem;padding-left:2rem}
	.index_footer li:nth-child(3){width:35%;}
	.index_footer li:nth-child(4){margin-top:3rem;width:100%;}
	.copyright{ padding:0 5%;}
}

.page{ background:#000}



/*news*/
.page_news{ background:#000;}
.title{ position:absolute; margin-top:-6rem; text-align:center;width:100%; color:#FFF; font-size:2rem;}
.page_news #newslist{width:80%; margin:0 auto; padding-top:5rem; min-height:1200px;position:relative; z-index:5; background:#000}

.page_news_detail{ background:#FFF;position:relative; z-index:5;}
.news_top img{width:100%}
.news_detail{ padding:5rem 0; text-align:center;}
.news_detail h1{}
.news_detail h4{ font-weight:normal;}
.news_detail ul{ padding-top:5rem; clear:both;} 
.news_detail ul .content{width:50%;text-align:left; margin:5rem auto;}
.news_detail ul .img{width:65%; margin:0 auto;}
.news_detail ul .img span{ color:#000; font-weight:bold;font-style:italic;}
.news_detail ul .img img{width:100%; margin-bottom:2rem;}

@media screen and (max-width:1600px){
	.page_news #newslist{width:90%}
}

@media screen and (max-width:1300px){
	.page_news #newslist{width:99%}
}
@media screen and (max-width:1000px){
	.page_news #newslist{width:100%;margin-top:2rem;}
	.title{margin-top:-4rem;font-size:1.4rem;}
	
	.news_detail{ padding:5%;}
	.news_detail h1{ font-size:2.4rem}
	.news_detail ul{ padding-top:2rem;}
	.news_detail ul .content{width:100%;}
	.news_detail ul .img{width:100%; }
}






#weixin{ position:fixed;top:0; left:0; height:100%; width:100%; z-index:20; display:none}
#weixin .mask{ width:100%; height:100%;background: rgba(255, 255,255, 0.7);}
#weixin .mask .code{width:200px; top:50%; margin-top:-100px; left:50%; position:absolute; margin-left:-100px; background:#FFF; text-align:center; font-size:14px; padding:10px}







.grid {
	overflow: hidden;
	margin: 0;
	padding:0;
	width: 100%;
	list-style: none;
	text-align: center;
	
	display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;
-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;
}

/* Common style */
.grid figure {
	position: relative;
	z-index: 1;
	display: inline-block;
	overflow: hidden;
	margin: -0.15em;
	width: 25%;
	/*height: 700px;*/
	background: #000;
	text-align: center;
	cursor: pointer;
	border:2px solid #000;
}
.grid img{max-width:100%;}

.grid figure pc:img {
	position: relative;
	display: block;
	opacity: 0.5;
}
/*.grid figure mobile:img {
	opacity:0;
	display:none;
}*/

.grid figure figcaption {
	padding: 2rem;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h1 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h1 span {
	font-weight: 800;
}

.grid figure h1,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}





figure.effect img {
	min-width: 100%;
}

figure.effect figcaption {
	padding: 3em;
}

figure.effect figcaption::before,
figure.effect figcaption::after {
	position: absolute;
	content: '';
	opacity: 0;
}

figure.effect figcaption::before {
	top: 50px;
	right: 30px;
	bottom: 50px;
	left: 30px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: scale(0,1);
	transform: scale(0,1);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
}

figure.effect figcaption::after {
	top: 30px;
	right: 50px;
	bottom: 30px;
	left: 50px;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	-webkit-transform: scale(1,0);
	transform: scale(1,0);
	-webkit-transform-origin: 100% 0;
	transform-origin: 100% 0;
}

figure.effect h1 {
	padding-top: 26%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

figure.effect p {
	padding: 0.5em 2em;
	text-transform: none;
	opacity: 0;
	-webkit-transform: translate3d(0,-10px,0);
	transform: translate3d(0,-10px,0);
}
figure.effect h1{width:80%; margin:0 auto; margin-top:60%;}

figure.effect img,
figure.effect h1 {
	-webkit-transform: translate3d(0,30px,0);
	transform: translate3d(0,30px,0);
}
figure.effect>img{	-webkit-transform: scale(1.05);
	transform: scale(1.05);}
figure.effect img,
figure.effect figcaption::before,
figure.effect figcaption::after,
figure.effect p {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

figure.effect:hover img {
	opacity: 0.6;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect:hover figcaption::before,
figure.effect:hover figcaption::after {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.effect:hover h1,
figure.effect:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect:hover figcaption::after,
figure.effect:hover h1,
figure.effect:hover p,
figure.effect:hover img {
	-webkit-transition-delay: 0.15s;
	transition-delay: 0.15s;
}

@media screen and (max-width:1000px){
	.grid{display: -webkit-block;display:block;}
	.grid figure{width: 100%; height:20rem;}
	figure.effect h1{width:40%; margin:0 auto; margin-top:0%; padding-top:10%;}
	figure.effect{border:1px solid #000;margin: 0em;}
	.grid figure figcaption {padding: 0rem;}
	figure.effect:hover h1,
	figure.effect:hover p {
		opacity: 1;
		-webkit-transform: translate3d(0,30px,0);
		transform: translate3d(0,30px,0);
	}
	
}

/*@media screen and (max-width: 69.5em) {
	.grid figure {
		width: 50%;
	}	

	.grid figure figcaption {
		font-size: 90%;
	}
}


@media screen and (max-width: 41.5em) {

	.grid figure {
		width: 100%;
	}
}

*/

.accordion {
  margin: 0 auto;
  padding-top:20rem;
  width: 50%;
  
}
.accordion .item {
  height: 100px;
  background: #CCC;
  color: #000;
  margin:20px 0 0 0;
}
.accordion .item h3 {
  vertical-align: middle;
  height: 100%;
  text-align:center;
  background:url(../../../image/icon_down.svg) no-repeat center right; background-size:30px auto;
  background-position: right 20px bottom 20px;
}
.accordion .item img {
  padding-left: 15px;
  width: 30px;
  vertical-align: middle;
}
.accordion .item h3:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.accordion p {
  padding: 0; background:#CCC;
  display: none;
 
}

.sortable__nav li:nth-child(1) a{}
#sortable li:nth-child(1){}







#fangyi{ background:#fbfbfc}
#fangyi h2{ font-size:3rem;}

#fangyi .infomation{margin-top:8em; clear:both; padding-bottom:5rem;}
#fangyi .infomation li{ float:left;width:30%; margin-right:5%;-moz-box-shadow:0 0 16px #ddd; -webkit-box-shadow:0 0 16px #ddd; box-shadow:0 0 16px #ddd; text-align:center; padding-bottom:1rem; margin-bottom:8rem; background:#FFF;cursor:pointer;}
#fangyi .infomation li img{width:100%;}
#fangyi .infomation li:nth-child(3n){ margin-right:0;}
#fangyi .infomation li h4{font-size:2rem; margin:2rem 0 0 0;}
#fangyi .infomation li p{ font-size:1.4rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp:3;-webkit-box-orient: vertical; padding:0 5%; line-height:2; height:8rem;}
#fangyi .infomation li hr{border: 0;height: 1px;background-image: linear-gradient(to right, rgba(255, 255,255, 0), rgba(161, 161, 161, 0.5), rgba(255, 255, 255, 0)); margin:10px 0}
#fangyi .infomation li a{ margin:2rem 0; text-align:center; clear:both;font-size:1.2rem; line-height:3}

#fangyi .infomation li:hover{ background:#fbc600;}
#fangyi .infomation li:hover h4,#fangyi .infomation li:hover p,#fangyi .infomation li:hover a{ color:#FFF;}
#fangyi .infomation li:hover hr{background-image: linear-gradient(to right, rgba(251, 198,0, 0.4), rgba(251, 207, 37, 1), rgba(251, 198,0, 0.4));}

@media screen and (max-width:1000px){
	#fangyi .infomation{margin-top:3em; }
	#fangyi .infomation li{ float:left;width:100%; margin-right:0%;margin-bottom:5rem; }
}

#fangyi .fangyi_product{ clear:both; background:#eeeeef; padding:8rem 0; text-align:center;}
#fangyi .fangyi_product h2{ padding-bottom:6rem;}
#fangyi .fangyi_product ul{ margin-bottom:4rem; overflow:hidden}
#fangyi .fangyi_product li{ float:left;width:49.5%; margin-right:1%;position:relative;overflow:hidden;cursor:pointer;}
#fangyi .fangyi_product li>dd{ background:#000;}
#fangyi .fangyi_product li:nth-child(2n){ margin-right:0;}
#fangyi .fangyi_product li img{width:100%; opacity:0.5; }
#fangyi .fangyi_product li h3{font-size:3rem; color:#FFF; margin-top:-25rem; height:22rem;}
#fangyi .fangyi_product li:hover img{-webkit-transform: scale(1.1);transform: scale(1.1);}

@media screen and (max-width:1000px){
	#fangyi .fangyi_product{ padding:3em 0 ;}
	#fangyi .fangyi_product li{ float:left;width:100%; margin-right:0; margin-bottom:1%;}
	#fangyi .fangyi_product h2{ padding-bottom:2rem;}
	#fangyi .fangyi_product li h3{font-size:3rem; color:#FFF; margin-top:-15rem; height:15rem; line-height:1.2}
	#fangyi .fangyi_product li h3 p{ font-size:2rem;}
}


#fangyi .fangyi_packing{ padding:8rem 0;}
#fangyi .fangyi_packing ul{width:60%; margin:0 auto; padding-bottom:5rem;}
#fangyi .fangyi_packing li{width:50%; text-align:center; float:left; font-size:3rem;cursor:pointer;}
#fangyi .fangyi_packing li.active,#fangyi .fangyi_packing li:hover{color:#fbc600; font-weight:bold}
#fangyi .fangyi_packing li.active span,#fangyi .fangyi_packing li:hover span{border-bottom:2px solid #fbc600; padding-bottom:1rem;}
#fangyi .fangyi_packing .packing_box{ margin-top:6rem; clear:both;width:100%; height:30rem; min-height:470px;-moz-box-shadow:0 0 16px #ddd; -webkit-box-shadow:0 0 16px #ddd; box-shadow:0 0 16px #ddd; border-radius:0.5rem; background:#FFF; position:relative;}

#packing_box2{ display:none}
#fangyi .fangyi_packing .packing_box .swiper-container{width:90%; margin-left:5%; text-align:center;cursor:pointer;}
#fangyi .fangyi_packing .packing_box .swiper-container img{ margin-bottom:2rem;cursor:pointer;}
#fangyi .fangyi_packing .packing_box dd{width:90%; margin-left:5%;height:30rem;min-height:470px;transform:rotate(-4deg); background:#FFF; position:absolute;}

#fangyi .fangyi_packing .packing_box .swiper-container{ padding-top:8rem;cursor:pointer;}

@media screen and (max-width:1000px){
	#fangyi .fangyi_packing{ padding:3em 0;}
	#fangyi .fangyi_packing ul{width:100%; }
	#fangyi .fangyi_packing li{font-size:2rem;}
	#fangyi .fangyi_packing .packing_box{ margin-top:2rem;height:400px;}
	#fangyi .fangyi_packing .packing_box .swiper-container{ padding-top:4rem;}
	#fangyi .fangyi_packing .packing_box dd{height:400px;}
}

#fangyi .fangyi_cooperation{background:#eeeeef; text-align:center; padding:6rem 0;}
#fangyi .fangyi_cooperation h2{ padding-bottom:3rem;}
#fangyi .fangyi_cooperation ul{ max-width:600px; margin:0 auto;}	
#fangyi .fangyi_cooperation li{width:45%; margin-right:10%; float:left; text-align:left}
#fangyi .fangyi_cooperation li:nth-child(2n){ margin-right:0;}

@media screen and (max-width:1000px){
	#fangyi .fangyi_cooperation li{width:80%; margin-right:0; margin-left:10%; }
}


.fangyi_nav{ float:left;width:24%; margin-top:5em;}
.fangyi_nav ul{ border:1px solid #CCC; font-size:1.8rem;}
.fangyi_nav ul li{ padding:1.2rem 2rem; border-bottom:1px solid #CCC; color:#000;cursor:pointer;}
.fangyi_nav ul li span:after{ content:'>'; float:right; font-family:"source_sans_prolight"; opacity:0.2}
.fangyi_nav ul li.active,.fangyi_nav ul li:hover{background:#fbc600; color:#FFF;}
.fangyi_nav ul li.active span:after,.fangyi_nav ul li:hover span:after{ opacity:1}


.fangyi_detail{ float:left;width:71%; margin-left:5%;margin-top:5em; margin-bottom:5em; padding-bottom:5em;}
.fangyi_detail img{width:100%; margin-bottom:2em;}
.fangyi_detail h1{ line-height:1; font-size:3.2rem;}
.fangyi_detail h1 p{ font-size:2rem;font-family:"alternategothic-webfont"; padding-bottom:1.2rem; border-bottom:1px solid #eee; margin-bottom:1em;}

.fangyi_detail h3{ margin-top:2em;font-size:2.2rem; line-height:1; border-left:4px solid #fbc600; padding-left:4px}
.fangyi_detail h3 p{ font-size:1.8rem;font-family:"alternategothic-webfont";margin-bottom:2em; line-height:1;}



@media screen and (max-width:1000px){
	.fangyi_nav{ width:100%; margin-top:2em;}
	.fangyi_nav ul{ border-top:0; font-size:1.4rem;border-left:1px solid #CCC; }
	.fangyi_nav ul li{ padding:0.6rem;width:25%; float:left; text-align:center;border-left:1px solid #CCC;}
	.fangyi_nav ul li:nth-child(4){ display:none}
	.fangyi_nav ul li:nth-child(5),.fangyi_nav ul li:nth-child(9){border-right:1px solid #CCC;}
	.fangyi_nav ul li span:after{ display:none}
	.fangyi_detail{width:100%; margin-left:0;margin-top:2em;}
	.fangyi_detail .content{word-break:break-all;}
	
}