@charset "utf-8";
@import url(media_sub.css);

/**** Media Query *********************************/

@media (max-width:1600px){
	.hd_sub {padding: 0 20px;}
	.twrap > .txt_v {padding-top: 21.5%;}
	.main_wrap {height: 45vw !important}
}

@media (max-width:1400px){
	.header .gnb {padding-left: 2%;}

}

@media (max-width:1280px){
	.main_portfolio .owl-carousel .owl-nav button.owl-prev {left: 0; z-index: 999999;}
	.main_portfolio .owl-carousel .owl-nav button.owl-next {right: 0; z-index: 999999;}
	.main_portfolio .owl-nav.disabled{display: none;}

}

@media (max-width:1200px){
	.header .hd_logo{width: 18%;}
	.hd_logo > a {background-size: 100%;	}
	.header .gnb > li {margin-right: 5.5%;}
	.header .gnb > li > a {font-size: 16px;}
	.header .gnb {padding-left: 6.5%;}
	.header .gnb > li:first-child > ul { left: -51%;}
	.header .gnb > li > ul > li > a {font-size: 14px;}
	.m_notice,
	.main_portfolio,
	.main_design {box-sizing: border-box; padding: 0 20px;}
	

}

@media (max-width:1060px){
	.header .gnb {padding-left: 3.5%;}
	.header .hd_logo {width: 16%;}
	.h_r_icon ul li {width: 56px; padding-right: 10px;}
	.h_r_icon ul li a {font-size: 12px;}
	
}


@media (max-width:800px){
	.quick_ban .center_list{display: none;}
	.header{display: none;}
	#m_header_box{display: block; position: fixed; left: 0; top: 0; background: #fff; z-index: 99999999999999; height: 70px;}
	.quick_ban {margin-top: 80%; display: none;	}
	#wrap{margin-top: 70px;}
	.main_wrap ul li ul li img {margin-top: 0;}
	.main_wrap .bx_visu > li.fir_m_visu ul li img,
	.main_wrap .bx_visu > li.fir_m_visu.on ul li img{width: 100% !important; max-width:100% !important;}
	
	.twrap > .txt_v {padding-top: 11.5%;}
	.twrap > .txt_v.on h4{transform: scale(.6);}
	.twrap > .txt_v h4 {transform: scale(.8);}
	.twrap > .txt_v p {font-size: 25px; line-height: 25px;}
	.twrap > .txt_v4 {padding-top: 6%;}
	.twrap > .txt_v4 h4{transform: scale(1.2);}
	.twrap > .txt_v4.on h4{transform: scale(1);}
	.twrap > .txt_v2 {padding-top: 12%;}
	.twrap > .txt_v2 .p_box span {font-size: 14px;margin-right: 4px;}
	.twrap > .txt_v2 .p_box span:after {right: 2px;}
	.twrap > .txt_v2 .p_box {margin-bottom: 0px;}
	.twrap > .txt_v2  p {font-size: 18px;line-height: 20px; }
	.twrap > .txt_v2 h4 {margin-bottom: 9px;}
	.main_wrap ul li:nth-child(2) ul li img {margin-top: 0 !Important;}
	.main_wrap .bx-wrapper .bx-pager {bottom: 40px; top:auto; margin-left: -65px;}
	.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item {margin-bottom: 0;}
	.main_wrap .bx_visu > li.fir_m_visu .twrap > .txt_v p {font-size: 21px;line-height: 21px;}
	.twrap > .txt_v4 {padding-top: 5%;}
	.m_notice_wrap .bx-wrapper {width: 86.23%;box-sizing: border-box;padding-left: 30px;}
	
	.md_content ul li{width: 32.666%; margin-right: 1%;}
	.md_content ul li:nth-child(3n+3){margin-right: 0;}

	.m_bn_wrap .m_bn > ul > li:first-child {width: 100%; padding-right: 0;}
	.m_bn_wrap .m_bn > ul > li:nth-child(2),
	.m_bn_wrap .m_bn > ul > li:nth-child(3),
	.m_bn_wrap .m_bn > ul > li:nth-child(4){width: 33.333%;}
	.ft_sub {padding-left: 0;}
	.ft_sub:before {display: none;}
	.footer {padding: 30px 20px; height: auto;}
	.ft_sub:after {display: none;}
	.m_notice_wrap{z-index: 10000;}
}

@media (max-width:640px){
	.m_header_nav {width: 74%;}

}

