/*
Theme Name: Genesis Child MiyazawaLane
Theme URI: https://example.com/
Description: Genesis child theme - for Miyazawa Lane
Author: Media Design Matsumoto
Author URI: https://example.com/
Version: 1.0.0
Template: genesis
Text Domain: genesis-miyazawalane
*/

/* =========================================================
   1) Root Variables (色・余白・文字)
========================================================= */
:root{
  /* Colors #3cb371をベースとしたカラーセット */
--bg: #f2f4f8;	/*cool white*/
--text: #1a3d28;	/*濃い緑*/
--link: #4a4a4a;	/*暗いグレー*/
--fover: #67880b;	/*あざやかな黄緑系*/
--border: #4a4a4a;	/*暗いグレー*/
--bg_oppos: #f5faf6;	/* やや灰色い緑系*/
--body_bg: var(--bg);
--text_current:  #c0392b;	/*深い赤系*/
--header_text: var(--text);
--header_link: var(--link);
--header_bg: var(--bg);
--header_border: #f5faf6;	/*やや灰色い緑系*/
--footer_text: var(--bg_oppos);
--footer_link: var(--bg_oppos);
--footer_bg: var(--text);
--footer_border: #f2f4f8;	/*cool White*/
--sidebar_bg:  var(--bg);
--entry_bg: var(--body_bg);
--entry_text:  var(--text);
--entry_link:  var(--link);
--entry_link:  var(--link);
--button_border: var(--header_bg);
--button_bg: #3cb371;	/*深い緑系*/

/* その他の色
	#1b4f72		深い青紫系
	#2a7a4f		深い緑系
	#a8d8b5	灰みの緑系
	#e8f5ec		やや灰色い緑系
*/

  /* Typography */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  --font-size: 16px;
  --line-height: 1.75;

  /* Layout */
	--container: 1080px;
	--gutter: 18px;	/* 左右余白 */
	--header_height: 130px;

  /* Spacing scale */
  --s-1: 6px;
  --s-2: 10px;
  --s-3: 14px;
  --s-4: 18px;
  --s-5: 24px;
  --s-6: 32px;

  /* Radius / Shadow */
  --radius: 10px; /* 角を丸くする */
  --shadow: 0 10px 30px rgba(0,0,0,.08);

}

/* HTML5 Reset
---------------------------------------------------------------------------- */

/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
---------------------------------------------------------------------------- */
/* stylelint-disable */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}

/* Box Sizing
--------------------------------------------- */

