@charset "UTF-8";
/*
START MEDIA QUERY MANAGER

@media only screen and (min-width: 1800px){}
@media only screen and (min-width: 1550px){}
@media only screen and (min-width: 1200px){}
@media only screen and (min-width: 1025px){}
@media only screen and (min-width: 992px){}
@media only screen and (min-width: 768px){}
@media only screen and (min-width: 576px){}
@media only screen and (min-width: 421px){}
@media only screen and (min-width: 381px){}

@media only screen and (max-width: 1799px){}
@media only screen and (max-width: 1549px){}
@media only screen and (max-width: 1199px){}
@media only screen and (max-width: 1024px){}
@media only screen and (max-width: 991px){}
@media only screen and (max-width: 767px){}
@media only screen and (max-width: 575px){}
@media only screen and (max-width: 420px){}
@media only screen and (max-width: 380px){}

@media only screen and (min-width: 1549px) and (max-width: 1799px){}
@media only screen and (min-width: 1025px) and (max-width: 1300px){}
@media only screen and (min-width: 992px) and (max-width: 1199px){}
@media only screen and (min-width: 992px) and (max-width: 1024px){}
@media only screen and (min-width: 768px) and (max-width: 991px){}
@media only screen and (min-width: 576px) and (max-width: 767px){}

END MEDIA QUERY MANAGER
*/
/*====================================================================================
START TABLE OF CONTENT

1. START COMMON ONLY CHILD PAGE.
1.1 START LIST TITLE, TITLE CHILD PAGE.
1.2 START LIST HEADING, HEADING CHILD PAGE.
1.3 START LIST BUTTON, BUTTON CHILD PAGE.
1.4 START LIST, ITEM CHILD PAGE.
1.5 START LIBRARY GSAP CHILD PAGE.
1.6 START LIST SIDEBAR, SIDEBAR CHILD PAGE.
1.7 START LIST TABLE, TABLE CHILD PAGE.
1.8 START LIST MAP, MAP CHILD PAGE.
1.9 START LIST BOX, BOX CHILD PAGE.
1.10 START LIST CARD, CARD CHILD PAGE.
1.11 START LIST POSTS, POSTS CHILD PAGE.
1.12 START LIST POINT, POINT CHILD PAGE.
1.13 START LIST BLOCK, BLOCK CHILD PAGE.
1.14 START LIST GROUP, GROUP CHILD PAGE.
1.15 START LIST SECTION, SECTION CHILD PAGE.
1.16 START TOGGLE CHILD PAGE.
1.17 START LIST CIRCLE, CIRCLE CHILD PAGE.
1.18 START LIST STEP, STEP CHILD PAGE.
1.19 START LIST INTRODUCTION, INTRODUCTION CHILD PAGE.
1.20 START LIST BANNER, BANNER CHILD PAGE.
1.21 START LIST LINK, LINK CHILD PAGE.

2. START PAGE VISUAL SECTION.
3. START BREADCRUMB SECTION.
4. START INTERVIEW PAGE.
5. START RECRUITMENT PAGE.
6. START COMPANY PAGE.
7. START WORK PAGE.
8. START ABOUT PAGE.
9. START CAREER PAGE.

END TABLE OF CONTENT
====================================================================================*/
/*====================================================================================
1. START COMMON ONLY CHILD PAGE.
====================================================================================*/
@media only screen and (max-width: 767px) {
  #main {
    margin-top: 10rem;
  }
}
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1. END COMMON ONLY CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.1 START LIST TITLE, TITLE CHILD PAGE.
====================================================================================*/
/*---------- START TITLE PAGE ----------*/
.title-page {
  font-size: 3rem;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .title-page {
    font-size: 2.4rem;
  }
}
/*---------- END START TITLE PAGE ----------*/
/*---------- START TITLE MAIN ----------*/
.title-main {
  text-align: center;
}

.title-main__text {
  background: linear-gradient(0deg, var(--color-blue) 18%, transparent 18%);
}
.title-main__text strong {
  font-size: 4.8rem;
  font-weight: 700;
}
.title-main__text small {
  font-size: 3rem;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .title-main__text strong {
    font-size: 2.4rem;
  }
  .title-main__text small {
    font-size: 1.6rem;
  }
}
/*---------- END TITLE MAIN ----------*/
/*---------- START TITLE MAIN MD ----------*/
.title-main--md .title-main__text strong {
  font-size: 4rem;
}

@media only screen and (max-width: 767px) {
  .title-main--md .title-main__text strong {
    font-size: 2.4rem;
  }
}
/*---------- END TITLE MAIN MD ----------*/
/*---------- START TITLE GROUP ----------*/
.title-group {
  font-size: 3rem;
  font-weight: 500;
}
.title-group small {
  color: var(--color-black);
  font-size: 2.4rem;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .title-group {
    font-size: 2.3rem;
  }
  .title-group small {
    font-size: 1.8rem;
  }
}
/*---------- END TITLE GROUP ----------*/
/*---------- START TITLE GROUP DARK BLUE ----------*/
.title-group--dark-blue {
  color: var(--color-dark-blue);
}

/*---------- END TITLE GROUP DARK BLUE ----------*/
/*---------- START TITLE GROUP BLUE ----------*/
.title-group--blue {
  color: var(--color-blue);
}

/*---------- END TITLE GROUP BLUE ----------*/
/*---------- START TITLE SECTION ----------*/
.title-section {
  text-align: center;
}

.title-section__text {
  font-size: 2.4rem;
  font-weight: 500;
  background: linear-gradient(0deg, #d3e9f1 18%, transparent 18%);
}

@media only screen and (max-width: 767px) {
  .title-section__text {
    font-size: 2rem;
  }
}
/*---------- END TITLE SECTION ----------*/
/*---------- START TITLE PART ----------*/
.title-part {
  position: relative;
  display: block;
  padding-left: 2.5rem;
  font-size: 2rem;
  font-weight: 500;
}
.title-part::before {
  position: absolute;
  content: "";
  top: 0.7rem;
  left: 0;
  width: 0;
  height: 0;
  border-left: 1rem solid transparent;
  border-right: 1rem solid transparent;
  border-top: 1.7rem solid currentColor;
}

@media only screen and (max-width: 767px) {
  .title-part {
    padding-left: 2.2rem;
    font-size: 1.8rem;
  }
  .title-part::before {
    border-left: 0.8rem solid transparent;
    border-right: 0.8rem solid transparent;
    border-top: 1.4rem solid currentColor;
  }
}
/*---------- END TITLE PART ----------*/
/*---------- START TITLE ABOUT ----------*/
.title-about span {
  color: var(--color-blue);
  font-weight: 500;
}

.title-about__num {
  font-size: 8rem;
  line-height: 1;
  font-family: var(--font-jost);
}

.title-about__text {
  font-size: 3.6rem;
}

@media only screen and (max-width: 767px) {
  .title-about__num {
    font-size: 5rem;
  }
  .title-about__text {
    font-size: 2rem;
  }
}
@media only screen and (max-width: 360px) {
  .title-about__num {
    font-size: 4rem;
  }
  .title-about__text {
    font-size: 1.4rem;
  }
}
/*---------- END TITLE ABOUT ----------*/
/*---------- START TITLE SQUARE ----------*/
.title-square {
  position: relative;
  padding-left: 2.3rem;
  color: var(--color-blue-third);
  font-size: 1.8rem;
  font-weight: 500;
}
.title-square::before {
  position: absolute;
  content: "";
  top: 0.7rem;
  left: 0;
  width: 1.5rem;
  height: 1.5rem;
  background-color: var(--color-blue-third);
}

@media only screen and (max-width: 767px) {
  .title-square {
    padding-left: 2.1rem;
    font-size: 1.6rem;
  }
  .title-square::before {
    top: 0.6rem;
    width: 1.4rem;
    height: 1.4rem;
  }
}
/*---------- END TITLE SQUARE ----------*/
/*---------- START TITLE LINE ----------*/
.title-line {
  text-align: center;
}

.title-line__text {
  position: relative;
  display: inline-block;
  padding: 0 7rem;
  font-size: 2.4rem;
  font-weight: 500;
}
.title-line__text::before, .title-line__text::after {
  position: absolute;
  content: "";
  top: 50%;
  height: 1px;
  width: 4.4rem;
  background-color: currentColor;
}
.title-line__text::before {
  left: 0;
}
.title-line__text::after {
  right: 0;
}

@media only screen and (max-width: 767px) {
  .title-line__text {
    padding: 0 4rem;
    font-size: 2rem;
  }
  .title-line__text::before, .title-line__text::after {
    width: 3rem;
  }
}
/*---------- END TITLE LINE ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.1 END LIST TITLE, TITLE CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.2 START LIST HEADING, HEADING CHILD PAGE.
====================================================================================*/
/*---------- START HEADING BLOCK ----------*/
.heading-block {
  position: relative;
}
.heading-block::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #b0b0b0;
}

