/* 구 사이트 popup_new.php 안의 <style> 을 그대로 옮긴 것 (메인 팝업). 내용은 고치지 않는다. */
    .mb{display:none;}
    .popup_group_1{
        position: fixed;
        top: 10%;
        left: 20px;
        /* transform: translateX(-50%); */
         z-index: 9999999;/* overflow: hidden; */
        max-width:500px;
        width: 100%;
        color: #212121;
        display: none;
      /* width: 680px;
      height: 400px; */

    }
    .popup_group_1::before{ display:none; position: absolute;content: ''; width: 200vw;height: 200vh;background-color: #00000050;z-index: -1;top: -50%;left: -100%;}
    .group_1_remote_gr{display: grid;width: 100%;
      grid-template-columns: repeat(auto-fit, minmax(50px,1fr));}
    .group_1_remote_list{height: 43px;text-align: center;display: flex;align-items: center;justify-content: center;background-color: #fff; cursor: pointer;border-left: 1px solid #d9d9d9;color: #212121;}
    .group_1_remote_list.on{color: #f38200;font-weight: 600;}
    .group_1_remote_list:first-child{border-left:  none;}
    .group_1_bottom_gr{
      width: 100%;background-color: rgb( 0, 0, 0, 0.8);color: #fff;height: 36px;display: flex;justify-content: space-between;align-items: center;}
    .close_btn{cursor: pointer;padding: 0 15px ;font-size: 14px;}
    .group_1_bottom_gr button{cursor: pointer;color: #fff;background-color: transparent;font-size: 14px;padding: 0 15px ;border: none;}
    @media screen and (max-width:850px) {
        .popup_group_1::before{left:-100%}
    }
    @media screen and (max-width:768px) {
        .mb{display:block;width: 100%;}
        .pop_pc{display:none;}
        .popup_group_1{
            width: 98%;
            top: 100px;
            left:50%;
            transform: translateX(-50%);
        }
        .pop_pc{display: none;}
        .group_1_remote_gr{position: absolute;bottom: 45px;height: 2px;z-index: 99;display: flex;gap: 5px;justify-content: center;}
        .group_1_remote_list{height: 100%;width: 15px;opacity: 0.6;}
        .group_1_remote_list.on{opacity: 1;}
    }