@charset "UTF-8";
/****************************************
	main
****************************************/
main {
	margin-top:70px;
}

section#main-back {
	position:relative;
	height:80vh;
	background: url(../img/back.jpg) no-repeat;
	background-position:center center;
	background-size:cover;
	overflow:hidden;
}

section#main-back .content {
	height:100%;
}


section#main-back .flex {
	justify-content:center;
	align-items:center;
	height:100%;
}

section#main-back .main-img-space {
	width:40%;
	height:100%;
}


section#main-back .main-img {
	width:60%;
}

section#main-back .main-img img {
    width:100%;
	max-height:100%;
}

section#main-back .main-title {
	position:absolute;
	top:40%;
	left:3%;
	font-size:48px;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
	-1px 1px 0 #FFF, 1px -1px 0 #FFF,
	0px 1px 0 #FFF,  0-1px 0 #FFF,
	-1px 0 0 #FFF, 1px 0 0 #FFF;
}

section#main-back .main-sub-title {
	position:absolute;
	bottom:10%;
	right:3%;
	font-size:18px;
	color: #000;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
	-1px 1px 0 #FFF, 1px -1px 0 #FFF,
	0px 1px 0 #FFF,  0-1px 0 #FFF,
	-1px 0 0 #FFF, 1px 0 0 #FFF;
}

section#company {
	position:relative;
	padding:70px 5% 0px;
}

section#company table {
	width:100%;
}

section#company th {
	width:20%;
	padding:15px 10px; 
	text-align:left;
	vertical-align:top;
	font-weight:400;
	border-bottom:1px solid #a0a0a0;
	background:#f9f9f9;
}

section#company td {
	width:80%;
	padding:15px 10px; 
	text-align:left;
	vertical-align:top;
	font-weight:400;
	border-bottom:1px solid #a0a0a0;
	background:#f9f9f9;
}

section#company td a {
	display:inline-block;
}

section#business {
	position:relative;
	padding:70px 5% 0px;
}

section#business dt {
	border-left:7px solid #020f05;
	padding:5px 5px 5px 10px;
	margin:15px 0px 0px;
	background:#f9f9f9;
}

section#business dd {
	padding:10px 5px 5px 17px;
}

section#business dd .b-img {
	float:right;
	width:40%;
	padding:5px 5px 5px 20px;
	text-align:center;
}

section#business dd .b-img img {
	width:100%;
}

section#works {
	position:relative;
	padding:70px 5% 0px;
}

section#works dl {
	margin-bottom:30px;
}

section#works dt {
	padding:10px 20px 10px 20px;
	background:#f4f4f4;
	font-size:14px;
}

section#works dd {
	padding:10px 20px 10px 20px;
	background:#fff;
	font-size:14px;
}

section#contact {
	position:relative;
	padding:40px 5% 70px;
}

section#contact .contact-area {
	width:100%;
	padding:5px;
}

section#contact .contact-area .contact-info {
	padding:0px 0px 20px;
}

section#contact .contact-area .contact-map {
}

section#contact .contact-area .contact-map iframe {
	width:100%;
	height:300px;
}

section#contact .contact-box {
	margin-top:30px;
	border:1px solid #303030;
}

section#contact .contact-box .contact-box-info {
	width:60%;
	padding:10px;
}

section#contact .contact-box .contact-box-info span {
	display:inline-block;
}

section#contact .contact-box .contact-box-img {
	width:40%;
	font-size:0;
}

section#contact .contact-box .contact-box-img img {
	width:100%;
}


@media screen and (max-width:768px){

	section#main-back .main-img-space {
		width:0%;
	}
	
	section#main-back .main-img {
		width:100%;
	}
	
	section#main-back .main-title {
		top:10%;
		left:3%;
		font-size:24px;
	}
	
	section#main-back .main-sub-title {
		bottom:10%;
		right:auto;
		left:3%;
		font-size:16px;
	}

	section#business dd .b-img {
		float:none;
		width:100%;
		padding:5px;
	}
	
	section#business dd .b-img img {
		width:80%;
	}
	
	section#contact .contact-area {
		width:100%;
	}


	section#contact .contact-box .contact-box-info {
		width:100%;
	}
	
	section#contact .contact-box .contact-box-img {
		width:100%;
	}
	

}


@media screen and (max-width:480px){



	section#company th {
		display:block;
		width:100%;
		padding:15px 10px 5px; 
		text-align:left;
		vertical-align:top;
		font-weight:600;
		border-bottom:none;
		background:#f9f9f9;
	}

	section#company td {
		display:block;
		width:100%;
		padding:5px 10px 15px; 
		text-align:left;
		vertical-align:top;
		font-weight:400;
		border-bottom:1px solid #a0a0a0;
		background:#f9f9f9;
	}
}