@font-face {
	font-family: 'Finder';
	src: url('Finder.ttf');
}

body{
	padding:0;
	margin:0;
	min-width:1200px;
	color:#45494E;
	font-family:"Open Sans", Helvetica, Arial, sans-serif;
}
a{
	color:#40414E;
}
#head-line, #bottom-line{
	color:#fff;
	background:#93cbf8;
	width:100%;
	
	padding:3px 0px;
	font-size:12px;
	text-align:left;
}
#top-line{
	height:30px;background:url('../img/bg-line.png') repeat-x;width:100%;background-size:auto 30px;
	-webkit-mask-image:-webkit-gradient(linear, left top, left bottom,from(rgba(64, 92, 177, 1)), to(rgba(64,92,177,0)))
}

#bottom-line{
	background:#16396e;
}

#head-line a,  #bottom-line a{
	color:#fff;
	margin-left:12px;
	text-decoration:none;
	border-bottom:1px dotted #fff;
}
#head-line a:hover,  #bottom-line a:hover{
	border-bottom:0px;
}
#logo{
	float:left;
	width:360px;
	padding:12px 0;
	cursor:pointer;
}
#logo img{
	float:left;
	margin-right:12px;
	margin-top:6px;
}
#logo div{
	display:block;
	float:left;
	font-size:50px;
	font-weight:bold;
	width:205px;
	line-height:1;
	padding:16px;
	letter-spacing:2px;
	text-align:center;
}
#logo div span{
	display:block;
	
	font-size:12px;
	letter-spacing: 0px;
}
#head-menu{
	position:relative;
	margin-top:20px;
	float:left;
	width:calc(100%-340px);
	z-index:1000;
}
#head-menu li{
	list-style:none;
	float:left;
	font-size:14px;
	text-transform:uppercase;
	padding:7px;
	margin:7px;
	border-radius:2px;
}

#head-menu li a{
	text-decoration:none;
}
#head-menu li a:hover{
	color:#fff;
}

#head-menu .active-menu a{
	color:#fff;
}
#head-menu li:hover{
	background:#00569c;
	
	color:#fff;
	
}
menu{
	position:relative;
}
menu menu{
	display:none;
	position:absolute;
	background:#00569c;
	
	color:#fff;
	
	width:210px;
	margin-top:2px;
	margin-left:-7px;
	border-radius:2px;
	padding:0;
}
menu menu li{
	float:normal;
	display:block;
	width:100%;
	padding:0!important;
	border-bottom:1px solid #ccc;
	margin:0!important;
	
	font-size:13px!important;
}
menu menu li a{
	display:block;
	padding:7px 14px!important;
	color:#fff;
}

menu menu li a:hover{
	background:#16396e;
	color:#fff;
}
.footer{
	width:100%;
	height:264px;
	background:#f0dab5;
	color:#000!important;
}
.footer a{
	color:#000!important;
}
.content{
	
	margin:0 auto;
	max-width:1200px;
	width:100%;
	height:100%;
	
}
.line{
	border-top: 1px solid #aaa;
	border-bottom:1px solid #aaa;

	background:#ececec; 
	padding-bottom:40px;
}
.article{
	margin-top:40px;
	text-align:justify;
	padding:12px;
}
.article h1{
	color:#16396e;
	text-align:left;
}
.article h2{
	margin-top:40px;
	margin-bottom:40px;
	text-align:center;
	color:#16396e;
}
.article p{
	line-height:1.4;
}
.flex{
	display:flex;
	width:100%;
	align-items: flex-start;
	 justify-content: flex-start;
	
}
.flex div{
	 flex-grow:1;
	 width:45%;
	 margin:0 2%;
}

.flex-3 div{
	 flex-grow:1;
	 width:28%;
	 margin:0 2%;
	 text-align:left;
}
.flex-2,.flex-3,.flex-4{
	display:flex;
	width:100%;
	align-items: flex-start;
	 flex-wrap: wrap;
	 justify-content: flex-start;
}
.flex-2 a{
	text-align:left;
	width:45%;
	margin:1%
}
.flex-3 div{
	
	width:28%;
	margin:1%
}
.flex-4 div{
	width:23%;
	margin:1%
}
#head{
	width:100%;
	height:112px;
}
#head #logo img{
	height:85px; 
}
.dynamic-ancor a{
	text-decoration:none; 
	display: inline-block; 
	line-height: 1.2; 
	color:#402737;
}
.dynamic-ancor a:after {
		display: block; 
		content: ""; 
		height: 0.75px; 
		width: 0%; 
		background-color: #402737; 
		transition: width 0.2s ease-in-out; 
}
.dynamic-ancor a:hover:after,
.dynamic-ancor a:focus:after {
	width: 100%;
}
.dynamic-ancor a:hover{
	color:#402737;
} 

