@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
*/

/* ============================================================
   fortystar OUTDOORS
   1. 変数・フォント  2. 記事タイトルと見出し  3. 記事本文のレイアウト
   4. 写真パターン  5. 目次  6. モバイル
   ============================================================ */

/* ---------- 1. 変数・フォント ---------- */
html:root {
	--swl-font_family: "Hanken Grotesk", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}
:root {
	--fs-accent: #0F2DB3;
	--fs-ink: #14181C;
	--fs-text: #23282D;
	--fs-sub: #5E666D;
	--fs-line: #E3E6E8;
	--fs-head: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
	--fs-num: "Hanken Grotesk", sans-serif;
	--fs-gutter: 200px;
	--fs-gap: 32px;
	--fs-col: 720px;
	--fs-media: 1016px;
	--fs-offset: calc(var(--fs-gutter) + var(--fs-gap));
}
body { color: var(--fs-text); overflow-x: clip; }

/* ---------- 2. 記事タイトルと見出し ---------- */
.c-postTitle__ttl,
.post_content h2 {
	font-family: var(--fs-head);
	font-weight: 900;
	color: var(--fs-ink);
}
.c-postTitle__ttl { font-size: clamp(26px, 3vw, 38px); line-height: 1.45; }
.post_content { font-size: 17px; line-height: 1.95; }
.post_content h2 { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.5; padding: 0; background: none; border: 0; }
.post_content h3 { font-size: 20px; font-weight: 700; line-height: 1.6; color: var(--fs-ink); padding: 0; background: none; border: 0; }
.post_content h2::before, .post_content h2::after,
.post_content h3::after { display: none; }

/* ---------- 3. 記事本文のレイアウト（PC） ---------- */
@media (min-width: 1100px) {
	.single .post_content { counter-reset: fs-h2 fs-h3; }
	.single .post_content > * {
		max-width: var(--fs-col);
		margin-left: var(--fs-offset);
		margin-right: 0;
	}
	/* 見出し：番号は左ガターに */
	.single .post_content > h2 {
		counter-increment: fs-h2;
		counter-reset: fs-h3;
		position: relative;
		margin-top: 96px;
		margin-bottom: 24px;
	}
	.single .post_content > h2::before {
		display: block;
		content: counter(fs-h2, decimal-leading-zero);
		position: absolute;
		left: calc(-1 * var(--fs-offset));
		top: -0.1em;
		width: var(--fs-gutter);
		font-family: var(--fs-num);
		font-size: 56px;
		font-weight: 400;
		line-height: 1;
		color: var(--fs-ink);
	}
	.single .post_content > h3 {
		counter-increment: fs-h3;
		position: relative;
		margin-top: 64px;
		margin-bottom: 16px;
	}
	.single .post_content > h3::before {
		display: block;
		content: counter(fs-h2, decimal-leading-zero) "-" counter(fs-h3);
		position: absolute;
		left: calc(-1 * var(--fs-offset));
		top: 0.2em;
		width: var(--fs-gutter);
		font-family: var(--fs-num);
		font-size: 15px;
		font-weight: 500;
		letter-spacing: 0.04em;
		color: var(--fs-sub);
	}

	/* 写真・ギャラリー・カラム：広幅（1016px） */
	.single .post_content > figure.wp-block-image,
	.single .post_content > .wp-block-gallery,
	.single .post_content > .wp-block-columns,
	.single .post_content > .p-toc {
		max-width: var(--fs-media);
	}

	/* 全幅（ヒーロー・山頂の絶景など横位置のみ） */
	.single .post_content > .alignfull {
		max-width: none;
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}
}

/* ---------- 4. 写真パターン ---------- */
.single .post_content figure.wp-block-image { margin-top: 48px; margin-bottom: 48px; }
.single .post_content figure.wp-block-image img { display: block; width: 100%; height: auto; }
.single .post_content figcaption.wp-element-caption {
	margin: 8px 0 0;
	font-size: 13px;
	line-height: 1.7;
	text-align: left;
	color: var(--fs-sub);
}

@media (min-width: 1100px) {
	/* A: 広幅1枚。キャプションは左ガター */
	.single .post_content > figure.wp-block-image { position: relative; }
	.single .post_content > figure.wp-block-image figcaption.wp-element-caption {
		position: absolute;
		left: calc(-1 * var(--fs-offset));
		top: 0;
		width: var(--fs-gutter);
		margin: 0;
	}
	.single .post_content > figure.alignfull figcaption.wp-element-caption {
		position: static;
		width: auto;
		margin: 8px var(--fs-offset) 0;
	}
}
/* C: 時刻・場所（1行目＝時刻、2行目＝場所） */
.single .post_content figure.is-style-time figcaption::first-line {
	font-family: var(--fs-num);
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: var(--fs-ink);
}
.single .post_content figure.is-style-time figcaption { line-height: 1.6; }

