@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
p {
  font-family: "Zen Maru Gothic", sans-serif;
	font-weight: lighter;
}
/* p::first-letter{
  font-size: 1.5em;
} */
h1 {
	font-family: "Yuji Syuku", serif;
}

h2, h4{
	font-family: "Yuji Syuku", serif;
	letter-spacing: 0.5em;
	text-align: center;
}

h6 {
  font-family: "Zen Maru Gothic", sans-serif;
	font-weight: bold;
}

.info-list-item-content {/*TOPページの最新記事一覧*/
  font-family: "Zen Maru Gothic", sans-serif;
	font-weight: bold;
}


th, td{
	font-family:"Zen Maru Gothic", serif;
}

.content {
  margin-top: 0;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
.box-menu{
  width:calc(100%/3)!important;
  padding: 1em 2px 5px 2px;
  min-height:80px !important;
}
}

@media screen and (max-width: 1023px){
body.custom-background {
    background-image: url(https://omusubimusubi.com/wp-content/uploads/2023/10/musubi_hp_background_zentai2.png);
    background-position: left top;
background-size: contain;
}
}



/*834px以下*/
@media screen and (max-width: 834px){
 .box-menu{
  width:calc(100%/3)!important;
  padding: 1em 2px 5px 2px;
  min-height:80px !important;
}
}

@media screen and (max-width: 834px){
body.custom-background {
    background-image: url(https://omusubimusubi.com/wp-content/uploads/2023/10/musubi_hp_background_zentai2.png);
    background-position: left top;
background-size: contain;
}
}





/*480px以下*/
@media screen and (max-width: 480px){
.box-menu{
  width:calc(100%/3)!important;
  padding: 1em 2px 5px 2px;
  min-height:80px !important;
}
}

@media screen and (max-width: 480px){
body.custom-background {
    background-image: url(https://omusubimusubi.com/wp-content/uploads/2023/10/musubi_hp_background_zentai2.png);
    background-position: left top;
    background-size: contain;

}
}




/************************************
** すべてのページのタイトルを非表示にする
************************************/
.entry-title {
display: none;
}

/************************************
** ヘッダー下の余白を消す
************************************/

.logo-image * {
  display: block;
}

.logo-image {
  padding: 0;
}



/*トップページ*/
.home .header{
  background-image: url('http://omusubimusubi.com/wp-content/uploads/2023/10/top_headder.png');/*もしくはテーマ設定で設定したもの*/
}
.home .header-in{
  height: auto;/*好みの高さ*/
}


/*こだわりページ*/
.page-id-90 .header{
background-image: none;
} 
.page-id-90 .header-in{
  min-height: 0;/*好みの高さ*/
}  



/*営業日ページ*/
.page-id-108 .header{
  background-image: none;
} 
.page-id-108 .header-in{
  min-height: 0;/*好みの高さ*/
}  


/*おしながきページ*/
.page-id-77 .header{
  background-image: none;
} 
.page-id-77 .header-in{
  min-height: 0;/*好みの高さ*/
}  

/*アクセスページ*/
.page-id-110 .header{
  background-image: none;
} 
.page-id-110 .header-in{
  min-height: 0;/*好みの高さ*/
}  

/*お問い合わせページ*/
.page-id-10 .header{
  background-image: none;
} 
.page-id-10 .header-in{
  min-height: 0;/*好みの高さ*/
}  


/************************/
/* 見出しタグ */
/************************/


.news:before {
content: url('http://omusubimusubi.com/wp-content/uploads/2023/10/musubi_hp_h1_news.png');
  display: inline-block;
  vertical-align: middle;
  transform: scale(0.1);
}


/************************/
/* ボックスメニュー*/
/************************/


.box-menu {
    display: block;
    padding: 0.5em 1em;
    text-decoration: none;
    text-align: center;
    min-height: 100px;
    cursor: pointer;
    background: #fff;
    width: 25%;
    color: #000;
    box-shadow: none;
    transition: none;
}

/* ボックスメニュー小さい文字消す*/
.box-menu-description {
    display: none;
    font-size: 10px;
    opacity: 0.8;
}

/* ボックスメニューPC5*/
.box-menu {
    display: block;
    padding: 0.5em 1em;
    text-decoration: none;
    text-align: center;
    min-height: 100px;
    cursor: pointer;
    background: #fff0;
    width: 16%;
    color: #000;
    box-shadow: none;
    transition: none;
}

.box-menu:hover{
	box-shadow:none;
	 color: transparent;
	transform: scale(1.8);
}



/* モバイルスライドインメニュー */
.fa-times {
color: #000057;/* 閉じるボタンの色 */
font-size: 1em;
}
ul.menu-drawer:before {
background-color: #000057;/* Menu背景色 */
font-size: 1.2em;
}
ul.menu-drawer:after {
background-color: #fff;
}
.menu-drawer a {
color: #333 !important;/* 文字色 */
font-size: 1.2em;
font-weight: 900;
}
.menu-drawer a:hover {
background-color: #eff8f9;
}
.menu-drawer a .fas, .menu-drawer a .far,.menu-drawer a .fa,.menu-drawer a .fab {
margin-right: 3px;
}
.sub-menu li {
font-size: 0.8em;
}

.menu-drawer a {
    text-align: center;
    color: var(--cocoon-text-color);
    text-decoration: none;
    padding: 12px;
    display: block;
}

/* 更新日時色 */
.date-tags {
    color: #f5f5dc;
    line-height: 0.8;
    text-align: right;
    margin-bottom: 1em;
}


/* フッダー真ん中揃え */
.footer {
  margin-top: 40px; /*フッターとコンテンツの間に余白追加*/
  background: #c4a342; /*フッター背景色*/
  border-top: 4px solid #c4a342; /*上部にボーダー追加*/
}
.footer-bottom {
  margin-top: 14px; /*フッター内上部の余白を詰める*/
}
.footer-bottom-logo { /*ロゴの位置調整*/
  float: none;
  bottom: auto;
  position: static;
  margin-bottom: 30px;
}
.footer-bottom-logo img {
    height: 70px;
    width: auto;
}


.footer-bottom-content { /*メニュー＆クレジットの位置調整*/
  float: none;
  text-align: center;
}
.navi-footer-in > .menu-footer { /*メニューの位置調整*/
  	font-size: 20px;
	font-weight:bold;
	justify-content: center;
  margin-bottom: 40px;
}
.navi-footer-in a {
  color: #fff; /*メニューの文字色*/
}
.navi-footer-in a:hover { /*メニューのマウスホバー時の指定*/
  color: #fff; /*文字色を通常時と同じに*/
  background: none; /*背景色をなしに*/
  text-decoration: underline; /*アンダーラインを追加*/
}
.footer-bottom.fnm-text-width .menu-footer li {
  line-height: 1; /*メニューの区切りボーダーの高さを1文字分にする*/
}

.footer-bottom.fnm-text-width .menu-footer li a {
    padding: 0 20px;
}/*メニューの区切りの空間*/

.copyright {
	font-size: 10px;
  color: #fff; /*クレジットの文字色*/
}
@media screen and (max-width: 834px) {
  .navi-footer-in > .menu-footer li.menu-item {
    border: none; /*モバイルでメニューのボーダーを消す*/
  }
}



@media screen and (max-width: 460px) {
  .navi-footer-in > .menu-footer li.menu-item { /*モバイルでメニューを1カラムにする*/
    width: 100%;
    display: block;
    flex: auto;
    padding: 0.4em 0;
  }
}

.navi-footer-in > .menu-footer {
    font-size: 30px;
    font-weight: 500;
    justify-content: center;
    margin-bottom: 40px;
}

@media screen and (max-width: 1023px){
.navi-footer-in > .menu-footer {
    font-size: 50px;
    font-weight: bold;
    justify-content: center;
	letter-spacing: 1px;
    margin-bottom: 30px;
}
}

@media screen and (max-width: 834px) {
  .navi-footer-in > .menu-footer {
    font-size: 50px;
    font-weight: bold;
    justify-content: center;
	  letter-spacing: 1px;
    margin-bottom: 30px;
}
}

@media screen and (max-width: 460px) {
 .navi-footer-in > .menu-footer {
    font-size: 50px;
    font-weight: bold;
    justify-content: center;
	 letter-spacing: 1px;
    margin-bottom: 30px;
}
}

/*モバイルでヘッダー非表示*/
/*480px以下*/
@media screen and (max-width: 480px){
.header div.header-in {
min-height: 0px;
}
.header {
background-image: url(http://omusubimusubi.com/wp-content/uploads/2023/10/top_headder.png);
background-size: 250%;
background-position: center;
}
	/*トップページ*/
.home .header{
  background-image: url('http://omusubimusubi.com/wp-content/uploads/2023/10/top_headder.png');/*もしくはテーマ設定で設定したもの*/
	min-height:0px;
}
}


/* 見出しリセット */
/* 見出し2 */
.article h2{
background:none;
padding: 0;
font-weight:normal;
}

/* 見出し3 */
.article h3{
border-top:none;
border-bottom:none;
border-left:none;
border-right:none;
padding: 0;
}

/* 見出し4 */
.article h4{
border-top:none;
border-bottom:none;
padding: 0;
}

/* 見出し5 */
.article h5{
border-bottom:none;
padding: 0;
}

/* 見出し6 */
.article h6{
border-bottom:none;
padding: 0;
margin-bottom: 0;
}


/* 
.article h2 {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 35px;
	text-align: center;
	font-weight:normal; 
} */

/* .article h2::before,
.article h2::after {
	content: '';
	width: 70px;
	height: 3px;
	background-color:#a19361;
}

.article h2::before {
	margin-right: 20px;
}
.article h2::after {
	margin-left: 20px;
} */

/* ボックスメニュー文字間 */
.box-menus * {
    line-height: 1.6;
    margin: 0;
    letter-spacing: -0.07em;
}

/* PCグローバルメニューサイドスペース消去 */
/* インナーを囲む */
.wrap {
  width: auto;
  margin: 0 auto;
}



/* カラム色 */
.header-container, .main, .sidebar, .footer {
    background-color: transparent;
}

/*縦書き表示*/
.tategaki {
	writing-mode: vertical-rl;
	font-family: "Kiwi Maru", serif;
    letter-spacing: 0.3em;
	margin: 0 auto;
	line-height: 2.5;
	color:#fff;
	height: 400px;
	
}



/*縦書き表示*/
.tategaki2 {
	writing-mode: vertical-rl;
	
	font-family:"Kiwi Maru", serif;
	letter-spacing: 0.3em;
	color:#fff;
	text-shadow: 3px 5px 6px #010101;
	margin: 0 auto;
	line-height: 2.3;
	width: auto;
	height:100%;
}



/*縦書き表示*/
.tategaki3 {
	writing-mode: vertical-rl;
	font-family:"Kiwi Maru", serif;
	margin-top:30px;
	margin-bottom: 0px;
	margin-right:auto;
	margin-left: auto;
	line-height:2;
}


/*トップページコンテンツ内区切り海苔本文*/
.change-area {
     background: transparent;
	background-image: url(http://omusubimusubi.com/wp-content/uploads/2023/11/top_pc2-1.png);
background-position:center bottom;                     /* 画像の表示位置を指定 */
    background-size:cover;                                 /* 画像のサイズを指定  */
    margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
width: auto;
	margin-bottom: 0px;
	padding-top: 250px;
    height: 800px;
}

/*トップページコンテンツ内区切り海苔*/
.change-area-top {
    background: transparent;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding-right: calc(50vw - 50%);
    padding-left: calc(50vw - 50%);
	width: auto;
	margin-bottom: 0px;
	padding-top: 50px;
    padding-bottom: 10px;
	height: 100%;
}

/*トップページコンテンツ内区切り一番上*/
.change-area2 {
    background: transparent;
	background-image: url(http://omusubimusubi.com/wp-content/uploads/2023/10/musubi_hp_pctop_hakumai4.png);
background-position:center bottom;                     /* 画像の表示位置を指定 */
    background-size:cover;                                 /* 画像のサイズを指定  */
    margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
width: auto;
	margin-bottom: 0px;
	padding-top: 40px;
    height: 890px;
}

/*トップページコンテンツ内区切りbottom*/
.change-area3 {
    background: transparent;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding-right: calc(50vw - 50%);
    padding-left: calc(50vw - 50%);
	padding-top: 50px;
    padding-bottom: 50px;
	 height: 100%;
}


.tategakinori {
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding-right: calc(50vw - 50%);
    padding-left: calc(50vw - 50%);
	width: auto;
	 height: 100%;
	background: transparent;
}


.tategakinori{
writing-mode: vertical-rl;
margin-left: auto;
margin-right: auto;
}

.change-area-top {
margin-bottom: 0px;
    padding-bottom: 30px;
}



/************************************
** トップボタン
************************************/
.go-to-top-button-image{	-webkit-transition: all 1s;	transition: all 1s;
}
.go-to-top-button-image:hover{	-webkit-transform: rotate(720deg);	transform: rotate(720deg); /* 720度回転 */	opacity: 0.7; /* 透過率70% */
}
.go-to-top {	right: 10px;	bottom: 20px;
}
.go-to-top-button {	background:#bde1dc;	width: 60px; /* 横幅指定 */	height: auto;	max-width: 60px; /* 最大横幅 */
}



/************************************
** 全体背景色
************************************/
body {
    background-color: transparent;
}


.main{
    background:transparent !important;
	padding: 0px 0px;
}



@media screen and (max-width: 480px){
  main.main,
  div.sidebar {
    padding: 0px;
    margin: 12px 0;
    border-width: 0;
  }
}

@media screen and (max-width: 1023px){
   main.main,
  div.sidebar {
    padding:0px;
    margin: 12px 0;
    border-width: 0;
  }
}

@media screen and (max-width: 834px){
  main.main,
  div.sidebar {
    padding: 0px;
    margin: 12px 0;
    border-width: 0;
  }
}


element.style {
}
.wp-container-core-columns-layout-1.wp-container-core-columns-layout-1 {
    flex-wrap: nowrap;
}
.entry-content>*, .mce-content-body>*, .article p, .demo .entry-content p, .article dl, .article ul, .article ol, .article blockquote, .article pre, .article table, .article .toc, .body .article, .body .column-wrap, .body .new-entry-cards, .body .popular-entry-cards, .body .navi-entry-cards, .body .box-menus, .body .ranking-item, .body .rss-entry-cards, .body .widget, .body .author-box, .body .blogcard-wrap, .body .login-user-only, .body .information-box, .body .question-box, .body .alert-box, .body .information, .body .question, .body .alert, .body .memo-box, .body .comment-box, .body .common-icon-box, .body .blank-box, .body .button-block, .body .micro-bottom, .body .caption-box, .body .tab-caption-box, .body .label-box, .body .toggle-wrap, .body .wp-block-image, .body .booklink-box, .body .kaerebalink-box, .body .tomarebalink-box, .body .product-item-box, .body .speech-wrap, .body .wp-block-categories, .body .wp-block-archives, .body .wp-block-archives-dropdown, .body .wp-block-calendar, .body .ad-area, .body .wp-block-gallery, .body .wp-block-audio, .body .wp-block-cover, .body .wp-block-file, .body .wp-block-media-text, .body .wp-block-video, .body .wp-block-buttons, .body .wp-block-columns, .body .wp-block-separator, .body .components-placeholder, .body .wp-block-search, .body .wp-block-social-links, .body .timeline-box, .body .blogcard-type, .body .btn-wrap, .body .btn-wrap a, .body .block-box, .body .wp-block-embed, .body .wp-block-group, .body .wp-block-table, .body .scrollable-table, .body .wp-block-separator, .body .wp-block, .body .video-container, .comment-area, .related-entries, .pager-post-navi, .comment-respond {
    margin-bottom: 0;
}


.kome_center{
text-align: center;
}

.has-text-align-left tategaki has-medium-font-size{
	padding-top: 30px;
}


.nori_center{
text-align: center;
}

/* TOPページ */
.top-post-wrap {
	max-width: 700px;
	padding: 0px;
	margin: 30px auto;
	background-color: #fff;
	border-radius: 10px;
	box-shadow:  0 1px 3px rgba(0, 0, 0, 0.12),
  0 4px 6px rgba(0, 0, 0, 0.08);
}

/* レスポンシブ：モバイル（768px以下）でpaddingを10pxに */
@media screen and (max-width: 768px) {
.top-post-wrap {
	max-width: 700px;
	padding: 0px;
	margin: 20px;
	background-color: #fff;
	border-radius: 10px;
	box-shadow:  0 1px 3px rgba(0, 0, 0, 0.12),
  0 4px 6px rgba(0, 0, 0, 0.08);
}
}

h4.top-post-h4 {
	padding: 20px;
	margin-bottom: 0;
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: bold;
	font-size: clamp(20px, 2.5vw, 26px);
	
}
#info-list {
padding: 0 5px;
}

.info-list-item {
  list-style: none;
  padding-left: 1.2em;
  position: relative;
}

.info-list-item::before {
  content: "▶";
  position: absolute;
  left: 0;
  color: #333;
  font-size: 0.9em;
}

/* スライダー全体 */
.slider1 {
	 width: 100vw;
  height: 400px;
	overflow: hidden;
	display: flex;
	flex-wrap: nowrap;
}

.slider_ul {
	height: 60vh;
	position: relative;
	margin: auto;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	animation: slide-loop 30s linear infinite;
	padding-left: 0px;
}


.slider_li {
	width: 500px;
	height: 100%;
	list-style: none;
	background-position: center;
}

.slider_li img{
    width: 400px;
    height: 400px;
    overflow: hidden;
    border-radius: ;
    padding: 30px 0px;
    margin: 20px;
    object-fit: cover;
}
.left-bottom {
    object-position: 100% 100%;
border-radius: 70% 60% 50% 50% / 50% 60% 70% 80%;
}

.right-bottom {
  object-position: 0 100%;
  border-radius:25% 41% 30% 39% / 39% 40% 44% 35%;
}

.slide_c {
border-radius: 70% 60% 50% 50% / 50% 60% 70% 80%;
} 
.slide_e { 
  border-radius: 70% 50% 70% 60% / 40% 80% 60% 70%;
}
@keyframes slide-loop {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-100%);
	}
}



/* .slider1 {
  display: flex;
  margin: 0 calc(50% - 50vw);
  width: 100vw;
  height:auto;
  overflow: hidden;
}
.slider1 ul{
	display:flex;
	padding: 0;
	margin:-5px;
}
.slider1 li{
	width:700px;
	list-style: none;
}
.slider1 ul:first-child {
  animation: slide1 150s -75s linear infinite;
}

.slider1 ul:last-child {
  animation: slide2 150s linear infinite;
}
@keyframes slide1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes slide2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
} */

/* テーブルカラー変更 */
/************************************
** XO calendar投稿・固定ページで使うHTML要素
************************************/


table {
	margin-left: auto;
	margin-right: auto;
	max-width: 90%;
	width: 90%;
	border-collapse: collapse;
	border-spacing: 0;
	border: transparent;
}
table th {
  	background-color: transparent;
}
table tr:nth-of-type(2n+1) {
  	background-color: transparent;
}
table:not(.has-border-color) :where(th, td) {
	border: transparent;
	padding: 6px;
/* 	text-align:center; */
	width: 10px;
} 

/* 注文予約 */
/********注文予約ページのCSS********/

#contactpage {
	font-family: sans-serif;
	padding: 10px;
	margin: auto;
	max-width: 900px;
}
.reserve-title {
    max-width: 900px;
    padding: 10px;
    top: 30px;
    margin: 30px auto;
}

.reserve-h2 {
	color: #333;
	letter-spacing: normal;
	font-family: 'Hina Mincho', serif;
	margin-bottom: 0 !important;
	font-size: clamp(15px, 2vw + 1rem, 32px)!important;
}

.reserve-shop {
    background-color: #3a3c5a;
    padding: 5px 6px 5px 20px;
    color: #fff;
    border-radius: 5px;
    line-height: 1.8;
    letter-spacing: 0.6em;
    text-align: center;
}
.reserve-shop a {
	color:#fff;
	text-decoration:none;
}

#contactpage th {
	width:  30%;
	padding: 5px 0px;
	text-align: left;
}
#reserve2 {
    padding: 20px;
    margin: auto;
}
#contactpage2 {
    padding: 0px;
    margin: 30px 0;
}
#contactpage2 p.submit {
    padding: 30px;
}
#contactpage h4 {
	color: #fff;
	background-color:#4682b4;
	border-radius:20px;
    text-align: center;
    height: 30px;
	width: 250px;
    padding: 5px;
    margin: auto;
	font-size: 14px;
	font-family: sans-serif;
}

