/* page 共通 */
.cover {
  background-position: center;
  background-size: cover;
  background-color: rgba(255, 255, 255, 0.5);
  background-blend-mode: lighten;
  display: flex;
  width: 100%;
  background-image: url(../images/common/default--cover.jpg);
}
.cover__wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  width: 100%;
}
.cover__container {
  padding: 160px 0px 80px calc((var(--vw) * 100 - 1600px) / 2);
  max-width: 1600px;
}
.cover__container h1 {
  margin-top: 24px;
  margin-bottom: 120px;
}
.cover__container h3 {
  margin-bottom: var(--px-16);
}
/* パンくずリスト */
.breadcrumb ul {
  list-style: none;
}
.breadcrumb li {
  display: inline;
}
.breadcrumb li a {
  color: inherit;
  text-decoration: none;
}
.breadcrumb li:not(:last-of-type)::after {
  content: "";
  display: inline-flex;
  height: 6.4px;
  width: 5.6px;
  aspect-ratio: cos(30deg);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  background: var(--base-black);
  margin: 8px;
}
/* パンくずリストサイド表示 */
.sections__wrapper {
  position: relative;
}
.sections__wrapper .breadcrumb__container {
  display: none;
}
.sections__wrapper .breadcrumb__container.scroll {
  display: block;
  position: fixed;
  transform: rotate(90deg);
  top: 50%;
  z-index: 2;
}
/* スクロールダウン */
.subp .scrolldown {
  color: var(--base-gray);
}
.subp .scrolldown .line {
  background-color: transparent;
}
.subp .scrolldown .line::before {
  background-color: var(--base-gray);
}
/* ----- overfooter-nav ----- */
h3.section__title {
  margin-right: 40px;
}
.title__accent {
  color: var(--corporate-red);
}
.overft__nav--box {
  width: calc(var(--vw) * 50);
  padding: var(--px-80) var(--px-72);
}
.overft__nav--box.overft__nav--next,
.overft__nav--box.contact__box.box__tel {
  padding-right: calc(var(--px-72) + 88px);
}
.p__company .overft__nav--box.overft__nav--prev,
.a__case-study .overft__nav--box.overft__nav--next,
.tax .overft__nav--box.overft__nav--next {
  background-color: rgba(238, 238, 238, 0.68);
  /* height: 100%; */
}
.overft__nav--box.overft__nav--prev,
.overft__nav--box.overft__nav--next {
  display: flex;
}
.overft__nav--text {
  margin-top: var(--px-80);
}
/* nav--next bg-img*/
.overft__nav--box.overft__nav--next,
.p__company .overft__nav--box.overft__nav--next,
.p__services .overft__nav--box.overft__nav--prev,
.a__case-study .overft__nav--box.overft__nav--prev,
.tax .overft__nav--box.overft__nav--prev,
#news__archive .overft__nav--box.overft__nav--prev {
  background-image: url(../images/common/overft__nav--bg01.jpg);
  background-size: cover;
  background-blend-mode: lighten;
  position: relative;
}
.overft__nav--box.overft__nav--next {
  justify-content: flex-end;
}
.a__case-study .overft__nav--box.overft__nav--next,
.tax .overft__nav--box.overft__nav--next {
  background-image: unset;
}
/* nav--next bg gray*/
.overft__nav--box.overft__nav--next::before,
.p__services .overft__nav--box.overft__nav--next::before,
.a__case-study .overft__nav--box.overft__nav--next::before,
.tax .overft__nav--box.overft__nav--next::before,
.p__services .overft__nav--box.overft__nav--prev::before,
.a__case-study .overft__nav--box.overft__nav--prev::before,
.tax .overft__nav--box.overft__nav--prev::before,
#news__archive .overft__nav--box.overft__nav--prev::before,
#news__archive .overft__nav--box.overft__nav--next::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(238, 238, 238, 0.8);
}
.p__services .overft__nav--box.overft__nav--prev::before,
.p__services .overft__nav--box.overft__nav--next::before,
.a__case-study .overft__nav--box.overft__nav--next::before,
.tax .overft__nav--box.overft__nav--next::before,
#news__archive .overft__nav--box.overft__nav--next::before {
  background-color: rgba(238, 238, 238, 0.56);
}
.overft__nav--text {
  position: relative;
  z-index: 3;
  display: inline-block;
}
.trim {
  /* 任意 */
  min-width: 100px; /* 最小表示幅の指定 */
  max-width: 200px; /* 最大表示幅の指定 */

  /* 必須 */
  white-space: nowrap; /* 空白で改行させない */
  overflow: hidden; /* はみ出た部分を表示しない */
  text-overflow: ellipsis; /* はみ出た場合に「…」を表示 */
  -webkit-text-overflow: ellipsis; /* はみ出た場合に「…」を表示 (Safari用) */
  -o-text-overflow: ellipsis; /* はみ出た場合に「…」を表示 (Opera用) */
}
/* text under arrow */
.overft__nav--next .next-line,
.overft__nav--prev .prev-line {
  display: inline-block;
  position: relative;
  background-color: var(--base-black);
  height: 1px;
  width: 100%;
  margin-top: var(--px-8);
}
.overft__nav--next .next-line::after,
.overft__nav--prev .prev-line::after {
  content: "";
  height: 1px;
  width: 16px;
  background-color: var(--base-black);
  position: absolute;
  right: 0;
  top: -4px;
  border-radius: 1px;
  transform: translateY(-50%) rotate(30deg);
}
.overft__nav--prev .prev-line::after {
  right: initial;
  left: 0;
  transform: rotate(-30deg);
}
.single .overft__nav--next .next-line,
.single .overft__nav--prev .prev-line {
  background-color: var(--base-gray);
}
/* overft nav prev arrow */
.p__company .overft__nav--prev span.prev-arrow,
.a__case-study .overft__nav--next span.next-arrow,
.tax .overft__nav--next span.next-arrow,
#news__archive .overft__nav--next span.next-arrow {
  background-color: var(--base-black);
  border-radius: 0.75px;
  display: inline-block;
  height: 0.75px;
  margin-left: 6px;
  position: relative;
  transform-origin: center;
  transform: rotate(45deg);
  transition: all 0.2s ease-in-out;
  vertical-align: middle;
  width: var(--px-12);
}
.a__case-study .overft__nav--next span.next-arrow,
.tax .overft__nav--next span.next-arrow,
#news__archive .overft__nav--next span.next-arrow {
  transform: rotate(135deg);
}

