@charset "utf-8";

body {background-color:#f5f0eb}

.aboutBox {width:100%;height:100%;}
.aboutBox > .inner {display:flex;align-items: center;width:100%;height: 100%;max-width:1270px;margin:0 auto;min-height: calc(100vh - 75px);}
.aboutBox > .inner .imgBox {flex:1;text-align:center}
.aboutBox > .inner .imgBox img {max-width:414px;width:100%}
.aboutBox > .inner .txtBox {flex:1;padding-left:10px}
.aboutBox > .inner .txtBox h3 {font-size:36px;padding-top:5px;letter-spacing:0.5px}
.aboutBox > .inner .txtBox p {margin-top:18px;font-size:16px;line-height:2;letter-spacing:-0.25px;font-weight:300;font-family:'Noto Sans KR'}
.aboutBox > .inner .txtBox p > em {font-size:16px;font-weight:600}
.aboutBox > .inner .txtBox p.btype {font-weight:600}

.serviceBox > .inner {width:100%;height:100%;min-height: calc(100vh - 75px);max-width:1270px;margin:0 auto;display: flex;flex-direction: column;justify-content: center;align-items: center;padding:220px 0}
.serviceBox .hBox strong {display:block;text-align:center}
.serviceBox .hBox strong img {width:280px}
.serviceBox .hBox em {margin-top:20px;display:block;text-align:center;font-size:36px;letter-spacing:0.75px;line-height:1}
.serviceBox .BoxWrap {margin-top:80px;display:flex;gap:75px}
.serviceBox .dlBox {width: 404px;height: 525px;background-color: #fbf9f7; position: relative;}
.serviceBox .dlBox:before {content: ''; display:block;position: absolute;top: 0;left: 0;width: 315px;height: 0;border-bottom: 55px solid #fbf9f7; border-Left: 45px solid #f5f0eb; border-right: 45px solid #f5f0eb;}
.serviceBox .dlBox:after {content: '';display:block;position: absolute;bottom: 0; left: 0;width: 315px;height: 0;border-top: 55px solid #fbf9f7; border-left: 45px solid #f5f0eb; border-right: 45px solid #f5f0eb;}
.serviceBox .Box .titBox strong {display:block;text-align:center;font-size:30px;letter-spacing:0.75px;line-height:1;font-weight:500}
.serviceBox .Box .titBox em {display:block;text-align:center;font-size:19px;letter-spacing:0.75px;line-height:1.47;text-transform: uppercase;margin-top: 15px;}
.serviceBox .Box .dlBox {margin-top:45px;display:flex;flex-direction: column;padding: 0 50px;justify-content: center;height: 525px;}
.serviceBox .Box .dlBox dl {font-family:'Noto Sans KR';display: flex;flex-direction: column;align-items: center;}
.serviceBox .Box .dlBox dl + dl {margin-top: 40px;padding-top: 40px;border-top: 3px dotted #e9e7e6;}
.serviceBox .Box.type2 .dlBox dl + dl {margin-top: 25px;padding-top: 25px}
.serviceBox .Box .dlBox dl dt {font-size:20px;text-align:center;letter-spacing:-0.25px;font-weight:500;line-height:1;margin-bottom: 15px;}
.serviceBox .Box .dlBox dl dd {line-height:1.6;font-size:18px;color:#505050;text-align:center;/*display:block;*/letter-spacing:0;position:relative;font-weight: 300;}
/*.serviceBox .Box .dlBox dl dd:before {content:'-';display:block;position:absolute;top:0;left:0;font-size:18px;color:#505050;}*/
.serviceBox .Box .dlBox dl.line {position:relative;padding-top:0;border-bottom:2px solid #e2e0de;border-top:none;padding-bottom: 20px;margin: 15px 15px 0;}
.serviceBox .Box .dlBox dl.line:before {content:'';display:block;position:absolute;top:10px;left:0;width:2px;height: calc(100% - 10px);background-color:#e2e0de}
.serviceBox .Box .dlBox dl.line:after {content:'';display:block;position:absolute;top:10px;right:0;width:2px;height: calc(100% - 10px);background-color:#e2e0de}
.serviceBox .Box .dlBox dl.line dt:before {content:'';display:block;position:absolute;top:10px;left:0;width:calc(50% - 50px);height:2px;background-color:#e2e0de}
.serviceBox .Box .dlBox dl.line dt:after {content:'';display:block;position:absolute;top:10px;right:0;width:calc(50% - 50px);height:2px;background-color:#e2e0de}
.serviceBox .psBox {margin-top:60px;display:flex;flex-direction: column;align-items: center;}
.serviceBox .psBox p {text-align:center;padding-left:10px;position:relative;font-size:16px;font-weight:300;line-height:1.875;font-family:'Noto Sans KR' !important}
.serviceBox .psBox p:before {content:'*';display:block;position:absolute;top: 3px;left:0;font-size:16px;color:#000}

.contactBox > .inner {display:flex;align-items: center;width:100%;height: 100%;max-width:1270px;margin:0 auto;min-height: calc(100vh - 75px);}
.contactBox > .inner .mapBox {flex:0 1 50%;padding-left:110px}
.contactBox > .inner .mapBox > div {width:100%;height:430px;position:relative}
.contactBox > .inner .mapBox > div iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
.contactBox > .inner .infoBox {flex:0 1 50%}
.contactBox > .inner .infoBox h3 {font-size:36px;letter-spacing:0.5px;line-height:1;text-align: center;}
.contactBox > .inner .infoBox .snsBox {margin-top:65px;text-align: center;}
.contactBox > .inner .infoBox .snsBox strong {display:block;font-size:22px;letter-spacing:-0.5px;line-height:1;font-weight:500}
.contactBox > .inner .infoBox .snsBox .linkBox {margin-top:25px;display:flex;gap:15px;justify-content: center;}
.contactBox > .inner .infoBox .snsBox .linkBox li {width:55px;height:55px}
.contactBox > .inner .infoBox .snsBox .linkBox li a {display:flex;justify-content: center;width:100%;height:100%;align-items:center;background-color:#b99f85;border-radius:50%}
.contactBox > .inner .infoBox .snsBox .linkBox li a > span {font-size:0;display:inline-block;width:30px;height:30px;background:url(../img/ico_insta2.png) no-repeat 0 0/100%}
.contactBox > .inner .infoBox .snsBox .linkBox li:first-child a {background-color:#a4b6c2;}
.contactBox > .inner .infoBox .snsBox .linkBox li:last-child a {background-color:#9a8a78;}
.contactBox > .inner .infoBox .snsBox .linkBox li:first-child a > span {width:25px;height:30px;background-image:url(../img/ico_tel.png)}
.contactBox > .inner .infoBox .btnBox {margin-top:65px;display:flex;gap:15px;justify-content: center;}
.contactBox > .inner .infoBox .btnBox a {display:block;width:225px;height:55px;text-align:center;line-height:60px;font-size:16px;color:#fff;border-radius:40px;background-color:#676767;border:1px solid #676767;transition:all 0.3s ease}
.contactBox > .inner .infoBox .btnBox a:last-child {background-color:#fff;color:#676767}
.contactBox > .inner .infoBox .btnBox a:hover {background-color:#fff;color:#676767}
.contactBox > .inner .infoBox .btnBox a:last-child:hover {color:#fff;background-color:#676767}

.slbOverlay {background-color: #000;opacity: 0.5;animation: none;}
.slbCloseBtn {color:#fff;}
.slbImageWrap:after {box-shadow:none} 
.slbArrow {opacity:1}
.slbArrow:before {top: 50%;margin: 0;border: none;background: url(../img/btn_arrow2.png) no-repeat 0 0/100%;width: 15px;height: 29px;transform: translateY(-50%);}
.slbArrow.prev:before {transform: translateY(-50%) rotate(180deg);margin-left: -7.5px} 

.dressBox > .inner {width:100%;height: 100%;max-width:1270px;margin:0 auto;padding:220px 0}
.dressBox > .inner .hBox h3 {font-size:36px;letter-spacing:0.75px;line-height:1;text-align: center;}
.dressBox > .inner .hBox p {margin-top:25px;font-size:16px;letter-spacing:-0.25px;line-height:2;text-align: center;font-weight:300}
.dressBox .galleryBox {margin-top:110px}
.dressBox .galleryBox ul {display:flex;gap:30px;flex-wrap: wrap;}
.dressBox .galleryBox ul li {flex:0 1 calc(100%/5 - 120px/5)}
.dressBox .galleryBox ul li a {display:block;width:100%;height:0;padding-bottom:150%;position:relative}
.dressBox .galleryBox ul li img {position:absolute;top:0;left:0;width:100%;height: 100%;object-fit: cover;}
.nameBox {text-align:center;padding: 20px 0 30px;line-height:1;font-size:20px;letter-spacing:0.1px}
/* 페이징 스타일 */
.pagination {display: flex;justify-content: center;margin-top: 130px;gap: 10px;}
.pagination button {padding: 8px;font-family:'Noto Sans KR';cursor: pointer;font-size: 24px;color:#b7b7b7;transition: all 0.2s;cursor: pointer;}
.pagination button:hover:not(:disabled) {color: #000;}
.pagination button.active {color: #000;}
.pagination button:disabled {cursor: default;color: #b7b7b7;}
.pagination .arrow {color:#000}
.slbImage {padding: 50px 0;max-height: 100vh;}
.sl-counter { position: absolute; top: 20px; left: 20px; color: #fff; font-size: 18px;font-family:'Noto Sans KR'}
.slbNameHolder {color: #000;text-align: center;font-size: 32px;position: absolute;bottom: 110px;letter-spacing: 0.1px;width: 100%;}
.floatingMenu ul li a {border-color:#000}
.floatingMenu ul li a > span {filter: invert(90%) sepia(8%) saturate(445%) hue-rotate(321deg) brightness(110%) contrast(92%);}



    @media (max-width: 1270px) {

.dressBox > .inner {padding:220px 40px}


}

    @media (max-width: 1240px) {

.aboutBox > .inner {flex-wrap: wrap;}
.aboutBox > .inner .imgBox {flex:0 1 450px;flex-shrink: 0;}
.aboutBox > .inner .txtBox {width:100%}
.contactBox > .inner .mapBox {padding-left:40px}
.dressBox .galleryBox ul li {flex:0 1 calc(100%/3 - 60px/3)}


}


@media all and (max-width : 1023px) {

.mHeader, .mHeader.fixed {background-color:transparent !important}
.aboutBox > .inner {flex-direction: column;flex-wrap: nowrap;padding: 18vw 5.56vw;height:100%;min-height: calc(100vh - 50px);}
.aboutBox > .inner .imgBox {flex:1}
.aboutBox > .inner .imgBox img {max-width:57.50vw;}
.aboutBox > .inner .txtBox {padding-left:0;margin-top: 10vw;}
.aboutBox > .inner .txtBox h3 {font-size:5.00vw;padding-top:0.69vw;letter-spacing:0.07vw}
.aboutBox > .inner .txtBox p {margin-top:2.50vw;font-size:2.22vw;letter-spacing:-0.03vw}
.aboutBox > .inner .txtBox p > em {font-size:2.22vw;letter-spacing:-0.03vw}
.serviceBox > .inner {min-height: calc(100vh - 50px);max-width:100%;padding: 15vw 0;}
.serviceBox .hBox strong img {width:38.89vw}
.serviceBox .hBox em {margin-top:2.78vw;font-size:5.00vw;letter-spacing:0.10vw}
.serviceBox .BoxWrap {margin-top:11.11vw;display:flex;gap:10.42vw;flex-direction: column}
.serviceBox .Box .dlBox {width: 56vw;height: 72.92vw;padding: 0 6.94vw;}
.serviceBox .Box .dlBox:before {width: 43.75vw;border-bottom: 7.64vw solid #fbf9f7; border-Left: 6.25vw solid #f5f0eb; border-right: 6.25vw solid #f5f0eb;}
.serviceBox .Box .dlBox:after {width: 43.75vw;border-top: 7.64vw solid #fbf9f7; border-left: 6.25vw solid #f5f0eb; border-right: 6.25vw solid #f5f0eb;}
.serviceBox .Box .titBox strong {font-size:4.17vw;letter-spacing:0.10vw;}
.serviceBox .Box .titBox em {font-size:2.64vw;letter-spacing:0.10vw;margin-top: 2.08vw;}
.serviceBox .Box .dlBox dl + dl {margin-top: 5.56vw;padding-top: 5.56vw;border-top: 0.42vw dotted #e9e7e6;}
.serviceBox .Box.type2 .dlBox dl + dl {margin-top: 3.47vw;padding-top: 3.47vw}
.serviceBox .Box .dlBox dl dt {font-size:2.78vw;letter-spacing:-0.03vw;margin-bottom: 2.08vw;}
.serviceBox .Box .dlBox dl dd {font-size:2.50vw;}
.serviceBox .Box .dlBox dl.line {border-bottom:0.28vw solid #e2e0de;padding-bottom: 2.78vw;margin: 2.08vw 2.08vw 0;}
.serviceBox .Box .dlBox dl.line:before {top:1.39vw;width:0.28vw;height: calc(100% - 1.39vw)}
.serviceBox .Box .dlBox dl.line:after {top:1.39vw;width:0.28vw;height: calc(100% - 1.39vw)}
.serviceBox .Box .dlBox dl.line dt:before {top:1.39vw;width:calc(50% - 6.94vw);height:0.28vw;}
.serviceBox .Box .dlBox dl.line dt:after {top:1.39vw;width:calc(50% - 6.94vw);height:0.28vw;}
.serviceBox .psBox {margin-top:8.33vw;}
.serviceBox .psBox p {padding-left:1.39vw;font-size:2.22vw;}
.serviceBox .psBox p:before {top: 0.42vw;font-size:2.22vw}
.contactBox > .inner {min-height: calc(100vh - 50px);max-width:100%;padding: 15vw 5.56vw;flex-direction: column-reverse;display: flex;justify-content: center;}
.contactBox > .inner .mapBox {flex:none;width:100%;padding-left:0;margin-top: 10vw;}
.contactBox > .inner .mapBox > div {height:59.72vw}
.contactBox > .inner .infoBox {flex:none;width:100%;}
.contactBox > .inner .infoBox h3 {font-size:5.00vw;letter-spacing:0.07vw;}
.contactBox > .inner .infoBox .snsBox {margin-top:9.03vw;}
.contactBox > .inner .infoBox .snsBox strong {font-size:3.06vw;letter-spacing:-0.07vw;}
.contactBox > .inner .infoBox .snsBox .linkBox {margin-top:3.47vw;gap:2.08vw;}
.contactBox > .inner .infoBox .snsBox .linkBox li {width:7.64vw;height:7.64vw}
.contactBox > .inner .infoBox .snsBox .linkBox li a > span {width:4.17vw;height:4.17vw;}
.contactBox > .inner .infoBox .snsBox .linkBox li:first-child a > span {width:3.47vw;height:4.17vw;}
.contactBox > .inner .infoBox .btnBox {margin-top:9.03vw;gap:2.08vw;;}
.contactBox > .inner .infoBox .btnBox a {width:31.25vw;height:7.64vw;line-height:8.33vw;font-size:2.22vw;border-radius:5.56vw;border:0.14vw solid #676767;}
.dressBox > .inner {max-width:100%;padding:30.56vw 5.56vw}
.dressBox > .inner .hBox h3 {font-size:5.00vw;letter-spacing:0.10vw;}
.dressBox > .inner .hBox p {margin-top:3.47vw;font-size:2.22vw;letter-spacing:-0.03vw;}
.dressBox .galleryBox {margin-top:15.28vw}
.dressBox .galleryBox {margin-top:15.28vw}
.dressBox .galleryBox ul {gap:4.17vw;}
.dressBox .galleryBox ul li {flex:0 1 calc(100%/3 - 8.34vw/3)}
.nameBox {text-align:center;padding: 2.78vw 0 4.17vw;font-size:3.5vw;letter-spacing:0.01vw}
.slbWrapOuter {max-height:100vh}
.slbContentOuter {position: absolute;left:0;padding: 0;width: 100%;height:100vh}
.slbImage {padding: 6.94vw 0;}
.sl-counter {top: 2.78vw;left: 2.78vw;font-size: 2.50vw}
.slbNameHolder {font-size: 4.44vw;bottom: 15.28vw;letter-spacing: 0.01vw;}
.slbContent {position: absolute;top: 50%;transform: translate(-50%,-50%);left: 50%;width: max-content;max-width: 100%;}
.pagination {margin-top: 18.06vw;gap: 1.39vw;}
.pagination button {padding: 1.11vw;font-size: 3.33vw;}


footer {padding:5.56vw 0}
}  
    @media (min-width: 768px) {

}





@media (max-width: 767px) {

.dressBox .galleryBox ul li {flex:0 1 calc(100%/2 - 4.17vw/2)}

}

  @media (max-width: 580px) {

}

@media (max-width: 480px) {

}  
  
@media (max-width: 320px) {

}