@charset "utf-8";

/* common */
body{overflow-x:hidden;}
::selection{background:rgba(117,61,23,.35); color:#fff;}
body{font-size:16px; word-break:keep-all;}
th[data-view="file"] + td ul li a{line-height:1em;}
.arita{font-family:'AritaBuri';}
.wrap{width:1280px; margin:0 auto;}
a.btn_basic{display:inline-block; position:relative; width:178px; line-height:1; padding:24px 10px; background:transparent; border:3px solid #fff; font-size:15px; color:#fff; text-align:center; letter-spacing:-0.01em; transition:all 0.3s ease 0s; vertical-align:middle; cursor:pointer; border-radius:100px;}
.btn_basic{position:relative; font-weight:600;}
.btn_basic .arrow{position:relative; padding-right:0; transition:all 0.3s ease 0s;}
.btn_basic .arrow:after{content:""; display:block; position:absolute; opacity:0; top:3px; right:0; width:6px; height:11px; background-position:50% 50%; transition:all 0.2s ease 0s; background-image:url('../../images/common/arr_basic_point.svg'); background-repeat:no-repeat;}
.btn_basic:hover{background:#fff; color:#1f2c5c;}
.btn_basic:hover .arrow{margin-left:-15px; padding-right:15px; color:#ad7c62;}
.btn_basic:hover .arrow:after{opacity:1; right:-15px;}
a.btn_basic.color{border-color:#d6d6d6;}
a.btn_basic.color .arrow{color:#333;}
.btn_basic.color .arrow:after{background-image:url(../../images/common/arr_basic_color.svg);}

/* animation */
.ani{position:relative; opacity:0; transition:all 0.8s ease-out 0s; transform:translate(0,20px);}
.ani.is-animate{opacity:1; transform:translate(0,0);}
.delay-100{transition-delay:100ms;}
.delay-150{transition-delay:150ms;}
.delay-200{transition-delay:200ms;}
.delay-250{transition-delay:250ms;}
.delay-300{transition-delay:300ms;}
.delay-350{transition-delay:350ms;}
.delay-400{transition-delay:400ms;}
.delay-450{transition-delay:450ms;}
.delay-500{transition-delay:500ms;}

/* popup */
.layerPop{overflow:hidden; border:1px solid #353535; border-radius:14px; z-index:10;}
.layerPop .btn button{font-size:13px;}
.layerPop .btn{padding:13px 10px; background:#353535; text-align:left;}
.layerPop .btn button:last-child{float:right; margin:0 12px 0 0;}

/* header */
#header{position:absolute;top:0;left:0;z-index:51;width:100%;transition:all 0.8s ease 0s;transform:translate3d(0, 0, 0);}
#header h1{float:left;position: relative;z-index: 9999;}
#header h1 a{display:block;width: 307px;background: #ad7c62;border-radius: 100px;border-top-left-radius: 0;border-bottom-left-radius: 0;padding: 34px 0;}
#header h1 img{height:54px;margin-left: 52px;}
#header > *:not(.area_util){float:left;}
#header .area_util{float:right; margin-right:90px; padding-top:48px;}
#header .area_util *{color:#fff;}
#header .area_util li a{display:block; position:relative; opacity:0.75; padding:0 15px; font-weight:200; font-size:14px; transition:all 0.4s ease-out 0s;}
#header .area_util li{position:relative;}
#header .area_util li a:hover{opacity:1;}
#header .area_util li:last-child a{padding-right:0;}
#header .area_util ul{display:flex;}
#header .area_util li:after {content: "";width: 1px;height: 13px;background: #fff;display: block;position: absolute;right: 0;top: 4px;opacity: 0.3;}

#header .util_call{position: absolute;background: #fff;right: 87px;border-radius: 7px;padding: 22px 24px;top: 89px;box-shadow: 7px 8px 34px 0px rgb(17 17 17 / 8%);transition: all 0.4s ease-out 0s;}
#header .util_call a{position:relative;font-weight:700;font-size:28px;color: #ad7c62;}
#header .util_call *{display:block; line-height:1.2;}
#header .util_call i{padding-left:26px;font-weight:300;font-size:12px;text-indent: 2px;margin-bottom: 5px;}
#header .util_call a:before{content:"";display:inline-block;width: 21px;height: 21px;margin-right:8px;background:url(../images/common/icon_call.svg) no-repeat 50% 50% / cover;position: relative;top: 1px;}

#header .btn_menu{display:none;}
#header .btn_menu{position:absolute; top:0; right:0; z-index:9999; width:23px; height:24px; font-size:0px; transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block; position:absolute; left:0px; width:100%; height:2px; background:#000;}
#header .btn_menu > span:nth-of-type(1){top:5px;}
#header .btn_menu > span:nth-of-type(2){top:50%; margin-top:-1px; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:17px;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{position:fixed; top:25px; transform:rotate(180deg);}
#header .btn_menu.active > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#header .btn_menu.active > span:nth-of-type(2){background:transparent;}
#header .btn_menu.active > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){transition-delay:0s, 0.3s;}
#header .btn_close{position:fixed; opacity:0; visibility:hidden; top:0px; left:0px; z-index:99; width:-webkit-calc(100% - 320px); width:100%; height:-webkit-calc(100vh - -0px * 1); height:calc(100vh - -0px * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
.active #header .btn_close{opacity:0.4; visibility:visible;}

#header nav{display:block;}
#header nav .gnb > li{display:inline-block;position:relative;padding:22px 0 0;text-align:center;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{display:inline-block;padding: 0 28px 20px;font-size: 20px;color:#fff;font-weight: 300;font-family: Noto Sans KR, Sans-serif;}
#header nav .gnb > li:hover > a{}
#header nav .gnb > li > a.on,
.sub #header nav .gnb > li > a.on{color:#fce8c8;}

.quick_menu{position:fixed;top: 33vh;right: 89px;z-index:9;text-align:center;transition:all 0.8s ease 0s;}
.quick_menu img{display:block; height:35px; margin:0 auto;}
.quick_menu li i{display:block; position:relative; font-size:14px; color:#222; text-align:center; transition:all 0.4s ease-out 0s;}
.quick_menu li i:before{content:""; display:block; width:38px; height:35px; margin:0 auto 7px;}
.quick_menu li:nth-child(1) i:before{background:url(../images/common/icon_quick01.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(2) i:before{background:url(../images/common/icon_quick02.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(3) i:before{background:url(../images/common/icon_quick03.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(4) i:before{background:url(../images/common/icon_quick04.svg) no-repeat 50% 50%;}
.quick_menu li{background:#fff; border-bottom:1px dotted #ccc; transition:all 0.4s ease-out 0s;}
.quick_menu li a{display:block; padding:18px 21px;}
.quick_menu ul{overflow:hidden;background:#fff;box-shadow:7px 8px 34px 0px rgb(17 17 17 / 8%);border-radius: 13px;}
.quick_menu li:last-child{border-bottom:0;}
.quick_menu > a{display:inline-block;position:relative;margin-top:21px;padding:0 6px 7px;border-bottom:1px solid #fff;font-weight:600;font-size:12px;color: #fff;text-align:center;transition:all 0.4s ease-out 0s;}
.quick_menu li:hover{background: #ad7c62;}
.quick_menu li:hover i{color:#fff;}
.quick_menu li:nth-child(1):hover i:before{background:url(../images/common/icon_quick01_on.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(2):hover i:before{background:url(../images/common/icon_quick02_on.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(3):hover i:before{background:url(../images/common/icon_quick03_on.svg) no-repeat 50% 50%;}
.quick_menu li:nth-child(4):hover i:before{background:url(../images/common/icon_quick04_on.svg) no-repeat 50% 50%;}
.quick_menu > a svg{position:relative; top:-1px; height:6px; margin-left:9px;}

body:not(.fp-viewing-1Page, .sub) #header {
    background: #53453ba8;
}
body:not(.fp-viewing-1Page, .sub) #header > *:not(h1,.util_call, .btn_close){/* opacity:0; */}
body #header > *:not(h1){transition:all 0.2s ease-out 0s;}
body:not(.fp-viewing-1Page,
.sub) .util_call{/* top:30px !important; */}
.sub #header{transition:none; transform:translate3d(0, 0, 0) !important;}

/* footer */
#footer{position:relative; z-index:1; padding-top:45px;}
#footer .menu li{float:left; margin-right:4px;}
#footer .menu li a{display:block; padding:4px 11px; background:rgba(255,255,255,0.05); border:1px solid #ddd; font-weight:400; font-size:13px; color:#888; border-radius:4px;}
#footer .menu li:last-child a{border:1px solid #929292; font-weight:600; color:#555;}
#footer .menu{overflow:hidden; margin-bottom:30px;}
#footer .info li{float:left; margin-right:15px; font-size:14px;}
#footer .info{overflow:hidden; padding-bottom:10px;}
#footer .info li *{display:inline-block;}
#footer .info li em{opacity:0.8; margin-right:4px; font-weight:bold;}
#footer .info li p{font-weight:300;}
#footer .info li:nth-child(4){clear:both;}
#footer .info li:nth-child(3)~li{margin-top:6px;}
#footer .cpright span{display:block; padding:21px 0 80px; font-size:14px; color:#555;}
#footer .cpright span a{color:#555;}
#footer .cpright span em{}
#footer .cpright{border-top:1px solid rgba(255,255,255,0.05);}
#footer .btn_top{display:none; position:fixed; opacity:1; opacity:0; right:190px; bottom:70px; z-index:99; width:63px; width:61px; height:63px; height:61px; background:#cb1919; background-size:7px; background-position:50% 50%; font-size:0; transition:all 0.4s ease-out 0s; transform:rotate(270deg); -webkit-transform:rotate(270deg); background-repeat:no-repeat;}
#footer .btn_top.active{position:fixed; opacity:0; bottom:50px;}
#footer .btn_top.hidden{opacity:0;}
#footer .btn_top.fiexd.active{position:fixed; opacity:1; top:auto; bottom:50px;}
#footer .btn_top.fiexd{position:absolute; opacity:1; top:-24px; bottom:auto;}
#footer .wrap > *{float:left;}
#footer .wrap > h1 img{height:53px;}
#footer .wrap .inr{margin-left:65px;}

.area_notice{position:relative;background: #3f2f27;}
.area_notice ul li img{display:block; position:relative; top:10px; left:1px; height:17px; margin:0 auto;}
.area_notice ul li{float:left; margin-left:6px;}
.area_notice ul{float:right;}
.area_notice .wrap > div{float:left;}
.area_notice .wrap{overflow:hidden; padding:27px 0;}
.area_notice .wrap *{color:#fff;}
.area_notice .wrap > div > *{display:inline-block; font-size:16px;}
.area_notice .wrap > div > a{margin-left:40px; font-weight:200; font-size:14px;}
.area_notice .wrap > div > p{opacity:0.5; font-weight:200;}
.area_notice .wrap > div > em{margin-right:36px;}
.area_notice .wrap > div > a i{display:inline-block; position:relative; top:-4px; width:3px; height:3px; margin-right:13px; background:#fff; border-radius:10px;}
.area_notice .wrap > div > a i:before,
.area_notice .wrap > div > a i:after{content:""; position:absolute; top:0; width:3px; height:3px; background:#fff; border-radius:10px;}
.area_notice .wrap > div > a i:before{left:-7px;}
.area_notice .wrap > div > a i:after{right:-7px;}
.area_notice ul li a{display:block; overflow:hidden; width:36px; height:36px; background:rgba(255,255,255,0.1); text-align:center; border-radius:100px;}

@media screen and (max-width:1919px){
	.quick_menu{top:40vh; right:40px;}
}

@media screen and (max-width:1679px){
	#header nav .gnb > li a{padding:0 21px 20px;}
	#header nav .gnb > li > a{font-size:19px;}
	#header .area_util{margin-right:40px;}
	#header .util_call{right:36px;}
}

@media screen and (max-width:1500px){
	.wrap{width:auto; margin:0 80px;}
	.quick_menu{right:30px;}
}

@media screen and (max-width:1480px){
	#header .area_util{position:absolute; top:0; right:0; margin-right:0; padding:9px 30px; padding-top:0; background:#fff; border-radius:100px; border-top-right-radius:0; border-bottom-right-radius:0;}
	#header nav{float:right !important; margin-top:45px !important; margin-right:7px;}
	#header nav .gnb > li a{padding:0 27px 15px;}
	#header .area_util li a{font-weight:300; font-size:14px;}
	#header .area_util *{color:#222;}
	#header .util_call{top:138px; right:28px;}
}

@media screen and (max-width:1380px){
	#footer .wrap .inr{margin-left:0; padding-top:50px;}
}

@media screen and (max-width:1365px){
	#header nav .gnb > li a{padding:0 18px 20px;}
	#header nav .gnb > li > a{font-size:19px;}
}

@media all and (max-width:1280px){
	body,
	p,
	li,
	a{font-size:15px;}
	.wrap{margin:0 40px;}
	.quick_menu{top:auto; right:30px; bottom:31px;}
	.quick_menu li i:before{width:30px; height:25px;}
	.quick_menu li a{display:block; padding:11px 7px;}
	.quick_menu li i{font-size:12px;}
	.quick_menu > a{margin-top:12px; padding:0 3px 4px; font-size:11px;}
}

@media screen and (max-width:1279px){
	#header h1 img{height:45px;}
	#header h1 a{width:257px; padding:22px 0; background:#ad7c62;}
	#header .area_util{padding:9px 17px;}
	#header nav .gnb > li > a{font-size:18px;}
	#header nav .gnb > li a{padding:0 14px 10px;}
	#header nav{margin-top:36px !important;}
	#header .util_call a{font-size:25px;}
	#header .util_call{padding:17px 19px;}
	#header .util_call{top:116px;}
}

@media all and (min-width:1024px){
	#header nav{display:block; margin-top:21px; margin-left:20px; background:none !important;}
	#header nav .gnb > li ul{display:none;position:absolute;opacity:0;visibility:hidden;top:15px;right:-20px;width:100%;padding:8px 17px;background:#fff;box-shadow:15px 20px 29px 0px rgba(0, 0, 0, 0.23);transition:all 0.4s ease-out;transition-property:opacity, top, visibility;transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul.active{display:block; transition-delay:0.1s;}
	#header nav .gnb > li.active ul{opacity:1; visibility:visible; top:58px; z-index:10; transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul > li > a{display:block; position:relative; padding:10px 0px; background:#fff; border-top:1px solid #e1e1e1; font-size:16px; color:#404040; text-align:left; transition:all 0.3s ease 0s;}
	#header nav .gnb > li ul > li > a:hover{opacity:0.5;}
	#header nav .gnb > li ul > li:first-child > a{border-top-width:0px;}
	a[data-link="call"]{cursor:auto; pointer-events:none;}
}

@media all and (max-width:1023px){
	a.btn_basic{width:158px; padding:18px 8px; font-size:14px;}
	.wrap{margin:0 20px;}
	#header{position:fixed;}
	#header .area_util{width:100%; padding:0; border-top:0; border-radius:0;}
	#header .area_util{display:none; top:89px; border-top:1px solid #ddd;}
	#header .area_util li{flex:1;}
	#header .btn_menu.active > span:nth-of-type(1),
	#header .btn_menu.active > span:nth-of-type(3){background:#000; transition-delay:0s, 0.3s;}
	#header .btn_menu,
	#header .btn_close{display:block;}
	#header nav{margin-top:0 !important;}
	#header nav{position:fixed; top:0px; right:-100%; z-index:998; width:49%; height:100vh; margin:0; background:#fff; background-size:500px; background-position:130px 80%; background-repeat:no-repeat;}
	#header nav.active{right:0px; box-shadow:-5px 0px 15px rgba(0,0,0,0.1); transition:all 0.5s ease-out 0s;}
	#header nav .gnb > li{display:block;}
	#header nav .gnb{position:absolute;top: 18vh;right:0px;width:100%;overflow-y:auto;}
	#header nav .gnb > li{padding:0 0px; text-align:left;}
	#header nav .gnb > li > a{display:block; padding:10px 30px; font-family:'AritaBuri'; font-weight:800; font-size:24px; color:#111; transition:all 0.3s ease 0s;}
	#header nav .gnb > li ul{display:none; padding:0px 0 20px;}
	#header nav .gnb > li ul > li > a{display:block; padding:4px 32px; font-weight:200; font-size:16px; color:#888;}
	#header nav .gnb > li ul li.active a{color:#eeaf5e;}
	body:not(.fp-viewing-1Page) #header{transition:none;transform:none;background: #ad7c62;}
	#header .btn_menu > span{background: #222;}
	#header .btn_menu{top:24px; right:20px;}
	#header .util_call{position:absolute; top:6px; right:47px; padding-top:16px; /*background:none;*/ box-shadow:none;}
	#header .util_call a{font-size:22px;}
	#header .area_util li a{padding:14px 0;}
	#header .area_util > ul{width:100%; margin-right:0;}
	#header .area_util li{width:-webkit-calc(100%/5); width:calc(100%/5); margin-left:0;}
	#header .area_util li a{text-align:center;}
	body:not(.fp-viewing-1Page, .sub) #header > *:not(h1, .util_call, .btn_close){opacity:1;}
	body:not(.fp-viewing-1Page,
	.sub) .util_call{top:6px !important;}
	.quick_menu{top:auto; right:0; bottom:0; z-index:99; width:100%; box-shadow:7px 8px 34px 0px rgb(17 17 17 / 7%);}
	.quick_menu ul{background:#fff; border-top-left-radius:0; border-bottom-right-radius:0;}
	.quick_menu li{float:left; width:-webkit-calc(100%/5); width:calc(100%/5);}
	.quick_menu li a{padding:10px 0px 7px; border-right:1px dotted #ddd;}
	.quick_menu > a{position:absolute; top:0; right:0;}
	.quick_menu > a{border-bottom:0;}
	.quick_menu > a{top:0; width:19%; height:auto; margin-top:0; padding:25px 3px; background:#2a2623; border-bottom:0; color:#fff;}
	.quick_menu > a svg polyline{stroke:#000 !important;}
	.fp-viewing-3Page .quick_menu > a,
	.fp-viewing-4 .quick_menu > a{border-bottom:0; color:#fff;}
	.quick_menu > a svg polyline,
	.fp-viewing-3Page .quick_menu > a svg polyline,
	.fp-viewing-4 .quick_menu > a svg polyline{stroke:#fff !important;}
	.quick_menu li i:before{margin:0 auto 4px;}
	#footer{padding-bottom:80px;}
	.quick_menu > a{color:#fff !important;}
	.fp-viewing-3Page #fp-nav,
	.fp-viewing-3Page .quick_menu,
	.fp-viewing-4 .quick_menu,
	.fp-viewing-4Page .quick_menu{opacity:1 !important; visibility:visible !important;}
}

@media all and (max-width:767px){
	.wrap{margin:0 15px;}
	a.btn_basic{width:auto; padding:15px 35px; font-weight:300; font-size:12px;}
	.btn_basic:hover .arrow{margin-left:-8px; padding-right:8px;}
	.btn_basic:hover .arrow:after{right:-8px;}
	.btn_basic .arrow:after{top:1px; width:5px;}
	.quick_menu{top:auto; right:0;}
	.quick_menu ul{border-bottom-left-radius:0;}
	.quick_menu li{border-bottom:0;}

	body,
	p,
	li,
	a{/* font-family:'Bitter', Sans-serif; */font-size:14px;}

	#header h1 a{width:155px; padding:14px 0;}
	#header .area_util{top:60px; border-top:1px solid #ddd;}
	#header h1 img{height:54px; margin-left:14px;}
	#header .btn_menu{top:21px; right:15px; width:20px; height:21px;}
	#header .btn_menu > span:nth-of-type(3){top:15px;}
	#header .btn_menu > span{height:1px;background: #fff;}
	#header .header_top .wrap{margin:0;}
	#header nav{width:100%;}
	#header nav .gnb > li > a{padding: 9px 45px;font-size:21px;}
	#header nav .gnb > li > a.on{font-weight:700;}
	#header nav .gnb > li ul > li > a{padding: 4px 46px;font-size:15px;}
	#header nav .gnb > li > a.on,
	.sub #header nav .gnb > li > a.on{color:#111;}
	#header nav .gnb > li ul li.active a{font-weight:500; color:#9c6942;}
	#header .header_top{border-bottom:1px solid #e6e6e6;}
	#header .area_util *{color:#222;}
	#header .area_util{background:#fff;}
	#header .util_call{display:none;}
	#header .area_util li a{opacity:1; padding:8px 0; font-size:12px;}
	#header h1 img{height:32px;}
	#header .btn_menu.on > span{/* background:#222; */}

	.area_notice .wrap > div > *{display:block; font-size:14px;}
	.area_notice .wrap > div > a{display:none;}
	.area_notice .wrap{padding:14px 0;}
	.area_notice .wrap > div > p{margin-top:2px;}
	.area_notice ul{position:absolute; top:85px; right:15px; z-index:9;}
	.area_notice ul li a{background:#b4aba7;}
	.area_notice ul li img{left:0; height:16px;}
	.area_notice ul li{margin-left:2px;}

	#footer{overflow:hidden;}
	#footer .menu{padding-top:35px;}
	#footer .menu li a{padding:5px 8px; font-size:12px;}
	#footer div:last-child span{padding:14px 0; font-size:12px;}
	#footer ul:last-child{padding-bottom:10px;}
	#footer ul:last-child li{width:100%; margin:0 0 8px;}
	#footer ul:last-child li em{display:block; margin:0 0 3px;}
	#footer ul:last-child li:nth-child(4){float:left; width:100%; clear:none;}
	#footer .menu{padding-top:0;}
	#footer .wrap > h1 img{height:43px;}
	#footer .wrap .inr{padding-top:30px;}
	#footer .info li:nth-child(4){clear:none;}
	#footer .info li{margin-right:8px; font-size:13px;}
	#footer .info li:nth-child(3)~li{margin-top:0;}
	#footer .info{padding-bottom:0;}

	.quick_menu li i{font-size:inherit;}
	.quick_menu li i:before{height:22px;}
	.quick_menu li i:before{margin:0 auto 5px;}
	.quick_menu li a,
	.quick_menu > a{ height: 100%; padding:21px 0px; box-sizing: border-box; font-size:14px;}
	.quick_menu > a.btn_top{ display: flex; align-items: center; justify-content: center; width: 20%; }
	.quick_menu > a svg{height:5px;}


}

@media all and (max-width:405px){
	body,
	p,
	li,
	a{font-size:13px;}
}

@media all and (max-width:330px){
	a.btn_basic{padding:12px 28px; font-weight:300; font-size:12px;}
	a.scroll_down{display:none;}
	.quick_menu li i{font-size:11px;}
	.quick_menu li i:before{height:23px;}
	#footer .menu li a{padding:3px 4px; font-size:12px;}
	#footer .menu{margin-bottom:20px;}
}

/* 모바일에서 lnb 크기 변경 */
@media(max-width:767px){
	#wrap .lnb{
		.wrap{ margin: 0; }
		.dept{ display: grid; grid-template-columns: 39px 1fr 1fr; }
		.dept > li{ float: none; margin: 0; max-width: none; width: auto; height: auto; }
		.home{ width: 39px; background-position: 50%; }
		.home a{ margin: 0; }
		.dept_tit a{ padding-right: 30px }
		.dept_tit a, .dept .dept_list li a{ margin: 0; padding: 13px!important; font-size: 13px; }
		.dept_tit a:after{ right: 15px; }
	}
}

@media(min-width:768px){
	.show-mob{ display: none; }
}