@charset "utf-8";

.only-sp,
.w1200 {
  display: none;
}
.page-title {
  margin-bottom: 80px;
  padding-top: 70px;
}

.nav-list {
  display: flex;
  justify-content: center;
  width: 1100px;
  max-width: calc(100% - 60px);
  margin: 0 auto;
  margin-bottom: 100px;
}
.nav-list li {
  width: 25%;
  height: 170px;
  border-right: 2px solid var(--border-color3);
}
.nav-list li:last-child {
  border-right: none;
}
.nav-list li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  padding-top: 20px;
}
.nav-list li a figure {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 68px;
}
.nav-list li a span {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(2lh + 20px);
  padding-top: 20px;
  font-size: 1.6rem;
  line-height: 1.34;
  text-align: center;
}
.section-service {
  width: 1100px;
  max-width: calc(100% - 60px);
  margin: 0 auto;
}
.section-service * {
  line-height: 1.778;
}
.section-service .service-title {
  position: relative;
  font-size: 2.2rem;
  font-weight: bold;
  margin-bottom: 50px;
}
.section-service .service-title:has(+ p) {
  margin-bottom: 30px;
}
.section-service .service-title::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 1px;
  background: var(--text-color);
}
.section-service .service-title span {
  position: relative;
  z-index: 10;
  display: inline-block;
  background: #fff;
  padding-right: 10px;
}
.section-service .service-title span:has(+ span) {
  padding-right: 0;
}
.section-service .service-title + p {
  margin-bottom: 40px;
}

.businesshour-area {
  display: flex;
  gap: 50px;
  width: 1100px;
  max-width: calc(100% - 60px);
  margin: 0 auto 100px;
}
.businesshour-area > dl,
.businesshour-area > div {
  width: calc(50% - 25px);
}
.businesshour-area > dl,
.businesshour-area > div > dl {
  border-top: 1px solid var(--border-color2);
}
.businesshour-area > dl > dt,
.businesshour-area > dl > dd,
.businesshour-area > div > dl > dt,
.businesshour-area > div > dl > dd {
  font-weight: 500;
  border-bottom: 1px solid var(--border-color2);
}
.businesshour-area > div > dl {
  margin-bottom: 10px;
}
.businesshour-area > div > p {
  font-size: 1.4rem;
}
.businesshour-list {
  display: flex;
  flex-wrap: wrap;
  font-size: 1.8rem;
}
.businesshour-list dt {
  display: flex;
  align-items: center;
  justify-content: center;
}
.businesshour-list > dt {
  width: 100px;
  background: var(--bg-cardmenu);
}
.businesshour-list > dd {
  width: calc(100% - 100px);
  font-size: 1.6rem;
}
.businesshour-list .inner-dl {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0;
}
.businesshour-list .inner-dl:first-child {
  margin-bottom: 30px;
  padding-bottom: 0;
}
.businesshour-list .inner-dl + .inner-dl {
  margin-block: 30px;
  padding-block: 0;
}
.businesshour-list .inner-dl:last-child {
  margin-bottom: 0;
  padding-bottom: 30px;
}
.businesshour-list .inner-dl dt {
  width: 180px;
  padding: 0 8px;
}
.businesshour-list .inner-dl dd {
  width: calc(100% - 180px);
}
.businesshour-list .inner-dl p {
  font-size: 1.2rem;
  font-weight: normal;
}

.inner-box {
  display: flex;
  justify-content: space-between;
  gap: 60px;
  width: 1100px;
  max-width: calc(100% - 60px);
  margin: 0 auto;
  padding-block: 50px;
}
.inner-box:has(+ .inner-box) {
  border-bottom: 1px solid var(--border-color2);
}
.service-title + .inner-box {
  padding-top: 0;
}
.inner-item {
  width: 495px;
  max-width: calc(50% - 30px);
}
.inner-box dt {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--accent-color);
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 20px;
}
.inner-box #locker-slider-list {
  margin-bottom: 20px !important;
}
.inner-box #locker-slider .splide__thumbnails ul {
  gap: 10px;
}
.inner-box #locker-slider .splide__thumbnails li {
  width: calc(33.333% - 20px / 3) !important;
}
.inner-box #locker-slider .splide__thumbnails li img {
  width: 100% !important;
}
.inner-box #locker-slider .locker-slide__figure {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
}
.inner-box #locker-slider .locker-slide__figure img {
  display: block;
  width: 100%;
  height: auto;
}
.inner-box #locker-slider .locker-slide__label {
  position: absolute;
  inset: auto auto 0 0;
  padding: 6px 14px;
  font-size: 1.4rem;
  font-weight: bold;
  color: #fff;
  background: var(--text-color);
}

