@charset "utf-8";
@media (max-width: 1550px) {
	.main-visual .bt-prev a {left:15px;} 
	.main-visual .bt-next a {right:15px;} 
}
@media (max-width: 1350px) {
	#gnb>ul {margin-left:-30px; flex-wrap:wrap; position:relative;} 
	#gnb>ul:after {content:''; width:100%; height:1px; background:#ddd; position:absolute; left:0; top:50%;}
	#gnb>ul>li {padding-right:30px; margin-left:30px; width:calc(25% - 30px);}
	#gnb>ul>li>a {justify-content:center;}
	#gnb>ul>li:nth-child(4):after {display:none;}
	
	.section2 .layout-more {right:0; left:auto;}

	.main-visual .txt {left:80px;}
	.foot-logo {padding-right:15px;}

	.history .col .year {width:20%;}
	.popup {left:15px; top:100px;}
}


/* Landscape tablet */
@media (max-width: 1024px) {
	body, input, textarea, select, button, table {font-size:15px;}	
	/* header */
	#sub #header {border-bottom:0;}
	.header-wrap {height:80px;}
	.header-wrap .sitelogo a {width:110px;}
	#gnb {display:none;}
	#gnb>ul:after {display:none;}
	.btn-m-menu {display:block;}
	/* main */
	
	.main-visual .item .secting-img {width:100%; height:100%; background-size:cover; -ms-transform:none; -webkit-transform:none; transform:none; -webkit-transition:none; -ms-transition:none; transition:none;}
	.main-visual .item.visual-active .secting-img {-ms-transform:none; -webkit-transform:none; transform:none; -webkit-transition:none; -ms-transition:none; transition:none;}

	.main-visual .item {height:260px;}
	.main-visual .txt01 .tt01 {font-size:50px;}
	.main-visual .txt01 .tt02 {font-size:28px;}
	.main-visual .txt .tt1 {margin-bottom:22px; display:inline-block;}
	.main-visual .txt .tt1.img01 {width:220px;}
	.main-visual .txt .tt1.img02 {width:155px;}
	.main-visual .txt .tt1.img03 {width:250px;}
	.main-visual .txt .tt2 {padding-left:0;}
	.main-visual .txt .tt2 h3 {font-size:38px;}
	.main-visual .txt .tt2 p {font-size:22px; margin-top:30px;}
	.main-visual .bt-arrow a {width:40px; height:40px;}
	.main-visual .bx-pager {bottom:26px;}
	.main-visual .bx-pager a {width:13px; height:13px;}

	.latout-tit {font-size:22px; margin-bottom:10px;}
	.layout-more {top:8px; width:14px; height:14px;}

	.section1 {padding:60px 0;}
	.section1 .wrap {margin-left:-15px;}
	.section1 .cnt {padding-left:15px;}
	.section1 .cnt .img-box a {margin-bottom:10px;}
	.section1 .cnt h3 {font-size:16px; margin-bottom:10px; padding-bottom:10px;}
	.section1 .cnt li {padding-left:6px;}
	.section1 .cnt li:before {width:3px; height:3px; top:11px;}

	.section2 {padding:60px 0;}
	.section2 ul {flex-wrap:wrap; margin-left:-20px; justify-content:center; margin-bottom:-30px;}
	.section2 ul li {width:calc(50% - 20px); padding-left:20px; margin-bottom:30px;}
	.section2 ul li a .img-box {margin-bottom:10px;}
	.section2 ul li a p {padding:0 5px;}
	/* sub ppage */
	.sub-title {margin:40px 0 30px;}
	.sub-title h2 {font-size:26px;}

	.sub-title .lang li {margin-left:15px;}

	.sub-visual {height:400px; margin-bottom:60px;}
	.sub-visual .txt .tt1 {margin-bottom:20px;}
	.sub-visual .txt .tt2 {padding-left:0px;}
	.sub-visual .txt .tt2 h3 {font-size:38px;}
	.sub-visual .txt .tt2 p {font-size:20px; margin-top:30px;}
	.sub-visual .txt .tt1.img01 {width:220px;}
	.sub-visual .txt .tt1.img02 {width:155px;}
	.sub-visual .txt .tt1.img03 {width:250px;}

	.lnb {margin:0 auto 40px;}
	.lnb ul li a {line-height:38px; font-size:16px;}

	.real-cont {margin-bottom:60px;}
	/* doc */
	/* sub01 */
	.products .cnt>ul>li {padding:25px 0;}
	.products .left-product p {font-size:16px;}
	.products .left-product .img-box {margin-bottom:10px;}
	.products .info {width:71.25%; padding-left:20px;}
	.products .info h3 {font-size:18px;}
	.products .info p {margin-bottom:6px;}
	.products .info .box {padding:20px; max-height:180px;}
	.products .info li:before {width:4px; height:4px; top:10px;}
	/* sub02,03,04 */
	.adi-list li {padding:25px 0;}
	.adi-list .txt {padding-right:50px; width:70%;}
	.adi-list .txt .tt1 {margin-bottom:10px;}
	.adi-list .txt .tt1 h3 {font-size:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	.adi-list .img-box {width:30%;}
	/* detail */
	.detail .cnt h3 {font-size:18px; padding:10px 15px;}
	.detail .cnt .data {padding:8px 15px;}
	.detail .cnt .data li {margin-right:10px; padding-right:15px;}
	.detail .cnt .data li:after {height:14px;}
	.detail .cnt .txt {padding:15px;}
	.detail .cnt .txt p {margin-bottom:18px;}
	.detail .cnt .tt ul {padding:15px;}
	.detail .cnt .tt ul li span:before {width:3px; height:3px; top:11px;}
	.detail .detail-btn {margin-top:15px;}
	.detail .detail-btn li a {line-height:38px; width:65px;}
	/* sub05,06,07 */
	.brand-list .cnt {margin-bottom:40px;}
	.brand-list .tit {font-size:26px;}
	.brand-list .box {padding:25px 15px;}
	.brand-list .img-box {width:30%;}
	.brand-list .txt {width:70%; padding-left:20px;}
	.brand-list .txt h3 {font-size:18px; margin-bottom:10px;}
	.brand-list .more {top:8px; line-height:20px; border-radius:10px; padding:0 12px; font-size:13px;}
	/* sub08-01 .greeting */
	.greeting .wrap {flex-direction:column-reverse;}
	.greeting .txt {width:100%;}
	.greeting .img-box {width:100%; max-width:240px; margin: 0 auto 50px;}
	.greeting .img:before {display:none;}
	.greeting .img {margin-bottom:30px; text-align:center;}
/* 	.greeting .img-box p {font-size:16px;}
	.greeting .img-box p span {font-size:18px;} */
	.greeting .img-box p {text-align:left;}
	.greeting .img-box .t1 {margin-bottom: 15px;}
	.greeting .txt h3 {font-size:22px; margin-bottom:22px;}
	.greeting .txt p {margin-bottom:22px;}
	.greeting .txt p strong {font-size:17px;}
	/* doc-tit */
	.doc-tit {font-size:18px; padding-left:26px; padding-bottom:16px; margin-bottom:16px;}
	.doc-tit:before {width:18px; height:18px;}
	/* sub08-02 .introduction */
	.introduction .tit {margin-bottom:30px;}
	.introduction .tit h3 {font-size:22px;  margin-bottom:22px;}
	.introduction .tit p {font-size:16px; margin-bottom:22px;}
	.history {margin-bottom:45px;}
	.history .col .year {width:20%; padding:0 15px; font-size:22px;}
	.history .col .year:before {top:8px;}
	.history .col .year:after {width:8px; height:8px; right:-4px; top:8px;}
	.history .col .txt {padding:0 0 45px 30px;}
	.history .col:last-child .txt {padding:0 0 0 40px;}
	.history .col .txt li .date {margin-right:20px;}
	.abroad .img-box {margin-bottom:16px;}
	.abroad .txt {padding-left:15px;}
	.abroad .tt {margin-top:30px; padding-left:10px;}
	.abroad p strong:before {top:9px;}
	/* sub08-03 .core */
	.core .cnt01 {margin-bottom:60px;}
	.core .cnt01 h3 {font-size:22px; margin-bottom:30px;}
	.core .cnt01 ul {margin-left:-20px;}
	.core .cnt01 li {margin-left:20px;}
	.core .cnt02 .wrap .txt {padding:0 30px 0 0;}
	.core .cnt02 .wrap .txt p {margin-bottom:20px;}
	.core .cnt02 .wrap .txt p br {display:none;}
	/* sub08-04 .contactus */
	.contactus .maps {margin-bottom:40px;}
	.contactus .root_daum_roughmap {height:400px !important;}
	.contactus .root_daum_roughmap .wrap_map {height:400px !important;}
	.contactus dl {line-height:40px;}
	.contactus dl dt {width:100px; padding:0 10px;}
	.contactus dl dt:before {width:3px; height:3px;}

	/* board */
	.input {padding:5px 14px; height:40px;}
	textarea.input {padding:12px 14px;}

	.board-search .search input.input {width:240px;}

	.board-list colgroup col {width:auto !important;}
	.board-list table thead th {font-size:15px;}
	.board-list table tbody td {font-size:15px;}

	.board-prev-next {font-size:14px;}
	.btn-pack.medium {height:40px; padding:0 16px; font-size:15px; line-height:38px;}
	.btn-pack.large {min-width:140px; height:50px; font-size:18px; line-height:48px;}


	/* popup */
	.popup {left:15px; top:60px;}
	.popup .wrap {width:660px; height:840px;}
	.popup .wrap .tit {height:110px;}
	.popup .wrap .txt {margin:35px 0 45px; padding:0 20px 0 35px; max-height:650px;}
	.popup .wrap .txt p {margin-bottom:24px;}
	.popup .wrap .txt p:last-child span {font-size:17px;}
		
	/* footer */
	#footer {padding:30px 0;}
	.foot-group {flex-direction:column; text-align:center;}
	.foot-logo {padding-right:0; width:100px; margin-bottom:30px;}
	.foot-info .tit {font-size:14px;;}
	.foot-info p {font-size:13px;}
	.foot-info p span {margin:0; display:block;}
	
	.scroll-top {bottom:40px; right:15px; width:40px; height:40px;}

} 

/* portrait tablet */
@media (max-width: 900px) {	
	.only-desktop {display:none;}
	.only-tablet {display:block;}
	.greeting .txt p br {display:none;}
	.greeting .txt p span {display:block;}

	/* popup */
	.popup {left:15px; top:100px;}
	.popup .wrap {width:550px; height:697px;}
	.popup .wrap .tit {height:90px;}
	.popup .wrap .txt {margin:30px 0; padding:0 20px; max-height:500px;}


} 

/* 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;}

	/* header */
	.header-wrap {height:60px;}
	.header-wrap .sitelogo a {width:80px;}
	.btn-m-menu {top:21px;}
	/* main */
	.main-visual .item {height:200px;}
	.main-visual .txt {left:65px;}
	.main-visual .txt01 .tt01 {font-size:40px;}
	.main-visual .txt01 .tt02 {font-size:24px;}
	.main-visual .txt .tt1 {margin-bottom:16px;}
	.main-visual .txt .tt1.img01 {width:180px;}
	.main-visual .txt .tt1.img02 {width:130px;}
	.main-visual .txt .tt1.img03 {width:200px;}
	.main-visual .txt .tt2 h3 {font-size:26px;}
	.main-visual .txt .tt2 p {font-size:18px; margin-top:10px;}
	.main-visual .bt-arrow a {width:35px; height:35px;}
	.main-visual .bx-pager {bottom:10px;}
	.main-visual .bx-pager a {width:11px; height:11px;}

	.latout-tit {font-size:18px;}
	.layout-more {top:6px; width:12px; height:12px;}

	.section1 {padding:30px 0;}

	.section1 .wrap {margin-left:0; flex-direction:column; margin-bottom:-30px;}
	.section1 .cnt {padding-left:0; width:100%; margin-bottom:30px;}
	.section1 .cnt h3 {font-size:15px; margin-bottom:8px; padding-bottom:8px;}

	.section2 {padding:30px 0;}
	.section2 ul {margin-left:-15px; justify-content:center; margin-bottom:-20px;}
	.section2 ul li {width:calc(50% - 15px); padding-left:0; margin-left:15px; margin-bottom:20px;}

	/* sub ppage */
	.sub-title {margin:30px 0;}
	.sub-title h2 {font-size:22px;}

	.sub-title .lang li {margin-left:10px;}

	.sub-visual {height:300px; margin-bottom:30px;}
	.sub-visual .txt .tt1 {margin-bottom:12px;}
	.sub-visual .txt .tt2 h3 {font-size:28px;}
	.sub-visual .txt .tt2 p {font-size:18px; margin-top:15px;}
	.sub-visual .txt .tt1.img01 {width:180px;}
	.sub-visual .txt .tt1.img02 {width:130px;}
	.sub-visual .txt .tt1.img03 {width:200px;}

	.lnb {margin:0 auto 30px;}
	.lnb ul li a {line-height:33px; font-size:14px;}

	.real-cont {margin-bottom:60px;}
	/* doc */
	/* sub01 */
	.products .cnt>ul>li {padding:20px 0; flex-direction:column;}
	.products .left-product {width:100%; margin-bottom:20px;}
	.products .left-product p {font-size:14px;}
	.products .left-product .img-box {margin-bottom:6px;}
	.products .info {width:100%; padding-left:0;}
	.products .info h3 {font-size:16px;}
	.products .info .box {padding:15px; max-height:150px;}
	.products .info li:before {width:3px; height:3px; top:10px;}
	/* sub02,03,04 */
	.adi-list li {padding:20px 0;}
	.adi-list .txt {padding-right:20px; width:60%;}
	.adi-list .txt .tt1 {margin-bottom:10px;}
	.adi-list .txt .tt1 h3 {font-size:16px;}
	.adi-list .img-box {width:40%;}
	/* detail */
	.detail .cnt h3 {font-size:16px; padding:10px 0;}
	.detail .cnt .data {padding:8px 0;}
	.detail .cnt .data li {margin-right:6px; padding-right:12px;}
	.detail .cnt .data li:after {height:12px;}
	.detail .cnt .txt {padding:15px 0;}
	.detail .cnt .txt p {margin-bottom:10px;}
	.detail .cnt .tt ul {padding:15px 0;}
	.detail .detail-btn li a {line-height:33px; width:60px;}
	/* sub05,06,07 */
	.brand-list .cnt {margin-bottom:30px;}
	.brand-list .tit {font-size:22px;}
	.brand-list .box {padding:20px 15px;}
	.brand-list .img-box {width:40%;}
	.brand-list .txt {width:60%; padding-left:15px;}
	.brand-list .txt h3 {font-size:16px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
	.brand-list .txt p {height:calc(1.5em * 1 * 3); -webkit-line-clamp:3;}
	/* sub08-01 .greeting */
	.greeting .img-box {margin-bottom:30px;}
	.greeting .img {margin-bottom:20px;}
	.greeting .img-box p {font-size:14px;}
	.greeting .img-box p span {font-size:16px;}
	.greeting .txt h3 {font-size:20px; margin-bottom:16px;}
	.greeting .txt p {margin-bottom:16px;}
	.greeting .txt p strong {font-size:16px;}
	/* doc-tit */
	.doc-tit {font-size:16px; padding-left:20px; padding-bottom:10px; margin-bottom:10px;}
	.doc-tit:before {width:16px; height:16px;}
	/* sub08-02 .introduction */
	.introduction .tit {margin-bottom:18px;}
	.introduction .tit h3 {font-size:20px; margin-bottom:14px;}
	.introduction .tit p {font-size:15px; margin-bottom:14px;}
	.history {margin-bottom:30px;}
	.history .col {flex-direction:column; position:relative;}
	.history .col:before {content:''; width:1px; height:100%; background:#ddd; position:absolute; left:3px; top:8px;}
	.history .col .year {width:100%; padding:0 15px; font-size:20px; margin-bottom:10px;}
	.history .col .year:before {content:'';}
	.history .col .year:after {width:8px; height:8px; right:auto; top:8px; left:0;}
	.history .col .txt {padding:0 0 15px 15px;}
	.history .col .txt li {flex-direction:column;}
	.history .col:last-child .txt {padding:0 0 15px 15px;}
	.history .col .txt li .date {margin-right:20px;}
	.abroad .img-box {margin-bottom:10px;}
	.abroad .txt {padding-left:10px;}
	.abroad .tt {margin-top:20px;}
	/* sub08-03 .core */
	.core .cnt01 {margin-bottom:60px;}
	.core .cnt01 h3 {font-size:22px; margin-bottom:30px;}
	.core .cnt01 ul {margin-left:0; flex-direction:column; align-items:center; margin-bottom:-20px;}
	.core .cnt01 li {margin-left:0; margin-bottom:20px;}
	.core .cnt02 .wrap {flex-direction:column-reverse;}
	.core .cnt02 .wrap .txt {padding:0; width:100%;}
	.core .cnt02 .wrap .txt p {margin-bottom:14px;}
	.core .cnt02 .wrap .img-box {width:100%; margin-bottom:20px;}
	/* sub08-04 .contactus */
	.contactus .maps {margin-bottom:30px;}
	.contactus .root_daum_roughmap {height:300px !important;}
	.contactus .root_daum_roughmap .wrap_map {height:300px !important;}
	.contactus dl {line-height:1.5em; flex-direction:column; padding:5px 0;}
	.contactus dl dt {width:100px; padding:0; margin-bottom:5px;}
	.contactus dl dt:before {width:3px; height:3px;}
	.contactus dl dd {padding-left:9px;}

	/* board */
	.input {font-size:14px; padding:0 10px; height:38px;}
	select.input {padding-right:26px; background-image:url("/images/bbs/select_x2.png"); background-position:right 8px center; background-size:12px auto;}
	textarea.input {padding:7px 10px;}

	.radiobox input:checked + label:before {background-image:url("/images/bbs/radiobox_x2.png"); background-size:8px auto;}
	.checkbox input:checked + label:before {background-image:url("/images/bbs/checkbox_x2.png"); background-size:11px auto;}

	.board-search {display:flex; flex-direction:column; margin-bottom:10px;}
	.board-search .total-page {order:3; float:none; font-size:13px;}
	.board-search .cate {float:none; order:1; margin-left:0; margin-bottom:5px;}
	.board-search .cate .input {display:block; width:100%;}
	.board-search .search {float:none; order:2;}
	.board-search .search form {display:flex;}
	.board-search .search .input {flex:1 1 auto; min-width:0; width:1%;}

	.board-list {display:none;}
	.board-list-m {display:block;}

	.buttons {margin:15px 0;}

	.btn-pack.small {height:26px; padding:0 8px; font-size:11px; line-height:24px;}
	.btn-pack.medium {height:38px; padding:0 14px; font-size:14px; line-height:36px;}
	.btn-pack.large {min-width:120px; height:42px; padding:0 18px; font-size:15px; line-height:40px;}
	.btn-pack.xlarge {min-width:120px; height:50px; padding:0 22px; font-size:16px; line-height:48px;}
	.btn-pack.comment {width:80px; height:32px; font-size:14px;}

	.paginate {margin-top:20px;}
	.paginate a,  
	.paginate strong{margin:0 1px;width:30px;height:30px;font-size:14px;line-height:30px;}  
	.paginate a.direction {margin:0; background-size:11px;}
	.paginate a.direction.first {background-image:url("/images/bbs/btn_first_x2.png");}
	.paginate a.direction.prev {background-image:url("/images/bbs/btn_prev_x2.png"); margin-right:14px;}
	.paginate a.direction.next {background-image:url("/images/bbs/btn_next_x2.png"); margin-left:14px;}
	.paginate a.direction.last {background-image:url("/images/bbs/btn_last_x2.png");}

	/* popup */
	.popup {left:15px; top:100px;}
	.popup .wrap {width:380px; height:481px;}
	.popup .wrap .tit {height:60px; width:220px; margin:0 auto;}
	.popup .wrap .txt {margin:15px 0; padding:0 15px; max-height:350px;}
	.popup .wrap .txt p {margin-bottom:16px;}
	.popup .wrap .txt p:last-child span {font-size:16px;}

	
	/* footer */
	#footer {padding:15px 0;}
	.foot-logo {width:80px; margin-bottom:15px;}
	.foot-info .tit {font-size:13px;}
	.foot-info p {font-size:12px;}
	
	.scroll-top {bottom:30px; width:35px; height:35px;}


} 

/* Landscape phones and down */
@media (max-width: 400px) {
	.mobile-navigation {width:80%;}

	.main-visual .item {height:160px;}

	.main-visual .bt-arrow a {width:30px; height:30px;}
	.main-visual .txt {width:100%; left:0; text-align:center; padding:50px;}
	.main-visual .txt .tt2 p {line-height:1.5em; font-size:16px; margin-top:10px;}

	.main-visual .txt01 .tt01 {font-size:30px; margin-bottom:8px;}
	.main-visual .txt01 .tt02 {font-size:20px;}
	.main-visual .txt .tt1 {margin-bottom:8px;}
	.main-visual .txt .tt1.img01 {width:130px;}
	.main-visual .txt .tt1.img02 {width:90px;}
	.main-visual .txt .tt1.img03 {width:160px;}
	.main-visual .txt .tt2 h3 {font-size:20px;}
	.main-visual .txt .tt2 p {font-size:15px; margin-top:6px;}





	.section2 ul li {width:100%;}

	.lnb ul li {width:auto !important;}
	.lnb ul li a {line-height:33px; font-size:14px; white-space:nowrap; padding:0 25px;}
	
	.sub-title.about {padding-bottom:30px;}
	.sub-title .lang {top:auto; transform:translateX(-50%); left:50%; bottom:0;}
	.sub-title .lang ul {justify-content:center;}
	
	.core .cnt01 h3 br {display:none;}
	.contactus dl dd span {display:block;}

	.adi-list li a {flex-direction:column-reverse;}
	.adi-list .txt {width:100%;}
	.adi-list .img-box {width:100%; margin-bottom:20px;}

	.brand-list .box {padding:15px 0; flex-direction:column;}
	.brand-list .box .img-box {width:100%; margin-bottom:20px;}
	.brand-list .box .txt {width:100%;}


	/* popup */
	.popup {left:15px; top:100px;}
	.popup .wrap {width:300px; height:378px;}
	.popup .wrap .tit {height:50px; width:180px; margin:0 auto;}
	.popup .wrap .txt {max-height:275px;}
	.popup .wrap .txt p {margin-bottom:10px;}
	.popup .wrap .txt p:last-child span {font-size:14px;}
	.popup .close {width:30px; height:30px; right:0;}
}