@charset "utf-8";
@import url("font/pretendard-gov.css");
@import url("font/NanumgarMaes/stylesheet.css");
@font-face {
    font-family: 'NanumPen';
    src: url('font/nanumpen/NanumPen.woff2') format('woff2'),
    url('font/nanumpen/NanumPen.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* reset */
:root{
    --main-color-1:#4A775F;
    --main-color-2:#e9a5b4;
    --main-color-3:#3d4c78;
    --main-color-4:#2F4F7F;
    --main-color-5:#A67B5B;
    --main-color-6:#D9D9D9;
    --main-color-7:#FDFCF7;
    --font-color-1:#575757;
    --font-color-2:#2a2a2a;
    --max-width:1380px;
    --ui-width:calc(100% - 60px);
}
html{
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
}
html, body{
    position: relative;
    width: 100%;
    height: 100%;
    line-height: 1.5;
    font-weight: 400;
    color: #575757;
    font-family:  "Pretendard GOV",'NanumPen' , sans-serif;
}

body,p,div,span,strong,em,i,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select,figure,pre,a,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0; padding:0; box-sizing:border-box;}
::selection{background:#abdcf2; color:#222;}
body,input,textarea,button,select,table,pre{font-family:  "Pretendard GOV"; color:#575757; letter-spacing:-0.75px;}
img, fieldset, button{border:0;}
textarea{overflow:auto;}
input[type=submit]{cursor:pointer;}
input[type=button],
button{cursor:pointer; border-radius:0;}
img{vertical-align:middle; max-width: 100%;}
address, em, i{font-style:normal;}
pre{white-space:pre-wrap;}
table{border-spacing:0; border-collapse:collapse;}
table,th,td{border:none;}
caption{overflow:hidden; line-height:0; text-indent:-2000em;}
legend, .hidden{position:absolute!important; clip:rect(0, 0, 0, 0); width:1px; height:1px; margin:-1px; overflow:hidden;}

/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
/* mobile */
body {-webkit-text-size-adjust:none;} /* 뷰표트 변환시 폰트크기 자동확대 방지 */
input[type='text'],input[type='password'],input[type='submit'],input[type='search'] {-webkit-appearance:none;}
/*input:checked[type='checkbox'] {background-color:#666; -webkit-appearance:checkbox}*/
button,input[type='button'],input[type='submit'],input[type='reset'],input[type='file'] {-webkit-appearance:button;}
input[type='search']::-webkit-search-cancel-button {-webkit-appearance:none}

input[type='text'],input[type='password'],input[type='submit'],input[type='search'],
input[type='checkbox'],input[type='radio'],
button,input[type="button"],input[type="reset"],input[type='file'] {
    -webkit-appearance: none;-moz-appearance: none;appearance: none;border-radius: 0;background-clip: padding-box;outline: 0;cursor: pointer;
}

/* 링크 기본값 */
a{color:inherit; } /* 아이폰에서 전화 링크시 폰트컬러 변경 방지 */
a:link{text-decoration:none; /*color:inherit;*/}
a:visited{text-decoration:none; color:inherit;}
a:hover{text-decoration:none; /*color:inherit;*/}
a:active{text-decoration:none;}
a:focus{text-decoration:none;}

a[href^="tel"]{color:inherit;}

/*선택시 테두리제거*/
img:focus,
img:active,
img:hover {
    outline: none;
    box-shadow: none;
}
select:focus,
select:active,
select:hover {
    outline: none;
    box-shadow: none;
}
input:focus,
input:active,
input:hover {
    outline: none;
    box-shadow: none;
}
/* 원하는 포커스 색 */
/*button:focus,*/
input[type="radio"]:focus,
input[type="checkbox"]:focus{
    outline: 2px solid #000;
    outline-offset: 2px;
}


/* 리스트 스타일 제거 */
ul,ol,li{list-style:none;}

p {
    margin-block-start: 0;
    margin-block-end: 0;
}





/**************************************************
	Common
**************************************************/
/* 스프라이트 이미지 */
.sp_ui{display:inline-block; overflow:hidden; color:transparent !important; white-space:nowrap;}
#wrap{position:relative; min-width:300px;min-height: 100%;display: flex;flex-direction: column;}
#skip_nav{position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    width: 100%;
    text-align: center;}
/* Skip Navigation */
#skip_nav a{display:block; position:absolute; top:-40px; left:0; z-index:10; width:100%; height:40px; line-height:40px; text-align:center; font-weight:bold; transition:0.3s; -webkit-transition:0.3s; -moz-transition:0.3s; -o-transition:0.3s;}
#skip_nav a:hover{top:0px; z-index:1000; background:var(--main-color-3); color:#fff;}
#skip_nav a:active{top:0px; z-index:1000; background:var(--main-color-3); color:#fff;}
#skip_nav a:focus{top:0px; z-index:1000; background:var(--main-color-3); color:#fff;}
/**************************************************
	상단 배너
**************************************************/
#topban{position:relative;}
#topban .topbanzone{position:relative; overflow:hidden; height:110px;}
#topban .topbanzone .nav{position:absolute; left:0; bottom:0; right:0; width:100%; max-width:1260px; margin:0 auto;}
#topban .topbanzone .nav .area_ctrl{position:absolute; bottom:40px; right:0;}
#topban .topbanzone .nav .area_ctrl .prev{background-position:-30px 0;}
#topban .topbanzone .nav .area_ctrl .play{display:none; background-position:-110px 0;}
#topban .topbanzone .nav .area_ctrl .pause{display:none; background-position:-70px 0;}
#topban .topbanzone .nav .area_ctrl .next{background-position:-150px 0;}
#topban .topbanzone .nav .area_ctrl .active{display:block;}
#topban .topbanzone .nav .area_close{position:absolute; bottom:10px; right:0; color:#fff;}
#topban .topbanzone .nav .area_close *{float:left;}
#topban .topbanzone .nav .area_close .inp_chk{margin:4px 5px 0 0;}
#topban .topbanzone .item{position:relative; overflow:hidden; height:110px; vertical-align:top;}
#topban .topbanzone .item > .inr{position:absolute; left:50%; transform:translateX(-50%);}
#topban .topbanzone .item a{display:block;}
#topban .topbanzone .item .b_t,
#topban .topbanzone .item .b_m{display:none;}
#topban .topbanzone .item img{max-width:none;}
/**************************************************
	Header
**************************************************/

#header{position:relative; width:100%;  border-bottom:1px solid #d8d8d8;}
.fixed_header #header{position:fixed; top:0; left:0; width:100%; z-index:999999; background:#fff; box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.08);}

/* 헤더 top */
#header .area_top{background: #FFFFFF;background: linear-gradient(90deg, rgb(255 255 255) 0%, rgba(233, 165, 180, 1) 34%, rgba(61, 76, 120, 1) 70%, rgba(61, 76, 120, 1) 100%);background-size: 150%;background-position: center;}
#header .area_top > .inr{display:flex; justify-content:space-between;  margin:0 auto;}
#header .area_top ul{display:flex;}
#header .area_top li a,
#header .area_top .login li.my_name{display:flex; justify-content:center; align-items:center; height:48px; font-size:15px;}
#header .area_top .area_top_l li{border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9;position: relative;}
#header .area_top .area_top_l li.on{border-left:1px solid #d8d8d8;}
#header .area_top .area_top_l li:after{
    content: "";
    position: absolute;
    top: 0;
    right: -20px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 24px 0 24px 20px;
    border-color: transparent #f2f2f3;
    z-index: 3;
}
#header .area_top .area_top_l li.on:after{
    border-color: transparent #ffff;
}


