/**************************************
#productDetailSection
**************************************/
#productDetailSection{
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 3rem 0 0;
  position: relative;
}

#productDetailSection img{max-width: 100%;}

#productDetailSection .errMsg{
  font-size: 1.3rem;
  line-height: 1.6;
  text-align: left;
  font-weight: 700;
  color: var(--errColor);
}

#productDetailSection .necessary{
  color: var(--errColor);
  font-weight: 700;
}

/*select*/
#productDetailSection select{
  width: 100%;
  height: var(--formHeight);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: var(--selectPadding);
  background: var(--selectBg);
  border: var(--formBorder);
  border-radius: var(--formBgRadius);
  vertical-align: middle;
  line-height: var(--formLineHeight);
  font-size: var(--formFontSize);
  color: var(--txtColor);
  text-align: left;
  outline: none;
  cursor: pointer;
  outline-color: var(--txtColor);
}

/*input*/
#productDetailSection input[type="text"],
#productDetailSection input[type="tel"],
#productDetailSection input[type="number"],
#productDetailSection input[type="password"],
#productDetailSection input[type="email"],
#productDetailSection input[type="url"]{
  display: block;
  width: 100%;
  height: var(--formHeight);
  box-sizing: border-box;
  padding: var(--formLeftPadding);
  background: var(--formBgColor);
  border: var(--formBorder);
  border-radius: var(--formBgRadius);
  font-size: var(--formFontSize);
  line-height: var(--formLineHeight);
  vertical-align: middle;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline-color: var(--txtColor);
}

#productDetailSection textarea{
  display: block;
  width: 100%;
  height: 16rem;
  box-sizing: border-box;
  padding: 1rem var(--formLeftPadding) 1rem var(--formLeftPadding);
  background: var(--formBgColor);
  border: var(--formBorder);
  border-radius: var(--formBgRadius);
  font-size: var(--formFontSize);
  line-height: 1.6;
  vertical-align: middle;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline-color: var(--txtColor);
}


#productDetailSection .inputArea.checkBtn{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 1rem 2rem;
}
#productDetailSection .inputArea.checkBtn input{display: none;}

#productDetailSection .inputArea.checkBtn input + label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--checkBtnGap);
  font-size: var(--formFontSize);
  line-height: var(--checkBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
  /**/
  padding-left: calc(var(--checkBtnGap) + var(--checkBtnSize));
}

#productDetailSection .inputArea.checkBtn input + label:hover,
#productDetailSection .inputArea.checkBtn input + label:hover{opacity: .6;}

#productDetailSection .inputArea.checkBtn input + label::before,
#productDetailSection .inputArea.checkBtn input + label::before{
  content: '';
  display: block;
  width: var(--checkBtnSize);
  height: var(--checkBtnSize);
  border: var(--checkBtnBorder);
  border-radius: var(--checkBtnRadius);
  background: #FFFFFF;
  transition: background 0.3s ease;
  position: absolute;
  left: 0;
  top: 0;
}

#productDetailSection .inputArea.checkBtn input + label::after,
#productDetailSection .inputArea.checkBtn input + label::after{
  content: '';
  display: block;
  width: var(--checkIconWidth);
  height: var(--checkIconWidth);
  background: var(--checkIconBg);
  background-size: var(--checkIconWidth) auto;
  position: absolute;
  left: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  top: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  opacity: 0;
  transition: opacity 0.3s ease;
}

#productDetailSection .inputArea.checkBtn input:checked + label::before{
  border: var(--checkedBtnBorder);
}
#productDetailSection .inputArea.checkBtn input:checked + label::after{
  opacity: 1;
}


/**************************************
#prodcutDetail
**************************************/
#prodcutDetail{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: space-between;
  width: 100%;
  max-width: calc(1200px + var(--contentsPadding) * 2);
  padding: 0 var(--contentsPadding) 0;
  margin: 0 auto;
  position: relative;
}



/**************************************
#detailTextArea
**************************************/
#detailTextArea{
  display: block;
  width: 44.16666666666667%;
  order: 2;
}


/* icons **********************/
#detailTextArea ul.itemIcons{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--iconGap);
  width: 100%;
  margin-bottom: 1.1rem;
}

#detailTextArea ul.itemIcons > li{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  min-height: var(--iconHeight);
  padding: var(--iconPadding);
  background: var(--icon01color);
  border: var(--icon01Border);
  border-radius: var(--iconRadius);
  font-family: var(--iconFont);
  font-size: 1.2rem;
  font-weight: var(--iconFontWeight);
  color: var(--icon01txt);
  text-align: center;
  line-height: 1;
}
#detailTextArea ul.itemIcons > li.icon01{ background: var(--icon01color); color: var(--icon01txt); border: var(--icon01Border);}
#detailTextArea ul.itemIcons > li.icon02{ background: var(--icon02color); color: var(--icon02txt); border: var(--icon02Border);}
#detailTextArea ul.itemIcons > li.icon03{ background: var(--icon03color); color: var(--icon03txt); border: var(--icon03Border);}
#detailTextArea ul.itemIcons > li.icon04{ background: var(--icon04color); color: var(--icon04txt); border: var(--icon04Border);}
#detailTextArea ul.itemIcons > li.icon05{ background: var(--icon05color); color: var(--icon05txt); border: var(--icon05Border);}
#detailTextArea ul.itemIcons > li.icon06{ background: var(--icon06color); color: var(--icon06txt); border: var(--icon06Border);}
#detailTextArea ul.itemIcons > li.icon07{ background: var(--icon07color); color: var(--icon07txt); border: var(--icon07Border);}
#detailTextArea ul.itemIcons > li.icon08{ background: var(--icon08color); color: var(--icon08txt); border: var(--icon08Border);}
#detailTextArea ul.itemIcons > li.icon09{ background: var(--icon09color); color: var(--icon09txt); border: var(--icon09Border);}
#detailTextArea ul.itemIcons > li.icon10{ background: var(--icon10color); color: var(--icon10txt); border: var(--icon10Border);}



