* { margin: 0; padding: 0; box-sizing: border-box; }
body, html { width: 100%; height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif; background: #f0f0f0; }

.background-layer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-image: url('../top2.webp'); background-size: cover; background-position: center; }

/* コンテンツレイアウト：元の位置関係を厳密に定義 */
.content { 
    position: relative; z-index: 2; 
    width: 100%; height: 100%; 
    padding: 50px; 
    display: flex; flex-direction: column; justify-content: space-between; 
}
.text-wrap { text-shadow: 0 1px 3px rgba(0,0,0,0.3); color: #fff; }

/* 上部エリア */
.top-row { display: flex; justify-content: space-between; align-items: flex-start; }
h1 { font-size: 1.1rem; font-weight: 300; letter-spacing: 0.3em; text-transform: uppercase; }
p { font-size: 0.7rem; letter-spacing: 0.25em; margin-top: 8px; opacity: 0.8; line-height: 1.6; }
.hamburger-btn { cursor: pointer; font-size: 0.8rem; letter-spacing: 0.2em; }

/* 下部エリア：margin-top: auto を削除し、paddingによる配置に依存させる */
.bottom-row { }
.fixed-nav { list-style: none; }
.fixed-nav li { margin-top: 10px; }
.fixed-nav li a { font-size: 0.8rem; letter-spacing: 0.1em; color: #fff; text-decoration: none; opacity: 0.8; transition: opacity 0.3s; }
.fixed-nav li a:hover { opacity: 0.5; }

/* ハンバーガーメニュー用のスタイル */
.menu-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.95); z-index: 9999; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: opacity 0.4s ease; }
.menu-overlay.is-active { opacity: 1; visibility: visible; }
.menu-overlay.is-active ~ .content .hamburger-btn,
.menu-overlay.is-active ~ .content .hamburger {
    visibility: hidden;
    opacity: 0;
}
.menu-nav ul { list-style: none; text-align: center; }
.menu-nav li { margin: 20px 0; }
.menu-nav a { font-size: 1.2rem; color: #333; text-decoration: none; letter-spacing: 0.2em; font-weight: 300; }
.menu-close { position: absolute; top: 50px; right: 50px; cursor: pointer; color: #333; font-size: 0.8rem; letter-spacing: 0.2em; }

@media (max-width: 600px) { .content { padding: 30px; } }