@charset "utf-8";

/* **************************************** *
* 공통 레이아웃
* **************************************** */
#content{margin:0 auto; padding-top:95rem; padding-bottom:110rem; max-width:450rem;}
#content:has(#footer){padding-bottom:0;}
.content-wrap{position:relative; overflow:hidden; width:100%; margin-right:auto; margin-left:auto; padding-right:20rem; padding-bottom:40rem; padding-left:20rem; /* z-index:2; :*/;}
.inner{padding: 0 20rem;}

/* **************************************** *
* 서브페이지
* **************************************** */

/* 게시판 관련 */
#content.board{padding-bottom:50rem;}
.board-user .cmn-thum{/* position:absolute; */ left:0; width:37rem; height:37rem; background-size:16rem;}
.board-item{position:relative; padding-top:20rem; /* padding-bottom:20rem; */ padding-left:46rem;}
.board-list{position:relative; padding-top:25rem !important;}
.board-list__inr > strong{color:var(--b-01);}
.board-item > strong{display:-webkit-box; font-size:16rem; color:var(--b-01);}
.board-item + .board-item{border-top:1px solid #eee;}
.board-item:first-child{padding-top:0;}
.board-list__inr .tag-list{margin-top:1rem;}
.board-info{display:flex; align-items:center; position:relative; margin-top:30rem;}
.board-info__inr{display:flex; align-items:flex-start; position:absolute; right:0rem;}
.board-info > span{width:18rem; height:18rem; background-size:cover; background-position:50% 50%; background-repeat:no-repeat;}
.board-info__inr li{display:flex; align-items:center; position:relative; font-weight:300; font-size:12rem; color:#B6B6B6;}
.board-info__inr li:first-child::after{content:""; display:block; width:3rem; height:3rem; margin:0rem 5rem; background:#ddd; border-radius:100%;}
.board-item > p{margin-top:5rem;}
.board-list__thum{margin-top: 12rem;}
.board-item > strong{margin-top:17rem;}
.board-list__thum{overflow:hidden; border-radius:10rem;}

.btn-like{width:20rem !important; margin-right:16rem; background-image:url(../img/ic-heart.svg);}
.btn-like.on{background-image:url(../img/ic-heart_on.svg);}
.btn-comment{background-image:url(../img/ic-comment.svg);}

/* 글쓰기 */
.board-view .board-item{/* padding-bottom:40rem; */ padding-left:0;}
.board-view .board-user{/* padding-left:47rem; */  display: flex; align-items: center; gap: 8rem;}
.board-view .board-info{margin:0; padding:13rem 0rem;}
.board-view .board-item > strong{font-size:17rem; word-break:auto-phrase;}
.board-reply .board-user{padding-left:0;}
.board-reply .board-item{padding:20rem 0rem; padding-left:47rem !important;}
.board-reply .board-item > p{margin-top:7rem; font-size:14rem;}
.board-reply .board-item .board-item{padding:0; padding-top:25rem; border:0;}
.board-reply .board-item > p + *{margin-top:4rem;}

.board-user__inr > i{display:block; line-height:1.2; font-size:12rem; color:#b3b3b3;}
.board-user__inr > strong{font-size:14rem; color:var(--b-01);}

.board-item.new .board-user__inr > strong{position:relative;}
.board-item.new .board-user__inr > strong::after{content:"new"; margin-left:2rem; font-size:9rem; color:var(--c-02); text-transform:uppercase; vertical-align:text-top;}
.board-item.new{display:none;}

.reply-box textarea{height:55rem; padding:8rem 10rem; border:0; font-size:14rem; border-radius:0;}
.reply-box{display:none; position:relative; border:1px solid #E5E5E5;}
.reply-box.on{display:block; height:90rem; margin-top:9rem;}
.reply-box__btn{position:absolute; right:15rem; bottom:13rem; width:auto; font-weight:800; color:#cdcdcd;}
.reply-box__btn.on{color:#656565;}

.btn-reply{font-size:12rem; color:#c3c3c3; text-align:left;}
.btn-reply.hide{display:none;}
.btm-fix{position:fixed; bottom:0; z-index:10; width:100%;}

#reply-input{display:flex; align-items:center; box-shadow:0px -1px 10px 0px rgba(0, 0, 0, 0.07);}
#reply-input > figure{position:absolute; left:10rem;}
#reply-input input{width:100%; padding-left:46rem; border:0; border-top:1px solid #eee; font-size:14rem; border-radius:0;}
#reply-input button{position:absolute; right:0; width:60rem; font-weight:700;}

/* 글쓰기 */
.board-write .board-write__tit{padding-left:0; border:0; border-bottom:1px solid #e5e5e5; border-radius:0;}
.board-write__cont{height:40vh; padding-top:10rem; padding-left:0; border:0; border-radius:0;}
.board-write .swiper-tabs{overflow:visible; margin:30rem 0rem; gap:10rem;}
.board-write .swiper-tabs li{position:relative; border-radius:6rem;}
.board-write input[type="text"]::placeholder,
.board-write textarea::placeholder{color:#B6B6B6!important;}
.board-write__photo{display:flex; align-items:center; position:relative; padding:20rem 20rem; border-top:1px solid #eee; font-weight:500; font-weight:400; color:var(--b-01); text-align:left;}
.board-write__photo i{width:22rem; height:30rem; margin-right:10rem; background:url(../img/ic-camera.svg) no-repeat 50% 50%;}
.board-write__btm  input{width:auto; width:calc(100% - 40rem); margin:0 20rem; padding-left:0; border:0; border-top:1px solid #eee; border-radius:0;}
.board-write__delate{position:absolute; top:-7rem; right:-7rem; width:23rem; height:23rem; background-color:var(--c-02); background-position:50% 50%; border-radius:40rem; background-image:url(../img/common/ic-cancle_w.svg); background-repeat:no-repeat;}
.board-write__img{overflow:hidden; border-radius:7rem;}

/* 솔루션 */
#content.solution{padding-bottom:80rem;}
.solution-tit img{height:124rem;}
.solution .sec-tit{display:block; margin-top:20rem; margin-bottom:0rem;}
.solution-write__txt{margin-top:9rem; min-height:150rem;}

/* 솔루션 답변 */
*[class^="talk-con"]{display:flex; justify-content:flex-end; align-items:flex-start; position:relative;}

.solution-tit{padding-top:20rem;}
.solution .sec-tit span{border-bottom:1px solid; font-weight:600; color:var(--c-01);}

.talk-con__txt{display:flex; align-items:flex-start; width:100%; padding:18rem; border-radius:10rem; max-width:300rem; flex-direction:column;}
.talk-con--reply .talk-con__txt{background:var(--c-01); color:var(--f);}
.talk-con .talk-con__txt{background:#F5F5F5;}
.talk-con--reply .cmn-thum{width:35rem; height:35rem; border:1px solid #ddd;}
.talk-con--reply .cmn-info__user{position:absolute; top:0; left:0;}
.talk-wrap .cmn-info__user strong{font-size:13rem;}
.talk-con--reply{padding-top:31rem;}
.talk-wrap{display:flex; align-items:stretch; margin-top:25rem; flex-direction:column; gap:10rem;}
.talk-con__btn{display:flex; justify-content:flex-start; width:100%; margin-top:35rem; flex-direction:column; gap:6rem;}
.talk-con__btn > *{padding:14rem 0rem; background:var(--f); font-weight:700; font-size:15rem; color:var(--c-01); border-radius:6rem;}
.talk-btn--c{color:var(--f);}
.talk-con--reply .expert-list{display:grid; grid-template-columns:1fr 1fr; max-width:300rem;}
.talk-con--reply .expert-list__item{border:1px solid #eee; flex:50%;}
.talk-con--reply:has(.expert-list){padding-top:0rem;}
.talk-con--reply .select-btn::after{background-image:url(../img/common/arrow-basic_w.svg);}
.talk-con--reply .select-btn{color:rgba(255,255,255,0.6)!important; border-color:rgba(255,255,255,0.3);}
.talk-con__txt > input{margin-top:11rem; background:none; color:var(--f); border-color:rgba(255, 255, 255, 0.3);}
.talk-con__txt > .select-wrap{margin-top:5rem;}
.talk-con--reply .select-btn.on{color:var(--f) !important;}
.talk-con--reply .expert-list__item.on{border:3rem solid var(--c-01);}
.talk-con__txt > input:focus{border-color:rgba(255, 255, 255, 0.3);}

/* 솔루션 결제 */
.solution-pay .sec-line{margin-top:30rem; margin-bottom:30rem;}
.solution-pay .solution-item__inr > i{font-weight:500; color:#a1a1a1;}
.solution-pay .solution-item__inr  strong > i{margin-left:3rem; color:var(--b-01);}
.solution-pay .solution-item__inr strong{font-size:17rem;}
.solution-pay .solution-item__inr em{display:block; margin-top:1rem; font-weight:800; font-size:15rem;}
.solution-pay .solution-item__inr em i{margin-left:4rem; font-weight:400; text-decoration:line-through;}


/* 당뇨연구소 */
.lab-top{width: 100%; height: 278rem; background: url(../img/lab_bg.jpg); position: fixed; top: 0; left: 0; background-size: cover;}
.lab-top h1{color: var(--f);}
.lab-top button.enter{width: 123rem;height: 44rem;margin-top: 17rem;border-radius: 5rem;border: 2px solid var(--f);display: flex;align-items: center;justify-content: center;color: var(--f);font-weight: 700;box-shadow: 1px 0px 9px #ffffff59;}
.lab-top .swiper-tabs{position: absolute; bottom: 60rem; left: 0;}

.laboratory .content-header--v2{position: relative; padding-top: 54rem; background:transparent}
.laboratory .swiper-tabs > li{opacity: 0.5;}
.laboratory .swiper-tabs > li *{color: var(--f);}
.laboratory .swiper-tabs > li.on{opacity: 1;}
.laboratory .swiper-tabs > li.on *::before{background-color: var(--f);}
.laboratory .content-wrap{background-color: var(--f); border-radius: 40rem 0 0 0; padding-top: 63rem; padding-bottom: 40rem; }
.laboratory:not(.v2) .content-wrap{padding-bottom: 0;}
#content.laboratory{padding-top: 240rem; padding-bottom: 88rem;}
#content.laboratory .lab-charactor{position: absolute; right: 20rem; top: 117rem; z-index: 11; }

.rab-measure[data-grid]{
    gap:8rem;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
}
.rab-measure *{color: var(--b-01);}
.rab-measure__icon{ position: absolute; right: 17rem; top: 13rem; width: 40rem; height: 40rem; border-radius: 100%; background-color: var(--bg); display: flex; align-items: center; justify-content: center;}
.rab-measure em{font-weight: 500;}
.rab-measure .br-box{height: 130rem; padding: 20rem 20rem 16rem 20rem;} 
[class^="rab-box"]{display: flex; flex-direction: column; justify-content: space-between;}
[class^="rab-box"] strong{font-size: 30rem; line-height: 0.666; margin-top:3rem; display: inline-block;}
.rab-food{gap: 7rem;}
.rab-food figure{width: 46rem; height: 46rem;  border-radius: 100%; overflow: hidden; margin-bottom: 4rem; }
.rab-food .food01 figure{background: url(../img/rab-food01.jpg) no-repeat; background-size: cover;}
.rab-food .food02 figure{background: url(../img/rab-food02.jpg) no-repeat; background-size: cover;}
.rab-food .food03 figure{background: url(../img/rab-food03.jpg) no-repeat; background-size: cover;}
.rab-food li{text-align: center;}
.rab-food li p{color: var(--b-01); font-size: 12rem;}
.rab-box05 {grid-column: 1 / 3; height: 147rem;}
.rab-box05 .rab-measure__result--wrap{justify-content: space-between; align-items: baseline; }

.rab-yesterday figure{width: 121rem;  margin: 0 auto; }
.rab-yesterday figure img{max-width: 100%; margin: 0 auto; display: block;}
.rab-yesterday h3{text-align: center; color: var(--b-01); margin-bottom: 26rem;}
.rab-yesterday p{margin-top: 20rem;}
.rab-yesterday .button-wrap{margin-top: 26rem;}

.rab-check[data-grid="1"]{gap: 18rem;}
.rab-check[data-grid="3"]{gap: 18rem;}


.rnd-note dl dt{font-weight: 700; font-size: 16rem; color: var(--b-01); margin-bottom:9rem; line-height: 1.25;}
.rnd-note dl dd{font-weight: 300;}
.rnd-note dl div + div{margin-top: 25rem;}
.rab-normal__box{display: flex; flex-direction: column; align-items: center; height: 130rem; justify-content: center;} 
.rab-normal__box strong{color: var(--c-02); font-size: 30rem; font-weight: 600; display: block; margin-bottom: 10rem; line-height: 0.666;}
.rab-normal__box em{color: var(--b-01); font-weight: 600; margin-top: 16rem;}
.rab-normal__measure{gap: 8rem;}

.blood-recent{padding: 40rem 0;}
.blood-report{border:1px solid var(--c-02)}
.blood-report h3{text-align: center; color: var(--c-02); margin-bottom: 22rem;}
.blood-graph__ex {margin-bottom: 28rem;}
.blood-graph__ex li{display: flex; align-items: center;}
.blood-graph__ex li:nth-child(1) i{background-color: var(--c-02);}
.blood-graph__ex li:nth-child(2) i{background-color: var(--b-01);}
.blood-graph__ex li:nth-child(3) i{background-color: var(--p-01);}
.blood-graph__ex i{width: 16rem; height: 2px; margin-left:6rem }
.blood-graph__ex em{font-size: 11rem}
.blood-graph img{}

.shop-filter{justify-content: space-between;}
.shop-filter__total i{color: var(--c-02); font-weight: 600;}
.shop-filter__button{display: inline-block; width: auto; position: relative; display: flex; align-items: center;}
.shop-filter__button::before{content: ""; display: inline-block; width: 13rem; height: 13rem; margin-right: 5rem;  background: url(../img/common/ic-filter.svg) no-repeat; background-size: cover;}
.modal-radioList .radio-box + .radio-box{margin-left: 0; margin-top: 12rem;}
.modal-text:has(.modal-radioList){align-items: flex-start;}
.shop-grid__list{gap: 10rem;}

.board-item__title{padding: 16rem 0 20rem; border-bottom: 1px solid #eee;}
.board-item__title strong{font-size: 18rem; color: var(--b-01); display: block;} 
.board-item__title span{color: var(--g); font-size: 12rem; display: block; margin-top: 12rem;}
.board-item__body{padding: 20rem 0 0;}

.news-board .content-header--v2,
.shop-view .content-header--v2{min-height: 50rem;}
#content.news-board,#content.shop-view{padding-top:50rem;}

.upload-btn{cursor: pointer;}
.upload-btn input[type="file"]{position: absolute; width: 0; height: 0; padding: 0; border: 0; text-indent: -999999px;}
.upload-btn label{border:1px dashed var(--g); height: 110rem; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 5rem;}
.upload-btn span{font-size: 12rem; opacity: 0.4; display: block; margin-top: 6rem;}
.upload-btn i{width: 40rem; height: 40rem; background: url(../img/ic-upload.svg);}

.today-food{border-radius: 5rem; overflow: hidden; position: relative; padding-bottom: 100%; width: 100%; margin-top: 8rem;}
.today-food::before{content: "";}
.today-food img{width: 100%; height: 100%; position: absolute; left: 0; top: 0; object-fit: cover;}

.food-report [data-grid="2"]{gap: 8rem;}
.food-report li{display: flex; align-items: center; justify-content: center; flex-direction: column;}
.food-report li span{display: block;}
.food-report span{display: block;}
.food-report em{font-size: 24rem; line-height: 0.666; color: var(--b-01); font-weight: 700; margin-top: 12rem;}
.food-report em i{font-size: 14rem; font-weight: 400;}

.payment .shop-item + .shop-item{margin-top: 12rem;}
.line{display: block; width: 100%; height: 1px; border-top: 1px solid #eee; margin-top: 30rem; margin-bottom: 23rem;}
.payment-list li{padding: 15rem 0;}
.payment-list li + li{border-top: 1px dashed #eee;}
.payment-list li em{font-weight: 700; color: var(--b-01); font-size: 13rem; display: block; margin-bottom: 4rem;}
.payment-list li p{font-weight: 300; color: var(--b-01); font-weight: 13rem;}
.payment-list li:first-child{padding-top: 0;}
.payment-list li:last-child{padding-bottom: 0;}

.shop .tabs > li{padding: 0rem 14rem;}

.shop-view__visual{background: var(--bg);}
.shop-view__visual .swiper-controls{right: inherit; left: 50%; transform: translateX(-50%);}
.shop-view__visual .swiper-slide{background-color: transparent;}
.shop-view__visual em{display: block;}
.shop-view .btn-wrap--fix{background-color: #fff; z-index: 12; width: 100%; left: 0 ; bottom:0; padding: 20rem 20rem;}
.shop-view__title{padding: 24rem 0;}
.shop-view__title em{font-weight: 300; color: var(--b-01); font-size: 16rem;}
.shop-view__title .cmn-price{margin-top: 18rem;}

.shop-view .cmn-price strong{color: var(--c-02); font-size:16rem;}
.shop-view .cmn-price i{font-size: 14rem;}
.shop-view .swiper-slide .cmn-price strong{color: var(--b-01);}
.shop-view__tab{width: 100%; border-bottom: 1px solid #eee;}
.shop-view__tab li{flex: 1; text-align: center; padding: 12rem ; cursor: pointer;}
.shop-view__tab li.active{position: relative;}
.shop-view__tab li.active::before{content: ""; position: absolute; left: 0; width: 100%; height: 2rem; background-color: var(--b-01); bottom: 0;}
.shop-view__tab li i{font-size: 11rem; font-weight: 500;}
.shop-view .sec-line{}
.shop-view .tab-content .tab__item > *{padding: 20rem 0;}
.shop-view .shop-view__contents{}
.shop-view__item em{display: block; font-weight: 600; color: var(--b-01); margin-bottom: 4rem; }

.accordion-custom__cont{display: none; padding-top: 12rem;}
.accordion-custom__tit{  cursor: pointer;}
.accordion-custom__tit i.date{font-size:12rem; color: var(--g); font-weight: 300;}
.shop-review__title{display: flex; justify-content: space-between; align-items: center;}
.shop-user{position: relative; display: flex; gap: 8rem; align-items: center;}
.review-pic{gap: 8rem; }
.review-pic + p{margin-top: 12rem;}
.review-pic li{border-radius: 5rem; background-color: var(--bg); overflow: hidden; width: 80rem;}
.review-pic li img{width: 100%;}

.shop-review__star{display: flex; gap: 2rem; margin-bottom: 8rem;}
.shop-review__star i{display: block; width: 14rem; height: 14rem; background: url(../img/ic-review-star.svg) no-repeat; background-size: cover;}
.shop-review__star i.on{ background: url(../img/ic-review-star_on.svg) no-repeat;  background-size: cover}
.accordion-custom__list > li{border-bottom: 1px solid #eee; padding: 24rem 20rem;}
.accordion-custom__list > li:nth-child(1){padding-top: 0;}
.accordion-custom__list > li.on em::after{transform: rotate(-180deg);}
.accordion-custom__cont p{}
.accordion-custom__tit em{display: flex;font-size: 12rem;color: var(--g);position: relative;align-items: center;margin-top: 12rem;}
.accordion-custom__tit em::after{content: ""; transition: all .3s; display: inline-flex;width: 12rem;height: 6rem;margin-left: 7rem;background: url(../img/common/ic-down.svg) no-repeat;}

.pagenation{justify-content: center; }
.pagenation li{width: 38rem; height: 12rem; opacity: 0.4; display: flex;align-items: center; justify-content: center; font-weight: 600;}
.pagenation li:nth-child(1){opacity: 1;}

.qa-condition{border-radius: 3rem;background-color: var(--bg); /* color: #fff; */  font-size: 12rem; padding: 3rem 6rem;}
.qa-condition.on{background-color: var(--b-01); color: #fff; }
.qa-info{display: flex; margin-top: 8rem;}
.qa-info span{font-size: 12rem; font-weight: 300; color: var(--g);}
.qa-info span + span{padding-left: 24rem; position: relative;}
.qa-info span + span::before{content: ""; width: 1px; height: 10rem; background-color: var(--g); opacity: 0.5; position: absolute; left: 12rem; top: 4rem;}
.qa-tit{color: var(--b-01); margin-top: 4rem;}
.qa-tit i{transition: all .3s; display: inline-flex;width: 12rem;height: 6rem;margin-left: 7rem;background: url(../img/common/ic-down.svg) no-repeat;}