/* B: 2枚並び／コンタクトシート（ギャラリーブロックの列数で決まる） */
.single .post_content .wp-block-gallery.has-nested-images {
	display: grid;
	gap: 8px;
	margin-top: 48px;
	margin-bottom: 48px;
}
.single .post_content .wp-block-gallery.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.single .post_content .wp-block-gallery.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.single .post_content .wp-block-gallery.has-nested-images figure.wp-block-image {
	width: auto;
	margin: 0;
	flex: none;
}
.single .post_content .wp-block-gallery.has-nested-images figure.wp-block-image img { object-fit: contain; }

/* 縦スロット（カラムブロックのスタイル） */
.single .post_content .wp-block-columns { gap: 32px; margin-top: 48px; margin-bottom: 48px; align-items: flex-start; }
.single .post_content .wp-block-columns figure.wp-block-image { margin: 0 0 8px; }
.single .post_content .wp-block-columns figure.wp-block-image:last-child { margin-bottom: 0; }
.single .post_content .wp-block-columns .wp-block-column > p:first-child { margin-top: 0; }
@media (min-width: 782px) {
	.single .post_content .wp-block-columns.is-style-fs-slot > .wp-block-column:first-child,
	.single .post_content .wp-block-columns.is-style-fs-slot-r > .wp-block-column:last-child {
		flex: 0 0 calc(33.333% - 21px);
	}
	.single .post_content .wp-block-columns.is-style-fs-slot > .wp-block-column:last-child,
	.single .post_content .wp-block-columns.is-style-fs-slot-r > .wp-block-column:first-child {
		flex: 1 1 0;
	}
	.single .post_content .wp-block-columns .wp-block-column { margin: 0; }
}

/* ---------- 5. 目次（SWELL自動目次） ---------- */
.single .post_content .p-toc {
	background: none;
	border: 0;
	border-top: 2px solid var(--fs-ink);
	border-bottom: 1px solid var(--fs-line);
	border-radius: 0;
	padding: 20px 0 24px;
	margin-top: 48px;
	margin-bottom: 48px;
}
.single .p-toc__ttl {
	font-family: var(--fs-num);
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.single .p-toc__list { columns: 2; column-gap: 40px; margin: 12px 0 0; padding: 0; }
.single .p-toc__list > li { break-inside: avoid; }

/* ---------- 6. モバイル・タブレット ---------- */
@media (max-width: 1099px) {
	.single .post_content > .wp-block-columns,
	.single .post_content > .wp-block-gallery { max-width: 100%; }
	.single .post_content > h2 { margin-top: 72px; }
	.single .post_content > h2::before {
		display: block;
		content: counter(fs-h2, decimal-leading-zero);
		font-family: var(--fs-num);
		font-size: 36px;
		font-weight: 400;
		line-height: 1.2;
	}
	.single .post_content { counter-reset: fs-h2; }
	.single .post_content > h2 { counter-increment: fs-h2; }
}
@media (max-width: 599px) {
	.single .post_content .wp-block-gallery.columns-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.single .p-toc__list { columns: 1; }
}


/* 10. fix: remove inner padding so offset=232 */
@media (min-width:1100px){.single .post_content{padding-left:0;padding-right:0}}

/* 11. gallery: fill grid cells */
.single .post_content .wp-block-gallery.has-nested-images{gap:16px}
.single .post_content .wp-block-gallery.has-nested-images figure.wp-block-image{width:100%!important;max-width:none;margin:0!important;flex:none}
.single .post_content .wp-block-gallery.has-nested-images figure.wp-block-image img{width:100%;height:auto;display:block}

/* 12. full-bleed fix */
@media (min-width:1100px){.single .post_content > .alignfull{left:auto!important;position:static;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw)!important}}

/* 13. logo / header / post head */
.c-headLogo__link{font-family:var(--fs-num);font-weight:500;letter-spacing:.06em;color:var(--fs-ink)}
.c-headLogo__link::after{content:"*";color:var(--fs-accent);margin-left:.08em;font-weight:500;font-size:1.5em;line-height:1;display:inline-block;transform:translateY(.18em)}
.l-header .c-gnav a,.c-gnav .ttl{font-size:13px;letter-spacing:.08em}
.single .p-articleHead.c-postTitle{padding:0}
.single .c-postTitle__date{display:none}
.single .c-postTitle__ttl{font-family:var(--fs-head);font-weight:900;line-height:1.35;letter-spacing:.02em}
@media (min-width:1100px){
 .single .p-articleHead.c-postTitle,.single .p-articleMetas.-top{max-width:var(--fs-col);margin-left:var(--fs-offset)}
 .single .c-postTitle__ttl{font-size:36px}
}
.single .p-articleMetas.-top{font-family:var(--fs-num);font-size:12px;letter-spacing:.08em;color:var(--fs-sub)}
.single .p-articleMetas .c-categoryList__link{background:none!important;color:var(--fs-accent)!important;padding:0;font-weight:500;letter-spacing:.14em}

