
/* =========================
therapist list タブ
========================= */
.therapist_list_sec{
padding:1.7rem 0 3rem;
}
/* =========================
 therapist tab
========================= */

.therapist_tab{
display:flex;
justify-content:center;
align-items:center;
gap:1rem;

margin:1.7rem auto 2rem;
padding:0;

list-style:none;
}

.therapist_tab li{
position:relative;
width:32.3%;
}

.therapist_tab a{
position:relative;
display:block;
padding:0.9rem 1.5rem 0.8rem;
background:white;
backdrop-filter:blur(8px);
border:1px solid rgba(199,178,153,.25);
border-radius:1px;
font-size:0.95rem;
letter-spacing:.05em;
line-height:1.7;
text-align:center;
color:#594a3e;
transition:
transform .25s ease,
background .25s ease,
border-color .25s ease,
color .25s ease,
box-shadow .25s ease;
}


/* hover */
.therapist_tab a:hover{
transform:translateY(-2px);
background:rgba(255,255,255,.92);
border-color:rgba(199,178,153,.45);
box-shadow:
0 10px 30px rgba(0,0,0,.05);
color:#5f5146;
}
.therapist_tab a:hover::after{
width:65%;
}
/* active */
.therapist_tab li.on a{
background:
linear-gradient(
180deg,
rgba(214,196,172,.18),
rgba(255,255,255,.95)
);
border:1px solid #eae0d8;
background:#f4eee9;
box-shadow:
0 2px 6px rgba(0,0,0,0.04),
0 10px 20px rgba(0,0,0,0.06);
}
.therapist_tab li.on a::after{
width:70%;
}
.therapist_sub_come{
display:block;
text-align:center;
font-size: 1.1rem;
letter-spacing:.08em;
color:#828282;
line-height:1;
margin-bottom:2rem;
}



/* TOP 文字*/
.item_top{
width:100%;
height:260px;
overflow:hidden;
position:relative;
}
.item_top::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(
90deg,
rgba(0,0,0,.50) 0%,
rgba(0,0,0,.42) 20%,
rgba(0,0,0,.20) 45%,
rgba(0,0,0,0) 100%
),

linear-gradient(
180deg,
rgba(0,0,0,.20) 0%,
rgba(0,0,0,.30) 45%,
rgba(0,0,0,.5) 100%
);


z-index:1;
}
.item_top img{
width:100%;
height:130%;
object-fit:cover;
object-position:center top;
position:absolute;
left:0;
top:0;
animation:itemMove 6s linear forwards;
}
/* TOP画像下から上*/
@keyframes itemMove{
0%{
transform:translateY(0);
}
100%{
transform:translateY(-55px);
}
}

.item_width{
position:relative;
width:100%;
height:100%;
max-width:900px;
margin:0rem auto 0rem;
}
.item_absolute{
position:absolute;
max-width:900px;
margin:auto;
top:43%;
left:9%;
transform:translateY(-50%);
z-index:2;
}


/*  文字アニメーション*/
.item_absolute h1 span,
.item_absolute p span{
  display: inline-block;
  vertical-align: top;
  opacity: 0;
  animation-duration: 0.7s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
}

.item_absolute h1,
.item_absolute h1 span {
font-size: 2.2rem;
letter-spacing:.08em;
text-align:left;
color:white;
line-height:1.5;
}

.item_absolute .english,
.item_absolute p span {
font-size: 0.95rem;
letter-spacing:.12em;
text-align:left;
color:white;
line-height:1.6;
}

.fade .gold_line{
width:180px;
height:1px;
margin:0.6rem 0 0.3rem 0;
}

.item_absolute em{
font-size: 0.9rem;
letter-spacing:.08em;
text-align:left;
color:white;
display:block;
margin-top:0.7rem;
}
.item_absolute em span{
letter-spacing:.12em;
}


