﻿/**************************************
formSetting
**************************************/

:root {
  --asideBgColor: #F7F7F7;
  --boxPadding : 3rem 1.5rem;
  --bottomBtnGap : 2rem;
  --bottomBtnWidth : 24rem;
  --btnWidth: 24rem;
  --btnMaxWidth: 30rem;
}

/**************************************
input
**************************************/
select{
  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[type="text"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="email"]{
  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);
}


input:read-only{ pointer-events: none;}
input[type="submit"]:read-only,
input[type="radio"]:read-only,
input[type="checkbox"]:read-only{ pointer-events: auto;}

textarea{
  display: block;
  width: 100%;
  height: 25rem;
  box-sizing: border-box;
  padding: 0.8rem var(--formLeftPadding) 0.8rem 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);
}


:placeholder-shown { color: var(--placefolderColor); font-size: var(--formFontSize);}
::-webkit-input-placeholder { color: var(--placefolderColor); font-size: var(--formFontSize);}
:-moz-placeholder { color: var(--placefolderColor); font-size: var(--formFontSize);}
::-moz-placeholder { color: var(--placefolderColor); font-size: var(--formFontSize);}
:-ms-input-placeholder { color: var(--placefolderColor); font-size: var(--formFontSize);}


input[type="radio"],
input[type="checkbox"]{vertical-align: middle;}


input[type="text"].error_input,
input[type="tel"].error_input,
input[type="number"].error_input,
input[type="password"].error_input,
input[type="email"].error_input,
select.error_input,
textarea.error_input{
  border-color: var(--errColor);
  outline-color: var(--errColor);
}

input[type="text"][disabled],
input[type="tel"][disabled],
input[type="number"][disabled],
input[type="password"][disabled],
input[type="email"][disabled],
select[disabled],
textarea[disabled]{
  background: var(--disableColor);
  border-color: var(--disableColor);
  outline-color: var(--disableColor);
  pointer-events: none;
}

select.error_input > option{background: #FFFFFF;}


input[type=checkbox] {
  display: inline-block;
  width: 1.9rem;
  height: 1.9rem;
  vertical-align: middle;
  background-color: #FFFFFF;
  background-image: url(../img/system/icon_check.svg);
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid #738994;
  cursor: pointer;
  background-size: 100%;
  transition: background-color .15s ease-in-out,background-position .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

input[type=checkbox]:checked {
  background-color: #8e4b00;
  border-color: #8e4b00;
  background-image: url(../img/system/icon_check.svg);
}
input[type=checkbox]:disabled {
  border-color: var(--disableColor);
  background-color: var(--disableColor);
  cursor: default;
}


input[type=radio] {
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  vertical-align: middle;
  background-color: #FFFFFF;
  border: 1px solid #738994;
  position: relative;
  cursor: pointer;
  transition: all .15s ease-in-out;
}
input[type=radio]:checked {
  border-color: #8e4b00;
  background-color: #FFFFFF;
}

input[type=radio]:checked:after {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: .4rem;
  left: .4rem;
  width: .9rem;
  height: .9rem;
  background-color: #8e4b00;
  border-radius: 50%;
  transition: all .15s ease-in-out;
}

input[type=radio]:disabled {
  border-color: var(--disableColor);
  cursor: default;
}


/**************************************
button
**************************************/


/*snsBtnList*/
ul.snsLoginBtnList{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 2rem 2rem;
}

ul.snsLoginBtnList > li{
  text-align: center;
}

ul.snsLoginBtnList > li > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1.5rem;
  height: 4rem;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  text-align: left;
  font-weight: 700;
  font-size: var(--fontSizeN);
  color: #FFFFFF;
  transition-property: all;
  transition-duration: 500ms;
  transition-delay: 0;
}

ul.snsLoginBtnList > li > a > figure{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 3rem;
}

ul.snsLoginBtnList > li > a > span{
  text-align: left;
}

ul.snsLoginBtnList > li img{display: block; width: 100%; height: auto;}

ul.snsLoginBtnList > li.facebook > a{background-color: #305097;}
ul.snsLoginBtnList > li.twitter > a{background-color: #1da1f2;}
ul.snsLoginBtnList > li.yahoo > a{background-color: #FF0020;}
ul.snsLoginBtnList > li.google > a{height: inherit;}
ul.snsLoginBtnList > li.google > a > img{display: block; width: 100%; height: auto;}
ul.snsLoginBtnList > li.line > a{background-color: #00c300; color: #FFFFFF;}
ul.snsLoginBtnList > li.line > a > span{color: #FFFFFF;}

ul.snsLoginBtnList > li > p{
	display: block;
	margin-top: 0.5rem;
	text-align: center;
	font-size: var(--fontSizeS);
	line-height: 2;
}




/**************************************
section
**************************************/
#userContentsOuter,
.orderContentsOuter{
  display: block;
  width: 100%;
  background-color: var(--mainBg-color);
  margin: 0 auto;
  position: relative;
}
#userContentsSection{
	display: block;
  width: 100%;
  margin: 0 auto;
  padding: 2rem 0 3rem;
	line-height: 1;
}

#orderContentsSection{
	display: block;
  width: 100%;
  margin: 0 auto;
  padding: 2rem 0 3rem;
	line-height: 1;
  background-color: var(--mainBg-color);
}

#userContentsSection .mainTTL,
#orderContentsSection .mainTTL,
.userHeadTTL{
  display: inline-block;
  font-size: 2.6rem;
  font-weight: 700;
  color: var(--sub-color);
  text-align: center;
  width: 100%;
  margin-bottom: 2.6rem;
}

#userContentsSection .mainTTL::before,
#orderContentsSection .mainTTL::before,
.userHeadTTL::before,
#userContentsSection .mainTTL::after,
#orderContentsSection .mainTTL::after,
.userHeadTTL::after{
  display: none;
}


#userContentsSection .mainTTL > span,
#orderContentsSection .mainTTL > span,
.userHeadTTL > span{
  display: block;
  padding-top: 0.5rem;
  font-size: var(--fontSizeN);
  font-family: var(--contentsOtherFont);
  text-align: center;
  letter-spacing: 0.08em;
  color: var(--txtSubColor);
}

#userContentsSection .mainTTL.left,
#orderContentsSection .mainTTL.left{text-align: left;}

#userContentsSection .mainTTL.border,
#orderContentsSection .mainTTL.border{
  padding-bottom: 2rem;
  margin-bottom: 3rem;
  border-bottom: 1px solid var(--borderColorHeavy);
}

#userContentsSection .subTTL,
#orderContentsSection .subTTL{
  display: block;
  margin: 0 auto 3rem;
  padding-bottom: 1.2rem;
  max-width: var(--contentsOuterWidth);
  border-bottom: 1px solid var(--borderColorHeavy);
  font-family: var(--contentsTitleFont);
  font-size: var(--fontSizeL);
  text-align: center;
  line-height: var(--lineHeightSmall);
  color: #2C2C2C;
}

#orderContentsSection .subTTL{
  font-size: var(--ttlFontSize);
  font-weight: 600;
}

.userHeadTTL{
  padding-top: 2rem;
  margin-bottom: 3rem;
}


#userContentsSection em,
#orderContentsSection em{
	font-style: normal;
}

#userContentsSection .textAreaWrap,
#orderContentsSection .textAreaWrap{padding: 0 var(--contentsPadding);}

#userContentsSection .formSection,
#orderContentsSection .formSection{padding: 0 var(--contentsPadding);}

#userContentsSection .formSection > .formSection{padding: 0;}

#userContentsSection .maypageInner > .formSection{padding: 0 0;}


#orderContentsSection .easyUserCaution{
	display: block;
	padding: 2rem 1rem;
	margin-bottom: 4rem;
	background-color: #F7F7F7;
	border: 2px solid #E3DFD6;
	text-align: center;
	color: #FF0000;
	font-size: var(--fontSizeN);
	line-height: 1.6;
	font-weight: 700;
}



/**************************************
bottomBtnArea
**************************************/
.bottomBtnArea{
  display: block;
  width: calc(100% - var(--contentsPadding)*2);
  margin: 4rem auto 0;
}

.bottomBtnArea > ul{
	display: block;
  width: 100%;
  margin: 0 auto;
}

.bottomBtnArea > ul > li{
	width: 100%;
	margin: 0 auto;
	max-width: var(--btnMaxWidth);
}

.bottomBtnArea > ul > li + li{ margin-top: 1rem;}


ul.otherPayBtnList{
  display: block;
  width: 100%;
  padding: 0 var(--contentsPadding);
  margin: 1.5rem auto 0;
}
ul.otherPayBtnList > li{
  display: block;
  width: 20rem;
  margin: 0 auto;
}

ul.otherPayBtnList > li + li{margin-top: 1.5rem;}

/**************************************
Login
**************************************/
#userContentsSection .loginBox{
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--contentsPadding);
}

#userContentsSection .loginBox > .loginFormSection,
#userContentsSection .loginBox > .registMoveSection{
  display: block;
  width: 100%;
  padding: 2rem 1.5rem;
  background: #fdfaf5;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

#userContentsSection .loginBox > .registMoveSection{
	margin-top: 4rem;
}


#userContentsSection .loginBox dl.loginInputBox{
  display: block;
  text-align: left;
}
#userContentsSection .loginBox dl.loginInputBox + dl.loginInputBox{margin-top: 2rem;}

#userContentsSection .loginBox dl.loginInputBox > dt{
  display: block;
  font-size: var(--fontSizeN);
  margin-bottom: 0.8rem;
	font-weight: bold;
}

#userContentsSection .loginBox dl.loginInputBox > dd{
	display: block;
	line-height: 1;
}
#userContentsSection .loginBox dl.loginInputBox > dd > input{
	display: block;
	width: 100%;
}
#userContentsSection .loginBox dl.loginInputBox > dd > .errMsg{padding-top: 0.5rem;}

#userContentsSection .loginBox dl.loginInputBox > dd.memoryPass{
	margin-top: 1rem;
}

#userContentsSection .loginBox dl.loginInputBox > dd.memoryPass .memoryPssCheck{
  display: inline-flex;
  flex-wrap: wrap;
  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;
}

#userContentsSection .loginBox dl.loginInputBox > dd.memoryPass .memoryPssCheck:hover{
  opacity: .6;
}


#userContentsSection .loginBox dl.loginInputBox > dd.memoryPass > p{
  margin-top: 1rem;
  font-size: var(--fontSizeS);
}

#userContentsSection .loginBox .memoryPassOff{
	margin-top: 3rem;
	padding-top: 3rem;
	border-top: 1px dotted var(--borderColor);
}


#userContentsSection .loginBox .memoryPassOff > p{}
#userContentsSection .loginBox .memoryPassOff > p > a{ letter-spacing: 0.05em;}

#userContentsSection .loginBox .memoryPassOff > .formSubTTL{text-align: center;}

#userContentsSection .loginBox .btnNext,
#userContentsSection .loginBox .memoryPassOff > p.btnBorder{
	display: block;
	max-width: var(--btnMaxWidth);
	margin: 2rem auto 0;
}

#userContentsSection .loginBox ul.registBtnList{
	display: block;
}

#userContentsSection .loginBox ul.registBtnList > li{
  display: block;
  padding-top: 0;
  max-width: var(--btnMaxWidth);
  margin: 0 auto;
}


#userContentsSection .loginBox ul.registBtnList > li + li{margin-top: 2rem;}

/** noRegist *********/
#userContentsSection .loginBox .noRegist{
	padding-top: 6rem;
}


/** snsLogin *********/
#userContentsSection .loginBox .snsLogin{
	margin-bottom: 3rem;
}

#userContentsSection .loginBox .snsLogin > p{
	text-align: left;
	margin-bottom: 2rem;
  font-size: var(--fontSizeN);
	line-height: var(--lineHeight);
}

#userContentsSection .loginBox ul.snsLoginBtnList{
	display: block;
}

#userContentsSection .loginBox ul.snsLoginBtnList > li{
	display: block;
	width: 100%;
	max-width: var(--btnMaxWidth);
	margin: 0 auto;
}

#userContentsSection .loginBox ul.snsLoginBtnList > li + li{margin-top: 2rem;}


/**************************************
stepFlow
**************************************/
.stepFlow{
  display: block;
  width: 100%;
  max-width: calc(100% - var(--contentsPadding));
  padding: 0 0;
  text-align: center;
  margin: 0 auto 4rem;
}


