@charset "utf-8";
header {position:relative; padding:0 30px 30px; min-width:1260px; background:linear-gradient(to right,#042e6f,#042e6f 50%, #f2f2f2 50%, #f2f2f2); box-sizing:border-box;}
header .visual img{ width:100%;}
header h1 {position:absolute; left:30px; top:0; z-index:20;}
header #lnb {position:absolute; left:0; top:0; width:100%; padding: 0 230px; box-sizing:border-box;}
header nav {position:relative; z-index:20; border-bottom:1px solid rgba(255,255,255,.5);}
header nav > ul {overflow:hidden; display:flex; margin:0 auto; width:800px; height:70px;}
header nav:hover > ul {overflow:visible;}
header nav > ul:after {content:""; position:absolute; left:0; top:0;}
header nav > ul > li {position:relative; flex:1; text-align:center;}
header nav > ul > li > a {display:block; position:relative; height:69px;  color:#fff; font-size:18px;  line-height:69px;}
header nav > ul > li > a:after {content:""; position:absolute; left:50%; bottom:-1px; width:0; height:2px; background:#fff; transition:all 0.5s;}
header nav > ul > li:hover > a:hover:after {left:0; width:100%;}
header nav > ul > li ul {position:absolute; z-index:-1; padding:21px 0 0; width:100%; height:170px; line-height:40px; opacity:0; transition:all .6s}
header nav:hover > ul ul {opacity:1;}

header nav > ul > li ul a {position:relative; color:#fff; font-size:14px; }
header nav > ul > li ul a:hover {color:#29c7eb;}
header nav > ul > li ul a:after {content:""; position:absolute; left:50%; bottom:-1px; width:0; height:2px; background:#29c7eb; transition:all 0.6s;}
header nav > ul > li ul a:hover:after {left:0; width:100%;}
header nav + div {position:absolute; left:0; top:0; z-index:19; padding:0 30px; width:100%; height:0; background:#042e6f; background-clip:content-box; box-sizing:border-box; opacity:0;transition: all .6s;}
header nav:hover + div {height:329px; opacity:1;}
header > ul {display:flex; position:absolute; right:30px; top:0; z-index:20; width:170px; background:#f2f2f2;}
header > ul li {flex:1; padding: 0 0 0 18px; height:70px; line-height:70px;}
header > ul li a {color:#333; font-size:11px;}
header > ul li:first-child a:before {content:""; display:inline-block; width:23px; height: 23px; background:url(../images/icon.png)no-repeat; vertical-align:middle; }
header > ul li:last-child a:before {content:""; display:inline-block; width:23px; height: 23px; background:url(../images/icon.png)no-repeat -23px 0; vertical-align:middle}
main > div {width:1175px; margin:0 auto;}
.info_box {padding:58px 0 0;}
.info_box h2 {padding:0 0 42px;color:#777; font-size:20px; font-weight:normal; line-height:100%; text-align:center; letter-spacing:37px;}
.info_box h2 span {color:#042e6f;}
.info_box ul {display:flex; padding:0 0 30px}
.info_box ul li {flex:1; padding:0 45px 0 0;}
.info_box ul li:last-child {}
.info_box li a {position:relative; display:block; padding:211px 20px 0; background:url(../images/sales_obj01.png) no-repeat -296px -56px, url(../images/sales_obj02.png) no-repeat -305px 357px, url(../images/sales_obj03.png) no-repeat 205px 377px; height:380px; box-sizing: border-box;}
.info_box li a,
.info_box li a * {transition:all 0.6s;}
.info_box li a:hover {background-color:#aaa8aa; background-position:-133px -21px, -245px 327px, 135px 307px;}
.info_box li a:hover * {color:#fff;}
.info_box li a strong {overflow:hidden; position:absolute; left:0; top:0; width:100%; height:170px;}
.info_box li a img {height:170px;}
.info_box li a:hover img {transform:scale(1.1);}
.info_box li a h3 {color:#222; font-size:19px; line-height:27px;}
.info_box li a div {position:absolute; left:20px; top:137px; width:65px; height:65px; font-size:13px; text-align:center; line-height:59px; box-sizing:border-box;}
.info_box li a div.ico1 {background:#fff; border:3px solid #042e6f; color:#042e6f;}
.info_box li a div.ico2 {background:#94c83d; color:#fff; line-height:65px;}
.info_box li a div.ico3 {background:#042e6f; color:#fff; line-height:65px;}
.info_box li a p {padding:13px 0 0; line-height:18px; color:#747774; font-size:13px;}
.info_box li a span {position:absolute; left:0; bottom:0; padding:0 20px; width:100%; box-sizing:border-box;}
.info_box li a span em {display:block; height:54px; border-top:1px solid #ccc; line-height:54px;text-align:right;}
.info_box li a span em:after {content:""; display:inline-block; margin:0 0 0 16px; width:22px; height:12px; background:url(../images/icon.png) no-repeat -60px -25px;}
.info_box li a:hover span em:after {background-position:-60px -5px;}
.guide {display:flex; position:relative; padding:60px 0 0;}
.guide article {flex:1;}
.guide article:first-child:after {content:""; position:absolute; left:50%; top:60px; width:1px; height:80px; background:#666;}
.guide article:first-child h2 {float:left; padding:0 20px 0; color:#000; font-size:29px; line-height:40px;}
.guide article:first-child ul {display:flex; float:left; width:456px; }
.guide article:first-child ul li {flex:1;}
.guide article:first-child ul li a {display:block; padding:70px 0 0; background:no-repeat center 0; font-size:15px; color:#002870; text-align:center; }
.guide article:first-child ul li:nth-child(1) a{background-image:url(../images/ico_main_util01.png);}
.guide article:first-child ul li:nth-child(2) a{background-image:url(../images/ico_main_util02.png);}
.guide article:first-child ul li:nth-child(3) a{background-image:url(../images/ico_main_util03.png);}
.guide article:first-child ul li:nth-child(4) a{background-image:url(../images/ico_main_util04.png);}
.guide article:last-child {padding:15px 0 0;}
.guide article:last-child > div {float:left;}
.guide article:last-child > div:first-child {padding:0 58px 0;}
.guide article:last-child > div h2 {font-weight:normal;}
.guide article:last-child > div:first-child h2 { color:#777; font-size:15px; }
.guide article:last-child > div:first-child a { color:#042e6f; font-size:21px; }
.guide article:last-child > div:last-child h2 {float:left;  color:#777b80; font-size:15px;}
.guide article:last-child > div:last-child p {float:left; padding:3px 0 0 10px; color:#777b80; font-size:11px;}
.guide article:last-child > div:last-child div {color:#777b80; font-size:15px; clear:both;}

.news {margin:54px 0 0; background:#f4f5f9;}
.news > div {width:1175px; margin:0 auto; padding: 50px 0;} 
.news > div h2 {float:left; width:95px; height:95px; background:#042e6f; color:#fff; font-size:14px; line-height:95px; text-align:center;}
.news > div ul {display:flex; padding:0 0 0 16px;}  
.news > div ul li {flex:1; padding:0 0 0 45px;}
.news > div ul li a {display:block; position:relative; padding:40px 30px 0; height:220px; background:#fff;}
.news > div ul li h3 {color:#222; font-size:23px; font-weight:normal; line-height:35px; 
	display:box; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.news > div ul li div {padding:23px 0 0; color:#666; font-size:13px; line-height:20px; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.news > div ul li span {position:absolute; left:30px; bottom:41px; font-size:11px; color:#666;}
.news > div ul li i {position:absolute; background: #606060; opacity:0; transition:all .5s;}
.news > div ul li a i:nth-of-type(1) {left:0; top:0; width:0; height:1px;}
.news > div ul li a i:nth-of-type(2) {left:0; top:0; width:1px; height:0;}
.news > div ul li a i:nth-of-type(3) {right:0; bottom:0; width:1px; height:0;}
.news > div ul li a i:nth-of-type(4) {right:0; bottom:0; width:0; height:1px;}
.news > div ul li a:hover i {opacity:1;}
.news > div ul li a:hover i:nth-of-type(1) {width: 100%;}
.news > div ul li a:hover i:nth-of-type(2) {height:100%;}
.news > div ul li a:hover i:nth-of-type(3) {height:100%;}
.news > div ul li a:hover i:nth-of-type(4) {width:100%;}
footer {background:#272f3c;}
footer > div { padding:46px 0 40px; width:1175px; margin:0 auto;}
footer > div > div:first-child {float:left;}
footer > div > div:first-child li{float:left; padding:0 10px 0 0;}
footer > div > div:first-child li a{ font-size:12px; color:#fff;}
footer > div > div:first-child address {padding:15px 0 0; font-size: 12px; color:#bfc1c1;}
footer > div > div:first-child address span {padding: 0 12px 0 0;}
footer > div > div:last-child {position:relative; float:right;}
footer > div > div:last-child select {width:144px; height:30px; background:#272f3c; border-radius:0; border:none;  border-bottom:1px solid #7d828a; color:#fff; font-size:11px; text-indent:20px;}
footer > div > div:last-child a {position:absolute; right:-5px; top:-66px; width:39px; height:49px; background:url(../images/icon.png) no-repeat -156px 9px #049cd3; color:transparent;}

.center {text-align:center;}
.btn_more {display:inline-block; border:1px solid #042e6f; width:138px; height:42px; color:#042e6f; font-size:16px; text-align:center; line-height:42px;}
.btn_more:after {content:""; display:inline-block; margin:0 0 0 15px;  width:12px; height:12px; background:url(../images/icon.png) no-repeat -196px -5px;}

@media screen and(-ms-high-contrast:active), (-ms-high-contrast:none) {
	.news > div ul li h3 {height:70px;}
	}
	.news > div ul li div {height:82px; box-sizing:border-box;} 
}