.item_absolute_right{
position:absolute;
bottom:6%;
right:6%;
z-index:2;
}
.item_box{
display:inline-block;
}
.item_absolute_right em{
font-size: 0.8rem;
letter-spacing:0.2em;
text-align:center;
color:white;
display:block;
line-height:1.4;
margin-bottom:0.4rem;
}
.item_absolute_right h2 {
font-size: 1.2rem;
letter-spacing:.13em;
text-align:center;
color:white;
line-height:1.4;
display:block;
margin-bottom:0.1rem;
}
.item_absolute_right p {
font-size: 1.5rem;
letter-spacing:.05em;
text-align:center;
color:white;
line-height:1.4;
display:block;
}




/* =========================
profile
========================= */
.profile{
margin-top:0rem;
}
.therapist_back{
display:grid;
grid-template-columns:repeat(4,1fr);
margin:auto;
width:99%;
max-width:900px;
text-align:center;
}
.therapist_back li{
position:relative;
text-align:center;
padding:1.4rem 0.5rem 1rem 0.5rem;
}

.therapist_back li::after{
content:"";
position:absolute;
top:50%;
right:0;
transform:translateY(-50%);
width:1px;
height:50%;
background:#7f6f5d;
}
.therapist_back li:last-child::after{
display:none;
}
.therapist_back h3{
width:100%;
display:block;
font-size:0.9rem;
letter-spacing:.06em;
line-height:1;
margin:0rem 0 0rem;
color:#f2f2f2;
}
.therapist_back p{
display:inline-block;
font-size:1.4rem;
letter-spacing:.06em;
line-height:1.3;
margin:0rem 0.2rem 0 0;
color:#e0e0e0;
}
.therapist_back span{
display:inline-block;
font-size:0.9rem;
letter-spacing:.06em;
line-height:1.3;
color:#e0e0e0;
text-align:left;
}
.therapist_back em{
display:inline-block;
font-size:1.1rem;
letter-spacing:.01em;
line-height:1.3;
color:#e0e0e0;
text-align:left;
}





/* =========================
MESSAGE
========================= */
.message{
margin:1.9rem auto;
position:relative;
width:100%;
max-width:900px;
background: linear-gradient(
90deg,
rgba(247,244,240,.88) 0%,
rgba(247,244,240,.82) 50%,
rgba(247,244,240,.80) 70%,
rgba(247,244,240,.75) 80%,
rgba(247,244,240,.25) 95%,
rgba(247,244,240,0) 100%

),
url("../img/therapist/message_back.webp");


background-repeat:no-repeat;
background-position:right center;
background-size:cover;
overflow-y:scroll;
padding:1rem 1rem;
}

.message_inner{
position:relative;
z-index:2;
width:94%;
max-width:900px;
margin:0 auto;
padding:0 0 0 0;
display:flex;
align-items:flex-start;
min-height:110px;
}
.message_text{
max-height:170px;
width:80%;
max-width:100%;
overflow-y:auto;
margin-top:auto;
margin-bottom:auto;
padding:0.6rem 0 0.5rem 0;
scrollbar-width:thin;
scrollbar-color:rgba(199,178,153,.75) rgba(255,255,255,.15);
}
/* scroll bar */
.message_text::-webkit-scrollbar{
width:1px;
}

.message_text::-webkit-scrollbar-track{
background:rgba(255,255,255,.12);
border-radius:10px;
}

.message_text::-webkit-scrollbar-thumb{
background:linear-gradient(
180deg,
rgba(214,196,172,.95),
rgba(199,178,153,.7)
);
border-radius:10px;
}

.message_text::-webkit-scrollbar-thumb:hover{
background:rgba(199,178,153,.95);
}

.message_text p{
font-size:1.2rem;
line-height:1.6;
letter-spacing:.05em;
margin:0;
color:#474747;
}
.message_text h2,
.message_text p{
word-break:break-word;
}
.message_flex img{
width:13px;
margin:0rem 0.5rem 0.3rem 0;
opacity:0.7;
}

