@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ローディング画面
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.loading_wrap {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 9999;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}

.loading_wrap .img {
	display: none;
	width: 100px;
	margin-bottom: 0px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用 > 縦文字
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.cmn_tate {
	writing-mode: vertical-rl;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用 > アニメーション（左から右へ徐々に表示）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.img-wrap {
	position: relative;
	overflow: hidden;
}

.img-wrap img {
	clip-path: inset(0 100% 0 0); /* 最初は右端まで切られて何も見えない */
	transition: clip-path 1.5s ease-out, opacity 0.8s ease-out;
	opacity: 0;
}

.img-animation img {
	clip-path: inset(0 0 0 0); /* 全体を表示 */
	opacity: 1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用 > テーブル
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*table02*/
.classic_table02 table {
    border: none;	
    border-spacing: 0; 
}

.classic_table02 table th {
    border: none;
	border-bottom: 1px solid #ddd;
    text-align: left;
    color: #7b7870;
    padding: 0 20px;
}

.classic_table02 tr td {
    border: none;	
    border-bottom: 1px solid #ddd;
    padding: 20px 0px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ページトップへ戻る
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
a.generate-back-to-top {
	width: 118px;
	height: 118px;
	border: 1px solid #dfd5b7;
}

a.generate-back-to-top::before {
	content: '\e913';
	position: absolute;
	font-size: 5px;
	font-family: "icomoon";
	line-height: 1;
	color: var(--main);
	top: 35px;
	left: calc(50% - 10px);
	transform: rotate(270deg);
}

a.generate-back-to-top::after {
	content: 'PAGE TOP';
	position: absolute;
	font-size: 13px;
	font-family: "CrimsonText",serif;
	line-height: 1;
	letter-spacing: 0.14em;
	color: var(--main);
	left: calc(50% - 42px);
	bottom: 48px;
}

a.generate-back-to-top svg {
	display: none;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップ > プロモ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.entry-content .wp-block-cover {
	height: 100%;
	align-items: flex-end;
}

.entry-content .wp-block-cover video {
	position: fixed;
	height: 56.25vw;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップ > 店舗案内
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_shop ul.list_type04 li {
	font-size: 14px;
	letter-spacing: 0.05em;
	padding-left: 30px;
}

#home_shop ul.list_type04 li::before {
	width: 4px;
	height: 4px;
	left: 10px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*画像に変更する*/
.site-footer {
	position: relative;
	overflow: hidden;
	clip-path: inset(0);
	z-index: 1;
	/* safariはレイアウト確定後しかclip-pathが適用されない仕様のため、表示崩れが発生していた。transform: translateZ(0)によって強制的にGPUレイヤーにすることで問題が解決した（2025-07-29）mk */
	transform: translateZ(0);
}

.site-footer::before {
	content: '';
	position: fixed;
	background: url("./images/footer_bg.jpg");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	inset: 0;
	z-index: -1;
}

/*参考サイト*/
/*
.site-footer {
	position: relative;
	background: url("./images/footer_bg.jpg") fixed;
	background-size: cover;
	z-index: 1;
}
*/

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
カスタム投稿 > カテゴリーアーカイブ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.tax-item_category h1.page-title {
	display: none;
}

body.page-item div.main_area div.category:has(a.bl_area) .coming_soon{
	display:none;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
投稿 > アーカイブ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*ページタイトル非表示*/
body.archive h1.page-title {
    display: none;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
投稿 > 詳細ページ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*画像サイズ調整*/
body.single-post .has-post-thumbnail img {
    width: auto;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ハンバーガーメニューのカスタマイズ(2023-03-13mk)
↓↓↓下記をまずは削除した上で、【https://coco-factory.jp/ugokuweb/move01-cat/humbugermenu/】から、お好みのボタンのCSSを追加
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#mobile-header .menu-toggle, #generate-slideout-menu .slideout-exit {
	margin-right: 15px;
}

/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{
	position: relative;/*ボタン内側の基点となるためrelativeを指定*/
	background:transparent;
	cursor: pointer;
	width: 50px;
	height:50px;
	border-radius: 5px;
}

/*ボタン内側*/
.openbtn span{
	display: inline-block;
	transition: all .4s;/*アニメーションの設定*/
	position: absolute;
	left: 10px;
	height: 1px;
	background: #fff;
	width: 60%;
}

#mobile-header.is_stuck .openbtn span , .single-item .openbtn span {
	background: var(--main);
}

.openbtn span:nth-of-type(1) {
	top: 20px; 
}

.openbtn span:nth-of-type(2) {
	top: 30px;
}

/*activeクラスが付与されると線が回転して×に*/
.openbtn.active span {
	background: var(--main);
}

.openbtn.active span:nth-of-type(1) {
	top: 19px;
	left: 8px;
	transform: translateY(6px) rotate(-30deg);
	width: 68%;
}

.openbtn.active span:nth-of-type(2){
	top: 31px;
	left: 8px;
	transform: translateY(-6px) rotate(30deg);
	width: 68%;
}