@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*barシャトーのCSS*/

/*筆文字のフォント｜カスタマイズ→高度な設定→header直前にadobe fontsのscriptのコードを入れている*/
.fude{
    font-family: sicyubi-mohitsugyosho, sans-serif!important;
}


@media screen and (max-width: 599px){
.onpc{display: none;}
}
@media screen and (min-width: 600px){
.onsp{display: none;}
}

.center{
    text-align: center;
}

.c-gnav>.menu-item>a:after {
    bottom: 30%;
}
.l-fixHeader__gnav .c-gnav>.menu-item>a:after{
        bottom: 20%;
}
.c-gnav, div#sp_menu{
    font-weight: 700;
}
.c-gnav>.menu-item.menu-item-300>a:after{
display: none;
}
.header-time {
    background: #932e44;
    color: #fff;
    padding: 1em;
}
.sp-menu-time {
    background: #fff;
    color: #932e44;
    padding: 0.5em 1em;
    text-align: center;
    width: 80%;
    margin: 0 auto;
}


@media screen and (min-width: 600px){
    .pc-center{text-align: center;}
}
@media screen and (max-width: 599px){
    .sp-center{text-align: center;}
}

@media screen and (min-width: 600px){
    .pc-mar-bt-1rem{margin-bottom:1rem!important;}    
    .pc-mar-bt-2rem{margin-bottom:2rem!important;}
    .pc-mar-bt-4rem{margin-bottom:4rem!important;}
    .pc-mar-bt-5rem{margin-bottom:5rem!important;}

    .pc-pad-top-2rem{padding-top:2rem!important;}

    .pc-pad-bt-2rem{padding-bottom:2rem!important;}
    .pc-pad-bt-4rem{padding-bottom:4rem!important;}
}
@media screen and (max-width: 599px){
    .sp-mar-bt-1rem{margin-bottom:1rem!important;} 
    .sp-mar-bt-2rem{margin-bottom:2rem!important;}
    .sp-mar-bt-3rem{margin-bottom:3rem!important;}
    .sp-mar-bt-4rem{margin-bottom:4rem!important;}
    .sp-mar-bt-5rem{margin-bottom:5rem!important;}
    .sp-mar-bt-8rem{margin-bottom:8rem!important;}

    .sp-pad-top-2rem{padding-top:2rem!important;}

    .sp-pad-bt-2rem{padding-bottom:2rem!important;}    
    .sp-pad-bt-4rem{padding-bottom:4rem!important;}

}

@media screen and (min-width: 600px){
    .pc-fs-0_8rem{font-size: 0.8rem;}
    .pc-fs-1_2rem{font-size: 1.2rem;}
    .pc-fs-3rem{font-size: 3rem;}
}
@media screen and (max-width: 599px){
    .sp-fs-0_8rem{font-size: 0.8rem;}
    .sp-fs-0_9rem{font-size: 0.9rem;}
    .sp-fs-1_2rem{font-size: 1.2rem;}
}

