@charset "UTF-8";
/* CSS Document */

html   { 
                font-size: 62.5%; 
        }

body {
	font-family: "Shippori Mincho";
  font-optical-sizing: auto;
  font-size: 1.8rem;
  line-height: 1.65;
  color: #5F5F5F;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  word-break: break-all;
}
img{
	width: 100%;
}

@media screen and (min-width: 500px) {
	body{
		background-image: url("../img/BG.jpg");
		background-repeat: no-repeat;
		background-attachment: fixed;
    background-size: cover;
background-position: center;
	}
	}
@media screen and (max-width: 500px) {
  body {
    font-size: 1.6rem;
    line-height: 1.4;
  }
}
#wrapper500{
  margin: 0 auto;
    background-color: #FFFFFF;
}
@media screen and (min-width: 500px) {
	#wrapper500{
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
    background-color:#FFFFFF;
    box-shadow: 0px 10px 15px 10px rgba(92, 92, 92, 0.45);
	}}

  .margin-2{
    margin: 2rem auto;
  }
  .margin-1{
    margin: 1rem auto;
  }

/*テキスト*/




/*wrapper*/
.wrapper90{
width: 90%;
margin: 0 auto;
}

/*sc1*/


/*-------追従CTA------*/
.float-cta{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: min(100%, 500px);
  padding: 18px 16px 16px;
  z-index: 9999;

  background: linear-gradient(
    to top,
    rgba(255,255,255,0.95) 0%,
    rgba(255,255,255,0.85) 50%,
    rgba(255,255,255,0.0) 100%
  );
  pointer-events: none;
}

.float-cta__btn{
  display: block;
  pointer-events: auto;
}

.float-cta__btn img{
  display: block;
  width: 100%;
  height: auto;
}
/*-------CTA------*/
.cv_btn {
	margin: 4rem auto 4rem auto;
	width: 87%;
  }
  .cv_btn img {
	animation: anime1 0.6s ease 0s infinite alternate;
	transform-origin: center;
  }
  @keyframes anime1 {
	from {
	  transform: scale(0.9,0.9);
	}
	to {
	  transform: scale(1,1);
	}
  }



.detail-accordion{
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
}
/*アコーディオン*/
.detail-accordion__btn{
  appearance: none;
  border: none;
  cursor: pointer;

  padding: 10px 40px;
  border-radius: 999px;

  background: linear-gradient(
    90deg,
    #B69357 0%,
    #B8955A 7%,
    #C2A66C 31%,
    #D1BB85 49%,
    #C4A86F 70%,
    #B9975C 100%
  );

  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.08em;

  box-shadow: 0 6px 14px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .2s ease;
}
.detail-accordion__panel{
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height .35s ease, opacity .25s ease;
  margin-top: 16px;
}

.detail-accordion__panel.is-open{
  max-height: 2000px;
  opacity: 1;
}

.detail-accordion__img{
  width: 100%;
  display: block;
}

/*アコーディオン*/
.accordion-area{
    list-style: none;
    width: 90%;
    max-width: 450px;
    margin:0 auto;
    background-color: #FFF;
      border-radius:1rem;
}

.img-slider{
  max-width: 560px;
  margin: 0 auto;
}

.img-slider__viewport{
  overflow: hidden;
  border-radius: 12px;
}
/*カルーセル*/
.img-slider__track{
  display: flex;
  transition: transform .35s ease;
  will-change: transform;
  touch-action: pan-y;
}

.img-slider__slide{
  flex: 0 0 100%;
}

.img-slider__slide img{
  width: 100%;
  display: block;
}

.img-slider__dots{
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
}

.img-slider__dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: none;
  background: #cbbfa4;
}

.img-slider__dot.is-active{
  background: #7a5a2b;
}

/*Anker*/
.Anker{
  width: 80%;
  margin: 0 auto;
}
/* ===== 共通レイアウト ===== */
.nav-buttons{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  max-width: 680px;
  margin: 40px auto;
}

/* ===== ボタン共通 ===== */
.nav-btn{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  min-height: 64px;          /* 縦を詰める */
  padding: 10px 12px;

  font-family: "Shippori Mincho", serif;
  font-size: 15px;
   font-weight: 500;   
  line-height: 1.3;
  letter-spacing: 0.02em;    /* カーニング詰め */

  text-align: center;
  text-decoration: none;

  border-radius: 0;          /* 角丸なし */
  border: 1px solid #C9A45A;

  color: #A28E5B;            /* 指定フォントカラー */
  background: none;

  transition: transform .15s ease, box-shadow .2s ease;
}

