@charset "utf-8";
@import url(reset.css);
@import url(animate.css);







#wrapper {width: 100%; position: relative; margin: 0 auto;}

#header-wrap {width: 100%;margin: 0 auto; height:115px;position: fixed;z-index:10; border-bottom: 4px solid #453979;}
.header {width: 980px; position: relative; top: 70px; margin: 0 auto;}
.sub-logo {position: absolute; left: 0; top:-28px;}
.gnb {position: absolute; right:0;}
.gnb ul li {float: left;}
.gnb ul li a:hover {font-weight: 500;}
.gnb ul li a:before {content:'｜'; padding: 0 10px; }
.gnb ul li:last-child a:before {content:''; padding: 0;}
.gnb ul li:first-child a:before {content:''; padding: 0;}
.regi-btn a {background: #453979; border-radius: 10px; margin-left: 20px; padding: 0 10px; font-weight: 500;  line-height: 27px; color: #fff;}
.regi-btn a:hover {background: #9ec1e5;}

.on {font-weight: 600;}
.m_nav {display: none;}
#container {position: relative; width: 100%; margin: 0 auto; top: 115px;}
.mobile {display: none;}


.sub-1-top {background: #453979; max-width: 100%; height:317px;}
.sub-2-top {background: #9ec1e5; width: 100%; height:317px;}
.sub-3-top {background: #9dbe5d; max-width: 100%; height:317px;}
.sub-top-box {width: 980px; height: 290px; margin: 0 auto; background: url(../images/sub_top_logo.png) no-repeat center center;}
.sub-top-box p {text-align: center; color: #fff; font-weight: 500; position: relative; top: 200px;}

.sub-1-section-1 {width: 980px; margin: 150px auto;}
.sub-1-section-1-in {text-align: center; margin: 100px auto;}
.sub-1-section-1-in h1 {font-size: 18px; font-weight: 500; letter-spacing: 4px; margin: 35px 0 20px 0;}
.sub-1-section-1-in h2 {font-size: 24px; font-weight: 400; letter-spacing: 4px;}
.sub-1-section-1-in p {color: #555; line-height: 29px; margin: 15px 0 30px; letter-spacing: -1px;}

.sub-1-section-2-in {text-align: center; width: 640px; margin: 100px auto 0;}
.sub-1-section-2-in p {text-align: justify; margin: 80px auto 40px;}
.sub-1-section-2-in p.center {text-align: center;}


.line {margin: 50px auto 60px; width: 640px; height: 1.5px; background: #c7c7c7; }
.line2 {margin: 50px auto 10px; width: 640px; height: 1.5px; background: #c7c7c7; }
.line3 {margin: 35px auto;border-top: 1px dotted #c7c7c7; }

.sub-section-2 {background: #453979; width: 100%;} 
.genob-toon {width: 980px; position: relative; margin: 0 auto;}
.genob-toon p {position: absolute; color: #fff;}
.text-1 {top: 685px ; right:80px; font-size: 22px;}
.text-2 {top: 1005px; left:95px; font-size: 22px;}
.text-3 {top: 1380px; right: 285px; font-size: 22px;}
.text-4 {bottom: 1500px; left: 400px; font-size: 32px; line-height: 42px;}
.text-5 {bottom: 860px; left: 380px; font-size: 42px; font-weight: 600;}
.text-6 {bottom: 260px; left: 300px; font-size: 32px; text-align: center; line-height: 42px;}
.text-4 span, .text-6 span {font-size: 42px; font-weight: 600;}


.sub-section-3 {width: 980px; margin: 50px auto; }
.sub-section-3-box {text-align: center; margin: 150px auto;}
.sub-section-3-box-in {margin: 40px 0;}
.sub-section-3-box-in h1 {font-size: 22px; letter-spacing: 5px; font-weight: 400; margin: 20px 0;}
.sub-section-3-box-in p {margin: 15px 0;}

.sub-section-3-faq {margin: 130px 0;}
.sub-section-3-faq h1 {font-size: 38px; text-align: center; color: #555; letter-spacing: 5px;}
.faq {width: 640px; text-align: left; margin: 40px auto;}
.que {margin: 20px 0;}
.ask {display: none; background: #ebebeb; padding: 10px 0 10px 35px;}
.que:before, .que:before {content:"";  display: inline-block; vertical-align: middle; padding-right: 15px; background: url(../images/sub_graph9.png) no-repeat; width: 20px; height: 20px;}
.que.active:before, .que.active:before {content:""; display: inline-block; vertical-align: middle;  padding-right: 15px; background: url(../images/sub_graph10.png) no-repeat; width: 20px; height: 20px; }




table {width: 100%; border-collapse: collapse;}

.sub-section-3-contactus {width: 640px; margin: 250px auto;}
.sub-section-3-contactus h1 {font-size: 38px; text-align: center; color: #555;}
.contactus_frm {width: 100%; margin: 20px auto;}
.frm_label {float: left; width: 150px; font-weight: 500; margin-bottom: 10px;}
.frm_label label {padding-left: 10px;}
.frm_input {margin-bottom: 10px;}
.frm_input input {border: 1px solid #555; border-radius: 10px; padding: 6px 20px; width: 230px}
.frm_txt textarea {width: 100%; resize: none; height: 300px;}

.contactus-section-box {width: 640px; margin-top: 30px;}
.contactus-section-box table {margin: 15px 0; font-size: 14px; border: 1px solid #555;}
.agree1, .agree2, .agree3, .agree4  {width: 25%;}

.contactus-section-box table th {text-align: center; background: #ebebeb; border: 1px solid #555;}
.contactus-section-box table td {text-align: center; border: 1px solid #555; padding: 10px 0;}
.contactus-section-box table td input {width:20px;}

.register-btn {margin: 50px auto 10px; overflow: hidden;}
.register-btn a.faq-btn-1 {width: 300px; float:left; background: #9dbe5d; font-size: 22px; font-weight: 500; border-radius: 10px; padding: 3px 0; color: #fff; text-align: center;}
.faq-btn-2 {width: 300px; background: #453979; float: right;border: 0 none; color: #fff; font-size: 22px; font-family: 'Noto Sans KR'; font-weight: 500; border-radius: 10px; padding: 3px 0;}

.star {color: #da4061; font-size: 14px;}
.star:before, .bk-star:before {content:'※'; margin-right: 3px; font-size: 14px;}
.bk-star{font-size: 14px;}

.contactus-mail, .contactus-tel {text-align: center; margin: 40px 0;}
.contactus-mail:before {content: '';background: url(../images/marin_graph27.png); width: 32px; height: 24px; display: inline-block; margin-right: 20px;}
.contactus-tel:before {content: '';background: url(../images/marin_graph28.png); width: 35px; height: 35px; display: inline-block; margin-right: 20px;}



.sub-4-section {position: relative; margin: 150px auto;}
.sub-4-section h1 {text-align: center; font-size: 32px;}
.sub-4-section-1 {width: 980px; margin: 0 auto;  padding: 80px 0;}
.sub-4-section-1 img {vertical-align: middle; }
.sub-4-section-1-in {display: inline-block; width: 50%; vertical-align: middle; padding-left: 80px;}

.sub-4-section-2 {width: 980px; margin: 80px auto; text-align: center;}
.sub-4-section-2 h1 {font-size: 24px; margin-bottom: 20px;}
.sub-4-section-2-in {margin: 50px 0;}
.sub-4-section-2-in-box {display: inline-block; width: 20%; margin: 0 20px;vertical-align: top;}
.sub-4-section-2-in-box img {margin-bottom: 50px;}
.sub-4-section-2-in-box h1 {font-size: 18px;}
.sub-4-section-2-in-box p {font-size: 14px; text-align: justify; word-break: break-all;}



.sub-5-section {width: 980px; margin: 0 auto;}
.sub-5-section-tit img {vertical-align: bottom;}
.sub-5-section-tit h1 {display: inline-block; font-size: 32px; font-weight: 400; }
.sub-5-section-1 {border: 2px solid #ebebeb; border-top: 3px solid #333; margin: 30px auto;}
.sub-5-section-1-in {padding: 50px 80px;}
.sub-5-section-1-in li {margin: 30px 0;}
.sub-5-section-1-in li img{vertical-align: middle; margin-right: 40px; }
.sub-5-section-1-in li .txt {display: inline-block; vertical-align: middle; width: 75%; text-align: justify; word-break: break-all;}
.sub-5-section-1-in li h1 {font-size: 24px;}
.sub-5-section-1-in li h1:before {content: ' '; background: url(../images/chk-icon.png); width: 31px; height: 30px; display: inline-block; margin-right: 10px; vertical-align: top;}
.sub-5-section-1-in li p {margin-top: 10px;}



.sub-6-section {width: 100%; background: #ebebeb; margin: 100px auto; padding: 150px 0;}
.sub-6-section h1 {font-size: 32px; text-align: center;}
.sub-6-section-in {width: 980px; margin: 50px auto; padding: 0 80px; }
.sub-6-section-in img {vertical-align: middle; margin-right: 80px;}
.sub-6-section-in-box {vertical-align: middle; display: inline-block; width: 60%;}
.sub-6-section-in-box h2 {font-size: 24px; margin-bottom: 20px;}


.sub-7-section {width: 980px; margin: 0 auto; text-align: center;}
.sub-7-section h1 {font-size: 24px; margin-bottom: 20px;}
.sub-7-section-table {margin: 50px 0;}
.sub-7-section-table table {border-top: 2px solid #555; border-bottom: 2px solid #555;}
.sub-7-section-table table th {background: #ebebeb; padding: 10px 0; border-bottom: 2px solid #555;}
.sub-7-section-table table td {border-right: 1px solid #ebebeb; padding: 10px 0;}
.sub-7-section-table table td:last-child {border: none;}
.type {width: 15%;}
.shape {width: 20%;}


.sub-7-section-1 {position: relative; text-align: left; margin: 100px 0; }
.sub-7-section-1 h1 {background: url(../images/sub_graph36.png) no-repeat left top; font-size: 18px;width: 130px; height: 88px; padding: 40px 10px; position: absolute; top: -50px;}
.sub-7-section-1-in { padding: 35px 30px; border: 1px solid #ebebeb;}
.sub-7-section-1-in-box {border-bottom: 1px solid #ebebeb; padding: 30px 15px;}
.sub-7-section-1-in-box h2 {font-size: 24px; color: #453979; display: inline-block; vertical-align: top; margin-right: 40px;}
.sub-7-section-1-in-box ul {display: inline-block; width: 73%; }
.sub-7-section-1-in-box ul li:before {content: '●'; font-size: 6px; vertical-align: middle; margin-left: -10px; padding-right: 5px;} 


.sub-7-section-2 {margin: 80px 0;}
.sub-7-section-2 p {margin-bottom: 50px;}

.sub-7-section-3 {margin: 80px 0;}
.sub-7-section-3-in {margin: 50px 0;}
.sub-7-section-3-in img {display: inline-block; vertical-align: middle; margin-right: 50px;}
.sub-7-section-3-in-box {display: inline-block; vertical-align: middle; text-align: left;}
.sub-7-section-3-in-box h2 {font-size: 18px; margin-bottom: 20px;}
.sub-7-section-3-in-box ul {border: 1px solid #ebebeb; padding: 20px 30px;}
.sub-7-section-3-in-box ul li {padding: 10px 0;}
.sub-7-section-3-in-box ul li:before {content: ' '; background: url(../images/chk-icon.png); width: 31px; height: 30px; display: inline-block; margin-right: 10px; vertical-align: bottom;}


.sub-7-section-tit {text-align: left;}
.sub-7-section-tit img {vertical-align: bottom;}
.sub-7-section-tit h1 {display: inline-block; font-size: 32px; font-weight: 400;  margin: 0;}
.sub-7-section-tit h1 span {font-size: 24px;}

.sub-7-section-4 {border: 2px solid #ebebeb; border-top: 3px solid #333; margin: 30px auto; text-align: left;}
.sub-7-section-4-in {padding: 50px 80px;}
.sub-7-section-4-in li {margin: 30px 0;}
.sub-7-section-4-in li strong {font-size: 24px;}
.graybox {background: #ebebeb; border-radius: 10px; padding: 5px;}
.graybox li {margin: 5px; font-size: 14px;}
.graybox li:before {content: '●'; font-size: 6px; vertical-align: middle; margin-right: 5px;}



.sub-8-section {width: 100%; background: #ebebeb; padding: 150px 0; text-align: center; margin-top: 100px;}
.sub-8-section img {margin-top: 20px;}
.sub-8-section a {display: block;}


#footer {background-color:#333; border-top: 6px solid #9ec1e5; position: relative; top: 60px;}
.footerwrap {width: 980px; padding: 95px 0; margin: 0 auto; color: #cbcbcb; background: url(../images/foot_logo.png) no-repeat 80px 100px;}
.add {padding-left: 290px;}
.add h1 {font-size: 18px;}
.add p {font-size: 14px;margin: 10px 0;}




@media all and (max-width: 780px) {


.mobile {display: block;}
.pc {display: none;}
#header-wrap {width: 100%; background-color:#fff; margin: 0 auto; height:60px;position: fixed;z-index:10;}
.header {width:100%; position: relative; top:0; margin: 0 auto;}
.sub-logo {position: absolute; left: 10px; top:5px; }
.sub-logo img {width: 7rem;}
.gnb {display: none; position: absolute; top: 60px; width: 100%; right:0;}
.gnb ul li {float: none; padding: 10px 20px;  line-height: 3; background: #f2f2f2; font-size: 1.3rem;}
.gnb ul li a:hover {font-weight: 500;}
.gnb ul li a:before {content:''; padding: 0; }
.gnb ul li:last-child a:before {content:''; padding: 0;}
.gnb ul li:first-child a:before {content:''; padding: 0;}
.regi-btn a {background: #453979; border-radius: 10px; margin: 0; padding: 5px 15px; font-weight: 500;  line-height: 27px; color: #fff;}
.regi-btn a:hover {background: #9ec1e5;}
.m_nav {display: block;  width: 25px; height: 25px; position: absolute; right: 15px; top: 15px;}



#container {top: 60px;}


.sub-top-box {width: 100%;}

.line {margin: 50px auto 60px; width: 100%; height: 1.5px; background: #c7c7c7; }
.line2 {margin: 50px auto 10px; width: 100%; height: 1.5px; background: #c7c7c7; }
.line3 {margin: 35px auto;border: 1px dotted #c7c7c7; }

.sub-1-section-1 {width: 100%; padding: 0 1rem;}
.sub-1-section-2-in {width: 80%}
.sub-1-section-2-in img {width: 15rem;}

.genob-toon {width: 95%; margin: 0 auto;}
.genob-toon img {width: 100%;}

.text-1 {top: 21%; right:5%; font-size: 1.2rem;}
.text-2 {top: 30%; left: 3%; font-size: 1.2rem;}
.text-3 {top: 42%; right: 23%; font-size: 1.2rem;}
.text-4 {bottom: 46%; left: 42%; font-size: 1.7rem; line-height: 1.1;}
.text-5 {bottom: 27%; left: 50%;margin-left: -80px; }
.text-6 {bottom: 6%; left: 50%; margin-left: -150px; font-size: 1.7rem;line-height: 1.1;}
.text-5, .text-4 span, .text-6 span {font-size: 2.5rem; font-weight: 600;}


.sub-section-3 {width: 100%; padding: 0 30px;}

.faq {width: 100%; padding: 0 30px;}
.ask {padding: 20px;}
.sub-section-3-contactus {width: 100%; padding: 0 10px; margin: 20px auto;}

.frm_input input {width: 100%;}


.contactus-section-box {width: 100%; padding: 0 10px;}

.contactus-section-box table th {text-align: center; background: #ebebeb; border: 1px solid #555;}
.contactus-section-box table td {text-align: center; border: 1px solid #555; padding: 10px 0;}
.contactus-section-box table td input {width:20px;}

.register-btn {margin: 50px auto 10px; overflow: hidden;}
.register-btn a.faq-btn-1 {width: 100%;float: none; display: block; margin-bottom: 20px;}
.faq-btn-2 {width: 100%; float: none;}

.star {color: #da4061; font-size: 14px;}
.star:before, .bk-star:before {content:'※'; margin-right: 3px; font-size: 14px;}
.bk-star{font-size: 14px;}

.sub-4-section {padding: 0 30px;}
.sub-4-section-1 {width: 100%;}
.sub-4-section-1 img {width: 30rem; display: block; margin: 0 auto;}
.sub-4-section-1-in {width: 100%; text-align: center; padding: 30px;}
.sub-4-section-1-in p {text-align: justify; word-break: break-all;}

.sub-4-section-2 {width: 100%;}
.sub-4-section-2-in-box {width: 40%; margin: 10px;}

.sub-5-section {width: 100%; padding: 0 30px;}
.sub-5-section-1-in {padding: 30px;}
.sub-5-section-1-in li .txt {width: 100%;}
.sub-5-section-1-in li img {display: block; margin: 10px auto;}


.sub-6-section {padding: 100px 30px;}
.sub-6-section-in {width: 100%; padding: 0;}
.sub-6-section-in img  {margin: 20px auto;display: block;}
.sub-6-section-in-box {width: 100%; text-align: center;}

.sub-7-section {width: 100%; padding: 0 30px;}

.sub-7-section-1-in {padding: 20px;}
.sub-7-section-1-in-box ul {display: block; width: 100%; margin: 10px;}
.sub-7-section-2 img.sub-7-img {width: 30rem;}
.sub-7-section-3-in img  {margin: 0;}
.sub-7-section-3-in-box {margin: 30px 0; display: block;}
.sub-7-section-4-in {padding: 30px;}

.footerwrap {width: 100%; background: url(../images/foot_logo.png) no-repeat 30px 30px; padding: 50px 0;}
.add {padding: 50px 30px;}




}



@media all and (max-width: 460px) { 


.text-1 {top: 21%; right:3%; font-size: 0.6rem;}
.text-2 {top: 30%; left: 3%; font-size: 0.7rem;}
.text-3 {top: 42%; right: 20%; font-size: 0.6rem;}
.text-4 {bottom: 46%; left: 42%; font-size: 1.1rem; line-height: 1.1;}
.text-5 {bottom: 27%; left: 50%;margin-left: -60px; }
.text-6 {bottom: 6%; left: 50%; margin-left: -100px; font-size: 1.1rem;line-height: 1.1;}
.text-5, .text-4 span, .text-6 span {font-size: 1.5rem; font-weight: 600;}

.sub-4-section-1 img  {width: 15rem;}
.sub-7-section-2 img.sub-7-img {width: 20rem;}


}