.product-wrap{padding-bottom: 12vw;}
.product-wrap .cartBox {
  display: flex;
  overflow: hidden;
  width: 89%;
  margin: 0 auto;
  border: 1px solid #cbcbcb;
  border-radius: 2vw;
}
.product-wrap .cartBox .cartBox__title {
  flex-shrink: 0;
  font-size: 5.7vw;
  color: #222;
  font-weight: bold;
  letter-spacing: -0.04em;
  text-align: left;
  width: 43%;
  padding: 5vw;
  line-height: 1;
  background-color: #feecff;
  box-sizing: border-box;
}
.product-wrap .cartBox .cartBox__title > p{
  color: #555;
  font-size: 3.4vw;
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 1.3em;
  text-align: left;
  margin-top: 2.5vw;
}
.product-wrap .ChoiceWrap{flex-grow: 1; padding: 5vw; box-sizing: border-box;}
.product-wrap .ChoiceWrap > div{width: 100%;}
.product-wrap .ChoiceWrap dl{display: flex; align-items: center; margin-top: 2.5vw;}
.product-wrap .ChoiceWrap dl dd{width: 100%;}
.product-wrap .ChoiceWrap dl dd.price{font-size: 16px; color: #939393; text-decoration: line-through;}
.product-wrap .ChoiceWrap dl dd.price:after{content: "¿ø"; display: inline-block; font-size: 16px; text-decoration: line-through;}
.product-wrap .ChoiceWrap dl dd.discount{font-size: 26px; color: #ff6012; font-weight: bold; }
.product-wrap .ChoiceWrap dl dd.discount:after{content: "¿ø"; color: #222; display: inline-block; font-size: 18px; }
.product-wrap .ChoiceWrap dl dd.discount:after{content: "¿ø"; color: #222; display: inline-block; font-size: 18px; }
.product-wrap .ChoiceWrap dl dd select {width: 100%; height: 9vw; padding-left: 2.5vw; font-size: 2.85vw; color: #666; background: url('images/icon_select_arrow.png') no-repeat 95% 50% / 6%; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #d1d1d1; border-radius: 0px; outline: none 0; box-sizing: border-box;}
.product-wrap .ChoiceWrap dl dd select::-ms-expand {display: none;}
.product-wrap .checks {position: relative;}
.product-wrap .checks input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.product-wrap .checks input[type="radio"] + label {
  display: inline-block;
  position: relative;
  padding-left: 4.5vw;
  cursor: pointer;
  color: #222;
  font-size: 2.85vw;
  font-weight: 500;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.product-wrap .checks input[type="radio"] + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6vw;
  width: 3.2vw;
  height: 3.2vw;
  text-align: center;
  background-color: #fff;
  border: 1px solid #cacece;
  border-radius: 100%;
  box-sizing: border-box;
}
.product-wrap .checks input[type="radio"] + label:active:before,
.product-wrap .checks input[type="radio"]:checked + label:active:before  {
  box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);
}
.product-wrap .checks input[type="radio"]:checked + label:after {
  content: '';
  position: absolute;
  top: 0.6vw;
  left: 0;
  width: 3.2vw;
  height: 3.2vw;
  transform: scale(0.6);
  background-color: #222;
  border-radius: 100%;
}

.product-wrap .chcekBox{display: flex; align-items: center; height: 20vw; margin-top: 2.5vw;}
.product-wrap .check-box {display: flex; align-items: center; position:relative; width: 89%; height: 100%; margin: 0 auto; padding: 5vw; border-radius: 2vw; background: linear-gradient(90deg, #d5f3fd 43%,#fff 0); border: 1px solid #cbcbcb; box-sizing: border-box;}
.product-wrap .check-box.outline {box-shadow: inset 0px 0px 0px 3px #222;}
.product-wrap .check-box p {font-size: 3.4vw; color: #555; letter-spacing: -0.04em; font-weight: 400; margin-left: 13vw;}
.product-wrap .check-box input {position:absolute; left:-1px; top:-1px; width: calc(100% + 1px); height: calc(100% + 1px); appearance: none; border-radius: 2vw; cursor:pointer;}
.product-wrap .check-box label {display:flex; align-items: center;}
.product-wrap .check-box label:before {display:inline-block; content:""; width:40px; height:40px; margin:0 4px 0 0; background-position:center; background-size:cover;}
.product-wrap .check-box label .ontionTxt{font-size: 5vw; color: #222; font-weight: 700; }
.product-wrap .check-box label .ontionTxt em{background: #222; color: #fff; font-size: 14px; padding: 0 4px; border-radius: 4px}
.product-wrap .check-box .payarea{margin-left: auto; display: flex; flex-direction: column; font-size: 26px; font-weight: bold; margin-top: 12px;}
.product-wrap .check-box .payarea .pay_item{font-size: 22px; font-weight: bold; color: #adadad; position: relative; display: flex; align-items: center; justify-content: flex-end;}
.product-wrap .check-box .payarea .pay_item:before{content: ''; display: inline-block; width: 14px; height: 14px; border-radius: 14px; background: #adadad url('images/icon_plus.png') no-repeat center center/40%; margin-right: 4px}
.product-wrap .check-box .payarea .pay_item:after{content: '¿ø'; display: inline-block; font-size: 16px; color: #adadad; font-weight: bold;}
.product-wrap .check-box .payarea .pay_item > span{font-size: 16px; color: #000; font-weight: 500; }
.product-wrap .check-box .payarea .pay_item.nobefore:before{content: none;}
.product-wrap .check-box .payarea .pay_item > span:after{content: ''; display: inline-block; width: 14px; height: 14px; border-radius: 14px; background: #adadad url('images/icon_plus.png') no-repeat center center/40%; margin:0 4px}

.product-wrap .check-box input:checked{border: 2px solid #000;}
.product-wrap .check-box input:checked ~ label p {color: #222; font-weight: 24px; font-weight: bold;}
.product-wrap .check-box input[type=checkbox] ~ label:before {background:#e5e5e5 url('images/icon_check.png') no-repeat center center/50%; width: 5vw; height: 5vw; margin-right: 1.5vw; border-radius: 50%; overflow: hidden;}
.product-wrap .check-box input[type=checkbox]:checked ~ label:before {background-color:#222;}
.product-wrap .check-box input:checked ~ .payarea .pay_item{color: #ff6012;}
.product-wrap .check-box input:checked ~ .payarea .pay_item:before{background: #ff6012 url('images/icon_plus.png') no-repeat center center/40%;}
.product-wrap .check-box input:checked ~ .payarea .pay_item:after{color: #222;}
.product-wrap .check-box input:checked ~ .payarea .pay_item > span{color: #222;}

.product-wrap .notice_area{width: 87%; margin: 0 auto; padding-top: 2vw;}
.product-wrap .notice_area ul li{position: relative; font-size: 2.85vw; color: #979797; letter-spacing: -0.025em; word-break: keep-all; margin: 0.5vw 0; padding-left: 2vw;}
.product-wrap .notice_area ul li a{text-decoration: underline;}
.product-wrap .notice_area ul li:before{content: ''; display: block; position: absolute; left: 0; top: 2vw; width: 1vw; height: 1px; background-color: #979797;}
.product-wrap .notice_area .btm{display: flex; align-items: center; margin-top: 3vw;}
.product-wrap .notice_area .btn_notice{display: block; width: 52%;}

.agree-check {position:relative; margin-left: 5vw;}
.agree-check input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.agree-check label {display:flex; align-items: center;}
.agree-check label:before {display:inline-block; content:""; width: 3.5vw; height: 3.5vw; margin-right: 1vw; background-position:center; background-size:cover;}
.agree-check label p {font-size: 3.2vw; color: #222; font-weight: 400; letter-spacing: -0.04em;}
.agree-check input:checked ~ label p {color: #222; font-weight: 500;}
.agree-check input[type=checkbox] ~ label:before {background: url('images/icon_check_arr.png') no-repeat center center/100%;}
.agree-check input[type=checkbox]:checked ~ label:before {background: url('images/icon_check_arr_on.png') no-repeat center center/100%;}

.product-wrap .btn_buySSampakArea{width: 89%; margin: 6vw auto 0;}