@charset "utf-8";
.wrap {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    height: 100%;
}
/*** 메인 ***/
.main_top_area, .top_area {
   background: #401164;
   padding-top: 10px;
   box-sizing: border-box;
}
.main_top_area header {
    padding: 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content:space-between
}
.main_top_area header .menu_txt {
    color: #FFF;
    font-size: 14px;
    line-height: 22px; /* 157.143% */
    letter-spacing: -0.5px;
    display: inline-block;
    padding-top: 6px;
}
.main_top_area .top_nav {
    padding: 0 16px;
    box-sizing: border-box;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.16);
}
.main_top_area .top_nav ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}
.main_top_area .top_nav ul li {
    flex: 1;
}
.main_top_area .top_nav ul li a {
    display: block;
    padding: 14px 0;
    color: rgba(255, 255, 255, 0.7);
    text-align: center;
    font-family: pre_M;
    font-size: 13px;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.325px;
    position: relative;
}
.main_top_area .top_nav ul li.on a {
    font-family: pre_B;
    opacity:unset;
    border-bottom: 3px solid #9969BD;
}
.main_top_area .top_nav ul li .new::after {
    content: "•";  
    font-size: 18px;
    color: #FF1414;
    opacity: 1;
    position: absolute;
    top: 3px;
    right: 0px;
}
.main_br_area {
   /* background: url(/images/main_banner_bg.svg) center bottom no-repeat;
    background-size: cover;*/
    /*min-height: 200px;*/
    text-align: center;
    color: #fff;
}
.main_content .sort_bar {
   height: 42px;
   background: #440D6D;
   display: flex;
   justify-content: space-between;
   align-items: center;
}
.main_content .sort_bar .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 13px;
    line-height: 22px; /* 169.231% */
    letter-spacing: -0.3px;
}/*
.main_content .sort_bar .sort_view a {
    display: inline-block;
    padding-right: 20px;
    background: url(/images/sort_arr.svg) right center no-repeat;
    color: #FFF;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: -0.5px;
}*/
.main_content .sort_bar button {
	background:none;
	border:0;
}
.main_content .sort_bar button span {
	display: inline-block;
    padding-right: 20px;
    background: url(/images/sort_arr.svg) right center no-repeat;
    color: #FFF;
    font-size: 12px;
    line-height: 22px;
    letter-spacing: -0.5px;
}
.main_content {
    background: #471874;
    padding: 0 15px;
    box-sizing: border-box;
}
.main_content .mst_list .mst_info {
    padding: 36px 0 30px 0;
    box-sizing: border-box;
}
.mst_list .mst_box {
    border-radius: 9px;
    position: relative;
    width: 100%;
    height: 119px;
}
.mst_box.box_purple {
    background: url(/images/mst_box_purple.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_blue {
    background: url(/images/mst_box_blue.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_green {
    background: url(/images/mst_box_green.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_gray {
    background: url(/images/mst_box_gray.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_purple_02 {
    background: url(/images/mst_box_purple_02.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_blue_02 {
    background: url(/images/mst_box_blue_02.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_green_02 {
    background: url(/images/mst_box_green_02.svg) no-repeat;
    background-size: cover;
}
.mst_box.box_gray_02 {
    background: url(/images/mst_box_gray_02.svg) no-repeat;
    background-size: cover;
}
.mst_list .mst_box .mst_img img {
    width: 148px;
    position: absolute;
    left: 0;
    bottom: 0;
}
.mst_list .mst_box .mst_txt {
    position: absolute;
    left: 145px;
    top: 25px;
    padding-right: 20px;
    box-sizing: border-box;
}
.mst_list .mst_box .mst_txt .name {
    display: inline-block;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    border-radius: 30px;
    border: 1px solid #FFF;
    padding: 2px 11px;
}
.mst_list .mst_box .mst_txt .name span {
    font-family: pre_B;   
}
.mst_list .mst_box .mst_txt .txt {
    margin-top: 12px;
    color: #FFF;
    font-family: pre_M;
    font-size: 12px;
    line-height: 16px; /* 133.333% */
    letter-spacing: -0.06px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.mst_list .mst_info .badge_li {
    margin-top: 24px;
    display: flex;
    gap: 8px;
}
.mst_list .mst_info .btn_new {
    font-size: 12px;
    font-family: pre_M;
    color: #fff;
    padding: 2px 11px;
    border-radius: 30px;
    border: 1px solid #FFB360;
    background: none;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.mst_list .mst_info .btn_sale {
    font-size: 12px;
    font-family: pre_M;
    color: #fff;
    padding: 2px 11px;
    border-radius: 30px;
    border: none;
    background: #804CA6;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.mst_list .mst_info .badge_li .hash_tag {
    padding: 4px 11px;
    border-radius: 30px;
    background: #5B268E;
    color: #fff;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.mst_list .mst_info .hash_tag {
    margin-top: 8px;
    color: #FFF;
    font-family: pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.mst_list .mst_info .message_txt {
    margin-top: 5px;
    color: #A18FB3;
    font-size: 12px;
    line-height: 24px;
}
.main_content .mst_info .review_area {
    margin-top: 15px;
    position: relative;
}
.main_content .mst_info .review_area .review_su {
    display: inline-block;
    padding-left: 22px;
    background: url(/images/icon_review.svg) left center no-repeat;
    color: var(--fontcolor-, #CBBCD6);
    font-size: 14px;
    line-height: 22.4px; /* 160% */
}     
.main_content .mst_info .review_area .price {
    color: #FFF;
    font-family: Pre_M;
    font-size: 20px;
    line-height: 24px; /* 120% */
    position: absolute;
    right: 0;
    top: -5px;
} 
.main_content .mst_info .review_area .price span {
    color: #C9BDD4;
    font-size: 12px;
    line-height: 24px;
}
.main_content .mst_info .review_area .review_box {
    margin-top: 20px;
    border-radius: 30px;
    background: #3E1169;   
    padding: 0 16px; 
    box-sizing: border-box;
    height: 42px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.main_content .mst_info .review_box .txt {
    width: 77%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--fontcolor-, #CBBCD6);
    font-family: Pre_M;
    font-size: 12px;
    line-height: 22px; /* 183.333% */
    letter-spacing: -0.3px;
}
.main_content .mst_info .review_box .btn_view {
    color: #FFF;
    font-size: 12px;
    line-height: 22px; /* 183.333% */
    letter-spacing: -0.5px;
    opacity: 0.7;
    display: inline-block;
    padding-right: 17px;
    background: url(/images/icon_plus.svg) right center no-repeat;
}
.main_content .mst_info .btn_area {
    margin-top:  20px;
}
.footer {
    padding: 40px 20px;
    box-sizing: border-box;
    background: #39175A;
    display: flex;
    flex-direction: column;
    gap: 17px;
}
.footer .fr_menu {
    font-size:0;
}
.footer .fr_menu li {
    display: inline-block;
    padding: 0 7px;
    color: #FFF;
    font-family: Pre_M;
    font-size: 11px;
    line-height: 11px; /* 100% */
    border-right: 1px solid #7D6E8D;
    margin-bottom: 5px;
}
.footer .fr_menu li:first-child {
    padding-left: 0;
}
.footer .fr_menu li:last-child {
    padding-right: 0;
    border-right: 0;
}
.footer .fr_info .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 11px;
    line-height: 17.143px; /* 160% */
    margin-bottom: 4px;
}
.footer .fr_info li {
    color: #C9C9C9;
    font-size: 11px;
    line-height: 17.143px; /* 160% */
}

/*** 로그인 ***/
.top_area {
    padding: 12px;
    box-sizing: border-box;
}
.top_area header {
    display: flex;
    gap: 20px;
    align-items: center;
}
.top_area header .right_menu {
    min-width: 44px;
    background: none;
    border: 0;
}
.top_area .page_tit {
    padding: 8px 0 7px 0;
    color: #FFF;
    text-align: center;
    font-family: "numj_B";
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px; /* 125% */
    flex: 1;
}
.top_area .right_menu button{
    width: 50px;
    height: 34px;
    line-height: 34px;
    color: #C7B7D1;
    text-align: right;
    font-size: 14px;
    letter-spacing: -0.5px;
    background: none;
    border: 0;
}   
.top_area .btn_back {
    background: none;
    border: 0;
}
.login_content {
    height: auto;
    padding: 15px 15px 100px 15px;
    /*box-sizing: border-box;*/
    background: url(/images/bottom_cloud.svg) bottom no-repeat, #471874;
}
.login_content .in_box {
    padding: 34px 20px 16px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 18px;
    border-radius: 20px;
    border: 1px dashed #8D65AB;
    border: 1px dashed color(display-p3 0.531 0.403 0.6533);
    border-width: 1.5px;
    background: linear-gradient(166deg, #7235A0 5.78%, #4D1775 19.82%);
}
.login_content .in_box .logo {
    text-align: center;
}
.login_content .in_box .login_img {
    text-align: center;
    background: url(/images/login_img_star.png) center no-repeat;
    background-size: cover;
}
.login_content .in_box .login_txt .txt_01 {
    color: #DFD0EA;
    text-align: center;
    font-size: 13px;
    line-height: 12px; /* 92.308% */
}
.login_content .in_box .login_txt .txt_02 {
    color: #FFF;
    text-align: center;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
    text-shadow: 2px 2px 4px color(display-p3 0 0 0 / 0.15);
    font-family: Pre_SB;
    font-size: 26px;
    line-height: 26px; /* 100% */
    margin-top: 12px;
}
.login_content .in_box .login_txt_02 {
    padding: 14px 0;
    border-radius: 10px;
    border: 1px solid #5D2D82;
    border: 1px solid color(display-p3 0.3415 0.1868 0.4924);
    background: #46126D;
    background: color(display-p3 0.2514 0.0851 0.4102);
}
.login_content .in_box .login_txt_02 .txt_01 {
    color: #DFD0EA;
    text-align: center;
    font-size: 12px;
    line-height: 21px; /* 175% */
}
.login_content .in_box .login_txt_02 .txt_01 span {
    color: #FFCC5E;
    font-family: pre_B;
}
.login_content .in_box .btn_kakao {
    height: 44px;
    width: 100%;
    border-radius: 30px;
    border: 1px solid #FFE200;
    background: #E5D000;
}
.login_content .in_box .btn_kakao .btn_txt {
    color: #000;
    font-family: Pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    display: inline-block;
    padding-left: 27px;
    background: url(/images/icon_kakao.svg) left center no-repeat;
}
.login_content .in_box .btn_kakao .bold {
    font-family: Pre_EB;
}
.login_content .in_box .btn_area button:first-child {
    margin-bottom: 15px;
}
.login_content .in_box .line {
    height: 1px;
    background: #3E0F62;
    margin: 16px 0;
}

/*** 마스터 상세보기 ***/
.sub_content.mst_view {
    background: #331253;
    padding-bottom: 90px;
}
.mst_view .mst_img {
    height: 203px;
    background: url(/images/mst_bg_purple.svg) no-repeat;
    background-size: cover;
    position: relative;
}
.mst_view .mst_img .mst_photo {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translate(-50%);
}
.mst_view .mst_img .mst_photo img {
    width: 200px;
}
.mst_view .mst_img .badge {
    position: absolute;
    top: 20px;
    left: 20px;
    display: inline-block;
    padding: 4px 12px;
    font-size: 12px;
    color:#fff;
    font-family: pre_B;
    border-radius: 30px;
    border: 0.5px solid #FFF;
}
.mst_view .mst_info_01 {
    background: #471874;
    padding: 0 15px 24px 15px;
    box-sizing: border-box;
    margin-bottom: 11px;
}
.mst_view .mst_info_01 .info_box {
    width: 100%;
    margin-top: -45px;
    position: relative;
    z-index: 100;
}
.mst_view .mst_info_01 .info_box .card {
    background: url(/images/card_bg.svg) center no-repeat, linear-gradient(-18.56deg, rgba(62, 17, 105, 1) 0%, rgba(114, 38, 186, 1) 100%);
    border-radius: 20px;
    border-style: solid;
    border-color: #2c0a4c;
    border-width: 0.5px;
    padding: 20px 25px;
    box-sizing: border-box;
}
.info_box .card .name {
    color: #FFF;
    text-align: center;
    font-family: Pre_B;
    font-size: 20px;
    line-height: 24px; /* 120% */ 
}
.info_box .card .name .num {
    display: inline-block;
    padding: 2px 12px;
    margin-left: 5px;
    color: #FFF;
    font-family: Pre_B;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.07px;
    border-radius: 30px;
    border: 1px solid #8157A0;
    background: #58138B;
    vertical-align: text-top;
}
.info_box .card .tag {
    color: #CBBCD6;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-top: 5px;
    padding-bottom: 12px;
    border-bottom: 0.5px solid #5B2F85;
	width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.info_box .card .price_area {
    margin-top: 5px;
    display: flex;
}
.info_box .card .price_area>div {
    padding-left: 15px;
    box-sizing: border-box;
    flex: 1;
}
.info_box .card .price_area .tit {
    color: #CBBCD6;
    font-family: pre_M;
    font-size: 10px;
    line-height: 24px; /* 240% */
}
.info_box .card .price_area .price {
    color: #FFF;
    font-family: pre_M;
    font-size: 20px;
    line-height: 24px; /* 120% */
}
.info_box .card .price_area .price>span {
    color: var(--fontcolor-, color(display-p3 0.7865 0.7405 0.8305));
    font-family: pre_L;
    font-size: 12px;
    line-height: 24px;
} 
.mst_view .mst_info_01 .icon_area {
    margin-top: 20px;
    position: relative;
}
.mst_view .mst_info_01 .icon_area .badge {
    display: inline-block;
    padding: 4px 11px;
    color: #FFF;
    font-family: pre_M;
    font-size: 12px;
    letter-spacing: -0.06px;
    border-radius: 30px;
    background: #804CA6;
}
.mst_view .mst_info_01 .icon_area .icon_li {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    gap: 13px;  
}
.mst_view .mst_info_01 .icon_area .icon_li li button {
	background: none;
	border:0;
}
.mst_view .mst_info_01 .icon_area .icon_li button span {
    display: inline-block;
    padding-left: 20px;
    color: #FFF;
    font-size: 14px;
    line-height: 22.4px; /* 160% */
}
.mst_view .mst_info_01 .icon_area .talk span{
    padding-left: 20px;
    background: url(/images/icon_talk.svg) left center no-repeat;
}
.mst_view .mst_info_01 .icon_area .star span{
    padding-left: 14px;
    background: url(/images/icon_star.svg) left center no-repeat;
}
.mst_view .mst_info_01 .tag_li {
    margin-top: 24px;
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
.mst_view .mst_info_01 .tag_li li {
    padding: 3px 11px;
    border-radius: 30px;
    background: #632293;
    color: #FFF;
    font-family: pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.3px;
}
.mst_view .mst_info_01 .warn_txt {
    margin-top: 25px;
    color:  #DFD0EA;    
    font-size: 10px;
    line-height: 18px; /* 180% */
}
.mst_view .mst_info_01 .warn_txt span {
    color: #DAC34E;
}
.mst_view .mst_info_02 {
    background: #471874;
    padding: 15px 0px 0px 0px;
    box-sizing: border-box;
}
.mst_view .mst_info_02 .tab_menu {
    display: flex;
    border-bottom: 1px solid #371953;
    padding: 0 15px;
    box-sizing: border-box;
}
.mst_view .mst_info_02 .tab_menu li {
    flex: 1;
}
.mst_view .mst_info_02 .tab_menu li button {
    background: none;
    border: 0;
    padding: 14px 0;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    color: #fff;
    text-align: center;
    font-size: 13px;
    font-family: pre_M;
    letter-spacing: -0.325px;
    opacity: 0.7;
}
.mst_view .mst_info_02 .tab_menu li.on button{
    border-bottom: 3px solid #9969BD;
    color: #fff;
    font-size: 13px;
    font-family: pre_B;
    letter-spacing: -0.325px;
}
.mst_view .mst_info_02 .content.detail_view {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mst_info_02 .content.detail_view .section {
    padding: 10px 0px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.mst_info_02 .content.detail_view .section .tit {
    color: #FFF;
    font-family: Pre_B;
    font-size: 16px;;
    line-height: 24px; /* 150% */
}
.mst_info_02 .content.detail_view .section .cont li, .mst_info_02 .content.detail_view .section .cont {
    color:  #DFD0EA;
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.mst_info_02 .content.detail_view .section .tit_02 {
    color: #FFF;
    font-family: pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.sub_content .bottom_btn_area {
    padding: 18px 16px 24px 16px;
    box-sizing: border-box;
    display: flex;
    gap: 6px;
    position: fixed;
    bottom: 0px;
    max-width: 720px;
    width: 100%;
    background: #331253;
	z-index:1000;
}
.bottom_btn_area .btn_round_like {
    padding: 12px 16px;
    border-radius: 50px;
    background: #8537BF;
    border: none;
}
.bottom_btn_area .btn_state {
    flex: 1;
}
/*** 상세보기-상담후기 ***/
.mst_view .mst_info_02 .content {
     padding: 24px 15px;
    box-sizing: border-box;
}
.mst_view .mst_info_02 .content.detail_review {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mst_view .mst_info_02 .detail_review .btn_review {
    display: flex;
    padding: 10px 0px;
    flex-direction: column;
    gap: 10px;
}
.mst_view .mst_info_02 .detail_review .btn_review .txt_s {
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.btn_review .txt_s::before {
    content: "• "; 
    color: #DFD0EA; 
    padding-left: 10px;
}
.mst_view .detail_review .review_list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    padding: 10px 0;
}
.mst_view .detail_review .review_list .writer {
    position: relative;
    width: 100%;
}
.mst_view .detail_review .review_list .writer .name {
    color: #FFF;
    font-family: Pre_B;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.mst_view .detail_review .review_list .writer .date {
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.mst_view .detail_review .review_list .writer .star_li {
    display: flex;
    align-items: center;
    gap: 7px;
}
.mst_view .detail_review .review_list .writer .img_star img {
    margin-right: 3px;
}
.mst_view .detail_review .review_list .writer .txt_tag {
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.mst_view .detail_review .review_list .writer .label_best {
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 30px;
    background: #D16B47;
    padding: 2px 8px;
    color: #FFF;
    font-family: Pre_M;
    font-size: 10px;
    line-height: 18px; /* 180% */
    letter-spacing: -0.05px;
}
.mst_view .detail_review .review_list .review_txt {
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 200% */
}
.box_round_01 {
    width: 100%;
    border-radius: 10px;
    background: #5D2686;
    padding: 16px;
    box-sizing: border-box;
}
.mst_view .detail_review .review_list .mst_reply .mst_info {
    position: relative;
    width: 100%;
}
.mst_view .detail_review .review_list .mst_reply .mst_info .name {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.mst_view .detail_review .review_list .mst_reply .mst_info .date {
    position: absolute;
    top: 0;
    right: 0;
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.mst_view .detail_review .review_list .mst_reply .reply_txt {
    margin-top: 10px;
    color: var(--fontcolor-, #DFD0EA);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px; /* 200% */
}
.line { 
    margin: 10px 0;
    background: #3E0F62;
    height: 1px;  
}
.line_02 { 
    margin: 10px 0;
    background: #66318E;
    height: 1px;  
    width: 100%;
}
/*** 상세보기 일대일문의 ***/
.detail_review .btn_review .tit {
    color: #fff;
    font-family: Pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.detail_review .btn_review .notice_li li {
    color: #DFD0EA;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 24px; /* 200% */
    list-style-type: disc;
    margin-left: 17px;
}
.review_list .writer .icon_lock {
    display: inline-block;
    margin-left: 4px;
}
.detail_review .btn_round_line {
    padding: 8px 16px;
    margin: 10px auto 28px;
}
.agree_label {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
}
/* checkbox 시각적으로 숨기되 접근성 유지 */
.agree_label input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    z-index: 1;  /* 클릭 가능하도록 */
}

/* 커스텀 체크박스 모양 */
.agree_label .checkmark {
    width: 17px;
    height: 17px;
    margin-right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: url(/images/check_off_01.svg) no-repeat;
    background-size: contain;
}
/* 체크됐을 때 */
.agree_label input[type="checkbox"]:checked + .checkmark {
	background: url(/images/check_on_01.svg) no-repeat;
    background-size: contain;
}



/*** 마이페이지 ***/
.sub_content.mypage, .sub_bg {
    background: #471874;
    min-height: 100vh;
}
.mypage_container, .sub_container {
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: flex-start;
    justify-content: flex-start;
}
.box_round_02 {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 10px;
    border: 1px solid #6D3795;
    background: #5A1D87;
}
.box_round_03 {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 10px;
    background: #5A1D87;
}
.box_round_04 {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 10px;
    border: 1px solid #7D3FAA;
    background: linear-gradient(150deg, #8847B9 -0.27%, #682A95 33.44%);
}
.mypage_container .my_info .info_01 .name{
    display: inline-block;
    padding-left: 20px;
    height: 20px;
    background: url(/images/icon_my.svg) left center no-repeat;
    color: #FFF;
    font-family: Pre_M;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.mypage_container .my_info .info_01 {
    display: flex;
    justify-content: space-between;
}
.mypage_container .my_info .info_01 .btn_my_info {
    background: none;
    border: 0;
}
.mypage_container .my_info .info_01 .btn_my_info span {
    display: inline-block;
    padding-right: 20px;
    background: url(/images/icon_arr_01.svg) right center no-repeat;
    color: #CBBCD6;
    font-size: 14px;
    line-height: 22.4px; /* 160% */
}
.mypage_container .my_info .point_box, .sub_container .my_info .point_box  {
    border-radius: 10px;
    border: 1px solid #8A54B2;
    background: linear-gradient(142deg, #8A51B4 5.89%, #6E3698 26.1%);
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.10);
    padding: 30px 16px;
    box-sizing: border-box;
    text-align: center;
    margin-top: 12px;
}
.mypage_container .my_info .point_box .tit, .sub_container .my_info .point_box .tit {
    color: #FFF;
    text-align: center;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    margin-bottom: 8px;
}
.mypage_container .my_info .point_box .point span, .sub_container .my_info .point_box .point span  {
    display: inline-block;
    padding-left: 30px;
    background: url(/images/icon_point.svg) left center no-repeat;
    background-size: 22px;
    text-align: center;
    color: #fff;
    font-size: 30px;
    line-height: 25px; /* 83.333% */
    letter-spacing: -0.15px;
}
.mypage_container .btn_list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    margin-top: 24px;
}
.mypage_container .btn_list .list {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    align-content: flex-start;
    align-self: stretch;
}
.mypage_container .btn_list .list button {
    height: 40px;
    border: 1px solid #79479E;
    padding: 8px 16px;
    box-sizing: border-box;
    flex: 1 0 0;
}
.mypage_container .btn_list .list button.on {
    border-radius: 30px;
    background: #AC57EB;
    border: none;
}
.mypage_container .my_info .btn_list .list .empty {
    height: 40px;
    padding: 8px 16px;
    flex: 1 0 0;
    visibility: hidden;
}
.mypage_container .story_counsel {
    padding: 30px 20px;
    box-sizing: border-box;
}
.mypage_container .story_counsel .oz_img {
    text-align: center;
}
.mypage_container .story_counsel .tit {
    text-align: center;
    margin-top: 16px;
    color: #FFF;
    font-family: Pre_M;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.mypage_container .story_counsel .comment {
    color: #CBBCD6;
    text-align: center;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.mypage_container .story_counsel .btn_area {
    margin-top: 16px;
}
.mypage_container .card_add .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.mypage_container .card_add .comment {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.mypage_container .card_add_img, .mypage_container .card_regi_img {
    margin-top: 10px;  
}
.mypage_container .card_add_img, .mypage_container .card_regi_img button, .mypage_container .card_add_img, .mypage_container .card_add_img button {
	width: 100%;
	background:none;
	border:none;
}
.mypage_container .card_add_img img, .mypage_container .card_regi_img img  {
    width: 100%;
}
.mypage_container .card_add .card_regi_img, .sub_container .card_area .card_regi_img {
    position: relative;
}
.mypage_container .card_add .card_regi_img .card_info, .sub_container .card_area .card_regi_img .card_info {
    position: absolute;
    left: 17px;
    bottom: 15px;
}
.mypage_container .card_add .card_info .name, .sub_container .card_area .card_info .name {
   color: #FFF;
    font-family: Pre_M;
    font-size: 15px;
    letter-spacing: -0.146px;
}
.mypage_container .card_add .card_info .num, .sub_container .card_area .card_info .num{
    color: #F4BCFF;
    text-shadow: 1.045px 1.045px 1.045px rgba(0, 0, 0, 0.50);
    font-size: 12.545px;
    letter-spacing: -0.125px;
    margin-top: 3px;
}
.mypage_container .card_add .btn_list {
    margin-top: 16px;
}
.mypage_container .my_info_02 {
    display: flex;
    padding: 30px 20px;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    gap: 12px;
    align-self: stretch;
}
.mypage_container .my_info_02 .info_box_01, .mypage_container .my_info_02 .info_box_02 {
    flex: 1;
}
.mypage_container .my_info_02 .box_purple {
    width: 55px;
    height: 48px;
    line-height: 48px;
    border-radius: 20px;
    border: 1px solid #531A7D;
    background: #6B40C2;
    color: #E2D0F0;
    text-align: center;
    font-family: Pre_M;
    font-size: 20px;
    margin: 0 auto;
}
.mypage_container .my_info_02 .tit {
    margin-top: 16px;
    color: #FFF;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.mypage_container .my_info_02 .line {
    width: 1px;
    height: 63px;
    background: #6D3497;
}
.mypage_container .my_info_02 .box_brown {
    width: 55px;
    height: 48px;
    line-height: 48px;
    border-radius: 20px;
    border: 1px solid #531A7D;
    background: #A1544A;
    color: #E2D0F0;
    text-align: center;
    font-family: Pre_M;
    font-size: 20px;
    margin: 0 auto;
}
.mypage_container .menu_list .btn_list {
    margin-top: 0;
}
.btn_round_line.btn_arr {
    background: url(/images/icon_arr_01.svg) right 14px center no-repeat;
    background-size: 16px;
}
.mypage_container .btn_bottom_area {
    width: 100%;
    padding: 12px 0 24px 0;
}
.mypage_container .btn_bottom_area .btn_round_line {
    height: 46px;
    width: 100%;
    max-width: 100%;
    border: 1px solid #8546B3;
    color:#fff;
    font-family: Pre_M;
    font-size: 14px;
    letter-spacing: -0.35px;
}
/*** 선불충전 ***/
.top_area.pdb0 {
    padding-bottom: 0;
}
.top_area.pd_none {
    padding: 0px;
}
.top_area.pd_none header {
    padding: 12px;
    box-sizing: border-box;
}
.top_area .top_nav {
    padding: 0 16px;
    box-sizing: border-box;
}
.top_area .top_nav ul {
    width: 100%;
    height: 48px;
    display: flex;
    align-items: center;
    align-self: stretch;
    border-bottom: 1px solid #441C62;
    background: #401164;
}
.top_area .top_nav ul li { 
     flex: 1 1 auto;
}
.top_area .top_nav ul li button {
    width: 100%;
    padding: 14px 0px;   
    box-sizing: border-box;
    color: #fff;
    text-align: center;
    font-size: 13px;
    letter-spacing: -0.325px;
    line-height: 20px;
    position: relative;
    background: none;
    border: 0;
}
.top_area .top_nav ul li.on button {
    font-family: pre_M;
    opacity:unset;
    border-bottom: 3px solid #9969BD;
    padding-bottom: 11px;
}
/*20251212수정
.top_area .top_nav .on {
    font-family: pre_M;
    opacity:unset;
    border-bottom: 3px solid #9969BD;
    padding-bottom: 11px;
}*/
.sub_container .my_info {
    width: 100%;
}
.sub_content.charge section .tit, .popup_counsel.charge section .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 16px;
    line-height: 24px; /* 150% */
    margin-bottom: 16px;
	text-align:left;
}
.sub_content.charge .money_pick .tit span {
    color: #C9BDD4;
    font-size: 12px;
    line-height: 24px;
}
.sub_content.charge .money_pick .money_li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    width: 100%;
}
.sub_content.charge .money_pick .money_li li {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #8F63B0;
    background: rgba(255, 255, 255, 0.10);
    padding: 10px 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    position: relative;
}
.sub_content.charge .money_pick .money_li .money {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 14px; /* 100% */
}
.sub_content.charge .money_pick .money_li .money>span {
    font-size: 10px;
    display: inline-block;
    margin-left: 5px;
}
.sub_content.charge .money_pick .money_li .point_02 {
    color: #CBBCD6;
    font-size: 10px;
    margin-top: 3px;
}
.sub_content.charge .money_pick .money_li .point {
    display: inline-block;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    position: absolute;
    right: 12px;
    top: 10px;
    border-radius: 30px;
    background: #652C8E;
    padding: 2px 11px;
    box-sizing: border-box;
}
.btn_radio input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 14px;
    height: 14px;
    margin: 0;
    cursor: pointer;
    z-index: 1;  /* 클릭 가능하도록 */
}
.btn_radio.btn_large input[type="radio"] {
    width: 20px;
    height: 20px;
}
/* 커스텀 체크박스 모양 */
.btn_radio .checkmark {
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: url(/images/radio_off.svg) no-repeat;
    background-size: contain;
}
.btn_radio.btn_large .checkmark {
    width: 20px;
    height: 20px;
}
/* 체크됐을 때 */
.btn_radio input[type="radio"]:checked + .checkmark {
	background: url(/images/radio_on.svg) no-repeat;
    background-size: contain;
}
.sub_content.charge .pay_pick .pay_li {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-self: stretch;
}
.sub_content.charge .pay_pick .pay_li li {
    padding: 10px 0;
    box-sizing: border-box;
}
.sub_content.charge .pay_pick .pay_li label {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 14px; /* 100% */
}
.sub_content.charge .pay_pick .pay_li .flexBox {
    align-items: center;
    gap: 8px;
    align-self: stretch;
    position: relative;
}
.sub_content.charge .card_area {
    margin-top: 10px;  
}
.sub_content.charge .card_add_img img, .sub_content.charge .card_regi_img img  {
    width: 100%;
}
.sub_content.charge .card_area .txt_01 a {
    display: block;
    color: #CBBCD6;
    text-align: center;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.sub_content.charge .box_round_03 .inbox {
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
    padding: 14px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}
.sub_content.charge .box_round_03 .inbox .price_li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    row-gap: 8px;
    align-self: stretch;
    flex-wrap: wrap;
}
.sub_content.charge .box_round_03 .inbox .price_li .tit_s {
    color: #FFF;;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 14px; /* 100% */
}
.sub_content.charge .box_round_03 .inbox .price_li .price {
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.sub_content.charge .box_round_03 .inbox .price_li .price.txt_red {
    color: #FF7654;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.07px;
}
.sub_content.charge .btn_bottom_area {
    margin-top: 10px;
    width: 100%;
}
/*** 선불충전 카드등록수정 ***/
.sub_content.charge .tab_menu ul {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 4px;
    flex-shrink: 0;
    align-self: stretch;
    flex-wrap: wrap;
}
.sub_content.charge .tab_menu ul li button {
    border-radius: 10px;
    border: 1px solid #6D448A;
    background: none;
    height: 36px; 
    padding: 0px 10px;
    color: #FFF;
    font-size: 13px;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.325px;
}
.sub_content.charge .tab_menu ul li button.on {
    border: 1px solid #8F63B0;
    background: #703E94;
    color: #FFF;
    font-family: Pre_M;
    font-size: 13px;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.325px;
}
.sub_content.charge .tab_menu .btn_card_regi span {
    display: inline-block;
    background: url(/images/icon_card_regi_off.svg) left center no-repeat;
    padding-left: 15px;
} 
.sub_content.charge .tab_menu .btn_card_regi.on span {
    background: url(/images/icon_card_regi.svg) left center no-repeat;
}                                                          
.sub_content.charge .tab_menu .btn_auto_charge span {
    display: inline-block;
    background: url(/images/icon_auto_charge_off.svg) left center no-repeat;
    padding-left: 15px;
}    
.sub_content.charge .tab_menu .btn_auto_charge.on span {  
    background: url(/images/icon_auto_charge.svg) left center no-repeat;
}                                                     
.sub_content.charge .tab_menu .btn_pwd_setting span {
    display: inline-block;
    background: url(/images/icon_pwd_off.svg) left center no-repeat;
    padding-left: 15px;
}       
.sub_content.charge .tab_menu .btn_pwd_setting.on span {
    background: url(/images/icon_pwd.svg) left center no-repeat;
}  
.sub_content.charge .card_info.box_round_03, .popup_counsel.charge .card_info.box_round_03 {
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-self: stretch;
}                                     
.sub_content.charge .card_info .tit_txt, .popup_counsel.charge .card_info .tit_txt {
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 24px; /* 200% */
	text-align:left;
}  
.sub_content.charge .card_info .inp .tit, .popup_counsel.charge .card_info .inp .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-bottom: 8px;
	text-align:left;
}    
.select_01 {
    width: 100%;
    border-radius: 10px;
    border: none;
    padding: 10px 16px;
    box-sizing: border-box;
    color: #B69DC9;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
    /* 기본 화살표 제거 */
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url("/images/select_arr.svg") no-repeat right 10px center, #6B3493;
}
select {
	border-radius: 10px;
    border: none;
    padding: 10px 16px;
    box-sizing: border-box;
    color: #B69DC9;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
    /* 기본 화살표 제거 */
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url("/images/select_arr.svg") no-repeat right 10px center, #6B3493;
}
.sub_content.charge .card_info ul.card_num, .popup_counsel.charge .card_info ul.card_num {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
	padding-left:0;
	margin-bottom:0;
}
.sub_content.charge .card_info ul.card_num li, .popup_counsel.charge .card_info ul.card_num li {
    flex: 1 ;
}
.input_02{
    height: 44px;
    width: 100%;
    border-radius: 10px;
    background: #6B3493;
    border: none;
    color: #B69DC9;
    text-align: center;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
}
input {
	height: 44px;
    border-radius: 10px;
    background: #6B3493;
    border: none;
    color: #B69DC9;
    text-align: center;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
}
.input_02::placeholder, input::placeholder{
    text-align: left;
    color: #B69DC9;
    font-size: 14px;
    padding: 10px 16px;
    box-sizing: border-box;
}
.inp .li_two, .inp .li_three  {
    display: flex;
    gap: 8px;
}
.inp .li_two {
	padding-left:0;
	margin-bottom:0;
}
.inp .li_two li, .inp .li_three li {
    flex: 1; 
}
.inp .li_four {
    display: flex;
    gap: 8px;
}
.inp .li_four li {
    width: 44px;
    height: 44px;
}
.inp .card_pwd input {
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
}
.charge .agree_area  {
    padding: 20px 0 0 10px;
    box-sizing: border-box;
}
/* checkbox 시각적으로 숨기되 접근성 유지 */
.charge .agree_area input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    z-index: 1;  /* 클릭 가능하도록 */
}

/* 커스텀 체크박스 모양 */
.charge .agree_area .checkmark {
    width: 18px;
    height: 18px;
    margin-right: 8px;
	vertical-align:top;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: url(/images/check_off_03.svg) no-repeat;
    background-size: contain;
}
/* 체크됐을 때 */
.charge .agree_area input[type="checkbox"]:checked + .checkmark {
	background: url(/images/check_on_03.svg) no-repeat;
    background-size: contain;
}
.charge .agree_area .agree_label {
    justify-content: left;
}
.charge .agree_area .agree_label .label_text {
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
	text-align: left;
}
.charge .agree_area .agree_link {
    padding: 8px 0 0 26px; 
}
.charge .agree_area .agree_link button {
    background: none;
    border: 0;
    color: #B594CD;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-underline-offset: auto;
    text-underline-position: from-font;
}
.charge .auto_setting .tit_area {
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    justify-content: space-between;
}
.charge .auto_setting .tit_area .tit {
    margin-bottom: 0;
}
.charge .auto_setting .tit_area .btn_li {
    border-radius: 50px;
    background: #521081;
    display: flex;
    padding: 4px 5px;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
}
.charge .auto_setting .tit_area .btn_li .btn_setting_on {
    border-radius: 14px;
    background: #FF7654;
    padding: 4px 10px;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    border: 0;
}
.charge .auto_setting .tit_area .btn_li .btn_setting_off {
    border-radius: 14px;
    background: #6A3195;
    padding: 4px 10px;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    border: 0;
}
.charge .auto_setting .comment {
    color: #CBBCD6;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px; /* 133.333% */
    padding: 16px 0 12px;
	text-align:left;
}
.charge .auto_setting .comment .txt_red {
    color: #F67F5E;
}
.charge .auto_setting .comment .txt_s {
    font-size: 10px;
}
.charge .auto_setting .agree_area {
    border-top: 1px solid #815AA1;
    padding: 20px 0 0 0;
}
.sub_content.charge .tit_s, .popup_counsel.charge .tit_s {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
	text-align:left;
}
.sub_content.charge .auto_charge, .popup_counsel.charge .auto_charge {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sub_content.charge .pwd_setting, .popup_counsel.charge .pwd_setting {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-self: stretch;
}
.sub_content.charge .tit_txt, .popup_counsel.charge .tit_txt {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 16px; /* 133.333% */
    /*margin-top: -8px;*/
	margin-bottom:0;
	text-align: left;
}
.sub_content.charge .line, .popup_counsel.charge .line {
    height: 0.5px;
    background: #815AA1;
    margin: 0;
}
.sub_content.charge .card_info, .popup_counsel.charge .card_info  {
    display: flex;
    /*padding: 6px 0; 간편결제01 정렬문제 251210*/
    justify-content: space-between;
    /*align-items: center; 간편결제01 정렬문제 251210 */
    align-content: center;
    align-self: stretch;
}
.sub_content.charge .card_info .card_name, .popup_counsel.charge .card_info .card_name {
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
}
.sub_content.charge .card_info .card_num, .popup_counsel.charge .card_info .card_num {
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.sub_content.charge .card_pwd, .popup_counsel.charge .card_pwd {
    padding-top: 10px;
	padding-left:0;
	margin-bottom: 0;
}
.sub_content.charge .inp_pwd, .popup_counsel.charge .inp_pwd  {
    padding: 10px 0;
    margin-top: 8px;
}
.li_six.inp_pwd {
    display: flex;
    gap: 8px;
}
.li_six.inp_pwd li {
    width: 40px;
    height: 40px;
}
input[type="password"] {
    -webkit-text-security: disc; /* circle/dot */
    font-size: 35px; /* 크기 크게 */
}
/*** 충전내역 ***/
.sub_content.charge .charge_list, .sub_content.charge .pay_list  {
    width: 100%;
}
.sub_content.charge .charge_list .sort_btn_li {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
    align-items: center !important;
}
.sub_content.charge .sort_btn_li li {
    line-height: 12px;
}
.sub_content.charge .sort_btn_li button.on {
    color: #FFF !important;
    font-family: Pre_SB !important;
}
.sub_content.charge .sort_btn_li button {
    background: none !important;
    border: 0 !important;
    padding: 14px 10px;
    box-sizing: border-box;
    color: #CDBBDB !important;
    text-align: center !important;
    font-family: Pre_M !important;
    font-size: 12px !important;
    letter-spacing: -0.3px !important;
}
.sub_content.charge .sort_btn_li .line {
    width: 1px;
    height: 13px;
    background: #8A54B2;
} 
.sub_content.charge .charge_list .list_cont {
    padding: 12px 0;
    border-bottom: 0.5px solid #815AA1;
}
.sub_content.charge .charge_list .list_cont .li_tit, .sub_content.charge .pay_list .list_cont .li_tit {
    display: flex;
    justify-content: space-between;
}
.sub_content.charge .charge_list .list_cont .tit, .sub_content.charge .pay_list .list_cont .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-bottom: 0;
}
.sub_content.charge .charge_list .list_cont .tit .txt_s {
    font-size: 12px;
    display: inline-block;
    padding-left: 5px;
}
.sub_content.charge .charge_list .list_cont .point, .sub_content.charge .pay_list .list_cont .point {
    color: #FFF;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.07px;
}
.sub_content.charge .charge_list .list_cont .date, .sub_content.charge .pay_list .list_cont .date {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 24px; /* 200% */
}

/*** 결제내역 ***/
.sub_content.charge .tab_menu.tab_st_02 {
    width: 100%;
    padding: 16px 20px;
    box-sizing: border-box;
    background: #571B85;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    justify-content: space-between;
}
.sub_content.charge .tab_menu.tab_st_02 .round_btn_li button {
    padding: 0px 20px;
    box-sizing: border-box;
}
.sub_content.charge .pay_list .list_cont .date {
    line-height: 140% !important;
}
.sub_content.charge .pay_list .list_cont {
    padding: 16px 0;
    border-bottom: 0.5px solid #815AA1;
 }
.sub_content.charge .coupon_inp .tit_txt {
    margin-top: 18px;
}
.sub_content.charge .coupon_list {
    width: 100%;
}
.sub_content .nodata {
    width: 100%;
    padding: 50px 20px;
    box-sizing: border-box;
    text-align: center;
}
.sub_content .nodata .txt {
    color: #CBBCD6;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 20px; /* 142.857% */
    margin-top: 12px;
    word-wrap:break-word;
    white-space: normal;
    word-break:keep-all;
}

/*** 상담후기 남기기 ***/
.sub_content.review {
    background: #471874;
}
.sub_content.review .mst_info_01 .star_txt {
    color: #CBBCD6;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin: 5px 0;
}
.sub_content.review .mst_info_01 .icon_star_li {
    text-align: center;
    padding-bottom: 12px;
    border-bottom: 0.5px solid #612C8A;
}
.sub_content.review .mst_info_01 .icon_star_li img {
    width: 18px;
    margin: 0 4px;
}
.sub_content.review .mst_info_01 .counsel_type {
    margin-top: 12px;
}
.sub_content.review .tit {
    color: #FFF;
    text-align: center;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.sub_content.review .mst_info_01 .counsel_type .tag_li {
    margin-top: 12px;
    margin-bottom: 12px;
    justify-content: center;
}
.sub_content.review .review_info_01 {
    padding: 0 15px;
    box-sizing: border-box;
    margin-bottom: 0px;
}
.sub_content.review .review_info_02 {
    display: flex;
    padding: 36px 20px 20px;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    align-self: stretch;
}
.sub_content.review .review_info_02 .keyword_li {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 10px;
}
.sub_content.review .review_info_02 .rcm_mst {
    color: #FFF;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 133.333% */
    margin-bottom: 10px;
}
.sub_content.review .review_info_02 .rcm_mst span {
    font-size: 18px;
}
.review .btn_round_line {
    padding: 8px 16px;
    margin: 0 auto;
}
.sub_content.review .review_info_03, .sub_content.qna .qna_write {
    display: flex;
    padding: 20px 20px 24px;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    align-self: stretch;
}
.sub_content.review .review_info_03 .txt_left, .sub_content.qna .qna_write .txt_left {
    width: 100%;
    text-align: left !important;
}
.sub_content.review .review_info_03 .write_box, .sub_content.qna .qna_write .write_box {
    width: 100%;
}
.sub_content.review .review_info_03 textarea, .sub_content.qna .qna_write textarea {
    width: 100%;
    height: 200px;
    border-radius: 20px;
    border: 1px solid #6F359A;
    background: #491173;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
}
.sub_content.review .review_info_03 textarea::placeholder, .sub_content.qna .qna_write textarea::placeholder  {
    color: rgba(255, 255, 255, 0.50);
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.07px;
}
.btn_bottom_area.btn_two {
    display: flex;
    gap: 8px;
    width: 100%;
}
.sub_content.review .btn_bottom_area {
    padding: 10px 0;
    box-sizing: border-box;
}
.sub_content.review{
    padding-bottom: 0px !important;
}
/*** 작성가능후기 리스트 ***/
.sub_content .mst_list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;  
}
.sub_content .mst_list .mst_box {
    height: 115px;
    width: 100%;
    padding: 10px 0 20px 0;
    border-bottom: 0.5px solid #66318E;
    display: flex;
    align-items: center;
    gap: 17px;
    align-self: stretch;
}
.sub_content .mst_list .mst_box .mst_photo {
    width: 120px;
    height: 98px;
    background: url(/images/mst_bg_purple.svg) no-repeat;
    background-size: cover;
    position: relative;
    border-radius: 10px;
}
.sub_content .mst_list .mst_box .mst_photo img {
    width: 120px;
    position: absolute;
    bottom: 0;
}
.sub_content .mst_list .mst_info {
    flex: 1;
}
.sub_content .mst_list .mst_info .name {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 16px; /* 100% */
}
.sub_content .mst_list .mst_info .time {
    color: #CBBCD6;
    font-family: Pre_SB;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
    margin: 8px 0;
    background: url(/images/icon_time.svg) left center no-repeat;
    padding-left: 15px;
}
.sub_content .mst_list .mst_info .date {
    color:#CBBCD6;
    font-size: 9px;
    line-height: 10px; /* 111.111% */
    letter-spacing: -0.5px;
}
.sub_content .mst_list .mst_info .btn_area {
    margin-top: 8px;
}
/*** 작성완료후기 ***/
.sub_content.review .review_list {
    padding: 0px 0 20px;
    margin-top: -20px;
}
.sub_content.review .review_list .review_cont {
    display: flex;
    padding: 25px 0;
    flex-direction: column;
    gap: 18px;
    border-bottom: 0.5px solid #7C5697;
}
.sub_content.review .review_cont .mst_info .badge {
    display: inline-block;
    border-radius: 30px;
    background: #804CA6;
    padding: 2px 11px;
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    margin-right: 5px;
}
.sub_content.review .review_cont .mst_info .name {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 16px; /* 100% */
}
.sub_content.review .review_cont .mst_info {
    position: relative;
}
.sub_content.review .review_cont .mst_info .btn_right {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    gap: 8px;
}
.sub_content.review .review_cont .writer_info .w_date {
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
    background: url(/images/icon_pen.svg) left center no-repeat;
    padding-left: 18px;
}
.sub_content.review .review_cont .writer_info .time {
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
    background: url(/images/icon_time.svg) left center no-repeat;
    padding-left: 18px;
    margin: 7px 0;
}
.sub_content.review .review_cont .writer_info .c_date {
    color: #CBBCD6;
    font-size: 9px;
    line-height: 10px; /* 111.111% */
}
.sub_content.review .review_cont .review_txt, .sub_content.review .review_cont .reply_txt {
    color: #DFD0EA;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.sub_content.review .reply .mst_info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.sub_content.review .reply .mst_info .name {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.sub_content.review .reply .mst_info .date {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.sub_content.review .total .mst_img {
    width: 60px;
    height: 60px;
    border-radius: 60px;
    background: #A873E8;
    position: relative;
}
.sub_content.review .total .mst_img img {
    border-radius: 60px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -30px;
}
.sub_content.review .total .mst_info {
    display: flex;
    gap: 25px;
}
.sub_content.review .total .mst_info .icon_best {
    flex: 1;
    text-align: right;
}
.sub_content.review .total .mst_info .name {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 20px; /* 171.429% */
}
.sub_content.review .total .mst_info .w_date {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 20px; /* 200% */
}
.sub_content.review .total .mst_info .writer {
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 20px; /* 171.429% */
}
.sub_content.review .total .mst_info .icon_best span {
    padding: 2px 11px;
    border-radius: 30px;
    font-size: 12px;
    font-family: Pre_SB;
    background: #F67F5E;
}
/*** 일대일문의 ***/
.sub_content.qna {
    background: #471874;
    padding-bottom: 0px !important;
}
.sub_content.qna .card .tag {
    padding-bottom: 0px;
    border-bottom: none;
}

.sub_content.qna .notice_area {
    padding: 0px 20px 0px 20px; 
    box-sizing: border-box;
    margin-top: -11px;
}
.sub_content.qna .notice_area .tit, .popup_counsel.qna .notice_area .tit {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 12px;
    line-height: 24px; /* 200% */
    letter-spacing: -0.3px;
}
.sub_content.qna .notice_area .notice_li li, .popup_counsel.qna .notice_area .notice_li li {
    color: #CBBCD6;
    font-family: Pre;
    font-size: 12px;
    line-height: 20px; /* 166.667% */
    letter-spacing: -0.3px;
    position: relative;
    padding-left: 12px; /* 여백 조절 */
}
.sub_content.qna .notice_area .notice_li li::before, .popup_counsel.qna .notice_area .notice_li li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;           /* 점의 수직 위치 */
    width: 2px;         /* 점 크기 */
    height: 2px;        /* 점 크기 */
    background: #fff;   /* 점 색 */
    border-radius: 50%; /* 동그라미 */
}
.sub_content.qna .notice_area .notice_li, .popup_counsel.qna .notice_area .notice_li {
    padding-bottom: 10px;
    border-bottom: 0.5px solid #7C5697;
}
.sub_content.qna .qna_write .txt_info, .popup_counsel.qna .qna_write .txt_info  {
    display: flex;
    justify-content: space-between;
    margin-top: 14px;
}
.sub_content.qna .qna_write .txt_info span, .popup_counsel.qna .qna_write .txt_info span {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 20px; /* 166.667% */
    letter-spacing: -0.3px;
}
/* checkbox 시각적으로 숨기되 접근성 유지 */
.qna .qna_write .agree_area input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    z-index: 1;  /* 클릭 가능하도록 */
}

/* 커스텀 체크박스 모양 */
.qna .qna_write .agree_area .checkmark {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: url(/images/check_off_03.svg) no-repeat;
    background-size: contain;
}
/* 체크됐을 때 */
.qna .qna_write .agree_area input[type="checkbox"]:checked + .checkmark {
	background: url(/images/check_on_03.svg) no-repeat;
    background-size: contain;
}
.qna .qna_write .btn_bottom_area {
    margin-top: 10px;
}

/*** 검색 ***/
.top_area .search_area {
    padding: 10px 20px 10px 20px;
    box-sizing: border-box;
}
.top_area .search_area .inp {
    display: flex;
    padding-bottom: 5px;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
}
.top_area .search_area .inp_search {
    height: 40px;
    /*padding: 8px 16px;*/
    box-sizing: border-box;
    border-radius: 30px;
    border: 1px solid #A471C7;
    background: #3D0D61;
    flex: 1;
}
.top_area .search_area .inp_search::placeholder {
    color: rgba(255, 255, 255, 0.50);
    font-family: Pretendard;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.top_area .search_area .btn_search {
    width: 60px;
    height: 40px;
    padding: 8px 16px;
    box-sizing: border-box;
    border: none;
    border-radius: 30px;
    background: #AC57EB;
    color: #FFF;
    font-family: Pre_SB;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}
.top_area .search_area .txt_s {
    padding: 5px 0 10px;
    text-align: center;
    color: #DFD0EA;
    font-size: 12px;
    line-height: 20px; /* 166.667% */
}
/**251216 페이지 수정 
.sub_content.search .ranking_list_tit {
    padding: 10px 0 20px;
}
.sub_content.search .ranking_list_tit .tit {
    color: #FFF;
    font-family: Pre_B;
    font-size: 20px;
    line-height: 20px; 
}
.sub_content.search .ranking_list_tit .tit_txt {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 12px; 
    margin-top: 8px;
}
.sub_content.search .ranking_num {
    background: url(/images/icon_crown.svg) left center no-repeat;
    padding-left: 30px;
    margin-bottom: -10px;
    margin-top: 10px;
}
.sub_content.search .ranking_num span {
    color: #fff;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 16px;
    display: inline-block;
    background: url(/images/crown_line.svg) right center no-repeat;
    padding-right: 120px;
}
.sub_content.search .mst_list .mst_info .tag {
    display: block;
    min-width: 0;
    width: 98%;
    overflow: hidden;
    text-overflow: ellipsis; 
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 14px;
    margin: 5px 0;
}
.sub_content.search .mst_list .mst_info .review {
    color: #CBBCD6;
    font-size: 14px;
    line-height: 22.4px; 
    background: url(/images/icon_review.svg) left center no-repeat;
    padding-left: 20px;
}
.sub_content.search .mst_list .mst_info .price {
    color: #CBBCD6;
    font-size: 10px;
    line-height: 24px;
    margin-top: 3px;
}
.sub_content.search .mst_list .mst_info .price span {
    color: #FF7654;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 24px; 
    display: inline-block;
    padding-right: 5px;
}**/
.sub_content.search .mst_list_02 {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 15px;
}
.sub_content.search .mst_list_02 .mst_box {
    display: inline-block;
    width: auto;
    padding: 10px 0 20px 0;
    border-bottom: 0;
    flex: 1;
    text-align: center;
}
.sub_content.search .mst_list_02 .mst_box .mst_photo {
    width: 100%;
    height: 65px;
    margin: 0 auto;
    background: url(../images/mst_bg_purple.svg) no-repeat;
    background-size: cover;
    position: relative;
    border-radius: 10px;
}
.sub_content.search .mst_list_02 .mst_box img {
    width: 80px;
    position: absolute;
    left: 50%;
    margin-left: -40px;
    bottom: 0;
}
.sub_content.search .mst_list_02 .mst_box .mst_info {
    text-align: center;
    margin-top: 10px;
}
.sub_content.search .mst_list_02 .mst_box .mst_info .name {
    font-size: 14px;
    margin-bottom: 10px;
}
.sub_content.search .counsel_tag_li {
    width: 100%;
}
.sub_content.search .counsel_tag_li .tit {
    margin-bottom: 15px;
}
.sub_content.search .counsel_tag_li ul {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.sub_content.search .counsel_tag_li li button {
    height: 35px;
    padding: 0px 18px;
}
.sub_content.search .open_list {
    margin-top: 20px;
    text-align: center;
}
.sub_content.search .open_list button {
    border: none;
    background: #683499;
    border-radius: 30px;
    padding: 5px 10px 5px 15px;
}
.sub_content.search .open_list button span.open {
    display: block;
    font-size: 11px;
    color: #fff;
    padding-right: 20px;
    background:url(../images/arr_open.svg) no-repeat right center;
    background-size: 12px;
}
.sub_content.search .open_list button span.close {
    display: block;
    font-size: 11px;
    color: #fff;
    padding-right: 20px;
    background:url(../images/arr_close.svg) no-repeat right center;
    background-size: 12px;
}
.search_res .search_tit {
    text-align: center;
    font-size: 16px;
    font-family: pre_B; 
}
.search_res .search_tit .txt_red {
    color: #FF7654
}

/*** 회원정보 ***/
.sub_content.member .box_round_03{
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-self: stretch;
}
.sub_content.member .inp input {
    padding: 0 16px;
    box-sizing: border-box;
    text-align: left;
}
.sub_content.member .inp .tit {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-bottom: 8px;
}
.input_st_none {
    background: none;
    border: none;
    padding: 0 !important;
}
.sub_content.member .input_box {
    height: 44px;
    padding: 0 16px;
    box-sizing: border-box;
    border-radius: 10px;
    background: #6B3493;
    display: flex;
    align-items: center;    
    gap: 12px;
    justify-content: space-between;
}
.sub_content.member .input_box input {
    width: 65%;
}
.sub_content.member .inp .comment {
    margin-top: 8px;
    color: #DFD0EA;
    font-size: 12px;
    line-height: 18px; /* 150% */
}

.sub_content.member .agree .toggle_area {
    display: flex;
    align-items: center;
    gap: 12px;
    align-self: stretch;
    justify-content: space-between;
    padding: 8px 0;
}
.sub_content.member .agree .toggle_area .tit_s {
    color: #FFF;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
}
.toggle_area .btn_li {
    border-radius: 50px;
    background: #521081;
    display: flex;
    padding: 4px 5px;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
}
.toggle_area .btn_li .btn_setting_on {
    width: 55px;
    border-radius: 14px;
    background: #FF7654;
    padding: 4px 10px;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    border: 0;
}
.toggle_area .btn_li .btn_setting_off {
    width: 55px;
    border-radius: 14px;
    background: #6A3195;
    padding: 4px 10px;
    color: #FFF;
    font-size: 12px;
    line-height: 18px; /* 150% */
    border: 0;
}
.inp .select_btn_li {
    display: inline-flex;
    padding: 4px 5px;
    align-items: center;
    gap: 5px;
    border-radius: 10px;
    background: #521081;
    flex: 0;
}
.inp .select_btn_li .btn_select_01, .inp .select_btn_li .btn_select_02  {
    border-radius: 8px;
    background: #622093;
    border: none;
    width: 70px;
    height: 30px;
    padding: 4px 10px;
    box-sizing: border-box;
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
}
.inp .select_btn_li .btn_select_01.on {
    background: #567BFE;
}
.inp .select_btn_li .btn_select_02.on {
    background: #B257F6;
}
.sub_content .member_leave {
    padding: 20px 20px;
    text-align: center;
}
.sub_content .member_leave .txt {
  color: #FFF;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-top: 12px;
    word-wrap:break-word;
    white-space: normal;
    word-break:keep-all;
}
/***1:1문의내역 ***/
.qna section {
    width: 100%;
}
.sub_content.qna .qna_list {
    padding: 0px 0 20px;
    margin-top: -20px;
}
.sub_content.qna .qna_list .li_cont{
    display: flex;
    padding: 25px 0;
    flex-direction: column; 
    gap: 18px;
    border-bottom: 0.5px solid #7C5697;
}
.sub_content.qna .li_cont .mst_info {
    position: relative;
}
.sub_content.qna .li_cont .mst_info .badge {
    display: inline-block;
    border-radius: 30px;
    background: #804CA6;
    padding: 2px 11px;
    color: #FFF;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    margin-right: 5px;
}
.sub_content.qna .li_cont .mst_info .name {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 16px; /* 100% */
}
.sub_content.qna .li_cont .mst_info .btn_right {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    gap: 8px;
}
.sub_content.qna .li_cont .writer_info .w_date {
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 14px; /* 116.667% */
    background: url(/images/icon_lock.svg) left center no-repeat;
    padding-left: 18px;
    margin-top: -5px;
}

.sub_content.qna .li_cont .writer_info .c_date {
    color: #CBBCD6;
    font-size: 9px;
    line-height: 10px; /* 111.111% */
}
.sub_content.qna .li_cont .cont_txt, .sub_content.qna .reply .cont_txt {
    color: #DFD0EA;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.sub_content.qna .reply .mst_info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.sub_conten.qna .reply .mst_info .name {
    color: #FFF;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.sub_content.qna .reply .mst_info .date {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 24px; /* 200% */
}
.sub_content.qna .notice .tit, .popup_counsel.qna .notice .tit {
    color: #FFF;
    text-align: center;
    font-family: Pre_M;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-bottom: 18px;
	text-align:left;
}
.sub_content.qna .notice_li li, .popup_counsel.qna .notice_li li {
    color: #CBBCD6;
    font-family: Pre_M;
    font-size: 12px;
    line-height: 20px; /* 166.667% */
    position: relative;
    padding-left: 12px; /* 여백 조절 */
	text-align:left;
}
.sub_content.qna .notice_li li::before, .popup_counsel.qna .notice_li li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;           /* 점의 수직 위치 */
    width: 2px;         /* 점 크기 */
    height: 2px;        /* 점 크기 */
    background: #fff;   /* 점 색 */
    border-radius: 50%; /* 동그라미 */
}
.sub_content.qna .btn_bottom_area {
    margin-top: 10px;
    width: 100%;
}
.sub_content.qna .customer_qna {
    padding:20px 0
}
.sub_content.qna .customer_qna .writer_info .w_date {
    padding-left: 0;
    background: none;
}
.sub_content.qna .customer_qna .writer_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/*** 단골마스터 ***/
.mst_photo.box_purple {
    background: url(/images/mst_box_purple.svg) no-repeat !important;
    background-size: cover;
}   
.mst_photo.box_blue {
    background: url(/images/mst_box_blue.svg) no-repeat !important;
    background-size: cover;
}   
.mst_photo.box_green {
    background: url(/images/mst_box_green.svg) no-repeat !important;
    background-size: cover;
} 
.mst_photo.box_gray {
    background: url(/images/mst_box_gray.svg) no-repeat !important;
    background-size: cover;
}    

/*** faq ***/
.sub_content .faq_box .q_txt {
    display: inline-block;
    height: 20px;
    line-height: 20px;
    padding-left: 30px;
    background: url(../images/icon_q.svg) left center no-repeat;
    color: #FFF;
    font-size: 14px;
    letter-spacing: -0.07px;
} 
.sub_content .faq_box .a_txt {
    color: #DFD0EA;
    font-size: 12px;
    letter-spacing: -0.06px;
    padding-top: 12px;
    border-top: 1px solid #774E96;
    margin-top: 8px;
    line-height: 18px;
}
.sub_content.notice .tit_area .tit {
    color: #FFF;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.07px;
}
.sub_content.notice .tit_area .date {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    margin-top: 8px;
}
.sub_content.notice .cont_txt {
    color: #DFD0EA;
    font-size: 12px;
    letter-spacing: -0.06px;
    padding-top: 12px;
    border-top: 1px solid #774E96;
    margin-top: 8px;
    line-height: 18px;
}
/*** 앱소개 ***/
.sub_content.app_list .tit {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.sub_content.app_list .app_info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
}
.sub_content.app_list .app_info .info_txt .name {
    color: #FFF;
    font-size: 14px;
    line-height: 18px; /* 128.571% */
    letter-spacing: -0.07px;
    margin-bottom: 4px;
}
.sub_content.app_list .app_info .info_txt .cont_txt {
    color: #DFD0EA;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
}

/*** 사연무료상담 ***/
.sub_content.free_counsel .tit_area .tit {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 16px;
    line-height: 24px; /* 150% */
}
.sub_content.free_counsel .tit_area .tit_txt {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.3px;
}
.sub_content.free_counsel .inp .tit {
    color: #FFF;
    height: 24px;
    font-family: Pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    margin-bottom: 8px;
	margin-top:5px;
}
.sub_content.free_counsel .inp {
    width: 100%;
}
.input_03 {
    width: 100%;
    text-align: left;
    border-radius: 10px;
    border: 1px solid #6F359A;
    background: #491173;
    padding: 10px 16px;
    box-sizing: border-box;
    font-size: 13px;
    color: #fff;
}
.input_03::placeholder {
    color: #B69DC9;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
    letter-spacing: -0.35px;
    padding: 0 !important;
}
.sub_content.free_counsel .inp .tit_txt {
    color:  #CBBCD6;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.3px;
    margin-top: -8px;
}
.sub_content.free_counsel .inp .story_ex {
    padding: 10px 16px;
    box-sizing: border-box;
    border-radius: 10px;
    background: #581789;
    color: #B69DC9;
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.3px;
    margin-top: 12px;
}
.sub_content.free_counsel .inp textarea {
    border-radius: 20px;
    border: 1px solid #6F359A;
    background: #491173;
    padding: 20px;
    box-sizing: border-box;
    width: 100%;
    height: 170px;
    font-size: 13px;
}
.sub_content.free_counsel .inp textarea::placeholder {
    color: rgba(255, 255, 255, 0.50);
    font-size: 13px;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.065px;
}
.sub_content.free_counsel .inp .txt_right {
    color: var(--fontcolor-, #CBBCD6);
    font-size: 12px;
    line-height: 18px; /* 150% */
    letter-spacing: -0.06px;
    text-align: right;
}
/* checkbox 시각적으로 숨기되 접근성 유지 */
.sub_content.free_counsel input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 24px;
    height: 24px;
    margin: 0;
    cursor: pointer;
    z-index: 1;  /* 클릭 가능하도록 */
}

/* 커스텀 체크박스 모양 */
.sub_content.free_counsel .agree_area .checkmark {
    width: 24px;
    height: 24px;
    margin-right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
	background: url(../images/check_off_03.svg) no-repeat;
    background-size: contain;
}
/* 체크됐을 때 */
.sub_content.free_counsel .agree_area input[type="checkbox"]:checked + .checkmark {
	background: url(../images/check_on_03.svg) no-repeat;
    background-size: contain;
}
.sub_content.free_counsel .agree_area label {
    justify-content:left;
    color: #FFF;
    font-family: Pre_SB;
    font-size: 14px;
    line-height: 24px; /* 171.429% */
}
.sub_content.free_counsel .agree_cont {
    margin-top: 8px;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 20px;
    background: #581788;
    color: rgba(255, 255, 255, 0.50);
    font-size: 13px;
    line-height: 20px; /* 153.846% */
    letter-spacing: -0.065px;
}
.sub_content.free_counsel .notice_area {
    padding: 10px 0;
}
.sub_content.free_counsel .notice_area .tit {
    color: #FFF;
    font-family: Pre_SB;
    font-size: 12px;
    line-height: 24px; /* 200% */
    letter-spacing: -0.3px;
    margin-bottom: 4px;
}
.sub_content.free_counsel .notice_area li {
    color: #CBBCD6;
    font-size: 12px;
    line-height: 20px; /* 166.667% */
    letter-spacing: -0.3px;
    position: relative;
    padding-left: 13px;
}
.sub_content.free_counsel .notice_area li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;           /* 점의 수직 위치 */
    width: 2px;         /* 점 크기 */
    height: 2px;        /* 점 크기 */
    background: #CBBCD6;   /* 점 색 */
    border-radius: 50%; /* 동그라미 */
}
.sub_content.free_counsel .btn_bottom_area {
    width: 100%;
}