@charset "utf-8";
body{
	display: none;
}

header{
	position: static;
}

header ul.nav li::after{
	background: #000;
}

#main{
	padding-bottom:70px;
}

#subBack{
	width:100%;
	min-width: 1280px;
	position: absolute;
	top:40px;
	left:0;
	height:0;
	z-index:1;
}

#subBack #sbInner{
	box-sizing: border-box;
	width:1200px;
	margin:40px auto 0;
	height:0;
	position: relative;
}

#subBack #sbInner .lineBox{
	width:1px;
	height:0;
	position: absolute;
	top:-40px;
	left:50%;
	background: #000;
}

#subBack #sbInner .border_tl{
	width:0;
	height:1px;
	background: #000;
	position: absolute;
	top:0;
	right:50%;
	transition: width 1s;
}

#subBack #sbInner.brd .border_tl{
	width:50%;
}

#subBack #sbInner .border_tr{
	width:0;
	height:1px;
	background: #000;
	position: absolute;
	top:0;
	left:50%;
	transition: width 1s;
}

#subBack #sbInner.brd .border_tr{
	width:50%;
}

#subBack #sbInner .border_l{
	width:1px;
	height:0;
	background: #000;
	position: absolute;
	top:0;
	left:0;
	transition: height 1s 1s;
}

#subBack #sbInner.brd .border_l{
	height:100%;
}

#subBack #sbInner .border_r{
	width:1px;
	height:0;
	background: #000;
	position: absolute;
	top:0;
	right:0;
	transition: height 1s 1s;
}

#subBack #sbInner.brd .border_r{
	height:100%;
}

#subBack #sbInner .border_bl{
	width:0;
	height:1px;
	background: #000;
	position: absolute;
	bottom:0;
	left:0;
	transition: width 1s 2s;
}

#subBack #sbInner.brd .border_bl{
	width:50%;
}

#subBack #sbInner .border_br{
	width:0;
	height:1px;
	background: #000;
	position: absolute;
	bottom:0;
	right:0;
	transition: width 1s 2s;
}

.session #subBack #sbInner .border_br,
#subBack #sbInner.brd .border_br{
	width:50%;
}

.session #subBack #sbInner .border_l,
.session #subBack #sbInner .border_r{
	height:100%;
	transition: none;
}

.session #subBack #sbInner .border_tr,
.session #subBack #sbInner .border_tl,
.session #subBack #sbInner .border_bl,
.session #subBack #sbInner .border_br{
	width:50%;
	transition: none;
}

#mainContainer{
	padding: 140px 0 0;
	position: relative;
	z-index:2;
}

/* mb140*/

.mb140{
	margin-bottom: 140px;
}

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

.mb140{
	margin-bottom: 70px;
}

}

#mainContainer h1.eng{
	text-align: center;
	font-family: 'Michroma','Arial Black',Arial;
	font-size:110%;
	letter-spacing: 0.4em;
}

#mainContainer h1.eng img{
	display:inline-block;
}

#mainContainer h1.jp{
	text-align: center;
	font-size:90%;
	font-weight: normal;
	letter-spacing: -1px;
}

#mainContainer .ivBox{
	opacity: 0;
	transform: translateY(50px);
	transition: all 500ms;
}

#mainContainer .ivBox.inview{
	opacity: 1;
	transform: translateY(0);
}

#mainContainer .ta_center{
	text-align: center;
}

.contactBtn{
	width:300px;
	margin:120px auto 0;
}

.contactBtn a{
	display:block;
	width:100%;
	padding:15px 0;
	background: #000;
	color: #FFF;
	text-align: center;
}

.contactBtn a:hover{
	background: #333;
}

.contactTel{
	width:1200px;
	margin:160px auto 0;
	padding-bottom:20px;
	border-bottom:1px solid #000;
	text-align: center;
}

.contactTel .pc{
	display: inline-block;
}

.examples {
	display: block;
	max-width: 567px;
	margin: 150px auto 0 auto;
}

.examples:hover {
	opacity: .6;
}

.examples img {
	width: 100%;
}

@media only screen and (max-width:640px){
	.examples {
		width: 90%;
	}
}

/* END animate */
@media only screen and (max-width:640px){

	#subBack{
		min-width:320px;
	}

	#subBack #sbInner{
		width:98%;
	}

	.contactTel{
		width:100%;
		margin:160px auto 0;
	}
}