/* itemName **********************/
#detailTextArea .itemName{
  display: block;
  padding-bottom: 1.1rem;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.1em;
  color: #2C2C2C;
}

/* catchCopy **********************/
#detailTextArea .catchCopy{
  display: block;
  margin-bottom: 0.8rem;
  font-size: 1.5rem;
  line-height: 1.8;
  font-weight: 500;
  color: #2C2C2C;
}


/* outeline **********************/
#detailTextArea .outeline{
  display: block;
  margin-bottom: 1.5rem;
  font-size: 1.3rem;
  line-height: 1.8;
  color: #2C2C2C;
}



/* setPromotionText **********************/
#detailTextArea .setPromotionText{
  display: block;
  margin-top: 2rem;
  margin-bottom: 2rem;
  padding: 1rem 2rem;
  font-size: 1.4rem;
  line-height: 1.6;
  text-align: left;
  border: 1px solid var(--saleColor);
  color: var(--saleColor);
  border-radius: 4px;
}
#detailTextArea .setPromotionText + .setPromotionText{margin-top: 0;}


/* priceBox **********************/
#detailTextArea .priceBox{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1.5rem 1.9rem;
  width: 100%;
}

#detailTextArea .priceBox p{
  font-size: 2.6rem;
  font-weight: 700;
  font-family: var(--contentsOtherFont);
  color: #2C2C2C;
}
#detailTextArea .priceBox p em{font-size: 1.3rem; margin-left: 0.5rem;}
#detailTextArea .priceBox p > span{}

#detailTextArea .priceBox .normal{}


#detailTextArea .priceBox .rate{
  display: none;
  /*
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  height: 2rem;
  padding: 0.1rem 0.5rem 0.2rem;
  font-size: 1.2rem;
  font-weight: 700;
  background: var(--saleColor);
  color: #FFFFFF;
  display: none;
  */
}

/***subscription***/
#detailTextArea .priceBox .subscription{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.6rem 1rem;
  color: var(--txtColor);
  width: 100%;
}
#detailTextArea .priceBox .subscription:not(.first)::before{
  content: '定期価格';
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  height: 2rem;
  padding: 0.2rem 0.8rem 0.2rem;
  border-radius: 3px;
  border: 1px solid var(--txtColor);
  color: var(--txtColor);
  font-size: 1.2rem;
  font-weight: 500;
  text-align: center;
}

#detailTextArea .priceBox .subscription.first{
  color: var(--subscColor);
}

#detailTextArea .priceBox .subscription.first::before{
  content: '定期初回';
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  height: 2rem;
  padding: 0.2rem 0.8rem 0.2rem;
  border-radius: 3px;
  border: 1px solid var(--subscColor);
  color: var(--subscColor);
  font-size: 1.2rem;
  font-weight: 500;
  text-align: center;
}

#detailTextArea .priceBox .subscription .rate{
  background: var(--subscColor);
  display: none;
}



/***sale***/
#detailTextArea .priceBox .sale{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.6rem 1rem;
  color: var(--saleColor);
}

#detailTextArea .priceBox .sale .rate{
  background: var(--saleColor);
}

#detailTextArea .priceBox .sale + .normal{
  color: #2C2C2C;
  position: relative;
}

#detailTextArea .priceBox .sale + .normal::before{
  content: '';
  display: block;
  height: 1px;
  /* width: calc(100% - 2em); */
  width: calc(100% - 1.8ch);
  background: #2C2C2C;
  position: absolute;
  left: 0;
  top: calc(50% - 1px);
}

/* purchaseInfo **********************/
#detailTextArea .purchaseInfo{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 1.2rem;
  padding-top: 1.5rem;
  font-size: 1.3rem;
  line-height: 1.5;
  font-weight: 500;
  text-align: left;
}

#detailTextArea .purchaseInfo > .pointInfo{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 0.5rem;
  text-align: left;
  position: relative;
}

#detailTextArea .purchaseInfo > .pointInfo::before{
  content: '';
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../img/product/icon_p.svg") center center no-repeat;
  background-size: 100% auto;
}


#detailTextArea .purchaseInfo > .reviewInfo{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 0.5rem;
  text-align: left;
  position: relative;
}

#detailTextArea .purchaseInfo > .reviewInfo::before{
  content: '';
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../img/product/icon_review_anc.svg") center center no-repeat;
  background-size: 100% auto;
}

#detailTextArea .purchaseInfo > .reviewInfo a{text-decoration: underline;}




/* detailCartBox **********************/
#detailCartBox{
  display: block;
  margin-top: 2rem;
  padding: 3rem 2.5rem;
  background: rgba(221,221,221,.2);
  border-radius: 10px;
}

