
/* header */
.h2Position{position: absolute;left:-9999px;width:1px;height:1px;line-height: 0;font-size:1px;overflow:hidden;}
.background_class{background-repeat: no-repeat;background-size: auto 100%;background-position: center center;}
.clear0:after{content:"";display:block;clear:both;}

.GB{font-family: 'Gmarket_B';}
.GM{font-family: 'Gmarket_M';}
.GL{font-family: 'Gmarket_L';}

.NBGB{font-family: 'NanumBarunGothicBold';}
.NBGL{font-family: 'NanumBarunGothicLight';}
.NBGUL{font-family: 'NanumBarunGothicUltraLight';}
.NBGR{font-family: 'NanumBarunpenR';}

@media screen and (max-width: 767px){
    .q_menu{font-family: "Noto Sans KR"; font-weight: 700; font-size: 12px; width: 100%; position: fixed; display: flex; justify-content: space-between; align-items: center; bottom: 0; background-color: #F1F1F1; padding-top: 10px; z-index: 99;}
    .q_menu li{width: 33.33%; text-align: center; margin-bottom: 10px; color: #000000;}
    .q_menu li a{display: block; font-weight: 400; font-size: 12px;}
    .q_menu li img{display: block; margin: 0 auto 5px; width: 100%; max-width: 35px;}
    .q_menu li:not(:nth-of-type(4)){border-right: 1px solid #CCCCCC; }
    .q_menu li:last-child{display: none; background-color: #0860C7; width: 75px; height: 75px; border-radius: 50px; padding-top: 30px; color:#ffffff}

    header{width: 100%; position: fixed; background-color: #0860C7; padding-top: 20px; z-index: 9999; display: flex; flex-direction: column; justify-content: space-between; align-items: center;}
    header h1{width: 100%; text-align: center; margin-bottom: 20px;}
    header h1 img{width: 100%; max-width: 180px;}
    header nav{border-top: 1px solid #ececec8f; padding: 10px;}
    header nav ul{color: #ffffff; display: flex; flex-wrap: wrap; align-items: center; font-size: 16px;}
    header nav ul li{width: 33.33%; font-size: 11px; line-height: 14px; text-align: center; margin-bottom: 5px;}
    header nav ul li a{display: block;}
    header nav ul li a:hover{color: #F19802;}

    footer{background-color: #030303; padding: 50px 10px 130px;}
    footer h2{width: 100%; text-align: center; margin-bottom: 30px;}
    footer h2 img{width: 100%; max-width: 165px;}
    footer hr{display: none; background:#919191; height:1px; border:0; margin-bottom: 30px;}
    footer div{width: 96%; margin: 0 auto; text-align: center;}
    footer div address{margin-bottom: 20px;}
    footer div address p{font-size: 12px; line-height: 18px; margin-bottom: 5px; color: #ffffff; opacity: 0.5;}
    footer div a{display: inline-block; color: #7A7A7A; font-size: 12px; line-height: 18px; border: 1px solid #7a7a7a; padding: 5px 40px;}
    footer div a:hover{background-color: #e1e1e1; color: #000000; font-weight: 700;}
}
@media screen and (min-width: 768px) and (max-width: 1279px){
    .q_menu{font-family: "Noto Sans KR"; font-weight: 700; font-size: 12px; width: 100%; position: fixed; display: flex; justify-content: space-between; align-items: center; bottom: 0; background-color: #F1F1F1; padding-top: 10px; z-index: 99;}
    .q_menu li{width: 33.33%; text-align: center; margin-bottom: 10px; color: #000000;}
    .q_menu li a{display: block;}
    .q_menu li img{display: block; margin: 0 auto 5px; width: 100%; max-width: 35px;}
    .q_menu li:not(:nth-of-type(4)){border-right: 1px solid #CCCCCC; }
    .q_menu li:last-child{display: none; background-color: #0860C7; width: 75px; height: 75px; border-radius: 50px; padding-top: 30px; color:#ffffff}

    header{width: 100%; position: fixed; background-color: #0860C7; padding-top: 20px; z-index: 9999; display: flex; flex-direction: column; justify-content: space-between; align-items: center;}
    header h1{width: 100%; text-align: center; margin-bottom: 20px;}
    header h1 img{width: 100%; max-width: 260px;}
    header nav{width: 100%; border-top: 1px solid #ececec8f; padding: 20px;}
    header nav ul{color: #ffffff; display: flex;justify-content: space-between; align-items: center;}
    header nav ul li{font-size: 14px; line-height: 20px; font-weight: 600; text-align: center;}
    header nav ul li a{display: block;}
    header nav ul li a:hover{color: #F19802;}

    footer{background-color: #030303; padding: 50px 10px 130px;}
    footer h2{width: 100%; text-align: center; margin-bottom: 30px;}
    footer h2 img{width: 100%; max-width: 245px;}
    footer hr{display: none; background:#919191; height:1px; border:0; margin-bottom: 30px;}
    footer div{width: 92%; margin: 0 auto; text-align: center;}
    footer div address{margin-bottom: 20px;}
    footer div address p{font-size: 12px; line-height: 22px; margin-bottom: 5px; color: #ffffff; opacity: 0.5;}
    footer div a{display: inline-block; color: #7A7A7A; font-size: 14px; line-height: 22px; border: 1px solid #7a7a7a; padding: 5px 40px;}
    footer div a:hover{background-color: #e1e1e1; color: #000000; font-weight: 700;}
}
@media screen and (min-width:1280px){
    .q_menu{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; position: fixed; right: 1%; background-color: #F1F1F1; padding: 15px 10px 3px; border-radius: 50px; z-index: 99; animation: jump 2s infinite linear;}
    @keyframes jump{
        0%{
            bottom: 20%;
        }
        50%{
            bottom: 25%;
        }
        100%{
            bottom: 20%;
        }
    }
    .q_menu li{text-align: center; margin-bottom: 10px; padding-bottom:10px;}
    .q_menu li a{display: block; font-weight: 400; font-size: 14px;}
    .q_menu li img{display: block; margin: 0 auto 5px;}
    .q_menu li:not(:last-child){border-bottom: 1px solid #CCCCCC; color: #000000;}
    .q_menu li:last-child{background-color: #0860C7; width: 75px; height: 75px; border-radius: 50px; padding-top: 30px; color:#ffffff}

    header{width: 100%; position: fixed; background-color: #0860C7; padding: 20px 100px; z-index: 9999; display: flex; justify-content: space-between; align-items: center;}
    header h1 img{width: 100%; max-width: 260px;}
    header nav ul{color: #ffffff; display: flex; font-size: 16px;}
    header nav ul li:not(:last-child){margin-right: 50px;}
    header nav ul li a{display: block;}
    header nav ul li a:hover{color: #F19802;}

    footer{background-color: #030303; padding: 50px  0; text-align: center;}
    footer h2{width: 100%; margin-bottom: 30px; }
    footer h2 img{width: 100%; max-width: 250px;}
    footer hr{background:#919191; height:1px; border:0; margin-bottom: 30px;}
    footer div{width: 89.58%; margin: 0 auto; display: flex; justify-content: center; align-items: center;}
    footer div address p{font-size: 14px; line-height: 22px; margin-bottom: 5px; color: #ffffff; opacity: 0.5;}
    footer div a{display: inline-block; color: #7A7A7A; font-size: 16px; line-height: 22px; border: 1px solid #7a7a7a; padding: 5px 30px;}
    footer div a:hover{background-color: #e1e1e1; color: #000000; font-weight: 700;}


}