@charset "UTF-8";
@media (min-width: 768px) {
  [data-page="careers"] .lower-navigation__list{
    display: flex;
    gap: 1rem 4rem;
  }
  [data-page="careers"] .lower-navigation__list .lower-navigation__item:nth-child(7){
    margin-left: auto;
  }
  .lower-navigation__item.w-100 {
    display: initial;
  }
}

[data-page="careers"]{
  position: relative;
}

.c-button-area--careers{
  margin-top: 3rem;
}
.careers-section__link{
  margin-inline: auto 0;
}
@media (min-width: 768px) {
  .c-button-area--careers{
    margin-top: 4rem;
  }
}

[data-section-type="philosophy"]{
  margin-top: 3.6rem;
}
.philosophy-description{
  display: grid;
  gap: 2.5rem;
  align-content: center;
  font-family: var(--font-degular);
}
.philosophy-description dt{
  font-size: 3rem;
  text-align: center;
  font-weight: var(--fw-black);
  line-height: 1;
}
.philosophy-description dd{
  margin-top: 1rem;
  font-size: 1.6rem;
  text-align: center;
  line-height: 1.75;
}
.philosophy-description dd.philosophy-description__detail--en{
  font-size: 1.8rem;
  font-weight: var(--fw-semibold);
}
@media (min-width: 768px) {
  [data-section-type="philosophy"]{
    margin-top: 6.2rem;
  }
  .philosophy-description{
    gap: 4rem;
  }
  .philosophy-description dt{
    font-size: 4rem;
  }
  .philosophy-description dd{
    margin-top: 1.4rem;
    font-size: 2rem;
  }
  .philosophy-description dd.philosophy-description__detail--en{
    font-size: 2.2rem;
  }
}

@media (min-width: 768px) {
  #careers-work-place .common-slider{
    margin-top: 5rem;
  }
}


:where(.s-lower-content[data-page="careers"]) .js-scroll-in {
  transform: translateY(30px);
  opacity: 0;
  transition: all 0.8s ease;
}
:where(.s-lower-content[data-page="careers"]) .js-scroll-in.animate {
  transform: translateY(0);
  opacity: 1;
}

@media (hover: hover) {
}



.c-business-message{
  font-size: 2.4rem;
  line-height: 1.5;
  font-weight: var(--fw-semibold);
}
[data-section-type="business"] .grid-list{
  gap: 2.7rem;
  margin-top: 3rem;
}
[data-section-type="business"] .grid-item{
  border: unset;
  padding: 0;
}
[data-section-type="business"] .grid-item__contents dt{
  text-align: center;
  font-size: 1.8rem;
  font-weight: var(--fw-bold);
}
[data-section-type="business"] .grid-item__contents dd{
  margin-top: .9rem;
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.7;
}
@media (min-width: 768px) {
  .c-business-message{
    font-size: 4rem;
  }
  [data-section-type="business"] .grid-list{
    gap: 0;
    grid-template-columns: 34rem 34rem 34rem;
    padding-inline: var(--space-padding-s) 14.28571%;
    margin-top: 4.6rem;
  }
  [data-section-type="business"] .grid-item{
    padding-inline: 3rem;
    width: 34rem;
  }
  [data-section-type="business"] .grid-item + .grid-item{
    position: relative;
  }
  [data-section-type="business"] .grid-item + .grid-item::before{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 1px;
    height: 100%;
    background-size: 1px 1.09px;
    background-repeat: repeat-y;
    /* background-size: contain; */
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221%22%20height%3D%221.09%22%20viewBox%3D%220%200%201%201.09%22%3E%20%3Cdefs%3E%20%3CclipPath%20id%3D%22clip-path%22%3E%20%3Crect%20id%3D%22%E9%95%B7%E6%96%B9%E5%BD%A2_7241%22%20data-name%3D%22%E9%95%B7%E6%96%B9%E5%BD%A2%207241%22%20width%3D%221%22%20height%3D%221.09%22%20transform%3D%22translate(5544%20-15914)%22%20fill%3D%22rgba(227%2C29%2C29%2C0.42)%22%2F%3E%20%3C%2FclipPath%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22%E3%83%9E%E3%82%B9%E3%82%AF%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_39%22%20data-name%3D%22%E3%83%9E%E3%82%B9%E3%82%AF%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%2039%22%20transform%3D%22translate(-5544%2015914)%22%20clip-path%3D%22url(%23clip-path)%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_53877%22%20data-name%3D%22%E3%83%91%E3%82%B9%2053877%22%20d%3D%22M551.555%2C1793.65h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Zm0-1.1h-1v-.1h1Z%22%20transform%3D%22translate(4993.445%20-17587.65)%22%20fill%3D%22%23666%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E')
  }
  [data-section-type="business"] .grid-item__contents dt{
    text-align: left;
    font-size: 2rem;
  }
  [data-section-type="business"] .grid-item__contents dd{
    margin-top: .5rem;
    text-align: left;
    font-size: 1.6rem;
  }
}


