/*===============================================================*/
/*======================= Mobile 640 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:640px){
.pct {display:none !important;}
.tablet {display:none !important;}
.mobile {display:block !important;}
img.tablet_img {display:none;}
img.pct_img {display:none;}
img.mobile_img {display:block;}
table.mobile {display:table;}

/* header */
#header,
#header.scroll {height: 60px;}
#header h1,
#header.scroll h1 {width: 165px; margin-top: 22px;}
#header h1 a {height: 17.6px;}

/* quick */
#quick {width: 45px;}

/* allmenu */
#header .btn_menu {width: 25px; height: 20px; margin-top: 20px;}

#allmenu .btn_menu_close {top: 20px; width: 24px;}
#allmenu .language {top: 14px;}
#allmenu .language a {margin-left: 12px; font-size: 16px; line-height: 35px;}
#allmenu .language a.on:after {height: 3px;}

#allmenu .allmenu_wrap .allmenu_con dl {margin-top: 25px;}
#allmenu .allmenu_wrap .allmenu_con dl dt {font-size: 24px;}
#allmenu .allmenu_wrap .allmenu_con dl dt span:after {height: 3px;}
#allmenu .allmenu_wrap .allmenu_con dl dd ul {margin-top: 5px;}
#allmenu .allmenu_wrap .allmenu_con dl dd li {font-size: 15px;}

/*main contents*/
#mainVisual .mainTxt p {font-size: 8.5vw;}
#mainVisual .mainTxt span {padding-top: 6%; font-size: 4.5vw;}
#mainVisual .mainSlider .slick-dots {bottom: 35px;}
.icon_scroll span {padding-top: 35px; background-image: url('/images/main/icon_scroll_m.png'); background-size: 14px;}

.main_section {padding: 18% 0;}

.main_titleArea {margin-bottom: 8%;}
.main_titleArea > b {margin-bottom: 8%; padding-left: 40px; font-size: 12px;}
.main_titleArea > b:before {width: 30px;}
.main_titleArea h2 {font-size: 32px;}
.main_titleArea h2.kor {font-size: 30px;}
.main_titleArea p {padding-top: 4%; font-size: 17px;}
.main_titleArea > span {padding-top: 4%; font-size: 12px;}

.main_prd .prdThumbSlider img {width: 100%;}
.main_prd .prdCon {margin-top: 10%;}
.main_prd .prdSlider .list .TxtArea .prd_logo {width: 100px; padding-bottom: 4%;}
.main_prd .prdSlider .list .TxtArea p {font-size: 14px; line-height: 20px;}
.main_prd .prdSlider .list .TxtArea .btn_more01 {margin-top: 8%;}
.main_prd .prd_arrows { position:absolute; top:310px; right:20px;}
/* .main_prd .prd_arrows {margin-top: 12%;} */
.prd_arrows .slick-arrow {width: 42px; height: 42px;}

.main_company_bg {height: 50vw; background-image: url('/images/main/company_bg_m.jpg'); background-size: cover;}

.main_about .main_titleArea {margin-bottom: 10%;}
.main_about .TXtArea .counterArea li {margin-left: 10%;}
.main_about .TXtArea .counterArea li:first-child {width: 80px;}
.main_about .TXtArea .counterArea li .counter {font-size: 70px;}
.main_about .TXtArea .counterArea li span {padding-top: 25px;}
.main_about .ImgArea {margin-top: 12%;}

.main_line_banner .btn_area {margin-top: 8%;}

.main_global .main_titleArea {margin-bottom: 8%;}

.main_thumb_slide .slick-slide {padding-bottom: 0;}
.main_thumb_slide .list:hover {-webkit-box-shadow: none; -moz-box-shadow:none; box-shadow:none;}
.main_thumb_slide .list .TxtArea {padding: 10%;}
.main_thumb_slide .list .TxtArea .title {margin-bottom: 6%; font-size: 15px;}
.main_thumb_slide .list .TxtArea p { height: 32px;font-size: 13px; line-height: 16px;}
.main_thumb_slide .prd_arrows .slick-arrow {margin-top: 0; transform:translateY(-50%);}

.main_certifi:after {width: 600px; height: 85px; background-position: center top; background-size: 100%;}
.main_certifi .list .ImgArea {padding:0 16px;}
.main_certifi .list img {height:180px;}
.main_certifi .slick-slide:nth-child(2n) img {height:140px;}
.main_certifi .slick-slide:nth-child(3n) img {height:110px;}

