/*
Theme Name: 凛柔道クラブ
Description: 柔道場の見本サイト（白×墨・明朝の静かな型）。白骨温泉の型を参考にした。
Version: 1.0
Author: Musubi Group
*/

/* =========================================================
   0. 色と書体（ここを変えると全体の印象が変わる）
   ========================================================= */
:root{
  --paper:#ffffff;      /* 背景の白 */
  --mist:#f2f2f0;       /* うすい面（区切りの帯） */
  --sumi:#272727;       /* 文字の墨色 */
  --gray:#727272;       /* 補足の文字 */
  --line:#d3d3d3;       /* 細い罫線 */
  --moss:#979996;       /* 小さな英字に使ううすい色 */
  --moss-d:#5f6560;     /* 言葉の強調に使う濃いめの色 */
  --wrap:1040px;        /* 中身の最大幅 */
  --font-min:"Hina Mincho","Zen Old Mincho",serif;              /* 大見出しの明朝 */
  --font-body:"Zen Old Mincho","Hiragino Mincho ProN",serif;    /* 本文の明朝 */
  --font-en:"Noto Sans JP",sans-serif;                          /* 英字・数字 */
}

/* =========================================================
   1. 土台
   ========================================================= */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--sumi);
  font-family:var(--font-body);
  font-size:18px;
  line-height:2.1;           /* 行間を広くとるのがこの型の要 */
  letter-spacing:.06em;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;}
h1,h2,h3{font-weight:400;margin:0;line-height:1.7;}
p{margin:0 0 1.4em;}

.wrap{width:min(92%,var(--wrap));margin-inline:auto;}
.sec{padding:120px 0;}
.sec--mist{background:var(--mist);}
.note{font-size:14px;color:var(--gray);line-height:1.9;}

/* 見出しの組み（英字が上、日本語が下） */
.h-en{
  font-family:var(--font-en);
  font-size:12px;letter-spacing:.28em;color:var(--moss);
  margin:0 0 14px;
}
.h-jp{font-family:var(--font-min);font-size:33px;letter-spacing:.12em;}
.sec__head{text-align:center;margin-bottom:64px;}

/* ボタン（角丸なし・細い線だけ。静かに見せる） */
.btn{
  display:inline-block;
  padding:16px 40px;
  border:1px solid var(--sumi);
  background:transparent;
  color:var(--sumi);
  font-family:var(--font-en);
  font-size:14px;letter-spacing:.16em;
  text-decoration:none;
  transition:background .3s,color .3s;
}
.btn:hover{background:var(--sumi);color:#fff;}
.btn--fill{background:var(--sumi);color:#fff;}
.btn--fill:hover{background:transparent;color:var(--sumi);}

/* スクロールでふわっと出す */
.fade{opacity:0;transform:translateY(24px);transition:opacity 1s ease,transform 1s ease;}
.fade.is-on{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.fade{opacity:1;transform:none;transition:none;}}

/* 写真がまだ無いときの点線わく */
.ph{
  display:flex;align-items:center;justify-content:center;
  aspect-ratio:3/2;
  border:1px dashed var(--line);
  color:var(--gray);font-size:13px;font-family:var(--font-en);
  background:var(--mist);
}
.ph--hero{aspect-ratio:16/7;}
.ph--tall{aspect-ratio:3/4;}

/* =========================================================
   1-2. 開くときの一言（トップだけ。詩がぼけた状態から浮かび上がる）
   ========================================================= */
.rin-loading{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  pointer-events:none;          /* 下のページを触れるようにしておく */
  background:var(--paper);
}
.rin-loading::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(160deg,var(--mist) 0%,var(--paper) 58%);
  opacity:.9;
}
.rin-loading__poem{
  position:relative;z-index:2;margin:0;
  writing-mode:vertical-rl;white-space:nowrap;
  font-family:var(--font-min);
  font-size:clamp(22px,1.24vw + 17.4px,35px);
  line-height:2;letter-spacing:.18em;
  transform:scaleY(.9);         /* 縦書きを少し引き締める */
  opacity:0;filter:blur(10px);  /* ← ここから浮かび上がる */
  transition:opacity 1s,filter 1.3s;
}
.rin-loading.is-on .rin-loading__poem{opacity:1;filter:blur(0);}
.rin-loading.is-fadeout .rin-loading__poem{
  opacity:0;filter:blur(10px);
  transition:opacity 1s,filter .8s;
}
/* 動きを減らす設定のときは、ぼかしをやめて静かに出すだけにする（消しはしない） */
@media (prefers-reduced-motion:reduce){
  .rin-loading__poem{filter:none;transition:opacity .6s;}
  .rin-loading.is-on .rin-loading__poem{filter:none;}
  .rin-loading.is-fadeout .rin-loading__poem{filter:none;transition:opacity .6s;}
}

/* =========================================================
   2. ヘッダー
   ========================================================= */
.hd{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 5%;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.hd__logo{display:flex;align-items:center;gap:12px;text-decoration:none;}
.hd__mark{
  width:40px;height:40px;flex:none;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--sumi);
  font-family:var(--font-min);font-size:22px;
}
.hd__name{font-family:var(--font-min);font-size:20px;letter-spacing:.14em;line-height:1.4;}
.hd__name small{display:block;font-family:var(--font-en);font-size:10px;letter-spacing:.24em;color:var(--gray);}
.hd__nav{display:flex;align-items:center;gap:clamp(10px,1.4vw,22px);}
.hd__nav a{font-size:14px;text-decoration:none;letter-spacing:.06em;white-space:nowrap;}
.hd__nav a:hover{color:var(--moss);}
.hd__cta{padding:11px 20px;}
.hd__burger{display:none;background:none;border:0;font-size:26px;cursor:pointer;color:var(--sumi);}

@media (max-width:1180px){
  .hd__burger{display:block;}
  .hd__nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);
  }
  .hd__nav.is-open{display:flex;}
  .hd__nav a{width:100%;padding:18px 5%;border-top:1px solid var(--line);text-align:center;}
  .hd__cta{padding:18px 5%;border:0;}
}

