
/* =========================
therapist list（一覧ページ）
カードの見た目は TOP・schedule と共用なので common.css の .therapist_ul
========================= */
.therapist_list_sec{
padding:2.6rem 0 3rem;
}
/* 見出しの下の「在籍 ○ 名」 */
.therapist_sub_come{
display:block;
text-align:center;
font-size:1.3rem;
letter-spacing:.08em;
color:#26332f;
line-height:1;
margin:1.6rem 0 1.6rem;
}
.therapist_sub_come .int{
font-size:2rem;
color:#1d8a72;
margin:0 0.1rem;
}








/* =========================
detail プロフィール
========================= */
.detail_profile_sec{
padding:2.6rem 0 3rem;
}
.detail_profile{
max-width:900px;
margin:1.6rem auto 0;
}

/* 写真（3:4）
スマホは画面の端まで広げない（端から戻るスワイプが写真の切り替えに取られるため） */
.detail_gallery{
width:90%;
max-width:420px;
margin:0 auto;
}
.gallerySwiper{
width:100%;
aspect-ratio:3 / 4;
border-radius:14px;
overflow:hidden;
box-shadow:0 6px 20px rgba(18,51,44,.10);
}
.gallerySwiper .swiper-slide{
height:100%;
}
.gallerySwiper img{
width:100%;
height:100%;
display:block;
object-fit:cover;
touch-action:pan-y;
}
.gallery_thumbs{
display:grid;
grid-template-columns:repeat(6,1fr);
gap:6px;
margin-top:8px;
}
.gallery_thumbs li{
aspect-ratio:3 / 4;
border-radius:8px;
border:2px solid transparent;
overflow:hidden;
cursor:pointer;
opacity:.55;
transition:opacity .25s ease, border-color .25s ease;
}
.gallery_thumbs li.active{
opacity:1;
border-color:#1d8a72;
}
@media (hover:hover) and (pointer:fine){
.gallery_thumbs li:hover{
opacity:1;
}
}
.gallery_thumbs li img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* 名前・出勤・プロフィール */
.detail_info{
max-width:420px;
margin:2rem auto 0;
}
.detail_name{
text-align:center;
}
.detail_name p{
font-size:1.5rem;
letter-spacing:.06em;
line-height:1;
color:#03bc96;
}
.detail_name h2{
font-size:2.4rem;
letter-spacing:.14em;
line-height:1.3;
color:#26332f;
margin-top:0.5rem;
}

/* 本日のご案内／次回出勤 */
.detail_next{
margin:1.4rem auto 0;
padding:1rem 1rem 1.1rem;
background:#eef7f3;
border-radius:12px;
text-align:center;
}
.detail_next em{
display:block;
font-size:1.15rem;
letter-spacing:.08em;
line-height:1;
color:#1d8a72;
font-weight:bold;
}
.detail_next p{
font-size:1.9rem;
letter-spacing:.04em;
line-height:1;
color:#1d8a72;
margin-top:0.6rem;
}

/* プロフィール表（入っている項目だけ） */
.detail_spec{
margin-top:1.4rem;
background:#fff;
border:1px solid #d5e9e2;
border-radius:12px;
overflow:hidden;
}
.detail_spec li{
display:flex;
align-items:baseline;
padding:1rem 1.4rem;
border-top:1px solid #d5e9e2;
}
.detail_spec li:first-child{
border-top:0;
}
.detail_spec h3{
flex-shrink:0;
width:5.5em;
font-size:1.2rem;
letter-spacing:.08em;
line-height:1.6;
color:#6c7d78;
}
.detail_spec p{
font-size:1.3rem;
letter-spacing:.04em;
line-height:1.6;
color:#26332f;
word-break:break-word;
}

/* SNS */
.detail_sns{
display:flex;
justify-content:center;
gap:12px;
margin-top:1.4rem;
}
.detail_sns a{
display:flex;
justify-content:center;
align-items:center;
width:42px;
height:42px;
border:1px solid #1d8a72;
border-radius:50%;
background:#fff;
color:#1d8a72;
}
.detail_sns_icon{
display:block;
width:20px;
height:20px;
}
@media (hover:hover) and (pointer:fine){
.detail_sns a{
transition:background .25s ease, color .25s ease;
}
.detail_sns a:hover{
background:#1d8a72;
color:#fff;
}
}

/* 予約ボタン（common.css の .next_page） */
.detail_btn{
margin-top:1.6rem;
}








