@charset "UTF-8";
/* CSS Document */
@media screen and (max-width:768px){
body:before{content: "";height: 100vh;width: 100vw;position: fixed;top: 0;left: 0;background: url("../img/MV_bg.jpg") center center no-repeat;background-size: cover;}
html {
-webkit-overflow-scrolling: touch;
}

.pc{display: none;}
.sp{display: block;}
.wrap{width: 80%;margin: 0 auto;}
.t_a_c_sp{text-align: center;}


.btn01, input[type="submit"].btn01{max-width: 240px;height: calc(12vw + 2px);line-height: 12vw;font-size: 3vw;}

#totop{position: fixed;right: 4vw;bottom: 50px; font-size: 14px;color: #000;z-index: 100;}
#totop span{position: relative;}
#totop span:before{content: "";display: block;width: 9px;
height: 48px;
border-top: 2px solid #000;
border-left: 1px solid #000;
transform: skewY(245deg);
position: absolute;
top: -55px;
right: -4px;
}

header{width: 100%;position: fixed;top: 0;height: 80px;z-index: 100;}
header h1{width: 70px; margin: 0 0 0 20px;padding: 20px 0 0 0;}

/*.up header{background: #fff;}*/






#sec01{width: 100%;height: 100vh;background: none;position: relative;z-index: 1;}
#sec01:before{position: absolute; content: "";width: 1px;height: 105px;display: block; background: #fff; bottom: 0;
  left: 50%;
  transform: translateY(0) translateX(-50%);
  -webkit- transform: translateY(0) translateX(-50%);}
#sec01 h1{font-size: 9vw;font-weight: bold;text-align: center;color: #fff; white-space: nowrap;text-transform: uppercase;;position: absolute;
	top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);}
#sec01 .text01{font-size: 14px;font-weight: 400;text-align: center;color: #fff; white-space: nowrap;text-transform: uppercase;;position: absolute;
	bottom: 118px;
  left: 50%;
  transform: translateY(0) translateX(-50%);
  -webkit- transform: translateY(0) translateX(-50%);}

#sec02{padding: 60px 0 70px 0;position: relative;background: #fff;text-align: center;}
#sec02 h1.en{font-size: 5vw;color: #000;margin: 0 0 50px 0;}
#sec02 h2.en{font-size: 6vw;border-bottom: 4px solid #000;color: #000;display: inline-block;text-transform: uppercase;padding: 0 0 8px 0;margin: 80px 0 0 0;}

#sec02 .box01 h2.en{margin: 60px 0 0 0;}

	.slider .slick-slide{width: 100vw;margin: 0 20px;}
	.slider .slick-dots{bottom: -45px;}
	.slider .slick-dots li button:before{font-size: 12px;}
	#sec02 .text01{font-size: 3vw;line-height: 1.7;margin: 40px 0 40px 0;}
	#sec02 .btn01{margin: 0 auto 70px;}
	#sec02 .box03 .btn01{margin: 0 auto;}
	#sec02 .btn01.insta{display: flex;justify-content: center;}
	#sec02 .btn01.insta span{width: 18px;display: flex;align-items: center;margin: 0 10px 0 0;position: relative;}
	#sec02 .btn01.insta span:before{content: ""; position: absolute;width: 18px;height: 18px;background: url("../img/head_icon.png") center center no-repeat;background-size: cover;}

