@charset "UTF-8";

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

  ----------------------------------
  デベロッパー編集用
  ----------------------------------

  PC　screen and (min-width: 768px)
  SP  screen and (max-width:767px)
  
  #slider1　 screen and (max-width: 1280px)
  #slider2　 screen and (max-width: 767px)

  margin、paddingなど
  pxは8の倍数がベース(一部例外あり)

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

* {
 margin: 0;
 padding: 0;
 list-style: none;
}
body.preload * {
 -webkit-transition: none !important;
 -moz-transition: none !important;
 -ms-transition: none !important;
 -o-transition: none !important;
 transition: none !important;
}
html {
 font-family: 'Noto Sans JP','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,sans-serif;
 font-style: normal;
 font-weight: 400;
 -webkit-scroll-behavior: smooth;
 scroll-behavior: smooth;
}
html, body {
 overflow-x: hidden;
 overflow-y: auto;
}
html {
 font-size: 62.5%;
 text-align: left;
}
body {
 transform: none;
 -webkit-text-size-adjust: 100%;
 counter-reset: flow_num service_num talent_num;
}
img {
 max-width: 100%;
 height: auto;
}
.maxConImg > img {
 max-width: none;
 width: 100%;
}
#secQandA .tableCon tr td .textBox,
#secQandA .tableCon tr td .textBox > * {
 transition-duration: 0.3s;
 transition-timing-function: ease-in-out;
}
a,
.click-js,
.prevBtn,
.nextBtn {
 cursor: pointer;
}


a,
.click-js {
 transition-duration: 0.3s;
 transition-timing-function: ease-out;
}
a,
#interviewModal,
.click-js:not(.question-js) {
 transition-property: opacity, visibility;
}
#interviewModal ul li:not(.bg) {
 transition-property: opacity, visibility, position;
}
#secQandA .tableCon tr td .textBox,
#secQandA .tableCon tr td .textBox > * {
 transition-property: opacity, padding-top, padding-right ,padding-bottom, visibility, line-height;
}
.question-js {
 transition-property: background-color;
}
#secQandA .tableCon tr td .textBox,
#secQandA .tableCon tr td .textBox > * {
 opacity: 0;
}
a:not(.notLink):hover,
.click-js:not(.question-js):hover {
 opacity: .7;
}
#secQandA .tableCon tr td.open .textBox,
#secQandA .tableCon tr td.open .textBox > * {
 opacity: 1;
}






/*-- PARTS ---------------------------------------------------------------------------*/

/*------------------------------**
  画像トリミング
  アスペクト比
**------------------------------*/
.asImg:not(.overY):not(.overX) {
 position: relative;
 width: 100%;
 /*default 3:2*/
 padding: 33% 0;
 overflow: hidden;
 display: block;
}
.asImg.overY {
 overflow-y:hidden; 
}
.asImg.overX {
 overflow-y:hidden; 
}
.asImg > img {
 position: absolute;
 top: -2px;
 bottom: 0;
 right: 0;
 left: -2px;
 width: calc(100% + 4px);
 height: calc(100% + 4px);
 margin: auto;
 object-fit: cover;
 max-width: none;
}
/*------------------------------------------------------------*/
.asImg.aspect_1-1 {
 /*1:1*/
 padding: 50% 0 !important;
}
.asImg.aspect_2-1 {
 /*2:1*/
 padding: 25% 0 !important;
}
.asImg.aspect_3-2 {
 /*3:2*/
 padding: 33% 0 !important;
}
.asImg.aspect_16-9 {
 /*16:9*/
 padding: 28.125% 0 !important;
}



/*------------------------------**
  ページ内リンク
**------------------------------*/
.pl {
 padding-top: 64px;
 margin-top: -64px;
}
#pageTop {
 position: relative;
 text-align: center;
 overflow: hidden;
}
#pageTop a {
 display: block;
 padding: 24px 0;
}
#pageTop a span {
 display: none !important;
}
#pageTop a::before {
 content: '';
 display: inline-block;
 text-align: center;
 transform: rotate(45deg);
 border-top-style: solid;
 border-left-style: solid;
 border-top-width: 1px;
 border-left-width: 1px;
 width: 30px;
 height: 30px;
 position: relative;
 top: 10px;
}



/*------------------------------**
  コンテンツ内 width
**------------------------------*/
.contentMax {
 max-width: 1200px;
 margin-right: auto;
 margin-left: auto;
 padding-right: 16px;
 padding-left: 16px;
 display: block;
}



/*------------------------------**
  タイトル
**------------------------------*/
.ttl1 {
 padding-bottom: 16px;
}
.ttl1 {
 text-align: left;
 position: relative;
}
.ttl1::before {
 content: '';
 position: absolute;
 bottom: 0;
 left: 0;
 width: 88px;
 height: 6px;
}
.ttl1.tr::before {
 left: auto;
 right: 0;
}
.ttl1.tc::before {
 left: 0;
 right: 0;
 margin: 0 auto;
}
.ttl1 .bottom {
 display: block;
 padding-top: 4px;
 padding-bottom: 4px;
}
/*------------------------------------------------------------*/
.ttl2 {
 padding-left: 16px;
 position: relative;
}
.ttl2::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 width: 6px;
 height: 100%;
}
.ttl3 {
 padding: 16px;
}
/*------------------------------------------------------------*/





/*------------------------------**
  ローディング
**------------------------------*/
#js-loading {
 position: fixed;
 height: 100%;
 width: 100%;
 top: 0;
 left: 0;
 background-color: #fff;
 z-index: 100000;
 transition-property: opacity, visibility, translate;
 transition-duration: 1.5s;
 transition-timing-function: ease;
/* transition-delay: 0.3s;*/
}
#js-loading .imgBox {
 position: absolute;
 top: 50%;
 -ms-transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 right: 0;
 left: 0;
 margin: auto;
 height: auto;
 text-align: center;
}
#js-loading .imgBox img {
 display: block;
 margin: 0 auto;
 width: 56px;
 height: 56px;
}
#js-loading.open {
 opacity: 0;
 visibility: hidden;
}



/*------------------------------**
  スライダー設定
**------------------------------*/
.sliderCon {
 display: flex;
 flex-wrap: nowrap;
 float: left;
}
.sliderCon li {
 display: flex;
 flex-wrap: wrap;
 padding-top: 0;
 padding-bottom: 0;
 box-sizing: border-box;
}
.sliderBtn {
 position: absolute;
 margin: 0 auto;
 top: 0;
 right: 0;
 left: 0;
 z-index: 10;
 text-align: center;
}
.sliderBtn .prevBtn {
 position: absolute;
 left: -30px;
 transform: translateY(-50%) scale(-1, 1);
 top: 50%;
 width: 60px;
 height: 70px;
 overflow: hidden; 
}
.sliderBtn .nextBtn {
 position: absolute;
 right: -30px;
 transform: translateY(-50%);
 top: 50%;
 width: 60px;
 height: 70px;
}
.sliderBtn .prevBtn::before,
.sliderBtn .nextBtn::before,
.sliderBtn .prevBtn::after,
.sliderBtn .nextBtn::after {
 content: '';
 display: inline-block;
 position: absolute;
 text-align: center;
 height: 1px;
 width: 20px;
 top: 50%;
 left: 45%;
}
.sliderBtn .prevBtn::before,
.sliderBtn .nextBtn::before {
 transform: rotate(-55deg) translate(-50%);
}
.sliderBtn .prevBtn::after,
.sliderBtn .nextBtn::after {
 transform: rotate(55deg) translate(-50%);
}
@media screen and (max-width: 767px) {
.sliderBtn .prevBtn {
 left : 8px;
}
.sliderBtn .nextBtn {
 right: 8px;
}
}

