@charset "UTF-8";

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: 'Noto Serif JP', serif;
color: #333333;
background-color: #baaec4;
line-height: 2.4;
letter-spacing: 0.08em;
overflow-x: hidden;
}

html {
scroll-behavior: smooth;
}

/* ==========================================================================
ヘッダーナビゲーション（スクロールしてもついてこないように absolute に変更）
========================================================================== */
.navbar {
position: absolute; /* 画面に固定せず、ページのトップに配置する設定 */
top: 0;
left: 0;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: 40px 60px;
z-index: 100;
background: transparent;
}

.logo .signature-logo {
height: 180px;
width: auto;
display: block;
object-fit: contain;
margin-left: 30px;
}
@media (max-width: 768px) {
.logo .signature-logo {
height: 120px;
margin-left: 0;
}
}

.nav-links {
display: flex;
gap: 35px;
}

.nav-links a {
font-family: 'Cormorant Garamond', serif;
font-size: 1.2rem;
color: #333333;
text-decoration: none;
letter-spacing: -0.02em;
font-weight: 400;
transition: color 0.3s ease;
}

.nav-links a:hover {
color: #999999;
}

/* ==========================================================================
SHAKYO セクション
========================================================================== */
.shakyo-section {
position: relative;
z-index: 2;
width: 100%;
max-width: 1050px;
margin: 320px auto 0 auto;
padding: 80px 40px 160px 40px;
background-color: #f3efe6;
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
}

.shakyo-container {
width: 100%;
max-width: 900px;
margin: 0 auto;
}

.shakyo-main-title {
font-family: 'Cormorant Garamond', serif;
font-size: 3rem;
font-weight: 300;
letter-spacing: 0.05em;
text-align: center;
margin-bottom: 80px;
color: #333333;
}

.shakyo-inner-flex {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 60px;
}

.shakyo-image-block {
width: 40%;
flex-shrink: 0;
margin-top: 20px;
}

.shakyo-slideshow {
position: relative;
width: 100%;
height: 420px;
overflow: hidden;
}

.shakyo-slideshow img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0;
transition: opacity 1s ease-in-out;
}

.shakyo-slideshow img.is-show {
opacity: 1;
}

.shakyo-text-block {
width: 55%;
}

.shakyo-title {
font-size: 2.0rem;
font-weight: 400;
letter-spacing: 0.15em;
margin-bottom: 0px;
color: #333333;
}

.shakyo-subtitle {
font-family: 'Cormorant Garamond', 'Noto Serif JP', serif;
font-size: 1.2rem;
font-weight: 300;
letter-spacing: 0.05em;
margin-bottom: 35px;
color: #666666;
}

.shakyo-text {
font-size: 0.85rem;
line-height: 2.2;
text-align: justify;
text-justify: inter-character;
word-break: break-all;
font-weight: 300;
color: #333333;
margin-bottom: 2.5rem;
}

.shakyo-text-EN {
font-family: 'Montserrat', sans-serif;
font-size: 0.72rem;
line-height: 1.8;
letter-spacing: 0.08em;
text-align: justify;
font-weight: 300;
color: #555555;
}

.shakyo-footer-links {
display: flex;
flex-direction: column;
align-items: flex-end;
margin-top: 35px;
gap: 12px;
}

.shakyo-apply-link {
font-size: 0.85rem;
color: #333333;
text-decoration: none;
border-bottom: 1px solid #333333;
padding-bottom: 2px;
}

.shakyo-more-view {
font-family: 'Cormorant Garamond', serif;
font-size: 0.85rem;
color: #333333;
text-decoration: underline;
text-underline-offset: 4px;
}

/* ==========================================================================
フッター
========================================================================== */
footer {
background-color: #baaec4;
padding: 80px 0;
}

footer small {
display: block !important;
text-align: center !important;
font-family: 'Montserrat', sans-serif !important;
font-size: 10px !important;
line-height: 1 !important;
letter-spacing: 0.1em !important;
color: #333333 !important;
text-transform: uppercase !important;
margin: 0 !important;
}

/* ==========================================================================
アニメーション制御
========================================================================== */
.scroll-trigger, .fade-in, .navbar {
opacity: 0;
transform: translateY(20px);
transition: opacity 1.5s cubic-bezier(0.25, 1, 0.5, 1), transform 1.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.is-active {
opacity: 1;
transform: translateY(0);
}

.delay-nav { transition-delay: 0.2s; }
.delay-copy1 { transition-delay: 0.6s; }

/* ==========================================================================
ハンバーガーメニュー ＆ レスポンシブ設定
========================================================================== */
.menu-btn {
display: none;
background: none;
border: none;
cursor: pointer;
width: 26px;
height: 20px;
position: relative;
z-index: 1000;
}
.menu-btn span {
display: block;
position: absolute;
height: 2px;
width: 24px;
left: 50%;
transform: translateX(-50%) scaleY(0.5);
transform-origin: center;
background: #333333;
border-radius: 0;
transition: all 0.3s ease;
}
.menu-btn span:nth-child(1) { top: 2px; }
.menu-btn span:nth-child(2) { top: 9px; }
.menu-btn span:nth-child(3) { top: 16px; }

.menu-btn.is-open span:nth-child(1) {
transform: translateX(-50%) rotate(45deg) scaleY(0.5);
top: 9px;
}
.menu-btn.is-open span:nth-child(2) { opacity: 0; }
.menu-btn.is-open span:nth-child(3) {
transform: translateX(-50%) rotate(-45deg) scaleY(0.5);
top: 9px;
}

.mobile-nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-color: #fcfbfa;
display: flex;
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: opacity 0.4s ease, visibility 0.4s ease;
z-index: 900;
}

.mobile-nav.is-open {
opacity: 1;
visibility: visible;
}

.mobile-nav-links {
display: flex;
flex-direction: column;
align-items: center;
gap: 25px;
}

.mobile-link {
font-family: 'Cormorant Garamond', serif;
font-size: 1.5rem;
color: #333333;
text-decoration: none;
}

/* 1024px以下のタブレット・スマホ設定 */
@media (max-width: 1024px) {
.navbar {
position: absolute;
padding: 20px 30px;
}
.logo .signature-logo {
height: 120px;
margin-left: 0;
}
}

/* 768px以下のスマートフォン設定 */
@media (max-width: 768px) {
.nav-links { display: none !important; }
.menu-btn { display: block; }

.navbar {
position: absolute;
padding: 20px;
}

.logo .signature-logo {
height: 90px;
}

.shakyo-section {
margin-top: 100px;
padding: 40px 0 80px 0;
}

.shakyo-main-title {
font-size: 2.2rem;
margin-bottom: 40px;
}

.shakyo-inner-flex {
flex-direction: column;
gap: 30px;
}

.shakyo-image-block {
width: 100%;
max-width: 300px;
margin: 0 auto;
}

.shakyo-slideshow {
width: 100%;
height: 420px;
}

.shakyo-text-block {
width: 100%;
padding: 0 24px;
}

.shakyo-title {
font-size: 1.6rem;
}

.shakyo-subtitle {
font-size: 1.0rem;
margin-bottom: 25px;
}

.shakyo-text {
font-size: 0.85rem;
line-height: 2.0;
}
}