@charset "utf-8";

/* =========================
  Base
========================= */
#itemlist {
	padding: 0 1.5vw;
}

#itemlist .intro {
	padding: 0 1vw 2.5vw;
}

#itemlist .txt-set p {
	padding: 0 0 4vw;
	line-height: 1.7;
}

#itemlist h2 {
	border: 0;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #fff;
	margin: 0 0 4.5vw;
	border-radius: 1vw;
	padding: 1.5vw 0;
	font-size: 6vw;
	background: #745536;
}

/* =========================
  Link sets（共通化）
========================= */
#itemlist .link-set,
#itemlist .link-set2 {
	overflow: hidden;
}

#itemlist .link-set ul,
#itemlist .link-set2 ul {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 0 0 2.5vw;
	justify-content: space-between;
}

#itemlist .link-set ul li,
#itemlist .link-set2 ul li {
	width: 47%;
	padding: 0 0 5vw;
}

#itemlist .link-set ul li a,
#itemlist .link-set2 ul li a {
	width: 100%;
	display: block;
	padding: 2vw 6vw 2vw 2vw;
	text-decoration: none;
	border-radius: .5vw;
	border: 1px solid #c5a437;
	background-repeat: no-repeat;
	background-position: 93% 47.5%;
	background-size: 2.5vw auto;
}

#itemlist .link-set ul li a {
	font-weight: bold;
	font-size: 5vw;
	color: #c5a437;
	background-image: url("../../images/contents/common/icon-arr-under.png");
}

#itemlist .link-set2 ul li a {
	background-image: url("https://ktora.itembox.design/item/images/k-index-device/icon-arr-yosan-btn.png");
}

/* =========================
  itemlist-sp headings
========================= */
#itemlist .itemlist-sp h3 {
	border: 0;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #745536;
	margin: 0 0 2vw;
	padding: 0;
	font-size: 7.8vw;
}

#itemlist .itemlist-sp h3 span {
	color: #c5a437;
	font-weight: bold;
}

#itemlist .itemlist-sp .select1 {
	padding: 0 0 7vw;
}

#itemlist .itemlist-sp .select1 h2 {
	padding: 0 0 5vw;
}

#itemlist .itemlist-sp .select1 .s-title {
	margin: 0 0 5px;
	color: #745536;
	font-size: 5vw;
	font-weight: bold;
	background: url("../../images/contents/common-device/icon-tora1.png") no-repeat 0 50% / 10%;
}

#itemlist .itemlist-sp .select1 .s-title span {
	padding: 1vw 0 1vw 11vw;
	display: block;
}

/* =========================
  Open/Close（タップで開閉）
========================= */
#itemlist .itemlist-sp .select1 section {
	border-bottom: 1px solid #fff;
}

/* 見出しボタン */
#itemlist .itemlist-sp .select1 .btn-open-close {
	font-weight: bold;
	color: #fff;
}

#itemlist .itemlist-sp .select1 .btn-open-close .btn-open-close-box {
	padding: 2.75vw 3.7vw;
	background: url("https://ktora.itembox.design/item/images/k-index-device/icon-arr-itemlist-down.png") no-repeat 95% 50% / 3.6vw auto;
}

/* active時の矢印 */
#itemlist .itemlist-sp .select1 section.active .btn-open-close .btn-open-close-box {
	background-image: url("https://ktora.itembox.design/item/images/k-index-device/icon-arr-itemlist-up.png");
}

#itemlist .itemlist-sp .select1 .btn-open-close .value-yen {
	font-size: 4.8vw;
}

#itemlist .itemlist-sp .select1 .btn-open-close .mark-yen {
	font-size: 4.2vw;
}

/* 閉じた状態（activeなし） */
#itemlist .itemlist-sp .select1 .select1-box {
	height: 0;
	overflow: hidden;
	border: 0;
}

