@charset "UTF-8";
/*-------------------------------------------------------*/
/*用語集*/
/*-------------------------------------------------------*/

/*
p- : page（ページ固有）
c- : component（再利用）
l- : layout（レイアウト）
u- : utility（単発調整）
js- : JS用（見た目に使わない）
*/

/*-------------------------------------------------------*/
/*変数*/
/*-------------------------------------------------------*/

:root{
  --color-bg:#f4f2ee;
  --color-text:#666666;
  --color-main:#4aa640;
  --color-sub:#4b85d1;
  --color-white:#fff;
  --color-border:#ccc;

  --font-base:"Noto Sans JP",sans-serif;
  --font-en:"Inter",sans-serif;

  --content-width:min(100% - 32px,1120px);
  --content-narrow:min(100% - 32px,960px);

  --space:clamp(1rem,1vw + 0.5rem,1.5rem);
  --space-lg:clamp(1.5rem,1.4vw + 0.8rem,2.5rem);

  --fz-base:clamp(15px, 1vw, 18px);
  --fz-title:clamp(24px,2vw,40px);
  --fz-lead:clamp(36px,3vw,72px);
}

/*-------------------------------------------------------*/
/*ベース*/
/*-------------------------------------------------------*/

html{
  scroll-behavior:smooth;
}

body{
  min-width:320px;
  background:var(--color-bg);
  font-family:var(--font-base);
  font-size:var(--fz-base);
  line-height:1.8;
  color:var(--color-text);
}

html.is-splash-active,
html.is-splash-active body{
  overflow:hidden;
}

small{
  font-size:.875em;
}

/*-------------------------------------------------------*/
/*レイアウト*/
/*-------------------------------------------------------*/

.l-container{
  width:var(--content-width);
  margin:0 auto;
}

.l-container--narrow{
  width:var(--content-narrow);
  margin:0 auto;
}

section{
  padding:var(--space-lg) 0;
}

/*-------------------------------------------------------*/
/*共通見出し*/
/*-------------------------------------------------------*/

.c-section-heading{
  margin:0 0 var(--space);
  text-align:center;
}
.p-schedule .c-section-heading:nth-of-type(2){
   margin:0 0 0;
}

.p-faq .c-section-heading,
.p-entry .c-section-heading{
  margin:0;
}

.c-section-heading__title img{
  display:block;
  max-width:84%;
  height:auto;
  margin:0 auto;
}

/*-------------------------------------------------------*/
/*ボタン*/
/*-------------------------------------------------------*/

.c-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  margin:0;
  padding:12px 32px;

  font-size:1rem;
  font-weight:500;
  line-height:1.4;
  color:inherit;

  border:none;
  border-radius:4px;

  text-align:center;
  text-decoration:none;

  transition:
    opacity .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.c-button:hover{
  opacity:.6;
}

.c-button--primary{
  background:var(--color-sub);
  color:#fff;
}

.c-button--has-icon{
  gap:10px;
}

.c-button__label{
  display:block;
}

.c-button__icon{
  display:block;
  width:12px;
  height:auto;
  flex-shrink:0;
}

.c-button--compact{
  padding:6px 12px;
  margin:0;
  font-size:.9rem;
  gap:6px;
}

.c-button--compact .c-button__icon{
  width:15px;
  transform:translateY(3px);
}

/*-------------------------------*/
/*リンクボタン（枠アイコン）*/
/*-------------------------------*/

.c-button--link{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:0;

  font-size:1.2rem;
  font-weight:500;
  color:var(--color-main);

  background:none;
  border:none;
}

.c-button--link:hover{
  opacity:.7;
}

.c-button--link .c-button__icon{
  width:28px;
  height:28px;
  flex-shrink:0;
}

/*-------------------------------------------------------*/
/*テキストリンク装飾*/
/*-------------------------------------------------------*/

.c-button-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.c-button-link--has-icon{
  gap:6px;
}

.c-button-link__label{
  display:block;
}

.c-button-link__icon{
  display:block;
  flex-shrink:0;
}