/*------------------------------**
  スライダー1(TOP、オフィス紹介)
**------------------------------*/
#sliderContainer1 {
 position: relative;
 display: inline-block;
 width: 100%;
 height: 100%;
 margin-top: 40px;
}
#slider1Wrap {
position: relative;
}
#slider1 { 
 position: relative;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
 height: 100%;
 width: 100%;
}
#slider1Wrap {
 transition-duration: .45s;
 transition-timing-function: ease-in-out;
}
#slider1 ul li {
 width: 338px !important;
 padding-right: 2px;
 padding-left: 2px;
}
#slider1 .sliderCon li > .imgBox {
 display: block;
 width: 100% !important;
}
#slider1 ul li > p:not(:first-child) {
 padding-top: 16px;
}
#sliderContainer1 .sliderBtn {
 width: calc(338px * 3);
}
#slider1 .sliderCon li > .imgBox,
#sliderContainer1 .sliderBtn {
 height: 223px;
}
@media screen and (max-width: 1200px) {
#sliderContainer1 .sliderBtn {
 width: calc(338px * 1);
}
}
@media screen and (max-width: 767px) {
#sliderContainer1 .sliderBtn {
 width: 100%;
}
#slider1 ul li > p {
 padding-right: 16px;
 padding-left: 16px
}
}
/*------------------------------**
  スライダー2(TOP、職場での一コマ)
**------------------------------*/
#sliderContainer2 {
 position: relative;
 display: inline-block;
 width: 100%;
 height: 100%;
 margin-top: 40px;
}
#slider2Wrap {
position: relative;
}
#slider2 { 
 position: relative;
 top: 0;
 left: 50%;
 transform: translateX(-50%);
 height: 100%;
 width: 100%;
}
#slider2Wrap {
 transition-duration: .45s;
 transition-timing-function: ease-in-out;
}
#slider2 ul li {
 width: 690px !important;
}
#slider2 .sliderCon li > .imgBox {
 display: block;
 width: 100% !important;
}
#slider2 ul li > p:not(:first-child) {
 padding-top: 16px;
}
#sliderContainer2 .sliderBtn {
 width: 690px;
}
#slider2 .sliderCon li > .imgBox,
#sliderContainer2 .sliderBtn {
 height: 460px;
}
@media screen and (min-width:768px) {
#slider2 ul li {
 padding-right: 4px;
 padding-left: 4px;
}
}
@media screen and (max-width: 767px) {
#slider2 ul li {
 width: 338px !important;
 padding-right: 2px;
 padding-left: 2px;
}
#sliderContainer2 .sliderBtn {
 width: 100%;
}
#slider2 .sliderCon li > .imgBox,
#sliderContainer2 .sliderBtn {
 height: 223px;
}
#slider2 ul li > p {
 padding-right: 16px;
 padding-left: 16px
}
}




/*------------------------------**
  その他パーツ
**------------------------------*/
.tl {
 text-align: left !important;
}
.tr {
 text-align: right !important;
}
.tc {
 text-align: center!important;
}
.tj {
 text-align: justify !important;
 text-justify: inter-ideograph !important;
}
.mc {
 margin-right: auto;
 margin-left: auto;
}
/*------------------------------------------------------------*/
@media screen and (min-width:768px) {
.pc {
 display: block;
}
.sp {
 display: none;
}
br.pc {
 display: inline;
}
}
@media screen and (max-width:767px) {
.pc {
 display: none;
}
.sp {
 display: block;
}
br.sp {
 display: inline;
}
}



/*------------------------------**
  テキスト全て
  右に文字詰め
**------------------------------*/
.indent--all_left {
 padding-left: 2em !important;
}

/*------------------------------**
  テキストの最初だけ
  1文字インデント
**------------------------------*/
.indent--first {
 text-indent: 1em;
}

/*------------------------------**
  2行目から
  1文字インデント
**------------------------------*/
.indent--2line {
 padding-left: 1em;
 text-indent: -1em;
}

/*------------------------------**
  2行目から
  1文字インデント（余白あり）
**------------------------------*/
.indent--2lineWide {
 padding-left: 1.5em;
 text-indent: -1.5em;
}







/*------------------------------**
  マージンパーツ
**------------------------------*/
/*上*/
.mT8 {
 margin-top: 0 !important;
}
.mT8 {
 margin-top: 8px !important;
}
.mT16 {
 margin-top: 16px !important;
}
.mT24 {
 margin-top: 24px !important;
}
.mT32 {
 margin-top: 32px !important;
}
.mT40 {
 margin-top: 40px !important;
}
.mT48 {
 margin-top: 48px !important;
}
.mT56 {
 margin-top: 56px !important;
}
.mT64 {
 margin-top: 64px !important;
}
.mT72 {
 margin-top: 72px !important;
}
.mT80 {
 margin-top: 80px !important;
}
.mT96 {
 margin-top: 96px !important;
}
.mT104 {
 margin-top: 104px !important;
}
.mT112 {
 margin-top: 112px !important;
}
.mT120 {
 margin-top: 120px !important;
}
/*右*/
.mR0 {
 margin-right: 0 !important;
}
.mR8 {
 margin-right: 8px !important;
}
.mR16 {
 margin-right: 16px !important;
}
.mR24 {
 margin-right: 24px !important;
}
.mR32 {
 margin-right: 32px !important;
}
.mR40 {
 margin-right: 40px !important;
}
.mR48 {
 margin-right: 48px !important;
}
.mR56 {
 margin-right: 56px !important;
}
.mR64 {
 margin-right: 64px !important;
}
.mR72 {
 margin-right: 72px !important;
}
.mR80 {
 margin-right: 80px !important;
}
.mR96 {
 margin-right: 96px !important;
}
.mR104 {
 margin-right: 104px !important;
}
.mR112 {
 margin-right: 112px !important;
}
.mR120 {
 margin-right: 120px !important;
}
/*下*/
.mB0 {
 margin-bottom: 0 !important;
}
.mB8 {
 margin-bottom: 8px !important;
}
.mB16 {
 margin-bottom: 16px !important;
}
.mB24 {
 margin-bottom: 24px !important;
}
.mB32 {
 margin-bottom: 32px !important;
}
.mB40 {
 margin-bottom: 40px !important;
}
.mB48 {
 margin-bottom: 48px !important;
}
.mB56 {
 margin-bottom: 56px !important;
}
.mB64 {
 margin-bottom: 64px !important;
}
.mB72 {
 margin-bottom: 72px !important;
}
.mB80 {
 margin-bottom: 80px !important;
}
.mB96 {
 margin-bottom: 96px !important;
}
.mB104 {
 margin-bottom: 104px !important;
}
.mB112 {
 margin-bottom: 112px !important;
}
.mB120 {
 margin-bottom: 120px !important;
}
/*左*/
.mL0 {
 margin-left: 0 !important;
}
.mL8 {
 margin-left: 8px !important;
}
.mL16 {
 margin-left: 16px !important;
}
.mL24 {
 margin-left: 24px !important;
}
.mL32 {
 margin-left: 32px !important;
}
.mL40 {
 margin-left: 40px !important;
}
.mL48 {
 margin-left: 48px !important;
}
.mL56 {
 margin-left: 56px !important;
}
.mL64 {
 margin-left: 64px !important;
}
.mL72 {
 margin-left: 72px !important;
}
.mL80 {
 margin-left: 80px !important;
}
.mL96 {
 margin-left: 96px !important;
}
.mL104 {
 margin-left: 104px !important;
}
.mL112 {
 margin-left: 112px !important;
}
.mL120 {
 margin-left: 120px !important;
}

