@charset "utf-8";

#wrapper {width: 100%;}

/* header */
header {
justify-content: center;
align-items: center;
z-index: 100;
position: fixed;
top: 20px; left: 0;
width: 100%;
transition: all 0.3s ease;
transform: translateY(0);
}
body.up header {
top: 0;
width: 100%;
background: #fff;
border-bottom: 1px solid #EDEFF3;
}
body.down header {
top: 0;
opacity: 0;
transition: all 1s ease;
transform: translateY(-200%);
}

header .h_group > div:not(.headSearch) {
    display: flex;
    /* flex-direction: row-reverse; */
    align-items: center;
    z-index: 10;
    position: relative;
    width: 100%;
    max-width: 1490px;
    height: 7.8rem;
    margin: 0 auto 0;
    padding: 0 3.2rem 0 4.0rem;
    background: #fff;
}

header.open .h_group {
    margin: 0 auto;
    width: calc(100% - 40px);
    background: #fff;
    height: 712px;
}

body.up header .h_group {
    position: relative;
    z-index: 10;
    width: 100%;
    background: #fff;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

header .h_group * {vertical-align: top;}
header .h_group .logo {
display: block;
position: absolute; 
top: 50%; left: 40px; 
transform: translateY(-50%);
}
header .h_group .logo a {
width: 137px;
height: 48px;
background: url('/magi/assets/images/common/logo.png') no-repeat center center;
font-size: 0;
text-indent: -9999em;
line-height: 0;
}
header .h_group .utill {display: flex; align-items: center; margin: 0 0 0 auto;}
header .h_group .utill button {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
margin: 0 0 0 12px;
background: transparent;
}
header .h_group .utill .allBtnSearch {
background: url('/magi/assets/images/common/btn_search.png') no-repeat center center;
font-size: 0;
text-indent: -9999em;
line-height: 0;
}
header .h_group .utill [class*="login"] {position: relative; width: auto;}
header .h_group .utill [class*="login"] span {
display: none;
width: 40px;
height: 40px;
font-size: 0; 
text-indent: -9999em; 
line-height: 0;
}
header .h_group .utill [class*="login"] em {font-size: 12px; letter-spacing: 0;}
header .h_group .utill .login .in {
display: flex;
background: url('/magi/assets/images/common/ico_login.png') no-repeat center center;
}

header .h_group .utill .login .ico_member {
    display: flex;
    background: url('/magi/assets/images/common/ico_member.png') no-repeat center center;
}

header .h_group .utill .login-out {width: 40px;}
header .h_group .utill .login-out em {display: none;}
header .h_group .utill .login-out .out {
display: flex;
background: url('/magi/assets/images/common/ico_logout.png') no-repeat center center;
}

header .h_group .utill .login-out .btn_login {
    display: flex;
    background: url('/magi/assets/images/common/btn_login.png') no-repeat center center;
}

header .h_group .utill [class*="login"] .hover {
display: none;
justify-content: center;
align-items: center;
position: absolute;
top: 40px; left: 0;
width: 160px;
height: 40px;
background-color: #fff;
border: 1px solid #707070;
border-radius: 6px;
}
header .h_group .utill [class*="login"] .hover a {
display: flex;
position: relative;
padding: 0 10px;
font-size: 12px;
letter-spacing: 0.5px;
}
header .h_group .utill [class*="login"] .hover a::after {
content: '';
display: block;
clear: both;
position: absolute;
top: 2px; left: 0;
width: 1px;
height: 20px;
background-color: #D2D7E1;  
}
header .h_group .utill [class*="login"] .hover a:first-child:after {display: none;}
header .h_group .utill .login:hover .hover {display: flex;}
header .h_group .utill .login:focus .hover {display: flex;}

header .headNav {
position: fixed;
top: 9.0rem; left: 50%;
width: 100%;
max-width: 1490px;
height: 634px;
margin: 0 auto;
padding-top: 47px;
background: white;
/*box-shadow: 0 10px 30px rgb(40, 54, 124, 0.3);*/
opacity: 0;
display: none;
transition: all 0.5s ease;
transform: translate(-50%, -100px);
}
header.open .headNav {
overflow: hidden;
top: 78px;
opacity: 1;
display: block;
transform: translate(-50%, 0);
animation: fadeIn 0.3s ease-in-out;
width: calc(100% - 40px);
}
body.up header.open .headNav {width: 100%; max-width: 100%;}
header .h_group .btn_etf {
display: flex;
justify-content: center;
align-items: center;
width: 93px;
height: 12px;
margin: 0 2px;
padding: 0 5px;
background: url('/magi/assets/images/common/btn_tigeretf.png') no-repeat center center;
font-size: 0;
text-indent: -9999em;
line-height: 0;
}
header .allBtnMenu {background: transparent;}
header .allBtnMenu > span {display: block; transition: all 0.4s ease;}
header .allBtnMenu > span > span, 
header .allBtnMenu > span::before, 
header .allBtnMenu > span::after {
display: block;
width: 2.2rem;
height: 0.2rem;
margin: 0.6rem auto;
content: "";
background-color: #1b3d70;
border-radius: 4px;
transition: all 0.2s ease;
}  
header .allBtnMenu > span > span {
width: 1.6rem; 
margin: 4px 0 4px 6px;
font-size: 0;
line-height: 0;
}
header .allBtnMenu.is-open > span {transform: rotate(180deg); padding: 0 0 0.5rem;}
header .allBtnMenu.is-open > span > span {opacity: 0;}
header .allBtnMenu.is-open > span::before {transform: translateY(9px) rotate(-45deg);}
header .allBtnMenu.is-open > span::after {transform: translateY(-7px) rotate(45deg);}
header .allBtnMenu.is-open > span > span,
header .allBtnMenu.is-open > span::before,
header .allBtnMenu.is-open > span::after {width: 2.8rem;}
header .headNav .global-link {position: absolute; top: 220px; left: 4rem; overflow: visible;}
header .headNav .global-link > img {opacity: 1;}
header .headNav > div {
position: relative;
width: 100%;
max-width: 1490px;
height: 100%;
margin: 0 auto;
padding: 0 4rem;
}
header .headNav ul {height: 100%;}
header .headNav li {font-size: 0; line-height: 0;}
header .headNav a {font-size: 16px; line-height: 28px;}
header .headNav .nav-menu-wrap {width: 330px;}
header .headNav .nav-menu-wrap .nav-1depth-menu > a {
    opacity: 1;
    display:block;
    height: 49px;
    padding-top: 12px;
    border-bottom: 1px solid #ECEEF3;
    font-weight: 500;
    font-size: 20px;
    color: #595E6B;
}

@keyframes slideIn {
from {opacity: 0; transform: translateX(-50%);}
to {opacity: 1; transform: translateX(0);}
}
.headNav .nav-menu-wrap .nav-1depth-menu.on {display: block;}
.headNav .nav-menu-wrap .nav-1depth-menu > a {
    background: url('/magi/assets/images/common/ico_menu.png') no-repeat 100% center;
}
.headNav .nav-menu-wrap .nav-1depth-menu.on > a, .headNav .nav-menu-wrap .nav-1depth-menu > a:hover,
.headNav .nav-menu-wrap .nav-1depth-menu.active > a { color: #DF6D1B; background: url('/magi/assets/images/common/ico_menu_on.png') no-repeat 100% center;}

/* 2뎁스 */
.headNav .nav-2depth-menu-wrap {
    opacity: 1;
    position: absolute;
    top: 0; left: 370px;
    width: 330px;
    padding-left: 30px;
    display:none;
}

.headNav .nav-menu-wrap .nav-1depth-menu.active > .nav-2depth-menu-wrap,
.headNav .nav-menu-wrap .nav-1depth-menu.on > .nav-2depth-menu-wrap {display: block;}
.headNav .nav-2depth-menu-wrap.on {z-index: 1;}
.headNav .nav-2depth-menu-wrap .nav-2depth-menu > a {
opacity: 1;
display:block;
height: 49px;
padding-top: 12px;
font-size: 16px;
border-bottom: 1px solid #ECEEF3;
color: #595E6B;
}

@keyframes slideInTwo {
from {opacity: 0; transform: translateX(-40px);}
to {opacity: 1; transform: translateX(0);}
}

header .headNav .nav-2depth-menu-wrap.on {opacity: 1;}
header .headNav .nav-2depth-menu-wrap .nav-2depth-menu.active > a,
header .headNav .nav-2depth-menu-wrap .nav-2depth-menu:hover > a,
header .headNav .nav-2depth-menu-wrap .nav-2depth-menu > a:focus{color: #DF6D1B;}
header .headNav .nav-2depth-menu-wrap .nav-2depth-menu:last-child > a {border-bottom: 0;}
.headNav .nav-2depth-menu-wrap .link > a {background: url('/magi/assets/images/common/ico_menu.png') no-repeat 100% center;}
.headNav .nav-2depth-menu-wrap .link.on > a,
.headNav .nav-2depth-menu-wrap .link.active > a {background: url('/magi/assets/images/common/ico_menu_on.png') no-repeat 100% center;}

/* 3뎁스 */
.headNav .nav-3depth-menu-wrap {
    opacity: 0;
    position: absolute;
    top: 0; left: 330px;
    width: 330px;
    padding-left: 30px;
    height: 100%;
}
.headNav .nav-3depth-menu-wrap > li > a {
opacity: 1;
display:block;
height: 49px;
padding-top: 12px;
font-size: 16px;
border-bottom: 1px solid #ECEEF3;
color: #595E6B;
}
header.open .headNav .nav-3depth-menu-wrap.on {opacity: 1; z-index: 1;}

header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(1) > a {animation-delay: 0.2s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(2) > a {animation-delay: 0.4s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(3) > a {animation-delay: 0.6s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(4) > a {animation-delay: 0.8s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(5) > a {animation-delay: 1.0s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(6) > a {animation-delay: 1.1s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(7) > a {animation-delay: 1.2s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(8) > a {animation-delay: 1.3s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(9) > a {animation-delay: 1.4s;}
header.open .headNav .nav-3depth-menu-wrap.on li:nth-child(10) > a {animation-delay: 1.5s;}
@keyframes slideInThree {
from {opacity: 0; transform: translateX(-40px);}
to {opacity: 1; transform: translateX(0);}
}
.headNav .nav-3depth-menu-wrap.on li > a:hover,
.headNav .nav-3depth-menu-wrap.on li > a:active,
.headNav .nav-3depth-menu-wrap.on li > a:focus {color: #DF6D1B;}
.headNav .nav-3depth-menu-wrap > li:last-child > a,
.headNav .nav-3depth-menu-wrap > li:last-child > a:hover,
.headNav .nav-3depth-menu-wrap > li:last-child > a:active,
.headNav .nav-3depth-menu-wrap > li:last-child > a:focus {border-bottom:0;}
.headNav div.depthCont {
display: block;
position: absolute;
top: 0; right: 40px;
width: 330px;
}
.headNav div.depthCont > div {
cursor:pointer;
animation: fadeIn 0.8s;
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.headNav div.depthCont > div + div {padding-top: 50px; animation: depthCont 1.3s;}
.headNav div.depthCont > div img {width: 100%;}
.headNav div.depthCont > div .txt {display: block; margin-top: 20px; font-size: 18px; line-height: 24px}


.location {
display: none;
position: absolute;
top: 50%; left: 169px;
transform: translateY(-50%);
}
.location a,
.location strong {
display: block;
color: #1C3E70;
font-weight: 400;
font-size: 14px;
text-indent: 0;
line-height: 20px;
letter-spacing: 0;
}
.location a {
position: relative;
padding: 0 25px 0 10px;
}
.location a::after {
content: '';
display: block;
clear: both;
position: absolute;
top: 0; right: 0;
width: 14px;
height: 14px;
background: url('/magi/assets/images/common/bullt_loca_14x14.png') no-repeat center 0.4rem;
}
.location strong {margin-left: 10px;}

/* 푸터 */
footer {margin-top: 180px; background: rgba(28, 62, 112, 0.03);}
footer .foot {
position: relative;
width: 100%;
max-width: 1410px;
height: 410px;
margin: 0 auto 0;
}
footer .logo_foot {position: absolute; top: 119px; left: 0;}
footer .cont {
display: flex;
justify-content: space-between;
align-items: center;
height: 150px;
}
footer .utill {
display: flex;
flex-wrap: wrap;
width: 630px;
margin-left: 300px;
}
footer .utill > li:nth-child(1),
footer .utill > li:nth-child(6) {width: 150px;}
footer .utill > li:nth-child(2),
footer .utill > li:nth-child(7) {width: 148px;}
footer .utill > li:nth-child(3),
footer .utill > li:nth-child(8) {width: 90px;}
footer .utill > li:nth-child(4),
footer .utill > li:nth-child(9) {width: 155px;}
footer .utill > li > a,
footer .utill > li > a > strong {
display: flex;
color: #043B72;
font-size: 14px;
line-height: 4rem;
letter-spacing: 0;
}
footer .utill > li > a {font-weight: 500;}
footer .utill > li > a > strong {font-weight: 700;}
footer .sns {display: flex;}
footer .sns > li {
display: flex;
justify-content: center;
align-items: center;
margin: 0 10px;
}
footer .sns > li a {
display: block;
width: 40px;
height: 40px;
background-repeat: no-repeat;
background-position: center center;
font-size: 0;
line-height: 0;
text-indent: -99999em;
}
footer .sns > li.blog a {background-image: url('/magi/assets/images/common/ico_blog.png');}
footer .sns > li.youtube a {background-image: url('/magi/assets/images/common/ico_youtube.png');}
footer .sns > li.instagram a {background-image: url('/magi/assets/images/common/ico_instagram.png');}
footer .sns > li.facebook a {background-image: url('/magi/assets/images/common/ico_facebook.png');}
footer .sns > li.post a {background-image: url('/magi/assets/images/common/ico_post.png');}
footer .sns > li.blog a:hover,
footer .sns > li.blog a:active,
footer .sns > li.blog a:focus {background-image: url('/magi/assets/images/common/ico_blog_on.png');}
footer .sns > li.youtube a:hover,
footer .sns > li.youtube a:active,
footer .sns > li.youtube a:focus {background-image: url('/magi/assets/images/common/ico_youtube_on.png');}
footer .sns > li.instagram a:hover,
footer .sns > li.instagram a:active,
footer .sns > li.instagram a:focus {background-image: url('/magi/assets/images/common/ico_instagram_on.png');}
footer .sns > li.facebook a:hover,
footer .sns > li.facebook a:active,
footer .sns > li.facebook a:focus {background-image: url('/magi/assets/images/common/ico_facebook_on.png');}
footer .sns > li.post a:hover,
footer .sns > li.post a:active,
footer .sns > li.post a:focus {background-image: url('/magi/assets/images/common/ico_post_on.png');}

footer .address {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
height: 7.4rem;
border-bottom: 1px solid #C3C9D5;
}
footer .address ul {display: flex;}
footer .address ul > li {display: flex; padding-right: 40px;}
footer .address ul > li,
footer .address ul > li > em {
color: #6F7685;
font-style: normal;
font-weight: 400;
font-size: 12px;
line-height: 40px;
}
footer .address ul > li > em {display: inline-block; padding-right: 1.0rem; letter-spacing: 0.5px;}
footer .address .law {
color: #6F7685;
font-size: 1.2rem;
line-height: 4rem;
letter-spacing: 0;
}
footer .flex-between {
display: flex; 
justify-content: space-between;
width: 100%;
padding-top: 1.0rem;
}
footer .copyright {
color: #6F7685;
font-weight: 400;
font-size: 1.2rem;
line-height: 4rem;
letter-spacing: 0;
}
footer .relat {
display: flex;
align-items: center;
height: 7.7rem;
border-bottom: 1px solid #C3C9D5;
}
footer .global-essay {
margin-right: auto;
color: #595E6B;
font-weight: 500;
font-size: 14px;
letter-spacing: 0;
}
footer .global-link {margin: 0 0 0 4.1rem;}
footer .relat .family_site {position: relative; margin-left: auto;}
footer .relat .family_site .click_sub {
height: 32px;
padding-right: 30px;
background: url('/magi/assets/images/common/select.png') no-repeat 100% center;
}
footer .relat .family_site ul {display: none; position: absolute; top: 33px; left: 0; background-color: #fff; border: 1px solid #767676;}
footer .relat .family_site.on ul {display: block;}
footer .relat .family_site ul li {line-height: 0;}
footer .relat .family_site ul li a {display: block; height: 32px; padding: 0 10px; line-height: 30px;}
footer .relat .family_site ul li:nth-child(even) a {background-color: #F8F8F8;}
footer .relat .family_site ul li a:hover {background-color: #1967d2; color: #fff;}

/* 통합검색 레이어 */
.headSearch {
display: none;
position: absolute;
top: 78px; left: 50%;
transition: all 0.5s ease;
transform: translate(-50%, -100px);
}
.headSearch > div {
overflow: hidden;
width: 1490px;
margin: 0 auto;
padding: 0 40px 90px;
background-color: #1C3E70;
}
.headSearch .search {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
width: 100%;
margin-top: 54px;
border-bottom: 2px solid rgba(255, 255, 255, 0.5);
}
.headSearch .search .txtInput {
width: 100%;
height: 72px;
padding: 0;
background-color: transparent;
border: 0;
color: #fff;
font-size: 36px;
line-height: 42px;
outline: none;
}
.headSearch .search .txtInput::placeholder {color: #fff;}
.headSearch .search .buttonDelete {
display: none;
width: 26px;
height: 24px;
margin: 0 40px 0 auto;
background: url('/magi/assets/images/common/btn_delete02.png') no-repeat center center;
font-size: 0;
text-indent: -9999em;
line-height: 0;
}
.headSearch .search .btnSearch {
width: 56px;
height: 56px;
margin: 0 0 0 0;
background: url('/magi/assets/images/common/btn_search06.png') no-repeat center center;
font-size: 0;
text-indent: -99999em;
line-height: 0;
}
.headSearch .recent p.no-keyword {
margin-top: 38px;
line-height:22px;
font-size: 18px;
color: #C4CBD6;
}
.headSearch .recent ul {display: flex; flex-wrap: wrap; padding: 20px 0 0;}
.headSearch .recent ul li {
display: flex;
align-items: center;
margin: 18px 30px 0 0;
font-size: 0;
line-height: 0;
}
.headSearch .recent ul li .btnInput {
color: #fff;
font-size: 16px;
line-height: 24px;
white-space: nowrap;
}
.headSearch .recent ul li .btnDel {
width: 21px;
height: 21px;
margin: 0 0 0 5px;
background: url('/magi/assets/images/common/btn_delete03.png') no-repeat center center;
font-size: 0;
line-height: 0;
}
.headSearch [class*="keyword"] {padding-top: 10px;}
.headSearch [class*="keyword"] button {
min-width: 90px;
height: 40px;
margin: 15px 10px 0 0;
padding: 0 30px;
background-color: #fff;
border-radius: 20px;
color: #E27625;
font-size: 16px;
line-height: 24px;
}
.headSearch .keyword-theme button {color: #5786C5;}
.headSearch .search-tit {
margin-top: 77px;
color: #fff;
font-size: 24px;
line-height: 32px;
}
.headSearch [class*="keyword"] + .search-tit {margin-top: 37px;}

/* 헤더 검색 .active */
header.active .headSearch {
display: block;
width: calc(100% - 40px);
background-color: #1C3E70;
transform: translate(-50%, 0);
/*border-top: 1px solid #EDEFF3;*/
animation: fadeIn 0.3s ease-in-out;
}
header.active .h_group {margin: 0 auto; background-color: #1C3E70; width: calc(100% - 40px);}
body.up header.active {border-bottom: 1px solid #1C3E70;}
body.up header.active .h_group {background-color: #1C3E70;}
body.up header.active .headSearch  {width: 100%; background-color: #1C3E70;}

header.active .h_group > div {background-color: #1C3E70;}
header.active .h_group .logo a {background-image: url('/magi/assets/images/common/logo01.png');}
header.active .h_group .btn_etf {background-image: url('/magi/assets/images/common/btn_tigeretf01.png');}
header.active .h_group .utill .login .in {background-image: url('/magi/assets/images/common/ico_login01.png');}
header.active .h_group .utill .login-out .btn_login {background-image: url('/magi/assets/images/common/btn_login_white.png');}
header.active .h_group .utill [class*="login"] em {color: #fff;}
header.active .h_group .utill .login .out {background-image: url('/magi/assets/images/common/ico_logout01.png');}
header.active .h_group .utill .login .ico_member {background-image: url('/magi/assets/images/common/ico_member_white.png');}
header.active .h_group .utill .allBtnSearch {background-image: url('/magi/assets/images/common/btn_search01.png');}
header.active .h_group .utill .allBtnMenu {background-image: url('/magi/assets/images/common/btn_close_40x40.png');}
header.active .h_group .utill .allBtnMenu span {opacity: 0;}
header.active .line-nav-wrap {display: none;}

.no-scroll {overflow: hidden;}
.autocomplete-suggestions {
z-index: 2;
position: absolute;
width: 1280px !important;
background-color: #fff;
border-radius: 0 0 30px 30px;
padding: 52px 60px;
max-height: none !important;
}
.autocomplete-suggestions > .autocomplete-suggestion {
display: flex;
align-items: center;
padding: 8px 10px;
color: #707070;
font-size: 18px;
line-height: 24px;
cursor: pointer;
}
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong {color: #DF6D1B; font-weight: 700; font-size: 18px; line-height: 24px;}
.line-nav-wrap {display: flex; margin-left: 209px;height:40px;}
.line-nav-wrap > li {position: relative; padding-right: 17px; cursor: pointer; display: none;}
.line-nav-wrap > li.has-child {background: url('/magi/assets/images/common/bullt_linemap.png') no-repeat 100% center;}
.line-nav-wrap button {
display: block;
padding: 10px 27px 10px 18px;
background: url('/magi/assets/images/common/bullt_option.png') no-repeat calc(100% - 12px) center;
color: #1C3E70;
font-weight: 500;
font-size: 14px;
line-height: 20px;
}
.line-nav-wrap [class*="depth-menu-title"].on {
background: url('/magi/assets/images/common/bullt_option_on.png') no-repeat calc(100% - 12px) center;
color: #DF6D1B;
font-weight: 500;
}
.line-nav-menu-wrapper {
display: none;
position: absolute;
top: 39px; left: -5px;
background-color: #fff;
border-radius: 6px;
border: 1px solid #707070;
border-radius: 6px;
padding: 10px 0;
}
.line-nav-wrap li:focus-visible .line-nav-menu-wrapper.active,
.line-nav-wrap li:focus .line-nav-menu-wrapper.active,
.line-nav-wrap li:hover .line-nav-menu-wrapper.active {display: block;}
.line-nav-menu-wrapper li {min-width: 100px; width: auto; height: 32px;}
.line-nav-menu-wrapper li a {
font-size: 14px;
line-height: 18px;
white-space: nowrap;
font-weight: 400;
padding: 7px 20px;
width:100%;
}
.line-nav-menu-wrapper li a:focus,
.line-nav-menu-wrapper li a:hover {background-color: #F8F8F8; font-weight: 500;}
.line-nav-menu-wrapper li a:focus,
.line-nav-menu-wrapper li a.active {background-color: #D6E1F2; color: #2B2F36; font-weight: 500;}
.buttonMobileGo {
z-index: 100;
display: flex;
justify-content: center;
align-items: center;
position: fixed;
bottom: 0; left: 0;
width: 100%;
height: 150px;
background-color: #F58220;
}
.buttonMobileGo span {
zoom:3;
display: block;
padding-left: 23px;
background: url('../../../magi/assets/mobile/images/common/ico_mobile.png') no-repeat 0 center;
color: #fff;
font-weight: 700;
font-size: 16px;
line-height: 26px;
}
/* header 여백 클릭 시 검색탭 활성화 */
header .h_group .btn_area{
flex-grow: 2;
cursor:pointer;
text-indent:-9999px;
height:100%;
}