@charset "UTF-8";
/* Google Fonts は functions.php で wp_enqueue_style 経由で読み込み */
/* ============================================
   COMMON.CSS
   リセット + 共通スタイル + ヘッダー + ナビ + ハンバーガー + フッター
============================================ */

/* === 最低限リセット（box-sizing追加） === */
*, *:before, *:after {
	box-sizing: border-box;
}


/* === リセット === */
* {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-style: normal;
}

html {
	scroll-padding-top: 80px;
	overflow-x: hidden;
	overflow-y: scroll;
}

body {
	font-size: 100%;
	overflow-x: hidden;
}

img {
	vertical-align: bottom;
	max-width:100%;
}

a img  {
	border: none;
}
a:hover img  {
	opacity: 0.8;
}

li {
	list-style: none;
}


/* === 共通スタイル（フォント・カラー・ユーティリティ） === */

body {
	font-family: "Noto Sans JP", sans-serif;
	font-weight:400;
	color:#333;
	background:#fffef8;
}

/* 見出しフォント（Gutenbergブロック内にも適用） */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
}

/* Gutenbergブロック内のフォント継承を強制 */
.wp-block-group,
.wp-block-columns,
.wp-block-column,
.wp-block-paragraph,
.entry-content,
.entry-content * {
	font-family: inherit;
}

