/* === リセット & フォント === */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /*outline: 1px solid;*/
}

body {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Mincho ProN", "MS PMincho",'Noto Serif JP','Noto Sans JP' ,sans-serif;
  color: #7d695f;
  background: #fff;
  line-height: 1.8;
  text-size-adjust:100%;
  -webkit-text-size-adjust:100%;
  background-color: #fac0c6;
}

section {
  max-width: 100%;
  margin: 0 auto;
  position: relative;
}

/*========================================
    loading
  ========================================*/
#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fac0c6;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loading__inner {
  font-size: 5vw;
  opacity: 0;
  color: #7d695f;
  margin-top: auto;
  margin-bottom: auto;
}

#loading.mask-out {
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 100%);
  -webkit-mask-size: 200% 100%;
  mask-size: 200% 100%;
  -webkit-mask-position: left center;
  mask-position: left center;
  animation: maskFadeOut 1.2s ease forwards;
}

@keyframes maskFadeOut {
  0% {
    -webkit-mask-position: left center;
    mask-position: left center;
    opacity: 1;
  }
  100% {
    -webkit-mask-position: right center;
    mask-position: right center;
    opacity: 0;
  }
}




#main-content {
  opacity: 0;
  transition: opacity 0.5s ease;
  overflow: hidden;
}

/* === Hero Section === */
.hero {
  background-color: #fac0c6;
  align-items: center; /* 中央寄せ */
  position: relative;
  padding-bottom: 0;
  margin-top:0 ;
  margin-bottom: 6vw;
}

.wave-top, .wave-bottom_pc, .wave-bottom_mobile {
  position: absolute;
  left: 0;
  width: 100%;
  pointer-events: none; /* 要素の上にあってもクリック等が無効に */
}

.wave-top {
  top: 0;
  z-index: 5;
  height: 7.71vw;
}

.wave-bottom_pc {
  z-index: 2;
  bottom: -13%;
  display: block;
  position: absolute;
  height: 15.625vw;
  padding: 0;
}

.wave-bottom_mobile {
  display: none;
}

.hero-inner {
  /*max-width: 1920px;*/
  margin: 0 auto;
  position: relative;
  width: 100%;
  padding: 60px 0px;
}

.hero-text {
  position: relative;
  /*margin-bottom: calc(160px + 1vw);*/
  color: #7d695f;
  max-width: 1920px;
  padding-left: 3vw;
}

.logo-small {
  font-size: 1.04vw;
  font-family: "Hiragino Kaku Gothic ProN", sans-serif;
  letter-spacing: 0.2em;
  color: #7d695f;
  max-width: 1920px;
  margin-bottom: 5vw;
}

.catch-copy {
  font-size: 2.08vw;
  font-family: "Hiragino Mincho ProN", 'Noto Serif JP',sans-serif;
  margin-bottom: 1vw;
  padding-left: 5vw;
}

.sub-copy {
  font-size: 1.04vw;
  font-family: "Hiragino Mincho ProN",'Noto Serif JP',sans-serif;
  position: relative;
  /*left: 50px;*/
  margin-top: 25px;
  max-width: fit-content;
  margin-bottom: 10px;  
  padding-left: 1.5vw;
}

.mobile-br {
  display: none;
}

/* === Hero-img === */
.hero-gallery {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 4vw;
  overflow: hidden;
}

.hero-images-wrapper {
  width: 100%;
  overflow: hidden;
}

.hero-images {
  display: flex;
  justify-content: left;
  gap: .5vw;
  position: relative;
  background-color: #fac0c6;
  animation: scroll-dynamic 20s linear infinite;
  /*max-width: 1920px;*/
  /*overflow: hidden;*/

}

/*.hero-images.animate-scroll {
  animation: scroll-horizontal 100s linear infinite;
}

@keyframes scroll-horizontal {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translatex(-50%);
  }
}*/

.hero-images img {
  width: 30.41vw;
  height: auto;
  object-fit: cover;
  max-height: 100%;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  border: none;
}