.message_flex{
display:flex;
justify-content:flex-start;
align-items:center;
gap:0px;
margin-bottom:0.5rem;
}

.message_flex h2{
font-size:1.2rem;
font-weight:500;
letter-spacing:.03em;
color:#8c6239;
white-space:nowrap;
}




/* =========================
GALLERY
========================= */
.staff_padding{
padding:0rem 0 0rem 0;
}
.staff_photo{
margin:0rem 0 0rem 0;
width:92%;
max-width:900px;
padding:1.9rem 1.2rem 2.8rem 1.5rem;
margin:auto;
background-image:url("../img/common/mortar_bg.webp");
background-repeat:repeat;
background-size:28rem auto;
background-position:center top;
border:1px solid #f2ece7;
}
.staff_photo h2{
display:block;
font-size:1.2rem;
letter-spacing:0.23em;
text-align:center;
margin-bottom:1.6rem;
color:#998675;
}
.gallery{
display:flex;
gap:2px;
width:100%;
margin:0 auto;
align-items:stretch;
}
.gallery_main{
flex:1;
min-width:0;
}

.gallerySwiper{
width:100%;
height:100%;
overflow:hidden;
}

.gallerySwiper .swiper-wrapper{
height:100%;
}

.gallerySwiper .swiper-slide{
height:100%;
}

.gallerySwiper img{
width:100%;
height:100%;
display:block;
object-fit:cover;
touch-action:pan-y;
}

.gallery_thumbs{
display:flex;
flex-direction:column;
gap:2px;
width:72px;
flex-shrink:0;
}
.gallery_thumbs li{
cursor:pointer;
opacity:.5;
flex:1;
min-height:0;
}
.gallery_thumbs li.active,
.gallery_thumbs li:hover{
opacity:1;
}
.gallery_thumbs li img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
/* =========================
shop_comment
========================= */
.profile_div{
width:100%;
margin:auto;
text-align:center;
position:relative;
overflow:hidden;
}
.profile_div h2{
display:block;
font-size:1.6rem;
letter-spacing:0.06em;
color:#896f58;
margin-top:1.8rem;
line-height:1.1;
padding:0;
margin:1.8rem 0 0.3rem 0;
position:relative;
z-index:2;
}
.profile_div_span{
font-size:1.2rem;
letter-spacing:0.1em;
line-height:1.6;
text-align:center;
padding:0 0.2rem;
position:relative;
z-index:2;
}
.profile_grid{
width:100%;
display:flex;
align-items:flex-start;
justify-content:center;
gap:0.3rem;
margin-top:0.4rem;
padding:0 1.2rem;
position:relative;
z-index:2;
}
.profile_grid h3{
flex-shrink:0;
font-weight:bold;
color:#666666;
font-size:1.2rem;
line-height:1.7;
letter-spacing:.08em;
}
.profile_grid span{
font-size:1.2rem;
line-height:1.7;
letter-spacing:.05em;
text-align:left;
position:relative;
z-index:2;
}
.height_line{
width:1px;
height:25px;
background:#d1c0b4;
display:block;
margin:1.7rem auto 1.3rem;
position:relative;
z-index:2;
}
.profile_div p{
padding:0 1.2rem;
display:block;
font-size:1.25rem;
line-height:1.85;
letter-spacing:.08em;
margin-top:0.7rem;
text-align:left;
position:relative;
z-index:2;
}




/* =========================
sch
========================= */

.therapist_sch{
width:100%;
margin:1.6rem 0rem 1.5rem;
padding:0.3rem 0rem;
}
.therapist_div{
width:92%;
max-width:900px;
margin:1.5rem auto 2.7rem auto;
position:relative;

border-radius:6px;
}

/* スケジュールリスト */
.detail_ul{
width:100%;
display:grid;
grid-template-columns:25% 10% 37% 28%;
align-items:stretch;
justify-content:center;
border:1px solid #eae4df;
border-bottom:0;
background:white;
overflow:hidden;
margin-top:1rem;

}

