@charset "UTF-8";
/* お花の贈り物講座（70・53・54・55）共通の見た目 20261027a */
/* ===== Eストアの default.css（本文の div・p などを12px・書体固定にする）を打ち消す。ページの指定より先に置く ===== */
#main-column #Journal .hk :where(*){font-size:inherit}
#main-column #Journal .hk{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif!important}
#main-column #Journal .hk *{font-family:inherit!important}
#main-column #Journal .hk h2{border-top:0}
/* 10/27夜 追加：Eストアの default.css が本文の li に四角い点（■）を付けるのを打ち消す。li は親の ul・ol の指定（点なし・番号など）に従う */
#main-column #Journal .hk li{list-style-type:inherit}
/* =========================================================
   ハナリロ お花の贈り物講座 共通スタイル（暫定）
   - 共通CSSが完成したら、この内容を共通CSSへ移し、
     各ページ先頭の <style> ブロックを削除してください。
   - 既存テーマと干渉しないよう、すべて .hk 配下に限定しています。
   - 色は下の変数を変えるだけで全ページに反映されます。
   ========================================================= */
#main-column #Journal .hk {
  --hk-ink:#2b2a28;
  --hk-sub:#6e6a64;
  --hk-line:#e7e2db;
  --hk-bg:#faf8f5;
  --hk-accent:#8c7b66;
  --hk-accent-soft:#f2ede6;
  --hk-ng:#a35d55;
  color:var(--hk-ink);
  font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif!important;
  font-size:15px;
  line-height:1.9;
  letter-spacing:.03em;
  max-width:1200px;
  margin:0 auto;
  padding:0 0 40px;
  box-sizing:border-box;
}
#main-column #Journal .hk *, #main-column #Journal .hk *::before, #main-column #Journal .hk *::after {box-sizing:border-box}
#main-column #Journal .hk img {max-width:100%;height:auto;display:block;border:0;color:transparent;font-size:0}
#main-column #Journal .hk p {margin:0 0 1em}
#main-column #Journal .hk a {color:var(--hk-accent);text-decoration:underline;text-underline-offset:3px}
#main-column #Journal .hk a:hover {opacity:.75}

/* 見出し（テーマの装飾をリセット） */
#main-column #Journal .hk h3, #main-column #Journal .hk h4, #main-column #Journal .hk h5 {background:none;border:0;padding:0;margin:0;color:var(--hk-ink);font-weight:600;line-height:1.5;text-shadow:none}
#main-column #Journal .hk h3::before, #main-column #Journal .hk h3::after, #main-column #Journal .hk h4::before, #main-column #Journal .hk h4::after {content:none}
#main-column #Journal .hk-label {display:block;font-size:11px;letter-spacing:.25em;color:var(--hk-accent);margin-bottom:6px;font-weight:500}
#main-column #Journal .hk-h3 {font-size:22px;margin-bottom:18px !important}
#main-column #Journal .hk-h4 {font-size:17px;margin-bottom:10px !important}

/* ヒーロー */
#main-column #Journal .hk-hero {display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:24px 0 40px;border-bottom:1px solid var(--hk-line);margin-bottom:40px}
#main-column #Journal .hk-hero__title {font-size:26px !important;margin-bottom:16px !important;letter-spacing:.06em}
#main-column #Journal .hk-hero__lead {color:var(--hk-sub);margin:0}
#main-column #Journal .hk-hero__img {aspect-ratio:4/3;overflow:hidden;background:var(--hk-bg)}
#main-column #Journal .hk-hero__img img {width:100%;height:100%;object-fit:cover}

/* 目次 */
#main-column #Journal .hk-toc {background:var(--hk-bg);padding:20px 24px;margin:0 0 48px}
#main-column #Journal .hk-toc__title {font-size:12px;letter-spacing:.2em;color:var(--hk-sub);margin:0 0 8px}
#main-column #Journal .hk-toc ol {margin:0;padding:0 0 0 1.4em;columns:2;column-gap:32px}
#main-column #Journal .hk-toc li {margin:2px 0;break-inside:avoid}
#main-column #Journal .hk-toc a {color:var(--hk-ink);text-decoration:none}
#main-column #Journal .hk-toc a:hover {color:var(--hk-accent)}

