@charset "utf-8";
@import url(http://api.mobilis.co.kr/webfonts/css/?fontface=NanumGothicWeb);

/* 초기화 */
html {overflow-y:scroll}
body {margin:0;padding:0;font-size:1em; font-family:'맑은 고딕', 'Malgun Gothic', Dotum; background:#8d9099; position:relative; }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:'Noto Sans Korean',sans-serif}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family:'Noto Sans Korean',sans-serif;font-size:1em}
input[type="submit"]{cursor:pointer}
button {cursor:pointer}

table {border-collapse:collapse; border-spacing:0}

textarea, select {font-family:'Noto Sans Korean',sans-serif;font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input[type=text],input[type=password], textarea {
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
}

input[type=text]:focus,input[type=password]:focus,  textarea:focus,select:focus {
-webkit-box-shadow:  0 0 5px #9ed4ff;
-moz-box-shadow:  0 0 5px #9ed4ff;
box-shadow: 0 0 5px #9ed4ff;
border: 1px solid #558ab7 !important;
}




body > div#wrapper {position:relative; width:1024px; height:768px; background:#ffffff; top:60px; left:50%; transform:translate(-50%,0%); box-shadow:0 0 5px rgba(0, 0, 0, 0.15);}
h2 {position:relative; width:100%; height:50px; background: url(../img/top_bg.jpg) repeat-y; font-size:20px; color:#ffffff; text-shadow:0 0 5px rgba(0, 0, 0, 0.15);line-height:50px; text-align:right; padding-right:10px;}
h2 > img {position:absolute; top:5px; left:5px; height:40px;}
body > div#wrapper > div#inbox {width:100%; height:650px; padding:10px; overflow-y: scroll; overflow-x: hidden;}

section {margin-bottom:20px;line-height: 2em;}
section > h3 {font-size:1.2em; font-weight:600; padding-left:5px;height:45px;color:#4d78c0; margin-top:20px; background:url(../img/ico01.gif) no-repeat 4px 35px;}
section > h4 {font-size:1.0em; font-weight:500; padding-left:20px; margin-top:10px;background: url(../img/ico02.gif) no-repeat 5px 10px;}
section > p {font-size:0.9em; font-weight:300;padding-left:20px;}
section > p.right {text-align:right; padding-right:20px;}
section > ul {width:100%; padding-left:40px;}
section > ul > li {font-size:0.9em; list-style: none; margin-right:20px; display:inline-block;}
section > ul > li:after{clear:both}
section > ol {width:100%; padding-left:40px;}
section > ol > li {font-size:0.9em; list-style:decimal; margin-bottom:10px;}
section > ol > li > ol {width:100%; padding-left:10px;}
section > ol > li > ol > li {font-size:0.9em; list-style:none;}


table {position:relative; top:5px; left:5px; font-size:0.9em; width:calc(100% - 20px); padding:10px;}
table > caption {display:none;}

table.type01 {border-top:solid 2px #adc7d9;}
table.type01 > thead > tr > th {
	background:#f5fafd;
	border-bottom:solid 1px #e6e6e6;
	text-align:center;
}
table.type01 > tbody > tr > td {
	background:#ffffff;
	border-bottom:solid 1px #e6e6e6;
	text-align:center;
}

table.type02 {border-top:solid 2px #adc7d9;}
table.type02 > thead > tr > th {
	background:#f5fafd;
	border-bottom:solid 1px #e6e6e6;
	text-align:center;
}
table.type02 > tbody > tr > th,table.type02 > tbody > tr > td {
	background:#ffffff;
	border-bottom:solid 1px #e6e6e6;
}
table.type02 > tbody > tr > td:first-child{ text-align: center;}

table.type03 {border-top:solid 2px #adc7d9;}
table.type03 > thead > tr > th {
	background:#f5fafd;
	border-bottom:solid 1px #e6e6e6;
	text-align:center;
}
table.type03 > tbody > tr > th,table.type03 > tbody > tr > td {
	background:#ffffff;
	border-bottom:solid 1px #e6e6e6;
	height:40px;
}

table.type04 {border-top:solid 2px #adc7d9;}
table.type04 > thead > tr > th {
	background:#f5fafd;
	border-bottom:solid 1px #e6e6e6;
	text-align:center;
}
table.type04 > tbody > tr > th,table.type04 > tbody > tr > td {
	background:#ffffff;
	border-bottom:solid 1px #e6e6e6;
}
table.type04 > tbody > tr > td:first-child{ text-align: center;}

form {padding:10px;}
form button {
	padding: 10px 20px 10px 20px;
	width: 200px;
	text-align: center;
	font-size: 20px;
	color: #fff;
	font-weight: bold;
	background: #e7606e;
	text-shadow: 1px 1px 0 #b84c59;
	border:0;
}

section button {
	padding: 10px 20px 10px 20px;
	width: 200px;
	text-align: center;
	font-size: 20px;
	color: #fff;
	font-weight: bold;
	background: #e7606e;
	text-shadow: 1px 1px 0 #b84c59;
	border:0;
}

.btn_frmline {
	padding: 5px 10px 5px 10px;
	width: 150px;
	text-align: center;
	font-size: 16px;
	color: #fff;
	font-weight: 400;
	background: #4597a7;
	text-shadow: 1px 1px 0 #55b5c8;
	border:0;
}

input.fullinput { width:100%;}

input[class="cb"] + label {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid #bcbcbc;
	cursor: pointer;
}
input[class="cb"]:checked + label {
	background-color: #666666;
}
input[class="cb"] {
	display: none;
}

input[class="rb"] + label {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid #bcbcbc;
	border-radius:18px;
	cursor: pointer;
}
input[class="rb"]:checked + label {
	background-color: #666666;
}
input[class="rb"] {
	display: none;
}

input[type='text'],input[type='password'],select {
	padding:5px 10px 5px 10px;
	margin:5px 0px 5px 0px;
	text-align:center;
}

ol.small { font-size: 14px; line-height: 20px; list-style: none; padding:0;}
.step3_textarea{width:100%;height:250px;display:block;margin:5px auto;background:#ffffff;padding:2%}
.step3_radio{width:80%;height:auto;overflow:hidden;margin:0 auto;text-align:right;}

@media screen and (max-width:1920px) {
.scroll-content {}
.scroll-content-x { padding-bottom:15px; }
.scroll-content-y { padding-right:15px; }
.scroll-track { width:10px; height:10px; background:#d5d5d5; }
.scroll-track-x { left:0; bottom:0; }
.scroll-track-y { right:0; top:0; }
.scroll-neutralzone { right:0; bottom:0; width:10px; height:10px; background:#d5d5d5; }
.scroll-bar { width:10px; height:10px; background:#000; }
.scroll-bar.active { background:#fff; }
.scroll-arrow { width:10px; height:10px; background:#000; }
.scroll-arrow:active { background:#fff; }
.scroll-arrow-left { left:0; top:0; margin-right:1px; }
.scroll-arrow-right { right:0; top:0; margin-left:1px; }
.scroll-arrow-up { left:0; top:0; margin-bottom:1px; }
.scroll-arrow-down { left:0; bottom:0; margin-top:1px; }

.ios { }
.ios .scroll-content { margin:0; }
.ios .scroll-content-x,
.ios .scroll-content-y { padding:0; }
.ios .scroll-track { width:7px; height:7px; background:none; }
.ios .scroll-track-x { left:1px; bottom:1px; }
.ios .scroll-track-y { right:1px; top:1px; }
.ios .scroll-neutralzone { width:0; height:0; }
.ios .scroll-bar { width:5px; height:5px; border:1px solid #fff; border-radius:3px; background:#000; }
.ios .scroll-arrow { display:none; }
}

@media screen and (max-width:1023px) {
	body > div#wrapper {
		position:relative; 
		width:480px; 
		height:auto; 
		background:#ffffff;
		top:0; 
		left:50%; 
		transform:translate(-50%,0%); 
		box-shadow:0 0 5px rgba(0, 0, 0, 0.15);
		}
	h2 {position:relative; width:100%; height:50px; background: url(../img/top_bg.jpg) repeat-y; font-size:16px; color:#ffffff; text-shadow:0 0 5px rgba(0, 0, 0, 0.15);line-height:50px; text-align:right; padding-right:10px;}
	h2 > img {position:absolute; top:5px; left:5px; height:40px;}
	body > div#wrapper > div#inbox {width:100%; height:100%;padding:10px; overflow:none;}
	section > img {display:none; width:100%;}

	table.type01 th,table.type01 td {width:33.33%}
	table.type02 th:first-child,table.type02 td:first-child {display:none;}
	table.type02 th:nth-child(2),table.type02 td:nth-child(2) {display:none;}
	table.type02 td input {width:100%}
}

@media print{
.noprint{
	display:none;
}
}