#detailCartBox .sellFrom{
  font-size: 1.4rem;
  font-weight: 500;
}

#detailCartBox .errMsgView{
  display: block;
  padding: 0 0 0;
}

#detailCartBox .errMsgView > p{padding-bottom: 2rem;}

/* variationSelect **/
#detailCartBox .variationSelect{
  display: block;
  margin-bottom: 2rem;
}

#detailCartBox .variationSelect > dl > dt{
  display: block;
  margin-bottom: 0.3rem;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 2;
}
#detailCartBox .variationSelect > dl + dl{margin-top: 2rem;}

#detailCartBox .variationSelect > dl > dd{}


/* panelSelect **/
#detailCartBox .variationSelect .panelSelect{
  display: block;
}

#detailCartBox .variationSelect .panelSelect + .panelSelect{
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid #EFEFEF;
}

#detailCartBox .variationSelect .panelSelect > ul{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 1rem 1rem;
}

#detailCartBox .variationSelect .panelSelect > ul > li{
  display: block;
  width: calc((100% - 3rem) / 4);
}
#detailCartBox .variationSelect .panelSelect > ul > li > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  cursor: inherit;
}

#detailCartBox .variationSelect .panelSelect > ul > li > a > span{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 4rem;
  padding: 1.1rem 0.5rem;
  border: 2px solid #808080;
  border-radius: 6px;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
#detailCartBox .variationSelect .panelSelect > ul > li > a > span.selected{
  border-color: #DC000C;
  color: #DC000C;
  pointer-events: none;
  cursor: inherit;
}
#detailCartBox .variationSelect .panelSelect > ul > li > a:hover{opacity: 1;}
#detailCartBox .variationSelect .panelSelect > ul > li > a:hover > span:not(.selected){opacity: .6;}



/* incidentalBox **/
#detailCartBox .incidentalBox{
  display: block;
}

#detailCartBox .incidentalBox > dl{
  display: block
}
#detailCartBox .variationSelect + .incidentalBox > dl{margin-top: 2rem;}
#detailCartBox .incidentalBox > dl + dl{margin-top: 2rem;}


#detailCartBox .incidentalBox > dl:nth-last-of-type(1){margin-bottom: 2.5rem;}

#detailCartBox .incidentalBox > dl > dt{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  margin-bottom: 0.3rem;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 2;
}

#detailCartBox .incidentalBox > dl.required{}
#detailCartBox .incidentalBox > dl.required > dt::after{
  content: '*';
  display: block;
  color: var(--cautionColor);
  font-size: 1.4rem;
}


#detailCartBox .incidentalBox > dl > dd{
  display: block;
  width: 100%;
}

#detailCartBox .incidentalBox > dl > dd > .inputArea{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}

#detailCartBox .incidentalBox > dl > dd > .inputArea.checkBtn{
  flex-wrap: wrap;
  align-items: stretch;
  padding-top: 0.9rem;
}

#detailCartBox .incidentalBox > dl > dd > .inputArea select{display: block; width: 100%;}

#detailCartBox .incidentalBox > dl > dd .errMsg{
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--errColor);
}


/* quantitySelect **/
#detailCartBox dl.quantitySelect{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  /*margin-top: 2.5rem;*/
}

#detailCartBox dl.quantitySelect > dt{
  display: block;
  margin-right: 2rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
  text-align: left;
}

#detailCartBox dl.quantitySelect > dd{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  width: calc(4.5rem * 2 + 1.4rem + 9rem);
  gap: 0 0.7rem;
}
#detailCartBox dl.quantitySelect > dd input[type="text"],
#detailCartBox dl.quantitySelect > dd input[type="number"]{
  display: block;
  width: calc(100% - 9rem - 1.4rem);
  height: 4.5rem;
  box-sizing: border-box;
  padding: 0 1rem 0 1rem;
  background: #FFFFFF;
  border: 1px solid #DDDDDD;
  border-radius: var(--formBgRadius);
  font-family: var(--contentsOtherFont);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: calc(4.5rem - 2px);
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline-color: var(--txtColor);
}

#detailCartBox dl.quantitySelect > dd > button{
  display: block;
  width: 4.5rem;
  height: 4.5rem;
  background: #DDDDDD;
  border-radius: 6px;
  position: relative;
  cursor: pointer;
  transition: opacity 0.3s ease;
}
#detailCartBox dl.quantitySelect > dd > button:hover{opacity: .6;}

#detailCartBox dl.quantitySelect > dd > button::before{
  content: '';
  display: block;
  width: 1.2rem;
  height: 2px;
  background: #2C2C2C;
  position: absolute;
  left: calc(50% - 0.6rem);
  top: calc(50% - 1px);
}

#detailCartBox dl.quantitySelect > dd > button.quantityUp::after{
  content: '';
  display: block;
  width: 1.2rem;
  height: 2px;
  background: #2C2C2C;
  position: absolute;
  left: calc(50% - 0.6rem);
  top: calc(50% - 1px);
  transform: rotate(90deg);
}



/* btnArea **/
#detailCartBox .btnArea{
  display: block;
  width: 100%;
  margin-top: 2rem;
}

#detailCartBox .btnArea > ul{
  display: block;
}

#detailCartBox .btnArea > ul > li{
  display: block;
}

