﻿@charset "utf-8";
/* CSS Document */
#Detailbanner .ban { overflow: hidden; height: 360px;  position: relative; background-size: cover; background-repeat: no-repeat; background-position: center center; }
#Detailbanner .ban .container { position: relative; height: 100%; display: flex;  align-items: center; }
#Detailbanner .ban .ban-pic{ margin:0 10%; display: none;}
.ban-text{ display: none; }
.ban-text h1 { font-size: 46px; color: #fff; line-height: 2;  font-weight: 400; margin-bottom: 20px;}
.ban-text p{ font-size: 18px; color: #fff; line-height: 1.6; text-align: justify;}

/****** location--style ******/
.location { height: 40px; margin-bottom: 10px; text-align: right; }
.location span.title { display: none; }
.location span.space { font-size: 14px; color: #666; display: inline-block; }
.location span.space a { font-size: 14px; color: #666; line-height: 40px; display: inline-block; margin: 0 10px; text-transform: uppercase; }
.location span.space a.aHome { padding: 0 10px; margin: 0;  color: #666; }
.location span.space a.aHome i { color: #aa3333; font-size: 18px; }
.location span.space a:hover { color: #aa3333; }
.location span.space span { font-size: 14px; color: #666; line-height: 40px; display: inline-block; margin: 0 15px; text-transform: uppercase; }

/****** Detail-share-style ******/
.Detail-share { text-align: center; }
.share { text-align: center; margin: 0 auto; }
.share .share-name { float: left; font-size: 14px; color: #333; line-height: 30px; }
.share .bdsharebuttonbox { float: left; }
.share .bdsharebuttonbox a { overflow: hidden; float: right; margin: 2px 2px; border-radius: 50%; width: 26px; height: 26px; }
.share .bds_more { background: url('../images/icon/icon-more.jpg') no-repeat center center !important; }
.share .bds_tsina { background: url('../images/icon/icon-weibo.jpg') no-repeat center center !important; }
.share .bds_weixin { background: url('../images/icon/icon-weixin.jpg') no-repeat center center !important; }
.share .bds_qzone { background: url('../images/icon/icon-qq.jpg') no-repeat center center !important; background-image: url('../images/icon/icon-qq.jpg'); }
.share .bds_tqq { background: url('../images/icon/icon-qqkj.jpg') no-repeat center center !important; background-image: url('../images/icon/icon-qqkj.jpg'); }

/****** css3--transition--style ******/
.trst5s { transition: all 0.5s linear; -o-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -webkit-transition: all 0.5s linear; }
.trst3s { transition: all 0.3s linear; -o-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; }

/****** pager--style ******/
#SC_pager { text-align: center; }
#SC_pager .pages { margin: 20px 0; }
#SC_pager .pages a { display: inline-block; text-align: center; font-size: 16px; line-height: 40px; color: #666666; margin: 0 5px 0 0; height: 40px; min-width: 40px; border-radius: 50%; cursor: pointer; padding: 0 10px;  }
#SC_pager .pages a.pgnext, #SC_pager .pages a.pgempty {  padding: 0 10px; font-weight: 100; font-family: "宋体"; }
#SC_pager .pages .pgcurrent { background: url('../testimg/icon_pager.png') no-repeat center; color: #aa3333; }
#SC_pager .pages a:hover { color: #aa3333; }
#SC_pager .pages a:first-child, #SC_pager .pages a:last-child { }

/****** Detail--bottom--style ******/
.Detail-page { padding-bottom: 30px; border-top: 1px solid #dadada; padding-top: 20px; }
.Detail-page .switch { }
.Detail-page .switch a { display: block; font-size: 14px; color: #424242; line-height: 40px; position: relative; padding-left: 15px; }
.Detail-page .switch a span { color: #000; }
.Detail-page .switch a i { font-size: 20px; line-height: 40px; color: #999; margin-right: 10px; }
.Detail-page .switch a:hover { color: #0053a3; }
.Detail-page .switch a:hover span { color: #0053a3; }
.Detail-page .switch a:hover i { color: #0053a3; }
.Detail-page .right { text-align: right; }
.Detail-page .share { float: right; margin-top: 15px; margin-right: 10px; }
.Detail-page a.return { float: right; font-size: 14px; color: #333; line-height: 36px; margin: 10px 0; border: 1px solid #999; display: inline-block; border-radius: 6px; padding: 0 20px; padding-left: 50px; background: url('../images/Icon-return.png') no-repeat left 20px center; }

.Up-Down-page { position: relative; padding: 15px; width: 100%; margin: 50px 0;  box-sizing: border-box; margin-bottom: 0; }
.Up-Down-page .prev { float: left; width: 46%; }
.Up-Down-page .next { float: right; width: 46%; text-align: right; }
.Up-Down-page a { background: #f1f1f1; font-size: 16px; color: #666; line-height: 50px; padding: 0 20px; display: block; }
.Up-Down-page .Return { width: 80px; height: 30px; position: absolute; left: 50%; top: 50%; margin-left: -40px; margin-top: -30px; }
.Up-Down-page .Return .icon-fanhui{ font-size: 20px; margin-right: 15px;}
.Up-Down-page  .icon-left{ float: left; margin-right: 15px;}
.Up-Down-page .icon-right{ float: right; margin-left: 15px;}
.Up-Down-page .icon-right,.Up-Down-page  .icon-left{ display: block; width: 60px; height: 60px; background: #fff; border-radius: 50%;  font-size: 20px; color: #1a3058;  text-align: center; line-height: 60px; transition: all 0.3s linear;}
.Up-Down-page a:hover{ color: #3772ff;}
.Up-Down-page a:hover i{ background: #3772ff; color: #fff;}
.Up-Down-page .Return:hover .icon-fanhui{ background: none; color: #3772ff; }


/****** Detail-public--style ******/
.Detail-conten { position: relative; padding: 60px 0 100px 0; background: url('../testimg/detail-bg.jpg') no-repeat bottom center #f5f5f5;}
.Detail-Top { background: #fff; }
.Detail-Top .fl { float: left; position: relative; }
.Detail-Top h2 { font-size: 24px; color: #113f8d; line-height: 60px; cursor: pointer; display: none; }
.Detail-main { position: relative; padding-left: 22%; }
.detail-left{ position: absolute; left: 0; top: 0; width: 19%; text-align: center; }
.Detail-nav{  padding: 30px; background: #ffff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); }
.Detail-nav li { float: left; margin:5px;}
.Detail-nav li a { font-size: 16px; color: #152c54; transition: all 0.3s linear; line-height: 28px; display: block; padding: 10px 25px; position: relative; border-radius: 24px; border: 1px solid #d0d5dd; }
.Detail-nav-tit h2{ font-size: 38px; color: #aa3333; line-height: 2; }
.Detail-nav dd { background: url('../testimg/line1.png') no-repeat bottom center;}
.Detail-nav dd a{ display: block; padding: 10px; font-size: 16px; color: #000; line-height: 40px; }
.Detail-nav dd.cur a,.Detail-nav dd:hover a{ color: #aa3333;}


/****** Detail-About--style ******/
#aboutpage #Detailbanner .ban{ height: 490px;}
#About { padding: 0; background: url("../testimg/about-bg.jpg") no-repeat top center #ebecee; background-size: 100% auto;}
#About .section{ padding: 100px 0; }
.about-list .item-box{ overflow: hidden; position: relative; }
.about-list .item-box .pic{  width: 50%; }
.about-list .item-box .intro{ position: absolute; left: 0; top: 0;  width: 50%; padding: 70px; height: 100%; display: flex; flex-direction:column; justify-content:center;  }
.about-list .item-box h3{ font-size: 40px; line-height: 1.5; margin-bottom: 20px; }
.about-list .item-box p{ font-size: 14px; line-height: 2; }
.about-list .about-item1 { background: #aa3333; }
.about-list .about-item1 .pic{ float: right;}
.about-list .about-item1 .intro{ height: 100%; color: #fff; background: url("../testimg/ab_bg1.jpg") no-repeat top right; }
.about-list .about-item1 .intro p{ line-height: 2.5; }
.about-list .about-item2 { background: #ebe8e8; }
.about-list .about-item2 .pic{ float: left;}
.about-list .about-item2 .intro{ left: auto; right: 0; color: #000; background: url("../testimg/ab_bg2.jpg") no-repeat top right;}


.treasure-list{}
.treasure-list li{ margin-bottom: 30px; }
.treasure-list .item{ position: relative; background: #fff; padding: 25px 35px;  padding-left: 24%;  transition: all 0.3s linear;}
.treasure-list .item .pic{ position: absolute; left: 35px; top: 25px; overflow: hidden; }
.treasure-list .item .pic img{ width: 100%; transition: all 0.3s linear; }
.treasure-list .item .intro{}
.treasure-list .item .intro h3{ font-size: 22px; color: #000; line-height: 2; font-weight: 500; margin-bottom: 10px;}
.treasure-list .item .intro p{ font-size: 14px; color: #666; line-height: 26px; height: 52px; overflow: hidden;}
.treasure-list .item .intro .date{ display: block; margin: 10px 0 5px 0; font-size: 14px; color: #aaa; line-height: 30px; }
.treasure-list .item:hover .pic img{ transform: scale(1.1); }
.treasure-list .item:hover{ background-color: #aa3333; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}
.treasure-list .item:hover h3,.treasure-list .item:hover p{ color: #fff;}
.treasure-list .item:hover .date{ color: #fff;  }


.NewsInfo{border-radius: 0;  padding: 50px 70px; background: #fff;  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);  }
.NewsInfo-main .Title { text-align: center;}
.NewsInfo-main .Title h3{ font-size: 30px; color: #000; font-weight: 400; line-height: 1.5; }
.NewsInfo-main .Info span{ font-size: 14px; color: #aaa; line-height: 30px}
.NewsInfo-main .Title { padding-bottom: 20px;  margin-bottom: 30px;}
.Detail-more p{ font-size: 16px; color: #333; line-height: 2; text-indent: 2em; margin-bottom: 10px;} 
.Detail-more img{ border-radius: 30px;}


.person-list li{ float: left; width: 25%; margin-bottom: 6px;}
.person-list .item{ position: relative; height: 408px; margin:0 3px; box-sizing: border-box; overflow: hidden;}
.person-list .item h3{ position: absolute; left: 0; bottom: 0; width: 100%; font-size: 16px; color: #fff; line-height: 40px; padding: 10px; text-align: center; background-image: linear-gradient(to top, rgba(0,0,0,1),rgba(0,0,0,0));  }
.person-list .item .pic{ overflow: hidden; width: 100%; height: 100%;}
.person-list .item .pic img{transition: all 0.3s linear; min-width: 100%; max-width: none; max-height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);} 
.person-list .item:hover .pic img{ transform:translate(-50%, -50%) scale(1.1);}


.friends-list{ }
.friends-list li{ margin-bottom: 30px; }
.friends-list .item{ position: relative; height: 400px; background: #fff;   padding-left: 40%;  transition: all 0.3s linear; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);}
.friends-list .item .pic{ position: absolute; left: 0px; top: 0px; overflow: hidden; height: 100%; width: 40%; }
.friends-list .item .pic img{ width: 100%; height: 100%; transition: all 0.3s linear; }
.friends-list .item .intro{ padding: 50px; height: 400px; display: flex; display: -webkit-flex; justify-content: center;  flex-direction: column; }
.friends-list .item .intro h3{ font-size: 26px; color: #000; line-height: 2; font-weight: 500; margin-bottom: 10px; }
.friends-list .item .intro p{ font-size: 16px; color: #666; line-height: 26px; height: 52px; overflow: hidden; }
.friends-list .item .intro .more-btn{ display: block; margin: 30px 0 5px 0; font-size: 14px; color: #fff; line-height: 34px; width: 146px; padding: 10px; background: #aa3333 url('../testimg/btnbg.png'); text-align: center;  }
.friends-list .even .item{ padding-left: 0; padding-right: 40%;}
.friends-list .even .item .pic{ left: auto; right: 0;}


#contact .Detail-main{ padding-left: 0;}
.contact-box{ background: #fff; margin-bottom: 30px; padding: 60px;}
.contact-list h2{ font-size: 36px; color: #aa3333; line-height: 2; text-align: center; margin-bottom: 60px;}
.contact-list li{ float: left; width: 25%; text-align: center; }
.contact-list .pic{ margin-bottom: 20px;}
.contact-list .item .intro{ padding-bottom: 30px;}
.contact-list .item h3{ font-size: 15px; color: #010101; line-height: 2;}
.contact-list .item p{  font-size: 18px; color: #666; line-height: 1.6;}

.mess-form{ background: #fff; box-shadow: 0 5px 10px rgba(5,1,2,0.2);}
.mess-form .mess-bt{ font-size: 30px; color: #aa3333; line-height: 2;  font-weight: 500;}
.mess-form .mess-fbt{ font-size: 16px; color: #666666; line-height: 2;}
.mess-form form{ margin-top: 20px;}
.form-item { float: left; overflow: hidden; margin-bottom: 16px; width: 100%;}
.form-item:nth-child(1){ width: 49%; float: left;}
.form-item:nth-child(2){ width: 49%; float: right;}
.form-item .form-label{ display: block;  font-size: 16px; color: #202020; line-height: 42px;}
.form-item .form-cont{ font-size: 14px; line-height: 30px; color: #000;}
.form-item .form-cont input{ height: 54px; font-size: 18px; padding: 0 20px; border: 1px solid #e5e5e5; border-radius: 5px; width: 100%;}
.form-item textarea{padding: 0 20px; border: 1px solid #f1f1f1; border-radius: 5px; width: 100%; }
.form-item .submit-btn{  width: 100%; background: #aa3333; height: 70px; font-size: 16px; border: none; color: #fff; line-height: 70px; }
.form-item.form-yzm input{ float: left; width: 256px; margin-right: 20px;}
.form-item.form-yzm .yzm-img{ float: left; display: block; width: 140px; height: 50px;} 


.PersonInfo-Top{ margin-bottom: 50px; overflow: hidden;}
.InfoTop-left{ float: left; width: 620px;}
.InfoTop-right{ float: right; width: 50%;}
.PersonInfo-intro .Info-tit{ font-size: 50px; color: #000000; line-height: 2; margin-bottom: 20px;  }
.PersonInfo-fbt{ border-bottom: 1px solid #aa3333; margin-bottom: 20px; }
.PersonInfo-fbt h3{  margin-bottom: 1px; display: block;  font-size: 18px; color: #fff; line-height: 34px; width: 146px; padding: 10px; background: #aa3333 url('../testimg/btnbg.png'); text-align: center; }
.PersonInfo-intro-text p{ font-size: 16px; color: #000; line-height: 1.8; margin-bottom: 10px; text-indent: 2em; }



/* --产品图集切换-- */
.medium-product-image {	/*height: 740px;*/	margin-bottom: 15px;}
.medium-product-image video{ width: 620px;	/*height: 740px;*/	margin-bottom: 15px;}
.medium-product-image a {display: block;}
.medium-product-image .zoomPad {width: 100%;position: relative;	float: left; z-index: 99; cursor: crosshair;}
.medium-product-image .zoomPad * { box-sizing: content-box;}
.medium-product-image .zoomPreload {	width: 100%;	height: 100%;	border: none;	background-position: center;	-moz-opacity: 0.8;	opacity: 0.8;	filter: alpha(opacity=80);	color: #333;	font-size: 12px;	font-family: Tahoma;	text-decoration: none;	border: 1px solid #CCC;	padding: 8px;	text-align: center;	background-repeat: no-repeat;	background-position: 43px 30px;	z-index: 110;	width: 90px;	height: 43px;	position: absolute;	top: 0px;left: 0px;}
.medium-product-image .zoomPup {	border-color: #dddddd;	overflow: hidden;	-moz-opacity: 0.6;	opacity: 0.6;	filter: alpha(opacity=60);	z-index: 120;	position: absolute;	border: 1px solid #CCC;	z-index: 101;	cursor: crosshair;}
.medium-product-image .zoomWindow {	margin-top: -1px;	position: absolute;	left: 110%;	top: 40px;	z-index: 6000;	height: auto;	z-index: 10000;	z-index: 110;}
.medium-product-image .zoomWrapper {	border-color: #dddddd;}
.medium-product-image .zoomWrapperImage {display: block; position: relative; overflow: hidden; z-index: 110;}
.thumbnails {position: relative; margin-bottom: 15px;}
.thumbnails .thumbnail-swiper {	width: calc(100% - 70px); /* height: 130px;*/ user-select: none;}
.thumbnails .thumbnail-swiper img {	max-height: 100%; width: 100%;	border: 2px solid transparent;	transition: border-color 0.3s;}
.thumbnails .thumbnail-swiper .goodsVideo a { position: relative;}
.thumbnails .thumbnail-swiper .goodsVideo a i { position: absolute; color: rgb(90 90 90 / 40%); font-size: 28px; top: 18px; left: 24px; font-weight: bold;}
.thumbnails .thumbnail-swiper .zoomThumbActive img {border-color: #ff6700;}
.thumbnails .swiper-button-prev, .thumbnails .swiper-button-next {top: 0; height: 100%;	margin-top: 0;	outline: none;	background-color: transparent;	width: 0;}
.thumbnails .swiper-button-prev:after, .thumbnails .swiper-button-next:after {font-size: 30px; font-weight: bold; color: #000;}
.img-responsive {display: block; width: 100%; max-height: 740px; text-align: center;	height: auto; margin: 0 auto;}
/* --产品图集切换-- */









@media (min-width: 1025px) {
   
}


@media (min-width: 1200px) {
  
}

@media (min-width: 768px) {
}

@media (max-width: 1360px) {
  
}

@media (max-width: 1200px) {
 
}

@media (max-width: 1025px) {    
    .location { display: none; }
    .Detail-conten{ padding: 30px 0;}

   
}

@media (max-width: 768px) {
    #aboutpage #Detailbanner .ban{ height: 220px;}
    #Detailbanner .ban { height: 220px; padding-top: 0;}
    .ban-text{ width: 60%; }
    .Detail-main { padding:  0; }

    #SC_pager .pages a{ font-size: 12px; margin: 0;}
    
  
    .detail-left{ position: relative; width: 100%; z-index: 8;}
    .Detail-nav{ padding: 0; position: relative;}
    .Detail-nav-tit h2{ font-size: 18px; text-align: left; padding-left: 15px;line-height: 40px; background: url(../images/IconRe01.png) no-repeat right 15px center;  background-size:12px 12px;}
    .Detail-nav-tit.cur h2{ background-image: url(../images/IconRe02.png) ; }
    .Detail-nav-main{ display: none; position: absolute; left: 0; top: 40px; width: 100%;  background: #fff; }
    .Detail-nav dd{ background: none; border-bottom: 1px solid #ccc;}
    .Detail-nav dd a{ font-size: 14px; line-height: 20px;  padding-left: 50px; text-align: left; background: url('../images/right.png') no-repeat right 15px center; background-size:11px 19px;}

    #About .section{ padding: 30px 0;}
    .about-list .item-box{ margin-bottom: 20px;}
    .about-list .item-box .pic{ width: 100%;}
    .about-list .item-box h3{ font-size: 18px; margin-bottom: 10px;}
    .about-list .item-box .intro{ position: relative; left: 0; width: 100%; padding: 15px ;}
    .about-list .item-box .intro p{ font-size: 12px; line-height: 1.6; }

    .person-list li{ width: 50%;}
    .person-list .item{ height: 235px;}

    .InfoTop-left,.InfoTop-right{ width: 100%;}
    .PersonInfo-intro .Info-tit{ font-size: 18px; margin-bottom: 0;}
    .PersonInfo-intro-text p{ font-size: 13px;}

    .Detail-more p{ font-size: 13px;}
    .Up-Down-page .prev,.Up-Down-page .next{ width: 100%; text-align: left;}
    .Up-Down-page a{ font-size: 14px; line-height: 40px;}

    .treasure-list .item,.friends-list .item{  padding: 0; height: auto;}
    .treasure-list .item .pic,.friends-list .item .pic{width: 100%; height: auto; left: 0; top: 0; position: relative;}
    .treasure-list .item .intro{ padding: 10px ;}
    .treasure-list .item .intro h3{ font-size: 18px; margin-bottom: 0;}
    .treasure-list .item .intro .date{ margin: 0;}

    .treasure-list li{ margin-bottom: 15px;}
    .friends-list .even .item{padding: 0;}
    .friends-list .item .intro{ height: auto; padding: 15px;}
    .friends-list .item .intro h3{ font-size: 16px; margin-bottom: 0;}
    .friends-list .item .intro .more-btn{ display: none; margin: 0; padding: 0; width: 100px; line-height: 40px; background-size:100% ;}
    

    .contact-box{ padding: 15px;}
    .contact-list h2{ font-size: 18px; margin-bottom: 15px;}
    .contact-list li{ width: 50%;}
    .contact-list .item p{ font-size: 14px;}
    .mess-form .mess-bt{ font-size: 18px; margin-bottom: 0;}
    .mess-form .mess-fbt{ font-size: 13px;}
    .form-item .form-label{ font-size: 14px; line-height: 1.8;}
    .form-item .form-cont input{ line-height: 50px; height: 50px; font-size: 14px; padding: 0 10px;}
    .form-item.form-yzm input{ width: 60%;}
    .form-item.form-yzm .yzm-img{ width: 35%; float: right;}
    .form-item .submit-btn{ line-height: 60px; height: 60px;}
  
}

@media (max-width: 640px) {
    
    #Detailbanner .ban,#aboutpage #Detailbanner .ban { height: 200px; }
  
   

}

@media (max-width: 480px) {
    #Detailbanner .ban,#aboutpage #Detailbanner .ban { height: 180px; }
   
}

@media (max-width: 420px) {
    #Detailbanner .ban,#aboutpage #Detailbanner .ban { height: 160px; }
 
}

@media (max-width: 380px) {
    
}

@media (max-width: 320px) {
}


  
