/*--------------copyright by alva start-------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video  {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.8;
	letter-spacing: 1px;
	font-size: 18px;
	color:#000;
	font-family: 'Baloo 2','Noto Sans TC', sans-serif;
	background:#fff;
}
ol,
ul {
	list-style: none;
}
blockquote,q {
	quotes: none;
}
blockquote:before,blockquote:after,q:before,q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
td {
	vertical-align: top;
}
a {
	display: block;
	color: #333;
	text-decoration: none;
}
a:hover,a:focus {
	text-decoration: none;
	color: #333;
}
.clear {
	clear: both;
}
img {
	max-width:100%;
}
::selection {
  background: #fd6;
}

/************************************************************************************************************************************************
************************************************************************************************************************************************
************************************************************************************************************************************************/
/*carousel-fade*/
.carousel-fade .carousel-inner .item {
	transition-property: opacity;
}
.carousel-fade .carousel-inner .item,  
.carousel-fade .carousel-inner .active.left,  
.carousel-fade .carousel-inner .active.right {
   opacity: 0;
}
.carousel-fade .carousel-inner .active,  
.carousel-fade .carousel-inner .next.left,  
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}
.carousel-fade .carousel-inner .next,  
.carousel-fade .carousel-inner .prev,  
.carousel-fade .carousel-inner .active.left,  
.carousel-fade .carousel-inner .active.right {
    left: 0;
    transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
    z-index: 2;
}
.carousel-inner>.item>img {
	display:inline-block;
}
/*---header---------------------------------------------------------------------------------------------------------------------------*/
header {
	position:relative;
	width:100%;
	height:100vh;
}
/***mask***/
.mask {
	display:inline-block;
	width:55%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	background:url(../../images/mask.png) center left no-repeat;
	background-size:cover;
	text-align:right;
}
.logo {
    display: block;
    text-align: center;
    position: relative;
    top: 40%;
    transform: translateY(-50%);
	overflow:hidden;
}
.logo img {
}
.logo h1 {
	opacity:.000001;
	color:#fff;
}
/***scroll***/
.scroll {
    position: absolute;
    bottom: 14em;
    right: 10em;
}
.line {
	width:1px;
	height:70px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
	.line:after {
		content:'';
		background:#05426f;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		animation:1.5s updown infinite ease-in-out;
	}
	@keyframes updown {
		0% {
			transform: translateY(-100%);
		}
		100% {
			transform: translateY(100%);
		}
	}
.scroll span {
	color:#05426f;
	display:block;
	font-style: italic;
    letter-spacing: 0px;
}
/***dex***/
.dex {
	position:absolute;
	top:0;
	right:0;
	width:60%;
	height:100%;
	z-index:-5;
}
.dex .item {
	height:100vh;
}
.dex .item:nth-of-type(1) {
	background:url(../../flash/dex1.jpg) top center no-repeat;
	background-size:cover;
}
.dex .item:nth-of-type(2) {
	background:url(../../flash/dex2.jpg) top center no-repeat;
	background-size:cover;
}
.dex .item:nth-of-type(3) {
	background:url(../../flash/dex3.jpg) top center no-repeat;
	background-size:cover;
}
.dex .item:nth-of-type(4) {
	background:url(../../flash/dex4.jpg) top center no-repeat;
	background-size:cover;
}
/*---navbar-----------------------------------------------------------------------------------------------------------------------------*/
/***mobile ibutton***/
.mibutton {
	z-index:65;
	cursor:pointer;
	width:45px;
	height:40px;
	color:#111111;
	position:fixed;
	right:1em;
	top:2em;
	text-align:center;
	display:none;
	transition:.3s ease all;
}
	.mibutton span {
		background:#000;
		width:100%;
		height:2px;
		position:absolute;
		left:0;
		top:0;
		transition:.3s;
	}
	.mibutton span:nth-child(2) {
		top:10px;
	}
	.mibutton span:nth-child(3) {
		top:20px;
	}
	.mibutton_ani {
		background:#fffff;
		opacity:1;
	}
	.mibutton_ani span:nth-child(1) {
		-webkit-transform: rotate(35deg);
		transform: rotate(35deg);
		-webkit-transform-origin: left center;
				transform-origin: left center;
	}
	.mibutton_ani span:nth-child(2) {
		opacity:0;
	}
	.mibutton_ani span:nth-child(3) {
		-webkit-transform:rotate(-35deg);
				transform:rotate(-35deg);
		-webkit-transform-origin:left center;
				transform-origin:left center;
	}
/*navbar*/
.navbar {
	border-radius:0;
	min-height:auto;
	margin:0;
	border:0;
	background:url(../../images/menulogo_bg.png) center left no-repeat,url(../../images/menu_deco.png) right bottom no-repeat,url(../../images/pattern1.png) repeat,#fff;
	background-size:contain;
	position: relative;
	top:0em;
	left:0;
	width:100%;
	z-index:60;
	box-shadow:0px 0px 10px rgba(0,0,0,.3);
	transition:.6s ease all;
	min-height:100px;
}
.navtop {
	position:fixed;
	top:0;
	left:0;
}
.intop {
	position:fixed;
	top:0;
	left:0;
}
.space {
	min-height:100px;
}
/***menulogo***/
.menulogo {
	display:inline-block;
	vertical-align:top;
	text-align:center;
	width:33%;
}
.menulogo a {
	position:relative;
	padding:1.2em 1em 1em 3em;
	z-index:3;
}
.menulogo img {
}
/*ibutton*/
.ibutton {
	display:inline-block;
	vertical-align:top;
	width: 950px;
    position: absolute;
    right: 7em;
    height: 100%;
    line-height: 0;
}
.ibutton ul {
}
.ibutton li {
	display:inline-block;
	vertical-align:bottom;
	width:16%;
	text-align:center;
	line-height:1;
}
.ibutton a {
	padding:.8em .5em;
	position:relative;
}
.ibutton p.ch {
	padding:.3em 0;
}
.ibutton p.en {
	font-size:16px;
}
/*under*/
.under {
	position:absolute;
	bottom:0;
	left:0;
	background:#fcc91a;
	width:16%;
	height:9px;
	transition:.6s ease all;
	opacity:0;
}
	/*hover*/
	.ibutton li:nth-of-type(1):hover ~ .under {
		left:0;
		opacity:1;
	}
	.ibutton li:nth-of-type(2):hover ~ .under {
		left:16%;
		opacity:1;
	}
	.ibutton li:nth-of-type(3):hover ~ .under {
		left:33%;
		opacity:1;
	}
	.ibutton li:nth-of-type(4):hover ~ .under {
		left:50%;
		opacity:1;
	}
	.ibutton li:nth-of-type(5):hover ~ .under {
		left:66%;
		opacity:1;
	}
	.ibutton li:nth-of-type(6):hover ~ .under {
		left:83%;
		opacity:1;
	}
	@media screen and (max-width:1635px) {
		.scroll {
			right:9em;
		}
		.menulogo {
			width: 39%;
			position:relative;
		}
			.menulogo:after {
				content:'';
				background: url(../../images/menulogo_bg.png) center right no-repeat;
				background-size: cover;
				position:absolute;
				top:0;
				left:0;
				width:100%;
				height:100%;
			}
		.navbar {
			background: url(../../images/menu_deco.png) right bottom no-repeat,url(../../images/pattern1.png) repeat,#fff;
			background-size: contain;
		}
		.ibutton {
			width:53%;
		}
	}
	@media screen and (max-width:1450px) {
		.scroll {
			right:8em;
		}
		.ibutton {
			right:4em;
		}
		.mask {
			width:60%;
		}
		.dex {
			width:53%;
		}
	}
	@media screen and (max-width:1300px) {
		.menulogo a {
			padding: 1.2em 1em 1em 0em;
		}
		.scroll {
			right:7em;
			bottom:27%;
		}
		.menulogo {
			width:34%;
		}
	}
	@media screen and (max-width:1200px) {
		.navbar {
			background:none;
			position:fixed;
			top:0;
			left:0;
			width:100%;
			min-height:auto;
		}
		.space {
			min-height:auto;
		}
		.menulogo {
			width: 100%;
			background:url(../../images/pattern1.png) repeat,#fff;
			text-align:left;
			box-shadow: 0px 0px 5px rgba(0,0,0,.3);
			z-index: 3;
		}
		.menulogo:after {
			content: '';
			background: url(../../images/menulogo_bg.png) center left no-repeat;
			background-size: auto;
		}
		.menulogo a {
			padding: 1.2em 1em 1em 8em;
			display:inline-block;
		}
		.mibutton {
			display:block;
		}
		.ibutton {
			position: relative;
			right: 0;
			top: 0;
			width: 100%;
			text-align: center;
			background:url(../../images/pattern1.png) repeat,#fff;
			display:none;
		}
		.ibutton ul {
			padding:1em;
		}
		.mask {
			background: url(../../images/mask.png) center right no-repeat;
			width:65%;
		}
		.scroll {
			right: 9em;
		}
		.dex {
			width: 55%;
		}
		.ibutton li:nth-of-type(1):hover ~ .under {
			left: 1em;
		}
		.ibutton li:nth-of-type(2):hover ~ .under {
			left: 18%;
		}
		.ibutton li:nth-of-type(3):hover ~ .under {
			left: 34%;
		}
		.ibutton li:nth-of-type(6):hover ~ .under {
			left: 81%;
		}
		.ibutton li:nth-of-type(3):hover ~ .under {
			left: 35%;
		}
	}
	@media screen and (max-width:900px) {
		.mask {
			background: url(../../images/mask_mob.jpg) top center no-repeat;
			background-size:cover;
			width: 100%;
			position:relative;
			height:100vh;
		}
		header {
			height:auto;
		}
		.scroll {
			right: 50%;
			transform: translateX(50%);
		}
		.line:after {
			background: #fcc919;
		}
		.scroll span {
			color:#fcc919;
		}
		.dex {
			width: 100%;
			position: relative;
			height: 600px;
		}
		.dex .item {
			height: 600px;
		}
		.dex .item:nth-of-type(1) {
			background:url(../../flash/dex1.jpg) center center no-repeat;
			background-size:cover;
		}
		.dex .item:nth-of-type(2) {
			background:url(../../flash/dex2.jpg) center center no-repeat;
			background-size:cover;
		}
		.dex .item:nth-of-type(3) {
			background:url(../../flash/dex3.jpg) center center no-repeat;
			background-size:cover;
		}
		.dex .item:nth-of-type(4) {
			background:url(../../flash/dex4.jpg) center center no-repeat;
			background-size:cover;
		}
	}
	@media screen and (max-width:768px) {
		.dex,.dex .item {
			height:550px;
		}
	}
	@media screen and (max-width:650px) {
		.menulogo a {
			padding: .7em 1em .7em 4em;
		}
		.menulogo:after {
			background-size:contain;
		}
		.mibutton {
			top:1.5em;
		}
		.ibutton li {
			width:30%;
		}
		.under {
			display:none;
		}
		.dex, .dex .item {
			height: 500px;
		}
	}
	@media screen and (max-width:530px) {
		.menulogo a {
			padding: .7em 1em .7em 4em;
			max-width: 75vw;
		}
		.logo img {
			max-width: 50vw;
		}
		.dex, .dex .item {
			height: 400px;
		}
	}
	@media screen and (max-width:430px) {
		.menulogo a {
			padding: .7em 1em .7em 4em;
			max-width: 80vw;
		}
		.menulogo:after {
			background-size: cover;
		}
		.mibutton {
			top: 1em;
			width: 40px;
		}
		.dex, .dex .item {
			height:350px;
		}
	}
	@media screen and (max-width:380px) {
		.menulogo a {
			padding: .7em 1em .5em 2em;
		}
		.ibutton li {
			width: 32%;
		}
		.logo img {
			max-width: 55vw;
		}
		.dex, .dex .item {
			height:300px;
		}
	}
	@media screen and (max-width:350px) {
		.menulogo a {
			padding: .7em 1em .5em 1em;
		}
		.logo {
			top:45%;
		}
		.scroll {
			bottom:1em;
		}
		.ibutton p.ch {
			font-size:16px;
		}
		.ibutton p.en {
			font-size: 15px;
		}
		.dex, .dex .item {
			height:250px;
		}
	}
/*---main----------------------------------------------------------------------------------------------------------------------------------*/
/***history***/
.history {
	background:url(../../images/history_bg.png) top center no-repeat fixed;
	background-size:cover;
	position:relative;
	text-align:center;
}
.wrap1 {
	width:1340px;
	margin:0 auto;
	max-width:90%;
}
/*triangle*/
.triangle {
	clip-path: polygon(50% 100%, 0 0, 100% 0);
	-webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
	background:url(../../images/pattern2.jpg) repeat;
	width:220px;
	margin:0 auto;
	height:164px;
}
/*title*/
.title {
	color:#132c80;
	padding:1em 0;
}
.title p {
	display:inline-block;
	vertical-align:middle;
}
	.title span {
		display:block;
		font-size:30px;
		background:#fcc91a;
		letter-spacing:2px;
		color:#000;
	}
	.title sub {
		font-size:48px;
		position:relative;
		line-height:1;
		bottom:0;
		display:block;
		letter-spacing:0;
	}
.title h5 {
	display:inline-block;
	vertical-align:middle;
	font-size:125px;
	font-style:italic;
}
/*history_text*/
.history_text {
	width:490px;
	margin:0 auto;
	max-width:90%;
	text-align:left;
}
/*company*/
ul.company {
	width:490px;
	margin:0 auto;
	max-width:100%;
	padding:2em 0;
}
ul.company li {
	display:inline-block;
	vertical-align:top;
	width:48%;
	padding:0 1em;
}
.lolly {
	width:20px;
	margin:0 auto;
	position:relative;
	min-height:48px;
}
	.lolly:before {
		content:'';
		width:16px;
		height:16px;
		border-radius:100%;
		background:#083484;
		position:absolute;
		top:0;
		left:calc(50% - 8px);
	}
	.lolly:after {
		content:'';
		width:1px;
		height:48px;
		background:#083484;
		position:absolute;
		top:0;
		left:50%;
	}
ul.company p {
	font-weight:700;
	font-size:28px;
	padding:.5em 0;
	line-height:1.3;
	letter-spacing:2px
}
ul.company strong {
	display:block;
	position:relative;
	font-size:18px;
	font-weight:normal;
	line-height:1;
}
/*year*/
.year {
	background:#fff;
	clip-path: circle(50% at 50% 50%);
	-webkit-clip-path: circle(50% at 50% 50%);
	width:175px;
	min-height:175px;
	color:#083484;
	margin:0 auto;
	max-width:100%;
}
.year sup {
	position:relative;
	top:0;
	line-height:1;
	letter-spacing:0;
	display:block;
	padding:3em 0 0 0;
}
.year b {
	font-size:60px;
	line-height:1;
	font-weight:normal;
}
/*three*/
.three { 
	font-size:30px;
	text-align:center;
	position:relative;
	letter-spacing: 3px;
    font-weight: 700;
}
	.three:before {
		content:'';
		background:#000;
		height:1px;
		width:35%;
		position:absolute;
		top:50%;
		left:0;
	}
	.three:after {
		content:'';
		background:#000;
		height:1px;
		width:35%;
		position:absolute;
		top:50%;
		right:0;
	}
/*state*/
ul.state {
	padding:3em 0 4em;
}
ul.state li {
	display:inline-block;
	vertical-align:top;
	position:relative;
	background:url(../../images/state_bg.png) center center no-repeat;
	background-size:contain;
	width: 30%;
    padding: 4em;
}
ul.state img {
	max-width: 65%;
}
ul.state p {
	color:#fff;
	font-size:24px;
	font-weight:700;
	letter-spacing:2px;
}
	@media screen and (max-width:1060px) {
		.three:before,.three:after {
			width:28%;
		}
		ul.state li {
			width: 31%;
			padding: 3em;
			margin:0 .2em;
		}
	}
	@media screen and (max-width:900px) {
		.history {
			background-attachment:inherit;
		}
	}
	@media screen and (max-width:780px) {
		.title sub {
			display:inline-block;
			font-size:44px;
			vertical-align: middle;
		}
		.title span {
			display:inline-block;
			font-size: 26px;
			padding: 0 .5em;
			vertical-align: middle;
		}
		.title h5 {
			display:block;
			font-size:16vmin;
		}
		.triangle {
			width: 180px;
			height: 130px;
		}
		ul.state li {
			width: 41%;
		}
		ul.state {
			padding: 2em 0;
		}
		.three:before, .three:after {
			width: 20%;
		}
	}
	@media screen and (max-width:580px) {
		.triangle {
			width: 155px;
			height: 100px;
		}
		.title h5 {
			line-height:1;
		}
		.title span {
			font-size:22px;
		}
		.title sub {
			font-size:36px;
		}
		ul.state li {
			width: 48%;
			padding:2em;
			margin:0;
		}
		ul.state p {
			font-size:20px;
		}
	}
	@media screen and (max-width:490px) {
		ul.company p {
			font-size:24px;
			white-space: nowrap;
		}
		ul.company strong {
			font-size:16px;
		}
		.three:before, .three:after {
			width: 13%;
		}
		ul.state li {
			background-size: 95%;
		}
		ul.state img {
			max-width: 50%;
		}
		ul.state {
			padding: 1em 0;
		}
	}
	@media screen and (max-width:490px) {
		.triangle {
			width: 130px;
			height: 90px;
		}
		ul.company li {
			padding:0 .5em;
		}
		ul.company p {
			font-size: 22px;
		}
		.year {
			width:160px;
			min-height:160px;
		}
		.year sup {
			font-size:16px;
		}
		.year b {
			font-size:50px;
		}
		.three {
			font-size:28px;
		}
		.three:before, .three:after {
			width: 10%;
		}
	}
	@media screen and (max-width:380px) {
		.triangle {
			width: 110px;
			height: 75px;
		}
		.title span {
			font-size: 20px;
		}
		.title sub {
			font-size: 32px;
		}
		ul.company p {
			font-size: 6vmin;
		}
		ul.company strong {
			font-size: 15px;
		}
		.year {
			width: 140px;
			min-height: 140px;
		}
		.year sup {
			font-size: 15px;
		}
		.year b {
			font-size: 44px;
		}
		.three:before, .three:after {
			width: 8%;
		}
		ul.state p {
			font-size: 18px;
		}
	}
	@media screen and (max-width:350px) {
		.title span {
			font-size: 22px;
		}
		.title sub {
			font-size: 35px;
		}
		ul.company strong {
			font-size: 14px;
		}
		.year {
			width: 120px;
			min-height: 120px;
		}
		.year sup {
			font-size: 14px;
			padding: 2.5em 0 0 0;
		}
		.year sup {
			font-size: 14px;
		}
		.three {
			font-size: 25px;
		}
		ul.state li {
			padding: 2em;
			width: 70%;
			margin: .5em 0;
		}
	}
/***state***/
.state {
	text-align:center;
	padding-bottom:1em;
}
.state .title {
	padding:2em 1em 1em;
}
/*state_list*/
.state_list {
	text-align:left;
	margin:1em 0;
}
/*state_text*/
.state_text {
	display:inline-block;
	width:40%;
	position:relative;
	text-align:center;
	background:url(../../images/pattern2.jpg) repeat;
	vertical-align:middle;
	min-height:450px;
}
	.state_text:before {
		content:'';
		background:url(../../images/pattern2.jpg) repeat;
		clip-path: circle(50% at 50% 50%);
		-webkit-clip-path: circle(50% at 50% 50%);
		width:450px;
		height:100%;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		right:-225px;
		box-shadow: inset -21px 0px 35px rgba(0,0,0,.3);
	}
.wrap2 {
	position: absolute;
    padding: 0em 2em 1em 2em;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
    width: 100%;
}
	.wrap2:before {
		content:'“';
		color:#fcc91a;
		font-size:100px;
		position:absolute;
		top:0em;
		left:1em;
		font-family:'Noto Sans TC', sans-serif;
		line-height:0;
	}
	.wrap2:after {
		content:'”';
		color:#fcc91a;
		font-size:100px;
		position:absolute;
		bottom:0em;
		right:0em;
		font-family:'Noto Sans TC', sans-serif;
		line-height:0;
	}
.state_text span {
	display:inline-block;
	line-height:1;
	font-size:24px;
	color:#fff;
	letter-spacing:7px;
}
.state_text sub {
	position:relative;
	display:block;
	line-height:1;
	color:#212121;
	bottom:0;
	background:#fcc91a;
	font-size:18px;
	letter-spacing:1px;
}
.state_text p {
	font-size:28px;
	color:#fff;
	letter-spacing:5px;
	padding-top:1em;
	line-height:1.5;
}
.state_text strong {
	font-size:34px;
	color:#fcc91a;
	font-style:italic;
}
/*state_list img*/
.state_list img {
	vertical-align:middle;
	padding: 1em 1em 1em 17em;
    width: 50%;
}
	/***/
	.state_list:nth-of-type(3) .state_text {
		float:right;
	}
	.state_list:nth-of-type(3) .state_text:before {
		left:-225px;
		right:inherit;
	}
	.state_list:nth-of-type(3) img {
		padding: 4em 13em 1em 6em;
	}
	.state_list:nth-of-type(3) .state_text:before {
		box-shadow: inset 21px 0px 35px rgba(0,0,0,.3);
	}
	.state_list:nth-of-type(3) .wrap2 {
		left:40%;
	}
	@media screen and (max-width:1530px) {
		.state_list img {
			padding: 1em 1em 1em 15em;
			width: 57%;
		}
		.state_list:nth-of-type(3) img {
			padding: 6em 13em 1em 4em;
		}
		.wrap2:before {
			left:0;
		}
		.wrap2 {
			left:60%;
		}
		.state_list:nth-of-type(3) .wrap2 {
			left:40%;
		}
	}
	@media screen and (max-width:1270px) {
		.state_text {
			min-height:400px;
		}
		.state_text:before {
			width:400px;
			right:-200px;
		}
		.state_list:nth-of-type(3) .state_text:before {
			left: -200px;
			right: inherit;
		}
		.state_list img {
			padding: 1em 1em 1em 12em;
		}
		.state_list:nth-of-type(3) img {
			padding: 6em 11em 1em 2em;
		}
	}
	@media screen and (max-width:1080px) {
		.state_text {
			width: 70%;
		}
		.state_list img,.state_list:nth-of-type(3) img {
			display: block;
			margin: 0 auto;
			padding: 2em 2em;
			width: auto;
			max-width: 80vw;
		}
		.state {
			padding-bottom: 0em;
		}
	}
	@media screen and (max-width:700px) {
		.state_text {
			min-height: 360px;
		}
		.state_text:before {
			width:360px;
			right:-180px;
		}
		.state_list:nth-of-type(3) .state_text:before {
			left: -180px;
			right: inherit;
		}
		.state_text {
			width: 70%;
		}
		.state_text p {
			font-size:25px;
		}
		.state_text strong {
			font-size: 30px;
		}
	}
	@media screen and (max-width:590px) {
		.state_text:before {
			width: 200px;
			clip-path: ellipse(45% 50% at 50% 50%);
			-webkit-clip-path: ellipse(45% 50% at 50% 50%);
			right: -100px;
		}
		.state_list:nth-of-type(3) .state_text:before {
			left: -100px;
			right: inherit;
			clip-path: ellipse(45% 50% at 50% 50);
			-webkit-clip-path: ellipse(45% 50% at 50% 50%);
		}
		.state_text {
			width: 80%;
		}
		.state_list img, .state_list:nth-of-type(3) img {
			max-width:100%;
		}
	}
	@media screen and (max-width:530px) {
		.state_text {
			width: 95%;
			border-radius: 0 60px 60px 0;
		}
		.state_text:before {
			display:none;
		}
		.state_list:nth-of-type(3) .state_text {
			border-radius: 60px 0px 0px 60px;
		}
		.wrap2,.state_list:nth-of-type(3) .wrap2 {
			left: 50%;
		}
		.state_list:nth-of-type(3) .wrap2 {
			left:50%;
		}
	}
	@media screen and (max-width:430px) {
		.wrap2 {
			padding:1em;
		}
		.wrap2:before,.wrap2:after {
			font-size:70px;
		}
		.wrap2:after {
			bottom:-20px;
		}
		.state_text p {
			font-size: 5vmin;
		}
		.state_text strong {
			font-size: 26px;
		}
		.state_text {
			min-height: 320px;
		}
		.state_list img, .state_list:nth-of-type(3) img {
			padding:2em 1em;
		}
	}
	@media screen and (max-width:380px) {
		.state_list img, .state_list:nth-of-type(3) img {
			padding: 1em 1em;
		}
	}
	@media screen and (max-width:350px) {
		.state_text p {
			font-size: 7vmin;
		}
	}
/*---service------------------------------------------------------------------------------------------------------------------------------*/
.service {
	background:url(../../images/pattern1.png) repeat,#eeeeee;
	text-align:center;
	padding:2em 0 5em;
}
.service .titile {
}
.service ul {
	width:1700px;
	margin:0 auto;
	max-width:95%;
}
.service li {
	display:inline-block;
	vertical-align:top;
	width:22%;
	padding:.5em;
	position:relative;
}
.service li:nth-of-type(1) a {
	background:url(../../images/service1.jpg) center center no-repeat;
	background-size:cover;
}
.service li:nth-of-type(2) a {
	background:url(../../images/service2.jpg) center center no-repeat;
	background-size:cover;
}
.service li:nth-of-type(3) a {
	background:url(../../images/service3.jpg) center center no-repeat;
	background-size:cover;
}
.service li:nth-of-type(4) a {
	background:url(../../images/service4.jpg) center center no-repeat;
	background-size:cover;
}
.service a {
	padding:12px;
	text-align:center;
	color:#fff;
	position:relative;
	min-height:255px;
	box-shadow: 0px 0px 8px rgba(0,0,0,.6);
}
.fullblock {
	box-shadow: 0px 0px 0px 2px white inset;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: scale(.9);
}
.service ul p {
	font-size:38px;
	letter-spacing:7px;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	left:0;
	width:100%;
	line-height:1.3;
	font-weight:700;
}
.service ul span {
	display:block;
	font-size:24px;
	letter-spacing:1px;
	font-weight:normal;
}
/****/
.full {
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}
.full:before, .full:after {
	content:'';
	position:absolute;
	border: 2px solid transparent;
	width: 0;
	height: 0;
}
.full::before {
  top: 0;
  left: 0;
}
.full::after {
  bottom: 0;
  right: 0;
}
.service a:hover .full {
  color: #fcc91a;
}
.service a:hover .full:before,.service a:hover .full:after {
  width: 100%;
  height: 100%;
}
.service a:hover .full:before {
  border-top-color: #fcc91a;
  border-right-color: #fcc91a;
  -webkit-transition: width 0.3s ease-out, height 0.3s ease-out 0.3s;
  transition: width 0.3s ease-out, height 0.3s ease-out 0.3s;
}
.service a:hover .full:after {
  border-bottom-color:#fcc91a;
  border-left-color:#fcc91a;
  -webkit-transition: border-color 0s ease-out 0.55s, width 0.3s ease-out 0.55s, height 0.3s ease-out 0.8s;
  transition: border-color 0s ease-out 0.55s, width 0.3s ease-out 0.55s, height 0.3s ease-out 0.8s;
}
.service a:hover .fluid {
  color:#fcc91a;
}
.fluid::after {
	content:'';
  top: 0;
  left: 0;
}
.service a:hover .fluid:before {
  border-top-color:#fcc91a;
  border-right-color:#fcc91a;
}
.service a:hover .fluid:after {
  border-bottom-color:#fcc91a;
  border-left-color:#fcc91a;
  -webkit-transition: height 0.3s ease-out, width 0.3s ease-out 0.3s;
  transition: height 0.3s ease-out, width 0.3s ease-out 0.3s;
}
	@media screen and (max-width:1420px) {
		.service li {
			width:24%;
		}
	}
	@media screen and (max-width:1200px) {
		.service ul p {
			font-size:32px;
		}
		.service ul span {
			font-size:20px;
		}
		.service li {
			width: 35%;
		}
	}
	@media screen and (max-width:900px) {
		.service li {
			width: 47%;
		}
	}
	@media screen and (max-width:600px) {
		.service li {
			width: 48%;
		}
		.service a {
			min-height:220px;
		}
		.service ul {
			max-width:100%;
		}
	}
	@media screen and (max-width:500px) {
		.service a {
			min-height:200px;
		}
	}
	@media screen and (max-width:430px) {
		.service li {
			width: 100%;
			padding: 0;
		}
		.service a {
			min-height:160px;
		}
	}
/***bar***/
.bar {
	height:68px;
	position:relative;
	color:#fff;
	font-style:italic;
	-webkit-filter: drop-shadow(3px 3px 3px rgba(51, 51, 51, .2));
	filter: drop-shadow(3px 3px 3px rgba(51, 51, 51, .2));
    z-index: 3;
}
/*color*/
.blue {
	background:#132c80;
}
.dpblue {
	background:#091848;
}
.yellow {
	background:#fcc91a;
}
.dpyellow {
	background:#dead06;
}
.green {
	background:#00736d;
}
.dpgreen {
	background:#005752;
}
/*bigtit*/
.bigtit {
	text-align:left;
	position:absolute;
	top: 50%;
    left: 10vw;
    transform: translateY(-50%);
	z-index:3;
}
.ser_icon {
	border-radius:100%;
	height:165px;
	width:165px;
	padding:12px;
	position:relative;
	display:inline-block;
	vertical-align:middle;
}
	.ser_icon:after {
		content: '';
		width: 100%;
		height: 100%;
		border: solid 5px #fff;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 5;
		border-radius: 100%;
		transform: scale(.9);
	}
.ser_icon img {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	max-width:50%;
}
.bigtit p {
	display:inline-block;
	vertical-align:middle;
	font-size:30px;
	padding:0 1em;
}
/*stit*/
.stit {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:0;
	height:100%;
	clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
	-webkit-clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 0% 100%);
	min-width:525px;
	text-align:right;
}

	.stit:after {
		content:'';
		background:#fff;
		width:5px;
		height:100%;
		position:absolute;
		top:0;
		left:2em;
		transform:skewX(-37deg);
	}