.stepFlow > ol{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: center;
  margin: 0 auto;
  position: relative;
  counter-reset: stepCnt;
  z-index: 1;
}

.stepFlow > ol::after{
content: '';
  display: block;
  width: calc(100% - 6rem);
  height: 2px;
  margin: 0;
  background-color: #CCCCCC;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 2rem;
  z-index: -1;
}

.stepFlow > ol > li{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  flex-grow: 1;
  width: 100%;
  padding-right: 3rem;
  text-align: center;
  position: relative;
}

.stepFlow > ol > li:nth-last-of-type(1){padding-right: 0;}


.stepFlow > ol > li:nth-last-of-type(1){
  margin-right: 0;
}
.stepFlow > ol > li:nth-last-of-type(1)::after{
  display: none;
}

.stepFlow > ol > li::before{
  counter-increment: stepCnt;
  content: counter(stepCnt);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  font-size: var(--fontSizeL);
  font-weight: bold;
  color: #FFFFFF;
  background: #CCCCCC;
  border: 1px solid #CCCCCC;
}
.stepFlow > ol > li.current::before{
  color: #FFFFFF;
  border-color: #8e4b00;
  background-color: #8e4b00;
}

.stepFlow > ol > li > span{
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 1.0rem;
  text-align: center;
  white-space: nowrap;
  font-weight: 500;
  color: #CCCCCC;
}
.stepFlow > ol > li.current > span{
  color: #8e4b00;
}



/**************************************
text
**************************************/
.formTTL{
  display: block;
  padding-bottom: 0.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--borderColor);
  font-size: var(--fontSizeL);
  font-weight: 700;
  line-height: var(--lineHeightSmall);
  text-align: left;
  color: var(--text-color);
}

.formTTL > span{
  display: block;
	font-size: var(--fontSizeSS);
	font-weight: 400;
  letter-spacing: inherit;
	padding-top: 0.5rem;
}




.formSubTTL{
	display: block;
	width: 100%;
	font-size: var(--fontSizeL);
  font-weight: 700;
  margin-bottom: 1.5rem;
}
.formSubTTL.Attention{color: #C41933;}

.formSubTTL > span{
	font-size: var(--fontSizeSS);
	font-weight: 400;
	padding-left: 1rem;
}


.ledeBox{
  display: block;
  width: 100%;
  max-width: calc(100vw - var(--contentsPadding) * 2);
  margin: 0 auto 2rem;
  padding: 0;
  font-size: var(--fontSizeN);
  text-align: left;
  line-height: var(--lineHeight);
}
.formTTL + .ledeBox{margin-bottom: 2rem;}

#orderContentsSection > .ledeBox{
  padding-left: var(--contentsPadding);
  padding-right: var(--contentsPadding);
}

.formTable > .formSubTTL + .ledeBox{margin-bottom: 1rem;}

.formSubTTL + .formTable > dl:nth-of-type(1){padding-top: 0;}

.ledeBox:not(.taPcCenter) p + p{margin-top: 1rem;}

.ledeBox p + p{margin-top: 1rem;}


.iconRequired{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.6rem;
  padding: 0.3rem 0.5rem 0.3rem;
  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: '必須';}

.ledeBox > p .iconRequired{margin-right: 0.5rem;}

.ledeBox p.fwBold{font-weight: 700;}


.cautionText{
  display: block;
  padding-left: 1em;
  text-indent: -1em;
}

.formTable > dl + .cautionText{margin-top: 1rem;}

.ledeBox p a,
.formSubTTL a,
.cautionText > a{
	text-decoration: underline;
}


.errMsg{
  display: block;
  color: var(--errColor);
  font-size: var(--fontSizeS);
  line-height: var(--lineHeight);
  font-weight: 700;
}

.errMsg + .cautionText{margin-top: 2rem;}


.attention{
  display: block;
  margin: 0 auto 1rem;
  color: var(--cautionColor);
  font-size: var(--fontSizeSS);
  font-weight: 700;
}

.compMsg{
  display: block;
  width: 100%;
  max-width: var(--contentsMaxWidth);
  padding: 0;
  margin: 0 auto 4rem;
  text-align: center;
  font-size: var(--fontSizeL);
  font-weight: 700;
}


.securityCodeImg{
	margin-top: 1.5rem;
	width: 100%;
}
.securityCodeImg img{display: block; width: 100%; height: auto;}


/**************************************
formInnerSection
**************************************/
.formInnerSection{
	display: block;
	width: 100%;
	margin: 0 auto;
  text-align: left;
}


.formInnerSection + .formInnerSection{
	padding-top: 3rem;
}

.formInnerSection.mb{margin-bottom: 4rem;}

.formInnerSection .formTable + .ledeBox{margin-top: 2rem;}

.formSection > .formInnerSection{
  padding: 2rem 1.5rem;
  background: #fdfaf5;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}


.formSection > .formInnerSection + .formInnerSection{
  margin-top: 2rem;
}

.formInnerSection + .formSection,
.formSection + .formInnerSection{
	margin-top: 2rem;
}




/**************************************
formTable
**************************************/
.formTable{
  display: block;
  width: 100%;
  margin: 0 auto;
}

.formTable.addInput{
	margin: 0.1rem auto 0.1rem;
  padding: 0.5rem 0.5rem;
	background-color: #f8f6ec;
}

.formTable.paymentSelect{margin-top: 3rem;}
.formTable + .formTable:not(.addInput){margin-top: 1.5rem;}
.formTable > .ledeBox{margin-bottom: 3rem;}
.formTable > dl + .ledeBox{margin-top: 2rem; margin-bottom: 2rem;}

.formTable > dl{display: block;}

.formTable > dl + dl{ margin-top: 0;}


.formTable > dl > dt{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem 0.5rem;
  width: 100%;
  padding: 1rem;
  background-color: #e7e3cf;
  font-size: var(--fontSizeN);
  font-weight: 700;
  color: var(--txtColor);
}

.formTable > dl.required > dt::after{
  content: '必須';
  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;
}


.formTable > dl > dd{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 1.5rem 1rem 2rem;
  border-bottom: 1px solid var(--borderColor);
  font-size: var(--fontSizeN);
  line-height: var(--lineHeight);
  word-break: break-all;
  text-align: left;
}

.formTable .inputArea{
	display: block;
	width: 100%;
  text-align: left;
}
.formTable .inputArea.inquiryTTLSelect{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 1rem 1rem;
}

.formTable .inputArea input{max-width: 100%;}
.formTable .inputArea select{display: inline; width: auto; max-width: 100%;}
.formTable .inputArea.inquiryTTLSelect select{display: block;}

.formTable .inputArea + .inputArea{margin-top: 1rem;}
.formTable .inputArea + .errMsg + .inputArea{margin-top: 1rem;}


.formTable .notes{font-size: var(--fontSizeS); line-height: var(--lineHeightSmall);}
.formTable .ex{font-size: var(--fontSizeS); line-height: var(--lineHeightSmall); margin-top: 1rem;}

.formTable .notes.caution{padding-left: 1em; text-indent: -1em; padding-top: 1rem;}


.formTable .inputArea > .notes{padding-top: 0.5rem; width: 100%;}
.formTable .inputArea + .notes{padding-top: 0.5rem;}
.formTable .notes + .notes{padding-top: 0.5rem;}
.formTable .errMsg + .notes{padding-top: 0.5rem;}
.formTable .notes + .inputArea{padding-top: 0.5rem;}

.formTable .inputArea + .errMsg{margin-top: 1rem; margin-bottom: -1rem;}
.formTable .searchAddr + .errMsg{margin-top: 1rem;}

.formTable .inputArea + .cautionText{padding-top: 1rem;}
.formTable .cautionText + .inputArea{margin-top: 1rem;}


.formTable .guideImg img{display: block; width: 100%; height: auto;}
.formTable .guideImg.securityCode img{display: block; width: 100%; max-width: 33rem; height: auto;}


.formTable .inputArea > .btnNext {min-width: 20rem;}
.formTable .inputArea > .btnNext > input[type="submit"]{background-image: none; height: 4rem;}
.formTable .inputArea > .btnNext.nowOrder > input[type="submit"]{height: 3rem; font-size: var(--fontSizeN);}

.formTable .inputArea > .btnNext.input{max-width: var(--btnMaxWidth); height: 4rem;}
.formTable .inputArea > .btnNext.input::after{height: 4rem;}


.formSection > .formInnerSection > .formTable > dl > dd:nth-last-of-type(1){
  border-bottom: none;
}


/* name ***************************/
.formTable .inputArea > ul.nameInput{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}

.formTable .inputArea > ul.nameInput > li{
	display: block;
  max-width: calc(50% - 0.75rem);
}
.formTable .inputArea > ul.nameInput > li + li{margin-left: 1.5rem;}


/* radioList ***************************/

.formTable .radioList{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.5rem 2rem;
}
.formTable .radioList > span{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 1.5rem 0.4rem;
}

.formTable .radioList > span > label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--radioBtnGap);
  margin-right: 2rem;
  font-size: var(--fontSizeN);
  line-height: var(--radioBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}



/* checkBox ***************************/

.formTable .checkBox{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.5rem 0.5rem;
}

.formTable .checkBox > span{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0 0.4rem;
}

.formTable .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;
}



.formTable .inputArea + .checkBox{margin-top: 1rem;}


/* birth ***************************/
.formTable .inputArea.birth{}

.formTable .inputArea.birth > ul{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}

.formTable .inputArea.birth > ul > li{
    width: calc((100% - 11rem) / 2);
}
.formTable .inputArea.birth > ul > li:nth-of-type(1){width: 11rem; padding-left: 0;}

.formTable .inputArea.birth > ul > li select{
  display: inline-block;
  width: calc(100% - 3rem);
  padding: 0 1.5rem 0 0.5rem;
  margin-right: 0.5rem;
  background-position: calc(100% - 0.7rem) center;
  text-align: center;
}


.formTable .inputArea.birth > .btnCancel{
  max-width: 10rem;
  margin: 1rem auto 0.5rem 0;
}


/* zipcode ***************************/
.formTable .inputArea.zipcode{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}
/*
.formTable .inputArea.zipcode input:nth-of-type(1){
    width: 6rem;
    margin: 0 0.8rem 0 0;
}
.formTable .inputArea.zipcode input:nth-of-type(2){
    width: 8rem;
    margin: 0 0 0 0.8rem;
}
*/

.formTable .inputArea.zipcode .searchAddr{margin-left: 1rem; min-width: 8rem;}

.formTable .inputArea.zipcode .searchAddr.btnBlack > a,
.formTable .inputArea.zipcode .searchAddr.btnBlack > span,
.formTable .inputArea.zipcode .searchAddr.btnBlack > button{
	box-shadow: none;
	height: 3.4rem;
	font-size: 1.2rem;
	padding-left: 0.8rem;
	padding-right: 0.8rem;
}

#search-result-layer{display: none;}


/* prefectures ***************************/
.formTable .inputArea.prefectures{}
.formTable .inputArea.prefectures select{ width: 12rem;}


/* telNum ***************************/
.formTable .inputArea.telNum{
  /*
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  */
}

/*
.formTable .inputArea.telNum input{
    width: 80px;
}

.formTable .inputArea.telNum input:nth-of-type(1){margin: 0 8px 0 0;}
.formTable .inputArea.telNum input:nth-of-type(2){margin: 0 8px;}
.formTable .inputArea.telNum input:nth-of-type(3){margin: 0 0 0 8px;}
*/


/* intervalDays ***************************/
.formTable .inputArea.intervalDays{
  flex-wrap: wrap;
	white-space: nowrap;
	width: 100%;
	font-size: var(--fontSizeS);
}
.formTable .inputArea.intervalDays select{
  /*
    display: inline-block;
    width: auto;
    padding: 0 3.5rem 0 1rem;
    background: url(./icon_arrow_under_black.svg) calc(100% - 1.3rem) center no-repeat #FFFFFF;
    background-size: 0.8rem auto;
    margin-right: 0.3rem;
  */
}
.formTable .inputArea.intervalDays select:nth-of-type(2n){margin-left: 0.3rem;}

.shippingDate{
	font-size: var(--fontSizeN);
  font-weight: 700;
}

/* intervalDays ***************************/
.formTable .inputArea.pointInput{
  flex-wrap: wrap;
	white-space: nowrap;
}
.formTable .inputArea.pointInput input{
  display: inline-block;
  width: 15rem;
  margin-right: 0.5rem;
}