/* セクション */
#main-column #Journal .hk-sec {margin:0 0 64px;scroll-margin-top:80px}
#main-column #Journal .hk-sec__intro {color:var(--hk-sub);margin-bottom:24px}

/* カード */
#main-column #Journal .hk-cards {display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0;padding:0;list-style:none}
#main-column #Journal .hk-cards--2 {grid-template-columns:repeat(2,1fr)}
#main-column #Journal .hk-card {background:#fff;border:1px solid var(--hk-line);display:flex;flex-direction:column}
#main-column #Journal .hk-card__img {aspect-ratio:4/3;overflow:hidden;background:var(--hk-bg)}
#main-column #Journal .hk-card__img img {width:100%;height:100%;object-fit:cover}
#main-column #Journal .hk-card__body {padding:18px 20px 20px;flex:1;display:flex;flex-direction:column}
#main-column #Journal .hk-card__body p {font-size:14px;color:var(--hk-sub)}
#main-column #Journal .hk-card__body .hk-more {margin-top:auto}
#main-column #Journal a.hk-card {color:inherit;text-decoration:none}
#main-column #Journal a.hk-card:hover {opacity:1;border-color:var(--hk-accent)}
#main-column #Journal .hk-more {font-size:13px;letter-spacing:.1em;color:var(--hk-accent)}
#main-column #Journal .hk-more::after {content:" →"}

/* 番号つきポイント */
#main-column #Journal .hk-points {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;list-style:none;margin:0;padding:0;counter-reset:hkp}
#main-column #Journal .hk-points li {border-top:2px solid var(--hk-ink);padding-top:14px;counter-increment:hkp}
#main-column #Journal .hk-points li::before {content:"0" counter(hkp);display:block;font-size:12px;letter-spacing:.2em;color:var(--hk-accent);margin-bottom:4px}
#main-column #Journal .hk-points strong {display:block;font-size:16px;margin-bottom:6px}
#main-column #Journal .hk-points p {font-size:14px;color:var(--hk-sub);margin:0}

/* 避けたいもの（NG）一覧 */
#main-column #Journal .hk-ng {list-style:none;margin:0;padding:0;border-top:1px solid var(--hk-line)}
#main-column #Journal .hk-ng li {display:grid;grid-template-columns:160px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--hk-line)}
#main-column #Journal .hk-ng__img {aspect-ratio:1/1;overflow:hidden;background:var(--hk-bg)}
#main-column #Journal .hk-ng__img img {width:100%;height:100%;object-fit:cover}
#main-column #Journal .hk-ng__tag {display:inline-block;font-size:11px;letter-spacing:.15em;color:var(--hk-ng);border:1px solid var(--hk-ng);padding:0 8px;margin-bottom:6px}
#main-column #Journal .hk-ng p {font-size:14px;margin:0}
#main-column #Journal .hk-ng--noimg li {grid-template-columns:1fr}

/* 囲み */
#main-column #Journal .hk-note {background:var(--hk-accent-soft);padding:20px 24px;margin:24px 0}
#main-column #Journal .hk-note__title {font-weight:600;margin-bottom:6px;font-size:14px}
#main-column #Journal .hk-note p:last-child, #main-column #Journal .hk-note ul:last-child {margin-bottom:0}
#main-column #Journal .hk-note ul {margin:0;padding-left:1.2em}

/* 表 */
#main-column #Journal .hk-table-wrap {overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 16px}
#main-column #Journal .hk-table {width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
#main-column #Journal .hk-table th, #main-column #Journal .hk-table td {border:0;border-bottom:1px solid var(--hk-line);padding:12px 10px;text-align:left;vertical-align:top;background:none}
#main-column #Journal .hk-table thead th {font-size:12px;letter-spacing:.1em;color:var(--hk-sub);font-weight:500;border-bottom:1px solid var(--hk-ink)}
#main-column #Journal .hk-table tbody th {font-weight:600;white-space:nowrap}
#main-column #Journal .hk-small {font-size:12px;color:var(--hk-sub)}

