@charset "UTF-8";

/**
 * 全体
----------------------------------------------------------------*/
:root{
	
	/* 配色 */
	--main:rgb(43,52,111);
	--sub:rgb(247,232,184);
	--black:rgb(0,0,0);
	--black:rgb(0,0,0);
	--lightgold:rgb(247,232,184);
	--red:rgb(255,0,0);
	--navy:rgb(43,52,111);
	
	--main9:rgb(64,72,125);
	--sub9:rgb(247,234,191);
	--black9:rgb(25,25,25);
	--black9:rgb(25,25,25);
	--lightgold9:rgb(247,234,191);
	--red9:rgb(255,25,25);
	--navy9:rgb(64,72,125);
	
	--main8:rgb(85,92,139);
	--sub8:rgb(248,236,198);
	--black8:rgb(51,51,51);
	--black8:rgb(51,51,51);
	--lightgold8:rgb(248,236,198);
	--red8:rgb(255,51,51);
	--navy8:rgb(85,92,139);
	
	--main7:rgb(106,112,154);
	--sub7:rgb(249,238,205);
	--black7:rgb(76,76,76);
	--black7:rgb(76,76,76);
	--lightgold7:rgb(249,238,205);
	--red7:rgb(255,76,76);
	--navy7:rgb(106,112,154);
	
	--main6:rgb(127,133,168);
	--sub6:rgb(250,241,212);
	--black6:rgb(101,101,101);
	--black6:rgb(101,101,101);
	--lightgold6:rgb(250,241,212);
	--red6:rgb(255,101,101);
	--navy6:rgb(127,133,168);
	
	--main5:rgb(149,153,183);
	--sub5:rgb(251,243,219);
	--black5:rgb(127,127,127);
	--black5:rgb(127,127,127);
	--lightgold5:rgb(251,243,219);
	--red5:rgb(255,127,127);
	--navy5:rgb(149,153,183);
	
	--main4:rgb(170,173,197);
	--sub4:rgb(251,245,226);
	--black4:rgb(153,153,153);
	--black4:rgb(153,153,153);
	--lightgold4:rgb(251,245,226);
	--red4:rgb(255,153,153);
	--navy4:rgb(170,173,197);
	
	--main3:rgb(191,194,211);
	--sub3:rgb(252,248,233);
	--black3:rgb(178,178,178);
	--black3:rgb(178,178,178);
	--lightgold3:rgb(252,248,233);
	--red3:rgb(255,178,178);
	--navy3:rgb(191,194,211);
	
	--main2:rgb(212,214,226);
	--sub2:rgb(253,250,240);
	--black2:rgb(204,204,204);
	--black2:rgb(204,204,204);
	--lightgold2:rgb(253,250,240);
	--red2:rgb(255,204,204);
	--navy2:rgb(212,214,226);
	
	--main1:rgb(233,234,240);
	--sub1:rgb(254,252,247);
	--black1:rgb(229,229,229);
	--black1:rgb(229,229,229);
	--lightgold1:rgb(254,252,247);
	--red1:rgb(255,229,229);
	--navy1:rgb(233,234,240);
	
	--gray:#ccc;
	--silver:#f5f5f5;
	--none:rgba(0,0,0,0);
	
	--gap:clamp(
	
		/* 【最小余白】SP時の余白(半分) */
		calc(1px * var(--gap-base) / 2),
		
		/* 【推奨余白】SP時の余白(半分)相当の画面比値 */
		calc(var(--gap-base) / var(--tab) * 100vw),
		
		/* 【最大余白】PC時の余白 */
		calc(1px * var(--gap-base))
	
	);
}

/* リッチフォーム初期設定 */
.richform{

	/* 配色 */
	--black:rgb(0,0,0);
	--gray:#ccc;
	--silver:#f5f5f5;
	--blue:rgb(43,52,111);
	--blue-disabled:rgb(149,153,183);
	--white:white;
	--red:crimson;
	--default-color:rgba(0,0,0,0);

}
:focus{ outline:none; }