/*-------------------------------------------------------*/
/*テキスト装飾*/
/*-------------------------------------------------------*/

.u-text-accent{
  color:var(--color-sub);
}

.p-steps__item .u-text-accent{

  color:var(--color-main);
}

.u-badge{
  display:inline-block;

  padding:2px 6px;

  font-size:0.85em;
  line-height:1;

  color:#E60012;
  border:1px solid #E60012;

  border-radius:2px;
  
}

.p-paycards__note{
  flex-basis: 100%;
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.p-paycards__note img{
  height: 1.4em;
  width: auto;
  margin: 0 .2em 0 .1em;
  flex: none;
}

.u-indent{
    font-size:1.2em;
 padding: .5em .5em .8em;
}
.u-label{
  display:block;
  width:3.5em;

  margin:0 0 -.25rem;

  font-size:1rem;
  color:var(--color-text);

  text-align:left;
}

/*-------------------------------------------------------*/
/*リスト（ドット＋区切り線）*/
/*-------------------------------------------------------*/

.c-list-dot{
  list-style:none;
  margin:0;
  padding:0;
}

.c-list-dot li{
  display:flex;
  align-items:flex-start;

  margin:0;
  padding:1em 0;

  line-height:1.8;
  color:var(--color-text);

  border-top:1px dashed rgba(0,0,0,.2);
}

.c-list-dot li:first-child{
  padding-top:0;
  border-top:none;
}

.c-list-dot li:last-child{
  padding-bottom:0;
}

.c-list-dot li::before{
  content:"・";
  display:block;

  margin-right:.5em;

  line-height:1.8;
  color:var(--color-text);

  flex-shrink:0;
}

.c-list-dot__body{
  display:block;
  min-width:0;
}

a {
  color: var(--color-main);
  text-decoration: underline;
}

/*-------------------------------------------------------*/
/*時間リスト*/
/*-------------------------------------------------------*/

.c-time-list{
  list-style:none;
}

.c-time-list__item{
  display:flex;
  align-items:baseline;
  font-variant-numeric:tabular-nums;
}

.c-time-list__item::before{
  content:"・";
}

.c-time-list__start{
  width:3.5em;
  text-align:right;
}

.c-time-list__sep{
  width:2em;
  text-align:center;
}

.c-time-list__end{
  width:5.5em;
  text-align:left;
}

/*-------------------------------------------------------*/
/*スプラッシュ*/
/*-------------------------------------------------------*/

.c-splash{
  position:fixed;
  display:block;
  width:100%;
  height:100%;

  background:var(--color-bg);

  margin:0;
  padding:var(--space);

  color:var(--color-text);

  text-align:center;

  left:0;
  top:0;
  z-index:100;
}

.c-splash__inner{
  position:absolute;
  display:block;
  width:100%;

  margin:0;
  padding:0 var(--space);

  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.c-splash__lead{
  margin:0 0 .5rem;
  padding:0;

  font-family:var(--font-en);
  font-size:.875rem;
  line-height:1.4;
  color:var(--color-text);
  letter-spacing:.14em;

  text-align:center;
}

.c-splash__title{
  margin:0;
  padding:0;

  font-size:var(--fz-title);
  line-height:1.3;
  color:var(--color-text);

  text-align:center;
}
/*-------------------------------------------------------*/
/*固定ボタン（PC/SP共通：右中央固定）*/
/*-------------------------------------------------------*/

.c-fixed-entry{
  position:fixed;
  z-index:40;
  width: 60px;
  top:80%;
  right:1px;
  left:auto;
  bottom:auto;
  transform:translateY(-50%);

  display:block;
  padding:12px;
  box-sizing:border-box;

  background:#fff;
  border:3px solid var(--color-sub);
  border-radius:10px;

  text-decoration:none;
  overflow:hidden;
}

.c-fixed-entry__image{
  display:block;
  max-width:100%;
  height:auto;
  margin:0 auto; /* 中央寄せ */
}
/*-------------------------------------------------------*/
/*ファーストビュー*/
/*-------------------------------------------------------*/

.p-fv{
  display:block;
  background:none;
  margin:0 0 var(--space-lg);
  padding: 0;
  border-bottom:1px solid #000;
}

.p-fv__layout{
  margin:0;
  padding:0;
  text-align: center;
  
}

.p-fv__layout img{
margin: 0 auto 0; 

}

.cmn_logo{
  display: block;
width: 36%;
margin: 4px;
}






/*-------------------------------------------------------*/
/*募集要項*/
/*-------------------------------------------------------*/

.p-outline__rows{
  border-top:1px solid var(--color-border);
}

/*-------------------------------*/
/*情報行*/
/*-------------------------------*/

.c-info-row{
  display:grid;

  margin:0;
  padding:var(--space) 0;
  gap:var(--space);

  border-bottom:1px solid var(--color-border);
}

.c-info-row__label{
  display:inline-flex;
  max-width:fit-content;

  margin:0;
  padding:0 .5rem;

  font-size:clamp(15px, 1vw + 12px, 16px);
  line-height:2rem;
  color:var(--color-text);

  border:1px solid #999;

  text-align:center;
}

.c-info-row__body{
  display:block;
}

/*-------------------------------*/
/*給与カード*/
/*-------------------------------*/

.p-paycards{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space);
}

@media(max-width:767px){
  .p-paycards{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:8px;
  }
}

.p-paycards__item{
  display:block;
  margin:0;
}

.p-paycards__note{
  width:100%;

  margin:0;
  padding:0;

  line-height:1.6;
}

.p-paycards__title{
  margin:0 0 .25rem;
  padding:0;

  font-size:.875rem;
  line-height:1.4;
  color:var(--color-sub);
}

.p-paycards__value{
  margin:0;
  padding:0;

  font-size:clamp(20px,1.5vw,28px);
  line-height:1.3;
  color:var(--color-sub);
}

/*-------------------------------*/
/*地図*/
/*-------------------------------*/

.p-access__map{
  display:inline-block;

  margin:var(--space) 0 0;
  padding:0;
}

.p-access__map picture{
  border:1px solid var(--color-border);
}

.p-access-info + .p-access-info{
  margin-top:1.25rem;
}

.p-access-info__name{
  font-weight:700;
}

.p-access-info__address{
  margin-left:8px;

  font-size:0.9em;
  color:#666;
}

.p-access-info__sub{
  margin-top:4px;

  font-size:0.9em;
  color:#777;
}

.p-access-info{
  margin:1.5em 0 0;
  padding:1.5em 0 0;

  border-top:1px dashed rgba(0,0,0,.2);
}

.p-access-info--first{
  margin-top:0;
  padding-top:0;
  border-top:none;
}

/*-------------------------------------------------------*/
/*アコーディオン*/
/*-------------------------------------------------------*/

.c-accordion{
  display:block;

  background:rgba(255,255,255,.4);

  margin:0;
  padding:0;

  border:1px solid var(--color-border);
  border-radius:8px;
}

.c-accordion + .c-accordion{
  margin-top:10px;
}

.c-accordion__trigger{
  display:flex;
  width:100%;

  background:none;

  margin:0;
  padding:var(--space);

  line-height:1.6;
  color:var(--color-text);

  border:none;

  text-align:left;
  cursor:pointer;
  justify-content:space-between;
  align-items:center;
}

.c-accordion__title{
  display:block;
  min-width:0;
  font-weight:500;
}

.c-accordion__icon{
  display:inline-flex;
  width:1.5em;
  min-width:1.5em;
  justify-content:center;
  align-items:center;

  margin-left:1rem;
  flex-shrink:0;
}

.c-accordion__icon-image{
  display:block;
  width:.65em;
  height:auto;
}

.c-accordion__icon-image--close{
  display:none;
}

.c-accordion__trigger[aria-expanded="true"] .c-accordion__icon-image--open{
  display:none;
}

.c-accordion__trigger[aria-expanded="true"] .c-accordion__icon-image--close{
  display:block;
}

.c-accordion__content{
  display:grid;
  grid-template-rows:0fr;

  padding:0 var(--space);

  opacity:0;
  transition:
    grid-template-rows .38s ease,
    opacity .22s ease;
}

.c-accordion.is-open .c-accordion__content{
  grid-template-rows:1fr;
  opacity:1;
}

.c-accordion__inner{
  overflow:hidden;
  min-height:0;

  padding:0;
}

.c-accordion.is-open .c-accordion__inner{
  padding:0 0 16px;
}

/*-------------------------------------------------------*/
/*FAQ*/
/*-------------------------------------------------------*/

.p-faq__question{
  display:flex;
  align-items:flex-start;
  gap:.5rem;

  color:var(--color-text);
  transition:color .2s ease;
}

.c-accordion__trigger[aria-expanded="true"] .p-faq__question{
  color:var(--color-main);
}

.p-faq__answer{
  display:flex;
  align-items:flex-start;
  gap:.5rem;

  padding:1em;
  background:#f6f3ec;
  border-radius:8px;
}

.p-faq__icon{
  display:block;
  width:24px;
  height:24px;
  max-width:24px;
  max-height:24px;
  flex:0 0 24px;
  object-fit:contain;
  margin-top:4px;
}

.p-faq__text{
  display:block;
  flex:1;

  font-size:clamp(16px, 1vw + 12px, 18px);
  line-height:1.8;
}

/*-------------------------------------------------------*/
/*エントリー*/
/*-------------------------------------------------------*/

.p-entry__box{
  width:calc(100% - 24px);
  background:rgba(255,255,255,.72);
  margin:0 auto;
  padding:0;
  border-radius:20px;
}

.p-entry__inner{
  width:var(--content-narrow);
  margin:0 auto;
  padding:20px 16px;
  box-sizing:border-box;
}

.p-steps{
  display:grid;
  margin:0;
  padding:0;
  gap:20px 12px;
}

/*-------------------------------*/
/*SP（2×2レイアウト）*/
/*-------------------------------*/
@media(max-width:767px){

  .p-entry__box{
    width:calc(100% - 24px);
    border-radius:20px;
  }

  .p-entry__inner{
    width:100%;
    padding:20px 14px 18px;
  }

  .p-steps{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:0;
    margin:8px 8px 0;
  }

  .p-steps__item{ 
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    min-height:140px;
    margin:0;
    padding:8px 0;
    font-size:15px;
    line-height:1.4;
    color:var(--color-text);
    text-align:center;
  }

  .p-steps__item img{
    display:block;
    width:92px;
    max-width:none;
    height:auto;
    margin:0 auto 6px;
  }


}

/*-------------------------------*/
/*PC（4カラム）*/
/*-------------------------------*/
@media(min-width:768px){

  .p-steps{
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:var(--space);
  }

  .p-steps__item{
    display:block;
    margin:0;
    padding:var(--space);

    font-size:1rem;
    line-height:1.6;
    color:var(--color-text);
    text-align:center;
  }

  .p-steps__item img{
    display:block;
    margin:0 auto 8px;
  }
}

.p-entry__action{
  margin:var(--space-lg) 0 0;
  padding:0;
  text-align:center;
}
/*-------------------------------------------------------*/
/*勤務イメージ*/
/*-------------------------------------------------------*/

.p-copy-block + .p-copy-block{
  margin-top:var(--space-lg);
}

.p-copy-block__title{
  margin:0 0 .5rem;
 position:relative;
  padding-left:0.6em;

  font-size:clamp(20px,1.4vw,28px);
  line-height:1.4;
  color:var(--color-main);
}
.p-copy-block__title::before{
  content:"";
  position:absolute;
  left:0;

  top:0.45em; /* ←ここが重要 */

  width:0;
  height:0;

  border-left:8px solid var(--color-main);
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
}

/*-------------------------------------------------------*/
/*タイムライン*/
/*-------------------------------------------------------*/

.p-timeline{
  margin:0;
  padding:0;
}
.p-timeline.p-timeline--schedule01{
  margin:0 0 60px;
}

@media(min-width:768px){
  .p-timeline__content:has(.p-timeline__catch){
    display:flex;
    align-items:center;
    gap:16px;
  }

  .p-timeline__content:has(.p-timeline__catch) .p-timeline__title{
    margin:0;
    flex-shrink:0;
  }

  .p-timeline__content:has(.p-timeline__catch) .p-timeline__catch{
    margin-top:0;
  }

  .p-timeline__content:has(.p-timeline__catch) .p-timeline__catch img{
    max-width:360px;
    height:auto;
  }
}



/* スケジュール① */
.p-timeline--schedule01 .p-timeline__visual img{
  transform:scale(1.1) translateX(0%);
  transform-origin:top;
}

/* スケジュール② */
.p-timeline--schedule02 .p-timeline__visual img{
  transform:scale(1.3) translateY(10%);
  transform-origin:top;
}

.p-timeline__main{
  position:relative;

  margin:0;
  padding:0 0 0 2rem;
}

.p-timeline__main::before{
  content:none;
}

.p-timeline__item{
  position:relative;
  display:grid;
  grid-template-columns:4rem minmax(0,1fr);
  gap:.5rem;

  margin:0;
  padding:0 0 2rem;
}

.p-timeline__item:last-child{
  padding-bottom:0;
}

.p-timeline__item::before{
  content:"";
  position:absolute;
  left:-1.55rem;
  top:0.7em;
  z-index:2;

  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--color-main);
}

