*, html, body {margin:0; padding:0; box-sizing: border-box;}
html, body {height:100%;}
body {font-size:16px; color:#666; font-family: sans-serif, "NanumGothic","나눔고딕","맑은 고딕",HelveticaNeue-Light,AppleSDGothicNeo-Light,"돋움",dotum; line-height: 1.5}
.sdonly {position: absolute; top:0;left:0; color:transparent; height:0;line-height:0; width:0; font-size:0;}
.inner {max-width:1100px; margin:0 auto;}
.col01 {color:#88b5d6;}
.col02 {color:#c30e2e;}
.col03 {color:#ff0;}
.bgc1 {background:#c30e2e;}
.bgc2 {background:#555;}
.bgc3 {background:#88b5d6;}
.al-l {text-align: left; padding-bottom: 0.5em;}
.m-tt {font-size:1.6em; color:#fff; padding-bottom: 0.5em; text-align: left;}
a {text-decoration: none;}
a, img{border:0;}
body#main {background:url(../img/index_bg.jpg) no-repeat 50% 50% fixed; background-size: cover;}
.mb-only {display: none;}

/* index */
#header {position: absolute; top:0;left:0;right:0; padding:1.2em; text-align: center; background:#fff; z-index: 999;}

#main-wrapper { overflow: hidden;}
#main-wrapper .top_bg_icon {margin:12em auto 0; background:url(../img/in_bg_top.png) no-repeat 50% 0; height:102px; max-width:1100px;}
#main-section {margin:0em auto 0; background:#002947; background:rgba(0,41,71,0.9) url(../img/logo_bg.png) no-repeat 120% 50%;padding:1.4em 4em 4em; max-width:1100px;}
#main-section header {color:#fff; text-align: center; padding:0 0 2em 0;border-bottom:1px solid #3a6887; border-bottom:1px solid rgba(256,256,256,0.2);}
#main-section header p {font-size:1.5em;}
#main-section header h1 {font-size:2.8em; letter-spacing: -0.05em;}
#main-section header p.subtt {font-size:1.2em; color:#aadbff; padding-top: 0.5em}
#main-section #container {padding-top: 2.5em;}
#main-section #container ul {list-style: none; overflow: hidden;}
#main-section #container ul li {display:block; font-size:24px; width:49%;}
#main-section #container ul li.left { margin-right:1%; float: left; background:url(../img/btn_bg1.png) repeat;}
#main-section #container ul li.right { margin-left:1%; float: right;background:url(../img/btn_bg2.png) repeat;}
#main-section #container ul li a {display: block; color:#fff; line-height: 6em;}
#main-section #container ul li a img {vertical-align: middle; float: left; margin:0.6em; letter-spacing: -0.08em}
#main-section #container ul li.left a {background:url(../img/arrow.png) no-repeat 92% 50%;}
#main-section #container ul li.right a {background:url(../img/arrow.png) no-repeat 92% 50%;}
#main-bototm {padding:3em 0 5em; margin:0 auto 0; max-width:1100px;}
#main-bototm span {display: block;background:url(../img/btn_bg3.png) repeat;}
#main-bototm a {display: block; background:url(../img/arrow.png) no-repeat 68% 50%; line-height: 5em; font-size:24px; line-height: 4em;  color:#fff; text-align: center;}
#footer {text-align: center;  border-top:1px solid #ddd; padding:2em 1em;}
#footer p {font-size:0.9em;}
body#main #footer {text-align: center;  border-top:1px solid #3a6887; border-top:1px solid rgba(256,256,256,0.2);}
body#main #footer p {color:#fff; font-weight: normal;  opacity: 0.5}
i.i_hat {display: inline-block; width:31px;height:26px; background:url(../img/icon_hat.png) no-repeat 0 0; margin-right: 0.8em;}
#logo img {width:100%; max-width:310px;}


/* sub */
#sub-section {padding-bottom: 6em;}
#sub-section header {padding: 9.5em 0 3em; text-align: center; background:url(../img/index_bg.jpg) no-repeat 50% 50% fixed; background-size: cover; color:#fff; position: relative;}
#sub-section header:after {position: absolute; top:0;left:0;bottom:0;right:0; background: rgba(0,0,0,0.5); content:'';display: block;}
#sub-section header > * {position: relative; z-index: 9;}
.error { color:#fff; text-align: center;}
.error p {font-size:1.6em;}
.error h2 { font-size:2.4em; }
.error p {font-size:1em;}

/* 검색결과 */
#search_layer {display: none;}
.ov-bg {background:#000; opacity: 0.8; position: fixed; top:0;left:0;bottom:0;right:0; z-index: 99;}
.search-popup {position: absolute; top:5em; width:90%; max-width:600px; left:50%; margin-left: -300px; z-index: 100; background:#fff; padding:2em; border:1px solid #444;}
.search-popup header h2 {padding-bottom: 0.5em;}
.outup-area { background:#fff; padding:1em;border-bottom:1px solid #ddd; text-align: left;}
.outup-area ul {list-style: none; padding-left: 7em; }
.outup-area ul li {margin-bottom: 0.3em; cursor: pointer;}
.outup-area ul li:hover {text-decoration: underline;}
.outup-area ul li b {color:blue; font-weight: normal}
.close-btn {margin:1em auto 0;}


/* form */
.submit-form {text-align: center;  }
.submit-form table {border-collapse: collapse; border-spacing: 0; width:100%; border-top:2px solid #c30e2e;background:#fff;}
.submit-form table .col1 {width:20%;}
.submit-form table th, .submit-form table td {text-align: left; padding: 0.75em 1.4em; border-bottom:1px solid #ddd;}
.submit-form table th {color:#333; font-size:1em; background:#f7f7f7; }
.submit-form table td {}
.submit-form h3 {font-size:1.6em; color:#333; padding-top: 50px; padding-bottom: 18px; text-align: left;} 
.submit-form h3:before {display: inline-block; content:''; width:8px; height:8px; background:#c30e2e; border-radius: 50%; margin-right: 8px; clear: both; vertical-align: top; margin-top: 0.6em;}

.submit-form h4 {font-size:1.0em; color:#c30e2e; padding-bottom: 18px; text-align: left;} 

.submit-form input[type=text], .submit-form input[type=password] {padding:0 0.7em; border:1px solid #c4c4c4; background:#fff; vertical-align: middle; height:2.8em; line-height: 2.8em;}
.submit-form input.long {width:70%;}
.submit-form .btn {padding:0 1.4em; color:#fff; border:0; vertical-align: middle; cursor: pointer; height:2.8em; line-height: 2.8em;}
.submit-form textarea {width:100%; display: block; min-height: 10em; padding:1em;}
.submit-form .mt-s {padding-top: 1.2em; font-size:0.8em;}
/*
.submit-form .s-tt {color:#c30e2e; display: inline-block; width:10em; vertical-align: top;}
*/
.submit-form .s-tt {color:#000; display: inline-block; width:5em; vertical-align: top;}
.submit-form .s-tt.mt-b {margin-bottom: 1em;}
.submit-form .small {width:15%; max-width:100px;}
.submit-form select {padding:0 1.4em; height:2.8em; vertical-align: middle;}
.submit-form input[type=checkbox], .submit-form input[type=radio] {width:1.2em; height:1.2em; vertical-align: middle; margin-left:1.2em; clear: both; margin-bottom: 0.2em;}
.submit-form td input[type=checkbox]:first-child, .submit-form td input[type=radio]:first-child {margin-left:0;}
.submit-form #agree-div {text-align: right; padding:1em 0; color:#333;}
.submit-form .submit-btn {padding:1.3em 3.5em; font-size:1.2em; color:#fff; display: inline-block; border:0; cursor: pointer; margin-top: 1.5em;}
.submit-form td input.date-btn {background:url(../img/date_ui_2.png) no-repeat 100% 50%}
.submit-form td input.date-btn::-ms-clear {display:none;}
.submit-form .pc-f {margin-left: 0 !important;}
.submit-form .hiddentext {margin-top: 0.4em; display: none;}


/* 달력 custom */
#ui-datepicker-div {background:#f6f6f6; border:1px solid #333; padding:0.5em; font-size:0.9em; display: none;}
#ui-datepicker-div .ui-datepicker-header {position: relative;}
#ui-datepicker-div .ui-datepicker-prev, #ui-datepicker-div .ui-datepicker-next {width:30px; height:30px; background:#f6f6f6; display: block; top:6px; position: absolute; cursor: pointer; background:url(../img/date_ui.png) no-repeat;}
#ui-datepicker-div .ui-datepicker-prev {left:3px; background-position: 0 -30px;}
#ui-datepicker-div .ui-datepicker-next {right:3px; background-position: 0 0px;}
#ui-datepicker-div .ui-datepicker-prev span , #ui-datepicker-div .ui-datepicker-next span {display: none;}
#ui-datepicker-div .ui-datepicker-title {color:#333; font-size:1.3em; text-align: center; padding:0.3em; border-bottom:1px solid #ddd; margin-bottom: 0.3em;}
#ui-datepicker-div .ui-datepicker-calendar {width:100%; border-collapse: collapse; border-spacing: 0;}
#ui-datepicker-div .ui-datepicker-calendar th, #ui-datepicker-div .ui-datepicker-calendar td { text-align: center;}
#ui-datepicker-div .ui-datepicker-calendar th {padding-bottom: 0.3em;}
#ui-datepicker-div .ui-datepicker-calendar a {text-decoration: none; display: block; color:#666; padding:2px 6px; border:1px solid #f6f6f6;}
#ui-datepicker-div .ui-datepicker-today a {border-bottom:1px solid #c30e2e;}
#ui-datepicker-div .ui-datepicker-calendar a:hover, #ui-datepicker-div .ui-datepicker-calendar a:focus {color:#c30e2e; border:1px solid #c30e2e;}
#ui-datepicker-div span[title=Sunday] {color:#d23145;}
#ui-datepicker-div span[title=Saturday] {color:#366dd3;}
#ui-datepicker-div .ui-state-disabled {color:#ccc;}

@media screen and (max-width:1100px) {
	.inner {padding:0 1em;}
	#main-wrapper .top_bg_icon {margin:12em 1em 0;}
	#main-section {margin:0em 1em 0;}
	#main-section header h1 {font-size:2em; line-height: 1.3}
	#main-section #container ul {list-style: none; overflow: hidden;}
	#main-section #container ul li {display:block; font-size:18px; width:100%; margin:0; float: none;margin-bottom: 5px;}
	#main-section #container ul li a {padding-left: 1em;line-height: 5em;}
	#main-section #container ul li img {width:70px;}
	#main-bototm {padding:2em 1em;}
	#main-bototm a {background:url(../img/arrow.png) no-repeat 90% 50%;}
}
@media screen and (max-width:800px) {
	.submit-form table, .submit-form table tr, .submit-form table tr th, .submit-form table tr td {display: block;}
	.submit-form table th {border-bottom:0; background:#fff; padding: 1.4em 0 0 1.4em; font-weight: bold;}
	.submit-form table td {padding-top: 0.5em}
	.submit-form select {text-align: left !important; padding:0;}
	.search-popup {max-width:420px; margin-left: -210px;}
	.search-popup td .btn {margin-top: 0.2em;}
	.outup-area ul {padding-left: 0em; }
}
@media screen and (max-width:600px) {
	body {font-family:HelveticaNeue-Light,AppleSDGothicNeo-Light, sans-serif }
	body {font-size:14px; min-width:320px;}
	#header {padding:0.5em;}
	#main-wrapper .top_bg_icon {margin:8em 0.5em 0;}
	#main-section {padding:2em 0.5em 2em;margin:0em 0.5em 0;}
	#main-section header p {padding-bottom: 0.5em }
	#main-section header h1 span {display: block;}
	#main-section header h1 {font-size:1.8em; line-height: 1.3}
	#main-section #container ul {list-style: none; overflow: hidden;}
	#main-section #container ul li {font-size:18px; }
	#main-section #container ul li img {display: none;}
	#main-bototm {padding:2em 0.5em;}
	#main-bototm a {font-size:18px; text-align: left;background:url(../img/arrow.png) no-repeat 90% 50%; line-height: 4em; padding-left:1.2em}
	#main-bototm a i {display: none;}
	body#main #footer {line-height: 1.5; padding:1em;}

	#sub-section header {padding:7.5em 0 2em;}
	#sub-section header h1 {font-size:1.6em;}
	.submit-form table th, .submit-form table td {padding:1em;}
	.submit-form table th {border-bottom:0; background:#fff; padding: 0.8em 0 0 1em; font-weight: bold; font-size:1.2em;}
	.submit-form table td {padding-top: 0.5em}
	.submit-form input[type=text], .submit-form input[type=password] {max-width:156px;}
	.submit-form .small {max-width:70px; width:70px;}
	.submit-form input.short {max-width:70px;}
	.submit-form h3 {padding-bottom:10px; font-size:1.3em;}
	.submit-form .btn {padding-left:0.5em; padding-right:0.5em;}
	.submit-form .mb-50 {width:40%;}
	.submit-form input.mb-10 {width:90%; max-width: 90%;}
	.submit-form .mb-t {margin-top: 0.5em;}
	.submit-form .mb-b {margin-bottom: 0.5em;}
	.submit-form .mb-t-none {border-bottom:0 !important; padding-bottom: 0 !important}
	.submit-form td .s-tt {display: block; padding:0; width:100%;margin-bottom:0.3em; margin-top: 0.3em}
	.submit-form td .s-tt.mt-b {margin-bottom: 0.3em;}
	.mb-only {display: block !important}
	.submit-form .mt-s {display: block; font-size:1em;}
	.submit-form .mb-f {margin-left:0 !important;}

	.search-popup {max-width:300px; margin-left: -150px;}
	.search-popup td .btn {margin-top: 0.2em;}
	.outup-area ul {padding-left: 0em; }
}