#post-10 .contact1 {
    margin-top: 20px;
}

.hissu{
   display:inline-block;
   font-size:10px;
   padding:1px 8px;
   background:#ff7f50;
   color:#fff;
   margin-right:5px;
   border-radius: 3px;
}
.ninni{
   display:inline-block;
   font-size:10px;
   padding:1px 8px;
   background:#4682b4;
   color:#fff;
   margin-right:5px;
   border-radius: 3px;
}

 


#reserve {
	width: 250px;
    text-align: center;
    padding: 5px;
    margin: auto;
    background-color: #C4A342;
    color: #fff;
    border-radius: 30px;
}

#reserve h3{
    margin-bottom: 0px;
    font-size: 15px;
    font-family: sans-serif;
}

#menulist {
	color: #4682b4;
    line-height: 1.3;
    display: block;
    font-size: 15px;
/*     font-weight: bold;
    font-family: sans-serif; */
    padding: 0px;
}


.menu-list  {
    margin-bottom: 0px;
    font-size: 13px;
    font-family: sans-serif;
}

/* h6.formh6 {
    width: calc(50% + 8ch);
    margin-top: 30px;
    background-color: #333;
    color: #fff;
    font-family: 'Hina Mincho', serif;
    letter-spacing: 0.4em;
    padding: 5px;
    border-radius: 3px;
}
.formh6-span {
	padding: 20px;
} */