/* =========================================================
   3. ヒーロー（全幅の写真。文字は子どもたちの目線の先に置く）
   ========================================================= */
.hero{padding:0;}

/* 見出し「静かに、強く。」は 2026-08-26 に削除（写真を画面の上まで伸ばすため）。
   文言は管理画面「道場の設定」に残っているので、戻したくなったら front-page.php に
   <p class="hero__tagline fade"> を書き戻せばよい */

.hero__stage{position:relative;}
.hero__img{position:relative;}
.hero__img img,.hero__img .ph{width:100%;height:min(80vh,680px);object-fit:cover;aspect-ratio:auto;}
/* スマホは縦に長くなりすぎるので、写真の高さは元のままにする */
@media (max-width:760px){.hero__img img,.hero__img .ph{height:min(64vh,560px);}}

/* 写真の中の一言。
   写真の左半分は白い窓と畳だけの余白で、子どもたちはそちらを向いている。
   その目線の先（左から約17%・目の高さ＝上から35%）に縦書き2行で置くと、
   子どもたちが言葉を見つめているように見える。
   子どもたちが言葉を見つめているように見える。 */
.hero__gaze{
  display:none;position:absolute;z-index:3;
  left:clamp(20px,17%,250px);
  top:35%;transform:translateY(-50%);
  writing-mode:vertical-rl;white-space:nowrap;
  /* 書体＝Yuji Syuku（筆で書いた字）。太字が無いので大きさで強さを出す */
  font-family:"Yuji Syuku",var(--font-min);
  font-size:clamp(25px,2.9vw,41px);
  line-height:1.9;letter-spacing:.18em;
  /* 墨は真っ黒にせず66%。明るい写真に合わせた「うすい墨」の濃さ */
  color:rgba(39,39,39,.66);
  text-shadow:0 0 12px rgba(255,255,255,.9),0 0 30px rgba(255,255,255,.75);
}
/* スマホは写真が左右に切り取られて余白が消えるので出さない */
@media (min-width:760px){.hero__gaze{display:block;}}

.hero__cta{text-align:center;margin:clamp(32px,5vw,48px) 0 0;}

/* =========================================================
   4. 道場物語（写真に箱を重ねる・縦書き・横並びの人物リンク）
   ========================================================= */
