@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* ============================================================
   マカオ旅行メディア 記事スタイル  v3.0
   ------------------------------------------------------------
   設計方針
     1. 面は白。ただし「まとまりの境目」は必ず目で分かるようにする
        （v2.0は罫線を細くしすぎて、どこで話が変わったのか分からなくなった）
     2. 色は3系統だけ（本文の墨／ブランドの藍／独自情報の褐色）
        警告の赤のみ例外として使う
     3. 囲みは「見出しの帯 ＋ 白い本体 ＋ 1本の枠」で統一する
        帯があると、何のかたまりかが一目で分かる
     4. 装飾は情報の種類を示すためだけに使い、目立たせるためには使わない

   ブランドカラーを変えるときは --brand と --accent の2つだけ
   書き換えてください。ほかは触らなくても調和します。
   ============================================================ */

/* ============================================================
   テーマ側の装飾を一度落とす（Cocoon 共存用）
   ------------------------------------------------------------
   Cocoon は見出しと表に独自の背景・枠・擬似要素を当てています。
   そのままだと、この下で作る「帯＋白い本体＋1本の枠」と二重になり、
   境目がどこなのか読者に分からなくなります。
   いったん素に戻してから、下の規則で作り直します。
   ここより下の規則が後に来るので、必要な装飾は上書きで復活します。
   ============================================================ */
.entry-content h2,
.entry-content h3{
  background:none;
  border:none;
  box-shadow:none;
  padding:0;
  border-radius:0;
  counter-increment:none;
}
.entry-content h2::before, .entry-content h2::after,
.entry-content h3::before, .entry-content h3::after{ content:none }
.entry-content table{ background:none; box-shadow:none }
.entry-content figure{ margin-left:0; margin-right:0 }

:root{
  /* ---- 面 ---- */
  --paper:      #ffffff;   /* 紙。記事の背景は必ず白 */
  --tint:       #fafafb;   /* ごく薄い面 */
  --tint-2:     #f2f4f7;   /* 囲みの見出し帯・表の見出し行 */

  /* ---- 文字（墨） ---- */
  --ink:        #1a1d21;   /* 本文 */
  --ink-2:      #4e5560;   /* 補助・囲みの中の文章 */
  --ink-3:      #6f757f;   /* 注釈・出典・キャプション（白地でコントラスト比4.6:1） */

  /* ---- 罫線 ---- */
  --rule:       #d3d8de;   /* 囲みの枠・区切り */
  --rule-soft:  #e6e9ed;   /* 表の内側の罫 */

  /* ---- ブランド（深い藍。マカオのアズレージョに由来） ---- */
  --brand:      #1b4965;
  --brand-2:    #2c6485;   /* リンク */
  --brand-tint: #eef4f8;

  /* ---- 独自情報（くすんだ褐色。金より落ち着く） ---- */
  --accent:     #8a5a2b;
  --accent-tint:#faf4ec;

  /* ---- 例外 ---- */
  --alert:      #9c3b31;
  --alert-tint: #fbf1f0;
  --positive:   #1d6b4c;   /* 0円・無料など、良い数値 */

  --radius:     8px;
}

/* ============================================================
   本文の基本
   ============================================================ */
.entry-content{
  max-width:720px;                 /* 日本語で1行40字前後。これ以上広げない */
  margin-inline:auto;              /* テーマの本文カラムが広いときに中央へ寄せる */
  color:var(--ink);
  font-size:17px;
  line-height:1.9;
  letter-spacing:.01em;
  font-feature-settings:"palt";
  word-break:normal;
  overflow-wrap:anywhere;
  line-break:strict;
}
@media(max-width:640px){
  .entry-content{ font-size:16.5px; line-height:1.88 }
}
.entry-content p{ margin:0 0 1.55em }
.entry-content strong{ font-weight:700 }

.entry-content a{
  color:var(--brand-2);
  text-decoration:underline;
  text-decoration-color:rgba(44,100,133,.35);
  text-underline-offset:4px;
  text-decoration-thickness:1px;
  transition:text-decoration-color .15s;
}
.entry-content a:hover{ text-decoration-color:var(--brand-2) }

/* ---------- 見出し ---------- */
/* セクションの変わり目は、①上の区切り線 ②広い余白 ③左の色棒 の3つで示す。
   ひとつでも欠けると、スクロール中に話の切れ目を見落とします。 */
