@charset "utf-8";

/* ======================================
     layout / component
========================================= */
#homContent {
  position: relative;  
  padding-top: var(--space-96);
}
#homContent::before {
  content: "";
  width: 100%;
  height: calc( var(--space-120) - 1px);
  background-color: var(--c-blue);
  position: absolute;
  left: 0;
  top: -1px;
}
#homContent::after{
  content: "";
  width: 100%;
  height: var(--space-120);
  background-color: var(--c-white);
  border-radius: var(--space-120) 0 0 0;
  position: absolute;
  left: 0;
  top: 0;
}
.homCont__bg {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
  width: 55%;
  max-width: 800px;
}

.hom-title-A {
  position: relative;
  z-index: 2;
  text-align: center;
  font-weight: 600;
  padding-top: var(--space-72);
  margin-bottom: var(--space-20);
}
  .hom-title-A span{
    display: block;
    color: var(--c-blue-dark);
    font-family: var(--ff-en);
    font-weight: 600;
    font-size: clamp(1.75rem, 1.044rem + 3.07vw, 3.5rem);
    letter-spacing: 0.05;
    line-height: 1.2;
  }
  .hom-title-A span em {
    color: var(--c-red-dark);
  }
  .hom-title-A::before {
    content: "";
    background: url(../img/common/ic-heading-a.svg) center center / cover no-repeat;
    aspect-ratio: 187/150;
    position: absolute;
    left: 50%;
    top: 0;
    translate: -50% -50%;
    width:clamp(60px, 43.860px + 4.386vw, 100px);
  }

.hom-title-B h2 {
  font-weight: 600;
  font-size: var(--fs-16);
}
  .hom-title-B .hom-title--en {
    font-size: var(--fs-48);
    font-family: var(--ff-en);
    color: var(--c-blue-dark);
    padding-bottom: var(--space-fix-12);
    margin: 0 0 var(--space-fix-12);
    position: relative;
    line-height: 1.3;
    font-weight: 500;
  }
  .hom-title-B .hom-title--en::before{
    content: "";
    width: var(--space-64);
    height: 5px;
    background-color: var(--c-red);
    position: absolute;
    left: 0;
    bottom: 0;
  }

.hom-title-C {
  color: var(--c-blue);
  font-weight: 600;
  font-size: var(--fs-24);
  position: relative;
  padding-left: 1.5em;
  margin-bottom: var(--space-16);
}
  .hom-title-C::before {
    content: "";
    width: 1em;
    height: 5px;
    background-color: var(--c-red);
    position: absolute;
    left: 0;
    top: 0.8em;
  }

  /* btn */
  .hom-btn {
    display: inline-block;
    padding: var(--space-fix-8) var(--space-32);
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    min-width: 240px;
  }
  .hom-btn--A {
    background-color: var(--c-blue);
  }
  .hom-btn--B {
    background-color: var(--c-blue-dark);
  }


/* ======================================
     visual
========================================= */
.hom-visual {
  width: 100%;
  height:clamp(600px, 195.135px + 37.838vw, 740px);
  background-color: var(--c-blue);
  position: relative;
  display: flex;
}
.hom-visual::before {
  content: "";
  width: 100%;
  height:clamp(400px, 218.182px + 18.182vw, 480px);
  background-color: #fff;
  border-radius: 0 0 var(--space-120) 0;
  position: absolute;
  left: 0;
  top: 0;
}

.hom-Slider {
  width: 50%;
  height: calc(100% - var(--space-48));
  position: relative;
}
  .hom-visSlider {
    width: 100%;
    height: 100%;
    border-radius: 0 var(--space-24) var(--space-24) 0;
  }
  /* .hom-Slider の高さをスライダー内部まで伝播させる（slick-slide は slick.css で height:100%） */
  .hom-visSlider .slick-list,
  .hom-visSlider .slick-track {
    height: 100%;
  }
  .hom-visSlider__img {
    overflow: hidden;
    width: 100%;
    height: 100%;
    border-radius: 0 var(--space-24) var(--space-24) 0;
    background-color: #fff;
  }
    .hom-visSlider__img img {
      object-fit: cover;
      width: 100%;
      height: 100%;
    }