.white{color: #fff;}

/*-----トップページのスタッフ一覧 ここから-----*/
@media screen and (min-width: 600px){
    .top-staff-column{
        width: 90%;
        margin: 0 auto 3rem!important;
    }
}
@media screen and (max-width: 599px){
    .top-staff-column{
        padding:0 1em 0!important;
        margin-bottom: 2rem!important;
    }
}
.top-staff-name-main-right{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 3rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    top: 7%;
    right: 2%;
}
.top-staff-name-main-left, .top-staff-name-main-left-en{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 3rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    bottom: 7%;
    left: 2%;
}
@media screen and (max-width: 599px){
 .top-staff-name-main-left{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 3rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    bottom: 2%;
    left: 2%;
}
 .top-staff-name-main-left-en{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 3rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    bottom: 2%;
    left: 2%;
}   
}
.top-staff-name-main-left ruby, .top-staff-name-main-left-en ruby{
    ruby-position: over;
}
.top-staff-name-sub-right{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    top: 7%;
    right: 2%;
}
.top-staff-name-sub-left{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    bottom: 7%;
    left: 2%;
}
@media screen and (max-width: 599px){
    .top-staff-name-sub-left{
    position: absolute;
    color: #fff;
    writing-mode: vertical-rl;
    font-size: 2rem;
    font-weight: 700;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    bottom: 2%;
    left: 0%;
}
}
.top-staff-name-sub-left ruby{
    ruby-position: over;
}
@media screen and (max-width: 599px){
    .top-staff-name-sub-left ruby>rt{
        margin-left: -0.5em!important;
    }
}

/*---スタッフの写真の上に乗せるボタン ここから---*/
/* 1. 親要素：ボタンを右下に配置するための基準点にする */
.top-staff-box {
  position: relative;
}

/* 2. ボタン要素：位置の指定とアニメーションを追加 */
a .top-staff-btn-01 {
  border: 1px solid #932e44;
  color: #932e44;
  padding: 0.5em 1em;
}
a .top-staff-btn-02{
  font-size: 0.8rem;
  border: 1px solid #932e44;
  color: #932e44;
  padding: 0.5em 1em;
}
@media screen and (max-width: 599px){
 a .top-staff-btn-02{
  font-size: 0.8rem;
  border: 1px solid #932e44;
  color: #932e44;
  padding: 0.2em 0.7em;
}   
}

 a .top-staff-btn-01, a .top-staff-btn-02{ 
  /* --- 右下配置のための設定 --- */
  position: absolute;
  right: 15px;  /* 右からの余白（お好みで調整してください） */
  bottom: 45px; /* 下からの余白（お好みで調整してください） */
  margin: 0;    /* pタグ特有の上下マージンをリセット */
  background-color: rgba(255, 255, 255, 0.9); /* 画像と重なっても文字が見えるように背景色（白）を設定 */
  cursor: pointer; /* マウスホバー時にポインターにする */

  /* --- ふわふわアニメーションの指定 --- */
  /* 1.5秒かけて往復（alternate）し、永遠に（infinite）繰り返します */
  animation: fuwafuwa 1.5s ease-in-out infinite alternate;

  /* ★追加：色の変化を1.5秒かける指定（背景色と文字色を対象に） */
  transition: background-color 1.5s ease, color 0.2s ease;
}
@media screen and (max-width: 599px){
a .top-staff-btn-02{ 
  /* --- 右下配置のための設定 --- */
  position: absolute;
  right: 5px;  /* 右からの余白（お好みで調整してください） */
  bottom: 45px; /* 下からの余白（お好みで調整してください） */
  margin: 0;    /* pタグ特有の上下マージンをリセット */
  background-color: rgba(255, 255, 255, 0.9); /* 画像と重なっても文字が見えるように背景色（白）を設定 */
  cursor: pointer; /* マウスホバー時にポインターにする */

  /* --- ふわふわアニメーションの指定 --- */
  /* 1.5秒かけて往復（alternate）し、永遠に（infinite）繰り返します */
  animation: fuwafuwa 1.5s ease-in-out infinite alternate;

  /* ★追加：色の変化を1.5秒かける指定（背景色と文字色を対象に） */
  transition: background-color 1.5s ease, color 0.2s ease;
}
}
a .top-staff-btn-01:hover, a .top-staff-btn-02:hover{
    background: #932e44;
    color: #fff;
}

/* 3. ふわふわ動くアニメーションの動きを定義 */
@keyframes fuwafuwa {
  0% {
    transform: translateY(0); /* 初期位置 */
  }
  100% {
    transform: translateY(-6px); /* 上に6px浮き上がる */
  }
}
/*---スタッフの写真の上に乗せるボタン ここまで---*/
/*-----トップページのスタッフ一覧 ここまで-----*/



a .staff-page-instagram-icon{
    color: #fff;
}
a .staff-page-instagram-icon:hover{
    opacity: 0.8;
}

@media screen and (min-width: 600px){
    .staff-page-staff-image-box{
    position: relative!important;
}
    .page-id-56 .l-topTitleArea{
        min-height: 320px!important;
    }
    .page-id-56 .c-pageTitle, .page-id-97 .c-pageTitle{
        font-size: 3.5em!important;
        text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    }
    .page-id-56 .l-mainContent__inner>.post_content, .page-id-97 .l-mainContent__inner>.post_content {
    margin-top: -7em !important;
}
.page-id-171 .l-mainContent__inner>.post_content{
margin-top: -3em !important;
}
.page-id-239 .l-mainContent__inner>.post_content, .page-id-416 .l-mainContent__inner>.post_content{
    margin-top: -4em !important;
}
.page-id-97 .u-obf-cover{
    height: 286% !important;
}
    .staff-page-namahamu-samurai img {
    width: 35%;
}
.staff-page-instagram-icon {
    position: absolute;
    right: 28%;
    font-size: 2em;
    bottom: 0%;
    z-index: 10;
}
.bottle-image img {
    width: 40%;
    margin: 0 auto !important;
}
.bottle-image-20260723 img {
    width: 25%;
    margin: 0 auto !important;
}
}
@media screen and (max-width: 599px){
    .staff-page-staff-image-box{
    position: relative!important;
    padding-bottom: 2em!important;
}
    .page-id-56 .c-pageTitle, .page-id-97 .c-pageTitle{
        font-size: 2em!important;
        text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
    }
    .page-id-56 .l-mainContent__inner>.post_content, .page-id-97 .l-mainContent__inner>.post_content {
    margin-top: -5rem !important;
}
.page-id-171 .l-mainContent__inner>.post_content{
    margin-top: -1rem !important;
}
.page-id-239 .l-mainContent__inner>.post_content, .page-id-416 .l-mainContent__inner>.post_content{
    margin-top: -2rem !important;
}
.staff-page-instagram-icon {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        font-size: 2em;
        bottom: -2%;
        z-index: 10;
}
.bottle-image img, .bottle-image-20260723 img {
    width: 50% !important;
}
}

div#breadcrumb, .l-topTitleArea {
    z-index: 10;
}
.page-id-97 div#breadcrumb, .page-id-56 div#breadcrumb{
    color: #fff;
}