/* シーン別ブロック */
#main-column #Journal .hk-scene {display:grid;grid-template-columns:240px 1fr;gap:28px;padding:28px 0;border-bottom:1px solid var(--hk-line)}
#main-column #Journal .hk-scene:first-of-type {border-top:1px solid var(--hk-line)}
#main-column #Journal .hk-scene__img {aspect-ratio:1/1;overflow:hidden;background:var(--hk-bg)}
#main-column #Journal .hk-scene__img img {width:100%;height:100%;object-fit:cover}
#main-column #Journal .hk-scene p {font-size:14px}
#main-column #Journal .hk-scene--noimg {grid-template-columns:1fr}
#main-column #Journal .hk-meta {display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--hk-sub);margin:0 0 12px;padding:0;list-style:none}
#main-column #Journal .hk-meta li::before {content:"";display:inline-block;width:6px;height:6px;background:var(--hk-accent);margin-right:6px;vertical-align:middle}

/* 時期の流れ */
#main-column #Journal .hk-steps {list-style:none;margin:0;padding:0;counter-reset:hks}
#main-column #Journal .hk-steps>li {position:relative;padding:0 0 32px 56px;counter-increment:hks}
#main-column #Journal .hk-steps>li::before {content:counter(hks);position:absolute;left:0;top:0;width:36px;height:36px;border:1px solid var(--hk-ink);border-radius:50%;text-align:center;line-height:34px;font-size:14px}
#main-column #Journal .hk-steps>li::after {content:"";position:absolute;left:18px;top:40px;bottom:6px;width:1px;background:var(--hk-line)}
#main-column #Journal .hk-steps>li:last-child::after {content:none}
#main-column #Journal .hk-steps p {font-size:14px}
#main-column #Journal .hk-badge {display:inline-block;font-size:11px;letter-spacing:.1em;background:var(--hk-ink);color:#fff;padding:1px 8px;margin-left:8px;vertical-align:middle}

/* 月別イベント */
#main-column #Journal .hk-months {display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--hk-line);border-left:1px solid var(--hk-line)}
#main-column #Journal .hk-month {border-right:1px solid var(--hk-line);border-bottom:1px solid var(--hk-line);padding:16px 18px}
#main-column #Journal .hk-month__m {font-size:12px;letter-spacing:.2em;color:var(--hk-accent);margin-bottom:6px}
#main-column #Journal .hk-month dl {margin:0}
#main-column #Journal .hk-month dt {font-weight:600;font-size:14px;margin-top:8px}
#main-column #Journal .hk-month dt:first-child {margin-top:0}
#main-column #Journal .hk-month dd {margin:0;font-size:13px;color:var(--hk-sub);line-height:1.7}

/* 文例 */
#main-column #Journal .hk-msgs {display:grid;gap:12px;margin:0 0 16px;padding:0;list-style:none}
#main-column #Journal .hk-msgs li {border-left:2px solid var(--hk-accent);background:#fff;padding:12px 18px;font-size:14px}
#main-column #Journal .hk-msgs li span {display:block;font-size:11px;letter-spacing:.1em;color:var(--hk-sub);margin-bottom:2px}
#main-column #Journal .hk-words {display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none}
#main-column #Journal .hk-words li {font-size:13px;border:1px solid var(--hk-line);padding:2px 12px;background:#fff}

/* 開閉 */
#main-column #Journal .hk-details {border-top:1px solid var(--hk-line);border-bottom:1px solid var(--hk-line);margin:16px 0}
#main-column #Journal .hk-details summary {cursor:pointer;padding:14px 40px 14px 0;font-weight:600;list-style:none;position:relative;transition:color .2s}
#main-column #Journal .hk-details summary::-webkit-details-marker {display:none}
#main-column #Journal .hk-details summary:hover {color:var(--hk-accent)}
#main-column #Journal .hk-details__body {overflow:hidden}
#main-column #Journal .hk-details__body>:last-child {margin-bottom:16px}
/* ＋／− アイコン（開くと回転しながら−に変わる） */
#main-column #Journal .hk-pm {position:absolute;right:6px;top:50%;width:14px;height:14px;margin-top:-7px;transition:transform .35s ease}
#main-column #Journal .hk-pm::before, #main-column #Journal .hk-pm::after {content:"";position:absolute;left:0;top:6px;width:14px;height:2px;background:var(--hk-accent);transition:transform .35s ease}
#main-column #Journal .hk-pm::after {transform:rotate(90deg)}
#main-column #Journal .hk-details[open]:not(.is-closing) .hk-pm {transform:rotate(180deg)}
#main-column #Journal .hk-details[open]:not(.is-closing) .hk-pm::after {transform:rotate(0deg)}