html {
	box-sizing: border-box;
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

/* Float Clearing
--------------------------------------------- */

.author-box::before,
.clearfix::before,
.entry::before,
.entry-content::before,
.footer-widgets::before,
.nav-primary::before,
.nav-secondary::before,
.pagination::before,
.site-container::before,
.site-footer::before,
.site-header::before,
.site-inner::before,
.widget::before,
.wrap::before {
	content: " ";
	display: table;
}

.author-box::after,
.clearfix::after,
.entry::after,
.entry-content::after,
.footer-widgets::after,
.nav-primary::after,
.nav-secondary::after,
.pagination::after,
.site-container::after,
.site-footer::after,
.site-header::after,
.site-inner::after,
.widget::after,
.wrap::after {
	clear: both;
	content: " ";
	display: table;
}


/* Defaults
---------------------------------------------------------------------------- */

/* Typographical Elements
--------------------------------------------- */

html {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

body {
	background-color: var(--body_bg);
	color: var(--text);
	font-family: "Source Sans Pro", sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.625;
	margin: 0;
	overflow-x: hidden;
}

button,
input:focus,
input[type="button"],
input[type="reset"],
input[type="submit"],
textarea:focus,
.button,
.gallery img {
	transition: all 0.2s ease-in-out;
}

a {
	color: #0073e5;
	text-decoration: underline;
	transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

a:focus,
a:hover {
	color: var(--fover);
	text-decoration: none;
}

p {
	margin: 0 0 28px;
	padding: 0;
}

ol,
ul {
	margin: 0;
	padding: 0;
}

li {
	list-style-type: none;
}

hr {
	border: 0;
	border-collapse: collapse;
	border-bottom: 1px solid currentColor;
	clear: both;
	color: var(--border);
	margin: 1.65em auto;
}

b,
strong {
	font-weight: 700;
}

blockquote,
cite,
em,
i {
	font-style: italic;
}

mark {
	background: var(--bg);
	color: var(--text);
}

blockquote {
	margin: 30px;
}

/* Headings
--------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Source Sans Pro", sans-serif;
	font-weight: 400;
	line-height: 1.2;
	margin: 0 0 20px;
}

h1 {
	font-size: 30px;
}

h2 {
	font-size: 27px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 20px;
}

.entry-content h3,
.entry-content h4 {
	font-weight: 600;
}

.entry-content h4 {
	margin-top: 40px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

/* =========================================================
   3) Genesis Layout (1カラム固定)
   - 右サイドバーなどが出ても表示しない
========================================================= */
.site-container{ min-height: 100vh; }	/* 最小限の高さ　フッターが下部に留まるため */

.wrap{
  width: min(var(--container), 100%);	/* 画面が広いときは 1080px で固定。画面が狭くなり 100% の計算結果が 1080px を下回るとそちらが優先されレスポンシブに縮小します。  */
  margin-inline: auto;
  padding-inline: var(--gutter);	/* 左右余白 */
}

.site-inner{
  padding-block: var(--s-6);	/* 要素の内側の余白 */
}

.content-sidebar-wrap{
  /* Genesisの2カラム崩れを防ぐ：常に1カラム */
  display: block;
}

.content{
  width: 100%;
  max-width: 100%;
}

/* サイドバーは使わない前提 */
.sidebar,
.sidebar-primary,
.sidebar-secondary{
  display: none !important;
}

/* =========================================================
   4) Header + Nav inside header
========================================================= */
.site-header{
	background: var(--header_bg);
	border-bottom: 1px solid var(--header_border);
	padding: 5px auto 5px auto;	/* ヘッダの上下のパディング */
}

.site-header > .wrap{
	/* .site-header .wrap  子孫セレクタ：何階層下でもマッチ .site-header > .wrap  子セレクタ：直接の子だけマッチ */*/
	min-height: var(--header_height);	/*高さの最小値*/
	display: flex;
	align-items: left;
	justify-content: space-between;		/*グリッドの横方向の配置 フレックスボックス、グリッド、マルチカラム、ボックス等をレイアウトするために使用*/
	gap: var(--s-4);	/*列方向、行方向の隙間を指定*/
	flex-wrap: wrap;	/* はみ出してでも一列に並べて表示するか ＝複数行(列)に改行*/
}


/* タイトル（ロゴ） */
.title-area{
	min-width: 0;	/* 初期値が0なので不要だと思う */
}

.site-title{
	font-size: 1.05rem;
	margin: 0;
}
.site-title a{
	color: var(--header_link);
	text-decoration: none;
}
.site-description{
	margin: 0; color: var(--header_text);
	font-size: .9rem;
}

/* nav */
.genesis-nav-menu {
	clear: both;
	line-height: 1;
	width: 100%;
	background: var(--body_bg);
}

.genesis-nav-menu .menu-item {
	display: block;
	float: none;
	position: relative;
}

.genesis-nav-menu a {
	color: var(--link);
	display: block;
	font-size: 15px;
	font-weight: 400;
	outline-offset: -1px;
	padding-bottom: 12px;
	padding-top: 12px;
	text-decoration: none;
}

.genesis-nav-menu a:focus,
.genesis-nav-menu a:hover,
.genesis-nav-menu .current-menu-item > a,
.genesis-nav-menu .sub-menu .current-menu-item > a:focus,
.genesis-nav-menu .sub-menu .current-menu-item > a:hover {
	color: var(--fover);
	text-decoration: none;
}

.genesis-nav-menu .sub-menu,
.genesis-nav-menu .sub-menu a {
	width: 100%;
}

.genesis-nav-menu .sub-menu {
	clear: both;
	display: none;
	left: -9999px;
	margin: 0;
	opacity: 1;
	padding-left: 15px;
	position: static;
	z-index: 99;
}

.genesis-nav-menu .sub-menu a {
	background-color: var(--body_bg);
	font-size: 14px;
	position: relative;
	word-wrap: break-word;
}

.genesis-nav-menu .menu-item:focus,
.genesis-nav-menu .menu-item:hover {
	position: relative;
}

.genesis-nav-menu .menu-item:hover > .sub-menu {
	display: block;
	left: auto;
	opacity: 1;
}

/* =========================================================
	ハンバーガーメニュー
 =========================================================*/
.mdm-menu-toggle{
	display: block;
	width: 44px;
  height: 44px;
  padding: 10px;
  background: none;
  border: none;
  cursor: pointer;
}

/* 三本線 */
.mdm-bar{
  display: block;
  width: 24px;
  height: 3px;
  margin: 5px auto;
  background: var(--bg_oppos);
  transition: transform .3s ease, opacity .3s ease;
}

/* ===== 開いた状態 → バツ ===== */
.nav-primary.is-menu-open .mdm-bar:nth-child(1){
  transform: translateY(7px) rotate(45deg);
}

.nav-primary.is-menu-open .mdm-bar:nth-child(2){
  opacity: 0;
}

.nav-primary.is-menu-open .mdm-bar:nth-child(3){
  transform: translateY(-7px) rotate(-45deg);
}


/* メニューは初期非表示 */
.nav-primary .menu{
	display: none;
}

/* ハンバーガーメニューの開閉制御*/
.nav-primary.is-menu-open .menu{
	display: block;
}


/* PCに適用 */
@media (min-width: 961px){
	.mdm-menu-toggle{
	  display: none;
	}


	/* ナビゲーション全体のラッパーを右揃え */
	.nav-primary {
		width: 100%;
	}

	.nav-primary .wrap {
		display: flex;
		justify-content: flex-end;  /* 右揃え */
		align-items: center;
	}

	/* メニューリスト本体 */
	.nav-primary .genesis-nav-menu {
	    display: flex;
	    flex-direction: row;
	    flex-wrap: wrap;
	    justify-content: flex-end;  /* こちらにも指定（確実性のため） */
	    list-style: none;
	    margin: 0;
	    padding: 0;
	}

	/* 各メニューアイテム */
	.nav-primary .genesis-nav-menu > .menu-item {
		display: inline-block;
		position: relative;	/* ドロップダウン基準点 */
		margin: 0;
	}

	/* メニューリンク */
	.nav-primary .genesis-nav-menu > .menu-item > a {
	    display: block;
	    padding: 16px 20px;	/* 上下・左右の余白 */
	    color: var(--text);	/* 文字色 */
	    font-size: 14px;
	    font-weight: bold;
	    text-decoration: none;
	    white-space: nowrap;	/* 折り返し防止 */
		transition: color 0.2s ease, background-color 0.2s ease;	/*アニメーション*/
	}

	/* ホバー */
	.nav-primary .genesis-nav-menu > .menu-item > a:hover,
	.nav-primary .genesis-nav-menu > .menu-item > a:focus {
		color: var(--link);	/* ホバー時の文字色 */
		background-color: var(--text);	/* ホバー時の背景色 */
	}

	/* 現在のページ（current-menu-item） */
	.nav-primary .genesis-nav-menu > .menu-item.current-menu-item > a,
	.nav-primary .genesis-nav-menu > .menu-item.current-menu-ancestor > a {
		color: var(--text_current);
		border-bottom: 2px solid var(--text_current);  /* 現在地の下線アクセント */
	}

}



/* =========================================================
   7) Content styling (最低限)
========================================================= */
.entry{
  background: var(--entry_bg);
}

.entry-content{
  font-size: 1rem;
}

.entry-content a{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Buttons (任意) */
button,
input[type="submit"]{
  font: inherit;
  border-radius: 999px; /* 角を丸くする  */
  border: 1px solid var(--button_border);
  padding: 10px 16px;
  background: var(--button_bg);
  color: var(--button_text);
  cursor: pointer;
}

button:hover,
input[type="submit"]:hover{
	border-color: color-mix(in srgb, var(--border), var(--text) 15%);
}

/* ↓追加　===== Content を 1100px 以上にしないでセンター  */
.content-sidebar-wrap{
  width: min(var(--container), 100%);
  margin-inline: auto;
  padding-inline: var(--gutter);	/* 左右余白 */
}

.content{
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
}
/* ↑ Content を 1100px 以上にしないでセンター */

/* =========================================================
   8) Footer
========================================================= */
.site-footer{
  border-top: 1px solid var(--header_border);
  padding: var(--s-6) 0;
  color: var(--bg_oppos);
  background: var(--footer_bg);
}
.site-footer a{ color: var(--bg_oppos); }




/* フッターメニュー　サブメニュー */
/* 
	nav-footer	フッターメニュー固有のクラス。CSS の主要なセレクタ
	ul class
		menu	WordPress 標準のメニュークラス
		genesis-nav-menu	Genesis共通のメニュークラス（基本スタイルが当たる）
		menu-footer		このメニュー固有のクラス（メニュー名から自動生成）
		js-superfish		Genesis のドロップダウン JS 用
	li class
		menu-item	すべての項目に付く
		menu-item-has-children		子メニューを持つ項目だけに付く
		current-menu-item	表示中のページ
		current-menu-parent	表示中のページの親項目
		current-menu-ancestor	表示中のページの祖先項目（さらに上の階層）
	サブメニュー
		<ul class="sub-menu">

*/
/*　footer領域にGenesis Simple Menusを使ってmenuを表示   */
.footer-menu-container {
	text-align: left;
	padding: 10px 0;
	color: var(--footer_text);
	background: var(--footer_bg);
	font-size: var(--s-3);
}
/* フッターメニュー全体 */
.nav-footer {
	padding: 1em 0;
}

/* メニュー項目を横並びに */
.nav-footer .genesis-nav-menu {
	text-align: center;
}

.nav-footer .menu-item {
	display: inline-block;
}

.nav-footer a {
	color: var(--footer_link);
	padding: 0.5em 1em;
	text-decoration: none;
}

/* サブメニューを持つ項目だけに矢印を付ける */
.nav-footer .menu-item-has-children > a::after {
	content: " ▼";
	font-size: 0.8em;
}

/* サブメニュー：通常は非表示 */
.nav-footer .sub-menu {
	display: none;
	position: absolute;
	background-color: var(--footer_bg);
	min-width: 200px;
	z-index: 100;
}

/* 親をホバーしたら表示 */
.nav-footer .menu-item-has-children:hover > .sub-menu {
	display: block;
}

/* 第3階層は右側に展開 */
.nav-footer .sub-menu .sub-menu {
	left: 100%;
	top: 0;
}

/* 現在のページをハイライト */
.nav-footer .current-menu-item > a {
	color: var(--text_current);
}

/* =========================================================
   追加↓	最新投稿のULリスト（ショートコード）用　functions.phpでソースを定義している
========================================================= */
.recent-checklist {
    list-style: none;
    margin: 0;
    padding: 0;
}
.recent-checklist li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid #eee;
}
.recent-checklist .check-icon {
    color: #4caf50;
    font-weight: bold;
    flex-shrink: 0;
}
.recent-checklist a {
    text-decoration: none;
    color: inherit;
}
.recent-checklist a:hover {
    text-decoration: underline;
}