.p__company .overft__nav--prev span.prev-arrow::before,
.a__case-study .overft__nav--next span.next-arrow::before,
.tax .overft__nav--next span.next-arrow::before,
#news__archive .overft__nav--next span.next-arrow::before {
  content: "";
  display: block;
  width: var(--px-8);
  height: 0.75px;
  border-radius: 0.75px;
  background-color: var(--base-black);
  position: absolute;
  left: -0.1rem;
  top: -0.1732rem;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.p__company .overft__nav--prev span.prev-arrow::after,
.a__case-study .overft__nav--next span.next-arrow::after,
.tax .overft__nav--next span.next-arrow::after,
#news__archive .overft__nav--next span.next-arrow::after {
  content: "";
  display: block;
  width: var(--px-8);
  height: 0.75px;
  border-radius: 0.75px;
  background-color: var(--base-black);
  position: absolute;
  left: -0.1rem;
  top: 0.14142rem;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.overft__nav--box.contact__box {
  display: flex;
}
.contact__box.box__recruit {
  background-color: rgba(217, 0, 0, 0.8);
  width: 50%;
}
.contact__box.box__tel {
  background-color: var(--base-white);
  width: 50%;
}
.contact__box--p {
  border-left: 0.5px solid var(--base-white);
  padding: 0 0 24px 32px;
  height: fit-content;
}
.contact__box--p span {
  display: inline-block;
}
.box__tel .contact__box--p {
  border-left: 0.5px solid var(--base-black);
}
.box__tel a:hover {
  opacity: 1;
}
.tel-to {
  margin-top: 24px;
  white-space: nowrap;
}
/* ----------------------------- */
/* ------- メディアクエリ ------- */
/* ---------------------------- */

@media screen and (width > 1024px) and (height <= 1000px) {
  .subp .js-scrolldown {
    top: unset;
    bottom: 32% !important;
  }
}
@media screen and (height < 625px) {
  p.header__copy {
    display: none;
  }
  .subp .js-scrolldown {
    transform: unset;
    top: unset;
    bottom: 0 !important;
  }
}

@media screen and (width <= 1920px) {
  .cover__container {
    padding: 160px 9.6% 80px;
  }
}
@media screen and (width <= 1024px) {
  .sections__wrapper .breadcrumb__container.scroll {
    left: -24px;
  }
  .overft__wrapper .contact__container {
    flex-direction: column;
  }
  .contact__box.box__recruit {
    width: 80%;
  }
  .overft__nav--box {
    padding: var(--px-72) var(--px-56);
  }
  .overft__nav--box.overft__nav--next,
  .overft__nav--box.contact__box.box__tel {
    padding-right: var(--px-56);
  }
  .overft__nav--box.overft__nav--prev,
  .overft__nav--box.overft__nav--next {
    max-height: 220px;
  }
  .overft__nav--text {
    margin-top: var(--px-40);
  }
  .contact__box {
    align-items: center;
    padding: 7.2% clamp(1.25rem, -0.909rem + calc(var(--vw) * 10.8), 6rem);
  }
}
@media screen and (width <= 768px) {
  .cover__headline--wrap {
    flex-direction: column;
  }
  .sections__wrapper .breadcrumb__container.scroll {
    left: -32px;
  }
}
@media screen and (width <= 500px) {
  .cover__container {
    padding: 120px 9.6% 80px;
  }
  .cover__container h1 {
    margin: var(--px-16) 0 var(--px-40);
  }
  .overft__nav--box {
    padding: var(--px-40) var(--px-24);
  }
  .overft__nav--box.overft__nav--prev,
  .overft__nav--box.overft__nav--next {
    padding: var(--px-24);
  }
}
@media screen and (width <= 430px) {
  .overft__nav--container.flex__row {
    flex-direction: column;
  }
  .overft__nav--box.overft__nav--prev,
  .overft__nav--box.overft__nav--next {
    width: 100%;
  }
  .contact__box .flex__row {
    flex-direction: column;
  }
  .contact__box--title {
    margin-bottom: var(--px-24);
  }
}

@media screen and (width <= 390px) {
  .cover__container {
    padding: 160px 4.8% 80px;
  }
  .customer__needs {
    font-size: var(--px-14);
  }
  .services__name {
    font-size: var(--px-18);
  }
}
