@charset "UTF-8";

:root {
    /* Color Palette */
    --bg-color: #121212;
    --bg-secondary: #1a1a1a;
    --text-color: #f0f0f0;
    --accent-color: #d4af37; /* Gold */
    --accent-hover: #b4942b;
    --border-color: #333;

    /* Fonts */
    --font-main: 'Noto Sans JP', sans-serif;
    --font-title: 'Noto Serif JP', serif;
}

/* Reset & Base Styles */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: var(--font-main);
    line-height: 1.8;
    margin: 0;
    padding: 0;
}

/* スマホ用改行をデフォルト(PC等)で隠す */
.sp-only {
    display: none;
}

a {
    color: var(--text-color);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--accent-color);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-title);
    color: var(--accent-color);
    line-height: 1.4;
    margin-top: 0;
}


/* Content Wrapper (横スクロール防止用) */
.site-content-wrapper {
    width: 100%;
    overflow-x: hidden;
}



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

/* PC/スマホ改行出し分け用のユーティリティクラス */
.pc-only {
    display: block;
}

.sp-only {
    display: none;
}

/* Custom Logo */
.custom-logo-link img {
    max-height: 60px;
    width: auto;
}

/* Media Query (Common) */
@media (max-width: 768px) {
    .sp-only {
        display: block; /* スマホ表示時は改行として機能させる */
    }

    .pc-only {
        display: none; /* スマホ表示時は非表示にして不要な改行を防ぐ */
    }



}