h6.formh6 {
    position: relative;
    width: calc(50% + 8ch);
    margin-top: 30px;
    background-color: #4682B4;
    color: #fff;
    font-family: 'Hina Mincho', serif;
    letter-spacing: 0.4em;
    padding: 5px;
    border-radius: 3px;
    text-align: center;
}

.formh6-span {
    display: inline-block;
    padding: 2px;
}

/* 下矢印（三角形）追加 */
h6.formh6::after {
    content: "";
    position: absolute;
    bottom: -10px; /* 三角形が見出しの下に出るように調整 */
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #4682B4;
}


.date1memo {
	font-size: 16px;
	font-weight:normal;
	color:#4682b4;

}
.date1memo2 {
	font-size: 16px;
	font-weight:normal;
	color:#808080;

}

#date1 {
	line-height: 1.3;
    display: block;
	padding-top: 10px;
	font-weight: bold;
}

.mobile-menu-buttons .menu-button > a {
	font-size: larger;
	font-weight: bold;
	font-family: sans-serif;
	color: white;
            }
button, input, select, textarea {
	font-family : inherit;
	font-size   : 100%;
}

input[type=text],
input[type=password],
input[type=date],
input[type=datetime],
input[type=email],
input[type=number],
input[type=search],
input[type=tel],
input[type=time],
input[type=url],
textarea,
select, .search-edit {
	padding: 11px;
	border: 0px solid var(--cocoon-basic-border-color);
	border-radius: var(--cocoon-basic-border-radius);
	font-size: var(--cocoon-default-text-size);
	font-family: sans-serif 　!important;
	width: 100%;
}


::placeholder {
	color: #ede5ca;
	font-family: sans-serif;
}

#time {
	padding: 10px;
    margin: auto;
}

.calender-img {
	width: 300px;
	height:auto;
	padding: 10px;
}
hr {
	border-top: 1px dotted #8c8b8b;
	max-width: 600px;
	text-align: center;
	margin: auto;
}
#contactpage .submit {
	text-align:center;
    width: 260px;
    padding: 5px;
    margin: auto;
}
#reserve-memo{
	text-align:left;
	font-size: 16px;
	line-height: 22px;
	font-weight:bold;
	color: #ff7f50;
	padding: 15px;
	margin: 20px;
	border: 2px solid #ff7f50;
	background-color: #ffffff;
	border-radius: 10px;
}
#reserve-memo.manthmemo{
	text-align:left;
	font-size: 16px;
	line-height: 22px;
	font-weight:bold;
	color: #fff;
	padding: 15px;
	margin: 20px;
	background-color: #ff7f50;
	border-radius: 10px;
}

h2.formh2 {
  position: relative;
  display: inline-block;
	font-size: 20px;
	text-align: left;
	padding-top:0px;
	padding:0px;
	letter-spacing: 0.2em;
}

h2.formh2::after{
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  width:  calc(100% + 3ch); /* テキスト幅 + 3文字分 */
  height: 2px;
	padding:0px;
  background-color: #333;
  transform: scaleX(0);
  transform-origin: bottom left;
  animation: underlineDelay 0.5s 1 0.5s ease-in-out forwards; /* 遅延とアニメーションの設定 */	
}
@keyframes underlineDelay {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

.form_time {
    display: inline-block;
    font-size: 13px;
    padding: 1px 8px;
    background: #4682B4;
    color: #fff;
	margin-top: 10px;
    margin-right: 5px;
    border-radius: 3px;
}


/* XOカレンダー の仕様*/
/*****************************/

/* XOカレンダー の時にリセットした*/
table {
	margin-left: auto;
    margin-right: auto;
	max-width: 100%;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

.xo-event-calendar {
	max-width: 500px;
	margin: 0 auto;
	padding: 0px;
}
/* XOカレンダー 今日*/
.xo-event-calendar table.xo-month .month-dayname td div.today {
                color: #333;
                font-weight: 900;
            }
/* XOカレンダー 表の枠中み*/
.xo-event-calendar table.xo-month td,.xo-event-calendar table.xo-month th {
                background-color: #f5f4ee;
                border: 1px solid #fff;
                padding: 0;
            }
.xo-event-calendar table.xo-month .month-dayname-space {
                height: 1.4em;
                position: relative;
                top: 0
            }

/* XOカレンダー 表の枠上下？*/
.xo-event-calendar table.xo-month {
                border: 1px solid #fff;
                border-right-width: 0;
                margin: 0 0 8px;
                padding: 0;
            }
/* XOカレンダー 定休日の四角*/
.xo-event-calendar p.holiday-title span {
                border: none;
                margin: 0 6px 0 0;
                padding: 0 0 0 18px;
            }
/* XOカレンダー 枠内情報*/
.xo-event-calendar table {
                background-color: transparent;
                border-collapse: separate;
                border-spacing: 0;
                color: #70653f;
                margin: 0;
                padding: 0;
                table-layout: fixed;
                width: 100%;
            }
.xo-event-calendar table.xo-month button span.nav-prev {
                border-bottom: 2px solid #a19361;
                border-left: 2px solid #a19361;
                display: inline-block;
                font-size: 0;
                height: 13px;
                transform: rotate(45deg);
                width: 13px;
            }
.xo-event-calendar table.xo-month button span.nav-next {
                border-right: 2px solid #a19361;
                border-top: 2px solid #a19361;
                display: inline-block;
                font-size: 0;
                height: 13px;
                transform: rotate(45deg);
                width: 13px;
            }
/* XOカレンダー 曜日部分*/
.xo-event-calendar table.xo-month>thead th {
	background-color:#4c5985;
	border-width: 0 1px 0 0;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	padding: 1px 0;
	text-align: center;
            }
/* XOカレンダー 日曜日*/
            .xo-event-calendar table.xo-month>thead th.sunday {
                color: #f1bbab;
            }
/* XOカレンダー 土曜日*/
            .xo-event-calendar table.xo-month>thead th.saturday {
                color: #b7d3de;
            }
 .xo-event-calendar table.xo-month .month-header>span {
                font-weight: bold;
                flex-grow: 1;
                text-align: center;
            }
.xo-event-calendar table.xo-month .month-event-space{
    background-color: transparent;
    height: 0;
}
.calendar .xo-month-wrap tbody {
	height: 230px;
}
.xo-month {
	height:250px;
}

.holiday-titles {
	text-align: left;
}

/* 営業日*/
/********営業日ページのCSS********/
#post-108 {
	padding:13px;
}
th.opentime {
	text-align:right;
}



.hr1 {
	border: 1px solid #a19361;
	max-width: 600px;
	text-align: center;
	margin: auto;
}

.newyear_01 {
	max-width: 600px;
	height: auto;
	padding:10px;
	margin: 0 auto;
}

 #calendar-memo {
	max-width: 500px;
	margin:auto;
	text-align:center;
}
/* #open-time .openday-memo{
	font-size: 11px;
	width: auto;
	padding: 10px;
	margin:auto;
	text-align:center;
} */
#open-time{
	padding: 20px;
}
.openday-memo{
	width: 350px;
	font-size: 0.7em;
	padding: 0px;
	margin: auto;
}
#calendar-memo2 {
	max-width: 500px;
	padding:0px;
	margin:auto;
	text-align:center;
}
.gweek-memo{
    max-width: 600px;
    padding: 0;
    margin: 20px auto;
}
.gweek {
    text-align: left;
    font-size: 1.2rem;
    background-color: #D0311B;
    color: #fff;
    max-width: fit-content;
    padding: 10px 20px;
    margin: 20px auto 20px;
    line-height: normal;
	border-radius: 3px;
}