#header .area_top .area_top_l li::before {
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 25px 0 25px 21px;
    border-color: transparent #d9d9d9;
    display: block;
    width: 0;
    z-index: 2;
    right: -21px;
    top: -1px;                           /* 내부 삼각형 뒤로 */
}
#header .area_top .area_top_l li.on::before {
    border-color: transparent #d9d9d9;
}
#header .area_top .area_top_l li.list1{ border-left:none;border-right: 0;}
#header .area_top .area_top_l li a{background:#f2f2f3; padding:0 20px 0 30px; color:#737373; text-align:center; font-size:17px;    border-top: 3px solid #f2f2f3;}
#header .area_top .area_top_l li:hover a,
#header .area_top .area_top_l li:focus a{color:var(--main-color-3); font-weight:700; text-decoration:underline;}
#header .area_top .area_top_l li.on a{position:relative; background:#fff; color:var(--main-color-3); font-weight:700; /*padding:0 30px;*/ border-top:3px solid var(--main-color-3);}
#header .area_top .area_top_l li.on a:after{
    content: '';
    position: absolute;
    border-style: solid;
    border-width: 3px 0 0 3px;
    border-color: transparent var(--main-color-3);
    display: block;
    right: -3px;
    top: -3px;
    z-index: 4;
}
#header .area_top .area_top_r li a{margin:0 0 0 20px;}
#header .area_top .area_top_r li a:hover,
#header .area_top .area_top_r li a:focus{text-decoration:underline;}
#header .area_top .area_top_r li a,
#header .area_top .area_top_r li.my_name{color:#fff;}
#header .area_top .area_top_r li a:before{content:''; display:block; width:17px; height:16px; flex:0 0 auto; margin-right: 7px; }
#header .area_top .area_top_r li.join a:before{background:url(../images/ico_h_join.png) no-repeat center / contain;}
#header .area_top .area_top_r li.login a:before{background:url(../images/ico_h_mem.png) no-repeat center / contain;}
#header .area_top .area_top_r li.mypage a:before{background:url(../images/ico_h_mypage.png) no-repeat center / contain;}
#header .area_top .area_top_r li.logout a:before{background:url(../images/ico_h_logout.png) no-repeat center / contain;}
#header .area_top .area_top_r li.sitemap a:before{background:url(../images/ico_h_sitemap.png) no-repeat center / contain;}
#header .area_top .area_top_r li.board a:before{background:url(../images/ico_board.png) no-repeat center / contain;}

#header .logo_wrap{
    position: relative;
}
/* 헤더 Logo */
#header .area_logo{}
#header .area_logo .logo{height: 109px;width: 23rem;display: flex;align-items: center;position: absolute;left: 0; top: 0;  z-index: 90;}
#header .area_logo .logo img{
    object-fit: contain; object-position: center; width: 100%;height: 100%;
}
#header .area_logo .logo a{display:inline-block;}
#header .area_logo .util_r{position:absolute; right:70px; top:74px; z-index:90;}
#header .area_logo .vqrtxt{color: #e76d00;}
#header .area_logo .vqr{position: absolute; top:9px; left: -20px;}

/* 헤더 남원 링크 */
#header .namwon_area{position:absolute; right:0; top:0;  display:flex; height: 109px;width: 109px;    z-index: 90;}

/* 헤더 GNB */

#header .gnb_wrap{ height:100%; background:#fff; position: relative;}

#header .gnb_wrap > .inner{
    display:flex;
    justify-content:center;
    padding: 0 109px 0 230px;
}
#header .gnb_wrap > .inner:after{
    content:'';
    display:block;
    clear:both;
}
#header .gnb-menu > li{float:left;}
#header .gnb-menu button{
    display: flex;
    justify-content: center;
    align-items: center;

    font-weight: 700;
    font-size: 2.2rem;
    height: 109px;
    line-height: 109px;
    text-align: center;
    white-space: nowrap;
    background-color: #FFFFFF;
    color: var(--font-color-2);
    padding: 0 2rem;
}
#header .gnb-menu .open button{
    color: var(--main-color-3);
}
#header .gnb-menu button:after{
    content: '';
    display: inline-block;
    width: 15px;
    height: 8px;
    margin: 10px 0 0 7px;
    background: url(../images/ico_h_1.png) no-repeat 0 0;
}
#header .gnb-menu button:hover,#header .gnb-menu button:focus{
    color: var(--main-color-3);
}
#header .gnb-menu > li.active > button:after{
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

/* active 상태 시 명확한 표시 */
.gnb-menu > li.active  .gnb-main-trigger,.gnb-menu > li  .gnb-main-trigger:focus {
    color: var(--main-color-3) !important;
}