.hom-visual__cont {
 width: 50%;
 padding: clamp(40px, -28.182px + 6.818vw, 70px) clamp(50px, -63.636px + 11.364vw, 100px) var(--space-20);
}
  .hom-visual__inr {
    max-width: 540px;
    position: relative;
    font-size: var(--fs-16);
  }
    .hom-vis__sub {
      font-weight: 600;
    }
  .hom-visual__inr h2 {
    font-size: clamp(24px, 18.366px + 1.502vw, 40px);
    font-weight: 700;
    color: var(--c-blue-dark);
    line-height: 1.2;
    margin-bottom: clamp(30px, -27.838px + 5.405vw, 50px);
    letter-spacing: 1%;
  }
  .hom-visual__inr h2 span {
    color: var(--c-red);
    
  }
  .hom-visual__inr h2 span.fs-L {
    font-size: clamp(34px, 8.857px + 3.274vw, 56px);
  }
  .hom-vis__read {
    line-height: 2;
    letter-spacing: normal;
  }
  .hom-vis__list {
    display: flex;
    gap: var(--space-fix-8);
    margin: clamp(40px, -17.838px + 5.405vw, 60px) 0 0;
  }
    .hom-vis__list li {
      flex: 1;
      border: 1px solid var(--c-blue);
      background-color: #fff;
      border-radius: var(--space-fix-8);
      padding: var(--space-32) var(--space-16) var(--space-24);
      text-align: center;
      color: var(--c-blue-dark);
      font-weight: 600;
    }
    .hom-vis__list-img {
      display: block;
      width: 30%;
      max-width: 80px;
      aspect-ratio: 1/1;
      margin: 0 auto var(--space-16);
    }
    .hom-vis__list li p {
      margin-bottom: 0;
      letter-spacing: 1%;
    }
    .hom-vis__point {
      position:absolute;
      right: 0;
      top: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
      background-color: var(--c-blue);
      color:#fff;
      aspect-ratio: 1/1;
      line-height: 1.4;
      font-weight: 600;
      letter-spacing: normal;
      text-align: center;
      padding: var(--space-fix-8);
      font-size: var(--fs-15);
      translate: 0 -30%;
    }

@media (max-width: 980px) {
  .hom-visual {
    display: block;
    height: auto;
    padding-top:4%;
  }
  .hom-visual::before {
    height: 86%;
  }
  .hom-Slider {
    width: 96%;
    height: auto;
    aspect-ratio: 16/9;
    margin:0 auto;
  }
  .hom-visSlider__img {
      border-radius:var(--space-24) ; 
  }
  .hom-visual__cont {
    width: 90%;
    margin-inline:auto;
    padding: var(--space-56) 0;
  }
  .hom-visual__inr {
    max-width: 690px;
    margin: 0 auto;
  }
  .hom-vis__point {
    translate: 0 0;
  }
}


/* ======================================
     point
========================================= */
.pointWrap {
  position: relative;
  z-index: 2;
  margin-bottom: var(--space-120);
}
.pointWrap__inr {
  width: 90%;
  max-width: 1280px;
  margin: 0 auto;
  position: relative;
  padding-left: 20%;
}
.pointWrap__title {
  position: absolute;
  left: 0;
  top: 0;
}
.point {
  margin:0 auto var(--space-64);
}
.point:last-child {
  margin-bottom: 0;
}
.point h3 {
  font-size: var(--fs-20);
  font-weight: 600;
  color: var(--c-blue-dark);
  margin: 0 0 5px;
  padding-left: 1.5em;
  position: relative;
}
.point h3::before {
  content: "";
  width: 1em;
  height: 4px;
  background-color: var(--c-red);
  position: absolute;
  left: 0;
  top: 0.8em;
}
.point h3:not(:first-child) {
  margin-top: var(--space-32);
}
.point p:last-child {
  margin-bottom: 0;
}

