@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.6/dist/web/static/pretendard.css");
@import url(https://cdn.jsdelivr.net/xeicon/1/xeicon.min.css);
@import url(https://cdn.jsdelivr.net/xeicon/2/xeicon.min.css);
@import url(css/kbizmyungjo.css);
@import url(css/blank.css);



*{margin:0; padding:0; box-sizing:border-box;letter-spacing:-0.05em;color:inherit;}
html {font-size: 20px;}
img {border:0; vertical-align:top;}
a {border:0; text-decoration:none; -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out;}
ul, li {list-style:none;}
body {font-family: "Pretendard Variable", Pretendard, sans-serif; color:#303030; }
div {display:block;}



.inner {width:1400px;margin:auto;clear:both}
.inner2 {width: 1200px; margin: auto; clear: both;}
.c_default {color:#303030 !important}
.c_lightgray {color:#c0c0c0 !important}
.c_gray {color:#808080 !important}
.c_red {color:#c70000 !important}
.c_white {color:#fff !important}
.color1 {color: #ff8a00 !important;}
.color2 {color: #cdb292 !important;}
.color3 {color: #a77941 !important;}


h1,h2,h3 {font-weight:300;line-height:1.3}
h1 {font-size:2.5rem;}
.sizeh1 {font-size: 2.5rem !important;}
h1.big {font-size: 4rem; }
h1.superbig {font-size: 5rem; letter-spacing:-0.02em;}
h2 {font-size:2rem}
h3 {font-size:1.5rem; }
.sizeh3 {font-size:1.5rem; }
h4 {font-size:1.2rem; font-weight:300; line-height:1.45;}
.sizeh4 {font-size: 1.2rem;}
h5 {font-size:1rem; font-weight: 300; line-height:1.7; word-break:keep-all;}
.sizeh5 {font-size: 1rem !important;}
p {font-size:0.9rem; line-height:1.7; color:inherit; word-break:keep-all; }
p.small {font-size:0.8rem; }
sub {font-size: small; }

.co_gara {font-family: 'Cormorant Garamond', serif; letter-spacing: 0;}
.KBIZHanmaumMyungjo {font-family: 'KBIZHanmaumMyungjo', serif;}
.pretendard {font-family: "Pretendard Variable", Pretendard, sans-serif;}
.loose {letter-spacing: 0.4em;}
.loose2 {letter-spacing: 0.01em;}
b {letter-spacing: inherit; font-weight: 600;}
.bold {font-weight: 600;}



span {color:inherit;}

.float {float:left;}
.float_r {float:right}
.left {text-align:left !important}
.right {text-align:right !important}
.center {text-align:center !important}
.clearfix {margin: 0; padding: 0; height: 0; width: 0;}
.clearfix::after {content:""; clear:both; display: block;}
.inlineblock {display: inline-block;}

.relative {position: relative;}


.flex {display: flex;}
.col1 {flex: 1;}
.col2 {flex: 2;}
.col3 {flex: 3;}
.col4 {flex: 4;}
.col5 {flex: 5;}
.col6 {flex: 6;}


.bd_b {border-bottom:1px #e0e0e0 solid}
.bd_t {border-top:1px #e0e0e0 solid}



/* 컬럼 설정 */
.w05 {width: 5% !important;}
.w10 {width: 10% !important;}
.w15 {width: 15% !important}
.w20 {width: 20% !important;}
.w22 {width: 22% !important;}
.w25 {width: 25% !important;}
.w30 {width: 30% !important;}
.w40 {width: 40% !important;}
.w50 {width: 50% !important;}
.w60 {width: 60% !important;}
.w75 {width: 75% !important;}
.w80 {width: 80% !important;}
.w100 {width: 100% !important;}








/* 공통 */
#wrap {width:100%; min-width:1400px; margin:auto; position:relative; }
h1.logo {width:319px; height:54px; background:url(images/logo.png) center no-repeat; background-size: contain; text-indent:-3333px;}
h1.logo a {display:block; height:inherit; }



#header {width:100%; background-color:#fff; height:120px; position:relative; padding: 0 0 0 3em ;}
#header .logo {float: left; margin-top: 35px; color: #fff;}

#header .depth2_bg {position: absolute; width: 100%; height: 0px; bottom: 0; left: 0; z-index: 100; transform: translateY(100%); -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out; }
#header.menu-open .depth2_bg {height: 280px; background:#a77941;}

#header #gnb {float:right; width: 70%; height: 120px;}
#header .depth1 {display: flex; height: 100%;}
#header .depth1 > li {height: 100%; flex: 1;  position: relative; z-index: 100;}
#header .depth1 > li > a {height: 100%; line-height: 120px; display: flex; justify-content: center; align-items: center; white-space:nowrap; position: relative; -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out;}
#header .depth1 > li > a::before {content:""; width:0%; height: 120px;  position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out; z-index: -1; background-color: #a77941;}
#header .depth1 > li > a.on,#header .depth1 > li:hover > a {color: #fff; font-size: 1.1rem;}
#header .depth1 > li > a.on::before,#header .depth1 > li:hover > a::before {width: 80%; } {width: 80%; }

#header .depth1 > li > ul.depth2 {opacity: 0; color: #fff; padding-top:10px;}
#header .depth1 > li.on > ul.depth2 {opacity: 1; -webkit-transition:all 0.4s ease-out; transition:all 0.4s ease-out;}
#header.menu-open .depth1 > li > ul.depth2 {height:auto; padding-bottom: 10px; visibility:visible; opacity: 1; }
#header .depth1 > li > ul.depth2 > li > a {text-align: center; display: block; padding: 10px 0; opacity: 0.6; font-size: 0.9rem;}
#header .depth1 > li > ul.depth2 > li > a:hover,#header .depth1 > li > ul.depth2 > li > a.on {opacity: 1; }



#quick {width: 120px; height: 480px; background-color:#ff8a00; position: fixed; right: 0; top: 50%; margin-top: -240px; z-index: 10; border-radius: 30px 0 0 30px; color: #fff;  -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out;}
#quick.jbFixed * {visibility: hidden;}
#quick.jbFixed {right: -100px;}
#quick.jbFixed:hover {right: 0;}
#quick.jbFixed:hover * {visibility: visible;}
#quick.jbFixed::before {    content: "\e93b"; font-family: "xeicon"; left: -10px; position: absolute; transform: rotate("90deg"); top: 50%; margin-top: -15px; background-color: #ff8a00; display: block; border-radius: 50px; width: 30px; height: 30px; line-height: 30px; text-align: center;}
#quick.jbFixed:hover::before {content: "\e93e"; }
#quick li {background-image: url(images/quick.png); width: 100%; height: 115px; display: block; -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out;}
#quick li:hover {background-image: url(images/quick_hover.png);}
#quick li.quick1 { height: 110px; background-position: 0 0;}
#quick li.quick2 { background-position: 0 -115px;}
#quick li.quick3 { background-position: 0 -220px;}
#quick li.quick4 { height: 130px; background-position: 0 -335px;}
#quick li a {display: block; width: 100%; height: inherit; padding-top: 95px; text-align: center; position: relative; z-index: 1;}



#footer {width:100%; background-color: #fff; position: relative; padding:60px 0 !important;}
#footer .inner {position: relative;}
#footer h1.logo {margin-top: 10px; float: left;}
#footer .txtbox {margin-left: 50px; float: left;}
#footer .txtbox span {margin-right:15px; line-height: 1.6;}

#footer #backtop {width: 70px; height: 70px; background: url(images/totop.png) no-repeat; position: absolute; right: 0; display: block; text-indent: -3333px;}
