@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
 margin:0;
 padding:0;
 border:0;
 outline:0;
 font-size:100%;
 vertical-align:baseline;
 background:transparent;
}

body {
 /* line-height:1; */
 /* font-size: 0.8em; */
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
 display:block;
}

nav ul, li {
 list-style:none;
}

blockquote, q {
 quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
 content:'';
 content:none;
}

a {
 margin:0;
 padding:0;
 color:#888;
 font-size:100%;
 vertical-align:baseline;
 background:transparent;
 text-decoration:none
}
a:hover, a:focus {text-decoration:none}

/* change colours to suit your needs */
ins {
 background-color:#ff9;
 color:#000;
 text-decoration:none;
}

/* change colours to suit your needs */
mark {
 background-color:#ff9;
 color:#000;
 font-style:italic;
 font-weight:bold;
}

del {
 text-decoration: line-through;
}

abbr[title], dfn[title] {
 border-bottom:1px dotted;
 cursor:help;
}

table {
 border-collapse:collapse;
 border-spacing:0;
}

/* change border colour to suit your needs */
hr {
 display:block;
 height:1px;
 border:0;
 border-top:1px solid #cccccc;
 margin:1em 0;
 padding:0;
}

input, select {
 vertical-align:middle;
}
input,textarea
input[type="color"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="week"],
input[type="month"] {
/*BUGFIX: http://stackoverflow.com/questions/5449412/css-styling-for-input-buttons-on-ipad-iphone*//* -webkit-appearance: none; */}

em, address {font-style: normal;}

/*iphone reset*/
input, /*select*/ textarea{/* -webkit-appearance: none; */-moz-appearance: none;/* appearance: none; */}

body {
 font-family: 'Barlow', 'Noto Sans KR', sans-serif , '맑은 고딕', Malgun Gothic, '돋움', Dotum, arial, apple Gothic;
 font-size:1em;
 color:#fff;
 font-weight: 100;
 background-color: #484a57;
 padding:0px;
 margin:0px;
 }
html, body {width:100%;}

div, p, ul, li, table, th, td, textarea, input, span, form, h1, h2, h3, h4, h5, h6, dt, dl, dd, em, sup {padding:0px;margin:0px; }
li{list-style:none; float:left}
input, select, textarea {font-family: 'Noto Sans KR', 나눔고딕, 돋움, Helvetica Neue, Helvetica, Arial, sans-serif;padding:0 5px;vertical-align:middle;color:#666666;border: none;margin: 0;height: 22px;}

img, fieldset {border:0 none transparent;/*'transparent' for Opera7*/}

/* html5 ie9 else */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
   display:block;
}
button {border: 0;background: none; padding: 0; cursor: pointer;}
caption,.hide{overflow:hidden; visibility:hidden; height:0; line-height:0; z-index:-1; display:none;}