.mono{position:relative;padding-bottom:clamp(64px,8vw,96px);}
/* 写真は「顔が全部入る帯」で切り取る。
   横幅が変わっても同じ帯が出るように、高さではなく比率（2.8:1）で指定する。
   上から14%の位置に合わせると、指導者の頭の上に余白が残り、
   女の子のあごの下にも余白ができる＝下に重ねる白い箱が顔にかからない。 */
.mono__photo img,.mono__photo .ph{
  width:100%;height:auto;aspect-ratio:2.8/1;
  object-fit:cover;object-position:center 14%;
}
/* スマホは帯にすると細長くなりすぎるので、写真をまるごと見せる */
@media (max-width:760px){
  .mono__photo img,.mono__photo .ph{aspect-ratio:3/2;}
}

.mono__row{display:block;}
@media (min-width:960px){
  .mono__row{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}
}

.mono__box{
  position:relative;z-index:2;
  background:var(--paper);
  border:1px solid var(--sumi);
  max-width:520px;
  margin:clamp(-96px,-4.5vw,-28px) auto 0;  /* 写真への食い込み。画面幅に比例させて、どの幅でも顔にかからない量にしている */
  padding:clamp(36px,4.6vw,56px) clamp(28px,4.6vw,48px);
  text-align:center;
}
@media (min-width:960px){.mono__box{margin-left:0;margin-right:0;}}
.mono__box::before,.mono__box::after{
  content:"";position:absolute;left:0;right:0;height:4px;margin:auto;
  background:var(--paper);
}
.mono__box::before{top:-1px;clip-path:polygon(0 0,100% 0,100% 4px,calc(100% - 4px) 0,4px 0,0 4px);}
.mono__box::after{bottom:-1px;clip-path:polygon(0 4px,4px 0,calc(100% - 4px) 0,100% 4px,calc(100% - 4px) 4px,4px 4px);}
.mono__box-title{
  font-family:var(--font-min);
  font-size:clamp(35px,5vw,50px);
  letter-spacing:.2em;margin:6px 0 0;
}

.mono__poem{
  max-width:520px;margin:48px auto 0;text-align:center;
  font-family:var(--font-min);font-size:17px;letter-spacing:.14em;line-height:2.2;color:var(--sumi);
}
@media (min-width:960px){
  .mono__poem{margin:56px 0 0;}
}

.mono__links{
  margin-top:clamp(56px,7vw,72px);
  display:flex;flex-direction:column;gap:40px;
  max-width:560px;margin-inline:auto;
}
@media (min-width:960px){.mono__links{margin-top:0;}}
.mono__card{
  display:grid;grid-template-columns:104px 1fr;gap:24px;
  text-decoration:none;color:inherit;
}
.mono__card-img img,.mono__card-img .ph{width:104px;height:104px;object-fit:cover;}
.mono__card .h-en{margin-bottom:6px;}
.mono__card-ttl{font-family:var(--font-min);font-size:21px;letter-spacing:.12em;margin:0 0 10px;}
.mono__card p{font-size:15px;color:var(--gray);line-height:1.8;margin:0;}
@media (max-width:480px){
  .mono__card{grid-template-columns:80px 1fr;gap:16px;}
  .mono__card-img img,.mono__card-img .ph{width:80px;height:80px;}
}

/* =========================================================
   5. 写真＋文章の2枚組
   ========================================================= */
.duo{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center;}
.duo--rev .duo__pic{order:2;}
.duo__txt .h-jp{margin-bottom:26px;}
.duo__txt .lead{font-size:17px;}
@media (max-width:860px){
  .duo{grid-template-columns:1fr;gap:32px;}
  .duo--rev .duo__pic{order:0;}
}

/* =========================================================
   6. えらばれる理由 3つ
   ========================================================= */
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;}
.reason__no{font-family:var(--font-en);font-size:12px;letter-spacing:.24em;color:var(--moss);margin:0 0 14px;}
.reason__pic{margin-bottom:22px;}
.reason__pic img,.reason__pic .ph{aspect-ratio:3/4;object-fit:cover;width:100%;}
.reason__ttl{font-family:var(--font-min);font-size:21px;letter-spacing:.1em;margin-bottom:14px;}
.reason p{font-size:15px;color:var(--gray);margin:0;}
@media (max-width:860px){.reasons{grid-template-columns:1fr;gap:56px;}}

