@charset "utf-8";
/*css comment*/
body,html {
color:#666;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background: #fff;
font-family: Microsoft YaHei, "微软雅黑";
font-size: 14px;
line-height:1.72;
text-align:justify;
overflow-x:hidden;
}
body{
width: 100%;
overflow-x: hidden; font-family:微软雅黑;
}
img {
border:none;
display:inline-block;
max-width: 100%;
height: auto;
-ms-interpolation-mode: bicubic;
_width:auto;
}
button, input, textarea ,select{
border:none;
background:none;
font-size:14px;
vertical-align:middle;
color:#333;
font-family: Microsoft YaHei, "微软雅黑";
}
select {
border:inherit;
background: inherit;
}
a {
text-decoration:none;
blr:expression(this.onFocus=this.blur());
outline: none;
color:#333;
}
a:hover,a:active,a:focus {
text-decoration:none;
}
em, i {
font-style:normal;
}
a:focus, input, select {
outline:none;
}
.clearfix {
*zoom:1;
}
.clearfix:after {
content:"\200B";
display: block;
clear: both;
height: 0;
}
input[type="submit"], input[type="reset"], input[type="button"], button, select {
-webkit-appearance: none;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover{
opacity: 0.90;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,label{ font-weight: normal; padding: 0; margin: 0; font-size: 14px; line-height: 1.3; font-family: Microsoft YaHei, "微软雅黑";}
p,ul, ol{ margin: 0;}
header,main,footer,section{ display:block;}
/*browserupgrade*/
.browserupgrade{display:block;position:fixed; top:0; left:0; margin:0;width:100%;height:60px;font-size:15px;line-height:60px;z-index:5000;background-color:#666;color:#fff;text-align:center}
.browserupgrade a{color:#eee;text-decoration:underline;font-size:18px;}
.browserupgrade a:hover{color:#eee}
/*owl-theme*/
.owl-carousel .owl-nav a{ display:inline-block; vertical-align: middle;}
.owl-carousel .owl-nav a span{ display:block; width:100%; height: 100%; text-align: center;}
.owl-carousel .owl-dots{ width:100%; text-align: center; margin-top:20px;}
.owl-carousel .owl-dots .owl-dot{ display:inline-block; vertical-align: middle; margin: 0 5px; width:8px; height: 8px; border:1px solid #d2d2d2; background:#d2d2d2; border-radius:50%; }
.owl-carousel .owl-dots .owl-dot.active{ background: #096bb5; border-color:#096bb5;}
.inner{ width:1400px; margin: 0 auto;}
/*===================header========================*/
header{ position:absolute; top:0; left:0; z-index:1003; width:100%;}
header, .menu_top{ padding:30px 0;}
.logo{ float:left; position:relative; z-index: 1004;}
.logo a img{ display:block; height:90px; width:auto;}
.header_r{ float:right; margin-top:10px;}
.ico_lang, .ico_search, .ico_box{ display:block; float:left; padding:0 10px;}
.ico_lang, .ico_search, .ico_menu i{ opacity:.8;}
.ico_lang:hover , .ico_search:hover, .ico_menu:hover i{ opacity:.70;}
/*ico_menu*/
.ico_box{ padding: 0 0 0 20px; border-left:1px solid rgba(255,255,255,.9); margin-left:10px;}
.ico_menu{ display:block; cursor: pointer; width:26px; height:26px; position:relative;}
.ico_menu i{ display: block; width:26px; height: 2px; background:#fff; position: absolute; top:0; left:0;}
.ico_menu i:nth-of-type(2){ width:18px; top:10px;}
.ico_menu i:nth-of-type(3){ top:20px;}
.ico_menu:hover i:nth-child(n){ width:26px;}
.menu_active i{ background:#000;}
.menu_active i:nth-of-type(2){ opacity: 0;}
.menu_active i:nth-of-type(1),.menu_active i:nth-of-type(3){ top:20px;}
.menu_active i:nth-of-type(1){ transform:rotate(-45deg);}
.menu_active i:nth-of-type(3){ transform:rotate(45deg);}
/*menu_warp*/
.menu_warp{ position:fixed; top:0; right:-100%; opacity: 0; z-index:1002; width:100%; height:100%;}
.menu_warp:before{ content:""; position: absolute; top:0; right:-100%; z-index: 1; width:100%; height:100%; max-width: 850px; background: url(../images/header_01.png) left top no-repeat; background-size:cover;}
.menu_warp:after{ content:""; position: absolute; top:0; right:-100%; z-index: 0; width:100%; height:100%; max-width: 570px; background: url(../images/header_02.png) left top no-repeat; background-size:cover;}
.menu_block{ float:right; text-align: right; position: relative; z-index:2;}
.menu_top{ }
#ico_menu02{ width:40px; height:40px;}
#ico_menu02 i{ width:40px;}
.menu_list a.a_item0{ display:block; font-size:28px; opacity: .70; margin-bottom: 20px; font-family:微软雅黑;}
.menu_list a.a_item0:hover, .menu_list a.a_item0.on, .menu_list a.a_item0.menu_cur{ opacity:1;}
.subclass{ padding-bottom: 30px; display:none;}
.subclass a{ display:block; line-height:1.9; color: #747474; font-size: 20px;}
.subclass a span{ display:inline-block; padding-left: 30px; position:relative;}
.subclass a span:before{ content:""; position:absolute; top:0; left:0; width:16px; height: 100%; overflow: hidden; background: url(../images/dec_01.png) -16px center no-repeat;}
.subclass a:hover, .subclass a.subclass_cur{ color:#096bb5;}
.subclass a:hover span:before,
.subclass a.subclass_cur span:before{ background-position:left center;}
.menu_show{ }
.menu_show:before{ right:0; animation: 1s .2s fadeInRight both;}
.menu_show:after{ right:8.5%; animation: 1s .8s fadeInRight both;}
.menu_show .menu_block{ animation: 1s .6s fadeInUp both;}
.digg4{ padding:3px; margin-top:12px; text-align:center; font-family: 微软雅黑, Arial, Helvetica, sans-serif; font-size: 14px; }
.digg4 span{ border:1px #ccc solid; padding:2px 5px; margin:5px; color:#999}
.digg4 span:hover{ color:#f60;border:1px #f60 solid; padding:2px 5px; cursor:pointer; }
.digg4 a,.digg4 span.miy{ margin:2px; padding:2px 5px; text-decoration:none; border:1px #CCCCCC solid; }
.digg4 .disabledfy{ font-family: Tahoma, Verdana;}
/*==============tan_warp*/
.tan_warp{ position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 4000; display:none;}
.tan_warp .table{ position:absolute; top:0; left:0; height: 100%;}
.tan_bg{ background: rgba(0,0,0,.80); position: absolute; top:0; left:0; z-index: 1; width: 100%; height: 100%;}
.tan_closed{ display: block; position:absolute; top:0; right:0; z-index: 10; width:120px; line-height:120px; text-align: center; background:rgba(0,0,0,.10) url(../images/dec_05.png) center center no-repeat; background-size:40px; font-size:0;}
.tan_closed:hover{ background-color:#096bb5;}
.tan_box{ position: relative; z-index: 2;}
/*search_warp*/
#search_warp{ text-align: center; }
#search_warp .tan_bg{ background: url(../images/header_03.jpg) center center no-repeat; opacity: .90;}
.search_box{ max-width: 910px; margin: 0 auto; border-bottom:1px solid rgba(0,0,0,.30);}
.search_btn{ cursor: pointer; width:70px; height:70px; float: right; font-size: 0; background: url(../images/header_ico02.png) center center no-repeat; opacity: .90; }
.search_fill{ overflow:hidden;}
.search_txt{ width:100%; font-size:24px; height: 70px; padding: 20px 0 20px 0;}
/*===================footer========================*/
footer{ position: relative; z-index: 2; background: #4d4d4d; /*border-bottom: 18px solid #ddd;*/ padding-top:50px; padding-bottom:40px;}
img.footer_dec01{ display:block; position:absolute; bottom:0; left:57%; width:20%; max-width:352px;}
.footer_l{ float:left;}
.footer_logo{ display:block; max-width:350px; max-height:70px;}
.footer_nav{ margin:35px -30px 10px;}
.footer_nav a{ display:inline-block; position:relative; padding: 0 30px;color: #fff;}
.footer_nav a:before{ content:""; position:absolute; top:50%; right:-2px; margin-top:-2px; width:5px; height: 5px; border-radius:50%; background: rgba(255,255,255,.20);}
.footer_nav a:last-child:before{ display:none;}
.footer_nav a:hover{ color:#096bb5;}
.copyright{ opacity:.50;color: #fff;}
.copyright a{color: #fff;}
.copyright a:hover{ color:#096bb5;}
.footer_r{ float:right; padding-top: 24px;}
.back_top, .notice{ display:inline-block; vertical-align: bottom; margin-left: 20px;}
.back_top i{ display:block; margin:0 auto 10px; position:relative; width:40px; height:40px;}
.back_top i:before{ content:""; position: absolute; top:0; left:0; width:100%; height: 100%; border-radius:50%; border:1px solid #ddd;}
.back_top i:after{ content:""; position: absolute; top:50%; left:50%; width:20px; height: 20px; margin:-10px 0 0 -10px; background: url(../images/dec_03.png) center top no-repeat;}
.back_top{color: #fff;}
.back_top:hover{ color:#096bb5;}
.back_top:hover i:before{ background: #096bb5; border-color:#096bb5;}
.back_top:hover i:after{ background-position:center bottom;}
.notice{}
.notice img{ display:block; }
#x_weizhi_all{
width:100%;
margin:0px auto;
overflow:hidden;
font-size:14px;color:#666;padding:0px 0px;
background-color:#f0f0f0;
border-bottom:0px solid #ddd;
z-index:50;
position:absolute;
}
#x_weizhi{
overflow:hidden;
font-size:14px;color:#666;
border-bottom:0px solid #ddd;
width:96%;
max-width:1400px;
height:44px;
line-height:44px;
margin:0px auto;
}
.x_newsinfo{
width:100%;
}
.x_newsinfo h2{
font-size:24px;
color:#f06121;
text-align:center;
}
.x_newsinfo h6{
font-size:14px;
color:#666;
border-bottom:1px solid #ddd;
margin:8px 0px 26px 0px;
padding:6px 0px 16px 0px;
overflow:hidden;text-align:center;
}
.x_nei_content{
overflow:hidden;
font-size:16px;
margin-top:20px;
}
.x_nei_content p{
overflow:hidden;
margin-bottom:16px;text-align:left;color:#444;line-height:22px;
}
.x_contactlist{
overflow:hidden;
width:100%;
}
.x_contactlist ul{
overflow:hidden;
width:100%;
}
.x_contactlist ul li{
overflow:hidden;
width:29%;
margin:0 2%;
float:left;
padding:2% 0;
border:1px solid #ddd;
box-shadow:0px 0px 8px #ccc;
text-align:center;
}
.x_contactlist ul li h3{
font-size:18px;
}
.x_contactlist ul li img{
margin:2% 0;
}
.x_contactlist ul li p{
font-size:14px;
}
a.button_3:link,a.button_3:visited{
display:block;
margin:40px auto 0px auto;
width:140px;
height:35px;
line-height:35px;
background-color:#f06121;
border-radius:0px;
font-weight:normal;
cursor:pointer;
text-align:center;
letter-spacing:0px;border-radius:30px;
font-size:14px; text-indent:0px;
color:#fff;border:1px solid #f06121;
}
a.button_3:hover{
color:#f06121;border:1px solid #f06121;
text-decoration: none;
font-size:14px;
background-color:#fff;
text-align:center;
}
.digg4{ padding:3px; margin-top:42px; text-align:center; font-family: 微软雅黑, Arial, Helvetica, sans-serif; font-size: 16px; }
.digg4 span{ border:1px #ccc solid; padding:3px 8px; margin:5px; color:#999}
.digg4 span:hover{ color:#f06121;border:1px #ccc solid; padding:3px 8px; cursor:pointer;}
.digg4 a,.digg4 span.miy{ margin:2px; padding:3px 8px; text-decoration:none; border:1px #CCCCCC solid; }
/*===================main========================*/
main{ padding: 4% 0; position: relative; z-index: 2; background:#fff;}
main.main_index{ padding:0; z-index: auto;}
/*bgImg*/
.bgImg{ width:100%; height: 100%; background-position:center center; background-repeat:no-repeat; background-size:cover; transition:all .5s ease-in-out;}
.bgImg img{display:none;}
/*table*/
.table{ display:table; width:100%; height: 100%; text-align:center;}
.cell{ display:table-cell; vertical-align:middle;}
/*==============
focus_warp*/
.focus_warp{ width:100%; height: 100vh; overflow: hidden;}
.slide{ position: relative; z-index: 1;}
.slide,.slide .owl-stage-outer,.slide .owl-stage,.slide .owl-item,.slide li, .slide_item img.focus_img{ width: 100%; height: 100%; overflow: hidden;}
.ico_video{ display:block; cursor:pointer; position:absolute; top:50%; left:50%; width:11.198%; margin:-0.6% 0 0 -5.7%;}
.ico_video img{ display:block;}
.slide li.slide_item .bgImg{ position:absolute; top:0; left:0; width:100%; height: 100%;}
.slide .owl-nav a{ width:40px; height:80px; position:absolute; top:50%; left:5.20%; margin-top: -40px; background:url(../images/arrow_01.png) left top no-repeat;}
.slide .owl-nav a span{ font-size:0;}
.slide .owl-nav a.owl-prev:hover,
.slide .owl-nav a.owl-prev.disabled{ background-position:right top;}
.slide .owl-nav a.owl-next{ left:auto; right:5.20%; background-position:right bottom;}
.slide .owl-nav a.owl-next:hover,
.slide .owl-nav a.owl-next.disabled{ background-position:left bottom;}
.slide .owl-dots{ position:absolute; left:0; bottom: 6%; margin: 0;}
.slide .owl-dots .owl-dot{ width:16px; height:16px; border:none; background:url(../images/focus_dot_a.png) center center no-repeat;}
.slide .owl-dots .owl-dot.active{ background:url(../images/focus_dot_b.png) center center no-repeat;}
/*slide_text*/
.slide_text{ position:absolute; top:35%; left:0; z-index: 1; width:100%; text-transform:uppercase; text-align:center;}
.slide_text h3{ margin-bottom:20px; color: #fff; line-height: 1; font-size:64px;}
.slide_text h3 img{ display:inline-block; vertical-align:middle; margin: 0 12px; display:none;}
.slide_text p{ margin-bottom:35px; color:rgba(255,255,255,.8); line-height: 1; letter-spacing:0.06em; font-size: 24px;}
.slide_text .text_dec{ display:block; margin: 0 auto; width:0; height:1px; background:#c6c6c6; opacity:0; transition: all 1s .5s ease-in-out; }
/*focus01_pro*/
.focus01_pro01{ display:block; position: absolute; top:50%; left:-5.5%; margin-top: -4%; width: 48%; max-width: 670px;}
.focus01_pro02{ display:block; position: absolute; top: 50%; right: -12%; margin-top: -15%; width: 51%; max-width: 720px;}
.focus01_inner{ height:100%; position:relative;}
.slide .owl-item.active .slide_text h3{
animation: 1s .2s fadeInUp both;
}
.slide .owl-item.active .slide_text p{
animation: 1s .5s fadeInUp both;
}
.slide .owl-item.active .slide_text .text_dec{ width:40px; opacity:1;}
.slide .owl-item.active .ico_video{
animation: 2s .8s zoomIn both;
}
.slide .owl-item.active .bgImg{
animation: 1s .2s fadeIn both;
}
.slide .owl-item.active .focus01_pro01{
animation: 1s .3s fadeInLeft both;
}
.slide .owl-item.active .focus01_pro02{
animation: 1s .5s fadeInRight both;
}
.video_focus{ background:#000; height: 600px; }
/*===================index========================*/
.sec_index{ padding:4% 0; position: relative;}
.coverage .bgImg{ position:absolute; top:0; left:0;}
.sec_index .inner{ position:relative; z-index: 1;}
/*========================product*/
.product{ background: url(../images/product_01.jpg) center center no-repeat; background-size:cover;}
#canvas01_box{ position:absolute; top:0; left:0; width:100%; height: 100%;}
.title01{ text-align:center; text-transform:uppercase; position: relative; padding-bottom: 25px; margin-bottom: 40px;}
.title01:before{ content:""; position: absolute; bottom: 0; left:50%; width:50px; margin-left:-25px; height: 3px; background: #096bb5;}
.title01 i{ display:block;}
.title01 em{ display:block; opacity: .50;}
.title01_des{ max-width: 870px; margin: 10px auto 0; line-height: 1.65;}
.color_white a{ color:#fff;}
.color_white:before{ background-color:#fff;}
.product_rec{}
.product_rec li{ float:left;}
.product_rec li a{ display:block; height: 100%; position: relative; top:0;}
.product_rec li a .bgImg img{ display:block; border:1px solid #ddd;}
.p_rec_info{ position:absolute; bottom:12%; right:6%;}
.p_rec_info h4{ margin-bottom:5px;}
.p_rec_des{ opacity:.80; margin-bottom: 20px;}
.p_rec_more{ display:inline-block; width:122px; line-height:36px; border-radius:20px; text-align: center; background:#096bb5; color: #fff; transition: all 0.5s ease-in-out; box-shadow:0 5px 20px 0 #096bb540;}
.p_rec_more i{ display:inline-block; padding-right: 14px; background:url(../images/dec_06.png) right center no-repeat;}
.product_rec li.p_rec01,
.product_rec li.p_rec04{ margin-top:0px; }
.product_rec li.p_rec01{ width:31%; border:0px solid #333;}
.product_rec li.p_rec02{ width:30.6%; margin:0 0 30px 50px; border:0px solid #f50;}
.product_rec li.p_rec02 .p_rec_info{ right:15%;}
.product_rec li.p_rec03{ width:30.6%; margin:0px 0 40px 50px; text-align: center; border:0px solid #f10;}
.product_rec li.p_rec03 .p_rec_info{ padding-left:45%; border:0px solid #f50; text-align:left;}
.product_rec li.p_rec04{ width:31%; float: right; margin-right: 0px;}
.product_rec li a:hover{ color:#096bb5; top:-10px;}
.product_rec li a:hover .p_rec_more{ background: #f36321}
/*========================case*/
.case{ background-color:#f6f6f6;}
.case_rec{ margin:-12px; overflow: hidden;display: flex;justify-content: center;}
.case_rec li{ width:25%; /*float:left;*/ padding:12px;}
.case_rec li a{ display:block; position:relative; background: #fff; border-radius: 8px; text-align: center;
-webkit-transition:all 0s ease-in-out;
-moz-transition: all 0s ease-in-out;
-ms-transition: all 0s ease-in-out;
-o-transition: all 0s ease-in-out;
transition: all 0s ease-in-out;
}
.case_rec li a .bgImg{ position: absolute; top:0; left:0; width:100%; height: 100%; opacity: 0;}
.case_block{ position:relative; z-index: 2; height: 380px; padding: 60px 10% 0;}
.case_ico, .case_ico img{ display:block; margin:0 auto; overflow: hidden; position: relative; transition: all 0.5s ease-in-out;}
.case_ico01{ margin-bottom:30px; top:0; opacity: 1;}
.case_ico02{ top:40px; opacity: 0;}
.case_txt{ position: relative; top:0; transition: all 0.5s ease-in-out;}
.case_tit{ margin-bottom: 10px;}
.case_des{ line-height:24px; max-height: 72px; overflow: hidden; margin-bottom:30px;}
.case_more{ font-size: 0; display:block; margin:0 auto; position: relative; width:36px; height:10px; background: url(../images/dec_02a.png) center center no-repeat;}
.case_more:before{ content:""; position: absolute; top:0; left:50%; opacity: 0; width:0; height:100%; background: url(../images/dec_02b.png) center center no-repeat;}
.cover_hide{ position:absolute; z-index:1; left:15px; top:15px; width: -webkit-calc(100% - 30px); width: calc(100% - 30px); height: -webkit-calc(100% - 30px); height: calc(100% - 30px); border-radius:8px; background:rgba(9,107,181, 0.92);; opacity:0; transform:scale(.9); transform-origin:bottom; transition:all .5s ease-in-out;}
.case_rec li a:hover{ color:#fff;}
.case_rec li a:hover .cover_hide{ opacity:1; transform:scale(1)}
.case_rec li a:hover .bgImg{ opacity:1;}
.case_rec li a:hover .case_ico01{ top:-40px; opacity: 0;}
.case_rec li a:hover .case_ico02{ top:-90px; opacity: .50;}
.case_rec li a:hover .case_txt{ top:-120px;}
.case_rec li a:hover .case_more:before{ left:0; opacity:1; width:100%;}
/*========================coverage*/
.coverage{ background-color:#096bb5; color:#fff;}
.coverage:before{ content:""; position: absolute; bottom: 0; left:0; z-index: 1; width:100%; height: 230px; background: #f3f3f3;}
.coverage .bgImg{ opacity:.10; background-position:center top; background-attachment:fixed;}
#coverage_scr{ }
#coverage_scr .item{ overflow: hidden; position: relative; padding-top: 30px;}
.coverage_block{ display:block; border-radius: 8px;
transition: all 0s ease-in-out;
-webkit-transition: opacity 0.60s, -webkit-transform 0.60s;
transition: opacity 0.60s, transform 0.60s;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.coverage_pic{ overflow:hidden; border-top-left-radius:16px;border-top-right-radius:16px; height: 235px;}
.coverage_pic img{ display:block; width:100%; height: 100%;}
.coverage_info{ height:240px; margin-top: -10px; padding: 20px 10%; border-radius:0 0 8px 8px; background: #fff;}
.coverage_time{ opacity:.40; margin-bottom: 5px;}
.coverage_tit{ line-height:28px; max-height:56px; overflow: hidden; margin-bottom: 15px;}
.coverage_des{opacity:.80; line-height:24px; max-height:48px; overflow: hidden; }
.coverage_more{ display:block; position:absolute; bottom: 0; left:50%; font-size: 0; border-radius: 50%; width:60px; height: 60px; margin-left: -30px; opacity:0; transform:scale(.6);}
.coverage_more:before{ content:""; position: absolute; top:0; left:0; width:100%; height: 100%; background: url(../images/arrow_02.png) -60px center no-repeat;}
#coverage_scr .owl-nav a{ width:42px; height:42px; position:absolute; top:50%; left:-80px; margin-top: -42px; background:url(../images/arrow_03.png) left center no-repeat;}
#coverage_scr .owl-nav a.disabled{ opacity:.60;}
#coverage_scr .owl-nav a.owl-next{ left:auto; right:-80px; background-position:right center;}
#coverage_scr .owl-nav a span{ display:none;}
#coverage_scr .owl-dots{ position:absolute; top: -80px; left:0; text-align: right;}
#coverage_scr .owl-dots .owl-dot.active{ border-color:#fff; background: #fff;}
#coverage_scr .item:hover .coverage_block{
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
box-shadow:0 7px 30px -2px #096bb514;
}
#coverage_scr .item:hover .coverage_more{ background-color:#096bb5; opacity:1; transform:scale(1);}
#coverage_scr .item:hover .coverage_more:before{ background-position:center center;}
/*========================contact*/
.contact{ background-color:#f3f3f3;}
.contact_l, .contact_r{ height:420px; background: #fff; overflow: hidden; border-radius:8px;}
.contact_l{ width:61.42%; float: left; margin-right: 15px;}
.map_spread{ border-radius:8px; overflow: hidden; float: left; position:relative; height: 100%; width:44%; max-width:370px; padding-left:0px;}
.contact_info, .contact_r{ padding:30px 40px;}
.contact_info{ overflow: hidden;}
.contact_tit{ color:#333; }
.contact_line{ padding:18px 0; border-bottom: 1px dashed #e5e5e5;border-top: 1px dashed #e5e5e5; margin-top:16px;}
/*.contact_line:last-child{ border:none;}*/
.contact_item{ color:#333; margin-bottom:10px;}
.contact_txt{}
.contact_txt li{ overflow:hidden; text-align:left; line-height:22px; margin-bottom: 4px;}
.contact_txt li img{ display:block; float: left; width:20px; height:20px; margin-right: 6px;}
.contact_txt li p{ overflow:hidden;}
.contact_r{ }
.form_message{ margin:35px -5px -5px; overflow: hidden;}
.m_line{ width:50%; float: left; overflow: hidden; border:5px solid #fff; background:#f8f8f8; color: #333; transition: all 0.5s ease-in-out;}
.m_line label{ display:block; float: left; /*width:85px;*/ line-height: 42px; padding-left: 10px;font-weight: bold;}
.line_r{ overflow:hidden;}
.m_txt{ width:100%; height:42px; padding:10px 0 10px 0;}
.m_txt::-webkit-input-placeholder{ color: rgba(0,0,0,.40);}
.m_txt::-moz-placeholder{ color: rgba(0,0,0,.40);}
.m_txt:-moz-placeholder{ color: rgba(0,0,0,.40);}
.m_txt:-ms-input-placeholder{ color: rgba(0,0,0,.40);}
.line_dif{ width: 100%;}
.m_line:hover{ background:#f3f3f3;}
.m_submit{ cursor:pointer; margin-top:25px; width:132px; height: 42px; border-radius:30px; background:#096bb5; color: #fff;}
.m_submit:hover{ background:#f06121;}
/*========================partners*/
.partners{ background-color:#fff;}
#partners_scr{ overflow: hidden;}
#partners_scr .item{ overflow: hidden; margin: -10px;}
.partners_block{ width:25%; float:left; padding: 10px;}
.partners_block a{ display:table; width:100%; height:180px; text-align:center; border:1px solid #f2f2f2; border-radius:8px;}
.img_box{ display:inline-block; position:relative; width:90%; max-width: 200px;}
.img_box img{ transition: all 0.5s ease-in-out;
-webkit-transform: rotateX(0deg) rotateY(0deg);
-moz-transform: rotateX(0deg) rotateY(0deg);
transform: rotateX(0deg) rotateY(0deg);
}
.img_box img.img_color{ position: absolute; opacity: 0;}
.partners_block a:hover .img_box img.img_gray{ opacity: 0;}
.partners_block a:hover .img_box img.img_color{
opacity: 1;
-webkit-transform:rotateY(20deg);
-moz-transform:rotateY(20deg);
transform:rotateY(20deg);
}
.partners_block a:hover{ box-shadow:0 6px 18px 3px rgba(0,0,0,.05);}
#partners_scr .owl-item.active .partners_block:nth-child(1){ animation: 1s 0.1s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(2){ animation: 1s 0.2s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(3){ animation: 1s 0.3s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(4){ animation: 1s 0.4s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(5){ animation: 1s 0.5s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(6){ animation: 1s 0.6s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(7){ animation: 1s 0.7s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(8){ animation: 1s 0.8s fadeIn both;}
#partners_scr .owl-item.active .partners_block:nth-child(9){ animation: 1s 0.9s fadeIn both;}
/*banner_warp*/
.banner_warp{ height:450px; position:relative;}
.banner_warp .bgImg{ position: absolute; top:0; left:0;}
#canvas02_box{ position: fixed; top:0; left:0; z-index:1; width:100%; height: 100%;}
#canvas02{ width:100%; height: 100%;}
.banner_tit{ text-align: center; text-transform:uppercase; color: #000; padding-bottom: 20px; position:relative; z-index: 3;}
.banner_tit i{ display:block;}
.banner_tit em{ display:block; opacity: .50;}
.banner_tit:before{ content:""; position: absolute; bottom: 0; left:50%; width:36px; height: 1px; margin-left: -18px; background:rgba(0,0,0,.20);}
/*product_forewords*/
.sub_warp{ background:#fff; position: relative; z-index: 2;}
.product_forewords{ padding-bottom: 5%; border-bottom: 1px solid #e5e5e5; margin-bottom: 5%;}
.p_f_img{ width:57.85%; float: left;}
.p_f_img img{ display:block; position: relative; left:-5%;}
.p_f_info{ overflow:hidden; padding-top:3%;}
.p_f_tit{ color: #000; padding-bottom:20px; position: relative; margin-bottom: 40px;}
.p_f_tit:before{ content:""; position:absolute; bottom: 0; left:0; width:48px; height: 2px; background:#096bb5;}
.p_f_des{ }
.product_list{ margin:40px -25px 0px -25px; overflow: hidden;}
.product_list li{ width:25%; float:left; padding: 25px;}
.product_list li a{ display:block; border-radius: 8px; background:#f8f8f8; text-align:center;/* height: 540px;*/ padding:25px 0;}
.product_img{ }
.product_img img{ display:block; margin: 0 auto; position:relative; top:0; transition: all 0.5s ease-in-out;}
.product_info{ padding:30px 15px 0;}
.product_tit{ text-transform:uppercase; margin-bottom: 20px;}
.product_tit em{ display:block; opacity:.70; margin-top:5px;height:2rem;}
.product_list li a:hover{ border-color:#f2f2f2; box-shadow:0 0 30px -2px rgba(0,0,0,.10);}
.product_list li a:hover .product_img img{ top:10px;}
.product_list li a:hover .p_rec_more{ background: #f06121}
/*page*/
.page{ text-align:center; background: #fff; margin-top: 4%;}
.page a{ display:inline-block; vertical-align: middle; text-transform: uppercase; width:35px; line-height: 35px;}
.page a.page_cur{ color:#096bb5;}
.page a.page_prev,.page a.page_next{ font-size: 0; width:43px; margin: 0 10px; position: relative;}
.page a.page_prev:before,.page a.page_next:before{ content: ""; width:14px; height: 14px; position: absolute; top:50%; left:50%; margin: -7px 0 0 -7px; background: url(../images/page_01.png) no-repeat;}
.page a.page_prev:hover,.page a.page_next:hover{ background: #096bb5;}
.page a.page_prev:hover:before{ background-position:right 0;}
.page a.page_next:before{ background-image: url(../images/page_02.png); background-position:right 0;}
.page a.page_next:hover:before{ background-position:left 0;}
.page a.page_go{ width:43px; background: #096bb5; color: #fff; margin: 0 10px 0 20px;}
.page a.page_go:hover{ background: ##109038;}
.page a.page_total{ width:auto;}
.page_txt{ width:60px; height: 35px; padding: 0 10px; vertical-align: middle; border:1px solid #d5d5d5; margin-right: 10px;}
/*common_warp*/
.common_warp{ position: relative; z-index: 2; margin-top: 4%; padding-top:30px;; background:#fff url(../images/common_01.png) center top no-repeat;}
.common_box{ background:#eee; border-radius: 8px;}
.common_l, .common_r{ width:50%; height:300px; padding:25px 50px; float: left; border-radius: 8px; overflow: hidden; position:relative;}
.common_l{ color:#fff;}
.contact_con{ position:relative; z-index:1;}
.common_tit{ margin-bottom:30px;}
.contact_tab{ float:left; margin-right: 8%; width:105px; height:155px; border-right:1px solid rgba(255,255,255,.30);}
.contact_tab li a{ cursor:pointer; display:block; position:relative; color: #fff; opacity: .80; height: 40px; line-height: 24px;}
.contact_tab li a:before{ content:""; position: absolute; top:0; right:-1px; width:1px; height: 0; background:#fff;}
.contact_tab li.active a{ opacity: 1; font-weight:bold;}
.contact_tab li.active a:before{ height:24px;}
.contact_box{ overflow:hidden; margin-top: -20px;}
.contact_block{ display:none;}
.contact_bg{ position:absolute; top:0; left:0; width:100%; height: 100%;}
.bg_block{ position:absolute; top:0; left:0; width:100%; height: 100%; display:none;}
.common_r{ color:#000;}
.form_message02{ margin-top:-15px;}
.form_message02 .m_line{ background-color:#fff; border-color:#eee; border-radius:8px;}
.form_message02 .m_txt{ height:40px;}
.form_message02 .m_line label{ line-height:40px;}
.form_message02 .m_submit{ margin: 0; width:118px; height: 32px; border-radius: 8px; position:absolute; top:25px; right:50px; }
/*article*/
.article{ max-width: 1200px; margin: 0 auto;}
.article_top, .article_tit{ line-height: 48px;}
.article_top{ padding-bottom:20px; border-bottom:1px solid #e5e5e5; margin-bottom: 4%;}
.back_list{ display:block; float:right; color:rgba(0,0,0,.60); padding-right: 30px; background: url(../images/dec_07.png) right center no-repeat; margin-left: 30px;}
.back_list:hover{ color:rgba(0,0,0,1);}
.top_l{ overflow:hidden;}
.article_tit{ overflow:hidden; color: #333; text-align: left;}
.article_caption{ color: #333; margin-bottom: 3%;}
.article_info{ margin-top:20px;}
.article_handle{ margin-top: 4%; padding:3.5% 8%; background: #f8f8f8; line-height:24px;}
.article_btn,.back_list02{ display:block; float: left; width:40%;}
.article_next{ float:right; text-align: right;}
.article_btn em{ display:block; width:30px; height:30px; color:transparent; position: relative;}
.article_btn em:before{ content:""; position: absolute; top:50%; left:0; width: 12px; height: 12px; margin-top: -6px;}
.article_btn em:after{ content:""; position: absolute; top:50%; right:0; width:1px; height: 14px; margin-top: -7px; background: #e5e5e5;}
.article_prev em{ float:left; margin-right: 15px;}
.article_prev em:before{ background: url(../images/article_arrow01.png) left center no-repeat;}
.article_prev:hover em:before{ background-position: right center;}
.article_btn span{ display:block; overflow: hidden; }
.article_next em{ float:right; margin-left: 18px;}
.article_next em:before{ left:auto; right:0; background: url(../images/article_arrow02.png) right center no-repeat;}
.article_next em:after{ right:auto; left:0;}
.article_next:hover em:before{ background-position: left center;}
.back_list02{ width:20%; text-align: center; height:30px; color:transparent; position: relative;}
.back_list02:before{ content:""; position: absolute; top:50%; left:50%; width: 20px; height:20px; margin: -10px 0 0 -10px; background: url(../images/article_ico01a.png) no-repeat;}
.back_list02:hover:before{ background-image: url(../images/article_ico01b.png);}
.article_handle a.article_btn:hover{ color:#096bb5;}
.article_handle a.article_btn:hover em:after{ background-color: #096bb5;}
/*.video_area{ max-width:810px; height: 450px; margin: 0 auto;} */
.video_area iframe{ display:block; width:100%; max-width:810px; height: 450px; margin: 0 auto;}
/*case_list*/
.case_list{ margin: -15px; overflow: hidden;}
.case_list li{ width:25%; float:left; padding:15px;}
.case_list li a{ display:block; border:1px solid #e5e5e5; border-radius: 8px;text-align:center; position: relative; top:0; padding:20px; /*height:440px;*/}
.case_img{ overflow:hidden; margin-bottom: 30px;}
.case_img img{ display:block; width:100%;}
.case_item{ margin-bottom: 10px;}
.case_overview, .case_xq{ opacity:.80;}
.case_overview{ text-align:justify; line-height:24px; height: 72px; overflow: hidden; margin-bottom: 30px;}
.case_xq{ display:inline-block; position: relative; padding-top: 10px;}
.case_xq:before{ content:""; position:absolute; top:0; left:50%; width:26px; height: 2px; background: #096bb5; margin-left: -13px;}
.case_list li a:hover{ top:-15px; border-color:#f2f2f2; box-shadow:0 0 30px 0 rgba(0,0,0,.10);}
.case_list li a:hover .case_xq:before{ left:0; margin:0; width:100%;}
/*coverage_list*/
.coverage_list{ margin: -20px 0; overflow: hidden;}
.coverage_list li{ padding: 20px 0;}
.coverage_list li a{ display:block; border-radius: 8px; border:1px solid #e5e5e5; overflow: hidden; padding: 30px;}
.coverage_img{ display:block; float:left; overflow: hidden; border-radius: 8px; width:435px; height: 243px; margin-right: 40px;}
.coverage_img img{ display:block; width:100%; height:100%;}
.coverage_mation{ overflow:hidden; padding-top: 10px;}
.coverage_mation h5{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.coverage_date{ color: #999; padding-left:20px; background: url(../images/dec_08.png) left center no-repeat; margin:10px 0 20px;}
.coverage_overview{ color: #666; max-width:830px; max-height: 78px; overflow: hidden;}
.coverage_xq{ max-width:830px; text-align: right;}
.coverage_xq span{ display:inline-block; font-size: 0; width:65px; height: 65px; position: relative;}
.coverage_xq span:before{ content:""; position:absolute; top:0; left:0; width:100%; height: 100%; border-radius:50%; background: #fff; opacity:0; transform:scale(.6);}
.coverage_xq span:after{ content:""; position:absolute; top:50%; left:50%; z-index: 1; width:20px; height: 20px; margin: -10px 0 0 -10px; background: url(../images/dec_09.png) right center no-repeat;}
.coverage_list li a:hover{ border-color:#f2f2f2; box-shadow:0 4px 30px 0 rgba(0,0,0,.10); color: #096bb5;}
.coverage_list li a:hover .coverage_xq span:before{ opacity:2; transform:scale(1); background-color: #096bb5;}
.coverage_list li a:hover .coverage_xq span:after{ background-position:left center;}
/*about_nav*/
.about_nav{ margin:0px auto;}
.nav_list{ border-bottom: 1px solid #e5e5e5;}
.nav_list li{ float:left;}
.nav_list li a{ display:block; position: relative; color: #757575; line-height: 30px; padding: 0 15px 20px;}
.nav_list li a:before{ content:""; position:absolute; bottom:-1px; left:50%; width:0; height:1px; background:#096bb5;}
.nav_list li:hover a, .nav_list li.active a{ color: #096bb5;}
.nav_list li.active a:before{ left:0; width:100%;}
/*intro*/
.intro{}
.intro_l{ width:50%; float: left;}
.intro_r{ width:50%; float: left; padding-left: 4%; padding-top: 9%; color: #333;}
.intro_info{ width:100%; max-width:610px; float: right;}
.intro_tit{ margin-bottom: 40px;}
.intro_tit span{ display:block; margin-top: 10px;}
.intro_des{ line-height:22px; max-height: 154px; overflow: hidden; margin-bottom:10%;}
.intro_more{ display:inline-block; width:182px; line-height:48px; border-radius:24px; text-align: center; background:#096bb5; position:relative; color: #fff;}
.intro_more i{ position:relative; display:inline-block; padding-right: 14px; background:url(../images/dec_06.png) right center no-repeat;}
.intro_more:hover{ background:#00b7d7; }
/*development*/
.development{ background: url(../images/development_01.jpg) center center no-repeat; background-size:cover;}
.about_tit{ position:relative; padding-bottom: 20px; color: #333; margin-bottom:40px;}
.about_tit:before{ content:""; position:absolute; bottom: 0; left:0; width:50px; height:3px; background:#096bb5;}
.development .about_tit{ position: absolute; z-index: 2;}
.develop_scr{ padding-top: 120px;}
.develop_scr .item{ background: #fff; border-radius:8px; padding: 15px;}
.develop_block{ border:1px solid #e5e5e5; border-radius:8px; height: 246px; padding: 35px 35px 0;}
.develop_date{ color: #333; padding-bottom:15px; border-bottom: 1px dashed #e5e5e5; margin-bottom: 15px;}
.develop_date span{ display:inline-block; padding-left:40px; background:url(../images/ico_date.png) left center no-repeat;}
.develop_des{ line-height:28px; height: 84px; overflow: hidden;}
.develop_block .case_more{ display:inline-block;}
.develop_scr .owl-nav{ position:absolute; top:35px; right:-25px;}
.develop_scr .owl-nav a{ display:inline-block;position:relative; padding:0 25px!important;}
.develop_scr .owl-nav a span{ font-size:0; display:block; width:28px; height:28px; background: url(../images/arrow_04.png) right center no-repeat;}
.develop_scr .owl-nav a.owl-prev:hover span, .develop_scr .owl-nav a.owl-prev.disabled span{ background-position:left center;}
.develop_scr .owl-nav a.owl-next span{background-image: url(../images/arrow_04b.png); background-position:right center;}
.develop_scr .owl-nav a.owl-next:before{ content:""; position:absolute; top:50%; left:0; width:1px; height: 22px; margin-top:-11px; background:#a7a7a7;}
.develop_scr .owl-nav a.owl-next:hover span, .develop_scr .owl-nav a.owl-next.disabled{ background-position:left center;}
/* timeline */
#timeline, #issues, #issues li{ height:400px; overflow:hidden;}
#timeline{ position:relative;}
.dates_box{ float:right; text-align:center; overflow: hidden; height:330px; margin-left: 4%;}
.dates_box,#next,#prev{ width:140px;}
#dates{}
#dates li a{ display:block; height:90px; font-size: 30px; color: rgba(0,0,0,.30); line-height:0.9;}
#dates li a em{ display:block; text-transform: uppercase; font-size: 12px; line-height: 1; opacity: 0; height:0; overflow: hidden; transition: all 0.5s ease-in-out;}
#dates li a.selected{ font-size:60px; color: #096bb5;}
#dates li a.selected em{ opacity: 1; height:12px;}
#issues{/*width:82.14%; float:left;*/ max-width: 1150px;}
#issues li{ width:100%; }
#grad_top,#grad_bottom{width:500px;height:80px;position:absolute; display:none;}
#next,#prev{position:absolute; right:0; font-size: 0; height:70px;background:#efefef url(../images/arrow_05_a.png) center bottom no-repeat; overflow:hidden;}
#next:before,#prev:before{ content:""; position:absolute; top:0; left:50%; width:1px; height:50px; background:#a7a7a7;}
#next{bottom:0; background-color: transparent; background-image: url(../images/arrow_05_b.png); background-position:center top; }
#next:before{ top:20px;}
#prev{top:0; }
/*#next.disabled,#prev.disabled{ opacity:0.2; }*/
/*honor*/
.honor{}
.gallery_con, .gallery_nav{ width:55%; height: 426px; position:relative; float:left;}
.gallery_con{ width:45%;}
.slideshow-container{ margin-bottom:20px;}
.slideshow{ text-align:center; position:relative; width:90%; max-width: 554px;}
.slideshow span.image-wrapper { display: block; position: absolute; top: 0; left: 0; }
.advance-link{ display:block; border-radius: 8px; background:#f1f1f1; text-align: center; padding:25px;}
.advance-link img{ vertical-align: middle;}
.gallery_nav{ max-width:720px; float: right;}
.gallery_nav .thumbs{ margin:-15px 0 0 -24px; width:100%; height:310px; overflow: hidden;}
.gallery_nav .thumbs li{ width:33.33%; float:left; padding: 15px 0 0 24px;}
.gallery_nav .thumbs li a.thumb{ display:block; overflow: hidden; height:140px; background: #f1f1f1; position:relative;}
.gallery_nav .thumbs li a.thumb img{ display:block; margin: 0 auto; width:auto; max-height: 100%;}
.gallery_nav .thumbs li a.thumb:before{ content:""; position: absolute; top:0; left:0; width:100%; height: 100%; background:rgba(0,0,0,.60) url(../images/ico_search.png) center center no-repeat; background-size:28px; transform:scale(1.1); opacity: 0;}
.gallery_nav .thumbs li.selected a.thumb:before{ transform:scale(1); opacity: 1; }
.nav-controls{ position:absolute; bottom: 0; right:0; z-index: 2; width: 55%; max-width: 720px;}
.nav-controls a{ font-size: 0; margin-right: 5px; border-radius: 5px; display:inline-block; vertical-align: middle; width:96px; height: 72px; background: #f8f8f8; position: relative; }
.nav-controls a:hover{ background-color:#f3f3f3;}
.nav-controls a:before{ content:""; position:absolute; top:0; left:50%; width:16px; height:100%; margin-left: -8px;}
.nav-controls a.prev:before{ background: url(../images/arrow_06_a.png) left center no-repeat;}
.nav-controls a.next:before{ background: url(../images/arrow_06_b.png) left center no-repeat;}
.caption-container .current .img_tit{ animation: 1s .2s fadeInUp both;}
/*intro_detail*/
.intro_detail{}
.detail_con{ max-width:1240px; margin: 0 auto; padding-top: 5%;}
.detail_con .about_tit{ text-align:center;}
.detail_con h3{font-size:20px; color:#154a9a; margin-bottom:16px;}
.detail_con p{ line-height:30px; color:#444; margin-bottom:16px;}
.detail_con .about_tit:before{ left:50%; margin-left:-25px;}
/*join_warp*/
.main_join{ padding-top:0;}
.join_warp{ padding: 4% 0; background:#f8f8f8;}
.join{ padding-top: 40px;}
.join_focus{ overflow: hidden;}
.join_focus img{ display:block;}
.join_l{ width:49%; float: left; padding-right:5%; padding-top:5.5%;}
.join_l .about_tit{ color: #096bb5;}
.join_l .about_tit:before{ width:56px; height: 1px;}
.join_forewords{ line-height:2.3; color:#757575;}
.join_r{ overflow:hidden; padding-right: 40px; position: relative; margin-top: -70px;}
.join_tit, .join_list li{ margin-bottom:10px;}
.join_tit, .join_list li a{ display:block; line-height: 70px; height: 70px; border-radius: 5px; background: #fff; overflow: hidden; padding:0 6% 0 10%;}
.join_tit span{ display:block; padding-left:40px; background:url(../images/dec_10.png) left center no-repeat; color: #333;}
.join_list li a{ color:#666;}
.join_ico{ display:block; float: right; width:16px; height:16px; margin-top:27px; background: url(../images/dec_11a.png) no-repeat; transition: all 0.5s ease-in-out;}
.join_list li a span{ display:block; overflow: hidden;}
.join_list li:hover a{ background-color:#096bb5; color: #fff;}
.join_list li:hover a .join_ico{ transform:rotate(90deg); background-image: url(../images/dec_11b.png);}
/*join_detail*/
.join_detail{ width:100%; }
.join_detail{ height:100%; overflow: hidden; padding:6% 0;}
.detail_area{ padding:0 10%;}
.join_detail .mCSB_scrollTools,
.join_detail .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.join_detail .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{ width:6px; border-radius:8px;}
.join_item{ color:#000; margin-bottom:20px;}
.join_base{ margin-bottom:30px;}
.join_base li{ width:33.33%; float:left; line-height: 24px; margin-bottom: 5px;}
.join_info{ margin:0 -5% 6%; padding:5%; background: #f8f8f8; border-radius: 8px;}
.join_apply{}
.apply_way{ line-height: 1.4; color:#096bb5;}
.apply_way a{ color:#096bb5; font-weight: normal; text-decoration:underline;}
/*join_page*/
.join_page{ text-align:center; line-height: 40px; padding:15px 0; border-radius: 5px; background: #fff;}
.j_p_prev, .j_p_next{ display:inline-block; vertical-align: middle;}
.j_p_prev, .j_p_next{ font-size: 0; margin:0 50px; width:40px; height:40px; background:url(../images/arrow_10_a.png) center center no-repeat; background-size:contain; opacity: .50;}
.j_p_next{ background-image: url(../images/arrow_10_b.png); opacity: .20;}
.j_p_prev:hover{ opacity: 1;}
.j_p_next:hover{ opacity: 1;}
.join_page a.active{ color:#096bb5;}
/*contact_warp*/
.contact_warp{ }
.contact_forewords{ padding:4% 0; border-bottom:1px dashed #e5e5e5;}
.contact_forewords dt,
.way_HQ{ width:44%; float: left; padding-right: 4%;}
.forewords_con, .other_box{ max-width:760px;/* float: right;*/}
.contact_forewords dt img,
.HQ_block{ display:block; width:100%; max-width: 510px;}
.contact_forewords dd{ overflow:hidden;}
.contact_tit02{ margin-bottom: 30px;}
.contact_tit02:before{ width:36px; height: 1px;}
.contact_way{ padding:4% 0;}
.way_HQ{ }
.HQ_block{ border-right:1px solid #e5e5e5; padding-right: 5%;}
.way_info{ }
.way_info li{ overflow:hidden; line-height: 24px; margin-bottom:12px;}
.way_info li img{ display:block; float: left; width:26px; height: 26px; margin-right: 14px; opacity: .50;}
.way_info li p{ overflow:hidden;}
.way_other{ height: 300px; overflow: hidden;}
.way_other .mCSB_inside > .mCSB_container{ margin-right:10px;}
.other_list{ overflow: hidden; margin:-10px;}
.other_list li.li_item0{ width:50%; float: left; padding: 10px; text-align:left;}
.other_block{ display:block; height:150px; color: #666;}
.other_block h6{ margin-bottom:15px;transition: all 0.5s ease-in-out;}
.other_block .contact_txt li{ margin-bottom:6px;}
.other_block:hover h6{color:#096bb5;}
/*contact_map*/
.map_scr, .load{ height: 486px; overflow: hidden;}
.contact_map{ width:100%;height: 400px; float: left; }
.map_scr{ border-radius:8px; overflow: hidden; position:relative;}
.map_show, .map_show .owl-stage-outer,.map_show .owl-stage,.map_show .owl-item , .map_show .item{ height:100%; }
.map_thumbs{ position:absolute; bottom: 0; left:0; z-index: 1; background:rgba(0,0,0,.20); padding:25px 70px;}
.map_thumbs .item a{ cursor: pointer; display:block; text-align:center; border-radius:8px; background: rgba(255,255,255,.90); color:#666; line-height: 44px;}
.map_thumbs .owl-item:hover .item a,
.map_thumbs .current .item a{ background:#096bb5; color: #fff;}
.map_thumbs .owl-nav a{ display:block; position:absolute; top:0; left:26px; width:22px; height: 100%; background:url(../images/arrow_11_a.png) right center no-repeat;}
.map_thumbs .owl-nav a span{ display:none;}
.map_thumbs .owl-nav a.owl-prev:hover,
.map_thumbs .owl-nav a.owl-prev.disabled{ background-position:left center;}
.map_thumbs .owl-nav a.owl-next{ left:auto; right:26px; background-image:url(../images/arrow_11_b.png); background-position:right center;}
.map_thumbs .owl-nav a.owl-next:hover,
.map_thumbs .owl-nav a.owl-next.disabled{ background-position:left center;}
/*load*/
.load{ border-radius:8px; background:#f5f6f6; text-align:center; padding:60px 15px 0;}
.load_tit{ position: relative; padding-bottom:15px; margin-bottom: 30px;}
.load_tit:before{ content:""; position:absolute; bottom: 0; left:50%; margin-left:-14px; width:28px; height: 1px; background:#096bb5;}
.load_img{ display:inline-block; position: relative; margin-bottom: 30px;}
.load_img:before{ content:""; position: absolute; bottom:-5px; left:-2px; width:100%; height: 100%; border-radius:8px; background:#e5e5e5;}
.load_img a img{ position: relative; display:block; border-radius:8px;}
/*load_scr*/
#load_scr{ margin-bottom: 30px; text-align:center;}
/*#load_scr .item a{ display:inline-block; position: relative;}
#load_scr .item a:before{ content:""; position: absolute; bottom:-5px; left:-2px; width:100%; height: 100%; border-radius:8px; background:#e5e5e5;}
#load_scr .item a img{ position: relative; display:block; border-radius:8px;}*/
#load_scr .owl-nav a{ width:20px; height:40px; position:absolute; top:50%; left:0; margin-top: -40px; background:url(../images/arrow_08.png) left top no-repeat; background-size:40px;}
#load_scr .owl-nav a span{ font-size:0;}
#load_scr .owl-nav a.owl-prev:hover,
#load_scr .owl-nav a.owl-prev.disabled{ background-position:right top;}
#load_scr .owl-nav a.owl-next{ left:auto; right:0; background-position:right bottom;}
#load_scr .owl-nav a.owl-next:hover,
#load_scr .owl-nav a.owl-next.disabled{ background-position:left bottom;}
.load_link{ display:block; margin: 0 auto; width:100%; max-width: 218px; line-height: 44px; border-radius: 8px; background:#096bb5; color: #fff;}
.load_link span{ display:inline-block; background: url(../images/ico_load.png) left center no-repeat; padding-left: 26px;}
.load_link:hover{ background:#00b7d7;}
/*result_list*/
.search_box02{ border:1px solid #e5e5e5; border-radius: 8px; box-shadow:0 3px 20px -3px rgba(0,0,0,.10); margin-bottom: 40px;}
.search_btn02{ float:right; cursor:pointer; border-radius:8px; background:#096bb5; color: #fff; width:170px; height: 75px;}
.search_fill02{ overflow:hidden;}
.search_txt02{ width:100%; height:75px; padding:20px 20px 20px 90px; background: url(../images/ico_search02.png) 30px center no-repeat;}
.result_box{ }
.result_list{ margin: 0 -40px;}
.result_list li{ width:50%; float: left; padding:30px 40px;}
.result_list .dec_line{ width:100%; clear:both; padding: 0; height:80px; position: relative;}
.result_list .dec_line:before{ content:""; position:absolute; top:50%; left:0; width:100%; height: 1px; background: #e5e5e5;}
.result_list li a{ display:block; border-radius:8px; height: 160px; padding: 10px;}
.result_block{ width:100%; max-width: 520px;}
.result_date i{ font-size: 16px; margin-right: 10px;}
.result_tit{ margin:20px 0 15px; position:relative; transition: all 0.5s ease-in-out;}
.result_tit:before{ content:""; position:absolute; top:50%; left:0; width:0; height: 1px; background: #096bb5;}
.result_des{ opacity:.80; line-height:26px; max-height:52px; overflow: hidden;}
.result_list li:hover a{ box-shadow:0 0 20px -2px rgba(0,0,0,.15);}
.result_list li:hover a .result_tit{ padding-left:60px; color: #096bb5;}
.result_list li:hover a .result_tit:before{ width:50px;}
/*empty*/
.empty{ padding:6% 0 5%; text-align: center; font-size: 18px; line-height: 2; color: #333;}
.empty_img{ display:inline-block; margin-bottom: 20px; max-width: 50%;}
/*font*/
.f56{ font-size:56px;}
.f52{ font-size:52px;}
.f48{ font-size:48px;}
.f42{ font-size:42px;}
.f36{ font-size:36px;}
.f32{ font-size:32px;}
.f30{ font-size:30px;}
.f28{ font-size:28px;}
.f26{ font-size:26px;}
.f24{ font-size:24px;}
.f22{ font-size:22px;}
.f20{ font-size:20px;}
.f18{ font-size:18px;}
.f16{ font-size:16px;}
@media (max-width:1440px){
.inner{ width:1100px;}
/*font*/
.f56{ font-size:50px;}
.f52{ font-size:46px;}
.f48{ font-size:42px;}
.f42{ font-size:36px;}
.f36{ font-size:30px;}
.f32{ font-size:28px;}
.f30{ font-size:26px;}
.f28{ font-size:24px;}
.f26{ font-size:22px;}
.f24{ font-size:20px;}
.f22{ font-size:18px;}
.f20{ font-size:18px;}
.f18{ font-size:16px;}
.f16{ font-size:14px;}
.menu_list a.a_item0{ font-size:32px;}
.subclass a{ font-size:18px;}
/*index*/
.p_rec_info{ bottom:8%; right:2%;}
.product_rec li.p_rec02 .p_rec_info{ right:12%;}
.case_block{ padding-top:40px; height:340px;}
.contact_info, .contact_r{ padding:20px 30px;}
.partners_block a{ height:140px;}
.slide_text h3{ margin-bottom:15px; font-size:52px;}
.slide_text p{ margin-bottom:25px; font-size:20px;}
.coverage_pic{ height:200px;}
/*02*/
.product_list{ margin:-15px;}
.product_list li{ padding:15px;}
.article_top, .article_tit{ line-height:40px;}
}
@media (max-width:1279px){
.inner{ width:100%; max-width: 1024px; padding-left:15px; padding-right: 15px;}
/*font*/
.f56{ font-size:44px;}
.f52{ font-size:40px;}
.f48{ font-size:36px;}
.f42{ font-size:32px;}
.f36{ font-size:26px;}
.f32{ font-size:24px;}
.f30{ font-size:22px;}
.f28{ font-size:20px;}
.f26{ font-size:18px;}
.f24{ font-size:18px;}
.f22{ font-size:16px;}
.f20{ font-size:16px;}
.f18{ font-size:14px;}
.f16{ font-size:14px;}
/*header*/
header, .menu_top{ padding:30px 0;}
/*index*/
.focus_warp{ height:500px;}
.slide .owl-nav a{ width:30px; height: 60px; margin-top: -30px; background-size:60px;}
.product_rec li.p_rec02{ width:33.996%;}
.coverage .bgImg{ background-attachment: inherit;}
.coverage_tit, .coverage_des{ line-height: 22px; max-height:44px;}
.coverage_tit{ margin-bottom:10px;}
.coverage_info{ height:190px;}
.coverage:before{ height:180px;}
#coverage_scr .owl-nav a{ display:inline-block; margin: 0 5px;}
.coverage_more{ width:50px; height: 50px; margin-left: -25px;}
.contact_line{ padding:13px 0;}
.partners_block a{ height:100px;}
.banner_warp{ height:450px;}
#canvas01_box, #canvas02_box{ display:none;}
/*05*/
.gallery_con, .gallery_nav{ height:326px;}
.gallery_nav .thumbs{ margin:-10px 0 0 -10px; height: 250px;}
.gallery_nav .thumbs li{ padding:10px 0 0 10px;}
.gallery_nav .thumbs li a.thumb{ height:110px;}
/*06*/
.search_btn02{ width:125px; height: 55px;}
.search_txt02{ height: 55px; padding: 15px 15px 15px 50px; background-size: 20px; background-position: 15px center;}
.result_list{ margin:0 -20px;}
.result_list li{ padding:20px;}
.result_list .dec_line{ height:40px;}
.article_top, .article_tit{ line-height:36px;}
.tan_closed{ width:60px; line-height: 60px; background-size: 20px;}
.search_txt{ font-size:18px;}
.search_btn{ background-size:30px;}
}
@media (max-width:991px){
/*header*/
header, .menu_top{ padding:10px 0;}
header{ position:fixed; background:rgba(191,191,191,.60);}
.logo a img{ height:40px;}
.focus_warp, .banner_warp{ margin-top:60px;}
.menu_list a.a_item0{ font-size:24px; margin-bottom: 10px;}
.subclass a{ font-size:16px;}
/*footer*/
footer{ padding:30px 0; text-align:center; border-width:8px;}
.footer_l, .footer_r{ width:100%; float: none;}
.footer_logo{ margin:0 auto;}
.footer_nav{ margin:20px -10px 10px;}
.footer_nav a{ padding: 0 10px;}
/*index*/
.slide .owl-nav{ display:none;}
.product_rec{ margin:-10px -5px;}
.product_rec li:nth-child(n){ float: left; margin: 0; width:50%; padding:10px 5px;}
.product_rec li:nth-child(n) a{ max-width:320px; height: 300px; margin: 0 auto;}
.product_rec li:nth-child(n) a .bgImg img{ display:none;}
.product_rec li a:hover{ top:-5px;}
.case_rec{ margin:-5px;}
.case_rec li{ padding:5px;}
.cover_hide{
top:5px; left:5px;
width: -webkit-calc(100% - 10px);
width: calc(100% - 10px);
height: -webkit-calc(100% - 10px);
height: calc(100% - 10px);
}
.case_ico, .case_ico img{ width:60px; height: 60px;}
.case_ico, .case_des{ margin-bottom:20px;}
.case_block{ padding-top:30px; height: 270px;}
.case_rec li a:hover .case_ico02{ top:-60px;}
.case_rec li a:hover .case_txt{ top:-80px;}
.contact_l{ width:100%; float: none; margin-right: 0; margin-bottom: 15px;}
.contact_r{ height:auto;}
#partners_scr .item{ margin:-5px;}
.partners_block{ padding:5px;}
.p_rec_more{ width:92px; line-height: 28px; font-size: 12px;}
/*02*/
.banner_warp{ height:225px;}
.common_l, .common_r{ padding: 20px;}
.form_message02 .m_submit{ right:20px;}
.contact_tab{ width:65px;}
.p_f_img{ width:100%; float:none; text-align:center;}
.p_f_img img{ display:inline-block; left:0;}
.product_list{ margin:20px -5px 0px -5px;}
.product_list li{ padding:5px;}
.case_list{ margin:-5px;}
.case_list li{ padding:5px;}
.case_list li a{ padding:10px;}
.coverage_list{ margin:-15px 0;}
.coverage_list li{ padding:15px 0;}
.coverage_list li a{ padding:15px;}
.coverage_img{ margin-right:20px;}
.intro_l{ width:100%; float: none; text-align:center; margin-bottom: 30px;}
.intro_r{ padding:0; width:100%; float: none;}
.intro_info{ max-width:100%; float: none;}
.intro_tit{ margin-bottom:20px;}
.intro_des{ margin-bottom:30px;}
.intro_more{ width:122px; line-height: 36px;}
/*05*/
.dates_box, #next, #prev{ width:100px;}
#dates li a{ font-size: 20px;}
#dates li a.selected{ font-size:40px;}
.develop_scr{ padding-top:90px;}
.develop_scr .item{ padding:10px;}
.develop_block{ height: 236px; padding:20px 20px 0;}
.develop_scr .owl-nav{ position: inherit; position: initial; margin-top: 30px;}
.develop_scr .owl-nav a{ padding:0 10px!important;}
.nav-controls a{ width:70px; height: 52px;}
.nav-controls a:before{ width:12px; margin-left: -6px;}
.nav-controls a.prev:before, .nav-controls a.next:before{ background-size: 24px; }
.gallery_nav .thumbs li a.thumb:before{ background-size: 18px;}
.other_list li.li_item0{ width:100%; float: none;}
.other_block{ height:auto;}
.other_box{ float: none;}
}
@media (max-width:767px){
/*font*/
.f56{ font-size:34px;}
.f52{ font-size:30px;}
.f48{ font-size:24px;}
.f42{ font-size:22px;}
.f36{ font-size:20px;}
.f32{ font-size:18px;}
.f30{ font-size:18px;}
.f28{ font-size:16px;}
.f26{ font-size:16px;}
.f24{ font-size:16px;}
.f22{ font-size:16px;}
.f20{ font-size:16px;}
.f18{ font-size:14px;}
.f16{ font-size:12px;}
body,html,button, input, textarea, select{ font-size:12px;}
/*index*/
.focus_warp{ height:300px;}
.ico_video{ width:18%; margin:-2.6% 0 0 -9.2%; }
.slide_text{ top:20%;}
.slide_text h3{ font-size:32px; }
.slide_text h3 img{ width:10px; height: 10px; margin: 0 6px; display:none;}
.slide_text p{ font-size: 14px; letter-spacing: 0;}
.case_rec li{ width:50%;}
.contact_l{ position:relative;}
.contact_info, .contact_r{ padding:15px;}
.map_spread{ width:100%; max-width:none;}
.contact_info{ position:absolute; top:0; left:0; width:100%; height: 100%; background: rgba(255,255,255,.70);}
.partners_block a{ height:60px;}
.coverage_img{ width:100%; height:auto; float: none; margin: 0;}
.coverage_xq{ display:none;}
.coverage_pic{ height:120px;}
.product_rec li:nth-child(n) a{ height:auto;}
.product_rec li:nth-child(n) a .bgImg{ height:180px; margin-bottom: 10px; background-position: center top; }
.product_rec li.p_rec01 .p_rec_info,
.product_rec li.p_rec02 .p_rec_info,
.product_rec li.p_rec03 .p_rec_info,
.product_rec li.p_rec04 .p_rec_info{ position:inherit; position: initial; text-align:center;}
.product_rec li:nth-child(n) a .p_rec_info .p_rec_des{ margin-bottom:10px;}
/*02*/
.nav_list li{ margin-right: 15px;}
.nav_list li a{ padding:0 10px 10px;}
.common_l, .common_r{ width:100%; height: 100%;}
.product_list li{ width:50%;}
.case_list li{ width:50%;}
/*05*/
.gallery_con, .gallery_nav{ width:100%; float: none; max-width:none; height: auto;}
.gallery_nav ,.gallery_nav .thumbs{ height:160px; overflow: hidden;}
.slideshow{ width:100%; margin:0 auto;}
.advance-link{ padding:15px;}
.gallery_con{ margin-bottom:20px;}
.gallery_nav .thumbs li a.thumb{ height:70px;}
.nav-controls{ position:inherit; width:100%; max-width: none; text-align: center; margin-top: 20px;}
.join_l{ width:100%; float: none; padding-right: 0;}
.join_r{ padding-right: 0; margin-top:30px;}
.join_tit, .join_list li a{ height:50px; line-height: 50px;}
.join_ico{ margin-top:17px;}
.contact_forewords dt, .way_HQ{ width:100%; float: none; padding: 0; margin-bottom: 20px;}
.contact_forewords dt img, .HQ_block{ margin:0 auto;}
.HQ_block{ max-width:none; padding: 0 0 20px; border-right:none; border-bottom:1px solid #e5e5e5;}
.contact_map{ width:100%; float: none; margin:0 0 20px;}
.map_scr{ height: 320px;}
.load{ height:auto; padding:30px 15px;}
.map_scr .owl-item .bgImg img{ display:block;}
.map_thumbs .owl-nav a.owl-prev{ left:0;}
.map_thumbs .owl-nav a.owl-next{ right:0;}
.map_thumbs{ padding:10px 32px;}
/*06*/
.result_list{ margin:-10px;}
.result_list li{ width:100%; float:none; padding:10px;}
.empty{ font-size:16px;}
.article_top, .article_tit{ line-height:30px;}
.article_handle{ line-height:22px; padding: 15px;}
.article_btn, .back_list02{ width:100%; float: none;}
.back_list02{ margin:10px 0;}
.article_info{ margin-top:0;}
.back_list{ padding-right:20px; background-size:15px;}
.video_area iframe{ height: 250px;}
}
@media (max-width:640px){
.detail_area{ padding:20px;}
.join_base li{ width:50%;}
.x_contactlist{
overflow:hidden;
width:100%;
}
.x_contactlist ul{
overflow:hidden;
width:100%;
}
.x_contactlist ul li{
overflow:hidden;
width:80%;
margin:0 10% 5% 10%;
float:left;
padding:2% 0;
border:1px solid #ddd;
box-shadow:0px 0px 8px #ccc;
text-align:center;
}
.x_contactlist ul li h3{
font-size:18px;
}
.x_contactlist ul li img{
margin:2% 0;
}
.x_contactlist ul li p{
font-size:14px;
}
}
@media (max-width:375px){
.product_rec li:nth-child(n) a .bgImg{ height:160px;}
}
@media (max-width:359px){
/*header*/
.ico_lang, .ico_search, .ico_box{ padding:0 5px;}
.ico_box{ padding:0 0 0 15px; margin-left: 5px;}
.product_rec li:nth-child(n) a .bgImg{ height:140px;}
.m_line{ width:100%;}
}
.product_rec li.p_rec03 .p_rec_info{ right:0; width:100%;}
.coverage, .honor{ padding-bottom:0;}
.m_yu, .form_message02 .m_yu{ height:90px; resize:none;}
.slide_text h3,.slide_text p,
.title01, .banner_tit, .p_f_tit, .common_tit, .contact_tab,
.article_tit, .article_caption,
.about_tit, .intro_tit, .develop_date{ font-family:'Microsoft Jhenghei', '微軟正黑體';}
/*css控制单行显示*/
aa{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
a,*:before,*:after,input[type="submit"], input[type="reset"], input[type="button"],sup,.owl-carousel .owl-nav a span,.owl-carousel .owl-dots .owl-dot,
header, .ico_menu i{
/*-webkit-transition:all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;*/
transition: all 0.5s ease-in-out;
}
/*图片由小变大*/
.case_img img,
.coverage_pic img{ transition: transform 4s cubic-bezier(.23, 1, .32, 1); transform: scale(1); }
.case_list li a:hover .case_img img,
.coverage_list li a:hover .coverage_pic img{ transform: scale(1.1); }
/*图片横向*/
.aa{
display: block;
max-width: none;
width: -webkit-calc(100% + 10px);
width: calc(100% + 10px);
-webkit-transition: opacity 0.60s, -webkit-transform 0.60s;
transition: opacity 0.60s, transform 0.60s;
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
.aa{
opacity: 1.0;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
/*图片纵向*/
aa{
display: block;
/* max-width: none;*/
height: -webkit-calc(100% + 10px);
height: calc(100% + 10px);
-webkit-transition: opacity 0.60s, -webkit-transform 0.60s;
transition: opacity 0.60s, transform 0.60s;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
aa{
opacity: 1.0;
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}