.p-timeline__item::after{
  content:"";
  position:absolute;
  left:-1.35rem;
  top:calc(0.7em + 6px);
  bottom:-2rem;
  z-index:1;

  width:1px;
  background:var(--color-main);
}

.p-timeline__item--last::after{
  content:"";
  position:absolute;
  left:-1.45rem;
  top:calc(0.7em + 6px);
  bottom:0;
  z-index:1;

  width:3px;
  background:var(--color-bg);
}

.p-timeline__time{
  font-size:clamp(20px,1.4vw,28px);
  font-weight:700;
  line-height:1.4;
  color:var(--color-main);
}

.p-timeline__content{
  min-width:0;
}

.p-timeline__title{
  margin:0 0 .5rem;
  padding:0;

  font-size:clamp(20px,1.4vw,28px);
  line-height:1.4;
  color:var(--color-main);
}

.p-timeline__text p{
  padding-left:1em;
  text-indent:-1em;
}

/* ▼ここ追加 */
.p-timeline__text{
  line-height:1.6;
}

.p-timeline__text p + p{
  margin-top:var(--space);
}

.p-timeline__catch{
  display:block;
  margin-top:var(--space);
    transform:scale(1.3) translateX(0%);
  transform-origin:top right;
}


.p-timeline__note{
  margin:var(--space) 0 0;
  padding:0;

  font-size:clamp(20px,1.4vw,28px);
  line-height:1.4;
  color:var(--color-main);
font-weight: 700;
  text-align:center;
}
@media(max-width:767px){
  .p-timeline__note{
    font-size:18px;
  }
}

