#mainSection {width:100%; height:auto; position:relative; background:#f5f7f8; padding-bottom:50px; font-size:12px; }

#mainSection h3 {font-size:16px; font-weight:500; font-family: 'NotoSansKR-Light-Hestia';  color:#333 }
#mainSection1 {width:1080px; height:300px; margin:0 auto; position:relative;}
#mainSection1 .photoBox {width:718px; height:287px; position:absolute; top:0px; left:0px; margin-top:12px; border:1px solid #ddd; background:url('/new/img/architect/bg_photo.jpg') no-repeat;background-color:#fff; padding:17px;}
#mainSection1 .photoBox  h3 {color:#a5d0ee; line-height:22px;}
#mainSection1 .photoBox  .photoArea {width:334px; height:251px; border:1px solid #1779be; overflow:hidden; position:absolute; top:18px; left:76px;}
#mainSection1 .photoBox  .photoArea ul {width:500%; height:251px;}
#mainSection1 .photoBox  .photoArea li {float:left; width:334px; height:251px;}
#mainSection1 .photoBox  .photoArea img {width:334px; min-height:251px;}
#mainSection1 .photoBox  .photoTitle {width:280px; height:200px; position:absolute; top:70px; right:10px;}
#mainSection1 .photoBox  .photoTitle h5 {font-size:30px; font-weight:500; font-family:'NotoSansKR-Light-Hestia'; color:#333333 }
#mainSection1 .photoBox  .photoTitle .comName {position:absolute; bottom:10px; left:0px; font-size:14px; color:#777; font-weight:600}
#mainSection1 .photoBox .list-btn {position:absolute; top:18px; right:30px;  text-align:center; height:8px; width:auto;}
#mainSection1 .photoBox .list-btn div {width:8px; height:8px; display:inline-block; background:url('/new/img/main/slide_btn.gif') -8px 0px no-repeat; }
#mainSection1 .photoBox .list-btn .over {background:url('/new/img/main/slide_btn.gif') 0px 0px no-repeat;}

#mainSection1 .main-Login {width:354px; height:138px; position:absolute; top:0px; right:0px; margin-top:12px;}
#mainSection1 .main-Login .loginBox {width:352px; height:138px; background:#fff; border:1px solid #dddddd}
#mainSection1 .main-Login .loginBox .idBox {width:174px; height:39px; overflow:hidden; background:#f5f7f8; position:absolute; top:20px; left:20px;}
#mainSection1 .main-Login .loginBox .pwBox {width:174px; height:39px; overflow:hidden; background:#f5f7f8; position:absolute; top:58px; left:20px;}
#mainSection1 .main-Login .loginBox label {position:absolute; line-height:37px; padding-left:10px}
#mainSection1 .main-Login .loginBox input[type='text'], .loginBox input[type='password'] {border:0px; height:100%; width:100%; padding-left:10px; background:#f5f7f8;}
#mainSection1 .main-Login .loginBox .btn_login {position:absolute; display:block; font-size:13px; top:20px; right:100px; width:77px; line-height:77px; height:77px; font-weight:600; text-align:center; border:0px; color:#fff; background:#006cb8; }
#mainSection1 .main-Login .loginBox .join {position:absolute; display:block; font-size:13px; top:20px; right:20px; line-height:75px; width:77px; height:77px; font-weight:600; text-align:center; border:2px solid #006cb8; color:#006cb8; background-color:#fff}
#mainSection1 .main-Login .loginBox .userFind {position:absolute; bottom:16px; left:20px}
#mainSection1 .main-Login .loginBox .speedJoin {position:absolute; bottom:12px; right:20px; height:20px; line-height:20px;}
#mainSection1 .main-Login .loginBox .speedJoin img {vertical-align:middle; margin-left:3px}
#mainSection1 .main-AD2 {width:354px; height:auto; position:absolute; top:159px; right:0px;}
#mainSection1 .main-AD2 span {width:352px; height:138px; display:block; background:url('/new/img/main/mainAD2.jpg');}


#mainSection2 { width:1080px; height:406px;  margin:0 auto; position:relative;}
#mainSection2 .companyBox {width:1080px; height:398px; padding:17px 0px 17px 17px; background:#fff; margin-top:8px; float:left;}
#mainSection2 .companyBox ul {margin-top:10px;}
#mainSection2 .companyBox li {width:343px; height:160px; float:left;  margin-left:10px; position:relative; margin-bottom:10px; overflow:hidden;}
#mainSection2 .companyBox li .photo {width:84px; height:64px; border:1px solid #eeeeee; overflow:hidden; margin-right:10px;}
#mainSection2 .companyBox li .photo img {width:100%;}
#mainSection2 .companyBox li .info {display:inline-block; position:absolute; top:0px; left:100px; color:#666666}
#mainSection2 .companyBox li .info h5 {font-size:14px; color:#555; line-height:18px; min-height:36px; border-bottom:1px solid #dddddd; width:220px  }
#mainSection2 .companyBox li .portF {margin-top:10px; width:95px; height:78px; overflow:hidden; float:left; margin-right:5px;}
#mainSection2 .companyBox li .portF last-child {margin-right:0px; }
#mainSection2 .companyBox li .portF img {width:100%; min-height:78px;}

