@charset "UTF-8";

/* 1200px, 1024px, 768px, 600px, 480px */

/* ============== 공통 ============== */
/* 768px */
@media all and (max-width:768px){
html { font-size:9px; }
}


/* ============== 메인 ============== */
/* 1200px */
@media all and (max-width:1200px){
section { padding:20px; }
/* Contact */
.contact .container .contactUs ul li img { width:110px; }
}

/* 1024px */
@media all and (max-width:1024px){
/* 모바일메뉴 */
header { display:none; }
.mobileMenuWrap { display:block; }
.mobileHistory { display:block; }
.visualArea { height:423px; }
.visualArea .visualImg { height:423px; }
.visualArea .visualImg img { height:423px; }
.sec01 .container ul li { margin-right:0; padding:0 10px; width:33.333% }
.sec01 .container ul li img { width:140px; }
.sec01 .container ul li:last-child img { width:125px; }
.sec03 .container ul li { margin-right:0; width:25%; }
}

/* 950px */
@media all and (max-width:950px){
.sec02 .container .portfolio .potfolList { margin-right:2%; width:49% }
.sec02 .container .portfolio .potfolList:nth-of-type(2n) { margin-right:0; }
.sec02 .container .portfolio .potfolList:nth-of-type(3n) { margin-right:2%; }
.sec02 .container .portfolio .potfolList:last-child { margin-right:0; }
.sec02 .container .portfolio .potfolList .thumbnail { max-width:100%; max-height:398px; }
}

/* 768px */
@media all and (max-width:768px){
.visualArea .visualTxt #cursor { height:34px; }
.sec04 .container .mapWrap .mainMap { float:none; width:100% }
.sec04 .container .mapWrap .mainContact { float:none; margin-top:20px; top:0; width:100%; text-align:center; }
.sec01 .container ul li { float:none; padding:20px 10px; width:100%; }
.sec03 .container ul li { float:none; width:100%; }
footer { padding-top:0; }
footer .container { display:none; }
}

/* 640px or 600px*/
@media all and (max-width:640px){
.visualArea { height:350px; }
.visualArea:before { padding-top:54.9% }
.visualArea .visualImg { height:350px; }
.visualArea .visualImg img { height:350px; }
.visualArea .visualTxt { left:50%; margin-left:-156px; max-width:312px; min-width:300px; }
.visualArea .visualTxt p { font-size:3rem; text-align:center; }
.visualArea .visualTxt p:first-child { text-align:center; }
.visualArea .visualTxt p:last-child { margin-top:23px; padding-left:0; text-align:center; }
.visualArea .visualTxt p:last-child:before { top:-15px; left:50%; margin-left:-25px; height:3px; }
.visualArea .visualTxt p.afo:last-child { padding-left:0; }
.visualArea .visualTxt p.afo:last-child:before { display:none; }
.visualArea .visualTxt #cursor { height:24px; }

.sec02 .container .portfolio .potfolList { float:none; margin-right:0; width:100%; }
}

/* 480px */
@media all and (max-width:480px){
.visualArea .visualTxt { margin-top:-110px; }
.mobileMenu .menuWrap { margin-left:20%; }
}

/* 360px */
@media all and (max-width:360px){
html { font-size:9px; }
.visualArea { height:280px; }
.visualArea:before { padding-top:77.9% }
.visualArea .visualTxt { margin-left:-141px; width:282px;  }
.visualArea .visualImg { height:280px; }
.visualArea .visualImg img { height:280px; }
.scrollDown { margin-left:-15px; }
.scrollDown .mouseWrap { width:30px; height:50px; }
}

/* 350px */
@media all and (max-width:350px){
.sec04 .mapList { margin-top:0; }
.sec04 .mapList ul li { float:none; margin-top:10px; width:100%; }
.sec04 .mapList ul li:first-child { margin-top:0; }
.sec04 .mapList ul li a { width:100%; max-width:170px; }
}



/* ============== Company ============== */

/* 1215px */

.history .historyRow .hisoryTxt ul li:after { right:596.5px; }


/* 1200px */
@media all and (max-width:1200px){
.history .historyRow .hisoryTxt ul li { line-height:25px; clear:both; }
.history .historyRow .hisoryTxt ul li:before { top:10px; right:101%; }
.history .historyRow .hisoryTxt ul li:after { right:113% }
.history .historyRow .hisoryTxt ul li.right:after { right:-14.3%; }
.history .historyRow .hisoryTxt ul li span {  width:80%; }
.history .historyRow .hisoryTxt ul li.right span {  width:80%; }
.history .historyRow .hisoryTxt ul li span:first-child { margin-right:0; }
.history .historyRow .hisoryTxt ul li b.bizTit.highlight:after { bottom:2px;  }


}

