/* ==================== #jc-column.winter/@vars.css ==================== */

#jc-column.winter {

	--color-area1: #f76666;
	--color-area2: #c071d9;
	--color-area3: #5db324;
	--color-area4: #3485c7;
	--color-area5: #2f5597;
	--color-area6: #d13e3e;
	--color-area7: #e39400;

	--border-color-area1: rgba(247,102,102,0.25);
	--border-color-area2: rgba(192,113,217,0.25);
	--border-color-area3: rgba(93,179,36,0.25);
	--border-color-area4: rgba(52,133,199,0.25);
	--border-color-area5: rgba(47,85,151,0.25);
	--border-color-area6: rgba(209,62,62,0.25);
	--border-color-area7: rgba(227,148,0,0.25);

	--bg-color-area1: rgba(247,102,102,0.15);
	--bg-color-area2: rgba(192,113,217,0.15);
	--bg-color-area3: rgba(93,179,36,0.15);
	--bg-color-area4: rgba(52,133,199,0.15);
	--bg-color-area5: rgba(47,85,151,0.15);
	--bg-color-area6: rgba(209,62,62,0.15);
	--bg-color-area7: rgba(227,148,0,0.15);

	--border-area1: linear-gradient(to right, var(--border-color-area1) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area2: linear-gradient(to right, var(--border-color-area2) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area3: linear-gradient(to right, var(--border-color-area3) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area4: linear-gradient(to right, var(--border-color-area4) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area5: linear-gradient(to right, var(--border-color-area5) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area6: linear-gradient(to right, var(--border-color-area6) 50%, white 50%) repeat-x left top / 0.4em 0.1em;
	--border-area7: linear-gradient(to right, var(--border-color-area7) 50%, white 50%) repeat-x left top / 0.4em 0.1em;

}



/* ==================== #jc-column.winter/area-list.css ==================== */

#jc-column.winter .area-list h3 {
	display: flex;
	align-items: center;
	height: 2.5em;
	border-radius: 0.25em;
	padding: 0 1em;
	color: white;
}
#jc-column.winter .area-list h3::before {
	content: '';
	display: block;
	width: 1em;
	aspect-ratio: 1;
	border-radius: 50%;
	margin-right: 0.25em;
	background: rgba(255,255,255,0.5);
}

#jc-column.winter .area-list .area1 h3 { background: var(--color-area1); }
#jc-column.winter .area-list .area2 h3 { background: var(--color-area2); }
#jc-column.winter .area-list .area3 h3 { background: var(--color-area3); }
#jc-column.winter .area-list .area4 h3 { background: var(--color-area4); }
#jc-column.winter .area-list .area5 h3 { background: var(--color-area5); }
#jc-column.winter .area-list .area6 h3 { background: var(--color-area6); }
#jc-column.winter .area-list .area7 h3 { background: var(--color-area7); }


@media (min-width: 641px) {
	#jc-column.winter .area-list h3 {
		font-size: 90%;
	}
}



/* ==================== #jc-column.winter/#cuisines/@.css ==================== */

#jc-column.winter #cuisines {
	display: grid;
	grid-gap: 2em;
}



/* ==================== #jc-column.winter/#cuisines/area/<ul>.css ==================== */

#jc-column.winter #cuisines .area ul {
	display: grid;
	grid-gap: 1.5em;
}

#jc-column.winter #cuisines .area ul {
	padding: 0;
	list-style-type: none;
}

#jc-column.winter #cuisines .area ul li {
	display: grid;
}

#jc-column.winter #cuisines .area.area1 ul h4 { color: var(--color-area1); }
#jc-column.winter #cuisines .area.area2 ul h4 { color: var(--color-area2); }
#jc-column.winter #cuisines .area.area3 ul h4 { color: var(--color-area3); }
#jc-column.winter #cuisines .area.area4 ul h4 { color: var(--color-area4); }
#jc-column.winter #cuisines .area.area5 ul h4 { color: var(--color-area5); }
#jc-column.winter #cuisines .area.area6 ul h4 { color: var(--color-area6); }
#jc-column.winter #cuisines .area.area7 ul h4 { color: var(--color-area7); }

#jc-column.winter #cuisines .area ul h4 small {
	font-size: 75%;
	font-weight: normal;
}