#detailCartBox .btnSoldOut > span,
#detailCartBox .btnSoldOut > a,
#detailCartBox .btnSoldOut > button{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 6rem;
  border-radius: 1rem;
  padding: 0 1rem 0 1rem;
  background: #7C7C7C;
  font-family: var(--contentsOtherFont);
  font-weight: 500;
  font-size: 1.7rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  cursor: inherit;
  pointer-events: none;
}


#detailCartBox .btnArrivalOpen > a,
#detailCartBox .btnArrivalOpen > button,
#detailCartBox .btnArrivalOpen > span{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 6rem;
  background-color: #CE4B4B;
  border-radius: 10px;
  padding: 0 1rem 0 1rem;
	font-family:  var(--contentsOtherFont);
  font-weight: 500;
  font-size: 1.7rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
/*
#detailCartBox .btnArrivalOpen > a::before,
#detailCartBox .btnArrivalOpen > button::before,
#detailCartBox .btnArrivalOpen > span::before{
  content: '';
  display: block;
  width: 2rem;
  height: 1.6rem;
  background: url("../img/product/icon_arrival.svg") center center no-repeat;
  background-size: 100% auto;
}

#detailCartBox .btnArrivalOpen > a:hover,
#detailCartBox .btnArrivalOpen > button:hover,
#detailCartBox .btnArrivalOpen > span:hover{
  opacity: .6;
}
*/
/* 追加 チェックリスト */
.checkList{
  margin-bottom: 1rem;
}
#detailCartBox .checkList .incidentalBox > dl > dt{
  display: unset;
}
.incidentalBox .iconRequired {
  margin-right: 0.5rem;
}
.iconRequired {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.6rem;
  padding: 0.3rem 0.5rem 0.4rem;
  background: var(--cautionColor);
  border-radius: 2px;
  font-size: 1rem;
  font-weight: 700;
  color: #FFFFFF;
  text-align: center;
  line-height: 1;
  vertical-align: middle;
}
.iconRequired::before {
  content: '必須';
}




/* arrivalMailInput *************/
#productDetailSection .arrivalMailInput{
  display: block;
  margin-top: 2.5rem;
  padding-bottom: 1.5rem;
  position: relative;
}


#productDetailSection .arrivalMailInput > dl{
  display: block;
}
#productDetailSection .arrivalMailInput > dl > dt{
  display: block;
  font-size: 1.3rem;
  text-align: left;
  line-height: 1.8;
}
#productDetailSection .arrivalMailInput > dl > dd{
  display: block;
}

#productDetailSection .arrivalMailInput .cautionMsg{
  font-size: 1.2rem;
  text-align: left;
  line-height: 1.8;
}

#productDetailSection .arrivalMailInput .arrivalFormTable{
  display: block;
  padding-top: 1.8rem;
}

#productDetailSection .arrivalMailInput .arrivalFormTable > dl{ display: block;}
#productDetailSection .arrivalMailInput .arrivalFormTable > dl + dl{margin-top: 2rem;}

#productDetailSection .arrivalMailInput .arrivalFormTable > dl > dt{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  font-size: 1.3rem;
  text-align: left;
  line-height: 1.8;
  font-weight: 700;
}
#productDetailSection .arrivalMailInput .arrivalFormTable > dl > dt > time{
  display: block;
  font-size: 1.3rem;
}


#productDetailSection .arrivalMailInput .arrivalFormTable > dl > dd{}
#productDetailSection .arrivalMailInput .arrivalFormTable > dl > dd > p{
  font-size: 1.3rem;
  margin-top: 1rem;
}


#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList{
  display: block;
  padding: 1rem 0;
}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li{display: block;}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li + li{margin-top: 1rem;}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem 0;
}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span input[type="checkbox"]{display: none;}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--checkBtnGap);
  font-size: var(--formFontSize);
  line-height: var(--checkBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span label:hover{opacity: .6;}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span label + em{
  padding-left: 2rem;
}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span label::before{
  content: '';
  display: block;
  width: var(--checkBtnSize);
  height: var(--checkBtnSize);
  border: var(--checkBtnBorder);
  border-radius: var(--checkBtnRadius);
  background: #FFFFFF;
  transition: background 0.3s ease;
}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span label::after{
  content: '';
  display: block;
  width: var(--checkIconWidth);
  height: var(--checkIconWidth);
  background: var(--checkIconBg);
  background-size: var(--checkIconWidth) auto;
  position: absolute;
  left: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  top: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  opacity: 0;
  transition: opacity 0.3s ease;
}

#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span input:checked + label{}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span input:checked + label::before{border: var(--checkedBtnBorder);}
#productDetailSection .arrivalMailInput .arrivalFormTable ul.checkList > li > span input:checked + label::after{opacity: 1;}



#productDetailSection .arrivalMailInput .btnNext{
  max-width: 24rem;
  margin: 1rem auto 0;
}

/* btnArea **/
#detailCartBox .otherBtnArea{
  display: block;
  width: 100%;
  margin-top: 1rem;
}

#detailCartBox .otherBtnArea > ul{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
}

#detailCartBox .otherBtnArea > ul > li{
  display: block;
  width: calc(50% - 0.5rem);
}