.stit span {
	font-size:22px;
	display:block;
	padding: .8em 3em 0 1em;
	letter-spacing:5px;
}
/***sg1***/
.sg1 {
	position:relative;
}
/*sg1_left*/
.sg1_left {
	display:inline-block;
	vertical-align:middle;
	width:50%;
	position:relative;
	min-height:670px;
}
	.sg1_left:before {
		content:'';
		background:url(../../images/sg1_img1.png) center right no-repeat;
		background-size:cover;
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
	}
.sg1_left img {
	position:absolute;
	bottom:1em;
	right:1em;
	max-width:90%;
}
/*sg1_right*/
.sg1_right {
	display:inline-block;
	vertical-align:middle;
	width:46%;
	padding:1em;
}
.sg1_list {
	padding:2em 4em;
	text-align:center;
}
.sg1_list p {
	font-size:22px;
	display:inline-block;
	letter-spacing:3px;
	background:#000;
	border-radius:35px 35px 0 0;
	margin-bottom:5px;
	color:#fff;
	padding: .1em 3em 0;
    line-height: 2;
}
.sg1_list ul {
	border-radius:30px;
	border:solid 5px #b5b5b5;
	padding:2em;
	text-align:left;
}
.sg1_list li {
	display:inline-block;
	vertical-align:top;
	width:31%;
	color:#30393f;
	margin: .5em 0;
    padding: 0 1em 0 1.5em;
	position:relative;
}
	.sg1_list li:before {
		content:'';
		background:#b5b5b5;
		width:14px;
		height:14px;
		border-radius:100%;
		position:absolute;
		top:8px;
		left:0;
	}
