@charset "UTF-8";
/*====================================================================================
START TABLE OF CONTENT

1. START ONLY CHILD PAGE.

1.1 START POST CHILD PAGE.
1.2 START GROUP CHILD PAGE.
1.3 START SIDEBAR CHILD PAGE.

1.4 START HEADING CHILD PAGE.
1.5 START TITLE CHILD PAGE.

1.6 START BUTTON CHILD PAGE.
1.7 START TAG CHILD PAGE.
1.8 START ARROW CHILD PAGE.

1.9 START SECTION CHILD PAGE.
1.10 START COMMON CHILD PAGE.

2. START SECTION PAGE VISUAL.
3. START SECTION BREADCRUMB.
4. START CAREER UP PAGE.
5. START WORK PAGE.
6. START FAQ PAGE.
7. START NEWS PAGE.
8. START INTERVIEW PAGE.
9. START TRAINING PAGE.
10. START ENVIRONMENT PAGE.
11. START ORGANIZATION PAGE.
12. START NUMBER PAGE.
13. START MESSAGE PAGE.
14. START SELECTION PAGE.

====================================================================================*/
/*====================================================================================
1. START ONLY CHILD PAGE.
====================================================================================*/
/*---------- START LAYOUT HEADER ----------*/
.l-header {
  position: fixed;
  background-color: var(--theme-color-secondary);
}