#body_wrap.page-id-97, #body_wrap.page-id-171{
    background: #000!important;
}
#body_wrap.page-id-239{
    background: #f0e8e3!important;
}
.page-id-171 h1.c-pageTitle, .page-id-239 h1.c-pageTitle, .page-id-416 h1.c-pageTitle{
    display: none;
}
@media screen and (min-width: 600px){
#body_wrap.page-id-416{
    max-width: 100%;
    overflow-x: clip;
    position: relative;
    z-index: 1;
    background-image: url(https://dev-chateau.sample-web-site.work/wp-content/uploads/2026/08/20260806-onigiri-bg-01.webp);
    background-size: cover;
    background-attachment: fixed;
}
}
@media screen and (max-width: 599px){
/*↓のcssでスマホでもスクロール時の背景固定が可能*/
#body_wrap.page-id-416::before {
    content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100vh;
background-repeat:no-repeat;
background-position:50% 100%;
background-image: url(https://dev-chateau.sample-web-site.work/wp-content/uploads/2026/08/20260806-onigiri-bg-01.webp);
background-size:cover;
}
}

.gold-text-grad-01 {
  /* 1. 金色のグラデーション（暗い金、明るい金、暗い金をブレンド） */
  background-image: linear-gradient(45deg, #a67c1e 0%, #fbf5b7 50%, #aa771c 100%);

  /* 2. 文字の形にくり抜く */
  -webkit-background-clip: text;
  background-clip: text;

  /* 3. 元の文字色を透明にする */
  -webkit-text-fill-color: transparent;
  color: transparent;

  /* 金色は太めのフォント（Bold）のほうが輝きがハッキリわかります */
  font-weight: bold; 

  font-size: 1.5rem;
}

.gold-text-grad-02 {
  /* 1. 金色のグラデーション（暗い金、明るい金、暗い金をブレンド） */
  background-image: linear-gradient(45deg, #c5a059 0%, #fdf1d6 50%, #c5a059 100%);

  /* 2. 文字の形にくり抜く */
  -webkit-background-clip: text;
  background-clip: text;

  /* 3. 元の文字色を透明にする */
  -webkit-text-fill-color: transparent;
  color: transparent;

  /* 金色は太めのフォント（Bold）のほうが輝きがハッキリわかります */
  font-weight: bold; 

  font-size: 1.5rem;
}

.gold-text-grad-03 {
  /* 1. 金色のグラデーション（暗い金、明るい金、暗い金をブレンド） */
  background-image: linear-gradient(45deg, #b38728 0%, #fbf5b7 50%, #b38728 100%);

  /* 2. 文字の形にくり抜く */
  -webkit-background-clip: text;
  background-clip: text;

  /* 3. 元の文字色を透明にする */
  -webkit-text-fill-color: transparent;
  color: transparent;

  /* 金色は太めのフォント（Bold）のほうが輝きがハッキリわかります */
  font-weight: bold; 

  font-size: 1.5rem;
}

.namahamu-kiwami, .namahamu-syouchikubai {
    display: flex;
    font-weight: 700;
    align-items: end;
    justify-content: center;
}
.namahamu-kiwami .left-clomun, .namahamu-kiwami .center-clomun, .namahamu-syouchikubai .left-clomun {
    margin-right: 2em;
}
.namahamu-kiwami .midashi, .namahamu-syouchikubai .midashi{
    font-size: 6rem;
    color:#C5A059;
    text-align: center;
    margin-bottom: -0.1em !important;
    line-height: 1.3em;
}
.namahamu-kiwami .sub{
    font-size: 2rem;
    color:#C5A059;
    text-align: center;
}
.namahamu-kiwami .price, .namahamu-kiwami .text, .namahamu-syouchikubai .price{
    color: #fff;
}
.namahamu-kiwami .price span, .namahamu-syouchikubai .price span{
font-size: 3rem;
}
.namahamu-kiwami .ninmae, .namahamu-syouchikubai .ninmae{
    display: inline-block;
    background-image: linear-gradient(45deg, #a67c1e 0%, #fbf5b7 50%, #aa771c 100%);
    color: #000;
    padding: 0.5rem 1rem!important;
    text-align: center;
margin-bottom: -1em!important;
}
.namahamu-chuigaki {
    color: #fff;
    display: table;
    margin: 0 auto;
    font-size: 0.9rem;
}

@media screen and (min-width: 600px){
    .namahamu-syouchikubai-column {
    width: 80%;
    margin: 0 auto;
}
}
@media screen and (max-width: 599px){
    .namahamu-kiwami .sub{
    font-size: 1.5rem;
    color:#C5A059;
    text-align: center;
}
.namahamu-kiwami .price{
    color: #fff;
    line-height: 1.5em;
    margin-top: 1.5em!important;
}
}

@media screen and (min-width: 600px){
.pto-box {
    display: flex;
    font-weight: 700;
    align-items: center;
    justify-content: center;
}
.pto-box .left-column, .pto-box .center-column{
margin-right: 2em;
}
.pto-box .gaiyou{
text-align:center;
font-weight:700;
font-size:1.5rem;
}
.pto-box .gaiyou .fudeline{
  /* 文字と線の重なりを調整するためインラインブロックにする */
  display: inline-block;
  position: relative;
  padding: 0 10px; /* 左右の余白（線が文字より少し飛び出るように） */

  /* ★ fill='%23d3a26b' に変更し、見えやすくするため opacity='0.5' に調整しました */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 30' preserveAspectRatio='none'%3E%3Cfilter id='brush'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.05 0.9' numOctaves='3' result='noise'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='noise' scale='7' xChannelSelector='R' yChannelSelector='G'/%3E%3C/filter%3E%3Cpath d='M5,12 Q150,7 295,12 L290,24 Q150,27 10,22 Z' fill='%23d3a26b' opacity='0.5' filter='url(%23brush)'/%3E%3C/svg%3E");
  
  /* 線の位置とサイズの調整 */
  background-repeat: no-repeat;
  background-position: bottom 3px center; /* 下から3pxの位置に配置 */
  background-size: 100% 100%;               /* 横幅100%、縦幅は文字の高さの50%（下半分） */
}
.pto-box .price-sub {
    margin: 0 0 -1.5em 0.5em !important;
}
.pto-box .price-sub span.num{
font-size:1.3rem;
}
.pto-box .price-main{
font-weight:700;
font-size:4rem;
}
.pto-box .price-main span.yen{
font-size:2rem;
}
.pto-box .price-main span.zei{
font-size:1rem;
}
.pto-box .set{
    background: #fff;
    border:1px solid #c29e66;
    padding: 2em!important;
    border-radius: 5px;
}
.pto-under-midashi {
  position: relative;
    display: table;
    padding: 0 6em;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 auto;
}
.pto-under-midashi:before, .pto-under-midashi:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 125px;
  height: 1px;
  background-color: #c29e66;
}
.pto-under-midashi:before {
  left:0;
}
.pto-under-midashi:after {
  right: 0;
}
}

@media screen and (max-width: 599px){
    .gaiyou{
text-align:center;
font-weight:700;
font-size:1.3rem;
margin-bottom: 1em;
}
.gaiyou .fudeline{
  /* 文字と線の重なりを調整するためインラインブロックにする */
  display: inline-block;
  position: relative;
  padding: 0 10px; /* 左右の余白（線が文字より少し飛び出るように） */

  /* ★ fill='%23d3a26b' に変更し、見えやすくするため opacity='0.5' に調整しました */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 30' preserveAspectRatio='none'%3E%3Cfilter id='brush'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.05 0.9' numOctaves='3' result='noise'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='noise' scale='7' xChannelSelector='R' yChannelSelector='G'/%3E%3C/filter%3E%3Cpath d='M5,12 Q150,7 295,12 L290,24 Q150,27 10,22 Z' fill='%23d3a26b' opacity='0.5' filter='url(%23brush)'/%3E%3C/svg%3E");
  
  /* 線の位置とサイズの調整 */
  background-repeat: no-repeat;
  background-position: bottom 3px center; /* 下から3pxの位置に配置 */
  background-size: 100% 100%;               /* 横幅100%、縦幅は文字の高さの50%（下半分） */
}
.pto-box {
    display: flex;
    font-weight: 700;
    align-items: center;
    justify-content: center;
}
.pto-box .left-column{
margin-right: 2em;
}
.pto-box .price-sub {
    margin: 0 0 -1em 0.5em !important;
}
.pto-box .price-sub span.num{
font-size:1.5rem;
}
.pto-box .price-main{
font-weight:700;
font-size:3rem;
}
.pto-box .price-main span.yen{
font-size:2rem;
}
.pto-box .price-main span.zei{
font-size:1rem;
}
.pto-box .set{
    background: #fff;
    border:1px solid #c29e66;
    padding:1em!important;
    border-radius: 5px;
    font-size: 0.9em;
}
.pto-under-midashi {
  position: relative;
    display: table;
    padding: 0 2.5em;
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0 auto;
}
.pto-under-midashi:before, .pto-under-midashi:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 40px;
  height: 1px;
  background-color: #c29e66;
}
.pto-under-midashi:before {
  left:0;
}
.pto-under-midashi:after {
  right: 0;
}
}
.pto-kugirisen{
    border-bottom:1px solid #c29e66;
}

.top-delivery-img img {
    border-radius: 5px;
}
a .top-delivery-btn {
    border: 1px solid #932e44;
    color: #932e44;
    background: #fff;
    padding: 0.2em 0.5em;
    text-align: center;
    margin: 0 auto;
}

.wid-90{
    width: 90%!important;
    margin: 0 auto 1em!important;
}
.wid-80{
    width: 80%!important;
    margin: 0 auto 1em!important;
}
.wid-70{
    width: 70%!important;
    margin: 0 auto 1em!important;
}
.wid-60{
    width: 60%!important;
    margin: 0 auto 1em!important;
}
.wid-50{
    width: 50%!important;
    margin: 0 auto 1em!important;
}
.wid-40{
    width: 40%!important;
    margin: 0 auto 1em!important;
}
@media screen and (min-width: 600px){
    .pc-wid-90{
    width: 90%!important;
    margin: 0 auto 1em!important;
}
}

@media screen and (min-width: 600px){
.deli-cta-btn {
    background: #932e44;
    padding: 0.5em;
    text-align: center;
    font-size: 1.2em;
    color: #fff;
    width: 80%;
    display: table;
    margin: 0 auto 3em;
    font-weight: 700;
}
}
@media screen and (max-width: 599px){
    .deli-cta-btn {
    background: #932e44;
    padding: 0.5em 3em;
    text-align: center;
    color: #fff;
    display: table;
    margin: 0 auto 3em;
    font-weight: 700;
}
}
.deli-cta-btn i {
    font-size: 0.8em !important;
}
@media screen and (min-width: 600px){
    a.link-pc-none{
        pointer-events: none;
    }
}
.bg-black{
    background: #000;
}