@media screen and (max-width:890px){
    div#header_wrap{
        width: 100%;
        height: 152px;
        position: fixed;
        overflow-x: scroll;
        z-index: 26 !important;
        background: rgb(255, 255, 255);
    }
    h1#friend_logo{
        width: 97px;
        height: 50px;
        position: relative;
        left: 44%;
        top: 7px;
        /* background-color: darkblue; */
    }
    .header_wrap{
        width: 100%;
    }
    ul.swiper-wrapper{
        display: block;
        width: 450%;
        float: left;
        left: 0px;
        top: 0px;
        /* background-color: cadetblue; */
    }
    nav#mobile_menu{
        display: block;
        /* margin-top: -20px; */
        position: relative;
        top: -22px;
        left: 23px;
        width: 82px;
        /* background: darkblue; */
    }
    li.swiper-slide{
        width: 5%;
        height: 100%;
        /* overflow: hidden; */
        float: left;
        position: relative;
        left: 0px;
        top: 9px;
        /* background: darkblue; */
    }
    ul.swiper-wrapper>li>a{
        font: bold 2vw 'Noto sans KR';
        color: #323d63;
        /* background-color: darkblue; */
    }


    ul#mainmenu_list>li{
        width: 14%;

        margin-left: 8px;
    }

    nav#friend_mainmenu{
        display: none;
    }
    nav#friend_mainmenu_mo{
        display: block;
        width: 100%;
        height: 45px;
        position: relative;
        left: 0px;
        top: 0.1vw;
        padding-left: 39px;
        padding-bottom: 22.5px;
        overflow: hidden;
        border-bottom: solid 1px #c4c4cc;
        border-top: solid 0.5px #a8a8ad;
        box-sizing: border-box;
        /* background: sandybrown; */
    }
    i#mobile_menu_icon{
        font-size: 27px;
        color: #414141;
        margin-left: 3%;
    }
    .submenu_list{
        width: 17.5%;
    }
    .top_menu_list{
        width: 100%;
    }

    /* 모바일메뉴 */

    nav#mo_menubar{
        width: 53%;
        height: 270vw;
        position: fixed;
        left: 0px;
        top: 0px;
        z-index: 999;
        background: rgba(255, 255, 255, 1);
        overflow-x: hidden;
        /* display: none; */
    }


    div#mo_join{
        width: 100%;
        /* height: 37vw !important; */
        height: inherit !important;
        /* height: fit-content; */
        height: max-content;
        position: absolute;
        left: 0px;
        top: 0px;
        background: #53566b;
    }
    div#mo_join i{
        font-size: 3.4vw;
        position: relative;
        left: 94%;
        top: 3vw;
        color: #D9D9D9;
    }

    .user_img_wrap{
        width: 78%;
        height: 14vw;
        border-radius: 100px;
        background: none;
        margin-left: 2%;
        border: solid 1px rgb(164 164 188);
    }
    div.user_img{
        width: 91%;
        height: 92%;
        border-radius: 100px;
        overflow: hidden;
        margin: 0px auto;
        background: #d1d1d9;
        margin-top: 4px;
        /* border: solid 3px rgb(168, 168, 173); */
        /* background-color: darkblue; */
    }
    div.user_img img{
        width: 100%;
        height: 100%;
        /* object-fit: cover; */
    }

    div#profile_mo_wrap{
        width: 18vw;
        height: 15vw;
        margin-left:5vw;
        margin-top: 2vw;
        /* background-color: darkblue; */
    }
    div#profile_mo_list{
        width: 15vw;
        height: 13vw;
        /* background-color: #4b4c50; */
    }
    div#profile_mo_list img{
        width: 100%;
    }
    div#change_profile_mo{
        width: 6vw;
        height: 6vw;
        position: relative;
        left: 10vw;
        top:-6vw;
        border-radius: 5vw;
        border: 2px solid #5E5A6D;
        display: none;
        background-color: rgb(255, 255, 255);
        /* background-color: darkblue; */
    }
    div#change_profile_mo i{
        width: 3vw;
        height: 3vw;
        position: absolute;
        left:1.3vw;
        top:1.5vw;
        font-size: 3.5vw;
        color: #5E5A6D;
        /* background-color: darkblue; */
    }

    div#business_logout_wrap{
        width: 65%;
        height: 10vw;
        position: relative;
        right: 3vw;
        top:-12vw;
        float: right;
        padding: 3vw 0;
        box-sizing: border-box;
        /* background-color: darkgray; */
    }

    div#business_logout_wrap p{
        width: 57%;
        height: 2vw;
        font: bold 4vw 'Noto sans KR';
        color: white;
        position: relative;
        left: -8%;
        /* background-color: lavender; */
    }
    div#business_logout_wrap span{
        font:normal 3.8vw 'Noto sans KR';
        color: white;
    }

    div.business_logout{
        width: 31%;
        height: 5.5vw;
        float: right;
        position: absolute;
        right: 4vw;
        top: 3.5vw;
        padding: 0.2vw 3.2vw;
        box-sizing: border-box;
        border: solid 0.1vw white;
        border-radius: 4vw;
        font: bold 3vw 'Noto sans KR' !important;
        color: white;
        background: none;
    }
   
    div#company_change_part_wrap{
        width: 90%;
        height: 6vw;
        position: absolute;
        top: 24vw;
        left: 5vw;
        /* background-color: darkgoldenrod; */
    }

    ul.company_change_part{
        width: 100%;
        height: 100%;
    }

    ul.company_change_part>li{
        width: 27%;
        height: 100%;
        float: left;
        margin-left: 2.5vw;
        background: none;
        border: solid 0.2vw #d6d6d6;
    }
    ul.company_change_part>li:first-child{
        margin-left: 0;
    }
    ul.company_change_part>li a{
        font:bold 3.2vw 'Noto sans KR';
        font-weight:500;
        position: absolute;
        top:1vw;
        left: 2vw;
        color: white;
        /* background-color: darkblue; */
    }
    
    /* 로그인전 */
    div#business_logout_wrap2{
        width: 91%;
        height: 10vw;
        position: relative;
        right: 5vw;
        top: 9vw;
        float: right;
        padding: 2.5vw 0;
        box-sizing: border-box;
        /* background-color: darkgray; */
    }
    div#business_logout_wrap2 p{
        font: normal 4vw 'Noto sans KR';
        color: white;
        /* text-align: center; */
    }
    div#business_logout_wrap2 span{
        font: normal 3.5vw 'Noto sans KR';
        color: #e4e5eb;
        position: relative;
        top: 7px;
        letter-spacing: 1.5px;
        /* text-align: center; */
    }

    .business_logout2{
        width: 25%;
        height: 6vw;
        float: right;
        position: absolute;
        right: 20vw;
        top: 2.8vw;
        padding: 0vw 4vw;
        box-sizing: border-box;
        border: solid 0.3vw #a8acc1;
        border-radius: 3vw;
        font: bold 3.4vw 'Noto sans KR' !important;
        color: white;
        background: none;
        cursor: pointer !important;
    }
    div.business_sign_up{
        width: 25%;
        height: 6vw;
        float: right;
        position: absolute;
        right: 0vw;
        top: 2.8vw;
        padding: 0vw 2.5vw;
        box-sizing: border-box;
        border: solid 0.3vw #a8acc1;
        border-radius: 3vw;
        background: none;
    }
    div.business_sign_up a{
        font: bold 3.4vw 'Noto sans KR' !important;
        color: white;
    }

    /* 메뉴들  */
    div#mo_menubar_menu{
        width: 100%;
        height: 250vw;
        margin-top: 42vw;
        background-color: rgb(255, 255, 255);
    }

    /* 왼쪽메뉴 */
    div#mo_menubar_left_menu{
        width: 44%;
        height: 100%;
        position: relative;
        top:-4vw;
        background-color: white;
        box-shadow: 2px 0px 4px rgba(158, 158, 158, 0.2);
    }

    ul.left_menu{
        width: 100%;
        height: 100%;
    }
    ul.left_menu>li{
        width: 100%;
        height: 14vw;
        font:bold 3.4vw 'Noto sans KR' !important;
        color: #4A4D62;
        padding: 4.35vw 3.5vw;
        box-sizing: border-box;
        border-bottom: solid 0.1vw #D3D3D3;
    }





    /* 오른쪽메뉴 */
    div#mo_menubar_right_menu{
        width: 56%;
        height: 100%;
        position: relative;
        left: 0px;
        top: -254vw;
        float: right;
        background-color: #FBFBFB;
       
    }

    ul.right_menu{
        width: 100%;
        height: 100%;
    }
    ul.right_menu>li{
        width: 100%;
        height: 14vw;
        padding: 4.35vw 3.5vw;
        box-sizing: border-box;
        border-bottom: solid 0.1vw #EAEAEA;
    }

    ul.right_menu>li a{
        font:normal 3.3vw 'Noto sans KR' !important;
        color: #727272;
        text-align: center;
        /* background-color: rgb(223, 221, 219); */
    }





    div#mobile_graylayer{
        width: 100%;
        height: 100%;
        background: rgb(58, 58, 58);
        opacity: 0.8;
        position: fixed;
        left: 0px;
        top:0px;
        z-index: 9;
        display: none;
   }


   /* #right_main:active{
    color:rgb(76, 83, 177);
  } */

  ul.left_menu>li.selected{
  color:rgb(81, 112, 211); 
  }    


  