.availablePoint{margin-bottom: 1rem;}
.availablePoint > em{font-weight: 700; font-size: var(--fontSizeN);}


/*passWord ***********************/
.formTable .inputArea.password input[type="submit"]{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 8rem;
  height: 3.4rem;
  margin-left: 1rem;
  background-color: #545454;
  border-radius: calc(var(--formHeight) / 2);
  padding: 0 1rem 0 1rem;
  font-family: var(--contentsOtherFont);
  font-weight: 400;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  cursor: pointer;
}


/**************************************
paymentSelctList
**************************************/
.paymentSelctList{
	display: block;
}

.paymentSelctList dl.paymentSelect{
	display: block;
	padding: 10px;
	border: 1px solid var(--borderColorLight);
	margin-bottom: 1rem;
  border-radius: 6px;
  background: #FFFFFF;
}
.paymentSelctList dl.paymentSelect:nth-last-child(1){margin-bottom: 0;}


.paymentSelctList dl.paymentSelect > dt{
	display: block;
}

.paymentSelctList dl.paymentSelect > dt > span{
	display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0 0.5rem;
}

.paymentSelctList dl.paymentSelect > dt > span > label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--radioBtnGap);
  font-size: var(--formFontSize);
  line-height: var(--radioBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
  font-weight: 700;
}


.paymentSelctList dl.paymentSelect > dd{
	font-size: var(--fontSizeN);
  line-height: var(--lineHeight);
	text-align: left;
}

.paymentSelctList dl.paymentSelect > dd > p{
	padding-top: 1rem;
}

.paymentSelctList dl.paymentSelect > dd > .paymentInput{
	padding-top: 1rem;
}


.paymentSelctList dl.paymentSelect > dd .paymentText{
  display: block;
  padding: 1.5rem 1rem 0 3.2rem;
  font-size: var(--fontSizeS);
  line-height: var(--lineHeight);
  text-align: left;
}
.paymentSelctList dl.paymentSelect > dd .paymentText img{max-width: 100%;}
.paymentSelctList dl.paymentSelect > dd .paymentText strong{font-weight: 700;}
.paymentSelctList dl.paymentSelect > dd .paymentText > div{padding: 0 0 1.5rem;}
.paymentSelctList dl.paymentSelect > dd #AmazonPayCv2Button2{margin-top: 1.5rem;}
.paymentSelctList dl.paymentSelect > dd .paymentText > div.txtc a{display: inline-block;}


.paymentSelctList dl.paymentSelect dd .formTable{
  padding-top: 1rem;
}

.paymentSelctList dl.paymentSelect .formTable > dl:nth-last-of-type(1) > dd{border-bottom: none; padding-bottom: 0;}


.paymentSelctList dl.paymentSelect .formTable > dl > dt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 1rem 1rem 1rem 1.5rem;
  background-color: #e7e3cf;
  font-size: var(--fontSizeN);
  font-weight: 700;
  color: #000000;
}

.paymentSelctList dl.paymentSelect .formTable > dl > dd{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 1.5rem 1.5rem;
  font-size: var(--fontSizeN);
  line-height: var(--lineHeight);
  word-break: break-all;
}

.paymentSelctList dl.paymentSelect .formTable + .formInnerSection{
  padding-top: 3rem;
}





/**************************************
kiyakkuSection
**************************************/
.kiyakkuSection{
  display: block;
  max-width: calc(100vw - var(--contentsPadding) * 2);
  margin: 0 auto;
}
.kiyakkuSection + .kiyakkuSection{
	margin-top: 2rem;
}

.formSection + .kiyakkuSection {
  padding-top: 4rem;
}

.kiyakkuSection .scrollBox{
  width: 100%;
  height: 20rem;
  overflow: hidden;
  border: 1px solid var(--borderColorLight);
}

.kiyakkuSection .scrollBox > .inner {
  display: block;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
  padding: 2rem 2rem;
  text-align: left;
  background: #fdfaf5;
}

.kiyakkuSection .scrollBox > .inner h4{
  font-size: 1.4rem;
  font-weight: 500;
  margin-bottom: 1.5rem;
  line-height: 1.4;
}

.kiyakkuSection .scrollBox > .inner h4:not(:first-child){
  padding-top: 3rem;
}

.kiyakkuSection .scrollBox > .inner p{
  font-size: 1.2rem;
  line-height: 1.6;
}
.kiyakkuSection .scrollBox > .inner p + p,
.kiyakkuSection .scrollBox > .inner ul + p{
  margin-top: 1em;
}

.kiyakkuSection .scrollBox > .inner ul{
  display: block;
  margin-top: 1rem;
}

.kiyakkuSection .scrollBox > .inner ul > li{
  font-size: 1.2rem;
  color: var(--text-color);
  line-height: 1.6;
}

.kiyakkuSection .scrollBox > .inner ul > li + li{
  margin-top: 0.5rem;
}




/**kiyakuOuterSection*******/
.kiyakuOuterSection{
	display: block;
	width: 100%;
  padding: 0 var(--contentsPadding);
	margin: 0 auto;
	font-size: var(--fontSizeS);
	line-height: 2;
}
.kiyakuOuterSection + .kiyakuOuterSection{padding-top: 4rem;}

.kiyakuOuterSection dl.signature{
  display: block;
  margin-bottom: 4rem;
  font-size: var(--fontSizeN);
  line-height: 2;
  text-align: left;
}
.kiyakuOuterSection dl.signature > dt{font-size: var(--fontSizeL); font-weight: 700;}


.kiyakuOuterSection .kiyakuTTL{
	font-size: var(--fontSizeN);
  padding-bottom: 1.5rem;
	margin-bottom: 2rem;
  border-bottom: 2px solid var(--borderColorLight);
	font-weight: 700;
}
.kiyakuOuterSection * + .kiyakuTTL{padding-top: 3rem;}


.kiyakuOuterSection .kiyakuSubTTL{
  font-size: var(--fontSizeN);
  background: #efefef;
  padding: 0.5rem 1.5rem;
  margin-bottom: 1.5rem;
}
.kiyakuOuterSection .kiyakuSubTTL + p{padding-left: 1.5rem;}

.kiyakuOuterSection p{margin-bottom: 1rem;}
.kiyakuOuterSection p:nth-last-child(1){margin-bottom: 0;}

.kiyakuOuterSection dl.kiyakuIndex{
	display: block;
	padding-top: 2rem;
	margin-bottom: 3rem;
}
.kiyakuOuterSection dl.kiyakuIndex > dt{font-weight: 700;}

.kiyakuOuterSection .kiyakuInnerSection{display: block;}
.kiyakuOuterSection .kiyakuInnerSection + .kiyakuInnerSection{padding-top: 4rem;}
.kiyakuOuterSection p + .kiyakuInnerSection{padding-top: 3rem;}

.kiyakuOuterSection .kiyakuInInnerSection{display: block; padding-left: 1.5rem;}
.kiyakuOuterSection .kiyakuInInnerSection + .kiyakuInInnerSection{padding-top: 3rem;}
.kiyakuOuterSection .kiyakuInInnerSection > dl{
  display: block;
}
.kiyakuOuterSection .kiyakuInInnerSection > dl + dl{margin-top: 1rem;}
.kiyakuOuterSection .kiyakuInInnerSection > dl > dt{font-weight: 700;}


.kiyakuOuterSection .kiyakuInnerSection h5{
  font-size: var(--fontSizeN);
  font-weight: 700;
	margin-bottom: 1rem;
}

.kiyakuOuterSection .kiyakuInnerSection h6{
  font-size: var(--fontSizeN);
  font-weight: 700;
	margin-bottom: 1rem;
}


.kiyakuOuterSection ol.numList > li{
    text-indent: -1.5em;
    padding-left: 1.5em;
}

.kiyakuOuterSection ol.buraList > li{
  display: block;
  padding-left: 3.5rem;
  position: relative;  
}
.kiyakuOuterSection ol.buraList > li > em{
  display: block;
  width: 4rem;
  text-align: center;
  position: absolute;
  left: -0.5em;
  top: 0;
}

.kiyakuOuterSection ol.dotList > li,
.kiyakuOuterSection ul.dotList > li{
    text-indent: -1em;
    padding-left: 1em;
}


.kiyakuOuterSection ol.dotList > li > ul,
.kiyakuOuterSection ul.dotList > li > ul{
  display: block;
  padding-left: 1em;
}


/**easyRegist*******/
.kiyakkuSection.easyRegist{
	margin-top: 2rem;
}

.kiyakkuSection.easyRegist .underCheckBtn{
  display: block;
  padding: 1.5rem;
	margin-top: 1rem;
	background-color: #F2F2F2;
}

.kiyakkuSection.easyRegist .underCheckBtn > span{text-align: center; font-weight: 700;}

.kiyakkuSection.easyRegist .errMsg{text-align: center; margin-top: 1rem; font-size: var(--fontSizeN);}


.kiyakkuSection .kiyakuAgreeCheck {
  display: block;
  padding: 1rem;
  margin-top: 1rem;
  background-color: #F2F2F2;
  text-align: center;
}


.kiyakkuSection .kiyakuAgreeCheck label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0 var(--checkBtnGap);
  font-size: var(--fontSizeN);
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}




/**************************************
aboutSecurity
**************************************/
.aboutSecurity{
	display: block;
	padding: 0 var(--contentsPadding);
	margin-bottom: 3rem;
	text-align: left;
}

.formSection + .aboutSecurity{margin-top: 3rem;}

.aboutSecurity > dl{}
.aboutSecurity > dl > dt{
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1.5;
	margin-bottom: 1.5rem;
}
.aboutSecurity > dl > dd{font-size: 1.2rem; line-height: 1.6;}

.aboutSecurity > dl > dd + dd{margin-top: 0.5rem;}


.aboutSecurity > dl > dd.signature{text-align: right;}

.aboutSecurity > dl > dd > a{
	text-decoration: underline;
}


/**************************************
imgTTL
**************************************/
.imgTTL{
	display: block;
	width: 100%;
	margin-bottom: 4rem;
}
.imgTTL > a{display: block; width: 100%;}

.imgTTL img{display: block; width: 100%; height: auto;}




/**************************************
dotCautionList
**************************************/
ul.dotCautionList{
	display: block;
	margin-bottom: 2rem;
	font-size: var(--fontSizeN);
	line-height: var(--lineHeight);
}
ul.dotCautionList:nth-last-child(1){margin-bottom: 0;}

ul.dotCautionList > li,
.dotCautionList > ul > li{
	display: block;
	padding-left: 1em;
	text-indent: -1em;
}

.ledeBox > p + .dotCautionList{margin-top: 1rem;}



/**************************************
cart
**************************************/
.cartNoProduct{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: calc(100% - 3rem);
  max-width: 100%;
  height: 10rem;
  margin: 2rem auto 0;
  border: 2px solid var(--borderColor);
  border-radius: 8px;
  font-size: var(--fontSizeL);
  text-align: center;
}


.cartTopTTL{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 4rem;
  margin-bottom: 2rem;
  padding: 0.8rem 1rem;
  background-color: #777;
  color: #fff;
}

.cartTopTTL .ttl{
  max-width: 100%;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.4;
}

.cartTopTTL .nextBtnUpside{display: none;}
/*
.cartTopTTL .nextBtnUpside .btnBlack{
	background: #FFFFFF;
	border-radius: 8px;
}
.cartTopTTL .nextBtnUpside .btnBlack > a{
	height: 3rem;
	font-size: 1.4rem;
	box-shadow: none;
}
*/

.sum.Upside{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
	width: 100%;
	margin: 0 auto;
	padding: 0 0 2rem;
}

.sum.downside{
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 2rem 0 2rem;
	border-bottom: 1px solid var(--borderColor);
}

.sum.downside.mg{
	width: calc(100% - 6rem);
}

.sum .upsideText{
	font-size: var(--fontSizeN);
	line-height: var(--lineHeight);
	text-align: left;
}

.sum dl.priceTotal{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  font-size: var(--fontSizeL);
  font-weight: 700;
}

.sum.Upside > .priceTotal{display: none;}


.sum dl.priceTotal > dt{
	margin-right: 1rem;
}
.sum dl.priceTotal > dd{ font-size: var(--fontSizeLL);}
.sum dl.priceTotal > dd{ font-size: var(--fontSizeLL);}
.sum dl.priceTotal > dd > span{ font-size: var(--fontSizeL);}


