@charset "utf-8";

@media (max-width: 1800px) {

	#header .sitelogo {left:15px;}
	#header .contactus {right:50px;}
	
	.open-nav {left:-40px;}


	.visual-section .slick-prev {left:50px;}
	.visual-section .slick-next {right:50px;}

	.visual-section .content .contain {max-width:1000px;}
}


@media (max-width: 1400px) {
	
	#header .sitelogo {top:23px;}
	#header .sitelogo img {height:50px;}
	#gnb > ul > li {font-size:20px;} 

	.section1 {padding:70px 15px;}

	.section2 {padding:70px 15px;}

	.section3 {padding:70px 15px;}

	.real-cont {padding:0 15px 80px;}
}

/* Landscape tablet to portrait tablet */
@media (max-width: 1200px) {
	/* 공통 */
	.only-desktop {display:none;}
	.only-tablet {display:block;}
	.only-mobile {display:none;}
	.desktop-tablet {display:block;}


	/* header */
	#header .sitelogo {top:16px;}
	#header .contain {height:80px;}
	#header .contactus {top:27px;}
	.open-nav {top:23px;}
	#gnb {margin-left:80px;}
	#gnb > ul > li { font-size:18px; line-height:80px;}	
	#gnb .submenu {top:80px}

	
	
	/* main */
	.visual-section .slick-prev {left:20px; margin-top:-29px; width:30px; height:58px; background-size:30px;}
	.visual-section .slick-next {right:20px; margin-top:-29px; width:30px; height:58px; background-size:30px;}
	.visual-section .content .contain {max-width:900px;}
	.visual-section .content .contain img {height:100px;}
	.visual-section .content.type2 {margin-top:-50px;}
	.visual-section .content.type3 {margin-top:-50px;}
	.visual-section .content.type3 .contain:after {width:400px; margin-left:-200px;}
	.visual-section .slick-dots {bottom:30px}

	.section1 {padding:50px 15px;}
	.section1 .location .box {padding-right:20px;}
	.section1 .location .box br {display:none;}
	.section1 dl dt {font-size:24px;}
	.section1 .contact {padding-left:25px;}
	.section1 .contact .content {padding:10px;}

	.section2 {padding:50px 15px;}
	.section2 .title {font-size:32px;padding-bottom:20px; margin-bottom:40px;}
	.section2 ul{margin:0 -5px;}
	.section2 ul li {padding:0 5px;}
	.section2 ul li .box {padding:30px 25px;}
	.section2 ul li .box .tit {font-size:18px; margin-bottom:5px;}
	.section2 ul li .box .txt {margin-bottom:5px;}
	.section2 ul li .more {top:30px; right:25px;}
	.section2 ul li .hover-more .detail {font-size:15px}

	.section3 {padding:50px 15px;}
	.section3 ul li .tit {font-size:22px; margin-bottom:10px;}
	.section3 ul li .tel {font-size:20px;}
	.section3 ul li p {font-size:16px;}
	.section3 ul li:after {top:50%; margin-top:-100px; height:200px;}
	

	/* sub page */
	.sub-visual {padding-bottom:25.8%; font-size:20px;}
	.sub-visual .cell {margin-top:-70px;}
	.sub-visual .cell .tit {font-size:40px;}
	.sub-visual .cell .tit:after {width:400px; margin-left:-200px;}

	
	.sub-title {margin:0 auto 40px;}
	.sub-title h2 {font-size:30px; padding:10px 15px;}
	.sub-title p {margin-top:10px;}

	.lnb-menu {margin:-30px auto 70px;}
	.lnb-menu ul li {font-size:18px; line-height:60px;}

	
	/* footer */
	.scroll-top {bottom:50px; right:0}
	.scroll-top img {height:40px;}
	#footer .contain {padding:30px 0;}
	#footer .col {padding-right:60px;}
	#footer .col .tit {font-size:16px; margin-bottom:10px;}
	#footer .col p {font-size:15px;}
	.foot-logo {margin-bottom:10px;}
	.foot-logo img {height:50px;}
	.foot-copy {font-size:16px; line-height:50px;}
	.foot-tel {top:30px;}
	.foot-tel .tit {font-size:18px;}
	.foot-tel .tit span {font-size:15px;}
	.foot-tel .tel {font-size:30px;}
	
	
	/* doc */
	.overview {padding-bottom:40px;}
	.overview .info {padding-left:30px;}
	.overview .info .box {height:auto; padding:20px 0;}
	.overview .info .box .col .tit {width:140px; font-size:16px;line-height:50px;} 
	.overview .info .box .col .txt {margin-left:160px; font-size:16px;line-height:50px;}

	.business {margin-bottom:50px;}
	.business .info {padding-left:80px;}
	.business dl {padding-top:50px;}
	.business dl dt {font-size:22px;}
	.business dl dd {font-size:17px;}
	.business.type2 .info {padding-right:80px}

	
	.map-info {margin-top:40px;}
	.map-info ul li {width:17.5%;}
	.map-info ul li:nth-child(1) {width:30%}
	.map-info ul li .tit {font-size:20px;}
	.map-info ul li p {font-size:15px;}

	.doc-title {font-size:24px; margin-bottom:20px; padding-left:10px;}
	.doc-title:after {top:8px; height:22px;}
	
	.product-list {margin-bottom:40px;}
	.product-list .info {padding-left:30px;}
	.product-list .info .title {font-size:17px; padding:0 0 10px 20px;}
	.product-list .info ul li {padding:0 0 9px 20px;}

	.engineer-photo {margin-bottom:40px;}
	.engineer-photo ul {margin:0 -25px;}
	.engineer-photo ul li {padding:0 25px;}
	.engineer-photo ul li .desc {font-size:15px;padding-top:10px;}
	.engineer-photo ul li .txt {margin-bottom:15px;}
	.engineer-photo ul li .txt li {font-size:16px;}
	.engineer-photo ul li .txt .tit {font-size:16px}

	.engineer-photo2 {margin-bottom:40px;}
	.engineer-photo2 ul {margin:0 40px;}
	.engineer-photo2 ul li {padding:0 40px;}
	.engineer-photo2 ul li .txt {margin-bottom:15px;}
	.engineer-photo2 ul li .txt li {font-size:16px;}
	.engineer-photo2 ul li .txt .tit {font-size:16px;}



	/* board */
	.board-form {display:none;}
	.m-board-form {display:block;}
	.mailform table {font-size:14px;}
	.mailform table thead th {padding:7px 5px; height:30px;}
	.mailform table tbody th {padding:7px 5px;}
	.mailform table tbody td {padding:7px 10px;}

}