/***sg2***/
.sg2 {
	width:1600px;
	margin:0 auto;
	max-width:90%;
	text-align:center;
	padding:2em 0;
}
.sg2 ul {
}
.sg2 li {
	display:inline-block;
	vertical-align:top;
	width:23%;
	padding:1em;
}
.sg2 p {
	font-size:22px;
	font-style:italic;
	text-align:left;
	margin-left:-12px;
}
.sg2 img {
	padding-right:.3em;
	vertical-align:middle;
}
.sg2 span {
	color:#30393f;
	display:block;
	position:relative;
	text-align:left;
	margin: 1em 0 1em 1em;
    padding: 0 1em;
}
	.sg2 span:before {
		content:'';
		width:1px;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		background:#132c80;
	}
/***sg3***/
.sg3 {
	padding:5em 0;
	position:relative;
}
	.sg3:before {
		content:'';
		background:url(../../images/sg_house_01.png) left center no-repeat;
		background-size:contain;
		width: 12%;
		height: 63%;
		position: absolute;
		bottom: 2em;
		left: 3em;
	}
	.sg3:after {
		content:'';
		background:url(../../images/sg_house_02.png) right bottom no-repeat;
		background-size:contain;
		width: 12%;
		height: 57%;
		position:absolute;
		top:2em;
		right:3em;
	}