/**fixedPurchaseOrderPriceList *********/
.fixedPurchaseOrderPriceList{
  display: block;
  width: 100%;
  margin: 2rem auto 0;
  padding: 1.5rem 1.5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  background-color: #FFFFFF;
  transition: opacity .3s ease;
}

.fixedPurchaseOrderPriceList > dl{display: block;}

.fixedPurchaseOrderPriceList > dl > dt{
	text-align: left;
	font-size: var(--fontSizeN);
	line-height: 1;
  font-weight: 700;
	margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--borderColor);
}

.fixedPurchaseOrderPriceList > dl > dd.msg{
	font-size: var(--fontSizeS);
	text-align: left;
	line-height: var(--lineHeight);
	margin-bottom: 1rem;
}

.fixedPurchaseOrderPriceList > dl > dd.priceList{
	display: block;
  width: 100%;
}

.fixedPurchaseOrderPriceList .priceListTTL{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 0.5rem 1rem 0.5rem 1rem;
  background-color: #e7e3cf;
  font-size: var(--fontSizeS);
  font-weight: 700;
  color: #000000;
}

.fixedPurchaseOrderPriceList .priceList .singleProduct{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0 2rem;
  padding: 1rem 0;
  border-bottom: 1px dotted var(--borderColorLight);
}

.fixedPurchaseOrderPriceList .priceList .singleProduct > img{
  display: block;
  width: 4rem;
  height: auto;
}

.fixedPurchaseOrderPriceList .priceList .singleProduct > .text{
  display: block;
  width: calc(100% - 6rem);
  font-size: 1.2rem;
  line-height: 1.6;
  text-align: left;
}


.fixedPurchaseOrderPriceList .priceList .shipping{
  margin-bottom: 1rem;
}

.fixedPurchaseOrderPriceList .priceList .shipping > dl{
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f8f6ec;
  padding: 0.5rem 0.5rem;
  font-size: var(--fontSizeS);
  font-weight: 700;
}

.fixedPurchaseOrderPriceList .priceList .shipping > dl > dt::after{
  content: '：';
}




.fixedPurchaseOrderPriceList > dl > dd.priceList > dl{
	display: block;
  width: 100%;
  background: #FFFFFF;
}
.fixedPurchaseOrderPriceList > dl > dd.priceList > dl + dl{margin-top: 10px;}

.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dt{
  width: 100%;
  padding: 1rem 2rem;
  font-size: var(--fontSizeN);
  line-height: 1.4;
	text-align: center;
}
.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd{display: block;}

.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 2rem;
  font-size: var(--fontSizeN);
  line-height: 1.4;
	border-top: 1px solid var(--borderColor);
}
.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl > dt{
    display: block;
    max-width: 60%;
    text-align: left;
}
.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl > dd{
    display: block;
    max-width: 40%;
    text-align: right;
}
.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl > dd > em{
    font-size:  var(--fontSizeN);
}

.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl.result{
    padding: 2rem 2rem;
    font-size:  var(--fontSizeN);
    line-height: 1.4;
    font-weight: 700;
}

.fixedPurchaseOrderPriceList > dl > dd.priceList > dl > dd > dl.result > dd > em {
    font-size: var(--fontSizeL);
}


.fixedPurchaseOrderPriceList > dl > dd.totalPrice{
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 2rem 0 0;
}
.fixedPurchaseOrderPriceList > dl > dd.totalPrice > p{
	display: block;
	font-size: var(--fontSizeN);
	text-align: center;
	margin-bottom: 1rem;
}
.fixedPurchaseOrderPriceList > dl > dd.totalPrice > dl{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    font-size: var(--fontSizeN);
    font-weight: 700;
}

.fixedPurchaseOrderPriceList > dl > dd.totalPrice > dl > dt{
	margin-right: 1.5rem;
}
.fixedPurchaseOrderPriceList > dl > dd.totalPrice > dl > dd{
	font-size: 2rem;
}

.fixedPurchaseOrderPriceList > dl > dd.totalPrice > dl > dd > span{
	font-size: var(--fontSizeS);
}


.fixedPurchaseOrderPriceList > dl > dd.cautionList{
	display: block;
	margin-top: 1rem;
	padding-top: 2rem;
	border-top: 1px solid #CCCCCC;
	font-size: var(--fontSizeS);
}
.fixedPurchaseOrderPriceList > dl > dd.cautionList > ul{display: block;}
.fixedPurchaseOrderPriceList > dl > dd.cautionList > ul > li{
	display: block;
	padding-left: 1em;
	text-indent: -1em;
	line-height: 1.4;
	text-align: left;
}
.fixedPurchaseOrderPriceList > dl > dd.cautionList > ul > li + li{margin-top: 0.5rem;}

/**cartPaymentCaution *********/
.cartPaymentCaution{
	margin-top: 1.5rem;
	font-size: var(--fontSizeS);
	text-align: right;
}


/**cartSection *********/
.cartSection{padding: 0 0;}
.cartSection + .cartSection{padding-top: 4rem;}
.cartSection:nth-of-type(n + 2){padding-top: 4rem;}


.cartTTL{
  display: block;
  padding: 1.5rem 1rem;
  background: #e7e3cf;
  font-size: var(--fontSizeN);
  font-weight: 700;
  text-align: left;
}

.cartTTL.outer{
  display: block;
  padding: 1.5rem 1rem;
  background: none;
  border-top: 2px solid var(--borderColor);
  border-bottom: 2px solid var(--borderColor);
  text-align: left;
  font-size: var(--fontSizeL);
  font-weight: 700;
}


/**cartTable *********/
.cartTable{
  display: block;
  width: 100%;
  margin: 0 auto 0;
  padding: 0;
}

.cartTable.orderConfirm{}

.cartTable > .cartTableHead{
	display: none;
}

.cartTable > .cartTableHead > ul{}


.cartTable > ul{
	display: block;
  width: 100%;
  padding: 0;
  margin: 1.5rem auto 0;
}


.cartTable > ul > li{
  display: block;
  padding: 1rem 0.5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  background-color: #fdfaf5;
  border: 1px solid var(--borderColor);
  position: relative;
}

.cartTable > ul > li + li{margin-top: 1.5rem;}
.cartTable > ul > input + li{margin-top: 1.5rem;}


.cartTable > ul > li.setPromotionItems{padding: 0; border: none;}
.cartTable > ul > li.setPromotionItems > .cartTable > ul.setPromotion > li.setTotal{padding-bottom: 1rem;}


.cartTable > ul.setPromotion{
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  border: 1px solid var(--borderColor);
  border-radius: 6px;
  padding: 0.5rem;
}

.cartTable > ul.setPromotion > li{
  width: 100%;
  /*
  padding: 0;
  border: none;
  margin: 0;
  */
}

.cartTable > ul.setPromotion > li + li{
	margin-top: 0.5rem;
}

.cartTable > ul.setPromotion > li.setTotal{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border: none;
  margin-top: 0.5rem;
  padding: 1rem 1rem 1rem;
}

.cartTable > ul.setPromotion > li.setTotal > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
	width: 100%;
}
.cartTable > ul.setPromotion > li.setTotal > dl > dt{
  display: block;
  width: calc(100% - 14rem);
  font-size: 1rem;
  font-weight: 700;
  text-align: left;
  color: #FF0000;
  line-height: 1.4;
}
.cartTable > ul.setPromotion > li.setTotal > dl > dd{
	display: block;
	width: 14rem;
  font-size: 1rem;
	padding-left: 1rem;
  text-align: right;
}
.cartTable > ul.setPromotion > li.setTotal > dl > dd > p.slash{display: inline-block; position: relative; margin-bottom: 0.5rem;}
.cartTable > ul.setPromotion > li.setTotal > dl > dd > p.slash::after{
    content: '';
    height: 1px;
    width: 100%;
    background: #222222;
    position: absolute;
    left: 0;
    top: 50%;
}
.cartTable > ul.setPromotion > li.setTotal > dl > dd > p > em{font-weight: 700; font-size: 1.6rem; }
.cartTable > ul.setPromotion > li.setTotal > dl > dd > p.slash > em{font-weight: 700; font-size: 1.4rem; }

.cartTable > ul.setPromotion > li.setTotal > dl > dd > p.slash + p::before{content: '→'}


/** itemInfo **********/

.cartTable > ul > li .itemInfo{
  display: block;
	width: 100%;
	padding: 0;
}


.cartTable > ul > li .itemInfo + .itemInfo{
  position: relative;
}
.cartTable > ul > li .itemInfo + .itemInfo::after{
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: #e7e7e7;
  position: absolute;
  left: 0;
  top: 0;
}


.cartTable > ul > li .itemInfo .namePrice{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
	width: 100%;
	min-height: 7.5rem;
	padding: 0 0.5rem 0 9rem;
	position: relative;
}

.cartTable > ul > li .itemInfo .namePrice > figure{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 7.5rem;
	height: 100%;
	position: absolute;
	left: 0.5rem;
	top: 0;
} 

.cartTable > ul > li .itemInfo .namePrice > figure a{display: block; width: 100%;}
.cartTable > ul > li .itemInfo .namePrice > figure img{display: block; width: 100%; height: auto;}

/*特殊対応**/
.cartTable > ul > li .itemInfo .namePrice > figure > .delivType{
  display: block;
  position: absolute;
  width: 3rem;
  height: 3rem;
  top: 0;
  right: 0;
}
.cartTable > ul > li .itemInfo .namePrice > figure > .delivType::before{
  content: '';
  display: block;
  width: 100%;
  height: 100%;
}
.cartTable > ul > li .itemInfo .namePrice > figure > .delivType.normal::before{
  background: url("../img/common/icon_deliv_type_normal.svg") center center no-repeat;
  background-size: 100% auto;
}
.cartTable > ul > li .itemInfo .namePrice > figure > .delivType.cool::before{
  background: url("../img/common/icon_deliv_type_cool.svg") center center no-repeat;
  background-size: 100% auto;
}
.cartTable > ul > li .itemInfo .namePrice > figure > .delivType.frozen::before{
  background: url("../img/common/icon_deliv_type_frozen.svg") center center no-repeat;
  background-size: 100% auto;
}
/*特殊対応ここまで**/



.cartTable > ul > li .itemInfo .namePrice > .name{
	display: block;
  width: 100%;
  padding-right: 3rem;
	text-align: left;
}

.cartTable > ul > li .itemInfo .namePrice > .name a{color: var(--txtColor);}

.cartTable > ul > li .itemInfo .namePrice > .name > p{
  display: block;
  font-size: 1.2rem;
  line-height: 1.6;
}
.cartTable > ul > li .itemInfo .namePrice > .name > p + p{margin-top: 0.5rem;}


.cartTable > ul > li .itemInfo .namePrice > .name > p.attention{
  display: block;
  margin-top: 0.5rem;
  color: #C41933;
  font-size: 1rem;
  font-weight: 700;
  text-align: left;
}


.cartTable > ul > li .itemInfo .namePrice > .price{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  padding: 1rem 1rem 0 0;
  font-size: 1rem;
  text-align: right;
}

.cartTable > ul > li .itemInfo .namePrice > .price .taxRate{
  font-size: 1rem;
}
.cartTable > ul > li .itemInfo .namePrice > .price .taxRate::before{
  content: '税率';
}

.cartTable > ul > li .itemInfo .namePrice > .price > p.slash{display: inline-block; position: relative; }
.cartTable > ul > li .itemInfo .namePrice > .price > p.slash::after{
    content: '';
    height: 1px;
    width: 100%;
    background: #222222;
    position: absolute;
    left: 0;
    top: 50%;
}
.cartTable > ul > li .itemInfo .namePrice > .price > p > em{font-size: 1.4rem;}


.cartTable > ul > li .itemInfo .quantityOperation{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
	width: 100%;
	margin-top: 1rem;
	padding: 0.5rem 1rem;
	min-height: 5rem;
	background-color: #f8f6ec;
  border-radius: 6px;
}

.cartTable > ul > li .itemInfo .quantityOperation > .quantity{
	display: block;
	height: 100%;
	order: 2;
}

