@charset "utf-8";


/**************************************************
 Responsive
**************************************************/
@media screen and (max-width: 690px){
	
	
	
/**************************************************
 loading
**************************************************/
.loading img:first-of-type{width: 60vw;}
.loading img:last-of-type{width: 38vw;}
	
	
	
/**************************************************
 common
**************************************************/
h2.common{
	width: 100%;
	font-size: 13.5vw;
	text-align: center;
	padding: 30px 0 0 0;
}
h2.common small{
	font-size: 4.0vw;
	padding: 15px 0 0 0;
}
h2.common::before{
	height: 6px;
	top: 0;
	left: calc(50% - 20px);
}

.btnHanger a{
	width: 55%;
	height: 50px;
	font-size: 1.8rem;
	margin: 0 auto;
}
.btnHanger a::before{
	width: 14px;
	height: 14px;
	top: calc(50% - 7px);
	background-size: 14px 14px;
}



/**************************************************
 visualHanger
**************************************************/
#visualHanger{
	height: calc(100vh + 45px);
	min-height: auto;
}

.visualCopy{
	width: 100%;
	top: calc(50% - 100px);
	left: 0;
	font-size: 5.5vw;
	letter-spacing: 1px;
	text-align: center;
}
.visualCopy span{padding: 8px;}

.recruitBtn{
	width: 100%;
	bottom: 160px;
	left: 0;
	text-align: center;
}
.recruitBtn a{
	width: 70%;
	height: 70px;
	margin: 0 auto;
	font-size: 2.2rem;
	letter-spacing: 1px;
	border-radius: 10px;
}
.recruitBtn a::before{
	width: 16px;
	height: 16px;
	top: calc(50% - 8px);
	background: url("../img/pointer1.svg") no-repeat 0 0;
	background-size: 100%;
}



/**************************************************
 main
**************************************************/
main{margin-top: 100vh;}



/**************************************************
 intro
**************************************************/
#intro{
	border-top-left-radius: 40px;
	border-top-right-radius: 40px;
	padding: 50px 0 170px 0;
}

#intro h2{
	font-size: 5.7vw;
	left: 0;
	padding: 0 20px 40px 20px;
}
#intro h2::before{
	width: 60px;
	height: 6px;
	left: calc(50% - 30px);
}

#intro p{
	margin-top: 30px;
	padding: 0 20px;
	font-size: 3.6vw;
	letter-spacing: 0;
	line-height: 2.4;
}

#intro .slideObj{bottom: 60px;}



/**************************************************
 company
**************************************************/
#company{
	padding: 50px 20px 60px 20px;
	border-radius: 40px;
}

#company p{
	position: static;
	font-size: 1.7rem;
	margin-top: 40px;
	text-align: center;
}

#company nav ul{margin-top: 30px;}
#company nav ul li{
	width: calc(50% - 10px);
	margin: 20px 20px 0 0;
}
#company nav ul li:nth-of-type(2n){margin: 20px 0 0 0;}
#company nav ul li a{
	font-size: 4.0vw;
	border-radius: 15px;
}
#company nav ul li a span{margin-bottom: 10px;}



/**************************************************
 history
**************************************************/
#history{
	padding: 50px 0 60px 0;
	overflow: hidden;
}

.historyCont{
	width: 100%;
	order: 1;
}
.historyCont h2.common{
	font-size: 10.5vw;
	padding: 30px 20px 0 20px;
}
.historyCont h2.common::before{top: 0;}
.historyCont p{
	font-size: 1.6rem;
	padding: 40px 20px 0 20px;
}
.historyCont .btnHanger{
	margin-top: 40px;
	padding-left: 0;
}

.historyBg{
	width: 100%;
	margin: 40px 0 0 0;
	order: 2;
	text-align: center;
	overflow: hidden;
}
.historyBg img{width: 90%;}



/**************************************************
 works
**************************************************/
#works{
	padding: 50px 20px 20px 20px;
	border-top-left-radius: 40px;
	border-top-right-radius: 40px;
}

#works nav ul{margin-top: 50px;}
#works nav ul li{width: 100%;}
#works nav ul li:last-of-type{margin-top: 20px;}
#works nav ul li a{
	height: 110px;
	padding: 0 20px;
	font-size: 4.2vw;
	border-radius: 15px;
}
#works nav ul li a::before{
	width: 20px;
	height: 20px;
	top: calc(50% - 10px);
	right: 20px;
	background-size: 20px 20px;
}
#works nav ul li a span{margin-right: 15px;}

#works h3{
	margin-top: 60px;
	font-size: 11.5vw;
}

.dataHanger{margin-top: 20px;}
.dataHanger dl{
	width: calc(50% - 10px);
	padding: 0 20px;
	border-radius: 15px;
	margin: 20px 20px 0 0;
}
.dataHanger dl:nth-of-type(2n){margin: 20px 0 0 0;}
.dataHanger dl dt{
	font-size: 3.2vw;
	padding-bottom: 20px;
}
.dataHanger dl dt::before{
	width: 40px;
	height: 4px;
	left: calc(50% - 20px);
}
.dataHanger dl dd{
	font-size: 12.5vw;
	padding-top: 15px;
}



/**************************************************
 news
**************************************************/
#news{padding: 90px 20px 100px 20px;}
#news::before{
	height: 41px;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
}

#news div{width: 100%;}

#news h2.common{width: 100%;}

#news ul{
	width: 100%;
	margin-top: 40px;
}
#news ul li a{
	padding: 20px 45px 20px 20px;
	font-size: 1.4rem;
	border-radius: 15px;
}
#news ul li a::before{right: 20px;}
#news ul li a small{
	font-size: 1.4rem;
	margin-bottom: 4px;
}
#news ul li a:hover::before{right: 20px;}

#news .btnHanger{position: static;}
	
	
	
}