@charset "utf-8";
@import url('8a4b0285505047398a0c7de5fce68b2e.css');
/* *******************************************************
 * filename : style.css
 * producer : jason
 * date : 2020-11-20
******************************************************** */
@import url(notosanskr.css);
* {margin:0;padding:0;border:0;outline:0;vertical-align:top;}
html,body {width:100%;}
body {font-family:'Noto Sans KR', sans-serif; font-size:1em; color:#000;line-height:1;text-align:center;*word-break:break-all;-ms-word-break:break-all;}
ul, ol, dl {list-style:none;}
img, video {width:100%;border:0;margin:0;padding:0;}
a {text-decoration:none;}
a, a:hover, a:visited, a:link, a:link {color:inherit;}
table {border-spacing:0;}
input,select {vertical-align:middle; border:1px solid #dedede; background-color:#f3f3f3; font-size:1rem;}
label,button {cursor:pointer;}
.bline, legend, caption {display:block;overflow:hidden;position:absolute;top:0;left:-1000em;}
i, em, address {font-style:normal;font-weight:normal;}
header, nav, section, article, aside, footer {display:block;}


.p1{background:url(../images/p1.jpg);background-size:100% 100%;color:#000}
.p2{color:#f63939; font-weight: bold;}	
	
video{display:block; width:100%;}	

.video{display:block; width:100%;}
	
	
@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

nav {height:45px; line-height: 45px; border-bottom:1px solid #eee;}
nav ul {display:block; width:100%; padding:0 15px; margin:0 auto; box-sizing:border-box;}
nav ul::after {content:''; display:block; clear:both;}
nav ul li { float:left;} 
nav ul li a { display:block; }
nav ul li:nth-child(1) {width:25px; height:25px; background:url(../images/logo.png)no-repeat; background-size:100% 100%; text-indent:-9999em; margin-right:10px; margin-top:10px;}
nav ul li:nth-child(2) {margin-right:5px; font-weight: bold;}
nav ul li:nth-child(4) {float:right; width:17px; height:10px; margin-top:17px; background:url(../images/arrow.png)no-repeat; background-size:100% 100%; text-indent:-9999em;}
.headerTxt {width:100%; max-width:800px; margin:0 auto; padding-bottom:20px; box-sizing: border-box; text-align:left; }
.headerTxt i {font-size: 0.85em; color:#0082e5; }
.headerTxt h2 {font-size: 1.45em; color:#333; font-weight: normal; letter-spacing: -1px; line-height: 1.4; margin-top:5px;}
.headerTxt p {font-size: 0.9em; color:#999; line-height: 1.45; position:relative; padding-left:10px; margin-top:10px;}
.headerTxt p::before {content:''; display:block; background: #999; width:3px; position:absolute; left:0; top:0; bottom:0; }

section {width:100%; max-width:730px; margin:0 auto;}
article {margin-top:60px;}
article p {  font-family: 'Pretendard-Regular';padding:20px 15px 0; line-height: 1.7;
    letter-spacing: -.035em; word-spacing: 0px; text-align:justify;word-break: break-all; font-size: 26px; color:#333;}
article h3 {letter-spacing: -0.065em; font-weight: normal;}  article h3 span {font-weight: bold;}
article .im {width:100%; box-sizing:border-box; padding:0 10px; }
article p span {color:#fc39af;}
article p b {color:#000; font-weight: 700;}
h2 strong { font-weight: bold; display: block; margin-bottom: 20px; line-height: 1.3; font-size: 30px; letter-spacing: -1.9px;}

.fbt {position:fixed; right:5px; bottom:5px; z-index:2; animation:fb 2s ease-in-out infinite;} .fbt img {width:90px;}
@keyframes fb {
  0% {bottom:5px;}
  50% {bottom:15px;}
  100% {bottom:5px;}
}
aside {margin-top:0px; position:relative; z-index:99; background: #fff;box-shadow:0px 5px 5px rgba(0,0,0,.2);margin-bottom: 20px;}
.formTable {width:100%; padding:20px 20px 10px; text-align:left; box-sizing:border-box; }
.formTable th {width:25%; max-width:100px; text-align:center;}
.formTable th, td {padding:5px 0; vertical-align:middle;}
.formQqestion {width:100%; font-size: 14px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px dashed #ccc;}
.formQqestion td {padding:5px 0; width:20%;}
.formQqestion th {padding:10px 0; text-align:left;}
.formQqestion input[type=checkbox],.formQqestion input[type=radio] {display:none;}
.formQqestion input ~ label {background:#fff; border: 1px solid#17a7b7; color:#17a7b7; display:inline-block; width:90%; padding:7px 0; text-align:center; box-sizing:border-box;font-weight: 600;}
.formQqestion input:checked + label {background: #17a7b7; color:#fff; }
.formTable input[type=text], .formTable input[type=tel], .formTable select {height:35px; padding-left:10px; width:83%;background: #fff;border: 1px solid#b7b7b7;}
.formTable input.tel, .formTable select.tel {width:26%;}
.formTable textarea {width:80%; border-radius:10px; border:2px solid #eee; height:70px; padding:7px; box-sizing: border-box;}
.agree {font-size: 13px; text-align:center; line-height: 2; color:#999;border-bottom:1px dashed #ccc; }
.agreeform {font-size: 12px; color:#666; line-height: 1.5; display:none;}
.formTable .btn {text-align:center; padding-bottom:20px;padding-top: 10px;}
.formTable button {width:90%; font-size: 1.6em; font-weight: bold; padding:16px 0; border-radius:40px; box-shadow:0px 5px 5px rgba(0,0,0,.2); position:relative; background:#ff6c00; color:#fff; animation:dbbtn 2s ease-in infinite;}
.formTable .formResult { font-size: 13px; text-align:center; padding:0px 20px 20px 20px;}
.formTable .formResult input {background: #fffbe6; width:20%; height:25px; border-radius:5px;}


.formTable input[type=radio] {display:none;}
.formTable input ~ label {background:#fff; border: 1px solid#ff6c00; color:#ff6c00; display:inline-block; width:90%; padding:7px 0; text-align:center; box-sizing:border-box;font-weight: 600;}

.formTable input:checked + label {background: #ff6c00; color:#fff; }


textarea.agreeform {width:80%; border-radius:10px; border:2px solid #eee; height:70px; padding:7px; box-sizing: border-box;}
.agree {font-size: 13px; text-align:center; line-height: 2; color:#999;border-bottom:1px dashed #ccc; }
.agreeform {font-size: 12px; color:#666; line-height: 1.5; display:none;}


 
aside .asidebtn ul li button {background: #fff; border:1px solid #ccc; height:30px; width:80px;}
aside .asidebtn ul {width:95%; margin:10px auto;}
aside .asidebtn ul::after {content:''; display:block; clear:both;}
aside .asidebtn ul li:nth-child(1) i {color:red;}
aside .asidebtn ul li:nth-child(1) {margin-right:5px;}
aside .asidebtn ul li {float:left;}
aside .asidebtn ul li:nth-child(3) {float:right; }
aside .asidebtn ul li:nth-child(3) button{width:30px;}



.reply {width:100%; border-top:1px solid #e5e5e5; text-align:left;}
.reply_container {width:100%; max-width:800px; margin:30px auto 0; box-sizing:border-box; }
.reply_top{padding:0px 15px;}
.reply .reply_container .reply_top span {color:#f14949;} 
.reply .reply_container .reply_top i {font-size: 12px; border:1px solid #e5e5e5; padding:4px; color:#7f7f7f;}
.reply .reply_container .re_input {width:100%; height:60px; position:relative; margin:15px 0;} 
.reply .reply_container .re_input textarea {width:80%; height:60px; padding:5px; box-sizing:border-box; border:1px solid #ccc; position:absolute; top:0; bottom:0; left:0;}
.reply .reply_container .re_input button {width:20%; border:none; background:#333; color:#fff; position:absolute; top:0; bottom:0; right:0; font-size: 1.05em;}
.reply .reply_container .re1 {position:relative;} 
.reply .reply_container .re1 ul li {display:inline-block; padding-right:7px;} 
.reply .reply_container .re1 ul li:first-child a{color:#000; font-weight: 500; border-bottom:1px solid #000; }
.reply .reply_container .re1 > a {position:absolute; right:0; top:0; bottom:0;}
.reply .reply_container .re2 {box-sizing: border-box; letter-spacing: 0; margin-top:15px; padding:7px 15px 0px; border-top:1px solid #e5e5e5;}
.reply .reply_container .re2 b {padding-left:15px; font-weight:normal; font-size: 12px; color: #bfbfbf;}
.reply .reply_container .re2 img {width:22px; padding-top:7px;}  
.reply .reply_container .re2 span {font-size: 14px; margin:0 5px; line-height: 30px;}
.reply .reply_container .re2 p {font-size: 15px; letter-spacing:-0.02em; margin-top:7px; line-height: 1.7; color:#777;} 
.reply .reply_container .re2 p img {display:block; width:100%;}
.reply .reply_container .re2 p em {vertical-align:bottom; font-style: normal; font-size: 12px; background: #e04646; padding: 2px 8px; border-radius: 10px; color: #fff; letter-spacing: 0; }
.reply .reply_container .re3 {position:relative; height:30px; line-height:30px; }  
.reply .reply_container .re3 span {position:absolute; left:15px; top:0; bottom:0; font-size: 12px; color: #bfbfbf;}
.reply .reply_container .re3 ul {position:absolute; right:15px; bottom:0; top:0; } 
.reply .reply_container .re3 ul li {display:inline-block; margin-top:7px;} 
.reply .reply_container .re3 ul li button {padding:0px 10px; height:25px; line-height: 25px; border:1px solid #e14747; border-radius:20px; background: #fff; color:#e14747; box-sizing:border-box;}
.reply .reply_container .re3 ul li button img {width:14px; padding-left:3px; margin-top:5px;}
.reply .reply_container .re4 {margin:2% 0; border-top:1px solid #e5e5e5; text-align:center; }
.reply .reply_container .re4 li {display:inline-block; padding:20px 15px 0 0; font-size: 12px; } 
.reply .reply_container .re4 li a {color:#999;}
.reply .reply_container .re4 li:first-child a {border:1px solid #e5e5e5; color:#4795f7; font-weight: bold; padding:4px 10px;} 
.reply .reply_container .re4 li:last-child {padding-right:0;}



.bn1 {font-size: 12px; line-height: 1.5; text-align:center; padding:5px; color:#333;}
.bn1 span {color:red;}
.bn2 {font-size: 12px; text-align:center; color:blue; padding:5px;}
.fbanner {margin:15px 0; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:1em;}
.fbanner h3 {text-align:left; padding-bottom:15px; padding-top:20px;}
.list {width:100%; margin:0 auto; padding:1.25rem; box-sizing:border-box;}
.list .menu {position:relative; width:95%; margin:0 auto 10px; text-align:left;} 
.list .menu ul {position:absolute; right:0px; top:0;}
.list .menu ul li {display:inline-block; border:0px; margin-left:10px; color:#828282;} 
.list .menu ul li:first-child {color:#000; border-bottom:1px solid #000;}
.list > ul {border-top:1px solid #f2f2f2; width:95%; margin:0 auto;} 
.list ul::after {content:''; display:block; clear:both;}
.list > ul li {float: left; width: 33.33%; box-sizing: border-box; border-left: 1px solid #f2f2f2; border-bottom: 1px solid #f2f2f2; background: #fff; text-align:center; padding:10px 0;  font-size: 0.85em;}
.list > ul li:nth-child(3n) {border-right:1px solid #f2f2f2;}
footer {padding:20px .9375em 1em; background: rgba(0,0,0,.08); text-align:center;}
footer .footer-btn a {font-size: .6rem; color:#727d92; background: #fff; border:1px solid #d4d7de; padding:.85em 1em; margin:10px 1px 1px;}
footer p {font-size: .8rem; line-height: 1.5; letter-spacing:-0.03em; color:rgba(0,0,0,.55); padding:1rem 0 0;}

@media screen and (max-width:768px){
   article { margin-top:40px;}
	.formTable input[type=text], .formTable input[type=tel], .formTable select {height:35px; padding-left:10px; width:83%;background: #fff;border: 1px solid#999;}
	
	.formTable input.tel, .formTable select.tel {width:25%;}
	.formTable .formResult input {background: #fffbe6; width:20%; height:25px; border-radius:5px;}

	article p {  font-family: 'Pretendard-Regular';padding:20px 15px 0; line-height: 1.7;
    letter-spacing: -.035em; word-spacing: 0px; text-align:justify;word-break: break-all; font-size: 20px; color:#333;}
	
}

@media screen and (max-width:280px){
    .formTable {width:100%; padding:10px 10px 10px; text-align:left; box-sizing:border-box; }
    .formQqestion {width:100%; font-size: 12px; padding-bottom:10px; margin-bottom:10px; border-bottom:1px dashed #ccc;}
    .formTable th {width:20%; max-width:100px; text-align:center;font-size: 12px;}
   .formTable button {width:80%; font-size: 1.0em; font-weight: bold; padding:10px 0; border-radius:40px; box-shadow:0px 5px 5px rgba(0,0,0,.2); position:relative; background:#17a7b7; color:#fff; animation:dbbtn 2s ease-in infinite;}
    .formTable .formResult { font-size: 10px; text-align:center; padding:0px 20px 20px 20px;}
}

@keyframes dbbtn {
  0%{top:0; box-shadow:0px 5px 5px rgba(0,0,0,.2);}
  50% {box-shadow:0px 0px 0px rgba(0,0,0,0); top:5px;}
  0%{top:0; box-shadow:0px 5px 5px rgba(0,0,0,.2);}
}