@charset "utf-8";
@font-face {
    font-family: 'Muli';
    src: url(../font/Muli-Light.ttf) format('truetype');
}

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

.leaf_fix_left { position: fixed; z-index: 999; top: 550px; left: -50px; width: 16.6%; }
.leaf_fix_right { position: fixed; z-index: 999; top: 158px; right: -60px; width: 17.5%; }


/*header-desktop start*/

#header { padding-top: 20px; padding: 0px 4.7%; width: 100%; height: 90px; position: fixed; z-index: 999; top: 0px; right: 0px; text-align: center; background: #FFF; }
#header.on { background: #FFF; box-shadow: 2px 0px 5px rgba(0,0,0,0.15); }

#header .header-in { position: relative; width: 100%; font-size: 13px; border-bottom: 1px solid #e1e1e1;  }

#header > .header-in > .header-icon { position: relative; }
#header > .header-in > .header-icon > a { transition: .3s; }
#header > .header-in > .header-icon > a:hover { color: #c78665; }
#header > .header-in > a:nth-of-type(1) { position: absolute; left: 0px; top: 22.5px;}
#header > .header-in > a:nth-of-type(1) > img{ width: 150px;}
#header > .header-in > .header-icon:nth-of-type(1) > a { position: absolute; right: 80px; top: 35px; font-size: 21px;}
#header > .header-in > .header-icon:nth-of-type(2) > a { position: absolute; right: 40px; top: 35px; font-size: 21px;}
#header > .header-in > .header-icon:nth-of-type(3) > a { position: absolute; right: 0px; top: 35px; font-size: 21px;}

#header > .header-in > .header-icon:nth-of-type(1) > .toolbar { position: absolute; right: 60px; top: 64px; width: 60px; height: 20px; background: #c78665; border-radius: 6px; opacity: 0; transition: .3s; }
#header > .header-in > .header-icon:nth-of-type(2) > .toolbar { position: absolute; right: 20px; top: 64px; width: 60px; height: 20px; background: #c78665; border-radius: 6px; opacity: 0; transition: .3s; }
#header > .header-in > .header-icon:nth-of-type(3) > .toolbar { position: absolute; right: -20px; top: 64px; width: 60px; height: 20px; background: #c78665; border-radius: 6px; opacity: 0; transition: .3s; }

#header > .header-in > .header-icon:nth-of-type(1) > .toolbar::after { content: ""; position: absolute; top: -2.5px; left: 27.5px; width: 5px; height: 5px; background: #c78665; transform: rotate(45deg); }
#header > .header-in > .header-icon:nth-of-type(2) > .toolbar::after { content: ""; position: absolute; top: -2.5px; left: 27.5px; width: 5px; height: 5px; background: #c78665; transform: rotate(45deg); }
#header > .header-in > .header-icon:nth-of-type(3) > .toolbar::after { content: ""; position: absolute; top: -2.5px; left: 27.5px; width: 5px; height: 5px; background: #c78665; transform: rotate(45deg); }

#header > .header-in > .header-icon:hover > .toolbar { opacity: 1; }

#header > .header-in > .header-icon > .toolbar > p { margin: 0px; font-size: 9px; color: #FFF; line-height: 18px; }

#header > .header-in > a > span { position: relative; }
#header > .header-in > a > span > div { position: absolute; top: 0px; left: 0px; width: 40px; height: 40px; background: #000;  }


#header > .header-in > ul { margin: 0px;}
#header > .header-in > ul > li { position: relative; display: inline-block; margin: 0; padding: 35.5px 0px; width: 100px; height: 90px; }
#header > .header-in > ul > li::after { content: ""; position: absolute; top: 58px; left: 50%; transform: translateX(-50%); width: 0px; height: 1px; background: #000; transition: .3s; }
#header > .header-in > ul > li:hover::after { width: 20px; }

#header > .header-in > ul > li > ul > li { text-shadow: none; }

#header > .header-in > ul > li:hover .depth2 { visibility: visible; display: block; height: auto; opacity: 1; }
#header > .header-in > ul > li > ul { visibility: hidden; margin: 0; padding: 0; position: absolute; top: 80px; left: -25px; padding: 10px 0px; width: 150px; background: #FFF; text-align: center; opacity: 0; transition: .3s; box-shadow: 2px 0px 5px rgba(0,0,0,0.15); }
#header > .header-in > ul > li > ul > li > a { display: block; width: 150px; font-weight: 300; line-height: 42px; color: #818491; }


#header.on  > .header-in > ul > li { text-shadow: none; }
#header > .header-in > ul > li > a { position: relative; z-index: 100; font-weight: 400; }
#header > .header-in > ul > li.on > a::after { content: ""; position: absolute; top: 22px; left: 50%; transform: translateX(-50%); width: 20px; height: 1px; background: #000; }

/*header end*/

/*header-mobile start*/

#header-mobile { display: none; }

@media (max-width: 1280px) {  
    
#header { display: none; }

#header-mobile { position: fixed; top:0; z-index: 1000; width: 100%; height: 78px; background: #FFF; display: block; }
#header-mobile.on { top: -100%; }
#header-mobile > a:nth-of-type(1) > img { position: absolute; top: 15px; left: 25px; 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: #818491; 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: #FFF; }
#header-mobile .header-mobile-in ul li a { padding-left: 25px; }
#header-mobile .header-mobile-in ul li a:hover { color: #c78665; }
    
#header-mobile .header-mobile-in > ul { margin-top: 78px; margin-bottom: 0px; padding: 0px 20px; border-bottom: 1px solid #e1e1e1; }
#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 #e1e1e1; }

#header-mobile .header-mobile-in > ul > li > ul > li { border-top: 1px solid #e1e1e1; }
#header-mobile .header-mobile-in > ul > li > ul > li > a { padding-left: 30px; }
#header-mobile .header-mobile-in ul li .depth2 { overflow: hidden; transition: none; display: none; background: #FFF; }



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

 
    input[id="hamburger"] + label {
        display: block;
        width: 30px;
        height: 16px;
        position: absolute;
        right: 25px;
        top: 30px;
        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;}

/*top start*/

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

.top:hover { background: #c78665; }
.top:hover div h3 { color: #FFF; }

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

@media (max-width: 1024px) {
    
    .leaf_fix_left { display: none; }
    .leaf_fix_right { display: none; }
    
}

@media (max-width: 720px) {
    
    .top { bottom: 10px; }
    .top.on { right: 10px; bottom: 10px; }
    
}


@media (max-width: 420px) {
    
    #header-mobile > a > div { position: absolute; top: 24px; left: 25px; z-index: 100; width: 130px; height: 32px;  background: url(../img/logo-black.png); background-size: 100% 100%; }
    
}