.wrap{padding: 0 20px;}

body.gray{background: #F5F7FC;}
body.fixed{overflow: hidden;}

.wrap.gridWrap{display: flex; flex-direction: column; height: 100vh;}
.wrap > *:nth-last-of-type(1){flex-grow: 1; position: relative; overflow: hidden;}
.wrap.gridWrap > .headfootFix_contents{height: calc( 100vh - 156px ); overflow-y: auto; width: 100%; position: relative;   scrollbar-width: none;  }
.wrap.gridWrap > .headfootFix_contents.tab{height: calc( 100vh - 204px ); }
.wrap.gridWrap > .headfootFix_contents.nMargin{margin:0 -20px; width: auto;}
.wrap.gridWrap > .headfootFix_contents.res{height: calc( 100vh - 156px ); margin: 0 -20px; width: auto;}


.gnb_wrap{display: none; width: 100%; height: 100vh; position: fixed !important; top: 0; left: 0; z-index: 1000; background: #fff;}
.gnb_wrap .navTop{height: 60px; padding: 18px 20px; text-align: right;}
.gnb_wrap .navHead{margin:20px 32px 0;}
.gnb_wrap .navHead .name_wrap{display: flex; justify-content: space-between;}
.gnb_wrap .navHead .name_wrap > div{font-size: 2.4rem; font-weight: 300; line-height: 1;}
.gnb_wrap .navHead .name_wrap > div strong{font-weight: 700;}
.gnb_wrap .navHead .name_wrap > a{display: inline-flex; align-items: center; justify-content: center; border-radius: 100px; height: 30px; font-size: 1.4rem; font-weight: 500; color: #303030; background: #F5F7FC; padding: 0 16px;}
.gnb_wrap .navHead .info_wrap{margin-top: 12px; color: #777; line-height: 1; font-size: 0;}
.gnb_wrap .navHead .info_wrap span{font-size: 1.4rem;}
.gnb_wrap .navHead .info_wrap span:nth-of-type(1)::after{ content: ""; width: 1px; height: 12px; background: #DCDEE3; display: inline-block; margin: 0 10px;}

.gnb_wrap .navQuick{margin: 36px 32px 0; padding-bottom: 40px; border-bottom: 1px solid #DCDEE3; display: flex; gap: 23px; justify-content: space-between;}
.gnb_wrap .navQuick a{ width: calc( (100% - 23px*3) / 4 ); display: flex; align-items: center; flex-direction: column; gap: 14px;}
.gnb_wrap .navQuick a .img{display: inline-block; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; border-radius: 24px; border: 1px solid #DCDEE3;}
.gnb_wrap .navQuick a .txt{color: #777; font-weight: 500;}

.gnb_wrap .navList{margin: 32px; position: relative; height: calc( 100% - 356px ); overflow-y: auto;}
.gnb_wrap .navList ul{}
.gnb_wrap .navList ul li{}
.gnb_wrap .navList ul li + li{margin-top: 12px;}
.gnb_wrap .navList ul li a{display: block; padding: 16px 0; font-size: 1.6rem; font-weight: 600;}

.wrap.index{}
.header{display: flex; justify-content: space-between; align-items: center; height: 64px;}
.header > h1{height: 34px;}
.header > h1 img{height: 100%;}
.header > .tnb_wrap{display: flex; gap: 10px;}
.header > .tnb_wrap button{width: 28px; height: 28px; text-align: center;}

.mainBanner{font-size: 0; overflow: hidden; position: relative; padding-bottom: 30px;}
.mainBanner {}
.mainBanner img{width: 100%;}
.mainBanner .swiper-pagination .swiper-pagination-bullet{background: #fff; width: 8px; height: 8px; border: 1px solid #B4B8C1; border-radius: 50%; opacity: 1;}
.mainBanner .swiper-pagination .swiper-pagination-bullet-active{background: #777777; opacity: 1;}
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 10px;}



.mainNotice{background: #313950; border-radius: 8px;  margin-top: 28px;}
.mainNotice .noticeList{height: 40px;  padding: 10px 16px; display: flex; align-items: center; gap: 8px;}
.mainNotice .noticeList .icon{width: 20px;}
.mainNotice .noticeList .icon img{height: 20px; vertical-align: middle;}
.mainNotice .noticeList .subject{font-size: 1.3rem; color: #fff; font-weight: 700; width: calc( 100% - 116px); display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.mainNotice .noticeList .date{font-size: 1.2rem; color: #B4B8C1; margin-left: auto; width: 80px;}

.mainQuick1{display: flex; gap: 12px;  margin-top: 12px;}
.mainQuick1 > div{width: calc( (100% - 12px) / 2 );}
.mainQuick1 > .leftQ{}
.mainQuick1 > .leftQ a{background: #8181E0 url(../images/icon_mainQ1_01.svg) no-repeat right 24px bottom 24px; border-radius: 16px; height: 188px; padding: 24px; font-size: 2rem; font-weight: 700; color: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, 0.05); display: block;}
.mainQuick1 > .rightQ{display: flex; gap: 12px; flex-direction: column; }
.mainQuick1 > .rightQ a{background: #fff url(../images/icon_mainQ1_02.svg) no-repeat right 24px bottom 24px; background-size: 60px 60px; border-radius: 16px; height: 188px; padding: 24px; font-size: 2rem; font-weight: 700; box-shadow: 0 0 20px rgba(0, 0, 0, 0.05); display: block;}
/* 
.mainQuick1 > .rightQ > a{border-radius: 16px; padding: 18px; font-size: 1.6rem; font-weight: 700; box-shadow: 0 0 20px rgba(0, 0, 0, 0.05); height: calc( (100% - 12px) / 2);} 
.mainQuick1 > .rightQ > .reserved{background: #fff url(../images/icon_mainQ1_02.svg) no-repeat right 18px bottom 18px;}
.mainQuick1 > .rightQ > .delivery{background: #fff url(../images/icon_mainQ1_03.svg) no-repeat right 18px bottom 18px;}
*/

.mainQuick2{margin-top: 28px; display: flex;  justify-content: space-between;}
.mainQuick2 a{ width: 25%; display: flex; align-items: center; flex-direction: column; gap: 12px;}
.mainQuick2 a .img{display: inline-block; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; border-radius: 20px; background: #F5F7FC;}
.mainQuick2 a .txt{color: #777; font-weight: 500; font-size: 1.3rem;}

.mainFooter{margin: 60px 0 10px; text-align: center;  font-size: 0;}
.mainFooter a{display: inline-block; font-size: 1.2rem; color: #9B9B9B; font-weight: 500;}
.mainFooter a::after{content: ""; display: inline-block; width: 1px; height: 10px; background: #DCDEE3; margin: 0 12px;}
.mainFooter a:nth-last-of-type(1)::after{display: none;}
/* 로그인 */
.login_wrap{padding: 80px 0 0;}
.loginLogo{text-align: center; margin-bottom: 60px;}
.loginTab{  display: flex;}
.loginTab button{width: 50%; text-align: center; height: 48px;}
.loginTab button.on{border-bottom: 3px solid #8181E0;}

.loginForm{margin-top: 20px;}
.loginForm .row{display: flex; align-items: center; padding: 12px; gap: 8px; height: 48px; border: 1px solid #DCDEE3; border-radius: 6px;}
.loginForm .row + .row{margin-top: 10px;}
.loginForm .row label{text-indent: -9999px; display: inline-block; width: 24px; height: 24px;}
.loginForm .row:nth-child(1) label{background: url(../images/icon_loginId.svg) no-repeat center; }
.loginForm .row:nth-child(2) label{background: url(../images/icon_loginPw.svg) no-repeat center;}
.loginForm .row input[type=text],
.loginForm .row input[type=password]{border: 0; width: calc( 100% - 56px ); padding: 0; height: auto; border-radius: 0;}
.loginForm .enter{display: flex; align-items: center; justify-content: center; border-radius: 6px;  margin-top: 16px; height: 52px; background: linear-gradient(90deg, #A3A3F8 0%, #3B3BD6 100%); color: #fff; font-size: 1.6rem; font-weight: 700;}
.autoLogin_wrap{margin-top: 20px; display: flex; justify-content: space-between;}
.autoLogin_wrap .auto{font-size: 0; font-weight: 600;}
.autoLogin_wrap .auto label{margin-left: 8px; font-size: 1.4rem;}
.login_bottom{margin-top: 60px; }
.login_bottom > .join {display: flex; align-items: center; justify-content: center; border-radius: 6px;  margin-top: 16px; height: 52px; background: #303030; color: #fff; font-size: 1.6rem; font-weight: 700;}
.login_bottom > .res{margin-top: 12px; display: flex; align-items: center; gap: 36px; justify-content: flex-start; padding: 22px 0 22px 36px; background: linear-gradient(90deg, #FFFFFF 0%, #DEF3E1 100%); border: 2px solid rgba(66, 169,112, 0.3); box-shadow: 0 0 20px rgba(0,0,0,0.1); border-radius: 8px;}
.login_bottom > .res .img{}
.login_bottom > .res .txt{line-height: 1;}
.login_bottom > .res .txt .d{font-size: 1.3rem; font-weight: 300;}
.login_bottom > .res .txt .t{font-size: 1.8rem; font-weight: 700; margin-top: 6px;}
.login_bottom > .res .txt .b{display: inline-flex; padding: 6.5px 18px; background: #42A970; color: #fff; font-size: 1.3rem; font-weight: 600; border-radius: 100px; margin-top: 12px;}


/* 서브상단 */
.subHeader{display: flex; align-items: center; height: 64px;}
.subHeader > button{width: 24px; height: 24px;}
.subHeader > .title{width: calc(100% - 42px); text-align: center; font-size: 1.6rem; font-weight: 600;}
.subTitle{font-size: 1.8rem; font-weight: 600;}

.tabMenu{  display: flex;  margin: 0 -20px; }
.tabMenu a, .tabMenu button{flex-grow: 1; display: flex; align-items: center; justify-content: center; height: 48px; border-bottom: 1px solid #B4B8C1;}
.tabMenu a.on, .tabMenu button.on{border-bottom: 3px solid #8181E0; height: 48px;}


/* */
.joinStep_wrap{margin-top: 20px; display: flex; justify-content: center; }
.joinStep_wrap > div span{ width: 24px; height: 24px; gap: 40px; display: inline-flex; align-items: center; justify-content: center; background: #B4B8C1; font-size: 1.3rem; font-weight: 500; color: #fff; border-radius: 50%;}
.joinStep_wrap > div.on span{background: #C07BD3;}
.joinStep_wrap > div::after{content: ""; display: inline-block; width: 20px; height: 4px; background: url(../images/stepDot.png) no-repeat; margin: 0 10px; }
.joinStep_wrap > div:nth-last-of-type(1)::after{display: none;}

/* 회원가입 */
.joinTyp_wrap{margin-top: 120px;}
.joinTyp_wrap .t{font-size: 2.8rem; font-weight: 600;}
.joinTyp_wrap .b{margin-top: 40px; display: flex; gap: 12px;}
.joinTyp_wrap .b a{display: flex; justify-content: space-between; width: calc( ( 100% - 12px ) / 2); padding: 28px; height: 200px; border-radius: 12px; }
.joinTyp_wrap .b a.normal{background: #F5F7FC url(../images/bg_joinType_01.svg) no-repeat right 24px bottom 24px;}
.joinTyp_wrap .b a.biz{background: #F5F7FC url(../images/bg_joinType_02.svg) no-repeat right 24px bottom 24px;}
.joinTyp_wrap .b a label{font-size: 1.8rem; font-weight: 600;}
.joinTyp_wrap .b a input[type=radio]:before{background: url(../images/icon_checkbox_off.svg);  }
.joinTyp_wrap .b a input[type=radio]:checked:after{background: url(../images/icon_checkbox_on.svg);  }
.joinTyp_wrap .d{margin-top: 20px; font-size: 1.3rem; color: #777;}


/* 약관동의 */
.term_wrap{margin-top: 40px;}
.term_wrap .ck{display: flex; gap: 8px; margin-bottom: 12px; align-items: center;}
.term_wrap .ck label{font-size: 1.4rem; font-weight: 500;}
.allChk_wrap {padding-bottom: 24px; border-bottom: 1px solid #DCDEE3;}
.allChk_wrap .ck label{font-weight: 700; font-size: 1.8rem;}
.allChk_wrap .d{font-size: 1.4rem; color: #777; margin-left: 24px;}
.termBox{margin-top: 24px;}
.termBox .termTxt{width: 100%; height: 120px; border-radius: 6px; background: #F5F7FC; padding: 16px; font-size: 1.3rem; color: #777; line-height: 140%; overflow-y: auto;}
.term_wrap .ck input[type=checkbox]{width:18px; height: 18px;}
.term_wrap .ck input[type=checkbox]:before{width:18px; height:18px;background-size: 18px;}
.term_wrap .ck input[type=checkbox]:checked:after{width:18px; height:18px; background-size: 18px; }


/* 정보입력 */
.joinform_wrap{margin-top: 40px;}

.regForm_inner{}
.regForm_inner .rowBox{}
.regForm_inner .rowBox + .rowBox{margin-top: 28px;}
.regForm_inner.bdTop .rowBox + .rowBox{border-top: 1px solid #DCDEE3; padding-top: 28px;}
.regForm_inner .rowBox > .t,
.regForm_inner .rowBox > label{display: block; margin-bottom: 10px; font-size: 1.4rem; font-weight: 500; color: #777; line-height: 100%;}
.regForm_inner .rowBox > input[type=text] + input[type=text], 
.regForm_inner .rowBox > input[type=password] + input[type=password]{margin-top: 8px;} 
.regForm_inner .rowBox > input[type=text],
.regForm_inner .rowBox > input[type=number],
.regForm_inner .rowBox > input[type=search],
.regForm_inner .rowBox > input[type=password]{display: block; width: 100%;}
.regForm_inner .rowBox .descRed{color: #C70000; font-size: 1.3rem; margin-top: 10px;}
.regForm_inner .rowBox .descBlack{color: #777; font-size: 1.3rem; margin-top: 10px;}
.regForm_inner .rowBox .count{text-align: right; color: #777; margin-top: 5px; width: }
.regForm_inner .rowBox .bizInfoBox{padding: 20px; border: 1px solid #DCDEE3; background: #F5F7FC; border-radius: 6px; margin-bottom: 8px;}
.regForm_inner .rowBox .bizInfoBox .t{font-size: 1.5rem; font-weight: 700;}
.regForm_inner .rowBox .bizInfoBox .address1{margin-top: 12px;}
.regForm_inner .rowBox .bizInfoBox .address1,
.regForm_inner .rowBox .bizInfoBox .address2{font-size: 1.4rem; color: #777;}
.regForm_inner .rowBox.hideBox {display: none; margin-top: 8px;}
.regForm_inner .rowBox.hideBox input[type=text],
.regForm_inner .rowBox.hideBox input[type=password]{display: block; }

.regForm_inner .rowBox.valueBox{}
.regForm_inner .rowBox.valueBox input[type=text],
.regForm_inner .rowBox.valueBox input[type=password]{border: 0; padding: 0; font-weight: 500; pointer-events: none;}
.regForm_inner .rowBox.valueBox input{}

.editBtn_wrap{display: flex; gap: 8px; margin-top: 8px;}
.editBtn_wrap > a,
.editBtn_wrap > button{width: calc( (100% - 8px ) / 2 ); height: 44px;  display: flex;align-items: center; justify-content: center; font-size: 1.4rem; font-weight: 500; border-radius: 6px;}
.editBtn_wrap .cancel{border: 2px solid #303030; color: #303030;}
.editBtn_wrap .edit{ background: #303030; color: #fff;}


.inputBtn_wrap + input[type=text], 
.inputBtn_wrap + input[type=number]{margin-top: 8px;} 
.inputBtn_wrap + .inputBtn_wrap{margin-top: 8px;} 
.inputBtn_wrap{display: flex; align-items: center; gap: 8px;}
.inputBtn_wrap > .inputTxt,
.inputBtn_wrap > input[type=text],
.inputBtn_wrap > input[type=password]{flex: 1;  width: 100%;}
.inputBtn_wrap > button{padding: 0 16px; height: 44px; display: flex; align-items: center; justify-content: center; color: #303030; background: #fff; border-radius: 6px; border: 1px solid #303030; font-size: 1.4rem; font-weight: 500; flex-shrink: 0; }

.inputBtn_wrap.type2{border: 1px solid #DCDEE3; padding: 0 16px; align-items: center; }
.inputBtn_wrap.type2 input[type="text"]{border: 0; padding: 0; flex: 1;  width: 100%; }
.inputBtn_wrap.type2 button{flex-shrink: 0;  padding: 0 16px; height: 28px; display: flex; align-items: center; justify-content: center; color: #303030; background: #fff; border-radius: 6px; border: 1px solid #303030; font-size: 1.3rem; font-weight: 500; border-radius: 100px; }
.inputDoub_wrap{ display: flex; justify-content: space-between; }
.inputDoub_wrap > div,
.inputDoub_wrap > input[type=text]{ width: calc( (100% - 8px ) / 2);}

.unitInput{display: flex; border-radius: 6px; height: 46px; border: 1px solid #DCDEE3; padding: 0 16px; align-items: center;}
.unitInput input[type=text]{border-radius: 0; height: 44px; line-height: 44px; padding: 0; border: 0; flex-grow: 1; }
.unitInput.unit2 input[type=text]{ width: calc( 100% - 60px); align: right; }
.unitInput.unit2 .fUnit{text-align: left;}
.unitInput.unit2 .fUnit,
.unitInput.unit2 .bUnit{width: 30px; color: #B4B8C1; font-size: 1.4rem;  }
.unitInput.unit2 .bUnit{text-align: right;}

.unitInput.unit1{padding: 0;}
.unitInput.unit1 input[type=text]{width: calc(100% - 100px); border-radius: 6px 0 0 6px; border-right: 0; padding: 0 16px; text-align: left;}
.unitInput.unit1 span.unit{  width: 60px; height: 44px; border-radius: 0 6px 6px 0; display: inline-flex; align-items: center; justify-content: center; border-left: 1px solid #DCDEE3;  color: #666;}
.unitInput.unit1 input[type=text]:focus + span{ border: 1px solid #110D64; }





/* 가입완료 */
.result_wrap{padding: 80px 0 0;}
.resultLogo{text-align: center; margin-bottom: 60px;}
.result_wrap .txt{text-align: center;}
.result_wrap .txt .t{font-size: 2.8rem; font-weight: 600;}
.result_wrap .txt .d{margin-top: 10px; font-size: 1.3rem; color: #777;}
.result_wrap .b{margin-top: 60px;}
.result_wrap .b a{display: flex; align-items: center; justify-content: center; border-radius: 6px;  margin-top: 16px; height: 52px; background: linear-gradient(90deg, #A3A3F8 0%, #3B3BD6 100%); color: #fff; font-size: 1.6rem; font-weight: 700;}

/* 상, 하단버튼 */
.wrap > div:nth-last-of-type(1).nextprev_wrap{  align-items: flex-end; }
.nextprev_wrap{padding: 20px 0; display: flex; gap: 8px;   }
.nextprev_wrap button,
.nextprev_wrap a{font-size: 1.6rem; font-weight: 700; display: flex; align-items: center; justify-content: center; border-radius: 6px; }
.nextprev_wrap .prev{width: 120px; height: 52px; background: #303030; color: #fff;}
.nextprev_wrap .next{width: calc( 100% - 128px); height: 52px; background: linear-gradient(90deg, #A3A3F8 0%, #3B3BD6 100%); color: #fff;}
.nextprev_wrap .wp100{width: 100%;}
.topBtn_wrap{padding: 12px 0 20px; }
.topBtn_wrap a{height: 44px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-weight: 500; color: #303030; border: 1px solid #303030;}

/* 예약현황 - 목록 */
.wrap.gridWrap > .headfootFix_contents.res > .reserved_wrap{margin: 12px 0 0;}
.reserved_wrap{margin: 12px -20px 0;}
.reserved_wrap .tabMenu{margin: 0;}
.resSch_wrap{border-bottom:8px solid #F5F7FC;  padding: 0 20px 12px;}
.resSch_wrap .resSchForm{background: #F5F7FC; width: 100%;  display: flex; border-radius: 100px; overflow: hidden; padding: 0 16px; align-items: center; }
.resSch_wrap input[type=text]{border: 0; border-radius: 0; flex-grow: 1; background: #F5F7FC; padding: 0;}
.resSch_wrap input[type=text]:focus{border: 0;}
.resSch_wrap button{width: 24px; height: 24px;}
.resSch_wrap .d{font-size: 1.2rem; color: #777; margin-top: 12px; padding: 0 16px;}
.resList_wrap{  margin-top: 20px; }
.resList_wrap > .t{font-size: 1.4rem; color: #777; font-weight: 500; padding: 0 20px;}
.resList_wrap > ul{}
.resList_wrap > ul > li{}
.resList_wrap > ul > li + li{}
.resList_wrap > ul > li a{padding: 20px; border-bottom:8px solid #F5F7FC; display: block; display: flex; flex-direction: column;}
.resList_wrap > ul > li[aria-label=complete] a .state{display: flex; align-items: center; gap: 14px;}
.resList_wrap > ul > li[aria-label=complete] a .num,
.resList_wrap > ul > li[aria-label=complete] a .t,
.resList_wrap > ul > li[aria-label=complete] a .ft{padding-left: 36px;}
.resList_wrap > ul > li[aria-label=wait] a .state{display: flex; align-items: center; gap: 14px;}
.resList_wrap > ul > li[aria-label=wait] a .num,
.resList_wrap > ul > li[aria-label=wait] a .t,
.resList_wrap > ul > li[aria-label=wait] a .ft{padding-left: 36px;}


.resList_wrap > ul > li a .state{}
.resList_wrap > ul > li a .state p{padding: 0 10px; height: 22px; display: inline-flex; align-items: center; font-size: 1.2rem; font-weight: 500;  border-radius: 100px;}
.resList_wrap > ul > li a .state.wait p{background: #B4B8C1; color: #fff; }
.resList_wrap > ul > li a .state.print p{background: #ffebeb; color: #c70000; }
.resList_wrap > ul > li a .state.delivery p{background: #d1f4e1; color: #42a970; }
.resList_wrap > ul > li a .state.complete p{background: #EBEBFF; color: #8181E0; }
.resList_wrap > ul > li a .num{margin-top: 8px; display: flex; justify-content: space-between; align-items: flex-start;}
.resList_wrap > ul > li a .num .n{font-size: 1.7rem; color: #000; font-weight: 500;}
.resList_wrap > ul > li a .num .date{font-size: 1.2rem; color: #9B9B9B;}
.resList_wrap > ul > li a .t{margin-top: 12px; font-size: 1.3rem; color: #303030;}
.resList_wrap > ul > li a .ft{margin-top: 4px; font-size: 1.3rem;  color: #777;}


/* 예약현황 - 상세 */
.deliveryState_wrap{display: flex; justify-content: center; padding: 20px; gap: 17px; border-radius: 12px; box-shadow: 0 0 20px rgba(0,0,0,0.08); background: #fff;}
.deliveryState_wrap > div{text-align: center; width: 20%;}
/* .deliveryState_wrap > div::after{content: ""; display: inline-block; background: url(../images/icon_delivery_arrow.svg); width: 6px; height: 3px;} */
.deliveryState_wrap > div .img{}
.deliveryState_wrap > div .t{font-size: 1.1rem; color: #B4B8C1; font-weight: 500; margin-top: 2px;}
.deliveryState_wrap > div.on svg path {stroke:#8181E0}
.deliveryState_wrap > div.on .t{ color: #000; }

.resDetail_wrap{margin: 20px auto; background: #fff;}
.resDetail_wrap .resDetail_top{ background: #F5F7FB; border-radius: 12px; margin:20px 20px 32px; padding: 28px 24px;}
.resDetail_wrap .resDetail_top > div{display: flex; align-items: center; justify-content: space-between; font-size: 1.4rem; font-weight: 500;}
.resDetail_wrap .resDetail_top > div + div{margin-top: 16px;}
.resDetail_wrap .resDetail_top > div .t{color: #777;}
.resDetail_wrap .resDetail_top > div .d{}
.resDetail_wrap .resDetail_top > div:nth-of-type(1) .d{font-weight: 700; color: #8181E0;}
.resDetail_wrap .qrcode{text-align: center; padding-top: 20px; }

.resDetail_list{margin:0 20px;}
.resDetail_list ul{}
.resDetail_list ul li{padding: 20px 0; }
.resDetail_list ul li + li{border-top: 1px solid #DCDEE3; }
.resDetail_list ul li .state_wrap{display: flex; justify-content: space-between;}
.resDetail_list ul li .state_wrap .state{ font-size: 1.4rem; font-weight: 500;}
.resDetail_list ul li .state_wrap .date{font-size: 1.2rem; color: #9B9B9B;}
.resDetail_list ul li:nth-of-type(1) .state_wrap .state{color: #8181E0;}
.resDetail_list ul li .d{margin-top: 8px; font-size: 1.3rem; margin-top: 8px; color: #777;}
.resDetail_list ul li .d + .d{margin-top: 0px;}


.mypage{margin-top: 20px;}



/* 문의내역 */
.boardList_wrap { border-top: 8px solid #F5F7FC; }
.boardList_wrap.notice{margin: 0 -20px;}
.boardList_wrap > .t{font-size: 1.4rem; color: #777; font-weight: 500; padding: 20px 20px 0;}
.boardList_wrap > ul{}
.boardList_wrap > ul li{padding: 20px; border-bottom: 1px solid #DCDEE3; line-height: 100%;}
.boardList_wrap > ul li .txt_wrap{display: flex; justify-content: space-between;}
.boardList_wrap > ul li .txt_wrap .subject{font-size: 1.4rem; font-weight: 600; width: calc( 100% - 72px ); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.boardList_wrap > ul li .txt_wrap .state{width: 58px; height: 22px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.2rem; border-radius: 2px; background: #B4B8C1;}
.boardList_wrap > ul li .txt_wrap .state.complete{background: #527EFC;}
.boardList_wrap > ul li .date{margin-top: 12px;}
.boardList_wrap > ul li .date span{color: #9B9B9B; font-size: 1.2rem;}
.boardList_wrap > ul li .date span::after{ content: ""; width: 1px; height: 10px; background: #DCDEE3; display: inline-block; margin: 0 8px;}
.boardList_wrap > ul li .date span:nth-last-of-type(1)::after{display: none;}
.boardList_wrap > ul li.answer{background: #F5F7FC;}
.boardList_wrap > ul li.answer .subject{width: 100%;}
.boardList_wrap > ul li.answer .answer_txt{width: 100%; padding: 20px 0; line-height: 140%;}
.boardList_wrap > ul li.notice_txt{background: #F5F7FC; width: 100%; padding: 20px; line-height: 140%;}
.boardList_wrap.notice ul li .txt_wrap .subject{display: block; width: 100%; }



/* 상품종류 */
.category_wrap{}
.category_wrap .category{display: flex; flex-wrap: wrap; gap: 12px;}
.category_wrap .category > div{width: calc( (100% - 24px) / 3 );   }
.category_wrap .category > div input[type=radio]{display: none;}
.category_wrap .category > div label{background: #fff; border: 1px solid #DCDEE3; padding: 12px 0; border-radius: 6px; width: 100%; display: inline-block; }
.category_wrap .category > div input[type=radio]:checked + label{border: 2px solid #8181E0; background: #EBEBff; padding: 11px 0;}
.category_wrap .category > div .img{ text-align: center;}
.category_wrap .category > div .img img{width: 80%; }
.category_wrap .category > div .t{ text-align: center; font-size: 1.4rem; font-weight: 500; }
.category_wrap .warningBox{background: #F5F7FC; border-radius: 6px; margin-top: 20px; padding: 20px;}
.category_wrap .warningBox .t{ font-size: 1.5rem; font-weight: 600; color: #C70000;}
.category_wrap .warningBox .t span{display: inline-flex; justify-content: center; align-items: center; font-size: 1rem; font-weight: 700; width: 16px; height: 16px; border: 2px solid #C70000; border-radius: 50%; margin-right: 12px; }
.category_wrap .warningBox .d{font-size: 1.3rem; font-weight: 500; margin-top: 12px; color: #777;}

.stepBox.contBox{padding:20px; border-radius: 24px; background:#fff; box-shadow: 0 0 80px rgba(0,0,0,0.1);}

.stepBox{/**/}

/* 접수불가 품목 */
.unable_wrap{}
.unableTit{color: #C70000; font-size: 1.6rem; font-weight: 700; display: flex; align-items: center; justify-content: center; gap: 16px;}
.unableTit span{display: inline-flex; justify-content: center; align-items: center; font-size: 1.6rem; font-weight: 600; width: 20px; height: 20px; border: 2px solid #C70000; border-radius: 50%; }
.unable_list{margin-top: 40px; display: flex; gap:20px 10px; flex-wrap: wrap;}
.unable_list .unableBox{width: calc( (100% - 20px) / 3 );}
.unable_list .unableBox .img{text-align: center;}
.unable_list .unableBox .img img{width: 80%; }
.unable_list .unableBox .txt{text-align: center; margin-top: 12px; font-size: 1.2rem; line-height: 120%;}


/* 파손면책동의 */
.breakBox{}
.breakBox .top{text-align: center; margin-top: 40px;}
.breakBox .top .img{width: 150px; margin: 0 auto 10px;}
.breakBox .top .img img{width: 80%;}
.breakBox .top .txt{font-size: 1.6rem; font-weight: 700;}
.breakBox .warningBox{}
.breakBox .warningBox{background: #F5F7FC; border-radius: 6px; margin-top: 40px; padding: 20px;}
.breakBox .warningBox > div{ text-align: left;}
.breakBox .warningBox > div + div{ margin-top: 12px;}
.breakBox .warningBox > div .t{ font-size: 1.5rem; font-weight: 700;}
.breakBox .warningBox > div .d{ margin-top:6px; color: #303030;}
.breakBox .warningBox > div.r{ font-weight: 500; color: #C70000;}
.breakBox .agreeBox{margin-top: 40px;}
.breakBox .agreeBox .t{ font-size: 1.5rem; font-weight: 700;}
.breakBox .agreeBox .tabRadio {margin-top:10px; gap: 16px;}
.breakBox .agreeBox .tabRadio > label{width: calc( 50% - 8px); border-radius:6px; border: 2px solid #303030; color: #303030; height: 44px; line-height: 42px; font-weight: 500; background: #fff;}
.breakBox .agreeBox .tabRadio > input[type=radio]:checked + label{background: #303030; color: #fff;}


/* 물품무게 선택 */
.weightBox_wrap{display: flex; gap: 12px; flex-wrap: wrap;}
.weightBox_wrap > div{width: calc((100% - 12px) / 2 ); }
.weightBox_wrap > div input[type=radio]{display: none;}
.weightBox_wrap > div label{background: #fff; border: 1px solid #DCDEE3; height: 100px; padding: 20px; border-radius: 6px; width: 100%; display: inline-flex; font-size: 1.6rem; font-weight: 700; align-items: center; justify-content: space-between;}
.weightBox_wrap > div label svg{width: 20px; height: 20px;   }
.weightBox_wrap > div label svg .weightChk{stroke:#B4B8C1; stroke-width:16px; stroke-linecap:round; stroke-linejoin:round;}
.weightBox_wrap > div input[type=radio]:checked + label{border: 2px solid #8181E0; background: #EBEBff; padding: 18px;}
.weightBox_wrap > div input[type=radio]:checked + label svg .weightChk{stroke:#8181E0;}
.weightBox .warningBox{background: #F5F7FC; border-radius: 6px; margin-top: 20px; padding: 20px;}
.weightBox .warningBox .t{ font-size: 1.5rem; font-weight: 700; }
.weightBox .warningBox .d{  margin-top: 6px;}
.weightBox .warningBox .r{ font-weight: 600; margin-top: 20px; color: #C70000; letter-spacing: -1.2px; display: flex; align-items: center;}
.weightBox .warningBox .r span{display: inline-flex; justify-content: center; align-items: center; font-size: 1.2rem; font-weight: 600; width: 20px; height: 20px; border: 2px solid #C70000; border-radius: 50%; margin-right: 6px; }

/* 물품가액 입력 */
.priceBox{}
.priceBox .warningBox{}
.priceBox .warningBox{background: #F5F7FC; border-radius: 6px; margin-top: 20px; padding: 20px;}
.priceBox .warningBox > div{ text-align: left;}
.priceBox .warningBox > div + div{ margin-top: 12px;}
.priceBox .warningBox > div .t{ font-size: 1.5rem; font-weight: 700;}
.priceBox .warningBox > div .d{  margin-top:6px; color: #303030;}
.priceBox .warningBox > div.r{  font-weight: 500; color: #C70000;}


/* 정보입력 하단버튼 */
.regBtn_wrap{}
.regBtn_wrap .regEnter{display: none;}
.regBtn_wrap[aria-controls=step01] .regPrev{display: none;}
.regBtn_wrap:not([aria-controls=step01]) .regClose{display: none;}
.regBtn_wrap:not([aria-controls=step01]) .regPrev{display: block;}
.regBtn_wrap[aria-controls=step07] .regNext{display: none;}
.regBtn_wrap[aria-controls=step07] .regEnter{display: block;}


/* 접수방법 선택 */
.receipt_wrap{display: flex; gap: 30px;}
.receipt_wrap .receiptLeft{}
.receipt_wrap .receiptLeft > a{display: flex; flex-direction: column; padding: 70px; justify-content: space-between; width: 520px; height: 550px; border-radius: 24px; background: linear-gradient(135deg, #9393E8 0%, #302AA3 100%); box-shadow: 0 0 60px rgba(0, 0, 0, 0.1); color: #fff;}
.receipt_wrap .receiptLeft > a .t{ font-size: 54px; font-weight: 700;}
.receipt_wrap .receiptLeft > a .d{font-size: 36px; }
.receipt_wrap .receiptRight{}
.receipt_wrap .receiptRight > div{  background: #fff; box-shadow: 0 0 60px rgba(0, 0, 0, 0.1); border-radius: 24px;}
.receipt_wrap .receiptRight > div + div{margin-top: 30px;}
.receipt_wrap .receiptRight{}
.receipt_wrap .receiptRight > div button{ display: flex; flex-direction: column; width: 360px; height: 260px;padding: 70px; justify-content: space-between; padding: 48px 44px; }
.receipt_wrap .receiptRight > div button .t{display: flex; justify-content: space-between; font-size: 40px; font-weight: 700 ; width: 100%;}
.receipt_wrap .receiptRight > div button .t img{height: 70px;}
.receipt_wrap .receiptRight > div button .d{text-align: left; font-size: 22px;}


.regForm_inner + .warningBox{background: #F5F7FC; border-radius: 6px; margin-top: 40px; padding: 20px;}
.regForm_inner + .warningBox .t{ font-size: 1.5rem; font-weight: 700; }
.regForm_inner + .warningBox .d{  margin-top: 12px;}
.regForm_inner + .warningBox .r{ font-weight: 600; color: #C70000; letter-spacing: -1.2px; display: flex; align-items: center;}
.regForm_inner + .warningBox .r span{display: inline-flex; justify-content: center; align-items: center; font-size: 1.2rem; font-weight: 600; width: 20px; height: 20px; border: 2px solid #C70000; border-radius: 50%; margin-right: 6px; }



/* 약관 */
.termWrap > .txtBox > .tit{font-size:14px; font-weight:600; margin-bottom:12px; color:#111;}
.termWrap > .txtBox > p{font-size:12px; color: #777}
.termWrap > .txtBox > p + p{margin-top:10px;}
.termWrap > .txtBox + .txtBox{margin-top:4rem;}
.termT{font-size:16px; font-weight: 700; margin:60px 0 30px; color: #111 }
.termT:nth-of-type(1){margin-top: 0}
.termWrap + .termWrap{margin-top: 30px}