/* -------- 마이페이지 -------- */
.mypage_main {display: flex; flex-direction: column; gap: 15px; padding-bottom: 30px;}
.mypage_main .my_profile {display: flex; position: relative; align-items: center; gap: 15px; padding-bottom: 10px;}
.mypage_main .my_profile .prof {width: 70px; height: 70px; border-radius: 100%;}
.mypage_main .my_profile .prof img {display: block; width: 100%; height: 100%; object-fit: contain;}
.mypage_main .my_profile .prof_name {display: flex; flex-direction: column; align-items: flex-start; gap: 2px;}
.mypage_main .my_profile .prof_name span {font-size: 18px;}
.mypage_main .my_profile .prof_name p {font-size: 24px; display: flex;}
.mypage_main .my_profile .prof_name p em {font-weight: 700;}
.mypage_main .my_menu {padding: 16px; border-radius: 5px; background-color: #faf9ff;}
.mypage_main .my_menu .menu_con {display: flex; align-items: center; flex-direction: column; gap: 8px;}
.mypage_main .my_menu .menu_con .icon {width: 25px; height: 25px; display: block;}
.mypage_main .my_menu .menu_con.like .icon {background: url(../img/mymenu01.png) no-repeat center/contain;}
.mypage_main .my_menu .menu_con.write .icon {background: url(../img/mymenu02.png) no-repeat center/contain;}
.mypage_main .my_menu .menu_con.list .icon {background: url(../img/mymenu03.png) no-repeat center/contain;}
.mypage_main .my_menu .menu_con span {font-size: 15px; font-weight: 500;}


.mypage_menu {padding-top: 15px; padding-bottom: 15px;}
.mypage_menu ul {display: flex; flex-direction: column;}
.mypage_menu li {width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #eee;}
.mypage_menu li:last-child {border-bottom: none;}
.mypage_menu li span {font-size: 16px; font-weight: 500;}
.mypage_menu li .icon {display: block; width: 14px; height: 14px; background: url(../img/arrow02.png) no-repeat center/contain;}



/* 회원정보수정 */
.edit_box {display: flex; flex-direction: column; align-items: center;}
.edit_prof {width: 80px; height: 80px; position: relative; margin-bottom: 20px;}
.edit_prof .profile {border-radius: 100%; overflow: hidden;}
.edit_prof .profile img {width: 100%; height: 100%; display: block; object-fit: contain;}
.edit_prof .btn_edit {position: absolute; bottom: 0; right: 0; width: 25px; height: 25px; background: url(../img/edit_prof_btn.png) no-repeat center/contain;}

.edit_con {display: flex; width: 100%; flex-direction: column; align-items: flex-start; gap: 5px; margin-bottom: 15px; border-bottom: 1px solid #eee; padding-bottom: 15px;}
.edit_con:last-child {border-bottom: none;}
.edit_con p {font-size: 14px; color: #666;}
.edit_con .edit_area {display: flex; justify-content: space-between; align-items: center; width: 100%; height: 37px;}
.edit_con .edit_area span {font-weight: 500;}
.edit_con .edit_area button {width: 60px;}

.terms_detail.edit .title {display: flex; align-items: center; justify-content: space-between; word-break: keep-all; gap: 30px;}
.terms_detail.edit .tit {font-size: 15px; display: flex; align-items: flex-end; gap: 4px; font-weight: 500; padding-bottom: 0; row-gap: 0; flex-wrap: wrap;}
.terms_detail.edit .tit em {font-size: 12px; color: #999; font-weight: 300;}
.terms_detail.edit .title span {font-size: 13px; color: #888; font-weight: 400;}

.mypage > .inner .prev{position: absolute;
top: 20%;
right: 0;
transform: rotate(180deg);
width: 30px;
height: 30px;
background: url(../img/page_header_prev.png) no-repeat center / contain;
filter: brightness(100);
}


/* -------- 좋아요 -------- */
.wrap.my {padding: 55px 0 100px;}
.wrap.my .sub_tab {padding: 0;}
.sub_tab.like span {width: 33.3333%;}

.tab_menu.my {padding: 12px 1.2em; background-color: #fafafa; margin-left: 0; width: 100%;}
.amount_filter.my {padding: 15px 0;}
.prd_list.chk {gap: 20px;}
.prd_list.chk .item_chk {display: flex; align-items: flex-start; justify-content: space-between;}
.prd_list.chk .item_chk .prd_con {width: calc(100% - 35px);}
.prd_list.chk .item_chk label {width: 24px; height: 24px;}

.prd_list.chk .commu_con {padding: 0; border: none; width: calc(100% - 35px);}

.prd_list.chk .store_con {flex-direction: row; align-items: center; width: calc(100% - 35px);}
.prd_list.chk .store_con .store_thumb {width: 100px; aspect-ratio: 1;}
.prd_list.chk .store_con .store_info {width: calc(100% - 112px); gap: 8px;}
.prd_list.chk .store_con .store_detail {padding-top: 8px;}

.prd_list.chk .post_con {display: flex; width: calc(100% - 35px); flex-direction: column; padding: 0; border-bottom: none;}
.post_con .tit {display: flex; align-items: flex-start; gap: 5px;}
.post_con .tit p {font-size: 13px; color: #777; line-height: 1.4;}
.post_con .post_cont {display: flex; flex-direction: column; gap: 8px; padding: 10px 0;}
.post_con .post_cont p {font-size: 16px; line-height: 1.4; font-weight: 500;}
.post_cont .review_score {padding-bottom: 0; border-bottom: none;}
.post_cont .review_score .img_slide {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 10px;}
.post_cont .review_score .img_slide .review_thumb {width: 100%; height: initial; aspect-ratio: 1;}
.post_con .date {font-size: 13px; color: #999;}


/* -------- 게시글 관리 -------- */
.wrap.my.post .sub_tab {width: 100%;}
.wrap.my.post .sub_tab span {width: 33.3333%;}
.post_con {width: 100%; padding: 20px 0; border-bottom: 1px solid #eee;}




/* -------- 참여내역 -------- */
.list_filter {display: flex; align-items: center; width: 100%; justify-content: space-between; padding-bottom: 15px;}
.list_filter .slt_box {width: 49%; padding: 10px 12px;}
.list_filter .slt_box span {font-size: 14px;}


.list_con {display: flex; flex-direction: column; gap: 15px;}
.list_tit {display: flex; align-items: center; justify-content: space-between; padding: 12px; background-color: #f9f9f9; border-radius: 5px;}
.list_tit .list_info {display: flex; align-items: center; gap: 5px;}
.list_tit .list_info span {font-size: 13px; color: #999;}
.list_tit .list_info i {width: 1px; height: 8px; background-color: #aaa;}
.list_tit .list_info .date {color: #555; font-weight: 500;}
.list_tit .click_detail {color: #555; font-size: 13px; font-weight: 500; display: flex; align-items: center; gap: 8px;}
.list_tit .click_detail i {display: block; width: 7px; height: 15px; background: url(../img/detail_arrow.png) no-repeat center/contain;}

.list_box {display: flex; flex-direction: column; width: 100%; gap: 10px; padding-bottom: 15px; border-bottom: 1px solid #eee;}
.list_box:last-child {padding-bottom: 0; border-bottom: none;}
.list_box .status {font-size: 15px; font-weight: 600; color: #C0A34F;}
.list_box .btn_box {display: flex; align-items: center; justify-content: space-between;}
.list_box .btn_box button {width: 49%;}
.list_box .prd_info .prd_name .opt {font-size: 13px; color: #888; font-weight: 400;}
.list_box .prd_info .price {flex-direction: row-reverse; align-items: center; gap: 6px; line-height: 1;}
.list_box .prd_info .discount span {text-decoration: line-through;}

/* 참여상세 */
.wrap.list_detail {padding: 55px 0 100px;}
.wrap.list_detail .list_box {padding-bottom: 0; border-bottom: none;}
.list_con .tit {font-size: 15px; font-weight: 600;}

.list_information {width: calc(100% + 2.4em); padding: 16px 1.2em; display: flex; align-items: center; margin-left: -1.2em; background-color: #f7f7f7; gap: 6px; margin-bottom: 25px;}
.list_information i {width: 1px; height: 10px; background-color: #aaa;}
.list_information span {font-size: 13px; color: #999;}
.list_information .date {color: #555; font-weight: 500;}

.detail_list {display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 15px;}
.detail_list .tit {font-size: 15px; font-weight: 600;}
.detail_list .list_area {flex-direction: column; display: flex; width: 100%; gap: 10px;}
.detail_list dl {display: flex; align-items: center;}
.detail_list dt {width: 90px; color: #666; font-size: 15px;}
.detail_list dd {font-weight: 500; width: calc(100% - 90px);}
.detail_list dd.color {color: #5834E8;}

.wrap.write.cancel p.tit {font-weight: 500; font-size: 15px; color: #111;}
.cancel_box {padding-top: 20px;}


/* -------- 공지사항/이벤트 -------- */
/* .sub_tab.board span {width: calc((100% - 2.4em) / 2);} */
.sub_tab.board span {width: 50%}
.wrap.my.board .amount_filter {width: calc(100% + 2.4em); padding: 16px 1.2em; margin-left: -1.2em; background-color: #fbfbfb;}

.attach_box {padding: 12px; background-color: #fbfbfb; border-radius: 5px;}
.attach_box dl {display: flex; align-items: flex-start; width: 100%;}
.attach_box dt {width: 65px; font-size: 14px; color: #888;}
.attach_box dd {display: flex; width: calc(100% - 65px); flex-direction: column; align-items: flex-start; gap: 10px;}
.attach_box p {font-size: 14px; color: #5834E8; text-decoration: underline;}




/* -------- 고객센터-------- */
.wrap.my.board .amount_filter button {width: max-content;}
.tab_box.cs {width: calc(100% + 2.4em); margin-left: -1.2em; padding: 16px 1.2em; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 6px; background-color: #fbfbfb;}
.tab_box.cs .btn_main {border: 1px solid #eee; background-color: #eee; color: #888;}
.tab_box.cs .btn_main.on {border-color: #5834E8; color: #fff; background-color: #5834E8;}

.faq_list {display: flex; flex-direction: column; width: 100%;}
.faq_con {display: flex; flex-direction: column; width: 100%; gap: 15px; padding: 20px 0; border-bottom: 1px solid #eee;}
.faq_con .faq_tit {display: flex; align-items: center; justify-content: space-between;}
.faq_con .faq_tit p {display: flex; align-items: center; gap: 8px; font-size: 15px; line-height: 1.4; font-weight: 500;}
.faq_con .faq_tit p i {display: block; width: 26px; height: 26px; background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169153031236862.png) no-repeat center/contain;}
.faq_con .faq_tit .open {display: block; width: 10px; height: 5px; background: url(../img/faq_arrow.png) no-repeat center/contain; transition: all .2s;}
.faq_con.on .faq_tit .open {transform: rotate(180deg);}
.faq_con .faq_cont {padding: 12px; background-color: #fafafa; border-radius: 5px; display: none;}
.faq_con .faq_cont p {font-size: 15px; line-height: 1.4;}
.faq_con.on .faq_cont {display: block;}


/* 1:1 문의하기 */
.notice_list .status {display: flex; align-items: center; gap: 5px;}
.notice_list .status p {font-size: 14px; color: #777;}

.review_reply.inquiry {background-color: #fbfbfb;}

.wrap.write .open_input {margin-bottom: 30px;}
.wrap.write .btn_box {margin-top: 20px;}


/* -------- 이용약관 -------- */
.terms_area {display: flex; flex-direction: column; width: 100%;}
.terms_area .terms_item {padding: 20px 0; border-bottom: 1px solid #eee; display: flex; align-items: center; justify-content: space-between;}
.terms_area .terms_item .arrow {width: 10px; height: 16px; background: url(../img/terms_arrow.png) no-repeat center/contain; display: block;}


/* -------- 알림설정 -------- */
.alarm_area {display: flex; flex-direction: column; width: 100%;}
.alarm_item {display: flex; align-items: center; justify-content: space-between; padding: 20px 0; border-bottom: 1px solid #eee;}
.alarm_item span {font-size: 15px; font-weight: 500;}
.toggle {width: 50px; height: 32px; border-radius: 50px; background-color: #eee; position: relative; transition: all .2s;}
.toggle i {display: block; width: 23px; height: 23px; border-radius: 100%; background-color: #fff; box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .05); top: 50%; left: 4px; transform: translateY(-50%); position: absolute; transition: all .2s;}
.toggle.on {background-color: #5834E8;}
.toggle.on i {left: initial; right: 4px;}


/* -------- 회원탈퇴 -------- */
.with_tit {font-size: 24px; font-weight: 500; line-height: 1.4; padding-bottom: 12px;}
.input_box.with {margin-top: 30px;}
.btn_box.with {position: fixed; bottom: 30px; left: 0; padding: 0 1.2em; width: 100%;}