@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

.recruit_sec .title {
    height: 10.47vw;
    margin-left: 1.72vw;
    width: auto;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    background-image: url(../img/logo_recruit.svg);
}
.recruit_sec .title h1 {
    height: 3.4vw;
    width: auto;
    position: relative;
    z-index: 1;
    margin-left: 10.9vw;
    line-height: 10.47vw;
    font-weight: 500;
    font-size: 2.34vw;
    font-family: "Zen Maru Gothic", sans-serif;
}
.recruit_sec .title h1::before {
    content: "";
    display: block;
    width: 3.94vw;
    height: 3.14vw;
    background-image: url(../img/title_acce.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: -1;
    left: -1.95vw;
    top: 3.125vw;
}

.l-section {
    max-width: 1300px;
    width: 90%;
    margin: 0 auto;
}
.l-section-2 {
    max-width: 1050px;
    width: 90%;
    margin: 0 auto;
}
.p-recruit-message {
    display: flex;
    gap: 5%;
    margin-top: 85px;
    margin-bottom: 196px;
}

.p-recruit-message__body {
    flex-shrink: 0;
}
.g-font-heading {
    height: auto;
    width: auto;
    position: relative;
    z-index: 0;
    font-size: 40px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding-left: 35px;
}
.g-font-heading::before {
    content: "";
    display: block;
    width: 39px;
    height: 23.3px;
    background-image: url(../img/title_acce_recruit.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: -1;
    left: 0;
    top: 20px;
}
.g-font-heading span {
    position: absolute;
    color: #DAD645;
    font-family: "Barlow Condensed";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: max-content;
    left: 0;
    bottom: -22px;
}
.p-recruit-message__text {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 200%; /* 40px */
    margin-top: 70px;
}
.p-recruit-message img {
    width: 55vw;
    max-width: 890px;
}
@media screen and (max-width: 1250px) {
    .p-recruit-message__text {
        font-size: 18px;
        line-height: 150%;
    }
    .p-recruit-message img {
        width: 50vw;
    }
}

.p-recruit-electricity {
    position: relative;
    margin-bottom: 45px;
}
.p-recruit-electricity__cloud {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    top: -90px;
}
.p-recruit-electricity__head {
    text-align: center;
    margin-bottom: 65px;
}
.p-recruit-electricity__head h3 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin: 0 0 25px;
}
.p-recruit-electricity__head h3 .q {
    color: #D5CF00;
    font-family: "Roboto Condensed";
    font-size: 80px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.p-recruit-electricity__head h3 .title {
    font-size: 40px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    display: block;
}
.p-recruit-electricity__head h3 .title span {
    display: block;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: left;
}
.p-recruit-electricity__head p {
    width: fit-content;
    text-align: left;
    margin: 0 auto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%;
}
.p-recruit-electricity__step {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 80px;
}
.p-recruit-electricity__step-item {
    text-align: center;
    position: relative;
}
.p-recruit-electricity__step-item:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 7px;
    background: #54D63D;
    z-index: -1;
    top: 22px;
}
.p-recruit-electricity__step-item:last-child:before {
    display: none;
}
.p-recruit-electricity__step-num {
    width: fit-content;
    background-image: url(../img/num.svg);
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 50px;
    margin: 0 auto 13px;
    color: #FFF;
    font-family: "Roboto Condensed";
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.p-recruit-electricity__step-title {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
}
.p-recruit-electricity__step-text {
    color: #54D63D;
    font-family: "Zen Maru Gothic";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
}

.p-recruit-electricity__figure {
    position: relative;
}
.p-recruit-electricity__figure-back {
    width: 100%;
    position: absolute;
    z-index: -1;
    top: -40px;
}
.p-recruit-electricity__figure-main {
    width: 100%;
    margin-bottom: 80px;
}
.p-recruit-electricity__figure-point {
    width: 100%;
}
.p-recruit-works {
    position: relative;
    margin-bottom: 120px;
}
.p-recruit-electricity__works-plug {
    position: absolute;
    right: 0;
    top: 50px;
    z-index: -1;
}
.p-recruit-works .g-font-heading {
    margin: 0 0 40px;
}
.p-recruit-works__head {
    display: flex;
    gap: 60px;
}
.p-recruit-works__head-title {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
    flex-shrink: 0;
}
.p-recruit-works__head-text {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%;
    max-width: 560px;
}
.p-recruit-works__list {
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px 24px;
    margin-top: 55px;
}
.p-recruit-works__list-item {
    list-style: none;
    border-radius: 14px;
    border: 2px solid #2BA703;
    background: #FFF;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    padding: 30px 40px;
}
.p-recruit-works__list-head {
    display: flex;
    gap: 16px;
    align-items: center;
    margin-bottom: 13px;
}
.p-recruit-works__list-head h3 {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
    margin: 0;
}
.swiper-wrapper {
    display: flex;
}

.l-beige {
    border-radius: 30px;
    background: #FBF8EB;
    padding-top: 99px;
}

.p-recruit-interview .g-font-heading {
    margin: 0;
    width: fit-content;
    margin: 0 auto 50px;
}
.p-recruit-interview__inner {
    overflow: hidden;
}
.p-recruit-interview__list {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 55px;
}
.p-recruit-interview__slide {
    flex-shrink: 0;
}
.p-recruit-interview__figure img {
    width: 100%;
    border-radius: 15px;
    display: block;
}
.p-front-salary__progress-count {
    display: none;
}
.p-recruit-interview__text {
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: center;
    margin: 0 auto 60px;
    position: relative;
    width: fit-content;
}
.p-recruit-interview__content {
    background-image: url(../img/interview-back.png);
    background-size: cover;
    padding: 60px 0 65px;
    border-radius: 30px;
    position: relative;
}
.p-front-salary__progress-wrap {
    display: flex;
    gap: 115px;
    align-items: center;
}
.p-front-salary__progress-flex {
    display: flex;
    gap: 24px;
}
.p-front-salary__arrow {
    margin: 0;
    padding: 0;
    border: 0;
    background: 0;
    cursor: pointer;
}
.p-front-salary__arrow:hover circle {
    stroke: #81D765;
}
.p-front-salary__arrow:hover path {
    fill: #81D765;
}
.p-front-salary__progress-bar {
    width: 100%;
    height: 10px;
    flex: 1 1 0%;
    border-radius: 1px;
    overflow: hidden;
    background: #F5F5F5;
}
.p-front-salary__progress-fill {
    height: 100%;
    width: 0%;
    background: #D5CF00;
    border-radius: 1px;
    transition: width 0.4s;
}

.p-recruit-interview__link {
    padding: 24px;
    border-radius: 20px;
    background: #FFF;
    display: block;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
}

.p-recruit-interview__human-01 {
    position: absolute;
    top: -78px;
    left: -360px;
}
.p-recruit-interview__human-02 {
    position: absolute;
    top: -75px;
    right: -360px;
}
.p-recruit-interview__info {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
}
.interview-category {
    border-radius: 50px;
    background: #2BA703;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding: 2px 15px;
}
.interview-year {
    color: #949494;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.p-recruit-interview__title {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    line-height: 150%;
    margin-bottom: 13px;
    display: -webkit-box !important;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 3em;
}
.p-recruit-interview__name {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 21px;
}

.p-recruit-interview__more {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #2BA703;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    justify-content: flex-end;
}

.p-recruit-data {
    margin-top: 110px;
    margin-bottom: 150px;
}
.p-recruit-data .g-font-heading {
    width: fit-content;
    margin: 0 auto;
}

/* ===== メイングリッド ===== */
.dashboard {
    display: grid;
    margin-top: 80px;
    gap: 32px;
    grid-template-columns: repeat(15, 1fr);
    grid-template-rows: auto;
    position: relative;
}

/* ===== カード共通 ===== */
.card {
    position: relative;
    overflow: hidden;
    grid-column: span 5;
    border-radius: 14px;
    border: 2px solid #2BA703;
    background: #FFF;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    padding: 21px 21px 21px;
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 20px;
}
.card-grid .card-text-20 {
    display: flex;
    gap: 13px;
}
.card-flex .card-label {
    margin-bottom: 15px;
}
.card-school .card-label {
    margin-bottom: 15px;
}
.card .option {
    color: #393A3A;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
    display: block;
    margin-top: 15px;
    margin-left: auto;
    width: fit-content;
}
.card-text-40 {
    color: #2FE70A;
    font-family: "Barlow Condensed";
    font-size: 40px;
    font-style: normal;
    font-weight: 500;
    line-height: 0.1;
}
.card-label {
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 42px */
    border-radius: 21px;
    background: #2BA703;
    padding: 0 23px;
    width: fit-content;
    margin-bottom: 25px;
}

.card-text-30 {
    color: #393A3A;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.card-text-26 {
    color: #393A3A;
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.card-text-20 {
    color: #393A3A;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.card-text-16 {
    color: #393A3A;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5;
}
.card-text-120 {
    color: #2BA703;
    font-family: "Barlow Condensed";
    font-size: 100px;
    font-style: normal;
    font-weight: 500;
    line-height: 0.8;
}
.card-text-80 {
    color: #2BA703;
    font-family: "Barlow Condensed";
    font-size: 100px;
    font-style: normal;
    font-weight: 500;
    line-height: 0.8;
}
.card-text-80.-light {
    color: #2FE70A;
}
.card-text-60 {
    color: #2BA703;
    font-family: "Barlow Condensed";
    font-size: 60px;
    font-style: normal;
    font-weight: 500;
    line-height: 0.85;
}

.card-value {
    font-size: 42px;
    font-weight: 700;
    color: #4caf50;
    line-height: 1;
    display: flex;
    align-items: flex-end;
    gap: 5px;
    justify-content: center;
}

.card-value span.unit {
    color: #393A3A;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}
.card-value span.unit-20 {
    color: #393A3A;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
}

.card-value span.sub {
    font-size: 13px;
    color: #777;
    font-weight: 400;
}

/* 下部のグリーンバー */
.bar-wrap {
    margin-top: 20px;
    height: 32px;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/left-bar.png);
    overflow: hidden;
}
.bar-fill {
    width: 0;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/right-bar.png);
    overflow: hidden;
    transition: width 0.5s ease-out !important;
}

/* ===== グリッド配置 ===== */

/* Row 1: 未経験入社率（2列）| 年齢構成（2列） */
.card-inexperienced { grid-column: span 7; }
.card-age { 
    grid-column: span 7;
    padding: 15px 21px 10px;
}
.card-age .card-text-16 {
    margin-top: 20px;
}
.card-inexperienced .card-text-120 {
    color: #2FE70A;
}
/* Row 2: 平均就業時間 | 入社1年未満定着率 | 年間採用数 | 年間採用費 */
.card-time { grid-column: span 4;}
.card-stay { grid-column: span 4;}
.card-year { grid-column: span 6;}
.card-year .card-label {
    margin-bottom: 32px;
}
.card-year .card-text-40 {
    font-size: 50px;
}
.card-cost { grid-column: span 5;}

/* Row 3: 年間休日 | 文系・理系 （2列）| 自己資本比率 */
.card-start     { grid-column: span 4; }
.card-equity   { grid-column: span 4; }
.card-faculty  { grid-column: span 15; }
.card-holiday  { grid-column: span 3; }

.card-flex  { 
    grid-column: span 8;
    padding: 21px 21px 10px;
}
.card-school  { grid-column: span 11; }
/* Row 4: アンケート（4列） */
.card-survey   {
    grid-column: span 15;
    padding: 21px 21px 35px;
}

.card-equity2 {
    grid-column: span 4;
}
/* Row 5: 3つの指標（各1列+span1=4列） */
/* 3枚 → 各 span 1 で4列中3列 → 均等にするため */
.card-metric   { grid-column: span 5; }

/* ===== 年齢構成 パイ風 ===== */
.age-card-inner {
    display: flex;
    align-items: flex-start;
    gap: 30px;
}
.pie {
    width: 250px;
    height: 250px;
    flex-shrink: 0;
    border-radius: 250px;
}
.age-legend {
    font-size: 11px;
    line-height: 1.8;
}
.age-legend span {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}

/* ===== 文系・理系 ===== */
.faculty-row {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    margin-top: 4px;
}
.faculty-item { flex: 1; }
.faculty-label { font-size: 13px; color: #555; margin-bottom: 4px; }
.faculty-value { font-size: 36px; font-weight: 700; color: #4caf50; }
.faculty-bar {
    margin-top: 6px;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    overflow: hidden;
}
.faculty-bar-fill {
    height: 100%;
    background: #4caf50;
    border-radius: 3px;
}

/* ===== アンケート ===== */
.survey-inner {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}
.survey-big {
    font-size: 42px;
    font-weight: 700;
    color: #4caf50;
    line-height: 1;
    white-space: nowrap;
}
.survey-big .survey-unit {
    font-size: 14px;
    color: #333;
    font-weight: 400;
}
.survey-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px 20px;
}
.survey-item {
    font-size: 11px;
    color: #555;
    display: flex;
    align-items: center;
    gap: 6px;
}
.survey-item .sval {
    font-size: 20px;
    font-weight: 700;
    color: #4caf50;
    white-space: nowrap;
}
.survey-item .sval span { font-size: 12px; font-weight: 400; color: #333; }

.survey-items .card-text-20 {
    display: flex;
    border: 2px solid #2BA703;
    padding: 15px;
    width: fit-content;
    gap: 23px;
    border-radius: 50px;
    padding: 15px 30px;
    align-items: center;
    color: #2BA703;
    position: relative;
}
.survey-items .card-text-20 svg {
    position: absolute;
    bottom: -17px;
    left: 40px;
}
.survey-items .num {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}
.survey-items .card-text-60.-light {
    color: #2FE70A;
    line-height: 1;
    font-size: 40px;
}
.survey-items .num .pa {
    color: #393A3A;
    font-family: "Zen Maru Gothic";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.2;
}
/* ===== Row5: 下部指標 3列 ===== */
.bottom-metrics {
    grid-column: span 4;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.metric-card {
    background: #fff;
    border-radius: 8px;
    padding: 14px 16px 12px;
}
.metric-label {
    font-size: 11px;
    color: #555;
    margin-bottom: 6px;
}
.metric-value {
    font-size: 38px;
    font-weight: 700;
    color: #4caf50;
}
.metric-value span {
    font-size: 16px;
    color: #333;
    font-weight: 400;
    margin-left: 2px;
}

.p-recruit-data__human {
    position: absolute;
    top: -146px;
    right: 7.5%;
}

/* 未経験率 大きい数字の横に小さいテキスト */
.inline-sub {
    font-size: 13px;
    color: #777;
    font-weight: 400;
    margin-left: 8px;
}

.big-row {
    display: flex;
    align-items: baseline;
    gap: 0;
    justify-content: space-between;
}


/* ===== No.1 カード ===== */
 
  .rank-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 40px;
    border-radius: 14px;
    background: #FFF;
    padding: 24px;
    /* コンテンツ用_影 */
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
  }
 
  .p-recruit-ranking__img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    object-fit: cover;
    display: block;
  }
  .rank1-img-placeholder {
    max-width: 551px;
    width: 42%;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 827 / 467;
    flex-shrink: 0;
  }
  /* 人物シルエット（プレースホルダー） */
  .silhouette {
    opacity: 0.5;
  }
 
  .rank1-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 1;
  }
 
  .rank-badge {
    display: flex;
    align-items: center;
    gap: 28px;
    margin-bottom: 28px;
  }

  .rank-badge.-s {
    gap: 23px;
    margin-bottom: 11px;
  }
  .rank-catch {
    color: #2BA703;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 35px */
  }
  .rank-title {
    color: #393A3A;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 52.5px */
    margin: 0;
  }
  .rank-catch-s {
    color: #2BA703;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 35px */
  }
  .rank-title-s {
    color: #393A3A;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 52.5px */
    margin: 0;
  }
  .rank-text {
    color: #393A3A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 28px */
  }

  .p-recruit-ranking__logo-01 {
    position: absolute;
    right: 24px;
    bottom: 0;
    z-index: 0;
    max-height: 100%;
  }
  .p-recruit-ranking__logo-02 {
    position: absolute;
    right: 24px;
    bottom: 0;
    z-index: 0;
    width: 82px;
  }
 
  /* ===== No.2 / No.3 2カラム ===== */
  .rank-row {
    margin-top: 32px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
 
  .rank-card.-column {
    flex-direction: column;
    gap: 25px;
  }
 
  .rank-card-img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    display: block;
  }
  .rank-card-img-placeholder {
    width: 100%;
    aspect-ratio: 581 / 328;
    display: flex;
    align-items: center;
    justify-content: center;
  }
 
  .rank-badge-sm {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 6px;
  }
  .rank-badge-circle-sm {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: #4caf50;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  .rank-badge-circle-sm.no3 { background: #ff9800; }
 
  .rank-badge-no-sm {
    font-size: 6px;
    color: #fff;
    font-weight: 700;
    line-height: 1;
  }
  .rank-badge-num-sm {
    font-size: 13px;
    color: #fff;
    font-weight: 900;
    line-height: 1;
  }
  .rank-badge-label-sm {
    font-size: 9px;
    color: #4caf50;
    font-weight: 600;
  }
  .rank-badge-circle-sm.no3 + .rank-badge-label-sm { color: #ff9800; }
 
  .rank-card-catch {
    font-size: 9px;
    color: #555;
    margin-bottom: 2px;
  }
  .rank-card-title {
    font-size: 12px;
    font-weight: 700;
    color: #222;
    line-height: 1.4;
    margin-bottom: 6px;
  }
  .rank-card-text {
    font-size: 10px;
    color: #777;
    line-height: 1.7;
  }
  .rank-card-body {
        z-index: 1;
        position: relative;
   }
 
  /* ===== 緑背景つなぎ ===== */
  .green-connector {
    background: #4caf50;
    height: 20px;
    margin-top: -1px;
  }
 
  /* ===== フッター特徴セクション ===== */
  .features {
    position: relative;
    margin-top: 32px;
    border-radius: 14px;
    background: #FFF;
    padding: 34px 5% 70px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
  }
 
  .features-title {
    color: #393A3A;
    font-family: "Zen Maru Gothic";
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 52.5px */
    margin: 0 auto 60px;
    width: fit-content;
  }
  .features-title::before,
  .features-title::after {
    content: '';
    display: inline-block;
    width: 40px;
    height: 3px;
    background: #4caf50;
    vertical-align: middle;
    transform: rotate(45deg);
    margin: 0 10px;
  }
    .features-title::after {
        transform: rotate(-45deg);
    }
 
  .features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    z-index: 1;
    position: relative;
  }
 
  .feature-col {
    border-radius: 14px;
    border: 1px solid #2BA703;
    background: #FFF;
    padding: 40px 25px 33px;
    position: relative;
  }

  .feature-col-title {
    position: absolute;
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 35px */
    top: -17.5px;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    border-radius: 18px;
    background: #2BA703;
    padding: 0 24px;
  }
 
  .feature-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0 1.5em;
  }
  .feature-list li {
    color: #393A3A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 250%;
    padding-left: 1em;
    position: relative;
  }
  .feature-list li::before {
    content: '・';
    position: absolute;
    left: 0;
    color: #393A3A;
  }

.p-recruit-ranking {
    background-image: url(../img/ranking-back.png);
    background-size: cover;
    padding: 70px 0 80px;
    border-radius: 30px;
    position: relative;
}

.p-recruit-ranking .g-font-heading {
    width: fit-content;
    margin: 0 auto 65px;
    color: #fff;
}
.p-recruit-ranking .g-font-heading::before {
    background-image: url(../img/title_acce_recruit-white.svg);
}
.p-recruit-ranking .g-font-heading span {
    color: #fff;
}
.p-recruit-ranking__head {
    position: relative;
    width: fit-content;
    margin: 0 auto 25px;
    border-radius: 104.5px;
    background: #fff;
    padding: 10px 25px;
    color: #2BA703;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    border: 1px solid #2BA703;
}
.p-recruit-ranking__head svg {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -17px;
}

.p-recruit-recruit .g-font-heading {
    width: fit-content;
    margin: 110px auto 70px;
}
.p-recruit-recruit .recruit_sec .recruit_box {
    margin: 0 auto;
    width: auto;
    box-shadow: unset;
    background-color: unset;
}
.p-recruit-recruit .recruit_sec .recruit_box .tab_menus {
    justify-content: center;
    border-bottom: 2px solid #EAEDEF;
}
.p-recruit-recruit .recruit_sec .recruit_box .tab_menus .recruit_tab {
    height: auto;
    width: 25% !important;
    min-width: 320px;
    line-height: 1.5;
    color: #393A3A;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
    box-shadow: none !important;
    cursor: pointer;
    position: relative;
}
.p-recruit-recruit .recruit_sec .recruit_box .tab_menus span {
    display: none !important;
}
.recruit_tab.open:before {
    content: "";
    position: absolute;
    height: 2px;
    width: 100%;
    background: #2BA703;
    bottom: -2px;
    left: 0;
}
.p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table {
    width: 100%;
}
.p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td:first-child {
    position: relative;
    color: #393A3A;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 42px */
    padding: 0;
    width: 240px;
    padding: 30px 0 14px;
    padding-left: 40px;
    display: flex;
    align-items: flex-start;
    font-family: "Zen Maru Gothic";
}
.p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td:first-child::before {
    content: "";
    display: block;
    width: 39px;
    height: 23.3px;
    background-image: url(../img/title_acce_recruit-green.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: -1;
    left: 0;
    top: 40px;
}
.p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td {
    padding: 30px 0 14px;
    font-family: "Zen Maru Gothic";
    color: #393A3A;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 35px */
}
.p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr {
    border-bottom: 2px dashed #EAEDEF;
}
.recruit_sec .recruit_box .recruit_detail table tr td span {
    color: #2BA703;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%;
}
.recruit * {
    font-family: "Zen Maru Gothic";
    transition: 0.6s;
}
.p-recruit-electricity__figure-main.-sp {
    display: none;
}
.p-recruit-electricity__figure-point.-sp {
    display: none;
}

.p-recruit-interview__figure {
    aspect-ratio: 323 / 242;
    height: auto;
    width: 100%;
    display: flex;
    overflow: hidden;
    border-radius: 15px;
}
.p-recruit-interview__figure img {
    width: 100%;
    height: auto;
    object-fit: cover;
    display: block;
}
.p-recruit-interview__link:hover .p-recruit-interview__figure img {
    transform: scale(1.1);
}
.p-recruit-interview__link:hover .p-recruit-interview__more {
    opacity: 0.6;
}

.card-faculty .card-text-26 br {
    display: none;
}
.pie-wrap svg {
    width: 175px;
    height: 175px;
}
@media screen and (max-width: 1200px) {
    .card-text-120 {
        font-size: 80px;
    }
    .pie-wrap svg {
        width: 150px;
        height: 150px;
    }
    .dashboard {
        gap: 20px;
    }
    .card-label {
        font-size: 20px;
        padding: 0 15px;
    }
    .bar-wrap {
        height: 30px;
    }
    .card-age .card-text-16 {
        margin-top: 15px;
    }
    .card-text-80 {
        font-size: 80px;
    }
}
@media screen and (max-width: 1050px) {
    .card {
        padding: 16px 16px 25px;
    }
    .card-age {
        padding: 16px 16px 16px;
    }
    .card-year {
        padding: 16px 16px 25px;
    }
    .card-grid {
        gap: 35px 20px;
    }
    .card-year .card-text-40 {
        font-size: 40px;
    }
    .card-text-30 {
        font-size: 25px;
    }
    .card-label {
        font-size: 18px;
        padding: 0 12px;
    }
    .card-year .card-label {
        margin-bottom: 18px;
    }
}
@media screen and (max-width: 960px) {
    .g-font-heading {
        font-size: 30px;
    }
    .g-font-heading::before {
        top: 15px;
    }
    .p-recruit-message {
        gap: 3%;
    }
    .p-recruit-message__text {
        font-size: 16px;
    }
    .p-recruit-message img {
        width: 45vw;
    }

    .p-recruit-electricity__cloud {
        width: 120vw;
    }
    .p-recruit-electricity__head h3 .q {
        font-size: 60px;
    }
    .p-recruit-electricity__head h3 .title {
        font-size: 30px;
    }
    .p-recruit-electricity__head h3 .title span {
        font-size: 18px;
    }
    .p-recruit-electricity__step {
        gap: 30px;
    }
    .p-recruit-electricity__step-title {
        font-size: 20px;
    }
    .p-recruit-electricity__step-item:before {
        left: calc(50% + 20px);
    }
    .p-recruit-electricity__step-text {
        font-size: 16px;
    }
    .p-recruit-electricity__figure-back {
        width: 120%;
        top: -70px;
    }
    .p-recruit-electricity__figure-main {
        margin-bottom: 40px;
    }

    .p-recruit-works__list-head h3 {
        font-size: 20px;
    }
    .p-recruit-works__head-title {
        font-size: 20px;
    }
    .p-recruit-works__list-item {
        padding: 20px 30px;
    }
    .p-recruit-works__list-head svg {
        width: 60px;
    }

    .p-recruit-interview__human-01 {
        height: 60px;
        top: 24px;
        left: -125px;
    }
    .p-recruit-interview__human-02 {
        height: 60px;
        top: 24px;
        right: -125px;
    }

    .p-recruit-data__human {
        top: -116px;
        right: 4.5%;
        width: 125px;
    }
    .dashboard {
        grid-template-columns: repeat(18, 1fr);
    }

    .card { grid-column: span 9; }
    .card-inexperienced { 
        grid-column: span 18; 
    }
    .card-age { 
        grid-column: span 12; 
    }
    /* Row 2: 平均就業時間 | 入社1年未満定着率 | 年間採用数 | 年間採用費 */
    .card-time { grid-column: span 6;}
    .card-stay { grid-column: span 6;}
    .card-equity2 { grid-column: span 10;}
    .card-year { grid-column: span 12;}
    .card-cost { grid-column: span 10;}
    .card-start {
        grid-column: span 8;
    }
    .card-flex {
        grid-column: span 12;
    }
    .card-school {
        grid-column: span 18;
    }
    /* Row 3: 年間休日 | 文系・理系 （2列）| 自己資本比率 */
    .card-holiday  { grid-column: span 8; }
    .card-faculty  { grid-column: span 18; }
    .card-equity   { grid-column: span 6; }

    /* Row 4: アンケート（4列） */
    .card-survey   { grid-column: span 18; }

    /* Row 5: 3つの指標（各1列+span1=4列） */
    /* 3枚 → 各 span 1 で4列中3列 → 均等にするため */
    .survey-items .card-text-20 {
        padding: 15px 25px;
        gap: 15px;
        font-size: 18px;
        line-height: 2;
    }
    .survey-items .card-text-60.-light {
        line-height: 1;
        font-size: 30px;
    }
    .survey-items .num .pa {
        font-size: 18px;
        line-height: 1;
    }


    .rank-card {
        gap: 20px;
    }
    .rank-badge {
        gap: 15px;
        margin-bottom: 15px;
    }
    .rank-badge-circle img {
        width: 65px;
    }
    .rank-catch {
        font-size: 18px;
    }
    .rank-title {
        font-size: 24px;
    }
    .rank1-img-placeholder {
        aspect-ratio: 827 / 625;
    }
    .rank-badge.-s {
        gap: 15px;
    }
    .rank-badge.-s .rank-badge-circle img {
        width: 45px;
    }
    .rank-badge.-s .rank-catch-s {
        font-size: 14px;
    }
    .rank-badge.-s .rank-title-s {
        font-size: 18px;
    }
    .rank1-text {
        font-size: 16px;
    }
    .features {
        padding: 25px 3% 40px;
    }
    .features-grid {
        gap: 20px;
    }
    .feature-col {
        padding: 30px 15px 20px;
    }
    .feature-col-title {
        font-size: 18px;
        padding: 0 15px;
    }
    .features-title {
        font-size: 24px;
        margin: 0 auto 50px;
    }

    .p-recruit-recruit .recruit_sec .recruit_box .tab_menus .recruit_tab {
        width: 33.3% !important;
        min-width: unset;
        font-size: 18px;
    }
}
@media screen and (max-width: 768px) {
    .g-font-heading {
        font-size: 24px;
        padding-left: 30px;
    }
    .g-font-heading::before {
        top: 11px;
        width: 29px;
        height: 19px;
    }
    .p-recruit-message {
        margin-top: 42.5px;
        margin-bottom: 98px;
        flex-direction: column;
        align-items: center;
        gap: 25px;
    }
    .p-recruit-message img {
        width: 85%;
    }
    .p-recruit-message__text {
        margin-top: 50px;
    }

    .p-recruit-electricity__head h3 {
        gap: 12px;
    }
    .p-recruit-electricity__head h3 .q {
        font-size: 50px;
    }
    .p-recruit-electricity__head h3 .title {
        font-size: 24px;
        text-align: left;
    }
    .p-recruit-electricity__head h3 .title span {
        font-size: 16px;
    }
    .p-recruit-electricity__head {
        margin-bottom: 35px;
    }
    .p-recruit-electricity__step {
        grid-template-columns: repeat(1, 1fr);
        margin-bottom: 40px;
    }
    .p-recruit-electricity__step-item {
        display: flex;
        position: relative;
        gap: 15px;
    }
    .p-recruit-electricity__step-item:before {
        left: 21px;
        width: 5px;
        height: calc(100% + 30px);
        top: 35px;
    }
    .p-recruit-electricity__step-num {
        flex-shrink: 0;
        margin: 0;
    }
    .p-recruit-electricity__step-title {
        font-size: 18px;
        margin-top: -4px;
    }
    .p-recruit-electricity__step-text {
        position: absolute;
        left: 68px;
        top: 25px;
        text-align: left;
        font-size: 14px;
    }
    .p-recruit-electricity__figure-main.-pc {
        display: none;
    }
    .p-recruit-electricity__figure-main.-sp {
        display: block;
        width: 90%;
        margin: 0 auto 20px;
    }
    .p-recruit-electricity__figure-point.-pc {
        display: none;
    }
    .p-recruit-electricity__figure-point.-sp {
        display: block;
        width: 90%;
        margin: auto;
    }
    .p-recruit-electricity__figure-back {
        display: none;
    }

    .p-recruit-works {
        margin-bottom: 60px;
    }
    .p-recruit-works__head {
        flex-direction: column;
        gap: 20px;
    }
    .p-recruit-works__list-head h3 {
        font-size: 18px;
    }
    .p-recruit-works__head-title {
        font-size: 18px;
    }
    .p-recruit-works__list-item {
        padding: 20px 20px;
    }
    .p-recruit-works__list {
        grid-template-columns: repeat(1, 1fr);
        gap: 25px;
        margin-top: 30px;
    }
    .p-recruit-electricity__works-plug {
        width: 50%;
        top: 0;
    }

    .l-beige {
        padding-top: 45px;
    }
    .p-recruit-interview__text {
        width: 90%;
        text-align: left;
        margin-bottom: 30px;
    }
    .p-recruit-interview__human-01 {
        height: 30px;
        left: 0;
        top: 48px;
        display: none;
    }
    .p-recruit-interview__human-02 {
        height: 48px;
        right: 0;
        top: 29px;
    }
    .p-recruit-interview__content {
        padding: 35px 0 15px;
    }
    .p-recruit-interview__list {
        margin-bottom: 20px;
    }
    .p-front-salary__progress-wrap {
        gap: 35px;
    }
    .p-front-salary__progress-flex {
        gap: 15px;
    }
    .p-front-salary__progress-flex svg {
        width: 40px;
    }
    .interview-category {
        font-size: 14px;
        padding: 2px 10px;
    }
    .interview-year {
        font-size: 14px;
    }
    .p-recruit-interview__title {
        font-size: 16px;
        margin-bottom: 10px;
    }
    .p-recruit-interview__name {
        font-size: 14px;
        margin-bottom: 15px;
    }
    .p-recruit-interview__more {
        gap: 8px;
        font-size: 14px;
    }

    .p-recruit-data {
        margin-top: 55px;
        margin-bottom: 75px;
    }
    .dashboard {
        margin-top: 40px;
    }
    .p-recruit-data__human {
        display: none;
    }
    .card-text-30 {
        font-size: 20px;
    }
    .card-text-120 {
        font-size: 55px;
    }
    .card-value span.unit {
        font-size: 20px;
    }
    .card-text-20 {
        font-size: 18px;
    }
    .card-text-60 {
        font-size: 40px;
    }
    .card-text-80 {
        font-size: 55px;
    }
    .bar-wrap {
        margin-top: 15px;
        height: 30px;
    }
    .dashboard {
        grid-template-columns: repeat(1, 1fr);
    }
    .card { grid-column: span 1; }
    .age-card-inner {
        flex-direction: column;
        gap: 15px;
    }
    .card-label {
        font-size: 16px;
        margin-bottom: 15px;
    }
    .pie-wrap {
        margin: 5px auto 0;
    }
    .card-text-26 {
        font-size: 18px;
    }
    .survey-inner {
        flex-direction: column;
    }
    .card-value {
        justify-content: center;
    }
    .card-year .card-grid {
        margin-top: 25px;
    }
    .card {
        padding: 16px 16px 15px;
    }
    .card-school .card-text-26 {
        font-size: 14px;
    }
    .card-school .card-text-80 {
        font-size: 40px;
    }
    .bar-wrap {
        height: 30px;
    }
    .card-faculty .card-text-26 {
        font-size: 14px;
        line-height: 1.5;
    }
    .card-faculty .card-text-80 {
        font-size: 40px;
    }
    .card-faculty .card-text-26 br {
        display: unset;
    }
    .survey-items .card-text-20 {
        flex-wrap: wrap;
        gap: 10px;
        font-size: 16px;
        justify-content: center;
        padding: 10px 15px;
    }
    .survey-items {
        gap: 30px 20px;
    }
    .card-survey {
        padding-bottom: 30px;
    }

    .p-recruit-ranking {
        padding: 35px 0 40px;
    }
    .p-recruit-ranking__head {
        font-size: 18px;
    }
    .p-recruit-ranking .g-font-heading {
        margin-bottom: 50px;
    }
    .rank-card {
        flex-direction: column;
    }
    .rank1-img-placeholder {
        width: 100%;
        aspect-ratio: 827 / 467;
    }
    .rank-badge-circle img {
        width: 45px;
    }
    .rank-catch {
        font-size: 14px;
    }
    .rank-title {
        font-size: 18px;
    }
    .rank-row {
        margin-top: 20px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .p-recruit-ranking__logo-01 {
        right: 6px;
        width: 82px;
    }
    .p-recruit-ranking__logo-02 {
        right: 6px;
    }
    .features-title::before, .features-title::after {
        width: 30px;
        margin: 0 0px;
    }
    .features-title {
        font-size: 18px;
        margin: 0 auto 40px;
    }
    .features-grid {
        grid-template-columns: repeat(1, 1fr);
        gap: 40px;
    }
    .features {
        padding: 25px 5%;
    }
    .feature-list li {
        font-size: 14px;
    }
    .p-recruit-recruit .g-font-heading {
        margin: 55px auto 50px;
    }
    .p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td:first-child {
        font-size: 18px;
        width: 100%;
        padding: 15px 0 14px;
        padding-left: 30px;
    }
    .p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td:first-child::before {
        width: 30px;
        height: 18px;
        top: 21px;
    }
    .p-recruit-recruit .recruit_sec .recruit_box .recruit_detail table tr td:last-child {
        padding-left: 29px;
        font-size: 16px;
    }
}

.single_interview.-new * {
    font-family: "Zen Maru Gothic";
    box-sizing: border-box;
    transition: 0.6s;
}
.single_interview.-new .title {
    background-image: url(../img/logo_interview_2.svg);
    margin-left: 1.5vw;
    width: 70vw;
    height: auto;
    aspect-ratio: 994 / 159;
}
.single_interview .interview_contents {
    margin-top: 0 !important;
    width: 100% !important;
}
.l-single-interview__heading {
    background-image: url(../img/interview-back.png);
    background-size: cover;
    margin-top: 100px;
    padding: 75px 0;
    border-radius: 30px;
    position: relative;
}
.single_interview.-new .interview_contents .interview_top_img {
    border-radius: 20px;
    aspect-ratio: 808 / 456;
    width: 90%;
    height: auto;
    max-width: 808px;
}
.l-single-interview__data {
    border-radius: 14px;
    border: 2px solid #2BA703;
    background: #FFF;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    padding: 25px;
    position: relative;
    width: 90%;
    height: auto;
    max-width: 808px;
    margin: 0 auto;
    margin-top: -70px;
}
.interview_contents .l-single-interview__heading .p-recruit-interview__title {
    color: #393A3A;
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    display: -webkit-box !important;
    overflow: hidden;
    -webkit-line-clamp: unset;
    -webkit-box-orient: vertical;
    height: unset;
    font-family: "Zen Maru Gothic";
}
.single_interview.-new .interview_contents .p-recruit-interview__name {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0;
    font-family: "Zen Maru Gothic";
}
.l-single-interview__heading .l-section-2 {
    position: relative;
}

@media screen and (max-width: 960px) {
    .interview_contents .l-single-interview__heading.p-recruit-interview__title {
        font-size: 24px;
    }
    .l-single-interview__heading {
        margin: 75px 0 75px;
        padding: 40px 0;
    }
    .single_interview .interview_contents .interview-category {
        font-size: 14px;
    }
    .single_interview .interview_contents .interview-year {
        font-size: 14px;
    }
    .interview_contents .l-single-interview__heading .p-recruit-interview__title {
        font-size: 18px;
    }
}


.l-single-interview__reason {
    display: flex;
    margin-top: 60px;
    gap: 50px;
    align-items: flex-start;
}
.l-single-interview__reason-title {
    color: #393A3A;
    font-family: "Zen Maru Gothic";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%; /* 42px */
    flex-shrink: 0;
    position: relative;
    margin: 0;
    padding-left: 40px;
}
.l-single-interview__reason-title::before {
    content: "";
    display: block;
    width: 39px;
    height: 23.3px;
    background-image: url(../img/title_acce_recruit-green.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 12px;
}
.l-single-interview__qa {
    border-radius: 8px;
    background: #FBF8EB;
    padding: 18px 49px 49px;
    margin: 60px 0 100px;
}
.l-single-interview__qa-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.l-single-interview__qa-item {
    margin-top: 30px;
}
.l-single-interview__qa-field {
    display: flex;
    align-items: center;
    gap: 32px;
    margin-bottom: 32px;
}
.l-single-interview__qa-text {
    border-radius: 10px;
    border: 1px solid #2BA703;
    background: #FFF;
    padding: 20px;
    position: relative;
    color: #393A3A;
    font-family: "Zen Maru Gothic";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%; /* 28px */
}
.-answer .l-single-interview__qa-img {
    width: 106px;
    height: 106px;
    object-fit: cover;
    border-radius: 76px;
    border: 3px solid #2BA703;
    flex-shrink: 0;
}
.l-single-interview__qa-text:before {
    position: absolute;
    content: url(../img/interview_hukidasi.svg);
    bottom: -25px;
    left: 0;
}
.-answer .l-single-interview__qa-text:before {
    left: unset;
    right: 2px;
    transform: rotateY(180deg);
}

.l-single-interview__message {
    position: relative;
    border-radius: 14px;
    border: 2px solid #2BA703;
    background: #FFF;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
    padding: 20px 30px;
    display: flex;
    gap: 5%;
}
.l-single-interview__message-img {
    width: 45%;
    min-width: 300px;
    border-radius: 14px;
    aspect-ratio: 464/262;
    object-fit: cover;
}
.l-single-interview__message-content {
    width: 55%;
}
.l-single-interview__message-content .l-single-interview__reason-text {
    margin-top: 24px;
}

.recruit-btn {
    width: fit-content;
    display: flex;
    margin: 90px auto 0;
}
.recruit-btn .view_more_btn {
    border: #2BA703 1px solid;
}
.recruit-btn .view_more_btn p {
    text-align: left;
    color: var(--Font_Flatcolor, #393A3A);
    font-family: "Zen Maru Gothic";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 175%;
    padding-left: 24px;
    display: flex;
    align-items: center;
}
.recruit-btn .view_more_btn:hover {
    background: #2BA703;
}
.recruit-btn:hover .view_more_btn p {
    color: #fff;
}
.recruit-btn .view_more_btn p::after {
    background-image: url(../img/view_more_start-green.svg);
}

.single_interview .interview_archive {
    margin-top: 24px;
}

.p-recruit-interview.-interview {
    margin-top: 120px;
    margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
    .single_interview.-new .interview_contents .interview_top_img {
        width: 100%;
        border-radius: 15px;
        border: 2px solid #2BA703;
        background: #FFF;
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.16);
        border-bottom: none;
    }
    .l-single-interview__heading {
        padding-bottom: 120px;
        margin-bottom: 120px;
        border-radius: 15px;
    }
    .l-single-interview__data {
        width: 100%;
        margin-top: 0;
        position: absolute;
        padding: 10px 5%;
        border-radius: 15px;
        border: 2px solid #2BA703;
        bottom: -185px;
    }
    .interview_contents .l-single-interview__heading .p-recruit-interview__title {
    margin-bottom: 5px;
    }
    .l-single-interview__reason {
        flex-direction: column;
        gap: 20px;
        margin-top: 30px;
    }
    .l-single-interview__qa {
        padding: 10px 25px 25px;
        margin: 30px 0 60px;
    }
    .-question .l-single-interview__qa-img {
        width: 60px;
    }
    .l-single-interview__qa-text {
        padding: 15px;
        font-size: 14px;
    }
    .-question .l-single-interview__qa-text:before {
        transform: rotate(90deg);
        left: -24px;
        bottom: unset;
        top: 30px;
    }
    .l-single-interview__qa-field {
        align-items: flex-start;
    }
    .-answer .l-single-interview__qa-img {
        width: 60px;
        height: 60px;
    }
    .-answer .l-single-interview__qa-text:before {
        transform: rotateZ(-90deg) rotateY(180deg);
        right: -24px;
        bottom: unset;
        top: 30px;
    }
    .l-single-interview__message {
        flex-direction: column;
        gap: 30px;
        padding: 20px 5%;
    }
    .l-single-interview__message-content {
        width: 100%;
    }
    .l-single-interview__message-img {
        min-width: unset;
        width: 100%;
    }
    .l-single-interview__message-content {
        position: relative;
    }
    .l-single-interview__reason-title {
        font-size: 18px;
    }
    .l-single-interview__reason-title::before {
        width: 24px;
        height: 18px;
        top: 7px;
    }
    .l-single-interview__reason-text {
        font-size: 14px;
    }
    .l-single-interview__message-content .l-single-interview__reason-text {
        margin-top: 15px;
    }
    .p-recruit-interview.-interview {
        margin-top: 60px;
        margin-bottom: 60px;
    }
}

.l-cta-entry {
    overflow: hidden;
}
.l-cta-entry a {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    background-image: url(../img/entry-back.png);
    width: 100%;
    aspect-ratio: 1600/229;
    min-height: 229px;
    display: flex;
    align-items: center;
}
.l-cta-entry a:hover {
    background-image: url(../img/entry-back-hover.png);
}
.l-cta-entry__content {
    display: flex;
    align-items: center;
    max-width: 1300px;
    width: 94%;
    gap: 6%;
    margin: 0 auto;
}
.l-cta-entry__title {
    color: #FFF;
    font-family: "Zen Maru Gothic";
    font-size: 40px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    flex-shrink: 0;
    padding-left: 35px;
    position: relative;
}
.l-cta-entry__title::before {
    content: "";
    display: block;
    width: 39px;
    height: 23.3px;
    background-image: url(../img/title_acce_recruit-white.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 20px;
}
.l-cta-entry__text {
    color: #FFF;
    font-family: "Zen Maru Gothic";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 175%;
}
.l-cta-entry svg {
    margin-left: auto;
    flex-shrink: 0;
}
.l-cta-entry a:hover svg path {
    fill: #81D765;
}
.l-cta-entry__logo {
    position: absolute;
    left: 0;
    height: 95%;
    top: 50%;
    transform: translateY(-50%);
}
@media screen and (max-width: 960px) {
    .l-cta-entry svg {
        width: 70px;
    }
    .l-cta-entry__title {
        font-size: 30px;
    }
}

@media screen and (max-width: 768px) {
    .l-cta-entry svg {
        width: 60px;
    }
    .l-cta-entry a {
        aspect-ratio: auto;
    }
    .l-cta-entry__logo {
        height: auto;
        top: unset;
        transform: unset;
        width: 75%;
        bottom: 0;
    }
    .l-cta-entry__content {
        flex-direction: column;
        padding: 15px 0;
    }
    .l-cta-entry__title {
        font-size: 24px;
        padding-left: 30px;
    }
    .l-cta-entry__title::before {
        top: 11px;
        width: 29px;
        height: 19px;
    }
    .l-cta-entry__text {
        font-size: 14px;
        margin-top: 15px;
    }
}

.c-btn-sidebar {
    position: fixed;
    top: 175px;
    right: 0;
    padding: 12px 25px;
    display: flex;
    flex-direction: column;
    gap: 12.5px;
    border-radius: 15px 0 0 15px;
    background-image: url(../img/side-back.png);
    z-index: 1;
    align-items: center;
    gap: 6px;
    padding: 15px 15px 10px;
    transition: 0.6s;
}
.c-btn-sidebar p {
    color: #FFF;
    font-feature-settings: 'vert' on;
    font-family: "Zen Maru Gothic";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 28.8px */
    writing-mode: vertical-lr;
}
.c-btn-sidebar svg {
    width: 44px;
}
.c-btn-sidebar svg * {
    transition: 0.6s;
}
.c-btn-sidebar:hover {
    background-image: url(../img/side-back-hover.png);
}
.c-btn-sidebar:hover circle {
    stroke: #81D765;
}
.c-btn-sidebar:hover path {
    fill: #81D765;
}

@media screen and (max-width: 960px) {
    .c-btn-sidebar {
        padding: 10px 10px 5px;
    }
    .c-btn-sidebar p {
        font-size: 18px;
    }
    .c-btn-sidebar svg {
        width: 30px;
        height: 45px;
    }
}

@media screen and (max-width: 350px) {
    .p-recruit-works__head-text br {
        display: none;
    }
}