@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Roboto:wght@700&display=swap');

/* ============================================================
   採用情報（RECRUIT）専用スタイル
   - 元サイト(au-plus-home.com fp-19347)のデザインを移植
   - 元CSSの html{font-size} 切替えはサイト全体に影響するため、
     .parts-fp 配下に閉じたスケール変数 --rf へ変換している
   ============================================================ */

.parts-fp,
.parts-fp.template-fp {
  --main-color: #6D461F;
  --sub-color: #E98119;
  --bg-color: #F2F1EF;
  --border-color: #D8CFC5;
  --gray-color: #8A8A8A;
  --marker: #FBFF80;
  --gray: #D8DAE1;
  --black: #242424;
  --rf: 10px;
}
@media screen and (max-width:1024px){ .parts-fp,.parts-fp.template-fp{ --rf: 8.8px; } }
@media screen and (max-width:768px){ .parts-fp,.parts-fp.template-fp{ --rf: 8px; } }

/* 全体の最大幅・左右余白（端ギリギリ防止）
---------------------------------------------------------------------------- */
.parts-fp.company-fp{
  max-width: calc(112 * var(--rf));
  margin: 0 auto;
  padding: 0 calc(3 * var(--rf));
  box-sizing: border-box;
}
@media screen and (max-width:560px){
  .parts-fp.company-fp{ padding: 0 calc(2 * var(--rf)); }
}

/* common
---------------------------------------------------------------------------- */
.template-fp{ font-family:'Noto Sans JP', sans-serif; }
.template-fp h2,
.template-fp h3,
.template-fp h4,
.template-fp h5,
.template-fp p{
  margin:0;
  padding:0;
  border-radius:0;
  line-height:1.5em;
  letter-spacing:0.05em;
  font-weight:500;
  border:none;
  font-size:calc(1.6 * var(--rf));
}
.template-fp a{ text-decoration:none; display:block; }
.template-fp img{ width:100%; height:auto; display:block; }

/* cw
---------------------------------------------------------------------------- */
.parts-fp .cw{ padding:calc(4 * var(--rf)) 0; }
@media screen and (max-width:1120px){
  .parts-fp .cw-inner{ width:calc(100% - 4 * var(--rf)); margin:0 auto; }
}
@media screen and (max-width:768px){
  .parts-fp .cw{ padding:calc(6 * var(--rf)) 0; }
}
@media screen and (max-width:560px){
  .parts-fp .cw{ padding:calc(3 * var(--rf)) 0; }
}

/* mv-wrapper（mv-text02 / mv-img）
---------------------------------------------------------------------------- */
.parts-fp .mv-wrap{ margin-bottom:calc(2 * var(--rf)); }

.parts-fp .mv-text02{
  text-align:left;
  margin:0 auto calc(4 * var(--rf));
  padding-bottom:calc(2 * var(--rf));
  width:100%;
  display:flex;
  justify-content:flex-start;
  align-items:flex-end;
  position:relative;
  flex-wrap:wrap;
  border-bottom:2px solid;
  border-color:var(--main-color);
}
.parts-fp .mv-text02::before{
  position:absolute;
  content:'';
  width:100%;
  height:0;
  border-bottom:1px solid;
  border-color:var(--main-color);
  bottom:2px;
  left:0;
}
.parts-fp .mv-text02 h2{
  text-align:center;
  font-size:calc(3.6 * var(--rf));
  font-weight:bold;
  color:#242424;
  position:relative;
  display:inline-block;
  padding-right:calc(3 * var(--rf));
}
.parts-fp .mv-text02 p{
  font-size:calc(1.8 * var(--rf));
  color:var(--main-color);
  display:inline-block;
  font-family:'Roboto', sans-serif;
}

.parts-fp .mv-img{
  display:flex;
  justify-content:center;
  align-items:center;
}
.parts-fp .mv-img img{
  width:50%;
  height:calc(24 * var(--rf));
  object-fit:cover;
  font-family:'object-fit: cover;';
}
@media screen and (max-width:1120px){
  .parts-fp .mv-img img{ height:25vw; }
}

