/*===========================================================================
layout
全ページ共通レイアウト用CSS
接頭辞【.l-】

【予測変換用 _base.css記述】
:root {
  --font-color-base: #333;
  --font-color-main: #005bab;
  --font-family-base: "Noto Sans JP", sans-serif;
  --font-family-roboto: "Roboto", sans-serif;
  --back-color-base: #fff;
  --back-color-gradient: linear-gradient(100deg, #4896db 1.76%, #0e67b4 26.76%, #005bab 98.94%);
  --design-size-pc: 1400;
  --design-size-sp: 750;
}
===========================================================================*/

/* .wrap関連
------------------------------------*/
.l-wrp {
  --pc-hdr-height: 100rem;
  --pc-hdr-follow-height: 57rem;
  --hdr-transform: 0.3s linear;
  overflow: hidden;
  min-width: 1000rem;
  padding-top: var(--pc-hdr-height);
}
/* SP
-------------------------------------*/
@media screen and (max-width: 768px) {
  .l-wrp {
    --sp-hdr-height: 124rem;
    min-width: 0;
    padding-top: var(--sp-hdr-height);
  }
}

/* .main関連
------------------------------------*/
.l-mai {
}
.l-mai:has( > .l-localNav) {
  padding-top: 66rem;
}
/* PC
----------------------------------*/
@media screen and (min-width: 769px) {
	.js-hdr-follow .l-mai {
    padding-top: 0;
	}
}
@media screen and (max-width: 768px) {
  .l-mai:has( > .l-localNav) {
    padding-top: 113rem;
  }
}


/* コンテンツ幅/固定余白関連
------------------------------------*/
.l-wid {
  max-width: 1200rem;
  margin: 0 auto;
}
.l-idt {
  padding: 0 40rem;
}
/* SP
----------------------------------*/
@media screen and (max-width: 768px) {
  .l-wid {
    max-width: none;
  }
  .l-idt {
    padding: 0 40rem;
  }
}

/* フレックス関連
------------------------------------*/
.l-grd {
  display: flex;
}
.l-grd-wrp {
  display: flex;
  flex-wrap: wrap;
}
.l-grd-1 {
  flex: 1;
}
.l-grd-2 {
  width: calc(100% / 2);
}
.l-grd-3 {
  width: calc(100% / 3);
}
.l-grd-4 {
  width: calc(100% / 4);
}
.l-grd-5 {
  width: calc(100% / 5);
}
.l-grd-6 {
  width: calc(100% / 6);
}


/* スライダーdoc
------------------------------------*/
.l-sldDoc {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.l-sldDoc__inr {
  position: relative;
  padding: 0 30rem;
}
.l-sldDoc .slick-dots {
  display: flex;
  align-items: center;
  justify-content: center;
}
.l-sldDoc .slick-dots li {
  margin: 0 3rem;
}
.l-sldDoc .slick-dots button {
  font-size: 0;
  display: block;
  width: 64rem;
  height: 4rem;
  background-color: #ccc;
}
.l-sldDoc .slick-active button {
  background-color: #00529b;
}
/* SP
----------------------------------*/
@media screen and (max-width: 768px) {
  .l-sldDoc .slick-dots li {
    margin: 0 8rem;
  }
  .l-sldDoc .slick-dots button {
    width: 68rem;
    height: 6rem;
  }
}


.l-ib {
  display: inline-block;
}


/* ローカルナビ
------------------------------------*/
.l-localNav {
  position: fixed;
  top: 100rem;
  left: 0;
  width: 100%;
  padding: 0 40rem;
  z-index: 997;
  background-color: #fff;
  transition: top var(--hdr-transform);
}
.l-localNav__inr {
  max-width: 1200rem;
  margin: 0 auto;
  padding-top: 22rem;
  overflow-x: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  transition: padding-top var(--hdr-transform);
}
.l-localNav__inr::-webkit-scrollbar {
  display: none;
}
.l-localNav__lst {
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}
.l-localNav__itm {
  position: relative;
}
.l-localNav__ttl {
  display: block;
  position: relative;
  padding: 15rem 30rem 14rem;
  border-bottom: 1px solid #D9D9D9;
  font-size: 13rem;
  cursor: pointer;
  text-decoration: none;
}
.l-localNav__ttl.js-current,
.l-localNav__ttl.js-active {
  font-weight: bold;
  color: #005bab;
}
.l-localNav__ttl.js-current::before,
.l-localNav__ttl.js-active::before {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #005bab;
}
.l-localNav__chi {
  position: fixed;
  top: calc(var(--pc-hdr-height) + 66rem);
  left: 0;
  z-index: 998;
  background: #333;
  width: 408rem;
  box-shadow: 4rem 4rem 12rem 0 rgba(0, 0, 0, 0.08);
  overflow: hidden;
  height: 0;
  display: none;
  transition: top var(--hdr-transform);
}
.l-localNav__chiInr {
  padding: 16rem 30rem;
}
.l-localNav__chiItm:not(:last-child) {
  border-bottom: 1px solid #d9d9d9;
}
.l-localNav__chiItm > a {
  display: block;
  position: relative;
  padding: 16rem 38rem;
  color: #fff;
  font-weight: bold;
  font-size: 13rem;
  line-height: 1.5;
  text-decoration: none;
}
.l-localNav__chiItm > a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 8rem;
  transform: translateY(-50%);
  width: 20rem;
  height: 20rem;
  background: url(/company/common/images/icn_arw_r_circle.svg) no-repeat center / contain;
}
@media (any-hover: hover) {
  .l-localNav__chiItm > a:hover {
    text-decoration: underline;
    text-underline-offset: 5rem;
  }
  .l-localNav__ttl:hover {
    font-weight: bold;
    color: #005bab;
  }
  .l-localNav__ttl:hover::before {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #005bab;
  }
}
/* PC
----------------------------------*/
@media screen and (min-width: 769px) {
  .js-hdr-follow .l-localNav {
    top: 57rem;
  }
  .js-hdr-follow .l-localNav__inr {
    padding: 0;
  }
  .js-hdr-follow .l-localNav__chi {
    top: calc(var(--pc-hdr-height) + 1rem);
  }
  .l-localNav__inr.js-dragging {
    cursor: grabbing;
  }
  .l-localNav__inr.js-dragging .l-localNav__itm a {
    cursor: grabbing;
  }
}
/* SP
----------------------------------*/
@media screen and (max-width: 768px) {
  .l-localNav {
    top: var(--sp-hdr-height);
    padding: 0;
  }
  .l-localNav__inr {
    padding-top: 18rem;
  }
  .l-localNav__lst {
    padding: 0 40rem;
  }
  .l-localNav__ttl {
    padding: 24rem 18rem;
    font-size: 26rem;
    line-height: 1.8;
  }
  .l-localNav__chi {
    top: calc(var(--sp-hdr-height) + 113rem);
    width: calc(100% - 80rem);
    left: 40rem;
  }
  .l-localNav__chiInr {
    padding: 4rem 40rem;
    max-height: calc(100vh - (113rem + 124rem * 2));
    max-height: calc(100dvh - (113rem + 124rem * 2));
    overflow-y: auto;
  }
  .l-localNav__chiItm > a {
    padding: 36rem 50rem;
    font-size: 26rem;
    line-height: 1.8;
  }
  .l-localNav__chiItm > a::before {
    left: 0;
    width: 34rem;
    height: 34rem;
  }
}