.sg3 ul {
	width:1100px;
	margin:0 auto;
	max-width:90%;
	text-align:center;
	z-index:3;
	position:relative;
}
.sg3 li {
	display:inline-block;
	vertical-align:top;
	width:23%;
	padding:.5em;
}
/*layer*/
.layer {
	background:#c5d9f5;
	border-radius:10px;
	min-height:235px;
	padding:.5em;
	text-align:center;
}
.layer img {
	display:block;
	margin:0 auto;
	max-width:80%;
	padding: 1em 0 1em;
}
.layer p {
	font-size:22px;
	border-top:solid 1px #fff;
	padding-top: .7em;
    line-height: 1.5;
    font-weight: 700;
}
.layer span {
	display:block;
}
	@media screen and (max-width:1420px) {
		.sg1_list {
			padding:2em;
		}
	}
	@media screen and (max-width:1300px) {
		.sg3 {
			padding: 4em 0;
		}
		.sg3:before {
			left:1em;
			bottom:0em;
			height:50%;
		}
		.sg3:after {
			top: 0em;
			right: 1em;
			height:45%;
		}
	}
	@media screen and (max-width:1260px) {
		.sg1_list {
			padding: 1em;
		}
	}
	@media screen and (max-width:1185px) {
		.sg1_left {
			width:80%;
		}
		.sg1_right {
			width:100%;
			text-align:center;
		}
		.sg1_list {
			padding: 1em;
			display: inline-block;
			width: 48%;
		}
		.sg2 li {
			width:45%;
		}
		.stit {
			min-width:440px;
		}
		.stit:after {
			transform: skewX(-33deg);
		}
		.bigtit {
			left:6vw;
		}
		.sg1_list li {
			padding: 0 0em 0 1.5em;
			white-space:nowrap;
		}
		.sg2 p {
			white-space:nowrap;
		}
	}
	@media screen and (max-width:980px) {
		.ser_icon {
			transform: scale(.8);
		}
		.stit {
			min-width: 30%;
		}
		.stit span {
			font-size: 20px;
			padding: .8em 1em 0 1em;
			white-space:nowrap;
		}
		.stit:after {
			transform: skewX(-24deg);
			left: 1.5em;
		}
		.sg1_left {
			min-height:540px;
		}
		.sg1_list ul {
			padding:2em 1em;
		}
		.sg2 li {
			width: 48%;
		}
		.layer p {
			font-size:20px;
			white-space:nowrap;
		}
	}
	@media screen and (max-width:900px) {
		.bigtit {
			left: 2vw;
		}
		.ser_icon {
			transform: scale(.7);
		}
		.bigtit p {
			padding:0;
		}
		.stit:after {
			transform: skewX(-22deg);
		}
		.sg1_left img {
			max-width:80%;
		}
		.sg1_left {
			min-height: 495px;
		}
		.sg1_list li {
			width:48%;
		}
		.sg3 li {
			width:31%;
		}
		.sg3:before {
			height: 39%;
			width:20%;
		}
		.sg3:after {
			top: 1em;
			height: 28%;
			width: 25%;
		}
	}
	@media screen and (max-width:730px) {
		.stit:after {
			transform: skewX(0deg);
			width: 31px;
			clip-path: polygon(80% 0%, 100% 0%, 20% 100%, 0% 100%);
			-webkit-clip-path: polygon(80% 0%, 100% 0%, 20% 100%, 0% 100%);
			left: .2em;
		}
		.sg1_left {
			min-height: 400px;
		}
		.stit {
			min-width: 35%;
		}
		.sg1_list {
			width:80%;
		}
		.sg1_list li {
			width: 32%;
		}
	}
	@media screen and (max-width:630px) {
		.bigtit p {
			font-size:26px;
		}
		.stit {
			min-width: 30%;
		}
		.stit:after {
			width:25px;
		}
		.sg1_left {
			width:90%;
		}
		.sg1_left img {
			max-width: 85%;
		}
		.layer {
			min-height:215px;
		}
		.stit span {
			font-size: 17px;
			padding: 1em .5em 0 1em;
		}
		.sg3 li {
			width: 45%;
		}
		.sg3 {
			padding: 2em 0;
		}
	}
	@media screen and (max-width:520px) {
		.ser_icon {
			transform: scale(.6);
		}
		.bar {
			height:60px;
		}
		.bigtit {
			left: 0vw;
		}
		.stit:after {
			width: 20px;
		}
		.bigtit p {
			font-size: 24px;
			margin-left: -1em;
		}
		.sg1_left {
			min-height: 325px;
		}
		.sg1_left img {
			max-width: 95%;
		}
		.sg1_list {
			width: 100%;
		}
		.sg2 p {
			font-size:20px;
		}
		.sg2 img {
			width:50px;
		}
		.sg2 li:nth-of-type(4) img {
			width:auto;
		}
		.sg2 span {
			margin: 1em 0 1em 0em;
		}
		.stit span {
			font-size: 16px;
			padding: 1em .5em 0 1em;
			letter-spacing:1px;
		}
	}
	@media screen and (max-width:450px) {
		.service {
			padding: 2em 0 3em;
		}
		.ser_icon {
			transform: scale(.5);
			transform-origin: left;
		}
		.bigtit {
			left: 2vw;
		}
		.bigtit p {
			font-size: 22px;
			margin-left: -3.5em;
		}
		.sg1_left {
			width: 95%;
		}
		.sg1_list li {
			padding: 0 0em 0 1em;
			font-size:16px;
		}
		.sg2 li {
			width: 100%;
		}
		.sg3 li {
			width: 48%;
		}
		.layer p {
			font-size: 18px;
		}
		.layer span {
			font-size:16px;
		}
		.stit span {
			font-size: 15px;
			padding: 1em 1em 0 1em;
		}
		.stit {
			min-width: 33%;
		}
		.stit:after {
			width: 17px;
		}
		.bar {
			height: 50px;
		}
		.sg2 {
			padding:1em 0;
		}
	}
	@media screen and (max-width:380px) {
		.sg1_left {
			min-height: 275px;
		}
		.bigtit p {
			font-size: 20px;
			margin-left: -4em;
		}
		.sg1_list p {
			font-size: 18px;
			padding: .1em 2em 0;
		}
		.sg1_list {
			padding:1em 0;
		}
		.sg1_list li:before {
			width:8px;
			height:8px;
		}
		.sg2 li {
			padding: .5em 1em;
		}
		.sg2 {
			padding: 1em 0;
		}
		.stit span {
			font-size: 14px;
			padding: 1em .5em 0 1em;
		}
		.layer {
			min-height: 195px;
		}
		.sg3 li {
			padding: .2em;
		}
	}
	@media screen and (max-width:350px) {
		.bigtit p {
			font-size: 16px;
			margin-left: -6em;
		}
		.ser_icon {
			transform: scale(.4);
		}
		.stit:after {
			width: 13px;
		}
		.sg1_left {
			min-height: 240px;
		}
		.sg1_list li {
			width:48%;
		}
		.sg1_list ul {
			padding: 1em 1em;
		}
		.layer p {
			font-size: 16px;
		}
		.layer span {
			font-size: 15px;
		}
		.sg3 ul {
			max-width:95%;
		}
		.sg3 {
			padding: 1em 0;
		}
		.layer {
			min-height: 170px;
		}
		.layer img {
			padding: .5em 0 .5em;
		}
		.sg2 p {
			font-size: 18px;
		}
		.sg2 span {
			font-size:16px;
		}
	}
