@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
/* sub01-01 인사말 */
.greeting .greeting-bg {background:url('../images/sub/greeting-bg.jpg') no-repeat; background-size:cover; height:300px;}
.greeting .wrap {display:flex;}
.greeting .wrap>div {width:50%;}
.greeting .wrap .tit {margin-top:-16px;}
.greeting .wrap .tit span {font-size:82px; font-weight:700; color:#000; opacity:0.05; line-height:1.1em;}
.greeting .wrap .tit p {font-size:48px; font-weight:400; line-height:1.3em; color:#2c2c2c; margin-top:-45px;}
.greeting .wrap .tit p strong {color:#126eaf;}
.greeting .wrap .txt {background:#fff; padding:60px 0 0 60px; margin-top:-100px;}
.greeting .wrap .txt p {font-size:18px; line-height:1.7em; color:#505050; margin-bottom:40px;}
.greeting .wrap .txt p:last-child {margin-bottom:0;}
/* sub01-02 면허 및 인증 */
.license h3 {font-size:18px; color:#2c2c2c; line-height:2em; text-align:center; margin:-40px 0 60px;}
.license h3 strong {color:#126eaf;}
.license ul {display:flex; margin-left:-60px;}
.license ul li {width:25%; margin-left:60px; text-align:center;}
.license ul li .pic {margin-bottom:16px;}
.license ul li p {font-size:18px; line-height:2em; color:#2c2c2c; font-weight:700;}
/* sub01-03 오시는 길 */
.directions .root_daum_roughmap {width:100% !important; height:400px !important;}
.directions .root_daum_roughmap .wrap_map {height:400px !important;}
.directions .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.directions .roughmap_lebel_text:after {content:"해송씨엔에스"; font-size:12px; line-height:15px;}
.directions .maps {margin-bottom:60px;}
.directions ul {display:flex;}
.directions ul li {width:25%; border-right:1px solid #dfdfdf; padding:40px 20px; text-align:center;}
.directions ul li:last-child {border-right:0;}
.directions ul li .img-box {margin-bottom:36px;}
.directions ul li strong {font-size:16px; color:#2c2c2c; line-height:1.8em; margin-bottom:12px;}
.directions ul li p {font-size:18px; line-height:1.4em; color:#505050;}
/* doc-common */
.doc-tit {font-size:26px; padding-left:36px; line-height:1.3em; font-weight:700; color:#2c2c2c; position:relative; margin-bottom:40px;}
.doc-tit:before {content:''; width:26px; height:22px; position:absolute; left:0; top:50%; transform:translateY(-50%); background:url('../images/bbs/doc-tit-icon.png') no-repeat; background-size:cover;}
.doc-txt {font-size:18px; line-height:1.7em; color:#505050; margin-bottom:40px;}
.doc-txt p {margin-bottom:40px;}
.doc-txt p:last-child {margin-bottom:0;}
/* sub02-01 TPO */
.thermoplastic .cnt {margin-bottom:80px;}
.thermoplastic .cnt ul {display:flex; margin-left:-40px;}
.thermoplastic .cnt ul li {width:50%; margin-left:40px;}
.thermoplastic .wrap {background:#fafafa; padding:80px 0;}
.thermoplastic .wrap .img-box {max-width:856px; margin:0 auto;}
.thermoplastic .wrap .img-box .pic {position:relative; height:0; padding-bottom:74.533%; overflow:hidden;}
.thermoplastic .wrap .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
/* sub02-02,03,04 지붕 common*/
.housetop .cnt {margin-bottom:80px;}
.housetop .cnt01 .pic {position:relative; margin-bottom:26px; text-align:center; background:#fafafa;}
.housetop .cnt01 .pic:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; border:1px solid #dfdfdf;}
.housetop .cnt01 p {font-size:18px; line-height:1.7em; color:#505050; text-align:center;}
.housetop .cnt02 ol {display:flex; margin-left:-31px;}
.housetop .cnt02 ol li {width:25%; margin-left:31px; padding:40px 10px 60px; color:#fff; display:flex; flex-direction:column; align-items:center; text-align:center;}
.housetop .cnt02 ol li:nth-child(odd) {background:#126eaf;}
.housetop .cnt02 ol li:nth-child(even) {background:#595757;}
.housetop .cnt02 ol li strong {font-size:24px; margin-bottom:30px; line-height:1.3em;}
.housetop .cnt02 ol li .img-box {margin-bottom:20px;}
.housetop .cnt02 ol li p {font-size:18px; line-height:1.7em;}
.housetop .cnt02 ol li p span {font-size:14px; line-height:1.8em;}
.housetop .cnt03 ul {display:flex; flex-wrap:wrap; margin-left:-40px; margin-bottom:-50px;}
.housetop .cnt03 ul li {width:calc(50% - 40px); margin-left:40px; margin-bottom:50px;}
.housetop .cnt03 ul li .img-box {margin-bottom:20px;}
.housetop .cnt03 ul li .img-box .pic {position:relative; height:0; padding-bottom:57.353%; overflow:hidden;}
.housetop .cnt03 ul li .img-box .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.housetop .cnt03 ul li p {text-align:center; font-size:18px; line-height:1.7em; color:#505050;}
/* tap commomn */
.tap-menu {margin-bottom:60px;}
.tap-menu ul {display:flex; flex-wrap:wrap; margin-left:-10px; margin-bottom:-10px;}
.tap-menu ul li {font-size:18px; line-height:1.5em; color:#2c2c2c; background:#fff; width:calc(25% - 10px); margin-left:10px; margin-bottom:10px; border:1px solid #dfdfdf; text-align:center; line-height:52px;}
.tap-menu ul li a {display:block;}
.tap-menu ul li.active {background:#126eaf; color:#fff; border-color:#126eaf; font-weight:700;}
/* sub02-05 각종마감 */
.deadline-detail ul {display:flex; flex-wrap:wrap; margin-left:-40px; margin-bottom:-40px;}
.deadline-detail ul li {width:calc(33.33333% - 40px); margin-left:40px; margin-bottom:40px;}
.deadline-detail ul li .pic {position:relative; height:0; padding-bottom:65.5%; overflow:hidden;}
.deadline-detail ul li .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
/* sub03-01 시공사례 */
.reward-detail {max-width:1920px; margin:0 auto;}
.reward-detail ul {display:flex; flex-wrap:wrap; margin-left:-11px; margin-bottom:-50px;}
.reward-detail ul li {width:calc(33.33333% - 11px); margin-left:11px; margin-bottom:50px;}
.reward-detail ul li .pic {position:relative; height:0; padding-bottom:65.67%; overflow:hidden; margin-bottom:20px;}
.reward-detail ul li .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.reward-detail ul li p {font-size:18px; line-height:1.7em; color:#000; text-align:center;}






/* sub03-02 시공실적 */
.result-menu {margin-bottom:80px;}
.result-menu ul li {width:calc(16.666666% - 10px);}
.result-detail table {width:100%; border-spacing:0; text-align:center; border-collapse:collapse;}
.result-detail table th {font-size:18px; font-weight:700; color:#2c2c2c; border-top:2px solid #126eaf; background:#fafafa; border-right:1px solid #dfdfdf; line-height:57px;}
.result-detail table th:last-child {border-right:0;}
.result-detail table td {color:#505050; line-height:55px; border:1px solid #dfdfdf;}
.result-detail table td:first-child {border-left:0;}
.result-detail table td:last-child {border-right:0;}
/* sub04-01 견적문의 */
.inquiry .tit {font-size:18px; line-height:2em; color:#2c2c2c; text-align:center; margin-bottom:50px; margin-top:-30px;}
.inquiry .tit strong {color:#126eaf;}