/* FAQ */
#main-column #Journal .hk-faq .hk-details {margin:0;border-top:0}
#main-column #Journal .hk-faq .hk-details:first-child {border-top:1px solid var(--hk-line)}
#main-column #Journal .hk-faq summary::before {content:"Q.";color:var(--hk-accent);margin-right:8px}

/* ボタン */
#main-column #Journal .hk-btns {display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 0}
#main-column #Journal .hk-btn {display:inline-block;padding:12px 28px;border:1px solid var(--hk-ink);color:var(--hk-ink) !important;text-decoration:none !important;font-size:14px;letter-spacing:.08em;background:#fff}
#main-column #Journal .hk-btn:hover {background:var(--hk-ink);color:#fff !important;opacity:1}
#main-column #Journal .hk-btn--fill {background:var(--hk-ink);color:#fff !important}
#main-column #Journal .hk-btn--fill:hover {background:var(--hk-accent);border-color:var(--hk-accent)}

/* ハナリロのサポート */
#main-column #Journal .hk-support {background:var(--hk-bg);padding:32px;margin:0 0 64px}
#main-column #Journal .hk-support ul {display:grid;grid-template-columns:repeat(4,1fr);gap:16px;list-style:none;margin:16px 0 0;padding:0}
#main-column #Journal .hk-support li {background:#fff;padding:16px;font-size:13px;line-height:1.7}
#main-column #Journal .hk-support li strong {display:block;font-size:14px;margin-bottom:4px}

/* シリーズナビ */
#main-column #Journal .hk-series {border-top:1px solid var(--hk-ink);padding-top:28px}
#main-column #Journal .hk-series ul {display:grid;grid-template-columns:repeat(3,1fr);gap:0;list-style:none;margin:12px 0 0;padding:0}
#main-column #Journal .hk-series li a {display:block;padding:12px 4px;border-bottom:1px solid var(--hk-line);color:var(--hk-ink);text-decoration:none;font-size:14px}
#main-column #Journal .hk-series li a::after {content:" →";color:var(--hk-accent)}
#main-column #Journal .hk-series li a[aria-current] {color:var(--hk-sub)}
#main-column #Journal .hk-series li a[aria-current]::after {content:"（このページ）";font-size:11px}
#main-column #Journal .hk-contact {font-size:13px;color:var(--hk-sub);margin-top:24px}

/* アンカー移動をなめらかに */
#main-column #Journal html {scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){#main-column #Journal html {scroll-behavior:auto}#main-column #Journal .hk-pm, #main-column #Journal .hk-pm::before, #main-column #Journal .hk-pm::after {transition:none}}

/* 色の意味 */
#main-column #Journal .hk-colors {display:grid;grid-template-columns:repeat(5,1fr);gap:16px;list-style:none;margin:0;padding:0}
#main-column #Journal .hk-colors li {border:1px solid var(--hk-line);background:#fff;padding:0 0 16px}
#main-column #Journal .hk-colors li::before {content:"";display:block;height:56px;background:var(--hk-c,#ccc);margin-bottom:12px}
#main-column #Journal .hk-colors strong, #main-column #Journal .hk-colors p, #main-column #Journal .hk-colors a {display:block;padding:0 14px}
#main-column #Journal .hk-colors p {font-size:13px;color:var(--hk-sub);margin:4px 0 8px}
#main-column #Journal .hk-colors a {font-size:13px}
#main-column #Journal .hk-c-pink {--hk-c:#ecc6c8}#main-column #Journal .hk-c-yellow {--hk-c:#f1d38a}#main-column #Journal .hk-c-red {--hk-c:#b5474a}#main-column #Journal .hk-c-blue {--hk-c:#9fb6cf}#main-column #Journal .hk-c-white {--hk-c:#f4f1ea}
/* チェックリスト */
#main-column #Journal .hk-check {list-style:none;margin:0;padding:0;border-top:1px solid var(--hk-line)}
#main-column #Journal .hk-check li {position:relative;padding:14px 0 14px 34px;border-bottom:1px solid var(--hk-line);font-size:14px}
#main-column #Journal .hk-check li::before {content:"";position:absolute;left:4px;top:19px;width:16px;height:16px;border:1px solid var(--hk-accent)}
#main-column #Journal .hk-check li::after {content:"";position:absolute;left:9px;top:21px;width:6px;height:10px;border:solid var(--hk-accent);border-width:0 2px 2px 0;transform:rotate(45deg)}
#main-column #Journal .hk-check strong {display:block;font-size:15px}