/* 테블릿 업체변경하기 팝업 */

div#company_change_wrap{
    width: 77% !important;
    height: 85vw !important;
    position: absolute;
    left: 40% !important;
    top: -46vw !important;
    z-index: 9999999999 !important;
    background: #F7F7F7;
    box-shadow: 2px 4px 10px rgba(62, 61, 68, 0.2);
    display: none !important;
    touch-action: pan-y !important;
    
}
div#company_change_wrap2{
    width: 100% !important;
    height: 85vw !important;
    position: absolute;
    left: 0;
    top: 38vw;
    z-index: 9 !important;
    background: #F7F7F7;
    box-shadow: 2px 4px 10px rgba(62, 61, 68, 0.2);
    display: none;
    touch-action: pan-y !important;
}

ul.change_scroll_list>li img{
    width: 9% !important;
    height: 8vw !important;
    border-radius: 100px;
    overflow: hidden;
    background: #474752;
    margin-top: 9px !important;
    margin-left: 7% !important;
    /* object-fit: cover; */
    /* background-color: darkblue; */
}
div#company_change_img img{
    width: 100%;
    /* background-color: darkblue; */
}



div#company_change_img i{
    width: 10%;
    position: relative;
    left: 93%;
    top: -23vw;
    cursor: pointer;
    font-size: 1.6em;
    color: #c3c7d4;
    /* background-color: darkblue; */
}

