@charset "utf-8";


/* 헤더 */
.header{
    top: 0;
    left: 0;
    z-index: 99;
    position: fixed;
    width: 100%;
    height: 80px;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}
.header .h_wrap{
    max-width: 1440px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    /* overflow: hidden; */
}
.header .h_wrap .logo{
    float: left;
    width: 60%;
    margin-top: 26px;
}
.header .h_wrap .logo img{
    cursor: pointer;
}
.header .h_wrap > ul.head_list{
    /* overflow: hidden; */
    float: right;
    width: 40%;
}
.header .h_wrap > ul.head_list > li{
    text-align: center;
    float: left;
    width: calc(100% / 5);
    cursor: pointer;
    font-family: "hansR";
    color: rgb(37, 35, 35);
    transition: .2s;
    line-height: 91px;
    font-size: 17px;
}
.header .h_wrap > ul.head_list > li em{
    display: block;
}
.header .h_wrap > ul.head_list > li i.xi-user{
    font-size: 25px;
    color: rgb(77, 76, 76);
    /* display: none; */
}
.header .h_wrap > ul.head_list > .login_b{
    position: relative;
}
.header .h_wrap > ul.head_list > li:hover{
    color: #13796B;
    /* height: 65px; */
    transition: .2s;
}
.header .h_wrap ul.sidetab{
	display: none;
    padding: 15px 15px 0;
    width:170px;
    height: auto;
    right: 3%;
    top: 65px;
    position: absolute;
    z-index: 99;
    background-color: #fff;
    box-shadow: 3px 0px 10px rgb(224, 223, 223);
    border-radius: 4px;
}
.header .h_wrap  ul.sidetab li{
    cursor: pointer;
    height: 30px;
    font-family: "nanumR";
    color: #464646;
    font-size: 15px;
}
.header .h_wrap  ul.sidetab li p{
    font-size: 13px;
    color: #6f817f;
    margin-top: 5px;
    font-family: "nanumL";
}
.header .h_wrap  ul.sidetab li.section1{
    margin-bottom: 20px;
    font-size: 16px;
}
.header .h_wrap  ul.sidetab li.reserve{
    text-align: center;
    background-color: #11796E;
    color: #fff;
    line-height: 30px;
    font-family: "nanumL";
    margin-bottom: 20px;
    font-size: 15px;
    cursor: pointer;
}
.header .h_wrap  ul.sidetab li.section2,
.header .h_wrap  ul.sidetab li.section3{
    margin-top: 5px;
    padding-top: 20px;
    border-top: 1px solid #ececec;
    cursor: pointer;
}

/* 모바일/태블릿 햄버거박스 */
 .m_btn{
     display: none;
    position: absolute;
    right: 5px;
    top: 14px;
    cursor: pointer;
    z-index: 99;
    margin: 10px 0 0 8px;
}
.m_btn .btn_line{
    display: block;
    width: 30px; height:2px;
    border: 1px solid #3a3a3a;
    box-sizing: border-box;
    margin:7px;
    background-color:#3a3a3a;
    border-radius: 200px;
}
/* 사이드네비 백 */
.sidebg{
    position: fixed;
    left: -100%; top: 0;
    width: 100%; height: 100%;
    transition: all 0s ;
    z-index: 2;
    background-color: rgba(0, 0, 0, 0.349);
}
.sidebg.bg{
    transition: all 0s ;
    left: 0;
}
/* 사이드네비 */
.sidenav{
    position: fixed;
    width: 65%;
    right: -75%;
    top: 80px;
    height: 100%;
    background-color: #fffffff3;
    z-index: 100;
    transition: all .5s ;
}
.sidenav.show{
    transition: all .5s ;
    right: 0;
    width: 65%;
}
.sidenav .profile{
    width: 100%; height: 170px;
    text-align: center;
    padding-top: 60px;
}
.sidenav .profile .guest{
    font-family: "nanumR";
    color: #5c5656;
    font-size: 19px;
}
.sidenav .profile .guest p{
    font-size: 17px;
    margin-top: 10px;
    color: #4b4b4b;
    font-family: "nanumL";
}
.sidenav .profile .list{
    width: 100%;
}
.sidenav .profile .list span,
.sidenav .profile .logout span{
    text-align: center;
    background-color: #11796E;
    color: #fff;
    line-height: 30px;
    font-family: "nanumL";
    margin-bottom: 10px;
    font-size: 17px;
    cursor: pointer;
    width: 90%;
    display: inline-block;
    margin-top: 15px;
}
.sidenav .profile .logout{
    width: 100%;
}
.sidenav .profile .logout span{
    margin-top: 0px;
    border: 1px solid rgb(223, 223, 223);
    box-sizing: border-box;
    color:#11796E;
    background-color: #f7f7f7f3;
}
.sidenav .navtab{
    width: 90%; 
    margin: 0 5%;
    position: relative;
}
.sidenav .navtab ul.navtop li{
    text-align: center;
    height: 70px;
    line-height: 70px;
    color: #3b3434;
    font-family: "nanumR";
    font-size: 16px;
}
.navtab .navbottom ul{
    overflow: hidden;
    margin-top: 40px;
}
.navtab .navbottom ul li{
    font-family: "nanumR";
    color: #3b3434;
    float: left;
    text-align: center;
    height: 45px;
    line-height: 45px;
    border: 1px solid #eee;
    box-sizing: border-box;
    background-color: #f7f7f7f3;
    width: calc(100% / 3);
}
.navtab .navbottom ul li:not(:last-child){
    border-right: none;
}


/* 모바일 */

/* 태블릿 */
@media all and (min-width:768px) and (max-width:1023px){
    .header .h_wrap ul{
        display: none;
    }
    .m_btn{
        display: block;
        right: 10px;
    }
    .header .h_wrap .logo{
        margin-left: 10px;
    }
}
/* 태블릿/pc */
@media all and (min-width:1024px) and (max-width:1440px){
    
    .header{
        width: 100%;
    }
    .header .h_wrap{
        width: 950px;
        width: 100%;
        margin: 0 auto;
    }
    .header .h_wrap .logo{
        width: 40%;
        margin-left: 15px;
    }
    .header .h_wrap > ul.head_list{
        width: 50%;
    }
    .header .h_wrap ul.sidetab{
        right: 4%;
        top: 70px;
    }
    .best .b_wrap .b_box > img,
    .best .b_wrap .b_box{
        width: 300px;
    }
    .header .h_wrap > ul.head_list > li{
        line-height: 92px;
    }
}
@media all and (min-width:1441px) and (max-width:1540px){
    .header{width: 100%;}
    .header .h_wrap ul.sidetab{
        right: 5.5%;
    }
}
@media all and (min-width:1541px) and (max-width:1679px){
    .header{width: 100%;}
    .header .h_wrap ul.sidetab{
        right: 9%;
    }
}