/***bs1***/
.bs1 {
	padding:2em 0;
}
.bs1 p {
	font-size:28px;
	text-align:center;
	padding:1em;
	letter-spacing:2px;
	line-height:1.3;
	font-weight:700;
}
.bs1 ul {
	width:1400px;
	margin:0 auto;
	max-width:90%;
	text-align:center;
}
.bs1 li {
	display:inline-block;
	vertical-align:top;
	width:18%;
	padding:.5em;
}
/***bs2***/
.bs2 {
	width:1630px;
	margin:0 auto;
	max-width:100%;
	padding:2em 0;
	text-align:center;
}
/*bs2_list*/
.bs2_list {
	display:inline-block;
	vertical-align:top;
	width:23%;
	padding:1em;
}
.bs2_list p {
	color: #fcc91a;
    font-size: 20px;
    background: #000;
    border-radius: 30px;
    display: inline-block;
    padding: 0 1em;
    position: relative;
    z-index: 4;
}
.bs2_list ul {
	background:#dcdcdc;
	border-radius:20px;
	padding: 2.5em 1em 1em 1em;
	position:relative;
	margin-top:-1.5em;
	text-align:left;
	min-height:223px;
}
	.bs2_list ul:after {
		content: '';
		border: solid 4px #fff;
		width: 95%;
		height: 90%;
		position: absolute;
		top: 50%;
		left: 50%;
		border-radius: 20px;
		transform: translate(-50%,-50%);
	}
.bs2_list li {
	display:inline-block;
	vertical-align:top;
	width:48%;
	padding: .2em 0 .2em 1.5em;
	text-align:left;
	position:relative;
	font-size:16px;
	z-index:3;
	line-height:1.2;
}
	.bs2_list li:after {
		content:'';
		background:#1b1b1b;
		width:8px;
		height:8px;
		position:absolute;
		top:6px;
		left:12px;
		border-radius:100%;
	}
/***bs3***/
.bs3 {
	background:url(../../images/project_bg.png) center center no-repeat fixed;
	background-size:cover;
	position:relative;
	padding:2em 2em 1em;
	text-align:center;
	box-shadow: inset 0px 0px 10px rgba(0,0,0,1);
}
.bs3 h6 {
	color:#fff;
	padding:1em 0 2em 0;
	line-height:1.2;
	font-size:24px;
}
ul.pro1 {
	width:1600px;
	margin:0 auto;
	max-width:100%;
}
ul.pro1 li {
	display:inline-block;
	vertical-align:top;
	width:16%;
	padding:1em .5em;
}
ul.pro1 p {
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:1.3;
}
.bs3 hr {
	width: 1600px;
    margin: 2em auto;
    max-width: 100%;
}
ul.pro2 {
	width:1200px;
	margin:0 auto;
	max-width:100%;
}
ul.pro2 li {
	position:relative;
	text-align:left;
	color:#fff;
	width: 32%;
    padding: .2em .5em .2em 1em;
	display:inline-block;
	font-size:16px;
}
	ul.pro2 li:before {
		content:'';
		width:8px;
		height:8px;
		background:#eee;
		position:absolute;
		top:13px;
		left:0;
		border-radius:100%;
	}