#header .gnb-menu .gnb-toggle-wrap{
    height: 0;
    display: block;
    position: absolute;
    top: 100%;
    left: -1px;
    right: 0;
    z-index: 31;
    box-sizing: content-box;
    overflow: hidden;
    background: #fff;
    transition: height .4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    border-top: 1px solid #cccccc;
}
#header .sub-wrap{
    position: relative;
    width: 100%;
}
#header .sub-wrap .tit_area{
    float: left;
    position: relative;
    width: 230px;
    height: 200px;
    padding: 23px 0;
    text-align: center;
    color: #FFFFFF;
    background: url(../images/img_h_bg_01.png) no-repeat center / cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
}
#header .sub-wrap .tit_area.tit_area02{
    background: url(../images/img_h_bg_02.png) no-repeat center / cover;
}
#header .sub-wrap .tit_area.tit_area03{
    background: url(../images/img_h_bg_03.png) no-repeat center / cover;
}
#header .sub-wrap .tit_area.tit_area04{
    background: url(../images/img_h_bg_04.png) no-repeat center / cover;
}
#header .sub-wrap .tit_area.tit_area05{
    background: url(../images/img_h_bg_05.png) no-repeat center / cover;
}
#header .sub-wrap .tit_area.tit_area06{
    background: url(../images/img_h_bg_06.png) no-repeat center / cover;
}
#header .sub-wrap .gnb-sub-list {
    float: right;
    width: calc(100% - 230px);
    margin: 0 auto;
    padding: 10px 0 40px 9rem;
}
#header .sub-wrap .tit_area:before {
    content: "";
    display: inline-block;
    width: 65px;
    height: 66px;
    background: url(../images/img_h_l_01.png) no-repeat center / contain;
}
#header .sub-wrap .tit_area.tit_area02:before {
    background: url(../images/img_h_l_02.png) no-repeat center / contain;
}
#header .sub-wrap .tit_area.tit_area03:before {
    background: url(../images/img_h_l_03.png) no-repeat center / contain;
}
#header .sub-wrap .tit_area.tit_area04:before {
    background: url(../images/img_h_l_04.png) no-repeat center / contain;
}
#header .sub-wrap .tit_area.tit_area05:before {
    background: url(../images/img_h_l_05.png) no-repeat center / contain;
}
#header .sub-wrap .tit_area.tit_area06:before {
    background: url(../images/img_h_l_06.png) no-repeat center / contain;
}
.tit_area .tit{
    font-size: 2.4rem;
    font-weight: 800;
    padding: 1rem 0;
}
.tit_area .txt{
    font-size: 1.6rem;
    font-weight: 500;
}
#header.open .gnb-menu li.open .gnb-toggle-wrap{
    display: flex;
    align-items: flex-start;
    visibility:visible; z-index:32;
    width: 100%;
    border-bottom:1px solid #cccccc;
}
#header.open .sub_bg{
    position: absolute;
    content: '';
    width: 100%;
    top: 100%;
    left: 0;
    background-color: #FFFFFF;
    z-index: 30;
    border-top: 1px solid #cccccc;

}
#header.open .sub_bg,#header.open .gnb-menu .gnb-toggle-wrap{
    height: 200px;
}
#header .gnb-menu .gnb-sub-list ul {
    gap: 3.3rem 7.6rem;
    padding-top: 3rem;
    max-width: 700px;
}
@supports (display:grid) {
    #header .gnb-menu .gnb-sub-list ul {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
}
@supports not (display:grid) {
    #header .gnb-menu .gnb-sub-list ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
    }
    #header .gnb-menu .gnb-sub-list li{
        width: calc(100% / 3  - 7.6rem);
    }
}
#header .gnb-menu .gnb-sub-list li{
    font-size: 2rem;
    font-weight: 500;
    color: var(--font-color-2);
    border-bottom: 1px solid #dcdcdc;



}


#header .gnb-menu .gnb-sub-list li a{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    padding: 0.5rem 3rem 0.5rem 0;
}
#header .gnb-menu .gnb-sub-list li a:after{
    position: absolute;
    content: '';
    display: block;
    background:url("../images/ico_header_blank.png") no-repeat center/ contain ;
    width: 2rem;
    height: 2rem;
    right: 0;
    bottom: 1rem;
}
#header .gnb-menu .gnb-sub-list li a:hover,#header .gnb-menu .gnb-sub-list li a:focus,#header .gnb-menu .gnb-sub-list li a:focus-visible {
    /*color: #e9a5b4;
    font-weight: 700;
    cursor: url('../images/active_point.png') 1 1, pointer;*/
    color: var(--main-color-3);
    font-weight: 700;
}
#header .gnb-menu .gnb-sub-list li a:hover::after,
#header .gnb-menu .gnb-sub-list li a:focus::after,
#header .gnb-menu .gnb-sub-list li a:focus-visible::after {
    background-image: url("../images/ico_header_blank_on.png");
}
/*#header .gnb-menu > li > a{display:flex; justify-content:center; align-items:center; position:relative; font-weight:700; font-size:2.2rem; height:109px; line-height:109px; text-align:center; white-space:nowrap;}
#header .gnb-menu > li > a:after{content:''; display:inline-block; width:15px; height:8px; margin:10px 0 0 7px; background:url(../images/ico_h_1.png) no-repeat 0 0;}
#header .gnb-menu > li.open > a:after{-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
#header .gnb-menu > li > a > span{display:block; position:relative;}
#header .gnb-menu > li:hover > a > span{color:var(--main-color-2);}
#header .gnb-menu > li:hover > a > span:after{content:""; display:block; position:absolute; left:-25px; top:36px; width:23px; height:20px; background:url(../images/common/ico_gnb_over.png);}

header .gnb-menu > li.open > div{display:block; visibility:visible; z-index:32;}

#header .gnb-menu a{display:block; word-break:keep-all; word-wrap:break-word;}
#header .gnb-menu > li{float:left; padding:0 2rem;}
#header .gnb-menu > li > a{display:flex; justify-content:center; align-items:center; position:relative; font-weight:700; font-size:2.2rem; height:109px; line-height:109px; text-align:center; white-space:nowrap;}
#header .gnb-menu > li > a:after{content:''; display:inline-block; width:15px; height:8px; margin:10px 0 0 7px; background:url(../images/ico_h_1.png) no-repeat 0 0;}
#header .gnb-menu > li.open > a:after{-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
#header .gnb-menu > li > a > span{display:block; position:relative;}
#header .gnb-menu > li:hover > a > span{color:var(--main-color-2);}
#header .gnb-menu > li:hover > a > span:after{content:""; display:block; position:absolute; left:-25px; top:36px; width:23px; height:20px; background:url(../images/common/ico_gnb_over.png);}
/*depth2*/

