body {
    margin: 0 auto;
}

.flexBox {
    display: flex;
}
.mb-5px {
    margin-bottom: 5px;
}
.gray7_tt {
    color: var(--gs7);
}

/* margin */
.mb0{margin-bottom:0;}
.mb4{margin-bottom:4px;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb25{margin-bottom:25px;}
.mb30{margin-bottom:30px;}
.mb35{margin-bottom:35px;}
.mb40{margin-bottom:40px;}
.mb45{margin-bottom:45px;}
.mb50{margin-bottom:50px;}

.mt0{margin-top:0;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt25{margin-top:25px;}
.mt30{margin-top:30px;}
.mt35{margin-top:35px;}
.mt40{margin-top:40px;}
.mt45{margin-top:45px;}
.mt50{margin-top:50px;}

.mr0{margin-right:0;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.mr15{margin-right:15px;}
.mr20{margin-right:20px;}
.mr25{margin-right:25px;}
.mr30{margin-right:30px;}

.ml0{margin-left:0;}
.ml5{margin-left:5px;}
.ml10{margin-left:10px;}
.ml15{margin-left:15px;}
.ml20{margin-left:20px;}
.ml25{margin-left:25px;}
.ml30{margin-left:30px;}

/* padding */
.pb0{padding-bottom:0;}
.pb5{padding-bottom:5px;}
.pb10{padding-bottom:10px;}
.pb15{padding-bottom:15px;}
.pb20{padding-bottom:20px;}
.pb25{padding-bottom:25px;}
.pb30{padding-bottom:30px;}
.pb35{padding-bottom:35px;}
.pb40{padding-bottom:40px;}
.pb45{padding-bottom:45px;}
.pb50{padding-bottom:50px;}

.pt0{padding-top:0;}
.pt5{padding-top:5px;}
.pt10{padding-top:10px;}
.pt15{padding-top:15px;}
.pt20{padding-top:20px;}
.pt25{padding-top:25px;}
.pt30{padding-top:30px;}
.pt35{padding-top:35px;}
.pt40{padding-top:40px;}
.pt45{padding-top:45px;}
.pt50{padding-top:50px;}

.pr0{padding-right:0;}
.pr5{padding-right:5px;}
.pr10{padding-right:10px;}
.pr15{padding-right:15px;}
.pr20{padding-right:20px;}
.pr25{padding-right:25px;}
.pr30{padding-right:30px;}

.pl0{padding-left:0;}
.pl5{padding-left:5px;}
.pl10{padding-left:10px;}
.pl15{padding-left:15px;}
.pl20{padding-left:20px;}
.pl25{padding-left:25px;}
.pl30{padding-left:30px;}





.flexdi_row{
  flex-direction: row;
}
.flexdi_col{
  flex-direction: column;
}
.justistart{
  justify-content: flex-start;
}
.justiend{
  justify-content: flex-end;
}
.justicenter{
  justify-content: center;
}
.justibetween{
  justify-content: space-between;
}
.justiaround{
  justify-content: space-around;
}

.alignstretch{
  align-items:stretch;
}
.alignstart{
  align-items:flex-start;
}
.alignend{
  align-items:flex-end;
}
.aligncen{
  align-items:center;
}
.alignbaseline{
  align-items:baseline;;
}

.txtdot{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.overvisi{
    overflow:visible;
}

.headBox em.nofi_1{
    padding:0;
    background:none;
}

.imgContents01 .imgBox_1 .iconimg .expdate {
    position: absolute;
    bottom: 12px;
    left: 12px;
    color: var(--gs1);
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 50px;
    padding: 8px 16px;
}

.imgContents01 .imgBox_1 .iconimg_1 .expdate {
    top: 12px;
    right: 12px;
    bottom: auto;
    left: auto;
    position: absolute;
    color: var(--gs1);
    background: rgba(0, 0, 0, 0.4);
    border-radius: 50px;
    padding: 7px 9px;
}
.imgContents01 .imgBox_1 .iconimg .iconRb_1 {
    bottom: 12px;
    right: 12px;
}
.imgContents01 .imgBox_1 {
    margin-bottom: 12px;
}
.contents03Swiper .textBox .s_tBox p:nth-child(1)::after,
.imgContents01 .textBox > div p:nth-child(1)::after {
    background-color: var(--gs5);
}

.exp-btn-group_1 {
    margin: 0 0 20px;
}
.exp-btn-group_1 .exp-btn {
    margin: 0 8px;
    padding: 6px 0 2px;
}
.exp-btn-group_1 .exp-btn:first-child {
    margin: 0 8px 0 0;
}

footer.main_2 h2 {
    height: auto;
    line-height: inherit;
}

.goBtn{
    background:rgba(255,255,255,0.8);
    width:44px;
    height:44px;
    border-radius: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, .2);
    margin:10px;
}

.title01 .headBox h1 {
    margin: 0;
}
.headBox .hbox_inner {
    width: 100%;
    align-items: flex-start;
    justify-content: space-between;
}
.headBox .hbox_inner h2 {
    margin: 0 20px 5px 0;
    word-break: keep-all;
}
.headBox .hbox_inner .state {
    position: inherit;
    transform: translateY(0);
    margin-left: auto;
}


.details .dt_info{
    padding-bottom:22px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.details .dt_info li{
    padding-bottom:2px;
    white-space: nowrap;
}
.details .dt_info li div:first-child{
    margin-right:3px;
}


.mentor_experience_lecture .exp_infoBox .bg {
    width: 116px;
    max-width: 116px;
}
.mentor_experience_lecture .exp_infoBox .tt {
    max-width: 72%;
    width: 72%;
    word-break: keep-all;
    white-space: inherit;
    margin: 0;
}
body .main-contents-wrap > .wrap.mentorWrap {
    padding: 54px 20px 0;
}
body .main-contents-wrap > .wrap.expdetailWrap {
    padding: 0;
}

.expdetailWrap .expInnerWrap {
    padding: 0 0px 80px;
}

.expdetailWrap .ttBtn_area ul {
    align-items: center;
    justify-content: space-between;
}
.expdetailWrap .ttBtn_area ul li {
    width: 49%;
    padding: 12px 0;
    box-sizing: border-box;
    border: 1px solid var(--gs5);
    border-radius: 6px;
}
.expdetailWrap .ttBtn_area ul li a {
    justify-content: center;
    align-items: center;
}
.expdetailWrap .ttBtn_area .icon {
    margin-right: 4px;
}
.expdetailWrap .ttBtn_area p {
    margin: 0;
}

.expdetailWrap .textBox01 p {
    word-break: keep-all;
    margin: 0 0 6px;
}
.expdetailWrap .textBox01 hr {
    margin: 10px 0;
}
.expdetailWrap .expcontainer {
    padding: 0 20px;
}
.expFormarea {
    padding-top: 20px;
    /*border-top: 1px solid var(--gs5);*/
}
.expFormarea .subtt {
    word-break: keep-all;
    margin-bottom: 30px;
}
.expdetailWrap .forminput_list .input_inner {
    margin: 0 0 22px;
}
.expdetailWrap .forminput_list li .inner_tt {
    margin: 0 0 6px;
}
.expdetailWrap .forminput_list .input_inner .textInput {
    margin: 0;
    height: 220px;
}
.expdetailWrap .forminput_list .input_inner button {
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    padding: 6px 12px;
    border-radius: 6px;
}
.expdetailWrap .forminput_list span.ess {
    color: var(--color-second1);
}

.chk-wrap1 .textCount2{
    bottom:0;
}


/* 체험 마이페이지 */
.container.container2 {
    padding: 0;
}

.tab_swrapper2 .nav-item {
    margin: 0 8px;
}
.tab_swrapper2 .nav-item:first-child {
    margin: 0 8px 0 0;
}
.tab_swrapper2 .nav-link {
    padding: 0;
    position: relative;
}
.tab_swrapper2 .nav-link.active span {
    content: "";
    display: block;
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--color-mg);
}
.tab_swrapper2 .nav-link.active {
    color: var(--color-mg);
}
.wrap .tab-content.tab-content1 {
    margin: 0;
    padding: 0 0 30px;
}
.tab-content1 .blog-wrap button {
    width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 11px;
    right: 10px;
    background: var(--gs9);
    /*transform: translateY(-50%);*/
}
.tab-content1 .titleBox {
    margin: 0 0 10px;
}
.tab-content1 .titleBox h4 {
    margin: 0 0 0 6px;
}
.tab-content1 .infott {
    margin: 15px 0 30px;
}
.tab-content1 .infott p {
    margin: 0 0 6px;
    padding: 0 0 0 8px;
    word-break: keep-all;
    position: relative;
    color: var(--gs7);
}
.tab-content1 .infott p:before {
    position: absolute;
    left: 0;
    top: 8px;
    border-radius: 50px;
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    background: var(--gs6);
}

.tab-content1 .detail .inner_tt {
    margin: 0 0 22px;
}
.tab-content1 .detail .inner_tt .label {
    margin: 0 0 6px;
}

.tablep_Wrap table.table th {
    padding: 6px 10px;
    border-bottom: 1px solid var(--gs5);
}

.tablep_Wrap table.table td {
    border-bottom: 1px solid var(--gs5);
}

.authWrap {
    justify-content: space-between;
}
.authWrap .chk-wrap {
    width: 72%;
}
.authWrap .chk-wrap p {
    margin: 0;
}
.adressWrap button {
    width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}
.adressWrap .houseAddress {
    margin: 0 0 5px;
}

.inner_tt .memOut {
    color: var(--gs7);
}

.custom-select.custom-select2 {
    border-radius: 8px;
    border: 1px solid var(--gs5);
    background: var(--gs2);
    height: 50px;
    padding: 0px 19px 0px 16px;
}

.selectWrap .icoArrow {
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}

.selectWrap .custom-select2 option {
    background: var(--gs2);
}

.address-wrap_1{
    margin-bottom: 6px;
}
.expdetailWrap .input_inner .address-wrap_1 button.mty_button01{
    width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    border:0;
    background: var(--gs9);
    color:var(--gs1);
}

.adressArea .input01_mb6{
    margin-bottom:6px;
}
.reg_inputBox ul {
    margin:0;
}
.reg_inputBox ul li{
    margin:0;
}
.reg_inputBox input[type="checkbox"].checkboxBox1:checked + label,.reg_inputBox input[type="checkbox"].checkboxBox1 + label{
    background-size: 22px;
    word-break: keep-all;
}
.request-info a{
    text-indent: 32px;
}


/* 마이페이지>캠페인 */
.plr_20 {
    padding: 0 20px;
}

.mycamWrap {
    padding: 15px 20px;
}

.mycamWrap .title {
    margin: 0 0 1rem;
}
.mycamWrap .tabSwiper {
    margin-bottom: 22px;
}
.mycamWrap .tabSwiper .nav-link .txt {
    position: relative;
}
.mycamWrap .tabSwiper .nav-link.active .txt {
    color: var(--color-mg);
}

.mycamWrap .tabSwiper .nav-link.active span.line {
    content: "";
    display: block;
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--color-mg);
}

.mycamWrap .tabs_1 .nav {
    align-items: center;
}
.mycamWrap .tabs_1 .nav a {
    color: var(--gs7);
}
.mycamWrap .tabs_1 .nav a.active {
    color: var(--gs9);
}
.mycamWrap .tabs_1 .g_line {
    width: 1px;
    height: 10px;
    background: var(--gs5);
    margin: 0 8px;
}

.campaign-wrap2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 0 50px;
    word-break: keep-all;
    flex-direction: column;
}
.campaign-wrap2 li {
    width: 100%;
    margin-bottom:17px;
}

.campaign-wrap2 li .expmainlist_01{
    display: flex;
    align-items: center;
}

.campaign-wrap2 .reviewBox{
    display: none;
}

.campaign-wrap2 li .expmainlist_01  .imgBox_1{
    width:84px;
    height:84px;
    margin-bottom:0;
}

.campaign-wrap2 li .expmainlist_01 .imgBox .iconimg .iconRb{
    display: none;
}

.campaign-wrap2 li .expmainlist_01 .imgBox_1 .iconimg_1 .expdate{
    bottom: 0;
    top: auto;
    width: 100%;
    left: 0;
    text-align: center;
    box-sizing: border-box;
    border-radius: 0;
}

.campaign-wrap2 .imgContents01 .textBox{
    flex:1;
    margin-left:15px;
}

.campaign-wrap2 .expmainlist_01 .listShow{
    display: block;
}
.campaign-wrap2 .imgContents01 .textBox > div p:nth-child(2){
    padding-right: 10px;
    margin-right: 10px;
    position: relative;
}
.campaign-wrap2 .imgContents01 .textBox > div p:nth-child(2)::after{
        content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--gs5);
    width: 1px;
    height: 10px;
}

