@charset "utf-8";

.sub-top{width:100%; height:460px; position:relative; background:url('/images/sub/sub-top-bg.jpg') no-repeat center; background-size:cover;}
.sub-top > div{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; max-width:1400px; text-align:center; padding-top:120px}
.sub-top > div p{font-size:18px; font-weight:300; color:rgba(255,255,255,.8); line-height:1.4;}
.sub-top > div h1{font-size:48px; font-weight:700; color:#fff; margin-top:13px; line-height:1.4;}
.sub-title{font-size:38px; font-weight:700; color:#222; position:relative; padding-left:20px; line-height:1; margin-bottom:30px}
.sub-title::before{content:''; display:block; width:8px; height:8px; background:#006aff; position:absolute; top:12px; left:0;}


/*회사소개*/
.overview {display:flex; flex-wrap:wrap; justify-content: space-between;}
.overview dd{display:block; width:calc(100%/3 - 20px); margin-right:30px; background:#f1f5fb; padding:35px; position:relative; padding-bottom:90px}
.overview dd:nth-child(3n){margin-right:0}
.overview dd:nth-child(n+4){margin-top:30px}
.overview dd h3{font-size:22px; font-weight:700; line-height:1.3; margin-bottom:10px; color:#0048ae}
.overview dd ul li{padding-left:9px; position:relative; font-size:17px; line-height:1.4; font-weight:400}
.overview dd ul li::before{content:''; display:block; width:3px; height:3px; border-radius:10px; background:#000; position:absolute; top:10px; left:0;}
.overview dd ul li:nth-child(n+2){margin-top:5px}
.overview dd span.icon{position:absolute; bottom:20px; right:25px; font-size:48px; font-weight:500; color:rgba(0,86,208,.3)}


/*오시는길*/
.location{display:flex; flex-wrap:wrap; justify-content: space-between;}

/*지도*/
.map-box{width:49%;}
.root_daum_roughmap {width:100% !important;}
.root_daum_roughmap .wrap_controllers, .root_daum_roughmap .wrap_btn_zoom{display:none !important;}
.root_daum_roughmap_landing{border-bottom:1px solid #ddd;}
.root_daum_roughmap .wrap_map{height:400px !important;}
.map-link{margin-top:15px; display:flex; flex-wrap:wrap; justify-content: flex-end;}
.map-link a{display:flex; flex-wrap:wrap; align-items:center; padding:8px 15px 7px 18px; transition:.2s}
.map-link a:nth-child(n+2){margin-left:5px;}
.map-link a.kakao{background:#ffcc00; color:#020303}
.map-link a.naver{background:#2ac50f; color:#fff}
.map-link a.kakao:hover{background:#ffc000; color:#000; border-radius:5px}
.map-link a.naver:hover{background:#20b905; border-radius:5px}
.map-link a:hover span{transform: rotate(0deg); transition:.2s}
.map-link a p{font-size:16px; font-weight:500;}
.map-link a span{transform: rotate(-45deg); font-size:23px; font-weight:300; margin-left:10px; padding-bottom:2px}

/*정보*/
.loca-info {width:49%;}
.loca-info ul {width:100%; border-top:1px solid #000}
.loca-info ul li{display:flex; flex-wrap:wrap; border-bottom:1px solid #ddd; padding:23px 12px 20px 12px}
.loca-info ul li span{color:#006aff; font-weight:400; font-size:23px; width:32px}
.loca-info ul li p{font-size:17px; line-height:1.4; width:calc(100% - 32px); color:#000}
.loca-info ul li a:hover{text-decoration:underline; text-underline-position : under; color:#006aff}






/*공사실적 - 갤러리 형태*/
.br-search{display:flex; flex-wrap:wrap; justify-content: flex-end; margin-bottom:20px}
.br-search div{border:1px solid #ddd; display:flex; flex-wrap:wrap; align-items:center; width:fit-content; padding:2px 5px;}
.br-search input[type="text"]{height:40px; padding:0 5px; width:300px; border:none; font-size:16px; font-weight:400}
.br-search input::placeholder {font-size:15px;}
.br-search a{display:inline-block; padding-left:5px; cursor:pointer; text-decoration:none; }
.br-search a span{line-height:40px; font-size:26px; color:#000}
.brand-list dl{display:flex; flex-wrap:wrap;}
.brand-list dl dd{width:calc(100%/4 - 15px); border:1px solid #ddd; margin-right: 20px; padding: 45px 30px; cursor:pointer;}
.brand-list dl dd:hover{border:1px solid #666; transition:.3s}
.brand-list dl dd:nth-child(4n){margin-right:0 }
.brand-list dl dd:nth-child(n+5){margin-top:20px }
.br-con{ position:relative; padding-top:40px}
.br-con b{position:absolute; top:0; left:0; background:#006aff; color:#fff; padding:8px 15px 5px 15px; border-radius:100px; font-size:15px; line-height:1.3; font-weight:500; margin-bottom:10px; display:inline-block}
.br-con h1{color:#222; font-size:24px; line-height:1.3; padding-left:2px}
.br-con p{color:#444; font-size:17px; line-height:1.4; padding-left:2px; font-weight:400; margin-top:15px; display:inline-block; width:100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}



/*공사실적페이지 리스트*/
.list-paging{text-align:center; margin-top:20px; display:flex; flex-wrap:wrap; align-items:center; justify-content: center;}
.list-paging strong{cursor:pointer; padding:0 10px; margin:0 3px; line-height:34px; display:flex; flex-wrap:wrap; align-items:center; justify-content: center; border:1px solid #aaa; color:#666; font-size:16px;}
.list-paging a, .list-paging b{width:30px; line-height:34px; margin:0 3px; border:1px solid #aaa; color:#666}
.list-paging a:hover, .list-paging strong:hover{border:1px solid #000; color:#000}
.list-paging b{background:#000; color:#fff; border:1px solid #000;}


@media(max-width:1400px){
.sub-top{height:420px;}
.sub-top > div{padding-top:110px}
.sub-top > div h1{font-size:46px;}

.sub-title{font-size:35px; }


/*공사실적 - 갤러리 형태*/
.brand-list dl dd{width:calc(100%/4 - 8px); margin-right: 10px; padding: 35px 20px;}
.brand-list dl dd:nth-child(4n){margin-right:0 }
.brand-list dl dd:nth-child(n+5){margin-top:10px }
.br-con{padding-top:36px}
.br-con b{padding:7px 12px 5px 12px; font-size:14px; margin-bottom:8px;}
.br-con h1{font-size:20px;}
.br-con p{font-size:16px;}

/*회사소개*/
.overview dd{width:calc(100%/3 - 10px); margin-right:15px;}
.overview dd:nth-child(3n){margin-right:0}
.overview dd:nth-child(n+4){margin-top:15px}

/*지도*/
.map-box{width:49%;}
.root_daum_roughmap .wrap_map{height:360px !important;}
.map-link a{padding:8px 13px 7px 16px;}
.map-link a:nth-child(n+2){margin-left:5px;}

/*정보*/
.loca-info {width:49%;}
.loca-info ul li{padding:20px 10px 18px 10px}
.loca-info ul li span{font-size:21px; width:30px}
.loca-info ul li p{font-size:16px; width:calc(100% - 30px);}
}




@media(max-width:1230px){
.sub-top{height:380px;}
.sub-top > div{padding-top:90px}
.sub-top > div p{font-size:17px;}
.sub-top > div h1{font-size:42px; margin-top:11px;}
.sub-title{font-size:32px; padding-left:16px; margin-bottom:26px}
.sub-title::before{width:7px; height:7px; top:11px;}

/*공사실적 - 갤러리 형태*/
.br-search input[type="text"]{height:38px; width:260px; font-size:15px; }
.br-search a span{line-height:38px; font-size:24px;}
.brand-list dl dd{width:calc(100%/3 - 15px); margin-right: 22px; padding: 25px 20px;}
.brand-list dl dd:nth-child(4n){margin-right:22px }
.brand-list dl dd:nth-child(3n){margin-right:0 }
.brand-list dl dd:nth-child(n+4){margin-top:20px }
.br-con{padding-top:40px}
.br-con b{padding:8px 15px 5px 15px; font-size:15px; margin-bottom:10px;}

/*회사소개*/
.overview dd{width:calc(100%/3 - 7px); margin-right:10px; padding:25px; padding-bottom:80px}
.overview dd:nth-child(3n){margin-right:0}
.overview dd:nth-child(n+4){margin-top:10px}
.overview dd span.icon{font-size:44px;}

/*오시는길*/
.location{display:flex; flex-wrap:wrap; justify-content: space-between;}

/*지도*/
.map-box{width:460px;}
.root_daum_roughmap .wrap_map{height:320px !important;}
.map-link{margin-top:12px;}

/*정보*/
.loca-info {width:calc(100% - 480px);}
}



@media(max-width:1023px){
.sub-top{height:340px;}
.sub-top > div{padding-top:80px}
.sub-top > div p{font-size:16px;}
.sub-top > div h1{font-size:38px; margin-top:8px;}
.sub-title{font-size:30px; padding-left:15px; margin-bottom:24px}


/*공사실적 - 갤러리 형태*/
.br-search{margin-bottom:15px}
.br-search input[type="text"]{height:34px; width:210px; font-size:14px; }
.br-search input::placeholder {font-size:14px;}
.br-search a span{line-height:34px; font-size:22px;}
.brand-list dl dd{width:calc(100%/3 - 5px); margin-right: 7px; padding: 25px 20px;}
.brand-list dl dd:nth-child(4n){margin-right:7px }
.brand-list dl dd:nth-child(3n){margin-right:0 }
.brand-list dl dd:nth-child(n+4){margin-top:7px }
.br-con{padding-top:32px}
.br-con b{padding:6px 10px 4px 10px; font-size:13px; margin-bottom:7px;}
.br-con h1{font-size:18px;}
.br-con p{font-size:15px; margin-top:12px}


/*회사소개*/
.overview dd{width:calc(100%/3 - 5px); margin-right:7px; padding:20px; padding-bottom:75px}
.overview dd:nth-child(3n){margin-right:0}
.overview dd:nth-child(n+4){margin-top:7px}
.overview dd h3{font-size:20px; margin-bottom:8px;}
.overview dd ul li{font-size:16px;}
.overview dd span.icon{bottom:16px; right:20px; font-size:40px;}


/*오시는길*/
.location{display:flex; flex-flow:column;}

/*지도*/
.map-box{width:100%;}
.root_daum_roughmap .wrap_map{height:320px !important;}
.map-link{margin-top:10px;}
.map-link a{padding:7px 11px 6px 14px}
.map-link a p{font-size:15px;}
.map-link a span{font-size:21px; }

/*정보*/
.loca-info {width:100%; margin-top:20px;}
}




@media(max-width:768px){
.sub-top{height:300px;}
.sub-top > div{padding-top:70px}
.sub-top > div p{font-size:15px;}
.sub-top > div h1{font-size:32px; margin-top:6px;}
.sub-title{font-size:26px; padding-left:13px; margin-bottom:20px}
.sub-title::before{width:6px; height:6px; top:10px;}


/*공사실적 - 갤러리 형태*/
.br-search input[type="text"]{height:33px; width:190px;}
.br-search a span{line-height:33px; font-size:21px;}
.brand-list dl dd{width:calc(100%/2 - 7px); margin-right: 14px; padding: 25px 20px;}
.brand-list dl dd:nth-child(3n), .brand-list dl dd:nth-child(4n){margin-right:14px }
.brand-list dl dd:nth-child(2n){margin-right:0 }
.brand-list dl dd:nth-child(n+3){margin-top:14px }
.br-con{padding-top:34px}

/*회사소개*/
.overview dd{width:calc(100%/2 - 6px); margin-right:12px; padding:25px; padding-bottom:70px}
.overview dd:nth-child(3n){margin-right:12px}
.overview dd:nth-child(2n){margin-right:0}
.overview dd:nth-child(n+3){margin-top:12px}
.overview dd h3{font-size:19px;}
.overview dd ul li:nth-child(n+2){margin-top:4px}
.overview dd ul li::before{top:9px;}
.overview dd span.icon{bottom:14px; right:18px; font-size:40px;}


/*지도*/
.root_daum_roughmap .wrap_map{height:270px !important;}


/*공사실적페이지 리스트*/
.list-paging strong{padding:0 8px; line-height:30px; font-size:15px;}
.list-paging a, .list-paging b{font-size:14px; width:26px; line-height:30px;}

}


@media(max-width:500px){
.sub-top{height:240px;}
.sub-top > div{padding-top:60px}
.sub-top > div p{font-size:14px;}
.sub-top > div h1{font-size:26px; margin-top:5px;}
.sub-title{font-size:22px; padding-left:12px; margin-bottom:16px}
.sub-title::before{width:5px; height:5px; top:8px;}


/*공사실적 - 갤러리 형태*/
.br-search{margin-bottom:12px}
.br-search div{width:100%;}
.br-search input[type="text"]{height:30px; width:calc(100% - 30px); font-size:13px; }
.br-search input::placeholder {font-size:13px;}
.br-search a span{line-height:30px; font-size:19px;}
.brand-list dl dd{width:100%; margin-right: 0; padding: 20px 15px;}
.brand-list dl dd:nth-child(3n), .brand-list dl dd:nth-child(4n){margin-right:0 }
.brand-list dl dd:nth-child(2n){margin-right:0 }
.brand-list dl dd:nth-child(n+2){margin-top:10px }
.br-con{padding-top:38px}
.br-con b{padding:7px 12px 5px 12px; font-size:14px; margin-bottom:7px;}


/*회사소개*/
.overview dd{width:100%; margin-right:0 !important; padding:30px; padding-bottom:80px}
.overview dd:nth-child(n+2){margin-top:10px}
.overview dd h3{font-size:18px; }
.overview dd ul li{padding-left:8px; font-size:15px;}
.overview dd ul li::before{width:2px; height:2px; top:9px;}
.overview dd ul li:nth-child(n+2){margin-top:5px}
.overview dd span.icon{bottom:20px; right:25px; font-size:44px;}

/*지도*/
.root_daum_roughmap .wrap_map{height:270px !important;}
.map-link{margin-top:10px;}
.map-link a{padding:7px 11px 6px 14px}
.map-link a p{font-size:15px;}
.map-link a span{font-size:21px; }

/*정보*/
.loca-info {margin-top:16px;}
.loca-info ul li{padding:16px 10px 15px 10px}
.loca-info ul li span{font-size:19px; width:28px}
.loca-info ul li p{font-size:15px; width:calc(100% - 28px);}


/*공사실적페이지 리스트*/
.list-paging strong{padding:0 5px; line-height:26px; font-size:13px; margin:0 2px; margin-top:4px;}
.list-paging a, .list-paging b{font-size:13px; width:22px; line-height:26px; margin:0 2px; margin-top:4px;}
}


@media(max-width:380px){
.sub-top{height:220px;}
.sub-top > div{padding-top:55px}
.sub-top > div p{font-size:13px;}
.sub-top > div h1{font-size:22px;}

/*공사실적 - 갤러리 형태*/
.br-con{padding-top:34px}
.br-con b{padding:6px 10px 4px 10px; font-size:13px; margin-bottom:6px;}
.br-con h1{font-size:17px;}
.br-con p{font-size:14px; margin-top:10px}


/*회사소개*/
.overview dd span.icon{bottom:16px; right:20px; font-size:40px;}


/*지도*/
.root_daum_roughmap .wrap_map{height:230px !important;}
.map-link{margin-top:10px;}
.map-link a{padding:7px 10px 6px 12px}
.map-link a p{font-size:14px;}
.map-link a span{font-size:20px; }

/*정보*/
.loca-info {margin-top:15px;}
.loca-info ul li{padding:15px 10px 14px 10px}
.loca-info ul li span{font-size:18px; width:25px}
.loca-info ul li p{font-size:14px; width:calc(100% - 25px);}
}


/* (구)게시판 */
.board_tbl { width:100%; border-top:2px solid #111; border-bottom:1px solid #ccc; }
thead th{ background:#37485f; padding:10px 0; color:#fff; }
.board_tbl tbody td { border-bottom:1px solid #ccc; font-size:14px; padding:10px 5px; }
.tbl_paging td img { display:unset; }
.tbl_paging td font b { font-size:16px; }
.tbl_paging td strong { font-weight:700; color:#000; }