@media only screen and (max-width: 767px) {
  .l-header {
    box-shadow: 0.1rem 0.4rem 0.8rem -0.4rem rgba(0, 0, 0, 0.1);
  }
  .l-header__row {
    padding-left: 1.5rem;
  }
  .l-header .p-nav {
    padding-top: 6.6rem;
  }
  .l-header .p-nav__wrap {
    height: calc(100dvh - 6.6rem);
  }
}
@media only screen and (min-width: 768px) {
  .l-header {
    box-shadow: 0.1rem 0.4rem 0.8rem -0.4rem rgba(0, 0, 0, 0.15);
  }
  .l-header__row {
    padding-left: 5rem;
  }
  .l-header .p-nav__body {
    right: 2rem;
  }
}
/*---------- START LAYOUT MAIN ----------*/
@media only screen and (max-width: 767px) {
  .l-main {
    padding-top: 6.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .l-main {
    padding-top: 13.5rem;
  }
}
/*---------- START COMPONENT PROJECT GROUP ----------*/
@media only screen and (min-width: 768px) {
  .p-group__list {
    height: 13.5rem;
    padding-right: 5rem;
  }
  .p-group__btn {
    width: 16rem;
  }
}
/*---------- START COMPONENT LOGO ----------*/
.c-logo {
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 767px) {
  .c-logo__img img {
    height: 5rem;
  }
  .c-logo__text {
    padding-left: 1rem;
    font-size: 1.1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-logo__img img {
    max-height: 8.5rem;
  }
  .c-logo__text {
    padding-left: 2.5rem;
  }
}
/*---------- START COMPONENT HAMBURGER ----------*/
@media only screen and (max-width: 767px) {
  .c-btn-hamburger {
    width: 6.5rem;
    height: 6.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-btn-hamburger {
    width: 13.5rem;
    height: 13.5rem;
  }
  .c-btn-hamburger.is-active::before {
    width: 19.5rem;
    height: 19.5rem;
  }
}
/*---------- START COMPONENT BUTTON HEADER ----------*/
@media only screen and (min-width: 768px) {
  .c-btn-header:hover::before {
    width: 21rem;
    height: 21rem;
  }
}
/*====================================================================================
1.1 START POST CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT POST MAIN ----------*/
.c-post-main .c-title-base {
  margin-bottom: var(--spacing-sp-25-pc-40);
}
.c-post-main__img img {
  width: 100%;
  border-radius: 2rem;
}

@media only screen and (max-width: 767px) {
  .c-post-main__desc {
    margin-top: 2.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-main {
    display: flex;
  }
  .c-post-main__left {
    flex: 1;
    margin-top: -1.2rem;
    padding-right: 5rem;
  }
  .c-post-main__right {
    width: 58rem;
  }
  .c-post-main .c-title-base {
    margin-left: -0.15em;
  }
}
/*====================================================================================
1.2 START GROUP CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT GROUP NEWS ----------*/
.c-group-main .c-title-base {
  margin-bottom: 2rem;
}

/*====================================================================================
1.3 START SIDEBAR CHILD PAGE.
====================================================================================*/
/*---------- START LAYOUT SIDEBAR ----------*/
.l-sidebar {
  border-radius: 2rem;
  background-color: var(--theme-color-fourteenth);
}
.l-sidebar__item:not(:first-child) {
  margin-top: var(--spacing-sp-25-pc-40);
}
.l-sidebar .c-list-item-news {
  margin-top: var(--spacing-sp-10-pc-15);
}
.l-sidebar .c-list-tag-sidebar {
  margin-top: 0.5rem;
}

@media only screen and (max-width: 767px) {
  .l-sidebar {
    padding: 3.5rem 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .l-sidebar {
    padding: 4.5rem 3rem 5rem 3rem;
  }
}
/*====================================================================================
1.10 START HEADING CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT HEADING GROUP ----------*/
.c-heading-group {
  display: flex;
  align-items: center;
  background-color: var(--theme-color-seventeenth);
}
.c-heading-group__title {
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-heading-group {
    min-height: 5.5rem;
    padding: 1rem 1.5rem;
    border-radius: 0.8rem;
  }
  .c-heading-group__title {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-group {
    min-height: 6.5rem;
    padding: 1rem 3rem;
    border-radius: 1rem;
  }
  .c-heading-group__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT HEADING POST ----------*/
.c-heading-post {
  display: flex;
  border-radius: 1rem;
  background-color: var(--theme-color-fourteenth);
  overflow: hidden;
}
.c-heading-post__left {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--theme-color-eighteenth);
  text-align: center;
}
.c-heading-post__right {
  flex: 1;
  padding: 1rem var(--spacing-sp-15-pc-20);
}
.c-heading-post__char {
  padding-bottom: 0.4rem;
  color: var(--theme-color-secondary);
  line-height: 1;
  font-weight: 900;
}
.c-heading-post__title {
  font-weight: 700;
}

@media only screen and (max-width: 767px) {
  .c-heading-post__left {
    width: 7.5rem;
  }
  .c-heading-post__char {
    font-size: 2.5rem;
  }
  .c-heading-post__title {
    font-size: 1.7rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-post__left {
    width: 10rem;
  }
  .c-heading-post__char {
    font-size: 3rem;
  }
  .c-heading-post__title {
    font-size: 2rem;
  }
}
/*====================================================================================
1.5 START TITLE CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT TITLE MAIN ----------*/
.c-title-main {
  position: relative;
  color: var(--theme-color-eighteenth);
  font-weight: 500;
  text-align: center;
}
.c-title-main::before {
  position: absolute;
  content: "";
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  border-radius: 0.3rem;
  background-color: var(--theme-color-primary);
}

@media only screen and (max-width: 767px) {
  .c-title-main {
    padding-bottom: 1.4rem;
    font-size: 2.3rem;
  }
  .c-title-main::before {
    width: 4rem;
    height: 0.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-title-main {
    padding-bottom: 2rem;
    font-size: 3rem;
  }
  .c-title-main::before {
    width: 5.5rem;
    height: 0.5rem;
  }
}
/*---------- START COMPONENT TITLE BLOCK ----------*/
.c-title-block {
  position: relative;
}
.c-title-block::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: var(--theme-color-primary);
}
.c-title-block__text {
  position: relative;
  display: inline-block;
  z-index: 2;
  background-color: var(--theme-color-secondary);
  font-weight: 500;
}
.c-title-block__text::before {
  position: absolute;
  content: "▼";
  top: 0;
  left: 0;
}

@media only screen and (max-width: 767px) {
  .c-title-block__text {
    padding-left: 2.2rem;
    padding-right: 1.2rem;
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-title-block__text {
    padding-left: 2.2rem;
    padding-right: 1.7rem;
    font-size: 1.8rem;
  }
}
/*---------- START COMPONENT TITLE SIDEBAR ----------*/
.c-title-sidebar {
  color: var(--theme-color-sixteenth);
  font-weight: 700;
}

@media only screen and (max-width: 767px) {
  .c-title-sidebar {
    font-size: 1.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-title-sidebar {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT TITLE PART ----------*/
.c-title-part {
  position: relative;
  font-weight: 700;
}
.c-title-part::before {
  position: absolute;
  content: "";
  left: 0;
  height: 100%;
  border-radius: 0.5rem;
  background-color: var(--theme-color-eighteenth);
}

@media only screen and (max-width: 767px) {
  .c-title-part {
    padding-left: 1.7rem;
    font-size: 2rem;
  }
  .c-title-part::before {
    width: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-title-part {
    padding-left: 2rem;
    font-size: 2.4rem;
  }
  .c-title-part::before {
    width: 1rem;
  }
}
/*====================================================================================
1.6 START BUTTON CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT BTN SQUARE ----------*/
.c-btn-square {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--theme-color-fourteenth);
  text-decoration: none;
  transition: background-color 0.3s ease;
}
.c-btn-square::before, .c-btn-square::after {
  position: absolute;
  content: "";
  border-radius: 50%;
}
.c-btn-square::before {
  z-index: -1;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  background: linear-gradient(90deg, rgb(60, 135, 181) 0%, rgb(59, 155, 118) 100%);
}
.c-btn-square::after {
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  transform: translate(-50%, -50%);
  background-color: var(--theme-color-secondary);
  transition: width 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99), height 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99);
}
.c-btn-square__num {
  position: relative;
  z-index: 2;
  line-height: 1;
  font-weight: 500;
}
.c-btn-square--prev, .c-btn-square--next, .c-btn-square.is-dot {
  width: auto;
  height: auto;
  border: none;
  background-color: transparent;
}
.c-btn-square--prev::before, .c-btn-square--prev::after, .c-btn-square--next::before, .c-btn-square--next::after, .c-btn-square.is-dot::before, .c-btn-square.is-dot::after {
  content: none;
}
.c-btn-square.is-current::after {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 767px) {
  .c-btn-square {
    width: 3.4rem;
    height: 3.4rem;
  }
  .c-btn-square.is-current::before {
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
  }
  .c-btn-square__num {
    font-size: 1.6rem;
  }
  .c-btn-square__arrow {
    width: 1.7rem;
    height: 1.7rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-btn-square {
    width: 3.8rem;
    height: 3.8rem;
  }
  .c-btn-square:hover::before {
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    transition: top 0.05s 0.25s ease, left 0.05s 0.25s ease, right 0.05s 0.25s ease, bottom 0.05s 0.25s ease;
  }
  .c-btn-square:hover::after {
    width: 100%;
    height: 100%;
  }
  .c-btn-square:hover .c-btn-square__arrow {
    transform: scale(1.2);
  }
  .c-btn-square--prev:hover, .c-btn-square--next:hover, .c-btn-square.is-dot:hover {
    background-color: transparent;
  }
  .c-btn-square.is-current::before {
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
  }
  .c-btn-square__num {
    font-size: 2.4rem;
  }
  .c-btn-square__arrow {
    width: 1.9rem;
    height: 1.9rem;
    transition: transform 0.3s ease;
  }
}
/*====================================================================================
1.7 START TAG CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT TAG MAIN ----------*/
.c-tag-main {
  display: inline-block;
  padding: 0.5rem 1.2rem;
  border-radius: 1.5rem;
  background-color: color-mix(in srgb, var(--theme-color-tag) 30%, transparent);
}
.c-tag-main__text {
  line-height: 1;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-tag-main__text {
    font-size: 1.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-tag-main__text {
    font-size: 1.4rem;
  }
}

/* .c-tag-main--c-tenth {
  background-color: var(--theme-color-tenth);
}
.c-tag-main--c-eleventh {
  background-color: var(--theme-color-eleventh);
}
.c-tag-main--c-ninth {
  background-color: var(--theme-color-ninth);
} */

/*---------- START COMPONENT TAG SIDEBAR ----------*/
.c-tag-sidebar__link {
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  .c-tag-sidebar__link:hover .c-tag-sidebar__text {
    background-position: 0 100%;
    background-size: 100% 0.1rem;
  }
  .c-tag-sidebar__text {
    display: inline;
    background-image: linear-gradient(var(--theme-color-primary), var(--theme-color-primary));
    background-repeat: no-repeat;
    background-position: 100% 100%;
    background-size: 0% 1px;
    transition: background-size 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}
/*---------- START COMPONENT LIST TAG SIDEBAR ----------*/
.c-list-tag-sidebar {
  display: flex;
  flex-wrap: wrap;
}
.c-list-tag-sidebar .c-tag-sidebar {
  position: relative;
}
.c-list-tag-sidebar .c-tag-sidebar:last-child {
  padding-right: 0;
}
.c-list-tag-sidebar .c-tag-sidebar:last-child::before {
  content: none;
}
.c-list-tag-sidebar .c-tag-sidebar::before {
  position: absolute;
  content: "/";
}

@media only screen and (max-width: 767px) {
  .c-list-tag-sidebar .c-tag-sidebar {
    padding-right: 1.5rem;
  }
  .c-list-tag-sidebar .c-tag-sidebar::before {
    right: 0.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-tag-sidebar .c-tag-sidebar {
    padding-right: 1.8rem;
  }
  .c-list-tag-sidebar .c-tag-sidebar::before {
    right: 0.5rem;
  }
}
/*====================================================================================
1.8 START ICON, ARROW CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT ICON PLUS ----------*/
.c-icon-plus {
  position: absolute;
  border-radius: 50%;
  background-color: var(--theme-color-eighteenth);
  transition: transform 0.35s cubic-bezier(0.65, 0.05, 0.36, 1);
}
.c-icon-plus::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  width: 0.9rem;
  height: 0.9rem;
  margin-top: -0.6rem;
  margin-left: -0.5rem;
  border-right: 2px solid var(--theme-color-secondary);
  border-bottom: 2px solid var(--theme-color-secondary);
  transform: rotate(45deg);
}

/*====================================================================================
1.9 START SECTION CHILD PAGE.
====================================================================================*/
/*---------- START PROJECT ANCHOR ----------*/
.p-anchor__title {
  font-weight: 500;
  text-align: center;
}
.p-anchor__text {
  margin-bottom: var(--spacing-sp-25-pc-50);
  font-weight: 500;
  text-align: center;
}
.p-anchor__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

@media only screen and (max-width: 379px) {
  .p-anchor__list .c-btn__text {
    font-size: 1.3rem;
  }
}
@media only screen and (min-width: 380px) and (max-width: 575px) {
  .p-anchor__list .c-btn__text {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 575px) {
  .p-anchor__list .c-btn {
    min-height: 5rem;
    padding-right: 3.7rem;
  }
  .p-anchor__list .c-btn .c-circle {
    right: 1rem;
    width: 2.5rem;
    height: 2.5rem;
    margin-top: -1.2rem;
  }
  .p-anchor__list .c-btn .c-circle__arrow {
    width: 0.8rem;
    height: 0.8rem;
    margin-top: -0.4rem;
    margin-left: -0.4rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-anchor__title {
    font-size: 1.7rem;
  }
  .p-anchor__text {
    font-size: 1.6rem;
  }
  .p-anchor__list {
    margin: -0.5rem;
  }
  .p-anchor__list .c-btn {
    width: calc(50% - 1rem);
    margin: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-anchor__title {
    font-size: 2rem;
    line-height: 1.6;
  }
  .p-anchor__text {
    font-size: 1.8rem;
    letter-spacing: 0.1em;
  }
  .p-anchor__list {
    margin: -1.5rem;
  }
  .p-anchor__list .c-btn {
    width: calc(33.333% - 3rem);
    margin: 1.5rem;
  }
}
/*---------- START PROJECT PINNED ----------*/
.p-pinned {
  margin-top: var(--spacing-sp-0-pc-80);
  padding-bottom: var(--spacing-sp-60-pc-120);
}
.p-pinned__row {
  display: flex;
}

@media only screen and (max-width: 767px) {
  .p-pinned__row {
    flex-direction: column-reverse;
  }
  .p-pinned__scroll {
    margin-top: 5.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-pinned__row {
    align-items: flex-start;
  }
  .p-pinned__scroll {
    flex: 1;
    padding: 0 5rem 0 3rem;
  }
  .p-pinned__pin {
    width: 30rem;
  }
}
/*====================================================================================
1.10 START COMMON CHILD PAGE.
====================================================================================*/
/*---------- START COMPONENT PAGINATION ----------*/
.c-pagination {
  text-align: center;
}
.c-pagination__list {
  position: relative;
  display: inline-flex;
  min-width: 34rem;
  flex-wrap: wrap;
  justify-content: center;
}
.c-pagination__list .c-btn-square.is-dot {
  margin: 0 0.5rem;
}
.c-pagination__list .c-btn-square--prev, .c-pagination__list .c-btn-square--next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin: 0 !important;
}
.c-pagination__list .c-btn-square--prev {
  left: 0;
}
.c-pagination__list .c-btn-square--next {
  right: 0;
}

@media only screen and (max-width: 767px) {
  .c-pagination__list {
    margin: -0.5rem;
    padding: 0 4.5rem;
  }
  .c-pagination__list .c-btn-square {
    margin: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-pagination__list {
    margin: -0.5rem -1.2rem;
    padding: 0 12.5rem;
  }
  .c-pagination__list .c-btn-square {
    margin: 0.5rem 1.2rem;
  }
}
/*====================================================================================
2. START SECTION PAGE VISUAL.
====================================================================================*/
/*---------- START PROJECT PAGE VISUAL ----------*/
.p-pv__row {
  display: flex;
  align-items: center;
}

@media only screen and (max-width: 767px) {
  .p-pv__row {
    min-height: 18rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-pv__row {
    min-height: 27.5rem;
  }
}
/*---------- START COMPONENT TITLE PAGE VISUAL ----------*/
.c-title-pv__text {
  display: block;
  font-weight: 500;
}
.c-title-pv__text--en {
  position: relative;
  text-transform: uppercase;
}
.c-title-pv__text--en::before {
  position: absolute;
  content: "";
  left: 0;
  background: url("./../common_img/icon.svg") no-repeat center center/100% auto;
}

@media only screen and (max-width: 767px) {
  .c-title-pv__text--ja {
    font-size: 2.6rem;
  }
  .c-title-pv__text--en {
    margin-top: 0.7rem;
    padding-left: 2rem;
    font-size: 1.4rem;
  }
  .c-title-pv__text--en::before {
    top: 0.4rem;
    width: 1.4rem;
    height: 1.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-title-pv__text--ja {
    font-size: 5rem;
  }
  .c-title-pv__text--en {
    margin-top: 2rem;
    padding-left: 2.7rem;
    font-size: 2rem;
  }
  .c-title-pv__text--en::before {
    top: 0.7rem;
    width: 1.7rem;
    height: 1.7rem;
  }
}
/*====================================================================================
3. START SECTION BREADCRUMB.
====================================================================================*/
@media only screen and (max-width: 767px) {
  .l-breadcrumb {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .l-breadcrumb__list {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  .l-breadcrumb__item {
    position: relative;
    margin-right: 1.1rem;
    padding-right: 1.8rem;
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 500;
  }
  .l-breadcrumb__item:first-child {
    text-transform: uppercase;
  }
  .l-breadcrumb__item:last-child {
    margin-right: 0;
    padding-right: 0;
  }
  .l-breadcrumb__item:last-child::before {
    content: none;
  }
  .l-breadcrumb__item::before {
    position: absolute;
    content: "/";
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
  .l-breadcrumb__item a {
    text-decoration: none;
  }
  .l-breadcrumb__item a:hover {
    text-decoration: underline;
  }
}
/*====================================================================================
4. START CAREER UP PAGE.
====================================================================================*/
/*---------- START PROJECT CAREER UP ----------*/
.p-careerup__desc {
  text-align: center;
}
.p-careerup .p-chart-careerup {
  margin-top: var(--spacing-sp-25-pc-50);
}

/*---------- START PROJECT CHART CAREER UP ----------*/
.p-chart-careerup__outer {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  border-radius: 50%;
  background: url("./../careerup/images/s1-chart-bg.webp") no-repeat center center/100% 100%;
}
.p-chart-careerup__inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: url("./../careerup/images/s1-chart-bg2.webp") no-repeat center center/100% 100%;
}
.p-chart-careerup__title {
  font-weight: 700;
}
.p-chart-careerup__desc {
  line-height: 1.55;
}

@media only screen and (max-width: 575px) {
  .p-chart-careerup {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
  }
  .p-chart-careerup__outer {
    width: 96vw;
    height: 96vw;
    padding-top: 1vw;
  }
  .p-chart-careerup__inner {
    width: 39vw;
    height: 36.5vw;
  }
  .p-chart-careerup__heading {
    padding-bottom: 5vw;
  }
  .p-chart-careerup__title {
    font-size: 3.6vw;
  }
  .p-chart-careerup__desc {
    font-size: 3vw;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .p-chart-careerup__outer {
    width: 60rem;
    height: 60rem;
    padding-top: 2.5rem;
  }
  .p-chart-careerup__inner {
    width: 24rem;
    height: 22.5rem;
    padding-bottom: 2.5rem;
  }
  .p-chart-careerup__title {
    font-size: 2rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-chart-careerup__title {
    margin-bottom: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-chart-careerup__outer {
    width: 70rem;
    height: 70rem;
    padding-top: 3rem;
  }
  .p-chart-careerup__inner {
    width: 29rem;
    height: 27.5rem;
    padding-bottom: 3rem;
  }
  .p-chart-careerup__title {
    margin-bottom: 0.7rem;
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT BOX CAREER UP ----------*/
.c-box-careerup {
  position: absolute;
  text-align: center;
  color: var(--theme-color-secondary);
}
.c-box-careerup--v4 {
  left: 50%;
  transform: translateX(-50%);
}
.c-box-careerup__title {
  line-height: 1.5;
  font-weight: 700;
}
.c-box-careerup__desc {
  line-height: 1.55;
}

@media only screen and (max-width: 575px) {
  .c-box-careerup--v1, .c-box-careerup--v2 {
    top: 13.5%;
  }
  .c-box-careerup--v1 {
    left: 13%;
    width: 29%;
  }
  .c-box-careerup--v2 {
    right: 10%;
    width: 42%;
  }
  .c-box-careerup--v3, .c-box-careerup--v5 {
    width: 28%;
    bottom: 30%;
  }
  .c-box-careerup--v3 {
    right: 3%;
  }
  .c-box-careerup--v3 .c-box-careerup__title {
    text-align: right;
  }
  .c-box-careerup--v4 {
    bottom: 6.5%;
    width: 35%;
  }
  .c-box-careerup--v5 {
    left: 3%;
  }
  .c-box-careerup--v5 .c-box-careerup__title {
    text-align: left;
  }
  .c-box-careerup__title {
    font-size: 3.6vw;
  }
  .c-box-careerup__desc {
    font-size: 3vw;
  }
}
@media only screen and (min-width: 576px) {
  .c-box-careerup--v1 {
    top: 19.5%;
    left: 12.5%;
  }
  .c-box-careerup--v2 {
    top: 19.5%;
    right: 11%;
  }
  .c-box-careerup--v3 {
    right: 5%;
    bottom: 30%;
  }
  .c-box-careerup--v4 {
    bottom: 9%;
  }
  .c-box-careerup--v5 {
    left: 5%;
    bottom: 30%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-box-careerup__title {
    font-size: 2rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-box-careerup__title {
    margin-bottom: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-careerup__title {
    margin-bottom: 0.7rem;
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT HEADING CAREER UP ----------*/
.c-heading-careerup {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1rem;
  background: linear-gradient(90deg, rgb(60, 135, 181) 0%, rgb(59, 155, 118) 100%);
}
.c-heading-careerup::before, .c-heading-careerup::after {
  position: absolute;
  content: "";
}
.c-heading-careerup::before {
  left: 21.5%;
}
.c-heading-careerup::after {
  right: 21.5%;
}
.c-heading-careerup__text {
  color: var(--theme-color-secondary);
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-heading-careerup {
    min-height: 5.5rem;
  }
  .c-heading-careerup::before, .c-heading-careerup::after {
    top: -1.9rem;
    border-left: 1.3rem solid transparent;
    border-right: 1.3rem solid transparent;
  }
  .c-heading-careerup::before {
    border-bottom: 2rem solid var(--color-blue-500);
  }
  .c-heading-careerup::after {
    border-bottom: 2rem solid var(--color-green-400);
  }
  .c-heading-careerup__text {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-careerup {
    min-height: 6.5rem;
  }
  .c-heading-careerup::before, .c-heading-careerup::after {
    top: -2.3rem;
    border-left: 1.5rem solid transparent;
    border-right: 1.5rem solid transparent;
  }
  .c-heading-careerup::before {
    border-bottom: 2.4rem solid var(--color-blue-500);
  }
  .c-heading-careerup::after {
    border-bottom: 2.4rem solid var(--color-green-400);
  }
  .c-heading-careerup__text {
    font-size: 2.2rem;
  }
}
/*---------- START COMPONENT GROUP CAREER UP ----------*/
.c-group-careerup {
  position: relative;
  border-radius: 1rem;
  background-color: var(--color-green-200);
}
.c-group-careerup::before {
  position: absolute;
  content: "";
  left: 50%;
}
.c-group-careerup__title, .c-group-careerup__desc {
  text-align: center;
}
.c-group-careerup__title {
  margin-bottom: 1rem;
  font-weight: 500;
}
.c-group-careerup__desc {
  margin-bottom: var(--spacing-sp-20-pc-30);
  letter-spacing: 0.05em;
}
.c-group-careerup__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.c-group-careerup__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  border-radius: 1rem;
  background-color: var(--theme-color-secondary);
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-group-careerup {
    padding: 2.5rem 1.5rem;
  }
  .c-group-careerup::before {
    top: -1.9rem;
    margin-left: -1.3rem;
    border-left: 1.3rem solid transparent;
    border-right: 1.3rem solid transparent;
    border-bottom: 2rem solid var(--color-green-200);
  }
  .c-group-careerup__title {
    font-size: 2rem;
  }
  .c-group-careerup__list {
    margin: -0.75rem;
  }
  .c-group-careerup__item {
    width: calc(50% - 1.5rem);
    min-height: 5.5rem;
    margin: 0.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-group-careerup {
    padding: 4rem;
  }
  .c-group-careerup::before {
    top: -2.3rem;
    margin-left: -1.5rem;
    border-left: 1.5rem solid transparent;
    border-right: 1.5rem solid transparent;
    border-bottom: 2.4rem solid var(--color-green-200);
  }
  .c-group-careerup__title {
    font-size: 2.2rem;
  }
  .c-group-careerup__list {
    margin: -1.5rem;
  }
  .c-group-careerup__item {
    width: calc(33.333% - 3rem);
    margin: 1.5rem;
    min-height: 6.5rem;
  }
}
/*---------- START CAREER UP ----------*/
.c-part-careerup {
  padding-top: var(--spacing-sp-40-pc-80);
}
.c-part-careerup__header {
  position: relative;
}
.c-part-careerup__header::before {
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: var(--theme-color-fourteenth);
}
.c-part-careerup__left img {
  width: 100%;
  border-radius: 1rem;
}
.c-part-careerup__text, .c-part-careerup__title, .c-part-careerup__desc, .c-part-careerup__name {
  font-weight: 500;
}
.c-part-careerup__body {
  padding: var(--spacing-sp-35-pc-80) 0;
  background-color: var(--theme-color-fourteenth);
}
.c-part-careerup__desc, .c-part-careerup__name {
  font-size: 1.8rem;
}
.c-part-careerup__desc {
  margin-top: var(--spacing-sp-25-pc-50);
}
.c-part-careerup__name {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--spacing-sp-15-pc-20);
  line-height: 1.5;
}

@media only screen and (max-width: 767px) {
  .c-part-careerup__header::before {
    top: 23rem;
  }
  .c-part-careerup__left {
    margin-bottom: 3rem;
    text-align: center;
  }
  .c-part-careerup__left img {
    max-width: 20rem;
  }
  .c-part-careerup__text {
    font-size: 1.6rem;
  }
  .c-part-careerup__title {
    font-size: 2.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-part-careerup__header::before {
    height: 12rem;
  }
  .c-part-careerup__row {
    display: flex;
  }
  .c-part-careerup__left {
    width: 38rem;
  }
  .c-part-careerup__right {
    flex: 1;
    padding: 8rem 0 12rem 9rem;
  }
  .c-part-careerup__text {
    margin-bottom: 0.5rem;
    font-size: 1.8rem;
  }
  .c-part-careerup__title {
    font-size: 3rem;
  }
  .c-part-careerup__name {
    padding-right: 16rem;
  }
}
/*---------- START COMPONENT LIST CAREER UP ----------*/
.c-list-block-careerup .c-block-careerup {
  position: relative;
  margin-bottom: 2rem;
}
.c-list-block-careerup .c-block-careerup:last-child {
  margin-bottom: 0;
}
.c-list-block-careerup .c-block-careerup:last-child::before {
  content: none;
}
.c-list-block-careerup .c-block-careerup::before {
  position: absolute;
  content: "";
  bottom: -1.5rem;
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  border-top: 1.6rem solid var(--theme-color-secondary);
}

/*---------- START COMPONENT CAREER UP ----------*/
.c-block-careerup {
  border-radius: 1rem;
  background-color: var(--theme-color-secondary);
}
.c-block-careerup__right {
  position: relative;
  flex: 1;
}
.c-block-careerup__time {
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.07em;
}
.c-block-careerup__title {
  color: var(--theme-color-sixteenth);
  font-weight: 500;
}

@media only screen and (max-width: 575px) {
  .c-block-careerup {
    padding: 2rem;
  }
  .c-block-careerup::before {
    left: 50%;
    margin-left: -1.5rem;
  }
  .c-block-careerup__left {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--theme-color-fifteenth);
  }
  .c-block-careerup__right {
    padding-top: 1.6rem;
  }
  .c-block-careerup__title {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-block-careerup {
    display: flex;
    padding: 2.5rem 0 3rem 0;
  }
  .c-block-careerup::before {
    left: 9rem;
  }
  .c-block-careerup__left {
    align-self: center;
    text-align: center;
  }
  .c-block-careerup__right::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 0;
    width: 1px;
    height: calc(100% - 1.3rem);
    margin-top: 0.4rem;
    transform: translateY(-50%);
    background-color: var(--theme-color-fifteenth);
  }
  .c-block-careerup__title {
    margin-bottom: 1.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-block-careerup__time, .c-block-careerup__title {
    font-size: 2rem;
  }
  .c-block-careerup__time small {
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-block-careerup__left {
    width: 12rem;
  }
  .c-block-careerup__right {
    padding: 0 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-block-careerup__left {
    width: 21rem;
  }
  .c-block-careerup__right {
    padding: 0 3.5rem;
  }
  .c-block-careerup__time, .c-block-careerup__title {
    font-size: 2.4rem;
  }
  .c-block-careerup__time small {
    font-size: 1.6rem;
  }
}
/*====================================================================================
5. START WORK PAGE.
====================================================================================*/
/*---------- START PROJECT WORK ----------*/
.p-work .c-title-base {
  text-align: center;
  margin-bottom: var(--spacing-sp-15-pc-30);
}
.p-work .c-chart-work {
  margin-top: var(--spacing-sp-30-pc-60);
}
.p-work .c-list-group-work {
  margin-top: var(--spacing-sp-35-pc-70);
}

@media only screen and (min-width: 768px) {
  .p-work__sm {
    width: 100%;
    max-width: 80rem;
    margin: 0 auto;
  }
}
/*---------- START COMPONENT POST WORK ----------*/
.c-post-work .c-title-base {
  text-align: left;
  margin-bottom: var(--spacing-sp-25-pc-40);
}
.c-post-work__img img {
  width: 100%;
  border-radius: 2rem;
}

@media only screen and (max-width: 767px) {
  .c-post-work__desc {
    margin-top: 2.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-work {
    display: flex;
  }
  .c-post-work__left {
    flex: 1;
    margin-top: -1.2rem;
    padding-right: 5rem;
  }
  .c-post-work__right {
    width: 58rem;
  }
  .c-post-work .c-title-base {
    margin-left: -0.15em;
  }
}
/*---------- START COMPONENT CHART WORK ----------*/
.c-chart-work {
  padding: var(--spacing-sp-30-pc-50) 1.5rem var(--spacing-sp-35-pc-70) 1.5rem;
  background-color: var(--theme-color-fourteenth);
  text-align: center;
}
.c-chart-work .c-title-base {
  margin-bottom: var(--spacing-sp-20-pc-25);
}

@media only screen and (max-width: 767px) {
  .c-chart-work {
    border-radius: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-chart-work {
    border-radius: 2rem;
  }
}
/*---------- START COMPONENT LIST GROUP WORK ----------*/
.c-list-group-work .c-group-work {
  margin-top: var(--spacing-sp-40-pc-80);
}
.c-list-group-work .c-group-work:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT GROUP WORK ----------*/
.c-group-work__row {
  display: flex;
}
.c-group-work__right img {
  width: 100%;
}
.c-group-work__desc {
  margin-bottom: var(--spacing-sp-20-pc-35);
}

@media only screen and (max-width: 767px) {
  .c-group-work__row {
    flex-direction: column-reverse;
    margin-top: 2.5rem;
  }
  .c-group-work__right {
    margin-bottom: 2rem;
  }
  .c-group-work__right img {
    border-radius: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-group-work__row {
    padding: 5rem 3rem 0 3rem;
  }
  .c-group-work__left {
    flex: 1;
    margin-top: -1rem;
    padding-right: 3rem;
  }
  .c-group-work__right {
    width: 47rem;
  }
  .c-group-work__right img {
    border-radius: 2rem;
  }
}
/*---------- START COMPONENT BLOCK WORK ----------*/
.c-block-work .c-title-block {
  margin-bottom: var(--spacing-sp-10-pc-20);
}
.c-block-work__item:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .c-block-work__item {
    margin-top: 0.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-block-work__list {
    padding-left: 0.5rem;
  }
  .c-block-work__item {
    margin-top: 0.6rem;
  }
}
/*====================================================================================
6. START FAQ PAGE.
====================================================================================*/
/*---------- START COMPONENT LIST POST FAQ ----------*/
.c-list-post-faq .c-post-faq {
  margin-top: var(--spacing-sp-20-pc-30);
}
.c-list-post-faq .c-post-faq:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT POST FAQ ----------*/
.c-post-faq {
  background-color: var(--theme-color-fourteenth);
}
.c-post-faq__header {
  position: relative;
  cursor: pointer;
}
.c-post-faq__header.is-active .c-icon-plus {
  transform: rotate(-180deg);
}
.c-post-faq__char, .c-post-faq__title {
  font-weight: 500;
}
.c-post-faq__char {
  position: absolute;
  left: 0;
  color: var(--theme-color-eighteenth);
  line-height: 1;
}
.c-post-faq__body {
  display: none;
}
.c-post-faq__inner {
  border-top: 1px solid var(--theme-color-eighteenth);
}

@media only screen and (max-width: 767px) {
  .c-post-faq {
    border-radius: 1.5rem;
    padding: 2rem 5.5rem 2rem 1.5rem;
  }
  .c-post-faq__header {
    padding-left: 3.5rem;
  }
  .c-post-faq__char {
    top: -0.3rem;
    font-size: 2.8rem;
  }
  .c-post-faq__icon {
    top: -0.2rem;
    right: -4.2rem;
    width: 2.8rem;
    height: 2.8rem;
  }
  .c-post-faq__icon::after {
    transform: rotate(45deg) scale(0.8);
  }
  .c-post-faq__title {
    font-size: 1.6rem;
  }
  .c-post-faq__inner {
    margin-top: 1.2rem;
    padding-top: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-faq {
    padding: 2.8rem 10rem 2.8rem 5rem;
    border-radius: 2rem;
  }
  .c-post-faq__header {
    padding-left: 4.2rem;
  }
  .c-post-faq__header:hover .c-post-faq__title {
    color: var(--theme-color-eighteenth);
    transition: color 0.3s ease;
  }
  .c-post-faq__char {
    top: -0.3rem;
    font-size: 3.4rem;
  }
  .c-post-faq__icon {
    top: 0.2rem;
    right: -7rem;
    width: 3rem;
    height: 3rem;
  }
  .c-post-faq__title {
    font-size: 2rem;
  }
  .c-post-faq__inner {
    margin-top: 1.5rem;
    padding-top: 2.2rem;
  }
}
/*====================================================================================
7. START NEWS PAGE.
====================================================================================*/
/*---------- START COMPONENT LIST ITEM NEWS ----------*/
@media only screen and (max-width: 767px) {
  .c-list-item-news {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-item-news .c-item-news:not(:first-child) {
    margin-top: 2rem;
  }
}
/*---------- START COMPONENT ITEM NEWS ----------*/
.c-item-news__link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  border-radius: 1rem;
  overflow: hidden;
  text-decoration: none;
  background-color: color-mix(in srgb, var(--theme-color-tag) 30%, transparent);
}
.c-item-news__text {
  position: relative;
  z-index: 2;
  font-weight: 500;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-item-news__link {
    min-height: 5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-news__link {
    position: relative;
    min-height: 5.6rem;
  }
  .c-item-news__link::after {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--theme-color-secondary);
    transition: width 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99), height 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99);
  }
  .c-item-news__link:hover::after {
    width: 25rem;
    height: 25rem;
  }
}
/*---------- START COMPONENT ITEM NEWS ELEVENTH ----------*/
/* .c-item-news--c-eleventh .c-item-news__link {
  background-color: var(--theme-color-eleventh);
}
.c-item-news--c-tenth .c-item-news__link {
  background-color: var(--theme-color-tenth);
}
.c-item-news--c-ninth .c-item-news__link {
  background-color: var(--theme-color-ninth);
}
@media only screen and (min-width: 768px) {
  .c-item-news--c-eleventh .c-item-news__link {
    border: 2px solid var(--theme-color-eleventh);
  }
  .c-item-news--c-tenth .c-item-news__link {
    border: 2px solid var(--theme-color-tenth);
  }
  .c-item-news--c-ninth .c-item-news__link {
    border: 2px solid var(--theme-color-ninth);
  }
} */
/*---------- START PROJECT NEWS ----------*/
.p-news__body {
  margin-top: 1.5rem;
  padding-top: var(--spacing-sp-20-pc-30);
  border-top: 1px solid var(--theme-color-primary);
}
.p-news__btn {
  margin-top: var(--spacing-sp-30-pc-60);
  text-align: center;
}
.p-news .c-group-main {
  margin-top: var(--spacing-sp-45-pc-90);
}

/*---------- START COMPONENT LIST PART NEWS ----------*/
.c-list-part-news .c-part-news {
  margin-top: var(--spacing-sp-30-pc-60);
}
.c-list-part-news .c-part-news:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT PART NEWS ----------*/
.c-part-news__img {
  margin-bottom: var(--spacing-sp-20-pc-40);
}

/*---------- START COMPONENT LIST CARD NEWS ----------*/
.c-list-card-news {
  display: grid;
}

@media only screen and (max-width: 767px) {
  .c-list-card-news {
    gap: 2.5rem 1.5rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-news {
    gap: 2rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
/*---------- START COMPONENT CARD NEWS ----------*/
.c-card-news {
  text-decoration: none;
}
.c-card-news__img {
  position: relative;
  display: block;
  margin-bottom: 1.5rem;
  overflow: hidden;
}
.c-card-news__img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.c-card-news__title {
  color: var(--theme-color-sixteenth);
  line-height: 1.5;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-card-news__img {
    padding-top: 30vw;
    border-radius: 1.5rem;
  }
  .c-card-news__title {
    font-size: 1.5rem;
  }
  .c-card-news__tag {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-news:hover .c-card-news__img img {
    transform: scale(1.05);
  }
  .c-card-news__img {
    padding-top: 15rem;
    border-radius: 2rem;
  }
  .c-card-news__tag {
    margin-bottom: 0.5rem;
  }
  .c-card-news__title {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT LIST POST NEWS ----------*/
.c-list-post-news .c-post-news {
  padding: 3rem 0;
  border-bottom: 1px solid var(--theme-color-primary);
}
.c-list-post-news .c-post-news:first-child {
  padding-top: 0;
}

/*---------- START COMPONENT POST NEWS ----------*/
.c-post-news__row {
  margin-top: var(--spacing-sp-20-pc-25);
}
.c-post-news__left {
  text-align: center;
}
.c-post-news__left img {
  width: 100%;
  max-width: 32rem;
  border-radius: 2rem;
}
.c-post-news__right {
  position: relative;
}
.c-post-news__link {
  text-align: right;
}
.c-post-news__link .c-link-main__text {
  background-image: linear-gradient(var(--theme-color-primary), var(--theme-color-primary));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 0.1rem;
}

@media only screen and (max-width: 767px) {
  .c-post-news__left {
    margin-bottom: 2rem;
  }
  .c-post-news__link {
    margin-top: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-news__row {
    display: flex;
  }
  .c-post-news__left {
    width: 32rem;
  }
  .c-post-news__right {
    flex: 1;
    padding: 0 0 4.5rem 3rem;
  }
  .c-post-news__link {
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .c-post-news__link .c-link-main:hover .c-link-main__text {
    background-position: 100% 100%;
    background-size: 0% 1px;
  }
}
/*---------- START COMPONENT HEADING NEWS ----------*/
.c-heading-news__row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.c-heading-news__right {
  margin-right: -0.3em;
}
.c-heading-news__title {
  color: var(--theme-color-sixteenth);
  line-height: 1.5;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-heading-news__row {
    flex-direction: column;
    gap: .5em;
  }
  .c-heading-news__title {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-news__row {
    flex-wrap: nowrap;
    gap: .5em 1em;
  }
  .c-heading-news__left {
    flex-grow: 1;
  }
  .c-heading-news__right {
    flex-shrink: 0;
  }
  .c-heading-news__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT TAG NEWS ----------*/
.c-tag-news {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: .5em;
}
.c-tag-news__text {
  display: inline-block;
  border-radius: 2rem;
  background-color: color-mix(in srgb, var(--theme-color-tag) 30%, transparent);
  line-height: 1;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-tag-news__text {
    padding: .5em .75em;
    font-size: 1.2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-tag-news__text {
    padding: 0.6rem 1.9rem;
    font-size: 1.8rem;
  }
}

/* .c-tag-news--c-tenth .c-tag-news__text {
  background-color: var(--theme-color-tenth);
}
.c-tag-news--c-eleventh .c-tag-news__text {
  background-color: var(--theme-color-eleventh);
}
.c-tag-news--c-ninth .c-tag-news__text {
  background-color: var(--theme-color-ninth);
} */

/*---------- START COMPONENT ITEM NEWS ----------*/
.c-item-time {
  display: flex;
  flex-wrap: wrap;
  font-weight: 500;
}
.c-item-time .c-item-time__left {
  margin-right: 0.5rem;
}

@media only screen and (max-width: 767px) {
  .c-item-time {
    font-size: 1.1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-time {
    font-size: 1.8rem;
  }
}
/*====================================================================================
8. START INTERVIEW PAGE.
====================================================================================*/
/*---------- START PROJECT INTERVIEW ----------*/
.p-interview__figure {
  position: relative;
  margin-bottom: var(--spacing-sp-25-pc-50);
}
.p-interview__figure img {
  width: 100%;
}
.p-interview__figcaption {
  position: absolute;
  right: var(--spacing-sp-10-pc-30);
  bottom: var(--spacing-sp-10-pc-30);
  padding: var(--spacing-sp-5-pc-10) var(--spacing-sp-10-pc-30);
  background-color: var(--theme-color-eighteenth);
  color: var(--theme-color-secondary);
  text-align: center;
}
.p-interview__name {
  font-weight: 700;
}
.p-interview__tag {
  margin-top: var(--spacing-sp-20-pc-25);
}
.p-interview .c-list-bnr-interview {
  margin-top: var(--spacing-sp-25-pc-30);
}
.p-interview .c-block-interview {
  margin-top: var(--spacing-sp-20-pc-40);
}
.p-interview__desc {
  margin-top: var(--spacing-sp-20-pc-40);
}
.p-interview .c-list-post-interview {
  margin-top: var(--spacing-sp-45-pc-90);
}
.p-interview__btn {
  margin-top: var(--spacing-sp-45-pc-90);
  text-align: center;
}
.p-interview .c-group-main {
  margin-top: var(--spacing-sp-45-pc-90);
}

@media only screen and (max-width: 575px) {
  .p-interview__img img {
    height: 55vw;
    max-height: 30rem;
    object-fit: cover;
    object-position: center;
  }
}
@media only screen and (max-width: 767px) {
  .p-interview__figcaption {
    line-height: 1.55;
    position: static;
  }
  .p-interview__name {
    font-size: 1.7rem;
  }
  .p-interview__exp {
    font-size: 1.4rem;
  }
  .p-interview__title {
    font-size: 2.2rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-interview__figcaption {
    border-radius: 1.5rem;
    line-height: 1.6;
    width: 415px;
    width: 348px;
  }
  .p-interview__name {
    font-size: 2rem;
  }
  .p-interview__exp {
    font-size: 1.6rem;
  }
  .p-interview__title {
    font-size: 3rem;
  }
}
/*---------- START COMPONENT MENU INTERVIEW ----------*/
.c-menu-interview__text {
  margin-bottom: var(--spacing-sp-20-pc-25);
  font-weight: 500;
  text-align: center;
}
.c-menu-interview__body {
  border-radius: 2rem;
  background-color: var(--theme-color-nineteenth);
}

@media only screen and (max-width: 767px) {
  .c-menu-interview__text {
    font-size: 1.5rem;
  }
  .c-menu-interview__body {
    padding: 3rem 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-menu-interview__text {
    font-size: 2rem;
  }
  .c-menu-interview__body {
    padding: 3rem;
  }
}
/*---------- START COMPONENT LIST ITEM INTERVIEW ----------*/
.c-list-item-interview {
  display: flex;
  flex-wrap: wrap;
}

@media only screen and (max-width: 767px) {
  .c-list-item-interview {
    justify-content: center;
    margin: -0.5rem;
  }
  .c-list-item-interview .c-item-interview {
    width: calc(50% - 1rem);
    margin: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-item-interview {
    margin: -0.5rem -1rem;
  }
  .c-list-item-interview .c-item-interview {
    margin: 0.5rem 1rem;
  }
  .c-list-item-interview .c-item-interview__link {
    min-width: 17rem;
  }
}
/*---------- START COMPONENT TAG INTERVIEW ----------*/
.c-item-interview__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 4rem;
  padding: 0.5rem var(--spacing-sp-10-pc-20);
  border-radius: 1rem;
  border: 1px solid var(--theme-color-eighteenth);
  background-color: var(--theme-color-secondary);
  text-align: center;
  text-decoration: none;
}
.c-item-interview__text {
  line-height: 1.3;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-item-interview__link {
    width: 100%;
    height: 100%;
  }
  .c-item-interview__text {
    font-size: 1.4rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-item-interview__text {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-interview__link {
    position: relative;
    min-height: 4.5rem;
    overflow: hidden;
  }
  .c-item-interview__link::after {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--theme-color-eighteenth);
    transition: width 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99), height 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99);
  }
  .c-item-interview__link:hover::after {
    width: 26rem;
    height: 26rem;
  }
  .c-item-interview__link:hover .c-item-interview__text {
    color: var(--theme-color-secondary);
  }
  .c-item-interview__text {
    position: relative;
    z-index: 2;
    font-size: 1.8rem;
    transition: color 0.2s ease;
  }
}
/*---------- START COMPONENT LIST CARD INTERVIEW THREE ----------*/
@media only screen and (max-width: 575px) {
  .c-list-card-interview--three .c-card-interview {
    margin-top: 3rem;
  }
  .c-list-card-interview--three .c-card-interview:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-card-interview--three {
    display: grid;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-card-interview--three {
    gap: 3rem 1.5rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-interview--three {
    gap: 3.7rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
/*---------- START COMPONENT LIST CARD INTERVIEW FOUR ----------*/
.c-list-card-interview--four {
  display: grid;
}

@media only screen and (max-width: 767px) {
  .c-list-card-interview--four {
    gap: 3rem 1.5rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-interview--four {
    gap: 3rem;
    grid-template-columns: repeat(4, 1fr);
  }
}
/*---------- START COMPONENT INTERVIEW ----------*/
.c-card-interview {
  text-decoration: none;
}
.c-card-interview__img {
  position: relative;
  display: block;
  overflow: hidden;
}
.c-card-interview__img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.c-card-interview__title {
  color: var(--theme-color-eighteenth);
  font-weight: 500;
}
.c-card-interview__row {
  display: flex;
  /* justify-content: flex-end; */
}
.c-card-interview__left {
  flex: 0 0 auto;
}

.c-card-interview__name {
  /* text-align: right; */
}

.c-card-interview__txt-box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 1;
}

@media only screen and (max-width: 575px) {
  .c-card-interview {
    display: block;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-interview:hover .c-card-interview__img img {
    transform: scale(1.05);
  }
  .c-card-interview__title {
    margin-left: -0.12em;
    margin-right: -0.12em;
  }
}
/*---------- START COMPONENT INTERVIEW MD ----------*/
.c-card-interview--md {
  display: flex;
  flex-direction: column;
  border-radius: 2rem;
  background-color: var(--theme-color-fourteenth);
}
.c-card-interview--md .c-card-interview__img {
  border-radius: 2rem;
}
.c-card-interview--md .c-card-interview__title {
  font-size: 2rem;
}
.c-card-interview--md .c-card-interview__right {
  /* padding-left: 1.3rem; */
}

.c-card-interview--md .c-card-interview__row {
  margin-top: 1rem;
}


@media only screen and (max-width: 575px) {
  .c-card-interview--md {
    padding: 1.5rem 1.5rem 2.5rem 1.5rem;
  }
  .c-card-interview--md .c-card-interview__row {
    margin-top: 2.5rem;
  }
  .c-card-interview--md .c-card-interview__img {
    padding-top: 60vw;
  }
}
@media only screen and (min-width: 576px) {
  .c-card-interview--md {
    position: relative;
  }
  .c-card-interview--md .c-card-interview__img {
    padding-top: 22rem;
  }
  .c-card-interview--md .c-card-interview__row {
    /* position: absolute; */
  }
}
@media only screen and (max-width: 767px) {
  .c-card-interview--md .c-card-interview__img {
    margin-bottom: 2rem;
  }
  .c-card-interview--md .c-card-interview__title {
    font-size: 1.8rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-card-interview--md .c-card-interview {
    padding: 1.5rem 1.5rem 6.5rem 1.5rem;
  }
  .c-card-interview--md .c-card-interview__row {
    left: 1.5rem;
    right: 1.5rem;
    bottom: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-interview--md {
    padding: 2rem 2rem 2rem 2rem;
  }
  .c-card-interview--md .c-card-interview__img {
    margin-bottom: 2.2rem;
  }
  .c-card-interview--md .c-card-interview__row {
    left: 2rem;
    right: 2rem;
    bottom: 3rem;
  }
}
/*---------- START COMPONENT INTERVIEW SM ----------*/
@media only screen and (max-width: 575px) {
  .c-card-interview--sm .c-card-interview__img {
    margin-bottom: 1.2rem;
    padding-top: 50vw;
    border-radius: 1.5rem;
  }
  .c-card-interview--sm .c-card-interview__row {
    margin-top: 0.7rem;
    font-size: clamp(1rem, 0.25rem + 2vw, 1.4rem);
  }
  .c-card-interview--sm .c-card-interview__right {
    padding-left: 1rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-card-interview--sm .c-card-interview__img {
    margin-bottom: 1.5rem;
    border-radius: 2rem;
  }
  .c-card-interview--sm .c-card-interview__row {
    margin-top: 1rem;
    font-size: 1.4rem;
  }
  .c-card-interview--sm .c-card-interview__right {
    padding-left: 1.2rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-card-interview--sm .c-card-interview__img {
    padding-top: 30vw;
  }
  .c-card-interview--sm .c-card-interview__title {
    font-size: clamp(1.5rem, 1.213rem + 0.7653vw, 1.8rem);
  }
}
@media only screen and (min-width: 768px) {
  .c-card-interview--sm .c-card-interview__img {
    padding-top: 15rem;
  }
  .c-card-interview--sm .c-card-interview__title {
    font-size: 2rem;
    line-height: 1.3;
  }
}
/*---------- START COMPONENT TAG INTERVIEW ----------*/
.c-tag-interview {
  display: inline-block;
  border-radius: 1rem;
  background-color: var(--theme-color-nineteenth);
}
.c-tag-interview__text {
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-tag-interview {
    padding: 0.6rem 1.5rem;
  }
  .c-tag-interview__text {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-tag-interview {
    padding: 0.6rem 3rem;
  }
  .c-tag-interview__text {
    font-size: 1.8rem;
    letter-spacing: 0.01em;
  }
}
/*---------- START COMPONENT LIST BANNER INTERVIEW ----------*/
.c-list-bnr-interview {
  display: flex;
  flex-wrap: wrap;
}
.c-list-bnr-interview .c-bnr-interview--md {
  width: 100% !important;
}

@media only screen and (max-width: 767px) {
  .c-list-bnr-interview {
    margin: -0.75rem;
  }
  .c-list-bnr-interview .c-bnr-interview {
    width: calc(50% - 1.5rem);
    margin: 0.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-bnr-interview {
    margin: -2rem;
  }
  .c-list-bnr-interview .c-bnr-interview {
    width: calc(50% - 4rem);
    margin: 2rem;
  }
}
/*---------- START COMPONENT BANNER INTERVIEW ----------*/
.c-bnr-interview {
  display: block;
  background-color: var(--theme-color-fourteenth);
  text-decoration: none;
}
.c-bnr-interview__img {
  position: relative;
  border-radius: 50%;
}
.c-bnr-interview__img::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid var(--theme-color-eighteenth);
}
.c-bnr-interview__img img {
  width: 100%;
}
.c-bnr-interview__title {
  color: var(--theme-color-eighteenth);
}
.c-bnr-interview__body {
  margin-top: var(--spacing-sp-10-pc-15);
  padding-top: var(--spacing-sp-15-pc-20);
  border-top: 1px solid var(--theme-color-fifteenth);
}

@media only screen and (max-width: 767px) {
  .c-bnr-interview__left {
    text-align: center;
  }
  .c-bnr-interview__img {
    margin: 0 auto;
  }
  .c-bnr-interview__text, .c-bnr-interview__year {
    font-size: 1.3rem;
  }
  .c-bnr-interview__text {
    line-height: 1.4;
  }
}
@media only screen and (min-width: 768px) {
  .c-bnr-interview {
    padding: 3rem;
    transition: box-shadow 0.3s ease;
  }
  .c-bnr-interview:hover {
    box-shadow: 0 0 0.7rem rgba(0, 0, 0, 0.2);
  }
  .c-bnr-interview__row {
    display: flex;
    align-items: center;
  }
  .c-bnr-interview__right {
    flex: 1;
    padding-left: 5rem;
  }
  .c-bnr-interview__text {
    line-height: 1.1;
  }
  .c-bnr-interview__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT BANNER INTERVIEW MD ----------*/
.c-bnr-interview--md .c-bnr-interview__img {
  max-width: 20rem;
}
.c-bnr-interview--md .c-bnr-interview__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.c-bnr-interview--md .c-bnr-interview__heading {
  flex: 1;
  padding-right: var(--spacing-sp-15-pc-30);
}
.c-bnr-interview--md .c-bnr-interview__year {
  flex: 0 0 auto;
}

@media only screen and (max-width: 767px) {
  .c-bnr-interview--md {
    padding: 2.5rem 1.5rem;
  }
  .c-bnr-interview--md .c-bnr-interview__left {
    margin-bottom: 2.5rem;
  }
  .c-bnr-interview--md .c-bnr-interview__title {
    font-size: 1.9rem;
  }
}

.c-bnr-interview--md .c-bnr-interview__left {
  width: 20rem;
}

.c-bnr-interview--sm .c-bnr-interview__left {
  width: 16rem;
}

.c-bnr-interview--md .c-bnr-interview__img {
  width: 20rem;       /* 固定幅 */
  height: 20rem;      /* 固定高さ */
  border-radius: 50%; /* 円形に */
  overflow: hidden;   /* はみ出しをカット */
  display: flex;      /* 中央寄せ */
  align-items: center;
  justify-content: center;
}

.c-bnr-interview--sm .c-bnr-interview__img {
  width: 16rem;       /* 固定幅 */
  height: 16rem;      /* 固定高さ */
  border-radius: 50%; /* 円形に */
  overflow: hidden;   /* はみ出しをカット */
  display: flex;      /* 中央寄せ */
  align-items: center;
  justify-content: center;
}


.c-bnr-interview__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;      /* まるでトリミングしたように */
  object-position: center; /* 中央基準でカット */
}

/*---------- START COMPONENT BANNER INTERVIEW SM ----------*/
.c-bnr-interview--sm .c-bnr-interview__img {
  max-width: 16rem;
}
.c-bnr-interview--sm .c-bnr-interview__year {
  margin-top: var(--spacing-sp-10-pc-15);
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .c-bnr-interview--sm {
    padding: 1.5rem;
  }
  .c-bnr-interview--sm .c-bnr-interview__left {
    margin-bottom: 1.5rem;
  }
  .c-bnr-interview--sm .c-bnr-interview__title {
    font-size: 1.5rem;
  }

  .c-bnr-interview--sm .c-bnr-interview__left {
    width: 14rem;
  }

  .c-bnr-interview--sm .c-bnr-interview__img {
    width: 14rem;       /* 固定幅 */
    height: 14rem;      /* 固定高さ */
  }
}
/*---------- START COMPONENT BLOCK INTERVIEW ----------*/
.c-block-interview__row {
  padding: 1rem;
  border-radius: 1rem;
  border: 1px solid var(--theme-color-eighteenth);
}
.c-block-interview__left {
  background-color: var(--theme-color-eighteenth);
}
.c-block-interview__label {
  color: var(--theme-color-secondary);
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}
.c-block-interview__title {
  color: var(--theme-color-eighteenth);
  font-weight: 700;
  text-align: center;
}
.c-block-interview__btn {
  margin-top: 1.5rem;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-block-interview__left {
    margin-bottom: 1.5rem;
    padding: 1rem;
    border-radius: 1rem;
  }
  .c-block-interview__label {
    font-size: 2.5rem;
  }
  .c-block-interview__title {
    font-size: 1.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-block-interview__row {
    display: flex;
    max-width: 95rem;
    margin: 0 auto;
  }
  .c-block-interview__left {
    width: 19rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1rem 0 0 1rem;
  }
  .c-block-interview__right {
    flex: 1;
    padding: 1rem 3rem;
  }
  .c-block-interview__label {
    font-size: 3rem;
  }
  .c-block-interview__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT LIST POST INTERVIEW ----------*/
.c-list-post-interview .c-post-interview {
  margin-top: var(--spacing-sp-35-pc-70);
}

/*---------- START COMPONENT POST INTERVIEW ----------*/
.c-post-interview__body {
  margin-top: var(--spacing-sp-25-pc-40);
}
.c-post-interview__img, .c-post-interview__btn {
  text-align: center;
}
.c-post-interview__img {
  margin-top: var(--spacing-sp-20-pc-40);
}
.c-post-interview__btn {
  margin-top: var(--spacing-sp-25-pc-50);
}

@media only screen and (max-width: 575px) {
  .c-post-interview__img img {
    height: 55vw;
    max-height: 30rem;
    object-fit: cover;
    object-position: center;
  }
}
/*====================================================================================
9. START TRAINING PAGE.
====================================================================================*/
/*---------- START PROJECT TRAINING ----------*/
.p-training .c-title-base {
  margin-bottom: var(--spacing-sp-15-pc-30);
}
.p-training .c-chart-training {
  margin-top: var(--spacing-sp-30-pc-60);
}

/*---------- START COMPONENT CHART TRAINING ----------*/
.c-chart-training__left {
  position: relative;
}
.c-chart-training__left::before {
  position: absolute;
  content: "";
}
.c-chart-training__box {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--theme-color-eighteenth);
}
.c-chart-training__text {
  display: block;
  color: var(--theme-color-secondary);
  text-align: center;
}
.c-chart-training__text--jp {
  font-size: 3rem;
  font-weight: 700;
}
.c-chart-training__text--en {
  font-size: 2rem;
  font-weight: 500;
  text-transform: uppercase;
}

@media only screen and (max-width: 575px) {
  .c-chart-training__box {
    width: 25rem;
    height: 25rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-chart-training__box {
    width: 35rem;
    height: 35rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-chart-training__left {
    margin-bottom: 7rem;
  }
  .c-chart-training__left::before {
    left: 50%;
    bottom: -5rem;
    margin-left: -3.5rem;
    border-left: 3.5rem solid transparent;
    border-top: 3.5rem solid var(--theme-color-primary);
    border-right: 3.5rem solid transparent;
  }
  .c-chart-training__box {
    margin: 0 auto;
  }
  .c-chart-training__text {
    line-height: 1.4;
  }
  .c-chart-training__text--jp {
    font-size: clamp(2.2rem, 4.3vw, 3rem);
  }
  .c-chart-training__text--en {
    font-size: clamp(1.5rem, 3vw, 2rem);
  }
}
@media only screen and (min-width: 768px) {
  .c-chart-training__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 108rem;
    margin: 0 auto;
  }
  .c-chart-training__left {
    width: 50%;
  }
  .c-chart-training__left::before {
    top: 50%;
    right: -11.5rem;
    margin-top: -4.5rem;
    border-top: 4.5rem solid transparent;
    border-left: 4.5rem solid var(--theme-color-primary);
    border-bottom: 4.5rem solid transparent;
  }
  .c-chart-training__text {
    line-height: 1.25;
  }
}
/*---------- START COMPONENT LIST ITEM TRAINING ----------*/
.c-list-item-training {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

@media only screen and (max-width: 575px) {
  .c-list-item-training .c-item-training {
    width: calc(50% + 1.5rem);
  }
}
@media only screen and (min-width: 576px) {
  .c-list-item-training .c-item-training {
    width: calc(50% + 3rem);
  }
}
/*---------- START COMPONENT TRAINING ----------*/
.c-item-training {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  opacity: 0.7;
}
.c-item-training__text {
  color: var(--theme-color-secondary);
  line-height: 1.3;
  text-align: center;
}
.c-item-training__text--jp {
  font-weight: 700;
}
.c-item-training__text--en {
  font-weight: 500;
  text-transform: uppercase;
}

@media only screen and (max-width: 767px) {
  .c-item-training {
    height: 40vw;
  }
  .c-item-training__text--jp {
    font-size: clamp(1.7rem, 3vw, 2rem);
  }
  .c-item-training__text--en {
    font-size: clamp(1.5rem, 2.6vw, 1.8rem);
  }
}
@media only screen and (min-width: 768px) {
  .c-item-training {
    height: 25rem;
  }
  .c-item-training__text--jp {
    font-size: 2.4rem;
  }
  .c-item-training__text--en {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT TRAINING VERSION 1 ----------*/
.c-item-training--v1 {
  background-color: var(--theme-color-twentieth);
}

@media only screen and (max-width: 575px) {
  .c-item-training--v1 {
    margin-bottom: -4.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-item-training--v1 {
    margin-bottom: -7.5rem;
  }
}
/*---------- START COMPONENT TRAINING VERSION 2 ----------*/
.c-item-training--v2 {
  padding-right: 2rem;
  background-color: var(--theme-color-twenty-second);
}

@media only screen and (max-width: 575px) {
  .c-item-training--v2 {
    margin-right: -1.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-item-training--v2 {
    margin-right: -3rem;
  }
}
/*---------- START COMPONENT TRAINING VERSION 3 ----------*/
.c-item-training--v3 {
  background-color: var(--theme-color-twenty-first);
}

@media only screen and (max-width: 575px) {
  .c-item-training--v3 {
    margin-left: -1.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-item-training--v3 {
    margin-left: -3rem;
  }
}
/*---------- START COMPONENT LIST PART TRAINING ----------*/
.c-list-part-training .c-part-training {
  margin-top: var(--spacing-sp-40-pc-80);
}

/*---------- START COMPONENT PART TRAINING ----------*/
.c-part-training .c-title-part {
  margin-bottom: var(--spacing-sp-20-pc-40);
}
.c-part-training__body {
  border-radius: 2rem;
  background-color: var(--theme-color-secondary);
}
.c-part-training__left {
  font-weight: 700;
}

@media only screen and (max-width: 767px) {
  .c-part-training__left, .c-part-training__right {
    text-align: center;
  }
  .c-part-training__left {
    margin-bottom: 1.5rem;
  }
  .c-part-training__body {
    padding: 3rem 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-part-training__row {
    display: flex;
    align-items: center;
  }
  .c-part-training__left, .c-part-training__right {
    width: 50%;
    padding: 0 2.7rem;
  }
  .c-part-training__left {
    text-align: right;
  }
  .c-part-training__body {
    padding: 5rem;
  }
}
/*---------- START COMPONENT LIST GROUP TRAINING ----------*/
.c-list-group-training {
  position: relative;
}
.c-list-group-training::before {
  position: absolute;
  content: "";
  top: 0;
  left: 1.4rem;
  width: 1px;
  height: 100%;
  background: url("./../common_img/bd-vertical-gray.webp") repeat-y center top/100% auto;
}
.c-list-group-training .c-group-training {
  margin-top: var(--spacing-sp-35-pc-50);
}
.c-list-group-training .c-group-training:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .c-list-group-training {
    padding-left: 2.6rem;
  }
  .c-list-group-training::before {
    left: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-group-training {
    padding-left: 8rem;
  }
}
/*---------- START COMPONENT GROUP TRAINING ----------*/
.c-group-training:first-child .c-group-training__header::after {
  position: absolute;
  content: "";
  top: 0;
  height: 50%;
  background-color: var(--theme-color-fourteenth);
}
.c-group-training__header {
  position: relative;
  background-color: var(--theme-color-eighteenth);
}
.c-group-training__header::before {
  position: absolute;
  content: "";
  z-index: 2;
  top: 50%;
  border-radius: 50%;
  transform: translateY(-50%);
  background-color: var(--theme-color-eighteenth);
}
.c-group-training__title {
  color: var(--theme-color-secondary);
  font-weight: 400;
}
.c-group-training__title strong {
  font-weight: 700;
}
.c-group-training__body {
  background-color: var(--theme-color-secondary);
}

@media only screen and (max-width: 767px) {
  .c-group-training:first-child .c-group-training__header::after {
    left: -3rem;
    width: 1.9rem;
  }
  .c-group-training__header {
    padding: 1rem 2rem;
    border-radius: 1.5rem 1.5rem 0 0;
  }
  .c-group-training__header::before {
    left: -3rem;
    width: 1.9rem;
    height: 1.9rem;
  }
  .c-group-training__title {
    font-size: 1.4rem;
  }
  .c-group-training__title strong {
    font-size: 2rem;
  }
  .c-group-training__body {
    padding: 2.5rem 2rem 3rem 2rem;
    border-radius: 0 0 1.5rem 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-group-training:first-child .c-group-training__header::after {
    left: -8rem;
    width: 2.9rem;
  }
  .c-group-training__header {
    padding: 1.1rem 5rem;
    border-radius: 2rem 2rem 0 0;
  }
  .c-group-training__header::before {
    left: -8rem;
    width: 2.9rem;
    height: 2.9rem;
  }
  .c-group-training__title {
    font-size: 1.6rem;
  }
  .c-group-training__title strong {
    font-size: 2.4rem;
  }
  .c-group-training__body {
    padding: 4rem 5rem 4.5rem 5rem;
    border-radius: 0 0 2rem 2rem;
  }
}
/*---------- START COMPONENT LIST BLOCK TRAINING ----------*/
.c-list-block-training .c-block-training:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .c-list-block-training .c-block-training {
    margin-top: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-block-training .c-block-training {
    margin-top: 3.5rem;
  }
}
/*---------- START COMPONENT BLOCK TRAINING ----------*/
.c-block-training__title {
  color: var(--theme-color-eighteenth);
  font-weight: 700;
}
.c-block-training__outer {
  margin: var(--spacing-sp-25-pc-45) 0;
}
.c-block-training__subtitle {
  margin-bottom: 1.5rem;
  color: var(--theme-color-twenty-second);
  font-weight: 700;
  text-align: center;
}
.c-block-training__inner {
  margin-top: var(--spacing-sp-20-pc-30);
  background-color: var(--theme-color-twenty-third);
}
.c-block-training__note {
  margin-top: 0.5rem;
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .c-block-training__title {
    margin-bottom: 0.5rem;
    font-size: 1.7rem;
  }
  .c-block-training__subtitle {
    font-size: 1.8rem;
  }
  .c-block-training__inner {
    border-radius: 1.5rem;
    padding: 2rem 1.5rem 2rem 1.5rem;
  }
  .c-block-training__item {
    margin-top: 0.4rem;
  }
  .c-block-training__item:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) {
  .c-block-training__title {
    margin-bottom: 0.7rem;
    font-size: 2rem;
  }
  .c-block-training__subtitle {
    font-size: 2rem;
  }
  .c-block-training__inner {
    border-radius: 2rem;
    padding: 2rem 2.5rem 2rem 2rem;
  }
  .c-block-training__lists {
    display: flex;
    justify-content: space-between;
  }
  .c-block-training__list:first-child {
    margin-right: 2rem;
  }
}
/*---------- START COMPONENT LIST BOX TRAINING ----------*/
@media only screen and (max-width: 575px) {
  .c-list-box-training .c-box-training {
    margin-top: 2rem;
  }
  .c-list-box-training .c-box-training:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-box-training {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-box-training {
    margin: -1rem;
  }
  .c-list-box-training .c-box-training {
    width: calc(50% - 2rem);
    margin: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-box-training {
    margin: -1.5rem;
  }
  .c-list-box-training .c-box-training {
    width: calc(33.333% - 3rem);
    margin: 1.5rem;
  }
}
/*---------- START COMPONENT BOX TRAINING ----------*/
.c-box-training {
  border-radius: 1rem;
  border: 1px solid var(--theme-color-fifth);
}
.c-box-training__header {
  position: relative;
  z-index: 2;
  padding: 1rem;
}
.c-box-training__header::before {
  position: absolute;
  content: "";
  z-index: -1;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: 0;
  border-radius: 1rem 1rem 0 0;
  background-color: var(--theme-color-eighteenth);
}
.c-box-training__title {
  color: var(--theme-color-secondary);
  font-weight: 700;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-box-training__title {
    font-size: 1.6rem;
  }
  .c-box-training__body {
    padding: 1.3rem 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-training__title {
    font-size: 1.8rem;
  }
  .c-box-training__body {
    padding: 1.3rem 2rem;
  }
}
/*====================================================================================
10. START ENVIRONMENT PAGE.
====================================================================================*/
/*---------- START COMPONENT LIST BUTTON ----------*/
.c-list-btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

@media only screen and (max-width: 379px) {
  .c-list-btn .c-btn .c-circle {
    right: 0.7rem;
  }
  .c-list-btn .c-btn__text {
    font-size: 1.3rem;
  }
}
@media only screen and (min-width: 380px) and (max-width: 575px) {
  .c-list-btn .c-btn .c-circle {
    right: 1rem;
  }
  .c-list-btn .c-btn__text {
    font-size: 1.4rem;
  }
}
@media only screen and (max-width: 575px) {
  .c-list-btn .c-btn {
    min-height: 5rem;
    padding-right: 3.5rem;
  }
  .c-list-btn .c-btn .c-circle {
    width: 2.5rem;
    height: 2.5rem;
    margin-top: -1.2rem;
  }
  .c-list-btn .c-btn .c-circle__arrow {
    width: 0.8rem;
    height: 0.8rem;
    margin-top: -0.4rem;
    margin-left: -0.4rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-list-btn {
    margin: -0.5rem;
  }
  .c-list-btn .c-btn {
    width: calc(50% - 1rem);
    margin: 0.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-btn {
    margin: -1rem -1.5rem;
  }
  .c-list-btn .c-btn {
    margin: 1rem 1.5rem;
  }
}
/*---------- START COMPONENT LIST BUTTON TWO ----------*/
@media only screen and (min-width: 768px) {
  .c-list-btn--two .c-btn {
    width: calc(50% - 3rem);
  }
}
/*---------- START COMPONENT LIST BUTTON THREE ----------*/
@media only screen and (min-width: 768px) {
  .c-list-btn--three .c-btn {
    width: calc(33.333% - 3rem);
  }
}
/*---------- START PROJECT ENVIRONMENT ----------*/
.p-env__desc {
  margin-top: var(--spacing-sp-15-pc-25);
}
.p-env__slider {
  margin-top: var(--spacing-sp-30-pc-60);
}
.p-env .c-list-card-env {
  margin-top: var(--spacing-sp-30-pc-60);
}

/*---------- START COMPONENT LIST POST ENVIRONMENT ----------*/
.c-list-post-env .c-post-env {
  margin-top: var(--spacing-sp-35-pc-60);
}
.c-list-post-env .c-post-env:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT POST ENVIRONMENT ----------*/
.c-post-env {
  display: flex;
}
.c-post-env .c-title-base {
  margin-bottom: var(--spacing-sp-15-pc-35);
}
.c-post-env__right img {
  width: 100%;
  border-radius: 2rem;
}

@media only screen and (max-width: 767px) {
  .c-post-env {
    flex-direction: column-reverse;
  }
  .c-post-env__right {
    margin-bottom: 2.2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-env:nth-child(odd) .c-post-env__left {
    padding: 3.5rem 5.5rem 0 3rem;
  }
  .c-post-env:nth-child(even) {
    flex-direction: row-reverse;
  }
  .c-post-env:nth-child(even) .c-post-env__left {
    padding: 3.5rem 3rem 0 6rem;
  }
  .c-post-env__left {
    flex: 1;
  }
  .c-post-env__right {
    width: 58rem;
  }
}
/*---------- START COMPONENT SLIDER ENVIRONMENT ----------*/
.c-slider-env {
  max-width: 82rem;
  margin: 0 auto;
}
.c-slider-env .splide__arrow {
  opacity: 1;
  border: 0.2rem solid var(--theme-color-primary);
  background-color: var(--theme-color-primary);
}
.c-slider-env .splide__arrow::before {
  content: none;
}
.c-slider-env .splide__arrow::after {
  transition: width 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99), height 0.3s cubic-bezier(0.55, 0.05, 0.22, 0.99);
}
.c-slider-env .splide__arrow .c-circle__arrow {
  fill: var(--theme-color-secondary);
  transition: fill 0.15s ease;
}
.c-slider-env .splide__track {
  overflow: visible;
}
.c-slider-env .splide__slide img {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .c-slider-env {
    padding: 0 2rem;
  }
  .c-slider-env .splide__arrow {
    width: 4rem;
    height: 4rem;
  }
  .c-slider-env .splide__arrow--prev {
    left: 0;
  }
  .c-slider-env .splide__arrow--next {
    right: 0;
  }
  .c-slider-env .splide__arrow .c-circle__arrow {
    width: 1.2rem;
    height: 1.2rem;
    margin-top: -0.6rem;
    margin-left: -0.6rem;
  }
  .c-slider-env .splide__slide img {
    height: 50vw;
    max-height: 30rem;
    border-radius: 1.5rem;
    object-fit: cover;
  }
}
@media only screen and (min-width: 768px) {
  .c-slider-env .splide__arrow {
    width: 6rem;
    height: 6rem;
  }
  .c-slider-env .splide__arrow:hover::after {
    width: 100%;
    height: 100%;
  }
  .c-slider-env .splide__arrow:hover .c-circle__arrow {
    fill: var(--theme-color-primary);
  }
  .c-slider-env .splide__arrow--prev {
    left: -3rem;
  }
  .c-slider-env .splide__arrow--next {
    right: -3rem;
  }
  .c-slider-env .splide__arrow::after {
    background-color: var(--theme-color-secondary);
  }
  .c-slider-env .splide__arrow .c-circle__arrow {
    width: 1.8rem;
    height: 1.8rem;
    margin-top: -0.9rem;
    margin-left: -0.9rem;
  }
  .c-slider-env .splide__slide img {
    border-radius: 2rem;
  }
}
/*---------- START COMPONENT LIST CARD ENVIRONMENT ----------*/
.c-list-card-env .c-card-env:first-child {
  margin-top: 0;
}

@media only screen and (min-width: 576px) {
  .c-list-card-env {
    display: grid;
  }
}
/*---------- START COMPONENT LIST CARD ENVIRONMENT TWO ----------*/
@media only screen and (max-width: 575px) {
  .c-list-card-env--two .c-card-env {
    margin-top: 3.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-card-env--two {
    gap: 5rem 10rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-card-env--two {
    gap: 3.5rem 3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-env--two {
    gap: 5rem 10rem;
  }
}
/*---------- START COMPONENT LIST CARD ENVIRONMENT THREE ----------*/
@media only screen and (max-width: 575px) {
  .c-list-card-env--three .c-card-env {
    margin-top: 3rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-card-env--three {
    gap: 3rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-env--three {
    gap: 4.5rem;
    grid-template-columns: repeat(3, 1fr);
  }
}
/*---------- START COMPONENT CARD ENVIRONMENT ----------*/
.c-card-env__img img {
  width: 100%;
  border-radius: 2rem;
}
.c-card-env__title {
  color: var(--theme-color-eighteenth);
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-card-env__title {
    font-size: 1.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-env__title {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT CARD ENVIRONMENT MD ----------*/
@media only screen and (max-width: 767px) {
  .c-card-env--md .c-card-env__title {
    margin-top: 1.6rem;
  }
  .c-card-env--md .c-card-env__desc {
    margin-top: 0.7rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-env--md .c-card-env__title {
    margin-top: 2.5rem;
  }
  .c-card-env--md .c-card-env__desc {
    margin-top: 0.5rem;
  }
}
/*---------- START COMPONENT CARD ENVIRONMENT SM ----------*/
.c-card-env--sm .c-card-env__title {
  margin-top: 1rem;
}

/*====================================================================================
11. START ORGANIZATION PAGE.
====================================================================================*/
/*---------- START PROJECT ORGANIZATION ----------*/
.p-org .c-list-group-org {
  margin-top: var(--spacing-sp-50-pc-100);
}

/*---------- START COMPONENT LIST GROUP ORGANIZATION ----------*/
.c-list-group-org .c-group-org {
  margin-top: var(--spacing-sp-35-pc-60);
}
.c-list-group-org .c-group-org:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT GROUP ORGANIZATION ----------*/
.c-group-org {
  padding: 5rem;
  border-radius: 2rem;
  background-color: var(--theme-color-fourteenth);
}
.c-group-org .c-heading-org {
  margin-bottom: var(--spacing-sp-25-pc-50);
}

@media only screen and (max-width: 767px) {
  .c-group-org {
    padding: 3rem 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-group-org {
    padding: 5rem;
  }
}
/*---------- START COMPONENT HEADING ORGANIZATION ----------*/
.c-heading-org__title {
  font-weight: 500;
}

@media only screen and (max-width: 575px) {
  .c-heading-org__sp {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
  }
  .c-heading-org__icon {
    width: 9rem;
    padding-right: 1.5rem;
  }
  .c-heading-org__title {
    flex: 1;
  }
}
@media only screen and (min-width: 576px) {
  .c-heading-org {
    display: flex;
    align-items: center;
  }
  .c-heading-org__right {
    flex: 1;
  }
  .c-heading-org__title {
    margin-bottom: 0.5rem;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-heading-org__right {
    padding-left: 1.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-heading-org__title {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-heading-org__left {
    width: 12.1rem;
  }
  .c-heading-org__right {
    padding-left: 3rem;
  }
  .c-heading-org__title {
    font-size: 2.4rem;
  }
}
/*---------- START COMPONENT LIST ITEM ORGANIZATION ----------*/
.c-list-item-org .c-item-org {
  margin-top: 2rem;
}
.c-list-item-org .c-item-org:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 575px) {
  .c-list-item-org .c-item-org {
    margin-top: 2.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-item-org .c-item-org {
    margin-top: 2rem;
  }
}
/*---------- START COMPONENT ITEM ORGANIZATION ----------*/
.c-item-org__heading {
  border-radius: 3rem;
  background-color: var(--theme-color-nineteenth);
}
.c-item-org__title {
  font-weight: 700;
  text-align: center;
}

@media only screen and (max-width: 575px) {
  .c-item-org__left {
    margin-bottom: 1.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-item-org {
    display: flex;
  }
  .c-item-org__right {
    flex: 1;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-item-org__left {
    min-width: 16.5rem;
  }
  .c-item-org__right {
    padding: 0.8rem 0 0 1.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-item-org__heading {
    padding: 0.8rem 1rem;
  }
  .c-item-org__title {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-org__left {
    min-width: 18.5rem;
  }
  .c-item-org__right {
    padding: 0.5rem 0 0 2rem;
  }
  .c-item-org__heading {
    padding: 0.6rem 1rem;
  }
  .c-item-org__title {
    font-size: 1.8rem;
  }
}
/*====================================================================================
12. START NUMBER PAGE.
====================================================================================*/
/*---------- START PROJECT NUMBER ----------*/
.p-number__header {
  margin-bottom: var(--spacing-sp-20-pc-30);
}

@media only screen and (min-width: 768px) {
  .p-number__body .l-container {
    max-width: 124rem;
  }
}
/*---------- START COMPONENT LIST CARD NUMBER ----------*/
@media only screen and (max-width: 575px) {
  .c-list-card-number .c-card-number {
    margin-top: 3rem;
  }
  .c-list-card-number .c-card-number:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 576px) {
  .c-list-card-number {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .c-list-card-number {
    margin: -1rem;
  }
  .c-list-card-number .c-card-number {
    width: calc(50% - 2rem);
    margin: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-card-number {
    margin: -2rem;
  }
  .c-list-card-number .c-card-number {
    width: calc(50% - 4rem);
    margin: 2rem;
  }
}
/*---------- START COMPONENT CARD NUMBER ----------*/
.c-card-number {
  border-radius: 2rem;
  background-color: var(--theme-color-seventeenth);
}
.c-card-number__note {
  font-weight: 500;
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .c-card-number {
    padding: 3rem 2rem;
  }
  .c-card-number__row {
    text-align: center;
  }
  .c-card-number__note {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number__row {
    display: flex;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 1 ----------*/
.c-card-number--v1 .c-card-number__note {
  margin-top: 1.5rem;
}

@media only screen and (max-width: 767px) {
  .c-card-number--v1 .c-card-number__row {
    margin-top: 2.5rem;
  }
  .c-card-number--v1 .c-card-number__left {
    margin-bottom: 1rem;
    text-align: center;
  }
  .c-card-number--v1 .c-card-number__left img {
    width: 14rem;
  }
  .c-card-number--v1 .c-card-number__right {
    display: flex;
    justify-content: center;
  }
  .c-card-number--v1 .c-card-number__note {
    text-align: center;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v1 {
    padding: 4rem 2rem 4rem 2rem;
  }
  .c-card-number--v1 .c-card-number__row {
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 1.5rem;
  }
  .c-card-number--v1 .c-card-number__right {
    padding-right: 2.7rem;
    padding-bottom: 1rem;
  }
  .c-card-number--v1 .c-card-number__note {
    text-align: left;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 2 ----------*/
.c-card-number--v2 .c-list-box-number {
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-card-number--v2 .c-list-box-number {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v2 {
    padding: 4rem;
  }
  .c-card-number--v2 .c-list-box-number {
    margin-top: 1.7rem;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 3 ----------*/
.c-card-number--v3 .c-list-item-number {
  margin-top: var(--spacing-sp-25-pc-45);
}

@media only screen and (min-width: 768px) {
  .c-card-number--v3 {
    padding: 4rem 2rem;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 4 ----------*/
.c-card-number--v4 .c-card-number__row {
  margin-top: 2.5rem;
}

@media only screen and (max-width: 767px) {
  .c-card-number--v4 .c-card-number__row {
    text-align: center;
  }
  .c-card-number--v4 .c-card-number__left {
    margin-bottom: 1rem;
  }
  .c-card-number--v4 .c-card-number__left img {
    max-height: 14rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v4 {
    padding: 4rem 3.5rem;
  }
  .c-card-number--v4 .c-card-number__row {
    align-items: center;
    justify-content: space-between;
  }
  .c-card-number--v4 .c-card-number__left {
    min-width: 16rem;
    text-align: center;
  }
  .c-card-number--v4 .c-card-number__right {
    padding-left: 3rem;
    text-align: right;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 5 ----------*/
.c-card-number--v5 .c-list-box-number {
  margin-top: var(--spacing-sp-20-pc-40);
}

@media only screen and (min-width: 768px) {
  .c-card-number--v5 {
    padding: 4rem 3.5rem 3rem 3.5rem;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 6 ----------*/
.c-card-number--v6 .c-card-number__row {
  margin-top: var(--spacing-sp-20-pc-40);
}

@media only screen and (max-width: 767px) {
  .c-card-number--v6 .c-card-number__left {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v6 {
    padding: 4rem;
  }
  .c-card-number--v6 .c-card-number__right {
    flex: 1;
    padding-left: 2rem;
    text-align: center;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 7 ----------*/
.c-card-number--v7 .c-card-number__row {
  margin-top: var(--spacing-sp-25-pc-45);
}

@media only screen and (max-width: 767px) {
  .c-card-number--v7 .c-card-number__left {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v7 {
    padding: 4rem 5rem;
  }
  .c-card-number--v7 .c-card-number__row {
    justify-content: space-between;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 8 ----------*/
.c-card-number--v8 .c-card-number__row {
  margin-top: var(--spacing-sp-25-pc-45);
}

@media only screen and (max-width: 767px) {
  .c-card-number--v8 .c-card-number__left {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v8 {
    padding: 4rem;
  }
  .c-card-number--v8 .c-card-number__row {
    justify-content: space-between;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 9 ----------*/
@media only screen and (max-width: 767px) {
  .c-card-number--v9 .c-card-number__row {
    margin-top: 2.5rem;
  }
  .c-card-number--v9 .c-card-number__left {
    margin-bottom: 1rem;
  }
  .c-card-number--v9 .c-card-number__right {
    display: flex;
    justify-content: center;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v9 {
    padding: 4rem;
  }
  .c-card-number--v9 .c-card-number__row {
    align-items: flex-end;
    justify-content: space-between;
    margin-top: 1.5rem;
  }
  .c-card-number--v9 .c-card-number__left {
    padding-bottom: 2rem;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 10 ----------*/
.c-card-number--v10 .c-list-box-number {
  text-align: center;
}

@media only screen and (min-width: 576px) {
  .c-card-number--v10 .c-list-box-number {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
@media only screen and (max-width: 767px) {
  .c-card-number--v10 .c-list-box-number {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v10 {
    padding: 4rem;
  }
  .c-card-number--v10 .c-list-box-number {
    margin-top: 1.7rem;
  }
}
/*---------- START COMPONENT CARD NUMBER VERSION 11 ----------*/
.c-card-number--v11 .c-card-number__row {
  margin-top: var(--spacing-sp-25-pc-45);
}

@media only screen and (max-width: 767px) {
  .c-card-number--v11 .c-card-number__left {
    margin-bottom: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-card-number--v11 {
    padding: 4rem 5rem;
  }
  .c-card-number--v11 .c-card-number__row {
    justify-content: space-between;
  }
}
/*---------- START COMPONENT LIST ITEM NUMBER VERSION 1 ----------*/
.c-list-item-number--v1 .c-item-number:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .c-list-item-number--v1 .c-item-number {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-item-number--v1 .c-item-number {
    margin-top: 1.5rem;
  }
}
/*---------- START COMPONENT LIST ITEM NUMBER VERSION 2 ----------*/
.c-list-item-number--v2 {
  display: flex;
  justify-content: center;
}

@media only screen and (max-width: 767px) {
  .c-list-item-number--v2 {
    margin: 0 -1.5rem;
  }
  .c-list-item-number--v2 .c-item-number {
    margin: 0 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-item-number--v2 {
    margin: 0 -3rem;
  }
  .c-list-item-number--v2 .c-item-number {
    margin: 0 3rem;
  }
}
/*---------- START COMPONENT ITEM NUMBER VERSION VERSION 1 ----------*/
.c-item-number--v1 {
  display: flex;
  align-items: flex-end;
}
.c-item-number--v1 .c-item-number__left, .c-item-number--v1 .c-item-number__right {
  line-height: 1.5;
  font-weight: 500;
}
.c-item-number--v1 .c-item-number__center {
  margin: 0 1.7rem;
  color: var(--theme-color-eighteenth);
  line-height: 1;
  font-weight: 900;
}
.c-item-number--v1 .c-item-number__right {
  margin-left: auto;
}

@media only screen and (max-width: 767px) {
  .c-item-number--v1 .c-item-number__left, .c-item-number--v1 .c-item-number__right {
    font-size: 1.6rem;
  }
  .c-item-number--v1 .c-item-number__center {
    font-size: 5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-number--v1 .c-item-number__left, .c-item-number--v1 .c-item-number__right {
    font-size: 2rem;
  }
  .c-item-number--v1 .c-item-number__center {
    font-size: 6rem;
  }
}
/*---------- START COMPONENT ITEM NUMBER VERSION VERSION 2 ----------*/
.c-item-number--v2 {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.c-item-number--v2 .c-item-number__header {
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-item-number--v2 .c-item-number__body {
  margin-top: 1.1rem;
}
.c-item-number--v2 .c-item-number__title {
  margin-bottom: 0.2rem;
  line-height: 1.5;
  font-weight: 500;
}
.c-item-number--v2 .c-item-number__price strong {
  color: var(--theme-color-eighteenth);
  line-height: 1;
  font-weight: 900;
}
.c-item-number--v2 .c-item-number__price small {
  line-height: 1.5;
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-item-number--v2 {
    justify-content: flex-end;
  }
  .c-item-number--v2 .c-item-number__header {
    min-height: 7.5rem;
  }
  .c-item-number--v2 .c-item-number__title {
    font-size: 1.6rem;
  }
  .c-item-number--v2 .c-item-number__price strong {
    font-size: 5rem;
  }
  .c-item-number--v2 .c-item-number__price small {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-item-number--v2 {
    justify-content: space-between;
  }
  .c-item-number--v2 .c-item-number__header {
    min-height: 9.6rem;
  }
  .c-item-number--v2 .c-item-number__title {
    font-size: 2rem;
  }
  .c-item-number--v2 .c-item-number__price strong {
    font-size: 6rem;
  }
  .c-item-number--v2 .c-item-number__price small {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT HEADING NUMBER ----------*/
.c-heading-number {
  text-align: center;
}
.c-heading-number__text {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding: 0 1rem;
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 700;
}
.c-heading-number__text::before {
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0.8rem;
  border-radius: 0.3rem;
  opacity: 0.3;
  background-color: var(--theme-color-eighteenth);
}

/*---------- START COMPONENT LIST BOX NUMBER VERSION 2 ----------*/
@media only screen and (max-width: 767px) {
  .c-list-box-number--v2 .c-box-number {
    margin-top: 2rem;
  }
  .c-list-box-number--v2 .c-box-number:first-child {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-box-number--v2 {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 -3.7rem;
  }
  .c-list-box-number--v2 .c-box-number {
    margin: 0 3.7rem;
  }
}
/*---------- START COMPONENT BOX NUMBER ----------*/
.c-box-number__text, .c-box-number__note {
  line-height: 1.5;
}
.c-box-number__price span,
.c-box-number__price small {
  font-weight: 500;
}
.c-box-number__price strong {
  color: var(--theme-color-eighteenth);
  line-height: 1;
  font-weight: 900;
}
.c-box-number__note {
  font-weight: 500;
}

@media only screen and (max-width: 767px) {
  .c-box-number__price--md span {
    font-size: 1.6rem;
  }
  .c-box-number__price--md strong {
    font-size: 8.5rem;
  }
  .c-box-number__price--md small {
    font-size: 2.5rem;
  }
  .c-box-number__price--sm strong {
    font-size: 5rem;
  }
  .c-box-number__price--sm small {
    font-size: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-number__price--md span {
    font-size: 2rem;
  }
  .c-box-number__price--md strong {
    font-size: 12.5rem;
  }
  .c-box-number__price--md small {
    font-size: 4rem;
  }
  .c-box-number__price--sm strong {
    font-size: 6rem;
  }
  .c-box-number__price--sm small {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT BOX NUMBER VERSION 1 ----------*/
.c-box-number--v1 .c-box-number__note {
  margin-top: -0.5rem;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-box-number--v1 .c-box-number__price small {
    margin-left: 0.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-number--v1 .c-box-number__price small {
    margin-left: 1rem;
  }
}
/*---------- START COMPONENT BOX NUMBER VERSION 2 ----------*/
.c-box-number--v2 .c-box-number__text {
  margin-bottom: -0.5rem;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  .c-box-number--v2 {
    text-align: center;
  }
  .c-box-number--v2 .c-box-number__text {
    font-size: 1.6rem;
  }
  .c-box-number--v2 .c-box-number__price strong {
    font-size: 8rem;
  }
  .c-box-number--v2 .c-box-number__price small {
    font-size: 2.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-number--v2 .c-box-number__text {
    font-size: 2rem;
  }
  .c-box-number--v2 .c-box-number__price strong {
    font-size: 10rem;
  }
  .c-box-number--v2 .c-box-number__price small {
    font-size: 3rem;
  }
}
/*---------- START COMPONENT BOX NUMBER VERSION 3 ----------*/
.c-box-number--v3 .c-box-number__text {
  margin-bottom: -0.5rem;
  text-align: center;
}
.c-box-number--v3 .c-box-number__price {
  text-align: right;
}

@media only screen and (max-width: 767px) {
  .c-box-number--v3 .c-box-number__text {
    font-size: 1.6rem;
  }
  .c-box-number--v3 .c-box-number__price--md strong {
    margin: 0 0.5rem 0 1.5rem;
  }
  .c-box-number--v3 .c-box-number__price--sm {
    margin-top: -0.7rem;
    padding-right: 1.5rem;
  }
  .c-box-number--v3 .c-box-number__price--sm strong {
    margin: 0 0.3rem 0 3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-number--v3 .c-box-number__text {
    font-size: 2rem;
  }
  .c-box-number--v3 .c-box-number__price--md strong {
    margin: 0 1rem 0 2.3rem;
  }
  .c-box-number--v3 .c-box-number__price--sm {
    margin-top: -1.2rem;
    padding-right: 3.5rem;
  }
  .c-box-number--v3 .c-box-number__price--sm strong {
    margin: 0 0.3rem 0 2rem;
  }
}
/*====================================================================================
13. START MESSAGE PAGE.
====================================================================================*/
/*---------- START PROJECT MESSAGE ----------*/
.p-msg .c-chart-msg {
  margin-bottom: var(--spacing-sp-25-pc-50);
}
.p-msg__subtitle, .p-msg__desc {
  text-align: center;
}

/*---------- START COMPONENT POST MESSAGE ----------*/
.c-post-msg__img img {
  border-radius: 2rem;
}
.c-post-msg__title {
  margin-bottom: var(--spacing-sp-15-pc-25);
  color: var(--theme-color-eighteenth);
  font-weight: 700;
}
.c-post-msg .c-box-sign {
  margin-top: var(--spacing-sp-20-pc-25);
}

@media only screen and (max-width: 767px) {
  .c-post-msg__img img {
    height: 55vw;
    max-height: 30rem;
    object-fit: cover;
  }
  .c-post-msg__body {
    padding-top: 2rem;
  }
  .c-post-msg__title {
    font-size: 2.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-post-msg__body {
    padding: 4rem 2.5rem 0 2.5rem;
  }
  .c-post-msg__title {
    font-size: 3rem;
  }
}
/*---------- START COMPONENT BOX MESSAGE ----------*/
.c-box-sign {
  text-align: right;
}
.c-box-sign__text {
  font-weight: 500;
}
.c-box-sign__name {
  line-height: 1.5;
}

@media only screen and (max-width: 767px) {
  .c-box-sign__right {
    margin-top: 0.5rem;
  }
  .c-box-sign__right img {
    width: auto;
    max-height: 3rem;
  }
  .c-box-sign__name {
    font-size: 2.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-sign {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
  }
  .c-box-sign__right {
    margin-left: 2.5rem;
  }
  .c-box-sign__name {
    font-size: 2.6rem;
  }
}
/*---------- START COMPONENT LIST PART MESSAGE ----------*/
.c-list-part-msg .c-part-msg {
  margin-top: var(--spacing-sp-40-pc-80);
}
.c-list-part-msg .c-part-msg:first-child {
  margin-top: 0;
}

/*---------- START COMPONENT PART MESSAGE ----------*/
.c-part-msg__left img {
  border-radius: 2rem;
}
.c-part-msg__heading {
  position: relative;
  border-radius: 1rem;
  background-color: var(--theme-color-eighteenth);
}
.c-part-msg__title {
  color: var(--theme-color-secondary);
  font-weight: 700;
}
.c-part-msg .c-box-sign {
  margin-top: var(--spacing-sp-20-pc-30);
}

@media only screen and (max-width: 767px) {
  .c-part-msg {
    position: relative;
  }
  .c-part-msg::before {
    position: absolute;
    content: "";
    z-index: -1;
    top: 38vw;
    left: 50%;
    bottom: 0;
    width: 100vw;
    transform: translateX(-50%);
    background-color: var(--theme-color-fourteenth);
  }
  .c-part-msg__right {
    margin-top: -2rem;
    padding: 0 2rem;
  }
  .c-part-msg__heading {
    padding: 1.5rem;
  }
  .c-part-msg__title {
    font-size: 1.8rem;
  }
  .c-part-msg__body {
    padding: 2rem 0 3.5rem 0;
  }
}
@media only screen and (min-width: 768px) {
  .c-part-msg:nth-child(odd) .c-part-msg__right {
    margin-left: -17rem;
    padding: 0 3rem 5rem 0;
  }
  .c-part-msg:nth-child(even) .c-part-msg__row {
    flex-direction: row-reverse;
  }
  .c-part-msg:nth-child(even) .c-part-msg__right {
    margin-right: -15.5rem;
    padding: 0 0 5rem 3rem;
  }
  .c-part-msg__row {
    display: flex;
    align-items: flex-end;
  }
  .c-part-msg__left {
    width: 60rem;
  }
  .c-part-msg__right {
    flex: 1;
  }
  .c-part-msg__heading {
    padding: 2.2rem 3rem 2.2rem 5rem;
  }
  .c-part-msg__title {
    font-size: 2rem;
    line-height: 1.7;
  }
  .c-part-msg__body {
    position: relative;
    padding: 3.2rem 3rem 5rem 3rem;
  }
  .c-part-msg__body::before {
    position: absolute;
    content: "";
    z-index: -1;
    top: -10rem;
    left: 50%;
    bottom: 0;
    width: 100vw;
    transform: translateX(-50%);
    background-color: var(--theme-color-fourteenth);
  }
}
/*---------- START COMPONENT CHART MESSAGE ----------*/
.c-chart-msg__wrap {
  border-radius: 2rem;
  background-color: var(--theme-color-twenty-third);
}
.c-chart-msg__line {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media only screen and (max-width: 379px) {
  .c-chart-msg__line--v1, .c-chart-msg__line--v3 {
    padding-right: 9.5vw;
  }
}
@media only screen and (min-width: 380px) and (max-width: 575px) {
  .c-chart-msg__line--v1, .c-chart-msg__line--v3 {
    padding-right: 8.2vw;
  }
}
@media only screen and (min-width: 576px) {
  .c-chart-msg__line--v2 .c-box-msg {
    flex: 1;
  }
}
@media only screen and (max-width: 767px) {
  .c-chart-msg__wrap {
    padding: 3rem 1rem;
  }
  .c-chart-msg__logo {
    width: 20vw;
    margin: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-chart-msg__wrap {
    width: 100%;
    max-width: 92rem;
    margin: 0 auto;
    padding: 5rem;
  }
  .c-chart-msg__logo {
    width: 23.5rem;
    margin: 3.5rem;
  }
}
/*---------- START COMPONENT BOX MESSAGE ----------*/
.c-box-msg__wrap {
  position: relative;
  padding: 0.9rem 0.5rem;
  border-width: 1px;
  border-style: solid;
  background-color: var(--theme-color-secondary);
  text-align: center;
}
.c-box-msg__wrap::before {
  position: absolute;
  content: "";
}
.c-box-msg__text {
  font-weight: 700;
}

@media only screen and (max-width: 575px) {
  .c-box-msg__wrap {
    border-radius: 0.7rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-box-msg__wrap {
    border-radius: 1rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-box-msg__text {
    font-size: clamp(1.4rem, 2.8vw, 1.8rem);
    line-height: 1.35;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg__text {
    font-size: 2rem;
  }
}
/*---------- START COMPONENT BOX MESSAGE VERSION 1, VERSION 4 ----------*/
.c-box-msg--v1 .c-box-msg__wrap::before,
.c-box-msg--v4 .c-box-msg__wrap::before {
  left: 50%;
  transform: translateX(-50%);
}

@media only screen and (max-width: 767px) {
  .c-box-msg--v1 .c-box-msg__wrap,
  .c-box-msg--v4 .c-box-msg__wrap {
    width: clamp(20.5rem, 55vw, 26rem);
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg--v1 .c-box-msg__wrap,
  .c-box-msg--v4 .c-box-msg__wrap {
    width: 27.5rem;
  }
}
/*---------- START COMPONENT BOX MESSAGE VERSION 2, VERSION 3 ----------*/
.c-box-msg--v2 .c-box-msg__wrap::before,
.c-box-msg--v3 .c-box-msg__wrap::before {
  top: 50%;
  transform: translateY(-50%);
}

/*---------- START COMPONENT BOX MESSAGE VERSION 1 ----------*/
.c-box-msg--v1 .c-box-msg__wrap {
  border-color: var(--theme-color-eighteenth);
}
.c-box-msg--v1 .c-box-msg__text {
  color: var(--theme-color-eighteenth);
}

@media only screen and (max-width: 767px) {
  .c-box-msg--v1 .c-box-msg__wrap::before {
    bottom: -1.2rem;
    border-left: 1.2rem solid transparent;
    border-right: 1.2rem solid transparent;
    border-top: 1.2rem solid var(--theme-color-eighteenth);
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg--v1 .c-box-msg__wrap::before {
    bottom: -1.5rem;
    border-left: 1.5rem solid transparent;
    border-right: 1.5rem solid transparent;
    border-top: 1.5rem solid var(--theme-color-eighteenth);
  }
}
/*---------- START COMPONENT BOX MESSAGE VERSION 2 ----------*/
.c-box-msg--v2 .c-box-msg__wrap {
  margin-left: auto;
  border-color: var(--theme-color-sixteenth);
}
.c-box-msg--v2 .c-box-msg__text {
  color: var(--theme-color-sixteenth);
}

@media only screen and (max-width: 767px) {
  .c-box-msg--v2 .c-box-msg__wrap {
    width: clamp(8rem, 20vw, 14rem);
  }
  .c-box-msg--v2 .c-box-msg__wrap::before {
    right: -1.2rem;
    border-top: 0.8rem solid transparent;
    border-left: 1.2rem solid var(--theme-color-sixteenth);
    border-bottom: 0.8rem solid transparent;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg--v2 .c-box-msg__wrap {
    width: 20rem;
  }
  .c-box-msg--v2 .c-box-msg__wrap::before {
    right: -1.5rem;
    border-top: 1rem solid transparent;
    border-left: 1.5rem solid var(--theme-color-sixteenth);
    border-bottom: 1rem solid transparent;
  }
}
/*---------- START COMPONENT BOX MESSAGE VERSION 3 ----------*/
.c-box-msg--v3 .c-box-msg__wrap {
  border-color: var(--theme-color-twenty-second);
}
.c-box-msg--v3 .c-box-msg__text {
  color: var(--theme-color-twenty-second);
}

@media only screen and (max-width: 767px) {
  .c-box-msg--v3 .c-box-msg__wrap {
    width: clamp(11.5rem, 24vw, 16rem);
  }
  .c-box-msg--v3 .c-box-msg__wrap::before {
    left: -1.2rem;
    border-top: 0.8rem solid transparent;
    border-right: 1.2rem solid var(--theme-color-twenty-second);
    border-bottom: 0.8rem solid transparent;
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg--v3 .c-box-msg__wrap {
    width: 25.5rem;
  }
  .c-box-msg--v3 .c-box-msg__wrap::before {
    left: -1.5rem;
    border-top: 1rem solid transparent;
    border-right: 1.5rem solid var(--theme-color-twenty-second);
    border-bottom: 1rem solid transparent;
  }
}
/*---------- START COMPONENT BOX MESSAGE VERSION 4 ----------*/
.c-box-msg--v4 .c-box-msg__wrap {
  border-color: var(--theme-color-twenty-fourth);
}
.c-box-msg--v4 .c-box-msg__text {
  color: var(--theme-color-twenty-fourth);
}

@media only screen and (max-width: 767px) {
  .c-box-msg--v4 .c-box-msg__wrap::before {
    top: -1.2rem;
    border-left: 1.2rem solid transparent;
    border-right: 1.2rem solid transparent;
    border-bottom: 1.2rem solid var(--theme-color-twenty-fourth);
  }
}
@media only screen and (min-width: 768px) {
  .c-box-msg--v4 .c-box-msg__wrap::before {
    top: -1.5rem;
    border-left: 1.5rem solid transparent;
    border-right: 1.5rem solid transparent;
    border-bottom: 1.5rem solid var(--theme-color-twenty-fourth);
  }
}
/*---------- START COMPONENT LIST BLOCK MESSAGE ----------*/
.c-list-block-msg .c-block-msg:not(:first-child) {
  margin-top: var(--spacing-sp-25-pc-45);
}

/*---------- START COMPONENT BLOCK MESSAGE ----------*/
.c-block-msg {
  text-align: center;
}
.c-block-msg__title {
  margin-bottom: var(--spacing-sp-15-pc-25);
}
.c-block-msg__img img {
  border-radius: 2rem;
}

.c-block-msg__desc {
  text-align: left;

  @media (min-width: 768px) {
    text-align: center;
  }
}

/*====================================================================================
14. START SELECTION PAGE.
====================================================================================*/
/*---------- START PROJECT SELECTION ----------*/
.p-sel .c-list-step-sel {
  margin-top: var(--spacing-sp-25-pc-50);
}

/*---------- START COMMON BANNER SELECTION ----------*/
.c-bnr-sel {
  padding: 4rem 0 5rem 0;
  background-color: var(--theme-color-nineteenth);
}
.c-bnr-sel__text {
  margin-bottom: var(--spacing-sp-15-pc-25);
  font-size: 2rem;
  font-weight: 500;
  text-align: center;
}
.c-bnr-sel__list {
  background-color: var(--theme-color-secondary);
}
.c-bnr-sel__item a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.c-bnr-sel__item a img {
  width: auto;
}
.c-bnr-sel__item--mynavi a {
  padding: 2rem;
  border: 2px solid #00aaeb;
}
.c-bnr-sel__item--mynavi a img {
  width: auto;
  height: 4rem;
}
.c-bnr-sel__item--career {
  flex: 1;
}
.c-bnr-sel__item--career a {
  text-align: center;
}
.c-bnr-sel__item--career a img {
  max-height: 100%;
}

@media only screen and (max-width: 767px) {
  .c-bnr-sel__list {
    padding: 2rem 2rem 0 2rem;
  }
  .c-bnr-sel__item--career a {
    padding: 2rem 0;
  }
  .c-bnr-sel__item a {
    height: 9.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-bnr-sel__list {
    display: flex;
    max-width: 93.5rem;
    margin: 0 auto;
    padding: 2rem 0 2rem 2rem;
  }
  .c-bnr-sel__item a {
    height: 11rem;
  }
  .c-bnr-sel__item a:hover img {
    transform: scale(1.015);
  }
}
/*---------- START COMPONENT LIST STEP SELECTION ----------*/
.c-list-step-sel {
  position: relative;
}
.c-list-step-sel::before {
  position: absolute;
  content: "";
  top: 0;
  width: 1px;
  height: 100%;
  background: url("./../common_img/bd-vertical-gray.webp") repeat-y center top/100% auto;
}
.c-list-step-sel .c-step-sel {
  margin-top: var(--spacing-sp-30-pc-50);
}
.c-list-step-sel .c-step-sel:first-child {
  margin-top: 0;
}

@media only screen and (max-width: 767px) {
  .c-list-step-sel {
    padding-left: 6rem;
  }
  .c-list-step-sel::before {
    left: 1.7rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-list-step-sel {
    padding-left: 12rem;
  }
  .c-list-step-sel::before {
    left: 4rem;
  }
}
/*---------- START COMPONENT LIST STEP SELECTION ----------*/
.c-step-sel {
  position: relative;
}
.c-step-sel__tag {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 0.2rem;
  background-color: var(--theme-color-eighteenth);
}
.c-step-sel__tag::before {
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
}
.c-step-sel__tag p {
  color: var(--theme-color-secondary);
  line-height: 1;
  font-weight: 700;
}
.c-step-sel__header {
  border-bottom: 1px solid var(--theme-color-eighteenth);
}
.c-step-sel__img img {
  width: 100%;
}
.c-step-sel__btn {
  margin-top: var(--spacing-sp-20-pc-25);
}

@media only screen and (max-width: 575px) {
  .c-step-sel__img img {
    border-radius: 1.5rem;
  }
}
@media only screen and (min-width: 576px) {
  .c-step-sel__img img {
    border-radius: 2rem;
  }
}
@media only screen and (max-width: 767px) {
  .c-step-sel__tag {
    top: -0.2rem;
    left: -6.5rem;
    width: 4.5rem;
    height: 4rem;
    border-radius: 0.7rem;
  }
  .c-step-sel__tag::before {
    right: -0.7rem;
    border-top: 0.7rem solid transparent;
    border-left: 0.7rem solid var(--theme-color-eighteenth);
    border-bottom: 0.7rem solid transparent;
  }
  .c-step-sel__tag p {
    font-size: 2.4rem;
  }
  .c-step-sel__header {
    padding-bottom: 0.7rem;
  }
  .c-step-sel__title {
    font-size: 2rem;
  }
  .c-step-sel__body {
    padding-top: 2rem;
  }
  .c-step-sel__img {
    margin-bottom: 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-step-sel__tag {
    left: -12rem;
    width: 8rem;
    height: 6rem;
    border-radius: 1rem;
  }
  .c-step-sel__tag::before {
    right: -1rem;
    border-top: 1rem solid transparent;
    border-left: 1rem solid var(--theme-color-eighteenth);
    border-bottom: 1rem solid transparent;
  }
  .c-step-sel__tag p {
    font-size: 3.4rem;
  }
  .c-step-sel__row {
    display: flex;
  }
  .c-step-sel__left {
    flex: 1;
    padding-top: 1rem;
  }
  .c-step-sel__right {
    width: 48.5rem;
    padding-left: 5rem;
  }
  .c-step-sel__header {
    padding-bottom: 1.2rem;
  }
  .c-step-sel__title {
    font-size: 2.4rem;
  }
  .c-step-sel__body {
    padding-top: 2.3rem;
  }
  .c-step-sel__btn .c-btn {
    max-width: 40rem;
  }
}
/*---------- START COMMON TABLE SELECTION ----------*/
.c-tbl-sel table tr th,
.c-tbl-sel table tr td {
  vertical-align: top;
  border-top: 1px solid var(--theme-color-fifteenth);
  border-bottom: 1px solid var(--theme-color-fifteenth);
}
.c-tbl-sel table tr th {
  position: relative;
  z-index: 2;
}
.c-tbl-sel table tr th::before {
  position: absolute;
  content: "";
  z-index: -1;
  top: 1rem;
  left: 0;
  right: 0;
  bottom: 1rem;
  background-color: var(--theme-color-seventeenth);
}

@media only screen and (max-width: 767px) {
  .c-tbl-sel table tr th {
    width: 10rem;
    padding: 2rem 1rem;
    font-size: 1.6rem;
  }
  .c-tbl-sel table tr th::before {
    border-radius: 0.7rem;
  }
  .c-tbl-sel table tr td {
    padding: 2.2rem 0 2.2rem 2rem;
  }
}
@media only screen and (min-width: 768px) {
  .c-tbl-sel table tr th {
    width: 20rem;
    padding: 2.5rem 1rem;
    font-size: 1.8rem;
  }
  .c-tbl-sel table tr th::before {
    border-radius: 1rem;
  }
  .c-tbl-sel table tr td {
    padding: 2.6rem 0 2.6rem 5rem;
  }
}