@charset "UTF-8";


.fo_m{
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

h1{
color: #fff;
font-size: 50px;
font-weight: 600;
text-align: center;
line-height: 120%;
letter-spacing: 0.1em;
padding-top: 100px;
}

h1 span{
display: block;
font-size: 20px;
text-align: center;
margin-top: 10px;
}

h2{
font-size: 65px;
margin-bottom: 30px;
font-weight: 500;
}
h2 span{
display: block;
font-size: 18px;
font-weight: 700;
letter-spacing: 0.07em;
color: #0053a8;
}
@media only screen and (max-width:767px) {
h2{font-size:50px;}
h2 span{font-size: 16px;}
}


h3{
font-size: 28px;
font-weight: 500;
color: #0053A3;
margin-bottom: 30px;
line-height: inherit;
}

h4{
font-size: 20px;
font-weight: 500;
display: inline-block;
position: relative;
padding-left: 55px;
margin-bottom: 20px;
width: 100%;
}

h4:before{
content: "";
position: absolute;
top: 13px;
left: 0;
width: 40px;
height: 5px;
background-color: #0053A3;
}

h4:after{
content: "";
position: absolute;
top: 13px;
left: 20px;
width: 20px;
height: 5px;
background-color: #89D6EA;
}

h4 span{
display: inline-block;
font-weight: 500;
}



/* ----------------------------------------
	#　トップページ
---------------------------------------- */
#wrap{
width: 100%;
letter-spacing: 0.05em;
position: relative;
}

.pc{display: inline-block;}
.tab{display: none;}
.smp{display: none;}
@media only screen and (max-width:767px) {
.pc{display: none;}
.smp{display: block;}
}


/* ----------------------------------------
	#　ヘッダーメニュー
---------------------------------------- */
header{
width: 100%;
height: 90px;
background-color: rgba(255, 255, 255, 0.9);
position: fixed;
top: 0;
left: 0;
z-index: 9999;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 30px;
}
@media only screen and (max-width:1024px) {
header{
height: 70px;
}
}

.submenu{
width: 100%;
}

#head_menu{
width: 100%;
padding: 0 30px;
display: flex;
justify-content: space-between;
align-items: center;
}
@media only screen and (max-width:1024px) {
#head_menu{
width: 100%;
padding: 0;
flex-direction: column;
}
}

.head_img{
width: 250px;
}
@media only screen and (max-width:1024px) {
.head_img{
width: 200px;
margin: 0 auto;
}
}

#head_menu ul{
min-width: 500px;
display: flex;
justify-content: space-between;
}
@media only screen and (max-width:1024px) {
#head_menu ul{
min-width: 100%;
}
}

#head_menu ul li a{
font-size: 18px;
padding: 10px 0;
font-weight: 500;
}
@media only screen and (max-width:1024px) {
#head_menu ul li a{
display: block;
width: 100%;
padding: 25px 10px;
text-align: center;
}
}

.sub_content{
width: 130px;
display: flex;
justify-content: space-between;
margin-left: auto;
}

.sub_content a{
width: 60px;
height: 60px;
background-color: #014994;
text-align: center;
}

.sub_content a img{
width: 25px;
}

.sub_content a span{
color: #fff;
font-size: 10px;
letter-spacing: 0;
}

header a,
footer a{
transition: all .3s;
}

header a:hover,
footer a:hover{
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}

.lightbox{
display: none;
}

#content{
width: 100%;
position: relative;
overflow: hidden;
}


/* ----------------------------------------
	#　スライダー
---------------------------------------- */
#slider{
position: relative;
padding-top: 90px;
padding-bottom: 100px;
}
@media only screen and (max-width:1024px) {
#slider{
padding-top: 70px;
}
}

.slider_box{
position: relative;
z-index: 2;
width: 92%;
max-width: 1500px;
margin-left: auto;
display: flex;
}

.top_txt{
width: 140px;
margin-right: 50px;
text-align: center;
display: flex;
align-items: flex-end;
}
@media only screen and (max-width:1024px) {
.top_txt{
width: 100%;
max-width: 200px;
padding: 25px 15px;
margin-right: 0;
position: absolute;
left: 10px;
bottom: 0;
z-index: 3;
align-items: center;
filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(3773%) hue-rotate(270deg) brightness(125%) contrast(110%);
}
}
@media only screen and (max-width:767px) {
.top_txt{
max-width: 110px;
height: 50vh;
}

.top_txt img{
height: 100%;
width: auto;
}
}