@media (max-width: 850px) {
  .pointWrap__inr {
    padding-left: 0;
  }
  .pointWrap__title {
    position: relative;
    left: unset;
    top: unset;
    margin-bottom: var(--space-56);
  }
}


table.schedule {
  width: 100%;
  margin-bottom: var(--space-fix-8);
  font-size: var(--fs-15);
}
table.schedule thead th {
  background-color: var(--c-blue);
  color: #fff;
  text-align: center;
  font-weight: normal;
  padding: var(--space-fix-8);
  line-height: 1.4;
  border: 1px solid var(--c-blue);
}
table.schedule tbody th {
  background-color: var(--c-red);
  color: #fff;
  border-bottom: 1px solid var(--c-blue);
  padding: var(--space-fix-8);
}
table.schedule tbody td {
  padding: var(--space-fix-8);
  text-align: center;
  background: #fff;
  color: var(--c-blue-dark);
  border-bottom: 1px solid var(--c-blue);
}

table.schedule th.sat,
table.schedule thead th span.sat { color: #3AB6FF; }
table.schedule th.red,
table.schedule thead th span.red { color:#D00000 }
table.schedule td.red {
  color: #fff;
  background: #FFA4A7;
  font-weight: bold;
}

/*日付統合の調整*/
table.schedule thead th.merge span { display: inline-block; }
table.schedule thead th.merge span.btw { padding: 0 0.5em; vertical-align: middle; }

@media (max-width:640px) {
  table.schedule {
    margin: var(--space-24) auto;
  }
  table.schedule:not(.schedule_y) {
    display: flex;
    width: auto !important;
    font-size: clamp(0.813rem, 0.737rem + 0.329vw, 1rem);
  }
  table.schedule:not(.schedule_y) thead {
    display: block;
    width: 35%;
  }
  table.schedule:not(.schedule_y) thead tr {
    display: block;
  }
  table.schedule:not(.schedule_y) thead th {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.5em;
    border-top: 0;
    border-color: var(--c-blue-dark);
  }
  table.schedule:not(.schedule_y) thead th br {
    display: none;
  }
  table.schedule:not(.schedule_y) tbody {
    display: flex;
    width: 65%;
  }
  table.schedule:not(.schedule_y) tbody tr {
    display: block;
    width: 50%;
  }
  table.schedule:not(.schedule_y) tbody th,
  table.schedule:not(.schedule_y) tbody td {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border-top: 0;
    border-left: 0;
    border-color: var(--c-blue-dark);
    min-height: 3.5em;
  }
  table.schedule:not(.schedule_y) tbody td br {
    display: none;
  }

  /* スマホでも横　*/
  table.schedule.schedule_y {
    font-size: min(2.4vw, 1.2rem);
  }
  table.schedule.schedule_y thead th,
  table.schedule.schedule_y tbody th,
  table.schedule.schedule_y tbody td {
    padding: 1vw;
  }
}

@media (min-width:641px) {
 table.schedule td br {display: none;}
 table.schedule th br.sp_br {display: none !important;}
}

/* ======================================
     first
========================================= */
.hom-first{
  position:relative;
  z-index: 2;
  width: 90%;
  margin: 0 auto var(--space-112);
}

.hom-first__inr {
  max-width:1150px;
  margin-inline:auto;
  padding-bottom: var(--space-72);
  position: relative;
}
  .hom-first__inr::before{
    content: "";
    aspect-ratio: 37/27;
    position: absolute;
    right: 0;
    top: 50%;
    width: 32%;
    border-radius: var(--space-16);
    background:url(../img/home/img-hom-first-02.jpg) center center / cover no-repeat;
    max-width: 370px;
    translate: 0 20%;
  }
 .hom-first::after{
    content: "";
    aspect-ratio: 40/37;
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: var(--space-16);
    background:url(../img/home/img-hom-first-01.jpg) center center / cover no-repeat;
    width: 34.8%;
    translate: 0 -100%;
    max-width: 400px;
    margin-left: 18%;
  }

.hom-first__cont {
  width: 61%;
}

.hom-first__time {
  width: 100%;
  text-align: center;
  margin-bottom: var(--space-fix-8);
}
.hom-first__time thead th {
  background-color: var(--c-red);
  color: #fff;
  font-weight: normal;
  padding:  var(--space-16) 4px;
  line-height: 1.4;
  letter-spacing: normal;
  font-size: var(--fs-18);
}
.hom-first__time thead th:first-child {
  border-radius: var(--space-fix-8) 0 0 0;
}
.hom-first__time thead th:last-child {
  border-radius:  0 var(--space-fix-8) 0 0;
}
.hom-first__time thead th:not(:first-child ) {
  width: 9.5%;
} 

.hom-first__time tbody tr {
  border-top: 1px solid #fff;
}
.hom-first__time tbody th,
.hom-first__time tbody td {
  background-color: #F6EFE5;
  font-weight: normal;
  padding:  var(--space-16) 4px;
  font-size: var(--fs-18);
  letter-spacing: normal;
  line-height: 1.4;
}
.hom-first__time tbody td {
  color: var(--c-red);
}
.hom-first__time tbody tr:last-child th:first-child {
  border-radius:  0 0 0 var(--space-fix-8);
}
.hom-first__time tbody tr:last-child td:last-child {
  border-radius:  0 0 var(--space-fix-8) 0 ;
}
.fs-S,
.hom-first__time tbody th span {
  font-size: var(--fs-15);
}
.fs-S span {
  color: var(--c-red);
}
.hom-first__block {
  background-color: var(--c-red-light);
  padding: var(--space-40) var(--space-48);
  border-radius: var(--space-fix-8);
  margin-top: var(--space-32);
}
.hom-first__block h3{
  color: var(--c-red);
  font-size: var(--fs-24);
  margin-bottom: var(--space-fix-8);
  font-weight: 600;
}
.hom-first__block .hom-first__btn {margin:0;}

@media (max-width: 768px) {
  .hom-first__cont {
    width: 100%;
  }
  .hom-first__inr::before,
  .hom-first::after{
    content: none;
  }

}


/* ======================================
     sign
========================================= */
.hom-sign {
  display: flex;
  gap: var(--space-40);
  padding-bottom: var(--space-120);
  position: relative;
}
.hom-sign::before,
.hom-sign::after{
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: var(--space-120);
}
.hom-sign::before {
  background-color: var(--c-blue-light);
  bottom: 0px;
}
.hom-sign::after {
  background-color: var(--c-white);
  border-radius: 0 0 var(--space-120) 0;
  height: calc( var(--space-120) + 2px );
  bottom: -1px;
}
.hom-sign__title {
  width: 36%;
  padding: var(--space-80) clamp(25px, -100.000px + 12.5vw, 80px);
  display: flex;
  justify-content: flex-end;
  position: relative;
}
  .hom-sign__title::before{
    content: "";
    width: 100%;
    height: 85%;
    background-color: var(--c-blue);
    border-radius:0 var(--space-24) var(--space-24) 0;
    position: absolute;
    left: 0;
    top: 0;
  }
.hom-sign__cont {
  flex:auto;
  padding-bottom: var(--space-40);
}

.hom-sign__title-inr {
  max-width: 350px;
  font-size: var(--fs-16);
  position: relative;
  color:#fff;
}
  .hom-sign__heading {
    margin-bottom: var(--space-40);
    font-size: clamp(1rem, 0.432rem + 0.909vw, 1.25rem);
    font-weight: 600;
  }
  .hom-sign__heading h2 {
    font-family: var(--ff-en);
    font-size:clamp(2rem, -0.273rem + 3.636vw, 3rem);
    letter-spacing: normal;
    line-height: 1.2;
    font-weight: 600;
  }
  .hom-sign__btn {
    margin: var(--space-48) 0 0;
  }
  .hom-sign__btn a {
    display: inline-block;
    color: #fff;
    border: 1px solid #fff;
    border-radius: var(--space-fix-8);
    text-decoration: none;
    line-height: 1.2;
    padding: var(--space-16) var(--space-56) var(--space-16) var(--space-32);
    font-weight:600;
    font-size: var(--fs-18);
    transition: 0.3s ease-in-out;
    position: relative;
  }
  .hom-sign__btn a::before{
    content: ""; 
    width: var(--space-fix-12);
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    aspect-ratio: 1/1;
    position: absolute; 
    right: var(--space-16);
    top: 50%;
    translate: 0 -50%;
    rotate: 45deg;
  }
  .hom-sign__btn a:hover{
    background-color: var(--c-white);
    color: var(--c-blue);
  }
  .hom-sign__btn a:hover::before {
    border-color: var(--c-blue);
  }

.hom-sign__cont-inr {
  width:90%;
  max-width: 860px;
  margin-inline: auto;
  padding-top: var(--space-32);
}
  .hom-sign__cont-inr h3 {
    font-weight: 700;
    font-size: var(--fs-24);
    line-height: 1.6;
    margin-bottom: var(--space-24);
  }
  .hom-sign__flex {
    display: flex;
    gap:var(--space-16);
    margin: var(--space-48) auto var(--space-32);
  }
    .hom-sign__main {
      flex:1;
      border: 1px solid;
      position: relative;
      padding: var(--space-32) var(--space-fix-8);
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--space-fix-8);
    }
    .hom-sign__main h4 {
      width: 100%;
      text-align:center;
      position: absolute;
      left: 0;
      top: 0;
      translate: 0 -50%;
      font-weight: 600;
      font-size: var(--fs-20);
    }
    .hom-sign__main h4 span {
      background-color: #fff;
      padding: 0 var(--space-16);
    }
    .hom-sign__main p {
      margin:0;
      line-height: 1.5;
      font-weight: 600;
      text-align: center;
    }
      .hom-sign__main--red {
        border-color: var(--c-red);
        color: var(--c-red);
      }
      .hom-sign__main--blue {
        border-color: var(--c-blue);
        color: var(--c-blue);
      }

  .hom-sign__list {
    display: flex;
    gap:var(--space-fix-8);
    flex-wrap: wrap;
  }
  .hom-sign__sign {
    width: calc(calc(100% - calc(var(--space-fix-8) * 2)) /3 );
    background-color: var(--c-gray);
    border-radius:var(--space-fix-8);
    font-size: var(--fs-16);
    text-align: center;
    padding: var(--space-24) var(--space-fix-8);
  }
    .hom-sign__sign .hom-sign__img {
      aspect-ratio: 1/1;
      width:clamp(60px, 43.860px + 4.386vw, 100px);
      margin: 0 auto var(--space-fix-8);
    }
    .hom-sign__sign p {
      line-height: 1.5;
      margin-bottom: 0;
    }
  
@media (max-width: 985px) {
  .hom-sign {
    display: block;
  }
  .hom-sign__title {
    width:95%;
    padding:var(--space-40);
    display: block;
  }
  .hom-sign__title::before{
    height: 100%;
  }
.hom-sign__cont {
  flex:auto;
  padding-bottom: var(--space-40);
}

.hom-sign__title-inr {
  max-width: unset;
}
.hom-sign__heading {
  margin-bottom: var(--space-16);
}
.hom-sign__btn {
  margin-top: var(--space-24);
}

  @media (max-width: 768px) {
  .hom-sign__sign {
    width: calc(calc(100% - calc(var(--space-fix-8) * 1)) / 2 );
  }
  }

}

/* ======================================
     feature
========================================= */
.hom-feature {
  background-color: var(--c-blue-light);
  position: relative;
  padding-bottom: var(--space-120);
}
.hom-feature::before,
.hom-feature::after {
  content: "";
  width: 100%;
  height: var(--space-120);
  position: absolute;
  left: 0;

}
.hom-feature::before{
  background-color: var(--c-white);
  top:-1px;
}
.hom-feature::after{
  background-color: var(--c-blue-light);
  border-radius: var(--space-120) 0 0 0;
  top: -1px;
}
.hom-feature__bg {
  width: 100%;
  height: var(--space-120);
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--c-blue-dark);
}
  .hom-feature__bg::before{
    content: "";
    width: 100%;
    height: calc( var(--space-120) + 1px);
    position: absolute;
    left: 0;
    top: -1px;
    border-radius: 0 0 var(--space-120) 0;
    background-color: var(--c-blue-light);
  }

