/* Common */
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;vertical-align: baseline;font-family:'Malgun Gothic', sans-serif; letter-spacing:-0.5px;font-style:normal}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
body {line-height:1;}
ol, ul,li {list-style:none;}
table {border-collapse:collapse; border-spacing:0;}
a{text-decoration:none;}
a:hover,a:active,a:focus{text-decoration:none;}
table{border-spacing:0;border-collapse:collapse;}
input,select,button{vertical-align:middle; outline:none;}
.clear{clear: both;}
.absolute{position:absolute;}
.fixed{position:fixed;}
.mg_r_no{margin-right:0 !important;}
.mg_l_no{margin-left:0 !important;}
.mg_t_no{margin-top:0 !important;}
.mg_b_no{margin-bottom:0 !important;}
.border_no{border:none !important}

#wrap{position:relative; width:100%; min-width:1200px; overflow: hidden;}
#header{width:100%; background:url(../image/db_bg.png) no-repeat center top;}
.header_inner{position:relative; width:1200px; margin:0 auto;}
.header_inner h1{position: absolute; top:17px; left:50%; margin-left: -310px;}

/*고정*/


#p_top{z-index:100;position:fixed;top:0;right:0;
		width:100%;margin:0 auto;text-align:center;height:96px;
	background:url(../image/db_bg.png) no-repeat center top; z-index:1000;}
#p_top .p_top_wrap{height:67px;position: relative;margin:0 auto;padding-top:10px;
 width:1200px;margin:0 auto; }
#p_top .p_top_wrap .top_button{  float: center; }
#p_top .p_top_wrap .top_button #li_logo{float:left; margin-left: 50px; margin-top: 5px;}
#p_top .p_top_wrap .top_button .li2{float:left; margin-left: 10px; margin-top: 33px;}
#p_top .p_top_wrap .top_button #li1{ float:left; margin-left: 20px; margin-top: 33px}
#p_top .p_top_wrap .top_button #li5{ float:left;margin-left: 390px;  margin-top: 24px}

/* 1메인 */