/***bs4***/
.bs4 {
	padding:3em 0;
	text-align:center;
}
.bs4 ul {
	width:1600px;
	margin:0 auto;
	max-width:90%;
}
.bs4 li {
	display:inline-block;
	vertical-align:top;
	width:22%;
	padding:.5em;
}
	.bs4 li:nth-of-type(2) img,.bs4 li:nth-of-type(4) img {
		-webkit-filter:drop-shadow(0px 0px 5px rgba(0,0,0,.1));
		filter:drop-shadow(0px 0px 5px rgba(0,0,0,.1));
	}
	@media screen and (max-width:1080px) {
		.bs2_list {
			width:40%;
		}
		.bs2_list li:after {
			top:8px
		}
		.bs3 {
			background-attachment:inherit;
		}
		.bs4 li {
			width:45%;
		}
		.bs4 {
			padding: 2em 0;
		}
	}
	@media screen and (max-width:950px) {
		.bs1 li {
			width:25%;
		}
		.bs1 {
			padding: 1em 0;
		}
		ul.pro1 li {
			width:28%;
		}
		ul.pro2 li {
			line-height:1.3;
		}
		ul.pro2 li:before {
			top:10px;
		}
	}
	@media screen and (max-width:700px) {
		.bs1 li {
			width: 31%;
		}
		.bs2_list {
			width: 48%;
		}
		ul.pro1 li {
			width: 31%;
		}
		ul.pro2 {
			text-align:left;
			padding:0 1em;
		}
		ul.pro2 li {
			width:48%;
		}
	}
	@media screen and (max-width:550px) {
		.bs1 p {
			padding: 1em .5em .5em;
			font-size: 25px;
		}
		.bs2_list {
			width: 100%;
			padding:.5em 1em;
		}
		.bs2 {
			padding:1em 0;
		}
		.bs3 h6 {
			padding: .5em 0 1em 0;
		}
	}
	@media screen and (max-width:450px) {
		.bs1 p {
			padding: .5em .5em .5em;
			font-size: 24px;
		}
		.bs1 ul {
			max-width:100%;
		}
		.bs3 {
			padding: 2em 1em 1em;
		}
		ul.pro1 li {
			width: 32%;
			padding: .5em .2em;
		}
		ul.pro1 p {
			font-size:15px;
		}
		.bs3 hr {
			margin: 1em auto;
		}
		ul.pro2 li {
			width: 100%;
		}
		.bs4 li {
			width: 48%;
		}
		.bs4 {
			padding: 1em 0;
		}
	}
	@media screen and (max-width:380px) {
		.bs1 p {
			font-size:22px;
		}
		.bs1 li {
			width: 31%;
			padding: .2em;
		}
		ul.pro1 p {
			font-size: 14px;
		}
		.bs4 li {
			width: 49%;
			padding: .5em .2em;
		}
	}
	@media screen and (max-width:350px) {
		.bs3 h6 {
			padding: .0em 0 1em 0;
			font-size:22px
		}
		ul.pro1 li {
			width: 48%;
		}
		.bs1 li {
			width: 45%;
		}
	}
/***clean***/
.clean {
	background:url(../../images/clean_bg.jpg) top center no-repeat fixed;
	background-size:cover;
	padding:7em 0 4em;
	text-align:center;
}
.clean ul {
	width:1500px;
	margin:0 auto;
	max-width:90%;
}
.clean li {
	display:inline-block;
	vertical-align:top;
	width:31%;
	padding:0 1em;
	color:#fff;
}
.clean img {
	-webkit-filter:drop-shadow(0px 5px 8px rgba(0,0,0,.3));
	filter:drop-shadow(0px 5px 8px rgba(0,0,0,.3));
	max-width: 20vw;
}
.clean p {
    font-size: 36px;
    font-style: italic;
    line-height: 1;
    padding-bottom: .5em;
}
/*clean_text*/
.clean_text {
	background:rgba(4,73,69,.75);
	text-align:left;
	border-radius:10px;
	padding:1em;
	font-size:16px;
	box-shadow:0px 4px 3px rgba(0,0,0,.1);
	min-height:220px;
}
.clean_text ul {
	width: 100%;
    margin: 0;
    max-width: 100%;
	padding-left: 1em;
}
.clean_text li {
	display: list-item;
    width: 100%;
    padding: 0;
    list-style: decimal;
}
/***inews***/
.inews {
	position:relative;
	text-align:center;
	background:url(../../images/square_01.png) top left no-repeat, url(../../images/square_02.png) top right no-repeat, url(../../images/pattern3.jpg) repeat;
	background-size:auto,auto,inherit;
	background-position-x: 95%,5%,0;
	padding:2em;
	color:#fff;
}
	.inews:before {
		content:'';
		background:#fcc91a;
		height:14px;
		width:80%;
		position:absolute;
		top:0;
		left:50%;
		transform:translateX(-50%);
	}
	.inews:after {
		content:'';
		background:#fcc91a;
		height:14px;
		width:80%;
		position:absolute;
		bottom:0;
		left:50%;
		transform:translateX(-50%);
	}
/*inews_tit*/
.inews_tit {
	padding-bottom:1em;
}
.inews_tit span {
	color:#fff;
	font-size:34px;
	font-style:italic;
}
.inews_tit p {
	color:#fcc91a;
	font-size:28px;
	display:inline-block;
	padding:0 .2em;
	letter-spacing:3px;
}
/*inews_list*/
.inews_list {
	width:450px;
	margin:1em auto;
	max-width:100%;
	text-align:left;
	min-height:250px;
}
.inews_list a {
	color:#fff;
}
/*more*/
.more {
	display:inline-block;
	position:relative;
	border-bottom:solid 1px #fff;
	line-height:1;
	padding: 0 1em .3em;
	margin:1em 0;
}
	.more:before {
		content:'';
		width:10px;
		height:10px;
		border-radius:100%;
		background:rgba(255,255,255,.15);
		position:absolute;
		left:0;
		top:4px;
		transition:.3s ease-in-out;
	}
	.more:after {
		content:'';
		width:10px;
		height:10px;
		border-radius:100%;
		background:rgba(255,255,255,.15);
		position:absolute;
		right:0;
		top:4px;
		transition:.3s ease-in-out;
	}
.more a {
	color:#fff;
	position:relative;
	padding:0 1em;
}
	.more a:before {
		content:'';
		width:10px;
		height:10px;
		border-radius:100%;
		background:rgba(255,255,255,1);
		position:absolute;
		left:0;
		top:4px;
		transition:.3s ease-in-out;
	}
	.more a:after {
		content:'';
		width:10px;
		height:10px;
		border-radius:100%;
		background:rgba(255,255,255,1);
		position:absolute;
		right:0;
		top:4px;
		transition:.3s ease-in-out;
	}
	.more:hover:before,.more:hover:after {
		background:rgba(255,255,255,1);
	}
	.more a:hover:before,.more a:hover:after {
		background:rgba(255,255,255,.15);
	}
	@media screen and (max-width:1100px) {
		.clean {
			padding:3em 0 2em;
			background-attachment:inherit;
		}
		.clean img {
			max-width:14vw;
		}
		.clean li {
			width:90%;
			padding:1em;
		}
		.clean_text li {
			width:100%;
			padding:0;
		}
		.clean_text {
			min-height:150px;
		}
	}
	@media screen and (max-width:700px) {
		.inews_list {
			min-height:100px;
		}
	}
	@media screen and (max-width:600px) {
		.clean li {
			width:100%;
			padding:1em 0;
		}
		.clean_text li {
			padding:0;
		}
		.clean {
			padding:1em 0;
		}
	}
	@media screen and (max-width:450px) {
		.clean_text {
			min-height: 130px;
		}
		.clean img {
			max-width: 25vw;
		}
		.clean p {
			padding-bottom: .2em;
		}
		.inews {
			background-size: 10%,10%,auto;
			background-position-x: 98%,2%,0;
		}
		.inews_list {
			min-height: 50px;
		}
		.more {
			margin:0;
		}
		.inews_tit span {
			font-size: 28px;
		}
		.inews_tit p {
			font-size: 25px;
		}
	}
	@media screen and (max-width:350px) {
		.inews {
			padding:1em;
		}
	}