.table_tenpo{
    font-family: "Hina Mincho", serif;
    font-size: 1.3em;
}
.table_tenpo_th {
    width: 30% !important;
    text-align: right;
    padding: 10px !important;
    font-size: 0.7em;
	font-weight: bold;
	line-height: 1.5;
}
.table_tenpo_td {
    width: 70% !important;
    text-align: left;
    padding: 10px !important;
    font-size: 1em;
	line-height: 1.5;
	letter-spacing: 0.1em;
}


/* おしながき*/
/********おしながきページのCSS********/

#menu {

	width: 600px;
	padding: 40px 20px 20px 20px;
	margin: 20px auto;
	background-color: #fff;
	border-radius: 10px;
}
/********税込です********/
#menucontent {
	max-width: 600px;
   	padding: 10px;
   	margin: auto;
	font-size: 10px;
}
#menu .menu-img {
	max-width: 500px;
	text-align: center;
    padding: 0px;
    margin: auto;
}
.menu-new {
	width: 40%;
	padding: 10px;
	margin: 0 auto;
	animation: flash 1s linear infinite;
}
@keyframes flash {
	0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@media screen and (max-width: 480px){
  #menu {
	max-width: 90%;
	padding: 40px 20px 20px 20px;
	margin: auto;
	background-color: #fff;
	border-radius: 30px;
}
	#menucontent {
	max-width: 90%;
	padding: 5px;
	margin: auto;
}
}

@media screen and (max-width: 1023px){
   #menu {
	max-width: 90%;
	padding: 40px 20px 20px 20px;
	margin: auto;
	background-color: #fff;
	border-radius: 30px;
}
	#menucontent {
	max-width: 90%;
	padding: 5px;
	margin: auto;
}
}

@media screen and (max-width: 834px){
  #menu {
	max-width: 90%;
   	padding: 40px 20px 20px 20px;
  	margin: auto;
   	background-color: #fff;
	border-radius: 30px;
}
	#menucontent {
	max-width: 90%;
   padding: 5px;
   margin: auto;
}
}
#menu > h3 {
	font-size: 20px;
	z-index: 0;
}
#menu,.menu-h4{
	text-align:center;
}
#menu > h4  .menu-h4 {
	height: 50px;
    width:  200px;
	padding: 5px;
	margin:auto;
}

h4 .menu-price {
	font-size : 35px;
}
h4 .menu-yen {
	font-size : 17px;
}
#menu > p > span {
	    display: block;
    font-size: 14px;
    line-height: 1.4em;
	text-align: center;
}
/********おしながきh３見出し*****
#menu  h3 {
	width: 175px;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}

#menu  h3::after {
  background: linear-gradient(
    to right top,
    #917347,
    #bfa46f,
    #deb068
  );
  border-radius: 5px;
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform: skewY(-3deg);
  transform-origin: top left;
}***/




/* 商品カード遅延読み込み */
/* #menu {
	animation-name: fadeUpAnime;
	animation-delay: 1s;
	animation-duration: 3s;
	animation-fill-mode: forwards;
	opacity: 0;
} */
.fadeup {
	animation-name: fadeUpAnime;
	animation-delay: 1s;
	animation-duration: 2s;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fadeup2 {
	animation-name: fadeUpAnime;
	animation-delay: 1.5s;
	animation-duration: 3s;
	animation-fill-mode: forwards;
	opacity: 0;
}
.fadeup3 {
	animation-name: fadeUpAnime;
	animation-delay: 2s;
	animation-duration: 3.5s;
	animation-fill-mode: forwards;
	opacity: 0;
}




@keyframes fadeUpAnime{
  from {
	opacity: 0;
	transform: translateY(40px);
  }

  to {
	opacity: 1;
	transform: translateY(0);
  }
}

.bound {
    transform-origin:center bottom;
	animation:sample 1s ease-in alternate infinite;
}


@keyframes sample {
      0% {

      transform:translateY(-20%) scale(1,1);
      }

      80% {

      transform:translateY(0%) scale(1,1);
      }

      100% {

      transform:translateY(0%) scale(1.1,0.9);
      }

      }


/* .slideinRight {
  animation: slideinRight 3s infinite;
}

@keyframes slideinRight {
  0% {
    transform: translateX(-300px);
  }
	50% {
    transform: translateX(300px);
  }
  100% {
    transform: translateX(0);
  }
} */

    /* CSSアニメーションの設定 
 .bound {
	animation: 3s 0s bound ease-in infinite;
}
@keyframes bound {
	0%,
	70%,
	90%,
	100% {
		-webkit-transform: translate(0);
		        transform: translate(0);
	}
	85% {
		-webkit-transform: translateY(-70px);
		        transform: translateY(-70px);
	}
	94% {
		-webkit-transform: translateY(-30px);
		        transform: translateY(-30px);
	}
	99% {
		-webkit-transform: translateY(-2px);
		        transform: translateY(-2px);
	}
}*/

/* ご注文予約はこちらから*/
.order {
    width: 130px;
    height: 130px;
    background-color: #C4A342;
/* 	box-shadow: 0 7px 0 #9a8848; */
    border-radius: 100px;
    text-align: center;
    padding-top: 40px;
    margin: auto;
    font-family: "Kiwi Maru", serif;
	font-weight:bold;
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.29);
	border-bottom: solid 6px #9a8848;
    transition: .4s;
    line-height: 1.5em;
}
.order a {
	color:#fff;
	text-decoration:none;
}
 
.order {
  animation: kurukuru 3s infinite;
  scale: 1;
}

@keyframes kurukuru{
  35%{ transform: rotateX(360deg); }
  100%{ transform: rotatex(360deg);}
}

/* LINE追加*/
#content-in .linebtn{
	width: 300px;
    padding: 30px;
    margin: auto;
}

 /*サンクスページ*/
#post-920 {
	background-color: #fff;
    color: #333;
    font-family: sans-serif;
	font-size: 12px;
    width: auto;
    border-radius: 20px;
    padding: 20px;
    margin: 20px;
    text-align: center;
}
#post-920 h3 {
	padding-top: 20px;
}

.dli-check-circle {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 1;
    position: relative;
    width: 3em;
    height: 3em;
    border: 0.2em solid currentColor;
    border-radius: 50%;
    box-sizing: content-box;
	background-color:#C4A342;
}

.dli-check-circle > span {
    width: 1.5em;
    height: 0.8em;
    border: 0.2em solid currentColor;
    border-top: 0;
    border-right: 0;
    box-sizing: border-box;
    transform: translateY(-25%) rotate(-45deg);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0px;
    margin: auto;
}


/*--------注文予約確認最終ページ-------*/
#post-1130, #post-2463 {
	max-width: 700px;
	border-radius: 10px;
	background-color: #fff;
	padding: 20px;
	margin: 50px auto;
	    font-family: sans-serif;
}

table.kakunins {
  width: 80%;
  margin: 0 auto;
  table-layout: fixed;
  border-collapse: collapse; /* ← これ重要 */
  border-spacing: 0; /* 念のためスペーシングを無効に */
}

table.kakunins th {
  width: 50%;
  text-align: right;
  vertical-align: top;
  border-bottom: 1px solid #ddd;
  padding: 0.5em;
}

table.kakunins td {
  width: 50%;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #ddd;
  padding: 0.5em;
}

.kakunin-btn {
	text-align : center ;
	width: 260px;
    padding: 20px;
    margin: auto;
}


.kakunin-btn p {
    text-align: center;
    width: 100%;
    padding: 10px;
    margin: auto;
}
#wpcf7-f1135-p1130-o1 > form > div.kakunin-btn > p:nth-child(1) > input,
#wpcf7-f2460-p2463-o1 > form > div.kakunin-btn > p:nth-child(1) > input
{
    color: #fff;
    background-color: #a6b5c5;
    width: auto;
    padding: 10px 50px;
    border-style: none;
    border-radius: 10px;
	}
input[type=submit] {
	width: 200px;
    -webkit-appearance: none;
    border: 1px solid var(--cocoon-thin-color);
    border-radius: 10px;
    border-style: none;
    background-color: #b7282e;
    color: #fff;
}
/*入力内容確認ボタン*/
#contactpage > div.nyuuryokukakunin {
　	text-align: center ;
}
/*プルダウンの文字色*/
.wpcf7-form .wpcf7-select, select {
	color: #000;
}
.line-p {
	text-align:center;
}

.long {
	font-size: 11px;
    line-height: 1;
}


/* レスポンシブ表示 */
@media screen and (max-width: 768px) {
	#post-1130, #post-2463 {
	width: 90%;
	border-radius: 10px;
	background-color: #fff;
	padding: 20px;
	margin: 0 auto;
	    font-family: sans-serif;
}	

  table.kakunins,
  table.kakunins tbody,
  table.kakunins tr,
  table.kakunins th,
  table.kakunins td {
    display: block;
    width: 100%;
  }

  table.kakunins th {
    text-align: left;
    font-weight: bold;
    margin-top: 1em;
    border-bottom: none;
  }

  table.kakunins td {
    text-align: left;
    padding-left: 1em;
    border-bottom: 1px solid #ddd;
  }
}

/********トップページダウン画像********/
.pc-img { display: inline-block; }
.sp-img { display: none; }

@media screen and (max-width: 1023px){
.pc-img { 
	display: none!important;
	}
.sp-img {
	display: inline-block!important; 
	vertical-align: bottom;
	margin: 0;
	padding: 0;
	}
}

@media screen and (max-width: 834px){
.pc-img { 
	display: none!important;
	}
.sp-img { 
	display: inline-block!important;
	vertical-align: bottom;
	margin: 0;
	padding: 0;}
}