#gallery {
	width:100%;
	height:580px;
	position:relative;

}
#gallery div{
	width:100%;
	height:100%;
	position:absolute;
	display:none;
	
	
	background-size: cover!important;
		background-position: center!important;	background-repeat:no-repeat;
}
#gallery div h1{
	display: inline;
	line-height:32px;
	background-color: #FFFFFF;
	box-shadow: -4px 0 0 #007bff, 4px 0 0 #007bff;
	padding: 10px 20px;
	color: #16396e;
	font-size: 32px;
	opacity:0.85;
	float:right;
	margin-top:120px;
}
#gallery .visible{	
	opacity:1;
	display:block;
	
	z-index:100;
}
#manage{
	display: flex;
	position:absolute;
	
	padding:12px;
	width:auto;
	background:#fff;
	opacity:0.75;
	margin-top:-60px;
	z-index:200;
	border-radius:8px;
}
#manage div{
		float:left;
		
}
#play{
	margin-right:20px;
	font-weight:bold;
	cursor:pointer;
	text-align:center;
	width:30px;
}
.itemList {
	text-align:center;
}
.itemList span{
		margin:0 4px;
		cursor:pointer;
		font-size:12px;
		color:#45494E;
}

.service-item{
	
	width:30%;
	margin:2% 1%;
	height:210px;
	overflow:hidden;
	
	position:relative;
	cursor:pointer;
	background-repeat:no-repeat!important;
	background-position: center!important;
	background-size: 100% auto!important;
	border-radius: 40px;
}

.service-item h1{
	text-align:center;
	font-size:18px;
	font-family:'Graphik';
	display:block;
	position:absolute;
	bottom:20px;
	width:100%;
	background:#fff;
	opacity:0.7;
	z-index:100;
	text-transform:uppercase;
	padding:8px 0;
}
.service-item img{
	
	width:100%;
	height:100%;
	top:0;
	position:absolute;
}

.service-all{
	font-size:18px;
	text-align:left;
}
.service-group{
	text-decoration: none;
    display: inline-block;
    line-height: 1.2;
	color:#40414E;
}
.service-group:after{
	display: block;
    content: "";
    height: 0.75px;
    width: 0%;
    background-color: #402737;
}
.service-group,.service-all a span{
	font-size:24px;
	color:#007bff;
	
}
.service-group:before,.service-all a:before{
	content: "\00BB\00a0"; 
	font-size:36px;
	color:#40414E;
}

.product-all{
	text-align:center;
}

.service-all ul{
	list-style: none;
	margin:0;
	padding:0;
}
.service-all ul > li{
    padding-left: 20px;
    position: relative;
    margin: 10px;
}
.service-all ul > li:before{
    content: '✔';
    position: absolute; top: -4px; left: 0;
    color: #16396e;
}

.product-all img{
	height:180px;
}