.cartTable > ul > li .itemInfo .quantityOperation > .quantity > dl.quantitySelect{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}
.cartTable > ul > li .itemInfo .quantityOperation > .quantity > dl.quantitySelect > dt{display: block; font-size: 1.2rem; padding-right: 1rem;}
.cartTable > ul > li .itemInfo .quantityOperation > .quantity > dl.quantitySelect > dd{ font-size: 1.2rem;}
.cartTable > ul > li .itemInfo .quantityOperation > .quantity input{text-align: center; height: 3rem; width: 4rem; line-height: 2.8rem; padding: 0;}


.cartTable > ul > li .itemInfo .quantityOperation > .subTotal{
	display: block;
	min-width: 14rem;
	margin: 0 0 0 auto;
	font-size: 1.2rem;
	font-weight: 700;
	padding-left: 0;
	order: 3;
	text-align: right;
}
.cartTable > ul > li .itemInfo .quantityOperation > .subTotal p::before{content: '小計:'; padding-right: 0.5rem;}
.cartTable > ul > li .itemInfo .quantityOperation > .subTotal p > em{font-size: 1.4rem;}


.cartTable > ul > li .itemInfo .operation{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
	order: 1;
}

.cartTable > ul > li .operation .btnDelete{
	width: 2.5rem;
  height: 2.5rem;
	margin: 0 auto;
  position: absolute;
  top: -1px;
  right: -1px;
}

.cartTable > ul > li .operation .btnDelete > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 0 6px 0 4px;
  background: url(../img/system/icon_trash.svg) center center no-repeat #CCCCCC;
  background-size: 1.2rem auto;
  font-size: 1.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
}

.cartTable > ul > li .operation .btnDelete > a > img{
  display: block;
  width: 1.0rem;
  height: auto;
  margin: 0 auto;
}

/** setItem **********/
.cartTable > ul > li .itemInfo .setItemWrap{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
	width: 100%;
}

.cartTable > ul > li .itemInfo .setItemWrap > .setItem{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
	width: 100%;
}

.cartTable > ul > li .itemInfo .setItemWrap > .setItem + .setItem{
	border-top: 1px dotted var(--borderColorLight);
}



/** noveltySelect **********/
.cartTable .noveltySelect{
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 1rem 0;
  border-bottom: 1px solid var(--borderColorLight);
  position: relative;
}

.cartTable .noveltySelect .title{
	display: block;
	width: 100%;
	padding-top: 0.5rem;
	padding: 0.5rem 0.5rem 0;
	margin-bottom: 1rem;
  font-size: var(--fontSizeN);
  font-weight: 700;
  line-height: var(--lineHeightSmall);
}
.cartTable .noveltySelect .title > span{
	display: block;
	font-size: 1rem;
}

.cartTable .noveltySelect .lede{
	display: block;
	width: 100%;
	padding: 0 0.5rem;
  font-size: var(--fontSizeS);
  line-height: var(--lineHeightSmall);
}

.cartTable .noveltySelect .lede .noveltyTTL{
	display: block;
	margin-bottom: 0.5rem;
	font-weight: 700;
}

.cartTable .noveltySelect .lede .caution{font-size: 1rem;}


.cartTable .noveltySelect .cartTable > ul > li{
	border: none;
	background: #F2F3EF;
	padding: 1rem 0.5rem;
	margin-top: 1rem;
}

.cartTable .noveltySelect .cartTable > ul > li .itemInfo .quantityOperation{background-color: inherit; padding: 0; margin: 0;}


.cartTable .noveltySelect .btnAdd{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
	padding-top: 0.1rem;
}

.cartTable .noveltySelect .btnAdd > a {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  max-width: 15rem;
  height: 3rem;
  background-color: var(--btnColor);
  border-radius: 1.5rem;
  padding: 0 1rem 0 1rem;
  font-family: var(--contentsOtherFont);
  font-weight: 400;
  font-size: var(--fontSizeS);
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  transition: opacity 0.3s ease;
}


/**************************************
dvAnnounceFreeShipping
**************************************/
.dvAnnounceFreeShipping{
	display: block;
	padding-top: 2rem;
	text-align: center;
	font-size: var(--fontSizeN);
	line-height: 1;
}
.dvAnnounceFreeShipping .defPrice{
	color: #e93b3b;
	font-size: var(--fontSizeL);
	font-weight: 700;
}
.dvAnnounceFreeShipping .freeShipping{
	
}

/**************************************
cartUnder
**************************************/
.cartUnder{
  display: block;
	width: 100%;
	margin-top: 2rem;
}

/** couponPointSelect **************/
.cartUnder .couponPointSelect{
	display: block;
	width: 100%;
	margin-bottom: 0.5rem;
  text-align: left;
}

.cartUnder .couponPointSelect > dl{
  display: block;
  width: 100%;
  margin: 0 auto 2rem;
  padding: 2rem 1.5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  background-color: #FFFFFF;
}
.cartUnder .couponPointSelect > dl + dl{margin-top: 1rem;}

.cartUnder .couponPointSelect > dl > dt{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--borderColor);
  font-size: var(--fontSizeN);
  font-weight: 700;
  line-height: var(--lineHeightSmall);
  text-align: left;
  letter-spacing: 0.1em;
  gap: 0 2rem;
}


.cartUnder .couponPointSelect > dl > dd{
  display: block;
  font-size: var(--fontSizeN);
  line-height: 1.5;
}


/** usePoint **********/
.cartUnder .usePoint{}

.cartUnder .usePoint .inputArea{
  display: block;
	padding: 1rem 0;
}

.cartUnder .usePoint .inputArea input{
  display: inline-block;
	max-width: calc(50% - 3rem);
}


.cartUnder .usePoint .inputArea .cbUseAllPointFlg{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.5rem 0.4rem;
}

.cartUnder .usePoint .inputArea .cbUseAllPointFlg label{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: calc(var(--checkBtnSize) + 1rem);
  font-size: var(--fontSizeS);
  line-height: var(--checkBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}





/*btnBlack*****/
.btnBlack > a,
.btnBlack > button,
.btnBlack > span,
.btnBlack > input[type="submit"]{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 4rem;
  background-color: #FFFFFF;
  border: 1px solid #738994;
  border-radius: calc(6rem / 2);
  padding: 0 1rem 0 1rem;
  font-weight: 500;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #738994;
  position: relative;
  transition: opacity 0.3s ease;
}


@media (hover: hover) {
  .btnBlack > a:hover,
  .btnBlack > button:hover,
  .btnBlack > span:hover,
  .btnBlack > input[type="submit"]:hover{
    opacity: .6;
  }
}

.btnBlack.disabled > a,
.btnBlack.disabled > button,
.btnBlack.disabled > span,
.btnBlack.disabled > input[type="submit"],
.btnBlack > a[disabled],
.btnBlack > button[disabled],
.btnBlack > span[disabled],
.btnBlack > input[type="submit"]{
  background: var(--disableColor);
  border-color: var(--disableColor);
  pointer-events: none;
}






/** couponSelect *************/
.cartUnder .couponSelect{}

.cartUnder .couponSelect .radioList{
  display: block;
}

.cartUnder .couponSelect .radioList > span{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.5rem 0.5rem;
}


.cartUnder .couponSelect .radioList > span > label{
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--radioBtnGap);
  margin-right: 1.5rem;
  font-size: var(--fontSizeN);
  line-height: var(--radioBtnLineHeight);
  cursor: pointer;
  position: relative;
  transition: opacity 0.3s ease;
}

.cartUnder .couponSelect .radioList > span > label:nth-last-of-type(1){margin-right: 0;}


.cartUnder .couponSelect .inputArea{
  display: block;
}
.cartUnder .couponSelect * + .inputArea{
	margin-top: 1rem;
}

.cartUnder .couponSelect .inputArea select,
.cartUnder .couponSelect .inputArea input{width: 100%;}

.cartUnder .couponSelect .couponBoxBtn{
  padding: 1rem 0 0 0;
	width: var(--btnMaxWidth);
	margin: 0 auto;
}

.cartUnder .couponSelect .couponBoxBtn > a {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 3.4rem;
  background: #000000;
  border-radius: 2rem;
  padding: 0 1rem 0 1rem;
  font-weight: 700;
  font-size: var(--fontSizeS);
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
}


/** couponBoxModal **********/
.couponBoxModal{
  display: block;
  background: rgba(0,0,0,.8);
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  padding: 0 2rem;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10001;
}

.couponBoxModal .couponList{
  display: block;
  width: calc(100% - 4rem);
  height: 80%;
  max-height: 70vh;
  max-height: 70dvh;
  overflow: hidden;
  border-radius: 8px;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.couponBoxModal .couponList > .inner{
  display: block;
  overflow: auto;
  width: 100%;
  height: calc(100% - 7rem);
  position: relative;
}
.couponBoxModal .couponList > .inner::after{
	content: '';
	display: block;
	height: 8rem;
}


.couponBoxModal .couponList > .inner > dl{
	padding: 2.5rem 2rem 2rem;
}
.couponBoxModal .couponList > .inner > dl > dt{
  display: block;
  margin-bottom: 2rem;
  font-size: var(--fontSizeL);
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

.couponBoxModal .couponList > .inner > dl > dd{
  display: block;
}

.couponBoxModal .couponList > .inner > dl > dd > dl{
  display: block;
  width: 100%;
  text-align: left;
  border: 1px solid var(--borderColor);
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  padding: 1.5rem;
}

.couponBoxModal .couponList > .inner > dl > dd > dl + dl{ margin-top: 2rem;}

.couponBoxModal .couponList > .inner > dl > dd > dl > dt{
  display: block;
  margin-bottom: 1rem;
	font-size: var(--fontSizeN);
  font-weight: 700;
}
.couponBoxModal .couponList > .inner > dl > dd > dl > dd{
	font-size: var(--fontSizeS);
	line-height: var(--lineHeight);
}

.couponBoxModal .couponList > .inner > dl > dd > dl > dd.btnNext{
	display: block;
	margin: 1rem auto 0;
}

.couponBoxModal .couponList > .inner > dl > dd > dl > dd.btnNext > a{
	height: 3rem;
	font-size: var(--fontSizeS);
	box-shadow: none;
	background-image: none;
}


.couponBoxModal .btnCouponBoxClose{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 7rem;
  margin: auto 0 0 0;
  padding: 2rem 0 2rem;
  border-top: 1px solid var(--borderColor);
  border-radius: 0 0 1rem 1rem;
}

.couponBoxModal .btnCouponBoxClose > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 24rem;
  height: 3rem;
  border-radius: 2rem;
  border: 1px solid #000000;
  background: #FFFFFF;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #000000;
}


/** subTotalBox **************/
.subTotalBox{
  display: block;
  width: 100%;
  margin: 0 auto 2rem;
  padding: 1.5rem 1.5rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  background-color: #FFFFFF;
}

.subTotalBox > .inner{
  width: 100%;
}

.subTotalBox > .inner > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 0;
  font-size: var(--fontSizeN);
  line-height: var(--lineHeightSmall);
}
.subTotalBox > .inner > dl + dl{border-top: 1px dotted var(--borderColor);}

.subTotalBox > .inner > dl.total{
	padding: 2rem 0;
  font-size: var(--fontSizeL);
	line-height: var(--lineHeightSmall);
	font-weight: 700;
}

.subTotalBox > .inner > dl > dt{
  display: block;
	max-width: 60%;
	text-align: left;
}

.subTotalBox > .inner > dl > dd{
	display: block;
	max-width: 40%;
	text-align: right;
	font-size: var(--fontSizeS);
}
.subTotalBox > .inner > dl > dd > em{font-size: var(--fontSizeN);}


.subTotalBox > .inner > dl > dd.minus{
    color: #ff0000;
}

.subTotalBox > .inner > dl.total > dd{
    font-size: var(--fontSizeN);
}
.subTotalBox > .inner > dl.total > dd > em{font-size: var(--fontSizeL);}


/**************************************
cartSelect
**************************************/
.cartTable.cartSelect > ul > li .itemInfo > .namePrice{
	display: block;
	padding-left: 8rem;
	padding-right: 6rem;
	position: relative;
}

.cartTable.cartSelect > ul > li .itemInfo > .namePrice > figure{
	display: block;
	width: 7.5rem;
	position: absolute;
	left: 5px;
	top: 0;
}

.cartTable.cartSelect > ul > li .itemInfo > .namePrice > .name{
	display: block;
  width: 100%;
	padding: 0 1.5rem 0 1rem;
}

