@charset "UTF-8";
/* CSS Document */
.header-img {
  background: url(../../img/header-1.jpg) no-repeat center/cover; }

#message .message-row {
  display: flex;
  gap: 5rem; }
  @media screen and (max-width: 767px) {
    #message .message-row {
      flex-direction: column;
      gap: 3rem; }
      #message .message-row:nth-of-type(2) {
        flex-direction: column-reverse; } }
  @media screen and (max-width: 575px) {
    #message .message-row {
      gap: 2rem; } }
  #message .message-row:not(:last-of-type) {
    margin-bottom: 5rem; }
    @media screen and (max-width: 767px) {
      #message .message-row:not(:last-of-type) {
        margin-bottom: 3rem; } }
    @media screen and (max-width: 575px) {
      #message .message-row:not(:last-of-type) {
        margin-bottom: 2rem; } }
  #message .message-row .message-text {
    width: 55%; }
    @media screen and (max-width: 767px) {
      #message .message-row .message-text {
        width: 100%; } }
    #message .message-row .message-text h3 {
      font-size: 2.2rem;
      font-weight: 500;
      line-height: 1.5em;
      margin-bottom: 2rem; }
      @media screen and (max-width: 575px) {
        #message .message-row .message-text h3 {
          text-align: center;
          font-size: 2rem; } }
      #message .message-row .message-text h3 span {
        color: #00aae7; }
  #message .message-row .name {
    text-align: end; }
  #message .message-row .message-img {
    flex: 1;
    overflow: hidden;
    max-height: 350px; }
    #message .message-row .message-img img {
      height: 100%;
      width: 100%;
      object-fit: cover; }
#message .message-row:nth-of-type(1) .message-img {
  margin-right: calc(50% - 50vw);
  border-radius: 10px 0 0 10px; }
  @media screen and (max-width: 767px) {
    #message .message-row:nth-of-type(1) .message-img {
      margin-right: 0;
      border-radius: 10px; } }
#message .message-row:nth-of-type(2) .message-img {
  margin-left: calc(50% - 50vw);
  border-radius: 0 10px 10px 0; }
  @media screen and (max-width: 767px) {
    #message .message-row:nth-of-type(2) .message-img {
      margin-left: 0;
      border-radius: 10px; } }

#philosophy {
  background: #e5f6fd;
  padding: 7rem 0;
  text-align: center; }
  @media screen and (max-width: 991px) {
    #philosophy {
      padding: 5rem 0; } }
  #philosophy h3 {
    font-family: "Noto Serif JP", serif;
    font-size: 3rem;
    font-weight: 400;
    margin-bottom: 3rem;
    line-height: 1.5em; }
    @media screen and (max-width: 767px) {
      #philosophy h3 {
        font-size: 2.5rem;
        margin-bottom: 2rem; } }
  #philosophy .white-bg {
    background: #fff;
    padding: 3rem;
    border-radius: 10px; }
    #philosophy .white-bg:not(:last-of-type) {
      margin-bottom: 1.5rem; }
    #philosophy .white-bg dt {
      text-align: center;
      color: #00aae7;
      font-size: 2.3rem;
      margin-bottom: 1rem; }
    #philosophy .white-bg dd {
      text-align: center; }
      @media screen and (max-width: 767px) {
        #philosophy .white-bg dd {
          text-align: justify; } }
  #philosophy .policy {
    text-align: center; }
    #philosophy .policy dd {
      text-align: justify;
      display: inline-block; }
      #philosophy .policy dd ol {
        padding-left: 1.5em; }

#history table {
  width: 100%; }
  #history table th,
  #history table td {
    border-bottom: 1px solid #ccc;
    align-content: baseline;
    padding: 1rem 1.5rem; }
    #history table th:first-of-type,
    #history table td:first-of-type {
      border-top: 1px solid #ccc; }
  #history table th {
    background: #e5f6fd;
    font-weight: 400;
    white-space: nowrap;
    max-width: 140px; }

#requirements ul {
  margin-bottom: 5rem; }
  @media screen and (max-width: 767px) {
    #requirements ul {
      margin-bottom: 3rem; } }
  #requirements ul li {
    position: relative;
    padding-left: 1em; }
    #requirements ul li::before {
      content: "\f0da";
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
      color: #00aae7;
      position: absolute;
      left: 0;
      top: 0; }