.heading-block__title {
  position: relative;
  display: inline-block;
  padding: 0 2rem 0 5rem;
  font-size: 1.8rem;
  font-weight: 700;
}
.heading-block__title::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 3.5rem;
  height: 2.8rem;
  background-image: url("./../common_img/icon-book-yellow.png");
  background-image: -webkit-image-set(url("./../common_img/icon-book-yellow.png") 1x, url("./../common_img/icon-book-yellow@2x.png") 2x);
  background-image: image-set(url("./../common_img/icon-book-yellow.png") 1x, url("./../common_img/icon-book-yellow@2x.png") 2x);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}

/*---------- END HEADING BLOCK ----------*/
/*---------- START HEADING BLOCK WHITE ----------*/
.heading-block--white .heading-block__title {
  background-color: var(--color-white);
}

/*---------- END HEADING BLOCK WHITE ----------*/
/*---------- START HEADING BLOCK GRAY ----------*/
.heading-block--gray .heading-block__title {
  background-color: var(--color-blue-gray-fifth);
}

/*---------- END HEADING BLOCK GRAY ----------*/
/*---------- START HEADING ABOUT ----------*/
.heading-about__wrap {
  display: inline-block;
  padding: 0.7rem 2rem;
  border-radius: 0.5rem;
  background-color: var(--color-blue);
}

.heading-about__title {
  color: var(--color-white);
  font-size: 2rem;
  font-weight: 700;
}

@media only screen and (max-width: 767px) {
  .heading-about__wrap {
    padding: 0.5rem 2rem;
  }
  .heading-about__text {
    font-size: 1.8rem;
  }
}
/*---------- END HEADING ABOUT ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.2 END LIST HEADING, HEADING CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.3 START LIST BUTTON, BUTTON CHILD PAGE.
====================================================================================*/
/*---------- START ITEM RECRUIT ----------*/
.item-recruit {
  position: relative;
  padding: 2rem 17rem 2rem 3rem;
  text-decoration: none;
  background-color: var(--color-gray-sixth);
}

.item-recruit__title {
  font-size: 1.8rem;
  font-weight: 500;
}

@media only screen and (min-width: 768px) {
  .item-recruit {
    display: flex;
    align-items: center;
    min-height: 8rem;
  }
  .item-recruit .link-main {
    position: absolute;
    top: 50%;
    right: 3rem;
    transform: translateY(-50%);
  }
  .item-recruit:hover {
    background-color: var(--color-white);
    box-shadow: 0 0 1.2rem 0.4rem rgba(0, 0, 0, 0.1);
  }
  .item-recruit:hover .link-main {
    background-image: url("./../common_img/arrow-right-blue02.png");
    background-image: -webkit-image-set(url("./../common_img/arrow-right-blue02.png") 1x, url("./../common_img/arrow-right-blue02@2x.png") 2x);
    background-image: image-set(url("./../common_img/arrow-right-blue02.png") 1x, url("./../common_img/arrow-right-blue02@2x.png") 2x);
  }
  .item-recruit:hover .link-main__text {
    color: var(--color-blue);
  }
}
@media only screen and (max-width: 767px) {
  .item-recruit {
    display: block;
    padding: 1.5rem 2rem;
  }
  .item-recruit__title {
    font-size: 1.6rem;
  }
  .item-recruit__link {
    margin-top: 0.5rem;
    text-align: right;
  }
}
/*---------- END ITEM RECRUIT ----------*/
/*---------- START LIST RECRUIT ----------*/
.list-recruit .item-recruit {
  margin-bottom: 2rem;
}
.list-recruit .item-recruit:last-child {
  margin-bottom: 0;
}

@media only screen and (max-width: 767px) {
  .list-recruit .item-recruit {
    margin-bottom: 1.5rem;
  }
}
/*---------- END LIST RECRUIT ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.3 END LIST BUTTON, BUTTON CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.4 START LIST, ITEM CHILD PAGE.
====================================================================================*/
/*---------- START LIST CHECK ----------*/
.list-check > li {
  position: relative;
  margin-top: 1.8rem;
  font-weight: 500;
  padding-left: 3.5rem;
}
.list-check > li::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 2.8rem;
  height: 2.8rem;
  background-image: url("./../common_img/icon-check-blue.png");
  background-image: -webkit-image-set(url("./../common_img/icon-check-blue.png") 1x, url("./../common_img/icon-check-blue@2x.png") 2x);
  background-image: image-set(url("./../common_img/icon-check-blue.png") 1x, url("./../common_img/icon-check-blue@2x.png") 2x);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.list-check > li:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .list-check > li {
    margin-top: 0.7rem;
    padding-left: 3rem;
  }
  .list-check > li::before {
    top: 0.1rem;
    width: 2.2rem;
    height: 2.2rem;
  }
}
/*---------- END LIST CHECK ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.4 END LIST, ITEM CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.5 START LIBRARY GSAP CHILD PAGE.
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.5 END LIBRARY GSAP CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.6 START LIST SIDEBAR, SIDEBAR CHILD PAGE.
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.6 END LIST SIDEBAR, SIDEBAR CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.7 START LIST TABLE, TABLE CHILD PAGE.
====================================================================================*/
/*---------- START TABLE ----------*/
.tbl table {
  width: 100%;
  table-layout: fixed;
  border-left: 1px solid var(--color-gray-seventh);
  border-right: 1px solid var(--color-gray-seventh);
}
.tbl table th,
.tbl table td {
  padding: 2.2rem 3.5rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--color-gray-seventh);
}
.tbl table th {
  font-size: 1.8rem;
  font-weight: 500;
  background-color: var(--color-blue-gray-fourth);
}
.tbl table td {
  font-size: 1.6rem;
  font-weight: 400;
}

@media only screen and (min-width: 768px) {
  .tbl table th {
    width: 33rem;
    border-top: 1px solid var(--color-gray-seventh);
  }
  .tbl table tr:first-child td {
    border-top: 1px solid var(--color-gray-seventh);
  }
}
@media only screen and (max-width: 767px) {
  .tbl table {
    border-top: 1px solid var(--color-gray-seventh);
  }
  .tbl table th,
  .tbl table td {
    display: block;
    min-height: 6rem;
    padding: 1.6rem 2rem;
  }
  .tbl table th {
    font-size: 1.6rem;
  }
  .tbl table td {
    font-size: 1.4rem;
  }
}
/*---------- END TABLE ----------*/
/*---------- START TABLE CAREER ----------*/
.tbl-career dl {
  display: flex;
  margin-top: 1rem;
}
.tbl-career dl:first-child {
  margin-top: 0;
}
.tbl-career dl dt {
  width: 10.5rem;
}
.tbl-career dl dd {
  flex: 1;
  min-width: 1px;
  text-align: right;
}

.tbl-career__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  color: var(--color-white);
  font-size: 1.6rem;
  font-weight: 500;
  text-align: center;
  border-radius: 0.5rem;
  background-color: #607b99;
}

.tbl-career__heading--lg {
  min-height: 3.6rem;
}

.tbl-career__text {
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 500;
}
.tbl-career__text small {
  font-size: 1.6rem;
}

.tbl-career__note {
  font-size: 1.4rem;
  line-height: 1;
}

.tbl-career__price {
  color: var(--color-blue-third);
  font-size: 3rem;
  line-height: 1;
  font-weight: 700;
}
.tbl-career__price small {
  font-size: 1.8rem;
}

.tbl-career__special {
  align-items: center;
}
.tbl-career__special .tbl-career__heading--lg {
  background-color: var(--color-blue-third);
}

/*---------- END TABLE CAREER ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.7 END LIST TABLE, TABLE CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.8 START LIST MAP, MAP CHILD PAGE.
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.8 END LIST MAP, MAP CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.9 START LIST BOX, BOX CHILD PAGE.
====================================================================================*/
/*---------- START BOX INFORMATION ----------*/
.box-info {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  flex-wrap: wrap;
  background: linear-gradient(0deg, var(--color-blue-second) 30%, transparent 30%);
}

.box-info__left {
  padding-bottom: 0rem;
}

.box-info__right {
  margin-left: 1.3rem;
}

.box-info__time,
.box-info__name {
  line-height: 1.5;
  font-weight: 400;
}

.box-info__time {
  font-size: 1.6rem;
}

.box-info__name {
  font-size: 2.4rem;
  line-height: 1.25;
}

@media only screen and (max-width: 767px) {
  .box-info {
    background: linear-gradient(0deg, var(--color-blue-second) 25%, transparent 25%);
  }
  .box-info__name {
    font-size: 2.2rem;
    line-height: 1.4;
  }
}
/*---------- END BOX INFORMATION ----------*/
/*---------- START BOX INFORMATION NO LINE ----------*/
.box-info--no-line {
  background: initial;
}
.box-info--no-line .box-info__time {
  color: var(--color-blue);
}

/*---------- END BOX INFORMATION NO LINE ----------*/
/*---------- START BOX TIME ----------*/
.box-time {
  display: flex;
  position: relative;
  padding-bottom: 3.2rem;
}
.box-time::before {
  position: absolute;
  content: "";
  top: 2rem;
  left: 9rem;
  width: 0.2rem;
  height: 100%;
  background-color: var(--color-blue);
}

.box-time__left {
  width: 9rem;
}

.box-time__right {
  flex: 1;
  min-width: 1px;
  padding-left: 3rem;
}

