.sub-quick__box {overflow:hidden}
.sub-quick__box .sub-quick__link {float:left;width:50%}
.sub-quick__box .sub-quick__link .sub-quick__subtitle {
    left: 58.5px;
}
.sub-quick__box:nth-child(1) .sub-quick__link:nth-child(1) .sub-quick__subtitle{
    top: 32px;
}
.sub-quick__box:nth-child(1) .sub-quick__link:nth-child(2) .sub-quick__subtitle{
    top: 32px;
}
.sub-quick__box:nth-child(2) .sub-quick__link:nth-child(1) .sub-quick__subtitle{
    top: 39.5px;
}
.sub-quick__box:nth-child(2) .sub-quick__link:nth-child(2) .sub-quick__subtitle{
    top: 49.5px;
}

/* 서브 공통 */
.sub_main>div{
    position:relative;
    max-width:1260px;
    box-sizing:border-box;
    margin:0 auto;
    word-break:keep-all
}
.sub_main>div.bg{background:#f5f9ff}
.sub_main>div.bg:before,
.sub_main>div.bg:after{
    content:'';
    position:absolute;top:0;
    display:block;width:200%;height:100%;
    background:#f5f9ff
}
.sub_main>div.bg:before{right:100%}
.sub_main>div.bg:after{left:100%}

/* 20231124 서브 공통 추가*/
.sub_main>div.bg2{background:#fafafa;}
.sub_main>div.bg2:before,
.sub_main>div.bg2:after{
    content:'';
    position:absolute;top:0;
    display:block;width:200%;height:100%;
    background:#fafafa
}
.sub_main>div.bg2:before{right:100%}
.sub_main>div.bg2:after{left:100%}

div.sub_visual{
    position:relative;
    max-width:100%;
    background: rgb(77,138,255);background: linear-gradient(149deg, rgba(77,138,255,1) 0%, rgba(160,199,254,1) 100%);
}
.sub_visual h2{
    max-width:1260px;
    box-sizing:border-box;
    margin:0 auto;padding:0 40px;
    font-size:30px;font-weight:500;color:#e6eefc
}
.sub_visual h2:after{
    content:'';
    position:absolute;left:50%;top:0;
    display:block;width:560px;height:560px;
    background:url(../../../img/main/v3/pos/visual.png) no-repeat center;
    opacity:0;transition:.7s
}
.sub_visual h2>span{
    display:table-cell;
    height:560px;
    vertical-align:middle
}
.sub_visual h2 b{
    display:block;
    font-size:70px;font-weight:700;color:#fff
}
.sub_visual h2.aos-animate:after{opacity:1;transition-delay:.2s}
.sub_info{padding:80px 40px}
.sub_info>div{
    position:relative;
    padding:80px 0 80px 49.5%;
}
.sub_info>div h3{
    margin-bottom:35px;
    font-size:30px;font-weight:700;line-height:42px;color:#242424
}
.sub_info>div h3 span{display:inline-block;font-weight:700;}
.sub_info>div h3 b{color:#477fe9}
.sub_info>div>ul>li{
    position:relative;
    padding-left:28px;margin-top:14px;
    font-size:24px;color:#4d4d4d
}
.sub_info>div>ul>li:before{
    content:'';
    position:absolute;top:7px;left:0;
    display:block;width:14px;height:14px;
    background:#e6eefc;border-radius:3px;
}
.sub_info>div>ul ul{
    padding:16px 32px;margin:25px 0 0 -28px;
    background:#f2f2f2;border-radius:5px;
}
.sub_info>div>ul ul li{font-size:16px}
.sub_info>div p{
    position:absolute;left:0;top:50%;
    width:calc(50% - 100px);
    transform:translateY(-50%);
}

.sub_feature{padding:0 40px 120px;}
.sub_feature .feature_wrap{position:Relative;max-width:937px;margin:0 auto}
.sub_feature .feature_list{overflow:Hidden;}
.sub_feature .feature_list.has-fade .fade-img {position: absolute; top: 0; left: 0; opacity: 0; width: 100%;}
.sub_feature .feature_list.has-fade .img1{ animation: fadeImg1 8s infinite linear;}
.sub_feature .feature_list.has-fade .img2{ animation: fadeImg2 8s infinite linear;}
.sub_feature .feature_list.has-fade .img3{ animation: fadeImg3 8s infinite linear;}
@keyframes fadeImg1 {
    0% {
        opacity: 1;
    }
    10% {
        opacity: 1;
    }
    29% {
        opacity: 1;
    }
    33.333% {
        opacity: 0;
    }
    50% {
        opacity: 0;
    }
    66.666% {
        opacity: 0;
    }
    83.333% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadeImg2 {
    0% {
        opacity: 0;
    }
    28.666% {
        opacity: 0;
    }
    33.333% {
        opacity: 1;
    }
    43.333% {
        opacity: 1;
    }
    62% {
        opacity: 1;
    }
    66.666% {
        opacity: 0;
    }
    83.333% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
@keyframes fadeImg3 {
    0% {
        opacity: 0;
    }
    16.666% {
        opacity: 0;
    }
    33.333% {
        opacity: 0;
    }
    60% {
        opacity: 0;
    }
    66.666% {
        opacity: 1;
    }
    76.666% {
        opacity: 1;
    }
    95.333% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.sub_feature .feature_list.none-tab { padding-top: 30px; } /* 20231116 추가 */
.sub_feature h3{
    padding:120px 0 50px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:60px;
}
.sub_feature h3 b{color:#477fe9}
.sub_feature .tab{
    display:flex;gap:48px;
    box-sizing:border-box;
    margin-bottom:40px;padding:11px 16px;
    border:3px solid #477fe9;border-radius:44px;
    background:#fff;
}
.sub_feature .tab span{
    flex:1;
    position:relative;
    display:block;height:48px;line-height:48px;
    background:#f5f9ff;border-radius:30px;
    text-align:center;font-size:18px;font-weight:700;color:#477fe9;opacity:1
}
.sub_feature .tab span:hover,
.sub_feature .tab span.swiper-pagination-bullet-active{background:#477fe9;color:#fff}
.sub_feature .btns{display:None}
.sub_feature .swiper-slide{border-radius:38px;overflow:Hidden;}
.sub_feature .feature_list.none-tab .swiper-slide {border-radius: 0; background: transparent;} /* 20231116 추가 */

/* 20240131 sub_more 수정 및 삭제 */
.sub_more{padding:120px 40px 120px;}
.sub_more h3{margin-bottom:80px;text-align:center;font-size:60px;color:#262626;font-weight:700; padding-top: 0 !important; }
.sub_more h3 b{color:#477fe9}
.sub_more h3 span{display:inline-block;word-break:keep-all;font-weight:700}

/* .sub_more h3:before{
    content:'';
    display:inline-block;width:80px;height:80px;
    margin:0 12px 0 0;
    background:url(../../../img/main/v3/ic-plus-bubble.svg) no-repeat center;
    vertical-align:top
} */
.sub_more .randing-wrap { overflow: hidden; border-radius: 25px;  box-shadow: 0 0 30px 0 rgba(66, 96, 155, 0.05); position: relative; width: 100%; height: 738px; background-size: cover; background-position: center;background-repeat: no-repeat; background-color: #ffffff;}
.sub_more ul { width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.sub_more li { display:inline-block; position: absolute; text-align: center; }
.sub_more li dl dt{display:block; padding:13px 34px; background-color: #477fe9; border-radius: 30px; margin-bottom:6px; font-size:26px;font-weight:700;color:#ffffff;line-height: 1.12;}
.sub_more li dl dd{display:inline-block; font-size:26px;color:#999;font-weight:700}
.sub_more li dl dd a{ text-align: center; font-size: 20px; vertical-align: middle;}
.sub_more li dl dd a span.w{vertical-align: middle; padding-right: 36px; position: relative; font-size: 20px; line-height: 1.5; color:#477fe9; font-weight: 700; transition: all 0.2s; }
.sub_more li dl dd a span.w::before { background-color:#477fe9; content: ""; position: absolute; top: 50%; right: 0; display: block;  width: 22px; height: 2px; transition: all 0.2s;}
.sub_more li dl dd a span.w::after { background-color:#477fe9; width: 8.5px; margin-top: -3px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); content: ""; position: absolute; top: 50%; right: 0; display: block; height: 2px; transition: all 0.2s;}
.sub_more li dl dd a span.m{display:none;}
.sub_more li dl dd a:hover span.w { padding-right: 46px;}
.sub_more li dl dd a:hover span.w::after {right: -10px;}
.sub_more li dl dd a:hover span.w::before { right: -10px; width: 40px;}


div.sub_contact{
    max-width:100%;
    padding:120px 40px;
    background:#fafafa
}
.sub_contact h3{
    margin-bottom:65px;
    text-align:center;font-size:30px;font-weight:600;color:#4d4d4d
}
.sub_contact h3 b{display:block;margin-bottom:13px;font-size:70px;font-weight:700;color:#262626}
.sub_contact p,
.sub_contact .blue-btn {text-align:center}
.sub_contact p a,
.sub_contact .blue-btn a{
    display:inline-block;width:100%;max-width:560px;height:120px;line-height:116px;
    background:#477fe9;border-radius:10px;
    text-align:center;font-size:40px;font-weight:700;color:#fff
}
.sub_contact p a:before,
.sub_contact .blue-btn a:before{
    content:'';
    display:inline-block;width:48px;height:100%;
    margin:0 10px 0 0;
    background:url(../../../img/main/v3/ic-phone.svg) no-repeat center;
    vertical-align:top
}


.sub_btns{display:None}
.sub_main h3.m{display:none}

/*20240131 분합 탭 추가*/
.sub_main[data-mode="mode1"] .mode1-box { display: block; }
.sub_main[data-mode="mode1"] .mode2-box { display: none; }
.sub_main[data-mode="mode2"] .mode1-box { display: none; }
.sub_main[data-mode="mode2"] .mode2-box { display: block; }
.division-tap {display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; width: 100%;}
.division-tap ul{ display: flex; -webkit-box-align: center; align-items: center; margin-top: 120px;}
.division-tap ul li{ cursor: pointer; font-size: 22px; font-weight: 700; line-height: 1.44; text-align: center; color: #477fe9; background-color: #e6eefc;width: 120px;height: 120px; margin: 0 8px; cursor: pointer; border-radius: 50%; }
.division-tap ul li.active{ color: #ffffff; background-color: #477fe9;}
.division-tap ul li div { display: block; margin-top: 22px; }
.division-tap ul li div img { filter: invert(39%) sepia(95%) saturate(1906%) hue-rotate(205deg) brightness(100%) contrast(83%); max-width: 40px;}
.division-tap ul li.active div img { filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(133deg) brightness(104%) contrast(100%);}


/* 메이트 포스 */
#matePos .feature1 .tab span:nth-child(1):after{content:'내점'}
#matePos .feature1 .tab span:nth-child(2):after{content:'배달'}
#matePos .feature1 .tab span:nth-child(3):after{content:'포장'}
#matePos .feature1 .tab span:nth-child(4):after{content:'전화'}
#matePos .feature1 .tab span:nth-child(5):after{content:'키오스크'}

#matePos .feature2 .tab span:nth-child(1):after{content:'주문 접수'}
#matePos .feature2 .tab span:nth-child(2):after{content:'주문 수락'}
#matePos .feature2 .tab span:nth-child(3):after{content:'라이더 호출'}
#matePos .feature2 .tab span:nth-child(4):after{content:'배달 완료'}
#matePos .feature2 .tab span+span:before{
    content:'';
    position:absolute;top:0;right:100%;
    display:block;width:48px;height:48px;
    background:url(../../../img/main/v3/ic-play-arrow.svg) no-repeat center;background-size:19px auto
}
#matePos .feature3 .tab{gap:79px}
#matePos .feature3 .tab span:nth-child(1):after{content:'주문 관리'}
#matePos .feature3 .tab span:nth-child(2):after{content:'마감 정산'}
#matePos .feature3 .tab span+span:before{
    content:'';
    position:absolute;top:0;right:100%;
    display:block;width:79px;height:48px;
    background:url(../../../img/main/v3/ic-plus.svg) no-repeat center;background-size:32px auto
}
#matePos .sub_know{padding:120px 40px}

/* 20240131 sub_more 수정 및 삭제 */
#matePos .sub_more li { top: 50px; left: 50%;}
#matePos .sub_more li:nth-child(1) { margin-left: -275px;}
#matePos .sub_more li:nth-child(2) { margin-left: 40px;}


/*
.sub_know ul{display:flex;gap:64px 76px;flex-flow: row wrap;transform: translate3d(0, 0px, 0px) !important;}
.sub_know ul li{min-width:calc(50% - 38px);}
*/
.sub_know ul{gap:64px 76px;flex-flow: row wrap;height:auto !important;}
.sub_know ul li{min-width:calc(50% - 38px);background:#fafafa;border-radius:10px;overflow:hidden;}
.sub_know ul li dl{padding:48px;}
.sub_know ul li dl dt{margin-bottom:15px;font-size:40px;font-weight:700;color:#477fe9}
.sub_know ul li dl dd{font-size:24px;font-weight:500;color:#4d4d4d;line-height:36px;}



/* 사장님 앱 */
#mateApp .sub_visual h2:after{background-image:url(../../../img/main/v3/app/visual.png);}
#mateApp .feature1 .tab span:nth-child(1):after{content:'주문 수락'}
#mateApp .feature1 .tab span:nth-child(2):after{content:'주문 거절'}
#mateApp .feature1 .tab span:nth-child(3):after{content:'라이더 호출'}
#mateApp .feature1 .tab span:nth-child(4):after{content:'배달 완료'}

#mateApp .feature2 .tab span:nth-child(1):after{content:'총 매출'}
#mateApp .feature2 .tab span:nth-child(2):after{content:'인기 메뉴'}
#mateApp .feature2 .tab span:nth-child(3):after{content:'상세 매출 분석'}

#mateApp .feature3 .tab span:nth-child(1):after{content:'배달 현황'}
#mateApp .feature3 .tab span:nth-child(2):after{content:'매출 현황'}

/* 20240131 sub_more 수정 및 삭제 */
#mateApp .sub_more li { left: 50%;}
#mateApp .sub_more li:nth-child(1) {top: 171px; margin-left: -385px;}
#mateApp .sub_more li:nth-child(2) { top:45px; margin-left: 100px;}

#mateApp .sub_down{padding:120px 40px;text-align:center}
#mateApp .sub_down h3{margin-bottom:100px;font-size:48px;font-weight:700;color:#262626;line-height:72px}
#mateApp .sub_down h3 b{display:block;color:#477fe9}
#mateApp .sub_down ul{font-size:0}
#mateApp .sub_down ul li{display:inline-block;width:calc(50% - 30px);max-width:480px;}
#mateApp .sub_down ul li+li{margin-left:60px;}
#mateApp .sub_down ul li:before{content:'';display:block;width:100%;height:250px;background:url(../../../img/main/v3/app/play-store-icon-1.svg) no-repeat center;}
#mateApp .sub_down ul li:nth-child(2):before{background-image:url(../../../img/main/v3/app/play-store-icon2.svg)}
#mateApp .sub_down ul li a{
    display:block;height:100px;line-height:100px;
    margin-top:70px;
    background:#477fe9;border-radius:50px;
    text-align:center;font-size:30px;font-weight:700;color:#fff
}
#mateApp .sub_down ul li a:after{
    content:'';
    display:inline-block;width:43px;height:100%;
    margin-left:10px;
    background:url(../../../img/main/v3/ic-download.svg) no-repeat center;
    vertical-align:top
}

/* 메이트 영업관리 */
#mateSales .sub_visual h2:after{background-image:url(../../../img/main/v3/sales/visual.png);}
#mateSales h3{
    padding:120px 0;
    text-align:center;font-size:48px;font-weight:700;color:#262626;line-height:72px;
}
#mateSales h3 b{color:#477fe9}
#mateSales .sub_admin{padding:0 40px 120px;}
#mateSales .sub_admin .btns,
#mateSales .sub_admin_paging{display:none}
#mateSales .sub_admin .swiper-wrapper{position:relative;gap:20px;margin-top:45px}
#mateSales .sub_admin .swiper-wrapper:after{
    content:'';
    position:absolute;top:-45px;left:50%;
    display:block;width:90px;height:90px;
    margin-left:-45px;border-radius:50%;
    background:#477fe9 url(../../../img/main/v3/sales/admin_share.svg) no-repeat center;
}
#mateSales .sub_admin .swiper-slide{
    position:relative;flex:1;
    box-sizing:border-box;padding:0 20px;
    background:#fff;border-radius:26px;
    text-align:center
}
#mateSales .sub_admin .swiper-slide h4{
    max-width:420px;height:90px;line-height:90px;
    margin:-45px auto 40px;
    background:#477fe9;border-radius:50px;
    text-align:center;font-size:40px;color:#f5f9ff;font-weight:700
}
#mateSales .sub_admin .swiper-slide ul{padding:50px 0}
#mateSales .sub_admin .swiper-slide li{padding:18px 0;font-size:32px;color:#4d4d4d;font-weight:600}
#mateSales .sub_admin .sub_admin_paging span:nth-child(1):after{content:'본사 주요 서비스'}
#mateSales .sub_admin .sub_admin_paging span:nth-child(2):after{content:'가맹점 주요 서비스'}
#mateSales .sub_know{padding:0 40px}
#mateSales .sub_contact h3{padding:0;font-size:30px}
#mateSales .sub_contact h3 b{margin-bottom:13px;font-size:60px;font-weight:700;color:#262626}
#mateSales .sub_contact p a:before,
#mateSales .sub_contact .blue-btn a:before{display:none}

/* 20240131 sub_more 수정 및 삭제 */
#mateSales .sub_more {margin-top: 120px;}
#mateSales .sub_more h3 { padding: 0;}
#mateSales .sub_more li {left: 50%;}
#mateSales .sub_more li:nth-child(1) { top: 136px; margin-left: -425px;}
#mateSales .sub_more li:nth-child(2) { top:63px; margin-left: 20px;}

/* 메이트 QR */
#mateQr .sub_visual h2:after{background-image:url(../../../img/main/v3/qr/visual.png);}
#mateQr .sub_step{padding:120px 40px}
#mateQr .sub_step,
#mateQr .sub_step:before,
#mateQr .sub_step:after{background:#fafafa}
#mateQr .sub_step h3{
    padding:0 0 50px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:60px;
}
#mateQr .sub_step h3 b{color:#477fe9}
#mateQr .sub_step div{
    position:relative;
    height:440px;
    box-sizing:border-box;
    padding: 44px 50px;
    background:#fff;
    border-radius: 20px;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.04);
}
#mateQr .sub_step img{position:absolute;top:44px;right:50px;}
#mateQr .sub_step h4{width:129px;height:40px;line-height:40px;margin:100px 0 16px;border-radius:30px;background:#8baff1;text-align:center;font-size:24px;font-weight:600;color:#fff}
#mateQr .sub_step p{font-size:32px;color:#4d4d4d;font-weight:600;line-height:1.5em}
#mateQr .sub_step p b{color:#477fe9;font-weight:600}
#mateQr .sub_step div+div{margin-top:60px;}
#mateQr .sub_step div.step2 h4{background:#5e8fec}
#mateQr .sub_step div.step3 h4{background:#477fe9}
#mateQr .feature1 .tab span:nth-child(1):after{content:'주문 확인'}
#mateQr .feature1 .tab span:nth-child(2):after{content:'매출 확인'}

#mateQr .feature2 .tab span:nth-child(1):after{content:'메뉴'}
#mateQr .feature2 .tab span:nth-child(2):after{content:'주문'}
#mateQr .feature2 .tab span:nth-child(3):after{content:'결제'}

#mateQr .feature3 .tab span:nth-child(1):after{content:'추천 메뉴'}
#mateQr .feature3 .tab span:nth-child(2):after{content:'조합 추천'}
#mateQr .sub_know{padding:120px 40px}

/* 20240131 sub_more 수정 및 삭제 */
#mateQr .sub_more li { left: 50%;}
#mateQr .sub_more li:nth-child(1) {top: 171px; margin-left: -385px;}
#mateQr .sub_more li:nth-child(2) { top:45px; margin-left: 100px;}

#mateQr .qr_test { padding-top: 120px; padding: 120px 40px;}
#mateQr .qr_test,
#mateQr .qr_test:before,
#mateQr .qr_test:after{background:#fafafa}
#mateQr .qr_test h3{
    padding:0 0 40px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:1.5;
}
#mateQr .qr_test h3 b{color:#477fe9}
#mateQr .qr-test-box {

}
#mateQr .qr-test-box ul{
    overflow: hidden;
}
#mateQr .qr-test-box ul li{
    float: left;
    width: calc(50% - 38px);
    text-align: center;
}
#mateQr .qr-test-box ul li > img { max-width: 160px; display: block; margin: auto;}
#mateQr .qr-test-box ul li .label { display:inline-block; font-size: 30px; font-weight: 500; color:#ffffff; line-height: 1.4; padding: 4px 40px;border-radius: 99px; background-color: #477fe9;}
#mateQr .qr-test-box ul li + li {
    margin-left:76px;
}
#mateQr .qr-test-box ul li .blue-box {
    border: solid 3px #477fe9;
    padding: 68px 15.6% 64px;
    border-radius: 10px;
    margin-top: -28px;
}
#mateQr .qr-test-box ul li .blue-box img { width: 60.2%; display: block; margin: auto;}
#mateQr .qr-test-box ul li .blue-box .text { margin-top: 32px; }
#mateQr .qr-test-box ul li .blue-box .text .fc-blue { font-size: 32px; font-weight: bold; line-height: 1.88; color: #477fe9; margin-bottom: 24px; }
#mateQr .qr-test-box ul li .blue-box .text .fc-blue + div { line-height: 1.5; font-size: 24px; font-weight: 500; color: #4d4d4d;}
#mateQr .qr-desc {padding: 20px 0; border-radius: 5px; margin-top: 24px; background-color: #f2f2f2; text-align: center;font-size: 20px; font-weight: 500; line-height: 1.5;}


/* 20231116 메이트 DID 추가 */
#mateDid .sub_visual h2:after{background-image:url(../../../img/main/v3/did/visual.png); background-size: auto 100%;}
#mateDid .sub_know{padding:120px 40px}

/* 20240131 sub_more 수정 및 삭제 */
#mateDid .sub_more li { left: 50%;}
#mateDid .sub_more li:nth-child(1) {top: 203px; margin-left: -555px;}
#mateDid .sub_more li:nth-child(2) { top:62px; margin-left: 20px;}

/* 20231124 메이트 KDS 추가 */
#mateKds h3 b{color:#477fe9}
#mateKds .sub_visual h2:after{background-image:url(../../../img/main/v3/kds/visual.png); background-size: auto 100%;}
#mateKds .sub_know{padding:120px 40px}

/* 20240131 sub_more 수정 및 삭제 */
#mateKds .sub_more li { left: 50%;}
#mateKds .sub_more li:nth-child(1) {top: 56px; margin-left: -465px;}
#mateKds .sub_more li:nth-child(2) { top:109px; left: auto; right:50%; margin-right: -535px;}

#mateKds .sub_admin{padding:0 25px 120px;}
#mateKds .sub_admin h3{ padding:120px 0 72px; text-align:center;font-size:48px;font-weight:700;color:#262626;line-height:72px; }
#mateKds .sub_admin .btns,
#mateKds .sub_admin_paging{display:none}
#mateKds .sub_admin .list-wrapper{position:relative;gap:20px;margin-top:45px; display: flex;}
#mateKds .sub_admin .list-wrapper:after{
    content:'';
    position:absolute;top:-45px;left:50%;
    display:block;width:90px;height:90px;
    margin-left:-45px;border-radius:50%;
    background:#477fe9 url(../../../img/main/v3/sales/admin_share.svg) no-repeat center;
}
#mateKds .sub_admin .list-item{
    position:relative;flex:1;
    box-sizing:border-box;padding:0 20px;
    background:#fff;border-radius:26px;
    text-align:center
}
#mateKds .sub_admin .list-item h4{
    max-width:420px;height:90px;line-height:90px;
    margin:-45px auto 40px;
    background:#477fe9;border-radius:50px;
    text-align:center;font-size:40px;color:#f5f9ff;font-weight:700
}
#mateKds .sub_admin .list-item ul{padding:50px 0}
#mateKds .sub_admin .list-item li{padding:18px 0;font-size:32px;color:#4d4d4d;font-weight:600}
#mateKds .feature1 .tab span:nth-child(1):after{content:'주문 접수'}
#mateKds .feature1 .tab span:nth-child(2):after{content:'조리중'}
#mateKds .feature1 .tab span:nth-child(3):after{content:'조리 완료'}
#mateKds .feature1 .tab span:nth-child(4):after{content:'주문 취소'}

#mateKds .feature2 .tab span:nth-child(1):after{content:'고객 요청'}
#mateKds .feature2 .tab span:nth-child(2):after{content:'시간 초과'}

/* 20240125 메이트 테블릿오더 추가 */
#mateTabletOrder .m { display: none;}
/* 20240131 수정 */
#mateTabletOrder h3 b{color:#477fe9}
#mateTabletOrder .sub_visual h2:after{background-image:url(../../../img/main/v3/tablet/visual.png); background-size: auto 100%;}
#mateTabletOrder .sub_step{padding:120px 40px}
#mateTabletOrder .sub_step,
#mateTabletOrder .sub_step:before,
#mateTabletOrder .sub_step:after{background:#fafafa}
#mateTabletOrder .sub_step h3{
    padding:0 0 50px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:60px;
}
#mateTabletOrder .sub_step h3 b{color:#477fe9}
#mateTabletOrder .sub_step div{
    position:relative;
    height:440px;
    box-sizing:border-box;
    padding: 44px 50px;
    background:#fff;
    border-radius: 20px;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.04);
}
#mateTabletOrder .sub_step img{position:absolute;top:44px;right:50px;}
#mateTabletOrder .sub_step h4{width:129px;height:40px;line-height:40px;margin:100px 0 16px;border-radius:30px;background:#8baff1;text-align:center;font-size:24px;font-weight:600;color:#fff}
#mateTabletOrder .sub_step p{font-size:32px;color:#4d4d4d;font-weight:600;line-height:1.5em}
#mateTabletOrder .sub_step p b{color:#477fe9;font-weight:600}
#mateTabletOrder .sub_step div+div{margin-top:60px;}
#mateTabletOrder .sub_step div.step1 h4{margin-top: 80px;}
#mateTabletOrder .sub_step div.step2 h4{background:#5e8fec;}
#mateTabletOrder .sub_step div.step3 h4{background:#477fe9}
#mateTabletOrder .feature1 .tab span:nth-child(1):after{content:'주문 확인'}
#mateTabletOrder .feature1 .tab span:nth-child(2):after{content:'직원호출 확인'}
#mateTabletOrder .feature1 .tab span:nth-child(3):after{content:'매출 확인'}
#mateTabletOrder .feature2 h3 { padding-top: 48px;}
#mateTabletOrder .feature2 .tab span:nth-child(1):after{content:'메뉴'}
#mateTabletOrder .feature2 .tab span:nth-child(2):after{content:'주문'}
#mateTabletOrder .feature2 .tab span:nth-child(3):after{content:'결제'}
#mateTabletOrder .feature3 .tab span:nth-child(1):after{content:'매장 홍보/공지'}
#mateTabletOrder .feature3 .tab span:nth-child(2):after{content:'직원 호출'}
#mateTabletOrder .sub_know{padding:120px 40px}
#mateTabletOrder .sub_more li:nth-child(1):after{background-image:url(../../../img/main/v3/pos/more2.jpg);}
#mateTabletOrder .sub_more li:nth-child(2):after{width: 490px; height:478px; margin-left: 1%; background-image:url(../../../img/main/v3/kds/visual.png); background-size: 100% auto;}
#mateTabletOrder .sub_more_did,
#mateTabletOrder .sub_more_did:before,
#mateTabletOrder .sub_more_did:after{background:#fafafa}
#mateTabletOrder .sub_more_did{padding:120px 40px}
#mateTabletOrder .sub_more_did h3{margin-bottom:60px;text-align:center;font-size:60px;font-weight:700;color:#262626;line-height:90px;}
#mateTabletOrder .sub_more_did h3 b{color:#477fe9}
#mateTabletOrder .sub_more_did a{
    display:block;width:560px;max-width:100%;height:200px;
    box-sizing:border-box;
    margin:0 auto;padding:42px 0 0 210px;
    background:#fae301 url(../../../img/main/v3/ic_kakao.svg) no-repeat 74px 50px;
    border-radius: 10px;
}
#mateTabletOrder .sub_more_did a span{display:block;font-size:32px;color:#391b1a;font-weight:500}
#mateTabletOrder .sub_more_did a>b{font-size:48px;color:#391b1a;}
#mateTabletOrder .sub_know ul li dl { padding: 48px 45px;}
#mateTabletOrder .sub_know ul li dl dt { height: 104px; }

