@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ul,
ol {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* Stage D 修正(138): 多言語切替ドロップダウン (.langbox) を一時非表示
 *   後日リリース時はこの 1 ブロックを削除すれば既存の表示制御に戻る。
 *   PC / tab / SP / 全ヘッダー位置 (header-menu / l-header__side) で確実に隠す。
 */
.l-header .langbox {
  display: none !important;
}

.l-header {
  width: 100%;
  height: 100px;
  background: url(../../img/v2/common/header-top.svg) top center no-repeat, #fff;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .l-header {
    height: 90px;
  }
}
.l-header__container {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.l-header__side {
  /* js-sp-menu */
  width: calc(100% - 250px);
}
@media screen and (max-width: 1024px) {
  .l-header__side {
    position: fixed;
    top: 90px;
    left: 0;
    width: 100%;
    height: calc(100% - 90px);
    background: #fff;
    color: #222222;
    overflow: auto;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease, visibility 0.6s ease;
  }
}
.l-header__side.is-active {
  opacity: 100;
  visibility: visible;
  z-index: 2000;
}
.l-header .header-copy {
  position: absolute;
  top: 0;
  left: 0;
  padding-top: 7px;
  font-size: 12px;
  color: #777777;
}
@media screen and (max-width: 1024px) {
  .l-header .header-copy {
    padding: 8px 3% 0;
    font-size: 10px;
    line-height: 1.2;
  }
}
@media screen and (max-width: 1024px) {
  .l-header .header-wrap {
    width: 100%;
    height: 90px;
    padding: 25px 1.5% 0 3%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
.l-header .header-wrap .header-menu {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}
.l-header .header-wrap .header-menu .langbox {
  display: none;
}
@media screen and (max-width: 1024px) {
  .l-header .header-wrap .header-menu .langbox {
    display: block;
    padding: 0;
    margin: 0;
  }
}
.l-header .header-logo {
  display: block;
  padding-top: 25px;
  width: 200px;
  margin-right: 100px;
}
@media screen and (max-width: 1024px) {
  .l-header .header-logo {
    padding-top: 20px;
    width: 150px;
    margin-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-header .header-logo {
    padding-top: 5px;
  }
}
.l-header .header-logo a {
  display: block;
}
.l-header .header-guide {
  display: flex;
  justify-content: flex-end;
}
@media screen and (max-width: 1024px) {
  .l-header .header-guide {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.l-header .header-guide .langbox {
  padding-top: 30px;
  margin-right: 10px;
}
@media screen and (max-width: 1024px) {
  .l-header .header-guide .langbox {
    display: none;
  }
}
.l-header .header-btn {
  display: flex;
  justify-content: flex-end;
  padding-top: 20px;
}
@media screen and (max-width: 1024px) {
  .l-header .header-btn {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
  }
}
.l-header .header-btn a {
  display: block;
  min-width: 130px;
  height: 30px;
  text-align: center;
  padding: 0 1em;
}
@media screen and (max-width: 1024px) {
  .l-header .header-btn a {
    width: 250px;
  }
}
@media screen and (max-width: 768px) {
  .l-header .header-btn a {
    width: 200px;
  }
}
.l-header .header-btn a span {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 0.025em;
  position: relative;
}
.l-header .header-btn a span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
}
.l-header .header-btn a.member {
  background: var(--site_blue);
  border-radius: 5px;
}
.l-header .header-btn a.member span {
  padding-right: 17px;
}
.l-header .header-btn a.member span::after {
  width: 12px;
  height: 11px;
  background: url(../../img/v2/common/icon_pencil.svg) no-repeat;
  background-size: contain;
}
.l-header .header-btn a.login {
  background: var(--base_color);
  border-radius: 5px;
}
.l-header .header-btn a.login span {
  padding-right: 14px;
}
.l-header .header-btn a.login span::after {
  width: 8px;
  height: 12px;
  background: url(../../img/v2/common/icon_lock.svg) no-repeat;
  background-size: contain;
}
.l-header .header-btn a.logout {
  background: var(--site_blue);
  border-radius: 5px;
}
.l-header .header-btn a.logout span {
  padding-right: 14px;
}
.l-header .header-btn a.logout span::after {
  width: 12px;
  height: 12px;
  background: url(../../img/v2/common/icon_logout.svg) no-repeat;
  background-size: contain;
}
.l-header .header-btn a + a {
  margin-left: 5px;
}
@media screen and (max-width: 1024px) {
  .l-header .header-btn a + a {
    margin-left: 0;
    margin-top: 20px;
  }
}
.l-header .header-nav {
  padding-top: 8px;
  display: flex;
  /* Stage D 修正(150): メニュー項目が末尾改行されて崩れる問題を修正
   *   原因: 各 a に padding: 0 2em (≒ 52px) が左右に効いていたため
   *         6 項目 + ロゴ用 250px 確保で領域を超え、最後の項目が折り返していた。
   *   対応: 左揃え + flex-start で左から並べ、各 a の余白を縮小、
   *         white-space: nowrap で改行を防止。
   */
  justify-content: flex-start;
  flex-wrap: nowrap;
  padding-left: 0;
}
@media screen and (max-width: 1024px) {
  .l-header .header-nav {
    display: block;
    height: auto;
    width: 72.16vw;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0 60px;
  }
}
.l-header .header-nav li {
  position: relative;
}
.l-header .header-nav li a {
  display: block;
  font-size: 13px;
  font-weight: 600;
  line-height: 2.3;
  letter-spacing: 0.01em;
  /* Stage D 修正(150): 2em → 0.9em に縮小、改行禁止 */
  padding: 0 0.9em;
  white-space: nowrap;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .l-header .header-nav li a {
    font-size: 14px;
    padding: 0.4em 0;
    text-align: center;
    white-space: normal;
    border-bottom: #666666 dashed 1px;
  }
}
.l-header .header-nav li::after {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  content: "";
  width: 1px;
  height: 19px;
  background: #dedede;
}
@media screen and (max-width: 1024px) {
  .l-header .header-nav li::after {
    content: none;
  }
}
.l-header .header-nav li:last-child::after {
  content: none;
}
.l-header .header-nav li {
  /* Stage D 修正(150): 最初の項目はさらに左寄せのため左 padding をゼロに */
}
.l-header .header-nav li:first-child a {
  padding-left: 0;
}

.js-sp-menubtn {
  display: none;
}

@media screen and (max-width: 1024px) {
  .js-sp-menubtn {
    display: block;
    width: 60px;
    height: 60px;
    position: relative;
    border: none;
    background: none;
    cursor: pointer;
    z-index: 1000;
  }
  .js-sp-menubtn span {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 100%;
    width: 22px;
    height: 3px;
    background: #222222;
    position: absolute;
    transition: 0.2s;
    left: 50%;
    top: 50%;
  }
  .js-sp-menubtn span:nth-child(1) {
    transform: translate(-50%, -9px);
  }
  .js-sp-menubtn span:nth-child(2) {
    transform: translate(-50%, -50%);
  }
  .js-sp-menubtn span:nth-child(3) {
    transform: translate(-50%, 6px);
  }
  .js-sp-menubtn.is-active span {
    width: 25px;
    height: 2px;
  }
  .js-sp-menubtn.is-active span:nth-child(1) {
    transform: translate(-50%, 50%) rotate(45deg);
  }
  .js-sp-menubtn.is-active span:nth-child(2) {
    opacity: 0;
    left: 50%;
  }
  .js-sp-menubtn.is-active span:nth-child(3) {
    transform: translate(-50%, 50%) rotate(-45deg);
  }
}
.user-head {
  width: 100%;
  height: 34px;
  background: #333333;
}
.user-head__inner {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .user-head__inner {
    padding: 0 3%;
  }
}
@media screen and (max-width: 768px) {
  .user-head__inner {
    padding: 0 5%;
  }
}
.user-head__text {
  font-size: 14px;
  color: #fff;
  line-height: 34px;
}
.user-head__menu {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.user-head__nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 25px;
}
@media screen and (max-width: 768px) {
  .user-head__nav {
    display: none;
  }
}
.user-head__nav li {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
}
.user-head__nav li .pc-toggle {
  color: #fff;
  font-weight: bold;
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
}
.user-head__nav {
  /* PC：ホバーでサブメニュー表示 */
}
@media (min-width: 769px) {
  .user-head__nav .has-child {
    position: relative;
  }
  .user-head__nav .user-child {
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    background: #555555;
    min-width: 200px;
    z-index: 10;
    /* Stage D 修正(142): 長いドロップダウン (管理者の37項目等) で
     * 縦溢れしないよう、ビューポート 70% を上限としたスクロール領域に。 */
    max-height: 70vh;
    overflow-y: auto;
    /* ホバーから外れたままドロップダウンに触れに行く際の隙間を埋めるための
     * "ホバーブリッジ" を疑似要素で確保 (top の 5px 隙間で消えないように) */
  }
  .user-head__nav .user-child::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    right: 0;
    height: 5px;
  }
  .user-head__nav .user-child {
    /* スクロールバーの見た目を控えめに */
  }
  .user-head__nav .user-child::-webkit-scrollbar {
    width: 8px;
  }
  .user-head__nav .user-child::-webkit-scrollbar-track {
    background: #444;
  }
  .user-head__nav .user-child::-webkit-scrollbar-thumb {
    background: #777;
    border-radius: 4px;
    border: 1px solid #444;
  }
  .user-head__nav .user-child {
    scrollbar-width: thin;
    scrollbar-color: #777 #444;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
  }
  .user-head__nav .user-child[hidden] {
    display: block;
  }
  .user-head__nav .user-child li a {
    display: block;
    font-weight: normal;
    padding: 8px 22px 8px 10px;
    border-top: #666666 solid 1px;
    position: relative;
    white-space: nowrap;
    font-size: 13px;
  }
  .user-head__nav .user-child li a::after {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    content: "";
    width: 0;
    height: 0;
    border-width: 4px 0 4px 6px;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
  }
  .user-head__nav .user-child li a:hover {
    background: #6b6b6b;
  }
  .user-head__nav .has-child:hover > .user-child {
    opacity: 1;
    visibility: visible;
  }
}
.user-head__more {
  margin-left: 25px;
}
.user-head__more .js-menu-toggle {
  outline: none;
  background: none;
  border: none;
  cursor: pointer;
}
.user-head .pc-more-menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: #555555;
  min-width: 180px;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .user-head .pc-more-menu {
    display: none;
  }
}
.user-head .pc-more-menu li a {
  display: block;
  color: #fff;
  font-weight: bold;
  padding: 8px 5px 8px 10px;
  border-top: #666666 solid 1px;
  position: relative;
}
.user-head .pc-more-menu li a::after {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-width: 4px 0 4px 6px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
}
.user-head .sp-more-menu {
  width: 100%;
  padding: 30px;
  background: #555555;
  position: relative;
  z-index: 10;
}
@media (min-width: 769px) {
  .user-head .sp-more-menu {
    display: none;
  }
}
.user-head .sp-more-menu li a {
  display: block;
  color: #fff;
  font-weight: bold;
  padding: 8px 5px 8px 10px;
  border-top: #666666 solid 1px;
  position: relative;
}
.user-head .sp-more-menu li a::after {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-width: 4px 0 4px 6px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
}
.user-head .sp-more-menu li .sp-toggle {
  display: block;
  width: 100%;
  height: 36px;
  font-size: 12px;
  line-height: 36px;
  text-align: left;
  padding-left: 10px;
  color: #fff;
  font-weight: bold;
  outline: none;
  background: none;
  border: none;
  cursor: pointer;
  position: relative;
}
.user-head .sp-more-menu li .sp-toggle::before {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 11px;
  height: 1px;
  content: "";
  background: #fff;
  transform: translateY(-50%);
}
.user-head .sp-more-menu li .sp-toggle::after {
  position: absolute;
  top: 50%;
  right: 11px;
  width: 11px;
  height: 1px;
  content: "";
  background: #fff;
  transform: rotate(90deg) translateY(-50%);
}
.user-head .sp-more-menu li.has-child {
  color: #fff;
  font-weight: bold;
  border-top: #666666 solid 1px;
  position: relative;
}
.user-head .sp-more-menu li.has-child .sp-child li {
  padding-left: 10px;
}

/* footer */
/* Stage D 修正(131): フッタを案 N8 (ライトネイビー × クリア) に切替
 *   元に戻す場合は git revert HEAD で元の Site Blue (#0078d7) フッタへ復帰可能。
 *   背景: 2c5282 → 1e3a8a の縦グラデ (やや明るめネイビー)
 *   見出し: 白
 *   ボタン: 白背景 + ネイビー文字 (クリーン&ハイコントラスト)
 *   コピーライト: 深ネイビー #172554
 */
.l-footer {
  width: 100%;
  background: linear-gradient(180deg, #2c5282 0%, #1e3a8a 100%);
}
.l-footer__container {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  padding: 15px 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__container {
    max-width: 100%;
    padding: 15px 5%;
  }
}
.l-footer .footer-lead {
  /* Stage D 修正(131): N8 — リード文を非常に明るい青で */
  color: #ebf4ff;
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .l-footer .footer-lead {
    margin-bottom: 3.906vw;
  }
}
.l-footer__wrap {
  /* Stage D 修正(123): 横並び (nav 左 / access 右) → 縦並び (nav 上 / access 下) に変更 */
  display: block;
}
@media screen and (max-width: 768px) {
  .l-footer__wrap {
    gap: 30px;
  }
}
.l-footer__wrap .footer-access {
  /* Stage D 修正(131): N8 — テキスト色を薄青に */
  color: #bee3f8;
  width: 100%;
  margin-top: 32px;
  padding-top: 20px;
  border-top: rgba(255, 255, 255, 0.2) solid 1px;
}
@media screen and (max-width: 1024px) {
  .l-footer__wrap .footer-access {
    margin-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-footer__wrap .footer-access {
    margin-right: 0;
    margin-top: 24px;
  }
}
.l-footer__wrap .btn-contact {
  margin-top: 10px;
  display: inline-block;
  min-width: 157px;
  height: 30px;
  text-align: center;
  /* Stage D 修正(131): N8 — 白背景の CTA ボタン (ハイコントラスト) */
  background: #fff;
  border-radius: 5px;
  padding: 0 1em;
}
.l-footer__wrap .btn-contact span {
  display: inline-block;
  /* Stage D 修正(131): N8 — 文字色をネイビーに変更 (白背景に対する高コントラスト) */
  color: #1e3a8a;
  font-size: 12px;
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 0.025em;
  padding-right: 17px;
  position: relative;
}
.l-footer__wrap .btn-contact span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 14px;
  height: 9px;
  background: url(../../img/v2/common/icon_letter.svg) no-repeat;
  background-size: contain;
  /* Stage D 修正(131): N8 — アイコンもネイビーになるよう色フィルタ */
  filter: brightness(0) saturate(100%) invert(13%) sepia(57%) saturate(2475%) hue-rotate(220deg) brightness(94%) contrast(91%);
}
.l-footer__wrap .footer-nav ul {
  display: grid;
  grid-auto-flow: column;
  /* PC: 5 行 × 自動列 (20 項目で 4 列)、行間/列間も広めに */
  grid-template-rows: repeat(5, auto);
  gap: 10px 50px;
}
@media screen and (max-width: 1024px) {
  .l-footer__wrap .footer-nav ul {
    grid-template-rows: repeat(7, auto);
    gap: 8px 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-footer__wrap .footer-nav ul {
    grid-template-rows: repeat(10, auto);
    gap: 6px 20px;
  }
}
.l-footer__wrap .footer-nav ul li a {
  color: #fff;
  display: inline-block;
  padding: 3px 0;
  line-height: 1.45;
}
.l-footer__wrap {
  /* Stage D 修正(55): カテゴリ別 4 カラムフッタ
   * Stage D 修正(122): footer-access を 320px に縮めた分カラム幅を拡大、列間も 36 → 28 に詰める
   * Stage D 修正(123): access を下段に移動したのでフル幅で 4 カラム、margin-left は不要 */
}
.l-footer__wrap .footer-nav.footer-nav--grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px 32px;
  margin-left: 0;
}
@media screen and (max-width: 1024px) {
  .l-footer__wrap .footer-nav.footer-nav--grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 28px;
    margin-left: 0;
    margin-top: 10px;
  }
}
@media screen and (max-width: 768px) {
  .l-footer__wrap .footer-nav.footer-nav--grid {
    grid-template-columns: 100%;
    gap: 14px;
    margin-left: 0;
    margin-top: 6px;
  }
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__col {
  /* grid 直下のカラム単位なので ul の grid を解除 */
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__col ul {
  display: block;
  grid-template-rows: none;
  gap: 0;
  margin: 0;
  padding: 0;
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__col ul li {
  list-style: none;
  /* Stage D 修正(122): 行間を +4px (4 → 8) */
  margin: 8px 0;
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__col ul li a {
  /* Stage D 修正(131): N8 — リンク文字色を薄青、hover で白 */
  color: #c3dafe;
  display: inline-block;
  padding: 3px 0;
  line-height: 1.45;
  font-size: 13px;
  text-decoration: none;
  opacity: 0.95;
  transition: opacity 0.15s ease, color 0.15s ease, text-decoration 0.15s ease;
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__col ul li a:hover {
  opacity: 1;
  color: #fff;
  text-decoration: underline;
}
.l-footer__wrap .footer-nav.footer-nav--grid .footer-nav__head {
  /* Stage D 修正(131): N8 — 見出しは白、border は白の透過、若干サイズダウン */
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.05em;
  margin: 0 0 8px;
  padding-bottom: 6px;
  border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
}
.l-footer .copyright {
  width: 100%;
  height: 43px;
  line-height: 43px;
  /* Stage D 修正(131): N8 — コピーライト帯を深ネイビーに、文字色は薄青 */
  color: #bee3f8;
  text-align: center;
  background: #172554;
}
@media screen and (max-width: 768px) {
  .l-footer .copyright {
    height: 5.599vw;
    line-height: 5.599vw;
    font-size: 1.563vw;
  }
}

/* base */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  color: var(--base_color);
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "‘MS PGothic", arial, helvetica, sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.66;
  position: relative;
  margin: 0;
  padding: 0;
  font-feature-settings: "palt";
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}

a {
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: 0.3s;
}

img {
  width: 100%;
}

/* common */
:root {
  --base_color: #505050;
  --site_blue: #0078d7;
  --site_pink: #f57db4;
  /* Stage D 修正(129): 簡体字向け 中国語 UI フォントスタック
   * Hiragino / Meiryo は日本語字形 (康熙繁体に近い) で中国語を描画してしまうため
   * 中国語を主とする UI (講師サイドバー等) には Chinese system font を優先させる。
   *   - macOS: PingFang SC (萍方-簡体)
   *   - Windows: Microsoft YaHei UI / 微软雅黑
   *   - Linux/Android: Hiragino Sans GB (中文化 Hiragino) / Noto Sans SC
   */
  --font-zh:
      -apple-system, BlinkMacSystemFont,
      'PingFang SC', 'Microsoft YaHei UI', 'Microsoft YaHei', '微软雅黑',
      'Hiragino Sans GB', 'Source Han Sans SC', 'Noto Sans SC', 'Noto Sans CJK SC',
      'Heiti SC', sans-serif;
  /* Stage D 修正(137): 日本語優先 + 中国語フォールバック スタック
   *   - 評価メッセージなど「日本語が主、ところどころ中国語の単語が混じる」UI 向け
   *   - 日本語フォント (Hiragino / Meiryo) を優先するため、共通の漢字は日本語字形で描画
   *   - Hiragino / Meiryo にないグリフ (簡体字専用文字 例: 们/这/欢/讲/师) は
   *     後段の中国語フォントへフォールバックして描画される
   */
  --font-ja-zh:
      'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',
      Meiryo, メイリオ, Osaka, 'MS PGothic',
      'PingFang SC', 'Microsoft YaHei UI', 'Microsoft YaHei', '微软雅黑',
      'Hiragino Sans GB', 'Noto Sans CJK JP', 'Noto Sans CJK SC',
      arial, helvetica, sans-serif;
}

/* Stage D 修正(129): 中国語 UI 用ユーティリティクラス
 *   要素に .lang-zh を付けると、その配下を簡体字向け font に切替。 */
.lang-zh {
  font-family: var(--font-zh);
  /* 中国語は日本語より少し詰まって見えがちなので僅かに字間を空ける */
  letter-spacing: 0.02em;
}

/* Stage D 修正(129): 講師向けページのメインコンテンツも中国語フォントへ
 *   main_class が tutors_xxx / tutor_xxx 形式のページは中国語 UI なので一括適用。
 *   admins_check_tutors_xxx 等の管理画面 (admins_ プレフィックス) は対象外。 */
main[class^=tutors_],
main[class^=tutor_] {
  font-family: var(--font-zh);
}

/* =============================================================
 * Stage D 修正(166): リード文 (__lead) のフォントを一括拡大
 *   修正(165) で /questions/post の .toCompany-form__lead を 14px に
 *   拡大したのと同じ仕様を、サイト全体の「クラス名が __lead で終わる
 *   要素」に一括適用。
 *
 *   属性セレクタ [class$="__lead"] の specificity は (0,1,0) のため、
 *   既存の親スコープ付き宣言 (.foo .bar__lead {...} → 0,2,0) が
 *   font-size を明示している場合はそちらが優先される (= 既存の
 *   .lottery__lead や .users-news__lead の値は維持される)。
 *
 *   font-size 未指定だった base 12px のリード文 32 箇所のみが、
 *   このルールにより 14px / line-height 1.85 にアップ。
 * ============================================================= */
[class$=__lead] {
  font-size: 14px;
  line-height: 1.85;
}
@media screen and (max-width: 768px) {
  [class$=__lead] {
    font-size: 13.5px;
  }
}

/* Stage D 修正(136): 評価メッセージは中国語混じりが多いので中国語フォントを優先
 *   - トップページ「ご利用者様の評価メッセージ」(.home-evaluate__box .message)
 *   - 講師プロフィール「最新100件」(.tutor-profile .evaluate-list .message
 *     および show_the_tutor.ctp の .evaluate .message)
 *   いずれもユーザー投稿テキストで、中国語の引用・成語などが頻出するため
 *   日本語字形より中国語字形のほうが読みやすい。
 *
 * Stage D 修正(137): 主体が日本語だったため Chinese-first だと日本語が崩れる問題を修正
 *   --font-zh (中国語優先) → --font-ja-zh (日本語優先 + 中国語フォールバック) に変更
 *   - 日本語の漢字・かな : Hiragino / Meiryo で描画 (読みやすい)
 *   - 中国語専用文字 (们/这/欢/讲/师 等) : Hiragino/Meiryo に無いので
 *     Chinese font (PingFang SC / Microsoft YaHei) に自動フォールバック
 *   letter-spacing は外す (日本語に対しては不要)
 */
.home-evaluate__box li .message,
.evaluate-list li .message,
.evaluate .evaluate-list li .message {
  font-family: var(--font-ja-zh);
}

.u-sp-show {
  display: none !important;
}

.u-sp-hide {
  display: block !important;
}

@media screen and (max-width: 768px) {
  .u-sp-show {
    display: block !important;
  }
  .u-sp-hide {
    display: none !important;
  }
}
.u-text-left {
  text-align: left !important;
}

.u-text-right {
  text-align: right !important;
}

.u-text-center {
  text-align: center !important;
}

.u-font-bold {
  font-weight: 700 !important;
}

.u-underline {
  text-decoration: underline;
}

.u-text-blue {
  color: var(--site_blue);
}

.u-text-pink {
  color: var(--site_pink);
}

.u-text-red {
  color: #de2246;
}

.u-text-paleblue {
  color: #3fa9f5;
}

.fz-12 {
  font-size: 12px;
}

.fz-14 {
  font-size: 14px;
}

.fz-16 {
  font-size: 16px;
}

.fz-18 {
  font-size: 18px;
}

.fz-20 {
  font-size: 20px;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

a {
  transition: 0.3s;
}

a:hover {
  opacity: 0.7;
}

sup {
  font-size: 0.4em;
}

.l-section {
  width: 100%;
}
.l-section__inner {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .l-section__inner {
    padding: 0 3%;
  }
}
@media screen and (max-width: 768px) {
  .l-section__inner {
    padding: 0 5%;
  }
}

#page-top {
  position: fixed;
  right: 140px;
  bottom: 205px;
  display: block;
  width: 52px;
  height: 52px;
  z-index: 999;
}
@media screen and (max-width: 1024px) {
  #page-top {
    right: 3%;
    width: 6.771vw;
    height: 6.771vw;
  }
}
@media screen and (max-width: 768px) {
  #page-top {
    right: 5%;
  }
}

.c-heading2 {
  padding-top: 60px;
  padding-bottom: 15px;
  position: relative;
  color: var(--site_blue);
  font-size: 36px;
  font-weight: bold;
  white-space: nowrap;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .c-heading2 {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 768px) {
  .c-heading2 {
    padding-top: 40px;
    padding-bottom: 10px;
    font-size: 22px;
    line-height: 1.2;
  }
}
.c-heading2 span {
  color: var(--site_pink);
  font-size: 44px;
}
@media screen and (max-width: 1024px) {
  .c-heading2 span {
    font-size: 4.4vw;
  }
}
@media screen and (max-width: 768px) {
  .c-heading2 span {
    font-size: 26px;
  }
}
.c-heading2::before {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  content: "";
}
.c-heading2::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 117px;
  height: 3px;
  background: url(../../img/v2/home/title_underline.svg) no-repeat;
  background-size: contain;
}

.c-heading3 {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .c-heading3 {
    font-size: 14px;
  }
}
.c-heading3.icon_check::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}

.c-btn-more {
  text-align: center;
}
.c-btn-more a {
  display: inline-block;
  text-align: center;
  min-width: 260px;
  height: 37px;
  padding: 0 1em;
  background: url(../../img/v2/home/btn_more_bg.png) left center no-repeat;
  background-size: auto 100%;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .c-btn-more a {
    min-width: 26vw;
    height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .c-btn-more a {
    min-width: auto;
    height: auto;
    padding: 0.5em 1.5em;
  }
}
.c-btn-more a span {
  display: inline-block;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 37px;
  padding-right: 22px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .c-btn-more a span {
    font-size: 1.6vw;
    line-height: 3.7vw;
    padding-right: 2.2vw;
  }
}
@media screen and (max-width: 768px) {
  .c-btn-more a span {
    font-size: 14px;
    line-height: 1.4;
    padding-right: 22px;
  }
}
.c-btn-more a span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 16px;
  height: 11px;
  background: url(../../img/v2/common/icon_more.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .c-btn-more a span::after {
    width: 1.6vw;
    height: 1.1vw;
  }
}
@media screen and (max-width: 768px) {
  .c-btn-more a span::after {
    width: 2.083vw;
    height: 1.432vw;
  }
}
@media screen and (max-width: 500px) {
  .c-btn-more a span::after {
    width: 3.2vw;
    height: 2.2vw;
  }
}

.c-btn-01 {
  text-align: center;
}
.c-btn-01 a {
  display: inline-block;
  text-align: center;
  min-width: 290px;
  height: 37px;
  padding: 0 1em;
  background: url(../../img/v2/home/btn_more_bg.png) left center no-repeat;
  background-size: auto 100%;
  border-radius: 3px;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .c-btn-01 a {
    min-width: 26vw;
    height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .c-btn-01 a {
    min-width: 260px;
    height: auto;
    padding: 0.5em 1.5em;
  }
}
.c-btn-01 a span {
  display: inline-block;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 37px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .c-btn-01 a span {
    font-size: 1.6vw;
    line-height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .c-btn-01 a span {
    font-size: 14px;
    line-height: 1.4;
  }
}

.hero {
  width: 100%;
  border-top: #ebebeb solid 1px;
  border-bottom: #ebebeb solid 1px;
}
.hero .hero__slider {
  width: 100%;
}
.hero .hero__slideItem {
  width: 100%;
  aspect-ratio: 1280/500;
}
.hero .hero__slideItem .inner {
  max-width: 1000px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .inner {
    max-width: 100%;
    height: 100%;
  }
}
.hero .hero__slideItem._01 {
  background: url(../../img/v2/home/hero_img_01.png) no-repeat;
  background-size: 100% auto;
}
.hero .hero__slideItem._02 {
  background: url(../../img/v2/home/hero_img_02.png) no-repeat;
  background-size: cover;
}
.hero .hero__slideItem._02 .hero__text::after {
  position: absolute;
  top: -24px;
  right: -25px;
  content: "";
  width: 51px;
  height: 48px;
  background: url(../../img/v2/home/icon_clock.svg) no-repeat;
  background-size: contain;
}
.hero .hero__slideItem._03 {
  background: url(../../img/v2/home/hero_img_03.png) no-repeat;
  background-size: cover;
}
.hero .hero__slideItem._03 .hero__text::after {
  position: absolute;
  top: -24px;
  right: -25px;
  content: "";
  width: 51px;
  height: 48px;
  background: url(../../img/v2/home/icon_clock.svg) no-repeat;
  background-size: contain;
}
.hero .hero__slideItem._04 {
  background: url(../../img/v2/home/hero_img_04.png) no-repeat;
  background-size: cover;
}
.hero .hero__slideItem .hero__text {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__text {
    top: 50%;
    left: 5%;
    transform: translateY(-50%);
  }
}
.hero .hero__slideItem .hero__text p {
  color: var(--site_blue);
  line-height: 1.15;
}
.hero .hero__slideItem .hero__text p .text_upper {
  display: block;
  font-size: 32px;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__text p .text_upper {
    font-size: 3.2vw;
  }
}
.hero .hero__slideItem .hero__text p .text_lower {
  display: inline-block;
  font-size: 47.5px;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__text p .text_lower {
    font-size: 4.75vw;
  }
}
.hero .hero__slideItem .hero__text p .fz-40 {
  font-size: 40px;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__text p .fz-40 {
    font-size: 4vw;
  }
}
.hero .hero__slideItem .hero__text p .fz-57 {
  font-size: 57px;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__text p .fz-57 {
    font-size: 5.7vw;
  }
}
.hero .hero__slideItem .hero__btn {
  display: block;
  text-align: center;
  min-width: 424px;
  height: 55px;
  padding: 0 1em;
  background: url(../../img/v2/home/hero_btn_bg.png) left center no-repeat;
  background-size: auto 100%;
  border-radius: 3px;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__btn {
    min-width: 42.4vw;
    height: 5.5vw;
  }
}
.hero .hero__slideItem .hero__btn span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  line-height: 55px;
  padding-right: 30px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__btn span {
    font-size: 2.6vw;
    line-height: 5.5vw;
    padding-right: 3vw;
  }
}
.hero .hero__slideItem .hero__btn span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 21px;
  height: 20px;
  background: url(../../img/v2/common/icon_pencil.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem .hero__btn span::after {
    width: 2.1vw;
    height: 2vw;
  }
}
.hero .hero__slideItem._01 .hero__text::after {
  position: absolute;
  top: -24px;
  right: -25px;
  content: "";
  width: 51px;
  height: 48px;
  background: url(../../img/v2/home/icon_clock.svg) no-repeat;
  background-size: contain;
}
.hero .hero__slideItem._01 {
  /* Stage D 修正(152): 1 枚目のボタンも 2/3 枚目と同じグラデーション仕様に */
}
.hero .hero__slideItem._01 .hero__btn {
  background: linear-gradient(135deg, #0066c2 0%, #2196f3 60%, #64b5f6 100%);
  box-shadow: 0 6px 16px rgba(0, 102, 194, 0.4);
  transition: filter 0.2s, transform 0.12s;
}
.hero .hero__slideItem._01 .hero__btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.hero .hero__slideItem._02 .hero__text::after {
  position: absolute;
  top: -24px;
  right: -25px;
  content: "";
  width: 51px;
  height: 48px;
  background: url(../../img/v2/home/icon_clock.svg) no-repeat;
  background-size: contain;
}
.hero .hero__slideItem._02 {
  /* Stage D 修正(151): 3 枚目に表示される _02 スライドのボタンをピンク系に */
}
.hero .hero__slideItem._02 .hero__btn {
  background: linear-gradient(135deg, #ec4899 0%, #f472b6 60%, #f9a8d4 100%);
  box-shadow: 0 6px 16px rgba(236, 72, 153, 0.35);
  transition: filter 0.2s, transform 0.12s;
}
.hero .hero__slideItem._02 .hero__btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.hero .hero__slideItem._03 .hero__text::after {
  position: absolute;
  top: -24px;
  right: -25px;
  content: "";
  width: 51px;
  height: 48px;
  background: url(../../img/v2/home/icon_clock_white.svg) no-repeat;
  background-size: contain;
}
.hero .hero__slideItem._03 .hero__text p {
  color: #fff;
}
.hero .hero__slideItem._03 {
  /* Stage D 修正(151): 2 枚目に表示される _03 スライドのボタンを紫系に */
}
.hero .hero__slideItem._03 .hero__btn {
  background: linear-gradient(135deg, #6d28d9 0%, #8b5cf6 60%, #a78bfa 100%);
  box-shadow: 0 6px 16px rgba(109, 40, 217, 0.4);
  transition: filter 0.2s, transform 0.12s;
}
.hero .hero__slideItem._03 .hero__btn:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.hero .hero__slideItem._04 .hero__text {
  position: absolute;
  top: 50%;
  right: 0;
  left: auto;
  transform: translateY(-50%);
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem._04 .hero__text {
    top: 50%;
    right: 5%;
    left: auto;
    transform: translateY(-50%);
  }
}
.hero .hero__slideItem._04 .hero__text p {
  color: #fff;
}
.hero .hero__slideItem._04 .hero__text p .text_upper {
  font-size: 47.5px;
}
@media screen and (max-width: 1024px) {
  .hero .hero__slideItem._04 .hero__text p .text_upper {
    font-size: 4.75vw;
  }
}
.hero .hero__slideItem._04 .hero__btn {
  padding-right: 0;
}
.hero .hero__slideItem._04 .hero__btn span::after {
  content: none;
}
.hero .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  z-index: 2;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .hero .slick-arrow {
    width: 5.208vw;
    height: 5.208vw;
  }
}
.hero .prev-arrow {
  left: 0;
}
.hero .next-arrow {
  right: 0;
}
.hero .slick-dots {
  bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  .hero .slick-dots {
    bottom: 1.953vw;
  }
}
.hero .slick-dots li {
  margin: 0 7px;
  width: 19px;
  height: 19px;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  .hero .slick-dots li {
    margin: 0 0.911vw;
    width: 2.474vw;
    height: 2.474vw;
  }
}
.hero .slick-dots li button:before {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 14px;
  height: 15px;
  background: url(../../img/v2/home/slider_dots_off.png) no-repeat;
  background-size: contain;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .hero .slick-dots li button:before {
    width: 1.823vw;
    height: 1.953vw;
  }
}
.hero .slick-dots li.slick-active button:before {
  width: 19px;
  height: 19px;
  background: url(../../img/v2/home/slider_dots_on.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .hero .slick-dots li.slick-active button:before {
    width: 2.474vw;
    height: 2.474vw;
  }
}
.hero .slick-dotted.slick-slider {
  margin-bottom: 0;
}

.campaign-slider {
  width: 85.625vw;
  margin: -50px auto 0;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .campaign-slider {
    margin-top: -10px;
  }
}
.campaign-slider .campaign-slideItem {
  margin: 0 3px;
  aspect-ratio: 360/189;
  position: relative;
}
.campaign-slider .campaign-slideItem a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.campaign-slider .campaign-slideItem.friend__bnr {
  background: url(../../img/v2/campaign/friend_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-slider .campaign-slideItem.friend__bnr .text_01 {
  position: absolute;
  top: 1.328vw;
  left: 50%;
  transform: translateX(-50%);
  font-size: 2.144vw;
  font-weight: bold;
  white-space: nowrap;
  -webkit-text-stroke-width: 0.781vw;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.friend__bnr .text_01 {
    top: 2.344vw;
    font-size: 2.995vw;
    -webkit-text-stroke-width: 0.911vw;
  }
}
.campaign-slider .campaign-slideItem.friend__bnr .color_01 {
  color: #009aff;
}
.campaign-slider .campaign-slideItem.friend__bnr .color_02 {
  color: #ff5d83;
}
.campaign-slider .campaign-slideItem.friend__bnr .color_03 {
  color: #22b573;
}
.campaign-slider .campaign-slideItem.friend__bnr .text_02 {
  position: absolute;
  top: 5.422vw;
  left: 4.078vw;
  color: #000000;
  font-size: 1.206vw;
  line-height: 1.2;
  transform: rotate(-10deg);
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.friend__bnr .text_02 {
    top: 8.724vw;
    left: 5.859vw;
    font-size: 1.693vw;
  }
}
.campaign-slider .campaign-slideItem.friend__bnr .text_03 {
  position: absolute;
  top: 8.538vw;
  left: 4.469vw;
  color: #d92a00;
  font-size: 1.988vw;
  font-weight: bold;
  line-height: 1.2;
  letter-spacing: -0.08em;
  transform: rotate(-10deg);
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.friend__bnr .text_03 {
    top: 12.76vw;
    left: 6.51vw;
    font-size: 2.865vw;
  }
}
.campaign-slider .campaign-slideItem.discount__bnr {
  background: url(../../img/v2/campaign/discount_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-slider .campaign-slideItem.discount__bnr .text_01 {
  text-align: center;
  position: absolute;
  top: 1.719vw;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.discount__bnr .text_01 {
    top: 2.604vw;
  }
}
.campaign-slider .campaign-slideItem.discount__bnr .text_01 span {
  display: inline-block;
  color: #000000;
  font-size: 1.563vw;
  font-weight: bold;
  padding: 0 1em;
  white-space: nowrap;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.discount__bnr .text_01 span {
    font-size: 2.214vw;
  }
}
.campaign-slider .campaign-slideItem.discount__bnr .text_01 span::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  height: 80%;
  width: 100%;
  background: linear-gradient(to bottom, transparent 50%, #fbe600 51%, #fbe600);
  z-index: -1;
}
.campaign-slider .campaign-slideItem.discount__bnr .text_02 {
  position: absolute;
  top: 5.903vw;
  left: 2.5vw;
  color: #fbdb00;
  font-size: 1.016vw;
  font-weight: bold;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.discount__bnr .text_02 {
    top: 8.594vw;
    left: 3.776vw;
    font-size: 1.432vw;
  }
}
.campaign-slider .campaign-slideItem.discount__bnr .text_03 {
  position: absolute;
  top: 5.859vw;
  left: 50%;
  transform: translateX(-50%);
  color: #0096ff;
  font-size: 3.672vw;
  font-weight: bold;
  -webkit-text-stroke-width: 0.781vw;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
  text-align: center;
  line-height: 0.8;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.discount__bnr .text_03 {
    top: 8.594vw;
    font-size: 5.339vw;
    -webkit-text-stroke-width: 0.911vw;
  }
}
.campaign-slider .campaign-slideItem.discount__bnr .text_03 span {
  font-size: 2.188vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.discount__bnr .text_03 span {
    font-size: 3.125vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr {
  background: url(../../img/v2/campaign/hsk_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_01 {
  position: absolute;
  top: 0.625vw;
  left: 0.625vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_01 {
    top: 0.911vw;
    left: 0.911vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_01 span {
  display: inline-block;
  color: #fff;
  font-size: 1.094vw;
  font-weight: bold;
  padding: 0 0.3em;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_01 span {
    font-size: 1.563vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_01 span::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  z-index: -1;
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_02 {
  position: absolute;
  top: 3.906vw;
  left: 50%;
  transform: translateX(-50%);
  color: #000;
  font-size: 1.719vw;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_02 {
    top: 5.729vw;
    font-size: 2.474vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_02 span {
  font-size: 2.813vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_02 span {
    font-size: 4.036vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_03 {
  position: absolute;
  top: 9.844vw;
  left: 0.625vw;
  color: #fff;
  font-size: 0.938vw;
  font-weight: bold;
  line-height: 1.2;
  letter-spacing: -0.05em;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_03 {
    top: 15vw;
    left: 0.911vw;
    font-size: 1.432vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_03 span {
  font-size: 1.563vw;
  letter-spacing: 0;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_03 span {
    font-size: 2.214vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_04 {
  position: absolute;
  top: 9.844vw;
  right: 0.625vw;
  color: #fff;
  font-size: 0.938vw;
  font-weight: bold;
  line-height: 1.2;
  text-align: right;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_04 {
    top: 15vw;
    right: 0.911vw;
    font-size: 1.432vw;
  }
}
.campaign-slider .campaign-slideItem.hsk__bnr .text_04 span {
  font-size: 1.563vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.hsk__bnr .text_04 span {
    font-size: 2.214vw;
  }
}
.campaign-slider .campaign-slideItem.returnees__bnr {
  background: url(../../img/v2/campaign/returnees_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_01 {
  position: absolute;
  top: 4.531vw;
  left: 7.813vw;
  color: #fff;
  font-size: 1.406vw;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.returnees__bnr .text_01 {
    top: 6.641vw;
    left: 11.458vw;
    font-size: 1.953vw;
  }
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_02 {
  position: absolute;
  top: 6.641vw;
  left: 7.813vw;
  font-size: 2.969vw;
  font-weight: bold;
  display: flex;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.returnees__bnr .text_02 {
    top: 10.026vw;
    left: 11.458vw;
    font-size: 4.297vw;
  }
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_02 span {
  display: block;
  width: 4.063vw;
  height: 4.063vw;
  text-align: center;
  line-height: 4.063vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.returnees__bnr .text_02 span {
    width: 5.859vw;
    height: 5.859vw;
    line-height: 5.859vw;
  }
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_02 span.color_01 {
  color: #fff;
  background: #7bb100;
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_02 span.color_02 {
  color: #7bb100;
  background: #fff;
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_02 span + span {
  margin-left: 3px;
}
.campaign-slider .campaign-slideItem.returnees__bnr .text_03 {
  position: absolute;
  top: 10.781vw;
  left: 8.984vw;
  color: #fff;
  font-size: 1.875vw;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.returnees__bnr .text_03 {
    top: 16.276vw;
    left: 13.151vw;
    font-size: 2.734vw;
  }
}
.campaign-slider .campaign-slideItem.text__bnr {
  background: url(../../img/v2/campaign/text_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-slider .campaign-slideItem.text__bnr .text_01 {
  position: absolute;
  top: 2.734vw;
  left: 2.5vw;
  color: #fff;
  font-size: 1.094vw;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.text__bnr .text_01 {
    top: 3.906vw;
    left: 3.646vw;
    font-size: 1.563vw;
  }
}
.campaign-slider .campaign-slideItem.text__bnr .text_01 .color_01 {
  color: #ffdd42;
}
.campaign-slider .campaign-slideItem.text__bnr .text_01 .color_02 {
  color: #000;
}
.campaign-slider .campaign-slideItem.text__bnr .text_01 .rotate {
  display: inline-block;
  margin-left: 0.2em;
  transform: rotate(10deg);
}
.campaign-slider .campaign-slideItem.text__bnr .text_02 {
  position: absolute;
  top: 7.266vw;
  left: 50%;
  transform: translateX(-50%);
  color: #0095d1;
  font-size: 2.188vw;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  -webkit-text-stroke-width: 10px;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.text__bnr .text_02 {
    top: 11.068vw;
    font-size: 3.125vw;
    -webkit-text-stroke-width: 0.911vw;
  }
}
.campaign-slider .campaign-slideItem.text__bnr .text_02 span {
  font-size: 2.656vw;
}
@media screen and (max-width: 768px) {
  .campaign-slider .campaign-slideItem.text__bnr .text_02 span {
    font-size: 3.776vw;
  }
}
.campaign-slider .campaign-slideItem a {
  opacity: 1;
}
.campaign-slider .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 100%;
  z-index: 2;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .campaign-slider .slick-arrow {
    width: 4.167vw;
  }
}
.campaign-slider .prev-arrow {
  left: -35px;
}
@media screen and (max-width: 768px) {
  .campaign-slider .prev-arrow {
    left: -4.557vw;
  }
}
.campaign-slider .next-arrow {
  right: -35px;
}
@media screen and (max-width: 768px) {
  .campaign-slider .next-arrow {
    right: -4.557vw;
  }
}

/* #news */
.home-news {
  padding: 40px 0 30px;
  width: 100%;
  background: url(../../img/v2/home/news_bg_01.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .home-news {
    background-position: right 5% top;
  }
}
.home-news .c-heading2.home-news__head::before {
  width: 45px;
  height: 43px;
  background: url(../../img/v2/home/news_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-news .c-heading2.home-news__head::before {
    width: 30px;
    height: 28px;
  }
}
.home-news__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .home-news__lead {
    width: 100%;
  }
}
.home-news__contents {
  /* Stage D 修正(179): スクールからのお知らせ枠を PC でやや広く (600 → 820px) */
  width: 820px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .home-news__contents {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .home-news__contents {
    width: 100%;
  }
}
.home-news__contents ul {
  width: 100%;
  background: #fff;
  border: #f5b4c3 solid 6px;
  border-radius: 7px;
  padding: 1em 30px;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .home-news__contents ul {
    padding: 1em;
  }
}
.home-news__contents ul li {
  width: 100%;
  padding: 0.8em 0 0.5em 1.5em;
  border-bottom: #e2e2e2 solid 1px;
}
@media screen and (max-width: 768px) {
  .home-news__contents ul li {
    padding: 0.5em;
  }
}
.home-news__contents ul li a {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  font-size: 14px;
  line-height: 1.28;
}
@media screen and (max-width: 768px) {
  .home-news__contents ul li a {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto;
    grid-template-areas: "a b c" "d d d";
    place-items: center;
  }
}
.home-news__contents ul li a span {
  display: block;
}
.home-news__contents ul li a span.date {
  font-weight: 600;
  width: 120px;
  padding-right: 2em;
}
@media screen and (max-width: 768px) {
  .home-news__contents ul li a span.date {
    grid-area: a;
    padding: 0.5em 0;
  }
}
.home-news__contents ul li a span.title {
  /* Stage D 修正(180): ニュース枠拡大 (修正 179) に合わせて
   *   title の固定幅 300px を撤廃し flex: 1 で残スペースを占有。
   *   white-space: nowrap で 1 行表示、長すぎる場合は ... で省略。 */
  flex: 1;
  min-width: 0;
  width: auto;
  padding-right: 1em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 768px) {
  .home-news__contents ul li a span.title {
    grid-area: d;
    width: 100%;
    padding: 0 0 0.5em 0;
    /* SP は元の改行 OK 表示に戻す */
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}
@media screen and (max-width: 768px) {
  .home-news__contents ul li a span.new {
    grid-area: b;
    width: 54px;
  }
}
.home-news .c-btn-more {
  text-align: center;
}
.home-news .c-btn-more a {
  min-width: 260px;
}
@media screen and (max-width: 1024px) {
  .home-news .c-btn-more a {
    min-width: 26vw;
  }
}
@media screen and (max-width: 768px) {
  .home-news .c-btn-more a {
    min-width: auto;
  }
}

/* #about */
.home-about {
  padding: 40px 0 30px;
  width: 100%;
}
.home-about .c-heading2.home-about__head::before {
  width: 34px;
  height: 49px;
  background: url(../../img/v2/home/about_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-about .c-heading2.home-about__head::before {
    width: 22.6px;
    height: 32.6px;
  }
}
.home-about__lead {
  width: 687px;
  /* Stage D 修正(157): PC でも左寄せに変更 (中央寄せだと長文が読みにくいため)
   * Stage D 修正(172): home-about__lead はサイト全体の CTA メッセージなので
   *   フォントを大きめに (18px) + line-height 1.75 で目立たせる。
   *   .u-text-center が付与されているので text-align も中央に再上書き。 */
  text-align: center;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.75;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .home-about__lead {
    width: 100%;
    text-align: center;
    font-size: 16px;
  }
}
.home-about__fegure {
  width: 941px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .home-about__fegure {
    width: 100%;
  }
}
.home-about__detail {
  max-width: 687px;
  /* Stage D 修正(157): PC でも左寄せに変更 */
  text-align: left;
  font-weight: 600;
  margin: 1em auto;
}
@media screen and (max-width: 768px) {
  .home-about__detail {
    width: 100%;
    text-align: left;
  }
}

/* #feature */
.home-feature {
  padding: 40px 0 30px;
  width: 100%;
  background: url(../../img/v2/home/feature_bg_01.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .home-feature {
    background-position: center top;
  }
}
.home-feature .c-heading2.home-feature__head::before {
  width: 49px;
  height: 47px;
  background: url(../../img/v2/home/feature_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-feature .c-heading2.home-feature__head::before {
    width: 32.6px;
    height: 31.3px;
  }
}
.home-feature__lead {
  width: 687px;
  text-align: center;
  font-weight: 600;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .home-feature__lead {
    width: 100%;
    text-align: left;
  }
}
.home-feature__contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px 47px;
}
@media screen and (max-width: 768px) {
  .home-feature__contents {
    flex-direction: column;
    gap: 30px;
  }
}
.home-feature__contents .col {
  width: 302px;
}
@media screen and (max-width: 768px) {
  .home-feature__contents .col {
    width: 100%;
  }
}
.home-feature__contents .col .icon {
  display: block;
  width: 64px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .home-feature__contents .col .icon {
    width: 42px;
    padding-bottom: 10px;
  }
}
.home-feature__contents .col .title {
  height: 70px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .home-feature__contents .col .title {
    height: auto;
    padding-bottom: 10px;
  }
}
.home-feature__contents .col .title h3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* Stage D 修正(171): 見出しを 20 → 23px に拡大 */
  font-size: 23px;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .home-feature__contents .col .title h3 {
    position: static;
    transform: translate(0, 0);
    font-size: 20px;
  }
}
.home-feature__contents .col .title .txt-pink {
  color: var(--site_pink);
}
.home-feature__contents .col {
  /* Stage D 修正(169): 各カードの説明文 (.detail) フォントを拡大
   *   12px (base) → 14px、line-height 1.85 で 5 カードの可読性を統一。
   * Stage D 修正(171): もう少し見やすく 14 → 15px に再調整。 */
}
.home-feature__contents .col .detail {
  font-size: 15px;
  line-height: 1.85;
}
@media screen and (max-width: 768px) {
  .home-feature__contents .col .detail {
    font-size: 14px;
  }
}

/* #tutor */
.home-tutor {
  padding: 40px 0 30px;
  width: 100%;
}
.home-tutor .c-heading2.home-tutor__head::before {
  width: 33px;
  height: 49px;
  background: url(../../img/v2/home/tutor_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-tutor .c-heading2.home-tutor__head::before {
    width: 22px;
    height: 32.6px;
  }
}
.home-tutor__lead {
  width: 687px;
  text-align: center;
  font-weight: 600;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .home-tutor__lead {
    width: 100%;
    text-align: left;
  }
}
.home-tutor .rank {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  align-items: end;
  gap: 25px 14px;
  margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
  .home-tutor .rank {
    grid-template-columns: repeat(6, 1fr);
    justify-content: space-between;
    gap: 10px 10px;
  }
}
@media screen and (max-width: 768px) {
  .home-tutor .rank {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media screen and (max-width: 500px) {
  .home-tutor .rank {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (max-width: 374px) {
  .home-tutor .rank {
    grid-template-columns: repeat(3, 1fr);
  }
}
.home-tutor .rank .col {
  /* Stage D 修正(109): J15 デザインを適用
   *   - .no: 1-3 は王冠 PNG (64px)、4-8 は CSS テキスト
   *   - TOP3 写真にグラデリング (金/銀/銅)
   *   - 全写真を border-radius:50% で丸に
   *   元に戻すには本コミットを git revert HEAD で取り消し可能。
   */
}
.home-tutor .rank .col .no {
  display: block;
  width: 36px;
  margin: 0 auto;
}
.home-tutor .rank .col .no.num-text {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: auto;
  height: 24px;
  font-size: 13px;
  font-weight: 800;
  color: #555;
  line-height: 1;
  font-family: "Hiragino Sans", "Yu Gothic UI", sans-serif;
  letter-spacing: -0.02em;
  padding-bottom: 2px;
}
.home-tutor .rank .col:nth-child(1) .no, .home-tutor .rank .col:nth-child(2) .no, .home-tutor .rank .col:nth-child(3) .no {
  width: 64px;
}
.home-tutor .rank .col {
  /* Stage D 修正(111): 講師名を中央寄せ + 濃い青 (/tutors/show と同色)
   * Stage D 修正(112): 写真↔名前 / 名前↔星 に 2px の余白、星も中央寄せ
   * Stage D 修正(113): 余白を 2px → 4px に拡大
   */
}
.home-tutor .rank .col .name {
  margin: 0;
  padding-top: 4px;
  padding-bottom: 4px;
  font-size: 12px;
  line-height: 1.16;
  text-align: center;
  color: #1a3a72;
  font-weight: bold;
}
.home-tutor .rank .col .name a {
  color: #1a3a72;
  text-decoration: none;
}
.home-tutor .rank .col .name a:hover {
  text-decoration: underline;
}
.home-tutor .rank .col {
  /* Stage D 修正(112): 星評価を中央寄せ + 上下マージン調整 */
}
.home-tutor .rank .col .rating {
  display: block;
  width: 85px;
  height: 14px;
  margin: 0 auto;
  padding-bottom: 0;
}
@media screen and (max-width: 500px) {
  .home-tutor .rank .col .rating {
    width: 17vw;
    height: 2.8vw;
  }
}
.home-tutor .rank .col .rating.star-5 {
  background: url(../../img/v2/home/rank-5.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col .rating.star-4 {
  background: url(../../img/v2/home/rank-4.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col .rating.star-3 {
  background: url(../../img/v2/home/rank-3.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col .rating.star-2 {
  background: url(../../img/v2/home/rank-2.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col .rating.star-1 {
  background: url(../../img/v2/home/rank-1.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col .rating.star-0 {
  background: url(../../img/v2/home/rank-0.png) no-repeat;
  background-size: contain;
}
.home-tutor .rank .col figure {
  max-width: 110px;
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 50%;
}
.home-tutor .rank .col figure img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}
.home-tutor .rank .col {
  /* TOP3 写真にグラデリング (金/銀/銅) */
}
.home-tutor .rank .col.rank-1 figure {
  padding: 3px;
  background: linear-gradient(135deg, #d4a017, #f5d77a);
}
.home-tutor .rank .col.rank-2 figure {
  padding: 3px;
  background: linear-gradient(135deg, #9ea6ad, #d0d4da);
}
.home-tutor .rank .col.rank-3 figure {
  padding: 3px;
  background: linear-gradient(135deg, #cd7f32, #e8a865);
}
.home-tutor .rank .col.rank-1 figure img, .home-tutor .rank .col.rank-2 figure img, .home-tutor .rank .col.rank-3 figure img {
  border: 2px solid #fff;
}
.home-tutor .c-btn-more {
  text-align: center;
}
.home-tutor .c-btn-more a {
  min-width: 224px;
}
@media screen and (max-width: 1024px) {
  .home-tutor .c-btn-more a {
    min-width: 22.4vw;
  }
}
@media screen and (max-width: 768px) {
  .home-tutor .c-btn-more a {
    min-width: auto;
  }
}

/* #evaluate */
.home-evaluate {
  padding: 40px 0 30px;
  width: 100%;
  background: url(../../img/v2/home/evaluate_bg_01.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .home-evaluate {
    background-position: right 10% top;
  }
}
.home-evaluate .c-heading2.home-evaluate__head::before {
  width: 44px;
  height: 44px;
  background: url(../../img/v2/home/evaluate_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-evaluate .c-heading2.home-evaluate__head::before {
    width: 29.3px;
    height: 29.3px;
  }
}
.home-evaluate__lead {
  width: 687px;
  text-align: center;
  font-weight: 600;
  margin: 1.5em auto 2em;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__lead {
    width: calc(100% - 15vw);
    text-align: left;
    margin-right: 0;
  }
}
.home-evaluate__lead::after {
  position: absolute;
  top: -128px;
  left: -140px;
  content: "";
  width: 177px;
  height: 264px;
  background: url(../../img/v2/home/evaluate_img_01.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__lead::after {
    top: -5.8vw;
    left: -18vw;
    width: 17.7vw;
    height: 26.4vw;
  }
}
@media screen and (max-width: 768px) {
  .home-evaluate__lead::after {
    top: -2.604vw;
    left: -16.833vw;
  }
}
.home-evaluate__contents {
  width: 100%;
  position: relative;
  z-index: 1;
}
.home-evaluate__contents .total {
  display: inline-block;
  position: absolute;
  top: -45px;
  right: 20px;
  color: #0069af;
  font-size: 14px;
  font-weight: 600;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__contents .total {
    top: -25px;
    right: 0px;
  }
}
.home-evaluate__box {
  width: 100%;
}
.home-evaluate__box ul {
  width: 100%;
  background: #fff;
  border: #87b4e1 solid 6px;
  border-radius: 7px;
  padding: 10px 70px 22px;
  /* Stage D 修正(134): 50 件のレビューを枠内で自動スクロール
   *   最大高さを制限し overflow-y: auto でスクロールバーを常時表示
   *   JS (root.ctp 内) で 1px ずつ自動スクロール、hover で一時停止、
   *   ユーザーの手動スクロール時も停止 (3 秒後に再開)、最後まで到達
   *   したらトップに戻る。
   */
  max-height: 500px;
  overflow-y: auto;
  /* Stage D 修正(135): scroll-behavior: smooth を撤去
   *   自動スクロールで毎フレーム scrollTop を加算する際、smooth スクロール
   *   アニメーションが介入してしまい一切動かなくなる症状を修正。 */
  /* WebKit (Chrome/Safari/Edge) 用スクロールバー: 控えめな薄水色 */
}
.home-evaluate__box ul::-webkit-scrollbar {
  width: 10px;
}
.home-evaluate__box ul::-webkit-scrollbar-track {
  background: #f5fbff;
  border-radius: 5px;
}
.home-evaluate__box ul::-webkit-scrollbar-thumb {
  background: #87b4e1;
  border-radius: 5px;
  border: 2px solid #f5fbff;
}
.home-evaluate__box ul::-webkit-scrollbar-thumb:hover {
  background: #4a90d9;
}
.home-evaluate__box ul {
  /* Firefox 用 */
  scrollbar-width: thin;
  scrollbar-color: #87b4e1 #f5fbff;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__box ul {
    padding: 10px;
    max-height: 440px;
  }
}
@media screen and (max-width: 768px) {
  .home-evaluate__box ul {
    padding: 1em;
    max-height: 70vh;
  }
}
.home-evaluate__box ul li {
  padding: 1em 0.5em;
  border-bottom: #e2e2e2 solid 1px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .home-evaluate__box ul li {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
}
.home-evaluate__box ul li .row {
  display: flex;
  align-items: center;
  margin-right: 10px;
}
.home-evaluate__box ul li figure {
  /* Stage D 修正(133): 講師写真を丸く (講師一覧と統一)
   * Stage D 修正(154): 枠線をサイトピンク (--site_pink) に変更
   * Stage D 修正(155): 二重に見える違和感を解消するため
   *   外側の box-shadow リング (白 + 淡ピンク) を撤去。
   *   ピンクの単一枠線のみ残す。 */
  width: 80px;
  height: 80px;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #f5fbff;
  border: 3px solid var(--site_pink);
}
.home-evaluate__box ul li figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.home-evaluate__box ul li .col {
  width: 140px;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__box ul li .col {
    width: 150px;
  }
}
@media screen and (max-width: 768px) {
  .home-evaluate__box ul li .col {
    width: auto;
  }
}
.home-evaluate__box ul li .col .name {
  font-size: 16px;
  font-weight: 600;
}
.home-evaluate__box ul li .col .rating {
  display: block;
  width: 85px;
  height: 14px;
  padding-bottom: 10px;
}
.home-evaluate__box ul li .col .rating.star-5 {
  background: url(../../img/v2/home/rank-5.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .col .rating.star-4 {
  background: url(../../img/v2/home/rank-4.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .col .rating.star-3 {
  background: url(../../img/v2/home/rank-3.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .col .rating.star-2 {
  background: url(../../img/v2/home/rank-2.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .col .rating.star-1 {
  background: url(../../img/v2/home/rank-1.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .col .rating.star-0 {
  background: url(../../img/v2/home/rank-0.png) no-repeat;
  background-size: contain;
}
.home-evaluate__box ul li .message {
  width: 430px;
  margin-right: 3em;
  /* Stage D 修正(132): 評価メッセージを吹き出し風 (案 E2) に
   *   元に戻す場合は git revert HEAD で修正(131) 状態に復帰可能。
   *   左に三角矢印を配置し、講師写真側を指す形でレビューを「先生のコメント」風に見せる。
   * Stage D 修正(153): 文字が小さくて読みにくかったため font-size を底上げ。
   * Stage D 修正(173): 文字色を可読性の高い青に変更 (#1e40af)。 */
  background: #f0f7ff;
  border: 1px solid #cfe5fa;
  border-radius: 12px;
  padding: 14px 18px;
  position: relative;
  margin-left: 12px;
  font-size: 14px;
  line-height: 1.7;
  color: #1e40af;
}
.home-evaluate__box ul li .message::before {
  content: "";
  position: absolute;
  left: -11px;
  top: 18px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 12px 9px 0;
  border-color: transparent #cfe5fa transparent transparent;
}
.home-evaluate__box ul li .message::after {
  content: "";
  position: absolute;
  left: -9px;
  top: 19px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 10px 8px 0;
  border-color: transparent #f0f7ff transparent transparent;
}
@media screen and (max-width: 1024px) {
  .home-evaluate__box ul li .message {
    margin-right: 1em;
  }
}
@media screen and (max-width: 768px) {
  .home-evaluate__box ul li .message {
    margin-right: 0;
    margin-top: 1em;
    margin-bottom: 0.5em;
    margin-left: 0;
    width: 100%;
    /* SP では行が縦並びになるため、三角を「上向き」に変更して
     * 上に位置する 講師写真・名前 ブロックを指す形にする。 */
  }
  .home-evaluate__box ul li .message::before {
    left: 22px;
    top: -11px;
    border-width: 0 9px 12px 9px;
    border-color: transparent transparent #cfe5fa transparent;
  }
  .home-evaluate__box ul li .message::after {
    left: 23px;
    top: -9px;
    border-width: 0 8px 10px 8px;
    border-color: transparent transparent #f0f7ff transparent;
  }
}

/* #course */
.home-course {
  padding: 40px 0 30px;
  width: 100%;
}
.home-course .c-heading2.home-course__head::before {
  width: 49px;
  height: 39px;
  background: url(../../img/v2/home/course_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-course .c-heading2.home-course__head::before {
    width: 32.6px;
    height: 26px;
  }
}
.home-course__lead {
  width: 560px;
  /* Stage D 修正(172): PC でも左寄せに変更 */
  text-align: left;
  font-weight: 600;
  margin: 1.5em auto 2em;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  .home-course__lead {
    width: calc(100% - 23.438vw);
    text-align: left;
    margin-left: 0;
  }
}
@media screen and (max-width: 768px) {
  .home-course__lead {
    width: calc(100% - 23.438vw);
    text-align: left;
    margin-left: 0;
  }
}
.home-course__lead::after {
  position: absolute;
  top: -50px;
  right: -176px;
  content: "";
  width: 169px;
  height: 129px;
  background: url(../../img/v2/home/course_img_01.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .home-course__lead::after {
    top: -5vw;
    right: -22.6vw;
    width: 16.9vw;
    height: 12.9vw;
  }
}
@media screen and (max-width: 768px) {
  .home-course__lead::after {
    width: 22.005vw;
    height: 16.797vw;
  }
}
.home-course__contents .table-wrap {
  width: 100%;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .home-course__contents .table-wrap {
    /*overflow-x: scroll;*/
  }
}
.home-course__contents .table-01 {
  width: 100%;
  border-collapse: collapse;
}
@media screen and (max-width: 768px) {
  .home-course__contents .table-01 {
    /*width: 1000px;*/
  }
}
.home-course__contents .table-01 th,
.home-course__contents .table-01 td {
  padding: 10px 15px;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42;
  vertical-align: top;
}
.home-course__contents .table-01 th {
  background: #0078d7;
  color: #fff;
  /*white-space: nowrap;*/
  border-right: #fff solid 1px;
}
.home-course__contents .table-01 th:last-child {
  border-right: none;
}
.home-course__contents .table-01 td {
  border-right: #cee3fa solid 1px;
}
.home-course__contents .table-01 td:last-child {
  border-right: none;
}
.home-course__contents .table-01 tr:nth-child(even) {
  background: #eaf2fa;
}
.home-course__contents .table-01 tr:nth-child(odd) {
  background: #fafcff;
}
.home-course__contents .table-01 tr > td:nth-child(1),
.home-course__contents .table-01 tr > td:nth-child(2) {
  text-align: center;
  /*white-space: nowrap;*/
}
.home-course__contents .table-01 {
  /* Stage D 修正(176): PC のみ コース名 / 教材名 列を広げ、改行を抑制
   *   - 「中国語会話301句（上）（下）」「中級漢語口語（一）（二）（提高）」
   *     などが 1 行で収まるよう min-width + white-space: nowrap を指定。
   *   - その分 説明列 (col 3) は max-width を絞って詰める。
   *   - tab (≤1024px) 以下では既存の自動レイアウト・SP では col 3,4 非表示。 */
}
@media screen and (min-width: 1025px) {
  .home-course__contents .table-01 tr > th:nth-child(1),
  .home-course__contents .table-01 tr > td:nth-child(1) {
    width: 11.5em;
    white-space: nowrap;
  }
  .home-course__contents .table-01 tr > th:nth-child(2),
  .home-course__contents .table-01 tr > td:nth-child(2) {
    width: 18em;
    white-space: nowrap;
  }
  .home-course__contents .table-01 tr > th:nth-child(3),
  .home-course__contents .table-01 tr > td:nth-child(3) {
    max-width: 22em;
    /* 説明文は折り返し OK */
    word-break: normal;
  }
}
.home-course__contents .table-01 tr > td:nth-child(4) {
  width: 140px;
  padding: 5px 15px;
}
.home-course__contents .table-01 tr > td:nth-child(4) a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.home-course__contents .table-01 tr > td:nth-child(4) a img {
  width: 35px;
  height: auto;
  margin-right: 10px;
}
.home-course__contents .table-01 tr > td:nth-child(4) a p {
  color: #0069af;
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .home-course__contents .table-01 tr > th:nth-child(3),
  .home-course__contents .table-01 tr > th:nth-child(4),
  .home-course__contents .table-01 tr > td:nth-child(3),
  .home-course__contents .table-01 tr > td:nth-child(4) {
    display: none;
  }
}
.home-course__contents .note {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.42;
  text-align: center;
  margin: 20px auto 10px;
}
.home-course__contents .c-btn-more {
  text-align: center;
}
.home-course__contents .c-btn-more a {
  min-width: 292px;
}
@media screen and (max-width: 1024px) {
  .home-course__contents .c-btn-more a {
    min-width: 29.2vw;
  }
}
@media screen and (max-width: 768px) {
  .home-course__contents .c-btn-more a {
    min-width: auto;
  }
}
.home-course {
  /* Stage D 修正(177): C12 マガジン風レイアウト用
   *   - 各グループに大見出し (h3) + 説明 + テーブル
   *   - 大見出しは左の色付きバーで階層を表現
   *   - 3 グループ (総合 / ビジネス / その他) で色を変える */
}
.home-course .course-mag-section {
  margin-bottom: 28px;
}
@media screen and (max-width: 768px) {
  .home-course .course-mag-section {
    margin-bottom: 22px;
  }
}
.home-course .course-mag-section__head {
  font-size: 22px;
  font-weight: 900;
  color: #1e3a8a;
  margin: 0 0 6px;
  letter-spacing: 0.02em;
  line-height: 1.25;
}
@media screen and (max-width: 768px) {
  .home-course .course-mag-section__head {
    font-size: 18px;
  }
}
.home-course .course-mag-section__head::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 22px;
  background: #2563eb;
  margin-right: 10px;
  vertical-align: -3px;
}
@media screen and (max-width: 768px) {
  .home-course .course-mag-section__head::before {
    height: 18px;
  }
}
.home-course .course-mag-section__sub {
  color: #555;
  font-size: 13px;
  margin: 0 0 14px 16px;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  .home-course .course-mag-section__sub {
    margin-left: 12px;
    font-size: 12.5px;
  }
}
.home-course .course-mag-section {
  /* グループ別アクセント色 */
}
.home-course .course-mag-section--b .home-course .course-mag-section__head {
  color: #86198f;
}
.home-course .course-mag-section--b .home-course .course-mag-section__head::before {
  background: #c026d3;
}
.home-course .course-mag-section--c .home-course .course-mag-section__head {
  color: #166534;
}
.home-course .course-mag-section--c .home-course .course-mag-section__head::before {
  background: #16a34a;
}

/* #price */
.home-price {
  padding: 40px 0 30px;
  width: 100%;
  background: url(../../img/v2/home/price_bg_01.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .home-price {
    background-position: right 20% top;
  }
}
.home-price .c-heading2.home-price__head::before {
  width: 32px;
  height: 43px;
  background: url(../../img/v2/home/price_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-price .c-heading2.home-price__head::before {
    width: 21.3px;
    height: 28.6px;
  }
}
.home-price__lead {
  width: 687px;
  text-align: center;
  font-weight: 600;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .home-price__lead {
    width: 100%;
    text-align: left;
  }
}
.home-price__contents {
  background: #fff;
  border-radius: 10px;
  padding: 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media screen and (max-width: 1024px) {
  .home-price__contents {
    padding: 2.4vw;
    gap: 2.4vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    padding: 3.125vw;
    gap: 3.125vw;
  }
}
.home-price__contents .col {
  padding: 15px 24px 24px;
  border-radius: 10px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col {
    padding: 1.5vw 2.4vw 2.4vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col {
    padding: 1.953vw 3.125vw 3.125vw;
  }
}
.home-price__contents .col h3 {
  color: #fff;
  font-size: 26px;
  line-height: 1.1;
  margin-bottom: 10px;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col h3 {
    font-size: 2.6vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col h3 {
    font-size: 20px;
  }
}
@media screen and (max-width: 500px) {
  .home-price__contents .col h3 {
    font-size: 4.444vw;
  }
}
.home-price__contents .col h3 .fz-36 {
  font-size: 36px;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col h3 .fz-36 {
    font-size: 3.6vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col h3 .fz-36 {
    font-size: 30px;
  }
}
@media screen and (max-width: 500px) {
  .home-price__contents .col h3 .fz-36 {
    font-size: 6.667vw;
  }
}
.home-price__contents .col h3 .fz-28 {
  font-size: 28px;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col h3 .fz-28 {
    font-size: 2.8vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col h3 .fz-28 {
    font-size: 22px;
  }
}
@media screen and (max-width: 500px) {
  .home-price__contents .col h3 .fz-28 {
    font-size: 4.889vw;
  }
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col h3 {
    margin-bottom: 1vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col h3 {
    margin-bottom: 1.302vw;
  }
}
.home-price__contents .col.monthly {
  background: #f5b4c3;
}
.home-price__contents .col.monthly::after {
  position: absolute;
  top: 13px;
  right: 25px;
  content: "";
  width: 137px;
  height: 66px;
  background: url(../../img/v2/home/price_img_01.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col.monthly::after {
    top: 1.3vw;
    right: 1vw;
    width: 11.417vw;
    height: 5.5vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col.monthly::after {
    width: 17.839vw;
    height: 8.594vw;
  }
}
.home-price__contents .col.point {
  background: #87b4e1;
}
.home-price__contents .col.point::after {
  position: absolute;
  top: 13px;
  right: 25px;
  content: "";
  width: 89px;
  height: 62px;
  background: url(../../img/v2/home/price_img_02.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .home-price__contents .col.point::after {
    top: 1.3vw;
    right: 1vw;
    width: 7.417vw;
    height: 5.167vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price__contents .col.point::after {
    width: 11.589vw;
    height: 8.073vw;
  }
}
.home-price__contents .col .table-02 {
  width: 100%;
  border-collapse: collapse;
  vertical-align: middle;
}
.home-price__contents .col .table-02 th,
.home-price__contents .col .table-02 td {
  padding: 10px;
  width: 50%;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42;
  text-align: center;
}
.home-price__contents .col .table-02 th {
  background: #505050;
  color: #fff;
  white-space: nowrap;
  border-right: #fff solid 1px;
}
.home-price__contents .col .table-02 th:last-child {
  border-right: none;
}
.home-price__contents .col .table-02 td {
  border-right: #eaf1fa solid 1px;
}
.home-price__contents .col .table-02 td:last-child {
  border-right: none;
}
.home-price__contents .col .table-02 tr:nth-child(even) {
  background: #fff4f7;
}
.home-price__contents .col .table-02 tr:nth-child(odd) {
  background: #fff;
}
.home-price__contents .col .table-02 {
  /* Stage D 修正(158): 人気プランをハイライト
   * Stage D 修正(159): 案 P6 (オレンジ→ピンクグラデ) を適用
   * Stage D 修正(162): 修正(161) の水色テーマを廃止して P6 風に戻すが、
   *   月額制の背景ピンク (#fff4f7) と P6 ピンクが似て埋もれる問題を回避するため、
   *   ピンク要素をすべて アンバー/イエロー側に振り替えた
   *   「オレンジ + アンバー (黄金)」グラデへ変更:
   *   - 行背景: linear-gradient(90deg, #fff7ed → #fef3c7) (薄オレンジ→薄黄金)
   *   - 枠線: #ea580c (鮮やかなオレンジ)
   *   - バッジ: linear-gradient(135deg, #f59e0b → #ea580c) (アンバー→オレンジ)
   *   - テキスト: #9a3412 (深いオレンジ茶)
   */
}
.home-price__contents .col .table-02 tr.popular {
  position: relative;
}
.home-price__contents .col .table-02 tr.popular td {
  background: linear-gradient(90deg, #fff7ed 0%, #fef3c7 100%) !important;
  border-top: 2px solid #ea580c;
  border-bottom: 2px solid #ea580c;
  font-weight: 700;
  color: #9a3412;
  padding-top: 12px;
  padding-bottom: 12px;
}
.home-price__contents .col .table-02 tr.popular td:first-child {
  border-left: 2px solid #ea580c;
}
.home-price__contents .col .table-02 tr.popular td:last-child {
  border-right: 2px solid #ea580c;
}
.home-price__contents .col .table-02 tr.popular .popular-badge {
  display: inline-block;
  margin-right: 8px;
  padding: 3px 10px;
  background: linear-gradient(135deg, #f59e0b, #ea580c);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  border-radius: 99px;
  line-height: 1.4;
  vertical-align: middle;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(234, 88, 12, 0.35);
}
.home-price__contents .col .table-02 tr.popular .popular-badge::before {
  content: "";
}
.home-price__contents .col.point tr:nth-child(even) {
  background: #eaf2fa;
}
.home-price__contents .col.point {
  /* point 側の人気行も同じオレンジ+アンバーグラデを継承 */
}
.home-price__contents .col.point tr.popular td {
  background: linear-gradient(90deg, #fff7ed 0%, #fef3c7 100%) !important;
}
.home-price .c-btn-more {
  margin-top: 20px;
  text-align: center;
}
.home-price .c-btn-more a {
  min-width: 292px;
}
@media screen and (max-width: 1024px) {
  .home-price .c-btn-more a {
    min-width: 29.2vw;
  }
}
@media screen and (max-width: 768px) {
  .home-price .c-btn-more a {
    min-width: auto;
  }
}

/* #flow */
.home-flow {
  padding: 40px 0 30px;
  width: 100%;
}
.home-flow .c-heading2.home-flow__head::before {
  width: 43px;
  height: 43px;
  background: url(../../img/v2/home/flow_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .home-flow .c-heading2.home-flow__head::before {
    width: 28.6px;
    height: 28.6px;
  }
}
.home-flow__lead {
  width: 687px;
  /* Stage D 修正(172): PC でも左寄せに変更 (.home-flow__lead) */
  text-align: left;
  font-weight: 600;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .home-flow__lead {
    width: 100%;
    text-align: left;
  }
}
.home-flow__contents .flow-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 42px;
}
@media screen and (max-width: 1024px) {
  .home-flow__contents .flow-list {
    gap: 4.2vw;
  }
}
@media screen and (max-width: 768px) {
  .home-flow__contents .flow-list {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(5, auto);
    gap: 5.469vw;
  }
}
.home-flow__contents .flow-list li {
  position: relative;
}
@media screen and (max-width: 768px) {
  .home-flow__contents .flow-list li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
  }
}
.home-flow__contents .flow-list li::after {
  position: absolute;
  top: 75px;
  right: -35px;
  content: "";
  width: 25px;
  height: 19px;
  background: url(../../img/v2/home/flow_img_arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .home-flow__contents .flow-list li::after {
    top: 6.5vw;
    right: -3.5vw;
    width: 2.5vw;
    height: 1.9vw;
  }
}
@media screen and (max-width: 768px) {
  .home-flow__contents .flow-list li::after {
    top: auto;
    bottom: -3.5vw;
    right: auto;
    left: 9.3vw;
    transform: rotate(90deg);
    width: 3.255vw;
    height: 2.474vw;
  }
}
.home-flow__contents .flow-list li:last-child::after {
  content: none;
}
@media screen and (max-width: 768px) {
  .home-flow__contents .flow-list li figure {
    width: 21.745vw;
    flex-shrink: 0;
  }
}
.home-flow__contents .flow-list li p {
  padding-top: 1em;
  line-height: 1.33;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .home-flow__contents .flow-list li p {
    width: calc(100% - 21.745vw - 10px);
  }
}
.home-flow .c-btn-more {
  margin-top: 20px;
  text-align: center;
}
.home-flow .c-btn-more a {
  min-width: 440px;
}
@media screen and (max-width: 1024px) {
  .home-flow .c-btn-more a {
    min-width: 44vw;
  }
}
@media screen and (max-width: 768px) {
  .home-flow .c-btn-more a {
    min-width: auto;
  }
}

.page-head__title {
  width: 100%;
  aspect-ratio: 1280/200;
  display: grid;
  place-content: center;
  border-top: #ebebeb solid 1px;
  border-bottom: #ebebeb solid 1px;
  /* Stage D 修正(288): タイトル帯の既定背景を薄い青に。
   *   modifier (page-login / page-campaign 等) で背景色や背景画像を
   *   個別指定しているページはそちらが優先される (詳細度が高いため)。
   *   modifier 無しのページにもこの既定の帯が入るようになる。 */
  background: var(--site_blue_light, #eaf2fa);
}
@media screen and (max-width: 768px) {
  .page-head__title {
    aspect-ratio: 1280/500;
  }
}
.page-head__title h2 {
  color: var(--site_blue);
  font-size: 32px;
  text-align: center;
  white-space: nowrap;
  line-height: 1;
  margin: 0 auto 13px;
}
@media screen and (max-width: 1024px) {
  .page-head__title h2 {
    font-size: 3.2vw;
    text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff;
    padding-bottom: 0.5em;
  }
}
@media screen and (max-width: 768px) {
  .page-head__title h2 {
    margin-bottom: 5px;
  }
}
.page-head__title h2 span {
  color: var(--site_pink);
  font-size: 46px;
}
@media screen and (max-width: 1024px) {
  .page-head__title h2 span {
    font-size: 4.6vw;
  }
}
.page-head__title p {
  text-align: center;
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    padding: 0 5%;
    font-size: 12px;
    text-align: left;
    text-shadow: 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff, 0 0 5px #fff;
  }
}
.page-head__nav {
  max-width: 1000px;
  width: 100%;
  margin: 20px auto 10px;
}
@media screen and (max-width: 1024px) {
  .page-head__nav {
    padding: 0 3%;
  }
}
@media screen and (max-width: 768px) {
  .page-head__nav {
    padding: 0 5%;
  }
}
.page-head__nav .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
}
.page-head__nav .breadcrumb li:not(:last-of-type)::after {
  content: ">";
  /* 区切り文字 */
  margin: 0 0.6em;
  /* 区切り文字の左右の余白 */
}
.page-head__nav .breadcrumb li > a {
  color: var(--site_blue);
}

.bnr-trial {
  margin: 20px auto 30px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .bnr-trial {
    margin: 2.604vw auto 30px;
  }
}
.bnr-trial a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .bnr-trial a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.bnr-trial a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 247px;
  height: 165px;
  background: url(../../img/v2/common/bnr-trial_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .bnr-trial a::before {
    width: 32.161vw;
    height: 21.484vw;
  }
}
.bnr-trial a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/common/bnr-trial_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .bnr-trial a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.bnr-trial a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 27px;
  height: 27px;
  background: url(../../img/v2/common/icon_circle-arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .bnr-trial a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}

.bnr-contact {
  margin: 0 auto 30px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .bnr-contact {
    margin: 2.604vw auto 30px;
  }
}
.bnr-contact a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .bnr-contact a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.bnr-contact a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 253px;
  height: 199px;
  background: url(../../img/v2/common/bnr-contact_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .bnr-contact a::before {
    width: 32.943vw;
    height: 25.911vw;
  }
}
.bnr-contact a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/common/bnr-contact_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .bnr-contact a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.bnr-contact a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 27px;
  height: 27px;
  background: url(../../img/v2/common/icon_circle-arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .bnr-contact a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}

/* for 1col */
.l-section.lower-page .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .l-section.lower-page .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .l-section.lower-page .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}

/* for 2col */
.l-page {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 185px 1fr;
  gap: 15px;
}
@media screen and (max-width: 1024px) {
  .l-page {
    max-width: 100%;
    padding: 0 3%;
  }
}
@media screen and (max-width: 768px) {
  .l-page {
    padding: 0 5%;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
    gap: 30px;
  }
}
@media screen and (max-width: 768px) {
  .l-page__side {
    display: none;
  }
}
.l-page__side .user {
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 3px;
  overflow: hidden;
  text-align: center;
  margin-bottom: 20px;
}
.l-page__side .user .name {
  border-bottom: #e0e0e0 solid 1px;
}
.l-page__side .user .name dt {
  color: #fff;
  font-weight: bold;
  height: 30px;
  line-height: 30px;
  background: var(--base_color);
}
.l-page__side .user .name dd {
  font-weight: bold;
  line-height: 1.4;
  padding: 6px 8px;
  word-break: break-word;
  overflow-wrap: anywhere;
  /* 最大3行まで自動折り返し（はみ出しは省略記号） */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.l-page__side .user {
  /* Stage D 修正(276): 「状态」ラベル (dt) を撤去し、講師バッジ (dd)
   *   のみ表示。dt が無くなった分 dd に上下 padding を持たせる。 */
}
.l-page__side .user .status {
  border-bottom: #e0e0e0 solid 1px;
}
.l-page__side .user .status dd {
  padding: 12px 8px 10px;
}
.l-page__side .user .status dd span {
  display: block;
  color: #fff;
  font-weight: bold;
  width: 120px;
  height: 25px;
  line-height: 25px;
  border-radius: 12px;
  margin: 0 auto;
}
.l-page__side .user .status dd span.regular {
  background: #3fa9f5;
}
.l-page__side .user {
  /* Stage D 修正(276): 当月の課表開放時間数。
   *   ラベル (dt) + 値 (dd) を中央寄せで表示。
   * Stage D 修正(277): 値の下に注意書き (.open-hours__note) を追加。
   *   小さめフォントで、折り返し可。 */
}
.l-page__side .user .open-hours {
  padding: 12px 8px;
}
.l-page__side .user .open-hours dt {
  font-size: 12px;
  color: #666;
  line-height: 1.4;
  margin-bottom: 3px;
}
.l-page__side .user .open-hours dd {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.3;
  color: var(--site_blue, #0078d7);
  /* 注意書き: 値より小さく、通常ウェイト、折り返し可 */
}
.l-page__side .user .open-hours dd.open-hours__note {
  margin-top: 7px;
  font-size: 11px;
  font-weight: normal;
  line-height: 1.55;
  color: #888;
}
.l-page__side .user .classes {
  padding-top: 10px;
  line-height: 1.42;
  height: 50px;
}
.l-page__side .member-menu {
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 3px;
  overflow: hidden;
}
.l-page__side .member-menu h3 {
  background: #0078d7;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  height: 30px;
  line-height: 30px;
  text-align: center;
}
.l-page__side .member-menu ul.js-side-menu li {
  border-bottom: #e0e0e0 solid 1px;
}
.l-page__side .member-menu ul.js-side-menu li a {
  display: block;
  width: 100%;
  height: auto;
  padding: 8px 0 8px 23px;
  position: relative;
}
.l-page__side .member-menu ul.js-side-menu li a::before {
  position: absolute;
  top: 0.9em;
  left: 10px;
  content: "";
  width: 7px;
  height: 6px;
  background: url(../../img/v2/common/menu_arrow_blue.svg) no-repeat;
  background-size: contain;
}
.l-page__side .member-menu ul.js-side-menu li a span {
  display: block;
  color: var(--site_blue);
  line-height: 1.2;
  font-size: 12px;
  position: relative;
}
.l-page__side .member-menu ul.js-side-menu li .child {
  display: none;
}
.l-page__side .member-menu ul.js-side-menu li .child li a {
  padding-left: 33px;
}
.l-page__side .member-menu ul.js-side-menu li .child li a::before {
  left: 20px;
  background: url(../../img/v2/common/menu_arrow_black.svg) no-repeat;
  background-size: contain;
}
@media (min-width: 769px) {
  .l-page__side .member-menu ul.js-side-menu li .child {
    display: block !important;
  }
}
.l-page__side .member-menu ul.js-side-menu li .parent {
  border-bottom: #e0e0e0 solid 1px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .l-page__side .member-menu ul.js-side-menu li .parent span::before {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 11px;
    height: 1px;
    content: "";
    background: #0078d7;
    transform: translateY(-50%);
  }
}
@media screen and (max-width: 768px) {
  .l-page__side .member-menu ul.js-side-menu li .parent span::after {
    position: absolute;
    top: 50%;
    right: 11px;
    width: 11px;
    height: 1px;
    content: "";
    background: #0078d7;
    transform: rotate(90deg) translateY(-50%);
  }
}
@media screen and (max-width: 768px) {
  .l-page__side .member-menu ul.js-side-menu li .parent.open span::after {
    content: none;
  }
}
.l-page__side .member-menu ul.js-side-menu li:last-child {
  border-bottom: none;
}
@media screen and (max-width: 1024px) {
  .l-page__main .l-section__inner {
    padding: 0;
  }
}
@media screen and (max-width: 768px) {
  .l-page__main .l-section__inner {
    padding: 0;
  }
}

/* ===========================================================
 * 会員サイドバー: 案 R (ホバー色拡張) + ユーザー調整
 *
 * - h3 「会員メニュー」: サイト青ベタ + 白文字 (元の挙動に戻す)
 * - 親カテゴリラベル: <div class="parent"> でクリック不可、
 *   フォント色のみカテゴリ色で着色
 * - 子リンク: ホバーで青文字 + 左にインデント
 *
 * 元の青ベタ色は .blue クラスに残っているが、ここで上書きして
 * モダンな見た目を実現する。
 * =========================================================== */
.l-page__side .member-menu {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  /* メニュータイトル「会員メニュー」: サイト青ベタ */
}
.l-page__side .member-menu h3 {
  background: var(--site_blue, #0078d7);
  color: #fff;
  border-bottom: none;
  height: 38px;
  line-height: 38px;
  letter-spacing: 0.05em;
}
.l-page__side .member-menu ul.js-side-menu > li {
  border-bottom: 1px solid #e5e7eb;
}
.l-page__side .member-menu ul.js-side-menu > li:last-child {
  border-bottom: 0;
}
.l-page__side .member-menu ul.js-side-menu > li {
  /* 親カテゴリラベル (div.parent でクリック不可) */
}
.l-page__side .member-menu ul.js-side-menu > li > .parent {
  /* Stage D 修正(121): 案 M3 (淡背景) を適用 — 薄インディゴ背景 + 文字インディゴ
   *   比較用に M5 (下線) の関連スタイルは撤去:
   *     - margin / 縦 padding asymmetry / border-bottom をリセット
   *     - 代わりに background を #e8eaf6 (薄インディゴ) に
   *   git revert HEAD で M5 + 余白調整 (修正 118-120) 状態に戻る。
   */
  display: block;
  margin: 0;
  padding: 8px 12px;
  background: #e8eaf6;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.03em;
  border-bottom: none;
  cursor: default;
  user-select: none;
  /* 元の矢印 (::before / ::after) は隠す */
}
.l-page__side .member-menu ul.js-side-menu > li > .parent::before, .l-page__side .member-menu ul.js-side-menu > li > .parent::after {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
.l-page__side .member-menu ul.js-side-menu > li > .parent span {
  color: inherit;
  font-size: 13px;
  line-height: 1.4;
}
.l-page__side .member-menu ul.js-side-menu > li {
  /* SP では accordion 用に pointer 戻す (JS が click ハンドル) */
}
@media screen and (max-width: 768px) {
  .l-page__side .member-menu ul.js-side-menu > li > .parent {
    cursor: pointer;
  }
}
.l-page__side .member-menu ul.js-side-menu > li {
  /* Stage D 修正(117): 全カテゴリの見出し色をインディゴネイビーに統一 (L9)
   * Stage D 修正(127): 講師サイドバー用 .cat-rule / .cat-other を追加
   * Stage D 修正(143): 管理者サイドバー用 .cat-dashboard / .cat-search /
   *                    .cat-payment / .cat-register を追加
   * Stage D 修正(144): 管理者再編で .cat-mgmt / .cat-reserve / .cat-student /
   *                    .cat-tutor / .cat-common / .cat-company を追加 */
}
.l-page__side .member-menu ul.js-side-menu > li.cat-news > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-info > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-lesson > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-purchase > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-text > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-support > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-rule > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-other > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-dashboard > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-search > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-payment > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-register > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-mgmt > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-reserve > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-student > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-tutor > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-common > .parent, .l-page__side .member-menu ul.js-side-menu > li.cat-company > .parent {
  color: #283593;
}
.l-page__side .member-menu ul.js-side-menu > li { /* Material Indigo-900 */
  /* 子メニュー */
}
.l-page__side .member-menu ul.js-side-menu > li ul.child {
  background: #fff;
  /* Stage D 修正(120): 下線↔最初の小見出しを「修正(118) の状態より +4px 広く」
   *   修正(118) 当時の gap = ul.child padding-top 4 + a padding-top 6 = 10px
   *   今回 ul.child padding-top を 4 → 8 にして 14px に。
   */
  padding: 8px 0 4px;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li {
  border-bottom: 1px solid #f3f4f6;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li:last-child {
  border-bottom: 0;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a {
  /* Stage D 修正(120): vertical padding を 4 → 6 に戻す (修正 119 の縮小を取消) */
  padding: 6px 14px 6px 24px;
  transition: color 0.15s ease, padding-left 0.15s ease;
  background: #fff;
  /* 元の矢印を隠す */
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a::before {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a span {
  color: #555;
  font-size: 12px;
  line-height: 1.35;
  /* 左に小さな › 印 */
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a span::before {
  content: "›";
  color: #c8c8c8;
  margin-right: 6px;
  font-weight: bold;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a:hover {
  padding-left: 30px;
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a:hover span {
  color: var(--site_blue, #2871b9);
}
.l-page__side .member-menu ul.js-side-menu > li ul.child > li > a:hover span::before {
  color: var(--site_blue, #2871b9);
}
.l-page__side .member-menu ul.js-side-menu > li {
  /* モバイル時のアコーディオン挙動は既存 JS ロジックが保持する
     (display:none の child を JS で開閉) */
}

/* Stage D 修正(182): 各ページの __caution セクション内 ul > li を一括拡大
 *   list-dot-blue/pink を使わず素の <ul><li> で書かれた注意事項
 *   (.course-text__caution / .tutor-timetable__caution 等) もまとめて 14px に。 */
[class$=__caution] > ul > li,
[class$=__caution] > p + ul > li {
  font-size: 14px;
  line-height: 1.85;
  margin-bottom: 4px;
}
@media screen and (max-width: 768px) {
  [class$=__caution] > ul > li,
  [class$=__caution] > p + ul > li {
    font-size: 13.5px;
  }
}

/* Stage D 修正(204): 注意事項を複数トピックに分割するための再利用パターン
 *   <div class="<page>__notes">
 *     <div class="<page>__notes-group">
 *       <h3 class="c-heading3 icon_check">タイトル</h3>
 *       <ul class="list-dot-blue gap"><li>...</li></ul>
 *     </div>
 *     <div class="<page>__notes-group">...</div>
 *   </div>
 *
 *   現状 .users-bank__notes (bank_transfer) で使用。他ページにも適用可。
 *   グループ間は 2em のスペースで区切り、上下の口座テーブル等から離す。 */
[class$=__notes] {
  margin-top: 2.5em;
}
[class$=__notes] > [class$=__notes-group] + [class$=__notes-group] {
  margin-top: 2em;
}

/* Stage D 修正(205): bank_transfer の QR コード画像 (微信支付 / 支付宝)
 *   旧: inline width="200" で 2 段に縦積み、原画像 1242×1686 等が大きく感じた
 *   新: 横並び flex + 画像 140px に統一。SP では中央寄せで縦並び。
 *
 *   Stage D 修正(206): 詳細度を 0,2,1 に上げて legacy_course_page img
 *   (style.css 後段、0,1,1) のオーバーライドを防ぐ。bank_transfer の
 *   ラッパー <div class="precaution__contents legacy_course_page"> の影響。 */
.users-bank__qr-list {
  margin: 1.5em auto 0;
  display: flex;
  flex-wrap: wrap;
  /* Stage D 修正(208): スキャナー誤読対策で左右端 (space-between) に振り分け。
   * Stage D 修正(209): max-width 620px / 距離 ~260px に詰めた。
   *
   * Stage D 修正(210): もう少し近くしたいとのご要望で max-width: 520px
   *   QR 同士の距離は約 160px (520 - 180×2)。
   *   片方をスキャンする際にもう一方がフレームに入らない最小距離を確保。
   *   sp は引き続き縦並び。 */
  max-width: 520px;
  justify-content: space-between;
  gap: 40px;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .users-bank__qr-list {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 36px;
  }
}
.users-bank__qr-list .users-bank__qr {
  text-align: center;
}
.users-bank__qr-list .users-bank__qr p {
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 4px;
  color: #333;
}
.users-bank__qr-list .users-bank__qr {
  /* selector: .users-bank__qr-list .users-bank__qr img → 0,2,1
     (legacy_course_page img の 0,1,1 を確実に上書き) */
}
.users-bank__qr-list .users-bank__qr img {
  display: block;
  width: 180px;
  height: auto;
  max-width: 100%;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
}
@media screen and (max-width: 768px) {
  .users-bank__qr-list .users-bank__qr img {
    width: 160px;
  }
}

ul.list-dot-blue li {
  font-weight: bold;
  padding-left: 20px;
  position: relative;
  /* Stage D 修正(181): フォントサイズ 12px (base) → 14px に拡大
   *   注意事項リスト全般 (.list-dot-blue / .list-dot-pink) の可読性を向上。
   *   __caution / payment_texts / tutors__caution など全ページ横断で適用される。 */
  font-size: 14px;
  line-height: 1.85;
  margin-bottom: 4px;
}
@media screen and (max-width: 768px) {
  ul.list-dot-blue li {
    font-size: 13.5px;
  }
}
ul.list-dot-blue li::before {
  position: absolute;
  top: 0.45em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
ul.list-dot-blue li a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}
ul.list-dot-blue li.dot-pink::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_pink.svg) no-repeat;
  background-size: contain;
}
ul.list-dot-blue.gap li + li {
  margin-top: 0.5em;
}
ul.list-dot-blue.font-normal li {
  font-weight: normal;
}

ul.list-dot-pink li {
  font-weight: bold;
  padding-left: 20px;
  position: relative;
  /* Stage D 修正(181): list-dot-pink も同じ仕様で拡大 */
  font-size: 14px;
  line-height: 1.85;
  margin-bottom: 4px;
}
@media screen and (max-width: 768px) {
  ul.list-dot-pink li {
    font-size: 13.5px;
  }
}
ul.list-dot-pink li::before {
  position: absolute;
  top: 0.45em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_pink.svg) no-repeat;
  background-size: contain;
}
ul.list-dot-pink li a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}
ul.list-dot-pink.gap li + li {
  margin-top: 0.5em;
}
ul.list-dot-pink.font-normal li {
  font-weight: normal;
}

.btn-teams {
  margin: 0 auto;
  width: 290px;
  height: 36px;
  background: url(../../img/v2/common/btn-teams_bg.png) no-repeat;
  background-size: contain;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media screen and (max-width: 374px) {
  .btn-teams {
    width: 100%;
  }
}
.btn-teams::after {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  content: "";
  width: 12px;
  height: 12px;
  background: url(../../img/v2/common/icon_link.svg) no-repeat;
  background-size: contain;
}
.btn-teams span {
  display: block;
  color: #fff;
  font-size: 13px;
  line-height: 1;
  font-weight: bold;
}
@media screen and (max-width: 374px) {
  .btn-teams span {
    font-size: 3.467vw;
  }
}

.btn-pink {
  margin: 0 auto;
  width: 290px;
  height: 36px;
  background: url(../../img/v2/common/btn-pink_bg.png) no-repeat;
  background-size: contain;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media screen and (max-width: 374px) {
  .btn-pink {
    width: 100%;
  }
}
.btn-pink span {
  display: block;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
}
@media screen and (max-width: 374px) {
  .btn-pink span {
    font-size: 3.467vw;
  }
}

.table-wrap {
  width: 100%;
  margin-bottom: 50px;
}

.table_register {
  width: 100%;
  border-collapse: collapse;
}
.table_register tr:nth-child(odd) {
  background: #f8f8f8;
}
.table_register tr:nth-child(even) {
  background: #e8e8e8;
}
.table_register tr.required th {
  border-left: #de2246 solid 6px;
}
@media screen and (max-width: 768px) {
  .table_register tr.required td {
    border-left: #de2246 solid 6px;
  }
}
.table_register th {
  width: 240px;
  padding: 15px;
  text-align: left;
  font-size: 16px;
  font-weight: bold;
  vertical-align: middle;
  border-left: #cccccc solid 6px;
}
@media screen and (max-width: 768px) {
  .table_register th {
    padding: 10px 10px 0 10px;
  }
}
@media screen and (max-width: 768px) {
  .table_register th {
    display: block;
    width: 100%;
  }
}
.table_register th.bg_gray {
  background: #e8e8e8;
}
.table_register td {
  padding: 15px;
  font-size: 14px;
  line-height: 1.5;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  .table_register td {
    padding: 10px;
    border-left: #cccccc solid 6px;
  }
}
@media screen and (max-width: 768px) {
  .table_register td {
    display: block;
    width: 100%;
  }
}
.table_register td.col2 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .table_register td.col2 {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }
}
.table_register td.bg_none {
  background: #f8f8f8;
}
.table_register td.bg_gray {
  background: #e8e8e8;
}
.table_register td.btm {
  position: relative;
}
.table_register td.btm::after {
  position: absolute;
  bottom: 0;
  left: 15px;
  content: "";
  width: calc(100% - 30px);
  height: 1px;
  background: #cccccc;
}
.table_register td .dot {
  display: inline-block;
  padding-left: 15px;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 3px;
  position: relative;
}
.table_register td .dot::before {
  position: absolute;
  top: 0.2em;
  left: 0;
  content: "";
  width: 12px;
  height: 12px;
  background: #f57db4;
  border-radius: 50%;
}
.table_register td .icon_link {
  display: block;
}
.table_register td .icon_link span {
  display: inline-block;
  color: #3fa9f5;
  padding-right: 20px;
  position: relative;
}
.table_register td .icon_link span::after {
  position: absolute;
  top: 0.2em;
  right: 0;
  content: "";
  width: 12px;
  height: 12px;
  background: url(../../img/v2/common/icon_link_blue.svg);
}
.table_register input,
.table_register select,
.table_register textarea {
  padding: 5px;
  border: #cccccc solid 1px;
  border-radius: 5px;
}
.table_register input.w50,
.table_register select.w50,
.table_register textarea.w50 {
  width: 290px;
}
@media screen and (max-width: 768px) {
  .table_register input.w50,
  .table_register select.w50,
  .table_register textarea.w50 {
    width: 100%;
  }
}
.table_register input.w100,
.table_register select.w100,
.table_register textarea.w100 {
  width: 100%;
}
.table_register .caution_01 {
  display: block;
  font-size: 12px;
  margin-top: 5px;
}
.table_register .caution_02 {
  display: inline-block;
  font-size: 12px;
  margin-left: 10px;
}
@media screen and (max-width: 768px) {
  .table_register .caution_02 {
    display: block;
    margin-left: 0;
    margin-top: 5px;
  }
}
.table_register .caution_03 {
  display: block;
  color: #de2246;
  font-size: 14px;
  font-weight: bold;
  margin-top: 5px;
}
.table_register .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.table_register fieldset {
  border: none;
  padding: 0;
  margin: 0;
}
.table_register fieldset label {
  display: inline-flex;
  align-items: center;
  margin-right: 1.5rem;
  cursor: pointer;
}
.table_register fieldset input[type=radio] {
  margin-right: 0.4rem;
  margin-bottom: 0.5rem;
}
.table_register thead th,
.table_register thead td {
  color: #fff;
  background: #555555;
  border-left: #555 solid 6px;
}

.btn-box {
  text-align: center;
  margin-bottom: 20px;
}

.btn-confirm {
  display: inline-block;
  text-align: center;
  min-width: 290px;
  height: 37px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 37px;
  padding: 0 1em;
  background: url(../../img/v2/home/btn_more_bg.png) left center no-repeat;
  background-size: auto 100%;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 auto;
  outline: none;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .btn-confirm {
    min-width: 26vw;
    height: 3.7vw;
    font-size: 1.6vw;
    line-height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .btn-confirm {
    min-width: auto;
    height: auto;
    padding: 0.5em 1.5em;
    font-size: 14px;
    line-height: 1.4;
  }
}

/* Stage D 修正(302): 会員登録フロー (register / join / confirm) 用の
 *   「前のページに戻る」ボタンと、戻る + 次へ を横並びにするナビ。
 *   - .form-flow-nav : 戻る/次へを中央寄せで横並び。SP は縦積み(主ボタンを上)。
 *   - .btn-back      : 副次アクション用のゴースト(白地+枠線)ボタン。左矢印付き。
 *   .btn-confirm の margin:0 auto は flex 内で配置が崩れるため打ち消す。 */
.form-flow-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .form-flow-nav {
    flex-direction: column-reverse;
    gap: 12px;
  }
}
.form-flow-nav .btn-confirm {
  margin: 0;
}

.btn-back {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  text-align: center;
  min-width: 220px;
  height: 37px;
  line-height: 35px;
  padding: 0 1.2em 0 1.9em;
  color: #555;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  background: #fff;
  border: 1px solid #bcc6d0;
  border-radius: 3px;
  position: relative;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.btn-back::before {
  content: "‹";
  position: absolute;
  left: 1.1em;
  top: 50%;
  transform: translateY(-52%);
  font-size: 21px;
  line-height: 1;
}
.btn-back:hover {
  background: #eef1f4;
  border-color: #9aa6b2;
}
@media screen and (max-width: 1024px) {
  .btn-back {
    min-width: 22vw;
    height: 3.7vw;
    line-height: calc(3.7vw - 2px);
    font-size: 1.5vw;
  }
}
@media screen and (max-width: 768px) {
  .btn-back {
    min-width: auto;
    width: 100%;
    max-width: 320px;
    height: auto;
    line-height: 1.4;
    padding: 0.6em 1.4em 0.6em 2em;
    font-size: 14px;
  }
}

/* Stage D 修正(303): フラッシュメッセージ (CakePHP Session->flash() が出力する
 *   #flashMessage) の装飾。レイアウトでコンテンツ先頭に移動したのに合わせ、
 *   赤系の警告バーとして目立たせる。会員登録のユーザー名/メール重複エラー等。 */
#flashMessage {
  max-width: 1000px;
  margin: 20px auto;
  padding: 14px 20px;
  background: #fdecec;
  border: 1px solid #e0a3a3;
  border-left: 6px solid #de2246;
  border-radius: 4px;
  color: #b3252f;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #flashMessage {
    margin: 12px 3%;
    padding: 12px 14px;
    font-size: 14px;
  }
}

/* Stage D 修正(305): jquery.validate が出力するエラーメッセージ (label.error)
 *   の装飾。v2 では色指定が無く目立たなかったため、必須入力エラー
 *   ("This field is required." 等) を赤字で明示する。 */
label.error {
  color: #de2246;
  font-weight: bold;
  font-size: 14px;
  margin-left: 6px;
}

/* Stage D 修正(307): jquery.validate の success コールバックが付与する
 *   label.field-ok を、緑の「OK」バッジとして装飾する。
 *   検証 NG 時はラベルに .error も付くため :not(.error) でバッジを抑止し、
 *   赤エラー (label.error) を優先表示する。 */
label.field-ok:not(.error) {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 11px;
  background: #29a06a;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.6;
  border-radius: 11px;
  vertical-align: middle;
}

/* Stage D 修正(96): AJAX 処理中のローディング画像 (お気に入りボタン等) を縮小
 *   旧 style.css は 30px で大きすぎたため v2 では 18px に。
 *   .booking と並んでも違和感のないサイズに揃える。
 */
#ajax-loading {
  width: 18px !important;
  height: 18px;
  vertical-align: middle;
  margin: 0 4px;
}

/* Stage D 修正(97): お気に入りボタン (新デザイン) のスピナーは
 *   ハートの位置にそのまま差し込まれるため、ハートと同サイズで表示。
 */
.favorite-loading {
  display: block;
  width: 24px;
  height: 24px;
  margin: 0 auto;
}

/* Stage D 修正(114): 予約確認 / キャンセル確認モーダルのデザインを刷新
 *   旧: 表形式 + GIF 画像ボタン (button_lesson_*_off.gif など)
 *   新: モダンな表 + 青グラデの予約ボタン + グレーの閉じるボタン
 */
.tbl_reserve {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 0 16px;
  font-size: 13px;
  border: 1px solid #d3e0ec;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.tbl_reserve tr > th, .tbl_reserve tr > td {
  padding: 10px 12px;
  vertical-align: top;
}
.tbl_reserve .reserve_th_top {
  background: linear-gradient(135deg, #0072ff 0%, #5fb0ff 100%);
  color: #fff;
  text-align: center;
  padding: 14px;
}
.tbl_reserve .reserve_th_top h3 {
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
}
.tbl_reserve .reserve_th {
  background: #f5f9ff;
  color: #1a3a72;
  font-weight: bold;
  text-align: left;
  width: 40%;
  border-bottom: 1px solid #ecf2f9;
}
.tbl_reserve .reserve_td, .tbl_reserve .reserve_td2 {
  background: #fff;
  color: #333;
  border-bottom: 1px solid #ecf2f9;
}
.tbl_reserve .reserve_td textarea, .tbl_reserve .reserve_td2 textarea {
  width: 100%;
  max-width: 100%;
  min-height: 80px;
  padding: 6px 8px;
  border: 1px solid #c5d5e8;
  border-radius: 4px;
  font-size: 13px;
  font-family: inherit;
  resize: vertical;
}
.tbl_reserve .reserve_td textarea:focus, .tbl_reserve .reserve_td2 textarea:focus {
  outline: none;
  border-color: #0072ff;
  box-shadow: 0 0 0 2px rgba(0, 114, 255, 0.15);
}
.tbl_reserve .reserve_td input[type=radio], .tbl_reserve .reserve_td2 input[type=radio] {
  vertical-align: middle;
  margin-right: 3px;
}
.tbl_reserve .reserve_td span, .tbl_reserve .reserve_td2 span {
  margin-right: 10px;
  vertical-align: middle;
}
.tbl_reserve tr:last-child > th, .tbl_reserve tr:last-child > td {
  border-bottom: none;
}

/* モーダルの両ボタン配置 (予約 / キャンセル) */
.div_center_double_btn_modal,
.div_center_double_btn_modal_cancel {
  display: flex;
  justify-content: center;
  gap: 12px;
  padding: 12px 0 4px;
}

/* モーダルボタン共通 */
.btn-modal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 140px;
  padding: 10px 22px;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.04em;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none !important;
  text-align: center;
  line-height: 1.2;
  transition: filter 0.15s, transform 0.1s, box-shadow 0.15s, background 0.15s;
  white-space: nowrap;
}
.btn-modal:active {
  transform: translateY(1px);
}

/* 予約する: 青系グラデ (G2) */
#reserve_submit, .btn-modal-submit {
  background: linear-gradient(135deg, #0072ff 0%, #00c6ff 100%);
  color: #fff !important;
  box-shadow: 0 3px 8px rgba(0, 114, 255, 0.28);
}
#reserve_submit:hover, .btn-modal-submit:hover {
  filter: brightness(1.08);
  box-shadow: 0 5px 12px rgba(0, 114, 255, 0.38);
}

/* キャンセルする: 赤系 (注意喚起) */
#cancel_submit, .btn-modal-cancel {
  background: linear-gradient(135deg, #e53935 0%, #ef6b68 100%);
  color: #fff !important;
  box-shadow: 0 3px 8px rgba(229, 57, 53, 0.28);
}
#cancel_submit:hover, .btn-modal-cancel:hover {
  filter: brightness(1.08);
  box-shadow: 0 5px 12px rgba(229, 57, 53, 0.38);
}

/* 閉じる: グレー */
#reserve_close, #cancel_close, .btn-modal-close {
  background: #fff;
  color: #555 !important;
  border: 1px solid #c8c8c8;
}
#reserve_close:hover, #cancel_close:hover, .btn-modal-close:hover {
  background: #f5f5f5;
  border-color: #999;
}

/* Stage D 修正(321): 「人民元の受講料はこちら」リンクの横長バナー
 *   (候補HTML 05 薄青バナー)。wechat_pay / alipay / bank_transfer で使用。 */
.renminbi-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 520px;
  margin: 1.4em 0 0;
  padding: 14px 18px;
  background: #eaf3fb;
  border: 1px solid #bcd5ea;
  border-radius: 8px;
  /* legacy_course_page の a 既定スタイル(青字+下線)を打ち消す */
  text-decoration: none !important;
  color: #1f3b5b !important;
  font-weight: bold;
  font-size: 15px;
  transition: background 0.2s ease;
}
.renminbi-banner:hover {
  background: #dcebf8;
}
.renminbi-banner__ico {
  font-size: 22px;
  line-height: 1;
}
.renminbi-banner__text {
  flex: 1;
}
.renminbi-banner__arw {
  margin-left: auto;
  font-size: 20px;
  color: #2871b9;
}
@media screen and (max-width: 768px) {
  .renminbi-banner {
    font-size: 14px;
    padding: 12px 14px;
  }
}

.page-head__title.page-course {
  background: url(../../img/v2/lesson_course/page-title_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-course {
    background: url(../../img/v2/lesson_course/page-title_bg.png) left 20% center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-introductory_course {
  background: url(../../img/v2/lesson_course/page-title_introductory_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-introductory_course {
    background: url(../../img/v2/lesson_course/page-title_introductory_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-primary_course {
  background: url(../../img/v2/lesson_course/page-title_primary_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-primary_course {
    background: url(../../img/v2/lesson_course/page-title_primary_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-intermediate_course {
  background: url(../../img/v2/lesson_course/page-title_intermediate_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-intermediate_course {
    background: url(../../img/v2/lesson_course/page-title_intermediate_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-business_course {
  background: url(../../img/v2/lesson_course/page-title_business_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-business_course {
    background: url(../../img/v2/lesson_course/page-title_business_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-hsk_course {
  background: url(../../img/v2/lesson_course/page-title_hsk_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-hsk_course {
    background: url(../../img/v2/lesson_course/page-title_hsk_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-chengyu_course {
  background: url(../../img/v2/lesson_course/page-title_chengyu_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-chengyu_course {
    background: url(../../img/v2/lesson_course/page-title_chengyu_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-hsk_vocabulary_course {
  background: url(../../img/v2/lesson_course/page-title_hsk_vocabulary_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-hsk_vocabulary_course {
    background: url(../../img/v2/lesson_course/page-title_hsk_vocabulary_bg.png) right center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-freetext_course {
  background: url(../../img/v2/lesson_course/page-title_freetext_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-freetext_course {
    background: url(../../img/v2/lesson_course/page-title_freetext_bg.png) left center no-repeat;
    background-size: cover;
  }
}

.course-text {
  margin-bottom: 30px;
}
.course-text .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .course-text .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .course-text .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.course-text .c-heading2.course-text__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/home/course_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .course-text .c-heading2.course-text__head::before {
    width: 32px;
    height: 25.3px;
  }
}
.course-text__lead {
  width: 860px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .course-text__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .course-text__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.course-text__contents {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: auto;
  gap: 15px;
}
@media screen and (max-width: 768px) {
  .course-text__contents {
    grid-template-columns: 100%;
  }
}
.course-text__col {
  border: #e0e0e0 solid 1px;
  padding: 10px;
}
.course-text__col .row {
  width: 100%;
  aspect-ratio: 450/250;
  position: relative;
}
.course-text__col .row .title h3 {
  position: absolute;
  top: 50px;
  left: 30px;
}
@media screen and (max-width: 1024px) {
  .course-text__col .row .title h3 {
    top: 5vw;
    left: 3vw;
  }
}
@media screen and (max-width: 768px) {
  .course-text__col .row .title h3 {
    left: 3.906vw;
  }
}
.course-text__col .row .title h3 {
  font-size: 24px;
  line-height: 1.16;
  margin-bottom: 5px;
}
@media screen and (max-width: 1024px) {
  .course-text__col .row .title h3 {
    font-size: 2.4vw;
  }
}
@media screen and (max-width: 768px) {
  .course-text__col .row .title h3 {
    font-size: 20px;
  }
}
.course-text__col .row .title h3 br.sp-ms {
  display: none;
}
@media screen and (max-width: 450px) {
  .course-text__col .row .title h3 br.sp-ms {
    display: block;
  }
}
.course-text__col .row .title .btn-detail {
  position: absolute;
  bottom: 25px;
  left: 30px;
  display: block;
  width: 160px;
  height: 46px;
  text-align: center;
  border: #fff solid 2px;
  border-radius: 10px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 1024px) {
  .course-text__col .row .title .btn-detail {
    bottom: 2.5vw;
    left: 3vw;
  }
}
@media screen and (max-width: 768px) {
  .course-text__col .row .title .btn-detail {
    left: 3.906vw;
    width: 130px;
    height: 35px;
  }
}
.course-text__col .row .title .btn-detail:hover {
  opacity: 1;
}
.course-text__col .row .title .btn-detail span {
  display: inline-block;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 46px;
  padding-right: 20px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .course-text__col .row .title .btn-detail span {
    line-height: 35px;
  }
}
.course-text__col .row .title .btn-detail span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 13px;
  height: 10px;
  background: url(../../img/v2/lesson_course/icon_arrow.png) no-repeat;
  background-size: contain;
}
.course-text__col.introductory .row {
  background: url(../../img/v2/lesson_course/text-img_01.png) no-repeat;
  background-size: cover;
}
.course-text__col.introductory .row .btn-detail {
  background: #daa733;
}
.course-text__col.intermediate .row {
  background: url(../../img/v2/lesson_course/text-img_02.png) no-repeat;
  background-size: cover;
}
.course-text__col.intermediate .row h3 {
  top: 70px;
}
@media screen and (max-width: 1024px) {
  .course-text__col.intermediate .row h3 {
    top: 5vw;
  }
}
.course-text__col.intermediate .row .btn-detail {
  background: #f59591;
}
.course-text__col.business .row {
  background: url(../../img/v2/lesson_course/text-img_03.png) no-repeat;
  background-size: cover;
}
.course-text__col.business .row .btn-detail {
  background: #70bbc4;
}
.course-text__col.beginner .row {
  background: url(../../img/v2/lesson_course/text-img_04.png) no-repeat;
  background-size: cover;
}
.course-text__col.beginner .row h3 {
  top: 70px;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .course-text__col.beginner .row h3 {
    top: 5vw;
  }
}
.course-text__col.beginner .row .btn-detail {
  background: #f57db4;
}
.course-text__col.advanced .row {
  background: url(../../img/v2/lesson_course/text-img_05.png) no-repeat;
  background-size: cover;
}
.course-text__col.advanced .row .btn-detail {
  background: #947d5d;
}
.course-text__col {
  /* HSK対策コース */
}
.course-text__col.hsk .row {
  background: url(../../img/v2/lesson_course/text-img_06.png) no-repeat;
  background-size: cover;
}
.course-text__col.hsk .row .btn-detail {
  background: #5a8dee;
  z-index: 2;
}
.course-text__col {
  /* 成語コース */
}
.course-text__col.chengyu .row {
  background: url(../../img/v2/lesson_course/text-img_07.png) no-repeat;
  background-size: cover;
}
.course-text__col.chengyu .row .btn-detail {
  background: #c8853a;
  z-index: 2;
}
.course-text__col {
  /* HSK単語習得コース
     class 名にアンダースコアを含むため、HTML 側で `course-text__col hsk_vocabulary`
     と並んだ複数クラスとして書く必要がある。
     h3 が 2 行 ("HSK単語" / "習得コース") のため、デフォルト top:50px だと
     btn-detail の領域 (bottom:25, height:46) と縦に重なる端末がある。
     h3 を少し上にずらし、btn-detail の z-index を上げて確実にクリック可能に。 */
}
.course-text__col.hsk_vocabulary .row {
  background: url(../../img/v2/lesson_course/text-img_08.png) no-repeat;
  background-size: cover;
}
.course-text__col.hsk_vocabulary .row h3 {
  top: 30px;
}
@media screen and (max-width: 1024px) {
  .course-text__col.hsk_vocabulary .row h3 {
    top: 3vw;
  }
}
.course-text__col.hsk_vocabulary .row .btn-detail {
  background: #6fb47e;
  z-index: 2;
}
.course-text__col .table_course {
  width: 100%;
  border-collapse: collapse;
}
.course-text__col .table_course th,
.course-text__col .table_course td {
  padding: 10px 5px;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.42;
  text-align: center;
  vertical-align: top;
}
.course-text__col .table_course th {
  background: #505050;
  color: #fff;
  white-space: nowrap;
  border-right: #e2e2e2 solid 1px;
}
.course-text__col .table_course th:last-child {
  border-right: none;
}
.course-text__col .table_course td {
  background: #fff;
  border-right: #e2e2e2 solid 1px;
}
.course-text__col .table_course td:last-child {
  border-right: none;
}
.course-text__col .table_course tr:nth-child(even) > td {
  background: #f4f4f4;
}
.course-text__col .table_course tr > td:nth-child(3) {
  width: 115px;
  padding: 5px 15px;
}
@media screen and (max-width: 1024px) {
  .course-text__col .table_course tr > td:nth-child(3) {
    padding: 5px 10px;
  }
}
.course-text__col .table_course tr > td:nth-child(3) a {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.course-text__col .table_course tr > td:nth-child(3) a img {
  width: 35px;
  height: auto;
  margin-right: 10px;
}
.course-text__col .table_course tr > td:nth-child(3) a p {
  color: #0069af;
  text-decoration: underline;
}
.course-text__caution {
  width: 860px;
  margin: 30px auto 0;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .course-text__caution {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .course-text__caution {
    margin: 21vw auto 0;
  }
}
.course-text__caution::after {
  /* 旧デザイン (グリッド 5〜6 件想定) では caution 上に教材イラストを
     浮かべていたが、HSK / 成語 / HSK単語 を追加してグリッドが 8 件に
     なったため、最終行 (HSK単語習得コース) のカードとテーブルに
     物理的に被るようになった。装飾画像はオフにする。 */
  display: none;
  content: "";
}
.course-text__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .course-text__caution p {
    font-size: 14px;
  }
}
.course-text__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.course-text__caution ul li {
  padding-left: 20px;
  position: relative;
}
.course-text__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}

.course-free .l-section__inner {
  background: url(../../img/v2/lesson_course/free_bg_01.png) right bottom no-repeat;
  background-size: 100% auto;
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .course-free .l-section__inner {
    padding: 3vw 2vw;
  }
}
@media screen and (max-width: 768px) {
  .course-free .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.course-free .c-heading2.course-free__head::before {
  width: 43px;
  height: 46px;
  background: url(../../img/v2/lesson_course/free_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .course-free .c-heading2.course-free__head::before {
    width: 28.6px;
    height: 30.6px;
  }
}
.course-free__lead {
  width: 680px;
  margin: 1.5em auto 2em;
  text-align: left;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .course-free__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .course-free__lead {
    max-width: 100%;
    width: 100%;
  }
}
.course-free__col {
  width: 475px;
  margin: 0 auto;
  border: #e0e0e0 solid 1px;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .course-free__col {
    width: 100%;
  }
}
.course-free__col .row {
  width: 100%;
  aspect-ratio: 451/246;
  background: url(../../img/v2/lesson_course/free_img_01.png) no-repeat;
  background-size: cover;
  position: relative;
}
.course-free__col .row .title h3 {
  position: absolute;
  top: 50px;
  left: 30px;
}
@media screen and (max-width: 1024px) {
  .course-free__col .row .title h3 {
    top: 5vw;
    left: 3vw;
  }
}
@media screen and (max-width: 768px) {
  .course-free__col .row .title h3 {
    left: 3.906vw;
  }
}
.course-free__col .row .title h3 {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.16;
  margin-bottom: 5px;
}
@media screen and (max-width: 1024px) {
  .course-free__col .row .title h3 {
    font-size: 2.4vw;
  }
}
@media screen and (max-width: 768px) {
  .course-free__col .row .title h3 {
    font-size: 20px;
  }
}
.course-free__col .row .title .btn-detail {
  position: absolute;
  bottom: 25px;
  left: 30px;
  display: block;
  width: 160px;
  height: 46px;
  text-align: center;
  background: #70879c;
  border: #fff solid 2px;
  border-radius: 10px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
@media screen and (max-width: 1024px) {
  .course-free__col .row .title .btn-detail {
    bottom: 2.5vw;
    left: 3vw;
  }
}
@media screen and (max-width: 768px) {
  .course-free__col .row .title .btn-detail {
    left: 3.906vw;
    width: 130px;
    height: 35px;
  }
}
.course-free__col .row .title .btn-detail:hover {
  opacity: 1;
}
.course-free__col .row .title .btn-detail span {
  display: inline-block;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 46px;
  padding-right: 20px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .course-free__col .row .title .btn-detail span {
    line-height: 35px;
  }
}
.course-free__col .row .title .btn-detail span::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 13px;
  height: 10px;
  background: url(../../img/v2/lesson_course/icon_arrow.png) no-repeat;
  background-size: contain;
}
.course-free__col p {
  font-size: 14px;
  padding: 5px 0 5px 30px;
  border-left: #e0e0e0 solid 1px;
  border-right: #e0e0e0 solid 1px;
  border-bottom: #e0e0e0 solid 1px;
}
@media screen and (max-width: 768px) {
  .course-free__col p {
    padding-left: 3.906vw;
  }
}

.course-feature {
  border-top: #e6efff solid 1px;
  background: #f7faff;
}
.course-feature .l-section__inner {
  padding-top: 30px;
  padding-bottom: 30px;
}
.course-feature .c-heading2.course-feature__head::before {
  width: 48px;
  height: 45px;
  background: url(../../img/v2/home/feature_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .course-feature .c-heading2.course-feature__head::before {
    width: 32px;
    height: 30px;
  }
}
.course-feature__lead {
  width: 687px;
  font-weight: bold;
  margin: 1.5em auto 2em;
}
@media screen and (max-width: 768px) {
  .course-feature__lead {
    width: 100%;
  }
}
.course-feature__contents {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
}
@media screen and (max-width: 768px) {
  .course-feature__contents {
    flex-direction: column;
    gap: 30px;
  }
}
.course-feature__contents .col {
  width: 310px;
}
@media screen and (max-width: 768px) {
  .course-feature__contents .col {
    width: 100%;
  }
}
.course-feature__contents .col .icon {
  display: block;
  width: 77px;
  margin: 0 auto;
}
.course-feature__contents .col .title {
  padding: 10px 0;
  position: relative;
}
.course-feature__contents .col .title h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}
.course-feature__contents .col._04 .title, .course-feature__contents .col._05 .title {
  padding: 0;
  height: 70px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .course-feature__contents .col._04 .title, .course-feature__contents .col._05 .title {
    height: auto;
  }
}
.course-feature__contents .col._04 .title h3, .course-feature__contents .col._05 .title h3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .course-feature__contents .col._04 .title h3, .course-feature__contents .col._05 .title h3 {
    position: static;
    transform: translate(0, 0);
    padding: 10px 0;
  }
}

/* introductory_course */
.lesson_course_introductory {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .lesson_course_introductory {
    padding-bottom: 60px;
  }
}

.course-detail {
  margin-bottom: 30px;
}
.course-detail .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .course-detail .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .course-detail .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.course-detail .c-heading2 {
  margin-bottom: 30px;
}
.course-detail .c-heading2.course-detail__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/home/course_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .course-detail .c-heading2.course-detail__head::before {
    width: 32px;
    height: 25.3px;
  }
}
.course-detail .c-heading2.course-detail-dl__head::before {
  width: 41px;
  height: 38px;
  background: url(../../img/v2/common/icon_download.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .course-detail .c-heading2.course-detail-dl__head::before {
    width: 28.7px;
    height: 25.3px;
  }
}
.course-detail__lead {
  width: 860px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .course-detail__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .course-detail__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.course-detail__contents {
  max-width: 860px;
  margin: 0 auto;
}
.course-detail__contents .faq-list dt {
  font-size: 14px;
  font-weight: bold;
  padding-left: 1.5em;
  position: relative;
  margin-top: 20px;
  margin-bottom: 10px;
}
.course-detail__contents .faq-list dt::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 14px;
  height: 14px;
  background: var(--site_blue);
  border-radius: 50%;
}
.course-detail__contents .faq-list dd {
  font-size: 14px;
  padding-bottom: 20px;
  border-bottom: var(--site_blue) dotted 1px;
}
.course-detail__contents .faq-list dd:last-child {
  border-bottom: none;
}
.course-detail__contents .faq-list a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}
.course-detail__contents .table-wrap {
  margin-bottom: 0px;
}
.course-detail__contents .table_dl {
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
  border-collapse: collapse;
  font-size: 14px;
  letter-spacing: 0.01em;
}
@media screen and (max-width: 768px) {
  .course-detail__contents .table_dl {
    width: 100%;
  }
}
.course-detail__contents .table_dl th {
  background: #505050;
  padding: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.course-detail__contents .table_dl tr:nth-child(even) {
  background: #f0f0f0;
}
.course-detail__contents .table_dl tr:nth-child(odd) {
  background: #f8f8f8;
}
.course-detail__contents .table_dl td {
  padding: 10px 1em;
  text-align: center;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  .course-detail__contents .table_dl td {
    white-space: nowrap;
  }
}
.course-detail__contents .table_dl tr > td:nth-child(2) {
  text-align: left;
}
@media screen and (max-width: 768px) {
  .course-detail__contents .table_dl tr > td:nth-child(4) {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.course-detail__contents .table_dl .dl {
  display: inline-block;
  padding-right: 1.2em;
  position: relative;
}
.course-detail__contents .table_dl .dl::after {
  position: absolute;
  top: 0.5em;
  right: 0;
  content: "";
  width: 12px;
  height: 10px;
  background: url(../../img/v2/common/icon_download_white.svg) no-repeat;
  background-size: contain;
}
.course-detail__contents .table_dl .pdf {
  display: inline-block;
  padding: 2px 1em;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background: #d6282f;
  border-radius: 5px;
}
.course-detail__contents .table_dl .mp3 {
  display: inline-block;
  padding: 2px 1em;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background: #0069af;
  border-radius: 5px;
}
@media screen and (max-width: 768px) {
  .course-detail__contents .table_dl .mp3 {
    display: block;
  }
}
.course-detail__contents .table_dl .mp3 + .mp3 {
  margin-left: 5px;
}
@media screen and (max-width: 768px) {
  .course-detail__contents .table_dl .mp3 + .mp3 {
    margin-left: 0;
    margin-top: 3px;
  }
}
.course-detail__contents .content {
  max-width: 860px;
  margin: 30px auto 0;
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .course-detail__contents .content {
    padding: 20px;
  }
}
@media screen and (max-width: 768px) {
  .course-detail__contents .content {
    max-width: 100%;
    width: 100%;
    padding: 10px;
  }
}
.course-detail__contents.original .content p {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}
.course-detail__contents.original .content a {
  display: block;
  max-width: 360px;
  width: 100%;
  margin: 0 auto;
}
.course-detail__contents.introductory .content h3, .course-detail__contents.beginner .content h3, .course-detail__contents.intermediate .content h3 {
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
}

/* freetext */
.lesson_course_freetext {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .lesson_course_freetext {
    padding-bottom: 60px;
  }
}

.page-head__title.page-course {
  background: url(../../img/v2/lesson_plan/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-course {
    background: url(../../img/v2/lesson_plan/page-title_bg.png) left 20% center no-repeat;
    background-size: cover;
  }
}

.table-wrap {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .table-wrap {
    overflow-x: scroll;
  }
}

.table_plan {
  width: 100%;
  border-collapse: collapse;
}
@media screen and (max-width: 500px) {
  .table_plan {
    width: 500px;
  }
}
.table_plan th {
  color: #fff;
  background: #505050;
  padding: 5px 0;
  border-right: #e2e2e2 solid 1px;
  vertical-align: middle;
}
.table_plan tr > th:last-child {
  border-right: none;
}
.table_plan td {
  color: #505050;
  font-size: 28px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  padding: 10px 0;
  vertical-align: middle;
}
@media screen and (max-width: 1024px) {
  .table_plan td {
    font-size: 24px;
  }
}
@media screen and (max-width: 768px) {
  .table_plan td {
    font-size: 16px;
  }
}
.table_plan td .fz-12,
.table_plan td .fz-14 {
  font-weight: normal;
}
@media screen and (max-width: 768px) {
  .table_plan td .fz-20 {
    font-size: 16px;
  }
}
.table_plan tr:nth-child(even) {
  background: #fff4f7;
}
.table_plan tr:nth-child(odd) {
  background: #fff;
}
.table_plan tr > td:nth-child(2) span.fz-12 {
  padding-top: 3px;
  display: block;
}

.plan-monthly {
  margin-bottom: 30px;
}
.plan-monthly .l-section__inner {
  padding: 30px 25px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .plan-monthly .l-section__inner {
    padding: 3vw 2.5vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .plan-monthly .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.plan-monthly .c-heading2.plan-monthly__head::before {
  width: 37px;
  height: 42px;
  background: url(../../img/v2/lesson_plan/monthly_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .plan-monthly .c-heading2.plan-monthly__head::before {
    width: 24.6px;
    height: 28px;
  }
}
.plan-monthly__lead {
  width: 685px;
  margin: 1.5em auto 2em;
  text-align: left;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .plan-monthly__lead {
    max-width: 685px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .plan-monthly__lead {
    max-width: 100%;
    width: 100%;
  }
}
.plan-monthly__contents {
  width: 100%;
  background: #f5b4c3;
  border-radius: 10px;
  padding: 15px 25px 25px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .plan-monthly__contents {
    padding: 3.906vw 2.604vw;
  }
}
.plan-monthly__contents::after {
  position: absolute;
  top: 7px;
  right: 32px;
  content: "";
  width: 149px;
  height: 72px;
  background: url(../../img/v2/lesson_plan/monthly_img_01.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .plan-monthly__contents::after {
    top: 0.7vw;
    right: 3.2vw;
    width: 14.9vw;
    height: 7.2vw;
  }
}
@media screen and (max-width: 768px) {
  .plan-monthly__contents::after {
    top: 3vw;
    right: 2vw;
    width: 14.9vw;
    height: 7.2vw;
  }
}
.plan-monthly__contents .title {
  margin: 0 auto 15px;
}
@media screen and (max-width: 768px) {
  .plan-monthly__contents .title {
    margin: 0 auto 15px 2%;
  }
}
.plan-monthly__contents .title h3 {
  width: 100%;
  color: #fff;
  font-size: 28px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .plan-monthly__contents .title h3 {
    font-size: 20px;
    text-align: left;
  }
}
@media screen and (max-width: 374px) {
  .plan-monthly__contents .title h3 {
    font-size: 16px;
  }
}
.plan-monthly__contents .title p {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .plan-monthly__contents .title p {
    font-size: 26px;
    text-align: left;
  }
}
.plan-monthly__contents .table_plan tr:nth-child(even) {
  background: #fff4f7;
}
.plan-monthly__contents .table_plan tr:nth-child(odd) {
  background: #fff;
}
.plan-monthly__contents .table_plan tr > td:nth-child(2) span.fz-12 {
  padding-top: 3px;
  display: block;
}
.plan-monthly__caution {
  margin-top: 30px;
  width: 860px;
  margin: 30px auto 0;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .plan-monthly__caution {
    width: 100%;
  }
}
.plan-monthly__caution p {
  color: var(--site_pink);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .plan-monthly__caution p {
    font-size: 14px;
  }
}
.plan-monthly__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_pink.svg) no-repeat;
  background-size: contain;
}
.plan-monthly__caution ul li {
  padding-left: 20px;
  position: relative;
  /* Stage D 修正(178): 注意事項リストのフォントを少し大きく */
  font-size: 14px;
  line-height: 1.85;
  margin-bottom: 4px;
}
@media screen and (max-width: 768px) {
  .plan-monthly__caution ul li {
    font-size: 13.5px;
  }
}
.plan-monthly__caution ul li::before {
  position: absolute;
  top: 0.45em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_pink.svg) no-repeat;
  background-size: contain;
}

.plan-point {
  margin-bottom: 30px;
}
.plan-point .l-section__inner {
  padding: 30px 25px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .plan-point .l-section__inner {
    padding: 3vw 2.5vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .plan-point .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.plan-point .c-heading2.plan-point__head::before {
  width: 42px;
  height: 42px;
  background: url(../../img/v2/lesson_plan/point_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .plan-point .c-heading2.plan-point__head::before {
    width: 28px;
    height: 28px;
  }
}
.plan-point__lead {
  width: 685px;
  margin: 1.5em auto 2em;
  text-align: left;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .plan-point__lead {
    max-width: 685px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .plan-point__lead {
    max-width: 100%;
    width: 100%;
  }
}
.plan-point__contents {
  width: 100%;
  background: #87b4e1;
  border-radius: 10px;
  padding: 15px 25px 25px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .plan-point__contents {
    padding: 1.953vw 3.255vw 3.255vw;
  }
}
.plan-point__contents::after {
  position: absolute;
  top: 15px;
  right: 62px;
  content: "";
  width: 97px;
  height: 63px;
  background: url(../../img/v2/lesson_plan/point_img_01.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 1024px) {
  .plan-point__contents::after {
    top: 1.5vw;
    right: 6.2vw;
    width: 9.7vw;
    height: 6.3vw;
  }
}
@media screen and (max-width: 768px) {
  .plan-point__contents::after {
    top: 3vw;
    right: 2vw;
    width: 9.7vw;
    height: 6.3vw;
  }
}
.plan-point__contents .title {
  margin: 0 auto 15px;
}
@media screen and (max-width: 768px) {
  .plan-point__contents .title {
    margin: 0 auto 15px 2%;
  }
}
.plan-point__contents .title h3 {
  width: 100%;
  color: #fff;
  font-size: 28px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .plan-point__contents .title h3 {
    text-align: left;
    font-size: 20px;
  }
}
@media screen and (max-width: 374px) {
  .plan-point__contents .title h3 {
    font-size: 16px;
  }
}
.plan-point__contents .title p {
  color: #fff;
  font-size: 36px;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .plan-point__contents .title p {
    font-size: 26px;
    text-align: left;
  }
}
@media screen and (max-width: 450px) {
  .plan-point__contents .table_plan {
    width: 450px;
  }
}
.plan-point__contents .table_plan tr:nth-child(even) {
  background: #eaf2fa;
}
.plan-point__contents .table_plan tr:nth-child(odd) {
  background: #fff;
}
.plan-point__caution {
  margin-top: 30px;
  width: 860px;
  margin: 30px auto 0;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .plan-point__caution {
    width: 100%;
  }
}
.plan-point__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .plan-point__caution p {
    font-size: 14px;
  }
}
.plan-point__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.plan-point__caution ul li {
  padding-left: 20px;
  position: relative;
  /* Stage D 修正(178): 注意事項リストのフォントを少し大きく */
  font-size: 14px;
  line-height: 1.85;
  margin-bottom: 4px;
}
@media screen and (max-width: 768px) {
  .plan-point__caution ul li {
    font-size: 13.5px;
  }
}
.plan-point__caution ul li::before {
  position: absolute;
  top: 0.45em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}

.page-head__title.page-timetables {
  background: url(../../img/v2/lesson_timetables/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-timetables {
    background-position: right 10% top;
  }
}
.page-head__title.page-timetables p {
  max-width: 585px;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-timetables p {
    max-width: 100%;
  }
}

.tutor-profile {
  margin-bottom: 30px;
}
.tutor-profile .c-heading2.tutor-profile__head::before {
  width: 33px;
  height: 49px;
  background: url(../../img/v2/home/tutor_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .tutor-profile .c-heading2.tutor-profile__head::before {
    width: 22px;
    height: 32.6px;
  }
}
.tutor-profile__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .tutor-profile__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .tutor-profile__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.tutor-profile__contents {
  background: #fff;
  border: #dcdcdc solid 1px;
}
.tutor-profile__contents h3.tutor-name {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background: var(--site_blue);
}
.tutor-profile__contents .row {
  padding: 20px 25px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
@media screen and (max-width: 1024px) {
  .tutor-profile__contents .row {
    padding: 10px;
    gap: 20px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-profile__contents .row {
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
  }
}
.tutor-profile__contents .row .col._01 {
  position: relative;
}
.tutor-profile__contents .row .col._01::after {
  position: absolute;
  top: 0;
  right: -15px;
  content: "";
  width: 1px;
  height: 100%;
  background: #e2e2e2;
}
@media screen and (max-width: 1024px) {
  .tutor-profile__contents .row .col._01::after {
    right: -10px;
  }
}
.tutor-profile__contents .row .col._01 .summary {
  overflow: hidden;
}
.tutor-profile__contents .row .col._01 .summary .image {
  float: left;
  margin: 0 14px 10px 6px;
  width: 110px;
  height: 110px;
  /* Stage D 修正(115): ハートを写真右上に重ねるため position:relative */
  position: relative;
}
.tutor-profile__contents .row .col._01 .summary .image img {
  /* Stage D 修正(116): 講師写真を丸に */
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
.tutor-profile__contents .row .col._01 .summary .image {
  /* Stage D 修正(115): お気に入りハートを写真の右上に白丸バッジで配置 */
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite {
  position: absolute;
  top: -6px;
  right: -8px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: #fff;
  border: none;
  border-radius: 50%;
  padding: 0;
  margin: 0;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
  transition: transform 0.15s ease;
  -webkit-filter: none;
  filter: none;
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite .heart-icon {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #6b8aa8;
  stroke-width: 1.6;
  stroke-linejoin: round;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s;
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite:hover {
  transform: scale(1.08);
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite:hover .heart-icon {
  stroke: #ff5a86;
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite.is-active .heart-icon {
  fill: #ff5a86;
  stroke: #ff5a86;
}
.tutor-profile__contents .row .col._01 .summary .image .btn_favorite:active {
  transform: scale(0.93);
}
.tutor-profile__contents .row .col._01 .summary .text .summary-list {
  font-weight: bold;
}
.tutor-profile__contents .row .col._01 .summary .text .rating {
  display: inline-block;
  width: 85px;
  height: 14px;
  vertical-align: middle;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-5 {
  background: url(../../img/v2/home/rank-5.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-4 {
  background: url(../../img/v2/home/rank-4.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-3 {
  background: url(../../img/v2/home/rank-3.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-2 {
  background: url(../../img/v2/home/rank-2.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-1 {
  background: url(../../img/v2/home/rank-1.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text .rating.star-0 {
  background: url(../../img/v2/home/rank-0.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .summary .text {
  /* Stage D 修正(83): ハート単体 (円枠なし) で表示 */
}
.tutor-profile__contents .row .col._01 .summary .text .btn_favorite {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 4px;
  box-shadow: none;
  transition: transform 0.15s ease;
  cursor: pointer;
}
.tutor-profile__contents .row .col._01 .summary .text .btn_favorite .heart-icon {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: #b8b8b8;
  stroke-width: 1.5;
  stroke-linejoin: round;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s;
}
.tutor-profile__contents .row .col._01 .summary .text .btn_favorite:hover .heart-icon {
  stroke: #ff5a86;
  transform: scale(1.1);
}
.tutor-profile__contents .row .col._01 .summary .text .btn_favorite.is-active .heart-icon {
  fill: #ff5a86;
  stroke: #ff5a86;
}
.tutor-profile__contents .row .col._01 .summary .text .btn_favorite:active {
  transform: scale(0.9);
}
.tutor-profile__contents .row .col._01 {
  /* 左列のお気に入りボタン下に表示する 自己紹介・講師近況 */
}
.tutor-profile__contents .row .col._01 .about-list--left {
  margin-top: 18px;
}
.tutor-profile__contents .row .col._01 .about-list--left .about {
  color: #0069af;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.7;
  padding-left: 23px;
  position: relative;
  margin-bottom: 5px;
}
.tutor-profile__contents .row .col._01 .about-list--left .about::before {
  position: absolute;
  top: 50%;
  left: 0;
  content: "";
  transform: translateY(-50%);
  width: 21px;
  height: 21px;
}
.tutor-profile__contents .row .col._01 .about-list--left .about._01::before {
  background: url(../../img/v2/lesson_timetables/icon_human.svg) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .about-list--left .about._03::before {
  background: url(../../img/v2/lesson_timetables/icon_megaphone.svg) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._01 .about-list--left dd {
  line-height: 1.5;
  padding-bottom: 8px;
  border-bottom: #e2e2e2 solid 1px;
}
.tutor-profile__contents .row .col._01 .about-list--left dd + dt {
  margin-top: 8px;
}
.tutor-profile__contents .row .col._02 .about-list .about {
  color: #0069af;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.7;
  padding-left: 23px;
  position: relative;
  margin-bottom: 5px;
}
.tutor-profile__contents .row .col._02 .about-list .about::before {
  position: absolute;
  top: 50%;
  left: 0;
  content: "";
  transform: translateY(-50%);
  width: 21px;
  height: 21px;
}
.tutor-profile__contents .row .col._02 .about-list .about._01::before {
  background: url(../../img/v2/lesson_timetables/icon_human.svg) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._02 .about-list .about._02::before {
  background: url(../../img/v2/lesson_timetables/icon_star.svg) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._02 .about-list .about._03::before {
  background: url(../../img/v2/lesson_timetables/icon_megaphone.svg) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .row .col._02 .about-list dd {
  line-height: 1.5;
}
.tutor-profile__contents .row .col._02 .about-list dd {
  padding-bottom: 8px;
  border-bottom: #e2e2e2 solid 1px;
}
.tutor-profile__contents .row .col._02 .about-list dd + dt {
  margin-top: 8px;
}
.tutor-profile__contents .row .col._02 .evaluate {
  margin-top: 15px;
}
.tutor-profile__contents .row .col._02 .evaluate .title {
  display: block;
  color: #0069af;
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 8px;
}
.tutor-profile__contents .row .col._02 .evaluate .evaluate-list {
  /* 評価メッセージは件数が多くなるため高さ固定 + 内部スクロール
     左列のプロフィール一覧（17項目+自己紹介+講師近況）と
     縦の長さがおおよそ揃うサイズに設定。
     講師ごとにプロフィール記述量は異なるため厳密一致は狙わず
     「だいたい同じ高さに見える」サイズに調整 */
  height: 720px;
  max-height: 85vh;
  overflow-y: scroll;
  overflow-x: hidden;
  padding: 12px 16px;
  background: #fff;
  border: #e2e2e2 solid 1px;
  border-radius: 4px;
  box-sizing: border-box;
  list-style: none;
}
@media screen and (max-width: 768px) {
  .tutor-profile__contents .row .col._02 .evaluate .evaluate-list {
    height: 320px;
    max-height: 60vh;
    padding: 10px 12px;
  }
}
.tutor-profile__contents .row .col._02 .evaluate .evaluate-list li {
  padding: 10px 0;
  border-bottom: #e2e2e2 solid 1px;
}
.tutor-profile__contents .row .col._02 .evaluate .evaluate-list li:last-child {
  border-bottom: none;
}
.tutor-profile__contents .row .col._02 .evaluate .evaluate-list .rating {
  display: block;
  margin-bottom: 5px;
}
.tutor-profile__contents .row .col._02 .evaluate .evaluate-list .message {
  line-height: 1.5;
}
.tutor-profile__contents .rating {
  display: inline-block;
  width: 85px;
  height: 14px;
}
@media screen and (max-width: 768px) {
  .tutor-profile__contents .rating {
    display: block;
  }
}
.tutor-profile__contents .rating.star-5 {
  background: url(../../img/v2/home/rank-5.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .rating.star-4 {
  background: url(../../img/v2/home/rank-4.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .rating.star-3 {
  background: url(../../img/v2/home/rank-3.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .rating.star-2 {
  background: url(../../img/v2/home/rank-2.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .rating.star-1 {
  background: url(../../img/v2/home/rank-1.png) no-repeat;
  background-size: contain;
}
.tutor-profile__contents .rating.star-0 {
  background: url(../../img/v2/home/rank-0.png) no-repeat;
  background-size: contain;
}

.tutor-timetable {
  border-top: #e6efff solid 1px;
  margin-bottom: 30px;
}
.tutor-timetable .bg_blue {
  padding-top: 30px;
  background: #f7faff;
  padding-bottom: 30px;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable .l-section__inner {
    padding-top: 30px;
  }
}
.tutor-timetable .c-heading2.tutor-timetable__head::before {
  width: 42px;
  height: 43px;
  background: url(../../img/v2/lesson_timetables/timetable_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .tutor-timetable .c-heading2.tutor-timetable__head::before {
    width: 28px;
    height: 28.6px;
  }
}
.tutor-timetable__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.tutor-timetable__contents .calendar {
  width: 556px;
  padding: 7px;
  background: #e8f1ff;
  border-radius: 5px;
  border: #e0e0e0 solid 1px;
  margin: 0 auto 30px;
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .calendar {
    max-width: 556px;
    width: 100%;
  }
}
.tutor-timetable__contents .calendar .row {
  background: #fff;
  border: #d1d1d1 solid 1px;
  border-radius: 5px;
  padding: 15px 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .calendar .row {
    grid-template-rows: auto auto;
    grid-template-columns: 100%;
  }
}
.tutor-timetable__contents .calendar .row .col .month {
  display: block;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding-bottom: 5px;
  border-bottom: #b2b2b2 solid 1px;
}
.tutor-timetable__contents .calendar .row .col .table_calendar {
  width: 100%;
  border-collapse: separate;
  border-spacing: 3px;
}
.tutor-timetable__contents .calendar .row .col .table_calendar th {
  padding: 10px 0;
  font-size: 14px;
  font-weight: normal;
}
.tutor-timetable__contents .calendar .row .col .table_calendar td {
  font-size: 14px;
  background: #f4f4f4;
  padding: 5px 0;
  text-align: center;
}
.tutor-timetable__contents .calendar .row .col .table_calendar tr > td:nth-child(1).date {
  color: #fff;
  background: #de2246;
}
.tutor-timetable__contents .calendar .row .col .table_calendar tr > td:nth-child(7).date {
  color: #fff;
  background: #007ebc;
}
.tutor-timetable__contents .timetable .table-wrap {
  width: 100%;
  /*overflow-x: scroll;*/
}
.tutor-timetable__contents .timetable .table_timetable {
  width: 100%;
  border-collapse: collapse;
}
.tutor-timetable__contents .timetable .table_timetable th {
  background: #0078d7;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  padding: 5px 0;
  border-right: #e0e0e0 solid 1px;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable th {
    font-size: 12px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable th {
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable th:last-child {
  border-right: none;
}
.tutor-timetable__contents .timetable .table_timetable tbody tr:nth-of-type(odd) {
  background: #e8f1ff;
}
.tutor-timetable__contents .timetable .table_timetable tbody tr:nth-of-type(even) {
  background: #fff;
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  width: 13%;
  padding: 3px;
  border-right: #e0e0e0 solid 1px;
  vertical-align: middle;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td {
    padding: 2px;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a, .tutor-timetable__contents .timetable .table_timetable tbody td span {
    white-space: nowrap;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td:last-child {
  border-right: none;
}
.tutor-timetable__contents .timetable .table_timetable tbody td span.close {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #505050;
  border-radius: 3px;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.close {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.close {
    width: auto;
    height: 26.4px;
    line-height: 26px;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.booking {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #f7bb67;
  border-radius: 3px;
  box-shadow: 0 1px 2px rgba(180, 120, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.booking:hover {
  animation: booking-shake 0.4s ease;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.booking {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.booking {
    height: 26px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* Stage D 修正(263): B65 用キーフレーム。hover 時に左右へ
   *   ±2px 振動して「揺れる」演出を出す。 */
}
@keyframes booking-shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-2px);
  }
  75% {
    transform: translateX(2px);
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* Stage D 修正(200): キャンセルボタンの色定義
   *   現状 .cancel に CSS が無く真っ白で出ていたため、
   *   .booking と同サイズ (124×34px) で青系グラデーションに統一。
   *   .now (レッスン中, solid site_blue) と区別できるよう
   *   グラデ + box-shadow で立体感を出す。 */
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.cancel {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  border-radius: 3px;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transition: filter 0.15s ease;
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.cancel:hover {
  filter: brightness(0.92);
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.cancel {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.cancel {
    height: 26px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* 予約済み (span.reserved): グレー＋白文字 */
}
.tutor-timetable__contents .timetable .table_timetable tbody td span.reserved {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: #999;
  border-radius: 3px;
  cursor: default;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.reserved {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.reserved {
    height: 26.4px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* Stage D 修正(194): 講師ビューで予約済みスロット表示用
   *   span.reserved + tutor-reserved → サイズはそのまま、色を青グラデに */
}
.tutor-timetable__contents .timetable .table_timetable tbody td span.reserved.tutor-reserved {
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* レッスン中 (span.now): 青系で進行中を示す */
}
.tutor-timetable__contents .timetable .table_timetable tbody td span.now {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: var(--site_blue, #0078d7);
  border-radius: 3px;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.now {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td span.now {
    height: 26.4px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* 講師ビュー: 現在クローズ (slot-closed) → クリックでオープン
     白bg + グレー枠 + ダークグレー文字 (控えめな "閉" 状態)
     ラベル表記は "クローズ" (現在の状態を示す) */
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 30px;
  color: #555;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: #fff;
  border: 2px solid #c8c8c8;
  border-radius: 3px;
  box-sizing: border-box;
  transition: background 0.15s ease, color 0.15s ease;
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.slot-closed:hover {
  background: #f5f5f5;
  color: #333;
  border-color: #999;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
    height: 26.4px;
    line-height: 22.4px;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody td {
  /* 講師ビュー: 現在オープン (slot-opened) → クリックでクローズ
     オレンジ系で「受付中」を強調 (現行版踏襲)
     ラベル表記は "オープン" (現在の状態を示す) */
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
  display: block;
  width: 124px;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: #f99a40;
  border-radius: 3px;
  transition: background 0.15s ease;
}
.tutor-timetable__contents .timetable .table_timetable tbody td a.slot-opened:hover {
  background: #e8862a;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
    height: 26.4px;
    line-height: 26px;
    font-size: 10px;
  }
}
.tutor-timetable__contents .timetable .table_timetable tbody tr > td:nth-child(1) {
  width: 8%;
  color: var(--site_blue);
  font-size: 14px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .tutor-timetable__contents .timetable .table_timetable tbody tr > td:nth-child(1) {
    width: auto;
    font-size: 10px;
  }
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable .fixed {
    position: sticky;
    left: 0;
    z-index: 1;
  }
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__contents .timetable .table_timetable .fixed:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-right: 1px solid #e0e0e0;
  }
}
.tutor-timetable__contents .timetable .table_timetable .fixed.w {
  background: #fff;
}
.tutor-timetable__contents .timetable .table_timetable .fixed.b {
  background: #e8f1ff;
}
.tutor-timetable__contents .timetable .table_timetable .fixed.head {
  background: #0078d7;
}
.tutor-timetable__caution {
  width: 100%;
  padding: 30px 70px 0;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .tutor-timetable__caution {
    width: 100%;
    padding-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .tutor-timetable__caution {
    padding: 0;
  }
}
.tutor-timetable__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
.tutor-timetable__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.tutor-timetable__caution ul li {
  padding-left: 20px;
  position: relative;
}
.tutor-timetable__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
.tutor-timetable__caution ul li a {
  color: #3fa9f5;
  font-weight: bold;
  text-decoration: underline;
}

.page-head__title.page-tutors {
  background: url(../../img/v2/lesson_tutors/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-tutors {
    background-position: left 20% top;
  }
}
.page-head__title.page-tutors p {
  max-width: 585px;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-tutors p {
    display: none;
  }
}

.tutor-about {
  margin-bottom: 30px;
}
.tutor-about .c-heading2.tutor-about__head::before {
  width: 33px;
  height: 49px;
  background: url(../../img/v2/home/tutor_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .tutor-about .c-heading2.tutor-about__head::before {
    width: 22px;
    height: 32.6px;
  }
}
.tutor-about__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: left;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .tutor-about__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .tutor-about__lead {
    max-width: 100%;
    width: 100%;
  }
}

.tutor-list {
  border-top: #e6efff solid 1px;
  padding-top: 30px;
  /* Stage D 修正(93): 講師全体を覆っていた淡い青背景 (#f7faff) を白に */
  background: #fff;
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: #e6efff solid 1px;
}
.tutor-list .c-heading2.tutor-list__head::before {
  width: 61px;
  height: 48px;
  background: url(../../img/v2/lesson_tutors/list_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .tutor-list .c-heading2.tutor-list__head::before {
    width: 40.6px;
    height: 32px;
  }
}
.tutor-list__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .tutor-list__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .tutor-list__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.tutor-list__search .table_search {
  max-width: 790px;
  width: 100%;
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 0;
  border: #e0e0e0 solid 1px;
  border-radius: 5px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .tutor-list__search .table_search {
    max-width: 100%;
    width: 100%;
  }
}
.tutor-list__search .table_search th {
  width: 125px;
  background: #0078d7;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  padding: 5px 10px 5px 20px;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .tutor-list__search .table_search th {
    width: 100%;
    display: block;
    padding: 10px;
  }
}
.tutor-list__search .table_search td {
  background: #e8f1ff;
  padding: 5px 10px 5px 15px;
}
@media screen and (max-width: 768px) {
  .tutor-list__search .table_search td {
    display: block;
    width: 100%;
    padding: 10px;
    overflow: hidden;
  }
}
.tutor-list__search .table_search tr:first-child > th,
.tutor-list__search .table_search tr:first-child > td {
  padding-top: 10px;
}
.tutor-list__search .table_search tr:last-child > th,
.tutor-list__search .table_search tr:last-child > td {
  padding-bottom: 15px;
}
@media screen and (max-width: 768px) {
  .tutor-list__search .table_search tr:last-child > th,
  .tutor-list__search .table_search tr:last-child > td {
    padding-bottom: 10px;
  }
}
.tutor-list__search .table_search .row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}
@media screen and (max-width: 1024px) {
  .tutor-list__search .table_search .row {
    flex-direction: column;
    align-items: flex-start;
  }
}
.tutor-list__search .table_search .row .row_inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}
.tutor-list__search input[type=text],
.tutor-list__search input[type=date] {
  width: 200px;
  border: #c9c9c9 solid 1px;
  background: #fff;
  border-radius: 5px;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .tutor-list__search input[type=text],
  .tutor-list__search input[type=date] {
    width: 100%;
  }
}
.tutor-list__search select {
  border: #c9c9c9 solid 1px;
  border-radius: 5px;
  padding: 10px;
  max-width: 100%;
  width: 100%;
}
.tutor-list__search .date1, .tutor-list__search .date2 {
  display: flex;
  gap: 10px;
}
.tutor-list__search .btnBox {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  gap: 10px;
}
.tutor-list__search input[type=submit],
.tutor-list__search input[type=button] {
  width: 82px;
  height: 24px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  text-align: center;
  border-radius: 3px;
  outline: none;
  border: none;
  /* Stage D 修正(203): クリック可能であることを視覚的に明示
   *   旧: cursor / hover / transition いずれもなく押せるか判別不能だった */
  cursor: pointer;
  transition: filter 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.tutor-list__search input[type=submit]:hover,
.tutor-list__search input[type=button]:hover {
  filter: brightness(1.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.tutor-list__search input[type=submit]:active,
.tutor-list__search input[type=button]:active {
  filter: brightness(0.92);
  transform: translateY(1px);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}
.tutor-list__search input[type=submit]:focus-visible,
.tutor-list__search input[type=button]:focus-visible {
  outline: 2px solid #66b3ff;
  outline-offset: 2px;
}
.tutor-list__search .btnSearch {
  background: #0069af;
}
.tutor-list__search .btnClear {
  background: #000;
}
.tutor-list__caution {
  padding-top: 20px;
  width: 790px;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .tutor-list__caution {
    width: 100%;
  }
}
.tutor-list__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
.tutor-list__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.tutor-list__caution ul li {
  padding-left: 20px;
  position: relative;
}
.tutor-list__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
.tutor-list__caution ul li a {
  color: #3fa9f5;
  font-weight: bold;
  text-decoration: underline;
}
.tutor-list__contents {
  margin-top: 30px;
}

/* Stage D 修正(139): main.lesson_tutors にスコープして他ページへの漏れを防止
 *   原因: ここの .tutor-box が無スコープでグローバル定義されていたため、
 *   同じクラス名を使う students/favorite_tutors.ctp (main.favorite_tutors)
 *   のレイアウトを破壊していた。
 *   修正(87) で .favorite_tutors 側をスコープしたが、こちら側もスコープが必要。
 */
main.lesson_tutors .tutor-box {
  display: grid;
  /*grid-template-columns: repeat(6, 1fr);*/
  grid-template-columns: repeat(6, 1fr);
  gap: 5px;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (max-width: 500px) {
  main.lesson_tutors .tutor-box {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 374px) {
  main.lesson_tutors .tutor-box {
    grid-template-columns: repeat(2, 1fr);
  }
}
main.lesson_tutors .tutor-box {
  /* Stage D 修正(93): 講師カードを案 21 系「Glassmorphism」に刷新 (白背景版)
   *   - 外側 (.tutor-list / .tutor-box) は白
   *   - .col は透明な青で「ガラスっぽい」表現 (rgba 青 + 軽いブラー)
   *   - h3 (講師名) の濃い青ベタを廃止し色文字で表示
   *   - 予約ボタンは半透明ホワイトのピル形状 (案 21 オリジナル仕様)
   *   元に戻すには本コミット 1 件を git revert HEAD で取り消し可能。
   */
}
main.lesson_tutors .tutor-box .col {
  position: relative;
  background: rgba(161, 196, 253, 0.08);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid #9cc0f0;
  border-radius: 14px;
  /* Stage D 修正(107): popular-badge を外にはみ出させるため overflow:visible */
  overflow: visible;
  box-shadow: 0 4px 14px rgba(31, 38, 135, 0.08);
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
  display: flex;
  flex-direction: column;
}
main.lesson_tutors .tutor-box .col:hover {
  transform: translateY(-3px);
  border-color: #5a9be8;
  box-shadow: 0 8px 20px rgba(31, 38, 135, 0.15);
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(107): 人気/超人気 ランキングバッジ (左上にはみ出す) */
}
main.lesson_tutors .tutor-box .col .popular-badge {
  position: absolute;
  top: -8px;
  left: 8px;
  z-index: 3;
  color: #fff;
  font-size: 10px;
  font-weight: bold;
  letter-spacing: 0.06em;
  padding: 3px 9px;
  border-radius: 99px;
  white-space: nowrap;
}
main.lesson_tutors .tutor-box .col .popular-badge::before {
  content: "★ ";
  font-size: 9px;
}
main.lesson_tutors .tutor-box .col .popular-badge.super {
  background: #ff5a86;
  box-shadow: 0 2px 6px rgba(255, 90, 134, 0.45);
}
main.lesson_tutors .tutor-box .col .popular-badge.normal {
  background: #ee7a23;
  box-shadow: 0 2px 6px rgba(238, 122, 35, 0.4);
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col .popular-badge {
    font-size: 9px;
    padding: 2px 7px;
  }
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(107): 国・都市 */
}
main.lesson_tutors .tutor-box .col .country {
  font-size: 10px;
  color: #666;
  margin: 2px 0 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3px;
  line-height: 1.2;
}
main.lesson_tutors .tutor-box .col .country .flag {
  font-size: 12px;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col .country {
    font-size: 9px;
  }
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(107): 自己紹介を 2 行クランプ */
}
main.lesson_tutors .tutor-box .col p.intro {
  font-size: 10px;
  color: #555;
  font-weight: normal;
  line-height: 1.4;
  text-align: left;
  padding: 0 8px;
  margin: 4px 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 30px;
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(106): 名前が長い時に縮小して 1 行に収める */
}
main.lesson_tutors .tutor-box .col h3 {
  background: transparent;
  color: #1a3a72;
  font-size: 15px;
  font-weight: 700;
  padding: 12px 8px 4px;
  height: auto;
  line-height: 1.3;
  text-align: center;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col h3 {
    font-size: 13px;
    padding: 10px 6px 4px;
  }
}
main.lesson_tutors .tutor-box .col h3.tname-long {
  font-size: 13px;
  letter-spacing: -0.02em;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col h3.tname-long {
    font-size: 11px;
  }
}
main.lesson_tutors .tutor-box .col h3.tname-xlong {
  font-size: 11px;
  letter-spacing: -0.04em;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col h3.tname-xlong {
    font-size: 10px;
  }
}
main.lesson_tutors .tutor-box .col dl {
  padding: 0 12px 4px;
  text-align: center;
  font-size: 11px;
  color: #335;
}
main.lesson_tutors .tutor-box .col dl dt, main.lesson_tutors .tutor-box .col dl dd {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
}
main.lesson_tutors .tutor-box .col dl dt {
  color: #557;
  margin-right: 2px;
}
main.lesson_tutors .tutor-box .col dl dd {
  margin-right: 8px;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col dl {
    padding: 0 6px 4px;
    font-size: 10px;
  }
}
main.lesson_tutors .tutor-box .col .rating {
  margin-top: -5px;
  display: inline-block;
  width: 85px;
  height: 14px;
  vertical-align: middle;
}
@media screen and (max-width: 500px) {
  main.lesson_tutors .tutor-box .col .rating {
    width: 17vw;
    height: 2.8vw;
  }
}
main.lesson_tutors .tutor-box .col .rating.star-5 {
  background: url(../../img/v2/home/rank-5.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col .rating.star-4 {
  background: url(../../img/v2/home/rank-4.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col .rating.star-3 {
  background: url(../../img/v2/home/rank-3.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col .rating.star-2 {
  background: url(../../img/v2/home/rank-2.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col .rating.star-1 {
  background: url(../../img/v2/home/rank-1.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col .rating.star-0 {
  background: url(../../img/v2/home/rank-0.png) no-repeat;
  background-size: contain;
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(105): 写真を丸 + 案 E20 風の白丸ハートバッジに統一
   *   /timetables/reserveTutorsLesson と見た目を揃える。
   */
}
main.lesson_tutors .tutor-box .col figure {
  padding: 6px 3px 0;
  text-align: center;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap {
  position: relative;
  display: inline-block;
  width: 90%;
  max-width: 100px;
  line-height: 0;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap img {
  width: 100%;
  max-width: 100px;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap .favorite {
  position: absolute;
  top: -6px;
  right: -8px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: #fff;
  border: none;
  border-radius: 50%;
  padding: 0;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s ease;
  -webkit-filter: none;
  filter: none;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap .favorite .heart-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #6b8aa8;
  stroke-width: 1.6;
  stroke-linejoin: round;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap .favorite:hover {
  transform: scale(1.08);
}
main.lesson_tutors .tutor-box .col figure .photo-wrap .favorite:hover .heart-icon {
  stroke: #ff5a86;
}
main.lesson_tutors .tutor-box .col figure .photo-wrap .favorite.is-active .heart-icon {
  fill: #ff5a86;
  stroke: #ff5a86;
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(105): 自己紹介の太字を解除 */
}
main.lesson_tutors .tutor-box .col p {
  padding: 3px 3px 5px 3px;
  font-weight: normal;
}
main.lesson_tutors .tutor-box .col .more {
  display: inline-block;
  color: var(--site_blue);
  text-decoration: underline;
}
main.lesson_tutors .tutor-box .col {
  /* Stage D 修正(93): 予約ボタンを Glassmorphism のピル形状に */
}
main.lesson_tutors .tutor-box .col .btn {
  padding: 6px 10px 12px;
}
main.lesson_tutors .tutor-box .col .btn .booking {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 9px 8px;
  color: #1a3a72;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 0.04em;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 10px rgba(31, 38, 135, 0.15);
  transition: background 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
}
@media screen and (max-width: 768px) {
  main.lesson_tutors .tutor-box .col .btn .booking {
    font-size: 12px;
    padding: 8px 6px;
  }
}
main.lesson_tutors .tutor-box .col .btn .booking:hover {
  background: #fff;
  box-shadow: 0 6px 14px rgba(31, 38, 135, 0.22);
}
main.lesson_tutors .tutor-box .col .btn .booking:active {
  transform: translateY(1px);
  box-shadow: 0 2px 6px rgba(31, 38, 135, 0.15);
}

.tutor-beginner {
  margin-bottom: 30px;
}
.tutor-beginner .c-heading2.tutor-beginner__head::before {
  width: 34px;
  height: 45px;
  background: url(../../img/v2/lesson_tutors/biginner_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .tutor-beginner .c-heading2.tutor-beginner__head::before {
    width: 22.6px;
    height: 30px;
  }
}
.tutor-beginner__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .tutor-beginner__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .tutor-beginner__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}

main.payment {
  background: #f6f6f6;
}

.page-head__title.page-payment {
  background: url(../../img/v2/payment/page-title_bg.jpg) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-payment {
    background-position: left 10% top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.payment-plan {
  width: 100%;
}
.payment-plan .plan-title {
  width: 100%;
  background: var(--base_color);
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 30px;
  line-height: 30px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-title {
    font-size: 2.3vw;
  }
}
.payment-plan .plan-title .name {
  border-right: #fff solid 2px;
  padding-right: 45px;
  text-align: right;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-title .name {
    padding-right: 4.5vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-title .name {
    padding-right: 15px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-title .name {
    padding-left: 10px;
    text-align: left;
  }
}
.payment-plan .plan-title .price {
  padding-left: 45px;
  text-align: left;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-title .price {
    padding-left: 4.5vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-title .price {
    padding-left: 15px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-title .price {
    padding-left: 10px;
  }
}
.payment-plan .plan-list {
  font-size: 14px;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list {
    font-size: 1.4vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list {
    font-size: 12px;
  }
}
.payment-plan .plan-list .row {
  height: 60px;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row {
    height: auto;
  }
}
.payment-plan .plan-list .row:nth-child(even) {
  background: #fff;
}
.payment-plan .plan-list .row:nth-child(odd) {
  background: #fff4f7;
}
.payment-plan .plan-list .row.upper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.upper {
    height: 60px;
    grid-template-columns: auto auto;
  }
}
.payment-plan .plan-list .row.upper .name {
  padding-right: 35px;
  text-align: right;
  border-right: #fff solid 2px;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.upper .name {
    padding-right: 3.5vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.upper .name {
    padding-right: 15px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.upper .name {
    padding: 0 10px;
    text-align: left;
  }
}
.payment-plan .plan-list .row.upper .price {
  padding-right: 155px;
  text-align: right;
  line-height: 1.1;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.upper .price {
    padding-right: 0;
    padding-left: 3.5vw;
    text-align: left;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.upper .price {
    padding-left: 15px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.upper .price {
    padding: 0 10px;
  }
}
.payment-plan .plan-list .row.lower {
  /* Stage D 修正(318): 購入ボタン行(白背景)の高さを可変にし、
     ul に上下パディングを追加。ボタンが行の縁に密着して
     すぐ下のピンク背景(.payment-***__contents)と重なって
     見えるのを防ぐ。 */
  height: auto;
}
.payment-plan .plan-list .row.lower ul {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 9px 0;
  min-height: 60px;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.lower ul {
    height: auto;
    padding: 10px;
    flex-direction: column;
    align-items: flex-start;
  }
}
.payment-plan .plan-list .row.lower ul li {
  /* Stage D 修正(314): 5セルを等幅にし、各セルを縦中央寄せの
     flex カラムに。ラベルと購入ボタンの配置を全列で揃える。 */
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 14px;
  padding: 0 8px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.lower ul li {
    font-size: 1.4vw;
    padding: 0 1vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.lower ul li {
    font-size: 11px;
    padding: 0 5px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.lower ul li {
    flex: 0 0 auto;
    width: 100%;
    align-items: flex-start;
    padding: 5px;
  }
}
.payment-plan .plan-list .row.lower ul li::after {
  position: absolute;
  top: 50%;
  right: 0;
  content: "";
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: #e2e2e2;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.lower ul li::after {
    content: none;
  }
}
.payment-plan .plan-list .row.lower ul li:last-child::after {
  content: none;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.lower ul li::before {
    position: absolute;
    top: 50%;
    left: -10px;
    transform: translateY(-50%);
    content: "・";
    font-size: 20px;
  }
}
.payment-plan .plan-list .row.lower ul li span {
  display: block;
  text-align: center;
}
@media screen and (max-width: 450px) {
  .payment-plan .plan-list .row.lower ul li span {
    display: inline-block;
  }
}
.payment-plan .plan-list .row.lower ul li a {
  display: inline-block;
  color: #fff;
  padding: 3px 10px;
  border-radius: 5px;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.lower ul li a {
    padding: 0.3vw 1vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.lower ul li a {
    padding: 2px 5px;
  }
}
.payment-plan .plan-list .row.lower ul li {
  /* PayPal は CakePHP の <form> でボタンが包まれているため、
     form を display:contents にしてボタンを直接の子として扱い、
     他セル(<a> / ウィジェット)と配置を揃える。 */
}
.payment-plan .plan-list .row.lower ul li form {
  display: contents;
}
.payment-plan .plan-list .row.lower ul li {
  /* Stage D 修正(316): 購入ボタンを「支払方法別カラー＋
     ホバー光沢」(候補HTML 06 ブライト春色) に変更。
     クレカ=ピンク / PayPal=青 / 銀行振込=橙 / 微信=緑 /
     支付宝=明るい青。サイズ・形は全列共通のまま。 */
}
.payment-plan .plan-list .row.lower ul li a,
.payment-plan .plan-list .row.lower ul li button {
  display: inline-block;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  margin: 0;
  min-width: 96px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  white-space: nowrap;
  text-align: center;
  padding: 5px 14px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  text-decoration: none;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.lower ul li a,
  .payment-plan .plan-list .row.lower ul li button {
    min-width: 0;
    font-size: 1.3vw;
    padding: 0.5vw 1vw;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.lower ul li a,
  .payment-plan .plan-list .row.lower ul li button {
    font-size: 12px;
    padding: 4px 8px;
  }
}
.payment-plan .plan-list .row.lower ul li {
  /* ホバー時に光沢が走るエフェクト。
     pointer-events:none で購入クリックを妨げない。 */
}
.payment-plan .plan-list .row.lower ul li a::after,
.payment-plan .plan-list .row.lower ul li button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -130%;
  width: 55%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.6), transparent);
  transform: skewX(-20deg);
  transition: left 0.55s ease;
}
.payment-plan .plan-list .row.lower ul li a:hover::after,
.payment-plan .plan-list .row.lower ul li button:hover::after {
  left: 140%;
}
.payment-plan .plan-list .row.lower ul li {
  /* 支払方法別カラー (候補06 ブライト春色) */
}
.payment-plan .plan-list .row.lower ul li.paypal a, .payment-plan .plan-list .row.lower ul li.paypal button {
  background: #2d7dd2;
}
.payment-plan .plan-list .row.lower ul li.bank a, .payment-plan .plan-list .row.lower ul li.bank button {
  background: #ff912b;
}
.payment-plan .plan-list .row.lower ul li.wechat a, .payment-plan .plan-list .row.lower ul li.wechat button {
  background: #3cb371;
}
.payment-plan .plan-list .row.lower ul li.alipay a, .payment-plan .plan-list .row.lower ul li.alipay button {
  background: #3fb6f0;
}
.payment-plan .plan-list .row.lower ul li {
  /* クレジットカード = UnivaPay ウィジェット。インライン
     スタイルを !important で上書きし、ピンク＋共通サイズに。 */
}
.payment-plan .plan-list .row.lower ul li.card button {
  background: #ff5e9c !important;
  color: #fff !important;
  border: none !important;
  border-radius: 5px !important;
  font-size: 14px !important;
  font-weight: bold !important;
  line-height: 1.5 !important;
  padding: 5px 14px !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
@media screen and (max-width: 1024px) {
  .payment-plan .plan-list .row.lower ul li.card button {
    font-size: 1.3vw !important;
    padding: 0.5vw 1vw !important;
  }
}
@media screen and (max-width: 768px) {
  .payment-plan .plan-list .row.lower ul li.card button {
    font-size: 12px !important;
    padding: 4px 8px !important;
  }
}
.payment-plan .fz-12 {
  font-size: 12px;
}
@media screen and (max-width: 768px) {
  .payment-plan .fz-12 {
    font-size: 11px;
  }
}
.payment-plan .fz-20 {
  font-size: 20px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .payment-plan .fz-20 {
    font-size: 16px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .fz-20 {
    font-size: 14px;
  }
}
.payment-plan .fz-28 {
  font-size: 28px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .payment-plan .fz-28 {
    font-size: 20px;
  }
}
@media screen and (max-width: 450px) {
  .payment-plan .fz-28 {
    font-size: 16px;
  }
}

.payment-point .plan-list .row:nth-child(even) {
  background: #fff;
}
.payment-point .plan-list .row:nth-child(odd) {
  background: #eaf2fa;
}
.payment-point .plan-list .name {
  line-height: 1;
}

.payment-receipt .plan-list .row:nth-child(even) {
  background: #fff;
}
.payment-receipt .plan-list .row:nth-child(odd) {
  background: #eaf2fa;
}
.payment-receipt .plan-list .row.upper .price {
  padding-right: 230px;
  text-align: right;
  line-height: 1.1;
}
@media screen and (max-width: 1024px) {
  .payment-receipt .plan-list .row.upper .price {
    padding-right: 23vw;
  }
}

.payment-monthly {
  margin-bottom: 30px;
}
.payment-monthly .l-section__inner {
  background: #fff;
  padding: 30px 25px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .payment-monthly .l-section__inner {
    padding: 3vw 2.5vw;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .payment-monthly .l-section__inner {
    padding: 3.906vw 2.604vw;
  }
}
.payment-monthly .c-heading2.payment-monthly__head::before {
  width: 37px;
  height: 42px;
  background: url(../../img/v2/payment/monthly_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .payment-monthly .c-heading2.payment-monthly__head::before {
    width: 24.6px;
    height: 28px;
  }
}
.payment-monthly__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .payment-monthly__lead {
    max-width: 650px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .payment-monthly__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.payment-monthly__contents {
  width: 100%;
  background: #f5b4c3;
  border-radius: 10px;
  padding: 15px 25px 25px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .payment-monthly__contents {
    padding: 3.906vw 2.604vw;
  }
}
.payment-monthly__contents .title {
  margin: 0 auto 15px;
}
@media screen and (max-width: 768px) {
  .payment-monthly__contents .title {
    margin: 0 auto 15px 2%;
  }
}
.payment-monthly__contents .title h3 {
  width: 149px;
  height: 72px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .payment-monthly__contents .title h3 {
    width: 21.912vw;
    height: 10.588vw;
  }
}
.payment-monthly__caution {
  width: 100%;
  margin: 30px auto 0;
  padding: 0 30px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .payment-monthly__caution {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .payment-monthly__caution {
    padding: 0;
  }
}
.payment-monthly__caution p {
  color: var(--site_pink);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .payment-monthly__caution p {
    font-size: 13px;
  }
}
.payment-monthly__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_pink.svg) no-repeat;
  background-size: contain;
}
.payment-monthly__caution ul li {
  padding-left: 20px;
  position: relative;
}
.payment-monthly__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_pink.svg) no-repeat;
  background-size: contain;
}
.payment-monthly__caution ul li a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}

.payment-point {
  margin-bottom: 30px;
}
.payment-point .l-section__inner {
  background: #fff;
  padding: 30px 25px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .payment-point .l-section__inner {
    padding: 3vw 2.5vw;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .payment-point .l-section__inner {
    padding: 3.906vw 2.604vw;
  }
}
.payment-point .c-heading2.payment-point__head::before {
  width: 37px;
  height: 42px;
  background: url(../../img/v2/payment/point_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .payment-point .c-heading2.payment-point__head::before {
    width: 24.6px;
    height: 28px;
  }
}
.payment-point__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .payment-point__lead {
    max-width: 650px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .payment-point__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.payment-point__contents {
  width: 100%;
  background: #87b4e1;
  border-radius: 10px;
  padding: 15px 25px 25px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .payment-point__contents {
    padding: 3.906vw 2.604vw;
  }
}
.payment-point__contents .title {
  margin: 0 auto 15px;
}
@media screen and (max-width: 768px) {
  .payment-point__contents .title {
    margin: 0 auto 15px 2%;
  }
}
.payment-point__contents .title h3 {
  width: 97px;
  height: 63px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .payment-point__contents .title h3 {
    width: 14.265vw;
    height: 9.265vw;
  }
}
.payment-point__caution {
  width: 100%;
  margin: 30px auto 0;
  padding: 0 30px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .payment-point__caution {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .payment-point__caution {
    padding: 0;
  }
}
.payment-point__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .payment-point__caution p {
    font-size: 13px;
  }
}
.payment-point__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.payment-point__caution ul li {
  padding-left: 20px;
  position: relative;
}
.payment-point__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
.payment-point__caution ul li a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}

.payment-receipt {
  margin-bottom: 30px;
}
.payment-receipt .l-section__inner {
  padding: 0 25px 30px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .payment-receipt .l-section__inner {
    padding: 3vw 2.5vw;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .payment-receipt .l-section__inner {
    padding: 3.906vw 2.604vw;
  }
}
.payment-receipt .c-heading2.payment-receipt__head::before {
  width: 31px;
  height: 38px;
  background: url(../../img/v2/payment/receipt_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .payment-receipt .c-heading2.payment-receipt__head::before {
    width: 20.6px;
    height: 25.3px;
  }
}
.payment-receipt__lead {
  width: 650px;
  margin: 1.5em auto 1em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .payment-receipt__lead {
    max-width: 650px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .payment-receipt__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.payment-receipt__lead a {
  color: var(--site_blue);
  text-decoration: underline;
}
.payment-receipt__caution {
  width: 100%;
  margin: 30px auto 0;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .payment-receipt__caution {
    width: 100%;
  }
}
.payment-receipt__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 374px) {
  .payment-receipt__caution p {
    font-size: 13px;
  }
}
.payment-receipt__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.payment-receipt__caution ul li {
  padding-left: 20px;
  position: relative;
}
.payment-receipt__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
.payment-receipt__caution ul li a {
  color: var(--site_blue);
  font-weight: bold;
  text-decoration: underline;
}

/* Stage D 修正(317): 月額・ポイントプランの最下部ボタン行と注意事項
 *   ブロックが近接し、ピンク背景の注意書きとボタンが詰まって見えるため、
 *   注意事項ブロックの上マージンを広げて間隔を確保する。
 *   （領収書・受講証明書セクションは対象外） */
.payment-monthly__caution,
.payment-point__caution {
  margin-top: 60px;
}
@media screen and (max-width: 768px) {
  .payment-monthly__caution,
  .payment-point__caution {
    margin-top: 40px;
  }
}

.page-head__title.page-register1 {
  background: url(../../img/v2/register/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-register1 {
    background: url(../../img/v2/register/page-title01_bg.png) left 20% center no-repeat;
    background-size: cover;
  }
}
.page-head__title.page-register2 {
  background: url(../../img/v2/register/page-title02_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-register2 {
    background: url(../../img/v2/register/page-title02_bg.png) right 20% center no-repeat;
    background-size: cover;
  }
}

.register {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .register {
    padding-bottom: 60px;
  }
}

.register-info {
  margin-bottom: 30px;
}
.register-info .c-heading2.register-info-1__head::before {
  width: 47px;
  height: 40px;
  background: url(../../img/v2/register/title01_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .register-info .c-heading2.register-info-1__head::before {
    width: 33px;
    height: 28px;
  }
}
.register-info .c-heading2.register-info-2__head::before {
  width: 47px;
  height: 40px;
  background: url(../../img/v2/register/title02_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .register-info .c-heading2.register-info-2__head::before {
    width: 33px;
    height: 28px;
  }
}
.register-info .c-heading2.register-info-3__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/register/title03_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .register-info .c-heading2.register-info-3__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.register-info__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .register-info__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .register-info__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.register-info__contents {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: auto;
  gap: 15px;
}
@media screen and (max-width: 768px) {
  .register-info__contents {
    grid-template-columns: 100%;
  }
}
.register-info__col {
  border: #e0e0e0 solid 1px;
  padding: 10px;
}
.register-info__col .row {
  width: 100%;
  aspect-ratio: 450/140;
  position: relative;
}
.register-info__col .row .title {
  position: absolute;
  top: 50%;
  left: 30px;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .register-info__col .row .title {
    left: 3.906vw;
  }
}
.register-info__col .row .title h3 {
  color: #fff;
  font-size: 18px;
  line-height: 1.7;
}
@media screen and (max-width: 1024px) {
  .register-info__col .row .title h3 {
    font-size: 2.4vw;
  }
}
@media screen and (max-width: 768px) {
  .register-info__col .row .title h3 {
    font-size: 16px;
  }
}
.register-info__col._01 .row {
  background: url(../../img/v2/register/info-img_01.png) no-repeat;
  background-size: cover;
}
.register-info__col._02 .row {
  background: url(../../img/v2/register/info-img_02.png) no-repeat;
  background-size: cover;
}
.register-info__col._03 .row {
  background: url(../../img/v2/register/info-img_03.png) no-repeat;
  background-size: cover;
}
.register-info__col._04 .row {
  background: url(../../img/v2/register/info-img_04.png) no-repeat;
  background-size: cover;
}
.register-info__col .text {
  padding: 15px 10px;
}
.register-info__col .text .btn-teams {
  margin: 10px auto 0;
}
.register-info__caution {
  width: 860px;
  margin: 30px auto 0;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .register-info__caution {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .register-info__caution {
    margin: 8vw auto 0;
  }
}
.register-info__caution .c-btn-01 {
  margin: 36px 0 18px;
}
.register-info__caution {
  /* Step 表示と利用規約同意チェックボックス */
}
.register-info__caution .register-policy-step {
  margin: 18px auto 8px;
  color: #555;
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .register-info__caution .register-policy-step {
    font-size: 13px;
  }
}
.register-info__caution .register-policy-agree {
  margin: 8px auto 24px;
  text-align: center;
}
.register-info__caution .register-policy-agree__label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  background: #fff;
  border: 2px solid var(--site_blue, #2871b9);
  border-radius: 8px;
  cursor: pointer;
  transition: opacity 0.2s ease, background 0.2s ease;
  user-select: none;
  max-width: 100%;
  line-height: 1.5;
}
.register-info__caution .register-policy-agree__label input[type=checkbox] {
  width: 20px;
  height: 20px;
  accent-color: var(--site_blue, #2871b9);
  cursor: pointer;
  flex-shrink: 0;
}
.register-info__caution .register-policy-agree__label.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  border-color: #c8c8c8;
  background: #f5f5f5;
}
.register-info__caution .register-policy-agree__label.is-disabled input[type=checkbox] {
  cursor: not-allowed;
}
@media screen and (max-width: 768px) {
  .register-info__caution .register-policy-agree__label {
    padding: 10px 14px;
    font-size: 13px;
  }
}
.register-info__caution .register-policy-agree__text {
  color: #333;
  font-weight: bold;
  font-size: 15px;
}
@media screen and (max-width: 768px) {
  .register-info__caution .register-policy-agree__text {
    font-size: 13px;
  }
}
.register-info .bnr-register {
  margin: 20px auto 0;
  text-align: center;
  /* Stage D 修正(163): 会員登録ボタンを .c-btn-01 a と同じデザインに統一
   *   利用規約「確認する」ボタン (.c-btn-01) と見た目を揃え、
   *   サイト共通の CTA スタイルとして整える。 */
}
.register-info .bnr-register button {
  display: inline-block;
  text-align: center;
  min-width: 290px;
  height: 37px;
  padding: 0 1em;
  background: url(../../img/v2/home/btn_more_bg.png) left center no-repeat;
  background-size: auto 100%;
  border: none;
  outline: none;
  border-radius: 3px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .register-info .bnr-register button {
    min-width: 26vw;
    height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register button {
    min-width: 260px;
    height: auto;
    padding: 0.5em 1.5em;
  }
}
.register-info .bnr-register button span {
  display: inline-block;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 37px;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .register-info .bnr-register button span {
    font-size: 1.6vw;
    line-height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register button span {
    font-size: 14px;
    line-height: 1.4;
  }
}
.register-info .bnr-register {
  /* 会員登録ボタン: 利用規約に同意するまで disabled */
}
.register-info .bnr-register button[disabled],
.register-info .bnr-register button[disabled]:hover {
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.4);
}
.register-info .bnr-register button[disabled] span,
.register-info .bnr-register button[disabled]:hover span {
  color: #fff;
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register {
    margin: 2.604vw auto 0;
  }
}
.register-info .bnr-register a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.register-info .bnr-register a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 230px;
  height: 150px;
  background: url(../../img/v2/common/bnr-register_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register a::before {
    width: 29.948vw;
    height: 19.531vw;
  }
}
.register-info .bnr-register a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/common/bnr-register_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.register-info .bnr-register a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 27px;
  height: 27px;
  background: url(../../img/v2/common/icon_circle-arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .register-info .bnr-register a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}

.register2 {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .register2 {
    padding-bottom: 60px;
  }
}

.register-form {
  margin-bottom: 30px;
}
.register-form .c-heading2.register2-form__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/register/title03_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .register-form .c-heading2.register2-form__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.register-form__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .register-form__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .register-form__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.register-form__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .register-form__contents {
    width: 100%;
  }
}
.register-form__contents span.item-required {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  padding-left: 10px;
  border-left: 6px solid #de2246;
  margin-bottom: 30px;
}

/* Stage D 修正(301): 登録情報確認画面 (students/confirm.ctp) 専用テーブル。
 *   入力フォーム用の .table_register (ラベル列・値列ともグレー / セル罫線なし)
 *   を流用していたため、確認画面として項目の区切りが見えにくかった。
 *   ラベル列を淡い青背景、値列を白背景にして罫線を入れ、視認性を上げる。
 *   SP では各行をカード状に縦積みする。 */
.register-confirm-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #d3dce5;
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .register-confirm-table {
    border: none;
    margin-bottom: 30px;
  }
}
.register-confirm-table th,
.register-confirm-table td {
  padding: 14px 18px;
  font-size: 15px;
  line-height: 1.7;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #e4e9ef;
}
.register-confirm-table tr:last-child th,
.register-confirm-table tr:last-child td {
  border-bottom: none;
}
.register-confirm-table th {
  width: 300px;
  background: var(--site_blue_light, #eaf2fa);
  color: #1f3b5b;
  font-weight: bold;
  border-right: 1px solid #d3dce5;
  white-space: nowrap;
}
.register-confirm-table td {
  background: #fff;
  color: #333;
  word-break: break-all;
}
.register-confirm-table {
  /* 未入力プレースホルダ */
}
.register-confirm-table .is-empty {
  color: #9aa4b0;
  font-size: 13px;
}
@media screen and (max-width: 768px) {
  .register-confirm-table tr {
    display: block;
    border: 1px solid #d3dce5;
    border-radius: 6px;
    overflow: hidden;
  }
  .register-confirm-table tr + tr {
    margin-top: 10px;
  }
  .register-confirm-table th,
  .register-confirm-table td {
    display: block;
    width: 100%;
    border-bottom: none;
    white-space: normal;
  }
  .register-confirm-table th {
    border-right: none;
    border-bottom: 1px solid #d3dce5;
    font-size: 13px;
    padding: 9px 14px;
  }
  .register-confirm-table td {
    padding: 12px 14px;
    font-size: 14px;
  }
}

/* Stage D 修正(308): 会員登録フォームのユーザー名欄。入力欄の横に
 *   「ユーザー名確認」ボタンを置き、重複チェック結果をその場に表示する。 */
.username-check {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
@media screen and (max-width: 768px) {
  .username-check {
    align-items: flex-start;
  }
}

.btn-username-check {
  flex-shrink: 0;
  padding: 7px 16px;
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.btn-username-check:hover {
  opacity: 0.85;
}
.btn-username-check:disabled {
  opacity: 0.5;
  cursor: default;
}

.username-check__result {
  font-size: 13px;
  font-weight: bold;
  line-height: 1.6;
}
.username-check__result.is-ok {
  color: #29a06a;
}
.username-check__result.is-ng {
  color: #de2246;
}
.username-check__result.is-info {
  color: #888;
  font-weight: normal;
}

.username-check__badge {
  display: inline-block;
  margin-right: 6px;
  padding: 2px 11px;
  background: #29a06a;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 1.6;
  border-radius: 11px;
}

/* Stage D 修正(311): register「準備していただくもの」Teams 欄の受講ツール補足を、
 *   青アクセントの枠付きノートとして強調表示する。 */
.tool-note {
  margin: 14px 0;
  padding: 12px 14px;
  background: var(--site_blue_light, #eaf2fa);
  border: 1px solid #bcd5ea;
  border-left: 5px solid var(--site_blue, #2871b9);
  border-radius: 4px;
}
.tool-note__head {
  display: block;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.04em;
  color: var(--site_blue, #2871b9);
}
.tool-note p {
  margin: 0;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.7;
  color: #1f3b5b;
}
@media screen and (max-width: 768px) {
  .tool-note p {
    font-size: 12.5px;
  }
}

.page-head__title.page-toLesson {
  background: url(../../img/v2/toLesson/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-toLesson {
    background: url(../../img/v2/toLesson/page-title01_bg.png) right 30% center no-repeat;
    background-size: cover;
  }
}

.toLesson-flow {
  margin-bottom: 30px;
}
.toLesson-flow .c-heading2 {
  margin-bottom: 30px;
}
.toLesson-flow .c-heading2.toLesson-flow-1__head::before {
  width: 47px;
  height: 47px;
  background: url(../../img/v2/toLesson/icon_step1.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson-flow .c-heading2.toLesson-flow-1__head::before {
    width: 33px;
    height: 33px;
  }
}
.toLesson-flow .c-heading2.toLesson-flow-2__head::before {
  width: 47px;
  height: 47px;
  background: url(../../img/v2/toLesson/icon_step2.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson-flow .c-heading2.toLesson-flow-2__head::before {
    width: 33px;
    height: 33px;
  }
}
.toLesson-flow .c-heading2.toLesson-flow-3__head::before {
  width: 47px;
  height: 47px;
  background: url(../../img/v2/toLesson/icon_step3.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson-flow .c-heading2.toLesson-flow-3__head::before {
    width: 33px;
    height: 33px;
  }
}
.toLesson-flow .c-heading2.toLesson-flow-4__head::before {
  width: 47px;
  height: 47px;
  background: url(../../img/v2/toLesson/icon_step4.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson-flow .c-heading2.toLesson-flow-4__head::before {
    width: 33px;
    height: 33px;
  }
}
.toLesson-flow .c-heading2.toLesson-flow-5__head::before {
  width: 47px;
  height: 47px;
  background: url(../../img/v2/toLesson/icon_step5.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson-flow .c-heading2.toLesson-flow-5__head::before {
    width: 33px;
    height: 33px;
  }
}
.toLesson-flow__lead {
  margin: 1.5em auto 60px;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .toLesson-flow__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .toLesson-flow__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 30px;
  }
}
.toLesson-flow__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .toLesson-flow__contents {
    width: 100%;
  }
}
.toLesson-flow__contents.row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
}
@media screen and (max-width: 768px) {
  .toLesson-flow__contents.row {
    flex-direction: column;
  }
}
.toLesson-flow__contents.row .steps {
  width: 67%;
  flex-shrink: 0;
}
@media screen and (max-width: 1024px) {
  .toLesson-flow__contents.row .steps {
    width: 67%;
  }
}
@media screen and (max-width: 768px) {
  .toLesson-flow__contents.row .steps {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .toLesson-flow__contents.row .images {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
}
.toLesson-flow__contents.row .images img + img {
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  .toLesson-flow__contents.row .images img + img {
    margin-top: 0;
  }
}
.toLesson-flow__contents .step + .step {
  margin-top: 30px;
}
.toLesson-flow__contents .btn-teams {
  margin: 25px auto 0;
}
.toLesson-flow__contents .c-heading3.icon_num1::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 15px;
  height: 15px;
  background: url(../../img/v2/toLesson/icon_num1.svg) no-repeat;
  background-size: contain;
}
.toLesson-flow__contents .c-heading3.icon_num2::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 15px;
  height: 15px;
  background: url(../../img/v2/toLesson/icon_num2.svg) no-repeat;
  background-size: contain;
}
.toLesson-flow__contents .c-heading3.icon_num3::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 15px;
  height: 15px;
  background: url(../../img/v2/toLesson/icon_num3.svg) no-repeat;
  background-size: contain;
}
.toLesson-flow__contents .c-btn-01 {
  margin-top: 30px;
}
.toLesson-flow__contents .c-btn-01 a::after {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  content: "";
  width: 21px;
  height: 20px;
  background: url(../../img/v2/common/icon_pencil.svg) no-repeat;
  background-size: contain;
}

.toLesson {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .toLesson {
    padding-bottom: 60px;
  }
}
.toLesson .bnr-register2 {
  margin: 20px auto 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .toLesson .bnr-register2 {
    margin: 2.604vw auto 0;
  }
}
.toLesson .bnr-register2 a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .toLesson .bnr-register2 a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.toLesson .bnr-register2 a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 230px;
  height: 150px;
  background: url(../../img/v2/common/bnr-register2_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .toLesson .bnr-register2 a::before {
    width: 29.948vw;
    height: 19.531vw;
  }
}
.toLesson .bnr-register2 a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/common/bnr-register2_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .toLesson .bnr-register2 a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.toLesson .bnr-register2 a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 27px;
  height: 27px;
  background: url(../../img/v2/common/icon_circle-arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toLesson .bnr-register2 a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}

.page-head__title.page-toCompany {
  background: url(../../img/v2/toCompany/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-toCompany {
    background: url(../../img/v2/toCompany/page-title01_bg.png) left 20% center no-repeat;
    background-size: cover;
  }
}

.toCompany {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .toCompany {
    padding-bottom: 60px;
  }
}

.toCompany-form {
  margin-bottom: 30px;
}
.toCompany-form .c-heading2.toCompany-form__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/common/icon_mail.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .toCompany-form .c-heading2.toCompany-form__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.toCompany-form__lead {
  margin: 1.5em auto 80px;
  text-align: center;
  font-weight: bold;
  /* Stage D 修正(165): リード文が小さくて読みにくいというフィードバックを受けて
   *   font-size 14px + line-height 1.85 に底上げ。 */
  font-size: 14px;
  line-height: 1.85;
}
@media screen and (max-width: 1024px) {
  .toCompany-form__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .toCompany-form__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
    font-size: 13.5px;
  }
}
.toCompany-form .list-dot-blue {
  width: 860px;
  margin: 0 auto 60px;
}
@media screen and (max-width: 1024px) {
  .toCompany-form .list-dot-blue {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .toCompany-form .list-dot-blue {
    margin-bottom: 30px;
  }
}
.toCompany-form__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .toCompany-form__contents {
    width: 100%;
  }
}
.toCompany-form__contents span.item-required {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  padding-left: 10px;
  border-left: 6px solid #de2246;
  margin-bottom: 30px;
}
.toCompany-form__contents .table-wrap {
  width: 100%;
  margin-bottom: 50px;
}
.toCompany-form__contents .table_register th {
  width: 250px;
}
@media screen and (max-width: 768px) {
  .toCompany-form__contents .table_register th {
    display: block;
    padding: 10px 10px 0 10px;
    width: 100%;
  }
}
.toCompany-form__contents .btn-box {
  text-align: center;
  margin-bottom: 20px;
}
.toCompany-form__contents .btn-confirm {
  display: inline-block;
  text-align: center;
  min-width: 290px;
  height: 37px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 37px;
  padding: 0 1em;
  background: url(../../img/v2/home/btn_more_bg.png) left center no-repeat;
  background-size: auto 100%;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 auto;
  outline: none;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .toCompany-form__contents .btn-confirm {
    min-width: 26vw;
    height: 3.7vw;
    font-size: 1.6vw;
    line-height: 3.7vw;
  }
}
@media screen and (max-width: 768px) {
  .toCompany-form__contents .btn-confirm {
    min-width: auto;
    height: auto;
    padding: 0.5em 1.5em;
    font-size: 14px;
    line-height: 1.4;
  }
}

.page-head__title.page-company {
  background: url(../../img/v2/company/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-company {
    background: url(../../img/v2/company/page-title01_bg.png) right 20% center no-repeat;
    background-size: cover;
  }
}

.company {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .company {
    padding-bottom: 60px;
  }
}

.company-info {
  margin-bottom: 30px;
}
.company-info .c-heading2 {
  margin-bottom: 30px;
}
.company-info .c-heading2.company-info__head::before {
  width: 36px;
  height: 42px;
  background: url(../../img/v2/common/icon_building.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .company-info .c-heading2.company-info__head::before {
    width: 25.2px;
    height: 29.4px;
  }
}
.company-info__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .company-info__contents {
    width: 100%;
  }
}
.company-info__contents .company-list {
  width: 100%;
  display: grid;
  grid-template-columns: 250px 1fr;
  font-size: 16px;
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .company-info__contents .company-list {
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
  }
}
.company-info__contents .company-list dt {
  padding: 15px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .company-info__contents .company-list dt {
    padding: 10px 10px 5px 10px;
  }
  .company-info__contents .company-list dt::after {
    position: absolute;
    bottom: 0;
    left: 10px;
    content: "";
    width: calc(100% - 20px);
    height: 1px;
    background: #ccc;
  }
}
.company-info__contents .company-list dd {
  padding: 15px;
}
@media screen and (max-width: 768px) {
  .company-info__contents .company-list dd {
    padding: 5px 10px 10px 10px;
  }
}
.company-info__contents .company-list dd span {
  margin-top: 0.5em;
  display: inline-block;
  line-height: 1.5;
}
.company-info__contents .company-list dd a {
  color: #3fa9f5;
  text-decoration: underline;
}
.company-info__contents .company-list dt:nth-of-type(odd),
.company-info__contents .company-list dt:nth-of-type(odd) + dd {
  background-color: #f8f8f8;
}
.company-info__contents .company-list dt:nth-of-type(even),
.company-info__contents .company-list dt:nth-of-type(even) + dd {
  background-color: #e8e8e8;
}

.page-head__title.page-question {
  background: url(../../img/v2/question/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-question {
    background: url(../../img/v2/question/page-title01_bg.png) left 20% center no-repeat;
    background-size: cover;
  }
}

.question {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .question {
    padding-bottom: 60px;
  }
}

.question-summary {
  margin-bottom: 30px;
}
.question-summary .l-section__inner {
  background: #fff1e3;
}
.question-summary .c-heading2 {
  margin-bottom: 30px;
}
.question-summary .c-heading2.question-summary__head::before {
  width: 46px;
  height: 46px;
  background: url(../../img/v2/common/icon_question.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .question-summary .c-heading2.question-summary__head::before {
    width: 32.2px;
    height: 32.2px;
  }
}
.question-summary__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .question-summary__contents {
    width: 100%;
  }
}
.question-summary__contents .content h3 {
  color: var(--site_blue);
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .question-summary__contents .content h3 {
    font-size: 22px;
  }
}
.question-summary__contents .content + .content {
  margin-top: 60px;
}
.question-summary__contents .question-list {
  width: 100%;
  font-size: 16px;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .question-summary__contents .question-list {
    font-size: 14px;
  }
}
.question-summary__contents .question-list dt {
  width: 100%;
  background: #fff;
  padding: 13px 50px;
  position: relative;
  cursor: pointer;
}
.question-summary__contents .question-list dt span {
  display: block;
  padding: 0 0 0 10px;
  border-left: #f7931e solid 1px;
}
.question-summary__contents .question-list dt::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 50px;
  height: 50px;
  background-image: url(../../img/v2/common/icon_q.svg);
  background-position: center center;
  background-size: 18px 15px;
  background-repeat: no-repeat;
}
.question-summary__contents .question-list dt::after {
  position: absolute;
  top: 0;
  right: 0;
  content: "";
  width: 50px;
  height: 50px;
  background-image: url(../../img/v2/common/icon_plus.svg);
  background-position: center center;
  background-size: 12px 12px;
  background-repeat: no-repeat;
}
.question-summary__contents .question-list dt.is-active::after {
  position: absolute;
  top: 0;
  right: 0;
  content: "";
  width: 50px;
  height: 50px;
  background-image: url(../../img/v2/common/icon_minus.svg);
  background-position: center center;
  background-size: 12px 12px;
  background-repeat: no-repeat;
}
.question-summary__contents .question-list dd {
  display: none;
  padding: 18px 10px 18px 50px;
  background: #fff8f1;
  position: relative;
}
.question-summary__contents .question-list dd::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 50px;
  height: 50px;
  background-image: url(../../img/v2/common/icon_a.svg);
  background-position: center center;
  background-size: 18px 15px;
  background-repeat: no-repeat;
}
.question-summary__contents .question-list dd span {
  display: block;
  padding: 0 0 0 10px;
  border-left: #f7931e solid 1px;
}
.question-summary__contents .question-list dd a {
  display: block;
  color: var(--site_blue);
  font-weight: bold;
  margin: 0.5em 0;
}
.question-summary__contents .question-list dd + dt {
  margin-top: 10px;
}

.page-head__title.page-payment_texts {
  background: url(../../img/v2/payment_texts/page-title01_bg.png) center center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-payment_texts {
    background: url(../../img/v2/payment_texts/page-title01_bg.png) right 10% center no-repeat;
    background-size: cover;
  }
}

.payment_texts {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .payment_texts {
    padding-bottom: 60px;
  }
}

.payment_texts-shop {
  margin-bottom: 30px;
}
.payment_texts-shop .c-heading2 {
  margin-bottom: 30px;
}
.payment_texts-shop .c-heading2.payment_texts-shop__head::before {
  width: 46px;
  height: 43px;
  background: url(../../img/v2/common/icon_house.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .payment_texts-shop .c-heading2.payment_texts-shop__head::before {
    width: 32.2px;
    height: 30.1px;
  }
}
.payment_texts-shop__bnr {
  margin-bottom: 2em;
}
.payment_texts-shop .list-dot-blue li + li {
  margin-top: 10px;
}
.payment_texts-shop__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .payment_texts-shop__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .payment_texts-shop__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 30px;
  }
}
.payment_texts-shop__contents {
  width: 860px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .payment_texts-shop__contents {
    width: 100%;
  }
}

.payment_texts-summary {
  margin-bottom: 30px;
}
.payment_texts-summary .c-heading2 {
  margin-bottom: 30px;
}
.payment_texts-summary .c-heading2.payment_texts-summary__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/common/icon_book.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary .c-heading2.payment_texts-summary__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.payment_texts-summary__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .payment_texts-summary__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 30px;
  }
}
.payment_texts-summary__list {
  width: 860px;
  margin: 0 auto 2em;
}
@media screen and (max-width: 1024px) {
  .payment_texts-summary__list {
    width: 100%;
  }
}
.payment_texts-summary__list .list-dot-blue li + li,
.payment_texts-summary__list .list-dot-pink li + li {
  margin-top: 10px;
}
.payment_texts-summary__list h3 {
  margin-top: 60px;
  color: var(--site_blue);
  font-size: 26px;
  line-height: 26px;
  text-align: center;
  margin-bottom: 20px;
}
.payment_texts-summary__contents {
  width: 100%;
}
.payment_texts-summary__contents .list-dot-blue li + li,
.payment_texts-summary__contents .list-dot-pink li + li {
  margin-top: 10px;
}
.payment_texts-summary__contents h3 {
  margin-top: 60px;
  color: var(--site_blue);
  font-size: 26px;
  line-height: 26px;
  text-align: center;
  margin-bottom: 20px;
}
.payment_texts-summary__contents .title .row {
  display: grid;
  /* col_03 (サンプル) のスペース不足で目次/第N課が文字単位で折り返す問題を解消 */
  grid-template-columns: 160px 290px 220px 1fr;
  font-size: 14px;
  line-height: 1.2;
  background: #505050;
}
@media screen and (max-width: 1024px) {
  .payment_texts-summary__contents .title .row {
    grid-template-columns: 1fr 1fr 130px 180px;
  }
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .title .row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
  }
}
.payment_texts-summary__contents .title .row .col {
  text-align: center;
  color: #fff;
  font-weight: bold;
  padding: 10px;
  border-right: #fff solid 1px;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .title .row .col {
    text-align: left;
    border-right: none;
  }
}
.payment_texts-summary__contents .title .row .col:nth-child(4) {
  border-right: none;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .title .row .col._01 {
    grid-row: 1/2;
    grid-column: 1/2;
    padding-bottom: 0;
  }
  .payment_texts-summary__contents .title .row .col._02 {
    grid-row: 2/3;
    grid-column: 1/2;
    padding-bottom: 0;
  }
  .payment_texts-summary__contents .title .row .col._03 {
    grid-row: 3/4;
    grid-column: 1/2;
  }
  .payment_texts-summary__contents .title .row .col._04 {
    text-align: right;
    grid-row: 3/4;
    grid-column: 2/3;
  }
}
.payment_texts-summary__contents .course .row {
  display: grid;
  /* col_03 (サンプル) のスペース不足で目次/第N課が文字単位で折り返す問題を解消 */
  grid-template-columns: 160px 290px 220px 1fr;
  font-size: 14px;
  line-height: 1.2;
  height: 68px;
}
@media screen and (max-width: 1024px) {
  .payment_texts-summary__contents .course .row {
    grid-template-columns: 1fr 1fr 130px 180px;
  }
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .course .row {
    grid-template-columns: 1fr 100px;
    grid-template-rows: auto auto auto;
    height: auto;
  }
}
.payment_texts-summary__contents .course .row:nth-of-type(odd) {
  background: #eaf2fa;
}
.payment_texts-summary__contents .course .row:nth-of-type(even) {
  background: #fafcff;
}
.payment_texts-summary__contents .course .row .col._01 {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .course .row .col._01 {
    display: block;
    text-align: left;
    grid-row: 1/2;
    grid-column: 1/3;
    padding-bottom: 0;
  }
}
.payment_texts-summary__contents .course .row .col._02 {
  padding-left: 15px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .course .row .col._02 {
    display: block;
    text-align: left;
    grid-row: 2/3;
    grid-column: 1/3;
  }
}
.payment_texts-summary__contents .course .row .col._03 {
  display: flex;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .course .row .col._03 {
    grid-row: 3/4;
    grid-column: 1/2;
    padding: 0 0 10px 10px;
  }
}
.payment_texts-summary__contents .course .row .col._03 .image {
  width: 50px;
  height: 100%;
  overflow: hidden;
}
.payment_texts-summary__contents .course .row .col._03 .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.payment_texts-summary__contents .course .row .col._03 a {
  color: var(--site_blue);
  padding: 15px 0 0 15px;
  line-height: 1.5;
  text-decoration: underline;
  white-space: nowrap; /* 文字単位の折り返しを防止 */
  display: inline-block;
}
.payment_texts-summary__contents .course .row .col._04 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .payment_texts-summary__contents .course .row .col._04 {
    flex-direction: column;
    grid-row: 3/4;
    grid-column: 2/3;
    padding: 10px;
  }
}
.payment_texts-summary__contents .course .row .col._04 .btn-buy {
  width: 80px;
  height: 30px;
  color: #fff;
  line-height: 30px;
  text-align: center;
  background: var(--site_blue);
  border-radius: 5px;
  border: none;
  outline: none;
  cursor: pointer;
}

.bnr-netchai-shop {
  margin: 0 auto 30px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .bnr-netchai-shop {
    margin: 2.604vw auto 30px;
  }
}
.bnr-netchai-shop a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .bnr-netchai-shop a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.bnr-netchai-shop a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 200px;
  height: 150px;
  background: url(../../img/v2/payment_texts/bnr-netchai-shop_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .bnr-netchai-shop a::before {
    width: 26.042vw;
    height: 19.531vw;
  }
}
.bnr-netchai-shop a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/payment_texts/bnr-netchai-shop_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .bnr-netchai-shop a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.bnr-netchai-shop a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 24px;
  height: 24px;
  background: url(../../img/v2/payment_texts/icon_link.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .bnr-netchai-shop a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}

main.users_mypage .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  main.users_mypage .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  main.users_mypage .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}

.page-head__title.page-users_mypage {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-users_mypage {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

/* Stage D 修正(265): 講師マイページ カードデザイン流用に伴う追加スタイル */
.tutors_mypage {
  /* Stage D 修正(275): _common.scss (修正129) の
   *   main[class^="tutors_"] { font-family: var(--font-zh) } により、
   *   講師ページ全体が中国語フォント優先になっている。しかし講師
   *   マイページのメインコンテンツ (レッスン予約/履歴カード・会員
   *   登録情報・お知らせ) は日本語が主体で、中国語フォント
   *   (Windows では Microsoft YaHei) では特にカタカナ・かなが崩れて
   *   見える。.l-page__main を日本語優先 (--font-ja-zh) に上書きする。
   *   --font-ja-zh は「日本語優先 + 中国語フォールバック」なので、
   *   生徒名の簡体字 (你好 等) やセクション見出しの簡体字専用文字
   *   (课/预/约 等) は後段の中国語フォントへ自動フォールバックする。
   *   左サイドバー (.l-page__side.lang-zh) は独自に --font-zh を
   *   持つため影響を受けず、中国語表示のまま維持される。
   *   確認モーダル (.confirm-modal) は #confirm_confirm が
   *   .l-page__main 外にあるため別途 修正274 で対応済み。 */
}
.tutors_mypage .l-page__main {
  font-family: var(--font-ja-zh);
  /* <button> 等のフォーム要素は font-family を継承しないため明示 */
}
.tutors_mypage .l-page__main button, .tutors_mypage .l-page__main input, .tutors_mypage .l-page__main select, .tutors_mypage .l-page__main textarea {
  font-family: inherit;
}
.tutors_mypage {
  /* 予約確認状態バッジ (ヘッダー .lesson-date__nav 内) */
}
.tutors_mypage .lesson-status {
  /* Stage D 修正(266): ツールチップを絶対配置する基準にするため
   *   position: relative を付与。 */
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: bold;
  white-space: nowrap;
}
.tutors_mypage .lesson-status--unchecked {
  color: #c0392b;
  background: #fdecea;
  border: 1px solid #f5b7b1;
}
.tutors_mypage .lesson-status--checked {
  color: #0078d7;
  background: #e8f1ff;
  border: 1px solid #aacbf0;
}
.tutors_mypage .lesson-status {
  /* Stage D 修正(266): 確認ボタンがまだ出ない未確認バッジに付与。
   *   インライン注記の代わりに、ホバー/フォーカスで注記を
   *   ツールチップ表示する (スペースを取らない)。
   *
   *   注: ホバー条件は &--tip の内側に書くこと。&--tip:hover &__tip の
   *   ように書くと &__tip が親 (.tutors_mypage) を二重展開して
   *   不正セレクタになるため、子側は素のクラス名で記述する。 */
}
.tutors_mypage .lesson-status--tip {
  cursor: help;
}
.tutors_mypage .lesson-status--tip:hover .lesson-status__tip, .tutors_mypage .lesson-status--tip:focus .lesson-status__tip, .tutors_mypage .lesson-status--tip:focus-visible .lesson-status__tip {
  opacity: 1;
  visibility: visible;
}
.tutors_mypage .lesson-status__tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 9px);
  transform: translateX(-50%);
  width: max-content;
  max-width: 230px;
  padding: 8px 11px;
  background: #333b47;
  color: #fff;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.55;
  white-space: normal;
  text-align: left;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease, visibility 0.15s ease;
  z-index: 20;
  pointer-events: none;
  /* 吹き出しの下向き三角 */
}
.tutors_mypage .lesson-status__tip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #333b47;
}
.tutors_mypage {
  /* Stage D 修正(271): 未確認ボタン (旧 .btn-confirm を統合)。
   *   未確認バッジと確認ボタンを 1 つに統合し、「未確認」と表記した
   *   押下可能なボタンにする。押すと確認モーダル経由で確認済みになる。
   *   未確認状態を示すため配色は lesson-status--unchecked と同系統の
   *   赤系。rest 時の薄い影 + ホバー/アクティブの変化で押下可能と分かる
   *   ようにし、表示のみの確認済みバッジ (青) と区別する。 */
}
.tutors_mypage .btn-confirm-toggle {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  border-radius: 999px;
  background: #fdecea;
  color: #c0392b;
  border: 1px solid #f5b7b1;
  font-size: 12px;
  font-weight: bold;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(192, 57, 43, 0.15);
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.tutors_mypage .btn-confirm-toggle:hover {
  background: #f9d5d0;
  border-color: #e08c80;
  box-shadow: 0 2px 6px rgba(192, 57, 43, 0.28);
}
.tutors_mypage .btn-confirm-toggle:active {
  background: #f4c2bb;
  box-shadow: 0 1px 2px rgba(192, 57, 43, 0.2);
}
.tutors_mypage {
  /* カード詳細部の2列テーブル */
}
.tutors_mypage .lesson-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.tutors_mypage .lesson-detail-table th, .tutors_mypage .lesson-detail-table td {
  text-align: left;
  padding: 9px 12px;
  border-bottom: 1px solid #eaeef3;
  vertical-align: top;
  line-height: 1.6;
}
.tutors_mypage .lesson-detail-table th {
  width: 210px;
  font-weight: bold;
  color: #555;
  background: #f7f9fc;
  white-space: nowrap;
}
.tutors_mypage .lesson-detail-table td {
  color: #333;
  word-break: break-word;
}
.tutors_mypage .lesson-detail-table tr:last-child th,
.tutors_mypage .lesson-detail-table tr:last-child td {
  border-bottom: none;
}
.tutors_mypage .lesson-detail-table a {
  color: #0078d7;
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  .tutors_mypage .lesson-detail-table {
    font-size: 13px;
  }
  .tutors_mypage .lesson-detail-table th, .tutors_mypage .lesson-detail-table td {
    display: block;
    width: 100%;
  }
  .tutors_mypage .lesson-detail-table th {
    border-bottom: none;
    padding-bottom: 2px;
  }
  .tutors_mypage .lesson-detail-table td {
    padding-top: 2px;
    padding-bottom: 10px;
  }
}
.tutors_mypage {
  /* Stage D 修正(268): 希望受講ツール ソリッドバッジ (T6)。
   *   講師がツールを取り違えないよう、ツール別に色分けする:
   *     Teams=青 / WeChat ID=緑 / NetChai Meeting=橙 / 指定なし=グレー */
}
.tutors_mypage .tool-badge {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 6px;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
}
.tutors_mypage .tool-badge--teams {
  background: #0078d7;
}
.tutors_mypage .tool-badge--wechat {
  background: #07c160;
}
.tutors_mypage .tool-badge--netchai {
  background: #e8841a;
}
.tutors_mypage .tool-badge--none {
  background: #9aa4b0;
}
.tutors_mypage {
  /* Stage D 修正(269): .tutor-history-heading は廃止。
   *   履歴は独立セクション (users_archive l-section) として
   *   出力されるようになり、c-heading2 が見出しを担当するため不要。 */
}

.users-rank {
  margin-bottom: 30px;
}
.users-rank .c-heading2.users-rank__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .users-rank .c-heading2.users-rank__head {
    margin-bottom: 20px;
  }
}
.users-rank .c-heading2.users-rank__head::before {
  width: 46px;
  height: 40px;
  background: url(../../img/v2/common/icon_rank.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .users-rank .c-heading2.users-rank__head::before {
    width: 32.2px;
    height: 28px;
  }
}
.users-rank__lead {
  margin-bottom: 30px;
}
.users-rank__lead p {
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.1em;
  margin-bottom: 5px;
}
.users-rank__lead .star-rating {
  display: flex;
  justify-content: center;
  align-items: center;
}
.users-rank__lead .star-rating span {
  display: block;
  width: 24px;
  height: 24px;
}
.users-rank__contents {
  width: 100%;
  padding: 0 30px;
  display: grid;
  grid-template-columns: repeat(3, auto);
}
@media screen and (max-width: 768px) {
  .users-rank__contents {
    display: block;
    padding: 0;
  }
}
.users-rank__contents .col {
  background: #f0f0f0;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  .users-rank__contents .col {
    width: 100%;
  }
}
.users-rank__contents .col .head {
  background: #505050;
  padding: 5px 10px;
  font-size: 14px;
  color: #fff;
  font-weight: bold;
  border-right: #fff solid 1px;
  text-align: center;
}
.users-rank__contents .col .row {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  font-size: 14px;
  text-align: center;
  border-right: #fff solid 1px;
  align-self: center;
}
.users-rank__contents .col .row span.number {
  display: inline-block;
  font-weight: bold;
}
.users-rank__contents .col .row span.percent {
  display: inline-block;
}
.users-rank__contents .col:nth-child(1) .row {
  display: block;
}

.users-news {
  margin-bottom: 30px;
}
.users-news .c-heading2.users-news__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .users-news .c-heading2.users-news__head {
    margin-bottom: 20px;
  }
}
.users-news .c-heading2.users-news__head::before {
  width: 45px;
  height: 43px;
  background: url(../../img/v2/home/news_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .users-news .c-heading2.users-news__head::before {
    width: 30px;
    height: 28px;
  }
}
.users-news__contents {
  max-width: 710px;
  width: 100%;
  margin: 0 auto;
  border: #f5b4c3 solid 6px;
  border-radius: 7px;
  padding: 1em 30px 1.5em;
}
@media screen and (max-width: 768px) {
  .users-news__contents {
    width: 100%;
    padding-left: 3%;
    padding-right: 3%;
  }
}
.users-news__contents ul {
  width: 100%;
  background: #fff;
  margin-bottom: 1em;
}
.users-news__contents ul li {
  width: 100%;
  padding: 0.8em 0 0.5em 1.5em;
  border-bottom: #e2e2e2 solid 1px;
}
@media screen and (max-width: 768px) {
  .users-news__contents ul li {
    padding: 0.5em;
  }
}
.users-news__contents ul li a {
  width: 100%;
  display: grid;
  grid-template-columns: 110px 1fr 54px;
  gap: 1em;
  font-size: 14px;
  line-height: 1.28;
}
@media screen and (max-width: 768px) {
  .users-news__contents ul li a {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto;
    grid-template-areas: "a b c" "d d d";
    place-items: center;
  }
}
.users-news__contents ul li a span {
  display: block;
}
.users-news__contents ul li a span.date {
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .users-news__contents ul li a span.date {
    grid-area: a;
    padding: 0.5em 0;
  }
}
@media screen and (max-width: 768px) {
  .users-news__contents ul li a span.title {
    grid-area: d;
    width: 100%;
    padding: 0 0 0.5em 0;
  }
}
@media screen and (max-width: 768px) {
  .users-news__contents ul li a span.new {
    grid-area: b;
    width: 54px;
  }
}
.users-news__more {
  display: block;
  text-align: right;
  color: #3fa9f5;
  font-size: 14px;
}

.users_reserve {
  margin-bottom: 30px;
}
.users_reserve .c-heading2.users_reserve__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .users_reserve .c-heading2.users_reserve__head {
    margin-bottom: 20px;
  }
}
.users_reserve .c-heading2.users_reserve__head::before {
  width: 42px;
  height: 43px;
  background: url(../../img/v2/common/icon_calendar.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .users_reserve .c-heading2.users_reserve__head::before {
    width: 29px;
    height: 30px;
  }
}
.users_reserve__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .users_reserve__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.users_reserve__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .users_reserve__contents {
    padding: 0;
  }
}
.users_reserve__contents .list-dot-blue {
  margin-bottom: 2em;
}
.users_reserve__contents .list-dot-blue li + li {
  margin-top: 10px;
}
.users_reserve__contents .list-dot-blue a {
  color: var(--site_blue);
  text-decoration: underline;
}
.users_reserve {
  /* Stage D 修正(212): 予約カードを白カード + 青アクセントに刷新
   *   旧: .lesson-date が #555 ベタ塗りバー / .btn-cancel が
   *       position: absolute; top: 100% で下にはみ出して次の予約と
   *       重なりレイアウト崩壊。さらに白文字×灰背景の組み合わせで
   *       見えにくかった。
   *   新: lesson_history と同じカードデザイン (白 + 左 4px 青アクセント)
   *       に統一。.btn-cancel は絶対配置を撤去して行内 (.lesson-date__nav)
   *       に淡赤ピルバッジで配置。 */
}
.users_reserve__lesson {
  font-size: 15px;
  line-height: 1.5;
  background: transparent;
  margin-bottom: 14px;
}
.users_reserve__lesson h3 {
  text-align: left;
  padding-left: 0;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  margin: 0;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .users_reserve__lesson h3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson h3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 450px) {
  .users_reserve__lesson h3 {
    font-size: 13px;
  }
}
.users_reserve__lesson .lesson-date {
  width: 100%;
  background: #fff;
  border: 1px solid #e3eaf3;
  /* Stage D 修正(237):
   *   デフォルト: 水色 (#93c5fd)
   *   hover: ネトチャイピンク (#f57db4)
   *   .is-open: 外枠側に薄ピンク (#f3a3c7) の 5px (別ルール) */
  border-left: 4px solid #93c5fd;
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #333;
  font-weight: normal;
  position: relative;
  padding: 14px 18px 14px 16px;
  gap: 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease, border-left-color 0.15s ease;
  height: auto;
}
.users_reserve__lesson .lesson-date:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
  border-color: #c8d6e8;
  border-left-color: #f57db4;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date {
    flex-wrap: wrap;
    padding: 12px 14px 12px 12px;
    gap: 10px;
  }
}
.users_reserve__lesson .lesson-date__col {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  flex: 1 1 auto;
  min-width: 0;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__col {
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: flex-start;
  }
}
.users_reserve__lesson .lesson-date__col .date {
  display: flex;
  align-items: center;
  gap: 14px;
  line-height: 1.3;
  min-width: 0;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__col .date {
    gap: 10px;
  }
}
.users_reserve__lesson .lesson-date__col .date span {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__col .date span {
    font-size: 13px;
  }
}
.users_reserve__lesson .lesson-date__col .date .day {
  color: var(--site_blue, #0078d7);
}
.users_reserve__lesson .lesson-date__col .date .time {
  font-size: 14px;
  color: #555;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__col .date .time {
    font-size: 12px;
  }
}
.users_reserve__lesson .lesson-date__col .date .time::before {
  content: "⏱";
  margin-right: 4px;
  opacity: 0.7;
}
.users_reserve__lesson .lesson-date__col .date span + span {
  margin-left: 0;
}
.users_reserve__lesson .lesson-date__col .lesson-note {
  width: 100%;
  margin: 4px 0 0;
  font-size: 12px;
  font-weight: normal;
  color: var(--site_blue, #0078d7);
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__col .lesson-note {
    font-size: 11px;
  }
}
.users_reserve__lesson .lesson-date {
  /* Stage D 修正(215): 閉じた状態でも講師名を表示 (日付の右隣) */
}
.users_reserve__lesson .lesson-date__tutor {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 4px 10px;
  font-size: 13px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  background: #e8f1ff;
  border-radius: 999px;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__tutor {
    font-size: 12px;
    padding: 3px 8px;
  }
}
@media screen and (max-width: 450px) {
  .users_reserve__lesson .lesson-date__tutor {
    /* 狭幅では折り返して 2 段目 (.lesson-date__col に flex-wrap がある) */
    flex-basis: 100%;
  }
}
.users_reserve__lesson .lesson-date__tutor a {
  color: inherit;
  text-decoration: none;
}
.users_reserve__lesson .lesson-date__tutor a:hover {
  text-decoration: underline;
}
.users_reserve__lesson .lesson-date__tutor small {
  font-size: 10.5px;
  font-weight: normal;
  color: #666;
  background: #fff;
  padding: 1px 6px;
  border-radius: 999px;
  border: 1px solid #cfdef0;
}
.users_reserve__lesson .lesson-date__nav {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-right: 0;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__nav {
    margin-left: auto;
  }
}
.users_reserve__lesson .lesson-date__nav {
  /* Stage D 修正(246): プラン種別バッジに modifier classes。
   *   月額 (blue) / ポイント (purple) / 振替 (orange) /
   *   振替(サポート) (orange-strong) / 体験 (pink) */
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid #f7bb67;
  border-radius: 999px;
  color: #c47a1c;
  background: #fff7eb;
  font-size: 12px;
  font-weight: bold;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date__nav .btn-reschedule {
    font-size: 11px;
    padding: 3px 8px;
  }
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule--monthly {
  color: #0078d7;
  background: #e8f1ff;
  border-color: #aacbf0;
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule--point {
  color: #7050b0;
  background: #f3edff;
  border-color: #c8b0e8;
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule--furikae {
  color: #c47a1c;
  background: #fff7eb;
  border-color: #f7bb67;
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule--admin {
  color: #a55f0d;
  background: #fde7c2;
  border-color: #ee9b3a;
}
.users_reserve__lesson .lesson-date__nav .btn-reschedule--taiken {
  color: #c4327f;
  background: #fde6f1;
  border-color: #f3a3c7;
}
.users_reserve__lesson .lesson-date {
  /* Stage D 修正(214): 旧 icon_dots.png (・・・) は意図が伝わらず、
   *   矢印アイコン + 「詳細」テキストの組合せに変更。
   *   .is-open / aria-expanded="true" 時は矢印が 180° 回転して
   *   「閉じる」状態を示す。 */
}
.users_reserve__lesson .lesson-date .js-lesson-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  background: #f3f8ff;
  outline: none;
  border: 1px solid #d6e6f7;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  transition: background 0.15s ease, border-color 0.15s ease;
}
.users_reserve__lesson .lesson-date .js-lesson-toggle:hover {
  background: #e8f1ff;
  border-color: #aacbf0;
}
@media screen and (max-width: 450px) {
  .users_reserve__lesson .lesson-date .js-lesson-toggle__label {
    display: none;
  }
}
.users_reserve__lesson .lesson-date .js-lesson-toggle {
  /* Stage D 修正(237): 旧 SVG 矢印を撤廃、+/- 記号に変更。
   *   閉じている時: + (展開を促す)
   *   開いている時: − (縮小を促す)
   *   aria-expanded の値に応じて ::before の content を切替。 */
}
.users_reserve__lesson .lesson-date .js-lesson-toggle__icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
}
.users_reserve__lesson .lesson-date .js-lesson-toggle__icon::before {
  content: "+";
}
.users_reserve__lesson .lesson-date .js-lesson-toggle {
  /* 開いている時は − に切替 (U+2212 minus sign で見た目を揃える) */
}
.users_reserve__lesson .lesson-date .js-lesson-toggle[aria-expanded=true] .users_reserve__lesson .lesson-date .js-lesson-toggle__icon::before {
  content: "−";
}
.users_reserve__lesson {
  /* Stage D 修正(237): .is-open 親経由でも +/- が切り替わるよう保険 */
}
.users_reserve__lesson.is-open .lesson-date .js-lesson-toggle__icon::before {
  content: "−";
}
.users_reserve__lesson .lesson-date {
  /* 行内に置く淡赤ピル型キャンセルボタン (旧 absolute 配置を撤去) */
}
.users_reserve__lesson .lesson-date .btn-cancel {
  position: static;
  /* Stage D 修正(214): キャンセルが何かの拍子に消える事象
   *   への防御として display を !important で固定。 */
  display: inline-flex !important;
  align-items: center;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: bold;
  color: #c0392b;
  background: #fde6e2;
  border: 1px solid #f5c6c0;
  border-radius: 999px;
  outline: none;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.users_reserve__lesson .lesson-date .btn-cancel:hover {
  background: #f8d4cd;
  border-color: #ec9c92;
  color: #a02d1e;
}
.users_reserve__lesson .lesson-date .btn-cancel:active {
  background: #f0c0b6;
}
.users_reserve__lesson .lesson-date .btn-cancel:focus-visible {
  outline: 2px solid #ec9c92;
  outline-offset: 2px;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-date .btn-cancel {
    font-size: 12px;
    padding: 6px 11px;
  }
}
@media screen and (max-width: 450px) {
  .users_reserve__lesson .lesson-date .btn-cancel {
    /* SP の最狭画面では折り返し許可 (行全体が wrap になるので
       cancel ボタンも次の段に来る) */
    order: 3;
  }
}
.users_reserve__lesson {
  /* Stage D 修正(231): A1 (シームレス連結カード)
   * Stage D 修正(233): 4px 青の左アクセント線を外枠側に持たせて、
   *   ヘッダーから詳細パネル末尾 (NetChai Meeting) まで貫通させる。
   *   これで「一つの予約の塊」が左側のラインで明示される。 */
}
.users_reserve__lesson.is-open {
  background: #fff;
  border: 1px solid #d6e6f7;
  /* Stage D 修正(237): 開いた予約の左 5px は薄ピンク (hover の
   *   ピンクより薄め) で「現在開いている / 注目枠」を示す。 */
  border-left: 5px solid #f3a3c7;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 120, 215, 0.12);
  overflow: hidden;
  margin-bottom: 22px;
}
.users_reserve__lesson.is-open .lesson-date {
  border: none;
  border-left: none; /* 外枠側で持たせるため撤去 */
  border-radius: 0;
  box-shadow: none;
  border-bottom: 1px solid #f0f4f8; /* 候補と同じ色 */
  transform: none;
}
.users_reserve__lesson.is-open .lesson-date:hover {
  box-shadow: none;
  transform: none;
  border-color: transparent;
  border-bottom-color: #f0f4f8;
}
.users_reserve__lesson.is-open {
  /* 詳細パネル: ごく淡い青ティント (候補と同じ #fafcff) */
}
.users_reserve__lesson.is-open .lesson-details {
  background: #fafcff;
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.users_reserve__lesson .lesson-details .block-title {
  font-weight: bold;
  text-align: left;
}
.users_reserve__lesson .lesson-details .block.select {
  width: 100%;
  height: 62px;
  display: grid;
  grid-template-columns: 220px 1fr;
}
@media (max-width: 900px) {
  .users_reserve__lesson .lesson-details .block.select {
    grid-template-columns: 180px 1fr;
    height: 70px;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select {
    height: auto;
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
  }
}
.users_reserve__lesson .lesson-details .block.select .teacher {
  display: flex;
  align-items: center;
  padding-left: 1em;
  font-weight: bold;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .teacher {
    padding: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.select .teacher::after {
  position: absolute;
  top: 50%;
  right: -60px;
  content: "";
  width: 60px;
  height: 110px;
  background: #f8f8f8;
  transform: rotate(-20deg) translateY(-50%);
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .teacher::after {
    content: none;
  }
}
.users_reserve__lesson .lesson-details .block.select .teacher .block-title {
  margin-right: 1em;
}
.users_reserve__lesson .lesson-details .block.select .teacher .name {
  color: var(--site_blue);
}
.users_reserve__lesson .lesson-details .block.select {
  /* Stage D 修正(215): 旧ラジオ式の希望ツール選択を撤廃し
   * 読み取り専用バッジ表示に変更 (予約時の確認画面で選択
   * されたものを表示するだけ)。 */
}
.users_reserve__lesson .lesson-details .block.select .tool-select {
  padding-left: 1em;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: #f8f8f8;
  gap: 16px;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .users_reserve__lesson .lesson-details .block.select .tool-select {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .tool-select {
    padding: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.select .tool-select .block-title {
  margin-right: 0;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .tool-select .block-title {
    margin-bottom: 0.5em;
  }
}
.users_reserve__lesson .lesson-details .block.select .tool-select__display {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.users_reserve__lesson .lesson-details .block.select .tool-select__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  background: var(--site_blue, #0078d7);
  border-radius: 999px;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .tool-select__badge {
    font-size: 13px;
    padding: 3px 11px;
  }
}
.users_reserve__lesson .lesson-details .block.select .tool-select__badge--wechat {
  background: #1aad19;
}
.users_reserve__lesson .lesson-details .block.select .tool-select__badge--netchai {
  background: #f57db4;
}
.users_reserve__lesson .lesson-details .block.select .tool-select__badge--none {
  background: #999;
}
.users_reserve__lesson .lesson-details .block.select .tool-select__hint {
  font-size: 11px;
  color: #888;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.select .tool-select__hint {
    font-size: 10px;
  }
}
.users_reserve__lesson .lesson-details .block .icon_link {
  display: block;
}
.users_reserve__lesson .lesson-details .block .icon_link span {
  display: inline-block;
  line-height: 1.8;
  padding-right: 1.5em;
  position: relative;
}
.users_reserve__lesson .lesson-details .block .icon_link span::after {
  position: absolute;
  top: 0.3em;
  right: 0;
  content: "";
  width: 15px;
  height: 15px;
  background: url(../../img/v2/common/icon_link_bk.svg) no-repeat;
  background-size: contain;
}
.users_reserve__lesson .lesson-details .block.teams {
  border-top: #999999 solid 1px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.teams {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.teams .block-title {
  width: 220px;
  padding-left: 1em;
}
@media (max-width: 900px) {
  .users_reserve__lesson .lesson-details .block.teams .block-title {
    width: 180px;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.teams .block-title {
    padding-left: 0;
    padding-bottom: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams {
  padding: 1em;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.teams .tool-teams {
    padding: 0;
  }
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .btn-teams {
  margin: 0;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .btn-teams::after {
  content: none;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .btn-teams span {
  font-size: 18px;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams {
  /* Stage D 修正(235): T3 (時系列ステップ) 用レイアウト。
   *   ①講師に連絡 / ②開かない時 / ③アカウントID コピー
   *   の 3 ステップを縦に並べ、左に番号サークルを表示。 */
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams.teams-steps {
  padding: 0;
  width: 100%;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step {
  display: flex;
  gap: 12px;
  padding: 12px 0;
  align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step {
    padding: 10px 0;
  }
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step + .teams-step {
  border-top: 1px dashed #d6e6f7;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #0078d7;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__content {
  flex: 1;
  min-width: 0;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__heading {
  font-weight: bold;
  font-size: 14px;
  color: #1f2937;
  margin-bottom: 4px;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__detail {
  font-size: 13px;
  color: #555;
  line-height: 1.55;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__detail a {
  color: #3fa9f5;
  font-weight: bold;
  text-decoration: none;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__detail a:hover {
  text-decoration: underline;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__sep {
  margin: 0 6px;
  color: #aaa;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams .teams-step__action {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams p span {
  display: block;
  font-size: 15px;
  font-weight: bold;
}
.users_reserve__lesson .lesson-details .block.teams .tool-teams p a {
  display: inline-block;
  color: #3fa9f5;
  font-size: 15px;
  font-weight: bold;
}
.users_reserve__lesson .lesson-details .block.wechat {
  border-top: #999999 solid 1px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.wechat {
    padding: 1em;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }
}
.users_reserve__lesson .lesson-details .block.wechat .block-title {
  width: 220px;
  padding-left: 1em;
}
@media (max-width: 900px) {
  .users_reserve__lesson .lesson-details .block.wechat .block-title {
    width: 180px;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.wechat .block-title {
    padding-left: 0;
    padding-bottom: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.wechat .tool-wechat {
  padding: 1em;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.wechat .tool-wechat {
    padding: 0;
  }
}
.users_reserve__lesson .lesson-details .block.netchai {
  border-top: #999999 solid 1px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.netchai {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.netchai .block-title {
  width: 220px;
  padding-left: 1em;
}
@media (max-width: 900px) {
  .users_reserve__lesson .lesson-details .block.netchai .block-title {
    width: 180px;
  }
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.netchai .block-title {
    padding-left: 0;
    padding-bottom: 1em;
  }
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai {
  padding: 1em;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.netchai .tool-netchai {
    padding: 0;
  }
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai .btn-pink {
  margin: 0 auto 10px 0;
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai {
  /* Stage D 修正(238): ミーティング開くボタンと
   *   操作手順の補足を横並びにする。SP では縦並び。 */
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai .netchai-action {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 10px;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.netchai .tool-netchai .netchai-action {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai .netchai-action .btn-pink {
  margin: 0;
}
.users_reserve__lesson .lesson-details .block.netchai .tool-netchai .netchai-action__note {
  font-size: 12.5px;
  line-height: 1.55;
  color: #555;
  background: #fff;
  border: 1px dashed #f3a3c7;
  border-radius: 6px;
  padding: 6px 10px;
  max-width: 380px;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .block.netchai .tool-netchai .netchai-action__note {
    font-size: 12px;
    max-width: 100%;
  }
}
.users_reserve__lesson .lesson-details .block {
  /* Stage D 修正(216, 218): 旧 .block.course / .block.plan の
     テーブル風 2 段構成 (修正 216) を撤廃して、
     .lesson-info-cards 配下のアイコン付きカード (A1) に刷新。
     旧クラスは念のため display: none で残しておく。 */
}
.users_reserve__lesson .lesson-details .block.course, .users_reserve__lesson .lesson-details .block.plan {
  display: none;
}
.users_reserve__lesson .lesson-details {
  /* Stage D 修正(218): デザイン候補 A1 (アイコン付き 2 カラムカード)
   *   レッスン内容 + 予約プラン を横並びの白カードで表示する。
   *   .lesson-info-card 内に丸い青/ピンクのアイコン + ラベル/値。
   *   SP では 1 列に折り返し。
   *
   * Stage D 修正(232): 背景を透明化して、他のブロック
   *   (teams/wechat/netchai) と同じ親 .lesson-details の地色を
   *   引き継ぐようにする (.is-open 時は #fafcff の淡青ティント)。
   *   水平区切り線は他ブロックと同じ #999 1px に統一。 */
}
.users_reserve__lesson .lesson-details .lesson-info-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 14px 1em;
  border-top: #999999 solid 1px;
  background: transparent;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .lesson-info-cards {
    grid-template-columns: 1fr;
    padding: 14px 0;
  }
}
.users_reserve__lesson .lesson-details {
  /* Stage D 修正(233): 個別カードの枠/影/角丸を削除して、
   *   周囲のブロック (teams/wechat/netchai 等) と同じ感覚で
   *   並ぶようにする。アイコン + ラベル + 値の構造はそのまま。 */
}
.users_reserve__lesson .lesson-details .lesson-info-card {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  gap: 14px;
  box-shadow: none;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .lesson-info-card {
    padding: 4px 8px;
    gap: 12px;
  }
}
.users_reserve__lesson .lesson-details .lesson-info-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0078d7, #4ca7ec);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .lesson-info-card__icon {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }
}
.users_reserve__lesson .lesson-details .lesson-info-card--plan .users_reserve__lesson .lesson-details .lesson-info-card__icon {
  background: linear-gradient(135deg, #f57db4, #f3a3c7);
}
.users_reserve__lesson .lesson-details .lesson-info-card__text {
  min-width: 0;
  flex: 1;
}
.users_reserve__lesson .lesson-details .lesson-info-card__label {
  font-size: 11px;
  color: #6b7280;
  font-weight: bold;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .lesson-info-card__label {
    font-size: 10.5px;
  }
}
.users_reserve__lesson .lesson-details .lesson-info-card__value {
  font-size: 16px;
  font-weight: bold;
  color: #1f2937;
  margin-top: 2px;
  line-height: 1.35;
  word-break: break-word;
}
@media screen and (max-width: 768px) {
  .users_reserve__lesson .lesson-details .lesson-info-card__value {
    font-size: 14px;
  }
}
.users_reserve__lesson .lesson-details {
  /* Stage D 修正(216): クリップボードコピー対応の汎用 row
   *   - copy-row: 縦並び (値の下にボタン or 同一行に並ぶ)
   *   - copy-row--inline: 1 行で「ラベル: 値 [📋]」を表示 */
}
.users_reserve__lesson .lesson-details .copy-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.users_reserve__lesson .lesson-details .copy-row__label {
  font-weight: bold;
  font-size: 14px;
}
.users_reserve__lesson .lesson-details .copy-row__value {
  display: inline-block;
  line-height: 1.6;
  word-break: break-all;
  color: #333;
}
.users_reserve__lesson .lesson-details .copy-row a.copy-row__value {
  color: #3fa9f5;
  text-decoration: underline;
}
.users_reserve__lesson .lesson-details .copy-row__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  background: #fff;
  border: 1px solid #c8d6e8;
  border-radius: 6px;
  color: var(--site_blue, #0078d7);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  position: relative;
  flex-shrink: 0;
}
.users_reserve__lesson .lesson-details .copy-row__btn:hover {
  background: #e8f1ff;
  border-color: #aacbf0;
}
.users_reserve__lesson .lesson-details .copy-row__btn:active {
  background: #d6e4f5;
}
.users_reserve__lesson .lesson-details .copy-row__btn:focus-visible {
  outline: 2px solid #66b3ff;
  outline-offset: 2px;
}
.users_reserve__lesson .lesson-details .copy-row__btn.is-copied {
  background: #d4edda;
  border-color: #66c074;
  color: #2d7e3a;
}
.users_reserve__lesson .lesson-details .copy-row__icon {
  width: 14px;
  height: 14px;
  pointer-events: none;
}
.users_reserve__lesson .lesson-details {
  /* コピー成功フィードバックを吹き出し風に絶対配置 */
}
.users_reserve__lesson .lesson-details .js-copy-btn__feedback {
  position: absolute;
  top: -28px;
  right: 50%;
  transform: translateX(50%);
  font-size: 11px;
  font-weight: bold;
  background: #2d7e3a;
  color: #fff;
  padding: 3px 8px;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}
.users_reserve__lesson .lesson-details .js-copy-btn__feedback:not(:empty) {
  opacity: 1;
}
.users_reserve__lesson .lesson-details {
  /* Stage D 修正(232): teams/wechat/netchai の左 6px 縦バー
   *   (.is-active 時に青) を撤去。各ブロックは border-top で
   *   水平方向にのみ仕切る。NetChai Meeting だけ青線が出る
   *   違和感を解消。 */
}
.users_reserve__lesson .lesson-details .block.teams::before,
.users_reserve__lesson .lesson-details .block.wechat::before,
.users_reserve__lesson .lesson-details .block.netchai::before {
  content: none;
}
.users_reserve__lesson .lesson-details .block.teams.is-active::before,
.users_reserve__lesson .lesson-details .block.wechat.is-active::before,
.users_reserve__lesson .lesson-details .block.netchai.is-active::before {
  content: none;
}

.users_archive {
  margin-bottom: 30px;
}
.users_archive .c-heading2.users_archive__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .users_archive .c-heading2.users_archive__head {
    margin-bottom: 20px;
  }
}
.users_archive .c-heading2.users_archive__head::before {
  width: 42px;
  height: 43px;
  background: url(../../img/v2/common/icon_calendar.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .users_archive .c-heading2.users_archive__head::before {
    width: 29px;
    height: 30px;
  }
}
.users_archive__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .users_archive__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .users_archive__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.users_archive__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .users_archive__contents {
    padding: 0;
  }
}
.users_archive__lesson {
  font-size: 16px;
  line-height: 1.5;
  background: #e8e8e8;
  margin-bottom: 20px;
}
.users_archive__lesson .lesson-record {
  width: 100%;
  background: #555555;
  height: 62px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
  font-weight: bold;
  position: relative;
  padding: 0 1em;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record {
    height: auto;
    padding: 1em;
  }
}
.users_archive__lesson .lesson-record__col {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 5px;
  }
}
.users_archive__lesson .lesson-record__col .date {
  width: 250px;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-record__col .date {
    width: auto;
  }
}
.users_archive__lesson .lesson-record__col .date span {
  display: inline-block;
}
.users_archive__lesson .lesson-record__col .date span + span {
  margin-left: 1.5em;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col .date span + span {
    margin-left: 0.5em;
  }
}
.users_archive__lesson .lesson-record__nav {
  display: flex;
  align-items: center;
  padding-right: 1em;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__nav {
    padding-right: 0;
  }
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-record__nav {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
  }
}
.users_archive__lesson .lesson-record__nav .js-evaluation {
  display: inline-block;
  padding: 5px 10px;
  color: #fff;
  font-size: 18px;
  background: #f7bb67;
  border-radius: 5px;
  margin-right: 1em;
  outline: none;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-record__nav .js-evaluation {
    font-size: 16px;
    margin-right: 0;
    margin-bottom: 10px;
  }
}
.users_archive__lesson .lesson-record__nav .js-evaluation.is-complete {
  background: #888888;
}
.users_archive__lesson .lesson-record .js-ac-trigger {
  display: block;
  width: 22px;
  height: 22px;
  background: url(../../img/v2/users_mypage/icon_open.svg) no-repeat;
  background-size: contain;
  cursor: pointer;
  outline: none;
  border: none;
}
.users_archive__lesson .lesson-record .js-ac-trigger.is-open {
  background: url(../../img/v2/users_mypage/icon_close.svg) no-repeat;
  background-size: contain;
}
.users_archive__lesson .lesson-details .block {
  border-top: #999999 solid 1px;
  padding: 0.8em 1em;
  display: flex;
  justify-content: flex-start;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-details .block {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
  }
}
.users_archive__lesson .lesson-details .block .block-title {
  width: 250px;
  font-weight: bold;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-details .block .block-title {
    width: auto;
  }
}

/* ============================================================
 * Stage D 修正(241): 評価モーダル (.evaluation-modal) のモダンデザイン
 *   旧テーブル + GIF ボタンの粗いレイアウトを撤廃して、card 風モーダル
 *   に刷新。lesson_action_js が #select_*, .tutor_name, .lesson_date,
 *   #comment, #evaluation_submit/close を参照するため、これら ID/class は
 *   保持する。
 * ============================================================ */
.evaluation-modal {
  /* lesson_action_js._show_confirm() がインラインで padding:20px を
     かけるので、内側コンテンツとして自然な見た目に。 */
  width: min(420px, 100%);
  margin: 0 auto;
  font-family: inherit;
}
.evaluation-modal__head {
  text-align: center;
  padding: 4px 0 16px;
  border-bottom: 1px solid #f0f4f8;
  margin-bottom: 16px;
}
.evaluation-modal__title {
  font-size: 18px;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 4px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.evaluation-modal__title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, #f7bb67, #f57db4);
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
}
.evaluation-modal__subtitle {
  font-size: 12.5px;
  color: #6b7280;
  margin: 0;
}
.evaluation-modal__info {
  background: #f3f8ff;
  border: 1px solid #d6e6f7;
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 18px;
}
.evaluation-modal__info-row {
  display: flex;
  gap: 12px;
  font-size: 13px;
  line-height: 1.5;
}
.evaluation-modal__info-row + .evaluation-modal__info-row {
  margin-top: 4px;
}
.evaluation-modal__info-label {
  flex: 0 0 92px;
  color: #6b7280;
  font-weight: bold;
}
.evaluation-modal__info-value {
  color: #1f2937;
  font-weight: bold;
}
.evaluation-modal__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.evaluation-modal__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.evaluation-modal__label {
  font-size: 13px;
  font-weight: bold;
  color: #374151;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.evaluation-modal__label::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4ca7ec, #0078d7);
}
.evaluation-modal__select-wrap {
  position: relative;
}
.evaluation-modal__select-wrap::after {
  content: "▾";
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  color: #0078d7;
  font-size: 12px;
  pointer-events: none;
}
.evaluation-modal__select {
  width: 100%;
  height: 38px;
  padding: 0 32px 0 12px;
  font-size: 14px;
  font-weight: bold;
  color: #1f2937;
  background: #fff;
  border: 1px solid #d6e6f7;
  border-radius: 6px;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.evaluation-modal__select:hover {
  border-color: #aacbf0;
}
.evaluation-modal__select:focus {
  outline: none;
  border-color: #0078d7;
  box-shadow: 0 0 0 3px rgba(0, 120, 215, 0.15);
}
.evaluation-modal__select {
  /* 未選択 (value=0) のときは控えめなテキスト色に */
}
.evaluation-modal__select:invalid, .evaluation-modal__select[data-empty=true] {
  color: #9ca3af;
}
.evaluation-modal__textarea {
  width: 100%;
  min-height: 96px;
  padding: 10px 12px;
  font-size: 14px;
  font-family: inherit;
  color: #1f2937;
  background: #fff;
  border: 1px solid #d6e6f7;
  border-radius: 6px;
  resize: vertical;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.evaluation-modal__textarea::placeholder {
  color: #9ca3af;
}
.evaluation-modal__textarea:hover {
  border-color: #aacbf0;
}
.evaluation-modal__textarea:focus {
  outline: none;
  border-color: #0078d7;
  box-shadow: 0 0 0 3px rgba(0, 120, 215, 0.15);
}
.evaluation-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #f0f4f8;
}
.evaluation-modal__btn {
  min-width: 110px;
  height: 40px;
  padding: 0 18px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 8px;
  cursor: pointer;
  transition: filter 0.12s ease, transform 0.05s ease, box-shadow 0.12s ease;
  border: none;
}
.evaluation-modal__btn:focus-visible {
  outline: 2px solid #66b3ff;
  outline-offset: 2px;
}
.evaluation-modal__btn--cancel {
  color: #444;
  background: #fff;
  border: 1px solid #d6e0ec;
}
.evaluation-modal__btn--cancel:hover {
  background: #f3f8ff;
  border-color: #aacbf0;
  color: #0078d7;
}
.evaluation-modal__btn--submit {
  color: #fff;
  background: linear-gradient(135deg, #f7bb67, #f57db4);
  box-shadow: 0 2px 6px rgba(245, 125, 180, 0.25);
}
.evaluation-modal__btn--submit:hover {
  filter: brightness(1.06);
  box-shadow: 0 4px 10px rgba(245, 125, 180, 0.35);
}
.evaluation-modal__btn--submit:active {
  filter: brightness(0.95);
  transform: translateY(1px);
}

/* ============================================================
 * Stage D 修正(272): レッスン確認モーダル (.confirm-modal) のモダン
 *   デザイン。旧テーブル (tbl_lesson_confirm) + GIF ボタン構成を撤廃し、
 *   評価モーダル (.evaluation-modal / 修正241) と揃えた card 風モーダル
 *   に刷新。lesson_action_js が .kind / .effect_on / .lesson_date /
 *   #confirm_submit / #confirm_close を参照するため ID/class は保持。
 * ============================================================ */
.confirm-modal {
  width: min(400px, 100%);
  margin: 0 auto;
  /* Stage D 修正(274): 講師ページは main[class^="tutors_"] に
   *   font-family: var(--font-zh) (中国語フォント優先) が当たっており、
   *   その配下のこのモーダルも中国語フォント (Windows では
   *   Microsoft YaHei) で描画され、日本語 UI なのに違和感が出ていた。
   *   日本語優先 + 中国語フォールバックの --font-ja-zh を明示し、
   *   日本語字形 (Hiragino/Meiryo) で描画する。生徒名等に含まれる
   *   簡体字専用文字は後段の中国語フォントへ自動フォールバックする。 */
  font-family: var(--font-ja-zh);
}
.confirm-modal__head {
  text-align: center;
  padding: 4px 0 16px;
  border-bottom: 1px solid #f0f4f8;
  margin-bottom: 16px;
}
.confirm-modal__title {
  font-size: 18px;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 4px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.confirm-modal__title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4ca7ec, #0078d7);
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
}
.confirm-modal__info {
  background: #f3f8ff;
  border: 1px solid #d6e6f7;
  border-radius: 8px;
  padding: 12px 14px;
}
.confirm-modal__info-row {
  display: flex;
  gap: 12px;
  font-size: 13px;
  line-height: 1.6;
}
.confirm-modal__info-row + .confirm-modal__info-row {
  margin-top: 6px;
}
.confirm-modal__info-label {
  flex: 0 0 84px;
  color: #6b7280;
  font-weight: bold;
}
.confirm-modal__info-value {
  color: #1f2937;
  font-weight: bold;
}
.confirm-modal__footer {
  display: flex;
  /* Stage D 修正(273): ボタンを中央寄せに変更 (旧 flex-end は右寄り) */
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #f0f4f8;
}
.confirm-modal__btn {
  min-width: 110px;
  height: 40px;
  padding: 0 18px;
  /* Stage D 修正(273): <button> はリセット対象外でブラウザ既定
   *   フォントになり本文フォントと食い違う ("フォントの違和感")。
   *   font-family: inherit でサイト本文フォントを継承させる。 */
  font-family: inherit;
  font-size: 14px;
  font-weight: bold;
  border-radius: 8px;
  cursor: pointer;
  transition: filter 0.12s ease, transform 0.05s ease, box-shadow 0.12s ease;
  border: none;
}
.confirm-modal__btn:focus-visible {
  outline: 2px solid #66b3ff;
  outline-offset: 2px;
}
.confirm-modal__btn--cancel {
  color: #444;
  background: #fff;
  border: 1px solid #d6e0ec;
}
.confirm-modal__btn--cancel:hover {
  background: #f3f8ff;
  border-color: #aacbf0;
  color: #0078d7;
}
.confirm-modal__btn--submit {
  color: #fff;
  background: linear-gradient(135deg, #4ca7ec, #0078d7);
  box-shadow: 0 2px 6px rgba(0, 120, 215, 0.28);
}
.confirm-modal__btn--submit:hover {
  filter: brightness(1.06);
  box-shadow: 0 4px 10px rgba(0, 120, 215, 0.38);
}
.confirm-modal__btn--submit:active {
  filter: brightness(0.95);
  transform: translateY(1px);
}

/* ============================================================
 * Stage D 修正(240): mypage レッスン履歴 (.users_archive__lesson) の
 *   各カードに、予約一覧 (.users_reserve__lesson) と同じデザインを適用。
 *   - lesson-date (白カード + 水色 4px 左ライン、hover でピンク)
 *   - .is-open 時に大枠 + 薄ピンク 5px 左ライン
 *   - .lesson-details / .lesson-info-cards で コース + プラン を表示
 *   - 評価ボタン (.js-evaluation) はナビ右に置く
 * ============================================================ */
.users_archive__lesson {
  font-size: 15px;
  line-height: 1.5;
  background: transparent;
  margin-bottom: 14px;
}
.users_archive__lesson h3 {
  text-align: left;
  padding-left: 0;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  margin: 0;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .users_archive__lesson h3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 768px) {
  .users_archive__lesson h3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 450px) {
  .users_archive__lesson h3 {
    font-size: 13px;
  }
}
.users_archive__lesson .lesson-date {
  width: 100%;
  background: #fff;
  border: 1px solid #e3eaf3;
  border-left: 4px solid #93c5fd;
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #333;
  font-weight: normal;
  position: relative;
  padding: 14px 18px 14px 16px;
  gap: 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease, border-left-color 0.15s ease;
  height: auto;
}
.users_archive__lesson .lesson-date:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
  border-color: #c8d6e8;
  border-left-color: #f57db4;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date {
    flex-wrap: wrap;
    padding: 12px 14px 12px 12px;
    gap: 10px;
  }
}
.users_archive__lesson .lesson-date__col {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  flex: 1 1 auto;
  min-width: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__col {
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: flex-start;
  }
}
.users_archive__lesson .lesson-date__col .date {
  display: flex;
  align-items: center;
  gap: 14px;
  line-height: 1.3;
  min-width: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__col .date {
    gap: 10px;
  }
}
.users_archive__lesson .lesson-date__col .date span {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  color: #333;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__col .date span {
    font-size: 13px;
  }
}
.users_archive__lesson .lesson-date__col .date .day {
  color: var(--site_blue, #0078d7);
}
.users_archive__lesson .lesson-date__col .date .time {
  font-size: 14px;
  color: #555;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__col .date .time {
    font-size: 12px;
  }
}
.users_archive__lesson .lesson-date__col .date .time::before {
  content: "⏱";
  margin-right: 4px;
  opacity: 0.7;
}
.users_archive__lesson .lesson-date__tutor {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 4px 10px;
  font-size: 13px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  background: #e8f1ff;
  border-radius: 999px;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__tutor {
    font-size: 12px;
    padding: 3px 8px;
  }
}
.users_archive__lesson .lesson-date__tutor a {
  color: inherit;
  text-decoration: none;
}
.users_archive__lesson .lesson-date__tutor a:hover {
  text-decoration: underline;
}
.users_archive__lesson .lesson-date__nav {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-right: 0;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__nav {
    margin-left: auto;
  }
}
.users_archive__lesson .lesson-date__nav {
  /* Stage D 修正(242): 評価ボタンと評価済バッジのデザイン更新
   *   評価する: 薄いオレンジ背景 + 濃いオレンジ文字 (見やすく)
   *   評価済:   薄い緑背景 + 濃い緑文字 (完了感) + ✓ アイコン */
}
.users_archive__lesson .lesson-date__nav .js-evaluation {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: bold;
  color: #c47a1c;
  background: #fff7eb;
  border: 1px solid #f7bb67;
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.users_archive__lesson .lesson-date__nav .js-evaluation:hover {
  background: #fdebcc;
  border-color: #ee9b3a;
  color: #a55f0d;
}
.users_archive__lesson .lesson-date__nav .js-evaluation.is-complete {
  color: #2d7e3a;
  background: #e8f5ec;
  border-color: #b1d8b8;
  cursor: default;
}
.users_archive__lesson .lesson-date__nav .js-evaluation.is-complete::before {
  content: "✓";
  font-size: 13px;
}
.users_archive__lesson .lesson-date__nav .js-evaluation.is-complete:hover {
  background: #e8f5ec;
  border-color: #b1d8b8;
  color: #2d7e3a;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-date__nav .js-evaluation {
    font-size: 12px;
    padding: 6px 11px;
  }
}
.users_archive__lesson .lesson-date {
  /* +/- トグルボタン (予約と共通スタイル) */
}
.users_archive__lesson .lesson-date .js-lesson-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  background: #f3f8ff;
  outline: none;
  border: 1px solid #d6e6f7;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  transition: background 0.15s ease, border-color 0.15s ease;
}
.users_archive__lesson .lesson-date .js-lesson-toggle:hover {
  background: #e8f1ff;
  border-color: #aacbf0;
}
@media screen and (max-width: 450px) {
  .users_archive__lesson .lesson-date .js-lesson-toggle__label {
    display: none;
  }
}
.users_archive__lesson .lesson-date .js-lesson-toggle__icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
}
.users_archive__lesson .lesson-date .js-lesson-toggle__icon::before {
  content: "+";
}
.users_archive__lesson .lesson-date .js-lesson-toggle[aria-expanded=true] .users_archive__lesson .lesson-date .js-lesson-toggle__icon::before {
  content: "−";
}
.users_archive__lesson.is-open .lesson-date .js-lesson-toggle__icon::before {
  content: "−";
}
.users_archive__lesson {
  /* .is-open 時の大枠 + 薄ピンク 5px 左ライン */
}
.users_archive__lesson.is-open {
  background: #fff;
  border: 1px solid #d6e6f7;
  border-left: 5px solid #f3a3c7;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 120, 215, 0.12);
  overflow: hidden;
  margin-bottom: 22px;
}
.users_archive__lesson.is-open .lesson-date {
  border: none;
  border-left: none;
  border-radius: 0;
  box-shadow: none;
  border-bottom: 1px solid #f0f4f8;
  transform: none;
}
.users_archive__lesson.is-open .lesson-date:hover {
  box-shadow: none;
  transform: none;
  border-color: transparent;
  border-bottom-color: #f0f4f8;
}
.users_archive__lesson.is-open .lesson-details {
  background: #fafcff;
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.users_archive__lesson {
  /* レッスン内容 + 予約プランの 2 カラム表示 (予約と共通の見た目) */
}
.users_archive__lesson .lesson-info-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 14px 1em;
  background: transparent;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-info-cards {
    grid-template-columns: 1fr;
    padding: 14px 0;
  }
}
.users_archive__lesson .lesson-info-card {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  gap: 14px;
  box-shadow: none;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-info-card {
    padding: 4px 8px;
    gap: 12px;
  }
}
.users_archive__lesson .lesson-info-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0078d7, #4ca7ec);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-info-card__icon {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }
}
.users_archive__lesson .lesson-info-card--plan .users_archive__lesson .lesson-info-card__icon {
  background: linear-gradient(135deg, #f57db4, #f3a3c7);
}
.users_archive__lesson .lesson-info-card__text {
  min-width: 0;
  flex: 1;
}
.users_archive__lesson .lesson-info-card__label {
  font-size: 11px;
  color: #6b7280;
  font-weight: bold;
  letter-spacing: 0.02em;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-info-card__label {
    font-size: 10.5px;
  }
}
.users_archive__lesson .lesson-info-card__value {
  font-size: 16px;
  font-weight: bold;
  color: #1f2937;
  margin-top: 2px;
  line-height: 1.35;
  word-break: break-word;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-info-card__value {
    font-size: 14px;
  }
}

.change1,
.change2,
.change_students {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .change1,
  .change2,
  .change_students {
    padding-bottom: 60px;
  }
}
.change1 .l-page__main .l-section,
.change2 .l-page__main .l-section,
.change_students .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .change1 .l-page__main .l-section .l-section__inner,
  .change2 .l-page__main .l-section .l-section__inner,
  .change_students .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .change1 .l-page__main .l-section .l-section__inner,
  .change2 .l-page__main .l-section .l-section__inner,
  .change_students .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}

.page-head__title.page-change {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-change {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.membership-info {
  margin-bottom: 30px;
}
.membership-info .c-heading2.membership-info__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .membership-info .c-heading2.membership-info__head {
    margin-bottom: 20px;
  }
}
.membership-info .c-heading2.membership-info__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/common/icon_member-card.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .membership-info .c-heading2.membership-info__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.membership-info .c-heading2.membership-info2__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .membership-info .c-heading2.membership-info2__head {
    margin-bottom: 20px;
  }
}
.membership-info .c-heading2.membership-info2__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/common/icon_member-card2.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .membership-info .c-heading2.membership-info2__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.membership-info__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .membership-info__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .membership-info__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.membership-info__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .membership-info__contents {
    padding: 0;
  }
}
.membership-info__contents span.item-required {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  padding-left: 10px;
  border-left: 6px solid #de2246;
  margin-bottom: 30px;
}

.change_students .membership-info .list-dot-blue li a {
  color: #3fa9f5;
  text-decoration: underline;
}
.change_students .membership-info .table_register th {
  font-size: 16px;
  width: 260px;
}
@media screen and (max-width: 768px) {
  .change_students .membership-info .table_register th {
    width: 100%;
    font-size: 14px;
  }
}
.change_students .membership-info .table_register td {
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .change_students .membership-info .table_register td {
    width: 100%;
    font-size: 14px;
  }
}
.change_students .membership-info .table_register td .list-dot-pink {
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .change_students .membership-info .table_register td .list-dot-pink {
    font-size: 12px;
  }
}
.change_students .membership-info .table_register td .list-dot-pink li + li {
  margin-top: 0.5em;
}
.change_students .membership-info {
  /* Stage D 修正(247 → 252): ラジオを縦並びにする。
   *   FormHelper の出力が input1, label1, input2, label2 のように
   *   平坦な兄弟要素のため、flex column だと各要素が独立した行に
   *   なってしまう (ラジオ→空行→ラベル→空行→ラジオ→空行)。
   *   CSS grid (max-content 1fr) の自動フローで、input は左列、
   *   label は同行の右列に並ぶように制御する。 */
}
.change_students .membership-info .radio-stack {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 8px;
  row-gap: 6px;
  align-items: center;
}
.change_students .membership-info .radio-stack label {
  display: inline-block;
  line-height: 1.5;
  cursor: pointer;
}
.change_students .membership-info .radio-stack input[type=radio] {
  margin: 0;
  cursor: pointer;
}
.change_students .membership-info {
  /* Stage D 修正(251): 注意書き行の TR の交互背景 (グレー) はそのまま
   *   維持して、.notice-checklist を transparent にすることで周囲の
   *   グレーに溶け込ませる。SP の左 6px ボーダーだけは余分なので撤去。 */
}
.change_students .membership-info .table_register tr:has(.notice-checklist) > td {
  border-left: none !important;
}
.change_students .membership-info {
  /* Stage D 修正(248 → 251): N8 (チェックマーク付きタスク風) 注意書きリスト。
   *   背景は透明 (親 TR の交互グレー #f8f8f8 / #e8e8e8 を継承)、
   *   枠線なし。チェックマーク + テキストだけが見える状態に。 */
}
.change_students .membership-info .notice-checklist {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  list-style: none;
  margin: 0;
}
.change_students .membership-info .notice-checklist li {
  padding-left: 26px;
  position: relative;
  font-size: 13.5px;
  line-height: 1.6;
  color: #374151;
}
@media screen and (max-width: 768px) {
  .change_students .membership-info .notice-checklist li {
    font-size: 12.5px;
    padding-left: 24px;
  }
}
.change_students .membership-info .notice-checklist li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--site_blue, #0078d7);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: bold;
  line-height: 1;
}
.change_students .membership-info .notice-checklist li + li {
  margin-top: 8px;
}

/* Stage D 修正(97): /timetables/reserveTutorsLesson のデザインを
 *   /tutors/show (案 21 白背景版) と統一
 *   - ページ全体の淡い青 #f7faff を白に
 *   - .reserve-timetable のセクション内も白に
 *   - .table_timetable に青系のアウトラインボーダーを付与
 *   - 講師情報行は透明な青ガラス風 (淡い青ストライプ) で揃える
 */
.reserveTutorsLesson {
  background: #fff;
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .reserveTutorsLesson {
    padding-bottom: 60px;
  }
}

.page-head__title.page-reserveTutorsLesson {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-reserveTutorsLesson {
    background-position: center top;
  }
}

.reserve-timetable {
  padding-top: 30px;
  /* Stage D 修正(97): 講師一覧と統一して白背景に */
  background: #fff;
  margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable .l-section__inner {
    padding-top: 30px;
  }
}
.reserve-timetable .c-heading2.reserve-timetable__head::before {
  width: 42px;
  height: 43px;
  background: url(../../img/v2/lesson_timetables/timetable_title_icon.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .reserve-timetable .c-heading2.reserve-timetable__head::before {
    width: 28px;
    height: 28.6px;
  }
}
.reserve-timetable__lead {
  width: 650px;
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.reserve-timetable__contents {
  /* Stage D 修正(98): カレンダー外枠を講師一覧と同じ青ガラス系に */
}
.reserve-timetable__contents .calendar {
  width: 556px;
  padding: 7px;
  background: rgba(161, 196, 253, 0.08);
  border-radius: 10px;
  border: 1px solid #9cc0f0;
  box-shadow: 0 4px 14px rgba(31, 38, 135, 0.08);
  margin: 0 auto 20px;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .calendar {
    max-width: 556px;
    width: 100%;
  }
}
.reserve-timetable__contents .calendar .row {
  background: #fff;
  border: #d1d1d1 solid 1px;
  border-radius: 5px;
  padding: 15px 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .calendar .row {
    grid-template-rows: auto auto;
    grid-template-columns: 100%;
  }
}
.reserve-timetable__contents .calendar .row .col .month {
  display: block;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding-bottom: 5px;
  border-bottom: #b2b2b2 solid 1px;
}
.reserve-timetable__contents .calendar .row .col .table_calendar {
  width: 100%;
  border-collapse: separate;
  border-spacing: 3px;
}
.reserve-timetable__contents .calendar .row .col .table_calendar th {
  padding: 10px 0;
  font-size: 14px;
  font-weight: normal;
}
.reserve-timetable__contents .calendar .row .col .table_calendar td {
  font-size: 14px;
  background: #f4f4f4;
  padding: 5px 0;
  text-align: center;
}
.reserve-timetable__contents .calendar .row .col .table_calendar td.holiday {
  color: #fff;
  background: #f57db4;
}
.reserve-timetable__contents .calendar .row .col .table_calendar tr > td:nth-child(1).date {
  color: #fff;
  background: #f57db4;
}
.reserve-timetable__contents .calendar .row .col .table_calendar tr > td:nth-child(7).date {
  color: #fff;
  background: #0078d7;
}
.reserve-timetable__contents .tutors-toggle {
  width: 556px;
  margin: 0 auto 100px;
  background: #fff;
  padding: 1em 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .tutors-toggle {
    max-width: 556px;
    width: 100%;
    margin-bottom: 50px;
  }
}
.reserve-timetable__contents .timetable h3.date {
  font-size: 36px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 25px;
}
.reserve-timetable__contents .timetable .table-wrap {
  width: 100%;
  /*overflow-x: scroll;*/
}
.reserve-timetable__contents .timetable .table_timetable {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  /* Stage D 修正(99): 講師一覧 .col と同じ青アウトライン + 強めの影 */
  background: #fff;
  border: 1px solid #9cc0f0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(31, 38, 135, 0.14);
  margin: 12px 0 24px;
}
.reserve-timetable__contents .timetable .table_timetable thead th {
  /* Stage D 修正(101): 濃い青グラデを廃止、薄い透明水色 +
   *   文字色は紺系 (#1a3a72) に変更
   */
  background: rgba(135, 215, 240, 0.18);
  color: #1a3a72;
  text-align: center;
  border-right: rgba(135, 215, 240, 0.4) solid 1px;
  /* Stage D 修正(102): 案 E20 を適用 — 写真の右上に白丸ハートバッジ
   *   1 段組み、写真 + バッジ + 名前 を縦に並べる。
   */
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell {
  padding: 10px 6px;
  text-align: center;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay {
  position: relative;
  display: inline-block;
  width: 80%;
  max-width: 90px;
  margin: 0 auto 6px;
  line-height: 0;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .photo-link {
  display: block;
  line-height: 0;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay img {
  width: 100%;
  display: block;
  border-radius: 50%;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite {
  position: absolute;
  top: -6px;
  right: -8px;
  background: #fff;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s ease;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite {
    width: 20px;
    height: 20px;
    top: -3px;
    right: -4px;
  }
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite .heart-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #6b8aa8;
  stroke-width: 1.6;
  stroke-linejoin: round;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite .heart-icon {
    width: 12px;
    height: 12px;
  }
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite:hover {
  transform: scale(1.08);
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite:hover .heart-icon {
  stroke: #ff5a86;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite.is-active .heart-icon {
  fill: #ff5a86;
  stroke: #ff5a86;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .photo-overlay .favorite-loading {
  width: 16px;
  height: 16px;
  display: block;
}
.reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .tname {
  display: inline-block;
  color: #1a3a72;
  font-weight: bold;
  font-size: 13px;
  text-decoration: none;
  margin-top: 2px;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .tname {
    font-size: 12px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable thead th.tutor-cell .tname {
    font-size: 11px;
  }
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable thead th {
    font-size: 12px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable thead th {
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable thead th:last-child {
  border-right: none;
}
.reserve-timetable__contents .timetable .table_timetable thead th img {
  width: 100%;
}
.reserve-timetable__contents .timetable .table_timetable thead tr:nth-child(2) > th {
  padding: 5px 0;
  font-size: 14px;
  font-weight: bold;
}
.reserve-timetable__contents .timetable .table_timetable tbody {
  /* Stage D 修正(97): 透明な青ガラス風のストライプ */
}
.reserve-timetable__contents .timetable .table_timetable tbody tr:nth-of-type(odd) {
  background: rgba(161, 196, 253, 0.08);
}
.reserve-timetable__contents .timetable .table_timetable tbody tr:nth-of-type(even) {
  background: #fff;
}
.reserve-timetable__contents .timetable .table_timetable tbody td {
  width: 15.3333%;
  padding: 3px;
  border-right: #e0e0e0 solid 1px;
  vertical-align: middle;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td {
    padding: 2px;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a, .reserve-timetable__contents .timetable .table_timetable tbody td span {
    white-space: nowrap;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td:last-child {
  border-right: none;
}
.reserve-timetable__contents .timetable .table_timetable tbody td span.close {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #505050;
  border-radius: 3px;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.close {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.close {
    width: auto;
    height: 26px;
    line-height: 26px;
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td span.now {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #f57db4;
  border-radius: 3px;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.now {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.now {
    width: auto;
    height: 26px;
    line-height: 1.2;
    font-size: 10px;
    padding-top: 2px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td span.reserved {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #cccccc;
  border-radius: 3px;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.reserved {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td span.reserved {
    width: auto;
    height: 26px;
    line-height: 1.2;
    font-size: 10px;
    padding-top: 2px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.booking {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #f7bb67;
  border-radius: 3px;
  box-shadow: 0 1px 2px rgba(180, 120, 0, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.booking:hover {
  animation: booking-shake 0.4s ease;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.booking {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.booking {
    height: 26px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td {
  /* Stage D 修正(200): キャンセルボタンの色定義
   *   .cancel に CSS が無く真っ白で出ていたため、
   *   .booking と同サイズで青系グラデーションに統一。
   *   .now (レッスン中, このページではピンク) と区別され、
   *   既存ボタン (booking 124×34 同等) のサイズを継承。 */
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.cancel {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  border-radius: 3px;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  transition: filter 0.15s ease;
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.cancel:hover {
  filter: brightness(0.92);
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.cancel {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.cancel {
    height: 26px;
    padding-top: 2px;
    line-height: 1.2;
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td {
  /* 講師ビュー: 現在クローズ (slot-closed) → クリックでオープン
     白bg + グレー枠 + ダークグレー文字 (控えめな "閉" 状態)
     ラベル表記は "クローズ" (現在の状態を示す)
     ※ tutor-timetable と同じデザイン */
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 30px;
  color: #555;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: #fff;
  border: 2px solid #c8c8c8;
  border-radius: 3px;
  box-sizing: border-box;
  transition: background 0.15s ease, color 0.15s ease;
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.slot-closed:hover {
  background: #f5f5f5;
  color: #333;
  border-color: #999;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.slot-closed {
    height: 26.4px;
    line-height: 22.4px;
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody td {
  /* 講師ビュー: 現在オープン (slot-opened) → クリックでクローズ
     オレンジ系で「受付中」を強調 (現行版踏襲)
     ラベル表記は "オープン" (現在の状態を示す) */
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
  display: block;
  width: 100%;
  height: 34px;
  line-height: 34px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  background: #f99a40;
  border-radius: 3px;
  transition: background 0.15s ease;
}
.reserve-timetable__contents .timetable .table_timetable tbody td a.slot-opened:hover {
  background: #e8862a;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
    width: auto;
    padding: 0 5px;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody td a.slot-opened {
    height: 26.4px;
    line-height: 26px;
    font-size: 10px;
  }
}
.reserve-timetable__contents .timetable .table_timetable tbody tr > td:nth-child(1) {
  width: 8%;
  color: var(--site_blue);
  font-size: 14px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .reserve-timetable__contents .timetable .table_timetable tbody tr > td:nth-child(1) {
    width: auto;
    font-size: 10px;
  }
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable .fixed {
    position: sticky;
    left: 0;
    z-index: 1;
  }
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__contents .timetable .table_timetable .fixed:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-right: 1px solid #e0e0e0;
  }
}
.reserve-timetable__contents .timetable .table_timetable .fixed {
  /* Stage D 修正(99): 縞模様の青を講師一覧と同系の透明青に */
}
.reserve-timetable__contents .timetable .table_timetable .fixed.w {
  background: #fff;
}
.reserve-timetable__contents .timetable .table_timetable .fixed.b {
  background: rgba(161, 196, 253, 0.12);
}
.reserve-timetable__contents .timetable .table_timetable .fixed.head {
  /* Stage D 修正(101): rowspan="2" の空セルも薄い水色に */
  background: rgba(135, 215, 240, 0.18);
}
.reserve-timetable__contents .toggle {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 16px;
}
.reserve-timetable__contents .toggle-input {
  display: none;
}
.reserve-timetable__contents .toggle-slider {
  position: absolute;
  cursor: pointer;
  background-color: #ccc;
  border-radius: 24px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.3s;
}
.reserve-timetable__contents .toggle-slider::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  left: 2px;
  top: 2px;
  background: white;
  border-radius: 50%;
  transition: 0.3s;
}
.reserve-timetable__contents {
  /* ON の状態 */
}
.reserve-timetable__contents .toggle-input:checked + .toggle-slider {
  background-color: #0078d7;
}
.reserve-timetable__contents .toggle-input:checked + .toggle-slider::before {
  transform: translateX(17px);
}
.reserve-timetable__caution {
  width: 100%;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .reserve-timetable__caution {
    width: 100%;
    padding-top: 0;
  }
}
@media screen and (max-width: 768px) {
  .reserve-timetable__caution {
    padding: 0;
  }
}
.reserve-timetable__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
.reserve-timetable__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.reserve-timetable__caution ul li {
  padding-left: 20px;
  position: relative;
}
.reserve-timetable__caution ul li::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
.reserve-timetable__caution ul li a {
  color: #3fa9f5;
  font-weight: bold;
  text-decoration: underline;
}
.reserve-timetable .pagination {
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .reserve-timetable .pagination {
    margin-bottom: 30px;
  }
}
.reserve-timetable .pagination .page-btn {
  display: block;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  color: #fff;
  background: #505050;
  cursor: pointer;
  position: relative;
}
.reserve-timetable .pagination .page-btn:hover {
  background: #ccc;
}
.reserve-timetable .pagination .page-btn.current {
  background: #f57db4;
}
.reserve-timetable .pagination .page-btn.prev::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 12px;
  height: 14px;
  background: url(../../img/v2/reserveTutorsLesson/icon_nav-prev.png) no-repeat;
  background-size: contain;
}
.reserve-timetable .pagination .page-btn.next::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 12px;
  height: 14px;
  background: url(../../img/v2/reserveTutorsLesson/icon_nav-next.png) no-repeat;
  background-size: contain;
}
.reserve-timetable .pagination .page-ellipsis {
  padding: 0 6px;
  color: #888;
}

.favorite_tutors {
  background: #f7faff;
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .favorite_tutors {
    padding-bottom: 60px;
  }
}

.page-head__title.page-favorite {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-favorite {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.favorite_tutor-list {
  padding-top: 30px;
  background: #fff;
  margin-bottom: 30px;
}
.favorite_tutor-list .c-heading2.favorite_tutor-list__head::before {
  width: 61px;
  height: 48px;
  background: url(../../img/v2/common/icon_favorite_tutors.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .favorite_tutor-list .c-heading2.favorite_tutor-list__head::before {
    width: 40.6px;
    height: 32px;
  }
}
.favorite_tutor-list__lead {
  margin: 1.5em auto 2em;
  /* Stage D 修正(184): PC でも左寄せに変更 */
  text-align: left;
  font-weight: bold;
  width: 90%;
}
@media screen and (max-width: 768px) {
  .favorite_tutor-list__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.favorite_tutor-list__caution {
  padding-top: 20px;
  width: 790px;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .favorite_tutor-list__caution {
    width: 100%;
  }
}
.favorite_tutor-list__caution p {
  color: var(--site_blue);
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  padding-left: 22px;
  border-top: #e2e2e2 solid 1px;
  border-bottom: #e2e2e2 solid 1px;
  position: relative;
  margin-bottom: 10px;
}
.favorite_tutor-list__caution p::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 18px;
  height: 17px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
.favorite_tutor-list__contents {
  margin-top: 30px;
}
.favorite_tutor-list__contents .c-btn-01 {
  margin-top: 60px;
}
@media screen and (max-width: 768px) {
  .favorite_tutor-list__contents .c-btn-01 {
    margin-top: 30px;
  }
}

/* Stage D 修正(87): main.favorite_tutors でスコープして lesson_tutors への漏れを防止
 * Stage D 修正(140): 講師一覧 (main.lesson_tutors) と同じ Glassmorphism カードに統一
 *   - 写真を photo-wrap で丸く
 *   - .col に半透明青背景 + ブラーで現代的なカード
 *   - 予約ボタンは半透明ホワイトのピル形状
 *   - 登録解除ボタンは淡いグレーで控えめに
 */
main.favorite_tutors .tutor-box {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}
@media screen and (max-width: 768px) {
  main.favorite_tutors .tutor-box {
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
  }
}
@media screen and (max-width: 500px) {
  main.favorite_tutors .tutor-box {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 374px) {
  main.favorite_tutors .tutor-box {
    grid-template-columns: repeat(2, 1fr);
  }
}
main.favorite_tutors .tutor-box .col {
  position: relative;
  background: rgba(161, 196, 253, 0.08);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid #9cc0f0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(31, 38, 135, 0.08);
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
  display: flex;
  flex-direction: column;
  padding: 10px 8px 10px;
}
main.favorite_tutors .tutor-box .col:hover {
  transform: translateY(-3px);
  border-color: #5a9be8;
  box-shadow: 0 8px 20px rgba(31, 38, 135, 0.15);
}
main.favorite_tutors .tutor-box .col {
  /* 写真 - 丸くクロップ + 右上にハート (修正 141) */
}
main.favorite_tutors .tutor-box .col figure {
  margin: 0 auto 8px;
  text-align: center;
}
main.favorite_tutors .tutor-box .col figure .photo-wrap {
  position: relative; /* ハートの absolute 配置基準 */
  display: inline-block;
  width: 88px;
  height: 88px;
  line-height: 0;
}
@media screen and (max-width: 500px) {
  main.favorite_tutors .tutor-box .col figure .photo-wrap {
    width: 72px;
    height: 72px;
  }
}
main.favorite_tutors .tutor-box .col figure .photo-wrap a {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  background: #f5fbff;
  border: 2px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 2px 6px rgba(31, 38, 135, 0.12);
}
main.favorite_tutors .tutor-box .col figure .photo-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
main.favorite_tutors .tutor-box .col figure .photo-wrap {
  /* Stage D 修正(141): ハート型お気に入りボタン (講師一覧と同仕様) */
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite {
  position: absolute;
  top: -6px;
  right: -8px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: #fff;
  border: none;
  border-radius: 50%;
  padding: 0;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s ease;
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite .heart-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #6b8aa8;
  stroke-width: 1.6;
  stroke-linejoin: round;
  transition: fill 0.2s, stroke 0.2s, transform 0.2s;
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite:hover {
  transform: scale(1.08);
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite:hover .heart-icon {
  stroke: #ff5a86;
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite {
  /* お気に入りページに表示される講師はすべて登録済 → 常時赤ハート */
}
main.favorite_tutors .tutor-box .col figure .photo-wrap .favorite.is-active .heart-icon {
  fill: #ff5a86;
  stroke: #ff5a86;
}
main.favorite_tutors .tutor-box .col {
  /* 講師名 - 透過背景の上に色文字 */
}
main.favorite_tutors .tutor-box .col h3 {
  background: transparent;
  color: #1a3a72;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
  padding: 0 4px;
  margin: 0 0 8px;
  min-height: 2.2em;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  main.favorite_tutors .tutor-box .col h3 {
    font-size: 13px;
  }
}
@media screen and (max-width: 500px) {
  main.favorite_tutors .tutor-box .col h3 {
    font-size: 12px;
  }
}
main.favorite_tutors .tutor-box .col {
  /* ボタン群 - 縦並びでコンパクトに */
}
main.favorite_tutors .tutor-box .col .btn {
  margin-top: auto;
  padding: 0 4px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
main.favorite_tutors .tutor-box .col .btn a {
  display: block;
  padding: 7px 0;
  font-size: 11px;
  text-align: center;
  line-height: 1.2;
  border-radius: 20px;
  text-decoration: none;
  font-weight: 700;
  transition: background 0.15s, color 0.15s, transform 0.12s;
}
main.favorite_tutors .tutor-box .col .btn a.booking {
  background: rgba(255, 255, 255, 0.85);
  color: var(--site_blue);
  border: 1px solid #9cc0f0;
}
main.favorite_tutors .tutor-box .col .btn a.booking:hover {
  background: var(--site_blue);
  color: #fff;
  transform: translateY(-1px);
}
@media screen and (max-width: 500px) {
  main.favorite_tutors .tutor-box .col .btn a {
    font-size: 10px;
    padding: 5px 0;
  }
}

main.lesson_history {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  main.lesson_history {
    padding-bottom: 60px;
  }
}
main.lesson_history .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  main.lesson_history .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  main.lesson_history .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}

.page-head__title.page-lesson_history {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-lesson_history {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.history-search {
  margin-bottom: 30px;
}
.history-search .c-heading2.history-search__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .history-search .c-heading2.history-search__head {
    margin-bottom: 20px;
  }
}
.history-search .c-heading2.history-search__head::before {
  width: 46px;
  height: 43px;
  background: url(../../img/v2/common/icon_history-search.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .history-search .c-heading2.history-search__head::before {
    width: 32.2px;
    height: 30.1px;
  }
}
.history-search__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
  width: 90%;
}
@media screen and (max-width: 768px) {
  .history-search__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
  }
}
.history-search__contents {
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  border-radius: 7px;
  padding: 1em 30px 1.5em;
}
@media screen and (max-width: 768px) {
  .history-search__contents {
    width: 100%;
    padding-left: 3%;
    padding-right: 3%;
  }
}
.history-search__contents .search-box {
  width: 90%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .history-search__contents .search-box {
    width: 100%;
  }
}
.history-search__contents .search-box .row {
  width: 100%;
  height: 62px;
  display: flex;
  justify-content: flex-start;
  margin-bottom: 15px;
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .history-search__contents .search-box .row {
    height: auto;
    flex-direction: column;
    justify-content: center;
  }
}
.history-search__contents .search-box .row .title {
  width: 160px;
  height: 100%;
  color: #fff;
  background: var(--site_blue);
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .history-search__contents .search-box .row .title {
    width: 100%;
    padding: 10px;
  }
}
.history-search__contents .search-box .row .date {
  width: calc(100% - 160px);
  background: #e8f1ff;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  display: flex;
  align-items: center;
  padding: 0 15px;
}
@media screen and (max-width: 768px) {
  .history-search__contents .search-box .row .date {
    width: 100%;
    padding: 10px;
    justify-content: center;
  }
}
@media screen and (max-width: 450px) {
  .history-search__contents .search-box .row .date {
    flex-direction: column;
  }
}
.history-search__contents .search-box .row .date .col {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 450px) {
  .history-search__contents .search-box .row .date .col + .col {
    margin-top: 10px;
  }
}
.history-search__contents .search-box .row .date span {
  display: block;
  margin: 0 10px;
}
.history-search__contents .search-box .row .date input[type=date] {
  padding: 5px;
  border: #cccccc solid 1px;
  border-radius: 5px;
}
.history-search__contents .search-box .btn-box .search-button {
  padding: 5px 15px;
  background-color: var(--site_blue);
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.history-search__contents .list-dot-blue li + li {
  margin-top: 0.5em;
}
.history-search__contents .list-dot-blue li a {
  color: #3fa9f5;
  text-decoration: underline;
}

/* Stage D 修正(213): 重複していた .users_reserve ブロック
   (旧 222-760 行) を削除。canonical な定義は _users_mypage.scss にある。
   このファイルは .history-search と .users_archive のみを担当する。 */
.users_archive {
  margin-bottom: 30px;
}
.users_archive .c-heading2.users_archive__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .users_archive .c-heading2.users_archive__head {
    margin-bottom: 20px;
  }
}
.users_archive .c-heading2.users_archive__head::before {
  width: 42px;
  height: 43px;
  background: url(../../img/v2/common/icon_calendar.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .users_archive .c-heading2.users_archive__head::before {
    width: 29px;
    height: 30px;
  }
}
.users_archive__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .users_archive__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .users_archive__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.users_archive {
  /* Stage D 修正(211): 検索結果ヘッダー (件数/Excel) を 2 列構成に整理 */
}
.users_archive__head-info {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px 24px;
  margin-bottom: 16px;
  background: #f3f8ff;
  border: 1px solid #d6e6f7;
  border-radius: 8px;
}
@media screen and (max-width: 768px) {
  .users_archive__head-info {
    padding: 14px 16px;
    flex-direction: column;
    align-items: flex-start;
  }
}
.users_archive__head-info-stats {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.users_archive__head-info-stats .lesson_history_result_total_hit {
  font-size: 18px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  margin: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__head-info-stats .lesson_history_result_total_hit {
    font-size: 16px;
  }
}
.users_archive__head-info-stats .lesson_history_result_current {
  font-size: 13px;
  color: #555;
  margin: 0;
}
.users_archive__head-info-actions {
  display: flex;
  align-items: center;
}
.users_archive {
  /* Stage D 修正(211): Excel ダウンロードボタン (アイコン付き) */
}
.users_archive .c-btn-excel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: linear-gradient(180deg, #1f9d55 0%, #157a3f 100%);
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  transition: filter 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
  cursor: pointer;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_archive .c-btn-excel {
    font-size: 13px;
    padding: 9px 14px;
  }
}
.users_archive .c-btn-excel:hover {
  filter: brightness(1.08);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22);
  text-decoration: none;
  color: #fff;
}
.users_archive .c-btn-excel:active {
  filter: brightness(0.92);
  transform: translateY(1px);
}
.users_archive .c-btn-excel:focus-visible {
  outline: 2px solid #66b3ff;
  outline-offset: 2px;
}
.users_archive .c-btn-excel__icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url(../../img/v2/common/icon_download_white.svg) no-repeat center;
  background-size: contain;
}
.users_archive .c-btn-excel__label small {
  font-size: 11px;
  font-weight: normal;
  opacity: 0.85;
  margin-left: 2px;
}
.users_archive {
  /* Stage D 修正(211): モダンなページネーション (page-btn 角丸ボタン) */
}
.users_archive .c-paginator {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 16px 0;
}
@media screen and (max-width: 768px) {
  .users_archive .c-paginator {
    justify-content: center;
    flex-direction: column-reverse;
    gap: 8px;
  }
}
.users_archive .c-paginator__info {
  font-size: 13px;
  color: #666;
}
.users_archive .c-paginator__buttons {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
.users_archive .c-paginator__buttons .page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 32px;
  padding: 0 10px;
  font-size: 13px;
  font-weight: bold;
  color: #444;
  background: #fff;
  border: 1px solid #d6e0ec;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.users_archive .c-paginator__buttons .page-btn a {
  color: inherit;
  text-decoration: none;
  display: block;
  padding: 0 2px;
}
.users_archive .c-paginator__buttons .page-btn:hover {
  background: #e8f1ff;
  border-color: #aacbf0;
  color: var(--site_blue, #0078d7);
}
.users_archive .c-paginator__buttons .page-btn.current {
  background: var(--site_blue, #0078d7);
  border-color: var(--site_blue, #0078d7);
  color: #fff;
  cursor: default;
}
.users_archive .c-paginator__buttons .page-btn.disabled {
  color: #b8b8b8;
  background: #f5f5f5;
  border-color: #e5e5e5;
  cursor: not-allowed;
}
.users_archive .c-paginator__buttons .page-btn.disabled:hover {
  background: #f5f5f5;
  border-color: #e5e5e5;
  color: #b8b8b8;
}
.users_archive__contents {
  width: 100%;
  padding: 0;
}
@media screen and (max-width: 1024px) {
  .users_archive__contents {
    padding: 0;
  }
}
.users_archive {
  /* Stage D 修正(211): カード型のレッスン履歴行
   *   旧: ベタ塗りグレー #555 の 62px バー (テキストが読みづらく単調)
   *   新: 白カード + 左 4px 青アクセント + 日付バッジ + 講師バッジ */
}
.users_archive__lesson {
  font-size: 15px;
  line-height: 1.5;
  background: transparent;
  margin-bottom: 12px;
}
.users_archive__lesson .lesson-record {
  width: 100%;
  background: #fff;
  border: 1px solid #e3eaf3;
  border-left: 4px solid var(--site_blue, #0078d7);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  color: #333;
  font-weight: normal;
  position: relative;
  padding: 14px 20px 14px 16px;
  gap: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
  height: auto;
}
.users_archive__lesson .lesson-record:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transform: translateY(-1px);
  border-color: #c8d6e8;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record {
    padding: 12px 14px 12px 12px;
    gap: 12px;
  }
}
.users_archive__lesson .lesson-record__col {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  flex: 1 1 auto;
  min-width: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col {
    gap: 10px;
  }
}
.users_archive__lesson .lesson-record__col {
  /* 日付バッジ (年 / 月日 / 曜日) */
}
.users_archive__lesson .lesson-record__col .lesson-record__date-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 70px;
  padding: 6px 4px;
  background: linear-gradient(180deg, #f3f8ff 0%, #e8f1ff 100%);
  border: 1px solid #cfdef0;
  border-radius: 6px;
  line-height: 1.1;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col .lesson-record__date-badge {
    width: 58px;
    padding: 5px 2px;
  }
}
.users_archive__lesson .lesson-record__col .lesson-record__date-badge .year {
  font-size: 11px;
  color: #777;
  font-weight: normal;
}
.users_archive__lesson .lesson-record__col .lesson-record__date-badge .mmdd {
  font-size: 18px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  margin-top: 1px;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col .lesson-record__date-badge .mmdd {
    font-size: 16px;
  }
}
.users_archive__lesson .lesson-record__col .lesson-record__date-badge .weekday {
  font-size: 11px;
  color: #fff;
  background: var(--site_blue, #0078d7);
  padding: 1px 6px;
  border-radius: 999px;
  margin-top: 3px;
  font-weight: bold;
}
.users_archive__lesson .lesson-record__col {
  /* 旧 .date: フル日付 + 時間。タブレット幅では別行に */
}
.users_archive__lesson .lesson-record__col .date {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.3;
  min-width: 0;
}
.users_archive__lesson .lesson-record__col .date .day {
  font-size: 15px;
  font-weight: bold;
  color: #333;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__col .date .day {
    font-size: 13px;
    white-space: normal;
  }
}
.users_archive__lesson .lesson-record__col .date .time {
  font-size: 13px;
  color: #666;
  margin-top: 3px;
  white-space: nowrap;
}
.users_archive__lesson .lesson-record__col .date .time::before {
  content: "⏱";
  margin-right: 4px;
  opacity: 0.7;
}
.users_archive__lesson .lesson-record__col .date span + span {
  margin-left: 0;
}
.users_archive__lesson .lesson-record__nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__nav {
    padding-right: 0;
  }
}
.users_archive__lesson .lesson-record__nav {
  /* 講師名バッジ (青いピル型) */
}
.users_archive__lesson .lesson-record__nav .tutor-name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 14px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  background: #e8f1ff;
  border-radius: 999px;
  margin: 0;
  white-space: nowrap;
}
@media screen and (max-width: 768px) {
  .users_archive__lesson .lesson-record__nav .tutor-name {
    font-size: 12px;
    padding: 5px 10px;
  }
}
.users_archive__lesson .lesson-record__nav .tutor-name__suffix {
  font-size: 11px;
  font-weight: normal;
  color: #666;
  background: #fff;
  padding: 1px 6px;
  border-radius: 999px;
  border: 1px solid #cfdef0;
}
.users_archive__lesson .lesson-record__nav .js-evaluation {
  display: inline-block;
  padding: 5px 10px;
  color: #fff;
  font-size: 14px;
  background: #f7bb67;
  border-radius: 5px;
  margin-right: 1em;
  outline: none;
  border: none;
  cursor: pointer;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-record__nav .js-evaluation {
    font-size: 13px;
    margin-right: 0;
    margin-bottom: 10px;
  }
}
.users_archive__lesson .lesson-record__nav .js-evaluation.is-complete {
  background: #888888;
}
.users_archive__lesson .lesson-record .js-ac-trigger {
  display: block;
  width: 22px;
  height: 22px;
  background: url(../../img/v2/users_mypage/icon_open.svg) no-repeat;
  background-size: contain;
  cursor: pointer;
  outline: none;
  border: none;
}
.users_archive__lesson .lesson-record .js-ac-trigger.is-open {
  background: url(../../img/v2/users_mypage/icon_close.svg) no-repeat;
  background-size: contain;
}
.users_archive__lesson .lesson-details .block {
  border-top: #999999 solid 1px;
  padding: 0.8em 1em;
  display: flex;
  justify-content: flex-start;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-details .block {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
  }
}
.users_archive__lesson .lesson-details .block .block-title {
  width: 250px;
  font-weight: bold;
}
@media screen and (max-width: 500px) {
  .users_archive__lesson .lesson-details .block .block-title {
    width: auto;
  }
}
.users_archive {
  /* Stage D 修正(211): 結果なしメッセージ */
}
.users_archive__empty {
  text-align: center;
  padding: 40px 20px;
  background: #fafbfc;
  border: 1px dashed #d6e0ec;
  border-radius: 8px;
  color: #777;
  font-size: 14px;
}

.userManual {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .userManual {
    padding-bottom: 60px;
  }
}
.userManual .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .userManual .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .userManual .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}

.page-head__title.page-userManual {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-userManual {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.user_manual {
  margin-bottom: 30px;
}
.user_manual .c-heading2.user_manual__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .user_manual .c-heading2.user_manual__head {
    margin-bottom: 20px;
  }
}
.user_manual .c-heading2.user_manual__head::before {
  width: 54px;
  height: 34px;
  background: url(../../img/v2/common/icon_userManual.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .user_manual .c-heading2.user_manual__head::before {
    width: 37.8px;
    height: 23.8px;
  }
}
.user_manual__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .user_manual__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .user_manual__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.user_manual__image {
  width: 90%;
  margin: 0 auto 50px;
}
.user_manual__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .user_manual__contents {
    padding: 0;
  }
}
.user_manual__contents .content h3 {
  color: var(--site_blue);
  font-size: 26px;
  font-weight: bold;
  line-height: 2;
  text-align: center;
  margin-bottom: 20px;
}
.user_manual__contents .content ul.list-numbered {
  list-style: none;
  /* デフォルトの・を消す */
  counter-reset: item;
  /* カウンタをリセット */
  padding-left: 0;
  border-top: #e1e1e1 solid 1px;
}
.user_manual__contents .content ul.list-numbered li {
  counter-increment: item;
  position: relative;
  padding: 1em 1em 1em 2em;
  border-bottom: #e1e1e1 solid 1px;
}
.user_manual__contents .content ul.list-numbered li::before {
  content: counter(item) ". ";
  /* 1. 2. 3. のように表示 */
  position: absolute;
  left: 0;
}
.user_manual__contents .content ul.list-numbered li a {
  color: #3fa9f5;
  font-weight: bold;
  text-decoration: underline;
}
.user_manual__contents .content .pl2em {
  padding-left: 2em;
}
.user_manual__contents .content + .content {
  margin-top: 50px;
}
@media screen and (max-width: 768px) {
  .user_manual__contents .content + .content {
    margin-top: 30px;
  }
}
.user_manual__contents .bnr-contact {
  margin-top: 50px;
}

.precaution_statement {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .precaution_statement {
    padding-bottom: 60px;
  }
}
.precaution_statement .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .precaution_statement .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .precaution_statement .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}

.page-head__title.page-precaution_statement {
  background: url(../../img/v2/users_mypage/page-title_bg.png) left center no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-precaution_statement {
    background-position: center top;
  }
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.precaution {
  margin-bottom: 30px;
}
.precaution .c-heading2.precaution__head {
  line-height: 1.3;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .precaution .c-heading2.precaution__head {
    margin-bottom: 20px;
  }
}
.precaution .c-heading2.precaution__head::before {
  width: 54px;
  height: 34px;
  background: url(../../img/v2/common/icon_caution.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .precaution .c-heading2.precaution__head::before {
    width: 37.8px;
    height: 23.8px;
  }
}
.precaution__lead {
  margin: 1.5em auto 2em;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .precaution__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .precaution__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 40px;
  }
}
.precaution__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .precaution__contents {
    padding: 0;
  }
}
.precaution__contents .row_01 {
  margin: 2em 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
@media screen and (max-width: 768px) {
  .precaution__contents .row_01 {
    grid-template-columns: 100%;
  }
}
.precaution__contents .row_01 .col {
  border: #e0e0e0 solid 1px;
  padding: 20px;
}
.precaution__contents .row_01 .col h3 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  padding-left: 1.8em;
  margin-bottom: 0.5em;
  position: relative;
}
.precaution__contents .row_01 .col h3::before {
  position: absolute;
  top: 0.2em;
  left: 0;
  content: "";
  width: 18px;
  height: 18px;
  background: url(../../img/v2/precaution_statement/icon_caution_01.svg) no-repeat;
  background-size: contain;
}
.precaution__contents .row_02 {
  margin: 2em 0 0;
}
.precaution__contents .row_02 .col {
  border: #e0e0e0 solid 1px;
  padding: 20px;
}
.precaution__contents .row_02 .col h3 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  padding-left: 1.8em;
  margin-bottom: 0.5em;
  position: relative;
}
.precaution__contents .row_02 .col h3::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 18px;
  height: 18px;
  background: url(../../img/v2/precaution_statement/icon_caution_02.svg) no-repeat;
  background-size: contain;
}
.precaution__contents .row_02 .col .quote {
  display: block;
  padding-left: 1em;
  border-left: #e1e1e1 solid 4px;
  font-weight: bold;
  margin: 1em 0;
}
.precaution__contents .row_02 .col .pl20 {
  display: block;
  line-height: 2;
  padding-left: 20px;
  margin: 0.5em 0;
}
.precaution__contents .row_02 .col + .col {
  margin-top: 25px;
}

.precaution_statement .bnr-contact {
  margin-top: 60px;
}

.page-head__title.page-campaign {
  background: url(../../img/v2/campaign/page-title_bg.png) center center no-repeat;
  background-size: cover;
}
.page-head__title.page-campaign h2 {
  display: none;
}
@media screen and (max-width: 768px) {
  .page-head__title.page-campaign {
    width: 100%;
    aspect-ratio: 1280/400;
  }
}

.friend-campaign,
.discount-campaign,
.hsk-campaign,
.returnees-campaign,
.text-campaign {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .friend-campaign,
  .discount-campaign,
  .hsk-campaign,
  .returnees-campaign,
  .text-campaign {
    padding-bottom: 60px;
  }
}

.campaign-banner {
  max-width: 1000px;
  margin: 30px auto;
  aspect-ratio: 1200/630;
  position: relative;
}
@media screen and (max-width: 768px) {
  .campaign-banner {
    margin-top: 0;
  }
}
.campaign-banner.friend__bnr {
  background: url(../../img/v2/campaign/friend_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-banner.friend__bnr .text_01 {
  position: absolute;
  top: 26px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 80px;
  font-weight: bold;
  white-space: nowrap;
  -webkit-text-stroke-width: 10px;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
}
@media (max-width: 1000px) {
  .campaign-banner.friend__bnr .text_01 {
    top: 2.6vw;
    font-size: 8vw;
  }
}
.campaign-banner.friend__bnr .color_01 {
  color: #009aff;
}
.campaign-banner.friend__bnr .color_02 {
  color: #ff5d83;
}
.campaign-banner.friend__bnr .color_03 {
  color: #22b573;
}
.campaign-banner.friend__bnr .text_02 {
  position: absolute;
  top: 210px;
  left: 135px;
  color: #000000;
  font-size: 45px;
  line-height: 1.2;
  transform: rotate(-10deg);
}
@media (max-width: 1000px) {
  .campaign-banner.friend__bnr .text_02 {
    top: 21vw;
    left: 13.5vw;
    font-size: 4.5vw;
  }
}
.campaign-banner.friend__bnr .text_03 {
  position: absolute;
  top: 315px;
  left: 155px;
  color: #d92a00;
  font-size: 70px;
  font-weight: bold;
  line-height: 1.2;
  letter-spacing: -0.08em;
  transform: rotate(-10deg);
}
@media (max-width: 1000px) {
  .campaign-banner.friend__bnr .text_03 {
    top: 31.5vw;
    left: 15.5vw;
    font-size: 7vw;
  }
}
.campaign-banner.discount__bnr {
  background: url(../../img/v2/campaign/discount_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-banner.discount__bnr .text_01 {
  text-align: center;
  position: absolute;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 1000px) {
  .campaign-banner.discount__bnr .text_01 {
    top: 8vw;
  }
}
.campaign-banner.discount__bnr .text_01 span {
  display: inline-block;
  color: #000000;
  font-size: 50px;
  font-weight: bold;
  padding: 0 1em;
  white-space: nowrap;
  position: relative;
  z-index: 1;
}
@media (max-width: 1000px) {
  .campaign-banner.discount__bnr .text_01 span {
    font-size: 5vw;
  }
}
.campaign-banner.discount__bnr .text_01 span::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  height: 80%;
  width: 100%;
  background: linear-gradient(to bottom, transparent 50%, #fbe600 51%, #fbe600);
  z-index: -1;
}
.campaign-banner.discount__bnr .text_02 {
  position: absolute;
  top: 204px;
  left: 90px;
  color: #fbdb00;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.2;
}
@media (max-width: 1000px) {
  .campaign-banner.discount__bnr .text_02 {
    top: 20.4vw;
    left: 9vw;
    font-size: 3.6vw;
  }
}
.campaign-banner.discount__bnr .text_03 {
  position: absolute;
  top: 190px;
  left: 50%;
  transform: translateX(-50%);
  color: #0096ff;
  font-size: 130px;
  font-weight: bold;
  -webkit-text-stroke-width: 10px;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
  text-align: center;
  line-height: 0.8;
  white-space: nowrap;
}
@media (max-width: 1000px) {
  .campaign-banner.discount__bnr .text_03 {
    top: 19vw;
    font-size: 13vw;
    -webkit-text-stroke-width: 1vw;
  }
}
.campaign-banner.discount__bnr .text_03 span {
  font-size: 85px;
}
@media (max-width: 1000px) {
  .campaign-banner.discount__bnr .text_03 span {
    font-size: 8.5vw;
  }
}
.campaign-banner.hsk__bnr {
  background: url(../../img/v2/campaign/hsk_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-banner.hsk__bnr .text_01 {
  position: absolute;
  top: 20px;
  left: 20px;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_01 {
    top: 2vw;
    left: 2vw;
  }
}
.campaign-banner.hsk__bnr .text_01 span {
  display: inline-block;
  color: #fff;
  font-size: 34px;
  font-weight: bold;
  padding: 0 0.3em;
  position: relative;
  z-index: 1;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_01 span {
    font-size: 3.4vw;
  }
}
.campaign-banner.hsk__bnr .text_01 span::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  z-index: -1;
}
.campaign-banner.hsk__bnr .text_02 {
  position: absolute;
  top: 145px;
  left: 50%;
  transform: translateX(-50%);
  color: #000;
  font-size: 62px;
  line-height: 1;
  text-align: center;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_02 {
    top: 14.5vw;
    font-size: 6.2vw;
  }
}
.campaign-banner.hsk__bnr .text_02 span {
  font-size: 130px;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_02 span {
    font-size: 13vw;
  }
}
.campaign-banner.hsk__bnr .text_03 {
  position: absolute;
  top: 350px;
  left: 20px;
  color: #fff;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.2;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_03 {
    top: 35vw;
    left: 2vw;
    font-size: 2.8vw;
  }
}
.campaign-banner.hsk__bnr .text_03 span {
  font-size: 56px;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_03 span {
    font-size: 5.6vw;
  }
}
.campaign-banner.hsk__bnr .text_04 {
  position: absolute;
  top: 350px;
  right: 20px;
  color: #fff;
  font-size: 38px;
  font-weight: bold;
  line-height: 1.2;
  text-align: right;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_04 {
    top: 35vw;
    right: 2vw;
    font-size: 3.8vw;
  }
}
.campaign-banner.hsk__bnr .text_04 span {
  font-size: 56px;
}
@media (max-width: 1000px) {
  .campaign-banner.hsk__bnr .text_04 span {
    font-size: 5.6vw;
  }
}
.campaign-banner.returnees__bnr {
  background: url(../../img/v2/campaign/returnees_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-banner.returnees__bnr .text_01 {
  position: absolute;
  top: 170px;
  left: 300px;
  color: #fff;
  font-size: 40px;
  font-weight: bold;
}
@media (max-width: 1000px) {
  .campaign-banner.returnees__bnr .text_01 {
    top: 17vw;
    left: 30vw;
    font-size: 4vw;
  }
}
.campaign-banner.returnees__bnr .text_02 {
  position: absolute;
  top: 230px;
  left: 300px;
  font-size: 100px;
  font-weight: bold;
  display: flex;
}
@media (max-width: 1000px) {
  .campaign-banner.returnees__bnr .text_02 {
    top: 23vw;
    left: 30vw;
    font-size: 10vw;
  }
}
.campaign-banner.returnees__bnr .text_02 span {
  display: block;
  width: 140px;
  height: 140px;
  text-align: center;
  line-height: 150px;
}
@media (max-width: 1000px) {
  .campaign-banner.returnees__bnr .text_02 span {
    width: 14vw;
    height: 14vw;
    text-align: center;
    line-height: 15vw;
  }
}
.campaign-banner.returnees__bnr .text_02 span.color_01 {
  color: #fff;
  background: #7bb100;
}
.campaign-banner.returnees__bnr .text_02 span.color_02 {
  color: #7bb100;
  background: #fff;
}
.campaign-banner.returnees__bnr .text_02 span + span {
  margin-left: 10px;
}
@media (max-width: 1000px) {
  .campaign-banner.returnees__bnr .text_02 span + span {
    margin-left: 1vw;
  }
}
.campaign-banner.returnees__bnr .text_03 {
  position: absolute;
  top: 370px;
  left: 350px;
  color: #fff;
  font-size: 60px;
  font-weight: bold;
}
@media (max-width: 1000px) {
  .campaign-banner.returnees__bnr .text_03 {
    top: 37vw;
    left: 35vw;
    font-size: 6vw;
  }
}
.campaign-banner.text__bnr {
  background: url(../../img/v2/campaign/text_bnr_bg.jpg) no-repeat;
  background-size: cover;
}
.campaign-banner.text__bnr .text_01 {
  position: absolute;
  top: 95px;
  left: 90px;
  color: #fff;
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
}
@media (max-width: 1000px) {
  .campaign-banner.text__bnr .text_01 {
    top: 9.5vw;
    left: 9vw;
    font-size: 4vw;
  }
}
.campaign-banner.text__bnr .text_01 .color_01 {
  color: #ffdd42;
}
.campaign-banner.text__bnr .text_01 .color_02 {
  color: #000;
}
.campaign-banner.text__bnr .text_01 .rotate {
  margin-left: 0.2em;
  display: inline-block;
  transform: rotate(10deg);
}
.campaign-banner.text__bnr .text_02 {
  position: absolute;
  top: 260px;
  left: 50%;
  transform: translateX(-50%);
  color: #0095d1;
  font-size: 80px;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  -webkit-text-stroke-width: 10px;
  -webkit-text-stroke-color: white;
  paint-order: stroke;
}
@media (max-width: 1000px) {
  .campaign-banner.text__bnr .text_02 {
    top: 26vw;
    font-size: 8vw;
  }
}
.campaign-banner.text__bnr .text_02 span {
  font-size: 90px;
}
@media (max-width: 1000px) {
  .campaign-banner.text__bnr .text_02 span {
    font-size: 9vw;
  }
}

.campaign-info {
  margin-bottom: 50px;
}
.campaign-info .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .campaign-info .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .campaign-info .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.campaign-info .c-heading2.campaign-info__head::before {
  width: 51px;
  height: 40px;
  background: url(../../img/v2/campaign/icon_megaphone.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .campaign-info .c-heading2.campaign-info__head::before {
    width: 35.7px;
    height: 28px;
  }
}
.campaign-info__lead {
  width: 860px;
  margin: 1.5em auto 60px;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .campaign-info__lead {
    max-width: 860px;
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .campaign-info__lead {
    max-width: 100%;
    width: 100%;
    text-align: left;
    margin-bottom: 30px;
  }
}
.campaign-info__contents {
  max-width: 860px;
  margin: 0 auto;
}
.campaign-info__contents h3 {
  color: var(--site_blue);
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents h3 {
    font-size: 22px;
  }
}
.campaign-info__contents .content + .content {
  margin-top: 60px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .content + .content {
    margin-top: 40px;
  }
}
.campaign-info__contents .table_campain01 {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  letter-spacing: 0.01em;
}
.campaign-info__contents .table_campain01 th {
  background: #505050;
  padding: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.campaign-info__contents .table_campain01 tr:nth-child(even) {
  background: #f0f0f0;
}
.campaign-info__contents .table_campain01 tr:nth-child(odd) {
  background: #f8f8f8;
}
.campaign-info__contents .table_campain01 td {
  padding: 10px 1em;
  text-align: left;
  vertical-align: middle;
}
.campaign-info__contents .flow .flow-wrap {
  width: 100%;
  border: #cccccc solid 1px;
  border-radius: 10px;
  padding: 20px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .flow .flow-wrap {
    padding: 10px;
  }
}
.campaign-info__contents .flow .flow-list {
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
}
.campaign-info__contents .flow .flow-list li {
  padding-bottom: 0.5em;
  border-bottom: #cccccc dotted 2px;
  margin-top: 1em;
  margin-bottom: 1em;
}
.campaign-info__contents .flow .flow-list li:last-child {
  border-bottom: none;
}
.campaign-info__contents .flow .flow-list li .list-dot-blue li {
  border-bottom: none;
  margin-top: 0;
  margin-bottom: 0;
}
.campaign-info__contents .flow .flow-list li h4 {
  font-size: 16px;
  font-weight: bold;
  line-height: 2;
  margin-bottom: 0.3em;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .flow .flow-list li h4 {
    font-size: 14px;
  }
}
.campaign-info__contents .flow .flow-list li .copy-box {
  padding-bottom: 2em;
  margin: 1em auto 0;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .flow .flow-list li .copy-box {
    padding-bottom: 1em;
  }
}
.campaign-info__contents .flow .flow-list li #copyText {
  font-size: 16px;
  border: #999999 solid 1px;
  border-radius: 5px;
  padding: 10px 20px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .flow .flow-list li #copyText {
    font-size: 14px;
  }
}
.campaign-info__contents .flow .flow-list li #copyBtn {
  display: block;
  width: 90px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  font-size: 16px;
  background: #eeeeee;
  border: #999999 solid 1px;
  border-radius: 5px;
  margin: 0.7em auto 0;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .flow .flow-list li #copyBtn {
    font-size: 14px;
  }
}
.campaign-info__contents .bnr-discount {
  margin: 0 auto 30px;
  text-align: center;
  position: relative;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount {
    margin: 2.604vw auto 30px;
  }
}
.campaign-info__contents .bnr-discount a {
  display: inline-block;
  min-width: 495px;
  background: #f6f6f6;
  border: #e0e0e0 solid 1px;
  padding: 14.5px;
  position: relative;
  margin-top: 80px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount a {
    min-width: auto;
    max-width: 100%;
    padding: 1.888vw;
    margin-top: 10.417vw;
  }
}
.campaign-info__contents .bnr-discount a::before {
  position: absolute;
  bottom: 0;
  right: 0;
  content: "";
  width: 200px;
  height: 149px;
  background: url(../../img/v2/campaign/bnr-discount_bg_02.png) no-repeat;
  background-size: contain;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount a::before {
    width: 32.943vw;
    height: 25.911vw;
  }
}
.campaign-info__contents .bnr-discount a span {
  display: inline-block;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  letter-spacing: 0.05em;
  padding: 0 230px 0 30px;
  height: 55px;
  line-height: 55px;
  background: url(../../img/v2/campaign/bnr-discount_bg_01.png) no-repeat;
  background-size: cover;
  border-radius: 3px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount a span {
    font-size: 3.385vw;
    padding: 0 29.948vw 0 3.906vw;
    height: 7.161vw;
    line-height: 7.161vw;
  }
}
.campaign-info__contents .bnr-discount a span::after {
  position: absolute;
  top: 50%;
  right: 194px;
  transform: translateY(-50%);
  content: "";
  width: 27px;
  height: 27px;
  background: url(../../img/v2/common/icon_circle-arrow.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount a span::after {
    right: 25.26vw;
    width: 3.516vw;
    height: 3.516vw;
  }
}
.campaign-info__contents .bnr-discount .fukidashi {
  display: inline-block;
  position: absolute;
  top: 25px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  padding: 0.3em 1em;
  background: #505050;
  border-radius: 5px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount .fukidashi {
    top: 3.255vw;
    font-size: 2.344vw;
  }
}
.campaign-info__contents .bnr-discount .fukidashi::after {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 0;
  height: 0;
  border-width: 10px 10px 0 10px;
  border-color: #505050 transparent transparent transparent;
  border-style: solid;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .bnr-discount .fukidashi::after {
    bottom: -1.042vw;
    border-width: 1.302vw 1.302vw 0 1.302vw;
  }
}
.campaign-info__contents .apply-text {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: var(--site_pink);
  margin: 30px auto 0;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents .apply-text {
    font-size: 22px;
  }
}
.campaign-info__contents.friend .requirements-steps li {
  width: 100%;
  display: flex;
  align-items: center;
  border: #cccccc solid 1px;
  border-radius: 10px;
  padding: 10px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .requirements-steps li {
    flex-direction: column;
    justify-content: center;
    gap: 10px;
  }
}
.campaign-info__contents.friend .requirements-steps li::after {
  position: absolute;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
  width: 20px;
  height: 10px;
  background: url(../../img/v2/campaign/steps_arrow.svg) no-repeat;
  background-size: contain;
}
.campaign-info__contents.friend .requirements-steps li:last-child::after {
  content: none;
}
.campaign-info__contents.friend .requirements-steps li .image {
  width: 50%;
  text-align: center;
  display: grid;
  place-items: center;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .requirements-steps li .image {
    width: 100%;
  }
}
.campaign-info__contents.friend .requirements-steps li .image span {
  display: block;
  width: 280px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .requirements-steps li .image span {
    max-width: 280px;
    width: 100%;
  }
}
.campaign-info__contents.friend .requirements-steps li p {
  width: 50%;
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .requirements-steps li p {
    width: 100%;
  }
}
.campaign-info__contents.friend .requirements-steps li + li {
  margin-top: 20px;
}
.campaign-info__contents.friend .notes-figure {
  width: 100%;
  border: #cccccc solid 1px;
  border-radius: 10px;
  padding: 20px;
  margin: 30px auto;
  display: grid;
  place-items: center;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .notes-figure {
    padding: 10px;
  }
}
.campaign-info__contents.friend .notes-figure span {
  display: block;
  width: 342px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.friend .notes-figure span {
    max-width: 342px;
    width: 100%;
  }
}
.campaign-info__contents.discount .content.price {
  max-width: 860px;
  width: 100%;
  margin: 0 auto;
  padding: 2em 130px;
  border: #cccccc solid 1px;
  border-radius: 10px;
}
@media (max-width: 860px) {
  .campaign-info__contents.discount .content.price {
    padding: 1em;
  }
}
.campaign-info__contents.discount .content.price .price-title {
  font-size: 18px;
  font-weight: bold;
  line-height: 2;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.discount .content.price .price-title {
    font-size: 16px;
    line-height: 1.4;
  }
}
.campaign-info__contents.discount .content.target .target-list {
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.discount .content.target .target-list li {
    padding-left: 0;
  }
}
.campaign-info__contents.discount .content.target .target-list li::before {
  content: none;
}
.campaign-info__contents.discount .content.target .target-list li span {
  color: #f57db4;
}
.campaign-info__contents.discount .content.flow .add {
  display: block;
  width: fit-content;
  margin: 0 auto;
  text-align: center;
  padding-left: 1.5em;
  position: relative;
}
.campaign-info__contents.discount .content.flow .add::before {
  position: absolute;
  top: 0.25em;
  left: 3px;
  content: "";
  width: 11px;
  height: 11px;
  background: url(../../img/v2/common/icon_circle_pink.svg) no-repeat;
  background-size: contain;
}
.campaign-info__contents.discount .content.other {
  margin-bottom: 50px;
}
.campaign-info__contents.discount .table-wrap {
  margin-bottom: 30px;
}
.campaign-info__contents.discount .table_campain01 th .half-price {
  display: inline-block;
  background: #ffce00;
  padding: 3px 5px;
  border-radius: 3px;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  margin-left: 0.5em;
}
.campaign-info__contents.discount .table_campain01 tr:nth-child(even) td:nth-child(3) {
  font-weight: bold;
  background: rgba(245, 125, 180, 0.2);
}
.campaign-info__contents.discount .table_campain01 tr:nth-child(odd) td:nth-child(3) {
  font-weight: bold;
  background: rgba(245, 125, 180, 0.12);
}
.campaign-info__contents.discount .table_campain01 td {
  text-align: right;
}
.campaign-info__contents.discount .table_campain01 tr > td:nth-child(1) {
  text-align: center;
}
.campaign-info__contents.hsk .schedule .table_campain01 {
  max-width: 500px;
  margin: 0 auto;
}
.campaign-info__contents.hsk .target .row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.hsk .target .row {
    grid-template-columns: 100%;
    grid-template-rows: auto auto;
  }
}
.campaign-info__contents.hsk .target .row h4 {
  font-size: 18px;
  font-weight: bold;
  line-height: 2;
}
.campaign-info__contents.hsk .target .row .list-dot-blue {
  margin-bottom: 0.5em;
}
.campaign-info__contents.hsk .target .row .table_campain01 td {
  text-align: center;
}
.campaign-info__contents.hsk .target .row .table_campain01 tr > td:nth-child(2) {
  font-weight: bold;
}
.campaign-info__contents.hsk .target .row .table_campain01 tr > td:nth-child(2) .strikethrough {
  display: inline-block;
  text-decoration: line-through;
  font-weight: normal;
}
@media screen and (max-width: 450px) {
  .campaign-info__contents.hsk .target .row .table_campain01 tr > td:nth-child(2) .strikethrough {
    display: block;
  }
}
.campaign-info__contents.returnees .plan h4 {
  font-size: 18px;
  font-weight: bold;
  line-height: 2;
  margin-bottom: 10px;
}
.campaign-info__contents.returnees .plan .table_campain01 th span {
  display: block;
  color: #ffce00;
  font-size: 12px;
}
.campaign-info__contents.returnees .plan .table_campain01 th.bg_gray {
  background: #606060 !important;
}
@media screen and (max-width: 450px) {
  .campaign-info__contents.returnees .plan .table_campain01 th {
    white-space: nowrap;
  }
}
.campaign-info__contents.returnees .plan .table_campain01 td {
  text-align: right;
}
@media screen and (max-width: 450px) {
  .campaign-info__contents.returnees .plan .table_campain01 td {
    white-space: nowrap;
  }
}
.campaign-info__contents.returnees .plan .table_campain01 tr td:nth-child(1) {
  text-align: center;
}
.campaign-info__contents.returnees .plan .table_campain01 tr:nth-child(even) td:nth-child(3) {
  font-weight: bold;
  background: rgba(245, 125, 180, 0.2);
}
.campaign-info__contents.returnees .plan .table_campain01 tr:nth-child(even) td:nth-child(4) {
  font-weight: bold;
  background: rgba(122, 201, 67, 0.2);
}
.campaign-info__contents.returnees .plan .table_campain01 tr:nth-child(odd) td:nth-child(3) {
  font-weight: bold;
  background: rgba(245, 125, 180, 0.12);
}
.campaign-info__contents.returnees .plan .table_campain01 tr:nth-child(odd) td:nth-child(4) {
  font-weight: bold;
  background: rgba(122, 201, 67, 0.12);
}
.campaign-info__contents.returnees .target .target-list {
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.returnees .target .target-list li {
    padding-left: 0;
  }
}
.campaign-info__contents.returnees .target .target-list li::before {
  content: none;
}
.campaign-info__contents.returnees .target .target-list li span {
  color: #f57db4;
}
.campaign-info__contents.returnees .flow .bnr-discount.is-50 a span {
  height: 85px;
  padding-top: 12px;
  line-height: 1.2;
  background: url(../../img/v2/campaign/bnr-discount_bg_03.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.returnees .flow .bnr-discount.is-50 a span {
    font-size: 3.385vw;
    padding: 2vw 29.948vw 2vw 3.906vw;
    height: auto;
  }
}
.campaign-info__contents.returnees .flow .bnr-discount.is-30 a span {
  height: 85px;
  padding-top: 12px;
  line-height: 1.2;
  background: url(../../img/v2/campaign/bnr-discount_bg_04.png) no-repeat;
  background-size: cover;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.returnees .flow .bnr-discount.is-30 a span {
    font-size: 3.385vw;
    padding: 2vw 29.948vw 2vw 3.906vw;
    height: auto;
  }
}
.campaign-info__contents.returnees .other {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.returnees .apply-text {
    text-align: left;
  }
}
.campaign-info__contents.text .target .target-list {
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  .campaign-info__contents.text .target .target-list li {
    padding-left: 0;
  }
}
.campaign-info__contents.text .target .target-list li::before {
  content: none;
}
.campaign-info__contents.text .target .target-list li span {
  color: #f57db4;
}
.campaign-info__contents.text .flow .flow-list .image {
  margin: 10px auto 0;
}

.campaign-summary {
  margin-bottom: 30px;
}
.campaign-summary .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .campaign-summary .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .campaign-summary .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}
.campaign-summary .c-heading2.campaign-summary__head {
  margin-bottom: 30px;
}
.campaign-summary .c-heading2.campaign-summary__head::before {
  width: 48px;
  height: 38px;
  background: url(../../img/v2/common/icon_book.png) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .campaign-summary .c-heading2.campaign-summary__head::before {
    width: 33.6px;
    height: 26.6px;
  }
}
.campaign-summary__list {
  width: 860px;
  margin: 0 auto 2em;
}
@media screen and (max-width: 1024px) {
  .campaign-summary__list {
    width: 100%;
  }
}
.campaign-summary__list h3 {
  margin-top: 40px;
  color: var(--site_blue);
  font-size: 26px;
  line-height: 26px;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .campaign-summary__list h3 {
    font-size: 22px;
  }
}
.campaign-summary__contents {
  width: 100%;
  margin: 0 auto;
}
.campaign-summary__contents .title .row {
  display: grid;
  grid-template-columns: 180px 370px 150px 1fr;
  font-size: 14px;
  line-height: 1.2;
  background: #505050;
}
@media screen and (max-width: 1024px) {
  .campaign-summary__contents .title .row {
    grid-template-columns: 1fr 1fr 130px 180px;
  }
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .title .row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
  }
}
.campaign-summary__contents .title .row .col {
  text-align: center;
  color: #fff;
  font-weight: bold;
  padding: 10px;
  border-right: #fff solid 1px;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .title .row .col {
    text-align: left;
    border-right: none;
  }
}
.campaign-summary__contents .title .row .col:nth-child(4) {
  border-right: none;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .title .row .col._01 {
    grid-row: 1/2;
    grid-column: 1/2;
    padding-bottom: 0;
  }
  .campaign-summary__contents .title .row .col._02 {
    grid-row: 2/3;
    grid-column: 1/2;
    padding-bottom: 0;
  }
  .campaign-summary__contents .title .row .col._03 {
    grid-row: 3/4;
    grid-column: 1/2;
  }
  .campaign-summary__contents .title .row .col._04 {
    text-align: right;
    grid-row: 3/4;
    grid-column: 2/3;
  }
}
.campaign-summary__contents .course .row {
  display: grid;
  grid-template-columns: 180px 370px 150px 1fr;
  font-size: 14px;
  line-height: 1.2;
  height: 68px;
}
@media screen and (max-width: 1024px) {
  .campaign-summary__contents .course .row {
    grid-template-columns: 1fr 1fr 130px 180px;
  }
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .course .row {
    grid-template-columns: 1fr 100px;
    grid-template-rows: auto auto auto;
    height: auto;
  }
}
.campaign-summary__contents .course .row:nth-of-type(odd) {
  background: #eaf2fa;
}
.campaign-summary__contents .course .row:nth-of-type(even) {
  background: #fafcff;
}
.campaign-summary__contents .course .row .col._01 {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .course .row .col._01 {
    display: block;
    text-align: left;
    grid-row: 1/2;
    grid-column: 1/3;
    padding-bottom: 0;
  }
}
.campaign-summary__contents .course .row .col._02 {
  padding-left: 15px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 10px;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .course .row .col._02 {
    display: block;
    text-align: left;
    grid-row: 2/3;
    grid-column: 1/3;
  }
}
.campaign-summary__contents .course .row .col._03 {
  display: flex;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .course .row .col._03 {
    grid-row: 3/4;
    grid-column: 1/2;
    padding: 0 0 10px 10px;
  }
}
.campaign-summary__contents .course .row .col._03 .image {
  width: 50px;
  height: 100%;
  overflow: hidden;
}
.campaign-summary__contents .course .row .col._03 .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.campaign-summary__contents .course .row .col._03 a {
  color: var(--site_blue);
  padding: 15px 0 0 15px;
  line-height: 1.5;
  text-decoration: underline;
}
.campaign-summary__contents .course .row .col._04 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
@media screen and (max-width: 768px) {
  .campaign-summary__contents .course .row .col._04 {
    flex-direction: column;
    grid-row: 3/4;
    grid-column: 2/3;
    padding: 10px;
  }
}
.campaign-summary__contents .course .row .col._04 .btn-buy {
  width: 80px;
  height: 30px;
  color: #fff;
  line-height: 30px;
  text-align: center;
  background: var(--site_blue);
  border-radius: 5px;
  border: none;
  outline: none;
  cursor: pointer;
}

.lottery {
  padding-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .lottery {
    padding-bottom: 60px;
  }
}
.lottery .l-page__main .l-section {
  padding: 40px 0 30px;
  width: 100%;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .lottery .l-page__main .l-section .l-section__inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media screen and (max-width: 768px) {
  .lottery .l-page__main .l-section .l-section__inner {
    padding-left: 3%;
    padding-right: 3%;
  }
}
.lottery.no-login .l-section .l-section__inner {
  padding: 30px 20px;
  border: #e0e0e0 solid 1px;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .lottery.no-login .l-section .l-section__inner {
    padding: 3vw 2vw;
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
  }
}
@media screen and (max-width: 768px) {
  .lottery.no-login .l-section .l-section__inner {
    padding: 3.906vw 2.604vw;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
}

.page-head__title.page-lottery {
  background: url(../../img/v2/lottery/page-title_bg.png) center center no-repeat;
  background-size: cover;
}
.page-head__title p {
  max-width: 900px;
}
@media screen and (max-width: 768px) {
  .page-head__title p {
    display: none;
  }
}

.lottery {
  margin-bottom: 30px;
}
.lottery .c-heading2.lottery__head {
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .lottery .c-heading2.lottery__head {
    margin-bottom: 20px;
  }
}
.lottery .c-heading2.lottery__head::before {
  width: 50px;
  height: 50px;
  background: url(../../img/v2/lottery/icon_lottery.svg) no-repeat;
  background-size: contain;
}
@media screen and (max-width: 768px) {
  .lottery .c-heading2.lottery__head::before {
    width: 35px;
    height: 35px;
  }
}
.lottery__lead {
  margin: 1.5em auto 1em;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
}
@media screen and (max-width: 1024px) {
  .lottery__lead {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .lottery__lead {
    font-size: 20px;
  }
}
.lottery__contents {
  width: 100%;
  padding: 0 30px;
}
@media screen and (max-width: 1024px) {
  .lottery__contents {
    padding: 0;
  }
}
.lottery__contents .content h3 {
  color: var(--site_blue);
  font-size: 26px;
  font-weight: bold;
  line-height: 2;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .lottery__contents .content h3 {
    line-height: 1.2;
    font-size: 22px;
  }
}
.lottery__contents .content.draw {
  max-width: 540px;
  width: 100%;
  margin: 0 auto;
}
.lottery__contents .content.draw .text {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
  width: 100%;
  height: 60px;
  line-height: 60px;
  background: #ffe300;
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  .lottery__contents .content.draw .text {
    height: auto;
    line-height: 1.2;
    padding: 0.5em;
    font-size: 20px;
  }
}
.lottery__contents .content.draw .btn_lottery {
  display: block;
  width: 200px;
  height: 60px;
  line-height: 60px;
  color: #ffe300;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  background: #df1a2a;
  border-radius: 30px;
  outline: none;
  border: none;
  margin: 25px auto 0;
  box-shadow: 0px 6px 0px 0px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  transition: 0.3s;
}
.lottery__contents .content.draw .btn_lottery:active {
  box-shadow: none;
  transform: translateY(6px);
}
.lottery__contents .content.result {
  max-width: 600px;
  margin: 0 auto;
  aspect-ratio: 600/240;
  background: url(../../img/v2/lottery/lottery_img_02.jpg) no-repeat;
  background-size: cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
@media (max-width: 640px) {
  .lottery__contents .content.result {
    gap: 1.667vw;
  }
}
.lottery__contents .content.result .text_01 {
  margin-top: 20px;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  -webkit-text-stroke-width: 10px;
  -webkit-text-stroke-color: #f58ddc;
  paint-order: stroke;
}
@media (max-width: 640px) {
  .lottery__contents .content.result .text_01 {
    margin-top: 3.125vw;
    font-size: 3.125vw;
    -webkit-text-stroke-width: 1.563vw;
  }
}
.lottery__contents .content.result .row {
  width: 380px;
  height: 100px;
  background: #fff;
  display: grid;
  place-content: center;
}
@media (max-width: 640px) {
  .lottery__contents .content.result .row {
    width: 63.333vw;
    height: 16.667vw;
  }
}
.lottery__contents .content.result .row .text_02 {
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
  line-height: 1.2;
}
@media (max-width: 640px) {
  .lottery__contents .content.result .row .text_02 {
    font-size: 5.333vw;
  }
}
.lottery__contents .content.result .row .text_03 {
  font-size: 16px;
  text-align: center;
  letter-spacing: 0.01em;
}
@media (max-width: 640px) {
  .lottery__contents .content.result .row .text_03 {
    font-size: 2.667vw;
  }
}
.lottery__contents .content.result .text_04 {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
}
@media (max-width: 640px) {
  .lottery__contents .content.result .text_04 {
    font-size: 4vw;
  }
}
.lottery__contents .content.received .table_received {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  letter-spacing: 0.01em;
}
.lottery__contents .content.received .table_received th {
  background: #505050;
  padding: 10px;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.lottery__contents .content.received .table_received tr:nth-child(odd) {
  background: #f0f0f0;
}
.lottery__contents .content.received .table_received tr:nth-child(even) {
  background: #f8f8f8;
}
.lottery__contents .content.received .table_received td {
  padding: 10px 1em;
  text-align: left;
  vertical-align: middle;
}
.lottery__contents .content.received .table_received tr > td:nth-child(1) {
  text-align: center;
}
.lottery__contents .content + .content {
  margin-top: 50px;
}
@media screen and (max-width: 768px) {
  .lottery__contents .content + .content {
    margin-top: 30px;
  }
}
.lottery.no-login .lottery__contents .content .btn_lottery {
  color: #fff;
  background: #e6e6e6;
}
.lottery.no-login .lottery__contents .content .btn_lottery:active {
  box-shadow: 0px 6px 0px 0px rgba(0, 0, 0, 0.2);
  transform: translateY(0);
}
.lottery.no-login .lottery__contents .content .caution {
  margin-top: 30px;
  color: #de2246;
  font-size: 21px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.01em;
}
@media screen and (max-width: 768px) {
  .lottery.no-login .lottery__contents .content .caution {
    font-size: 19px;
  }
}

.page-head__title.page-login {
  background: var(--site_blue_light, #eaf2fa);
}

.login-form {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .login-form {
    margin-bottom: 40px;
  }
}
.login-form .c-heading2 {
  margin-bottom: 30px;
}
.login-form .c-heading2.login-form__head {
  text-align: center;
}
.login-form__contents {
  width: 480px;
  max-width: 100%;
  margin: 0 auto;
  padding: 40px 30px;
  background: #fff;
  border: #e0e0e0 solid 1px;
  border-radius: 8px;
}
@media screen and (max-width: 768px) {
  .login-form__contents {
    width: 100%;
    padding: 25px 18px;
  }
}
.login-form__row {
  margin-bottom: 18px;
}
.login-form__label {
  display: block;
  font-size: 14px;
  font-weight: bold;
  color: var(--site_blue, #2871b9);
  margin-bottom: 6px;
}
.login-form__input {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border: #c8d3e0 solid 1px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 1.4;
  background: #fff;
  outline: none;
}
.login-form__input:focus {
  border-color: var(--site_blue, #2871b9);
  box-shadow: 0 0 0 2px rgba(40, 113, 185, 0.15);
}
.login-form .btn-box {
  margin-top: 24px;
  text-align: center;
}
.login-form .btn-box .btn-confirm {
  display: inline-block;
  min-width: 200px;
}
.login-form__links {
  margin-top: 24px;
  text-align: center;
  font-size: 14px;
  line-height: 1.8;
}
.login-form__links p + p {
  margin-top: 6px;
}
.login-form__links a {
  color: var(--site_blue, #2871b9);
  text-decoration: underline;
}
.login-form__links a:hover {
  text-decoration: none;
}

/* ===========================================================
 * フリートークテーマ一覧 (initial / intermediate / advanced)
 * 旧 .tbl_freetalk_thema テーブルを v2 デザインで読みやすく整える
 * =========================================================== */
/* Stage D 修正(286): freetalk_theme インデックスページのタイトル帯。
 *   他ページ (login の .page-login 等) と同様、page-head__title に
 *   薄い青の背景帯を付ける。 */
.page-head__title.page-freetalk {
  background: var(--site_blue_light, #eaf2fa);
}

/* インデックスページ (freetalk_theme.ctp) のレベル別バナー
 * Stage D 修正(280): 旧 JPG バナー (.course_item) を、デザイン候補 F4
 *   「白カード + ブランド色の星」の CSS カードに置き換え。
 *   初級=オレンジ / 中級=サイトブルー / 上級=ピンク。 */
.freetalk_theme .ft-levels {
  display: flex;
  gap: 16px;
  max-width: 760px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .freetalk_theme .ft-levels {
    flex-direction: column;
    gap: 12px;
  }
}
.freetalk_theme .ft-level {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 16px;
  background: #fff;
  border: 1px solid #e7ebf0;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  text-decoration: none;
  color: #333;
  transition: transform 0.16s ease, box-shadow 0.16s ease;
}
.freetalk_theme .ft-level:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1);
}
.freetalk_theme .ft-level__name {
  font-size: 19px;
  font-weight: bold;
  line-height: 1.2;
}
.freetalk_theme .ft-level__stars {
  font-size: 17px;
  letter-spacing: 3px;
  line-height: 1;
}
.freetalk_theme .ft-level__desc {
  font-size: 13px;
  line-height: 1.65;
  color: #555;
}
.freetalk_theme .ft-level__go {
  margin-top: auto;
  font-size: 12.5px;
  font-weight: bold;
  letter-spacing: 0.02em;
}
.freetalk_theme .ft-level {
  /* 初級 = オレンジ (#f7bb67 系) */
}
.freetalk_theme .ft-level--primary .ft-level__name {
  color: #c47a1c;
}
.freetalk_theme .ft-level--primary .ft-level__stars {
  color: #f0a23c;
}
.freetalk_theme .ft-level {
  /* 中級 = サイトブルー */
}
.freetalk_theme .ft-level--intermediate .ft-level__name {
  color: #0078d7;
}
.freetalk_theme .ft-level--intermediate .ft-level__stars {
  color: #0078d7;
}
.freetalk_theme .ft-level {
  /* 上級 = ピンク (#f57db4 系) */
}
.freetalk_theme .ft-level--advanced .ft-level__name {
  color: #d6337f;
}
.freetalk_theme .ft-level--advanced .ft-level__stars {
  color: #f06fac;
}

/* 個別ページ (primary / intermediate / advanced) */
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  font-size: 16px;
  line-height: 1.8;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk,
  .freetalk_theme_intermediate .legacy_freetalk,
  .freetalk_theme_advanced .legacy_freetalk {
    font-size: 15px;
  }
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Top banner image */
}
.freetalk_theme_primary .legacy_freetalk > img,
.freetalk_theme_intermediate .legacy_freetalk > img,
.freetalk_theme_advanced .legacy_freetalk > img {
  max-width: 600px;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 24px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Section heading "自己紹介・基本情報" 等 */
}
.freetalk_theme_primary .legacy_freetalk p.font_blue.font_weight600,
.freetalk_theme_primary .legacy_freetalk p.freetalk_info_title,
.freetalk_theme_intermediate .legacy_freetalk p.font_blue.font_weight600,
.freetalk_theme_intermediate .legacy_freetalk p.freetalk_info_title,
.freetalk_theme_advanced .legacy_freetalk p.font_blue.font_weight600,
.freetalk_theme_advanced .legacy_freetalk p.freetalk_info_title {
  display: block;
  color: #fff;
  background: var(--site_blue, #2871b9);
  font-size: 20px;
  font-weight: bold;
  padding: 12px 18px;
  margin: 36px 0 18px;
  border-radius: 4px 4px 0 0;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk p.font_blue.font_weight600,
  .freetalk_theme_primary .legacy_freetalk p.freetalk_info_title,
  .freetalk_theme_intermediate .legacy_freetalk p.font_blue.font_weight600,
  .freetalk_theme_intermediate .legacy_freetalk p.freetalk_info_title,
  .freetalk_theme_advanced .legacy_freetalk p.font_blue.font_weight600,
  .freetalk_theme_advanced .legacy_freetalk p.freetalk_info_title {
    font-size: 17px;
    padding: 10px 14px;
  }
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Lead paragraphs */
}
.freetalk_theme_primary .legacy_freetalk p.pos_top20.pos15,
.freetalk_theme_intermediate .legacy_freetalk p.pos_top20.pos15,
.freetalk_theme_advanced .legacy_freetalk p.pos_top20.pos15 {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk p.pos_top20.pos15,
  .freetalk_theme_intermediate .legacy_freetalk p.pos_top20.pos15,
  .freetalk_theme_advanced .legacy_freetalk p.pos_top20.pos15 {
    font-size: 15px;
  }
}
.freetalk_theme_primary .legacy_freetalk p.pos_top20.pos15 .font_blue,
.freetalk_theme_intermediate .legacy_freetalk p.pos_top20.pos15 .font_blue,
.freetalk_theme_advanced .legacy_freetalk p.pos_top20.pos15 .font_blue {
  color: var(--site_blue, #2871b9);
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Theme list table */
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 32px;
  background: #fff;
  border: #e0e0e0 solid 1px;
  border-radius: 0 0 4px 4px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th {
  background: #eaf2fa;
  color: #0069af;
  font-weight: bold;
  text-align: center;
  padding: 14px 10px;
  border: #d8e3ee solid 1px;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1.4;
  font-size: 16px;
  /* テーマ番号セル */
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]),
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]),
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]) {
  width: 60px;
  background: #f8fbff;
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th {
  /* テーマ一覧の表ヘッダ (colspan 2) */
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th[colspan],
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th[colspan],
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th[colspan] {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.08em;
  padding: 12px;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
  .freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th,
  .freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th {
    padding: 10px 6px;
    font-size: 14px;
  }
  .freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]),
  .freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]),
  .freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema th.freetalk_thema_th:first-child:not([colspan]) {
    width: 44px;
  }
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 {
  padding: 16px 20px;
  border: #e6e6e6 solid 1px;
  line-height: 1.85;
  font-size: 16px;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
  .freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
  .freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 {
    padding: 12px 14px;
    font-size: 15px;
  }
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 {
  /* 日本語と中国語の区切り */
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 br + .font_blue,
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 .font_blue,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 br + .font_blue,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 .font_blue,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 br + .font_blue,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema td.freetalk_thema_td1 .font_blue {
  color: var(--site_blue, #2871b9);
  font-size: 15px;
  margin-top: 4px;
  display: inline-block;
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema {
  /* ストライプ */
}
.freetalk_theme_primary .legacy_freetalk table.tbl_freetalk_thema tr:nth-of-type(odd) td.freetalk_thema_td1,
.freetalk_theme_intermediate .legacy_freetalk table.tbl_freetalk_thema tr:nth-of-type(odd) td.freetalk_thema_td1,
.freetalk_theme_advanced .legacy_freetalk table.tbl_freetalk_thema tr:nth-of-type(odd) td.freetalk_thema_td1 {
  background: #fafcff;
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Stage D 修正(283): イントロ (見出し + 説明文) を視認性重視で刷新。
   *   見出しは下線アクセント + アイコン、説明文は淡青カードに整理し、
   *   重要文 (.ft-intro__highlight) と注記 (.ft-intro__note)、
   *   締めの一文 (.ft-intro__cheer) を視覚的に区別する。 */
}
.freetalk_theme_primary .legacy_freetalk .ft-intro,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro,
.freetalk_theme_advanced .legacy_freetalk .ft-intro {
  margin-bottom: 34px;
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__title,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__title,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__title {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 16px;
  padding: 0 0 12px;
  font-size: 22px;
  font-weight: bold;
  color: #1f2937;
  line-height: 1.4;
  border-bottom: 3px solid var(--site_blue, #2871b9);
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__title,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__title,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__title {
    font-size: 18px;
    gap: 8px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__title-icon,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__title-icon,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__title-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4ca7ec, #0078d7);
  font-size: 17px;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__title-icon,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__title-icon,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__title-icon {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__body,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__body,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__body {
  background: #f3f8ff;
  border: 1px solid #d6e6f7;
  border-radius: 10px;
  padding: 22px 26px;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__body,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__body,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__body {
    padding: 16px 15px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__body p,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__body p,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__body p {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.95;
  color: #374151;
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__body p:last-child,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__body p:last-child,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__body p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__body p,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__body p,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__body p {
    font-size: 14px;
    line-height: 1.9;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro,
.freetalk_theme_advanced .legacy_freetalk .ft-intro {
  /* 導入文: やや大きく太字で目を引く */
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__lead,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__lead,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__lead {
  font-size: 16.5px !important;
  font-weight: bold;
  color: #1f2937 !important;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__lead,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__lead,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__lead {
    font-size: 15px !important;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro,
.freetalk_theme_advanced .legacy_freetalk .ft-intro {
  /* ※ 注記: 白地の小箱で本文と区別 */
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__note,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__note,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__note {
  font-size: 13.5px !important;
  line-height: 1.75 !important;
  color: #5b6470 !important;
  background: #fff;
  border: 1px solid #e3eaf3;
  border-radius: 6px;
  padding: 9px 13px !important;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__note,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__note,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__note {
    font-size: 12.5px !important;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro,
.freetalk_theme_advanced .legacy_freetalk .ft-intro {
  /* 重要文: 白地 + 青の左ボーダー + 太字青でハイライト */
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__highlight,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__highlight,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__highlight {
  background: #fff;
  border: 1px solid #cfe2fb;
  border-left: 5px solid var(--site_blue, #2871b9);
  border-radius: 0 7px 7px 0;
  padding: 13px 17px !important;
  font-size: 15.5px !important;
  font-weight: bold;
  color: var(--site_blue, #2871b9) !important;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__highlight,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__highlight,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__highlight {
    font-size: 14.5px !important;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-intro,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro,
.freetalk_theme_advanced .legacy_freetalk .ft-intro {
  /* 締めの一文: 中央寄せ + ピンクで明るく */
}
.freetalk_theme_primary .legacy_freetalk .ft-intro__cheer,
.freetalk_theme_intermediate .legacy_freetalk .ft-intro__cheer,
.freetalk_theme_advanced .legacy_freetalk .ft-intro__cheer {
  text-align: center;
  font-size: 17px !important;
  font-weight: bold;
  color: var(--site_pink, #f57db4) !important;
  margin-top: 4px !important;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-intro__cheer,
  .freetalk_theme_intermediate .legacy_freetalk .ft-intro__cheer,
  .freetalk_theme_advanced .legacy_freetalk .ft-intro__cheer {
    font-size: 15px !important;
  }
}
.freetalk_theme_primary .legacy_freetalk,
.freetalk_theme_intermediate .legacy_freetalk,
.freetalk_theme_advanced .legacy_freetalk {
  /* Stage D 修正(282): テーマ一覧をアコーディオン (デザイン候補 T3) 化。
   *   カテゴリ見出し = <summary>、テーマ項目 = .ft-acc__item。
   *   <details>/<summary> のネイティブ開閉のため JS 不要。 */
}
.freetalk_theme_primary .legacy_freetalk .ft-acc,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc,
.freetalk_theme_advanced .legacy_freetalk .ft-acc {
  background: #fff;
  border: 1px solid #e3eaf3;
  border-radius: 9px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.freetalk_theme_primary .legacy_freetalk .ft-acc + .ft-acc,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc + .ft-acc,
.freetalk_theme_advanced .legacy_freetalk .ft-acc + .ft-acc {
  margin-top: 12px;
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__head,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__head,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__head {
  list-style: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  font-size: 17px;
  font-weight: bold;
  color: #fff;
  background: var(--site_blue, #2871b9);
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__head::-webkit-details-marker,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__head::-webkit-details-marker,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__head::-webkit-details-marker {
  display: none;
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__head::after,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__head::after,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__head::after {
  content: "＋";
  font-size: 16px;
  font-weight: bold;
  margin-left: 12px;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-acc__head,
  .freetalk_theme_intermediate .legacy_freetalk .ft-acc__head,
  .freetalk_theme_advanced .legacy_freetalk .ft-acc__head {
    font-size: 15px;
    padding: 12px 14px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-acc[open] .ft-acc__head::after,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc[open] .ft-acc__head::after,
.freetalk_theme_advanced .legacy_freetalk .ft-acc[open] .ft-acc__head::after {
  content: "－";
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__item,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__item,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__item {
  padding: 14px 18px;
  border-top: 1px solid #eef2f6;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-acc__item,
  .freetalk_theme_intermediate .legacy_freetalk .ft-acc__item,
  .freetalk_theme_advanced .legacy_freetalk .ft-acc__item {
    padding: 12px 14px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__ja,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__ja,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__ja {
  margin: 0;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.7;
  color: #333;
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__ja b,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__ja b,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__ja b {
  display: inline-block;
  min-width: 1.8em;
  color: var(--site_blue, #2871b9);
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-acc__ja,
  .freetalk_theme_intermediate .legacy_freetalk .ft-acc__ja,
  .freetalk_theme_advanced .legacy_freetalk .ft-acc__ja {
    font-size: 15px;
  }
}
.freetalk_theme_primary .legacy_freetalk .ft-acc__zh,
.freetalk_theme_intermediate .legacy_freetalk .ft-acc__zh,
.freetalk_theme_advanced .legacy_freetalk .ft-acc__zh {
  margin: 5px 0 0;
  padding-left: 1.8em;
  font-size: 15px;
  line-height: 1.7;
  color: var(--site_blue, #2871b9);
}
@media screen and (max-width: 768px) {
  .freetalk_theme_primary .legacy_freetalk .ft-acc__zh,
  .freetalk_theme_intermediate .legacy_freetalk .ft-acc__zh,
  .freetalk_theme_advanced .legacy_freetalk .ft-acc__zh {
    font-size: 14px;
  }
}

/* ===========================================================
 * 教材ダウンロードページ (download_text_for_student) のバナー縮小
 * =========================================================== */
.download_text_for_student .legacy_download_page .course_item {
  max-width: 480px;
  margin: 0 auto 30px;
}
@media screen and (max-width: 768px) {
  .download_text_for_student .legacy_download_page .course_item {
    max-width: 100%;
  }
}
.download_text_for_student .legacy_download_page .course_item .course_message_wrapper {
  text-align: center;
  margin-bottom: 10px;
}
.download_text_for_student .legacy_download_page .course_item .course_message_wrapper .course_message {
  color: var(--site_blue, #2871b9);
  font-weight: bold;
  font-size: 15px;
}
.download_text_for_student .legacy_download_page .course_item a {
  display: inline-block;
  transition: opacity 0.2s ease;
}
.download_text_for_student .legacy_download_page .course_item a:hover {
  opacity: 0.85;
}
.download_text_for_student .legacy_download_page .course_item img.course_link_img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

/* ===========================================================
 * 成語コース / HSK単語コース ダウンロード子ページ デザイン
 * tbl_freetext_list / freetext_list_th / freetext_list_td0/td2
 * =========================================================== */
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  font-size: 16px;
  line-height: 1.8;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page,
  .download_chengyu_course_text1 .legacy_download_page,
  .download_chengyu_course_text2 .legacy_download_page,
  .download_chengyu_course_text3 .legacy_download_page,
  .download_chengyu_course_text4 .legacy_download_page,
  .download_hsk_vocabulary_course_text .legacy_download_page,
  .download_hsk_vocab_text1 .legacy_download_page,
  .download_hsk_vocab_text2 .legacy_download_page,
  .download_hsk_vocab_text3 .legacy_download_page,
  .download_hsk_vocab_text4 .legacy_download_page,
  .download_hsk_vocab_text5 .legacy_download_page,
  .download_hsk_vocab_text6 .legacy_download_page,
  .tutors_chengyu_course .legacy_download_page,
  .tutors_hsk_course .legacy_download_page {
    font-size: 15px;
  }
}
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  /* セクション見出し (h2.blue-back)
     「見出し」と分かるように、左側の太い縦線 + 青文字 + 下線で表現
     （青背景白文字のボタン的見た目を避ける） */
}
.download_chengyu_course_text .legacy_download_page h2.blue-back,
.download_chengyu_course_text .legacy_download_page h2.top,
.download_chengyu_course_text1 .legacy_download_page h2.blue-back,
.download_chengyu_course_text1 .legacy_download_page h2.top,
.download_chengyu_course_text2 .legacy_download_page h2.blue-back,
.download_chengyu_course_text2 .legacy_download_page h2.top,
.download_chengyu_course_text3 .legacy_download_page h2.blue-back,
.download_chengyu_course_text3 .legacy_download_page h2.top,
.download_chengyu_course_text4 .legacy_download_page h2.blue-back,
.download_chengyu_course_text4 .legacy_download_page h2.top,
.download_hsk_vocabulary_course_text .legacy_download_page h2.blue-back,
.download_hsk_vocabulary_course_text .legacy_download_page h2.top,
.download_hsk_vocab_text1 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text1 .legacy_download_page h2.top,
.download_hsk_vocab_text2 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text2 .legacy_download_page h2.top,
.download_hsk_vocab_text3 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text3 .legacy_download_page h2.top,
.download_hsk_vocab_text4 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text4 .legacy_download_page h2.top,
.download_hsk_vocab_text5 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text5 .legacy_download_page h2.top,
.download_hsk_vocab_text6 .legacy_download_page h2.blue-back,
.download_hsk_vocab_text6 .legacy_download_page h2.top,
.tutors_chengyu_course .legacy_download_page h2.blue-back,
.tutors_chengyu_course .legacy_download_page h2.top,
.tutors_hsk_course .legacy_download_page h2.blue-back,
.tutors_hsk_course .legacy_download_page h2.top {
  display: block;
  color: var(--site_blue, #2871b9);
  background: transparent;
  font-size: 20px;
  font-weight: bold;
  padding: 8px 0 12px 18px;
  margin: 36px 0 16px;
  border-left: 6px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
  letter-spacing: 0.02em;
  line-height: 1.4;
  border-radius: 0;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page h2.blue-back,
  .download_chengyu_course_text .legacy_download_page h2.top,
  .download_chengyu_course_text1 .legacy_download_page h2.blue-back,
  .download_chengyu_course_text1 .legacy_download_page h2.top,
  .download_chengyu_course_text2 .legacy_download_page h2.blue-back,
  .download_chengyu_course_text2 .legacy_download_page h2.top,
  .download_chengyu_course_text3 .legacy_download_page h2.blue-back,
  .download_chengyu_course_text3 .legacy_download_page h2.top,
  .download_chengyu_course_text4 .legacy_download_page h2.blue-back,
  .download_chengyu_course_text4 .legacy_download_page h2.top,
  .download_hsk_vocabulary_course_text .legacy_download_page h2.blue-back,
  .download_hsk_vocabulary_course_text .legacy_download_page h2.top,
  .download_hsk_vocab_text1 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text1 .legacy_download_page h2.top,
  .download_hsk_vocab_text2 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text2 .legacy_download_page h2.top,
  .download_hsk_vocab_text3 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text3 .legacy_download_page h2.top,
  .download_hsk_vocab_text4 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text4 .legacy_download_page h2.top,
  .download_hsk_vocab_text5 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text5 .legacy_download_page h2.top,
  .download_hsk_vocab_text6 .legacy_download_page h2.blue-back,
  .download_hsk_vocab_text6 .legacy_download_page h2.top,
  .tutors_chengyu_course .legacy_download_page h2.blue-back,
  .tutors_chengyu_course .legacy_download_page h2.top,
  .tutors_hsk_course .legacy_download_page h2.blue-back,
  .tutors_hsk_course .legacy_download_page h2.top {
    font-size: 17px;
    padding: 6px 0 10px 14px;
    border-left-width: 5px;
  }
}
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  /* Lead paragraph */
}
.download_chengyu_course_text .legacy_download_page p.pos_top20,
.download_chengyu_course_text .legacy_download_page p.pos_top10,
.download_chengyu_course_text1 .legacy_download_page p.pos_top20,
.download_chengyu_course_text1 .legacy_download_page p.pos_top10,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20,
.download_chengyu_course_text2 .legacy_download_page p.pos_top10,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20,
.download_chengyu_course_text3 .legacy_download_page p.pos_top10,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20,
.download_chengyu_course_text4 .legacy_download_page p.pos_top10,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top10,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top10,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top10,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top10,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top10,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top10,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top10,
.tutors_chengyu_course .legacy_download_page p.pos_top20,
.tutors_chengyu_course .legacy_download_page p.pos_top10,
.tutors_hsk_course .legacy_download_page p.pos_top20,
.tutors_hsk_course .legacy_download_page p.pos_top10 {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 1.5em;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page p.pos_top20,
  .download_chengyu_course_text .legacy_download_page p.pos_top10,
  .download_chengyu_course_text1 .legacy_download_page p.pos_top20,
  .download_chengyu_course_text1 .legacy_download_page p.pos_top10,
  .download_chengyu_course_text2 .legacy_download_page p.pos_top20,
  .download_chengyu_course_text2 .legacy_download_page p.pos_top10,
  .download_chengyu_course_text3 .legacy_download_page p.pos_top20,
  .download_chengyu_course_text3 .legacy_download_page p.pos_top10,
  .download_chengyu_course_text4 .legacy_download_page p.pos_top20,
  .download_chengyu_course_text4 .legacy_download_page p.pos_top10,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text1 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text1 .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text2 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text2 .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text3 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text3 .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text4 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text4 .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text5 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text5 .legacy_download_page p.pos_top10,
  .download_hsk_vocab_text6 .legacy_download_page p.pos_top20,
  .download_hsk_vocab_text6 .legacy_download_page p.pos_top10,
  .tutors_chengyu_course .legacy_download_page p.pos_top20,
  .tutors_chengyu_course .legacy_download_page p.pos_top10,
  .tutors_hsk_course .legacy_download_page p.pos_top20,
  .tutors_hsk_course .legacy_download_page p.pos_top10 {
    font-size: 15px;
  }
}
.download_chengyu_course_text .legacy_download_page p.pos_top20 .font_blue,
.download_chengyu_course_text .legacy_download_page p.pos_top10 .font_blue,
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 .font_blue,
.download_chengyu_course_text1 .legacy_download_page p.pos_top10 .font_blue,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 .font_blue,
.download_chengyu_course_text2 .legacy_download_page p.pos_top10 .font_blue,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 .font_blue,
.download_chengyu_course_text3 .legacy_download_page p.pos_top10 .font_blue,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 .font_blue,
.download_chengyu_course_text4 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top10 .font_blue,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 .font_blue,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top10 .font_blue,
.tutors_chengyu_course .legacy_download_page p.pos_top20 .font_blue,
.tutors_chengyu_course .legacy_download_page p.pos_top10 .font_blue,
.tutors_hsk_course .legacy_download_page p.pos_top20 .font_blue,
.tutors_hsk_course .legacy_download_page p.pos_top10 .font_blue {
  color: var(--site_blue, #2871b9);
  font-weight: bold;
}
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  /* Course list table */
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list {
  width: 100%;
  max-width: 700px;
  margin: 0 auto 32px;
  border-collapse: collapse;
  background: #fff;
  border: #e0e0e0 solid 1px;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  text-align: center;
  padding: 12px 10px;
  font-size: 15px;
  letter-spacing: 0.05em;
  border-right: rgba(255, 255, 255, 0.2) solid 1px;
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th:last-child {
  border-right: none;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list th.freetext_list_th {
    font-size: 13px;
    padding: 10px 6px;
  }
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 {
  padding: 14px 16px;
  border-top: #e6e6e6 solid 1px;
  font-size: 16px;
  line-height: 1.6;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td1,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 {
    padding: 10px 12px;
    font-size: 14px;
  }
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0 {
  background: #f8fbff;
  color: #0069af;
  font-weight: bold;
  text-align: left;
  padding-left: 24px;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td0 {
    padding-left: 16px;
  }
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a {
  display: inline-block;
  padding: 6px 18px;
  background: #f7bb67;
  color: #fff;
  font-weight: bold;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.2s ease;
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a:hover {
  background: #e89e3c;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .tutors_chengyu_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a,
  .tutors_hsk_course .legacy_download_page table.tbl_freetext_list td.freetext_list_td2 a {
    padding: 5px 12px;
    font-size: 13px;
  }
}
.download_chengyu_course_text .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_chengyu_course_text1 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_chengyu_course_text2 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_chengyu_course_text3 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_chengyu_course_text4 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocabulary_course_text .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text1 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text2 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text3 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text4 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text5 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.download_hsk_vocab_text6 .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.tutors_chengyu_course .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0,
.tutors_hsk_course .legacy_download_page table.tbl_freetext_list tr:nth-of-type(odd) td.freetext_list_td0 {
  background: #fafcff;
}
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  /* 講師ページ専用: zip 一括ダウンロード下の注記リスト
     ul.freetext_list_ul > li.pic_li_skyblue
     新デザインの list-dot-blue (青い丸) 風に統一 */
}
.download_chengyu_course_text .legacy_download_page ul.freetext_list_ul,
.download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul,
.download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul,
.download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul,
.download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul,
.download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul,
.tutors_chengyu_course .legacy_download_page ul.freetext_list_ul,
.tutors_hsk_course .legacy_download_page ul.freetext_list_ul {
  list-style: none;
  padding: 0;
  margin: 0 0 1.6em;
}
.download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li,
.download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li,
.download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li,
.download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li,
.download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li,
.download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li,
.tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li,
.tutors_hsk_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
.tutors_hsk_course .legacy_download_page ul.freetext_list_ul li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 0.6em;
  font-size: 16px;
  line-height: 1.7;
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li,
  .download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li,
  .download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li,
  .download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li,
  .download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li,
  .download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li,
  .tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li,
  .tutors_hsk_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue,
  .tutors_hsk_course .legacy_download_page ul.freetext_list_ul li {
    font-size: 15px;
    padding-left: 18px;
  }
}
.download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_chengyu_course_text .legacy_download_page ul.freetext_list_ul li::before,
.download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_chengyu_course_text1 .legacy_download_page ul.freetext_list_ul li::before,
.download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_chengyu_course_text2 .legacy_download_page ul.freetext_list_ul li::before,
.download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_chengyu_course_text3 .legacy_download_page ul.freetext_list_ul li::before,
.download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_chengyu_course_text4 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocabulary_course_text .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text1 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text2 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text3 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text4 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text5 .legacy_download_page ul.freetext_list_ul li::before,
.download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.download_hsk_vocab_text6 .legacy_download_page ul.freetext_list_ul li::before,
.tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.tutors_chengyu_course .legacy_download_page ul.freetext_list_ul li::before,
.tutors_hsk_course .legacy_download_page ul.freetext_list_ul li.pic_li_skyblue::before,
.tutors_hsk_course .legacy_download_page ul.freetext_list_ul li::before {
  position: absolute;
  top: 0.55em;
  left: 4px;
  content: "";
  width: 10px;
  height: 10px;
  background: var(--site_blue, #2871b9);
  border-radius: 50%;
}
.download_chengyu_course_text .legacy_download_page,
.download_chengyu_course_text1 .legacy_download_page,
.download_chengyu_course_text2 .legacy_download_page,
.download_chengyu_course_text3 .legacy_download_page,
.download_chengyu_course_text4 .legacy_download_page,
.download_hsk_vocabulary_course_text .legacy_download_page,
.download_hsk_vocab_text1 .legacy_download_page,
.download_hsk_vocab_text2 .legacy_download_page,
.download_hsk_vocab_text3 .legacy_download_page,
.download_hsk_vocab_text4 .legacy_download_page,
.download_hsk_vocab_text5 .legacy_download_page,
.download_hsk_vocab_text6 .legacy_download_page,
.tutors_chengyu_course .legacy_download_page,
.tutors_hsk_course .legacy_download_page {
  /* 講師ページ専用: zip 一括ダウンロードリンク
     p.pos_top10 内に並ぶ <a download> リンクの可読性向上 */
}
.download_chengyu_course_text .legacy_download_page p.pos_top10 a[download],
.download_chengyu_course_text1 .legacy_download_page p.pos_top10 a[download],
.download_chengyu_course_text2 .legacy_download_page p.pos_top10 a[download],
.download_chengyu_course_text3 .legacy_download_page p.pos_top10 a[download],
.download_chengyu_course_text4 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text1 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text2 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text3 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text4 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text5 .legacy_download_page p.pos_top10 a[download],
.download_hsk_vocab_text6 .legacy_download_page p.pos_top10 a[download],
.tutors_chengyu_course .legacy_download_page p.pos_top10 a[download],
.tutors_hsk_course .legacy_download_page p.pos_top10 a[download] {
  display: inline-block;
  margin: 2px 0;
  padding: 2px 4px;
  color: var(--site_blue, #2871b9);
  font-weight: bold;
  text-decoration: underline;
}
.download_chengyu_course_text .legacy_download_page p.pos_top10 a[download]:hover,
.download_chengyu_course_text1 .legacy_download_page p.pos_top10 a[download]:hover,
.download_chengyu_course_text2 .legacy_download_page p.pos_top10 a[download]:hover,
.download_chengyu_course_text3 .legacy_download_page p.pos_top10 a[download]:hover,
.download_chengyu_course_text4 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top10 a[download]:hover,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top10 a[download]:hover,
.tutors_chengyu_course .legacy_download_page p.pos_top10 a[download]:hover,
.tutors_hsk_course .legacy_download_page p.pos_top10 a[download]:hover {
  color: #0069af;
  text-decoration: none;
}

/* ===========================================================
 * 旧デザイン本文ラッパの共通スタイル
 *
 * 適用ターゲット:
 *   - .legacy_announcement      (announcements/*.ctp)
 *   - .legacy_tutor_page        (tutors/netchai_rule, tutors_how_to_skype, text_japan_server,
 *                                tutors/chengyu_course, tutors/hsk_vocabulary_course 等)
 *   - .legacy_course_page       (pages/chengyu_course, hsk_vocabulary_course 等)
 *   - .legacy_freetext_page     (pages/freetext 等)
 *   - .legacy_admin_page        (admins/*.ctp 全般 / Stage D 修正(33))
 *
 * 設計意図:
 *   いずれも「表組+段落+見出し+リンク」が中心の旧デザインコンテンツで、
 *   構造はほぼ同じ。新デザインの precaution__contents の中で、本文を読みやすい
 *   フォントサイズと余白に整える。
 * =========================================================== */
/* ===========================================================
 * 管理者ページ用追加スタイル (Stage D 修正(34))
 * =========================================================== */
/* 全旧デザイン本文ラッパ共通: 旧 h1.top.pink-back / h1.pink-back / h2.bar_h2 等を
   新デザインの section 見出しに統一
   対象: legacy_admin_page / legacy_course_page / legacy_announcement /
        legacy_freetext_page / legacy_tutor_page / legacy_download_page */
.legacy_admin_page h1.top,
.legacy_admin_page h1.top.pink-back,
.legacy_admin_page h1.pink-back,
.legacy_admin_page h2.bar_h2,
.legacy_course_page h1.top,
.legacy_course_page h1.top.pink-back,
.legacy_course_page h1.pink-back,
.legacy_course_page h2.bar_h2,
.legacy_announcement h1.top,
.legacy_announcement h1.top.pink-back,
.legacy_announcement h1.pink-back,
.legacy_announcement h2.bar_h2,
.legacy_freetext_page h1.top,
.legacy_freetext_page h1.top.pink-back,
.legacy_freetext_page h1.pink-back,
.legacy_freetext_page h2.bar_h2,
.legacy_tutor_page h1.top,
.legacy_tutor_page h1.top.pink-back,
.legacy_tutor_page h1.pink-back,
.legacy_tutor_page h2.bar_h2,
.legacy_download_page h1.top,
.legacy_download_page h1.top.pink-back,
.legacy_download_page h1.pink-back,
.legacy_download_page h2.bar_h2 {
  display: block;
  color: var(--site_blue, #2871b9);
  background: transparent;
  font-size: 22px;
  font-weight: bold;
  padding: 10px 0 14px 20px;
  margin: 24px 0 20px;
  border-left: 6px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
  letter-spacing: 0.02em;
  line-height: 1.4;
  border-radius: 0;
}
@media screen and (max-width: 768px) {
  .legacy_admin_page h1.top,
  .legacy_admin_page h1.top.pink-back,
  .legacy_admin_page h1.pink-back,
  .legacy_admin_page h2.bar_h2,
  .legacy_course_page h1.top,
  .legacy_course_page h1.top.pink-back,
  .legacy_course_page h1.pink-back,
  .legacy_course_page h2.bar_h2,
  .legacy_announcement h1.top,
  .legacy_announcement h1.top.pink-back,
  .legacy_announcement h1.pink-back,
  .legacy_announcement h2.bar_h2,
  .legacy_freetext_page h1.top,
  .legacy_freetext_page h1.top.pink-back,
  .legacy_freetext_page h1.pink-back,
  .legacy_freetext_page h2.bar_h2,
  .legacy_tutor_page h1.top,
  .legacy_tutor_page h1.top.pink-back,
  .legacy_tutor_page h1.pink-back,
  .legacy_tutor_page h2.bar_h2,
  .legacy_download_page h1.top,
  .legacy_download_page h1.top.pink-back,
  .legacy_download_page h1.pink-back,
  .legacy_download_page h2.bar_h2 {
    font-size: 18px;
    padding: 8px 0 12px 14px;
    border-left-width: 5px;
  }
}
.legacy_admin_page h1.top,
.legacy_admin_page h1.top.pink-back,
.legacy_admin_page h1.pink-back,
.legacy_admin_page h2.bar_h2,
.legacy_course_page h1.top,
.legacy_course_page h1.top.pink-back,
.legacy_course_page h1.pink-back,
.legacy_course_page h2.bar_h2,
.legacy_announcement h1.top,
.legacy_announcement h1.top.pink-back,
.legacy_announcement h1.pink-back,
.legacy_announcement h2.bar_h2,
.legacy_freetext_page h1.top,
.legacy_freetext_page h1.top.pink-back,
.legacy_freetext_page h1.pink-back,
.legacy_freetext_page h2.bar_h2,
.legacy_tutor_page h1.top,
.legacy_tutor_page h1.top.pink-back,
.legacy_tutor_page h1.pink-back,
.legacy_tutor_page h2.bar_h2,
.legacy_download_page h1.top,
.legacy_download_page h1.top.pink-back,
.legacy_download_page h1.pink-back,
.legacy_download_page h2.bar_h2 {
  /* h2.bar_h2 が中に <span> や <a> を含む場合の文字色も継承 */
}
.legacy_admin_page h1.top a, .legacy_admin_page h1.top span,
.legacy_admin_page h1.top.pink-back a,
.legacy_admin_page h1.top.pink-back span,
.legacy_admin_page h1.pink-back a,
.legacy_admin_page h1.pink-back span,
.legacy_admin_page h2.bar_h2 a,
.legacy_admin_page h2.bar_h2 span,
.legacy_course_page h1.top a,
.legacy_course_page h1.top span,
.legacy_course_page h1.top.pink-back a,
.legacy_course_page h1.top.pink-back span,
.legacy_course_page h1.pink-back a,
.legacy_course_page h1.pink-back span,
.legacy_course_page h2.bar_h2 a,
.legacy_course_page h2.bar_h2 span,
.legacy_announcement h1.top a,
.legacy_announcement h1.top span,
.legacy_announcement h1.top.pink-back a,
.legacy_announcement h1.top.pink-back span,
.legacy_announcement h1.pink-back a,
.legacy_announcement h1.pink-back span,
.legacy_announcement h2.bar_h2 a,
.legacy_announcement h2.bar_h2 span,
.legacy_freetext_page h1.top a,
.legacy_freetext_page h1.top span,
.legacy_freetext_page h1.top.pink-back a,
.legacy_freetext_page h1.top.pink-back span,
.legacy_freetext_page h1.pink-back a,
.legacy_freetext_page h1.pink-back span,
.legacy_freetext_page h2.bar_h2 a,
.legacy_freetext_page h2.bar_h2 span,
.legacy_tutor_page h1.top a,
.legacy_tutor_page h1.top span,
.legacy_tutor_page h1.top.pink-back a,
.legacy_tutor_page h1.top.pink-back span,
.legacy_tutor_page h1.pink-back a,
.legacy_tutor_page h1.pink-back span,
.legacy_tutor_page h2.bar_h2 a,
.legacy_tutor_page h2.bar_h2 span,
.legacy_download_page h1.top a,
.legacy_download_page h1.top span,
.legacy_download_page h1.top.pink-back a,
.legacy_download_page h1.top.pink-back span,
.legacy_download_page h1.pink-back a,
.legacy_download_page h1.pink-back span,
.legacy_download_page h2.bar_h2 a,
.legacy_download_page h2.bar_h2 span {
  color: inherit;
}
.legacy_admin_page,
.legacy_course_page,
.legacy_announcement,
.legacy_freetext_page,
.legacy_tutor_page,
.legacy_download_page {
  /* 旧 h2.blue-back / h2.top 系も同様 (やや細めの見出し) */
}
.legacy_admin_page h2.blue-back,
.legacy_admin_page h2.top.blue-back,
.legacy_admin_page h3.blue-back,
.legacy_course_page h2.blue-back,
.legacy_course_page h2.top.blue-back,
.legacy_course_page h3.blue-back,
.legacy_announcement h2.blue-back,
.legacy_announcement h2.top.blue-back,
.legacy_announcement h3.blue-back,
.legacy_freetext_page h2.blue-back,
.legacy_freetext_page h2.top.blue-back,
.legacy_freetext_page h3.blue-back,
.legacy_tutor_page h2.blue-back,
.legacy_tutor_page h2.top.blue-back,
.legacy_tutor_page h3.blue-back,
.legacy_download_page h2.blue-back,
.legacy_download_page h2.top.blue-back,
.legacy_download_page h3.blue-back {
  display: block;
  color: var(--site_blue, #2871b9);
  background: transparent;
  font-size: 18px;
  font-weight: bold;
  padding: 8px 0 10px 18px;
  margin: 24px 0 16px;
  border-left: 5px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
  letter-spacing: 0.02em;
  line-height: 1.4;
}
@media screen and (max-width: 768px) {
  .legacy_admin_page h2.blue-back,
  .legacy_admin_page h2.top.blue-back,
  .legacy_admin_page h3.blue-back,
  .legacy_course_page h2.blue-back,
  .legacy_course_page h2.top.blue-back,
  .legacy_course_page h3.blue-back,
  .legacy_announcement h2.blue-back,
  .legacy_announcement h2.top.blue-back,
  .legacy_announcement h3.blue-back,
  .legacy_freetext_page h2.blue-back,
  .legacy_freetext_page h2.top.blue-back,
  .legacy_freetext_page h3.blue-back,
  .legacy_tutor_page h2.blue-back,
  .legacy_tutor_page h2.top.blue-back,
  .legacy_tutor_page h3.blue-back,
  .legacy_download_page h2.blue-back,
  .legacy_download_page h2.top.blue-back,
  .legacy_download_page h3.blue-back {
    font-size: 16px;
    padding: 6px 0 8px 14px;
  }
}

/* 管理者ページ専用: 上記の追加スタイル */
.legacy_admin_page {
  /* (bPopup #popup / #confirm のスタイルは body 直下に移動するため、
     ここからは取り出して下記の top-level ルールへ移した) */
}

/* ===========================================================
 * bPopup モーダル (#popup / #confirm)
 *
 * IMPORTANT: bPopup は デフォルト appendTo:'body' で popup 要素を
 * <body> 直下に移動する。そのため `.legacy_admin_page #popup` のような
 * 祖先制限付きセレクタは popup 表示時にマッチしない。
 * → top-level (どの親でも当たる) で定義する。
 *
 * ID は admin ページ群でしか使われていないので、コンフリクトの恐れは低い。
 * =========================================================== */
#popup,
#confirm {
  display: none;
  position: relative; /* b-close の position: absolute の起点 */
  background: #fff;
  padding: 22px 28px 18px;
  border-radius: 8px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.25);
  /* IMPORTANT: bPopup ライブラリが popup 表示時に inline で
     `style="width: auto; height: auto;"` をセットする。
     普通の `width: 720px` はそれに上書きされて popup が極狭になる。
     → !important でインラインに勝たせる + min-width も併用 */
  width: 720px !important;
  min-width: 720px;
  max-width: 90vw;
  height: auto !important;
  /* bPopup は position: ['auto', 30] で top:30px に置き、
     さらに #result に inline height:Xpx をセットすることがある。
     これを尊重しつつ popup 全体は画面に余裕を持って収まるよう
     max-height は !important で確実に抑える */
  max-height: calc(100vh - 60px) !important;
  overflow: auto;
  z-index: 9999;
  box-sizing: border-box;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
  /* bPopup が contentContainer:'#result' に inline height をセットしても
     スクロールが popup 自体ではなく #result 側に出るのを防ぐため、
     #result は height:auto に強制 */
}
#popup #result,
#confirm #result {
  height: auto !important;
  max-width: 100%;
  overflow: visible !important;
}
@media (max-width: 768px) {
  #popup,
  #confirm {
    width: 92vw !important;
    min-width: 0;
    padding: 16px 14px 12px;
    max-height: calc(100vh - 40px) !important;
  }
}
#popup,
#confirm {
  /* AJAX で読み込まれる lookup_users 内の検索フォーム
     生徒 (group_id=3) ・ 講師 (group_id=2) どちらでも同じ見た目 */
}
#popup .section.form_search h3,
#confirm .section.form_search h3 {
  margin: 0 36px 8px 0;
  padding-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
  color: #2871b9;
  border-bottom: 2px solid #e6f0fa;
}
#popup .section.form_search table,
#confirm .section.form_search table {
  width: 100%;
  margin: 0 0 8px;
  border-collapse: collapse;
  table-layout: fixed; /* 講師でも生徒でも同じ列幅にする */
}
#popup .section.form_search table th.tbl_search_student_th,
#confirm .section.form_search table th.tbl_search_student_th {
  background: #2871b9;
  color: #fff;
  font-weight: bold;
  padding: 3px 10px;
  text-align: left;
  font-size: 13px;
  width: 30%;
  white-space: nowrap;
  border: #fff solid 1px;
  line-height: 1.3;
}
#popup .section.form_search table td.tbl_search_student_td,
#confirm .section.form_search table td.tbl_search_student_td {
  padding: 2px 10px;
  background: #fff;
  border: #e6e6e6 solid 1px;
  width: 70%;
}
#popup .section.form_search table td.tbl_search_student_td span,
#confirm .section.form_search table td.tbl_search_student_td span {
  display: block;
  width: 100%;
  margin: 0;
}
#popup .section.form_search table td.tbl_search_student_td input[type=text],
#popup .section.form_search table td.tbl_search_student_td input[type=email],
#confirm .section.form_search table td.tbl_search_student_td input[type=text],
#confirm .section.form_search table td.tbl_search_student_td input[type=email] {
  width: 100%;
  max-width: 100%;
  padding: 3px 8px;
  font-size: 13px;
  line-height: 1.3;
  border: #c8c8c8 solid 1px;
  border-radius: 4px;
  box-sizing: border-box;
  margin: 0;
}
#popup .section.form_search table td.tbl_search_student_td input[type=text]:focus,
#popup .section.form_search table td.tbl_search_student_td input[type=email]:focus,
#confirm .section.form_search table td.tbl_search_student_td input[type=text]:focus,
#confirm .section.form_search table td.tbl_search_student_td input[type=email]:focus {
  outline: none;
  border-color: #2871b9;
  box-shadow: 0 0 0 2px rgba(40, 113, 185, 0.15);
}
#popup .section.form_search input[type=submit],
#confirm .section.form_search input[type=submit] {
  display: inline-block;
  padding: 6px 24px;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  background: #2871b9;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin-top: 2px;
}
#popup .section.form_search input[type=submit]:hover,
#confirm .section.form_search input[type=submit]:hover {
  background: #205a92;
}
#popup,
#confirm {
  /* lookup_users 検索結果テーブル */
}
#popup table.tbl_search_student_result,
#confirm table.tbl_search_student_result {
  width: 100%;
  margin: 12px 0;
  border-collapse: collapse;
  background: #fff;
}
#popup table.tbl_search_student_result th.tbl_search_student_result_th,
#confirm table.tbl_search_student_result th.tbl_search_student_result_th {
  background: #2871b9;
  color: #fff;
  font-weight: bold;
  padding: 6px 8px;
  font-size: 12px;
  border: #fff solid 1px;
}
#popup table.tbl_search_student_result th.tbl_search_student_result_th a,
#confirm table.tbl_search_student_result th.tbl_search_student_result_th a {
  color: #fff;
  text-decoration: none;
}
#popup table.tbl_search_student_result td.tbl_search_student_result_td,
#confirm table.tbl_search_student_result td.tbl_search_student_result_td {
  padding: 6px 8px;
  border: #e6e6e6 solid 1px;
  font-size: 13px;
}
#popup table.tbl_search_student_result td.tbl_search_student_result_td a.none,
#confirm table.tbl_search_student_result td.tbl_search_student_result_td a.none {
  color: #2871b9;
  font-weight: bold;
  text-decoration: underline;
  cursor: pointer;
}
#popup table.tbl_search_student_result td.tbl_search_student_result_td a.none:hover,
#confirm table.tbl_search_student_result td.tbl_search_student_result_td a.none:hover {
  text-decoration: none;
  color: #205a92;
}
#popup .paginateLinks,
#confirm .paginateLinks {
  margin-top: 8px;
  text-align: center;
  font-size: 13px;
}
#popup .paginateLinks a,
#confirm .paginateLinks a {
  color: #2871b9;
  text-decoration: underline;
  margin: 0 4px;
}
#popup,
#confirm {
  /* 「X」閉じるボタン */
}
#popup .button.b-close,
#confirm .button.b-close {
  position: absolute;
  top: 8px;
  right: 12px;
  cursor: pointer;
  color: #999;
  font-size: 18px;
  font-weight: bold;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  border-radius: 50%;
  background: #f0f0f0;
  transition: background 0.15s ease, color 0.15s ease;
  z-index: 1;
}
#popup .button.b-close:hover,
#confirm .button.b-close:hover {
  background: #2871b9;
  color: #fff;
}
#popup .button.b-close span,
#confirm .button.b-close span {
  color: inherit;
}
#popup,
#confirm {
  /* モーダル内の見出し */
}
#popup h2,
#confirm h2 {
  color: #2871b9;
  font-size: 18px;
  font-weight: bold;
  margin: 0 30px 16px 0;
  padding-bottom: 10px;
  border-bottom: 2px solid #e6f0fa;
}
#popup,
#confirm {
  /* モーダル内テーブル (#confirm 用) */
}
#popup table,
#confirm table {
  width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
}
#popup table td,
#confirm table td {
  padding: 8px 12px;
  border: #e0e6ee solid 1px;
  font-size: 14px;
}
#popup table td.tbl_search_student_th,
#confirm table td.tbl_search_student_th {
  background: #2871b9;
  color: #fff;
  font-weight: bold;
  white-space: nowrap;
  width: 25%;
}
#popup table button,
#confirm table button {
  padding: 8px 24px;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  background: #2871b9;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin: 4px;
}
#popup table button:hover,
#confirm table button:hover {
  background: #205a92;
}
#popup #gif-loader,
#confirm #gif-loader {
  text-align: center;
  padding: 24px 0;
  /* グローバル `img { width: 100% }` に勝つよう明示的に指定 */
}
#popup #gif-loader img,
#confirm #gif-loader img {
  width: 32px !important;
  max-width: 32px;
  height: 32px;
  display: inline-block;
}
#popup #gif-loader span,
#confirm #gif-loader span {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  color: #666;
}

/* ログイン警告ページ: エラーメッセージ */
.page_login_warning .legacy_course_page .login-warning__error {
  display: block;
  margin: 16px 0 24px;
  padding: 14px 20px;
  background: #fef0f0;
  border-left: 4px solid #de2246;
  color: #de2246;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.6;
  border-radius: 4px;
}

/* learning_chinese ページ: 旧 msg_*.gif 画像を h3 テキスト見出しに置換した時のスタイル */
.learning_chinese .terms__contents h3.learning-subhead {
  display: block;
  color: #2871b9;
  background: transparent;
  font-size: 18px;
  font-weight: bold;
  padding: 8px 0 8px 16px;
  margin: 28px 0 14px;
  border-left: 5px solid #2871b9;
  border-bottom: 2px solid #e6f0fa;
  letter-spacing: 0.02em;
  line-height: 1.4;
}
@media screen and (max-width: 768px) {
  .learning_chinese .terms__contents h3.learning-subhead {
    font-size: 16px;
    padding: 6px 0 6px 12px;
    margin: 20px 0 10px;
  }
}
.learning_chinese .terms__contents {
  /* h2.blue-back の青ベタ見出しスタイル (このページ用) */
}
.learning_chinese .terms__contents h2.blue-back {
  display: block;
  color: #fff;
  background: #2871b9;
  font-size: 20px;
  font-weight: bold;
  padding: 12px 18px;
  margin: 32px 0 18px;
  border-radius: 4px 4px 0 0;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .learning_chinese .terms__contents h2.blue-back {
    font-size: 17px;
    padding: 10px 14px;
  }
}

/* お問い合わせフォームデータ確認 (questions/index): 検索結果テーブル */
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result {
  width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
  background: #fff;
  font-size: 13px;
}
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result th.tbl_search_questions_result_th {
  background: #2871b9;
  color: #fff;
  font-weight: bold;
  padding: 8px 10px;
  text-align: center;
  border: #fff solid 1px;
}
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result th.tbl_search_questions_result_th a {
  color: #fff;
  text-decoration: none;
}
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result td {
  padding: 8px 10px;
  border: #e0e6ee solid 1px;
  vertical-align: top;
  line-height: 1.5;
}
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result td.actions a {
  display: inline-block;
  margin-right: 6px;
  color: #2871b9;
  text-decoration: underline;
}
.admins_questions_index .legacy_admin_page table.tbl_search_questions_result tr.altrow td {
  background: #f8fbff;
}
.admins_questions_index .legacy_admin_page .questions-search-form input[type=text] {
  padding: 6px 10px;
  font-size: 14px;
  border: #c8c8c8 solid 1px;
  border-radius: 4px;
  width: 100%;
  max-width: 360px;
  box-sizing: border-box;
}
.admins_questions_index .legacy_admin_page .questions-search-form input[type=text]:focus {
  outline: none;
  border-color: #2871b9;
  box-shadow: 0 0 0 2px rgba(40, 113, 185, 0.15);
}
.admins_questions_index .legacy_admin_page .questions-search-form select {
  padding: 6px 10px;
  font-size: 14px;
  border: #c8c8c8 solid 1px;
  border-radius: 4px;
  background: #fff;
}
.admins_questions_index .legacy_admin_page .paging a, .admins_questions_index .legacy_admin_page .paging span {
  margin: 0 4px;
}
.admins_questions_index .legacy_admin_page .paging a {
  color: #2871b9;
  text-decoration: underline;
}
.admins_questions_index .legacy_admin_page .paging span.current,
.admins_questions_index .legacy_admin_page .paging span.disabled {
  color: #999;
}

/* 講師出勤確認リスト: 検索＋ダウンロードボタンを横並びに */
.admins_view_tutors_firstlesson .legacy_admin_page .firstlesson-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 16px 0;
}
.admins_view_tutors_firstlesson .legacy_admin_page .firstlesson-btn-row input[type=submit],
.admins_view_tutors_firstlesson .legacy_admin_page .firstlesson-btn-row button {
  display: inline-block;
  padding: 10px 24px;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  background: var(--site_blue, #2871b9);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.admins_view_tutors_firstlesson .legacy_admin_page .firstlesson-btn-row input[type=submit]:hover,
.admins_view_tutors_firstlesson .legacy_admin_page .firstlesson-btn-row button:hover {
  background: #205a92;
}
.admins_view_tutors_firstlesson .legacy_admin_page {
  /* tbl_check_start_lesson の体裁 */
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_check_start_lesson {
  width: 100%;
  max-width: 720px;
  margin: 1em auto;
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_check_start_lesson th.check_start_lesson_th {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  padding: 12px 16px;
  text-align: left;
  border: #fff solid 1px;
  white-space: nowrap;
  width: 32%;
  letter-spacing: 0.03em;
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_check_start_lesson td.check_start_lesson_td1 {
  padding: 12px 16px;
  border: #e6e6e6 solid 1px;
  background: #fff;
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_check_start_lesson td.check_start_lesson_td2 {
  padding: 14px 16px;
  background: #fff;
  border: #e6e6e6 solid 1px;
}
.admins_view_tutors_firstlesson .legacy_admin_page {
  /* 検索結果テーブル */
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_search_firstlesson_result_list {
  width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_search_firstlesson_result_list th {
  background: var(--site_blue, #2871b9);
  color: #fff;
  padding: 10px 12px;
}
.admins_view_tutors_firstlesson .legacy_admin_page table.tbl_search_firstlesson_result_list td {
  padding: 10px 12px;
  border-bottom: #e2e2e2 solid 1px;
}

/* search_user (講師検索 / 生徒検索) の見栄え向上 */
.admins_search_user .legacy_admin_page {
  /* 旧 h1 (管理者検索ページ) → 控えめなセクション見出しに */
}
.admins_search_user .legacy_admin_page h1.top.pink-back {
  display: block;
  color: var(--site_blue, #2871b9);
  background: transparent;
  font-size: 20px;
  font-weight: bold;
  padding: 8px 0 12px 18px;
  margin: 16px 0 20px;
  border-left: 6px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
  letter-spacing: 0.02em;
  line-height: 1.4;
  border-radius: 0;
}
@media screen and (max-width: 768px) {
  .admins_search_user .legacy_admin_page h1.top.pink-back {
    font-size: 17px;
    padding: 6px 0 10px 14px;
  }
}
.admins_search_user .legacy_admin_page {
  /* 検索フォームの table_search_student */
}
.admins_search_user .legacy_admin_page table.tbl_search_student {
  width: 100%;
  max-width: 820px;
  margin: 0 0 24px;
  border-collapse: collapse;
  background: #fff;
  border: #e0e0e0 solid 1px;
}
.admins_search_user .legacy_admin_page table.tbl_search_student tr:first-child td.tbl_search_student_th[colspan] {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  padding: 10px 16px;
  font-size: 15px;
  text-align: left;
}
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_th {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  padding: 12px 16px;
  border: #fff solid 1px;
  white-space: nowrap;
  width: 30%;
  letter-spacing: 0.03em;
}
@media screen and (max-width: 768px) {
  .admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_th {
    width: 100%;
    display: block;
  }
}
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td {
  padding: 10px 14px;
  background: #fff;
  border: #e6e6e6 solid 1px;
}
@media screen and (max-width: 768px) {
  .admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td {
    width: 100%;
    display: block;
  }
}
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=text],
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=email],
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=number],
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td select {
  width: 100%;
  max-width: 360px;
  padding: 6px 10px;
  font-size: 15px;
  border: #c8c8c8 solid 1px;
  border-radius: 4px;
  background: #fff;
}
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=text]:focus,
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=email]:focus,
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td input[type=number]:focus,
.admins_search_user .legacy_admin_page table.tbl_search_student td.tbl_search_student_td select:focus {
  outline: none;
  border-color: var(--site_blue, #2871b9);
  box-shadow: 0 0 0 2px rgba(40, 113, 185, 0.15);
}
.admins_search_user .legacy_admin_page {
  /* 検索ボタン (input[type=submit]) を青ボタンに */
}
.admins_search_user .legacy_admin_page input[type=submit],
.admins_search_user .legacy_admin_page button[type=submit] {
  display: inline-block;
  padding: 10px 28px;
  font-size: 15px;
  font-weight: bold;
  color: #fff;
  background: var(--site_blue, #2871b9);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  margin: 8px 4px;
  transition: background 0.15s ease;
}
.admins_search_user .legacy_admin_page input[type=submit]:hover,
.admins_search_user .legacy_admin_page button[type=submit]:hover {
  background: #205a92;
}
.admins_search_user .legacy_admin_page {
  /* 検索結果テーブル群（広く出現する旧テーブルクラス） */
}
.admins_search_user .legacy_admin_page table[class^=tbl_search_] {
  width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
  background: #fff;
}
.admins_search_user .legacy_admin_page table[class^=tbl_search_] th, .admins_search_user .legacy_admin_page table[class^=tbl_search_] td {
  padding: 8px 10px;
  border: #e6e6e6 solid 1px;
  font-size: 14px;
  vertical-align: middle;
}
.admins_search_user .legacy_admin_page table[class^=tbl_search_] th {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  text-align: center;
}
.admins_search_user .legacy_admin_page table[class^=tbl_search_] tr:nth-of-type(even) td {
  background: #f8fbff;
}
.admins_search_user .legacy_admin_page {
  /* search_user 結果テーブル <table border="1">（クラス無しの旧表） */
}
.admins_search_user .legacy_admin_page table[border] {
  width: 100%;
  margin: 1em 0;
  border-collapse: collapse;
  border: #c8d4e2 solid 1px;
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
}
.admins_search_user .legacy_admin_page table[border] td {
  padding: 8px 10px;
  border: #e0e6ee solid 1px;
  vertical-align: middle;
}
.admins_search_user .legacy_admin_page table[border] {
  /* 1 行目（見出し: ユーザーID / ユーザー名 / ...）を青ヘッダ化 */
}
.admins_search_user .legacy_admin_page table[border] tr:first-child td {
  background: var(--site_blue, #2871b9);
  color: #fff;
  font-weight: bold;
  text-align: center;
  white-space: nowrap;
  padding: 10px 10px;
  border: #fff solid 1px;
  letter-spacing: 0.02em;
}
.admins_search_user .legacy_admin_page table[border] {
  /* データ行ストライプ */
}
.admins_search_user .legacy_admin_page table[border] tr:nth-of-type(even):not(:first-child) td {
  background: #f8fbff;
}
.admins_search_user .legacy_admin_page table[border] {
  /* 行内の input 系をコンパクトに */
}
.admins_search_user .legacy_admin_page table[border] input[type=text],
.admins_search_user .legacy_admin_page table[border] input[type=email],
.admins_search_user .legacy_admin_page table[border] input[type=number],
.admins_search_user .legacy_admin_page table[border] input[type=checkbox],
.admins_search_user .legacy_admin_page table[border] select {
  padding: 4px 6px;
  font-size: 12px;
  border: #c8c8c8 solid 1px;
  border-radius: 3px;
  background: #fff;
  max-width: 100%;
}
.admins_search_user .legacy_admin_page table[border] {
  /* 「更新」ボタン等を青角丸に */
}
.admins_search_user .legacy_admin_page table[border] button {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background: var(--site_blue, #2871b9);
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.admins_search_user .legacy_admin_page table[border] button:hover {
  background: #205a92;
}

.legacy_announcement,
.legacy_tutor_page,
.legacy_course_page,
.legacy_freetext_page,
.legacy_admin_page {
  font-size: 16px;
  line-height: 1.85;
}
@media screen and (max-width: 768px) {
  .legacy_announcement,
  .legacy_tutor_page,
  .legacy_course_page,
  .legacy_freetext_page,
  .legacy_admin_page {
    font-size: 15px;
  }
}
.legacy_announcement,
.legacy_tutor_page,
.legacy_course_page,
.legacy_freetext_page,
.legacy_admin_page {
  /* 重要: 全体に img { width: 100%; } のグローバルルールがあるため、
     インライン GIF (NEW! 等) が巨大化するのを防ぐ */
}
.legacy_announcement img,
.legacy_tutor_page img,
.legacy_course_page img,
.legacy_freetext_page img,
.legacy_admin_page img {
  width: auto;
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
.legacy_announcement,
.legacy_tutor_page,
.legacy_course_page,
.legacy_freetext_page,
.legacy_admin_page {
  /* お知らせ一覧 (announcements/all.ctp) の topics リスト */
}
.legacy_announcement ol.topics,
.legacy_announcement ul.topics,
.legacy_tutor_page ol.topics,
.legacy_tutor_page ul.topics,
.legacy_course_page ol.topics,
.legacy_course_page ul.topics,
.legacy_freetext_page ol.topics,
.legacy_freetext_page ul.topics,
.legacy_admin_page ol.topics,
.legacy_admin_page ul.topics {
  list-style: none;
  padding: 0;
  margin: 0;
}
.legacy_announcement ol.topics li.date,
.legacy_announcement ul.topics li.date,
.legacy_tutor_page ol.topics li.date,
.legacy_tutor_page ul.topics li.date,
.legacy_course_page ol.topics li.date,
.legacy_course_page ul.topics li.date,
.legacy_freetext_page ol.topics li.date,
.legacy_freetext_page ul.topics li.date,
.legacy_admin_page ol.topics li.date,
.legacy_admin_page ul.topics li.date {
  padding: 14px 16px;
  border-bottom: #e2e2e2 solid 1px;
  font-size: 16px;
  line-height: 1.7;
}
@media screen and (max-width: 768px) {
  .legacy_announcement ol.topics li.date,
  .legacy_announcement ul.topics li.date,
  .legacy_tutor_page ol.topics li.date,
  .legacy_tutor_page ul.topics li.date,
  .legacy_course_page ol.topics li.date,
  .legacy_course_page ul.topics li.date,
  .legacy_freetext_page ol.topics li.date,
  .legacy_freetext_page ul.topics li.date,
  .legacy_admin_page ol.topics li.date,
  .legacy_admin_page ul.topics li.date {
    font-size: 15px;
    padding: 12px 10px;
  }
}
.legacy_announcement ol.topics li.date span.update,
.legacy_announcement ul.topics li.date span.update,
.legacy_tutor_page ol.topics li.date span.update,
.legacy_tutor_page ul.topics li.date span.update,
.legacy_course_page ol.topics li.date span.update,
.legacy_course_page ul.topics li.date span.update,
.legacy_freetext_page ol.topics li.date span.update,
.legacy_freetext_page ul.topics li.date span.update,
.legacy_admin_page ol.topics li.date span.update,
.legacy_admin_page ul.topics li.date span.update {
  display: inline-block;
  color: #888;
  font-size: 14px;
  font-weight: bold;
  margin-right: 8px;
  /* logo_new.gif (NEW!) は古い記事にも貼られているので一律非表示
     （ユーザー要望: 一覧の全記事から NEW を外す） */
}
.legacy_announcement ol.topics li.date span.update img,
.legacy_announcement ul.topics li.date span.update img,
.legacy_tutor_page ol.topics li.date span.update img,
.legacy_tutor_page ul.topics li.date span.update img,
.legacy_course_page ol.topics li.date span.update img,
.legacy_course_page ul.topics li.date span.update img,
.legacy_freetext_page ol.topics li.date span.update img,
.legacy_freetext_page ul.topics li.date span.update img,
.legacy_admin_page ol.topics li.date span.update img,
.legacy_admin_page ul.topics li.date span.update img {
  display: none;
}
.legacy_announcement ol.topics li.date a,
.legacy_announcement ul.topics li.date a,
.legacy_tutor_page ol.topics li.date a,
.legacy_tutor_page ul.topics li.date a,
.legacy_course_page ol.topics li.date a,
.legacy_course_page ul.topics li.date a,
.legacy_freetext_page ol.topics li.date a,
.legacy_freetext_page ul.topics li.date a,
.legacy_admin_page ol.topics li.date a,
.legacy_admin_page ul.topics li.date a {
  color: var(--site_blue, #2871b9);
  font-weight: bold;
  text-decoration: none;
  /* リンク内の font_blue は青字を維持（クリック可能を示す） */
}
.legacy_announcement ol.topics li.date a .font_blue,
.legacy_announcement ul.topics li.date a .font_blue,
.legacy_tutor_page ol.topics li.date a .font_blue,
.legacy_tutor_page ul.topics li.date a .font_blue,
.legacy_course_page ol.topics li.date a .font_blue,
.legacy_course_page ul.topics li.date a .font_blue,
.legacy_freetext_page ol.topics li.date a .font_blue,
.legacy_freetext_page ul.topics li.date a .font_blue,
.legacy_admin_page ol.topics li.date a .font_blue,
.legacy_admin_page ul.topics li.date a .font_blue {
  color: var(--site_blue, #2871b9);
}
.legacy_announcement ol.topics li.date a:hover,
.legacy_announcement ul.topics li.date a:hover,
.legacy_tutor_page ol.topics li.date a:hover,
.legacy_tutor_page ul.topics li.date a:hover,
.legacy_course_page ol.topics li.date a:hover,
.legacy_course_page ul.topics li.date a:hover,
.legacy_freetext_page ol.topics li.date a:hover,
.legacy_freetext_page ul.topics li.date a:hover,
.legacy_admin_page ol.topics li.date a:hover,
.legacy_admin_page ul.topics li.date a:hover {
  text-decoration: underline;
}
.legacy_announcement ol.topics li.date a:hover .font_blue,
.legacy_announcement ul.topics li.date a:hover .font_blue,
.legacy_tutor_page ol.topics li.date a:hover .font_blue,
.legacy_tutor_page ul.topics li.date a:hover .font_blue,
.legacy_course_page ol.topics li.date a:hover .font_blue,
.legacy_course_page ul.topics li.date a:hover .font_blue,
.legacy_freetext_page ol.topics li.date a:hover .font_blue,
.legacy_freetext_page ul.topics li.date a:hover .font_blue,
.legacy_admin_page ol.topics li.date a:hover .font_blue,
.legacy_admin_page ul.topics li.date a:hover .font_blue {
  text-decoration: underline;
}
.legacy_announcement ol.topics li.date,
.legacy_announcement ul.topics li.date,
.legacy_tutor_page ol.topics li.date,
.legacy_tutor_page ul.topics li.date,
.legacy_course_page ol.topics li.date,
.legacy_course_page ul.topics li.date,
.legacy_freetext_page ol.topics li.date,
.legacy_freetext_page ul.topics li.date,
.legacy_admin_page ol.topics li.date,
.legacy_admin_page ul.topics li.date {
  /* リンク外（直の子）の font_blue は黒文字に上書き
     リンクの有無を視覚的に区別しやすくするため */
}
.legacy_announcement ol.topics li.date > .font_blue,
.legacy_announcement ol.topics li.date > br + .font_blue,
.legacy_announcement ul.topics li.date > .font_blue,
.legacy_announcement ul.topics li.date > br + .font_blue,
.legacy_tutor_page ol.topics li.date > .font_blue,
.legacy_tutor_page ol.topics li.date > br + .font_blue,
.legacy_tutor_page ul.topics li.date > .font_blue,
.legacy_tutor_page ul.topics li.date > br + .font_blue,
.legacy_course_page ol.topics li.date > .font_blue,
.legacy_course_page ol.topics li.date > br + .font_blue,
.legacy_course_page ul.topics li.date > .font_blue,
.legacy_course_page ul.topics li.date > br + .font_blue,
.legacy_freetext_page ol.topics li.date > .font_blue,
.legacy_freetext_page ol.topics li.date > br + .font_blue,
.legacy_freetext_page ul.topics li.date > .font_blue,
.legacy_freetext_page ul.topics li.date > br + .font_blue,
.legacy_admin_page ol.topics li.date > .font_blue,
.legacy_admin_page ol.topics li.date > br + .font_blue,
.legacy_admin_page ul.topics li.date > .font_blue,
.legacy_admin_page ul.topics li.date > br + .font_blue {
  color: #333;
  font-size: 16px;
  font-weight: normal;
}
@media screen and (max-width: 768px) {
  .legacy_announcement ol.topics li.date > .font_blue,
  .legacy_announcement ol.topics li.date > br + .font_blue,
  .legacy_announcement ul.topics li.date > .font_blue,
  .legacy_announcement ul.topics li.date > br + .font_blue,
  .legacy_tutor_page ol.topics li.date > .font_blue,
  .legacy_tutor_page ol.topics li.date > br + .font_blue,
  .legacy_tutor_page ul.topics li.date > .font_blue,
  .legacy_tutor_page ul.topics li.date > br + .font_blue,
  .legacy_course_page ol.topics li.date > .font_blue,
  .legacy_course_page ol.topics li.date > br + .font_blue,
  .legacy_course_page ul.topics li.date > .font_blue,
  .legacy_course_page ul.topics li.date > br + .font_blue,
  .legacy_freetext_page ol.topics li.date > .font_blue,
  .legacy_freetext_page ol.topics li.date > br + .font_blue,
  .legacy_freetext_page ul.topics li.date > .font_blue,
  .legacy_freetext_page ul.topics li.date > br + .font_blue,
  .legacy_admin_page ol.topics li.date > .font_blue,
  .legacy_admin_page ol.topics li.date > br + .font_blue,
  .legacy_admin_page ul.topics li.date > .font_blue,
  .legacy_admin_page ul.topics li.date > br + .font_blue {
    font-size: 15px;
  }
}
.legacy_announcement p,
.legacy_tutor_page p,
.legacy_course_page p,
.legacy_freetext_page p,
.legacy_admin_page p {
  font-size: 16px;
  line-height: 1.9;
  margin-bottom: 1em;
}
@media screen and (max-width: 768px) {
  .legacy_announcement p,
  .legacy_tutor_page p,
  .legacy_course_page p,
  .legacy_freetext_page p,
  .legacy_admin_page p {
    font-size: 15px;
  }
}
.legacy_announcement h2.blue-back,
.legacy_announcement h2.top,
.legacy_tutor_page h2.blue-back,
.legacy_tutor_page h2.top,
.legacy_course_page h2.blue-back,
.legacy_course_page h2.top,
.legacy_freetext_page h2.blue-back,
.legacy_freetext_page h2.top,
.legacy_admin_page h2.blue-back,
.legacy_admin_page h2.top {
  display: block;
  color: #fff;
  background: var(--site_blue, #2871b9);
  font-size: 20px;
  font-weight: bold;
  padding: 12px 18px;
  margin: 24px 0 18px;
  border-radius: 4px 4px 0 0;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
  .legacy_announcement h2.blue-back,
  .legacy_announcement h2.top,
  .legacy_tutor_page h2.blue-back,
  .legacy_tutor_page h2.top,
  .legacy_course_page h2.blue-back,
  .legacy_course_page h2.top,
  .legacy_freetext_page h2.blue-back,
  .legacy_freetext_page h2.top,
  .legacy_admin_page h2.blue-back,
  .legacy_admin_page h2.top {
    font-size: 17px;
    padding: 10px 14px;
  }
}
.legacy_announcement ul:not(.topics), .legacy_announcement ol:not(.topics),
.legacy_tutor_page ul:not(.topics),
.legacy_tutor_page ol:not(.topics),
.legacy_course_page ul:not(.topics),
.legacy_course_page ol:not(.topics),
.legacy_freetext_page ul:not(.topics),
.legacy_freetext_page ol:not(.topics),
.legacy_admin_page ul:not(.topics),
.legacy_admin_page ol:not(.topics) {
  font-size: 16px;
  line-height: 1.8;
  padding-left: 1.5em;
}
@media screen and (max-width: 768px) {
  .legacy_announcement ul:not(.topics), .legacy_announcement ol:not(.topics),
  .legacy_tutor_page ul:not(.topics),
  .legacy_tutor_page ol:not(.topics),
  .legacy_course_page ul:not(.topics),
  .legacy_course_page ol:not(.topics),
  .legacy_freetext_page ul:not(.topics),
  .legacy_freetext_page ol:not(.topics),
  .legacy_admin_page ul:not(.topics),
  .legacy_admin_page ol:not(.topics) {
    font-size: 15px;
  }
}
.legacy_announcement ul:not(.topics) li, .legacy_announcement ol:not(.topics) li,
.legacy_tutor_page ul:not(.topics) li,
.legacy_tutor_page ol:not(.topics) li,
.legacy_course_page ul:not(.topics) li,
.legacy_course_page ol:not(.topics) li,
.legacy_freetext_page ul:not(.topics) li,
.legacy_freetext_page ol:not(.topics) li,
.legacy_admin_page ul:not(.topics) li,
.legacy_admin_page ol:not(.topics) li {
  margin-bottom: 0.5em;
}
.legacy_announcement table,
.legacy_tutor_page table,
.legacy_course_page table,
.legacy_freetext_page table,
.legacy_admin_page table {
  font-size: 16px;
  line-height: 1.8;
  margin: 1em 0;
  /* 短いセル内容 (PDF/Word リンク等) で表が極端に左寄りになるのを防ぐため
     コンテナ幅いっぱいに広げる (netchai_rule の tbl_textlist 等) */
  width: 100%;
}
.legacy_announcement table th, .legacy_announcement table td,
.legacy_tutor_page table th,
.legacy_tutor_page table td,
.legacy_course_page table th,
.legacy_course_page table td,
.legacy_freetext_page table th,
.legacy_freetext_page table td,
.legacy_admin_page table th,
.legacy_admin_page table td {
  padding: 10px 14px;
  vertical-align: top;
  border: #e6e6e6 solid 1px;
}
.legacy_announcement table th,
.legacy_tutor_page table th,
.legacy_course_page table th,
.legacy_freetext_page table th,
.legacy_admin_page table th {
  background: #eaf2fa;
  color: #0069af;
  font-weight: bold;
  /* 横幅 100% で広がるので white-space: nowrap は不要。
     ヘッダ文字が長い場合 (text_japan_server 等) でも自然に折り返す */
}
@media screen and (max-width: 768px) {
  .legacy_announcement table,
  .legacy_tutor_page table,
  .legacy_course_page table,
  .legacy_freetext_page table,
  .legacy_admin_page table {
    font-size: 15px;
  }
  .legacy_announcement table th, .legacy_announcement table td,
  .legacy_tutor_page table th,
  .legacy_tutor_page table td,
  .legacy_course_page table th,
  .legacy_course_page table td,
  .legacy_freetext_page table th,
  .legacy_freetext_page table td,
  .legacy_admin_page table th,
  .legacy_admin_page table td {
    padding: 8px 10px;
  }
}
.legacy_announcement .font_blue,
.legacy_tutor_page .font_blue,
.legacy_course_page .font_blue,
.legacy_freetext_page .font_blue,
.legacy_admin_page .font_blue {
  color: var(--site_blue, #2871b9);
}
.legacy_announcement .font_red,
.legacy_tutor_page .font_red,
.legacy_course_page .font_red,
.legacy_freetext_page .font_red,
.legacy_admin_page .font_red {
  color: #de2246;
}
.legacy_announcement .font_pink,
.legacy_tutor_page .font_pink,
.legacy_course_page .font_pink,
.legacy_freetext_page .font_pink,
.legacy_admin_page .font_pink {
  color: #f06292;
}
.legacy_announcement .font_dark_gray,
.legacy_tutor_page .font_dark_gray,
.legacy_course_page .font_dark_gray,
.legacy_freetext_page .font_dark_gray,
.legacy_admin_page .font_dark_gray {
  color: #555;
}
.legacy_announcement .font_weight600,
.legacy_tutor_page .font_weight600,
.legacy_course_page .font_weight600,
.legacy_freetext_page .font_weight600,
.legacy_admin_page .font_weight600 {
  font-weight: 600;
}
.legacy_announcement .font_weight700,
.legacy_tutor_page .font_weight700,
.legacy_course_page .font_weight700,
.legacy_freetext_page .font_weight700,
.legacy_admin_page .font_weight700 {
  font-weight: 700;
}
.legacy_announcement a,
.legacy_tutor_page a,
.legacy_course_page a,
.legacy_freetext_page a,
.legacy_admin_page a {
  color: var(--site_blue, #2871b9);
  text-decoration: underline;
}
.legacy_announcement a:hover,
.legacy_tutor_page a:hover,
.legacy_course_page a:hover,
.legacy_freetext_page a:hover,
.legacy_admin_page a:hover {
  text-decoration: none;
}

/* ===========================================================
 * お問い合わせフォーム (questions/post + toCompany) の
 * 注意書き list-dot-blue フォント拡大
 * =========================================================== */
.toCompany-form .list-dot-blue,
.toCompany-form .toCompany-form .list-dot-blue,
.questions_post .list-dot-blue,
.questions_post .toCompany-form .list-dot-blue,
.questions_confirm .list-dot-blue,
.questions_confirm .toCompany-form .list-dot-blue {
  font-size: 16px;
  line-height: 1.8;
}
.toCompany-form .list-dot-blue li,
.toCompany-form .toCompany-form .list-dot-blue li,
.questions_post .list-dot-blue li,
.questions_post .toCompany-form .list-dot-blue li,
.questions_confirm .list-dot-blue li,
.questions_confirm .toCompany-form .list-dot-blue li {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 0.6em;
}
@media screen and (max-width: 768px) {
  .toCompany-form .list-dot-blue li,
  .toCompany-form .toCompany-form .list-dot-blue li,
  .questions_post .list-dot-blue li,
  .questions_post .toCompany-form .list-dot-blue li,
  .questions_confirm .list-dot-blue li,
  .questions_confirm .toCompany-form .list-dot-blue li {
    font-size: 15px;
  }
}
.toCompany-form .list-dot-blue li a,
.toCompany-form .toCompany-form .list-dot-blue li a,
.questions_post .list-dot-blue li a,
.questions_post .toCompany-form .list-dot-blue li a,
.questions_confirm .list-dot-blue li a,
.questions_confirm .toCompany-form .list-dot-blue li a {
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .toCompany-form .list-dot-blue li a,
  .toCompany-form .toCompany-form .list-dot-blue li a,
  .questions_post .list-dot-blue li a,
  .questions_post .toCompany-form .list-dot-blue li a,
  .questions_confirm .list-dot-blue li a,
  .questions_confirm .toCompany-form .list-dot-blue li a {
    font-size: 15px;
  }
}

/* 直接ターゲット指定（ネスト不安定対策の保険） */
.questions_post .toCompany-form .list-dot-blue li,
.toCompany .toCompany-form .list-dot-blue li {
  font-size: 16px;
  line-height: 1.8;
}
@media screen and (max-width: 768px) {
  .questions_post .toCompany-form .list-dot-blue li,
  .toCompany .toCompany-form .list-dot-blue li {
    font-size: 15px;
  }
}

/* ===========================================================
 * 成語/HSK ダウンロード「子ページ」(text1, text2, ...) の
 * 「< 成語習得コーストップへ戻る」リンクをゴーストボタン風に
 *
 * 設計意図:
 *   - 親ページ (download_chengyu_course_text) のオレンジボタンが「順方向 CTA」
 *   - 子ページの戻るリンクは「逆方向 / 控えめな副次アクション」
 *   - グレーアウトラインのゴーストボタンで主従関係を視覚化
 *   - 左矢印 ‹ で「戻る」と一目で分かるように
 * =========================================================== */
.download_chengyu_course_text1 .legacy_download_page p.pos_top20,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 {
  text-align: center;
  margin: 32px 0 16px;
}
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a.font_blue,
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a.font_blue,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a.font_blue,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a.font_blue,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 24px 9px 20px;
  background: #fff;
  color: #555 !important;
  font-size: 14px !important;
  font-weight: bold;
  text-decoration: none;
  border: 1px solid #c8c8c8;
  border-radius: 999px;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
  /* 左矢印アイコン (::before) で「戻る」を視覚化
     HTML 側の "&lt; " プレフィックスは削除済み */
}
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a::before,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a::before,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a::before,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a::before,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a.font_blue::before,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a::before {
  content: "‹";
  display: inline-block;
  font-size: 20px;
  line-height: 1;
  font-weight: bold;
  color: var(--site_blue, #2871b9);
  transform: translateY(-1px);
}
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_chengyu_course_text1 .legacy_download_page p.pos_top20 a:hover,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_chengyu_course_text2 .legacy_download_page p.pos_top20 a:hover,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_chengyu_course_text3 .legacy_download_page p.pos_top20 a:hover,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_chengyu_course_text4 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a:hover {
  background: #f5f5f5;
  color: #333 !important;
  border-color: #999;
  transform: translateY(-1px);
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text1 .legacy_download_page p.pos_top20 a.font_blue,
  .download_chengyu_course_text1 .legacy_download_page p.pos_top20 a,
  .download_chengyu_course_text2 .legacy_download_page p.pos_top20 a.font_blue,
  .download_chengyu_course_text2 .legacy_download_page p.pos_top20 a,
  .download_chengyu_course_text3 .legacy_download_page p.pos_top20 a.font_blue,
  .download_chengyu_course_text3 .legacy_download_page p.pos_top20 a,
  .download_chengyu_course_text4 .legacy_download_page p.pos_top20 a.font_blue,
  .download_chengyu_course_text4 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text1 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text2 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text3 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text4 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text5 .legacy_download_page p.pos_top20 a,
  .download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocab_text6 .legacy_download_page p.pos_top20 a {
    padding: 8px 20px 8px 16px;
    font-size: 13px !important;
  }
}

/* ===========================================================
 * 成語/HSK ダウンロード子ページ
 * 「個別PDF一覧ページへ」リンクのボタンスタイル
 *
 * 設計意図:
 *   - 直前の h2 は「左縦線+青文字」の控えめな見出し → 役割: セクション分け
 *   - リンクボタンは「オレンジ背景+白文字+矢印アイコン」の目立つ CTA
 *     → 役割: クリックして次のページへ進む
 *   この配色対比により h2 とボタンが視覚的に明確に区別される
 * =========================================================== */
.download_chengyu_course_text .legacy_download_page p.pos_top20,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20,
.tutors_chengyu_course .legacy_download_page p.pos_top20,
.tutors_hsk_course .legacy_download_page p.pos_top20 {
  text-align: left;
  margin: 0 0 28px;
  padding-left: 18px; /* h2 の left padding と揃えて整列 */
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page p.pos_top20,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20,
  .tutors_chengyu_course .legacy_download_page p.pos_top20,
  .tutors_hsk_course .legacy_download_page p.pos_top20 {
    padding-left: 14px;
  }
}
.download_chengyu_course_text .legacy_download_page p.pos_top20 a.font_blue,
.download_chengyu_course_text .legacy_download_page p.pos_top20 a,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a.font_blue,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a.font_blue,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a,
.tutors_hsk_course .legacy_download_page p.pos_top20 a.font_blue,
.tutors_hsk_course .legacy_download_page p.pos_top20 a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 30px 11px 26px;
  /* h2 が青系のため、ボタンはオレンジ系でバリエーション
     前回の #c2410c は赤茶寄りで「もはやオレンジに見えない」との指摘
     今回は蜜柑色寄りの #d97706（amber/mandarin） に変更
     白背景でも AA コントラスト約 4.9:1 を確保 */
  background: #fff;
  color: #d97706 !important; /* 蜜柑色寄りのオレンジ (AA: ~4.9:1) */
  font-size: 16px !important;
  font-weight: bold;
  text-decoration: none;
  border: 2px solid #d97706; /* 蜜柑色寄りの枠線 */
  border-radius: 999px; /* ピル形状で「ボタン」と一目で分かる */
  transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
  box-shadow: 0 2px 4px rgba(217, 119, 6, 0.18);
  letter-spacing: 0.02em;
}
.download_chengyu_course_text .legacy_download_page p.pos_top20 a.font_blue::after,
.download_chengyu_course_text .legacy_download_page p.pos_top20 a::after,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a.font_blue::after,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a::after,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a.font_blue::after,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a::after,
.tutors_hsk_course .legacy_download_page p.pos_top20 a.font_blue::after,
.tutors_hsk_course .legacy_download_page p.pos_top20 a::after {
  content: "›";
  display: inline-block;
  font-size: 22px;
  line-height: 1;
  font-weight: bold;
  transform: translateY(-1px);
}
.download_chengyu_course_text .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_chengyu_course_text .legacy_download_page p.pos_top20 a:hover,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a.font_blue:hover,
.download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a:hover,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a.font_blue:hover,
.tutors_chengyu_course .legacy_download_page p.pos_top20 a:hover,
.tutors_hsk_course .legacy_download_page p.pos_top20 a.font_blue:hover,
.tutors_hsk_course .legacy_download_page p.pos_top20 a:hover {
  background: #d97706; /* オレンジ塗りつぶし */
  color: #fff !important;
  border-color: #d97706;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(217, 119, 6, 0.35);
}
@media screen and (max-width: 768px) {
  .download_chengyu_course_text .legacy_download_page p.pos_top20 a.font_blue,
  .download_chengyu_course_text .legacy_download_page p.pos_top20 a,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a.font_blue,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a,
  .tutors_chengyu_course .legacy_download_page p.pos_top20 a.font_blue,
  .tutors_chengyu_course .legacy_download_page p.pos_top20 a,
  .tutors_hsk_course .legacy_download_page p.pos_top20 a.font_blue,
  .tutors_hsk_course .legacy_download_page p.pos_top20 a {
    padding: 9px 24px 9px 20px;
    font-size: 14px !important;
    gap: 6px;
  }
  .download_chengyu_course_text .legacy_download_page p.pos_top20 a.font_blue::after,
  .download_chengyu_course_text .legacy_download_page p.pos_top20 a::after,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a.font_blue::after,
  .download_hsk_vocabulary_course_text .legacy_download_page p.pos_top20 a::after,
  .tutors_chengyu_course .legacy_download_page p.pos_top20 a.font_blue::after,
  .tutors_chengyu_course .legacy_download_page p.pos_top20 a::after,
  .tutors_hsk_course .legacy_download_page p.pos_top20 a.font_blue::after,
  .tutors_hsk_course .legacy_download_page p.pos_top20 a::after {
    font-size: 19px;
  }
}

/* ===========================================================
 * Teams の使い方 インデックス (teams_questions/all.ctp)
 * Stage D 修正(289): コンテンツ部を新デザインで刷新。
 *   イントロカード (.teams-q-intro) + ヘルプ項目カードグリッド
 *   (.teams-q-nav) で視認性を高める。
 * =========================================================== */
.teams_q_all {
  /* SNS シェアボタン (旧 widget。控えめに右寄せ) */
}
.teams_q_all .teams-q__share {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  min-height: 22px;
  margin-bottom: 6px;
}
.teams_q_all {
  /* 上部バナー画像 */
}
.teams_q_all .teams-q__banner {
  margin-bottom: 28px;
  text-align: center;
}
.teams_q_all .teams-q__banner img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.teams_q_all {
  /* イントロ「Teamsって何？」(freetalk の .ft-intro と同方針) */
}
.teams_q_all .teams-q-intro {
  margin-bottom: 34px;
}
.teams_q_all .teams-q-intro__title {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0 0 14px;
  padding: 0 0 12px;
  font-size: 21px;
  font-weight: bold;
  color: #1f2937;
  line-height: 1.4;
  border-bottom: 3px solid var(--site_blue, #2871b9);
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-intro__title {
    font-size: 18px;
    gap: 8px;
  }
}
.teams_q_all .teams-q-intro__title-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4ca7ec, #0078d7);
  font-size: 16px;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-intro__title-icon {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
}
.teams_q_all .teams-q-intro__body {
  background: #f3f8ff;
  border: 1px solid #d6e6f7;
  border-radius: 10px;
  padding: 20px 24px;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-intro__body {
    padding: 16px 15px;
  }
}
.teams_q_all .teams-q-intro__body p {
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 1.95;
  color: #374151;
}
.teams_q_all .teams-q-intro__body p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-intro__body p {
    font-size: 14px;
    line-height: 1.9;
  }
}
.teams_q_all {
  /* セクション見出し「Teamsの使い方」 */
}
.teams_q_all .teams-q-heading {
  margin: 0 0 18px;
  padding: 8px 0 10px 16px;
  font-size: 20px;
  font-weight: bold;
  color: var(--site_blue, #2871b9);
  line-height: 1.4;
  border-left: 6px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-heading {
    font-size: 17px;
    padding-left: 12px;
  }
}
.teams_q_all {
  /* ヘルプ項目ナビ: 2 列カードグリッド */
}
.teams_q_all .teams-q-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-nav {
    grid-template-columns: 1fr;
  }
}
.teams_q_all .teams-q-nav__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 16px;
  background: #fff;
  border: 1px solid #e3eaf3;
  border-left: 4px solid var(--site_blue, #0078d7);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  text-decoration: none;
  color: #333;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.teams_q_all .teams-q-nav__item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1);
  border-color: #c8d6e8;
  border-left-color: var(--site_pink, #f57db4);
}
.teams_q_all .teams-q-nav__item__text {
  font-size: 14.5px;
  font-weight: bold;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  .teams_q_all .teams-q-nav__item__text {
    font-size: 14px;
  }
}
.teams_q_all .teams-q-nav__item__arrow {
  flex: 0 0 auto;
  font-size: 22px;
  font-weight: bold;
  color: var(--site_blue, #0078d7);
  line-height: 1;
}

/* ===========================================================
 * Teams の使い方 個別ページ (login / install / account ... 全 ~19)
 * Stage D 修正(290): 旧 legacy_teams_q コンテンツ (ほぼ未スタイル)
 *   に読みやすいデザインを適用。各ページの HTML は変更せず、共通
 *   クラスを SCSS で一括整形する。
 *   個別ページの main_class は teams_q_login 等のため
 *   main[class^="teams_q_"] でまとめて指定し、刷新済みの
 *   インデックス (teams_q_all / 修正289) は :not で除外する。
 * =========================================================== */
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* SNS シェアボタン: 右寄せで控えめに */
}
main[class^=teams_q_]:not(.teams_q_all) .twitter_content,
main.netchai_meeting_howto .twitter_content {
  float: right;
  margin-left: 8px;
}
main[class^=teams_q_]:not(.teams_q_all) .line_content,
main.netchai_meeting_howto .line_content {
  display: inline-block;
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* Stage D 修正(312): NetChai Meeting の使い方ページの目次ボックス */
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents,
main.netchai_meeting_howto .table-of-contents {
  margin: 0 0 28px;
  padding: 18px 24px;
  background: #f7faff;
  border: 1px solid #e3eaf3;
  border-radius: 10px;
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents .toc-title,
main.netchai_meeting_howto .table-of-contents .toc-title {
  display: block;
  font-size: 16px;
  font-weight: bold;
  color: var(--site_blue, #2871b9);
  margin-bottom: 10px;
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents ul,
main.netchai_meeting_howto .table-of-contents ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents li + li,
main.netchai_meeting_howto .table-of-contents li + li {
  margin-top: 6px;
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents a,
main.netchai_meeting_howto .table-of-contents a {
  color: var(--site_blue, #2871b9);
  font-size: 15px;
  text-decoration: none;
}
main[class^=teams_q_]:not(.teams_q_all) .table-of-contents a:hover,
main.netchai_meeting_howto .table-of-contents a:hover {
  text-decoration: underline;
}
@media screen and (max-width: 768px) {
  main[class^=teams_q_]:not(.teams_q_all) .table-of-contents,
  main.netchai_meeting_howto .table-of-contents {
    padding: 14px 16px;
  }
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* 見出し: 旧 h2.blue-back (青ベタ) → 左縦線 + 青文字 + 下線 */
}
main[class^=teams_q_]:not(.teams_q_all) h2.blue-back,
main.netchai_meeting_howto h2.blue-back {
  clear: both;
  display: block;
  color: var(--site_blue, #2871b9);
  background: transparent;
  font-size: 20px;
  font-weight: bold;
  padding: 8px 0 10px 16px;
  margin: 38px 0 18px;
  border-left: 6px solid var(--site_blue, #2871b9);
  border-bottom: 2px solid #e6f0fa;
  line-height: 1.4;
}
@media screen and (max-width: 768px) {
  main[class^=teams_q_]:not(.teams_q_all) h2.blue-back,
  main.netchai_meeting_howto h2.blue-back {
    font-size: 17px;
    padding-left: 12px;
    margin: 28px 0 14px;
  }
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* 本文段落: 淡青カードに載せ、行間をゆったりさせて読みやすく */
}
main[class^=teams_q_]:not(.teams_q_all) p.pos_top20,
main.netchai_meeting_howto p.pos_top20 {
  font-size: 16px;
  line-height: 2;
  margin: 0 0 22px;
  padding: 20px 24px;
  background: #f7faff;
  border: 1px solid #e3eaf3;
  border-radius: 10px;
}
@media screen and (max-width: 768px) {
  main[class^=teams_q_]:not(.teams_q_all) p.pos_top20,
  main.netchai_meeting_howto p.pos_top20 {
    font-size: 15px;
    line-height: 1.95;
    padding: 15px 16px;
  }
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* スクリーンショット画像 */
}
main[class^=teams_q_]:not(.teams_q_all) img.teams_img,
main[class^=teams_q_]:not(.teams_q_all) img.teams_img_tate,
main.netchai_meeting_howto img.teams_img,
main.netchai_meeting_howto img.teams_img_tate {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 6px auto 16px;
  border: 1px solid #d6e0ea;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* 横長 (PC 画面の SS) と縦長 (スマホ画面の SS) で最大幅を分ける。
     グローバルの img { width: 100% } に勝てるよう要素+クラスで指定。 */
}
main[class^=teams_q_]:not(.teams_q_all) img.teams_img,
main.netchai_meeting_howto img.teams_img {
  width: 600px;
}
main[class^=teams_q_]:not(.teams_q_all) img.teams_img_tate,
main.netchai_meeting_howto img.teams_img_tate {
  width: 300px;
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* 強調テキスト */
}
main[class^=teams_q_]:not(.teams_q_all) .font_weight600,
main.netchai_meeting_howto .font_weight600 {
  font-weight: bold;
}
main[class^=teams_q_]:not(.teams_q_all) .font_blue,
main.netchai_meeting_howto .font_blue {
  color: var(--site_blue, #2871b9);
  font-weight: bold;
}
main[class^=teams_q_]:not(.teams_q_all) .font_red,
main.netchai_meeting_howto .font_red {
  color: #de2246;
  font-weight: bold;
}
main[class^=teams_q_]:not(.teams_q_all),
main.netchai_meeting_howto {
  /* 「次のステップへ」テキストリンク → アクセントボタン風 */
}
main[class^=teams_q_]:not(.teams_q_all) .text_link,
main.netchai_meeting_howto .text_link {
  display: block;
  margin: 6px 0;
}
main[class^=teams_q_]:not(.teams_q_all) .text_link a,
main.netchai_meeting_howto .text_link a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 22px;
  background: #e8f1ff;
  color: var(--site_blue, #2871b9);
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  border: 1px solid #c8d6e8;
  border-radius: 8px;
  transition: background 0.15s ease, transform 0.15s ease;
}
main[class^=teams_q_]:not(.teams_q_all) .text_link a::before,
main.netchai_meeting_howto .text_link a::before {
  content: "›";
  font-size: 19px;
  font-weight: bold;
  line-height: 1;
}
main[class^=teams_q_]:not(.teams_q_all) .text_link a:hover,
main.netchai_meeting_howto .text_link a:hover {
  background: #d6e6f7;
  transform: translateX(2px);
}
@media screen and (max-width: 768px) {
  main[class^=teams_q_]:not(.teams_q_all) .text_link a,
  main.netchai_meeting_howto .text_link a {
    font-size: 14px;
    padding: 10px 16px;
  }
}

/* =============================================================
 * Stage D 修正(145): 管理者ページ共通スタイル
 *   - 検索フォーム (.admin-search)
 *   - 結果テーブル (.admin-result)
 *   - 注意書きブロック (.admin-page__notice)
 *
 * デザイン方針: tutors/show の .tutor-list__search を踏襲しつつ、
 * 管理画面用に幅を広げ、結果テーブルもモダン化。
 * ============================================================= */
main[class^=admins_] .admin-page,
main[class^=admin_] .admin-page {
  background: #fff;
}
main[class^=admins_] .admin-page__head::before,
main[class^=admin_] .admin-page__head::before {
  width: 36px;
  height: 36px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
main[class^=admins_] .admin-page__notice,
main[class^=admin_] .admin-page__notice {
  max-width: 900px;
  margin: 0 auto 24px;
  padding: 16px 22px;
  background: #f5fbff;
  border-left: 4px solid var(--site_blue);
  border-radius: 4px;
}
main[class^=admins_] .admin-page__notice-title,
main[class^=admin_] .admin-page__notice-title {
  color: var(--site_blue);
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 8px;
  padding-left: 22px;
  position: relative;
}
main[class^=admins_] .admin-page__notice-title::before,
main[class^=admin_] .admin-page__notice-title::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 16px;
  height: 16px;
  background: url(../../img/v2/common/icon_check_blue.svg) no-repeat;
  background-size: contain;
}
main[class^=admins_] .admin-page__notice ul,
main[class^=admin_] .admin-page__notice ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
main[class^=admins_] .admin-page__notice li,
main[class^=admin_] .admin-page__notice li {
  padding-left: 18px;
  position: relative;
  font-size: 13px;
  line-height: 1.7;
  color: #444;
}
main[class^=admins_] .admin-page__notice li::before,
main[class^=admin_] .admin-page__notice li::before {
  position: absolute;
  top: 0.55em;
  left: 3px;
  content: "";
  width: 9px;
  height: 9px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}
main[class^=admins_],
main[class^=admin_] {
  /* ----------------------------------------------------
   * 検索フォーム
   * ---------------------------------------------------- */
}
main[class^=admins_] .admin-search,
main[class^=admin_] .admin-search {
  max-width: 900px;
  margin: 0 auto 36px;
}
main[class^=admins_] .admin-search .table_search,
main[class^=admin_] .admin-search .table_search {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: #e0e0e0 solid 1px;
  border-radius: 6px;
  overflow: hidden;
}
main[class^=admins_] .admin-search .table_search th,
main[class^=admin_] .admin-search .table_search th {
  width: 180px;
  background: var(--site_blue);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  padding: 12px 14px 12px 20px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #e0e0e0;
}
@media screen and (max-width: 768px) {
  main[class^=admins_] .admin-search .table_search th,
  main[class^=admin_] .admin-search .table_search th {
    width: 100%;
    display: block;
    padding: 10px 14px;
  }
}
main[class^=admins_] .admin-search .table_search td,
main[class^=admin_] .admin-search .table_search td {
  background: #f5fbff;
  padding: 12px 16px;
  vertical-align: middle;
  border-bottom: 1px solid #e0e0e0;
}
@media screen and (max-width: 768px) {
  main[class^=admins_] .admin-search .table_search td,
  main[class^=admin_] .admin-search .table_search td {
    display: block;
    width: 100%;
    padding: 12px 14px;
  }
}
main[class^=admins_] .admin-search .table_search tr:last-child th,
main[class^=admins_] .admin-search .table_search tr:last-child td,
main[class^=admin_] .admin-search .table_search tr:last-child th,
main[class^=admin_] .admin-search .table_search tr:last-child td {
  border-bottom: none;
}
main[class^=admins_] .admin-search .table_search .row,
main[class^=admin_] .admin-search .table_search .row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
main[class^=admins_] .admin-search .table_search .row .row_inner,
main[class^=admin_] .admin-search .table_search .row .row_inner {
  display: flex;
  align-items: center;
  gap: 10px;
}
main[class^=admins_] .admin-search .table_search .row .row_inner .dash,
main[class^=admin_] .admin-search .table_search .row .row_inner .dash {
  color: #666;
  font-weight: 600;
}
main[class^=admins_] .admin-search .table_search input[type=text],
main[class^=admin_] .admin-search .table_search input[type=text] {
  border: #c9c9c9 solid 1px;
  background: #fff;
  border-radius: 5px;
  padding: 7px 10px;
  font-size: 13px;
  width: 200px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
main[class^=admins_] .admin-search .table_search input[type=text]:focus,
main[class^=admin_] .admin-search .table_search input[type=text]:focus {
  outline: none;
  border-color: var(--site_blue);
  box-shadow: 0 0 0 3px rgba(0, 120, 215, 0.15);
}
@media screen and (max-width: 768px) {
  main[class^=admins_] .admin-search .table_search input[type=text],
  main[class^=admin_] .admin-search .table_search input[type=text] {
    width: 100%;
  }
}
main[class^=admins_] .admin-search .table_search,
main[class^=admin_] .admin-search .table_search {
  /* ラジオボタンを横並び・余白付きに */
}
main[class^=admins_] .admin-search .table_search input[type=radio] + label,
main[class^=admins_] .admin-search .table_search label > input[type=radio],
main[class^=admin_] .admin-search .table_search input[type=radio] + label,
main[class^=admin_] .admin-search .table_search label > input[type=radio] {
  cursor: pointer;
}
main[class^=admins_] .admin-search .table_search input[type=radio],
main[class^=admin_] .admin-search .table_search input[type=radio] {
  margin: 0 6px 0 0;
  cursor: pointer;
}
main[class^=admins_] .admin-search .table_search label,
main[class^=admin_] .admin-search .table_search label {
  display: inline-flex;
  align-items: center;
  margin-right: 18px;
  font-size: 13px;
  cursor: pointer;
}
main[class^=admins_] .admin-search .table_search .btn-popup,
main[class^=admin_] .admin-search .table_search .btn-popup {
  background: #fff;
  border: 1px solid var(--site_blue);
  color: var(--site_blue);
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
main[class^=admins_] .admin-search .table_search .btn-popup:hover,
main[class^=admin_] .admin-search .table_search .btn-popup:hover {
  background: var(--site_blue);
  color: #fff;
}
main[class^=admins_] .admin-search .btnBox,
main[class^=admin_] .admin-search .btnBox {
  margin-top: 22px;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
main[class^=admins_] .admin-search .btnBox button,
main[class^=admins_] .admin-search .btnBox input[type=button],
main[class^=admins_] .admin-search .btnBox input[type=submit],
main[class^=admin_] .admin-search .btnBox button,
main[class^=admin_] .admin-search .btnBox input[type=button],
main[class^=admin_] .admin-search .btnBox input[type=submit] {
  min-width: 180px;
  height: 42px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, transform 0.12s, box-shadow 0.15s;
  border: none;
  outline: none;
}
main[class^=admins_] .admin-search .btnBox button:hover,
main[class^=admins_] .admin-search .btnBox input[type=button]:hover,
main[class^=admins_] .admin-search .btnBox input[type=submit]:hover,
main[class^=admin_] .admin-search .btnBox button:hover,
main[class^=admin_] .admin-search .btnBox input[type=button]:hover,
main[class^=admin_] .admin-search .btnBox input[type=submit]:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}
main[class^=admins_] .admin-search .btnBox .btnSearch,
main[class^=admin_] .admin-search .btnBox .btnSearch {
  background: var(--site_blue);
  color: #fff;
}
main[class^=admins_] .admin-search .btnBox .btnDownload,
main[class^=admin_] .admin-search .btnBox .btnDownload {
  background: #fff;
  color: var(--site_blue);
  border: 1px solid var(--site_blue);
}
main[class^=admins_] .admin-search .btnBox .btnDownload:hover,
main[class^=admin_] .admin-search .btnBox .btnDownload:hover {
  background: var(--site_blue);
  color: #fff;
}
main[class^=admins_] .admin-search .btnBox .btnClear,
main[class^=admin_] .admin-search .btnBox .btnClear {
  background: #555;
  color: #fff;
}
main[class^=admins_],
main[class^=admin_] {
  /* ----------------------------------------------------
   * 結果テーブル
   * ---------------------------------------------------- */
}
main[class^=admins_] .admin-result,
main[class^=admin_] .admin-result {
  max-width: 1100px;
  margin: 0 auto;
}
main[class^=admins_] .admin-result__count,
main[class^=admin_] .admin-result__count {
  margin: 0 0 14px;
  color: var(--site_blue);
  font-size: 16px;
  font-weight: 700;
}
main[class^=admins_] .admin-result__count strong,
main[class^=admin_] .admin-result__count strong {
  font-size: 22px;
  color: #c83a64;
  margin: 0 4px;
}
main[class^=admins_] .admin-result__table-wrap,
main[class^=admin_] .admin-result__table-wrap {
  overflow-x: auto;
  border-radius: 6px;
  border: 1px solid #e0e0e0;
}
main[class^=admins_] .admin-result__table,
main[class^=admin_] .admin-result__table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: 13px;
}
main[class^=admins_] .admin-result__table thead th,
main[class^=admin_] .admin-result__table thead th {
  background: var(--site_blue);
  color: #fff;
  font-weight: 700;
  padding: 10px 12px;
  text-align: center;
  white-space: nowrap;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}
main[class^=admins_] .admin-result__table thead th:last-child,
main[class^=admin_] .admin-result__table thead th:last-child {
  border-right: none;
}
main[class^=admins_] .admin-result__table tbody td,
main[class^=admin_] .admin-result__table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid #ececec;
  text-align: center;
  vertical-align: middle;
}
main[class^=admins_] .admin-result__table tbody tr,
main[class^=admin_] .admin-result__table tbody tr {
  transition: background 0.12s;
}
main[class^=admins_] .admin-result__table tbody tr:nth-child(even),
main[class^=admin_] .admin-result__table tbody tr:nth-child(even) {
  background: #f8fbff;
}
main[class^=admins_] .admin-result__table tbody tr:hover,
main[class^=admin_] .admin-result__table tbody tr:hover {
  background: #e8f1ff;
}
main[class^=admins_] .admin-result__table tbody tr:last-child td,
main[class^=admin_] .admin-result__table tbody tr:last-child td {
  border-bottom: none;
}
main[class^=admins_] .admin-result__table .btn-link-blue,
main[class^=admin_] .admin-result__table .btn-link-blue {
  display: inline-block;
  padding: 4px 12px;
  background: var(--site_blue);
  color: #fff;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.12s;
}
main[class^=admins_] .admin-result__table .btn-link-blue:hover,
main[class^=admin_] .admin-result__table .btn-link-blue:hover {
  background: #005a9e;
  text-decoration: none;
}
main[class^=admins_] .admin-result__table,
main[class^=admin_] .admin-result__table {
  /* Stage D 修正(146): 確認ボタン用オレンジ (詳細との視認性向上) */
}
main[class^=admins_] .admin-result__table .btn-link-orange,
main[class^=admin_] .admin-result__table .btn-link-orange {
  display: inline-block;
  padding: 4px 12px;
  background: #ee7a23;
  color: #fff;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.12s;
}
main[class^=admins_] .admin-result__table .btn-link-orange:hover,
main[class^=admin_] .admin-result__table .btn-link-orange:hover {
  background: #cf6411;
  text-decoration: none;
  color: #fff;
}
main[class^=admins_],
main[class^=admin_] {
  /* =============================================================
   * Stage D 修正(147): レガシー管理画面 (.legacy_admin_page) への
   *  ブランケット適用 — 既存 HTML を書き換えずに新デザイン化する
   *
   * 対象ページ (例):
   *  /admins/check_expired_lesson, tutors_evaluation_list,
   *  timetable_entry, search_user/2|3, update_paymentlist,
   *  check_paymentlist, combine_company_member,
   *  /settlement_migrations/index, /settlements/index,
   *  /paypal_payments/index, /questions/index 等
   *
   * 中身は維持したまま、レガシークラス (tbl_*, h1.top.pink-back,
   * pos30, font_blue, font_pink 等) を新デザインの見た目に揃える。
   * ============================================================= */
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 旧 h1 (ピンク帯) を新デザインの c-heading2 風に */
}
main[class^=admins_] .legacy_admin_page h1.top,
main[class^=admins_] .legacy_admin_page h1.pink-back,
main[class^=admins_] .legacy_admin_page h1.top.pink-back,
main[class^=admin_] .legacy_admin_page h1.top,
main[class^=admin_] .legacy_admin_page h1.pink-back,
main[class^=admin_] .legacy_admin_page h1.top.pink-back {
  background: none;
  color: var(--site_blue);
  font-size: 22px;
  font-weight: 700;
  padding: 0 0 8px;
  margin: 0 0 22px;
  border-bottom: 2px solid var(--site_blue);
  text-align: left;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 旧 .pos30 (■使用方法 など) を青枠 notice に */
}
main[class^=admins_] .legacy_admin_page .font_blue.font_120.font_weight600,
main[class^=admins_] .legacy_admin_page .pos30.font_blue,
main[class^=admins_] .legacy_admin_page span.font_blue,
main[class^=admin_] .legacy_admin_page .font_blue.font_120.font_weight600,
main[class^=admin_] .legacy_admin_page .pos30.font_blue,
main[class^=admin_] .legacy_admin_page span.font_blue {
  display: inline-block;
  color: var(--site_blue);
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 6px;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* font_pink は警告文として赤茶系に */
}
main[class^=admins_] .legacy_admin_page .font_pink,
main[class^=admin_] .legacy_admin_page .font_pink {
  color: #c83a64;
  font-weight: 600;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 旧 p.pos_top20 のリード文 */
}
main[class^=admins_] .legacy_admin_page p.pos_top20,
main[class^=admins_] .legacy_admin_page p.font_100,
main[class^=admin_] .legacy_admin_page p.pos_top20,
main[class^=admin_] .legacy_admin_page p.font_100 {
  font-size: 13px;
  line-height: 1.7;
  color: #444;
  margin: 0 0 16px;
  padding: 14px 18px;
  background: #f5fbff;
  border-left: 4px solid var(--site_blue);
  border-radius: 4px;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 旧 search 系テーブル (tbl_check_all_lesson, tbl_search_*, tbl_admin_*) を
   * 新デザインの table_search 風に。検索フォーム想定 (2 カラム th/td) */
}
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_],
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_],
main[class^=admins_] .legacy_admin_page table.tbl_search,
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check,
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user,
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member,
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist,
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_],
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_],
main[class^=admin_] .legacy_admin_page table.tbl_search,
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check,
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user,
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member,
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist {
  width: 100%;
  max-width: 900px;
  margin: 0 auto 24px;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  overflow: hidden;
}
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr > th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr > th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table.tbl_search tr > th,
main[class^=admins_] .legacy_admin_page table.tbl_search tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table.tbl_search tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr > th,
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr > th,
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr > th,
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr > td[class$=_th],
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr > th,
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr > td.tbl_check_all_lesson_th,
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr > th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr > th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table.tbl_search tr > th,
main[class^=admin_] .legacy_admin_page table.tbl_search tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table.tbl_search tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr > th,
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr > th,
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr > th,
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr > td[class$=_th],
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr > th,
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr > td.tbl_check_all_lesson_th,
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr > td[class$=_th] {
  width: 200px;
  background: var(--site_blue);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  padding: 12px 14px 12px 20px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #e0e0e0;
}
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table.tbl_search tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr > td:not([class$=_th]),
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table.tbl_search tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr > td:not([class$=_th]),
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr > td:not([class$=_th]) {
  background: #f5fbff;
  padding: 12px 16px;
  vertical-align: middle;
  border-bottom: 1px solid #e0e0e0;
}
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr:last-child > th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_check_] tr:last-child > td,
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr:last-child > th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_admin_] tr:last-child > td,
main[class^=admins_] .legacy_admin_page table.tbl_search tr:last-child > th,
main[class^=admins_] .legacy_admin_page table.tbl_search tr:last-child > td,
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr:last-child > th,
main[class^=admins_] .legacy_admin_page table.tbl_lesson_check tr:last-child > td,
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr:last-child > th,
main[class^=admins_] .legacy_admin_page table.tbl_lookup_user tr:last-child > td,
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr:last-child > th,
main[class^=admins_] .legacy_admin_page table.tbl_combine_company_member tr:last-child > td,
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr:last-child > th,
main[class^=admins_] .legacy_admin_page table.tbl_update_paymentlist tr:last-child > td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr:last-child > th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_check_] tr:last-child > td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr:last-child > th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_admin_] tr:last-child > td,
main[class^=admin_] .legacy_admin_page table.tbl_search tr:last-child > th,
main[class^=admin_] .legacy_admin_page table.tbl_search tr:last-child > td,
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr:last-child > th,
main[class^=admin_] .legacy_admin_page table.tbl_lesson_check tr:last-child > td,
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr:last-child > th,
main[class^=admin_] .legacy_admin_page table.tbl_lookup_user tr:last-child > td,
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr:last-child > th,
main[class^=admin_] .legacy_admin_page table.tbl_combine_company_member tr:last-child > td,
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr:last-child > th,
main[class^=admin_] .legacy_admin_page table.tbl_update_paymentlist tr:last-child > td {
  border-bottom: none;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 旧 result 系テーブル — 検索結果一覧 */
}
main[class^=admins_] .legacy_admin_page table[class*=result_list],
main[class^=admins_] .legacy_admin_page table[class*=payment_list],
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_],
main[class^=admins_] .legacy_admin_page table[class*=lesson_list],
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list],
main[class^=admin_] .legacy_admin_page table[class*=result_list],
main[class^=admin_] .legacy_admin_page table[class*=payment_list],
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_],
main[class^=admin_] .legacy_admin_page table[class*=lesson_list],
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: 13px;
  margin: 0 0 24px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  overflow: hidden;
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] th,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] th,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] th,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] th,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] th,
main[class^=admin_] .legacy_admin_page table[class*=result_list] th,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] th,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] th,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] th,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] th {
  background: var(--site_blue);
  color: #fff;
  font-weight: 700;
  padding: 10px 12px;
  text-align: center;
  white-space: nowrap;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] th:last-child,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] th:last-child,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] th:last-child,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] th:last-child,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] th:last-child,
main[class^=admin_] .legacy_admin_page table[class*=result_list] th:last-child,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] th:last-child,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] th:last-child,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] th:last-child,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] th:last-child {
  border-right: none;
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] td,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] td,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] td,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] td,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] td,
main[class^=admin_] .legacy_admin_page table[class*=result_list] td,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] td,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] td,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] td {
  padding: 9px 12px;
  border-bottom: 1px solid #ececec;
  text-align: center;
  vertical-align: middle;
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] tr:nth-child(even) td,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] tr:nth-child(even) td,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] tr:nth-child(even) td,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] tr:nth-child(even) td,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] tr:nth-child(even) td,
main[class^=admin_] .legacy_admin_page table[class*=result_list] tr:nth-child(even) td,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] tr:nth-child(even) td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] tr:nth-child(even) td,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] tr:nth-child(even) td,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] tr:nth-child(even) td {
  background: #f8fbff;
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] tr:hover td,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] tr:hover td,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] tr:hover td,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] tr:hover td,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] tr:hover td,
main[class^=admin_] .legacy_admin_page table[class*=result_list] tr:hover td,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] tr:hover td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] tr:hover td,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] tr:hover td,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] tr:hover td {
  background: #e8f1ff;
}
main[class^=admins_] .legacy_admin_page table[class*=result_list] tr:last-child td,
main[class^=admins_] .legacy_admin_page table[class*=payment_list] tr:last-child td,
main[class^=admins_] .legacy_admin_page table[class^=tbl_search_] tr:last-child td,
main[class^=admins_] .legacy_admin_page table[class*=lesson_list] tr:last-child td,
main[class^=admins_] .legacy_admin_page table[class*=evaluation_list] tr:last-child td,
main[class^=admin_] .legacy_admin_page table[class*=result_list] tr:last-child td,
main[class^=admin_] .legacy_admin_page table[class*=payment_list] tr:last-child td,
main[class^=admin_] .legacy_admin_page table[class^=tbl_search_] tr:last-child td,
main[class^=admin_] .legacy_admin_page table[class*=lesson_list] tr:last-child td,
main[class^=admin_] .legacy_admin_page table[class*=evaluation_list] tr:last-child td {
  border-bottom: none;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* テキスト入力 / 日付入力 */
}
main[class^=admins_] .legacy_admin_page input[type=text],
main[class^=admins_] .legacy_admin_page input[type=email],
main[class^=admins_] .legacy_admin_page input[type=password],
main[class^=admins_] .legacy_admin_page input[type=tel],
main[class^=admins_] .legacy_admin_page input[type=number],
main[class^=admins_] .legacy_admin_page input[type=date],
main[class^=admins_] .legacy_admin_page textarea,
main[class^=admin_] .legacy_admin_page input[type=text],
main[class^=admin_] .legacy_admin_page input[type=email],
main[class^=admin_] .legacy_admin_page input[type=password],
main[class^=admin_] .legacy_admin_page input[type=tel],
main[class^=admin_] .legacy_admin_page input[type=number],
main[class^=admin_] .legacy_admin_page input[type=date],
main[class^=admin_] .legacy_admin_page textarea {
  border: 1px solid #c9c9c9;
  background: #fff;
  border-radius: 5px;
  padding: 7px 10px;
  font-size: 13px;
  min-width: 200px;
  max-width: 100%;
  transition: border-color 0.15s, box-shadow 0.15s;
}
main[class^=admins_] .legacy_admin_page input[type=text]:focus,
main[class^=admins_] .legacy_admin_page input[type=email]:focus,
main[class^=admins_] .legacy_admin_page input[type=password]:focus,
main[class^=admins_] .legacy_admin_page input[type=tel]:focus,
main[class^=admins_] .legacy_admin_page input[type=number]:focus,
main[class^=admins_] .legacy_admin_page input[type=date]:focus,
main[class^=admins_] .legacy_admin_page textarea:focus,
main[class^=admin_] .legacy_admin_page input[type=text]:focus,
main[class^=admin_] .legacy_admin_page input[type=email]:focus,
main[class^=admin_] .legacy_admin_page input[type=password]:focus,
main[class^=admin_] .legacy_admin_page input[type=tel]:focus,
main[class^=admin_] .legacy_admin_page input[type=number]:focus,
main[class^=admin_] .legacy_admin_page input[type=date]:focus,
main[class^=admin_] .legacy_admin_page textarea:focus {
  outline: none;
  border-color: var(--site_blue);
  box-shadow: 0 0 0 3px rgba(0, 120, 215, 0.15);
}
main[class^=admins_] .legacy_admin_page select,
main[class^=admin_] .legacy_admin_page select {
  border: 1px solid #c9c9c9;
  background: #fff;
  border-radius: 5px;
  padding: 7px 10px;
  font-size: 13px;
}
main[class^=admins_] .legacy_admin_page select:focus,
main[class^=admin_] .legacy_admin_page select:focus {
  outline: none;
  border-color: var(--site_blue);
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* ボタン (旧 input[type="button"] / submit) */
}
main[class^=admins_] .legacy_admin_page input[type=button],
main[class^=admins_] .legacy_admin_page input[type=submit],
main[class^=admins_] .legacy_admin_page button[type=button],
main[class^=admins_] .legacy_admin_page button[type=submit],
main[class^=admin_] .legacy_admin_page input[type=button],
main[class^=admin_] .legacy_admin_page input[type=submit],
main[class^=admin_] .legacy_admin_page button[type=button],
main[class^=admin_] .legacy_admin_page button[type=submit] {
  min-width: 140px;
  height: 36px;
  padding: 0 18px;
  background: var(--site_blue);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  margin: 4px 4px 4px 0;
  transition: background 0.15s, transform 0.12s, box-shadow 0.15s;
}
main[class^=admins_] .legacy_admin_page input[type=button]:hover,
main[class^=admins_] .legacy_admin_page input[type=submit]:hover,
main[class^=admins_] .legacy_admin_page button[type=button]:hover,
main[class^=admins_] .legacy_admin_page button[type=submit]:hover,
main[class^=admin_] .legacy_admin_page input[type=button]:hover,
main[class^=admin_] .legacy_admin_page input[type=submit]:hover,
main[class^=admin_] .legacy_admin_page button[type=button]:hover,
main[class^=admin_] .legacy_admin_page button[type=submit]:hover {
  background: #005a9e;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}
main[class^=admins_] .legacy_admin_page input[type=button][disabled],
main[class^=admins_] .legacy_admin_page input[type=submit][disabled],
main[class^=admins_] .legacy_admin_page button[type=button][disabled],
main[class^=admins_] .legacy_admin_page button[type=submit][disabled],
main[class^=admin_] .legacy_admin_page input[type=button][disabled],
main[class^=admin_] .legacy_admin_page input[type=submit][disabled],
main[class^=admin_] .legacy_admin_page button[type=button][disabled],
main[class^=admin_] .legacy_admin_page button[type=submit][disabled] {
  background: #b0b0b0;
  cursor: not-allowed;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* ラジオ・チェックボックスのラベル */
}
main[class^=admins_] .legacy_admin_page label,
main[class^=admin_] .legacy_admin_page label {
  display: inline-flex;
  align-items: center;
  margin-right: 16px;
  cursor: pointer;
  font-size: 13px;
}
main[class^=admins_] .legacy_admin_page label input[type=radio],
main[class^=admins_] .legacy_admin_page label input[type=checkbox],
main[class^=admin_] .legacy_admin_page label input[type=radio],
main[class^=admin_] .legacy_admin_page label input[type=checkbox] {
  margin: 0 6px 0 0;
  cursor: pointer;
  min-width: 0;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 結果カウント表示 (■該当件数 / 全N件 など) */
}
main[class^=admins_] .legacy_admin_page .font_blue.font_weight600.font_120,
main[class^=admin_] .legacy_admin_page .font_blue.font_weight600.font_120 {
  display: inline-block;
  padding: 8px 16px;
  background: #f5fbff;
  border-radius: 4px;
  border-left: 3px solid var(--site_blue);
  margin: 16px 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--site_blue);
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* テーブル内リンクをピル化 */
}
main[class^=admins_] .legacy_admin_page table a:not(.no-pill),
main[class^=admin_] .legacy_admin_page table a:not(.no-pill) {
  display: inline-block;
  padding: 4px 10px;
  background: var(--site_blue);
  color: #fff !important;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.12s;
}
main[class^=admins_] .legacy_admin_page table a:not(.no-pill):hover,
main[class^=admin_] .legacy_admin_page table a:not(.no-pill):hover {
  background: #005a9e;
  text-decoration: none;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* 数の "件" や "円" などのテキスト的なリンクはピル化しない (br などの隣の数値) */
  /* float ヘルパーを flex に置換 */
}
main[class^=admins_] .legacy_admin_page .float_left,
main[class^=admin_] .legacy_admin_page .float_left {
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* page break */
}
main[class^=admins_] .legacy_admin_page br + br + br,
main[class^=admin_] .legacy_admin_page br + br + br {
  display: none;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* テーブル間のスペース調整 */
}
main[class^=admins_] .legacy_admin_page table + table,
main[class^=admin_] .legacy_admin_page table + table {
  margin-top: 24px;
}
main[class^=admins_] .legacy_admin_page,
main[class^=admin_] .legacy_admin_page {
  /* Stage D 修正(148): フィールド注意書き */
}
main[class^=admins_] .legacy_admin_page .field-hint,
main[class^=admin_] .legacy_admin_page .field-hint {
  margin: 6px 0 0;
  padding: 0;
  font-size: 11.5px;
  line-height: 1.5;
  color: #666;
  background: none;
  border: none;
}
main[class^=admins_] .legacy_admin_page .field-hint code,
main[class^=admin_] .legacy_admin_page .field-hint code {
  background: #f0f0f0;
  color: #c83a64;
  padding: 1px 5px;
  border-radius: 3px;
  font-family: Consolas, "Courier New", monospace;
  font-size: 11px;
}
main[class^=admins_],
main[class^=admin_] {
  /* Stage D 修正(148): admin-page__notice の list-dot-blue サポート (再掲) */
}
main[class^=admins_] .admin-page__notice .list-dot-blue,
main[class^=admin_] .admin-page__notice .list-dot-blue {
  list-style: none;
  padding: 0;
  margin: 0;
}
main[class^=admins_] .admin-page__notice .list-dot-blue li,
main[class^=admin_] .admin-page__notice .list-dot-blue li {
  padding-left: 18px;
  position: relative;
  font-size: 13px;
  line-height: 1.7;
  color: #444;
}
main[class^=admins_] .admin-page__notice .list-dot-blue li::before,
main[class^=admin_] .admin-page__notice .list-dot-blue li::before {
  position: absolute;
  top: 0.55em;
  left: 3px;
  content: "";
  width: 9px;
  height: 9px;
  background: url(../../img/v2/common/icon_circle_blue.svg) no-repeat;
  background-size: contain;
}