.entry-content h2{
  position:relative;
  margin:4em 0 1.25em;
  padding:.62em .5em .62em .95em;
  font-size:21px;
  line-height:1.55;
  font-weight:700;
  letter-spacing:.01em;
  color:var(--ink);
  border-left:5px solid var(--brand);
  border-radius:0 var(--radius) var(--radius) 0;
  background:linear-gradient(90deg,var(--brand-tint) 0%,rgba(238,244,248,0) 76%);
  scroll-margin-top:80px;
}
.entry-content h2::before{               /* セクションを分ける水平線 */
  content:"";
  position:absolute; left:-5px; right:0; top:-2em;
  height:1px; background:var(--rule);
}
.entry-content h2:first-child{ margin-top:0 }
.entry-content h2:first-child::before{ display:none }

.entry-content h3{
  margin:2.7em 0 .9em;
  padding-left:.75em;
  border-left:3px solid #a9bfcd;
  font-size:17.5px;
  line-height:1.6;
  font-weight:700;
  scroll-margin-top:80px;
}
@media(max-width:640px){
  .entry-content h2{ font-size:19.5px; margin:3.2em 0 1.1em }
  .entry-content h2::before{ top:-1.6em }
  .entry-content h3{ font-size:17px }
}

/* ---------- リスト ---------- */
.entry-content ul,
.entry-content ol{ margin:0 0 1.6em; padding-left:1.4em }
.entry-content li{ margin-bottom:.5em }
.entry-content li::marker{ color:var(--ink-3) }

/* ============================================================
   囲みの共通形
   「帯（何のかたまりか）＋ 白い本体 ＋ 1本の枠」
   ============================================================ */

/* ---------- 結論リード ---------- */
.entry-content p.lead{
  margin:0 0 2em;
  padding:.15em 0 .15em 1.15em;
  border-left:4px solid var(--brand);
  font-size:18.5px;
  line-height:1.85;
  font-weight:500;
  color:var(--ink);
}
@media(max-width:640px){ .entry-content p.lead{ font-size:17.5px } }

/* ---------- この記事でわかること ---------- */
.summary{
  margin:0 0 2.2em;
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  overflow:hidden;
}
.summary > p{
  margin:0;
  padding:.72em 1.3em;
  background:var(--tint-2);
  border-bottom:1px solid var(--rule);
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.09em;
  color:var(--ink-2);
}
.summary ul{ margin:0; padding:1.05em 1.4em 1.15em 2.6em }
.summary li{ margin-bottom:.5em; font-size:15.5px; line-height:1.8; color:var(--ink-2) }
.summary li:last-child{ margin-bottom:0 }
.summary strong{ color:var(--ink) }

/* ============================================================
   独自情報
   ============================================================ */
.exclusive{
  margin:0 0 2.4em;
  background:var(--paper);
  border:1px solid var(--rule);
  border-left:4px solid var(--accent);
  border-radius:0 var(--radius) var(--radius) 0;
  overflow:hidden;
}
.exclusive .exclusive-hd{
  margin:0;
  padding:.72em 1.3em;
  background:var(--accent-tint);
  border-bottom:1px solid var(--rule);
  font-size:12.5px;
  letter-spacing:.09em;
  color:var(--accent);
}
.exclusive .exclusive-hd strong{ font-weight:700 }
.exclusive ol{ margin:0; padding:1.05em 1.4em 1.15em 2.7em }
.exclusive li{ margin-bottom:.55em; font-size:15.5px; line-height:1.8; color:var(--ink-2) }
.exclusive li::marker{ color:var(--accent); font-weight:700 }
.exclusive li:last-child{ margin-bottom:0 }
.exclusive a{ color:var(--ink); text-decoration-color:rgba(138,90,43,.4) }
.exclusive a:hover{ text-decoration-color:var(--accent) }

/* ---------- ★POINT ---------- */
/* 表を内側に置くことがあるので overflow:hidden は使わない
   （1列目の固定が効かなくなるため）。角丸は子要素側で作る */
