/* momotech HP 共通スタイル
   WordPress（SWELL）で作った本文のクラス名をそのまま使えるように、必要な分だけ再現している。 */

:root {
  --main: #597594;
  --main-dark: #43586f;
  --main-thin: #eef2f7;
  --htag: #31af42;
  --text: #333;
  --link: #597594;
  --bg: #f7f9ff;
  --white: #fff;
  --border: #dde3ea;
  --deep01: #e44141;
  --deep02: #3d79d5;
  --deep03: #63a84d;
  --deep04: #e5c24e;
  --pale01: #fff2f0;
  --pale02: #f3f8fd;
  --pale03: #f1f9ee;
  --pale04: #fdf9ee;
  --mark-blue: #b7e3ff;
  --mark-green: #bdf9c3;
  --mark-orange: #ffddbc;
  --mark-yellow: #fcf69f;
  --fz-xs: .75em;
  --fz-s: .9em;
  --fz-m: 1.1em;
  --fz-l: 1.25em;
  --fz-xl: 1.6em;
  --container: 1000px;
  --article: 900px;
  --radius: 6px;
}

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

html { font-size: 15px; scroll-behavior: smooth; scroll-padding-top: 80px; }
@media (min-width: 600px) { html { font-size: 16px; } }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "游ゴシック体", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  font-weight: 500;
  line-height: 1.8;
  overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%;
}

a { color: var(--link); }
img, video { max-width: 100%; height: auto; }
figure { margin: 0 0 2em; }
table { border-collapse: collapse; }

.l-container { max-width: var(--container); margin: 0 auto; padding: 0 16px; }

/* ---------- PC / スマホの出し分け（SWELL と同じ 960px 境界） ---------- */
@media (max-width: 959px) { .pc_only, .pc_ { display: none !important; } }
@media (min-width: 960px) { .sp_only, .sp_ { display: none !important; } }

/* ---------- ヘッダー ---------- */
/* 青い帯（キャッチコピー）はスクロールで消え、ロゴとメニューだけ上に残る */
.site-catch { background: var(--main); color: #fff; font-size: .8rem; padding: 2px 0; }
.site-header { background: #fdfdfd; box-shadow: 0 1px 4px rgba(0,0,0,.08); position: sticky; top: 0; z-index: 50; }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; }
.site-header__logo { margin: 0; line-height: 0; flex: 0 1 auto; }
.site-header__logo img { max-height: 44px; width: auto; }
.gnav ul { display: flex; list-style: none; margin: 0; padding: 0; }
.gnav a { display: block; padding: 18px 14px; color: var(--text); text-decoration: none; font-size: .95rem; white-space: nowrap; }
.gnav a:hover { color: var(--main); }
.menu-btn { display: none; background: none; border: 0; padding: 8px; cursor: pointer; color: var(--text); font: inherit; font-size: .75rem; line-height: 1.2; }
.menu-btn__bar { display: block; width: 26px; height: 2px; margin: 5px auto; background: currentColor; }
@media (max-width: 959px) {
  .site-catch { display: none; }
  .site-header__inner { min-height: 56px; }
  .site-header__logo img { max-height: 32px; }
  .menu-btn { display: block; }
  .gnav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; box-shadow: 0 6px 12px rgba(0,0,0,.12); }
  .gnav.is-open { display: block; }
  .gnav ul { flex-direction: column; }
  .gnav li + li { border-top: 1px solid var(--border); }
  .gnav a { padding: 14px 20px; }
}

/* ---------- メニュー「コース」のプルダウン（PC はマウスを置くと開く／スマホのメニューでは下に並べて出す） ---------- */
.gnav__has-sub { position: relative; }
.gnav__has-sub > a::after { content: ""; display: inline-block; width: .4em; height: .4em; margin-left: .45em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-.25em) rotate(45deg); }
.gnav .gnav__sub { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); flex-direction: column; min-width: 15em; padding: .5em 0; background: #fff; border-radius: var(--radius); box-shadow: 0 6px 16px rgba(0,0,0,.14); z-index: 10; }
.gnav__has-sub:hover > .gnav__sub, .gnav__has-sub:focus-within > .gnav__sub { display: flex; }
.gnav .gnav__sub a { padding: .6em 1.2em; font-size: .9rem; }
.gnav .gnav__sub a:hover { background: var(--main-thin); }
.gnav__soon { display: block; padding: .6em 1.2em; font-size: .9rem; color: #999; white-space: nowrap; }
@media (max-width: 959px) {
  .gnav { max-height: calc(100vh - 56px); overflow-y: auto; }
  .gnav__has-sub > a::after { display: none; }
  .gnav .gnav__sub { display: flex; position: static; transform: none; min-width: 0; padding: 0; border-radius: 0; box-shadow: none; background: var(--bg); }
  .gnav .gnav__sub li { border-top: 1px solid var(--border); }
  .gnav .gnav__sub a, .gnav__soon { padding: 12px 20px 12px 36px; }
  .gnav .gnav__sub a::before { content: "– "; }
}

/* ---------- メインビジュアル（トップのスライド） ---------- */
.mv { margin-bottom: 2em; }
.mv__inner { position: relative; }
.mv__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.mv__track::-webkit-scrollbar { display: none; }
.mv__slide { flex: 0 0 100%; scroll-snap-align: start; line-height: 0; }
.mv__slide img { width: 100%; height: auto; }
.mv__dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; }
.mv__dot { width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; background: rgba(255,255,255,.6); box-shadow: 0 0 2px rgba(0,0,0,.4); cursor: pointer; }
.mv__dot[aria-current="true"] { background: var(--main); }

