@charset "utf-8";

@media (max-width: 1570px) {
	.quick {left:auto; margin-left:0; right:30px;}
	.quick li span {display:none;}
}

@media (max-width: 1490px) {
	.main-product .slick-prev {left:-90px;}
	.main-product .slick-next {right:-90px;}
}

@media (max-width: 1360px) {
	.main-product .slick-arrow {z-index:50;}
	.main-product .slick-prev {left:-40px;}
	.main-product .slick-next {right:-40px;}
}

@media (max-width: 1260px) {
	#header .contain {max-width:1260px; padding-left:30px; padding-right:30px;}
	.sitelogo {left:30px;}
	.util {right:30px;}
	#gnb > ul {margin-right:-30px;}
	#gnb > ul > li {padding:0 40px;}

	#footer .contain {max-width:1260px; padding-left:30px; padding-right:30px;}
	#contArea {padding-left:30px; padding-right:30px;}

	.main-visual {height:auto;}

	.main-product {overflow:hidden;}
	.main-product .slider {padding:0 40px;}
	.main-product .slick-prev {left:10px;}
	.main-product .slick-next {right:10px;}

	.main-about {padding:0 30px;}

	.quick  {right:15px;}
}


/* Landscape tablet */
@media (max-width: 1024px) {
	body, input, textarea, select, button, table {font-size:15px;}	

	/* header */
	#header:before {height:3px;}

	.sitelogo {top:11px;}
	.sitelogo img {height:70px;}

	.util {top:13px; font-size:11px;}

	#gnb {margin-left:140px; padding-top:40px;}
	#gnb > ul > li {padding:0 38px; height:56px;}
	#gnb > ul > li > a {font-size:19px; line-height:44px;}
	#gnb .submenu {top:56px;}
	#gnb .submenu ul li {padding:3px 0;}
	#gnb .submenu ul li a {padding:0 4px; font-size:14px;}
	#gnb .submenu ul li a:after {height:4px;}

	#container {padding-bottom:80px;}

	/* main */
	.main-visual {margin-bottom:60px;}

	.main-product .item .txt {bottom:30px; left:25px; right:25px;}
	.main-product .item h3 {font-size:22px; margin-bottom:20px;}
	.main-product .item p {font-size:14px; margin-bottom:35px;}

	.main-about .txt p {font-size:14px;}
	.main-about .more {font-size:12px; background-position:80px 50%;}
	.comp-zone {width:45%; height:400px;}
	.comp-zone .txt p {font-size:18px;}
	.ebook-zone {margin-left:45%;}
	.ebook-zone a {width:50%; height:200px;}
	.notice-zone {margin-left:45%;}
	.notice-zone a {width:50%; height:200px;}
	

	/* quick */

	/* footer */
	
	/* layout */
	.lnb {font-size:16px; line-height:50px;}
	.lnb ul {display:inline-flex;}
	.lnb ul li {min-width:130px; background-size:1px 20px;}
	.lnb ul li a {padding:0 20px;}

	/* content */
	.sub-tab ul li {padding:0 8px;}
	.sub-tab ul li a {min-width:160px; padding:0 20px; font-size:15px; line-height:40px;}

	.philosophy .cnt {padding:50px;}

	.history {padding-right:360px;}
	.history .group .year {width:120px;}
	.history .group .cnt ul li {padding:10px 0 10px 50px;}	

	.location-info {padding-left:190px; margin-top:20px; font-size:16px;}
	.location-info .cnt ul li {padding-left:160px;}

	.product {display:flex; padding-bottom:45px; margin-bottom:45px;}
	.product .img {width:50%;}
	.product .cnt {margin-left:0; width:50%; padding-left:30px; min-height:auto;}
	.product .btns {left:30px;}
		

	/* board */
	.board-list colgroup col {width:auto !important;}

	.gallery-list ul {display:flex; flex-wrap:wrap; margin:0 -10px;}
	.gallery-list ul li {padding:0 10px;}
	.gallery-list ul li .thumb {margin-bottom:12px;}
	.gallery-list ul li .tit {font-size:15px;}

	.certification ul li {font-size:15px;}
	.certification ul li .more {padding:0 20px; font-size:14px; line-height:33px;}

	.project-list table tbody td {height:auto; padding:9px; font-size:14px;}
	.project-list table tbody td.subject {padding-left:19px;}

	.board-white table {font-size:15px;}

	.board-form table {font-size:15px;}

	.files-upload-text .upfiles-alt {font-size:14px;}

	.board-view-tit {padding:14px 6px;}
	.board-view-tit h3 {font-size:18px;}
	.board-view-info {padding:13px 6px; font-size:13px;}
	.board-view-cnt {padding:15px 6px 40px;}

	.board-prev-next {font-size:14px;}


} 

