/*
Theme Name: Minimal
Author: burea
Description: Minimal WP Theme
Version: 1.0
*/

/* --------------------------------------------------------------
   Base (Mobile First)
-------------------------------------------------------------- */
body {
	padding:0;
	margin:0;
	background-color:#f3f0e6;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

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

table, th, td {
	border-collapse:collapse;
}

th, td {
	border:1px solid #999;
}

th {
white-space: nowrap;
    text-align: justify;
    text-align-last: justify;
}

a:link {
	color:#000;
	text-decoration:under-line;
}

a:visited {
	color:#000;
	text-decoration:under-line;
}

a:hover {
	color:#666;
	text-decoration:none;
}

a:active {
	color:#666;
	text-decoration:none;
}

a:hover img {
	opacity:0.8;
}

.page-wrap {
/*	padding-top:50px; */
}

.container {
	width:90%;
	max-width:1170px;
	margin:auto;
}

/* ------ ヘッダー&ナビゲーションメニュー ------- */
.site-header {
	background-color:#fff;
    position: relative;
    z-index: 1000; /* メニューより上 */
}

.site-header .header-wrap {
	display:grid;
	grid-template-columns: 1fr 50px;
	padding:10px;
}

.site-logo {
	margin:20px 0;
}

.nav-toggle {
	margin:15px 5px;
}
.global-nav-pc {
	display:none;
}

.global-nav-mobile {
    position: relative;
}

.nav-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
}

.nav-toggle-line {
    display: block;
    width: 24px;
    height: 2px;
    background: #333;
    margin: 5px 0;
}

/* ▼ メニューコンテナ：初期は非表示 */
.menu-container {
    position: absolute;
    top: 100%; 
    left: 0;
    width: 100%;
    background: #fff;
    z-index: 1500;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);

    transform: translateY(-20px); /* ← 上に20px隠す */
    opacity: 0;                  /* ← 透明にしておく */
    pointer-events: none;        /* ← 閉じてる間クリック不可 */
    transition:
        transform 0.25s ease,
        opacity 0.25s ease;
}

.menu-container.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;  
}

.menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu li a {
    display: block;
    padding: 12px;
    text-decoration: none;
    color: inherit;
}


/* ------ 駐車場検索（マップ） ------- */
.search-parking {
	margin-bottom:50px;
}


/* ------ コンテンツ 共通 ----------- */

.content-wrapper {
	padding-top:50px;
}

/* ------ コンテンツ　アーカイブ個別記事 ------- */
article {
	margin-bottom:60px;
}

section {
	margin-bottom:60px;
}

.posts-grid .inner-content,
.single-post .inner-content {
	background-color:#fff;
	padding:15px;
	height:100%;
}

.posts-grid .entry-header {
	margin-bottom:20px;
}

.posts-grid .inner-content table {
	width:100%;
}

.single-post .inner-content {
	max-width:960px;
	margin:auto;
}

.single-post .entry-content h2 {
	background-color:#f1f3f7;
	padding:2px 0 3px 15px;
	font-size:1.4rem;
	position:relative;
}

.single-post .entry-content h2::before {
    content: "";
    display: block;
    background: #0071bc;
    width: 6px;
    height: 22px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.single-post .entry-content h3 {
	font-size:1.2rem;
	border-bottom:2px solid #f1f3f7;
	padding-bottom:3px;
}

.single-post .entry-content h3::before {
    content: "|";
	font-weight:bold;
	color:#0071bc;
	margin-right:6px;
}

.page-back {
	text-align:center;
}

.back-button {
	font-size:1.2rem;
    display: inline-block;
    padding: 10px 20px;
    background: #f1f3f7;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
	min-width:250px;
	text-align:center;
}

.back-button:hover {
    background: #ddd;
}

/* ------ 駐車場情報テーブル(アーカイブ) ----- */
.parking-table th,
.parking-table td {
	padding:6px 10px;
/*
   border-style: solid;
    border-color: #ccc;
    border-width: 0 0 1px 0;
*/
}

.parking-table th {
	width:26%;
	background-color:#f1f3f7;
}

.parking-table tr:nth-of-type(odd){
	/* background-color:#f6f6f6; */
}

/* ------ 駐車場情報テーブル(シングル) ----- */

.single-post .parking-table {
	width:100%;
	font-size:14px;
}

.single-post .parking-table th {
	font-weight:normal;
	width:30%;
}

.single-post .parking-table .thumbnail {
	max-width:400px;
}

.single-post .parking-table .facility-list {
	list-style:none;
	padding-left:0;
}

.facility-list li.is-checked::before {
    content: "●";
    color: #28a745;
    font-size: 0.8em;
}

.facility-list li.is-not-checked {
    color: #aaa;
}

.facility-list li.is-not-checked::before {
    content: "×";
    color: #aaa;
    font-size: 0.8em;
}

/* ------ フッター ----- */
.bread-wrapper {
	background-color:#fff;
	font-size:0.8rem;
	padding:10px;
}

footer {
	background-color:#0071bc;
	color:#fff;
	overflow:hidden;
}

footer .copyright {
	text-align:center;
}

/* --------------------------------------------------------------
   Tablet (画面幅が広くなったら上書き)
-------------------------------------------------------------- */
@media (min-width: 600px) {
    /* タブレット横向きや小さめのPCに近い端末 */
	.site-logo img {
		max-width:60%;
	}

	.posts-grid {
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:20px;
	}

	.single-post .parking-table .facility-list {
		display:flex;
		flex-wrap:wrap;
	}

	.single-post .parking-table .facility-list li::after {
		content:"";
		height:1em;
		display:inline-block;
		width:1px;
		margin:0 5px;
	    background-color: #aaa;
	}

	.single-post .parking-table .facility-list li:last-of-type::after {
		display:none;
	}
}


/* --------------------------------------------------------------
   PC (一般的なラップトップ～デスクトップ)
-------------------------------------------------------------- */
@media (min-width: 960px) {
    /* ここでPC用レイアウトに切り替える */

	.site-logo img {
		max-width:450px;
	}

	.site-header .header-wrap {
		grid-template-columns:1fr 2fr;
	}
    /* ハンバーガーボタンを非表示 */
    .nav-toggle {
        display: none;
    }

    /* メニューを横並びで常時表示する */
    .global-nav-pc {
       display:flex;
		align-items:center;
    }

    .global-nav-mobile {
       display:none;
    }

    .menu-container {
        position: static; /* 絶対配置をやめる */
        transform: none;
        opacity: 1;
        pointer-events: auto;
        display: block; /* PCでは常に表示 */
        box-shadow: none;
        background: transparent; /* 必要なら */
    }

    /* ULを横並びにする */
    .menu {
        display: flex;
        gap: 20px; /* 好みに調整 */
		width:100%;
		justify-content:end;
    }

    .menu li a {
        padding: 10px 0;
    }

	.single-post .entry-content {
/*
		display:grid;
		gap:30px;
		grid-template-columns:1fr 1fr;
*/
	}

	.single-post .parking-table th {
		width:120px;
	}
}


/* --------------------------------------------------------------
   Large PC / 高解像度端末
-------------------------------------------------------------- */
@media (min-width: 1200px) {
    /* 広いデスクトップ／フルHD以上 */

	.posts-grid {
		grid-template-columns:1fr 1fr 1fr;
	}
}


/* --------------------------------------------------------------
   4Kモニターや大型ディスプレイ
-------------------------------------------------------------- */
@media (min-width: 1600px) {
    /* 必要な場合のみ */
	.container {
		max-width:1440px;
	}
}