/*
Theme Name: Astra Child Gallery
Template: astra
Version: 10.0.0
Description: Theater pop ギャラリーテーマ
*/
/* ─────────────────────────────────────
Google Fonts
───────────────────────────────────── */
/* Google Fonts は functions.php の wp_enqueue_style で読み込んでください（下記コメント参照）
白画面対策のため @import を廃止しています
functions.php に追加するコード:
wp_enqueue_style('google-fonts',
'https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&family=Noto+Serif+JP:wght@300;400;500;700&family=EB+Garamond:ital,wght@0,400;1,400&family=Russo+One&display=swap',
[], null
);
また に以下を追加するとさらに高速化できます:
*/
/* ─────────────────────────────────────
Variables
───────────────────────────────────── */
:root {
--bg: #fcfbf6;
--black: #000000;
--white: #ffffff;
--gray: #dddddd;
--serif: 'EB Garamond', 'Noto Serif JP', serif;
--sans: 'Noto Sans JP', sans-serif;
--nav-h: 70px;
--wrap: 980px;
}
/* ─────────────────────────────────────
Reset
───────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--bg) !important; color: var(--black); font-family: var(--sans); font-size: 16px; font-weight: 300; line-height: 1.85; -webkit-font-smoothing: antialiased; }
body { padding-top: var(--nav-h); }
a { color: var(--black); text-decoration: none; }
a:hover { color: #339CD3; }
img { display: block; max-width: 100%; height: auto; }
ul, ol { list-style: none; margin: 0 0 1.5em 1em; }
p, li { font-size: 16px; }
/* Astra 非表示 */
#masthead, .ast-primary-header-bar,
.site-header-focus-item, #ast-fixed-header { display: none !important; }
.ast-container { max-width: var(--wrap) !important; padding: 0 20px; }
#page { padding-top: 0 !important; }
.g-side { display: none !important; }
/* 全テキスト色・フォント */
body, body a, body p, body li, body td, body th,
body span, body div, body button, body input, body textarea {
color: var(--black);
font-family: var(--sans);
}
/* ─────────────────────────────────────
見出し Noto Sans JP Bold
───────────────────────────────────── */
.g-bebas,
body h2.g-section-title,
body h2.g-notice-title,
body h2.g-widget-title {
font-family: var(--sans);
font-weight: 700;
letter-spacing: .05em;
}
/* ─────────────────────────────────────
HEADER
───────────────────────────────────── */
#g-header {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 900;
height: var(--nav-h);
background: var(--bg);
border: none;
box-shadow: none;
overflow: visible;
}
#g-header::after {
content: '';
display: block;
position: absolute;
bottom: -16px; left: 0; right: 0;
height: 16px;
background: linear-gradient(to bottom, var(--bg), transparent);
pointer-events: none;
z-index: 899;
}
.g-header-inner {
max-width: var(--wrap);
margin: 0 auto;
padding: 0 20px;
height: var(--nav-h);
display: flex;
align-items: center;
gap: 0;
overflow: visible;
}
.g-logo {
flex-shrink: 0;
display: flex;
align-items: center;
}
.g-logo img { height: 26px; width: auto; }
.g-logo a { font-family: var(--serif); font-size: 17px; letter-spacing: .18em; display: flex; align-items: center; }
.g-header-sns {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 12px;
}
#g-burger {
flex-shrink: 0;
display: none;
}
/* ─────────────────────────────────────
NAVIGATION PC
───────────────────────────────────── */
#g-nav {
flex: 1;
display: flex;
align-items: center;
justify-content: flex-end;
overflow: visible;
padding-right: 12px;
}
#g-nav > ul {
display: flex;
align-items: center;
overflow: visible;
}
#g-nav > ul > li {
display: flex;
align-items: center;
position: relative;
}
#g-nav > ul > li > a {
display: flex;
align-items: center;
height: var(--nav-h);
padding: 0 13px;
font-family: var(--sans);
font-weight: 500;
font-size: 15px;
letter-spacing: .06em;
white-space: nowrap;
color: var(--black);
}
#g-nav > ul > li > a:hover,
#g-nav > ul > li:hover > a { color: #339CD3; }
/* ヘッダー内のWordPressデフォルトmargin/paddingリセット */
#g-header ul,
#g-header li { list-style: none; margin: 0; padding: 0; }
#g-nav > ul { margin: 0; padding: 0; }
/* PC ドロップダウン */
@media (min-width: 901px) {
html, body { overflow-x: visible; overflow: visible; }
#g-header, .g-header-inner,
#g-nav, #g-nav > ul, #g-nav > ul > li { overflow: visible; }
#g-burger { display: none; }
#g-nav { display: flex; }
.g-header-sns { display: flex; }
.g-nav > ul > li > ul {
display: none;
position: absolute;
top: var(--nav-h); left: 0;
background: var(--bg);
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,.10);
padding: 8px;
min-width: 180px;
z-index: 9999;
}
.g-nav > ul > li:hover > ul { display: block; }
.g-nav > ul > li > ul > li > a {
display: block;
padding: 8px 14px;
font-size: 13px;
border-radius: 8px;
color: var(--black);
}
.g-nav > ul > li > ul > li > a:hover { color: #339CD3; }
}
/* Header SNS */
.g-header-sns { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.g-header-sns a { display: flex; align-items: center; color: var(--black); opacity: .7; }
.g-header-sns a:hover { opacity: 1; color: #339CD3; }
/* ─────────────────────────────────────
HAMBURGER
───────────────────────────────────── */
.g-burger, #g-burger {
display: none;
flex-direction: column;
justify-content: center;
gap: 5px;
background: none;
border: none;
cursor: pointer;
width: 32px; height: 32px;
padding: 4px;
}
.g-burger span, #g-burger span {
display: block;
width: 22px; height: 1px;
background: var(--black);
transition: .3s;
}
.g-burger.open span:nth-child(1),
#g-burger.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.g-burger.open span:nth-child(2),
#g-burger.open span:nth-child(2) { opacity: 0; }
.g-burger.open span:nth-child(3),
#g-burger.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
@media (max-width: 900px) {
html, body { overflow-x: hidden; }
#g-nav { display: none; }
#g-burger { display: flex; z-index: 1000; margin-left: auto; }
.g-header-sns { display: none; }
/* PC用のflex/heightを完全リセット */
#g-nav.open,
#g-nav.open > ul,
#g-nav.open > ul > li,
#g-nav.open > ul > li > a,
#g-nav.open ul ul,
#g-nav.open ul ul li,
#g-nav.open ul ul li a {
display: block;
height: auto;
min-height: 0;
position: static;
float: none;
flex: none;
align-items: unset;
}
#g-nav.open {
position: fixed;
top: var(--nav-h); left: 0; right: 0; bottom: 0;
background: var(--bg);
overflow-y: auto;
z-index: 999;
padding: 16px 24px 40px;
width: 100%;
}
#g-nav.open > ul { width: 100%; }
#g-nav.open > ul > li { width: 100%; }
#g-nav.open > ul > li > a {
padding: 14px 8px;
font-size: 15px;
width: 100%;
border-bottom: none;
}
#g-nav.open ul ul {
display: none;
width: 100%;
background: transparent;
padding: 0 0 8px 16px;
box-shadow: none;
border-radius: 0;
min-width: 0;
}
#g-nav.open ul ul.sub-open { display: block; }
#g-nav.open ul ul li { width: 100%; }
#g-nav.open ul ul li a { width: 100%; padding: 9px 16px; font-size: 13px; color: #555; }
#g-nav ul, #g-nav li, #g-nav.open ul, #g-nav.open li { list-style: none; }
}
/* モバイルメニュー内SNS */
#g-nav.open
.g-nav-sns a { color: var(--black); opacity: .7; padding: 0; height: auto; line-height: 1; border: none; }
.g-nav-sns a:hover { color: #339CD3; opacity: 1; }
/* ─────────────────────────────────────
HERO / SLIDESHOW
───────────────────────────────────── */
.g-hero-full,
.g-slideshow {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
overflow: hidden;
background: transparent;
position: relative;
}
.g-hero-full-caption { display: none; }
.g-slide { display: none !important; width: 100%; }
.g-slide.is-active { display: block !important; }
/* PC */
@media (min-width: 721px) {
.g-slide > a { display: block; width: 100%; }
.g-slide picture { display: block; width: 100%; }
.g-slide picture img, .g-slide > a > img {
width: 100%;
height: auto;
display: block;
background: var(--bg);
}
}
/* モバイル */
@media (max-width: 720px) {
.g-slide > a { display: block; width: 100%; }
.g-slide picture { display: block; width: 100%; }
.g-slide picture img, .g-slide > a > img {
width: 100%;
height: auto;
display: block;
background: var(--bg);
}
}
/* PC/モバイル画像切り替え */
.g-slide-mobile { display: none !important; }
.g-slide-pc { display: block !important; }
@media (max-width: 720px) {
.g-slide-pc { display: none !important; }
.g-slide-mobile { display: block !important; width: 100%; height: auto; }
}
/* ホバーアニメーション */
.g-slide > a { overflow: hidden; }
.g-slide img { transition: transform .7s ease; }
.g-slide > a:hover img { transform: scale(1.03); }
/* スライドコントロール */
.g-slide-prev, .g-slide-next {
position: absolute; top: 50%; transform: translateY(-50%);
z-index: 10; background: rgba(255,255,255,0.3); border: none; cursor: pointer;
width: 44px; height: 44px; font-size: 24px; color: #fff;
display: flex; align-items: center; justify-content: center;
transition: background .2s;
}
.g-slide-prev { left: 16px; }
.g-slide-next { right: 16px; }
.g-slide-prev:hover, .g-slide-next:hover { background: rgba(255,255,255,0.55); color: #000; }
.g-slide-dots { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 10; }
.g-slide-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.5); border: none; cursor: pointer; padding: 0; transition: background .3s, transform .3s; }
.g-slide-dot.is-active { background: #fff; transform: scale(1.3); }
/* ─────────────────────────────────────
PAGE LAYOUT
───────────────────────────────────── */
.g-page-body {
max-width: var(--wrap);
margin: 0 auto;
padding: 36px 20px 64px;
}
#g-wrap { max-width: var(--wrap); margin: 0 auto; padding: 36px 20px 64px; display: block; }
.g-main-full { max-width: 760px; margin: 0 auto; }
@media (max-width: 720px) {
.g-page-body { padding: 24px 16px 48px; }
}
/* ─────────────────────────────────────
お知らせ + カレンダー
───────────────────────────────────── */
.g-notice-cal-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 36px;
align-items: start;
margin-bottom: 44px;
}
@media (max-width: 640px) {
.g-notice-cal-row { grid-template-columns: 1fr; gap: 24px; }
}
.g-notice { border: none; }
.g-notice-date {
display: block;
font-family: var(--serif);
font-size: 13px; color: #555;
margin-bottom: 8px;
}
.g-notice-text { font-size: 18px; font-weight: 500; }
.g-notice-title {
font-family: var(--sans);
font-size: 16px; font-weight: 700;
margin-bottom: 16px;
border: none;
}
.g-notice-item + .g-notice-item {
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid #eee;
}
/* ─────────────────────────────────────
セクション
───────────────────────────────────── */
.g-section-head {
display: flex; align-items: baseline; justify-content: space-between;
border-top: 1px solid var(--black);
padding-top: 12px;
margin-bottom: 22px;
margin-top: 1.4em;
}
.g-section-title {
font-family: var(--sans);
font-size: 16px; font-weight: 700;
letter-spacing: .05em; text-transform: uppercase;
}
.g-section-more { font-size: 13px; }
.g-section-more:hover { color: #339CD3; }
/* ─────────────────────────────────────
カレンダー
───────────────────────────────────── */
.g-gcal-wrap, .g-notice-cal-widget {
background: var(--bg);
border: none;
padding: 0;
}
.g-gcal-wrap { height: 500px; width: 100%; }
.g-gcal-wrap iframe { width: 100%; height: 500px; display: block; border: none; background: var(--bg); }
.g-widget-title { font-family: var(--sans); font-size: 16px; font-weight: 700; border: none; margin-bottom: 14px; }
/* ─────────────────────────────────────
TOPICS / 展覧会グリッド
───────────────────────────────────── */
.g-exh-3col { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 720px) { .g-exh-3col { grid-template-columns: repeat(2, 1fr); gap: 14px; } }
@media (max-width: 480px) { .g-exh-3col { grid-template-columns: 1fr; } }
.g-exh-card { overflow: hidden; }
.g-exh-card a { display: block; text-decoration: none; }
.g-exh-card img { transition: transform .5s ease, opacity .3s ease; }
.g-exh-card:hover img { transform: scale(1.04); opacity: .92; }
.g-exh-thumb {
display: block;
width: 100%;
background: var(--bg);
margin-bottom: 10px;
overflow: hidden;
}
.g-exh-thumb img {
width: 100%;
height: auto;
display: block;
}
.g-exh-thumb .wp-post-image,
.g-exh-thumb [class*="wp-image"] {
width: 100%;
height: auto;
display: block;
}
.g-exh-thumb-empty { width: 100%; aspect-ratio: 3 / 2; background: #e0e0e0; display: block; }
.g-exh-period { font-family: var(--serif); font-size: 13px; color: #555; margin-bottom: 5px; }
.g-exh-name { font-size: 15px; line-height: 1.75; }
.g-topics-tag { display: inline-block; font-size: 11px; border: 1px solid var(--gray); padding: 1px 7px; margin-right: 6px; vertical-align: middle; }
.g-topics-date { display: block; font-family: var(--serif); font-size: 13px; color: #555; margin-bottom: 4px; }
.g-topics-title { font-size: 15px; line-height: 1.75; }
.g-empty { font-size: 14px; color: #aaa; padding: 20px 0; }
/* Instagram */
.g-instagram-section { margin-top: 44px; }
/* ─────────────────────────────────────
展覧会サブナビ
───────────────────────────────────── */
.g-exh-subnav { display: flex; flex-wrap: wrap; gap: 8px; border: none; margin-bottom: 28px; padding: 0; }
.g-exh-subnav a {
display: inline-block;
background: var(--white); color: var(--black);
border: 1px solid var(--black);
border-radius: 9999px;
padding: 5px 16px; font-size: 13px;
white-space: nowrap;
transition: background .2s, color .2s;
}
.g-exh-subnav a:hover { background: var(--black); color: var(--bg); }
.g-exh-subnav a.is-current { background: var(--black); color: var(--bg); }
/* ─────────────────────────────────────
SINGLE / PAGE
───────────────────────────────────── */
.g-entry-thumb { margin-bottom: 28px; overflow: hidden; }
.g-entry-thumb img { width: 100%; height: auto; display: block; }
.g-entry-body { font-size: 16px; line-height: 2; color: var(--black); }
.g-entry-body p, .g-entry-body li { margin-bottom: 1.4em; }
.g-entry-body h2 {
font-family: var(--sans);
font-size: 16px; font-weight: 700;
border: none;
margin: 1em 0;
padding-top: 2em;
}
.g-entry-body h2:first-child { padding-top: 0; }
.g-entry-body ul, .g-entry-body ol { padding-left: 0; }
/* ─────────────────────────────────────
固定ページ h2
───────────────────────────────────── */
.g-rental h2, .g-access h2, .g-theater h2, .g-contact h2 {
font-family: var(--sans);
font-size: 16px; font-weight: 700;
border: none;
margin: 1em 0;
padding-top: 2em;
}
.g-rental h2:first-child { padding-top: 0; }
.g-rental h3 {
font-size: 16px;
font-weight: 500;
border: none;
margin-top: 50px;
margin-bottom: 30px;
}
.g-rental-divider { border: none; border-top: 1px solid #ddd; margin: 40px 0; }
/* h3直後の余白をつめる */
.g-rental h3 + ul,
.g-rental h3 + p { margin-top: 0; }
/* ─────────────────────────────────────
テーブル
───────────────────────────────────── */
.g-table { display: table; border-collapse: collapse; width: 100%; margin-bottom: 2em; }
.g-table tbody { display: table-row-group; }
.g-table thead { display: table-header-group; }
.g-table tr { display: table-row; border-bottom: 1px solid #ccc; }
.g-table th {
display: table-cell;
width: 120px; min-width: 120px;
border: none;
font-weight: 500; font-size: 14px;
padding: 12px 14px;
vertical-align: middle;
white-space: nowrap;
background: transparent;
}
.g-table td { display: table-cell; border: none; font-size: 15px; padding: 12px 14px; vertical-align: middle; }
.g-table thead th { border-bottom: 1px solid var(--black); }
/* テーブルのボーダー削除 */
.g-table,
.g-table tr,
.g-table th,
.g-table td,
.g-table thead,
.g-table tbody { border: none; }
.g-table tr { border-bottom: 1px solid #eee; }
.g-table thead th { border-bottom: 1px solid var(--black); }
/* ─────────────────────────────────────
リスト
───────────────────────────────────── */
.g-list { padding-left: 0; margin-bottom: 2em; }
.g-list li { list-style: none; font-size: 16px; padding: 3px 0 3px 18px; position: relative; border-bottom: 1px solid #f0f0f0; }
.g-list li::before { content: '–'; position: absolute; left: 0; color: #666; }
/* ─────────────────────────────────────
ボタン
───────────────────────────────────── */
.g-cta-block { margin: 36px 0; text-align: center; }
.g-btn, .g-cta a, .g-share-btn, .g-404-back,
.g-search-form button, input[type="submit"], .wpcf7-submit {
display: inline-block;
border-radius: 9999px;
font-size: 14px; letter-spacing: .1em;
border: 1px solid var(--black);
padding: 10px 28px;
transition: background .15s, color .15s;
cursor: pointer;
}
.g-btn:hover, .g-cta a:hover {
background: var(--black);
color: var(--white);
}
/* ─────────────────────────────────────
シェアボタン
───────────────────────────────────── */
.g-share { display: flex; align-items: center; gap: 10px; margin: 28px 0 0; padding-top: 20px; border-top: 1px solid var(--gray); }
.g-share-label { font-size: 13px; color: #555; }
.g-share-btn {
display: inline-flex;
align-items: center;
gap: 7px;
font-size: 13px;
border: 1px solid var(--black);
padding: 5px 14px;
}
.g-share-btn:hover { background: var(--black); color: var(--white); }
.g-share-btn:hover svg { fill: var(--white); }
/* ─────────────────────────────────────
パンくず
───────────────────────────────────── */
.g-breadcrumb, .g-breadcrumb a, .g-breadcrumb span { font-family: var(--sans); font-size: 12px; color: #555; }
.g-breadcrumb { margin-bottom: 20px; }
.g-breadcrumb span { margin: 0 5px; }
@media (max-width: 720px) { .g-breadcrumb, .g-breadcrumb a, .g-breadcrumb span { font-size: 10px; } }
/* ─────────────────────────────────────
ページタイトル
───────────────────────────────────── */
.g-page-title { font-family: var(--serif); font-size: 20px; font-weight: 400; letter-spacing: .1em; border: none; padding-bottom: 14px; margin-bottom: 28px; }
.g-page-date { font-family: var(--serif); font-size: 13px; color: #555; margin-top: 6px; }
.g-post-nav { display: flex; justify-content: space-between; margin-top: 32px; font-size: 13px; border-top: 1px solid var(--gray); padding-top: 16px; gap: 16px; }
.g-pagination { margin-top: 40px; display: flex; justify-content: center; gap: 6px; }
.g-pagination a, .g-pagination span { display: inline-block; padding: 6px 12px; font-size: 13px; border: 1px solid var(--gray); }
.g-pagination .current { background: var(--black); color: var(--white); }
/* ─────────────────────────────────────
作家情報
───────────────────────────────────── */
.g-exh-artists { margin-top: 40px; border-top: 1px solid var(--black); padding-top: 28px; }
.g-exh-artists::before { content: '参加作家'; display: block; font-size: 16px; font-weight: 700; margin-bottom: 24px; }
.g-exh-artist { display: flex; flex-direction: column; gap: 16px; margin-bottom: 40px; }
.g-exh-artist-img { width: 50%; }
.g-exh-artist-img img { width: 100%; height: auto; object-fit: cover; }
.g-exh-artist-name { font-size: 15px; font-weight: 700; margin-bottom: 8px; border: none; }
.g-exh-artist-profile { font-size: 16px; line-height: 1.9; }
/* ─────────────────────────────────────
アクセス
───────────────────────────────────── */
.g-map-wrap { margin-bottom: 2em; }
.g-map-wrap iframe { width: 100%; height: 400px; display: block; border: 0; }
.g-access-list { list-style: none; padding: 0; margin-bottom: 2em; }
.g-access-list li { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--gray); font-size: 16px; }
.g-access-type { flex-shrink: 0; width: 60px; font-size: 13px; border: 1px solid var(--gray); text-align: center; padding: 3px 0; height: fit-content; }
@media (max-width: 640px) { .g-access-list li { flex-direction: column; gap: 6px; } }
/* ─────────────────────────────────────
レンタル
───────────────────────────────────── */
.g-rental-images { display: flex; flex-direction: column; gap: 12px; margin-bottom: 32px; }
.g-rental-images img { width: 100%; height: auto; display: block; }
.g-theater-credit { margin-top: 2em; font-size: 14px; }
/* ─────────────────────────────────────
Contact Form 7
───────────────────────────────────── */
.g-cf7-wrap { max-width: 560px; margin-top: 32px; }
.g-cf7-wrap .cf7-row, .g-cf7-wrap .cf7-type-row { margin-top: 20px; margin-bottom: 0; }
.g-cf7-wrap label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 10px; }
.wpcf7 br { display: none; }
.g-cf7-wrap input[type="text"],
.g-cf7-wrap input[type="email"],
.g-cf7-wrap textarea {
width: 100%;
border: 1px solid #ccc;
border-radius: 0;
padding: 10px 14px;
font-size: 15px;
font-family: var(--sans);
background: var(--white);
outline: none;
transition: border-color .2s;
box-sizing: border-box;
}
.g-cf7-wrap input:focus, .g-cf7-wrap textarea:focus { border-color: var(--black); }
.g-cf7-wrap textarea { min-height: 160px; resize: vertical; }
.g-cf7-wrap textarea::placeholder { white-space: pre-line; line-height: 1.8; }
.g-cf7-wrap input[type="submit"], .g-cf7-wrap .wpcf7-submit {
background: var(--black); color: var(--white);
border: 1px solid var(--black);
padding: 10px 32px; font-size: 14px; letter-spacing: .1em;
border-radius: 9999px;
transition: opacity .2s;
margin-top: 8px;
}
.g-cf7-wrap input[type="submit"]:hover { opacity: .75; }
.g-cf7-wrap .wpcf7-radio .wpcf7-list-item { display: block; margin: 0 0 8px 0; }
.g-cf7-wrap .wpcf7-radio .wpcf7-list-item label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.g-cf7-wrap .wpcf7-radio input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: var(--black); }
.g-cf7-wrap input[type="file"] { width: 100%; font-size: 13px; padding: 8px 0; }
.wpcf7-response-output { border: 1px solid #ccc; padding: 12px 16px; font-size: 13px; margin-top: 16px; }
.wpcf7-mail-sent-ok { border-color: #27ae60; color: #27ae60; }
.wpcf7-validation-errors, .wpcf7-mail-sent-ng { border-color: var(--red); color: var(--red); }
.wpcf7-not-valid-tip { font-size: 12px; color: var(--red); margin-top: 4px; }
/* ─────────────────────────────────────
サンクス / 404 / 検索
───────────────────────────────────── */
.g-thanks { text-align: center; padding: 60px 20px 80px; }
.g-thanks-title { font-size: 22px; font-weight: 700; margin-bottom: 20px; }
.g-thanks-msg { font-size: 15px; line-height: 2; margin-bottom: 36px; }
.g-404 { text-align: center; padding: 80px 20px; }
.g-404-num { font-family: var(--serif); font-size: 80px; color: #ddd; display: block; margin-bottom: 16px; }
.g-404-msg { font-size: 15px; margin-bottom: 32px; }
.g-search-form { display: flex; margin-bottom: 32px; }
.g-search-form input[type="search"] { flex: 1; border: 1px solid var(--gray); border-right: none; padding: 8px 14px; font-size: 15px; outline: none; }
.g-search-form button { background: var(--black); color: var(--white); border: 1px solid var(--black); padding: 8px 18px; font-size: 13px; cursor: pointer; }
/* ─────────────────────────────────────
トップに戻るボタン
───────────────────────────────────── */
#g-to-top, #g-to-top::before, #g-to-top::after { all: unset; }
#g-to-top {
position: fixed;
bottom: 32px; right: 28px;
z-index: 800;
width: 44px; height: 44px;
border-radius: 50%;
background: var(--white);
border: 1px solid var(--black);
cursor: pointer;
display: flex; align-items: center; justify-content: center;
opacity: 0; pointer-events: none;
transition: opacity .3s, background .2s;
}
#g-to-top.is-visible { opacity: 1; pointer-events: auto; }
#g-to-top:hover { background: var(--black); }
#g-to-top:hover svg { stroke: var(--white); }
#g-to-top svg { width: 16px; height: 16px; stroke: var(--black); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; display: block; }
@media (max-width: 720px) { #g-to-top { bottom: 20px; right: 16px; } }
/* ─────────────────────────────────────
FOOTER
───────────────────────────────────── */
#g-footer { background: var(--bg); border: none; }
.g-footer-inner { max-width: var(--wrap); margin: 0 auto; padding: 0 20px 24px; }
.g-footer-copy { font-size: 11px; color: #555; }
.g-footer-loop { overflow: hidden; width: 100%; padding: 20px 0; }
.g-footer-loop-inner { display: flex; flex-wrap: nowrap; width: max-content; animation: loop-scroll 20s linear infinite; }
.g-footer-loop-inner img { height: 50px; width: auto; margin: 0 32px; flex-shrink: 0; display: block; }
@keyframes loop-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
.g-footer-loop:hover .g-footer-loop-inner { animation-play-state: paused; }
.g-footer-marquee { display: none; }
/* ─────────────────────────────────────
プレースホルダー
───────────────────────────────────── */
.g-hero-placeholder { background: #efefef; aspect-ratio: 16/9; display: flex; align-items: center; justify-content: center; }
.g-hero-placeholder span { font-size: 14px; color: #bbb; }
.g-exh-hero { width: 100%; margin-bottom: 24px; overflow: hidden; }
.g-exh-hero img { width: 100%; height: auto; display: block; }
/* ─────────────────────────────────────
Astra 上書き（必要最低限）
───────────────────────────────────── */
.ast-container a, #ast-fixed-header a, .main-header-menu a, .menu-item a { color: var(--black) !important; }
body #g-nav > ul > li > a:hover,
body #g-header .g-nav > ul > li > a:hover { color: #339CD3 !important; opacity: 1 !important; }
/* ハンバーガーボタン */
#g-burger, .g-burger {
z-index: 1001 !important;
box-shadow: none !important;
border-radius: 0 !important;
background: transparent !important;
outline: none !important;
-webkit-appearance: none !important;
appearance: none !important;
}
#g-burger:focus, .g-burger:focus {
outline: none !important;
box-shadow: none !important;
}
/* モバイルメニュー縦100% */
@media (max-width: 900px) {
#g-nav.open {
height: calc(100vh - var(--nav-h)) !important;
bottom: 0 !important;
overflow-y: auto !important;
}
}
/* ─────────────────────────────────────
モバイルメニュー内SNS
───────────────────────────────────── */
.g-nav-sns {
display: none;
position: fixed;
bottom: 48px;
left: 0;
right: 0;
padding: 16px 24px;
gap: 20px;
align-items: center;
background: var(--bg);
z-index: 1000;
width: 100%;
}
#g-nav.open .g-nav-sns { display: flex; }
.g-nav-sns a {
color: var(--black);
opacity: .7;
padding: 0;
height: auto;
line-height: 1;
border: none;
display: inline-flex;
}
.g-nav-sns a:hover { color: #339CD3; opacity: 1; }
.calendar-section {
padding: 60px 20px;
}
.section-inner {
max-width: 960px;
margin: 0 auto;
}
#my-calendar {
margin-top: 20px;
}