/* -------------------------------------------------- */
/* 汎用設定 */
/* -------------------------------------------------- */

/* カラーパレット */
:root {
--bk:#3f3e3e;
--gr-1:#59beb5;
--gr-2:#008291; 
--gr-3:#006e96;
--red-1:#dd6363;
--ye-1:#fafcd2;
--pi-1:#f387bd;
--wh:#fff;
}

/* 都道府県カラー */
:root {
--hokkaido:#6a4c93; 
--ohu:#565aa0;
--tohoku:#4267ac; 
--hokushin:#3b9fde;
--kanto:#60c1ca;
--tokai:#8ac926;
--kansai:#d0d534;
--chugoku:#ffca3a;
--shikoku:#ff924c;
--kyusyu:#ff595e;
}

/* 縦並び用 */
.column { flex-direction:column; }

/* 背景 */
html { background-attachment:fixed; background-image:url('../img/common/bg.jpg'); background-repeat:no-repeat; background-position:center; background-size:cover; }

/* 背景設定まとめて */
.bg-p-center { background-position:center; }
.bg-r { background-repeat:no-repeat; }
.bg-s-cover { background-size:cover; }
.bg-s-contain { background-size:contain; }
.bg-a::after, .bg-b::before { content:''; display:inline-block; }

/* ポジション */
.relative { position:relative; }
.absolute { position:absolute; }

/* コンテンツ */
.content { margin-bottom:70px; }

/* テキストカラー */
.red { color:#f00; }
.color-gr-2 { color:var(--gr-2); }
.color-gr-3 { color:var(--gr-3); }

/* 画像 */
img { height:auto; max-width:100%; }

@media(min-width:960px) {

/* PC版で電話番号リンクを無効に */
.tel-link { pointer-events:none; }

}

/* -------------------------------------------------- */
/* フォント設定 */
/* -------------------------------------------------- */

/* ベース */
html, body, h1, h2, h3, h4, p, ul li, dt, dd, table tr td, time, address {
color:var(--bk);
font-family:"Zen Kaku Gothic New", sans-serif;
font-optical-sizing:auto;
font-style:normal;
font-weight:500;
line-height:normal;
}

/* テキストベース */
html, body, p, ul li, dt, dd, td, time, address { font-size:16px; font-weight:500; line-height:175%; }

@container( min-width:1000px ) {

/* テキストベース */
html, body, p, ul li, dt, dd, td, time, address { font-size:18px; font-weight:500; line-height:28px; }

}

/* -------------------------------------------------- */
/* 見出し */
/* -------------------------------------------------- */

/* 冒頭に■が付く見出し */
.square-title { align-items:center; display:flex; gap:8px; font-size:18px; font-weight:700; justify-content:flex-start; margin-bottom:24px; }
.square-title::before { content:'■'; color:var(--gr-2); display:inline-block; }

@container( min-width:1000px ) {

/* 冒頭に■が付く見出し */
.square-title { font-size:30px; }

}

/* -------------------------------------------------- */
/* ナビゲーション */
/* -------------------------------------------------- */

/* サイトナビゲーション */
.global-nav__list { background-color:var(--gr-1); box-sizing:border-box; display:flex; flex-wrap:wrap; gap:10px 0; overflow:hidden; top:0; left:0; padding:0 20px; position:fixed; max-height:0px; height:0px; width:100vw; z-index:1000; }
.global-nav__list li { box-sizing:border-box; font-weight:700; width:50%; }
.global-nav__list li a { display:block; width:100%; }
.global-nav__list .sub-nav { display:flex; gap:8px; margin-top:5px; }
.global-nav__list .sub-nav li { font-weight:500; padding:0 20px 0 10px; width:100%; }

/* 展開 */
#nav-toggle:checked ~ .global-nav__list { padding:60px 20px; max-height:100vh; height:100vh; }

@container( max-width:999px ) {

/* リスト順番 */
.global-nav__item:nth-child(2) { order:3; }
.global-nav__item:nth-child(3) { order:5; }
.global-nav__item:nth-child(4) { order:7; }
.global-nav__item:nth-child(5) { order:2; }
.global-nav__item:nth-child(6) { order:4; }
.global-nav__item:nth-child(7) { order:6; }
.global-nav__item:nth-child(8) { order:8; }

}

/* -------------------------------------------------- */
/* フッタ */
/* -------------------------------------------------- */

/* ベース */
footer { background-image:url('../img/footer/footer-bg.jpg'); padding:80px 0; }
.footer-frame { flex-direction:column; gap:50px; }

/* 見出し */
footer h2 img { height:auto; max-width:300px; width:100%; }

/* リンク */
.email-row a { text-decoration:underline; }

/* テキスト */
footer p, footer address { color:var(--wh); font-size:14px; font-weight:700; text-align:left; letter-spacing:0.7px; }

/* 地図 */
div.footer-map img { margin:auto; height:auto; max-width:85%; width:100%; }

/* フッター情報 */
.footer-info { gap:30px; margin:auto; max-width:85%; width:100%; }
.info-block { gap:14px; }

@container(min-width:1000px) {

/* ベース */
.footer-frame { flex-direction:row; gap:50px; margin:auto; max-width:1000px; width:100%; }

/* テキスト */
footer p, footer address { font-size:16px; letter-spacing:0.8px; }

/* 地図 */
div.footer-map img { max-width:400px; }

/* フッター情報 */
.footer-info { max-width:calc( 100% - 520px ); }
.info-block, .footer-root { padding-left:55px; }

}