@charset "UTF-8";
/* CSS Document */

@font-face {
	font-family: 'Noto Sans KR';
	src: url(../fonts/NotoSansKR-Thin.woff)  format(font-woff),
		 url(../fonts/NotoSansKR-Thin.otf);
	font-weight: 100;
    font-style: normal;
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url(../fonts/NotoSansKR-Light.woff)  format(font-woff),
		 url(../fonts/NotoSansKR-Light.otf);
	font-weight: 300;
    font-style: normal;
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url(../fonts/NotoSansKR-Regular.woff)  format(font-woff),
		 url(../fonts/NotoSansKR-Regular.otf);
	font-weight: 400;
    font-style: normal;
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url(../fonts/NotoSansKR-Medium.woff)  format(font-woff),
		 url(../fonts/NotoSansKR-Medium.otf);
	font-weight: 500;
    font-style: normal;
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url(./fonts/NotoSansKR-Bold.woff)  format(font-woff),
		 url(./fonts/NotoSansKR-Bold.otf);
	font-weight: 700;
    font-style: normal;
}
@font-face {
	font-family: 'Noto Sans KR';
	src: url(./fonts/NotoSansKR-Black.woff)  format(font-woff),
		 url(./fonts/NotoSansKR-Black.otf);
	font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family:'dotsfont';
    src:url('./fonts/dotsfont.eot');
    src:url('./fonts/dotsfont.eot?#iefix')  format('embedded-opentype'),
        url('./fonts/dotsfont.svg#font')    format('svg'),
        url('./fonts/dotsfont.woff')        format('woff'),
        url('./fonts/dotsfont.ttf')         format('truetype');
    font-weight:normal;
    font-style:normal;
}

/* 초기??*/
html {overflow-y:scroll; min-width:320px; -webkit-text-size-adjust:auto; -moz-text-size-adjust:auto; -ms-text-size-adjust:auto;}
body {margin:0; padding:0; font-size:0.75em; height:100%; min-height: inherit; overflow-y: auto; -webkit-overflow-scrolling:touch; -webkit-text-size-adjust:none;}  
body, p, div, span, a, ol, ul, li, table, tr, th, td, h1, h2, h3, h4, h5, h6, strong, b, em, address,  label, section, article, figure, form, fieldset, button, legend, input, textarea, selection{line-height:1.6em; letter-spacing:-0.05em; font-family:"Noto Sans KR", Arial, sans-serif !important;}
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}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0; padding:0; font-size:1em;}
button,input[type=submit]{cursor:pointer;}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0; font-size:1em; -webkit-appearance:none}
textarea, select {font-size:1em; font-family:"Noto Sans KR", dotum, Arial, sans-serif;}
textarea {border-radius:0; -webkit-appearance:none; overflow:auto; }
p {margin:0; padding:0; word-break:break-all;}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
ol, ul,li,dl,dt,dd{list-style:none; padding: 0; margin: 0;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content:''; content:none}
table{border-collapse:collapse; border-spacing:0}
em, address{font-style:normal;}

