@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
common
font-family: 'Noto Sans JP', sans-serif;
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ----------------------------------------------------
element base setting (common)
---------------------------------------------------- */
body {
  color: #00234e;
  line-height: 1.8; 
  background: #00234e;
  font-family: 'Noto Sans JP', sans-serif;
}
a {
  color: #00234e; 
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
.clickable a, .clickable a:hover {
  color: #00234e;
}
.linkText{color:#00234e; text-decoration: underline;}
#mainContainer {width: 100%; overflow: hidden; }
.flex {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap;}
.inrContent {width: 80%; max-width: 1200px; margin-left: auto; margin-right: auto; position: relative;}
img {width: 100%; height: auto;}

.br_spOnly{display:none;}
.br_pcOnly{display:block;}

/* ----------------------------------------------------
header (common)
---------------------------------------------------- */
#header  {position: fixed; left: 0; top: 0; z-index: 99; width: 100%; height: min( 9.333vw , 140px); display: flex; display: -webkit-flex; align-items: center; justify-content: space-between;}
#header .headInner {width: 80%; max-width: 1200px; margin: 0 auto;}

#header .headInner #hd-logo p{width: min(8vw, 120px); display: inline-block; margin-right: 1em;}
#header .headInner #hd-logo{display: flex; display: -webkit-flex; justify-content: flex-start; flex-wrap: wrap;}
#header .headInner #hd-logo span {font-weight: 600; line-height: 2; color: white;}

#header .headInner ul {}
#header .headInner ul li a{color: white; margin-right: min(3.33vw, 50px); font-weight: 600;}
#header .headInner ul li:last-child a{margin-right: 0;}
#header.fixed {position: fixed; background: #00234e; opacity: 1;}

@keyframes fade {
   0% {opacity: 0; }
   100% {opacity: 1; }
}

#btnMypage {position: absolute; right: min( 9.333vw , 140px ); top: 0; height: min( 9.333vw , 140px ); width: min( 9.333vw , 140px );  z-index: 120; display: flex; display: -webkit-flex; justify-content:center; align-items: center; background: #d04c1e; cursor: pointer; flex-direction: column;}
#btnMypage p {margin: 0; width: 75%; line-height: 1.3; text-align: center; color: #fff; position: relative; font-weight: 600; }
#btnMypage:hover {filter: alpha(opacity=60) !important;	opacity: .6 !important;
  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
#btnMypage p a{color: #fff;}

#btnPortal {position: absolute; right: 0; top: 0; height: min( 9.333vw , 140px ); width: min( 9.333vw , 140px );  z-index: 120; display: flex; display: -webkit-flex; justify-content:center; align-items: center; background: #334f71; cursor: pointer; flex-direction: column;}
#btnPortal p {margin: 0; width: 75%; line-height: 1.3; text-align: center; color: #fff;  position: relative; font-weight: 600;}
/*#btnPortal:hover {filter: alpha(opacity=60) !important;	opacity: .6 !important;
  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}*/
#btnPortal p a{color: #fff;}



/* ----------------------------------------------------
footer (common)
---------------------------------------------------- */
#footer {padding:0 0 min( 4.667vw , 70px ) 0; background-color: #99a7b8;}
#footer .pagetop{width:8%; margin: 0 auto;}
#footer .ftCopy {color: white; text-align: center;}
.ftLogo_icon{margin: min( 6.667vw , 100px ) auto min( 6.667vw , 40px ) auto; width: 34%; max-width: 515px;}
.ftLogo_icon.flex{align-items:center;}
.ftLogo_icon .ftLogo{width: 49%; margin: 0 auto;}

.ftLogo_sns{margin: 0 auto min( 6.667vw , 40px ) auto; width: 47%; max-width: 700px;}
.ftLogo_sns.flex{align-items:center; justify-content: center;}


.snsLogo{width:min( 3.667vw , 55px ); margin-right: 0.7em;}
.snsInner{margin: 0 3%; align-items: center;}
.snsInner:first-child{width: 40%; justify-content: flex-end;}
.snsInner:last-child{width: 45%; justify-content: flex-start;}
.snsLinkTx{display:inline-block;}
.snsLinkTx a{color: white; text-decoration: underline;}




/* ----------------------------------------------------
メインビジュアル
---------------------------------------------------- */
#homVisual {}
#homVisual .visAria{margin-top: min( 9.333vw , 140px );}
#homVisual .visAria h2{writing-mode: vertical-rl;}
#homVisual .visAria h2 p{display: block; line-height: 1.5; margin: 0 min( 2.667vw , 4rem ) 0 0;}
#homVisual .visAria h2 span{background-color: white; font-size: min( 4.4vw , 6.6rem ); font-weight: 600; padding: 0.2em 0; letter-spacing: 0.1em;}
#homVisual h3{color: white; text-align: center; font-size: min( 2.667vw , 4rem ); font-weight: 600; margin-top: min( 4.667vw , 70px );}
#homVisual .homRead{color: white; text-align: center; font-size: min( 1.467vw , 2.2rem ); margin: min( 4vw , 60px ) 0 min( 6.667vw , 100px ) 0; line-height: 3;}

/* ----------------------------------------------------
白丸3つ
---------------------------------------------------- */
#work{background:linear-gradient(180deg, #00234e 0%, #00234e 50%, #ccd3dc 50%, #ccd3dc 100%);}
#work ul {display: grid; gap: 2%; grid-template-columns: repeat(auto-fit, minmax(30%, 1fr)); margin: 0;}
#work ul li {
  border-radius: 100%;
  padding: min( 1vw , 15px );
  background: #fff;
  /* 以下のFlexboxで文字を中央寄せ */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#work ul li::before {/* 擬似要素で正円を作る */
  display: block;
  content: '';
  padding-top: 100%;
}



#work ul li p {text-align: center;}
#work ul li p.workTitle span{font-size: min( 2.667vw , 4rem ); letter-spacing: 0.05em; line-height: 1.3; font-weight: 600;}
#work ul li p.workRead{font-size: min( 1.067vw , 1.6rem ); margin-top: 1.8em; line-height: 1.5;}
#work ul li:nth-child(1) {color: #563c8f;}
#work ul li:nth-child(2) {color: #1153a7;}
#work ul li:nth-child(3) {color: #00757f;}
#work ul li:nth-child(1) .workTitle span {border-bottom: 5px solid #7e6be2;}
#work ul li:nth-child(2) .workTitle span {border-bottom: 5px solid #8091a6;}
.noBorder{border-bottom:none!important;}



.icon-container {
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  position: relative;
  overflow: hidden;
}
.icon {
  min-width: 100%;
  min-height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}


/* ----------------------------------------------------
job member
---------------------------------------------------- */
#job_mem{background-color: #ccd3dc; padding: min( 7.333vw , 110px ) 0 min( 5.333vw , 80px ) 0;}
#job_mem .jmInner{width: 73%; max-width: 1100px; margin: 0 auto;}
#job_mem .jmInner .jm2clum{width: 47%; text-align: center;}

#job_mem .jmInner .jm2clum img{transition: transform .6s ease;}
#job_mem .jmInner .jm2clum:hover img{transform: scale(1.1);}
#job_mem .jmInner .jm2clum:hover {opacity: 0.6!important;}

#job_mem .jmInner .jm2clum h3{font-size: min( 2.667vw , 4rem ); letter-spacing: 0.05em; line-height: 1.3; font-weight: 600;}
#job_mem .jmInner .jm2clum .jmRead{margin: min( 1.667vw , 25px ) 0;}
#job_mem .jmInner .jm2clum .jmLink span{position:relative; padding-right: 1.2em;}
#job_mem .jmInner .jm2clum .jmLink span::before {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 0; width: min( 0.867vw , 13px); height: min( 0.867vw , 13px); border-top: 2px solid #00234e; border-right: 2px solid #00234e; transform: rotate(45deg);}
#job_mem .jmInner .jm2clum .jmLink span::after {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 1px; width: min( 1vw , 15px); height: 2px; background-color: #00234e;}


/* ----------------------------------------------------
コンテンツタイトル
---------------------------------------------------- */
.contentsTitle{padding: 0 0 min( 2vw , 30px ) 0; font-size: min( 2.53vw , 3.8rem ); color: #00234e; text-align: center; font-weight: 600; letter-spacing: 0.1em; position: relative;}
.contentsTitle p{position: relative;}
.contentsTitle span{position: absolute; top: 0.7em; left: 50%; transform: translateX(-50%); color: #e5e9ed; font-size: min( 2.9vw , 4.4rem ); font-family: 'Libre Franklin', sans-serif; line-height: 1; width: 100%;}
.contentsTitle span.subbule01{color: #b2bdca;}
.contentsTitle span.subbule02{color: #bfc8d3;}


/* ----------------------------------------------------
jobInfo
---------------------------------------------------- */
#jobInfo{padding: min( 6.667vw , 100px ) 0 min( 5.333vw , 80px ) 0; background-color: #ccd3dc;}
#jobInfo .accordion_one {width: 80%; max-width: 1200px; margin: 0 auto;}
#jobInfo .accordion_one .accordion_header {background: url("../img/acBt01.jpg") no-repeat 0 0; color: #fff; font-size: min( 2vw , 3.0rem); font-weight: 600; letter-spacing: 0.1em; padding: 0 min( 1.333vw , 20px ); position: relative; z-index: +1; cursor: pointer; transition-duration: 0.2s; min-height: min( 16vw , 240px ); background-size: cover; display: flex; display: -webkit-flex; align-items: center; border-bottom: 1px solid #00234e; border-top: 1px solid #00234e; margin-bottom: -1px;}
#jobInfo .accordion_one:nth-of-type(2) .accordion_header {background: url("../img/acBt02.jpg") no-repeat 0 0; background-size: cover;}
#jobInfo .accordion_one:nth-of-type(3) .accordion_header {background: url("../img/acBt03.jpg") no-repeat 0 0; background-size: cover;}
#jobInfo .accordion_one .accordion_header::before{width: 100%; height: 100%; background-color: rgba(0,35,78,0.5); position: absolute; top: 0; left: 0; content: "";}
#jobInfo .accordion_one .accordion_header:hover::before,
#jobInfo .accordion_one .accordion_header.open::before{width: 100%; height: 100%; background-color: rgba(0,0,0,0); position: absolute; top: 0; left: 0; content: "";}
#jobInfo .accordion_one .accordion_header.clickClose::before{width: 100%; height: 100%; background-color: rgba(0,35,78,0.5); position: absolute; top: 0; left: 0; content: "";}
#jobInfo .accordion_one .accordion_header span{color: white; z-index: 3;}
#jobInfo .accordion_one .accordion_header.open:hover{opacity: 0.8;}
#jobInfo .accordion_one .accordion_header .i_box {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 5%; width: min( 1.333vw , 20px ); height: min( 1.333vw , 20px ); /*border-top: 4px solid #fff; border-right: 4px solid #fff; */transform: rotate(0deg); transform-origin: center center;	transition-duration: 0.2s;}
#jobInfo .accordion_one .accordion_header .i_box .one_i {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; left: -5px; width: min( 1.733vw , 26px ); height: min( 1.733vw , 26px ); /*background-color: #fff;*/ transform: rotate(0deg); background: url("../img/underAroow_w.svg") no-repeat 0 0;}
#jobInfo .accordion_one .accordion_header.open .i_box .one_i:before {content: none;}
#jobInfo .accordion_one .accordion_header.open .i_box {-webkit-transform: rotate(-180deg); transform: rotate(-180deg);}
#jobInfo .accordion_one .accordion_inner {display: none; box-sizing: border-box; width: 100%; max-width: 1200px; margin: 0 auto; padding: min(3.33vw, 50px) 0;}
#jobInfo .accordion_one .accordion_inner .box_one {width: 91%; max-width: 1100px; margin: 0 auto; /*height: 300px;*/}
#jobInfo .accordion_one .accordion_inner p.txt_a_ac {margin: 0; padding-bottom: 1em;}
#jobInfo .accordion_one .accordion_inner .jobTable01 {border-top: 3px solid #99a7b8; border-left: 3px solid #99a7b8; border-right: 3px solid #99a7b8;}
#jobInfo .accordion_one .accordion_inner .jobTable01 th {border-right: 3px solid #99a7b8; border-bottom: 3px solid #99a7b8; background-color: #667b95; color: white; padding: 0.4em; width: 25%;}
#jobInfo .accordion_one .accordion_inner .jobTable01 td {padding: 0.4em 0.8em; width: 75%; border-bottom: 3px solid #99a7b8; background-color: #e5e9ed;}

#jobInfo .accordion_one .accordion_inner .close_box {width: 100%; margin: 0 auto; display: flex; display: -webkit-flex; justify-content: flex-end;}
#jobInfo .accordion_one .accordion_inner .close_box a.close_btn {position: relative; padding-right: min( 2.333vw , 35px ); font-weight: 600; letter-spacing: 0.15em; background: url("../img/topArrow.svg") no-repeat right top; background-position: right top!important;}

#jobInfo .accordion_one .accordion_inner .close_box a.close_btn:hover {	opacity: .8;}

/*募集要項アコーディオン*/
#jobInfo .accordion_rec {width: 80%; max-width: 1200px; margin: 0 auto;}
#jobInfo .accordion_rec .accordion_header_rec {color: #00234e; font-size: min( 2vw , 3.0rem); font-weight: 600; letter-spacing: 0.1em; padding: min( 1.333vw , 20px ); position: relative; z-index: +1; transition-duration: 0.2s; display: flex; display: -webkit-flex; align-items: center; border-bottom: 1px solid #00234e; border-top: 1px solid #00234e; margin-bottom: -1px;}
#jobInfo .accordion_rec .accordion_inner_rec {display: block; box-sizing: border-box; width: 100%; max-width: 1200px; margin: 0 auto; padding: min(3.33vw, 50px) 0;}
#jobInfo .accordion_rec .accordion_inner_rec .box_one {width: 91%; max-width: 1100px; margin: 0 auto; /*height: 300px;*/}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 {border-top: 3px solid #99a7b8; border-left: 3px solid #99a7b8; border-right: 3px solid #99a7b8;}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 th {border-right: 3px solid #99a7b8; border-bottom: 3px solid #99a7b8; background-color: #667b95; color: white; padding: 0.4em; width: 25%;}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 td {padding: 0.4em 0.8em; width: 75%; border-bottom: 3px solid #99a7b8; background-color: #e5e9ed;}

.entryBt{display:flex; display: -webkit-flex; justify-content: center; align-items: center; background: #d04c1e; color: white; width: 30%; height: min( 4.667vw , 70px); margin: 2em auto; position: relative;}
.entryBt a{color: white; font-size: min( 1.6vw , 2.4rem );}

.triangle {
  display: block;
  height: 0;
  width: 0;
  position: absolute;
  bottom: 8px;
  right: 8px;
  border-left: 15px solid transparent;
  border-bottom: 15px solid #fff;
}


.flow{padding: min( 6.667vw , 100px ) 0; background: url("../img/flowBack.jpg") no-repeat 0 0; background-size: cover;}
.flow h4{text-align: center; margin: min( 2.667vw , 40px) 0;}
.flow h4 span{font-size: min( 2.667vw , 4rem ); text-align: center; color: #00234e; letter-spacing: 0.18em; font-weight: 600; border-bottom: 4px solid #fff;}



.matehanBnr{background:url("../img/bnr_matehan.jpg") no-repeat 0 0; background-size: cover; border: 7px solid #00234e; width: min( 40vw , 600px ); margin: 0 auto; position: relative; margin-bottom: min( 7.33vw , 110px ); padding: min( 4.667vw , 70px ) 0; text-align: center;}
.matehanBnr::before{border: 1px solid #00234e; position: absolute; top: min( -0.667vw , -10px ); left: min( -0.667vw , -10px ); bottom: min( -0.667vw , -10px ); right: min( -0.667vw , -10px ); content: "";}
.matehanBnr p{margin-bottom:0; text-align: center; background-color: #00234e; display: inline; padding: 0.1em 0.5em;}
.matehanBnr p span{color: white; font-weight: 600; position: relative; padding-right: 1.3em;}
.matehanBnr p span a{color: white;}
.matehanBnr p span::before {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 2px; width: min( 0.867vw , 13px); height: min( 0.867vw , 13px); border-top: 2px solid white; border-right: 2px solid white; transform: rotate(45deg);}
.matehanBnr p span::after {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 1px; width: min( 1vw , 15px); height: 2px; background-color: white;}


/* ----------------------------------------------------
FAQ
---------------------------------------------------- */
#faq{background-color: #99a7b8; padding: min( 6.667vw , 100px ) 0 min( 9vw , 135px ) 0;}

#faq .faqInner{/*padding-top: min( 5.33vw , 80px ); */width: 66%; max-width: 1000px; margin: 0 auto;}
#faq .faqInner .faqRead{text-align: center;}
#faq .faqInner h4{text-align: center; margin: min( 5vw , 75px ) 0 min( 0.667vw , 10px ) 0;}
#faq .faqInner h4 span{background-color: white; font-size: min( 2vw , 3.0rem); padding: 0.05em 0.35em; font-weight: 600;}
#faq .faqInner dl{margin-top: min( 2.33vw , 35px );}
#faq .faqInner dt{position: relative; color: white; padding-left: 2.2vw; font-size: min( 1.6vw , 2.4rem ); font-weight: 600; line-height: 1.5; display: block; margin-bottom: 0.5em;}
#faq .faqInner dt::before {content: "Q"; position: absolute; top: 0; left: 0; font-size: min( 2.4vw , 3.6rem ); font-weight: 600; font-family: 'Libre Franklin', sans-serif; line-height: 1;}
#faq .faqInner dd{position: relative; padding-left: 2.2vw; line-height: 1.8; display: block; margin-bottom: 0.5em;}
#faq .faqInner dd::before {content: "A"; position: absolute; top: 0; left: 0; font-size: min( 2.4vw , 3.6rem ); font-weight: 600; font-family: 'Libre Franklin', sans-serif; line-height: 1;}
.faqLink{display:block; position: relative; color: white; padding-left: 1.3em;}
.faqLink::before {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; left: 0; width: min( 0.867vw , 13px); height: min( 0.867vw , 13px); border-top: 2px solid white; border-right: 2px solid white; transform: rotate(45deg);}
.faqLink::after {content: ""; margin: auto; position: absolute; top: 0; bottom: 0; left: 1px; width: min( 1vw , 15px); height: 2px; background-color: white;}
.faqLink a{color: white;}



.intLink{margin-bottom:0; display: inline-block;}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
pcSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (min-width:768px) {
/* ----------------------------------------------------
common(pc)
---------------------------------------------------- */
/* hover */
a:hover {
  opacity: .8 !important; filter: alpha(opacity=80);
  text-decoration: none;
  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
}
a img:hover {
  opacity: .8 !important; filter: alpha(opacity=80);
  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
}
.clickable:hover {
  filter: alpha(opacity=60) !important;	opacity: .6 !important;
  -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
}
#btnGlobal, .navChild {display: none;}
#header.fixed #grandMenu {display: block!important;}
#header #grandMenu {display: block!important; padding-right: 10%;}
}


@media (max-width: 1850px) {
#header #grandMenu {padding-right: 12%;}
}
@media (max-width: 1750px) {
#header #grandMenu {padding-right: 15%;}
}
@media (max-width: 1650px) {
#header #grandMenu {padding-right: 18%;}
}
@media (max-width: 1500px) {
.bnBreak{display:block;}
}

@media (max-width: 850px) {
.wdBreak{display:block;}
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
tabletSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 1200px) and (min-width: 768px) {

}
@media (max-width: 915px) {
@media (orientation: landscape) {

}
}
/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
spSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 767px) {
#mainContainer{ width: 100%; position: relative;}
.inrContent {width: 90%;}
.br_spOnly{display:block;}
.br_pcOnly{display:none;}
.order1{order:1;}
.order2{order:2}
	
/*ハンバーガー*/
#btnGlobal {position: absolute; right: 0; top: 0; z-index: 120;	background: #fff; display: flex;	display: -webkit-flex; justify-content: center; align-items: center;}
#btnGlobal .btnWrapGlobal {	position: relative;	}
#btnGlobal .btnLine { height: 3px; background: #00234e; position: absolute; right:0; width: 100%;}
#btnGlobal .btnLine.btnLineT {  top: 0;}
#btnGlobal .btnLine.btnLineM { top: 50%; transform: translateY(-50%);}
#btnGlobal .btnLine.btnLineB { bottom: 0; }
#btnGlobal.active .btnLine {background: #00234e;}
#btnGlobal.active .btnLine.btnLineT { display: none;}
#btnGlobal.active .btnLine.btnLineM { transform: translateY(0) rotate(45deg) ;}
#btnGlobal.active .btnLine.btnLineB { transform: rotate(-45deg); bottom:inherit; top: 50%;}
#btnGlobal .btnLine.btnLineM, #btnGlobal .btnLine.btnLineB {-moz-transition: all, ease-in-out, 0.3s;  -o-transition: all, ease-in-out, 0.3s;  -webkit-transition: all, ease-in-out, 0.3s; transition: all, ease-in-out, 0.3s;}	
	
#grandMenu {background: #00234e; width: 100%; height: 100%; position: fixed; z-index: 100;  left: 0; top: 0; display: none; overflow: auto;}
#grandMenu a {color: #fff;}
#grandMenu #navGlobal {flex-flow: column; margin-left: 0; right: 0; left: 0;}
#grandMenu #navGlobal li {border-bottom: 1px solid #fff; line-height: 1; width: 90%; margin: 0 auto;}
#grandMenu #navGlobal li a {display:  block; position: relative; }
#header .headInner ul li:last-child a{margin-right:1em;}
#grandMenu #navGlobal li a::after {content:""; position: absolute;  top: 50%; border-top:1px solid #fff; border-right: 1px solid #fff; transform:  rotate(45deg) translateX(-50%); transition: all 0.3s  ease}
#grandMenu #navGlobal li.btn-navChild a::after { transform:  rotate(135deg);}
#grandMenu #navGlobal li.btn-navChild a.active::after {transform:  rotate(-45deg);}
#grandMenu #navGlobal li.btn-navChild .navChild {display: none;}
#grandMenu #navGlobal li.btn-navChild .navChild  li {border-bottom: none; }
#grandMenu #navGlobal li.btn-navChild .navChild a::after {transform:  rotate(45deg) ;}	
	
@media (orientation: portrait) { /* スマホ縦 */
	#btnGlobal {width: 16vw; height: 16vw;}
	#btnGlobal .btnWrapGlobal {	position: relative;	width: 7vw;	height: 5vw;}
	#grandMenu {padding: 20vw 8%;}
	#grandMenu #navGlobal li { font-size: 4.2vw; }
	#grandMenu #navGlobal li a {padding: 4vw 0;}
	#grandMenu #navGlobal li a::after {right: 2vw; width: 2vw; height: 2vw;}
	#grandMenu #navGlobal li.btn-navChild .navChild  li {font-size: 3.7vw; padding-left: 3.7vw;}
}
@media (orientation: landscape) {/* スマホ横 */
	#btnGlobal {width: 7rem; height: 7rem;}
	#btnGlobal .btnWrapGlobal {	width: 3rem;	height: 2rem;}
	#grandMenu {padding: 8rem 8%;}
	#grandMenu #navGlobal li { font-size: 1.8rem; }
	#grandMenu #navGlobal li a {padding: 2rem 0;}
	#grandMenu #navGlobal li a::after {right: 1rem; width: 1rem; height: 1rem;}
	#grandMenu #navGlobal li.btn-navChild .navChild  li {font-size: 1.6rem; padding-left: 2rem;}	
}

#header.fixed #spBottmBut {display: flex; display: -webkit-flex; align-items: flex-end; position: fixed; bottom: 0; left: 0; height: 10vh; width: 100vw; z-index: 1;}
#header.fixed #spbtInner{height: 20vw; background-color: rgba(0,0,0,0.7); display: flex; display: -webkit-flex; justify-content: center; align-content: center; width: 100vw; flex-wrap: wrap;}
#header.fixed a {width: 45%; }
#header.fixed a #btnMypage,
#header.fixed a #btnPortal{width: 95%; height: 12vw; position: relative; top: inherit; bottom: inherit; left: inherit; right: inherit;}
#header.fixed a #btnMypage p,
#header.fixed a #btnPortal p{font-size: 3.6vw; letter-spacing: inherit;}
.bnBreak{display:none;}
	
#header #spBottmBut{opacity: 0; animation: fade 0.9s ease forwards; display: none;}
	
#btnMypage p::after,#btnPortal p::after { width: 3vw; height: 3vw;}

  
/* ----------------------------------------------------
header (sp)
---------------------------------------------------- */
#header  {height: 16vw;  padding: 3vw 18vw 3vw 4vw ;}
#header .headInner {width: 100%;}
#header .headInner.flex {align-items: flex-end;}
#header .headInner #hd-logo {width: 100%; align-items: baseline;}
#header .headInner #hd-logo p {width: 30%;}
#header .headInner #hd-logo span {font-size: 2.5vw; margin-bottom: 1vw;}
#header .headInner ul{position: absolute; right: 18%;}
#header .headInner ul li a{margin-right: 1em; font-size: 3.0vw; line-height: 1;}

@media (orientation: landscape) {
#header {height: 10vw; }
#header .headInner #hd-logo span {line-height: 0.5; padding-top: 1em;}
}
	

/* ----------------------------------------------------
footer (sp)
---------------------------------------------------- */
#footer {padding:6vw 0 22vw 0; z-index: 2;}
#footer .ftCopy {font-size: 2.8vw;}
#footer .pagetop{width:20%;}
.ftLogo_icon{margin: 6vw auto 4vw auto; width: 54%;}
.ftLogo_icon .snsIcon a{width: 45%;}
	
.ftLogo_sns{margin: 0 auto 5vw auto; width: 100%;}
.ftLogo_sns.flex{align-items:center; justify-content: center;}


.snsLogo{width:20%; margin-right: 0; margin-bottom: 0.5em;}
.snsInner{margin: 0 0; flex-flow: column; align-items: center;}
.snsInner:first-child{width: 45%; justify-content: center;}
.snsInner:last-child{width: 45%; justify-content: center;}
.snsLinkTx{display:inline-block;}
.snsLinkTx a{color: white; text-decoration: underline;}


/* ----------------------------------------------------
メインビジュアル
---------------------------------------------------- */
#homVisual {}
#homVisual .visAria{margin-top: 18vw;}
#homVisual .visAria h2 p{margin: 0 2.3vw 0 0;}
#homVisual .visAria h2 span{font-size: 6.0vw;}
#homVisual h3{font-size: 4.5vw; margin-top: 7.3vw;}
#homVisual .homRead{font-size: 3.4vw; margin: 5vw 0 8vw 0; line-height: 2.1;}
	
/* ----------------------------------------------------
白丸3つ
---------------------------------------------------- */
#work ul{flex-flow: column; flex-wrap: wrap; width: 70%; margin: 0 auto; gap: 2%; grid-template-columns: repeat(auto-fit, minmax(60%, 1fr));}
#work ul li { padding: 2vw;}
#work ul li p {text-align: center;}
#work ul li p.workTitle span{font-size: 4.2vw;}
#work ul li p.workRead{font-size: 3.2vw; margin-top: 1.8em; line-height: 1.5;}

/* ----------------------------------------------------
job member
---------------------------------------------------- */
#job_mem{padding: 19.6vw 0 5.67vw 0;}
#job_mem .jmInner{width: 90%; flex-flow: column;}
#job_mem .jmInner .jm2clum{width: 100%; text-align: center; margin-bottom: 10vw;}
#job_mem .jmInner .jm2clum h3{font-size: 4.8vw;}
#job_mem .jmInner .jm2clum .jmRead{margin: 3.3vw 0;}
#job_mem .jmInner .jm2clum .jmLink span::before {width: 1.7vw; height: 1.7vw;}
#job_mem .jmInner .jm2clum .jmLink span::after {right: 1px; width: 1.96vw;}		
	
	
/* ----------------------------------------------------
コンテンツタイトル
---------------------------------------------------- */	
.contentsTitle{padding: 0 0 5vw 0; font-size: 4.3vw;}
.contentsTitle p{position: relative;}
.contentsTitle span{font-size: 5vw; }
	
	

	
	
/* ----------------------------------------------------
jobInfo
---------------------------------------------------- */
#jobInfo{padding: 8vw 0 7vw 0;}
#jobInfo .accordion_one {width: 90%;}
#jobInfo .accordion_one .accordion_header {font-size: 3.6vw; padding: 0 2vw; min-height: 22vw;}
#jobInfo .accordion_one:nth-of-type(2) .accordion_header {background-position: center bottom;}
#jobInfo .accordion_one:nth-of-type(3) .accordion_header {background-position: center bottom;}
#jobInfo .accordion_one .accordion_header .i_box {width: 5vw; height: 5vw;}
#jobInfo .accordion_one .accordion_header .i_box .one_i { right: 5%; width: 60%; height: 60%; background: url("../img/underAroow_w.svg") no-repeat 0 0;}
#jobInfo .accordion_one .accordion_inner {padding: 4vw 0;}
#jobInfo .accordion_one .accordion_inner .jobTable01 {border-top: 1px solid #99a7b8; border-left: 1px solid #99a7b8; border-right: 1px solid #99a7b8;}
#jobInfo .accordion_one .accordion_inner .jobTable01 th {border-right: 1px solid #99a7b8; border-bottom: 1px solid #99a7b8;}
#jobInfo .accordion_one .accordion_inner .jobTable01 td {border-bottom: 1px solid #99a7b8; background-color: #e5e9ed;}
#jobInfo .accordion_one .accordion_inner .closeArea .close_box a.close_btn {padding-right: 2.8vw; }
#jobInfo .accordion_one .accordion_inner .closeArea .close_box a.close_btn::before {right: 2px; width: 1.7vw; height: 1.7vw; border-top: 2px solid #00234e; border-right: 2px solid #00234e;}
#jobInfo .accordion_one .accordion_inner .closeArea .close_box a.close_btn::after {top: 5px; bottom: 0; right: 2px; width: 1.96vw; height: 2px; }

	
#jobInfo .accordion_one .accordion_header:hover::before{width: 100%; height: 100%; background-color: rgba(0,35,78,0.5); position: absolute; top: 0; left: 0; content: "";}
#jobInfo .accordion_one .accordion_header.open:hover{opacity:1;}
#jobInfo .accordion_one .accordion_header.open:hover::before{width: 100%; height: 100%; background-color: rgba(0,35,78,0); position: absolute; top: 0; left: 0; content: "";}
	
/*募集要項アコーディオン*/
#jobInfo .accordion_rec {width: 90%;}
#jobInfo .accordion_rec .accordion_header_rec {font-size: 3.2vw; padding: 4vw 2vw;}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 {border-top: 1px solid #99a7b8; border-left: 1px solid #99a7b8; border-right: 1px solid #99a7b8;}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 th {border-right: 1px solid #99a7b8; border-bottom: 1px solid #99a7b8; background-color: #667b95;}
#jobInfo .accordion_rec .accordion_inner_rec .jobTable01 td {border-bottom: 1px solid #99a7b8;}
	
#jobInfo .flow{padding-bottom: 6vw;}
.flow h4{margin: 5vw;}
.flow h4 span{font-size: 4.8vw;}
.flow p{width: 80%; margin: 0 auto;}

#jobInfo .accordion_one .accordion_inner .close_box a.close_btn,
#jobInfo .accordion_rec .accordion_inner .close_box a.close_btn{padding-right:1.5em; background-size: 1.5em; background-position: right 20%;}
	
	
.entryBt{height: 12vw; width: 60%;}
.entryBt a{font-size: 3.2vw;}
.triangle {bottom: 4px;
  right: 4px;
  border-left: 8px solid transparent;
  border-bottom: 8px solid #fff;}
	
	
.matehanBnr{border: 4px solid #00234e; width: 94%; margin: 8vw auto; padding: 7vw 0; }	
.matehanBnr p span::before {width: 1.7vw; height: 1.7vw;}
.matehanBnr p span::after {right: 1px; width: 1.96vw;}		
	
	
/* ----------------------------------------------------
FAQ
---------------------------------------------------- */
#faq{padding-bottom: 8vw;}
#faq h3{font-size: 4.8vw;}
#faq .faqInner{width: 90%;}
#faq .faqInner .faqRead{text-align: center;}
#faq .faqInner h4{margin: 6vw 0 2vw 0;}
#faq .faqInner h4 span{font-size: 3.6vw;}
#faq .faqInner dl{margin-top: 4.6vw;}
#faq .faqInner dt{padding-left: 4.2vw; font-size: 3.2vw;}
#faq .faqInner dt::before {font-size: 3.6vw; line-height: 1.3;}
#faq .faqInner dd{padding-left: 4.2vw; line-height: 1.3;}
#faq .faqInner dd::before {font-size: 3.6vw; line-height: 1.3;}

.faqLink::before {width: 1.7vw; height: 1.7vw; left: 1.2vw;}
.faqLink::after {left: 0; width: 2.5vw;}

	
		
	
	
	
	
	
}