.cartTable.cartSelect > ul > li .itemInfo > .namePrice > .price{
  width: 100%;
	padding: 0 1.5rem 0 1rem;
	margin-top: 1.5rem;
}


.cartTable.cartSelect > ul > li .itemInfo > .namePrice > .itemSlect{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 6rem;
  height: 100%;
  border-left: 1px solid #F7F7F7;
  position: absolute;
  right: 0;
  top: 0;
}

.cartTable.cartSelect > ul > li .itemInfo .namePrice > .itemSlect > dl{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
	width: 100%;
	height: 7.5rem;
  gap: 0.5rem 0.2rem;
}
.cartTable.cartSelect > ul > li .itemInfo .namePrice > .itemSlect > dl > dt{
	display: block;
	font-size: 1rem;
	margin: 0 0 0 0;
}

.cartTable.cartSelect > ul > li .itemInfo .namePrice > .itemSlect > dl > dd{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
	width: 100%;
}
.cartTable.cartSelect > ul > li .itemInfo .namePrice > .itemSlect > dl > dd > span{
	display: block;
	width: 100%;
}


.cartTable.cartSelect > ul > li .itemInfo .namePrice > .itemSlect > dl > dd label{
  display: block;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--txtColor);
  position: absolute;
  cursor: pointer;
  left: 0;
  top: 0;
}




/**************************************
orderFlowWrap
**************************************/
.paymentCartWrap{
	display: block;
}
.paymentCartWrap + .paymentCartWrap{padding-top: 6rem;}

.orderFlowWrap{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
}

.orderFlowWrap.payment{
	display: block;
	padding: 0 0 0 0;
}
.orderFlowWrap.payment .paymentInfo > .formSubTTL{display: none;}
.orderFlowWrap.payment > .paymentInfo > .ledeBox{margin-top: 2rem; margin-bottom: 1.5rem;}

.orderFlowWrap.confirm .cartInfo{order: 2;}

.orderFlowWrap.confirm .cartInfo .formSubTTL{/*display: none;*/}
.orderFlowWrap.confirm .cartInfo .orderFlowCartTTL{display: none;}


.orderFlowWrap .userInfo{
	display: block;
	width: 100%;
}

.orderFlowWrap .shippingInfoWrap{
	display: block;
	width: 100%;
}


.orderFlowWrap .userInfo + .shippingInfoWrap{margin-top: 4rem;}
.orderFlowWrap.giftOption .userInfo + .userInfo{margin-top: 4rem;}


.orderFlowWrap .shippingInfo{
	display: block;
	width: 100%;
}

.orderFlowWrap .shippingInfo + .shippingInfo{margin-top: 3rem;}


.orderFlowWrap .paymentInfo{
	display: block;
	width: 100%;
}

.orderFlowWrap .cartInfo{
	display: block;
	width: 100%;
}

.orderFlowWrap .paymentInfo + .cartInfo{margin-top: 2rem;}

.orderFlowWrap.confirm .cartInfo{
  margin-top: 1rem;
}

.orderFlowWrap .cartInfo .cartUnder{
  display: block;
  width: 100%;
  margin-top: 2rem;
}
.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect,
.orderFlowWrap .cartInfo .cartUnder > .subTotalBox{
	width: 100%;
}
.orderFlowWrap .cartInfo .cartUnder > .subTotalBox{margin-top: 1rem;}


.orderFlowWrap .cartInfo .cartUnder > ul.operation{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-end;
  width: 100%;
  padding-top: 0;
  gap: 0 1rem;
}
.orderFlowWrap .cartInfo .cartUnder > ul.operation > li{
	width: 12rem;
}


.orderFlowWrap .orderInfo{
	display: block;
	width: 100%;
	order: 1;
}
.orderFlowWrap .cartInfo + .orderInfo{margin-top: 3rem;}

.orderFlowWrap .formTable{margin-top: 0;}
.orderFlowWrap .formTable + .formTable{margin-top: 0;}
.orderFlowWrap .formTable + .formInnerSection{padding-top: 4rem;}

.paymentSelect .formTable > dl:nth-last-of-type(1){border-bottom: none;}


/***/
.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect{
  display: block;
  padding-bottom: 1rem;
}

.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect > dl + dl{margin-left: 0;}
.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect > dl:not(:nth-last-child(1)){margin-bottom: 1rem;}


.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect a.openUse{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  width: 100%;
  height: 3rem;
  background-color: var(--btnColor);
  border-radius: 1.5rem;
  padding: 0 1rem 0 1rem;
  font-weight: 400;
  font-size: var(--fontSizeS);
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  position: relative;
  transition: opacity 0.3s ease;
}
.orderFlowWrap .cartInfo .cartUnder > .couponPointSelect a.openUse:not(:nth-last-child(1)){margin-bottom: 1rem;}


/** complete ********************/
.orderFlowWrap.complete{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
}


.orderFlowWrap.complete .orderInfo{
	display: block;
	width: 100%;
	margin-top: 2rem;
}

.orderFlowWrap.complete .shippingInfo{
	display: block;
	width: 100%;
	margin-top: 2rem;
}

.orderFlowWrap.complete .shippingInfo .formTable + .formSubTTL{margin-top: 2rem;}


.orderFlowWrap.complete .cartInfo{
	display: block;
	width: 100%;
	margin-top: 2rem;
}
.orderFlowWrap.complete .cartInfo > .formSubTTL{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1rem 1rem 1rem 1rem;
  background-color: #F2F2F2;
  font-size: 1.4rem;
  font-weight: 700;
  color: #000000;
}


.orderFlowWrap.complete .confirmText table{
  margin-top: 2rem;
  font-size: 1.2rem;
  line-height: 1.6;
}

.orderFlowWrap.complete .cartUnderResult{
	display: block;
	width: 100%;
}


.cartUnderResult{
  width: 100%;
  margin-top: 2rem;
}

.cartUnderResult .pointSubTotal{
	width: 100%;
	margin-bottom: 2rem;
}

.cartUnderResult .pointSubTotal > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  width: 100%;
  padding: 1rem;
  border: 1px solid #E3DFD6;
  font-size: 1.4rem;
  font-weight: 700;
}
.cartUnderResult .pointSubTotal > dl + dl{margin-top: 1rem;}

.cartUnderResult .pointSubTotal > dl > dt{text-align: left;}
.cartUnderResult .pointSubTotal > dl > dt > span{font-size: 1.2rem; font-weight: 400;}
.cartUnderResult .pointSubTotal > dl > dd{text-align: right;}

.cartUnderResult .subTotalBox{
	width: 100%;
}



.cartTotalView{
	display: block;
	width: 100%;
	padding-top: 3rem;
	padding-bottom: 3rem;
	margin-top: 3rem;
	border-top: 1px solid #E3DFD6;
	border-bottom: 1px solid #E3DFD6;
}
.cartTotalView > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
	width: 100%;
	min-height: 6rem;
	padding: 2rem 2rem;
	border: 2px solid #E3DFD6;
	font-size: 1.6rem;
	font-weight: 700;
}
.cartTotalView > dl + dl{margin-top: 1rem;}

.cartTotalView > dl > dt{text-align: left;}
.cartTotalView > dl > dt > span{font-size: 1.4rem; font-weight: 400;}
.cartTotalView > dl > dd{text-align: right;}



/**************************************
orderInfoSection
**************************************/
.orderInfoSection{
  padding: 1.5rem 1.5rem;
  background: #fdfaf5;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	margin-bottom: 3rem;
}
.orderInfoSection:nth-last-child(1){margin-bottom: 0;}

.orderInfoSection .operation{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding-top: 1.5rem;
  grid-area: 0 1rem;
}

.orderInfoSection .operation .underCheckBtn{
	text-align: left;
	margin: 0;
	padding: 0;
}

.orderInfoSection .operation .btnChange{
	width: 12rem;
	margin: 0 0 0 auto;
	padding: 0;
}



/**************************************
orderConfirmUnderText
**************************************/
.orderConfirmUnderText{
	display: block;
	margin: 4rem auto 0;
	border: 1px solid var(--borderColorLight);
	padding: 1.5rem;
	font-size: var(--fontSizeS);
	line-height: var(--lineHeight);
}

.orderConfirmUnderText > p{
	margin-bottom: 2rem;
	text-align: left;
}

.orderConfirmUnderText > dl{
	text-align: center;
	text-align: left;
}

.orderConfirmUnderText > dl > dt{font-weight: 700; margin-bottom: 0.5rem;}
.orderConfirmUnderText > dl > dd.caution{
	text-indent: -1em;
	padding-left: 1em;
}

.orderConfirmUnderText > dl > dd strong{font-weight: 700;}
.orderConfirmUnderText > dl > dd + dd{margin-top: 0.5rem;}




/**************************************
orderFlowCart
**************************************/
.orderFlowCartTTL{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 1rem 1rem 1rem 1rem;
  background-color: #F2F2F2;
  font-size: var(--fontSizeN);
  font-weight: 700;
  color: #000000;
}

.orderFlowWrap.giftOption .userInfo .orderFlowCartTTL:not(.sub){
  background: #333333;
  color: #FFFFFF;
}

.orderFlowCartTTL.sub{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  padding: 2rem 0 2rem 0;
  background: none;
  border-top: 1px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
  text-align: left;
  font-size: var(--fontSizeN);
  font-weight: 700;
}

.orderFlowCartTTL.outer{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 4rem;
  border: none;
  margin-bottom: 2rem;
  padding: 0 1.5rem;
  background: #e7e3cf;
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
}


.orderFlowCartTTL > a{
	margin: 0 0 0 auto;
	font-size: var(--fontSizeS);
	font-weight: 400;
	text-decoration: underline;
	color: var(--txtColor);
}