@media (max-width: 1100px) {

	#gnb > ul > li {width:200px; font-size:16px;}
	.visual-section .content {bottom:auto; top:50%; left:0; margin-top:-40px; text-align:center;}
	.visual-section .content .contain {max-width:800px;}
	.visual-section .content .contain img {height:80px;}
	.visual-section .content.type2 {margin-top:-40px; left:0; right:auto; text-align:center;}
	.visual-section .content.type3 {margin-top:-40px;}
	.visual-section .content.type3 .contain:after {bottom:-20px; left:50%; width:300px; margin-left:-150px;}
	.visual-section .slick-dots {bottom:20px;}
	.visual-section .slick-dots li button {width:11px; height:11px;}

	.section1 dl {padding-left:400px;}

	.scroll-top {display:none !important;}



}

@media (max-width: 1024px) {
	#gnb {display:none;}

	#header .sitelogo {top:15px;}
	#header .sitelogo img {height:40px;}

	#header .contain {height:70px;}
	#header .contactus {top:22px;}
	.open-nav {top:18px;}

	.section1 {padding:30px 15px;}
	.section1 .location .box {height:150px; background-size:250px;}
	.section1 dl {padding-left:250px}
	.section1 dl dt {font-size:20px;}
	.section1 dl dd {font-size:16px;}
	.section1 .contact {padding-left:20px; }
	.section1 .contact .content {padding:8px; height:150px;}

	.section2 {padding:30px 15px;}
	.section2 .title {font-size:28px;padding-bottom:15px; margin-bottom:30px;}
	.section2 ul li .box {padding:25px 20px;}
	.section2 ul li .more {top:25px; right:20px;}
	.section2 ul li .hover-more {display:none;}
	.section2 ul li .hover {display:none;}

	
	.section3 {padding:30px 15px;}
	.section3 ul li .tit {font-size:20px; margin-bottom:5px;}
	.section3 ul li .tel {font-size:18px;}
	.section3 ul li p {font-size:15px;}
	.section3 ul li:after {margin-top:-80px; height:160px;}

	#footer .contain {padding:20px 15px;}
	#footer .col {width:50%; padding-right:0; margin-bottom:10px;}
	#footer .col:nth-child(2n+1) {clear:left}
	#footer .col .tit {font-size:15px; margin-bottom:5px;}
	#footer .col p {font-size:15px;}
	#footer .col p.type2 {display:inline-block; background-position:0 6px;padding-left:20px;}
	.foot-logo {margin-bottom:10px;}
	.foot-logo img {height:35px;}
	.foot-copy {font-size:14px; line-height:40px;}
	.foot-tel {position:relative; top:0; text-align:left;}
	.foot-tel .tit {font-size:16px ;}
	.foot-tel .tit span {display:none;font-size:14px; padding-left:0;}
	.foot-tel .tel {font-size:20px;}


	.sub-visual {padding-bottom:28.8%; font-size:18px;}
	.sub-visual .cell {margin-top:-55px;}
	.sub-visual .cell .tit {font-size:30px;}
	.sub-visual .cell .tit:after {width:300px; margin-left:-150px;}


	.real-cont {min-height:300px; _height:300px; padding:0 15px 50px;}

	.sub-title {margin:0 auto 30px;}
	.sub-title h2 {font-size:26px; padding:5px 10px;}
	.sub-title p {margin-top:5px;}

	.lnb-menu {margin:-25px auto 40px;}
	.lnb-menu ul li {font-size:17px; line-height:50px;}

	/* doc */
	.overview {padding-bottom:30px;}
	.overview .info {padding-left:10px;}
	.overview .info .box {padding:15px 0;}
	.overview .info .box .col .tit {width:80px; line-height:40px;} 
	.overview .info .box .col .txt {margin-left:100px; line-height:40px;}

	.business {margin-bottom:30px;}

	.cert-list ul {margin:0 -15px;}
	.cert-list ul li {padding:0 15px;}
	.cert-list ul li .tit {font-size:15px;}

	.kakao-map {height:300px !important}
	.kakao-map .wrap_map {height:300px !important}
	.map-info {margin-top:30px;}
	.map-info ul li {width:50%; text-align:left; margin-bottom:10px;}
	.map-info ul li:nth-child(5n+1) {clear:none;}
	.map-info ul li:nth-child(1) {width:100%}
	.map-info ul li .icon {width:40px;display:inline-block; vertical-align:top;height:35px; background-size:30px; background-position:0 50%; margin-bottom:0;}
	.map-info ul li .tit {display:inline-block; vertical-align:top; font-size:18px; line-height:35px;margin-bottom:0;}
	.map-info ul li  p {padding-top:5px;}
	
	.doc-title {font-size:20px; margin-bottom:15px; padding-left:10px;}
	.doc-title:after {top:7px; height:16px;}

	.product-list {margin-bottom:30px;}
	.product-list .photo {float:none; width:100%; margin-bottom:15px;}
	.product-list .photo .slick-prev {left:10px; width:45px; height:45px; margin-top:-23px; background-size:45px;}
	.product-list .photo .slick-next {right:10px; width:45px; height:45px; margin-top:-23px; background-size:45px;}
	.product-list .info {float:none; width:100%; padding-left:0;}
	.product-list .info .title {font-size:17px; background-size:10px; background-position:0 9px;padding:0 0 10px 18px;}
	.product-list .info ul li {padding:0 0 9px 18px; margin-bottom:8px;}

	.engineer-photo {margin-bottom:30px;}
	.engineer-photo ul {margin:0 -15px;}
	.engineer-photo ul li {padding:0 15px;}
	.engineer-photo ul li .desc {font-size:14px;padding-top:5px;}
	.engineer-photo ul li .txt {margin-bottom:10px;}
	.engineer-photo ul li .txt li {font-size:15px;}
	.engineer-photo ul li .txt .tit {font-size:15px}

	.engineer-photo2 {margin-bottom:30px;}
	.engineer-photo2 ul {margin:0 20px;}
	.engineer-photo2 ul li {padding:0 20px;}
	.engineer-photo2 ul li .txt {margin-bottom:10px;}
	.engineer-photo2 ul li .txt li {font-size:15px;}
	.engineer-photo2 ul li .txt .tit {font-size:15px;}

	.doc-cnt .cnt {margin-bottom:15px;}
	.doc-cnt .cnt li {font-size:15px;}
	.doc-cnt .cnt .tit {font-size:15px;}


}