/* 14. top page */
.home .c-pageTitle,.home .p-articleHead,.home #breadcrumb,.home .p-breadcrumb{display:none}
.home .post_content{padding:0}
.fs-home{max-width:1248px;margin:0 auto;color:var(--fs-text)}
.fs-lab{font-family:var(--fs-num);font-size:12px;font-weight:500;letter-spacing:.2em;color:var(--fs-accent);margin:0 0 16px!important;padding:0!important;border:0!important;background:none!important}
.fs-lab::before,.fs-lab::after{display:none!important}
.fs-card{display:block;color:inherit;text-decoration:none}
.fs-card__img{display:block;aspect-ratio:3/2;background:#eef0f2;overflow:hidden}
.fs-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.fs-card:hover .fs-card__img img{transform:scale(1.03)}
.fs-card__meta{display:flex;gap:12px;margin:12px 0 4px;font-family:var(--fs-num);font-size:12px;letter-spacing:.08em;color:var(--fs-sub)}
.fs-card__cat{color:var(--fs-accent)}
.fs-card__ttl{display:block;font-family:var(--fs-head);font-weight:900;font-size:17px;line-height:1.5;color:var(--fs-ink)}
.fs-card.is-big .fs-card__ttl{font-size:28px}
.fs-hero{display:grid;grid-template-columns:1fr 340px;gap:48px;padding:48px 0 64px}
.fs-hero__new .fs-card{display:grid;grid-template-columns:120px 1fr;gap:4px 16px;padding:14px 0;border-top:1px solid var(--fs-line)}
.fs-hero__new .fs-card__img{grid-row:1/3}
.fs-hero__new .fs-card__meta{margin:0}
.fs-hero__new .fs-card__ttl{font-size:14px}
.fs-fields{padding:0 0 64px}
.fs-fields__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fs-field{display:flex;flex-direction:column;gap:6px;padding:28px;border:1px solid var(--fs-line);color:var(--fs-ink);text-decoration:none;transition:border-color .2s}
a.fs-field:hover{border-color:var(--fs-accent)}
.fs-field__en{font-family:var(--fs-num);font-size:12px;letter-spacing:.2em;color:var(--fs-accent)}
.fs-field__ja{font-family:var(--fs-head);font-weight:900;font-size:26px}
.fs-field__n{font-family:var(--fs-num);font-size:12px;letter-spacing:.1em;color:var(--fs-sub)}
.fs-field.is-soon{opacity:.5}
.fs-sec{padding:0 0 72px}
.fs-sec__ttl{display:flex;align-items:baseline;gap:16px;font-family:var(--fs-head);font-weight:900;font-size:30px;margin:0 0 28px!important;padding:0!important;border:0!important;background:none!important}
.fs-sec__ttl::before,.fs-sec__ttl::after{display:none!important}
.fs-sec__no{font-family:var(--fs-num);font-weight:400;font-size:44px;color:var(--fs-ink)}
.fs-sec__ttl small{font-family:var(--fs-num);font-size:12px;letter-spacing:.2em;color:var(--fs-sub);font-weight:500}
.fs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px}
.fs-more{margin:28px 0 0;font-size:13px;letter-spacing:.06em}
.fs-more a{color:var(--fs-accent);text-decoration:none}
.fs-empty{color:var(--fs-sub);font-size:14px}
.fs-gear{background:var(--fs-ink);color:#fff;padding:56px 48px;margin:0 0 72px}
.fs-gear .fs-sec__no,.fs-gear .fs-card__ttl{color:#fff}
.fs-gear .fs-sec__ttl{color:#fff}
.fs-gear .fs-empty{color:#9aa3ab}
.fs-about{padding:0 0 80px;max-width:720px}
@media (max-width:959px){.fs-hero{grid-template-columns:1fr;gap:32px;padding:24px 0 40px}.fs-fields__grid,.fs-grid{grid-template-columns:1fr}.fs-gear{padding:32px 20px}.fs-home{padding:0 16px}.fs-card.is-big .fs-card__ttl{font-size:22px}}

/* 15. hide header bar */
.l-header__bar{display:none}

/* 16. mobile: numerals sit above headings */
@media (max-width:1099px){
 .single .post_content > h2::before,.single .post_content > h3::before{position:static!important;display:block;width:auto;margin:0 0 6px;line-height:1}
 .single .post_content > h2::before{font-size:34px}
 .single .post_content > h3::before{font-size:13px;letter-spacing:.1em}
}
