@charset "utf-8";
/* 메인 롤링이미지 */
#mainSlider {position:relative; overflow:hidden}
#mainSlider > .imgList {position:relative; width:1000%}
#mainSlider > .imgList > li {position:relative; float:left; width:100vw; height:880px; background-size:cover !important; cursor:pointer}
#mainSlider > .imgList > li .caption {display:table; max-width:1400px; height:100%; margin:0 auto; padding:0 50px}
#mainSlider > .imgList > li .caption .inner {display:table-cell; text-align:center; vertical-align:middle}
#mainSlider > .imgList > li .caption .inner h2 {font-size:60px; font-weight:600; color:#fff; line-height:1.3}
#mainSlider > .imgList > li .caption .inner h2:after {display:block; margin:30px auto 35px auto; width:160px; height:1px; content:''; background:#fff}
#mainSlider > .imgList > li .caption .inner h3 {font-size:20px; font-weight:400 ;color:#fff}
#mainSlider > .imgList > li.item1 {background:url(../img/main_img.png) center no-repeat}
#mainSlider > .imgList > li.item2 {background:url(../img/main_visual2.jpg) center no-repeat}
#mainSlider > .imgList > li.item3 {background:url(../img/main_visual3.jpg) center no-repeat}
#mainSlider > .pagination {position:absolute; bottom:30px; left:0; width:100%; text-align:center; font-size:0; z-index:10;display:block;}
#mainSlider > .pagination > li {display:inline-block; font-size:10px; margin:0 2px; padding:0; width:10px; height:10px; border-radius:50%; background:#ccc; cursor:pointer;transition:all .3s ease;border:0px;}
#mainSlider > .pagination > li.on {background:#fff;width:30px;border-radius:30px;}
/* 섹션 공통 */
.section {position:relative; padding:80px 0; overflow:hidden; background:#f9f9f9}
.section > .inner {position:relative; max-width:1400px; margin:0 auto; padding:0 50px}
.section h2.tit {max-width:1400px; margin:0 auto; text-align:center; font-size:40px; font-weight:900; color:#1f1f1f; line-height:80px}
.section h4 {max-width:1400px; margin:0 auto; text-align:center; font-size:18px; font-weight:400; color:#474747; margin-bottom:60px}
.section h2.tit a {font-size:30px; font-weight:600; color:#333}
.section h2.tit a:hover {color:#92bd92}
.section h2.tit:before {display:block}
.section h2.tit.light {color:#fff}
.section h2.tit.light a {color:#fff}
.section h2.tit.light:before {background:#fff}
.section h2.tit.left {text-align:left}
.section h2.tit.left:before {margin:0 0 10px 0}
.section h3.slogan {text-align:center; font-size:44px; font-weight:normal; color:#454545; margin-bottom:20px}
.section h3.slogan.light {color:#fff}
.section p.subtit {text-align:center; font-size:14px; color:#888}
.section .btn-more2 {text-align:center}
.section .btn-more2 a {display:inline-block; font-size:16px; color:#000; padding:12px 35px; border:2px solid #000; background:transparent}
.section .btn-more2 a i {margin-left:15px; vertical-align:-1px}
.section .btn-more2 a:hover {color:#fff; background:#000}
.section .btn-more2.light a {color:#fff !important; border:2px solid #fff !important}
.section .btn-more2.light a:hover {color:#000 !important; background:#fff}
/* 메인 제품소개 */
.section .main_pro {}
.section .main_pro01 {float:left}
/* 포스팅 롤링 공통 */
.postSlider {background:#f4f4f4}
.postSlider .textWrapper {position:relative; overflow:hidden}
.postSlider .textWrapper ul {position:relative}
.postSlider .textWrapper ul > li {float:left; padding-top:100px}
.postSlider .textWrapper ul > li a {display:block; margin-right:90px}
.postSlider .textWrapper ul > li a h3 {font-size:44px; font-weight:normal; margin-bottom:20px; transition:all .3s ease}
.postSlider .textWrapper ul > li a h3 {font-size:44px}
.postSlider .textWrapper ul > li a:hover h3 {color:#92bd92}
.postSlider .textWrapper ul > li p {font-size:14px; line-height:1.75}
.postSlider .imgWrapper {overflow:hidden}
.postSlider .imgWrapper ul {width:1000%}
.postSlider .imgWrapper ul > li {float:left}
.postSlider .imgWrapper ul > li img {display:block; width:100%}
.postSlider .control {position:absolute; display:block; width:80px; height:80px; top:50%; margin-top:-40px; text-align:center; line-height:80px; background:#fff}
.postSlider .control.prev {left:0; padding-right:10px}
.postSlider .control.next {right:0; padding-left:10px}
.postSlider .control i {font-size:48px; color:#000; line-height:80px}
.postSlider .control:hover {background:#000}
.postSlider .control:hover i {color:#fff}
.postSlider .thumbList {font-size:0; text-align:center}
.postSlider .thumbList > li {position:relative; display:inline-block; font-size:10px; width:48px; height:48px; margin:0 2px; background-size:cover !important; cursor:pointer; overflow:hidden;}
.postSlider .thumbList > li.on:before {position:absolute; top:0; left:0; width:100%; height:100%; content:''; background:#000; opacity:.6; filter:alpha(opacity='60'); z-index:10}
.postSlider .thumbList > li.on:after {position:absolute; top:0; left:0; bottom:0; right:0; content:''; border:2px solid #92bd92; z-index:20}
.postSlider .thumbList > li > img {display:block; width:100%}
/* 포스팅 롤링 (type1) */
#postSliderType1 {position:relative; margin-top:-107px}
#postSliderType1 .textWrapper {float:left; width:65%}
#postSliderType1 .textWrapper ul {position:relative}
#postSliderType1 .imgWrapper {position:relative; float:right; width:30%}
#postSliderType1 .thumbList {clear:both; margin-top:50px}
/* 최근 갤러리 추출 */
.section2 {background:#131313}
.section2 .dropdown > a {display:none}
.section2 .category {width:60%; text-align:center; margin:50px auto}
.section2 .category > li {display:inline-block; padding:0 10px}
/*.section2 .category > li:first-child a[data-cate="전체"] {display:none !important;}*/
.section2 .category > li a {display:block; font-size:16px; color:#fff; padding:5px 15px}
.section2 .category > li.on a:after, .section2 .category > li a:hover:after {display:block; margin-top:8px; height:3px; content:''; background:#fff}
.section2 .category > li.on a:before {display:block; width:0; height:0; content:''; margin:0 auto 5px auto; border-style:solid; border-width:4px; border-color:#fff transparent transparent transparent}
.section2 .listWrapper {margin-bottom:100px}
.section2 .listWrapper .tableArea {width:101.5%; margin-left:-0.757%}
.section2 .listWrapper .tableArea li {position:relative; float:left; width:23.48%; margin:0 0.757% 20px 0.757%;list-style:none;}
.section2 .listWrapper .tableArea .board, .section2 .listWrapper .tableArea td[width="25"] {display:none !important}
.section2 .listWrapper .tableArea .text {display:none;}
.section2 .listWrapper .tableArea li a {display:block}
.section2 .listWrapper .tableArea li img {display:block; width:100%; height:auto !important}
.section2 .listWrapper .tableArea li br {display:none}
.section2 .listWrapper .tableArea li .hoverBox {position:absolute; top:0; left:0; bottom:0; right:0; padding:30px; text-align:left; background:rgba(0, 0, 0, .6); opacity:0; filter:alpha(opacity='0'); transition:all .5s ease}
.section2 .listWrapper .tableArea li .hoverBox h3 {font-size:24px; font-weight:normal; color:#fff; line-height:1.4; margin-bottom:10px}
.section2 .listWrapper .tableArea li .hoverBox p {font-size:14px; color:#fff; line-height:1.75}
.section2 .listWrapper .tableArea li:hover .hoverBox {opacity:1; filter:alpha(opacity='100')}

/* 포스팅 롤링 (type2) */
#postSliderType2 {position:relative}
#postSliderType2 .imgWrapper {float:right; width:50%}
#postSliderType2 .imgWrapper img {display:block; width:100%}
#postSliderType2 .textWrapper {float:right; max-width:740px; padding-top:100px}
#postSliderType2 .textWrapper ul > li {padding:0 !important}
#postSliderType2 .textWrapper ul > li > a {margin-left:90px}
#postSliderType2 .thumbList {position:absolute; bottom:100px; left:0; width:100%; z-index:50}
.section3 {padding:0 !important}
.section3 h2.tit {margin-left:90px}
/* 최근 공지사항 추출 */
.section4 {background:#f0f0f0}
.section4 .postList {width:101.53%; margin:50px 0 50px -0.7575%}
.section4 .postList > li {position:relative; float:left; width:48.48%; margin:0 0.7575% 20px 0.7575%; background:#fff; box-shadow:0 2px 2px rgba(0, 0, 0, .04); transition:all .5s ease}
.section4 .postList > li:before {position:absolute; top:0; left:0; bottom:0; right:0; content:''; border:2px solid transparent; z-index:10; transition:all .5s ease}
.section4 .postList > li:hover {box-shadow:0 18px 20px rgba(0, 0, 0, .1)}
.section4 .postList > li:hover:before {border-color:#92bd92}
.section4 .postList > li a {position:relative; display:table; table-layout:fixed; width:100%; height:180px; z-index:20}
.section4 .postList > li a > div {display:table-cell; vertical-align:top}
.section4 .postList > li a .imgArea {width:30%; background-size:cover !important}
.section4 .postList > li a .imgArea img {display:block; width:100%}
.section4 .postList > li a .textArea {padding:30px}
.section4 .postList > li a .textArea h3 {font-size:24px; font-weight:normal; color:#333; margin-bottom:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.section4 .postList > li a .textArea span {display:block; font-size:14px; color:#bbb; margin-bottom:15px}
.section4 .postList > li a .textArea p {display:-webkit-box; font-size:14px; line-height:1.75; max-height:50px; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden}
/* 지도&문의 */
.section5 {padding:0 !important}
.section5 .com_info {float:left}

.section5 .mapArea {float:left; width:60%; padding-left:30px; padding-bottom:30px}
.section5 .mapArea .map_tit {font-size:24px; font-weight:600; color:#555; line-height:70px}
.section5 .root_daum_roughmap .wrap_map {height:300px;}
.section5 .mapArea img {display:block; width:100%}
.section5 .contactArea {float:left; width:50%; max-width:740px; padding:80px}
.section5 .contactArea h4 {font-size:18px; font-weight:normal; color:#454545; margin-bottom:20px}
.section5 .contactArea ul li {position:relative; font-size:14px; line-height:1.75; color:#555; padding:15px 0 15px 40px}
.section5 .contactArea ul li:before {position:absolute; left:0; font-family:'FontAwesome'; font-size:18px; vertical-align:-1px}
.section5 .contactArea ul li.item1:before {content:'\f041'}
.section5 .contactArea ul li.item2:before {content:'\f0e0'}
.section5 .contactArea ul li.item3:before {content:'\f095'}
.section5 .contactArea fieldset {margin-top:40px; padding-top:40px; border-top:1px solid #e8e8e8}
.section5 .contactArea .inputWrapper {max-height:60px; text-align:justify; margin-bottom:10px}
.section5 .contactArea .inputWrapper:after {display:inline-block; width:100%; content:''; height:0}
.section5 .contactArea .inputWrapper input {display:inline-block; width:49%; height:60px; font-size:14px; text-indent:20px; border:none; border-radius:4px; background:#f0f0f0}
.section5 .contactArea textarea {width:100%; min-height:150px; padding:20px; font-size:14px; border:none; border-radius:4px; background:#f0f0f0}
.section5 .contactArea button {margin-top:30px; padding:12px 35px; font-size:16px; border:2px solid #000; background:transparent; cursor:pointer; transition:all .3s ease}
.section5 .contactArea button:hover, .section5 .contactArea button:focus, .section5 .contactArea button:active {color:#fff; background:#000}
.section5 .formmail_btn {text-align:left !important}
/* 미디어쿼리 */
@media screen and (max-width:1480px) {
 /* 포스팅 롤링 (type2) */
 #postSliderType2 .imgWrapper {position:relative; float:none; width:100%}
 #postSliderType2 .textWrapper {float:none; max-width:inherit; margin:50px; padding:0}
 #postSliderType2 .textWrapper ul > li {padding:60px 0 0 0 !important}
 #postSliderType2 .textWrapper ul > li > a {margin:0}
 #postSliderType2 .thumbList {position:static; margin-bottom:80px}
 .section3 .control {background:transparent}
 .section3 .control i {color:#fff}
 .section3 h2.tit {margin:0}
}
@media screen and (min-width:1281px) {
 /* 최근 갤러리 추출 */
 .section2 .category {display:block !important}
}
@media screen and (max-width:1280px) {
 /* 메인 롤링이미지 */
 #mainSlider > .imgList > li {height:660px}
 #mainSlider > .imgList > li .caption .inner h2 {font-size:48px}
 /* 섹션 공통 */
 .section {padding:80px 0}
 .section h2.tit {font-size:24px}
 .section h2.tit a {font-size:24px}
 .section h2.tit:before {width:28px; height:2px}
 .section h3.slogan {font-size:33px}
 /* 포스트 롤링 공통 */
 .postSlider .textWrapper ul > li {padding-top:0}
 .postSlider .textWrapper ul > li a {margin:0 45px}
 .postSlider .textWrapper ul > li a h3 {font-size:33px}
 .postSlider .textWrapper ul > li p {display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:6; max-height:148px; overflow:hidden; text-overflow:ellipsis}
 .postSlider .control {height:120px; margin-top:-60px; line-height:120px}
 .postSlider .control i {font-size:64px; line-height:120px}
 .postSlider .control:active {background:#000}
 .postSlider .control:active i {color:#fff}
 /* 포스팅 롤링 (type1) */
 .section1 h2.tit {text-align:center !important}
 .section1 h2.tit:before {margin-left:auto !important; margin-right:auto !important}
 #postSliderType1 {margin-top:0}
 #postSliderType1 .textWrapper {float:none; width:80%; margin:auto; text-align:center}
 #postSliderType1 .imgWrapper {float:none; width:80%; max-width:350px; margin:0 auto 50px auto}
 /* 최근 갤러리 추출 */
 .section2 .dropdown {position:relative; width:75%; margin:50px auto}
 .section2 .dropdown > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; background:#fff}
 .section2 .dropdown > a:after {position:absolute; font-family:'FontAwesome'; font-size:18px; color:#333; right:20px; content:'\f107'}
 .section2 .dropdown.open > a:after {content:'\f106'}
 .section2 .category {display:none; position:absolute; top:50px; width:100%; margin:0; border:1px solid #e8e8e8; border-top:none; background:#fff; z-index:30}
 .section2 .category > li {display:block; padding:0; text-align:left}
 .section2 .category > li a {color:#999; padding:12px 15px; border-top:1px solid #f0f0f0}
 .section2 .category > li.on a {color:#333}
 .section2 .category > li.on a:before, .section2 .category > li.on a:after, .section2 .category > li:hover a:before, .section2 .category > li:hover a:after {display:none !important}
 .section2 .listWrapper {margin-bottom:60px}
 .section2 .listWrapper .tableArea {margin-left:-0.7575%}
 .section2 .listWrapper .tableArea li {width:31.8%; margin:0 0.7575% 20px 0.7575%}
 .section2 .listWrapper .tableArea li .hoverBox h3 {font-size:18px}
 .section2 .listWrapper .tableArea li .hoverBox p {font-size:12px}
 /* 최근 공지사항 추출 */
 .section4 .postList {width:100%; margin:50px 0}
 .section4 .postList > li {float:none; width:100%; margin:0 0 20px 0}
 .section4 .postList > li:hover {box-shadow:none}
 .section4 .postList > li a {height:auto}
 .section4 .postList > li a .textArea h3 {font-size:18px}
 .section4 .postList > li a .imgArea {width:20%}
 /* 지도&문의 */
 .section5 .mapArea {float:none; width:100%; height:500px}
 .section5 .contactArea {float:left; width:100%; max-width:inherit; padding:50px}
}
@media screen and (max-width:768px) {
 /* 메인 롤링이미지 */
 #mainSlider > .imgList > li {height:400px}
 #mainSlider > .imgList > li .caption .inner h2 {font-size:32px}
 #mainSlider > .imgList > li .caption .inner h2:after {width:140px; margin:20px auto}
 #mainSlider > .imgList > li .caption .inner h3 {font-size:12px}
 /* 섹션 공통 */
 .section {padding:50px 0}
 .section > .inner {padding:0 25px}
 .section h2.tit {margin-bottom:30px}
 .section h2.tit:before {width:20px; height:2px}
 .section h3.slogan {font-size:22px; margin-bottom:15px}
 .section p.subtit {line-height:1.75}
 /* 포스팅 롤링 공통 */
 .postSlider .textWrapper ul > li {padding:0 !important}
 .postSlider .textWrapper ul > li a {margin:0 20px !important}
 .postSlider .textWrapper ul > li a h3 {font-size:22px}
 .postSlider .control {width:50px; height:80px; margin-top:-40px; line-height:80px; background:transparent}
 .postSlider .control.prev {padding-right:5px}
 .postSlider .control.next {padding-left:5px}
 .postSlider .control i {font-size:36px; line-height:80px}
 /* 포스팅 롤링 (type1) */
 #postSliderType1 .textWrapper {width:100%}
 #postSliderType1 .imgWrapper {width:90%}
 .section1 .control:hover, .section1 .control:active {background:#fff}
 .section1 .control:hover i, .section1 .control:active i {color:#000 !important}
 /* 최근 갤러리 추출 */
 .section2 .dropdown {margin:30px auto} 
 .section2 .listWrapper {margin-bottom:30px}
 .section2 .listWrapper .tableArea {margin-left:-0.3787%}
 .section2 .listWrapper .tableArea li {width:48.86%; margin:0 0.3787% 0.8% 0.3787%}
 .section2 .listWrapper .tableArea li .hoverBox {padding:20px}
 .section2 .listWrapper .tableArea li .hoverBox h3 {display:-webkit-box; font-size:14px; margin-bottom:5px; max-height:40px; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis}
 .section2 .listWrapper .tableArea li .hoverBox p {display:-webkit-box; max-height:42px; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis}
 /* 포스팅 롤링 (type2) */
 #postSliderType2 .textWrapper {margin:0 25px; padding:50px 0}
 #postSliderType2 .textWrapper ul > li {padding-top:0 !important}
 #postSliderType2 .textWrapper ul > li > a {margin:0 !important}
 /* 최근 공지사항 추출 */
 .section4 .postList {margin:30px 0}
 .section4 .postList > li {margin:0 0 10px 0}
 .section4 .postList > li a .textArea {padding:15px}
 .section4 .postList > li a .textArea h3 {font-size:14px; margin-bottom:5px}
 .section4 .postList > li a .textArea span {margin-bottom:10px}
 .section4 .postList > li a .textArea p {font-size:12px}
 .section4 .postList > li a .imgArea {width:30%}
 /* 지도&문의 */
 .section5 .mapArea {height:300px}
 .section5 .contactArea {padding:30px 25px}
 .section5 .contactArea ul li {padding:10px 0 10px 40px}
 .section5 .contactArea .inputWrapper {max-height:inherit; margin:0}
 .section5 .contactArea .inputWrapper:after {display:none}
 .section5 .contactArea .inputWrapper input {display:block; width:100%; height:40px; text-indent:10px; margin-bottom:10px}
 .section5 .contactArea textarea {min-height:120px; padding:10px}
 .section5 .contactArea button {margin-top:20px}
 .section5 .formmail_btn {text-align:center !important}
}
@media screen and (max-width:480px) {
 /* 최근 공지사항 추출 */
 .section4 .postList > li a .imgArea {width:50%} 
}