@charset "utf-8";

/* ------------------------------
 製品詳細（PC）
------------------------------ */
.lead {
	margin-bottom: 40px !important;
	color: #ea2424;
	font-size: 2.2rem;
	line-height: 1.4;
	font-weight: bold;
	text-align: center;
}
/* スライド */
.productList {
	overflow: visible;
}
.productList ul {
	border: 1px solid #bdccd4;
	border-radius: 8px;
}
.productList ul.slick-initialized {
	display: block; /* slick-initializedが付与されたら表示 */
}
.productList li {
	display: flex !important;
	justify-content: center;
	align-items: center;
	padding: 9px;
	border-radius: 8px;
	background-color: #fff;
	text-align: center;
}
.productList .slick-slider img {
	margin: 0;
}
/* slick Arrows */
.productList .slick-prev,
.productList .slick-next {
	position: absolute;
	top: 50%;
	width: 34px;
	height: 63px;
	margin-top: -31px;
	z-index: 10;
	background-size: cover;
}
.productList .slick-prev {
    left: -60px;
}
[dir='rtl'] .productList .slick-prev {
    right: -60px;
}
.productList .slick-next {
    right: -60px;
}
[dir='rtl'] .productList .slick-next {
    left: -60px;
}
/* Dots */
.productList .slick-dots {
	position: absolute;
	bottom: -30px;
	border: none;
}
.productList .slick-dots li {
	border-radius: 0;
	-ms-border-radius: 0;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	padding: 0;
	background: #ccc;
	min-height: 1px;
	display: inline-block !important;
	border-radius: 5px;
}
.productList .slick-dots li button {
	width: 10px;
	height: 10px;
	padding: 0;
	border-radius: 6px;
}
.productList .slick-dots li button::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 10px;
	height: 10px;
	border-radius: 5px;
}
.productList .slick-dots li.slick-active button::before {
	border-radius: 0;
	-ms-border-radius: 0;
	background: #ea2424;
	border-radius: 5px;
}
/* アイコンと価格 */
.detail .gray-border {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px dotted #bdccd4;
}
.detail .icon-block ul {
	display: flex;
	column-gap: 6px;
}
.detail .price-block {
	text-align: right;
	line-height: 1.2;
}
.detail .price-block p {
	display: inline-block;
}
.detail dl {
	font-size: 1.6rem;
	display: flex;
	flex-flow: row wrap;
}
.detail dt {
	position: relative;
	margin-bottom: 5px;
	padding-left: 1em;
	font-weight: bold;
}
.detail dt:before {
	content: "";
	position: absolute;
	top: .5em;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #f33436;
}
/* お見積り・お問合せ */
.contactBox {
	border-bottom: solid 1px #000;
}
.contactBox h2 {
	margin-bottom: 20px;
}
.telno {
	font-family: "Arial", "Noto Sans Japanese", "メイリオ", Meiryo, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", Arial, sans-serif;
}
.telno .f20 {
	font-weight: bold;
}
.telno a {
	color: #000;
	text-decoration: none;
}
.telno strong {
	font-size: 4rem;
}
.contactBox {
	position: relative;
	overflow: visible;
}
.contactBox .character {
	position: absolute;
	top: 30px;
	right: 0;
	width: 160px;
}
.contactBox .form_guide {
	width: 82%;
}
@media print, screen and (min-width: 768px) {
	/* アイコンと価格 */
	.detail .gray-border {
		display: flex;
		align-items: center;
	}
	.detail .icon-block {
		width: 70%;
	}
	.detail .icon-block ul li {
		width: 52px;
	}
	.detail .price-block {
		width: 30%;
	}
	.detail dt {
		width: 200px;
	}
	.detail dd {
		width: calc(100% - 200px);
	}
	/* カラーバリエーション */
	.cv-bottle img {
		width: 668px;
		height: auto;
	}
	.cv-tumbler img {
		width: 340px;
		height: auto;
	}
	.cv-mug img {
		width: 757px;
		height: auto;
	}
	.cv-jar img {
		width: 500px;
		height: auto;
	}
}
/* ------------------------------
 製品詳細（SP）
------------------------------ */
@media screen and (max-width: 767px) {
}
@media screen and (max-width: 767px) {
	.lead {
		font-size: 1.8rem;
		text-align: left;
		margin-bottom: 20px !important;
	}
	.lead br {
		display: none;
	}
	/* スライド */
	.productList li {
		padding: 10px;
	}
	.productList .slick-slider img {
		width: 100%;
	}
	/* slick Arrows */
	.productList .slick-prev,
	.productList .slick-next {
		width: 23px;
		height: 42px;
		margin-top: -21px;
	}
	.productList .slick-prev {
		left: -11%;
	}
	[dir='rtl'] .productList .slick-prev {
		right: -11%;
	}
	.productList .slick-next {
		right: -11%;
	}
	[dir='rtl'] .productList .slick-next {
		left: -11%;
	}
	/* Dots */
	.productList .slick-dots {
		bottom: -20px;
	}
	.productList .slick-dots li {
		width: 10px;
	}
	.productList .slick-dots li button {
		width: 10px;
	}
	.productList .slick-dots li button:before {
		width: 10px;
	}
	/* アイコンと価格 */
	.detail {
		margin-top: 50px;
	}
	.detail .icon-block ul li {
		width: calc(calc(100% - 24px) / 5);
		margin-bottom: 20px;
	}
	.detail dt {
		width: 60%;
	}
	.detail dd {
		width: 40%;
	}
	/* お見積り・お問合せ */
	.telno strong {
		font-size: 2.6rem;
	}
	.contactBox .character {
		position: static;
		width: 100%;
		margin-top: 0;
		text-align: right;
	}
	.contactBox .character img {
		width: 160px;
		height: auto;
	}
	.contactBox .form_guide {
		width: 100%;
	}
}