#detailCartBox .otherBtnArea > ul > li > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 5.5rem;
  background-color: #FFFFFF;
  border: 1px solid #DDDDDD;
  border-radius: 10px;
  padding: 0 1rem 0 1rem;
	font-family: var(--contentsOtherFont);
  font-weight: 500;
  font-size: 1.5rem;
  text-align: center;
  letter-spacing: 0.03em;
  line-height: 1;
  text-decoration: none;
  color: #7C7C7C;
  position: relative;
  transition: opacity 0.3s ease;
}

#detailCartBox .otherBtnArea > ul > li.favoriteBtn > a > span{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
}

#detailCartBox .otherBtnArea > ul > li.favoriteBtn > a > span::before{
  content: '';
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  mask-image: url(../img/common/icon_favorite.svg);
  mask-repeat: no-repeat;
  mask-position: 50% 50%;
  mask-size: 77%;
  -webkit-mask-image: url(../img/common/icon_favorite.svg);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: 50% 50%;
  -webkit-mask-size: 77%;
  background: #7C7C7C;
}

#detailCartBox .otherBtnArea > ul > li.favoriteBtn > a > span.active::before{
  content: '';
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  mask-image: url(../img/common/icon_favorite_active.svg);
  mask-repeat: no-repeat;
  mask-position: 50% 50%;
  mask-size: 77%;
  -webkit-mask-image: url(../img/common/icon_favorite_active.svg);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: 50% 50%;
  -webkit-mask-size: 77%;
  background: #D74F8D;
}


#detailCartBox .otherBtnArea > ul > li.contactBtn > a::before{
  content: '';
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  background: url("../img/common/icon_contact.svg") center center no-repeat;
  background-size: 90% auto;
}

/**************************************
.shareBtn
**************************************/
#prodcutDetail dl.shareBtnBox{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  margin-top: 2rem;
}

#prodcutDetail dl.shareBtnBox > dt{
  font-size: 1.3rem;
  font-weight: 500;
  text-align: right;
  margin-right: 2rem;
}

#prodcutDetail ul.shareBtn{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0 1.5rem;
}

#prodcutDetail ul.shareBtn > li{
  display: block;
  width: 2.3rem;
  height: 2.3rem;
}
#prodcutDetail ul.shareBtn > li > a{display: block;}
#prodcutDetail ul.shareBtn > li img{display: block; width: 100%; height: auto;}


/**************************************
.descriptionBox1
**************************************/
#prodcutDetail .descriptionBox1{
  display: block;
  margin-top: 4rem;
}

#prodcutDetail .descriptionBox1 img{max-width: 100%; height: auto;}

#prodcutDetail dl.specificationBox{
  display: block;
}

#prodcutDetail dl.specificationBox > dt{
  display: block;
  padding-bottom: 1.6rem;
  margin-bottom: 2rem;
  border-bottom: 2px solid #F5F5F5;
  font-size: 1.4rem;
  line-height: 1.6;
  font-weight: 500;
}

#prodcutDetail dl.specificationBox > dd{
  display: block;
  font-size: 1.3rem;
  line-height: 1.6;
}

#prodcutDetail dl.specificationBox > dd > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
}

#prodcutDetail dl.specificationBox > dd > dl > dt{
  display: block;
  width: 7.7rem;
  padding-right: 1.5rem;
}
#prodcutDetail dl.specificationBox > dd > dl > dd{width: calc(100% - 7.7rem);}


#prodcutDetail .descriptionBox1 table{}

#prodcutDetail .descriptionBox1 table th,
#prodcutDetail .descriptionBox1 table td{
  font-size: 1.3rem;
  vertical-align: middle;
  padding: 0.5rem 1rem;
  font-weight: 500;
  line-height: 1.8;
}
#prodcutDetail .descriptionBox1 table th{font-weight: 700;}
#prodcutDetail .descriptionBox1 table tr{border-bottom: 2px solid #FFFFFF;}


#prodcutDetail .descriptionBox1 table th[align ="center"],
#prodcutDetail .descriptionBox1 table td[align ="center"]{text-align: center;}

#prodcutDetail .descriptionBox1 table th{text-align: center;}

/* #prodcutDetail .descriptionBox1 > p{
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.8;
} */

#prodcutDetail .descriptionBox1,
#prodcutDetail .descriptionBox1 p,
#prodcutDetail .descriptionBox2,
#prodcutDetail .descriptionBox2 p{
  font-size: 1.3rem;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

#prodcutDetail .descriptionBox1 > table + p{padding-top: 1rem;}

/**************************************
.descriptionBox2
**************************************/
#prodcutDetail .descriptionBox2{
  display: block;
  margin-top: 4rem;
}

#prodcutDetail .descriptionBox2 img{max-width: 100%; height: auto;}

#prodcutDetail dl.cautionBox{
  display: block;
  padding: 3rem;
  background: #FFF5F2;
  border-radius: 10px;
  color: #DB2320;
}

#prodcutDetail dl.cautionBox > dt{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0 1rem;
  margin-bottom: 1.4rem;
  font-size: 1.4rem;
  font-weight: 500;
}

#prodcutDetail dl.cautionBox > dt::before{
  content: '';
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  background: url("../img/product/icon_i.svg") center center no-repeat;
  background-size: 100% auto;
}

#prodcutDetail dl.cautionBox > dd{
  display: block;
  font-size: 1.2rem;
  line-height: 1.6;
}



/**************************************
.review
**************************************/
#dvProductReviewArea{
	display: block;
  margin-top: 4rem;
  padding-top: 4rem;
}

