body{ font-family: 'Pretendard'; letter-spacing: -0.8px; word-break: keep-all;}
/* 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){

    header{width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; padding: 15px 10px; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; background-color: rgba(255, 255, 255, 0.8);}
    header h1{margin: 0 auto;} 
    header h1 a{display: block;}
    header h1 a img{width: 100%; max-width: 160px;}
    header nav{display: none; width: 100%;}
    header nav ul{display: flex; justify-content: space-between; flex-wrap: wrap;}
    header nav ul li{color: #333333; font-size: 18px; line-height: 26px; text-align: center;} 
    header nav ul li a{display: inline-block;}
    header nav ul li a:hover{color: #5D2E7E; font-weight: 600;}



    footer{width: 100%; background-color: #FBFBFB; position: relative; padding: 70px 0;}
    footer > a{display: block; width: 40px; position: absolute; top: -20px; right: 5%; text-indent: -9999;}
    footer > div{width: 92.91%; margin: 0 auto;}
    footer > div a{display: inline-block; background-color: #FCF5FF; padding: 7px 40px; border: 1px solid #793E8F; font-size: 12px; color: #5D2E7E;}
    footer > div a:hover{background-color: #793E8F; color: #ffffff;}
    footer > div h2{width: 100%; max-width: 150px; margin-bottom: 20px;}
    footer > div address{margin-bottom: 30px;}
    footer > div address p{font-size: 13px; line-height: 18px; color: #727272;}
    footer > div address p:nth-of-type(3){margin-bottom: 10px;}
    footer > div address p:first-child{font-weight: 600;}
    footer > div address span{font-size: 12px; color: #B2B2B2;}
    
}
    
    
@media screen and (min-width:768px) and (max-width:1279px){
     
    header{width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; padding: 20px; display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; background-color: rgba(255, 255, 255, 0.8);}
    header h1{margin: 0 auto 30px;} 
    header h1 a{display: block;}
    header h1 a img{width: 100%; max-width: 230px;}
    header nav{width: 100%;}
    header nav ul{display: flex; justify-content: space-between; flex-wrap: wrap;}
    header nav ul li{color: #333333; font-size: 18px; line-height: 26px; text-align: center;} 
    header nav ul li a{display: inline-block;}
    header nav ul li a:hover{color: #5D2E7E; font-weight: 600;}



    footer{width: 100%; background-color: #FBFBFB; position: relative; padding: 100px 0;}
    footer > a{display: block; position: absolute; top: -35px; right: 5%; text-indent: -9999;}
    footer > div{width: 92.91%; margin: 0 auto;}
    footer > div a{display: inline-block; background-color: #FCF5FF; padding: 10px 30px; border: 1px solid #793E8F; font-size: 16px; color: #5D2E7E;}
    footer > div a:hover{background-color: #793E8F; color: #ffffff;}
    footer > div h2{width: 100%; max-width: 300px; margin-bottom: 20px;}
    footer > div address{margin-bottom: 30px;}
    footer > div address p{font-size: 16px; line-height: 24px; color: #727272;}
    footer > div address p:nth-of-type(3){margin-bottom: 10px;}
    footer > div address p:first-child{font-weight: 600;}
    footer > div address span{font-size: 14px; color: #B2B2B2;}

}
    
    
@media screen and (min-width: 1280px){

    header{width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; padding: 20px 130px; display: flex; justify-content: space-between; align-items: center; background-color: rgba(255, 255, 255, 0.8);}
    header h1{margin-right: 20px;}
    header h1 a{display: block;}
    header h1 a img{width: 100%; max-width: 230px;}
    header nav{width: 100%;}
    header nav ul{display: flex; justify-content: flex-end; flex-wrap: wrap;}
    header nav ul li{color: #333333; font-size: 18px; line-height: 26px; text-align: right;}
    header nav ul li:not(:first-child){margin-left: 50px;} 
    header nav ul li a{display: inline-block;}
    header nav ul li a:hover{color: #5D2E7E; font-weight: 600;}




    footer{width: 100%; background-color: #FBFBFB; position: relative; padding: 100px 0;}
    footer > a{display: block; position: absolute; top: -35px; right: 5%; text-indent: -9999;}
    footer > div{width: 86.45%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: center; position: relative;}
    footer > div a{position: absolute; top: 50%; right: 0; transform: translateY(-50%); background-color: #FCF5FF; padding: 10px 30px; border: 1px solid #793E8F; font-size: 16px; color: #5D2E7E;}
    footer > div a:hover{background-color: #793E8F; color: #ffffff;}
    footer > div h2{width: 100%; max-width: 300px; margin-right: 50px;}
    footer > div address p{font-size: 16px; line-height: 24px; color: #727272;}
    footer > div address p:nth-of-type(3){margin-bottom: 10px;}
    footer > div address p:first-child{font-weight: 600;}
    footer > div address span{font-size: 14px; color: #B2B2B2;}







}