@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.2
*/
/************************************
** C案 ナイトタンク（2026-11-03）
** 濃紺ベース＋水色アクセント。記事本文は読みやすさ優先で白い紙面のまま。
************************************/
:root{
  --nt-bg:#0A1520;
  --nt-surface:#0F1D2B;
  --nt-line:#1C2F42;
  --nt-text:#E4EDF3;
  --nt-sub:#94A8B8;
  --nt-accent:#5CC8E0;
  --nt-accent-ink:#06202B;
}

/* 全体 */
body{background-color:var(--nt-bg);color:var(--nt-text)}
.content,.content-in{background:transparent}
.home .main,.archive .main,.search .main,.error404 .main{background:transparent;color:var(--nt-text);border:none;padding:0}
.archive-title,.search-title{color:var(--nt-text)}

/* ヘッダー */
.header-container,.header-container-in,.header,.navi,.navi-in > ul .sub-menu{background-color:var(--nt-bg)}
.header-container{border-bottom:1px solid var(--nt-line)}
.site-name-text,.site-name-text-link,.logo-text a{color:#fff}
.site-name-text{font-weight:700;letter-spacing:.06em}
.navi-in a{color:#fff}
.navi-in a:hover{background-color:var(--nt-surface);color:#fff}
.navi-in .item-description{color:var(--nt-accent);letter-spacing:.2em;font-size:10px;opacity:1}
.navi-in > ul{flex-wrap:nowrap}
.navi-in > ul > li{width:auto}
.navi-in > ul > li > a{padding:0 18px}

/* アピールエリア（トップの大きな写真） */
.appeal{position:relative;background-position:center 55%}
.appeal::before{content:"";position:absolute;inset:0;background:rgba(5,14,24,.55)}
.appeal-in{position:relative;display:flex;align-items:center;justify-content:flex-start}
.appeal-content{background:transparent;color:#fff;text-align:left;max-width:720px;margin:0;padding:0 0 0 8px;border:none;word-break:keep-all;overflow-wrap:anywhere}
.appeal-content::before{content:"AQUARIUM JOURNAL";display:block;color:var(--nt-accent);font-size:14px;letter-spacing:.4em;margin-bottom:18px}
.appeal-title{color:#fff;font-size:42px;line-height:1.45;font-weight:700;text-align:left}
.appeal-message{color:#D2DEE6;font-size:16px;line-height:1.9;text-align:left}
.appeal-button{color:var(--nt-accent-ink);font-weight:700;border-radius:999px;padding:14px 30px;margin-top:8px}
.appeal-button:hover{opacity:.9;color:var(--nt-accent-ink)}

/* おすすめカード（カテゴリーへの入口） */
.recommended{background:transparent;padding-top:40px}
.navi-entry-card-link{border-radius:14px;overflow:hidden;border:1px solid var(--nt-line)}
.navi-entry-card{background:var(--nt-surface)}
.navi-entry-card-title{color:#fff;letter-spacing:.12em}

/* 新着記事カード */
.home #list::before{content:"LATEST";display:block;width:100%;order:-2;color:var(--nt-accent);font-size:13px;letter-spacing:.4em;margin:8px 0 4px}
.home #list::after{content:"新着記事";display:block;width:100%;order:-1;color:#fff;font-size:26px;font-weight:700;margin:0 0 20px}
.home #list{position:relative}
.entry-card-wrap{background:var(--nt-surface);border:1px solid var(--nt-line);border-radius:14px;overflow:hidden;color:var(--nt-text)}
.entry-card-wrap:hover{background:var(--nt-surface);border-color:#3C6A86}
.ect-vertical-card .entry-card-wrap{padding:0}
.ect-vertical-card .entry-card-content{padding:16px 18px 18px}
.entry-card-title{color:var(--nt-text);font-size:16px;line-height:1.65}
.entry-card-snippet{color:var(--nt-sub)}
.entry-card-meta,.post-date,.post-update,.entry-card-info{color:var(--nt-sub)}
.cat-label{background:transparent;color:var(--nt-accent);border:1px solid var(--nt-accent);border-radius:999px;top:10px;left:10px;padding:2px 10px;background-color:rgba(6,16,26,.75)}
.e-card-info .post-date,.e-card-info .post-update{color:var(--nt-sub)}

/* ページ送り */
.pagination .page-numbers,.pagination-next-link{background:var(--nt-surface);border:1px solid var(--nt-line);color:var(--nt-text)}
.pagination .current{background:var(--nt-accent);color:var(--nt-accent-ink);border-color:var(--nt-accent)}
.pagination-next-link:hover,.pagination .page-numbers:hover{background:#13263A;color:#fff}

/* 記事・固定ページは白い紙面 */
.single .main,.page .main{background:#fff;color:#333;border-radius:14px;border:none}
.single .main a,.page .main a{color:#1A6E86}
.article h2{background:var(--nt-surface);color:#fff;border-left:6px solid var(--nt-accent);border-radius:4px}
.article h3{border-left:6px solid var(--nt-accent);border-bottom:1px solid #D5E2EA}
.breadcrumb,.breadcrumb a{color:#5A6C78}

/* サイドバー */
.sidebar{background:transparent;color:var(--nt-text)}
.sidebar .widget{background:var(--nt-surface);border:1px solid var(--nt-line);border-radius:14px;padding:18px}
.sidebar h3,.widget-sidebar-title{background:transparent;color:#fff;border:none;border-bottom:1px solid var(--nt-line);padding:0 0 10px;margin:0 0 12px}
.sidebar a,.sidebar .widget_recent_entries ul li a,.sidebar .widget_categories ul li a{color:var(--nt-text)}
.sidebar a:hover{color:var(--nt-accent);background:transparent}
.sidebar .widget-entry-card-link,.sidebar .popular-entry-card-link{color:var(--nt-text)}
.sidebar .widget-entry-card-title,.sidebar .popular-entry-card-title{color:var(--nt-text)}
.sidebar .post-count{color:var(--nt-sub)}
.sidebar .search-edit{background:#0A1520;border:1px solid var(--nt-line);color:#fff;border-radius:999px}
.sidebar .search-submit{color:var(--nt-accent)}
.sidebar .textwidget{color:var(--nt-text)}
.ad-label{color:var(--nt-sub)}

/* フッター */
.footer,.footer-container{background-color:var(--nt-bg);color:var(--nt-sub);border-top:1px solid var(--nt-line)}
.footer a,.footer .site-name-text,.navi-footer-in a{color:var(--nt-sub)}
.footer a:hover,.navi-footer-in a:hover{color:var(--nt-accent);background:transparent}

/* スマホの下部メニュー */
.mobile-menu-buttons{background-color:var(--nt-bg);border-top:1px solid var(--nt-line);color:#fff}
.mobile-menu-buttons .menu-button > a,.mobile-menu-buttons .menu-button{color:#fff}
.mobile-header-menu-buttons{background-color:var(--nt-bg)}
.go-to-top-button{background-color:var(--nt-surface);color:var(--nt-accent);border:1px solid var(--nt-line)}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1024px以上：カードの間にすき間*/
@media screen and (min-width: 1024px){
  .home #list.ect-vertical-card{gap:20px 16px}
  .home #list.ect-vertical-card > .entry-card-wrap,.home #list.ect-vertical-card > .ad-area{margin:0;width:calc((100% - 32px) / 3)}
}

/*1023px以下*/
@media screen and (max-width: 1023px){
  .appeal-title{font-size:32px}
}

/*834px以下*/
@media screen and (max-width: 834px){
  .single .main,.page .main{border-radius:0}
  .home .main,.archive .main,.search .main{padding:0 12px}
}

/*480px以下*/
@media screen and (max-width: 480px){
  .appeal-title{font-size:24px}
  .appeal-message{font-size:14px}
  .appeal-content::before{font-size:11px;margin-bottom:10px}
  .home #list::after{font-size:21px}
}