@charset "UTF-8";
.main_top{
	height: 465px;
	width: 100%;
	padding: 0 10%;
}
.inner{
	max-width: 1000px;
}
#about{
	margin: 70px auto 150px;
	padding: 0 50px;
}
#about h1{
		font-family: kawoszeh;
	font-weight: 100;
	font-size: 3.75rem;
	line-height: 1.2;
	text-align: center;
}
#about .introduce_box{
	height: 100%;
	margin-top: 73px;
	display: flex;
	justify-content: space-between;
}
#about .introduce_box img{
	height: 547px;
	margin-right: 45px;
}
#about .text_box{
	width: 350px;
	display: flex;
	flex-direction: column;
	align-items: center;
	overflow: hidden;
}
#about .text_box p{
	
		font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: 400;
	line-height: 1.2;
	margin-bottom: 180px;
}
#about .text_box a{
	text-decoration: none;
	color: #c1272d;	
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: 500;
	width: 90px;
	text-align: center;
	position: relative;
}
#about .text_box a .stroke_hover{
	width: 180px;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -60%);
}
#about .text_box a .stroke_hover path{
	stroke-dasharray:1400;
	stroke-dashoffset:1400;
}
/*---------------break points--------------*/

@media (max-width:850px){
	#about{
	margin: 70px auto 150px;
}
	#about .introduce_box{
		position: relative;
	}
#about .introduce_box img{
	height: 437px;
	max-width: 350px; 
}
	#about .text_box a{
		position: absolute;
		top: 570px;
		left: 50%;
		transform: translate(-50% , 0);
	}
	
}
@media (max-width:767px){

	#about .introduce_box{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	#about .introduce_box img{
		margin-right: 0;
	}
	#about .text_box P{
		margin: 80px 0 150px 0;
	}
	#about .text_box a{
		position: static;
		transform: none;
	}
	#about .text_box a .stroke_hover{
	top: 99%;
}
}