/* 2차 */
/*#header .gnb-menu > li > div{display:none; visibility:hidden; position:absolute; top:100%; left:-1px; right:0; z-index:31; box-sizing:content-box; overflow:hidden;  background:#fff; transition:height .4s cubic-bezier(0.25, 0.46, 0.45, 0.94); box-shadow:0px 5px 5px 0px rgba(0,0,0,0.1); border-top:1px solid #d8d8d8;}
#header .gnb-menu > li.open > div{display:block; visibility:visible; z-index:32;}
#header .gnb-menu > li > div > .inr{position:relative; max-width:1500px; margin:0 auto;}
#header .gnb-menu > li > div > .inr:after{content:''; display:block; clear:both;}
#header .gnb-menu > li > div > .inr .tit_area{float:left; position:relative; width:360px; padding:45px 0; text-align:center;}
#header .gnb-menu > li > div > .inr .tit_area:before{content:""; display:inline-block; width:110px; height:110px; background:url(../images/common/img_header_left01.png);}
#header .gnb-menu > li > div > .inr .tit_area.tit_area02:before{background:url(../images/common/img_header_left02.png);}
#header .gnb-menu > li > div > .inr .tit_area.tit_area03:before{background:url(../images/common/img_header_left03.png);}
#header .gnb-menu > li > div > .inr .tit_area.tit_area04:before{background:url(../images/common/img_header_left04.png);}
#header .gnb-menu > li > div > .inr .tit_area.tit_area05:before{background:url(../images/common/img_header_left05.png);}
#header .gnb-menu > li > div > .inr .tit_area .tit{position:relative; font-size:25px; font-weight:700; display:block; padding:10px 0 20px; }
#header .gnb-menu > li > div > .inr .tit_area .txt{font-size:15px; line-height:1.6; font-family:'맑은 고딕';}
#header .gnb-menu > li > div > .inr .tit_area .img{width:304px; height:247px; display:block; margin:30px 0 20px -30px;} 
#header .gnb-menu > li > div > .inr .tit_area + a{display:none;}
#header .gnb-menu > li > div > .inr .tit_area + a + div{float:right; width:calc(100% - 360px); padding:10px 0 40px;}

#header .gnb-menu > li > div > .inr > div > ul{display:flex; flex-wrap:wrap;}
#header .gnb-menu > li > div > .inr > div > ul > li{width:calc(25% - 34px); margin:30px 45px 30px 0;}
#header .gnb-menu > li > div > .inr > div > ul > li:nth-child(4n){margin-right:0;}
#header .gnb-menu > li > div > .inr > div > ul > li > a{position:relative; display:block; font-size:19px; font-weight:500; border-bottom:1px solid #c6c6c6; padding:0 0 10px 0;}
#header .gnb-menu > li > div > .inr > div > ul > li:hover > a{color:var(--main-color-2);}
#header .gnb-menu > li > div > .inr > div > ul > li a[target="_blank"]:after{content:""; display:block; position:absolute; right:0; top:4px; width:15px; height:15px; background:url(../images/ico_header_blank.png);}
#header .gnb-menu > li > div > .inr > div > ul > li:hover > a[target="_blank"]:after{background:url(../images/common/ico_header_blank2.png);}*/
/* 3차 */
/*#header .gnb-menu > li > div > .inr > div > ul > li > ul{position:relative; margin:15px 0 0 0;}
#header .gnb-menu > li > div > .inr > div > ul > li > ul:before{position:absolute; right:5px; top:-47px; content:""; width:7px; height:7px; border-top:2px solid #8e8e8e; border-right:2px solid #8e8e8e; transform:rotate(135deg);}
#header .gnb-menu > li > div > .inr > div > ul > li > ul > li{position:relative; padding:0 0 8px 15px;}
#header .gnb-menu > li > div > .inr > div > ul > li > ul > li:before{content:""; display:block; position:absolute; left:5px; top:9px; width:4px; height:4px; background:#717171;}
#header .gnb-menu > li > div > .inr > div > ul > li > ul > li:hover a{color:var(--main-color-2); text-decoration:underline;}
#header .gnb-menu > li > div > .inr > div > ul > li > ul > li:hover > a[target="_blank"]:after{background:url(../images/common/ico_header_blank3.png);}
#header .gnb-menu > li > div > .inr > div > ul > li > ul > li > a{display:inline-block; position:relative; padding:0 26px 0 0; font-size:17px;}*/
/* 4차 */
/*#header .gnb-menu > li > div > .inr > ul > li > ul ul{display:none;}*/