.campaign-wrap2 .icon {
    width: 22px;
    bottom: 10px;
    right: 8px;
}

.campaign-wrap2 .count:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 10px;
    background: var(--gs5);
    margin: 0 6px;
    vertical-align: middle;
}
.campaign-wrap2 .red-text {
    color: var(--color-second1);
}
.campaign-wrap2 .card-body {
    margin: 10px 0 20px;
}

/* shop main popup */
/* 팝업 스타일 */
.shopPopup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 85%;
    z-index: 1001;max-width: 500px;
}
/* 팝업 오버레이 */
.shopPopup-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* dim 효과 */
    z-index: 1000;
}
/* 닫기 버튼 스타일 */
.shopPopupclose-btn {
    position: absolute;
    top: -30px;
    right: 0px;
    cursor: pointer;
}
.shopPopup-footer {
    margin-top:10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shopPopup-footer label{
    color:var(--gs1);
}

.shopPopup-footer input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid white;
    border-radius: 3px;
    background-color: transparent;
    cursor: pointer;
    position: relative;
    display: inline-block;
    margin-right:8px;
}

/* 체크되었을 때의 스타일 */
.shopPopup-footer input[type="checkbox"]:checked {
    background-color:  var(--gs1);
    border-color: var(--gs1);
}

/* 체크 표시 스타일 */
.shopPopup-footer input[type="checkbox"]:checked::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 13px;
    height: 9px;
    background:url(/svg/shop/check.svg) 0 0 no-repeat;

}