.product-all a{ 
	text-align:center;
	color:#007bff;
}
.light-line{
	background:#fbf5e3;
	width:100%;
	height:auto;
	margin-top:4px;
	padding-top:40px;
	padding-bottom:80px;
}
.light-line .content{
	background:#fbf5e3;
	margin-top:0;
	margin-bottom:0;
	
}
.light-line h1{
	margin-top:0;
}
.footer{
	width:100%;
	height:264px;
	background:#93cbf8;
	padding-top:40px;
}
.footer .circle{
	position:static;
}
.fixed{
	display:none;
	position:fixed;
	top:0;
	left:0;
	z-index:1001;
	box-shadow: 0 4px 4px rgba(0, 0, 0, .25);
}
.contact-footer, .worktime{
	margin-top:80px;
}
.contact-footer a{
	color:#000;
}
#send_phone{
	cursor:pointer;
}
#errorPhone{
	font-size:14px;
}
#phoneForm, #queryForm{
	display:none;
	position:fixed;
	width:320px;
	height:auto;
	padding:20px;
	border-radius:20px;
	background:#fff;
	top:40px;
	left:50%;
	margin-left:-180px;
	z-index:1001;
}
#phoneForm input, #queryForm input{
	box-sizing: border-box;
	width:100%;
	margin:4px 0;
	padding:4px 12px; 
	font-size:18px;
}
#form_msg_1  div span{
	display:block;
	width:0%;
	margin-top:12px;
	
}
#form_msg_1 div{
	display:flex;
	align-items: stretch;
    text-align: center;
    justify-content: center;
}
#grPhoneNumMain_1{
	float:left!important;
	width:90
}
#approval_pdn{
	width:20px!important;
	float:left;
}
small{
	font-size:11px;
}
small a{
	margin-left:12px; 
}
#errorPhone_1{
	font-style:italic;
	text-align:center!important;
}
#record{
	cursor:pointer;
	
}
#back{
	position:fixed;
	background:#000;
	opacity:0;
	display:none;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:1000;
}
#queryBtn{
	position:fixed;
	bottom:8px;
	right:12px;
	font-size:22px;
	padding-top:8px;
	padding-bottom:22px;
	color:#fff;
	
	width:50px;
	height:20px;
	border-radius:50px;
	background:#007bff url("../img/phone.png") center center no-repeat;
	
	background-size:30px 30px;
	border:2px solid #16396e; 
	cursor:pointer;
	z-index:1001;
	-webkit-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	opacity:0.75;
	
	text-align:center;
}
#queryBtn:hover{
	opacity:1;
}
#topBtn{
	position:fixed;
	bottom:68px;
	height:40px;
	width:50px;
	background:#007bff url("../img/top.png") center center no-repeat;
	background-size:30px 30px;
	cursor:pointer;
	display:none;
	
	font-size:28px;

	
	padding-top:7px;
	padding-bottom:2px;

	
	
	right:12px;
	
	
	color:#fff;
	
	
	
	border-radius:40px;
	
	border:2px solid #16396e;
	cursor:pointer;
	z-index:1001;
	-webkit-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	opacity:0.75;
	text-align:center!important;
}

#topBtn:hover{
	opacity:1;
}

.btn{
	display:block;
	width:100%;
	border-top:1px solid #999;
	text-transform:uppercase;
	text-align:center;
	margin:48px 0;
	padding:16px 0;
	border-bottom:1px solid #999;
	cursor:pointer;
	font-size:24px;
}

.btn:hover, .btn-min:hover{
	background: #f1e2c3;
	transition: background 0.4s ease;
}
.btn-min{
	display:block;
	width:280px;
	border:1px solid #999;
	text-transform:uppercase;
	text-align:center;
	margin:48px 0;
	padding:16px 0;
	cursor:pointer;
	font-size:24px;
} 
.importantText{
	
	font-size:18px;
	text-align:justify;
	margin-bottom:24px;
}
.contact-list{
	text-align:center;
}
.contact-list p{
	text-transform:uppercase;
	font-size:20px;
}
.contact-list a{
	text-decoration:none;
	margin:0 auto;
	color:#999;
}
.contact-list .btn-min{
	background:#ccc;
	padding:8px 0;
	font-size:16px;
	color:#333;
}
.contact-list .btn-min:hover{
	background:#333;
	color:#fff;
}
.contact-footer, .worktime{
	margin-top:80px;
	width:100%;
}
.contact-footer a{
	color:#000;
}

.footer .flex-3 div div{
		width:100%;
		
}
.circle{
	position:static;
	top:-30px;
	left:calc(50% - 112px);
	margin:18px auto;
	width: 224px!important;
	  height: 224px;
	  -webkit-border-radius: 112px;
	  -moz-border-radius: 112px;
	  border-radius: 112px;
	  background: #fff;
	  z-index:1000;
	 
	  cursor:pointer;
	  text-align:center!important;
}
#menu-mob{
	display:none;
	position:fixed;
	
	right:12px;
	
	
	color:#fff;
	
	width:51px;
	
	border-radius:40px;
	background:#007bff;
	border:2px solid #16396e;
	cursor:pointer;
	z-index:1001;
	-webkit-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	-moz-box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	box-shadow: 0px 4px 8px 0px rgba(34, 60, 80, 0.2);
	opacity:0.75;
	text-align:center!important;
}
#menu-mob{
	font-size:24px;
	bottom:12px;
	height:34px;
	padding-top:8px;
	padding-bottom:9px;
}	