#jc-column.winter #cuisines .area ul .zouni-link {
	display: grid;
	justify-items: center;
	grid-row-gap: 0.5em;
	text-decoration: none;
}

#jc-column.winter #cuisines .area ul .zouni-link span {
	font-size: 75%;
	color: #0079e3;
}

#jc-column.winter #cuisines .area ul .zouni-link span::before,
#jc-column.winter #cuisines .area ul .zouni-link span::after {
	display: inline-block;
	vertical-align: middle;
	vertical-align: bottom;
	content: '';
	width: 1px;
	height: 1.2em;
	margin: 0 0.5em;
	background: #0079e3;
}

#jc-column.winter #cuisines .area ul .zouni-link span::before {
	transform: rotate(-25deg);
}
#jc-column.winter #cuisines .area ul .zouni-link span::after {
	transform: rotate(25deg);
}

#jc-column.winter #cuisines .area ul .zouni-link img {
	width: 18em;
}


@media (max-width: 640px) {

	#jc-column.winter #cuisines .area ul li {
		justify-items: center;
		grid-gap: 1em;
	}
	#jc-column.winter #cuisines .area ul li:nth-of-type(n+2) {
		padding-top: 1.5em;
	}

	#jc-column.winter #cuisines .area.area1 ul li:nth-of-type(n+2) { background: var(--border-area1); }
	#jc-column.winter #cuisines .area.area2 ul li:nth-of-type(n+2) { background: var(--border-area2); }
	#jc-column.winter #cuisines .area.area3 ul li:nth-of-type(n+2) { background: var(--border-area3); }
	#jc-column.winter #cuisines .area.area4 ul li:nth-of-type(n+2) { background: var(--border-area4); }
	#jc-column.winter #cuisines .area.area5 ul li:nth-of-type(n+2) { background: var(--border-area5); }
	#jc-column.winter #cuisines .area.area6 ul li:nth-of-type(n+2) { background: var(--border-area6); }
	#jc-column.winter #cuisines .area.area7 ul li:nth-of-type(n+2) { background: var(--border-area7); }

	#jc-column.winter #cuisines .area ul h4 {
		font-size: 110%;
		text-align: center;
	}

	#jc-column.winter #cuisines .area ul h4 small {
		display: inline-block;
	}

	#jc-column.winter #cuisines .area ul figure {
		width: 14em;
	}

}


@media (min-width: 641px) {

	#jc-column.winter #cuisines .area ul li {
		grid-template-columns: repeat(2, auto);
		grid-gap: 0.5em 1.5em;
		align-items: center;
		width: 37em;
	}

	#jc-column.winter #cuisines .area ul li:nth-of-type(odd) {
		grid-template-areas:
		'figure h4'
		'figure p';
	}

	#jc-column.winter #cuisines .area ul li:nth-of-type(even) {
		grid-template-areas:
		'h4 figure'
		'p figure';
		margin-left: auto;
	}

	#jc-column.winter #cuisines .area ul li h4 { grid-area: h4; align-self: end; }
	#jc-column.winter #cuisines .area ul li figure { grid-area: figure; align-self: center; }
	#jc-column.winter #cuisines .area ul li p { grid-area: p; align-self: start; }

	#jc-column.winter #cuisines .area ul li figure {
		width: 12em;
	}

	#jc-column.winter #cuisines .area ul .zouni-link {
		grid-row: 3;
		grid-column: 2;
	}

}



/* ==================== #jc-column.winter/#cuisines/area/@.css ==================== */

#jc-column.winter #cuisines .area {
	display: grid;
	grid-gap: 1.5em;
}



/* ==================== #jc-column.winter/#foods/@.css ==================== */

#jc-column.winter #foods {
	display: grid;
	grid-gap: 2em;
}



/* ==================== #jc-column.winter/#foods/area/@.css ==================== */

#jc-column.winter #foods .area {
	display: grid;
	grid-gap: 1.5em;
}



/* ==================== #jc-column.winter/#foods/area/category/@.css ==================== */

#jc-column.winter #foods .area .category {
	display: grid;
	grid-gap: 1.5em;
}

#jc-column.winter #foods .area .category.mountainfood {
	padding-top: 1.5em;
}