.sns_box {
    display: flex;
    display: -webkit-flex;
    align-items: center; /* 수직 가운데 정렬 */
    -webkit-justify-content: space-between;
    justify-content: space-between; /* 기본적으로 양 끝에 배치 */
    padding: 8px 12px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid var(--gs5);
    outline: none !important;
    width: 100%;
    background: var(--gs2);
    word-wrap: break-word; /* 긴 텍스트 자동 줄바꿈 */
    word-break: break-all; /* 단어 단위로 줄바꿈 */
    line-height: 2.5;
}

.btn-right {
    margin-left: auto; /* 이 버튼만 오른쪽에 위치하도록 설정 */
    padding: 8px !important;
}

.sns_box a.snsBtn{
    width: auto;
    padding: 0;
    border: 0 !important;
    margin: 0;
    position: absolute;
    top: 2px;
    right: 0;
    text-decoration: underline;
}

.btn-outline-green2 {
    color: #388e3c !important;
    background-color: transparent !important;
    border: 1px solid #388e3c !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0), 0 2px 10px 0 rgba(0, 0, 0, 0) !important;
    border-radius: 7px !important;
}

.btn-outline-danger2 {
    color: #ff3547 !important;
    background-color: transparent !important;
    border: 1px solid #ff3547 !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0), 0 2px 10px 0 rgba(0, 0, 0, 0) !important;
    border-radius: 7px !important;
}