@media screen and (max-width: 480px){
.pc-img { 
	display: none!important; 
	}
.sp-img { 
	display: inline-block!important;
	vertical-align: bottom;
	margin: 0;
	padding: 0;
	}
}

/********Instagram-feed********/

#sb_instagram{
	max-width: 500px;
    padding-bottom: 50px;
    height: 500px;
}

@media screen and (max-width: 1023px){
#sb_instagram.sbi_width_resp {
        width: 90% !important;
    }
}

@media screen and (max-width: 834px){
#sb_instagram.sbi_width_resp {
        width: 90% !important;
    }
}

@media screen and (max-width: 480px){
#sb_instagram.sbi_width_resp {
        width: 90% !important;
    }
}

/* .LINEbtn{
    width: 250px;
    height: 60px;
    line-height: 60px;
    padding: 0px;
    margin: 20px auto;
}
.LINEbtn a{
    display:block;
    width:100%;
    height:100%;
    text-decoration: none;
    background:#FFFFFF;
    text-align:center;
    border:1px solid #36C678;
    color:#36C678;
    font-size:18px;
	font-family: "Kiwi Maru", serif;
	letter-spacing: 0.03em;
}
.LINEbtn a:hover{
    background:#36C678;
    color:#FFFFFF;
    margin-left:5px;
    margin-top:5px;
    border:1px solid #36C678;
    box-shadow:none;
} */

.LINEbtn {
	width: 270px;
    line-height: 57px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background-color: #36C678;
    letter-spacing: 0.15em;
    padding: 0px;
    margin: auto;
}
.LINEbtn a {
  display: inline-block;
  width: 270px;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: none;
  font-family: "Kiwi Maru", serif;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.LINEbtn a:hover{
  letter-spacing: 0.4em;
  text-indent: 0.4em;
}

.instabtn {
  width: 270px;
  line-height: 57px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: #705b67;
  letter-spacing: 0.15em;
  padding: 0px;
  margin: auto;	
}

.instabtn a {
  display: inline-block;
  width: 270px;
  line-height: 60px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: none;
  font-family: "Kiwi Maru", serif;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.instabtn a:hover{
  letter-spacing: 0.4em;
  text-indent: 0.4em;
}


.grecaptcha-badge { visibility: hidden; }

#post-10 > div > p.has-text-align-center {
    max-width: 700px !important;
    padding: 5px 20px !important;
    margin: auto;
    text-align: left;
    font-family: sans-serif;
}


/********menu********/


.menu_wrap {
  width: 100%;
  height:auto;
  margin: auto;
  display : flex;   /* FlexBox定義  */
  justify-content: center;   /* 揃えの定義   */
  flex-wrap : wrap;    /* 折り返し定義  */	
}

.menus {
	width: 350px;
	background-color: #fff;
	padding:30px;
	margin:10px;
}

.menu_h2 {
	font-size: clamp(16px, 1.8vw, 30px)!important;
	letter-spacing: 0.1em;
}
.menu-price {
    font-size: clamp(20px, 2.5vw, 40px)!important;
    letter-spacing: 0.1em;
}
.menu-text {
    font-size: clamp(0.75rem, calc(0.625rem + 0.5vw), 1rem)!important;
    line-height: 1.5em;
}

.menutax {
    width: 90%;
	text-align:right;
    padding: 5px;
    margin: 0px 10px;
	font-size: 0.8em;
}
.menu_new {
	width: 200px;
	padding: 10px;
	margin: 0 auto;
	animation: flash 1s linear infinite;
}
@keyframes flash {
	0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@media screen and (max-width: 480px){
.menu_wrap{
	width: 100%;
	height:auto;
	margin: auto;
	display : flex;   /* FlexBox定義  */
	justify-content: center;   /* 揃えの定義   */
	flex-wrap : wrap;    /* 折り返し定義  */	
}
.menus {
	width: 43%;
	padding:20px;
  	margin: 5px;
	background-color: #fff;
	border-radius: 10px;
}
.menutax {
    width: 90%;
	text-align:right;
    padding: 5px;
    margin: 0px 10px;
	font-size: 0.8em;
}

}

@media screen and (max-width: 1023px){
.menu_wrap{
  width: 100%;
  height:auto;
  margin: auto;
  display : flex;   /* FlexBox定義  */
  justify-content: center;   /* 揃えの定義   */
  flex-wrap : wrap;    /* 折り返し定義  */	
}
.menus {
	width: 43%;
	padding:20px;
  	margin: 5px;
	background-color: #fff;
	border-radius: 10px;
}
.menutax {
    width: 90%;
	text-align:right;
    padding: 5px;
    margin: 0px 10px;
	font-size: 0.8em;
}
}

@media screen and (max-width: 834px){
.menu_wrap{
	width: 100%;
	height:auto;
	margin: auto;
	display : flex;   /* FlexBox定義  */
	justify-content: center;   /* 揃えの定義   */
	flex-wrap : wrap;    /* 折り返し定義  */	
}
.menus {
	width: 43%;
	padding:20px;
  	margin: 5px;
   	background-color: #fff;
	border-radius: 10px;
}
.menutax {
    width: 90%;
	text-align:right;
    padding: 5px;
    margin: 0px 10px;
	font-size: 0.8em;
}
}


/* datepicker */
#datep  {

}



/* PCヘッダー上ナビ */
.vertical_navi_test {
    writing-mode: vertical-rl; /* 縦書きにする */
/*     transform: rotate(180deg); /* 文字を上下反転 */ */
    background-color: #f0f0f0; /* 背景色 */
    padding: 10px; /* 内側の余白 */
	margin: 0px auto;
	font-family: "Yuji Syuku", serif;
}

.vertical_navi_test ul {
    list-style-type: none; /* リストのスタイルを無効にする */
    padding: 0;
}

.vertical_navi_test li {
	padding: 30px;
    margin: 10px 0 ; /* 各メニュー項目の間隔 */
}

.vertical_navi_test a {
    text-decoration: none; /* 下線を消す */
    color: black; /* 文字色 */
    font-size: 23px; /* 文字サイズ */
}
/* 縦書きヘッダーナビ遅延 */
.vertical_navi_test li {
  transition: 1s;
  opacity: 0;
  transform: translateY(20px);
  display: block;
}
.vertical_navi_test li:first-child {
  animation: catch_anime 1.4s forwards 1s;　
}
.vertical_navi_test li:nth-child(2) {
  animation: catch_anime 1.4s forwards 1.5s;
}
.vertical_navi_test li:nth-child(3) {
  animation: catch_anime 1.4s forwards 2s;
}
.vertical_navi_test li:nth-child(4) {
  animation: catch_anime 1.4s forwards 2.5s;
}
.vertical_navi_test li:nth-child(5) {
  animation: catch_anime 1.4s forwards 3s;
}
.vertical_navi_test li:nth-child(6) {
  animation: catch_anime 1.4s forwards 3.5s;
}

@keyframes catch_anime {
  0% {
    transform: translateY(20px);
  }
   100% {
    opacity: 1;
    transform: translateY(0);
  }
}



/* モバイルスライドインメニュー */
.fa-times {
	color: #fff;/* 閉じるボタンの色 */
	font-size: 0.8em;
}
.menu-close-button {
    display: block;
    cursor: pointer;
    text-align: center;
    font-size: 2em;
    padding: 30px;
}
ul.menu-drawer:before {
	background-color: #fff;/* Menu背景色 */
	font-size: 1.2em;
}
ul.menu-drawer:after {
	background-color: #fff;
}

.menu-drawer li {
	display: block;
	font-family: "Kiwi Maru", serif;
}

.menu-drawer a {
	color: #fff !important;/* 文字色 */
	font-size: 1.2em;
	font-weight: 900;
}
.menu-drawer a:hover {
	background-color: #fff;
}
.menu-drawer a .fas, .menu-drawer a .far,.menu-drawer a .fa,.menu-drawer a .fab {
	margin-right: 3px;
}
.sub-menu li {
	font-size: 0.8em;
}

.menu-drawer a {
    text-align: center;
    color: var(--cocoon-text-color);
    text-decoration: none;
    padding: 12px;
    display: block;
}

/*中身*/
.menu-content {
	overflow: auto;
	position: fixed;
	top: 0;
  	z-index: 9999;
  /*最前面に*/
  	width: 90%;
  /*右側に隙間を作る（閉じるカバーを表示）*/
 	 max-width: 400px;
  /*最大幅（調整してください）*/
  	height: 100%;
  	background: #333;
  /*背景色*/
  	transition: 0.3s ease-in-out;
  /*滑らかに表示*/
	opacity: 1;
	overflow: scroll;
  -webkit-overflow-scrolling: touch;
}
.menu-content .menu-drawer {
	padding: 0 1em 30px;
}
.menu-content .sidebar {
	width: 100%;
	display: block;
	margin: 0;
}

.navi-menu-content {
  left: 0;
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);
}

.sidebar-menu-content {
  right: 0;
  -webkit-transform: translateX(105%);
  transform: translateX(105%);
}

/* PCヘッダー上ナビ */
.vertical_navi {
    writing-mode: vertical-rl; /* 縦書きにする */
/*     transform: rotate(180deg); /* 文字を上下反転 */ */
    background-color: #f0f0f0; /* 背景色 */
    padding: 10px; /* 内側の余白 */
	margin: 30px auto 0px auto;
	font-family: "Yuji Syuku", serif;
}

.vertical_navi ul {
    list-style-type: none; /* リストのスタイルを無効にする */
    padding: 0;
}

.vertical_navi li {
    padding: 10px 30px;
    margin: 10px 0; /* 各メニュー項目の間隔 */
}

.vertical_navi a {
    text-decoration: none; /* 下線を消す */
    color: black; /* 文字色 */
    font-size: 23px; /* 文字サイズ */
}