.detail_ul li:nth-child(-n+4){
border:0px;
text-align:center;
position:relative;
background:#f9f6f4;
border-left:1px solid #eadcd6;
display:flex;
align-items:center;
justify-content:center;
}
.detail_ul :nth-child(n+1):nth-child(-n+3){
border:0px;
}
.detail_ul li:nth-child(2)::before{
content:"";
position:absolute;
top:0;
bottom:0;
left:50%;
width:1px;
background:#eadcd6;
transform:translateX(-50%);
}
.detail_ul h3{
text-align:center;
display:block;
font-size:1.25rem;
letter-spacing:0.08em;
color:#443a34;
line-height:1.8;
padding:1rem 0 0.9rem 0;
}
.detail_ul li:first-child h3{
padding:0rem 0 0rem 1.8rem;
}
.detail_ul li:nth-child(3) h3{
padding:0rem 1.3rem 0rem 0.5rem;
}


.detail_li1, .detail_li3, .detail_li4{
border-bottom:1px solid #eae4df;
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
}
.detail_li1, .detail_li3{
  padding:1.3rem 0 1.1rem 0;
}
.detail_li1{
padding-left:1.3rem;
}
.detail_li2{
position:relative;
border-bottom:1px solid #eae4df;
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
}
.detail_ul li em{
width:100%;
display:block;
font-size:1.25rem;
letter-spacing:0.05em;
text-align:center;
color:#6b5744;
}

.detail_ul li p{
display:block;
width:100%;
font-size:1.35rem;
letter-spacing:0.05em;
text-align:center;

}
.detail_innter{
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
padding-top:0.4rem;
}
.detail_li4 {
border-left:1px solid #eae4df;
}
.detail_li4 a{
display:block;
width:100%;
height:100%;
}
.detail_li4 img{
display:block;
width: 22px;
margin:0 0.2rem 0.2rem 0;
}
.detail_li4 span{
display:block;
font-size:1.1rem;
letter-spacing:0em;
text-align:center;
line-height:1;
color:#6b5744;
}
.detail_ended{
font-size:1.1rem;
color:#aaaaaa;
text-align:center;
padding:0.4rem 0;
}


/* 縦ライン */
.detail_li2::before{
content:"";
position:absolute;
top:0;
bottom:0;
left:50%;
width:1px;
background:rgba(199,178,153,.35);
transform:translateX(-50%);
}

/* 丸 */
.sch_mark{
position:relative;
z-index:1;
width:18px;
height:18px;
border-radius:50%;
border:1px solid #c7b299;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 0 0 4px rgba(199,178,153,.12);
}

/* 受付中 */
.sch_mark.is_on{
position:relative;
background:#fff;
overflow:visible;
}

.sch_mark.is_on::before{
content:"";
width:8px;
height:8px;
border-radius:50%;
background:#c7b299;
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
z-index:2;
}

/* 外側発光 */
.sch_mark.is_on::after{
content:"";
position:absolute;
left:50%;
top:50%;
width:8px;
height:8px;
border-radius:50%;
background:rgba(199,178,153,.45);
transform:translate(-50%,-50%);
animation:schPulse 2s ease-out infinite;
}

@keyframes schPulse{
0%{
opacity:.9;
transform:translate(-50%,-50%) scale(1);
}

70%{
opacity:0;
transform:translate(-50%,-50%) scale(3.2);
}

100%{
opacity:0;
transform:translate(-50%,-50%) scale(3.2);
}
}

/* 休み・不可 */
.sch_mark.is_off{
background:#fff;
color:#7a6853;
font-size:1.1rem;
line-height:1;
padding-bottom:0.1rem;
}