.hero-overlay-title {
  font-size: 7vw;
  font-family: "MS PMincho",'Noto Serif JP', sans-serif;
  font-weight: 400;
  /*color: #fac0c6;*/
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translateX(-50%);
  letter-spacing: 0.2em;
  pointer-events: none;
  white-space: nowrap;
  z-index: 10;
  align-items: center;
  color: #fff;
  text-shadow: #303030 0.15vw 0.15vw 0.78vw;
}

/* === Introduction === */
.introduction {
  max-width: 100%;
  padding: 50px 50px 50px 50px;
  background-color: white;
  position: relative;
  /*top: calc(-475px + 2vw);*/
  z-index: 3;
}

.introduction_2 {
  display: none;
}

.intro-inner_pc {
  display: flex;
  flex-wrap: wrap;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  max-width: 74.47vw;
  margin: 50px auto;
  padding-bottom: -5vw;
}

.intro-inner_mobile, .intro-text_1_mobile, .intro-images_1_mobile,
.intro-text_2_mobile, .intro-images_2_mobile{
  display: none;
}


.intro-text_pc {
  display: inline;
  flex: 1 1 400px;
  max-width: 36.45vw;
  line-height: 2.5;
  font-size: 1.04vw;
  color: #7D695F;
  font-family:  "Hiragino Mincho ProN",'Noto Serif JP',sans-serif;
}


.intro-text_pc ul {
  margin-bottom: 1.8em;
  padding-left: 40px;
}

.intro-text_pc p {
  margin-bottom: 1.8em;
}

.intro-images_pc {
  position: relative;
  display: inline;
  width: 50%;
  /*min-height: 1010px;*/
}


#intro-img_1{
  position: absolute;
  top: 13.95vw;
  left: 0;
  width: 13.76vw;
  }

#intro-img_2{
  position: absolute;
  top: 0;
  left: 14.21vw;
  width: 25.31vw;
}

#intro-img_3{
  position: absolute;
  top: 31.25vw;
  left: 7.81vw;
  width: 16.65vw;
}

#intro-img_4{
  position: absolute;
  top: 31.25vw;
  left: 25vw;
  width: 10.93vw;
}

.wave-intro_pc {
  position: absolute;
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 5;
  display: block;
  height: 15.625vw;
  margin-bottom: 0;
  transform: scale(1,-1);
  bottom: -15%;
}

.wave-intro_mobile_1, .wave-intro_mobile_2 {
  display: none;
}

.br__intro__pc {
  display: block;
}

.br__intro__mobile {
  display: none;
}


/* === Services Section (Revised) === */

.services{
  background: #FAE5D7;
  padding-top: 60px;
  max-width: 100%;
  padding-bottom: 60px;
  padding-left: 0;
  padding-right: 0;
  /*margin-top: calc(-4vw - 375px);*/
}

.service-detail {
  display: flex;
  align-items: center;
  gap: 4.79vw;
  max-width: 70.31vw;
  margin: 235px auto 0 auto;
}

.service-detail__img {
  flex: 1;
  z-index: 2;
}

.service-detail__img img {
  /*width: 100%;*/
  height: auto;
  border-radius: 8px;
  width: 35.15vw;
}

/* スマホ用画像非表示 */
#e-majyo_mobile, #aurgrande_mobile, #axia_mobile, #Future_Beauty_mobile {
  display: none;
}

.service-detail__content {
  flex: 1;
  color: #7D695F;
  z-index: 2;
}

.service-detail__content .category {
  font-family: "Hiragino Kaku Gothic ProN",'Noto Sans JP' ,sans-serif;
  font-size: 0.9vw;
  color: #976B56;
  font-weight: bold;
  margin-bottom: 0;
}

.service-detail__content h3 {
  font-family: "Hiragino Mincho ProN","Noto Serif JP",sans-serif;
  font-weight: 100;
  font-size: 2.28vw;
  line-height: 1.5;
  margin-top: 0;
  margin-bottom: 2.34vw;
}

.service-detail__content .description {
  font-family: "Hiragino Mincho ProN",'Noto Serif JP',sans-serif;
  font-weight: 300;
  font-size: 1.04vw;
  line-height: 2.2;
  margin-bottom: 1.82vw;
  color: #7D695F;
}