/* 縦書きヘッダーナビ遅延 */
.vertical_navi .navi_animation {
  transition: 1s;
  opacity: 0;
  transform: translateY(20px);
  display: block;
}
.vertical_navi .navi_animation:first-child {
  animation: catch_anime 1.4s forwards 1s;　
}
.vertical_navi .navi_animation:nth-child(2) {
  animation: catch_anime 1.4s forwards 1.5s;
}
.vertical_navi .navi_animation:nth-child(3) {
  animation: catch_anime 1.4s forwards 2s;
}
.vertical_navi .navi_animation:nth-child(4) {
  animation: catch_anime 1.4s forwards 2.5s;
}
.vertical_navi .navi_animation:nth-child(5) {
  animation: catch_anime 1.4s forwards 3s;
}
.vertical_navi .navi_animation:nth-child(6) {
  animation: catch_anime 1.4s forwards 3.5s;
}

@keyframes catch_anime {
  0% {
    transform: translateY(20px);
  }
   100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 縦書きヘッダーナビhoverライン */
.hover_navi {
    display: block;
    position: relative
}

.hover_navi::before {
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background-color: rgb(0 0 0 / 45%);
    content: ''
}

.hover_navi:hover::before {
    animation: headerOnlinestore 0.6s both
}

@keyframes headerOnlinestore {
    0% {
        transform: none;
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    50% {
        transform: scaleY(0);
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(1, 0, 0, 1)
    }

    50.01% {
        transform: scaleY(0);
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    100% {
        transform: none;
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.95, 0.05, 0.795, 0.035)
    }
}



@media screen and (max-width: 834px){
	.vertical_navi {
    width: 80%;
    writing-mode: vertical-rl;
    margin: auto;
    font-family: "Yuji Syuku", serif;
}

.vertical_navi ul {
    width: 100%;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 0;
}

.vertical_navi li {
	padding: 5px;
    margin: 10px 0 ; /* 各メニュー項目の間隔 */
}

.vertical_navi a {
    text-decoration: none; /* 下線を消す */
    color: black; /* 文字色 */
    font-size: 18px; /* 文字サイズ */
}
}

.top_animation {
    max-width: 250px;
    margin: 30px auto 0 auto !important;	
}

/*///////////////  店舗情報 ////////////////*/
#shop-wrap {
	max-width: 980px;
    height: auto;
    padding: 10px;
    margin: auto;
}

h2.news-h2 {
	margin-bottom:0;
	font-size: clamp(30px, 5vw, 45px);
	letter-spacing: 0.2em;
}

.shop-message{
	font-family: 'Hina Mincho', serif;
	line-height: 1.5;
}

h5.shop-name {
	width: fit-content;
    background: #203744;
    color: #fff;
    padding: 5px 30px;
    margin: 5px;
    text-align: center;
    border-radius: 20px;
    letter-spacing: 0.3em;
}

.shop-wrap {
    background-color: #fff;
    border-radius: 10px;
    padding: 30px;
    margin: 30px 0;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.shop-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.shop-text {
  flex: 1.5; /* 全体の3分の2 */
}

.shop-img {
  flex: 1; /* 全体の3分の1 */
}
img.new-shop {
	width: 100px;
	height:auto;
	animation: blink 1s infinite;
}
    @keyframes blink {
      0%   { opacity: 1; }
      50%  { opacity: 0; }
      100% { opacity: 1; }
    }

.shop-img img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}

.shop-text p {
	line-height: 1.5;
}

.shop-news {
	padding:10px 0;
}

/* ▼ スマホ対応：画面幅が768px以下のときに縦並びにする */
@media (max-width: 768px) {
  .shop-wrapper {
    flex-direction: column;
  }

  .shop-text,
  .shop-img {
    flex: none; /* 幅の比率をリセット */
    width: 100%; /* 幅を100%に */
  }
 .shop-text p {
    font-size: 14px; /* 通常より少し小さめに（調整可能） */
  }
}

.map-button {
    display: inline-block;
    margin-top: 10px;
    padding: 0px 16px;
    background-color: #FF7F50;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-size: 14px;
    transition: background-color 0.3s;
}

.map-button:hover {
  background-color: #fff; /* ホバー時に少し濃く */
}

.insta-button {
	display: inline-block;
    padding: 0px 16px 5px 16px;
    margin: 10px 0px;
    background-color: #ca4fcf;
    color: #fff;
    line-height: 1.5;
    text-decoration: none;
    border-radius: 4px;
    font-size: 16px;
    transition: background-color 0.3s;
}

.insta-button:hover {
	background-color: #fff; /* ホバー時に少し濃く */
	color:#ca4fcf;
}

.table-wrapper {
  max-width: 980px;
  margin: auto;
}

.info-table {
  width: 100%;
  border-collapse: collapse;
}

.info-row {
  border-bottom: 1px solid #000;
}

.info-label {
  text-align: left;
  vertical-align: top;
  padding: 12px 8px;
  font-weight: bold;
  white-space: nowrap;
}

.info-data {
  padding: 12px 8px;
}

.shop-wrap1 {
  background: #fff;
  position: relative;
}


.kasaneru {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    font-size: 1.2em;
    font-weight: bold;
	font-family: "Kiwi Maru", serif;
	letter-spacing: 0.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 10;
    border-radius: 10px;
    }




/*///////////////  店舗情報ここまで ////////////////*/

/*//////////////////////////////////////////////////*/
/*///////////////  テストページ用 ////////////////*/
#post-1474 {
	padding: 10px;
	font-family: "Kiwi Maru", serif;
}
#datep.datep02.hasDatepicker{
    width: 300px;
    padding: 10px;
    margin: 20px auto;
}


.test-page-dl .test-page--dl{
	display: flex;
	width: 300px;
    padding: 0px;
    margin: 0 auto;
}

.test-page-dt {
	width: 30%;
	height:30px;
	line-height:30px;
	text-align: right;
	font-size: 0.9em;
	font-weight:bold;
}
.test-page-dd {
	width: 60%;
	height:auto;
	line-height:30px;
	text-align: left;
}

.test-page-dt,.test-page-dd{
	padding: 10px;
}


.hover_test {
    display: block;
    position: relative
}

.hover_test::before {
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background-color: rgb(0 0 0 / 45%);
    content: ''
}

.hover_test:hover::before {
    animation: headerOnlinestore 0.6s both
}

