/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

@charset('utf-8');

body{
	font-family: "Sawarabi Mincho";
	font-weight: lighter;
}

body,
h1,
h2,
h3,
h4,
p,
ul{
	margin: 0;
	padding: 0;
}

a{
	text-decoration: none;
}

li{
	list-style: none;
}


header{
	width: 100%;
	background: #16151e;
}

.sp{
	display: none;
}

.container{
	max-width: 1080px;
	margin: 0 auto;
	overflow: hidden;
}

.video-wrap{
  position: relative;
  overflow: hidden;
}

.video-wrap > div > video{
	width: 110%;
	margin: 0;
	padding: 0;
	z-index: -1;
}

.video-wrap > div{
	overflow: hidden;
}

.video-wrap > div::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.6);
	z-index: 2;
}

.video-wrap > img{
	position: absolute;
	top: 30px;
	left: 30px;
	width: 10%;
	z-index: 3;
}

.video-wrap > h1{
	position: absolute;
	top: 40%;
	font-size: 4.2vw;
	text-shadow: 5px 5px 15px #000;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 50%;
	z-index: 3;
	color: #fff;
	text-align: center;
	letter-spacing: 3px;
}

.video-wrap > h1::after{
	content: 'make the impossible possible';
	display: block;
	text-align: center;
	font-size: 1.8vw;
}


/* main1 */

#main1{
	background: #16151e;
	color: #fff;
	overflow: hidden;
}

#main1 > div{
	padding: 50px 0;
	overflow: hidden;
}

#main1 > div > h1{
	text-align: center;
	font-size: 40px;
	padding: 20px 0;
}

#main1__block{
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

#main1__block > div{
	width: 45%;
	overflow: hidden;
}

#main1__block > div li{
	font-size: .9rem;
}

#main1__block--left > div{
	width: 100%;
	height: 200px;
	background: url(../img/okgp01.png);
	background-size: cover;
	position: relative;
}

#main1__block--left > div > a{
	position: absolute;
	right: 0px;
	bottom: 5%;
	background: #000;
	color: #fff;
	padding: 10px 15px;
	-webkit-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
	transition: all .5s ease 0s;
}	

#main1__block--left > div > a:hover{
	background: #fff;
	color: #000;
	font-weight: bold;
}

#main1__block--left > p{
	margin-top: 30px;
}

#main1__block--left > ul{
	margin-top: 30px;
}

#main1__block--left > ul li:last-child{

}

#main1__block--right > div{
	width: 100%;
	height: 200px;
	background: url(../img/okgp05.jpg);
	background-size: cover;
	position: relative;
}

#main1__block--left > div > img,
#main1__block--right > div > img{
	position: absolute;
	width: 70%;
	left:0;
	right: 0;
	margin: 0 auto;
	top: 45%;
}

#main1__block--right > div > a{
	position: absolute;
	right: 0px;
	bottom: 5%;
	background: #000;
	color: #fff;
	padding: 10px 15px;
	-webkit-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
	transition: all .5s ease 0s;
}	

#main1__block--right > div > a:hover{
	background: #fff;
	color: #000;
	font-weight: bold;
}

#main1__block--right > p{
	margin-top: 30px;
}

#main1__block--right > ul{
	margin-top: 30px;
}

#main1__block--right > ul li:last-child{
	text-align: right;
}

#main1__block .okudo > div{
	background: url('../img/okudo_back02.jpg');
	background-size: cover;
	background-position: center center;
}

#main2{
	padding: 50px 0;
	position: relative;
}

/*#main2::after{
	content: '';
	position: absolute;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: url('../img/2007091.jpg');
	background-size: cover;
	background-position: center center;
	opacity: .2;
}*/

#main2 > div h1{
	text-align: center;
	letter-spacing: 5px;
	font-size: 40px;
	padding: 20px 0;
}

#main2 > div > p{
	width: 70%;
	margin: 0 auto;
}

#main2__block{
	display: flex;
	justify-content: space-around;
	background-size: cover;
	padding: 20px;
	overflow: hidden;
}

#main2__block > img{
	width: 30%;
	float: left;
}

#main2__block > div:nth-of-type(1){
	width: 45%;
}

#main2__block > div:nth-of-type(1) img{
	width: 80%;
	margin: 20px 0 0 0;
}

#main2__block > div:nth-of-type(2){
	width: 45%;
}

#main2__block > div dt{
	font-size: 120%;
	letter-spacing: 2px;
}

#main2__block > div dd{
	margin: 0 0 20px 0;
	border-bottom: 1px solid #333;
	padding-left: 70px;
}

#main2__block > div dd p{
	margin: 10px 0;
}

.top-recruit-banner{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	margin-top: 50px;
}

.top-recruit-banner a{
	display: inline-block;
	width: 85%;
	-webkit-transition: all .3s 0s ease;
	-o-transition: all .3s 0s ease;
	transition: all .3s 0s ease;
}

.top-recruit-banner a:hover{
	opacity: .6;
}

.top-recruit-banner a img{
	width: 100%;
}

.okudo-top > div{
	height: 600px;
	background: url('../img/okudo_back03.jpg');
	background-size: cover;
	background-position: center center;
	position: relative;
}

.okudo_photo > div{
	margin-top: 50px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.okudo_photo > div > div{
	width: 49%;
	text-align: center;
}

.okudo_photo > div > div > img{
	width: 100%;
}

.okudo_photo > div > div small{
	display: block;
	text-align: center;
}

.image01,
.image02,
.image03{
	position: absolute;
}

.image01,
.image02{
	top: 0;
	width: 55%;
}

.image01{
	left: 5%;
}

.image02{
	right: 5%;
}

.image03{
	width: 30%;
	top: 10%;
	left: 5%;
}

.youtube{
	text-align: center;
	margin: 20px 0 50px 0;
}

.youtube > a{
	display: inline-block;
	width: 60%;
	margin: 10px 0;
}

.youtube > a img{
	width: 100%;
}

/* footer */

footer{
	padding: 20px 0;
}

#footer1{
	background: #16151e;
	color: #fff;
}

#footer1 > h1{
	text-align: center;
	padding: 20px 0;
	letter-spacing: 3px;
}

#footer2 > h1{
	text-align: center;
	padding: 20px 0;
	letter-spacing: 3px;
}

#footer3{
	background: #16151e;
	padding: 50px 0;
}

#footer3 > div{
	text-align: center;
}


#footer4{
	background: #fff;
	padding: 20px 0;
}

#footer4 > img{
	width: 10%;
	float: left;
}

#footer4__right{
	width: 90%;
	overflow: hidden;
	margin-left: 15%;
}

#footer4__right > p{
	text-align: center;
	margin: 10px 0;
}

#footer4__right > ul{
}

#footer4__right > ul a li{
	color: #333;
}

#footer4__right li{
	display: inline-block;
	width: 19%;
	text-align: center;
	padding: 15px 0;
	font-size: 18px;
	border-bottom: 1px solid #fff;
}

#footer4__right > div{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

#footer4__right > div > p{
	width: 50%;
	line-height: 1.7;
	margin: 10px 0;
}

#footer4__right > div strong{
	font-weight: bold;
	font-size: 120%;
	text-decoration: underline;
}

.ad-logo > p{
	display:flex;
	justify-content: center;
}

.ad-logo > p img{
	width: 30%;
}