@charset "utf-8";
/* CSS Document */
.side, .main{padding:1em;}
.innerhtml{line-height:200%;}
.content{padding:3em 0;}
/*nav*/
.nav ul li a{color:#fff; font-size:18px;    padding: 2em 1em 0px 1em;}
.nav ul li a:hover{color: #e2c654; border-radius: 0.3em 0.3em 0 0;}
.nav ul li a.icon{padding-left:0.3em; padding-right:0.3em;}
#header{padding:10px 0; transition:.3s; background:#424851;}
#header .page{padding:0;}
#header.show{background:linear-gradient(rgba(66,72,81,0.8) 60%,rgba(255,255,255,0)); padding-top:0;}
.logo img{filter:drop-shadow(0 0 5px rgba(255,255,255,0.4));}
.nav ul li a.hit{background:#006699; color: #fff; border-radius: 0.3em 0.3em 0 0;}
.nav ul li a.icon {padding-left: 0.2em; padding-right: 0.2em; vertical-align: middle;}
/*default use*/


.darea,.dnews, .dpro, .drecommend{padding:4em 0;}
.dvideo{position:relative;}
.dvideo::after{content:""; right:-50%; top:0; width:50%; height:100%; background:linear-gradient(#f2edd7,#f2edd7); display:block; position:absolute; z-index: -1;}
.dnews{padding:2em;}
.dnews .tit{font-size:200%; color:#6f3c4c; font-weight: normal; line-height:1.5em; margin-bottom:0.5em;margin: 0;}
.dnews .tit span{font-size:45%; color:#e2c654; font-weight:normal; display:block; border-bottom:3px solid #ccc8b6; line-height: 1.3em;}
.dnews .list{padding: 3px 0;}
.dnews .list a{box-shadow:none; background:none; padding:0.4em 0; border-bottom:1px dotted #999;}
.dnews .list a:hover{box-shadow:none;}
.dnews .list a:hover h3.subject{color:#663300;}
.dnews .list .path{font-size: 14px;padding: 0;color: #999;text-align: left;}
.dnews .list div{padding: 0;min-height: 0;}
.dnews .list h3.subject{font-size:16px; color:#666; transition:.3s;}
.drecommend{padding-bottom:1em;}
.drecommend h4.d-tit::before{display: none;}
.drecommend h4.d-tit{text-align: left;color: #424851;}
.drecommend .list section{padding:1em; display:block;}
.drecommend .list .innerhtml{font-size:80%;}
.drecommend .list h3.subject{font-size:110%; padding:0.5em 0;color: #000;min-height: 3.6em;}
.drecommend .list p.more{text-align:center;    margin: 4em 0 0 0;}
.drecommend .list p.more span{display:inline-block; padding:0.3em 2em; border-radius:1em; border:1px solid #af0e02; color:#af0e02;}
.d-area2 .list a{padding: 0;    box-shadow: 0 0 0px rgba(0,0,0,0.2);}
.d-area2 .list a:hover{box-shadow: 0 0 0px rgba(0,0,0,0.2);}
.d-area2 .list h3{font-size: 14px;font-weight: bold;text-align: center;color: #000;}
.d-area2 .list figure{box-shadow: 0px 2px 6px rgba(0,0,0,0.4);}
.d-area3{background: url(images/image-06.jpg) no-repeat top center; background-size: cover;}
.d-area3 .col-6{padding:5em 1em;}
.d-area3 .col-6.right{color: #fff;line-height: 250%;}
.d-area3 .col-6.right .col-12{text-align: right;    margin-top: 1em;}
.d-area3 .col-6.right a{color: #fff;border: 1px solid #fff;padding: 0.7em 2em;}
.d-area3 .col-6.right a:hover{color: #e2c654; }
.d-area3 h4.d-tit{text-align: right;margin: 0;margin: 11px 0;}
.d-area3 h4.d-tit::before{display: none;}
.d-area3 p{margin: 0;    letter-spacing: 1px;}

/*content*/
.sidetit {font-weight: normal;color: #424851;padding: 0.5em 0.3em;font-size: 180%; margin: 0;}
.sideline{background: linear-gradient(90deg,#e2c654 40%,#ccc 40%);height: 1px;}
.subnav ul li a.hit::before {background: rgba(226,198,84,1);}
.subnav ul li a::after {content: ""; display: inline-block; width: 12px;height: 12px;position: absolute; top: 50%; right: 2em; background: linear-gradient(45deg,rgba(0,0,0,0) 50%,#666 50%);transform: rotate(45deg) translateY(-50%);transition: .3s;opacity: 0;}
.subnav ul li a{position:relative;}
.subnav ul li a:hover{background:#666; color:#fff;}
.subnav ul li a:hover::before {background: rgba(226,198,84,1);}
.subnav ul li a:hover::after{background:linear-gradient(45deg,rgba(0,0,0,0) 50%,rgba(226,198,84) 50%); right:1em; opacity:1;}
.subnav ul li a::after{content:""; display:inline-block; width:12px; height:12px; position:absolute; top:50%; right:2em; background:linear-gradient(45deg,rgba(0,0,0,0) 50%,#666 50%); transform:rotate(45deg) translateY(-50%); transition:.3s; opacity:0;}
.subnav ul li a::before{content:""; display:inline-block; width:3px; height:1em; background:#ccc; position:absolute; left:0.3em; top:50%; transform:translateY(-50%);}
h1.subject{font-size:24px; border-bottom:1px solid #ccc; padding:0.3em 0;}
.subnav ul li ul li a::before{opacity:0;}
.path{text-align:right; font-size:14px;}
h1.subject{font-size:24px;}
h4.d-tit{color: #e2c654;font-size: 40px;font-weight: normal;text-align: center;position: relative;line-height: 80%;}
h4.d-tit::before {content: "";position: absolute;display: block;width: 100%;height: 5px;top: 27%;left: 0; background: linear-gradient(90deg, #424851 40%,rgba(0,0,0,0) 40%,rgba(0,0,0,0) 60% ,#424851 60%);}
h4.d-tit span{font-size: 14px;color: #999;}
.more{text-align: center;margin: 4em 0;}
.more a{background: #424851;color: #fff;font-size: 18px;padding: 1.5em 6em;}
.more a:hover{background: #000;color: #e2c654; }
.content { background: #fff;}
.bannerimg { position: fixed; top: 0;left: 0;width: 100vw;height: 100vh; z-index: -1;}
#defaultimg.banner {height: 45vh;background: linear-gradient(rgba(0,0,0,0) 90%,rgba(0,0,0,0.5));position: relative;}
#defaultimg.banner h4 {text-align: center;font-size: 280%;color: #fff; font-weight: normal; position: absolute;display: block;left: 50%;top: 40%; line-height: 160%; border: 1px solid #fff;transform: translate(-50%,-50%); font-family: 'Lora', serif;text-shadow: 0 0 10px rgba(0,0,0,0.8);letter-spacing: 3px;padding: 0 0.3em;background: rgba(0,0,0,0.3);}
#defaultimg.banner h4 span {font-size: 16px;display: block;text-align: center;}

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

.list h3{font-weight:normal; margin:0; color:#226EB5;}
.list a{width:100%; diaplay:block; float:left; color:#666; background:#fff; box-shadow: 0 0 10px rgba(0,0,0,0.2); padding:10px;}
.list a:hover{color:#014283; box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
.list figure img{transition:.3s;}
.list a:hover img{transform:scale(1.05, 1.05);transition:.3s;}
.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(1,66,131,0.6); z-index: 100; font-size: 14px; padding-top:30%; opacity:0; transition:.3s;}
.list div{padding:1em; 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 figcaption span{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
/*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*/
.list.propic{padding: 0.5em;}
.list.propic a{border:1px solid #ccc; background:#fff; overflow:hidden; line-height: 0;padding: 0;}
.prodetail .col-6 .list.propic img{border: 3px solid #fff;}
.prodetail h1.subject{font-size:22px; margin-top:0; color:#226EB5;}
.prodetail .col-6, .prodetail .col-12{padding:0 1em;}
.prodetail .col-6 img{border:10px solid #fff; filter: drop-shadow(0 -7px 5px rgba(0,0,0,0.1));}
.prodetail h4.subtit{margin-bottom:0.5em; color:#999; border-bottom:1px solid #ccc;}
.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{font-size:14px; color:#000; background:#ececec; word-break: break-all; line-height: 1.5em; padding:2em 0 1em 0;}
#footer h4{font-size:18px;font-weight: normal;margin: 0;}
#footer .ft-right{text-align: right;}
#footer .ft-right img{margin: 0 0.5em;}
.copyright{background: #424851;color: #999; text-align: center;font-size:13px;padding: 5px 0;}

.iconlist{position: absolute;right: 1%;top:400px;z-index: 500;}
a.call{background: #424851;display: block;text-align: center;background: #424851;display: block;text-align: center;padding: 9px 2px 4px 2px;border-radius: 99em;margin-bottom: 4px;}


/*ani*/
.ani7{opacity:0; transition:1s; transform:scale(0.8,0.8); transition-timing-function: ease;}
.ani7.zoomintype{opacity:1; transform:scale(1,1);}

@media screen and (max-width:1280px){/*desktop*/
	.logo{padding-top:0.5em;}
	.page{padding:0 3%;}
	#defaultimg.banner{height: 38vh;}
	.dnews .tit{font-size: 160%;}
	.dnews .list h3.subject{ font-size: 12px;}
}
@media screen and (max-width:960px){/*desktop-small pad*/
	.nav ul li a{padding-left:0.3em; padding-right:0.3em;}
	#defaultimg.banner{height: 31vh;}
	.darea, .dnews, .dpro, .drecommend {padding: 4em 0 2em 0;}
	h4.d-tit{margin: 0 0 0.5em 0;}
	.dvideo::after{content:"";width:0%; height:0%;}
	
}
@media screen and (max-width:767px){/*phone*/
	#header{background:rgba(66,72,81,0.8);padding:0; }
	.nav ul li a{color:#ccc;padding: 0.5em;}
	.nav ul li{ border-bottom:1px solid #666;}
	.page{padding:0 3%;}
	h4.d-tit::before {background: linear-gradient(90deg, #424851 26%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 75% ,#424851 15%);}
	#defaultimg.banner {height: 21vh;}
	#defaultimg.banner h4 span {display: none;}
	#defaultimg.banner h4{font-size: 140%;top: 50%;}
	.dnews{padding:1em 0;}
	h4.d-tit {font-size: 35px;}
	.d-area3 .col-6 {padding: 1em;}
	.d-area3{padding: 2em 0;}
	.d-area3 h4.d-tit{text-align: left;}
	.drecommend h4.d-tit {text-align: center;}
	
}