.breadcrum{
	font-size: 13px;
	font-family: wavehaus-book;
}
.breadcrum a{
	border-bottom: 1px solid transparent;
	line-height: 1.5;
	display: inline-block;
}
.breadcrum a:hover{
	border-bottom: 1px solid #43BEE8;
}
.breadcrum span{
	display: inline-block;
	margin: 0 10px;
}
.i-line{
	margin-bottom: 80px;
}
/*animation*/
.graphic,
#graphic1,
#graphic12{
	height: 232px;
	width: 100%;
	position: relative;
	margin: 0 0 30px 0;
}
#a13abox,
#a12abox{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	height: 98px;
	font-size: 0;
	width: 1000px;
	overflow: hidden;
}
#a13-arrow,
#a12-arrow{
	height: 98px;
	position: absolute;
}
#a12t1{
	position: absolute;
	left: 0;
	top: 35px;
}
#a12t2{
	position: absolute;
	left: 20%;
	top: 74%;
}
#a12t3{
	position: absolute;
	left: 41%;
	top: 35px;
}
#a12t4{
	position: absolute;
	left: 61%;
	top: 74%;
}
#a12t5{
	position: absolute;
	left: 81%;
	top: 35px;
}
#a1-arrow,
#a12-arrow,
#a13-arrow{
	/*max-width: 900px;*/
}
#a1t2{
	left: 20%;
	top: 74%;
}
#a1t3{
	left: 41%;
}
#a1t4{
	left: 61%;
	top: 74%;
}
#a1t5{
	left: 82%;
}
#a13t1{
	position: absolute;
	left: 0;
	top: 0;
}
#a13t2{
	position: absolute;
	left: 20%;
	top: 74%;
}
#a13t3{
	position: absolute;
	left: 41%;
	top: 0;
}
#a13t4{
	position: absolute;
	left: 61%;
	top: 74%;
}
#a13t5{
	position: absolute;
	left: 82%;
	top: 0;
}
.bold{
	font-family: wavehaus-bold;
}
#ivstbg{
	position: absolute;
	z-index: -1;
	width: calc((100% + 44px) / 12 * 7 - 44px) ;
	left: 0px;
	top: 42px;
}
.list-item{
	transition: unset!important;
}
#list{
	z-index: 2!important;
}
.animate4toplinetext{
	top: 15px!important;
}

#a1-arrow,
#a12-arrow,
#a13-arrow{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 82%;
	z-index: 1;
	height: auto;
}
#a13abox,
#a12abox,
#a1abox{
	background:#fff;
	z-index: 2;
	left: unset;
	right: 0;
    width: 100%;
    visibility: visible!important;
}
.enlarge{
	animation-name: enlarge;
	animation-fill-mode: forwards;
}
@keyframes enlarge{
	0%{
		width: 100%;
	}
	100%{
		width: 0%;
	}
}
@keyframes enlarge2{
	0%{
		width: 0%;
	}
	100%{
		width: 100%;
	}
}
.drawsvg.animated svg{
	animation-name: drawsvg;
	animation-duration: 3s;
}
@keyframes drawsvg{
	0%{
		stroke-dashoffset: 700;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
#a2-graph{
	width: 100%;
}
#a2-lines{
	/*display: none;*/
}
#a2abox{
	height: 100%;
	left: 0;
	top: 0;
	/*background: url("img/lines2.png") no-repeat;*/
	/*background-position: left;*/
	/*background-size: cover;*/
}
#a2-g-box{
	font-size: 0px;
}
#a2t1{
	top: 105%;
	left: 16.5%;
	width: 18%;
}
#a2t2{
	top: 105%;
	left: 43.53%;
	width: 18%;
}
#a2t3{
	top: 105%;
	left: 70.63%;
	width: 18%;
}
.sample-lines{
	width: 100%;
}
#graphic2{
	margin: 30px 0 100px 0;
	height: unset;
}

.a4-text{
	left: calc(100% - 23vw);
	width: 23vw;	
}
#a4svg,
#a4svg2,
#a4svg3{
	width: 70%!important;
}