/* 1152px */
@media all and (max-width:1152px){
}

/* 1024px */
@media all and (max-width:1024px){
.subNav .desktopNav { display:none; }
.mobileNav { display:block; }

.history .deskHistory { display:none; }

}


/* 950px */
@media all and (max-width:950px){
.subTit { max-height:350px; min-height:350px; }
}

/* 768px */
@media all and (max-width:768px){
.mobileHistory .historyRow2 .client { float:left; display:block; margin-right:3px; width:52px; color:#0593ff; }
.mobileHistory .historyRow2 .hisoryTxt ul li b.bizTit.highlight { display:inline-block; }
.mobileHistory .historyRow2 .hisoryTxt ul li b.bizTit.highlight:after { bottom:2px; }
.mobileHistory .historyRow2 .hisoryTxt ul li span:first-child { margin-right:0; }
}

/* 640px or 600px*/
@media all and (max-width:640px){
.subTit { max-height:250px; min-height:250px;  }
.ci .container .ciBox div.floatL { float:none; width:100%; }
.ci .container .ciBox div.floatR { float:none; margin-top:20px; width:100%; }
}

@media all and (max-width:480px){
.map .container .trafficInfo > div.floatL { float:none; width:100%; }
.mobileHistory .historyRow2 .hisoryTxt ul li span:first-child { width:32px;}
.mobileHistory .historyRow2 .client { margin-right:2px; }

}


/* ============== Business ============== */

/* 1200px */
@media all and (max-width:1200px){
/* Characteristics */
.welfare.character .welfareRow { height:232px; }
}

/* 1152px */
@media all and (max-width:1152px){
/* Characteristics */
.welfare.character .welfareRow { height:242px; }
}

/* 1024px */
@media all and (max-width:1024px){

}


/* 950px */
@media all and (max-width:950px){
.fieldBiz .fieldBizImg img { width:200px; }
.si, .db { display:none; }
.siMobile, .dbMobile  { display:block; }
.siMobile .bizDiv h2 { float:none; width:100%; }
.siMobile .bizDiv .bizTxt { float:none; padding:0; width:100%; text-align:center; border-top:none; }
.bizDiv h2 { float:none; width:100%; }
.bizDiv .bizTxt { float:none; padding:0; width:100%; text-align:center; border-top:none; }

/* Characteristics */
.welfare.character .welfareRow { height:242px; }

/* Reference */
.referWrap .container .portfolio .potfolList { margin-top:0; margin-bottom:72px; margin-right:2%; width:49%; height:100%; }
.referWrap .container .portfolio .potfolList:nth-of-type(2n) { margin-right:0; }
.referWrap .container .portfolio .potfolList:nth-of-type(2n+1) { margin-right:2%; }
.referWrap .container .portfolio .potfolList .thumbnail { max-width:100%; max-height:398px; }
.referWrap .container .portfolio .potfolList .serviceName { margin-top:15px; position:initial; }
.referWrap .container .portfolio .potfolList .serviceName2 { margin-top:15px; position:initial; }
}

/* 800px */
@media all and (max-width:800px){
/* Characteristics */
.welfare.character .welfareRow { height:272px; }
}

/* 768px */
@media all and (max-width:768px){
.bizDiv h2 { height:250px; }
.bizDiv .subH2 img { width:150px; }

/* Characteristics */
.welfare.character .welfareRow { height:inherit; }
}

/* 640px or 600px*/
@media all and (max-width:640px){
.fieldBiz > div:first-child, .fieldBiz > div:last-child { display:none; }
.fieldBiz .fieldBizImg { float:none; width:100%; }
.fieldBiz .fieldBizImg img { width:250px; }
.fieldBiz .fieldBizImg > p { display:none; }
/* Reference */
.referWrap .container .portfolio .potfolList { margin-right:0; width:100%; }
}

@media all and (max-width:480px){

}

/* ============== Portfolio ============== */

/* 1200px */
@media all and (max-width:1200px){

}

/* 1152px */
@media all and (max-width:1152px){

}

/* 1024px */
@media all and (max-width:1024px){

}


/* 950px */
@media all and (max-width:950px){
.pofolIntroduce .container .portfolio .potfolList { margin-top:0; margin-bottom:72px; margin-right:2%; width:49%; height:100%; }
.pofolIntroduce .container .portfolio .potfolList:nth-of-type(2n) { margin-right:0; }
.pofolIntroduce .container .portfolio .potfolList:nth-of-type(2n+1) { margin-right:2%; }
.pofolIntroduce .container .portfolio .potfolList .thumbnail { max-width:100%; max-height:398px; }
.pofolIntroduce .container .portfolio .potfolList .serviceName { margin-top:15px; position:initial; }
.pofolIntroduce .container .portfolio .potfolList .serviceName2 { margin-top:15px; position:initial; }
}

/* 768px */
@media all and (max-width:768px){

}

/* 640px or 600px*/
@media all and (max-width:640px){
.pofolIntroduce .container .portfolio .potfolList { margin-right:0; width:100%; }
}

@media all and (max-width:480px){

}


/* ============== Recruit ============== */

/* 1200px */
@media all and (max-width:1200px){

}

/* 1152px */
@media all and (max-width:1152px){

}

/* 1024px */
@media all and (max-width:1024px){
.welfare .welfareRow > div .inline:first-child { width:38%; }
.welfare .welfareRow > div .inline:last-child { width:60% }
}


/* 950px */
@media all and (max-width:950px){
.talent .container ul li { margin-right:2%; width:49%; }
.talent .container ul li:nth-of-type(2n) { margin-right:0; }
}

/* 900px */
@media all and (max-width:900px){
.recruit .container .stepList li { width:33%; }
.recruit .container .stepList li:nth-of-type(4):after { display:none; }

}

/* 768px */
@media all and (max-width:768px){
.talent .container ul li { margin-right:0; width:100%; }
.welfare .welfareRow > div { float:none; width:100%; }
.recruit .container .numList { padding-left:50px; }
}

/* 640px or 600px*/
@media all and (max-width:640px){
.welfare .welfareRow > div .inline:first-child { float:none; width:100%; }
.welfare .welfareRow > div .inline:last-child { float:none; width:100%; text-align:center; border-top:0; }

}

@media all and (max-width:580px){
.recruit .container .stepList li { float:none; width:100%; }
.recruit .container .stepList li:before { top:0; }
.recruit .container .stepList li:after { top:-15%; left:50%; margin-left:-6px; transform:rotate(90deg); }

/* .recruit .container .stepList li:after { display:none; } */


}

@media all and (max-width:480px){

}


/* ============== Contact ============== */

/* 1200px */
@media all and (max-width:1200px){

}

/* 1152px */
@media all and (max-width:1152px){

}

/* 1024px */
@media all and (max-width:1024px){
.contact .container .contactUs ul li img { float:none; width:100%; }
.contact .container .contactUs ul li div.numberWrap { float:none; padding-left:0; width:100%; text-align:center; }
}


/* 950px */
@media all and (max-width:950px){

}

/* 768px */
@media all and (max-width:768px){

}

/* 640px or 600px*/
@media all and (max-width:640px){
.address .inline { display:block; }
.address .inline:nth-of-type(2) { display:none; }
.contact .container .contactUs ul li { float:none; width:100%; }
.contact .container .contactUs ul li:after { top:12%; left:50%; margin-left:-63px; width:126px; height:1px  }
}

@media all and (max-width:480px){
.address .inline:nth-of-type(3) { display:none; }
}


/* ============== aboutAfo ============== */

/* 1200px */
@media all and (max-width:1200px){
/* 레이어 팝업 - gallery */
.layerPop.galleryWrap .layerConts { position:absolute; top:15%; bottom:0; left:10%; right:10%; width:80%; }
}

/* 950px */
@media all and (max-width:950px){
.gallery ul.galleryList li { margin-right:2%; width:49%; }
.gallery ul.galleryList li:nth-of-type(2n) { margin-right:0px; }
.gallery ul.galleryList li:nth-of-type(2n+1) { margin-right:2%; }
}

/* 640px or 600px*/
@media all and (max-width:640px){
/* 레이어 팝업 - gallery */
.layerPop.galleryWrap .layerConts { position:absolute; top:2%; bottom:0; left:10%; right:10%; width:80%; height:97%; transform:translateY(0%); }
.gallery ul.galleryList li { margin-right:0; width:100%; }
/* 레이업 닫기버튼 */
.closeBtn { position:absolute; top:-3px; right:-28px; }
}