a { color:#e6929e; }
a:hover { color:#ffc508; }

p, li {
	line-height:1.8;
}

@media screen and (min-width: 768px) {
	img {
		width: auto;
	}
}
.pcOnly {display:none;}

@media screen and (min-width: 768px) {
	.spOnly {display:none !important;}
	.pcOnly {display:inherit;}
}

/* ヘッダー */
header {
	background:#fff;
}
header .inner {
	margin:0 auto;
	padding:0;
	max-width:1400px;
}

@media screen and (min-width:768px) {
	header {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 90px;
		z-index:9999;
	}
	header .inner .sp_header {
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		margin:0 auto;
		width:95%;
	}
	/* ★★ ロゴエリア：100% - 800px ★★ */
	header .inner .sp_header .logo {
		width: calc(100% - 800px);
		max-width:350px;     /* 最大サイズ */
		min-width:150px;     /* 最小サイズ */
	}
	/* ★★ ロゴ画像：親要素の幅100% ★★ */
	header .inner .sp_header .logo img {
		width:100%;
		height:auto;
	}
}

@media screen and (max-width:1200px) {
}
@media screen and (max-width:768px) {
	header {
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:60px;
		z-index:9999;
	}
	header .inner {
		padding:0 0 0px;
		width:100%;
	}
	header .inner .sp_header .logo {
		margin-left:3%;
		max-width:60%;
		height:60px;
		display:flex;
		align-items: center;
	}
}

/* 本文 */
@media screen and (max-width:768px) {
	main {
		margin-top:60px;
	}
}

.tmpl_inner {
	margin:0 auto;
	max-width:1200px;
}
.tmpl_inner100 {
	margin:0 auto;
	max-width:100%;
}

@media screen and (max-width:1200px) {
	.tmpl_inner {
		max-width:96%;
	}
	.tmpl_inner100 {
		max-width:100%;
	}
}
@media screen and (max-width:768px) {
	.tmpl_inner {
		max-width:90%;
	}
	.tmpl_inner100 {
		max-width:100%;
	}
}

/* フッター */
footer {
	background:#ffc813;
	color:#fff;
	padding:50px 0 40px;
}
footer .inner {
	margin:0 auto;
	max-width:1200px;
}
footer .footer_nav {
	margin-bottom:30px;
}
footer .footer_nav ul {
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	gap:30px;
}
footer .footer_nav ul li a {
	display:block;
	color:#fff;
	text-decoration:none;
	font-size:16px;
	font-weight:500;
	transition:opacity 0.3s, transform 0.2s;
}
footer .footer_nav ul li a:hover {
	opacity:0.7;
	transform:translateY(-2px);
}
footer .footer_copy {
	font-size:14px;
	text-align:center;
}

@media screen and (max-width:768px) {
	footer {
		padding:30px 0 30px;
	}
	footer .inner {
		max-width:90%;
	}
	footer .footer_nav ul {
		gap:15px 20px;
		font-size:3.5vw;
	}
	footer .footer_copy {
		font-size:3vw;
	}
}

/* マージン */
.mt00 {margin-top:0;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}


/* === グローバルナビゲーション === */
/* グローバルナビゲーション */
.gnavi {
	display:flex;
	align-items:center;
	gap:10px;
}
.nav_list {
	display:flex;
	gap:5px;
}
.nav_item a {
	display:flex;
	flex-direction:column;
	align-items:center;
	padding:10px 15px;
	text-decoration:none;
	color:#333;
	font-size:14px;
	font-weight:500;
	border-radius:8px;
	transition:background 0.3s, transform 0.2s;
}
.nav_item a:before {
	content:'';
	display:block;
	width:50px;
	height:40px;
	margin-bottom:5px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
}
.nav_item:nth-child(1) a:before {
	background-image:url(../images/nav_icon_1.png);
}
.nav_item:nth-child(2) a:before {
	background-image:url(../images/nav_icon_2.png);
}
.nav_item:nth-child(3) a:before {
	background-image:url(../images/nav_icon_3.png);
}
.nav_item:nth-child(4) a:before {
	background-image:url(../images/nav_icon_4.png);
}
.nav_item:nth-child(5) a:before {
	background-image:url(../images/nav_icon_5.png);
}
.nav_item:nth-child(6) a:before {
	background-image:url(../images/nav_icon_6.png);
}
.nav_item a:hover {
	background:#FFF9E6;
	transform:translateY(-2px);
}

/* お問い合わせボタン */
.contact_btn {
	margin-left:20px;
}
.contact_btn a {
	display:block;
	padding:12px 30px;
	background:#ffc508;
	color:#fff;
	font-size:16px;
	font-weight:600;
	text-decoration:none;
	border-radius:50px;
	transition:background 0.3s, transform 0.2s, box-shadow 0.3s;
}
.contact_btn a:hover {
	background:#e1ad03;
	transform:translateY(-2px);
	box-shadow:0 4px 15px rgba(255,197,8,0.4);
}

@media screen and (max-width:768px) {
	.gnavi {
		display:none;
		position:fixed;
		top:60px;
		left:0;
		width:100%;
		background:#fff;
		flex-direction:column;
		justify-content:flex-start;
		padding:20px 0 0;
		z-index:9998;
	}
	.gnavi.is-open {
		display:flex;
	}
	.nav_list {
		display:flex;
		flex-direction:column;
		gap:0;
		width:100%;
		padding:0;
		margin-bottom:0;
	}
	.nav_item {
		border-bottom:1px solid #f0f0f0;
	}
	.nav_item a {
		padding:15px 5%;
		font-size:4.5vw;
		font-weight:600;
		flex-direction:row;
		justify-content:flex-start;
		align-items:center;
		border-radius:0;
	}
	.nav_item a:before {
		width:40px;
		height:40px;
		margin-bottom:0;
		margin-right:15px;
		flex-shrink:0;
	}
	.nav_item a:hover {
		background:transparent;
	}
	.contact_btn {
		margin:0;
		width:100%;
		padding:30px 5% 40px;
		text-align:center;
	}
	.contact_btn a {
		display:inline-block;
		font-size:4vw;
		padding:12px 35px;
		border-radius:50px;
	}
}


/* === ハンバーガーメニュー === */
/* ハンバーガーメニュー */
.hamburger {
	display:none;
}

@media screen and (max-width:768px) {
	.hamburger {
		display:block;
		position:fixed;
		top:0;
		right:0;
		width:60px;
		height:60px;
		background:#ffc813;
		cursor:pointer;
		z-index:9999;
	}
	.hamburger_border {
		display:block;
		position:absolute;
		left:50%;
		transform:translateX(-50%);
		width:30px;
		height:3px;
		background:#fff;
		border-radius:2px;
		transition:all 0.3s;
	}
	.hamburger_border_top {
		top:20px;
	}
	.hamburger_border_center {
		top:28.5px;
	}
	.hamburger_border_bottom {
		top:37px;
	}
	
	/* 開いた状態（×マーク） */
	.hamburger.is-open .hamburger_border_top {
		top:28.5px;
		transform:translateX(-50%) rotate(45deg);
	}
	.hamburger.is-open .hamburger_border_center {
		opacity:0;
	}
	.hamburger.is-open .hamburger_border_bottom {
		top:28.5px;
		transform:translateX(-50%) rotate(-45deg);
	}
	
	/* 黒背景は削除 */
}

/* ============================================
   Gutenberg レイアウト上書き
   WP 6.x が自動付与する is-layout-flow / is-layout-constrained の
   max-width・padding を、テーマ側CSSが正しく効くようにリセット
============================================ */

/* --- メインコンテンツエリア --- */
.l-main {
	max-width:100%;
	padding:0;
}

/* --- WPが付ける is-layout-* のデフォルト幅制約を解除 --- */
.l-main > .wp-block-group,
.l-main > .wp-block-group.is-layout-flow,
.l-main > .wp-block-group.is-layout-constrained {
	max-width:none;
	padding-left:0;
	padding-right:0;
}

/* --- 入れ子グループの幅もテーマCSS任せにする --- */
.wp-block-group .wp-block-group {
	max-width:none;
}
/* sec_tmpl_bg は 1400px に制限（上記の max-width:none より後に記述） */
.wp-block-group.sec_tmpl_bg {
	max-width:1400px;
}

/* --- WP 6.x の :where() セレクタによる max-width 上書きをリセット --- */
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.is-layout-flow > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width:none;
	margin-left:auto;
	margin-right:auto;
}

/* --- WPデフォルトの blockGap をリセット --- */
.is-layout-flow > *,
.is-layout-constrained > * {
	margin-block-start:0;
	margin-block-end:0;
}

/* --- tmpl_inner は常にテーマのmax-widthを優先 --- */
.wp-block-group.tmpl_inner {
	margin-left:auto;
	margin-right:auto;
}

/* --- WP coreのtable thデフォルトborderをリセット --- */
.wp-block-table th,
.wp-block-table td {
	border:none;
}