/* 전체메뉴 */
#header .sitemap_wrap{display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:100; background:#fff;}
/*#header .sitemap_wrap.open{display:block;}
body.fixed_sitemap{overflow:hidden; width:100%; height:100%;}
#header .sitemap_wrap .stm_header{position:relative;}
#header .sitemap_wrap .stm_header > .inr{display:block; height:116px; margin:0 75px; border-bottom:1px solid #ddd;}
#header .sitemap_wrap .stm_header .stm_logo{padding:45px 0 0; font-size:38px; line-height:1.2; font-weight:700;}
#header .sitemap_wrap .stm_header .btn_close{position:absolute; top:0; right:0; width:72px; height:72px; overflow:hidden; background:var(--main-color-3)  no-repeat 50% 50%; color:transparent;}
#header .sitemap_wrap .stm_container{height:calc(100vh - 117px); overflow:hidden; overflow-y:auto;}
#header .sitemap_wrap .stm_container > .inr{margin:0 75px; padding:0 0 50px;}
#header .sitemap_wrap .stm_container .stm_lst{display:flex; justify-content:space-between;}
#header .sitemap_wrap .stm_container .stm_lst > li{flex:1; margin-left:42px;}
#header .sitemap_wrap .stm_container .stm_lst > li > a {height: auto;}
#header .sitemap_wrap .stm_container .stm_lst > li:first-child{margin-left:0;}
#header .sitemap_wrap .stm_container .stm_lst > li > a span{display:block; margin:46px 0 0; padding:0 0 20px; color:var(--main-color-3); border-bottom:2px solid var(--main-color-3); font-size:24px; line-height:1.2; font-weight:700;}
#header .sitemap_wrap .depth2{}
#header .sitemap_wrap .depth2 a{display:block; position:relative; line-height:1.2;}
#header .sitemap_wrap .depth2 a.parent:after{display:none;}

#header .sitemap_wrap .depth2 > ul > li{border-bottom:1px solid #cbcbcb;}
#header .sitemap_wrap .depth2 > ul > li.open{}
#header .sitemap_wrap .depth2 > ul > li > a{padding:17px 10px 17px 0; font-size:16px;}
#header .sitemap_wrap .depth2 > ul > li > a.on{color:var(--main-color-3); font-weight:700;}
#header .sitemap_wrap .depth2 > ul > li > a:hover{text-decoration:underline;}

#header .sitemap_wrap .depth2 > ul > li > ul{display:none; padding:5px 19px; border-top:1px solid #cbcbcb; background:#f1f1f1;}
#header .sitemap_wrap .depth2 > ul > li.open > ul{display:block;}
#header .sitemap_wrap .depth2 > ul > li > ul > li{}
#header .sitemap_wrap .depth2 > ul > li > ul > li > a{padding:7px 0 6px 10px; font-size:15px;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > a:before{content:''; display:inline-block; box-sizing:border-box; position:absolute; top:15px; left:0px; width:2px; height:2px; background:#383838;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > a.on{color:var(--main-color-3); text-decoration:underline;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > a.on:before{background:var(--main-color-3);}
#header .sitemap_wrap .depth2 > ul > li > ul > li > a:hover{text-decoration:underline;}
#header .sitemap_wrap .depth2 > ul > li > ul > li a .unfd{display:none;}

#header .sitemap_wrap .depth2 > ul > li > ul > li > ul{margin:0 0 0 5px; padding:5px 7px; background:#f1f1f1;}
#header .sitemap_wrap .depth2 > ul > li > ul > li.open > ul{display:block;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > ul > li > a{padding:6px 0 5px 10px; font-size:15px;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > ul > li > a:before{content:''; display:inline-block; box-sizing:border-box; position:absolute; top:14px; left:0; width:5px; border-bottom:1px solid #666;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > ul > li a.on{color:var(--main-color-3); text-decoration:underline;}
#header .sitemap_wrap .depth2 > ul > li > ul > li > ul > li a.on:before{border-color:var(--main-color-3);}
*/

/* 모바일 전체메뉴 */
.m_gnb_wrap{display:none;}
/* 모바일 검색 */
.wv_srch_wrap{display:none;}


/**************************************************
	Footer
**************************************************/

#footer{background-color: #f5f5f5;position: relative;z-index: 50;}
#footer .inr{max-width: 1400px; margin: 0 auto;display: flex; justify-content: space-between; align-items: center;}
.footer_top .inr .f_menu{display: flex;justify-content: flex-start; align-items: center;gap: 5rem;}
.footer_top .inr .f_menu a{ color: var(--font-color-1);font-size: 16px;}
.footer_top .inr .f_menu .privacy a{ color: var(--main-color-3);font-weight: 800	;}
.footer_top .inr .f_menu li{position: relative;}
.footer_top .inr .f_menu li::after{
    content: '';
    display: block;
    position: absolute;
    right: -2.5rem;
    top: 50%;
    width: 1px;
    height: 18px;
    margin-top: -9px;
    background: #bebebe;}
.footer_top .inr .f_menu li:last-child:after{display: none;}
.footer_btm{border-top: 1px solid #bebebe;}
.footer_btm .inr{padding-top: 3.3rem;    padding-bottom: 5rem;}
.footer_btm .area_addr, .footer_btm .addr{display: flex;flex-direction: column; gap: 2.3rem; font-weight: 500;    font-size: 1.6rem;}
.footer_btm .area_addr .logo{
    width: 233px;
    height: 67px;
}
.footer_btm .right{display: flex; justify-content: flex-end; gap: 6.6rem;align-items: center;}
.footer_btm .chat{display: flex; align-items: center; gap: 1.4rem; padding: 0.6rem 1.9rem; border: 1px solid #898989; border-radius: 1rem;font-size: 2rem;
    font-weight: 600;
    background-color: #fff;
    color: #2a2a2a;}
#footer .selbox{height: 7.8rem;}
.custom-select {
    width: 189px;
    height: 78px;
    background-color: #e2e2e2;
    background-image: url('../images/ico_sel_btn.png');
    background-repeat: no-repeat;
    background-position: 95% center;
    background-size: 1.6rem 1rem;
    padding: 0 4rem 0 1.2rem;
    border: none;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
}
.footer_btm .right p{line-height: 1;font-size: 16px;}

#footer .tel{
    font-size: 4.2rem;
    font-weight: 700;
    color: var(--main-color-3);
    line-height: 1;
    padding: 1.2rem 0 2.8rem;
}


/*애니메이션효과*/
.fade-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-up.active {
    opacity: 1;
    transform: translateY(0);
}

/* 개별 딜레이/속도 */
.duration-500 { transition-duration: 0.5s; }
.duration-1000 { transition-duration: 1s; }

.delay-100 { transition-delay: 0.1s; }
.delay-300 { transition-delay: 0.3s; }
.delay-600 { transition-delay: 0.6s; }
.delay-900 { transition-delay: 0.9s; }
.delay-1000 { transition-delay: 1s; }
.delay-1200 { transition-delay: 1.2s; }


/**************************************************
	container
**************************************************/
#container {
    flex: 1;
}
.in_cover{
    max-width: var(--max-width);
    /*width: 100%;
    padding-left:3rem;
    padding-right:3rem;*/
    width: var(--ui-width) !important;
    margin: 0 auto;
}

.p_txt1{color:var(--main-color-1) !important;}
.p_txt2{color:var(--main-color-2) !important;}
.p_txt3{color:var(--main-color-3) !important;}
.p_txt4{color:var(--main-color-4) !important;}
.p_txt5{color:var(--main-color-5) !important;}
.p_txt6{color:var(--main-color-6) !important;}
.p_txt7{color:var(--main-color-7) !important;}
.p_txt8{color: #4466cd;}
li a{
    display: block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}
/*버튼정리*/
.btn_bg1{
    background-color: var(--main-color-1);
    color: #FFFFFF	;
}
.inr_f{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
::placeholder{
    color:#c1c1c1
}
/*모바일일때*/
.mo{
    display: none;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
textarea {
    resize: none; /* 크기 조절 기능 완전히 제거 */
}
select {
    font-size: 2.4rem;
    color: #2a2a2a;
    padding: 0.5rem 6rem 0.5rem 1.5rem;
    border: 1px solid #d2d2d2;
    border-radius: 0;
    background-color: #fff;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    background-image: url("../images/sel_btn.png");
    background-repeat: no-repeat;
    background-position: right 1.1rem center;
    background-size: 1.9rem;
}


/* IE 전용 화살표 제거 */
select::-ms-expand {
    display: none;
}

/* 포커스 스타일 (접근성) */
select:focus {
    outline: 2px solid #000000; /* WCAG 대비 충분한 파란색 */
    outline-offset: 2px;
}

/*타이틀 글자크기*/
h1{font-size: 4rem;}
h2{font-size: 4rem;}
h3{font-size: 3.6rem;}
h4{font-size: 3.2rem;font-weight: 700;}
h5{font-size: 2.4rem;font-weight: 700;}
h6{font-size: 2.4rem;font-weight: 700;}

/*설명문구 숨김*/
.sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    border: 0;
}

/*로그인처리*/

.area_top_r .my_name,.area_top_r .logout{
    display: none;
}

.area_top_r.login .my_name,.area_top_r.login .logout{
    display: block;
}
.area_top_r.login .login_off{
    display: none;
}
/*헤더 가로사이즈가 좁아질때 2라인으로 표현*/
@media (max-width: 1440px) {
    #header .gnb_wrap > .inner{
        padding: 0;
    }
    #header .gnb_wrap .gnb-menu{
        justify-content: center;
        padding: 109px 0 0;
    }
    #header.open .gnb-menu li.open .gnb-toggle-wrap{
        padding: 0 2.4rem;
    }


}
@media (max-width: 1200px) {
    html {
        font-size: 56.25%; /* 9px */
    }
    #header .gnb-menu > li > a {
        height: 60px;
        line-height: 60px;
    }
    /*.inr_f{
        flex-direction: column;
    }
    .inr_f > div{
        width: 100% !important;
    }*/

}

