/* 공통 */
#contents {width:100%; text-align:center;}
.contents-1 { width: 1200px; margin: 0 auto; text-align: left;}
.container {width:1200px; margin: 0 auto;}

.clearfix:after {content:""; display:block; clear:both; } 
.bg-white {background:#FFF;}


/* TOP버튼 */
#go-top {position: fixed; right:20px; bottom:20px;}
#go-top a { width:45px; height:45px; display: block; cursor:pointer; text-align: center; font-size:10px; font-weight:600; padding-top:22px; color: #FFF; background-color:rgba(0,0,0,0.6); background-image: url(/img/top-bg.png); background-repeat:no-repeat; background-position: center 10px; border-radius:3px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s;}
#go-top a:hover { color: #FFF;}


/* Info 배너 */
#info-wrap {margin-top:-100px; background:#EDEFF2;}
.info {width:33.3333%; height: 280px; float:left; position:relative;}
.info-slide {width:33.3333%; height: 280px; float:left; position:relative;}
.info > img {width: 100%;}
.info .overlay {background: rgba(0,0,0,0.1); border: 1px solid rgba(255,255,255,0.5); position: absolute; top: 10px; left: 10px; right: 10px; bottom: 10px; opacity: 0;
 -webkit-transition: 0.2s opacity; transition: 0.2s opacity; -webkit-transition-delay: 0.2s; transition-delay: 0.2s;}
.info:hover .overlay {-webkit-transition-delay: 0s; transition-delay: 0s; opacity: 0.8;}
.info .info-content {position: absolute; left: 25px; right: 25px; top: 50%; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: 0.2s all; transition: 0.2s all;}
.info:hover .info-content {top: 45%;}
.info .info-content h3 {font-size:26px; line-height:34px; font-weight:500; opacity: 1; color: #FFF; margin-bottom: 25px; -webkit-transition: 0.2s all; transition: 0.2s all;}
.info .info-content p {font-size:16px; line-height:24px; display: block;  opacity: 1; color: #FFF; margin-bottom: 5px; -webkit-transition: 0.2s all; transition: 0.2s all;}
.info .info-link {text-align: center; margin-top: 25px; opacity: 1; -webkit-transition: 0.2s all; transition: 0.2s all;}
a.btn-style1 {display: inline-block; font-size: 15px; padding: 8px 25px; border: 1px solid rgba(255,255,255,0.7); color: #FFF; text-align: center;}
a.btn-style1:hover {color: #333; background: rgba(255,255,255,0.7);}
a.btn-style2 {display: inline-block; font-size: 14px; padding: 8px 25px; border: 1px solid #BBB; color: #999; text-align: center;}
a.btn-style2:hover {color: #FFF; background: #999; border: 1px solid #999;}
.notice {padding: 30px;}
.notice-header {border-bottom: 1px solid #DDD; text-align: left; font-size:0; padding-bottom: 10px; margin-bottom: 20px;}
.notice-header h3 {display:inline-block; font-size:19px; width:80%; font-weight:500; color:#222222;}
.notice-header .more {display:inline-block; width:20%; font-size:13px; padding-right:5px; text-align:right;}
.notice-header .more a {color:#888; display:inline-block;}
.notice-header .more a:hover {text-decoration: underline;}
/* 공지사항 추출 */
.board_output td { color:#666 !important; font-size:14px; height:34px; font-weight:400; vertical-align:top;}
.board_output a { font-size:15px !important; font-weight:400; color:#666 !important;}


/* 소개 영역 */
/*#introduce {background:#EDEFF2;}*/
#introduce .intro-box {width:100%; background:url('/img/intro_bg.jpg') right bottom no-repeat; padding:100px 40px; text-align:left;}
#introduce .intro-box h3 {color:#14a5ad; font-size:34px; line-height:40px; font-weight:500; padding-bottom:30px; letter-spacing:-0.8px;}
#introduce .intro-box .p-big {color:#fe8e30; font-size:25px; line-height:30px; font-weight:300; padding-bottom:5px;}
/* 소개 버튼 디자인 */
a.intro-btn {display:inline-block; margin-top:30px; background:#fe8e30; color:#FFF; padding:3px 30px; font-size:15px; width: 130px; height: 35px; line-height: 35px;}
a.intro-btn:hover {background:#14a5ad;}
a.intro-btn0 {display:inline-block; margin-top:30px; background:#14a5ad; color:#FFF; padding:8px 30px; font-size:15px; }
a.intro-btn0:hover {background:#fe8e30;}
a.intro-btn1 {display:inline-block; margin-top:30px; border:1px solid #FFF; color:#FFF; padding:0 30px; font-size:15px; width: 185px; height: 40px; line-height: 41px;}
a.intro-btn1:hover {background:rgba(255,255,255,0.3); color:#FFF;}
a.intro-btn2 {display:inline-block; margin-top:30px; border:1px solid #FFF; color:#FFF; padding:8px 30px; font-size:15px; }
a.intro-btn2:hover {background:rgba(255,255,255,0.3); color:#FFF;}


/*프리미엄서비스 영역*//*수정*/
.containe { width: 100%; background: #EDEFF2; height: 100%; padding-bottom: 90px; padding-top: 90px;}

/* 제품소개 영역 */
#product {padding:90px 20px; font-size:0;}
#product h2 {color:#1E1E1E; font-size:40px; line-height:54px; font-weight:500; text-align:center; /*font-family:'Montserrat','Noto Sans KR', sans-serif; */padding-bottom:15px;}
#product p {font-size:14px; line-height:22px; padding-bottom:30px; text-align:center;}

#product1 {padding:0px 20px; font-size:0;}
#product1 h2 {color:#1E1E1E; font-size:40px; line-height:54px; font-weight:500; text-align:center; /*font-family:'Montserrat','Noto Sans KR', sans-serif; */padding-bottom:15px;}
#product1 p {font-size:14px; line-height:22px; padding-bottom:30px; text-align:center;}


/*생생 현장사진 영역*/

/*생생 현장사진*/
.site{width: 1200px; margin: 0 auto; padding-bottom: 100px;}
.site_btn{font-size: 40px; font-weight: 500; color: #1E1E1E; padding-bottom: 15px;}
.site_area{width: 100%; display: block; overflow: hidden; padding-bottom: 40px;}
.site_area ul{display: flex; justify-content: space-between;}
.site_area li{float: left; width: 50%; padding-right: 40px;}
.site_post{display: block; overflow: hidden; width: 100%;}
.site_post img{width: 100%;}
.site_post p{display: block; overflow: hidden; margin-top: 10px; text-align: left; color: #333; font-size: 20px;}
.site_txt{display: inline-block; width: 100%;  margin-top: 10px;}
.site_txt strong{display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 10px; font-size: 16px; color:#787878;}
.site_txt span{float: left; font-size: 14px; color: #787878;}
.dot{display: inline-block; width: 15px; height: 15px; margin: 0 2px; background-color: #bbb; border-radius: 50%;}
.swiper {width: 1200px; height: 100%; margin: 0 auto 100px;}
.swiper-wrapper{padding-bottom: 50px;}
.swiper-slide {text-align: center; font-size: 18px; background: #fff;
/* Center slide text vertically */display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}


/*갤러리영역*/

.sub-top-gall{background: url(/img/sub_top_06.png) center no-repeat; text-align: center; width: 100%; background-size: cover}


/* 홍보영상 영역 */
#movie {background:url('/img/movie_bg.jpg') center top no-repeat; background-attachment:fixed; background-size:cover; padding:50px 20px; text-align:center; font-size:0;}
#movie .sm-tit {font-size:14px; color:#FFF; font-weight:500; letter-spacing:10px; font-family:'Montserrat', sans-serif; padding-bottom:10px;}
#movie h3 {color:#FFF; font-size:36px; font-weight:300; padding-bottom:25px;}
#movie p {color:#FFF; font-size:16px; line-height:24px;}
#movie .youtube-txt {width:100%; display:inline-block; vertical-align:middle;}
#movie .youtube-wrap {width:50%; display:inline-block; vertical-align:middle; padding-left:100px;}
#movie .youtube-wrap .youtube { position:relative; width:100%; padding-bottom: 56.25%;}
#movie .youtube-wrap .youtube iframe { position: absolute; width:100%; height:100%; }


/* 고객센터 영역 */
#customer {background:#EDEFF2; padding:50px 20px;}
#customer h3 {font-size:16px; font-weight:500;}
#customer .cs-box-bg {height:180px; background:url('/img/customer_bg.jpg') no-repeat; font-size:0; box-shadow:8px 8px 22px rgba(0,0,0,0.2);}
#customer .cs-center {width:40%; display:inline-block; padding-left:20px; vertical-align:middle; text-align:left;}
#customer .cs-center ul { padding:25px; }
#customer .cs-center li {color:rgba(255,255,255,0.85); font-size:14px;}
#customer .cs-center li.cs_tit {padding-bottom:8px;}
#customer .cs-center li.tel_num {color:#FFF; font-size:36px; font-weight:700; font-family:'Montserrat',sans-serif; padding-bottom:5px;}
#customer .cs-center li.tel_num a {color:#FFF; }
#customer .cs-icon {font-size:0;}
#customer .cs-icon {width:60%; display:inline-block; vertical-align:middle;}
#customer .cs-icon ul {width:100%; display:table; position:relative;}
#customer .cs-icon li {width:25%; height:180px; display:table-cell; text-align:center; font-size:12px; line-height:16px; vertical-align:middle; border-left:1px solid rgba(255,255,255,0.3);}
#customer .cs-icon li i {font-size:40px; display:table-cell; vertical-align:middle;}
#customer .cs-icon li a {padding-top:30px; color:rgba(255, 255, 255, 0.75); display:block; height:100%; vertical-align:middle;}
#customer .cs-icon li a:hover {background:rgba(0, 0, 0, 0.3);;}
.icon-img {color:#FFF; display:inline-table; width:80px; height:60px; border-radius:100px; }
.icon-tit {color:#FFF; font-size:16px; font-weight:500; padding:8px 0; display:block;}


/* 하단 풋터 영역 */
#footer { background:#333; padding:40px 20px; text-align:center; font-size:13px; line-height:22px;}
#footer a {color:#BBB;}
#footer .copyright_logo {width:100%;}
#footer .footer_util {width:100%;}
#footer .footer_util li {display:inline-block; padding-right:2px;}
#footer .footer_util li a {display:block; color:#BBB; font-size:12px; border:1px solid #A0A0A0; padding:3px 15px;}
#footer .footer_util li a:hover {background:#999; border:1px solid #999; color:#FFF;}
#footer .footer_copyright {width:100%; padding-bottom:20px;}
#footer .footer_copyright li {color:#DDD; display:inline-block; padding-right:20px;}
#footer .copy_end {width:100%; padding-right:0px !important;}



@media screen and (max-width: 1200px) {

/* 공통 *//*수정*/
.container { width: 100%; }

/*프리미엄서비스영역*/
.containe{ padding: 60px 20px;}
.contents-1 { width: 100%;}

/* What we do 영역 */
#info-wrap {margin-top:0; padding:0;}
.info {height:220px;}
.info .info-content h3 {font-size:20px; line-height:30px; margin-bottom:10px;}
.info .info-content p {font-size:14px; line-height:20px;}
a.btn-style1 {font-size:13px; padding:6px 20px;}

/* 인트로 영역 */
#introduce .intro-box {background-size:cover; padding:80px 40px;} 
#introduce h3 {font-size:28px; line-height:34px; padding-bottom:10px;}
#introduce p {font-size:13px; line-height:18px; padding-bottom:20px;}

/* 홍보영상 영역 */
#movie {background-size:cover; height:auto; padding:30px;} 
#movie h3 {font-size:28px; line-height:34px;}

/* 제품소개 영역 */
#product {padding:80px 20px;}
#product h2 {font-size:28px; line-height:34px;}
#product p {font-size:13px; line-height:18px; padding-bottom:20px;}

/* 빠른문의 영역 */
#cs-qna {padding:0px; }
#cs-qna .cs-formmail {display:inline-block; width:60%; vertical-align:top; text-align:left; padding:0 20px;}
#cs-qna .cs-formmail h4 {padding-bottom:20px;}
#cs-qna .cs-info {padding-left:20px;}

#customer {padding:0;}


/*생생 현장사진*/
.site{width: 100%; padding: 0 12px;}
.site_btn{font-size: 28px;}
.swiper{width: 100%;}



/* 공지사항 추출 */
.board_output td {font-size:12px; height:24px;}
.board_output a { font-size:13px !important;}
.notice {padding:20px;}

/* 고객센터 영역 */
#customer .cs-center ul {padding:0 10px;}
#customer .cs-center li.tel_num {font-size:28px; padding-bottom:10px;}
#customer .cs-box-bg {background-size:cover;}
#customer .cs-box-bg {height:160px;}
#customer .cs-icon li {height:160px;}
#customer .cs-icon li a {padding-top:20px;}

/* 하단 풋터 영역 */
#footer {padding:30px 20px;}
#footer .copyright {font-size:13px; line-height:20px;}
}


@media all and (max-width: 992px) {
/* Info 배너 */
.info {width:50%;}
}


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


/*프리미엄서비스 영역*//*수정*/
.containe { background: #fff; padding: 70px 0 0 0;}

p br {display:none;}

/* Info 배너 */
.info {width:50%;}
.info > img {height:220px;}
.info .info-content p {font-size:14px; line-height:22px;}

/* 홍보영상 영역 */
#movie {padding:50px;}
#movie .sm-tit {font-size:12px; padding-bottom:5px; text-align:center;}
#movie h3 {font-size:20px; padding-bottom:15px;text-align:center;}
#movie .youtube-wrap {padding:30px 0 0;}
#movie .youtube-txt {width:100%; text-align:justify;}
#movie .youtube-wrap {width:100%; padding-left:0px; padding-top:20px;}
#movie p {font-size:13px; line-height:18px;}

/* 소개 영역 */
#introduce .intro-box {padding:60px 40px;background:url('/img/intro_bg_m.png') right bottom #eeeff3 no-repeat;}
#introduce .intro-box h3 {font-size:20px; line-height:28px; padding-bottom:10px;}
#introduce .intro-box .p-big {font-size:14px; line-height:22px;}


/* 소개 버튼 디자인 */
a.intro-btn {margin-top:10px; font-size:13px; }
a.intro-btn0 {margin-top:10px; font-size:13px; }
a.intro-btn1 {margin-top:10px; font-size:13px; }
a.intro-btn2 {margin-top:10px; font-size:13px; }

/* 제품소개 영역 */
#product {padding:60px 20px 0;}
#product:last-child{padding-bottom: 60px;}
#product h2 {font-size:24px; line-height:30px;}
#product p {padding-bottom:10px; text-align: center;}/*폰트크기수정*/
.button_01{ padding-bottom: 60px;}/*padding 값넣음*/


/*생생 현장사진*/
.site{padding: 40px 12px 0 12px;}
.site_btn{font-size: 24px;}
.site_post p{font-size: 18px;}
.site_txt strong{font-size: 14px;}
.site_txt span{font-size: 12px;}

/* 고객센터 영역 */
#customer {background-attachment:scroll;}
#customer h3 {font-size:15px;}
#customer .cs-box-bg {height:auto; padding:25px;}
#customer .cs-center {width:100%; padding-left:0;}
#customer .cs-center ul {padding:0; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,0.3);}
#customer .cs-icon {width:100%;}
#customer .cs-icon li {height:auto; border-left:0;}
#customer .cs-icon li a {padding-top:20px;}
#customer .cs-icon ul li img {width:auto;}
#customer .cs-icon li i {font-size:28px;}
.icon-tit {font-size:14px; padding:5px 0;}
.icon-img {height:40px;}

/* 하단 풋터 영역 */
#footer .footer_copyright li {width:100%;}
}





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

/* Info 배너 */
.info {width:100%;}

/* 소개 영역 */
#introduce .intro-box {padding:40px 20px;}

/* 제품소개 영역 */ /*추가*/
#product {padding: 40px 20px 0;}
.button_01 {padding-bottom: 40px;}

/*padding 값넣음*/

.swiper{margin: 0 auto 70px;}

/* 홍보영상 영역 */
#movie {padding:30px;}

/* 하단 풋터 영역 */
#footer .footer_util li a {padding:2px 10px;}

}

@media all and (max-width: 369px) {
  /* 하단 풋터 영역 */
  #footer .footer_util li a {padding:2px 5px;}
}

@media all and (max-width: 339px) {
  #footer .footer_util li:last-child{margin-top: 10px;}
}