.p-timeline__visual{
  margin:var(--space-lg) 0 0;
  padding:0;
}





/*-------------------------------------------------------*/
/*勤務イメージ戻るボタン*/
/*-------------------------------------------------------*/

.p-schedule__back{
  margin:var(--space-lg) 0 2rem;
  padding:0;
  text-align:center;
}

.p-schedule__back a{
text-decoration: underline;
}


/*-------------------------------------------------------*/
/*集英社で一緒に働こう*/
/*-------------------------------------------------------*/

.p-cta-visual{
  position:relative;
  margin:0 auto;
  overflow:hidden;
}

/* SP */
@media(max-width:767px){
  .p-cta-visual{
    max-width:240px;
  }
}

/* PC */
@media(min-width:768px){
  .p-cta-visual{
    max-width:300px;
  }
}

.p-cta-visual__img{
  display:block;
  width:100%;
  height:auto;
}

.p-cta-visual__img:not(:first-child){
  position:absolute;
  top:0;
  left:0;
}

/*-------------------------------------------------------*/
/*フッター*/
/*-------------------------------------------------------*/

.p-footer{
  display:block;

  background:var(--color-main);

  margin:0;

  color:#fff;
  text-align:center;
}

/*-------------------------------------------------------*/
/*Cookie*/
/*-------------------------------------------------------*/