div#company_change_img p{
    font: bold 4vw 'Noto sans KR';
    font-weight: 400;
    letter-spacing: 0.9px;
    color: #ffffff;
    position: relative;
    left: 8%;
    top: -19vw;
    /* background-color: darkblue; */
}

div#company_change_scroll{
    width: 100%;
    height: 409px;
    margin-top: -33px;
    padding: 10px 0.2em;
    box-sizing: border-box;
    overflow: scroll;
    /* background-color: rgb(185, 185, 196); */
}

ul.change_scroll_list{
    width: 100%;
    height: 100%;
}

ul.change_scroll_list>li:first-child{
    margin-top: 0;
}

ul.change_scroll_list>li{
    width: 100%;
    height: 85px;
    background: #FFFFFF;
    margin-top: 23px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.12);
    border-radius: 5px;
}

ul.change_scroll_list>li img{
    width: 18%;
    height: 40px;
    border-radius: 100px;
    overflow: hidden;
    background: #474752;
    margin-top: 9px;
    margin-left: 5%;
    /* object-fit: cover; */
    /* background-color: darkblue; */
}

div.change_scroll_text_wrap{
    width: 51%;
    height: 67%;
    float: right;
    position: relative;
    top: 13px;
    right: 23%;
    /* background-color: rgb(210, 210, 224); */
}

div.change_scroll_text_wrap p{
    width: 100%;
    font: bold 1.3rem 'Noto sans KR';
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #404D72;
    /* background: red; */
}
div.change_scroll_text_wrap span{
    font: bold 1.2rem 'Noto sans KR';
    font-weight: 300;
    color: #8a91a5;
}

ul.change_scroll_list>li button{
    width: 20%;
    height: 0;
    padding: 1rem;
    background: #FFFFFF;
    border: 1px solid #6F8ACC;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    top: 27px;
    right: -48%;
    float: right;
}
ul.change_scroll_list>li button p{
    cursor: pointer;
    font: bold 1.2rem 'Noto sans KR';
    color: #506CB0;
    margin-top: -15px;
}