.mycamWrap .no_campaign_wrap {
    width: 100%;
    max-width: 100%;
    text-align: center;
    margin: 45px 0;
}

.mycamWrap .no_campaign_wrap .noImg {
    margin: 0 auto;
}
.mycamWrap .no_campaign_wrap .no_tt {
    color: var(--gs6);
}

.minus_bottom {
    margin-bottom: -45px;
}


/* 신청 자세히보기 모달 팝업 */
.modal-dialog.more_modal_1{
    margin:0;
    word-break: keep-all;
}
.modal-dialog.more_modal_1 .modal-header{
    padding:15px 20px;
}
.modal-dialog.more_modal_1 .modal-cancel{
    margin-left: auto;
}

 .modal-dialog.more_modal_1 .modal-content .modal-body{
    padding:0 20px;
}

.more_modal_1 .subTxt .dot{
    display: block;
    width: 3px;
    min-width: 3px;
    height: 3px;
    background: var(--gs6);
    margin: 7px 4px 7px 0;
    border-radius: 50px;
}
.more_modal_1 .subTxt li{
    margin-bottom:8px;
}
.more_modal_1 .subTxt p{
    margin:0;
}

.more_modal_1 .tableBox table {
    border: 1px solid var(--gs5);
    box-sizing: border-box;
    margin: 30px 0;
}