/* 開いた状態（activeあり） */
#itemlist .itemlist-sp .select1 section.active .select1-box {
	height: auto;
	overflow: visible;
	border: 1vw solid var(--c);
}

/* =========================
  h4 / text
========================= */
#itemlist .itemlist-sp .select1 h4 {
	padding: 6vw 0 2vw;
}

#itemlist .itemlist-sp .select1 h4 .item-name {
	display: block;
	padding: 0 0 1vw;
	text-align: center;
	font-weight: bold;
	font-size: 5.6vw;
}

#itemlist .itemlist-sp .select1 h4 .item-txt {
	display: block;
	text-align: center;
	letter-spacing: -0.1vw;
	font-size: 3.6vw;
}

/* =========================
  Item blocks（色差分：sectionに変数を付与）
  ※HTMLが <article><section class="select1-1">… の形でも確実に当たる
========================= */
#itemlist .itemlist-sp .select1 section.select1-1 {
	--c: #7ebcd9;
}

#itemlist .itemlist-sp .select1 section.select1-2 {
	--c: #e79bcb;
}

#itemlist .itemlist-sp .select1 section.select1-3 {
	--c: #7dcc75;
}

#itemlist .itemlist-sp .select1 section.select1-4 {
	--c: #9e96cf;
}

#itemlist .itemlist-sp .select1 section.select1-5 {
	--c: #d14c89;
}

#itemlist .itemlist-sp .select1 section.select1-6 {
	--c: #c1a073;
}

/* 色の適用 */
#itemlist .itemlist-sp .select1 section[class*="select1-"] .btn-open-close {
	background: var(--c);
}

/* h4文字色 */
#itemlist .itemlist-sp .select1 section[class*="select1-"] h4 .item-name,
#itemlist .itemlist-sp .select1 section[class*="select1-"] h4 .item-txt {
	color: var(--c);
}

/* active背景（画像だけ差分があるので最低限残す） */
#itemlist .itemlist-sp .select1 section.select1-1.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-blue.png") repeat 0 0 / 5px auto;
}

#itemlist .itemlist-sp .select1 section.select1-2.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-pink1.png") repeat 0 0 / 5px auto;
}

#itemlist .itemlist-sp .select1 section.select1-3.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-green.png") repeat 0 0 / 5px auto;
}

#itemlist .itemlist-sp .select1 section.select1-4.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-purple.png") repeat 0 0 / 5px auto;
}

#itemlist .itemlist-sp .select1 section.select1-5.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-pink2.png") repeat 0 0 / 5px auto;
}

#itemlist .itemlist-sp .select1 section.select1-6.active .btn-open-close {
	background: var(--c) url("https://ktora.itembox.design/item/images/k-index-device/bg-yosan-brown.png") repeat 0 0 / 5px auto;
}

/* =========================
  Thumb / catch / buttons
========================= */
#itemlist .itemlist-sp .select1 a {
	display: block;
	padding: 3vw;
}

#itemlist .itemlist-sp .select1 .thumb img {
	display: block;
	width: 45vw;
	margin: 0 auto 3vw;
}

#itemlist .itemlist-sp .select1 .item-catch {
	display: block;
	width: 67.5vw;
	margin: 0 auto 4vw;
	line-height: 1.7;
	font-weight: bold;
}

/* ボタン */
#itemlist .itemlist-sp .select1 .item-btn,
#itemlist .item-btn2 {
	padding: 0 0 7vw;
}

#itemlist .itemlist-sp .select1 .item-btn a,
#itemlist .item-btn2 a {
	display: table;
	width: calc(83vw - 6vw - 9vw);
	margin: 0 auto;
	padding: 2vw 9vw 2vw 6vw;
	border-radius: .5vw;
	border: .25vw solid #c5a437;
	letter-spacing: -0.2vw;
	font-weight: bold;
	color: #c5a437;
	background: url("https://ktora.itembox.design/item/images/k-index-device/icon-arr-yosan-btn.png") no-repeat 93% 47.5% / 3vw auto;
}

