@charset "utf-8"; /* common */ #visual{position:relative;width:100%;height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#A3907433;} #visual .image{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;} #visual .image img{width:100%;height:100%;object-fit:cover;} #visual .title{position:relative;z-index:2;line-height:76px;font-size:54px;font-weight:300;color:#ffffff;margin:0 0 16px;font-family:'Bookk', sans-serif;} #visual .text{position:relative;z-index:2;line-height:25px;font-size:18px;font-weight:400;color:#ffffff;} @media all and (max-width:748px) { #visual{height:227px;} #visual .title{line-height:45px;font-size:32px;margin:0 0 8px;} #visual .text{line-height:22px;font-size:16px;} } /* pages/about.php */ #about{position:relative;} #about .visual{position:relative;width:100%;height:auto;aspect-ratio:1920/900;background:#76644c url("../img/about/about.jpg") no-repeat 50% 50% / cover;} #about .visual .text{position:absolute;z-index:5;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-shadow:0 0 10px rgb(0 0 0 / 20%);} #about .visual .text .tit{line-height:84px;font-size:60px;font-weight:300;color:#ffffff;font-family:'Bookk', sans-serif;} #about .visual .text .txt{line-height:31px;font-size:22px;font-weight:500;color:#ffffff;margin:40px 0 0 0;} #about .visual .scroll{position:absolute;bottom:0;left:50%;width:2px;height:70px;background:rgb(255 255 255 / 20%);overflow:hidden;} #about .visual .scroll:before{content:'';position:absolute;top:-40px;left:0;width:2px;height:40px;background:#ffffff;animation: scroll 3s ease-in-out infinite;} #about .greeting{position:relative;display:flex;align-items:center;padding:120px 15px;} #about .greeting .text{flex:1;margin:0 85px;} #about .greeting .text .eng{line-height:45px;font-size:32px;font-weight:500;color:#c5a880;margin:0 0 16px 0;font-family:'Cormorant Garamond', sans-serif;font-style:italic;} #about .greeting .text .tit{line-height:56px;font-size:40px;font-weight:300;color:#222222;margin:0 0 80px 0;font-family:'Bookk', sans-serif;} #about .greeting .text .tit span{color:#C5A880;font-family:'Bookk', sans-serif;} #about .greeting .text .txt{line-height:25px;font-size:18px;font-weight:300;color:#222222;margin:0 0 64px 0;} #about .greeting .text .txt strong{font-weight:600;} #about .greeting .text .sign{} #about .greeting .image{width:624px;height:auto;aspect-ratio:624 / 730;} #about .greeting .image img{width:100%;height:100%;object-fit:cover;} #about .recommend{position:relative;display:flex;align-items:center;padding:80px 15px 120px;background:#F9F6F2;overflow:hidden;} #about .recommend .text{flex:1;margin:0 40px 0 85px;} #about .recommend .text .tit{line-height:84px;font-size:60px;font-weight:500;color:#222222;margin:0 0 24px 0;font-family:'Cormorant Garamond', sans-serif;font-style:italic;} #about .recommend .text .txt{line-height:28px;font-size:20px;font-weight:500;color:#666666;} #about .recommend .slider{position:relative;width:972px;max-width:100%;margin:0 25px 0 0;pointer-events: none;} #about .recommend .slider .scroll{position:relative;height:700px;} #about .recommend .slider .image{position:relative;-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important;transition-duration: 12000ms;} #about .recommend .slider .image ul{width:100%;display:flex;flex-wrap:wrap;gap:40px;height: auto;flex: 0 0 auto;} #about .recommend .slider .image li{display:flex;flex-direction:column;align-items:center;text-align:center;width:calc(50% - 20px);} #about .recommend .slider .image li:nth-child(even){margin-top:180px;} #about .recommend .slider .image li img{width:100%;height:auto;aspect-ratio:1/1;} #about .recommend .slider .image li strong{display:block;margin:24px 0 0 0;line-height:31px;font-size:22px;font-weight:500;color:#222222;} #about .recommend .slider .image li span{display:block;margin:15px 0 0 0;line-height:22px;font-size:16px;font-weight:300;color:#666666;} #about .treatment{position:relative;padding:120px 15px;background:#ffffff;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;} #about .treatment .header{margin:0 0 40px 0;} #about .treatment .header .tit{line-height:76px;font-size:54px;font-weight:500;color:#c5a880;margin:0 0 16px 0;font-family:'Cormorant Garamond', sans-serif;font-style:italic;} #about .treatment .header .txt{line-height:28px;font-size:20px;font-weight:300;color:#222222;font-family:'Bookk', sans-serif;} #about .treatment .content{} #about .treatment .content ul{display:flex;width:1220px;max-width:100%;} #about .treatment .content li{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:auto;aspect-ratio:1/1;border-radius:50%;background:rgb(197 168 128 / 10%);} #about .treatment .content li + li{margin-left:-20px;} #about .treatment .content li img{width:80px;max-width:100%;height:auto;aspect-ratio:1/1;margin:0 0 4px 0;} #about .treatment .content li span{height:50px;line-height:25px;font-size:18px;font-weight:300;color:#c5a880;} /* pages/location.php */ #location{} #location .info{position:relative;margin:0;width:100%;background:#ffffff;padding:120px 100px;} #location .info .flex{margin:0 auto;width:100%;max-width:100%;display:flex;gap:100px;} #location .info .title{line-height:45px;font-size:32px;font-weight:500;color:#272119;margin:0 0 24px;} #location .info .location{flex:1;padding-right:100px;display:flex;flex-direction:column;} #location .info .location .text{flex:1;display:flex;flex-direction:column;gap:16px;} #location .info .location .text dl{display:flex;align-items:center;line-height:28px;font-size:20px;color:#272119;gap:24px;} #location .info .location .text dt{min-width:80px;flex:0 0 auto;font-weight:500;} #location .info .location .text dd{font-weight:300;} #location .info .location .text dd strong{line-height:42px;font-size:30px;font-weight:500;color:#272119;} #location .info .treat{flex:1;display:flex;flex-direction:column;} #location .info .treat .text{flex:1;display:flex;flex-wrap:wrap;gap:8px 30px;} #location .info .treat .text dl{display:flex;align-items:center;line-height:28px;font-size:20px;color:#272119;width:100%;gap:24px;} #location .info .treat .text dt{min-width:70px;flex:0 0 auto;font-weight:500;} #location .info .treat .text dd{font-weight:300;} #location .info .treat .text dd strong{line-height:45px;font-size:32px;font-weight:500;color:#272119;} #location .info .treat .warn{margin-top:16px;line-height:25px;font-size:18px;font-weight:300;color:#b62024;} #location .info .button{margin-top:40px;display:flex;gap:16px;} #location .info .button a{flex:1;display:flex;align-items:center;justify-content:center;height:57px;font-size:18px;font-weight:500;color:#ffffff;gap:8px;} #location .info .button a.kakao{background:#c5a880;} #location .info .button a.kakao:before{content:'';width:24px;height:24px;background:url("../img/main/kakao.svg") no-repeat 50% 50% / contain;} #location .info .button a.kakao2{background:#4E4333;} #location .info .button a.kakao2:before{content:'';width:24px;height:24px;background:url("../img/main/kakao2.svg") no-repeat 50% 50% / contain;} #location .info .button a.naver{background:#c5a880;} #location .info .button a.naver:before{content:'';width:24px;height:24px;background:url("../img/main/naver.svg") no-repeat 50% 50% / contain;} #location .method{position:relative;padding:80px 100px;display:flex;gap:200px;background:#F9F6F2 url("../img/location/method.png") no-repeat right bottom;} #location .method .box{flex:1;} #location .method .tit{display:flex;align-items:center;gap:12px;line-height:40px;font-size:32px;font-weight:500;color:#222222;margin:0 0 40px;} #location .method .txt{line-height:28px;font-size:20px;font-weight:500;color:#222222;margin:0 0 24px 0;} #location .method .txt span{color:#c5a880} #location .method .con{display:flex;flex-direction:column;gap:8px;} #location .method .con dl{display:flex;align-items:flex-start;line-height:34px;gap:16px;} #location .method .con dt{padding:6px 16px;line-height:22px;font-size:16px;font-weight:300;color:#ffffff;background:#000000;min-width:70px;text-align:center;} #location .method .con dt.red{background:#FB5852} #location .method .con dt.blue{background:#386DE8;} #location .method .con dt.orange{background:#FF7300;} #location .method .con dt.green{background:#3CC344;} #location .method .con dt.darkgreen{background:#697215;} #location .method .con dt.black{background:#000000;} #location .method .con dd{padding:4.5px 0;line-height:25px;font-size:18px;color:#222222;} #location .map{position:relative;margin:0;width:100%;height:640px;background:#ffffff;} #location .map .root_daum_roughmap{width:100% !important;height:100% !important;object-fit:cover;} /**/ #cosmetic{position:relative;} #cosmetic .search_wrap{position:relative;margin:0 0 24px 0;display:flex;justify-content:flex-end;margin-top:64px;} #cosmetic .search_wrap .form{display:flex;align-items:center;justify-content:center;border:1px solid #d2d2d2;height:45px;width:518px;max-width:calc(100% - 32px);padding:0 16px;} #cosmetic .search_wrap .form .inp{flex:1;width:100%;height:43px;padding:12px 0;line-height:21px;font-size:15px;color:#222222;} #cosmetic .search_wrap .form .btn{flex:0 0 auto;width:20px;height:20px;display:flex;align-items:center;justify-content:center;} #cosmetic .list_wrap{position:relative;} #cosmetic .list_wrap .list{display:flex;flex-wrap:wrap;border-top:2px solid #222222;border-bottom:1px solid #222222;gap:8px;padding:24px 0;} #cosmetic .list_wrap .list li{width:calc(33.33% - 5.3px);} #cosmetic .list_wrap .list li a{} #cosmetic .list_wrap .list li .img{overflow:hidden;width:100%;height:auto;aspect-ratio:1/1;margin:0 0 24px 0;} #cosmetic .list_wrap .list li .img img{display:block;width:100%;height:100%;object-fit:cover;} #cosmetic .list_wrap .list li .txt{padding:0 8px 0 8px;line-height:31px;font-size:22px;font-weight:500;color:#111111;} #cosmetic .detail_wrap{} #cosmetic .detail_wrap .inner{max-width:1920px;margin:0 auto;width: 100%;} #cosmetic .detail_wrap .product{} #cosmetic .detail_wrap .product .inner{padding:16px;display:flex;gap:8px;} #cosmetic .detail_wrap .product .image{width:calc(50% - 4px);height:auto;aspect-ratio:1/1;background:#ffffff;} #cosmetic .detail_wrap .product .image img{width:100%;height:100%;object-fit:cover;} #cosmetic .detail_wrap .product .info{width:calc(50% - 4px);padding:80px;display:flex;flex-direction:column;justify-content:center;background:#F9F6F2;} #cosmetic .detail_wrap .product .info .name{line-height:76px;font-size:54px;font-weight:300;color:#111111;font-family: 'Bookk', sans-serif;margin:0 0 24px 0;} #cosmetic .detail_wrap .product .info .text{border-top:3px solid #000;border-bottom:1px solid #000;padding:32px 0;line-height:25px;font-size:18px;font-weight:300;color:#222222;} #cosmetic .detail_wrap .product .info .text strong{display:block;margin:24px 0 0;font-size:20px;font-weight:500;} #cosmetic .detail_wrap .product .info .price{display:flex;margin:24px 0 0 0;align-items:center;line-height:24px;font-size:32px;font-weight:500;color:#909090;} #cosmetic .detail_wrap .product .info .price strong{font-size:32px;font-weight:500;color:#111111;} #cosmetic .detail_wrap .product .info .price span{font-size:24px;font-weight:400;color:#909090;} #cosmetic .detail_wrap .product .info .button{margin:48px 0 0 0;display:flex;align-items:center;justify-content:center;} #cosmetic .detail_wrap .product .info .button a{flex:1;display:flex;align-items:center;justify-content:center;width:100%;height:71px;background:#c5a880;font-size:22px;font-weight:500;color: #111111;gap:16px;} #cosmetic .detail_wrap .product .info .button a:after{content:'';width:24px;height:24px;background:url("../img/sub/buy_arrow.svg") no-repeat 50% 50% / contain;} #cosmetic .detail_wrap .recommend{position:relative;padding:120px 0;text-align:center;} #cosmetic .detail_wrap .recommend .header{margin:0 0 100px 0;} #cosmetic .detail_wrap .recommend .header .tit{line-height:56px;font-size:40px;font-weight:300;color:#222222;font-family: 'Bookk', sans-serif;} #cosmetic .detail_wrap .recommend .list{padding:0 16px;} #cosmetic .detail_wrap .recommend .list ul{display:flex;gap:8px;} #cosmetic .detail_wrap .recommend .list li{flex:1;position:relative;top:0;height: auto;display:flex;flex-direction:column;align-items:center;justify-content:center;height: 503px;} #cosmetic .detail_wrap .recommend .list li .img{position:relative;z-index:1;top:0;left:0;width:100%;height:100%;} #cosmetic .detail_wrap .recommend .list li .img img{width:100%;height:100%;display:block;object-fit:cover;} #cosmetic .detail_wrap .recommend .list li .txt{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;line-height:28px;font-size:20px;font-weight:500;color:#ffffff;background:rgb(0 0 0 / 80%);opacity:1;} #cosmetic .detail_wrap .recommend .list li:hover{position:relative;top:-24px;box-shadow:0 2px 15px rgb(0 0 0 / 3%), 0 4px 20px rgb(0 0 0 / 4%), 0 8px 25px rgb(0 0 0 / 5%), 0 16px 30px rgb(0 0 0 / 6%);} #cosmetic .detail_wrap .recommend .list li:hover .txt{opacity:0;} #cosmetic .detail_wrap .formation{position:relative;align-items:center;padding:80px 16px 120px;overflow:hidden;} #cosmetic .detail_wrap .formation .inner{display:flex;align-items:center;} #cosmetic .detail_wrap .formation .text{flex:1;margin:0 40px 0 85px;} #cosmetic .detail_wrap .formation .text .tit{line-height:67px;font-size:48px;font-weight:700;color:#222222;margin:0 0 48px 0;font-family: 'Cormorant Garamond', 'Bookk', sans-serif;} #cosmetic .detail_wrap .formation .text .txt{line-height:25px;font-size:18px;font-weight:400;color:#222222;} #cosmetic .detail_wrap .formation .slider{position:relative;width:972px;max-width:100%;margin:0 25px 0 0;pointer-events: none;} #cosmetic .detail_wrap .formation .slider .scroll{position:relative;height:700px;} #cosmetic .detail_wrap .formation .slider .image{position:relative;-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important;transition-duration: 12000ms;} #cosmetic .detail_wrap .formation .slider .image ul{width:100%;display:flex;flex-wrap:wrap;gap:40px;height: auto;flex: 0 0 auto;} #cosmetic .detail_wrap .formation .slider .image li{display:flex;flex-direction:column;align-items:center;text-align:center;width:calc(50% - 20px);} #cosmetic .detail_wrap .formation .slider .image li:nth-child(even){margin-top:180px;} #cosmetic .detail_wrap .formation .slider .image li img{width:100%;height:auto;aspect-ratio:1/1;} #cosmetic .detail_wrap .formation .slider .image li strong{display:block;margin:24px 0 0 0;line-height:34px;font-size:24px;font-weight: 500;color:#222222;} #cosmetic .detail_wrap .formation .slider .image li strong.eng{font-family:'Cormorant Garamond', 'Pretendard', sans-serif;} #cosmetic .detail_wrap .formation .slider .image li span{display:block;margin:16px 0 0 0;line-height:22px;font-size:16px;font-weight:300;color:#666666;font-family:'Pretendard', sans-serif;} #cosmetic .detail_wrap .formation .slider .product{position:relative;-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important;transition-duration: 12000ms;} #cosmetic .detail_wrap .formation .slider .product ul{width:100%;display:flex;flex-wrap:wrap;gap:24px;height: auto;flex: 0 0 auto;} #cosmetic .detail_wrap .formation .slider .product li{display:flex;flex-direction:row;align-items:center;text-align:center;width:100%} #cosmetic .detail_wrap .formation .slider .product li .img{flex:0 0 auto;width:280px;height:280px;background:#F9F6F2;} #cosmetic .detail_wrap .formation .slider .product li .img img{width:100%;height:100%;object-fit:contain;} #cosmetic .detail_wrap .formation .slider .product li .con{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;height:280px;text-align:left;padding:0 0 0 32px;gap:16px;} #cosmetic .detail_wrap .formation .slider .product li .tit{line-height:31px;font-size:22px;font-weight:500;color:#222222;} #cosmetic .detail_wrap .formation .slider .product li .txt{line-height:22px;font-size:16px;font-weight:300;color:#666666;word-break:keep-all;} #cosmetic .detail_wrap .customer{position:relative;padding:120px 100px;background:#F9F6F2 url("../img/procedure/customer_icon.png") no-repeat right 40px bottom 40px / auto 240px;} #cosmetic .detail_wrap .customer .inner{display:flex;flex-direction:column;gap:120px 0;} #cosmetic .detail_wrap .customer .header{flex:0 0 290px;} #cosmetic .detail_wrap .customer .header .tit{line-height:56px;font-size:40px;font-weight:300;color:#C5A880;font-family: 'Bookk', sans-serif;} #cosmetic .detail_wrap .customer .list{flex:1 1;} #cosmetic .detail_wrap .customer .used{display:flex;} #cosmetic .detail_wrap .customer .used .list{} #cosmetic .detail_wrap .customer .used .list > ul{} #cosmetic .detail_wrap .customer .used .list > ul > li{padding:24px 32px;line-height:31px;font-size:22px;font-weight:500;color:#111111;background:#ede4d8;} #cosmetic .detail_wrap .customer .qna{display:flex;} #cosmetic .detail_wrap .customer .qna .list{border-top:2px solid #222222;border-bottom:2px solid #222222;} #cosmetic .detail_wrap .customer .qna .list > ul{} #cosmetic .detail_wrap .customer .qna .list > ul > li{border-bottom:1px solid #D2D2D2;} #cosmetic .detail_wrap .customer .qna .list > ul > li:last-child{border-bottom:0;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a{display:flex;gap:32px;align-items:flex-start;justify-content:flex-start;padding:24px 40px;width:100%;min-height:104px;line-height:32px;font-size:22px;font-weight:500;color:#222222;background:transparent;cursor:pointer;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a:before{content:'Q';line-height:56px;font-size:40px;font-weight:700;font-family: 'Cormorant Garamond', sans-serif;font-style:italic;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a:after{content:'';margin:16px 0;width:24px;height:24px;background:url("../img/procedure/plus.svg") no-repeat 50% 50%;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a span{flex:1;padding:12px 0;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b{display:none;position:relative;gap:16px;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:24px 44px 24px 100px;width:100%;min-height:77px;line-height:25px;font-size:18px;font-weight:300;color:#222222;word-break:keep-all;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b:before{content:'A';font-size:32px;font-weight:700;font-family: 'Cormorant Garamond', sans-serif;font-style:italic;position:absolute;top:24px;left:44px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b span{font-weight:400;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b span strong{font-weight:700;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b ul{} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b ul li{position:relative;padding:0 0 0 16px;line-height: 25px;font-size:16px;color:#111111;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b ul li + li{margin-top:8px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b ul li:before{content:'';position:absolute;top: 8px;left:0;width:6px;height:6px;background:#C5A880;transform:rotate(45deg);} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b ul li strong{font-weight:600;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table{text-align:center;width:100%;max-width:900px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table tr{height:49px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table th{padding:12px;font-size:16px;background:#EDE4D8;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table td{padding:12px;font-size:16px;border-bottom:1px solid #EDE4D8;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on{border-bottom:1px solid #222222;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_a{color:#ffffff;background:#111111;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_a:after{content:'';width:24px;height:24px;background:url("../img/procedure/minus.svg") no-repeat 50% 50%;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_b{display:flex;} #cosmetic .detail_wrap .customer .caution{display:flex;} #cosmetic .detail_wrap .customer .caution .list{flex:1 1;display:flex;flex-direction:column;gap:16px;} #cosmetic .detail_wrap .customer .caution .list span{display:flex;align-items:flex-start;gap:12px;line-height:25px;font-size:18px;font-weight:300;color:#111111;} #cosmetic .detail_wrap .customer .caution .list span:before{content:'';margin:8.5px 0 0 0;width:8px;height:8px;background:#C5A880;transform:rotate(45deg);flex:0 0 auto;} #cosmetic .detail_wrap .change{position:relative;background:url("../img/procedure/bg_change.png") no-repeat 50% 50% / cover;} #cosmetic .detail_wrap .change .header{display:flex;flex-direction:column;align-items:center;padding:120px 16px 100px;background:rgb(0 0 0 / 80%);text-align:center;} #cosmetic .detail_wrap .change .header .tit{line-height:67px;font-size:48px;font-weight:600;color:#c5a880;font-family: 'Cormorant Garamond', sans-serif;} #cosmetic .detail_wrap .change .header .txt{line-height:31px;font-size:22px;font-weight:300;color:#ffffff;margin:24px 0 0 0;font-family:'Bookk', sans-serif;} #cosmetic .detail_wrap .change .list{} #cosmetic .detail_wrap .change .list ul{display:flex;} #cosmetic .detail_wrap .change .list li{flex:1;height:325px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;} #cosmetic .detail_wrap .change .list li:nth-child(odd){background:rgb(255 255 255 / 10%);} #cosmetic .detail_wrap .change .list li:nth-child(even){background:rgb(255 255 255 / 20%);} #cosmetic .detail_wrap .change .list li .num{position:absolute;bottom:-48px;right:0;line-height:1;font-size:220px;color:#ffffff;opacity:0.06;font-family: 'Cormorant Garamond', sans-serif;font-style:italic;} #cosmetic .detail_wrap .change .list li .txt{line-height:28px;font-size:20px;font-weight:500;color:#ffffff;} #cosmetic .detail_wrap .solution{position:relative;padding:120px 16px;} #cosmetic .detail_wrap .solution .header{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:0 0 48px 0;} #cosmetic .detail_wrap .solution .header .sub{line-height:28px;font-size:20px;font-weight:500;color:#c5a880;margin:0 0 16px 0;} #cosmetic .detail_wrap .solution .header .tit{line-height:49px;font-size:35px;font-weight:500;color:#222222;margin:0 0 40px 0;font-family:'Bookk', sans-serif;} #cosmetic .detail_wrap .solution .header .txt{line-height:28px;font-size:20px;font-weight:300;color:#222222;margin:0 0 40px 0;font-family:'Bookk', sans-serif;} #cosmetic .detail_wrap .solution .header .ico{margin:0 auto;width:32px;height:32px;background:url("../img/procedure/solution_arrow.svg") no-repeat 50% 50% / contain;} #cosmetic .detail_wrap .solution .list{margin:0 auto;max-width:1920px;} #cosmetic .detail_wrap .solution .list ul{display:flex;gap:8px;} #cosmetic .detail_wrap .solution .list li{flex:1;position:relative;width:100%;height:auto;aspect-ratio:466/600;} #cosmetic .detail_wrap .solution .list li:before{content:'';position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;background: linear-gradient(0deg,rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);} #cosmetic .detail_wrap .solution .list li img{width:100%;height:100%;object-fit:cover;} #cosmetic .detail_wrap .solution .list li span{position:absolute;z-index:2;bottom:24px;left:0;width:100%;text-align:center;line-height:31px;font-size:22px;color:#ffffff;font-family:'Bookk', sans-serif;} /* shop/mypage.php */ #mypage{position:relative;padding:60px 0;} #mypage #smb_my{position:relative;display:flex;} #mypage #smb_my #smb_my_ov{flex:0 1 auto;width:300px;} #mypage #smb_my #smb_my_list{flex:1 1 ;} #mypage #smb_my_qna h2 {margin: 0 0 10px;font-size: 1.25em;} /**/ #terms{position:relative;padding:120px 0;} #terms .header{text-align:center;margin:0 0 60px 0;} #terms .header .tit{margin-bottom: 15px;font-size: 40px;font-weight: 400;line-height: 1;} #terms .header .eng{color: #555;font-size: 22px;font-weight: 300;line-height: 1;font-family: 'Cormorant Garamond', sans-serif;font-style: italic;} #terms .content{font-size: 15px;line-height: 24px;font-weight: 400;color: #555;} @media (max-width:768px) { #about{} #about .visual{height:calc(100dvh - 64px);aspect-ratio:auto;} #about .visual .text{} #about .visual .text .tit{line-height:1.4;font-size:40px;} #about .visual .text .txt{margin:24px 0 0 0;line-height:1.4;font-size:16px;font-weight:400;} #about .greeting{flex-direction:column;padding:56px 15px;} #about .greeting .text{margin:0;} #about .greeting .text .eng{line-height:1.4;font-size:24px;margin:0 0 8px 0;} #about .greeting .text .tit{line-height:1.4;font-size:24px;margin:0 0 24px 0;} #about .greeting .text .txt{line-height:1.4;font-size:15px;margin:0 0 40px 0;} #about .greeting .text .sign{} #about .greeting .text .sign img{height:38px;} #about .greeting .image{margin:40px 0 0 0;width:100%;height:auto;aspect-ratio: 360 / 420;} #about .greeting .image img{width:100%;height:100%;object-fit:cover;} #about .recommend{padding:32px 15px;flex-direction:column;} #about .recommend .text{width:100%;margin:0;} #about .recommend .text .tit{line-height:1.4;font-size:35px;margin:0 0 16px;} #about .recommend .text .txt{line-height:1.4;font-size:16px;font-weight:300;} #about .recommend .slider{margin:40px 0 0 0;width:100%;overflow:hidden;} #about .recommend .slider .scroll{position:relative;height:700px;} #about .recommend .slider .image{} #about .recommend .slider .image ul{gap:10px;} #about .recommend .slider .image li{width:calc(50% - 5px);} #about .recommend .slider .image li:nth-child(even){margin-top:80px;} #about .recommend .slider .image li img{width:100%;height:auto;aspect-ratio:1/1;} #about .recommend .slider .image li strong{margin:16px 0 0 0;line-height:1.4;font-size:16px;} #about .recommend .slider .image li span{margin:8px 0 0 0;line-height:1.4;font-size:15px;} #about .treatment{padding:56px 15px;align-items:stretch;} #about .treatment .header{margin:0 0 24px 0;} #about .treatment .header .tit{line-height:1.4;font-size:35px;} #about .treatment .header .txt{line-height:1.4;font-size:18px;} #about .treatment .content{} #about .treatment .content ul{display:flex;flex-wrap:wrap;width:100%;justify-content:center;gap:10px 0;} #about .treatment .content li{flex:0 0 auto;width:calc(33.33% + 6.66px);} #about .treatment .content li + li{margin-left:-10px;} #about .treatment .content li img{width:48px;} #about .treatment .content li span{height:auto;line-height:1.4;font-size:15px;} #location{} #location .info{padding:40px 15px;} #location .info .flex{flex-direction:column;} #location .info .title{margin:0 0 16px;line-height:1.4;font-size:28px;} #location .info .location{padding:0;} #location .info .location .text{flex:1;display:flex;flex-direction:column;gap:16px;} #location .info .location .text dl{align-items:flex-start;line-height:1.4;font-size:18px;} #location .info .location .text dt{min-width:70px;} #location .info .location .text dd{font-size:16px;font-weight:300;} #location .info .location .text dd strong{line-height:1.4;font-size:27px;} #location .info .treat{padding:0;} #location .info .treat .text{flex:1;display:flex;flex-wrap:wrap;gap:8px 30px;} #location .info .treat .text dl{align-items:flex-start;line-height:1.4;font-size:18px;} #location .info .treat .text dt{min-width:70px;} #location .info .treat .text dd{font-weight:300;} #location .info .treat .text dd strong{line-height:1.4;font-size:27px;} #location .info .button{margin-top:40px;display:flex;gap:16px;} #location .info .button a{font-size:16px;height:54px;font-weight:400;} #location .info .button a.kakao{background:#c5a880;} #location .info .button a.kakao:before{content:'';width:24px;height:24px;background:url("../img/main/kakao.svg") no-repeat 50% 50% / contain;} #location .info .button a.kakao2{background:#4E4333;} #location .info .button a.kakao2:before{content:'';width:24px;height:24px;background:url("../img/main/kakao2.svg") no-repeat 50% 50% / contain;} #location .info .button a.naver{background:#c5a880;} #location .info .button a.naver:before{content:'';width:24px;height:24px;background:url("../img/main/naver.svg") no-repeat 50% 50% / contain;} #location .method{padding:40px 15px;gap:40px;flex-wrap:wrap;background:#F9F6F2;} #location .method .box{width:100%;flex:0 0 auto;} #location .method .tit{line-height:1.4;font-size:28px;margin:0 0 24px 0;} #location .method .tit img{width:32px;height:32px;} #location .method .txt{line-height:1.4;font-size:18px;margin:0 0 16px 0;} #location .method .txt span{color:#c5a880} #location .method .con{display:flex;flex-direction:column;gap:8px;} #location .method .con dl{display:flex;align-items:flex-start;gap:12px;} #location .method .con dt{padding:0 8px;line-height:28px;height:28px;font-size:14px;font-weight:300;min-width:auto;white-space:nowrap} #location .method .con dd{padding:4px 0;line-height:20px;font-size:16px;color:#222222;} #location .map{height:250px;} #cosmetic .detail_wrap .product{} #cosmetic .detail_wrap .product .inner{flex-direction:column;padding:0;gap:0;} #cosmetic .detail_wrap .product .image{width:100%;} #cosmetic .detail_wrap .product .info{width:100%;padding:40px 16px;} #cosmetic .detail_wrap .product .info .name{line-height:39px;font-size:28px;} #cosmetic .detail_wrap .product .info .text{padding:24px 0;line-height:22px;font-size:16px;} #cosmetic .detail_wrap .product .info .text strong{line-height:25px;font-size:18px;} #cosmetic .detail_wrap .product .info .price{line-height:34px;font-size:24px;gap:6px;} #cosmetic .detail_wrap .product .info .price strong{line-height:34px;font-size:24px;} #cosmetic .detail_wrap .product .info .price span{font-size:18px;} #cosmetic .detail_wrap .product .info .button{margin:40px 0 0 0;} #cosmetic .detail_wrap .product .info .button a{height:57px;font-size:18px;gap:8px;} #cosmetic .detail_wrap .product .info .button a:after{content:'';width:24px;height:24px;background:url("../img/sub/buy_arrow.svg") no-repeat 50% 50% / contain;} #cosmetic .detail_wrap .recommend{padding:56px 0;} #cosmetic .detail_wrap .recommend .header{margin:0 0 40px 0;} #cosmetic .detail_wrap .recommend .header .tit{line-height:1.4;font-size:28px;} #cosmetic .detail_wrap .recommend .list{} #cosmetic .detail_wrap .recommend .list ul{flex-direction:column;} #cosmetic .detail_wrap .recommend .list li{flex:0 0 auto;aspect-ratio:auto;height:100px;} #cosmetic .detail_wrap .recommend .list li .txt{line-height:1.4;font-size:16px;font-weight:400;} #cosmetic .detail_wrap .recommend .list li:hover{top:0;} #cosmetic .detail_wrap .recommend .list li:hover .txt{opacity:0;} #cosmetic .detail_wrap .formation{padding:32px 8px;} #cosmetic .detail_wrap .formation .inner{flex-direction:column;} #cosmetic .detail_wrap .formation .text{margin:0 0 40px 0;} #cosmetic .detail_wrap .formation .text .tit{line-height:1.4;font-size:32px;} #cosmetic .detail_wrap .formation .text .txt{line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .formation .slider{width:100%;margin:0;overflow:hidden;} #cosmetic .detail_wrap .formation .slider .scroll{position:relative;height:700px;} #cosmetic .detail_wrap .formation .slider .image{position:relative;-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important;transition-duration: 12000ms;} #cosmetic .detail_wrap .formation .slider .image ul{gap:8px;} #cosmetic .detail_wrap .formation .slider .image li{width:calc(50% - 4px);} #cosmetic .detail_wrap .formation .slider .image li:nth-child(even){margin-top:80px;} #cosmetic .detail_wrap .formation .slider .image li img{} #cosmetic .detail_wrap .formation .slider .image li strong{margin:16px 0 0 0;line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .formation .slider .image li span{margin:8px 0 0 0;line-height:1.4;font-size:15px;} #cosmetic .detail_wrap .formation .slider .product{} #cosmetic .detail_wrap .formation .slider .product ul{gap:24px;} #cosmetic .detail_wrap .formation .slider .product li{} #cosmetic .detail_wrap .formation .slider .product li .img{width:25%;aspect-ratio:1/1;height:auto;} #cosmetic .detail_wrap .formation .slider .product li .con{height:auto;gap:8px;} #cosmetic .detail_wrap .formation .slider .product li .tit{line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .formation .slider .product li .txt{line-height:1.4;font-size:15px;} #cosmetic .detail_wrap .customer{padding:56px 16px;background:#F9F6F2} #cosmetic .detail_wrap .customer .inner{flex-direction:column;gap:64px 0;} #cosmetic .detail_wrap .customer .header{flex:0 0 100%;margin:0 0 40px;} #cosmetic .detail_wrap .customer .header .tit{line-height:1.4;font-size:28px;text-align:center;} #cosmetic .detail_wrap .customer .list{flex:1 1;} #cosmetic .detail_wrap .customer .used{flex-direction:column;} #cosmetic .detail_wrap .customer .used .list{} #cosmetic .detail_wrap .customer .used .list > ul{text-align:center;} #cosmetic .detail_wrap .customer .used .list > ul > li{padding:16px;line-height:22px;font-size:16px;} #cosmetic .detail_wrap .customer .qna{flex-direction:column;} #cosmetic .detail_wrap .customer .qna .list{border-top:2px solid #222222;border-bottom:2px solid #222222;} #cosmetic .detail_wrap .customer .qna .list > ul{} #cosmetic .detail_wrap .customer .qna .list > ul > li{border-bottom:1px solid #D2D2D2;} #cosmetic .detail_wrap .customer .qna .list > ul > li:last-child{border-bottom:0;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a{padding:16px;gap:16px;font-size:16px;line-height:22px;min-height:66px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a:before{line-height:42px;font-size:24px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a:after{width:16px;height:16px;margin: 12px 0px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_a span{padding:10px 0;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b{padding:16px;font-size:16px;line-height:1.4;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b:before{display:none;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b span:nth-child(1){padding-left:24px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b span:nth-child(1):before{content:'A';font-family: 'Cormorant Garamond', sans-serif;font-style:italic;position:absolute;line-height:1;font-size:24px;top:16px;left:16px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table{} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table tr{} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table th{padding:6px;font-size:15px;} #cosmetic .detail_wrap .customer .qna .list > ul > li .qna_b table td{padding:6px;font-size:15px;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on{border-bottom:1px solid #222222;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_a{color:#ffffff;background:#111111;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_a:after{width:16px;height:16px;} #cosmetic .detail_wrap .customer .qna .list > ul > li.on .qna_b{display:flex;} #cosmetic .detail_wrap .customer .caution{flex-direction:column;} #cosmetic .detail_wrap .customer .caution .list{padding:0 8px;} #cosmetic .detail_wrap .customer .caution .list span{line-height:1.4;font-size:15px;} #cosmetic .detail_wrap .customer .caution .list span:before{margin:4.5px 0 0 0;} #cosmetic .detail_wrap .change{} #cosmetic .detail_wrap .change .header{padding:56px 8px;} #cosmetic .detail_wrap .change .header .tit{line-height:1.4;font-size:28px;} #cosmetic .detail_wrap .change .header .txt{line-height:1.4;font-size:17px;margin:12px 0 0 0;} #cosmetic .detail_wrap .change .list{} #cosmetic .detail_wrap .change .list ul{flex-wrap:wrap;} #cosmetic .detail_wrap .change .list li{flex:0 0 50%;width:50%;height:auto;aspect-ratio:187/127;} #cosmetic .detail_wrap .change .list li:nth-child(1){background:rgb(255 255 255 / 10%);} #cosmetic .detail_wrap .change .list li:nth-child(2){background:rgb(255 255 255 / 20%);} #cosmetic .detail_wrap .change .list li:nth-child(3){background:rgb(255 255 255 / 20%);} #cosmetic .detail_wrap .change .list li:nth-child(4){background:rgb(255 255 255 / 10%);} #cosmetic .detail_wrap .change .list li .num{bottom:-24px;font-size:100px;} #cosmetic .detail_wrap .change .list li .txt{line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .solution{padding:56px 8px;} #cosmetic .detail_wrap .solution .header{margin:0 0 32px 0;} #cosmetic .detail_wrap .solution .header .sub{line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .solution .header .tit{line-height:1.4;font-size:27px;} #cosmetic .detail_wrap .solution .header .txt{line-height:1.4;font-size:16px;} #cosmetic .detail_wrap .solution .header .ico{width:24px;height:24px;} #cosmetic .detail_wrap .solution .list{margin:0;width:100%;height:100%;} #cosmetic .detail_wrap .solution .list ul{flex-direction:column;gap:8px;} #cosmetic .detail_wrap .solution .list li{flex: 0 0 auto;height: 100px;aspect-ratio:auto;} #cosmetic .detail_wrap .solution .list li:before{background:rgb(0 0 0 / 30%);} #cosmetic .detail_wrap .solution .list li img{width:100%;height:100%;object-fit:cover;} #cosmetic .detail_wrap .solution .list li span{bottom:unset;top:50%;transform:translateY(-50%);line-height:1.4;font-size:20px;} #mypage{position:relative;padding:60px 20px;} #terms{padding:60px 20px} #terms .header{margin:0 0 20px 0;} #terms .header .tit{margin-bottom: 10px;font-size: 24px;} #terms .header .eng{font-size:14px;} #terms .content{font-size: 14px;line-height: 1.4;} }