.babyroom dl {
  max-width: 100%;
}
.babyroom dt {
  margin-bottom: 10px;
}
.inner-item dd {
  font-size: 1.6rem;
}
.inner-item dd a {
  font-size: 1.6rem;
  line-height: 30px;
  text-decoration: underline;
}
.inner-item dd p {
  font-size: 1.6rem;
  line-height: 30px;
}
.inner-item dd p:not(:has(+ p)) {
  margin-bottom: 35px;
}
.inner-item dd .indent {
  padding-left: 1em;
  text-indent: -1em;
  font-size: 1.4rem;
}
.inner-item dd figure {
  width: 374px;
  max-width: 100%;
}
.inner-box.babyroom {
  padding-bottom: 100px;
}
.babyroom dd p:first-child {
  margin-bottom: 30px;
  font-size: 1.6rem;
}
.babyroom-list {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 60px;
  margin-bottom: 100px;
}
.babyroom-list a {
  text-decoration: underline;
}
.babyroom-list li figcaption {
  margin-bottom: 10px;
  font-size: 1.6rem;
  font-weight: bold;
}
/* Babyroom slider styles */
[id^="babyroom-slider-"] {
  position: relative;
  margin-top: 10px;
  width: 100%;
}
[id^="babyroom-slider-"] .splide__arrows {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}
[id^="babyroom-slider-"] .splide__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
[id^="babyroom-slider-"] .splide__slide img {
  display: block;
  width: 100%;
  height: auto;
}
[id^="babyroom-slider-"] .splide__arrow {
  background: none;
  opacity: 0.8;
  width: 40px;
  height: 40px;
}
[id^="babyroom-slider-"] .splide__arrow:hover {
  opacity: 1;
}
[id^="babyroom-slider-"] .splide__arrow svg {
  width: 20px;
  height: 20px;
  fill: var(--text-color);
}
[id^="babyroom-slider-"] .splide__arrow--prev {
  left: -40px;
}
[id^="babyroom-slider-"] .splide__arrow--next {
  right: -40px;
}
[id^="babyroom-slider-"] .splide__pagination {
  bottom: -30px;
}
[id^="babyroom-slider-"] .splide__pagination__page {
  background: var(--border-color2);
  opacity: 0.5;
}
[id^="babyroom-slider-"] .splide__pagination__page.is-active {
  background: var(--accent-color);
  opacity: 1;
}
.babyroom-table {
  width: 900px;
  max-width: 100%;
  font-size: 1.6rem;
  border-collapse: collapse;
}
.babyroom-table th,
.babyroom-table td {
  height: 78px;
  text-align: center;
  font-weight: normal;
  border: 1px solid var(--border-color2);
}
.babyroom-table thead th {
  font-weight: bold;
}
.babyroom-table thead th:first-child {
  font-weight: normal;
  background: var(--accent-color-light);
}
.babyroom-table tbody th {
  width: 320px;
}
.babyroom-table tbody tr:nth-child(3) td,
.babyroom-table tbody tr:nth-child(4) td {
  font-weight: bold;
}
#service4 + .inner-box {
  margin-bottom: 50px;
}
#service5 + ul {
  margin-bottom: 160px;
  padding: 10px 0 0 20px;
  font-size: 1.6rem;
}



@media (max-width: 1199px) {
  .w1200 {
    display: block;
  }
}


@media (max-width: 1170px) {
  .businesshour-area {
    flex-direction: column;
    gap: 0;
  }
  .businesshour-area > dl,
  .businesshour-area > div {
    width: 100%;
  }
  .businesshour-area > div > dl {
    border-top: none;
  }
  .businesshour-list .inner-dl dt {
    width: 240px;
  }
  .inner-box {
    gap: 50px;
  }
  .inner-item {
    max-width: calc(50% - 50px);
  }
  .inner-item:not(:has(+ .inner-item)) {
    width: 100%;
    max-width: 100%;
  }
  .babyroom-table tbody th {
    width: 26vw;
  }
}


@media (min-width: 768px) {
  .inner-box .height1 {
    height: 50.39px;
  }
  .inner-box .height2 {
    height: 50.6px;
  }
  .babyroom-list > li {
    max-width: 375px;
  }
}