.more_modal_1 .tableBox th{
    background: var(--gs3);
    padding: 10px 0;
    border-left: 1px solid var(--gs5);
    border-bottom: 1px solid var(--gs5);
    text-align: center;
    vertical-align: middle;
}
.more_modal_1 .tableBox th:first-child{
    border-left:0;
}
.more_modal_1 .tableBox td{
    padding: 20px 10px;
    word-break: keep-all;
    color: var(--gs7);
    border-left: 1px solid var(--gs5);
    border-bottom: 1px solid var(--gs5);
    box-sizing: border-box;
    vertical-align: middle;
}

.more_modal_1 .tableBox td.textline{
    text-decoration: underline;
}

.more_modal_1 .modal-footer{
    padding:0 20px 40px;
    border:0;
}

.expdetailWrap .forminput_list .input_inner button.phone_button {
    width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    border: 0;
    background: var(--gs9);
    color: var(--gs1);
}


/* 인플루언서 컨텐츠 등록하기 */
.content_regDetail{
    margin-top:54px;
    padding:0 20px;
}

.content_regDetail .content_inner01{
    /*padding-top:10px;*/
}

.content_inner01 .brand{
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}
.content_inner01 .brand h4{
    max-width: 88%;
}

.content_regDetail .infoBox {
    align-items: normal;
    margin-bottom:6px;
}
.content_regDetail .infoBox .bg{
    width:95px;
    max-width: 116px;
}
.content_regDetail .infoBox .tt{
    max-width: 72%;
    width: 72%;
    word-break: keep-all;
    white-space: inherit;
    margin: 0;

}
.content_regDetail .infoBox .bg p{
    display: inline-block;
    background-color: var(--gs3);
    border-radius: 9999px;
    padding: 6px 10px;
}

.schedulewrap {
    padding:20px 0 0;
    border-top: 1px solid var(--gs4);
}

.progress-wrap{
    border-bottom: 1px solid var(--gs4);
    padding: 1rem 0;
    margin: 1rem 0;
    align-items: center;
}

.progress-wrap .progress{
    height: 10px;
    border-radius: 10rem;
    background-color: var(--gs4);
    overflow: hidden;
    display: inline-block;
    position: relative;
    width: 64%;
}
.progress-wrap .progress-bar{
    height: 10px;
    background-color:var(--color-mg);
    border-radius: 10rem;
}

.progress-wrap .progressCount{
    width: 28%;
    margin-left: 1rem;
}

.progress-wrap .progressCount .flexBox{
    align-items: center;
}

.progress-wrap .progressCount .gray7_tt{
    margin-left: 4px;
}

.blog_code .copyBtn{
    width: 100%;
    height: 52px;
    border: 0;
    background: var(--gs9);
    color: var(--gs1);
    margin-top:8px;
}
.blog_code .codeCopy {
    justify-content: space-between;
    align-items: center;
}
.blog_code .codeCopy .input01{
    width: 100%;
    padding: 15px 16px;
}

.copyBannerImg img{
    margin: 0 auto;
}

.blog_url .input01{
    padding: 14px 16px;
}
.uploadImg {
}

.uploadImg ul li{
    display: flex;
    word-break: keep-all;
}

.uploadImg ul li .dot{
    content: '';
    display: inline-block;
    width: 3px;
    height: 3px;
    background: var(--gs9);
    min-width: 3px;
    border-radius: 50%;
    margin:8px 6px 0 0;
}

.uploadImg button img{
    margin-right:4px;
}

.detail .btn-upload-review-files.uploadreviewBtn{
    width: 100%;
    height: 52px;
    border: 0;
    background: var(--gs9);
    color: var(--gs1);
    border-radius: 8px;
    font-size:inherit;
    font-size: 14px;
    margin:15px 0;
}