.hom-feature__flex {
  position: relative;
  z-index: 2;
  width: 90%;
  max-width: 1280px;
  margin: var(--space-48) auto var(--space-120);
  display: flex;
  gap: var(--space-40);
}
  .hom-feature__cont {
    flex: 1;
  }
  .hom-feature__img {
    aspect-ratio:4/3;
    border-radius: var(--space-16);
    background-color: #fff;
  }
  .hom-feature__cont h3 {
    margin: var(--space-24) 0;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
    color: var(--c-blue);
    font-size: var(--fs-24);
  }
  .hom-feature__cont p {
    margin: 0;
  }
  
/* exam */
.hom-feature__exam {
  width: 90%;
  max-width: 1150px;
  margin-inline: auto;
}
  .hom-feature__title {
    text-align: center;
    font-weight: 600;
    color: var(--c-red);
    font-size: var(--fs-24);
    margin-bottom: var(--space-16);
  }
  .hom-feature__ct {
    display: grid;
    grid-template-columns: 1fr 53%;
    grid-template-rows: max-content 1fr;
    grid-column-gap: clamp(40px, -32.727px + 7.273vw, 72px);
    margin: var(--space-48) auto var(--space-32);
  }
  .hom-feature__ct-title {
    grid-area: 1 / 1 / 2 / 2;
  }
  .hom-feature__ct-copy{
    grid-area: 2 / 1 / 3 / 2; 
    line-height: 2;
    font-size: var(--fs-16);
  }
  .hom-feature__ct-img {
    grid-area: 1 / 2 / 3 / 3;
    background-color: #fff;
    border-radius: var(--space-16);
    overflow: hidden;
  }