@keyframes headerOnlinestore {
    0% {
        transform: none;
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    50% {
        transform: scaleY(0);
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(1, 0, 0, 1)
    }

    50.01% {
        transform: scaleY(0);
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    100% {
        transform: none;
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.95, 0.05, 0.795, 0.035)
    }
}
.t_actionMenu{
    width: 180px;
    height: 180px;
	line-height:130px;
	letter-spacing:.6rem;
    background-color: #ff5a35;
	padding:10px;
    margin: 10px;
    position: fixed;
	border-radius: 15% 30% 40% 50%;
}
.t_actionMenu ul{
	padding-left:30px;
}
.t_actionMenu li{
	list-style:none;
}
.t_actionMenu a {
	color:#fff;
	text-decoration:none;
}

@media screen and (max-width: 834px){
.vertical_navi_test {
    width: auto;
    writing-mode: vertical-rl;
    margin-left: 5px;
	padding: 0;
    font-family: "Yuji Syuku", serif;
}

.vertical_navi_test ul {
    width: 100%;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 0;
}

.vertical_navi_test li {
	padding: 5px;
    margin: 10px 0 ; /* 各メニュー項目の間隔 */
}

.vertical_navi_test a {
    text-decoration: none; /* 下線を消す */
    color: #a19361;; /* 文字色 */
    font-size: 18px; /* 文字サイズ */
}
	
.t_actionMenu{
    width: 100px;
    height: 100px;
    line-height: 70px;
	letter-spacing:.2rem;
    background-color: #ff5a35;
    border-radius: 15% 30% 40% 50%;
    margin: 10px;
    position: fixed;
    font-size: small;
    z-index: 99999;
}
.t_actionMenu ul{
	padding-left:10px;
}
.t_actionMenu li{
	list-style:none;
}
.t_actionMenu a {
	color:#fff;
	text-decoration:none;
}

.hover_test {
    display: block;
    position: relative
}

.hover_test::before {
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background-color:#a19361;
    content: ''
}

.hover_test:hover::before {
    animation: headerOnlinestore 0.6s both
}

@keyframes headerOnlinestore {
    0% {
        transform: none;
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    50% {
        transform: scaleY(0);
        transform-origin: left bottom;
        animation-timing-function: cubic-bezier(1, 0, 0, 1)
    }

    50.01% {
        transform: scaleY(0);
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
    }

    100% {
        transform: none;
        transform-origin: left top;
        animation-timing-function: cubic-bezier(0.95, 0.05, 0.795, 0.035)
    }
}	
}
/*//////////カルタ//////////*/

.t_coment {
	display: flex;
	flex-wrap: wrap;
	width: 950px;
	height: auto;
	padding:10px;
	margin:0 auto;
}


.t_coment_a {
	width: calc(100% / 2);
	padding:20px 30px;
	margin:0 auto;
}
.t_coment_a h2 {
	text-align:left;
	margin-bottom: .3em;
	font-size: 25px;
	padding:0px;
}
.t_coment_p {
	font-size: 18px;
}
@media screen and (max-width: 834px){
.t_coment {
	display: block;
	width: 100%;
	height: auto;
	padding:10px;
	margin:0 auto;
}

.t_coment_a {
    width: auto;
    padding: 20px 10px;
    margin: 0 auto;
}
.t_coment_a h2 {
	text-align:left;
	font-size: 25px;
}
.t_coment_p {
	font-size: 17px;
}
}

/*/////////注文予約BOX////////*/
.wavy-box {
    position: fixed;
    z-index: 0;
    display: table;
    width: 102px;
    height: 102px;
	top: 170px;
    margin: 10px 100px 10px 200px;
    padding: 10px;
    border-radius: 50%;
}
.wavy-box p {
  font-size: 17px;
  line-height: 1;
  display: table-cell;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  color: #efede1;
	letter-spacing:.1;
}
.wavy-box a {
	color:#fff;
	text-decoration:none;
}
.wavy-box a:hover {
  opacity:.3;
}
.wavy-box::before, .wavy-box::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  content: '';
  border-radius: 50%;
}
.wavy-box::before {
  z-index: -1;
  width: 100px;
  height: 100px;
  margin-top: -50px;
  margin-left: -50px;
  -webkit-animation: wb 6s infinite linear;
          animation: wb 6s infinite linear;
  background-color: #fb3939;
}
.wavy-box::after {
  z-index: -2;
  width: 102px;
  height: 102px;
  margin-top: -51px;
  margin-left: -51px;
  -webkit-animation: wb 7s infinite linear reverse;
          animation: wb 7s infinite linear reverse;
  background-color: #998f25;
}
@-webkit-keyframes wb {
  0% {
    -webkit-transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    -webkit-transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    -webkit-transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    -webkit-transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    -webkit-transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    -webkit-transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
@keyframes wb {
  0% {
    transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}

@media screen and (max-width: 834px){
	.wavy-box {
    position: fixed;
    z-index: 0;
    display: table;
    width: 102px;
    height: 102px;
	right: 10px;
	top: 150px;
	margin:0;
/*     margin: 10px;
    padding: 10px; */
    border-radius: 50%;
}
.wavy-box p {
  font-size: 17px;
  line-height: 1;
  display: table-cell;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  color: #efede1;
	letter-spacing:.1;
}
.wavy-box a {
	color:#fff;
	text-decoration:none;
}
.wavy-box a:hover {
  opacity:.3;
}
.wavy-box::before, .wavy-box::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  content: '';
  border-radius: 50%;
}
.wavy-box::before {
  z-index: -1;
  width: 100px;
  height: 100px;
  margin-top: -50px;
  margin-left: -50px;
  -webkit-animation: wb 6s infinite linear;
          animation: wb 6s infinite linear;
  background-color: #fb3939;
}
.wavy-box::after {
  z-index: -2;
  width: 102px;
  height: 102px;
  margin-top: -51px;
  margin-left: -51px;
  -webkit-animation: wb 7s infinite linear reverse;
          animation: wb 7s infinite linear reverse;
  background-color: #998f25;
}
@-webkit-keyframes wb {
  0% {
    -webkit-transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    -webkit-transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    -webkit-transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    -webkit-transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    -webkit-transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    -webkit-transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
@keyframes wb {
  0% {
    transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
}
/*/////////固定メニューBOX////////*/
.wavy-box2 {
    position: fixed;
    z-index: 0;
    display: table;
    width: 102px;
    height: 102px;
    margin: 10px 100px 10px 200px;
    padding: 10px;
    border-radius: 50%;
}
.wavy-box2 p {
  font-size: 17px;
  line-height: 1;
  display: table-cell;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  color: #fff;
	letter-spacing:.1;
}
.wavy-box2 a {
	color:#fff;
	text-decoration:none;
}
.wavy-box2 a:hover {
  opacity:.3;
}
.wavy-box2::before, .wavy-box2::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  content: '';
  border-radius: 50%;
}
.wavy-box2::before {
  z-index: -1;
  width: 100px;
  height: 100px;
  margin-top: -50px;
  margin-left: -50px;
  -webkit-animation: wb 6s infinite linear;
          animation: wb 6s infinite linear;
  background-color: #32638c;
}
.wavy-box2::after {
  z-index: -2;
  width: 102px;
  height: 102px;
  margin-top: -51px;
  margin-left: -51px;
  -webkit-animation: wb 7s infinite linear reverse;
          animation: wb 7s infinite linear reverse;
  background-color: #d7b95e;
}
@-webkit-keyframes wb {
  0% {
    -webkit-transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    -webkit-transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    -webkit-transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    -webkit-transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    -webkit-transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    -webkit-transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
@keyframes wb {
  0% {
    transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}

@media screen and (max-width: 834px){
	.wavy-box2 {
    position: fixed;
    z-index: 0;
    display: table;
    width: 62px;
    height: 62px;
	right: 20px;
	margin:0;
/*     margin: 10px;
    padding: 10px; */
    border-radius: 50%;
}
.wavy-box2 p {
  font-size: 12px;
  line-height: 1;
  display: table-cell;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  color: #fff;
	letter-spacing:.1;
}
.wavy-box2 a {
	color:#fff;
	text-decoration:none;
}
.wavy-box2 a:hover {
  opacity:.3;
}
.wavy-box2::before, .wavy-box2::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  content: '';
  border-radius: 50%;
}
.wavy-box2::before {
  z-index: -1;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  margin-left: -30px;
  -webkit-animation: wb 6s infinite linear;
          animation: wb 6s infinite linear;
  background-color: #32638c;
}
.wavy-box2::after {
  z-index: -2;
  width: 62px;
  height: 62px;
  margin-top: -31px;
  margin-left: -31px;
  -webkit-animation: wb 7s infinite linear reverse;
          animation: wb 7s infinite linear reverse;
  background-color: #d7b95e;
}
@-webkit-keyframes wb {
  0% {
    -webkit-transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    -webkit-transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    -webkit-transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    -webkit-transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    -webkit-transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    -webkit-transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
@keyframes wb {
  0% {
    transform: rotate(0deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
  20% {
    transform: rotate(72deg);
    border-radius: 70% 58% 58% 58%/70% 58% 58% 58%;
  }
  40% {
    transform: rotate(144deg);
    border-radius: 58% 60% 58% 58%/58% 60% 58% 58%;
  }
  60% {
    transform: rotate(216deg);
    border-radius: 58% 58% 65% 58%/58% 58% 65% 58%;
  }
  80% {
    transform: rotate(288deg);
    border-radius: 58% 58% 58% 70%/58% 58% 58% 70%;
  }
  100% {
    transform: rotate(360deg);
    border-radius: 50% 50% 50% 50%/50% 50% 50% 50%;
  }
}
}
/*///// 定休日&時間割///////*/
.t-bg {
	max-width: 600px;
    padding: 20px 10px;
    margin: 20px auto;
    background-color: #fff;
}


/*///// 定休日///////*/
.close_day {
	max-width: 600px;
}
td.t-td1 {
	width:20%;
	text-align:right;
	font-weight:bold;
}
td.t-td2 {
    width: 80%;
    text-align: center;
    padding: 0 100px 0 20px;
	font-size:1.2em;
	font-weight:bold;
}

/*///// 時間表///////*/

.time-table {
	max-width: 600px;
	display: block;
	border-collapse: collapse;
}

.time-table {
  display: block;
  border-collapse: collapse;
}

.time-table th {
  border-top: 1px solid #d2d2d2;
}

.time-table th, .time-table td {
  padding: 0px 10px;
  text-align: center;
  height:50px;
  border-bottom: 1px solid #d2d2d2;
}

.time-table td {
	  width: 100%;
    min-width: 58px;
    color:#FB3A39;
    font-weight: bold;
}

.time-table td .time {
 color:#3c3c3c;
}
td.time_td {
	color:#000;
}
td.time_no {
	color:#000;
}
@media screen and (max-width: 834px)  {
 .time-table td {
  min-width: auto;
  width:100%;
  max-width:5%;
  font-size:12px;
 }

 .time-table th, .time-table td {
  min-width: 40px;
  width:100%;
  padding:0px;
  font-size:12px;
  line-height:1.2;
 }
}

/*/////////////// 波 ////////////////*/
.wave {
	position: relative;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0,0,0,.2);
	margin: 0 auto;
	width: 300px;
	height: 300px;
	border-radius: 50%;
	background-color: rgba(255,255,255,.1);
	margin:30px auto;
}

.wave::before {
	position: absolute;
	bottom: -150%;
	left: -50%;
	border-radius: 50% 50% / 50% 70%;
	width: 200%;
	height: 200%;
	content: "";
	background-image: linear-gradient(80deg, #0093E9 0%, #80D0C7 50%, #fff 100%);
	animation: wave-anime linear 6s infinite;
}
@keyframes wave-anime {
	from {
		transform: rotate(0);
	}
	to {
		transform: rotate(360deg);
	}
}
.wave:hover::before {
	animation: wave-move 4s forwards;
}
@keyframes wave-move {
	from {
		transform: translateY(0) rotate(0);
	}
	to {
		transform: translateY(-50%) rotate(360deg);
			}
}


.wave002 {
	position: relative;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0,0,0,.2);
	margin: 0 auto;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background-color: rgba(255,255,255,.1);
	margin:30px auto;
	animation: slide-in 2s ease-out;
}

@keyframes slide-in {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(0);
}
}

h2.animated-text {
opacity: 0;
animation: fade-in 5s forwards;
}

@keyframes fade-in {
0% {
opacity: 0;
}
100% {
opacity: 0.3;
}
}

h2.animated-text::before {
content: “”;
animation: typing 5s steps(17);
}

@keyframes typing {
from {
width: 0;
}
to {
width: 100%;
}
}

/*///////////////  縦カルタ ////////////////*/
div.t-h1 {
    max-width: 600px;
    padding: 0;
    margin: 50px auto;
} 


/*//////////text animetions/////////*/
.txt {
    display: flex;
	align-items: flex-end;
}

.txt p {
    color: #000;
    font-size: 2.5em;
    font-weight: normal;
    letter-spacing: .2em;
    margin: 0;
	font-family: "New Tegomin", serif !important;

    /* ここからアニメーション関係 */
    transform: translateY(5em);
    animation: textanimation 3s forwards;
}

/* 1文字目 */
.txt p:nth-child(1) {
	font-size: 3.5em;
    animation-delay: 0.2s
}
/* 2文字目 */
.txt p:nth-child(2) {
    animation-delay: 0.4s
}
/* 3文字目 */
.txt p:nth-child(3) {
    animation-delay: 0.6s
}
/* 4文字目 */
.txt p:nth-child(4) {
    animation-delay: 0.8s
}
/* 5文字目 */
.txt p:nth-child(5) {
    animation-delay: 1s
}



@keyframes textanimation {
    0% {
        transform: translateY(5em);
    }

    100% {
        transform: translateY(0);
    }
}
/*///////////////////////*/
.vertical-list-container {
    max-width: 700px;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 0;
	margin: 0 auto;
}
.vertical-wrap {
	
}

.vertical-list-container2 {
    max-width: 700px;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 0;
	margin: 0 auto;
	transform: translate(50px);　/* 	あ行より少し右に */
}


.vertical-list-container3 {
    max-width: 700px;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 0;
	margin: 0 auto;
}
.text_down2 {
	margin-top: 60px;
}
.text_down3 {
	margin-top: 100px;
}
.text_down4 {
	margin-top: 20px;
}
.text_down5 {
	margin-top: 140px;
}

.vertical-list-item {
    margin-bottom: 30px;
    margin-left: 40px; /* 各リスト項目の間にスペースを追加 */
}

h2.vertical-title {
    display: inline-block;
    width: 30px;
    font-size: 6em;
    font-weight: normal;
    color: #6f612c;
/*     opacity: 0.3 !important; */
	margin: -45px auto;
	font-family: "New Tegomin", serif !important;
}

.description {
	font-size: 1.3em;          /* 説明文のフォントサイズ */
	line-height: 1.5;         /* 行間を少し広げる */
	color: #333333;           /* テキストの色 */
	font-family: "Yuji Syuku", serif;
}
/*//////カルタのpを順番にフェードイン///////*/
.fade_up1 {
animation: fadeIn 3s ease 1s 1 normal backwards;
	
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
	  
  }
}

.fade_up2 {
animation: fadeIn 4s ease 1s 1 normal backwards;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade_up3 {
animation: fadeIn 5s ease 1s 1 normal backwards;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade_up4 {
animation: fadeIn 6s ease 1s 1 normal backwards;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.fade_up5 {
animation: fadeIn 7s ease 1s 1 normal backwards;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}



@media screen and (max-width: 834px)  {
div.t-h1 {
    width: 300px;
    padding: 0;
    margin: 50px auto;
} 
.t_h1text {
	font-size: 1.8em;
}
.vertical-list-container {
    width: 100%;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 10px;
	margin: 0 auto;
}
.vertical-list-container2 {
    width: 90%;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    /* padding: 10px; */
    /* margin: 0 auto; */
    transform: translate(10px);
}
	
.vertical-list-container3 {
    width: 100%;
    writing-mode: vertical-rl;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    list-style-type: none;
    padding: 20px;
	margin: 0 auto;
}
	
.text_down2 {
	margin-top: 60px;
}
.text_down3 {
	margin-top: 100px;
}
.text_down4 {
	margin-top: 20px;
}
.text_down5 {
	margin-top: 140px;
}

.vertical-list-item {
    margin-bottom: 30px;
    margin-left: 5px; 各リスト項目の間にスペースを追加
}

h2.vertical-title {
    display: flex;
    text-align: left;
    font-size: 3.6em;
    font-weight: normal;
    margin: -45px auto;
    font-family: "New Tegomin", serif !important;
}

.description {
	font-size: 1em;          /* 説明文のフォントサイズ */
	line-height: 1.5;         /* 行間を少し広げる */
	color: #333333;           /* テキストの色 */
	font-family: "Yuji Syuku", serif;
}
}

/*////////////////////////////*/
/* ハンバーガーメニューのスタイル */
/*//////////////////////////*/


/*///////////////  テストページ用ここまで ////////////////*/
/*///////////////////////////////////////////////////////*/
.fade_off {
    opacity: 0;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    -ms-transition: all 1s;
    transition: all 1s;
}

.fade_on {
    opacity: 1;
}

.page-id-8 .mobile-menu-buttons {
    display: none;
}

.menu-title-line {
  height: 4px;
  background-color: #e53935; /* 赤い線 */
  width: 0;
  margin: 0 auto;
  animation: expandLine 3s ease-out forwards;
}

@keyframes expandLine {
  from {
    width: 0;
  }
  to {
    width: 80%; /* お好みで調整可能 */
  }
}

/*------------おしながき白山-----------------*/

.lineup-h2 {
	color: #333;
	font-size: clamp(12px, 2vw + 1rem, 32px) !important;
	letter-spacing: normal;
	font-family: 'Hina Mincho', serif;
}

.menu-message-wrap{
	padding:10px;
	margin: 10px;
}
.menu-message {
	font-size: clamp(10px, 1vw + 1rem, 16px) !important;
	letter-spacing: normal;
	font-family: 'Hina Mincho', serif;
	
}

.menu-title-line {
    height: 3px;
    background-color: #FF7F50;
    max-width: 800px;
}

.menu-section {
    max-width: 800px;
    background-color: #fff;
    border-radius: 10px;
    padding: 20px;
    margin: auto;
}

.menu-h2 {
	letter-spacing: normal;
	margin-bottom: 0 !important;
}

.menu-p1 {
	letter-spacing: 0.6;
}

.menu-p1, .menu-p2 {
	line-height: 1;
    font-family: 'Zen Maru Gothic';
}


.button-container {
    font-family: 'Zen Maru Gothic';	
}

    .menu-shop-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 6px 12px;
      background-color: #32436a;
      color: #fff;
      border-radius: 5px;
      text-decoration: none;
      font-size: clamp(12px, 1.2vw, 14px);
      white-space: nowrap;
      transition: background-color 0.3s;
    }
	
.btn-close {
	  background-color: #e9e9e9;
      color: #c9c9c9;
}


    .menu-shop-btn:hover {
      background-color: #fff;
      color: #32436a;
	  border: 1px solid #43598c;
    }

    .btn-close:hover {
      background-color: #fff;
      color: #a7a7a7;
	  border: 1px solid #a7a7a7;
    }

.top-big-img  {
	    flex-basis: 100% !important;
}


/************************/
/* 投稿ページ */
/************************/

/* 投稿ページ（single post）にのみ padding を適用 */
.article.type-post {
	max-width: 800px;
	background-color:#fff;
	border-radius: 10px;
	padding: 55px;
	margin: 20px auto;
}


.article.type-post h2 {
	position: relative;
    display: inline-block;
    font-size: 1.5rem;
    cursor: default;
	padding: 10px;
	margin: 0 auto;
	font-size: clamp(20px, 2.5vw, 32px);
	letter-spacing: -0.02em;
}

.article.type-post h2::after {
      content: '';
      position: absolute;
      bottom: -10px;
      left: 0;
      width: 0;
      height: 3px;
      background-color: #FF7F50;
      animation: underline-left-to-right 5s ease forwards;
    }

    @keyframes underline-left-to-right {
      0% {
        width: 0;
      }
      100% {
        width: 130%;
      }
    }

.article.type-post h4{
	position: relative;
    display: inline-block;
    font-size: 1.5rem;
    cursor: default;
	padding: 10px;
	font-size: clamp(18px, 2.5vw, 26px);
	letter-spacing: -0.02em;
}

.article.type-post h4::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 0;
      height: 2px;
      background-color: #333;
      animation: underline-left-to-right 5s ease forwards;
    }

    @keyframes underline-left-to-right {
      0% {
        width: 0;
      }
      100% {
        width: 110%;
      }
    }


.article.type-post p {
  font-size: clamp(14px, 2.5vw, 18px);
  line-height: 1.6;
	padding: 30px 0;
}
.wp-post-image{
max-width: 300px;
margin: 0 auto;
}

/* レスポンシブ：モバイル（768px以下）でpaddingを10pxに */
@media screen and (max-width: 768px) {
  .article.type-post {
    padding: 20px;
	margin: 20px;
  }
}


/*////////////関連記事///////////////*/
#pager-post-navi {
	max-width: 800px;
	padding: 10px;
	margin: 0 auto;
}

a.next-post, a.prev-post {
	font-family:"Kiwi Maru", serif;
}

/* 
.musubirice-link {
    position: fixed;
    bottom: 30px;
    left: 20px;
    z-index: 2147483647;
    background-color: #ff6f61;
    color: white;
    letter-spacing: 0.3em;
    padding: 5px 20px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    font-size: clamp(12px, 2.5vw, 18px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.musubirice-link:hover {
  background-color: #e65c50;
  transform: scale(1.05);
} */


.musubirice-link.kome-banner {
  position: fixed;
  bottom: 30px;
  left: 20px;
  z-index: 2147483647;
  width: 90px;
  height: 120px;
  background-image: url('http://omusubimusubi.com/wp-content/uploads/2025/06/rice-icon-wh.png');
	  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.25));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.3s ease;
	writing-mode: vertical-rl; /* バナー内全体を縦書きに */
	line-height: 0.9em;
	
}

.musubirice-link.kome-banner:hover {
  transform: scale(1.2);
}

.kome-text {
font-family: "Yuji Syuku", serif;
    font-size: 12px;
    font-weight: 700 !important;
    color: #5a4b2e;
    text-align: center;
	padding: 15px 20px 12px 10px;
    background-color: rgba(255, 255, 255, 0);
    border-radius: 10px;
}

.kome-banner {
  opacity: 0;
  transition: opacity 2s ease;
}
.kome-banner.show {
  opacity: 1;
}

.musubirice-link.kome-banner {
  /* ... 既存のCSSはそのまま ... */
  opacity: 0;
  pointer-events: none;
  transition: opacity 2s ease;
}

.musubirice-link.kome-banner.visible {
  opacity: 1;
  pointer-events: auto;
}