.box-time__num {
  position: relative;
  z-index: 3;
  padding-right: 2.2rem;
  font-size: 2rem;
  font-weight: 500;
  text-align: right;
  letter-spacing: 0.1em;
  font-family: var(--font-jost);
}
.box-time__num::before {
  position: absolute;
  content: "";
  top: 50%;
  right: -0.6rem;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  transform: translateY(-50%);
  background-color: var(--color-blue);
}

.box-time__title {
  margin-bottom: 0.5rem;
  font-size: 1.8rem;
  font-weight: 500;
}

.box-time__desc {
  line-height: 1.6;
}

.box-time--blue::before {
  background-color: var(--color-blue);
}
.box-time--blue .box-time__num {
  color: var(--color-blue);
}
.box-time--blue .box-time__num::before {
  background-color: var(--color-blue);
}
.box-time--blue .box-time__title {
  color: var(--color-blue);
}

.box-time--dark-blue::before {
  background-color: var(--color-dark-blue);
}
.box-time--dark-blue .box-time__num {
  color: var(--color-dark-blue);
}
.box-time--dark-blue .box-time__num::before {
  background-color: var(--color-dark-blue);
}
.box-time--dark-blue .box-time__title {
  color: var(--color-dark-blue);
}

.box-time:first-child::before {
  top: -2rem;
  height: calc(100% + 4rem);
}
.box-time:last-child {
  padding-bottom: 0;
}
.box-time:last-child::before {
  content: none;
}

.box-time--last-morning::before {
  background-color: var(--color-dark-blue);
}

.box-time--first-afternoon .box-time__num::before {
  right: -0.8rem;
  width: 1.5rem;
  height: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .box-time__right {
    padding-top: 0.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .box-time {
    padding-bottom: 2rem;
  }
  .box-time::before {
    left: 7.7rem;
  }
  .box-time__left {
    width: 7.7rem;
  }
  .box-time__right {
    padding-left: 2.2rem;
  }
  .box-time__num {
    padding-right: 1.7rem;
    font-size: 1.7rem;
  }
  .box-time__title {
    font-size: 1.7rem;
  }
  .box-time:first-child::before {
    top: -1rem;
    height: calc(100% + 2rem);
  }
}
/*---------- END BOX TIME ----------*/
/*---------- START LIST BOX TIME ----------*/
.list-box-time {
  max-width: 80rem;
  margin: 0 auto;
}

/*---------- END LIST BOX TIME ----------*/
/*---------- START BOX SIGN ----------*/
.box-sign {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.box-sign__job,
.box-sign__name {
  font-weight: 400;
  letter-spacing: 0.05em;
  font-family: var(--font-noto-serif-jp);
}

.box-sign__job {
  margin-right: 1.5rem;
  font-size: 1.8rem;
}

.box-sign__name {
  font-size: 2.4rem;
}

@media only screen and (max-width: 767px) {
  .box-sign__job {
    font-size: 1.6rem;
  }
  .box-sign__name {
    font-size: 2.2rem;
  }
}
/*---------- END BOX SIGN ----------*/
/*---------- START BOX CAREER ----------*/
.box-career {
  display: flex;
  margin-bottom: 5rem;
}
.box-career:last-child {
  margin-bottom: 0;
}

.box-career__left {
  width: 10rem;
}

.box-career__right {
  flex: 1;
  min-width: 1px;
  padding-left: 4rem;
}

.box-career__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 5rem;
  color: var(--color-white);
  text-align: center;
  border-radius: 1rem;
  background-color: var(--color-blue);
}

.box-career__year {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.5;
}

.box-career__title {
  margin-bottom: 0.5rem;
  color: var(--color-blue-third);
  font-size: 2rem;
  font-weight: 500;
}

.box-career__subtitle {
  margin-bottom: 0.5rem;
  font-size: 1.6rem;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .box-career {
    margin-bottom: 2.5rem;
  }
  .box-career__left {
    width: 8.5rem;
  }
  .box-career__right {
    padding-left: 2rem;
  }
  .box-career__heading {
    min-height: 3.6rem;
    border-radius: 0.6rem;
  }
  .box-career__year,
  .box-career__title {
    font-size: 1.8rem;
  }
  .box-career__subtitle {
    font-size: 1.4rem;
  }
}
/*---------- END BOX CAREER ----------*/
/*---------- START LIST BOX CAREER ----------*/
.list-box-career {
  position: relative;
  max-width: 85rem;
  margin: 0 auto;
}
.list-box-career::before, .list-box-career::after {
  position: absolute;
  content: "";
  z-index: -1;
}
.list-box-career::before {
  top: 0;
  left: 4.9rem;
  width: 0.2rem;
  height: calc(100% - 0.5rem);
  background-color: var(--color-blue);
}
.list-box-career::after {
  left: 4.6rem;
  bottom: 0;
  width: 0;
  height: 0;
  border-left: 0.4rem solid transparent;
  border-right: 0.4rem solid transparent;
  border-top: 0.7rem solid var(--color-blue);
}

@media only screen and (max-width: 767px) {
  .list-box-career::before {
    left: 3.9rem;
  }
  .list-box-career::after {
    left: 3.6rem;
  }
}
/*---------- END LIST BOX CAREER ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.9 END LIST BOX, BOX CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.10 START LIST CARD, CARD CHILD PAGE.
====================================================================================*/
/*---------- START CARD INTERVIEW ----------*/
.card-interview {
  display: block;
  text-decoration: none;
}

.card-interview__figure {
  position: relative;
  display: block;
  padding-top: 86%;
  border-radius: 1rem;
  overflow: hidden;
}
.card-interview__figure img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  transition: all 0.5s ease;
}

.card-interview__body {
  padding-top: 2.8rem;
}

.card-interview__desc {
  font-size: 2rem;
  line-height: 1.5;
}

.card-interview .box-info {
  margin-top: 2.7rem;
}

@media only screen and (min-width: 768px) {
  .card-interview__desc {
    background: linear-gradient(270deg, var(--color-black) 0%, var(--color-black) 50%, var(--color-blue) 50%, var(--color-blue) 100%);
    background-position: 100% 50%;
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: rgba(0, 0, 0, 0);
    animation: mouseOutHorizontalTextAction 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
  }
  .card-interview:hover .card-interview__figure img {
    transform: scale(1.06);
  }
  .card-interview:hover .card-interview__desc {
    animation: mouseOverHorizontalTextAction 0.5s cubic-bezier(0.39, 0.575, 0.565, 1) both;
  }
}
@media only screen and (max-width: 767px) {
  .card-interview__body {
    padding-top: 2rem;
  }
  .card-interview__desc {
    font-size: 1.7rem;
  }
  .card-interview .box-info {
    margin-top: 1.5rem;
  }
}
/*---------- END CARD INTERVIEW ----------*/
/*---------- START CARD WORK ----------*/
.card-work__head {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 7.5rem;
  background-color: #1a59aa;
}

.card-work__title {
  color: var(--color-white);
  line-height: 1.2;
  font-weight: 700;
}

.card-work__title--lg {
  font-size: 3.4rem;
}

.card-work__title--sm {
  font-size: 2.4rem;
}

.card-work__body {
  border: 1px solid #b0b0b0;
  border-top: 0;
}

.card-work__heading {
  display: flex;
  align-items: center;
  padding: 0.6rem;
}

.card-work__heading-left {
  flex: 1;
  min-width: 1px;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: normal;
}

.card-work__heading-right {
  width: 4rem;
}

.card-work__heading-logo {
  line-height: 0;
}

@media only screen and (max-width: 767px) {
  .card-work__title--lg {
    font-size: 2.5rem;
  }
  .card-work__title--sm {
    font-size: 1.8rem;
  }
  .card-work__heading-left {
    font-size: 0.75rem;
  }
}
/*---------- END CARD WORK ----------*/
/*---------- START LIST CARD WORK ----------*/
.list-card-work {
  display: grid;
  gap: 1rem;
}