[data-section-type="support"] .grid-list{
  gap: 2rem;
}
.grid-item--detail{
  
}

.grid-item--detail__body{
  border: 1px solid var(--color-sub02);
  border-top: unset;
  padding: 2rem 1.8rem;
}
.grid-item--detail__title{
  position: relative;
  padding-left: 1.5rem;
  font-size: 1.6rem;
  font-weight: var(--fw-bold);
  line-height: 1;
  border-left: 4px solid var( --color-black);
}

.grid-item--detail__text{
  margin-top: 1rem;
  font-size: 1.4rem;
  line-height: 1.75;
}

.grid-item--detail__price{
  margin-top: 2rem;
}
.grid-item--detail__price-heading{
  font-size: 1.4rem;
  font-weight: var(--fw-bold);
  line-height: 1.7;
}
.grid-item--detail__price-content {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: max-content auto 1fr;
  row-gap: .6rem; 
  align-items: center;
}

.separator {
  width: 1px;
  height: 1.5rem;
  border-left: 2px dashed #D1D1D1;
  margin: 0 2rem;
}

.role {
  font-size: 1.4rem;
  text-align: left;
  font-weight: var(--fw-bold);
}

.price {
  font-size: 2.2rem;
  font-weight: var(--fw-bold);
}
.unit {
  font-size: 1.4rem;
  font-weight: var(--fw-bold);
}

.grid-item__group{
  display: grid;
  gap: 2rem;
}
.grid-item--detail__price-support{
  margin-top: 1.3rem;
}
.grid-item--detail__price-support-content{
  display: flex;
  align-items: baseline;
  font-weight: var(--fw-black);
  line-height: 1;
}
.support-price__unit{
  font-size: 1.4rem;
}
.support-price__numeric{
  font-size: 2.2rem;
  margin-inline: .3rem .4rem;
}
.support-price__note{
  font-size: 1.3rem;
  line-height: 1;
  font-weight: var(--fw-regular);
  margin-left: 1rem;
}
.grid-item--detail-comingsoon{
  border-top: 1px solid var(--color-sub02);
}
.grid-item--detail__note{
  font-size: 1.6rem;
  font-weight: var(--fw-medium);
  text-align: right;
  width: 100%;
}

