header{
	background: #868591;
}
html,body{
	height: unset;
	overflow-x: hidden;
	overflow-y: auto!important;
}
body{
	background: unset;
	height: unset!important;
}
.section{
	padding-top: 100px;
	overflow: hidden;
}
.section-title{
	font-family: "wavehaus-bold";
	font-size: 50px;
	color: rgba(0,0,0,0.85);
	margin-bottom: 20px;
}
.row{
	overflow: hidden;
}
.columns{
	background: #EDEDED;
	height: 800px;
	width: calc(8.33% - 44px);
	margin: 0 22px;
	padding: 0;
}
#gridimg{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: calc(50% - 44px);
}
#textline{
	vertical-align: middle;
	font-family: "wavehaus-book";
	width: 100%;
}
#textline tr{
}
#textline td{
	width: 50%;
}
.text-des{
	font-size: 30px;
	color: rgba(255,255,255,0.85);
}
.hang{
	padding: 120px 0;
}
.title-page{
	position: unset;
	text-align: left;
}
#h2{
	font-family: bigcaslon-black;
	font-size: 70px;
	color: #221F35;
	line-height: 101px;
	font-weight: lighter;
}
#h3{
	font-family: Wavehaus-Bold;
	font-size: 20px;
	color: #43BFE7;
	line-height: 24px;
}
p{
	font-family: Wavehaus-Book;
	font-size: 20px;
	color: #221F34;
	line-height: 24px;
}



.color-block{
	height: 260px;
	box-sizing: border-box;
}
.color-text{
	font-family: Wavehaus-Book;
	font-size: 17px;
	color: #221F34;
	text-align: center;
	margin-top: 25px;
}


.form-box{
	width: 640px;
}
.required-msg{
	font-family: Wavehaus-Light;
	font-size: 10px;
	color: #FFFFFF;
	text-align: right;
}
.form-input{
	width: 100%;
	background: transparent;
	height: 34px;
	padding: 7px 0;
	font-size: 20px;
	font-family: Wavehaus-Book;
	line-height: 24px;
	color: #fff;
	border-bottom: 1px solid #fff;
	border-top: unset;
	border-left: unset;
	border-right: unset;
	margin-bottom: 40px;
}
::-webkit-input-placeholder { /* Edge */
  color: #fff;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #fff;
}

::placeholder {
  color: #fff;
}
input:focus{
	outline: none;
}

.form-dwopdown{
	position: absolute;
	background: #fff;
	width: 100%;
	top: 48px;
	height: 0px;
	opacity: 0;
	visibility: hidden;
	z-index: 10;
	overflow: hidden;
}
.active .form-dwopdown{
	opacity: 1;
	height: 280px;
	visibility: visible;
}
.form-dropdown-item{
	font-family: Wavehaus-Book;
	font-size: 20px;
	color: #221F34;
	height: 70px;
	line-height: 70px;
	border-bottom: 1px solid #43BFE7;
	padding: 0 35px;
	cursor: pointer;
}
.form-dropdown-item:last-child{
	border-bottom: unset;
}
.form-dropdown-item:hover{
	font-family: Wavehaus-Bold;
}
#arrow{
	position: absolute;
	right: 0;
	top: 15px;
}
.active #arrow{
	transform: rotateX(180deg);
}
.send{
	font-family: "bigcaslon-black";
	margin-top: 30px;
	font-size: 70px;
	line-height: 94px;
	color: #FFFFFF;
	cursor: pointer;
}
.send:hover img{
	transform: translateX(15px);
}




/*input*/
.inputline{
	font-family: Wavehaus-Book;
	font-size: 20px;
	color: #221F34;
	line-height: 40px;
	width: 290px;
}
.inputline input{
	width: 254px;
	height: 45px;
	line-height: 45px;
	margin-bottom: 55px;
	padding-right: 30px;
	font-size: 20px;
	border: 1px solid #221F34;
	color: #221F34;
}
.input-img{
	position: absolute;
	right: 12px;
	top: 59px;
	opacity: 0;
}
.inputline input.success{
	border: 1px solid #43BFE7;
	color: #43BFE7;
}
.inputline input.success ~.success-img{
	opacity: 1;
}
.inputline input.error{
	border: 1px solid #E02020;
	color: #E02020;
}
.inputline input.error ~.error-img{
	opacity: 1;
}

/*animation*/
#graphic1{
	height: 232px;
	width: 100%;
	position: relative;
	margin: 30px 0;
}
#a1abox{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	height: 98px;
	font-size: 0;
	width: 1000px;
	overflow: hidden;
}
#a1-arrow{
	height: 98px;
	position: absolute;
}
.at-title{
	font-size: 18px;
	color: #221F34;
	font-family: Wavehaus-Bold;
	margin-bottom: 10px;
}
.at-des{
	font-size: 10px;
	color: #2DC3E8;
	line-height: 14px;
}
#a1t1{
	position: absolute;
	left: 0;
	top: 0;
}
#a1t2{
	position: absolute;
	left: 247px;
	top: 170px;
}
#a1t3{
	position: absolute;
	left: 495px;
	top: 0;
}
#a1t4{
	position: absolute;
	left: 744px;
	top: 170px;
}
#a1t5{
	position: absolute;
	left: 992px;
	top: 0;
}
@keyframes fadeInUp{
	0%{
		transform: translateY(15px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes fadeInDown{
	0%{
		transform: translateY(-15px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}/*
.enlarge{
	animation-name: enlarge;
}
@keyframes enlarge{
	0%{
		width: 0px;
	}
	100%{
		width: 1000px;
	}
}*/

#graphic2{
	height: 553px;
	margin: 30px 0;
	position: relative;
}
#a2abox{
	height: 300px;
	position: absolute;
	left: 42px;
	top: 89px;
	overflow: hidden;
}
.sample-text{
	font-family: "wavehaus-book";
	font-size: 10px;
	color: #1A1636;
	letter-spacing: -0.63px;
}
.enlarge2{
	animation-name: enlarge2;
}
@keyframes enlarge2{
	0%{
		width: 0px;
	}
	100%{
		width: 900px;
	}
}
#a2t1{
	position: absolute;
	bottom: 0;
	left: 167px;
}
#a2t2{
	position: absolute;
	bottom: 0;
	left: 424px;
}
#a2t3{
	position: absolute;
	bottom: 0;
	left: 688px;
}