.service-btn {
  display:inline-block;
  text-decoration: none;
  background: linear-gradient(to bottom,#FFC2BA 0%, #FA7575 100%);
  border-radius: 1vw;
  cursor: pointer;
  transition:  all 0.3s ease;
  align-items: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  line-height: 0;
}

.btn-inner {
  display: flex;
  align-items: center;
  padding: 1.30vw 1.30vw 1.30vw 5.20vw;
  gap: 3.33vw;
  text-decoration: none;
}

.service-btn:hover {
  background-color: #f8c7c1;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  transform: translateY(-2px);
  transform: scale(105%);
}

.service-btn:active {
  box-shadow: none;
  transform: translateY(2px);
  transform: scale(95%);
  background-color: #e8afa7;
}



.btn-text {
  font-family: "Hiragino Kaku Gothic ProN",'Noto Sans JP' ,sans-serif;
  font-size: 1.04vw;
  line-height: 1;
  color: #fff;
}

.btn-arrow {
  width: 0.7vw;
  height: auto;
  display: inline-block;
  color: #fff;
}

/* 偶数番目（2, 4...）のレイアウトを反転 */
.service-detail:nth-of-type(even) {
  flex-direction: row-reverse;
}


.service-content {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-bottom: 80px;
}

.service-content.reverse {
  flex-direction: row-reverse;
}

.service-content img {
  width: 50%;
  height: auto;
  object-fit: cover;
}

.text-block {
  width: 50%;
}


.service-decoration_1 {
  position: relative;
  top: -34vw;
  margin-bottom: -30vw;
  left: 0;
  width: auto;
  z-index: 1;
  pointer-events: none;
}

.wave-service {
  position: absolute;
  left: 0;
  width: 100%;
  pointer-events: none;
  bottom: -3%;
  z-index: 5;
  display: block;
  height: 15.625vw;
  margin-bottom: 0;
  transform: scale(1,-1);
  /*margin-top: calc(-64px + -7vw);*/
}


/* === Company Info (Revised) === */
.company-section {
  background: linear-gradient(
    to bottom,
    #fad9d1 0%,
    #fef5f5 20%,
    #fff9fb 50%,
    #fef5f5 80%,
    #fad9d1 100%
  );
  padding: 100px auto;
  font-family: "Hiragino Mincho ProN", "MS PMincho", 'Noto Serif JP',sans-serif;
  color: #7d695f;
  width: 100%;
  /*margin-top: calc(108px + -2vw);*/
}


.company-inner {
  max-width: 75vw;
  padding: 15vw 20px 10vw 20px;
  /*margin-bottom: 2.08vw;*/
  margin-left: auto;
  margin-right: auto;
  width: 75vw;
}

/*
.company-info{
  margin-left: 200px;
}
*/

.info-title {
  position: relative;
  top:1.56vw;
  margin-bottom: 0;
}

.info-title p {
  font-size: 1.04vw;
  letter-spacing: 0.05em;
}

.info-title h2 {
  font-family: "Hiragino Mincho ProN","Noto Serif JP","sans-serif";
  font-size: 2vw;
  margin-bottom: 0px;
  font-weight:300;
  line-height: 1.3;
}

.info-table{
  margin-left: 28.83vw;
  margin-top: 0;
  font-size: 1.04vw;
  line-height:100px;
}

.info-table dl {
  display: flex;
  margin-bottom: 10px;
  align-items: flex-start; /* 上端で揃える */
}

.info-table dt {
  width: 7vw;
  line-height: 2.5;
  min-height: 5em;
  display: flex;
  align-items: center;
}

.info-table dd {
  margin-left: 1.38vw;
  line-height: 2.5;
  min-height: 5em;
  display: flex;
  align-items: center;
}

.company-history{
  margin-top: 15vw;
  /*margin-left: 200px;*/
}

.history-title {
  position: relative;
  top:1.56vw;
  margin-bottom: 0;
}

.history-title p {
  font-size: 1.04vw;
  letter-spacing: 0.05em;
}

.history-title h2 {
  font-family: "Hiragino Mincho ProN","Noto Serif JP","sans-serif";
  font-size: 2vw;
  margin-bottom: 0px;
  font-weight:300;
  line-height: 1.3;
}

.history-table{
  margin-left: 28.83vw;
  margin-top: 0;
  font-size: 1.04vw;
  line-height:100px;
}

.history-table dl {
  display: flex;
  margin-bottom: 10px;
  align-items: flex-start; /* 上端で揃える */
}

/*.history-table dl + dl  {
  border-top: 0.5px solid #BFAFA2;
}*/

.history-table dt {
  width: 7vw;
  line-height: 2.5;
  min-height: 5em;
  display: flex;
  align-items: center;
  letter-spacing: 3px;
}

.history-table dd {
  margin-left: 1.38vw;
  line-height: 2.5;
  min-height: 5em;
  display: flex;
  align-items: center;
}

.br__history__mobile {
  display: none;
}


.company-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 15vw;
  max-width: 72.91vw;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.sns{
  min-width: 300px;
  /*position: relative;
  left: -190px;*/
}

.sns .headword {
  font-size: 2vw;
}

.sns .description{
  font-size: 1.04vw;
  padding-top: 2em;
}

.staff-photo_pc {
  max-width: 50vw;
  padding-left: 1.04vw;
  display: block !important;
}

.staff-photo_pc img {
  border-radius: 8px;
  width: 50vw;
}

.staff-photo_mobile {
  display: none !important;
}

.icons {
  display: flex;
  flex-direction: row;
  gap:0.83vw;
  margin-top: 1em;
  list-style:none
}

.icons img {
  width: 1.77vw;
  /*margin-top: 1em;*/
  /*margin-right: 8px;*/
}

.icons img:hover {
  /*background-color: #f8c7c1;*/
  filter:drop-shadow( 0 4px 5px rgba(0, 0, 0, 0.2));
  transform: translateY(-2px);
  transform: scale(105%);
  cursor: pointer;
}

.icons img:active {
  filter:drop-shadow( none);
  transform: translateY(2px);
  transform: scale(95%);
  /*background-color: #d6a39c;*/
  /*background-color: #e8afa7;*/
}

.wave-company {
  position: absolute;
  display: block;
  width: 100%;
  height: 15.625vw;
  z-index: 5;
  top: -10%;
  left: 0;
  /*margin-top: calc(-75px + -5vw);*/
  margin-bottom: 0;
  transform: scale(-1,1);
  pointer-events: none;
}

.line_mobile {
  display: none;
}

/* === footer === */
.footer {
  background-color: #fac0c6;
  padding: 60px 40px 5px 40px;
  font-family: "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  color: #7D695F;
  font-weight: 300;
  width: 100%;
  position: relative;
}

.footer-inner_pc {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 72vw;
  margin: 50px  auto 7.81vw auto;
}

.footer-left {
  flex: 1;
  min-width: 300px;
}

.footer-logo {
  font-size: 1.75vw;
  letter-spacing: 0.15em;
  margin-bottom: 3vw;
}

.footer-company {
  margin-bottom: 2.38vw;
  font-family: "Hiragino Mincho ProN","Noto Serif JP" ,sans-serif;
  font-size: 1.25vw;
}

.footer-info {
  font-size: 1.04vw;
  line-height: 2;
}

.footer-info .indent{
  display: inline-block;
  text-indent: 1em;
}

.footer-info a {
  color: #7D695F;
  font-size: 1.04vw;
}

.footer-right {
  min-width: 200px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.footer-contact {
  display: inline-block;
  background: #fff;
  padding: 1.5vw 2.5vw;
  text-decoration: none;
  border-radius: 1vw;
  cursor: pointer;
  transition:  all 0.3s ease;
  gap: 1.5vw;
  align-items: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  /*background-clip: text;*/
}


.footer-contact:hover {
  /*background-color: #e7e4e4;*/
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  transform: translateY(-2px);
  transform: scale(105%);
}

.footer-contact:active {
  box-shadow: none;
  transform: translateY(2px);
  transform: scale(95%);
  background-color: #e7e4e4;
}

.contact-inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.5vw;
  text-decoration: none;
}

.contact-mail {
  /*filter: brightness(0) saturate(100%) invert(73%) sepia(93%) saturate(164%) hue-rotate(293deg) brightness(96%) contrast(105%);*/
  width: 1.4vw;
  filter: invert(43%) sepia(6%) saturate(1182%) hue-rotate(335deg) brightness(96%) contrast(92%);
}


.contact-text {
  font-family: "Hiragino Kaku Gothic ProN",'Noto Sans JP' ,sans-serif;
  font-size: 1.04vw;
  line-height: 1;
  color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #7d695fde;
}

.contact-arrow {
  width: 0.6vw;
  height: auto;
  display: inline-block;
  /*filter: brightness(0) saturate(100%) invert(73%) sepia(93%) saturate(164%) hue-rotate(293deg) brightness(96%) contrast(105%);*/
  filter: invert(43%) sepia(6%) saturate(1182%) hue-rotate(335deg) brightness(96%) contrast(92%);
}

.footer-inner_mobile {
 display: none;
}

.copyright {
  font-family: "Noto Serif JP" ,sans-serif;
  font-weight: 500;
  font-size: 1.04vw;
  color: #7D695F;
  text-align: center;
  margin-bottom: 2vw;
}


/* ---- アニメーション ----　*/

.fade-in {
  opacity: 0;
  transform: translateY(10vw);
  transform: scale(110%);
  transition: opacity 1.5s ease, transform 1.5s ease;
  visibility: hidden;
  display: block;
}

.fade-in.active {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  transform: scale(100%);
}

.fade-in_pc {
  opacity: 0;
  transform: translateY(10vw);
  transition: opacity 1.5s ease, transform 1.5s ease;
  visibility: hidden;
  display: block;
}

.fade-in_pc.active {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
}

.fade-in_mobile {
  display: none;
}


/* 左へ移動 */
.move_toLeft {
  opacity: 0;
}

.move_toLeft.active {
  animation: move_toLeft 1.5s ease-out both;
}

@keyframes  move_toLeft {
  from {
    transform:translatex(10vw);
    opacity: 0;
  }

  to {
    transform:translatex(0);
    opacity: 1;
  }
}

/* 左へ移動 */
.move_toLeft2 {
  opacity: 0;
}

.move_toLeft2.active {
  animation: move_toLeft 3s ease-out both;
}

@keyframes  move_toLeft2 {
  from {
    transform:translatex(2vw);
    opacity: 0;
  }

  to {
    transform:translatex(0);
    opacity: 1;
  }
}

/* 右へ移動 */

.move_toRight {
 opacity: 0;
}

.move_toRight.active {
  animation: move_toRight 1.5s ease-out both;
}

@keyframes  move_toRight {
  from {
    transform:translatex(-15vw);
    opacity: 0;
  }

  to {
    transform:translatex(0);
    opacity: 1;
  }
}

/* 右へ移動 */
.move_toUp {
  opacity: 0;
 }
 
 .move_toUp.active {
   animation: move_toUp 1.5s ease-out both;
 }
 
 @keyframes  move_toUp {
   from {
     transform:translateY(3vw);
     opacity: 0;
   }
 
   to {
     transform:translateY(0);
     opacity: 1;
   }
 }


/* 時間差 */
.delay_0 { transition-delay: 0s; }
.delay_1 { transition-delay: 0.2s; }
.delay_2 { transition-delay: 0.4s; }
.delay_3 { transition-delay: 0.6s; }

/* イントロダクション画像*/
/* 初期位置：非表示でオフスクリーンに配置 */
.img-in-from-left,
.img-in-from-right,
.img-in-from-top,
.img-in-from-bottom {
  opacity: 0;
  transform: translateX(0) translateY(0);
  transition: transform 1s ease, opacity 1s ease;
}

.img-in-from-left { transform: translateX(-100px); }
.img-in-from-right { transform: translateX(100px); }
.img-in-from-top { transform: translateY(-100px); }
.img-in-from-bottom { transform: translateY(100px); }

/* 表示時 */
.img-in-from-left.active,
.img-in-from-right.active,
.img-in-from-top.active,
.img-in-from-bottom.active {
  opacity: 1;
  transform: translateX(0) translateY(0);
}