#dvProductReviewArea .reviewBoxTTL{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1rem;
  border-bottom: 2px solid #F5F5F5;
}
#dvProductReviewArea .reviewBoxTTL > p{
  display: block;
  width: calc(100% - 16rem);
  font-size: 1.4rem;
  font-weight: 500;
  text-align: left;
}
#dvProductReviewArea .reviewBoxTTL[data-is-loggedin="false"] {
  justify-content: flex-start;
  column-gap: 1.5rem;
}
#dvProductReviewArea .reviewBoxTTL[data-is-loggedin="false"] > p{
  width: auto;
}
#dvProductReviewArea .reviewBoxTTL[data-is-loggedin="false"] > span{
  font-size: 1.1rem;
}

#dvProductReviewArea .reviewBoxTTL > .btnReview{
  display: block;
  width: 100%;
  max-width: 150px;
}
#dvProductReviewArea .reviewBoxTTL > .btnReview > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 3rem;
  background: var(--btnColor);
  border-radius: 6px;
  padding: 0 1rem 0 1rem;
  font-family: var(--contentsOtherFont);
  font-size: 1.3rem;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  transition: opacity 0.3s ease;
}
#dvProductReviewArea .reviewBoxTTL > .btnReview > a::before{
  content: '';
  display: block;
  width: 1.7rem;
  height: 1.7rem;
  background: url("../img/product/icon_review.svg") center center no-repeat;
  background-size: 100% auto;
}


#dvReviewComment{padding-top: 2rem;}


#dvReviewComment .noItem{
  padding-top: 2.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: center;
}

#dvReviewComment > dl{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  padding-bottom: 2.5rem;
  border-bottom: 2px dotted #F2F3EF;
}
#dvReviewComment > dl + dl{
  margin-top: 2.5rem;
}

#dvReviewComment .reviewTTL{
  order: 2;
  display: block;
  margin-bottom: 1.5rem;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: left;
}
#dvReviewComment .reviewTTL > time{font-size: 1.3rem; color: #476CC7; font-weight: 400; white-space: nowrap;}



#dvReviewComment .reviewRate{
  order: 1;
  display: block;
  margin-bottom: 1.2rem;
  font-size: 1.4rem;
  font-weight: 500;
  color: #DDDDDD;
}
#dvReviewComment .reviewRate span{color: #EDC003;}
#dvReviewComment .reviewRate img{display: block; width: 100%; height: auto;}

#dvReviewComment .userName{
  order: 4;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem 0.5rem;
  width: 100%;
  font-size: 1.3rem;
  font-weight: 400;
}
#dvReviewComment .userName::before{
  content: '';
  display: block;
  width: 1.7rem;
  height: 1.7rem;
  margin: 0;
  mask-image: url(../img/common/icon_doll.svg);
  mask-repeat: no-repeat;
  mask-position: 50% 50%;
  mask-size: 62.64705882352941%;
  -webkit-mask-image: url(../img/common/icon_doll.svg);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: 50% 50%;
  -webkit-mask-size: 62.64705882352941%;
  background: #D74F8D;
}

#dvReviewComment .userName time{
  font-family: var(--contentsOtherFont);
}

#dvReviewComment .reviewComment{
  order: 3;
  margin-bottom: 2.5rem;
  font-size: 1.3rem; line-height: 1.8;
}



#dvProductReviewArea a.btnMoreReview{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 10rem;
  padding: 0 0 0 0;
  margin: 2.5rem auto 0;
  font-size: 1.3rem;
  font-weight: 500;
  color: #2C2C2C;
}
#dvProductReviewArea a.btnMoreReview > em{
  display: block;
  width: 1rem;
  height: 1rem;
  margin-left: 0.4rem;
  position: relative;
}

#dvProductReviewArea a.btnMoreReview > em::before,
#dvProductReviewArea a.btnMoreReview > em::after{
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: #2C2C2C;
  position: absolute;
  left: 0;
  top:calc(50% - 1px);
}
#dvProductReviewArea a.btnMoreReview > em::after{transform: rotate(90deg);}


#dvProductReviewArea .pagerBox{}
#dvProductReviewArea .pagerBox > .cnt{display: none;}
#dvProductReviewArea .pagerBox > .listPager{padding-top: 2rem;}


#dvProductReviewArea .btnNext{
  display: block;
  width: 18rem;
  padding-top: 2rem;
  margin: 0 auto;
}

#dvProductReviewArea .ReviewInputInner{padding-top: 4.5rem;}

#dvProductReviewArea .ReviewInputInner > dl{ 
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
}
#dvProductReviewArea .ReviewInputInner > dl + dl{margin-top: 2rem;}

#dvProductReviewArea .ReviewInputInner > dl > dt{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem 1rem;
  width: 15.6rem;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
  padding-right: 1.5rem;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.4;
}
#dvProductReviewArea .ReviewInputInner > dl.required > dt::after{
  content: '必須';
  padding: 0.5rem;
  background: var(--cautionColor);
  border-radius: 2px;
  white-space: nowrap;
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1;
  color: #FFFFFF;
}

#dvProductReviewArea .ReviewInputInner > dl > dd{
  display: block;
  width: calc(100% - 15.6rem);
  padding-top: 0.9rem;
  padding-bottom: 0.9rem;
  font-size: 1.4rem;
  line-height: 1.4;
}