#closeMenu{
	display:none;
	position:fixed;
	top:18px;
	right:18px;
	font-size:30px;
	font-weight:bold;
	
}
#cookies-info{
	display:none;
	position:fixed;
}
@media screen and (max-width: 480px) {
	
	body{
		width:100%;
		min-width:360px;
	}
	h1{
		font-size:24px;
		text-align:center;
	}
	
	#logo{
			width:100%;
			text-align:center;
			display:flex;
			justify-content: center;
			margin-left:-20px;
	}
	#logo img{
		width:92px;
		height:86px;
		margin-left:12px;
	}
	#logo div{
		
		line-height:1;
		padding:0;
		text-align:center;
		padding-top:12px;
	}
	#logo div span{
		float:none;
		
		line-height:16px;
		
		padding:0;
		text-align:center;
	}
	#gallery{
		min-width:360px;
		height:380px;
		
	}
	#gallery div{
		background-size: cover!important;
		background-position: center!important;
	}
	#gallery div h1{
		
		width:100%;
		padding: 10px 0;
		font-size:14px;
		line-height:1.1;
		box-shadow:none;
		margin-top:260px;
	}
	.flex div{
		
		width:100%;
	}
	
	.footer{
		height:auto;
		padding-bottom:36px;
	}
	.footer div{
		text-align:center;
	}
	
	.circle{
		
		margin: 0 auto!important;
	}
	.contact-footer,.worktime{
		margin-top:16px;
	}
	.light-line{
		padding-top:20px;
		padding-bottom:20px;
	}
	.article{
		margin-top:20px;
	}
	.article h1{
		text-transform:uppercase;
	}
	.article div, .article img{
		width:100%!important;
		height:auto;
		
	}
	#head-line, #head-menu{
		display:none;
	}
	#menu-mob{
			display:block;
	}
	#queryBtn{
		bottom:72px;
	}
	#topBtn{
		bottom:130px;
	}
	.gallery{
		min-width:360px;
		height:380px;
		
	}
	.gallery img{
		min-height:380px;
	}
	.flex-3 div, .flex-4 div, .flex-2 a, .flex-3 a {
		width:100%;
	}
	.flex-4 a{
		width:44%;
		margin:3%;
	}
	.flex{
		flex-grow:0;
		flex-wrap:wrap;
	}
	#bottom-line{
		font-size:10px;
		text-align:center;
	}
	#hello{
		display:none;
	}
	#phoneForm{
		width:calc(96%-36px)!important;
		left:2%;
		margin-left:0%;
		padding:18px;
	}
	#phoneForm, #queryForm{
			top:initial;
			bottom:80px;
			z-index:10000;
			width:calc(96%-36px)!important;
			left:2%;
	}
	.article .product-all img{
		height:180px !important;
		width:auto!important;
	}
	
	#head-menu{
		width:100%;
		height:100%;
		background:#fff;
		position:fixed;
		z-index:10100;	
		overflow-y: auto;
		overflow-x: hidden;
	}
	#closeMenu{
		display:block;
		
		
	}
	#head .content{
		padding-bottom:40px;
		padding-top:0px;
	}
	#head-menu{
		margin-top:0;
		padding-top:20px;
	}
	#head-menu .content div a{
		display:block;
		width:100%;
		height:40px;
		text-align:center;
		background:#fff;
	}
	menu li{
		display:block;
		width:100%;
		margin-left:0!important;
		
		margin-bottom:16px!important;
	}
	
	menu menu{
		display:block;
		margin:0;
		padding:0;
		border:0;
		position:static;
		margin-top:16px;
	}
	menu menu li{
		padding:6px!important;
		margin-left:24px!important;
		margin-bottom:0px!important;
		font-size:14px!important;
		
		color:#45494E!important;
	}
	menu menu li a{
	
		color:#45494E!important;
	}
	menu menu li a:hover{
		background:#fff;
		color:#45494E;
	}
	#head-menu li:hover{
		background:#fff;
		color:#45494E;
	}
}