/* =========================================================
   7. クラスと月謝（細い罫線の表）
   ========================================================= */
.price{width:100%;border-collapse:collapse;font-size:17px;}
.price th,.price td{padding:22px 16px;border-bottom:1px solid var(--line);text-align:left;}
.price thead th{
  font-family:var(--font-en);font-size:12px;letter-spacing:.2em;
  color:var(--gray);font-weight:400;border-bottom:1px solid var(--sumi);
}
.price .cls{font-family:var(--font-min);font-size:20px;letter-spacing:.1em;}
.price .age{display:block;font-size:13px;color:var(--gray);letter-spacing:0;}
.price .yen{font-family:var(--font-en);font-size:19px;white-space:nowrap;}
@media (max-width:760px){
  .price thead{display:none;}
  .price tr{display:block;border-bottom:1px solid var(--line);padding:20px 0;}
  .price td{display:flex;justify-content:space-between;gap:16px;border:0;padding:6px 0;}
  .price td::before{content:attr(data-label);font-size:13px;color:var(--gray);font-family:var(--font-en);}
  .price td:first-child::before{content:none;}
}

/* =========================================================
   8. 道場のこと＋地図
   ========================================================= */
.info{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;}
.info dl{margin:0;}
.info dl div{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);}
.info dt{font-size:14px;color:var(--gray);letter-spacing:.1em;}
.info dd{margin:0;font-size:17px;}
.info iframe{width:100%;height:100%;min-height:340px;border:0;filter:grayscale(1);}
@media (max-width:860px){.info{grid-template-columns:1fr;gap:32px;}}

/* =========================================================
   9. おしらせ
   ========================================================= */
.news{max-width:820px;margin-inline:auto;}
.news__item{
  display:grid;grid-template-columns:110px 1fr;gap:20px;align-items:baseline;
  padding:22px 4px;border-bottom:1px solid var(--line);
  text-decoration:none;transition:background .3s;
}
.news__item:hover{background:var(--mist);}
.news__date{font-family:var(--font-en);font-size:13px;color:var(--gray);letter-spacing:.1em;}
.news__cat{
  display:inline-block;margin-left:12px;padding:3px 12px;
  border:1px solid var(--line);font-size:12px;color:var(--gray);
  font-family:var(--font-en);letter-spacing:.08em;
}
@media (max-width:640px){
  .news__item{grid-template-columns:1fr;gap:6px;}
}

/* =========================================================
   10. 体験の申し込み
   ========================================================= */
.cta{background:var(--mist);padding:110px 0;text-align:center;}
.cta h2{font-family:var(--font-min);font-size:clamp(24px,3.3vw,33px);letter-spacing:.14em;margin-bottom:20px;}
.cta p{font-size:17px;margin-bottom:34px;}
.cta__btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
.form-box{max-width:640px;margin-inline:auto;}

/* 申し込みフォーム（Contact Form 7）
   枠で囲まず、下線と余白だけで区切るのがこの型 */
.f-lead{text-align:center;margin:0 0 52px;}
.f-lead p{font-size:17px;margin:0;}
.f-lead strong{font-weight:400;border-bottom:1px solid var(--line);padding-bottom:3px;}

.f-row{margin:0 0 34px;}
.f-row label{display:block;font-size:14px;letter-spacing:.12em;color:var(--gray);}
.f-need{
  display:inline-block;margin-left:10px;padding:2px 9px;
  font-family:var(--font-en);font-size:11px;letter-spacing:.1em;
  color:var(--moss-d);border:1px solid var(--line);
}