/*---location---------------------------------------------------------------------------------------------------------------------------*/
.location {
	text-align:center;
	padding-bottom:2em;
}
.location .title {
	padding:2em 0;
}
/***loc***/
.loc {
	width:1500px;
	margin:0 auto;
	max-width:90%;
	text-align:left;
	padding:1em 0;
}
/*map*/
.map {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	min-height:525px;
	width:62%;
	border:solid 1px #000;
	overflow:hidden;
}
.map iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
/*loc_info*/
.loc_info {
	display:inline-block;
	vertical-align:middle;
	padding:1em 1em 1em 3em;
	width:35%;
}
/*area*/
.area {
	border-bottom:solid 1px #000;
}
.area .lolly {
	display:inline-block;
	vertical-align:baseline;
}
.area p {
	font-size:28px;
	vertical-align:bottom;
	font-weight:700;
	display:inline-block;
	padding:0 2em 0 .5em;
	letter-spacing:3px;
}
.area span {
	display:inline-block;
	font-size:24px;
	vertical-align:bottom;
}
.loc_info ul {
	padding:1em 0;
}
.loc_info li {
	letter-spacing:2px;
}
.loc_info li p:nth-of-type(1) {
	display:inline-block;
	vertical-align:top;
	width:20%;
}
.loc_info li p:nth-of-type(2) {
	display:inline-block;
	vertical-align:top;
	width:75%;
}
	@media screen and (max-width:1630px) {
		.loc_info li p:nth-of-type(1) {
			width:95px;
			line-height: 1.3;
		}
		.loc_info li p:nth-of-type(2) {
			width:72%;
			line-height:1.3;
		}
	}
	@media screen and (max-width:1380px) {
		.map {
			width:58%;
		}
		.loc_info {
			width:40%;
		}
	}
	@media screen and (max-width:1200px) {
		.area span {
			font-size:20px;
		}
		.area p {
			font-size:26px
		}
		.loc_info li p:nth-of-type(2) {
			width: 68%;
		}
	}
	@media screen and (max-width:1120px) {
		.map {
			width: 100%;
			min-height: 450px;
		}
		.loc_info {
			width: 100%;
			padding: 1em;
		}
		.location {
			text-align: center;
			padding-bottom: 0em;
		}
		.location .title {
			padding: 2em 0 0em;
		}
	}
	@media screen and (max-width:520px) {
		.map {
			min-height: 325px;
		}
		.loc_info ul {
			padding: 1em 0 0;
		}
	}
	@media screen and (max-width:450px) {
		.map {
			min-height:280px;
		}
		.area p {
			font-size: 24px;
			padding: 0 1em 0 .2em;
		}
		.area span {
			font-size: 18px;
			padding-bottom:.2em;
		}
		.loc_info ul {
			font-size: 16px;
		}
		.loc_info {
			padding:1em 0 0;
		}
	}
	@media screen and (max-width:380px) {
		.map {
			min-height:250px;
		}
	}
	@media screen and (max-width:350px) {
		.map {
			min-height:220px;
		}
		.loc_info li p:nth-of-type(2) {
			width: 65%;
		}
		.loc_info li p:nth-of-type(1) {
			width: 90px;
		}
	}
/*---link_bar----------------------------------------------------------------------------------------------------------------------------*/
.link_bar {
	background:#a0a0a0;
	padding:.8em 1em;
	text-align:center;
	color:#fff;
	line-height:1;
}
.link_bar span {
	display:inline-block;
	vertical-align:middle;
	font-size:40px;
	font-style:italic;
}
.link_bar p {
	display:inline-block;
	vertical-align:middle;
	font-size:28px;
	letter-spacing:3px;
	padding: .2em .2em 0;
}
/***link***/
.link {
	background:url(../../images/link_bg.png) center center no-repeat fixed;
	background-size:cover;
	position:relative;
	text-align:center;
}
.link ul {
	background:rgba(0,0,0,.75);
	text-align:center;
	padding:5em 1em;
}
.link li {
	display:inline-block;
	vertical-align:top;
	width:19%;
	padding:0 1em;
	border-left:solid 1px #CCC;
	min-height:240px;
}
	.link li:nth-of-type(4) {
		border-right:solid 1px #CCC;
	}
.link a {
	color:#fff;
	font-size:24px;
	transition:.3s ease-in-out;
}
.link img {
	max-width:80%;
	transition:.3s ease-in-out;
}
.link a p {
	line-height: 1.3;
    font-weight: normal;
}
.link a strong {
	display:block;
}
.link a span {
	font-size:14px;
	display:inline-block;
	border-radius:60px;
	background:#fcc91a;
	color: #000;
    padding: 0 .5em;
    line-height: 1.2;
	-webkit-filter: drop-shadow(1px 1px 3px #000);
	filter: drop-shadow(1px 1px 3px #000);
	transition:.3s ease-in-out;
}
	.link a:hover img {
		opacity:.7;
	}
	.link a:hover span {
		color:#fff;
	}
/*link_btm*/
.link_btm {
	font-size:30px;
	font-style:italic;
	letter-spacing:6px;
	padding:5em 1em;
	font-weight:700;
}
.link_btm b {
	position: relative;
    display: inline-block;
	line-height:1;
	z-index:2;
}
	.link_btm b:before {
		content:'';
		background:rgba(252,201,26,.5);
		width:100%;
		height:9px;
		position:absolute;
		bottom:4px;
		left:0;
		z-index:-1;
		transform: skewX(-25deg);
	}
	@media screen and (max-width:1080px) {
		.link li {
			width:22%;
		}
		.link {
			background-attachment:inherit;
		}
		.link_btm {
			padding:4em 0;
		}
		.link a {
			font-size:22px;
		}
		.link ul {
			padding: 3em 1em;
		}
	}
	@media screen and (max-width:850px) {
		.link a {
			font-size: 20px;
		}
		.link li {
			min-height:210px;
		}
		.link_btm {
			padding: 3em 0;
		}
	}
	@media screen and (max-width:720px) {
		.link li {
			width: 40%;
			margin-bottom:1em;
		}
		.link li:nth-of-type(2) {
			border-right:solid 1px #CCC;
		}
		.link ul {
			padding: 2em 1em;
		}
	}
	@media screen and (max-width:500px) {
		.link li {
			min-height: 190px;
		}
	}
	@media screen and (max-width:450px) {
		.link li {
			width:45%;
			min-height: 180px;
		}
		.link a {
			font-size: 17px;
		}
		.link_btm {
			font-size:28px;
		}
	}
	@media screen and (max-width:380px) {
		.link li {
			min-height: 160px;
		}
	}
	@media screen and (max-width:350px) {
		.link a {
			font-size: 16px;
		}
		.link li {
			padding: 0 .5em;
		}
		.link_btm {
			font-size:24px;
		}
		.link ul {
			padding: 1em 1em;
		}
	}
/*---footer--------------------------------------------------------------------------------------------------------------------------*/
footer {
	background:url(../../images/pattern1.png) repeat,#fff;
	text-align:center;
	position:relative;
	border-top:solid 30px #132c80;
	box-shadow:0px 0px 5px rgba(0,0,0,.1);
}
/***ftlogo***/
.ftlogo {
	margin-top: -1.5em;
	padding-bottom:1em;
}
.ftlogo img {
}
/***fttit***/
.fttit {
	display:inline-block;
	width:22%;
	text-align:left;
	padding:1em;
	border-right:solid 1px #999;
}
.fttit h1 {
	color:#132c80;
	font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
	padding-bottom:.3em;
}
.fttit p {
	color:#132c80;
	font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
}
.fttit ul {
	text-align:left;
	padding-top:.5em;
}
.fttit li {
	display:inline-block;
	padding:.3em;
}
.fttit a {
	transition:.3s ease all;
}
	.fttit a:hover {
		-webkit-filter: invert(1);
		filter: invert(1);
	}
/***ftinfo***/
.ftinfo {
	display:inline-block;
	vertical-align:top;
	width:22%;
	text-align:left;
	padding:1em;
}
.ftinfo p {
	color:#132c80;
	font-weight:500;
	letter-spacing:5px;
}
.ftinfo ul {
	padding-top:.5em;
}
.ftinfo li {
}
.ftinfo img {
	vertical-align:top;
}
.ftinfo li p {
	display:inline-block;
	vertical-align:top;
	color:#000;
	line-height:1.2;
	width: 80%;
    padding: 0 .5em;
	letter-spacing:1px;
	font-size:16px;
}
/***website***/
.website {
	display:inline-block;
	vertical-align:top;
	width:22%;
	padding:1em;
	text-align:left;
	border-left:solid 1px #999;
}
/*site*/
.site {
}
.site a {
	display:inline-block;
	vertical-align:baseline;
	width:25%;
	font-size:16px;
	color:#000;
	padding: 0 .2em;
    text-align: center;
	transition:.3s linear;
	line-height:1;
}
	.site a:nth-of-type(1),.site a:nth-of-type(2),.site a:nth-of-type(4),.site a:nth-of-type(5) {
		border-right:solid 1px #000;
	}
	.site a:hover {
		color: #132c80;
	}
/*icon*/
.icon {
	color:#a0a0a0;
	font-size:16px;
	padding:3em 0 0 0;
}
.icon a {
	display:inline-block;
	vertical-align:top;
	transition:.3s linear;
	padding:0 3px;
}
	.icon a:hover {
		-webkit-filter:brightness(0);
		filter:brightness(0);
	}
/*copyright*/
.copyright {
	background:#132c80;
	text-align:center;
	color:#fff;
	font-size:15px;
	padding:1.5em 1em;
	margin-top:2em;
}
.copyright a {
	color:#fff;
	font-size:15px;
	display:inline-block;
	transition:.3s linear;
}
	.copyright a:hover {
		color:#fcc919;
	}
	@media screen and (max-width:1540px) {
		.site a {
			width:30%;
		}
	}
	@media screen and (max-width:1340px) {
		.fttit {
			display: block;
			width: 350px;
			padding: 1em;
			border-right: solid 0px #999;
			margin: 0 auto;
			max-width: 100%;
			text-align:center;
		}
		.fttit ul {
			text-align:center;
		}
		.ftinfo,.website {
			width:31%;
		}
	}
	@media screen and (max-width:940px) {
		.site a {
			width: 32%;
			font-size:15px
		}
	}
	@media screen and (max-width:840px) {
		.site a {
			width: 32%;
			font-size:15px
		}
		.website {
			width: 300px;
			display: block;
			margin: 0 auto;
			border: 0;
			max-width: 90%;
		}
		.icon {
			padding: 1em 0 0 0;
		}
		.copyright {
			margin:0;
		}
		.ftinfo {
			width:40%;
		}
	}
	@media screen and (max-width:580px) {
		.fttit {
			padding:0 1em;
		}
		.ftinfo {
			width: 46%;
		}
		.copyright,.copyright a {
			line-height: 1.5;
			font-size:14px;
		}
	}
	@media screen and (max-width:450px) {
		.ftinfo {
			width:320px;
			margin:0 auto;
			padding: .5em 0;
			max-width:90%;
		}
		.ftinfo ul {
			padding-top: 0;
		}
		.ftinfo li p {
			width:90%;
		}
	}
#history,#news,#location,#service,#link,#s_guard,#business,#clean {
	transform:translateY(-100px);
}
	@media screen and (max-width:650px) {
		#history,#news,#location,#service,#link,#s_guard,#business,#clean {
			transform:translateY(-80px);
		}
	}
	@media screen and (max-width:530px) {
		#history,#news,#location,#service,#link,#s_guard,#business,#clean {
			transform:translateY(-75px);
		}
	}
	@media screen and (max-width:430px) {
		#history,#news,#location,#service,#link,#s_guard,#business,#clean {
			transform:translateY(-70px);
		}
	}
	@media screen and (max-width:380px) {
		#history,#news,#location,#service,#link,#s_guard,#business,#clean {
			transform:translateY(-65px);
		}
	}
