@charset "utf-8";

#titleSCT {
padding-bottom: 13.5%;
}
#titleSCT .cont {
padding: 77px 0 0 0;
text-align: center;
}
#titleSCT.activeView h1,
#titleSCT.activeView .en {
animation: head 0.7s ease forwards;
}
#titleSCT .en {
color: var(--color-sub2);
font-weight: 700;
font-family: 'BIZ UDMincho', serif;
font-size: 48px;
letter-spacing: 0.1em;
line-height: 1.2;
opacity: 0;
}
#titleSCT h1 {
font-weight: 700;
font-family: 'BIZ UDMincho', serif;
font-size: 15px;
letter-spacing: 0.15em;
line-height: 1.2;
opacity: 0;
}
@media screen and (min-width: 768px) {
	#titleSCT {
	padding-bottom: 10%;
	}
	#titleSCT .cont {
	padding: 139px 0 0 0;
	text-align: center;
	}
	#titleSCT .en {
	font-size: 110px;
	}
	#titleSCT h1 {
	font-size: 18px;
	}
}

#listSCT {
position: relative;
background-color: var(--color-sub3);
opacity: 0;
}
#listSCT.activeView {
animation: sct_bottom_sp 0.7s ease forwards;
}
#listSCT::before {
content: '';
display: block;
position: absolute;
left: 0;
bottom: calc(100% - 1px);
background: url("../../common/img/lin_wave.svg") no-repeat center center;
background-size: 100% auto;
width: 100%;
padding-top: 18.0433%;
}
#listSCT .cont {
padding: 40px 20px 100px 20px;
}
#listSCT .sort {
margin-bottom: 100px;
padding: 0 6px;
}
#listSCT .sort svg,
#listSCT .sort img {
width: 100%;
height: auto;
}
#listSCT .area {
margin-bottom: 100px;
}
#listSCT .area:last-child {
margin-bottom: 0;
}
#listSCT .prefectures {
border-bottom: solid 2px #fff;
margin-bottom: 20px;
padding-bottom: 40px;
}
#listSCT .prefectures:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
#listSCT h2 {
border-radius: var(--radius-circle);
margin: 0 auto 10px auto;
background-color: #fff;
width: 225px;
font-weight: 700;
font-size: 18px;
line-height: 45px;
text-align: center;
color: #fff;
}
#listSCT .area:nth-of-type(1) h2 {
background-color: #2882ea;
}
#listSCT .area:nth-of-type(2) h2 {
background-color: #ef89b6;
}
#listSCT .area:nth-of-type(3) h2 {
background-color: #30bf41;
}
#listSCT .area:nth-of-type(4) h2 {
background-color: #ed903d;
}
#listSCT .area:nth-of-type(5) h2 {
background-color: #9785cd;
}
#listSCT .hed {
margin-bottom: 15px;
font-weight: 700;
font-size: 18px;
text-align: center;
}
#listSCT .shop {
display: flex;
flex-direction: column;
gap: 20px;
}
#listSCT .linkBlock {
background-color: #fff;
border-radius: 10px;
padding: 16px 20px;
opacity: 0;
cursor: pointer;
}
#listSCT .linkBlock.activeView {
animation: img_bottom 0.7s ease forwards;
}
#listSCT .linkBlock:nth-of-type(even).activeView {
animation-delay: 0.3s;
}
#listSCT .linkBlock .name {
position: relative;
margin-bottom: 7px;
padding-bottom: 6px;
font-weight: 700;
font-size: 13px;
}
#listSCT .linkBlock .name::before {
content: '';
display: block;
position: absolute;
left: 0;
bottom: 0;
background-color: var(--color-main);
width: calc(100% - 30px);
height: 1px;
}
#listSCT .linkBlock .name::after {
content: '';
display: block;
position: absolute;
right: 0;
bottom: -3px;
background: url("../img/line.svg") no-repeat right center;
background-size: contain;
width: 30px;
height: 6px;
}
#listSCT .linkBlock:hover .name::after {
animation: fish2 0.7s linear infinite;
}
#listSCT .linkBlock .name a {
text-decoration: none;
}
#listSCT .linkBlock ul {
display: flex;
flex-wrap: wrap;
gap: 18px;
font-weight: 700;
font-size: 12px;
}
#listSCT .linkBlock li {
display: flex;
flex-wrap: wrap;
align-items: center;
}
#listSCT .linkBlock li::before {
content: '';
display: inline-block;
margin-right: 4px;
width: 22px;
height: 13px;
}
#listSCT .linkBlock .freshfish::before {
background: url("../img/icn_ff.svg") no-repeat center center;
background-size: contain;
}
#listSCT .linkBlock .sushi::before {
background: url("../img/icn_su.svg") no-repeat center center;
background-size: contain;
}
#listSCT .linkBlock .sidedish::before {
background: url("../img/icn_sd.svg") no-repeat center center;
background-size: contain;
}
#listSCT .linkBlock .diningroom::before {
background: url("../img/icn_dr.svg") no-repeat center center;
background-size: contain;
}
@media (min-width: 768px) {
	#listSCT.activeView {
	animation: sct_bottom_pc 0.7s ease forwards;
	}
	#listSCT .cont {
	margin: 0 auto;
	padding: 40px 0 100px 0;
	width: 960px;
	}
	#listSCT .sort {
	margin: 0 auto 100px auto;
	width: 702px;
	padding: 0;
	}
	#listSCT .area {
	margin-bottom: 100px;
	}
	#listSCT .area:last-child {
	margin-bottom: 0;
	}
	#listSCT .prefectures {
	border-bottom: solid 2px #fff;
	margin-bottom: 25px;
	padding-bottom: 60px;
	}
	#listSCT .prefectures:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
	}
	#listSCT h2 {
	margin: 0 auto 27px auto;
	width: 300px;
	font-size: 24px;
	line-height: 60px;
	}
	#listSCT .hed {
	margin-bottom: 15px;
	font-size: 24px;
	}
	#listSCT .shop {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 40px;
	}
	#listSCT .linkBlock {
	box-sizing: border-box;
	background-color: #fff;
	border-radius: 15px;
	padding: 20px 30px;
	width: 460px;
	}
	#listSCT .linkBlock .name {
	margin-bottom: 10px;
	padding-bottom: 10px;
	font-size: 18px;
	}
	#listSCT .linkBlock .name::before {
	width: calc(100% - 40px);
	}
	#listSCT .linkBlock .name::after {
	bottom: -4px;
	width: 40px;
	height: 8px;
	}
	#listSCT .linkBlock .name a {
	text-decoration: none;
	}
	#listSCT .linkBlock ul {
	gap: 24px;
	font-size: 16px;
	}
	#listSCT .linkBlock li::before {
	margin-right: 5px;
	width: 29px;
	height: 17px;
	}
}

