@charset "UTF-8";
/* -------------------------------------
フォント
------------------------------------- */
.top_block {
  background: -webkit-gradient(linear, left top, left bottom, from(#F7F4F0), to(#F6EDE3));
  background: linear-gradient(180deg, #F7F4F0 0%, #F6EDE3 100%);
}

/* -------------------------------------
mv
------------------------------------- */
.mv {
  margin-top: 10.4rem;
  width: 100%;
  height: calc(100vh - 10.4rem);
  max-height: 48.75vw;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .mv {
    margin-top: 15vh;
    height: 85vh;
    max-height: unset;
  }
}

.mv_menu {
  position: absolute;
  top: 1.7rem;
  left: 0;
  z-index: 20;
}
@media screen and (max-width: 1024px) {
  .mv_menu {
    display: none;
  }
}

.mv_menu-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.4rem;
}
.mv_menu-list > li {
  padding-left: 4.8rem;
  position: relative;
}
.mv_menu-list > li > a, .mv_menu-list > li > button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 20rem;
  height: 4rem;
  font-size: 1.7rem;
  letter-spacing: 0.05em;
  position: relative;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.mv_menu-list > li > a::after, .mv_menu-list > li > button::after {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  background-image: url(../img/common/icon_diamond.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  left: 0;
  z-index: -1;
  translate: 0 -50%;
  -webkit-transition: 0.15s linear;
  transition: 0.15s linear;
  opacity: 0;
}
.mv_menu-list > li > a::before, .mv_menu-list > li > button::before {
  content: "";
  background: -webkit-gradient(linear, left top, right top, color-stop(20%, #F1EADA), to(rgba(241, 234, 218, 0)));
  background: linear-gradient(90deg, #F1EADA 20%, rgba(241, 234, 218, 0) 100%);
  background-repeat: no-repeat;
  width: 27rem;
  height: 100%;
  position: absolute;
  top: 0;
  left: -4.8rem;
  z-index: -2;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (hover: hover) {
  .mv_menu-list > li > a:hover, .mv_menu-list > li > button:hover {
    padding-left: 2.4rem;
  }
  .mv_menu-list > li > a:hover::after, .mv_menu-list > li > button:hover::after {
    rotate: 180deg;
    opacity: 1;
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
  }
  .mv_menu-list > li > a:hover::before, .mv_menu-list > li > button:hover::before {
    opacity: 1;
  }
}
.mv_menu-list > li > button.active {
  padding-left: 2.4rem;
}
.mv_menu-list > li > button.active::after {
  rotate: 180deg;
  opacity: 1;
  -webkit-transition: 0.3s linear;
  transition: 0.3s linear;
}
.mv_menu-list > li > button.active::before {
  opacity: 1;
}

.mv_menu_child {
  min-width: 20rem;
  padding: 2.7rem 2.8rem 3.1rem;
  border-radius: 1rem;
  position: absolute;
  top: -2rem;
  left: 18.5rem;
  z-index: 1;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.mv_menu_child::before {
  content: "";
  display: block;
  width: 2rem;
  height: 2rem;
  position: absolute;
  top: 3.1rem;
  left: -1.2rem;
  background-image: url(../img/front/bubble_tri.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.mv_menu_child.active {
  opacity: 1;
  pointer-events: auto;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.mv_menu_child-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.62rem;
}
.mv_menu_child-list > li > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  line-height: 1.7;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.mv_menu_child-list > li > a::before {
  content: "";
  display: block;
  width: 0.6rem;
  height: 0.6rem;
  background-image: url(../img/common/icon_diamond.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 0.6rem;
}
@media (hover: hover) {
  .mv_menu_child-list > li > a:hover {
    opacity: 0.7;
  }
}

.mv_menu_sub-list {
  margin-top: 2.3rem;
  padding-left: 4.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.9rem;
}
.mv_menu_sub-list > li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.4rem;
}
.mv_menu_sub-list > li > a {
  height: 2.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1.2rem;
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.mv_menu_sub-list > li > a::before {
  content: "";
  display: block;
  width: 0.6rem;
  height: 0.6rem;
  background-image: url(../img/common/icon_diamond.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media (hover: hover) {
  .mv_menu_sub-list > li > a:hover {
    opacity: 0.7;
  }
}

.mv_news {
  position: absolute;
  bottom: 4.2rem;
  right: 4.8rem;
  z-index: 2;
  width: 38.2rem;
}
@media screen and (max-width: 768px) {
  .mv_news {
    width: calc(100% - 1.6rem);
    bottom: -1rem;
    right: 50%;
    translate: 50% 0;
  }
}

.mv_news-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  .mv_news-head {
    display: none;
  }
}

.mv_news-head_ttl .--ttl {
  width: 7.1rem;
  height: 2.1rem;
  display: grid;
  place-items: center;
  font-weight: 500;
  font-size: 1.3rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
  border-radius: 10rem;
  background-color: #433C2C;
  color: #fff;
}

.mv_news-head_btn {
  width: 11.5rem;
}

.mv_news-block {
  height: 9.1rem;
  margin-top: 0.3rem;
  border: 1px solid #fff;
  border-radius: 0.5rem;
  background-color: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}
@media screen and (max-width: 768px) {
  .mv_news-block {
    height: 6.6rem;
  }
}
.mv_news-block > a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 2rem 3.2rem;
}
@media screen and (max-width: 768px) {
  .mv_news-block > a {
    padding: 1rem 2.4rem;
  }
}

.mv_news-ttl {
  line-height: 1.5;
  letter-spacing: 0.03rem;
  text-decoration: underline;
  text-decoration-thickness: 0.5px;
  text-underline-offset: 0.3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  scrollbar-width: none;
}

.mv_news-meta {
  margin-top: 1.6rem;
  color: #8B8475;
  font-size: 1.2rem;
  letter-spacing: 0.03em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 768px) {
  .mv_news-meta {
    margin-top: 1.3rem;
  }
}

.mv_news-cate {
  position: relative;
  margin-left: 1rem;
  padding-left: 1rem;
}
.mv_news-cate::before {
  content: "";
  display: block;
  width: 1px;
  height: 1.1lh;
  background-color: #8B8475;
  position: absolute;
  top: 50%;
  left: 0;
  translate: 0 -50%;
}

.mv_line {
  width: 85.4166666667vw;
  height: auto;
  aspect-ratio: 1230/2289;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  pointer-events: none;
}
@media screen and (max-width: 1024px) {
  .mv_line {
    width: 100%;
    aspect-ratio: 375/1310;
    top: clamp(11.5rem, 11.5rem + (768px - 100vw) * 0.234, 11.3rem);
  }
}
.mv_line svg {
  width: calc(min(79.7916666667vw, (100vh - 10.4rem) * 1149 / 702) * 1396 / 1149);
  height: auto;
  position: absolute;
  right: calc(min(79.7916666667vw, (100vh - 10.4rem) * 1149 / 702) * 164 / 1149 * -1);
}
@media screen and (max-width: 1024px) {
  .mv_line svg {
    width: 181vw;
    right: -70vw;
  }
}
@media screen and (max-width: 768px) {
  .mv_line svg {
    width: 80rem;
    right: auto;
    left: -8rem;
  }
}

.mv-swiper {
  /* width: min(calc(1149 / 1440 * 100vw), calc((100vh - 10.4rem) * 1149 / 702)); */
  aspect-ratio: 1149/702;
  width: min(79.7916666667vw, (100vh - 10.4rem) * 1149 / 702);
  height: auto;
  max-height: calc(100vh - 10.4rem);
  position: absolute;
  top: 0.4rem;
  right: 0;
  z-index: 0;
  -webkit-mask-image: url(../img/front/mv_mask.svg);
          mask-image: url(../img/front/mv_mask.svg);
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
@media screen and (max-width: 1024px) {
  .mv-swiper {
    width: 100%;
    aspect-ratio: unset;
    max-height: calc(85vh - clamp(11.5rem, 11.5rem + (768px - 100vw) * 0.234, 11.3rem));
    top: clamp(11.5rem, 11.5rem + (768px - 100vw) * 0.234, 11.3rem);
    -webkit-mask-image: url(../img/front/mv_mask_sp.svg);
            mask-image: url(../img/front/mv_mask_sp.svg);
    -webkit-mask-position: 16% 0;
            mask-position: 16% 0;
  }
}
@media screen and (max-width: 768px) {
  .mv-swiper {
    aspect-ratio: 375/501;
  }
}
.mv-swiper .mv-swiper_img img {
  width: 100%;
}
.mv-swiper .swiper-slide {
  overflow: hidden;
  position: relative;
}
.mv-swiper .swiper-slide::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0.1;
}
.mv-swiper .swiper-slide-prev img,
.mv-swiper .swiper-slide-active img {
  -webkit-animation: zoom 6s 0.5s linear both;
          animation: zoom 6s 0.5s linear both;
}
.mv-swiper .mv-swiper-pagination {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.2rem;
  position: absolute;
  top: 50%;
  right: 4.9rem;
  left: auto;
  z-index: 2;
  translate: 0 -50%;
}
@media screen and (max-width: 1024px) {
  .mv-swiper .mv-swiper-pagination {
    right: 1.4rem;
  }
}
.mv-swiper .mv-swiper-pagination .swiper-pagination-bullet {
  opacity: 0.3;
  background-color: #927A43;
  width: 3px;
  height: 3px;
  -webkit-transition: 0.9s cubic-bezier(0.61, 1, 0.88, 1);
  transition: 0.9s cubic-bezier(0.61, 1, 0.88, 1);
}
.mv-swiper .mv-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}

@-webkit-keyframes zoom {
  from {
    scale: 1;
  }
  to {
    scale: 1.1;
  }
}

@keyframes zoom {
  from {
    scale: 1;
  }
  to {
    scale: 1.1;
  }
}
.mv_catch {
  position: absolute;
  left: 5rem;
  bottom: 4.2rem;
  z-index: 2;
}
@media screen and (max-width: 1024px) {
  .mv_catch {
    top: 0;
    bottom: auto;
    left: 2rem;
  }
}
.mv_catch .mv-catch_img {
  width: 52.7rem;
}
@media screen and (max-width: 1024px) {
  .mv_catch .mv-catch_img {
    width: max(31.5rem, 65vw);
  }
}
.mv_catch .mv-catch_img:first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  gap: 0.8rem;
  translate: -0.6rem;
}
@media screen and (max-width: 1024px) {
  .mv_catch .mv-catch_img:first-child {
    gap: 0.5rem;
    translate: 0;
  }
}
.mv_catch .mv-catch_img:nth-of-type(2) {
  margin-top: 1.4rem;
  width: 36.3rem;
}
@media screen and (max-width: 1024px) {
  .mv_catch .mv-catch_img:nth-of-type(2) {
    width: max(22rem, 45vw);
    margin-top: 1rem;
  }
}
.mv_catch .mv-catch_txt {
  margin-top: 2rem;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1.5;
  letter-spacing: 0.03em;
}
@media screen and (max-width: 1024px) {
  .mv_catch .mv-catch_txt {
    margin-top: 1.3rem;
    font-size: max(1.1rem, 1.7vw);
    color: #8B8475;
  }
}

/* -------------------------------------
appo
------------------------------------- */
.appo {
  position: relative;
}

.appo-inner {
  padding-block: 14.4rem;
}
@media screen and (max-width: 768px) {
  .appo-inner {
    padding-block: 7.3rem;
  }
}

.appo-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4rem;
}
@media screen and (max-width: 1024px) {
  .appo-block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 4.8rem;
  }
}

@media screen and (max-width: 1024px) {
  .appo-textArea {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 10rem;
    margin-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .appo-textArea {
    padding-inline: 1.7rem;
    display: block;
  }
}

.appo-ttl {
  font-weight: 500;
  font-size: 2.8rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .appo-ttl {
    font-size: 2.2rem;
  }
}

.appo-time {
  margin-top: 6.4rem;
}
@media screen and (max-width: 768px) {
  .appo-time {
    margin-top: 4.2rem;
  }
}

.appo-time_ttl {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 1.3;
  color: #927A43;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  .appo-time_ttl {
    font-size: 1.6rem;
  }
}
.appo-time_ttl::before {
  content: "";
  display: block;
  width: 0.8rem;
  height: 0.8rem;
  background-image: url(../img/common/icon_diamond.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 1rem;
}

.appo-time_list {
  margin-top: 2rem;
}
.appo-time_list > dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 3.2rem;
  line-height: 1.3;
}
@media screen and (max-width: 768px) {
  .appo-time_list > dl {
    gap: 1.6rem;
  }
}
.appo-time_list > dl dt {
  margin-block: var(--leading-trim);
  width: 6.4rem;
}
.appo-time_list > dl dd {
  margin-block: var(--leading-trim);
}
.appo-time_list > dl:not(:first-child) {
  margin-top: 1.1rem;
}

.appo-cntArea {
  width: 78.8rem;
  height: auto;
}
@media screen and (max-width: 1024px) {
  .appo-cntArea {
    margin-inline: auto;
  }
}
@media screen and (max-width: 768px) {
  .appo-cntArea {
    width: 100%;
  }
}

/* -------------------------------------
about
------------------------------------- */
.about {
  position: relative;
}

.about-inner {
  padding-block: 5.7rem 38.7rem;
}
@media screen and (max-width: 1024px) {
  .about-inner {
    padding-block: 5.7rem 12.7rem;
  }
}

.about-textArea {
  width: min(51rem, 100% - 3rem);
  margin-inline: auto;
  position: relative;
  translate: 0.3rem;
  z-index: 1;
}

.about-quote {
  position: absolute;
  top: -0.2rem;
  left: -4.2rem;
  translate: -100% -100%;
}
@media screen and (max-width: 768px) {
  .about-quote {
    width: 3.4rem;
    height: 2.9rem;
    top: -2.3rem;
    left: -0.3rem;
    translate: 0 -100%;
  }
}

.about-ttl {
  font-weight: 500;
}
@media screen and (max-width: 768px) {
  .about-ttl {
    padding-inline: 2.2rem;
  }
}
.about-ttl > span {
  display: block;
}
.about-ttl .--1 {
  font-size: 2.6rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 768px) {
  .about-ttl .--1 {
    font-size: 2rem;
  }
}
.about-ttl .--2 {
  font-size: 4rem;
  line-height: 1.3;
  letter-spacing: 0.06em;
  color: #927A43;
  margin-top: 1.6rem;
}
@media screen and (max-width: 768px) {
  .about-ttl .--2 {
    font-size: 3.6rem;
  }
}

.about-staff {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.8rem;
  margin-top: 4.6rem;
}
@media screen and (max-width: 768px) {
  .about-staff {
    margin-top: 2.4rem;
    padding-inline: 2.1rem;
  }
}
.about-staff > dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.about-staff > dl dt {
  font-size: 1.4rem;
  line-height: 2;
  color: #8B8475;
}
.about-staff > dl dd {
  margin-left: 1.45rem;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .about-staff > dl dd {
    margin-left: 1rem;
  }
}
.about-staff > dl:not(:first-child) {
  position: relative;
  padding-left: 1.8rem;
}
.about-staff > dl:not(:first-child)::before {
  content: "";
  display: block;
  width: 1px;
  height: 1.6rem;
  background-color: #D9D9D9;
  position: absolute;
  top: 1lh;
  left: 0;
  translate: 0 -50%;
}

@media screen and (max-width: 768px) {
  .about-img {
    width: 31.5rem;
    height: 37.9rem;
    margin-top: 3.2rem;
    margin-inline: auto;
    translate: -0.3rem;
    border-radius: 0.5rem;
    overflow: clip;
  }
}
@media screen and (max-width: 768px) {
  .about-img > img {
    width: 120%;
    height: 120%;
    -o-object-fit: cover;
       object-fit: cover;
    position: absolute;
    bottom: 0;
  }
}

.about-msg {
  margin-top: 9.9rem;
}
@media screen and (max-width: 768px) {
  .about-msg {
    margin-top: 5.4rem;
    padding-inline: 2.2rem;
  }
}
.about-msg > p {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 2.4;
  letter-spacing: 0.05em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}
@media screen and (max-width: 768px) {
  .about-msg > p {
    font-size: 1.4rem;
  }
}
.about-msg > p:not(:first-child) {
  margin-top: 4.5rem;
}
@media screen and (max-width: 768px) {
  .about-msg > p:not(:first-child) {
    margin-top: 3.6rem;
  }
}

.about-btn {
  margin-top: 7.2rem;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 768px) {
  .about-btn {
    margin-top: 4rem;
    padding-left: 2rem;
  }
}

.about-img_block {
  width: min(192rem, 100%);
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
  z-index: 0;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .about-img_block {
    position: relative;
    top: 0;
    left: 0;
    translate: 0;
    margin-inline: auto;
    width: min(192rem, 100% - 3rem);
    height: 35.4rem;
    margin-top: 4.7rem;
  }
}
.about-img_block .about-img_item {
  overflow: hidden;
  border-radius: 0.5rem;
  position: absolute;
}
.about-img_block .about-img_item img {
  width: 130%;
  height: 130%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
}
.about-img_block .--1 {
  width: 32.6rem;
  height: auto;
  aspect-ratio: 326/433;
  top: 4rem;
  right: 6.4rem;
}
@media screen and (max-width: 1024px) {
  .about-img_block .--1 {
    width: max(25rem, 24vw);
    right: 0;
  }
}
.about-img_block .--1 img {
  top: 0;
}
.about-img_block .--2 {
  width: 31.2rem;
  height: auto;
  aspect-ratio: 312/429;
  top: 42rem;
  left: 0;
}
@media screen and (max-width: 1024px) {
  .about-img_block .--2 {
    width: max(17.9rem, 18vw);
  }
}
@media screen and (max-width: 768px) {
  .about-img_block .--2 {
    top: auto;
    bottom: 0;
  }
}
.about-img_block .--2 img {
  bottom: 0;
}
@media screen and (max-width: 768px) {
  .about-img_block .--2 img {
    top: 0;
  }
}
.about-img_block .--3 {
  width: 40.5rem;
  height: auto;
  aspect-ratio: 405/272;
  bottom: 21rem;
  right: 4rem;
}
@media screen and (max-width: 1024px) {
  .about-img_block .--3 {
    width: max(20.1rem, 20vw);
  }
}
@media screen and (max-width: 768px) {
  .about-img_block .--3 {
    bottom: auto;
    top: 0;
    right: 0;
  }
}
.about-img_block .--3 img {
  bottom: 0;
}

/* -------------------------------------
panel
------------------------------------- */
.js-panel {
  position: sticky;
  top: 0;
}

/* -------------------------------------
feature
------------------------------------- */
.feature {
  position: relative;
  overflow: clip;
  background-color: #F7F4F0;
}

.feature-bg_text {
  width: min(141.5rem, 100%);
  position: sticky;
  top: 0;
  margin-inline: auto;
  z-index: 0;
}
@media screen and (max-width: 768px) {
  .feature-bg_text {
    width: 70.7rem;
    position: relative;
    left: -2rem;
  }
}

.feature-inner {
  padding-block: 10rem;
}
@media screen and (max-width: 768px) {
  .feature-inner {
    padding-block: 5rem 14rem;
    overflow: clip;
  }
}

.feature-block {
  margin-top: -2rem;
}
@media screen and (max-width: 768px) {
  .feature-block {
    margin-top: -1.7rem;
  }
}

@media screen and (max-width: 768px) {
  .feature-ttl {
    text-align: center;
  }
}
.feature-ttl > span {
  display: block;
  margin-block: var(--leading-trim);
  font-weight: 500;
  letter-spacing: 0.02em;
}
.feature-ttl .--sub {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .feature-ttl .--sub {
    font-size: 1.6rem;
  }
}
.feature-ttl .--main {
  font-size: 2.8rem;
  line-height: 1.6;
  margin-top: calc((1em - 1lh) / 2 + 3.5rem);
}
@supports not (top: 1lh) {
  .feature-ttl .--main {
    margin-top: 3.5rem;
  }
}
@media screen and (max-width: 768px) {
  .feature-ttl .--main {
    font-size: 2.2rem;
    margin-top: calc((1em - 1lh) / 2 + 2.2rem);
  }
  @supports not (top: 1lh) {
    .feature-ttl .--main {
      margin-top: 2.2rem;
    }
  }
}

.feature-nav {
  padding-block: 24.6vh;
}
@media screen and (max-width: 768px) {
  .feature-nav {
    padding-block: 0;
  }
}

.l-col2.--sticky .feature-nav {
  top: 12rem;
}

.feature-nav_list {
  margin-top: 6rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.feature-nav_list.sp-only {
  display: none;
}
@media screen and (max-width: 768px) {
  .feature-nav_list.sp-only {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .feature-nav_list.sp-none {
    display: none;
  }
  .feature-nav_list {
    margin-top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 0.8rem;
    position: sticky;
    top: 54rem;
    z-index: 0;
    translate: 0 10rem;
  }
}
.feature-nav_list > li {
  display: grid;
  place-items: center;
  width: 6.8rem;
  height: 3.6rem;
  border: 1px solid #fff;
  border-radius: 10rem;
  font-size: 1.5rem;
  line-height: 1.5;
  letter-spacing: 0.02rem;
  color: #8B8475;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 768px) {
  .feature-nav_list > li {
    width: 4.8rem;
    height: 2.8rem;
    font-size: 1.3rem;
  }
}
.feature-nav_list > li.active {
  font-weight: 500;
  background-color: #fff;
  color: #433C2C;
}

.feature-list {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4rem;
  padding-bottom: 15vh;
}
@media screen and (max-width: 1024px) {
  .feature-list {
    padding-bottom: 55vh;
  }
}
@media screen and (max-width: 768px) {
  .feature-list {
    margin-top: 0.6rem;
    gap: 0;
    padding-bottom: 15vh;
  }
}
.feature-list > li {
  width: 76.5rem;
  min-height: 65rem;
  position: sticky;
  top: 12rem;
  display: grid;
  grid-template-areas: "num img" "num text";
  grid-template-columns: 5.6rem 1fr;
  grid-template-rows: 28rem 1fr;
  background-color: #fff;
  border-radius: 1rem;
}
@media screen and (max-width: 768px) {
  .feature-list > li {
    width: 100%;
    height: 54rem;
    min-height: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    top: 8rem;
  }
}
@media screen and (max-width: 768px) {
  .feature-list > li + li {
    margin-top: 27rem;
  }
}
.feature-list_num {
  grid-area: num;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #AF8F43;
  padding-top: 3.2rem;
}
@media screen and (max-width: 768px) {
  .feature-list_num {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 1.5rem 2rem 1.5rem;
    letter-spacing: 0.02em;
    line-height: 1.5;
    font-size: 1.2rem;
  }
}
.feature-list_num .--text {
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-orientation: mixed;
  margin-top: 2.4rem;
  padding-top: 2.4rem;
  position: relative;
}
@media screen and (max-width: 768px) {
  .feature-list_num .--text {
    writng-mode: horizontal-tb;
    -webkit-writing-mode: horizontal-tb;
    margin-top: 0;
    padding-top: 0;
    margin-left: 1.8rem;
    padding-left: 1.8rem;
  }
}
.feature-list_num .--text::before {
  content: "";
  display: block;
  width: 1.6rem;
  height: 1px;
  background-color: #D9D9D9;
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
}
@media screen and (max-width: 768px) {
  .feature-list_num .--text::before {
    width: 1px;
    height: 1.4rem;
    top: 50%;
    left: 0;
    translate: 0 -50%;
  }
}

.feature-list_img {
  grid-area: img;
  border-radius: 1rem;
  overflow: clip;
  position: relative;
}
@media screen and (max-width: 768px) {
  .feature-list_img {
    border-radius: 0.8rem;
    width: 100%;
    height: auto;
    aspect-ratio: 345/150;
  }
}
.feature-list_img::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, rgba(255, 255, 255, 0)), color-stop(96%, rgb(255, 255, 255)));
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, rgb(255, 255, 255) 96%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.feature-list_text {
  width: min(64rem, 100% - 2rem);
  padding: 3.7rem 0 0rem 5rem;
  grid-area: text;
}
@media screen and (max-width: 768px) {
  .feature-list_text {
    width: 100%;
    padding: 2.7rem 2rem;
  }
}
.feature-list_text .--ttl {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  color: #927A43;
}
@media screen and (max-width: 768px) {
  .feature-list_text .--ttl {
    font-size: 2.2rem;
  }
}
.feature-list_text .--text {
  margin-top: calc((1em - 1lh) / 2 + 3rem);
}
@supports not (top: 1lh) {
  .feature-list_text .--text {
    margin-top: 3rem;
  }
}
.feature-list_text .--text {
  line-height: 2;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .feature-list_text .--text {
    line-height: 1.7;
    margin-top: calc((1em - 1lh) / 2 + 2.3rem);
  }
  @supports not (top: 1lh) {
    .feature-list_text .--text {
      margin-top: 2.3rem;
    }
  }
}

/* -------------------------------------
pro
------------------------------------- */
.pro {
  overflow: clip;
  position: relative;
  z-index: 1;
  color: #fff;
}

.pro-bg {
  position: sticky;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
  background-image: url(../img/front/pro_bg.webp);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.p-front_pro-bgText {
  position: absolute;
  top: 9rem;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .p-front_pro-bgText {
    top: 5rem;
  }
}
.p-front_pro-bgText .--item {
  width: 187rem;
  padding-left: 5rem;
}
@media screen and (max-width: 768px) {
  .p-front_pro-bgText .--item {
    width: 96.1rem;
    padding-left: 2.5rem;
  }
}

.pro-inner {
  margin-top: -100vh;
  padding-block: 21.5rem 32.4vw;
}
@media screen and (max-width: 768px) {
  .pro-inner {
    padding-block: 11rem 60vw;
  }
}

.pro-ttl {
  text-align: center;
  margin-inline: auto;
}
.pro-ttl > span {
  display: block;
  margin-block: var(--leading-trim);
  font-weight: 500;
  letter-spacing: 0.02em;
}
.pro-ttl .--sub {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .pro-ttl .--sub {
    font-size: 1.6rem;
  }
}
.pro-ttl .--main {
  font-size: 2.8rem;
}
@media screen and (max-width: 768px) {
  .pro-ttl .--main {
    font-size: 2.2rem;
    margin-top: calc((1em - 1lh) / 2 + 2.8rem);
  }
  @supports not (top: 1lh) {
    .pro-ttl .--main {
      margin-top: 2.8rem;
    }
  }
  .pro-ttl .--main {
    line-height: 1.3;
  }
}
.pro-ttl .--strong {
  font-size: 3.6rem;
}

.pro-cnt {
  margin-top: 6.3rem;
}
@media screen and (max-width: 768px) {
  .pro-cnt {
    margin-top: 4.8rem;
  }
}

.pro-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.4rem;
}
@media screen and (max-width: 768px) {
  .pro-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.pro-list > li:nth-child(2) {
  margin-top: 6.2rem;
}
@media screen and (max-width: 768px) {
  .pro-list > li:nth-child(2) {
    margin-top: 0;
  }
}
.pro-list > li:nth-child(2n+3) {
  margin-top: -15.2rem;
}
@media screen and (max-width: 768px) {
  .pro-list > li:nth-child(2n+3) {
    margin-top: 0;
  }
}
@media screen and (max-width: 1024px) {
  .pro-list > li:nth-child(5) {
    margin-top: -11rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-list > li:nth-child(5) {
    margin-top: 0;
  }
}
.pro-list > li > a {
  display: block;
  width: 58.3rem;
  background-color: rgba(21, 100, 132, 0.25);
  padding: 5.6rem 4.8rem 7.2rem;
  border-radius: 1rem;
  position: relative;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 1024px) {
  .pro-list > li > a {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .pro-list > li > a {
    background-color: rgba(21, 100, 132, 0.7);
    padding: 2.4rem 2rem 4.8rem;
  }
}
@media (hover: hover) {
  .pro-list > li > a:hover {
    background-color: rgba(21, 100, 132, 0.7);
  }
  .pro-list > li > a:hover .--img {
    opacity: 1;
  }
}
.pro-list > li > a .--num {
  display: grid;
  place-items: center;
  width: 5.6rem;
  height: 5.6rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 1rem;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 768px) {
  .pro-list > li > a .--num {
    width: 4.4rem;
    height: 4.4rem;
  }
}
.pro-list > li > a .--img {
  opacity: 0;
  width: 21rem;
  height: auto;
  aspect-ratio: 210/140;
  border-radius: 0.5rem;
  overflow: clip;
  position: absolute;
  top: 2.4rem;
  right: 2.4rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 1024px) {
  .pro-list > li > a .--img {
    opacity: 1;
    width: 12rem;
  }
}
.pro-list > li > a .--img::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(1, 59, 82, 0.1);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.pro-list > li > a .--ttl {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  margin-top: calc((1em - 1lh) / 2 + 5.6rem);
}
@supports not (top: 1lh) {
  .pro-list > li > a .--ttl {
    margin-top: 5.6rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-list > li > a .--ttl {
    font-size: 2.2rem;
  }
}
.pro-list > li > a .--text {
  line-height: 2;
  letter-spacing: 0.05em;
  margin-top: calc((1em - 1lh) / 2 + 4rem);
}
@supports not (top: 1lh) {
  .pro-list > li > a .--text {
    margin-top: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-list > li > a .--text {
    line-height: 1.7;
    margin-top: calc((1em - 1lh) / 2 + 3.2rem);
  }
  @supports not (top: 1lh) {
    .pro-list > li > a .--text {
      margin-top: 3.2rem;
    }
  }
}
.pro-list > li > a .--btn {
  width: 10.8rem;
  margin-top: 4rem;
}
@media screen and (max-width: 768px) {
  .pro-list > li > a .--btn {
    margin-top: 3.2rem;
  }
}
.pro-list > li > a .--btn .c-btn_text {
  color: #fff;
  font-size: 1.3rem;
  line-height: 1.2;
  letter-spacing: 0.03em;
}
.pro-list > li > a .--btn .c-btn_text::after {
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.pro-msg {
  margin-top: 14.4rem;
  position: relative;
}
@media screen and (max-width: 768px) {
  .pro-msg {
    margin-top: 10rem;
    padding-inline: 1.4rem;
  }
}

.pro-msg_ttl {
  color: #fff;
}
.pro-msg_ttl::before {
  margin-right: 0.7rem;
  -webkit-filter: brightness(0) invert(1);
          filter: brightness(0) invert(1);
}

.pro-msg_cnt {
  width: min(104.7rem, 100% - 2rem);
  margin-top: 9.6rem;
  margin-left: 8.5rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 4rem;
}
@media screen and (max-width: 1024px) {
  .pro-msg_cnt {
    margin-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .pro-msg_cnt {
    width: 100%;
    margin-top: 4.5rem;
    margin-inline: 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.pro-msg_img img {
  width: 29.8rem;
  height: 40.9rem;
  border-radius: 0.5rem;
}
@media screen and (max-width: 1024px) {
  .pro-msg_img img {
    margin-inline: auto;
  }
}
@media screen and (max-width: 768px) {
  .pro-msg_img img {
    width: 24.7rem;
    height: 33.9rem;
  }
}
.pro-msg_img figcaption {
  text-align: center;
  margin-top: calc((1em - 1lh) / 2 + 3.2rem);
}
@supports not (top: 1lh) {
  .pro-msg_img figcaption {
    margin-top: 3.2rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-msg_img figcaption {
    margin-top: calc((1em - 1lh) / 2 + 2.1rem);
  }
  @supports not (top: 1lh) {
    .pro-msg_img figcaption {
      margin-top: 2.1rem;
    }
  }
}
.pro-msg_img figcaption > span {
  display: block;
  margin-block: var(--leading-trim);
}
.pro-msg_img figcaption .--ttl {
  font-size: 1.4rem;
  line-height: 2;
}
@media screen and (max-width: 768px) {
  .pro-msg_img figcaption .--ttl {
    line-height: 1.6;
    letter-spacing: 0.02em;
  }
}
.pro-msg_img figcaption .--name {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 2;
  margin-top: calc((1em - 1lh) / 2 + 1.6rem);
}
@supports not (top: 1lh) {
  .pro-msg_img figcaption .--name {
    margin-top: 1.6rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-msg_img figcaption .--name {
    margin-top: calc((1em - 1lh) / 2 + 1.1rem);
  }
  @supports not (top: 1lh) {
    .pro-msg_img figcaption .--name {
      margin-top: 1.1rem;
    }
  }
}

.pro-msg_text {
  width: min(65.3rem, 100%);
}
@media screen and (max-width: 1024px) {
  .pro-msg_text {
    margin-inline: auto;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
}
.pro-msg_text .--ttl {
  font-size: 1.4rem;
  line-height: 1.6;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 768px) {
  .pro-msg_text .--ttl {
    font-size: 1.2rem;
    position: absolute;
    top: 0;
    right: 1.4rem;
  }
}
.pro-msg_text .--catch {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 2;
  letter-spacing: 0.02em;
  margin-top: calc((1em - 1lh) / 2 + 7rem);
}
@supports not (top: 1lh) {
  .pro-msg_text .--catch {
    margin-top: 7rem;
  }
}
@media screen and (max-width: 768px) {
  .pro-msg_text .--catch {
    font-size: 2.2rem;
    margin-top: calc((1em - 1lh) / 2 + 2.8rem);
  }
  @supports not (top: 1lh) {
    .pro-msg_text .--catch {
      margin-top: 2.8rem;
    }
  }
}
.pro-msg_text .--text {
  margin-top: 4.2rem;
}
@media screen and (max-width: 768px) {
  .pro-msg_text .--text {
    margin-top: 2.2rem;
  }
}
.pro-msg_text .--text > p {
  line-height: 2;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .pro-msg_text .--text > p {
    line-height: 1.7;
  }
}
.pro-msg_text .--text > p:not(:first-child) {
  margin-top: calc((1em - 1lh) / 2 + 1lh);
}
@supports not (top: 1lh) {
  .pro-msg_text .--text > p:not(:first-child) {
    margin-top: 1lh;
  }
}

.pro-exterior {
  width: 100%;
  height: auto;
  aspect-ratio: 1440/480;
  position: absolute;
  bottom: 0;
}
@media screen and (max-width: 768px) {
  .pro-exterior {
    aspect-ratio: 345/150;
  }
}

/* -------------------------------------
service
------------------------------------- */
.service {
  background-color: #F7F4F0;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .service {
    margin-top: -4rem;
  }
}

.service-ttl .--main {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  margin-top: calc((1em - 1lh) / 2 + 4.6rem);
}
@supports not (top: 1lh) {
  .service-ttl .--main {
    margin-top: 4.6rem;
  }
}
@media screen and (max-width: 768px) {
  .service-ttl .--main {
    font-size: 2.6rem;
    margin-top: calc((1em - 1lh) / 2 + 2.6rem);
  }
  @supports not (top: 1lh) {
    .service-ttl .--main {
      margin-top: 2.6rem;
    }
  }
}

.service-inner {
  padding-block: 16rem 14rem;
}
@media screen and (max-width: 768px) {
  .service-inner {
    padding-block: 8rem;
    padding-inline: 1.5rem;
  }
}

.service-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 4rem;
}
@media screen and (max-width: 1024px) {
  .service-block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 3.8rem;
  }
}

.service-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(5, 1fr);
  grid-auto-flow: column;
  -webkit-column-gap: 2.5rem;
     -moz-column-gap: 2.5rem;
          column-gap: 2.5rem;
}
@media screen and (max-width: 768px) {
  .service-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.service-list > li {
  border-top: 1px solid #EED9C2;
}
.service-list > li:nth-child(5) {
  border-bottom: 1px solid #EED9C2;
}
@media screen and (max-width: 768px) {
  .service-list > li:nth-child(5) {
    border-bottom: none;
  }
}
.service-list > li:last-child {
  border-bottom: 1px solid #EED9C2;
}

.service-list_item {
  width: 45.5rem;
  height: 12.2rem;
  padding-inline: 0.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  z-index: 1;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media screen and (max-width: 1024px) {
  .service-list_item {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .service-list_item {
    height: auto;
    padding-inline: 0.4rem;
    padding-block: 1.95rem 1.5rem;
  }
}
@media (hover: hover) {
  .service-list_item:hover::before {
    opacity: 1;
  }
}
.service-list_item::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, right top, from(#F1EADA), to(rgba(241, 234, 218, 0)));
  background: linear-gradient(90deg, #F1EADA 0%, rgba(241, 234, 218, 0) 100%);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.service-list_item::after {
  content: "";
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin-inline: auto 1.5rem;
  background-image: url(../img/common/icon_arrow.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 768px) {
  .service-list_item::after {
    margin-inline: auto 0.8rem;
  }
}
.service-list_item .--icon {
  width: 6rem;
  height: 6rem;
}
@media screen and (max-width: 768px) {
  .service-list_item .--icon {
    width: 5rem;
    height: 5rem;
  }
}
.service-list_item .service-list_text {
  margin-left: 2rem;
}
@media screen and (max-width: 768px) {
  .service-list_item .service-list_text {
    margin-left: 1.6rem;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    translate: 0 -0.4rem;
  }
}
.service-list_item .service-list_text .--ttl {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .service-list_item .service-list_text .--ttl {
    font-size: 1.6rem;
    margin-block: 0;
  }
}
.service-list_item .service-list_text .--list {
  margin-top: 0.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.6rem;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  .service-list_item .service-list_text .--list {
    gap: 0.4rem;
    margin-top: 0.6rem;
  }
}
.service-list_item .service-list_text .--list > li {
  background-color: #FCFBF9;
  border-radius: 10rem;
  display: grid;
  place-items: center;
  padding: 0.3rem 0.6rem;
  color: #8B8475;
  font-size: 1.4rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .service-list_item .service-list_text .--list > li {
    font-size: 1.1rem;
    line-height: 1.3;
  }
}

/* -------------------------------------
first
------------------------------------- */
.first-block {
  padding: 8.3rem 8.5rem;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 768px) {
  .first-block {
    border-radius: 3rem;
    padding: 5.1rem 1.5rem;
  }
}
.first-block::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 5rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background-color: #F6EDE3;
  filter: blur(4px);
  -webkit-filter: blur(4px);
}

.first-ttl {
  text-align: center;
}
.first-ttl .--sub {
  font-size: 1.4rem;
  line-height: 1.2;
  letter-spacing: 0.03em;
  color: #927A43;
}
@media screen and (max-width: 768px) {
  .first-ttl .--sub {
    font-size: 1.2rem;
  }
}
.first-ttl .--main {
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  margin-top: calc((1em - 1lh) / 2 + 2.2rem);
}
@supports not (top: 1lh) {
  .first-ttl .--main {
    margin-top: 2.2rem;
  }
}
@media screen and (max-width: 768px) {
  .first-ttl .--main {
    font-size: 2.6rem;
    margin-top: calc((1em - 1lh) / 2 + 1.9rem);
  }
  @supports not (top: 1lh) {
    .first-ttl .--main {
      margin-top: 1.9rem;
    }
  }
}

.first-cnt {
  margin-top: 5.6rem;
}
@media screen and (max-width: 768px) {
  .first-cnt {
    margin-top: 2.8rem;
  }
}

/* -------------------------------------
news
------------------------------------- */
.news-btn {
  width: 11.5rem;
}
@media screen and (max-width: 1024px) {
  .news-btn {
    width: 10.7rem;
    margin-top: 2.6rem;
    margin-left: auto;
  }
}

.news-inner {
  padding-block: 16.2rem 17rem;
}
@media screen and (max-width: 768px) {
  .news-inner {
    padding-block: 9rem 10.5rem;
    padding-inline: 1.5rem;
  }
}

.news-block {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 13.7rem auto;
  grid-template-areas: "ttl list" "btn list";
}
@media screen and (max-width: 1024px) {
  .news-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.news-ttl {
  grid-area: ttl;
}
.news-ttl .--sub {
  color: #927A43;
}
.news-ttl .--main {
  margin-top: calc((1em - 1lh) / 2 + 4.6rem);
}
@supports not (top: 1lh) {
  .news-ttl .--main {
    margin-top: 4.6rem;
  }
}
@media screen and (max-width: 768px) {
  .news-ttl .--main {
    margin-top: calc((1em - 1lh) / 2 + 2.6rem);
  }
  @supports not (top: 1lh) {
    .news-ttl .--main {
      margin-top: 2.6rem;
    }
  }
}

.news-list {
  grid-area: list;
  width: 93.5rem;
}
@media screen and (max-width: 1024px) {
  .news-list {
    width: 100%;
    margin-top: 4rem;
  }
}

/* -------------------------------------
sns
------------------------------------- */
.sns {
  position: relative;
}

.bg_line {
  position: absolute;
  top: -2.8vw;
  left: 0;
  width: 100%;
  height: min(154.9305555556vw, 2271px);
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .bg_line {
    width: 100%;
    height: auto;
    aspect-ratio: 1362/2231;
  }
}
@media screen and (max-width: 768px) {
  .bg_line {
    height: 131rem;
    top: -15.8vw;
  }
}
.bg_line #page_bg_line {
  width: min(94.5833333333vw, 1440px);
  position: absolute;
  top: 0;
  left: -13.4vw;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .bg_line #page_bg_line {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .bg_line #page_bg_line {
    width: 80rem;
    left: auto;
    right: -16vw;
  }
}
.bg_line #maskPath {
  stroke-dashoffset: 4132.78;
  stroke-dasharray: 4132.78;
  fill: none;
  stroke: #fff;
  stroke-width: 200;
  stroke-linecap: round;
  stroke-linejoin: round;
  -webkit-transition: 2s cubic-bezier(0.61, 1, 0.88, 1);
  transition: 2s cubic-bezier(0.61, 1, 0.88, 1);
}
.bg_line #maskPath.is-active {
  stroke-dashoffset: 0;
}

.sns-block {
  padding: 7.9rem 8.1rem 5.9rem;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 768px) {
  .sns-block {
    padding: 6rem 2.5rem;
  }
}
.sns-block::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 5rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background-color: rgba(255, 255, 255, 0.8);
  -webkit-filter: blur(4px);
          filter: blur(4px);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.sns-ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 400;
  font-size: 2.67rem;
  line-height: 1.2;
  letter-spacing: 0.03em;
  color: #927A43;
}
@media screen and (max-width: 768px) {
  .sns-ttl {
    font-size: 2rem;
  }
}
.sns-ttl::before {
  content: "";
  display: block;
  width: 4rem;
  height: 4rem;
  background-image: url(../img/common/icon_instagram.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 1rem;
}
@media screen and (max-width: 768px) {
  .sns-ttl::before {
    width: 3rem;
    height: 3rem;
  }
}

.sns-cnt {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 5.4rem 1fr;
  gap: 3rem 4rem;
  grid-template-areas: "id list" "desc list";
  padding-block: 4rem 3.6rem;
}
@media screen and (max-width: 768px) {
  .sns-cnt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: unset;
  }
}
.sns-cnt + .sns-cnt {
  padding-block: 4.8rem;
  border-top: 1px solid #EED9C2;
}
.sns-cnt:last-of-type {
  padding-bottom: 0;
}

.sns-id {
  grid-area: id;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 2.4rem;
  margin-top: auto;
  padding: 0 1rem;
  border-radius: 9999px;
  background-color: #F7F4F0;
  font-size: 1.4rem;
  line-height: 1.7;
  letter-spacing: 0.05em;
  color: #927A43;
}

.sns-list {
  grid-area: list;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.5rem;
}
@media screen and (max-width: 768px) {
  .sns-list {
    margin-top: 1.6rem;
    gap: 0.5rem;
  }
}
.sns-list > li > a {
  display: block;
  width: 20rem;
  height: 20rem;
  border-radius: 0.6rem;
  overflow: clip;
}
@media screen and (max-width: 768px) {
  .sns-list > li > a {
    width: 9.5rem;
    height: 9.5rem;
    border-radius: 0.3rem;
  }
}
.sns-list > li > a > img {
  -webkit-transition: 0.8s cubic-bezier(0.25, 1, 0.5, 1);
  transition: 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
@media (hover: hover) {
  .sns-list > li > a:hover > img {
    scale: 1.05;
  }
}

.sns-desc {
  grid-area: desc;
  line-height: 1.7;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .sns-desc {
    margin-top: 2.4rem;
  }
}

.sns-btn {
  width: 11.5rem;
  margin-top: 2.2rem;
}
@media screen and (max-width: 768px) {
  .sns-btn {
    width: 10.4rem;
    margin-top: 2.4rem;
  }
}

/* -------------------------------------
gallery
------------------------------------- */
.gallery-inner {
  padding-block: 16rem 18rem;
}
@media screen and (max-width: 768px) {
  .gallery-inner {
    padding-block: 8rem;
  }
}

.gallery-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.gallery-list .--list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5rem;
  padding-left: 0.5rem;
}
.gallery-list .--list > li {
  width: 60rem;
  height: 40rem;
}
@media screen and (max-width: 768px) {
  .gallery-list .--list > li {
    width: 30rem;
    height: 20rem;
  }
}
.gallery-list .--list > li > img {
  display: block;
}

/* -------------------------------------
footer
------------------------------------- */
.footer_wrap {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(247, 244, 240, 0)), to(#F8E9D9));
  background: linear-gradient(180deg, rgba(247, 244, 240, 0) 0%, #F8E9D9 100%);
}