
/* CSS Document */

@charset "utf-8";
@import url("destyle.css"); 

/* All */
html{
	font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E;
	}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	}
body{
    color: #010101;
}
.wrapper{
	background-color: #fff;
	}
a:link, a:visited, a:hover, a:active{
	 text-decoration: none;
	color: #707070;
	}
a:hover{
	color: #707070;
	opacity: 0.7;
	transition: 0.3s all ease-out 0.1s;
	-webkit-transition: 0.3s all ease-out 0.1s;
	-moz-transition: 0.3s all ease-out 0.1s;
}

h1, h2, h3, p{
	color: #707070;
	letter-spacing: 0.09em;
}

h2{
	font-size: 2em;
}

.wrap{
}
header{
	background-color: #FFFFFF;
	display: flex;
	justify-content: space-between;
	height: 100px;
	width: 100vw;
	margin: 0;
	padding: 0;
}
#logo{
	width: 100px;
	margin-left: 50px;
}
/*==================================================
navのためのcss
===================================*/

.navmenu{
	display: flex;
	height: 100px;
/*	width: 50vw;*/
	margin: 0 100px 0 auto;
	float: right;
	z-index: 1;

}
.navmenu ul{
	text-align: center;
}
.navmenu ul li{
	width:  150px;
	display: inline-block;
	list-style-type: none;
	font-size: 1.5em;
	margin-top: 20px;
	line-height: 1.5em;
}
.navmenu ul li a{
	color: #707070;	
	font-weight: bold;
}

.navmenu ul #contactbtn{
	display: block;
	width: 180px; 
	padding: 15px 5px;
    background: linear-gradient(70deg, #FCFFB2, #D4F5FF);
	border-radius: 70px;
}
.nav-R{
	display: none;
}


/*==================================================
MVのためのcss
===================================*/
.main{
	clear: right;
	width: 100vw;

}
.mv{
	background-image: url();
	min-width: 1200px;
	z-index: 1;

}
.mv-R{
	display: none;
}
/*==================================================
スライダーのためのcss
===================================*/


/*==================================================
footerのためのcss
===================================*/
footer{
    background: #fff;
	display: block;
	text-align: left;
}
.oita-info{
	display: block;
	width: 1200px;
	margin: 50px auto;
}
footer h2{
	font-size: 25px;
}
.oita-info h2{
	text-align: center
}
.oita-info h2::before{
	content: " ";
	display: inline-block;
	width: 40px;
	height: 25px;
	background-image: url("../img/newsleft.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.oita-info h2::after{
	content: " ";
	display: inline-block;
	width: 40px;
	height: 25px;
	background-image: url("../img/newsright.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.oita-info #links{
	display: flex;
	justify-content: space-around;
	width: 1200px;
	margin: 50px auto;
}
.oita-info #links img{
	width: 280px;
}
.footer2{
	display: block;
	width: 100%;
	background: linear-gradient(70deg, #FCFFB2, #D4F5FF);
	text-align: left;
	margin-top: 10px;
	padding: 30px 20px;
}

.management{
	display: block;
	width: 1200px;
	margin: 50px auto;
	position: relative;
}
.pref h3{
	font-size: 1.3em;
	font-weight: bold;
	margin: 10px auto;
	line-height: 1.2em;
	padding-top: 30px;
}
.pref p{
	font-size: 1.1em;
	margin: 0 auto;

}
.corp a:link{
	color: #707070;
	font-weight: bold;
}
#sns{
	display: flex;
	justify-content: space-between;
	width: 200px;
	position: absolute;
	top: 0px;
	right: 50px;
}
#sns img{
	width: 50px;
}
#copyright{
	text-align: center;
	padding-top: 10px;
}
/*========= レイアウトのためのCSS ===============*/
ul{
  margin:0;
  padding: 0;
  list-style: none;
}

a{
  color: #fff;
}

a:hover,
a:active{
  text-decoration: none;
}

h1{
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-size:6vw;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fff;
}

.top_contents h2{
	padding:30px 0 10px 20px;
	background-image: url("../img/hbg.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left;
}

/*========= about CSS ===============*/

/*=================================*/

.mv{
	display: block;
	min-width: 1200px;
	height: auto;
	position: relative;
}
.mv img{
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}
#male{
	width: 280px;
	position: absolute;
	top: 80px;
	left: 10%;
}
#female{
	width: 280px;
	position: absolute;
	top: 130px;
	left: 25%;
}
.content{
	min-width: 1200px;
	margin: 0 auto;

}
.Tcontent{
	display: block;
	min-width: 1200px;
	background-image: url(../img/background.jpg);
	background-size: cover;
  background-position: center;
   background-attachment: fixed;
	padding-top: 80px;
	padding-bottom: 100px;
z-index: 0;
}
.content_width{
	display: block;
/*	width: 1200px;*/
	margin: 0 auto;
	z-index: 1;

}
.news{
	display: block;
	width: 750px;
	height: 400px;
	background-color: #fff;
	margin: 5px auto;
	padding: 50px;
	position: relative;
	z-index: 1;

}
#newsh{
	text-align: center;
	margin: 0 auto;
	font-size: 3rem;
}
#newsh::before{
	content: " ";
	display: inline-block;
	width: 70px;
	height: 45px;
	background-image: url("../img/newsleft.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
#newsh::after{
	content: " ";
	display: inline-block;
	width: 70px;
	height: 45px;
	background-image: url("../img/newsright.png");
	background-size: contain;
	background-repeat: no-repeat;
	vertical-align: middle;
}
.pflame{
	display: block;
	width: 750px;
	height: 400px;
	border: #FFCAD2 solid 3px;;
	position: absolute;
	top: 7px;
	left: 7px;
	z-index: 2;
}