/* 20240131 sub_more 수정 및 삭제 */
#mateTabletOrder .sub_more li {left: 50%;}
#mateTabletOrder .sub_more li:nth-child(1) { top: 40px; margin-left: -495px;}
#mateTabletOrder .sub_more li:nth-child(2) {top: 203px; margin-left: 265px;}


/* 20240729 메이트 키오스크 추가 */
#mateKiosk .m { display: none;}

#mateKiosk h3 { padding-top: 47px; }
#mateKiosk h3 b{color:#477fe9}
#mateKiosk .sub_visual h2:after{background-image:url(../../../img/main/v3/kiosk/visual.png); background-size: auto 100%;}
#mateKiosk .sub_info { padding-top: 0; padding-bottom: 0; }
#mateKiosk .sub_info>div { padding-top: 160px; padding-bottom: 160px; }
#mateKiosk .sub_info>div h3 {padding-top: 0; }
#mateKiosk .sub_info>div>ul>li { margin-top: 11px;}
#mateKiosk .sub_info>div p img { max-width: 480px; width: 100%;}

#mateKiosk .sub_suggest{padding:120px 40px 88px}
#mateKiosk .sub_suggest,
#mateKiosk .sub_suggest:before,
#mateKiosk .sub_suggest:after{background:#fafafa}
#mateKiosk .sub_suggest h3{
    padding:0 0 50px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:60px;
}
#mateKiosk .sub_suggest ul {overflow: hidden;}
#mateKiosk .sub_suggest ul li { margin-bottom:32px; display:flex; align-items: center; height:222px; box-sizing: border-box; padding: 0 40px 0 50px; background-color: #ffffff; float: left; width: 46.8%; border-radius: 20px; box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.04);}
#mateKiosk .sub_suggest ul li:nth-child(even){ margin-left: 6.4%; }
#mateKiosk .sub_suggest ul li .img { width: 120px; margin-right: 40px;}
#mateKiosk .sub_suggest ul li img { display: block; width: 100%; }
#mateKiosk .sub_suggest ul li .text{font-size: 32px; line-height: 1.5; font-weight: bold; color:#4d4d4d; width: calc( 100% - 160px);}
#mateKiosk .sub_suggest ul li .text b { color:#477fe9; }