/* Hyper Link */
a, a:link, a:visited, a:active, a:hover{text-decoration:none}
a.btn101 {display: block; padding:10px 0; width: 100%; font-weight: 400; font-size: 1.2em; color: #707070; background:#ebebeb; margin: 0 auto; cursor: pointer; border-radius: 5px;}

input[type='checkbox']{-webkit-appearance:checkbox}
input[type='radio']{-webkit-appearance:radio}
input[type='number']{-webkit-appearance:none}
input[type='search']::-webkit-search-cancel-button{-webkit-appearance:none}

/* blind */
caption, .blind{overflow:hidden; position:absolute; top:-1px; left:-1px; z-index:-1; width:1px; height:0px; font-size:0; line-height:0; white-space:nowrap}

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

input, select, textarea {-moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; outline: none; border-radius:0px;}

input[type=checkbox] {display: none; }

input[type=radio] {margin-top:-2px; width:18px; height: 18px; border-radius: 50%; bordr:1px solid #999;}

input[type=checkbox] + label.all{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 30px;  
    margin-right: 0px;
	margin-top: 20px;
	font-weight:400;
}

input[type=checkbox]+ label.all:before {     
    content: "\2713"; /* 체크모양 */ 
    display: inline-block;  
    width: 22px;  
    height: 22px;  
    font-size: 1.35em; 
    font-weight:600; 
    color: #ccc; 
	text-align: center;  
    line-height: 18px;  
    margin-right: 30px;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #fff;  
    border-radius: 0; 
    border:1px solid #ccc;
}

input[type=checkbox]:checked + label.all:before { 
    content: "\2713";  /* 체크모양 */
    font-size: 1.35em; 
    font-weight:600; 
    color: #fff;  
    background:#2ac1bc;
    text-align: center;  
    line-height: 18px;  
} 

input[type=checkbox] + label.each{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding: 0 7px 0 30px;
	margin-top: 0px;
	font-weight:400;
	font-size: 1em; 
	line-height: 1.125em;
	width:88%; 
	word-break: keep-all;
}

input[type=checkbox]+ label.each:before {     
    content: "\2713"; /* 체크모양 */ 
    display: inline-block;  
    width: 22px;  
    height: 22px;  
    font-size: 1.35em; 
    font-weight:600; 
    color: #ccc; 
	text-align: center;  
    line-height: 30px;  
    margin-right: 30px;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
}

input[type=checkbox]:checked + label.each:before { 
    content: "\2713";  /* 체크모양 */ 
    font-size: 1.35em; 
    font-weight:600; 
    color: #2ac1bc;  
    background:#fff;
    text-align: center;  
    line-height: 30px;
} 

input[type=checkbox] + label.eachbox{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding: 0.7em 0;
	margin-left: -1em;
	font-weight:400;
	font-size: 1em; 
	line-height: 1.7em;
}

input[type=checkbox]+ label.eachbox:before {     
    content: "\2713"; /* 체크모양 */ 
    display: inline-block;  
    width: 22px;  
    height: 22px;  
    font-size: 1.35em; 
    font-weight:900; 
    color: #ccc; 
	text-align: center;  
    line-height: 18px;  
    margin-right: 0;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
	border: 2px solid #ccc;
}

input[type=checkbox]:checked + label.eachbox:before { 
    content: "\2713";  /* 체크모양 */ 
    font-size: 1.35em; 
    font-weight:900; 
    color: #2ac1bc;  
    background:#fff;
    text-align: center;  
    line-height: 18px;
} 

input[type=checkbox] + label.edcheck{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding: 0.7em 0;
	margin-left: -1em;
	font-weight:400;
	font-size: 1em; 
	line-height: 1.7em;
}

input[type=checkbox]+ label.edcheck:before {     
    content: ""; /* 체크모양 */ 
    display: inline-block;  
    width: 22px;  
    height: 22px;  
    font-size: 1.35em; 
    font-weight:900; 
    color: #ccc; 
	text-align: center;  
    line-height: 18px;  
    margin-right: 0;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #f2f2f2; 
	border: 2px solid #ccc;
}

input[type=checkbox]:checked + label.edcheck:before { 
    content: "";  /* 체크모양 */ 
    font-size: 1.35em; 
    font-weight:900; 
    color: #2ac1bc;  
    background:#f2f2f2;
    text-align: center;  
    line-height: 18px;
} 


select {
    -webkit-appearance: none;  /* ?�이?�브 ?�형 감추�?*/
     -moz-appearance: none;
     appearance: none; 
	 background: url(../images/arrow.png) no-repeat 100% 50%; 
}

/* IE 10, 11???�이?�브 ?�살???�기�?*/
select::-ms-expand {display: none;}
select.add1{ float: left; width:48%; font-size: 1.417em; padding: 0.5em; border: 1px solid #707070; border-radius: 0; color: #999; outline: none;}
select.add1-1{float: right;  width:48%; font-size: 1.417em; padding: 0.5em; border: 1px solid #707070; border-radius: 0; color: #999; outline: none;}
select.place{ display: block; width:100%; font-size: 1.417em; padding: 0.5em; border: 1px solid #707070; border-radius: 0; color: #999; margin: 0.3em 0 0.9em; outline: none;}
select.bank{ display: inline-block; width:60%; font-size: 1.417em; padding: 0.5em; border: 1px solid #707070; border-radius: 0; color: #999; outline: none;}

input.line1 {display: inline-block; width:77%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin:1em 0; outline: none;}
input.line2 {display: inline-block; width:44%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin:0 0 0.3em; outline: none;}
input.line3 {display: inline-block; width:44%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin:0 0 0.3em; outline: none;}
input.line4{display: inline-block; width:60%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin-top:-0.5em; outline: none; }
input.line5{display: inline-block; width:73%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin:0.3em 0; outline: none;}
input.line6 {display: inline-block; width:100%; background: url(../images/search1.png) no-repeat 100% 50%; font-size: 1.417em; padding:0.7em 0.5em; border: 3px solid #707070; color: #999; margin:1em 0; outline: none;}/* 2020.01.15 add*/

input.tel {display: inline-block; width:60%; font-size: 1.417em; padding:0.417em 0.5em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin-top:-0.5em;  outline: none;}

input.date1 {display: inline-block; width:35%; font-size: 1.417em; padding: 0.417em 0.5em 0.35em 0.1em; border-bottom: 1px solid #707070; border-top:0; border-left: 0; border-right: 0;  border-radius: 0; color: #707070; margin:0.3em 0 1em; background: url(../images/calendar.png) no-repeat 98% 50%; outline: none;}

input.input-box {display: inline-block; width:36.5%; font-size: 1.417em; padding: 0.35em 0.3em; border: 1px solid #707070; border-radius: 0; color: #707070; margin:1em 0 ; background: #fff; outline: none;}

label.tt{ clear: both; display: block; font-size: 1.55em; font-weight:400; color: #707070; padding:0.5em 0; }
label.tt1{ clear: both; display:inline-block; width: 20%; font-size: 1.55em; font-weight:400; color: #707070; padding:0.5em 0; }



button.sch {float:right; width:53px; height:auto; padding: 0; margin:1em 0 0 1em; background: #bcbcbc;  border: 0; outline: none; cursor: pointer;}
button.sch1 {float:right; width:50px; height:auto; padding: 0; margin:0.3em 0 0 1em; background: #bcbcbc; border: 0; outline: none; cursor: pointer;}
button.datebtn {display: inline-block;  width:18%; height:auto; font-size: 1.25em; padding: 0.5em 0.3em; color: #707070; margin:1em 0.5em 1em 0; background: #ececec; border:1px solid #ececec; cursor: pointer; outline: none; }
button.datebtn:hover {background: #707070; color:#fff; border:1px solid #707070}
button.datebtn:active {background: #2ac1bc; color:#fff; border:1px solid #2ac1bc}
button.datebtn:focus {outline: none; border: 1px solid #2ac1bc;}

button.datebtn-on {display: inline-block;  width:18%; height:auto; font-size: 1.25em; padding: 0.5em 0.3em; color: #fff; margin:1em 0.5em 1em 0; background: #2ac1bc; border:1px solid #2ac1bc; cursor: pointer;}
button.datebtn-on:hover {background: #707070; color:#fff; border:1px solid #707070}
button.datebtn-on:active {background: #2ac1bc; color:#fff; border:1px solid #2ac1bc}
button.datebtn-on:focus {outline: none; border: 1px solid #2ac1bc;}

span.hyphen {display: inline-block; text-size:2em;  width: 8%; font-weight: 500; padding: 0.7em 0; margin:0 0 0.1em; text-align: center;}

::-webkit-input-placeholder {color: #999;}
:-moz-placeholder {color: #999;}
::-moz-placeholder {color: #999;}
:-ms-input-placeholder {color: #999;}


/* ?�이?�웃 */
.bg {background:#e8e7e7; }
.hd {position: fixed; top:0; left:0; width: 100%; height: 60px; background-color: #2ac1bc; box-shadow: 0px 3px 4px #b5b5b5; z-index: 10;}
.hd:after {content: ''; display: block; clear: both;}
.hd h2{position: relative; display: block; width: 100%; line-height: 60px; font-size:1.85em; font-weight: 400; color: #fff; text-align: center; margin: 0 auto;}
.hd h2 .pre a img{position: absolute; top:0; left: 0; margin:0.9em 0 0 0.5em; vertical-align: middle; height: 21px; }
.hd h2 .help a img{position: absolute; top:0; right: 0; margin:0.3em 0.3em 0 0;  vertical-align: middle; width: 55px;}

/* top 진행 bar */
.bar1 {position: relative; display: block; width:16.6%; height:10px; background: #bbbaba;}
.bar2 {position: relative; display: block; width:33.2%; height:10px; background: #bbbaba;}
.bar3 {position: relative; display: block; width:49.8%; height:10px; background: #bbbaba;}
.bar4 {position: relative; display: block; width:66.4%; height:10px; background: #bbbaba;}
.bar5 {position: relative; display: block; width:83%; height:10px; background: #bbbaba;}
.bar6 {position: relative; display: block; width:100%; height:10px; background: #bbbaba;}

.container01 { position: relative; display: block; background-color:#e8e7e7; width: 100%; min-height:500px; height:100%; margin: 0 auto; padding: 45px 25px 5px;}
.container01:after {content: ''; display: block; clear: both;}
.container01 .content01{position: relative; display: block; width: 86%; min-height: 100%; padding: 0; margin: 0 auto 0; text-align: center;}
.container01 .content01 h2 {position: relative; display: block; font-size: 3em; font-weight:700; margin: 0 auto; text-align: center; }
.container01 .content01 .mstxt {position: relative; display: block; font-size: 1.25em; font-weight:400; margin: 0 auto; color: #707070; text-align: center; line-height: 1.4;}
.container01 .content01 .mimg { position: relative; display: block; width:85%; height: auto; margin: 10px auto 0;}
.container01 .content01 .mimg img { display: block; max-width:100%; height: auto;}
.container01 .content01 .help { position: relative; display: inline-block; width:24%; height: auto; margin: 0 auto;}
.container01 .content01 .help img { display: block; max-width:100%; height: auto;}

.container02 { position: relative; background-color:#fff; width: 100%; min-height:640px; height:100%; margin: 0 auto; padding: 45px 25px 95px;}
.container02:after {content: ''; display: block; clear: both;}
.container02 h2{display: block; font-size: 1.5em; font-weight: 400; padding: 10px 0 0; margin: 50px auto 0; color: #707070;}
.container02 h2 img{vertical-align: middle; margin:-4px 1px 0 0; width: 19px;} 
.container02 h3{display: block; font-size: 2.5em; line-height:1.2em; font-weight: 500; padding:0.3em 0 1em 0; color: #2ac1bc;}
.container02 .total{font-size: 1.55em; font-weight: 500; padding: 10px 0; color: #707070; border-bottom: 1px solid #ccc; margin-bottom:0.5em; }
.container02 .content01{position: relative; display: block; width: 100%; min-height: 100%; padding: 0; margin: 0px auto 0;}
.container02 .content01 h2 {font-size: 1.55em; font-weight:400; }
.container02 .content01 .stitle {width: 220px; font-size: 1.5em; font-weight:500; padding: 0.3em 0; color: #222; margin: 1.5em auto 1em; background: #fff; border-top:1px solid #bcbcbc; border-bottom:2px solid #bcbcbc; text-align: center;}
.container02 .content01 h3 {font-size: 1.4em; font-weight: 500; color:#222; margin-top: 2em; }
.container02 .content01 .txt {font-size: 1.333em; font-weight: 400; color: #707070; line-height:1.4; word-break: keep-all; margin: -1em 0 1em;}
.container02 .content01 .txt01 {font-size: 1.25em; font-weight: 400; color: #707070; line-height:1.4; word-break: keep-all; margin: -0.5em 0 1em;} /* 2020.01.15 add*/
.container02 .content01 .txt1 {font-size: 1.333em; font-weight: 400; color: #707070; line-height:1.4; word-break: keep-all; margin: 1.5em 0 1em;}
.container02 .content01 .txt2 {font-size: 1.333em; font-weight: 400; color: #707070; line-height:1.4; text-align: center; margin: 1.5em 0 1em;}

.container02 .content02{position: relative; display: block; width: 100%; height: auto; padding: 1em 0; margin: 20px auto 0;}
.container02 .content02 .txt {font-size: 1.333em; font-weight: 400; color: #707070; line-height:1.4; word-break: keep-all; margin: -1em 0 1em; margin-top:0.3em}
.container02 .content02 .lab {font-size: 1.333em; font-weight: 600; line-height:1.4; word-break: keep-all; margin: 0em 0 2em;} /* 2020.10.13 add*/
.container02 .content02 .question {font-size: 1.333em; font-weight: 400; line-height:1.4; word-break: keep-all; margin: 0em 0 2em;} /* 2020.10.13 add*/
.container02 .sol_call {z-index:99; position:absolute; text-align:right; visibility: hidden;}
.container02 .content02 div{padding: 1.5vw; text-align: center; font-weight: bolder; font-size: 1.4em;}

/* 2020.01.15 add*/
.container02 .content04{position: relative; display: block; width: 100%; height: auto; padding:0; margin: 0 auto;}
.container02 .content04:after {content: ''; display: block; clear: both;}
.container02 .content04 li.ph-areal {float:left; position: relative; width:48%; height:200px; margin: 4% 4% 0 0; background:#e0e0e0;}
.container02 .content04 li.ph-areal img{width:100%; height:200px;}
.container02 .content04 li.ph-areal .close1 {position: absolute; top:0; right: 0; padding:0.4em 0.5em; background:#707070; font-size:1.25em; line-height:1.25em; font-weight: 500; color: #fff; opacity: 0.8;}
.container02 .content04 li.ph-areal .close1:hover {background:#f2f2f2; color: #707070; opacity: 0.5;}
.container02 .content04 li.ph-arear {float:left; position: relative; width:48%; height:200px; margin: 20px 1% 0 1%; background:#e0e0e0;}
.container02 .content04 li.ph-arear img{width:100%; height:200px;}
.container02 .content04 li.ph-arear .close1 {position: absolute; top:0; right: 0; padding:0.4em 0.5em; background:#707070; font-size:1.25em; line-height:1.25em; font-weight: 500; color: #fff; opacity: 0.8;}
.container02 .content04 li.ph-arear .close1:hover {background:#f2f2f2; color: #707070; opacity: 0.5;}

.ex-txt{display: block; width: 100%; height: auto; padding:0; margin: 0;} 
.ex-txt li{display: block; font-size: 1.25em; font-weight: 400; color: #707070; line-height:1.5; word-break: keep-all; padding-left: 0.6em; text-indent: -0.6em;} 
.container02 .content03{position: relative; display: block; width: 100%; height: auto; padding: 1em 0; margin: 0 auto 50px;}
.container02 .content03:after {content: ''; display: block; clear: both;}

.table {width: 100%; line-height: 1.7em; border-collapse: collapse; }
.Ttype01 {width: 100%; table-layout: fixed; font-size: 1.2em; font-weight: 400; border-top: 2px solid #bcbcbc; border-bottom: 2px solid #bcbcbc; margin-top: 20px; color: #707070;} 
.Ttype01 th {border-bottom: 1px solid #bcbcbc; padding:0.8em 0; }
.Ttype01 td {text-align: center; padding:0.7em 0;}

.ttitle{ display:inline-block; width: 25%; font-size: 1.55em; font-weight:400; color: #707070; padding:1em 0 0em; margin-top:1em; }
.ttitle1{ display:inline-block; width: 35%; font-size: 1.55em; font-weight:400; color: #707070; padding:0.5em 0; margin:0.5em 0; }
.contxt{ display:inline-block; width: 70%; font-size: 1.7em; font-weight:500; color: #707070; padding:0.5em 0; }
.contxt1{ display:inline-block; width: 60%; font-size: 1.7em; font-weight:500; color: #707070; padding:0.5em 0; }
.contxt2{ display:inline-block; width: 60%; font-size: 1.25em; font-weight:500; color: #707070; padding:0.5em 0; }

.thtxt{ display:block; font-size: 1.55em; font-weight:400; color: #707070; padding:1em 0; }
.retxt01{ display:inline-block; font-size: 1.7em; font-weight:500; color: #707070; padding:0.5em 0.5em 0.5em 0; }
.retxt02{ display:inline-block; font-size: 1.5em; font-weight:400; color: #222; padding:0.5em 0; }

label.tt01{ font-size: 1.0em; font-weight:400; color: #707070; padding:0 0.3em 0 0.1em; }

.Lleft {margin-left: 30px;}
.Ttop {margin-top: -20px; }
.bullet01{color:blue; font-weight: 900;}
.bullet02{color:darkorange; font-weight: 900;}

/* footer  */
.foot-main {position: relative; display: block; width: 100%; height: auto; padding:1.5em; margin: 0 auto 1em;}
.foot-main .logo {display: block; width: 23%; height: auto; margin: 0 auto;}
.foot-main .logo img{max-width: 100%; height: auto; }
.foot-main .copyright {display: block; padding:0; font-size: 0.95em; font-weight: 400; color:#707070; margin: 0.5em auto 0; line-height: 1.4; text-align: center;}
.foot-main .copyright a{font-size: 0.9em; font-weight: 400; color:#707070; text-decoration: underline;}
.foot-main .copyright a:hover, active{color: #2ac1bc; }


.foot {    position: fixed; bottom: 0; display: block; width: 100%; min-height: 80px; height: 80px; background: #ececec; padding:1em ; margin: 0 auto;}
.foot .left {float:left; width: 80px;}
.foot .left img{float:left; vertical-align: middle; border:0; width: 80px;}
.foot .right {float:left; padding-left: 15px; }
.foot .right li{display: block; font-size: 0.9em; line-height: 1.4em; font-weight: 400; color: #707070; list-style: none;}
.foot .right li a{font-size: 0.9em; line-height: 1.6em;  font-weight: 400; color: #707070; text-decoration: underline;}
.foot .right li a:hover, active{color: #2ac1bc; }

.foot01 {position: relative; display: none; width: 100%; height: auto; background: #ececec;}
.foot01 .con {width: 100%; min-height: 100px; height: auto; padding:1.5em 1em; margin: 0 auto;}
.foot01 .left {float:left; width: 130px;}
.foot01 .left img{float:left; vertical-align: middle; border:0; width: 130px;}
.foot01 .right {float:left; padding-left: 20px; }
.foot01 .right span{display: block; font-size: 1em; line-height: 1.3em; font-weight: 400; color: #707070; list-style: none;}
.foot01 .right span a{font-weight: 400; color: #707070; text-decoration: underline;}
.foot01 .right span a:hover, active{color: #2ac1bc; }	

span.point1 {color: #2ac1bc; line-height: 1.05em;}
span.point1 a{color: #2ac1bc; line-height: 1.05em; cursor: pointer;}
span.point1 a:hover{color: #2ac1bc; line-height: 1.05em; text-decoration: underline;}
span.point3 {color: #000; line-height: 1.2em;}
.point2 {color: #ff8d41;}
span.point2 {color: #ff8d41;}
span.point2 a{color: #ff8d41;}
span.point2 a:hover{color: #ff8d41; text-decoration: underline;}

span.point4 {color: #2ac1bc; line-height: 1.05em;}



.btn-area {position: relative; display: block; clear: both; margin: 50px auto 70px; text-align: center; width: 100%;}
.btn-area1 {position: relative; clear: both; margin: 50px auto 70px; text-align: center; width: 100%;}
.btn-area2 {position: relative; display: block; clear: both; margin: 10px auto 0px; text-align: center; width: 100%;}
.btn-area2 img {display: block; max-width: 100%; height: auto; margin:0.8em auto; }
.btn-area3 {position: relative; display: block; margin: 30px auto 0px; text-align:center; width: 100%;}
.btn-area3 img {display: inline-block; max-width: 45%; height: auto; margin:0.8em 0.5em; padding:0.5em; border:  3px solid #bcbcbc; }
.btn-area3 .on img {border:  3px solid #2ac1bc; }
.btn-area3 a img{display: inline-block; max-width: 45%; height: auto; margin:0.8em 0.5em; padding:0.5em; border: 3px solid #bcbcbc; cursor: pointer;}
.btn-area3 a:hover img{border: 3px solid #707070;}
.btn-area3 a:focus img{border: 3px solid #707070;}

.btn-area4 {position: relative; display: block; margin: 30px auto 0px; text-align:center; width: 100%;}
.btn-area4 a img{display: inline-block; max-width: 45%; height: auto; margin:0.8em 0.5em; border:1px solid #fff; cursor: pointer;}
.btn-area4 a:hover img{border:1px solid #707070;}
.btn-area4 a:focus img{border:1px solid #707070;}

.btn-area5 {position: relative; display: block; clear: both; margin: 10px auto 0px; text-align: center; width: 70%;}

/* 2020.01.15 add*/
.btn-area6 {position: relative; display: block; clear: both; padding:1.5em 0; margin: 20px auto 15px; width: 100%; border-top: 1px dashed #bcbcbc; border-bottom: 5px solid #eee;  }
.btn-area6:after {content: ''; display: block; clear: both;}
.btn-area6 .helptxt {float:left; width:30%; margin: 0 0 1em; font-size: 1.4em; font-weight: 500; color: #2ac1bc; line-height:1.3; word-break: keep-all; vertical-align: middle;}
a.btn01 {display: block; padding:13px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #fff; background:#2ac1bc; margin: 0 auto; cursor: pointer;}
a.btn01:hover {color: #fff; background:#bcbcbc; }
a.btn01:active {color: #fff; background:#bcbcbc }
a.btn011 {display: block; padding:13px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #fff; background:#2ac1bc; margin: 0 auto 0.5em; cursor: pointer;}
a.btn011:hover {color: #fff; background:#bcbcbc; }
a.btn011:active {color: #fff; background:#bcbcbc }
a.btn012 {display: block; padding:13px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #fff; background:#2ac1bc; margin: 0 auto 0.5em; cursor: pointer;}
a.btn012:hover {color: #fff; background:#bcbcbc; }
a.btn012:active {color: #fff; background:#bcbcbc }

a.btn02 {display: block; padding:13px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #fff; background:#707070; margin: 0 auto 0.5em; cursor: pointer;}
a.btn02:hover {color: #fff; background:#bcbcbc; }
a.btn02:active {color: #fff; background:#bcbcbc }

button.btn03 {display: block; padding:12px 0; width: 95%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin: 0 auto; border:1px solid #2ac1bc; outline: none; margin-bottom: 0.9em; }
button.btn03:hover {color: #fff; background:#bcbcbc; }
button.btn03:active {color: #fff; background:#bcbcbc }

a.btn03 {
    float: right;
    padding: 10px 0;
    width: 70%;
    font-weight: 400;
    font-size: 1.25em;
    color: #2ac1bc;
    text-align: center;
    background: #2ac1bc16;
    border: 1px solid #2ac1bc;
    margin: 0;
    cursor: pointer;
    vertical-align: middle;
    border-radius: 3em;
}

.pophead{
	padding-bottom: 0.5em;
}
.pophead span{
	font-size: 1.417em;color: #2ac1bc;font-weight: bold;
}
a.btn03:hover {color: #fff; background:#bcbcbc; }
a.btn03:active {color: #fff; background:#bcbcbc }

/* 2020.01.15 add*/
a.btn03-finish {float:right; padding:10px 0; width:70%; font-weight: 400; font-size: 1.25em; color: #fff; text-align: center; background:#707070; margin: 0; cursor: pointer; vertical-align: middle;}
a.btn03-finish:hover {color: #fff; background:#bcbcbc; }
a.btn03-finish:active {color: #fff; background:#bcbcbc }

button.btn03 {display: block; padding:12px 0; width: 95%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin: 0 auto  0.9em; border:1px solid #2ac1bc; outline: none;}
button.btn03:hover {color: #707070; background:#fff; border:1px solid #707070;}
button.btn03:active {color: #707070; background:#fff; border:1px solid #707070;}
button.btn03:focus {color: #707070; background:#fff; border:1px solid #707070;}

button.btn04 {display: inline-block; padding:12px 0; width: 45%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin:0.8em 0.3em; border:1px solid #2ac1bc; line-height: 1.4; outline: none; cursor: pointer;}
button.btn04:hover {color: #707070; background:#fff; border:1px solid #707070;}
button.btn04:active {color: #707070; background:#fff; border:1px solid #707070;}
button.btn04:focus {color: #707070; background:#fff; border:1px solid #707070;}

button.btn05 {display: inline-block; padding:12px 0; width: 45%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin:0.8em 0.3em; border:1px solid #2ac1bc; line-height: 1.4; outline: none; cursor: pointer;}
button.btn05:hover {color: #707070; background:#fff; border:1px solid #707070;}
button.btn05:active {color: #707070; background:#fff; border:1px solid #707070;}
button.btn05:focus {color: #707070; background:#fff; border:1px solid #707070;}

/* 2020.01.15 add*/
button.btn06 {display: block; padding:17px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin: 0 auto  0.9em; border:1px solid #2ac1bc; outline: none;}
button.btn06 img {margin:-0.2em 0.3em 0 0; width:2.2em; vertical-align: middle;}
button.btn06:hover {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}
button.btn06:active {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}
button.btn06:focus {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}

button.btn07 {display: block; padding:17px 0; width: 45%; font-weight: 400; font-size: 1.5em; color: #ff8d41; background:#fff; margin: 0 auto  0.9em; border:1px solid #ff8d41; outline: none;}
button.btn07 img {margin:-0.2em 0.3em 0 0; width:2.2em; vertical-align: middle;}
button.btn07:hover {color: #ff8d41; background:#e8e2fa; border:1px solid #ff8d41;}
button.btn07:active {color: #ff8d41; background:#e8e2fa; border:1px solid #ff8d41;}
button.btn07:focus {color: #ff8d41; background:#e8e2fa; border:1px solid #ff8d41;}

label.btn06 {display: block; padding:17px 0; width: 100%; font-weight: 400; font-size: 1.5em; color: #2ac1bc; background:#fff; margin: 0 auto  0.9em; border:1px solid #2ac1bc; outline: none;}
label.btn06 img {margin:-0.2em 0.3em 0 0; width:2.2em; vertical-align: middle;}
label.btn06:hover {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}
label.btn06:active {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}
label.btn06:focus {color: #2ac1bc; background:#e8e2fa; border:1px solid #2ac1bc;}

/* 2020.10.13 add*/
label.btn07 {float:left; position: relative; width:48%; height:200px; margin: 20px 1% 0 1%;}
label.btn07 img {width:100%; height:200px;}
label.btn07 img:hover {width:100%; height:200px; color: #663eee; background:#e8e2fa; }
label.btn07 img:active {width:100%; height:200px; color: #663eee; background:#e8e2fa; }
label.btn07 img:focus {width:100%; height:200px; color: #663eee; background:#e8e2fa; }
label.progress img {width:100%; height:auto; display: block; margin: 0px auto;}

.accordion {
  background-color: #fff;
  font-weight: 400;
  color: #707070;
  cursor: pointer;
  padding: 10px 0;
  width: 98%;
  border: none;
  text-align: left;
  outline: none;
  font-size:1.25em;
  transition: 0.3s; 
}


.active, .accordion:hover {
  background-color: #fff;
}


.accordion:after {
  content: '\002B';
  color: #777;
  float: right;
  margin-left: 10px;
  border: 1px solid #888;
  background-color: #f2f2f2;
  padding: 0 0.3em;
  font-size: 1.3em;
}

.active:after {
  content: "\2212";
}

.panel {
  padding: 0 0 0 20px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel textarea {width: 98%; heigt:auto; line-height: 1.5; color: #555; background: #f2f2f2; border: 0; padding: 15px; word-break: keep-all; text-align: left; overflow: auto; font-size: 1.25em; }


.panel2 {
  padding: 0 0 0 20px;
  background-color: #f2f2f2;
  max-height: 0px;
  overflow-y: auto;
  transition: max-height 0.2s ease-out;
  line-height: 1.5; 
  color: #555; 
  word-break: keep-all; 
  font-size: 1.25em;
  font-family: "Noto Sans KR", dotum, Arial, sans-serif;
  padding: 0px 20px 0px 20px;
}

.bb {
  font-size: 1.15em;
  font-weight: bold;
  font-family: "Noto Sans KR", dotum, Arial, sans-serif;
}

/* POPUP Button */
.go {
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 1em auto 0;
  font-size: 1.35em;
  font-weight: 400;
  width: 40%;
  background: #2ac1bc;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #2ac1bc;
}

.go:hover,
.go:focus {
  color: #2ac1bc;
  border: 1px solid #2ac1bc;
  background: #fff;
  text-decoration: none;
  cursor: pointer;
}

/* 20210313 KHS 추가 */
.go_square {
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 1em auto 0;
  font-size: 1.35em;
  font-weight: 400;
  width: 40%;
  background: #2ac1bc;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #2ac1bc;
  border-radius: 0px;
}

.cancel {
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 1em auto 0;
  font-size: 1.35em;
  font-weight: 400;
  width: 40%;
  background: #707070;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #707070;
}

.cancel:hover,
.cancel:focus {
  color: #707070;
  border: 1px solid #707070;
  background: #fff;
  text-decoration: none;
  cursor: pointer;
}

.close {
  color: #fff;
  position: relative;
  display: block;
  margin: 1em auto 0;
  font-size: 1.025em;
  font-weight: 400;
  width: 40%;
  background: #707070;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #707070;
}

.close_inline {
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 1em auto 0;
  font-size: 1.025em;
  font-weight: 400;
  width: 40%;
  background: #707070;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #707070;
}

.go_inline {
  color: #fff;
  position: relative;
  display: inline-block;
  margin: 1em auto 0;
  font-size: 1.025em;
  font-weight: 400;
  width: 40%;
  background: #2ac1bc;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #2ac1bc;
}


.close-ok {
  color: #fff;
  position: relative;
  display: block;
  margin: 1em auto 0;
  font-size: 1.025em;
  font-weight: 400;
  width: 40%;
  background: #2ac1bc;
  padding:11px 16px;
  text-align: center;
  border: 1px solid #2ac1bc;
}

.close:hover,
.close:focus
 {
  color: #707070;
  border: 1px solid #707070;
  background: #fff;
  text-decoration: none;
  cursor: pointer;
}

.close-ok:hover,
.close-ok:focus
 {
  color: #2ac1bc;
  border: 1px solid #2ac1bc;
  background: #fff;
  text-decoration: none;
  cursor: pointer;
}

.popup_panel { display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100;}
.popup_panel div.popup_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:#000; opacity:.5; filter:alpha(opacity=50); }
.popup_panel div.popup_contents { position: absolute; top: 50%; left: 50%; background-color: #fff; margin: auto; padding: 25px 15px; font-size: 1.333em; font-weight: 400; color: #707070; width: 310px; height: 190px; text-align: center; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);}
.popup_panel div.popup_contents_pic { position: relative; top: 50%; background-color: #fff; margin: auto; padding: 25px 15px; font-size: 1.333em; font-weight: 400; color: #707070; width: 70vw; height: auto; text-align: center; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);}
.popup_panel div.popup_contents_warnning { position: absolute; top: 50%; left: 50%; background-color: #fff; margin: auto; padding: 25px 15px; font-size: 1.333em; font-weight: 400; color: #707070; width: 61vw; height: auto; margin-left: -30vw; margin-top:-130px; text-align: center; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);}
.popup_panel div.heightOver{height : 370px;  width: 310px;   margin-left: -155px;    margin-top: -150px;}

.popup_panel1 { display:block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100;}
.popup_panel1 div.popup_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:#000; opacity:.5; filter:alpha(opacity=50); }
.popup_panel div.popup_contents1         { position: absolute; top: 50%; left: 50%; background-color: #fff; margin: auto; padding: 25px 15px;                                                       width: 310px; height: 220px; text-align: center; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);}
.popup_panel div.popup_contents1 p{ font-size: 1.333em; line-height: 1.2; font-weight: 400; color: #707070; text-align: center; padding-bottom:0.4em;  }

@media screen and (max-width: 340px){
    input.input-box {width:29%;font-size:1.25em;}
	button.datebtn {width:18%;}
	button.datebtn-0n {width:18%;}
	input.date1 {width:33%;}
	span.ttitle1{ width: 30%; font-size: 1.2em;}
	input.date1 {font-size: 1.05em; padding: 1em 0.5em;}
	input.tel {font-size: 1.25em;}
	input.line  {font-size: 1.25em; padding: 0.6em 0.5em; }
	input.line2 {font-size: 1.25em; text-align:center;}
	input.line3 {font-size: 1.25em; text-align:center;}
	input.line4 {font-size: 1.25em;}
	input.line5 {font-size: 1.25em;}
	select.add1 {font-size: 1.25em;}
	select.add1-1 {font-size: 1.25em;}
	select.place {font-size: 1.25em;}
	select.bank {font-size: 1.25em;}
	label.tt01{ font-size: 0.55em;}
}
@media screen and (max-width: 340px) {
	.container01 .content01 h2 {font-size: 2.2em;}
	.container01 .content01 .mstxt {font-size: 1em;}
	input.line1 {width:73%;}
	.foot {width: 100%; min-height: 80px; height: 80px; padding:1em ; margin: 0 auto;}
    .foot .left {display: block; padding-left: 15px;}
    .foot .left img{float:left; vertical-align: middle; border:0; width: 70px;}
    .foot .right {display: block; padding-bottom: 15px;}
}

@media screen and (max-width : 370px ){
	.container01 .content01 h2 {font-size: 2.9em;}
}

@media screen and (max-width: 360px) {
	.container01 .content01 h2 {font-size: 2.7em;}
}

@media screen and (max-width : 353px ){
	.accordion:after {margin: -20px 0 0 15px; font-size: 1.2em;}
	input[type=checkbox] + label.each{font-size: 0.9em; width:88%; word-break: normal; }
}

@media screen and (max-width : 354px ){
	span.ttitle1{ width: 35%; font-size: 1.5em; }
}

@media screen and (max-width: 360px){
input.input-box  {width:35.5%; }
}

@media screen and (min-width: 400px) {
	.container01 .content01 h2 {font-size: 3em;}
}

@media screen and (min-width: 425px) and (max-width: 550px){
input.input-box  {width:38%; }
}

@media screen and (min-width: 450px) and (max-width: 600px){
input.line1 {width:82%; }
}

@media screen and (min-width: 610px){
input.line1 {width:88%; }
}

@media screen and (min-width: 555px) and (max-width: 765px){
input.input-box  {width:40%; }
}

@media all and (min-width:580px) {
	.foot {display: none; }
	.foot01 {position: relative; display: block;  width: 100%; height: auto; background: #ececec; }
	.foot01 .con {width: 100%; min-height: 100px; height: auto; padding:1.5em 1em; margin: 0 auto;}
	.foot01 .left {float:left; width: 130px;}
    .foot01 .left img{float:left; vertical-align: middle; border:0; width: 130px;}
	.foot01 .right {float:left; padding-left: 20px; }
	.foot01 .right span{display: block; font-size: 1.1em; line-height: 1.3em; font-weight: 400; color: #707070; list-style: none;}
	.foot01 .right span a{font-weight: 400; color: #707070; text-decoration: underline;}
	.foot01 .right span a:hover, active{color: #2ac1bc; }	
}

@media screen and (min-width: 768px){
	input.input-box  {width:41%; }
	input.line5{width:83%; }
	span.ttitle {width:15%; }
}

@media screen and (min-width: 768px) {
	.container01 .content01 h2 {font-size: 4.5em;}
	.container01 .content01 .mstxt {font-size: 2.1em;}
	.container01 .content01{ width: 60%; min-height: 100%; padding-top:50px; }
	.container01 .content01 .help { width:20%; height: auto;}
	.foot-main .logo {width: 15%; }
}

@media screen and (min-width: 900px) {
	.container01 { width: 768px; }
	.foot01 .con {width: 680px; height: 110px; margin: 0 auto;}
	.foot-main .logo {width: 15%; }
	.foot-main .copyright {font-size: 1.55em;}
	.container02 { width: 680px; }
	.hd h2{width: 680px;}
	.hd h2 .pre a img{position: absolute; top:0; left: 0; margin:0.9em 0 0 0.5em; vertical-align: middle; height: 21px; }
    .hd h2 .help a img{position: absolute; top:0; right: 0; margin:0.3em 0.3em 0 0;  vertical-align: middle; width: 55px;}
	.btn-area { width: 100%; }
}

@media all and (min-height:900px) {
	.foot {display: none; }
	.foot01 {position: fixed; left: 0; bottom: 0; display: block; width: 100%; height: auto; background: #ececec; }
	.foot01 .con {width: 100%; height: 110px; margin: 0 auto;}	
}


.popup_panel div.agreement{
	width:90%;
	height:90%;
	margin:5%;
	padding:2%;
	top : 0px;
	left:0px;
	overflow-y: scroll;
}

#ain-title{
	cursor: pointer;
}

/* 20240911 KHS warnBox 스크린리더 포커스 관련 아웃라인 삭제 */
#popup-text:focus {
    outline: none;
}