@media (max-width: 1024px) {
    html {
        font-size: 50%; /* 8px */
    }
    .mo{
        display: block;      /* 숨김 해제 */
        position: static;    /* 절대 위치 제거 */
        width: auto;         /* 너비 원래대로 */
        height: auto;        /* 높이 원래대로 */
        padding: initial;
        margin: initial;
        overflow: visible;
        clip: auto;
        white-space: normal;
        border: initial;
    }
    .pc{
        /*display: none ;*/
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    br.pc{
        display: none;
    }
    /*타이틀 글자크기*/
    h1{font-size: 4.6rem;}
    h2{font-size: 4.6rem;}
    h3{font-size: 4.2rem;}
    h4{font-size: 3.8rem;font-weight: 700;}
    h5{font-size: 3rem;font-weight: 700;}

    #header .area_top .area_top_l li.list1 a{
        padding: 0 10px
    }
    #header .area_top .area_top_l li a {
        padding: 0 0 0 25px;
        font-size: 16px;
    }
    #header .gnb_wrap > .inner {
        padding: 0;
        justify-content: space-between;
    }
    #header .logo_wrap{
        position: unset;
    }
    #header .area_logo .logo {
        position: initial;
        height: 100px;
        width: 233px;
    }
    #header .gnb_wrap .gnb-menu {
        padding: 0;
    }
    #header .namwon_area,#header .gnb-menu{
        display: none;
    }
    #header .area_top .area_top_r li {
        position: absolute;
        right: 9rem;
        top: 50px;
        height: 100px;
        justify-content: flex-end;
        align-items: center;
    }
    #header .area_top .area_top_r li.my_name {
        top: 0;
        height: 49px;
        right: 20px;
        font-size: 20px;
    }
    #header .area_top .area_top_r li.login {
        /*right: 28rem;*/
        right: 230px;
    }
    #header .area_top .area_top_r li.join,#header .area_top .area_top_r li.logout {
        /*right: 20rem;*/
        right: 165px;
    }
    #header .area_top .area_top_r li.board {
        /*right: 10rem;*/
        right: 80px;
    }
    /*#header .area_top .area_top_r li{
        margin-right: 3rem;
    }*/
    #header .area_top .area_top_r li a, #header .area_top .area_top_r li .my_name {
        color: var(--font-color-2);
        font-size: 2rem;
        font-weight: 600;
    }
    #header .area_top .area_top_r li a{
        flex-direction: column;
        margin: 0;
        height: 100px;
    }
    #header .m_gnb_wrap .m_menu{
        position: absolute;
        top: 0;
        right: 0;
        overflow: hidden;


    }
    #header .area_top .area_top_r li a:before,#header .m_gnb_wrap .m_menu .sp_ui:before{
        width: 40px;
        height: 40px;
        margin: 0;
    }
    #header .m_gnb_wrap .m_menu{
        background-color: transparent;
    }
    #header .m_gnb_wrap .m_menu .sp_ui,#header .area_top .area_top_r li a{
        color: var(--font-color-2) !important;
        font-size: 16px;
        font-weight: 600;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100px;
        line-height: 1.5;
        gap:10px;

    }

    #header .area_top .area_top_r li.join a:before{background:url(../images/ico_join_m.png) no-repeat center / contain;}
    #header .area_top .area_top_r li.login a:before{background:url(../images/ico_login_m.png) no-repeat center / contain;}
    #header .area_top .area_top_r li.mypage a:before{background:url(../images/ico_join_m.png) no-repeat center / contain;}
    #header .area_top .area_top_r li.logout a:before{background:url(../images/ico_login_m.png) no-repeat center / contain;}
    #header .area_top .area_top_r li.sitemap a:before{background:url(../images/ico_globe_m.png) no-repeat center / contain;}
    #header .area_top .area_top_r li.board a:before{background:url(../images/ico_board_m.png) no-repeat center / contain;}
    #header .m_gnb_wrap .m_menu .sp_ui:before{content: ""; display: block;background:url(../images/ico_menu_m.png) no-repeat center / contain;}
    #header .m_gnb_wrap {
        display: block;
        position: absolute;
        top: 50px;
        right: 20px;
        z-index: 999999;
    }
    #header .m_gnb_wrap .dim_wv { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:998; }
    #header .m_gnb_wrap .dim_wv[hidden] { display:none !important; }
    #header .m_gnb_wrap .m_gnb { position:fixed; top:0; right:-100%; height:100dvh; width:420px; background:#fff; z-index:999; display:flex; flex-direction:column; transition:right .3s ease; overflow:hidden; }
    #header .m_gnb_wrap .m_gnb.active { right:0; }
    #header .m_gnb_wrap .head {

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        border-bottom: 6px solid #c1c1c1;
        background: #f3f3f3;
    }
    #header .m_gnb_wrap .head > div {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 10rem;
        width: 100%;
        padding: 0 3.2rem;
    }
    #header .m_gnb_wrap .head > div:last-child {
        background: #FFFFFF;
    }
    #header .m_gnb_wrap .btnhome,#header .m_gnb_wrap .my_name {
        color: var(--font-color-1);
        font-size: 2.6rem;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 1rem;
    }
    #header .m_gnb_wrap .my_name {
        margin: 0 5% 0 auto;
    }
    #header .m_gnb_wrap .btnhome .home_btn{
        width: 37px;
        height: 37px;
        overflow: hidden;
        background: url(../images/m_home_btn.png) no-repeat center / contain;
        color: transparent;
    }

    #header .m_gnb_wrap .m_close_btn {
        position: relative;
        width: 30px;
        height: 30px;
        overflow: hidden;
        background: none;
        color: transparent;
    }
    #header .m_gnb_wrap .m_close_btn:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 17px;
        height: 17px;
        margin: auto;
        background: url(../images/m_close_btn.png) no-repeat center / contain;
    }
    #header .m_gnb_wrap .btnlogin,#header .m_gnb_wrap .btnjoin,
    #header .m_gnb_wrap .btnlogout,#header .m_gnb_wrap .btnmypage{
        background-color: #FFFFFF;
        border: 1px solid #898989;
        font-size: 2.4rem;
        color: var(--font-color-2);
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 1rem;
        width: 49%;
        padding: 5px 10px;
        border-radius: 23px;
    }
    #header .m_gnb_wrap .btnlogin span,#header .m_gnb_wrap .btnjoin span,
    #header .m_gnb_wrap .btnlogout span,#header .m_gnb_wrap .btnmypage span{
        position: relative;
        background: none;
        width: 20px;
        height: 20px;
    }
    #header .m_gnb_wrap .btnlogin span:before,#header .m_gnb_wrap .btnjoin span:before,
    #header .m_gnb_wrap .btnlogout span:before,#header .m_gnb_wrap .btnmypage span:before{
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        margin: auto;
        width: 19px;
        height: 19px;
    }
    #header .m_gnb_wrap .btnlogin span:before{
        background: url(../images/m_login_btn.png) no-repeat center / contain;
    }
    #header .m_gnb_wrap .btnjoin span:before{
        background: url(../images/m_join_btn.png) no-repeat center / contain;
    }
    #header .m_gnb_wrap .btnlogout span:before{
        background: url(../images/m_logout_btn.png) no-repeat center / contain;
    }
    #header .m_gnb_wrap .btnmypage span:before{
        background: url(../images/m_mypage_btn.png) no-repeat center / contain;
    }
    #header .m_gnb_wrap .nav_wrap { display:flex; flex:1; overflow:hidden; line-height: 1;}
    #header .m_gnb_wrap .menu { width:30%;  overflow-y:auto; background:var(--main-color-3); }
    #header .m_gnb_wrap .menu ul { list-style:none; margin:0; padding:0; }
    #header .m_gnb_wrap .menu li button {
        display: block;
        padding: 4.3rem 0.5rem;
        border-bottom: 2px solid #363636;
        color: #FFFFFF;
        font-size: 3rem;
        font-weight: 700;
        background: var(--main-color-3);
        width: 100%;
        height: 100%;
    }
    #header .m_gnb_wrap .menu li.active > button {
        background: #FFFFFF;
        color: var(--main-color-3);
    }
    #header .m_gnb_wrap .submenu { flex:1; overflow-y:auto;width: 70%;}
    #header .m_gnb_wrap .submenu ul {
        list-style: none;
        margin: 0;

        display: flex;
        flex-direction: column;
        gap: 3rem;
    }
    #header .m_gnb_wrap .submenu ul > li > ul {
        padding: 3.5rem 0;
    }
    #header .m_gnb_wrap .submenu >  ul > li { padding: 0 3.2rem 1rem;border-bottom: 2px solid #c1c1c1; }
    #header .m_gnb_wrap .submenu li h2 {
        color: var(--font-color-2);
        font-size: 3.2rem;
        font-weight: 700;
        padding: 4.5rem 0;
        border-bottom: 2px solid #c1c1c1;
    }
    #header .m_gnb_wrap .submenu li ul li a {
        display: block;
        padding: 0;
        color: var(--font-color-2);
        font-size: 2.8rem;
        font-weight: 500;
    }
    #header .m_gnb_wrap .m_gnb{width:70%;}
    body.is-locked { overflow:hidden; }
    .footer_top .inr .f_menu {
        justify-content: normal;
        font-size: 3rem;
        padding: 38px 0;
        width: 100%;
        gap: 0;
        flex-wrap: wrap;
    }
    .footer_top .inr .f_menu li {
        padding: 0 3%;
    }
    .custom-select{
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    .footer_top .inr .f_menu a {
        font-size: 3rem;
        text-align: center;
    }
    .footer_btm .right {
        flex-direction: row-reverse;
        width: 100%;
        justify-content: space-between;
        gap: 1rem;
    }
    .footer_btm .right span{
        font-weight: 700;
    }
    .footer_btm .inr{
        flex-direction: column;
        align-items: flex-start !important;
        gap: 31px;
    }
    .footer_btm .addr{
        position: absolute;
        top: 100%;
        left: 0;
        padding: 0 30px;
        width: 100%;
        font-size: 3rem;
        gap: 0;
        background-color: #f5f5f5;
    }
    .footer_top .inr .f_menu li::after {
        right: 0;
    }
    .footer_btm .right p {
        font-size: 3rem;
    }
    .in_cover {
        max-width: var(--max-width);
        width: calc(100% - 40px) !important;
        margin: 0 auto;
    }

}
@media (max-width: 768px) {
    #header .m_gnb_wrap .m_menu .sp_ui, #header .area_top .area_top_r li a {
        font-size: 15px;
    }
    #header .area_top .area_top_r li a:before, #header .m_gnb_wrap .m_menu .sp_ui:before {
        width: 35px;
        height: 35px;
    }
    /*#header .area_top .area_top_r li{
        margin-right: 2rem;
    }*/
}
@media (max-width: 650px) {
    #header .m_gnb_wrap .m_menu .sp_ui, #header .area_top .area_top_r li a {
        font-size: 14px;
    }
    #header .area_top .area_top_r li.board {
        right: 75px;
    }
    #header .area_top .area_top_r li.join, #header .area_top .area_top_r li.logout {
        right: 150px;
    }
    #header .area_top .area_top_r li.login {
        right: 205px;
    }
}
@media (max-width: 550px) {
    html {
        font-size: 43.75%; /* 7px */
    }
    .in_cover {
        width: calc(100% - 20px) !important;
    }
    #header .m_gnb_wrap {
        right: 15px;
    }
    #header .area_top .area_top_l li a {
        padding: 0 0 0 20px;
        font-size: 14px;
    }
    #header .area_top .area_top_l li.list1 a {
        padding: 0 5px;
    }
    #header .area_top .area_top_l li {
        min-width: 40%;
    }
    #header .area_top ul{
        width: 100%;
    }
    #header .area_logo .logo{
        width: 40%;
        max-width: 200px;
    }

    #header .area_top .area_top_r {
        right: 8rem;
        max-width: 40%;
    }
    /*#header .area_top .area_top_r li{
        margin-right: 1rem;
    }*/
    /*#header .area_top .area_top_r li.login {
        right: 25rem;
    }
    #header .area_top .area_top_r li.join,#header .area_top .area_top_r li.logout {
        right: 18rem;
    }
    #header .area_top .area_top_r li.board {
        right: 9rem;
    }
    #header .area_top .area_top_r li a, #header .area_top .area_top_r li .my_name,#header .m_gnb_wrap .m_menu .sp_ui {
        font-size: 1.8rem;
    }
    #header .area_top .area_top_r li a:before,#header .m_gnb_wrap .m_menu .sp_ui:before{
        width: 3.5rem;
        height: 3.5rem;
        margin: 0;
    }*/
    #header .area_top .area_top_r li a:before, #header .m_gnb_wrap .m_menu .sp_ui:before {
        width: 30px;
        height: 30px;
    }
    #header .m_gnb_wrap .m_menu .sp_ui, #header .area_top .area_top_r li a {
        font-size: 13px;
    }
    #header .area_top .area_top_r li.board {
        right: 65px;
    }
    #header .area_top .area_top_r li.join, #header .area_top .area_top_r li.logout {
        right: 135px;
    }
    #header .area_top .area_top_r li.login {
        right: 185px;
    }
    #header .m_gnb_wrap .m_gnb{width:100%;}
    #header .area_top .area_top_r li.my_name{
        right: 20px;
        font-size: 15px;
    }
    #header .area_top .area_top_l li::before{
        right: -16px;
        border-width: 25px 0 25px 16px;
    }
    #header .area_top .area_top_l li:after {
        right: -15px;
        border-width: 24px 0 24px 15px;
    }
    .footer_btm .addr{
        padding: 0 2.4rem;
    }
    /*.in_cover{
        width: calc(100% - 6rem) !important;
    }*/
    .footer_top .inr .f_menu {
        padding: 3rem 0;
    }
    /*.footer_top .inr .f_menu a{
        font-size: 2rem;
    }*/
    .footer_top .inr .f_menu li {
        padding: 0 2%;
    }
    .footer_btm .chat {
        flex-direction: column;
        justify-content: space-between;
    }
}
@media (max-width: 480px) {
    html {
        font-size: 37.5%; /* 6px */
    }

    #header .area_top .area_top_l li a {
        font-size: 13px;
    }
    #header .area_top .area_top_r li a:before, #header .m_gnb_wrap .m_menu .sp_ui:before{
        width: 25px;
        height: 25px;
    }
    #header .area_top .area_top_r li.board {
        right: 50px;
    }
    #header .area_top .area_top_r li.join, #header .area_top .area_top_r li.logout {
        right: 105px;
    }
    #header .area_top .area_top_r li.login {
        right: 145px;
    }
    #header .m_gnb_wrap .m_menu .sp_ui, #header .area_top .area_top_r li a {
        font-size: 11px;
    }
    #header .m_gnb_wrap .menu li a {
        padding: 4.3rem 2.3rem;
    }
    #header .area_top .area_top_r li.my_name {
        right: 15px;
        font-size: 13px;
    }
    #header .m_gnb_wrap {
        right: 10px;
    }
    .footer_btm .area_addr .logo{
        width: 210px;
        height: 60px;
    }
}
@media (max-width: 350px){
    #header .area_top .area_top_r li.board {
        right: 45px;
    }
    #header .area_top .area_top_r li.join, #header .area_top .area_top_r li.logout {
        right: 95px;
    }
    #header .area_top .area_top_r li.login {
        right: 135px;
    }
    #header .m_gnb_wrap .m_menu .sp_ui, #header .area_top .area_top_r li a {
        font-size: 10px;
    }

}