/* title-box01
---------------------------------------------------------------------------- */
.parts-fp .title-box01{ margin-bottom:calc(2 * var(--rf)); }
.parts-fp .title-box01 h3{
  font-size:calc(3.2 * var(--rf));
  font-weight:bold;
  position:relative;
  padding-left:calc(6 * var(--rf));
  text-align:left;
}
.parts-fp .title-box01 h3:first-letter{ color:var(--main-color); }
.parts-fp .title-box01 h3::before{
  position:absolute;
  content:'';
  width:calc(4 * var(--rf));
  border-bottom:2px solid #242424;
  top:50%;
  left:0;
  transform:translateY(-50%);
}
@media screen and (max-width:560px){
  .parts-fp .title-box01 h3{ font-size:calc(2.4 * var(--rf)); padding-left:calc(3 * var(--rf)); }
  .parts-fp .title-box01 h3::before{ width:calc(2 * var(--rf)); }
  .parts-fp .title-box01{ margin-bottom:calc(1 * var(--rf)); }
}

/* cw05（番号付きステップ）
---------------------------------------------------------------------------- */
.parts-fp .cw-05{ counter-reset:number 0; }
.parts-fp .cw-05 .cw-inner{
  background:var(--bg-color);
  padding:0 calc(4 * var(--rf));
  box-sizing:border-box;
  width:100%;
  margin-top:calc(4 * var(--rf));
}
.parts-fp .cw-05 .cw-box{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  counter-increment:number 1;
  padding:calc(4 * var(--rf)) 0;
  border-bottom:2px solid var(--border-color);
}
.parts-fp .cw-05 .cw-box:last-child{ border-bottom:0px solid; }
.parts-fp .cw-05 .cw-box .cw-text{ width:100%; }
.parts-fp .cw-05 .cw-box .cw-text h4{
  position:relative;
  padding-left:calc(7 * var(--rf));
  margin-bottom:calc(3 * var(--rf));
  font-size:calc(2.4 * var(--rf));
  font-weight:bold;
}
.parts-fp .cw-05 .cw-box .cw-text p{
  font-size:calc(1.6 * var(--rf));
  margin:calc(1 * var(--rf)) 0;
}
.parts-fp .cw-05 .cw-box .cw-text h4::before{
  position:absolute;
  content:counter(number,decimal-leading-zero);
  left:0;
  top:50%;
  transform:translateY(-50%);
  font-size:calc(4.8 * var(--rf));
  font-weight:bold;
  color:var(--main-color);
  font-family:'Roboto', sans-serif;
}
.parts-fp .cw-05 .cw-box .cw-text li p{ margin:0; }
@media screen and (max-width:768px){
  .parts-fp .cw-05 .cw-box{ padding:calc(3 * var(--rf)) 0; }
}
@media screen and (max-width:560px){
  .parts-fp .cw-05 .cw-inner{ padding:0 calc(2 * var(--rf)); margin-top:calc(2 * var(--rf)); }
  .parts-fp .cw-05 .cw-box{ padding:calc(2 * var(--rf)) 0; }
  .parts-fp .cw-05 .cw-box .cw-text h4{ padding-left:calc(5 * var(--rf)); margin-bottom:calc(2 * var(--rf)); font-size:calc(2 * var(--rf)); }
  .parts-fp .cw-05 .cw-box .cw-text h4::before{ font-size:calc(3.2 * var(--rf)); }
}

/* 募集要項（company-list）
---------------------------------------------------------------------------- */
.company-fp .company-list dl{
  display:flex;
  border-bottom:1px solid var(--gray);
  padding:calc(2.5 * var(--rf)) 0;
  box-sizing:border-box;
}
.company-fp .company-list dl dt{
  width:calc(24 * var(--rf));
  font-size:calc(1.8 * var(--rf));
  font-weight:600;
  color:var(--black);
}
.company-fp .company-list dl dd{
  width:calc(100% - 24 * var(--rf));
  font-size:calc(1.8 * var(--rf));
  font-weight:500;
  color:var(--black);
}
@media screen and (max-width:560px){
  .company-fp .company-list dl{ padding:calc(2 * var(--rf)) 0; }
  .company-fp .company-list dl dt{ width:calc(14 * var(--rf)); }
  .company-fp .company-list dl dd{ width:calc(100% - 14 * var(--rf)); }
}