/*------------------------------**
  パディングパーツ
**------------------------------*/
/*上*/
.pT0 {
 padding-top: 0 !important;
}
.pT8 {
 padding-top: 8px !important;
}
.pT16 {
 padding-top: 16px !important;
}
.pT24 {
 padding-top: 24px !important;
}
.pT32 {
 padding-top: 32px !important;
}
.pT40 {
 padding-top: 40px !important;
}
.pT48 {
 padding-top: 48px !important;
}
.pT56 {
 padding-top: 56px !important;
}
.pT64 {
 padding-top: 64px !important;
}
.pT72 {
 padding-top: 72px !important;
}
.pT80 {
 padding-top: 80px !important;
}
.pT96 {
 padding-top: 96px !important;
}
.pT104 {
 padding-top: 104px !important;
}
.pT112 {
 padding-top: 112px !important;
}
.pT120 {
 padding-top: 120px !important;
}
/*右*/
.pR0 {
 padding-right: 0 !important;
}
.pR8 {
 padding-right: 8px !important;
}
.pR16 {
 padding-right: 16px !important;
}
.pR24 {
 padding-right: 24px !important;
}
.pR32 {
 padding-right: 32px !important;
}
.pR40 {
 padding-right: 40px !important;
}
.pR48 {
 padding-right: 48px !important;
}
.pR56 {
 padding-right: 56px !important;
}
.pR64 {
 padding-right: 64px !important;
}
.pR72 {
 padding-right: 72px !important;
}
.pR80 {
 padding-right: 80px !important;
}
.pR96 {
 padding-right: 96px !important;
}
.pR104 {
 padding-right: 104px !important;
}
.pR112 {
 padding-right: 112px !important;
}
.pR120 {
 padding-right: 120px !important;
}
/*下*/
.pB0 {
 padding-bottom: 0 !important;
}
.pB8 {
 padding-bottom: 8px !important;
}
.pB16 {
 padding-bottom: 16px !important;
}
.pB24 {
 padding-bottom: 24px !important;
}
.pB32 {
 padding-bottom: 32px !important;
}
.pB40 {
 padding-bottom: 40px !important;
}
.pB48 {
 padding-bottom: 48px !important;
}
.pB56 {
 padding-bottom: 56px !important;
}
.pB64 {
 padding-bottom: 64px !important;
}
.pB72 {
 padding-bottom: 72px !important;
}
.pB80 {
 padding-bottom: 80px !important;
}
.pB96 {
 padding-bottom: 96px !important;
}
.pB104 {
 padding-bottom: 104px !important;
}
.pB112 {
 padding-bottom: 112px !important;
}
.pB120 {
 padding-bottom: 120px !important;
}
/*左*/
.pL0 {
 padding-left: 0 !important;
}
.pL8 {
 padding-left: 8px !important;
}
.pL16 {
 padding-left: 16px !important;
}
.pL24 {
 padding-left: 24px !important;
}
.pL32 {
 padding-left: 32px !important;
}
.pL40 {
 padding-left: 40px !important;
}
.pL48 {
 padding-left: 48px !important;
}
.pL56 {
 padding-left: 56px !important;
}
.pL64 {
 padding-left: 64px !important;
}
.pL72 {
 padding-left: 72px !important;
}
.pL80 {
 padding-left: 80px !important;
}
.pL96 {
 padding-left: 96px !important;
}
.pL104 {
 padding-left: 104px !important;
}
.pL112 {
 padding-left: 112px !important;
}
.pL120 {
 padding-left: 120px !important;
}




/*------------------------------**
  フォントサイズパーツ
**------------------------------*/
.font--size12 {
 font-size: 12px !important;
 font-size: 1.2rem !important;
}
.font--size13 {
 font-size: 13px !important;
 font-size: 1.3rem !important;
}
.font--size14 {
 font-size: 14px !important;
 font-size: 1.4rem !important;
}
.font--size15 {
 font-size: 15px !important;
 font-size: 1.5rem !important;
}
.font--size16 {
 font-size: 16px !important;
 font-size: 1.6rem !important;
}
.font--size17 {
 font-size: 17px !important;
 font-size: 1.7rem !important;
}
.font--size18 {
 font-size: 18px !important;
 font-size: 1.8rem !important;
}
.font--size19 {
 font-size: 19px !important;
 font-size: 1.9rem !important;
}
.font--size20 {
 font-size: 20px !important;
 font-size: 2.0rem !important;
}



/*------------------------------**
  文字の太さパーツ
**------------------------------*/
.font--normal {
 font-weight: 400 !important;
}
.font--bold {
 font-weight: 700 !important;
}




/*------------------------------**
  行間パーツ
**------------------------------*/
.lh--0 {
 line-height: 0!important;
}
.lh--small {
 line-height: 1.2 !important;
}
.lh--normal {
 line-height: 1.5 !important;
}
.lh--large {
 line-height: 1.75 !important;
}





/*-- BASE COLOR ---------------------------------------------------------------------------*/

#mv h1,
#mv p,
#secQandA .tableCon tr td,
#secQandA .tableCon tr td a,
#secFlow  ol li:last-child,
.secSchedule ul li .time,
#secEntry .ttl1,
.ttl3 {
 color: #fff;
}
header,
#mv .mvScroll::before,
#secInterview ul .textBox,
#interviewModal ul .modalBox,
.secRequirements .tableCon,
#secQandA .tableCon,
#secFlow  ol li,
.secSchedule ul,
.secCareer ul .flexItem.textBox,
.secWelfare ul .flexItem.titleBox,
.secWelfare ul .flexItem.textBox,
#secEntry .ttl1::before,
.sliderBtn .prevBtn::before,
.sliderBtn .nextBtn::before,
.sliderBtn .prevBtn::after,
.sliderBtn .nextBtn::after,
.secPhilosophy .conBox .dlBox,
#secTalent .conBox .dlBox {
 background-color: #fff;
}
#interviewModal ul .modalBox .btn,
#interviewModal ul .modalBox .btn::before,
#interviewModal ul .modalBox .btn::after {
 border-color: #fff;
}
/*------------------------------------------------------------*/
.secMessage .left p::before,
.secMessage .left p::after,
#secInterview .innerCon::before,
#secInterview .innerCon::after,
.secRequirements .innerCon::before,
.secRequirements .innerCon::after,
#secQandA > .mc::before,
#secFlow  > .mc::before,
.secSchedule .innerCon::before,
.secSchedule .innerCon::after,
.secCareer .innerCon::before,
.secCareer .innerCon::after,
.secWelfare .innerCon::before,
.secWelfare .innerCon::after,
#secService .innerCon::before,
#secService .innerCon::after,
.secAccess .innerCon::before,
.secAccess .innerCon::after,
.secMessage2 .innerCon::before,
.secMessage2 .innerCon::after,
#secWorkplace > .mc::before,
#secWorkScene > .mc::before,
.secPhilosophy > .mc::before,
#secTalent .innerCon::before,
#secTalent .innerCon::after {
 background-color: #f5f5f5;
}
/*------------------------------------------------------------*/
.question-js:hover,
#pageTop a {
 background-color: #dfdfdf;
}
footer #footerBottom {
 border-color: #dfdfdf;
}
/*------------------------------------------------------------*/
#secInterview ul .name .right,
#interviewModal .name .right {
 color: #ccc;
}
.secRequirements .tableCon tr,
#secQandA .tableCon tr th {
 border-color: #ccc;
}
/*------------------------------------------------------------*/
#secQandA .tableCon tr td,
#secFlow  ol li:last-child {
 background-color: #626262;
}
/*------------------------------------------------------------*/
#secEntry::before {
 z-index: 1;
}
#interviewModal .bg,
#secEntry::after {
 background-color: #000;
}
html,
header #hLogo a,
#pageTop a,
footer #fLogo a,
footer #footerTop .right a {
 color: #000;
}
#pageTop a,
#secQandA .tableCon tr::before,
#secQandA .tableCon tr::after {
 border-color: #000;
}






