@charset "utf-8";
/***************************************************
information
  filename : product_parts.css;
***************************************************/

/******* 商品パーツ設定 *******/

/* ** product_box start ** */
/*** 商品エリア(基本) ***/
:root {
/* 角丸基本設定 */
  --Prd-rod: 0.2em; /* 角丸 */
  --PrdBt-rod: 0.2em; /* 角丸 */
  --prdsearch-rod: 0.3rem; /* 角丸 */
}
/*** 購入商品点数アイコン表示 ***/

/* カートに入っている数量 */
.cartbtn {position:relative;}
span.PrdCntDisp {
	position:absolute;
	bottom: 20px;
	left: 5px;
	padding: 0.5rem 0.8rem;
	z-index: 100;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	font-size: clamp(1.2rem, 1.0vw, 1.2rem);
	font-weight: bold;
	color: #fff;
	background: #e60012;
	animation: flash 1s linear infinite;/* 点滅 */
}
@keyframes flash {0% {opacity: 1;}50% {opacity: 0.5;}100% {opacity: 1;}}/* 点滅キーフレーム */

/* 商品詳細・概要表示エリア */
.PrdDLBox,
.PrdFLBox,
.PrdULBox {width:100%;}
.PrdDLBox dl,
.PrdFLBox dl,
.PrdULBox dl {
	display: flex;
	margin: 0 auto;
	padding: 0;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
	border-bottom: var(--app-BgBox-Kbrd); /* 要素仕切り共通ボーダー指定 */
	align-items: center;
}
.PrdDLBox dt,
.PrdFLBox dt,
.PrdULBox dt {
	width: 25%;
	max-width: 120px;
	margin: 0;
	padding: 1.5rem;
	white-space:nowrap;
	font-weight: bold;
}
.PrdDLBox dd,
.PrdFLBox dd,
.PrdULBox dd {
	width: 75%;
	padding: 1.5rem 0 1.5rem 2.0rem;
}
/*** 商品詳細画面での商品名・概要個別設置 ***/

/* 商品詳細メインビジュアル */
.prdVisualArea {margin: 0 auto 2.0rem auto;padding: 0;text-align: center;}
.prdVisual {width: 100%;margin: 0 auto;padding: 0;text-align: center;}
.prdVisual img {width: 100%;margin: 0 auto;}