#dvProductReviewArea .ReviewInputInner > dl > dd > .inputArea:nth-child(1){ margin-top: -0.9rem;}
#dvProductReviewArea .ReviewInputInner > dl > dd > .inputArea:nth-last-child(1){ margin-bottom: -0.9rem;}

#dvProductReviewArea .ReviewInputInner > dl > dd > .inputArea > select{display: block; width: 100%;}


#dvProductReviewArea .reviewBtnArea{
  display: block;
  padding-top: 4rem;
}

#dvProductReviewArea .reviewBtnArea > ul{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: center;
  gap: 0 2rem;
}
#dvProductReviewArea .reviewBtnArea > ul > li.btnBack{width: 18rem;}
#dvProductReviewArea .reviewBtnArea > ul > li.btnNext{width: 18rem; padding: 0; margin: 0;}

#dvProductReviewArea .reviewBtnArea > ul > li.btnBack > a,
#dvProductReviewArea .reviewBtnArea > ul > li.btnNext > a{height: 4.2rem; font-size: 1.4rem;}

#dvProductReviewArea .confirmMessage{
  display: none;
  margin-bottom: 3rem;
  padding-top: 4.5rem;
  font-size: 1.4rem;
  text-align: center;
}

#dvProductReviewArea .reviewBoxTTL + .confirmMessage{display: block;}

#dvProductReviewArea .reviewCompBox{
  display: block;
  padding-top: 2.5rem;
  font-size: 1.4rem;
  line-height: 1.6;
  text-align: center;
}
#dvProductReviewArea .reviewCompBox + .reviewBtnArea > ul > li{
  display: block;
  width: 24rem;
}



/**************************************
#detailImgArea
**************************************/
#prodcutDetail #detailImgArea{
  display: block;
  width: 50%;
}

#prodcutDetail #detailImgArea .detailImgAreaInner{
  position: sticky;
  top: calc(var(--headHeight) + 3rem);
}


#detailImgArea .detailImgWrapper{
  display: block;
}

/**/
#detailMainImg{
  display: block;
  width: 100%;
  padding: 0 4rem;
	overflow: hidden;
	position: relative;
}
#detailMainImg ul.sliderWrapper li{
  /*max-height: calc(100vh - var(--headHeight) - 3rem - 19rem - 4px);*/
}

#detailMainImg img {
	display: block;
	width: 100%;
  height: auto;
}

#detailMainImg .soldOut{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: rgba(124,124,124, .4);
  color: #FFFFFF;
  font-family: var(--fontEN);
  text-align: center;
  font-weight: 700;
  font-size: 2rem;
  letter-spacing: 0.1em;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

#detailMainImg .container{
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

#detailMainImg .sliderWrapper{}

#detailMainImg .slider {
  display: block;
  width: 100%;
  background: #FFFFFF;
  overflow: hidden;
  position: relative;
}
#detailMainImg .slider::after{
	content: '';
	display: block;
	padding-top: var(--itemImgRatio);
}

#detailMainImg .slider > img{
	display: block;
	width: 100%; height: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
}

#detailMainImg .slider.swiper-slide-active{
  pointer-events: auto;
}

#detailMainImg .control{display: block;}
#detailMainImg .control > .next{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
	width: 4rem;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 3;
	cursor: pointer;
  transition: opacity 0.3s ease;
  outline: none;
}

#detailMainImg .control > .prev{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
	width: 4rem;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	cursor: pointer;
  transition: opacity 0.3s ease;
  outline: none;
}


#detailMainImg .control > .next > img,
#detailMainImg .control > .prev > img{display: block; width: 1.5rem; height: auto;}

#detailMainImg .control > .prev:hover,
#detailMainImg .control > .next:hover{opacity: .6;}


#detailMainImg .control > .next.swiper-button-disabled:not(.loopSlideActive),
#detailMainImg .control > .prev.swiper-button-disabled:not(.loopSlideActive){opacity: 0; cursor: inherit;}


/**** thumbs ***************/
#thumsListBox{
	display: block;
  width: 100%;
  padding: 0;
  margin-top: 2rem;
	position: relative;
}

#thumsListBox .container{
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  list-style: none;
  padding: 0;
  top: 0;
  left: 0;
  z-index: 1;
}

#thumsListBox .sliderWrapper{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  transition-property: transform;
  box-sizing: content-box;
  gap: 1rem 1rem;
}

#thumsListBox .slider{
  display: block;
  width: calc((100% - 6rem) / 6);
  overflow: hidden;
  border: 1px solid #FFFFF;
  position: relative;
  cursor: pointer;
  transition: opacity 0.3s ease,border 0.3s ease;
}
#thumsListBox .slider:nth-last-of-type(1){margin-right: 0;}
#thumsListBox .slider:hover{opacity: .6;}

#thumsListBox .slider.current{
  border: 1px solid #7C7C7C;
}

#thumsListBox .slider > img{
  display: block;
  width: 100%;
  height: auto;
}




/**************************************
#descriptionOpenArea
**************************************/
#descriptionOpenArea{
  display: block;
  width: 100%;
  max-width: calc(1200px + var(--contentsPadding) * 2);
  padding: 8rem var(--contentsPadding) 0;
  margin: 0 auto;
  font-size: var(--fontSizeN);
  line-height: var(--lineHeight);
  position: relative;
}

#descriptionOpenArea > .inner{
  display: block;
  width: 100%;
}