.main_contact .TxtArea {padding: 15% 4%; background-image: url('/images/main/contact_bg_m.jpg');}
.main_contact .TxtArea .main_titleArea {margin-bottom: 5%;}
.main_contact .TxtArea .contact_info ul {margin-top: 2%;}
.main_contact .TxtArea .contact_info ul li {margin-right: 10%; font-size: 13px;}
.main_contact .TxtArea .contact_info ul li.tel {padding-left: 22px; background-size: 14px; background-image: url('/images/main/icon_tel_m.png'); background-position: 0 80%;}
.main_contact .TxtArea .contact_info ul li.mail {padding-left: 22px; background-size: 14px; background-image: url('/images/main/icon_mail_m.png');}
.main_contact .TxtArea .contact_info .btn_area {margin-top: 8%;}
.main_contact .TxtArea .contact_info .btn_area a {width: 140px; height: 40px; line-height: 38px; margin-right: 4%; font-size: 13px;}
.main_contact .TxtArea .contact_info .btn_area a span.in {padding-left: 22px; background-size: 14px; background-image: url('/images/main/icon_inquiry_m.png');}
.main_contact .TxtArea .contact_info .btn_area a span.lo {padding-left: 20px; background-size: 12px; background-image: url('/images/main/icon_location_m.png');}
.main_contact .MapArea .root_daum_roughmap_landing {height: 80vw !important;}

/* 서브비주얼 */
#subVisual {height: 340px; background-image: url('/images/common/subvisual_01_m.jpg');}
#subVisual .tb {padding-top: 20px;}
#subVisual .subv-title h2 {font-size: 35px;}
#subVisual .subv-title p {padding-top: 5%; font-size: 16px; line-height: 1.2;}

/*sub navigation bar*/
#SNB {height: 50px;}
.SNBWrap {line-height: 50px;}
.SNBWrap .home {width: 55px; height: 50px;}
.SNBWrap .home a {background-image:url('/images/common/icon/icon_home_m.png'); background-size:14px;}
.SNBWrap .depth {width: calc((100% - 55px)/2);}
.SNBWrap .depth span {padding-right: 15px; margin: 0 12px; background-image: url('/images/common/icon/snb_arrow_m.png'); background-size:8px; font-size: 14px;}
.SNBWrap .depth ul {top: 50px;}
.SNBWrap .depth ul li {margin-top: 15px; line-height: 18px;}
.SNBWrap .depth ul li:first-child {margin-top: 0;}
.SNBWrap .depth ul li a {padding: 0 12px;}

.lnk-btn {
	position: absolute; bottom:80px;left:50%;margin: 0 0 0 -100px;
	display: inline-block;width: 140px;height: 40px;border: 1px solid #0b5ea0;
	background: #fff;font-family: 'Oswald', sans-serif;font-size: 13px;font-weight: 500;text-align: center;
	color: #0b5ea0;line-height: 36px;box-sizing: border-box;
}

/*sub contents*/
.contentsArea {padding: 18% 0 22%;}

.contentsArea .TitleArea {padding-bottom: 8%;}
.contentsArea .TitleArea h3 {font-size: 32px;}
.contentsArea .TitleArea h3 b {font-size: 18px;}

.contentsArea .section {margin-top: 18%;}

/* Tab Style */
.TabType01 {margin-bottom: 15%;}
.TabType01 ul {margin-top: -20px;}
.TabType01 ul li {padding-bottom: 6px; margin: 20px 20px 0 !important; font-size: 14px;}
.TabType01 ul li.on:after {height: 2px;}

/* 인사말 */
.Greeting .ImgArea {margin-bottom: 8%;}
.Greeting .greeting_con {font-size: 14px;}
.Greeting .greeting_con strong {padding-bottom: 6%; font-size: 20px;}
.Greeting .greeting_con p {padding-top: 4%;}
.Greeting .greeting_con .ceo b {font-size: 20px;}

/* 회사소개 */
.Introduction .inner {padding-top: 18%; padding-bottom: 22%; background-size:90%;}
.Introduction ul {display: block; flex-wrap:inherit;}
.Introduction ul li {display: block; width: 100%; padding: 0; margin-left: 0; margin-top: 4%;}
.Introduction ul li:first-child {margin-top: 0;}
.Introduction ul li div {padding: 20px 4%; text-align: left;}
.Introduction ul li img {display: inline-block; width: 30px; margin-bottom: 0; vertical-align: middle;}
.Introduction ul li p {display: inline-block; width: calc(100% - 34px); padding-left: 3%; vertical-align: middle; box-sizing: border-box;}
.Introduction ul li strong {padding-bottom: 4px; font-size: 17px;}
.Introduction ul li span {font-size: 13px;}
.Introduction ul li span br {display: none;}

/* 경영이념과 핵심가치 */
.Management .philosophy {padding: 10% 6%; background-image: url('/images/company/philosophy_img_m.jpg');}
.Management .philosophy p {font-size: 20px;}

.Management .value ul {width: 100%;}
.Management .value ul li {width: 140px; padding-left: calc(100% - 280px); margin-top: 40px;}
.Management .value ul li:before,
.Management .value ul li:after {top: 70px !important;}
.Management .value ul li b {font-size: 18px;}
.Management .value ul li p {font-size: 14px;}

/* 연혁 */
.History .historySlider .ThumbArea {padding: 50px 0;}
.History .historySlider .ThumbArea span {font-size: 22px;}
.History .historySlider .ThumbArea b {padding-top: 10px; font-size: 35px;}
.History .histsory_arrows a {top: 74px; width: 14px; height: 26px;}