@media (max-width: 767.999px) {
  .only-pc {
    display: none;
  }
  .only-sp {
    display: block;
  }
  .page-title {
    margin-bottom: 30px;
    padding-top: 35px;
  }
  .nav-list li a figure {
    height: 25px;
  }

  .nav-list {
    max-width: calc(100% - 30px);
    margin-bottom: 50px;
  }
  .nav-list li {
    width: 25%;
    height: 90px;
  }
  .nav-list li a {
    padding-top: 10px;
  }
  .nav-list li:nth-child(n + 3) a {
    padding-top: 5px;
  }
  .nav-list li:nth-child(n + 3) a figure {
    height: 30px;
  }
  .nav-list li a span {
    padding-top: 5px;
    font-size: 1.2rem;
    line-height: 1.3;
  }

  .section-service {
    max-width: calc(100% - 30px);
  }
  .section-service .service-title {
    margin-bottom: 30px;
    font-size: 1.8rem;
  }
  .section-service .service-title:has(+ p) {
    margin-bottom: 15px;
  }
  .section-service .service-title + p {
    margin-bottom: 30px;
  }
  .businesshour-area {
    max-width: 100%;
    margin-bottom: 50px;
  }
  .businesshour-area > div > p {
    font-size: 1.2rem;
  }
  .businesshour-list {
    font-size: 1.4rem;
  }
  .businesshour-list > dt {
    width: 50px;
  }
  .businesshour-list > dd {
    width: calc(100% - 50px);
  }
  .businesshour-list .inner-dl {
    justify-content: flex-start;
    padding: 15px 0 0;
  }
  .businesshour-list .inner-dl:last-child {
    padding-bottom: 15px;
  }
  .businesshour-list .inner-dl dt {
    width: 25vw;
    min-width: 120px;
    font-size: 1.2rem;
  }
  .businesshour-list .inner-dl dd {
    width: calc(100% - 120px);
    font-size: 1.1rem;
  }
  .businesshour-list .inner-dl p {
    font-size: 1rem;
  }

  .inner-box {
    padding-block: 30px;
  }
  .inner-box.babyroom {
    padding-bottom: 50px;
  }
  [id^="babyroom-slider-"] .splide__arrow {
    width: 30px;
    height: 30px;
  }
  [id^="babyroom-slider-"] .splide__arrow--prev {
    left: 0;
  }
  [id^="babyroom-slider-"] .splide__arrow--next {
    right: 5px;
  }
  [id^="babyroom-slider-"] .splide__pagination {
    bottom: -25px;
  }
  [id^="babyroom-slider-"] .splide__pagination__page {
    width: 8px;
    height: 8px;
  }
  .babyroom-list {
    gap: 50px 60px;
  }
  .babyroom-list a {
    font-size: 1.4rem;
  }
  .inner-box,
  .inner-box dl {
    gap: 0;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
  }
  .inner-box dt {
    margin-bottom: 10px;
    font-size: 1.6rem;
  }
  .inner-box dt img {
    max-width: 40px;
    max-height: 40px;
  }
  .inner-item {
    width: 100%;
    max-width: 100%;
  }
  .inner-box:has(+ #service3),
  .inner-item:has(+ .inner-item) {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--border-color2);
  }
  .inner-box:has(+ #service3) {
    border-bottom: none;
  }
  .inner-item dd,
  .inner-item dd p,
  .inner-item dd a {
    font-size: 1.4rem;
  }
  .inner-item dd p:not(:has(+ p)) {
    margin-bottom: 20px;
    line-height: inherit;
  }
  .inner-box:has(+ #service3) dd p {
    margin-bottom: 0;
  }
  .inner-item dd figure {
    width: 100%;
  }
  .babyroom-table {
    max-width: 100%;
    font-size: 1.2rem;
  }
  .babyroom-table th,
  .babyroom-table td {
    height: 60px;
  }
  .babyroom-table th:first-child {
    width: auto;
  }
  .babyroom-table thead th span,
  .babyroom-table tbody th span {
    display: block;
  }
  #service4 + .inner-box {
    padding: 0;
  }
  #service5 + ul {
    margin-bottom: 90px;
    padding: 0;
    font-size: 1.4rem;
  }
}

@media (max-width: 450px) {
  .nav-list {
    max-width: 100%;
  }
  .nav-list li:nth-child(1) {
    width: 23%;
  }
  .nav-list li:nth-child(3) {
    width: 27%;
  }

}