@charset "UTF-8";

html,body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,table,th,td,form,fieldset,legend,input,textarea,button,select { margin:0;padding:0;box-sizing:border-box; font-family: 'PretendardGOV-regular', sans-serif;}
body    {font-weight: 340; font-size: 1.4rem; line-height: 1.5; word-break:keep-all; text-size-adjust:100%; -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased; margin:0;}
h1,h2,h3,h4,h5,h6 { margin: 0; font-size: 100%; line-height: 1; -webkit-margin-after: 0; margin-block-end: 0; -webkit-margin-before: 0; margin-block-start: 0;}
fieldset,img,button { border: 0;}
img,input,button { vertical-align: top;}
img { max-width: 100%; width: auto; height: auto; border:0;}
table { width: 100%; border-collapse: collapse; border-spacing: 0; word-break: break-all; word-wrap: break-word;}
address,em,i { font-style: normal;}
ol,ul,li { list-style: none;}
hr { display: none;}
a { text-decoration: none; color: inherit; cursor: pointer;}
a:hover,a:active { text-decoration: none; cursor: pointer;}
caption { overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
button { border:0; background: none; cursor: pointer; transition: all 0.1s; -webkit-apperance: none;}
button::-moz-focus-inner { padding: 0; border: 0; cursor: pointer;}
textarea { resize: none;}
strong  { font-weight: 600;}

.pc     {display: block !important;}
.mob    {display: none !important;}

html.overflow,body.overflow { width: 100%; overflow: hidden; position: fixed;}
#wrap { position: relative; width: 100%; overflow: hidden;}
#wrap:before {content: "";display: block;width: 100%;height: 100%; position: fixed; top: -100%;left: 0;z-index: 3;opacity: 0;background-color: rgba(0, 0, 0, 0.8);-webkit-backdrop-filter: blur(2px);-moz-backdrop-filter: blur(2px);-o-backdrop-filter: blur(2px);backdrop-filter: blur(2px);}
#wrap.on::before { top: 0; opacity: 1; transition: opacity 0.5s;}

#header, #main { position: relative; width: 100%; box-sizing: border-box; z-index: 4;}

#header .header_wrap > .inner { width: 100%; max-width: 1566px; margin: 0 auto; position: relative; z-index: 10; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; height: 164px; border-bottom: 1px solid #000;}
#header .inner aside {position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: auto;z-index: 2;height: 50px;align-items: flex-end;justify-content: flex-end;gap: 12px;}
#header .inner aside .mi { display: flex; align-items: center; margin-bottom:10px;}
#header .inner aside .mi h1 { width: auto; margin: 0;}
#header .inner aside .mi h1 img { width: auto; max-width: 100%; height: auto;}
#header .inner aside strong.month_cont { font-weight: 600; color: #000; font-size:1.25rem; line-height: 1.3; border:1px solid #000; padding:0 10px;}
#header .inner aside strong.month_cont span { font-weight: 400; color: #1f1f1f; font-size:1rem;}
#header .inner .logo { display: flex; align-items: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: auto; z-index: 2;}
#header .inner .logo h1 { width: auto; margin: 0 auto;}
#header .inner .logo h1 img {  width: auto; max-width: 100%; height: auto;}

/*
============================
Global Navigation Bar / Hambuger Btn Event
============================
*/
.hambuger { position: absolute; right: 0;  height: 36px; display: flex ; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap;}
.hambuger_btn { position: relative; width: 38px; height: 38px; display: flex ; justify-content: center; align-items: center; box-sizing: border-box; transition: all .3s; z-index: 60; background-color: #f4f4f4;}
.hambuger_btn span { display: block; height: 4px; width: 30px; border-radius: 30px; background-color: #000; position: absolute; transition: all 0.35s;}
.hambuger_btn span:nth-of-type(1) { top: 9px; left: 50%; transform: translateX(-50%);}
.hambuger_btn span:nth-of-type(2) { left: 50%; transform: translateX(-50%);}
.hambuger_btn span:nth-of-type(3) { bottom: 9px; left: 50%; transform: translateX(-50%);}
.back	{ width:38px; height:38px; right: 0; position:absolute;}


/* 중앙 라인이 고정된 자리에서 투명하게 사라지며 상하라인 회전하며 엑스자 만들기 */
.hambuger_btn.active span:nth-of-type(1) {
    width: 30px;
    left: 4px;
    -webkit-transform: translateY(10px) rotate(-45deg);
    transform: translateY(8px) rotate(-45deg);
}
.hambuger_btn.active span:nth-of-type(2) {
    opacity: 0;
    display: none;
    visibility: hidden;
}
.hambuger_btn.active span:nth-of-type(3) {
    width: 30px;
    left: 4px;
    -webkit-transform: translateY(-10px) rotate(45deg);
    transform: translateY(-8px) rotate(45deg);
}
.hambuger_btn.active    { background-color: #d8d8d8;}


/*
============================
Global Navigation Bar / Hambuger Menu Click Event
============================
*/
.hambuger_menu.active { display: block; transform: translateX(0); transition: 0.3s ease-in-out;}
.hambuger_menu { display: none; position: fixed;  right: 160px; top: 0; width: 100%; max-width: 465px; height: calc(876px); z-index: 9; background-color: #fff; transform: translateX(100%); /* Start off-screen */ transition: transform 0.3s ease; -ms-overflow-style: none; /* for Internet Explorer, Edge */scrollbar-width: none; /* for Firefox */overflow-y: scroll; height: 100vh;} /*max-width: 678px;*/
.hambuger_menu::-webkit-scrollbar { display: none; /* for Chrome, Safari, and Opera */}


.hambuger_menu .hambuger_nav { padding: 11vh 28px 30px 50px; background-color: #fafafa;}
    
.hambuger_menu .hambuger_nav > ul { display: flex; flex-wrap: nowrap; justify-content: start; width: 100%; margin: auto; flex-direction: column; text-align: start;}
.hambuger_menu .hambuger_nav > ul > li { width: 100%; position: relative; min-height: 18%; padding: 20px 30px 20px 0;}
.hambuger_menu .hambuger_nav > ul > li h2 { display: inline-block; font-size: 24px; line-height: 1.4; padding-bottom: 20px; word-break: keep-all;}
.hambuger_menu .hambuger_nav > ul > li:nth-child(1)::before,
.hambuger_menu .hambuger_nav > ul > li:nth-child(2)::before { content: ""; display: block; position: absolute; width: 100%; height: 1px; background-color: #ddd; left: 0; bottom: 0;}
.hambuger_menu .hambuger_nav > ul > li > ul.lnb li:hover a:after { width: 100%;}
.hambuger_menu .hambuger_nav > ul > li > ul.lnb li:hover { opacity: 1;}
.hambuger_menu .hambuger_nav > ul > li > ul.lnb li { margin-bottom: 20px; width: 100%;}
.hambuger_menu .hambuger_nav > ul > li > ul.lnb li:last-child   { margin-bottom: 0;}
.hambuger_menu .hambuger_nav > ul > li > ul.lnb li a { display: inline-block; font-size: 20px; font-weight: 400; position: relative;}
.hambuger_menu .hambuger_nav > ul > li > ul.list1 li a:hover { color: #1db9f6; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list2 li a:hover { color: #1db9f6; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list3 li a:hover { color: #1db9f6; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list1 li a:after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px; color: #1db9f6; background-color: #1db9f6; display: inline-block; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list2 li a:after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px; color: #1db9f6; background-color: #1db9f6; display: inline-block; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list3 li a:after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px; color: #1db9f6; background-color: #1db9f6; display: inline-block; transition: 0.5s ease;}
.hambuger_menu .hambuger_nav > ul > li > ul.list1 li a:active   { color: rgb(10, 72, 165);}
.hambuger_menu .hambuger_nav > ul > li > ul.list2 li a:active   { color: rgb(10, 72, 165);}
.hambuger_menu .hambuger_nav > ul > li > ul.list3 li a:active   { color: rgb(10, 72, 165);}

.hambuger_menu .hambuger_nav > ul > li > ul.list1 li a:active:after   { background-color: rgb(10, 72, 165);}
.hambuger_menu .hambuger_nav > ul > li > ul.list2 li a:active:after   { background-color: rgb(10, 72, 165);}
.hambuger_menu .hambuger_nav > ul > li > ul.list3 li a:active:after   { background-color: rgb(10, 72, 165);}

.hambuger_menu .hambuger_nav > ul > li:last-child       {padding: 0; margin-left: 0;}
.HBbox      { border: 1px solid #a5a5a5; max-width: 410px; background-color: #fff; margin-left: -23px; padding: 18px 22px;}
.HBbox_txt  { font-size: 14px;}
.HBbox img  { float: right; margin-left: 10px;}

/*이미지 팝업*/
.img_popup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.8); visibility: hidden; opacity: 0; transition: all 0.3s; z-index: 10000;}
.img_popup.active {visibility: visible; opacity: 1;}
.img_popup .popup_inner {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: max-content; height: 90%; max-height: max-content; overflow: auto;}
.img_popup .popup_inner > img {display: block; width: 100%; margin: 0 auto; border-radius: 0;}
.img_popup .popup_inner .close_btn {display: none;/*display: flex; display: -webkit-flex; display: -ms-flexbox;*/ position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 70px; height: 70px; border-radius: 50%; background-color: #063867; justify-content: center; align-items: center; color: #fff;  flex-direction: column; justify-content: center; align-items: flex-end; margin: 10px 0; box-sizing: border-box; opacity: 0.7;}
.img_popup .popup_inner .close_btn span { width: 32px; height: 32px; display: flex ; justify-content: center; align-items: center; flex-wrap: wrap; align-content: center; margin: 0 auto; text-align: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: all 0.3s;}
.img_popup .popup_inner .close_btn span i { position: absolute; display: block; box-sizing: border-box; width: 32px; height: 2px; z-index: 132; transition: all 0.3s; background: #fff; text-align: center; margin: 0 auto; align-content: center;}
.img_popup .popup_inner .close_btn span i:nth-of-type(1) { transform: translateY(0) rotate(-45deg); }
.img_popup .popup_inner .close_btn span i:nth-of-type(2) { transform: translateY(0) rotate(45deg);}
.img_popup .popup_inner .close_btn:hover span  { left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(180deg);}

.blind {overflow: hidden; position: absolute; overflow: hidden; display: inline-block; border: 0; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);}


@media (max-width: 1586px) {
    #header .inner aside    {left: 28px;}
    .hambuger               { right: 28px;}
    .hambuger_menu          { right: 28px;}
}

@media (max-width: 960px) {
    .pc     {display: none !important;}
    .mob    {display: block !important;}

    .hambuger_menu .hambuger_nav > ul > li h2              { padding-bottom: 10px;}

    #header .header_wrap > .inner           { height: 100px !important;}
    #header .inner .logo h1 img             { width: 68% !important;}
    #header .inner aside                    { height: 32px !important; left: 0 !important;}
    #header .inner aside .mi h1 img         { width: 68% !important;}

    .hambuger                               { right: 28px !important;}
    .hambuger_menu.active                   { right: 0px; max-width: 280px;}
    
}

@media (max-width:480px) {
    #header .inner aside    { left: -10px;}
    #header .inner aside .mi h1 img     { width: 56% !important; margin-left: -20px; margin-top: 4px;}
    .hambuger_menu .hambuger_nav > ul > li > ul.lnb li { margin-bottom: 12px;}
    .HBbox img  { width: 40%;}
}