/* =========================
detail メッセージ
========================= */
.detail_message_sec{
padding:2.6rem 0 2.8rem;
}
.detail_message{
display:flex;
flex-direction:column;
gap:14px;
max-width:700px;
margin:1.6rem auto 0;
}
.detail_message_box{
background:#fff;
border:1px solid #d5e9e2;
border-radius:14px;
padding:1.5rem 1.6rem 1.6rem;
}
.detail_message_box h3{
font-size:1.35rem;
letter-spacing:.08em;
line-height:1.4;
color:#1d8a72;
padding-bottom:0.8rem;
margin-bottom:0.9rem;
border-bottom:1px dashed #d5e9e2;
}
.detail_message_box p{
font-size:1.25rem;
line-height:1.9;
letter-spacing:.05em;
color:#26332f;
word-break:break-word;
}








/* =========================
detail 出勤スケジュール（7日分）
========================= */
.detail_sch_sec{
padding:2.6rem 0 3rem;
}
.detail_sch{
max-width:700px;
margin:1.6rem auto 0;
background:#fff;
border:1px solid #d5e9e2;
border-radius:14px;
overflow:hidden;
}
.detail_sch li{
display:grid;
grid-template-columns:72px 1fr 88px;
align-items:center;
gap:0 0.6rem;
min-height:66px;
padding:0.8rem 1rem;
border-top:1px solid #d5e9e2;
}
.detail_sch li:first-child{
border-top:0;
}
.detail_sch li.is_off{
background:#fafcfb;
}

/* 日付 */
.detail_sch_day{
text-align:center;
line-height:1;
}
.detail_sch_day em{
display:block;
font-size:0.75rem;
letter-spacing:.01em;
color:#03bc96;
margin-bottom:0.3rem;
}
.detail_sch_day p{
display:inline;
font-size:1.5rem;
color:#26332f;
}
.detail_sch_day .sch_week{
font-size:1.05rem;
color:#6c7d78;
margin-left:0.1rem;
}
.detail_sch li.sch_w_sun .sch_week{ color:#c0524a; }
.detail_sch li.sch_w_sat .sch_week{ color:#4a6eb5; }

/* 時間・最短 */
.detail_sch_time{
text-align:center;
}
.detail_sch_time p{
font-size:1.5rem;
letter-spacing:.04em;
line-height:1.2;
color:#1d8a72;
}
.detail_sch_time span{
display:block;
font-size:1.1rem;
letter-spacing:.04em;
line-height:1;
color:#6c7d78;
margin-top:0.4rem;
}
/* エリア名（エリアが複数の店だけ） */
/* inline-block だと行の高さぶん下が空くので block で幅だけ文字に合わせる */
.detail_sch_time .detail_sch_place{
display:block;
width:fit-content;
max-width:100%;
box-sizing:border-box;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
margin:0 auto 0.4rem;
padding:0.3rem 0.7rem;
border:1px solid #1d8a72;
border-radius:20px;
background:#fff;
color:#1d8a72;
font-size:0.95rem;
letter-spacing:.04em;
line-height:1;
}
.detail_sch_time .detail_sch_off{
font-size:1.2rem;
letter-spacing:.08em;
color:#a3b0ac;
}

/* 予約 */
.detail_sch_btn{
text-align:center;
}
.detail_sch_btn a{
display:block;
height:34px;
line-height:34px;
border-radius:20px;
background:#1d8a72;
color:#fff;
font-size:1.15rem;
letter-spacing:.06em;
}
@media (hover:hover) and (pointer:fine){
.detail_sch_btn a{
transition:background .25s ease;
}
.detail_sch_btn a:hover{
background:#03bc96;
}
}
.detail_ended{
font-size:1.05rem;
letter-spacing:.04em;
color:#a3b0ac;
}








/* =========================
tablet〜pc
========================= */
@media (min-width:768px){

.therapist_sub_come{
font-size:1.45rem;
}
.therapist_sub_come .int{
font-size:2.3rem;
}

/* 写真は左・プロフィールは右 */
.detail_profile{
display:flex;
align-items:flex-start;
gap:3rem;
}
.detail_gallery{
width:340px;
max-width:none;
margin:0;
flex-shrink:0;
}
.detail_info{
flex:1;
max-width:none;
margin:0;
padding-top:0.6rem;
}
.detail_name h2{
font-size:2.7rem;
}

.detail_message_box{
padding:1.8rem 2.2rem 2rem;
}

.detail_sch li{
grid-template-columns:110px 1fr 130px;
padding:0.9rem 2rem;
}
.detail_sch_day p{
font-size:1.65rem;
}
.detail_sch_time p{
font-size:1.65rem;
}
.detail_sch_btn a{
height:38px;
line-height:38px;
font-size:1.2rem;
}

}