/* ---------- 本文エリア ---------- */
.site-main { padding: 2em 0 4em; }
.site-main > .l-container { max-width: var(--article); }
.page-title { font-size: 1.6rem; line-height: 1.4; margin: 0 0 1.5em; padding-bottom: .5em; border-bottom: 2px solid var(--main); }
.post-head { margin-bottom: 2em; }
.post-head .page-title { margin-bottom: .3em; }
.post-head time { color: #777; font-size: .9rem; }
.post-foot { margin-top: 3em; padding-top: 1em; border-top: 1px solid var(--border); font-size: .9rem; color: #666; }
.post-foot .cat { display: inline-block; background: var(--main); color: #fff; padding: 0 .6em; border-radius: 3px; margin-right: .4em; font-size: .85em; }

.post_content > * { margin-top: 0; }
.post_content p { margin: 0 0 1.6em; }
.post_content ul, .post_content ol { margin: 0 0 1.6em; padding-left: 1.5em; }
.post_content li { margin-bottom: .3em; }
.post_content h2, .post_content h3, .post_content h4 { line-height: 1.5; }
.post_content h2 { margin: 3em 0 1.2em; padding: .6em .9em; background: var(--htag); color: #fff; border-radius: 2px; font-size: 1.35rem; }
.post_content h3 { margin: 2.5em 0 1em; padding: 0 0 .4em .2em; border-bottom: 2px solid var(--htag); font-size: 1.2rem; }
.post_content h4 { margin: 2em 0 .8em; padding-left: .6em; border-left: 3px solid var(--htag); font-size: 1.05rem; }
.post_content h2:first-child, .post_content h3:first-child { margin-top: 0; }

/* SWELL と同じく、見出しの種類（h1〜h4）に関係なく中央寄せ・飾りなし */
.post_content .is-style-section_ttl { background: none; color: var(--text); border: 0; border-radius: 0; padding: 0; text-align: center; position: relative; }
.post_content h2.is-style-section_ttl,
.post_content h3.is-style-section_ttl { font-size: 1.5rem; }
.post_content .is-style-section_ttl.has-text-align-left { text-align: left; }
.post_content .is-style-section_ttl.has-text-align-right { text-align: right; }

/* ---------- 文字サイズ・色・余白（SWELL のユーティリティ） ---------- */
.u-fz-xs, .has-xs-font-size { font-size: var(--fz-xs) !important; }
.u-fz-s, .has-small-font-size { font-size: var(--fz-s) !important; }
.has-medium-font-size { font-size: var(--fz-m) !important; }
.u-fz-l, .has-large-font-size { font-size: var(--fz-l) !important; }
.u-fz-xl, .has-huge-font-size { font-size: var(--fz-xl) !important; }
.u-thin { opacity: .8; }

.has-text-align-center { text-align: center; }
.has-text-align-left { text-align: left; }
.has-text-align-right { text-align: right; }

.has-swl-main-color, .u-col-main { color: var(--main) !important; }
.has-swl-deep-01-color { color: var(--deep01) !important; }
.has-swl-deep-02-color { color: var(--deep02) !important; }
.has-swl-deep-03-color { color: var(--deep03) !important; }
.has-swl-deep-04-color { color: var(--deep04) !important; }
.has-white-color { color: #fff !important; }
.has-black-color { color: #000 !important; }
.has-swl-main-background-color, .u-bg-main { background-color: var(--main) !important; color: #fff; }
.has-swl-main-thin-background-color { background-color: var(--main-thin) !important; }
.has-swl-deep-04-background-color { background-color: var(--deep04) !important; }
p.has-background { padding: 1em 1.4em; border-radius: var(--radius); }
.has-border { border: 1px solid var(--border); padding: 1em 1.4em; border-radius: var(--radius); }

.u-mb-0 { margin-bottom: 0 !important; }
.u-mb-5 { margin-bottom: .5em !important; }
.u-mb-10 { margin-bottom: 1em !important; }
.u-mb-20 { margin-bottom: 2em !important; }
.u-mb-30 { margin-bottom: 3em !important; }
.u-mb-40 { margin-bottom: 4em !important; }
.u-mb-50 { margin-bottom: 5em !important; }
.u-mb-60 { margin-bottom: 6em !important; }

.swl-marker { padding: 0 .1em; }
.mark_yellow { background: linear-gradient(transparent 60%, var(--mark-yellow) 60%); }
.mark_orange { background: linear-gradient(transparent 60%, var(--mark-orange) 60%); }
.mark_green { background: linear-gradient(transparent 60%, var(--mark-green) 60%); }
.mark_blue { background: linear-gradient(transparent 60%, var(--mark-blue) 60%); }

/* ---------- 画像・動画・埋め込み ---------- */
.wp-block-image { margin: 0 0 2em; }
.wp-block-image { text-align: center; }
.wp-block-image img { display: block; margin-left: auto; margin-right: auto; border-radius: 2px; }
.wp-block-image.aligncenter, .wp-block-image .aligncenter { margin-left: auto; margin-right: auto; text-align: center; }
.wp-block-image.aligncenter img, .wp-block-image .aligncenter img { margin: 0 auto; }
.wp-block-image figcaption, .wp-element-caption { font-size: .85em; color: #666; text-align: center; margin-top: .4em; }
.wp-block-image.is-style-shadow img { box-shadow: 0 2px 8px rgba(0,0,0,.2); }
.u-obf-cover img { object-fit: cover; }
.wp-block-video video { width: 100%; }
.post_content iframe { display: block; margin: 0 auto 2em; max-width: 100%; }
.wp-block-embed { margin: 0 0 2em; }
.wp-block-embed iframe { display: block; width: 100%; max-width: 100%; border: 0; margin-bottom: 0; }
.wp-embed-aspect-16-9 iframe { aspect-ratio: 16 / 9; height: auto; }
.wp-embed-aspect-4-3 iframe { aspect-ratio: 4 / 3; height: auto; }
.wp-embed-aspect-9-16 iframe { aspect-ratio: 9 / 16; height: auto; max-width: 360px; margin: 0 auto; }
.wp-block-gallery { display: flex; flex-wrap: wrap; gap: .8em; }
.wp-block-gallery .wp-block-image { flex: 1 1 calc(50% - .8em); margin: 0; }
.wp-block-spacer { clear: both; }
.wp-block-separator { border: 0; border-top: 1px solid var(--border); margin: 2.5em 0; }

/* ---------- 表 ---------- */
.wp-block-table { overflow-x: auto; }
.wp-block-table table { width: 100%; background: #fff; }
.wp-block-table td, .wp-block-table th { border: 1px solid var(--border); padding: .7em 1em; vertical-align: top; }
.wp-block-table th { background: var(--main-thin); }
.wp-block-table.is-style-simple td:first-child { white-space: nowrap; background: var(--main-thin); font-weight: 700; width: 30%; }
.wp-block-table.is-style-stripes tr:nth-child(odd) td { background: var(--pale02); }
@media (max-width: 599px) { .wp-block-table.is-style-simple td:first-child { white-space: normal; } }

/* ---------- 段組み ---------- */
.wp-block-columns { display: flex; flex-wrap: wrap; gap: 1.5em; margin-bottom: 2em; }
.wp-block-column { flex: 1 1 0; min-width: 0; }
@media (max-width: 781px) { .wp-block-column { flex-basis: 100%; } }

/* 列の幅・間隔は SWELL と同じ仕組み（初期値：スマホ1列・タブレット/PC 2列。HTML 側の --clmn-w--* / --swl-clmn-mrgn--* で上書き） */
.swell-block-columns { --swl-clmn-mrgn--x: 1.5rem; --swl-clmn-mrgn--y: 1.5rem; margin-bottom: 2em; }
.swell-block-columns__inner { display: flex; flex-wrap: wrap; margin-left: calc(var(--swl-clmn-mrgn--x) * -1); row-gap: var(--swl-clmn-mrgn--y); }
.swell-block-column { --clmn-w: var(--clmn-w--mobile, 100%); flex: 0 0 auto; width: calc(var(--clmn-w) - var(--swl-clmn-mrgn--x)); margin-left: var(--swl-clmn-mrgn--x); }
.swell-block-column > * { margin-bottom: 1em; }
@media (min-width: 600px) { .swell-block-column { --clmn-w: var(--clmn-w--tab, 50%); } }
@media (min-width: 960px) { .swell-block-column { --clmn-w: var(--clmn-w--pc, 50%); } }
.swell-block-columns[data-scrollable="1"] .swell-block-columns__inner { flex-wrap: nowrap; overflow-x: auto; margin-left: 0; scroll-snap-type: x mandatory; padding-bottom: 16px; }
.swell-block-columns[data-scrollable="1"] .swell-block-column { flex-shrink: 0; width: var(--clmn-w); scroll-snap-align: start; }
.swell-block-columns[data-scrollable="1"] .swell-block-column:first-child { margin-left: 0; }
.swell-block-columns.is-style-clmn-border .swell-block-column { border: 1px solid var(--border); }
.swell-block-columns.is-style-clmn-shadow .swell-block-column { background: #fff; box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 4px 4px -4px rgba(0,0,0,.1); }
.swell-block-columns.is-style-clmn-shadow[data-scrollable="1"] .swell-block-columns__inner { padding: 4px 4px 20px; }
.c-scrollHint { text-align: right; font-size: .8em; color: #888; margin-bottom: .3em; }
.c-scrollHint i::before { content: "→"; font-style: normal; }
@media (min-width: 960px) { .c-scrollHint { display: none; } }

/* ---------- メディアと文章 ---------- */
.wp-block-media-text { display: grid; grid-template-columns: 50% 1fr; align-items: center; gap: 1.5em; margin-bottom: 2em; }
.wp-block-media-text.has-media-on-the-right { grid-template-columns: 1fr 50%; }
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media { order: 2; }
.wp-block-media-text__media img { width: 100%; display: block; }
.wp-block-media-text__content > :last-child { margin-bottom: 0; }
.wp-block-media-text.is-style-card { background: #fff; padding: 1.2em; border-radius: var(--radius); box-shadow: 0 2px 8px rgba(0,0,0,.08); }
@media (max-width: 599px) {
  .wp-block-media-text.is-stacked-on-mobile { grid-template-columns: 100% !important; }
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media { order: 0; }
}

/* ---------- ボタン ---------- */
/* 色は WordPress（SWELL）の設定と同じ：「赤」ボタン＝オレンジのグラデーション */
.swell-block-button { --btn: var(--main); --btn2: var(--main); margin-bottom: 2em; text-align: center; }
.swell-block-button.red_ { --btn: #f38f1e; --btn2: #ffce84; }
.swell-block-button.blue_ { --btn: #849cba; --btn2: #2a6bba; }
.swell-block-button.green_ { --btn: #62d847; --btn2: #7bf7bd; }
.swell-block-button[style*="--the-fz"] { font-size: var(--the-fz); }
.swell-block-button[data-align="left"] { text-align: left; }
.swell-block-button[data-align="right"] { text-align: right; }
.swell-block-button__link { position: relative; overflow: hidden; display: inline-block; min-width: 50%; padding: .8em 1.6em; border-radius: 80px; background: linear-gradient(100deg, var(--btn) 0%, var(--btn2) 100%); color: #fff; text-decoration: none; font-weight: 700; line-height: 1.5; box-shadow: 0 2px 4px rgba(0,0,0,.15); transition: opacity .2s, transform .2s; }
.swell-block-button__link:hover { opacity: .85; transform: translateY(-1px); }
.swell-block-button__link .__icon { vertical-align: -.15em; margin-right: .5em; fill: currentColor; }
.swell-block-button.-size-s .swell-block-button__link { min-width: 0; padding: .4em 1.4em; font-size: .9em; }
.swell-block-button.-size-l .swell-block-button__link { min-width: 80%; padding: 1em 2em; font-size: 1.1em; }
.swell-block-button.is-style-btn_line .swell-block-button__link { background: #fff; color: var(--btn); border: 1px solid var(--btn); box-shadow: none; }
/* キラッと光る演出（SWELL の「キラッと」スタイルと同じ動き） */
.swell-block-button.is-style-btn_shiny .swell-block-button__link::after { content: ""; position: absolute; top: 0; left: -100px; width: 50px; height: 100%; background-image: linear-gradient(100deg, rgba(255,255,255,0), #fff); animation: shiny_btn 3s ease-in-out infinite; }
@keyframes shiny_btn {
  0%, 84% { opacity: 0; transform: scale(0) rotate(25deg); }
  85% { opacity: .9; transform: scale(1) rotate(25deg); }
  100% { opacity: 0; transform: scale(50) rotate(25deg); }
}
@media (prefers-reduced-motion: reduce) { .swell-block-button.is-style-btn_shiny .swell-block-button__link::after { animation: none; opacity: 0; } }
@media (max-width: 599px) { .swell-block-button__link { min-width: 80%; } }
.swell-block-button[style*="--the-width"] .swell-block-button__link { width: var(--the-width); min-width: 0; }
@media (max-width: 599px) { .swell-block-button[style*="--the-width"] .swell-block-button__link { width: 90%; } }
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: .8em; margin-bottom: 2em; }
.wp-block-button__link { display: inline-block; padding: .6em 1.4em; border-radius: 80px; background: var(--main); color: #fff; text-decoration: none; }

/* ---------- 囲み枠（キャプションボックス・グループのスタイル） ---------- */
.cap_box { margin-bottom: 2em; }
.cap_box_ttl { background: var(--main); color: #fff; padding: .4em 1em; border-radius: var(--radius) var(--radius) 0 0; font-weight: 700; text-align: center; }
.cap_box_content { background: #fff; border: 2px solid var(--main); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); padding: 1.2em; }
.cap_box_content > :last-child { margin-bottom: 0; }
.cap_box.is-style-onborder_ttl .cap_box_ttl { display: inline-block; margin-left: 1em; border-radius: var(--radius); position: relative; z-index: 1; margin-bottom: -.9em; }
.cap_box.is-style-onborder_ttl .cap_box_content { border-top: 2px solid var(--main); border-radius: var(--radius); padding-top: 1.6em; }

.is-style-big_icon_point, .is-style-big_icon_check, .is-style-big_icon_good, .is-style-big_icon_caution,
.is-style-big_icon_hatena, .is-style-big_icon_memo, .is-style-icon_announce, .is-style-border_left,
.is-style-kakko_box, .is-style-big_kakko_box, .is-style-dent_box, .is-style-sticky_box, .is-style-outline,
.is-style-outline--2 {
  margin-bottom: 2em; padding: 1.2em 1.4em; border-radius: var(--radius); background: #fff;
}
.is-style-big_icon_point { border: 2px solid var(--deep04); background: var(--pale04); }
.is-style-big_icon_check, .is-style-big_icon_good { border: 2px solid var(--deep03); background: var(--pale03); }
.is-style-big_icon_caution { border: 2px solid var(--deep01); background: var(--pale01); }
.is-style-big_icon_hatena, .is-style-big_icon_memo, .is-style-icon_announce { border: 2px solid var(--deep02); background: var(--pale02); }
.is-style-big_icon_point::before, .is-style-big_icon_check::before, .is-style-big_icon_good::before,
.is-style-big_icon_caution::before, .is-style-big_icon_hatena::before, .is-style-big_icon_memo::before {
  display: block; font-weight: 700; margin-bottom: .4em;
}
.is-style-big_icon_point::before { content: "POINT"; color: #b8901e; }
.is-style-big_icon_check::before { content: "✔ CHECK"; color: var(--deep03); }
.is-style-big_icon_good::before { content: "◎ GOOD"; color: var(--deep03); }
.is-style-big_icon_caution::before { content: "⚠ 注意"; color: var(--deep01); }
.is-style-big_icon_hatena::before { content: "？ Q"; color: var(--deep02); }
.is-style-big_icon_memo::before { content: "MEMO"; color: var(--deep02); }
.is-style-border_left { border-left: 4px solid var(--main); background: var(--main-thin); border-radius: 0; }
.is-style-kakko_box, .is-style-big_kakko_box { border: 2px solid var(--main); }
.is-style-dent_box { background: var(--main-thin); box-shadow: inset 0 1px 4px rgba(0,0,0,.08); }
.is-style-sticky_box { background: var(--pale04); border-left: 6px solid var(--deep04); border-radius: 0; }
.is-style-outline, .is-style-outline--2 { border: 1px dashed var(--main); }
[class*="is-style-"] > :last-child { margin-bottom: 0; }

/* ---------- ステップ ---------- */
.swell-block-step { counter-reset: step; margin-bottom: 2em; }
.swell-block-step__item { counter-increment: step; position: relative; padding: 0 0 2em 4.2em; }
.swell-block-step__item::before { content: ""; position: absolute; left: 1.6em; top: 3.2em; bottom: .4em; border-left: 2px dashed var(--border); }
.swell-block-step__item:last-child::before { display: none; }
.swell-block-step__number { position: absolute; left: 0; top: 0; width: 3.4em; height: 3.4em; border-radius: 50%; background: var(--main); color: #fff !important; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.1; font-size: .9em; font-weight: 700; }
.swell-block-step__number .__label { font-size: .65em; }
.swell-block-step__number::after { content: counter(step); font-size: 1.3em; }
.swell-block-step__title { font-weight: 700; margin-bottom: .6em; padding-top: .6em; }
.swell-block-step__body > :last-child { margin-bottom: 0; }

/* ---------- アコーディオン（開閉） ---------- */
.swell-block-accordion { margin-bottom: 2em; }
.swell-block-accordion__item { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: .8em; }
.swell-block-accordion__title { display: flex; align-items: center; justify-content: space-between; gap: 1em; padding: .8em 1em; cursor: pointer; list-style: none; font-weight: 700; }
.swell-block-accordion__title::-webkit-details-marker { display: none; }
.swell-block-accordion__icon { flex: 0 0 auto; width: 1.6em; height: 1.6em; border-radius: 50%; background: var(--main); position: relative; }
.swell-block-accordion__icon::before { content: ""; position: absolute; left: 50%; top: 45%; width: .45em; height: .45em; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: translate(-50%, -50%) rotate(45deg); transition: transform .2s; }
.swell-block-accordion__item[open] .swell-block-accordion__icon::before { transform: translate(-50%, -20%) rotate(-135deg); }
.swell-block-accordion__icon i { display: none; }
.swell-block-accordion__body { padding: 0 1em 1em; border-top: 1px dashed var(--border); padding-top: 1em; }
.swell-block-accordion__body > :last-child { margin-bottom: 0; }

.wp-block-details { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: .8em 1em; margin-bottom: 1em; }
.wp-block-details summary { cursor: pointer; font-weight: 700; }

/* ---------- リンクリスト ---------- */
.swell-block-linkList { list-style: none; padding: 0 !important; margin-bottom: 2em; }
.swell-block-linkList__item { margin-bottom: .6em; }
.swell-block-linkList__link { display: flex; align-items: center; gap: .5em; text-decoration: none; color: var(--text); }
.swell-block-linkList__link::before { content: "›"; flex: 0 0 auto; width: 1.3em; height: 1.3em; line-height: 1.2; border-radius: 50%; background: var(--main); color: #fff; text-align: center; font-weight: 700; }
.swell-block-linkList__link:hover .swell-block-linkList__text { text-decoration: underline; }
.swell-block-linkList__icon { display: none; }

/* ---------- 吹き出し（Liquid Speech Balloon） ---------- */
.liquid-speech-balloon-wrap { display: flex; align-items: flex-start; gap: 1em; margin-bottom: 2em; }
.liquid-speech-balloon-wrap.liquid-speech-balloon-right { flex-direction: row-reverse; }
.liquid-speech-balloon-avatar { flex: 0 0 64px; height: 64px; border-radius: 50%; background: #ddd center / cover no-repeat; }
.liquid-speech-balloon-00 .liquid-speech-balloon-avatar { background-image: url("/wp-content/uploads/2024/01/1f9820d2152d8e9bcc962b8600ef019d.png"); }
.liquid-speech-balloon-text { position: relative; background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: .8em 1.1em; flex: 1 1 auto; }
.liquid-speech-balloon-square .liquid-speech-balloon-avatar { border-radius: 6px; }
.liquid-speech-balloon-text > :last-child { margin-bottom: 0; }
.liquid-speech-balloon-arrow { display: none; }

/* ---------- 吹き出し（SWELL の吹き出しブロック。色は今のサイトの設定と同じ） ---------- */
.c-balloon { display: flex; position: relative; }
.c-balloon.-bln-right { flex-direction: row-reverse; }
.c-balloon__icon { flex-shrink: 0; width: 60px; text-align: center; }
.c-balloon .c-balloon__iconImg { display: block; width: 60px; height: 60px; margin: 0 auto; object-fit: cover; }
.c-balloon__icon.-circle .c-balloon__iconImg { border: 2px solid #ececec; border-radius: 50%; }
.c-balloon__body { display: flex; align-items: flex-start; flex-basis: 100%; padding: 4px 24px; }
.-bln-right .c-balloon__body { justify-content: flex-end; }
.c-balloon__text { position: relative; max-width: 560px; padding: 1em; border-radius: 8px; color: #333; line-height: 1.6; background: #f7f7f7; border-color: #ccc; }
.-border-on .c-balloon__text { border-style: solid; border-width: 1px; }
.c-balloon .c-balloon__text > p { margin: 0; }
.c-balloon__shapes { position: absolute; top: 16px; left: 0; width: 0; height: 0; z-index: 1; border-color: inherit; }
.-bln-right .c-balloon__shapes { left: auto; right: 0; transform: rotateY(180deg); }
.c-balloon__before, .c-balloon__after { position: absolute; top: 0; left: -10px; display: block; width: 0; height: 0; border-style: solid; border-color: transparent; border-width: 8px 10px 8px 0; }
.c-balloon__before { z-index: 3; border-right-color: #f7f7f7; }
.-border-on .c-balloon__before { left: -8px; }
.c-balloon__after { z-index: 2; border-right-color: inherit; }
.-border-none .c-balloon__after { display: none; }
[data-col="red"] .c-balloon__text { background: #ffebeb; border-color: #f48789; }
[data-col="red"] .c-balloon__before { border-right-color: #ffebeb; }
[data-col="blue"] .c-balloon__text { background: #e2f6ff; border-color: #93d2f0; }
[data-col="blue"] .c-balloon__before { border-right-color: #e2f6ff; }
[data-col="green"] .c-balloon__text { background: #d1f8c2; border-color: #9ddd93; }
[data-col="green"] .c-balloon__before { border-right-color: #d1f8c2; }
[data-col="yellow"] .c-balloon__text { background: #f9f7d2; border-color: #fbe593; }
[data-col="yellow"] .c-balloon__before { border-right-color: #f9f7d2; }
@media (min-width: 600px) {
  .c-balloon__icon { width: 80px; }
  .c-balloon .c-balloon__iconImg { width: 80px; height: 80px; }
  .c-balloon__body { padding: 8px 24px; }
}

/* ---------- 先生紹介（Team Members プラグインのカード。写真は HTML の style に書いてある画像。
   2026/10/27 写真はカードの中（上の青い線の下）に置く。元のプラグインは写真を線の上にはみ出させていた） ---------- */
.tmm .tmm_wrap { width: 100%; margin-bottom: 30px; text-align: center; }
.tmm .tmm_container { display: inline; }
.tmm .tmm_container:last-child { display: block; text-align: center !important; }
.tmm .tmm_container:last-child .tmm_member { float: none !important; }
.tmm .tmm_columns_containers_desktop { display: block; clear: both; }
.tmm .tmm_member { position: relative; display: inline-block; float: left; vertical-align: top; text-align: center; margin: 25px 0; background: #fff; border: 1px solid #eee; border-top: 5px solid lightgrey; border-bottom: 5px solid whitesmoke; box-shadow: 3px 0 5px 0 rgba(0,0,0,.04); }
.tmm .tmm_1_columns .tmm_member { width: 96%; margin: 25px 2%; }
.tmm .tmm_2_columns .tmm_member { width: 42%; margin: 25px 4%; }
.tmm .tmm_member .tmm_photo { width: 60%; padding-bottom: 60%; margin: 16px auto 0; background-size: cover !important; background-position: center center !important; border: 6px solid #eee; border-radius: 34% !important; box-shadow: 2px 0 1px 0 rgba(0,0,0,.05); }
.tmm .tmm_1_columns .tmm_member .tmm_photo { width: 35%; padding-bottom: 35%; }
.tmm .tmm_2_columns .tmm_member .tmm_photo { width: 50%; padding-bottom: 50%; }
.tmm .tmm_member .tmm_textblock { padding: 10px 12px; }
.tmm .tmm_names { color: #222; margin: 10px 0 8px; }
.tmm .tmm_plugin_f .tmm_names { font-size: 20px; line-height: 24px; }
.tmm .tmm_theme_f .tmm_names { font-size: 1.1em; }
.tmm .tmm_desc { margin: 19px 0 10px; padding: 0; color: #555; word-break: break-word; }
.tmm .tmm_desc p { margin: 0; color: #555; }
.tmm .tmm_desc h1 { font-size: 1.6em; line-height: 1.4; margin: 0 0 .3em; color: var(--text); }
.tmm .tmm_plugin_f .tmm_desc { font-size: 14px; line-height: 23px; }
.tmm .tmm_theme_f .tmm_desc { font-size: .9em; line-height: 1.65; margin-top: 16px; }
.tmm .tmm_theme_f .tmm_names { display: none; } /* PC 版は名前の欄が空（全角スペースだけ）で、名前は本文の見出しに書いてある */
@media (max-width: 1025px) {
  .tmm .tmm_columns_containers_desktop { display: none; }
  .tmm .tmm_two_containers_tablet { display: block; clear: both; }
  .tmm .tmm_member, .tmm .tmm_2_columns .tmm_member { width: 40%; margin: 25px 5%; }
  .tmm .tmm_member .tmm_photo, .tmm .tmm_1_columns .tmm_member .tmm_photo, .tmm .tmm_2_columns .tmm_member .tmm_photo { width: 50%; padding-bottom: 50%; }
}
@media (max-width: 640px) {
  .tmm .tmm_member, .tmm .tmm_1_columns .tmm_member, .tmm .tmm_2_columns .tmm_member { width: 96%; margin: 20px 2%; }
  .tmm .tmm_member .tmm_photo, .tmm .tmm_1_columns .tmm_member .tmm_photo, .tmm .tmm_2_columns .tmm_member .tmm_photo { width: 45%; padding-bottom: 45%; }
  .tmm .tmm_plugin_f .tmm_desc { padding: 0 10px; font-size: 16px; line-height: 27px; }
}

/* ---------- コード（Highlighting Code Block） ---------- */
.hcb_wrap { position: relative; margin-bottom: 2em; }
.hcb_wrap pre { margin: 0; padding: 2.2em 1.2em 1.2em; background: #2b303b; color: #e6e6e6; border-radius: var(--radius); overflow-x: auto; font-size: .9em; line-height: 1.7; }
.hcb_wrap pre::before { content: attr(data-lang); position: absolute; top: 0; left: 0; padding: .1em .8em; background: #4b5363; color: #fff; font-size: .75em; border-radius: var(--radius) 0 var(--radius) 0; }
.hcb_wrap code, .post_content pre code { font-family: Menlo, Consolas, "Courier New", monospace; }
.post_content code:not(pre code) { background: #f1f1f1; padding: .1em .4em; border-radius: 3px; font-size: .9em; }

/* ---------- お問い合わせ（旧 /contact/ のフォームの代わりの案内） ---------- */
.form-pending { background: #fff; border: 2px dashed var(--main); border-radius: var(--radius); padding: 1.5em; text-align: center; margin-bottom: 2em; }

/* ---------- 新HPで作ったページ（/app-school/・/programming-course/・/certification-course/）
   lp- は3ページ共通、app- はアプリ開発コース、course- はコースのまとめページ ---------- */
.lp-hero { text-align: center; padding: 2.5em 1.2em 2em; margin-bottom: 2em; border-radius: 12px; background: linear-gradient(135deg, var(--pale02) 0%, #fff 55%, var(--pale04) 100%); border: 1px solid var(--border); }
.post_content .lp-hero__label { display: inline-block; margin: 0 0 1em; padding: .2em 1em; border-radius: 80px; background: var(--main); color: #fff; font-size: .9rem; font-weight: 700; }
.lp-hero__title { margin: 0 0 .8em; font-size: 2rem; line-height: 1.4; color: var(--main-dark); }
.post_content .lp-hero__text { max-width: 40em; margin: 0 auto; text-align: left; }
@media (max-width: 599px) { .lp-hero__title { font-size: 1.6rem; } }

.post_content .lp-note { text-align: center; }
.app-works { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5em; margin-bottom: 3em; }
.app-work { display: flex; gap: 1em; align-items: flex-start; background: #fff; border-radius: 12px; padding: 1.4em; box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.06); }
.app-work__icon { flex: 0 0 88px; width: 88px; height: 88px; border-radius: 22%; box-shadow: 0 1px 3px rgba(0,0,0,.2); }
.app-work__body { flex: 1 1 auto; min-width: 0; }
.post_content .app-work__cat { display: inline-block; margin: 0 0 .3em; padding: 0 .6em; border-radius: 3px; background: var(--main-thin); color: var(--main-dark); font-size: .8rem; }
.post_content .app-work__name { margin: 0 0 .5em; padding: 0; border: 0; font-size: 1.15rem; }
.post_content .app-work__text { margin: 0 0 1em; font-size: .95rem; }
.app-work__btn { display: inline-block; padding: .45em 1.3em; border-radius: 80px; background: #111; color: #fff; text-decoration: none; font-size: .9rem; font-weight: 700; transition: opacity .2s; }
.app-work__btn:hover { opacity: .8; }
.post_content .app-work__soon { display: inline-block; margin: 0; padding: .45em 1.3em; border-radius: 80px; border: 1px dashed var(--main); color: var(--main); font-size: .9rem; font-weight: 700; }
.app-work__movie { display: block; width: 100%; max-width: 230px; aspect-ratio: 9 / 16; height: auto; margin: 0 0 .4em; border-radius: 12px; background: #000; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.post_content .app-work__movie-note { margin: 0 0 1em; color: var(--muted, #6b7684); font-size: .82rem; }
@media (max-width: 599px) {
  .app-work { padding: 1.2em 1em; }
  .app-work__icon { flex-basis: 64px; width: 64px; height: 64px; }
  .app-work__movie { max-width: 190px; }
}

.app-points { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1em; margin-bottom: 3em; }
@media (max-width: 599px) { .app-points { grid-template-columns: 1fr; } }
.app-point { background: #fff; border-radius: var(--radius); border-top: 4px solid var(--htag); padding: 1.2em; box-shadow: 0 2px 4px rgba(0,0,0,.05); }
.post_content .app-point__ttl { margin: 0 0 .5em; padding: 0; border: 0; font-size: 1.05rem; color: var(--main-dark); }
.post_content .app-point p { margin: 0; font-size: .95rem; }

.post_content .app-steps { list-style: none; padding: 0; margin: 0 0 3em; counter-reset: none; }
.post_content .app-steps li { position: relative; margin: 0 0 1em; padding: 1em 1.2em 1em 7.5em; background: #fff; border-radius: var(--radius); border-left: 4px solid var(--main); }
.app-steps strong { display: block; color: var(--main-dark); }
.app-steps__num { position: absolute; left: 1.2em; top: 1.1em; padding: .1em .6em; border-radius: 3px; background: var(--main); color: #fff; font-size: .8rem; font-weight: 700; }
@media (max-width: 599px) { .post_content .app-steps li { padding-left: 1.2em; padding-top: 2.6em; } }

.post_content .app-check { list-style: none; padding: 1.2em 1.4em; margin: 0 0 3em; background: #fff; border-radius: var(--radius); border: 1px solid var(--border); }
.post_content .app-check li { position: relative; padding-left: 1.8em; }
.app-check li::before { content: "✓"; position: absolute; left: 0; color: var(--htag); font-weight: 700; }

.lp-cta { text-align: center; padding: 2em 1.2em .5em; border-radius: 12px; background: var(--main-thin); }
.post_content .lp-cta__ttl { margin: 0 0 .6em; padding: 0; background: none; color: var(--main-dark); font-size: 1.4rem; }
.post_content .lp-cta__sub { font-size: .95rem; }

.course-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1em; margin-bottom: 3em; }
.course-item { display: flex; gap: 1em; align-items: center; padding: 1em; background: #fff; border-radius: 12px; color: var(--text); text-decoration: none; box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
.course-item:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,.08), 0 8px 20px rgba(0,0,0,.08); }
.course-item img { flex: 0 0 110px; width: 110px; height: 110px; object-fit: contain; border-radius: 8px; background: var(--pale02); }
.course-item__body { display: flex; flex-direction: column; gap: .2em; min-width: 0; }
.course-item__name { font-size: 1.05rem; font-weight: 700; color: var(--main-dark); }
.course-item__text { font-size: .85rem; line-height: 1.6; color: #555; }
.course-item__more { font-size: .85rem; font-weight: 700; color: var(--main); }
.course-item__more::after { content: " ›"; }
/* 資格取得コースの各試験（ITパスポート・基本情報・プロフェッショナルデジタルスキル・Python認定試験）は、画像の代わりに色付きの文字タイル */
.course-item__tile { --t: var(--main); flex: 0 0 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 110px; height: 110px; padding: .4em; border-radius: 8px; background: var(--t); color: #fff; font-size: 1rem; font-weight: 700; line-height: 1.3; text-align: center; }
.course-item__tile small { margin-bottom: .4em; padding: 0 .6em; border: 1px solid rgba(255,255,255,.7); border-radius: 80px; font-size: .65rem; }
.course-item__tile.-ip { --t: var(--deep01); font-size: .9rem; }
.course-item__tile.-fe { --t: var(--deep03); }
.course-item__tile.-pm { --t: var(--deep02); }
.course-item__tile.-pd { --t: #e07b0c; }
.course-item__tile.-ps { --t: var(--main-dark); }
.course-item__tile.-py { --t: #7a5cc7; }
.post_content .course-list__note { margin: -2em 0 3em; font-size: .8rem; color: #666; }
.course-combo { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5em; margin-bottom: 3em; }
.course-combo figure { margin: 0; padding: 1em; background: #fff; border-radius: 12px; text-align: center; box-shadow: 0 2px 4px rgba(0,0,0,.05); }
.course-combo figcaption { margin-top: .5em; font-weight: 700; color: var(--main-dark); }
@media (max-width: 599px) {
  .course-list, .course-combo { grid-template-columns: 1fr; }
  .course-item img, .course-item__tile { flex-basis: 88px; width: 88px; height: 88px; }
  .course-item__tile { font-size: .8rem; }
  .course-item__tile.-ip { font-size: .72rem; }
}

/* ---------- トップの「コースのご案内」（入口のバナー4つを縦に並べる。中身は 03_サイト生成.py の COURSES） ---------- */
.course-banners { margin-bottom: 3em; }
.course-banners__ttl { margin: 0 0 1em; text-align: center; font-size: 1.5rem; line-height: 1.5; }
.course-banners__ttl::after { content: ""; display: block; width: 3em; height: 2px; margin: .6em auto 0; background: var(--main); }
.course-banners__list { display: grid; grid-template-columns: 1fr; gap: 1.5em; }
.course-banner { --c: var(--main); --pale: var(--main-thin); display: flex; align-items: center; gap: 2em; padding: 1.5em 2em; background: #fff; border-left: 6px solid var(--c); border-radius: 12px; color: var(--text); text-decoration: none; box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.06); transition: transform .2s, box-shadow .2s; }
a.course-banner:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,.08), 0 8px 20px rgba(0,0,0,.08); }
.course-banner.-blue { --c: var(--deep02); --pale: var(--pale02); }
.course-banner.-green { --c: var(--deep03); --pale: var(--pale03); }
.course-banner.-orange { --c: #e07b0c; --pale: var(--pale04); }
.course-banner.-red { --c: var(--deep01); --pale: var(--pale01); }
.course-banner__img { flex: 0 0 220px; display: flex; align-items: center; justify-content: center; width: 220px; height: 220px; overflow: hidden; border-radius: 10px; background: var(--pale); }
.course-banner__img img { width: 100%; height: 100%; object-fit: cover; }
.course-banner__img svg { width: 84%; height: auto; }
.course-banner__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: .4em; min-width: 0; }
.course-banner__head { display: flex; align-items: center; gap: .5em; }
.course-banner__num { font-size: 1rem; font-weight: 700; letter-spacing: .05em; color: var(--c); }
.course-banner__tag { padding: 0 .6em; border-radius: 80px; background: var(--c); color: #fff; font-size: .8rem; font-weight: 700; }
.course-banner__name { font-size: 1.75rem; font-weight: 700; line-height: 1.4; color: #222; }
.course-banner__text { font-size: 1.05rem; line-height: 1.7; color: #555; }
.course-banner__more { margin-top: .4em; font-size: 1.05rem; font-weight: 700; color: var(--c); }
a.course-banner .course-banner__more::after { content: " ›"; }
.course-banner.is-soon .course-banner__more { color: #999; }
@media (max-width: 599px) {
  .course-banner { gap: 1em; padding: 1em; }
  .course-banner__img { flex-basis: 110px; width: 110px; height: 110px; }
  .course-banner__name { font-size: 1.25rem; }
  .course-banner__text { font-size: .9rem; line-height: 1.6; }
  .course-banner__more { font-size: .9rem; }
}

/* 画面には出さず、検索・読み上げ用に残す見出し */
.u-visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ---------- フッター ---------- */
.site-footer { background: var(--main); color: #fff; padding: 2em 0 1.5em; font-size: .9rem; }
.site-footer ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: .4em 1.6em; margin: 0 0 1.2em; padding: 0; }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.site-footer .copyright { text-align: center; margin: 0; font-size: .8rem; opacity: .9; }

.pagetop { position: fixed; right: 16px; bottom: 16px; width: 52px; height: 52px; border-radius: 50%; background: #fff; color: var(--main); border: 1px solid var(--main); cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .3s; box-shadow: 0 2px 4px rgba(0,0,0,.1); display: flex; align-items: center; justify-content: center; }
.pagetop::before { content: ""; width: 10px; height: 10px; margin-top: 5px; border-top: 2px solid currentColor; border-left: 2px solid currentColor; transform: rotate(45deg); }
.pagetop.is-show { opacity: .75; pointer-events: auto; }
.pagetop:hover { opacity: 1; }

/* ---------- 404 ---------- */
.notfound { text-align: center; padding: 4em 0; }