#gotop {
	position:fixed;
	bottom:5vh;
	right:1em;
	z-index:30;
	cursor:pointer;
	display:none;
}
#gotop img {
	transition:.3s ease all;
}
#gotop:hover img {
	transform:translateY(-10px);
}
	@media screen and (max-width:500px) {
		#gotop {
			width:50px;
			right:10px;
		}
	}
/***inbanner***/
.inbanner {
	position:relative;
	width:100%;
	min-height:400px;
	margin-top:5em;
	background:url(../../images/inbanner.png) center center no-repeat;
	background-size:cover;
}
.wrap3 {
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
	width:520px;
	margin:0 auto;
	max-width:90%;
	min-height:400px;
}
.indeco1 {
	width:120px;
	height:120px;
	background:#fff;
	display:inline-block;
	clip-path:polygon(65% 0%, 100% 0%, 35% 100%, 0% 100%);
	-webkit-clip-path:polygon(65% 0%, 100% 0%, 35% 100%, 0% 100%);
	position: absolute;
    top: 0;
    right: 0;
}
.indeco2 {
	width:120px;
	height:120px;
	background:rgba(255,255,255,.5);
	display:inline-block;
	clip-path:polygon(65% 0%, 100% 0%, 35% 100%, 0% 100%);
	-webkit-clip-path:polygon(65% 0%, 100% 0%, 35% 100%, 0% 100%);
	position: absolute;
    bottom: 0;
    left: 0;
}
.intit {
	text-align:center;
	color:#fff;
	line-height:1.5;
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	transform:translateY(-50%);
}
.intit p {
	font-size:30px;
	letter-spacing:4px;
}
.intit span {
	font-size:72px;
	display:block;
	line-height:1;
}
	@media screen and (max-width:1080px) {
		.inbanner,.wrap3 {
			min-height:370px;
		}
		.indeco1,.indeco2 {
			height:110px;
		}
	}
	@media screen and (max-width:700px) {
		.inbanner,.wrap3 {
			min-height:320px;
		}
		.indeco1,.indeco2 {
			height:75px;
		}
		.intit span {
			font-size:65px;
		}
	}
	@media screen and (max-width:650px) {
		.inbanner {
			margin-top:4em;
		}
	}
	@media screen and (max-width:530px) {
		.inbanner, .wrap3 {
			min-height: 260px;
		}
		.indeco1, .indeco2 {
			height: 65px;
		}
		.intit span {
			font-size: 11vmin;
		}
	}
	@media screen and (max-width:500px) {
		.indeco1, .indeco2 {
			height: 45px;
		}
		.inbanner, .wrap3 {
			min-height: 200px;
		}
		.intit p {
			font-size: 28px;
		}
		.intit span {
			font-size: 10vmin;
		}
	}
	@media screen and (max-width:450px) {
		.inbanner {
			margin-top:3.5em;
		}
	}
	@media screen and (max-width:380px) {
		.indeco1,.indeco2 {
			width:90px;
		}
		.inbanner, .wrap3 {
			min-height: 180px;
		}
	}
/***order_text***/
.order_text {
	position:relative;
	width:750px;
	margin:5em auto;
	max-width:90%;
	text-align:center;
}
.order_text p {
	display:inline-block;
	position:relative;
	font-style:italic;
	background:rgba(252,201,26,.5);
	border-radius:8px;
	padding: 4em 2em;
	letter-spacing:3px;
	line-height:1.3;
	width: 67%;
}
	.order_text p:before {
		content:'';
		clip-path: polygon(0 0, 100% 100%, 100% 22%);
		-webkit-clip-path: polygon(0 0, 100% 100%, 100% 22%);
		background:rgba(252,201,26,.5);
		width:28px;
		height:30px;
		position:absolute;
		top:50%;
		left:-27px;
	}
.order_text img {
	float:left;
	max-width:10vw;
}

#services_order {
	background:rgba(252,201,26,.5);
	border-radius:2px;
	width:1065px;
	margin:0 auto 7em;
	max-width:90%;
	text-align:left;
	padding:2em;
	font-size:18px;
	font-weight:500;
}
.form-group {
	padding:1em 0;
	margin:0;
}
.form-control {
	box-shadow: inset -1px 1px 3px rgb(226, 173, 10);
	-webkit-box-shadow: inset -1px 1px 3px rgb(226, 173, 10);
}
button, html input[type=button], input[type=reset], input[type=submit] {
	background: #fcc919;
    border: solid 1px #737373;
    border-radius: 5px;
    padding: 5px 13px;
    letter-spacing: 1px;
    box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.3);
    transition: .2s ease all;
    width: 150px;
    margin: 0 1%;
    color: #000;
	font-size:16px;
}
input[type=reset] {
	background: rgb(173, 176, 176);
}
button:hover, html input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover {
	background:rgba(255,255,255,.5);
    box-shadow: 0px 0px 1px rgba(0,0,0,.3);
}
.ripple {
	text-align:center;
	padding-top:1em;
}
.style1 {
	display: inline-block;
    font-weight: 500;
    width: 200px;
	vertical-align:top;
}
.style2 {
	display:inline-block;
	vertical-align:top;
	width:70%;
}
label {
	font-weight:500;
}
.style3 label {
	display:block;
	font-weight:normal;
}
.style4 label {
	display:inline-block;
	vertical-align:top;
	width:48%;
}
	@media screen and (max-width:900px) {
		.order_text {
			margin: 3em auto;
		}
		.order_text img {
			max-width: 15vw;
		}
		#services_order {
			padding:1em 2em;
			margin: 0 auto 4em;
		}
		.style2 {
			width:100%;
		}
		.form-group {
			padding:.5em 0;
		}
	}
	@media screen and (max-width:700px) {
		.order_text img {
			max-width: 25vw;
		}
	}
	@media screen and (max-width:550px) {
		.order_text {
			margin: 2em auto;
		}
		.order_text p {
			padding: 3em 1em;
			width: 55%;
		}
	}
	@media screen and (max-width:450px) {
		.order_text p {
			padding: 2em 1em;
			width: 58%;
		}
		#services_order {
			padding: 1em 1em;
			margin: 0 auto 3em;
		}
		button, html input[type=button], input[type=reset], input[type=submit] {
			width:48%;
			display:inline-block;
			margin:.5em .1em;
		}
	}
	@media screen and (max-width:380px) {
		.order_text p,#services_order {
			font-size:16px;
		}
		.order_text p:before {
			width:20px;
			left:-19px;
		}
		.order_text {
			margin: 1.5em auto;
		}
		.form-group {
			padding: .3em 0;
		}
	}
	@media screen and (max-width:350px) {
		button, html input[type=button], input[type=reset], input[type=submit] {
			width:100%;
			margin: .5em 0em 0;
		}
		#services_order {
			margin: 0 auto 2em;
		}
	}
/***newstable***/
.newstable {
	width:900px;
	margin:5em auto;
	max-width:90%;
	text-align:left;
}
.newstable table {
	width:100%;
}
.newstable table a {
	transition:.3s linear;
	display:inline-block;
}
a.newsa:nth-of-type(1) {
	display:block;
}
	.newstable table a:hover {
		color:#0e3484;
	}
img.newsicon {
	width:auto;
}
	@media screen and (max-width:1080px) {
		.newstable {
			margin:3em auto;
		}
	}
	@media screen and (max-width:600px) {
		.newstable {
			margin:2em auto;
		}
	}
.style2 p {
	font-size: 14px;
    color: #736120;
}
.style2 .form-group {
	padding:0;
}