#jc-column.winter #foods .area.area1 .category.mountainfood { background: var(--border-area1); }
#jc-column.winter #foods .area.area2 .category.mountainfood { background: var(--border-area2); }
#jc-column.winter #foods .area.area3 .category.mountainfood { background: var(--border-area3); }
#jc-column.winter #foods .area.area4 .category.mountainfood { background: var(--border-area4); }
#jc-column.winter #foods .area.area5 .category.mountainfood { background: var(--border-area5); }
#jc-column.winter #foods .area.area6 .category.mountainfood { background: var(--border-area6); }
#jc-column.winter #foods .area.area7 .category.mountainfood { background: var(--border-area7); }




@media (max-width: 640px) {

	#jc-column.winter #foods .area .category h4 {
		justify-self: center;
	}

	#jc-column.winter #foods .area .category h4 img {
		width: 6em;
	}

}


@media (min-width: 641px) {

	#jc-column.winter #foods .area .category {
		grid-template-columns: max-content 1fr;
	}

	#jc-column.winter #foods .area .category h4 img {
		width: 5em;
	}

}



/* ==================== #jc-column.winter/#foods/area/category/items/@.css ==================== */

#jc-column.winter #foods .area .category .items {
	display: grid;
	grid-gap: 1.5em;
}



/* ==================== #jc-column.winter/#foods/area/category/items/item/<h5>.css ==================== */

#jc-column.winter #foods .area .category .items .item h5 {
	text-indent: -1.1em;
	margin-left: 1.1em;
	line-height: 1.3;
}

#jc-column.winter #foods .area.area1 .category .items .item h5 { color: var(--color-area1); }
#jc-column.winter #foods .area.area2 .category .items .item h5 { color: var(--color-area2); }
#jc-column.winter #foods .area.area3 .category .items .item h5 { color: var(--color-area3); }
#jc-column.winter #foods .area.area4 .category .items .item h5 { color: var(--color-area4); }
#jc-column.winter #foods .area.area5 .category .items .item h5 { color: var(--color-area5); }
#jc-column.winter #foods .area.area6 .category .items .item h5 { color: var(--color-area6); }
#jc-column.winter #foods .area.area7 .category .items .item h5 { color: var(--color-area7); }

#jc-column.winter #foods .area .category .items .item h5::before {
	content: '●';
	padding-right: 0.1em;
}

#jc-column.winter #foods .area .category .items .item h5 small {
	font-weight: normal;
	font-size: 75%;
}


@media (max-width: 640px) {
	#jc-column.winter #foods .area .category .items .item h5 {
		font-size: 110%;
	}
}


@media (min-width: 641px) {
	#jc-column.winter #foods .area .category .items .item h5 {
		font-size: 80%;
	}
}



/* ==================== #jc-column.winter/#foods/area/category/items/item/@.css ==================== */

#jc-column.winter #foods .area .category .items .item {
	display: grid;
}


@media (max-width: 640px) {

	#jc-column.winter #foods .area .category .items .item {
		grid-gap: 1em;
		justify-items: center;
	}

}


@media (min-width: 641px) {

	#jc-column.winter #foods .area .category .items .item {
		grid-gap: 0.5em 1.5em;
		grid-template-columns: 1fr auto;
		grid-template-rows: auto 1fr;
		grid-template-areas:
		'h5 figure'
		'p figure';
	}

	#jc-column.winter #foods .area .category .items .item .ranking,
	#jc-column.winter #foods .area .category .items .item .recipes {
		grid-column: span 2;
	}


	#jc-column.winter #foods .area .category .items .item figure {
		width: 15em;
	}

	#jc-column.winter #foods .area .category .items .item h5 {grid-area: h5; }
	#jc-column.winter #foods .area .category .items .item figure {grid-area: figure; }
	#jc-column.winter #foods .area .category .items .item p {grid-area: p; }

}



/* ==================== #jc-column.winter/#foods/area/category/items/ranking/@.css ==================== */

#jc-column.winter #foods .area .category .items .ranking {
	display: grid;
	grid-gap: 0.5em;
}


@media (min-width: 641px) {
	#jc-column.winter #foods .area .category .items .ranking {
		justify-self: center;
	}
}



/* ==================== #jc-column.winter/#foods/area/category/items/ranking/list.css ==================== */