#mateKiosk .feature1 h3, #mateKiosk .feature2 h3 { padding-top: 120px; }
#mateKiosk .feature1 .tab {gap:15px;}
#mateKiosk .feature1 .tab span:nth-child(1):after{content:'주문 확인'}
#mateKiosk .feature1 .tab span:nth-child(2):after{content:'매출 확인'}
#mateKiosk .feature2 .tab {gap:24px;}
#mateKiosk .feature2 .tab span:nth-child(1):after{content:'홈 화면'}
#mateKiosk .feature2 .tab span:nth-child(2):after{content:'주문 화면'}
#mateKiosk .feature2 .tab span:nth-child(3):after{content:'옵션 화면'}

#mateKiosk .sub_machine{padding:120px 40px;}
#mateKiosk .sub_machine,
#mateKiosk .sub_machine:before,
#mateKiosk .sub_machine:after{background:#fafafa}
#mateKiosk .sub_machine h3{
    padding:0 0 50px;
    text-align:center;font-size:40px;font-weight:700;color:#262626;line-height:60px;
}
#mateKiosk .sub_machine .detail img { display: block; }
#mateKiosk .sub_machine .detail p { font-size: 20px; color:#4d4d4d; line-height: 1.5; padding: 20px;border-radius: 5px; background-color: #f2f2f2; margin-top: 24px; text-align: center; }

