@charset "UTF-8";
 @import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900');
 @import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');
 @import url('https://cdn.jsdelivr.net/font-nanum/1.0/nanumbarungothic/nanumbarungothic.css');

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: 'Noto Sans KR', 나눔고딕, 돋움, Helvetica Neue, Helvetica, Arial, sans-serif;
 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;}
.step > img {left: 50%;margin-left: -960px;position: relative;display:  block;}
.visual {margin-top: 120px;}
.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: #e46bb1;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;}
  #header{max-height:114px;}
	#header iframe{max-height:115px}
	#header.f_nav {margin-top: -40px;}
  .wrap {min-width: 320px;}
  .step > ul > li {width: 50%;float: left;}
  .step > img {position: static;width: 160%;margin-left: -30%;}
    .visual{margin-top: 115px;}
   .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 {}
}
