@charset "utf-8";


@media only screen and (max-width: 1400px) {
.header_allMenuModal_List{ grid-template-columns: repeat(4, 1fr);}
}

/********************
// tablet 분기점
********************/
@media only screen and (max-width: 1200px) {
   .inner{width:calc(100dvw - 120px); margin:0 auto;}
   .dendenpoint .inner {    width: calc(100dvw - 120px);}
   .small_inner, .regions_inner{width:calc(100dvw - 120px); margin:0 auto;}
   .community_inner{width:calc(100dvw - 120px); margin:0 auto;}
   .businessTip_inner{width:calc(100dvw - 120px); margin:0 auto;}
   .myfollow_modal_inner{width:calc(100dvw - 120px); margin:0 auto;}
   .login_inner{width:calc(100dvw - 120px); margin:0 auto;}
   .promoteinner{width:calc(100dvw - 120px);margin-right:auto; margin-left:auto;}

   .shadowBox{box-shadow:0 0 4px rgba(238, 238, 240, 1);}
   .headerModal_inner{width:calc(100% - 120px);}
   .header_shadowBox{box-shadow:0 0 4px rgba(238, 238, 240, 1);}
   .declare_modal_box { width:calc(100% - 120px); }






/********************
** 메인
********************/
    .maincard{width: 100%;}
    .modal-box {width:calc(100% - 120px);}
    .companyCrad{width:100%;}
    .pointCard{width:100%;}
    .all_ServiceModal_List{grid-template-columns: repeat(3, 1fr);}
    .serviceList .mainServiceCnt{width:calc(25% - 12px);}

    .mainreveiwCnt1 {border-radius:8px 8px 0 0; left:0;}
    .mainreveiwCnt2 {border-radius:0px 8px 0 16px; right:0;}
    
/********************
** ceo프로그램 리스트
********************/
    .ceoprogramListBox{ grid-template-columns: repeat(3, 1fr); column-gap: 20px; row-gap: 40px;}
    
/********************
** ceo프로그램 부
********************/
    .ceoprogramViewTit{width: 100%;}

/********************
** 사장님의 수다
********************/
    .community_modalbox {width:calc(100% - 120px) }

/********************
** 마이페이지
********************/
    .mypage_addFollow{top:0; left:9999px; width: 100vw;    height: 100vh;    background: rgba(217, 218, 222, 0.8);    backdrop-filter: blur(52px); display:flex; align-items: center;    justify-content: center;}
    .mypage_addFollow_contant{width:calc(100% - 120px);}
    .no_scroll::-webkit-scrollbar{ display: none;}



/********************
** 가게홍보
********************/
    .shopCntBox{width:calc(50% - 8px)}
    #categoryFilterWrap{    scrollbar-width: none;    -ms-overflow-style: none;}
    #categoryFilterWrap::-webkit-scrollbar {    display: none;    }
    .benefitListBox{display: grid; grid-template-columns: repeat(2, 1fr);}



.ddpProcessCnt{width:calc(50% - 8px); align-self: stretch;}
    .ddpIteamCnt{width:calc(50% - 9px); align-self: stretch;}
    .ddpProcessCnt > div:nth-child(1):after{content:'';display:block; width:100%;height:1px;background:#737784; position:absolute; right:0;top:100%; bottom:0; transform: translateY(0%);}


    
/********************
** 강의페이지
********************/
    .studyList{ grid-template-columns: repeat(2 , 1fr);}
    .studyViewLeft{width:calc(100% - 324px);}
    .studyViewRight{width:300px;}


/********************
** 타지역서비스
********************/
.regions_grid{display:grid; grid-template-columns: repeat(2 , 1fr);}
.case_left{border-radius:12px 0 0 12px;}
.inputBox{ padding: 20px;}
}      


/********************
// 강의영상용 분기점
********************/
@media only screen and (max-width: 1000px) { 
    .studyPageTitBox{display:flex; flex-direction: column-reverse; gap:60px;}
    .studyPageTitBox > img{width:500px; }
    .studyPageTitBox > div{width:100%;}
    .playBtn{position:fixed; bottom:0;left: 0; border-radius: 0;}
    #stickyContainer{ flex-direction: column-reverse; gap:40px;}
    .studyPageList{width:100%}
    .studyPageRight{width:100%; padding:0;}
    .studyPageRight > div{margin-top:0;}
    .studyViewBox{flex-direction: column; gap:24px;}
    .studyViewLeft{width:100%;}
    .studyViewRight{width:100%;}
 }



/********************
// 모바일 분기점
********************/
@media only screen and (max-width: 768px) {     
    .inner{width:calc(100dvw - 40px); margin:0 auto;}
    .dendenpoint .inner {    width: calc(100dvw - 40px);}
    .small_inner, .regions_inner{width:calc(100dvw - 40px); margin:0 auto;}
    .community_inner{width:100dvw;}
    .businessTip_inner{width:calc(100dvw - 40px); margin:0 auto;}
    .myfollow_modal_inner{width:100%; height:100%}
    .login_inner{width:calc(100dvw - 40px); margin:0 auto;}
    .promoteinner{width:calc(100dvw - 40px);margin-right:auto; margin-left:auto;}
    .serviceList .mainServiceCnt{width:calc(25% - 6px);}
    .headerModal_inner{width:100%}
    .header_modal_overlay {  background: #fff;    backdrop-filter: blur(0px); padding:0 20px;}
    .headerModal_tit{border-top:1px solid #EEEEF0; border-bottom:none;}
    .declare_modal_box { width:calc(100% - 40px); }

    .shadowBox{box-shadow:0 0 2px rgba(184, 186, 193, 1);}
    .header_shadowBox{box-shadow: none;}
    .modal-box {width:100%; height:100dvh; border-radius: 0;}
    .freeModal_inner{height:calc(100dvh - 30dvh);}
    .loginAddress{border-left:0;}
    
/********************
** ceo프로그램 리스트
********************/
    .ceoprogramListBox{ grid-template-columns: repeat(2, 1fr); column-gap: 16px; row-gap: 24px;}

/********************
** 사장님의 수다
********************/
    #communityWrite{ bottom:0; background:#F7F8F8; border-top:1px solid #D9DADE; box-shadow: 0 2px 8px #737784;}
    .communityWriteBox{background:#fff; border:1px solid #91949F;}
    .community_modal{    align-items: flex-end;  }
    .community_modalbox {background: #fff;border-radius:16px 16px 0 0; width:100%; height: auto; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); overflow: hidden;}

/********************
** 사장님의 수다 뷰페이지
********************/
    .communityViewInput{width:100%; border:1px solid #91949F; }  
    .communityViewReview{bottom:0; background:#F7F8F8;border-top:1px solid #D9DADE; box-shadow: 0 2px 8px #737784; }
    .mobile_uplord{background:none; right:26px;}

/********************
** 마이페이지
********************/
    .mypageTxt{display: block;     -webkit-line-clamp: unset;    -webkit-box-orient: unset;    overflow: visible;    text-overflow: unset;}
    #fix_modal{align-items: flex-end;}
    .mypage_addFollow_contant{width:100%; height:100%;}

/********************
** 든든점수
********************/
.ddpIteamCnt{width:100%; align-self: stretch;}
.gauge_bar_bg {        height: 50px;    }
/********************
** 제휴사
********************/
#online input[type="checkbox"] + label:after{width:4px; height:8px; left:7px; top:40%; transform:translateY(-50%) rotate(45deg); border:1px solid #f7f8f8;border-width:0 2px 2px 0; }
#online input[type="checkbox"] + label:before{width:16px; height:16px;}

.yslaborBanner{height:70dvh; background-image: url('/img/yslabor/mainBanner.jpg'); background-size:cover; background-position: center;}

/** 주류 해택 **/
.fs_w35 {font-size:32px;}


#modalContent{max-height:80%; overflow-y:auto}



.selectArrow select{-webkit-appearance:none; -moz-appearance:none; appearance:none; background-image:none !important;}
.selectArrow select::-ms-expand{ display:none; }
.selectArrow::after{content:""; position:absolute; top:50%; right:16px; width:12px; height:12px; transform:translateY(-50%); background:url("/img/promoteArrow.svg") no-repeat center / contain; pointer-events:none;}
#amountGroups > div{   padding: 12px;    border-radius: 8px;}


/********************
** 가게홍보
********************/
.shopCntBox{width:100%}
.benefitListBox{display: grid; grid-template-columns: repeat(1, 1fr);}


/********************
** 강의페이지
********************/
.studyPageTitBox > img{width:100%; }
.studyPageTitBox{display:flex; flex-direction: column-reverse; gap:24px;}
#stickyContainer{ flex-direction: column-reverse; gap:24px;}
.studyView > .inner{width:100dvw}
.studyViewRight{border-radius:0; box-shadow:none}
.studyViewBox{flex-direction: column; gap:0px;}

/********************
** 타지역서비스
********************/
.case_left{border-radius:8px 0 0 8px;}
.inputBox{ padding: 16px;}
}


@media only screen and (max-width: 399px) { 
.amountGroups{  max-height: 45dvh;}
}