#requirements .facility-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #00aae7;
  border: 1px solid #00aae7;
  border-radius: 10px;
  padding: 20px 30px;
  color: #fff;
  text-decoration: none;
  position: relative;
  transition: background 0.3s ease, color 0.3s ease; }
  #requirements .facility-link::after {
    position: absolute;
    content: "";
    background: url(../../img/about-facility.png) no-repeat center/contain;
    width: 240px;
    height: 130px;
    right: 7rem; }
    @media screen and (max-width: 767px) {
      #requirements .facility-link::after {
        width: 190px;
        height: 110px;
        right: 5rem; } }
    @media screen and (max-width: 575px) {
      #requirements .facility-link::after {
        display: none; } }
  #requirements .facility-link p {
    font-size: 2rem;
    font-weight: 500; }
    #requirements .facility-link p span {
      display: inline-block;
      margin-left: 1rem;
      font-size: 1.6rem;
      font-weight: 400; }
      @media screen and (max-width: 767px) {
        #requirements .facility-link p span {
          display: block;
          margin-left: 0; } }
  #requirements .facility-link:hover {
    background: #fff;
    color: #00aae7; }

#facility-standards .facility-container,
#facility-standards .checkup-container,
#checkup .facility-container,
#checkup .checkup-container {
  border: 1px solid #00aae7;
  border-radius: 10px;
  padding: 4rem 5rem; }
  @media screen and (max-width: 767px) {
    #facility-standards .facility-container,
    #facility-standards .checkup-container,
    #checkup .facility-container,
    #checkup .checkup-container {
      padding: 3rem; } }
  @media screen and (max-width: 575px) {
    #facility-standards .facility-container,
    #facility-standards .checkup-container,
    #checkup .facility-container,
    #checkup .checkup-container {
      padding: 2rem; } }
  #facility-standards .facility-container > ul > li,
  #facility-standards .checkup-container > ul > li,
  #checkup .facility-container > ul > li,
  #checkup .checkup-container > ul > li {
    position: relative;
    padding-left: 1em; }
    #facility-standards .facility-container > ul > li::before,
    #facility-standards .checkup-container > ul > li::before,
    #checkup .facility-container > ul > li::before,
    #checkup .checkup-container > ul > li::before {
      content: "\f0da";
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
      color: #00aae7;
      position: absolute;
      left: 0;
      top: 0; }
    #facility-standards .facility-container > ul > li ul,
    #facility-standards .checkup-container > ul > li ul,
    #checkup .facility-container > ul > li ul,
    #checkup .checkup-container > ul > li ul {
      padding-left: 1em; }

#gallery {
  /* モーダル */ }
  #gallery .gallery {
    display: flex;
    align-items: center;
    gap: 10px; }
    #gallery .gallery .gallery-track-wrapper {
      overflow: hidden;
      width: 100%; }
      #gallery .gallery .gallery-track-wrapper .gallery-track {
        display: flex;
        transition: transform 0.2s ease;
        gap: 10px; }
        #gallery .gallery .gallery-track-wrapper .gallery-track .slide {
          width: calc((100% - 20px) / 3);
          flex-shrink: 0;
          /* ← 縮まないように */
          text-align: center; }
          @media screen and (max-width: 767px) {
            #gallery .gallery .gallery-track-wrapper .gallery-track .slide {
              width: calc((100% - 10px) / 2); } }
          @media screen and (max-width: 575px) {
            #gallery .gallery .gallery-track-wrapper .gallery-track .slide {
              width: 100%; } }
          #gallery .gallery .gallery-track-wrapper .gallery-track .slide img {
            width: 100%;
            display: block; }
          #gallery .gallery .gallery-track-wrapper .gallery-track .slide .caption {
            text-align: center;
            margin-top: 8px;
            font-size: 1.6rem; }
  #gallery .modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center; }
    #gallery .modal .close {
      position: absolute;
      top: 20px;
      right: 30px;
      color: #fff;
      font-size: 30px;
      cursor: pointer; }
    #gallery .modal .modal-inner {
      display: flex;
      flex-direction: column;
      align-items: center; }
      #gallery .modal .modal-inner #modal-caption {
        color: #fff;
        margin-top: 10px; }
  #gallery .modal.active {
    display: flex;
    gap: 2rem; }
  #gallery button i {
    color: #00aae7;
    font-size: 2.5rem; }