/* portrait tablet */
@media (max-width: 900px) {	
	.only-desktop {display:none;}
	.only-tablet {display:block;}

	/* header */
	#wrapper {padding-top:90px;}
	#header {position:fixed; top:0; left:0; width:100%; background:#fff;}
	#header .contain {height:90px;}
	#gnb {display:none;}
	.util {display:none;}
	.btn-m-menu {display:block;}
	.mobile-navigation {display:block}

	/* main */	

	/* footer */
	#footer {font-size:12px;}
	.foot-info .f-cs {padding-left:30px;}
	.foot-info .f-cs li {margin-bottom:5px;}
	.foot-info .f-cs img {margin-right:15px;}
	.foot-info .f-cs .tt {font-size:14px;}
	.copyright {padding:13px 0;}

	/* sub */
	.lnb ul li {min-width:100px;}

	/* content */	
	.greetings .img {width:300px;}
	.greetings .cnt {margin-left:330px;}

	.philosophy .cnt {padding:40px;}
	.philosophy .cnt .group {margin-bottom:50px;}
	.philosophy .cnt .tit {width:230px;}
	.philosophy .cnt .tit h4 {font-size:28px;}
	.philosophy .cnt .tit h4 span {font-size:18px;}
	.philosophy .cnt .ico {width:140px;}

	.history {padding-right:250px;}
	.history .tit h3 {font-size:40px; line-height:1.3em;}
	.history .tit span {font-size:60px; line-height:1.3em;}

	/* board */	
	.gallery-list ul {margin:0 -10px;}
	.gallery-list ul li {width:33.33333333%; padding:0 10px;}
		
} 