.splide{
flex: 1;
width: 85%;
}

.splide li{
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
overflow: hidden;
}

.splide img{
object-fit: cover;
object-position: center center;
height: 100%;
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
}

@media only screen and (max-width:1024px) {
.splide__slide:before{
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: linear-gradient(90deg, #000, transparent);
opacity: 0.3;
}
}


#top_corp{
position: relative;
z-index: 2;
}

.top_corp_box{
width: 92%;
max-width: 1000px;
margin: 0 auto 100px;
padding-bottom: 200px;
position: relative;
text-align: right;
font-size: 20px;
}
@media only screen and (max-width:1024px) {
.top_corp_box{
padding-bottom: 0;
}
}
@media only screen and (max-width:767px) {
.top_corp_box{
font-size: 18px;
}
}

.top_corp_inner{
display: inline-block;
}
@media only screen and (max-width:1024px) {
.top_corp_inner{
display: block;
}
}

.top_corp_box p{
line-height: 200%;
margin-bottom: 30px;
}
@media only screen and (max-width:1024px) {
.top_corp_box p{
text-align: center;
}
}

a.ReadMore{
width: 100%;
max-width: 300px;
margin-left: auto;
display: block;
text-align: right;
position: relative;
color: #0053a8;
font-weight: 700;
font-size: 20px;
padding: 10px 50px 10px 10px;
}

a.ReadMore:after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: #0053a8;
transform: scale(1, 1);
transform-origin: left top;
transition: transform .5s;
}

a.ReadMore:hover:after{
transform: scale(0, 1);
transform-origin: right top;
}

a.ReadMore:before{
content: '';
position: absolute;
top: 50%;
right: 15px;
width: 7px;
height: 7px;
border-top: 2px solid #0053a8;
border-right: 2px solid #0053a8;
transform: translate(0,-50%) rotate(45deg);
}

.corp_img{
position: absolute;
max-width: 700px;
bottom: 0;
left: -10%;
}
@media only screen and (max-width:1024px) {
.corp_img{
position: initial;
margin: 50px auto 0;
}
}

#top_2nd_menu{
position: relative;
z-index: 2;
}

.top_menu_box{
width: 92%;
max-width: 1200px;
margin: 0 auto 100px;
position: relative;
z-index: 2;
}

.top_menu_box ul{
display: flex;
justify-content: space-between;
}
@media only screen and (max-width:1024px) {
.top_menu_box ul{
flex-direction: column;
}
}

.top_menu_box ul li{
width: calc(33% - 20px);
}
@media only screen and (max-width:1024px) {
.top_menu_box ul li{
width: 100%;
margin-bottom: 50px;
display: flex;
align-items: center;
}
.top_menu_box ul li:last-child{
margin-bottom: 0;
}
}
@media only screen and (max-width:767px) {
.top_menu_box ul li{
flex-direction: column;
}
}

@media only screen and (max-width:1024px) {
.menu_img{
width: 60%;
max-width: 500px;
}
}
@media only screen and (max-width:767px) {
.menu_img{
width: 100%;
}
}

.top_menu_box ul li img{
height: 60vw;
max-height: 300px;
object-fit: cover;
}

.top_menu_txt{
margin-top: 20px;
}
@media only screen and (max-width:1024px) {
.top_menu_txt{
flex: 1;
margin-top: 0;
margin-left: 30px;
}
}
@media only screen and (max-width:767px) {
.top_menu_txt{
width: 100%;
margin-left: 0;
margin-top: 20px;
}
}

.menu_name{
margin-bottom: 15px;
font-size: 25px;
font-weight: 500;
text-align: center;
}


.maru{
width: 100vw;
height: 100vw;
background: #cbefee;
border-radius: 50%;
position: absolute;
z-index: 0;
}

