@charset "utf-8";
/*@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800|Nanum+Myeongjo:400,700,800');*/

@import url(//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css);
@import url(//cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css);


@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500|Open+Sans:300,400,600,700&display=swap');
@font-face {font-family:'ON-IGothic';src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_eleven@1.0/ON-IGothic.woff') format('woff');font-weight:normal;font-style:normal;}

/*
font-family:'Gothic A1',sans-serif;

font-family:'Nanum Gothic',sans-serif;
font-family:'Nanum Myeongjo',serif;

font-family:'Roboto',sans-serif;
font-family:'Open Sans',sans-serif;
*/

html {width:100%;height:100%;overflow-y:scroll}
body {width:100%;height:100%;margin:0;padding:0;font-family:'NanumSquareRound','Nanum Gothic', 'Malgun Gothic', dotum, sans-serif;font-size:14px;color:#444;line-height:24px;word-break:keep-all;}
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:'NanumSquareRound','Nanum Gothic', 'Malgun Gothic', dotum, sans-serif;font-size:14px;color:#444;line-height:24px;}
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;}
input, button {margin:0;padding:0;font-family:'NanumSquareRound','Nanum Gothic', 'Malgun Gothic', dotum, sans-serif;font-size:14px;color:#444;line-height:24px;}
input[type="submit"]{cursor:pointer}
button {cursor:pointer}

textarea, select {font-family:'NanumSquareRound','Nanum Gothic', 'Malgun Gothic', dotum, sans-serif;font-size:14px;color:#444;line-height:24px;}
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:#444;text-decoration:none}
a:hover {color:#222;}

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

input[type=text],input[type=password], textarea {}
input[type=text]:focus,input[type=password]:focus,  textarea:focus,select:focus {}

.placeholdersjs { color: #aaa !important; }

#container_wrap {display:block;position:relative;width:100%;min-width:340px;}
#container_wrap:after {display:block;visibility:hidden;clear:both;content:""}



#header_wrap {display:block;position:absolute;left:0;top:0;width:100%;height:80px;background:rgba(0,0,0,0.8);z-index:99;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#header {display:block;position:relative;width:100%;max-width:1200px;margin:0 auto;}
#header:after {display:block;visibility:hidden;clear:both;content:""}
#header #logo {display:block;width:200px;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#header .header_left {float:left;margin:20px 0 0 0;color:#2ca606;line-height:normal;}
#header .header_left strong {display:block;color:#fff;font-size:16px;font-weight:400;}

#body_wrap {}
#body_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#footer_wrap {padding:30px 0;color:#fff;text-align:center;background:#2ca606;}
#footer_wrap ul {margin:0 0 8px 0;text-align:center;font-size:0;line-height:0;}
#footer_wrap ul li {display:inline-block;margin:0 8px 0 0;padding:0 8px 0 0;font-size:13px;line-height:18px;background:url(../../../img/var.gif) no-repeat right 50%;}
#footer_wrap ul li:last-child {margin:0;padding:0;background:none;}



button#top_btn {display:block;position:fixed;right:10px;bottom:20px;width:40px;height:40px;overflow:hidden;line-height:999px;background:url(../../../img/btn_top.gif) no-repeat 50% 50% #fff;border:solid 1px #999;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
button#top_btn:hover {background:url(../../../img/btn_top_on.gif) no-repeat 50% 50% #444;border:solid 1px #999}



#gnb {display:block;position:absolute;right:0;top:0;}
#gnb h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}

#gnb ul.gnb {}
#gnb ul.gnb:after {display:block;visibility:hidden;clear:both;content:""}
#gnb ul.gnb li {display:block;float:left;position:relative;zoom:1;}
#gnb ul.gnb li a {display:block;position:relative;height:80px;padding:0 18px;color:#fff;font-size:16px;font-weight:700;line-height:80px;white-space:nowrap;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#gnb ul.gnb li a:hover {color:#2ca606;background:#222}
#gnb ul.gnb li a.on {color:#fff;background:#222}

#gnb ul.gnb li ul {display:block;position:absolute;left:50%;top:80px;width:160px;height:0;margin:0 0 0 -80px;overflow:hidden;text-align:center;z-index:9999;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#gnb ul.gnb li ul li {float:none;width:100%;background:none}
#gnb ul.gnb li ul li a {display:block;height:40px;padding:0;color:#666;font-size:12px;font-weight:normal;line-height:40px;background:#fff;border-left:solid 1px #ccc;border-right:solid 1px #ccc;border-bottom:dotted 1px #999;}
#gnb ul.gnb li ul li a:hover {color:#fff;background:#444;}
#gnb ul.gnb li ul li:last-child a {border-bottom:solid 1px #ccc;}

/* sticky */
.sticky {position:fixed !important;top:0 !important;background:rgba(0,0,0,0.6) !important;}

#float {position:fixed;left:0;top:50%;margin:-100px 0 0 0;z-index:99999}
#float ul {}
#float ul li {display:block;margin:0 0 1px 0;}
#float ul li a {display:block;width:100px;height:100px;padding:20px 0 0 0;text-align:center;}
#float ul li a img {margin:0 0 4px 0;}
#float ul li a.kakaotalk {color:#3b1c1c;background:#f9e000}
#float ul li a.tel {color:#fff;background:#222}



.video_wrap {width:100%;max-width:800px;margin:0 auto;padding:160px 0 0 0}

#section {padding:80px 0;;}
#section .logo {width:200px;margin:0 auto 18px auto;}
#section .logo img {width:100%;height:auto}

.section1 h2 {display:block;margin:0 0 48px 0;color:#2db400;font-size:60px;font-weight:700;text-align:center;line-height:60px;}

.section1 ul.choice {display:block;width:100%;max-width:1200px;margin:0 auto;text-align:center;}
.section1 ul.choice:after {display:block;visibility:hidden;clear:both;content:""}
.section1 ul.choice li {display:inline-block;width:33%;margin:0 0 40px 0;font-size:0;line-height:0}
.section1 ul.choice li .choice_box {margin:0 20px;border:solid 1px #ccc;}
.section1 ul.choice li .img {position:relative;}
.section1 ul.choice li .img img {width:100%;height:auto}
.section1 ul.choice li .img .arrow {display:block;position:absolute;left:50%;bottom:0;width:20px;height:10px;margin:0 0 0 -10px;}
.section1 ul.choice li p {padding:30px 0;color:#999;font-size:14px;text-align:center;line-height:24px;}
.section1 ul.choice li p strong {display:block;color:#444;font-size:18px;font-weight:400;line-height:24px;}

.section1 .slogon {margin:40px 0;padding:0 10px;color:#666;font-size:18px;line-height:30px;text-align:center;}
.section1 .slogon span {display:block;}

/*.section1 ul.choice2 {width:100%;max-width:800px;margin:0 auto;}
.section1 ul.choice2:after {display:block;visibility:hidden;clear:both;content:""}
.section1 ul.choice2 li {display:block;float:left;width:50%;}
.section1 ul.choice2 li:last-child {margin:0;}
.section1 ul.choice2 li .choice_box {margin:0 20px;border:solid 1px #ccc;}
.section1 ul.choice2 li .img {position:relative;}
.section1 ul.choice2 li .img img {width:100%;height:auto}
.section1 ul.choice2 li .img .arrow {display:block;position:absolute;left:50%;bottom:0;width:20px;height:10px;margin:0 0 0 -10px;}
.section1 ul.choice2 li p {padding:30px 0;color:#999;font-size:14px;text-align:center;}
.section1 ul.choice2 li p strong {display:block;color:#444;font-size:18px;font-weight:400;}*/


.section2 {background:url(../../../img/section2_bg.jpg) no-repeat 50% 50%;background-size:cover}
.section2 h2 {display:block;margin:0 0 48px 0;color:#fff;font-size:60px;font-weight:700;text-align:center;line-height:60px;}
.section2 h3 {display:block;margin:0 0 16px 0;color:#fff;font-size:24px;font-weight:400;text-align:center;line-height:24px;}

.section2 ul {width:100%;max-width:900px;margin:0 auto;}
.section2 ul:after {display:block;visibility:hidden;clear:both;content:""}
.section2 ul li {display:block;float:left;width:33.3%;}
.section2 ul li .serv_box {margin:0 30px 40px 30px;background:#fff;}
.section2 ul li .serv_box .img {padding:20px 0;text-align:center;background:#2ca606}
.section2 ul li .serv_box p {padding:20px 0;color:#999;font-size:14px;text-align:center;}
.section2 ul li .serv_box p strong {display:block;margin:0 0 24px 0;color:#444;font-size:18px;font-weight:400;}
.section2 ul li .serv_box p a {display:block;height:40px;margin:0 40px;color:#fff;text-align:center;line-height:40px;background:#222;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.section2 ul li .serv_box p a:hover {background:#2ca606}



#contact_wrap {width:100%;max-width:1000px;margin:0 auto;padding:60px 0;}
#contact_wrap:after {display:block;visibility:hidden;clear:both;content:""}
#contact_wrap .contact_form {float:left;width:55%;padding:0 10% 0 0;border-right:solid 1px #ddd}
/*#contact_wrap .contact_info {float:left;width:45%;padding:0 0 0 8%;}*/

#contact_wrap .contact_info {width:100%;max-width:600px;margin:0 auto;}

.contact_form ul {}
.contact_form ul li {display:block;margin:0 0 10px 0;}
.contact_form ul li:last-child {margin:0}
.contact_form ul li .input {display:block;width:100%;height:40px;line-height:38px;text-indent:8px;border:solid 1px #ccc;}
.contact_form ul li .textarea {display:block;width:100%;height:160px;line-height:22px;text-indent:8px;border:solid 1px #ccc;}
.contact_form ul li .btn_submit {display:block;width:100%;height:50px;color:#fff;text-align:center;line-height:50px;background:#222;border:none;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.contact_form ul li .btn_submit:hover {background:#2ca606}

.contact_info h2 {display:block;margin:0 0 36px 0;color:#444;font-size:36px;font-weight:400;text-align:center;}
.contact_info ul {}
.contact_info ul:after {display:block;visibility:hidden;clear:both;content:""}
.contact_info ul li {display:block;float:left;position:relative;width:50%;margin:0 0 24px 0;padding:0 0 0 50px;color:#444;font-size:18px;}
.contact_info ul li .icon {display:block;position:absolute;left:0;top:4px;}
.contact_info ul li label {display:block;color:#2ca606;font-size:14px;font-weight:700;}



@media screen and (max-width:768px) {
#header_wrap {height:60px;position:relative;}
#header {padding:0 10px;}
#header #logo {margin:0 auto;}
#header #logo img {width:auto;height:60px;}

#header .header_left {display:none;}

#footer_wrap {padding:20px 0 80px 0;font-size:12px;}

#footer_wrap ul li {display:inline-block;margin:0 12px 8px 0;font-size:12px;background:none;}

#gnb {display:none;}

button#top_btn {bottom:60px;}

#float {width:100%;bottom:0;left:0;top:auto;margin:0;}
#float ul {}
#float ul:after {display:block;visibility:hidden;clear:both;content:""}
#float ul li {display:block;float:left;width:50%;margin:0;}
#float ul li a {display:block;width:auto;height:50px;padding:10px 0 0 0;}
#float ul li a img {width:32px;height:auto;margin:0 6px 0 0;}
#float ul li a p {display:inline;}

.video_wrap {padding:40px 0 0 0}


#section {padding:60px 0;;}
#section .logo {width:160px;margin:0 auto 12px auto;}

.section1 h2 {margin:0 0 36px 0;font-size:48px;line-height:48px;}

.section1 .slogon {margin:30px 0;padding:0 10px;font-size:16px;line-height:24px;}
.section1 .slogon span {display:inline !important;}

.section1 ul.choice li {width:49.5%;margin:0 0 20px 0;}
.section1 ul.choice li .choice_box {margin:0 20px 20px 20px;}
.section1 ul.choice li p {font-size:13px;}
.section1 ul.choice li p strong {font-size:16px;}

.section1 ul.choice2 li p {font-size:13px;}
.section1 ul.choice2 li p strong {font-size:16px;}


.section2 h2 {margin:0 0 36px 0;font-size:48px;line-height:48px;}
.section2 h3 {margin:0 0 12px 0;font-size:18px;line-height:18px;}

.section2 ul li {width:50%;}
.section2 ul li .serv_box {margin:0 20px 30px 20px;}
.section2 ul li .serv_box p {font-size:13px;}
.section2 ul li .serv_box p strong {font-size:16px;}



#contact_wrap {width:auto;margin:0 30px;padding:30px 0;}
#contact_wrap .contact_form {float:none;width:100%;margin:0 0 36px 0;padding:0;border-right:none}
#contact_wrap .contact_info {float:none;width:100%;padding:0;}

.contact_info h2 {margin:0 0 24px 0;font-size:30px;}
.contact_info ul li {font-size:16px;}
.contact_info ul li label {font-size:13px;}
}




@media screen and (max-width:480px) {
#section {padding:40px 0;;}

.section1 h2 {margin:0 0 24px 0;font-size:36px;line-height:36px;}

.section1 ul.choice li {width:100%;}
.section1 ul.choice li:last-child {margin:0;}
.section1 ul.choice li .choice_box {margin:0 40px 20px 40px;}
.section1 ul.choice li:last-child .choice_box {margin:0 40px 0 40px;}

.section1 ul.choice2 li {width:100%;margin:0 0 20px 0}
.section1 ul.choice2 li:last-child {margin:0;}
.section1 ul.choice2 li .choice_box {margin:0 40px;}


.section2 h2 {margin:0 0 24px 0;font-size:36px;line-height:36px;}
.section2 h3 {margin:0 0 8px 0;font-size:16px;line-height:16px;}

.section2 ul li {width:100%;}
.section2 ul li .serv_box {margin:0 40px 30px 40px;}
.section2 ul li:last-child .serv_box {margin:0 40px 0 40px;}



.contact_info h2 {font-size:24px;}
.contact_info ul li {width:100%;}
}