/* ゴールド会員限定ラベル */
.sch_lock_msg{
display:flex;
align-items:center;
justify-content:flex-start;
gap:0.1rem;
padding-left:0.5rem;
margin:0.6rem auto 0 auto;
}
.sch_lock_msg p{
font-size:1rem;
letter-spacing:0.03em;
display:block;
margin:0.2rem 0 0rem;
color:#5b5b5b;
}
.sch_lock_icon{
font-size:0.9rem;
}

/* 非会員向けブラー */
.sch_blur_div span{
filter:blur(5px);
user-select:none;
pointer-events:none;
margin-top:0.3rem;
font-size:1rem;
color:#8c7154;
}


/* 最短案内ラベル wrapper */
.annnai_wrap{
display:flex;
justify-content:center;
margin-top:0.3rem;
align-items:center;
}
.annnai_wrap span{
font-size:1.3rem;
color:#8c7154;
letter-spacing:0.06em;
}







/* =========================
blog
========================= */


.therapist_blog{
width:100%;
margin:0rem auto 2rem auto;
padding:0rem 0 2.5rem 0;
overflow:hidden;
}
.therapist_innar{
width:94%;
margin:auto;
max-width:900px;
}


/* =========================
sns
========================= */
.therapist_sns{
margin:0rem auto 6rem auto;
}
.sns_ul{
display:flex;
justify-content:center;
align-items:center;
gap:13px;
padding:0;
margin:1.5rem auto 0rem auto;
list-style:none;
}

.sns_ul li img{
display:block;
width:40px;
}









/* =========================
ranking ribon
========================= */
.ranking_ribon{
position:absolute;
top:0;
right:0.8rem;
z-index:30;
width:5.2rem;
height:6.2rem;
/* 透明感あるシャンパンゴールド */
background:linear-gradient(
180deg,
rgba(228,214,188,.83) 0%,
rgba(190,164,118,.77) 45%,
rgba(140,106,67,.71) 100%
);

backdrop-filter:blur(2px);
-webkit-backdrop-filter:blur(2px);

clip-path:polygon(
0 0,
100% 0,
100% 100%,
50% 78%,
0 100%
);

display:flex;
justify-content:center;
align-items:flex-start;
padding-top:0.9rem;

box-shadow:
0 10px 24px rgba(0,0,0,.24),
0 1px 0 rgba(255,255,255,.18) inset;

/* ガラス感 */
border-left:1px solid rgba(255,255,255,.18);
border-right:1px solid rgba(0,0,0,.12);
overflow:hidden;
}

/* 上にうっすら光 */
.ranking_ribon::after{
content:'';
position:absolute;
top:0;
left:0;
width:100%;
height:42%;

background:linear-gradient(
180deg,
rgba(255,255,255,.20) 0%,
rgba(255,255,255,0) 100%
);

pointer-events:none;
}

.ranking_ribon p{
position:relative;
text-align:center;
z-index:2;
color:rgba(255,248,238,.96);
font-size:0.9rem;
line-height:1.3;
letter-spacing:.01em;

text-shadow:
0 1px 3px rgba(0,0,0,.38);
}

.ranking_ribon span{
font-size:1.9rem;
line-height:1.2;
display:block;
}





































/* ipad */
@media (min-width:768px){


.message_text p{
font-size:1.1rem;
line-height:1.9;
letter-spacing:.09em;
margin:0;
}
.gallery_thumbs{
width:90px;
}

.staff_padding{
display:flex;
align-items:start;
justify-content:center;
max-width:900px;
width:96%;
margin:auto;
flex-wrap:wrap;
}
.staff_padding_left{
width:45%;
}
.staff_padding_right{
width:55%;
padding:2% 0% 2% 2%;
}
.profile_grid{
padding:0 0rem 0 2rem;
}
.profile_div p{
padding:0 0rem 0 2rem;
}
.detail_li1, .detail_li3{
  padding:1.3rem 0 1.1rem 0;
}



}
/* ipad pc */


@media (min-width:1025px){

}