.form-box input[type=text],
.form-box input[type=email],
.form-box input[type=tel],
.form-box select,
.form-box textarea{
  width:100%;
  margin-top:10px;
  padding:12px 2px;
  border:none;border-bottom:1px solid var(--line);border-radius:0;
  background:transparent;
  color:var(--sumi);
  font-family:var(--font-body);
  font-size:18px;            /* 16px未満にするとスマホで画面が拡大される */
  line-height:1.9;
  letter-spacing:.06em;
  -webkit-appearance:none;appearance:none;
  transition:border-color .3s;
}
.form-box select{
  padding-right:24px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23727272'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 3px center;background-size:9px;
}
.form-box textarea{resize:vertical;}
.form-box ::placeholder{color:#bcbcbc;}
.form-box input:focus,.form-box select:focus,.form-box textarea:focus{
  outline:none;border-bottom-color:var(--sumi);
}

.f-submit{text-align:center;margin:52px 0 0;}
.form-box input[type=submit]{
  padding:17px 54px;
  border:1px solid var(--sumi);background:var(--sumi);color:#fff;
  font-family:var(--font-en);font-size:14px;letter-spacing:.16em;
  cursor:pointer;
  transition:background .3s,color .3s;
}
.form-box input[type=submit]:hover{background:transparent;color:var(--sumi);}
.f-note{text-align:center;font-size:13px;color:var(--gray);line-height:1.9;margin:26px 0 0;}

/* 送信したあとに出る文 */
.wpcf7 form .wpcf7-response-output{
  margin:28px 0 0;padding:16px 20px;
  border:1px solid var(--line);
  font-size:15px;line-height:1.9;text-align:center;
}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--moss-d);}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output{border-color:#a4574a;color:#a4574a;}
.wpcf7-not-valid-tip{font-size:13px;color:#a4574a;letter-spacing:.06em;margin-top:8px;}
.form-box .wpcf7-not-valid{border-bottom-color:#a4574a;}
.wpcf7-spinner{margin:0 0 0 14px;}

@media (max-width:640px){
  .f-lead{margin-bottom:40px;}
  .f-row{margin-bottom:28px;}
  .f-submit{margin-top:42px;}
  .form-box input[type=submit]{width:100%;padding:18px 0;}
}

/* =========================================================
   11. フッター
   ========================================================= */
.ft{border-top:1px solid var(--line);padding:72px 0 40px;}
.ft__top{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.ft__nav{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;align-content:start;}
.ft__nav a{font-size:14px;text-decoration:none;letter-spacing:.1em;}
.ft__nav a:hover{color:var(--moss);}
.ft__copy{
  text-align:center;margin:56px 0 0;
  font-family:var(--font-en);font-size:12px;letter-spacing:.16em;color:var(--gray);
}
@media (max-width:760px){.ft__top{grid-template-columns:1fr;}}

/* スマホの下に出る固定ボタン */
.sticky-cta{display:none;}
@media (max-width:760px){
  body{padding-bottom:64px;}
  .sticky-cta{
    display:grid;grid-template-columns:1fr 1fr;
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--paper);border-top:1px solid var(--line);
  }
  .sticky-cta a{
    padding:18px 0;text-align:center;text-decoration:none;
    font-family:var(--font-en);font-size:14px;letter-spacing:.1em;
  }
  .sticky-cta a + a{background:var(--sumi);color:#fff;}
}

/* =========================================================
   12. 記事ページ（おしらせ）
   ========================================================= */
.entry{max-width:760px;margin-inline:auto;}
.entry__ttl{font-family:var(--font-min);font-size:29px;letter-spacing:.1em;margin:14px 0 28px;}
.entry__meta{font-family:var(--font-en);font-size:13px;color:var(--gray);letter-spacing:.1em;}
.entry img{margin:28px 0;}

/* =========================================================
   7-2. クラスの写真4枚（月謝の表の上に置く帯）
   ========================================================= */
.cls-pics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
  margin-bottom:64px;
}
.cls-pic{margin:0;}
.cls-pic img,.cls-pic .ph{aspect-ratio:3/2;object-fit:cover;width:100%;}
.cls-pic figcaption{
  display:flex;align-items:baseline;gap:12px;
  padding:14px 2px 0;border-top:1px solid var(--line);margin-top:14px;
}
.cls-pic__ttl{font-family:var(--font-min);font-size:19px;letter-spacing:.1em;}
.cls-pic__age{font-size:13px;color:var(--gray);letter-spacing:0;}
@media (max-width:860px){
  .cls-pics{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:48px;}
}
@media (max-width:520px){
  .cls-pics{grid-template-columns:1fr;gap:28px;}
}

/* =========================================================
   13. 固定ページの上部（見出し帯）
   ========================================================= */
.page-hero{background:var(--mist);padding:72px 0 56px;border-bottom:1px solid var(--line);}
.page-hero__in{text-align:center;max-width:760px;}
.page-hero h1{
  font-family:var(--font-min);
  font-size:clamp(31px,4.4vw,46px);
  letter-spacing:.14em;margin:14px 0 0;
}
.page-hero__lead{font-size:17px;color:var(--gray);line-height:1.9;margin:22px 0 0;}

/* =========================================================
   14. 固定ページの本文
   ========================================================= */
.entry--page{max-width:820px;}
.entry--page h2{
  font-family:var(--font-min);
  font-size:clamp(23px,2.9vw,29px);
  letter-spacing:.1em;line-height:1.6;
  margin:64px 0 24px;padding-bottom:16px;
  border-bottom:1px solid var(--line);
}
.entry--page h2:first-child{margin-top:0;}
.entry--page h3{
  font-family:var(--font-min);
  font-size:19px;letter-spacing:.08em;
  margin:36px 0 14px;
}
.entry--page p{font-size:17px;line-height:2;margin:0 0 20px;}
.entry--page ul,.entry--page ol{font-size:17px;line-height:2;margin:0 0 20px;padding-left:1.4em;}
.entry--page li{margin-bottom:8px;}
.entry--page a{color:var(--sumi);text-decoration:underline;text-underline-offset:3px;}
.entry--page strong{font-weight:600;}

/* 固定ページ内の小さな表（早見表など） */
.entry--page table{width:100%;border-collapse:collapse;font-size:15px;margin:0 0 24px;}
.entry--page th,.entry--page td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;}
.entry--page thead th{font-family:var(--font-en);font-size:12px;letter-spacing:.12em;color:var(--gray);font-weight:400;border-bottom:1px solid var(--sumi);}

/* 注意書きの小さな箱 */
.entry--page .note-box{
  background:var(--mist);border-left:3px solid var(--moss-d);
  padding:18px 22px;font-size:15px;line-height:1.9;color:var(--gray);
  margin:0 0 24px;
}

/* =========================================================
   15. 各セクションの「詳しく見る」リンク
   ========================================================= */
.more{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:22px;font-size:14px;letter-spacing:.08em;
  text-decoration:none;color:var(--sumi);
  border-bottom:1px solid var(--sumi);padding-bottom:3px;
  transition:opacity .25s;
}
.more:hover{opacity:.6;}
.more span{font-family:var(--font-en);transition:transform .25s;}
.more:hover span{transform:translateX(4px);}
.more-row{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:22px;}
.more-row .more{margin-top:0;}

/* =========================================================
   17. 稽古風景ギャラリー（/gallery/）
   写真は角を丸めず、細い線と余白でつなぐ＝この型の作法に合わせる
   ========================================================= */
.rin-gallery{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:clamp(14px,2vw,26px);margin:0 0 28px;
}
.rin-gallery figure{margin:0;}
.rin-gallery img{
  display:block;width:100%;height:210px;object-fit:cover;
  margin:0;cursor:zoom-in;filter:saturate(.94);
  transition:opacity .4s ease;
}
.rin-gallery figure:hover img{opacity:.86;}
.rin-gallery figcaption{
  font-size:14px;color:var(--gray);line-height:1.9;
  padding:12px 2px 0;border-top:1px solid var(--line);margin-top:12px;
}

/* 写真をクリックしたときの拡大（プラグインなし） */
.rin-lightbox{
  position:fixed;inset:0;z-index:9500;
  background:rgba(28,28,28,.94);
  display:none;align-items:center;justify-content:center;padding:24px;
}
.rin-lightbox.is-on{display:flex;}
.rin-lightbox img{max-width:100%;max-height:82vh;object-fit:contain;display:block;}
.rin-lightbox-close{
  position:absolute;top:18px;right:22px;width:44px;height:44px;
  border:1px solid rgba(255,255,255,.5);background:transparent;
  color:#fff;font-size:24px;line-height:1;cursor:pointer;
}
@media (max-width:480px){.rin-gallery img{height:170px;}}