/* ============================================================
   2026-08-05：サイドバー幅の一元化
   ★この値は 2026版の base_2026.css と必ず同じにすること。
     片方だけ変えると、トップページと下層ページでサイドバー幅が
     ずれます。
     clamp(下限, 伸縮, 上限)：
       960px幅→200px ／ 1280px→256px ／ 1600px以上→320px
   ============================================================ */
:root {
  --fu-sidebar-w: clamp(200px, 20vw, 320px);
}

.box720 {
  width: 95%;
  margin: auto;
}

.bg-green-line {
  background-color: #5FB530;
  color: #fff;
  font-weight: 900;
  text-align: center;
  padding: .5rem;
  font-size: 1.3em;
}

.btn {
  border-radius: 6px;
}

.SPonly {
  display: block;
}

.PConly {
  display: none;
}

@media screen and (min-width: 768px) {
  .SPonly {
    display: none;
  }
}

@media screen and (min-width: 960px) {
  .box720 {
    /* 旧：width:75vw; margin-left:21vw（サイドバー20vw＋1vw）
       サイドバー幅に連動させるため calc に変更 */
    width: auto;
    margin-left: calc(var(--fu-sidebar-w) + 1vw);
    margin-right: 4vw;
  }
  .bg-green-line {
    text-align: left;
    padding-left: calc(var(--fu-sidebar-w) + 1vw);
    font-size: 1.7em;
  }
  .bg-green-line._txtc{text-align: center !important;}
  .PConly {
    display: block;
  }
}

@media screen and (min-width: 1200px) {
  .box720 {
    /* 旧：width:60vw; margin-left:24vw（サイドバー20vw＋4vw） */
    width: auto;
    margin-left: calc(var(--fu-sidebar-w) + 4vw);
    margin-right: 16vw;
  }
  .bg-green-line {
    padding-left: calc(var(--fu-sidebar-w) + 4vw);
    padding-top: .8rem;
    padding-bottom: .8rem;
  }
}

@media screen and (min-width: 1500px) {
  .bg-green-line {
    font-size: 2em;
  }
}

.siteHeader {
  padding-top: .5rem;
}

.siteHeader .line {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 1rem;
}

.siteHeader .line .title {
  width: 8rem;
}