.nav-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}

.nav-btn:active{
  transform: scale(.97);
}


/* =====白グラデ ===== */
.nav-btn--white{
  background: linear-gradient(
    135deg,
    #F0F2F3 0%,
    #FFFFFF 50%,
    #F1F3F4 100%
  );
}
/* ===== 矢印===== */
.nav-btn__arrow{
  margin-top: 6px;
  width: 10px;
  height: 10px;
  position: relative;
}

.nav-btn__arrow::before,
.nav-btn__arrow::after{
  content:"";
  position: absolute;
  top: 3px;
  width: 7px;
  height: 1px;
  background: #A28E5B;
  opacity: .95;
}

.nav-btn__arrow::before{
  left: 0;
  transform: rotate(45deg);
  transform-origin: left center;
}

.nav-btn__arrow::after{
  right: 0;
  transform: rotate(-45deg);
  transform-origin: right center;
}

/* ===== SP===== */
@media (max-width: 480px){
  .nav-btn{
    font-size: 14px;
    min-height: 60px;
  }
}
/*sc-7*/
.sc7{
  background-image: url("../img/sc7-bg.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom; 
}

.t-box{
  background-color: #FFFFFF;
}

/*sc-13*/
.sc13{
background-color: #F7F7F7;
}
.sec35 {
  padding-bottom: 5rem;}

.title {
  margin-bottom: 2rem;
}

.maps {
  padding: 0 4rem;
}

/* ===== クリニック ===== */

/* 親で切らない + 枠 */
.maps .accordion .at-item{
  border: 0.2rem solid #A28E5B;
  overflow: visible;              /* hidden禁止 */
}

.maps .accordion .at-item + .at-item{
  margin-top: 3rem;
}

/* タイトル */
.maps .accordion .at-title{
  background-color: #A28E5B;
  display: flex;
  justify-content: center;
  align-items: center;

  position: relative;
  cursor: pointer;

  padding: 2.2rem 0;              /* min-height:5% はやめる */
}

.maps .accordion .at-title > h2{
  font-size: 2rem;
  color: #fff;
  line-height: 1.2;
  margin: 0;
}

/* 矢印 */
.maps .accordion .at-title::before{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  top: 50%;
  right: 3rem;
  transform: translateY(-50%);
  border-left: 1rem solid transparent;
  border-right: 1rem solid transparent;
  border-top: 1rem solid #fff;
  z-index: 1;
  transition: transform 0.3s ease;
}

.maps .accordion .at-title.active::before{
  transform: translateY(-50%) rotate(180deg);
}

/* ▼ パネル（max-height方式：安定版） */
.maps .accordion .at-tab{
  overflow: hidden;
  max-height: 0;                  /* 閉 */
  opacity: 0;
  padding: 0;
  background: transparent;

  transition:
    max-height .5s ease,
    opacity .25s ease,
    padding .25s ease,
    background-color .25s ease;
}

/* 開いた時だけ白背景＆余白 */
.maps .accordion .at-tab.is-open{
  background-color: #fff;
  padding: 3rem;
  opacity: 1;
}

/* 中身 */
.maps .accordion .at-tab__inner{
  padding-bottom: 2rem;
}

.maps .accordion .at-tab__inner > h3{
  font-size: 1.8rem;
  text-align: center;
  line-height: calc(60 / 32);
  font-weight: bold;
  margin: 7rem 0 1rem;
}

.maps .accordion .at-tab__inner > h3:nth-child(1){
  margin: 2rem 0 1rem;
}

.maps .accordion .at-tab__inner table th,
.maps .accordion .at-tab__inner table td{
  font-size: 1.6rem;
  line-height: calc(40 / 26);
  display: block;
  text-align: left;
  font-weight: 500;
}

.maps .accordion .at-tab__inner table th{
  color: #A28E5B;
  padding: 2rem 0 0;
}

.maps .accordion .at-tab__inner table td{
  padding: 0 0 2rem;
  border-bottom: 1px solid #A28E5B;
}

.maps .accordion .at-tab__inner table tr:last-child td{
  border-bottom: none;
}

.maps .accordion .at-tab__inner table tr:last-child td > a{
  color: #333;
}

.maps .accordion .at-tab__inner .map_frame{
  height: 34.5rem;
}

.maps .accordion .at-tab__inner .map_frame iframe{
  width: 100%;
  height: 100%;
  border: 0;
}

.maps .accordion .at-tab__inner .mapLink{
  margin-top: 4rem;
  padding: 0 1rem;
}

.maps .accordion .at-tab__inner .mapLink > a:hover{
  opacity: 0.8;
}
/*sc-14*/
.sc14{
  background-color:#F7F7F7;
}
/* ===== FAQ===== */

.faq-wrap{
  width: 90%;
  max-width: 480px;
  margin: 0 auto;
}

.faq-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.faq-item{
  background: #fff;
  border-radius: 16px;
  margin: 14px 0;
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
  overflow: hidden;
}

/* 質問ボタン */
.faq-q{
  width: 100%;
  display: grid;
  grid-template-columns: 24px 1fr 20px;
  align-items: center;
  gap: 12px;

  padding: 18px 18px;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.faq-q__mark{
  color: #A28E5B;
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1;
}

.faq-q__text{
  color: #A28E5B;
  font-weight: 600;
  font-size: 1.6rem;
  line-height: 1.5;
}

/* 右の∨ */
.faq-q__chev{
  width: 10px;
  height: 10px;
  border-right: 2px solid #A28E5B;
  border-bottom: 2px solid #A28E5B;
  transform: rotate(45deg);
  transition: transform .2s ease;
  justify-self: end;
}

/* 開いたら∧ */
.faq-q[aria-expanded="true"] .faq-q__chev{
  transform: rotate(-135deg);
}

/* 回答 */
.faq-a{
  padding: 0 18px 18px 54px; /* Q文字と揃える */
  color: #595959;
  font-size: 1.5rem;
  line-height: 1.75;
}

.faq-a p{ margin: 0; }

/* sc14の上下の謎余白を強制的に消す */
.sc14{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  display: flow-root; /* margin相殺も止める */
}

/* sc14の最後の要素が持つ余白を潰す（ul/li/pなど） */
.sc14 > *:last-child{
  margin-bottom: 0 !important;
}
.sc14 .accordion-area{
  margin-bottom: 0 !important;
}
.sc14 .accordion-area li:last-child{
  margin-bottom: 0 !important;  /* liのmarginが原因の場合 */
}
.sc14 .box p:last-child{
  margin-bottom: 0 !important;  /* pのmarginが原因の場合 */
}
/*footer*/

footer{
	background-color:#B59D5F;
	padding: 5rem 0 10rem 0;
	margin: 0 auto;
  color: #ffff;
  font-size: 9px;
}
footer p{
	text-align: center;
}

.footer-link {
    display: flex;
    width: 50%;
    justify-content: space-between;
    margin: 0 auto;
    padding-top: 2rem;
	color: #fff;
	font-size: 9px;
}

/* スライドイン左から */

/* 左からふわっとJQ */
.fadeInLeft {
  -webkit-animation-name: fadeInLeftAnime;
          animation-name: fadeInLeftAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeInLeftAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes fadeInLeftAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
.fadeInLeftTrigger {
  opacity: 0;
}

/* 右からふわっとJQ */
.fadeInRight {
  -webkit-animation-name: fadeInRightAnime;
          animation-name: fadeInRightAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeInRightAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
            transform: translateX(0); 
  }
}
@keyframes fadeInRightAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100px);
            transform: translateX(100px); 
  }
  100% {
    opacity: 1; 
    -webkit-transform: translateX(0);
            transform: translateX(0); 
  }
}
.fadeInRightTrigger {
  opacity: 0; 
}

/* 下からふわっとJQ */

.fadeUp {
  -webkit-animation-name: fadeUpAnime;
          animation-name: fadeUpAnime;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
@-webkit-keyframes fadeUpAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
}}
@keyframes fadeUpAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
            transform: translateY(100px); 
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0); 
  }
}
.fadeUpTrigger {
  opacity: 0; 
}
/* テキストアニメーション*/
.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span{ animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
  0% {opacity:0;}
  100% {opacity:1;}
}