@media only screen and (min-width: 321px) and (max-width: 450px) {
.categoryWrap{width:30.7%!important;max-width:50%!important}
}
@media only screen and (min-width: 451px) and (max-width: 767px) {
.categoryWrap{width:30.7%!important;max-width:50%!important}
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
#addMyMenuTitleDiv1{width:50%!important;text-align:right!important;float:left!important}
#addMyMenuTitleDiv2{width:50%!important;text-align:left!important;float:right!important;padding-left:5px!important}
.addMyMenuTitleDiv{width:50%!important;float:left!important}
.addMyMenuTitleReNameDiv{width:50%!important;float:left!important}
#itemSelectDIV{width:50%!important;float:left!important}
#itemSelectBtnDIV{width:50%!important;float:left!important}
#itemSelectNoteDIV{width:50%!important;float:left!important}
.itemGridWrap{width:Calc(33% - 10px)!important}
.categoryWrap{width:23%!important;max-width:60%!important}
.input-group{padding-top:5px!important}
.headerMenuBottomTitle{display:none!important}
.headerMenuTitle{display:block!important}
.category3depth{width:48%!important}
.dropDownBoxWrap{width:32%!important;float:left;margin-left:5px}
}
@media only screen and (min-width: 1024px) {
#addMyMenuTitleDiv1{width:50%!important;text-align:right!important;float:left!important}
#addMyMenuTitleDiv2{width:50%!important;text-align:left!important;float:right!important;padding-left:5px!important}
.addMyMenuTitleDiv{width:50%!important;float:left!important}
.addMyMenuTitleReNameDiv{width:50%!important;float:left!important}
#itemSelectDIV{width:50%!important;float:left!important}
#itemSelectBtnDIV{width:50%!important;float:left!important}
#itemSelectNoteDIV{width:50%!important;float:left!important}
.itemGridWrap{width:Calc(25% - 10px)!important}
.categoryWrap{width:24%!important;max-width:60%!important}
.input-group{padding-top:5px!important}
.headerMenuBottomTitle{display:none!important}
.headerMenuTitle{display:block!important}
.category3depth{width:49%!important}
.dropDownBoxWrap{width:32%!important;float:left;margin-left:5px}
}
.countingDiv .img{margin-top:6px}
.itemImageElement{width:140px;height:80px}
.itemImageElement_3{width:110px;height:80px}
.itemGridWrap{width:Calc(50% - 10px);float:left;margin:5px}
.itemGridListDesDiv{width:Calc(100% - 115px);display:table-cell}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.addMyMenuBtnDiv{width:100%;height:45px;margin:20px auto 0;max-width:300px!important;text-align:center}
#itemSelectDIV{width:100%;}
#itemSelectBtnDIV{width:100%;padding:10px}
#itemSelectNoteDIV{width:100%;padding:10px}
.category3depthBtn{font-size:12px;padding:4px 15px;margin-top:0}
.category3depthBtnDiv{width:47px;float:right;height:100%;padding-left:5px}
.category3depthTitle{width:Calc(100% - 47px);float:left;background-color:#f26227;height:100%;text-align:center;padding-top:5px;color:#e1e1e1}
.category3depth{width:100%;height:28px;margin:4px;float:left}
.selectCategory2depthBtn{font-size:12px;padding:4px 15px;margin-top:0}
.selectCategory2depthBtnDiv{width:47px;float:right;height:100%;padding-left:5px}
.selectCategory2depthTitle{width:Calc(100% - 47px);float:left;background-color:#f26227;height:100%;text-align:center;padding-top:5px;color:#e1e1e1}
.category2depth{width:100%;height:28px;margin:4px}
.dropDownBoxWrap{width:100%;margin-top:5px}
.SearchWords{color:red}
#TopToBtnDivWrap{position:fixed;bottom:70px;right:5px;z-index:10}
.CountInput{text-align:right;padding-right:5px;width:100%;height:25px}
.CountInputDivWrap{width:25%;float:left;padding-top:5px;text-align:right;height:40px}
.TotalAmountDivWrap{width:35%;float:left;padding:10px 5px 5px;height:40px;text-align:right}
.EllipsisBarcodeWrap{width:40%;float:left;padding:10px 5px 5px;height:40px}
.MainListBarcodeTotalAmountWrap{width:100%;height:40px}
.AmountDivWrap{padding:5px;float:left;width:30%;text-align:right}
.EllipsisUnitWrap{width:25%;float:left;padding:5px}
.EllipsisItemWrap{padding:5px;float:left;width:45%}
.MainListWrap{width:100%;padding:5px}
.MainContentsDivWrap{width:100%;padding:0;min-height:100%;max-width:1024px;margin:0 auto;padding-top:14px}
.MainContentsWrap{vertical-align:top;width:100%}
.headerInsteadSpace{width:100%;height:100px}
.MainBodyWrap{width:100%;height:100%}
.headerSumMenuWrap{height:100%;margin:0 auto;width:100%;max-width:1024px}
.headerMenuBottomTitle{color:#b6b6b6;font-size:12px;padding-top:2px;font-weight:700;text-align:center;text-align:center}
.headerMenuTitle{float:left;padding-top:15px;margin-left:5px;color:#b6b6b6;display:none;font-weight:700}
.footerTd{padding:10px;font-size:11px;text-align:center;background-color:#efeeee;font-weight:700}
.MainListTitle{margin-top:15px;padding-left:10px;font-weight:700;height:24px}
.MainCategoryWrap{width:100%;border-bottom:1px solid #c8c9ca;padding:5px 5px 8px}
.categoryWrap{border:1px solid #c8c9ca;padding:5px;margin:4px;float:left;max-width:150px;width:30.7%;text-align:center;cursor:pointer;font-size:12px}
.truncateEllipsis{width:100%;display:table;table-layout:fixed}
.truncateEllipsis > *{display:table-cell;overflow:hidden;text-overflow:ellipsis}
div.ellipsisTest3{width:90%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
div.ellipsisTest2{white-space:nowrap;max-width:47%;width:auto;overflow:hidden;text-overflow:ellipsis;border:1px solid gray;margin:5px;float:left}
div.ellipsisTest{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radioBtnWrap3{display:inline-block}
.radioBtnWrap3 input{display:none}
.radioBtnWrap3 input:checked + label{background:#717071;color:#fff;border:1px solid #717071;font-weight:700}
.radioBtnWrap3 label{padding:6px 20px;cursor:pointer;font-size:.9em;background:#fff;border:1px solid #717071;margin-right:-6px}
.button .selectBtn{border-bottom:3px solid #000}
.button{position:relative;background-color:#fff;border:1px solid #bab9b9;padding:5px;text-align:center;-webkit-transition-duration:.4s;transition-duration:.4s;text-decoration:none;overflow:hidden;cursor:pointer}
.button:after{content:"";background:#36638a;display:block;position:absolute;padding-top:300%;padding-left:350%;margin-left:-20px!important;margin-top:-120%;opacity:0;transition:all .4s}
.button:active:after{padding:0;margin:0;opacity:1;transition:0}
#scrollToTop{padding:5px;border:1px solid #000}

#categoryViewBtnDiv{width:40px;height:40px;position:absolute;bottom:-41px;right:6px}
#selectCategoryView{position:fixed;top:60px;left:0;width:100%;height:40px;padding:2px 0 0 7px;z-index:3;background:#fff;border-bottom:1px solid #c8c9ca}
.itemAllViewBtnDiv{float:right;padding-top:2px}
.selectCategoryTitleViewDiv{float:left;padding:10px 0 0 10px;width:100%;position:absolute;text-align:center;z-index:-1}
#selectCategoryTitleDIV{font-size:15px}
.categoryViewFolderBtnDiv{float:right;margin-right:9px}
.categoryViewFolderBtn{background-color:#fff;color:#b6b6b6;border-radius:0;border:0;color:#f26227}
#totalCountDiv{float:right;margin-right:10px}
.itemGridListTitleDiv{width:100%;height:30px;padding-top:5px}
.itemGridListPriceDiv{width:100%;height:25px}
.itemSelectImageDIV{float:left;width:140px}
.itemSelectImageDIV .itemImageElement{width:140px;height:80px}
.selectItemTitlePriceWrap{float:left;width:Calc(100% - 120px);padding:5px}
.selectItemTitlePriceWrap .selectItemTitleWrapDiv{text-align:center;font-size:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700;padding-left:0}
.selectItemTitlePriceWrap .selectItemPriceWrapDiv{width:100%;height:35px;padding-top:0}
.selectItemTitleSubWrap .selectItemTitleSubWrapDiv {text-align:left;font-size:18px;overflow:hidden;text-overflow:ellipsis;font-weight:700;padding-left:15px}
.selectItemTitleSubWrap .selectItemPriceWrapDiv2{text-align:left;font-size:15px;white-space:nowrap;text-overflow:ellipsis;font-weight:700;padding-left:15px;overflow-y:auto;height:85px}

.selectItemTitleSubWrap .selectItemTopingInfoDiv{
    border:1px solid red;
    text-align:left;font-size:15px;
    white-space:nowrap;text-overflow:ellipsis;
    font-weight:700;padding-left:15px;}

#itemSelectDIV .selectItemTopingInfoDiv{text-align:left;font-size:15px;white-space:nowrap;text-overflow:ellipsis;font-weight:700;padding-left:15px;overflow-y:auto;}
#itemSelectDIV .selectItemTopingInfoDiv .subPrice{text-align:left;font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700;float:right}

.selectItemTitleSubWrap .selectItemPriceWrapDiv3{text-align:left;font-size:13px;white-space:normal;text-overflow:ellipsis;padding-left:20px;overflow:auto;height:65px;padding-top:5px}
.selectItemTitleSubWrap .selectItemPriceWrapDiv2 .subPrice{text-align:left;font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700;float:right}
.selectItemMyMenuBtnWrapDiv{float:right;width:32px}
.OrderSelectorAllWrapDiv{width:100%;max-width:115px;margin:0 auto;height:32px}
.OrderSelectorBtnsWrapDiv{float:left;height:32px}
#orderCountMinus{padding:3px 8px;margin-top:0;border-color:#c8c9ca}
#orderCount{height:30px;text-align:center;font-size:16px;color:#000;width:48px;border-radius:0;background:#fff;border-color:#fff;border:0;box-shadow:none}
#orderCountPlus{padding:3px 8px;margin-top:0;border-color:#c8c9ca}
.OrderTopingTitleDiv{width:100%;padding:5px 5px 3px 15px;
                     
                     border-bottom: 1px solid #eee;}
    .OrderTopingTitleDiv > div:nth-child(1) {        
        width:calc(100% - 36px);
    }
.OrderTopingGridDiv{width:100%;margin-bottom:10px;border-top:1px solid #BBB;border-bottom:1px solid #BBB;background:#f6f6f6;}
/*.topingGridDiv{float:left;margin:0px;padding:5px;border:1px solid #bbb;font-size:15px;text-align:center;height:60px;display:table;width:33%;box-sizing:border-box;background-color:#fff}
.topingGridDiv > span{display:table-cell;vertical-align:middle;padding:0px}*/
.orderSetGridDiv > span{display:table-cell;vertical-align:middle;padding:0 10px}
.OrderSetLevelTitleDiv{width:100%;padding:15px 5px 3px 15px}
.OrderSetGridAllWrapDiv{width:100%;padding:5px;border-bottom:1px dashed #e1e1e1;margin-bottom:10px}
.orderSetGridDiv{float:left;margin:5px;padding:5px;border:1px solid #635f5c;font-size:15px;text-align:center;height:60px;display:table;min-width:30%}
.bsTypeBtnAllWrapDiv{width:100%;height:45px;margin-bottom:5px}
.bsTypeBtnAllWrapDiv .bsTypeHallWrapDiv{width:Calc(50% - 5px);height:45px;float:left;font-size:15px;font-weight:700;border:1px solid #635f5c;text-align:center;padding-top:12px}
.bsTypeBtnAllWrapDiv .bsTypeTakeOutWrapDiv{width:Calc(50% - 5px);height:45px;float:right;font-size:15px;font-weight:700;border:1px solid #635f5c;text-align:center;padding-top:12px}
.basketQRCodeBtnAllDiv{width:100%;height:45px;margin-top:10px}
.basketQRCodeBtnAllDiv .CancelBtnDiv{width:Calc(33% - 5px);height:45px;float:left;font-size:15px;font-weight:700;background:#c0bebe;color:#fff;text-align:center;padding-top:12px}
.itemInfomationAllDiv{width:100%;padding:20px 5px}
.itemInfomationTitleTopingWrapDiv{width:100%;padding-bottom:30px}
.itemInfomationTitleTopingWrapDiv .itemInfomationTitleWrapDiv{width:100%;height:25px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.itemInfomationTitleTopingWrapDiv .itemInfomationTitleWrapSpan{font-size:14px;font-weight:700}
.qrcodeWrapDiv{width:274px;height:274px;margin:0 auto;border:2px dashed #c8c9ca}
#qrcode{width:250px;height:250px;margin:0 auto;margin-top:10px}
.userInfoWrapDiv{width:100%;font-size:13px;text-align:center;margin-top:10px}
@media only screen and (max-width: 365px) {
.head_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;font-size:16px;display:inline-block}
.head_title_table{font-size:16px}
}
@media only screen and (min-width: 365px) and (max-width: 430px) {
.head_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;font-size:17px;display:inline-block}
.head_title_table{font-size:17px}
}
@media only screen and (min-width: 430px) and (max-width: 580px) {
.head_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;font-size:18px;display:inline-block}
.head_title_table{font-size:18px}
}
@media only screen and (min-width: 580px) and (max-width: 767px) {
.head_title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;font-size:19px;display:inline-block}
.head_title_table{font-size:19px}
}
@media only screen and (min-width: 768px) and (max-width:1024px) {
.head_title{font-size:20px;overflow:hidden;text-overflow:ellipsis;display:inline-block;white-space:nowrap}
.head_title_table{font-size:20px}
}
@media only screen and (min-width: 1024px) {
.head_title{font-size:21px;overflow:hidden;text-overflow:ellipsis;display:inline-block;white-space:nowrap}
}

.topingGridDiv {
    float:left;
    margin:0px;
    padding:5px;    
    font-size:15px;
    text-align:center;
    height:40px;
    display:table;
    width:100%;box-sizing:border-box;
    background-color:#fff;
    cursor:pointer;
}

.topingGridDiv > div:nth-child(1) {
    display:table-cell;    
    width:70%;
    vertical-align:middle;
    text-align:left;    
}

.topingGridDiv > div:nth-child(1) > span{
    display:inline-block;
    vertical-align:middle;
    padding:0px;
    box-sizing:border-box;
    font-size:14px;
    color: #353535;
}

.topingGridDiv > div:nth-child(1) > span em{
    display:inline-block;
    vertical-align:middle;
    margin-left:10px;
    margin-right:10px;
    width: 24px;
    height: 24px;
    background: transparent url('/Common/Images/WebOrder/checkbox_off_modifier.png') no-repeat;
    background-position:left center;
    background-size:contain;
    opacity: 1;
}

.topingGridDiv > div:nth-child(2) {
    display:table-cell;
    width:15%;
    vertical-align:middle;
    text-align:right;    
    padding-right:10px;    
}

.topingGridDiv > div:nth-child(2) > span {
    color: #878787;
    font-size: 14px;
}

.topingGridDiv input[type=checkbox] {
    display:none;    
}

.topingGridDiv input[type=checkbox]:checked + span em {
    background: transparent url('/Common/Images/WebOrder/checkbox_on_modifier.png') no-repeat;
    background-position:left center;
    background-size:contain;
}

.m_td { width:100%;border-bottom: 1px solid #e5dddd; }
.table_subModi .m_td {padding: 0px; }

#scheduleDivWrap {
    position:fixed;
    width:240px;
    height:35px;    
    border-radius:20px;
    background-color:#858785;
    opacity:0.8;
    bottom:30px;
    right:5px;
    z-index:20;
    color:#fff;
    cursor:pointer;
}

#scheduleDateSpan {
    margin-left:15px;
    line-height:35px;
    font-size:15px;
}

#scheduleDivWrap > i {
    margin-left:5px;    
    font-size:15px;
}