.hom-feature__example {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-24);
  margin: var(--space-48) auto var(--space-16);
}
  .hom-feature__ex-list {
    font-size:var(--fs-16);
    width:calc(calc(100% - var(--space-24)) / 2);
    background-color: #fff;
    padding: var(--space-16) var(--space-24);
    display: flex;
    gap: var(--space-32);
    align-items: center;
    border-radius: var(--space-fix-8);
    min-height: var(--space-120);
  } 
    .hom-feature__ex-txt {
      flex: 1 1 auto;
      min-width: 0;
    }
      .hom-feature__ex-txt h4{
        font-weight: 600;
        color: var(--c-blue);
      }
      .hom-feature__ex-txt p {
        margin-bottom: 0;
        line-height: 1.5;
        font-size: clamp(12px, 10.386px + 0.439vw, 16px);
      }
    .hom-feature__ex-img {
      width: var(--space-88);
      flex: 0 0 var(--space-88);
    }


  @media (max-width: 999px) {
    .hom-feature__flex {
      flex-direction: column;
    }
    .hom-feature__cont {
      flex:inherit;
      display: grid;
      grid-template-columns: 40% 1fr;
      grid-template-rows: max-content 1fr;
      grid-column-gap: var(--space-56);
      grid-row-gap: var(--space-24);
    }
    .hom-feature__img {
      grid-area: 1 / 1 / 3 / 2;
    }
    .hom-feature__cont h3 {
      grid-area: 1 / 2 / 2 / 3;
      margin: 0;
      text-align:left;
    }
    .hom-feature__cont p {
      grid-area: 2 / 2 / 3 / 3;
    }
    .hom-feature__ct {
      display: block;
    }
    .hom-feature__ct-img  {
      margin: 0 auto var(--space-32);
    }
    .hom-feature__ex-list {
      display: block;
    }
    .hom-feature__ex-img {
      margin: 0 auto var(--space-16);
    }

    @media(max-width:579px) {
     .hom-feature__cont {
      display: block;
     }
     .hom-feature__cont h3 {
      text-align: center;
      margin: var(--space-24) 0;
     }

    }

  }

