@charset "UTF-8"; 

/* ==========================================================================
   parts
   ========================================================================== */

/* header
   ========================================================================== */

header.mobile nav.main .nav.logo { flex: 1 0 90px; }
header.mobile nav.main .nav.logo a { width: 90px; height: 35px; }
header.mobile nav.main .nav.logo a.replace::after { background-image: url(/media/recruit/mobile/logo_header.svg); }



/* footer
   ========================================================================== */

footer { border-top: 1px solid #ea5504; margin-top: 100px; }

#pagetop { background: url(/media/recruit/pagetop.svg) no-repeat transparent; background-size: 64px 70px; opacity: .8; width: 64px; height: 70px; bottom: 20px; }



/* nav highlighting
   ========================================================================== */

body.index.newgraduate nav ul li.newgraduate a span,
body.index.midcareer nav ul li.midcareer a span,
body.voice.president nav ul li.president a span,
body.voice.employees nav ul li.employees a span,
body.voice.faq nav ul li.faq a span { color: #ea5504; font-weight: 500; }



/* general
   ========================================================================== */

.index-list ul { border-top-color: #e0dfdf; }
.index-list ul li { border-bottom-color: #e0dfdf; }
.index-list ul li > a, .index-list ul li > span { background-repeat: no-repeat; background-position: 15px center; background-size: 30px 34px; padding: 20px 15px 20px 55px; box-sizing: border-box; }
.index-list ul li.newgraduate > a, .index-list ul li.newgraduate > span { background-image: url(/media/recruit/icon_news_puzzle_g.svg); }
.index-list ul li.midcareer > a, .index-list ul li.midcareer > span,
.index-list ul li.parttime > a, .index-list ul li.midcareer > span { background-image: url(/media/recruit/icon_news_puzzle_b.svg); }
.index-list ul li a .heading { background-image: url(/media/recruit/arrow_next.svg); background-size: 10px 15px; }

.bordered { margin: 0 auto 40px; }
.block.bordered { padding: 0 15px 0; }

.article-body .buttons { width: calc(100% - 30px); text-align: center; }

/* expandable list */
.expandable-list > ul li .block { max-height: 3000px; margin: 0 auto; position: relative; overflow: hidden; opacity: 1; z-index: 2; }
.expandable-list > ul { perspective: 1000px; }
.expandable-list > ul li { position: relative; }
.expandable-list > ul li i { position: absolute; right: 25px; top: 45px; }
.expandable-list > ul li i::before,
.expandable-list > ul li i::after { content: ''; position: absolute; background-color: #ea5504; width: 2px; height: 12px; }
.expandable-list > ul li i::before { transform: translate(-4px, 0) rotate(45deg); }
.expandable-list > ul li i::after { transform: translate(4px, 0) rotate(-45deg); }
.expandable-list > ul li input[type=checkbox]:checked ~ i::before { transform: translate(4px, 0) rotate(45deg); }
.expandable-list > ul li input[type=checkbox]:checked ~ i::after { transform: translate(-4px, 0) rotate(-45deg); }
.expandable-list > ul li input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; }
.expandable-list > ul li input[type=checkbox]:checked ~ div { margin-top: 0; max-height: 0; opacity: 0; transform: translate(0, 50%); }
.expandable-list > ul li .block,
.expandable-list > ul li i::before,
.expandable-list > ul li i::after { transition: all .25s ease-in-out; }

.expandable-list h3 { height: 72px; color: #ea5504; font-size: 1.8rem; font-weight: 500; line-height: 1.4; cursor: pointer; padding: 10px 50px 0 15px; border-bottom: 1px solid #ea5504; box-sizing: border-box; }
.expandable-list .block h4 { font-size: 1.8rem; font-weight: 500; line-height: 1.4; }
.expandable-list .block h4 b { color: #ea5504; }
.expandable-list .block p { font-size: 1.7rem; font-feature-settings: 'palt'; }
.expandable-list .block ul li { font-size: 1.7rem; margin-bottom: 10px; }
.expandable-list .block > * { margin: 15px; }
.expandable-list > .block { padding-top: 20px; margin: 0 auto; }
.expandable-list > .block > *:first-child { margin-top: 0; }

.nav-arrow-right { width: 100%; overflow: hidden; position: relative; }
.nav-arrow-right a.nav { display: flex; justify-content: flex-start; align-items: center; width: 650px; height: 72px; background-repeat: no-repeat; background-position: 0 0; background-size: cover; opacity: 1; transition: .25s; }
.nav-arrow-right a > span { display: flex; justify-content: center; align-items: center; flex-direction: column; height: 60px; color: #fff; font-size: 2.4rem; font-weight: 300; margin-left: 40px; }
.nav-arrow-right a > span span { display: block; }
.nav-arrow-right a > span  .sub { font-size: .8rem; font-weight: 350; margin-top: 3px; }
.nav-arrow-right a.nav.newgraduate { background-image: url(/media/recruit/arrow_g.svg); margin: 0 0 20px 50%; }
.nav-arrow-right a.nav.midcareer { background-image: url(/media/recruit/arrow_b.svg); margin: 0 0 0 25%; }

.nav-arrow-left { width: 100%; height: 72px; overflow: hidden; position: relative; }
.nav-arrow-left a.nav { display: flex; justify-content: flex-end; align-items: center; width: 650px; height: 72px; background: url(/media/recruit/arrow_o.svg) no-repeat 0 0; background-size: contain; opacity: 1; transition: .25s; }
.nav-arrow-left a > span { display: inline-flex; align-items: center; height: 30px; color: #fff; font-size: 2rem; font-weight: 300; margin-right: 40px; }
.nav-arrow-left a.nav.out span span.heading { background: url(/media/common/icon_out_w.svg) no-repeat left center; background-size: auto 14px; padding-left: 21px; }

a.button { width: 100%; min-height: 47px; background-color: #fff; border: 1px solid #e0dfdf; border-radius: 0; padding: 15px 20px; box-shadow: 2px 2px 4px rgba(0, 0, 0, .1); }
a.button.more span { font-size: 1.8rem; background-image: url(/media/recruit/arrow_next.svg); background-size: 10px 15px; padding-right: 20px; }

.article-header.billboard .extra.scroll { display: flex; justify-content: center; width: 100px; height: 100px; border-radius: 50px; background-color: #fff; position: absolute; left: calc(50% - 50px); bottom: -50px; }
.article-header.billboard .extra.scroll span { display: inline-block; color: #a20016; font-size: 1rem; font-weight: 400; background-image: url(/media/recruit/arrow_down_o.svg); background-repeat: no-repeat; background-position: center top; background-size: auto 26px; padding-top: 30px; margin-top: 10px; }

.lazyload { opacity: 0; }
.lazyloaded { opacity: 1; transition: all 1s; }



/* article
   ========================================================================== */

.article-header { margin-bottom: 50px; }
body.recruit .article-header h1 { width: auto; max-width: none; height: auto; background: none; padding: 0; margin-bottom: 0; position: relative; flex-direction: column; justify-content: center; align-items: center; }

.article-header.sub { margin-bottom: 20px; }

.article-header.sub h1 > .text { text-align: center; }
.article-header.sub h1 > .text > .heading { color: #595757; font-family: 'Noto Sans CJK JP', sans-serif; font-size: 1.8rem; font-weight: 500; margin: -25px 0 0; }
.article-header.sub h1 > .text > .sub { color: rgba(89, 87, 87, .3); font-family: 'Noto Sans CJK JP', sans-serif; font-size: 3rem; font-weight: 100; }
.article-header.sub h1 img { width: auto; height: 33px; margin-top: 15px; }

.article-header ~ .article-header { margin-top: -50px; }

body.recruit .article-header.billboard { background-color: transparent; background-position: center center; }
body.recruit .article-header.billboard { height: 510px; }
body.recruit .article-header.billboard h1 { display: block; min-height: auto; }
body.recruit .article-header.billboard h1 > .text { display: block; text-align: left; }
body.recruit .article-header.billboard h1 > .text > .heading { font-family: 'Noto Serif CJK JP', serif; font-size: 2.8rem; font-weight: 700; line-height: 1.8; }

body.recruit .article-body.styled { width: 100%; }
body.recruit .styled p { font-size: 1.5rem; }

article > .article-body > h1 { border-bottom: 1px solid #e0dfdf; padding: 0 15px 30px; margin: 30px auto; }
article > .article-body > h1 .text { display: block; margin: 0 auto; }
article > .article-body > h1 .text > span { display: block; }
article > .article-body > h1 .text > .heading { font-size: 2rem; font-weight: 700; line-height: 1.2; }
article > .article-body > h1 .text > .extras { display: flex; align-items: center; margin-bottom: 15px; }
article > .article-body > h1 .text .date { font-size: 1.8rem; font-weight: 350; margin-right: 20px; }

article > .article-footer { text-align: right; border-top: 1px solid #e0dfdf; padding: 45px 40px 0; margin: 0 auto; }



/* top page
   ========================================================================== */

body.top main { background: none; padding-bottom: 0; }

body.top article { margin-bottom: 70px; }

body.top #top { overflow: hidden; }
body.top #top .article-header.billboard { height: calc(100vh - 54px); background: url(/media/recruit/mobile/bg_top_header.jpg) center center no-repeat; background-size: cover; margin-bottom: 0; }
body.top #top .article-header.billboard .inner { height: 100%; position: relative; }
body.top #top a.nav { display: flex; justify-content: flex-start; align-items: center; width: 260px; height: 50px; background-repeat: no-repeat; background-position: 0 0; background-size: 260px 50px; position: absolute; opacity: 1; transition: .25s; }
body.top #top a.nav.newgraduate { background-image: url(/media/recruit/arrow_top_g.svg); left: -50px; top: 0; }
body.top #top a.nav.midcareer { background-image: url(/media/recruit/arrow_top_b.svg); right: -50px; bottom: 0; }
body.top #top a.nav > span { display: inline-block; color: #fff; font-size: 1.5rem; font-weight: 400; text-align: center; position: absolute; }
body.top #top a.nav.newgraduate > span { right: 45px; top: 5px; }
body.top #top a.nav.midcareer > span { left: 45px; bottom: 5px; }
body.top #top a.nav > span .sub { display: block; font-size: .7rem; font-weight: 350; margin-top: 2px; }
body.top #top a.nav:hover { opacity: .8; filter: none; }
body.top #top p { color: #fff; position: absolute; }
body.top #top p.heading { display: flex; justify-content: center; align-items: center; font-size: 3.6rem; font-weight: 300; line-height: 1.25; width: 170px; height: 170px; background-color: #ea5504; margin: auto; left: 0; top: 50%; transform: translateY(-50%); }
body.top #top p.sub { font-size: 1.5rem; font-weight: 350; line-height: 1.6; width: 230px; height: 160px; left: 50%; top: 50%; transform: translateX(-50%); opacity: 1; }

body.top figure.top_banner { width: 290px; box-shadow: 4px 4px 4px rgba(0, 0, 0, .25); margin: -30px auto 40px; }
body.top figure.top_banner a img { width: 290px; height: auto; }

body.top #work { margin-bottom: 0; }
body.top #work > .bordered { margin-bottom: 0; }
body.top #work .expandable-list h3 { color: #595757; }
body.top #work > img { width: 100%; }

body.top #training { background-color: #ffe869; padding: 60px 0 50px; margin-bottom: 0; }
body.top #training > .bordered { margin-bottom: 0; }
body.top #training .block { background: url(/media/recruit/bg_top_training.svg) no-repeat center bottom; background-size: auto 180px; padding: 0 15px 200px; box-sizing: border-box; position: relative; }
body.top #training .block h3 { font-size: 2.8rem; font-weight: 300; line-height: 1.4; text-align: center; }
body.top #training .block h4 { font-size: 1.8rem; font-weight: 500; text-align: center; margin: 20px 0; }
body.top #training .block p { font-size: 1.7rem; line-height: 1.6; }
body.top #training .block .buttons { width: calc(100% - 15px); text-align: center; position: absolute; bottom: -15px; }
body.top #training .block .buttons a.button { width: 160px; padding: 0; }
body.top #training .block .buttons a.button span { font-size: 1.6rem; }

body.top #voice { background-color: #fff6d0; padding: 60px 0 50px; }
body.top #voice .article-header { margin-bottom: 0; }
body.top #voice h1 .block { display: none; }
body.top #voice nav.voice { display: flex; flex-direction: column; width: 100%; margin: 0 auto; }
body.top #voice nav.voice .nav { background-repeat: no-repeat; background-position: center top; background-size: cover; margin-top: 75px; position: relative; }
body.top #voice nav.voice .nav a { display: flex; justify-content: center; align-items: center; width: 100%; height: 238px; background: transparent; transition: .25s; }
body.top #voice nav.voice .nav a span { display: flex; align-items: center; width: 160px; height: 40px; color: #fff; font-size: 2rem; font-weight: 300; border: 1px solid #fff; background: url(/media/recruit/arrow_next_w.svg) no-repeat calc(100% - 10px) center rgba(89, 87, 87, .3); background-size: 9px 14px; padding: 10px; box-sizing: border-box; border-box; }
body.top #voice nav.voice .nav img { display: none; }
body.top #voice nav.voice .nav::before { content: ''; display: block; width: 40px; height: 35px; background-repeat: no-repeat; background-position: center center; background-size: contain; position: absolute; top: -55px; left: calc(50% - 20px); }
body.top #voice nav.voice .nav.president::before { background-image: url(/media/recruit/icon_president.svg); }
body.top #voice nav.voice .nav.employees::before { background-image: url(/media/recruit/icon_employees.svg); }
body.top #voice nav.voice .nav.faq::before { background-image: url(/media/recruit/icon_faq.svg); }
body.top #voice nav.voice .nav.days::before { background-image: url(/media/recruit/icon_days.svg); }
body.top #voice nav.voice .nav.president { background-image: url(/media/recruit/bg_top_president.jpg); order: 4; }
body.top #voice nav.voice .nav.employees { background-image: url(/media/recruit/bg_top_employees.jpg); order: 2; }
body.top #voice nav.voice .nav.faq { background-image: url(/media/recruit/bg_top_faq.jpg); order: 3; }
body.top #voice nav.voice .nav.days { background-image: url(/media/recruit/bg_top_days.jpg); order: 1; }

body.top #news { border-bottom: 1px solid #ea5504; padding-bottom: 50px; margin-bottom: 40px; }
body.top #news .article-header.sub .bordered { margin-bottom: 40px; }
body.top #news .article-header.sub .bordered h2,
body.top #news .article-header.sub .bordered h3 { text-align: center; }
body.top #news .article-header.sub .bordered h2 { color: #ea5504; font-size: 2.8rem; font-weight: 300; }
body.top #news .article-header.sub .bordered h3 { color: #595757; font-size: 1.7rem; font-weight: 350; margin: 5px 0 25px; }
body.top #news ul li { width: 290px; margin: 20px auto 0; }
body.top #news ul li > a { display: flex; justify-content: center; align-items: center; flex-direction: column; width: 290px; height: 56px; border: 1px solid #007fb7; background: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%); box-sizing: border-box; transition: .25s; }
body.top #news ul li > a:hover { opacity: .8; }
body.top #news ul li > a > span { display: inline-block; color: #fff; }
body.top #news ul li > a > .sub { font-size: 1.3rem; font-weight: 700; margin-bottom: 7px; }
body.top #news ul li > a > .heading { font-size: 1.7rem; font-weight: 500; }

body.top #company .article-body { height: 600px; overflow: hidden; margin: 0 auto;  position: relative; }
body.top #company .block { display: flex; justify-content: center; align-items: center; width: 290px; height: 290px; background-color: #595757; position: absolute; left: calc(50% - 145px); }
body.top #company .text { width: 210px; color: #fff; }
body.top #company .text h3 { font-family: 'Noto Serif CJK JP', serif; font-size: 3.4rem; font-weight: 500; line-height: 1; margin-bottom: 15px; }
body.top #company .text p { font-size: 1.4rem; font-weight: 400; line-height: 1.6; }
body.top #company a.nav { display: flex; justify-content: flex-end; align-items: center; width: 650px; height: 72px; background: url(/media/recruit/arrow_o.svg) no-repeat right center; background-size: contain; position: absolute; top: 254px; right: 0; opacity: 1; transition: .25s; }
body.top #company a.nav span { display: inline-block; color: #fff; font-size: 2.5rem; font-weight: 300; margin-right: 100px; }
body.top #company .article-body img { width: 100%; height: 320px; object-fit: cover; position: absolute; bottom: 0; }



/* new graduate / mid-career page
   ========================================================================== */

body.index .article-header.billboard { height: calc(100vh - 54px); background-position: center center; background-repeat: no-repeat; background-size: cover; margin-bottom: 70px; overflow: hidden; position: relative; }
body.index .article-header.billboard h1 { display: flex; justify-content: center; align-items: center; width: 85px; height: 32px; color: #fff; font-size: 1.8rem; font-weight: 300; position: absolute; right: 20px; transform: rotate(-10deg); opacity: 1; }
body.index .article-header.billboard p.sub { display: flex; justify-content: center; align-items: center; color: #fff; font-size: 3.6rem; font-weight: 300; line-height: 1.25; width: 170px; height: 170px; background-color: #ea5504; margin: auto; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%) scale(.6); z-index: 1; }
body.index .article-header.billboard .heading p { color: #fff; width: 480px; font-size: 2.3rem; font-weight: 300; line-height: .9; position: absolute; left: 20px; top: 60%; opacity: 1; }
body.index .article-header.billboard .heading p b { font-size: 3.3rem; font-weight: 300; }
body.index .article-header.billboard .heading p span { display: inline-block; margin-left: 17px; }
body.index .article-header.billboard .heading p strong { display: inline-block; font-size: 6.6rem; font-weight: 100; margin: 5px 0 10px; }
body.index .article-header.billboard .extra.puzzle { display: block; width: 80px; height: 92px; background: url(/media/recruit/icon_puzzle_o.svg) no-repeat right bottom; background-size: 80px 92px; position: absolute; right: 20px; opacity: 1; }
body.index .article-header.billboard .extra.puzzle img { width: 80px; height: 92px; filter: drop-shadow(3px 3px 6px rgba(0,0,0,.16)); transform: rotate(-10deg); transform-origin: left bottom; }

body.index.newgraduate .article-header.billboard { background-image: url(/media/recruit/mobile/bg_index_header_newgraduate.jpg); }
body.index.newgraduate .article-header.billboard h1 { background-color: #2fc729; top: calc(50% + 60px); }
body.index.newgraduate .article-header.billboard .heading p { top: 59%; }
body.index.newgraduate .article-header.billboard .extra.puzzle { bottom: 20px; }

body.index.midcareer .article-header.billboard { background-image: url(/media/recruit/mobile/bg_index_header_midcareer.jpg); }
body.index.midcareer .article-header.billboard h1 { background-color: #007fb7; top: 5%; }
body.index.midcareer .article-header.billboard .heading p { top: 7.5%; }
body.index.midcareer .article-header.billboard .extra.puzzle { bottom: calc(50% + 20px); }

body.index .article-body .section-voice { background-repeat: no-repeat; background-position: center bottom; background-size: 20px 26px; padding-bottom: 60px; margin-bottom: 60px; }

body.index nav.voice { display: flex; justify-content: center; flex-direction: column; margin: 0 auto; }
body.index nav.voice .nav a { display: block; width: 290px; height: 290px; border: 1px solid #e0dfdf; background: url(/media/recruit/arrow_next.svg) no-repeat calc(100% - 10px) calc(100% - 10px); box-shadow: 2px 2px 4px rgba(0, 0, 0, .1); padding: 10px; margin: 0 auto 40px; box-sizing: border-box; position: relative; transition: .25s; }

body.index nav.voice .nav .heading { display: block; height: 213px; background-repeat: no-repeat; background-position: right center; background-size: contain; margin-bottom: 5px; }
body.index nav.voice .nav .heading .text { display: flex; justify-content: center; align-items: center; width: 100px; height: 213px; color: #fff; font-size: 2rem; font-weight: 300; line-height: 1.2; background-color: #ea5504; }
body.index nav.voice .nav .heading .text span { background-repeat: no-repeat; background-position: center bottom; background-size: auto 33px; padding-bottom: 40px; }
body.index nav.voice .nav.president .heading { height: 130px; background-image: url(/media/recruit/mobile/bg_index_president.jpg); }
body.index nav.voice .nav.president .heading .text { height: 130px; }
body.index nav.voice .nav.president .heading .text span { background-image: url(/media/recruit/icon_president_w.svg); }
body.index nav.voice .nav.employees .heading .text span { background-image: url(/media/recruit/icon_employees_w.svg); }
body.index nav.voice .nav.faq .heading { background-image: url(/media/recruit/mobile/bg_index_faq.jpg); }
body.index nav.voice .nav.faq .heading .text span { background-image: url(/media/recruit/icon_faq_w.svg); }
body.index nav.voice .nav .summary { font-family: 'Noto Serif CJK JP', serif; font-size: 1.7rem; font-weight: 500; line-height: 1.3; }
body.index nav.voice .nav .sub { font-size: 1.4rem; font-weight: 500; line-height: 1.3; }
body.index nav.voice .nav.faq .summary,
body.index nav.voice .nav .sub { position: absolute; left: 10px; bottom: 10px; }
body.index.newgraduate nav.voice .nav.president .summary { font-size: 1.6rem; }
body.index nav.voice .nav.employees .summary { font-size: 1.3rem; }

body.recruit .article-body h2 { display: flex; justify-content: center; align-items: center; flex-direction: column; width: calc(100% - 30px); height: 110px; color: #fff; font-size: 2rem; font-weight: 300; background: #ea5504; padding: 0; margin: 40px auto 5px;  }
body.recruit .article-body h2 span { background-repeat: no-repeat; background-position: center bottom; background-size: auto 33px; padding-bottom: 45px; }

body.index .article-body .section-info h2 span { background-image: url(/media/recruit/icon_info_w.svg); }
body.index .article-body .section-training h2 span { background-image: url(/media/recruit/icon_training_w.svg); }
body.index .article-body .section-work h2 span { background-image: url(/media/recruit/icon_work_w.svg); }

body.index .article-body .section-work { background-repeat: no-repeat; background-position: center calc(100% - 60px); background-size: 20px 26px; padding-bottom: 100px; }
body.index .article-body .section-work .section-header { width: calc(100% - 10px); height: 360px; overflow: hidden; margin: 0 auto 10px; position: relative; }
body.index .article-body .section-work .section-header h2 { margin: 0 auto; }
body.index .article-body .section-work .section-header img { width: 100%; height: 300px; object-fit: cover; position: absolute; bottom: 0; z-index: -1; }
body.index .article-body .section-work .expandable-list h3 { color: #595757; }

body.index .nav-arrow-left a { position: absolute; left: -650px; }
body.index .nav-arrow-left a > span { background: url(/media/recruit/icon_entry_w.svg) no-repeat right center; background-size: auto 30px; padding-right: 40px; }
body.index .nav-arrow-left.advise a > span { background-image: url(/media/recruit/icon_advise_w.svg); }

body.index.newgraduate .article-body .section-voice { background-image: url(/media/recruit/arrow_down_g.svg); }
body.index.newgraduate .expandable-list .block .boxed { border-color: #9ae522; background-color: rgba(154, 229, 34, .3); }
body.index.newgraduate nav.voice .nav.employees .heading { background-image: url(/media/recruit/mobile/bg_index_newgraduate_employees.jpg); }
body.index.newgraduate nav.voice .nav.employees .heading .text,
body.index.newgraduate nav.voice .nav.faq .heading .text,
body.index.newgraduate nav.voice .nav.days .heading .text { background-color: #9ae522; }
body.index.newgraduate nav.voice .nav.days.ishikawa .heading { background-image: url(/media/recruit/mobile/bg_index_days_ishikawa.jpg); }
body.index.newgraduate nav.voice .nav.days .heading .text span { background-image: url(/media/recruit/icon_days_w_g.svg); }

body.index.newgraduate nav.voice .nav.days.kobayashi { order: 1; }
body.index.newgraduate nav.voice .nav.days.shibata { order: 2; }
body.index.newgraduate nav.voice .nav.days.miyazaki { order: 3; }
body.index.newgraduate nav.voice .nav.employees { order: 4; }
body.index.newgraduate nav.voice .nav.faq { order: 5; }
body.index.newgraduate nav.voice .nav.president { order: 6; }

body.index.newgraduate .article-body .section-work { background-image: url(/media/recruit/arrow_down_g.svg); }
body.index.newgraduate .article-body .section-work h2 { background: #9ae522; }
body.index.newgraduate .article-body .section-work .expandable-list h3 { border-bottom-color: #9ae522; }
body.index.newgraduate .article-body .section-work .expandable-list > ul li i::before,
body.index.newgraduate .article-body .section-work .expandable-list > ul li i::after { background-color: #9ae522; }

body.index.midcareer .article-body .section-voice { background-image: url(/media/recruit/arrow_down_b.svg); }
body.index.midcareer .expandable-list .block .boxed { border-color: #32c1e3; background-color: rgba(50, 193, 227, .3); }
body.index.midcareer nav.voice .nav.employees .heading { background-image: url(/media/recruit/mobile/bg_index_midcareer_employees.jpg); }
body.index.midcareer nav.voice .nav.employees .heading .text,
body.index.midcareer nav.voice .nav.faq .heading .text,
body.index.midcareer nav.voice .nav.days .heading .text { background-color: #32c1e3; }
body.index.midcareer nav.voice .nav.days.nagaishi .heading { background-image: url(/media/recruit/mobile/bg_index_days_nagaishi.jpg); }
body.index.midcareer nav.voice .nav.days .heading .text span { background-image: url(/media/recruit/icon_days_w_b.svg); }

body.index.midcareer nav.voice .nav.days.kobayashi { order: 1; }
body.index.midcareer nav.voice .nav.employees { order: 2; }
body.index.midcareer nav.voice .nav.faq { order: 3; }
body.index.midcareer nav.voice .nav.president { order: 4; }

body.index.midcareer .article-body .section-work { background-image: url(/media/recruit/arrow_down_b.svg); }
body.index.midcareer .article-body .section-work h2 { background: #32c1e3; }
body.index.midcareer .article-body .section-work .expandable-list h3 { border-bottom-color: #32c1e3; }
body.index.midcareer .article-body .section-work .expandable-list > ul li i::before,
body.index.midcareer .article-body .section-work .expandable-list > ul li i::after { background-color: #32c1e3; }

body.index .nav-arrow-left.advise { margin: 60px 0; }
body.index .nav-arrow-left.advise a > span { font-size: 1.8rem; line-height: 1.1; }

/* recruit news block */
body.index #news { margin-bottom: 70px; }
body.index #news .section-header.sub .bordered { margin-bottom: 40px; }

body.index #news .section-header.sub h1 { display: flex; width: auto; max-width: none; height: auto; background: none; padding: 0; margin-bottom: 0; position: relative; flex-direction: column; justify-content: center; align-items: center; }
body.index #news .section-header.sub h1 > .text { text-align: center; }
body.index #news .section-header.sub h1 > .text span { display: block; }
body.index #news .section-header.sub h1 > .text > .heading { color: #595757; font-family: 'Noto Sans CJK JP', sans-serif; font-size: 1.8rem; font-weight: 500; line-height: 1.2; margin: -25px 0 0; }
body.index #news .section-header.sub h1 > .text > .sub { color: rgba(89, 87, 87, .3); font-family: 'Noto Sans CJK JP', sans-serif; font-size: 3rem; font-weight: 100; line-height: 1.8; margin-bottom: 3px; }
body.index #news .section-header.sub h1 img { width: auto; height: 33px; margin-top: 15px; }

body.index #news .section-header.sub .bordered h2,
body.index #news .section-header.sub .bordered h3 { text-align: center; }
body.index #news .section-header.sub .bordered h2 { height: auto; color: #ea5504; font-size: 2.8rem; font-weight: 300; background: transparent; }
body.index #news .section-header.sub .bordered h3 { color: #595757; font-size: 1.7rem; font-weight: 350; margin: 5px 0 25px; }
body.index #news ul li { width: 290px; margin: 20px auto 0; }
body.index #news ul li > a { display: flex; justify-content: center; align-items: center; flex-direction: column; width: 290px; height: 56px; border: 1px solid #007fb7; background: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%); box-sizing: border-box; transition: .25s; }
body.index #news ul li > a:hover { opacity: .8; }
body.index #news ul li > a > span { display: inline-block; color: #fff; }
body.index #news ul li > a > .sub { font-size: 1.3rem; font-weight: 700; margin-bottom: 7px; }
body.index #news ul li > a > .heading { font-size: 1.7rem; font-weight: 500; }



/* advantage
   ========================================================================== */

body.advantage .article-header.billboard { display: flex; justify-content: center; align-items: flex-end; height: 320px; overflow: hidden; margin-bottom: 70px; }
body.advantage .article-header.billboard::before { background-image: none; }

body.advantage .article-header.billboard .block { display: flex; justify-content: center; align-items: center; }
body.advantage .article-header.billboard img { width: 100%; height: 320px; object-fit: cover; object-position: center; position: absolute; top: 0; z-index: -1; }

body.advantage .buttons { width: 100%; }



/* welfare
   ========================================================================== */

body.welfare .article-body h2 span { background-image: url(/media/recruit/icon_welfare_w.svg); }

body.welfare .bordered { margin-bottom: 80px; }



/* contact
   ========================================================================== */

body.contact .article-body h2 span { background-image: url(/media/common/icon_contact_w.svg); }

body.contact .article-body .block { margin-top: 30px; }
body.contact .article-body .block p.enlarged { font-size: 2.8rem; }

body.contact .article-body .mw_wp_form form .block.boxed { width: calc(100% - 32px); margin-left: auto; margin-right: auto; }
body.contact .article-body .block h4 { line-height: 1.2; margin-top: 30px; }

body.contact label.file span.file { display: flex; justify-content: space-between; align-items: center; width: 100%; background-color: rgba(0, 0, 0, .05); padding: 15px; box-sizing: border-box; }
body.contact .mw_wp_form_preview label.file span.file { background-color: transparent; }

body.contact label.file input.file { width: 100%; font-size: 1.8rem; padding-left: 10px; }
body.contact label.file input.file::file-selector-button { appearance: none; border: none; display: flex; height: 32px; color: #595757; font-size: 1.8rem; font-weight: 350; line-height: 1; background-color: #fff; border-radius: 4px; padding: 8px 24px; box-sizing: border-box; transition: .25s; box-shadow: 1px 1px 2px rgba(0, 0, 0, .2); margin-left: -10px; }
body.contact label.file input.file::file-selector-button:hover { box-shadow: none; }
body.contact label.file .mwform-file-delete { font-size: 2rem; font-weight: 500; }

body.contact .article-body label.checkbox.privacy .label { margin-bottom: 20px; }
body.contact label.checkbox.privacy .mwform-checkbox-field label { display: flex; align-items: center; }
body.contact label.checkbox.privacy span.label .note { display: block; margin-top: 10px; }
body.contact label.checkbox.privacy span.label .note span { font-size: 1.6rem; font-weight: 500; }
body.contact label.checkbox.privacy .error { left: unset; }



/* news
   ========================================================================== */

body.news .article-header.billboard { height: 400px; margin-bottom: 100px; background: none; }
body.news .article-header.billboard .block { height: 400px; position: relative; }
body.news .article-header.billboard .text { display: flex; justify-content: center; align-items: center; width: 100%; height: 180px; background-color: #595757; position: absolute; bottom: 0; }
body.news .article-header.billboard h1 { font-size: 2.4rem; font-weight: 300; line-height: 1.4; text-align: center; background: url(/media/recruit/icon_info_w.svg) no-repeat center bottom; background-size: auto 33px; padding-bottom: 45px; margin-top: -50px; }
body.news .billboard h1 { display: block; width: auto; max-width: none; position: relative; bottom: auto; }
body.news .article-header.billboard img { width: 100%; height: 220px; object-fit: cover; object-position: 50% 0; }

body.news .index-list { margin-bottom: 80px; }

body.news .article-body h2 span { background-image: url(/media/recruit/icon_info_w.svg); }

body.news article > .article-body > h1 .text { background-repeat: no-repeat; background-position: left center; background-size: 60px 69px; padding: 20px 0 20px 80px; box-sizing: border-box; }
body.news.newgraduate article > .article-body > h1 .text { background-image: url(/media/recruit/icon_news_puzzle_g.svg); }
body.news.midcareer article > .article-body > h1 .text,
body.news.parttime article > .article-body > h1 .text { background-image: url(/media/recruit/icon_news_puzzle_b.svg); }

body.recruit.leaf .article-body h2 { background: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%); margin: 74px auto 0; }



/* voice
   ========================================================================== */

body.voice .article-header.billboard { height: 400px; margin-bottom: 46px; }
body.voice .article-header.billboard .block { height: 400px; position: relative; }
body.voice .article-header.billboard .text { display: flex; justify-content: center; align-items: center; width: 100%; height: 180px; background-color: #595757; position: absolute; bottom: 0; }
body.voice .article-header.billboard h1 { font-size: 2.4rem; font-weight: 300; line-height: 1.4; text-align: center; background-repeat: no-repeat; background-position: center bottom; background-size: auto 33px; padding-bottom: 45px; margin-top: -50px; }
body.voice .article-header.billboard h1 br { display: none; }
body.voice .article-header.billboard img { width: 100%; height: 220px; object-fit: cover; object-position: 50% 0; }

body.voice h2 { color: #595757; background: none; }

body.voice .article-body h2 { display: block; width: auto; height: auto; color: #595757; background: none; padding: 0; margin: 0;  }
body.voice .article-body h2 span { display: block; background: none; padding: 0; }
body.voice .article-body h2 .heading { font-family: 'Noto Serif CJK JP', serif; font-size: 2rem; font-weight: 500; line-height: 1.4; margin-bottom: 15px; }
body.voice .article-body h2 .sub { font-size: 1.5rem; font-weight: 500; line-height: 1.6; margin-bottom: 20px; }

body.voice .section-header { height: 293px; margin: 0 auto 45px; position: relative; }
body.voice .section-header .image { height: 228px; background-repeat: no-repeat; background-position: center top; background-color: #ea5504; background-size: cover; position: relative; }
body.voice .section-header .image span { display: flex; justify-content: center; align-items: center; width: 140px; height: 100px; color: #fff; font-size: 2rem; font-weight: 300; text-align: center; position: absolute; top: 0; }
body.voice .section-header .text { display: flex; justify-content: center; align-items: flex-end; width: 220px; height: 100px; background-repeat: no-repeat; background-position: center top; background-size: 60px 66px; position: absolute; left: calc(50% - 110px); bottom: 0; }
body.voice .section-header .text span { font-size: 1.8rem; font-weight: 500; }

body.voice .section-newgraduate .section-header .image { background-image: url(/media/recruit/mobile/bg_voice_newgraduate.jpg); background-color: #9ae522; }
body.voice .section-newgraduate .section-header .image span { background-color: #9ae522; right: 0; }
body.voice .section-newgraduate .section-header .text { background-image: url(/media/recruit/icon_puzzle_g_s.svg); }
body.voice .section-midcareer .section-header .image { background-image: url(/media/recruit/mobile/bg_voice_midcareer.jpg); background-color: #32c1e3; }
body.voice .section-midcareer .section-header .image span { background-color: #32c1e3; left: 0; }
body.voice .section-midcareer .section-header .text { background-image: url(/media/recruit/icon_puzzle_b_s.svg); }
body.voice.faq .section-newgraduate .section-header .image { background-image: url(/media/recruit/mobile/bg_faq_newgraduate.jpg); }
body.voice.faq .section-midcareer .section-header .image { background-image: url(/media/recruit/mobile/bg_faq_midcareer.jpg); }

body.voice.president .article-header.billboard h1 { background-image: url(/media/recruit/icon_president_w.svg); }
body.voice.employees .article-header.billboard h1 { background-image: url(/media/recruit/icon_employees_w.svg); }
body.voice.faq .article-header.billboard h1 { background-image: url(/media/recruit/icon_faq_w.svg); }
body.voice.days .article-header.billboard h1 { background-image: url(/media/recruit/icon_days_w_c.svg); }

body.voice.employees h2  { border-bottom: 1px solid #ea5504; padding-bottom: 15px; margin-bottom: 10px; }
body.voice.employees h2 .sub { margin-bottom: 0; }
body.voice.employees h2 .heading br { display: none; }
body.voice .section-newgraduate { margin-bottom: 46px; }
body.voice .section-newgraduate h2 { border-color: #9ae522; }
body.voice .section-midcareer h2 { border-color: #32c1e3; }

body.voice .section-newgraduate,
body.voice .section-midcareer { padding-top: 54px; }

/* days */
body.voice.days .section-header { height: auto; margin: 0 auto; }
body.voice.days .section-header h2 .text { display: block; width: 100%; height: auto; background: none; padding: 55px 15px 80px; box-sizing: border-box; position: relative; left: auto; bottom: auto; }

body.voice.days .section-header h2 .heading { font-family: 'Noto Sans CJK JP', sans-serif; font-size: 1.7rem; font-weight: 500; }
body.voice.days .section-header h2 > .heading { padding: 0 15px; }
body.voice.days .section-header h2 > .sub { font-family: 'Noto Serif CJK JP', serif; font-size: 2rem; font-weight: 500; line-height: 1.4; padding: 0 15px; margin-bottom: 30px; }

body.voice.days .section-header h2 .billboard-mini { margin-bottom: 40px; position: relative; }
body.voice.days .section-header h2 .billboard-mini span { color: #fff; }
body.voice.days .section-header h2 .billboard-mini .shoulder { display: flex; justify-content: center; align-items: center; width: 120px; height: 50px; position: absolute; right: 15px; top: 275px; transform: rotate(-10deg); z-index: 1; }
body.voice.days .section-header h2 .billboard-mini .heading { font-size: 1.8rem; }
body.voice.days .section-header h2 .billboard-mini .comment { font-size: 1.8rem; font-weight: 300; line-height: 1.3; }
body.voice.days .section-header h2 .billboard-mini img.puzzle { width: 48px; height: 55px; position: absolute; left: 50%; bottom: -25px; transform: translateX(-50%) rotate(10deg); }

body.voice.days .expandable-list h3 { color: #595757; font-family: 'Noto Serif CJK JP', serif; font-size: 2rem; font-weight: 500; padding-top: 20px; }
body.voice.days .expandable-list .block h4 { font-size: 1.8rem; font-weight: 500; margin-top: 30px; }
body.voice.days .expandable-list .block h4 span { font-family: 'Noto Sans CJK JP', sans-serif; font-size: 1.8rem; font-weight: 500; line-height: 1.4; margin-right: 5px; }
body.voice.days .expandable-list .block p { font-size: 1.7rem; line-height: 1.6; margin-bottom: 0; }
body.voice.days .expandable-list .block .image { text-align: center; }
body.voice.days .expandable-list .block img { width: auto; height: 160px; }
body.voice.days .section-everyday .expandable-list .block h4 { border-bottom: 1px dashed #595757; padding-bottom: 20px; margin-bottom: 20px; }

body.voice.days #ishikawa .expandable-list .block { position: relative; }
body.voice.days #ishikawa .expandable-list .block::after { content: ''; display: block; width: 100%; height: 1px; border-bottom: 1px dashed #595757; position: absolute; bottom: 0; }
body.voice.days #ishikawa .expandable-list .image { margin-bottom: 20px; }
body.voice.days #ishikawa .expandable-list .block img { width: auto; height: 200px; }

body.voice.days img { width: 100%; height: autp; }
body.voice.days .bordered { margin-bottom: 100px; }

body.voice.days .section-header h2 .text { background: linear-gradient(to bottom, #9ae522 0%, #0eb700 100%); }
body.voice.days .section-header h2 .billboard-mini .shoulder { background-color: #0eb700; }
body.voice.days .expandable-list h3 { border-bottom-color: #9ae522; }
body.voice.days .expandable-list .block h4 span { color: #9ae522; }
body.voice.days .expandable-list > ul li i::before,
body.voice.days .expandable-list > ul li i::after { background-color: #9ae522; }

body.voice.days .section-midcareer .section-header h2 .text { background: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%); }
body.voice.days .section-midcareer .section-header h2 .billboard-mini .shoulder { background-color: #007fb7; }
body.voice.days .section-midcareer  .expandable-list h3 { border-bottom-color: #32c1e3; }
body.voice.days .section-midcareer .expandable-list .block h4 span { color: #32c1e3; }
body.voice.days .section-midcareer  .expandable-list > ul li i::before,
body.voice.days .section-midcareer  .expandable-list > ul li i::after { background-color: #32c1e3; }

body.voice.days .article-header.billboard { margin-bottom: 0; }
body.voice.days .article-header.billboard .extra.scroll,
body.voice.days .section-oneday { background-color: #efffd6; }

body.voice.days .section-sub-header { display: flex; justify-content: center; align-items: center; flex-direction: column; margin-bottom: 35px; }
body.voice.days .section-sub-header .text { font-size: 2.4rem; font-weight: 300; margin-top: 10px; }
body.voice.days .section-oneday .section-sub-header > img { width: 20px; height: auto; }
body.voice.days .section-everyday .section-sub-header > img { width: 28px; height: auto; }

body.voice.days .section-oneday { padding: 90px 0 0; }

/* faq */
body.faq .section-header { height: 238px; margin: 0; position: relative; }
body.faq .section-header .image { height: 238px; }
body.faq .section-newgraduate .section-header .image span { left: 0; right: auto; }

body.faq .expandable-list h2 { display: flex; justify-content: center; align-items: center; height: 60px; font-size: 2.1rem; font-weight: 500; margin: 60px auto 0; }
body.faq .expandable-list h2:first-child { margin-top: 0; }
body.faq .expandable-list h3 span { display: block; color: #595757; font-size: 1.7rem; font-weight: 350; padding-left: 24px; position: relative; }
body.faq .expandable-list h3 span::before { content: 'Q.'; display: inline-block; width: 24px; font-size: 1.7rem; font-weight: 500; line-height: 1.3; position: absolute; left: 0; top: 0; }
body.faq .expandable-list .block p { padding-left: 24px; position: relative; }
body.faq .expandable-list .block p::before { content: 'A.'; display: inline-block; width: 24px; color: #ea5504; font-size: 1.5rem; font-weight: 500; line-height: 1.8; position: absolute; left: 0; top: 0; }

body.faq .section-newgraduate .expandable-list h2 { background-color: #9ae522; }
body.faq .section-newgraduate .expandable-list h3 { border-bottom-color: #9ae522; }
body.faq .section-newgraduate .expandable-list h3 span::before { color: #9ae522; }
body.faq .section-newgraduate .expandable-list > ul li i::before,
body.faq .section-newgraduate .expandable-list > ul li i::after { background-color: #9ae522; }

body.faq .section-midcareer .expandable-list h3 { border-bottom-color: #32c1e3; }
body.faq .section-midcareer .expandable-list h3 span::before { color: #32c1e3; }
body.faq .section-midcareer .expandable-list > ul li i::before,
body.faq .section-midcareer .expandable-list > ul li i::after { background-color: #32c1e3; }



/* advise
   ========================================================================== */

body.advise .article-header.billboard { height: 400px; margin-bottom: 100px; background: none; }
body.advise .article-header.billboard .block { height: 400px; position: relative; }
body.advise .article-header.billboard .text { display: flex; justify-content: center; align-items: center; width: 100%; height: 180px; background-color: #595757; position: absolute; bottom: 0; }
body.advise .article-header.billboard h1 { font-size: 2.4rem; font-weight: 300; line-height: 1.4; text-align: center; background: url(/media/recruit/icon_advise_w.svg) no-repeat center bottom; background-size: auto 33px; padding-bottom: 45px; margin-top: -50px; }
body.advise .article-header.billboard h1 br { display: none; }
body.advise .billboard h1 .sub { display: block; font-size: 1.6rem; margin-bottom: 5px; }
body.advise .article-header.billboard img { width: 100%; height: 220px; object-fit: cover; object-position: 50% 0; }

body.advise section { margin-bottom: 60px; }

body.advise h3 { font-family: 'Noto Serif CJK JP', serif; font-size: 2rem; font-weight: 500; line-height: 1.4; margin-bottom: 15px; }
body.advise p { font-size: 1.3rem; font-weight: 350; line-height: 1.8; padding-left: 90px; }
body.advise p.signature { font-weight: 500; margin-top: 15px; }
body.advise p:not([class]) { background-repeat: no-repeat; background-position: left 3px; background-size: 80px; }
body.advise section:first-of-type .bordered:nth-of-type(1) p:not([class]) { background-image: url(/media/recruit/icon_advise_01.png); }
body.advise section:first-of-type .bordered:nth-of-type(2) p:not([class]) { background-image: url(/media/recruit/icon_advise_02.png); }
body.advise section:last-of-type .bordered:nth-of-type(1) p:not([class]) { background-image: url(/media/recruit/icon_advise_03.png); }
body.advise section:last-of-type .bordered:nth-of-type(2) p:not([class]) { background-image: url(/media/recruit/icon_advise_04.png); }

body.advise .bordered { margin-bottom: 0; }
body.advise .bordered:nth-of-type(odd) { margin-bottom: 30px; }



/* employee v2022
   ========================================================================== */

body.employee .article-header.billboard { height: 400px; margin-bottom: 100px; background: none; }
body.employee .article-header.billboard .block { height: 400px; position: relative; }
body.employee .article-header.billboard .text { display: flex; justify-content: center; align-items: center; width: 100%; height: 180px; background-color: #595757; position: absolute; bottom: 0; }
body.employee .article-header.billboard h1 { font-size: 2.4rem; font-weight: 300; line-height: 1.4; text-align: center; background: url(/media/recruit/icon_advise_w.svg) no-repeat center bottom; background-size: auto 33px; padding-bottom: 45px; margin-top: -50px; }
body.employee .article-header.billboard h1 br { display: none; }
body.employee .billboard h1 .sub { display: block; font-size: 1.6rem; margin-bottom: 5px; }
body.employee .article-header.billboard img { width: 100%; height: 220px; object-fit: cover; object-position: 50% 0; }

body.employee section.employee { margin: 50px auto 60px; }

body.employee section.employee h2 { display: block; width: auto; height: auto; font-family: 'Noto Serif CJK JP', serif; color: #595757; font-size: 2rem; font-weight: 500; line-height: 1.4; text-align: center; background: transparent; margin: 80px auto 25px; }
body.employee.index section.employee h2 { margin-bottom: 50px; }
body.employee section.employee .boxed { width: calc(100% - 30px); border: 1px solid #707070; border-radius: 20px; padding: 50px 15px 10px; margin: 50px auto 30px; box-sizing: border-box; position: relative; }

body.employee-01 section.employee .boxed.employee-01,
body.employee-02 section.employee .boxed.employee-02 { border: none; padding: 0; margin-bottom: 30px; }
body.employee.index section.employee .boxed,
body.employee-01 section.employee .boxed.employee-02,
body.employee-02 section.employee .boxed.employee-01 { margin-top: 80px; }

body.employee section.employee .buttons { width: 100%; }
body.employee section.employee > .buttons { padding: 10px 15px; }
body.employee section.employee .boxed .buttons { text-align: center; }
body.employee section.employee .boxed h3 { width: 250px; font-family: 'Noto Serif CJK JP', serif; font-size: 1.5rem; font-weight: 500; line-height: 1.5; border: 1px solid #707070; border-radius: 20px; background-color: #fff; padding: 10px 15px; box-sizing: border-box; }
body.employee.index section.employee .boxed h3,
body.employee-02 section.employee .boxed.employee-01 h3,
body.employee-01 section.employee .boxed.employee-02 h3 { position: absolute; left: -1px; top: -40px; }

body.employee section.employee .boxed .columned { width: 100%; display: flex; justify-content: space-between; background-repeat: no-repeat; background-position: center calc(100% - 40px); background-size: 50px; padding: 0 15px; margin: 10px auto; box-sizing: border-box; }
body.employee.index section.employee .boxed .columned,
body.employee-01 section.employee .boxed.employee-02 .columned,
body.employee-02 section.employee .boxed.employee-01 .columned { padding: 0; }
body.employee section.employee .boxed .block { width: 130px; height: 220px; background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
body.employee section.employee .boxed .block > span { font-size: 1.3rem; font-weight: 700; line-height: 1.8; }
body.employee section.employee .boxed .block > span span { display: inline-block; }
body.employee section.employee .boxed .block > span span:first-child { margin-right: 20px; }

body.employee section.employee .boxed.employee-01 .block:first-of-type { background-image: url(/media/employee/employee_202208_fig_01.png); }
body.employee section.employee .boxed.employee-01 .block:last-of-type { background-image: url(/media/employee/employee_202208_fig_02.png); }
body.employee section.employee .boxed.employee-02 .block:first-of-type { background-image: url(/media/employee/employee_202208_fig_03.png); }
body.employee section.employee .boxed.employee-02 .block:last-of-type { background-image: url(/media/employee/employee_202208_fig_04.png); }

body.employee section.employee .boxed.employee-01 .columned { background-image: url(/media/employee/mobile/employee_202208_fig_05.svg);  }
body.employee section.employee .boxed.employee-02 .columned { background-image: url(/media/employee/mobile/employee_202208_fig_06.svg);  }

body.employee-03 .section-header .extras { display: none; }

body.employee section.employee > h3 { display: flex; justify-content: flex-start; align-items: center; height: 70px; font-size: 1.4rem; font-weight: 500; line-height: 1.4; padding: 0 30px; margin: 0 auto; }

body.employee section.employee .block.bordered { padding: 0 40px 0; }

body.employee section.employee .expandable-list > ul li .block { max-height: 2500px; margin: 0 auto; position: relative; overflow: hidden; opacity: 1; z-index: 2; }
body.employee section.employee .expandable-list > ul { perspective: 1000px; }
body.employee section.employee .expandable-list > ul li { position: relative; }
body.employee section.employee .expandable-list > ul li i { position: absolute; right: 15px; top: 100px; }
body.employee section.employee .expandable-list > ul li i::before,
body.employee section.employee .expandable-list > ul li i::after { content: ''; position: absolute; width: 2px; height: 12px; }
body.employee section.employee .expandable-list > ul li i::before { transform: translate(-4px, 0) rotate(45deg); }
body.employee section.employee .expandable-list > ul li i::after { transform: translate(4px, 0) rotate(-45deg); }
body.employee section.employee .expandable-list > ul li input[type=checkbox]:checked ~ i::before { transform: translate(4px, 0) rotate(45deg); }
body.employee section.employee .expandable-list > ul li input[type=checkbox]:checked ~ i::after { transform: translate(-4px, 0) rotate(-45deg); }
body.employee section.employee .expandable-list > ul li input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; }
body.employee section.employee .expandable-list > ul li input[type=checkbox]:checked ~ div { margin-top: 0; max-height: 0; opacity: 0; transform: translate(0, 50%); }
body.employee section.employee .expandable-list > ul li .block,
body.employee section.employee .expandable-list > ul li i::before,
body.employee section.employee .expandable-list > ul li i::after { transition: all .25s ease-in-out; }

body.employee section.employee .expandable-list .block { padding: 0 15px; }
body.employee section.employee .expandable-list h4 { display: flex; justify-content: flex-start; align-items: center; height: 120px; font-size: 1.4rem; font-weight: 500; line-height: 1.4; cursor: pointer; border-bottom: 1px solid; padding: 0 30px; }
body.employee section.employee .expandable-list .block p { font-feature-settings: 'palt'; font-size: 1.3rem; font-weight: 350; line-height: 1.8; background-repeat: no-repeat; background-position: left 3px; background-size: 80px; padding-left: 90px; margin: 25px 0; }
body.employee section.employee .expandable-list .block p b { font-weight: 500; }

body.employee-01 section.employee > h3 { background-color: #9ae522; }
body.employee-02 section.employee > h3 { background-color: #32c1e3; }
body.employee-01 section.employee .expandable-list h4 { border-bottom-color: #9cd54f; }
body.employee-02 section.employee .expandable-list h4 { border-bottom-color: #32c1e3; }
body.employee-01 section.employee .bordered { border-image: linear-gradient(to bottom, #9ae522 0%, #0eb700 100%) 1; }
body.employee-02 section.employee .bordered { border-image: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%) 1; }
body.employee-01 section.employee .expandable-list > ul li i::before,
body.employee-01 section.employee .expandable-list > ul li i::after { background-color: #9cd54f; }
body.employee-02 section.employee .expandable-list > ul li i::before,
body.employee-02 section.employee .expandable-list > ul li i::after { background-color: #32c1e3; }
body.employee-01 section.employee p.interviewee-01 { background-image: url(/media/employee/employee_202208_fig_07.png); }
body.employee-01 section.employee p.interviewee-02 { background-image: url(/media/employee/employee_202208_fig_08.png); }
body.employee-02 section.employee p.interviewee-01 { background-image: url(/media/employee/employee_202208_fig_09.png); }
body.employee-02 section.employee p.interviewee-02 { background-image: url(/media/employee/employee_202208_fig_10.png); }



/* training
   ========================================================================== */

body.training .pc { display: none; }

body.training .article-header.billboard { height: auto; margin-bottom: 0; }
body.training .article-header.billboard::before { content: none; }
body.training .article-header.billboard .inner { position: relative; }
body.training .article-header.billboard .inner > img { width: 100%; height: auto; }
body.training .article-header.billboard .inner > .block { width: 290px; height: 368px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
body.training .article-header.billboard .inner > .block > .text { width: 170px; height: 43px; display: flex; justify-content: center; align-items: center; background-color: #595757; border-radius: 4px; margin: 0 auto 30px; }
body.training .article-header.billboard h1 { font-size: 2.4rem; font-weight: 300; background: url(/media/recruit/training/icon_training_w.svg) no-repeat 0 0; background-size: 40px 30px; padding-left: 45px; }

body.training .article-header.billboard .extras { width: 290px; }
body.training .article-header.billboard .extras > .nav { display: flex; justify-content: center; align-items: center; width: 290px; height: 85px; position: relative; }
body.training .article-header.billboard .extras > .nav:not(:last-child) { margin-bottom: 20px; }
body.training .article-header.billboard .extras > .nav br,
body.training .article-header.billboard .extras > .nav .hr { display: none; }
body.training .article-header.billboard .extras > .nav.newgraduate { background-color: #9ae522; }
body.training .article-header.billboard .extras > .nav.midcareer-basic { background-color: #32c1e3; }
body.training .article-header.billboard .extras > .nav.midcareer-advanced { background-color: #007fb7; }
body.training .article-header.billboard .extras > .nav > .block { height: 85px; display: flex; justify-content: center; margin-top: 20px; }
body.training .article-header.billboard .extras > .nav > .block > .text { display: inline-flex; flex-direction: column; align-items: center; }
body.training .article-header.billboard .extras > .nav .heading { color: #fff; font-size: 2.4rem; font-weight: 300; margin-top: 7px; }
body.training .article-header.billboard .extras > .nav img { width: 60px; height: 55px; margin-left: 5px; }
body.training .article-header.billboard .extras > .nav a { display: flex; justify-content: center; align-items: center; width: 100%; height: 26px; min-height: auto; text-align: center; padding: 0; position: absolute; bottom: 0; }
body.training .article-header.billboard .extras > .nav a.button.more span { display: inline-block; font-size: 1.6rem; background-image: url(/media/recruit/training/arrow_down.svg); background-size: 16px; padding-right: 28px; }

body.training .article-header.billboard .extras > .nav .decorated { display: inline-block; font-size: 1.3rem; font-weight: 500; position: relative; }
body.training .article-header.billboard .extras > .nav.newgraduate .decorated { color: #2fc729; }
body.training .article-header.billboard .extras > .nav.midcareer-basic .decorated { color: #007fb7; }
body.training .article-header.billboard .extras > .nav.midcareer-advanced { color: #32c1e3; }
body.training .article-header.billboard .extras > .nav .decorated::before,
body.training .article-header.billboard .extras > .nav .decorated::after { content: ''; width: 1px; height: 20px; position: absolute; top: -3px; }
body.training .article-header.billboard .extras > .nav .decorated::before { left: 0; transform: translate(-10px, 0) rotate(-30deg); }
body.training .article-header.billboard .extras > .nav .decorated::after { right: 0; transform: translate(10px, 0) rotate(30deg); }
body.training .article-header.billboard .extras > .nav.newgraduate .decorated::before,
body.training .article-header.billboard .extras > .nav.newgraduate .decorated::after { background-color: #2fc729; }
body.training .article-header.billboard .extras > .nav.midcareer-basic .decorated::before,
body.training .article-header.billboard .extras > .nav.midcareer-basic .decorated::after { background-color: #007fb7; }
body.training .article-header.billboard .extras > .nav.midcareer-advanced .decorated::before,
body.training .article-header.billboard .extras > .nav.midcareer-advanced .decorated::after { background-color: #32c1e3; }

body.training .article-body h2 { display: block; width: auto; height: auto; text-align: center; background: none; padding: 0; margin: 0;  }
body.training .article-body h2 span { display: inline-block; font-size: 1.8rem; font-weight: 500; padding-bottom: 25px; position: relative; }
body.training #newgraduate h2 span { color: #0eb700; }
body.training #midcareer-basic h2 span { color: #32c1e3; }
body.training #midcareer-advanced h2 span { color: #007fb7; }

body.training .section-header .decorated { position: relative; }
body.training .section-header .decorated::before,
body.training .section-header .decorated::after { content: ''; width: 2px; height: 40px; position: absolute; top: -10px; }
body.training .section-header .decorated::before { transform: translate(-20px, 0) rotate(-30deg); }
body.training .section-header .decorated::after { transform: translate(20px, 0) rotate(30deg); }
body.training #newgraduate .decorated::before,
body.training #newgraduate .decorated::after { background-color: #9ae522; }
body.training #midcareer-basic .decorated::before,
body.training #midcareer-basic .decorated::after { background-color: #32c1e3; }
body.training #midcareer-advanced .decorated::before,
body.training #midcareer-advanced .decorated::after { background-color: #007fb7; }

body.training .navs { display: flex; justify-content: center; width: 100%; height: 54px; position: sticky; top: 54px; z-index: 1; }
body.training .navs a.nav { display: flex; justify-content: center; align-items: center; width: calc(100% / 3); height: 54px; transition: .25s; }
body.training .navs a.nav:hover { opacity: .8; }
body.training .navs a.nav:not(:last-child) { margin-bottom: 5px; }
body.training .navs a.nav.newgraduate { background-color: #9ae522; }
body.training .navs a.nav.midcareer-basic { background-color: #32c1e3; }
body.training .navs a.nav.midcareer-advanced { background-color: #007fb7; }
body.training .navs a.nav span { display: inline-block; width: 68px; color: #fff; font-size: 1.4rem; font-weight: 500; line-height: 1.7; text-align: center; }
body.training .navs a.nav span .hr { display: block; height: 1px; font-size: 0; background-color: #fff; }

body.training .article-body .lead { padding: 30px 15px 0; }
body.training .article-body .lead p { font-size: 1.3rem; font-weight: 500; line-height: 1.8; }

body.training .section-header { padding-top: 60px; }
body.training .section-header img { display: block; width: auto; height: 125px; margin: 0 auto 10px; }

body.training .bordered { margin: 0; }
body.training #newgraduate .bordered { border-image: linear-gradient(to bottom, #9ae522 0%, #0eb700 100%) 1; }
body.training #midcareer-basic .bordered { border-image: linear-gradient(to bottom, #32c1e3 0%, #007fb7 100%) 1; }
body.training #midcareer-advanced .bordered { border-image: linear-gradient(to bottom, #007fb7 0%, #32c1e3 100%) 1; }
body.training .bordered h3 { display: flex; justify-content: center; align-items: center; height: 50px; color: #fff; font-size: 2.4rem; font-weight: 300; margin-bottom: 25px; }
body.training #newgraduate .bordered h3 { background-color: #9ae522; }
body.training #midcareer-basic .bordered h3 { background-color: #32c1e3; }
body.training #midcareer-advanced .bordered h3 { background-color: #007fb7; }

body.training dl { padding: 0 15px; }
body.training dt .heading { display: flex; font-size: 1.6rem; font-weight: 500; line-height: 1.5; }
body.training dt .heading::before { content: '▶︎'; display: inline-block; margin-right: 5px; }
body.training #newgraduate dt .heading::before { color: #9ae522; }
body.training #midcareer-basic dt .heading::before { color: #32c1e3; }
body.training #midcareer-advanced dt .heading::before { color: #007fb7; }
body.training dt .sub { margin-top: 10px; }
body.training dd { padding: 10px 0 45px; }
body.training dl dd:last-child { padding-bottom: 0; }
body.training dd span { display: block; }
body.training dd .sub { width: 120px; margin: 0 auto -5px; }
body.training dd .boxed { border: 2px dashed; border-radius: 5px; padding: 10px 15px; box-sizing: border-box; }
body.training #newgraduate dd .boxed { border-color: #9ae522; }
body.training #midcareer-basic dd .boxed,
body.training #midcareer-advanced dd .boxed { border-color: #32c1e3; }
body.training dd img { width: 120px; height: auto; }
body.training dt .sub,
body.training dd > span { font-size: 1.3rem; font-weight: 350; line-height: 1.8; }
body.training dd .text { display: flex; justify-content: center; align-items: center; height: 50px; border: 1px solid #ddd; border-radius: 4px; background-color: #fff; position: relative; top: -15px; }
body.training dd .text span { font-size: 1.6rem; font-weight: 350; line-height: 1.3; text-align: center; background-repeat: no-repeat; background-position: right center; padding-right: 24px; }
body.training #newgraduate dd .text span { background-image: url(/media/recruit/training/mobile/arrow_down_g.svg); }
body.training #midcareer-basic dd .text span,
body.training #midcareer-advanced dd .text span { background-image: url(/media/recruit/training/mobile/arrow_down_b.svg); }

body.training .nav-arrow-right { margin-top: 100px; }