/* ------------ */



    div#footer_wrap{
        width: 156%;
        height: 200px;
        position: relative;
        left: 0px;
        top: 0;
        z-index: 9;
        /* display: none; */
    }
    footer{
        width: 100%;
    }
    /* .top_menu{
        display: none;
    } */
   
}


/* 모바일 */
@media screen and (max-width:430px){
    html, body { max-width: 100%;  resize: none; }
   
    .grayLayer{
        display: none;
        height: 100%;
        width: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: black;
        opacity: 0.5;
        z-index: 6;
        /* pointer-events: none; */
    }

    #resetCSS{
        width: 100%;
        height: 668px;
        position: relative;
        top: 0px;
        /* background: #9494a7; */
    }

    /* .top_menu{
        display: none;
    } */
    .header_wrap{
        width: 100%;
    }
    header::after{
       display: none;
    }
    /* 로그인창 */
    div#login_signup{
        display: none;
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        margin-left:0px;
        top:0vw;
        margin-top:0px;
        z-index: 99999999999 !important;
        padding-top: 16vw;
        box-sizing: border-box; 
        /* border-radius: 5px; */
        background-color: rgb(255, 255, 255);
    }
    div#login_signup i{
        width: 4%;
        height: 5vw;
        float: right;
        margin-top: -13vw;
        margin-right: 3%;
        font-size: 5vw;
        color: slategrey;
        cursor: pointer;
        /* background-color: rgb(43, 64, 83); */
    }
    div#login_text{
        width:100%;
        height:4vw;
        margin: 0px auto;
        padding-bottom: 9vw;
        box-sizing: border-box;
        /* background-color: rgb(131, 131, 209); */
    }
    h2.hello{
        text-align: left;
        padding-bottom: 4vw;
        font: bold 5.5vw 'Noto sans KR';
        color: #717274;
    }
    p#hello_text{
        text-align: center;
        font: normal 3.5vw 'Noto sans KR';
        color: #aaaaaa;
       
    }
    form#join{
        width: 100%;
        height: 85vw;
        margin: 0px auto;
        /* background: rgb(219, 219, 219); */
    }

    table#join_table th{
        width: 100%;
        height: 6vw;
       font: bold 3.5vw 'Noto sans KR';
       color: #989ba1;
       text-align: left;
       position: relative;
       top:10px;
       margin-top: 120px;
       /* background-color: aliceblue; */
    
    }

    table#join_table td input{
        width: 100%;
        height: 10vw;
        box-sizing: border-box;
        border: solid 1px #cacaca;
        font-size: 0.8em;
        margin-top: 12px;
        /* background-color: cadetblue; */
     }

     div#login_option{
        width: 100%;
        height: 6vw;
        margin-top: 4vw;
        /* background-color: rgb(245, 211, 211); */
     }

     div#login_option span{
        font:normal 3.3vw 'Noto sans KR';
        color: #919497;
     }
     div#find_password a{
        cursor: pointer;
        font:normal 3.3vw 'Noto sans KR';
        color: #919497;
      }

      div#service_use_btn{
        width: 100%;
        height: 11vw;
        margin-top: 25px;
        /* margin-left: 25%; */
        background: #3a548d;
      }
      div#service_use_btn a{
        width: 100%;
        height: 100%;
        line-height: 12;
        font: normal 3.8vw 'Noto sans KR';
        font-weight: 500;
        color: rgb(255, 255, 255);
    
    }
    div#sing_in_wrap{
        width: 100%;
        height: 35vw;
        margin-top: -4vw;
        /* background-color: #334a68; */
      }

      div.sing_btn{
        width: 100%;
        height: 12vw;
        padding-left: 20%;
        margin-top: 24vw;
        box-sizing: border-box;
        /* background-color: rgb(114, 173, 173); */
      } 
      .singin_btn{
        width:12.5%;
        height: 10vw;
        border-radius: 100px;
        float: left;
       position: relative;
       left: 11%;
       top:0px;
       margin-left: 4%;
        /* background-color: darkblue !important; */
      }

      .g_id_signin{
       margin-top: -0.5vw;
        /* background-color: darkblue !important; */
      }
      
      .singin_btn img{
        width: 50%;
        height: 50%;
        margin-top: 9px;
        
        margin-left: 25%;
        /* background-color: darkblue; */
    }

      #snsLoginText {
        margin-top: 10vw;
        text-align: center;
        font: bold 3.8vw 'Noto sans KR';
        color: #35478d;
        display: flex;
        flex-basis: 100%;
        align-items: center;
    }
    #snsLoginText::before,
    #snsLoginText::after {
        content: "";
        flex-grow: 1;
        background: rgba(0, 0, 0, 0.35);
        height: 1px;
        font-size: 0px;
        line-height: 0px;
        margin: 0px 4vw;
    }
    div#signup_wrap{
        width: 100%;
        height: 12vw;
        padding-left: 15%;
        padding-right: 20%;
        margin-top: 5vw;
        box-sizing: border-box;
        /* background-color: rgb(133, 133, 175); */
      }

      p#no_account{
        font: normal 3.5vw 'Noto sans KR';
        color: #969696;
      }
      div#signup_wrap>a{
        font: normal 3.5vw 'Noto sans KR';
        color: #314ba1;
        float: right;
        text-decoration: underline;
        margin-top: -5vw;
      }
      

        /* 모바일 메뉴바 부분!!!*/
    nav#mo_menubar{
        width: 83% !important;
        height: 270vw;
        position: fixed;
        left: 0px;
        top: 0px;
        z-index: 9;
        background: rgba(255, 255, 255, 1);
        overflow-x: hidden;
        display: none;
    }
    div#mo_join{
        width: 101%;
        /* height: 37vw !important; */
        height: inherit !important;
        /* height: fit-content; */
        height: max-content;
        position: absolute;
        left: 0px;
        top: 0px;
        background: #53566b;
    }
    div#mo_join i{
       font-size: 4.5vw;
        position: relative;
        left:92%;
        top:2vw;
        color:#D9D9D9;
    }

    .user_img_wrap{
        width: 78%;
        height: 14vw;
        border-radius: 100px;
        background: none;
        margin-left: 2%;
        border: solid 1px rgb(164 164 188);
    }
    div.user_img{
        width: 89%;
        height: 85%;
        border-radius: 100px;
        overflow: hidden;
        margin: 0px auto;
        background: #d1d1d9;
        margin-top: 4px;
        /* border: solid 3px rgb(168, 168, 173); */
        /* background-color: darkblue; */
    }
    div.user_img img{
        width: 100%;
        height: 100%;
        /* object-fit: cover; */
    }

    div#profile_mo_wrap{
        width: 18vw;
        height: 15vw;
        margin-left:5vw;
        margin-top: 2vw;
        /* background-color: darkblue; */
    }
    div#profile_mo_list{
        width: 15vw;
        height: 13vw;
        /* background-color: #4b4c50; */
    }
    div#profile_mo_list img{
        width: 100%;
    }
    div#change_profile_mo{
        width: 6vw;
        height: 6vw;
        position: relative;
        left: 10vw;
        top:-6vw;
        border-radius: 5vw;
        border: 2px solid #5E5A6D;
        display: none;
        background-color: rgb(255, 255, 255);
        /* background-color: darkblue; */
    }
    div#change_profile_mo i{
        width: 3vw;
        height: 3vw;
        position: absolute;
        left:1.3vw;
        top:1.5vw;
        font-size: 3.5vw;
        color: #5E5A6D;
        /* background-color: darkblue; */
    }

    div#business_logout_wrap{
        width: 65%;
        height: 10vw;
        position: relative;
        right: 3vw;
        top:-12vw;
        float: right;
        padding: 3vw 0;
        box-sizing: border-box;
        /* background-color: darkgray; */
    }

    div#business_logout_wrap p{
        width: 57%;
        height: 2vw;
        font: bold 4vw 'Noto sans KR';
        color: white;
        position: relative;
        left: -8%;
        /* background-color: lavender; */
    }
    div#business_logout_wrap span{
        font:normal 3.8vw 'Noto sans KR';
        color: white;
    }

    div.business_logout{
        width: 35%;
        height: 6vw;
        float: right;
        position: absolute;
        right: 4vw;
        top: 3vw;
        padding: 0.2vw 3.2vw;
        box-sizing: border-box;
        border: solid 0.1vw white;
        border-radius: 4vw;
        font: bold 3.2vw 'Noto sans KR' !important;
        color: white;
        background: none;
    }
   
    div#company_change_part_wrap{
        width: 86%;
        height: 6vw;
        position: absolute;
        top: 27vw;
        left: 5vw;
        /* background-color: darkgoldenrod; */
    }

    ul.company_change_part{
        width: 100%;
        height: 100%;
    }

    ul.company_change_part>li{
        width: 30%;
        height: 100%;
        float: left;
        margin-left: 2.5vw;
        background: none;
        border: solid 0.2vw #d6d6d6;
    }
    ul.company_change_part>li:first-child{
        margin-left: 0;
    }
    ul.company_change_part>li a{
        font:bold 3.2vw 'Noto sans KR';
        font-weight:500;
        position: absolute;
        top:1vw;
        left: 2vw;
        color: white;
        /* background-color: darkblue; */
    }
    
    /* 로그인전 */
    div#business_logout_wrap2{
        width: 91%;
        height: 10vw;
        position: relative;
        right: 5vw;
        top: 9vw;
        float: right;
        padding: 2.5vw 0;
        box-sizing: border-box;
        /* background-color: darkgray; */
    }
    div#business_logout_wrap2 p{
        font: normal 4vw 'Noto sans KR';
        color: white;
        /* text-align: center; */
    }
    div#business_logout_wrap2 span{
        font: normal 3.5vw 'Noto sans KR';
        color: #e4e5eb;
        position: relative;
        top: 7px;
        letter-spacing: 1.5px;
        /* text-align: center; */
    }

    .business_logout2{
        width: 25%;
        height: 6vw;
        float: right;
        position: absolute;
        right: 20vw;
        top: 2.8vw;
        padding: 0vw 4vw;
        box-sizing: border-box;
        border: solid 0.3vw #a8acc1;
        border-radius: 3vw;
        font: bold 3.4vw 'Noto sans KR' !important;
        color: white;
        background: none;
        cursor: pointer !important;
    }
    div.business_sign_up{
        width: 25%;
        height: 6vw;
        float: right;
        position: absolute;
        right: 0vw;
        top: 2.8vw;
        padding: 0vw 2.5vw;
        box-sizing: border-box;
        border: solid 0.3vw #a8acc1;
        border-radius: 3vw;
        background: none;
    }
    div.business_sign_up a{
        font: bold 3.4vw 'Noto sans KR' !important;
        color: white;
    }

    /* 메뉴들  */
    div#mo_menubar_menu{
        width: 100%;
        height: 250vw;
        margin-top: 42vw;
        background-color: rgb(255, 255, 255);
    }

    /* 왼쪽메뉴 */
    div#mo_menubar_left_menu{
        width: 44%;
        height: 100%;
        position: relative;
        top:-4vw;
        background-color: white;
        box-shadow: 2px 0px 4px rgba(158, 158, 158, 0.2);
    }

    ul.left_menu{
        width: 100%;
        height: 100%;
    }
    ul.left_menu>li{
        width: 100%;
        height: 14vw;
       
        padding: 4.35vw 3.5vw;
        box-sizing: border-box;
        border-bottom: solid 0.1vw #D3D3D3;
    }

    ul.left_menu>li{
        font:bold 3.8vw 'Noto sans KR' !important;
        color: #4A4D62;
      
        /* background-color: rgb(223, 221, 219); */
    }




    /* 오른쪽메뉴 */
    div#mo_menubar_right_menu{
        width: 56%;
        height: 100%;
        position: relative;
        left: 0px;
        top: -254vw;
        float: right;
        background-color: #FBFBFB;
       
    }

    ul.right_menu{
        width: 100%;
        height: 100%;
    }
    ul.right_menu>li{
        width: 100%;
        height: 14vw;
        padding: 4.35vw 3.5vw;
        box-sizing: border-box;
        border-bottom: solid 0.1vw #EAEAEA;
    }

    ul.right_menu>li a{
        font:normal 3.8vw 'Noto sans KR' !important;
        color: #727272;
        text-align: center;
        /* background-color: rgb(223, 221, 219); */
    }





    div#mobile_graylayer{
        width: 100%;
        height: 100%;
        background: rgb(58, 58, 58);
        opacity: 0.8;
        position: fixed;
        left: 0px;
        top:0px;
        z-index: 99999;
   }


   /* #right_main:active{
    color:rgb(76, 83, 177);
  } */

  ul.left_menu>li.selected{
  color:rgb(81, 112, 211); 
  }    


  