/* ボディ */
body{
	font-family:var(--mincho);
	font-size:var(--s);
	letter-spacing:.1em;
}

/**
 * プロトタイプ
----------------------------------------------------------------*/
.base.-wide{ max-width:1536px; }

/* 背景 */
.bg.-navy1{ background:var(--navy1); }

/* 見出し */
.h2{ margin:120px var(--gap) 20px; }
.h2 > h2{ font-size:var(--l); }
.h2 > p{
	font-size:var(--xxl);
	position:relative;
	text-align:center;
	word-break:break-all;
}
.h2 > p:before,
.h2 > p:after{
	content:'-------------';
	letter-spacing:-.2em;
}
.h2 > p:before{ padding-right:20px; }
.h2 > p:after{ padding-left:10px; }

/* ボタン */
.buttons > a:hover{ background:rgb(231,186,42); }
.buttons.-inversion > a{ border:1px solid rgba(0,0,0,0); }
.buttons.-inversion > a:hover{
	background:white;
	border-color:var(--black);
	color:var(--black);
}
.buttons.-min > a{
	color:var(--black);
	border:1px solid var(--black);
	background:white;
	padding:4px 15px;
	font-size:var(--xs);
	flex-basis:auto;
}
.buttons.-min > a:hover{
	background:var(--black);
	color:white;
}

/* カード */
.card > ul > li{ width:300px; }
.card > ul > li > figure{ margin-bottom:10px; }
.card > ul > li > time{
	color:var(--black6);
	font-size:var(--xxs);
}
.card > ul > li > h3{
	font-size:var(--m);
	font-weight:bold;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.card > ul > li > p{
	text-align:right;
	color:var(--black6);
}
.card > ul > li > p > small{ font-size:var(--xxs); }

/**
 * ヘッダー
----------------------------------------------------------------*/
/* ヘッドカード */
#hcard{
	display:flex;
	justify-content:space-between;
	align-items:stretch;
}
#hcard > a#hlogo{ width:220px; }
#hcard > div{
	display:flex;
	align-items:stretch;
}
#hcard > div > a{
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	letter-spacing:.1em;
}
#hcard > div > a#hlang{
	background:var(--black);
	color:white;
	width:150px;
}
#hcard > div > a#hcontact{
	background:var(--lightgold);
	width:230px;
}
#hcard > div > a#hlang:hover{ background:var(--black6); }
#hcard > div > a#hcontact:hover{ background:rgb(231,186,42); }
@media screen and (max-width: 1200px)
{
	#hcard > div > a#hcontact{ margin-right:90px; }
}
@media screen and (max-width: 768px)
{
	#hcard > a#hlogo{ width:154px; }
	#hcard > div > a#hlang,
	#hcard > div > a#hcontact{ display:none; }
}

/* グロナビ */
#open,
#close{ width:90px; }
#gnav > ul > li > a{ height:90px; }
#pnav{ display:none; }
@media screen and (max-width: 1200px)
{
	#pnav{
		margin:100px 20px 20px;
		justify-content:center;
		gap:10px;
	}
	#pnav > a{
		color:white;
		text-align:center;
		display:flex;
		flex-direction:column;
		justify-content:center;
		align-items:center;
		font-size:var(--s);
		letter-spacing:.1em;
		border:1px solid white;
		border-radius:5px;
		padding:10px 15px;
	}
	#pnav > a:hover{ background:rgba(255,255,255,.1); }
	body.clicked #pnav{ display:flex; }
	#gnav > ul > li > a{ height:auto; }
}
@media screen and (max-width: 768px)
{
	#open,
	#close{ width:63px; }
	#pnav{ margin-top:73px; }
}