#mainSection3 { width:1080px; height:300px;  margin:0 auto; position:relative;}
#mainSection3 .requestBox {width:536px; height:288px; padding:17px 0px 17px 17px; background:#fff; margin-top:8px; float:left;}
#mainSection3 .requestBox ul {}
#mainSection3 .requestBox li {width:500px; padding-top:22px;  padding-bottom:12px; border-bottom:1px solid #ddd; position:relative; }
#mainSection3 .requestBox li b {font-size:14px; color:#555555}
#mainSection3 .requestBox li .num {color:#006cb8; font-weight:600; padding-right:5px;}
#mainSection3 .requestBox li:last-child {border:0px;}
#mainSection3 .requestBox .countBox {width:30px; height:27px; padding:10px; padding-top:6px; line-height:18px; position:absolute; top:20px; right:57px; border:2px solid #ddd; display:inline-block; text-align:center; font-weight:600; color:#006cb8}
#mainSection3 .requestBox .countBox strong {color:#555}
#mainSection3 .requestBox .btn_request {width:30px; height:27px; padding:10px; padding-top:6px; line-height:18px; position:absolute; top:20px; right:0px; border:2px solid #006cb8; display:inline-block; text-align:center; font-weight:600; color:#fff; background:#006cb8;}

#mainSection3 .ADBox {width:536px; height:288px;  margin-top:8px; float:left; margin-left:8px;}
#mainSection3 .ADBox li {float:left; overflow:hidden; width:263px; height:138px; border:1px solid #ddd}
#mainSection3 .ADBox li img {width:100%;}
#mainSection3 .ADBox .top {margin-bottom:8px;}
#mainSection3 .ADBox .last {margin-left:6px;}

/* 상단 1080 */
@media all and (max-width:1080px){
#mainSection1 {width:100%;}
#mainSection1 h3 {display:none;}
#mainSection1 .photoBox {width:65%; background:url('/new/img/architect/bg_photo_1080.jpg') no-repeat; background-color:#fff;}
#mainSection1 .photoBox  .photoArea {left:16px;}
#mainSection1 .photoBox  .photoTitle {width:30%; }

#mainSection1 .main-Login {width:34%;}
#mainSection1 .main-Login .loginBox {width:99%;}
#mainSection1 .main-Login .loginBox .idBox {width:80%;}
#mainSection1 .main-Login .loginBox .pwBox {width:80%;}
#mainSection1 .main-AD2 {width:34%; overflow:hidden;}


#mainSection2 { width:100%;}
#mainSection2 .companyBox {width:100%;}
#mainSection2 .companyBox li {width:32.3%;  margin-left:1%;  }
#mainSection2 .companyBox li .photo img {width:100%;}
#mainSection2 .companyBox li .info h5 {width:100%;  }
#mainSection2 .companyBox li .portF {width:32%; margin-right:1%;}
#mainSection2 .companyBox li .portF last-child {margin-right:0px; }
#mainSection2 .companyBox li .portF img {width:100%; min-height:78px;}

#mainSection3 { width:100%}
#mainSection3 .requestBox {width:50%;}
#mainSection3 .requestBox li {width:100%; }
#mainSection3 .requestBox .cont {width:70%; height:12px;overflow:hidden; z-index:1; display:block;}
#mainSection3 .requestBox .countBox {right:67px; z-index:99; background:#fff}
#mainSection3 .requestBox .btn_request {right:10px;}

#mainSection3 .ADBox {width:49%; margin-left:1%;  overflow-y:auto; overflow-x:hidden;}
#mainSection3 .ADBox li {float:left; overflow:hidden; width:50%; text-align:center; background:#fff; -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;}
#mainSection3 .ADBox li img {width:auto;}
#mainSection3 .ADBox .top {margin-bottom:8px;}
#mainSection3 .ADBox .last {margin-left:0px;}
}


@media all and (max-width:727px){
#mainSection1 {height:350px;}
#mainSection1 .photoBox {width:86%; left:7%; height:338px; }
#mainSection1 .photoBox  .photoTitle {display:none; }
#mainSection1 .photoBox  .photoArea {width:96%; height:95%; top:2%; left:2%;}
#mainSection1 .photoBox  .photoArea ul {width:500%; height:100%;}
#mainSection1 .photoBox  .photoArea li {float:left; width:20%; height:100%;}
#mainSection1 .photoBox  .photoArea img {width:100%; min-height:100%;}

#mainSection1 .photoBox .list-btn {display:none;}
#mainSection1 .main-Login .loginBox {display:none;}
#mainSection1 .main-AD2 {display:none;}


#mainSection2 { width:100%; height:726px;}
#mainSection2 .companyBox {width:86%; margin-left:7%; height:726px; overflow:hidden;}
#mainSection2 .companyBox li {width:98%;  }



#mainSection3 {height:593px;}
#mainSection3 .requestBox {width:86%; margin-left:7%; }
#mainSection3 .ADBox {width:86%; margin-left:7%; }
#mainSection3 .requestBox .countBox {display:none;}
#mainSection3 .requestBox .btn_request {display:none;}

}