/* 네비상단 */
div#header_wrap{
    /* width: 100%;
    height: 31.5vw;
    position: fixed;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 99999 !important;
    background: rgb(255, 255, 255); */
    width: 100%;
    height: 38.5vw;
    position: fixed;
    top: -31px;
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: 99999 !important;
    background: rgb(255, 255, 255);
    
}
   
    header{
        width: 100%;
        height: 100%;
        /* background-color: saddlebrown; */
    }
    nav#friend_mainmenu{
        display: none;
    }
    div#header_wrap::after{
        display: none;
    }



    /* 모바일 메인메뉴  */
    nav#friend_mainmenu_mo{
        display: block;
        width: 100%;
        height: 10vw;
        position: relative;
        left: 0px;
        top:0.6vw;
        padding-left: 0;
        border-bottom:solid 1px #c4c4cc;
        border-top: solid 0.5px #a8a8ad;
        /* box-sizing: border-box; */
        /* background: sandybrown; */
    }

    div.mainmenu_mo_wrap{
        width: 100% !important;
        height: 100%;
        /* overflow: hidden; */
        /* background-color: darkblue; */
    }
    ul.swiper-wrapper{
        width: 60%;
        /* height: 10vw; */
        /* height: 100%; */
        position: relative;
        left: 0px;
        top:1vw;
        /* background-color: rgb(187, 111, 111); */
    }

    .mainmenu_mo>li{
        width: 6% !important;
        height: 5vw !important;
        /* background: darkcyan; */
        margin-left: 1vw !important;
        margin-top: 2.3vw;
        text-align: center;
        /* background-color: darkblue; */
    }
    ul.swiper-wrapper>li>a{
        
        font: bold 3.5vw 'Noto sans KR';
        color: #323d63;
        /* background-color: darkblue; */
    }

    /* button#right_btn{
        width: 7vw;
        height: 97%;
        float:right;
        position: relative;
        top:-7.8vw;
        border: none;
        z-index: 9999;
        border-left: solid 1px #787878;
        background-color: rgb(255, 255, 255);

    }
    button#right_btn i{
        color: #787878;
    } */


 
    /* 모바일 업체변경하기 팝업 */

    div#company_change_wrap{
        width: 77% !important;
        height: 85vw !important;
        position: absolute;
        left: 40% !important;
        top: -46vw !important;
        z-index: 9999999999 !important;
        background: #F7F7F7;
        box-shadow: 2px 4px 10px rgba(62, 61, 68, 0.2);
        display: none !important;
        touch-action: pan-y !important;
        
    }
    div#company_change_wrap2{
        width: 99% !important;
        height: 85vw !important;
        position: absolute;
        left: 0;
        top: 37vw;
        z-index: 9 !important;
        background: #F7F7F7;
        box-shadow: 2px 4px 10px rgba(62, 61, 68, 0.2);
        display: none;
        touch-action: pan-y !important;
    }

    ul.change_scroll_list>li img{
        width:12% !important;
        height:9vw !important;
        border-radius: 100px;
        overflow: hidden;
        background: #474752;
        margin-top: 3vw !important;
        margin-left: 7% !important;
        /* object-fit: cover; */
        /* background-color: darkblue; */
    }
    div#company_change_img img{
        width: 100%;
        /* background-color: darkblue; */
    }



    div#company_change_img i{
        width: 10%;
        position: relative;
        left: 93%;
        top: -23vw;
        cursor: pointer;
        font-size: 1em;
        color: #c3c7d4;
        /* background-color: darkblue; */
    }

    div#company_change_img p{
        font: bold 4vw 'Noto sans KR';
        font-weight: 400;
        letter-spacing: 0.9px;
        color: #ffffff;
        position: relative;
        left: 8%;
        top: -19vw;
        /* background-color: darkblue; */
    }

    div#company_change_scroll{
        width: 100%;
        height: 220px;
        margin-top: -33px;
        padding: 10px 0.2em;
        box-sizing: border-box;
        overflow: scroll;
        /* background-color: rgb(185, 185, 196); */
    }

    ul.change_scroll_list{
        width: 100%;
        height: 100%;
    }

    ul.change_scroll_list>li:first-child{
        margin-top: 0;
    }

    ul.change_scroll_list>li{
        width: 100%;
        height: 58px;
        background: #FFFFFF;
        margin-top: 10px;
        box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.12);
        border-radius: 5px;
    }

    ul.change_scroll_list>li img{
        width: 18%;
        height: 40px;
        border-radius: 100px;
        overflow: hidden;
        background: #474752;
        margin-top: 9px;
        margin-left: 5%;
        /* object-fit: cover; */
        /* background-color: darkblue; */
    }

    div.change_scroll_text_wrap{
        width: 51%;
        height: 67%;
        float: right;
        position: relative;
        top: 10px;
        right: 23%;
        /* background-color: rgb(210, 210, 224); */
    }

    div.change_scroll_text_wrap p{
        width: 100%;
        font: bold 0.9em 'Noto sans KR';
        font-weight: 700;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        color: #404D72;
        /* background: red; */
    }
    div.change_scroll_text_wrap span{
        font: bold 0.8em 'Noto sans KR';
        font-weight: 300;
        color: #8a91a5;
    }

    ul.change_scroll_list>li button{
        width: 20%;
        height: 22px;
        background: #FFFFFF;
        border: 1px solid #6F8ACC;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        top: 20px;
        right: -48%;
        float: right;
    }
    ul.change_scroll_list>li button p{
        cursor: pointer;
        font: bold 0.95em 'Noto sans KR';
        color: #506CB0;
        margin-top: -1px;
    }