#mateKiosk .sub_know{padding:120px 40px}
#mateKiosk .sub_more li:nth-child(1):after{background-image:url(../../../img/main/v3/pos/more2.jpg);}
#mateKiosk .sub_more li:nth-child(2):after{width: 490px; height:478px; margin-left: 1%; background-image:url(../../../img/main/v3/kds/visual.png); background-size: 100% auto;}
#mateKiosk .sub_more_did,
#mateKiosk .sub_more_did:before,
#mateKiosk .sub_more_did:after{background:#fafafa}
#mateKiosk .sub_more_did{padding:120px 40px}
#mateKiosk .sub_more_did h3{margin-bottom:60px;text-align:center;font-size:60px;font-weight:700;color:#262626;line-height:90px;}
#mateKiosk .sub_more_did h3 b{color:#477fe9}
#mateKiosk .sub_more_did a{
    display:block;width:560px;max-width:100%;height:200px;
    box-sizing:border-box;
    margin:0 auto;padding:42px 0 0 210px;
    background:#fae301 url(../../../img/main/v3/ic_kakao.svg) no-repeat 74px 50px;
    border-radius: 10px;
}
#mateKiosk .sub_more_did a span{display:block;font-size:32px;color:#391b1a;font-weight:500}
#mateKiosk .sub_more_did a>b{font-size:48px;color:#391b1a;}
#mateKiosk .sub_know ul li dl { padding: 48px; }
#mateKiosk .sub_know ul li dl dt { color:#262626;}
#mateKiosk .sub_know ul li dl dt b { color:#477fe9; }
#mateKiosk .sub_know ul li dl dd { height: 106px; letter-spacing: -0.05em;}
#mateKiosk .sub_know ul li dl dd span{  font-size: 20px; font-weight: 400;}