#graphic3{
	padding: 30px 0;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	box-sizing: border-box;
}
#a3t1,
#a3t2{
	position: absolute;
	height: 280px;
	margin-bottom: 90px;
}
.svgbox{
	position: absolute;
}
.a3-text-box{
	position: absolute;
	top:  calc(100% - 52px);
	left: calc(100% - 50px); 
	width: 446px;
}
.a3-title{
	font-family: wavehaus-bold;
	font-size: 50px;
	color: #221F34;
	margin-bottom: 25px;
}
.a4-text,
.a3-text{
	font-size: 20px;
	color: #221F34;
}
.svgbox path,
.svgbox polygon{
	stroke-dashoffset: 700;
	stroke-dasharray: 700;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}
.a4-title{
	font-family: "bigcaslon-black";
	font-size: 70px;
	position: absolute;
	top: 20px;
	left: 0;
	color: #221F34;
}
.a4-text{
	position: absolute;
	width: 446px;
	left: 485px;
	bottom: 40px;
}
#graphic4{
	padding: 30px 0;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	box-sizing: border-box;
}
#a4svg polygon{
	stroke-dashoffset: 1400;
	stroke-dasharray: 1400;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}
#a4svg path{
	stroke-dashoffset: 350;
	stroke-dasharray: 350;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}
#a4svg2 path,
#a4svg2 polygon{
	stroke-dashoffset: 1500;
	stroke-dasharray: 1500;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}
.a4box{
	position: absolute;
}
#a4svg3{
	stroke-dashoffset: 1150;
	stroke-dasharray: 1150;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}
#a4svg3 polygon{
	stroke-dashoffset: 1150;
	stroke-dasharray: 1150;
	transition: all 3s 0s cubic-bezier(.23,1,.32,1);
}

/*footer*/
.footer-top{
	padding: 80px 0 40px 0;
	background: #221F34;
	color: #fff;
	font-size: 15px;
	text-align: center;
}
.footer-title{
	font-family: wavehaus-bold;
	margin-bottom: 15px;
}
.footer-item{
	font-family: wavehaus-book;
	margin: 15px 0;
	cursor: pointer;
}
.icon-box{
	display: inline-block;
}
.icon-box img{
	margin: 0 5px;
	cursor: pointer;
	height: 38px;
	width: 38px;
}
#subscribe-input{
	width: 100%;
	border: 1px solid #fff;
	box-sizing: border-box;
	line-height: 45px;
	height: 45px;
	margin-bottom: 15px;
	background: transparent;
	color: #fff;
	font-size: 15px;
	padding: 0 10px;
}
#subscribe-btn{
	width: 120px;
	height: 45px;
	font-family: Wavehaus-Bold;
	background: #43BFE7;
	color: #fff;
	font-size: 15px;
	border: none;
	cursor: pointer;
}
#subscribe-btn:focus{
	outline: none;
}
.footer-bottom{
	height: 40px;
	background: #fff;
}
.copyright{
	font-family: Wavehaus-Book;
	font-size: 10px;
	color: #221F34;
	line-height: 40px;
}

.showontablet{
	display: none;
}

@media(max-width: 1440px){
	.inputline{
		width: 200px;
	}
	.footer-top{
		font-size: 14px;
	}
	.footer-top{
		padding: 50px 0 30px 0;
	}
}
@media(max-width: 1440px){
	.hideontablet{
		display: none;
	}
	.showontablet{
		display: block;
	}
	.icon-box{
		margin-top: 70px;
		margin-bottom: 70px;
	}
	#ft5b{
		width: 33.33%;
	}
}
@media(max-width: 910px){
	footer .row{
		margin: 0;
		padding: 0 22px;
	}
	.fttb1{
		width: 12.5%
	}
	#ft5b{
		width: 37.5%
	}
	.fttb1,
	.fttb2{
		padding: 0;
		text-align: left;
	}
	.footer-top {
	    font-size: 11px;
	}
	.inputline{
		width: 100%;
	}
}

@media(max-width: 650px){
	.footer-top .col-1,
	.footer-top .col-2{
		text-align: left;
		width: 100%;
		padding: 0 44px;
		margin-bottom: 10px;
	}
	#ft5b{
		width: 100%;
		position: relative;
		top: -340px;
	}
	.icon-box{
		position: relative;
		top: -280px;
		margin: 30px 0;
	}
	.icon-box img{
		width: 26px;
		height: 26px;
		margin-right: 8px;
		margin-left: 0px;
	}
	.footer-title{
		margin: 17px 0;
	}
	.footer-item{
		margin: 12px 0;
	}
	.copyright{
		width: 100%;
		padding: 0 25px;
		line-height: 68px;
	}
	.footer-bottom{
		height: 68px;
	}
	footer .row{
		margin: 0 -19px;
		padding: 0;
	}
	#subscribe-input,
	#subscribe-btn,
	.form-input,
	.form-dropdown-item{
		font-size: 12px;
	}
	.fttb1{
		position: relative;
		top: 300px;
	}
	.footer-top{
		padding: 20px 0;
	}
	.send{
		font-size: 60px;
	}
}