.siteHeader .line .right {
  font-size: .7rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.siteHeader .line .right a {
  display: block;
}

.siteHeader .line .right a[href="tel:03-5713-1184"] {
  font-size: 1.7em;
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.siteHeader .line .right a[href="tel:03-5713-1184"] img {
  width: 1rem;
  margin-right: 0rem;
  margin-top:-.1rem;
}

.siteHeader .line .right a.contact {
  background-color: #D82617;
  color: #fff;
  border-radius: 4px;
  padding: .2rem 1rem;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}

.siteHeader .line .right a:hover {
  opacity: .7;
}

.siteHeader .row {
  right: -30rem;
  -webkit-transition: .3s;
  transition: .3s;
  background-color: rgba(255, 255, 255, 0.9);
  z-index: 999;
  position: fixed;
  top: 0;
  bottom: 0;
  padding: 1rem .5rem 0;
  z-index: 1001;
}

.siteHeader .row .gNav .gNavList li {
  margin-bottom: 1rem;
}

.siteHeader .row.is-active {
  right: 0;
}

.siteHeader .hamburger {
  position: fixed;
  top: .8rem;
  right: 1rem;
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  z-index: 9999;
  border-radius: 4px;
  background-color: #fff;
}

.siteHeader .hamburger span {
  display: block;
  width: calc(100% - .5rem);
  height: 4px;
  margin: auto;
  background-color: #5FB530;
  position: relative;
  border-radius: 2px;
  -webkit-transition: .2s;
  transition: .2s;
}

.siteHeader .hamburger span:nth-of-type(1) {
  top: 0;
}

.siteHeader .hamburger span:nth-of-type(1) {
  top: 15px;
}

.siteHeader .hamburger span:nth-of-type(3) {
  top: 18px;
}

.siteHeader .hamburger.is-active span:nth-of-type(1) {
  top: 15px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.siteHeader .hamburger.is-active span:nth-of-type(2) {
  display: none;
}

.siteHeader .hamburger.is-active span:nth-of-type(3) {
  top: 11px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

@media screen and (min-width: 768px) {
  .siteHeader .line .title {
    width: auto;
  }
  .siteHeader .line .right {
    margin-right: 0.1rem;
  }
  .siteHeader .hamburger {
    position: fixed;
    top: .8rem;
    right: 1rem;
    width: 3rem;
    height: 3rem;
  }
  .siteHeader .hamburger span {
    display: block;
    height: 5px;
    background-color: #5FB530;
    position: relative;
    border-radius: 2px;
  }
  .siteHeader .hamburger span:nth-of-type(1) {
    top: 7px;
  }
  .siteHeader .hamburger span:nth-of-type(2) {
    top: 16px;
  }
  .siteHeader .hamburger span:nth-of-type(3) {
    top: 25px;
  }
  .siteHeader .hamburger.is-active span:nth-of-type(1) {
    top: 20px;
  }
  .siteHeader .hamburger.is-active span:nth-of-type(3) {
    top: 15px;
  }
}

@media screen and (min-width: 960px) {
  .siteHeader .line .title {
    width: auto;
  }
  .siteHeader .line .right {
    font-size: 1em;
  }
  .siteHeader .line .right a[href="tel:03-5713-1184"]{
    font-size:2em;
  }
  .siteHeader .line .right a[href="tel:03-5713-1184"] img {
    width: auto;
  }
  .siteHeader .row {
    left: 0;
    width: var(--fu-sidebar-w);
    box-sizing: border-box;
    /* 横paddingを外す。サイドバーは半透明・ロゴは不透明なので、
       ロゴの左右に余白があるとそこだけ透けて見えて一体感が崩れる。
       内側の余白は .gNav 側で付ける。 */
    padding: 0 0 1rem;
  }
  .siteHeader .row .logo {
    display: block;
    width: 100%;
    left: auto;
    top: auto;
    margin: 0 0 1rem;
  }
  .siteHeader .row .gNav {
    position: absolute;
    right: 1.5rem;
    top: 10rem;
  }
  .siteHeader .row .gNav .gNavList {
    width: 153px;
  }
  .siteHeader .row .gNav .gNavList li {
    margin-bottom: .5rem;
  }
  .siteHeader .row .gNav .gNavList li a {
    display: block;
    width: 9.5rem;
    border: 1px solid #333;
    text-align: center;
  }
  .siteHeader .row .gNav .gNavList li a:hover {
    background-color: #FFE8A9;
  }
  .siteHeader .hamburger {
    display: none;
  }
}

@media screen and (min-width: 1200px) {
  .siteHeader .line .title {
    margin-left: -2vw;
  }
}

.mainFooter {
  margin-top: 4rem;
}

.mainFooter .viability {
  position: relative;
}

.mainFooter .viability p {
  position: absolute;
  bottom: .5rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  text-align: center;
}

.mainFooter .viability p img {
  height: 8em;
}

.mainFooter .trial {
  background-color: #D82617;
  padding: .5rem 1rem;
}

.mainFooter .trial p {
  color: #FFF000;
  font-weight: bold;
  font-size: 1.5em;
  text-align: center;
}

.mainFooter .trial p img {
  width: 5rem;
  margin-right: .3rem;
}

@media screen and (min-width: 960px) {
  .mainFooter .viability {
    position: relative;
  }
  .mainFooter .viability p {
    text-align: right;
    left: 0;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  .mainFooter .viability p img {
    height: auto;
  }
  .mainFooter .trial p {
    font-size: 3em;
    padding-left: 0;
    text-align: right;
  }
  .mainFooter .trial p img {
    width: auto;
  }
}

@media screen and (min-width: 1500px) {
  .mainFooter .trial p {
    font-size: 4em;
  }
}

.to-top {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
}

.to-top:hover {
  opacity: .7;
}

.to-top img {
  display: none;
}

.siteFooter {
  margin-top: 2rem;
}

.siteFooter .upper {
  margin-bottom: 2rem;
  text-align: right;
}

.siteFooter .upper a[href="tel:03-5713-1184"] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5em;
  font-weight: 900;
}

.siteFooter .upper a[href="tel:03-5713-1184"] img {
  height: 1.5rem;
  margin-right: .3rem;
}

.siteFooter .upper a.contact {
  background-color: #D82617;
  color: #fff;
  border-radius: 6px;
  padding: .2rem .5rem;
  display: inline-block;
  margin-bottom: .3rem;
}

.siteFooter .upper a.contact:hover {
  opacity: .7;
}

.siteFooter .lower {
  text-align: right;
  padding-bottom:110px;
}

.siteFooter .lower p:first-child {
  font-size: .7em;
}

.siteFooter .lower p span {
  display: block;
  font-size: 2.5em;
  font-weight: bold;
}

.siteFooter .lower .copyright {
  margin-top: 1rem;
  font-size: .8em;
}

body #bg {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  background-color: rgba(34, 34, 34, 0.9);
  z-index: 1000;
}
/*# sourceMappingURL=common.css.map */

/*  20200821追加  */
.adsp {
  display:none;
}
.adpc {
  display:block;
}
@media screen and (max-width: 768px) {
  .adsp {
    display:block;
  }
  .adpc {
    display:none;
  }
}

/*2021.08.10追加*/
.gold-line01{
border-top: solid 7px #a2803e;
border-bottom: solid 7px #a2803e;
padding-top: 7px;
padding-bottom: 7px;
background-color:#214c3b;
}
@media screen and (max-width: 768px){
.gold-line01{
border-top: solid 4px #a2803e;
border-bottom: solid 4px #a2803e;
}
}

/* 20221201追加 */
.siteHeader {
	padding-top:1rem;
}
@media(min-width:768px){
	.siteHeader {
	padding-top:0.5rem;
	}
}
.title > h1 {
	position:absolute;
	top:5px;
	left:2.5%;
	font-size:clamp(12.5px, 1vw, 18px);
	font-weight:bold;
	white-space:nowrap;
	padding-bottom:0.25rem;
}
@media(min-width:768px){
	.title > h1 {
		position:inherit;
	}
}

.policy {
	position:relative;
}
.policy ._mt3 {
	padding-top:3rem;
}
._tit-txt1{
	position:absolute;
	top:0.5rem;
	left:2.5%;
	font-size:clamp(14px, 1vw, 18px);
	font-weight:bold;
	color:#fff;
	opacity:0.4;
}
._tit-txt1:after{
	content:"";
	width:75px;
	height:1px;
	position:relative;
	top:-5px;
	background-color:#ccc;
	display:inline-block;
	margin-left:1rem;
}
._tit-txt2 {
	top: 0.5rem;
	left: 2.5%;
	font-size: clamp(12px, 1vw, 15px);
	font-weight: bold;
	color: #898989;
	padding: 0 1rem 0 0.25rem;
	display: flex;
	justify-content: space-between;
	white-space: nowrap;
	align-items: center;
}
._tit-txt2:after {
	content: "";
	height: 1px;
	position: relative;
	background-color: #ccc;
	display: block;
	margin-left: 1rem;
	width: 100%;
}
@media(min-width:768px){
	._tit-txt1 {
		left:0;
	}
}
.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }
.policy-text {
	font-family: "Sawarabi Mincho", Times new roman, "游明朝", YuMincho, "ヒラギノ明朝 Pro W3", "HG明朝B", serif;
  font-weight: 600;
  font-size: clamp(16px, 1.5vw, 36px);
	padding:2rem 1rem;
}

._mar1 {
	margin:1rem 0;
}


/*20230412*/
@media(max-width:413px){
  .siteHeader .hamburger {top: 1.5rem;right: .5rem;}
  .title > h1{font-size: 11px;}
  .siteHeader .line .right a[href="tel:03-5713-1184"],.siteHeader .line .right a.contact{white-space: nowrap;}
}
/* ============================================================
   2026年6月：ナビゲーション文字サイズ自動調整
   （旧：カスタマイザー追加CSSのnth-child個別指定を統合・置き換え）
   ============================================================ */
/* ============================================================
   2026年6月：ナビゲーション文字サイズ自動調整（修正版）
   ※ 前回追記した .gNavList li a { ... } ブロックを、
     このブロックで置き換えてください（そのままだと詳細度で
     古い .siteHeader .row .gNav .gNavList li a に負けて効きません）
   ============================================================ */

.nav-break {
  display: none;
}

@media screen and (min-width: 960px) {
  .siteHeader .row .gNav {
    position: static;   /* 旧：absolute; right:1.5rem; top:6rem を解除し、
                            サイドバー内で通常通り縦に積む配置に戻す */
    padding: 0 .5rem;   /* .row の横paddingを外したぶんをここで補う */
  }
  .siteHeader .row .gNav .gNavList {
    width: 100%;         /* 旧：153px固定を解除 */
  }
  .siteHeader .row .gNav .gNavList li {
    margin-bottom: 0;
    container-type: inline-size;
  }
  .siteHeader .row .gNav .gNavList li a {
    display: block;
    width: 100%;          /* 旧：9.5rem固定を解除 */
    border: none;         /* 旧：1px solid #333 を解除 */
    box-sizing: border-box;
    text-align: center;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: clamp(9px, 6cqw, 13px);
    font-weight: bold;
    color: #333333;
    padding: 8px 8px;
    text-decoration: none;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
  }
  .siteHeader .row .gNav .gNavList li a:hover {
    background-color: rgba(0,0,0,0.05);
  }
  .nav-break {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .gNavList {
    max-height: 75vh;
    overflow-y: auto;
    border-top: 1px solid rgba(0,0,0,0.1);
  }
  .gNavList li a {
    text-align: left;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: clamp(10px, 4vw, 14px);
    color: #333333;
    padding: 10px 15px;
    text-decoration: none;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    line-height: 1.4;
    white-space: nowrap;
  }
}

.gNavList li:last-child a {
  border-bottom: 1px solid rgba(0,0,0,1);
}

/* ============================================================
   2026年6月：PC版ロゴサイズの可変化
   （旧：カスタマイザー追加CSSの固定220px指定を統合・置き換え。
     .rowが20vwの可変幅であるのに対しロゴが固定pxだったため、
     画面幅1220px未満で常にロゴがサイドバー外へはみ出していた。
     横ブレの原因の一つと考えられる。）
   ============================================================ */
@media screen and (min-width: 960px) {
  .siteHeader .row .logo img {
    /* サイドバー幅いっぱい。左右に透過部分を作らないこと。 */
    display: block;
    width: 100%;
    height: auto;
  }
}

/* ============================================================
   2026-08-05：SP／タブレット版メニューのスクロール修正

   【症状】
   横長・低い画面（MSI Claw 等）やChromeの拡大表示で
   ハンバーガーメニューを開くと、上下スクロールができず
   下の方のメニュー項目が押せない。

   【原因1】適用範囲のズレ
     ハンバーガーが出る範囲 ：959px以下
     スクロール指定の範囲   ：767px以下（@media max-width:767px）
     → 768〜959px の帯ではスクロール指定がまったく効いていなかった。
       Chromeの拡大表示（1920px幅なら200%〜250%）でこの帯に入る。

   【原因2】背面ページのロックが無い
     origin.js は body に is-active クラスを付けているが、
     それに対応するCSSがどこにも無かった。
     そのためホイール操作が背面のページに流れ、
     メニュー内がスクロールしなかった。

   【対応】
     ・スクロール指定を959px以下に拡張
     ・リスト側の max-height:75vh をやめ、パネル自体をスクロールさせる
       （75vh はロゴ等の高さを考慮しておらず、低い画面で下が切れていた）
     ・body.is-active { overflow: hidden } を追加して背面を固定
   ============================================================ */
@media screen and (max-width: 959px) {

  /* メニューを開いている間は背面のページを固定する */
  body.is-active {
    overflow: hidden;
  }

  /* パネル自体をスクロールさせる */
  .siteHeader .row {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;   /* 端まで来ても背面に伝播させない */
    padding-bottom: 2rem;           /* 最後の項目が画面下端に貼り付かないように */
  }

  /* リスト側の高さ上限は外す（パネル側でスクロールするため不要） */
  .gNavList {
    max-height: none;
    overflow-y: visible;
    border-top: 1px solid rgba(0,0,0,0.1);
  }

  /* 768〜959px でもリンクの見た目をSP版に揃える
     （旧CSSは767px以下にしか無く、この帯だけ素の見た目になっていた） */
  .gNavList li a {
    text-align: left;
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: clamp(10px, 4vw, 14px);
    color: #333333;
    padding: 10px 15px;
    text-decoration: none;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    line-height: 1.4;
    white-space: nowrap;
  }
}

/* ============================================================
   2026-08-29：ヘッダーの調整
   ------------------------------------------------------------
   【経緯】
   いったんヘッダー上段(.line)を画面上部に固定するデザインを入れましたが、
     ・トップページのスライダーに重なる画像が、固定バーとぶつかる
     ・ページ上部にもともとあった要素が、固定バーの下に隠れる
   という不具合が出たため、ヘッダーは元の「ページと一緒にスクロールする」
   形に戻しました。

   ★ここに残しているのは次の3点だけです。
     1. 応急修正CSSの取り込み（横はみ出し対策）
     2. MENUボタンを画面の右上角に密着させて固定
     3. PCサイドバーのスクロールバーを左端へ
   ============================================================ */

/* ------------------------------------------------------------
   1. 全幅共通の安全網（旧「応急修正_追加CSS」からの引き継ぎ）
   ------------------------------------------------------------ */
html, body { overflow-x: hidden; }

main iframe,
.box720 iframe { max-width: 100%; }

table.time-schedule-table {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ------------------------------------------------------------
   お問い合わせボタンの中身
   文言は header.php 側の1箇所で変えられます。
   1段のときだけ中点「・」を出し、2段のときは消して
   「4文字／4文字」で折り返しを固定します。
   ------------------------------------------------------------ */
.siteHeader .line .right a.contact .fu-cta-1,
.siteHeader .line .right a.contact .fu-cta-2 { display: inline; }
.siteHeader .line .right a.contact .fu-cta-sep { display: inline; font-weight: inherit; }

/* ============================================================
   スマホ／タブレット（〜959px）
   ============================================================ */
@media screen and (max-width: 959px){

  /* 320pxの下限を外す（文字拡大時に画面外へ飛ぶのを防ぐ） */
  body { min-width: 0; }

  /* SEO用の見出しは、狭いときに折り返せるようにする */
  .title h1 {
    white-space: normal;
    max-width: 100%;
  }

  /* ------------------------------------------------------------
     2. MENUボタン：画面の右上角に密着させて固定
     ------------------------------------------------------------
     ページをどこまでスクロールしても、必ず同じ位置にあります。
     角に密着させることで「そこにある」と分かりやすくしています。
     ------------------------------------------------------------ */
  .siteHeader .hamburger{
    position: fixed;
    top: 0;
    right: 0;
    width: 52px;
    height: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0;
    /* 角は直角のまま、内側だけ少し丸める */
    border-radius: 0 0 0 6px;
    background-color: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1px 4px rgba(0,0,0,.16);
    z-index: 9999;
  }
  .siteHeader .hamburger span{
    position: static;
    top: auto;
    width: 26px;
    height: 3px;
    margin: 0;
    border-radius: 2px;
  }
  /* ラベルは <i> です。<span> にすると上の「棒」の指定を受けてしまいます */
  .siteHeader .hamburger .fu-menu-label{
    font-style: normal;
    font-size: 9px;
    font-weight: bold;
    letter-spacing: .08em;
    color: #5FB530;
    line-height: 1;
    margin-top: 2px;
  }
  .siteHeader .hamburger.is-active span:nth-of-type(1){
    top: auto;
    transform: translateY(7px) rotate(-45deg);
  }
  .siteHeader .hamburger.is-active span:nth-of-type(2){
    display: block;
    opacity: 0;
  }
  .siteHeader .hamburger.is-active span:nth-of-type(3){
    top: auto;
    transform: translateY(-7px) rotate(45deg);
  }

  /* ------------------------------------------------------------
     ヘッダー上段の並び直し
     ------------------------------------------------------------
     ・右にMENUボタンのぶんの余白を確保する
       これが無いと、お問い合わせボタンがMENUボタンの下に潜り込んで
       押せなくなります（改修前に起きていた不具合がこれです）。

     ・SEO用の見出しを「通常の流れ」に戻す
       もともと position:absolute で浮かせてあったため、下にある
       ロゴやお問い合わせボタンと重なっていました。
       流れに戻せば、重なりが構造的に起きなくなります。
       左に［見出し／ロゴ］、右に［ボタン］という2列になります。
     ------------------------------------------------------------ */
  .siteHeader .line{
    padding-right: 58px;
    box-sizing: border-box;
    align-items: center;
  }

  .siteHeader .line .title{
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
  }
  .siteHeader .line .title > h1{
    position: static;
    top: auto;
    left: auto;
    max-width: 100%;
    margin: 0 0 .25rem;
    padding: 0;
    /* 2行に収まる大きさ。SEO用の見出しなので控えめに */
    font-size: clamp(9px, 2.6vw, 12px);
    line-height: 1.35;
    white-space: normal;
  }
  .siteHeader .line .title img{
    display: block;
    width: 8rem;
    max-width: 100%;
    height: auto;
  }

  /* 赤ボタン。大きくなりすぎないように上限を決めています */
  .siteHeader .line .right{
    flex: 0 0 auto;
    margin-left: .6rem;
  }
  .siteHeader .line .right a.contact{
    white-space: nowrap;
    font-weight: bold;
    font-size: clamp(10px, 3vw, 12px);
    line-height: 1.3;
    padding: .35rem .8rem;
    width: auto;
  }

  /* ------------------------------------------------------------
     メニューパネル（旧「応急修正_追加CSS」からの引き継ぎ）
     幅と退避距離を、文字サイズではなく画面幅を基準にしています。
     ------------------------------------------------------------ */
  .siteHeader .row{
    right: -100vw;
    width: 88vw;
    max-width: 340px;
    box-sizing: border-box;
  }
  .siteHeader .row.is-active{ right: 0; }
  .siteHeader .row .logo,
  .siteHeader .row .gNav,
  .siteHeader .row .gNavList{ max-width: 100%; }
  .siteHeader .row .logo img{ width: 100%; height: auto; }
  .siteHeader .row .gNavList li a{ white-space: normal; }
}

/* ------------------------------------------------------------
   お問い合わせボタンの2段組み（360px以下）
   折り返しはブラウザ任せにせず「4文字／4文字」で固定します。
   ★1段のままにしたい場合は、このブロックごと削除してください。
   ★切り替える幅を変えたい場合は 360px の数字だけを変えてください。
   ------------------------------------------------------------ */
@media screen and (max-width: 360px){
  .siteHeader .line .right a.contact{
    font-size: clamp(12px, 4.4vw, 15px);
    padding: 5px 9px;
    line-height: 1.25;
  }
  .siteHeader .line .right a.contact .fu-cta-sep{ display: none; }
  .siteHeader .line .right a.contact .fu-cta-1,
  .siteHeader .line .right a.contact .fu-cta-2{ display: block; }
}

/* ============================================================
   3. PC（960px〜）：サイドバーのスクロールバーを左端へ
   ------------------------------------------------------------
   項目が増えてスクロールが必要になったとき、右端にバーが出ると
   半透明のサイドバーの面を縦に割ってしまいます。左端に寄せれば、
   そこから右側はすべて一体に見えます。
   direction:rtl はスクロールバーの位置だけを移すための指定で、
   中身は下の ltr で元に戻すため、文字の向きは変わりません。
   ============================================================ */
@media screen and (min-width: 960px){
  .siteHeader .row{
    direction: rtl;
  }
  .siteHeader .row > *{
    direction: ltr;
  }

  /* ------------------------------------------------------------
     お問い合わせボタンを画面の右端寄りへ
     ------------------------------------------------------------
     ヘッダー上段は .box720 なので、右に大きな余白（1200px以上で16vw）
     を持っています。そのぶんボタンが内側に入っていました。
     上段だけ右の余白を詰めて、ボタンを右端に寄せます。
     見出しの位置（左側）は変わりません。
     ------------------------------------------------------------ */
  .siteHeader .line{
    margin-right: 2vw;
  }
}

/* ==========================================================================
   2026-08-29：日本語の折り返し（見出しの「1文字だけ残る」対策）
   --------------------------------------------------------------------------
   【なぜ clamp では直らないか】
   clamp() が決めるのは文字の大きさだけです。どこで折り返すかは
   「文字数 × 文字サイズ ÷ 箱の幅」で決まるため、少し小さくしても
   幅が変われば別の場所でまた1文字余ります。
   下限に張り付いたあとは、そもそも縮みません。

   【この2行がやること】
   text-wrap: balance
     各行がだいたい同じ長さになるよう、折り返し位置を選び直します。
     行数は変わりませんが、最後に1文字だけ残るのがなくなります。
     Chrome 130+／Safari 17.5+／Firefox 121+

   word-break: auto-phrase
     日本語を単語ではなく文節で切ります。
     「小山台を目指す塾な／ら」ではなく「小山台を目指す／塾なら」。
     Chrome 119+／Edge 119+。SafariとFirefoxは未対応ですが、
     対応していないブラウザは無視するだけなので壊れません。

   【付ける範囲】
   見出し・帯・キャプションなど短い文だけ。本文の段落には付けません。
   長い文章に balance を使うと、かえって行がガタつきます。

   【うまくいかない1行が出たら】
   auto-phrase は機械学習で文節を判定するので、まれに意図しない位置で
   切れます。その1行だけ <wbr> で切ってよい位置を指定できます。
   ========================================================================== */

.bg-green-line,
.title > h1,
.siteHeader .line .right a.contact,
.mainFooter .trial p,
.siteFooter .lower p span,
.red-text-title,
._tit-txt1,
.policy-text {
  text-wrap: balance;
  word-break: auto-phrase;
}