.exp_conregWrap strong.tit{
    padding:0 0 10px;
    margin:0 0 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.mty_button01:hover,.mty_button01:active{
    color:var(--gs1);
}


.instaarea .instaname{
    align-items: center;
}
.instaarea .instaname img{
    margin-right:5px;
}




.go_insta a{
    color: var(--gs7);
    text-align: center;
    width: 100%;
    padding: 15px 0;
    background-color: var(--gs1);
    position: relative;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.faceBook_info .innerTxt{
    background: var(--gs3);
    border-radius: 10px;
    padding: 20px;
    word-break: keep-all;
}

.faceBook_info .innerTxt a{
    text-decoration: underline;
    display: inline-block;
}

.faceBook_info .innerTxt li{
    margin-bottom: 4px;
    padding: 0 0 0 8px;
    position: relative;
}
.faceBook_info .innerTxt li:before{
    position: absolute;
    left: 0;
    top: 8px;
    border-radius: 50px;
    content: "";
    display: inline-block;
    width: 3px;
    height: 3px;
    background: var(--gs8);
}

.imgWrap2::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 20%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .3) 100%);
}
.imgWrap2 .bookmarkIcon{
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.imgWrap2 .bookmarkIcon img{
    width: 30px;
}


/* (휴대폰) 본인인증 팝업 */
.modal.phonevfModal{
    left:50%;
    transform: translateX(-50%);
}
.phonevfModal .modal-dialog{
    margin:0 auto;
    width:85%;
}
.phonevfModal .modal-dialog .modal-content{
    padding:25px 20px;
    border-radius: 14px;
}
.phonevfModal .modal-header,.phonevfModal .modal-footer{
    border:0;
    padding:0;
}
.phonevfModal .modal-body{
    padding:0;
    margin:20px 0;
}
.phonevfModal .form-group:last-child{
    margin-bottom: 0;
}
.phonevfModal .input01 {
    padding: 14px 82px 14px 16px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid var(--gs5);
    outline: none !important;
    width: 100%;
    background: var(--gs2);
    height:48px;
}

.phonevfModal .input01::placeholder {
    color: var(--gs6);
}

.phonevfModal .input01:focus {
    background: var(--gs1);
}

.phonevfModal .posi_input .mty_button01{
    width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    border: 0;
    background: var(--gs9);
    color: var(--gs1);
}

.phonevfModal .mty_mix_button02 .btn{
    margin:0;
    box-shadow: none;
}
.phonevfModal .mty_mix_button02 .btn-secondary{
    border: 1px solid var(--gs6);
    color: var(--gs6);
    background: var(--gs1) !important;
}


.phonevfModal .mty_mix_button02 .btn-secondary:hover,
.phonevfModal .mty_mix_button02 .btn-secondary:not([disabled]):not(.disabled):active{
    border: 1px solid var(--gs6);
    color: var(--gs6) !important;
    background: var(--gs1) !important;
    box-shadow: none !important;
}

.phonevfModal .mty_mix_button02 .btn-primary{
    background: var(--color-mg) !important;
}

.phonevfModal .mty_mix_button02 .btn-primary:hover,
.phonevfModal .mty_mix_button02 .btn-primary:not([disabled]):not(.disabled):active{
    background: var(--color-mg) !important;
    box-shadow: none !important;
}

.input_inner .input_button_wrap button{
        width: auto;
    height: 30px;
    padding-left: 12px;
    padding-right: 12px;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    border: 0;
    background: var(--gs9);
    color: var(--gs1);
}



/* 로딩 이미지 노출 */
.on_loading .loading {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: white;
    opacity: .7;
    z-index: 9999;
}
.more_loading {
    display: block;
    width: 100%;
    height: 50px;
}
.loading_inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.on_loading {
    position: relative;
}
.spinner {
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
}
.path {
  stroke: #5a67d8;  /* 파란색 적용 */
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 80;  /* 원 테두리의 길이를 나타냅니다 */
  stroke-dashoffset: 0;  /* 시작 위치 */
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(1800deg); /* 360도 * 5 */
  }
}
/* 로딩 이미지 노출 관련 끝*/



/* 레이어에서 상세보기 */
body.on_layer footer ,body.on_layer .main {
    display: none;
}
.on_layer .ft_community_detail {
    bottom: -1px;
}
body.on_layer .wrap {
    padding: 10px 20px 75px;
}




.frame_outer {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: #fff;
  z-index: 9999;

  /* 슬라이드 초기 상태 (오른쪽 바깥 + 투명) */
  transform: translate3d(100%, 0, 0);
  opacity: 0;

  transition: transform .5s ease, opacity .5s ease;
  will-change: transform, opacity;
  backface-visibility: hidden;
}

