@charset "utf-8";
@import url(../img/Roboto/Roboto.css);

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
 i.fa{font-style:normal !important;}

mark {background-color:#fff;color:#000;font-style:italic;font-weight:bold;}
del {text-decoration: line-through}
abbr[title], dfn[title] {border-bottom:1px dotted;cursor:help;}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}
input, select {vertical-align:middle;resize:none}
caption, th, td {font-weight:normal}
table caption {visibility:hidden;width:0;height:0;overflow:hidden}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal}
img {border:0;vertical-align:middle}
legend {display:none}

body{min-width:100%; font-size:16px;background:#fff; color:#000; -webkit-text-size-adjust:none; }
body, select,input,textarea {font-size:1em;  line-height:160%; font-family: "Roboto","맑은 고딕","Nanum Gothic","Gulim", "dotum",Helvetica, sans-serif; color:#000; letter-spacing:0px}
input{font-size:1em;}
iframe#hiddenframe {display:none;width:0;height:0}
label,button{cursor:pointer}
 input, button, select, textarea { outline: none;border-radius: 0;}

a{color:#000;text-decoration:none}
a:hover, a:focus{color:#F33;text-decoration:none}

hr{padding:0; margin:0; border:0; display:block; float:none; clear:both; border:0; height:0; width:100%; font-size:0 !important; line-height:0 !important; overflow:hidden; margin:0 !important; padding:0 !important;}
body,html{height:100%;}

@media (min-width:769px){
.nop{display:none; position:absolute; width:0; height:0; overflow:hidden;}
}


.clear{display:block; float:none; clear:both; border:0; height:0; width:100%; font-size:0 !important; line-height:0 !important; overflow:hidden; margin:0 !important; padding:0 !important;}
.wrap{max-width:1200px; margin:0 auto; position:relative; zoom:1;}
.wrap:after {display:block;visibility:hidden;clear:both;content:""}


/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;width:970px;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #EEE;background:#fff}
.hd_pops.mobile {display:none;}
.hd_pops_con {}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}


#header{position:fixed; top:0; left:0; right:0; z-index:20; background:rgba(0,0,0,.5); }
#header:after {display:block;visibility:hidden;clear:both;content:""}
#header h1{float:left; }
#header h1 img{height:100px;}



@media (max-width:768px){
button,input[type="button"],input[type="submit"],input[type="reset"],input[type="file"]{-webkit-appearance:button;border-radius:0}
.nom{display:none; position:absolute; width:0; height:0; overflow:hidden;}
/* 팝업레이어 */
#hd_pop {margin:0 auto;width:auto;height:0}
.hd_pops {position:absolute;border:1px solid #EEE;background:#fff; top:0 !important; left:0 !important;}
.hd_pops.mobile {display:none; }
.hd_pops img{max-width:100%;}
.hd_pops_con {width:auto !important; height:auto !important;}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px ;border:0;background:#393939;color:#fff}
.hd_pops.mobile {display:block;}
.hd_pops.pc {display:none;}
#header h1 img{height:80px;}
}

#btnAllmenu{ position:absolute;display:none;   background:transparent; width:50px; height:40px; margin-top:-20px; border:0;  right:10px; top:50%;   text-indent:-1000px; overflow:hidden; box-sizing:border-box;}
#btnAllmenu:after{position:absolute;   border-top:2px solid #fff; border-bottom:2px solid #fff;   top:20%;  bottom:20%; left:20%; right:20%; content:"";}
#btnAllmenu:before{position:absolute; height:2px; top:50%; margin-top:-1px; left:20%; right:20%; background:#fff; content:"";}


#topMenu{position:relative;float:right;  }
#topMenu dl{}
#topMenu dd{float:left; position:relative; }
#topMenu dd > a{position:relative; text-align:center; z-index:2; display:block; font-size:1.1em; COLOR:#fff;;  line-height:100px; height:100px; padding:0 30px; }
#topMenu dd:hover > a{color:#FD0}

@media (max-width:768px){
#btnAllmenu{display:block;}
#topMenu{display:none;}
}
#mobileMenu{position:fixed; display:none; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:99 }
#mobileMenu ol{border-bottom:1px solid #DDD; line-height:40px; text-align:center; }
#mobileMenu ol:after {display:block;visibility:hidden;clear:both;content:""}
#mobileMenu ol li{display:inline-block; padding:0 20px}
#mobileMenu > a{position:absolute; right:100%; width:70px; background:#333; height:60px;  text-indent:-1000px; overflow:hidden;}
#mobileMenu > a:after{position:absolute; left:50%; top:50%; margin-left:-20px; margin-top:-1px; width:40px; height:2px; background:#FFF; content:"";
transform:rotate(45deg);-ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg);-o-transform:rotate(45deg); }
#mobileMenu > a:before{position:absolute; left:50%; top:50%; margin-left:-20px; margin-top:-1px; width:40px; height:2px; background:#FFF; content:"";
transform:rotate(-45deg);-ms-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -webkit-transform:rotate(-45deg);-o-transform:rotate(-45deg); }
#mobileMenu section{position:absolute; right:-70%; top:0; width:70%; height:100%; background:#FFF; overflow:auto; }
#mobileMenu dl dd > a{position:relative; display:block; padding-left:30px; font-size:1.2em;  border-bottom:1px solid #EEE; line-height:45px;}
#mobileMenu dl dd > a i{position:absolute; line-height:30px; top:0; right:0; width:40px; text-align:center; line-height:30px; color:#5a5757}
#mobileMenu dl dd > ul{display:none;}
#mobileMenu dl dd > ul a{display:block; background:#F6F6F6; padding-left:40px;  border-bottom:1px solid #FFF; line-height:40px;}


#main_visual{position:relative; z-index:1;  overflow:hidden; }
#main_visual ul{position:relative; z-index:1;}
#main_visual li{background-position:center center;  width:100%;  background-repeat:no-repeat; height:700px; background-size:cover;  }
#main_visual .swiper-pagination{position:absolute; z-index:10; bottom:30px; width:100%;}
#main_visual .swiper-pagination-bullet{position:relative; width:12px; height:12px;margin:0 5px; border-radius:8px; background:transparent; opacity:1; border:2px solid #FFF; }
#main_visual .swiper-pagination-bullet-active{background-color:#FFF;}
#main_visual .swiper-pagination-bullet-active:after{position:absolute; top:-5px; left:-5px; bottom:-5px; right:-5px; border:1px solid #FFF; content:""; border-radius: 50%;-moz-border-radius: 50%; -webkit-border-radius: 50%; }
#main_visual section{position:absolute; top:100px; left:0; right:0; color:#FFF; text-align:center; bottom:0; z-index:4;display: -webkit-flex;  display: flex;flex-direction:column; justify-content:center; align-items:center; }
#main_visual section h4{ font-size:1.6em; font-weight:bold; line-height:100%; margin-bottom:20px;}
#main_visual section h2{ position:relative; font-size:2.4em; font-weight:bold; line-height:140%; }
#main_visual section h2 strong{display:inline-block;  vertical-align:middle; }
#main_visual section h2:before{display:inline-block;vertical-align:middle; width:40px;  height:100px;  border:8px  solid #FFF; border-right:0; content:"";  }
#main_visual section h2:after{display:inline-block; vertical-align:middle;width:40px;  height:100px;  border:8px  solid #FFF; border-left:0; content:""; }
#main_visual section h6{ margin-top:2vw; line-height:130%;  font-size:1.2em; }
#main_visual section p{position:relative; margin-top:5%; }
#main_visual section p a{display:inline-block; line-height:60px; font-size:1.2em;  background:#F44; padding:0 30px; color:#FFF;}
#main_visual section p a:first-child{background:#FD0; color:#000; margin-right:20px;}

@media (max-width:980px){

#main_visual li{ height:70vh; }
#main_visual section h4{ font-size:2.4vw;  margin-bottom:2vw;}
#main_visual section h2{ font-size:3.2vw;  line-height:140%; }
#main_visual section h2:before{ width:2vw;  height:7vw;  border:.8vw  solid #FFF; border-right:0; content:"";  }
#main_visual section h2:after{ width:2vw;  height:7vw;  border:.8vw  solid #FFF; border-left:0; content:""; }
#main_visual section h6{ margin-top:2vw;font-size:2vw;   }
#main_visual section p a{ line-height:6vw; font-size:2vw;   padding:0 2vw;}
}

@media (max-width:768px){

#main_visual section{position:absolute; top:80px; }

#main_visual section h4{ font-size:4vw; margin-bottom:6vw; line-height:140%;}
#main_visual section h2{ font-size:4.6vw;  line-height:140%; }
#main_visual section h2:before{ width:2vw;  height:16vw;  border:.8vw  solid #FFF; border-right:0; content:"";  }
#main_visual section h2:after{ width:2vw;  height:16vw;  border:.8vw  solid #FFF; border-left:0; content:""; }
#main_visual section h6{ margin-top:6vw;font-size:4vw;   }
#main_visual section p a{ line-height:10vw; font-size:3vw;   padding:0 4vw;}
#main_visual section p a:first-child{margin-right:2vw;}
}









.section_header{text-align:center; }
.section_header h2{display:inline-block; vertical-align:middle; }
.section_header h2 strong{display:inline-block; font-size:56px; line-height:100%;}
.section_header h2 span{display:block; font-size:28px; line-height:100%;}
.section_header h2:before{display:inline-block;vertical-align:middle; width:140px; margin-bottom:50px;  margin-right:20px; height:1px;background:#000; content:"";}
.section_header h2:after{display:inline-block; vertical-align:middle;width:140px;  margin-bottom:50px;margin-left:20px; height:1px;  background:#000;  content:"";}
.section_header p{font-size:1.2em;}

.section_header.w{color:#fff;}
.section_header.w h2:before{background:#fff;}
.section_header.w h2:after{background:#fff;}

@media (max-width:1400px){
.section_header h2 strong{font-size:6vw;  }
.section_header h2 span{ font-size:3vw;  }
.section_header p{font-size:1.1em;}
.section_header h2:before{width:10vw; margin-bottom:6vw;  margin-right:1vw; }
.section_header h2:after{width:10vw;  margin-bottom:6vw;margin-left:1vw;}
}

@media (max-width:768px){
.section_header p{font-size:3vw;}
.section_header h2 strong{font-size:8vw; }
.section_header h2 span{ font-size:4vw;  }
}


#LATEST{padding:120px 0; background:url(/img/latest_bg.jpg) center no-repeat; background-size:cover; }
#LATEST dl {max-width:1400px; margin:0 auto; display: -webkit-flex; display: flex;   justify-content:center}
#LATEST dd{width:50%; display: -webkit-flex; display: flex;   justify-content:space-between }
#LATEST dd h4{position:relative; width:30%; background-position:center; background-repeat:no-repeat;z-index:1;  font-size:1.6em; color:#FFF; font-weight:bold; background-size:cover; border-radius:20px; overflow:hidden; display: -webkit-flex;  display: flex;flex-direction:column; justify-content:center; align-items:center;}
#LATEST dd h4:after{position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.4); z-index:-1;  content:""; }
#LATEST dd ul{width:70%; padding:20px 40px;  box-sizing:border-box;  line-height:50px;}
#LATEST dd ul li {border-top:1px dashed #DDD; }
#LATEST dd ul li:first-child {border-top:0 }
#LATEST dd ul li:after {display:block;visibility:hidden;clear:both;content:""}
#LATEST dd ul a{position:relative; float:left; width:calc(100% - 100px);  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;  }
#LATEST dd ul strong{position:relative; float:left; width:calc(100% - 250px);  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;  }
#LATEST dd ul span{color:#999; float:right;}
#LATEST dd ul em{color:#F44; float:left; font-weight:500;}
#LATEST dd ul b{padding:0 10px; background:#333; color:#FFF; float:left;  border-radius:50px; line-height:34px; margin:8px 10px 0 10px; }
#LATEST dd ul b.b1{ background:#0068da;}
#LATEST dd ul b.b2{ background:#7e838d;}
#LATEST dd ul b.b3{ background:#f48e42;}
#LATEST dd ul b.b4{ background:#7e838d;}

@media (max-width:1100px){
#LATEST {  padding:10vw 3vw}
#LATEST dl {max-width:auto; display:block;  }
#LATEST dd{width:auto; margin:2vw 0 }

}

@media (max-width:768px){
#LATEST dd ul{ padding:2vw 4vw; line-height:30px; font-size:.8em}
#LATEST dd ul b{padding:0 1vw;   line-height:30px; margin:5px 10px 0 10px; }
#LATEST dd h4{font-size:4vw;border-radius:2vw}
#LATEST dd ul a{  width:calc(100% - 80px);   }
#LATEST dd ul strong{  width:calc(100% - 125px); }
#LATEST dd ul b{  border-radius:4px; line-height:20px; margin:8px 5px 0 5px; }

#LATEST dd.l2{display:none;}

}



#PORTFOLIO{text-align:center;padding:120px 0; background:#f2f2f2; }

#portfolio_list{position:relative; z-index:2; margin:50px 0;}
#portfolio_list dl{ max-width:1400px; margin:0 auto; display: -webkit-flex; display: flex; flex-wrap:wrap; justify-content:center}
#portfolio_list dd{position:relative; width:29.33%; height:0; padding-top:20%;  margin:2%; background-size:cover;  background-position:center;  }
/*#portfolio_list dd:after{position:absolute; width:100%; height:100%;  background:rgba(255,255,255,.2); top:0px; left:0px;   content:"";}*/
#portfolio_list dd:before{position:absolute; width:100%; height:100%;  background:rgba(0,0,0,.1); top:10px; left:10px; z-index:-1; content:"";}
#portfolio_list dd:hover:after{display:none;}
#portfolio_list dd article{position:absolute; top:0; left:0; right:0; bottom:0; font-size:1.2em;  background:rgba(0,0,0,0); text-align:center; display: -webkit-flex; display: flex; align-items:center; justify-content:center; flex-direction:column;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#portfolio_list dd article p{color:#FFF; margin-bottom:100px;opacity:0; -webkit-transition: all .5s ease;-moz-transition: all .5s ease;-o-transition: all .5s ease;transition: all .5s ease; -webkit-transition-delay: 100ms; transition-delay:	100ms;}
#portfolio_list dd article a{  display:inline-block; width:50px; height:50px; line-height:50px; background:#FFF; color:#000; opacity:0;border-radius: 50%;-moz-border-radius: 50%; -webkit-border-radius: 50%; -webkit-transition: all .5s ease;-moz-transition: all .5s ease;-o-transition: all .5s ease;transition: all .5s ease;
-webkit-transition-delay: 	100ms; transition-delay:	100ms;
}

@media (max-width:736px){
#PORTFOLIO{padding:60px 0 30px; }
#portfolio_list{ margin:20px 0;}
#portfolio_list dd{width:46%;  padding-top:36%;   }
#portfolio_list dd:before{ top:3px; left:3px; }
}




#portfolio_list dd:hover article{background:rgba(0,0,0,.4); -webkit-transition-delay: 	100ms; transition-delay:	100ms;}
#portfolio_list dd:hover article p{margin-bottom:20px;opacity:1;}
#portfolio_list dd:hover article a{opacity:1;}

#PORTFOLIO footer{position:relative;text-align:center; z-index:1; }
#PORTFOLIO footer:before{content:"···"; text-align:center; position:relative; z-index:1; display:block;   font-size:4em; line-height:100%;  transform:rotate(90deg);-ms-transform:rotate(90deg); -moz-transform:rotate(90deg); -webkit-transform:rotate(90deg);-o-transform:rotate(90deg);}
#PORTFOLIO .view_more{position:relative; z-index:2; display:inline-block; border:1px solid #DDD; font-size:1.2em; background:#FFF; line-height:50px; padding:0 40px;}





#ABOUT{ position:relative; padding-top:120px; overflow:hidden ;background:url(../img/about_bg.jpg) center center no-repeat;z-index:1; background-size:cover; background-attachment: fixed;}
#ABOUT:after{position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1; background:rgba(0,0,0,.5); content:"";}
#ABOUT dl{position:relative; z-index:1; color:#FFF; padding:100px 0 ; max-width:1400px; margin:0 auto; display: -webkit-flex; flex-wrap:wrap;display: flex;  justify-content:center}
#ABOUT dl dd{ width:20%; text-align:center; }
#ABOUT dl dd strong {position:relative; display:block; font-size:2em; padding-bottom:20px; line-height:100%; font-weight:700;}
#ABOUT dl dd strong:after {position:absolute; left:50%; bottom:0; height:2px; width:20px; margin-left:-10px; background:rgba(255,255,255,.5); content:"";}
#ABOUT dl dd p {font-size:1.2em;margin-top:20px;}

#ABOUT footer{position:relative; background:rgba(0,0,0,.5); text-align:center; padding:60px 0; color:#FFF; z-index:1; }
#ABOUT footer h3{font-size:2em; line-height:120%; font-weight:700;white-space:nowrap; }
#ABOUT footer p{ font-size:1.2em; line-height:120%; margin-top:10px;white-space:nowrap;}
@media (max-width:1024px){
#ABOUT footer{padding:3vw 0;  }
#ABOUT dl dd strong { font-size:1.8em;  }
#ABOUT footer h3{font-size:1.6em;  }
#ABOUT footer p{ font-size:1.1em;  }
}
@media (max-width:980px){



}
@media (max-width:736px){
#ABOUT{  background-attachment: scroll;}
#ABOUT dl{padding:50px 0 20px;  }
#ABOUT dl dd{ width:33%;margin-bottom:10vw; }
#ABOUT dl dd strong {  font-size:5vw; padding-bottom:10px;  }
#ABOUT dl dd p {font-size:1em;margin-top:10px;}

#ABOUT footer{ padding:20px 0; clear:both; }
#ABOUT footer h3{font-size:4.5vw; }
#ABOUT footer p{ font-size:3vw;white-space:normal; }

}



#SERVICE{position:relative; padding:120px 0; background:url(../img/service_bg.jpg) center top no-repeat; background-size:cover;}
#SERVICE dl{position:relative; z-index:1; text-align:center; max-width:1400px; margin:0 auto; padding-top:100px;  display: -webkit-flex; display: flex;  justify-content:center}
#SERVICE dl dd{width:25%}
#SERVICE dl dd img{width:150px;}
#SERVICE dl dd h5{font-size:1.8em; margin-top:1em;}
#SERVICE dl dd p{font-size:1em; margin-top:.5em;}
@media (max-width:1024px){
#SERVICE dl dd img{width:100px;}
#SERVICE dl dd h5{font-size:1.3em;  }
#SERVICE dl dd p{font-size:.9em; }
}
@media (max-width:736px){
#SERVICE{position:relative; padding:60px 0; }
#SERVICE dl{flex-wrap:wrap; padding-top:30px; }
#SERVICE dl dd{width:50%; margin-bottom:20px;}
#SERVICE dl dd img{width:40%;}
#SERVICE dl dd h5{font-size:1.2em; margin-top:1em;}
#SERVICE dl dd p{font-size:.9em; line-height:140%; }
}
#CONTACT{position:relative; padding:120px 0; background:#555; color:#FFF;}

#CONTACT section{ max-width:1400px; margin:80px auto 0;}
#CONTACT section:after {display:block;visibility:hidden;clear:both;content:""}

#CONTACT .form{float:left; position:relative; width:49%;}
#CONTACT .form table{width:100%;}
#CONTACT .form table td{padding:5px;}
#CONTACT .form table td label{display:None;}
#CONTACT .form .frm_input{width:100%; height:42px;}
#CONTACT .form #rq_file{display:none;}
#CONTACT .form #tmp_file_path{width:75%; float:left;}
#CONTACT .form #file_input_button{float:right; width:25%; height:42px;    border:0; background:#333; color:#FFF;  }

#CONTACT .form .agree{ float:left; line-height:50px;}
#CONTACT .form .agree a{ color:#FFF; text-decoration:underline; margin-left:20px;}
#CONTACT .form #btn_submit{float:right; width:200px;  border:0; height:50px;background:#000; color:#FFF; font-size:1.2em; }

#buttonUpload{display:none; float:right; width:100px;height:40px;   font-size:1.1em;
border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px; border:0; background:#333; color:#FFF; margin-left:6px; text-align:center; line-height:42px;}
#buttonUpload i{display:none;}

#CONTACT .info{float:right; width:49%; background:#4a4a4a; padding:41px 50px;  box-sizing:border-box; }
#CONTACT .info h3{line-height:100%; font-size:1.9em; border-bottom:1px solid #FFF; padding-bottom:.4em; margin-bottom:.2em;}
#CONTACT .info dl{margin-top:20px; line-height:220%; font-size:1.1em;}
#CONTACT .info dl a{display:inline-block; background:#000; color:#FFF; padding:0 10px; margin-left:20px;}


@media (max-width:768px){
#CONTACT{position:relative; padding:80px 0 20px; }
#CONTACT section{   margin:20px auto 0;}
#CONTACT .form{float:none; width:auto; margin:2vw; }
#CONTACT .form .agree{ float:none; line-height:150%;}
#CONTACT .form .agree label{display:block;}
#CONTACT .form #btn_submit{float:none; width:100%; margin-top:10px; }
#CONTACT .info{float:none; width:auto;  padding:20px;  margin:2vw; }
#CONTACT .info dl{  font-size:.9em;}
#CONTACT .info dl a{display:inline-block; background:#000; color:#FFF; padding:0 10px; margin-left:10px;}
}

#cf_privacy{display:none;}

#cf_privacy{position:absolute; color:#000; display:none;width:100%;   border:1px solid #DDD; background:#fff; padding:30px; top:0; left:0; letter-spacing:-1px; box-sizing:border-box; -moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
#cf_privacy h5{font-size:1.3em; font-weight:700; line-height:40px; border-bottom:1px solid #000;}
#cf_privacy article{ position:relative; height:300px; overflow:auto; font-size:.9em;}
#cf_privacy p{position:relative;  font-size:.9em;}
#cf_privacy a{display:inline-block; float:right; background:#555; color:#fff; line-height:30px; padding:0 20px; margin-top:20px;}
#writeSuccess{position:absolute; top:0; left:0; right:0; bottom:0;background:#222;   text-align:center;  display:none; }
#writeSuccess.on{ display: -webkit-flex;  display: flex;  flex-direction:column; justify-content:center; align-items:center; }
#writeSuccess .loading{font-size:3em; width:60px; height:60px; }
#writeSuccess p{display:none;font-size:1.2em; line-height:150%; }
#writeSuccess p strong{font-weight:bold;  }

#footer{position:relative; background:#333; }
#footer:after {display:block;visibility:hidden;clear:both;content:""}
#footer p{font-size:.9em; color:#999; float:left; line-height:20px; padding:30px;}
#footer a{float:right; width:80px; height:80px; background:#000;color:#FFF; position:relative; text-indent:-1000px; overflow:hidden;}
#footer a:before{position:absolute; top:50%; left:50%; width:20px; margin-left:-10px; height:20px; border:3px solid #FFF; border-right-color:transparent; border-bottom-color:transparent; transform:rotate(45deg);-ms-transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg);-o-transform:rotate(45deg); content:"";}
@media (max-width:736px){
#footer p{ padding:15px;}
#footer a{float:right; width:50px; height:50px;  }
#footer a:before{ width:10px; margin-left:-10px; height:10px; border:2px solid #FFF;border-right-color:transparent; border-bottom-color:transparent;   }
}


/*********************** animation ***********************/

#header h1 img{-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;  }
#header.s h1 img{height:60px; }
#topMenu dd > a{-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;  }
#header.s #topMenu dd > a{line-height:60px; height:60px;}

#main_visual section h4{ opacity:0; letter-spacing:10px; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease; }
#main_visual section h2 strong{opacity:0;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease; }
#main_visual section h2:before{opacity:0;margin-right:50px; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease; }
#main_visual section h2:after{opacity:0;margin-left:50px;  -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease; }
#main_visual section h6{ margin-top:5vw;opacity:0;  -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;  }
#main_visual section p{margin-top:20%;opacity:0;  -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;  }

#main_visual.on section h4{opacity:1;letter-spacing:0; }
#main_visual.on section h2 strong{opacity:1;}
#main_visual.on section h2:before{margin-right:0;opacity:1}
#main_visual.on section h2:after{margin-left:0;opacity:1}
#main_visual.on section h6{ opacity:1;margin-top:1vw;   }
#main_visual.on section p{margin-top:5%;opacity:1; }

@media (max-width:768px){
#main_visual.on section h6{ opacity:1;margin-top:6vw;   }
}



#ABOUT dl dd {position:relative; top:50px; opacity:0;   -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#ABOUT dl dd:nth-child(1){-webkit-transition-delay: 200ms; transition-delay:200ms;}
#ABOUT dl dd:nth-child(2){-webkit-transition-delay: 400ms; transition-delay:400ms;}
#ABOUT dl dd:nth-child(3){-webkit-transition-delay: 600ms; transition-delay:600ms;}
#ABOUT dl dd:nth-child(4){-webkit-transition-delay: 800ms; transition-delay:800ms;}
#ABOUT dl dd:nth-child(5){-webkit-transition-delay: 1000ms; transition-delay:1000ms;}
#ABOUT.on dl dd {top:0; opacity:1; }

#ABOUT footer{position:relative; top:50px; opacity:0;width:100%; margin-left:-100%;  overflow:hidden; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#ABOUT footer h3{position:relative;letter-spacing:10px; opacity:0;  -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#ABOUT footer p{ position:relative;letter-spacing:10px; opacity:0; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}

#ABOUT.on footer{opacity:1;top:0; margin-left:0;-webkit-transition-delay: 1500ms; transition-delay:1500ms;   }
#ABOUT.on footer h3{letter-spacing:0; opacity:1;-webkit-transition-delay: 2500ms; transition-delay:2500ms; }
#ABOUT.on footer p{ letter-spacing:0; opacity:1; -webkit-transition-delay: 3000ms; transition-delay:3000ms; }

@media (max-width:768px){
#ABOUT footer h3{ letter-spacing:0;  }
#ABOUT footer p{  letter-spacing:0;  }

}

#SERVICE .section_header{opacity:0;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#SERVICE.on .section_header{opacity:1;}

#SERVICE dl dd{position:relative; top:100px; opacity:0;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
#SERVICE dl dd:nth-child(1){-webkit-transition-delay: 600ms; transition-delay:600ms; }
#SERVICE dl dd:nth-child(2){-webkit-transition-delay: 800ms; transition-delay:800ms; }
#SERVICE dl dd:nth-child(3){-webkit-transition-delay: 1000ms; transition-delay:1000ms;}
#SERVICE dl dd:nth-child(4){-webkit-transition-delay: 1200ms; transition-delay:1200ms;}
#SERVICE.on dl dd{top:0; opacity:1;}

/****************************************************************/



.animate [class*="ae-"] {position:relative;  top:80px;  opacity:0;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
.animate [class*="ad-"] {position:relative;  top:-80px;  opacity:0;-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;transition: all 1s ease;}
.animate .ae-1{ -webkit-transition-delay: 	10ms; transition-delay:	10ms; }
.animate .ad-1{ -webkit-transition-delay: 	10ms; transition-delay:	10ms; }
.animate .ae-2{ -webkit-transition-delay: 	200ms; transition-delay:	200ms; }
.animate .ae-3{ -webkit-transition-delay: 	400ms; transition-delay:	400ms; }
.animate .ae-4{ -webkit-transition-delay: 	600ms; transition-delay:	600ms; }
.animate .ae-5{ -webkit-transition-delay: 	800ms; transition-delay:	800ms; }
.animate .ae-6{ -webkit-transition-delay: 	1000ms; transition-delay:	1000ms; }
.animate .ae-7{ -webkit-transition-delay: 	1200ms; transition-delay:	1200ms; }
.animate .ae-8{ -webkit-transition-delay: 	1400ms; transition-delay:	1400ms; }
.animate .ae-9{ -webkit-transition-delay: 	1600ms; transition-delay:	1600ms; }
.animate .ae-10{ -webkit-transition-delay: 	1800ms; transition-delay:	1800ms; }
.animate.on [class*="ae-"] { opacity:1;top:0}
.animate.on [class*="ad-"] { opacity:1;top:0}




/* 게시물 선택복사 선택이동 */
#copymove {}
.copymove_current {float:right;color:#ff3061}
.copymove_currentbg {background:#f4f4f4}

/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}
/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}

/* ie6 이미지 너비 지정 */
.img_fix {width:100%;height:auto}

/* 캡챠 자동등록(입력)방지 기본 -pc */
#captcha { position:relative}
#captcha legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
#captcha #captcha_img {width:100px;height:34px;border:1px solid #DDD; box-sizing:border-box; padding:0;margin:0; float:left;}
#captcha #captcha_mp3 {position:relative;  display:inline-block;float:left; top:0; margin:0;padding:0;width:34px;height:34px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer}
#captcha #captcha_mp3:after {position:absolute; top:0; left:0; content:"\f028"; font-family:'fontawesome'; line-height:34px; font-size:1.4em; width:34px; height:34px;box-sizing:border-box; background:#999;color:#FFF; }
#captcha #captcha_mp3 span {display:none;}
#captcha #captcha_reload {position:relative;  display:inline-block; float:left; margin:0;padding:0;width:34px;height:34px;border:0;background:transparent;vertical-align:middle;overflow:hidden;cursor:pointer;}
#captcha #captcha_reload:after {position:absolute; top:0; left:0; content:"\f021"; font-family:'fontawesome'; line-height:34px; font-size:1.4em; width:34px; height:34px;box-sizing:border-box; background:#999;color:#FFF; }
#captcha #captcha_key {display:inline-block;  width:70px; float:left;text-align:center; height:34px;border:1px solid #ddd;background:#FFF;color:#000;vertical-align:middle; box-sizing:border-box; -moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
#captcha #captcha_info { display:none;}

/* 캡챠 자동등록(입력)방지 기본 - mobile */

/* ckeditor 단축키 */
.cke_sc {display:none;}


/* 버튼 */
.btn01 {display:inline-block;margin:0;padding:0 20px; height:34px; line-height:34px; border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;vertical-align:middle; ; box-sizing:border-box;}
.btn01:focus, .btn01:hover {text-decoration:none}
.btn02 {display:inline-block;margin:0;padding:0 20px; height:34px; line-height:34px;  border:1px solid #3b3c3f;background:#4b545e;color:#fff;text-decoration:none;vertical-align:middle; box-sizing:border-box;}
.btn02:focus, .btn02:hover {text-decoration:none; color:#FFF;}
.btn_confirm {text-align:center; margin-top:20px;} /* 서식단계 진행 */
.btn_confirm:after {display:block;visibility:hidden;clear:both;content:""}
.btn_submit {padding:0 20px;border:0;background:#333;color:#fff; height:34px; line-height:34px; cursor:pointer}
.btn_cancel {display:inline-block;padding:0 20px; height:34px; line-height:34px; border:1px solid #ccc;background:#fafafa;color:#000;text-decoration:none;vertical-align:middle;box-sizing:border-box;}
.btn_frmline {display:inline-block;padding:0 20px; height:34px; line-height:34px; border:0;background:#333;color:#fff; text-decoration:none;vertical-align:top} /* 우편번호검색버튼 등 */
.btn_frmline:focus, .btn_frmline:hover {text-decoration:none; color:#FFF;}
.btn_confirm .btn_submit{padding:0 40px; height:40px; font-size:1.2em;}
.btn_confirm .btn_cancel{padding:0 20px; height:40px; line-height:40px; font-size:1.2em;}
.btn_confirm .btn01{padding:0 20px; height:40px; line-height:40px; font-size:1.2em;}

.btn_admin {display:inline-block;margin:0;padding:0 20px; height:34px; line-height:34px;border:1px solid #e8180c;background:#e8180c;color:#fff;text-decoration:none;vertical-align:middle; box-sizing:border-box;} /* 관리자 전용 버튼 */
.btn_admin:focus, a.btn_admin:hover {text-decoration:none; color:#FFF;}

/* 기본테이블 */
table.tb{position:relative; width:100%; border-top:1px solid #555;  }
table.tb:after{position:absolute; top:0; left:0; right:0; height:1px; background:#555; content:"";}
table.tb thead{}
table.tb thead th{background:#FFF; padding:10px 0; text-align:center; font-weight:700; border-bottom:1px solid #EEE;}
table.tb tbody th{border-bottom:1px solid #EEE; text-align:left; padding-left:10px;}
table.tb tbody td{border-bottom:1px solid #EEE;  padding:10px;   }
table.tb tfoot th{border-bottom:1px solid #EEE; background:#FFE; text-align:left; padding-left:10px;}
table.tb tfoot td{border-bottom:1px solid #EEE; background:#FFE; padding:10px; height:36px;}
table.tb .tc{text-align:center !important;}
table.tb .tl{text-align:left !important; padding-left:10px !important;}
table.tb .tr{text-align:right !important; padding-right:10px !important;}
table.tb tfoot{}
table.tb tbody img {margin-left:3px}
table.tb .no_list{text-align:center; line-height:200px;}

table.tb.center tbody th{text-align:center;  }
table.tb.center tbody td{   text-align:center;  }
table.tb.center tfoot th{text-align:center;  }
table.tb.center tfoot td{text-align:center;   }
table.tb.line thead th{border:1px solid #EEE; }
table.tb.line tbody th{border:1px solid #EEE;background:#F6F6F6;  padding-right:10px;}
table.tb.line tbody td{border:1px solid #EEE; }
table.tb.line tfoot th{border:1px solid #EEE; border-top:0; background:#FFE;  padding-right:10px;}
table.tb.line tfoot td{border:1px solid #EEE; border-top:0; background:#FFE;   }

@media (max-width:767px){
table.tb.block tbody tr{display:block;border-bottom:1px solid #EEE; padding:10px 0;}
table.tb.block tbody th{display:block; border:0}
table.tb.block tbody td{display:block; border:0}
table.tb.block tbody th{width:auto; border-bottom:0; padding:0}
table.tb.block tbody td{padding:0; height:auto;}
table.tb.block tbody td .frm_input{width:100%;}
table.tb.block tbody td select{width:100%;}
table.tb.block tbody tr.noblock td{display: inline-block}
table.tb.block tbody tr.noblock th{display: inline-block}
}


 .w100{width:100%;}
textarea,
.frm_input,
select {border:1px solid #ddd;background:#FFF;color:#000;vertical-align:middle;line-height:2em; box-sizing:border-box; -moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
textarea {padding:2px 2px 3px; width:100%;}
select, .frm_input, .btnInput {height:34px}
select { font-size:1em; line-height:100%; padding:0;padding:4px\9; }
.frm_address  { margin-top:5px}
.frm_file { margin-bottom:5px}
.frm_info {display:block;padding:0 0 5px;line-height:1.4em; font-size:12px; color:#666;}
/* 필수입력 */
.required, textarea.required {background:url('../img/wrest.gif') #FFF top right no-repeat !important}


.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_wrap caption {padding:10px 0;font-weight:bold;text-align:left}

.tbl_head01 {margin:0 0 10px}
.tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head01 thead th {padding:12px 0;border-top:1px solid #DDD;border-bottom:1px solid #DDD;background:#fafafa;font-size:0.95em;text-align:center; }
.tbl_head01 thead a {color:#383838}
.tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head01 tfoot th, .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head01 tbody th {padding:8px 0;border-top:1px solid #EEE;border-bottom:1px solid #EEE}
.tbl_head01 td {padding:8px 5px;border-top:1px solid #EEE;border-bottom:1px solid #EEE;line-height:1.5em;word-break:break-all}
.tbl_head01 a {}

.tbl_head02 {margin:0 0 10px}
.tbl_head02 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head02 thead th {padding:5px 0;border-top:1px solid #DDD;border-bottom:1px solid #DDD;background:#fafafa;font-size:0.95em;text-align:center;}
.tbl_head02 thead a {color:#383838}
.tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head02 tfoot th, .tbl_head02 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head02 tbody th {padding:5px 0;border-top:1px solid #EEE;border-bottom:1px solid #EEE}
.tbl_head02 td {padding:5px 3px;border-top:1px solid #EEE;border-bottom:1px solid #EEE;line-height:1.4em;word-break:break-all}
.tbl_head02 a {}

/* 폼 테이블 */
.tbl_frm01 {margin:0 0 20px}
.tbl_frm01 table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_frm01 th {width:120px;padding:7px 13px;border:1px solid #EEE;border-left:0; text-align:left}
.tbl_frm01 td {padding:7px 10px;border-top:1px solid #EEE;border-bottom:1px solid #EEE;background:transparent}
.tbl_frm01 .frm_file {display:block;margin-bottom:5px}
.tbl_frm01 .frm_info {display:block;padding:0 0 5px;line-height:1.4em}

/* 자료 없는 목록 */
.empty_table {padding:50px 0 !important; width:auto  !important; float:none !important; text-align:center !important}
.empty_list {padding:20px 0 !important; width:auto !important; float:none !important;  text-align:center !important}


/* 새창 기본 스타일 */
.new_win {}
.new_win .tbl_wrap {margin:0 20px}
.new_win #win_title {margin:0 0 20px;padding:20px;border-top:3px solid #333;border-bottom:1px solid #dde4e9;background:#fff;font-size:1.2em}
.new_win #win_title .sv {font-size:0.75em;line-height:1.2em}
.new_win .win_ul {margin:-20px 0 20px 0;padding:0 20px;border-bottom:1px solid #455255;background:#484848;list-style:none;zoom:1}
.new_win .win_ul:after {display:block;visibility:hidden;clear:both;content:""}
.new_win .win_ul li {float:left;margin-left:-1px}
.new_win .win_ul a {display:block;padding:10px 10px 8px;border-right:1px solid #455255;border-left:1px solid #455255;color:#fff;font-family:dotum;font-weight:bold;text-decoration:none}
.new_win .win_desc {padding:20px}
.new_win .win_btn {clear:both;padding:20px;text-align:center} /* 새창용 */
.new_win .win_btn button {display:inline-block;padding:0 10px;height:30px;border:0;background:#4b545e;color:#fff;line-height:2em;cursor:pointer}
.new_win .win_btn input {padding:0 10px;height:30px;line-height:2em}
.new_win .win_btn a {display:inline-block;padding:0 10px;height:30px;background:#4b545e;color:#fff;vertical-align:middle;line-height:2.4em}
.new_win .win_btn a:focus, .new_win .win_btn a:hover {text-decoration:none}

/* 검색결과 색상 */
.sch_word {color:#ff3061}

/* 자바스크립트 alert 대안 */
#validation_check {margin:100px auto;width:500px}
#validation_check h1 {margin-bottom:20px;font-size:1.3em}
#validation_check p {margin-bottom:20px;padding:30px 20px;border:1px solid #EEE;background:#fff}

/* 사이드뷰 */
.sv_wrap {display:inline-block;position:relative;font-weight:normal}
.sv_wrap .sv {z-index:1000;display:none;margin:5px 0 0;border:1px solid #283646}
.sv_wrap .sv a {display:inline-block;margin:0;padding:3px;width:94px;border-bottom:1px solid #283646;background:#111;color:#fff !important}
.sv_wrap a:focus, .sv_wrap a:hover, .sv_wrap a:active {text-decoration:none}
.sv_on {display:block !important;position:absolute;top:10px;left:20px;width:auto;height:auto}
.sv_nojs .sv {display:block}

/* 페이징 */
.pg_wrap {clear:both; margin-top:20px; text-align:center}
.pg_page, .pg_current,.pg_skip {position:relative; display:inline-block; padding:0 10px; height:36px;  line-height:36px;vertical-align:middle; background:#FFF;text-decoration:none; border:1px solid #DDD; z-index:1; }
.pg_page:hover{background-color:#DDD; border-color:#999; color:#000; z-index:2;}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_current { border:1px solid #999;  background:#fff;color:#000;font-weight:normal}
.pg_prev:before{ content:"\f104";   font-family:'fontawesome'; padding-right:5px; }
.pg_next:after{ content:"\f105";   font-family:'fontawesome'; padding-left:5px; }
@media (max-width:767px){
.pg_page{display:none}
.pg_page, .pg_current,.pg_skip {padding:0 6px; height:30px;  line-height:30px;  }
.pg_start{  display:inline-block;}
.pg_prev{ display:inline-block;}
.pg_next{ display:inline-block; }
.pg_end{ display:inline-block; }
}
/*메일인증*/
.rg_em{margin-top:5px}
.rg_em caption{padding:0;font-size:0;line-height:0;overflow:hidden}