﻿@charset "utf-8";
/*css comment*/

body,html {
    color:#666;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #fff;  
    font-family:arial, Microsoft YaHei, "微软雅黑";
    font-size: 14px; 
	line-height:1.72;
	text-align:justify;
	overflow-x:hidden;
}
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: arial, 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: #005193; border-color:#005193;}

.inner{ width:1400px; margin: 0 auto;} 
/*===================header========================*/
header{ position:absolute; top:0; left:0; z-index:1003; width:100%;}  
header, .menu_top{ padding:50px 0;}
.logo{ float:left; position:relative; z-index: 1004;}
.logo a img{ display:block; height:40px; width:auto;}
.header_r{ float:right;}
.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: 36px; opacity: .70; margin-bottom: 20px;}
.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:#005193;}
.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;}
/*==============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:#005193;} 
.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: .30;}
.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: 70px; padding-bottom: 50px;} 
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:26px;}
.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:#005193;}
.copyright{ opacity:.50;color: #fff;}
.copyright a{color: #fff;}
.copyright a:hover{ color:#005193;}
.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:#005193;}
.back_top:hover i:before{ background: #005193; border-color:#005193;}
.back_top:hover i:after{ background-position:center bottom;}
.notice{}
.notice img{ display:block; }
 
/*===================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;overflow: hidden;width:100%;}
/*==============
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: #005193;}
.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;}
.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:#005193; color: #fff; transition: all 0.5s ease-in-out; box-shadow:0 5px 20px 0 #00519355;} 
.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:110px;} 
.product_rec li.p_rec01{ width:32.143%;}
.product_rec li.p_rec02{ width: 34.740%;}
.product_rec li.p_rec02 .p_rec_info{ right:15%;}
.product_rec li.p_rec03{ width:29%; margin:30px 0 0 3.429%; text-align: center;}
.product_rec li.p_rec04{ width:28.572%; float: right; margin-right: 50px;} 
.product_rec li a:hover{ color:#005193; top:-10px;}
.product_rec li a:hover .p_rec_more{ background: #c52026}


/*========================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(29, 171, 76, 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:#005193; 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-radius: 8px; 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 rgba(34,202,232,.15);
}
#coverage_scr .item:hover .coverage_more{ background-color:#005193; 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;} 
.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;}
/*.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:#005193; color: #fff;}
.m_submit:hover{ background:#069635;}
/*========================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:485px; position:relative;}
.banner_warp .bgImg{ position: absolute; top:0; left:0;}
#canvas02_box{ position: absolute; 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:#005193;}
.p_f_des{ }
.product_list{ margin: -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;}
.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: #af0d0d}





.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:#005193;}
.article_handle a.article_btn:hover em:after{ background-color: #005193;}
/*.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: #005193; 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: 72px; 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: #005193;}
.coverage_list li a:hover .coverage_xq span:before{ opacity:2; transform:scale(1); background-color: #005193;}
.coverage_list li a:hover .coverage_xq span:after{ background-position:left center;}
/*about_nav*/
.about_nav{ }
.nav_list{ border-bottom: 1px solid #e5e5e5;}
.nav_list li{ float:left; margin-right: 25px;}
.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:#005193;}
.nav_list li:hover a, .nav_list li.active a{ color: #005193;}
.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:#005193; 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:#005193;}
.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: #005193;}
#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 .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: #005193;}
.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:#005193; 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:#005193;}
.apply_way a{ color:#005193; 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:#005193;}
/*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:#005193;}
/*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:#005193; 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:#005193;}
.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:#005193; 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:#005193; 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: #005193;}
.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: #005193;}
.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:355px;}
	#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:15px 0;}
	header{ position:fixed; background:rgba(191,191,191,.60);}
	.logo a img{ height:24px;} 
	.focus_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:-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%;}

}

@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);
}





/*分页*/
.page{width:100%;  height: 70px;clear: both;text-align: center;padding-top:30px;  margin-top: 4%;}
.page strong{color:#FFF;  background-color:#005193;  padding:7px 12px;  margin:1px 10px 0px -1px;  cursor:pointer; border:1px solid #005193; }
.page a{border:1px solid #e6e6e6;  padding:7px 12px;  margin-right:10px;  cursor:pointer; color:#000; }
.page a:hover{background-color:#e6e6e6;  border:1px solid #e6e6e6;}