/* ======================================
     feature
========================================= */
.hom-menu {
  position: relative;
  padding:0 0 var(--space-120);
  background-color: var(--c-blue-dark);
  color: #fff;
}
  .hom-menu::before,
  .hom-menu::after {
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    top: -1px;
  }
  .hom-menu::before{
    background-color: var(--c-blue-light);
     height: var(--space-120);
  }
  .hom-menu::after{
    background-color: var(--c-blue-dark);
    border-radius: var(--space-120) 0 0 0;
    height: calc(var(--space-120) + 1px);
  }
  .hom-menu__bg {
    width: 100%;
    height: var(--space-120);
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: var(--c-white);
  }
    .hom-menu__bg::before{
      content: "";
      width: 100%;
      height: var(--space-120);
      position: absolute;
      left: 0;
      top: 0;
      border-radius: 0 0 var(--space-120) 0 ;
      background-color: var(--c-blue-dark);
    }

.hom-menu__inr {
  width: 90%;
    max-width: 1280px;
    margin-inline: auto;
    position: relative;
    z-index: 2;
  }
  .hom-menu .hom-title-A span {
    color: #fff;
  }

  .hom-menu__flex {
    display: flex;
    gap: clamp(8px, -2.985px + 2.985vw, 40px);
    flex-wrap: wrap;
    margin-top: var(--space-64);
  }
    .hom-menu__cont {
      width: calc(calc(100% - var(--space-40)) / 2);
      text-align: center;
    }
      .hom-menu__img {
        background-color: #fff;
        border-radius: var(--space-16);
        aspect-ratio:62/36;
      }
      .hom-menu__cont h3 {
        margin-top: var(--space-16);
        font-weight: 600;
        font-size: var(--fs-24);
      }
      .hom-menu__cont p {
        font-size: var(--fs-16);
      }
      .hom-menu__cont .hom-menu__sublink {
        margin-top: var(--space-8, 8px);
      }