/*-- LAYOUT ---------------------------------------------------------------------------*/

/*------------------------------**
  テキスト調整
**------------------------------*/
header .left p,
footer .left p,
#mv p,
strong,
.secRequirements .tableCon th p:first-child,
.secSchedule ul li .time,
.secSchedule ul li .textBox .titleBox,
#secService ul li .titleBox,
.secAccess .titleBox {
 font-weight: 600;
}
.ttl2,
.ttl3,
header #hLogo,
.secPhilosophy .conBox .dlBox dt p,
#secTalent .conBox .dlBox dt p {
 font-weight: 700;
}
#mv h1 {
 font-weight: 800;
}
header nav ul li a,
header nav ul li a .bottom,
.ttl1,
.ttl1 .bottom,
#secQandA .tableCon tr p:first-child::before,
#secFlow  ol li:not(:last-child)::before,
#secService ul li .titleBox::before,
#secEntry .entryBtn {
 font-weight: 900;
}
/*------------------------------------------------------------*/
#secQandA .tableCon tr td .textBox,
#secQandA .tableCon tr td .textBox > * {
 line-height: 0;
}
#secService ul li .titleBox::before {
 line-height: 1;
}
p,
header nav ul a {
 line-height: 1.75;
}
.ttl2,
.ttl3,
#secService ul li .titleBox,
#secQandA .tableCon tr td.open .textBox,
#secQandA .tableCon tr td.open .textBox > * {
 line-height: 1.5;
}
h1,
.ttl1,
.secSchedule ul li .textBox .titleBox {
 line-height: 1.2;
}
/*------------------------------------------------------------*/
p {
 letter-spacing: 0.02em;
}
h1,
.ttl1 .bottom {
 letter-spacing: 0.01em;
}
.ttl1 {
 letter-spacing: 0;
}
/*------------------------------------------------------------*/
a.mainColor--back,
header #hLogo a,
header nav ul li a,
footer #fLogo a,
footer #footerTop .right a {
 text-decoration: none;
}
.text--underline {
 text-decoration: underline !important;
}





/*-- COMMON ---------------------------------------------------------------------------*/

/*------------------------------**
  ヘッダー
**------------------------------*/
header {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 z-index: 9999;
}
header .innerCon {
 display: table;
 width: 100%;
 position: relative;
}
header .left,
header .right {
 display: table-cell;
 vertical-align: middle;
}
header #hLogo {
 padding-top: 8px;
}
header #hLogo,
header #hLogo img,
header #hLogo a {
 width: auto
}
header nav ul {
 display: inline-block;
 vertical-align: middle;
}
header nav ul li a {
 display: block;
 text-align: center;
}
header nav ul li a .bottom {
 display: block;
}
@media screen and (min-width:768px) {
header .left {
 padding-right: 40px;
}
header #hLogo {
 padding-bottom: 16px;
 padding-top: 16px;
}
header #hLogo,
header #hLogo img,
header #hLogo a {
 max-height: 70px;
}
header .left p {
 display: inline-block;
 vertical-align: middle;
}
header .left p:not(#hLogo) {
 padding-left: 16px;
}
header nav ul li a {
 padding: 15px 32px;
 min-width: 112px;
}
}
@media screen and (max-width:767px) {
header #hLogo {
 padding-bottom: 8px;
 padding-top: 8px;
}
header #hLogo,
header #hLogo img,
header #hLogo a {
 max-height: 55px;
}
header .left p {
 display: block;
 padding-bottom: 8px;
}
header nav ul {
 position: relative;
 right: -16px;
}
header nav ul li a {
 padding: 16px;
 min-width: 60px;
}
}



/*------------------------------**
  フッター
**------------------------------*/
footer #footerTop .innerCon {
 padding-top: 40px;
 padding-bottom: 40px;
 width: 100%;
}
footer #fLogo,
footer #fLogo img,
footer #fLogo a {
 width: auto
}
footer #footerTop .right ul li,
footer #footerTop .right ul li img,
footer #footerTop .right ul li .right {
 display: inline-block;
 vertical-align: middle;
}
footer #footerTop .right ul .page-icon {
 width: 14px;
 height: auto;
}
footer #footerTop .right ul .fb-icon,
footer #footerTop .right ul .insta-icon {
 width: 32px;
 height: auto;
}
footer #footerTop .right ul li .right {
 padding-left: 4px;
 padding-right: 32px;
}
footer #footerBottom {
 border-top-style: solid;
 border-top-width: 1px;
 padding-top: 16px;
 padding-bottom: 16px;
}
@media screen and (min-width:768px) {
footer #footerTop .innerCon {
 display: table;
 table-layout: fixed;
}
footer #footerTop .left,
footer #footerTop .right {
 display: table-cell;
 vertical-align: middle;
}
footer #footerTop .left {
 padding-right: 40px;
}
footer #fLogo {
 padding-bottom: 8px;
}
footer #fLogo,
footer #fLogo img,
footer #fLogo a {
 max-height: 70px;
}
footer .left p {
 display: inline-block;
 vertical-align: middle;
}
footer .left p:not(#fLogo) {
 padding-left: 16px;
}
footer #footerTop .right ul {
 text-align: right;
}
footer #footerTop .right ul li:not(:last-child) {
 padding-right: 16px;
}
}
@media screen and (max-width:767px) {
footer #footerTop .left {
 padding-bottom: 24px;
}
footer #fLogo {
 padding-bottom: 4px;
}
footer #fLogo,
footer #fLogo img,
footer #fLogo a {
 max-height: 60px;
}
footer .left p {
 display: block;
}
footer #footerTop .right ul {
 text-align: left;
}
footer #footerTop .right ul li:not(.btnBox) {
 width: 100%;
 padding-bottom: 8px;
}
footer #footerTop .right ul li.btnBox:not(:last-child) {
 padding-right: 8px;
}
}






/*-- INDEX ---------------------------------------------------------------------------*/

/*------------------------------**
  メインビジュアル
**------------------------------*/
#mv {
 width: 100%;
 position: relative;
 overflow: hidden;
}
#mv::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}
#mvImg {
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center center;
}
#mv .innerCon {
 text-align: center;
 position: absolute;
 z-index: 1;
 height: 100%;
 width: 100%;
 display: table;
 top: 0;
}
#mv .innerCon::before,
#mv .innerCon::after {
 content: '';
 position: absolute;
 left: 0;
 width: 100%;
 z-index: -1;
}
#mv .innerCon::before {
 top: 0;
}
#mv .innerCon::after {
 bottom: 0;
}
#mv .innerCon .textBox {
 display: table-cell;
 vertical-align: middle;
 padding-top: 112px;
 padding-bottom: 112px;
}
#mv .innerCon .textBox h1 + p {
 padding-top: 32px;
}
#mv .mvScroll {
 position: absolute;
 z-index: 2;
 text-align: center;
 right: 0;
 bottom: 80px;
 left: 0;
 margin: 0 auto;
}
#mv .mvScroll::before {
 content: '';
 position: absolute;
 right: 0;
 bottom: -80px;
 left: 0;
 margin: 0 auto;
 width: 2px;
 height: 75px;
}
@media screen and (min-width:768px) {
#mv {
 height: 920px;
}
#mv .innerCon::before,
#mv .innerCon::after {
 height: 440px;
}
}
@media screen and (max-width:767px) {
#mv {
 height: 100vh;
}
#mv .innerCon::before,
#mv .innerCon::after {
 height: 40%;
}
}