#sec03{position: relative;z-index: 1;display: flex;justify-content: center;align-items: center; width: 100%;height: 48vw; background: url("../img/company_image.jpg") center center;background-size: cover;}
#sec03 h1.en a{font-size: 5vw;color: #fff;}	

	footer{position: relative;z-index: 1;text-align: center;color: #fff;padding: 60px 0 55px 0;}
	footer h1{width: 13vw;margin: 0 auto;}
	footer .text01{font-size: 15px;margin: 25px 0 15px 0;}
	footer .text02{font-size: 13px;line-height: 23px;margin: 0 0 28px 0;}
	footer small.en{font-size: 12px;font-weight: normal;display: block;text-align:center; }

	

#sec06 .wrap{position: relative;}
#sec06 .box01{}
#sec06 table{width: 100%;}
#sec06 th{font-weight: normal;text-align: left;width: 100%;vertical-align: top;padding: 5px 0 0 0;float: left;margin: 0 0 15px 0;}
#sec06 td{float: left;width: 100%;}
#sec06 td input{font-size: 16px; width: 100%;border: none;background: #eee;padding: 15px;margin: 0 0 30px 0;border-radius: 0;}
#sec06 td textarea{font-size: 16px; width: 100%;border: none;background: #eee;resize: vertical;height: 216px;padding: 15px;border-radius: 0;}
#sec06 .text01{text-align: center;margin: 50px 0;font-size: 16px; line-height: 30px;}
#sec06 .text02{margin: 20px 0 70px 0;color: #808080;}
#sec06 .text03{border-top: 1px solid #a0a0a0;border-bottom: 1px solid #a0a0a0;padding: 25px 0;margin:60px 0;color: #808080;font-size: 14px;line-height: 26px;}
#sec06 input[type="submit"].btn01{margin: 0 auto;display: block;}

	
.up section{background: #fff;padding: 150px 0 70px 0;position: relative;z-index: 1;}
.up .wrap{width: 90%;margin: 0 auto;}
.up h1.en{text-align: center;font-size: 6vw;font-weight: 500;padding: 0 0 60px 0;border-bottom: 3px solid #000;margin: 0 auto;color: #000;}
.up #sec06.thanks{text-align: center;padding: 150px 0 140px 0;}
#sec06.thanks h2{font-size: 8vw;font-weight: 700;color: #000;margin: 140px 0 0 0;}
#sec06.thanks .text04{font-size: 16px;line-height: 30px;margin: 30px 0 50px 0;}
#sec06.thanks .btn01{margin: 0 auto;}
#sec06 table{width: 100%;}
#sec06 th{font-weight: normal;text-align: left;width: 245px;vertical-align: top;padding: 12px 0 0 0;}
#sec06 th span{color:#fff;background: #e60012;font-size: 12px;padding: 2px 8px;margin: 0 0 0 12px;}
	
	
#company table{width: 100%;line-height: 1.7;}
#company table th{width: 100%;float: left; text-align: left;font-weight: normal;padding: 20px;}
#company table td{width: 100%;float: left; text-align: left;padding: 0 20px 20px 20px;}
#company table tr{border-bottom: 1px solid #d2d2d2;}
	

/*ハンバーガーメニュー*/
#nav-toggle {
position: fixed;
cursor: pointer;
top:30px;
right: 20px;
}
#nav-toggle p{margin: 55px auto 0;font-size: 20px;}
#nav-toggle > div {
position: relative;
width: 30px;
}
#nav-toggle span {
width: 100%;
height: 1px;
left: 0;
display: block;
background: #fff;
position: absolute;
transition: top .5s ease, -webkit-transform .6s ease-in-out;
transition: transform .6s ease-in-out, top .5s ease;
transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;
}
	.up #nav-toggle span{background: #000;}
#nav-toggle span:nth-child(1) {
top: 0;
}
#nav-toggle span:nth-child(2) {
top: 7px;
}
#nav-toggle span:nth-child(3) {
top: 14px;
}


.open #nav-toggle span {
background: #000;
}
.open #nav-toggle span:nth-child(1) {
top: 8px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.open #nav-toggle span:nth-child(2) {
top: 8px;
width: 0;
left: 50%;
}
.open #nav-toggle span:nth-child(3) {
top: 8px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
width: 100%;
}

/* z-index */
#nav-toggle {
z-index: 1000;
height: 20px;
}

#container {
z-index: 900;
}

#gloval-nav {
background: #ebe8e1;
font-weight: 500;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 990;
text-align: center;
display: flex;
visibility: hidden;
flex-direction: column;
/*justify-content: center;*/
align-items: center;
font-size: 3vw;
opacity: 0;
transition: opacity .6s ease, visibility .6s ease;
overflow-y: scroll;
text-align: start;
}

#gloval-nav a {
color: #404040;
text-decoration: none;
transition: color .6s ease;
}
#gloval-nav ul a {font-size: 4vw;font-weight: 500;}

#gloval-nav ul .lang a{background: #dfdcd4;padding: 5px 8px;font-size: 3vw;display: inline-block;}

#gloval-nav ul{
width: 65%;
margin: auto;
font-weight: normal;
}

#gloval-nav ul li {
text-align: center;
float: left;
opacity: 0;
width: 100%;
padding: 20px 0;
}
#gloval-nav ul li img{width: 8%;}
/* open */
.open {
overflow: hidden;
}
.open #gloval-nav {
visibility: visible;
opacity: 1;
}
.open #gloval-nav li {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
transition: opacity .9s ease, -webkit-transform 1s ease;
transition: transform 1s ease, opacity .9s ease;
transition: transform 1s ease, opacity .9s ease, -webkit-transform 1s ease;
}


.delay03_sp{animation-delay: 0.6s;}
.delay04_sp{animation-delay: 0.8s;}

}