@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* === Kurashi-Tabijitaku brand palette ===
   Same palette as pin images (tools/pin_generator/generate.py).
   Goal: cognitive fluency - the site must look like the pin. */
:root {
	--kt-bg: #FAF6F0;
	--kt-ink: #2D2926;
	--kt-card: #FFFFFF;
	--kt-edge: #E6DED4;
	--kt-travel: #2E8BA6;
	--kt-storage: #D96C4A;
	--kt-beauty: #A8608E;
	--color_main: var(--kt-ink);
	--color_htag: var(--kt-ink);
	--color_text: var(--kt-ink);
	--color_bg: var(--kt-bg);
	--color_link: #1F6B80;
	--color_border: rgba(45,41,38,.16);
	--color_main_thin: rgba(217,108,74,.08);
	--color_main_dark: #B5563A;
}
body { background-color: var(--kt-bg); }
.l-content, .p-articleThumb, .c-postThumb__figure { background-color: transparent; }
.l-mainContent__inner, .p-postList__item, .c-widget, .l-articleBottom { background-color: var(--kt-card); }
.post_content h2 { border-color: var(--kt-storage); }
.post_content h3 { border-color: var(--kt-edge); }
.swell-block-button__link, .c-tabList__button.is-active { background-color: var(--kt-storage); color: #fff; }
.swell-block-button__link:hover { background-color: var(--kt-storage); filter: brightness(1.08); }
.c-categoryLabel[href*="/travel"], .p-articleThumb__cat[href*="/travel"] { background-color: var(--kt-travel); }
.c-categoryLabel[href*="/storage"], .p-articleThumb__cat[href*="/storage"] { background-color: var(--kt-storage); }
.c-categoryLabel[href*="/beauty"], .p-articleThumb__cat[href*="/beauty"] { background-color: var(--kt-beauty); }
.l-header { background-color: var(--kt-bg); border-bottom: 1px solid var(--kt-edge); }
.l-footer { background-color: var(--kt-ink); color: var(--kt-bg); }
.l-footer a { color: var(--kt-bg); }
/* ad disclosure box shown at the top of every monetised article */
.kt-pr { display:block; margin:0 0 1.6em; padding:.6em .9em; font-size:.82em; line-height:1.7; color:#5A5450; background:rgba(45,41,38,.04); border-left:3px solid var(--kt-edge); border-radius:2px; }
/* mobile first: most Pinterest traffic is phone; CTA in thumb reach */
@media (max-width: 599px) {
	.swell-block-button__link { width:100%; padding-top:.9em; padding-bottom:.9em; font-size:1.02em; }
	.post_content h2 { font-size:1.28em; }
}

/* Headings: match the pin layout (ink text + terracotta rule), not a filled bar */
.post_content h2 {
	background-color: transparent;
	color: var(--kt-ink);
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: 3px solid var(--kt-storage);
	padding: .2em 0 .4em;
	margin-top: 2.4em;
}
.post_content h2::before, .post_content h2::after { display: none; }
.post_content h3 {
	border-left: 4px solid var(--kt-storage);
	border-bottom: none;
	padding-left: .7em;
	margin-top: 2em;
}
.post_content h3::before, .post_content h3::after { display: none; }

/* === CTA / accessibility (Codex R3 research/12 + Claude contrast check) ===
   #D96C4A on white = 3.39:1 -> fails WCAG AA (4.5:1). Decorative use only.
   #B84F32 on white = 5.00:1 -> passes AA. Use for action buttons.        */
:root{
	--kt-cta: #B84F32;
	--kt-cta-hover: #A9442B;
}
.kt-cta,
.post_content a.kt-cta{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	padding: .8em 1.2em;
	margin: 1.6em auto;
	max-width: 480px;
	background: var(--kt-cta);
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	border-radius: 8px;
	box-shadow: 0 2px 0 rgba(0,0,0,.12);
}
.kt-cta:hover,
.post_content a.kt-cta:hover{ background: var(--kt-cta-hover); color:#fff; }
.kt-cta + .kt-cta{ margin-top: 8px; }

/* readable body text on mobile (16px / 1.75, target 18-22 chars per line) */
.post_content{ font-size: 16px; line-height: 1.75; }
@media (max-width: 480px){
	.post_content{ font-size: 16px; }
	.kt-cta{ width: 100%; max-width: none; }
}

/* comparison tables must scroll inside themselves, never the page */
.post_content .scroll-hint,
.post_content table{ max-width: 100%; }
.post_content .kt-table-wrap{ overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* SWELL uses --swl-fz--content: 4vw (=15.6px at 390px).
   research/12 requires 16px+ body text. Fix the variable itself. */
:root{ --swl-fz--content: 16px; }
@media (min-width:960px){ :root{ --swl-fz--content: 17px; } }

/* === front page === */
.kt-hero{ padding: 2.4em 0 1.6em; text-align:center; }
.kt-hero-lead{ font-size:1.5em; font-weight:700; line-height:1.6; color:var(--kt-ink); margin:0 0 .6em; }
.kt-hero-sub{ font-size:.95em; color:rgba(45,41,38,.75); margin:0; }
.kt-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:1.2em 0 2em; }
.kt-card{ display:flex; flex-direction:column; gap:.4em; padding:1.1em 1em; background:#fff;
	border:1px solid var(--kt-edge); border-top:4px solid var(--kt-storage);
	border-radius:8px; text-decoration:none; color:var(--kt-ink); }
.kt-card:hover{ box-shadow:0 4px 12px rgba(45,41,38,.10); color:var(--kt-ink); }
.kt-card--travel{ border-top-color:var(--kt-travel); }
.kt-card--storage{ border-top-color:var(--kt-storage); }
.kt-card--beauty{ border-top-color:var(--kt-beauty); }
.kt-card-label{ font-weight:700; font-size:1.05em; }
.kt-card-desc{ font-size:.85em; line-height:1.6; color:rgba(45,41,38,.72); }
.kt-policy-box{ background:rgba(45,41,38,.03); border:1px solid var(--kt-edge);
	border-radius:8px; padding:1.2em 1.3em; font-size:.92em; line-height:1.8; }
.kt-policy-box ul{ margin:.6em 0; }
.kt-note{ font-size:.82em; line-height:1.7; color:rgba(45,41,38,.65); margin-top:2em; }
@media (max-width:600px){
	.kt-cards{ grid-template-columns:1fr; }
	.kt-hero-lead{ font-size:1.28em; }
}
