:root {
    --main-color: #FFD400;
}

.header { position: fixed; top: 0; left: 0; right: 0; z-index: 11; }
.header .header-contents { position: relative; display: flex; justify-content: space-between; padding: 0 40px; height: 90px; align-items: center; border-bottom: 1px solid #ddd; }
.header .header-contents .home-link { background: url("/img/clogo.png") center no-repeat; background-size: contain; }
.header .header-contents .home-link img { display: block; height: 36px; visibility: hidden; }

.header .header-contents .menu-wrap { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); }
.header .header-contents .menu-wrap .menu-contents { display: flex; gap: 16px; }
.header .header-contents .menu-wrap .menu-contents a { font-size: 18px; font-weight: 500; padding: 6px 12px; }

.header .header-contents .header-tel { background: #FFD400; font-size: 14px; font-weight: 500; padding: 14px 34px; border-radius: 16px; display: flex; gap: 16px; align-items: center; line-height: 1; }

/* on */
.header .header-contents.on { background: #111; border: 0; }
.header .header-contents.on .home-link { background: url("/img/logo.png") center no-repeat; background-size: contain; }
.header .header-contents.on .menu-wrap .menu-contents a { color: #fff; }

.main .header .header-contents { border-bottom: 1px solid rgba(255, 255, 255, .4); }
.main .header .header-contents.on { border-bottom: 1px solid #111; }
.main .header .header-contents .menu-wrap .menu-contents a { color: #fff; }



.mb { height: 910px; position: relative; }
.mb .mb-contents { padding: 90px 0 0; position: relative; z-index: 1; }
.mb .mb-contents .box { padding: 218px 0 0; color: #fff; }
.mb .mb-contents .box h1 { font-size: 48px; font-weight: 700; line-height: 1.4; }
.mb .mb-contents .box p { font-size: 20px; font-weight: 500; margin: 24px 0 44px; }
.mb .mb-contents .box .buttons { display: flex; gap: 16px; }
.mb .mb-contents .box .buttons .btn-cs { display: flex; gap: 12px; align-items: center; width: 211px; justify-content: center; }
.mb .bg { background: url("/img/mb0614.png") center no-repeat; background-size: cover; position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; }



.adv-section { }
.adv-section .adv-contents { display: grid; gap: 20px; grid-template-columns: 3fr 9fr; }
.adv-section .adv-contents .title {  }
.adv-section .adv-contents .title h2 { font-size: 48px; font-weight: 500; line-height: 1.4; margin: 0 0 16px; }
.adv-section .adv-contents .title p { font-size: 20px; font-weight: 500; color: #707070; }
.adv-section .adv-contents .content { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.adv-section .adv-contents .content .card { display: flex; height: 231px; background: #F8F8F8; border-radius: 12px; align-items: center; justify-content: center; }
.adv-section .adv-contents .content .card img { display: block; max-width: 74px; margin: 0 auto; }
.adv-section .adv-contents .content .card p { font-size: 18px; font-weight: 500; margin: 24px 0 0; line-height: 1; text-align: center; }



.est-section { background: url("/img/estimate-bg.png") center no-repeat; background-size: cover; color: #fff; padding: 110px 0; }
.est-section p { font-size: 20px; font-weight: 500; opacity: .6; }
.est-section h2 { font-size: 48px; font-weight: 600; margin: 16px 0 32px; }
.est-section .button-wrap {}
.est-section .button-wrap a { width: 211px; font-size: 20px; font-weight: 500; }



.prc-section { }
.prc-section h2 { font-size: 48px; font-weight: 600; margin: 0 0 92px; text-align: center; line-height: 1.4; }
.prc-section .content { display: flex; gap: 20px; border-top: 1px solid #ddd; padding-top: 29px; justify-content: space-between; }
.prc-section .content .article { text-align: center; position: relative; }
.prc-section .content .article:before { position: absolute; top: -30px; left: 50%; content: ''; width: 20px; height: 20px; border-radius: 100%; border: 2px solid #000; transform: translateX(-50%) translateY(-50%); background: #fff; }
.prc-section .content .article .num { font-size: 32px; font-weight: 900; color: #FFD400; }
.prc-section .content .article h3 { margin: 32px 0 16px; font-size: 20px; font-weight: 700; }
.prc-section .content .article p { font-size: 14px; font-weight: 500; color: #787878; }



.quick-section { background: #f4f4f4; }
.quick-section .quick-contents { display: grid; gap: 20px; grid-template-columns: 3fr 9fr; }
.quick-section .quick-contents .text {}
.quick-section .quick-contents .text h2 { font-size: 48px; line-height: 1.4; }
.quick-section .quick-contents .text p { font-size: 20px; margin: 16px 0 32px; color: #707070; }
.quick-section .quick-contents .content {  }
.quick-section .quick-contents .content .form-group { margin-bottom: 32px; }
.quick-section .quick-contents .content label { font-size: 16px; font-weight: 500; margin: 0 0 8px; }
.quick-section .quick-contents .content input[type="text"].form-control { border: 1px solid #fff; height: 50px; box-shadow: none; transition: all .3s; }
.quick-section .quick-contents .content input[type="text"].form-control:focus { outline: none; box-shadow: none; border: 1px solid #000; }
.quick-section .quick-contents .content textarea { border: 1px solid #fff; height: 240px; box-shadow: none; resize: none; transition: all .3s; padding: 16px; }
.quick-section .quick-contents .content textarea:focus { outline: none; box-shadow: none; border: 1px solid #000; }
.quick-section .quick-contents .content .btn.btn-block { height: 50px; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 600; }



.portfolio-section { }
.portfolio-section h2 { font-size: 48px; line-height: 1.4; text-align: center; }
.portfolio-section .portfolio-contents { margin: 48px 0 76px; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 40px 20px; }
.portfolio-section .portfolio-contents .box { aspect-ratio: 300 / 500; position: relative; }
.portfolio-section .portfolio-contents .box .bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 8px; border: 1px solid #ddd; background: #F8F8F8; z-index: 1; }
.portfolio-section .portfolio-contents .box:hover .bg { transform: translateY(-30px); }
.portfolio-section .portfolio-contents .box span { position: absolute; left: 0; bottom: 0; font-size: 20px; font-weight: 600; line-height: 1; }
/*.portfolio-section .portfolio-contents > div:hover { transform: translateY(-100px); }*/
.portfolio-section .button-wrap { }
.portfolio-section .button-wrap a.btn { width: 211px; margin: 0 auto; display: flex; gap: 12px; align-items: center; justify-content: center; }



.footer { background: #333333; padding: 60px 0; color: #fff; margin: 100px 0 0; }
.footer .footer-contents { display: flex; gap: 124px; }
.footer .footer-contents .logo-link {  }
.footer .footer-contents .logo-link img { width: 136px; }
.footer .footer-contents .content {  }
.footer .footer-contents .content .link-wrap { display: flex; gap: 16px; }
.footer .footer-contents .content .link-wrap a { font-size: 16px; font-weight: 500; }
.footer .footer-contents .content .text-wrap { display: flex; gap: 96px; margin: 24px 0 0; }
.footer .footer-contents .content .text-wrap .article { display: flex; flex-direction: column; gap: 8px; }

.page-top { padding: 219px 0 108px; text-align: center; }
.page-top h4 { font-size: 18px; font-weight: 700; color: #FFD400; }
.page-top h1 { font-size: 60px; font-weight: 700; margin: 12px 0 24px; }
.page-top p { font-size: 16px; color: #787878; line-height: 1.7; }

.about-adv-section { background: #F8F8F8; padding: 180px 0; }
.about-adv-section .ads-contents { display: flex; flex-direction: column; }
.about-adv-section .ads-contents .article { display: flex; }
.about-adv-section .ads-contents .article + .article { margin-top: 80px; padding-top: 80px; border-top: 1px solid #ddd; }
.about-adv-section .ads-contents .article .ads-header { flex: 0 0 312px; }
.about-adv-section .ads-contents .article .ads-header h5 { color: var(--main-color); font-size: 18px; font-weight: 700; }
.about-adv-section .ads-contents .article .ads-header h2 { font-size: 32px; font-weight: 700; line-height: 1.5; margin: 16px 0 0; }
.about-adv-section .ads-contents .article .ads-body { margin-left: auto; flex: 1; padding: 40px 0 0; font-size: 16px; line-height: 1.6; font-weight: 500; }

.about-map-section { padding: 160px 0; }
.about-map-section .ams-contents { display: flex; gap: 36px; }
.about-map-section .ams-contents .map-wrap { flex: 1; }
.about-map-section .ams-contents .map-wrap .map-contents { height: 443px; }
.about-map-section .ams-contents .info-wrap { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.about-map-section .ams-contents .info-wrap h4 { font-size: 18px; font-weight: 700; color: var(--main-color); }
.about-map-section .ams-contents .info-wrap h2 { font-size: 32px; font-weight: 700; margin: 16px 0 26px; }
.about-map-section .ams-contents .info-wrap .ul-contents { flex: 1; }
.about-map-section .ams-contents .info-wrap .ul-contents ul { font-size: 16px; }
.about-map-section .ams-contents .info-wrap .ul-contents ul li { list-style: none; display: flex; gap: 18px; }
.about-map-section .ams-contents .info-wrap .ul-contents ul li + li { margin: 24px 0 0; }
.about-map-section .ams-contents .info-wrap .ul-contents ul li div { flex: 0 0 92px; display: flex; gap: 15px; align-items: center; }
.about-map-section .ams-contents .info-wrap .ul-contents ul li div h5 { font-size: 16px; }
.about-map-section .ams-contents .info-wrap .ul-contents ul li p { flex: 1; font-weight: 500; color: #707070; }


.duammap-contents {  }
.duammap-contents .info {  }
.duammap-contents .info .title  { background: #ddd; padding: 10px 10px; font-size: 16px; line-height: 1; text-align: center; font-weight: 500; color: #000;  }
.duammap-contents .info .body { padding: 12px 0; overflow: hidden; position: relative; height: 110px; text-align: center; }
.duammap-contents .info .body img { margin: 0 0 12px; }
.duammap-contents .info .body .desc { font-size: 14px; line-height: 1.3; }

.procedure-section { padding: 0 0 160px; }
.prs-contents {  }
.prs-contents .article { display: flex; gap: 80px; }
.prs-contents .article + .article { margin: 96px 0 0; }
.prs-contents .article .img-box { flex: 0 0 50%; }
.prs-contents .article .img-box img { display: block; max-width: 100%; margin: 0 auto; }
.prs-contents .article .text-box { flex: 1; display: flex; justify-content: center; flex-direction: column; }
.prs-contents .article .text-box .text-box-title { margin: 0 0 24px; }
.prs-contents .article .text-box .text-box-title h5 { font-size: 18px; font-weight: 900; color: var(--main-color); }
.prs-contents .article .text-box .text-box-title h2 { font-size: 36px; font-weight: 600; margin: 8px 0 20px; position: relative; }
.prs-contents .article .text-box .text-box-title h2 span { font-size: 68px; position: absolute; bottom: 0; right: 0; font-weight: 900; color: #f0f0f0; }
.prs-contents .article .text-box .text-box-title p { font-size: 15px; font-weight: 400; line-height: 1.6; }
.prs-contents .article .text-box .text-box-notice {}
.prs-contents .article .text-box .text-box-notice .notice-title { display: inline-flex; padding: 3px 9px; border-radius: 20px; background: #000; color: #fff; font-size: 12px; }
.prs-contents .article .text-box .text-box-notice ul { padding: 0 0 0 24px; margin: 12px 0 0; }
.prs-contents .article .text-box .text-box-notice ul li { font-size: 12px; font-weight: 500; }
.prs-contents .article .text-box .text-box-notice ul li + li { margin: 8px 0 0; }

.prs-contents .article:nth-child(2n) .text-box { order: 1; }
.prs-contents .article:nth-child(2n) .img-box { order: 2; }

h2.title-deco { margin: 0 0 24px; }
h2.title-deco span { position: relative; z-index: 1; font-size: 26px; font-weight: 600; }
h2.title-deco span:after { content: ''; position: absolute; left: -2px; right: -2px; bottom: -2px; height: 11px; background: var(--main-color); z-index: -1; border-radius: 2px; }

.board-section { padding-bottom: 140px; }

.inquiry-section { padding-bottom: 140px; }
.inquiry-section .well { font-size: 15px; }
.inquiry-section .is-inner { max-width: 800px; margin: 0 auto; }
.inquiry-section .is-inner .article { }
.inquiry-section .is-inner .article + .article { margin: 64px 0 0;  }
.inquiry-section .is-inner .article .article-group { display: grid; grid-template-columns: 1fr; gap: 20px; }
.inquiry-section .is-inner .article .article-group.on2 { grid-template-columns: 1fr 1fr; }
.inquiry-section .is-inner .article .article-group + .article-group { margin: 16px 0 0; }
.inquiry-section .is-inner .article h2.title-deco { margin: 0 0 32px; }
.inquiry-section .is-inner .article .article-group .article-group-box > p { font-size: 14px; font-weight: 600; margin: 0 0 8px; line-height: 1.2; }
.inquiry-section .is-inner .article .article-group select {appearance: none;-webkit-appearance: none;-moz-appearance: none;background: #FAFAFA url("/img/select_arrow.png") center right no-repeat;background-size: 30px;display: block; width: 100%; height: 50px;border: 1px solid #ddd; border-radius: 8px; padding: 12px 16px; color: #646464; font-size: 16px;}
.inquiry-section .is-inner .article .article-group input[type="text"],
.inquiry-section .is-inner .article .article-group input[type="password"] { display: block; height: 50px; border-radius: 8px; border: 1px solid #ddd; width: 100%; padding: 16px; background: #FAFAFA; font-size: 16px; }
.inquiry-section .is-inner .article .article-group input[type="email"] { display: block; height: 50px; border-radius: 8px; border: 1px solid #ddd; width: 100%; padding: 16px; background: #FAFAFA; font-size: 16px; }
.inquiry-section .is-inner .article .article-group input[type="tel"] { display: block; height: 50px; border-radius: 8px; border: 1px solid #ddd; width: 100%; padding: 16px; background: #FAFAFA; font-size: 16px; }
.inquiry-section .is-inner .article .article-group .checkbox-group { height: 50px; border: 1px solid #ddd; padding: 8px 16px; background: #FAFAFA; border-radius: 8px; display: flex; gap: 24px; }
.inquiry-section .is-inner .article .article-group .checkbox-group label { display: flex; align-items: center; gap: 8px; }
.inquiry-section .is-inner .article .article-group .checkbox-group label input[type="radio"] { margin: 0; }
.inquiry-section .is-inner .article .article-group label:not(.btn) { font-size: 16px; font-weight: 400; margin: 0; cursor: pointer; }
/*.inquiry-section .is-inner .article .article-group select { display: block; width: 100%; height: 50px; background: #FAFAFA; border: 1px solid #ddd; border-radius: 8px; padding: 12px 16px; color: #646464; font-size: 16px; }*/

.inquiry-section .is-inner .article .article-group .file-wrap { display: grid; grid-template-columns: 1fr 80px; gap: 8px; position: relative; overflow: hidden; }
.inquiry-section .is-inner .article .article-group .file-wrap input[type="file"] { visibility: hidden; position: absolute; width: 1px; height: 1px; left: -10px; }
.inquiry-section .is-inner .article .article-group label.btn { display: flex; align-items: center; justify-content: center; }
.inquiry-section .is-inner .article .article-group textarea { display: block; width: 100%; height: 250px; background: #FAFAFA; border: 1px solid #ddd; border-radius: 8px; padding: 12px 16px; color: #646464; font-size: 16px; }
.inquiry-section .is-inner .article .article-group .fr-element { font-size: 16px; }

.inquiry-section .is-inner .article button.btn { width: 252px; height: 50px; color: #fff; background: #333333; margin: 0 auto; display: block; font-weight: 500; font-size: 16px; }

.inquiry-section .is-inner .article input[type="text"]:focus,
.inquiry-section .is-inner .article input[type="password"]:focus,
.inquiry-section .is-inner .article textarea:focus,
.inquiry-section .is-inner .article select:focus { outline: 1px solid #000; }

.privacy-wrap { display: flex; justify-content: space-between; }
.privacy-wrap .pw-box { display: flex; gap: 8px; align-items: center; cursor: pointer; }
.privacy-wrap .pw-box input[type="checkbox"] { margin: 0; width: 20px; height: 20px; border-radius: 2px; border: 1px solid #707070; }
.privacy-wrap a { font-size: 16px; font-weight: 400; color: #337AB7; }

.captcha-box { display: grid; gap: 20px; grid-template-columns: 160px 1fr; }

.tooltip { z-index: 2; }

.portfolio-section { padding-bottom: 140px; }

.self-estimate-section {  }
.self-estimate-section .inner { display: flex; gap: 40px; padding-bottom: 220px; }
.self-estimate-section .inner .left { flex: 9; }
.self-estimate-section .inner .right { flex: 3; }

.est-item-box {  }
.est-item-box + .est-item-box { margin: 54px 0 0;  }
.est-item-box h4 { display: flex; justify-content: space-between; align-items: end; margin: 0 0 16px; }
.est-item-box h4 span { font-size: 26px; font-weight: 500; position: relative; padding: 0 4px; }
.est-item-box h4 span:after { position: absolute; left: -2px; right: -2px; bottom: -2px; height: 11px; border-radius: 2px; background: var(--main-color); content: ''; z-index: -1; }
.est-item-box h4 small { font-size: 15px; font-weight: 500; color: #707070; }
.est-item-box .est-item-content { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }
.est-item-box .est-item-content .est-item { padding: 36px 30px; border-radius: 8px; border: 1px solid #ddd; display: flex; flex-direction: column; justify-content: space-between; min-height: 210px; gap: 40px; cursor: pointer; overflow-x: hidden; margin: 0; }
.est-item-box .est-item-content .est-item input { visibility: hidden; position: absolute; left: -999px; top: -999px; width: 1px; height: 1px; }
.est-item-box .est-item-content .est-item * { transition: none; }
.est-item-box .est-item-content .est-item .top { }
.est-item-box .est-item-content .est-item .top h5 { font-size: 20px; font-weight: 500; line-height: 1.4; }
.est-item-box .est-item-content .est-item .top p { font-size: 14px; font-weight: 400; color: #787878; margin: 12px 0 0; word-break: break-all; }
.est-item-box .est-item-content .est-item .price { margin-top: auto; font-size: 20px; font-weight: 500; }

.est-item-box .est-item-content .est-item.active { background: #333; color: #fff; border-color: #333; }
.est-item-box .est-item-content .est-item.active .top p { color: #ddd; }


.total-wrap { position: sticky; top: 120px; }
.total-wrap .total-content { border-radius: 8px; border: 1px solid #ddd; padding: 36px 30px; }
.total-wrap .total-content h4 { font-size: 20px; font-weight: 500; margin: 0 0 28px; }
.total-wrap .total-content .empty { font-size: 12px; font-weight: 500; text-align: center; padding: 80px 0; }
.total-wrap #inquiry-btn { display: flex; margin: 20px 0 0; height: 50px; align-items: center; justify-content: center; font-size: 16px; font-weight: 500; border-radius: 8px; cursor: pointer; background: #ffd400; color: #000; }
.total-wrap .right-form-box { margin: 20px 0; border: 1px solid #ddd; border-radius: 4px; }
.total-wrap .right-form-box input[type="text"].form-control,
.total-wrap .right-form-box input[type="email"].form-control { height: 50px; box-shadow: none; border: 0; }
.total-wrap .right-form-box input[type="text"].form-control:nth-child(1) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom: 1px solid #ddd; }
.total-wrap .right-form-box input[type="text"].form-control:nth-child(2) { border-radius: 0; border-bottom: 1px solid #ddd; }
.total-wrap .right-form-box input[type="email"].form-control { border-top-left-radius: 0; border-top-right-radius: 0; }

.total-article-box { min-height: 180px; display: flex; flex-direction: column; gap: 40px; }
.total-article-box .total-item {  }
.total-article-box .total-item li { list-style: none; display: flex; justify-content: space-between; font-size: 14px; }
.total-article-box .total-item li + li { margin-top: 16px; padding-top: 16px; border-top: 1px solid #eee; }
.total-article-box .total-price { display: flex; justify-content: space-between; font-size: 20px; font-weight: 600; margin-top: auto; }
.total-article-box .total-price span { font-weight: 600; }

/*#est_layer { }
#est_layer .modal-dialog { max-width: 460px; }
#est_layer .modal-content { background: none; box-shadow: none; border: 0; border-radius: 0; }
#est_layer .modal-content .modal-header { border: 0; }
#est_layer .modal-content .modal-title { color: #fff; }
#est_layer .modal-content input[type="text"].form-control,
#est_layer .modal-content input[type="email"].form-control { height: 50px; box-shadow: none; border: 0; }
#est_layer .modal-content input[type="text"].form-control:nth-child(1) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom: 1px solid #ddd; }
#est_layer .modal-content input[type="text"].form-control:nth-child(2) { border-radius: 0; border-bottom: 1px solid #ddd; }
#est_layer .modal-content input[type="email"].form-control { border-top-left-radius: 0; border-top-right-radius: 0; }
#est_layer .modal-content div.btn { height: 50px; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
#est_layer .modal-backdrop.in { opacity: .8;  }*/

.thanks-box.page-top {  }
.thanks-box.page-top .thanks-contents { text-align: center; }
.thanks-box.page-top .thanks-contents h1 { font-size: 40px; }
.thanks-box.page-top .thanks-contents h5 { font-size: 16px; font-weight: 400; line-height: 1.6; }
.thanks-box.page-top .thanks-contents p { font-size: 16px; font-weight: 700; margin: 40px 0 0; color: #FFD400; }

.p-est { display: flex; justify-content: space-between; max-width: 400px; margin: 0 auto; }
.p-est + .p-est { margin-top: 10px; }

.thanks-est-text { font-size: 13px; text-align: center; margin: 24px 0 0; }


.sidebar-btn { display: none; flex-direction: column; gap: 6px; padding: 12px; }
.sidebar-btn span { display: block; width: 30px; height: 3px; border-radius: 6px; background: #000; }
.header .header-contents.on .sidebar-btn span { background: #fff; }

nav ul.pagination { display: flex; align-items: center; justify-content: center; gap: 8px; }
nav ul.pagination li {}
nav ul.pagination li a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 100% !important; color: #000; }
nav ul.pagination li.active a { background: #ffd400; font-weight: 600; color: #000; border: 1px solid #ffd400; }
nav ul.pagination li.active a:hover { background: #e6c002; border: 1px solid #e6c002; }

.nopost { text-align: center; padding: 120px 80px !important; }

.empty-faq-contents { padding: 120px 0; text-align: center; }

.popup-wrap { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 20; }
.popup-wrap .popup-bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 14; width: 100%; height: 100%; background: rgba(0, 0, 0, .7); }
.popup-wrap .content { display: flex; width: 100%; height: 100%; position: relative; z-index: 15; align-items: center;; justify-content: center; }
.popup-wrap .content .img-box { display: block; position: relative; z-index: 16; }
.popup-wrap .content .img-box .img-content { border-radius: 30px; overflow: hidden; }
.popup-wrap .content .img-box img { max-width: 530px; display: block; width: 100%; }
.popup-wrap .content .close-box { position: absolute; bottom: -50px; left: 50%; z-index: 16; transform: translateX(-50%); }
.popup-wrap .content .close-box span { color: #333; background: #ffd400; padding: 8px 32px; border-radius: 20px; cursor: pointer; font-weight: 500; display: flex; align-items: center; gap: 4px; }