.point{
  margin:2.6em 0;
  padding:0;
  background:var(--paper);
  border:1px solid var(--rule);
  border-left:4px solid var(--accent);
  border-radius:0 var(--radius) var(--radius) 0;
}
.point > .point-label{
  margin:0;
  padding:.72em 1.3em;
  background:var(--accent-tint);
  border-bottom:1px solid var(--rule);
  border-radius:0 calc(var(--radius) - 1px) 0 0;
  font-size:12.5px;
  letter-spacing:.07em;
  color:var(--accent);
  line-height:1.6;
}
.point > .point-label strong{ font-weight:700 }
.point > .point-body{
  padding:1.2em 1.4em 1.3em;
  font-size:16.5px; line-height:1.88; color:var(--ink);
}
.point > .point-body > *:last-child{ margin-bottom:0 }
.point > .point-body p{ margin:0 0 1.1em }
.point > .point-body .table-intro{ margin-top:0 }
.point .point-src{
  display:block; margin:1.1em 0 0; padding-top:.9em;
  border-top:1px solid var(--rule-soft);
  font-size:13px; line-height:1.75; color:var(--ink-3);
}
/* 種類の違いは、ラベルの言葉で分かる。色は変えない。
   ただし「知らないと損」だけは性質が違うので赤にする */
.point-caution{ border-left-color:var(--alert) }
.point-caution > .point-label{ color:var(--alert); background:var(--alert-tint) }

/* ---------- 用語ミニ辞典 ---------- */
/* 語と語の境目が分からないという指摘を受け、1語ごとに区切り線を入れる */
.glossary{
  margin:0 0 2.4em;
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  overflow:hidden;
}
.glossary > p{
  margin:0;
  padding:.72em 1.3em;
  background:var(--tint-2);
  border-bottom:1px solid var(--rule);
  font-size:12.5px; font-weight:700; letter-spacing:.09em; color:var(--ink-2);
}
.glossary dl{
  display:grid; grid-template-columns:10em 1fr; margin:0;
}
.glossary dt{
  padding:.85em .6em .85em 1.3em;
  border-top:1px solid var(--rule-soft);
  font-size:15px; font-weight:700; color:var(--brand); line-height:1.7;
}
.glossary dd{
  margin:0;
  padding:.85em 1.3em .85em 0;
  border-top:1px solid var(--rule-soft);
  font-size:15px; line-height:1.8; color:var(--ink-2);
}
.glossary dt:first-of-type,
.glossary dt:first-of-type + dd{ border-top:none }
.glossary .gloss-note{
  display:block; margin-top:.35em; font-size:13.5px; color:var(--ink-3);
}
@media(max-width:640px){
  .glossary dl{ grid-template-columns:1fr }
  .glossary dt{ padding:.9em 1.2em .1em; border-top:1px solid var(--rule-soft) }
  .glossary dd{ padding:0 1.2em .9em; border-top:none }
  .glossary dt:first-of-type{ border-top:none }
}

/* ============================================================
   表
   ============================================================ */
.table-intro{ margin:2.4em 0 .7em; color:var(--ink); font-size:16.5px }
.tablewrap{
  position:relative; overflow-x:auto; margin:0 0 .7em;
  border:1px solid var(--rule); border-radius:var(--radius);
  -webkit-overflow-scrolling:touch;
}
.entry-content table.datatable{
  width:100%; min-width:400px; border-collapse:collapse;
  font-size:15.5px; margin:0; display:table; white-space:normal;
}
.entry-content table.datatable caption{
  text-align:left; padding:.7em 1em;
  background:var(--tint);
  border-bottom:1px solid var(--rule);
  font-size:12.5px; font-weight:700; letter-spacing:.06em; color:var(--ink-2);
}
.entry-content table.datatable th,
.entry-content table.datatable td{
  padding:.75em .95em;
  text-align:left; vertical-align:middle;
  border:none; border-bottom:1px solid var(--rule-soft);
  line-height:1.65;
}
.entry-content table.datatable thead th{
  background:var(--tint-2);
  font-size:13.5px; font-weight:700; color:var(--ink-2);
  letter-spacing:.02em; white-space:nowrap;
  border-bottom:1px solid var(--rule);
}
.entry-content table.datatable tbody th{
  font-weight:600; color:var(--ink); white-space:nowrap;
}
.entry-content table.datatable tbody tr:last-child th,
.entry-content table.datatable tbody tr:last-child td{ border-bottom:none }
.entry-content table.datatable .free{ color:var(--positive); font-weight:700 }
.entry-content .tnote{
  font-size:13px; line-height:1.75; color:var(--ink-3); margin:0 0 2.4em;
}