/* TOPへ戻る */
#totop{
	transform:scale(0.7071068,0.7071068) rotate(45deg);
	position:relative;
	border:1px solid var(--black);
	position:fixed;
	bottom:20px;
	right:20px;
	z-index:1000;
	width:60px;
	background:white;
}
#totop:hover{ background:var(--lightgold); }

/**
 * フッター
----------------------------------------------------------------*/
body > footer{
	background:var(--black);
	color:white;
}

/* フットナビゲーション */
#fnav > ul{
	text-align:center;
	padding:20px 0;
}
#fnav > ul > li{
	display:inline-block;
	padding:5px 0;
}
#fnav > ul > li > a{
	padding:0 20px;
	border-left:1px solid white;
	display:inline-block;
}
#fnav > ul > li:last-child > a{ border-right:1px solid white; }
#fnav > ul > li > a:hover{ color:var(--lightgold); }
@media screen and (max-width: 768px)
{
	#fnav > ul{
		padding:0 0 20px 0;
		display:flex;
		flex-wrap:wrap;
		align-items:stretch;
	}
	#fnav > ul > li{
		width:50%;
		display:block;
		padding:0;
	}
	#fnav > ul > li > a{
		display:block;
		border-left:none;
		padding:15px 10px;
		border-bottom:1px solid white;
		font-size:var(--s);
		height:100%;
		display:flex;
		justify-content:center;
		align-items:center;
		flex-direction:column;
	}
	#fnav > ul > li:nth-child(odd) > a{ border-right:1px solid white; }
	#fnav > ul > li:last-child > a,
	#fnav > ul > li:nth-last-child(2):not(:nth-child(even)) > a{ border-bottom:none; }
	#fnav > ul > li:last-child:not(:nth-child(odd)) > a{ border-right:none; }
	#fnav > ul > li > a:hover{
		background:var(--lightgold);
		color:var(--black);
	}
}

/* ソーシャルナビゲーション */
#snav > ul{
	display:flex;
	justify-content:flex-end;
	gap:10px;
	padding:20px 0;
}
#snav > ul > li{ width:50px; }
#snav > ul > li > a:hover{ opacity:.7; }
@media screen and (max-width: 768px)
{
	#snav > ul{ justify-content:center; }
}

/* フットカード */
#fcard{
	display:flex;
	gap:20px;
}
#fcard > figure{
	max-width:400px;
	margin:0 auto;
}
#fcard > div{ width:100%; }
#ftel{
	border:1px solid white;
	border-radius:10px;
	display:inline-block;
	max-width:290px;
	margin-top:20px;
}
#ftel:hover{ background:rgba(255,255,255,.1); }
@media screen and (max-width: 768px)
{
	#fcard{
		flex-direction:column;
		text-align:center;
		font-size:var(--s);
	}
}

/* 著作権表記 */
#cr{
	text-align:center;
	padding:20px 0;
	font-size:var(--s);
}

/**
 * コンテンツ
----------------------------------------------------------------*/
#cont > header{
	border-bottom:1px solid var(--black);
	padding:60px 20px;
	text-align:center;
}
#pagename{ font-size:var(--xxl); }
#pan{ font-size:var(--xxs); }
#pan > ol > li{ display:inline-block; }
#pan > ol > li:not(:last-child)::after{ content:'>'; }

/**
 * スポット：TOP
----------------------------------------------------------------*/
/* メインビジュアル */
#spot_index_mvis > img:nth-child(2){ display:none; }
#spot_index_mvis > img:nth-child(3){ display:none; }
@media screen and (max-width: 1200px)
{
	#spot_index_mvis > img:nth-child(1){ display:none; }
	#spot_index_mvis > img:nth-child(2){ display:block; }
}
@media screen and (max-width: 768px)
{
	#spot_index_mvis > img:nth-child(2){ display:none; }
	#spot_index_mvis > img:nth-child(3){ display:block; }
}