#mateKiosk .sub_more li {left: 50%;}
#mateKiosk .sub_more li:nth-child(1) { top: 40px; margin-left: -495px;}
#mateKiosk .sub_more li:nth-child(2) { top: 203px; left: auto; right: 50%; margin-right: -534px;}

/* 사장님 후기 */
#story .sub_visual h2:after{background-image:url(../../../img/main/v3/story/visual.png);}
.sub-story{padding-top:0 !important}

/* FAQ */
#faq .sub_visual h2:after{background-image:url(../../../img/main/v3/faq/visual.png);}

.layer-modal.iframe-popup .layer-pop {}
.layer-modal.iframe-popup .layer-pop .layer-head { padding-bottom: 0; border-bottom: 0; padding-top: 28px;}
.layer-modal.iframe-popup .layer-pop .layer-head > div h4 {margin-bottom: 16px; text-align: center; font-size: 28px; font-weight: bold; color:#000000; line-height: 1.4;}
.layer-modal.iframe-popup .layer-pop .layer-head > div h4 .m { display: none;}
.layer-modal.iframe-popup .layer-pop .layer-head > div p { font-size: 15px; line-height: 1.4; color:#666666; text-align: center; }
.layer-modal.iframe-popup .layer-pop .layer-body { background-color: #ffffff; padding: 0;}
.layer-modal.iframe-popup .layer-pop .layer-body iframe { min-height: 55vh;}
@media screen and (max-width:1320px) {
    .sub-quick__wrap {width:100%;margin-top:70px}
}
@media screen and (max-width:1260px) {
    #mateQr .qr-test-box ul li .blue-box { padding: 68px 54px 64px; }
    #mateQr .qr-test-box ul li .blue-box .text { margin-top: 3.8%;}
    #mateQr .qr-test-box ul li .blue-box .text .fc-blue { font-size: 28px; margin-bottom: 3.3%;}
    #mateQr .qr-test-box ul li .blue-box .text .fc-blue + div { font-size: 20px; }
}
@media screen and (max-width:1024px) {
    .sub-quick__box .sub-quick__link .sub-quick__subtitle {
        top:20px !important;
        left:20px !important;
    }

    /* 서브 공통 */
    .sub_visual h2{font-size:22px}
    .sub_visual h2 b{font-size:50px}
    .sub_visual h2>span{display:block;height:auto;padding-top:50px;text-align:center}
    .sub_visual h2:after{position:relative;left:0;width:100%;height:359px;background-size:auto 100%}

    .sub_info{padding:0 40px 80px}
    .sub_info>div{padding:80px 0 0}
    .sub_info>div h3{text-align:center;font-size:28px}
    .sub_info>div h3 span{display:block;}
    .sub_info>div p{position:relative;top:0;left:0;width:100%;margin-bottom:30px;transform:translateY(0);text-align:center}
    .sub_info>div>ul{max-width:480px;margin:0 auto}
    .sub_info>div>ul>li{font-size:20px}

    .sub_feature{padding:0 40px 80px}
    .sub_feature h3{padding:80px 0 40px;font-size:36px;line-height:1.4em}
    .sub_feature .tab{display:block;padding:0;border:0;background:None}
    .sub_feature .tab span{display:none;width:240px;margin:0 auto;}
    .sub_feature .tab span.swiper-pagination-bullet-active{display:block;border:1px solid #e6eefc;background:#fff;color:#477fe9}
    .sub_feature .btns{display:block;position:relative;max-width:420px;margin:0 auto}
    .sub_feature .btns button{top:0;width:48px;height:48px;margin-top:-88px;background:#477fe9 url(../../../img/main/v3/ic_arrow_backward.svg) no-repeat center;border-radius:50%;font-size:0}
    .sub_feature .btns button.swiper-button-next{background-image:url(../../../img/main/v3/ic_arrow_forward.svg)}
    .sub_feature .btns button.swiper-button-disabled{opacity:1;background-color:#bfbfbf}

    /* 20240131 sub_more 수정 및 삭제 */
    .sub_more{padding:80px 40px}
    .sub_more h3{margin-bottom:60px;font-size:36px}
    .sub_more li dl dt { font-size: 20px; padding: 10px 20px; margin-bottom: 6px; }
    .sub_more li dl dd a {vertical-align: top;}
    .sub_more li dl dd a span.w { font-size: 16px; line-height: 1.2;}
    .sub_more .randing-wrap { height: 600px; background-size: 767px auto;}

    div.sub_contact{padding:80px 40px}
    .sub_contact h3{margin-bottom:50px;font-size:22px;}
    .sub_contact h3 b{font-size:36px;}
    .sub_contact p a,
    .sub_contact .blue-btn a{max-width:480px;height:80px;line-height:80px;font-size:28px}
    .sub_contact p a:before,
    .sub_contact .blue-btn a:before{width:40px;background-size:100% auto}

    .sub_main .sub_btns,
    .sub_btns{/*display:block;*/position:Fixed;bottom:40px;right:40px;width:100%;max-width:360px;box-sizing:border-box;padding:0 20px;font-size:0;z-index:100}
    .sub_btns a{
        display:inline-block;height:48px;line-height:48px;
        background:#1c60e2;box-shadow:0 0 15px rgba(0, 0, 0, 0.15);
        text-align:center;vertical-align:top
    }
    .sub_btns a.install{width:calc(100% - 68px);border-radius:40px;font-size:16px;color:#fff}
    .sub_btns a.install:after{
        content:'';
        display:inline-block;width:10px;height:10px;
        margin:19px 0 0 8px;
        border-top:2px solid #fff;border-right:2px solid #fff;border-radius:2px;
        transform:rotate(45deg);
        vertical-align:top
    }
    .sub_btns a.tolk{margin-left:20px;width:48px;border-radius:50%;background:#1c60e2 url(../../../img/main/v3/ic_forum.svg) no-repeat center;}

    /* 메이트 포스 */
    #matePos .feature2 .tab span+span:before,
    #matePos .feature3 .tab span+span:before{display:none}

    #matePos .sub_know{padding:80px 20px}

    /* 20240131 sub_more 수정 및 삭제 */
    #matePos .sub_more li { top: 80px;}
    #matePos .sub_more li:nth-child(1) {margin-left: -186px;}
    #matePos .sub_more li:nth-child(2) {margin-left: 20px;}

    .sub_know ul{gap:0;flex-flow: initial;}
    .sub_know ul li{min-width:460px;width:460px;margin:0 20px}
    .sub_know ul li dl dt{font-size:32px}
    .sub_know ul li dl dd{font-size:20px}

    /* 사장님 앱 */
    #mateApp .sub_down{padding:80px 40px}
    #mateApp .sub_down h3{margin-bottom:80px;font-size:36px;line-height:1.4em}
    #mateApp .sub_down ul li{width:calc(50% - 20px)}
    #mateApp .sub_down ul li+li{margin-left:40px}
    #mateApp .sub_down ul li:before{height:180px;background-size:auto 100%}
    #mateApp .sub_down ul li a{margin-top:40px;height:80px;line-height:80px;font-size:22px}
    #mateApp .sub_down ul li a:after{width:25px;background-size:100% auto}

    /* 20240131 sub_more 수정 및 삭제 */
    #mateApp .sub_more li:nth-child(1) {top: 170px; margin-left: -246px;}
    #mateApp .sub_more li:nth-child(2) {top: 75px; margin-left: 70px;}

    /* 메이트 영업관리 */
    #mateSales h3{padding:80px 0;font-size:36px;line-height:1.5em}
    #mateSales .sub_admin h3{padding-bottom:40px;margin:0}
    #mateSales .sub_admin .sub_admin_paging{display:block;margin-bottom:50px;text-align:center}
    #mateSales .sub_admin .sub_admin_paging span{
        display:none;
        width:240px;margin:0 auto;height:60px;line-height:60px;
        border: 1px solid #e6eefc;border-radius:30px;
        background: #fff;
        text-align:center;color: #477fe9;font-size:24px;font-weight:700;opacity:1
    }
    #mateSales .sub_admin .sub_admin_paging span.swiper-pagination-bullet-active{display:block;}
    #mateSales .sub_admin .admin_list {overflow:Hidden;}
    #mateSales .sub_admin .swiper-wrapper{gap:0;margin-top:0}
    #mateSales .sub_admin .swiper-slide{flex:none;}
    #mateSales .sub_admin .swiper-wrapper:after,
    #mateSales .sub_admin .swiper-slide h4{display:none}
    #mateSales .sub_admin .btns{display:block;position:relative;max-width:420px;margin:0 auto}
    #mateSales .sub_admin .btns button{top:0;width:60px;height:60px;margin-top:-110px;background:#477fe9 url(../../../img/main/v3/ic_arrow_backward.svg) no-repeat center;border-radius:50%;font-size:0}
    #mateSales .sub_admin .btns button.swiper-button-next{background-image:url(../../../img/main/v3/ic_arrow_forward.svg)}
    #mateSales .sub_admin .btns button.swiper-button-disabled{opacity:1;background-color:#bfbfbf}
    #mateSales .sub_admin .swiper-slide{padding:40px 40px 0;}
    #mateSales .sub_admin .swiper-slide li{padding:10px 0;font-size:26px}

    /* 20240131 sub_more 수정 및 삭제 */
    #mateSales .sub_more { margin-top: 80px; }
    #mateSales .sub_more li:nth-child(1) {top: 140px; margin-left: -286px;}
    #mateSales .sub_more li:nth-child(2) {top: 95px; margin-left: 20px;}

    #mateSales .sub_contact h3{font-size:22px}
    #mateSales .sub_contact h3 b{font-size:36px}

    /* 메이트 QR */
    #mateQr .sub_more_qr h3,
    #mateQr .sub_step h3{padding-bottom:0;margin-bottom:40px;font-size:36px;line-height:1.5em}
    #mateQr .sub_step div{height:auto;text-align:center}
    #mateQr .sub_step div+div{margin-top:40px}
    #mateQr .sub_step h4{margin:0 auto 25px}
    #mateQr .sub_step img{position:relative;top:0;right:0;display:block;width:auto;max-width:100%;margin:0 auto 30px}
    #mateQr .sub_step,
    #mateQr .sub_know{padding:80px 40px}

    /* 20240131 sub_more 수정 및 삭제 */
    #mateQr .sub_more li:nth-child(1) {top: 170px; margin-left: -246px;}
    #mateQr .sub_more li:nth-child(2) {top: 75px; margin-left: 70px;}

    /* 20231116 메이트 DID 추가  */
    #mateDid .sub_more_did h3,#mateDid .sub_know {padding:80px 40px}
    /* 20240131 sub_more 수정 및 삭제 */
    #mateDid .sub_more li:nth-child(1) {top: 203px; margin-left: -385px;}
    #mateDid .sub_more li:nth-child(2) {top: 98px;}

    /* 20240131 sub_more 수정 및 삭제 */
    #mateQr .sub_more li:nth-child(1) {top: 170px; margin-left: -246px;}
    #mateQr .sub_more li:nth-child(2) {top: 75px; margin-left: 70px;}

    #mateQr .qr-test-box ul li { width: calc(50% - 15px); }
    #mateQr .qr-test-box ul li + li { margin-left: 30px; }
    #mateQr .qr-test-box ul li > img { max-width: 100px;}
    #mateQr .qr-test-box ul li .label {font-size: 18px; padding: 5px 32px;}
    #mateQr .qr-test-box ul li .blue-box { margin-top: -18px; padding: 68px 45px 64px;}
    #mateQr .qr-test-box ul li .blue-box .text .fc-blue { font-size: 20px;}
    #mateQr .qr-test-box ul li .blue-box .text .fc-blue + div { font-size: 14px; }

    /* 20231124 메이트 Kds 추가  */
    #mateKds .sub_know {padding:80px 40px}
    /* 20240131 sub_more 수정 및 삭제 */
    #mateKds .sub_more li:nth-child(1) {top: 90px; margin-left: -305px;}
    #mateKds .sub_more li:nth-child(2) {top: 125px; margin-right: -365px;}

    #mateKds .sub_admin h3{padding:80px 0 40px;font-size:36px;line-height:1.5em; margin:0}
    #mateKds .sub_admin .sub_admin_paging{display:block;margin-bottom:50px;text-align:center}
    #mateKds .sub_admin .sub_admin_paging span{
        display:none;
        width:240px;margin:0 auto;height:60px;line-height:60px;
        border: 1px solid #e6eefc;border-radius:30px;
        background: #fff;
        text-align:center;color: #477fe9;font-size:24px;font-weight:700;opacity:1
    }
    #mateKds .sub_admin .sub_admin_paging span.swiper-pagination-bullet-active{display:block;}
    #mateKds .sub_admin .admin_list {overflow:Hidden;}
    #mateKds .sub_admin .admin_list img { width: 100%; }
    #mateKds .sub_admin .list-wrapper{gap:0;margin-top:0}
    #mateKds .sub_admin .list-item{flex:none;}
    #mateKds .sub_admin .list-wrapper:after,
    #mateKds .sub_admin .list-item h4{display:none}
    #mateKds .sub_admin .btns{display:block;position:relative;max-width:420px;margin:0 auto}
    #mateKds .sub_admin .btns button{top:0;width:60px;height:60px;margin-top:-110px;background:#477fe9 url(../../../img/main/v3/ic_arrow_backward.svg) no-repeat center;border-radius:50%;font-size:0}
    #mateKds .sub_admin .btns button.swiper-button-next{background-image:url(../../../img/main/v3/ic_arrow_forward.svg)}
    #mateKds .sub_admin .btns button.swiper-button-disabled{opacity:1;background-color:#bfbfbf}
    #mateKds .sub_admin .list-item{padding:40px 40px 0;}
    #mateKds .sub_admin .list-item li{padding:10px 0;font-size:26px}

    /* 20240125 메이트 테블릿오더 추가 */
    #mateTabletOrder .sub_step h3{padding-bottom:0;margin-bottom:40px;font-size:36px;line-height:1.5em}
    #mateTabletOrder .sub_step div{height:auto;text-align:center}
    #mateTabletOrder .sub_step div+div{margin-top:40px}
    #mateTabletOrder .sub_step h4{margin:0 auto 25px}
    #mateTabletOrder .sub_step img{position:relative;top:0;right:0;display:block;width:auto;max-width:100%;margin:0 auto 30px}
    #mateTabletOrder .sub_step,
    #mateTabletOrder .sub_know {padding:80px 40px}
    #mateTabletOrder .sub_know{padding:80px 40px}
    #mateTabletOrder .sub_know ul li dl { padding: 48px 45px;}
    #mateTabletOrder .sub_know ul li dl dt { height: 80px; }

    /* 20240131 sub_more 수정 및 삭제 */
    #mateTabletOrder .sub_more li {left: 50%;}
    #mateTabletOrder .sub_more li:nth-child(1) { top: 70px; margin-left: -315px;}



    #mateKiosk .sub_visual h2>span { color:#ffffff !important;}
    #mateKiosk .sub_info>div { padding: 80px 0; }
    #mateKiosk .sub_suggest { padding: 80px 40px; }
    #mateKiosk .sub_suggest h3 { font-size: 36px; padding-bottom: 24px; }
    #mateKiosk .sub_suggest ul li { float: none; margin: 0; width: 100%; padding: 0 12px 0 20px;}
    #mateKiosk .sub_suggest ul li + li { margin-top: 16px;}
    #mateKiosk .sub_suggest ul li:nth-child(even) { margin-left: 0; }
    #mateKiosk .feature1 h3, #mateKiosk .feature2 h3 { padding-top: 80px; }
    #mateKiosk .sub_machine { padding: 80px 40px; }
    #mateKiosk .sub_machine h3 { font-size: 36px;}
    #mateKiosk .sub_know {padding:80px 40px}
    #mateKiosk .sub_know{padding:80px 40px}
    #mateKiosk .sub_know ul li dl { padding: 48px 45px;}
    #mateKiosk .sub_know ul li dl dt { height: 80px; }
    #mateKiosk .sub_know ul li dl dd { height: 150px; }

    #mateKiosk .sub_more h3 { padding-top: 0; }
    #mateKiosk .sub_more li {left: 50%;}
    #mateKiosk .sub_more li:nth-child(1) { top: 35px; margin-left: -325px; left: 50%;}
    #mateKiosk .sub_more li:nth-child(2) { top: 170px; left: auto; right: 50%; margin-right: -350px;}
}

@media screen and (max-width:767px) {
    /* 서브 공통 */
    .sub_visual h2{font-size:16px}
    .sub_visual h2 b{font-size:40px}
    .sub_visual h2>span{padding-top:38px;}
    .sub_visual h2:after{height:240px;}

    .sub_info{padding:0 20px 60px}
    .sub_info>div{padding:60px 0 0}
    .sub_info>div h3{margin-bottom:24px;padding:0;font-size:20px;line-height:1.5em}
    .sub_info>div h3 b{display:inline-block;}
    .sub_info>div p{margin-bottom:20px}
    .sub_info>div>ul>li{padding-left:20px;margin-top:8px;font-size:14px;}
    .sub_info>div>ul>li:before{width:10px;height:10px;top:5px}
    .sub_info>div>ul ul{padding:12px 24px;margin:15px 0 0 -20px}
    .sub_info>div>ul ul li{font-size:12px}

    .sub_feature{padding:0 20px 60px}
    .sub_feature h3{padding:60px 0 24px;font-size:24px}
    .sub_feature .feature_list.none-tab { padding-top: 20px; }	/* 20231116 추가 */
    .sub_feature .btns{max-width:245px;}
    .sub_feature .tab{margin-bottom:24px}
    .sub_feature .tab span{width:120px;height:40px;line-height:38px;font-size:16px}
    .sub_feature .btns button{width:40px;height:40px;margin-top:-64px;}
    .sub_feature .swiper-slide{border-radius:10px}


    /* 20240131 sub_more 수정 및 삭제 */
    .sub_more{padding:60px 20px; }
    .sub_more h3{margin-bottom:24px;font-size:24px; padding-top: 0 !important; }
    .sub_more h3 b{display:block;}
    .sub_more h3:before{display:block;width:40px;height:40px;margin:0 auto 10px}
    .sub_more li:after{display:None}
    .sub_more ul { position: relative;}
    .sub_more li{position:relative; width: 100%; height:60px;border-radius:10px;text-align:center;overflow:Hidden; top: auto !important; left: auto !important; right: auto !important; margin-left: 0 !important;  margin-right: 0 !important;}
    .sub_more li dl{padding:0}
    .sub_more li dl dt{display:none;}
    .sub_more li dl dd{display:inline-block;padding-left:10px;line-height:60px;font-size:12px;color:#999}
    .sub_more li dl dd a{position:absolute;top:0;left:0;display:block;width:100%;line-height:60px;background:#fff;font-size:0}
    .sub_more li dl dd a span.m {display:inline-block !important;font-size:18px;color:#477fe9;font-weight:600}
    .sub_more li dl dd a span.w{display:none;}
    .sub_more li dl dd a:after{
        content:'';
        display:inline-block;width:14px;height:14px;
        margin:23px 0 0 8px;
        border-top:3px solid #477fe9
    ;border-right:3px solid #477fe9;
        border-radius:2px;
        transform:rotate(45deg);
        vertical-align:top;
    }
    .sub_more li+li{margin-top:12px;}
    .sub_more .randing-wrap { background: none !important; height: auto; border-radius: 0;}

    div.sub_contact{padding:60px 20px}
    .sub_contact h3{margin-bottom:24px;font-size:12px;color:#737373}
    .sub_contact h3 b{font-size:24px;line-height:1.4em}
    .sub_contact p a,
    .sub_contact .blue-btn a{height:60px;line-height:60px;font-size:18px}
    .sub_contact p a:before,
    .sub_contact .blue-btn a:before{width:25px;margin-right:4px}

    .sub_main .sub_btns,
    .sub_btn{bottom:20px;right:0;}
    .sub_main h3.w{display:none}
    .sub_main h3.m{display:block}

    /*20240131 분합 탭 추가*/
    .division-tap ul { margin-top: 60px; }
    .division-tap ul li { width: 88px; height: 88px; font-size: 18px; margin: 0 4px;}
    .division-tap ul li div { margin-top: 8px; }


    /* 메이트 포스 */
    #matePos .sub_know{padding:60px 10px}
    .sub_know ul li{min-width:280px;width:280px;min-height:300px;;margin:0 10px}
    .sub_know ul li dl{padding:15px}
    .sub_know ul li dl dt{margin-bottom:5px;font-size:16px;}
    .sub_know ul li dl dd{font-size:12px;line-height:18px}
    .sub_know ul li dl dd br{display:none}

    /* 사장님 앱 */
    #mateApp .sub_down{padding:60px 20px}
    #mateApp .sub_down h3{margin-bottom:24px;font-size:24px;}
    #mateApp .sub_down ul li{display:block;width:100%}
    #mateApp .sub_down ul li+li{margin:40px 0 0}
    #mateApp .sub_down ul li:before{height:120px;margin-bottom:15px;}
    #mateApp .sub_down ul li a{width:240px;height:48px;line-height:48px;margin:0 auto;font-size:16px}
    #mateApp .sub_down ul li a:after{margin-left:8px;width:15px}

    /* 메이트 영업관리 */
    #mateSales h3{padding:60px 0;font-size:24px}
    #mateSales .sub_admin{padding:0 20px 60px}
    #mateSales .sub_admin .sub_admin_paging{margin-bottom:24px;}
    #mateSales .sub_admin .sub_admin_paging span{width:160px;height:40px;line-height:38px;font-size:16px}
    #mateSales .sub_admin .btns{max-width:287px}
    #mateSales .sub_admin .btns button{width:40px;height:40px;margin-top:-64px;}
    #mateSales .sub_admin .swiper-slide{border-radius:10px}
    #mateSales .sub_admin .swiper-slide ul{padding:20px 0}
    #mateSales .sub_admin .swiper-slide ul li{padding:5px 0;font-size:14px}

    #mateSales .sub_know{padding:0 10px}
    #mateSales .sub_know h3{padding:60px 0 24px}
    #mateSales .sub_more{margin-top:60px}
    #mateSales .sub_contact h3{font-size:12px;}
    #mateSales .sub_contact h3 b{font-size:24px;}

    /* 메이트 QR */
    #mateQr .sub_step h3{padding-bottom:0;margin-bottom:24px;font-size:24px;line-height:1.5em}
    #mateQr .sub_step div{padding:16px 17px 20px;border-radius:10px}
    #mateQr .sub_step div+div{margin-top:24px}
    #mateQr .sub_step h4{width:80px;height:28px;line-height:28px;margin:0 auto 16px;font-size:16px;}
    #mateQr .sub_step img{margin:0 auto 20px}
    #mateQr .sub_step p{font-size:18px;}
    #mateQr .sub_step,#mateQr .sub_know{padding:60px 20px}
    #mateQr .feature2 .swiper-slide img,
    #mateQr .feature3 .swiper-slide img{object-fit:cover;width:100%;height:100vw}

    #mateQr .qr_test { padding: 60px 20px;}
    #mateQr .qr_test h3 { font-size: 24px; padding-bottom: 24px;}
    #mateQr .qr-test-box ul li { float: none; width: 100%;}
    #mateQr .qr-test-box ul li .label { line-height: 26px;}
    #mateQr .qr-test-box ul li + li { margin-left: 0; margin-top: 24px;}
    #mateQr .qr-test-box ul li .blue-box { padding-bottom: 24px; padding-top: 42px;padding-left: 49px; padding-right: 49px;}
    #mateQr .qr-test-box ul li .blue-box img { min-width: 200px;}
    #mateQr .qr-test-box ul li .blue-box .text { margin-top: 12px;}
    #mateQr .qr-test-box ul li .blue-box .text .fc-blue  { margin-bottom: 12px; }
    #mateQr .qr-desc { font-size: 14px; padding: 20px 12px; text-align: left; word-break: keep-all;}

    /*20231116 메이트 DID 추가 */
    #mateDid .sub_know{padding:60px 20px}
    #mateDid .feature2 .swiper-slide img,
    #mateDid .feature3 .swiper-slide img{object-fit:cover;width:100%;height:100vw}

    /*20231124 메이트 KDS 추가 */
    #mateKds .sub_know{padding:60px 20px}
    #mateKds .sub_feature h3 { padding:60px 0 24px; }
    #mateKds .feature2 .swiper-slide img{object-fit:cover;width:100%;}
    #mateKds .sub_admin{padding:0 20px 60px}
    #mateKds .sub_admin h3{padding:60px 0 24px;font-size:24px}
    #mateKds .sub_admin .btns{max-width:287px}
    #mateKds .sub_admin .btns button{width:40px;height:40px;margin-top:-64px;}
    #mateKds .sub_admin .list-item{border-radius:10px}
    #mateKds .sub_admin .list-item ul{padding:20px 0}
    #mateKds .sub_admin .list-item ul li{padding:5px 0;font-size:14px}

    /* 20240125 메이트 테블릿오더 추가 */
    #mateTabletOrder .w { display: none;}
    #mateTabletOrder .m { display: block;}
    #mateTabletOrder .sub_step h3{padding-bottom:0;margin-bottom:24px;font-size:24px;line-height:1.5em}
    #mateTabletOrder .sub_step div{padding:16px 17px 20px;border-radius:10px}
    #mateTabletOrder .sub_step div+div{margin-top:24px}
    #mateTabletOrder .sub_step h4{width:80px;height:28px;line-height:28px;margin:0 auto 16px !important;font-size:16px;}
    #mateTabletOrder .sub_step img{margin:0 auto 20px}
    #mateTabletOrder .sub_step p{font-size:18px;}
    #mateTabletOrder .sub_step,
    #mateTabletOrder .sub_know{padding:60px 20px}
    #mateTabletOrder .sub_know ul li dl { padding: 15px;}
    #mateTabletOrder .sub_know ul li dl dt { height: 42px; }
    #mateTabletOrder .sub_know ul li dl dd {height: 54px;}
    #mateTabletOrder .feature2 h3 { padding-top: 32px;}

    #mateKiosk .w { display: none;}
    #mateKiosk .m { display: block;}
    #mateKiosk .sub_visual h2 b { font-size: 40px; }
    #mateKiosk .sub_info>div { padding: 60px 0; }
    #mateKiosk .sub_info>div>ul { padding-left: 5px; }
    #mateKiosk .sub_info>div>ul>li { margin-top: 9px; }
    #mateKiosk .sub_suggest { padding:60px 20px; }
    #mateKiosk .sub_suggest h3 { font-size: 24px; }
    #mateKiosk .sub_suggest ul li { height: 112px; border-radius: 10px;}
    #mateKiosk .sub_suggest ul li .img { width: 80px; margin-right: 16px; }
    #mateKiosk .sub_suggest ul li .text { font-size: 18px; line-height: 1.56; width: calc(100% - 96px);}
    #mateKiosk .feature1 h3, #mateKiosk .feature2 h3 { padding-top: 60px; }
    #mateKiosk .sub_machine {padding:60px 20px;}
    #mateKiosk .sub_machine h3 { font-size: 24px; line-height: 1.5; padding-bottom: 24px;}
    #mateKiosk .sub_machine .detail p { font-size: 14px; padding: 20px 12px; margin-top: 20px; word-break: keep-all;}
    #mateKiosk .sub_know{padding:60px 20px}
    #mateKiosk .sub_know ul li dl { padding: 15px;}
    #mateKiosk .sub_know ul li dl dt { height: 42px; }
    #mateKiosk .sub_know ul li dl dd {height: 54px;}
    #mateKiosk .sub_know ul li dl dd span { font-size: 12px; display: block;}
    #mateKiosk h3 { padding-top: 32px; }
    .layer-modal.iframe-popup .layer-pop .layer-head {padding-top: 24px;}
    .layer-modal.iframe-popup .layer-pop .layer-head > div h4 { font-size: 24px;}
    .layer-modal.iframe-popup .layer-pop .layer-head > div h4 .m { display: block;}
    .layer-modal.iframe-popup .layer-pop .layer-head > div p {}
}

@media screen and (max-width:480px) {
    .sub_main .sub_btns,
    .sub_btn{max-width:100%;}
    .sub_know ul li{min-width:208px;width:208px;min-height:261px}

    /* 20240125 메이트 테블릿오더 추가 */
    #mateTabletOrder .sub_know ul li dl dd {height: 75px;}

    #mateKiosk .sub_know ul li dl dd {height: 90px;}
}