.main1{position: relative;width: 100%; background:url(../image/main1_bg.jpg) center top no-repeat #050e37  ; overflow:hidden;height: 910px;}
.main1_inner{position:relative;  margin:0 auto;}
.main1 h2{  padding-top:150px; text-align: center;
	-webkit-animation:op_title 1s 0s ease-in-out ;
	-o-animation:op_title 1s 0s ease-in-out;
	animation:op_title 1s 0s ease-in-out ;}
@keyframes op_title{
	0%{opacity:0;}
	100%{opacity:1;}}
.sm_img1{
	position: absolute;left: 50%;top:50px; margin-left: -610px; 
	-webkit-animation:sm_ani 0.5s 0s linear forwards alternate infinite;
	-o-animation:sm_ani 0.5s 0s linear forwards alternate infinite;
	animation:sm_ani 0.5s 0s linear forwards alternate infinite;}
.sm_img2{
	position: absolute;right: 50%;top:115px; margin-right: -620px;
	-webkit-animation:sm_ani 0.5s 0s linear forwards alternate infinite;
	-o-animation:sm_ani 0.5s 0s linear forwards alternate infinite;
	animation:sm_ani 0.5s 0s linear forwards alternate infinite;}
@keyframes sm_ani {
	0%{transform: rotate(10deg)}
	100%{transform: rotate(0deg)}}

.main1 h3{  padding-top:10px; text-align: center;}
.main1 .arrow{
	width:210px; height:140px;  padding:180px 0px 0px; position: relative; left: 1150px; top:-50px;
	-webkit-animation:arrow_ani 0.4s 0s infinite alternate ease-in;
	-o-animation: arrow_ani 0.4s 0s infinite alternate ease-in; ;
	animation:arrow_ani 0.4s 0s infinite alternate ease-in;}
@keyframes arrow_ani {
	0%{background-position:50% 60%}
	100%{background-position:50% 100%}
}
.main1 .arrow.m2{background:url(../image/main1_img.png) no-repeat; }



/*quick*/
#quick{position: absolute; top:491px;right:0px; z-index:999999;font-size: 0;}
.quick_body ul li{height:45px; line-height:30px; z-index:999999;}
.quick_body ul li a{display: block; z-index:999999;}
.quick_body ul li a img{vertical-align: middle; z-index:999999;}


/*2서비스종류 */
.main2{width: 100%;padding:0; background:url(../image/main2_bg.jpg) center top no-repeat #050e37  ;height:1100px;}
.main2_inner{position:relative; width:1200px; top:60px;
    margin:0 auto;}
.main2 h2{text-align: center; margin-bottom: 10px;}


/*연혁*/

.main3{width: 100%;padding:0;background: url(../image/main3_bg.jpg) center top no-repeat #050e37  ;height: 705px;}
.main3_inner{position:relative;  top:80px; margin:0 auto;}

.main3 h2{text-align: center; width: 100%; margin-top:10px; margin-bottom: 60px;}


.main3_inner .mian3_img_wrap { width: 1200px;  border: 1px soild red; position: relative; margin:0 auto;}
.main3 .main3_img{float:left; margin-left: 20px;}



.main3 p {text-align: center;}

/*온라인상담*/
.main4{clear:both;width: 100%;background: url(../image/main4_bg.jpg) center top no-repeat #050e37  ;height: 1095px;}
.main4 .main4_inner{ width:1200px;position:relative; top:30px; margin:0 auto;}
.main4 .arrow{
	width:75px; height: 0px;  padding:100px 0px 0px;  margin: 0 auto ;
	-webkit-animation:arrow_ani 0.4s 0s infinite alternate ease-in;
	-o-animation: arrow_ani 0.4s 0s infinite alternate ease-in; ;
	animation:arrow_ani 0.4s 0s infinite alternate ease-in;}
@keyframes arrow_ani {
	0%{background-position:50% 60%}
	100%{background-position:50% 100%}
}
.main4 .arrow.m2{background:url(../image/main5_arrow.png) no-repeat;}
.main4 .main4_inner h3{text-align:center; width:1200px; margin:0 auto;}


/*온라인상담*/


.main4 .db h1 {text-align: center; margin-top: 20px; margin-bottom: 50px;}
.main4  .db .db_wrap{; border-radius:6px; overflow: hidden;}
.main4  .db .db_inner{; border-radius:6px; overflow: hidden; padding:0px; width:35%; padding-left:150px; }


.main4 .db .db_inner dl{ padding-top: 20px; float:left; ;overflow: hidden; margin-right:17px; margin: 0 auto;}
.main4 .db .db_inner dl dt{float:left; width:20%; height:70px;font-size:15px;line-height: 32px; font-weight: bold;	}
.main4 .db .db_inner dl dd{float:left; width:80%; height:70px;font-size:15px; line-height: 32px;}
.main4 .db .db_inner dl dd input[type="tel"]{width:33.3%; text-align: center;}
.main4 .db .db_inner dl dd input[type="text"]{width:100%;}
.main4 .db .db_inner dl input{background:#f2f2f2; border:1px solid #eee; box-sizing:border-box; padding:15px;}
.main4 .db .db_inner dl input:focus{background: #fff;}
.main4 .db .db_inner dl select{background:#f2f2f2; border:1px solid #eee; box-sizing:border-box; padding:5px; height:46px;}
.main4 .db .db_inner dl select:focus{background: #fff;}
.main4 .db .db_inner dl dd label{cursor: pointer;}
.main4 .db_wrap .db_car{}

.main4 .db .db_inner dl dd.agree{font-size:13px; height:30px; padding-top: 2px;}
.main4 .db .db_inner dl dd.agree button{font-size:12px;line-height:18px; margin-bottom:2px;margin-left:4px; background:#02716c; color: #fff; border:none; border-radius:5px; vertical-align: middle; cursor: pointer;	}
.main4 .db .db_wrap p{text-align: center; margin-top: 80px;}

/* 레이어팝업 */
.layer{position:fixed;left:50%;top:50%; display:none;width:1000px;z-index:300; margin-left:-460px;margin-top:-215px}
.layer_wrap{position: absolute; top:0px;left:0px;width:1000px; height:430px; background-color: #fff; text-align:left;z-index:1000; border-radius:5px; letter-spacing:-0.5px; box-shadow:0px 0px 15px rgba(0,0,0,0.2)}
.layer_wrap strong{display: block; background: #eee; padding:10px;}
.DB_info_detail{width:95%; font-size:13px; margin: 0 auto;height:355px; overflow:auto; margin-top:50px; line-height:18px;}
.close_btn{position:absolute; right:0; top:0px;}

.main2 .kakao_wrap{float:left; margin:39px 0px 0 35px}
.main2 .tel_wrap{ float:right;   margin-top: 30px;}


/*오시는길*/
.main5{clear:both;width: 100%;background: url(../image/main5_bg.jpg) center top no-repeat #050e37  ;height: 450px;}
.main5 .main5_inner{position:relative; width:1200px; top:80px;  position:relative; margin:0 auto;text-align: center;}
.main5 .main5_inner p{margin-top:20px;}


/*푸터*/
#footer{font-size: 13px; padding:20px 0; width: 100%; background: #1c1c1c; color:white; text-align: center;line-height:130%; height: 50px;}
#footer{font-size: 13px; padding:20px 0; width: 100%; background: #1c1c1c; color:white; text-align: center;line-height:150%; height: 50px;}



.infoform {position:relative;width:980px;margin-top:50px;}
.infoform th {text-align:left;font-weight:bold;height:60px;}

.infoform .textinput {
    background: #f2f2f2;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 12px;
	width:350px;
}
.infoform .telinput {
    background: #f2f2f2;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 12px;
	width:100px;
	display:inline-block;
}

.infoform .telselect {
    background: #f2f2f2;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 12px;
	width:100px;
	display:inline-block;
}