.news ul{
	display: block;
	width: 85%;
	margin: 15px auto;
	z-index: 999;
	position: absolute;
	top: 40px;
	left: 10%;
	font-size: 1.2em;
}
.news li{
	z-index: 999;
	padding: 10px;
}
#lp_pc{
	display: block;
	width: 900px;
	margin: 100px auto;
	z-index: 1;

}
#lp_phone{
	display: none;
}
.Tabout{
	display: block;
}
.about_info{
	display: block;
	width: 1200px;
	margin: 100px auto;
	padding: 50px;
	background: rgba(255, 255, 255, 0.7);
}

.aboutoita, .information{
	min-width: 1100px;
	opacity: 1;
}
.aboutoita img{
	width: 300px;
	margin: auto 50px;
}
.about_dive{
	display: flex;
	flex-direction: row;
	margin: 50px 0;
}
.about-info{
	display: block;
	max-width: 60%;
	font-size: 1.2em;
	padding: 30px;
	background: rgba(255,202,210,0.3);
}
.step{
	display: flex;
	justify-content: space-around;
	margin: 50px 0;
	font-size: 1.2em;
}
.rstep{
	display: none;
}
.step a{
	display: block;
	width: 300px;
}
.step img{
	width: 300px;
}

.Tsupport{
	display: block;
	margin: 100px 0;
}
.support_info{
	display: block;
	width: 1200px;
	margin: 100px auto;
	padding: 50px;
	background: rgba(255, 255, 255, 0.7);
}

#comments{
	display: block;
	height: 600px;
	position: relative;
}
#comments img{
	width: 600px;
}
#comment1{
	display: block;
	width: 817px;
	position: absolute;
	top: 30px;
	left: 150px;
}
#comment2{
	display: block;
	width: 817px;
	position: absolute;
	top: 200px;
	right: 50px;
}
#comment3{
	display: block;
	width: 817px;
	position: absolute;
	top: 400px;
	left: 140px;
}
#rcomments{
	display: none;
}
.career{
	display: flex;
	justify-content: space-around;
	width: 1100px;
}

.advisor{
	width: 450px;
	
}
.advisor img{
	display: block;
	width: 250px;
	margin: 50px auto;
}
.career p{
	text-align: center;
}
.Pname{
	font-size: 1.3em;
	font-weight: bold;
}
.surtificate{
	font-size: 0.8em;
}
.Tsenior{
	width: 100vw;
}
.top_interview h2{
	display: block;
	width: 100vw;
	height: 100px;
	background-image: url("../img/th2bg.png");
	background-repeat: repeat-x;
	background-size: contain;
}
.top_interview h2{
	
}
.top_interview span img{
	width: 200px;
	margin-left: 10%;
}
.bottun{
	display: block;
	width: 300px;
	margin: 100px auto 200px;
	font-size: 1.5em;
	text-align: center;
	border-bottom: #FFCAD2 solid 3px;
}

/*==================================================
スライダーのためのcss
===================================*/
.slider{
	margin: 50px 0 100px;
}



.slider img {
    width:100%;/*スライダー内の画像を横幅100%に*/
    height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/

.slider .slick-slide {
    margin:0 10px;/*スライド左右の余白調整*/
}


.floating-banner1
{ position: fixed; /* バナーを固定位置に配置 */
right: 20px; /* 右端から20ピクセルの位置に設置 */
bottom: 150px; /* 下端から20ピクセルの位置に設置 */
z-index: 9999; /* 他の要素より前面に表示 */
display: block; /* ブロックレベル要素として表示 */ 
}
.floating-banner1 img
{ width: 130px; /* バナーの幅を150ピクセルに設定 */
height: auto; /* 高さを自動的に調整（アスペクト比を保つ） */ 
}
.floating-banner2
{ position: fixed; /* バナーを固定位置に配置 */
right: 20px; /* 右端から20ピクセルの位置に設置 */
bottom: 10px; /* 下端から20ピクセルの位置に設置 */
z-index: 9999; /* 他の要素より前面に表示 */
display: block; /* ブロックレベル要素として表示 */ 
}
.floating-banner2 img
{ width: 130px; /* バナーの幅を150ピクセルに設定 */
height: auto; /* 高さを自動的に調整（アスペクト比を保つ） */ 
}
.rfloating-banner1, .rfloating-banner2{
	display: none;
}


/* フェードイン*/
/* フェードイン用のCSS */
.slide-bottom {
   opacity: 0;
   transform: translateY(20px);
   transition: all 1.3s 0s ease-out;
 }