@charset "utf-8";
/* CSS Document */
.side, .main{padding:1em;}
.innerhtml{line-height:200%;}
.content{padding:3em 0;}
/*nav*/
.nav ul li a{color:#000; padding:2.5em 1em;}
.nav ul li a.show{padding:1.5em 1em;}
.nav ul li a:hover{background:#fd4c0b; color: #fff;}
.nav ul li a.icon{padding-left:0.3em; padding-right:0.3em;}
#header{transition:.3s; background:#fff; box-shadow: 0 0 10px rgba(0,0,0,0.3);}
#header .page{padding:0;}
/*#header .bar.show{height:7px;}*/
#header .logo{padding:1em 0; transition:.3s;}
#header .logo.show{padding:1em 1em 1em 0;}
.nav ul li a.hit{background:#006699; color: #fff; border-radius: 0.3em 0.3em 0 0; }
/*#header .bar{height:30px; background:#363636; box-shadow:0 3px 10px rgba(0,0,0,0.3); z-index:301; transition:.3s;}*/
/*default use*/
#defaultimg .page{padding:0; position:relative;}
#defaultimg .bar{position:absolute; top:0; left:0; width:30%; height:75vh; background:#fd3f04; color:#fff; text-align:center; z-index:201;}
#defaultimg .bar::before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:url(images/bar-bg.png) no-repeat center; background-size:contain; z-index:202;}
.dabout{padding:4em 0;}
.dabout .tit{font-size:300%; color:#363636; line-height:160%;}
.dabout .col-4{line-height:200%; padding-right:3em; padding-top:3vh;}
.dabout .leftimg{position:relative;}
.dabout .leftimg img{position:absolute; max-width:130%; height:auto; right:0%; bottom:0%; transform:translateY(25%);}
.dabout2{background:#ebebeb; color:#000;}
.dabout2 .tit{color:#ff0000; font-size:200%; margin-bottom:0;}
.dabout2 .col-8{line-height:200%; float:right; padding:2em 0 4em 0;}
.dabout2 .col-12{height:6vh;/* background:#363636;*/ }
.dabout2 .col-4{padding: 1em;}
.dnewpro{padding:4vh 0 6vh 0;}
.dnewpro .tit{text-align:right; font-size:400%; font-weight:normal; margin:0.5em;}
.dnewpro .tit span{font-size:40%; display:block;}
.dnewpro .list{padding:1.5em;}
.dnewpro .list a{border-radius:100%; border:1px solid #ccc; padding:0; overflow: hidden;}
/*content*/
.sidetit{font-weight:normal; color:#fff; background:linear-gradient(90deg,#333 70%,rgba(255,255,255,0)); padding:0.5em; margin:0 0 0.3em 0; border-radius:1em 0 0 1em; font-size:150%; letter-spacing: 2px;}

h1.subject{font-size:24px;}
.banner{background:#333;}
.banner .col-3{position:relative;}
.banner .col-3 img{position:absolute; bottom:0; left:0; max-width:100%; height:auto; transform:translateY(29%);}

/*list*/
.list{padding:1em;}

.list h3.subject{ margin:0; color:#666; text-align: center;}
.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 div{color:#333;}
.list a:hover p.more{color:#f00;}
.list a:hover figcaption{opacity:1;}
.list figure{diaplay:block; line-height:0; overflow: hidden; position:relative;}
.list figcaption{position:absolute; top:0; left:0; width:100%; height:100%; opacity:1; text-align: center; color:#fff; background:rgba(0,0,0,0.5); z-index: 100; font-size: 14px; padding-top:30%; opacity:0; transition:.3s;}
.list figcaption span{position:absolute; top:50%; left:0; text-align:center; width:100%; height:auto; transform:translateY(-50%);}
.list div{padding:0.3em; min-height: 3em; font-size:14px; color:#666; line-height: 160%;}
.list div p.more{text-align:right; margin:0; color:#666; font-size:12px;}
.list.news a{border:1px solid #ccc; background:#fff;}
.list.news a:hover{border:1px solid #fd4c0b; transform:translateY(-5px);}
/*gallery*/
.list.gallery a{padding:0; background:#fff;}
.list.gallery div{padding:0.3em 1em;}
.list.gallery h3.subject{color:#333;}
.list.gallery a:hover h3.subject{color:#f00;}
/*prodetail*/
.prodetail .list.propic{padding:5px;}
.prodetail .list.propic a{border:1px solid #ccc; background:#fff; overflow:hidden; line-height: 0; padding:0;}
.prodetail h1.subject{font-size:22px; margin-top:0; color:#226EB5;}
.prodetail .col-6, .prodetail .col-12{padding:0 1em;}
.prodetail .col-6 img{}
.prodetail h4.subtit{margin-bottom:0.5em; color:#999; border-bottom:1px solid #ccc; font-size:120%;}
.prodetail h4.subtit span{display:inline-block; padding:0.3em 1em; border-radius:0.5em 0.5em 0 0; border:1px solid #ccc; border-bottom:none; transform:translateY(2px); background:#fff;}
.prodetail .innerhtml img{border: 0;box-shadow: 0;}
.prodetail .innerhtml .left{background: #E5E0DD;padding: 1em;text-align: center;}
.prodetail .innerhtml .left p{text-align: center;color: #828282;font-family: Lato,"Helvetica Neue",Helvetica,Arial,sans-serif;}
.prodetail .innerhtml ul{list-style:none;padding: 0;}
.prodetail .innerhtml ul li{border-bottom: 1px solid #E5E0DD;padding: 1em;}
.prodetail .innerhtml ul li div{width: 50%;float: left;padding-right: 5px;}
.prodetail .innerhtml h4{width: 100%;height: auto;float: left;color: #666;font-weight: normal;font-size: 18px;padding-left: 0.5em;border-left: 5px solid #ccc;}

/*footer*/
#footer{color:#000; background:#ebebeb; line-height: 1.5em; padding:3em 0 0 0;}
#footer p{margin:0.5em; vertical-align: middle;}
#footer p img{vertical-align: middle;}
#footer ul{font-size:14px; color:#000;}
#footer .copyright{background:#fd4c0b; color:#fff; margin-top:2em;padding: 1em 0;}
#footer .copyright .col-3, #footer .qrcode{text-align:right; vertical-align: middle;}
.fixedbtn{position:fixed; right:1%; top:40vh; z-index: 300;}
.fixedbtn a{display:block; width:60px; height:60px; border-radius:100%; overflow: hidden; margin:3px; box-shadow: 0 0 4px rgba(0,0,0,0.5);}
.fixedbtn a img{max-width:100%; height:auto;}

@media screen and (max-width:1285px){/*desktop*/
	.logo{padding-top:0.5em;}
	.page{padding:0 3%;}
	.dabout .leftimg img{max-width:120%; transform:translateY(60%);} 
	.dabout2 .col-8{padding-top:4em;}
	.nav ul li a{ padding:2em 1em;}
	#defaultimg .bar{height:60vh;}
}
@media screen and (max-width:960px){/*desktop-small pad*/
	.nav ul li a{padding-left:0.3em; padding-right:0.3em;}
	.dabout, .dabout .tit{text-align:center;}
	.dabout .col-4{padding:0;}
	
	.dnewpro .tit{text-align:left;}
	.nav ul li a{font-size:14px; padding:1.7em 1em;}
	.sidetit span{display:none;}
}
@media screen and (max-width:767px){/*phone*/
	
	.nav ul li a{color:#ccc; padding:1em;}
	.nav ul li{ border-bottom:1px solid #666;}
	.page{padding:0 3%;}
	.dabout{padding:0;}
	
	.prodetail .col-6, .prodetail .col-12{padding:0;}
	#footer{text-align:center;}
	#footer ul li{text-align:left;}
	#footer .copyright .col-3, #footer .qrcode{text-align:center; vertical-align: middle;}
	.dabout2 .col-8 {padding-top: 0em;}
	#footer p{text-align: left;}
}