.maru.abs01{
width: 50vw;
height: 50vw;
max-width: 250px;
max-height: 250px;
top: 8%;
left: 10%;
}
.maru.abs02{
max-width: 430px;
max-height: 430px;
top: 23%;
left: -5%;
}
.maru.abs03{
max-width: 600px;
max-height: 600px;
bottom: 12%;
right: -5%;
opacity: 0.5;
}
@media only screen and (max-width:1024px) {
.maru.abs01{
top: 3%;
left: 5%;
}
.maru.abs02{
top: 15%;
}
}
@media only screen and (max-width:767px) {
.maru.abs01{
display: none;
}
 .maru.abs02{
top: 50vw;
left: -20vw;
}
.maru.abs03{
bottom: 115vh;
right: -25vw;
}
}


/* ----------------------------------------
	#　フッター
---------------------------------------- */
footer{
background-color: #fff;
border-top: 10px solid #0053A9;
padding: 50px 0;
font-size: 14px;
position: relative;
}

.foot_box{
width: 1000px;
margin: 0 auto;
display: flex;
justify-content: space-between;
}

.foot_l{
width: 38%;
}

.foot_l p{
padding: 0 10px;
}

.foot_l p:first-of-type{
border-bottom: 1px dashed #999999;
padding-bottom: 10px;
margin-bottom: 10px;
margin-top: 20px;
}

.foot_r{
width: 57%;
display: flex;
flex-wrap: wrap;
}

ul.foot_r_inner{
width: 23%;
}

ul.foot_r_inner li{
margin-left: 10px
}

.foot_r_inner a{
display: block;
margin-bottom: 5px;
}

.foot_r_inner span a{
color: #0053A9;
font-weight: 500;
}

.copy{
width: 100%;
font-size: 13px;
display: flex;
align-items: flex-end;
justify-content: flex-end;
}


#topBtn {
position: fixed;
bottom: 20px;
right: 20px;
display: block;
text-align: center;
z-index: 99;
border-radius: 5px;
}

.topBtn {
width: 55px;
height: 55px;
position: relative;
display: inline-block;
background-color: #0053A3;
color:#fff;
vertical-align: middle;
}

.topBtn:before,
.topBtn:after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}

.topBtn:before {
left: 20px;
top: 10px;
width: 15px;
height: 15px;
border-top: 2px solid #fff;
border-left: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}




/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●　タブレット　769〜1024　●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
@media screen and ( max-width : 1024px ) {

.pc{
}

.tab{
display: block;
}

.smp{
display: none;
}

/* ----------------------------------------
	#　ヘッダーメニュー
---------------------------------------- */
.submenu{
padding: 0 15px
}


/* ----------------------------------------
	#　企業理念
---------------------------------------- */
#content{}

#top_corp{}


/* ----------------------------------------
	#　トップコンテンツ
---------------------------------------- */
#top_content{}

.top_con_box{
width: 95%;
}


/* ----------------------------------------
	#　私たちの働く環境
---------------------------------------- */
#top_dist{}


/* ----------------------------------------
	#　フッター
---------------------------------------- */
footer{}

.foot_box{
width: 92%;
}

.foot_l{
width: 47%;
}

.foot_r{
width: 48%;
}

ul.foot_r_inner{
width: 30%;
}
	
}





/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●　スマホ　●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
@media screen and ( max-width : 1024px ) {


/* ----------------------------------------
	#　ヘッダーメニュー
---------------------------------------- */
.submenu{
width: 80%;
max-width: 400px;
height: 100vh;
padding: 0;
background-color: rgba(255, 255, 255, 0.9);
}

#head_menu ul{
width: 100%;
margin: 0;
flex-direction: column;
}

#head_menu ul li{
width: 100%;
border-bottom: 1px dotted #999999;
}

#head_menu ul li:last-child{
border-bottom: 1px solid #999999;
}
#head_menu ul li:first-child{
border-top: 1px solid #999999;
}

.sub_content{
width: 100%;
justify-content: center;
margin-left: 0;
margin-top: 15px;
}

.sub_content a{
width: 100px;
height: 60px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin: 0 15px;
}

.sub_content a span{
margin-bottom: 3px;
margin-top: -3px;
}

.submenu .head_img{
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
width: 100%;
margin-top: 10px;
text-align: center;
}
	
.submenu .head_img img{
width: 250px;
margin: 15px;
}


/* ----------------------------------------
	#　スマホメニュー
---------------------------------------- */
#menu{
display: block;
position: fixed;
z-index: 5;
left: -1000%;
top: 70px;
width: 100%;
transition: all .5s;
-ms-overflow-style: none;    /* IE, Edge 対応 */
scrollbar-width: none;       /* Firefox 対応 */
}

