@charset "utf-8";
/* CSS Document */
.side, .main{padding:1em;}
.innerhtml{line-height:200%;}
.content{padding:3em 0;}
/*nav*/
.nav{position:absolute; top:100%; right:0; transform:translateY(-105%); padding:0;}
.nav ul li a{color:#666; font-size:15px; padding:1em; position:relative;}
.nav ul li a::after{content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:1em; background:#ccc; display: block;}
.nav ul li a::before{content:""; position:absolute; left:50%; bottom:0%; transform:translateX(-50%) rotate(-135deg); width:7px; height:7px; background:linear-gradient(-45deg,#ccc 50%,#fff 50%); display: block; transition:.2s; opacity:0;}
.nav ul li a:hover::before{bottom:-15px; opacity:1; background:linear-gradient(-45deg,#5e7c86 50%,#fff 50%);}
.nav ul li:last-of-type a::after{display:none;}
.nav ul li a:hover{color:#5e7c86; transform:translateY(-5px);}
.nav ul li a.hit{background:#7bb451; color:#fff;}
.nav .righticon{display:inline-block; padding-left:2em;}
.nav .righticon li a{padding:1em 0.3em; vertical-align: middle;}
.nav .righticon li a::after{display:none;}
.nav .righticon li a img{vertical-align:middle;}
#header{padding:10px 0 5px 0; transition:.3s; background:#fff; border-bottom:3px solid #0f3c4b;}
#header .page{padding:0; position:relative;}
#header .page::after{content:""; display:block; clear: both; vertical-align: middle;}
#header.show{box-shadow: 0 5px 10px rgba(0,0,0,0.2);}
.logo{padding:0 0 5px 0;}

/*topblue*/
.topblue{ position:absolute;}
/*default img*/
#defaultimg{position:relative;}
#defaultimg .mask{width:100%; height:auto; position:absolute; bottom:0; z-index: 190; text-align: center; line-height: 160%;}

.banner .tit{color:#0f3c4b; font-size:240%; position:relative; display: inline-block; text-align: center; letter-spacing: 0.1em; line-height:1.1em; margin-bottom:0;}
.banner .tit::before{content:""; width:120%; height:1px; background:#333; display:block; left:-140%; top:50%; position:absolute;}
.dservice .list, .dservice .list a{padding:0;}
.banner .tit::after{content:""; width:120%; height:1px; background:#333; display:block; right:-140%; top:50%; position:absolute;}
/*list*/
.list{padding:1em;}
.list h3.subject{font-weight:normal; margin:0; color:#226EB5; padding:0.3em 0;}
.list a{width:100%; diaplay:block; float:left; color:#666; padding:10px;}
.list a:hover{color:#014283; }
.list figure img{transition:.3s;}
.list a:hover img{transform:scale(1.05, 1.05);}
.list a:hover figcaption{opacity:1;}
.list figure{diaplay:block; line-height:0; overflow: hidden; position:relative;}
.list figure::before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(15,60,75,0.8); transition:.3s; opacity:0; z-index: 2;}
.list a:hover figure::before{opacity:1;}
.list figcaption{position:absolute; top:50%; left:50%;  height:auto; opacity:1; text-align: center; color:#fff;  z-index: 100; font-size: 14px; transition:.3s; transform:translate(-50%,-50%); line-height: 140%; opacity:0;}
.list a:hover figcaption{opacity:1;}
.list p.more{text-align:right; margin:0; color:#666; font-size:12px;}
.list a:hover p.more{color:#f00;}
/*content*/
.sidetit{ color:#fff; background:linear-gradient(45deg,#7bb451 80%,#fff 80%,#fff 90%,#7bb451 90%); padding:0.5em 0.3em; margin-bottom:0; font-size:20px;}
/*default use*/
.dnews{padding:3em 0; overflow: hidden;}
.dnews h2 span{font-size:280%;  color:#0f3c4b; letter-spacing:3px; margin-bottom:0.2em; display: inline-block; font-weight: bold;}
.dnews h2{font-size:16px; font-weight:normal; letter-spacing: 0.5em; margin:0;}
.dnews ul{margin:0; padding:0; list-style: none;}
.dnews ul li{display:block; border-bottom:1px solid #ccc;}
.dnews ul li a{display:block; color:#333; font-size:15px; padding:0.7em 0.3em; line-height:1.3em;}
.dnews ul li a:hover{color:#1b810f;}
.dnews .more{text-align: right; margin-top:2em;}
.dnews .more a{color:#20255f; text-decoration: underline; font-weight: bold;}
.dnews .more a:hover{color:#1b810f;}
.d2{background:#ecf0f1; text-align: center; line-height: 1.7em; padding:3em 0;  }
.d2 h2{color:#0f3c4b; font-size:240%; position:relative; display: inline-block; text-align: center; letter-spacing: 0.1em;}
.d2 h2::before{content:""; width:120%; height:1px; background:#333; display:block; left:-140%; top:50%; position:absolute;}
.dservice .list, .dservice .list a{padding:0;}
.d2 h2::after{content:""; width:120%; height:1px; background:#333; display:block; right:-140%; top:50%; position:absolute;}
.dservice .list, .dservice .list a{padding:0;}
.dservice .list figcaption{display:inline-block; width:10em; min-height:5em; padding:0.3em;  background:rgba(255,255,255,0.8); border:1px solid #666; color:#000; opacity:1; font-size:20px; border-radius:1em;}
.dabout{background:url(../images/dabout-bg.jpg) repeat-x right;}
.dabout .col-6{background: #ecf0f1; padding:6% 7%; position:relative; margin-left:-3%; line-height: 1.7em; }
.dabout .col-6 h2{margin:0; font-size:200%; color: #0f3c4b; margin-bottom:1em;}
.dabout .col-6 .btn{margin-top:1em;}
.dabout .col-6 .btn a{margin:1em; border-radius:0; background:#0f3c4b; color:#fff;}
.dabout .col-6 .btn a:hover{background:#333;}
/*service*/
.list.service a{border:1px solid #ccc; position:relative;}
.list.service a::before{content:""; width:100%; height:100%; background:#0f3c4b; position:absolute; display: block; left:0; top:0; z-index: 5; opacity:0; transform:scale(0); transition:.3s;}
.list.service a:hover::before{opacity:1; transform:scale(1);}
.list.service figure::before{display:none;}
.list.service figcaption{width:90%;}
.list.service figcaption h3.sub2{font-size:140%; position:relative; line-height: 1.6em; font-weight:normal;}
.list.service figcaption h3.sub2::after{content:""; position:absolute; width:5em; height:1px; display: block; bottom:0; left:50%; transform:translateX(-50%); background:#ccc;}
.list.service h3.subject{padding:1em 0;}

/*news*/
.list.news .path{text-align:left;}
.list.news a.frm{box-shadow:0 0 10px rgba(0,0,0,0.3);}
.list.news section{padding-left:1em;}
.list.news h3.subject{color:#333;}
.list.news a.frm:hover h3.subject{color:#5e7c86;}
.list.news .innerhtml{font-size:14px; line-height:1.5em;}
.list.news a.frm:hover{box-shadow: 0 10px 20px rgba(0,0,0,0.3); } 
.list.news a.frm:hover .innerhtml{color:#333;}
/*way*/
.way .list{padding:0.5em; position:relative;}
.way .list::after{content:""; width:10px; height:10px; display:block; position:absolute; top:50%; right:0; background:linear-gradient(45deg,rgba(255,255,255,0) 50%,#ccc 50%); transform:rotate(45deg);}
.way .list:nth-last-of-type(1)::after{display:none;}
.way .list .frm{border-radius:1em; border:3px solid #ccc; text-align: left; overflow: hidden; min-height:4em;}
.way .list section{padding:0.5em;}
/*footer*/
#footer{font-size:13px; color:#fff; background:#0f3c4b; word-break: break-all; line-height:200%; padding-top:1em; padding-bottom:0; margin-bottom:0;}
#footer .rr{text-align:right; color:#efefef;}

@media screen and (max-width:1279px){/*desktop*/
	
	.page{padding:0 3%;}
	.dservice .list figcaption{width:6em;}
	
}
@media screen and (max-width:960px){/*desktop-small pad*/
	.nav{transform:translateY(-90%);}
	.nav ul li a{padding-left:0.3em; padding-right:0.3em; font-size:13px;}
	.logo{padding-left:1%;}
	/*dnews*/
	.dnews h2{letter-spacing: 3px;}
	/*dabout*/
	.dabout .col-6{background:rgba(236,240,241,0.8); margin:0;}
	
	.dabout .page{padding:0;}
	#footer .rr{padding-left:1em;}
}
@media screen and (max-width:767px){/*phone*/
	#header{box-shadow:0 5px 10px rgba(0,0,0,0.3);}
	#defaultimg .mask{position:static; overflow: hidden; padding:0 1em;}
	.nav{position:static; transform:translateY(0);}
	.nav ul li a{color:#ccc; padding:0.5em;}
	.nav ul li a::after{display:none;}
	.nav ul li{ border-bottom:1px solid #666;}
	.nav .righticon{display:block; padding-left:0; text-align:center; background:#fff;}
	.nav ul .righticon li{display:inline-block; border-bottom:none; width:auto;}
	.nav ul .righticon li a{color:#666; padding:.3em;}
	.nav ul .righticon li a:hover{color:#5e7c86; background:none;}
	.page{padding:0 3%;}
	
	/*dnews*/
	.dnews{padding:2em 0;}
	.dnews h2{font-size:90%;}
	.dabout .col-6 .btn{margin-top:0.3em;}
	.dabout .col-6 .btn a{margin:0.3em 1em; border-radius:0; background:#0f3c4b; color:#fff; padding:0.5em;}
	.d2{overflow:hidden;}
	.list.news section{padding:0 0 0 0;}
	/*way*/
	.way .list::after{content:""; width:10px; height:10px; display:block; position:absolute; top:90%; right:50%; background:linear-gradient(45deg,rgba(255,255,255,0) 50%,#ccc 50%); transform:rotate(135deg);}
	/*footer*/
	#footer, #footer .rr{text-align:center;}
	#footer .ll{padding:1em 1em 1em 1em;}
	#footer .rr{padding-left:0em;}
}