@charset "utf-8";
/* レイアウトのためのCSS */

body{
    font-family:"游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	color: #333;
	font-size:1rem;
	line-height:1.85;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	word-wrap: break-word;
    background-color:#7F7F7F;
}

@media screen and (max-width:768px) { 
    body{
        font-size:0.8rem;
    }
}

*{box-sizing: border-box;}

ul{
    margin:0; padding: 0; list-style: none;
}

a{
    color: #333; text-decoration: none; outline: none;
}

img{
    width: 100%; height: auto;
}

/* font-family */
#splash-logo,
.top-lead,
h1,
h2,
h3 span,
#g-nav,
#pc-nav,
.openbtn,
#footer{
    font-family: 'Lato', sans-serif;
    letter-spacing: 0.1em;
}

/* g-nav */
#g-nav.panelactive li:last-child a{
    margin: 30px 0 0 0;
    padding: 10px 20px;
    border: 2px solid #333;
    white-space: nowrap;
}

/*pc-nav*/
#pc-nav span.bgLRextend::before{ background:#fff; }

@media (max-width: 990px) {
    #pc-nav li a ruby,
    #pc-nav li a rt {
      opacity: 0;              /* アニメ付きで消したい場合 */
      transition: opacity .25s ease;
      /* 完全に消してクリックも無効にするなら ↓ に変更
      display: none;
      */
    }
  }

/* heading */
h1{
    font-size: 1.5rem;
    position: absolute;
    top: 40%;
    left: 5%;
    line-height: 1;
    letter-spacing: 0.2em;
}
@media screen and (max-width:550px){ h1{ font-size:1.2rem; top: 32%; } }
h1 a{
    color:#e2a2b1;
}

h2{
    font-size: 3rem;
}
@media screen and (max-width:768px){
    h2{ font-size:2rem; }
}

/* lead */
.top-lead{
    font-family:'Parisienne', cursive;
    position: fixed;
    bottom:10%;
    left:5%;
    font-size:3rem;
    font-weight: bold;
    line-height: 1.5;
}
.top-lead span.bgLRextend::before{ background:#333; }
@media screen and (max-width:550px){ .top-lead{ font-size:2.2rem; } }
@media screen and (max-width:380px){ .top-lead{ font-size:1.8rem; } }

/* main-area */
#main-area{
    width:90%;
    margin:0 auto;
    padding: 50px 0;
}

/* =========================
   concept（横幅いっぱいの帯）
   ========================= */
#concept{
    position: relative;
    /* 画面幅いっぱいに広げる（フルブリード） */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);

    /* 横長の帯としての高さ（必要に応じて調整） */
    min-height: 28vh;          /* PC */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;

    /* 背景画像を中央で全面表示 */
    background: url("../img/cutMenu_bg.png") no-repeat center center / cover;
}
@media screen and (max-width:768px){
    #concept{ min-height: 22vh; margin-bottom: 50px; }
}

/* コンテンツの内側余白とコントラスト補助 */
#concept .concept-inner{
    padding: 40px 20px;
    /* 文字が背景で潰れないように薄いオーバーレイ */
    background: rgba(255,255,255,0.0); /* 必要なら 0.12 などに */
}
#concept h2{ color:#e2a2b1; margin: 0 0 10px; }
#concept p{ line-height: 2; color:#333; }

/* menu */
.pad-x-30 {
    padding-inline: 30px;
    /* 念のためのフォールバック */
    padding-left: 200px;
    padding-right: 200px;
  }
@media screen and (max-width:768px){
    .pad-x-30{
        padding-left: 0px;
        padding-right: 0px;
    }
}

/* footer */
#footer{
    padding: 20px 0px 0px 0px;
    border-top:1px solid #7F7F7F;
    text-align: center;
    background: url("../img/cutMenu_bg.png") no-repeat center center / cover;
    position: relative;
}
#footer .footer-logo{ font-weight: bold; letter-spacing: 0.3em; margin: 0 0 50px 0; color: #fff; }
#footer small{ color:#fff; }
/* --- Footer SNS --- */
#footer .footer-sns{
    margin: 18px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px 18px;
    flex-wrap: wrap;
    text-align: center;
}
#footer .footer-sns__label{ margin: 0 6px 0 0; font-weight: 600; font-size: clamp(14px, 1.6vw, 16px); color:#fff;}
#footer .sns-icons{ list-style: none; display: flex; gap: 10px; margin: 0; padding: 0; }
#footer .sns-icons a{ display: inline-flex; padding: 6px; border-radius: 10px; transition: transform .2s ease, opacity .2s ease; }
#footer .sns-icons a:hover{ transform: translateY(-2px); opacity: .9; }
#footer .sns-icons img{ display: block; width: 32px; height: 32px; }
@media (min-width: 768px){ #footer .sns-icons img{ width: 36px; height: 36px; } }

/* ========== 既存 ========== */
#top-main{
	width:100%;
	height: 100vh;
	text-shadow:
    0 0 5px #fff,
    0 0 5px #fff,
    0 0 5px #fff,
    0 0 5px #fff,
    0 0 5px #fff;
	position: relative;
}
#top-main:before{
	content: '';
	position:fixed;
	z-index:-1;
	width:100%;
	height: 100%;
	background:url("../img/main_image.png") no-repeat center;
	background-size:cover;
}
@media screen and (max-width:768px){
    #top-main:before{ background-position: top center; background-size:auto 90%; }
}
#container{ position: relative; z-index:1; background:#7F7F7F; }