.orderFlowWrap.giftOption .userInfo .orderFlowCartTTL:not(.sub) > a{color: #FFFFFF;}


.cartTableMini{
  display: block;
  width: 100%;
  margin: 0 auto 2rem;
  padding: 1rem 1.5rem 2rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  background-color: #FFFFFF;
  transition: opacity .3s ease;
}

.cartTableMini > ul{
	display: block;
}

.cartTableMini > ul > li:not(.setItems){
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  width: 100%;
  margin: 0 auto;
  padding: 1rem;
  border-bottom: 2px solid #F2F2F2;
  position: relative;
}

.cartTableMini > ul > li > figure{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 7.5rem;
  aspect-ratio: 1/1;
  position: relative;
}

.cartTableMini > ul > li > figure a{display: block; width: 100%; height: 100%; object-fit: cover;}

.cartTableMini > ul > li > figure img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.cartTableMini > ul > li > .name{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: calc(100% - 7.5rem);
  text-align: left;
  padding-left: 1rem;
}

.cartTableMini > ul > li > .name a{color: var(--txtColor);;}

.cartTableMini > ul > li > .name > p{
  display: block;
  font-size: var(--fontSizeS);
  line-height: var(--lineHeight);
}
.cartTableMini > ul > li > .name > p + p{margin-top: 0.5rem;}


.cartTableMini > ul > li > .name > .quantityPrice{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
	text-align: right;
	width: 100%;
	padding-top: 1.5rem;
}

.cartTableMini > ul > li > .name > .quantityPrice > .quantity{
	font-size:  var(--fontSizeS);
	padding-right: 2rem;
}
.cartTableMini > ul > li > .name > .quantityPrice > .price{
	font-size: var(--fontSizeS);
}
.cartTableMini > ul > li > .name > .quantityPrice > .price > em{font-size: var(--fontSizeN); font-weight: 700;}



/** set *****/
.cartTableMini dl.setPromotion{
	display: block;
	margin-top: 1px;
	border-top:  1px solid var(--borderColorLight);
	border-bottom: 1px solid var(--borderColorLight);
}

.cartTableMini dl.setPromotion > dt{
	display: block;
	padding: 1rem;
	font-size: var(--fontSizeS);
	line-height: 1;
	border-bottom: 1px dotted var(--borderColorLight);
}

.cartTableMini dl.setPromotion > dd.itemInfo{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  width: 100%;
  margin: 0 auto;
  padding: 1rem;
  border-bottom: 1px solid var(--borderColorLight);
  position: relative;
}

.cartTableMini dl.setPromotion > dd.itemInfo > figure{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 7.5rem;
  aspect-ratio: 1/1;
  position: relative;
}

.cartTableMini dl.setPromotion > dd.itemInfo a{display: block; width: 100%; height: 100%; object-fit: cover;}

.cartTableMini dl.setPromotion > dd.itemInfo img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*特殊対応**/
.cartTableMini dl.setPromotion > dd.itemInfo > figure > .delivType{
  display: block;
  position: absolute;
  width: 2rem;
  height: 2rem;
  top: 0;
  right: 0;
}
.cartTableMini dl.setPromotion > dd.itemInfo > figure > .delivType::before{
  content: '';
  display: block;
  width: 100%;
  height: 100%;
}
.cartTableMini dl.setPromotion > dd.itemInfo > figure > .delivType.normal::before{
  background: url("../img/common/icon_deliv_type_normal.svg") center center no-repeat;
  background-size: 100% auto;
}
.cartTableMini dl.setPromotion > dd.itemInfo > figure > .delivType.cool::before{
  background: url("../img/common/icon_deliv_type_cool.svg") center center no-repeat;
  background-size: 100% auto;
}
.cartTableMini dl.setPromotion > dd.itemInfo > figure > .delivType.frozen::before{
  background: url("../img/common/icon_deliv_type_frozen.svg") center center no-repeat;
  background-size: 100% auto;
}
/*特殊対応ここまで**/


.cartTableMini dl.setPromotion > dd.itemInfo > .name{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: calc(100% - 7.5rem);
  text-align: left;
  padding-left: 1rem;
  font-size: 1rem;
  line-height: 1.4;
}

.cartTableMini dl.setPromotion > dd.itemInfo > .name > p{
    display: block;
    font-size: var(--fontSizeS);
    line-height: var(--lineHeight);
}
.cartTableMini dl.setPromotion > dd.itemInfo > .name > p + p{margin-top: 0.5rem;}

.cartTableMini dl.setPromotion > dd.itemInfo > .name > p.brandName{
    color: #888888;
    font-size: 1rem;
}

.cartTableMini dl.setPromotion > dd.itemInfo > .name > .quantityPrice{
  display: flex;
  flex-wrap: nowrap;
  lign-items: center;
  justify-content: flex-end;
  text-align: right;
  width: 100%;
  padding-top: 1.5rem;
}

.cartTableMini dl.setPromotion > dd.itemInfo > .name > .quantityPrice > .quantity{
	font-size: var(--fontSizeS);
	padding-right: 2rem;
}
.cartTableMini dl.setPromotion > dd.itemInfo > .name > .quantityPrice > .price{
	font-size: var(--fontSizeS);
}

.cartTableMini dl.setPromotion > dd.setPrice{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  font-size: 1rem;
	padding: 1rem 1rem 1rem 1rem;
}

.cartTableMini dl.setPromotion > dd.setPrice > .slash{
	text-decoration: line-through;
}
.cartTableMini dl.setPromotion > dd.setPrice > p:not(.slash) > em{font-size: var(--fontSizeN); font-weight: 700;}
.cartTableMini dl.setPromotion > dd.setPrice > .slash + p::before{ content: '→'; display: inline-block; padding: 0 0.5rem;}

.cartTableMini dl.setPromotion > dd.setPrice > p.setPromotionTerm{
  width: 100%;
  text-align: left;
  margin: 0 auto 0 0;
}


/**************************************
underCheckBtn
**************************************/
.underCheckBtn{
	display: block;
	padding: 1.5rem 0 3rem;
}

.paymentCartWrap .ledeBox + .underCheckBtn{padding: 0 1rem 3rem;}


.underCheckBtn > span{
	display: block;
	text-align: right;
}
.underCheckBtn > span.left{text-align: left;}

.underCheckBtn > span > input{
  display: none;
}

.underCheckBtn > 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;
}


.underCheckBtn > span > 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;
}

.underCheckBtn > 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;
}

.underCheckBtn > span > input:checked + label{}

.underCheckBtn > span > input:checked + label::before{background: var(--checkBtnCheckedBg);}
.underCheckBtn > span > input:checked + label::after{opacity: 1;}


/**************************************
copyCheckBtn
**************************************/
.copyCheckBtn{
  display: block;
}

.copyCheckBtn > span{
	display: block;
  padding: 1.5rem 1rem;
  margin-bottom: 3rem;
  border: 1px solid var(--borderColor);
}

.copyCheckBtn > span > input{
    display: none;
}

.copyCheckBtn > 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;
}

.copyCheckBtn > span > 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;
}

.copyCheckBtn > 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;
}

.copyCheckBtn > span > input:checked + label{}
.copyCheckBtn > span > input:checked + label::before{background: var(--checkBtnCheckedBg);}
.copyCheckBtn > span > input:checked + label::after{opacity: 1;}


/**************************************
innerForm
**************************************/
.formTable .formInnerTable{
	display: block;
	width: 100%;
}

.formTable .formInnerTable > dl{display: block; padding-top: 1rem;}


.formTable .formInnerTable > dl > dt{
	font-weight: 700;
	margin-bottom: 0.2rem;
}
.formTable .formInnerTable > dl > dt + dt{margin-top: 1.5rem;}


.formTable .innerForm > dl{display: block; padding-top: 1rem;}
.formTable .innerForm > dl > dt{
	font-weight: 700;
	margin-bottom: 0.2rem;
}

.formTable .formInnerTable > dl.required > dt{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem 0.5rem;
}

.formTable .formInnerTable > dl.required > dt::after{
  content: '必須';
  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;
}

.formTable .formInnerTable > dl > dd > .confirmText + .btnChange{width: 15rem;}

.formTable .innerForm > dl{display: block; padding-top: 1rem;}
.formTable .innerForm > dl > dt{
	font-weight: 700;
	margin-bottom: 0.2rem;
}

/* plusChangeBtn ***************************/
.formTable .plusBtn{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
	width: 100%;
	min-height: 4rem;
}

.formTable .plusBtn > p:nth-of-type(1),
.formTable .plusBtn > div:nth-child(1){
  width: calc(100% - 15rem);
  padding-right: 1rem;
}
.formTable .plusBtn > p > span.notes{display: block;}

.formTable .plusBtn .btnChange,
.formTable .plusBtn .btnCancel{width: 14rem; padding: 0; font-size: 1rem;}


.formTable .plusBtn .btnChange,
.formTable .plusBtn .btnCancel{width: 14rem; padding: 0; font-size: 1rem;}

.formTable .plusBtn .btnChange > a,
.formTable .plusBtn .btnChange > button,
.formTable .plusBtn .btnChange > span,
.formTable .plusBtn .btnChange > input[type="submit"],
.formTable .plusBtn .btnCancel > a,
.formTable .plusBtn .btnCancel > button,
.formTable .plusBtn .btnCancel > span,
.formTable .plusBtn .btnCancel > input[type="submit"]{
  font-size: 1.2rem;
}


.formTable .plusBtn .btnChange > * + *,
.formTable .plusBtn .btnCancel > * + *{
	margin-top: 1rem;
}

.formTable .plusBtn + .plusBtn{margin-top: 1rem;}
.formTable p + .plusBtn{margin-top: 1rem;}

.formTable .plusBtn + .notes{margin-top: 1rem;}
.formTable .plusBtn + .errMsg{margin-top: 1rem;}

.formTable .plusBtn .notes{font-size: var(--fontSizeSS);}

#orderHistoryDetail .changeInputArea{background: #f7f7f7;}

/**************************************
orderCombineSelectlist
**************************************/
.orderCombineSelectlist{display: block;}


.orderCombineSelectlist > ul{display: block;}
.orderCombineSelectlist > ul > li{
	display: block;
	width: 100%;
	text-align: left;
}

.orderCombineSelectlist > ul > li + li{
	margin-top: 1rem;
}

.orderCombineSelectlist > ul > li > label{
	display: block;
	width: 100%;
	border: 1px solid var(--borderColor);
	border-radius: 8px;
  overflow: hidden;
}


.orderCombineSelectlist > ul > li > label > input{display: none;}

.orderCombineSelectlist > ul > li > label > input + span{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 var(--checkBtnGap);
  padding: 2rem 1.5rem;
  font-size: var(--formFontSize);
  line-height: var(--checkBtnLineHeight);
  position: relative;
  cursor: pointer;
}

.orderCombineSelectlist > ul > li > label > input + span::before{
  content: '';
  display: block;
  width: var(--checkBtnSize);
  height: var(--checkBtnSize);
  border: var(--checkBtnBorder);
  border-radius: var(--checkBtnRadius);
  background: var(--checkBtnBg);
  transition: background 0.3s ease;
}

.orderCombineSelectlist > ul > li > label > input + span::after {
  content: '';
  display: block;
  width: var(--checkBtnSize);
  height: var(--checkBtnSize);
  background: var(--checkIconBg);
  background-size: var(--checkIconWidth) auto;
  position: absolute;
  left: 1.5rem;
  top: 2rem;
  opacity: 1;
}

.orderCombineSelectlist > ul > li > label > input:checked + span{background: #FFFFFF;}
.orderCombineSelectlist > ul > li > label > input:checked + span::before{
  background: var(--checkBtnCheckedBg);
}


.orderCombineSelectlist > ul > li > label > .combineItemInfo{
	display: block;
  padding: 0;
	border-radius: 0 0 8px 8px;
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 0.3s ease;
}

.orderCombineSelectlist > ul > li > label > input:checked + span + .combineItemInfo{
  height: auto;
	padding: 0 2rem 2rem 4.7rem;
  opacity: 1;
}

.orderCombineSelectlist > ul > li > label > .combineItemInfo .combineItemTTL{
  display: block;
	border-top: 1px solid var(--borderColorHeavy);
  padding-top: 2rem;
  padding-bottom: 2rem;
  font-weight: 700;
	font-size: var(--fontSizeN);
}

.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
	padding-top: 1.5rem;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	border-top: 1px solid var(--borderColorLight);
	font-size: var(--fontSizeS);
	line-height: var(--lineHeightSmall);
}

.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl.items{
	display: block;
}

.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl + dl{
	margin-top: 1.5rem;
	border-top: 1px solid var(--borderColorLight);
}

.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dt{
	display: block;
	width: 9.5rem;
	font-weight: 700;
}
.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl.items > dt{margin-bottom: 1rem;}


.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dd{
	display: block;
	width: calc(100% - 9.5rem);
}
.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl.items > dd{width: 100%;}


.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dd > ul{
	display: block;
}
.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dd > ul > li{
	padding-left: 1.4em;
	text-indent: -1.4em;
}
.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dd > ul > li::before{content: '●'; margin-right: 0.4em;}

.orderCombineSelectlist > ul > li > label > .combineItemInfo > dl > dd > ul > li + li{margin-top: 8px;}



/**************************************
dvSocialLoginCooperation
**************************************/

.dvSocialLoginCooperation{
	display: block;
	width: 100%;
}

.dvSocialLoginCooperation > ul{
  display: block;
	width: 100%;
	padding: 0 2rem;
}

.dvSocialLoginCooperation > ul > li{
	display: block;
	width: 100%;
}
.dvSocialLoginCooperation > ul > li + li{margin-top: 2rem;}

.dvSocialLoginCooperation > ul > li > a{
	display: block;
  height: 4rem;
  text-align: center;
  font-weight: bold;
  font-size: 1.2rem;
  color: #FFFFFF;
}