/* 嘉喜家のすき焼き */
.spot_index_sukiyaki{
	position:relative;
	margin-bottom:40px;
}
.spot_index_sukiyaki::after{
	content:'';
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	background:rgba(0,0,0,0.2);
	height:250px;
	z-index:-1;
}
.spot_index_sukiyaki > .base > div{
	margin:0 auto;
	max-width:640px;
	background:white;
}
.spot_index_sukiyaki > .base > div > a{
	display:block;
	position:relative;
}
.spot_index_sukiyaki > .base > div > a:hover{ opacity:.8; }
.spot_index_sukiyaki > .base > div > a::before{
	content:'';
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
	margin:auto;
	width:60px;
	height:60px;
	background:url(https://kakiya-yokkaichi.jp/wp-content/themes/kakiya/images/interfaces/icons/play.png) no-repeat center center / contain;
}

/* コンセプト */
.spot_index_concept{
	position:relative;
	overflow:hidden;
}
.spot_index_concept > .base > section > div{ position:relative; }
.spot_index_concept > .base > section > div > header > p{
	font-size:24px;
	position:relative;
	width:170px;
	height:170px;
	padding:20px;
	z-index:1;
	display:flex;
	flex-direction:column;
	text-align:center;
	justify-content:center;
	align-items:center;
}
.spot_index_concept > .base > section > div > header > p::before,
.spot_index_concept > .base > section > div > header > p::after{
	content:'';
	display:block;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:-1;
	transform:rotate(45deg) scale(0.70710704547);
}
.spot_index_concept > .base > section > div > header > p::before{ background:linear-gradient(45deg, rgba(197,150,0,1) 0%, rgba(255,255,255,1) 25%, rgba(197,150,0,1) 50%, rgba(255,255,255,1) 75%, rgba(197,150,0,1) 100%); }
.spot_index_concept > .base > section > div > header > p::after{
	background:white;
	margin:3px;
}
.spot_index_concept > ul{ --w:100px; }
.spot_index_concept > ul > li{
	position:absolute;
	z-index:-1;
	opacity:.5;
}
.spot_index_concept > ul > li::before,
.spot_index_concept > ul > li::after{
	content:'';
	display:block;
	position:absolute;
	width:calc(var(--w) * 10);
	height:calc(var(--w) * 10 / 13 * 9);
}
.spot_index_concept > ul > li::before{
	background:url(https://kakiya-yokkaichi.jp/wp-content/themes/kakiya/images/article/index/bg_concept1.png) scroll no-repeat center center / cover;
	z-index:1;
}
.spot_index_concept > ul > li::after{ background:url(https://kakiya-yokkaichi.jp/wp-content/themes/kakiya/images/article/index/bg_concept2.png) scroll no-repeat center center / cover; }
.spot_index_concept > ul > li:nth-child(1){
	top:calc(var(--w) * 0);
	left:calc(var(--w) * -4);
}
.spot_index_concept > ul > li:nth-child(1)::after{
	top:calc(var(--w) * 2);
	left:calc(var(--w) * 2);
}
.spot_index_concept > ul > li:nth-child(2){
	top:calc(var(--w) * 14);
	right:calc(var(--w) * 8);
}
.spot_index_concept > ul > li:nth-child(2)::after{
	top:calc(var(--w) * -3);
	left:calc(var(--w) * 3);
}
.spot_index_concept > ul > li:nth-child(3){
	top:calc(var(--w) * 24);
	left:calc(var(--w) * -3);
}
.spot_index_concept > ul > li:nth-child(3)::after{
	top:calc(var(--w) * -4);
	left:calc(var(--w) * 2);
}
.spot_index_concept > ul > li:nth-child(4){
	top:calc(var(--w) * 32);
	right:calc(var(--w) * 4);
}
.spot_index_concept > ul > li:nth-child(4)::after{
	top:calc(var(--w) * -3);
	left:calc(var(--w) * -4);
}
@media screen and (min-width: 1200px){
	.spot_index_concept > .base > section:not(:first-child){
		display:flex;
		justify-content:space-between;
		gap:var(--gap);
	}
	.spot_index_concept > .base > section:not(:first-child):nth-child(odd){ flex-direction:row-reverse; }
	.spot_index_concept > .base > section:not(:first-child):nth-child(even) > figure{ min-width:640px; }
	.spot_index_concept > .base > section:not(:first-child):nth-child(odd) > figure{ min-width:710px; }
	.spot_index_concept > .base > section:not(:first-child).-mie > figure{ min-width:660px; }
	.spot_index_concept > .base > section:not(:first-child) > div{ width:100%; }
	.spot_index_concept > .base > section.concept.-en > div > header > p,
	.spot_index_concept > .base > section.concept.-meat > div > header > p{ font-size:40px; }
	.spot_index_concept > .base > section.concept.-en > div{
		max-width:420px;
		margin-top:-50px;
		margin-left:240px;
	}
	.spot_index_concept > .base > section.concept.-en > div > header > p{
		position:absolute;
		top:-100px;
		left:-200px;
	}
	.spot_index_concept > .base > section.concept.-en > div > img{ margin:60px 0 -40px auto; }
	.spot_index_concept > .base > section.concept.-meat > div{ margin-top:-240px; }
	.spot_index_concept > .base > section.concept.-meat > div > header > p{
		position:absolute;
		left:-200px;
	}
	.spot_index_concept > .base > section.concept.-omotenashi > figure{ margin-right:-40px; }
	.spot_index_concept > .base > section.concept.-omotenashi > div{ margin:0 -40px 0 40px; }
	.spot_index_concept > .base > section.concept.-omotenashi > div > img{ margin:0 0 0 auto; }
	.spot_index_concept > .base > section.concept.-sukiyaki > div > img{ margin:0 0 0 auto; }
	.spot_index_concept > .base > section.concept.-sake > figure{ margin-right:-40px; }
	.spot_index_concept > .base > section.concept.-sake > div > header > .h3{ text-align:right; }
	.spot_index_concept > .base > section.concept.-sake > div > header > p{
		position:absolute;
		right:-240px;
		top:40px;
	}
	.spot_index_concept > .base > section.concept.-sake > div > img{ margin:60px auto 0 40px; }
	.spot_index_concept > .base > section.concept.-foods > div{ padding-top:140px; }
	.spot_index_concept > .base > section.concept.-foods > div > img{
		position:absolute;
		right:20px;
		top:80px;
	}
	.spot_index_concept > .base > section.concept.-mie{ margin-top:60px; }
	.spot_index_concept > .base > section.concept.-mie > figure{ margin-right:-40px; }
	.spot_index_concept > .base > section.concept.-mie > div > img{ margin:0 0 0 auto; }
}
@media screen and (min-width: 768px) and (max-width: 1200px){
	.spot_index_concept > ul{ --w:8.333vw; }
	.spot_index_concept > .base > section:not(:first-child){
		display:flex;
		justify-content:space-between;
	}
	.spot_index_concept > .base > section:not(:first-child):nth-child(odd){ flex-direction:row-reverse; }
	.spot_index_concept > .base > section:not(:first-child){ padding-top:40px; }
	.spot_index_concept > .base > section:not(:first-child) > figure{ width:50%; }
	.spot_index_concept > .base > section:not(:first-child) > div{ width:50%; }
	.spot_index_concept > .base > section:not(:first-child):nth-child(even){ margin-left:-60px; }
	.spot_index_concept > .base > section:not(:first-child):nth-child(odd){ margin-right:-60px; }
	.spot_index_concept > .base > section:not(.-meat) > div img{ display:none; }
	.spot_index_concept > .base > section > div > header{
		display:flex;
		gap:20px;
		align-items:center;
		margin-bottom:20px;
	}
	.spot_index_concept > .base > section > div > header > p{
		font-size:16px;
		width:100px;
		height:100px;
		padding:10px;
	}
	.spot_index_concept > .base > section.concept.-en > div > header > p,
	.spot_index_concept > .base > section.concept.-meat > div > header > p{ font-size:24px; }
	.spot_index_concept > .base > section.concept.-en{ position:relative; }
	.spot_index_concept > .base > section.concept.-meat{
		position:relative;
		margin-bottom:calc(30vw - 200px);
	}
	.spot_index_concept > .base > section.concept.-meat > div{ position:static; }
	.spot_index_concept > .base > section.concept.-meat > div > header{
		position:absolute;
		left:8vw;
		top:50vw;
		max-width:60vw;
	}
	.spot_index_concept > .base > section.concept.-meat > div > p{
		position:absolute;
		left:8vw;
		top:calc(50vw + 120px);
		max-width:60vw;
	}
	.spot_index_concept > .base > section.concept.-mie > div > header{
		margin-right:-80px;
		background:rgba(255,255,255,.9);
	}
}
@media screen and (max-width: 768px){
	.spot_index_concept > ul > li:nth-child(1){ top:calc(var(--w) * 0); }
	.spot_index_concept > ul > li:nth-child(2){ top:calc(var(--w) * 24); }
	.spot_index_concept > ul > li:nth-child(3){ top:calc(var(--w) * 40); }
	.spot_index_concept > ul > li:nth-child(4){ top:calc(var(--w) * 60); }
	.spot_index_concept > ul{ --w:8.333vw; }
	.spot_index_concept > .base > section:not(:first-child){ padding-top:40px; }
	.spot_index_concept > .base > section > div > header{
		display:flex;
		gap:20px;
		align-items:center;
		margin-bottom:20px;
	}
	.spot_index_concept > .base > section > div > header > p{
		font-size:14px;
		width:100px;
		height:100px;
		padding:10px;
	}
	.spot_index_concept > .base > section > div > header > .h3 > span{
		background:white;
		padding:2px;
		font-size:4vw;
	}
	.spot_index_concept > .base > section.concept.-en > div > header > p,
	.spot_index_concept > .base > section.concept.-meat > div > header > p{ font-size:24px; }
	.spot_index_concept > .base > section.concept > div > img{ display:none; }
	.spot_index_concept > .base > section:not(:first-child) > div > header{ margin-top:-90px; }
	.spot_index_concept > .base > section.concept.-en{}
	.spot_index_concept > .base > section.concept.-meat{}
	.spot_index_concept > .base > section.concept.-omotenashi{}
	.spot_index_concept > .base > section.concept.-sukiyaki{}
	.spot_index_concept > .base > section.concept.-sake{}
	.spot_index_concept > .base > section.concept.-foods{}
	.spot_index_concept > .base > section.concept.-mie{}
}

/* 信条 */
#spot_index_credo{
	font-family:var(--gothic);
	color:var(--gray);
	letter-spacing:.2em;
	text-align:center;
	font-size:var(--xl);
}
@media screen and (max-width: 520px)
{
	#spot_index_credo{ font-size:var(--l); }
}

/**
 * スポット：メニュー
----------------------------------------------------------------*/
/* フードメニュー */
.foodmenus > section .cond{
	background:var(--sub);
	display:inline-block;
	padding:0 10px;
	line-height:1.3;
	font-size:var(--xs);
}
.foodmenus > section .priceset{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-end;
	gap:0 20px;
	margin-bottom:10px;
}
.foodmenus > section .priceset > .h3{ margin-bottom:0; }
.foodmenus > section .cont{
	background:#f5f5f5;
	padding:10px;
	font-size:var(--xs);
}
.foodmenus > section > div > div > section:not(:last-child){ margin-bottom:40px; }
.foodmenus > section .note{
	font-size:var(--xs);
	margin-top:20px;
}
.foodmenus > section > div > div > section > header > h4{ margin:0; }
.foodmenus > section > div > div > section > header > h4 > strong{ font-size:var(--l); }
.foodmenus > section > div > div > section > header > p > small{ font-size:80%; }
.foodmenus > section > div > div > section > p > strong{
	background:var(--main);
	color:white;
	display:inline-block;
	padding:0 10px;
	margin:0 3px;
	border-radius:1em;
	font-weight:bold;
}
@media screen and (max-width: 1200px)
{
	.foodmenus:not(.flex) > section .priceset{ display:block; }
	.foodmenus:not(.flex) > section .priceset > p{ text-align:right; }
}
@media screen and (max-width: 768px)
{
	.foodmenus > section .priceset{ display:block; }
	.foodmenus > section .priceset > p{ text-align:right; }
}

/* スリック設定 */
.slick-dots{
	text-align:center;
	padding:4px 0;
}
.slick-dots > li{ display:inline-block; }
.slick-dots > li > button{
	background:#bbb;
	font-size:0;
	width:12px;
	height:12px;
	border-radius:50%;
	margin:0 4px;
}
.slick-dots > li > button:hover{ background:#555; }
.slick-list.draggable:hover{ cursor:grab; }

/* メニューテーブル */
#spot_menu_menutable > section > .h3{ border-bottom:1px solid var(--black); }
#spot_menu_menutable ul > li{
	display:flex;
	justify-content:space-between;
	gap:10px;
}
#spot_menu_menutable ul > li > p{ text-align:right; }

/**
 * スポット：すき焼き
----------------------------------------------------------------*/
@media screen and (min-width: 1200px){
	#spot_sukiyaki_howto > section{
		--wing:calc((100vw - 1200px) / 2);
		transition:margin 0s;
	}
	#spot_sukiyaki_howto > section > div{ transition:margin 0s; }
	#spot_sukiyaki_howto > section:nth-child(odd){ margin-right:var(--wing); }
	#spot_sukiyaki_howto > section:nth-child(odd) > div{ margin-left:var(--wing); }
	#spot_sukiyaki_howto > section:nth-child(even){ margin-left:var(--wing); }
	#spot_sukiyaki_howto > section:nth-child(even) > div{ margin-right:var(--wing); }
}
#spot_sukiyaki_leadvis > div{ padding:var(--gap); }
#spot_sukiyaki_howto > section{
	background:var(--main);
	color:white;
}
#spot_sukiyaki_howto > section:not(:first-child){ margin-top:280px; }
#spot_sukiyaki_howto > section:last-child{ margin-bottom:280px; }
#spot_sukiyaki_howto > section > div{ padding:var(--gap); }
#spot_sukiyaki_howto > section > div > div{
	position:relative;
	padding-left:180px;
}
#spot_sukiyaki_howto > section > div > div > span{
	width:100px;
	height:100px;
	display:block;
	background:white;
	color:var(--navy);
	font-size:var(--xxl);
	text-align:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	position:absolute;
	left:30px;
	top:30px;
	transform:rotate(45deg);
}
#spot_sukiyaki_howto > section > div > div > span > span{ transform:rotate(-45deg); }
#spot_sukiyaki_howto > section > div > div > h2{
	font-size:var(--xxxl);
	line-height:1.5;
}
#spot_sukiyaki_howto > section > div > figure{
	margin-top:40px;
	margin-bottom:-200px;
}
#spot_sukiyaki_howto > section > div > figure.flex.--2{
	max-width:960px;
	margin-right:auto;
	margin-left:auto;
}
#spot_sukiyaki_howto > section > div > figure.flex.--1{
	max-width:480px;
	margin-right:auto;
	margin-left:auto;
}
@media screen and (max-width: 768px)
{
	#spot_sukiyaki_howto > section > div > div{ padding-left:100px; }
	#spot_sukiyaki_howto > section > div > div > span{
		width:60px;
		height:60px;
		left:15px;
		top:15px;
	}
}