@media (max-width:440px){
	.mh_icon dd {width: 32%;}
	.mh_icon dd img{width: 50%;}
	.main_wrap .bx_visu > li.fir_m_visu ul li img, .main_wrap .bx_visu > li.fir_m_visu.on ul li img,
	.main_wrap .bx_visu > li > ul > li img {width: 150% !important;max-width: 150% !important; margin-left: -25%;}
	.main_wrap {height: 65vw !important;}
	.twrap > .txt_v {padding-top: 16.5%;}
	.main_wrap .bx_visu > li.fir_m_visu .twrap > .txt_v p {font-size: 4.2vw; line-height: 1.7em; -ms-word-break: keep-all; word-break: keep-all; padding: 0px 10%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}
	.twrap > .txt_v.on h4 {transform: scale(0.8); margin-bottom: 0;}
	.main_wrap ul li:nth-child(2) ul li img {width: 150%; max-width:150%; margin-left: -25%;}
	.main_wrap .bx-wrapper .bx-pager {bottom: 45px; top:auto; margin-left: -65px;}
	.twrap > .txt_v2 .p_box span {font-size: 12px;margin-right: -5px;}
	.twrap > .txt_v2 h4 {margin: 0.5em auto !Important;}
	.twrap > .txt_v2 p {font-size: 4vw; line-height: 1.7em;}
	.twrap > .txt_v2 {padding-top: 10%;}
	.twrap > .txt_v3 {padding-top: 20%;}
	.twrap > .txt_v3 p {font-size: 4.5vw; line-height: 1.7em;}
	.twrap > .txt_v4.on h4{transform:scale(1.3) !important}
	.twrap > .txt_v2 {padding-top: 15%;}
	.m_notice_wrap {height: 65px;}
	.m_notice_wrap .left_noti h4 {font-size: 14px;line-height: 65px;}
	.m_notice_wrap .bx-controls-direction {height: 65px;}
	.m_notice_wrap .bx-wrapper .bx-prev {top: 28px;}
	.m_notice_wrap .bx-wrapper .bx-next {bottom: 10px;}
	.m_notice_wrap .bx-controls-direction:after {bottom: 32px;}
	.bx_noti li a {line-height: 65px;}
	.bx_noti li span {width: 30%;}
	.m_notice_wrap .left_noti h4:after {left: 49px;  background-size: 80%;}
	.m_notice {padding: 0px 10px;}
	.m_notice_wrap .left_noti h4:after {left: 65px;margin-top: -14px;}
	.bx_noti li p {box-sizing: border-box;padding-left: 20px;}
	
	.md_content ul li{width: 49%; margin-right: 2%;}
	.md_content ul li:nth-child(3n+3) {margin-right: 2%;}
	.md_content ul li:nth-child(2n+2){margin-right: 0;}
	.mdesign .md_cate li {height: 45px;font-size: 2.8vw; line-height: 45px;}
	.main_title {font-size: 6vw;}
	.content_view {width: 95%; height: auto !important; margin-left: 2.5%;} 
	.m_bn_wrap .m_bn > ul > li:nth-child(2), .m_bn_wrap .m_bn > ul > li:nth-child(3), .m_bn_wrap .m_bn > ul > li:nth-child(4) {width: 100%; float: none;}
	.m_bn_wrap .m_bn > ul > li{float: none; padding-left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box; margin-bottom: 20px; border: 1px solid #dbdbdb;}
	.m_bn_wrap .m_bn > ul > li:nth-child(2,
	.m_bn_wrap .m_bn > ul > li:nth-child(3)) {padding-left: 15px;padding-top: 15px;}
	.m_notice {padding: 0;}
	.m_notice_wrap{padding: 0 10px; box-sizing: border-box;} 
	.m_bn{box-sizing: border-box; padding: 0 20px;}
	.m_bn_wrap .m_bn > ul > li:nth-child(3) {background-position: center right;}
	.m_bn_wrap .m_bn > ul > li:nth-child(4) {background: url(../../images/main/mb_lib3.png) center -28px no-repeat;background-size: 100%;box-sizing: border-box;}
	.m_bn_wrap .m_bn > ul > li h4 {font-size: 6vw;}
	.ft_menu{padding-top: 45px;}
	.ft_r_box{width: 115px; right: auto; left: 50%; margin-left: -57px; padding-bottom: 10px;}
	.ft_menu > li {min-width:80px; margin-right: 2px;}
	.ft_menu > li > a {font-size: 3.2vw; padding: 0 3px;}
	.ft_copy span {font-size: 3.2vw; line-height: 1.7em; -ms-word-break: keep-all; word-break: keep-all;}
	.md_content ul li img {height: auto;}
	#mb_login .login_btn > a{width: 47% !important;}
	.login_btn_sns ul li a span{font-size: 3.5vw !important;}
}