@media screen and (max-width: 720px) { * { font-size:var(--26); } 

/*input check,radio*/
._check input + label { padding-left:var(--66); line-height: var(--42); background-size: var(--42); } 
._check input + span { width: var(--42); height: var(--42); background-size: var(--42);; } 

/*button*/
button.si-M { width: var(--210); height:var(--92); font-size: var(--28); } 
button.si-L { width: 100%; height:var(--100); font-size: var(--30); font-weight: 600; } 
button.si-XL { width: 100%; height:var(--110); font-size: var(--30); font-weight: 600; } 

/*tab*/

._tab { border-bottom: 1px solid var(--line_02); } 
._tab li:after { height: var(--26); } 
._tab li { flex-grow: 1; } 
._tab li > div { font-size: var(--30); padding: 0; text-align: center; line-height:var(--100); } 
._tab li.on div { border-bottom: var(--3) solid var(--colBl); font-weight: 700; } 
._sildScroll ._tab { white-space:nowrap; border-bottom: 0; } 
._sildScroll ._tabBg { white-space:nowrap; } 
._sildScroll ._tab li { display:inline-block; padding:0 var(--30); } 
._sildScroll { width: 100%; overflow: scroll; -ms-overflow-style: none; scrollbar-width: none; } 
._sildScroll { border-bottom: 1px solid var(--line_03); } 
._sildScroll::-webkit-scrollbar { display: none; } 
._tabBg li > div { font-size: var(--28); line-height: var(--64); border-radius: var(--64); padding: 0 var(--32); cursor: pointer; } 
._tabBg li.on > div { background-color: var(--colmainY); font-weight: 600; } 
._tabLine li input:checked + div { border-bottom: var(--5) solid #000; } 
._tabLine li div { height: var(--100); line-height: calc(var(--100) - 5px); font-size: var(--32); } 
._sildScroll ._tab.equal { display: flex; } 
._sildScroll ._tab.equal li { padding: 0; width: calc(100%/3); } 
/*textSearch*/

._textSearch select { font-size: var(--28); height: var(--92); min-width: var(--200); margin-right: var(--10); } 
._textSearch .searchInput { width: calc(100% - var(--190) - var(--2)); display: flex; height: var(--92); } 
._textSearch .searchInput input { height: var(--92); width: calc(100% - var(--92)); background-color: transparent; font-size: var(--28); } 
._textSearch .searchInput button { width: var(--92); background-size: var(--28); height: var(--92); } 



/*input select search*/
input { height: var(--92); padding: 0 var(--30); } 
select { height: var(--92); padding: 0 var(--30); padding-right: var(--64); background-position: calc(100% - var(--30)); background-size: var(--24); } 
._search button { background-size: var(--26);; width: var(--92); height:var(--92); } 
._search input { width: calc(100% - var(--92)); } 
._identify select { width: var(--220); margin-right: var(--20); } 
._identify input { margin-right: var(--20); margin-bottom: var(--20); } 
._identify select + input { width: calc(100% - var(--240)); margin-right: 0; } 
._identify button { font-size: var(--28); width:var(--190); height: var(--92); } 
._identify .colBl { margin-bottom: var(--20); width: 100%; clear: both; height: var(--72); } 
._identify .colBl + input { margin-bottom: 0; width: calc(100% - var(--210)); margin-right: var(--20); } 
._identify .txt { font-size: var(--22); line-height: var(--22); padding-top: var(--20); } 





._inputTit { margin-bottom: var(--60); display: block; } 
._inputTit .tit { margin-bottom:var(--20); font-size: var(--26); width: 100%; line-height: var(--26); } 
._inputTit .tit .dot:after { width: var(--5); height: var(--5); border-radius: var(--5); right: -1.6667vw; } 
._inputTit .inputWrap { width:100%; } 
._inputList .fileBtn input { width: var(--180); } 
._inputList .fileBtn div.btn { width: var(--180); line-height: var(--72); height:var(--72); font-size: var(--26); } 
._inputList .fileBtn div.fileName { line-height: var(--72); padding-left: var(--20); width: calc(100% - var(--180)); } 
._inputList .imgTxt { font-size: var(--22); margin-top: var(--16); } 




 /*tit*/
._tit span { font-size: var(--30); } 
._tit.dotR span { padding-right:var(--26); } 
._tit.dotR span:after { width: var(--8); height:var(--8); border-radius: var(--10); } 
._lineTit { font-size: var(--30); padding-left: var(--32); line-height: var(--30); } 
._lineTit:after { width: var(--9); height: var(--30); } 
/*dotTxtList*/
._dotList span { position: relative; display: block; } 
._dotList span:after { width: var(--8); height: var(--8); border-radius: var(--8); } 

/*Pagination*/
._Pagination { margin-top: var(--40); } 
._Pagination button { padding: var(--10); margin: 0 var(--10); font-size: var(--26); } 






/*page Depth*/
._depthArea { display: none; } 

/*입력 그룹*/
._inputList li { margin-bottom: var(--60); } 
._inputList li > div { float: initial; } 
._inputList li ._tit { line-height: var(--26); width: 100%; margin-bottom: var(--20); } 
._inputList li button { width: var(--210); margin-left:var(--20); font-weight: 600; font-size: var(--28); } 
._inputList li select { min-width: var(--200); margin-right: var(--20); } 
._inputList li .box { width: 100% } 
._inputList li .boxFlex { width: 100%; } 
._inputList li .boxEqual { width: 100%; display: block; } 
._inputList li .boxEqual * { width: 100%; margin-bottom: var(--20); } 
._inputList li > .txt { font-size: var(--22); line-height: var(--22); margin-top: var(--10); width: 100%; text-align: right; float: initial; } 

._inputList .box.checkWrap { margin-top: var(--30); } 
._inputList .box.checkWrap ._check { margin-bottom: var(--30); } 
._inputList .box.checkWrap ._check label { line-height: var(--42); } 
._inputList .box.checkWrap ._check .lineTxt { line-height: var(--42); float: right; } 
/*핸드폰 인증*/
._inputList li .box .wrap { margin-bottom: var(--20); } 
._inputList li .box .wrap input { width: calc(100% - var(--240)) } 
._inputList li .box .wrap button { float: initial; height: var(--72); width: 100%; margin: 0; margin-top: var(--20); } 

/*수량*/
._countBtn:after { content: ""; display: block; clear: both; } 
._countBtn { display: block; border-radius: var(--70); height: var(--70); width: var(--200); } 
._countBtn button { float: left; height: var(--70);; background-size: var(--24);; width:calc((100% - var(--60))/2) } 
._countBtn input,._countBtn .countNum { float: left; display: block; background-color: transparent; height: var(--70); line-height: var(--70); font-size: var(--28); width: var(--60); } 
._countBtn .countNum { display: block; line-height:var(--70);; } 


/*타이틀/텍스트*/
._colTxt .tit { width: var(--170); font-size: var(--28); line-height: var(--28); } 
._colTxt .txt { width: calc(100% - var(--170)); line-height: var(--42); } 
._colTxt .txt span { line-height: var(--28); } 
._colTxt .txt span:last-child { margin-left: var(--16); padding-left: var(--16); } 
._colTxt .txt span:last-child:after { height: var(--24); } 
._rowTxt .tit { line-height: var(--30); font-size: var(--30); } 
._rowTxt .txt { margin-top: var(--22); } 
._rowTxt .txt span { font-size: var(--26); line-height: var(--26); } 
._rowTxt .txt span { margin-left: var(--16); padding-left: var(--16); } 
._rowTxt .txt span:after { height: var(--22); } 


/*기본 table*/
._table th,._table td { padding:var(--10); height: var(--72);; font-size: var(--24);; } 

/*라인 타이틀 */
._secTit { border-top: 0; line-height: var(--100); border-bottom: var(--2) solid var(--colBl); font-size: var(--32); font-weight: 600; padding-left: 0; } 

/*상품 리스트*/
._productList li { padding: var(--30) 0; } 
._productList li ._product { width: 100%; } 
._productList li ._product .img { width: var(--100); height: var(--100);; padding: var(--10); } 
._productList li ._product .txtWrap { float: left; min-height: var(--100); width: calc(100% - var(--100)); display: block; height: initial; padding-left: var(--20); } 
._productList li ._product .txtWrap .name { padding-top: var(--28); font-size:var(--28); line-height: var(--36); } 
._productList li ._product .txtWrap .option { margin-top:var(--10); } 
._productList li ._product .txtWrap .option span { margin-bottom: var(--10); display: block; font-size: var(--24); line-height: var(--32); padding-right: 0; margin-right: 0;; width: 100%; } 
._productList li ._product .txtWrap .option span:last-child { margin-bottom: var(--20); } 
._productList li ._product .txtWrap .option span:after { display: none; } 


/*총결제금액*/
._payTotal { border-top: var(--3) solid var(--colBl); height: initial; padding:var(--40) var(--36); } 
._payTotal > div { float: initial; } 
._payTotal > div div { float: initial; line-height: var(--26); font-size: var(--26); } 
._payTotal > div div.tit { float: left; } 
._payTotal > div div.txt { float: right; } 

._payTotal > div { margin-bottom: var(--30); } 
._payTotal > div.productTotal { padding: 0; } 
._payTotal > div div.tit { float: left; } 
._payTotal > div.productTotal .txt { padding-left: 0; font-weight: 500; } 
._payTotal > div.deliveryPrice .txt { font-weight: 500; } 
._payTotal > div.deliveryPrice,
._payTotal > div.salePrice { padding:0; position:relative; } 
._payTotal > div.salePrice .txt { padding-left: 0; } 
._payTotal > div.deliveryPrice::before,
._payTotal > div.salePrice::before { display: none; } 
._payTotal > div.payTotal:before { content: "거리에 따라 추가 배달비가 발생할 수 있습니다."; display: block; position: absolute; right: 0; font-size: var(--24); line-height: var(--30); color: #797979; top:-6vw; } 
._payTotal > div.payTotal { width: 100%; border-top: 1px solid var(--line_02); margin-top: var(--80); position: relative; padding-top: 0; } 
._payTotal > div.payTotal .tit { float: left; line-height: var(--100); font-size: var(--26); text-align: left; } 
._payTotal > div.payTotal .txt { float: right; font-size: var(--34); letter-spacing: -0.1vw; line-height: var(--100); margin-top: 0; } 
._payTotal > div.payTotal button { height: 100%; clear: both; } 
._payTotal > div:after { content: ""; display: block; clear: both; } 
._payTotal:after { display: none; } 



/*사용자 주문정보*/
.deliveryInfor { margin:0; padding:var(--40) var(--36) var(--20); background-color: #fff; } 
.deliveryInfor .deliveryType { float: initial; width: 100%;; text-align: left; font-size: var(--38); background-size: var(--60); font-weight: 300; padding-top: 0; background-position: left; padding-left: var(--80); margin-bottom: var(--30); } 
.deliveryInfor .userInfor { float: initial; width: 100%; padding-left: 0; } 
.deliveryInfor .userInfor:after { display: none; } 
.deliveryInfor .userInfor li { display: block; line-height: initial; margin-bottom: var(--40); } 
.deliveryInfor .userInfor li.addr { border-bottom: 1px solid var(--line_02); padding-bottom: var(--30); margin-bottom: var(--30); } 
.deliveryInfor .userInfor li.addr .txt { font-weight: 700; } 
.deliveryInfor .userInfor li.user { float: left; } 
.deliveryInfor .userInfor li.user .txt { max-width: var(--360); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 
.deliveryInfor .userInfor li.phone { float: left; } 
.deliveryInfor .userInfor li.phone .txt { position: relative; transform: translateY(var(--40)); margin-left: var(--16); padding-left: var(--16); } 
.deliveryInfor .userInfor li.phone .txt:after { content: ""; width: 1px; display: block; height: var(--26); position: absolute; left: 0; bottom:var(--5); background-color: #000; } 
.deliveryInfor .userInfor li.time { clear: both; } 
.deliveryInfor .userInfor li.phone .tit { display: none; } 
.deliveryInfor .userInfor li.addr .tit { display: none; } 
.deliveryInfor .userInfor li .tit { width: 100%; color: var(--txt_02); font-size: var(--24); margin-bottom: var(--14); line-height: var(--24); } 
.deliveryInfor .userInfor li .txt { font-size:var(--30); font-weight: 500; } 
.deliveryInfor .userInfor li .txt p,
.deliveryInfor .userInfor li .txt span { font-size: var(--26); padding-left: 0; margin-left: 0; margin-top: var(--16); width: 100%; display: block; font-weight: 500; color: var(--txt_02); } 
.deliveryInfor .userInfor li .txt p:after,
.deliveryInfor .userInfor li .txt span:after { display: none; } 
.deliveryInfor .userInfor li.time .txt { position: relative; } 
.deliveryInfor .userInfor li .txt p { position: absolute; width: initial; color:var(--txt_03); right: 0; bottom: 0; display: inline; text-align: right; } 


._switch { width: var(--110); height: var(--56); position: relative; } 
._switch input { position: absolute; appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 100%; height: 100%; left: 0; display: block; top: 0; opacity:0; z-index: 1 } 
._switch .switch_label { position: relative; cursor: pointer; display: inline-block; width: 100%; height: 100%; background: var(--line_02); border-radius:5vw; transition: 0.2s; } 
._switch .onf_btn { position: absolute; top: 0.84vw; left:var(--7); display: inline-block; width: var(--42); height: var(--42); border-radius:var(--42); background: #fff; transition: 0.2s; } 
._switch input[type="checkbox"]:checked + .switch_label { background: var(--colmainB); } 
._switch input[type="checkbox"]:checked + .switch_label .onf_btn { left: calc(100% - var(--48)); background: #fff; } 

/*step arrow*/
._step { padding:var(--36); } 
._step span { background-size: var(--10); padding-right:var(--82); background-position: calc(100% - var(--36)); font-size: var(--28); } 
 
/*SNS 로그인*/
.snsLogin .tit { font-size: var(--28); margin-bottom: var(--50); } 
.snsLogin ul li { background-size:var(--82); padding-top: var(--100); margin: 0 var(--28); width: var(--82); font-size: var(--24); } 


/*list Table*/
._tablList { min-height: var(--960); } 
._tablList ul li div { height: var(--110); } 




/*게시판*/
._boardTotal { padding-bottom: var(--10); margin: 0 auto; width: calc(100% - var(--72)); font-size: var(--26); } 
._boardList { width: calc(100% - var(--72)); margin: 0 auto;; border-top:1px solid var(--line_01); min-height: var(--720); } 
._boardList li { line-height:initial; display: block; padding: var(--36) var(--10); } 
._boardList li .tit { font-size: var(--28); line-height: var(--28); width:100%; overflow:visible; white-space:normal; line-height: var(--36); } 
._boardList li .num { display: none; } 
._boardList li .day { font-size:var(--24); margin-top: var(--10); width: initial; text-align: left; } 
._boardList li.top { display: none; } 
._boardList .empty div { line-height: var(--200); } 



/*게시판 상세 제목*/
._boardDetailTop { display: block; border-top:0; width: calc(100% - var(--72)); margin: 0 auto;; padding: var(--30) 0; } 
._boardDetailTop .tit { width: 100%; line-height: var(--52); font-size: var(--38); font-weight: 600;margin-bottom: var(--10);} 
._boardDetailTop .day { width: 100%; margin-top:0;line-height: var(--46); font-size:var(--26); color: #969696; } 
._boardDetailTop .fonSizeBox {bottom: var(--30); } 
._boardDetailTop .fonSizeBox .openBtn { padding: var(--12) var(--16); border-radius:var(--6); }
._boardDetailTop .fonSizeBox .openBtn > span { gap: var(--2); } 
._boardDetailTop .fonSizeBox .openBtn span.small { font-size: var(--20); line-height: var(--20); } 
._boardDetailTop .fonSizeBox .openBtn span.big { font-size: var(--26); line-height: 3.19vw } 
._boardDetailTop .fonSizeBox input[type="checkbox"] { width: var(--74); height:var(--46); left: 0; top: 0; } 
._boardDetailTop .fonSizeBox .setPop { display: none; top: var(--54); padding: var(--24) var(--36); border-radius: var(--10); } 
._boardDetailTop .fonSizeBox .setPop::after { content: ""; position: absolute; top: -2vw; right: var(--24);  width: 0; height: 0; border-left: var(--14) solid transparent; border-right:var(--14) solid transparent; border-bottom: var(--16) solid #fff; filter: drop-shadow(0px -1vw 1vw rgba(0, 0, 0, 0.06)); } 
._boardDetailTop .fonSizeBox .setPop ul { display: flex; gap: var(--10); width: 100%; } 
._boardDetailTop .fonSizeBox .setPop ul::before {  width:calc(100% - var(--140)); height: var(--24); top:var(--56); }
._boardDetailTop .fonSizeBox .setPop ul li { padding: var(--16) 0; width: calc(var(--100) + var(--7)); flex: 1; } 
._boardDetailTop .fonSizeBox .setPop ul li .ico { width: var(--58); height: var(--58); }
._boardDetailTop .fonSizeBox .setPop ul li.fontsize-small .ico { font-size: var(--20); } 
._boardDetailTop .fonSizeBox .setPop ul li.fontsize-normal .ico { font-size: var(--22); } 
._boardDetailTop .fonSizeBox .setPop ul li.fontsize-large .ico { font-size: var(--28); } 
._boardDetailTop .fonSizeBox .setPop ul li.fontsize-xlarge .ico { font-size: var(--32); } 
._boardDetailTop .fonSizeBox .setPop ul li.fontsize-xxlarge .ico { font-size: var(--36); } 
._boardDetailTop .fonSizeBox .setPop ul li > div { gap: var(--16); } 
._boardDetailTop .fonSizeBox .setPop ul li .txt { font-size: var(--24); } 




}/*720*/