/* =========================
  Slider arrows
========================= */
#itemlist .itemlist-sp .select1-slider .control {
	width: 100%;
	margin: 0;
	position: relative;
	top: 4vw;
}

#itemlist .itemlist-sp .select1-slider .slick-prev,
#itemlist .itemlist-sp .select1-slider .slick-next {
	position: absolute;
	top: 50%;
	width: 10vw;
	height: 40vw;
	border: 0;
	opacity: 1;
	text-indent: -9999px;
	overflow: hidden;
	z-index: 2;
}

#itemlist .itemlist-sp .select1-slider .slick-prev {
	left: 0;
	background: url("https://ktora.itembox.design/item/images/k-index-device/btn-slider-prev.png") no-repeat 0 50% / 100% auto;
}

#itemlist .itemlist-sp .select1-slider .slick-next {
	right: 0;
	background: url("https://ktora.itembox.design/item/images/k-index-device/btn-slider-next.png") no-repeat 0 50% / 100% auto;
}

/* =========================
  Omakase
========================= */
#itemlist .omakase-inner {
	padding: 10vw 0 0;
}

#itemlist .omakase-btn {
	position: relative;
}

#itemlist .omakase-btn:before {
	content: url(https://ktora.itembox.design/item/images/contents/common-device/icon-tora2.png);
	position: absolute;
	top: -61px;
	left: 42%;
}

#itemlist .omakase-btn a {
	display: table;
	width: 100%;
	margin: 0 auto 5vw;
	padding: 2vw;
	text-decoration: none;
	border-radius: 3px;
	border: 2px solid #c5a437;
	font-size: 3.5vw;
	background: url(https://ktora.itembox.design/item/images/contents/common-device/icon-arr-right.png) no-repeat 96% 47.5% / 3%;
}

#itemlist .omakase-btn a span {
	color: #c5a437;
	font-size: 4vw;
	font-weight: bold;
}

/* =========================
  hikikae-panel
========================= */
#itemlist .hikikae-panel {
	padding: 0 0 10vw;
}

#itemlist .hikikae-panel h2 {
	margin: 0 0 5vw;
}

#itemlist .hikikae-panel .txt-catch {
	text-align: center;
	color: #745536;
	font-size: 4vw;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

#itemlist .hikikae-panel .txt-hikikae-panel {
	padding: 0 0 5vw;
}

#itemlist .hikikae-panel .hikikae-panel-wrapper {
	padding: 4vw 4vw 6vw;
	border: .4vw solid #d2d2d2;
}

#itemlist .hikikae-panel .hikikae-panel-wrapper .img {
	padding: 5vw 0;
}

#itemlist .hikikae-panel .hikikae-panel-wrapper .img img {
	display: block;
	width: 60vw;
	margin: 0 auto;
}

#itemlist .hikikae-panel .hikikae-panel-wrapper .txt p {
	line-height: 1.75;
}

#itemlist .hikikae-panel .hikikae-panel-wrapper h3 {
	margin: 0 0 3vw;
	text-align: center;
	font-size: 4.8vw;
	font-weight: bold;
	border-bottom: .2vw solid #745536;
	color: #745536;
}

/* =========================
  review
========================= */
#itemlist .review {
	padding: 8vw 3vw 5vw;
}

#itemlist .review h3 {
	border: 0;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin: 0 0 1.5vw;
	padding: .2vw 0;
	font-size: 4.8vw;
	font-weight: bold;
	color: #745536;
}

#itemlist .review ul li {
	margin: 0 0 3vw;
	padding: 4vw;
	border: 1px solid #d2d2d2;
}

#itemlist .review ul li h4 {
	border: 0;
	font-weight: bold;
	margin: 0 0 2vw;
	padding: 1vw 1.2vw;
	font-size: 4.8vw;
	color: #fff;
	background: #745536;
}

#itemlist .review ul li p {
	line-height: 1.8;
	font-size: 3.6vw;
}