.wow.svg1.animated polygon{
	animation-name: svg1polygon;
	animation-duration: 3s;
}
@keyframes svg1polygon{
	0%{
		stroke-dashoffset: 1400;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
.wow.svg1.animated path{
	animation-name: svg1path;
	animation-duration: 3s;
}
@keyframes svg1path{
	0%{
		stroke-dashoffset: 350;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
.wow.svg1.animated #svg1pdown{
    animation-name: svg1pdown;
	animation-duration: 3s;
}
@keyframes svg1pdown{
	0%{
		transform: translateY(-60px);
		stroke-dashoffset: 350;
	}
	100%{
		transform: translateY(0px);
		stroke-dashoffset: 0;
	}
}
.wow.svg1.animated #svg1pup{
    animation-name: svg1pup;
	animation-duration: 3s;
}
@keyframes svg1pup{
	0%{
		transform: translateY(60px);
		stroke-dashoffset: 350;
	}
	100%{
		transform: translateY(0px);
		stroke-dashoffset: 0;
	}
}


.wow.svg2.animated polygon{
	animation-name: svg2polygon;
	animation-duration: 3s;
}
@keyframes svg2polygon{
	0%{
		stroke-dashoffset: 1500;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
.wow.svg2.animated #a4svg2{
	animation-name: svg2a4svg2;
	animation-duration: 3s;
}
@keyframes svg2a4svg2{
	0%{
		transform: scale(0.9);
	}
	100%{
		transform: scale(1);
	}
}


.wow.svg3.animated polygon{
	animation-name: svg3polygon;
	animation-duration: 3s;
}
@keyframes svg3polygon{
	0%{
		stroke-dashoffset: 1150;
	}
	100%{
		stroke-dashoffset: 0;
	}
}
.wow.svg3.animated #svg3up{
	animation-name: svg3up;
	animation-duration: 3s;
}
@keyframes svg3up{
	0%{
		stroke-dashoffset: 1150;
		transform: translate(-60px, 60px);
	}
	100%{
		stroke-dashoffset: 0;
		transform: translate(0px, 0px);
	}
}
.wow.svg3.animated #svg3down{
	animation-name: svg3down;
	animation-duration: 3s;
}
@keyframes svg3down{
	0%{
		stroke-dashoffset: 1150;
		transform: translate(60px, -60px);
	}
	100%{
		stroke-dashoffset: 0;
		transform: translate(0px, 0px);
	}
}



@media(min-width: 2400px){
	.graphic,
	#graphic1,
	#graphic12{
		height: 292px;		
	}
}
@media(max-width: 910px){
	.a4-text{
		left: calc(100% - 50vw);
		width: 50vw;	
	}
	#list{
		display: none;
	}
	.i-line{
		margin-bottom: 40px;
	}
	#ivstbg{
		width: calc(100% - 100px);
	}
}
@media(max-width: 650px){
	.breadcrum{
		display: none;
	}
	.enlarge650{
		margin-bottom: 15px;
	}
	.row .row{
		margin: 0 -22px;
	}
	.svgbox{
		width: calc(100% - 50px);
	}
	.a3-text-box{
		width: 100%;
		left: 0;
		top: calc(100% - 36px);
	}
	.a3-title{
		font-size: 30px;
		margin-bottom: 15px;
	}
	#a3t1 svg,
	#a3t2 svg,
	#a3t3 svg{
		height: 100px;
		width: auto;
	}
	.i-line{
		margin-bottom: 30px;
	}
	#a4svg, #a4svg2, #a4svg3{
		width: 100%!important;
	}
	.a4-title{
		font-size: 40px;
		top: 70px;
	}
	.a4-text{
		font-size: 12px;
		left: 0;
		width: 100%;
		bottom: 30px;
	}
	.graphic,
	#graphic12,
	#graphic1{
		height: 764px;
	}
	.mobileArrow-box{
		overflow: hidden;
	}
	.mobileArrow{
		
		height: 764px;
	}
	.enlargeMobile{
		animation-name: enlargeMobile;
		animation-fill-mode: forwards;
	}
	@keyframes enlargeMobile{
		0%{
			height: 0%;
		}
		100%{
			height: 100%;
		}
	}
	#a1t3,
	#a1t5,
	#a1t1{
		left: 110px;
	}
	#a1t1{
		top: -12px;
	}
	#a1t3{
		top: calc(50% - 12px);
	}
	#a1t5{
		top: calc(100% - 12px);
	}
	.graphic-row{
		padding: 20px 0 40px 0;
	}
	#graphic2{
		margin-top: 0;
	}
	.sample-text{
		white-space: nowrap;
	}
	#a13t1,
	#a12t1{
		left: 110px;
		top: -12px;
	}
	#a1t2,
	#a13t2,
	#a12t2{
		left: 40px;
		top: calc(25% - 12px);
	}
	#a13t3,
	#a12t3{
		left: 110px;
		top: calc(50% - 12px);
	}
	#a1t4,
	#a13t4,
	#a12t4{
		left: 40px;
		top: calc(75% - 12px);
	}
	#a13t5,
	#a12t5{
		left: 110px;
		top: calc(100% - 12px);
	}
}