@media only screen and (min-width: 576px) {
  .list-card-work {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 575px) {
  .list-card-work {
    gap: 0.7rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
/*---------- END LIST CARD WORK ----------*/
/*---------- START CARD ABOUT ----------*/
.card-about__figure {
  margin-bottom: 2rem;
}

.card-about__img img {
  width: 100%;
  border-radius: 0.5rem;
}

.card-about__title {
  margin-bottom: 1rem;
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}

/*---------- END CARD ABOUT ----------*/
/*---------- START LIST CARD ABOUT ----------*/
@media only screen and (min-width: 576px) {
  .list-card-about {
    display: grid;
    gap: 5rem 3rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 575px) {
  .list-card-about .card-about {
    margin-top: 3.5rem;
  }
  .list-card-about .card-about:first-child {
    margin-top: 0;
  }
}
/*---------- END LIST CARD ABOUT ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.10 END LIST CARD, CARD CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.11 START LIST POSTS, POSTS CHILD PAGE.
====================================================================================*/
/*---------- START POSTS INTERVIEW ----------*/
.posts-interview__heading {
  position: relative;
  margin-bottom: 3.5rem;
  padding-left: 8rem;
}
.posts-interview__heading::before {
  position: absolute;
  content: "";
  top: 1.15em;
  left: 0;
  width: 5.5rem;
  height: 1px;
  background-color: var(--color-white);
}

.posts-interview__title {
  font-size: 2.4rem;
  font-weight: 500;
}

.posts-interview__figure img {
  width: 100%;
  border-radius: 1rem;
}

@media only screen and (min-width: 768px) {
  .posts-interview__row {
    display: flex;
  }
  .posts-interview__left {
    width: 54rem;
    padding-right: 3.5rem;
  }
  .posts-interview__right {
    flex: 1;
    min-width: 1px;
    margin-top: -0.7rem;
  }
}
@media only screen and (max-width: 767px) {
  .posts-interview__heading {
    margin-bottom: 2.2rem;
    padding-left: 4.5rem;
  }
  .posts-interview__heading::before {
    width: 3.5rem;
  }
  .posts-interview__title {
    font-size: 1.8rem;
  }
  .posts-interview__left {
    margin-bottom: 2.2rem;
  }
}
/*---------- END POSTS INTERVIEW ----------*/
/*---------- START POSTS WORK ----------*/
.posts-work {
  display: flex;
}

@media only screen and (min-width: 768px) {
  .posts-work {
    display: flex;
  }
  .posts-work__left {
    width: 55%;
  }
  .posts-work__right {
    width: 45%;
  }
}
@media only screen and (max-width: 767px) {
  .posts-work {
    flex-direction: column-reverse;
  }
  .posts-work__left {
    margin-top: 2.5rem;
  }
}
/*---------- END POSTS WORK ----------*/
/*---------- START POSTS CAREER ----------*/
.posts-career__img img {
  width: 100%;
  border-radius: 0.5rem;
}

.posts-career__title {
  margin-bottom: 1.5rem;
  color: var(--color-blue-third);
  font-size: 2rem;
  font-weight: 500;
}

@media only screen and (min-width: 576px) {
  .posts-career {
    display: flex;
  }
  .posts-career__left {
    width: 26rem;
  }
  .posts-career__right {
    flex: 1;
    min-width: 1px;
    padding-left: 3rem;
  }
}
@media only screen and (max-width: 575px) {
  .posts-career__left {
    margin-bottom: 2.5rem;
  }
  .posts-career__title {
    margin-bottom: 1rem;
  }
}
/*---------- END POSTS CAREER ----------*/
/*---------- START LIST POSTS CAREER ----------*/
.list-posts-career .posts-career {
  margin-top: 4rem;
}
.list-posts-career .posts-career:first-child {
  margin-top: 0;
}

/*---------- END LIST POSTS CAREER ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.11 END LIST POSTS, POSTS CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.12 START LIST POINT, POINT CHILD PAGE.
====================================================================================*/
/*---------- START POINT WORK ----------*/
.point-work {
  display: flex;
}

.point-work__left {
  width: 6.5rem;
}

.point-work__right {
  flex: 1;
  min-width: 1px;
  margin-top: -0.5rem;
  padding-left: 3rem;
}

.point-work__tag {
  width: 100%;
  height: 6.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding-top: 0.2rem;
  border-radius: 0.5rem;
  background-color: var(--color-blue);
}
.point-work__tag span {
  display: block;
  width: 100%;
  color: var(--color-white);
  line-height: 1;
  font-weight: 500;
  text-align: center;
  font-family: var(--font-jost);
}

.point-work__tag-text {
  margin-bottom: 0.4rem;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
}

.point-work__tag-num {
  font-size: 2.2rem;
}

.point-work__title {
  color: var(--color-blue);
  font-size: 1.8rem;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .point-work__left {
    width: 5.5rem;
  }
  .point-work__right {
    padding-left: 1.5rem;
  }
  .point-work__tag {
    height: 5.5rem;
  }
  .point-work__tag-text {
    font-size: 1.1rem;
  }
  .point-work__tag-num {
    font-size: 2.1rem;
  }
  .point-work__title {
    margin-bottom: 0.5rem;
    font-size: 1.6rem;
  }
}
/*---------- END POINT WORK ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.12 END LIST POINT, POINT CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.13 START LIST BLOCK, BLOCK CHILD PAGE.
====================================================================================*/
/*---------- START BLOCK INTERVIEW ----------*/
.block-interview {
  display: flex;
}

.block-interview__title {
  font-size: 2.4rem;
  line-height: 2;
  font-weight: 500;
}

.block-interview .box-info {
  margin-top: 7rem;
}

.block-interview__figure img {
  -o-object-fit: cover;
  object-fit: cover;
  /* 画像の比率を維持しつつ、指定された幅と高さに収まるようにする */
  /* width: 100%; */
  border-radius: 1rem;
}

@media only screen and (min-width: 768px) {
  .block-interview {
    align-items: center;
  }
  .block-interview__left {
    flex: 1;
    min-width: 1px;
    padding-bottom: 15rem;
    padding-right: 4.5rem;
  }
  .block-interview__right {
    width: calc(50% - 3rem);
  }
}
@media only screen and (max-width: 767px) {
  .block-interview {
    flex-direction: column-reverse;
    padding-bottom: 4rem;
  }
  .block-interview__right {
    margin-bottom: 2rem;
  }
  .block-interview__title {
    font-size: 2rem;
    line-height: 1.6;
  }
  .block-interview .box-info {
    margin-top: 1.7rem;
  }
}
@media only screen and (min-width: 576px) {
  .block-interview__figure img {
    width: 500px;
    height: 650px;
  }
}
@media only screen and (max-width: 575px) {
  .block-interview__figure img {
    width: 100%;
    height: 120vw;
  }
}
/*---------- END BLOCK INTERVIEW ----------*/
/*---------- START BLOCK WORK ----------*/
.block-work__wrap {
  position: relative;
  max-width: 77rem;
  margin: 0 auto;
  border-bottom: 1px solid #b0b0b0;
}

.block-work__desc {
  padding: 1.5rem 0 2.5rem 0;
}

@media only screen and (max-width: 767px) {
  .block-work__desc {
    padding: 1rem 0 2rem 0;
  }
}
/*---------- END BLOCK WORK ----------*/
/*---------- START BLOCK CAREER ----------*/
.block-career__img img {
  width: 100%;
  border-radius: 1rem;
}

.block-career__title {
  margin-bottom: 0.2rem;
  color: var(--color-blue);
  font-size: 2.6rem;
  font-weight: 500;
  font-family: var(--font-jost);
}

@media only screen and (min-width: 768px) {
  .block-career {
    display: flex;
    align-items: center;
  }
  .block-career__left {
    width: 35rem;
  }
  .block-career__right {
    flex: 1;
    min-width: 1px;
    padding-left: 3rem;
  }
}
@media only screen and (max-width: 767px) {
  .block-career__left {
    margin-bottom: 2rem;
  }
  .block-career__title {
    font-size: 2.4rem;
  }
}
/*---------- END BLOCK CAREER ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.13 END LIST BLOCK, BLOCK CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.14 START LIST GROUP, GROUP CHILD PAGE.
====================================================================================*/
/*---------- START GROUP RECRUIT ----------*/
.group-recruit .title-group {
  margin-bottom: 3.5rem;
}

@media only screen and (max-width: 767px) {
  .group-recruit .title-group {
    margin-bottom: 2.5rem;
  }
}
/*---------- END GROUP RECRUIT ----------*/
/*---------- START GROUP COMPANY ----------*/
.group-company__head {
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-gray-seventh);
}

.group-company__title {
  font-size: 2.4rem;
  font-weight: 500;
}
.group-company__title small {
  font-size: 1.8rem;
}

.group-company__body {
  padding-top: 2rem;
}

.group-company__map {
  display: flex;
  height: 40rem;
  margin-top: 2.5rem;
}
.group-company__map iframe {
  width: 100%;
  height: 100%;
}

@media only screen and (min-width: 768px) {
  .group-company {
    width: calc(50% - 3.5rem);
  }
  .group-company--full-width {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .group-company__title {
    font-size: 2rem;
  }
  .group-company__title small {
    font-size: 1.6rem;
  }
  .group-company__map {
    height: 70vw;
    max-height: 35rem;
  }
}
/*---------- END GROUP COMPANY ----------*/
/*---------- START GROUP WORK ----------*/
.group-work__wrap {
  margin: 0 auto;
  padding: 5rem 5rem 6rem 5rem;
  border-radius: 3rem;
  background-color: var(--color-white);
}

.group-work__points .point-work {
  margin-top: 3.5rem;
}
.group-work__points .point-work:first-child {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .group-work__row {
    display: flex;
    align-items: flex-end;
  }
  .group-work__left {
    flex: 1;
    min-width: 1px;
    padding-right: 3rem;
  }
  .group-work__right {
    width: 27.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .group-work__wrap {
    padding: 3rem 2rem;
  }
  .group-work__right {
    margin-top: 2.5rem;
    text-align: center;
  }
  .group-work__points .point-work {
    margin-top: 2rem;
  }
}
/*---------- END GROUP WORK ----------*/
/*---------- START GROUP ABOUT ----------*/
.group-about {
  padding: 6rem;
  border-radius: 3rem;
  background-color: var(--color-white);
}

.group-about__item {
  margin-top: 2.7rem;
}
.group-about__item:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .group-about {
    padding: 3rem 2rem;
    border-radius: 1.5rem;
  }
  .group-about__item {
    margin-top: 2rem;
  }
}
/*---------- END GROUP ABOUT ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.14 END LIST GROUP, GROUP CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.15 START LIST SECTION, SECTION CHILD PAGE.
====================================================================================*/
/*---------- START SECTION ANCHOR ----------*/
.stn-anchor__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.stn-anchor__item {
  padding: 0.25rem 6rem 0.25rem 6rem;
  text-align: center;
}
.stn-anchor__item:first-child {
  border-left: 0;
}

@media only screen and (min-width: 768px) {
  .stn-anchor__item {
    border-left: 1px solid var(--color-gray-seventh);
  }
  .stn-anchor__item:first-child {
    padding-left: 0;
  }
  .stn-anchor__item:last-child {
    padding-right: 0;
  }
}
@media only screen and (min-width: 576px) {
  .stn-anchor__item {
    border-left: 1px solid var(--color-gray-seventh);
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .stn-anchor__item {
    width: 50%;
  }
  .stn-anchor__item:first-child, .stn-anchor__item:nth-child(2) {
    border-top: 0;
  }
  .stn-anchor__item:nth-child(odd) {
    border-left: 0;
    padding-right: 1rem;
  }
  .stn-anchor__item:nth-child(even) {
    padding-left: 1rem;
  }
  .stn-anchor--four-col .stn-anchor__item:nth-last-child(2) {
    border-bottom: 0;
  }
}
@media only screen and (max-width: 767px) {
  .stn-anchor__item {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--color-gray-seventh);
  }
  .stn-anchor__item:last-child {
    border-bottom: 0;
  }
}
@media only screen and (max-width: 575px) {
  .stn-anchor__item {
    width: 100%;
  }
  .stn-anchor__item:first-child {
    padding-top: 0;
  }
  .stn-anchor__item:last-child {
    padding-bottom: 0;
  }
}
/*---------- END SECTION ANCHOR ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.15 END LIST SECTION, SECTION CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.16 START TOGGLE CHILD PAGE.
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.16 END TOGGLE CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.17 START LIST CIRCLE, CIRCLE CHILD PAGE.
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.17 END LIST CIRCLE, CIRCLE CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.18 START LIST STEP, STEP CHILD PAGE.
====================================================================================*/
/*---------- START STEP WORK ----------*/
.step-work {
  display: block;
  border-radius: 1rem;
  padding: 3rem 2.5rem;
  background-color: var(--color-white);
}

.step-work__box {
  display: flex;
  align-items: center;
}

.step-work__tag span {
  display: block;
  color: var(--color-blue);
  font-size: 1.8rem;
  line-height: 1;
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.05em;
  font-family: var(--font-jost);
}

.step-work__tag-text {
  margin-bottom: 0.6rem;
}

.step-work__title {
  margin-bottom: 0.6rem;
  font-size: 1.8rem;
  font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .step-work__row {
    display: flex;
    align-items: center;
  }
  .step-work__left {
    width: 15rem;
  }
  .step-work__right {
    flex: 1;
    min-width: 1px;
    padding-left: 4rem;
  }
  .step-work__box-left {
    flex: 1;
    min-width: 1px;
  }
  .step-work__box-right {
    width: 5.2rem;
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .step-work {
    padding: 3rem 2rem;
  }
  .step-work__left {
    margin-bottom: 1.5rem;
  }
  .step-work__box-left {
    margin-right: 1.5rem;
  }
  .step-work__box-right {
    display: flex;
    align-items: center;
  }
  .step-work__box-icon {
    margin-right: 1.5rem;
  }
}
/*---------- END STEP WORK ----------*/
/*---------- START LIST STEP WORK ----------*/
.list-step-work .step-work {
  margin-top: 1rem;
}
.list-step-work .step-work:first-child {
  margin-top: 0;
}

/*---------- END LIST STEP WORK ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.18 END LIST STEP, STEP CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.19 START LIST INTRODUCTION, INTRODUCTION CHILD PAGE.
====================================================================================*/
/*---------- START INTRODUCTION INTERVIEW SECTION ----------*/
.intro-interview__body {
  padding-top: 6.5rem;
  color: var(--color-white);
  /* background-color: var(--color-blue); */
  background-color: #54C0EE;
}

.intro-interview__posts .posts-interview {
  margin-top: 6.5rem;
}
.intro-interview__posts .posts-interview:first-child {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .intro-interview__head {
    position: relative;
  }
  .intro-interview__head::before {
    position: absolute;
    content: "";
    z-index: -1;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 15rem;
    /* background-color: var(--color-blue); */
    background-color: #54C0EE;
  }
}
@media only screen and (max-width: 767px) {
  .intro-interview__body {
    padding-top: 5.5rem;
  }
  .intro-interview__posts .posts-interview {
    margin-top: 4rem;
  }
}
/*---------- END INTRODUCTION INTERVIEW SECTION ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.19 END LIST INTRODUCTION, INTRODUCTION CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.20 START LIST BANNER, BANNER CHILD PAGE.
====================================================================================*/
/*---------- START BANNER INTERVIEW ----------*/
.bnr-interview {
  padding: 6rem;
  background-color: var(--color-gray-fifth);
}

.bnr-interview__figure img {
  width: 100%;
  border-radius: 1rem;
}

.bnr-interview__title {
  margin-bottom: 1.5rem;
  color: var(--color-blue);
  font-size: 2.4rem;
  font-weight: 500;
}

@media only screen and (min-width: 768px) {
  .bnr-interview {
    display: flex;
  }
  .bnr-interview__left {
    width: 29rem;
    padding-right: 3rem;
  }
  .bnr-interview__right {
    flex: 1;
    min-width: 1px;
    margin-top: -1rem;
  }
}
@media only screen and (max-width: 767px) {
  .bnr-interview {
    padding: 3.5rem 2rem;
  }
  .bnr-interview__left {
    margin-bottom: 1.5rem;
  }
  .bnr-interview__title {
    margin-bottom: 1rem;
    font-size: 2.2rem;
  }
}
/*---------- END BANNER INTERVIEW ----------*/
/*---------- START BANNER CAREER ----------*/
.bnr-career {
  padding: 3.5rem;
  border-radius: 1rem;
  background-color: #f7f7f7;
}

.bnr-career__box {
  padding: 2rem;
  text-align: center;
  border-radius: 1rem;
  background-color: var(--color-white);
}

.bnr-career__box-img {
  margin-bottom: 1.2rem;
}

.bnr-career__box-text,
.bnr-career__box-title {
  line-height: 1.2;
  font-weight: 500;
}

.bnr-career__box-text {
  font-size: 1.6rem;
}

.bnr-career__box-title {
  font-size: 1.8rem;
}

@media only screen and (min-width: 768px) {
  .bnr-career {
    display: flex;
  }
  .bnr-career__left {
    width: 17.5rem;
  }
  .bnr-career__right {
    flex: 1;
    min-width: 1px;
    padding-left: 2.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .bnr-career {
    padding: 2rem;
  }
  .bnr-career__left {
    margin-bottom: 2.5rem;
  }
  .bnr-career__box-text,
  .bnr-career__box-title {
    line-height: 1.5;
  }
}
/*---------- END BANNER CAREER ----------*/
/*---------- START LIST BANNER CAREER ----------*/
@media only screen and (min-width: 576px) {
  .list-banner-career {
    display: grid;
    gap: 4rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 575px) {
  .list-banner-career .bnr-career {
    margin-top: 3rem;
  }
  .list-banner-career .bnr-career:first-child {
    margin-top: 0;
  }
}
/*---------- END LIST BANNER CAREER ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.20 END LIST BANNER, BANNER CHILD PAGE.
====================================================================================*/
/*====================================================================================
1.21 START LIST LINK, LINK CHILD PAGE.
====================================================================================*/
/*---------- START LINK ANCHOR ----------*/
.link-anchor {
  text-decoration: none;
  transition: color 0.3s ease;
}

.link-anchor__text {
  font-size: 1.6rem;
  font-weight: 400;
}

@media only screen and (min-width: 768px) {
  .link-anchor:hover {
    color: var(--color-blue);
  }
}
@media only screen and (max-width: 767px) {
  .link-anchor__text {
    font-size: 1.4rem;
  }
}
/*---------- END LINK ANCHOR ----------*/
/*---------- START LINK ANCHOR BLUE ----------*/
.link-anchor--blue {
  color: var(--color-blue);
}

/*---------- END LINK ANCHOR BLUE ----------*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
1.21 END LIST LINK, LINK CHILD PAGE.
====================================================================================*/
/*====================================================================================
2. START PAGE VISUAL SECTION.
====================================================================================*/
/*---------- START TITLE PAGE VISUAL ----------*/
.title-pv > span {
  display: block;
  /* text-shadow: var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem, var(--color-white) 0 0 0.3rem; */
}

.title-pv__en {
  margin-bottom: 0.5rem;
  color: var(--color-blue);
  font-size: 7.2rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0.2em;
  font-family: var(--font-jost);
}

.title-pv__ja {
  font-size: 2.4rem;
  line-height: 1.6;
  font-weight: 500;
  color: #fff;
  text-shadow: 0 3px 6px #000;
}

@media only screen and (max-width: 767px) {
  .title-pv__en {
    margin-bottom: 0.2rem;
    font-size: 3rem;
  }
  .title-pv__ja {
    font-size: 1.6rem;
  }
}
#p-interview .title-pv__en,
#p-company .title-pv__en {
  color: #ffffff;
  text-shadow: 0 3px 20px #000;
}

/*---------- END TITLE PAGE VISUAL ----------*/
/*---------- START TITLE PAGE VISUAL WHITE ----------*/
.title-pv--white .title-pv__en {
  color: #ffffff;
  text-shadow: 0 3px 20px #000;
}

/*---------- END TITLE PAGE VISUAL WHITE ----------*/
/*---------- START PAGE VISUAL ----------*/
.pv {
  position: relative;
}

.pv__img img {
  width: 100%;
  height: 60rem;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center center;
  object-position: center center;
}

.pv__wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.pv .container-sm {
  height: 100%;
}

.pv__row {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}

@media only screen and (min-width: 768px) {
  .pv {
    padding-top: 10rem;
  }
  .pv__row {
    padding-top: 10rem;
  }
}
@media only screen and (max-width: 767px) {
  .pv__img img {
    height: 60vw;
    min-height: 20rem;
  }
}
/*---------- END PAGE VISUAL ----------*/
/*====================================================================================
2. END PAGE VISUAL SECTION.
====================================================================================*/
/*====================================================================================
3. START BREADCRUMB SECTION.
====================================================================================*/
.breadcrumb {
  padding: 1rem 0;
}

.breadcrumb__list {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.breadcrumb__item {
  position: relative;
  margin-right: 3rem;
  padding-right: 3.6rem;
  color: var(--color-gray-second);
  font-size: 1.6rem;
  line-height: 1.6;
  font-weight: 500;
  letter-spacing: 0.05em;
  font-family: var(--font-jost);
}
.breadcrumb__item:last-child {
  margin-right: 0;
  padding-right: 0;
  color: var(--color-blue);
}
.breadcrumb__item:last-child::before {
  content: none;
}
.breadcrumb__item::before {
  position: absolute;
  display: inline-block;
  content: "";
  top: 0.6rem;
  right: 0;
  width: 0.8rem;
  height: 1.4rem;
  background-image: url("./../common_img/arrow-right-gray03.png");
  background-image: -webkit-image-set(url("./../common_img/arrow-right-gray03.png") 1x, url("./../common_img/arrow-right-gray03@2x.png") 2x);
  background-image: image-set(url("./../common_img/arrow-right-gray03.png") 1x, url("./../common_img/arrow-right-gray03@2x.png") 2x);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.breadcrumb__item a {
  text-decoration: none;
}
.breadcrumb__item a:hover {
  color: var(--color-blue);
}

@media only screen and (max-width: 767px) {
  .breadcrumb {
    display: none;
  }
}
/*====================================================================================
3. END BREADCRUMB SECTION.
====================================================================================*/
/*====================================================================================
4. START INTERVIEW PAGE.
====================================================================================*/
/*---------- START SECTION INTERVIEW ----------*/
.stn-interview__title {
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .stn-interview__cards {
    gap: 6rem 4.5rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 576px) {
  .stn-interview__cards {
    display: grid;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .stn-interview__cards {
    display: grid;
    gap: 4.5rem 3rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 575px) {
  .stn-interview__cards .card-interview {
    margin-top: 5rem;
  }
  .stn-interview__cards .card-interview:first-child {
    margin-top: 0;
  }
}
/*---------- END SECTION INTERVIEW ----------*/
/*---------- START PAGINATION PAGE ----------*/
.pagination-page__wrap {
  max-width: 25rem;
  margin: 0 auto;
}

/*---------- END PAGINATION PAGE ----------*/
/*====================================================================================
4. END INTERVIEW PAGE.
====================================================================================*/
/*====================================================================================
5. START RECRUITMENT PAGE.
====================================================================================*/
/*---------- START SECTION RECRUIT ----------*/
.stn-recruit__text {
  margin-bottom: 5rem;
}

@media only screen and (max-width: 767px) {
  .stn-recruit__text {
    margin-bottom: 2.5rem;
  }
}
/*---------- END SECTION RECRUIT ----------*/
/*====================================================================================
5. END RECRUITMENT PAGE.
====================================================================================*/
/*====================================================================================
6. START COMPANY PAGE.
====================================================================================*/
/*---------- START COMPANY MESSAGE SECTION ----------*/
.company-message__row {
  display: flex;
}

.company-message__title {
  margin-bottom: 4rem;
  font-size: 2.4rem;
  font-weight: 600;
  font-family: var(--font-noto-serif-jp);
}

.company-message__desc {
  font-weight: 400;
  font-family: var(--font-noto-serif-jp);
}

.company-message .box-sign {
  margin-top: 6rem;
}

@media only screen and (min-width: 768px) {
  .company-message__left {
    flex: 1;
    min-width: 1px;
    padding-right: 5rem;
  }
  .company-message__right {
    width: 42.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .company-message__row {
    flex-direction: column-reverse;
  }
  .company-message__right {
    margin-bottom: 3rem;
  }
  .company-message__img {
    width: 65vw;
    max-width: 35rem;
    margin: 0 auto;
  }
  .company-message__title {
    margin-bottom: 2rem;
    font-size: 2rem;
  }
  .company-message .box-sign {
    margin-top: 2rem;
  }
}
/*---------- END COMPANY MESSAGE SECTION ----------*/
/*---------- START COMPANY PHILOSOPHY SECTION ----------*/
.company-philosophy {
  position: relative;
}

.company-philosophy__img {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.company-philosophy__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.company-philosophy__wrap {
  position: relative;
}

.company-philosophy__body {
  max-width: 77.5rem;
  height: 100%;
  margin: 0 auto;
  padding: 0 1rem;
  text-align: center;
  background: rgba(255, 255, 255, 0.95);
}

.company-philosophy__subtitle {
  margin-bottom: 4.2rem;
  font-size: 2.4rem;
  font-weight: 500;
}

.company-philosophy__desc {
  padding: 0 2rem;
  line-height: 2.5;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .company-philosophy__subtitle {
    margin-bottom: 2rem;
    font-size: 1.9rem;
  }
  .company-philosophy__desc {
    line-height: 2.2;
  }
}
/*---------- END COMPANY PHILOSOPHY SECTION ----------*/
/*---------- START COMPANY ACCESS SECTION ----------*/
.company-access__groups .group-company {
  margin-top: 5rem;
}
.company-access__groups .group-company:first-child {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .company-access__groups {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 767px) {
  .company-access__groups .group-company {
    margin-top: 3rem;
  }
}
/*---------- END COMPANY ACCESS SECTION ----------*/
/*====================================================================================
6. END COMPANY PAGE.
====================================================================================*/
/*====================================================================================
7. START WORK PAGE.
====================================================================================*/
/*---------- START INTRODUCTION WORK SECTION ----------*/
.intro-work .container {
  max-width: 80rem;
}

.intro-work__desc {
  margin-bottom: 3rem;
  text-align: center;
}

.intro-work__text {
  margin-bottom: 3rem;
  font-weight: 500;
}

.intro-work__row {
  display: flex;
}

.intro-work__body {
  position: relative;
}
.intro-work__body::before {
  position: absolute;
  content: "";
  top: -1px;
  left: 50%;
  width: 0;
  height: 0;
  border-left: 2.2rem solid transparent;
  border-right: 2.2rem solid transparent;
  border-top: 2.5rem solid var(--color-blue-gray-fifth);
  transform: translateX(-50%);
}

.intro-work__subtitle {
  font-size: 2.4rem;
  line-height: 1.85;
  font-weight: 500;
  text-align: center;
}
.intro-work__subtitle strong {
  color: var(--color-blue);
  font-size: 3rem;
  font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .intro-work__left {
    flex: 1;
    min-width: 1px;
  }
  .intro-work__right {
    width: 23rem;
    text-align: right;
  }
}
@media only screen and (max-width: 767px) {
  .intro-work__desc {
    margin-bottom: 1.5rem;
  }
  .intro-work__text {
    margin-bottom: 2.5rem;
  }
  .intro-work__row {
    flex-direction: column-reverse;
  }
  .intro-work__right {
    margin-bottom: 2.5rem;
    text-align: center;
  }
  .intro-work__subtitle {
    font-size: 1.7rem;
    line-height: 1.6;
  }
  .intro-work__subtitle strong {
    font-size: 2.3rem;
  }
}
/*---------- END INTRODUCTION WORK SECTION ----------*/
/*---------- START WORK PERSON SECTION ----------*/
.work-person .container {
  max-width: 101.5rem;
}

.work-person__desc,
.chart-work {
  text-align: center;
}

/*---------- END WORK PERSON SECTION ----------*/
/*---------- START CHART WORK ----------*/
.chart-work__wrap {
  position: relative;
  display: inline-block;
  text-align: right;
  padding-top: 5rem;
}

.chart-work__figure {
  position: relative;
}
.chart-work__figure figcaption {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}
.chart-work__figure figcaption h3 {
  color: var(--color-white);
  font-size: 2.4rem;
  font-weight: 700;
  text-align: center;
}

.chart-work__box {
  position: absolute;
  font-weight: 500;
}

.chart-work__box-text {
  font-size: 2.4rem;
}

.chart-work__box-num {
  font-size: 5rem;
  line-height: 1;
  font-family: var(--font-jost);
}
.chart-work__box-num small {
  font-size: 3.6rem;
}

.chart-work__box01 {
  top: -0.5rem;
  left: 0rem;
  display: flex;
  align-items: flex-end;
  color: #99cddd;
}
.chart-work__box01 .chart-work__box-num {
  margin-left: 0.6rem;
}

.chart-work__box02 {
  top: 25%;
  right: -10.5rem;
  color: #2178bf;
  text-align: left;
}

.chart-work__box03 {
  left: -20rem;
  bottom: 3.5rem;
  color: #0a9bd2;
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .chart-work__wrap {
    padding: 3rem 6rem 1.5rem 10rem;
  }
  .chart-work__figure figcaption h3 {
    font-size: 2rem;
  }
  .chart-work__box-text {
    font-size: 1.4rem;
  }
  .chart-work__box-num {
    font-size: 2.6rem;
  }
  .chart-work__box-num small {
    font-size: 2rem;
  }
  .chart-work__box01 {
    top: 0;
    left: 28%;
  }
  .chart-work__box02 {
    top: 50%;
    right: 0;
  }
  .chart-work__box03 {
    left: 0;
    bottom: 0;
  }
}
/*---------- END CHART WORK ----------*/
/*---------- START POSTER WORK ----------*/
.poster-work__row {
  display: flex;
  align-items: center;
  border: 1px solid var(--color-black);
}

.poster-work__figure {
  position: relative;
  flex: 1;
  min-width: 1px;
}
.poster-work__figure figcaption {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  color: var(--color-white);
  text-align: center;
  font-size: 2rem;
  line-height: 1.4;
  font-weight: 700;
}

.poster-work__body {
  width: 16.5rem;
  text-align: right;
  padding-right: 1.7rem;
}

@media only screen and (max-width: 767px) {
  .poster-work {
    max-width: 40rem;
  }
}
@media only screen and (max-width: 380px) {
  .poster-work__body {
    width: 13rem;
    padding: 0 1.5rem;
  }
}
/*---------- END POSTER WORK ----------*/
/*---------- START WORK ADS ----------*/
.work-ads .title-part {
  margin-bottom: 2.5rem;
}

.work-ads__subtitle {
  margin-top: 1.5rem;
  font-size: 1.8rem;
  font-weight: 500;
}

@media only screen and (min-width: 768px) {
  .work-ads__row {
    display: flex;
    align-items: flex-end;
  }
  .work-ads__left {
    width: 40rem;
  }
  .work-ads__right {
    flex: 1;
    min-width: 1px;
    padding-left: 6rem;
  }
}
@media only screen and (max-width: 767px) {
  .work-ads .title-part {
    margin-bottom: 2rem;
  }
  .work-ads__left {
    margin-bottom: 3rem;
  }
  .work-ads__subtitle {
    margin-top: 1.2rem;
    font-size: 1.6rem;
  }
}
/*---------- END WORK ADS ----------*/
/*---------- START WORK DIAGRAM ----------*/
.work-diagram .title-part {
  margin-bottom: 2.5rem;
}

.work-diagram__box-text {
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}

.work-diagram__box-title {
  margin-top: 1.5rem;
  font-size: 1.6rem;
  line-height: 1.8;
  font-weight: 500;
  text-align: center;
  letter-spacing: normal;
}

.work-diagram__box01,
.work-diagram__box02 {
  flex: 1;
  min-width: 1px;
  padding: 0 1.5rem;
}

.work-diagram__box03 {
  text-align: center;
}

.work-diagram__center {
  width: 100%;
  max-width: 35rem;
  padding: 3rem 1.5rem;
  border-radius: 3rem;
  border: 1px solid #d1d1d1;
  background-color: #f9f9f9;
}

.work-diagram__title {
  margin-bottom: 2rem;
  font-size: 2rem;
  font-weight: 500;
  text-align: center;
}

.work-diagram__list {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
}

.work-diagram__item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 10.5rem;
  font-size: 1.8rem;
  line-height: 1.8;
  font-weight: 500;
  text-align: center;
  border-radius: 50%;
  background-color: #cdf2fc;
}

.work-diagram__desc {
  margin-top: 3rem;
  text-align: center;
  font-size: 2rem;
  line-height: 2.8;
  font-weight: 500;
}
.work-diagram__desc span {
  position: relative;
  top: -1rem;
  display: inline-block;
  line-height: 0;
}
.work-diagram__desc span img {
  max-height: 3.4rem;
  width: auto;
}

@media only screen and (min-width: 768px) {
  .work-diagram__row {
    display: flex;
    align-items: center;
  }
  .work-diagram__left,
  .work-diagram__right {
    width: calc(50% - 17.5rem);
  }
  .work-diagram__group {
    display: flex;
    align-items: center;
    text-align: center;
  }
  .work-diagram__logo {
    width: 18.5rem;
  }
  .work-diagram__box03 {
    width: 22rem;
  }
}
@media only screen and (max-width: 767px) {
  .work-diagram__row {
    max-width: 35rem;
    margin: 0 auto;
  }
  .work-diagram__box-list {
    display: flex;
    justify-content: center;
  }
  .work-diagram__box-item {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
  }
  .work-diagram__box-item:first-child {
    order: 1;
  }
  .work-diagram__box-arrow {
    transform: scale(0.7);
  }
  .work-diagram__box-text {
    font-size: 1.6rem;
  }
  .work-diagram__logo {
    text-align: center;
  }
  .work-diagram__title {
    font-size: 1.8rem;
  }
  .work-diagram__item {
    font-size: 1.6rem;
  }
  .work-diagram__desc {
    margin-top: 2rem;
    font-size: 1.7rem;
    line-height: 2.2;
  }
  .work-diagram__desc span img {
    max-height: 2.7rem;
  }
}
/*---------- END WORK DIAGRAM ----------*/
/*---------- START WORK VALUE SECTION ----------*/
.work-value__row {
  display: flex;
  align-items: flex-end;
}

.work-value__figure {
  text-align: center;
}

.work-value__subtitle {
  margin-bottom: 2.5rem;
  font-size: 2rem;
  font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .work-value__left {
    flex: 1;
    min-width: 1px;
  }
  .work-value__right {
    width: 27.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .work-value__row {
    flex-direction: column-reverse;
  }
  .work-value__right {
    margin-bottom: 3rem;
    width: 100%;
  }
  .work-value__subtitle {
    margin-bottom: 2rem;
    font-size: 1.8rem;
    text-align: center;
  }
}
/*---------- END WORK VALUE SECTION ----------*/
/*====================================================================================
7. END WORK PAGE.
====================================================================================*/
/*====================================================================================
8. START ABOUT PAGE.
====================================================================================*/
/*---------- START ABOUT ----------*/
.about {
  position: relative;
  padding: 9rem 3rem 3rem 3rem;
  border-radius: 0.5rem;
  background-color: #eef2f4;
}
.about .heading-about {
  position: absolute;
  top: 3rem;
  left: 3rem;
}

.about__text {
  font-size: 1.8rem;
  line-height: 1.6;
  font-weight: 500;
}

.about__note {
  font-size: 1.6rem;
  font-weight: 400;
}

.about__plus {
  font-size: 6rem;
  line-height: 1;
  font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .about {
    min-height: 29.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .about {
    display: block;
    padding: 9rem 2rem 3rem 2rem;
  }
  .about .heading-about {
    top: 2rem;
    left: 2rem;
  }
  .about__text {
    font-size: 1.6rem;
  }
  .about__note {
    font-size: 1.4rem;
  }
  .about__plus {
    font-size: 3rem;
  }
}
@media only screen and (max-width: 360px) {
  .about {
    padding: 8.5rem 1.5rem 2.5rem 1.5rem;
  }
  .about .heading-about {
    top: 1.5rem;
    left: 1.5rem;
  }
  .about__note {
    font-size: 1.3rem;
  }
}
/*---------- END ABOUT ----------*/
/*---------- START ABOUT ONE ----------*/
.about-one__outer {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 100%;
}

/*---------- END ABOUT ONE ----------*/
/*---------- START ABOUT TWO ----------*/
.about-two__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.about-two__left {
  width: 11.5rem;
}

.about-two .about__note {
  text-align: right;
}

.about-two__item,
.about-two__item02 {
  display: flex;
}

.about-two__item {
  justify-content: flex-end;
  margin-bottom: 1.5rem;
}

.about-two__item-right,
.about-two__item02-right {
  padding-left: 1rem;
}

.about-two__item02 .title-about__num {
  font-size: 4.1rem;
}
.about-two__item02 .title-about__text {
  font-size: 2.4rem;
}

@media only screen and (max-width: 767px) {
  .about-two__row {
    max-width: 34.5rem;
    margin: 0 auto;
  }
  .about-two__left {
    width: 7rem;
  }
  .about-two__right {
    flex: 1;
    min-width: 1px;
  }
  .about-two__item {
    margin-bottom: 1rem;
  }
  .about-two__item-right {
    padding-left: 0.5rem;
  }
  .about-two__item02 {
    justify-content: flex-end;
  }
  .about-two__item02-right {
    padding-left: 0.5rem;
  }
  .about-two__item02 .title-about__num {
    font-size: 3rem;
  }
  .about-two__item02 .title-about__text {
    font-size: 1.6rem;
  }
}
@media only screen and (max-width: 575px) {
  .about-two .about__text {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 360px) {
  .about-two .about__text {
    font-size: 1.3rem;
  }
  .about-two__item02 .title-about__num {
    font-size: 2.8rem;
  }
  .about-two__item02 .title-about__text {
    font-size: 1.5rem;
  }
}
/*---------- END ABOUT TWO ----------*/
/*---------- START ABOUT THREE ----------*/
.about-three__row {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.about-three__right {
  padding-left: 4.5rem;
}

.about-three .about__note {
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .about-three__right {
    padding-left: 2.5rem;
  }
}
/*---------- END ABOUT THREE ----------*/
/*---------- START ABOUT FOUR ----------*/
.about-four__inner {
  text-align: center;
}

.about-four__head {
  display: inline-flex;
  flex-direction: column;
}

.about-four .about__note {
  text-align: right;
}

@media only screen and (min-width: 768px) {
  .about-four__outer {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
  }
  .about-four .about__text {
    margin-top: 0.5rem;
  }
}
/*---------- END ABOUT FOUR ----------*/
/*---------- START ABOUT FIVE ----------*/
.about-five {
  text-align: center;
}

.about-five__title {
  margin-bottom: 0.5rem;
}
.about-five__title span {
  color: var(--color-blue);
  font-weight: 500;
}

.about-five__title-num {
  font-size: 8rem;
  line-height: 1;
  font-family: var(--font-jost);
}

.about-five__title-text {
  font-size: 2.8rem;
}
.about-five__title-text:first-child {
  margin-right: -5rem;
}
.about-five__title-text:last-child {
  margin-left: -5rem;
}

@media only screen and (max-width: 767px) {
  .about-five__title-num {
    font-size: 4.5rem;
  }
  .about-five__title-text {
    font-size: 1.8rem;
  }
  .about-five__title-text:first-child {
    margin-right: -2rem;
  }
  .about-five__title-text:last-child {
    margin-left: -2rem;
  }
}
@media only screen and (max-width: 360px) {
  .about-five__title-text {
    font-size: 1.6rem;
  }
}
/*---------- END ABOUT FIVE ----------*/
/*---------- START ABOUT SIX ----------*/
.about-six__row {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.about-six__right {
  padding-left: 3rem;
}

.about-six__item {
  display: flex;
  justify-content: space-between;
  margin-top: 1.5rem;
}
.about-six__item:first-child {
  margin-top: 0;
}

.about-six__item-left {
  width: 13rem;
  padding-top: 0.1em;
  padding-right: 1rem;
  text-align: right;
}

@media only screen and (min-width: 768px) {
  .about-six__item .title-about__num {
    font-size: 7rem;
  }
  .about-six__item .title-about__text {
    font-size: 3.6rem;
  }
}
@media only screen and (max-width: 767px) {
  .about-six__left {
    width: 8rem;
  }
  .about-six__right {
    flex: 0 0 auto;
    padding-left: 1.5rem;
  }
  .about-six__item-left {
    width: 11rem;
  }
}
/*---------- END ABOUT SIX ----------*/
/*---------- START ABOUT SEVEN ----------*/
.about-seven__row {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.about-seven .title-about {
  text-align: right;
}
.about-seven .title-about__num {
  font-size: 7rem;
}
.about-seven .title-about__text {
  font-size: 3.4rem;
}
.about-seven .about__plus {
  margin-bottom: -2.5rem;
  padding: 0 1rem 0 1rem;
}

@media only screen and (max-width: 767px) {
  .about-seven .title-about__num {
    font-size: 3.7rem;
  }
  .about-seven .title-about__text {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 360px) {
  .about-seven .title-about__num {
    font-size: 3.2rem;
  }
  .about-seven .title-about__text {
    font-size: 1.4rem;
  }
}
/*---------- END ABOUT SEVEN ----------*/
/*---------- START ABOUT EIGHT ----------*/
.about-eight__row {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.about-eight__right {
  padding-left: 4rem;
}

.about-eight__list {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(2, 1fr);
}

@media only screen and (max-width: 767px) {
  .about-eight__right {
    padding-left: 3rem;
  }
}
/*---------- END ABOUT EIGHT ----------*/
/*---------- START ABOUT NINE ----------*/
.about-nine__outer {
  display: flex;
  align-items: center;
  padding-bottom: 2rem;
}

.about-nine__inner {
  position: relative;
}

.about-nine__item {
  position: absolute;
  display: flex;
  align-items: flex-end;
}

.about-nine__item-left {
  padding-bottom: 0.2em;
}

.about-nine__item-right {
  padding-left: 0.5rem;
}

.about-nine__item .title-about__num {
  font-size: 5.2rem;
}
.about-nine__item .title-about__text {
  font-size: 2.2rem;
}

@media only screen and (min-width: 768px) {
  .about-nine__outer {
    justify-content: flex-end;
    margin-right: 2rem;
  }
}
@media only screen and (max-width: 767px) {
  .about-nine__outer {
    justify-content: center;
  }
}
/*---------- END ABOUT NINE ----------*/
/*---------- START LIST ABOUT ----------*/
@media only screen and (min-width: 768px) {
  .list-about {
    display: grid;
    gap: 3rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 767px) {
  .list-about .about {
    margin-top: 3rem;
  }
  .list-about .about:first-child {
    margin-top: 0;
  }
}
/*---------- END LIST ABOUT ----------*/
/*====================================================================================
8. END ABOUT PAGE.
====================================================================================*/
/*====================================================================================
9. START CAREER PAGE.
====================================================================================*/
/*---------- START INTRODUCTION CAREER ----------*/
.intro-career {
  display: flex;
  color: var(--color-white);
}

.intro-career__title {
  margin-bottom: 5rem;
  font-size: 2.4rem;
  line-height: 2;
  font-weight: 500;
}

.intro-career__info {
  margin-bottom: 2rem;
  font-size: 1.8rem;
  line-height: 1.7;
  font-weight: 500;
  text-align: right;
}

.intro-career__name {
  font-size: 2.4rem;
  font-weight: 500;
  text-align: right;
}
.intro-career__name small {
  font-size: 1.4rem;
}

.intro-career__img img {
  width: 100%;
  border-radius: 1rem;
}

@media only screen and (min-width: 768px) {
  .intro-career__left {
    flex: 1;
    min-width: 1px;
    padding-bottom: 15rem;
    padding-right: 4rem;
  }
  .intro-career__right {
    width: calc(50% + 15rem);
  }
  .intro-career__body {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }
}
@media only screen and (max-width: 767px) {
  .intro-career {
    flex-direction: column-reverse;
  }
  .intro-career__right {
    margin-bottom: 2rem;
  }
  .intro-career__title {
    margin-bottom: 2.5rem;
    font-size: 2.2rem;
    line-height: 1.7;
  }
  .intro-career__info {
    margin-bottom: 1.5rem;
    font-size: 1.6rem;
  }
  .intro-career__name {
    font-size: 2.2rem;
  }
}
/*---------- END INTRODUCTION CAREER ----------*/
/*---------- START CAREER MODEL SECTION ----------*/
.career-model__footer {
  padding: 4rem 0;
  background-color: #f1f1f1;
}

@media only screen and (min-width: 768px) {
  .career-model__head {
    position: relative;
  }
  .career-model__head::before {
    position: absolute;
    content: "";
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 10rem;
    width: 100%;
    /* background-color: var(--color-blue); */
    background-color: #54C0EE;
  }
}
@media only screen and (max-width: 767px) {
  .career-model__head {
    padding-bottom: 4rem;
    background-color: var(--color-blue);
  }
}
/*---------- END CAREER MODEL SECTION ----------*/
/*---------- START CHART CAREER ----------*/
.chart-career {
  text-align: center;
}

/*---------- END CHART CAREER ----------*/
/*---------- START CAREER TRAIN SECTION ----------*/
.career-train__subtitle {
  font-size: 2.4rem;
  text-align: center;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .career-train__subtitle {
    font-size: 2rem;
  }
}
/*---------- END CAREER TRAIN SECTION ----------*/
/*====================================================================================
9. END CAREER PAGE.
====================================================================================*/
/*====================================================================================
3. START  PAGE
====================================================================================*/
/*---------- START  ----------*/
/*---------- END  ----------*/
/*====================================================================================
3. END  PAGE
====================================================================================*/