#detailSCT {
position: relative;
background-color: var(--color-sub3);
opacity: 0;
}
#detailSCT.activeView {
animation: sct_bottom_sp 0.7s ease forwards;
}
#detailSCT::before {
content: '';
display: block;
position: absolute;
left: 0;
bottom: calc(100% - 1px);
background: url("../../common/img/lin_wave.svg") no-repeat center center;
background-size: 100% auto;
width: 100%;
padding-top: 18.0433%;
}
#detailSCT .cont {
padding: 32px 20px 53px 20px;
}
#detailSCT .box {
background-color: #fff;
border-radius: 15px 15px 0 0;
padding: 20px 20px 22px 20px;
}
#detailSCT .box .title {
margin-bottom: 8px;
font-weight: 700;
font-size: 18px;
text-align: center;
}
#detailSCT .box ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 18px;
font-weight: 700;
font-size: 12px;
}
#detailSCT .box li {
display: flex;
flex-wrap: wrap;
align-items: center;
}
#detailSCT .box li::before {
content: '';
display: inline-block;
margin-right: 4px;
width: 22px;
height: 13px;
}
#detailSCT .box .freshfish::before {
background: url("../img/icn_ff.svg") no-repeat center center;
background-size: contain;
}
#detailSCT .box .sushi::before {
background: url("../img/icn_su.svg") no-repeat center center;
background-size: contain;
}
#detailSCT .box .sidedish::before {
background: url("../img/icn_sd.svg") no-repeat center center;
background-size: contain;
}
#detailSCT .box .diningroom::before {
background: url("../img/icn_dr.svg") no-repeat center center;
background-size: contain;
}
#detailSCT .box + p {
background-color: #fff;
padding: 0 20px 0 20px;
}
#detailSCT .wp-block-columns {
display: flex;
flex-wrap: wrap-reverse;
background-color: #fff;
}
#detailSCT .wp-block-column {
flex-basis: auto !important;
width: 100%;
}
#detailSCT .wp-block-columns img {
display: block;
margin: 0 auto;
width: 220px;
}
#detailSCT .wp-block-columns p {
padding: 8px 20px 3px 20px;
font-weight: 500;
font-size: 13px;
line-height: 1.85;
}
#detailSCT .shop_info {
background-color: #fff;
border-radius: 0 0 15px 15px;
margin-bottom: 40px;
padding: 20px 20px 15px 20px;
}
#detailSCT .shop_info table {
font-weight: 500;
font-size: 13px;
line-height: 1.85;
}
#detailSCT .shop_info th {
border-top: solid 1px var(--color-main);
padding: 15px 0;
width: 5em;
font-weight: 700;
text-align: left;
}
#detailSCT .shop_info td {
border-top: solid 1px var(--color-main);
padding: 15px 0;
}
#detailSCT .shop_info td a {
display: inline-block;
background-color: var(--color-sub2);
border-radius: 9999px;
margin-top: 7px;
padding: 0 10px;
text-decoration: none;
}
#detailSCT .wp-block-heading {
font-weight: 700;
font-size: 18px;
text-align: center;
}
#detailSCT iframe {
width: 100%;
height: 300px;
}
@media (min-width: 768px) {
	#detailSCT.activeView {
	animation: sct_bottom_pc 0.7s ease forwards;
	}
	#detailSCT .cont {
	margin: 0 auto;
	padding: 30px 0 100px 0;
	width: 960px;
	}
	#detailSCT .box {
	border-radius: 30px 30px 0 0;
	padding: 80px 80px 60px 80px;
	}
	#detailSCT .box .title {
	margin-bottom: 8px;
	font-size: 28px;
	}
	#detailSCT .box ul {
	gap: 24px;
	font-size: 16px;
	}
	#detailSCT .box li::before {
	margin-right: 5px;
	width: 29px;
	height: 17px;
	}
	#detailSCT .box + p {
	padding: 0 80px 0 80px;
	}
	#detailSCT .wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	padding: 0 80px;
	}
	#detailSCT .wp-block-column:nth-of-type(1) {
	flex: 1;
	width: auto;
	}
	#detailSCT .wp-block-column:nth-of-type(2) {
	width: 260px;
	}
	#detailSCT .wp-block-columns img {
	margin: 0;
	}
	#detailSCT .wp-block-columns p {
	padding: 0;
	width: 530px;
	font-size: 16px;
	line-height: 1.87;
	}
	#detailSCT .shop_info {
	border-radius: 0 0 30px 30px;
	margin-bottom: 65px;
	padding: 27px 80px 45px 80px;
	}
	#detailSCT .shop_info table {
	width: 100%;
	font-size: 16px;
	line-height: 1.87;
	}
	#detailSCT .shop_info th {
	border-top: solid 2px var(--color-main);
	padding: 22px 0;
	width: 260px;
	}
	#detailSCT .shop_info td {
	border-top: solid 2px var(--color-main);
	padding: 22px 0;
	}
	#detailSCT .shop_info td a {
	padding: 0 23px;
	}
	#detailSCT .wp-block-heading {
	margin-bottom: 5px;
	font-size: 28px;
	}
	#detailSCT iframe {
	width: 100%;
	height: 390px;
	}
}