a {text-decoration:none;cursor:pointer; color:#fff;}
a:link, a:visited {text-decoration:none; color:#fff;}
a:hover, a:focus, a:active {text-decoration:none;/* color:#8ba5f0; */}
img {}

body {width:100%; min-width: 1160px; padding:0; margin:0 auto;}
.mobile {display: none !important;}
.wrap {width: 100%; overflow: hidden; min-width: 1160px; }

/* #header {overflow: hidden;width: 100%;max-height: 120px;position: fixed;z-index: 100;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;border-bottom: 1px solid #b5b5b5;}
#header iframe {width: 100%;max-height: 120px;}


.wrap > .header {background:rgba(0, 0, 0, .7);color: #fff;padding: 30px 0;line-height: 1em;overflow: hidden;position: fixed;z-index: 100;left: 0;right: 0;}
.wrap > .header ul {width: 1100px;margin: 0 auto;}
.wrap > .header ul li{margin-left: 31px;font-size:1.4em;font-weight: 400;}
.wrap > .header ul li:first-child {margin-left:0;margin-right: 30px;}
.step {position: relative;overflow: hidden;}
.wrap > .header ul li a {margin-top: 20px;display: inline-block;}
.wrap > .header ul li:first-child a {margin-top:0;} */

.form {overflow: hidden;/* color: #e2e2e2; */width: 100%;position: fixed;z-index: 2;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;background: #373737;background-size: cover;/* padding-bottom: 10px; */top: 0;}
.form > ul {width: 1200px;margin:0 auto;overflow: hidden;}
.form > ul >li {float: left;width: 50%;padding: 0 40px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.form > ul >li:first-child {/* border-right:1px solid #dccbb8; */}
.form > ul >li:last-child {border-left: 1px solid #7d7d7d;margin-top: 15px;}

.form ul li h1 {color: #191e29;margin: 12px 0;}
.form ul li h1 span {display:block;font-size:30px;line-height:30px;}
.form ul li h1 a img {max-width:200px}
.form ul li h1 a {text-decoration: none;/* color: #191e29; */font-size: 48px;line-height: 1em;letter-spacing: -1px;/* margin-top: 10px; *//* display: block; *//* margin-bottom: 6px; */}
.form ul li h1 a + a {float:right;margin-top: 17px;}
.form ul li h1 a + a > i {display:none;}
.form li div {float: left;/* margin: 18px 0 0; */float: right;}
.form li div:first-child {width: 82%;padding: 0;float: left;}
.form li div button {display: block;text-align: center;width: 100%;margin: 0;padding: 13px 25px;background: #00a8de;border: none;letter-spacing: -1px;color: #ffffff;font-size: 24px;line-height: 25px;font-weight: 400;font-family: 'Noto Sans KR', sans-serif;cursor: pointer;/* height: 81px; */margin-top: 6px;}

.form li div ul {overflow: hidden;width: 100%; padding:0; margin-top: 4px;}
.form li div ul li {float: left;padding: 2px 0 0;height: 39px;width:  100%;}
.form li div ul li span{width: 4%;display: inline-block;text-align:  center;}
.form li div ul li span.text {font-size: 20px;padding: 0 18px 0 0;display: inline-block;vertical-align: middle;min-width: 90px;text-align:  justify;letter-spacing: -3px;height: 34px;width: 20%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;line-height: 34px;font-weight: 500;}
.form li div ul li span.text:after {content: "";  display: inline-block;  width: 100%;}
.form li div ul li input[type='text'], .form li div ul li input[type='tel']{height: 34px;font-size: 15px;padding: 0 0 0 10px;padding-left: 10px;border: 0;background: #f9f7f5;color: #191e29;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;width: 50%;vertical-align: top;}
.form li div ul li ::-webkit-input-placeholder { /* Chrome */color:  #8e8a86;}
.form li div ul li :-ms-input-placeholder { /* IE 10+ */color:  #8e8a86;}
.form li div ul li ::-moz-placeholder { /* Firefox 19+ */color:  #8e8a86;opacity: 1;}
.form li div ul li :-moz-placeholder { /* Firefox 4 - 18 */color:  #8e8a86;  opacity: 1;}
.form li div ul li input[name='name'] {width: 150px;}
.form li div ul li input[type='tel'] {width: 23%;}
.form li div p.agree {font-size: 14px;line-height: 30px;padding: 0;display:  inline-block;}
.form li div p input[type='checkbox'] {vertical-align: middle;display: inline-block;margin-right: 5px;margin-top: 0;height: auto;margin-left: 13px;}
.form li div ul li select {height: 34px;font-size: 15px;padding: 0 10px;padding-left: 10px;border: 0;background: #f9f7f5;margin-top: 0px;width: 37%;}

.step > img {left: 50%;margin-left: -960px;position: relative;display:  block;}
.visual {margin-top: 115px;}
.step8 a {position: absolute;z-index: 1;left:  50%;margin-left: -512px;bottom: 17%;}


.step10 {background: #494f5f;padding: 0 0 100px 0;text-align: center;}
.step10 img {position: static;margin:0;display: inline-block;}
.step10 #map{border:1px solid #d3d3d3;/* margin-top: 20px; */height: 425px;width: 100%;max-width: 1100px;margin: 0 auto;background: url(../images/map.jpg);}
.step10 #map .name {width:150px;text-align:center;padding:6px 0; color:#444; line-height: 1.1}
.step10 ul {max-width: 1200px;margin: 0 auto 0;overflow: hidden;}
.step10 ul li {width:33.333333333%}
.foot {background: #444444;color: #fff;line-height: 1.4em;text-align: center;padding: 30px 0;}
.foot > span {margin:0 15px;}
.floatMenu {display: none;}

/* mobie 767 */
@media screen and (max-width:767px){
  .floatMenu {display: block;position: absolute;right: 0;bottom: 40px;z-index: 10;}
  .floatMenu li {float:none;margin-bottom: 5px;}
  .floatMenu li a {display:block; text-align:center;}
  .floatMenu li i {font-size: 2em;background: #F9E000;color:#3B1C1C;border-radius: 100px 0 0 100px;width: 46px;height: 46px;display: block;line-height: 43px;}
  .floatMenu li i:before {margin-right:0}
  .pc {display: none;}
/*   .floatMenu li:first-child i{
    line-height: 38px;
    background: #353c4f;
    color: #fff;
} */
  .floatMenu li:last-child i{font-size: 1.6em;background: #009bcc;color:#ffffff;}
  .mobile {display: block !important;}
	body {min-width: 100%;width: 100%;}
	input {height: 15px;}
	section{margin-top: 115px;}
	img {position: static;/* max-width: 100%; */margin:0;display: block !important;}
  .form.f_nav {margin-top: -74px;}
  .wrap > .header ul {width: 100%;margin: 0 auto;}
  .form{
    min-width: 320px;
}
	.form > ul {width: auto;padding: 0 15px;}
	.form > ul >li:first-child {text-align: center;border: 0;}
	.form > ul >li:first-child img {height: 60px;line-height: 0;margin-top: 0;}
	.form ul li h1 {margin: 0;text-align: center;font-size: 1em;}
	.form ul li h1 a {/* font-size: 40px; *//* margin: 0; *//* line-height: 0; */display: inline-block;}
	.form ul li h1 a + a {font-size:0;}
	.form ul li h1 a + a > i{/* font-size: 34px; *//* display:block; *//* margin-top: 5px; */}
	.form ul li h1 a + a:before {/* content: 'CLICK'; *//* font-size: 19px; */position:absolute;margin-left: -50px;top: 40px;}
	.form ul li h1 a + a:after {/* content:'전화상담'; */font-size: 14px;position:absolute;margin-left: -51px;top: 24px;}
	.form ul li h1 span{font-size:20px;display: none;}
	.form > ul >li {width: 100%;padding: 10px 0;position: relative;}
	.form li div{margin: 0px 0;border: 0;overflow:  hidden;width: 22%;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;padding-left: 5px;}
	.form li div ul li{height: 32px;}
	.form li div:first-child{width: 78%;}
	.form > ul >li:last-child{border: 0;/* border-top: 1px solid #b5b5b5; */padding-bottom: 20px;margin-top: -10px;}
	.form li div ul{margin-top:0;}
	.form li div ul li span.text {font-size: 13px;min-width: 48px;padding: 0 10px 0 0;/* height: auto; */vertical-align: -webkit-baseline-middle;width: 22%;letter-spacing: -3px;line-height: 28px;}
	.form li div ul li span{
    line-height: 28px;
    vertical-align: top;
}
	.form li div ul li input[type='text'], .form li div ul li input[type='tel'] {font-size: 19px;max-width: 42%;height: 28px;padding: 3px;text-align:  center;border-width: 1px;width: 77%;}
	.form li div ul li input[type='tel'] {width: 23%;}
	.form li div button {padding: 10px 0;height: auto;font-size: 22px;line-height: 22px;margin-top: -0;}
  .form li div p.agree {/* position: absolute; */font-size: 12px;/* padding: 0 0 0 4px; *//* letter-spacing: 0; *//* left: 15%; *//* bottom: -1px; */}
  .form li div p input[type='checkbox']{margin-left:5px;}
  .form li div ul li select{height: 28px;font-size: 14px;width: 52%;vertical-align: top;}
  div.step {min-width: 320px; height:auto !important;}
	.form{height: 160px;}
	.form.f_form{top: -63px;}
  .wrap {min-width: 320px;}
  .step > ul > li {width: 50%;float: left;}
  .step > img {position: static;width: 160%;margin-left: -30%;}
    .visual{margin-top: 159px;}
   .step10 > img{width:100%; margin:0}
  .step10 {padding: 0 0 30px;}
  .step10 #map {height: 200px; width: auto;margin: 0 15px;}
  .step10 ul {margin: 0 15px;}
  .step10 > img.add {    width: 100%;    margin: 0;}
	.foot {font-size: 10px;padding: 10px;}
	.foot > span {display: block;}
	.foot br {display: none;}
	.foot p {display: block; margin: 10px 50px 0 50px}
	.step10 ul li img {    width: 100%;}
}

@media screen and (max-width:384px){
#header li div p {letter-spacing: -1px;}

}


@media screen and (max-width:320px){
	#header li div p {font-size: 11px;letter-spacing: -2px;}
	.step10 ul li img {}
}
