@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.chk-wrap {display:flex; align-items:center; height:44px; gap:var(--space-20);}

.greeting {margin-top:var(--space-80); display:flex;}
.greeting .col-l {width:52%; font-size:var(--font-size-40); color:var(--color-bk); font-weight:700; letter-spacing:-.03em; line-height:1.3em;}
.greeting .col-l span {color:var(--color-primary);}
.greeting .col-r {flex:1;}
.greeting .group {margin-bottom:var(--space-50);}
.greeting .group:last-child {margin-bottom:0;}
.greeting .txt1 {font-size:var(--font-size-24); margin-bottom:var(--space-20); letter-spacing:-.03em; line-height:1.42em; font-weight:600; color:var(--color-bk);}

.root_daum_roughmap,
.root_daum_roughmap .wrap_map {height:clamp(250px, calc( 460 / var(--inner) * 100vw ), 460px) !important; width:100% !important;}
.root_daum_roughmap .cont {display:none !important;}

.directions {margin-top:var(--space-50); display:flex;}
.directions svg {vertical-align:middle; margin:-.2em 12px 0 0;}
.directions path {fill:var(--color-secondary);}

.directions .address-info {width:50%;}
.directions .address-info .addr {color:var(--color-bk); font-size:var(--font-size-24); font-weight:600; line-height:1.33em; letter-spacing:-.03em;}
.directions .contact-info {display:grid; gap:var(--space-25);line-height:1.5em; flex:1;}
.directions .contact-info dl {display:flex;}
.directions .contact-info dt {margin-right:15px; color:var(--color-bk); font-size:var(--font-size-18); font-weight:600;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%;}

.review-list {margin:0 -10px -50px; display:flex; flex-wrap:wrap;}
.review-list .item {width:25%; padding:0 10px 50px; overflow:hidden;}
.review-list .doc-btn {margin-top:var(--space-35);}
.review-box {box-shadow:1px 3px 10px rgba(0,0,0,.2); border-radius:20px; overflow:hidden;}
.review-box .image {overflow:hidden;}
.review-box .thumb {position:relative; padding-bottom:72%; overflow:hidden;}
.review-box .thumb img {position:absolute; top:50%; left:0; transition:.3s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}

.review-content {padding:var(--space-25) var(--space-30) var(--space-40);}
.review-content .title {height:2.6em; line-height:1.3em; letter-spacing:-.03em; font-size:var(--font-size-22); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; font-weight:700; color:var(--color-bk);}
.review-content .txt {margin-top:var(--space-15); font-size:var(--font-size-14); height:4.2em; line-height:1.4em; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis; overflow:hidden; color:#878787;}
.review-content .info {padding-top:var(--space-20); margin-top:var(--space-15); align-items:center; display:flex; border-top:1px solid #ddd;}
.review-content .info img {vertical-align:middle;}
.review-content .info .name {gap:10px; display:flex; flex:1; align-items:center;}
.review-content .info .name i {width:35px; height:35px; background-image:url('/images/sub/avatar.png'); background-repeat:no-repeat; background-position:50% 50%; background-size:contain; display:inline-block;}
.review-content .info .date {color:#878787;}
.review-content a {min-width:100%;}
.review-list .item:hover .thumb {transform:scale(1.05); transition:.3s ease-in-out;}

.review-content.ty2 .txt {-webkit-line-clamp:3; height:2.8em;}

.review-detail {display:flex; gap:var(--space-40);}
.review-img {width:60.8%;}
.review-img .doc-btn .btn {max-width:540px;}

.review-for {position:relative;}
.review-for .img {border-radius:var(--radius-30); position:relative; padding-bottom:94%; overflow:hidden;}
.review-for .img:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #ddd; border-radius:var(--radius-30); z-index:1;}
.review-for .img img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.review-for .slick-arrow {width:var(--slide-arrow); height:var(--slide-arrow); z-index:100; position:absolute; top:50%; transform:translateY(-50%); border:0; font-size:0; line-height:0; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; background-size:contain; z-index:1;}
.review-for .slick-prev {left:var(--space-20); background-image:url("/images/sub/review-prev.png");}
.review-for .slick-next {right:var(--space-20); background-image:url("/images/sub/review-next.png");}
.review-for .slick-prev:hover {background-image:url("/images/sub/review-prev-on.png");}
.review-for .slick-next:hover {background-image:url("/images/sub/review-next-on.png");}
 
.review-nav {max-width:510px; margin:var(--space-20) auto var(--space-40);}
.review-nav .item {padding:0 5px;}
.review-nav .img {position:relative; padding-bottom:75%; overflow:hidden;}
.review-nav .img img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}

.review-text {flex:1;}
.review-text .box {padding:var(--space-30); background-color:#fafafa; border-radius:var(--radius-20); border:1px solid #ddd; margin-bottom:var(--space-40);}
.review-text .box:last-child {margin-bottom:0;}
.review-text .title {font-size:var(--font-size-22); margin-bottom:var(--space-30); padding:0 var(--space-30); height:56px; border-radius:var(--radius-30); align-items:center; display:inline-flex; font-weight:700; letter-spacing:-.03em; line-height:1.4em; background-color:#fff; color:var(--color-bk); border:1px solid #878787;} 
.review-text .inner {max-height:370px; overflow-y:scroll;} 

/* 팝업스타일 */
.modal {box-shadow:none; border-radius:15px; width:100%; padding:0; max-width:720px;}
.modal a.close-modal {width:20px; height:20px; top:var(--space-30); right:var(--space-30); transform:translateX(-50%); background-size:contain; background-image:url(../images/bbs/modal_cls.png);}

.pop-wrap {padding:var(--space-55) var(--space-40);}
.pop-head {margin-bottom:var(--space-40); text-align:center; color:var(--color-bk);}
.pop-head h2 {font-size:var(--font-size-35); letter-spacing:-.03em; line-height:1.2em; font-weight:700;}
.pop-head p {font-size:var(--font-size-20); margin-top:var(--space-30); letter-spacing:-.03em; line-height:1.2em;}

.pop-form .form {display:grid; gap:var(--space-25);}
.pop-form dt {font-size:var(--font-size-20); margin-bottom:12px; font-weight:700; color:var(--color-bk); letter-spacing:-.03em; line-height:1.2em;}
.pop-form dd .input {border-radius:7px;}
.pop-form dd .captcha-wrap .input {width:100%;}
.pop-form dd .input,
.pop-form dd .captcha-wrap,
.pop-form .chk-wrap {height:52px;}
.pop-form .chk-wrap {padding:0 var(--space-20); border-radius:7px; border:1px solid #ddd;}
.pop-form .chk-wrap .radiobox {margin-top:0;}
.pop-form .form-agree {margin:var(--space-45) 0 var(--space-30);}
.pop-form .buttons {margin:0;}
.pop-form .buttons .btn-pack {border-radius:30px;}