/* スマホ */
@media (max-width:767px){
  #main-column #Journal .hk {font-size:14px;padding:0 4px 32px}
  #main-column #Journal .hk-hero {grid-template-columns:1fr;gap:20px;padding-top:8px;margin-bottom:32px}
  #main-column #Journal .hk-hero__img {order:-1}
  #main-column #Journal .hk-hero__title {font-size:22px !important}
  #main-column #Journal .hk-h3 {font-size:19px}
  #main-column #Journal .hk-toc ol {columns:1}
  #main-column #Journal .hk-cards, #main-column #Journal .hk-cards--2, #main-column #Journal .hk-points {grid-template-columns:1fr}
  #main-column #Journal .hk-ng li {grid-template-columns:96px 1fr;gap:16px}
  #main-column #Journal .hk-scene {grid-template-columns:1fr;gap:16px}
  #main-column #Journal .hk-scene__img {aspect-ratio:16/9}
  #main-column #Journal .hk-months {grid-template-columns:1fr 1fr}
  #main-column #Journal .hk-colors {grid-template-columns:1fr 1fr}
  #main-column #Journal .hk-support {padding:24px 16px}
  #main-column #Journal .hk-support ul {grid-template-columns:1fr 1fr}
  #main-column #Journal .hk-series ul {grid-template-columns:1fr}
  #main-column #Journal .hk-sec {margin-bottom:48px}
}

/* 余白調整 */
#main-column #Journal .hk-mt {margin-top:20px !important}
#main-column #Journal .hk-mb0 {margin-bottom:0 !important}

/* スクロールで現れる動き（data-aos）
   スクリプトが動いたときだけ .hk-aos が付くので、動かない環境でも内容は必ず表示されます */
#main-column #Journal .hk-aos .hk [data-aos] {opacity:0;transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
#main-column #Journal .hk-aos .hk [data-aos="fade-up"] {transform:translateY(28px)}
#main-column #Journal .hk-aos .hk [data-aos="fade-down"] {transform:translateY(-28px)}
#main-column #Journal .hk-aos .hk [data-aos="fade-left"] {transform:translateX(28px)}
#main-column #Journal .hk-aos .hk [data-aos="fade-right"] {transform:translateX(-28px)}
#main-column #Journal .hk-aos .hk [data-aos="zoom-in"] {transform:scale(.94)}
#main-column #Journal .hk-aos .hk [data-aos].aos-animate {opacity:1;transform:none}


/* ===== 文字サイズの統一（2026-10-19 スウィートマミー基準：本文14px・リード15px・注記13px・最小12px。元に戻すときはこの段落を消す） ===== */
#main-column #Journal .hk {font-size:14px}
#main-column #Journal .hk-label {font-size:12px}
#main-column #Journal .hk-ng__tag {font-size:12px}
#main-column #Journal .hk-badge {font-size:12px}
#main-column #Journal .hk-msgs li span {font-size:12px}
#main-column #Journal .hk-series li a[aria-current]::after {font-size:12px}
#main-column #Journal .hk-table thead th {font-size:13px}
#main-column #Journal .hk-small {font-size:13px}
#main-column #Journal .hk-month dd {font-size:14px}
#main-column #Journal .hk-support li {font-size:14px}
#main-column #Journal .hk-colors p {font-size:14px}
#main-column #Journal .hk-toc__title {font-size:12px}