.dvSocialLoginCooperation > ul > li.facebook > a{background-color: #305097;}
.dvSocialLoginCooperation > ul > li.twitter > a{background-color: #1da1f2;}
.dvSocialLoginCooperation > ul > li.yahoo > a{background-color: #FF0020;}
.dvSocialLoginCooperation > ul > li.google > a{height: inherit;}
.dvSocialLoginCooperation > ul > li.google > a > img{display: block; width: 100%; height: auto;}
.dvSocialLoginCooperation > ul > li.line > a{background-color: #00c300;}

.dvSocialLoginCooperation > ul > li > p{
	display: block;
	margin-top: 0.5rem;
	text-align: center;
	font-size: 1.2rem;
	line-height: 1.4;
}







/**************************************
completeInfo
**************************************/
.completeInfo{
	display: block;
	width: 100%;
	margin: 0 auto 2rem;
	text-align: left;
	font-size: var(--fontSizeN);
	line-height: var(--lineHeightBig);
}

.completeTitle{
  font-size: var(--fontSizeL);
  margin-bottom: 2rem;
  font-weight: 700;
  text-align: center;
}

.completeInfo > p + p{margin-top: 1rem;}

.completeInfo .orderResultBox{
  display: block;
  width: 100%;
  max-width: var(--contentsSmallWidh);
  margin: 0 auto 2rem;
  padding: 2rem 1.5rem;
  background: #FFFFFF;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  font-size: var(--fontSizeN);
  font-weight: 700;
  text-align: center;
}

.completeInfo .orderResultBox > p + p{margin-top: 0.5rem;}

.receptionInfo{
	display: block;
  max-width: var(--contentsSmallWidh);
  margin: 0 auto;
  padding: 2rem 1.5rem;
  background: #fdfaf5;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	font-size: var(--fontSizeN);
	text-align: center;
	line-height: var(--lineHeightBig);
}

/**************************************
operation amazon
**************************************/
.operation.amazon{
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-end;
  width: 100%;
  padding-top: 1.5rem;
	padding-bottom: 2rem;
}

.operation.amazon .btnBorder{
	width: 15rem;
}

.operation.amazon .btnBorder > a {
  height: 4rem;
  box-shadow: none;
  font-size: 1.4rem;
}

/**************************************
.cartCompleteWrap
**************************************/
.cartCompleteWrap + .cartCompleteWrap{margin-top: 4rem;}

/**************************************
accordionDD
**************************************/
.accordionDD{padding-top: 1rem;}




/**************************************
inquiryCaution
**************************************/
dl.inquiryCaution{
	display: block;
	width: calc(100% - 5rem);
	padding: 1rem;
	margin: 0 auto 3rem;
	background-color: #F2F2F2;
	text-align: center;
}

dl.inquiryCaution > dt{
	display: block;
	font-size: 1.4rem;
	margin-bottom: 0.5rem;
	line-height: 1.4;
}

dl.inquiryCaution > dd{
	display: block;
	font-size: 1.4rem;
}

dl.inquiryCaution > dd > a{
    text-decoration: underline;
}

/**************************************
AmazonPay
**************************************/

.orderFlowWrap:not(.noRegist) .userInfo .formTable > dl.formInTerms > dt{
  padding-top: 1rem;  
}
.orderFlowWrap:not(.noRegist) .userInfo .formTable > dl.formInTerms > dd .kiyakkuSection{
  margin-top: 1rem;
}

.orderFlowWrap:not(.noRegist) .userInfo .formTable > dl.formInTerms > dd .kiyakkuSection .forminKiyakuLede{
  margin-bottom: 1rem;
  font-size: var(--fontSizeS);
  font-weight: 700;
}

.formTable > dl > dt > .btnChange{
  margin: 0 0 0 auto;
}

.formTable > dl > dd .amazonPayCardInfo{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem 2rem;
  white-space: nowrap;
  font-weight: 700;
}
.formTable > dl > dd .amazonPayCardInfo > img{
  display: block;
  width: 4rem;
}




/**************************************
modal
**************************************/
#modal{
	display: none;
	position: fixed;
	z-index: 1;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0,0,0,0.7);
}
#modal_content{
	width:500px;
	background:#fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
	padding:20px;
	text-align: center;
	position:relative;
	animation:animatetop 0.4s;
}

#modal_content #authcodeinput p{
  text-align: center;
  margin: 10px 0;
}

#modal_content #authcodeinput p.input_code{
  margin: 20px 0;
}

#modal_content #telnuminput p{
	text-align: center;
	margin: 10px 0;
}

#modal_content #telnuminput p.input_code{
	margin: 20px 0;
}

#modal_content .btn_submit{
  margin-bottom: 10px;
}

#modal_content .btn_close_wrap{
  text-align: right;
}

#modal_content .title{
	text-align: center;
	margin: 10px 0;
	color: #ffffff;
	background: #000000;
	padding: 12px 17px;
}

#modal_content .modal_detail{
	margin: 5px 0;
	padding: 2px 10px;
}

#modal_content .modal_text{
	text-align: left;
}

#modal_content .toolTip {
	margin: 0px;
	padding: 20px;
	border-radius: 10px;
	top: 108px;
	left:125px;
	width: 285px;
	text-align: center;
	color: rgb(255, 255, 255);
	overflow: hidden;
	display: none;
	position: fixed;
	z-index: 9000000;
	-ms-zoom: 1;
	box-sizing: border-box;
	opacity: 0.9;
	color: #000;
	background-color: #ccc;
	-moz-border-radius: 5px;
}

@keyframes animatetop{
	from{top:-100px;opacity:0}
	to{top:0;opacity:1}
}

.authentication_success {
	color: #4db56a;
}

#modalRecommend {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(128, 128, 128, 0.75);
	z-index: 1;
}

#modalRecommend .modal-content {
	overflow-y: auto;
	position: absolute;
	width: 50%;
	height: 90%;
	background: #fff;
	top: 5%;
	left: 25%;
}

#modalRecommend div.btmbtn {
	margin: 40px 0 20px 0;
	border-top: none;
}

#modalRecommend .btn-success {
	margin-right: 20px;
}

#modalRecommend div.btmbtn.below ul {
	top: 0;
}

#modalRecommend div.btmbtn .btn-large {
	padding: 12px 17px;
}

.btn-recommend-close {
	padding: 5px 1.2rem;
	font-weight: 600;
	position: absolute;
	top: -40px;
	right: 0;
	background: #ccc;
	border-radius: 0 0 3px 3px;
}




/**************************************
goRegistBox
**************************************/
.goRegistBox{
  display: block;
  width: 100%;
  margin: 3rem auto 0;
  padding: 1rem;
  border: 2px solid var(--cautionColor);
  font-weight: 700;
  font-size: var(--fontSizeN);
  text-align: center;
}

.goRegistBox .bottomBtnArea{margin-top: 1rem;}



/**************************************
shippingSelectWrap
**************************************/
.orderFlowCartTTL.outer.shipping{margin-top: 2rem;}

.orderFlowWrap.shipping.giftOption .userInfo{margin-bottom: 4rem;}

.shippingSelectWrap{width: 100%;}


.shippingSelectWrap .cartSection{
  display: block;
  width: 100%;
}

.shippingSelectWrap .cartSection .orderFlowCartTTL{display: none;}

.shippingSelectWrap .subTotalBox{width: 100%;}
.shippingSelectWrap .subTotalBox > .inner > dl.total.shipping{border-top: none;}
.shippingSelectWrap .subTotalBox > .inner > dl.total.shipping.notGift{display: none;}
.shippingSelectWrap .subTotalBox > .inner > dl.total.shipping.notGift + dl{border-top: none;}

.shippingSelectWrap .shippingSelect{
  display: block;
  width: 100%;
  padding-top: 2rem;
}

.shippingSelectWrap .shippingSelect > .errMsg{margin-bottom: 0.5rem;}

.shippingSelectWrap .shippingSelect > .errMsg.invalidInputError{
  display: block;
  font-size: 1.4rem;
  margin-bottom: 1rem;
}

/*inputArea ***/
.shippingSelectWrap .inputArea + .confirmText{
  margin-top: 1rem;
  font-size: 1.3rem;
}
.shippingSelectWrap .inputArea + .confirmText > p + p{
  margin-top: 0.5rem;
}


/*shippingInfoTTL **/
.shippingSelectWrap .shippingSelect .shippingInfoTTL:not(.notGift){
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1rem;
}

.shippingSelectWrap .shippingSelect .shippingInfoTTL:not(.notGift) .formSubTTL{padding: 0; margin: 0;}

.shippingSelectWrap .shippingSelect .shippingInfoTTL .btnNext{
  width: 26rem;
}

.shippingSelectWrap .shippingSelect .shippingInfoTTL .btnNext > a{
  height: 3rem;
  font-size: 1.2rem;
  padding-top: 0.1rem;
}

/*shippingLineTTLBox **/
.shippingSelectWrap .shippingLineTTLBox{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 1rem 1rem 1.5rem;
  background-color: #F2F2F2;
  font-size: 1.4rem;
  font-weight: 700;
}

.shippingSelectWrap .shippingLineTTLBox > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 10rem;
  height: 3rem;
  border-radius: 1.5rem;
  background: #555555;
  font-size: 1.2rem;
  font-weight: 500;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #FFFFFF;
  cursor: pointer;
}

.shippingSelectWrap .shippingLineTTLBox > a::before {
  content: '';
  display: block;
  width: 2.8rem;
  height: 2.8rem;
  background: url(../img/system/icon_trash.svg) center center no-repeat;
  background-size: auto 50%;
}


/*shippingItemList */
.shippingSelectWrap .shippingItemList{}
.shippingSelectWrap .shippingItemList > ul{display: block;}

.shippingSelectWrap .shippingItemList > ul > li{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  padding: 1rem 1rem;
  border-bottom: 1px solid #F2F2F2;
}
.shippingSelectWrap .shippingItemList > ul > li > .img{
  display: block;
  width: 6rem;
}
.shippingSelectWrap .shippingItemList > ul > li > .img a,
.shippingSelectWrap .shippingItemList > ul > li > .img img{display: block; width: 100%; height: auto;}

.shippingSelectWrap .shippingItemList > ul > li > .text{
  display: block;
  width: calc(100% - 6rem);
  padding: 0 1rem;
  font-size: 1.2rem;
  line-height: 1.4;
}

.shippingSelectWrap .shippingItemList > ul > li > .text .name{font-weight: 700;}
.shippingSelectWrap .shippingItemList > ul > li > .text ul{margin-top: 0.5rem;}



.shippingSelectWrap .shippingItemList > ul > li > .quantityBox{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 1rem;
}

.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 10.4rem;
  gap: 0 0.2rem;
}
.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > input[type="text"],
.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > input[type="tel"],
.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > input[type="number"],
.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > input[type="password"],
.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > input[type="email"] {
  display: block;
  height: 3rem;
  width: 4rem;
  padding: 0;
  text-align: center;
  line-height: calc(3rem - 2px);
  font-size: 1.2rem;
}

.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  background: var(--formBgColor);
  border-radius: var(--formBgRadius);
  border: var(--formBorder);
  font-size: 1.6rem;
  line-height: 1;
}

.shippingSelectWrap .shippingItemList > ul > li > .quantityBox .quantityInput > a:nth-of-type(3){display: none;}

.shippingSelectWrap .shippingItemList > ul > li dl.price{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  width: 10rem;
  font-size: 1.2rem;
  white-space: nowrap;
}

.shippingSelectWrap .shippingItemList > ul > li dl.price > dt{}
.shippingSelectWrap .shippingItemList > ul > li dl.price > dt::after{content: '：';}
.shippingSelectWrap .shippingItemList > ul > li dl.price > dd{font-weight: 700;}

/*shippingOneLine */
.shippingSelectWrap .shippingSelect .shippingOneLine + .shippingOneLine{
  margin-top: 4rem;
}



/*shippingInfo :not gift form */
.shippingSelectWrap .shippingSelect .shippingOneLine:not(.gift) .formTable > dl{
	display: block;
  border-top: none;
	border-bottom: 2px solid #F2F2F2;
}

.shippingSelectWrap .shippingSelect .shippingOneLine:not(.gift) .formTable > dl > dt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  padding: 1rem 1rem 1rem 1.5rem;
  background-color: #F2F2F2;
  font-size: 1.4rem;
  font-weight: 700;
  color: #000000;
}

.shippingSelectWrap .shippingSelect .shippingOneLine:not(.gift) .formTable > dl > dd{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 1.5rem 1.5rem;
  font-size: 1.4rem;
  line-height: 1.6;
  word-break: break-all;
}

.shippingSelectWrap .shippingSelect .shippingOneLine:not(.gift) .formTable .formTable + .formInnerSection{
  padding-top: 3rem;
}



/*shippingInfo  gift form */
.shippingSelectWrap .shippingSelect .shippingOneLine .formTable + .formTable{margin: 0;}

.shippingSelectWrap .shippingSelect .shippingOneLine.gift .formTable > dl{
}

.shippingSelectWrap .shippingSelect .shippingOneLine.gift .formTable > dl > dt {
  font-size: 1.4rem;
}

.shippingSelectWrap .shippingSelect .shippingOneLine.gift .formTable > dl > dd{
}


.shippingSelectWrap .shippingSelect .shippingOneLine .formInnerSection{padding-top: 1rem;}











/**************************************
orverRide
**************************************/
.pcView{display: none!important;}


#ctl00_ContentPlaceHolder1_cvPasswordConf{display: block; margin-top: 1rem;}