/* Landscape phone */
@media (max-width: 767px) {

	/* 공통 */
	.only-desktop {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}
	.desktop-tablet {display:none;}
	
	#m-header {height:60px;}
	#m-header .sitelogo {top:13px;}
	#m-header .sitelogo img {height:35px}

	/* main */
	.visual-section .slick-prev {left:10px; margin-top:-25px; width:25px; height:49px; background-size:25px;}
	.visual-section .slick-next {right:10px; margin-top:-25px; width:25px; height:49px; background-size:25px;}
	.visual-section .content {bottom:auto; top:50%; left:0; margin-top:-25px; text-align:center;}
	.visual-section .content .contain img {height:50px;}
	.visual-section .content.type2 {margin-top:-25px; left:0; right:auto; text-align:center;}
	.visual-section .content.type3 {margin-top:-25px;}
	.visual-section .content.type3 .contain:after {bottom:-15px; width:200px; margin-left:-100px;}
	.visual-section .slick-dots {bottom:10px;}
	.visual-section .slick-dots li button {width:10px; height:10px;}

	.section1 {padding:20px 15px;}
	.section1 .location {float:none; width:100%; margin-bottom:10px;}
	.section1 .location .box {background-size:120px;}
	.section1 .location .box:after {background-size:80px;}
	.section1 .location .box:before {background-size:80px;}
	.section1 dl {padding-left:10%;}
	.section1 dl dt {font-size:18px; margin-bottom:5px;}
	.section1 dl dd {font-size:15px;}
	.section1 .contact {float:none; width:100%; padding-left:0;}
	.section1 .contact .content {padding:7px;}

	.section2 {padding:20px 15px;}
	.section2 .title {font-size:20px;padding-bottom:10px; margin-bottom:20px;}
	.section2 ul li {float:none; width:100%; margin-bottom:10px;}
	.section2 ul li:nth-child(3n+1) {clear:none;}
	.section2 ul li .box {padding:15px;}
	.section2 ul li .more {top:15px; right:15px;}

	.section3 {padding:20px 15px;}
	.section3 ul li {float:none; width:100%; border-bottom:1px solid #ddd; padding:10px 0}
	.section3 ul li:nth-child(4n+1) {clear:none;}
	.section3 ul li:nth-child(4) {border-bottom:0;}
	.section3 ul li .icon {height:50px; background-size:35px;}
	.section3 ul li .tit {font-size:18px; margin-bottom:0;}
	.section3 ul li .tel {font-size:15px;}
	.section3 ul li p {font-size:15px;}
	.section3 ul li:after {display:none;}
	


	/* sub page */
	.sub-visual {padding-bottom:45%; font-size:15px;}
	.sub-visual .cell {margin-top:-35px;}
	.sub-visual .cell .tit {font-size:20px;}
	.sub-visual .cell .tit:after {width:200px; margin-left:-100px;}

	
	.real-cont {min-height:150px; _height:150px; padding:0 15px 30px;}

	.sub-title {margin:0 auto 20px;}
	.sub-title h2 {font-size:22px;}

	
	/* 메뉴 */
	.lnb-menu {display:none;}
	.m-lnb-menu {display:block;position:relative; background:#3e6db3;text-align:center; margin-bottom:20px;}
	.m-lnb-menu .submenu {position:relative; z-index:100}
	.m-lnb-menu .submenu:after {content:"";position:absolute; top:13px; right:20px; transform:rotate(45deg); border:solid #fff;border-width:0 2px 2px 0; padding:5px;}
	.m-lnb-menu .submenu > a {display:block; padding:12px 25px 12px 19px; color:#fff; font-size:1.1em; line-height:20px; transition:none;}
	.m-lnb-menu .submenu.active:after {top:19px; transform:rotate(-135deg);}
	.m-lnb-menu .submenu ul {display:none; position:absolute; top:44px; left:0; width:100%; background:#f3f4f5; z-index:50;}
	.m-lnb-menu .submenu ul li a {display:block; padding:10px 0; color:#5d5d5d; font-size:15px; line-height:20px; text-decoration:none; border-bottom:1px solid #e0e0e0;}
	.m-lnb-menu .submenu ul li a:hover {color:#fff; background:#3e6db3; border-bottom:1px solid #3e6db3;}

	

	/* footer */
	#footer .contain {padding:20px 0; text-align:center;}
	#footer .col {float:none; width:100%;}
	#footer .col:nth-child(2n+1) {clear:none;}
	.foot-logo img {height:30px;}
	.foot-copy {font-size:13px;}
	.foot-tel {text-align:center;}
	.foot-tel .tit {font-size:15px;}
	.foot-tel .tel {font-size:18px;}

	.foot-menu ul{text-align:center;}
	.foot-menu ul li {float:none; display:inline-block; vertical-align:top; padding:0 2px;}

	/* doc */
	.overview {padding-bottom:20px;}
	.overview .photo {float:none; width:100%; margin-bottom:10px;}
	.overview .photo .thumb {padding-bottom:40.2%;}
	.overview .info {float:none; width:100%; padding-left:0;}
	.overview .info .box {padding:15px 10px}
	.overview .info .box .col {border-bottom:1px solid #ddd; padding-bottom:10px; margin-bottom:10px;}
	.overview .info .box .col .tit {float:none; width:60px; text-align:left; font-size:14px;line-height:1.6em; border-bottom:0;} 
	.overview .info .box .col .txt {margin-left:0; font-size:14px;line-height:1.6em;}
	.overview .info .box .col:last-child {border-bottom:0; margin-bottom:0; padding-bottom:0;}

	.history .col {padding-bottom:15px; position:relative;}
	.history .col:before {left:68px; margin-left:0;}
	.history .col .year {float:none; position:absolute; top:10px; left:0;  width:auto; font-size:20px;}
	.history .col .year:after {top:10px; left:60px; width:17px; height:17px;}
	.history .col .year:before {display:none;}
	.history .col .info {float:none;width:100%; padding-left:70px; padding-top:17px;}
	.history .col .info .month {font-size:15px; padding-left:15px;}
	.history .col .info .month:after {display:none;}
	.history .col .info .txt {padding-left:15px; font-size:14px; letter-spacing:-1px;}
	.history .col .info .txt:after {top:10px; left:5px; width:4px; height:4px;}

	.business {margin-bottom:20px;}
	.business .photo {float:none; width:100%; margin-bottom:20px;}
	.business .info {float:none; width:100%; padding-left:0}
	.business dl {padding-top:0;}
	.business dl dt {font-size:18px; margin-bottom:10px;}
	.business dl dt:after {display:none;}
	.business dl dd {font-size:15px; margin-bottom:2px;}
	.business.type2 .photo {float:none;}
	.business.type2 .info {padding-left:0; padding-right:0; text-align:left;}

	.cert-list ul {margin:0 -5px;}
	.cert-list ul li {width:50%; padding:0 5px; margin-bottom:15px;}
	.cert-list ul li:nth-child(3n+1) {clear:none;}
	.cert-list ul li:nth-child(2n+1) {clear:left;}

	.kakao-map {height:250px !important}
	.kakao-map .wrap_map {height:250px !important}
	.map-info {margin-top:20px;}
	.map-info ul li .icon {width:30px;height:30px; background-size:25px;}
	.map-info ul li .tit {font-size:17px; line-height:30px;}
	.map-info ul li  p {padding-top:5px; font-size:14px;}

	.doc-title {font-size:16px; margin-bottom:10px;}
	.doc-title:after {top:6px; height:14px;}

	.product-list {margin-bottom:20px;}
	.product-list .photo {margin-bottom:10px;}
	.product-list .photo .slick-prev {left:10px; width:40px; height:40px; margin-top:-20px; background-size:40px;}
	.product-list .photo .slick-next {right:10px; width:40px; height:40px; margin-top:-20px; background-size:40px;}
	.product-list .info .title {font-size:16px; background-size:8px; background-position:0 9px;padding:0 0 10px 15px;}
	.product-list .info ul li {padding:0 0 9px 15px; margin-bottom:8px;}

	.engineer-photo {margin-bottom:20px;}
	.engineer-photo ul {margin:0;}
	.engineer-photo ul li {float:none; width:100%; padding:0;}


	.engineer-photo2 {margin-bottom:20px;}
	.engineer-photo2 ul {margin:0;}
	.engineer-photo2 ul li {float:none; width:100%; padding:0;}


	
	/* 사이트맵 */
	.sitemap div {width:50%; margin-bottom:30px;}
	.sitemap div:nth-child(3n+1) {clear:none}
	.sitemap div:nth-child(2n+1) {clear:left}


	/* board */

	/* 리스트 */
	.board-list {display:none;}
	.m-board-list {display:block !important; border-top:1px solid #686868; border-bottom:1px solid #ddd; margin-bottom:10px;}
	.m-board-list li {border-top:1px solid #ddd; font-size:.9em; letter-spacing:-.25px; padding:10px 10px}
	.m-board-list li:first-child {border-top:0;}
	.m-board-list li a {display:block;}
	.m-board-list li strong {font-size:1em; font-weight:normal; line-height:1.4em; color:#333; word-wrap:break-word; word-break:break-all; vertical-align:top;}
	.m-board-list li img {vertical-align:middle;}
	.m-board-list li .info {display:inline-block; position:relative; padding:4px 0 0 0; font-size:1em; line-height:1.4em; color:#888;}
	.m-board-list li .bar {color:#ccc; margin:0 6px;}
	.m-board-list .answer {border-top:1px solid #ddd; background:#f4f4f4; padding:10px; font-size:12px;}
	.m-board-list .answer .q {color:#666; padding:0 0 8px 18px; text-indent:-18px;}
	.m-board-list .answer .q span {font-weight:bold; font-size:1em; margin-right:6px;}
	.m-board-list .answer .a {color:#d15a13; padding:0 0 0 18px; text-indent:-18px;}
	.m-board-list .answer .a span {font-weight:bold; font-size:1em; margin-right:6px;}
	.m-board-list .answer .cnt {margin-bottom:10px; padding:10px 15px;}
	.m-board-list .btn {text-align:right; padding:0 0 10px 10px;}
	.m-board-list .btn a {display:inline-block}
	.m-board-list .none {padding:50px; text-align:center;}
		
	

	/* 검색 */
	.board-search .total-page {display:none;}
	.board-search .search {float:none; text-align:center;}
	.board-search .search .select {width:70px;}
	.board-search .search .input {width:120px;}
	.board-search .search .btn {padding:0 10px;}
	
	.board-write .files_table input[type=file]{margin-right:10px; width:100% !important; margin-bottom:5px;}
	.board-write .btn-pack.medium {height:25px; line-height:23px;}

	.buttons {margin:20px auto;}

	.mailform table thead th {padding:7px 5px;}
	.mailform table tbody th {padding:7px 5px; }
	.mailform table tbody td {padding:7px 5px;}
	.form-agree {margin-top:10px;}
	.form-agree .btn span{display:none;}
	.form-agree .scroll-box {height:80px; border:1px solid #d8d8d8; font-size:13px; line-height:18px; background:#f7f7f7; color:#666; padding:10px; overflow:auto;}



	

}	

/* Landscape phones and down */
@media (max-width: 480px) {

	.fancybox-close {
		top: -30px;
		right: 0;
		width: 25px;
		height: 25px;
		background-size:25px;
	}
	
}