th[data-view="file"] + td ul li a{line-height:1em;}

.wrap{width:1200px;}
#layer_25{z-index:9999 !important;}

body{font-size:16px; word-break:keep-all;}
body *{box-sizing:border-box;}
p, li, a{line-height:1.7; font-weight:300; font-size:18px; color:#666;}
h1, h2, h3, h4, h5, h6{color:#222;}
b{font-weight: 500; color:#000 !important;}
strong{font-weight: 700; color:#000 !important;}

a.btn_basic{display:inline-block; position:relative; padding:22.5px 15px; min-width: 236px; border:1px solid #fff; color:#fff !important; font-weight:700; font-size:14px; text-align:center; transition:all 0.3s ease-out 0s;}
a.btn_basic:after{content:""; position:absolute; top:50%; right:25px; width:16px; height:9px; transform:translateY(-50%);}
a.btn_basic.v2{letter-spacing: 6px; font-weight: 300; font-size: 16px;}
a.btn_basic.v2:active,
a.btn_basic.v2:hover{background-color: #fff; color:#222 !important; font-weight: 700 !important;}
a.btn_basic.v3{letter-spacing: 6px; color:#222 !important; border-color:#444;}

.scrolldown{position:absolute; z-index:9; transform:translateX(-50%);}
.scrolldown i{position: relative; display:block; opacity:0; margin:0 auto; width:0; height:0; margin:0 auto; border:5px solid transparent; border-top-color:#fff; animation:scrollDown 1.4s ease 0s infinite;}
.scrolldown i:after{content:""; position:absolute; opacity:0.2; top:0; left:0; z-index:-1; width:100%; height:100%; background:red; transform:scaleX(1); animation:scrollDown02 1.5s ease 0s infinite; border-radius:40px;}
.scrolldown i + i{margin-top:5px;}
.scrolldown a{font-weight:400; font-size:12px; color:#fff;}
.scrolldown i:nth-child(3){animation-delay:0.05s;}
.scrolldown i:nth-child(4){animation-delay:0.1s;}
.scrolldown em{display:block; margin-bottom:30px; text-transform: uppercase;}

.open{transform:translate(-50%, -50%) rotate(135deg);}
.open::before{top:0; transform:translateX(100%) rotate(-90deg);}
.open::after{bottom:0; transform:translateX(-100%) rotate(-90deg);}

.nodata{position: relative; text-align:center; padding:125px 0; font-weight:500; color:#999; background-color: rgba(255,255,255,0.025); border:1px solid rgba(0,0,0,0.07);}

/* header */
#header{position:absolute; top:45px; z-index:99; width:100%; transition:top 1s .2s, border .3s;}
#header h1{position:absolute;top: -28px;left:90px;width: 310px;height: 90px;}
#header h1 > a{display:block; width:100%; height:100%; background:url(../img/logo.svg) no-repeat 50% 50%; background-size:contain; font-size: 0; text-indent: 100%;}

#header .area_util{position: absolute;; top:6px; left:400px; z-index:999;}
#header .area_util ul{display: block; padding-top: 6px; width:auto; height: 38px; background-color: rgba(255,255,255,0.12); border-radius: 30px;}
#header .area_util ul li{position:relative; float:left;}
#header .area_util ul li a{position:relative; padding:0 22px; font-size:13px; font-weight:700; color:rgba(255,255,255,0.3); transition:all 0.3s ease-out 0s;}
#header .area_util ul li a:hover{color:rgba(255,255,255,1);}
#header .area_util ul li a:after{content:""; position:absolute; opacity:0.2; top:2px; left:0; width:1px; height:11px; background:#fff;}
#header .area_util ul li:first-child a:after{background:none !important;}
#header .area_util ul li a + i{position:absolute; opacity:0; top:50px; left:50%; padding:8px 20px; font-weight:400; font-size:12px; transition:all 0.3s ease-out 0s; transform:translateX(-50%); background-image:linear-gradient(-60deg, #f8d362, #00974a); border-radius:4px;}
#header .area_util ul li a:hover + i{opacity:1; top:35px;}
#header .area_util ul li a:hover + i:after{content:""; position:absolute; top:-5px; left:50%; width:0; height:0; border-right:5px solid transparent; border-bottom:5px solid #e36f3d; border-left:5px solid transparent; transform:translateX(-50%);}
#header .area_util > a{display:block; position: fixed; top:23px; right:85px; padding:43px 35px; transition:background 0.3s ease 0s;}
#header .area_util > a i{display:block; position:relative; font-size: 0px; text-indent: 100%;}
#header .area_util > a div{position:absolute; top:38px; left:50%; margin-left:-20px; width:40px; height:16px;}
#header .menu-btn1 {width: 40px;height: auto;cursor: pointer;position: fixed;display: block;right: 155px;padding-top: 6px;}
#header .menu-btn1 img {width: 100%; height: auto;}

#header .btn_menu{transition:all 0.3s ease 0s;}
#header .btn_menu div > span{display:block;position:absolute;left:0px;width:40px;height:2px;background:#fff;}
#header .btn_menu div > span:nth-of-type(1){top:0;}
#header .btn_menu div > span:nth-of-type(2){top:50%; margin-top:-1px; transition:background 0.3s ease 0s;}
#header .btn_menu div > span:nth-of-type(3){top:15px;}
#header .btn_menu div > span:nth-of-type(1),
#header .btn_menu div > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}

#header .btn_menu.active div{top:43px;}
#header .btn_menu.active div > span:nth-of-type(1){top:10px; transform:rotate(-45deg);}
#header .btn_menu.active div > span:nth-of-type(2){background:transparent;}
#header .btn_menu.active div > span:nth-of-type(3){top:10px; transform:rotate(45deg);}
#header .btn_menu.active div > span:nth-of-type(1),
#header .btn_menu.active div > 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;}
.active #header .area_util ul{display:none;}
.active .all_menu .info > i:first-child i{visibility:visible; width:100%;}
.active .all_menu .info > i:last-child i{visibility:visible; width:100%;}
.active .all_menu .cate{opacity:1; visibility:visible; height:100vh;}
.active .all_menu .info > i i{opacity:1;}
.active .all_menu .cate > ul{opacity:1;transition: all 1.3s ease-out 0.4s;}

.active .all_menu .cate .gnb{transform:translateY(0px);}

#header nav{display:block; position:absolute; top:0; right:200px;}
#header nav .gnb{}
#header nav .gnb > li{display:inline-block; position:relative; padding:10px 40px;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{display:inline-block; padding-bottom:30px; font-size:18px; color:#fff; transition:all 0.3s ease-out 0s;}
#header nav .gnb > li > a > i{display:none;}
#header nav .gnb > li > a:hover{color:#00ff6a;}
#header nav .gnb > li > a.on{color:#00ff6a;}

.all_menu{position:fixed; visibility:hidden; bottom:0; left:0; z-index:999; width:100%; height:100%; background:#fff; transition:transform 0.9s cubic-bezier(0.6,0.05,0.01,0.99);}
.all_menu > div{position:absolute; float:left; height:100vh; transition:all 1.3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.all_menu .info{right:0; width:690px; border:0;}
.all_menu .info > i{display:block; position:relative; float:left; width:100%;}
.all_menu .info > i:last-child{height:50vh; background-position:80% 50%;}
.all_menu .info > i:first-child{width:100%; height:50vh;}
.all_menu .info > i i{display:block; position:absolute; opacity:0; visibility:hidden; transition:all 1.5s cubic-bezier(0.6,0.05,0.01,0.99);}
.all_menu .info > i:first-child i{left:0; width:0; height:100%;}
.all_menu .info > i:last-child i{top:0; right:0; width:0; height:100%; background-position:50% 0%;}
.all_menu .cate{position:relative; opacity:0; top:0;left:0; width:-webkit-calc(100% - 690px); width:calc(100% - 690px); height:0; background:#fff; transition-delay:0.3s;}
.all_menu .cate .inr{position:absolute; right:50px; bottom:50px;}
.all_menu .cate .inr li em{display:block; margin-bottom:17px; font-weight:900; font-size:17px; color:#222; letter-spacing:-0.03rem;}
.all_menu .cate .inr li p{line-height:1.6; font-size:14px;}
.all_menu .cate .inr li{float:left; padding:0 40px;}
.all_menu .cate .inr li:first-child{border-right:1px solid #ddd;}
.all_menu .cate .inr li p i{display:block; color:#00974a;}
.all_menu .cate .gnb{margin:36vh 10px 0 90px;transform: translateY(-90px);}
.all_menu .cate .gnb > li{float:left; width:33%;}
.all_menu .cate .gnb > li > a > p{display:none;}
.all_menu .cate .gnb > li > a{font-weight:800; font-size:35px; color:#222; letter-spacing:-0.02em;}
.all_menu .cate .gnb > li > ul li a{display:block; padding:6px 0; font-family:Noto Sans KR , Sans-serif; font-weight:300; color:#666;}
.all_menu .cate .gnb > li > ul{margin-top:20px;}
.all_menu .cate > ul{opacity:0; transition:all 0.3s ease-out 0s;}

.main.on #header{top:-80px;}
.main.on a.btn_contact{background:#cdc07c;}
.main.on#header .btn_menu.active i{font-weight:800; color:#222;}
.main.on#header .btn_menu.active div > span{background:#222;}

/* footer */
#footer .inr{overflow:hidden; width:1300px; margin:0 auto;}
#footer > .inr{padding:40px 0;text-align: center;}
#footer h1 img{height:43px;}

#footer div[data-footer]{position:relative; float:left;}
#footer div[data-footer="01"]{margin:15px 0 65px;}
#footer div[data-footer="01"] p{font-size:13px;}
#footer div[data-footer="01"] p em{font-weight:600; color:#00974a;}
#footer div[data-footer="01"] p em + a{position:relative; top:-1px; margin-left:3px; padding:1px 5px; background:#00974a; font-weight:400; font-size:10px; color:#fff; border-radius:3px;}
#footer div[data-footer="01"] p > br{display: none;}
#footer .copyright{padding:20px 0; font-size:13px;}

.sub #footer{padding:60px 0 50px;}
.color #header nav .gnb > li > a{color:#222;}
.color #header .area_util{background:#fffcf5;}
.color #header h1 img:last-child{display:block;}
.color #header h1 img:first-child{display:none;}

#top-btn { 
  display: none; 
  position: fixed;
  cursor: pointer;
  bottom: 40px;
  right: 40px;
  z-index: 999;
  width:50px;
  height:50px;
  background:#000;
	border-radius:50%;
  text-indent:-9999px;
}
#top-btn:before,#top-btn:after{
  content:'';
  width:18px;
  height:4px;
  position:absolute;
  top:48%;
  border-radius:5px;
  background:#fff
}
#top-btn:before{
  left:21px;
  transform:translateY(-50%) rotate(45deg)
}
#top-btn:after{
  right:21px;
  transform:translateY(-50%) rotate(-45deg)
}

/* btn top */
.scroll_path{display:block; position:fixed; opacity:0; visibility:hidden; right:50px; bottom:50px; z-index:999; width:61px; height:61px; box-shadow:inset 0 0 0 3px rgba(0,0,0,0.1); transition:all 200ms linear; transform:translateY(15px); cursor:pointer; border-radius:50px; -webkit-transition:all 200ms linear;}
.scroll_path.active{opacity:1; visibility:visible; transform:translateY(0);}
.scroll_path::after,
.on .fix .scroll_path::after{content:""; display:block; position:absolute;color:#000; opacity:1; top:50%; left:0; left:50%; z-index:1; width:14px; height:12px; margin:-6px 0 0 -7px; background:url(../img/btn_top.svg) no-repeat 50% 50%; background-size: 100%; transform:rotate(90deg); transition:all 200ms linear; cursor:pointer; -webkit-transition:all 200ms linear;}
.scroll_path a{display:block; width:100%; height:100%;}
.scroll_path::before{position:absolute;}
.scroll_path:hover::before{opacity:1;}
.scroll_path svg path{fill:none;}
/* .scroll_path svg.progress-circle path,
.on .fix .scroll_path svg.progress-circle path{box-sizing:border-box; transition:all 200ms linear; stroke:#83c7a4; stroke-width:4; -webkit-transition:all 200ms linear;} */

@media screen and (max-width:1919px){
	.all_menu .cate .gnb{margin:36vh 10px 0 50px;}
}

@media screen and (max-width:1650px){
	#header h1{top:-7px; left:50px;}
	#header nav{right:617px;}
	#header nav .gnb > li{padding:0 30px;}
	#header nav{display:none;}
	#header .area_util{top:0px; left:320px;}
	#header .area_util > a{right:0px;}
	#header .menu-btn1 {right: 70px;padding-top: 5px;}
	#header .btn_menu div > span:nth-of-type(3){top:14px;}
}

@media all and (max-width:1580px){
	.all_menu .info{width:520px;}
	.all_menu .cate{width:-webkit-calc(100% - 520px); width:calc(100% - 520px);}
	.all_menu .cate .gnb > li > a{font-size:30px;}
	.all_menu .cate .inr{right:10px;}

	#footer > .inr{width:auto; padding:40px 60px;}
    #footer .copyright .inr{width:auto; margin:0 60px;}
    
    .nodata{padding:100px 0;}
}

@media all and (max-width:1280px){
	p,
	li,
	a{font-size:15px;}
	a.btn_basic{padding:17px 25px; min-width: inherit;}
	#header .btn_menu.active i{font-weight:800; color:#222;}
	#header .btn_menu.active div > span{background:#222;}
	.all_menu .info{display:none;}
	.all_menu .cate{width:100%;}

	#footer > .inr{padding:40px 40px;}
    #footer .f_select{bottom:10px;}
    #footer .f_select .f_select_btn{padding:23px 70px 23px 23px;}
}

@media all and (min-width:1024px){
	#header nav .gnb > li ul{display:none; position:absolute; opacity:0; visibility:hidden; top:35px; right:-25px; min-width: 170px; width:100%; padding:9px 12px; background:#fff; border:1px solid #444; 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:55px; z-index:10; transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul > li > a{display:block; position:relative; padding:11px 11px; background:#fff; border-top:1px solid #e1e1e1; font-size:15px; 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;}
	#header nav .gnb > li ul > li.active  > a{color:#222;}
}

@media all and (max-width:1023px){
	#header{top:33px;}
	#header h1{left:40px;}
	#header h1 img{height:36px;}
	#header .btn_menu,
	#header .btn_close{display:block;}
    #header .btn_menu.active div{top:27px;}
    #header .btn_menu.active div > span{background:#222;}
    #header .btn_menu div > span{width:100%;}
    #header .btn_menu div > span:nth-of-type(2){top:38%;}
    #header .btn_menu div > span:nth-of-type(3){top:10px;}
    .color #header .btn_menu div > span{background:#222;}

    #header .area_util{position:absolute;}
    #header .area_util > a{top:2px; padding:0;}
    #header .area_util > a i{display:none;}
    #header .area_util > a div{top:45px; right:16px; left:auto; width:23px; height:17px;}
	#header .menu-btn1 {width: 35px;right: 55px;padding-top: 3px;}
    
    .all_menu .cate .gnb{margin:18vh 10px 0 50px;}
    .all_menu .cate .gnb > li{margin-bottom:40px; width:50%;}
	
	#footer > .inr{padding:40px 30px;}
	#footer h1 img{height: 34px;}
	#footer div[data-footer="00"]{margin-top: 0;}
	#footer div[data-footer="00"] > div,
	#footer div[data-footer="00"] > div > ul > li{width:100%; margin-right:0; padding-right:0;}
	#footer div[data-footer="00"] > div > ul li:after{display:none;}
	#footer div[data-footer="00"] > ul li > a{padding:5px 21px; font-size:12px;}
	#footer div[data-footer="00"] > div > ul li:nth-child(5){margin-top:0;}
	#footer div[data-footer="01"]{margin:0;}	

	.sub #footer{padding:40px 0; margin-top:40px;}
}

@media all and (max-width:767px){
	body,
	p,
	li,
    a{font-size:14px;}
    a.btn_basic.v2,
    a.btn_basic{padding:17px 25px; font-size:13px;}
    
    #header{top:23px;}
	#header h1{top:-10px; left:15px; width:210px; height:50px;}
    #header h1 img{height:32px;}
    #header .area_util{top:6px; left:205px;}
    #header .area_util ul{padding:0; width:141px; background-color: transparent; border-radius: 0;}
    #header .area_util ul li a{padding:0 10px; font-size: 12px;}
    #header .area_util ul li a:after{top:5px; width:3px; height: 3px; border-radius: 50%;}
    #header .area_util > a div{top:30px;}
	#header .menu-btn1{right: 50px;top: 18px;}
    
	#footer > .inr{padding:30px 20px;}	
	#footer .copyright{padding:10px 0; font-size:12px;}
	#footer .copyright > div{width:auto; padding:0 20px;}
	#footer div[data-footer="01"] p{font-size:12px;}
	#footer .copyright .inr{margin:0;}	
	#footer div[data-footer="00"]{margin-top:0px; width:100%;}
	#footer div[data-footer="00"] > div > ul li *{font-size:13px;}
	#footer div[data-footer="00"] > ul li > a{padding:5px 14px; font-size:11px;}
    #footer div[data-footer="00"] > div > ul li *{font-weight:400; color:#888;}
    #footer .f_select .f_select_btn{padding:14px 80px 14px 20px;}

    #footer p br{display: block;}
	.scroll_path{right:15px; bottom:30px; width:50px; height:50px;z-index:95}
	.scroll_path::after,
	.on .fix .scroll_path::after{width:12px; margin-left:-6px;}
}

@media all and (max-width:500px){
    #header nav{position:fixed; top:0px; right:-100%; z-index:998; width:100%; height:100%; margin:0; background:#fff;}
    #header nav.active{right:0px; box-shadow:-5px 0px 15px rgba(0,0,0,0.1); transition:all 1s cubic-bezier(0.165, 0.84, 0.44, 1);}
    #header nav .gnb{top:90px; text-align: center;}
    #header nav .gnb > li{display:block;}
    #header nav .gnb{position:absolute; top:110px; right:0px; width:100%; overflow-y:auto;}
    #header nav .gnb > li{padding:0;}
    #header nav .gnb > li > a{display:block; padding:14px 0; font-size:21px; 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:8px 0px; font-size:15px;}
    #header nav .gnb > li ul li.active a{color:#00974a;}
    #header nav .gnb > li > a.on{color:#00974a;}
    #header nav .gnb > li > a p{font-weight:600; font-size:21px; letter-spacing:-0.03em;}
    #header nav .gnb > li:hover > a{opacity:1; color:#111;}
    #header nav:after{content:""; opacity: 0.5; position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; background:#fff url(/images/common/img_mark.svg) no-repeat 89% 90%; background-size:70%;}
    #header nav{display:block;}

    .all_menu{display:none;}

    #footer div[data-footer="01"] p > br{display: block;}
    #footer .f_select .f_select_list{max-height: 138px;}
    #footer .f_select .f_select_btn span{font-size:11px;}
}

@media all and (max-width:400px){	
	#header > .area_util{left: 200px;}
	#header .btn_menu{top:25px;}
	#header nav .gnb > li > a{font-size:18px;}
	
	#footer .f_select{margin:10px 0 20px 0px;}
	#footer h1 img{height: 30px;}
	#footer div[data-footer="00"] > ul li > a{padding:5px 14px;}
	#footer div[data-footer="00"] > ul li,
    #footer div[data-footer="00"] > div > ul li{margin:0 5px 5px 0;}
}

@media all and (max-width:390px){	
    #header h1{top:15px;}
    #header > .area_util{top:-15px; left: inherit; right:5px;}
    #header .area_util ul{width:auto;}
    #header .area_util > a div{top:45px;}

    #footer div[data-footer="01"] p > br{display: none;}
}

@keyframes scrollDown{
	0%{opacity:0;}
	100%{opacity:1;}
}

@keyframes scrollDown02{
	0%{transform: scale(1); opacity: 0.2;}
	40%{opacity: 0.2;}
	100%{transform: scale(2); opacity: 0;}
}

@keyframes spotscales {
	0%{opacity:1; transform:scale(0);}
	40%{opacity:0.1; transform:scale(4);}
	100%{opacity:0; transform:scale(0);}
}