.c-cookie{
  position:fixed;
  display:block;
  width:100%;

  background:none;

  margin:0;
  padding:.75rem;

  left:0;
  bottom:0;
  z-index:50;
}

.c-cookie__inner{
  display:grid;
  max-width:960px;

  background:rgba(47,47,47,.94);

  margin:0 auto;
  padding:var(--space);
  gap:var(--space);

  color:#fff;

  border-radius:16px;
}

.c-cookie__text{
  margin:0;
  padding:0;

  font-size:.875rem;
  line-height:1.7;
  color:#fff;
}

.c-cookie__actions{
  display:flex;

  margin:0;
  padding:0;
  gap:.75rem;
  flex-wrap:wrap;
}

.c-cookie__button{
  display:inline-block;
  min-width:8rem;

  background:none;

  margin:0;
  padding:.75rem 1rem;

  line-height:1.4;
  color:#fff;

  border:1px solid rgba(255,255,255,.25);
  border-radius:999px;

  text-align:center;
  cursor:pointer;
}

.c-cookie__button--accept{
  background:var(--color-main);
}

/*-------------------------------------------------------*/
/*表示切替*/
/*-------------------------------------------------------*/

.is-pc{
  display:none;
}

.is-sp{
  display:block;
}

/*-------------------------------------------------------*/
/*PC*/
/*-------------------------------------------------------*/

