@charset "utf-8";
/* CSS Document */
html , body{ margin:0;padding:0;}
body { font-family:"Arial",\5FAE\8EDF\6B63\9ED1\9AD4,\65B0\7D30\660E\9AD4, Helvetica, sans-serif; font-size:16px ;overflow:hidden}
a , a:hover{ text-decoration:none; color:#000}
.mobile_btn{ display:none}
.dropbtn {
    color:#333; position: relative
}
:hover, :focus{ outline:none}
img{max-width:100%}
*{ box-sizing:border-box}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}


.dropdown {position: relative;display: inline-block;}
.lang i{ color:#800E13}
.lang .dropdown { background:url(../images/arrow_03.png) center right no-repeat;padding-right:15px}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    right: 0;
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 10px;
    text-decoration: none;
    display: block;; font-size:14px
}

.dropdown:hover .dropdown-content {
    display: block;
}
.dropdown:hover .dropdown-content a{ background:#fff}
.dropdown:hover .dropdown-content a:hover, .dropdown:hover .dropdown-content a:focus {
    background-color:#E3E3E3;
}
.wrap{width:1280px;margin:0 auto;}
.show {display:block;}
.clear{ clear:both;}
/*#header*/

#header2{background:rgba(255,255,255,0.8); border-bottom:1px solid #9E9E9E}
.header *{-webkit-transition: position 0.3s ease 0.3s;    
	-moz-transition: position 0.3s ease 0.3s;    
	-ms-transition: position 0.3s ease 0.3s;    
	-o-transition: position 0.3s ease 0.3s;    
	transition:position 0.3s ease 0.3s;}
.header--clone {  position: fixed; width:100%;  z-index: 130;  top: 0;  left: 0;
		-webkit-transform: translateY(-100px);   -ms-transform: translateY(-100px); transform: translateY(-160px);
		 -webkit-transition: all 300ms ease-in-out;  -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;}
.header--stick { -webkit-transform: translateY(0%);   -ms-transform: translateY(0%); transform: translateY(0%);}
.sb-active .header--clone{-webkit-transform: translateY(-100px);      -ms-transform: translateY(-100px);transform: translateY(-100px);}


.hd_zone{ display:inline-table;width:100%}

.hd_zone>div{ display:inline-block;margin-left:-1px; vertical-align: middle}

.hd_zone .logo{width:235px;padding:10px;margin:0 20px}
.hd_zone .logo img{height:41px}
.hd_zone .menu{width:calc(100% - 430px) ; text-align: right}
.hd_zone .menu ul{ display:inline-table;margin:0 0 0 auto}
.hd_zone .menu ul li{ display:inline; text-align: center}
.hd_zone .menu ul li a{padding:2px 25px; font-size: 20px;margin:0 5px; border-radius:50px; background:rgba(255,255,255,0); transition:all 0.5s ease-in-out}
.hd_zone .menu ul li ul , .menu ul li ul{ display:none}
.hd_zone .menu ul li a:hover , .hd_zone .menu ul li.active a{ color:#fff; background:#9A031E}
.hd_zone .lang{width:130px;margin:0 0 0 15px}
.hd_zone .lang a{ font-size:18px}
.hd_zone .lang .dropdown-content a{ font-size:14px}

.wrap{width:1280px;margin:0 auto}
.index_content{padding: 55px 0}
.content{padding:20px 0}
.pro_box{width:calc(33.3% - 30px);margin:0 15px 30px; z-index: 1; float:left; overflow: hidden; position:relative;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ededed+1,d1d1d1+93 */
background: #ededed; /* Old browsers */
background: -moz-linear-gradient(top, #ededed 1%, #d1d1d1 93%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ededed 1%,#d1d1d1 93%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ededed 1%,#d1d1d1 93%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#d1d1d1',GradientType=0 ); /* IE6-9 */border-radius:3px; border:1px solid #CFCFCF ;padding:20px 20px 110px}
.pro_box>a{ position:absolute;width:100%; height:100%; background: rgba(0,0,0,0.00);left:0; top:0; z-index:80; display: block}
.pro_box .pic{ text-align:center; position: relative; z-index: 1}
.pro_name{ background:#fff;padding:15px 10px; position:absolute; bottom:35px; left:0;width:80%; transition:all 0.5s ease-in-out; z-index: 2}
.pro_box:hover .pro_name{ background:#9A031E; color:#fff}
.pro_box:hover .pro_name a{color:#fff}
.index_news{padding:50px 0; text-align:center; font-size:20px; color:#4A4A4A}
.index_news h2{ font-size:48px;margin-bottom:50px; color:#4A4A4A}
.index_news h3{ color:#0F4C5C; font-size:36px;margin-bottom:25px}
.index_news h3 span{color:#AD2831}
.show_name{ font-size:24px}
.index_news>.wrap>div{margin-bottom:10px}
.index_news>.wrap>div.show_name{margin-bottom:18px}
.footer{ background:#810E13; color:#fff; text-align:center; font-size:14px}
.footer a{color:#fff}
.footer a:hover{ color:rgba(255,255,255,0.8)}
.ft_wrap{padding:0 15px}
.ftbar ul{ display:inline-table;margin:10px auto ;-webkit-animation-duration: 300;animation-duration: 300 }
.ftbar ul li{ display:inline-block; padding:5px 20px ; position:relative; font-size:20px}
.ftbar ul li:after{ content:""; position:absolute; right:0; top:3px; width:1px ; height:20px; background:rgba(255,255,255,0.3)}
.ftbar ul li:last-child:after{ content:""; background:none}
.ft_logo{margin:20px 0 ; -webkit-animation-delay: 0.1s ; animation-delay: 0.1s ;-webkit-animation-duration: 300;animation-duration: 300}
.ft_logo img{width:250px}
.co_info{ line-height:160%}
.ft_line{  padding:5px ;line-height:160%; border-top:1px solid #B7B7B7 ;margin-top:10px}
.ft_line p{-webkit-animation-delay: 0.1s ; animation-delay: 0.1s ;-webkit-animation-duration: 800;animation-duration: 800}
.insidebanner{ background:url(../images/banner/inside_banner.jpg) center top no-repeat ;height:250px}
.insidebanner h2 , .insidebanner h1{ font-size:48px; color:#AF1924;margin-bottom:10px; text-transform: uppercase}
.insidebanner p{color:#5F5F5F; font-size:18px}
.insidebanner  .wrap{padding:80px 0 0 60px}
.left_nav{width:300px; float:left}
.tree{margin-bottom:50px}
.tree ul{ display:inline-table}
.tree ul li{ display:inline-block; }
.tree ul li a{color:#878787}
.tree ul li a:hover{color:#000}
.tree ul li:after{ content:">";margin:0 5px}
.tree ul li:last-child:after{ content:""}
.right_content{width:calc(100% - 360px); margin-left:60px; float:left}
.left_nav h2{color:#790C19; font-weight:bold; font-size:20px;margin:0 0 10px}
.left_nav ul>li{ background:#5F5F5F;margin-bottom:2px}
.left_nav ul>li>a{padding:20px 15px;color:#fff; display:block; position:relative; font-size:15px}
.left_nav ul>li:hover , .left_nav ul>li.active{ background:#AF1924}
.left_nav ul>li:hover>a{color:#fff}
.left_nav ul>li>a:after{ content:"\f0d7"; font-family:FontAwesome; position:absolute; right:10px}
.left_nav ul>li>ul{ display:none}
.left_nav ul>li.active>ul{ display:block}
.left_nav ul>li.active>ul>li{ border:1px solid #E8E8E8;margin-bottom:0; border-collapse:collapse; border-bottom:0; background:#fff}
.left_nav ul>li:last-child.active>ul>li:last-child{border:1px solid #E8E8E8}
.left_nav ul>li.active>ul>li>a{padding:10px ; font-size:16px;color:#444; font-weight:bold}
.left_nav ul>li.active>ul>li>a:after{ content:""}
.left_nav ul>li.active>ul>li.active>a , .left_nav ul>li.active>ul>li:hover>a{color:#AF1924}
.pro_banner{ background-image:url(../images/banner/pro_banner.jpg)}
.pro_banner p{color:#fff}
.slider-for>div{margin:0 0 20px }
.left_pro_pic , .right_pro_info{width:50%; float:left}
.left_pro_pic{width:calc(50% - 20px)}
.pro_slider>div , .slider-nav img{ border:1px solid #E7E7E7}
.pro_slider{margin:0 10px 15px}
.slider-nav .nav_pic{padding:0 10px}
.slider-nav .nav_pic.slick-current.slick-active img{ border:1px solid rgba(148,2,4,1.00)}


.right_pro_info{padding:0 15px}
.right_content h1{ font-size:24px; color:#AF1924;margin:50px 0 5px 0}
.right_content h2{ color:#1E1E1E; font-size:20px;margin-bottom:20px}
.desc{line-height:150%}
.mobile_tit{ display:none}
.tab_contact{margin-top:30px;margin-left:10px}

#tabs .ui-tabs-nav {width:100%; border-bottom:5px solid #1e1e1e}
#tabs .ui-tabs-nav li{ display:inline-block;margin-right:10px}
#tabs .ui-tabs-nav li>a{padding:15px 30px; border-radius:5px 5px 0 0 ; background:#fff; border:1px solid #E4E4E4
; display:block; border-bottom:0}
#tabs .ui-tabs-nav li.ui-state-active>a , #tabs .ui-tabs-nav li:hover>a{ background:#1e1e1e;color:#fff;border:1px solid #1e1e1e}
.tabs_box{padding:35px}
.tabs_box table{width:100%}
.tabs_box table th{ background:#7C7C7C; color:#fff;padding:10px 20px; text-align:left}
.tabs_box table tr td{ background:#fff;padding:10px 20px; vertical-align:middle}
.tabs_box table tr:nth-child(even) td{ background:#E0E0E0}
.d_pic{margin-top:30px}
.tabs_box p{margin-bottom:20px}

.tabs_box table.tab2 th{ background:#7C7C7C; color:#fff;padding:5px 15px; text-align:center}
.tabs_box table.tab2 th:first-child{ text-align:left}
.tabs_box table.tab2 tr { border-bottom:1px solid #999}
.tabs_box table.tab2 tr td{ background:#fff;padding:5px 15px; text-align:center; vertical-align:middle}
.tabs_box table.tab2 tr td:first-child{ text-align:left}

#gotop{ width:50px; height:50px; display:block; border-radius:50px; text-align:center; line-height:50px; color:#810E13; border:1px solid #EAEAEA; position:fixed; right:15px; bottom:150px; z-index:50; background:url(../images/top.png) center no-repeat #fff; cursor:pointer}

.scrollbar
{
	width: 100%;
	overflow-x: auto;
	overflow-y:hidden;
	margin-bottom: 20px
}


.style-1::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.style-1::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

.style-1::-webkit-scrollbar-thumb
{
	background-color:#B81418;	
	background-image: -webkit-linear-gradient(45deg,
	                                          rgba(255, 255, 255, .2) 25%,
											  transparent 25%,
											  transparent 50%,
											  rgba(255, 255, 255, .2) 50%,
											  rgba(255, 255, 255, .2) 75%,
											  transparent 75%,
											  transparent)
}

.video-container {

position: relative;

padding-bottom: 56.25%;

padding-top: 30px;

height: 0;

overflow: hidden;

}

.video-container iframe, .video-container object, .video-container embed {

position: absolute;

top: 0;left: 0;

width: 100%;

height: 100%;}
@media (max-width: 1280px) {
.wrap{width:100%;padding:0 15px}
.hd_zone .menu ul li a{padding:2px 12px}
.hd_zone .menu ul li a{ font-size:17px}
.hd_zone .logo{margin:0 }
.hd_zone .menu {  width: calc(100% - 380px)}
.hd_zone .lang{margin:0 }
.pro_name{width:85%}


}
@media (max-width: 980px) {
.hd_zone .menu{ display:none}
.mobile_btn{ display:block; position:absolute; right:15px; top:20px}
.sb-open-right{ float:right;margin:0 5px; border:1px solid #a0a0a0;padding:2px 5px; color:#666}	
.sb-btn1{ border:1px solid #800E13; color:#800E13; font-size:16px}
.sb-open-right i{margin-right:3px}
.hd_zone .lang{ display:none}
.sb-right .menu>ul>li>a{padding:10px 15px; border-bottom:1px solid #FFD7DD; display:block}
.sb-right ul>li>a.arrow:after{ content:" \f107 "; font-family:FontAwesome}
.lang{ display:none}
.lan a{padding:15px; display:inline-block}

.ftbar ul li{font-size:16px;padding:5px 15px}
.index_news h2{ font-size:40px;margin-bottom:30px}	
.index_news h3{ font-size:25px;margin-bottom:15px}
.index_news{ font-size:20px}
.left_nav{ display:none}
.right_content{margin:0;padding:0;width:100%; float:none}
.tree{padding:0; font-size:14px}
}

@media (max-width: 880px) {
	.responsive{width:90%;margin:0 auto}
	.responsive .slick-prev, .responsive .slick-next{width:40px; height:40px; background:none; border:0; z-index:10}
	.slick-prev:before, .slick-next:before{ font-size:50px; color:#D60E13;  opacity:1; line-height:50px}
	.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before{ color:#1e1e1e}
	.slick-prev{ left:-25px}
	.slick-next{ right:-25px}
	.pro_box{width:calc(50% - 30px)}
	.right_pro_info{width:45%}
	.left_pro_pic { width: calc(55% - 20px);}
}
@media (max-width: 680px) {
.pro_name{width:95%}
.insidebanner{height:200px}
.insidebanner .wrap{padding:60px 0 0 30px}
.insidebanner h2 , .insidebanner h1{ font-size:43px}
.insidebanner p{ font-size:18px}
.pro_box{width:calc(50% - 20px);margin:0 10px 30px }
.right_pro_info , .left_pro_pic {width:100%; float:none;margin-bottom:15px}
.slick-slide img{margin:0 auto}
.mobile_tit{ display:block;margin:0 10px}
.right_pro_info h1, .right_pro_info h2{ display:none}
.right_content h1{margin-top:30px}
.tab_contact{margin:30px 10px}
.tabs_box{padding:25px 15px}
}

@media (max-width: 580px) {

.index_news h2{ font-size:35px;margin-bottom:20px}	
.index_news h3{ font-size:28px}
.slick-dots{ bottom:10px}
.index_news{ font-size:18px}
.hd_zone .logo{width:200px;padding:10px 0}
.ft_logo img{width:200px}
.show_name{ font-size:22px}
.ftbar ul li{ font-size:14px}
.index_news{padding:40px 0}
.index_content{padding:40px 0}
#tabs .ui-tabs-nav li>a{padding:10px 15px}
#tabs .ui-tabs-nav li{margin-right:5px}
.tabs_box{padding:25px 15px }
	.ft_line p{font-size: 13px}
	.lan a{ display:block; background:rgba(120,1,3,0.88);padding:10px 15px}
}

@media (max-width: 500px) {
 .pro_box{padding:20px 5px 80px}
 .pro_name{padding:10px; bottom:20px}
 insidebanner{ background-position:left top}
 .insidebanner h2 ,  .insidebanner h1{ font-size:38px}
.insidebanner p{ font-size:16px}
.ftbar{ display:none}
.ft_logo{padding-top:20px;margin:0 auto 20px }
}
@media (max-width: 450px) {
.pro_box{width:90%;margin:0 auto 20px; float:none}
#tabs .ui-tabs-nav li{ display:block;margin:0}
#tabs .ui-tabs-nav li>a{ border-radius:0}
.tabs_box{padding:25px 5px }
.right_content h1{ font-size:22px}
.right_content h2{ font-size:18px}

.tabs_box table th , .tabs_box table tr td{ white-space:nowrap}



}
@media (max-width: 380px) {

.hd_zone .logo{width:150px;padding:10px 0}
.mobile_btn{top:10px;right:10px; text-align:center}
.sb-open-right i{margin:0}
.mobile_btn .sb-open-right{ font-size:20px}
.mobile_btn .sb-open-right span{ display:none}
.index_news h2{ font-size:30px}	
.index_news h3{ font-size:22px}
.show_name{ font-size:20px}
.index_news{ font-size:16px}
.index_news{padding:30px 0}
 .insidebanner h2 ,  .insidebanner h1{ font-size:30px}
.insidebanner p{ font-size:15px}
.insidebanner{ height:150px}
.insidebanner .wrap{padding:50px 15px}
#gotop{ width:40px; height:40px;  line-height:40px;  bottom:150px; z-index:50; background:url(../images/top.png) center no-repeat #fff}
}

@media (max-width: 350px) {
.pro_box{width:100%;margin:0 0 20px}
.tree{padding:0}
}

/*news*/

.righttitle{ font-size:24px; color:#af1924; position: relative;margin-bottom:20px}
.righttitle span{ background:#fff; display:inline-block;padding:8px 15px 0 0; z-index: 5 ; position: relative}
.righttitle:before{ content: ""; width:100%; height:5px; background: #af1924 ; display: block; position: absolute; top:15px; z-index: 1}
.news_zone{width:100%; display: inline-table;margin-bottom:30px; cursor: pointer}
.news_zone>div{ display: table-cell;vertical-align: middle}
.news_zone>div:first-child{width:210px; text-align: center; border:1px solid rgba(235,235,235,1.00); height:180px; vertical-align: middle;}

.news_zone>div:last-child{width:calc(100% - 214px);padding-left:20px}
.news_zone h2{ font-size:24px;margin:10px 0 15px}
.news_zone li{ padding:5px 0; }
.news_zone li a{color:#1f3da0}

.news_zone:hover>div:first-child{ border:1px solid #a02828}
.news_zone:hover a{color:rgba(193,0,3,1.00)}
.news_zone:hover h2{color:#af1924}

@media (max-width: 580px) {
.news_zone>div:first-child{width:170px; text-align: center; border:1px solid rgba(235,235,235,1.00); height:150px; vertical-align: middle;}
.news_zone>div:last-child{width:calc(100% - 174px);padding-left:15px}	
.news_zone h2{ font-size:20px;margin:10px 0 10px}
}

@media (max-width: 480px) {
.news_zone>div{ display: block}
.news_zone>div:first-child{width:100%; margin-bottom:20px;height:auto;padding:10px 0}
.news_zone>div:last-child{width:100%;padding:0; }	


}

/**
 * Simple fade transition,
 */
.mfp-fade.mfp-bg {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-moz-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready {
	opacity: 0.8;
}
.mfp-fade.mfp-bg.mfp-removing {
	opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-moz-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {opacity: 0;}
.video_block{width:380px ; float:left;margin:0 0px 30px 0 ; position: relative}
.video_block:nth-child(2n+1) { clear: left;}
.video_block:nth-child(odd){margin-right:80px}
.video_block .pic{margin-bottom:10px; position: relative}
.video_block .pic:before{ content:"\f16a"; font-family: FontAwesome; position: absolute; left:calc(50% - 30px); top:calc(50% - 20px); color:rgba(255,255,255,0.60) ;  font-size:50px}
.video_block:hover .pic:before{ color:rgba(253,0,4,1.00)}
.video_block a{width:100%; height:100%; background:rgba(255,255,255,0.00); position: absolute; left:0; top:0; z-index: 10}
.video_block:hover p{ color:rgba(211,0,3,1.00)}

.ab_pic>div{width:33.3%;padding:0 15px; float:left;}
.ab_pic{margin:0 -15px 50px}

.about_zone h2{ font-size:18px; color:#af1924;margin:20px 0 5px 0}
.about_block{padding:0 15px;margin-bottom:20px; line-height: 150%}
.about_block p{margin-bottom:20px}
.about_block ul li{ position:relative;padding:5px 0 5px 10px}
.about_block ul li:before{ content:"-"; position: absolute; left:0; top:3px}
.ab_cont{margin-bottom:50px}

@media (max-width: 1280px) {
	.video_block:nth-child(odd){margin-right:30px}
	.video_block{width:280px ;}	
}
@media (max-width: 980px) {
.video_block{width:50% ;padding:0 20px}
.video_block:nth-child(odd){margin-right:0}
}

@media (max-width: 680px) {
.ab_pic{margin:0 -10px 30px}
.ab_pic>div{padding:0 10px; }
}

@media (max-width: 580px) {
.video_block{padding:0 15px}

}

@media (max-width: 480px) {
.video_block{width:100% ;padding:0 ; float:none; text-align: center}
.about_block{padding:0}
}

@media (max-width: 380px) {
.video_block{width:100% ;padding:0 ; float:none; text-align: center}
.ab_pic{margin:0 0px 30px}
.ab_pic>div{width:100%;padding:0; float:none;margin-bottom:20px}
}

.contact_bk{margin-bottom:20px}
.contact_bk label{width:120px; float:left;padding:0 5px 0 15px; padding-top:3px}
.contact_bk .fill_zone{width:calc(100% - 120px); float:left}
.contact_bk input{width:100%; height:25px; border: 0; border-bottom:1px solid rgba(171,171,171,1.00); }
.contact_bk input:focus{ border-bottom:1px solid rgba(163,0,2,1.00)}

.contact_bk textarea{width:100%; min-height:50px;border: 0; border-bottom:1px solid rgba(171,171,171,1.00); }


.contact_bk.hf_50{width:50%; float:left}
.contact_bk .fill_zone div{width:200px; float:left;margin-right:15px}
.contact_bk .fill_zone div:last-child{width:calc(100% - 230px); line-height: 30px; display: inline-block; font-size:14px}
.btn_zone{ display:inline-table; text-align:center}
.cen{text-align:center}

.btn_zone .btn{padding:8px 20px;margin:10px 5px 50px; border:0; border-radius: 3px ; color:#fff; cursor: pointer}
.btn_zone .btn.btn_gary{ background:rgba(142,142,142,1.00)}
.btn_zone .btn.btn_gary:hover{ background:rgba(69,69,69,1.00)}
.btn_zone .btn.btn_red{ background:rgba(148,9,11,1.00)}
.btn_zone .btn.btn_red:hover{ background:rgba(192,0,3,1.00)}
.contact_info{padding:0 15px;margin-bottom:50px;  line-height:160%; color:rgba(147,147,147,1.00)}
.contact_info h2{margin:0 0 5px 0; color:rgba(110,16,18,1.00)}

@media (max-width: 680px) {
	.contact_bk .fill_zone div{width:100%; float:none;margin-right:0}
.contact_bk .fill_zone div:last-child{width:100% ;margin-top:10px}
}


@media (max-width: 580px) {
	.contact_bk.hf_50{width:100%}
	.contact_info{margin-bottom:20px;padding:0}
}

@media (max-width: 480px) {
	
	.contact_info h2{ font-size:18px;margin-bottom:3px}
	.contact_info p{ line-height:120%}
	.contact_bk .fill_zone div{margin-right:5px}
	.contact_bk label , .contact_bk .fill_zone{width:100%; float:none}
	.contact_bk label{padding:0 0 10px 0}
	
}

.isd_butnext{ clear: both}