/*
Theme Name: manabu-style
Editor Style: style.css
Theme URI: https://bizsapo.net/
Author: Manabu Yokoyama
Author URI: https://bizsapo.net/
Description: Responsive wordpress theme based on HTML5, CSS3
Version: 1.1.1
*/

.mce-content-body{margin: 0.5em 1% !important; max-width: 98%;}

/* コンテナ */
.slidebox{
  width: 100%;
  max-width: 900px;
  display: grid;
  grid-auto-flow: column;      /* 横方向に追加していく */
  grid-auto-columns: 320px;    /* 各ボックスの幅 */
  gap: 12px;                   /* すき間（任意） */
  overflow-x: auto;            /* 横スクロール */
  -webkit-overflow-scrolling: touch; /* iOS慣性スクロール */
  scroll-snap-type: x proximity;      /* 任意：スナップ */
  align-items: stretch;         /* 行の高さにボックスを伸ばす */
}

/* 各ボックス */
.sbox{
  /* widthは不要（grid-auto-columnsが制御） */
  border: 1px solid #ccc;
  box-sizing: border-box;
  height: 100%;                 /* 行高にフィット（=最大高さで揃う） */
  scroll-snap-align: start;     /* 任意：スナップ位置 */
  display: flex;                /* 任意：中身のレイアウト用 */
  flex-direction: column;       /* 任意 */
  padding:1em;
}


/* ===== 基本設定 ===== */
html[lang="ja"] {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
body {
    width:100%;
    min-height: 100% !important;
    height: auto;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    text-rendering: geometricPrecision;
    word-wrap:break-word;
    -webkit-text-size-adjust: 100%;
    font-feature-settings: "palt";
    letter-spacing: .8px;
    background:#ffffff;
    color:var(--color-d);
    line-height:1.7;
    font-weight:400;
}
@media only screen and ( max-width : 359.9px ){ 
body{font-size: -webkit-calc(100vw / 22.5); font-size: calc(100vw / 22.5);}
}
@media print, screen and (min-width: 360px){
body{font-size:16px;}
}

/******************************************************
  WordPress Core Blocks ? Unified Styles (Front + Editor)
  Scope: .editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap
******************************************************/

/* Links */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) a {
  color: var(--color-c);
  font-weight:600;
  text-decoration: underline;
  transition: color .15s ease, opacity .15s ease;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) a:hover {
  opacity: 0.7;
  text-decoration:underline;
}