@media (min-width: 768px) {
  
  [data-section-type="support"] .grid-list{
    gap: 3rem;
  }

  .grid-item--detail__body{
    padding: 3rem
  }
  .grid-item--detail__title{
    padding-left: 2rem;
    font-size: 1.8rem;
    border-left: 5px solid var( --color-black);
  }

  .grid-item--detail__text{
    margin-top: 1.6rem;
    font-size: 1.5rem;
  }

  .grid-item--detail__price{
    margin-top: 2.2rem;
  }
  .grid-item--detail__price-heading{
    font-size: 1.6rem;
  }
  .grid-item--detail__price-content {
    margin-top: 1rem;
    row-gap: 0; 
  }


  .price {
    font-size: 2.5rem;
  }
  .unit {
    font-size: 1.6rem;
  }

  .grid-item__group{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .grid-item--detail__price-support{
    margin-top: 1.3rem;
  }
  .support-price__unit{
    font-size: 1.5rem;
  }
  .support-price__numeric{
    font-size: 2.5rem;
    margin-inline: .4rem;
  }
  .support-price__note{
    margin-left: 1.2rem;
  }

  .grid-item--detail-comingsoon .grid-item--detail__body{
    padding-block: 4.2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .grid-item--detail__note{
    width: auto;
  }
}


/* =========================================
   TEAM Section Layout (Full Version)
   ========================================= */

/* --- 共通パーツ設定 --- */

/* ブロックタイトル */
.p-team-block__title {
  font-size: 1.5rem;
  font-weight: var(--fw-bold);
  line-height: 1.3;
}

/* リストスタイル */
.p-team-list {
  list-style: none;
  padding: 0;
  margin-top: .8rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.1rem 2rem;
}

.p-team-list__item {
  font-size: 1.3rem;
  line-height: 1.7;
  display: block;
}
.c-list-style--dot{
  position: relative;
  padding-left: 1.2rem;
}
.c-list-style--dot::before {
  content: '';
  width: 5px;
  height: 5px;
  background-color: var(--color-text-default);
  border-radius: 99%;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin-block: auto;
}





@media (min-width: 768px) {
  [data-section-type="team"] .lower-section-contents{
    padding-top: 5.7rem;
  }
  .p-team-layout {
    position: relative;
    width: 100%;
    margin: 0 auto;
    aspect-ratio: 960 / 554;
    display: block;
    padding: 0;
  }


  /* --- 2. SVG：画用紙いっぱいに広げる --- */
  .p-team-chart {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    margin: 0;
    padding: 0;

    display: block;
  }
  
  .p-team-chart__inner {
    width: 100%;
    height: 100%;
    display: block;
  }

  .p-team-chart svg {
    width: 100%;
    height: 100%;
    display: block; /* 余白除去 */
  }
  .p-team-block{
    position: absolute;
    z-index: 1;
  }
  .area-hospitality{
    top: -1%;
    left: 8%;
  }
  .area-management{
    bottom: 0;
    left: 8%;
  }
  .area-development{
    top: -1%;
    right: 18%;
    transform: translate(50%, 0);
  }
  .area-construction{
    bottom: 0;
    right: 17.5%;
    transform: translate(50%, 0);
  }
  .p-team-block__title {
    font-size: 1.8rem;
  }
  .p-team-list{
    margin-top: 1.5rem;
    display: grid;
    gap: 0.4rem 0;
  }
  .p-team-list__item {
    font-size: 1.5rem;
    padding-left: 1.4rem;
  }
  .c-list-style--dot::before {
    width: 6px;
    height: 6px;
  }

}


@media (max-width: 767px) {
  [data-section-type="team"] .lower-section__inner{
    padding-bottom: 8rem;
  }
  .p-team-layout--upper-area,
  .p-team-layout--bottom-area{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .area-development{
    padding-left: 2rem;
  }
  .u-column-sp-2:before{
    top: -2rem;
  }
  .p-team-chart{
    padding-block: .8rem 1.2rem;
  }
}







/* レイアウトの外枠 */
.layout-container {
  width: 100%;
  margin: 0 auto;
  /* max-width: 1200px;  */
}

/* カードの基本スタイル */
.data-card {
  border: 2px solid var(--color-text-default);
  /* 垂直中央揃え */
  display: flex;
  flex-direction: column;
  justify-content: center; 
  align-items: center;
  
  width: 100%;
  height: 100%;
  background: #fff;
  padding-block: 2rem;
  padding-inline: 2rem;
}
.data-card-inner {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .data-card {
    padding-inline: 2.5rem;
    padding-block: 2.5rem;
  }
}




/* =========================================
   PC Layout (768px〜)
========================================= */
@media screen and (min-width: 768px) {
  .layout-container {
    display: grid;
    /* 横3等分 */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    
    /* 縦の行設定 (左・中央カラム用のリズム)
       1行目: auto (年齢・性別の高さが決まる。ここで高い方に揃う)
       2行目: auto (コミュ費)
       3行目: 1fr  (リファラル。余白を埋める)
    */
    grid-template-rows: auto auto 1fr;
    gap: 3rem;

    /* ★エリア定義の変更★
       右側(right-col)は縦に3行分ぶち抜きで確保します。
       これにより、右カラムの中身は1行目(年齢・性別)の高さに縛られなくなります。
    */
    grid-template-areas:
      "age    gender   right-col"
      "dept   comm     right-col"
      "dept   referral right-col";
  }

  /* --- 左・中央カラムの処理 --- */
  /* 枠を無視して、中のカードを直接Grid配置する (高さ揃えのため) */
  .col-left,
  .col-center {
    display: contents;
  }

  /* エリア割り当て */
  .card-age { grid-area: age; }
  .card-gender { grid-area: gender; }
  .card-dept { grid-area: dept; }
  .card-communication { grid-area: comm; }
  .card-referral { grid-area: referral; }


  /* --- 右カラムの処理 (ここが修正ポイント) --- */
  /* 右カラムは「枠(col-right)」ごとGridエリアに配置します。
     中身のカードはGridではなくFlexboxで縦並びにします。
  */
  .col-right {
    grid-area: right-col; /* 縦に貫通するエリアに配置 */
    display: flex;
    flex-direction: column;
    gap: 3rem; /* Gridのgapと同じ値を指定 */
    height: 100%; /* 全体の高さに合わせる */
  }

  /* 右カラム内のカード設定 */
  .col-right .data-card {
    height: auto; /* 高さは中身なり(natural height) */
    flex-grow: 0;
  }

  /* 下のカード(経験職種)だけ伸ばして下端を揃える */
  .col-right .card-exp {
    flex-grow: 1;
    height: auto;
  }
}


/* =========================================
   SP Layout (〜767px)
========================================= */
@media screen and (max-width: 767px) {
  .layout-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  
  .col-wrapper {
    display: contents;
  }

  .data-card {
    width: 100%;
    grid-column: 1 / -1;
  }
  .data-card.is-half {
    grid-column: span 1;
    width: auto;
  }

  .card-age           { order: 1; }
  .card-gender        { order: 2; }
  .card-dept          { order: 3; }
  .card-exp           { order: 4; }
  .card-communication { order: 5; }
  .card-salary        { order: 6; }
  .card-referral      { order: 7; }
}


/* =========================================
Content Styles
========================================= */
.data-title {
  font-size: 1.7rem;
  text-align: center;
  line-height: 1;
  font-weight: var(--fw-bold);
  margin: 0;
}
.data-body {
  width: 100%;
}

.data-age-image--people {
  margin-top: 1.1rem;
  display: block;
  margin-inline: auto;
  width: 6rem;
}
.data-age-average {
  margin-top: 2rem;
  margin-bottom: 0;
}
.data-age-average figcaption {
  font-size: 1.5rem;
  line-height: 1;
  font-weight: var(--fw-bold);
  text-align: center;
}
.data-age-average__image {
  width: 100%;
  margin-top: 1.5rem;
  margin-inline: auto;
}
.data-dept_graph,
.data-dept_gender {
  margin-top: 1.5rem;
  margin-inline: auto;
  width: 100%;
}
.data-dept_graph{
  margin-top: 1rem;
}


.data-note {
  margin-top: 0.4rem;
  font-size: 1.1rem;
  line-height: 2.1;
  text-align: center;
  font-weight: var(--fw-bold);
}
.data-numeric {
  display: flex;
  justify-content: center;
  align-items: baseline;
  font-size: 4rem;
  line-height: 1;
  font-family: var(--font-degular);
  font-weight: var(--fw-bold);
  margin: 1.5rem 0 0 0;
}
.data-communication .data-numeric,
.card-referral .data-numeric{
  margin-top: 0;
}
.card-salary .data-numeric{
  margin-top: 0.3rem;
}
.data-numeric--unit {
  font-size: 3rem;
  margin-left: 0.2em;
}
.card-salary .data-numeric--unit{
  margin-left: 0;
}
.data-numeric--situation{
  margin-left: .3ch;
  font-size: 3.6rem;
}

.data-communication__image {
  display: block;
  margin-inline: auto;
  width: 10rem;
  margin-top: 1rem;
}
.data-referral__image {
  display: block;
  margin-inline: auto;
  width: 7rem;
  margin-top: 1rem;
}

.data-salary__image{
  display: block;
  margin-inline: auto;
  width: 8rem;
  margin-top: .8rem;
}

.data-exp-list {
  margin-top: 1.9rem;
  line-height: 1.8;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: .2rem;
}

.data-exp-item {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: var(--fw-bold);
}
.data-exp-item:last-child::after {
  content: "...etc";
  margin-left: auto;
  font-weight: var(--fw-regular);
}
.data-total{
  margin-top: .8rem;
}
.bubble-black{
  display: grid;
  align-content: center;
}
.bubble-black::before{
  content: '';
  width: 1.5rem;
  height: 1.35rem;
  background-color: var(--color-text-default);
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  margin-inline: auto;
  transform: translateY(1px);
}
.bubble-black__inner{
  background-color: var(--color-text-default);
  border-radius: 5px;
  padding-block: 1.3rem 1.5rem;
}
.bubble-black__inner * {
  color: #fff;
}
.data-total__title{
  font-size: 1.3rem;
  line-height: 1;
  text-align: center;
}
.data-total .data-numeric{
  margin-top: 0;
}

@media screen and (min-width: 768px) {
  .data-title {
    font-size: 1.8rem;
    margin: 0;
  }

  .data-age-image--people {
    margin-top: 1.5rem;
    margin-inline: auto;
    width: 8rem;
  }
  .data-age-average {
    margin-top: 1.5rem;
    margin-bottom: 0;
  }
  .data-age-average__image {
    max-width: 25.05rem;
    margin-top: 1.5rem;
    margin-inline: auto;
  }

  .data-dept_graph,
  .data-dept_gender {
    margin-top: 1.5rem;
    margin-inline: auto;
    max-width: 25rem;
  }


  .data-note {
    margin-top: 0.4rem;
    font-size: 1.1rem;
  }
  .data-numeric {
    display: flex;
    justify-content: center;
    align-items: baseline;
    font-size: 4rem;
    margin: 1.5rem 0 0 0;
  }
  .data-communication .data-numeric,
  .card-referral .data-numeric{
    margin-top: 0;
  }
  .card-salary .data-numeric{
    margin-top: 0.3rem;
  }
  .data-numeric--unit {
    font-size: 3rem;
    margin-left: 0.2em;
  }
  .card-salary .data-numeric--unit{
    margin-left: 0;
  }
  .data-numeric--situation{
    margin-left: .3ch;
    font-size: 3.6rem;
  }

  .data-communication__image {
    margin-top: 1rem;
  }
  .data-referral__image {
    width: 7rem;
    margin-top: 1rem;
  }

  .data-salary__image {
    width: 10rem;
    margin-top: 1rem;
  }

  .data-salary__image{
    width: 10rem;
    margin-top: .8rem;
  }

  .data-exp-list {
    margin-top: 1.9rem;
    gap: .2rem;
  }

  .data-exp-item {
    display: flex;
    align-items: center;
    font-size: 1.5rem;
  }
  .data-total{
    margin-top: 1rem;
  }
  .bubble-black{
    display: grid;
    align-content: center;
  }
  .bubble-black::before{
    width: 1.5rem;
    height: 1.35rem;
    transform: translateY(1px);
  }
  .bubble-black__inner{
    padding-block: 1.3rem 1.5rem;
  }
  .data-total__title{
    font-size: 1.5rem;
    line-height: 1.5;
  }
  .data-total .data-numeric{
    margin-top: 0;
  }
  .card-communication,
  .card-referral{
    padding-block: 2rem;
  }
}



@media screen and (max-width: 767px) {
  [data-section-type="by-the-number"] .c-text-section-heading--multi-step{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    align-items: flex-start;
  }
  [data-section-type="by-the-number"] .u-text-multi-step{
    margin-top: -.8rem;
  }

  .card-age{
    padding-block: 3rem 2rem;
  }
  .card-gender{
    padding-block: 2.8rem 2rem;
  }
  .card-dept{
    padding-block: 2.5rem 2rem;
  }
  .card-exp{
    padding-block: 2.2rem 2rem;
  }
  .card-communication{
    padding-block: 2.5rem 2rem;
  }
  .card-salary,
  .card-referral{
    padding-block: 2.4rem 1.8rem;
    padding-inline: 0;
    justify-content: flex-start;
  }
  .data-referral__image{
    margin-top: 1.4rem;
  }
  .data-salary__image{
    margin-top: .3rem;
  }


  .data-exp-list {
    margin-top: 1.3rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 2rem;
    align-items: center;
    padding-inline: 3rem;
  }
  .data-exp-item:nth-child(n+7) {
    grid-column: 1 / -1;
  }
  .data-total_inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-block: .2rem 1rem;
    padding-inline: 1.6rem;
  }
  .data-total__title{
    transform: translateY(.4rem);
  }
  .data-total .data-numeric{
    margin-top: 0;
  }


}




[data-page="careers"] .fiexd-contact {
  width: 21rem;
  border: 1px solid transparent;
  z-index: 50;
  transition: .5s all cubic-bezier(0.075, 0.82, 0.165, 1);
  text-decoration: none;
  font-size: 1.4rem;
  height: 4.4rem;
  display: grid;
  place-content: center;
  min-width: unset;
}
[data-page="careers"] .fiexd-contact{
  border: 1px solid #fff;
}
.fiexd-contact[data-scroll-area="on"] {
  position: fixed;
  right: 3.0rem;
  bottom: 2.0rem;
}
.fiexd-contact[data-scroll-area="off"] {
  position: absolute;
  right: 3.0rem;
  bottom: 2.0rem;
}
@media screen and (max-width: 767px) {
  [data-page="careers"] .fiexd-contact {
    width: 13.6rem;
    font-size: 1.3rem;
    letter-spacing: 0;
    height: 3.6rem;
    display: flex;
    align-items: center;
    padding-left: 1rem;
    padding-right: 2rem;
  }
  .fiexd-contact[data-scroll-area="on"] {
    position: fixed;
    right: 1.0rem;
    bottom: 2.0rem;
    transform: bottom .5s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .fiexd-contact[data-scroll-area="off"] {
    position: absolute;
    right: 1.0rem;
    bottom: 0rem;
  }

  [data-page="careers"] .fiexd-contact.c-button[target="_blank"] .c-button__icon--1,
  [data-page="careers"] .fiexd-contact.c-button[target="_blank"] .c-button__icon--2{
    background-size: .6rem;
  }
  .c-button .c-button__icon {
    width: .6rem;
    height: .6rem;
    right: 1.5rem;
}

}

@media (hover : hover){
  [data-page="careers"] .fiexd-contact:hover{
    border-color: var(--color-black);
    background-color: #fff;
  }
}