@charset "utf-8";

@font-face {
    src: url("../font/Noto_Serif_KR/NotoSerifKR-Regular.otf");
    font-family: "Noto Serif KR";
}

@font-face {
    src: url("../font/Noto_Sans_KR/NotoSansKR-Light.otf");
    font-family: "Noto Sans KR";
}

@font-face {
    src: url("../font/Noto_Sans_KR/NotoSansKR-Bold.otf");
    font-family: "Noto Sans KR Bold";
}

@font-face {
    src: url("../font/Noto_Sans_KR/NotoSansKR-Black.otf");
    font-family: "Noto Sans KR Black";
}

/*
@font-face {
    src: url("../font/Intro.otf");
    font-family: "Intro";
}
*/

@font-face {
    src: url("../font/Montserrat/Montserrat-Black.ttf");
    font-family: "Montserrat-Black";
}

* { box-sizing: border-box; list-style: none; }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background-color: #f7f7f7; }
::-webkit-scrollbar-thumb { background-color: #e0e0e0; border-radius: 5px; }
*::selection { background-color: #f9d041; color: #FFF; }
html { scroll-behavior: smooth; }
a { text-decoration: none; color: #343434; }
body { margin: 0px; font-family: 'Noto Sans KR'; color: #343434;}
main { overflow: hidden; position: relative; }
ul { margin: 0px; padding: 0px; }
li { margin: 0px; padding: 0px; }

/*header-desktop start*/

#header { padding: 0px; width: 100%; height: auto; position: fixed; z-index: 999; top: 0px; left: 50%; right: 0px; text-align: center; background: #FFF; border-bottom: 1px solid #e1e1e1; transform: translateX(-50%); transition: .3s; }

#header.on { top: -90px; position: fixed; }
#header .header-in { position: relative; margin: 0px auto; font-size: 13px; }

#header .header-in > div { position: relative; width: 100%; height: 90px; border-bottom: 1px solid #e1e1e1; }
#header .header-in > div > div { margin: 0px auto; width: 1180px; }
#header .header-in div div img { position: absolute; top: 15px; left: 50%; transform: translateX(-50%); }

#header .header-in div div .left { width: 300px; text-align: left; float: left; }
#header .header-in div div .left p { display: block; margin: 0px; padding-top: 25px; font-size: 11px; line-height: 16px; }
#header .header-in div div .left p span { font-weight: 600; }

#header .header-in div div .right { padding-top: 20px; width: 250px; text-align: right; float: right; }
#header .header-in div div .right .button { width: 160px; height: 45px; background: #f9d041; font-size: 13px; font-weight: 600; line-height: 45px; letter-spacing: 1; text-align: center; float: right; border-radius: 7px; transition: .4s; }
#header .header-in div div .right .button:hover { background: #343434; color: #fff; }
#header .header-in div div .right .button .iconify { font-size: 10px; margin-right: 5px; }

#header > .header-in > ul { position: relative; margin: 0px auto; padding: 0px; display: flex; width: 1180px; }
#header > .header-in > ul > li { position: relative; display: inline-block; margin: 0px 50px 0px 0px; padding: 20px 0px 0px; height: 65px; z-index: 999; }

#header > .header-in > ul > li::after { content: ""; position: absolute; top: -5px; left: 0px; width: 100%; height: 9px; background: #ffd33b; opacity: 0; transform: scale(.7); transition: .4s; }

#header > .header-in > ul > li.on::after { content: ""; position: absolute; top: -5px; left: 0px; width: 100%; height: 9px; background: #ffd33b; opacity: 1; transform: scale(1); }
#header > .header-in > ul > li:hover::after { opacity: 1; transform: scale(1); }

#header > .header-in > ul > li:nth-of-type(8),
#header > .header-in > ul > li:nth-of-type(9),
#header > .header-in > ul > li:nth-of-type(10) { position: absolute; margin: 0px; }

#header > .header-in > ul > li:nth-of-type(8) .iconify,
#header > .header-in > ul > li:nth-of-type(9) .iconify,
#header > .header-in > ul > li:nth-of-type(10) .iconify {font-size: 18px; }

#header > .header-in > ul > li:nth-of-type(8):hover .iconify,
#header > .header-in > ul > li:nth-of-type(9):hover .iconify,
#header > .header-in > ul > li:nth-of-type(10):hover .iconify { color: #f9d041; }

#header > .header-in > ul > li:nth-of-type(8):hover,
#header > .header-in > ul > li:nth-of-type(9):hover,
#header > .header-in > ul > li:nth-of-type(10):hover { color: #f9d041; }

#header > .header-in > ul > li:nth-of-type(8) { top: -4px; right: 90px; }
#header > .header-in > ul > li:nth-of-type(8) p { display: block; margin: 2px 0px 0px; font-size: 9px; }

#header > .header-in > ul > li:nth-of-type(9) { top: -4px; right: 50px; }
#header > .header-in > ul > li:nth-of-type(9) p { display: block; margin: 2px 0px 0px; font-size: 9px; }

#header > .header-in > ul > li:nth-of-type(10) { top: -4px; right: 10px; }
#header > .header-in > ul > li:nth-of-type(10) p { display: block; margin: 2px 0px 0px; font-size: 9px; }

#header > .header-in > ul > li:nth-of-type(8)::after,
#header > .header-in > ul > li:nth-of-type(9)::after,
#header > .header-in > ul > li:nth-of-type(10)::after { display: none; }


#header > .header-in > ul > li.on > a { color: #171717; }
#header > .header-in > ul > li > a { color: #343434; font-size: 13px; font-weight: 600; }

#header > .header-in > ul > li > .depth2 { visibility: hidden; margin: 0; padding: 20px 0px 20px; position: absolute; top: 50px; left: -40px; width: 180px; background: #fff; text-align: left; opacity: 0; transition: .3s; border: 1px solid #e1e1e1; border-top: none; } 
#header > .header-in > ul > li:hover > .depth2 { visibility: visible; display: block; height: auto; opacity: 1; top: 65px;  }

#header > .header-in > ul > li > ul > li { text-shadow: none; }
#header > .header-in > ul > li > ul > li:hover { background: #fff; }
#header > .header-in > ul > li > ul > li > a { display: block; padding-left: 45px; font-family: 'Noto Sans KR'; font-size: 13px; font-weight: 100; line-height: 42px; color: #383838; }

/*header end*/
/*header-mobile start*/

#header-mobile { display: none; }

@media (max-width: 1180px) {  

    
#header { display: none; }
#header2 { display: none; }

#header-mobile { position: fixed; top:0; z-index: 1000; width: 100%; height: 78px; background: #FFF; display: block; border-bottom: 1px solid #d0d0d0; }
#header-mobile.on { top: -100%; }
#header-mobile > a:nth-of-type(1) > img { position: absolute; top: 7.5px; left: 20px; width: 120px; z-index: 100; }
#header-mobile > a:nth-of-type(2) { position: absolute; top: 24px; right: 75px; font-size: 18px; text-align: center; }
#header-mobile > a:nth-of-type(2) > p { margin: 0px; font-size: 10px; }
#header-mobile > a:nth-of-type(3) { position: absolute; top: 24px; right: 112px; font-size: 18px; text-align: center; }
#header-mobile > a:nth-of-type(3) > p { margin: 0px; font-size: 10px; }
    
#header-mobile .header-in { position: fixed; top:78px; z-index: 999; width: 100%; background: #545354; }
#header-mobile .header-mobile-in ul, #header-mobile .header-mobile-in li { margin: 0; padding: 0; font-size: 12px; }
#header-mobile .header-mobile-in a { color: #FFF; font-weight: 300; }

#header-mobile .header-mobile-in { margin: 0px auto; width: 100%; height: 0px; overflow: hidden; transition-timing-function: ease-in-out; transition: .4; }
#header-mobile .header-mobile-in.on { height: auto; }

#header-mobile .header-mobile-in ul { font-weight:500; background: #383838; }
#header-mobile .header-mobile-in ul li a { padding-left: 25px; }
#header-mobile .header-mobile-in ul li a:hover { opacity: .75; }
    
#header-mobile .header-mobile-in > ul { margin-top: 78px; margin-bottom: 0px; padding: 0px 5px;  }
#header-mobile .header-mobile-in > ul > li { position: relative; line-height: 40px; cursor: pointer; }
#header-mobile .header-mobile-in > ul > li > img { position: absolute; top: 15px; right: 25px; cursor: pointer; }
#header-mobile .header-mobile-in > ul > li > img.arrow_toggle {  transform: rotate(180deg); }

#header-mobile.on .header-mobile-in > ul > li > img { top: -80px; }
#header-mobile .header-mobile-in > ul > li { border-top: 1px solid #4a4a4a; }
#header-mobile .header-mobile-in > ul > li:nth-child(1) { border: none; }

#header-mobile .header-mobile-in > ul > li > ul > li { border-top: 1px solid #4a4a4a; }
#header-mobile .header-mobile-in > ul > li > ul > li > a { display: block; padding-left: 30px; font-weight: 200; width: 100%; }
#header-mobile .header-mobile-in ul li .depth2 { overflow: hidden; transition: none; display: none; background: #383838; }



    input[id="hamburger"] { display: none; }

 
    input[id="hamburger"] + label {
        display: block;
        width: 30px;
        height: 20px;
        position: absolute;
        right: 25px;
        top: 27.5px;
        cursor: pointer;
    }
    
    input[id="hamburger"] + label span {
        display: block;
        position: absolute;
        width: 100%;
        height: 2px;
        border-radius: 10px;
        transition: all 0.35s;
        background: #121f38;
    }

    
    input[id="hamburger"] + label span:nth-child(1) {top: 1px; }
    input[id="hamburger"] + label span:nth-child(2) {top: 46.8%;}
    input[id="hamburger"] + label span:nth-child(3) {bottom: 1px;}
    
    input[id="hamburger"]:checked + label {z-index: 100;}

    input[id="hamburger"]:checked + label span:nth-child(1) {top: 50%;}
    input[id="hamburger"]:checked + label span:nth-child(3) {bottom: 50%;}
    
    .hamburger_toggle1 {top: 50%; transform: translateY(-50%) rotate(45deg);}
    .hamburger_toggle2 {opacity: 0;}
    .hamburger_toggle3 {bottom: 50%; transform: translateY(50%) rotate(-45deg);}
    
}

.calender { position: absolute; z-index: 101; top: 27px; right: 60px;}

/*header-mobile end*/
/*top start*/

.top { position: fixed; z-index: 999; right: -50px; bottom: 30px; width: 50px; height: 50px; background: #f9d041; border-radius: 50%; transition: .4s; }
.top.on { right: 30px; }
.top div { position: relative; width: 100%; height: 100%; }
.top div h3 { position: absolute; left: 50%; bottom: -7.5px; transform: rotate(90deg) scaleY(1.4) translateY(8.5%); color: #fff; font-weight: 300; }

.top:hover { background: #343434; }
.top:hover div h3 { color: #fff; }


/*top end*/
/*footer start*/

#footer { background: #fff; clear: both; }
#footer .footer-in { position: relative; display: flex; justify-content: space-around; margin: 0px auto; padding: 130px 0px 70px; width: 1180px; text-align: center; clear: both; overflow: hidden; }

#footer .footer-in img { position: absolute; top: 80px; left: 50%; transform: translateX(-50%); }

#footer .footer-in > div:nth-of-type(1) { width: 33.333%; padding: 60px 0px 0px; }
#footer .footer-in > div:nth-of-type(2) { width: 33.333%; padding: 60px 0px 0px 9%; }
#footer .footer-in > div:nth-of-type(3) { width: 33.333%; padding: 60px 0px 0px 50px; }

#footer .footer-in .left { text-align: left; }
#footer .footer-in .left ul li span { font-weight: 900; }
#footer .footer-in .left ul li { font-size: 12px; line-height: 20px; }
#footer .footer-in .left ul li:nth-child(1) { font-size: 14px; margin-bottom: 15px; } 
#footer .footer-in .left ul li:last-child { margin-top: 10px; }

#footer .footer-in .center { text-align: left; }
#footer .footer-in .center h4 { margin: 0px; margin-left: 7.5px; font-size: 14px; }
#footer .footer-in .center .menu-wrap ul { float: left; }
#footer .footer-in .center .menu-wrap ul:nth-child(1) { margin-right: 25%; }
#footer .footer-in .center .menu-wrap ul li:nth-child(1) { margin-top: 10px; }
#footer .footer-in .center .menu-wrap ul li { font-size: 12px; line-height: 22px; }


#footer .bottom { height: 90px; text-align: center; border-top: 1px solid #e1e1e1; }
#footer .bottom p { margin: 0px; font-size: 12px; line-height: 90px;; }

#footer .footer-in a.who{ transition: all .2s ease-out;}
#footer .footer-in a.who:hover{color: #ff5a53;}



@media (max-width: 1180px) {
    
    #footer .footer-in { padding: 120px 20px 100px; width: 100%; }
    #footer .footer-in img { top: 60px; }
    
    #footer .footer-in > div:nth-of-type(2) { padding: 60px 0px 0px 8%; }
    
}

@media (max-width: 980px) {
    
    #footer .footer-in > div:nth-of-type(2) { padding: 60px 0px 0px 7%; }
    
}

@media (max-width: 740px) {
    
    #footer .footer-in { display: block; padding: 100px 20px 40px; }
    #footer .footer-in img { top: 50px; }
    #footer .footer-in > div:nth-of-type(1) { padding: 50px 0px 0px 0%; width: 45%; float: left; }
    #footer .footer-in > div:nth-of-type(2) { padding: 50px 0px 0px 10%; width: 48%; float: left; }
    #footer .footer-in > div:nth-of-type(3) { padding: 50px 0px 0px 0px; width: 100%; clear: both; }
    #footer .footer-in > div:nth-of-type(3) .wrap_map { height: 200px !important; }
 
    #footer .bottom { height: 60px; }
    #footer .bottom p { line-height: 60px; }
    
}


@media (max-width: 688px) {
    
    #footer .footer-in .center .menu-wrap ul:nth-child(1) { margin-right: 15%; }
    
}


@media (max-width: 400px) {
    
    #footer .footer-in .center .menu-wrap ul:nth-child(1) { margin-right: 10%; }
    
}

@media (max-width: 380px) {
    
    #footer .footer-in > div:nth-of-type(2) { padding: 50px 0px 0px 5%; }
    #footer .footer-in .center .menu-wrap ul:nth-child(1) { margin-right: 15%; }

    
}