.History .historySlider .history_list {padding: 45px 0 22%;}
.History .historySlider .history_list:after {left: 71px;}
.History .historySlider .history_list .cols {font-size: 14px;}
.History .historySlider .history_list .cols:last-child {padding-top: 25px;}
.History .historySlider .history_list .cols dl {margin-top: 30px;}
.History .historySlider .history_list .cols dl dt {width: 70px;}
.History .historySlider .history_list .cols dl dt:after {right: -5px; width: 8px; height: 8px;}
.History .historySlider .history_list .cols dl dd {width: calc(100% - 70px); padding-left: 25px;}
.History .historySlider .history_list .cols dl dd p {padding-top: 10px;}

/* 오시는길 */
.Location .root_daum_roughmap .wrap_map {height: 80vw !important;}
.Location .location_info ul {margin-top: 20px;}
.Location .location_info ul li {margin-right: 30px; padding-left: 28px; background-size: 22px !important; line-height: 22px;}
.Location .location_info ul li.address {background-image: url('/images/company/icon_address_m.png');}
.Location .location_info ul li.tel {background-image: url('/images/company/icon_tel_m.png');}
.Location .location_info ul li.fax {background-image: url('/images/company/icon_fax_m.png');}
.Location .location_info ul li.mail {background-image: url('/images/company/icon_mail_m.png');}

/* 제품 리스트 */
#subVisual.subVsal02.list {padding-bottom: 18%; background-image: url('/images/common/subvisual_prd_m.jpg');}
#subVisual .visual_slider_wrap {padding-top: 80px;}
#subVisual .prdThumbSlider img {width: 100%;}
#subVisual .prdCon {margin-top: 8%;}
#subVisual .prdSlider .TxtArea .category {margin-bottom: 6%; font-size: 32px;}
#subVisual .prdSlider .TxtArea img {margin-bottom: 4%;}
#subVisual .prdSlider .TxtArea p {font-size: 14px; line-height: 20px;}
#subVisual .progressBarContainer ul li {margin-left: 15px;}
#subVisual .progressBarContainer ul li b {font-size: 12px;}
#subVisual .progressBarContainer ul li .progressBar {margin-top: -2px;}
#subVisual .progressBarContainer ul li.on .progressBar {width: 45px; margin-left: 3px;}

.prdInfo {margin: 10% 0;}
.prdInfo .TxtArea {padding: 10% 8%;}
.prdInfo .TxtArea img {width: 180px;}
.prdInfo .TxtArea p {padding-top: 6%; font-size: 16px;}
.prdInfo .TxtArea p br {display: none;}

/*개인정보 / 이용약관*/
.rule-txt-area textarea { height:350px;	}

/* footer */
#foot {padding: 8% 0; font-size: 11px; line-height: 1.6;}
#foot address span {margin-right: 10px;}
#foot .copy {font-size: 9px;}
#foot .copy img {width: 6px;}

/* 관리자 로그인 */
div#box {width:90%; left:5%; padding:6% 5%; margin-bottom:-50%; border-width:3px; margin-left:0; box-sizing:border-box;}
div#p_input span.label {width:24%; font-size:3.4vw;}
div#box .login_center {padding:6% 0;}
div.login_foot {margin-top:6%;}
.divbox .text {width:50%;}

}

/*===============================================================*/
/*======================= Mobile 380 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:380px){

/* Tab Style */
.TabType01 ul li {font-size: 3.5vw;}

}

/*===============================================================*/
/*======================= Mobile 350 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:360px){

/* quick */
#quick {width: 45px;}

/* 경영이념과 핵심가치 */
.Management .value ul li {width: 130px; padding-left: calc(100% - 260px);}
.Management .value ul li:before,
.Management .value ul li:after {top: 65px;}

}

/*===============================================================*/
/*======================= Mobile 320 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:320px){

/* quick */
#quick {width: 40px;}

/*main contents*/
.main_titleArea h2 {font-size: 28px;}
.main_titleArea h2.kor {font-size: 26px;}

.main_contact .TxtArea .contact_info .btn_area a {width: 130px; height: 38px; line-height: 36px; font-size: 12px;}
.main_contact .TxtArea .contact_info .btn_area a span.in {padding-left: 20px; background-size: 12px;}
.main_contact .TxtArea .contact_info .btn_area a span.lo {padding-left: 18px; background-size: 10px;}

/* 서브비주얼 */
#subVisual {height: 300px;}
#subVisual .subv-title h2 {font-size: 30px;}
#subVisual .subv-title p {font-size: 15px;}

/*sub contents*/
.contentsArea .TitleArea h3 {font-size: 28px;}
.contentsArea .TitleArea h3 b {font-size: 16px;}

/* 연혁 */
.History .historySlider .ThumbArea span {font-size: 22px;}
.History .historySlider .ThumbArea b {padding-top: 5px; font-size: 32px;}

/* 제품 리스트 */
#subVisual .prdSlider .TxtArea .category {font-size: 28px;}

}