#jc-column.winter #foods .area .category .items .ranking .list {
	display: grid;
	border: 1px solid;
	border-radius: 0.5em;
}

#jc-column.winter #foods .area.area1 .category .items .ranking .list { border-color: var(--border-color-area1); }
#jc-column.winter #foods .area.area2 .category .items .ranking .list { border-color: var(--border-color-area2); }
#jc-column.winter #foods .area.area3 .category .items .ranking .list { border-color: var(--border-color-area3); }
#jc-column.winter #foods .area.area4 .category .items .ranking .list { border-color: var(--border-color-area4); }
#jc-column.winter #foods .area.area5 .category .items .ranking .list { border-color: var(--border-color-area5); }
#jc-column.winter #foods .area.area6 .category .items .ranking .list { border-color: var(--border-color-area6); }
#jc-column.winter #foods .area.area7 .category .items .ranking .list { border-color: var(--border-color-area7); }

#jc-column.winter #foods .area .category .items .ranking .list > div {
	display: grid;
}

#jc-column.winter #foods .area .category .items .ranking .list > div:nth-of-type(n+2) {
	border-top: 1px solid;
}

#jc-column.winter #foods .area.area1 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area1); }
#jc-column.winter #foods .area.area2 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area2); }
#jc-column.winter #foods .area.area3 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area3); }
#jc-column.winter #foods .area.area4 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area4); }
#jc-column.winter #foods .area.area5 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area5); }
#jc-column.winter #foods .area.area6 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area6); }
#jc-column.winter #foods .area.area7 .category .items .ranking .list > div:nth-of-type(n+2) { border-color: var(--border-color-area7); }


#jc-column.winter #foods .area .category .items .ranking .list h6 {
	font-weight: normal;
}
#jc-column.winter #foods .area .category .items .ranking .list h6 small {
	font-size: 70%;
}

#jc-column.winter #foods .area.area1 .category .items .ranking .list h6 { color: var(--color-area1); }
#jc-column.winter #foods .area.area2 .category .items .ranking .list h6 { color: var(--color-area2); }
#jc-column.winter #foods .area.area3 .category .items .ranking .list h6 { color: var(--color-area3); }
#jc-column.winter #foods .area.area4 .category .items .ranking .list h6 { color: var(--color-area4); }
#jc-column.winter #foods .area.area5 .category .items .ranking .list h6 { color: var(--color-area5); }
#jc-column.winter #foods .area.area6 .category .items .ranking .list h6 { color: var(--color-area6); }
#jc-column.winter #foods .area.area7 .category .items .ranking .list h6 { color: var(--color-area7); }


#jc-column.winter #foods .area .category .items .ranking .list dl {
	display: grid;
	align-items: center;
}

#jc-column.winter #foods .area .category .items .ranking .list dt {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 2em;
	border-radius: 1em;
	font-size: 95%;
}

#jc-column.winter #foods .area .category .items .ranking .list dt:nth-of-type(1) {
	color: white;
	font-weight: bold;
}

#jc-column.winter #foods .area.area1 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area1); }
#jc-column.winter #foods .area.area2 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area2); }
#jc-column.winter #foods .area.area3 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area3); }
#jc-column.winter #foods .area.area4 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area4); }
#jc-column.winter #foods .area.area5 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area5); }
#jc-column.winter #foods .area.area6 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area6); }
#jc-column.winter #foods .area.area7 .category .items .ranking .list dt:nth-of-type(1) { background-color: var(--color-area7); }

#jc-column.winter #foods .area.area1 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area1); background-color: var(--bg-color-area1); }
#jc-column.winter #foods .area.area2 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area2); background-color: var(--bg-color-area2); }
#jc-column.winter #foods .area.area3 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area3); background-color: var(--bg-color-area3); }
#jc-column.winter #foods .area.area4 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area4); background-color: var(--bg-color-area4); }
#jc-column.winter #foods .area.area5 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area5); background-color: var(--bg-color-area5); }
#jc-column.winter #foods .area.area6 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area6); background-color: var(--bg-color-area6); }
#jc-column.winter #foods .area.area7 .category .items .ranking .list dt:nth-of-type(n+2) { color: var(--color-area7); background-color: var(--bg-color-area7); }