@media(min-width:768px){

  :root{


  --fz-base:clamp(16px, 1vw, 18px);
}

  .cmn_logo{
  display: block;
width: 174px;
}
  .p-fv__layout{
    grid-template-columns:minmax(0,1fr) minmax(18rem,34rem);
    align-items:center;
  }

  .c-info-row{
    grid-template-columns:10rem minmax(0,1fr);
    align-items:start;
    column-gap:var(--space-lg);
  }

  .p-welfare{
    display:grid;
    grid-template-columns:1fr 200px;
    gap:var(--space);
    align-items:stretch;
  }

  .p-welfare__visual{
    align-self:end;
    text-align:right;
  }

  .p-welfare__visual img{
    display:block;
    margin-bottom:-24px;
  }

  .p-steps{
    justify-content:center;
    grid-template-columns:repeat(4, minmax(0, 180px));
    column-gap:12px;
    row-gap:16px;
  }

      .p-steps__item {

        padding: var(--space) 0;

    }



  .p-timeline{
    display:grid;
    grid-template-columns:minmax(0,1fr) 320px;
    column-gap:var(--space-lg);
    align-items:start;
  }

  .p-timeline__visual{
    margin:0;
    grid-column:2;
    grid-row:1 / span 4;
  }

  .p-timeline__note{
    margin:var(--space) 0 0 2rem;
    grid-column:1;
  }

  .p-timeline__item{
    grid-template-columns:5rem minmax(0,1fr);
    gap:1rem;
  }

  .c-cookie__inner{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
  }

  .is-pc{
    display:block;
  }

  .is-sp{
    display:none;
  }

    .p-timeline__catch{
  display:block;
  margin-top:var(--space);
    transform:scale(1) translateX(0%);
  transform-origin:top right;
}
 .p-timeline--schedule02 .p-timeline__catch{
  display:block;
  margin-top:var(--space);
    transform:scale(1) translateX(0%);
  transform-origin:top right;
}


}

/*-------------------------------------------------------*/
/*SPタイムライン画像調整*/
/*-------------------------------------------------------*/

@media(max-width:767px){
  .p-timeline__figure{
    grid-column:1 / -1;
    margin:var(--space) 0;
  }

  .p-timeline__figure img{
      transform:scale(1.2) translateX(0%);
  transform-origin:right top;
   
  }


    .p-timeline__text p{
      width: 130%;
      transform:scale(1) translateX(-22%);
  transform-origin:right top;
   
  }


}