/*------------------------------**
  INDEX メインコンテンツ
**------------------------------*/
@media screen and (min-width:768px) {
main .mainSec {
 padding-top: 80px;
 padding-bottom: 80px;
}
}
@media screen and (max-width:767px) {
main .mainSec {
 padding-top: 40px;
 padding-bottom: 40px;
}
main section:nth-child(2) .mainSec {
 padding-top: 60px;
 padding-bottom: 0px;
}
}
/*------------------------------------------------------------*/
.secMessage .innerCon {
 position: relative;
 padding-top: 160px;
}
.secMessage .left p {
 position: relative;
 max-width: 480px;
 padding: 40px 0;
 margin-right: 64px;
}
.secMessage .left p::before,
.secMessage .left p::after {
 content: '';
 position: absolute;
 top: -64px;
 padding-top: 64px;
 z-index: -1;
 height: 100%;
}
.secMessage .left p::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secMessage .left p::after {
 left: 0;
 width: 100%;
 padding-right: 64px;
}
.secMessage .right {
 max-width: 784px;
 position: absolute;
 top: 0;
 right: 0;
 width: 100%;
 z-index: -1;
}
/*------------------------------------------------------------*/
#secInterview .innerCon {
 position: relative;
 width: 100%;
}
#secInterview .innerCon::before,
#secInterview .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
}
#secInterview .innerCon::before {
 left: 100%;
 margin: 0 auto;
 width: 50vw;
}
#secInterview .innerCon::after {
 right: 0;
}
#secInterview ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-items: stretch;
 padding-top: 40px;
}
#secInterview ul li {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-content: stretch;
 position: relative;
 z-index: 1;
 flex-direction: column;
}
#secInterview ul .flexItem.textBox {
 flex-grow: 1;
 padding-top: 32px;
 padding-bottom: 72px;
}
#secInterview ul .flexItem:not(.textBox) {
 width: 100%;
}
#secInterview ul .flexItem:first-child {
 position: relative;
 z-index: -1;
}
#secInterview ul .flexItem.textBox p {
 display: block;
}
#secInterview ul .flexItem.textBox p:not(:first-child) {
 padding-top: 24px;
}
#secInterview ul .btn {
 display: block;
 left: 0;
 right: 0;
 position: absolute;
}
#secInterview ul .btn a {
 display: block;
 text-align: center;
}
#interviewModal,
#interviewModal ul li:not(.bg) {
 opacity: 0;
 visibility: hidden;
 transition-duration: .3s;
 transition-timing-function: ease-in-out;
}
#interviewModal {
 position: fixed;
 top: 0;
 left: 0;
 z-index: 10000;
 width: 100%;
 height: 100%;
}
#interviewModal .bg {
 opacity: .5;
 position: absolute;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 margin: 0;
 padding: 0;
 z-index: -1;
}
#interviewModal ul li {
 position: absolute;
 right: 0;
 left: 0;
 margin: auto;
 max-width: 1000px;
 display: block;
 text-align: center;
 overflow-y: scroll;
}
#interviewModal ul .modalBox {
 padding: 40px 48px;
 display: inline-block;
 width: 100%;
 margin: 0 auto;
 box-sizing: border-box;
 position: relative;
 z-index: 10001;
}
#interviewModal ul .modalBox p {
 text-align: left;
}
#interviewModal ul .modalBox > p:not(:first-child),
#interviewModal ul .modalBoxInner > .right > p:not(:first-child):not(.btn) {
 padding-top: 8px;
}
#interviewModal ul .modalBox .btn {
 width: 40px;
 height: 40px;
 display: block;
 z-index: 1;
 border-style: solid;
 border-width: 2px;
 position: fixed;
 margin: auto;
 overflow: hidden;
}
#interviewModal ul .modalBox .btn::before,
#interviewModal ul .modalBox .btn::after {
 content: '';
 position: absolute;
 top: 50%;
 left: 0;
 display: block;
 width: 100%;
 height: 100%;
 border-top-style: solid;
 border-top-width: 2px;
}
#interviewModal ul .modalBox .btn::before {
  transform: skewY(-45deg);
}
#interviewModal ul .modalBox .btn::after {
  transform: skewY(45deg);
}
@media screen and (min-width:768px) {
#secInterview .innerCon::after {
 width: calc(100% - 200px);
}
#secInterview ul::after{
 content: '';
 display: block;
 width: 33.33333%;
}
#secInterview ul li {
 width: 33.33333%;
 margin-bottom: 80px;
}
#secInterview ul .name .left,
#secInterview ul .name .right,
#interviewModal .name .left,
#interviewModal .name .right {
 display: inline-block;
 vertical-align: middle;
}
#secInterview ul .name .left,
#interviewModal .name .left {
 padding-right: 16px;
}
#secInterview ul .flexItem:first-child {
 bottom: -40px;
 margin-top: -40px;
}
#secInterview ul .flexItem.textBox,
#secInterview ul .flexItem.textBox p {
 margin-right: 32px;
 margin-left: 32px;
}
#secInterview ul .btn {
 margin-right: 80px;
 margin-left: 80px;
}
#secInterview ul .btn {
 bottom: calc(0.5em - 24px * 2);
}
#secInterview ul .btn a {
 padding: 24px 16px;
}
#interviewModal ul .modalBox {
 padding: 40px 48px;
 }
#interviewModal ul .modalBoxInner {
 display: table;
 width: 100%;
 padding-top: 24px;
}
#interviewModal ul li {
 top: 96px;
 max-height: calc(100% - 96px * 2);
}
#interviewModal ul .modalBox > p {
 padding-right: 40px;
}
#interviewModal ul .modalBoxInner > .left,
#interviewModal ul .modalBoxInner > .right {
 display: table-cell;
 vertical-align: top;
 table-layout: fixed;
}
#interviewModal ul .modalBoxInner > .left {
 width: 46%;
}
#interviewModal ul .modalBoxInner > .right {
 padding-left: 24px;
}
#interviewModal ul .modalBox .btn {
 top: 24px;
 left: calc(50vw + 1000px / 2 - 44px);
}
}
@media screen and (max-width:767px) {
#secInterview .innerCon::after {
 width: calc(100% - 64px);
}
#secInterview ul li {
 width: 50%;
 margin-bottom: 56px;
}
#secInterview ul .name .left,
#secInterview ul .name .right,
#interviewModal .name .left,
#interviewModal .name .right {
 display: block; 
}
#secInterview ul .flexItem:first-child {
 bottom: -16px;
 margin-top: -16px;
}
#secInterview ul .flexItem.textBox,
#secInterview ul .flexItem.textBox p {
 margin-right: 8px;
 margin-left: 8px;
}
#secInterview ul .btn {
 margin-right: 16px;
 margin-left: 16px;
}
#secInterview ul .btn {
 bottom: calc(0.5em - 16px * 2);
}
#secInterview ul .btn a {
 padding: 16px 8px;
}
#interviewModal ul .modalBox {
 padding: 24px 24px;
 }