.frame_outer.show {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

/* 스피너가 iframe 위에 덮이도록 */
.frame_outer .loading {
  position: absolute; inset: 0;
  display: flex; justify-content: center; align-items: center;
  z-index: 2;
}
.frame_outer iframe {
  position: relative; z-index: 1;
  width: 100%; height: 100%;
  background: transparent;
}

/* 스피너 페이드아웃 */
.frame_outer .loading { transition: opacity .2s ease; }
.frame_outer.loaded .loading { opacity: 0; pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  .frame_outer { transition: none; }
}










.none_data{
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 30px 0;
}

.none_data .none_txt{
    color: var(--gs6);
    margin-top: 10px;
}


.experienceSwiper{
    margin:0 0 30px;
}

.experienceSwiper .swiper-slide {
    max-width: 230px;
}
.experienceSwiper  .thumb{
    aspect-ratio: 5.4 / 4;
    object-fit: cover;
    border-radius: 8px;
}

.expmain_statusBox.flexBox,.expmain_statusBox2.flexBox {
    display: flex;
    align-items: center;

}

.expmain_statusBox ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.expmain_statusBox.list_status ul{
   left:0;
}


.expmain_statusBox.act ul {
    display: block;
}


.expmain_statusBox, .expmain_statusBox2 {
    position: relative;
    cursor: pointer;
    display: flex;
}

.expmain_statusBox span, .expmain_statusBox2 span {
    color: var(--gs0);
}

.expmain_statusBox img, .expmain_statusBox2 img{
    margin-left: 7px;
}

.expmain_statusBox ul, .expmain_statusBox2 ul {
    background-color: var(--gs1);
    position: absolute;
    top: 25px;
    left: 0;
    z-index: 99;
    overflow: hidden;
    height: 0;
}

.expmain_statusBox ul.act, .expmain_statusBox2 ul.act {
    height: 134px;
    border: 1px solid var(--gs5);
}

.expmain_statusBox ul li, .expmain_statusBox2 ul li {
    background-color: var(--gs1);
    width: 134px;
}

.expmain_statusBox ul li a, .expmain_statusBox2 ul li a {
    padding: 18px 18px 0px 18px;
    color: var(--gs7);
}

.expmain_statusBox ul li.act a, .expmain_statusBox ul li a.on, .expmain_statusBox2 ul li a.on {
    color: var(--gs9);
}

.expmain_statusBox ul li:last-child a{
    padding-bottom: 18px;
}

.expmain_statusBox.act img, .expmain_statusBox2.act img{
    transform: rotate(180deg);
}

.expmain_statusBox2 {
    cursor: pointer;
    margin-left: 10px;
}
.expmain_statusBox2 span {
    color: var(--gs0);
}
.expmain_statusBox2 img {
    margin-left: 7px;
}
.expmain_statusBox2 ul {
    background-color: var(--gs1);
    position: absolute;
    top: 25px;
    left: 0;
    z-index: 99;
    overflow: hidden;
    height: 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.expmain_statusBox2 ul.act {
    height: 134px;
    border: 1px solid var(--gs5);
}
.expmain_statusBox2 ul li {
    background-color: var(--gs1);
    width: 134px;
}
.expmain_statusBox2 ul li a {
    padding: 18px 18px 0px 18px;
    color: var(--gs7);
}
.expmain_statusBox2 ul li a.on {
    color: var(--gs9);
}
.expmain_statusBox2 ul li:nth-child(3) a {
    padding-bottom: 18px;
}
.expmain_statusBox2.act img {
    transform: rotate(180deg);
}

[data-section='selected']::after {
    /*content: url('/svg/arrowBox/updown_2=down_2.svg');*/
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 14px;
    height: 14px;
    background: url(/public/img/svg/updown_2=down_2.svg) 0 0 no-repeat;
    margin-left: 3px;

}
.option_show > [data-section='selected']::after {
    /*content: url('/svg/arrowBox/updown_2=up_2.svg');*/
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 14px;
    height: 14px;
    background: url(/public/img/svg/updown_2=down_2.svg) 0 0 no-repeat;
    margin-left: 3px;
}
.option_show ul[data-section='option']{
    display: block !important;
    height: auto !important;
}

.expmainlist_01 .listShow{
    display: none;
}
.expmainlist_01 .imgBox_1{
    border-radius: 8px;
    /* aspect-ratio: 4.5/4; */
} 

.expmainlist_01 .textBox strong{
    margin-bottom:0;
}

.reviewBox{
    padding:15px;
    box-sizing: border-box;
    background: var(--gs3);
    border-radius: 8px;
    margin-bottom:35px;
    align-items: center;
}

.reviewBox .rv_list{
    display: flex;
}

.reviewBox .rv_list li{
    position: relative;
    margin-right:7px;
}

.reviewBox .rv_list li:last-child{
    margin-right:0;
}
.reviewBox .rv_list li .more_rv{
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
}

.reviewBox .rv_list li .more_rv p{
    color: var(--gs1);
}

.reviewBox .rv_list .thumb{
    width:55px;
    height:55px;
    aspect-ratio: 1;
    object-fit: cover;
}

.reviewBox button{
    padding:6px 12px;
    background: var(--gs9);
    color:var(--gs1);
    border-radius: 6px;
    height: 30px;
}

.none_exp{
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.none_exp .innertxt{
    text-align: center;
}
.none_exp .innertxt img{
    margin: 0 auto 10px;
    width: 30px;
}
.none_exp .innertxt .button{
    width: auto;
    height: auto;
    padding: 6px 12px;
    border-radius: 6px;
    margin: 20px auto 0;
}

.popularexpSwiper .s_tBox p:nth-child(1){
    padding-right: 5px;
    margin-right: 5px;
    position: relative;
}

.popularexpSwiper .s_tBox p:nth-child(1)::after{
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--gs5);
    width: 1px;
    height: 8px;
}

.provision_area h4{
    margin:16px 0;
}

.provision_area .productBox a{
    align-items: center;   
    justify-content: flex-start;             
    max-width: 100%;
    gap:15px;
}

.provision_area .productBox .thumb{
    width:72px;
    height: 72px;
    aspect-ratio: 1;
    object-fit: cover;
}

.provision_area .productBox .textBox{
    flex: 1;
    min-width: 0;
    overflow: hidden;
    margin: 0;
}

.provision_area .productBox .countBox p{
    margin-bottom:0;
}

.provision_area .infoBox{
    padding:12px 16px;
    border-radius: 8px;
    background: var(--gs3);
    margin:15px 0 30px;
}

.provision_area .infoBox p{
    margin-bottom: 0;
    color:var(--gs7);
}


.detailTabWrap .tabs_detailArea {
    margin: 0 -20px 0;
}

.detailTabWrap .tabs_detailArea .topSwiper {
    height: 44px;
    border-bottom: 1px solid var(--gs4);
    margin: 0;
    overflow-x: auto;                /* ← 추가: 가로 스크롤 허용 */
    overflow-y: hidden;              /* 세로 스크롤 제거 */
    -webkit-overflow-scrolling: touch; /* 모바일 부드러운 스크롤 */
}

.detailTabWrap .tabs_detailArea ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: clamp(8px, 3.5vw, 20px);
    width: max-content;
    margin: 0 auto;
    padding: 0 clamp(8px, 2vw, 16px);
    box-sizing: border-box;
    white-space: nowrap;
}

.detailTabWrap .tabs_detailArea li {
    color: #bbb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    position: relative;
    padding-bottom: 10px;
}

.detailTabWrap .tabs_detailArea li:nth-child(1) {
    margin: 0;
}

.detailTabWrap .tabs_detailArea .act::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--color-mg);
}


.brandProArea .textBox{
    text-align: center;
    margin:10px 0 0;
}

.brandProArea .textBox p{
    margin:0 0 4px;
}

.brandProArea .textBox .countBox{
    gap:3px;
}

.expdetailWrap .textBox01 .keyword-wrap{
    color:var(--gs7);
    padding:15px 20px;
    border-radius: 8px;
    background: var(--gs3);
    margin:20px 0 30px;
    word-break: break-word;
}

.urlBox .urlWrap{
    justify-content: space-between;
    align-items: center;
    color: var(--gs9);
}

.urlBox .copy-button{
    width: auto;
    padding: 5px 16px;
    background: var(--gs9);
    line-height: 1;
    margin: 0;
    min-width: 60px;
    font-size: 14px;
}
.imgWrap{
  background-color: #eee;
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
}

.imgWrap img{
 object-fit: cover;
 opacity: 0;
 transition: opacity 0.5s ease-in;
}
.imgWrap img.lazyloaded{
    opacity: 1;
}
.main > ul {
    margin-bottom: 0.5rem;
}