/* メインタイトル */
h1.prdTitle,
p.prdTitle {
	margin: 0 auto;
	padding: 0 0 1.0rem 0;
	text-align: left;
	color: #000;
	font-size: clamp(2.0rem, 2.0vw, 3.5rem);
	line-height: 1.2em;
	background: inhelit;
}
/* ディスクリプション個別設置 */
.prd_description .DetDescription {
	margin: 0 auto;
	padding: 0;
	font-size: clamp(1.6rem, 1.6vw, 1.8rem);
	color: #000;
	backgrdound: inhelit;
}
/* 販売価格個別設置 */
.prd_pay .prdPayArea {
	margin: 1.0rem auto;
	padding: 0;
	color: #000;
	backgrdound: inhelit;
}
.prd_pay dl.DetDlPay {
	display: flex;
	margin: 2.0rem auto;
	padding: 0;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
	align-items: flex-end;
}
.prd_pay dl.DetDlPay dt {
	width: 20%;
	max-width: 100px;
	margin: 0;
	white-space:nowrap;
}
.prd_pay dl.DetDlPay dd {
	width: 80%;
	padding: 0 0 0 0.5rem;
}
.prd_pay dl.DetDlPay dd span.kinagakuTxt {
	font-size: clamp(2.0rem, 1.8vw, 2.5rem);
	font-weight: bold;
	padding: 0 1.0rem 0 0;
}
.prd_pay dl.DetDlPay dd span.payfree {color: #005bc7;}

/*** 商品詳細画面での購入ボタンボックス ***/
.PrdBTBox {
	margin: 0 auto;
	padding: 0;
	font-weight: bold;
	color: #000;
	border: inhelit;
	backgrdound: inhelit;
}
.PrdBTFlex {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin: 0 auto;
	padding: 0;
	align-items: center;
}
.PrdBTFlex .PrdNumBox {width: 230px;}
.PrdBTFlex .prdOrdBt {width: 300px;}

/* 個数変更エリア */
.PrdNumBox {margin: 0;padding: 0;}
.PrdNumBoxInn {display: flex;align-items: center;}
.PrdNumBoxR {float: right;}
.PrdNumBox .PrdNumTi {
	padding: 0 0.2rem;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
}
.PrdNumBox .PrdNumTxt {
	padding: 0 1.0rem;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
}
.PrdNumBox .PrdNum {padding: 0;}
.PrdNumBox .PrdNumCtrBt {padding: 0;}
.PrdNumBox .PrdNumUpdBt {padding: 0 0.1em;}

@media screen and (max-width: 600px) {
	.PrdBTFlex .PrdNumBox {width: 100%;margin-bottom: 1.5rem;}
	.PrdBTFlex .PrdNumBox .PrdNumBoxInn {float: right;}
	.PrdBTFlex .prdOrdBt {width: 100%;}
}
/*** ボタン指定 ***/

/* 個数変更ボタン */
.BtM.PrdNumCtrBt button,
.PrdCartOpBt button {
	margin: 0 0.2rem;
	padding: 0.5rem 1.0rem;
	font-weight: bold;
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
}
/* 通常の購入ボタン */
.BtM .productOrdBt {
	margin: 0 1.0rem;
	padding: 1.0rem 0.5rem;
	width: 80%;
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
	color: #171717;
	background: #fff;
	border: 1px solid #666;
	box-shadow: none;
}
.BtM button.productOrdBt.next::after,
.BtM a.productOrdBt.next::after,
.BtM span.productOrdBt.next::after,
.BtM button.productOrdBt.back::after,
.BtM a.productOrdBt.back::after,
.BtM back.productOrdBt.next::after {border-left-color: #171717;}

/* キャンセル待ちでの購入ボタン */
.BtM .productCanBt {
	margin: 0 1.0rem;
	padding: 1.0rem 0.5rem;
	width: 80%;
	font-size: clamp(1.4rem, 1.2vw, 1.6rem);
	color: #fff;
	background: #203065;
	border: 1px solid #203065;
	box-shadow: none;
}
.BtM button.productCanBt.next::after,
.BtM a.productCanBt.next::after,
.BtM span.productCanBt.next::after,
.BtM button.productCanBt.back::after,
.BtM a.productCanBt.back::after,
.BtM back.productCanBt.next::after {border-left-color: #203065;}

/****************** 商品カート ******************/

/*** カート内商品一覧表示ボックス ***/

/*** 1カラムでの設置 ***/
.CartClm1 .PrdCartBox {
	margin-left: auto;
	margin-right: auto;
}
.CartClm2 .CartFlexItem {width: 100%;}

/*** 2カラムでの設置 ***/
/* カート親枠 */
.CartClm2 .PrdCartBox {
	display: flex;
	justify-content: space-between;
	margin-left: auto;
	margin-right: auto;
}
.CartClm2 .CartFlexItem {width: 100%;}
.CartClm2 .PrdCartInt {width: 65%;}
.CartClm2 .PrdCartList {width: 30%;}

@media screen and (max-width: 600px) {
	.PrdCartBox {padding: 0 0.5em;margin-left: auto;margin-right: auto;}
	.CartClm2 .PrdCartBox {display: block;}
	.CartClm2 .CartFlexItem {width: 100%;}
	.CartClm2 .PrdCartInt {width: 100%;}
	.CartClm2 .PrdCartList {width: 100%;}
}
/******* 現在カートに入ってる商品 *******/

.PrdCartSBox {
	width: 100%;
	margin: 0.5em auto;
	padding: 0.8em;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 10px solid #f9f9f9;
	background: #fff;
}
.PrdCartSBoxInn {width: 100%;display: flex;justify-content: space-between;}
.PCIDBlock {width: 100%;}

/*** 商品カート内写真 ***/
.PrdCartSPh {width: 130px;margin: 0 1.0em 0 0;padding: 0;overflow: hidden;}
.PrdCartSPh .PrdCartSPhDet {
	width: 100%;
	height: 102px;
	text-align: center;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 1px solid #efefef;
	background: #fff;
}
.PrdCartSPh .PrdCartSPhDet img {width: auto;height: 100px;}

/*** 商品カート内名称エリア ***/
.PrdCartSDet {width: 100%;margin: 0;padding: 0;}
.PrdCartSDetInn {}

/* 商品型番 */ 
.PrdCrtSNo {font-size: clamp(1.2rem, 1.0vw, 1.2rem);font-weight: bold;line-height: 1.2;}

/* 商品名 */
.PrdCrtSName {font-size: clamp(1.6rem, 1.4vw, 1.8rem);font-weight: bold;line-height: 1.4;}

/*** 商品カート内金額エリア ***/
.PrdCartSAmt {
	display: flex;
	align-items: center;
	font-weight: bold;
	padding-top: 0.5em;
}
.PrdCartSAmt span.kingakuTxt {padding: 0 0.2rem;font-size: clamp(1.6rem, 1.6vw, 2.5rem);}
.PrdCrtSpayS {padding: 0 0.5rem;font-size: clamp(1.2rem, 1.0vw, 1.2rem);}

/****** 商品オプション外枠 ******/
.PrdNumOpBox {
	width: 100%;
	margin: 1.0em auto 0 auto;
	padding: 0.3em 0.8em;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 2px solid #f9f9f9;
	background: #f9f9f9;
}
.PrdNumOpBoxInn,
.PrdCartOpCrt {
	display: flex;
	align-items: center;
	font-weight: bold;
}
/* 商品オプション時の個数変更 */
.PrdNumOpBox .PrdNumOpTi,
.PrdNumOpBox .PrdNumTxt {padding: 0 0.2em;font-size: clamp(1.4rem, 1.2vw, 1.4rem);}
.PrdNumOpBox .PrdNum {padding: 0;}
.PrdNumOpBox .PrdNumCtrBt {padding: 0;}
.PrdNumOpBox .PrdNumUpdBt {padding: 0 0.1em;}

@media screen and (max-width: 600px) {
	.PrdCartSBox {padding: 0.5em;}
	.PrdCartSPh {width: 100px;margin: 0 0.5em 0 0;}
	.PrdCartSPh .PrdCartSPhDet {height: 82px;}
	.PrdCartSPh .PrdCartSPhDet img {height: 80px;}
	.PrdCartSAmt {padding-top: 0.2em;padding-bottom: 1.0em;}
	.PrdNumOpBox {padding: 0.3em;}
}
/*** カート内商品合計金額表示ボックス ***/

/* 商品合計金額外枠 */
.PrdCartTotalBox {width: 100%;margin: 2.0rem auto;padding: 0;font-weight: bold;}
.PrdCartTotalBox table {width: 100%;margin: 0 auto;padding: 0;}
.PrdCartTotalBox tr {border-bottom: 1px dotted #c1c1c1;background: #fff;}
.PrdCartTotalBox tr.PrdCartTotalBrdNo {border-bottom: none;}
.PrdCartTotalBox td {padding: 1.0em;text-align: right;}
.PrdCartTotalBox td.PrdCartTotalpay {padding: 0.2em 0.5em;}
.PrdCartTotalBox td.PrdCartTotalSpayNo {padding-top: 0;}
.PrdCartTotalBox tr.PrdCartDelv {background: #f9f9f9;}

/* カート画面合計金額表示 */
.PrdCartTotalBox td.PrdCartTotalTiSd {font-size: clamp(1.4rem, 1.2vw, 1.4rem);}/* タイトル フォントサイズ */
.PrdCartTotalBox td.PrdCartTotalpay {font-size: clamp(2.0rem, 1.8vw, 2.5rem);}/* 合計金額 フォントサイズ */
.PrdCartTotalBox td.PrdCartTotalpay span {font-size: clamp(1.4rem, 1.2vw, 1.6rem);}/* 合計金額小 フォントサイズ */
.PrdCartTotalBox td.PrdCartTotalTiS,
.PrdCartTotalBox td.PrdCartTotalSpay {font-size: clamp(1.4rem, 1.2vw, 1.4rem);}/* 消費税 フォントサイズ */
.PrdCartTotalBox td.PrdCartTotalpayS {font-size: clamp(1.4rem, 1.2vw, 1.6rem);}/* 配送料 フォントサイズ */

.PrdCartTotalBox td.PrdCartTotalTiSd,
.PrdCartTotalBox td.PrdCartTotalTiS {width: 65%;}

/* カートオプション時の個数変更 */
.PrdCartOpCrt .PrdCartOpNum {padding: 0 0.5em;}
.PrdCartOpCrt .PrdCartOpBt {padding: 0;}
.PrdCartOpCrt .PrdNumUpdBt {padding: 0 0 0 0.3em;}

/*** ボタン指定 ***/

/* 更新・削除・確認ボタン */
.PrdCrtEdBt.BtM a,
.PrdNumUpdBt.BtM a {
	padding: 5px 0px;
	font-weight: bold;
	font-size: clamp(1.3rem, 1.3vw, 1.3rem);
	display: block;
	text-align:center;
}
.PrdNumUpdBt.BtM a {width: 60px;}/* 更新・削除ボタン */
.PrdCrtEdBt.BtM a:hover,
.PrdNumUpdBt.BtM a:hover {text-decoration: none;}

/* 更新ボタン */
.prdCartUpdBt,
.prdCartDelBt,
a.prdCartUpdBt:link,
a.prdCartUpdBt:visited,
a.prdCartUpdBt:active,
a.prdCartDelBt:link,
a.prdCartDelBt:visited,
a.prdCartDelBt:active {color: #fff;box-shadow: none;}
.prdCartUpdBt {background: #215e97;border: 1px solid #215e97;}/* 更新ボタン */
.prdCartDelBt {background: #969696;border: 1px solid #969696;}/* 削除ボタン */

/* 購入手続きへ進むボタン */
.productPurchaseBt {
	margin: 1.0em auto;
	padding: 1.5em;
	width: 60%;
	font-size: clamp(1.6rem, 1.4vw, 1.8rem);
	color: #fff;
	background: #171717;
	border: 1px solid #171717;
	box-shadow: none;
}
a.productPurchaseBt:link {color: #fff;}

.BtM button.productPurchaseBt.next::after,
.BtM a.productPurchaseBt.next::after,
.BtM span.productPurchaseBt.next::after,
.BtM button.productPurchaseBt.back::after,
.BtM a.productPurchaseBt.back::after,
.BtM back.productPurchaseBt.next::after {border-left-color: #fff;}
@media screen and (max-width: 600px) {
	:root {
	.productPurchaseBt {padding: 1.0em;width: 95%;}
	}
}
/* マイページへの移動ボタン */
.BtM .productMypBt {
	margin: 1.0em auto;
	padding: 1.5rem;
	width: 60%;
	font-size: clamp(1.6rem, 1.4vw, 1.8rem);
	color: #171717;
	background: #fff;
	border: 1px solid #171717;
	box-shadow: none;
}
.BtM button.productMypBt.next::after,
.BtM a.productMypBt.next::after,
.BtM span.productMypBt.next::after,
.BtM button.productMypBt.back::after,
.BtM a.productMypBt.back::after,
.BtM back.productMypBt.next::after {border-left-color: #171717;}

/******* その他の商品一覧画面 *******/

/*** 商品検索ボックス ***/
.SearchArea {
	width: 100%;
	margin: 0.2em auto;
	padding: 1.0rem;
	border-radius: var(--prdsearch-rod);-webkit-border-radius: var(--prdsearch-rod);-moz-border-radius: var(--prdsearch-rod); /* 角丸 */
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
	color: #171717;
	background: #fff;
	border: 1px solid #cfcfcf;
	box-shadow: none;
}
.SearchBox {width: 100%;}
.SearchBox .SearchForm {margin: 0.5rem 0;}
.SearchBtBox {display: flex;}
.SearchBtBox .SearchBT {width: 100%;}
.SearchBtBox .SearchBT a {margin: 0.5em;}

/*** 商品カートカテゴリボタン ***/
.PrdCartNVAll,
.PrdCartCate {
	margin: 1.0rem 0;
	padding: 0.5rem 0;
	font-weight: bold;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);
	text-align:center;
}
.PrdCartNVAll ul,
.PrdCartCate ul {list-style: none;display: flex;justify-content: space-between;}
.PrdCartNVAll li,
.PrdCartCate li {width: 100%;}
.PrdCartNVAll a,
.PrdCartCate a {
	width: 99%;
	display: block;
	padding: 1.0rem 0;
	border-radius: var(--PrdBt-rod);-webkit-border-radius: var(--PrdBt-rod);-moz-border-radius: var(--PrdBt-rod); /* 角丸 */
	color: #171717;
	border: 1px solid #c1c1c1;
	background: #efefef;
	text-decoration: none;
}
.PrdCartNVAll a:hover,
.PrdCartCate a:hover {filter: alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;text-decoration:none;}
.PrdCartNVAll a.crt,
.PrdCartCate a.crt {color: #fff;border: 1px solid #171717;background: #171717;text-decoration: none;}

/*** 追加商品購入一覧枠 ***/
.PrdCartBoxInn {
	width: 100%;
	display: flex;
	justify-content: space-between;
	margin: 0 auto 0.5em auto;
	padding: 0.8em;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod);
	border: 1px solid #f9f9f9;
	background: #fff;
}
/*** 追加商品購入内写真 ***/

.PrdCartPh {width: 100px;margin: 0 1.0em 0 0;padding: 0;overflow: hidden;}
.PrdCartPh .PrdCartPhDet {
	width: 100%;
	height: 62px;
	text-align: center;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod);
	border: 1px solid #efefef;
	background: #fff;
}
.PrdCartPh .PrdCartPhDet img {width: auto;height: 60px;}

/*** 追加商品購入内名称エリア ***/
.PrdCartDet {width: 100%;margin: 0;padding: 0;}

/* 商品型番 */ 
.PrdCrtNo {font-size: clamp(1.2rem, 1.0vw, 1.2rem);font-weight: normal;line-height: 1.2;}

/* 商品名 */
.PrdCrtName {font-size: clamp(1.4rem, 1.2vw, 1.4rem);font-weight: normal;line-height: 1.4;}

/* 商品価格 */
.PrdCrtPay {font-size: clamp(1.4rem, 1.4vw, 1.6rem);font-weight: bold;line-height: 1.4;}
.PrdCartBt {width: 100%;margin: 0;padding: 0;display: flex;}
.PrdCartBt p {width: 100%;margin: 0.5em 0.2em;}

/*** ボタン指定 ***/

/* 確認ボタン */
.prdCartDetBt {
	color: #171717;
	background: #fff;
	border: 1px solid #666;
	box-shadow: none;
}
a.prdCartDetBt:link,
a.prdCartDetBt:visited,
a.prdCartDetBt:active {color: #171717;}

/* カートボタン */
.prdCartOrdBt {
	color: #fff;
	background: #171717;
	border: 1px solid #171717;
	box-shadow: none;
}
a.prdCartOrdBt:link {color: #fff;}

/*** 商品購入カート住所設定 ***/

/* 住所選択 */
.addArea {margin: 1.0rem auto;padding: 0.5rem 0;}
.addArea .addAreaInn {
	display: inline-block;
	vertical-align: top;
	position: relative;
	width: 48.0%;
	height: 200px;
	margin: 0.5rem;
	padding: 0.5em 1.0em 1.0em 1.0em;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 1px solid #cdcdcd;
}
.addArea .addAreaInn .addName {border-bottom: 1px dotted #c1c1c;}
.addBT a:hover {text-decoration: none;}

.addArea .addAreaInn .addDetail {padding: 0.5rem;font-size: clamp(1.4rem, 1.2vw, 1.4rem);} /* 住所詳細 フォントサイズ */
.addArea .addAreaInn .addName {padding: 0 0 0.5rem 0;font-size: clamp(1.6rem, 1.6vw, 1.8rem);}/* 名称 フォントサイズ */
.addArea .addAreaInn .addPost {padding: 0.5rem 0 0 0;}
.addArea .addAreaInn .addAddition {
	width: 100%;
	height: 150px;
	margin: 0;
	padding: 1.0rem;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 1px dotted #c1c1c1;
}
.addArea .addAreaInn .addAddition p.addAdditionTi {
	padding-top: 1.5rem;
	text-align: center;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);/* 住所操作基本 フォントサイズ */
	font-weight: bold;
}
.addArea .addAreaInn .addAddition p.addAdditionIco {
	padding-top: 1.5rem;
	text-align: center;
	font-size: clamp(4.0rem, 4.0vw, 4.0rem);/* 住所操作アイコン フォントサイズ */
	font-weight: bold;
}
.addArea .addAreaInn .radio-toggle.addSelect {position: absolute;bottom: 0.5rem;right: 1.0rem;width: 100px;}
.addArea .addBTArea {position: absolute;bottom: 1.0rem;left: 2.0rem;}
.addBT {float: left;}
.addBT a {
	width: 100px;
	margin: 0 0.5rem 0 0;
	padding: 0.5rem 0;
	font-size: clamp(1.4rem, 1.0vw, 1.4rem);/* 住所操作ボタン フォントサイズ */
}
.addArea .addAreaDef {background: #f3f3f3;}

/*** 定休日設定 ***/
.remarksArea {
	margin: 1.0rem auto;
	padding: 1.5rem 1.0rem;
	border-radius: var(--Prd-rod);-webkit-border-radius: var(--Prd-rod);-moz-border-radius: var(--Prd-rod); /* 角丸 */
	border: 1px dotted #c1c1c1;
	background: #f3f3f3;
	font-size: clamp(1.4rem, 1.4vw, 1.6rem);
}
@media screen and (max-width: 600px) {
	.addArea .addAreaInn {display: block;}
	.addArea .addAreaInn {width: 95.0%;height: 200px;margin: 0.5rem auto;}
	.addBT a {width: 80px;}
}
/* ** product_box end ** */