#interviewModal ul li {
 top: 80px;
 max-height: calc(100% - 80px * 2);
}
#interviewModal ul .modalBoxInner > .left,
#interviewModal ul .modalBoxInner > .right {
 padding-top: 24px;
}
#interviewModal ul .modalBox .btn {
 top: 16px;
 left: 16px;
}
}
/*------------------------------------------------------------*/
.secRequirements .innerCon {
 position: relative;
 width: 100%;
}
.secRequirements .innerCon::before,
.secRequirements .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 240px);
}
.secRequirements .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secRequirements .innerCon::after {
 left: 0;
}
.secRequirements .tableCon {
 margin-top: 40px;
}
.secRequirements .tableCon table {
 width: 100%;
 height: 100%;
 max-width: 960px;
 margin-right: auto;
 margin-left: auto;
}
.secRequirements .tableCon tr {
 border-bottom-style: solid;
 border-bottom-width: 1px;
}
@media screen and (min-width:768px) {
.secRequirements .innerCon::after {
 width: calc(100% - 200px);
}
.secRequirements .tableCon {
 padding: 64px;
}
.secRequirements .tableCon {
 
}
.secRequirements .tableCon tr th,
.secRequirements .tableCon tr td {
 padding: 16px 24px;
}
}
@media screen and (max-width:767px) {
.secRequirements .innerCon::after {
 width: calc(100% - 64px);
}
.secRequirements .tableCon {
 padding: 24px 16px;
}
.secRequirements .tableCon tr th,
.secRequirements .tableCon tr td {
 display: block;
 padding-right: 8px;
 padding-left: 8px;
}
.secRequirements .tableCon tr th {
 padding-top: 8px;
}
.secRequirements .tableCon tr td {
 padding-bottom: 8px;
}
}
/*------------------------------------------------------------*/
#secQandA > .mc {
 position: relative;
 width: 100%;
}
#secQandA > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
 left: 0;
 margin: 0 auto;
 width: 100%;
}
#secQandA .tableCon {
 padding: 0;
 margin-top: 40px;
}
#secQandA .tableCon table {
 width: 100%;
}
#secQandA table,
#secQandA tbody,
#secQandA tr,
#secQandA .tableCon tr th {
 display: block;
}
#secQandA .tableCon tr th {
 position: relative;
 border-bottom-style: solid;
 border-bottom-width: 1px;
}
#secQandA .tableCon tr th > p:first-child::before {
 content: '\0051';
 position: absolute;
 top: 50%;
 -ms-transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
}
#secQandA .tableCon tr th::before {
 border-top-style: solid;
 border-top-width: 2px;
 right: 0;
 top: calc(50% + 14px);
}
#secQandA .tableCon tr th::after {
 border-right-style: solid;
 border-right-width: 2px;
 right: 14px;
 top: 50%;
}
#secQandA .tableCon tr th.open::after {
 visibility: hidden;
}
#secQandA .tableCon tr th::before,
#secQandA .tableCon tr th::after {
 content: '';
 position: absolute;
 -ms-transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 width: 30px;
 height: 30px;
 text-align: center;
}
#secQandA .tableCon tr td {
 display: block;
}
#secQandA .tableCon tr td .textBox,
#secQandA .tableCon tr td .textBox > * {
 padding-top: 0;
 padding-bottom: 0;
 visibility: hidden;
}
#secQandA .tableCon tr td.open .textBox,
#secQandA .tableCon tr td.open .textBox > * {
 visibility: visible;
}
#secQandA .tableCon tr td.open .textBox {
 padding-top: 32px;
 padding-bottom: 32px;
 padding-right: 32px;
}
@media screen and (min-width:768px) {
#secQandA > .mc {
 padding-bottom: 24px;
}
#secQandA .tableCon tr th > p:first-child::before {
 left: 32px;
}
#secQandA .tableCon tr th::before,
#secQandA .tableCon tr th::after {
 margin-right: 32px;
}
#secQandA .tableCon tr th {
 padding: 32px 96px;
}
#secQandA .tableCon tr td {
 padding-left: 96px;
}
}
@media screen and (max-width:767px) {
#secQandA .tableCon tr th > p:first-child::before {
 left: 24px;
}
#secQandA .tableCon tr th::before,
#secQandA .tableCon tr th::after {
 margin-right: 16px;
}
#secQandA .tableCon tr th {
 padding: 32px 64px 32px 72px;
}
#secQandA .tableCon tr td {
 padding-left: 32px;
}
}
/*------------------------------------------------------------*/
#secFlow  > .mc {
 position: relative;
 width: 100%;
}
#secFlow  > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
 left: 0;
 margin: 0 auto;
 width: 100%;
}
#secFlow  ol {
 margin: 40px auto 0;
 display: block;
}
#secFlow  ol li {
 position: relative;
 margin-bottom: 40px;
}
#secFlow  ol li:not(:last-child)::before {
 counter-increment: flow_num;
 content: counter(flow_num);
 position: absolute;
 left: 32px;
 top: 50%;
 -ms-transform: translateY(-50%);
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
}
#secFlow  ol li .arrow {
 position: absolute;
 bottom: -16px;
 left: 0;
 right: 0;
 margin: auto;
 text-align: center;
 transform: scaleY(0.8);
}
#secFlow  ol li .arrow::before {
 content: '';
 position: relative;
 display: inline-block;
 border-top-style: solid;
 border-left-style: solid;
 border-top-width: 1px;
 border-left-width: 1px;
 width: 40px;
 height: 40px;
 transform: rotate(225deg)
}
@media screen and (min-width:768px) {
#secFlow  > .mc {
 padding-bottom: 24px;
}
#secFlow  ol li {
 padding: 32px 96px;
}
}
@media screen and (max-width:767px) {
#secFlow  ol li {
 padding: 32px 64px;
}
}
/*------------------------------------------------------------*/
.secSchedule .innerCon {
 position: relative;
 width: 100%;
}
.secSchedule .innerCon::before,
.secSchedule .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 700px);
}
.secSchedule .innerCon::before {
 left: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secSchedule .innerCon::after {
 right: 0;
}
.secSchedule ul {
 margin-top: 40px;
}
.secSchedule ul li {
 clear: both;
 display: table;
 width: 100%;
 table-layout: fixed;
}
.secSchedule ul li .right,
.secSchedule ul li .left {
 display: table-cell;
 vertical-align: top;
}
.secSchedule ul li .left {
 position: relative;
 z-index: 1;
}
.secSchedule ul li:not(:last-child) .left::before {
 content: '';
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 margin: auto;
 width: 1px;
 height: 100%;
 z-index: -1;
}
.secSchedule ul li .time {
 display: block;
 padding: 8px 0;
 text-align: center;
}
.secSchedule ul li .textBox .titleBox + p {
 padding-top: 16px;
}
@media screen and (min-width:768px) {
.secSchedule .innerCon::after {
 width: calc(100% - 200px);
}
.secSchedule ul {
 padding: 64px 32px 0;
}
.secSchedule ul li .left {
 width: 20%;
}
.secSchedule ul li .right {
 padding-left: 48px;
}
.secSchedule ul li .textBox {
 float: left;
 width: 72%;
}
.secSchedule ul li .imgBox {
 float: right;
 width: calc(28% - 24px);
}
.secSchedule ul li:not(:last-child) .textBox,
.secSchedule ul li:not(:last-child) .imgBox {
 padding-bottom: 72px;
}
}
@media screen and (max-width:767px) {
.secSchedule .innerCon::after {
 width: calc(100% - 64px);
}
.secSchedule ul {
 padding: 24px 16px 0;
}
.secSchedule ul li .left {
 width: 30%;
}
.secSchedule ul li .right {
 padding-left: 24px;
}
.secSchedule ul li .textBox {
 padding-bottom: 24px;
}
.secSchedule ul li:not(:last-child) .imgBox {
 padding-bottom: 80px;
}
}
/*------------------------------------------------------------*/
.secCareer .innerCon {
 position: relative;
 width: 100%;
}
.secCareer .innerCon::before,
.secCareer .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 180px);
}
.secCareer .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secCareer .innerCon::after {
 left: 0;
}
.secCareer ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-items: stretch;
 padding-top: 40px;
}
.secCareer ul li {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-content: stretch;
 flex-direction: column;
}
.secCareer ul .flexItem.textBox {
 padding: 32px;
 flex-grow: 1;
}
.secCareer ul .flexItem.textBox p {
 display: block;
}
#secInterview ul .flexItem.textBox p:not(:first-child) {
 padding-top: 24px;
}
@media screen and (min-width:768px) {
.secCareer .innerCon::after {
 width: calc(100% - 200px);
}
.secCareer ul::after{
 content: '';
 display: block;
 width: 29%;
}
.secCareer ul li {
 width: 29%;
}
.secCareer ul li:not(:last-child) {
 padding-bottom: 5%;
}
}
@media screen and (max-width:767px) {
.secCareer .innerCon::after {
 width: calc(100% - 64px);
}
.secCareer ul li {
/* width: 48%;*/
}
.secCareer ul li:not(:last-child) {
 padding-bottom: 24px;
}
}
/*------------------------------------------------------------*/
.secWelfare .innerCon {
 position: relative;
 width: 100%;
}
.secWelfare .innerCon::before,
.secWelfare .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 240px);
}
.secWelfare .innerCon::before {
 left: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secWelfare .innerCon::after {
 right: 0;
}
.secWelfare ul {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-items: stretch;
 padding-top: 40px;
}
.secWelfare ul li {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-content: stretch;
 align-items: stretch;
 flex-direction: column;
}
.secWelfare ul .flexItem.titleBox,
.secWelfare ul .flexItem.textBox {
 padding-right: 32px;
 padding-left: 32px;
}
.secWelfare ul .flexItem.titleBox {
 padding-top: 32px;
 padding-bottom: 16px;
}
.secWelfare ul .flexItem.textBox {
 flex-grow: 1;
 padding-top: 16px;
 padding-bottom: 32px;
}
.secWelfare ul .flexItem:not(.textBox):not(.titleBox) {
 width: 100%;
}
.secWelfare ul .flexItem.textBox p {
 display: block;
}
.secWelfare ul .flexItem.textBox p:not(:first-child) {
 padding-top: 24px;
}
@media screen and (min-width:768px) {
.secWelfare .innerCon::after {
 width: calc(100% - 200px);
}
.secWelfare ul::after{
 content: '';
 display: block;
 width: 30%;
}
.secWelfare ul li {
 width: 29%;
}
.secWelfare ul li:not(:last-child) {
 padding-bottom: 5%;
}
}
@media screen and (max-width:767px) {
.secWelfare .innerCon::after {
 width: calc(100% - 64px);
}
.secWelfare ul li {
/* width: 48%;*/
}
.secWelfare ul li:not(:last-child) {
 padding-bottom: 24px;
}
}
/*------------------------------------------------------------*/
#secService .innerCon {
 position: relative;
 width: 100%;
 padding-bottom: 24px;
}
#secService .innerCon::before,
#secService .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
}
#secService .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
#secService .innerCon::after {
 left: 0;
}
#secService ul {
 display: inline-block;
 width: 100%;
 padding-top: 40px;
}
#secService ul > li {
 clear: both;
 display: inline-block;
 width: 100%;
}
#secService ul li .textBox {
 max-width: 600px;
 display: block;
 width: auto;
}
#secService ul li .titleBox,
#secService ul li .titleBox::before {
 display: inline-block;
 vertical-align: baseline;
}
#secService ul li .titleBox::before {
 counter-increment: service_num;
 /* content: counter(service_num, decimal-leading-zero); */
 padding-right: 0.25em;
}
@media screen and (min-width:768px) {
#secService .innerCon::after {
 width: calc(100% - 216px);
}
#secService ul > li:not(:last-child) {
 padding-bottom: 120px;
}
#secService ul li .listBox {
 width: 50%;
}
#secService ul li:nth-child(odd) .listBox:first-child,
#secService ul li:nth-child(even) .listBox:last-child {
 float: left;
}
#secService ul li:nth-child(odd) .listBox:last-child,
#secService ul li:nth-child(even) .listBox:first-child {
 float: right;
}
#secService ul li:nth-child(odd) .textBox {
 padding-left: 64px;
 padding-right: 16px;
 margin-left: 0;
 margin-right: auto;
}
#secService ul li:nth-child(even) .textBox {
 padding-right: 64px;
 padding-left: 16px;
 margin-right: 0;
 margin-left: auto;
}
#secService ul li .titleBox + p {
 padding-top: 32px;
}
}
@media screen and (max-width:767px) {
#secService .innerCon::after {
 width: calc(100% - 80px);
}
#secService ul > li:not(:last-child) {
 padding-bottom: 80px;
}
#secService ul li .textBox {
 padding-top: 24px;
 padding-right: 16px;
 padding-left: 16px;
}
#secService ul li .titleBox + p {
 padding-top: 16px;
}
}
/*------------------------------------------------------------*/
.secAccess .innerCon {
 position: relative;
 width: 100%;
}
.secAccess .innerCon::before,
.secAccess .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
}
.secAccess .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secAccess .innerCon::after {
 right: 0;
}
.secAccess .accessCon {
 padding-top: 40px;
}
.secAccess .imgBox {
 text-align: center;
}
.secAccess .titleBox + p {
 padding-top: 5px;
}
.secAccess li > p +p {
 padding-top: 24px;
}
.secAccess ul li {
 vertical-align: top;
 padding-top: 32px;
}
@media screen and (min-width:768px) {
.secAccess .innerCon::before,
.secAccess .innerCon::after {
 height: 480px;
}
.secAccess .innerCon::after {
 width: calc(100% - 200px);
}
.secAccess ul::after{
 content: '';
 display: block;
 width: 30%;
}
.secAccess ul li {
 display: inline-block;
 width: 50%;
}
}
@media screen and (max-width:767px) {
.secAccess .innerCon::before,
.secAccess .innerCon::after {
 height: 0;
 padding: 18% 0;
}
.secAccess .innerCon::after {
 width: calc(100% - 64px);
}
.secAccess ul li {
 display: block;
}
}
/*------------------------------------------------------------*/ 
.secMessage2 .innerCon {
 /* position: relative; */
 width: 100%;
 padding-bottom: 24px;
}
.secMessage2 .innerCon::before,
.secMessage2 .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
}
.secMessage2 .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
.secMessage2 .innerCon::after {
 left: 0;
}
.secMessage2 .textBox {
 padding-top: 10px;
}
.secMessage2 .textBox > p:not(:first-child) {
 padding-top: 16px;
}
.secMessage2 .conBox {
 padding-top: 40px;
}
@media screen and (min-width:768px) {
.secMessage2 .innerCon::after {
 width: calc(100% - 216px);
}
.secMessage2 ul::after{
 content: '';
 display: block;
 width: 30%;
}
}
@media screen and (max-width:767px) {
.secMessage2 .innerCon::after {
 width: calc(100% - 80px);
}
}
/*------------------------------------------------------------*/
#secWorkplace > .mc {
 position: relative;
 width: 100%;
}
#secWorkplace > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 240px;
 left: 0;
 margin: 0 auto;
 width: 100%;
}
@media screen and (min-width:768px) {
#secWorkplace > .mc {
 padding-bottom: 24px;
}
}
/*------------------------------------------------------------*/
#secWorkScene > .mc {
 position: relative;
 width: 100%;
}
#secWorkScene > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 left: 0;
 margin: 0 auto;
 width: 100%;
}
@media screen and (min-width:768px) {
#secWorkScene > .mc {
 padding-bottom: 24px;
}
#secWorkScene > .mc::before {
 height: 440px;
}
}
@media screen and (max-width:767px) {
#secWorkScene > .mc::before {
 height: 240px;
}
}
/*------------------------------------------------------------*/
.secPhilosophy > .mc {
 position: relative;
 width: 100%;
}
.secPhilosophy > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 144px);
 left: 0;
 margin: 0 auto;
 width: 100%;
}
.secPhilosophy .conBox > .imgBox {
 position: relative;
 z-index: 0;
 top: 64px;
 margin-top: -24px;
 padding-bottom: 24px;
}
.secPhilosophy .conBox .dlBox {
 position: relative;
 z-index: 1;
 box-sizing: border-box;
}
.secPhilosophy .conBox .dlBox:not(:last-child) {
 margin-bottom: 24px;
}
.secPhilosophy .conBox .dlBox dt {
 margin-bottom: 8px;
}
@media screen and (min-width:768px) {
.secPhilosophy > .mc {
 padding-bottom: 24px;
}
.secPhilosophy .conBox .dlBox {
 padding: 40px;
}
}
@media screen and (max-width:767px) {
.secPhilosophy .conBox .dlBox {
 padding: 32px;
}
}
/*------------------------------------------------------------*/
#secTalent .innerCon  {
 position: relative;
 width: 100%;
 z-index: 1;
}
#secTalent .innerCon::before,
#secTalent .innerCon::after {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: calc(100% - 180px);
}
#secTalent .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
#secTalent .innerCon::after {
 left: 0;
}
#secTalent .conBox {
 position: relative;
 z-index: 2;
}
#secTalent .conBox > .imgBox {
 position: relative;
 z-index: 0;
 top: 64px;
 margin-top: -24px;
 padding-bottom: 24px;
}
#secTalent .conBox .listBox {
 position: relative;
 z-index: 1;
}
#secTalent .conBox .dlBox {
 box-sizing: border-box;
}
#secTalent .conBox .dlBox dt {
 margin-bottom: 8px;
}
#secTalent .conBox .dlBox dt p::before {
 counter-increment: talent_num;
 content: counter(talent_num, decimal-leading-zero);
 padding-right: 0.25em;
}
@media screen and (min-width:768px) {
#secTalent .innerCon::after {
width: calc(100% - 560px);
}
#secTalent .conBox .listBox {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 align-items: stretch;
}
#secTalent .conBox .dlBox {
 width: 49%;
 margin-bottom: 2%;
 padding: 40px;
}
}
@media screen and (max-width:767px) {
#secTalent .innerCon::after {
 width: calc(100% - 80px);
}
#secTalent .conBox .dlBox {
 padding: 32px;
 margin-bottom: 24px;
}
}
/*------------------------------------------------------------*/
#secEntry {
 background-image: url("../images/common/entry_bg1.webp");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: cover;
 position: relative;
 overflow: hidden;
}
#secEntry::after,
#secEntry::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}
#secEntry .innerCon {
 text-align: center;
 padding: 96px 0;
 position: relative;
 z-index: 1;
}
#secEntry .innerCon::before,
#secEntry .innerCon::after {
 content: '';
 position: absolute;
 left: 0;
 height: 440px;
 width: 100%;
 z-index: -1;
}
#secEntry .innerCon::before {
 top: 0;
}
#secEntry .innerCon::after {
 bottom: 0;
}
#secEntry .entryBtn {
 padding-top: 56px;
}
#secEntry .entryBtn a {
 padding: 24px 16px;
 display: block;
}
/*------------------------------------------------------------*/ 
#secForm {
 margin-top: 144px;
 position: relative;
 margin-bottom: 80px;
 padding-bottom: 80px;
}
#secForm .innerCon {
 position: relative;
 width: 100%;
}
#secForm > .mc::before {
 content: '';
 position: absolute;
 top: 38px;
 z-index: -1;
 height: 100%;
 left: 0;
 margin: 0 auto;
 width: 100%;
}
#secForm  .innerCon::before {
 right: 100%;
 margin: 0 auto;
 width: 50vw;
}
#secForm  .innerCon::after {
 left: 0;
}
#secForm  .tableCon {
 margin-top: 40px;
}
#secForm  .tableCon table {
 width: 100%;
 height: 100%;
 max-width: 960px;
 margin-right: auto;
 margin-left: auto;
}
#secForm  .tableCon tr {
 border-bottom-style: solid;
 border-bottom-width: 1px;
}
#secForm  .tableCon th,
#secForm  .tableCon td {
 vertical-align: middle;
}
#secForm  .tableCon th p,
#secForm  .tableCon td p {
 display: inline-block;
 padding-right: 16px;
 vertical-align: top;
}
#secForm .tableCon tr.hissu th::after {
 content: '必須';
 padding: 8px;
 background-color: #f00;
 color: #fff;
 display: inline-block;
 font-weight: 900;
}
#secForm  .tableCon td input {
 height: 100%;
 vertical-align: super;
}
#secForm .tableCon td input[type="radio"] {
 display: inline-block;
 vertical-align: middle;
 width: 16px;
 height: 16px;
}
#secForm .tableCon td input[type="radio"] + span {
 margin-left: 8px;
 margin-right: 24px;
 display: inline-block;
 vertical-align: middle;
}
#secForm .tableCon td input[type="text"],
#secForm .tableCon td textarea {
 box-sizing: border-box;
 padding: 8px;
 border: solid 1px #ccc;
 background-color: #fafafa;
 border-radius: 4px;
}
#secForm input[type="submit"],
#secForm input[type="reset"] {
 border: none;
 padding: 8px 16px;
 border-radius: 8px;
}
#secForm .sendBtn {
 padding-top: 40px;
 text-align: center;
}
.privacyBox {
 max-width: 800px;
 border: solid 1px #999;
 padding: 16px 32px 16px 24px;
 box-sizing: border-box;
 margin-top: 40px;
 max-height: 200px;
 overflow-y: scroll;
}
@media screen and (min-width:768px) {
#secForm  .innerCon::after {
 width: calc(100% - 200px);
}
#secForm  .tableCon {
 padding: 64px;
}
#secForm  .tableCon tr th,
#secForm  .tableCon tr td {
 padding: 32px 24px;
}
#secForm  .tableCon tr th {
 width: 20em;
}
#secForm .tableCon td input[type="text"] {
 width: 30em;
}
#secForm .tableCon td textarea {
 width: 30em;
 height: 10em;
}
.privacyBox {
 margin-right: auto;
 margin-left: auto;
}
}
@media screen and (max-width:767px) {
#secForm  .innerCon::after {
 width: calc(100% - 64px);
}
#secForm  .tableCon {
 padding: 24px 16px 40px;
}
#secForm  .tableCon tr th,
#secForm  .tableCon tr td {
 display: block;
 padding-right: 8px;
 padding-left: 8px;
}
#secForm  .tableCon tr th {
 padding-top: 24px;
 padding-bottom: 16px;
}
#secForm  .tableCon tr td {
 padding-bottom: 24px;
}
#secForm .tableCon td input[type="text"] {
 width: 100%;
}
#secForm .tableCon td textarea {
 width: 100%;
 height: 10em;
}
.privacyBox {
 margin-right: 8px;
 margin-left: 8px;
}
}






/*-- CLEARFIX ---------------------------------------------------------------------------*/

.clearfix::after {
 content: '';
 display: table;
 clear: both;
}