/* Landscape phone */
@media (max-width: 640px) {
	body, input, textarea, select, button, table {font-size:14px;}
	.only-desktop-tablet {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}

	#wrapper {padding-top:64px;}

	.contain {padding-left:15px; padding-right:15px;}

	/* header */
	#header {background:#fff; border-bottom:1px solid #ddd;}
	#header .contain {height:60px;}

	.sitelogo {left:15px; top:7px;}
	.sitelogo img {height:46px;}

	.top-tel {border-radius:100%; width:32px; height:32px; padding:0; margin-right:40px; background-color:#f1592a; background-image:url("../images/common/call_w.png"); background-position:50% 50%; background-size:18px auto;}
	.top-tel span {display:none;}

	.btn-m-menu {right:15px;}

	.mobile-navigation .home img {height:47px;}

	#container {padding-bottom:50px;}

	/* main */
	.main-visual {margin-bottom:40px;}
	.main-visual .item {overflow:hidden;}
	.main-visual .item img {width:130%; max-width:130%; margin-left:-15%;}
	.main-visual .slick-dots {bottom:15px;}

	.m-head {margin-bottom:25px;}
	.m-head h2 {font-size:24px;}

	.main-product {margin-bottom:60px;}
	.main-product .slider {padding:0 5px 60px;}
	.main-product .item:nth-child(odd) a {margin-top:45px;}
	.main-product .item .img {overflow:hidden;}
	.main-product .item .img img {margin-top:-50%;}
	.main-product .item .txt {bottom:25px; left:20px; right:20px;}
	.main-product .item h3 {font-size:18px; margin-bottom:15px;}
	.main-product .item p {font-size:13px; margin-bottom:25px;}
	.main-product .item .more {font-size:12px;}
	.main-product .slick-arrow {top:auto; margin-top:0; bottom:0; width:40px; height:40px; background-size:10px auto;}
	.main-product .slick-prev {left:50%; margin-left:-45px;}
	.main-product .slick-next {right:50%; margin-right:-45px;}

	.main-about {padding:0 15px;}	
	.main-about .txt {padding:22px 20px;}
	.main-about .txt h3 {font-size:18px; margin-bottom:7px;}
	.main-about .txt p {font-size:12px;}
	.main-about .more {background-size:auto 5px; left:20px; bottom:22px;}

	.comp-zone {float:none; display:block; width:100%; height:200px; background-size:cover;}
	.comp-zone .txt h3 {font-size:20px; margin-bottom:7px;}
	.comp-zone .txt p {font-size:15px;}
	
	.ebook-zone {float:left; margin-left:0; width:50%;}
	.ebook-zone a {width:100%; background-size:50px auto;}
	.notice-zone {float:left; margin-left:0; width:50%;}
	.notice-zone a {width:100%; background-size:50px auto;}

	/* sub */
	.sub-visual {overflow:hidden;}
	.sub-visual img {width:130%; max-width:130%; margin-left:-15%;}

	#contArea {padding-left:15px; padding-right:15px;}

	.lnb {font-size:14px; line-height:40px;}
	.lnb ul li {min-width:auto; background-size:1px 16px;}
	.lnb ul li a {padding:0 15px;}

	.sub-title {padding:30px 0 27px;}
	.sub-title h2 {font-size:22px;}

	.real-cont {min-height:230px;}

	/* quick */
	.quick {top:13%; right:10px; width:34px;}
	.quick li {margin-bottom:13px;}

	/* footer */
	#footer {line-height:1.6em;}
	#footer .contain {padding-left:15px; padding-right:15px;}
	.foot-info {padding:25px 0;}
	.foot-info .f-comp {float:none;}
	.foot-info .f-comp p {display:flex;}
	.foot-info .f-comp .mg {flex-wrap:wrap; margin-bottom:17px;}
	.foot-info .f-cs {float:none; padding:25px 0 0 0; margin-top:25px; border-left:0; border-top:1px solid #3a3a3a;}
	.foot-info .f-cs img {width:16px;}

	/* content */
	.sub-tab {margin-bottom:25px;}
	.sub-tab ul li {padding:0 3px;}
	.sub-tab ul li a {min-width:110px; padding:0 18px; font-size:14px; line-height:32px;}

	.greetings {position:relative; padding-bottom:60px;}
	.greetings .img {float:left; width:150px; margin:0 15px 0 0;}
	.greetings .img p {position:absolute; bottom:0; right:0;}
	.greetings .cnt {margin-left:0; display:inline;}
	.greetings h3 {font-size:22px; margin-bottom:15px;}
	.greetings .cnt .welcome {font-size:16px; line-height:1.5em; margin-bottom:15px;}

	.philosophy h3 {font-size:20px; background-size:contain;}
	.philosophy .img {margin-bottom:30px;}
	.philosophy .img img {width:140px;}
	.philosophy .cnt {padding:0 20px;}
	.philosophy .cnt .group {display:block; border-bottom:1px solid #ddd; margin:0; padding:35px 0; text-align:center;}
	.philosophy .cnt .group:last-child {border-bottom:0;}
	.philosophy .cnt .group > div {display:block; width:auto;}
	.philosophy .cnt .ico {margin:10px 0; border:0;}
	.philosophy .cnt .ico img {width:50px;}

	.history {padding:0;}
	.history .tit {position:static; text-align:left; margin-bottom:15px;}
	.history .tit h3 {font-size:24px;}
	.history .tit h3 br {display:none;}
	.history .tit h3 span {font-size:1.25em; margin-left:10px;}
	.history .group {display:block;}
	.history .group > div {display:block;}
	.history .group .year {width:auto; padding:10px 0 10px 5px; font-size:19px;}
	.history .group .cnt ul {border-top:1px solid #ddd;}
	.history .group .cnt ul li .month {top:9px; left:5px;}	

	.map-wrap iframe {height:250px !important;}

	.location-info {padding-left:0; font-size:14px;}
	.location-info .img {display:none}
	.location-info .img img {width:100%;}
	.location-info .cnt ul li {padding-left:110px;}
	.location-info .cnt ul li img {top:3px;}
	.location-info .cnt ul li .tt {left:32px;}

	.product {display:block; }
	.product .img {width:100%; float:none;}
	.product .cnt {width:100%; float:none; padding:20px 8px 0;}
	.product h3 {font-size:20px;}
	.product h3:after {margin:15px 0;}
	.product .btns {position:static; margin-top:20px;}
	.product .bt {padding:0 18px; font-size:13px; line-height:33px;}

	/* board */
	.board-search {display:flex; flex-direction:column; margin-bottom:8px;}
	.board-search .total-page {order:2; font-size:12px; line-height:1.5em; margin-top:12px;}
	.board-search .search {float:none;}
	.board-search .search form {display:flex;}
	.board-search .search .select {width:80px; min-width:80px; margin-right:4px;}
	.board-search .search .input {flex:1 1 auto; min-width:0; width:1%; margin-right:4px;}
	.board-search .search .btn-pack {font-size:13px; width:80px;}

	.board-list {display:none;}
	.board-list-m {display:block;}

	.project-list table thead th {font-size:13px; height:40px;}
	.project-list table tbody td {padding:4px; font-size:12px;}
	.project-list table tbody td.subject {padding-left:8px;}

	.gallery-list {padding-top:15px;}
	.gallery-list ul {margin:0 -7px;}
	.gallery-list ul li {width:50%; padding:0 7px; margin-bottom:27px;}
	.gallery-list ul li .thumb {margin-bottom:10px;}
	.gallery-list ul li .tit {font-size:14px;}
	.gallery-list ul li .date {font-size:12px; margin-top:4px;}

	.certification ul {display:flex; flex-wrap:wrap; margin:0 -7px;}
	.certification ul li {width:50%; padding:0 7px; margin-bottom:27px; font-size:14px;}
	.certification ul li .tit {margin-bottom:12px;}
	.certification ul li .more {font-size:12px; line-height:30px; padding:0 16px;}

	.form-agree {margin:30px 0 30px;}
	.form-agree h3 {font-size:16px;}
	.form-agree .scroll-box {font-size:12px; max-height:80px; overflow:auto;}
	.form-agree .check {margin-top:12px; font-size:14px;}

	.board-view .head .tit {font-size:15px; font-weight:500; padding:12px 8px;}
	.board-view .head .info {padding:10px 8px; font-size:12px;}
	.board-view .body {padding:20px 8px;}

	.board-write {margin-bottom:25px;}
	.board-write .group {padding-left:0; font-size:14px; line-height:1.55em; padding:14px 5px;}
	.board-write .title {position:static; width:auto; margin-bottom:8px; display:block;}
	.board-write .files_table input[type=file]{width:calc(100% - 120px) !important;}

	.prev_next {font-size:14px; line-height:1.5em;}
	.prev_next dt {width:70px;}
	.prev_next dd {margin-left:80px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

	.buttons {margin:15px 0;}

	.paginate a, .paginate strong {width:30px; height:30px; font-size:12px; line-height:28px;}

	.mailform .top-txt {margin-bottom:10px; margin-top:-10px; font-size:12px;}
	.mailform .top-txt .txt {font-size:16px; line-height:1.6em; margin-bottom:10px;}
	.mailform table tbody th {padding:10px 5px; height:50px; font-size:14px;}
	.mailform table tbody td {font-size:14px;}

	.comment-area {margin-top:37px;}
	.comment-total {font-size:14px; margin-bottom:12px;}
	.comment-write {position:relative; padding:10px;}
	.comment-write .byte {position:absolute; bottom:15px; left:12px; font-size:12px;}
	.comment-write .write {display:block;}
	.comment-write .write textarea {display:block; width:100%; height:65px; margin-right:0;}
	.comment-write .write .btn {text-align:right; margin-top:6px;}
	.comment-item {padding:17px 4px;}
	.comment-item.comment-reply {padding-left:25px; background-image:url("/images/bbs/icon_reply_x2.png"); background-position:3px 18px; background-size:auto 13px;}
	.comment-info {font-size:14px;}
	.comment-info .name {margin-right:5px;}
	.comment-info .date {font-size:11px;}
	.comment-ctr {font-size:12px;}
	.comment-ctr .bar {vertical-align:middle; margin:-.2em 4px 0;}
	.comment-txt {font-size:14px;}
	.comment-link {font-size:13px;}
	.comment-input {padding:10px;}
	.comment-input textarea {height:48px;}

	.board-password {padding:30px 20px;}

} 

/* Landscape phones and down */
@media (max-width: 320px) {

} 