#menu.active{
left: 0;
}

#icon{
display: flex;
position: fixed;
z-index: 1000;
top: 10px;
left: 10px;
width: 50px;
height: 50px;
flex-direction: column;
justify-content: center;
transition: all .3s ease 0s;
opacity: 1;
background-color: #0053A3;
}

#icon span{
display: block;
margin: 0 auto;
width: 30px;
height: 3px;
background-color: #fff;
opacity: 1;
transition: all .3s ease 0s;
}

#icon span:first-of-type{
margin-bottom:8px;
}

#icon span:last-of-type{
margin-top: 8px;
}

#icon.active span:nth-of-type(1){
transform: rotate(45deg);
margin-top: 11px;
background-color: #fff;
opacity: 1;
}

#icon.active span:nth-of-type(2){
margin-left: 10px;
transform: rotate(-45deg);
margin-top: -11px;
background-color: #fff;
opacity: 1;
}

#icon.active span:nth-of-type(3){
opacity: 0;
background-color: #fff;
}


/* ----------------------------------------
	#　スライダー
---------------------------------------- */
#slide{}

#slide h1{
font-size: 55px;
top: 50%;
transform: translate(-50%, -50%);
}

.swiper-container{
max-height: 600px;
}

#slide .slide-img img{
max-height: 600px;
}


/* ----------------------------------------
	#　企業理念
---------------------------------------- */
#content{}

#top_corp{}

#parallax-corp > div{
padding: 80px 4%;
}

.read{
width: 90%;
max-width: 350px;
}

.read a{
width: 100%;
}


/* ----------------------------------------
	#　トップコンテンツ
---------------------------------------- */
.top_con_img{
height: 30vh;
max-height: 280px;
}

.sca-img {
height: 30vh;
max-height: 280px;
}


/* ----------------------------------------
	#　私たちの働く環境
---------------------------------------- */
#parallax-dist > div {
padding: 80px 4%;
}


/* ----------------------------------------
	#　フッター
---------------------------------------- */
footer{
padding-bottom: 10px;
}

.foot_box{
flex-direction: column;
}

.foot_l,
.foot_r{
width: 100%;
}

.foot_l p{
width: 100%;
max-width: 360px;
padding: 0;
margin: 0 auto;
}

.foot_r_inner{
display: none;
}

.copy{
display: block;
margin-top: 30px;
text-align: center;
}

}





/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●　スマホ　●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
/*●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
@media only screen and (max-width: 767px) {


/* ----------------------------------------
	#　スライダー
---------------------------------------- */
#slide h1{
font-size: 45px;
}

#slide h1 span{
font-size: 20px;
}

.swiper-container{
max-height:400px;
}

#slide .slide-img img{
max-height: 400px;
}


/* ----------------------------------------
	#　トップコンテンツ
---------------------------------------- */
#top_content{
padding-bottom: 0;
}

.top_con_box{
margin: 0;
width: 100%;
flex-direction: column;
}

.top_corp_inner:first-child{
padding-bottom: 0;
}

.top_con_name{
padding-top: 5px;
}

.top_con_img{
min-height: 250px;
}

.sca-img {
min-height: 250px;
}


/* ----------------------------------------
	#　トップに戻るボタン
---------------------------------------- */
#topBtn{
right: 0;
}

}




/* ----------------------------------------
	#　採用情報
---------------------------------------- */
.rec_table{
margin-top: 30px;
width: 100%;
border-collapse: separate;
border-spacing: 0 5px;
}

.rec_table th{
width: 20%;
min-width: 145px;
padding: 15px;
background: #E4EEF4;
}
.rec_table td{
width: 80%;
padding: 15px;
}

@media only screen and (max-width:767px) {
.rec_table,
.rec_table tbody,
.rec_table tr,
.rec_table th,
.rec_table td{
display: block;
width: 100%;
}

.rec_table th{
text-align: center;
}
}

.modal_content{
padding: 50px;
background-color: #fff;
}
@media only screen and (max-width:1024px) {
.modal_content{
padding: 30px;
}
}
@media only screen and (max-width:767px) {
.modal_content{
padding: 5%;
}
}