/* ----------------------- */
    nav#mobile_menu{
        width: 11%;
        height: 10vw;
        position: relative;
        right:-4%; 
        top:-6vw;
        /* width:14%;
        margin-left: -85vw; */
        display: block;
        /* background-color: #314ba1; */
    }
    
    i#mobile_menu_icon{
        font-size: 5.5vw;
        margin-top: 4vw;
        color: #6d6f7c;
    }

    h1#friend_logo{       
        width: 10%;
        height: 10vw;
        position: relative;
        left:40%;
        
        top:3vw;
        /* background-color: #314ba1; */
    }
     h1#friend_logo img{
        width: 23vw;
        position: relative;
        top: 0vw;
        
    }
  
    
    /* <!-- 푸터 --> */
div#footer_wrap{
    width: 100%;
    height: 47vw;
    position: relative;
    left: 0px;
    /* font-size: 3.2vw; */
    top: 0px;
}
footer{
    width: 100%;
    height: 100%;
    /* padding-top: 10vw; */
    box-sizing: border-box;
    /* background-color: darkblue; */
}
div#contents{
    width: 100%;
    height: 3vw;
    position: relative;
    left: 1.5vw;
    top: -21vw;
    padding-bottom: 5vw;
    /* background-color: darkcyan; */

}
p#terms_of_service2{
    position: absolute;
    left: 0px;
    top:0px;
    margin-left: 75px;
   
    /* background-color: darkblue; */
}
p#terms_of_service a{
    font: normal 3.1vw 'Noto sans KR';
    color: white;
    
}
p#terms_of_service2 a{
    font: normal 3.1vw 'Noto sans KR';
    color: white;
}
p#terms_of_service a{
    /* font: normal 0.87em 'Noto sans KR'; */
    letter-spacing: 3px;
    color: white;
}
div#contents_other{
    width: 100%;
    height: 4vw;
    margin-left: 2%;
    margin-top: -19vw;
    /* background-color: cadetblue; */
}
div#contents_other p{
    font: normal 2.8vw 'Noto sans KR';
    color: white;
    line-height: 210%;
    /* background-color: saddlebrown; */
}

div#contents_other p>a{
    color: white;
}
    

}

@media screen and (max-width:320px){
   
    /* 로그인 카톡네이버 */
    .singin_btn{
        width:16%;
        height: 13vw;
        border-radius: 100px;
        float: left;
       position: relative;
       left: 7%;
       top:0px;
       margin-left: 4%;
        /* background-color: darkblue !important; */
      }
      
      .singin_btn img{
        width: 50%;
        height: 50%;
        margin-top: 9px;
        
        margin-left: 25%;
        /* background-color: darkblue; */
    }

        /* <!-- 푸터 --> */
div#footer_wrap{
    width: 100%;
    position: relative;
    left: 0px;
    top:0px;
    height:49vw;
}
div#contents_other p>a{
    color: white;
}
}