body{background:#ececec;}
.wraps{ width: 100%; overflow: hidden;background: url("../images/main_bg.jpg") left top	repeat-x #fff; min-width: 1300px;}
.wraps img{ width: 100%; display: block;}
.headerp{ position: absolute; z-index: 3; top: 0; left: 0; width: 100%; z-index: 20;background:#ececec;}
.headerp.fixed{ position: fixed;}
.headerp.fixed .navsection{margin-top: 0;}
.hearder_percont{ width: 100%; height: 5.9vw; position: relative;background: #ececec;}
.hearder_percont img{ width: 100%; display: block;}
.contentwidth{ width: 82.7vw; margin: 0 auto; position: relative;}
.navsection{ width: 63vw;margin:0 auto;overflow: hidden; display: flex;justify-content: space-between;border-bottom: 1px solid #acacac;padding-top: 1vw;}
.navsection>div{ display: block;width: 7.1vw;font-size:1vw; text-align: center; position: relative; color: #acacac; line-height: 3.1;padding: 1.7vw 0 0;cursor: pointer;}
.navsection>div:hover{ color: #0062d0;}
.navsection>div.act{ color: #0062d0;}
.navsection>div:before{ content:""; display: block; width:1px; height:2.9vw; background: #bfbfbf; position: absolute; bottom: 1.5vw; right: 0; }
.navsection>div:last-child:before{display: none;}
.navsection>div.act:after{ content:""; display: block; width:8vw; height: 3px; background: #0062d0; position: absolute; bottom: 0; left:-0.5vw; }
.navsection .nav_icon_01{background:url("../images/nav_icon_01.png") center 0 no-repeat;background-size: 1.6vw auto;}
.navsection .nav_icon_01:hover,.navsection .nav_icon_01.act{background:url("../images/nav_icon_01_active.png") center 0 no-repeat;background-size: 1.6vw auto;}

.navsection .nav_icon_02{background:url("../images/nav_icon_02.png") center 0.2vw no-repeat;background-size: 2.1vw auto;}
.navsection .nav_icon_02:hover,.navsection .nav_icon_02.act{background:url("../images/nav_icon_02_active.png") center 0.2vw no-repeat;background-size: 2.1vw auto;}

.navsection .nav_icon_03{background:url("../images/nav_icon_03.png") center 0.3vw no-repeat;background-size: 2.3vw auto;}
.navsection .nav_icon_03:hover,.navsection .nav_icon_03.act{background:url("../images/nav_icon_03_active.png") center 0.3vw no-repeat;background-size: 2.3vw auto;}

.navsection .nav_icon_04{background:url("../images/nav_icon_04.png") center 0.4vw no-repeat;background-size: 2vw auto;}
.navsection .nav_icon_04:hover,.navsection .nav_icon_04.act{background:url("../images/nav_icon_04_active.png") center 0.4vw no-repeat;background-size: 2vw auto;}

.navsection .nav_icon_05{background:url("../images/nav_icon_05.png") center 0.4vw no-repeat;background-size: 2.2vw auto;}
.navsection .nav_icon_05:hover,.navsection .nav_icon_05.act{background:url("../images/nav_icon_05_active.png") center 0.4vw no-repeat;background-size: 2.2vw auto;}

.navsection .nav_icon_06{background:url("../images/nav_icon_06.png") center 0 no-repeat;background-size: 1vw auto;}
.navsection .nav_icon_06:hover,.navsection .nav_icon_06.act{background:url("../images/nav_icon_06_active.png") center 0 no-repeat;background-size: 1vw auto;}

.navsection .nav_icon_07{background:url("../images/nav_icon_07.png") center 0.2vw no-repeat;background-size: 1.8vw auto;}
.navsection .nav_icon_07:hover,.navsection .nav_icon_07.act{background:url("../images/nav_icon_07_active.png") center 0.2vw no-repeat;background-size: 1.8vw auto;}

.navsection .nav_icon_08{background:url("../images/nav_icon_08.png") center 0.4vw no-repeat;background-size: 1.7vw auto;}
.navsection .nav_icon_08:hover,.navsection .nav_icon_08.act{background:url("../images/nav_icon_08_active.png") center 0.4vw no-repeat;background-size: 1.7vw auto;}

.navsection .nav_icon_09{background:url("../images/nav_icon_09.png") center 0.4vw no-repeat;background-size: 1.7vw auto;}
.navsection .nav_icon_09:hover,.navsection .nav_icon_09.act{background:url("../images/nav_icon_09_active.png") center 0.4vw no-repeat;background-size: 1.7vw auto;}


.maintop{ margin-top: 3vw;}
.kvper.swiper-container{margin-bottom: 1.4vw;}
.kvper .swiper-button-prev,.kvper .swiper-button-next{background-image: unset;width:2vw;left: 2vw;}
.kvper .swiper-button-next{right: 2vw;left: unset;}
.kvper .swiper-button-prev img,.kvper .swiper-button-next img{width: 100%;}
.kvper.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 1.5vw;}
.kvper.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 0.5vw;}
.kvper .swiper-pagination-bullet{background: #000;opacity: 0.5;}
.kvper .swiper-pagination-bullet-active{background: #fff;opacity: 1;}

.picbox{position: relative; width: 100%;height: 17.7vw;overflow: hidden;}
.sty1 .picbox:after{ content:""; display: block; background: url(../images/open.png) no-repeat; width: 93px; height: 93px; z-index: 10; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; transition: all 0.6s ease;}
.picbox>img{ transition: all 0.6s ease;width: 100%;height: 100%;}
.picbox:hover>img{ transform: scale(1.05);}

.cont_brother{ width:100%;display: flex;flex-wrap: wrap;justify-content: flex-start}
.video_blocks{ position: relative;cursor: pointer; float: left; margin-bottom: 1vw; transition: all 0.6s ease; width: 17.7vw;margin: 0 1.45vw;}
.wordpart{ padding: 1vw 0; position: relative;}
.wort1{ font-size: 1.2vw; color:#636363;line-height:1.4;text-align: center;}
.wort2{ width: 100%;font-size: 0.8vw; line-height: 1.6; color: #636363; padding:0.5vw 0 0.5vw;text-align: center;}
.video_blocks:hover .picbox:after{ opacity: 1;}

.videobox{ width: 200px; height: 150px; overflow: hidden; position: relative; margin-right: 20px;}
.videobox>video{ width: 300px; top: 50%; transform: translate(-50%,-50%); position: absolute; top: 50%; left: 50%;}

video{ width: 100%; display: block;}


.video_pupbg{ background: rgba(0,0,0,0.9); width: 100%; height: 100%; position: fixed; z-index: 999; top: 0; left: 0;}
.video_pup{ width: 960px; position: absolute; top:20%; left: 50%; margin-left: -480px;}
.closevideos{ width: 64px; position: absolute; display: block; right: -80px; top: 0;}
#dvideo{ width: 100%; height: 100%; display: block; margin: 0 auto;}
.video_box{ background: #000; height: 541px;}
.swiper-slide img{ display:block; width:100%;}
.pc_block{ display: block;}
.wrap_block{ display: none;}

.section_popbg{ width: 100%; height: 100%; background: #ececec; position: fixed; top: 0; right: 0; z-index: 500; transform: translate(100vw,0); transition: all 0.8s ease;}
.act.section_popbg{ transform: translate(0,0);}
.section_popbg img{ width: 100%; display: block;}
.popcontent{ width: 100%; margin:0 auto; position: relative;}
.secpop_title{ text-align: center; font-size: 24px; color: #fff;background: #000; padding:20px;}
.detailSec{ margin:0 20px 40px 20px; width: calc(25% - 40px); float: left; background: #fff; cursor: pointer;}
.detail_coper{ padding:10px 70px 10px 10px; position: relative;}
.roal_t1{ color: #636363; font-size:16px; margin-bottom: 6px;}
.roal_t2{ color: #636363; font-size:12px; height: 70px;}
.videoSecpic{ width: 100%; position: relative;}
.videoSecpic:after{ content:""; display: block; background: url(../images/open.png) no-repeat; width: 60px; height: 60px; background-size: 100% auto; z-index: 10; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; transition: all 0.6s ease;}
.detailSec:hover .videoSecpic:after{ opacity: 1;}
.detail_coper:after{ content:""; display: block;  width: 30px; height: 15px; position: absolute; top: 36px; right: 5px;}
.detailSec:hover .detail_coper:after{ }
.close_sec{ display: block; width: 56px; position: absolute; top: 10px; right: 20px;}
.secpoper {width:100%;height:calc(100vh - 72px);}

@media screen and  (max-width:800px) {
	.navsection > div:before {
		content: "";
		display: block;
		width: 1px;
		height: 2.9vw;
		background: none;
		position: absolute;
		bottom: 1.5vw;
		right: 0;
	}
}
@media screen and  (min-width:1921px){
	.kvper{width: 1920px;margin: 0 auto;}
	.contentwidth{width: 1591px;}
	.video_blocks {width: 341px;margin: 0 28px;}
	.picbox{height: 341px;}
	.wort1{font-size: 26px;}
	.wort2{font-size: 18px;}
	.kvper.swiper-container {margin-bottom: 42px;}
	.kvper .swiper-button-prev, .kvper .swiper-button-next {background-image: unset;width: 38px;left: 38px;}
	.kvper .swiper-button-next{right: 38px;left: unset;}
	.navsection {width: 1210px;padding-top: 19.2px;}
	.hearder_percont{height: 114px;}
	.maintop{margin-top: 58px;}
	.navsection>div {width: 134px;font-size: 20px;padding: 32px 0 0;}
	.navsection>div.act:after{width: 160px;left: -13px;}
	.navsection .nav_icon_01{background:url("../images/nav_icon_01.png") center 0 no-repeat;background-size: 31px auto;}
	.navsection .nav_icon_01:hover,.navsection .nav_icon_01.act{background:url("../images/nav_icon_01_active.png") center 0 no-repeat;background-size: 31px auto;}
	.navsection .nav_icon_02{background:url("../images/nav_icon_02.png") center 4px no-repeat;background-size: 42px auto;}
	.navsection .nav_icon_02:hover,.navsection .nav_icon_02.act{background:url("../images/nav_icon_02_active.png") center 4px no-repeat;background-size: 41px auto;}
	.navsection .nav_icon_03{background:url("../images/nav_icon_03.png") center 5px no-repeat;background-size: 44px auto;}
	.navsection .nav_icon_03:hover,.navsection .nav_icon_03.act{background:url("../images/nav_icon_03_active.png") center 5px no-repeat;background-size: 44px auto;}
	.navsection .nav_icon_04{background:url("../images/nav_icon_04.png") center 8px no-repeat;background-size: 39px auto;}
	.navsection .nav_icon_04:hover,.navsection .nav_icon_04.act{background:url("../images/nav_icon_04_active.png") center 8px no-repeat;background-size: 39px auto;}
	.navsection .nav_icon_05{background:url("../images/nav_icon_05.png") center 8px no-repeat;background-size: 43px auto;}
	.navsection .nav_icon_05:hover,.navsection .nav_icon_05.act{background:url("../images/nav_icon_05_active.png") center 8px no-repeat;background-size: 43px auto;}
	.navsection .nav_icon_06{background:url("../images/nav_icon_06.png") center 0 no-repeat;background-size: 19px auto;}
	.navsection .nav_icon_06:hover,.navsection .nav_icon_06.act{background:url("../images/nav_icon_06_active.png") center 0 no-repeat;background-size: 19px auto;}
	.navsection .nav_icon_07{background:url("../images/nav_icon_07.png") center 4px no-repeat;background-size: 34px auto;}
	.navsection .nav_icon_07:hover,.navsection .nav_icon_07.act{background:url("../images/nav_icon_07_active.png") center 4px no-repeat;background-size: 34px auto;}
	.navsection .nav_icon_08{background:url("../images/nav_icon_08.png") center 8px no-repeat;background-size: 33px auto;}
	.navsection .nav_icon_08:hover,.navsection .nav_icon_08.act{background:url("../images/nav_icon_08_active.png") center 8px no-repeat;background-size: 33px auto;}
	.navsection .nav_icon_09{background:url("../images/nav_icon_09.png") center 8px no-repeat;background-size: 33px auto;}
	.navsection .nav_icon_09:hover,.navsection .nav_icon_09.act{background:url("../images/nav_icon_09_active.png") center 8px no-repeat;background-size: 33px auto;}
}



@media screen and  (max-width:800px){
.kvper{display: none;}
.mkvper .swiper-button-prev,.mkvper .swiper-button-next{background-image: unset;width:6vw;left: 3vw;}
.mkvper .swiper-button-next{right:3vw;left: unset;}
.mkvper .swiper-button-prev img,.mkvper .swiper-button-next img{width: 100%;}
.mkvper.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 3.5vw;}
.mkvper.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 1.5vw;}
.mkvper .swiper-pagination-bullet{background: #000;opacity: 0.5;}
.mkvper .swiper-pagination-bullet-active{background: #fff;opacity: 1;}

.headerp{background: unset;top:16vw;}

.navsection{ width:100%;height:100vh; margin:0 auto;overflow: hidden; display: flex;flex-wrap: wrap;align-content: flex-start;
	justify-content: flex-start;border-bottom: unset;padding-top: 1vw;}
.navsection>div{ display: block;width: 23.1vw;height:13.1vw;margin:4vw; font-size:4vw;font-weight: 300; text-align: center; position: relative; color: #ffffff; line-height: 3.1;padding: 10vw 0 0;cursor: pointer;border-radius: 2vw;}
.navsection>div:hover{ color: #0062d0;}
.navsection>div.act{ color: #0062d0;font-weight: 500;}
.navsection>div.act:after{ content:""; display: block; width:10vw; height: 3px; background: unset; position: absolute; bottom: 0; left:-0.5vw; }
.navsection .nav_icon_01{background:url("../images/m_nav_icon_01.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 5.3vw auto;}
.navsection .nav_icon_01:hover,.navsection .nav_icon_01.act{background:url("../images/m_nav_icon_01_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 5.3vw auto;}

.navsection .nav_icon_02{background:url("../images/m_nav_icon_02.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 8vw auto;}
.navsection .nav_icon_02:hover,.navsection .nav_icon_02.act{background:url("../images/m_nav_icon_02_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 8vw auto;}

.navsection .nav_icon_03{background:url("../images/m_nav_icon_03.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 7.9vw auto;}
.navsection .nav_icon_03:hover,.navsection .nav_icon_03.act{background:url("../images/m_nav_icon_03_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 7.9vw auto;}

.navsection .nav_icon_04{background:url("../images/m_nav_icon_04.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 7.1vw auto;}
.navsection .nav_icon_04:hover,.navsection .nav_icon_04.act{background:url("../images/m_nav_icon_04_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 7.1vw auto;}

.navsection .nav_icon_05{background:url("../images/m_nav_icon_05.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 8.3vw auto;}
.navsection .nav_icon_05:hover,.navsection .nav_icon_05.act{background:url("../images/m_nav_icon_05_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 8.3vw auto;}

.navsection .nav_icon_06{background:url("../images/m_nav_icon_06.png") center 4vw no-repeat rgba(0, 0, 0, 0.9);background-size: 3.6vw auto;}
.navsection .nav_icon_06:hover,.navsection .nav_icon_06.act{background:url("../images/m_nav_icon_06_active.png") center 4vw no-repeat rgba(255, 255, 255, 0.9);background-size: 3.6vw auto;}

.navsection .nav_icon_07{background:url("../images/m_nav_icon_07.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 6.4vw auto;}
.navsection .nav_icon_07:hover,.navsection .nav_icon_07.act{background:url("../images/m_nav_icon_07_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 6.4vw auto;}

.navsection .nav_icon_08{background:url("../images/m_nav_icon_08.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 6.5vw auto;}
.navsection .nav_icon_08:hover,.navsection .nav_icon_08.act{background:url("../images/m_nav_icon_08_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 6.5vw auto;}

.navsection .nav_icon_09{background:url("../images/m_nav_icon_09.png") center 5.5vw no-repeat rgba(0, 0, 0, 0.9);background-size: 6.8vw auto;}
.navsection .nav_icon_09:hover,.navsection .nav_icon_09.act{background:url("../images/m_nav_icon_09_active.png") center 5.5vw no-repeat rgba(255, 255, 255, 0.9);background-size: 6.8vw auto;}


.pc_block{ display: none;}
.wrap_block{ display: block;}

.maintop{ margin-top: 20px;}
.section a{ font-size: 12px;}

.detailSec{ width: 100%; margin:0 0 3vw 0}


.wraps{ min-width: auto;}
.contentwidth{ width: 94.2vw;}
.headerp .contentwidth{ width: 100%;}
.navsection{ width: 96%; padding: 4%;}
.navsection>a{ font-size: 14px; width: 20%; line-height: 40px; padding: 0;}
.navsection>a.act:after{ top: 33px;}
.hearder_percont{position: fixed;width: 100%;height: 100vh;top:0;left: 0; background:rgba(27, 27, 27, 0.8);z-index:0;opacity: 0;}
.secpop_title{ padding:4vw; height:4vw;font-size: 3.5vw;}
.secpoper{ height: calc(100vh - 12vw);}
.roal_t2{ height: auto; padding-bottom: 10px;}

.mobile_menu{width: 28.1vw;height:10.8vw;position:fixed;left: 6.7vw;top:2vw;z-index: 99;}
.mobile_menu img{width:100%;}
.mobile_menu .nav_pic{width: 8.8vw;height:6.4vw;position: absolute;
	top: 0;
	left: 16vw;
}
.mobile_menu .nav_pic div{opacity: 0;top:0;left: 0;position: absolute;}
.mobile_menu .nav_pic .act{opacity: 1;}
.mobile_menu .nav_pic img{width: 100%;}
.mobile_menu .nav_pic .nav_icon_01{width: 4.5vw;top: 2.8vw;left: 1vw;}
.mobile_menu .nav_pic .nav_icon_02{width: 6.8vw;top: 2.8vw;}
.mobile_menu .nav_pic .nav_icon_03{width: 6.8vw;top: 2.8vw;}
.mobile_menu .nav_pic .nav_icon_04{width: 6vw;top: 2.8vw;}
.mobile_menu .nav_pic .nav_icon_05{width: 6.5vw;top: 3vw;}
.mobile_menu .nav_pic .nav_icon_06{width: 3.5vw;top: 2vw;left: 2vw;}
.mobile_menu .nav_pic .nav_icon_07{width: 4.5vw;top: 3vw;left: 1.5vw;}
.mobile_menu .nav_pic .nav_icon_08{width: 5vw;top: 3vw;left: 1.5vw;}
.mobile_menu .nav_pic .nav_icon_09{width: 5.5vw;top: 3vw;left: 1.5vw;}

.cont_brother{ width: 100%;}
.video_blocks{ width: 42vw; margin:0 2.5vw;}
.sty1.video_blocks{ width: 42vw; }
.sty2.video_blocks{ width: 42vw; }
.picbox{height: 42vw;}
.picbox:after{ opacity: 1; width: 15vw; height: 15vw; background-size: 100% auto;}
.videoSecpic:after{ opacity: 1; width: 15vw; height: 15vw;}

.wordpart{ padding: 3vw 0;}
.wort1{ font-size: 4vw;font-weight: bold;}
.wort2{ font-size: 3.5vw; padding: 1.5vw 0 4vw;}

.sty2 .wort2{ height: auto;}

.close_sec{top: 1vw;left: auto;right: 1vw;width: 10vw;}

.video_pup{ width: 90%; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); margin-left: 0;}
.closevideos{ right: 0; top: -10vw; width: 10vw;}
.closevideos>img{ width: 100%;}
.video_box{ height: 30vh;}

.fc_ptx1{ font-size: 18px;}
.fc_ptx2{ font-size: 14px;}
.control-center .send-barrage-tool{background: none; width: 90%; margin: 0; border:#9da0a3 1px solid;}
.control-center{ width: 100%; margin-top: 2vw;}
.zhibo_box{ width: 100%; height: 40px;}
.control-center .send-barrage-tool .send-barrage-value{ width: 100%;}
.control-center .send-barrage-tool .send-barrage-btn{ position: absolute; right: 0; top: 0; text-indent: 0; color: #fff; background:#00a1d6; line-height: 32px;}
.grey_btn{position: absolute; right: 0; top: 0; }

.sty1 .tcver{  width: 100%; position: relative;}
.videobox{  position: relative; width: 160px; height: 90px; margin-right: 15px; display: none; }
.videobox>video{ width: 210px;}

#header_con{ display: none;}
#footer_con{ display: none;}
}