#descriptionOpenArea > .btnDescriptionMore + .inner{
  max-height: 500px;
  overflow: hidden;
}

#descriptionOpenArea.open > .inner{
  max-height: none;
  padding-bottom: 4rem;
}

#descriptionOpenArea img{
  display: block;
  max-width: 100%;
  margin: 0 auto;
}


#descriptionOpenArea .btnDescriptionMore{
  display: block;
  width: calc(100% - var(--contentsPadding) * 2);
  position: absolute;
  bottom: 0;
  left: var(--contentsPadding);
  cursor: pointer;
}
/*
#descriptionOpenArea.load .btnDescriptionMore,
#descriptionOpenArea.open .btnDescriptionMore{display: none;}
*/

#descriptionOpenArea .btnDescriptionMore::before{
  content: '';
  display: block;
  height: 26rem;
  width: 100%;
  background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0.97) 10%,rgba(255,255,255,0));
}

#descriptionOpenArea.open .btnDescriptionMore::before{display: none;}

#descriptionOpenArea .btnDescriptionMore > span{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  padding: 0 0 0 0;
  margin: 0 auto 0;
  font-size: 1.3rem;
  font-weight: 500;
  color: #2C2C2C;
  background: #FFFFFF;
}
#descriptionOpenArea .btnDescriptionMore > span::before{
  content: 'もっと見る';
}
#descriptionOpenArea.open .btnDescriptionMore > span::before{
  content: '閉じる';
}

#descriptionOpenArea .btnDescriptionMore > span > em{
  display: block;
  width: 1rem;
  height: 1rem;
  margin-left: 0.4rem;
  position: relative;
}

#descriptionOpenArea .btnDescriptionMore > span > em::before,
#descriptionOpenArea .btnDescriptionMore > span > em::after{
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: #2C2C2C;
  position: absolute;
  left: 0;
  top:calc(50% - 1px);
}
#descriptionOpenArea .btnDescriptionMore > span > em::after{transform: rotate(90deg);}
#descriptionOpenArea.open .btnDescriptionMore > span > em::after{opacity: 0;}

/**************************************
.rerationItems .historyItems
**************************************/
.recommendItems,
.rerationItems{
  display: block;
  max-width: var(--contentsOuterWidth);
  padding: 6rem var(--contentsPadding) 0;
  margin: 0 auto;
}

#descriptionOpenArea + .recommendItems,
#descriptionOpenArea + .rerationItems{padding-top: 12rem;}


/**************************************
toolTip
**************************************/

#productDetailSection .invisible {display: block;}
#addFavoriteTip {
  display: none;
  margin: 0;
  padding: 2rem;
  width: 40rem;
  border-radius: 10px;
  background-color: rgba(0,0,0,.6);
  overflow: hidden;
  font-size: 1.8rem;
  text-align: center;
  z-index: 2000;
  color:#FFFFFF;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
#addFavoriteTip a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 24rem;
  height: 3rem;
  padding: 0 1rem 0 1rem;
  margin: 2rem auto 0;
  background: #FFFFFF;
  border-radius: 1.5rem;
  border: 1px solid #000000;
  font-weight: 500;
  font-size: 1.2rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #000000;
  position: relative;
}



/**************************************
#cartInPriceCheck
**************************************/
#cartInPriceCheck{display: none;}

/**************************************
#reviewAgreeArea
**************************************/

/* checkBox ***************************/
.checkBox{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.5rem 2rem;
}

.checkBox input{display: none;}

.checkBox label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--checkBtnGap);
  font-size: var(--formFontSize);
  line-height: var(--checkBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}
.checkBox label:hover{opacity: .6;}

.checkBox label::before{
  content: '';
  display: block;
  width: var(--checkBtnSize);
  height: var(--checkBtnSize);
  border: var(--checkBtnBorder);
  border-radius: var(--checkBtnRadius);
  background: #FFFFFF;
  transition: border 0.3s ease;
}

.checkBox label::after{
  content: '';
  display: block;
  width: var(--checkIconWidth);
  height: var(--checkIconWidth);
  background: var(--checkIconBg);
  background-size: var(--checkIconWidth) auto;
  position: absolute;
  left: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  top: calc((var(--checkBtnSize) - var(--checkIconWidth)) / 2);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.checkBox input:checked + label{}

.checkBox input:checked + label::before{ border: var(--checkedBtnBorder);}
.checkBox input:checked + label::after{opacity: 1;}

.inputArea + .checkBox{margin-top: 1rem;}


/* reviewAgreeArea ***************************/
.reviewAgreeArea {
  text-align: center;
  margin: 1.5rem 0 0;
  padding: 1.8rem 2rem 1.6rem;
  background: rgba(221,221,221,.2);
}
.reviewAgreeArea .reviewAgree_checkBox {
  justify-content: center;
}
.reviewAgreeArea .reviewAgree_guideLink {
  font-size: var(--formFontSize);
  line-height: var(--checkBtnLineHeight);
  margin-top: 0.5rem;
}
.c-directLink {
  color: var(--cautionColor);
  text-decoration: underline;
}
.button-active {
  pointer-events: auto;
  opacity: 1;
}
.button-disabled {
  pointer-events: none;
  opacity: 0.5;
}

/* ***************************/

.btnNext.cart.invalid > a{
  pointer-events: none;
  opacity: 0.5;
}