#jc-column.winter #foods .area .category .items .ranking .list dd:nth-of-type(1) {
	font-size: 115%;
	font-weight: bold;
}

#jc-column.winter #foods .area .category .items .ranking .list dd span {
	font-size: 80%;
}


@media (max-width: 640px) {

	#jc-column.winter #foods .area .category .items .ranking .list {
		grid-gap: 0.75em;
		padding: 0.75em 1.5em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list > div {
		grid-gap: 0.5em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list > div:nth-of-type(n+2) {
		padding-top: 0.75em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list h6 {
		font-size: 90%;
		text-align: center;
	}

	#jc-column.winter #foods .area .category .items .ranking .list dl {
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 0.75em 1.5em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list dt {
		grid-row: 1;
	}

	#jc-column.winter #foods .area .category .items .ranking .list dd {
		text-align: center;
	}
	#jc-column.winter #foods .area .category .items .ranking .list dd span {
		display: inline-block;
	}

}


@media (min-width: 641px) {

	#jc-column.winter #foods .area .category .items .ranking .list {
		grid-gap: 0.5em;
		padding: 0.5em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list > div {
		align-items: center;
		grid-gap: 0.5em;
		grid-template-columns: 1fr auto;
	}

	#jc-column.winter #foods .area .category .items .ranking .list > div:nth-of-type(n+2) {
		padding-top: 0.5em;
	}

	#jc-column.winter #foods .area .category .items .ranking .list h6 {
		font-size: 70%;
	}

	#jc-column.winter #foods .area .category .items .ranking .list dl {
		grid-template-columns: 3.5em minmax(4.5em, auto) 3em minmax(4.5em, auto) 3em minmax(4.5em, auto);
		grid-gap: 0.5em;
	}

}



/* ==================== #jc-column.winter/#foods/area/category/items/ranking/notes.css ==================== */

#jc-column.winter #foods .area .category .items .ranking .notes {
	color: var(--color-gray);
}


@media (min-width: 641px) {

	#jc-column.winter #foods .area .category .items .ranking .notes p {
		font-size: 60%;
	}

}



/* ==================== #jc-column.winter/#foods/area/category/items/recipes/@.css ==================== */

#jc-column.winter #foods .area .category .items .recipes {
	display: grid;
	grid-gap: 1em;
}


@media (min-width: 641px) {

	#jc-column.winter #foods .area .category .items .recipes {
		justify-self: center;
	}

}



/* ==================== #jc-column.winter/#pagelink/<ul>.css ==================== */

#jc-column.winter #pagelink ul {
	display: grid;
	grid-gap: 1em;
	width: max-content;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
}

#jc-column.winter #pagelink ul li {
	font-weight: bold;
	color: var(--color-winter);
}

#jc-column.winter #pagelink ul a {
	display: grid;
	grid-gap: 0.5em;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	border: 1.5px solid #d7d8f3;
	border-radius: 0.5em;
	padding-left: 1em;
	background: #efeffa;
	color: inherit;
	line-height: 1.3;
	text-decoration: none;
}
#jc-column.winter #pagelink ul a:hover {
	text-decoration: underline;
}
#jc-column.winter #pagelink ul a::before {
	content: '';
	display: block;
	width: 1em;
	aspect-ratio: 1/1;
	background: url(../images/pagelink_icon.svg) no-repeat center center / contain;
}

#jc-column.winter #pagelink ul a::after {
	content: '';
	display: block;
	width: 4.5em;
	aspect-ratio: 90/74;
	margin-left: auto;
	background: no-repeat center center / contain;
}

#jc-column.winter #pagelink ul li:nth-of-type(1) a::after { background-image: url(../images/pagelink_image_1.png); }
#jc-column.winter #pagelink ul li:nth-of-type(2) a::after { background-image: url(../images/pagelink_image_2.png); }

#jc-column.winter #pagelink ul a > span {
	display: grid;
	font-size: 75%;
}


@media (max-width: 640px) {

	#jc-column.winter #pagelink ul {
		font-size: 125%;
	}

}


@media (min-width: 641px) {
	#jc-column.winter #pagelink ul {
		grid-template-columns: repeat(2, 1fr);
	}
}



/* ==================== #jc-column.winter/#pagelink/@.css ==================== */