/* =========================
    Typography
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h3:not(.noh), .m3,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h4:not(.noh), .m4,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h5:not(.noh), .m5,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h6:not(.noh), .m6
{
    line-height: 1.3;
    font-weight: bold;
    letter-spacing: 2px;
    margin-top: 1.5em;
    margin-bottom: 0.75em;
}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h1:not(.noh), .m1,
.wp-block-post-title{
    line-height: 1.3;
    font-weight: bold;
    letter-spacing: 2px;
    display: block;
    font-size: 2.0em;
    text-align: center;
    margin-top: 1em;
    margin-bottom: 1.5em;
    padding-top:0em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h1:not(.noh):after, .m1:after, .wp-block-post-title:after{
    display: block;
    width: 50px;
    height: 5px;
    margin: 20px auto 30px;
    content: "";
    background: var(--color-c);
}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h2:not(.noh), .m2{
    font-size: 1.8em;
    line-height: 1.3;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    margin-top: 3.5em;
    margin-bottom: 0.75em;
    padding-top:0em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h2:not(.noh):after, .m2:after {
    display: block;
    width: 80px;
    height: 3px;
    margin: 20px auto 20px;
    content: "";
    background: var(--color-b);
}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h3:not(.noh), .m3{font-size: 1.5em; color:var(--color-c);}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h4:not(.noh), .m4{font-size: 1.5em; color:var(--color-b);}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h5:not(.noh), .m5{font-size: 1.5em; color:var(--color-a);}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) h6:not(.noh), .m6{font-size: 1.5em; color:var(--color-d);}

.m11{
    line-height: 1.3;
    font-weight: bold;
    letter-spacing: 2px;
    display: block;
    font-size: 2.5em;
    text-align: center;
    margin-top: 0em;
    margin-bottom: 0.75em;
    padding-top:2em;
}
.m11:first-letter{color:var(--color-b);}

section > h2:first-child, section > h3:first-child, section > h4:first-child, section > h5:first-child, section > h6:first-child,
h1 + h2, h1 + h3, h1 + h4, h1 + h5, h1 + h6, h2 + h1, h2 + h3, h2 + h4, h2 + h5, h2 + h6, h3 + h1, h3 + h2, h3 + h4, h3 + h5, h3 + h6,
h4 + h1, h4 + h2, h4 + h3, h4 + h5, h4 + h6, h5 + h1, h5 + h2, h5 + h3, h5 + h4, h5 + h6{margin-top: 1em !important;}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) p { margin: 0 0 1.2em; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) strong, .bold, b { color: #000; font-weight: bold; }

/* Text alignment utility from Blocks */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .has-text-align-center{text-align:center;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .has-text-align-right{text-align:right;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .has-text-align-left{text-align:left;}

/* =========================
    Lists & Details
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) ul:not(.olul),
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-list:not(.olul){
  list-style-type: disc;
  padding-left: 1.5em;
  margin-bottom: 1em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) ol:not(.olul){
  list-style-type: decimal;
  padding-left: 1.5em;
  margin-bottom: 1em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) *:not(.olul) li {
  line-height:2.0;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) *:not(.olul) li::marker {
  color: var(--color-a) !important;
  font-weight: bold;
}
*.olul li::marker {display:none;}
ul.u1, ul.u2, ul.u3, ul.u4, ul.u5, ul.u6, ul.u7, ul.u8, ul.u9, ul.u10, ul.u11 {list-style: none !important; padding-left: 0 !important;}
ul.u1 li::marker, ul.u2 li::marker, ul.u3 li::marker, ul.u4 li::marker, ul.u5 li::marker, ul.u6 li::marker, ul.u7 li::marker, ul.u8 li::marker, ul.u9 li::marker, ul.u10 li::marker, ul.u11 li::marker {display:none !important;}
ul.u1 li, ul.u2 li, ul.u3 li, ul.u4 li, ul.u5 li, ul.u6 li, ul.u7 li, ul.u8 li, ul.u9 li, ul.u10 li, ul.u11 li {margin-left: 1.3rem; text-indent: -1.3em;} /* 調整 */
ul.u1 li:before, ul.u2 li:before, ul.u3 li:before, ul.u4 li:before, ul.u5 li:before, ul.u6 li:before, ul.u7 li:before, ul.u8 li:before, ul.u9 li:before, ul.u10 li:before, ul.u11 li:before {font-family: "Font Awesome 6 Free"; margin-right: .3em; color: var(--color-a) !important;}
ul.u1 li:before{content: "\f00c"; font-weight:600;}
ul.u2 li:before{content: "\f14a"; font-weight:400;}
ul.u3 li:before{content: "\f14a"; font-weight:600;}
ul.u4 li:before{content: "\f058"; font-weight:400;}
ul.u5 li:before{content: "\f058"; font-weight:600;}
ul.u6 li:before{content: "\f00d"; font-weight:600;}
ul.u7 li:before{content: "\f0a4"; font-weight:600;}
ul.u8 li:before{content: "\f091"; font-weight:600;}
ul.u9 li:before{content: "\f201"; font-weight:600;}
ul.u10 li:before{content: "\f080"; font-weight:600;}
ul.u11 li:before{content: "\f200"; font-weight:600;}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) details,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-details{
  margin: 0 0 1.2em;
}

/*=====　sns btn  ===*/
ul.usns{padding:0 0 0em;}
.usns{
display:flex;
flex-flow:row wrap;
justify-content:center;
}
.usns li{
text-align:center!important;
letter-spacing: .2px;
line-height: 1;
margin-bottom: 0em;
position: relative;
}
a.btny, a.btnl, a.btnm, a.btne, a.btnw, a.btnf, a.btnt, a.btni, a.btnn, a.btnh {
  display: inline-block;
  text-align: center;
  padding: 0.1em 0.1em;
  margin: 0;
  font-size: 2em;
 /* text-decoration: none;
  border: 2px solid #ccc;
  border-radius: 4px;
  transition: .4s;
  background:#fff7e6;*/
}
a.btny:hover, a.btnl:hover, a.btnm:hover, a.btne:hover, a.btnw:hover, a.btnf:hover, a.btnt:hover, a.btni:hover, a.btnn:hover, a.btnh:hover{
  /*background:rgba(255, 247, 230, 0.5);*/
  opacity: 0.5;
}
a.btny {color:#fc0d1c;}
a.btnl {color:#00b900;}
a.btnm {color:#ef3f56;}
a.btne {color:#ef3f56;}
a.btnw {color:#ffc107;}
a.btnf {color:#3b75d4;}
a.btnt {color:#555555;}
a.btni {color:#f13f79;}
a.btnn {color:#0077b5;}
a.btnh {color:#f13f79;}
.fa-fw {
    text-align: center !important;
    width: 1.4em !important;
}
/*=====　toc_container   ===*/
#toc_container{display:block !important; max-width: fit-content; margin:1.5em auto 0em; padding:1em 2em 0 !important; min-width:50%; letter-spacing:0.1em;}
#toc_container a{color:#333;}
#toc_container p.toc_title {margin: 0 0 1em !important;}
#toc_container + h2{margin-top: 1.5em !important;}
ul.toc_list li{line-height:2em !important;}
ul.toc_list li:before{content:""!important;}
ul.toc_list li li:before{content:""!important;}
ul.toc_list li ul li{padding-left:1em !important;}


/* ===== 定義リスト ===== */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)  dl { margin: 1.5em 0; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)  dt { font-weight: bold; margin-top: 1em; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)  dd { margin-left: 1.5em; margin-bottom: 0.5em; }

/* =========================
    Table
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-table table{
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) th,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) td{
  border: 1px solid #ccc;
  padding: 0.75em;
  text-align: left;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) th p,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) td p{
  margin-bottom:0;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) th{ background:#eee; vertical-align:middle; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) td{ background:#fff; }

/* Stripes style */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-table.is-style-stripes tbody tr:nth-child(odd){ background: var(--color-f); }


/* =========================================================
   Table Utilities (Front / Classic Visual / Block Editor)
   ========================================================= */

/* 共通：Gutenbergテーブル（figure.wp-block-table / .wp-block-table__container）の横スク（540px以下） */
@media (max-width: 540px){
  /* スクロールは“ラッパー”のみに付与 */
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)
  :is(figure.wp-block-table, .wp-block-table__container){
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    max-width:100%;
  }

  /* table 自体は伸縮のみ（overflowは付けない） */
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)
  :is(figure.wp-block-table, .wp-block-table__container) > table{
    width:max-content;   /* 中身に応じて横に広がる */
    min-width:100%;      /* ただし最低でも画面幅 */
    table-layout:auto;   /* 列つぶれ防止（固定にしたい場合は fixed） */
  }

  /* 長い語の折返しで“無限横伸び”を防止 */
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body)
  :is(figure.wp-block-table, .wp-block-table__container) > table :is(td,th){
    white-space:normal;
    word-break:break-word;
    overflow-wrap:anywhere;
  }
}

/* 左列を見出し風に（figure.thw と table.thw に両対応） */
:is(figure.thw table, table.thw) tbody tr > :is(td,th):first-child{
  font-weight:700;
  background:#eee !important;
  white-space:nowrap;
  vertical-align:top;
}

/* t00：スマホで100%幅の縦積み */
@media (max-width: 540px){
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.t00 :is(th,td){
    width:100% !important;
    display:block;
  }
}

/* =========================================================
   .table_box － 任意のテーブルを“包んだ時だけ”横スクロール
   ========================================================= */
.table_box{
  overflow-x:auto;
  display:block;
}

/* 中のセルは折返し無し（比較表などで有効） */
.table_box table :is(th,td){
  white-space:nowrap;
}

/* 任意：WebKit系スクロールバーの見た目調整 */
.table_box::-webkit-scrollbar{ width:10px; height:10px; }
.table_box::-webkit-scrollbar-track{ background:#f1f1f1; border-radius:5px; }
.table_box::-webkit-scrollbar-thumb{ background:#888; border-radius:5px; }
.table_box::-webkit-scrollbar-thumb:hover{ background:#555; }


:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.tdl td{text-align:left;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.tdc td{text-align:center;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.tdr td{text-align:right;}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.thl th{text-align:left;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.thc th{text-align:center;}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) table.thr th{text-align:right;}

* ===== ボーダー無し ===== */
table.t0 th{
  border: none !important;
  font-weight: bold;
  padding: 0 !important;
  min-width: 5em !important;
}
table.t0 td {
  border: none !important;
  padding-left: 0 !important;
}

/* =========================================================
   tright / tbottom
   ========================================================= */
/* まず対象テーブルの既定を無効化・最小限リセット */
table.tright, table.tright th, table.tright td,
table.tbottom, table.tbottom th, table.tbottom td {
  border: none !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
table.tright, table.tbottom { min-width: auto !important; }

/* ---------------------------
   PCレイアウト（>= 834.1px）
   --------------------------- */
@media (min-width: 834.1px){

  /* = tright：左 th ／右 td（th 右端に?でつなぐ） = */
  table.tright{
    width:98% !important;
    margin:-0.3em 1% 0.6em !important;
    border-collapse:separate !important;
    border-spacing:0 0.6em !important;   /* 行間 */
    background:transparent !important;
  }
  table.tright > tbody > tr{ background:transparent !important; }
  table.tright > tbody > tr > th{
    width:25% !important;
    background:var(--color-a);
    color:#fff;
    font-weight:700;
    text-align:left;
    padding:.9em 1.0em !important;
    position:relative;
    border-radius:6px 0 0 6px;
  }
  /* ?（右向き三角） */
  table.tright > tbody > tr > th:after{
    content:"";
    position:absolute;
    left:100%; top:50%;
    margin-top:-.45em;
    border:.45em solid transparent;
    border-left-color:var(--color-a);
  }
  table.tright > tbody > tr > td{
    width:75% !important;
    background:#eee;
    color:var(--color-d);
    padding:1.0em 1.1em .9em 1.1em !important;
    border-radius:0 6px 6px 0;
  }

  /* = tbottom：行間にスペース、th 下に▼ = */
  table.tbottom{
    width:98% !important;
    margin:-1.0em 1% 0.6em !important;
    border-collapse:separate !important;
    border-spacing:0 1.1em !important;   /* 行間 */
    background:transparent !important;
  }
  table.tbottom > tbody > tr{ background:transparent !important; }
  table.tbottom > tbody > tr > th{
    width:25% !important;
    background:var(--color-a);
    color:#fff;
    font-weight:700;
    text-align:left;
    padding:.9em 1.0em !important;
    position:relative;
    border-radius:6px 0 0 6px;
  }
  /* ▼（下向き三角）? 最終行は非表示 */
  table.tbottom > tbody > tr > th:before{
    content:"";
    position:absolute;
    left:45%; top:100%;
    border:.5em solid transparent;
    border-top:.6em solid var(--color-a);
  }
  table.tbottom > tbody > tr.lasttr > th:before{ content:none; }

  table.tbottom > tbody > tr > td{
    width:75% !important;
    background:#eee;
    color:var(--color-d);
    padding:1.0em 1.1em .9em 1.1em !important;
    border-radius:0 6px 6px 0;
  }
  table.tbottom td p{ margin-bottom:.5em; }
}

/* ---------------------------
   SPレイアウト（<= 834px）
   --------------------------- */
@media (max-width: 834px){

  /* 共通：縦積み＋行間で余白を確保 */
  table.tright, table.tbottom{
    width:100% !important;
    margin:0 !important;
    border-collapse:separate !important;
    border-spacing:0 1.2em !important;  /* 行間高さは後で個別に上書き可 */
    background:transparent !important;
  }
  table.tright > tbody > tr,
  table.tbottom > tbody > tr{
    display:block !important;
    width:100% !important;
    background:transparent !important;
margin-bottom: 20px;
  }
  table.tright > tbody > tr > th,
  table.tright > tbody > tr > td,
  table.tbottom > tbody > tr > th,
  table.tbottom > tbody > tr > td{
    display:block !important;
    width:auto !important;               /* 汎用tableの width:100% を無効化 */
    max-width:100% !important;
    border-radius:6px !important;
  }

  /* = tright（SP）：th→td を上下に密着、矢印は “下向き” で中央に */
  table.tright{ border-spacing:0 1.0em !important; }
  table.tright > tbody > tr > th{
    background:var(--color-a); color:#fff;
    font-weight:700; text-align:left;
    padding:.9em 1.0em !important;
    border-radius:8px 8px 0 0 !important;
    position:relative;
    margin:0 !important;
  }
  /* PCの?は消して、SPは下向き▼を中央に */
  table.tright > tbody > tr > th:after{
    content:"";
    position:absolute;
    left:50%; top:100%;
    transform:translateX(-50%);
    border:.55em solid transparent;
    border-top-color:var(--color-a);
  }
  table.tright > tbody > tr > td{
    background:#eee; color:var(--color-d);
    padding:1.0em 1.1em .9em 1.1em !important;
    border-radius:0 0 8px 8px !important;
    margin:0 !important;
  }

  /* = tbottom（SP）：th/td を密着。▼は “td の下＝行間” に出す = */
  table.tbottom{
    border-spacing:0 1.4em !important;   /* 行間：好みに応じて 1.2～1.8em */
  }
  table.tbottom > tbody > tr > th{
    background:var(--color-a); color:#fff;
    font-weight:700; text-align:left;
    padding:.9em 1.0em !important;
    border-radius:8px 8px 0 0 !important;
    position:relative;
    margin:0 !important;
  }
  /* PCで使っていた ▼ はSPでは不要 */
  table.tbottom > tbody > tr > th:before{ display:none !important; }

  table.tbottom > tbody > tr > td{
    background:#eee; color:var(--color-d);
    padding:1.0em 1.1em .9em 1.1em !important;
    border-radius:0 0 8px 8px !important;
    position:relative !important;
    margin:0 !important;
  }
  /* ▼（下向き三角）を td の “下” に表示 → tr と tr の間に現れる */
  table.tbottom > tbody > tr > td:after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-18px;                        /* 三角の半分が行間に入る位置。-16～-22pxで調整 */
    transform:translateX(-50%);
    border:11px solid transparent;
    border-top-color:var(--color-a);
    pointer-events:none;
  }
  /* 最終行の▼は非表示 */
  table.tbottom > tbody > tr.lasttr > td:after{ display:none; }
}

/* ===== tttテーブル：モバイル用縦積みレイアウト ===== */
  table.ttt th {
    background: var(--color-g); /* 見出しを分かりやすく */
    font-weight: bold;
  }

@media screen and (max-width: 833.9px) {
  table.ttt,
  table.ttt thead,
  table.ttt tbody,
  table.ttt tr,
  table.ttt th,
  table.ttt td {
    display: block;
    width: 100%;
  }

  table.ttt tr {
    margin-bottom: -1px; /* 行ごとに少し余白 */
    border: 1px solid #ccc; /* 行区切りのために枠線 */
  }

  table.ttt td {
    border-top: 1px solid #ddd;
  }

  /* 行の中のセルを縦積みしても枠線が潰れないように調整 */
  table.ttt th, table.ttt td {
    box-sizing: border-box;
  }
}



/* =========================
    Buttons
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-buttons{
  display:flex; flex-wrap:wrap; gap: var(--gap-s, .75rem);
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-button__link,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-element-button, .btn a, a.btn{
  display:inline-block; padding:.7em 1.2em; border-radius: var(--radius-m, .6rem);
  background: var(--color-a); color:#fff; font-weight:700; text-decoration:none;
  transition: filter .15s ease, opacity .15s ease, background-color .15s ease;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-button__link:hover,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-element-button:hover, .btn a:hover, a.btn:hover{
  opacity: 0.8;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-button{ margin:0 auto !important;}

/* =========================
   Media: Image
   役割：基礎 → 整列 → 画面幅別 → clearfix
========================= */
/* 1) 基礎（編集画面/フロント共通） */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) img,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-image img {
  display: block;
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

#contents img{ margin-bottom:1em;}

/* 2) 整列ヘルパー（共通） */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* 中央寄せの見た目（好みで変更可） */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) img.aligncenter,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) figure.aligncenter img, img[class*="aligncenter"] {
  width: 90%;
  max-width: 540px;
}

/* 明示サイズがある場合は尊重 */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) img.aligncenter[width],
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) img.aligncenter[style*="width"] {
  width: auto;
  max-width: 100%;
}

/* 3) 画面幅別の左右回り込み */
/* --- PC/タブレット（540.1px）--- */
@media print, screen and (min-width: 540.1px) {

  /* 左寄せ */
  .wp-block[data-align="left"] > .wp-block-image,
  .wp-block-image.alignleft,
  figure.alignleft,
  .wp-caption.alignleft, img[class*="alignleft"] {
    float: left;
    width: 50%;
    max-width: 50%;
    margin: 0 1em 1em 0;
  }

  /* 右寄せ */
  .wp-block[data-align="right"] > .wp-block-image,
  .wp-block-image.alignright,
  figure.alignright,
  .wp-caption.alignright, img[class*="alignright"] {
    float: right;
    width: 50%;
    max-width: 50%;
    margin: 0 0 1em 1em;
  }

  /* 中身の画像はコンテナにフィット */
  .wp-block-image.alignleft img,
  .wp-block-image.alignright img,
  figure.alignleft > img,
  figure.alignright > img {
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }
}

/* --- スマホ（<540px）：回り込み解除＋100%幅 --- */
@media screen and (max-width: 834px) {
  .wp-block[data-align="left"] > .wp-block-image,
  .wp-block[data-align="right"] > .wp-block-image,
  .wp-block[data-align="center"] > .wp-block-image,
  .wp-block-image.alignleft,
  .wp-block-image.alignright,
  figure.alignleft,
  figure.alignright,
  .wp-caption.alignleft,
  .wp-caption.alignright {
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto 1em;
  }
}

/* 4) 回り込み崩れ防止（親に clearfix） */
.entry-content::after,
.wp-block-post-content::after,
#wrap::after {
  content: "";
  display: block;
  clear: both;
}

/* 5) 小さめ端末での左右寄せの見た目（任意：834px未満は回り込み解除） */
@media (max-width: 834px) {
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .alignleft,
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .alignright {
    float: none;
    margin: 0 auto var(--gap-m, 1rem);
  }
}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) figcaption,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-element-caption{
  font-size:.9em; color:#666; text-align:center; margin-top:.5em;
}
a img{transition:0.6s;}
a:hover img{opacity:0.8; transform: scale(0.99 , 0.99); transition-duration: 0.5s;}

img.img100, .img100 img:first-child {width:100%; height:auto; margin:0; display:block;}
img.img90, .img90 img:first-child {width:90%; height:auto; margin:0 auto 1em;}
img.img75, .img75 img:first-child {width:75%; height:auto; margin:0 auto 1em;}
img.img50, .img50 img:first-child {width:50%; height:auto; margin:0 auto 1em;}
img.img30, .img30 img:first-child {width:30%; height:auto; margin:0 auto 1em;}
.imgsh{box-shadow:0 0.2em 0.6em -0.2em rgba(0, 0, 0, 0.8);}
.imgborder{border: 1px solid #ccc;}
.imgdrop{
  -webkit-filter: drop-shadow(0px 3px 10px rgba(0,0,0,.8));
  filter: drop-shadow(0px 0px 10px rgba(0,0,0,.8));
}

/* ===== 画像の形状ユーティリティ ===== */
div.maru {
  position: relative; width: 306px; max-width:100%; height: 306px;
  background-color: rgb(255 255 240 / 70%); border:5px solid #eee; border-radius: 50%;
  margin: 0 auto; text-align: center; overflow: hidden;
}
img.maru, .maru > img { width: 100%; min-height: 100%; border-radius: 50%; object-fit: cover; object-position: 50% 50%; }
div.shikaku {
  position: relative; width: 306px; max-width:100%; height: 306px;
  background-color: rgb(255 255 240 / 70%); border:5px solid #eee; border-radius: 0;
  margin: 0 auto; text-align: center; overflow: hidden;
}
img.shikaku, .shikaku img { width:100%; min-height:100%; border-radius:0; object-fit:cover; object-position:50% 50%; }
div.yokonaga {
  position: relative; width: 100%; height:auto; aspect-ratio:16/8.5;
  background-color: rgb(255 255 240 / 70%); border:5px solid #eee; border-radius: 0;
  margin: 0 auto; text-align: center; overflow: hidden;
}
img.yokonaga, .yokonaga img { width: 100%; min-height: 100%; object-fit: cover; object-position: 50% 50%; }
div.yokonagab {
  position: relative; width: 100%; height: 280px;
  background-color: rgb(255 255 240 / 70%); border:5px solid #eee; border-radius: 0;
  margin: 0 auto; text-align: center; overflow: hidden;
}
img.yokonagab, .yokonagab img { width:100%; min-height:100%; object-fit:cover; object-position:50% 50%; }
div.tatenaga {
  position: relative; width: 100%; height: auto; aspect-ratio: 210/297;
  background-color: rgb(255 255 240 / 70%); border: 5px solid #eee; border-radius: 0;
  margin: 0 auto; text-align: center; overflow: hidden;
}
img.tatenaga, .tatenaga img { width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
div.maru p, div.shikaku p, div.yokonaga p, div.yokonagab p, div.tatenaga p{
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin-bottom:0; line-height:1.5;
}

/* =========================
   Media:  Gallery / Video / Audio / Embed / Media-Text
========================= */
/* Gallery */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-gallery{ gap: var(--gap-s, .75rem); }

/* Video/Audio */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-video video,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-audio audio{ width:100%; max-width:100%; }

/* Embed */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-embed{ margin: 0 0 1.2em; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-embed__wrapper iframe{
  width:100%; max-width:100%; aspect-ratio:16/9;
}

/* Media & Text */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-media-text{
  display:grid; gap: var(--gap-m, 1rem); align-items:center;
}
@media (min-width: 834px){
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-media-text{ grid-template-columns: 1fr 1fr; }
}

/* Cover */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-cover{
  position:relative; min-height:220px; display:grid; place-items:center; color:inherit;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-cover__image-background{ object-fit:cover; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-cover__inner-container{
  width: var(--content-max, min(92vw, 1100px)); margin:0 auto;
}
.v1 {position:relative; width:100%; padding-top:56.25%;}
.v1 iframe, .v1 object, .v1 embed {position:absolute; top:0; right:0; width:100%; height:100%;}

/* =========================
    Code / Preformatted / Verse
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) code,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) kbd{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background:var(--color-g); padding:.1em .35em; border-radius:.25em;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) pre,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-preformatted{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background:var(--color-g); padding:1em; border-radius: var(--radius-m, .6rem); overflow:auto;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-verse{
  white-space:pre-wrap; font-family: Georgia, "Times New Roman", serif; font-style:italic;
}

/* =========================
    Layout: Group / Stack / Row / Columns
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-group{ margin:0 0 1.2em; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-group:where(.is-layout-constrained){
  max-width: var(--wp--style--global--content-size, 800px);
  margin-inline:auto;
}

:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-columns{
  display:grid; gap: var(--gap-m, 1rem); margin: 0 0 1.2em;
}
@media (min-width: 834px){
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-columns{
    grid-template-columns: repeat(12, 1fr);
  }
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-column { grid-column: span 6; }
  /* respect data attributes Gutenberg uses for widths */
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-column[style*="flex-basis:33.33%"]{ grid-column: span 4; }
  :where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-column[style*="flex-basis:66.66%"]{ grid-column: span 8; }
}

/* =========================
    Quote / Pullquote
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) blockquote,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-quote{
  border-left: 4px solid var(--color-a);
  padding-left: 1em;
  margin: 1.5em 0;
  color: var(--color-d);
  font-style: italic;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-pullquote{
  border-top: 3px solid var(--color-b);
  border-bottom: 3px solid var(--color-b);
  padding: 1em 0;
  margin: var(--gap-xl, 2rem) 0;
  text-align: center;
  color: var(--color-d);
}

/* =========================
    Separator / Spacer
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) hr,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-separator{
  border:none; border-top:1px solid var(--color-c); opacity:.3; margin: var(--gap-xl, 2rem) 0;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-spacer{ display:block; }
hr.hr0 { display:block; height:1px; border:0 !important; margin:0; padding:0; clear: both;}

/* =========================
   1 Forms (Search/File)
========================= */
/* File */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-file{
  display:flex; align-items:center; gap: var(--gap-s, .75rem); flex-wrap:wrap; margin:0 0 1.2em;
}
/* Search */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-search__input{
  width:100%; max-width:320px; padding:.6em .8em; border:1px solid #ccc; border-radius: var(--radius-s, .35rem);
}

/* =========================
    Query Loop / Post Blocks / Pagination
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-query,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-template{
  display:grid; gap: var(--gap-l, 1.5rem);
}

/* Post Title / Excerpt / Featured Image */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-title{
  font-weight:700; line-height:1.35; color: var(--color-a);
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-excerpt{ color:#555; }
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-featured-image img{
  width:100%; height:auto; display:block; border-radius: var(--radius-s, .35rem);
}

/* Post Meta (date, terms) */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-date,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-post-terms{
  font-size:.9em; color:#666;
}

/* Pagination */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-query-pagination{
  display:flex; gap: var(--gap-s, .75rem); align-items:center; justify-content:center; margin: var(--gap-l, 1.5rem) 0 0;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-query-pagination a{
  display:inline-block; padding:.45em .8em; border:1px solid #ddd; border-radius: var(--radius-s, .35rem); text-decoration:none;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-query-pagination .current{
  background: var(--color-c); color:#fff; border-color: var(--color-c);
}

/* =========================
    Navigation (FSE)
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-navigation{
  display:flex; gap: var(--gap-m, 1rem); align-items:center;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-navigation__container{
  display:flex; gap: var(--gap-m, 1rem); flex-wrap:wrap;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-navigation a{
  text-decoration:none;
}

/* =========================
   Width: alignwide / alignfull
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .alignwide{
  width: var(--content-max, min(92vw, 1080px));
  margin-left:auto; margin-right:auto;
}
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .alignfull{
  width:100vw; margin-left:50%; transform:translateX(-50%);
}

/* =========================
   Cards (optional helper for Query)
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .is-style-card{
  border:1px solid #eee; border-radius: var(--radius-m, .6rem); padding: var(--gap-m, 1rem);
  background:#fff; box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

/* =========================
    Notice: WP Core Patterns
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) .wp-block-group.is-style-notice{
  border-left:4px solid var(--color-e);
  background: color-mix(in srgb, var(--color-e) 8%, #fff);
  padding: var(--gap-m, 1rem);
  border-radius: var(--radius-s, .35rem);
}

/* =========================
    Misc safe defaults
========================= */
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) img,
:where(.editor-styles-wrapper, .wp-site-blocks, .entry-content, #wrap, .mce-content-body) video{
  border-radius: var(--radius-s, .35rem); max-width: 100%;
}









/******************************************************
ブロックエディター関係ない　class
******************************************************/

/*================================================
 *  flex box
 ================================================*/
.af2, .bf2, .lf2, .af3, .bf3, .lf3, .af4, .bf4, .lf4, .af5, .bf5, .lf5, .af6, .bf6, .lf6{
  display: flex;
  flex-flow: row wrap;
}
.af2, .af3, .af4, .af5, .af6{justify-content:space-around;}
.bf2, .bf3, .bf4, .bf5, .bf6{justify-content:space-between;}
.lf2, .lf3, .lf4, .lf5, .lf6{justify-content:flex-start;}
.lf2 .bin, .lf3 .bin, .lf4 .bin, .lf5 .bin, .lf6 .bin{
  flex-grow: 0;
  margin-bottom: 1.5em;
  min-width: 0;
  word-break: break-word;
  overflow-wrap: break-word;
}
.af2 .bin, .af3 .bin, .af4 .bin, .af5 .bin, .af6 .bin, .bf2 .bin, .bf3 .bin, .bf4 .bin, .bf5 .bin{
  flex-grow: 0;
  margin-bottom: 1.5em;
  min-width: 0;
  word-break: break-word;
  overflow-wrap: break-word;
}
@media only screen and ( max-width : 540px ){ 
  .af2 .bin, .af3 .bin, .af4 .bin, .af5 .bin, .af6 .bin, .bf2 .bin, .bf3 .bin, .bf4 .bin, .bf5 .bin, .lf2 .bin, .lf3 .bin, .lf4 .bin, .lf5 .bin, .lf6 .bin{flex-basis:100%; margin-left:0;}
}
@media only screen and ( min-width : 540.1px ) and ( max-width : 834px ) {
  .lf2 .bin, .af2 .bin, .bf2 .bin{flex-basis:46%;}
  .lf2 .bin:nth-child(2n+1){margin-left:0;}
  .lf2 .bin:nth-child(2n){margin-left:8%;}
  .lf3 .bin, .af3 .bin, .bf3 .bin{flex-basis:46%;}
  .lf3 .bin:nth-child(2n+1){margin-left:0;}
  .lf3 .bin:nth-child(2n){margin-left:8%;}
  .lf4 .bin, .af4 .bin, .bf4 .bin{flex-basis:46%;}
  .lf4 .bin:nth-child(4n+1), .lf4 .bin:nth-child(4n+3){margin-left:0;}
  .lf4 .bin:nth-child(4n+2), .lf4 .bin:nth-child(4n){margin-left:8%;}
  .lf5 .bin, .af5 .bin, .bf5 .bin{flex-basis:46%;}
  .lf5 .bin:nth-child(5n+1), .lf5 .bin:nth-child(5n+3), .lf5 .bin:nth-child(5n){margin-left:0;}
  .lf5 .bin:nth-child(5n+2), .lf5 .bin:nth-child(5n+4){margin-left:8%;}
  .lf6 .bin, .af6 .bin, .bf6 .bin{flex-basis:46%;}
  .lf6 .bin:nth-child(6n+1), .lf6 .bin:nth-child(6n+3), .lf6 .bin:nth-child(6n+5){margin-left:0;}
  .lf6 .bin:nth-child(6n+2), .lf6 .bin:nth-child(6n+4), .lf6 .bin:nth-child(6n){margin-left:8%;}
}
@media only screen and ( min-width : 834.1px ) and ( max-width : 1023.9px ) {
  .lf2 .bin, .af2 .bin, .bf2 .bin{flex-basis:46%;}
  .lf2 .bin:nth-child(2n+1){margin-left:0;}
  .lf2 .bin:nth-child(2n){margin-left:8%;}
  .lf3 .bin, .af3 .bin, .bf3 .bin{flex-basis:46%;}
  .lf3 .bin:nth-child(2n+1){margin-left:0;}
  .lf3 .bin:nth-child(2n){margin-left:8%;}
  .lf4 .bin, .af4 .bin, .bf4 .bin{flex-basis:46%;}
  .lf4 .bin:nth-child(4n+1), .lf4 .bin:nth-child(4n+3){margin-left:0;}
  .lf4 .bin:nth-child(4n+2), .lf4 .bin:nth-child(4n){margin-left:8%;}
  .lf5 .bin, .af5 .bin, .bf5 .bin{flex-basis:30%;}
  .lf5 .bin:nth-child(5n+1){margin-left:0;}
  .lf5 .bin:nth-child(5n+2), .lf5 .bin:nth-child(5n+3){margin-left:5%;}
  .lf5 .bin:nth-child(5n+4), .lf5 .bin:nth-child(5n){margin-left:13.8%;}
  .lf6 .bin, .af6 .bin, .bf6 .bin{flex-basis:30%;}
  .lf6 .bin:nth-child(6n+1), .lf6 .bin:nth-child(6n+4){margin-left:0%;}
  .lf6 .bin:nth-child(6n+2), .lf6 .bin:nth-child(6n+3), .lf6 .bin:nth-child(6n+5), .lf6 .bin:nth-child(6n){margin-left:5%;}
}
@media print, screen and (min-width: 1024px){
  .lf2 .bin, .af2 .bin, .bf2 .bin{flex-basis:46%;}
  .lf2 .bin:nth-child(2n+1){margin-left:0;}
  .lf2 .bin:nth-child(2n){margin-left:8%;}
  .lf3 .bin, .af3 .bin, .bf3 .bin{flex-basis:30%;}
  .lf3 .bin:nth-child(3n+1){margin-left:0;}
  .lf3 .bin:nth-child(3n+2), .lf3 .bin:nth-child(3n){margin-left:5%;}
  .lf4 .bin, .af4 .bin, .bf4 .bin{flex-basis:23%;}
  .lf4 .bin:nth-child(4n+1){margin-left:1%;}
  .lf4 .bin:nth-child(4n+2), .lf4 .bin:nth-child(4n+3), .lf4 .bin:nth-child(4n){margin-left:2%;}
  .lf5 .bin, .af5 .bin, .bf5 .bin{flex-basis:18%;}
  .lf5 .bin:nth-child(5n+1){margin-left:1%;}
  .lf5 .bin:nth-child(5n+2), .lf5 .bin:nth-child(5n+3), .lf5 .bin:nth-child(5n+4), .lf5 .bin:nth-child(5n){margin-left:2%;}
  .lf6 .bin, .af6 .bin, .bf6 .bin{flex-basis:16%;}
  .lf6 .bin:nth-child(6n+1){margin-left:0%;}
  .lf6 .bin:nth-child(6n+2), .lf6 .bin:nth-child(6n+3), .lf6 .bin:nth-child(6n+4), .lf6 .bin:nth-child(6n+5), .lf6 .bin:nth-child(6n){margin-left:0.8%;}
}
.fg1 { flex-grow: 1;}
.fg2 { flex-grow: 2;}
.fg3 { flex-grow: 3;}
.bin p{text-align:left;}

.b55l{display:block;padding:0;margin:0;width:50%;float:left;}
.b55r{display:block;padding:0;margin:0;width:50%;float:right;}
.b64l{display:block;padding:0;margin:0;width:60%;float:left;}
.b64r{display:block;padding:0;margin:0;width:40%;float:right;}
.b46l{display:block;padding:0;margin:0;width:40%;float:left;}
.b46r{display:block;padding:0;margin:0;width:60%;float:right;}
.b73l{display:block;padding:0;margin:0;width:70%;float:left;}
.b73r{display:block;padding:0;margin:0;width:30%;float:right;}
.b37l{display:block;padding:0;margin:0;width:30%;float:left;}
.b37r{display:block;padding:0;margin:0;width:70%;float:right;}
.b82l{display:block;padding:0;margin:0;width:80%;float:left;}
.b82r{display:block;padding:0;margin:0;width:20%;float:right;}
.b28l{display:block;padding:0;margin:0;width:20%;float:left;}
.b28r{display:block;padding:0;margin:0;width:80%;float:right;}
.b91l{display:block;padding:0;margin:0;width:90%;float:left;}
.b91r{display:block;padding:0;margin:0;width:10%;float:right;}
.b19l{display:block;padding:0;margin:0;width:10%;float:left;}
.b19r{display:block;padding:0;margin:0;width:90%;float:right;}
.b33l{display:block;padding:0;margin:0;width:33%;float:left;}
.b33c{display:block;padding:0;margin:0 0.5%;width:33%;float:left;}
.b33r{display:block;padding:0;margin:0;width:33%;float:right;}
.b44{display:block;padding:0;margin:0;width:25%;float:left;}
.bb55l,.bb55r,.bb64l,.bb64r,.bb46l,.bb46r,.bb73l,.bb73r,.bb37l,.bb37r,.bb82l,.bb82r,.bb28l,.bb28r,.bb91l,.bb91r,.bb19l,.bb19r{width:100%; margin:0; padding:0; display:inline-block;}
.b1, .b2, .b3, .b4, .b6{width:100%; margin:0; padding:0; display:inline-block;}
@media only screen and (min-width: 360px){ .b6{width:50%; font-size:90%; margin:0; padding:0; display:inline-block; float:left;} }
@media only screen and (min-width: 540.1px){
  .b4 {width:50%; float:left;}
  .bb55l{display:block;padding:0;margin:0;width:50%;float:left;}
  .bb55r{display:block;padding:0;margin:0;width:50%;float:right;}
  .bb33l{display:block;padding:0;margin:0;width:33%;float:left;}
  .bb33c{display:block;padding:0;margin:0 0.5%;width:33%;float:left;}
  .bb33r{display:block;padding:0;margin:0;width:33%;float:right;}
  .bb44{display:block;padding:0;margin:0;width:25%;float:left;}
}
@media only screen and (min-width: 834px){
  .b3{width:33.3%; padding-left:0; padding-right:0; float:left;}
  .b6{width:33.3%; padding-left:0; padding-right:0; float:left;font-size:100%;}
  .bb73l{display:block;padding:0;margin:0;width:70%;float:left;}
  .bb73r{display:block;padding:0;margin:0;width:30%;float:right;}
  .bb37l{display:block;padding:0;margin:0;width:30%;float:left;}
  .bb37r{display:block;padding:0;margin:0;width:70%;float:right;}
  .bb82l{display:block;padding:0;margin:0;width:80%;float:left;}
  .bb82r{display:block;padding:0;margin:0;width:20%;float:right;}
  .bb28l{display:block;padding:0;margin:0;width:20%;float:left;}
  .bb28r{display:block;padding:0;margin:0;width:80%;float:right;}
  .bb91l{display:block;padding:0;margin:0;width:90%;float:left;}
  .bb91r{display:block;padding:0;margin:0;width:10%;float:right;}
  .bb19l{display:block;padding:0;margin:0;width:10%;float:left;}
  .bb19r{display:block;padding:0;margin:0;width:90%;float:right;}
}
@media print, screen and (min-width: 1024px){
  .b2{width:50%; padding-left:0; padding-right:0; float:left;}
  .b4{width:25%; padding-left:0; padding-right:0; float:left;}
  .b6{width:33.3%; padding-left:0; padding-right:0; float:left;}
  .bb64l{display:block;padding:0;margin:0;width:60%;float:left;}
  .bb64r{display:block;padding:0;margin:0;width:40%;float:right;}
  .bb46l{display:block;padding:0;margin:0;width:40%;float:left;}
  .bb46r{display:block;padding:0;margin:0;width:60%;float:right;}
}

/* ===== ボックス類 ===== */
.box1, .editor-styles-wrapper .box1{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-a) dotted 3px;
    background: #fff;
    border-radius: 10px;
}
.box2, .editor-styles-wrapper .box2{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-a) dotted 3px;
    background: #fff;
    border-radius: 10px;
}
.box3, .editor-styles-wrapper .box3{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-a) dotted 3px;
    background: #fff;
    border-radius: 10px;
}
.box4, .editor-styles-wrapper .box4{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-a) solid 2px;
    background: var(--color-e);
    border-radius: 10px;
}
.box5, .editor-styles-wrapper .box5{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-b) solid 2px;
    background: var(--color-f);
    border-radius: 10px;
}
.box6, .editor-styles-wrapper .box6{
    display: block;
    clear: both;
    overflow: hidden;
    margin:  0.5em 0 3em;
    padding: 1em;
    text-align: left;
    line-height: 1.8;
    border: var(--color-c) solid 2px;
    background: var(--color-g);
    border-radius: 10px;
}

.mbox1a{ background: var(--color-a); border: 1px solid var(--color-a); margin: 2em 0 0em; padding: 0.8em 1em; color:#fff; font-weight: bold; letter-spacing: 1px; border-radius: 10px 10px 0px 0px; /* 左上、右上、右下、左下 */}
.mbox1b{ border: 1px solid var(--color-a); display:block; clear:both; overflow:hidden; margin: 0em 0 3em; padding: 1.5em 1em 0.5em; text-align: left; line-height:1.8; background:#fff;}
.mbox2a{ background: var(--color-b); border: 1px solid var(--color-b); margin: 2em 0 0em; padding: 0.8em 1em; color:#fff; font-weight: bold; letter-spacing: 1px; border-radius: 10px 10px 0px 0px; /* 左上、右上、右下、左下 */}
.mbox2b{ border: 1px solid var(--color-b); display:block; clear:both; overflow:hidden; margin: 0em 0 3em; padding: 1.5em 1em 0.5em; text-align: left; line-height:1.8; background:#fff;}
.mbox3a{ background: var(--color-c); border: 1px solid var(--color-c); margin: 2em 0 0em; padding: 0.8em 1em; color:#fff; font-weight: bold; letter-spacing: 1px; border-radius: 10px 10px 0px 0px; /* 左上、右上、右下、左下 */}
.mbox3b{ border: 1px solid var(--color-c); display:block; clear:both; overflow:hidden; margin: 0em 0 3em; padding: 1.5em 1em 0.5em; text-align: left; line-height:1.8; background:#fff; }

.box1 h2, .box1 h3, .box1 h4, .box1 h5, .box1 h6,
.box2 h2, .box2 h3, .box2 h4, .box2 h5, .box2 h6,
.box3 h2, .box3 h3, .box3 h4, .box3 h5, .box3 h6,
.box4 h2, .box4 h3, .box4 h4, .box4 h5, .box4 h6,
.box5 h2, .box5 h3, .box5 h4, .box5 h5, .box5 h6,
.box6 h2, .box6 h3, .box6 h4, .box6 h5, .box6 h6,
.mbox1b h2, .mbox1b h3, .mbox1b h4, .mbox1b h5, .mbox1b h6,
.mbox2b h2, .mbox2b h3, .mbox2b h4, .mbox2b h5, .mbox2b h6,
.mbox3b h2, .mbox3b h3, .mbox3b h4, .mbox3b h5, .mbox3b h6,
td h2, td h3, td h4, td h5, td h6 {
    margin-top: 0 !important;
}


/*================================================
 *  Q A
 ================================================*/
.faqstyle dt, .editor-styles-wrapper .faqstyle dt {
  margin-bottom: 1em; color: var(--color-a); text-indent: -1.5em; padding-left: 1.5em;
}
.faqstyle dt::before, .editor-styles-wrapper .faqstyle dt::before,
.faqstyle dd::before, .editor-styles-wrapper .faqstyle dd::before { margin-right: .4em; }
.faqstyle dt::before, .editor-styles-wrapper .faqstyle dt::before { color:var(--color-a); content: "Q."; font-weight:700; }
.faqstyle dd, .editor-styles-wrapper .faqstyle dd {
  margin: 0 0 2.5em; padding: 1em 1.5em; background-color: var(--color-f); color: #111;
}
.faqstyle dd::before, .editor-styles-wrapper .faqstyle dd::before { color:var(--color-d); content: "A."; font-weight:700; }

/*================================================
 *  contactform7
 ================================================*/
input {vertical-align: middle; line-height:2.5em;}
input[type="text"].inps{vertical-align: text-top;}
input[type=radio] ,input[type=checkbox]{vertical-align: baseline;}
select {vertical-align: middle; line-height:1.5em; padding: 0.5em;}
select option{font-size:1em;}
.wpcf7-list-item { display: inline-block; margin: 0 0 0 1em;}
input[name="s"] {width: 96%; padding: 0.4em;}
label[for="s"]{display:none;}
#searchform {margin: 1em 0.5em 0.5em; width: 96%;}
.wpcf7-form label, .wpcf7-radio, .wpcf7-text, .wpcf7-form textarea, .wpcf7-select,
#respond input, #respond textarea{font-size:1em; line-height:1.6; width:100%; margin-bottom:0.2em;}
.wpcf7-submit{font-size:1em; line-height:1.1;}

@media print, screen and (min-width: 834.1px){
  .wpcf7-form label, .wpcf7-radio, .wpcf7-text, .wpcf7-form textarea, .wpcf7-select,
  #respond input, #respond textarea{font-size:1em; line-height:1.6; width:100%; margin-bottom:0.2em;}
  .wpcf7-submit{font-size:1em; line-height:1.2;}
}
div.wpcf7 .ajax-loader {display: none !important;}
#respond label{display:block;}
p.form-submit{text-align:center;}
#respond input[type="submit"]{width: auto;}
.says{display:none;}
.comment-author, .comment-meta{display:inline-block;}
#respond input[type="checkbox"] {float: left; width: auto; height: 1.5em; margin-right: 0.5em;}
.wpcf7-text, .wpcf7-form textarea{padding-left:0.5em; padding-right:0.5em;}
.kanarazu{
  font-size:0.8em; padding: 0.2em; background: var(--color-a); color: #fff; border-radius: 3px; margin-left:1em;
}
.wpcf7-list-item label input{margin-right:0.3em;}
.w100{width:100%;}
.w50{width: 48%; margin-right: 2%;}
.w20{width:24em; max-width:100%;}
.w15{width:15em; max-width:100%;}
.w10{width:9em; max-width:100%;}
.w6{width:7.5em;}
.w3{width:3em;}
.wpcf7-spinner{display:block;}

/*================================================
 *  important
 ================================================*/
.righta, .right, .editor-styles-wrapper .righta, .editor-styles-wrapper .right {text-align:right !important;}
.lefta, .left, .editor-styles-wrapper .lefta, .editor-styles-wrapper .left {text-align:left !important;}
.centera, .center, .editor-styles-wrapper .centera, .editor-styles-wrapper .center {text-align:center !important;}
.rightb {display:block !important; float:right !important;}
.leftb {display:block !important; float:left !important;}
.centerb {display:block !important; float:none; margin:0 auto !important;}
.rightc {text-align:right !important;}
.leftc {text-align:left !important;}
.rightf {display:block !important; float:none !important; vertical-align:top;}
.leftf {display:block !important; float:none !important; vertical-align:top;}
@media print, screen and (min-width: 540.1px){
  .rightc {text-align:center !important;}
  .leftc {text-align:center !important;}
  .rightf {float:right !important;}
  .leftf {float:left !important;}
}
.naname {
  transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
  padding-left: 0.45em;
  margin-bottom:0.5em;
  margin-top:0.2em;
}
.nanameb {
  transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -webkit-transform: rotate(3deg);
  padding-left: 0.45em;
  margin-bottom:0.5em;
  margin-top:0.2em;
}

/* ===== text-shadow utilities ===== */
.tshadow{
  text-shadow:
    white 0.1em 0px 0.1em, white -0.1em 0px 0.1em,
    white 0px -0.1em 0.1em, white -0.1em 0px 0.1em,
    white 0.1em 0.1em 0.1em, white -0.1em 0.1em 0.1em,
    white 0.1em -0.1em 0.1em, white -0.1em -0.1em 0.1em,
    white 0.05em 0.1em 0.1em, white -0.05em 0.1em 0.1em,
    white 0.05em -0.1em 0.1em, white -0.05em -0.1em 0.1em,
    white 0.1em 0.05em 0.1em, white -0.1em 0.05em 0.1em,
    white 0.1em -0.05em 0.1em, white -0.1em -0.05em 0.1em,
    white 0.05em 0.05em 0.1em, white -0.05em 0.05em 0.1em,
    white 0.05em -0.05em 0.1em, white -0.05em -0.05em 0.1em;
}
.tshadowb{
  text-shadow:
    black 0.1em 0px 0.1em, black -0.1em 0px 0.1em,
    black 0px -0.1em 0.1em, black -0.1em 0px 0.1em,
    black 0.1em 0.1em 0.1em, black -0.1em 0.1em 0.1em,
    black 0.1em -0.1em 0.1em, black -0.1em -0.1em 0.1em,
    black 0.05em 0.1em 0.1em, black -0.05em 0.1em 0.1em,
    black 0.05em -0.1em 0.1em, black -0.05em -0.1em 0.1em,
    black 0.1em 0.05em 0.1em, black -0.1em 0.05em 0.1em,
    black 0.1em -0.05em 0.1em, black -0.1em -0.05em 0.1em,
    black 0.05em 0.05em 0.1em, black -0.05em 0.05em 0.1em,
    black 0.05em -0.05em 0.1em, black -0.05em -0.05em 0.1em;
}
.tshadowc{
  text-shadow:
    black 0.05em 0px 0.05em, black -0.05em 0px 0.05em,
    black 0px -0.05em 0.05em, black -0.05em 0px 0.05em,
    black 0.05em 0.05em 0.05em, black -0.05em 0.05em 0.05em,
    black 0.05em -0.05em 0.05em, black -0.05em -0.05em 0.05em,
    black 0.025em 0.05em 0.05em, black -0.025em 0.05em 0.05em,
    black 0.025em -0.05em 0.05em, black -0.025em -0.05em 0.05em,
    black 0.05em 0.025em 0.05em, black -0.05em 0.025em 0.05em,
    black 0.05em -0.025em 0.05em, black -0.05em -0.025em 0.05em,
    black 0.025em 0.025em 0.05em, black -0.025em 0.025em 0.05em,
    black 0.025em -0.025em 0.05em, black -0.025em -0.025em 0.05em;
}
.tshadowa{
  text-shadow:
    var(--color-e) 0.1em 0px 0.1em, var(--color-e) -0.1em 0px 0.1em,
    var(--color-e) 0px -0.1em 0.1em, var(--color-e) -0.1em 0px 0.1em,
    var(--color-e) 0.1em 0.1em 0.1em, var(--color-e) -0.1em 0.1em 0.1em,
    var(--color-e) 0.1em -0.1em 0.1em, var(--color-e) -0.1em -0.1em 0.1em,
    var(--color-e) 0.05em 0.1em 0.1em, var(--color-e) -0.05em 0.1em 0.1em,
    var(--color-e) 0.05em -0.1em 0.1em, var(--color-e) -0.05em -0.1em 0.1em,
    var(--color-e) 0.1em 0.05em 0.1em, var(--color-e) -0.1em 0.05em 0.1em,
    var(--color-e) 0.1em -0.05em 0.1em, var(--color-e) -0.1em -0.05em 0.1em,
    var(--color-e) 0.05em 0.05em 0.1em, var(--color-e) -0.05em 0.05em 0.1em,
    var(--color-e) 0.05em -0.05em 0.1em, var(--color-e) -0.05em -0.05em 0.1em;
}
.tshadown{text-shadow:none;}

/* ===== colors / bg utilities ===== */
.pr1{background: linear-gradient(transparent 40%, var(--color-e) 5%); font-weight:bold;}
.pr2{background: linear-gradient(transparent 40%, var(--color-f) 5%); font-weight:bold;}
.pr3{background: linear-gradient(transparent 40%, var(--color-g) 5%); font-weight:bold;}
.pr1 strong, .pr2 strong, .pr3 strong{font-size:150%;}
.fit {display: inline-block; white-space: nowrap;} /* 改行禁止 */
.uchikeshi{
  text-decoration: underline;
  text-decoration-color: red;
  text-decoration-thickness: 1px;
  text-decoration-style: double;
  text-decoration-skip-ink: none;
  text-underline-offset: -50%;
}

.clf{color: #ffffff !important;}
.clb{color: #000000 !important;}
.clr{color: #ff0000 !important;}
.cly{color: #ffff00 !important;}
.cl1{color: var(--color-a) !important;}
.cl2{color: var(--color-b) !important;}
.cl3{color: var(--color-c) !important;}
.cl4{color: var(--color-d) !important;}
.cl5{color: var(--color-e) !important;}
.cl6{color: var(--color-f) !important;}
.cl7{color: var(--color-g) !important;}

.bgff{background: rgb(255 255 255 / 50%); border-radius: 10px;}
.bgf{background: #ffffff !important;}
.bge{background: #eeeeee !important;}
.bgr{background: #ff0000 !important;}
.bgy{background: #ffff00 !important;}
.bgyy{background: #ffffe6 !important;}
.bgyyy{background: #f6f6e9 !important;}
.bgb{background: #000000 !important;}
.bgbb{background: #dbdbdb !important;}
.bgbbb{background: #f3f3f3 !important;}
.bg1, .bg1 > a{background: var(--color-a) !important;}
.bg2, .bg2 > a{background: var(--color-b) !important;}
.bg3, .bg3 > a{background: var(--color-c) !important;}
.bg4, .bg4 > a{background: var(--color-d) !important;}
.bg5, .bg5 > a{background: var(--color-e) !important;}
.bg6, .bg6 > a{background: var(--color-f) !important;}
.bg7, .bg7 > a{background: var(--color-g) !important;}
.bg-insta{background:linear-gradient(45deg, #FCAF45, #FD1D1D, #C837AB, #833AB4) !important;}
.bg-line{background:#00b900 !important;}
.bg-facebook{background:#3b75d4 !important;}
.bg-tiktok{background:#080404 !important;}

/* ===== size / spacing utilities ===== */
.fs500{font-size:500% !important;} .fs400{font-size:400% !important;} .fs300{font-size:300% !important;}
.fs290{font-size:290% !important;} .fs280{font-size:280% !important;} .fs270{font-size:270% !important;} .fs260{font-size:260% !important;}
.fs250{font-size:250% !important;} .fs240{font-size:240% !important;} .fs230{font-size:230% !important;} .fs220{font-size:220% !important;} .fs210{font-size:210% !important;}
.fs200{font-size:200% !important;} .fs190{font-size:190% !important;} .fs180{font-size:180% !important;} .fs170{font-size:170% !important;} .fs160{font-size:160% !important;}
.fs150{font-size:150% !important;} .fs140{font-size:140% !important;} .fs130{font-size:130% !important;} .fs120{font-size:120% !important;} .fs110{font-size:110% !important;}
.fs100{font-size:100% !important;} .fs90{font-size:90% !important;} .fs80{font-size:80% !important;} .fs70{font-size:70% !important;} .fs60{font-size:60% !important;} .fs50{font-size:50% !important;}
.fs40{font-size:40% !important;} .fs30{font-size:30% !important;} .fs20{font-size:20% !important;} .fs10{font-size:10% !important;}
.lh3{line-height:3 !important;} .lh2{line-height:2 !important;} .lh1{line-height:1 !important;} .lh05{line-height:0.5 !important;} .lh0{line-height:0 !important;}
.pdxxx{padding:3em !important;} .pdxx{padding:2.5em !important;} .pdx{padding:1.5em !important;} .pdm{padding:1em !important;} .pds{padding:.5em !important;} .pdss{padding:.25em !important;} .pdn{padding:0 !important;}
.pdlrxxx{padding-left:3em !important; padding-right:3em !important;} .pdlrxx{padding-left:2.5em !important; padding-right:2.5em !important;} .pdlrx{padding-left:1.5em !important; padding-right:1.5em !important;}
.pdlrm{padding-left:1em !important; padding-right:1em !important;} .pdlrs{padding-left:.5em !important; padding-right:.5em !important;} .pdlrss{padding-left:.25em !important; padding-right:.25em !important;} .pdlrn{padding-left:0 !important; padding-right:0 !important;}
.pdlxxx{padding-left:3em !important;} .pdlxx{padding-left:2.5em !important;} .pdlx{padding-left:1.5em !important;} .pdlm{padding-left:1em !important;} .pdls{padding-left:.5em !important;} .pdlss{padding-left:.25em !important;} .pdln{padding-left:0 !important;}
.pdrxxx{padding-right:3em !important;} .pdrxx{padding-right:2.5em !important;} .pdrx{padding-right:1.5em !important;} .pdrm{padding-right:1em !important;} .pdrs{padding-right:.5em !important;} .pdrss{padding-right:.25em !important;} .pdrn{padding-right:0 !important;}
.pdtbxxx{padding-top:3em !important; padding-bottom:3em !important;} .pdtbxx{padding-top:2.5em !important; padding-bottom:2.5em !important;} .pdtbx{padding-top:1.5em !important; padding-bottom:1.5em !important;}
.pdtbm{padding-top:1em !important; padding-bottom:1em !important;} .pdtbs{padding-top:.5em !important; padding-bottom:.5em !important;} .pdtbss{padding-top:.25em !important; padding-bottom:.25em !important;} .pdtbn{padding-top:0 !important; padding-bottom:0 !important;}
.pdtxxx{padding-top:3em !important;} .pdtxx{padding-top:2.5em !important;} .pdtx{padding-top:1.5em !important;} .pdtm{padding-top:1em !important;} .pdts{padding-top:.5em !important;} .pdtss{padding-top:.25em !important;} .pdtn{padding-top:0 !important;}
.pdbxxx{padding-bottom:3em !important;} .pdbxx{padding-bottom:2.5em !important;} .pdbx{padding-bottom:1.5em !important;} .pdbm{padding-bottom:1em !important;} .pdbs{padding-bottom:.5em !important;} .pdbss{padding-bottom:.25em !important;} .pdbn{padding-bottom:0 !important;}
.mra{margin:0 auto !important;}
.mrxxx{margin:3em !important;} .mrxx{margin:2.5em !important;} .mrx{margin:1.5em !important;} .mrm{margin:1em !important;} .mrs{margin:.5em !important;} .mrss{margin:.25em !important;} .mrn{margin:0 !important;}
.mrlrxxx{margin-left:3em !important; margin-right:3em !important;} .mrlrxx{margin-left:2.5em !important; margin-right:2.5em !important;} .mrlrx{margin-left:1.5em !important; margin-right:1.5em !important;} .mrlrm{margin-left:1em !important; margin-right:1em !important;} .mrlrs{margin-left:.5em !important; margin-right:.5em !important;} .mrlrss{margin-left:.25em !important; margin-right:.25em !important;} .mrlrn{margin-left:0 !important; margin-right:0 !important;}
.mrlxxx{margin-left:3em !important;} .mrlxx{margin-left:2.5em !important;} .mrlx{margin-left:1.5em !important;} .mrlm{margin-left:1em !important;} .mrls{margin-left:.5em !important;} .mrlss{margin-left:.25em !important;} .mrln{margin-left:0 !important;}
.mrrxxx{margin-right:3em !important;} .mrrxx{margin-right:2.5em !important;} .mrrx{margin-right:1.5em !important;} .mrrm{margin-right:1em !important;} .mrrs{margin-right:.5em !important;} .mrrss{margin-right:.25em !important;} .mrrn{margin-right:0 !important;}
.mrtbxxx{margin-top:3em !important; margin-bottom:3em !important;} .mrtbxx{margin-top:2.5em !important; margin-bottom:2.5em !important;} .mrtbx{margin-top:1.5em !important; margin-bottom:1.5em !important;} .mrtbm{margin-top:1em !important; margin-bottom:1em !important;} .mrtbs{margin-top:.5em !important; margin-bottom:.5em !important;} .mrtbss{margin-top:.25em !important; margin-bottom:.25em !important;} .mrtbn{margin-top:0 !important; margin-bottom:0 !important;}
.mrtxxx{margin-top:3em !important;} .mrtxx{margin-top:2.5em !important;} .mrtx{margin-top:1.5em !important;} .mrtm{margin-top:1em !important;} .mrts{margin-top:.5em !important;} .mrtss{margin-top:.25em !important;} .mrtn{margin-top:0 !important;}
.mrbxxx{margin-bottom:3em !important;} .mrbxx{margin-bottom:2.5em !important;} .mrbx{margin-bottom:1.5em !important;} .mrbm{margin-bottom:1em !important;} .mrbs{margin-bottom:.5em !important;} .mrbss{margin-bottom:.25em !important;} .mrbn{margin-bottom:0 !important;}
.pdz{padding-left:1em !important; padding-right:1em !important; padding-bottom:1em !important; padding-top:0em !important;}
.pindex{text-indent: 1em;}
.vam{vertical-align: middle;}
.por{position: relative;}
.poa{position: absolute;}
.maxs{width: 300px !important; max-width:100% !important;}
.maxsm{width: 460px !important; max-width:100% !important;}
.maxm{width: 540px !important; max-width:100% !important;}
.maxl{width: 800px !important; max-width:100% !important;}
.maxll{width: 1280px !important; max-width:100% !important;}
.maxf{width: fit-content !important; max-width:100% !important;}
.tdu{text-decoration:unset !important;}

/* ===== 表示切替ユーティリティ ===== */
@media only screen and (max-width: 320px){ .minmbbb{display:none !important;} }
@media only screen and (max-width: 360px){ .minmbb{display:none !important;} }
@media only screen and (max-width: 540px){ .minmb{display:none !important;} }
@media only screen and (max-width: 834px){ .mintb{display:none !important;} }
@media only screen and (max-width: 1023.9px){ .minpc{display:none !important;} }
@media only screen and (max-width: 1279.9px){ .minpcb{display:none !important;} }

@media print, screen and (min-width: 320.1px){ .maxmbbb{display:none !important;} }
@media print, screen and (min-width: 360.1px){ .maxmbb{display:none !important;} }
@media print, screen and (min-width: 540.1px){ .maxmb{display:none !important;} }
@media print, screen and (min-width: 834.1px){ .maxtb{display:none !important;} }
@media print, screen and (min-width: 1024px){ .maxpcb{display:none !important;} }
@media print, screen and (min-width: 1280px){ .maxpc{display:none !important;} }

@media only screen and (max-width: 833.9px){ .onlytb{display:none !important;} }
@media only screen and (min-width: 1024px){ .onlytb{display:none !important;} }
@media only screen and (min-width: 834px) and (max-width: 1023.9px){ .nonetb{display:none !important;} }

/* ===== アニメ ===== */
.yureru{animation:yureru 5s infinite}
@keyframes yureru{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ===== clearfix ===== */
.entry-content::after,.wp-block-post-content::after,#wrap::after{content:"";display:block;clear:both}

/*================================================
　secbox　左文字、右画像　　secboxb　左画像、右文字
 ================================================*/
.secbox {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    overflow: hidden;
    background:#f5f5ee;
    color:#252525;
}
.secboxb {
    width: 100%;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction:row-reverse;
    overflow: hidden;
    background:#000;
    color:#fff;
}
.sec .secbox, .sec .secboxb {color:#252525; background:#fff; margin-bottom:2em;}
.secini{width:50%; margin:0; padding:0; display:flex; align-items:center; justify-content:center;}
.secint{width:50%; margin:0 auto; padding:1em; display:flex; align-items:center; justify-content:center; font-size:18px; padding:1em 2em 0; max-width:540px;}
.sec .secini{width:25%;}
.sec .secint{width:75%;}
.secint p{margin-bottom:0.8em !important; line-height:1.4;}
.secint strong{font-weight:bold; line-height:2em; font-size:1.2em;}
.secbox .secint h2, .secboxb .secint h2{font-weight:bold; line-height:2em; font-size:1.2em; border:unset; background:unset; padding:0; margin:0;}
.secbox .secint strong, .secbox .secint h2, .sec .secboxb .secint strong, .sec .secboxb .secint h2{color:var(--color-a);}
.secboxb .secint strong, .secboxb .secint h2{color:var(--color-f);}

@media only screen and (max-width:539.9px){
.secint {font-size:16px;}
.secint strong, .secint h2 {font-size:18px;}
.secbox, .secboxb{display:block;}
.secini, .secint, .sec .secini, .sec .secint{display:block; width:100%;}
}
@media only screen and (min-width:540px) and (max-width:810px){
.secint {font-size: -webkit-calc(100vw / 45); font-size: calc(100vw / 45); padding:1em 1em 0;}
}

/*================================================
　　fix-bg
 ================================================*/
.por{position:relative;}
.poa{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

/*<div class="fix-bg por" style="background-image:url();"> */
.fix-bg{
  width: 100%;
  height: 70vh;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
@media screen and (max-width:359.9px){
   .fix-bg{height:100vh;}
}
@media print, screen and (min-width:744px) {
  .fix-bg{height:450px;}
}

@media screen and (max-width:743.9px){
.por .fullimg img{
    width: auto;
    margin-left: -webkit-calc(-50vw + 50%);
    margin-left: calc(-50vw + 50%);
    max-width: none;
    height: -webkit-calc(100vh - 60px);
    height: calc(100vh - 60px);
    display: block;
    opacity: 0.5;
}
}
@media print, screen and (min-width:744px) {
.por .fullimg img{
    width: 100vw;
    margin-left: -webkit-calc(-50vw + 50%);
    margin-left: calc(-50vw + 50%);
    max-width: none;
    height: auto;
    height: -webkit-calc(100vh - 80px);
    height: calc(100vh - 80px);
    display: block;
    opacity: 0.5;
}
}

/*================================================
 *  balloon
 ================================================*/
.balbox, .editor-styles-wrapper .balbox{
  width: 100%; margin: 0 auto; padding: 50px 30px 0px; display: inline-block;
  background-color: var(--color-e);
  border-radius: 20px;
}
.ball, .editor-styles-wrapper .ball {
  display: flex; align-items: center; position: relative; max-width: 300px; margin-left: 15px; padding: 1.8em 1.2em;
  border-radius: 20px; background-color: var(--color-b); color: #ffffff; float:left;
}
.ball::before, .editor-styles-wrapper .ball::before {
  position: absolute; left: -15px; width: 15px; height: 30px; background-color: var(--color-b);
  clip-path: polygon(0 50%, 100% 0, 100% 100%); content: '';
}
.balr, .editor-styles-wrapper .balr {
  display: flex; align-items: center; position: relative; max-width: 300px; margin-left: 15px; padding: 1.8em 1.2em;
  border-radius: 20px; background-color: var(--color-b); color: #ffffff; float:right;
}
.balr::before, .editor-styles-wrapper .balr::before {
  position: absolute; right: -15px; width: 15px; height: 30px; background-color: var(--color-b);
  clip-path: polygon(0 0, 100% 50%, 0 100%); content: '';
}
.balu, .editor-styles-wrapper .balu {
  display: flex; justify-content: center; position: relative; max-width: 300px; margin: 15px auto 0; padding: 1.8em 1.2em;
  border-radius: 20px; background-color: var(--color-b); color: #ffffff;
}
.balu::before, .editor-styles-wrapper .balu::before {
  position: absolute; top: -15px; width: 30px; height: 15px; background-color: var(--color-b);
  clip-path: polygon(50% 0, 0 100%, 100% 100%); content: '';
}
.balb, .editor-styles-wrapper .balb {
  display: flex; justify-content: center; position: relative; width: 300px; max-width: 96%; min-width: 55%;
  margin:0 auto 15px; padding: 1.8em 1.2em; border-radius: 20px; background-color: var(--color-b); color: #ffffff;
}
.balb::before, .editor-styles-wrapper .balb::before {
  position: absolute; bottom: -15px; width: 30px; height: 15px; background-color: var(--color-b);
  clip-path: polygon(0 0, 100% 0, 50% 100%); content: '';
}
.balbl, .editor-styles-wrapper .balbl {
  display: flex; justify-content: center; position: relative; width: 300px; max-width: 96%; min-width: 55%;
  margin:0 auto 30px; padding: 1.8em 1.2em; border-radius: 20px; background-color: var(--color-b);  color: #ffffff;
  float:left; font-weight: 500; font-size: 1.5em; line-height:1.5;
}
.balbl::before, .editor-styles-wrapper .balbl::before {
  position: absolute; bottom: -15px; width: 30px; height: 25px; background-color: var(--color-b);
  clip-path: polygon(0 0, 100% 0, 80% 100%); content: ''; left: 20px;
}
.balbr, .editor-styles-wrapper .balbr {
  display: flex; justify-content: center; position: relative; width: 300px; max-width: 96%; min-width: 55%;
  margin:0 auto 30px; padding: 1.8em 1.2em; border-radius: 20px; background-color: var(--color-b); color: #ffffff;
  float:right; font-weight: 500; font-size: 1.5em; line-height:1.5;
}
.balbr::before, .editor-styles-wrapper .balbr::before {
  position: absolute; bottom: -15px; width: 30px; height: 25px; background-color: var(--color-b);
  clip-path: polygon(0 0, 100% 0, -30% 130%); content: ''; right: 20px;
}


/*================================================
 *  .gallery
 ================================================*/
.gallery {
  display: grid;
  gap: 10px;
  justify-content: center;
  padding: 10px;
}
@media (min-width: 1230px) {
  .gallery {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (min-width: 920px) and (max-width: 1229px) {
  .gallery {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 610px) and (max-width: 919px) {
  .gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 609px) {
  .gallery {
    grid-template-columns: 1fr;
  }
}

.gallery img {
  width: 300px;
  height: 300px;
  object-fit: cover;
  object-position: center;
  cursor: pointer;
  display: block;
  transition: opacity 0.3s;
  margin: 0 auto;
}

.gallery-popup {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.8);
  justify-content: center;
  align-items: center;
  z-index: 9999;
}
.gallery-popup img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  background: #fff;
  border: 4px solid white;
  box-shadow: 0 0 20px #000;
  cursor: pointer;
}
#popupControls {
  position: absolute;
  top: 20px;
  width: 100%;
  text-align: center;
  z-index: 10000;
  pointer-events: none; /* 文字上でスワイプOK */
}
@media (min-width: 744px) {
#popupControls {width:auto; right:30px; top:unset; bottom: 20px;}
}

#popupControls > div {
  pointer-events: auto; /* 閉じるボタンは操作可能 */
}
#swipeHint {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  margin-top: 10px;
}
@media (min-width: 744px) {
#swipeHint {display: none;}
}
.closeBtn {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background: rgba(255,255,255,0.1);
  padding: 6px 12px;
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 4px;
  cursor: pointer;
}
.nav-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  background: rgba(255,255,255,0.2);
  color: white;
  border: 2px solid white;
  border-radius: 50%;
  text-align: center;
  line-height: 44px;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  user-select: none;
  z-index: 10001;
  display: none; /* モバイルでは非表示 */
}
.prev-button {
  left: 20px;
}
.next-button {
  right: 20px;
}
/* PC画面のみ表示 */
@media (min-width: 744px) {
  .nav-button {
    display: block;
  }
}

/* ===== ShinobiReviews ===== */
.ShinobiReviews {margin: 2em auto 0; max-width: fit-content;}
.ShinobiReviews footer, .css-1llg1ya{display:none;}


/* ========== ご利用の流れ ========== */
.flow-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.flow-item {
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 3px 12px rgba(0,0,0,.08);
  padding: 20px;
  margin-bottom: 32px;
  position: relative;
}
/* ▼ を三角形で描画（ダイヤ防止） */
.flow-item::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -12px;                 /* カード下からの飛び出し量 */
  transform: translateX(-50%);
  /* 三角形 ▼ */
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 12px solid #fff;    /* カードと同じ色 */

  /* 影は図形の輪郭にだけ付与 → ◆にならない */
  box-shadow: none;
  filter: drop-shadow(0 3px 6px rgba(0,0,0,.25));
}
.flow-item:last-child::after { display: none; }

.flow-icon {
  flex: 0 0 auto;
  margin-right: 20px;
}
.flow-icon img {
  width: 70px;   /* アイコンサイズ（ここを変えると文字とのバランス調整可能） */
  height: auto;
  display: block;
}
.flow-body {
  padding-left:1em;
  flex:1;
}
.flow-heading {
  font-size: 1.2rem;
  font-weight: bold;
  color: var(--color-b);
  margin: 0 0 6px;
}
.flow-body p {
  margin: 0;
  font-size: 0.95rem;
  color: #333;
  line-height: 1.7;
}

/* ========== スマホ（834px以下） ========== */
@media (max-width: 834px) {
  .flow-item {
    flex-direction: column;
    text-align: center;
    padding: 20px 16px;
  }
  .flow-icon {
    margin: 0 auto 12px;
  }
  .flow-icon img {
    width: 60px; /* スマホ時のアイコンサイズ */
  }
  .flow-item::after{
    bottom: -10px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #fff;
    filter: drop-shadow(0 2px 5px rgba(0,0,0,.25));
  }
}

/* ========== よくある質問 ========== */
.faq-section{
  font-size:1.125rem;font-weight:700;margin:3.5em 0 .75em 1.5em;
}
.faq-item{border-radius:6px;overflow:hidden;margin:10px 0;border:1px solid #eee;}
.faq-q{margin:0;}
.faq-btn{
  -webkit-appearance:none;appearance:none;background:#f4f4f4;width:100%;text-align:left;
  border:0;padding:20px 1em 20px 1em;cursor:pointer;position:relative;font-size:1.05rem;line-height:1.6;
}
.faq-btn:hover{background:#f0f0f0;}
/* Qマーク（左） */
.qmark,.amark{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;font-weight:700;margin-right:12px;color:#fff;
}
.qmark{background:var(--color-a);}
.amark{background:var(--color-b);margin-right:12px;}
/* 右端の＋／－ボタン */
.faq-btn::after{
  content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:50%;background:var(--color-a);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;line-height:1;
}
.faq-btn[aria-expanded="true"]::after{content:"–";}
/* 回答部 */
.faq-a{background:#e9e9e9;}
.faq-atext{padding:20px 1em 24px 3.5em;font-size:1rem;line-height:1.9;position:relative;}
.faq-atext p{margin-bottom:0 !important;}
.faq-atext .amark{position:absolute;left:1em;top:20px;}