/* モバイルで横スクロールしても1列目が残る */
@media(max-width:720px){
  .entry-content table.sticky-col tbody th,
  .entry-content table.sticky-col thead th:first-child{
    position:sticky; left:0; z-index:1; background:var(--paper);
  }
  .entry-content table.sticky-col thead th:first-child{ background:var(--tint-2) }
  .entry-content table.sticky-col tbody th::after,
  .entry-content table.sticky-col thead th:first-child::after{
    content:""; position:absolute; top:0; right:0; width:1px; height:100%;
    background:var(--rule);
  }
  .tablewrap::after{
    content:""; position:absolute; top:0; right:0; width:22px; height:100%;
    background:linear-gradient(90deg,rgba(255,255,255,0),var(--paper));
    pointer-events:none;
  }
}

/* ============================================================
   SVG図解
   ============================================================ */
figure.diagram{
  margin:2.4em 0;
  padding:1.4em 1.2em 1.1em;
  border:1px solid var(--rule);
  border-radius:var(--radius);
  background:var(--paper);
}
figure.diagram svg.dia{
  width:100%; height:auto; display:block; max-width:600px; margin:0 auto;
}
figure.diagram figcaption{
  margin-top:1em; padding-top:.8em;
  border-top:1px solid var(--rule-soft);
  font-size:13px; line-height:1.7; color:var(--ink-3); text-align:center;
}
svg.dia .d-box rect       { fill:var(--paper); stroke:#b8c0c9; stroke-width:1.25 }
svg.dia .d-box-brand rect { fill:var(--brand-tint); stroke:var(--brand); stroke-width:1.25 }
svg.dia .d-line path      { stroke:#cfd5dc; stroke-width:1.5; fill:none }
svg.dia .d-arrow path     { stroke:#a9b2bc; stroke-width:1.6; fill:none }
svg.dia .d-arrow-head     { fill:#a9b2bc }
svg.dia text{
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;
}
svg.dia .d-label text     { fill:var(--ink);   font-size:13.5px; font-weight:600 }
svg.dia .d-label-inv text { fill:var(--brand); font-size:13.5px; font-weight:600 }
svg.dia .d-sub text       { fill:var(--ink-3); font-size:12px;   font-weight:600 }
svg.dia .d-value text     { fill:var(--ink);   font-size:13.5px; font-weight:700 }
svg.dia .d-value .d-free-tx{ fill:var(--positive) }
svg.dia .d-free rect      { fill:none; stroke:var(--positive); stroke-width:1.25 }
svg.dia .d-free text      { fill:var(--positive); font-size:13px; font-weight:700 }
svg.dia .d-bar rect       { fill:#93aec1 }
svg.dia .d-bar-free rect  { fill:var(--positive) }
svg.dia .d-bar-alert rect { fill:#bd8279 }
svg.dia .d-step circle    { fill:var(--paper); stroke:var(--brand); stroke-width:1.4 }
svg.dia .d-step-tx text   { fill:var(--brand); font-size:12.5px; font-weight:700 }

/* ---------- 手順 ---------- */
.entry-content ol.steps{
  counter-reset:s; list-style:none; padding:0; margin:1.9em 0;
  border:1px solid var(--rule); border-radius:var(--radius);
}
.entry-content ol.steps li{
  counter-increment:s; position:relative;
  padding:1.05em 1.3em 1.05em 3.5em; margin:0;
  border-top:1px solid var(--rule-soft);
  font-size:16.5px; line-height:1.85;
}
.entry-content ol.steps li:first-child{ border-top:none }
.entry-content ol.steps li::before{
  content:counter(s); position:absolute; left:1.25em; top:1.15em;
  width:1.75em; height:1.75em; line-height:1.65em; text-align:center;
  border:1.4px solid var(--brand); border-radius:50%;
  color:var(--brand); font-size:13px; font-weight:700;
}

/* ---------- 画像 ---------- */
.entry-content figure{ margin:2.4em 0 }
.entry-content figure img{
  width:100%; height:auto; display:block;
  border:1px solid var(--rule); border-radius:var(--radius);
}
.entry-content figcaption{
  margin-top:.7em; font-size:13px; line-height:1.7; color:var(--ink-3);
}

/* ---------- 関連記事リンク ---------- */
.entry-content .rel{
  display:block; margin:2em 0; padding:.95em 1.2em;
  background:var(--tint); border:1px solid var(--rule);
  border-left:4px solid #a9bfcd; border-radius:0 var(--radius) var(--radius) 0;
  text-decoration:none; transition:background .15s, border-color .15s;
}
.entry-content .rel:hover{ background:var(--brand-tint); border-left-color:var(--brand) }
.entry-content .rel .l{
  display:block; font-size:11.5px; letter-spacing:.08em; color:var(--ink-3); font-weight:700;
}
.entry-content .rel .n{
  display:block; margin-top:.2em; font-size:15.5px; font-weight:600;
  color:var(--brand-2); line-height:1.65;
}

/* ---------- FAQ ---------- */
/* 1問1答をカードにする。質問は帯、答えは白。境目をはっきりさせる */
.faq h3{
  margin:1.1em 0 0;
  padding:.85em 1.15em .85em 2.9em;
  position:relative;
  border:1px solid var(--rule); border-bottom:none;
  border-radius:var(--radius) var(--radius) 0 0;
  background:var(--tint-2);
  font-size:16px; font-weight:700; line-height:1.7; color:var(--ink);
}
.faq h3:first-child{ margin-top:0 }
.faq h3::before{
  content:"Q"; position:absolute; left:1.15em; top:.85em;
  color:var(--brand); font-size:14.5px; font-weight:700;
}
.faq h3 + p{
  margin:0 0 1.3em;
  padding:.95em 1.15em 1em 2.9em;
  position:relative;
  border:1px solid var(--rule);
  border-radius:0 0 var(--radius) var(--radius);
  background:var(--paper);
  font-size:16px; line-height:1.85; color:var(--ink-2);
}
.faq h3 + p::before{
  content:"A"; position:absolute; left:1.15em; top:.95em;
  color:var(--accent); font-size:14.5px; font-weight:700;
}

/* ---------- この記事の調べ方 ---------- */
.method{
  margin:2.6em 0 0;
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  overflow:hidden;
}
.method > p{
  margin:0; padding:.72em 1.3em;
  background:var(--tint-2); border-bottom:1px solid var(--rule);
  font-size:12.5px; font-weight:700; letter-spacing:.09em; color:var(--ink-2);
}
.method ul{ margin:0; padding:1.05em 1.4em 1.15em 2.6em }
.method li{ margin-bottom:.45em; font-size:14.5px; line-height:1.8; color:var(--ink-2) }
.method li:last-child{ margin-bottom:0 }

/* ---------- カジノ記事の注意書き ---------- */
.casino-notice{
  margin:2.4em 0 0; padding:1.1em 1.35em;
  background:var(--alert-tint); border:1px solid var(--rule);
  border-left:4px solid var(--alert); border-radius:0 var(--radius) var(--radius) 0;
  font-size:14px; line-height:1.85; color:var(--ink-2);
}
.casino-notice strong{ color:var(--alert); font-weight:700 }

/* ---------- 出典 ---------- */
.entry-content ul.sources{
  margin:.6em 0 0; padding:1.1em 1.4em 1.2em 2.7em;
  background:var(--tint); border:1px solid var(--rule); border-radius:var(--radius);
  font-size:14px;
}
.entry-content ul.sources li{ margin-bottom:.5em; line-height:1.8; color:var(--ink-2) }
.entry-content ul.sources li:last-child{ margin-bottom:0 }

/* ---------- 更新履歴 ---------- */
.update-log{
  margin-top:2.6em; padding-top:1.3em; border-top:1px solid var(--rule);
  font-size:13px; color:var(--ink-3);
}
.update-log > p{ margin:0 0 .4em; font-weight:700; letter-spacing:.06em }
.update-log ul{ margin:0; padding-left:1.25em }
.update-log li{ margin-bottom:.3em; line-height:1.75 }

/* ---------- 印刷 ---------- */
@media print{
  .entry-content{ font-size:11pt; max-width:none }
  .point,.exclusive,.glossary,.summary,.method,figure,.faq h3{ break-inside:avoid }
  .faq h3{ break-after:avoid }
  .entry-content a{ text-decoration:none; color:var(--ink) }
  .rel{ display:none }
}
add_action('init', function () {
    $keys = ['article_id', 'primary_keyword', 'verified_at', 'verified_by',
             'author_name', 'reading_min', 'jsonld'];
    foreach ($keys as $k) {
        register_post_meta('post', $k, [
            'show_in_rest'  => true,
            'single'        => true,
            'type'          => 'string',
            'auth_callback' => function () { return current_user_can('edit_posts'); },
        ]);
    }
});

add_action('wp_head', function () {
    if (!is_singular()) return;
    $json = get_post_meta(get_the_ID(), 'jsonld', true);
    if ($json) {
        echo '<script type="application/ld+json">' . $json . '</script>' . "\n";
    }
});