/* ======================================
     greeting
========================================= */
.hom-greeting {
  position: relative;
  overflow: hidden;
  padding: var(--space-120) 0 0;
}
  .hom-greeting::before,
  .hom-greeting::after {
    content: "";
    width: 100%;
    height: var(--space-120);
    position: absolute;
    left: 0;
    top: 0;
  }
  .hom-greeting::before{
    background-color: var(--c-blue-dark);
  }
  .hom-greeting::after{
    background-color: var(--c-white);
    border-radius: var(--space-120) 0 0 0;
  }

  .hom-greeting__inr {
    width: 460px;
    margin-inline:auto;
    padding-bottom: calc(var(--space-112) * 2);
  }
  .hom-greeting__inr h3{
    font-weight: 600;
    line-height: 1.5;
    font-size: var(--fs-24);
    color: var(--c-blue-dark);
    margin: var(--space-40) 0;
  }
  .hom-greeting__btn {
    text-align: center;
    margin: var(--space-72) auto 0;
  }
  .hom-greeting__btn a {
    text-align: left;
  }

  .hom-greeting__img {
    border-radius: var(--fs-16);
    position: absolute;
    background-color: #eee;
  }
  .hom-greeting__staff {
    left: 50%;
    top: 22%;
    aspect-ratio: 30/35;
    width: 300px;
    margin-left: 320px ;
  }
  .hom-greeting__img--01 {
    left: 50%;
    top:140px;
    aspect-ratio: 4/5;
    height: 500px;
    translate: -100% 0;
    margin-left: -340px 
  }
  .hom-greeting__img--02 {
    left: 50%;
    top: 680px;
    aspect-ratio: 4/3;
    height: 240px;
    margin-left: 430px ;
  }
  .hom-greeting__img--03 {
    left: 50%;
    bottom: 0;
    aspect-ratio: 385/290;
    width: 385px;
    translate: -100% -40%;
    margin-left: -200px;
  }

  @media (max-width: 999px) {
  .hom-greeting__inr {
    padding-bottom: var(--space-80);
  }
  .hom-greeting__img-wrap {
    display: flex;
    gap:8px;
    width: 98%;
    margin: 0 auto var(--space-64);
  }
  .hom-greeting__inr {
    width: 90%;
  }
  .hom-greeting__img {
    position: relative;
  }
  .hom-greeting__staff {
    left: unset;
    top: unset;
    flex: 1;
    margin-left: 0 ;
    aspect-ratio: 3/4;
  }
  .hom-greeting__img--01 {
    left:unset;
    top:unset;
    flex: 1;
    aspect-ratio:3/4;
    height: auto;
    translate: 0;
    margin-left: 0; 
  }
  .hom-greeting__img--02,
  .hom-greeting__img--03 {
    display: none;
  }

  }

/* ======================================
     slider
========================================= */
#block-slider { margin: 0 auto; }
.img-slider {
  margin-bottom: var(--space-fix-12);
}
.img-slider__img {
  margin: 0 var(--space-fix-8);
  width: min(31.67vw, 380px);
  aspect-ratio:4/3;
  overflow: hidden;
  border-radius: var(--space-fix-12);
  background: #eee;
}
.img-slider__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width:960px) {
  #block-slider  { margin: 0 0 var(--space-56); }
}

/* ======================================
     news
========================================= */
.hom-news {
  width: 90%;
  min-height:calc(var(--space-96) * 2);
  max-width: 1280px;
  margin:var(--space-120) auto;
  display: flex;
  justify-content: space-between;
  position: relative;
}
  .hom-news__title {
    flex: 1 1 auto;
    min-width: 0;
  }
  .hom-news__cont {
    width: 75%;
    flex: 0 0 75%;
    font-size: var(--fs-16);
    padding-bottom: var(--space-24);
    
    margin: 0;
  }
    .hom-news__cont dt {
      font-weight: 600;
      color: var(--c-blue-dark);
      padding: var(--space-24) var(--space-24) 0 var(--space-24);
    }
    .hom-news__cont dt:not(:first-child) {
      margin-top: var(--space-24);
      border-top: 1px solid var(--c-gray-light);
    }
    .hom-news__cont dd {
      padding: 0 var(--space-24);
      
    }
  .hom-news__btn {
    margin: 0;
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .hom-news__btn a{
    min-width: inherit;
    font-size: var(--fs-16);
    padding: var(--space-fix-8) var(--space-16);
  }

  @media (max-width: 899px) {
    .hom-news {
      flex-direction: column;
    }
  .hom-news__title {
    flex: inherit;
  }
  .hom-news__cont{
    flex:inherit;
    width: 100%;
  }
  .hom-news__btn {
    position: relative;
    margin-top: var(--space-40);
  }

  }
