/**************** public *******************/


@font-face {
    font-family: 'Noto Sans KR';
    src: url('../fonts/NotoSansKR-Black.woff2') format('font-woff2'),
         url('../fonts/NotoSans-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Noto Sans KR';
    src: url('../fonts/NotoSansKR-Bold.woff2') format('font-woff2'),
         url('../fonts/NotoSans-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../fonts/NotoSansKR-Medium.woff2') format('font-woff2'),
         url('../fonts/NotoSans-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../fonts/NotoSansKR-Regular.woff2') format('font-woff2'),
         url('../fonts/NotoSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Sans KR';
    src: url('../fonts/NotoSansKR-Light.woff2') format('font-woff2'),
         url('../fonts/NotoSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: 'Noto Sans KR', -apple-system,Arial, sans-serif; 
    -webkit-tap-highlight-color: transparent;
}
html, body, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, 
abbr, address, big, cite, code, del, dfn, em, font, img, ins, q, s, samp, small, 
strike, strong, sub, sup, tt, var, b, u, i, ul, ol, li, dl, dt, dd, table, caption,
tbody, tfoot, thead, tr, th, td, fieldset, fo7m, label, legend, input, button, textarea, select 
{margin:0; padding: 0; }
html, body { margin: 0; padding: 0; height: 100%;}

body { background-color: #fff; margin: 0; height: auto; font-size: 16px; min-height: 100vh; letter-spacing: -0.4px; color: #222; }
input, select, textarea { border: 1px solid #ccc; height: 40px; padding: 5px 15px; /*font-family:"Droid Sans";*/ outline: none; font-size: 1em; }
textarea { resize: none; }
/* input:focus, select:focus, textarea:focus { border-color: #333; } */
input::placeholder, select::placeholder, textarea::placeholder { color: var(--placeholder-color); }
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(../img/icon/tool/select_down.svg);
    background-position: right 10px center;
    background-repeat: no-repeat;
    padding-right: 40px;
    background-size: 13px;
}
select::-ms-expand {
    display: none;
}
select option[hidden] {
    color: red;
}
input::placeholder,
input:disabled {
    color: var(--placeholder-color);
    
}
input:disabled {
    cursor: default !important;
    background: #F5F5FA;
    border: none;
}
input[type="text"] { width:100%; }
input[name="title"] { font-size: 21px; font-weight: 800; text-align: center; }
input[type="password" i] { }
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input{
border: 1px solid var(--line-color);
border-radius: var(--border-round-S);


}

button { cursor: pointer; border: 1px solid #eee; }
/*    button:focus { outline: none; box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.1);  border: none;}*/
button:focus { outline: none; border: none;}
ul { list-style: none; }
a { color: currentColor; text-decoration: none; }
h1,h2,h3,h4,h5 { font-size: 1em; }

textarea{
border-color: var(--line-color,#E4E8EE);
padding: 10px 5px;
border-radius: 5px;
/*    min-height: 108px;*/
}
textarea::placeholder{
color: #888;
}



/* scroll bar */

*::-webkit-scrollbar {
width: 15px;
background-color: transparent;
}

*::-webkit-scrollbar-thumb {
background-color: #9499B4;
border: 5px solid #fff;
border-radius: 15px;
cursor: pointer;
opacity: 0;
}

*::-webkit-scrollbar-track {
background-color: transparent;
opacity: 0;
}



/*체커 */
.checkbox_ {
position: relative;
height: 100%;
}
.checkbox_ input {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
cursor: pointer;
}
.checkbox_ input + label {
display: flex;
justify-content: flex-start;
align-items: center;
}
.checkbox_ input + label:before {
content: "";
width: 20px;
height: 20px;
border-radius: 0;
margin-right: 5px;
background-image: url(../img/icon/tool/check_2px.svg);
background-repeat: no-repeat;
background-size: contain;
}
.checkbox_ input:checked + label:before {
background-image: url(../img/icon/tool/checked_2px.svg);
/*
box-shadow: 0px 3px 6px #3CCBDB;
-webkit-box-shadow: 0px 2px 3px #3CCBDB;
*/
}

.checkbox_.round input + label:before {
content: "";
width: 24px;
height: 24px;
border-radius: 5px;
margin-right: 10px;
/*        background-image: url(../img/icon/tool/check_R.svg);*/
background-repeat: no-repeat;
background-size: cover;
}
.checkbox_.round input:checked + label:before {
/*        background-image: url(../img/icon/tool/checked_R.svg);*/
/*
box-shadow: 0px 3px 6px #3CCBDB;
-webkit-box-shadow: 0px 3px 6px #3CCBDB;
*/
}


/* button */

.small_button_fill{

}
.medium_button_fill{

}
.large_button_fill{

}
.full_button_fill{
width: 100%;
border-radius: var(--border-round-S);
background-color: var(--primary-color);
color: #fff;
line-height: 1;
padding: 12px 0;
min-height: 48px;
}


.small_button_border{

}
.medium_button_border{

}
.large_button_border{

}

.full_button_border{
border: 1px solid var(--primary-color);
border-radius: var(--border-round-S);
color: var(--primary-color);
background: #fff;
width: 100%;
padding: 12px 0 ;
font-size: 14px;
}
/* color */




/* modal */

.modal-dialog .ui-modal-content {
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
.modal-dialog .ui-modal-content .modal-layer{
max-width: 650px;
height: 90vh;
padding: 25px;
}
.modal-dialog .ui-modal-content .ui-modal-layer{
background: #fff;
padding: 25px;
border-radius: 10px;
display: flex;
flex-direction: column;
gap:20px;
max-width: 650px;
max-height: 90dvh;
}


.modal-dialog .ui-modal-content .ui-modal-layer .head{
display: flex;
justify-content: space-between;
align-items: center;
font-size: 22px;
font-weight: 600;
color: #333;
}

.modal-dialog .ui-modal-content .ui-modal-layer .head .closer{
cursor: pointer;
max-width: 20px;
}
.modal-dialog .ui-modal-content .ui-modal-layer .content{
overflow-y: auto;
}





.field_area .field_col{
gap:10px;
}
.field_area .field_col h3{
color: #222;
font-weight: 500;
font-size: 16px;
}

@media (max-width:800px){
.modal-dialog .ui-modal-content .ui-modal-layer{
    width: calc(100% - 20px);
}
.modal-dialog .ui-modal-content .ui-modal-layer .head{
    font-size: 16px;
}
.modal-dialog .ui-modal-content .ui-modal-layer .head .closer{
    max-width: 15px;
}
}

/* layout */
.flex_col{
display: flex;
flex-direction: column;
}


.bg_gray{
background: var(--bg-gray);
border-radius: 10px;
}








/* color */

.fill_btn{
background: var(--primary-color);
color: #fff;
display: inline-block;
border-radius: 5px;
cursor: pointer;
border: 1px solid var(--primary-color);
}

.fill_btn:hover{
background: #fff;
color: var(--primary-color);
}

.btn {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #eee;
    border-radius: 5px;
    font-size: 1em;
}

.btn_border{
    display: inline-block;
    border-radius: 5px;
    color: #3CCBDB;
    border: 1px solid #3CCBDB;
    background:#FFF;
    line-height: 1;
    max-width: 220px;
    width: 100%;
    text-align: center;
    cursor: pointer;
}
.btn_border:hover{
    background: var(--primary-color);
    color: #fff;
}

.btn-disabled { background-color: #eee; color: #666; border-color: #ccc; }

.btn_ {
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px 12px;
    color: #888;
}
.submitBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 60px;
    background-color: #3CCBDB;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border: none;
/*
    box-shadow: 0px 10px 20px rgba(60,203,219,0.3);
    -webkit-box-shadow: 0px 10px 20px rgba(60,203,219,0.3);
*/
    position: relative;
}
.submitBtn.disabled{
    background-color: #B1B1B1;
    box-shadow: none;
    -webkit-box-shadow: none;
}
.submitBtn:not(.disabled):hover{
    background-color: #fff;
    color: #3CCBDB;
    border: 1px solid #3ccbdb;
    box-shadow: none;
}
.subBtn {
    width: 220px;
    height: 60px;
    background-color: #EEEEEE;
    border-radius: 10px;
    color: #999;
    font-size: 18px;
    font-weight: 700;
    border: none;
}
.moreBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    width: 220px;
    height: 60px;
    font-size: 18px;
    font-weight: 700;
    color: #9499B4;
    background-color: #F5F5FA;
}
.moreBtn img {
    margin-left: 10px;
}

.line_btn{
color: #999;
border: none;
background: transparent;
border-bottom: 1px solid #999;
margin-left: auto;
}

.whiteBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border-radius: 10px;
    color: #3CCBDB;
    font-size: 16px;
    font-weight: 700;
    border: 1px solid #3CCBDB;

/*        padding: 13px 40px;*/
}
@media(max-width:800px){
.whiteBtn{
    border-radius: 4px;
}
}

.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;  }
.ellipsis2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.2em;
    height: 2.4em;
}

.inner {
    position: relative;
    margin: 0 auto;
    width: 1440px;
}


.accent_color{
color: var(--primary-color);
}
.accent_bold{
color: var(--primary-color);
font-weight: 700;
}

.text-red{
color: var(--red-100-color);
}

.option_ .opt_info{
padding: 4px 10px;
border-radius: 50px;
border: 1px solid #904AAC;
font-size: 12px;
color: #904AAC;
display: inline-block;
background-color: #fff;
}
.campaign_slide .inner{
width: 1460px;
}

.campaign_slide .slide_inner{
overflow: hidden;
padding: 0 10px;
padding-bottom: 5px;
}

.mobile_line {
    display: none;
    margin: 0;
    width: 100%;
    border: 0;
    border-top: 4px solid #eee;
    background-color: transparent;
}

.mt70 {
    margin-top: 70px;
}
.mt50 {
    margin-top: 50px;
}

.displaynone{
display: none !important;
}

.visibility {
visibility: hidden !important; 
}

.loading_wait{
display: none;
justify-content: center;
align-items: center;
gap: 10px;
}
.loading_wait img{
max-height: 32px;
}

.loading {
/*
position: absolute;
display: flex;
justify-content: center;
align-items: center;
*/
}

.loading span:not(.loader) {
display: inline-block;
width: 10px;
height: 10px;
background-color: var(--accent-color);
border-radius: 50%;
animation: loading 1s linear infinite;
}

.loading span:nth-child(1) {
animation-delay: 0s;
}

.loading span:nth-child(2) {
animation-delay: 0.2s;
margin: 0px 10px
}

.loading span:nth-child(3) {
animation-delay: 0.4s;
}

@keyframes loading {
0%, 100% {
opacity: 0;
transform: scale(0.5);
}
50% {
opacity: 1;
transform: scale(1.2);
}
}

.loader {
width: 38px;
height: 38px;
border: 4px solid var(--primary-color);
border-bottom-color: transparent;
border-radius: 50%;
display: inline-block;
box-sizing: border-box;
animation: rotation 1s linear infinite;
position: absolute;
left: calc(50% - 20px);
top: 50%;
transform: translate(-50%, -50%);
}

@keyframes rotation {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}

.spinner{
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
display: flex;
justify-content: center;
align-items: center;
height: calc(100vh - 80px);
z-index: 9999;
}

.spinner img{
width: 100px;
}
@media (max-width:800px){
.toastify{
    max-width: calc(100% - 40px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap:10px;
}
}


.tooltip{
cursor: pointer;
}


.send_message_btn{
display: flex;
gap:8px;
padding: 12px;
border-radius: 8px;
line-height: 1;
font-size: 16px;
font-weight: 400;
} 
.send_message_btn img{
max-width: 16px;
}

[data-btn-type="floating"]{
position: fixed;
right: 34px;
bottom: 184px;
width: 60px;
height: 60px;
background: var(--primary-color);
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px;
border-radius: 50px;
/*    box-shadow: rgba(255, 255, 255, 0.2) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.1) 0px 4px 6px, rgba(0, 0, 0, 0.15) 0px 8px 30px;*/
cursor: pointer;
z-index: 999;
}
[data-btn-type="floating"] span{
font-size: 12px;
font-weight: 400;
}

[data-btn-type="floating"] .message_count{
position: absolute;
top: 0;
right: 0;
width: 20px;
height: 20px;
border-radius: 50px;
background: var(--red-100-color);
color: #fff;
text-align: center;
}

[data-btn-type="floating"] .message_read_tooltip{
position: absolute;
top: -55px;
right: 0;
width: 254px;
padding: 10px;
background: var(--accent-color);
border-radius: 10px;
color: #222;
font-size: 13px;
display: flex;
align-items: center;
}
[data-btn-type="floating"] .message_read_tooltip::before{
content: "";
position: absolute;
display: inline-block;
border-top: 0;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: 18px solid var(--accent-color);
z-index: 1;
bottom: -12px;
right: 20px;
transform: rotate(180deg);

}

[data-btn-type="floating"] .message_read_tooltip img{
max-width: 12px;
margin-left: 8px;
cursor: pointer;
}

html body iframe[title='chat widget']:first-child{
outline: none !important;
visibility: visible !important;
resize: none !important;
box-shadow: none !important;
overflow: visible !important;
background: none !important;
opacity: 1 !important;
filter: alpha(opacity = 100) !important;
-mz-opacity: 1 !important;
-khtml-opacity: 1 !important;
top: auto !important;
right: 30px !important;
bottom: 110px !important;
left: auto !important;
position: fixed !important;
border: 0 !important;
min-height: 60px !important;
min-width: 64px !important;
max-height: 60px !important;
max-width: 64px !important;
padding: 0 !important;
margin: 0 !important;
-moz-transition-property: none !important;
-webkit-transition-property: none !important;
-o-transition-property: none !important;
transition-property: none !important;
transform: none !important;
-webkit-transform: none !important;
-ms-transform: none !important;
width: 64px !important;
height: 60px !important;
display: block !important;
z-index: 1000 !important;
background-color: transparent !important;
cursor: none !important;
float: none !important;
border-radius: unset !important;
pointer-events: auto !important;
clip: auto !important;
color-scheme: light !important;
}

html body iframe[title='chat widget']:nth-child(2){
display: none !important;
}
html body iframe[title='chat widget']:nth-child(3){
display: none !important;
}
html body iframe[title='chat widget'].open:nth-child(2){
 outline: none !important;
visibility: visible !important;
resize: none !important;
box-shadow: none !important;
overflow: visible !important;
background: none !important;
opacity: 1 !important;
filter: alpha(opacity = 100) !important;
top: auto !important;
right: 10px !important;
bottom: 180px !important;
left: auto !important;
position: fixed !important;
border: 0 !important;
min-height: 500px !important;
min-width: 350px !important;
max-height: 650px !important;
max-width: 450px !important;
padding: 0 !important;
margin: 0 !important;
-moz-transition-property: none !important;
-webkit-transition-property: none !important;
-o-transition-property: none !important;
transition-property: none !important;
transform: none !important;
-webkit-transform: none !important;
-ms-transform: none !important;
width: 100% !important;
height: 650px !important;
display: block !important;
z-index: 1001 !important;
background-color: transparent !important;
cursor: none !important;
float: none !important;
border-radius: 5px !important;
pointer-events: auto !important;
clip: auto !important;
color-scheme: light !important;
}

html body iframe[title='chat widget']:nth-child(4){
outline: none !important;
visibility: visible !important;
resize: none !important;
box-shadow: none !important;
overflow: visible !important;
background: none !important;
opacity: 1 !important;
filter: alpha(opacity = 100) !important;
-mz-opacity: 1 !important;
-khtml-opacity: 1 !important;
top: auto !important;
right: 45px !important;
bottom: 95px !important;
left: auto !important;
position: fixed !important;
border: 0 !important;
min-height: 44px !important;
min-width: 37px !important;
max-height: 44px !important;
max-width: 37px !important;
padding: 0 !important;
margin: 0px 0 0 0 !important;
-moz-transition-property: none !important;
-webkit-transition-property: none !important;
-o-transition-property: none !important;
transition-property: none !important;
transform: rotate(0deg) translateZ(0);
-webkit-transform: rotate(0deg) translateZ(0);
-ms-transform: rotate(0deg) translateZ(0);
width: 37px !important;
height: 44px !important;
display: none !important;
z-index: 10001 !important;
background-color: transparent !important;
cursor: none !important;
float: none !important;
border-radius: unset !important;
pointer-events: auto !important;
clip: auto !important;
color-scheme: light !important;
-moz-transform: rotate(0deg) translateZ(0);
-o-transform: rotate(0deg) translateZ(0);
transform-origin: 0;
-moz-transform-origin: 0;
-webkit-transform-origin: 0;
-o-transform-origin: 0;
-ms-transform-origin: 0;
}


html body iframe[title='chat widget']:nth-child(5){
outline: none !important;
visibility: visible !important;
resize: none !important;
box-shadow: none !important;
overflow: visible !important;
background: none !important;
opacity: 1 !important;
filter: alpha(opacity = 100) !important;
-mz-opacity: 1 !important;
-khtml-opacity: 1 !important;
top: auto !important;
right: 45px !important;
bottom: 105px !important;
left: auto !important;
position: fixed !important;
border: 0 !important;
min-height: 44px !important;
min-width: 37px !important;
max-height: 44px !important;
max-width: 37px !important;
padding: 0 !important;
margin: 0px 0 0 0 !important;
-moz-transition-property: none !important;
-webkit-transition-property: none !important;
-o-transition-property: none !important;
transition-property: none !important;
transform: rotate(0deg) translateZ(0);
-webkit-transform: rotate(0deg) translateZ(0);
-ms-transform: rotate(0deg) translateZ(0);
width: 37px !important;
height: 44px !important;
display: none !important;
z-index: 1001 !important;
background-color: transparent !important;
cursor: none !important;
float: none !important;
border-radius: unset !important;
pointer-events: auto !important;
clip: auto !important;
color-scheme: light !important;
-moz-transform: rotate(0deg) translateZ(0);
-o-transform: rotate(0deg) translateZ(0);
transform-origin: 0;
-moz-transform-origin: 0;
-webkit-transform-origin: 0;
-o-transform-origin: 0;
-ms-transform-origin: 0;
}


@media (max-width: 800px) {
body.tawk-mobile, html.tawk-mobile {
    font-size: 18px !important;
}

html body iframe[title='chat widget']:first-child{
    right: 6px !important;
    bottom: 80px !important;
    min-width: auto !important;
    min-height: auto !important;
    transform: scale(0.85) !important;
}

html body iframe[title='chat widget'].open:nth-child(2){
    top: 0 !important;
    left: 0 !important;
    height: 100dvh !important;
    width:  100dvw !important;
    max-height: none !important;
    max-width: none !important;
}

html body iframe[title='chat widget']:nth-child(4){
    right: 20px !important;
    bottom: 70px !important;
}
html body .tawk-min-container .tawk-button-circle.tawk-button-large{
    width: 50px;
    height: 50px;
}
}


.empty_list {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
flex-direction: column;
padding: 180px 0;
gap: 20px;
}

/* tool */
/* 셀럭터 */
.select__wrap {
    flex-grow: 1;
}
.selectBox__ .box__ {
    position: relative;
}
.selectBox__ .select__ {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background-image: url(../img/icon/tool/select_down.svg);
    background-position: right 20px center;
    background-repeat: no-repeat;
    padding-right: 40px;
    white-space: nowrap;
    border-radius: 8px;
    padding-left: 15px;
}
.selectBox__ .select__ .holder {
    color: #888;
}
.selectBox__ .list__ {
    position: absolute;
    left: 0;
    top: 120%;
    width: 100%;
    background-color: #fff;
    display: none;
    border-radius: 10px;
    box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
    overflow: hidden;
    z-index: 9;
    border: 1px solid var(--primary-color);
}
.selectBox__ .list__ li {
    display: flex;
    justify-content: flex-start;
    align-content: center;
    padding: 15px;
}
.selectBox__ .list__ li:hover {
    background-color: #ECF9FB;
}
.withdraw_history > .tool .selectBox__ .list__ li:first-child:hover{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.withdraw_history > .tool .selectBox__ .list__ li:last-child:hover{
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.selectBox__ .list__ li.selected {
    background-color: #ECF9FB;
    color: #16B9CB;
    font-weight: 500;
}
.withdraw_history > .tool .selectBox__ .list__ li:first-child.selected{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.withdraw_history > .tool .selectBox__ .list__ li:last-child.selected{
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.selectBox__ .select__, 
.selectBox__ .list__ li {
    cursor: pointer;
}
.selectBox__.on .list__ {
    display: block;
}

.selectBox__.cp_detail_select{
width: 100%;
/*    background-color: #fff;*/
color: #666;
font-size: 14px;
/*    border: 1px solid #CAEFF3;*/
}
.selectBox__.cp_detail_select .box__{
padding: 10px 16px;

}

.selectBox__ .list__ li .option{
    border: 1px solid var(--primary-color);
    padding: 5px 5px;
    font-size: 12px;
    border-radius: 5px;
/*        min-width: 57px;*/
    text-align: center;
}
.selectBox__ .list__ li .option span{
display: inline-block;
width: max-content;
}
.selectBox__ .list__ li .text{
text-wrap: pretty;
}
.selectBox__ .list__ li.sold{
pointer-events: none;
}
.selectBox__ .list__ li.sold .option{
    border-color: #666;
    color: #666;
}
.selectBox__ .list__ li.sold .option span{
    color: #666;
}
.selectBox__ .list__ li.sold .text{
    text-decoration: line-through;
}

.selectBox__.cp_detail_select .list__{
width: 100%;
border: 1px solid var(--primary-color);
border-radius: 10px;
top: 120%;
position: static;
display: block;
box-shadow: none;
max-height: 40dvh;
overflow-y: auto;
}

.selectBox__.cp_detail_select .list__::-webkit-scrollbar {
width: 15px;
background-color: transparent;
}
.selectBox__.cp_detail_select .list__::-webkit-scrollbar-thumb {
background-color: #9499B4;
border: 5px solid #F5F5FA;
border-radius: 15px;
cursor: pointer;
opacity: 0;
}
.selectBox__.cp_detail_select .list__::-webkit-scrollbar-track {
background-color: transparent;
opacity: 0;
}

.cp_detail_select.selectBox__ .list__ li{
align-items: center;
gap:10px;
}
.cp_detail_select.selectBox__ .list__ li.select{
background: #DDF0F2;
}

.cp_detail_select.selectBox__ .select__{
background-image: url(../img/icon/tool/select_down.svg);
background-position: right;
}
.cp_detail_select.selectBox__ .select__::before{
background-image: none;
display: none;
}

.cp_detail_select.selectBox__ .select__ .text{
text-overflow: ellipsis;
overflow: hidden;
}

.PC_content{
    display: block;
}
.MO_content{
display: none;
}



.chip_cont.check_area .checkbox_.icon label{
background: none;    
color: #666;
padding: 0;
flex-direction: column;
}



.checkbox_.tab input + label:before {
    display: none;
}
.checkbox_.tab input + label {
    font-size: 14px;
    font-weight: 500;
    color: #666;
    border-radius: 10px;
    padding: 10px;
    background: #eee;
    justify-content: center;
}
.checkbox_.tab input + label .icon {
    margin-right: 10px;
}
.checkbox_.tab input:checked + label {
    color: #fff;
    background-color: var(--primary-color);
}
/*

.checkbox_.tab input:checked + label i.camera {
    background-image: url(../img/icon/fe/camera_a.svg);
}
.checkbox_.tab input:checked + label i.hood {
    background-image: url(../img/icon/fe/hood_a.svg);
}
.checkbox_.tab input:checked + label i.back {
    background-image: url(../img/icon/fe/back_a.svg);
}
.checkbox_.tab input:checked + label i.shirt {
    width: 18px;
    background-image: url(../img/icon/fe/shirt_a.svg);
}
.checkbox_.tab input:checked + label i.beauty {
    width: 18px;
    background-image: url(../img/icon/fe/beauty_a.svg);
}
.checkbox_.tab input:checked + label i.pacifier {
    width: 18px;
    background-image: url(../img/icon/fe/pacifier_a.svg);
}
.checkbox_.tab input:checked + label i.dumbbell {
    width: 14px;
    background-image: url(../img/icon/fe/dumbbell_a.svg);
}
.checkbox_.tab input:checked + label i.phone {
    width: 14px;
    background-image: url(../img/icon/fe/phone_a.svg);
}
.checkbox_.tab input:checked + label i.stamp {
    background-image: url(../img/icon/fe/stamp_a.svg);
}
*/


.fixed_head{
display: none;
}

@media (max-width:800px){
.fixed_head{
    display: block;
    position: fixed;
    top: 0;
    width: 100%;
    background: #fff;
    display: flex;
    gap: 15px;
    align-items: center;
    padding: 10px 15px 10px;
    font-size: 16px;
    z-index: 999;
    line-height: 1;
    font-weight: 600;
}   
.fixed_head a{
    line-height: 1;
    display: flex;
}
.fixed_head .head{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-height: 1.4;    
}
.fixed_head .message_btn{
    background: var(--accent-color);
    padding: 11.5px 20px;
    line-height: 1;
    border-radius: 5px;
    cursor: pointer;
    margin-left: auto;
    font-size: 14px;
}
}

#missionModal .check_area{
gap:15px 20px;
}

.chip_cont.check_area{
gap:20px;
}


.check_area {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    row-gap:15px;
}
.check_area .checkbox_ {
    margin: 0;
/*        margin-right: 5px;*/
/*        margin-bottom: 5px;*/
}
.check_area .checkbox_:last-child {
    margin-right: 0;
}


/* 검색 */
.search_area {
    position: relative;
    width: 420px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 46px;
    border-bottom: 1px solid #222;
}
.search_area input {
    width: 100%;
    height: 100%;
    border: none;
    padding: 8px;
    padding-right: 45px;
}
.search_area button {
    position: absolute;
    right: 0;
    top: 0;
    width: 46px;
    height: 100%;
    background-color: transparent;
    background-image: url(../img/icon/tool/fas.svg);
    background-repeat: no-repeat;
    background-position: center;
    border: none;
}
.search_area button:focus {
    box-shadow: none;
}

/*프로필 카드*/
.profile {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.profile .profile_img {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #EFEFEF;
    border-radius: 50%;
    overflow: hidden;
}
.profile .profile_img img {
    max-width: 100%;
    max-height: 100%;
}

/* 페이지 텝*/
.area_tab{
font-weight: 500;
}
.area_tab > div{
font-weight: 500;
font-size: 24px;
cursor: pointer;
padding-bottom: 20px;
display: flex;
align-items: center;
gap: 14px;
width: fit-content;
}
.area_tab > div span{
font-weight: 700;
cursor: pointer;
color: var(--primary-color);
}

.area_tab .area_list_box{
position: absolute;
padding: 20px;
border: 1px solid #ccc;
max-width: 700px;
display: none;
background: #fff;
z-index: 99;
border-radius: 10px;
box-shadow: 1px 1px 5px rgba(100,100,100,0.3);
}
.area_tab .area_list_box.active{
display: block;
}
.area_tab .area_list_box::before{
content: "";
position: absolute;
left: 80px;
top: -9px;
display: inline-block;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
width: 16px;
height: 16px;
background: #fff;
transform: rotate(45deg);
}

.area_tab .location{
display: flex;
border-top: 1px dashed #ccc;
padding: 16px 0;
font-size: 14px;
}
.area_tab .location:last-child{
padding-bottom: 0;
}
.area_tab .all_location{
font-size: 18px;
padding-bottom: 20px;
}



.area_tab .location .left{
flex:1;
cursor: auto;
}
.area_tab .location .right{
flex:5;
}

.area_tab .location_detail{
display: flex;
gap:14px;
flex-wrap: wrap;
}

.area_tab .location_detail li{
list-style: none;
font-weight: 400;
color: #666;
width: 20%;
word-break: keep-all;
}
.area_tab .location_detail li a:hover{
color: var(--primary-color);
font-weight: 700;
}
.area_tab .location_detail li.active{
color: var(--primary-color);
font-weight: 700;
}

.listTab_area {
    width: 100%;
    height: 50px;
    margin-bottom: 40px;
    padding: 0;
    border-bottom: 1px solid #EEEEEE;
}
.listTab_area:has(+ .cp_filter_chip) {
    margin-bottom: 0;
}
.listTab_area ul {
    display: flex;
/*        justify-content: stretch;*/
    align-items: center;
    height: 100%;
    flex-wrap: nowrap;
}
.listTab_area ul li {
    width: auto;
    height: 100%;
    border-bottom: 4px solid transparent;
    margin: 0;
    /* padding: 0 10px; */
}
.listTab_area ul.chip_cont li a{
    /* max-width: 40px; */
    max-width: 140px;
}
.listTab_area ul li + li {
    margin-left: 15px;
}
.listTab_area ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #666;
    min-width: 50px;
    height: 100%;
    flex-direction: column;
}
.listTab_area ul li a img{
    display: none;
}
.listTab_area ul li.active {
    border-color: #3CCBDB;
}


/* 베너*/
.text_banner_area {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 200px;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 31px;

    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.text_banner_area .wrap {
    text-align: center;
}
.text_banner_area .tit {
    font-size: 26px;
    margin-bottom: 2px;
}
.text_banner_area .desc {
    white-space: pre-line;
    text-align: left;
}

.text_banner_area.custom{
flex-direction: column;
height: auto;
gap:30px;
padding: 20px;
}

.text_banner_area.custom .wrap{
    display: flex;
    gap:30px;
}

.text_banner_area.custom .wrap .desc{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 10px 0;
    text-align: left;
}

.text_banner_area.custom .wrap .desc span:first-child{
font-size: 20px;
font-weight: 400;
}

.text_banner_area.custom .wrap .desc span:last-child{
font-size: 15px;
font-weight: 400;
}

.text_banner_area.custom .custom_cont{
display: flex;
align-items: center;
gap:90px;
}

.text_banner_area.custom .custom_cont .btn_cont{
padding-top: 0;
display: block;
}

.text_banner_area.custom .custom_set_area{
display: flex;
justify-content: space-around;
flex-direction: column;
gap:20px;
}

.text_banner_area.custom .custom_set_area .subject{
display: flex;
gap:40px;
align-items: center;
}

.text_banner_area.custom .custom_set_area .subject div:first-child{
font-size: 17px;
font-weight: 700;
flex: 1;
min-width: 70px;
max-width: 70px;
}

.text_banner_area.custom .custom_set_area .subject div:last-child{
display: flex;
gap:20px;
flex-wrap: wrap;
flex:10;
font-size: 14px;
}

.text_banner_area.custom .custom_set_area .subject div span{
/*    border-radius: 3px;*/
/*    border: 1px solid var(--primary-color);*/
/*    background: rgba(60, 203, 219, 0.08);*/
font-size: 14px;
font-weight: 700;
line-height: 1;
/*    padding: 14px 20px;*/
color: var(--primary-color);
}

.campaign__ .custom_cont .btn_cont a{
min-width: 204px;
}

.swiper-slide[data-item='1']{
background: var(--primary-color);
}
.swiper-slide[data-item='2']{
background: #eee;
}

.banner[data-banner="assaview_time"]{
background: var(--primary-color);
color: #fff;
max-width: 1440px;
margin: 0 auto;
border-radius: var(--border-round-L);
display: flex;
gap:157px;
justify-content: center;
align-items: center;
padding: 20px 0;
overflow: hidden;
}
[data-item='2'] .banner[data-banner="assaview_time"]{
background: #eee;
color: #222;
}
.banner[data-banner="assaview_time"] br{
    display: none;
}
.banner[data-banner="assaview_time"] .hard_working br{
    display: block;
}
.banner[data-banner="assaview_time"] h2{
font-size: 34px;
}
.banner[data-banner="assaview_time"] h2 br{
display: none;
}
.banner[data-banner="assaview_time"] p{
font-size: 22px;
}
.banner[data-banner="assaview_time"] img{
max-width: 195px;
transform: translateY(27px);
}

.banner[data-banner="row_align"]{
/*    background: var(--primary-color);*/
color: #fff;
max-width: 1440px;
margin: 0 auto;
border-radius: var(--border-round-L);
display: flex;
gap:10px;
justify-content: center;
padding: 20px 40px;
overflow: hidden;
}
.banner[data-banner="column_align"]{
background: var(--primary-color);
color: #fff;
max-width: 1440px;
margin: 0 auto;
border-radius: var(--border-round-L);
display: flex;
flex-direction: column;
gap:10px;
justify-content: center;
padding: 20px 40px;
overflow: hidden;
}
.banner[data-banner="column_align"] .top{
display: flex;
justify-content: space-between;
align-items: center;
}
.banner[data-banner="column_align"] .top h2{
font-size: 18px;
}
.banner[data-banner="column_align"] .top > div {
background: #fff;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
gap:5px;
padding: 5px 10px;
}

.banner[data-banner="column_align"] .bottom{

}
.banner[data-banner="column_align"] .bottom span{
font-size: 14px;
display: block;
}
[data-item='2'] .banner[data-banner="column_align"]{
background: #eee;
color: #222;
height: 152px;
}

.swiper-slide[data-item='3']{
background: #ECF9FB;
}
[data-item='3'] .banner[data-banner="row_align"]{
color: #222;
justify-content: center;
align-items: center;
font-size: 22px;
font-weight: 700;
height: 152px;
cursor: pointer;
gap:70px;
}

[data-item='3'] .banner[data-banner="row_align"] .right{
display: flex;
/*    flex-direction: column;*/
align-items: center;
gap:15px;
}

[data-item='3'] .banner[data-banner="row_align"] .right img{
max-width: 180px;
}

[data-item='4'][data-banner="naver_clip_banner"]{
border-radius: 8px;
overflow: hidden;
}

[data-item='4'][data-banner="naver_clip_banner"] a {
display: inline-block;
width: 100%;
height: 100%;
}

@media (max-width : 800px){
.banner[data-banner="assaview_time"]{
    border-radius: 0;
    gap:5px;
    padding: 0px ;
    justify-content: space-between;
    height: 100%;
}
.banner[data-banner="assaview_time"] br{
    display: block;
}
.banner[data-banner="assaview_time"] h2{
    font-size: 20px;
    text-wrap:nowrap;
}

.banner[data-banner="assaview_time"] p{
    font-size: 12px;
    word-break: keep-all;
}
.banner[data-banner="assaview_time"] img{
    max-width: 130px;
    transform: translateY(10px);
    transform: none;
}
.banner[data-banner="assaview_time"] .hard_working br{
    display: none;
}
.banner[data-banner]{
    border-radius: 0;
    height: 100%;
}

.banner[data-banner="column_align"]{
    padding: 0;
    gap:0;
}

.banner[data-banner="column_align"] .top h2{
    font-size: 12px;
}
.banner[data-banner="column_align"] .top > div {
font-size: 10px;
}

.banner[data-banner="column_align"] .bottom{
    font-size: 10px;
}
.banner[data-banner="column_align"] .bottom span{
    font-size: 8px;
}

.visula_slide.sub{
    height: auto;
    box-shadow: none;
    
}

[data-item='3'] .banner[data-banner="row_align"]{
    font-size: 16px;
    height:auto;
    padding: 0;
    justify-content: space-between;
    gap:0;
}

[data-item='3'] .banner[data-banner="row_align"] .right{
    flex-direction: column;
    gap:0;
}
[data-item='3'] .banner[data-banner="row_align"] .right img{
    max-width: 130px;
}

[data-item='2'] .banner[data-banner="column_align"]{
    height: 100%;
}

.visula_slide.sub .swiper-slide[data-item='4'][data-banner="naver_clip_banner"]{
    background-color: #C45050;
    background-image: url(https://assaview.co.kr/img/banner/naver_clip_banner_mo.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    padding: 0;
    border-radius: 8px;
}

.visula_slide.sub .swiper-slide[data-item='4'][data-banner="naver_clip_banner"] img{
    display: none;
}

}


/* 입력 필드 */
.field_wrap {
    padding-top: 45px;
    border-top: 1px solid #E7E7E7;
}
.signup_area .field_wrap{
border: none;
padding-top: 0;
}
.field_wrap + .field_wrap {
    margin-top: 30px;
    padding-top:30px;
    border-top: 1px solid var(--line-color);
}

.field_wrap > h5 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
    color: #3CCBDB;
}
.field_wrap:first-of-type > h5{
    font-size: 20px;
}
.field_area {}
.field_area + .field_area {
    margin-top: 20px;
}
.field_area + .field_area.interest_area{
margin-top: 50px;
}
.field_area .field {
    display: flex;
    justify-content: flex-start;
    align-items: center;
/*        background-color: #F5F5FA;*/
    border-radius: 10px;
/*        height: 60px;*/
/*        padding: 0 20px;*/
}
.field_area .field_col{
display: flex;
flex-direction: column;

}
.field_area .field.col{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.field_area .field.top_ {
    align-items: flex-start;
}
.field_area .field > label {
    width: 130px;
    flex-shrink: 0;
    /* color: #9191AE; */
    color: #222;
    font-size: 14px;
    font-weight: 400;
}
.field_area .field > input:read-only{
    background-color: #F5F5FA;
}
.field_area .field > input,
.field_area .field > select {
    flex-grow: 1;
    padding: 12px 12px;
    background-color: transparent;
/*        border: none;*/
    /* padding-left: 15px; */
/*        color: #9191AE;*/
    border-radius: 8px;
    border-color: var(--line-color);
    height: auto;
}
#apply .field_area .field > input{
    border: 1px solid var(--line-color);
    border-radius: var(--border-round-S);
    padding: 10px 5px;
}
.field_area .field > input::placeholder {
    color: var(--placeholder-color);
}
.field_area .field > .item {
    flex-grow: 1;
}
.field_area .field > .item > input {
    width: 100%;
    border: none;
}
.field_area .field .checkbox_ input {
    height: 100%;
}
.field_area .field_alert {
    font-size: 13px;
    color: #3CCBDB;
    margin-top: 10px;
}

.field_area .btn{
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 115px;
    color: #3CCBDB;
    background-color: transparent;
    border-color: currentColor;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    margin-left: 10px;
    padding: 17px 0;
    line-height: 1;
    min-width: auto;
    height: 60px;
}
.field_area .verify_ {
    display: flex;
    justify-content: stretch;
    align-items: center;
    flex-grow: 1;
}
.field_area .verify_ .field {
    flex-grow: 1;
}
.field_area .verify_ .btn {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 115px;
    color: #3CCBDB;
    background-color: transparent;
    border-color: currentColor;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    margin-left: 10px;
    padding: 17px 0;
    line-height: 1;
}
.field_area .verify_ .btn:focus {
    background-color: #3CCBDB;
    border-color: #3CCBDB;
    color: #fff;
    box-shadow: none;
}

.field_area .field .item {
    flex-grow: 1;
}
.field_area .field .verfiy_ {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}
.field_area .field .item input,
.field_area .field .verify_ input {
    flex-grow: 1;
    background-color: #F5F5FA;
    border-radius: 10px;
    border: none;
    padding: 0 20px;
/*        min-height: 60px;*/
}
.field_area .field .verify_ + input {
    margin-top: 10px;
}
.field_area .field .verify_ button {
    width: 90px;
    height: 60px;
    margin-left: 10px;
    color: #3CCBDB;
    border: 1px solid currentColor;
    border-radius: 5px;
    background-color: #fff;
    font-weight: 500;
}
.field_area .field .verify_ button:active {
    background-color: #3CCBDB;
    color: #fff;
}

.field_area .field .SNS_ li {
    background-color: #F5F5FA;
    border-radius: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 60px;
}
.field_area .field .SNS_ li + li {
    margin-top: 10px;
}
.field_area .field .SNS_ .icon {
    display: flex;
    width: 60px;
    height: 100%;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border: 1px solid #E4E4E4;
    border-radius: 10px 0 0 10px;
    margin-right: 20px;
}
.field_area .field .SNS_ input {
    padding: 0;
    border: none;
    background-color: transparent;
}
.field_area .field .SNS_ input::placeholder {
    color: var(--placeholder-color);
}
.field_area .field .SNS_ div:nth-child(3) {
    margin-left: 10px;
}
.field_area .field .SNS_ div:last-child{
    flex: 1;
}
.field_area .field .item .alert {
    padding-left: 60px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
    color: #3CCBDB;
    margin-top: 10px;
}
.field_area .field .item .alert img {
    margin: 3px 5px;
    margin-bottom: 0;
}

#join_path_div label,#join_path_div select{
    width: 100%;
}

/* 페이징 */
.pagenate {
    margin: 70px 0;
}
.pagenate ul {
    display: flex;
    justify-content: center;
    align-items: center;
}
.pagenate ul li.first_ {
    margin-right: 17px;
}
.pagenate ul li.last_ {
    margin-left: 17px;
}
.pagenate ul a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
}
.pagenate .active a {
    background-color: #3CCBDB;
    color: #fff;
}

.pagenate ul.new a{
border-radius: 5px;
}


/* 수정 필드 */
.max700  {
    max-width: 700px;
}
.mofidy_area {  
    padding-top: 30px;
/*        padding-bottom: 70px;*/
}
.mofidy_area #mb_name{
background-color: #EDEDED;
}

.mofidy_area #mb_introduce{
min-height: 140px;
color: #888;
}
.mofidy_area  label{
font-size: 20px;
font-weight: 600;
}
.mofidy_area input{
padding: 12.5px 10px;
font-weight: 500;
}
.mofidy_area .flex_col{
gap:10px;
}
.mofidy_area .field_area.flex_col{
gap:30px;
}
.mofidy_area .field_area .SNS_{
display: flex;
flex-direction: column;
row-gap: 10px;
}
.mofidy_area .field_area .SNS_ li{
border: 1px solid var(--line-color);
border-radius: 10px;
display: flex;
align-items: center;
}
.mofidy_area .field_area .SNS_ li .icon{
padding: 12px;
border-right: 1px solid var(--line-color);
}
.mofidy_area .field_area .SNS_ li .fixed_text{
padding: 10px;
background-color: #EDEDED;
color: #888;
}
.mofidy_area .field_area .SNS_ li div:has(input){
flex: 1;
}
.mofidy_area .field_area .SNS_ li input{
border: none;
}
.mofidy_area .field_area .SNS_ li input::placeholder{
color: #888;
font-weight: 400;
}
.mofidy_area .sns_area label{
padding-bottom: 15px;
}

.mofidy_area .interest_area{}
.mofidy_area .interest_area .flex_col{
align-items: flex-start;
width: 100%;
}
.interest_area .check_area{
gap:10px;
}
.interest_area .check_area.chip_cont {
gap:50px;
}
.mofidy_area .interest_area label{
width: auto;
min-width: initial;
}
.mofidy_area .interest_area label.head{
font-size: 24px;
}
.mofidy_area .field_area .interest_area .field{
margin-top: 20px;
}
.interest_area .mission_cont .check_area{
width: 100%;
}
.interest_area .mission_cont .check_area .checkbox_{
max-width: 245px;
width: 100%;
flex: 1;
}

.interest_area .area_cont .check_area:not(.chip_cont) .checkbox_{
min-width: 108px;
}

.interest_area .notice_check{
margin: 0;
margin-top: 20px;
}
.interest_area .notice_check label{
font-size: 16px;
font-weight: 400;
}

.mofidy_area + .mofidy_area {
    padding-top: 50px;
    padding-bottom: 50px;
    border-top: 1px solid #E7E7E7;
}
.mofidy_area > .title {
    margin-bottom: 15px;
    font-size: 16px;
    font-weight: 500;
    color: #3CCBDB;
}
.mofidy_area .field_area .field {
    background-color: #fff;
    min-height: 60px;
    padding: 0;
    height: auto;
}
.mofidy_area .field_area .field + .field {
    margin-top: 20px;
}
.mofidy_area.pwd .field_area .field + .field {
    margin-top: 10px;
}
.mofidy_area .field_area .field > label {
    font-size: 20px;
    font-weight: 500;
    color: #222;
}
.mofidy_area .field_area .field > input,
.mofidy_area .field_area .field > textarea,
.mofidy_area .field_area .field .select__ {
    flex-grow: 1;
    background-color: #F5F5FA;
    border-radius: 10px;
    border: none;
    padding: 0 20px;
    min-height: 60px;
}
.mofidy_area .field_area .field .selectBox__.on .select__ {
    border-radius: 10px 10px 0 0;
}
.mofidy_area .field_area .field .check_wrap {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-grow: 1;
}
.mofidy_area .field_area .field .check_wrap .checkbox_ + .checkbox_ {
    margin-left: 50px;
}
.mofidy_area .field_area .field > textarea {
    padding: 17px 20px;
    resize: none;
    min-height: 120px;
}
.mofidy_area .field_area .field > .item {
    flex-grow: 1;
    min-height: 60px;
    display: flex;
    gap:20px;
    align-items: flex-start;
}
.mofidy_area .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
}
.mofidy_area .btn_area.between {
    justify-content: space-between;
}
.mofidy_area .btn_area .btn {
    width: 220px;
    height: 60px;
}

.notice_check {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-left: 150px;
    margin-top: 40px;
    color: #444;
}


/* 아이콘 */
i.icon {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 20px;
    height: 20px;
}
i.camera {
    background-image: url(../img/icon/fe/camera.svg);
}
i.hood {
    background-image: url(../img/icon/fe/hood.svg);
}
i.back {
    background-image: url(../img/icon/fe/back.svg);
}
i.shirt {
    width: 18px;
    background-image: url(../img/icon/fe/shirt.svg);
}
i.beauty {
    width: 18px;
    background-image: url(../img/icon/fe/beauty.svg);
}
i.pacifier {
    width: 18px;
    background-image: url(../img/icon/fe/pacifier.svg);
}
i.dumbbell {
    width: 14px;
    background-image: url(../img/icon/fe/dumbbell.svg);
}
i.phone {
    width: 14px;
    background-image: url(../img/icon/fe/phone.svg);
}
i.stamp {
    background-image: url(../img/icon/fe/stamp.svg);
}

i.exmark {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-image: url(../img/icon/fe/exmark.png);
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
}

i.contact {
    width: 25px;
    height: 25px;
    border-radius: 20%;
    background-image: url(../img/icon/fe/contact.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
}
/* modal */
.modal-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2000000002;
    display: none;
}
.modal-dialog .dim {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background-color: rgba(0,0,0,0.3);
}
.modal-dialog .modal-content {
    position: relative;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.modal-layer {
    position: relative;
    background-color: #fff;
    border-radius: 20px;
    width: 100%;
    max-width: 900px;
    color: #444;
}
.modal-layer .closer {
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 80px;
    background-image: url(../img/icon/tool/modal_close.svg);
    background-repeat: no-repeat;
    background-position: center; 
    margin-top: -20px;
    margin-right: -20px;
    cursor: pointer;
}
.modal-layer .closer:has(img){
    background-image: none;
}

.modal-layer .head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #E7E7E7;
    height: 70px;
    padding: 0 30px;
}
.modal-layer .head h1 {
    font-size: 24px;
    font-weight: 700;
}
.modal-layer .content {
    padding: 40px 30px;
    padding-bottom: 30px;
}
.modal-layer .field {
    background-color: transparent;
    height: auto;
    padding: 0;
}
.modal-layer .field + .field {
    margin-top: 15px;
}
.modal-layer .field label {
    width: 127px;
    font-size: 16px;
    font-weight: 500;
    color: #222222;
}

.modal-layer .field input,
.modal-layer .field .selectBox__ .select__ {
    background-color: #F5F5FA;
    height: 60px;
    border-radius: 10px;
    padding: 0 15px;
}

.modal-layer .field .notice {
    background-color: #F5F5FA;
    border-radius: 10px;
    padding: 20px;
    width: 100%;
}

.modal-layer .field .selectBox__.on .select__ {
    border-radius: 10px 10px 0px 0px;
}
.modal-layer .check_wrap {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
}
.modal-layer .check_wrap .checkbox_ label {
    width: auto;
    font-size: 16px;
    font-weight: 400;
    color: #444;
}
.modal-layer .check_wrap .checkbox_ + .checkbox_ {
    margin-left: 45px;
}


.modal-layer .check_wrap._col{
display: flex;
flex-direction: column;
gap:5px;
align-items: flex-start;
padding-top: 20px;
}
.modal-layer .check_wrap._col .checkbox_{
margin: 0;    
}

.modal-layer .notice_ {
    background-color: #F5F5FA;
    border-radius: 10px;
    padding: 15px;
    font-size: 14px;
}
.modal-layer .notice_ h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 500;
    margin-bottom: 10px;
    position: relative;
    font-size: 16px;
}
.modal-layer .notice_#edit_wrap h1{
    gap: 10px;
}
.modal-layer .notice_ i {
    margin-right: 10px;
}
.modal-layer .notice_ p{
font-size: 14px;
}
.modal-layer .notice_ h1 .biz_tooltip{
    top: -60px;
    left: 0;
    width: 290px;
}


.modal-layer .notice_ h1 .biz_tooltip::before{
    top: 38px;
    left: 40px;
    transform: rotate(180deg);
}


.modal-layer .notice_ h1 .biz_tooltip span.head{
padding: 0;
height: auto;
border-bottom: none;
}
.modal-layer .contact_notice {
    background-color: #F5F5FA;
    border-radius: 10px;
    padding: 20px;
}
.modal-layer .contact_notice h1{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 500;
    margin-bottom: 10px;
}
.modal-layer .contact_notice i{
    margin-right: 10px;
}
.modal-layer .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    padding-bottom: 40px;
}
.modal-layer .btn_area.submit_cont{
gap:15px;
padding: 0 20px 30px;
}
.modal-layer .btn_area.submit_cont.test{
/*    flex-direction: column;*/
}
.modal-layer .btn_area.submit_cont.test button{
height: 48px;
/*    flex:none;*/
border-radius: 5px;
border: 1px solid var(--primary-color);
max-width: none;
font-weight: 500;
}
.modal-layer .btn_area.submit_cont button{
flex: 1;
font-size: 16px;
height: 60px;
font-weight: 700;
width: 100%;
height: 60px;
}
.modal-layer .btn_area.submit_cont .btn_border{
/*
padding: 20px 0 ;
font-size: 14px;
font-weight: 700;
*/
}

.my_campaign_detail .modal-layer .red_btn{
background: #FE6F61;
color: #fff;
height: 60px;
border-radius: 10px;
font-size: 16px;
font-weight: 500;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
flex: 1;
}
.my_campaign_detail .modal-layer .test .red_btn{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
border-radius: 10px;
font-size: 16px;
font-weight: 500;
color: #FE6F61;
cursor: pointer;
}

.my_campaign_detail .modal-layer .toggle_btn_cont{
padding: 0 20px 20px 20px;
margin-top: -20px;
position: relative;
display: flex;
flex-direction: column;
gap: 10px;
}
.my_campaign_detail .modal-layer .toggle_btn_cont button{
padding: 15px 0;
font-size: 16px;
}
.my_campaign_detail .modal-layer .toggle_btn_cont button svg:last-child{
margin-left: 10px;
}

@media (max-width:800px){
.my_campaign_detail .modal-layer .toggle_btn_cont{
    padding: 0;
}
.my_campaign_detail .modal-layer .toggle_btn_cont button{
    font-size: 14px;
    padding: 14px 0;
}
.my_campaign_detail .modal-layer .toggle_btn_cont button svg:last-child{
    width: 8px;
    height: 14px;
}
}
.my_campaign_detail .modal-layer .toggle_btn{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
border-radius: 10px;
font-size: 16px;
font-weight: 500;
color: #FE6F61;
border:1px solid #E7E7E7;
justify-content: space-between;
padding: 0 10px;
}

.my_campaign_detail .modal-layer .toggle_btn input[type="checkbox"]{
display: block;
}
.modal-layer .btn_area.submit_cont .red_btn:hover{
border: 1px solid #FE6F61;
color: #FE6F61;
background: #fff;
}

.modal-layer .field_area .field .SNS_ li{
height: 35px;
font-size: 14px;
}


.cancel_modal{
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.3);
left: 0;
top: 0;
z-index: 9999;
}

.cancel_modal .modal{
position: fixed;
left: 50%;
top: 50%;
/*    border: 1px solid var(--primary-color);*/
border-radius: 15px;
padding: 20px;
display: flex;
flex-direction: column;
align-items: center;
gap: 34px;
background: #fff;
z-index: 999;
transform: translate(-50%, -50%);
max-width: 420px;
width: 100%;
}
.cancel_modal .dimmed{
position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    
}
.cancel_modal .title{
font-size: 20px;
font-weight: 700;
padding-top: 10px;
padding-bottom: 30px;
}

.cancel_modal .btn_wrap{
display: flex;
gap:20px;
width: 100%;
}

.cancel_modal .btn_wrap button{
padding:  16px 20px;
font-size: 16px;
font-weight: 500;
line-height: 1;
border-radius: 5px;
flex: 1;
background: #fff;
border: 1px solid var(--primary-color);
color: var(--primary-color);
}

/* header */
#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 8000;
    background-color: #fff;
}
#header .inner {
}
#header a:hover,
#header li.active  {
    color: #3CCBDB;
    font-weight: 500;
}

#header .logo {
    margin-left: 15px;
}

#header .tool_area,
#header .catagory_area {
    border-bottom: 1px solid #E7E7E7;
}
#header .tool_area .inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 90px;
}

#header .catagory_area .inner {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 50px;
}
#header .catagory_area .menu a {
    display: inline-block;
    line-height: 3;
/*        width: 70px;*/
    text-align: center;
    padding: 0 8px;
/*        border-top: 4px solid #fff;*/
/*        border-bottom: 4px solid #fff;*/
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    height: 100%;
}
#header .catagory_area .menu a svg{
vertical-align: text-top;
}
#header .catagory_area .menu a img{
vertical-align: text-bottom;
}

#header .catagory_area .menu a.dot::before{
    content: "";
    position: absolute;
    right: 0;
    width: 4px;
    height: 4px;
    border-radius: 50px;
    background: #FF0202;
}

#header .catagory_area .menu .active a {
    border-bottom-color: #3CCBDB;
}

#header .search_area {
    margin-left: 214px;
}

#header .gnb {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    padding-left: 20px;
}
#header .gnb ul {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    white-space: nowrap;
    gap:42px;
}
#header .gnb ul li + li {
    /* margin-left: 30px; */
}
#header .gnb a {
    font-size: 14px;
    font-weight: 500;
}
#header .gnb .notice {
    position: relative;
    height: 22px;
}  
#header .gnb .notice.active:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background-color: var(--pink-100-color);
}

#header .ad_gnb ul{
    gap: 25px;
}

#header .ad_gnb ul li:first-child{
    margin-right: 18px;
}

#header .ad_gnb ul li button{
    padding: 12px 12px;
}

#header .catagory_area .inner > div {
    height: 100%;
}
#header .menu_all {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 100%;
    text-align: center;
    border-left: 1px solid #E7E7E7;
    border-right: 1px solid #E7E7E7;
    cursor: pointer;
}
#header .menu_all:before {
    content: "";
    width: 12px;
    height: 12px;
    margin-right: 14px;
    background-image: url(../img/icon/tool/bugger_b.svg);
    background-repeat: no-repeat;
    background-position: center;
}
#header .menu ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    padding-left: 35px;
}
#header .menu li {
    width: fit-content;
    min-width: 135px;
    height: 100%;
    text-align: center;
}
#header .menu li.on {
    color: #3CCBDB;
    font-weight: 500;
    border-bottom: 3px solid #3CCBDB;
}
#header .menu li.contents_tab{
    position: absolute;
    right: 0;
}
.menu_all_area {
    display: none;
}
.menu_all_area.active {
    display: block;
}
.menu_all_area .wrap {
    position: absolute;
    left: 0;
    top: 51px;
/*        height: 255px;*/
    display: flex;
    justify-content: stretch;
    align-items: flex-start;
    background-color: #fff;
    box-shadow: 0px 10px 10px rgba(0,0,0,0.05);
    -webkit-box-shadow: 0px 10px 10px rgba(0,0,0,0.05);
    border-radius: 0 0 10px 10px;
    font-size: 14px;
    z-index: 10;
}
.menu_all_area .wrap > article {
    width: 190px;
    height: 100%;
    margin-bottom: 0;
    padding: 30px;
}
.menu_all_area .wrap > article + article {
    border-left: 1px solid #EEEEEE;
}
.menu_all_area .title {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-weight: 700;
}
.menu_all_area .title img {
    margin-right: 8px;
}
.menu_all_area a {
    color: #888888;
}
.menu_all_area li {
    margin-top: 15px;
}

/* login header */
#header .catagory_area .campBtn_area {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    padding-right: 20px;
}
#header .catagory_area .campBtn_area a {
    padding: 6px 23px;
    padding-bottom: 8px;
    border-radius: 5px;
    color: #044951 !important;
    margin-left: 10px;
    font-size: 14px;
    font-weight: 700;
}
#header .catagory_area .campBtn_area a:hover {
    opacity: 0.8;
}

#header .gnb .use-info {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-right: 30px;
    height: 100%;
    font-size: 13px;
    color: #888;
    white-space: nowrap;
}
#header .gnb .use-info b {
    font-size: 16px;
    color: #222;
}
#header .gnb .use-info .btn_ {
    margin-left: 10px;
    padding: 2px 6px;
    font-size: 12px;
    font-weight: 400;
}
#header .gnb .use-info a {
    color: #888;
}
#header .gnb .use-info a:hover {
    color: inherit;
    font-weight: inherit;
}
#header .gnb .use-info .profile .profile_img {
    width: 34px;
    height: 34px;
    margin-right: 10px;
}
#header .gnb .use-info .profile .profile_area.nav .profile_img{
margin: 0 auto;
width: 30px;
height: 30px;
background-size: contain;
}
#header .gnb .use-info b {
    padding-right: 5px;
    color: #222;
}

/* header bubble */
#header .gnb .overBtn {
    height: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    z-index: 10;
}
#header .gnb .overBtn:hover .over_layer {
    display: block;
}
#header .gnb .over_layer {
    display: none;
    position: absolute;
    top: 100%;
    z-index: 10;
    background-color: #fff;
    box-shadow: 0px 4px 5px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 4px 5px rgba(0,0,0,0.1);
    border: 1px solid #E7E7E7;
    border-radius: 6px;
}
#header .gnb .over_layer ul {
    padding: 15px;
    font-size: 14px;
    flex-flow: column;
    align-items: flex-start;
    gap:0;
}
#header .gnb .over_layer ul li {
    width: 100%;
}
#header .gnb .over_layer ul li + li {
    margin-left: 0;
    margin-top: 8px;
}
#header .gnb .over_layer ul li a {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    position: relative;
/*        width: fit-content;*/
}
#header .gnb .over_layer ul.profile li a{
justify-content: center;
}
#header .gnb .profile_area.nav .over_layer ul li a{
    justify-content: center;

}
#header .gnb .over_layer ul li a.dot::before{
    content: "";
    position: absolute;
    right: -10px;
    width: 4px;
    height: 4px;
    border-radius: 50px;
    background: #FF0202;
}

#header .gnb .over_layer ul li a .count {
    padding: 3px 5px;
    min-width: 24px;
    border-radius: 20px;
    background-color: #F3FDFF;
    color: #16B9CB;
    font-size: 12px;
    text-align: center;
}
#header .gnb .over_layer ul li a p {
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
#header .gnb .over_layer ul li a.coupon{
flex-direction: row;
align-items: center;
gap:4px;

}
#header .gnb .over_layer ul li a.coupon .badge{
background: #EFEFEF;
border-radius: 50%;
color: #222;
padding: 0 6px;
font-size: 12px;
}
#header .gnb .over_layer ul li a.coupon .badge.on{
background: #FF0202;
color: #fff;
}
#header .gnb .over_layer ul + ul {
    border-top: 1px solid #E7E7E7;
}
#header .gnb .over_layer:before,
#header .gnb .over_layer:after {
    position: absolute;
    content: "";
    top: -15px;
}
#header .gnb .over_layer:before {
    border-top: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 18px solid #fff;
    z-index: 1;
}
#header .gnb .over_layer:after {
    margin-top: -1px;
    left: -1px;
    border-top: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 16px solid #E7E7E7;
}

#header .gnb #OVUSE {
    left: 7px;
/*        width: 164px;*/
    max-width: 164px;
    width: 100%;
}
#header .gnb .new_menu#OVUSE{
max-width: 240px;
}
#header .gnb #OVUSE:before,
#header .gnb #OVUSE:after {
    left: 17px;
}

#header .gnb #OVMT{
  right: 145px;
  width: 145px;
}

#header .gnb #OVMT:before,
#header .gnb #OVMT:after {
    left: 60px;
}

#header .gnb .admin #OVMT,
#header .gnb .admin #OVMT {
    right: 40px;
}

#header .gnb .admin #OVMT:before,
#header .gnb .admin #OVMT:after {
    left: 60px;
}

#header .gnb #OVNT {
    right: 0;
    width: 280px;
}
#header .gnb #OVNT:before,
#header .gnb #OVNT:after {
    right: 80px;
}
#header .gnb #OVNT:after {
    left: auto;
    right: 80px;
}
#header .gnb #OVNT .top {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 38px;
    padding: 0 15px;
    font-weight: 500;
    border-bottom: 1px solid #e7e7e7;
}
#header .gnb #OVNT .top b {
    font-weight: 500;
    padding-left: 5px;
    color: #FF4848;
}
#header .gnb #OVNT a {
    display: block;
}
#header .gnb #OVNT a p:first-child {
    color: #888;
}
#header .gnb #OVNT a:hover {
    color: inherit;
    font-weight: inherit;
    text-decoration: underline;
}
#header .gnb #OVNT .all {
    width: 100%;
    background-color: #F9F9F9;
    color: #444;
    text-align: center;
    padding: 9px;
    border-radius: 0px 0px 6px 6px;
}



#header .gnb #OVCT {
    right: 0px;
    width: 145px;
}
#header .gnb #OVCT:before,
#header .gnb #OVCT:after {
    left: auto;
    right: 15px;
}


#header .ad_banner.pc{
    display: flex;
}
#header .ad_banner.mo{
display: none;
}
#header .ad_banner{
background: var(--primary-color);
color: #fff;
display: flex;
justify-content: center;
align-items: center;
}
#header .ad_banner > div{
display: flex;
justify-content: center;
align-items: center;
}
#header .ad_banner > div .text{
font-size: 22px;
font-weight: 700;
}
#header .ad_banner > div .link_text{
font-size: 18px;
font-weight: 500;
line-height: 1;
border-left: 1px solid #fff;
margin: 0 15px;
display: flex;
cursor: pointer;
}
#header .ad_banner > div .link_text a{
padding: 0 15px;
line-height: 1;
}
#header .ad_banner div a:hover{
color: #fff;
}

#header .ad_banner .close_text{
cursor: pointer;
position: relative;
left: 100px;
}
#header .ad_banner .close_text span{
padding-right: 15px;
font-size: 14px;
font-weight: 500;

}

/* footer */
#footer {
    margin-top: 70px;
    border-top: 1px solid #E7E7E7;
}
#footer a:hover {
    font-weight: 600;
}
#footer .footer_top .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 50px;
    padding-bottom: 70px;
}
#footer .gnb_ {
    display: flex;
    justify-content: stretch;
    align-items: flex-start;
    flex-grow: 1;
    font-size: 14px;
}
#footer .gnb_ .title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 14px;
}
#footer .gnb_ .title a {
    padding-right: 20px;
    background-repeat: no-repeat;
    background-position: right bottom 7px;
    background-image: url(../img/icon/tool/arrow_right_b.svg);
}
#footer .gnb_ ul li {
    margin-top: 14px;
}
#footer .gnb_ ul li a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#footer .gnb_ ul li a:before {
    content: "·";
    font-size: 1.4em;
    font-weight: 600;
    margin-right: 8px;
    line-height: 0.6em;
}
#footer .gnb_ > article {
    flex-grow: 1;
    margin-bottom: 0;
} 

#footer .ch_link {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 260px;
    height: 42px;
    border: 1px solid #E7E7E7;
    border-radius: 5px;
    margin-bottom: 6px;
    padding: 9px;

    background-image: url(../img/icon/tool/arrow_right_g.svg);
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 6px;
}
#footer .ch_link:hover {
    background-image: url(../img/icon/tool/arrow_right_b.svg);
}
#footer .ch_link img {
    margin-right: 10px;
}


#footer .socials_ {
    flex-shrink: 0;
    display: flex;
/*        justify-content: flex-start;*/
/*        align-items: center;*/
}
#footer .socials_ a {
    color: #888888;
    font-size: 14px;
    text-align: center;
}
#footer .socials_ a span{
font-size: 12px;
}
#footer .socials_ a + a{
    margin-left: 30px;
    text-align: center;
}
#footer .socials_ .imgBox {
    width: 80px;
    height: 80px;
    background-color: #F1F2FB;
    border-radius: 50%;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-position: center;
}
#footer .socials_ .about {
    background-image: url(../img/icon/asset/about.svg);
}
#footer .socials_ .blog {
    background-image: url(../img/icon/asset/blog.svg);
}
#footer .socials_ .instar {
    background-image: url(../img/icon/asset/instar.svg);
}
#footer .socials_ a:hover  {
    font-weight: 600;
}
#footer .socials_ a:hover .about {
    background-image: url(../img/icon/asset/about_a.svg);
}
#footer .socials_ a:hover .blog {
    background-image: url(../img/icon/asset/blog_a.svg);
}
#footer .socials_ a:hover .instar {
    background-image: url(../img/icon/asset/instar_a.svg);
}

#footer .company_  {
    background-color: #FAFAFA;
}
#footer .company_ .inner {
    padding-top: 40px;
    padding-bottom: 60px;
}
#footer .company_ .info {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    font-size: 14px;
    max-width: 1130px;
}
#footer .company_ .info span {
    margin-left: 15px;
    padding-left: 15px;
    border-left: 1px solid #ddd;
    margin-bottom: 15px;
    color: #666666;
}
#footer .company_ .info span:nth-child(7) {
    margin-left: 0;
    padding-left: 0;
    border: 0;
}
#footer .company_ .copy_ {
    margin-top: 13px;
    font-size: 14px;
    font-weight: 500;
}
#footer .accordion{
display: none;
}

@media (max-width:800px){
#footer .info h1{
    display: none;
}
#footer .accordion{
    display: flex;
    text-align: center;
    font-weight: bold;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}
#footer .company_ .accordion img{
    transform: rotate(0deg);
    transition: transform .5s;
}
#footer .company_.on .accordion img{
    transform: rotate(180deg);
}
#footer .company_ .info{
    height: 0;
    overflow: hidden;
}

#footer .company_.on .info{
    height: 100%;
}
}


/* mobile top & bottom */
.mobile_area {
    position: relative;
    display: none;
    width: 100%;
}
.mobile_area .head {
    display: flex;
    justify-content: center;
    align-items: center;
/*        height: 60px;*/
    border-bottom: 1px solid #eee;
}
.mobile_area .head img {
    height: 21px;
}
.mobile_area .head .title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
}
.mobile_area .head .title a{
display: inline-block;
}

.mobile_area .search_area {
    position: absolute;
    left: 100%;
    top: 0;
    width: 100%;
    height: 100%;
    margin-left: 0 !important;
    border-color: #eee;
    z-index: 10;
    background-color: var(--primary-color);
    background-image: url(../img/icon/tool/search_ico_white.svg);
    background-repeat: no-repeat;
    background-position: right 20px center;
}
.mobile_area .search_area.active {
    left: 0;
}
.mobile_area .search_area input {
    margin: 0 60px;
    padding: 10px 15px;
    font-size: 16px;
    background-color: var(--primary-color);
    color: #fff;
    height: auto;
    border: 1px solid #fff;
    border-radius: 50px;
}
.mobile_area .search_area input::placeholder{
    color: #2D929E;
}
.mobile_area .close {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background-image: url(../img/icon/tool/arrow_left_w.svg);
    background-repeat: no-repeat;
    background-position: center;
}
.mobile_area .close {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    background-image: url(../img/icon/tool/arrow_left_w.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.mobile_area .m_trigger,
.mobile_area .his_back {
    position: absolute;
    left: 0;
    top: 0;
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-position: center;
}
.mobile_area .his_back {
    background-image: url(../img/icon/tool/his_back.svg);
}
.mobile_area .m_trigger {
    background-image: url(../img/icon/tool/m_bugger.svg);
}
.mobile_area .searchBtn, .mobile_area .search {
    position: absolute;
    right: 0;
    top: 50%;
    width: 60px;
    height: 60px;
    background-image: url(../img/icon/tool/search_ico_white.svg);
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(-50%);
    background-color: var(--primary-color,#3ccbdb);
    
}
.mobile_area .mileage_text{
position: absolute;
right: 15px;
display: flex;
align-items: center;
gap:5px;
font-size: 16px;
color: #fff;
z-index: 9;
}
.mobile_area.bet .mileage_text{
top: 50%;
transform: translateY(-50%);
color:#222;
}

.mobile_area .mileage_text span{
font-weight: 500;
}
.mobile_area .mileage_text img{
height: 16px;
}
.mobile_area .mileage_text .tooltip_text{
font-size: 12px;
position: absolute;
background: var(--primary-color);
padding: 10px;
border-radius: 8px;
top: 56px;
right: 0;
display: none;
width: 70dvw;
color: #fff;
box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.25);
font-weight: 500;

}

.mobile_area .mileage_text.on .tooltip_text{
display: inline-block;
}
.mobile_area .mileage_text.on .tooltip_text::before{
content: "";
background: var(--primary-color);
width: 20px;
height: 20px;
transform: rotate(45deg);
position: absolute;
right: 40px;
top: -9px;
box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.25);
z-index: -1;

}
    
.mobile_area .bizBtn {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    font-size: 14px;
}

.mobile_area .bizBtn img{
height: 16px;
padding-right: 5px;
}
.mobile_area .side_area {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 9999;
}
.mobile_area .side_area:before {
    content: "";
    position: absolute;
    left: -100vw;
    top: 0;
    width: 100vw;
    height: 100%;
    background-color: #000;
    opacity: 0.8;
    z-index: 0;
}
.mobile_area .side_area .wrap {
    position: absolute;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-flow: column;
    left: -100vw;
    top: 0;
    width: 80vw;
    min-width: 320px;
    height: 100%;
    background-color: #fff;
    z-index: 1;
}

.mobile_area .side_area.active:before,
.mobile_area .side_area.active .wrap {
    left: 0;
}

.mobile_area .side_area .wrap .use_area {
    width: 100%;
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 20px;
    padding-right: 70px;
    height: 60px;
    border-bottom: 1px solid #eee;
}
.mobile_area .side_area .wrap .use_area .user {
    font-size: 16px;
    font-weight: 300;
    padding-right: 25px;
    background-image: url(../img/icon/tool/gear.svg);
    background-repeat: no-repeat;
    background-position: right center;
}
.mobile_area .side_area .wrap .use_area .user b {
    font-weight: 700;
}

.mobile_area .side_area .wrap .use_area .user.signout {
    padding-right: 0;
    background-image: none;
}
.mobile_area .side_area .wrap .use_area .user.signout b {
    text-decoration: underline;
    text-underline-position: under;
    padding-right: 5px;
}
.mobile_area .side_area .wrap .use_area .btn_ {
    font-size: 14px;
    border: 1px solid #ddd;
    border-radius: 2px;
}

.mobile_area .side_area .wrap,
.mobile_area .search_area {
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.mobile_area .menu_area {
    flex-grow: 1;
    width: 100%;
    padding: 0 20px;
    padding-bottom: 20px;
    overflow-y: scroll;
}
.mobile_area .menu_area .title {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 60px;
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid #eee;
    background-image: url(../img/icon/tool/arrow_right_f.svg);
    background-repeat: no-repeat;
    background-position: right  center;
    background-size: 9px;
    position: relative;
}
.mobile_area .menu_area .title.dot::before{
content: "";
position: absolute;
left: 110px;
width: 4px;
height: 4px;
border-radius: 50px;
background: #FF0202;

}
.mobile_area .menu_area .active .title {
    background-image: url(../img/icon/tool/arrow_down_f.svg);
    background-repeat: no-repeat;
    background-position: right center;   
    background-size: 14px;
}
.mobile_area .menu_area .title img {
    margin-right: 8px;
}
.mobile_area .menu_area .title img.custom{
    width: 18px;
}
.mobile_area .menu_area .depth {
    display: none;
}
.mobile_area .menu_area ul {
    background-color: #F9F9F9;
    padding: 14px 28px;
    font-size: 14px;
}
.mobile_area .menu_area ul li {
    color: #888;
}
.mobile_area .menu_area ul li + li {
    margin-top: 10px;
}
.mobile_area .side_area .btn_area {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 45px;
    padding: 0;
}
.mobile_area .side_area .btn_area a {
    flex: 0 1 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 15px;
    font-weight: 700;
}
.mobile_area .side_area .btn_area a:first-child,
#header .catagory_area .campBtn_area a:first-child {
    background-color: #3CCBDB;
}
.mobile_area .side_area .btn_area a:last-child,
#header .catagory_area .campBtn_area a:last-child {
    background-color: #F7E948;
}


/* bottom */
.icon {
    background-repeat: no-repeat;
    background-position: top center;
}
#mobile_bottom {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 7900;
    display: none;
}
#mobile_bottom .menu {
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    background-color: #fff;
    height: 60px;
    border-top: 1px solid #ddd;
}
#mobile_bottom .menu li {
    flex: 1;
    font-size: 12px;
    color: #9499B4;
}
#mobile_bottom .menu li .icon {
    display: inline-block;
    width: 24px;
    height: 20px;
    margin-bottom: 2px;
}
#mobile_bottom .menu li .home {
    background-image: url(../img/icon/fe/m_home.svg);
}
#mobile_bottom .menu li .campaign {
    background-image: url(../img/icon/fe/m_campaign.svg);
}
#mobile_bottom .menu li .campaign2 {
    background-image: url(../img/icon/fe/m_campaign2.svg);
}
#mobile_bottom .menu li .mycampaign {
    background-image: url(../img/icon/fe/m_mycampaign.svg);
}
#mobile_bottom .menu li .advert {
    background-image: url(../img/icon/fe/m_advertiser.svg);
}
#mobile_bottom .menu li .customer {
    background-image: url(../img/icon/fe/m_customer.svg);
}
#mobile_bottom .menu li .mypage {
    background-image: url(../img/icon/fe/m_mypage.svg);
}



#mobile_bottom .menu li.active {
    color: #16B9CB;
}
#mobile_bottom .menu li.active .home {
    background-image: url(../img/icon/fe/m_home_a.svg);
}
#mobile_bottom .menu li.active .campaign {
    background-image: url(../img/icon/fe/m_campaign_a.svg);
}
#mobile_bottom .menu li.active .campaign2 {
    background-image: url(../img/icon/fe/m_campaign2_a.svg);
}
#mobile_bottom .menu li.active .mycampaign {
    background-image: url(../img/icon/fe/m_mycampaign_a.svg);
}
#mobile_bottom .menu li.active .advert {
    background-image: url(../img/icon/fe/m_advertiser_a.svg);
}
#mobile_bottom .menu li.active .customer {
    background-image: url(../img/icon/fe/m_customer_a.svg);
}
#mobile_bottom .menu li.active .mypage {
    background-image: url(../img/icon/fe/m_mypage_a.svg);
}


/* container */
#header + #container {
    padding-top: 142px ;
/*        min-height: 695px;*/
}
#header + #container.real_time_contents{
padding-top: 91px;
}

#container {
padding-top: 142px;
}
@media (max-width:800px){
    #container{
        padding-top: 36px;
    }
}

/* visual slide */
.visula_slide {
    margin-bottom: 10px;
}
.visula_slide .swiper {
    position: relative;
/*        padding: 40px 0;*/
    overflow: hidden;
    z-index: 0;
}
.visula_slide .swiper-slide {
    width: 460px;
/*        margin-right: 30px;*/
    box-shadow: 0px 10px 10px rgba(0,0,0,0.05);
    border-radius: 20px;
} 

@media (max-width:800px){
.visula_slide .swiper-slide{
    margin-right: 30px;
}
}
.visula_slide .swiper-slide img {
    vertical-align: top;
    width: 100%;
}

.visula_slide.sub .swiper-slide{
box-shadow: none;
border-radius: 8px;
}
.visula_slide .sub_banner_swiper .swiper-slide[data-item='2'] img {
max-width: 110px;
transform: translateY(0);
}


.visula_slide button[class*=swiper-button] {
    width: 60px;
    height: 60px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70px;
    border: none;
    outline: none;
    margin-top: -30px;
}
.visula_slide button[class*=swiper-button]:after {
    display: none;
}
.visula_slide button:focus {
    box-shadow: none;
}
.visula_slide .swiper-button-prev {
    left: -30px;
    background-image: url(../img/icon/tool/swiper_prev.svg);
}
.visula_slide .swiper-button-next {
    right: -30px;
    background-image: url(../img/icon/tool/swiper_next.svg);
}
.visula_slide .pagenation-inner {
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    bottom: 0;
}
.visula_slide .pagenation-inner .swiper-pagination {
    position: relative;
    bottom: 0;
}
.visula_slide .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    margin: 0 5px;
}
.visula_slide .swiper-pagination-bullet-active {
    background-color: #444444;
}








/* 매인 슬라이드 재작업 */

.visula_slide .main_banner_swiper .swiper-pagination{
bottom: 24px;
font-size: 10px;
width: fit-content;
position: absolute;
left: calc(100% - 74px);
padding:4px 10px;
border-radius: 9999px;
backdrop-filter: blur(2px);
color: #fff;
background-color: rgba(0, 0, 0, 0.3);
display: none;
}

@media (max-width: 800px){
.visula_slide .main_banner_swiper .swiper-pagination{
    display: block;
}    
}

.visula_slide .main_banner_swiper .swiper-pagination span{
padding: 0 1.8px;
}
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper{
display: flex;
justify-content: space-between;
align-items: stretch;
padding-top: 37px;

}


@media (max-width: 800px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper{
    padding-top: 0;
    gap:0;
}    
}


.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .swiper-slide{
    flex: 1;
position: relative;
z-index: 1;
border-radius: 30px;
aspect-ratio: 21 / 10;
box-shadow: none;
}



@media (max-width: 800px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .swiper-slide{
    flex: none;
    height: auto;
    aspect-ratio: initial;
    margin: 0;
    border-radius: 10px;
    padding: 0;
}
}




.visula_slide .main_banner_swiper .main_banner_swiper_wrapper a{
display: block;
width: 100%;
padding: 0;
}
@media (max-width: 1440px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper a{
    padding: 40px;
}    
}

@media (max-width: 800px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper a{
    padding: 0;
    height: 100%;
}    
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper a .item_box{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='1']{
background: none;
padding-bottom: 0;
color: #fff;
}


.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='1'] a{
background-image: url("https://assaview.co.kr/img/banner/infl_banner_img_01.png");
height: 100%;
background-size: cover;
}


.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2']{
background: none;
}
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] a{
background-image: url(https://assaview.co.kr/img/banner/biz_banner_img_01.png);
height: 100%;
background-size: cover;
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] .kakao_btn{
display: flex;
background: #fff;
align-items: center;
border-radius: 20px;
width: fit-content;
font-size: 18px;
font-weight: bold;
gap:10px;
padding: 10px 16px;
margin: 0 0 0 auto;
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='4']{
display: none;
}


@media (max-width: 1440px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] .kakao_btn{
    font-size: 16px;
}

}

@media (max-width: 800px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] .kakao_btn{
    font-size: 12px;
    padding: 7px 12px;
    display: none;
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='4']{
    display: block;
}    
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='4'] a{

background-image: url(https://assaview.co.kr/img/banner/naver_clip_banner_mo.png);
height: 100%;
background-size: cover;
border-radius: 20px;
}
}


.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] .kakao_btn img{width: auto;}



.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body h1{
font-size: 36px;
font-weight: 700;
padding-bottom: 10px;
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body p{
        font-size: 20px;
font-weight: 500;
word-break: keep-all;
}

@media (max-width: 1440px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body h1{
    font-size: 28px;
}
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body p{
    font-size: 16px;
}
}

@media (max-width: 800px){
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body h1{
    font-size: 16px;
    padding-bottom: 5px;
    font-weight: 700;
}
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper .body p{
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}
}

@media (max-width:800px){


.visula_slide .main_banner_swiper .main_banner_swiper_wrapper a{
    aspect-ratio: 33 / 9;
}

.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='1'] a{
    background-image: url(https://assaview.co.kr/img/banner/mo_infl_banner_img_01.png);
}
.visula_slide .main_banner_swiper .main_banner_swiper_wrapper [data-item='2'] a{
    background-image: url(https://assaview.co.kr/img/banner/mo_biz_banner_img_01.png);
}
}















.visula_slide .guide_banner{
display: flex;
justify-content: space-between;
align-items: stretch;
gap:22px;
padding-top: 37px;
}
.visula_slide .guide_banner a{
display: block;
}
.visula_slide .guide_banner br{
display: none;
}


.visula_slide .guide_banner > a{
flex: 1;
position: relative;
z-index: 1;
padding: 60px;
border-radius: 20px;
aspect-ratio: 21 / 10;
max-height: 320px;
}


.visula_slide .guide_banner > a h1{
font-size: 40px;
font-weight: 700;
padding-bottom: 10px;
}

.visula_slide .guide_banner > a p{
font-size: 20px;
font-weight: 500;
word-break: keep-all;
}
.visula_slide .guide_banner > a > a{
display: inline-block;
padding: 0;
margin: 0;
}
.visula_slide .guide_banner > a img{
position: absolute;
right: 18px;
bottom: 0;
/*    z-index: -9;*/
}

.visula_slide .guide_banner > div{
flex: 1;
position: relative;
z-index: 1;
padding: 60px;
padding-bottom: 0;
border-radius: 20px;
aspect-ratio: 21 / 10;
max-height: 320px;
}


.visula_slide .guide_banner > div h1{
font-size: 36px;
font-weight: 700;
padding-bottom: 10px;
}

.visula_slide .guide_banner > div p{
font-size: 20px;
font-weight: 500;
word-break: keep-all;
}
.visula_slide .guide_banner > div > a{
display: inline-block;
padding: 0;
margin: 0;
}
.visula_slide .guide_banner > div img{
position: absolute;
right: 18px;
bottom: 0;
z-index: -9;
}



.visula_slide .guide_banner .influencer{
background: var(--primary-color);
color: #fff;

}
.visula_slide .guide_banner .biz{
background: var(--accent-color);

}

.visula_slide .guide_banner .open_talk{
background: var(--accent-color);

}
.visula_slide .guide_banner .open_talk > div {
display: flex;
justify-content: space-between;
align-items: center;
}
.visula_slide .guide_banner .open_talk > div > div{
display: flex;
}
.visula_slide .guide_banner .open_talk img{
position: static
}
.visula_slide .guide_banner .open_talk .megaphone{
max-width: 101px;
height: 117px;
object-fit: cover;
}
.visula_slide .guide_banner .open_talk .kakao_btn{
background: #fff;
align-items: center;
border-radius: 20px;
width: fit-content;
font-size: 18px;
font-weight: bold;
gap:10px;
padding: 10px;
margin: 20px 0 0 auto;
}

/* 캠페인 섹션 */
.campaign__ {
    padding: 40px 0;
    position: relative;
}
.campaign__ .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 31px;
}
.campaign__ .title:has(+div.chip_cont){
    padding-bottom: 0;
}

.campaign__ .title .title_left_inner{
    display: flex;
    align-items: center;
    gap: 10px;
}

.campaign__ .title .tool{
    display: flex;
    gap:20px;
}

.campaign__ .title .tool .customBtn_p{
    align-items: center;
}

.campaign__ .title h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.5em;
    
}
.campaign__ .title h1:after {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    height: 25px;
    font-size: 13px;
    margin-left: 10px;
    background-color: #eee;
    color: #fff;
    border-radius: 30px;
    padding: 0 10px;
}
/*
.campaign__ .title.Custom h1:after {
    content: "";
    background:url(../img/icon/asset/custom_label_text.png);
    background-size: cover;
    width: 36px;
    height: 36px;
    border-radius: 0;
}
*/
.campaign__ .title.HOT h1:after {
    content: "HOT";
    background-color: #FF5151;
}
.campaign__ .title.PICK h1:after {
    content: "PICK";
    background-color: #40A436;
}
.campaign__ .title.NEW h1:after {
    content: "NEW";
    background-color: #3CCBDB;
}
.campaign__ .title h1.mileage:after {
    content: "12:00~12:30PM";
    background-color: #3CCBDB;
}
.campaign__ .title .more {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 97px;
    height: 40px;
    border-radius: 5px;
    border: 1px solid #ddd;
    padding-left: 20px;
    padding-bottom: 2px;
    background-image:url(../img/icon/tool/arrow_right_b.svg);
    background-repeat: no-repeat;
    background-position: right 20px center;
}
.campaign__ .imgBannerIndex {
    position: absolute;
    bottom : 50px;
    left : -220px;
    /* background: tomato; */
}
.campaign__ .imgBannerList {
    position: absolute;
    Top : 400px;
    left : -220px;
    /* background: tomato; */
}

.campaign__ .btn_cont{
padding-top: 30px;
display: flex;
justify-content: center;
}

.campaign__ .btn_cont div{
display: flex;
gap:10px;
}

.campaign__ .title .btn_cont{
padding-top: 0;
}

.campaign__ .title .mileage_cont{
font-size:22px;
font-weight: bold;
}
.campaign__ .title .mileage_cont .my_mileage{
display: flex;
align-items: center;
gap:5px;
}
.campaign__ .title .mileage_cont .my_mileage .tooltip_text{
font-size: 14px;
display: none;
}
.campaign__ .title .mileage_cont .my_mileage.on .tooltip_text{
display: inline-block;
position: absolute;
background: var(--primary-color);
right: 0;
padding: 14px;
border-radius: 10px;
top: 60px;
color: #fff;
font-weight: 500;
}
.campaign__ .title .mileage_cont .my_mileage.on .tooltip_text::before{
content: "";
background: var(--primary-color);
width: 20px;
height: 20px;
transform: rotate(45deg);
position: absolute;
right: 40px;
top: -9px;
}


.nonLogin{
text-align: center;
}

.nonLogin .inner{
padding: 50px 20px;
background: #F5F5FA;
border-radius: 10px;
}


/* 캠페인 리스트 */

.campaign_slide button[class*=swiper-button] {
    width: 60px;
    height: 60px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70px;
    border: none;
    outline: none;
    margin-top: 0px;
}
.campaign_slide button[class*=swiper-button]:after {
    display: none;
}
.campaign_slide button:focus {
    box-shadow: none;
}
.campaign_slide .swiper-button-prev {
    left: -30px;
    background-image: url(../img/icon/tool/swiper_prev.svg);
}
.campaign_slide .swiper-button-next {
    right: -30px;
    background-image: url(../img/icon/tool/swiper_next.svg);
}

.campaign_slide .swiper-button-prev {
    left: -30px;
    background-image: url(../img/icon/tool/swiper_prev.svg);
}
.campaign_slide .swiper-button-next {
    right: -30px;
    background-image: url(../img/icon/tool/swiper_next.svg);
}

@media (max-width: 1500px) {
.campaign_slide .swiper-button-prev {
    left: 0px;
}
.campaign_slide .swiper-button-next {
    right: 0px;
}
}




.list_area .campaign_card{
max-width: 256px;
/* margin-right: 40px; */
/*    box-shadow: 1px 1px 5px rgba(100,100,100,0.3);*/
border-radius: 10px;    
}
.list_area ul {
    display: flex;
/*        justify-content: stretch;*/
    align-items: flex-start;
    flex-wrap: wrap;
}
.list_area ul li:not(.pagenate ul li) {
    flex-shrink: 0;
    margin-top: 50px;
    width: 256px;
/*        box-shadow: 1px 1px 5px rgba(100,100,100,0.3);*/
    border-radius: 10px;
}
.list_area ul li:nth-child(1):not(.pagenate ul li),
.list_area ul li:nth-child(2):not(.pagenate ul li),
.list_area ul li:nth-child(3):not(.pagenate ul li),
.list_area ul li:nth-child(4):not(.pagenate ul li),
.list_area ul li:nth-child(5):not(.pagenate ul li) {
    margin-top: 0;
}
.list_area ul li:nth-child(5n+1):not(.pagenate ul li) {
    margin-left: 0;
}
.list_area ul li + li:not(.pagenate ul li) {
    margin-left: 40px;
}


.list_area .imgBox {
    border-radius: 8px;
    overflow: hidden;
    display: inline-block;
}

.list_area .imgBox .custom_label{
position: absolute;
left: 4px;
top: 4px;
width: 41px;
z-index: 1;
}
.list_area .imgBox .custom_label span{
position: absolute;
top: 50%;
left: 50%;
display: inline-block;
color: #fff;
font-size: 10px;
font-weight: 700;
transform: translate(-50%,-50%) rotate(-45deg);
z-index: 1;
}
.list_area .imgBox .recommend_label{
position: absolute;
right: 10px;
top: 0px;
width: 33px;
z-index: 1;
}
.list_area .imgBox .recommend_label span{
position: absolute;
top: 50%;
right: 25%;
display: inline-block;
color: #fff;
font-size: 10px;
font-weight: 700;
transform: translateY(-50%);
z-index: 1;
}

.list_area .imgBox .recommend_label img,.list_area .imgBox .custom_label img{
opacity: .8;
filter: drop-shadow(2px 2px 8px rgba(0, 0, 0, 0.25));
}

/*
.list_area .imgBox.wait::before{
    content: "선정 대기 중";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(217,217,217);
    opacity: .5;
    z-index: 1;
    font-size: 22px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
*/

.list_area .imgBox.recruit_closed::before{
content: "모집 완료";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: transparent url(/skin/demo/img/campaign/sold_out_bg.png) left top repeat;
z-index: 1;
font-size: 22px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
color:#fff;
}


.list_area .imgBox.complete::before{
    content: "미션 제출 완료";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(217,217,217);
    opacity: .5;
    z-index: 1;
    font-size: 22px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}


.list_area .imgBox .sold_out {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: transparent url(/skin/demo/img/campaign/sold_out_bg.png) left top repeat;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 4;
}
.list_area .imgBox .sold_out::before{
    content: "내일 12시 재오픈";
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}
.list_area .imgBox .sold_out.not_re_open::before{
    content: "모집 마감";
}

.list_area .imgBox .open_yejung {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: transparent url(/skin/demo/img/campaign/sold_out_bg.png) left top repeat;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 4;
    box-sizing: border-box;
    padding: 0 10px;
    text-align: center;
    word-break: keep-all;
}
.list_area .imgBox .open_yejung::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}
.list_area .imgBox .open_yejung span{
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: inline-block;
    width: 100%;
    text-align: center;
    
}

.list_area .imgBox .first_come_open_yejung {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: transparent url(/skin/demo/img/campaign/sold_out_bg.png) left top repeat;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        z-index: 4;
}
.list_area .imgBox .first_come_open_yejung::before{
    content: "12:35 선착순 오픈 예정";
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    box-sizing: border-box;
    padding: 0 10px;
    text-align: center;
    word-break: keep-all;
    
}

.list_area .imgBox .check {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: transparent url(/skin/demo/img/campaign/sold_out_bg.png) left top repeat;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    z-index: 4;
}
.list_area .imgBox .check::before{
    content: "참여 불가";
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}


.list_area .imgBox img {
    width: 100%;
    vertical-align: top;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}

.list_area ul li:hover .imgBox > img {
    will-change: transform;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.list_area .details {
    padding: 14px 0;
    color: #666666;
}
.list_area .item{
    background: #fff;
    border-radius: 10px;
}
.list_area .tag_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 8px;
}
.list_area .tag_area img {
    margin-right: 5px;
}
.list_area .tag_area span {
    margin-left: 2px;
    font-size: 15px;
    font-weight: 700;
}
.list_area .tag_area span.black{
color: #222;
font-weight: 500;
}
.real_time_contents .listTab_area{
    height: auto;
    padding: 0;
    border-top: 1px solid #EEEEEE;
    margin-bottom: 0;
}
.real_time_contents .listTab_area li a{
padding: 27px 0;
}
.real_time_contents .list_area .tag_area span{
    margin-left: 0px;
    font-weight: 400;
    color: #222;
}
.list_area .tag_area .cp_type{
    display: flex;
}
.list_area .aside .tag_area{
    justify-content: flex-start;
    gap:10px;
}
.list_area .aside .tag_area p{
    display: flex;
}

.list_area .details .col-06 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.list_area .details .price_ {
    text-align: right;
    font-size: 14px;
}
.list_area .details .price_ b {
    color: #16B9CB;
}

.list_area .details .timer{
    color: var(--primary-color);
    font-weight: 700;
    font-size: 15px;
}
.list_area .details .timer.d-day{
    color: #FF5151;
}
.list_area .details .timer.text-red{
    color: #FF5151;
}

#campaign_list_wrap .details .timer{
color: #222;
}
.swiper.list_area .details .timer{
color: #222;
}
.list_area .details .count{
color: #222;
font-weight: 500;
}
.list_area .details .status_cont{
display: flex;
justify-content: space-between;
gap:10px;
}
.list_area .details .status_cont .status{
display: flex;
align-items: center;
gap:10px;

}
.list_area .details .status_cont .date{

}
.list_area .details .status div{
display: flex;
align-items: center;
gap:10px;
}

.list_area .appli_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}
.list_area .appli_area b {
    color: #16B9CB;
}


.list_area .appli_area .timer {
    color: var(--primary-color);
    font-weight: 700;
}
.list_area .appli_area .timer.d-day {
    color: #FF5151;
}
.list_area .appli_area .dday {
    color: #222;
}

.list_area .subject {
    margin-bottom: 2px;
    color: #222;
    word-break: keep-all;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    display: block;
}
.list_area .subject .brand{
font-weight: 700;
}

.list_area .my_opt_name{
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: keep-all;
    white-space: normal;
}
.list_area .desc {
    display: flex;
    font-size: 12px;
    color: #000;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.list_area .aside .desc{
    padding-bottom: 4px;
}

.list_area .desc > div{
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.list_area .desc div b{
    color: #3CCBDB;
}

.list_area .desc .opt_name {
/*        width: 360px;*/
    text-overflow: ellipsis;
    overflow: hidden;
    /* white-space: nowrap; */
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    flex:1.67;
    white-space: normal;
    color:#888;
}
.list_area .desc .cp_limit{
border: 1px solid #ff3131;
color: #ff3131;
padding: 5px;
border-radius: 5px;
font-weight: 700;
line-height: 1;
}
.list_area .desc .point_desc {
    width: 360px;
    text-overflow: ellipsis;
    overflow: hidden;
    /* white-space: nowrap; */
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}
.list_area .opt_desc {
    display: flex;
    margin-bottom: 20px;
    font-size: 14px;
}
.list_area .opt_desc .opt_name {
    width: 220px;
    height: 40px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.list_area .point_tag {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    background-color: transparent;
    height: auto;
    margin-bottom: 0;
    font-size: 12px;
}

.list_area .imgBox .point_tag{
position: absolute;
bottom: 10px;
right: 10px;
background: var(--primary-color);
color: #fff;
z-index: 1;
padding: 0;
margin: 0;
border-radius: 5px;
}
.list_area .imgBox .point_tag.add_reward_label{
display: flex;
align-items: center;
gap:5px;
padding: 3px 5px;
font-weight: 600;
}
.list_area .imgBox .point_tag.add_reward_label span{
padding: 0;
}
.list_area .imgBox .point_tag span{
color: #fff;
margin: 0;
border: none;
}
.list_area .reporter .point_tag{
padding-top: 0;
}
.compain_detials .list_area .point_tag{
padding-top: 0;
}
.list_area .point_tag .point {
    padding: 4px 8px;
    padding-bottom: 6px;
    color: #444;
    border: 1px solid currentColor;
    border-radius: 5px;
    margin-right: 4px;
    margin-bottom: 4px;
}

.list_area .point_tag .point{
margin-bottom: 0;
padding-bottom: 4px;
color: var(--primary-color);
}
.list_area .point_tag.payback_reward_label .point{
border-color: var(--line-color);
color: #222;
}

.list_area .point_tag.reporter .point{
color: var(--primary-color);
}
.list_area .point_tag .point.bonus {
    color: #16B9CB;
}

.list_area .pagenate ul {
    display: flex;
    justify-content: center;
    align-items: center;
}


.empty_cp{
display: flex;
flex-direction: column;
text-align: center;
width: 100%;
padding-bottom: 30px;
font-size: 20px;
font-weight: 400;
justify-content: center;
align-items: center;
padding: 50px 0 ;
gap: 10px;
}
.empty_cp img{
max-height: 150px;
}
.empty_cp > div{
color: #B4B4B4;
font-size: 16px;
}
#campaign_list_wrap .empty_cp_btn{
margin: 0 auto;
}

#campaign_list_wrap .empty_cp_btn div{
display: flex;
gap: 10px;
}

.content_tab{
position: sticky;
top: 91px;
display: flex;
flex-direction: column;
z-index: 99;
background: #fff;
}
.content_tab .content_line li{
font-size: 16px;
font-weight: 600;
line-height: 1;

display: inline-block;
cursor: pointer;
}
.content_tab .content_line li a{
padding: 27px 20px;
display: inline-block;
}
.content_tab .content_line li.active{
color: var(--primary-color);
}

/* 로그인 가입 */    
.log_wrap {
    padding-top: 75px;
}
.log_wrap .title {
    text-align: center;
    margin-bottom: 36px;
    width: fit-content;
    margin: 0 auto 36px;
}
.log_wrap .form_area {
    background-color: #fff;
    border: 1px solid #F1F2FB;
    border-radius: 20px;
    box-shadow: 0px 10px 20px #F1F2FB;
    margin: 0 auto;
    margin-bottom: 150px;
}
.form_area .btn_area {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 50px;
 }
 .form_area .btn_area button,
 .form_area .btn_area .btn {
    flex-grow: 1;
    height: 60px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 700;
 }
 .form_area .btn_area .submit {
    background-color: #3CCBDB;
    color: #fff;
 }


.signup_area {
    max-width: 700px;
    margin: 0 auto;
    padding: 60px;
}
.useType_ {}
.useType_ h5 {
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    padding-bottom: 30px;
}
.useType_ .check_wrap {
    position: relative;
/* max-width: 440px; */
height: 60px;
/* background-color: #F9F9F9; */
margin: 0 auto;
/* border-radius: 30px; */
margin-bottom: 20px;
display: flex;
justify-content: center;
gap: 20px;
}
.useType_ .check_wrap .check_ {
        /* position: absolute; */
top: 0;
/* width: 220px; */
height: 100%;
/* border-radius: 40px; */
/* overflow: hidden; */
max-width: 220px;
width: 100%;
}
.useType_ .check_wrap .check_ + .check_ {
    right: 0;
    cursor: pointer;
}
.userTypeCheck_wrap{
display: flex;
justify-content: center;
align-items: center;
gap:20px;

}

.userTypeCheck_wrap a{
padding: 20px;
text-align: center;

}
.check_ input {
    left: 0;
    top: 0;
    z-index: 1;
    cursor: pointer;
    display: none;
}
.check_ input + label {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #3CCBDB;
    border-radius: 10px;
    max-width: 220px;
    border: 1px solid #3CCBDB;
    cursor: pointer;
}
.check_ input + label img {
    display: none;
    vertical-align: top;
    margin-right: 10px;
}
.check_ input:checked + label {
    background-color: #3CCBDB;
    color: #fff;
    font-weight: 700;
}
.check_ input:checked + label img {
    display: block;
}

.sng_sign {
    max-width: 460px;
    margin: 0 auto;
    margin-bottom: 50px;
}
.sng_sign .tit {
    position: relative;
    text-align: center;
    margin-bottom: 20px;
}
.sng_sign .tit:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    border-top: 1px solid #EEE;
}
.sng_sign .tit span {
    position: relative;
    font-size: 14px;
    font-weight: 500;
    background-color: #fff;
    padding: 0 25px;
    z-index: 1;
}
.sng_sign ul {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sng_sign ul li + li {
    margin-left: 20px;
}
.sng_sign ul li img {
    width: 100%;
    vertical-align: top;
}


.term_wrap > ul li {

}
.term_wrap > ul li + li {
    margin-top: 10px;
    margin-left:28px;
}
.term_wrap .term {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 24px;
}
.term_wrap .term.allCehck {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 40px;
}
.term_wrap .term .drop_btn {
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    width: 90px;
    padding: 2px 13px;
    border-radius: 5px;
    background-image: url(../img/icon/tool/arrow_down_m.svg);
    background-repeat: no-repeat;
    background-position: right 14px center;
    color: #3CCBDB;
}
.term_wrap .term .drop_btn.active {
    background-color: #F1FCFE;
    background-image: url(../img/icon/tool/arrow_up_m.svg);
}

.term_wrap .dorp_wrap {
    display: none;
    margin-top: 18px;
}
.term_wrap .dorp_wrap .text {
    background-color: #F5F5FA;
    border-radius: 5px;
    padding: 25px 17px;
    max-height: 190px;
    overflow-y: scroll;
    /* white-space: pre-line; */
    font-size: 13px;
    line-height: 1.5em;
}

.term_wrap .dorp_wrap .text::-webkit-scrollbar {
    width: 15px;
    background-color: transparent;
 }
.term_wrap .dorp_wrap .text::-webkit-scrollbar-thumb {
    background-color: #9499B4;
    border: 5px solid #F5F5FA;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
 }
.term_wrap .dorp_wrap .text::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
 }


/* 로그인 */
.signin_area {
    max-width: 650px;
    padding: 70px 60px;
}
.signin_area .btn_area {
    margin-top: 30px;
}
.signin_area .field_wrap {
    padding: 0;
    border: none;
}
.signin_area .field_area .field {
    background-color: #F5F5FA;
    height: 60px;
    border-radius: 10px;
    padding: 0 20px;
}
.signin_area .field_area .field input {
    border: none;
}
.signin_area .field_area .field > label {
    font-size: 16px;
    color: #222;
}
.signin_area .field_area + .field_area {
    margin-top: 10px;
}

.signin_area .auto_ {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}
.signin_area .auto_ a {
    font-size: 14px;
    color: #444;
    position: relative;
    display: inline-block;
    line-height: 1;
}
.signin_area .auto_ a:first-child{
    padding-right: 10px;
}
.signin_area .auto_ a:last-child{
    padding-left: 5px;
}
.signin_area .auto_ a:first-child::before{
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    width: 1px;
    height: 12px;
    background: #E4E8EE;
    
}

.quick_signup {
    margin-bottom: 50px;
}
.quick_signup li + li {
    margin-top: 10px;
}
.quick_signup li:first-child a{
    background: #40A436;
    color: #fff;
}
.quick_signup li:nth-child(2) a{
    background: #FFDF00;
}
.quick_signup li:nth-child(3) a{
    background: #000000;
    color: #fff;
}
.quick_signup li:last-child a.btn{
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
}
.quick_signup a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    border-radius: 10px;
}
.quick_signup a:hover {
    font-weight: 500;
}
.quick_signup a img {
    margin-right: 20px;
    max-width: 28px;
    object-fit: cover;
}


.signin_area .induce_ {
    text-align: center;
    margin-top: 50px;
}
.signin_area .induce_ h5 {
    font-size: 16px;
    font-weight: 400;
}
.signin_area .induce_ .btn_area {
    margin-top: 20px;
}
.signin_area .induce_ .btn {
    width: 100%;
    border-radius: 10px;
    color: #3CCBDB;
    border-color: #3CCBDB;
}

.signin_area .naver_help{
text-align: right;
padding-top: 60px;
}

.signin_area .naver_help .under_line span{
cursor: pointer;
border-bottom: 1px solid #444;
color: #444;
}



/* 프로필 카드 */
.profile_area {}
.profile_area.nav{
padding: 15px 15px 0 15px;
}
.profile_area .profile_img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 auto;
    background-color: #EFEFEF;
    background-image: url(../img/profile/dump.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 28.5px;
    overflow: hidden;
}
.profile_area .profile_img > img {
    width: 100%;
    height: 100%;
}
.profile_area .profile_info {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}
.profile_area .profile_info .lv {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    padding-right: 15px;
    margin-right: 15px;
    border-right: 1px solid #ddd;
}
.profile_area .profile_info .lv img {
    margin-right: 5px;
}
.profile_area .profile_info .name {
    font-size: 20px;
    font-weight: 700;
}
.profile_area.nav .profile_info .name{
    font-size: 14px;
}
.profile_area .email {
    font-size: 13px;
    color: #999;
    margin-top: 5px;
    text-align: center;
}
.profile_area.nav .email{
    font-size: 12px;
}
.profile_area.nav .tier{
height: auto;
padding: 5px 0;

}
.profile_area.nav .tier div{
/*    padding: 0px 20px;*/
font-size: 12px;
}
#header .profile_area.nav .tier div b{
font-size: 12px;
color: #999;
}
.profile_area.nav .tier span{
font-size: 12px; 
max-width: 62px;
}
.profile_area.nav .tier span img{
max-width: 20px;
gap:0;
}
#header .gnb .profile_area.nav .tier span b{
font-size: 12px;
color: #999;
padding-right: 0;
}
.profile_area.nav .tier div:first-child span{
max-width: 60px;
}
.profile_area .tier {
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.profile_area .tier img {
    vertical-align: top;
}
.profile_area .tier > div {
    color: #999;
    font-size: 14px;
    border-right: 1px solid #ddd;
    flex: 1;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: center;
}
.profile_area .tier > div:last-child {
    border: 0;
}

.profile_area .tier div:first-child span{
max-width: 66px;
width: 100%;
}
.profile_area .tier div span{
max-width: 78px;
width: 100%;
display: flex;
align-items: center;
gap: 5px;
}


.profile_area .email + .tier {
    margin-top: 15px;
    margin-bottom: 5px;
}

/* aside menu */
.aside_section .inner {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    padding-top: 40px;
}
.aside_section .inner > .content {
    flex-grow: 1;
    width: 1120px;
}

.aside_section .inner > .content > .account_title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    gap: 24px;
}

.aside_section .inner .account_title button {
    background: #fff;
    border: 1px solid #999;
    padding: 10px;
    margin-bottom: 21px;
    border-radius: 5px;
    font-weight: 300;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap:5px;
}

.ct_title {
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 20px;
}
div.ct_title{
font-size: 24px;
font-weight: 600;
display: flex;
justify-content: space-between;
align-items: center;
}
div.ct_title .ui-button{
padding: 11px 32px;
font-size: 16px;
}
.ct_title .name {
    position: relative;
    font-weight: 700;
}
.ct_title .name:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 10px;
    left: 0;
    bottom: 0;
    background-color: #3CCBDB;
    opacity: 0.5;
    z-index: -1;

}
.side_menu {
    flex-shrink: 0;
    position: relative;
    width: 260px;
    margin-bottom: 0;
    margin-right: 60px;
} 
.side_menu > .sticky {
    position: sticky;
    top: 180px;
    left: 0;
}
.side_menu > .sticky > .title_ {
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 21px;
}
.side_menu .profile_area {
    margin-bottom: 33px;
}
.side_menu .menu {}
.side_menu .menu li + li {
    margin-top: 10px;
}
.side_menu .menu a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 55px;
    padding: 0 20px;
    color: #666;
    border-radius: 10px;
    background-color: #F9F9F9;
    background-image: url(../img/icon/tool/aside_right.svg);
    background-repeat: no-repeat;
    background-position: right 20px center;
}
.side_menu .menu .active a {
    color: #fff;
    background-color: #3CCBDB;
    background-image: url(../img/icon/tool/aside_right_w.svg);
}

.content + .side_menu {
    width: 360px;
    margin-left: 70px;
}

/* 서브 페이지 텝 */
.sub_page_tab ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px solid #CBCFE8;
}
.sub_page_tab ul li {
    margin-bottom: -1px;
}
.sub_page_tab ul li + li {
    margin-left: 5px;
}
.sub_page_tab a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 220px;
    height: 60px;
    text-align: center;
    color: #666;
    border: 1px solid #F5F5FA;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
    background-color: #F5F5FA;
}
.sub_page_tab .active a {
    font-weight: 500;
    color: #3CCBDB;
    border-color: #CBCFE8;
    border-bottom-color: #fff;
    background-color: #fff;
}

/* div tabel */
.divTable dl {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
.divTable .thead_ {
    border-bottom: 1px solid #EEEEEE;
}
.divTable .tr_ {
    border-bottom: 1px solid #EEEEEE;
}
.divTable .empty {
    width: 100%;
    text-align: center;
    margin-top: 120px;
    color: #aaa;
}

.divTable dl dt,
.divTable dl dd {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0 17px;
    height: 60px;
}

.divTable .subject {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-grow: 1;
}
.divTable .subject p,
.divTable .subject a {
    max-width: 500px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.divTable .subject a:hover {
    text-decoration: underline;
}
.divTable .subject.new:after {
    content: "NEW";
    color: #16B9CB;
    background-color: #F7E948;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 6px;
    border-radius: 20px;
    margin-left: 10px;
}


/* 찜 목록 */
.favorite_list {
    padding: 30px 0;
}
.favorite_list ul {
    display: flex;
    justify-content: stretch;
    align-items: flex-start;
    flex-wrap: wrap;
}
.favorite_list ul li {
    padding: 30px 0;
    margin-bottom: 0;
    flex: 0 1 250px;
}
.favorite_list ul li + li {
    margin-left: 40px;
}
.favorite_list ul li:nth-child(4n+1) {
    margin-left: 0;
}

.meno_area {
    margin-top: 15px;
    padding: 10px;
    padding-top: 20px;
    border: 1px solid #E7E7E7;
    border-radius: 15px;
}
.meno_area .field {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-left: 10px;
}
.meno_area .field + .field {
    margin-top: 10px;
}
.meno_area textarea {
    margin-top: 20px;
    background-color: #F5F5FA;
    border-radius: 10px;
    border: none;
    width: 100%;
    height: 100px;
    resize: none;
    padding: 9px 19px;
    font-size: 14px;
}


/* 프로필 수정 */
.myprofile_ {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.myprofile_ .btn_ {
    color: #444;
    border-color: #444;
    padding: 15px 20px;
    font-size: 14px;
}
.myprofile_ .btn_:hover {
    background-color: #3CCBDB;
    border-color: #3CCBDB;
    color: #fff;
}
.myprofile_ .profile_card  {
    display: flex;
    justify-content: flex-start;
    align-items: center;
} 
.profile_card .profile_img {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #EFEFEF;
    background-image: url(../img/profile/dump.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 38px;
    margin-right: 36px;
}
.profile_card .profile_img img {
    width: 100%;
    height: 100%;
    border-right: 50%;
}
.profile_card .profile_img .modifyBtn {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 3px 3px 6px rgba(174,174,174,0.16);
    -webkit-box-shadow: 3px 3px 6px rgba(174,174,174,0.16);
    background-image: url(../img/icon/tool/modify.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}
.profile_card .profile_img .modifyBtn input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    opacity: 0;
}
.profile_card .profile_img .modifyBtn input + label {
    position: absolute;
    left: 0;
    top : 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    cursor: pointer;
}

.profile_card .info_ > div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.profile_card .info_ > div + div {
    margin-top: 5px;
}
.profile_card .info_ > div h5 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 10px;
}
.profile_card .info_ p {
    color: #3CCBDB;
    font-size: 13px;
}
.profile_card .info_ a:hover {
    text-decoration: underline;
}
.profile_card .info_ .email {
    color: #999;
    font-size: 13px;
}

.profile_modify{
    padding: 30px;   
}

.profile_modify .myprofile_ {
    margin-bottom: 20px;
}
.profile_modify .mofidy_area .field_area .field + .field  {
/*        margin-top: 50px;*/
}
.profile_modify .check_area .checkbox_:not(.icon){
    margin-right: 15px;
}
.profile_modify .check_area .checkbox_:not(.icon):last-child{
margin-right: 0;
}
.profile_modify .check_area .checkbox_:not(.icon) label{
padding: 10px 20px;
}
.profile_modify .flex_col{
display: flex;
flex-direction: column;
gap:15px;
}



/* 포인트 출금 */
.point_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 140px;
    background-color: #F2FDFF;
    border-radius: 15px;
    padding: 0 49px;
    margin-bottom: 50px;
}
.point_area > div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.point_area > div:first-child {
    font-size: 20px;
}
.point_area > div:first-child img {
    margin-right: 28px;
}
.point_area > div:first-child b:nth-child(3) {
    color: #3CCBDB;
    margin-left: 5px;
}

.point_area .btn_ {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 180px;
    height: 50px;
    border-right: 5px;
    border: none;
    color: #fff;
    background-color: #3CCBDB;
    font-size: 16px;
    font-weight: 500;
}
.point_area .btn_  img {
    margin-right: 10px;
}
.point_area .point_ {
    margin-right: 48px;
    font-size: 14px;
}
.point_area .point_ p:last-child {
    font-size: 40px;
    font-weight: 700;
    font-family: 'Roboto';
    letter-spacing: -0.3px;
    line-height: 1em;
    color: #3CCBDB;
}

.withdraw_history {}
.withdraw_history .tool {
    margin-bottom: 20px;
    padding-top: 25px;
}
.withdraw_history .tool h1 {
    font-size: 20px;
    font-weight: 700;
}
.withdraw_history ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 90px;
    border-radius: 15px;
    border: 1px solid #E7E7E7;
    letter-spacing: -0.3px;
    padding: 0 40px;
}
.withdraw_history ul li + li {
    margin-top: 10px;
}

.withdraw_history .details_ {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #888;
}
.withdraw_history .details_ span {
    font-size: 16px;
    padding: 5px 10px;
    border-radius: 30px;
    color: #ddd;
    border: 1px solid currentColor;
    margin-right: 15px;
}
.withdraw_history .details_ div:last-child {
    font-size: 18px;
    font-weight: 700;
    color: #444;
    margin-left: 53px;
}

.withdraw_history .point_ {
    text-align: right;
    font-size: 14px;
}
.withdraw_history .point_ p:first-child {
    font-size: 18px;
    font-weight: 700;
}
.withdraw_history .plus .details_ span,
.withdraw_history .plus .point_ {
    color: #3CCBDB;
}

.withdraw_history .minus .details_ span,
.withdraw_history .minus .point_ {
    color: #FF7474;
}
.withdraw_history + .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 70px 0;
}
.withdraw_history .empty {
    text-align: center;
    margin-top: 120px;
    color: #aaa;
}


/* modal */
/* 출금 */
#widthdraw .modal-layer {
    max-width: 600px;
    height: 90vh;
}
#widthdraw .modal-layer .content {
    flex-grow: 1;
    overflow-y: scroll;
    height: calc(100% - 70px);
}
#widthdraw .modal-layer .content::-webkit-scrollbar {
    width: 10px;
    background-color: transparent;
}
#widthdraw .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: #9499B4;
    border: 5px solid #fff;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
}
#widthdraw .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
#widthdraw .field_area .field.top_ {
    margin-top: 30px;
}
#widthdraw .field_area input + .check_wrap {
    /* margin: 20px 0; */
}
#widthdraw .point_ {
    /* padding-left: 127px;
    margin-top: 5px; */
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#widthdraw .point_ b {
    color: #16B9CB;
    font-family: 'Roboto';
    margin-left: 12px;
}
#widthdraw .notice_ {
    padding: 15px;
    border-radius: 10px;
    background: #F9F9F9;
    color: #666;
}
#widthdraw .notice_ h1{
    color: #666;
    font-size: 14px;
    font-weight: 500;
    padding-bottom: 10px;
}
#widthdraw .notice_ .desc {
    color: #888;
    line-height: 1.5;
    font-size:14px;
}

#widthdraw .field_area{
    display: flex;
    flex-direction: column;
    gap:20px;
}
#widthdraw .field_area .field{
    flex-direction: column;
    align-items: flex-start;
    gap:10px;
}
#widthdraw .field_area .field label{
    font-weight: 500;
    font-size: 16px;
    align-items: center;
}
#widthdraw .jumin_cont .item{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
#widthdraw .jumin_cont .item label{
    font-weight: 400;
}
#widthdraw .item .check_wrap{
    display: flex;
    gap: 20px;
}
#widthdraw .pb_save_cont{
    padding: 0;
}
#widthdraw .field_area .field .pb_save_cont label{
    font-weight: 400;
}
    
#widthdraw input{
    width: 100%;
    height: auto;
    padding: 7px 12px;
    background: none;
    border: 1px solid var(--line, #E4E8EE);
}
#widthdraw .body{
    overflow-y: auto;
}


.notice_.bank .item_title .sub_desc{
    background: #F4F5F9;
    border-radius: 10px;
    font-weight: 400;
    margin-bottom: 10px;
    height: 0;
    max-height: 200px;
    overflow: hidden;
    margin-top: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    padding-bottom: 0;
    color: #444;
    transition: all .3s;
    font-size: 14px;
}
.notice_ .item_title .sub_desc.open{
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow:auto;
}
#widthdraw .notice_.bank .accordion{
    display: flex;
    justify-content: space-between;
    cursor: pointer;
    color: #888;
    padding-top: 10px;
    font-size: 14px;
    align-items: center;
    gap:10px;
}
#widthdraw .notice_.bank .item_title .sub_desc{
    font-size: 14px;
    color:#888;
    line-height: 1.4;
}
#widthdraw .notice_.bank .item_title .sub_desc.open{
    height: 120px;

}
#widthdraw .select__{
    border: 1px solid var(--line, #E4E8EE);
    height: 40px;
}

@media (max-width:800px){
    #widthdraw .field_area .field{
        gap:5px;
    }
    #widthdraw .field_area .field label{
        font-size: 14px;
    }
    #widthdraw input{
        font-size: 12px;
        height: 40px;
    }
    #widthdraw .notice_ h1{
        font-size: 12px;
    }
    #widthdraw .notice_.bank .accordion{
        font-size: 12px;
    }
    #widthdraw .select__{
        width: 100%;
        height: 40px;
    }
    #widthdraw .notice_.bank .item_title .sub_desc{
        font-size: 12px;
    }
}

/* 회원 탈퇴 */
#quit .modal-layer {
    max-width: 600px;
    height: 90vh;
}
#quit .modal-layer .content {
    flex-grow: 1;
    overflow-y: scroll;
    height: calc(100% - 70px);
}
#quit .modal-layer .content::-webkit-scrollbar {
    width: 15px;
    background-color: transparent;
}
#quit .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: #9499B4;
    border: 5px solid #fff;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
}
#quit .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
#quit .field_area .field.top_ {
    margin-top: 30px;
}
#quit .field_area input + .check_wrap {
    margin: 20px 0;
}
#quit .point_ {
    padding-left: 127px;
    margin-top: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#quit .point_ b {
    color: #16B9CB;
    font-family: 'Roboto';
    margin-left: 12px;
}
#quit .notice_ {
    margin-top: 20px;
}
#quit .notice_ .desc {
    color: #666;
}

/* 캠페인 신청 */
#apply .modal-layer {
    max-width: 600px;
    height: 90vh;
}

#apply .modal-layer .content {
    flex-grow: 1;
    overflow-y: scroll;
    height: calc(100% - 70px);
}
#apply .modal-layer .content::-webkit-scrollbar {
    width: 15px;
    background-color: transparent;
}
#apply .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: #9499B4;
    border: 5px solid #fff;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
}
#apply .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
#apply #rv_msg{
    min-height: 108px;
}

#apply .field_area .field.top_ {
    margin-top: 30px;
}
#apply .field_area input + .check_wrap {
    margin: 20px 0;
}
#apply .point_ {
    padding-left: 127px;
    margin-top: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#apply .point_ b {
    color: #16B9CB;
    font-family: 'Roboto';
    margin-left: 12px;
}
#apply .notice_ {
    padding: 25px 20px;
    margin-top: 10px;
}
#apply .notice_ h2{
    padding-bottom: 15px;
    font-size: 16px;
    color: #444;
    line-height: 1;
    font-weight: 500;
    
}
#apply .notice_ .desc {
    color: #666;
}

#apply .notice_ .desc_cont{
    display: flex;
    flex-direction: column;
    gap: 10px;
    color: #666;
    font-size: 14px;
}


#apply .notice_ .desc_cont .item .item_title .sub_desc{
background: #fff;
border-radius: 10px;
font-weight: 400;
margin-bottom: 10px;
height: 0;
max-height: 200px;
overflow: hidden;
margin-top: 0;
padding-left: 10px;
padding-right: 10px;
padding-top: 0;
padding-bottom: 0;
color: #444;
transition: all .3s;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc.open{
margin-top: 10px;
padding-top: 10px;
padding-bottom: 10px;
overflow:auto;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc.open.sub_1{
height: 140px;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc.open.sub_2{
height: 120px;
}
.notice_.bank.item .item_title .sub_desc .circle{
background: #444;
}
#apply .notice_ .desc_cont .item .item_desc .red_color .sub_desc .circle{
background: #444;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc.open::-webkit-scrollbar {
display: none;
}
.notice_.bank .item_title .sub_desc p{
position: relative;
padding-left: 20px;
font-size: 14px;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc p{
position: relative;
padding-left: 20px;
}
#apply .notice_ .desc_cont .item .item_title .sub_desc p.depth{
padding-left: 30px;
}
#apply .notice_ .desc_cont .item .item_desc{
    display: flex;
    flex-direction: column;
    gap:5px;
    font-weight: 400;
    font-size: 14px;
}

#apply .notice_ .desc_cont .item .item_desc p{
padding-left: 20px;
position: relative;
}

.notice_.bank .item_title .circle{
border-radius: 50%;
display: inline-block;
width: 4px;
height: 4px;
background: #666;
position: absolute;
top: 8px;
left: 10px;
}

#apply .notice_ .desc_cont .item .circle{
border-radius: 50%;
display: inline-block;
width: 4px;
height: 4px;
background: #666;
position: absolute;
top: 8px;
left: 10px;
}
#apply .notice_ .desc_cont .item .border_circle{
border-radius: 50%;
display: inline-block;
width: 4px;
height: 4px;
border: 1px solid #666;
position: absolute;
top: 8px;
left: 20px;
}
#apply .notice_ .desc_cont .red_color{
color: var(--red-200-color);
}
#apply .notice_ .desc_cont .item .item_desc .red_color .circle{
background: var(--red-200-color);
}


#apply .notice_ .desc_cont .accordion{
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
font-size: inherit;
}


#apply .notice_ .desc_cont .item .lawfirm_logo_cont{
display: flex;
gap:10px;
padding: 8.5px 10px;
align-items: center;
background: #fff;
border-radius: 10px;
}
#apply .notice_ .desc_cont .item .lawfirm_logo_cont img{
max-width: 150px;
}

@media (max-width:800px){
#apply .notice_ .desc_cont .item .lawfirm_logo_cont img{
    max-width: 70px;
}
#apply .notice_ .desc_cont .item .lawfirm_logo_cont div{
    font-size: 8px;
}
}



#find .modal-layer {
    max-width: 600px;
}
#find .modal-layer .notice_ {
    margin-top: 20px;
}


/* 네이버 로그인 관련 모달 */
#naver_help .modal-layer{
max-width: 580px;
}
#naver_help .modal-layer .notice{
padding-top: 20px;
}
#naver_help .modal-layer .btn_area{
display: flex;
gap:31px;
padding-bottom: 0;
margin-top: 50px;
}
#naver_help .modal-layer .btn_area a{
width: 100%;
height: auto;
padding: 13px 0;
max-width: 134px;
border-radius: 5px;
}
#naver_help .modal-layer .head{
padding: 30px;
height: auto;
border-bottom: 0;
padding-bottom: 0;
}
#naver_help .modal-layer .content{
padding: 25px 30px;
}
#naver_help .modal-layer .closer{
background-image: url(../img/icon/tool/close.svg);
right: 30px;
top: 30px;
margin: 0;
width: 20px;
height: 20px;
/*    transform: translateY(50%);*/
}
@media(max-width:800px){
#naver_help .modal-layer .closer{
    top: 27px;
    width: 14px;
    height: 14px;
}
#naver_help .modal-layer .btn_area{
    margin-top: 30px;
}
}

/* 알림함 */
.notice_lsit {}
.notice_lsit .tool {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 15px;
}
.notice_lsit .tool .btn_ {
    padding: 7px 10px;
}
.notice_lsit .tool .btn_:hover {
    background-color: #3CCBDB;
    border-color: #3CCBDB;
    color: #fff;
}
.notice_lsit .list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 76px;
    padding: 20px 40px;
    padding-left: 100px;
    border-radius: 15px;
    border: 1px solid #E7E7E7;
    background-image: url(../img/icon/fe/letter.svg);
    background-repeat: no-repeat;
    background-position: left 40px center;
}
.notice_lsit .list li + li {
    margin-top: 15px;
}
.notice_lsit .list .msg {
    position: relative;
    flex-grow: 1;
    padding-right: 20px;
    white-space: pre-wrap;
}
.notice_lsit .list .msg:before {
    content: "";
    position: absolute;
    left: -8px;
    top: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #FF7474;
}
.notice_lsit .list .date {
    flex-shrink: 0;
    color: #888;
}
.notice_lsit .list li.open {
    background-image: url(../img/icon/fe/letter_a.svg);
}
.notice_lsit .list li.open .msg:before {
    display: none;
}

.notice_lsit .empty {
    text-align: center;
    margin-top: 120px;
    color: #aaa;
}


/* 간편 로그인 */
.auto_chain ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.auto_chain ul li {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border: 1px solid #E4E4E4;
    border-radius: 10px;
}
.auto_chain ul li + li {
    margin-left: 30px;
}
.auto_chain ul li > div {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    height: 60px;
    font-weight: 500;
}
.auto_chain ul li .icon {
    width: 60px;
    padding: 0;
    border-right: 1px solid #e4e4e4;
}
.auto_chain ul li .state {
    border-right: 1px solid #e4e4e4;
    display: none;
    background-color: #F9F9F9;
    color: #999;
}
.auto_chain ul li .chainBtn {
    cursor: pointer;
}
.auto_chain ul li .chainBtn:before {
    content: "연결하기";
}

.auto_chain ul li.active .state {
    display: flex;
}
.auto_chain ul li.active .chainBtn:before {
    content: "연결해제";
}


/* 고객센터 */
.customer_tool {
    background-color: #F9F9F9;
    border-radius: 15px;
    margin-bottom: 20px;
}
.customer_tool .search_ {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 640px;
    height: 110px;
    margin: 0 auto;
}
.customer_tool .search_ > div:first-child {
    flex-shrink: 0;
    margin-right: 30px;
    font-size: 18px;
    font-weight: 700;
    flex: 1;
}
.customer_tool .search_ input {
    flex-grow: 1;
    border: none;
    height: 50px;
    padding: 0 20px;
    border-radius: 5px;
}
.customer_tool .search_ .submitBtn {
    flex-shrink: 0;
    box-shadow: none;
    width: 148px;
    height: 50px;
    font-size: 16px;
    font-weight: 500;
    border-radius: 5px;
    margin-left: 10px;
}

/* faq */
.faq_tab_area {
    margin: 30px 0;
}
.faq_tab_area ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-radius: 50px;
    background-color: #F9F9F9;
}
.faq_tab_area ul li {
    flex: 1;
    cursor: pointer;
}
.faq_tab_area ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    text-align: center;
    background-color: #F9F9F9;
    border-radius: 50px;
    color: #888;
}
.faq_tab_area ul li.active a {
    color: #fff;
    font-weight: 700;
    background-color: #3CCBDB;
    box-shadow: 0px 3px 10px rgb(60 203 219 / 30%);
    -webkit-box-shadow: 0px 3px 10px rgb(60 203 219 / 30%);
}

.faq_his_area ul {
    border-top: 1px solid #222222;
}
.faq_his_area li {
    cursor: pointer;
    border-bottom: 1px solid #eee;
}
.faq_his_area li.non_result{
padding: 80px 0 ;
text-align: center;
cursor: auto;
}
.faq_his_area .subject_ {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 80px;
}
.faq_his_area .subject_ span:first-child {
    flex-shrink: 0;
    font-size: 14px;
    color: #16B9CB;
    width: 130px;
    padding: 0 20px;
}
.faq_his_area .subject_ .Q,
.faq_his_area .drop_ .A {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #F5F5FA;
    color: #16B9CB;
    margin-right: 20px;
}
.faq_his_area .subject_ .Q:before {
    content: "Q";
    font-weight: 700;
    padding-bottom: 5px;
}
.faq_his_area .drop_ .A {
    background-color: #16B9CB;
    color: #fff;
}
.faq_his_area .drop_ .A:before {
    content: "A";
    font-weight: 700;
    padding-bottom: 5px;
}
.faq_his_area .subject_ .conetnet {
    flex-grow: 1;
    padding-right: 50px;
    font-size: 18px;
    color: #222;
}
.faq_his_area .subject_ .conetnet > p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;  }

.faq_his_area .subject_ .dropBtn {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background-image: url(../img/icon/tool/drop_down.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin-right: 20px;
}
.faq_his_area .active .subject_ .dropBtn {
    background-image: url(../img/icon/tool/drop_up.svg);
}
.faq_his_area .drop_ {
    display: none;
    margin-bottom: 30px;
}
.faq_his_area .drop_  > div {
    background-color: #F9FDFF;
    border-radius: 15px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px;
    padding-left: 130px;
}
.faq_his_area .drop_ .content {
    font-size: 14px;
    color: #666;
}

/* 문의하기 */
.customer_tool .Inquire_ {
    display: flex;
    padding: 15px 30px;
    flex-direction: column;
    gap:15px;
}

.customer_tool .Inquire_ div:last-child{
display: flex;
gap:20px;
}
.customer_tool .Inquire_ .submitBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 148px;
    height: 50px;
    box-shadow: none;
    font-size: 16px;
}

.divTable {
    margin-top: 30px;
    border-top: 1px solid #222;
}

.Inquire_his_area dl dt:nth-child(1),
.Inquire_his_area dl dd:nth-child(1) {
    width: 80px;
}
.Inquire_his_area dl dt:nth-child(2),
.Inquire_his_area dl dd:nth-child(2) {
    width: 170px;
}
.Inquire_his_area dl dd:nth-child(2) {
    color: #9499B4;
}
.Inquire_his_area dl dt:nth-child(3),
.Inquire_his_area dl dd:nth-child(3) {
    flex-grow: 1;
}
.Inquire_his_area dl dd:nth-child(3) {
    justify-content: flex-start;
}
.Inquire_his_area dl dt:nth-child(4),
.Inquire_his_area dl dd:nth-child(4) {
    width: 110px;
} 
.Inquire_his_area dl dd:nth-child(4) {
    color: #999;
}
.Inquire_his_area dl dt:nth-child(5),
.Inquire_his_area dl dd:nth-child(5) {
    width: 130px;
}
.Inquire_his_area dl dt:nth-child(6),
.Inquire_his_area dl dd:nth-child(6) {
    width: 80px;
} 

.Inquire_his_area .state_ {
    padding: 5px 14px;
    border-radius: 22px;
    color: #3CCBDB;
    border: 1px solid currentColor;
}

.Inquire_his_area .com {
    cursor: pointer;
}
.Inquire_his_area .com .state_ {
    color: #9499B4;
}
.Inquire_his_area .drop_ {
    display: none;
}

.answer_area {
    padding-top: 10px;
    padding-bottom: 20px;
    border-top: 1px solid #EEEEEE;
}
.answer_area .request_,
.answer_area .response_ {
    padding: 20px;
    padding-bottom: 30px;
    border-radius: 10px;
} 
.answer_area .response_ {
    background-color: #F9F9F9;
}
.answer_area .writer_ {
    display: flex;
    justify-content : flex-start;
    align-items: center;
}
.answer_area .writer_ .profile_ {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    margin-right: 10px;
    background-color: #EFEFEF;
    background-image: url(../img/profile/dump.svg);
    background-repeat: no-repeat;
    background-position: center;
}
.answer_area .writer_ .profile_ > img {
    width: 100%;
    height: 100%;
}
.answer_area .writer_ .name {
    font-weight: 500;
    margin-right: 20px;
} 
.answer_area .writer_ .date {
    font-size: 13px;
    color: #888;
}
.answer_area .comment_ {
/*        white-space: pre-line;*/
    padding-left: 44px;
    margin-top: 12px;
}
.answer_area .file_{
    padding-left: 44px;
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    background-color: #f4f5f999;
    padding: 20px;
    margin: 20px 44px;
    border-radius: var(--border-round-L);
    gap:5px;
}


/* 문의하기 */
.Inquire_area {
    padding-top: 20px;
    border-top: 1px solid #222;
}
.Inquire_area .btn_area {
    margin-top: 20px;
    padding-top: 50px;
    border-top: 1px solid #ddd;
}
.Inquire_area .btn_area .btn {
    border-color: #ddd;
    margin-left: 15px;
    font-weight: 700;
    color: #9499B4;
    background-color: #F5F5FA;
    box-shadow: 0px 10px 20px rgb(186 186 186 / 20%);
    -webkit-box-shadow: 0px 10px 20px rgb(186 186 186 / 20%);
}
.Inquire_area .select__wrap {
    max-width: 256px;
}
.Inquire_area .editor_ {
    align-items: flex-start;
}
.Inquire_area .editor_ > label,
.Inquire_area .top_ > label {
/*        padding-top: 18px;*/
/*        padding-top: 18px;*/
}
.Inquire_area .editor_ textarea {
    min-height: 315px !important;
}
.uploader {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.uploader .inp_ {
    position: relative;
    background-color: #F5F5FA;
    border-radius: 10px;
    border: none;
    padding: 0 20px;
    width: 410px;
    min-height: 60px;   
}
.uploader .inp_ input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.uploader .uploadBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 30px;
    margin-left: 10px;
    color: #222;
    border: 1px solid var(--line-color);
    border-radius: 5px;
    background-color: #fff;
    cursor: pointer;
}
.uploader + .files {
    font-size: 14px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap:10px;
}
.uploader + .files .item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 10px;
}
.uploader + .files .item:first-child{
margin-top: 0;
}
.uploader + .files .item .close {
    max-width: 26px;
    height: 26px;
    padding: 0;
    margin-left: 10px;
    min-height: inherit;
    flex-grow: inherit;
    background-color: transparent;
    background-image: url(../img/icon/tool/xBtn.svg);
    background-repeat: no-repeat;
    cursor: pointer;
}
.uploader + .files .file-item{
display: flex;
gap:10px;
align-items: center;
}
.uploader + .files .file-item .delete-file {
    width: 15px;
    height: 15px;
    padding: 0;
    min-height: inherit;
    flex-grow: inherit;
    background-color: transparent;
    background-image: url(../img/icon/tool/xBtn.svg);
    background-repeat: no-repeat;
    background-size: cover;
    border: none;
    cursor: pointer;
}


/* 공지사항 */
.customer_his_area {}
.customer_his_area dl dt:nth-child(1),
.customer_his_area dl dd:nth-child(1) {
    width: 80px;
}
.customer_his_area dl dt:nth-child(2),
.customer_his_area dl dd:nth-child(2) {
    width: 150px;
}
.customer_his_area dl dd:nth-child(2) {
    color: #9499B4;
}
.customer_his_area dl dt:nth-child(3),
.customer_his_area dl dd:nth-child(3) {
    flex-grow: 1;
}
.customer_his_area dl dd:nth-child(3) {
    justify-content: flex-start;
}
.customer_his_area dl dt:nth-child(4),
.customer_his_area dl dd:nth-child(4) {
    width: 110px;
} 
.customer_his_area dl dt:nth-child(5),
.customer_his_area dl dd:nth-child(5) {
    width: 130px;
}
.customer_his_area dl dd:nth-child(4),
.customer_his_area dl dd:nth-child(5) {
    color: #999;
}

/* 공지 상세 */
.customer_details .head {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80px;
    padding: 0 30px;
    border-top: 1px solid #222;
}

.customer_details .subject,
.customer_details .tool {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.customer_details .subject {
    flex-grow: 1;
}
.customer_details .subject span {
    flex-shrink: 0;
    font-size: 14px;
    color: #9499B4;
    margin-right: 28px;
}
.customer_details .subject h1 {
    font-size: 24px;
    font-weight: 400;
    max-width: 800px;
}
.customer_details .tool {
    flex-shrink: 0;
}
.customer_details .tool .date,
.customer_details .tool .views {
    background-repeat: no-repeat;
    background-position: left center;
    color: #999;
    padding-left: 34px;
}
.customer_details .tool .date {
    background-image: url(../img/icon/fe/calendar.svg);
}
.customer_details .tool .views {
    background-image: url(../img/icon/fe/eye.svg);
    margin-left: 30px;
}


.customer_details .conetent{
    padding: 50px 0;
    color: #666;
    min-height: 420px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
.customer_details .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 35px;
    margin-bottom: 70px;
}
.customer_details .btn_area .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 60px;
    border-radius: 10px;
    border: 1px solid #222;
    color: #222;
}
.customer_details .btn_area .btn img {
    margin-right: 15px;
}


/* 캠페인 상세 */
.smartstore {
    padding: 2px 10px;
    color: #40A436;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.coupang {
    padding: 2px 10px;
    color: #F7552F;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.coupang_wow {
    padding: 2px 10px;
    color: var(--primary-color);
    border: 1px solid currentColor;
    display: inline-block;
    border-radius: 4px;
    font-size: 12px;
    position: absolute;
    left: 10px;
    top: 10px;
    background: #fff;
    font-weight: 500;
    z-index: 4;
}
.gmarket {
    padding: 2px 10px;
    color: #00C01E;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.auction {
    padding: 2px 10px;
    color: #E40718;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.elevenst {
    padding: 2px 10px;
    color: #E1002A;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.musinsa {
    padding: 2px 10px;
    color: #000000;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.idus {
    padding: 2px 10px;
    color: #F7772E;
    border: 1px solid currentColor;
    border-radius: 4px;
}
.delivery {
  padding: 2px 10px;
  color: #db3cdbc7;
  border: 1px solid currentColor;
    border-radius: 4px;
}
.mapNaver {
  padding: 2px 10px;
  color: #40A436;
  border: 1px solid currentColor;
    border-radius: 4px;
}
.mapKakao {
  padding: 2px 10px;
  color: #fdf918;
  border: 1px solid currentColor;
    border-radius: 4px;
}
.mapGoogle {
  padding: 2px 10px;
  color: #E40718;
  border: 1px solid currentColor;
    border-radius: 4px;
}
.apply_area {
    background-color: #ECF9FB;
    border-radius: 15px;
    padding: 26px 30px;
    margin-top: 15px;
}
.apply_area dl {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 14px;
    margin-bottom: 20px;
}
.apply_area dl.bet_option{
}
.apply_area .mileage{
border: 1px solid var(--primary-color);
border-radius: 10px;
display: block;
background: #fff;
padding: 19px 10px;
text-align: center;
line-height: 1;
}
.apply_area .mileage input{
width: auto;
padding: 0;
height: auto;
line-height: 1;
display: inline-block;
width: fit-content;
max-width: 30px;
text-align: right;
border: none;
}
.apply_area .bet_select_cont{
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 10px;
padding-top: 10px;
}
.apply_area .bet_select_cont button{
background: var(--primary-color);
border-color: var(--primary-color);
border-radius: 8px;
color: #fff;
font-size: 12px;
padding: 11px;
padding: 10px 0;
}
.apply_area .bet_select_cont button.reset{
background: #fff;
color: var(--primary-color);
}
.apply_area .bet_select_cont button.reset img{
max-width: 15px;
}

.apply_area .has_mileage_cont{
font-size: 12px;
color: #666;
font-weight: 500;
padding-top: 10px;
display: flex;
align-items: center;
justify-content: flex-end;
line-height: 1;
}
.apply_area .has_mileage_cont .has_mileage{
padding: 0 3px;
}
.apply_area dl dd:first-child {
    flex-shrink: 0;
    width: 120px;
    color: #16B9CB;
}
.apply_area .option_ {
    padding-top: 20px;
    border-top: 1px solid #CAEFF3;
}
.apply_area .option_.bet{
margin-top: 30px;
}

.apply_area .tip_cont{
background: #fff;
border: 1px solid var(--primary-color);
border-radius: 10px;
padding: 15px;
font-size: 12px;
display: flex;
gap: 8px;
margin-top: 20px;
color: #444;
}
.apply_area .option_ > label {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
    color: #16B9CB;
}
.apply_area .option_ select {
    width: 100%;
    height: 40px;
    padding: 0 15px;
    border-color: #CAEFF3;
    background-color: #fff;
    color: #666;
    font-size: 14px;
}
.apply_area .option_ select option[disabled] {
    color: #c9c9c9;
  }
.apply_area .btn_area {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 20px;
}
.apply_area .btn_area .submitBtn {
    flex-grow: 1;
    margin-right: 10px;
}
.favBtn {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    border-radius: 10px;
    color: #3CCBDB;
    border: 1px solid #3CCBDB;
    background-color: #fff;
    background-image: url(../img/icon/tool/fav.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
} 
.favBtn.active {
    color: #3CCBDB;
    background-image: url(../img/icon/tool/fav_a.svg);
}
.zzimBtn {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    border-radius: 10px;
    color: #3CCBDB;
    border: 1px solid #3CCBDB;
    background-color: #fff;
    background-image: url(../img/icon/tool/fav.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
} 
.zzimBtn.active {
    color: #3CCBDB;
    background-image: url(../img/icon/tool/fav_a.svg);
}

.shareBtn img {
    margin-right: 10px;
}
.toggle_item {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    background-color: #FFFFFF;
    border-radius: 6px;
    border: 1px solid #eee;
    box-shadow: 0px 5px 10px rgba(0,0,0,0.05);
    -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.05);
    padding: 13px 10px;
    padding-bottom: 25px;
    z-index: 9;
}
.toggle_item .tit {
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.toggle_item .close {
    position: absolute;
    right: 0;
    top: 0;
    width: 46px;
    height: 46px;
    background-image: url(../img/icon/tool/close_s.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.share_list {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 8px;
}
.share_list li + li {
    margin-left: 20px;
}

.linkCopy {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    height: 35px;
    font-size: 12px;
}
.linkCopy input {
    flex-grow: 1;
    width: 100%;
    height: 100%;
    padding: 0 10px;
    border-radius: 3px 0 0 3px;
}
.linkCopy button {
    flex-shrink: 0;
    background-color: #16B9CB;
    border-color: #16B9CB;
    color: #fff;
    padding: 0 12px;
    border-radius: 0 3px 3px 0;
}




.compain_detials {
    position: relative;
    padding-right: 430px;
    min-height: 800px;
}
.compain_detials .side_area {
    position: absolute;
    right: 0;
    top: 0;
    width: 360px;
    height: 100%;
}
.compain_detials .side_area .sticky {
    position: relative;
    top: 0px;
    left: 0;
}



.compain_detials .head {
    position: relative;
    z-index: 0;
}
.compain_detials .head .tool {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 44px;
}
.compain_detials .head .tool a {
    display: flex;
    justify-content: center;
    align-items: center;
}
.compain_detials .head h1 {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 9px;
    padding-right: 90px;
}
.compain_detials .head .comment {
    color: #666;
    font-size: 16px;
}
.compain_detials .head .tag_area {
    margin-top: 27px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #666;
}
.compain_detials .head .tag_area .brand_name{
    flex:1;
}
.compain_detials .head .tag_area .smartstore,
.compain_detials .head .tag_area .coupang,
.compain_detials .head .tag_area .gmarket,
.compain_detials .head .tag_area .auction,
.compain_detials .head .tag_area .elevenst,
.compain_detials .head .tag_area .musinsa,
.compain_detials .head .tag_area .idus,
.compain_detials .head .tag_area span {
    margin-right: 10px;
}
.compain_detials .share_area {
    position: relative;
    padding: 10px 0;
}

.compain_detials .content {
    padding-top: 40px;
/*        margin-bottom: 70px;*/
}

.compain_detials .hide_area .wrap {
    height: 100%;
    overflow: hidden;
}
.compain_detials .hide_area .wrap img {
    width: 100%;
}
.compain_detials .hide_area .moreBtn {
    width: 100%;
    margin-top: 40px;
    background-color: #fff;
    font-size: 16px;
    font-weight: 400;
    border: 1px solid #9499B4;
    border-radius: 5px;
    cursor: pointer;
}
.compain_detials .hide_area .wrap.active {
    height: auto;
}
.compain_detials .hide_area .wrap.active + .moreBtn {
    display: none;
}
.compain_detials .hide_area .wrap .empty_img{
text-align: center;
padding: 50px 0;
}

.compain_detials .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

.side_area .apply_area .btn_area_MO{
display: none;
}
.compain_detials .side_area .sheet_head{
display: none;
}


.compain_detials .btn_area .submitBtn img {
    margin-right: 10px;
}

.compain_detials .guide_area.campaign_ {
    margin-top:40px;
    
}

.compain_detials .guide_area {
    margin-top: 75px;
}
.compain_detials .guide_area > .title {
    text-align: center;
}

.compain_detials .head .details{
    display: flex;
    align-items: center;
    padding-top: 14px;
}
.compain_detials .head .details > div {
margin-top: 0;
padding-left: 15px;
padding-right: 15px;
position: relative;
}
.compain_detials .head .details > div:not(.tag_area){
gap: 20px;
display: flex;
padding-left: 0;
}
.compain_detials .head .details > div::before{
content: "";
display: none;
width: 1px;
height: 18px;
background: #222;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);

}
.compain_detials .head .details > div:first-child{
padding-left: 0;
}
.compain_detials .head .details > div:first-child::before{
background: transparent;
}
.compain_detials .head .details .tag_area p{
display: flex;
gap:5px;
padding-right: 15px;
}
.compain_detials .head .details .tag_area p:last-child{
padding-right: 0;
}
.compain_detials .head .details .tag_area p span{
margin-right: 0;
}
.compain_detials .head .details .count{
color: #222;
}

@media (max-width:800px){
.compain_detials .head .details > div{
    font-size: 12px;
    padding: 0;
/*
    border-right: 1px solid #222;
    padding-right: 2dvw;
*/
}
.compain_detials .head .details > div:last-child{
/*        border-right: none;*/
    gap:15px;
}
.compain_detials .head .details > div.PC_content{
    display: none;
}
.compain_detials .head .details > div::before{
    display: none;
}
}

.guide_area .guide_list {
/*
    margin-top: 17px;
    border-top: 1px solid #222;
*/
    margin-bottom: 20px;
}
.guide_area.campaign_ .guide_list li{
    border-top: 1px solid #ddd;
}
 .guide_area .guide_list li {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 40px 0;
    border-bottom: 1px solid #ddd;
}
.guide_area .guide_list li h5 {
    flex-shrink: 0;
    width: 210px;
    display: flex;
    gap:5px;
}
.guide_area .guide_list li .text_ {
    color: #666;
    max-width: 766px;
    word-break: break-all;
    width: 100%;
}

.guide_area .guide_notice {
    background-color: #F5F5FA;
    border-radius: 15px;
    padding: 55px 67px;
}
.guide_area .guide_notice > h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 20px;
    margin-bottom: 10px;
}
.guide_area .guide_notice > h1 .exmark {
    margin-right: 15px;
}
.guide_area .guide_notice .desc {
    /* white-space: pre-line; */
    color: #454D56;
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.guide_area .guide_notice .desc .item{
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.guide_area .guide_notice .number_list{
    padding-left: 30px;
}
.guide_area .guide_notice .number_list li{
    list-style: decimal;
}

.guide_area .guide_notice .disc{
    padding-left: 30px;
}
.guide_area .guide_notice .disc li{
    position: relative;

}
.guide_area .guide_notice .disc li::before{
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #454D56;
    border-radius: 50%;
    position: absolute;
    left: -15px;
    top: 10px;
    
}

@media (max-width:800px){
    .guide_area .guide_notice .disc{
        padding-left: 20px;
    }
    .guide_area .guide_notice .disc li::before{
        left: -10px;
        top: 7px;
    }
    .guide_area .guide_notice .number_list{
        padding-left: 20px;
    }
}

.guide_area .mission_icon{
max-width: 35px;
min-height: 35px;
max-height: 35px;
}
.icon_box img.mission_icon[title]{
border-radius: 10px;
padding: 5px;
}
.icon_box img.mission_icon[title='글자수']{
background: #EEEEEE;
}
.icon_box img.mission_icon[title='사진']{
background: #FFF4E2;
}
.icon_box img.mission_icon[title='동영상']{
background: #FFE2FD;
}
.icon_box img.mission_icon[title='구매 링크']{
background: #E2EDFF;
}
.icon_box img.mission_icon[title='링크 삽입']{
background: #E2FFF2;
}
.icon_box img.mission_icon[title='지도 링크']{
background: #E2FFF2;
}
.icon_box img.mission_icon[title='인스타브랜드계정']{
background: #F6E2FF;
}

.guide_area .icon_box{
display: flex;
gap:20px;
padding-bottom: 20px;
}

.guide_background{
padding: 25px 20px;
border-radius: 10px;
background: #ECF9FB;
}

.guide_desc .modal_shop_url{
border-radius: 5px;
color: #3CCBDB;
border: 1px solid #3CCBDB;
background:#FFF;
line-height: 1;
width: 100%;
text-align: center;
cursor: pointer;
display: flex;
padding: 12.5px;
justify-content: center;
gap: 10px;
margin-top: 10px;
}
.guide_desc .modal_shop_url.customBtn_p{
width: auto;
display: inline-block;
}

.guide_area .icon_box .icon_item{
display: flex;
flex-direction: column;
align-items: center;
gap:10px;
font-size: 16px;
line-height: 1;
font-weight: 700;
}
.guide_area .guide_cont{
font-size: 13px;
display: flex;
flex-direction: column;
gap:20px;
padding-bottom: 25px;
}
.guide_area .guide_cont:last-child{
padding-bottom: 0;
}
.guide_area .guide_cont:nth-of-type(2){
margin-top: 0;
}

.guide_area .info_box{
color: #666;
display: flex;
gap:10px;
flex-direction: column;
padding-top: 25px;
}
.guide_area .info_box .head_text{
flex: 1;
color: #454D56;
display: flex;
align-items: center;
gap: 10px;
font-size: 16px;
font-weight: 700;
}
.guide_area .info_box:first-child{
padding-top: 0;
}
.guide_area .info_box div img{
max-width: 22px;
min-height: 22px;
}


.guide_area .info_box div.inner_box{
/*    max-width: 70px;*/
/*    min-width: 70px;*/
flex: 1;
color: #454D56;
display: flex;
align-items: center;
gap: 10px;
font-size: 16px;
font-weight: 700;
}
.guide_area .info_box div.inner_box{
font-size: 16px;
font-weight: 400;
color: #454D56;
border: 1px solid var(--primary-color);
border-radius: 10px;
background: #fff;
padding: 15px;
}

.guide_area .info_box .desc{
margin-top: -5px;
}

.guide_area .tag_desc{
padding-top: 5px;
}

.guide_area .copy_box{
display: flex;
justify-content: center;
gap: 20px;
padding: 15px 0 20px;
}

.guide_area .tag_desc p{
/*    padding-left: 20px;*/
position: relative;
font-size: 12px;
}
/*
.guide_area .tag_desc p::before{
content:"";
display: inline-block;
position: absolute;
top: 50%;
left: 7px;
background: #666;
width: 4px;
height: 4px;
border-radius: 9999px;
transform: translateY(-50%);
}
*/




.toggle_item {
/*        position: fixed;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    -webkit-transform: translate3d(-50%, -50%, 0);*/
    width: 320px;
    margin-top: 15px;
}


/*  인플루언서 프로필 */
.review_details {
    padding: 40px 0;
}

.profile_details {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #FAFAFA;
    border-radius: 15px;
    padding: 30px 40px;
    margin-bottom: 50px;
}
.profile_details .profile_area {
    flex-grow: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-right: 90px;
}
.profile_details .profile_area .profile_ {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.profile_details .profile_area .profile_img {
    margin-right: 25px;
}
.profile_details .profile_area .profile_info {
    flex-flow: column;
    align-items: flex-start;
    margin-top: 0;
}  
.profile_details .profile_area .profile_info h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 20px;
}
.profile_details .profile_area .profile_info img {
    vertical-align: bottom;
    margin-right: 10px;
}
.profile_details .profile_area .profile_info .email {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #999;
    margin-top: 5px;
}
.icon_naver,
.icon_kakao {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 5px;
}
.icon_naver {
    background-image: url(../img/sign/naver.svg);
    background-size: 8px;
}
.icon_kakao {
    background-image: url(../img/sign/kakao.svg);   
    background-size: 12px;
}
.profile_details .profile_area .favBtn {
    width: 120px;
    height: 50px;
    border-radius: 10px;
    padding-left: 54px;
    justify-content: flex-start;
    background-position: left 18px center;
}
.profile_details .profile_area .zzimBtn {
    width: 120px;
    height: 50px;
    border-radius: 10px;
    padding-left: 54px;
    justify-content: flex-start;
    background-position: left 18px center;
}
.profile_details .follower_ {
    flex-shrink: 0;
}
.profile_details .follower_ ul {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.profile_details .follower_ ul li {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.profile_details .follower_ ul li + li {
    margin-left: 50px;
}
.profile_details .follower_ .sns_icon {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #E4E4E4;
    background-color: #fff;
    margin-right: 20px;
}
.profile_details .follower_ a {
    padding-right: 20px;
    background-image: url(../img/icon/tool/blank_.svg);
    background-repeat: no-repeat;
    background-position: right bottom 5px;
    margin-bottom: 5px;
}
.profile_details .follower_ span {
    color: #888;
}
.profile_details .follower_ .value {
    color: #222;
}

.about_area {
    padding-top: 40px;
}
.about_area > .title {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 20px;
}

.about_profile {}
.about_profile dl {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.about_profile dl dl {
    flex: 0 1 50%;
}
.about_profile > dl {
    border-bottom: 1px solid #eee;
}
.about_profile > dl + dl {
    padding-top: 30px;
}
.about_profile dl dd {
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding-bottom: 30px;
}
.about_profile dl dd .tit {
    flex-shrink: 0;
    width: 135px;
}
.about_profile dl dd .desc {
    white-space: pre-line;
    color: #888;
}

.flex_center {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

/* 포트폴리오 */
.about_area .btn_area {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 60px;
}

.list_area > .tool,
.withdraw_history .tool {
    display: flex;
    justify-content: space-between;
    align-items: center;
    word-break: keep-all;
}
.list_area > .tool {
    margin-bottom: 30px;
}
.list_area > .tool .left{
flex-direction: column;
align-items: flex-start;
}
.list_area > .tool > div,
.withdraw_history > .tool > div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.list_area > .tool .count {
    color: #3CCBDB;
}
.list_area > .tool .selectBox__ .list__,
.withdraw_history > .tool .selectBox__ .list__ {
    margin-top: 5px;
    border: 1px solid #3CCBDB;
    border-radius: 8px;
    overflow: visible;
}
.list_area > .tool .selectBox__ .list__ li,
.withdraw_history > .tool .selectBox__ .list__ li {
    width: 100%;
    margin: 0;
    border-radius: 0;
    border: none;
    min-height: auto;
    box-shadow: none;
    align-items: center;
    gap: 8px;
    line-height: 1;
}
.list_area > .tool .selectBox__ .list__ li:first-child{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.list_area > .tool .selectBox__ .list__ li:last-child{
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}


.list_area > .tool .selectBox__ .select__,
.withdraw_history > .tool .selectBox__ .select__ {
    height: 50px;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding-left: 15px;
}
.list_area > .tool .select__wrap { 
    margin-left: 10px;
}
.list_area > .tool .selectSort2,
.withdraw_history > .tool .selectSort2 {
    width: 160px;
}
.list_area > .tool .selectFilter .list__ {
    left: auto;
    right: 0;
    width: 160px;
}
.list_area > .tool .selectFilter .list__ li:before {
    content: "";
    width: 18px;
    height: 18px;
    background-image: url(../../../img/icon/check_2px.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: 0;
    background-size: cover;
}
.list_area > .tool .selectFilter .list__ li.selected {
    font-weight: 400;
    color: #222;
}
.list_area > .tool .selectFilter .list__ li.selected:before {
    background-image: url(../../../img/icon/checked_2px.svg);
}
.list_area .empty {
    text-align: center;
    margin-top: 120px;
    background: #fff;
    color: #aaa;
}
.selectFilter .select__ {
    padding-right: 20px;
    background-image: none;
}
.selectFilter .select__:before {
    content: "";
    width: 16px;
    height: 18px;
    background-image: url(../img/icon/tool/filter.svg);
    background-repeat: no-repeat;
    margin-right: 10px;
    margin-top: 2px;
}
.selectFilter .list__ {
    width: 160px;
    right: 0;
    left: auto;
}


/* 나의 캠페인 */
.cmpState_ {
    background-color: #F9F9F9;
    padding: 22px;
    border-radius: 15px;
}
.cmpState_ ul {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.cmpState_ ul li {
    text-align: center;
    position: relative;
}
.cmpState_ ul li a{
    position: relative;
    display: inline-block;
}
.cmpState_ ul li .count{
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 100px;
    border: 1px solid #F0F7FC;
    background: #DA2872;
    font-size: 14px;
    line-height: 21px;
    padding: 0 4px;
    color: #fff;
    width: 68px;
    text-align: center;
}
.cmpState_ ul li b {
    color: #888;
    font-size: 30px;
    padding-top: 3px;
}
.cmpState_ ul li b.active {
    color: #3CCBDB;
}
.cmpState_ + .list_area.col-03 {
    margin-top: 60px;
}

.list_area .btnCont{
/*    padding: 0 15px 15px;*/
}
.list_area .btnCont > .btn{
margin-bottom: 10px;
transition: all .2s;
position: relative;
}
.list_area .btnCont > .btn:last-child{
margin-bottom: 0;
}
.list_area .btnCont > .btn:hover{
background: #3CCBDB;
color: #fff;
}
.list_area .btnCont > .btn .label{
position: absolute;
top: 50%;
right: 7px;
border-radius: 100px;
border: 1px solid #F0F7FC;
background: #DA2872;
font-size: 12px;
line-height: 18px;
padding: 0 4px;
color: #fff;
transform: translateY(-50%);
}
@media (max-width:800px){
.list_area .btnCont > .btn .label{
    font-size:9px;
    padding: 0 2px;
}
}
.list_area .btnCont .ui-button{
 padding: 14.5px 8px;   
}
.list_area .btnCont .ui-button .text{
display: flex;
justify-content: center;
gap:3px;
}
.list_area.col-03 {
    width: 1120px;
}

.list_area.col-03 ul li:not(.pagenate ul li) {
    position: relative;
    width: 250px;
}
.list_area.col-03  ul li:nth-child(5):not(.pagenate ul li) {
    margin-top: 50px;
}
.list_area.col-03 ul li:nth-child(5n+1):not(.pagenate ul li) {
    margin-left: 40px;
}
.list_area.col-03 ul li:nth-child(4n+1):not(.pagenate ul li) {
    margin-left: 0;
}
.list_area.col-03 .details {
    min-height: 110px;
}
.list_area.col-03 li .btn {
    width: 100%;
    height: 45px;
    color: #16B9CB;
    border: 1px solid #16B9CB;
    font-size: 15px;
    font-weight: 500;
}
.list_area.col-03 li .btn:disabled{
    background: #F5F5F5;
    border-color: var(--line-color);
    color: #999;
}
.list_area.col-03 li .btn img {
    margin-right: 5px;
}
.list_area.col-03 li .btn.compelte {
    background-color: #F5F5F5;
    border-color: #E7E7E7;
    color: #999999;
    word-break: keep-all;
}

.list_area.col-03 li .message_btn{
margin-top: 5px;
border-color: var(--line-color);
color: #222;
display: flex;
gap: 5px;
align-items: center;
cursor: pointer;
}
.list_area.col-03 li .message_btn:hover{
/* color: white;
background: var(--navy-color); */
}
.list_area.col-03 li .message_btn svg{
fill: var(--navy-color);
}


/*
.list_area.col-03 .timer {
    position: absolute;
    left: 0;
    top: 0;
    margin: 10px;
    padding: 3px 10px;
    padding-left: 26px;
    color: #fff;
    font-size: 13px;
    border-radius: 8px;
    background-color: rgba(0,0,0,0.5);
    background-image: url(../img/icon/tool/clock.svg);
    background-repeat: no-repeat;
    background-position: left 10px center;
    z-index: 100;
    line-height: 20px;
}
*/

.list_area.col-03 .cancel,.list_area.col-03 .review_cancel {
    position: absolute;
    right: 0;
    top: 0;
/*        margin: 8px;*/
    margin: 0px;
    padding: 6px 13px;
    color: var(--red-100-color);
    font-size: 12px;
    border-radius: 8px;
    border-color: var(--red-100-color);
    background-color: rgba( 255, 255, 255, 0.5 );
    background-repeat: no-repeat;
    z-index: 100;
    line-height: 13px;
}


/* 찜목록 캠페인 */
.sub_page_tab + .list_area {
    margin-top: 38px;
}
.list_area .imgBox {
    position: relative;
}
.list_area .imgBox .over_ {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    padding: 10px 12px;
    z-index: 10;
}
.list_area .closed .imgBox .over_ {
    background-color: rgba(0,0,0,0.5);
}
.list_area .imgBox .over_ .tool {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    color: #fff;
}
.list_area .imgBox .over_ .tool .removeBtn {
    width: 30px;
    height: 30px;
    cursor: pointer;
    margin-left: 5px;
}
.list_area .imgBox .over_ .tool .state_ {
    padding: 4px 10px;
    border: 1px solid #fff;
    border-radius: 5px;
    font-size: 14px;
    font-size: 700;
}

/* 포트폴리오 */
.ct_title + .about_area {
    padding-top: 0;
}
.about_area .list_area.col-03 .details {
    min-height: 0;
}
.about_area .list_area.col-03 ul li + li:not(.pagenate ul li) {
    margin-top: 35px;
}
.about_area .list_area.col-03 ul li:nth-child(1):not(.pagenate ul li),
.about_area .list_area.col-03 ul li:nth-child(2):not(.pagenate ul li),
.about_area .list_area.col-03 ul li:nth-child(3):not(.pagenate ul li),
.about_area .list_area.col-03 ul li:nth-child(4):not(.pagenate ul li) {
    margin-top: 0;
}



#missionModal .field_area .field{
flex-direction: column;
align-items: flex-start;
gap:15px;
}


/* 맞춤 캠페인 설정 창 */

/*
#customModal{
height: calc(100dvh - 67px);
}

#customModal .closer {
position: static;
left: 0;
top: 0;
transform: none;
width: 13px;
height: 26px;
background-image: none;
margin: 0;
}
#customModal .check_area{
gap:15px 20px;
}
#customModal .modal-layer{
margin: 0;
height: calc(100dvh - 67px);
max-width: none;
max-height: none;
border-radius: 0;
}
#customModal .modal-layer .content{
height: calc(100% - 85px - 72px); 
}

#customModal .modal-layer .head{
background: var(--primary-color);
color: #fff;
padding: 30px 15px;
height: initial;
font-size: 18px;

justify-content: flex-start;
gap: 30px;
}

#customModal .modal-layer .field_area .field{
flex-direction: column;
align-items: flex-start;
}
#customModal .modal-layer .field + .field{
margin-top: 30px;
}

#customModal .modal-layer .btn_area{
position: fixed;
bottom: 82px;
left: 0;
width: 100%;
margin: 0;
padding: 15px;
padding-bottom: 0;
background: #fff;
}
#customModal .modal-layer .btn_area .submitBtn{
line-height: 1;
padding: 18px 0 ;
border-radius: 10px;
font-size: 16px;
height: auto;
}
*/

/* 로그아웃 모달 창 */
#logout .modal-layer .btn_area{
padding: 0;    
}


/* 미션 중지 모달창 */
#mission_error{
max-width: 660px;
margin: 0 auto;
}
#mission_error .modal-layer .field{
display: flex;
flex-direction: column;
align-items: flex-start;
}
#mission_error .modal-layer .field .checkbox_{

}
#mission_error .modal-layer .field label{
width: auto;
padding-bottom: 10px;
color: #444;
align-self: flex-start;
}
#mission_error .modal-layer .content{
display: flex;
flex-direction: column;
gap:20px;
padding: 20px 30px;
}
#mission_error .modal-layer .content .info_cont{
background: #F8F8FA;
padding: 10px 20px;
border-radius: 5px;
display: flex;
flex-direction: column;
gap: 5px;
}

#mission_error .checkbox_ input + label:before{
align-self: flex-start;
margin-top: 3px;
}

#mission_error .modal-layer .field label span{
font-weight: 300;
display: inline-block;
}

#mission_error .modal-layer .btn_area{
margin-top: 0;
}


#mission_error_modal{
max-width: 660px;
margin: 0 auto;
}
#mission_error_modal .ui-modal-layer .field{
display: flex;
flex-direction: column;
align-items: flex-start;
}

#mission_error_modal .ui-modal-layer .field label{
width: auto;
padding-bottom: 10px;
color: #444;
align-self: flex-start;
}
#mission_error_modal .ui-modal-layer .content{
display: flex;
flex-direction: column;
gap:20px;
padding: 10px 0;
}
#mission_error_modal .ui-modal-layer .content .info_cont{
background: #F8F8FA;
padding: 10px 20px;
border-radius: 5px;
display: flex;
flex-direction: column;
gap: 5px;
}

#mission_error_modal .checkbox_ input + label:before{
align-self: flex-start;
/* margin-top: 3px; */
}

#mission_error_modal .ui-modal-layer .field label span{
font-weight: 300;
display: inline-block;
}

#mission_error_modal .ui-modal-layer .btn_area{
margin-top: 0;
}

/* SNS 정보 연결 모달창 */
#SNSConnectModal .modal-layer {
max-width: 600px;

}
#SNSConnectModal .modal-layer .content {
padding: 0;
padding-bottom: 40px;
max-height: calc(100vh - 150px);
overflow-y: scroll;
border-radius: 0 0 20px 20px;
}
#SNSConnectModal .modal-layer .content::-webkit-scrollbar {
width: 15px;
background-color: transparent;
}
#SNSConnectModal .modal-layer .content::-webkit-scrollbar-thumb {
background-color: #9499B4;
border: 5px solid #fff;
border-radius: 15px;
cursor: pointer;
opacity: 0;
}
#SNSConnectModal .modal-layer .content::-webkit-scrollbar-track {
background-color: transparent;
opacity: 0;
}

#SNSConnectModal .text{
padding: 10px 30px;
font-weight: 700;
}
#SNSConnectModal .alert{
justify-content: center;
padding-left: 0;
}
#SNSConnectModal .modal-layer .btn_area{
gap: 10px;
margin-top: 40px;
}
#SNSConnectModal button.closer{
position: static;
background-image: none;
width: 220px;
height: 60px;
border-radius: 10px;
margin: 0;
font-size: 16px;
font-weight: 700;
background: #B5B5B5;
color: white;
}
#SNSConnectModal .modal-layer .btn_area #sns_close_btn{
display: flex;
justify-content: center;
align-items: center;
width: 220px;
height: 60px;
background-color: #B5B5B5;
border-radius: 10px;
color: #fff;
font-size: 16px;
font-weight: 700;
}

#customModal .modal-layer{
max-width: 600px;
}
#customModal .modal-layer .content{
padding: 20px 30px;
max-height: 680px;
overflow: auto;
}
#customModal .modal-layer .field{
flex-direction: column;
align-items: flex-start;
gap:20px;
}
#customModal .check_area{
gap:15px 20px;
border: none;
}
#customModal .check_area label{
width: fit-content;
}

#customModal .notice_set .kakao_cont .item .right input{
width: 53px;
height:30px;
}
/* NOTE: 맞춤 캠페인 모달도 적용시 SNS ID값을 빼고 적용한다. */

@media (max-width: 800px){
/* 리뉴얼 디자인 사용 전까지만 사용    */
#SNSConnectModal .modal-layer .btn_area{
gap: 10px;
margin-top: 40px;
}
#SNSConnectModal .modal-layer .btn_area button{
    height: 60px;
    flex:1;
    border-radius: 10px;   
}

#SNSConnectModal .modal-layer .btn_area #sns_close_btn{
    width: 100%;
}


#SNSConnectModal .modal-layer .content{
    padding: 15px 0 40px;
    overflow-y: auto;
}

#SNSConnectModal .modal-layer{
    max-width: initial;
    border-radius: 0;
    margin: 0;
    height: 100%;
}
#SNSConnectModal .modal-layer > .closer{
    display: none;
}
#SNSConnectModal .modal-layer .head h1{
    font-size: 18px;
    height: 88px;
    display: flex;
    align-items: center;
    position: relative;
}

#SNSConnectModal .modal-layer .head{
    height: auto;
    background: var(--primary-color);
    color: #fff;
    position: relative;
}
#SNSConnectModal .modal-layer .head h1::before{
    content: '';
    display: block;
    background: #fff;
    width: 20px;
    height: 20px;
    transform: translate(-50%, 50%) rotate(45deg);
    position: absolute;
    left: 50%;
    bottom: 0;
    
}
#SNSConnectModal .text{
    font-size: 18px;
}
#SNSConnectModal .modal-layer .content{
    text-align: center;
    height: calc(100% - 85px);
    padding: 0;
    max-height: initial;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow-y: initial;
}
#SNSConnectModal .modal-layer .field label{
    display: none;
}
#SNSConnectModal .modal-layer .field_area .field .SNS_ li{
    height: auto;
    gap:20px;
}
#SNSConnectModal .field_area .field .SNS_ .icon{
    width: 60px;
    padding: 15px 0;
    margin: 0;
}
#SNSConnectModal .field_area .field .SNS_ div:nth-child(3){
    margin: 0;
}
#SNSConnectModal .modal-layer .btn_area{
    flex-direction: column;
    
}
#SNSConnectModal .modal-layer .btn_area button{
    width: 100%;
    padding: 18.5px 0;
    height: auto;
    font-size: 16px;
    border-radius: 10px;
}
#SNSConnectModal .alert{
    font-size: 13px;
}
}



/* 미션 제출하기 */
#missionModal .modal-layer {
    max-width: 600px;
}
#missionModal .modal-layer .content {
    padding: 0;
/*        padding-bottom: 40px;*/
    max-height: calc(100vh - 150px);
    overflow-y: scroll;
    border-radius: 0 0 20px 20px;
}
#missionModal .modal-layer .content::-webkit-scrollbar {
    width: 15px;
    background-color: transparent;
}
#missionModal .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: #9499B4;
    border: 5px solid #fff;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
}
#missionModal .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}


.missionBlock {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 40px 30px;
    padding-bottom: 0;
    margin-bottom: 15px;
}
.missionBlock .imgBox {
    flex-shrink: 0;
    width: 200px;
    height: 200px;
    border-radius: 8px;
    margin-right: 30px;
    overflow: hidden;
}
.missionBlock .imgBox img {
    width: 100%;
    height: 100%;
}
.missionBlock .details {
    font-size: 14px;
}
.missionBlock .tag_area {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 7px;
    color: #666;
}
.missionBlock .tag_area img {
    width: 22px;
    margin-right: 5px;
}
.missionBlock .company_ {
    color: #888;
}
.missionBlock .subject {
    font-size: 16px;
    margin-bottom: 9px;
}
.missionBlock .option {
    color: #888;
    margin-bottom: 10px;
}
.missionBlock .point_tag {
    display: flex;
    justify-content: flex-start;
/*        align-content: */
}
.missionBlock .point_tag .point {
    font-size: 14px;
    padding: 5px 7px;
    border-radius: 5px;
    border: 1px solid currentColor;
    margin-right: 5px;
}
.missionBlock .point_tag .point.bonus {
    color: #16B9CB;
}
.missionBlock .btn {
    margin-top: 20px;
    width: 160px;
    height: 35px;
    font-weight: 500;
    border-radius: 5px;
    background-color: #3CCBDB;
    color: #fff;
}

.BuyMission {
    padding: 30px;
}
.BuyMission .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}
.BuyMission .title h1 {
    font-size: 18px;
    font-weight: 700;
}
.BuyMission .state {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 29px;
    border-radius: 5px;
    border: 1px solid #E7E7E7;
    background-color: #F5F5F5;
    color: #999;
    font-size: 14px;
}
.BuyMission .state img {
    margin-right: 5px;
}

.mission_guide {
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #fff;
}
.mission_guide .head {
    height: 46px;
    padding: 0 15px;
    cursor: pointer;
    border: none;
    background-image: url(../img/icon/tool/select_down.svg);
    background-repeat: no-repeat;
    background-position: right 15px center;
}
.mission_guide .head.active {
    background-image: url(../img/icon/tool/select_up.svg);
}
.mission_guide .body {
    display: none;
    padding: 15px;
    font-size: 14px;
    color: #666;
    border-top: 1px solid #eee;
}
.mission_guide li {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 4px;
}
.mission_guide li:before {
    content: "";
    width: 4px;
    height: 4px;
    background-color: #ccc;
    margin-right: 6px;
    margin-top: 8px;
}

.mission_detial {
    margin-top: 20px;
}
.mission_photo {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
}
.mission_photo > div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
}
.mission_photo .subject {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}
.mission_detial .uploader_area {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-flow: column;
    flex-shrink: 0;
}
.mission_detial .uploadList {
    flex-flow: column;
}

.mission_detial .uploadList .item {
    margin-right: 0;
    margin-bottom: 0;
    padding: 0;
}

#missionModal .uploader {
    position: relative;
    width: 73px;
    height: 73px;
    flex-shrink: 0;
    overflow: hidden;
}
#missionModal .uploader input {
    opacity: 0;
}
#missionModal .uploader input + label {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/icon/tool/uploader.svg);
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 1;
}
#missionModal .uploader_area {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.mission_detial .field {
    flex-grow: 1;
}
.mission_detial .field dl {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    gap:8px;
}
.mission_detial .field dl dd {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.mission_detial .field dl dd:first-child {
    flex-shrink: 0;
    font-size: 14px;
    width: 115px;
    color: #707070;
}
.mission_detial .field dl dd:last-child {
    flex-grow: 1;
}
.mission_detial .field dl + dl {
    margin-top: 10px;
}
.mission_detial .field dl input {
    flex-grow: 1;
    border-color: #ddd;
    border-radius: 5px;
    background-color: #fff;
    font-size: 14px;
    padding: 0 8px;
    height: 35px;
}
.mission_detial .field dl input + label {
    width: auto;
    flex-shrink: 0;
    font-size: 14px;
    padding: 0 9px;
}

.mission_item {
    padding: 30px;
}
.mission_item .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
/*        margin-bottom: 15px;*/
}
.mission_item .title h1 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 16px;
}
.mission_item .title h1 img {
    width: 25px;
    vertical-align: top;
    margin-right: 12px;
}
.mission_item .timer,
.mission_item .dday {
    font-size: 14px;
    font-weight: 500;
}
.mission_item .timer img,
.mission_item .dday img {
    margin-right: 5px;
}
.mission_item .timer {
    color: #FF7474;
}
.mission_item select {
    width: 100%;
    height: 47px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background-color: #fff;
    font-size: 16px;
}
.sns_mission {
    background-color: #F9F9F9;
}
.mission_item > input {
    margin-top: 10px;
    width: 100%;
    height: 35px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background-color: #fff;
    font-size: 14px;
}
.mission_item > input::placeholder {
    color: var(--placeholder-color);
}
.mission_item .uploader_area {
    margin-top: 21px;
}
.mission_item .uploader {
    margin-right: 0;
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
}
.mission_item .uploadList .item {
    margin-bottom: 0;
    padding: 0;
}

.mission_detial .field div.notice_cont{
font-size: 12px;
color: #666;
padding-top: 5px;
}
.mission_detial .field div.notice_cont .paynack_notice{
padding-top: 3px;
}
.mission_detial .field div.notice_cont .mission_error{
text-align: right;
}
.mission_detial .field div.notice_cont .mission_error span{
padding-bottom: 2px;
border-bottom: 1px solid #666;
cursor: pointer;
}
.uploadList {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
}
.uploadList .item {
    position: relative;
    width: 73px;
    height: 73px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 10px;
    margin-right: 10px;
}
.uploadList .item img {
    width: 100%;
    height: 100%;
}
.uploadList .item .close {
    position: absolute;
    margin: 5px;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 19px;
    background-image: url(../img/icon/tool/delete.svg);
    background-repeat: no-repeat;
    background-color: transparent;
    border: none;
    cursor: pointer;
}




/* 포트폴리오 상세 */
#detailsModal .modal-layer {
    max-width: 790px;
}
#detailsModal .modal-layer .content {
    padding: 30px;
}
#detailsModal .details {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
}
#detailsModal .details > article {} 
#detailsModal .profile_area {
    width: 430px;
    padding-right: 30px;
    margin-right: 30px;
    border-right: 1px solid #E7E7E7;
}
#detailsModal .checkbox_.tab {
    margin-top: 0;
}
#detailsModal .checkbox_.tab input + label {
    height: 38px;
}
#detailsModal .profile_area .item {
    padding-top: 20px;
}
#detailsModal .profile_area .item > h1 {
    font-size: 16px;
    margin-bottom: 10px;
}
#detailsModal .profile_area .comment {
    background-color: #F9F9F9;
    border-radius: 5px;
    padding: 9px 20px;
    white-space: pre-line;
    font-size: 14px;
    line-height: 1.5em;
    min-height: 240px;
}
#detailsModal .list_area .col-06 {
    width: 100%;
}
#detailsModal .list_area .desc {
    white-space: pre-line;
    line-height: 1.5em;
}
#detailsModal .list_area .btn {
    margin-top: 30px;
    height: 40px;
    color: #16B9CB;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    border-color: #16B9CB;
}

.popup_notice{
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.2);
z-index: 999;

}

.popup_notice .close{
position: absolute;
right: 15px;
top: 10px;
}

.popup_notice .body{
width: calc(100% - 80px);
background: #fff;
padding: 30px 30px;
border: 1px solid var(--primary-color);
border-radius: 15px;
z-index: 999;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: relative;
}

.popup_notice h1{
font-size: 20px;
text-align: center;
padding-bottom: 16px;
color: var(--primary-color);
word-break: keep-all;
}

.popup_notice .desc{
padding-bottom: 20px;
word-break: keep-all;
}

.popup_notice .btn_wrap{
display: flex;
justify-content: center;
align-items: center;    
}

.popup_notice .customBtn_p{
display: flex;
justify-content: center;
align-items: center;
gap:10px;
word-break: keep-all;
}

.ch_link {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 260px;
    height: 42px;
    border: 1px solid #E7E7E7;
    border-radius: 5px;
    margin-bottom: 6px;
    padding: 9px;
    background-color: #fff;
    background-image: url(../img/icon/tool/arrow_right_g.svg);
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 6px;
}
.ch_link:hover {
    background-image: url(../img/icon/tool/arrow_right_b.svg);
}
.ch_link img {
    margin-right: 10px;
}



.real_time_contents .banner_cont{
background: url(../img/banner/content_banner.png);
background-repeat: no-repeat;
background-size: cover;
width: 100%;
padding: 50px 0 ;
}
.real_time_contents .banner_cont .contents{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;

/*    aspect-ratio: 16 / 4;*/
}
.real_time_contents .banner_cont .contents .text{
text-align: center;
}
.real_time_contents .banner_cont .contents .text h1{
color: #fff;
font-size: 28px;
font-weight: 500;
line-height: 1;
padding-bottom: 10px;
}
.real_time_contents .banner_cont .contents .text h1 span{
font-weight: 700;
}

.real_time_contents .banner_cont .contents .text p{
font-size: 38px;
font-weight: 700;
color: #fff;
padding-bottom: 15px;
line-height: 1;
}

.real_time_contents .best_rank_inner{
max-width: 1031px;
}
.real_time_contents .best_rank_swiper{
max-width: 868px;
margin: 0 auto;
position: relative;
overflow: hidden;
}

.real_time_contents .best_rank_swiper .best_rank_cont{

}
.real_time_contents .best_rank_swiper .best_rank_cont .item{
overflow: hidden;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .img_box{
max-width: 100%;
max-height: 256px;
width: 100%;
height: 256px;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .img_box img{
width: 100%;
height: 100%;
max-width: 100%;
max-height: 256px;
object-fit: cover;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .details{
padding: 10px 15px;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .details .profile_img{
max-width:30px;
max-height: 30px;
border-radius: 50%;
overflow: hidden;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .details .profile_img img{
width: 100%;
height: 30px;
display: block;
}

.real_time_contents #more{
max-width: 940px;
display: block;
width: 100%;
border-radius: 5px;
border: 1px solid #E4E4E4;
text-align: center;
margin: 0 auto;
font-size: 28px;
font-weight: 500;
padding: 16px 0;
background: #fff;
line-height: 1;
font-family: Pretendard;
color: #666;
}
/*
.real_time_contents .best_rank_slide{
display: flex;
gap:50px;
}
*/
.real_time_contents .best_rank_slide .item{
max-width: 255px;
}

.real_time_contents .rank_list:not(.best_rank_slide){
display: flex;
flex-wrap: wrap;
gap:40px 60px;
padding-bottom: 58px;
padding-top: 40px;
}
.real_time_contents .rank_list .item .details{
padding: 0;
}
.real_time_contents .keyword_cont{
display: flex;
gap:20px;
}
.real_time_contents .keyword_cont .img_box{
max-width: 150px;
max-height: 150px;
}
.real_time_contents .keyword_cont .img_box img{
width: 150px;
height: 150px;
object-fit: cover;
border-radius: 10px;
}
.real_time_contents .keyword_cont > div{
}
.real_time_contents .keyword_cont .keyword_info{
padding: 10px 0 ;
display: flex;
flex-direction: column;
justify-content: space-between;
width: calc(100% - 150px - 20px);
}
.real_time_contents .keyword_cont .keyword_info > div{
display: flex;
/*    gap:20px;*/
/*    padding-bottom: 20px;*/
line-height: 1;
align-items: center;
}
.real_time_contents .keyword_cont .keyword_info div > div{
font-weight: 700;
flex: 1;
word-break: keep-all;
line-height: 1.3;
}
.real_time_contents .keyword_cont .keyword_info div > div#rank{
color: var(--primary-color);
font-size: 24px;
}
.real_time_contents .keyword_cont .keyword_info div > div.serch{
font-size: 24px;
}
.real_time_contents .keyword_cont .keyword_info h2{
font-weight: 500;
flex: .6;
min-width: fit-content;
padding-right: 5px;
}
.rank_list .details .subject{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: initial;
  font-weight: 700;
}
.real_time_contents .rank_list.best_rank_slide{
max-width: 1031px;
gap:50px;
margin: 0 auto;
justify-content: center;
padding-bottom: 0;
}

.real_time_contents .rank_list.best_rank_slide .item{
padding: 0;
border: 0;
gap:5px;
max-width: 256px;
}
.real_time_contents .rank_list.best_rank_slide .item .details{
padding: 0 10px 10px 10px;
}
.real_time_contents .rank_list:not(.best_rank_slide) .item{
border-radius: 10px;
border: 1px solid #E7E7E7;
padding: 20px;
display: flex;
flex-direction: column;
gap: 16px;
flex: 1 0 calc((100% / 3) - 60px);
max-width: calc(100% / 3 - 40px);
}
.real_time_contents .rank_list .item .img_box{
max-width: 100%;
}
.real_time_contents .rank_list .item .img_box img{
max-width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
}
.real_time_contents .rank_list.best_rank_slide .item .img_box img{
border-radius: 10px 10px 0 0;
}

.real_time_contents .rank_list .item .profile_img{
max-width:30px;
max-height: 30px;
border-radius: 50%;
overflow: hidden;
}
.real_time_contents .rank_list .item .profile_img img{
width: 100%;
height: 30px;
display: block;
}

.best_rank.swiper-button-next, .swiper-container-rtl .best_rank.swiper-button-next{
background-image: url(../img/icon/tool/slide_next_btn.svg) !important;
}
.best_rank.swiper-button-prev, .swiper-container-rtl .best_rank.swiper-button-prev{
background-image: url(../img/icon/tool/slide_prev_btn.svg) !important;
}
.best_rank.swiper-button-next,.best_rank.swiper-button-prev{
background: none;
border: 0;
background-size: cover;
background-repeat: no-repeat;
}
/*
.best_rank.swiper-button-prev, .best_rank.swiper-button-next{
background: none;
border: 0;
background-size: cover;
background-repeat: no-repeat;
}
*/

.best_rank.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after{
content: '';
}
.best_rank.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after{
content: '';
}

/* 나의 등급 페이지 */
.my_grade .tooltip{
position: relative;
background: #fff;
display: inline-block;
cursor: pointer;
}

.my_grade .tooltip .tooltip_text{
display: none;
border-radius: 5px;
border: 1px solid #C5C3C3;
padding: 12px;
position: absolute;
font-size: 14px;
font-weight: 700;
left: -24px;
top: 40px;
background: #fff;
line-height: 1.7;
width: max-content;
}
.my_grade .tooltip:hover .tooltip_text{
display: inline-block;
}
.my_grade .tooltip .tooltip_text::before{
content: "";
display: inline-block;
position: absolute;
width: 14px;
height: 14px;
background: #fff;
left: 22px;
top: -8px;
transform: rotate(45deg);
z-index: 1;
border-left: 1px solid #c5c3c3;
border-top: 1px solid #c5c3c3;
}
.my_grade .tooltip .tooltip_text p{

}
.my_grade .tooltip .tooltip_text p span{}
.my_grade .tooltip .tooltip_text p span:nth-child(1){
color: #FF0202;
}
.my_grade .tooltip .tooltip_text p span:nth-child(2){
color: #6DD14A;
}
.my_grade .tooltip .tooltip_text p span:nth-child(3){
color: #DDCB2C;
}

@keyframes tooltip{
0%{
    opacity: 0;
    transform: scale(0.2)
}
70%{
    transform: scale(1.1)
}
100%{
    opacity: 1;
    transform: scale(1)
}
}

.biz_tooltip{
position: absolute;
padding: 11px 16px;
background: var(--primary-color);
border-radius: 8px;
top: 85px;
left: 60px;
z-index: 1;
animation: tooltip .3s ease-in-out;
color: #fff;
font-size: 14px;
width: 170px;
}

.biz_tooltip::before{
content: "";
display: inline-block;
position: absolute;
border-top: 0;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: 18px solid var(--primary-color);
z-index: 1;
top: -12px;
left: 126px;

}
.biz_tooltip span.head{
font-size: 14px;
font-weight: 500;
}
.biz_tooltip span{
display: block;
font-weight: 300;
}
.biz_tooltip span img{
width: 10px;
height: 10px;
position: absolute;
right: 12px;
top: 17px;
cursor: pointer;
}

.blog_tooltip{
position: absolute;
padding: 10px;
background: var(--primary-color);
border-radius: 10px;
top: 77px;
left: -100px;
z-index: 1;
animation: tooltip .3s ease-in-out;
}

.blog_tooltip::before{
content: "";
display: inline-block;
position: absolute;
border-top: 0;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: 18px solid var(--primary-color);
z-index: 1;
top: -12px;
left: 126px;

}

.mobile_area .blog_tooltip{
top: 57px;
left: 20px;
padding: 8px;
}
.mobile_area .blog_tooltip::before{
border-left: 3px solid transparent;
border-right: 22px solid transparent;
border-bottom: 16px solid var(--primary-color);
z-index: 1;
top: -14px;
left: 18px;
}

.mobile_area .blog_tooltip span{
font-size: 14px;
display: flex;
align-items: center;
}


.blog_tooltip span{
color:#fff;   
display: flex;
}
.blog_tooltip img{
max-width: 12px;
margin-left: 8px;
cursor: pointer;
}
.guide_detail img{
display: none;
}
/* // 나의 등급 페이지 */

.pause_tooltip{
position: absolute;
padding: 10px;
background: var(--accent-color);
border-radius: 10px;
top: 67px;
right: 20px;
z-index: 1;
animation: tooltip .3s ease-in-out;
}

.pause_tooltip::before{
content: "";
display: inline-block;
position: absolute;
border-top: 0;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
border-bottom: 18px solid var(--accent-color);
z-index: 1;
top: -12px;
right: 56px;
}
.pause_tooltip span{
color:#222;
font-size: 13px;
display: flex;
}
.pause_tooltip img{
max-width: 12px;
margin-left: 8px;
cursor: pointer;
}


@media(max-width: 1440px) {
/* */
.inner {
    width: 1200px;
}

.campaign_slide .inner {
    width: 1200px;
}
.visula_slide .inner,
.campaign__ .inner,
#footer .inner {
    padding: 0 20px;
}
#header .tool_area .inner {
    padding-right: 20px;
}

.search_area{
    width: 350px;
}

#header .gnb ul li + li{
    /* margin-left: 20px; */
}

.list_area .campaign_card{
    width: 19%;
    margin-right: 1.2%;
}


/* visual slide */
.visula_slide .swiper-slide {
    width: 32%;
    margin-right: 2%;
}
.visula_slide .swiper-button-prev {
    left: 0;
}
.visula_slide .swiper-button-next {
    right: 0;
}
.visula_slide button[class*=swiper-button] {
    display: none;
}
.campaign_slide button[class*=swiper-button] {
    display: none;
}
.visula_slide .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    margin: 0 3px;
    vertical-align: top;
}
.visula_slide .pagenation-inner .swiper-pagination {
    height: 20px;
}

.visula_slide .guide_banner > div{
    padding: 44px;
}

.visula_slide .guide_banner > div h1{
    font-size: 30px;
}

.visula_slide .guide_banner > div p{
    font-size: 18px;
}
.visula_slide .guide_banner > div img{
     max-width: 360px;   
}

/* campain list */
.list_area ul li:not(.pagenate ul li) {
    width: 19%;
}
.list_area ul li + li:not(.pagenate ul li) {
    margin-left: 1.2%;
}


.list_area.col-03 ul li:not(.pagenate ul li){
    margin-left: 40px;
}

.point_area {
    padding: 25px;
}
.point_area > div:first-child img {
    width: 34px;
    margin-right: 14px;
}
.point_area .point_ p:last-child {
    font-size: 34px;
}

.real_time_contents .rank_list:not(.best_rank_slide){
    gap:30px;
}
.real_time_contents .rank_list:not(.best_rank_slide) .item{
    flex: 1 0 calc((100% / 3) - 40px);
    max-width: calc(100% / 3 - 20px);
}

/*
.list_area .reporter .point_tag{
    flex: 2;
}
*/

}


.mobile_campaign_list_cont{
display: none;
}

.my_page .sns{
width: 100%;
display: flex;
flex-direction: column;
gap: 10px;
font-weight: 400;
font-size: 20px;
color: #222;
}

.my_page .sns .item_wrap{
display: flex;
flex-direction: column;
gap:15px;
font-size: 16px;
}
.my_page .sns .item_wrap a{
    display: flex;
    gap:5px;
    align-items: center;
    font-weight: 500;
    font-size: 16px;
    color: #666;
    width:fit-content;
}


div.chip_cont, ul.chip_cont {
    padding: 0;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    background: #fff;
}
ul.chip_cont.MO_content{
    display: none;
}
div.chip_cont > div, ul.chip_cont > div{
    cursor: pointer;
}

div.chip_cont .chip{
    background: #eee;
    color: #666;
    padding: 12px 25px;
    border-radius: 50px;
    text-wrap:nowrap;
    font-size: 16px;
}
div.chip_cont.cp_filter_chip{
    padding-top: 15px;
    padding-bottom: 15px;
}
div.chip_cont.cp_filter_chip .chip{
    background: #fff;
    border: 1px solid #ddd;
}
div.chip_cont .chip.flex_col{
    display: flex;
    flex-direction: column;
    align-items: center;
    background: none;
    padding: 0;
    font-size: 12px;
}
div.chip_cont.cp_filter_chip .chip.on{
    background: #585858;
    color: #fff;
    border-color: var(--primary-color);
}
div.chip_cont.cp_filter_chip .chip.on{
    background: var(--primary-color);
    color: #fff;
}
div.chip_cont .chip a{
    display: flex;
    align-items: center;
    gap:3px;
    color: inherit;
    min-width: auto;
    font-size: 12px;
}
div.chip_cont .chip a img{
    max-width: 18px;
}
div.chip_cont .icon_chip{
    display: flex;
    flex-direction: column;
    align-items: center;
}


@media(max-width: 800px) {
.inner {
    width: 100%;
}
.mobile_line {
    display: block;
}
.visula_slide .inner, 
#footer .inner {
    padding: 0 15px;
}

.side_menu {
    display: none;
}

.btn_area {
/*        padding: 0 15px;*/
}
.moreBtn {
    width: 100%;
    height: 44px;
    border-radius: 4px;
    font-size: 14px;
}
.moreBtn img {
    width: 16px;
}
i.exmark {
    width: 22px;
    height: 22px;
}

.submitBtn {
    border-radius: 4px;
    height: 44px;
    font-size: 14px;
    box-shadow: 0px 3px 8px rgb(60 203 219 / 30%);
    -webkit-box-shadow: 0px 3px 8px rgb(60 203 219 / 30%);
}

.subBtn {
    border-radius: 4px;
    height: 44px;
    font-size: 14px;
}

.favBtn {
    height: 44px;
    width: 44px;
    background-size: 16px;
    border-radius: 4px;
}

.zzimBtn {
    height: 44px;
    width: 44px;
    background-size: 16px;
    border-radius: 4px;
}

/* select */
.selectBox__ .list__ {
    border-radius: 4px;
}
.selectBox__ .list__ li {
    padding: 15px;
    font-size: 12px;
    white-space: nowrap;
}
.selectFilter .select__ {
    padding-right: 12px !important;
}
.selectFilter .select__:before {
    width: 15px;
    height: 15px;
    background-size: contain;
    margin-right: 3px;
}
.selectFilter .list__ {
    width: 120px;
}

.list_area > .tool .selectFilter .list__ li:before {
    width: 15px;
    height: 15px;
    background-size: contain;
    margin: 0;
}


/* header */
#header + #container {
    padding-top: 0px;
}
#header + #container:has(.fixed_head){
/*        padding-top: 75px;*/
    padding-top: 58px;
}
#header + #container.real_time_contents{
    padding-top: 60px;
}
#header .tool_area,
#header .catagory_area {
    display: none;
}
#header .tool_area .inner {
    height: 60px;
}
#header .logo {
    margin: 0;
}
#header .ad_banner.pc{
    display: none;
}
#header .ad_banner.mo{
    display: flex;
}
#header .ad_banner > div .text{
font-size: 16px;
font-weight: 700;
display: flex;
gap:15px;
}
#header .ad_banner.mo > div{
gap:5px;
}
#header .ad_banner > div .link_text{
display: none;
}

#header .ad_banner .close_text{
display: none;
}

/* footer */
#footer {
    margin-top: 30px;
}
#footer .footer_top .inner {
    flex-flow: column;
    align-items: flex-start;
    padding: 30px 15px;
}
#footer .gnb_ {
    width: 100%;
    flex-flow: column;
}
#footer .gnb_ > article {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
#footer .gnb_ > article + article {
    margin-top: 20px;
}
#footer .gnb_ ul li {
    margin-top: 0;
    margin-bottom: 5px;
}
#footer .gnb_ .title {
    width: 90px;
    margin-right: 35px;
    font-size: 16px;
    flex-shrink: 0;
}
#footer .gnb_ .title + div,
#footer .gnb_ .title + ul {
    flex-grow: 1;
}

#footer .ch_link {
    width: 100%;
}

#footer .company_ .inner {
    padding-top: 20px;
    padding-bottom: 85px;
}
#footer .company_ .info {
    flex-flow: column;
    font-size: 13px;
}
#footer .company_ .info span {
    margin-left: 0;
    padding-left: 0;
    border: 0;
    margin-bottom: 0;
    margin-top: 5px;
}
#footer .company_ .copy_ {
    font-weight: 400;
}


#footer .socials_ {
    width: 100%;
    justify-content: space-around;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}
#footer .socials_ a {
    font-size: 12px;
}
#footer .socials_ a + a {
    margin-left: 20px;
}
#footer .socials_ .imgBox {
    width: 50px;
    height: 50px;
    background-size: contain;
    margin: 0 auto;
    margin-bottom: 8px;
}

/* mobile top & bottom */
.mobile_area {
    display: block;
    overflow: hidden;
}
.mobile_area.bet{
    overflow: visible;
}

.campaign__ .mobile_area.active{   
}

.mobile_head_cont{
    position: sticky;
    top: -302px;
    z-index: 9;
    transition: top .3s;
}
.mobile_head_cont.sticky_fix{
    top: 0;
}
/*
.campaign__ .mobile_area.active .head{
    transition: all .5s;
    left: -100%;
}
*/
/*
.campaign__ .mobile_area .search_area.active{
    left: 100%;
}
*/
#mobile_bottom {
    display: none;
}


/* slide */
.visula_slide {
    margin-bottom: 0px;
}
.visula_slide .inner {
    padding-right: 0;
    padding-left: 0;
}
.visula_slide .swiper {
    padding: 15px;
    height: 100%;
}
.visula_slide .swiper.sub_banner_swiper{
    padding: 0;
    height: 105px;
/*        background: var(--primary-color);*/
}
.visula_slide .swiper-slide {
    width: 100%;
    margin-right: 15px;
    padding: 10px 20px;
}
.visula_slide button[class*=swiper-button] {
    display: block;
    width: 40px;
    height: 40px;
    background-size: contain;
}

.visula_slide .guide_banner{
    padding: 16px;
    gap:16px;
}
.visula_slide .guide_banner br{
    display: block;
}

.visula_slide .guide_banner > a{
    padding: 24px 16px 0 ;
    aspect-ratio:initial;
    display: flex;
    justify-content: space-between;
}

.visula_slide .guide_banner > div > a{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.visula_slide .guide_banner > div h1{
    font-size: 20px;
    padding-bottom: 5px;
}

.visula_slide .guide_banner > a h1{
    font-size: 20px;
    padding-bottom: 5px;
}

.visula_slide .guide_banner > a{
    padding: 24px 16px 0;
    aspect-ratio: initial;
}

.visula_slide .guide_banner > a p{
    font-size: 14px;
}
.visula_slide .guide_banner .open_talk .megaphone{
    max-width: 61px;
    height: 67px;
}
.visula_slide .guide_banner .open_talk .kakao_btn{
    font-size: 14px;
}

.visula_slide .guide_banner > div p{
    font-size: 14px;
}

.visula_slide .guide_banner > div img{
    position: static;
    width: 100%;
}

.campaign__{
    padding: 15px 0;
}

.visula_slide .sub_banner_swiper .swiper-slide[data-item='2'] img{
    max-width: 104px;
}

.visula_slide.sub .swiper-slide[data-item='1']{
    background: var(--primary-color);
}

.visula_slide.sub .swiper-slide[data-item='2']{
    background: #eee;
}

/* campaign list */
.campaign__:not(.campaign_slide) {
    padding: 0;
}

.campaign__ .head::-webkit-scrollbar {
    width: 0px;
    height: 0;
    background-color: transparent;
}
.campaign__ .head::-webkit-scrollbar-thumb {
    background-color: transparent;
    border: 0px solid transparent;
    opacity: 0;
}
.campaign__ .head::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
.campaign__ .head{
    background: var(--primary-color);
    color: #2D929E;
    padding: 20px 60px 20px 15px;
    display: flex;
    font-weight: 500;
    font-size: 16px;
    gap:20px;
    overflow-y: hidden;
    overflow-x: scroll;
    justify-content: flex-start;
}
.campaign__ .head .on{
    color: #fff;
    font-weight: 700;
}
.campaign__ .head a{
    position: relative;
    text-wrap: nowrap;
}
.campaign__ .head  a.on::before{
    content: "";
    display: block;
    background: #fff;
    width: 13px;
    height: 13px;
    transform: translate(-50%, 50%) rotate(45deg);
    position: absolute;
    left: 50%;
    bottom: -20px;
}

div.chip_cont, ul.chip_cont {
    padding: 15px;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    background: #fff;
}


.chip_cont .chip{
    background: #eee;
    color: #666;
    padding: 8px 15px;
    border-radius: 50px;
    text-wrap:nowrap;
    font-size: 12px;
}
div.chip_cont.cp_filter_chip .chip{
    padding: 8px 15px;
    border-radius: 50px;
    text-wrap: nowrap;
    font-size: 12px;
}
.chip_cont .chip.flex_col{
    display: flex;
    flex-direction: column;
    align-items: center;
    background: none;
    padding: 0;
    font-size: 12px;
}
.chip_cont .chip.on{
    background: #585858;
    color: #fff;
}
.chip_cont .chip a{
    display: flex;
    align-items: center;
    gap:3px;
    color: inherit;
    min-width: auto;
    font-size: 12px;
}
.chip_cont .chip a img{
    max-width: 18px;
}
.chip_cont .icon_chip{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.campaign__ .inner {
    padding: 0;
}
.campaign_slide .inner{
    width: 100%;
}
.campaign__ .title {
    padding: 0 0 15px 15px;
}
.campaign_list__ .title{
    display: none;
}
.campaign__ .title h1 {
    font-size: 18px;
    margin-bottom: 0;
}
.campaign__ .title h1:after {
    width: auto;
    font-size: 10px;
    font-weight: 500;
    margin-top: 3px;
    line-height: 1em;
    padding: 4px 8px;
    height: auto;
}
.campaign__ .title .more {
    font-size: 12px;
    height: 24px;
    width: 60px;
    padding-left: 7px;
    background-position: right 5px center;
}

.list_area {
    flex-wrap: wrap;
    padding-left: 15px;
    padding-right: 15px;
}
.list_area.grid-slide{
    overflow-x: scroll;
    padding-bottom: 22px;
    padding-right: 15px;
}
.list_area > .tool {
    margin-bottom: 15px;
    font-size: 14px;
    margin-top: 15px;
}
.list_area ul{
    flex-wrap: wrap;
    justify-content: space-between;
}
.list_area .pagenate ul{
    display: flex;
    justify-content: center;
    align-items: center;
}
.list_area ul li:not(.pagenate ul li) {
    width: 48%;
    margin-left: 0;
    margin-top: 0;
    margin-bottom: 3%;
}
.list_area .campaign_card{
    width: 48%;
    margin-right: 3.5%;
}

.campaign_slide .slide_inner{
    padding: 0;
    padding-right: 15px;
}
.grid-container {
    display: grid;
    grid-template-rows: repeat(2, auto);
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    grid-gap:3%;
    grid-template-columns: repeat(16, minmax(48%, auto));
}
.grid-container .grid-item{
    box-shadow: 1px 1px 5px rgba(100,100,100,0.3);
    border-radius: 10px;
}

.list_area.scroll {
/*        overflow-x: scroll;*/
/*        padding-bottom: 5px;*/
}
.list_area.scroll ul {
    
}
.list_area.scroll ul li {
    flex-shrink: 0;
    margin-top: 0;
    width: 48%;
}
.list_area.scroll ul li:nth-child(2n+1) {
    margin-left: 0;
}
.list_area.scroll ul li + li {
    margin-left: 1.2%;
}
.list_area .imgBox {
    border-radius: 8px ;
}
.list_area .imgBox .sold_out {
    border-radius: 8px ;
}

.list_area .details {
    padding: 0;
    padding-top: 5px;
    padding-bottom: 0;
}
.list_area .tag_area {
    margin: 7px 0;
    align-items: flex-start;
    align-items: center;
    gap:2px;
}
.list_area .tag_area img {
/*        margin-bottom: 3px;*/
    width: 18px;
    height: 18px;
}
.list_area .details .timer{
    font-size: 12px;
}
.list_area .tag_area span {
    margin-left: 0px;
    font-size: 12px;
    color: #222;
}

.list_area .appli_area {
    margin-bottom: 8px;
    flex-wrap: wrap;
    font-size: 12px;
}
.list_area .appli_area > div {
    flex-shrink: 0;
}
.list_area .subject {
    font-size: 14px;
    
}
.list_area .desc {
    font-size: 12px;
    margin-bottom: 8px;
}
.list_area .desc > div{
    align-items: center;
    gap:5px;
}
.list_area .reporter .point_tag .point{
/*        display: none;*/
}
.list_area .point_tag {
    padding-top: 0;
}
.list_area .point_tag .point {
    font-size: 12px;
    padding: 2px 5px;
    padding-bottom: 4px;
}
.list_area .details .col-06 {
    flex-flow: column;
    padding: 4px;
}
.list_area .details .col-06 .tag_area {

}
.list_area .details .price_ {
    text-align: left;
    width: 100%;
    font-size: 12px;
}
.list_area .details .price_ > div {
    display: flex;
    justify-content: space-between;
}

.listTab_area {
    overflow-x: scroll;
    margin-bottom: 0;
    height: auto;
/*        padding: 15px 10px;*/
    padding:0;
}

.listTab_area::-webkit-scrollbar {
    height: 0;
    background-color: transparent;
 }
.listTab_area::-webkit-scrollbar-thumb {
    background-color: transparent;
    opacity: 0;
 }
.listTab_area::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
 }

.listTab_area ul {
    padding-right: 15px;
}
.listTab_area ul li a {
    font-size: 12px;
    min-width: 45px;
    flex-direction: column;
}
.listTab_area ul li a img{
    display: inline-block;
    max-width: 40px;
}
.listTab_area ul li + li {
    margin-left: 0;
}

.listTab_area:not(.wait) ul li.active{
    border: none;
}
/*.listTab_area ul:after {
    content: "";
    min-width: 120px;
    height: 100%;
}*/

.list_area ul li + li:not(.pagenate ul li){
    margin-left: 0;
}


.text_banner_area {
    margin: 15px;
    margin-top: 0;
    padding: 15px;
    height: 100%;
    background-size: cover;
    border-radius: 5px;
}
.text_banner_area .tit {
    font-size: 12px;
}
.text_banner_area .desc {
    font-size: 12px;
    /* white-space: nowrap; */
    word-break: keep-all;
}


/* 체크박스 */
.checkbox_ label {
    font-size: 14px;
    line-height: 20px;
}
.checkbox_ input + label {
    align-items: flex-start;
    word-break: keep-all;
    font-size: 12px;
}
.checkbox_ input + label:before {
    width: 18px;
    height: 18px;
    background-size: contain;
    flex-shrink: 0;
    margin: 0;
}
.checkbox_ input:checked + label:before {
/*
    box-shadow: 0px 1px 3px #3ccbdb;
    -webkit-box-shadow: 0px 1px 3px #3ccbdb;
*/
}

.checkbox_.round input + label:before {
    width: 20px;
    height: 20px;
}

.field_wrap:first-of-type > h5{
    font-size: 16px;
}

/* 입력 */
.field_wrap {
    padding-top: 30px;
}
.field_wrap + .field_wrap {
    margin-top: 35px;
}
.field_area + .field_area  {
    margin-top: 14px;
}
.field_area .field {
    padding: 0;
    height: auto;
    border-radius: 5px;
    background-color: transparent;
    flex-wrap: wrap;
}
.field_area .field > label {
    flex-grow: 1;
    font-size: 14px;
    width: 100%;
}
.signin_area .field_area .field > label{
    width: 80px;
    font-weight: 400;
}
.field_area .field > input,
.field_area .field > select {
    font-size: 14px;
    /* background-color: #F5F5FA; */
    /* border-radius: 5px; */
    margin-top: 5px;
    padding: 8px;
    height: 50px;
}
.field_area .verify_ {
    flex-wrap: nowrap;
}
.field_area .verify_ .btn {
    margin-top: 25px;
    height: 50px;
    width: 90px;
}
.field_area .field_alert {
    margin-top: 4px;
    font-size: 12px;
}
.form_area .btn_area {
    height: 45px;
    font-size: 16px;
    border-radius: 8px;
    margin-top: 30px;
    padding: 0;
}
.form_area .btn_area .btn,
.form_area .btn_area button {
    font-size: 16px;
    border-radius: 8px;
}

/* select */
.selectBox__ .select__ {
    padding-right: 26px;
    background-position: right 10px center;
    width: 130px;
}
.selectSort2 .selectBox__ .select__{
    min-width: 130px;
}
.list_area > .tool .selectFilter .list__{
    width: 130px;
}
.selectBox__ .list__ li .text{
    display: flex;
    align-items: center;
    gap:5px;
}

/* icon */
i.icon {
    width: 16px;
    height: 16px;
}


/* checkbox */
.check_area .checkbox_ {
    margin: 0;
}

.checkbox_.tab {

}
.checkbox_.tab input + label {
    border-radius: 4px;
    align-items: center;
    font-size: 12px;
}
 .checkbox_.tab input + label .icon {
    margin-right: 4px;
}
.checkbox_.tab input:checked + label {
    color: #fff;
    background-color: var(--primary-color);
}
/*
.checkbox_.tab input:checked + label i.camera {
    background-image: url(../img/icon/fe/camera_a.svg);
}
.checkbox_.tab input:checked + label i.hood {
    background-image: url(../img/icon/fe/hood_a.svg);
}
.checkbox_.tab input:checked + label i.back {
    background-image: url(../img/icon/fe/back_a.svg);
}
.checkbox_.tab input:checked + label i.shirt {
    width: 18px;
    background-image: url(../img/icon/fe/shirt_a.svg);
}
.checkbox_.tab input:checked + label i.beauty {
    width: 18px;
    background-image: url(../img/icon/fe/beauty_a.svg);
}
.checkbox_.tab input:checked + label i.pacifier {
    width: 18px;
    background-image: url(../img/icon/fe/pacifier_a.svg);
}
.checkbox_.tab input:checked + label i.dumbbell {
    width: 14px;
    background-image: url(../img/icon/fe/dumbbell_a.svg);
}
.checkbox_.tab input:checked + label i.phone {
    width: 14px;
    background-image: url(../img/icon/fe/phone_a.svg);
}
.checkbox_.tab input:checked + label i.stamp {
    background-image: url(../img/icon/fe/stamp_a.svg);
}
*/

.chip_cont.check_area{
    padding: 0;
    gap: 15px 20px;
}
.chip_cont.check_area .checkbox_ label{
    height: auto;
    display: flex;
    flex-direction: column;
    border: none;
    padding: 0;
    width: auto;   
}


/* 로그인 가입*/
.log_wrap {
    padding-top: 50px;
}
/*
.log_wrap .title {
    display: none;
}
*/

.log_wrap .form_area{
    padding: 20px;
    border: none;
    box-shadow: none;
    margin-bottom: 0;
}
/*
.log_wrap > .form_area {
    padding: 20px;
    border: none;
    box-shadow: none;
    margin-bottom: 0;
}
*/

.sng_sign {
    margin-bottom: 40px;
}
.sng_sign ul li {
    width: 50px;
    height: 50px;
}
.sng_sign ul li + li {
    margin-left: 10px;
}

.useType_ .check_wrap {
    height: 45px;
}
.useType_ .check_wrap .check_ {
    width: 52%;
    font-size: 14px;
}
.check_ input:checked + label img {
    margin-right: 5px;
    width: 14px;
}

.term_wrap .term {
    font-size: 14px;
    height: auto;
}
.term_wrap .term.allCehck {
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 20px;
}
.term_wrap > ul li + li {
    margin-top: 10px;
}
.term_wrap .term .drop_btn {
    font-size: 12px;
    width: 84px;
}
.term_wrap .dorp_wrap .text {
    font-size: 12px;
    font-weight: 300;
}

/* 로그인 */



.log_wrap .title{
    margin-bottom: 0;
    padding-bottom: 20px;
}
.signin_area .field_area + .field_area {
    margin-top: 14px;
}
.signin_area .field_area .field {
    flex-flow: row;
    align-items: flex-start;
    border: none;
    align-items: center;
    padding: 0 20px;
}
.signin_area .field_area .field input {
    width: 100%;
    margin-top: 0px;
}

.quick_signup {
    margin: 0 0;
    margin-bottom: 30px;
}
.quick_signup li:first-child img {
    height: 16px;
}
.quick_signup a {
    height: 60px;
    font-size: 16px;
}
.quick_signup a img {
    height: 22px;
    margin-right: 10px;
}


/* 포인트 */
.ct_title {
/*        display: none;*/
    font-size: 18px;
    padding: 15px;
    padding-bottom: 0;
    margin-bottom: 0;
}
.aside_section .inner {
    padding-top: 0;
}
.aside_section .inner > .content {
    width: 100%;
}
.aside_section .inner > .content > .account_title {
    margin-bottom: 0;
    padding-top: 20px;
}

.aside_section .inner > .content > .account_title.PC_content{
    display: none;
}
.aside_section .inner > .content > .account_title button{
    margin-bottom: 0;
    padding: 8px;
}
.aside_section .inner .account_title button{
    margin-bottom: 0;
    padding: 8px;
    position: absolute;
    right: 15px;
    color: #222;
}
.aside_section .inner > .content > .account_title .ct_title{
    padding-top: 0;
    padding-right: 0;
}
.point_area {
    flex-flow: column;
    height: auto;
    padding: 20px 10px;
    border-radius: 0;
    margin-bottom: 0;
    border-bottom: 4px solid #eee;
}
.point_area > div {
    flex-wrap: wrap;
}
.point_area > div:first-child {
    font-size: 14px;
    margin-bottom: 20px;
}
.point_area > div:first-child img {
    width: 24px;
    margin-right: 6px;
}
.point_area > div:last-child {
    flex-wrap: nowrap;
    width: 100%;
    justify-content: space-between;
    max-width: 330px;
}
.point_area .point_ {
    margin-right: 25px;
    font-size: 14px;
}
.point_area .point_ p:last-child {
    font-size: 24px;
}
.point_area .btn_ {
    font-size: 14px;
    width: 150px;
    height: 40px;
}
.point_area .btn_ img {
    width: 14px;
}

.withdraw_history {
    padding: 15px;
}
.withdraw_history .tool {
    flex-wrap: wrap;
    gap:15px;
}
.withdraw_history .tool h1 {
    font-size: 16px;
}
.withdraw_history .details_ {
    flex-flow: column;
    align-items: flex-start;
}
.withdraw_history .details_ span {
    font-size: 12px;
    padding: 0px 6px;
    padding-bottom: 2px;
}
.withdraw_history .details_ p {
    font-size: 12px;
}
.withdraw_history .details_ div:last-child {
    margin-left: 0;
    font-size: 14px;
}

.withdraw_history ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.withdraw_history ul li {
    padding: 10px;
    /* border: 0;
    border-bottom: 1px solid #e7e7e7;
    border-radius: 0; */
}
.withdraw_history ul li + li {
    margin-top: 0;
}
.withdraw_history + .btn_area {
    margin-top: 10px;
    margin-bottom: 100px;
}

.withdraw_history > .tool > div.right_cont{
    justify-content: space-between;
    width: 100%;
}

.withdraw_history .quick_select_area{
    gap:5px;
}

.quick_select_area .filter-button{
    font-size: 12px;
    padding: 5px 10px;
    
}
.withdraw_history .select__wrap{
    flex-grow: 0;
}




.list_area > .tool .selectSort2, 
.withdraw_history > .tool .selectSort2 {
    width: 100%;
}
.list_area > .tool .selectBox__ .select__, 
.withdraw_history > .tool .selectBox__ .select__ {
    height: 34px;
    font-size: 12px;
    padding-left: 12px;
    border-radius: 4px;
}


/* 캼페인 상세 */
.compain_detials {
    padding-right: 0;
    min-height: auto;
}
.compain_detials .side_area {
    position: fixed;
    width: 100%;
    padding-top: 20px;
    z-index: 10;
    top: calc(100dvh - 160px);
}
.compain_detials .side_area.on{
    top: calc(100dvh - 160px);
}
.compain_detials .side_area .apply_area {
    border-radius: 0;
    padding: 15px;
    border-top: 1px solid #eee;
    border-bottom: 4px solid #eee;
}
.apply_area dl {
/*        justify-content: space-between;*/
    margin-bottom: 8px;
}
.apply_area .option_ {
    padding-top: 15px;
}
.compain_detials .btn_area {
    padding: 0;
    margin-top: 15px;
}

.apply_area .btn_area {
    position: fixed;
    left: 0;
    bottom: 66px;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
    z-index: 8000;
    border: 5px solid #fff;
}
.apply_area .btn_area .submitBtn {
    margin-right: 0px;
    border-radius: 0;
    height: 50px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    order: 2;
}
.apply_area .btn_area .favBtn {
    border-radius: 0;
    width: 50px;
    height: 50px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.side_area.on .apply_area .btn_area_MO{
    display: none;
}
.side_area .apply_area .btn_area_MO{
    display: flex;
}
.compain_detials .head .tool {
    top: auto;
    height: 24px;
    bottom: 20px;
}
.compain_detials .head .tool.PC_content{
    display: none;
}
.compain_detials .head .tool.MO_content{
    /* bottom: initial; */
}
.compain_detials .head .details{
/*        justify-content: space-between;*/
    flex-wrap: wrap;
    row-gap:10px;
    flex-direction: column;
    align-items: flex-start;
}

.compain_detials .head {
    padding: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
/*        margin-top: 66px;*/
    display: flex;
    gap:10px;
}
.compain_detials .head .imgBox{
    max-width: 100px;
    max-height: 100px;
    
}
.compain_detials .head .imgBox img{
    width: 100%;
    border-radius: 8px;
    object-fit: cover;
}
.compain_detials .head h1 {
    font-size: 18px;
    display: none;
}
.compain_detials .head .comment {
    font-size: 14px;
}
.compain_detials .head .tag_area {
    margin-top: 10px;
    font-size: 12px;
}

.compain_detials .head .tag_area .smartstore,
.compain_detials .head .tag_area .coupang,
.compain_detials .head .tag_area .gmarket,
.compain_detials .head .tag_area .auction,
.compain_detials .head .tag_area .elevenst,
.compain_detials .head .tag_area .musinsa,
.compain_detials .head .tag_area .idus,
.compain_detials .head .tag_area span {
    margin-right: 6px;
}
.compain_detials .head .desc.MO_content{
    font-size: 12px;
    padding-top: 10px;
}
.compain_detials .content {
    padding-top: 0;
}
.compain_detials .hide_area .wrap {
/*        height: 400px;*/
}
.compain_detials .hide_area .moreBtn {
    border-radius: 4px;
    width: auto;
    margin: 15px;
    font-size: 14px;
}
.compain_detials .hide_area .moreBtn img {
    width: 10px;
}
.compain_detials .hide_area .btn_area {
    padding: 10px 15px;
    margin-top: 0px;
}
.compain_detials .hide_area .btn_area .submitBtn {
    width: 100%;
}
.compain_detials .guide_area.campaign_{
    border-top: none;
    border-bottom: 1px solid #ddd;
    padding-bottom: 0;
    margin-bottom: 15px;
    padding-top: 15px;
    margin-top: 0;
}
.compain_detials .guide_area {
    padding: 20px 15px;
    margin-top: 20px;
    border-top: 4px solid #eee;
}
.compain_detials .guide_area > .title {
    display: none;
}
.compain_detials .guide_area > .title img {
    height: 24px;
}

.guide_area .icon_box{
    padding-top: 10px;
}

.guide_area .guide_list {
    margin-top: 0px;
    border-top: 0;
    margin-bottom: 15px;
}


.guide_area.campaign_ .guide_list li{
    border-top: 0;
    padding-top: 0;
    border-bottom: none;
    padding: 0;
    padding-bottom:0;
}
.guide_area .guide_list li {
    flex-flow: column;
    padding: 20px 0;
}
.guide_area .guide_list li .text_ {
    font-size: 14px;
    margin-top: 10px;
}
.guide_area .guide_notice {
    border-radius: 8px;
    padding: 18px;
}
.guide_area .guide_notice > h1 {
    font-size: 14px;
}
.guide_area .guide_notice > h1 .exmark {
    margin-right: 8px;
}
.guide_area .guide_notice .desc {
    font-size: 12px;
}

.smartstore, .coupang, .gmarket, .auction, .elevenst, .musinsa, .idus {
    padding: 2px 5px;
}
.compain_detials .share_area {
    padding: 0;
    font-size: 12px;
    margin-right: 15px;
}
.shareBtn img {
    width: 12px;
    margin-right: 5px;
    margin-top: 2px;
}

.compain_detials .side_area .list_area .appli_area,
.compain_detials .side_area .list_area .desc {
    margin-bottom: 14px;
}
.compain_detials .side_area .apply_area {
    margin-top: 15px;
    
}
.compain_detials .side_area.on .apply_area{
    bottom: 126px;
    position: fixed;
    width: 100%;
    border-radius: 15px 15px 0 0;
    box-shadow: -2px -2px 4px 0px rgba(0, 0, 0, 0.25);
    padding-bottom: 30px;
}
.compain_detials .side_area.on .sheet_head{
    display: block;
    text-align: center;
    line-height: 1;
    padding-bottom: 20px;
    width: fit-content;
    margin: 0 auto;
}
.submitBtn:not(.disabled):hover{
    background-color: var(--primary-color);
    color: #fff;
}

.compain_detials .side_area .list_area {
    display: none;
}
.compain_detials .side_area .list_area .details {
    padding-bottom: 0;
    margin-left: 15px;
    width: 170px;
}
.compain_detials .side_area .list_area .imgBox {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
}
.compain_detials .side_area .list_area .tag_area {
    margin: 0;
}
.compain_detials .side_area .list_area .appli_area {
    margin-bottom: 0;
    margin: 4px 0;
}
.list_area .desc span.opt_name {
/*        width: 260px;*/
    flex: 1;
}
.list_area .desc .point_desc {
    width: 300px;
}
.compain_detials .side_area .list_area .desc{
    margin-bottom: 8px;
}
.compain_detials .side_area .list_area .point_tag .point {
    margin-bottom: 0;
}

/* 등급 페이지 */
.aside_section.my_grade .inner > .content{
    padding: 20px;
}
.my_grade .ct_title{
    padding: 0;
    font-weight: 700;
}
.aside_section.my_grade .inner > .content h2{
    font-size: 16px !important;
    margin: 20px 0 !important;
}
.aside_section.my_grade .inner > .content h2 span.desc{
    display: inline-block;
    font-size: 12px !important;
}
.aside_section.my_grade .inner > .content h2 span.desc ~ p{
    font-size: 12px !important;
}

.aside_section.my_grade .current_situation{
    gap:10px;
}
.aside_section.my_grade .current_situation > div > div {
    padding: 10px !important;
/*        width: 140px !important;*/
}
.aside_section.my_grade .current_situation .left_box{
    gap:10px;
}

.aside_section.my_grade .current_situation .left_box div{
    height: auto !important;
    flex: 1;
    margin: 0 !important;
    justify-content: center;
}
.aside_section.my_grade .current_situation .left_box > div{
    width: 140px !important;
}
.aside_section.my_grade .current_situation .left_box div span{
    font-size: 14px !important;
}
.aside_section.my_grade .current_situation .left_box div span:last-child{
    font-size: 16px !important;
}
.aside_section.my_grade .current_situation .right_box{
    width: 100% !important;
    height: auto !important;
    padding: 10px !important;
}
.aside_section.my_grade .current_situation .right_box > div{
    width: 100% !important; 
    padding: 0 !important;
    font-size: 12px;
    text-align: left;
    word-break: keep-all;
    gap:5px;
}
.aside_section.my_grade .current_situation .right_box div span{
    flex-basis: initial !important;
    font-size: 12px;
}
.aside_section.my_grade .current_situation .right_box div span:first-child{
    min-width: 60px;
    max-width: 95px;
    width: 100% !important;
}
.aside_section.my_grade .current_situation .right_box .progressbar{
    width: 60% !important;
}
.aside_section.my_grade .current_situation .right_box div span:last-child{min-width: 32px;}
.aside_section.my_grade .current_situation .right_box div span div{}

.aside_section.my_grade .grade_guide{
    display: none;
}
.aside_section.my_grade .ul_grade_guide{
    display: none;
}
.aside_section.my_grade .blog_gread_text{
    display: block;
}
.my_grade .tooltip .tooltip_text{
    left:-135px;
    top: 30px;
}
.my_grade .tooltip .tooltip_text::before{
    left: 134px;
}
.guide_detail{
    display: flex;
    gap:10px;
    align-items: center;
}
.guide_detail img{
    display: inline-block;
}



/* 프로필편집 */
.myprofile_{
    flex-direction: column;
}
.profile_modify .myprofile_ {
    flex-flow: column;
/*        padding: 15px;*/
/*        padding-bottom: 20px;*/
    margin-bottom: 0px;
/*        border-bottom: 4px solid #eee;*/
}
.myprofile_ > div {
    width: 100%;
}
.myprofile_ .profile_card {
    width: 100%;
    flex-direction: row;
    gap:20px;
}
.myprofile_ .btn_ {
    display: block;
    width: 100%;
    text-align: center;
    padding: 11px;
}
.profile_card .profile_img {
    margin-right: 0;
    margin-bottom: 10px;
    width: 70px;
    height: 70px;
}
.profile_edit .profile_card .profile_img{
    margin: 0 auto;
}
.profile_edit .mofidy_area {
    padding: 15px;
    padding-top: 10px;
}
.field_area .field .SNS_ .icon {
    flex-shrink: 0;
    width: 44px;
    margin-right: 8px;
    border-radius: 6px 0 0 6px;
}
.field_area .field .SNS_ li {
    height: 44px;
    font-size: 12px;
    border-radius: 0 6px 6px 0;
}
.field_area .field .SNS_ li > div:nth-child(3) {
    flex-grow: 1;
} 
.field_area .field .SNS_ li input {
    width: 100%;
}
.field_area .field .item .alert {
    padding-left: 0;
    word-break: break-all;
    flex-wrap: wrap;
    font-size: 12px;
    margin-top: 5px;
}
.field_area .field .item input, 
.field_area .field .verify_ input {
/*        min-height: 44px;*/
    border-radius: 5px;
    padding: 8px;
    font-size: 14px;
}
.field_area .field .verify_ button {
    height: 44px;
    width: 70px;
}
.field_area .field .verify_ + input {
    margin-top: 5px;
}



.mofidy_area {
/*        padding: 15px;*/
    padding-top: 10px;
}
.mofidy_area + .mofidy_area {
    border-top: 1px solid #E7E7E7;
    padding: 20px 15px;
    margin-top: 10px;
}
.mofidy_area .field_area .field + .field,
.profile_modify .mofidy_area .field_area .field + .field {
    margin-top: 10px;
    padding: 10px;
    border-radius: 10px;
}
.profile_modify .mofidy_area .field_area .field + .field.sns_area{
    padding: 0;
    border: none;
}
.mofidy_area .field_area .field > label {
    margin-bottom: 5px;
    font-size: 14px;
}
.mofidy_area .field_area .field > input,
.mofidy_area .field_area .field > textarea, 
.mofidy_area .field_area .field .select__ {
    font-size: 14px;
    border-radius: 6px;
    padding: 8px;
    min-height: 44px;
    margin-top: 0px;
}
.mofidy_area .field_area .field > textarea {
    min-height: 160px;
}
.mofidy_area .btn_area {
    margin-top: 20px;
    margin-bottom: 0px;
    padding: 0;
}
.mofidy_area .btn_area .submitBtn {
    width: 100%;
}
.mofidy_area .btn_area.between .subBtn {
    margin-left: 10px;
}
.notice_check {
    margin-left: 0;
    margin-top: 15px;
}



/* modal */
.modal-layer {
    border-radius: 8px;
    margin: 0 12px;
}
.modal-layer .head {
    flex-shrink: 0;
    height: 60px;
    font-size: 14px;
    padding: 0 15px;
}
.modal-layer .head h1 {
    font-size: 16px;
}
.modal-layer .content {
    flex-grow: 1;  
    height: calc(100% - 60px);      
    overflow-y: scroll;
    padding: 15px;
}
.modal-layer .field label {
    width: 105px;
}
.modal-layer .field .selectBox__,
.modal-layer .check_wrap {
    margin-top: 5px;
}
.modal-layer .check_wrap .checkbox_ label {
    font-size: 14px;
}
.modal-layer .check_wrap .checkbox_ input {
    min-height: 100%;
}

.modal-layer .field input, 
.modal-layer .field .selectBox__ .select__ {
    height: 45px;
    padding-left: 8px;
    border-radius: 5px;
    font-size: 14px;
}
.modal-layer .btn_area {
/*        padding: 0;*/
}
.modal-layer .submitBtn {
    width: 100%;
}
.modal-layer .closer {
    width: 40px;
    margin-right: -10px;
    background-size: cover;
}
.modal-layer .notice_ i {
    margin-right: 8px;
}

.modal-layer .check_area {
    margin-top: 15px;
}



#widthdraw .modal-layer {
    width: 90vw;
    height: 90vh;
}
#widthdraw .modal-layer .content::-webkit-scrollbar {
    width: 0px;
    background-color: transparent;
}
#widthdraw .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: transparent;
    border: 0px solid transparent;
    border-radius: 0px;
    cursor: pointer;
    opacity: 0;
}
#widthdraw .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
#widthdraw .field_area input + .check_wrap {
    /* margin-top: 10px; */
}
#widthdraw .point_ {
    font-size: 14px;
    padding-left: 0;
}
#widthdraw .notice_ {
    border-right: 8px;
    padding: 15px;
}
.modal-layer .notice_ h1 {
    font-size: 14px;
    position: relative;
}
#widthdraw .notice_ .desc {
    font-size: 12px;
}
.withdraw_history + .btn_area {
    margin-bottom: 15px;
}
.list_area > .tool .selectBox__ .list__, 
.withdraw_history > .tool .selectBox__ .list__ {
    border-radius: 4px;
}


/* 알림함 */
.notice_lsit .list {
    padding: 15px;
}
.notice_lsit .tool {
    padding: 15px;
    margin-bottom: 0;
    padding-bottom: 0;
}
.notice_lsit .tool .btn_ {
    width: 100%;
    text-align: center;
}
.notice_lsit .list li {
    border-radius: 5px;
    padding: 12px;
    padding-left: 45px;
    min-height: 50px;
    background-position: left 15px center;
    background-size: 15px;
    font-size: 14px;
}
.notice_lsit .list li + li {
    margin-top: 5px;
}
.notice_lsit .list .msg:before {
    width: 4px;
    height: 4px;
    left: -4px;
    top: 0;
}

/* page */
.pagenate {
    margin: 15px 0;
}
.pagenate ul a {
    width: 30px;
    height: 30px;
    font-size: 12px;
}
.pagenate ul a img {
    width: 100%;
    vertical-align: top;
}
.my_campaign .pagenate{
    background: #fff;
    padding: 15px 0;
    margin: 0;
}

/* 계정 설정 */
.auto_chain ul {
    flex-flow: column;
    align-items: flex-start;
}
.auto_chain ul li {
    border-radius: 4px;
    font-size: 12px;
}
.auto_chain ul li + li {
    margin-left: 0;
    margin-top: 10px;
}
.auto_chain ul li > div {
    padding: 8px;
    height: 45px;
}
.auto_chain ul li .icon {
    width: 45px;
}
.auto_chain ul li:first-child .icon img {
    width: 16px;
}
.auto_chain ul li:last-child .icon img {
    width: 20px;
}

/* 자주묻는 질문 */
.customer_tool {
    padding: 20px 15px;
    border-radius: 0;
    border-bottom: 4px solid #eee;
}
.customer_tool .search_ {
    flex-wrap: wrap;
    height: auto;
    gap:15px;
    
}
.customer_tool .search_ > div:first-child {
    width: fit-content;
    margin-right: 0;
    margin-bottom: 5px;
    font-size: 14px;
    flex: initial;
}
.customer_tool .search_ input,
.customer_tool .search_ .submitBtn {
    height: 44px;
    font-size: 12px;
    padding: 0 12px;
    width: auto;
    flex: 1;
}
.customer_tool .search_ .submitBtn {
    width: 80px;
    margin: 0;
}

.faq_tab_area {
    margin: 0;
    overflow-x: scroll;
    width: 100%;
}
/*    .faq_tab_area ul:before,
.faq_tab_area ul:after {
    content: "";
    width: 15px;
    height: 41px;
    flex-shrink: 0;
}*/
.faq_tab_area ul {
    flex-wrap: wrap;
    justify-content: flex-start;
    border-radius: 0;
    background-color: #fff;
}
.faq_tab_area ul li {
    flex: 0 1 19%;
    white-space: nowrap;
    flex-shrink: 0;
    margin: 0;
}
.faq_tab_area ul li a {
    height: 40px;
    font-size: 12px;
    padding: 0 10px;
    border-radius: 0;
    background-color: #fff;
    border-bottom: 3px solid #fff;
    opacity: 0.8;
}
.faq_tab_area ul li.active a {
    color: #3CCBDB;
    border-bottom: 3px solid #3CCBDB;
    background-color: #fff;
    box-shadow: none;
    opacity: 1;
}
.faq_his_area ul {
    border-top: 1px solid #eee;
}
.faq_his_area .subject_ {
    flex-wrap: wrap;
    height: auto;
    padding: 15px;
}
.faq_his_area .subject_ span:first-child {
    width: 100%;
    padding: 0;
    font-size: 12px;
    margin-bottom: 8px;
}
.faq_his_area .subject_ .Q, 
.faq_his_area .drop_ .A {
    width: 24px;
    height: 24px;
    font-size: 12px;
    margin-right: 8px;
}
.faq_his_area .subject_ .conetnet {
    flex-basis: 0;
    flex-grow: 1;
    font-size: 14px;
}
.faq_his_area .subject_ .dropBtn {
    width: 24px;
    height: 24px;
    margin-right: 0;
}
.faq_his_area .drop_ {
    margin-bottom: 0;
}
.faq_his_area .drop_ > div {
    padding: 15px;
}


/* divtable */
.divTable .thead_ {
    display: none;
}
.divTable dl {
    position: relative;
    width: 100%;
}
.divTable dl dd {
    justify-content: flex-start;
    height: auto;
    padding: 0;
}
.divTable .subject {
    width: 100%;
}
.divTable .subject p, 
.divTable .subject a {
    white-space: normal;
    line-height: 1.4em;
    max-height: 2.8em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-align: left;
}



.modal-dialog.customModal{
height: calc(100dvh - 67px);
}

#customModal .closer {
position: static;
left: 0;
top: 0;
transform: none;
width: 13px;
height: 26px;
background-image: none;
margin: 0;
}
#customModal .check_area{
gap:15px 20px;
}
#customModal .modal-layer{
margin: 0;
height: calc(100dvh - 117px);
max-width: none;
max-height: none;
border-radius: 0;
}
#customModal .modal-layer .content{
/* height: calc(100% - 85px - 72px);  */
padding: 20px;
}

#customModal .modal-layer .head{
background: var(--primary-color);
color: #fff;
padding: 19px 15px;
height: initial;
font-size: 18px;

justify-content: flex-start;
gap: 30px;
}

#customModal .modal-layer .field_area .field{
flex-direction: column;
align-items: flex-start;
}
#customModal .modal-layer .field + .field{
margin-top: 30px;
}

#customModal .modal-layer .btn_area{
/* position: fixed; */
bottom: 82px;
left: 0;
width: 100%;
margin: 0;
padding: 15px;
padding-bottom: 0;
background: #fff;
}
#customModal .modal-layer .btn_area .submitBtn{
line-height: 1;
padding: 18px 0 ;
border-radius: 10px;
font-size: 16px;
height: auto;
}

/* 문의내역 */
.Inquire_his_area .divTable {
    margin-top: 0;
    border-top: 0;
}
.Inquire_his_area .divTable .empty {
    margin-top: 50%;
}
.Inquire_his_area dl {
    flex-flow: wrap;
    justify-content: flex-start;
    padding: 15px;
}
.divTable dl dt, 
.Inquire_his_area dl dd:nth-child(1),
.Inquire_his_area dl dd:nth-child(2),
.Inquire_his_area dl dd:nth-child(4),
.Inquire_his_area dl dd:nth-child(5) {
    width: auto;
}
.Inquire_his_area dl dd:nth-child(1) {
    display: none;
}
.Inquire_his_area dl dd:nth-child(2) {
    font-size: 12px;
    margin-bottom: 10px;
    line-height: 20px;
}
.Inquire_his_area dl dd:nth-child(3) {
    width: 100%;
    margin-bottom: 5px;
    font-size: 14px;
}
.Inquire_his_area dl dd:nth-child(4) {
    width: 100%;
    font-size: 12px;
    margin-bottom: 5px;
}
.Inquire_his_area dl dd:nth-child(5) {
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 15px;
    font-size: 10px;
}
.Inquire_his_area .state_ {
    padding: 2px 6px;
}

.Inquire_his_area dl dd:nth-child(6) {
    position: absolute;
    top: 0;
    right: 0;
    margin: 15px;
    width: auto;
}
.Inquire_his_area .removeBtn {
    width: 20px;
    height: 20px;
}
.Inquire_his_area .removeBtn img {
    width: 100%;
}

.answer_area {
    padding: 0;
}
.answer_area .request_, 
.answer_area .response_ {
    padding: 15px;
}
.answer_area .writer_ .profile_ {
    width: 24px;
    height: 24px;
    background-size: 10px;
    margin-right: 8px;
}
.answer_area .writer_ .name {
    font-size: 14px;
    margin-right: 10px;
}
.answer_area .writer_ .date {
    font-size: 11px;
    margin-top: 0px;
}
.answer_area .comment_ {
    padding-left: 0;
    font-size: 14px;
}

.customer_tool .search_ input{
    flex-grow: initial;
    flex: 4;
}

.customer_tool .Inquire_ {
    padding: 0;
    height: auto;
    flex-flow: column;
    align-items: flex-start;
    word-break: keep-all;
    font-size: 14px;
}
.customer_tool .Inquire_ .submitBtn {
    width: 100%;
    height: 44px;
    font-size: 14px;
    margin-top: 15px;
}
.faq_his_area li.non_result{
    font-size: 14px;
    padding: 60px 0;
}

/* 1:1 문의 */
.Inquire_area {
    padding: 0;
    border-top: 0;
}
.Inquire_area .select__wrap {
    max-width: 100%;
}
.Inquire_area .editor_ > label, 
.Inquire_area .top_ > label {
    padding-top: 0;
}
.uploader {
    width: 100%;
}
.uploader .inp_ {
    flex-grow: 1;
    width: 100%;
    min-height: 44px;
    border-radius: 8px;
}
.uploader .uploadBtn {
    flex-shrink: 0;
    height: 44px;
    font-size: 14px;
    margin-left: 5px;
}
.uploader + .files {
    margin-bottom: 15px;
}
.uploader + .files .item {
    font-size: 12px;
}
.uploader + .files .item .close {
    width: 20px;
    height: 20px;
    background-size: contain;
    margin-left: 5px;
    margin-top: 2px;
}
.Inquire_area .btn_area {
    margin-top: 0;
    flex-wrap: wrap;
}
.Inquire_area .btn_area .btn {
    width: 100%;
    height: 44px;
    border-radius: 4px;
    font-size: 14px;
    margin-left: 0;
    margin-top: 10px;
}

/* 공지사항 */
.customer_his_area .divTable {
    margin-top: 0;
    border-top: 0;
}
.customer_his_area dl {
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 15px;
}
.customer_his_area dl dd:nth-child(1) {
    display: none;
}
.customer_his_area dl dd:nth-child(2) {
    width: 100%;
    font-size: 12px;
    margin-bottom: 3px;
}
.customer_his_area dl dd:nth-child(3) {
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}
.customer_his_area dl dd:nth-child(4),
.customer_his_area dl dd:nth-child(5) {
    font-size: 12px;
    width: auto;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 20px;
    margin-right: 8px;
    background-size: 14px;
    color: #999;
}
.customer_his_area dl dd:nth-child(4) {
    background-image: url(../img/icon/fe/calendar.svg);
}
.customer_his_area dl dd:nth-child(5) {
    background-image: url(../img/icon/fe/eye.svg);
}


/* 공지사항 상세 */
.customer_details .head {
    border-top: 0;
    height: auto;
    padding: 15px;
    flex-flow: column;
    align-items: flex-start;
}
.customer_details .subject {
    flex-flow: column;
    align-items: flex-start;
}
.customer_details .subject span {
    font-size: 12px;
}
.customer_details .subject h1 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 10px;
}

.customer_details .tool .date,
.customer_details .tool .views {
    font-size: 12px;
    width: auto;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 20px;
    margin-right: 8px;
    background-size: 14px;
    color: #999;
}
.customer_details .tool .views {
    margin-left: 0px;
}
.customer_details .conetent {
    border-color: #eee;
    padding: 25px 15px;
    font-size: 14px;
    min-height: 200px;
}
.customer_details .btn_area {
    margin: 20px 0;
}
.customer_details .btn_area .btn {
    width: 100%;
    height: 44px;
    border-radius: 4px;
    font-size: 14px;
}
.customer_details .btn_area .btn img {
    margin-right: 8px;
}


/* 프로필 보기 */
.review_details {
    padding: 0;
    padding-bottom: 40px;
}
.review_details .profile_details {
    position: relative;
    margin-bottom: 10px;
}
.review_details .profile_details:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 37%;
    background-color: #fff;
    z-index: 0;
}
.profile_details {
    flex-flow: column;
    background-color: #3CCBDB;
    border-radius: 0;
    color: #fff;
    padding: 20px 15px;
}
.profile_details .profile_area {
    width: 100%;
    justify-content: space-between;
    margin-right: 0;
}
.profile_details .profile_area .profile_img {
    width: 50px;
    height: 50px;
    margin-right: 13px;
    background-size: 22px;
}
.profile_details .profile_area .profile_info .email {
    color: #fff;
    font-size: 13px;
    margin-top: 0;
}
.profile_details .profile_area .favBtn {
    color: transparent;
    font-size: 0;
    width: 45px;
    height: 45px;
    padding-left: 45px;
    background-position: center;
    overflow: hidden;
}
.profile_details .profile_area .zzimBtn {
    color: transparent;
    font-size: 0;
    width: 45px;
    height: 45px;
    padding-left: 45px;
    background-position: center;
    overflow: hidden;
}

.profile_details .notice_ {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    width: 100%;
    height: 40px;
    border-radius: 5px;
    margin-top: 20px;
    padding: 0 17px;
    font-size: 14px;
    color: #222;
}
.profile_details .notice_ > div:first-child {
    color: #9499B4;
    padding-left: 26px;
    background-image: url(../img/icon/fe/ball.svg);
    background-repeat: no-repeat;
    background-position: left center;
}
.profile_details .notice_ .count {
    color: #16B9CB;
    padding-right: 4px;
}


.profile_details .follower_ {
    position: relative;
    margin-top: 10px;
    background-color: #fff;
    border-radius: 5px;
    padding: 20px 15px;
    width: 100%;
    z-index: 10;
/*
    box-shadow: 0px 10px 20px rgba(60,203,219,0.3);
    -webkit-box-shadow: 0px 10px 20px rgba(60,203,219,0.3);
*/
}
.profile_details .follower_ ul {
    flex-flow: column;
}
.profile_details .follower_ ul li {
    width: 100%;
    justify-content: flex-start;
    align-items: center;
}
.profile_details .follower_ ul li + li {
    margin-left: 0;
    margin-top: 15px;
}
.profile_details .follower_ .sns_icon {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    padding: 6px;
    margin-right: 8px;
    flex-shrink: 0;
}
.profile_details .follower_ .sns_icon img {
    max-width: 100%;
}
.profile_details .follower_ .sns_info {
    flex-grow: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: right;
    color: #222;
}
.profile_details .follower_ .sns_info div:last-child {
    display: flex;
    flex-flow: column;
}
.profile_details .follower_ span {
    font-size: 12px;
}
.profile_details .follower_ .value {
    font-size: 14px;
}

.sub_page_tab {
    overflow-x: scroll;
}
.sub_page_tab ul {
    flex-wrap: nowrap;
}
.sub_page_tab ul:before,
.sub_page_tab ul:after {
    content: "";
    width: 15px;
    height: 40px;
    flex-shrink: 0;
}
.sub_page_tab ul li {
    margin-bottom: 0;
}
.sub_page_tab ul li + li {
    margin-left: 4px;
}
.sub_page_tab a {
    width: auto;
    height: 40px;
    font-size: 14px;
    border-radius: 0;
    border: 0;
    background-color: #fff;
    padding: 0 8px;
    border-bottom: 3px solid #fff;
}
.sub_page_tab .active a {
    border-bottom: 3px solid #3CCBDB
}

.about_area {
    padding-top: 10px;
}
.about_area > .title {
    padding: 0 15px;
    font-size: 20px;
    margin-bottom: 0px;
    display: none;
}

.about_profile {
    
}
.about_profile dl,
.about_profile dl dl {
    flex-wrap: wrap;
    flex: 0 1 100%;
    width: 100%;
    border: none;
}
.about_profile > dl + dl {
    padding: 0;
}
.about_profile dl dd,
.flex_center {
    width: 100%;
    flex-flow: column;
    align-items: flex-start;
}
.about_profile dl dd {
    padding: 15px;
    border-bottom: 1px solid #eee;
}
.about_profile dl dd .tit {
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
}
.about_profile dl dd .desc {
    font-size: 14px;
}


/* 찜 리스트 */
.favorite_list {
    padding: 0;
}
.favorite_list ul li,
.favorite_list ul li + li {
    margin: 0;
}
.favorite_list ul li {
    flex: 0 1 100%;
    padding: 20px 15px;
    border-bottom: 1px solid #ddd;
}
.favorite_list .profile_area {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.favorite_list .profile_area .profile_img {
    margin: 0;
    width: 50px;
    height: 50px;
    background-size: 22px;
}
.favorite_list .profile_area .profile_info {
    margin-top: 0;
    margin-left: 10px;
    flex-flow: column;
}
.profile_area .profile_info .lv {
    margin-right: 0;
    padding-right: 0;
    border: none;
    font-size: 12px;
}
.profile_area .profile_info .name {
    font-size: 16px;
}
.meno_area {
    border-radius: 0;
    border: none;
    border-top: 1px solid #eee;
    margin-top: 10px;
    padding: 0;
    padding-top: 10px
}
.meno_area .field {
    font-size: 14px;
}
.meno_area textarea {
    margin-top: 10px;
}



/* 모바일 마이페이지 */
.profile_details .follower_ + :after {
    height: 180px;
}
.follower_ .review_ {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    color: #222;
    font-size: 14px;
    line-height: 1.2em;
}
.follower_ .review_ > div + div {
    margin-left: 20px;
    padding-left: 18px;
    border-left: 1px solid #eee;
}
.follower_ .review_ .icon {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    text-align: center;
    margin-top: 2px;
}
.follower_ .review_ .icon img {
    vertical-align: top;
}
.follower_ .review_ a {
    padding-right: 0;
    background-image: none;
}
.follower_ .review_ > div:first-child {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-flow: column;
}
.follower_ .review_ .tit {
    font-size: 12px;
    color: #9499B4;
}
.follower_ .review_ > div:first-child a{
    color: #16B9CB;
    text-decoration: underline;
    font-size: 12px;
}
.follower_ .review_ .type {
    font-size: 14px;
    padding-right: 7px;
    color: #222;
}
.follower_ .review_ + .btn_area {
    padding: 0;
    margin-top: 20px;
}
.follower_ .review_ + .btn_area .submitBtn {
    width: 100%;
}



/* 모바일 마이페이지 */
.review_details .account_ {
    padding: 0 15px;
}
.review_details .account_ > article {
    padding-bottom: 30px;
}
.review_details .account_ > article + article {
    padding-top: 30px;
    border-top: 1px solid #eee;
}
.review_details .account_ .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.review_details .account_ .title h1 {
    font-size: 20px;
    font-weight: 700;
}
.review_details .account_ .golink_ {
    color: #9499B4;
    font-size: 14px;
    padding-right: 12px;
    background-image: url(../img/icon/tool/arrow_right_c.svg);
    background-repeat: no-repeat;
    background-position: right bottom 5px;
}
.campaign_state {
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    padding: 15px;
    font-size: 14px;
    color: #9499B4;
}
.campaign_state b {
    font-size: 20px;
    font-weight: 900;
    color: #16B9CB;
    padding-bottom: 6px;
}

.review_details .mypoint_ {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    text-align: right;
}
.review_details .mypoint_ .point {
    font-size: 20px;
    font-weight: 900;
    color: #16B9CB;
}
.title + .mobile_link {
    margin-top: 15px;
}
.mobile_link {}
.mobile_link li + li {
    margin-top: 10px;
}
.mobile_link a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    border-radius: 5px;
    border: 1px solid #E7E7E7;
    color: #666;
    font-size: 14px;
}
.review_details .account_ .btn_area {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
.review_details .account_ .btn_area .btn {
    height: 50px;
    color: #3CCBDB;
    border-color: #3CCBDB;
    font-size: 14px;
}

.follower_ .setting_ {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
}
.follower_ .setting_ > div {
    flex: 0 1 50%;
    text-align: center;
}
.follower_ .setting_ a {
    display: block;
    padding: 0;
    background-image: none;
    color: #444;
    font-size: 14px;
}
.follower_ .setting_ img {
    vertical-align: top;
    margin-bottom: 15px;
}



.list_area.col-03 {
    width: 100%;
}
.list_area.col-03 ul li:not(.pagenate ul li) {
    width: 48%;
    margin-left: 0 !important;
}
.list_area.col-03 .details {
    min-height: 120px;
}
.list_area.col-03 li .btn {
    font-size: 12px;
    height: 34px;
    margin-bottom: 10px;
    border-radius: 4px;
}
.list_area.col-03 ul li + li:not(.pagenate ul li) {
    margin-top: 0 !important;
}
.list_area.col-03 .timer {
    font-size: 12px;
    font-weight: 400;
    border-radius: 4px;
}
.list_area.col-03 .cancel {
    font-size: 12px;
    font-weight: 400;
    border-radius: 8px;
    background-color: #fff;
}

.mB {
    display: block !important;
}
.about_area .btn_area {
    padding: 0;
    margin-top: 25px;
}
.aside_section .about_area .list_area {
    padding: 15px;
}
.sub_page_tab + .list_area,
.cmpState_ + .list_area.col-03 {
    margin-top: 25px;
    padding-top: 25px;
    background: #fff;
}

.cmpState_ {
    padding: 15px;
    border-radius: 0;
/*        border-bottom: 4px solid #eee;*/
    background-color: #fff;
}
.cmpState_ ul li {
    font-size: 12px;
}
.cmpState_ ul li b {
    font-size: 20px;
    font-weight: 900;
}


/* 미션제출하기 */
#missionModal .modal-layer {
    max-width: 90vw;
}
 #missionModal .modal-layer .content {
    max-height: calc(100vh - 180px);
    padding-bottom: 20px;
}
 #missionModal .modal-layer .content::-webkit-scrollbar {
    width: 0px;
    background-color: transparent;
}
#missionModal .modal-layer .content::-webkit-scrollbar-thumb {
    background-color: transparent;
    border: 0px solid transparent;
    opacity: 0;
}
#missionModal .modal-layer .content::-webkit-scrollbar-track {
    background-color: transparent;
    opacity: 0;
}
.missionBlock {
    padding: 15px;
    flex-flow: column;
}
.missionBlock > div {
    width: 100%;
}
.missionBlock .imgBox {
    width: 100%;
    height: auto;
    margin-right: 0;
    margin-bottom: 10px;
    border-radius: 8px;
}
.missionBlock .btn {
    width: 100%;
    height: 44px;
    border: none;
}
.my_campaign_detail #buy_mission {
    padding: 15px;
    border-top: 1px solid var(--line-color);
}
.BuyMission .title h1 {
    font-size: 16px;
}
.BuyMission .state {
    font-size: 12px;
    width: 84px;
}
.mission_guide .head {
    height: 40px;
}
.mission_detial {
    flex-flow: column;
}

.mission_detial .uploader_area {
    flex-flow: wrap;
    margin-bottom: 10px;
}
.mission_detial .uploadList {
    flex-flow: wrap;
}
.mission_detial .uploadList .item {
    margin-right: 0;
    margin-bottom: 0;
}

#missionModal .uploader {

}
#missionModal .uploader input + label {
    background-position: center;
    background-color: #F5F5F5;
    border-radius: 5px;
}

.mission_detial .field {
    width: 100%;
}
.mission_detial .field dl {
    flex-flow: column;
    align-items: flex-start;
    width: 100%;
}
.mission_detial .field dl dd {
    width: 100%;
}
.mission_detial .field dl dd:first-child {
    margin-bottom: 4px;
}
.mission_detial .field dl + dl {
    margin-top: 8px;
}

.mission_item {
    padding: 15px;
}
.mission_item .title {
    font-size: 14px;
}
.mission_item .title h1 {
    font-size: 14px;   
}
.mission_item .timer, 
.mission_item .dday {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 12px;
}
.mission_item .timer img, 
.mission_item .dday img {
    margin-right: 4px;
    margin-top: 2px;
    vertical-align: top;
}
.mission_item select {
    height: 40px;
    border-radius: 5px;
    font-size: 14px;
}
.mission_item select + input {
    border-radius: 5px;
}
.mission_item + .btn_area {
    padding: 15px;
    margin-top: 20px;
}
.mission_item .uploader {
    border-radius: 5px;
}
#missionModal .uploadList .item {
    border-radius: 5px;
    margin-top: 0px;
}


/* 포트폴리오 상세 */
#detailsModal .modal-layer {
    max-width: 90vw;
}
#detailsModal .modal-layer .content {
    max-height: calc(100vh - 100px);
    padding: 15px;
}
#detailsModal .details {
    flex-flow: column;
}
#detailsModal .profile_area {
    width: 100%;
    margin-right: 0;
    padding-right: 0;
    border-right: 0;
    margin-bottom: 25px;
}
#detailsModal .profile_area .comment {
    padding: 12px;
}
#detailsModal .profile_area .profile_info .lv {
    margin-right: 8px;
    padding-right: 8px;
    border-right: 1px solid #ddd;
}

#detailsModal .list_area {
    padding: 0;
}
#detailsModal .list_area > div {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}
#detailsModal .list_area .imgBox {
    width: 90px;
    height: 90px;
    flex-shrink: 0;
}
#detailsModal .list_area .details {
    flex-grow: 1;
    width: 100%;
    max-width: 150px;
    padding: 5px 0;
}
#detailsModal .list_area .col-06 {
    align-items: flex-end;
}
#detailsModal .list_area .desc,
#detailsModal .list_area .btn {
    width: 100%;
    flex-shrink: 0;
}
#detailsModal .list_area .desc {
    margin-top: 10px;
    padding-top: 10px;
    border-top:  1px solid #eee;
    font-size: 14px;
}

#campaign_list_wrap .empty_cp{
    padding-top: 40px;
    font-size: 16px;   
}

.text_banner_area.custom{
    gap:14px;
}
.text_banner_area.custom .wrap img{
    display: none;
}
.text_banner_area.custom .wrap .desc{
    text-align: left;
}
.text_banner_area.custom .wrap .desc span:first-child{
    font-size: 14px;
    padding-bottom: 17px;
}
.text_banner_area.custom .wrap .desc span:last-child{
    font-size: 10px;
}
.text_banner_area.custom .custom_set_area .subject{
    gap:10px;
}

.text_banner_area.custom .custom_set_area .subject div:first-child{
    font-size: 14px;
}
.text_banner_area.custom .custom_set_area .subject div:last-child{
    font-size: 12px;
    gap:8px;
}
.text_banner_area.custom .custom_cont .btn_cont{
    display: none;
}
.text_banner_area.custom .custom_set_area .subject div span{
    padding: 5px;
}

.campaign__ .title.Custom h1:after{
    width: 5px;
    height: 13px;
}
.campaign__ .btn_cont{
    padding-top: 0;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
}

.nonLogin{
    padding: 0 15px;
}

.nonLogin .inner{
    padding: 30px;
}


.real_time_contents .rank_list:not(.best_rank_slide) .item{
     flex: 1 0 calc((100% / 2) - 10px);
     max-width: calc(100% / 2 - 0px);
    gap:10px;
    padding: 10px;
}
.real_time_contents .rank_list:not(.best_rank_slide){
    gap:10px;
}
.real_time_contents .keyword_cont .keyword_info div > div.serch{
    font-size: 16px;
}
.real_time_contents .keyword_cont .keyword_info div > div#rank{
    font-size: 18px;
}
.real_time_contents .keyword_cont .keyword_info h2{
/*        flex: 1;*/
    font-size: 12px;
}
.real_time_contents .rank_list:not(.best_rank_slide) .tag_area{
    align-items: center;
}
.list_area .details .status_cont .date{
    font-size: 12px;
}
.list_area .details .status div{
    font-size: 12px;
}
.rank_list:not(.best_rank_slide) .details .subject{
    margin-bottom: 14px;
}
.list_area .details .status_cont .status img{
    max-width: 18px;
}
.list_area .details .status div{
    gap:5px;
}
.real_time_contents .keyword_cont .keyword_info div > div{
    word-break: keep-all;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.real_time_contents .keyword_cont .img_box img{
    width: 120px;
    height: 120px;
}
.real_time_contents .keyword_cont .keyword_info{
    width: calc(100% - 120px - 20px);    
}
.real_time_contents .keyword_cont .keyword_info > div{
    gap:10px;
}
.real_time_contents .rank_list.best_rank_slide{
    gap:30px;
}

.real_time_contents #more{
    font-size: 14px;
    max-width: calc(100% - 20px);
}
.real_time_contents .banner_cont .contents .text h1{
    font-size: 20px;
}
.real_time_contents .banner_cont .contents .text p{
    font-size: 28px;
}
.real_time_contents .best_rank_swiper .best_rank_cont{
    flex-wrap: nowrap;
    padding: 0;
}

.real_time_contents .best_rank_inner{
    max-width: calc(100% - 130px);
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .img_box img{
    max-height: 180px;
}
.real_time_contents .best_rank_swiper .best_rank_cont .item .img_box{
    max-height: 180px;
}
.best_rank.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left: -30px;
}
.best_rank.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right: -30px;
}

/*
.real_time_contents .best_rank_swiper .best_rank_cont .item{
    max-width: 180px;
}
*/
.content_tab{
    top: 60px;
}

.area_tab{
    padding: 15px 15px 0;
    background: #fff;
}
.area_tab > div{
    font-size: 16px;
    padding-bottom: 0;
}
.area_tab .area_list_box{
    width: calc(100% - 30px);
    height: calc(100dvh - 200px);
    overflow-y: auto;
}

.area_tab .location{
    flex-direction: column;
}
.area_tab .location_detail li{
    width: 30%;
}
.area_tab .location .left{
    padding-bottom: 14px;
}


/* 모바일 메인 맞춤 캠페인 리스트 */
.customize_campaignSwiper{
    display: none;
}
.mobile_campaign_list_cont{
    padding: 0 15px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding-right: 0;
}

.mobile_campaign_list_cont.swiper{
    padding-left: 15px;
}

.mobile_campaign_list_cont .swiper-slide{
    height: calc((100% - 30px) / 4) !important;
}


.mobile_campaign_list_cont .campaign_item{
    display: flex;
    gap:10px;
    padding: 10px 15px 10px 5px;
    border: 1px solid var(--line-color);
    border-radius: 10px;
}
.mobile_campaign_list_cont .campaign_item .img_box{
    max-width: 70px;
    height: 70px;
    border-radius: 8px;
    overflow: hidden;
}
.mobile_campaign_list_cont .campaign_item .img_box img{
    max-width: 100%;
}
.mobile_campaign_list_cont .campaign_item .info{
    display: flex;
    justify-content: space-between;
    flex: 1;
}
.mobile_campaign_list_cont .campaign_item .info .left{
    flex: 1;
        height: 100%;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
}
.mobile_campaign_list_cont .campaign_item .info .left .cp_type{
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 5px;
    justify-content: space-between;
}
.mobile_campaign_list_cont .campaign_item .info .left .cp_type > div{
    display: flex;
    align-items: center;
    gap:5px;
}
.mobile_campaign_list_cont .campaign_item .info .left .cp_type img{
    max-width: 18px;
}
.mobile_campaign_list_cont .campaign_item .info .left .subject{
    font-size: 14px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.mobile_campaign_list_cont .campaign_item .info .left .opt{
    font-size: 12px;
    display: flex;
    justify-content: space-between;
}
.mobile_campaign_list_cont .campaign_item .info .left .opt .opt_text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    flex: 1;
}


.mobile_campaign_list_cont .campaign_item .info .top{
    display: flex;
    gap: 14px;
    justify-content: end;
    align-items: baseline;
}
.mobile_campaign_list_cont .campaign_item .info .point_tag{
    padding: 2px 4px;
    border: 1px solid var(--primary-color);
    border-radius: 5px;
}

.list_area.scroll.popularSwiper{
    /* height: 530px; */
}



/* 마이 페이지  리뉴얼 */

.floating_box{
    margin: 10px 0;
    padding: 15px;
    box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    background-color: #fff;
}
.floating_box h2{
    font-size: 14px;
    font-weight: 500;
    padding-bottom: 15px;
}
.my_page {
padding: 0;
}

.my_page .text{
    font-size: 14px;
    font-weight: 500;
}
.my_page .bold_text{
    font-size: 18px;
    font-weight: 700;
}

.my_page .page_title {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
margin-bottom: 10px;
font-size: 16px;
font-weight: 600;
background-color: #fff;
border-bottom: 1px solid #E4E4E4;
}

.my_page .page_title .btn_cont {
display: flex;
gap: 12px;
align-items: center;
line-height: 1;
}
.my_page .page_title .btn_cont > a{
    position: relative;
    padding: 0 4px;
}
.my_page .page_title .btn_cont img{
    width: 22px;
    height: 22px;
}
.my_page .point_cont{
background: var(--primary-color);
color: #fff;
padding: 15px;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 10px;
}
.my_page .point_cont .info{
    display: flex;
    flex-direction: column;
    gap:5px;
    font-size: 14px;
    font-weight: 500;
}
.my_page .point_cont .info .text{
    font-size: 14px;
}
.my_page .point_cont .point{
    font-weight: 700;
    font-size: 16px;
}

.my_campaign_step_cont{
    display: flex;
    gap:15px;
    flex-direction: column;
}
.my_campaign_step_cont > div{
    display: flex;
    gap:30px;
}
.my_campaign_step_cont > div a{
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 1;
    position: relative;
}
.my_campaign_step_cont > div a .emergency_count{
    position: absolute;
    top: 0px;
    right: 0px;
    border-radius: 100px;
    border: 1px solid #F0F7FC;
    background: #DA2872;
    font-size: 9px;
    line-height: 150%;
    color: #fff;
    padding: 0 2px;
    z-index: 1;
}

.my_campaign_step_cont .box{
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap:5px;
    flex: 1;
    background: #F8F8F8;
    border-radius: 10px;
    color: #222;
    aspect-ratio:1/1;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    border: 1px solid #E4E4E4;
    font-size: 20px;
    position: relative;
}
.my_campaign_step_cont .box .count{
    position: absolute;
    top: -3px;
    right: -3px;
    border-radius: 100px;
    border: 1px solid #F0F7FC;
    background: #DA2872;
    font-size: 9px;
    line-height: 150%;
    color: #fff;
    padding: 0 2px;
}
.my_campaign_step_cont .box::before{
    content: "";
    display: inline-block;
    width: 10dvw;
    height: 1px;
    background-color: #E4E4E4;
    position: absolute;
    left: -31px;
    z-index: -1;
}
.my_campaign_step_cont .box.active{
    border: 3px solid var(--primary-color);
    color: var(--primary-color);
    background-color: #E2FCFF;
}
.my_campaign_step_cont a .text{
    font-size: 12px;
    font-weight: 600;
}
.my_campaign_step_cont a:has(.active) .text{
    color: var(--primary-color);
}
.my_campaign_step_cont a:first-child .box::before{
    display: none;
}

.my_page .my_campaign_step_cont .blue .box{
    background: #E2FCFF;
    color: #3CCBDB;
}
.my_page .my_campaign_step_cont .blue .box + span{
    color: #3CCBDB;
}
.my_page .my_campaign_step_cont .red .box{
    background: #FFEAEA;
    color: #FF3131;
}
.my_page .my_campaign_step_cont .red .box + span{
    color: #FF3131;
}

.my_page .grade_cont{
    display: flex;
    gap:15px;
}
.my_page .grade_cont .floating_box{
    flex: 1;
    display: flex;
    justify-content: space-between;
}

.my_page .grade_cont .floating_box > div{
    display: flex;
    flex-direction: column;
    gap: 5px;
    justify-content: center;
}

.floating_box .head{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.floating_box > .head{
    padding-bottom: 15px;
}
.floating_box .head h2{
    padding-bottom: 0;
    font-weight: 500;
}
.floating_box .head a {
    font-size: 14px;
    font-weight: 500;
}
.floating_box .head .text{
    font-size: 12px;
}

.my_page .sns{
/*        margin-top: 15px;*/
    width: 100%;
    display: flex;
    flex-direction: column;
    gap:10px;
    border: 1px solid var(--line-color);
    padding: 10px;
    border-radius: var(--border-round-S);
    font-weight: 400;
    font-size: 14px;
    color: #222;
}

.my_page .field_area .sns{
    border-radius: 10px;
}
.my_page .sns > a{
    padding: 10px;
    border: 1px solid #E4E4E4;
    display: flex;
    flex-direction: column;
    gap:10px;
    border-radius: 10px;
    flex: 1;
    color: #666;
}
.my_page .sns > a .text{
    display: flex;
    align-items: center;
    gap:5px;

}
.my_page .sns > a .small_text{
    font-size: 12px;
}
.my_page .banner_section{
    margin-top: 15px;
    
}
.my_page .sns .item_wrap{
    display: flex;
    flex-direction: column;
    gap:10px;
    font-size: 12px;
    font-weight: 400;
}
.my_page .sns .item_wrap a{
    display: flex;
    gap:5px;
    align-items: center;
    font-weight: 400;
    font-size: 12px;
}
.my_page .sns .item_wrap a svg{
    max-width: 12px;
}

.my_page .more_chip_cont{
    display: grid;
    font-size: 12px;
    color: #666;
    grid-template-columns: repeat(3,1fr);
    grid-row-gap: 25px;
}
.my_page .more_chip_cont .icon{
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    text-align: center;
    word-break: keep-all;
}

.my_page .icon.red_dot::before{
    content: "";
    position: absolute;
    display: inline-block;
    right: 0;
    top: 0;
    width: 4px;
    height: 4px;
    background: var(--red-100-color);
    border-radius: 50%;
}

.profile_card .info_ > div{
}

.PC_content{
    display: none;
}
.back_title .ct_title.PC_content{
    display: none;
}
.MO_content{
    display: block;
}

}


/*마이페이지 나의 등급*/
.grade_guide {
border: 1px solid rgb(228, 229, 237);
height: 400px;
margin-bottom: 8px;
border-collapse: collapse;
border-spacing: 0px;
}
.grade_guide thead {
height: 72px;
background-color: rgb(250, 250, 252);
}
.grade_guide tr th:first-child {
width: 124px;
font-size: 15px;
font-weight: bold;
}
.grade_guide tr th {
text-align: center;
height: 72px;
width: 179px;
padding-top: 24px;
padding-bottom: 24px;
background-color: rgb(250, 250, 252);
border-right: 1px solid rgb(228, 229, 237);
border-bottom: 1px solid rgb(228, 229, 237);
font-size: 14px;
font-weight: normal;
color: rgb(48, 52, 65);
}
.grade_guide tbody tr th:first-child {
width: 124px;
font-size: 15px;
font-weight: bold;
}
.grade_guide tbody tr td {
text-align: center;
height: 72px;
padding-top: 24px;
padding-bottom: 24px;
min-width: 96px;
border-right: 1px solid #e4e5ed;
border-bottom: 1px solid #e4e5ed;
font-size: 14px;
font-weight: 400;
}

.expected_grade_noti{
width: 100%;
text-align: right;
}
.expected_grade_noti div{
font-size: 14px;
color: #727585;
}


.mobile_none {
/*display: none;*/
}

/* 마이 캠페인 디테일 페이지*/



.heading_line01{
font-weight: 700;
font-size: 24px;
line-height: 29px;
color: #000;
}

.my_campaign_detail .heading_line01{
display: flex;
align-items: center;
gap:10px;
}
.my_campaign_detail .heading_line01 img{
max-width: 13px;
}

.heading_line02{
font-weight: 400;
font-size: 20px;
line-height: 24px;
color: #000;
}

.customBtn_p{
cursor: pointer;
background: #3CCBDB !important;
color: #fff !important;

border: 1px solid #3CCBDB !important;
border-radius: 5px;   
padding: 13.5px 20px;
font-weight: 700;
font-size: 16px;
line-height: 1;
display: inline-block;
}
.customBtn_p img{
max-width: 20px;
}
.customBtn_p:hover{
background: #fff !important;
color: #3CCBDB !important;
}

.customBtn_p .arrow_p{display:  none;}
.customBtn_p .arrow_w{display:inline-block;}
.customBtn_p:hover .arrow_p{display: inline-block;}
.customBtn_p:hover .arrow_w{display: none;}

.my_campaign_detail .top_area{
display: flex;
justify-content: space-between;
padding-top: 60px;
padding-bottom: 18px;
}

.my_campaign_detail .item{
padding: 20px 0;
display: flex;
gap:15px;
border-top: 1px solid #E7E7E7;
border-radius: 0;
}

.my_campaign_detail .item:last-child{
/* border-bottom: 1px solid #E7E7E7; */
}
.my_campaign_detail .item .title{
max-width: 150px;
width: 100%;
}
.my_campaign_detail .item .title .heading_line02{
display: flex;
gap:5px;
align-items: center;
}

.my_campaign_detail .item .title .heading_line02 img.q_mark{
display: none;
}

.my_campaign_detail .item.sponsor .guide_desc{
display: flex;
flex-direction: column;
text-align: center;
gap:12px;
}

.my_campaign_detail .item.sponsor .guide_desc button{
align-self: center;
}

.my_campaign_detail .item.sponsor .img_bg{
background: #E7E7E7;
padding: 20px;
text-align: center;
}

.my_campaign_detail .item.sponsor .img_bg img{
max-width: 100%;
}

.my_campaign_detail .item .guide_cont{
flex: 1;
gap: 10px;
display: flex;
flex-direction: column;
}
.my_campaign_detail .item .guide_cont .mission_error{
 align-self: flex-end;   
width: auto;
border-bottom: 1px solid #ccc;
padding-bottom: 2px;
padding-right: 0;
margin-right: 40px;
}

.my_campaign_detail .item.visit_info .guide_desc{
display: flex;
align-items: center;
gap:20px;
width: 100%;
}
.my_campaign_detail .item.visit_info .guide_desc .btn_border{
max-width: initial;
width: auto;
padding: 5px 10px;
font-size: 14px;
}

.my_campaign_detail .top_area .btn_cont{
display: flex;
align-items: center;
gap:10px;
}
.my_campaign_detail .top_area .btn_cont .message_btn{
background: var(--accent-color);
padding: 13.5px 20px;
line-height: 1;
border-radius: 5px;
cursor: pointer;
}

.my_campaign_detail .top_area a{
display: flex;
align-items: center;
gap:10px;
}

.my_campaign_detail .flexBox{
display: flex;
}

.my_campaign_detail .campaign_guide{
flex:1;
}

.my_campaign_detail .campaign_guide._MO{
display: none;
padding-bottom: 20px;
}

.my_campaign_detail .guide_desc{
font-weight: 400;
font-size: 16px;
line-height: 1.5;
color: #222;
padding-right: 50px;
flex:1;
width: calc(100% - 165px);
word-break: break-all;
}

.my_campaign_detail .guide_desc .guide_list{
padding-bottom: 5px;
} 

.my_campaign_detail .guide_desc .btn_wrap{
display: flex;
gap:10px;
}
.my_campaign_detail .guide_desc .mission_error_toggle_btn{
margin-top: 10px;
font-size: 16px;
padding: 13px 0;

}
.my_campaign_detail .guide_desc .mission_error_toggle_btn svg:last-child{
margin-left: 10px;
}

@media (max-width : 800px) {
.my_campaign_detail .guide_desc .mission_error_toggle_btn{
    font-size: 14px;
    padding: 13.5px 0;
}
}
.my_campaign_detail .guide_desc .btn_wrap_col{
display: flex;
flex-direction: column;
gap:10px;
}
.my_campaign_detail .guide_desc .btn_wrap_col button{
margin-top: 0;
}
/*
.my_campaign_detail .guide_desc .guide_list::before{
content: "";
position: absolute;
top: 10px;
left: 0;
width: 4px;
height: 4px;
background: #222;
border-radius: 50px;
}
*/

.my_campaign_detail .guide_desc ol{
padding-left: 20px;
/* padding-bottom: 20px; */
}

.my_campaign_detail .guide_desc .mission_icon{
max-width: 35px;
min-height: 35px;
max-height: 35px;
}
.my_campaign_detail .guide_desc .info_box img{
max-width: 22px;
min-height: 22px;
}
.my_campaign_detail .guide_desc .info_box.sponsor_banner img#sponsor_banner_link{
max-width: 100%;
width: 100%;
max-height: 100%;
height: 100%;
}
.my_campaign_detail .guide_desc .icon_box{
display: flex;
gap:20px;
padding-bottom: 20px;
}

.my_campaign_detail .guide_desc .icon_box .icon_item{
display: flex;
flex-direction: column;
align-items: center;
gap:10px;
font-size: 16px;
line-height: 1;
font-weight: 700;
color: #666;
}

.my_campaign_detail .guide_desc .info_box{
display: flex;
gap:10px;
flex-direction: column;
width: 100%;
font-size: 13px;
color: #454D56;
padding-top: 25px;
}
.my_campaign_detail .guide_desc .info_box:first-child{
padding-top: 0;
}

.my_campaign_detail .guide_desc .info_box:first-child .opt_name{
/*    padding-top: 10px;*/
}
.my_campaign_detail .guide_desc .info_box div.inner_box{
/*    max-width: 140px;*/
/*    min-width: 100px;*/
    flex: 1;
    color: #454D56;
    display: flex;
    align-items: center;
    gap:10px;
}
.my_campaign_detail .guide_desc .info_box div.inner_box button{
 font-size: 14px;
    padding: 7px 10px;
    font-weight: 500;
}
.my_campaign_detail .guide_desc .info_box > div.inner_box{
    font-size: 16px;
    font-weight: 500;
    color: #454D56;
    border: 1px solid var(--primary-color);
    border-radius: 10px;
    background: #fff;
    padding: 15px;
}
.my_campaign_detail .guide_desc .info_box > div.opt_info{
    display: flex;
    flex-direction: column;
    gap:10px;
    align-items: flex-start;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box{
    flex-direction: column;
    align-items: flex-start;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box h3{
    font-weight: 500;
    padding-bottom: 5px;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box p{
    font-weight: 400;
    line-height: 1.7;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box p.notice{
    margin-left: -20px;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box p strong{
    font-weight: 500;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div{
    gap:0px;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box ul li{
    padding-left: 25px;
    margin: 0;
    font-weight: 400;
    width: 100%;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box ul li::before{
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    background-color: #222;
    border-radius: 9999px;
    position: absolute;
    top: 10px;
    left: 10px;
}

.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box ol div > li{
    padding-bottom: 5px;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box ol ul li{
    padding-left: 15px;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box ol ul li::before{
    left: 0;
}

.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box .step_box{
    border-bottom: 1px solid var(--primary-color);
    padding: 10px 0 ;
    width: 100%;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box .step_box:first-child{
    padding-top:0;
}
.my_campaign_detail .guide_desc.step_guide .info_box > div.inner_box .step_box:last-child{
    padding-bottom:0;
    border-bottom: none;
}

.my_campaign_detail .guide_desc .info_box button{
    font-size: 14px;
    padding: 7px 10px;
    align-self: flex-start;
}
.my_campaign_detail .guide_desc .info_box div.inner_box span{
    /* flex:1; */
    /* margin-bottom: 10px; */
}
.my_campaign_detail .guide_desc .info_box div.inner_box #cp_blog_link{
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.my_campaign_detail .guide_desc .info_box.brand_tag_box{
border-top: 1px solid #E4E8EE;
/*    padding-top: 20px;*/
}

.my_campaign_detail .guide_desc .info_box .head_text{
flex: 1;
color: #454D56;
display: flex;
align-items: center;
gap: 10px;
font-size: 16px;
font-weight: 700;
}

.my_campaign_detail .guide_desc .info_box .desc{
margin-top: -5px;
font-size: 13px;
}
.my_campaign_detail .guide_desc .guide_cont{
border-radius: 5px;
display: flex;
flex-direction: column;
/*    gap: 20px;*/
/*    margin-top: 15px;*/
}
.my_campaign_detail .guide_desc .guide_cont:nth-of-type(2){
margin-top: 0;
}

.my_campaign_detail .guide_desc .tag_desc{
padding-top: 5px;
}

.my_campaign_detail .guide_desc .copy_box{
display: flex;
justify-content: center;
gap: 20px;
padding: 15px 0 20px;
}

.my_campaign_detail .guide_desc .tag_desc p{
/*    padding-left: 20px;*/
position: relative;
font-size: 12px;
}
/*
.my_campaign_detail .guide_desc .tag_desc p::before{
content:"";
display: inline-block;
position: absolute;
top: 50%;
left: 7px;
background: #666;
width: 4px;
height: 4px;
border-radius: 9999px;
transform: translateY(-50%);
}
*/

.my_campaign_detail .guide_desc .product_detail_img_box{
text-align: center;
}

.my_campaign_detail .guide_desc .product_detail_img_box img{
object-fit: cover;
width: 100%;
}
.my_campaign_detail .guide_desc .product_detail_img_box .product_detail_img{
height: 0;
overflow: hidden;
}
.my_campaign_detail .guide_desc .product_detail_img_box .product_detail_img.active{
height: auto;
}
.my_campaign_detail .guide_desc .opt_info{
text-align: left;
padding-bottom: 5px;
}
.my_campaign_detail .guide_desc .opt_info span{
padding: 4px 10px;
border-radius: 50px;
border: 1px solid #222;
font-size: 12px;
color: #222;
display: inline-block;
}
.my_campaign_detail .guide_desc .opt_info span.on{
border: 1px solid #904AAC;
color: #904AAC;
}


.my_campaign_detail .floating_section{
background: #FFFFFF;
box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.25);
border-radius: 10px;
max-width: 420px;
width: 100%;
align-self: flex-start;
}
.my_campaign_detail .floating_section .modal-layer .notice_{
margin: 0 auto 20px;
}

.my_campaign_detail .floating_section .modal-layer .notice_ #edit_desc{
border: 1px solid var(--primary-color);
border-radius: var(--border-round-L);
background: #fff;
padding: 15px;
font-size: 14px;
color: #454D56;
}

.my_campaign_detail .mission_detial .field dl input{
height: 45px;
}
.my_campaign_detail .mission_detial .field dl input#rv_4_copy{
text-align: right;
}

.my_campaign_detail .mission_detial .field dl dd:first-child{
font-weight: 400;
font-size: 14px;
line-height: 19px;
width: 115px;
color: #000;
}
.my_campaign_detail .mission_item{
padding: 20px;
padding-top: 0;
}

.my_campaign_detail .mission_item .section_title,.my_campaign_detail .BuyMission .section_title{
display: none;
font-size: 14px;
font-weight: 500;
color: #222;
padding-bottom: 20px;
}

.my_campaign_detail .mission_item input{
font-weight: 400;
font-size: 15px;
line-height: 18px;
padding: 20px;
height: auto;
padding: 15px 10px;
color: #666;
}
.my_campaign_detail .mission_item input#rv_blog_url{

}
.my_campaign_detail .mission_item textarea#rv_blog_url{
font-weight: 400;
font-size: 15px;
line-height: 22px;
padding: 10px;
height: auto;
color: #666;
border-radius: 8px;
margin-top: 10px;
width: 100%;
min-height: 100px;
outline: none;
}
.my_campaign_detail .mission_item textarea#rv_blog_url:focus{
border: 1px solid #666;
outline: none;
}

.my_campaign_detail .missionBlock{
padding: 20px;
margin: 0;
gap:10px;
}
.my_campaign_detail .missionBlock .imgBox{
width: 150px;
height: 150px;
margin-right: 0;
}

.my_campaign_detail .mission_detial{
margin: 0;
}


.my_campaign_detail .sns_mission{
background:#fff;
}
.my_campaign_detail .missionBlock .details{
padding: 0;
display: flex;
flex-direction: column;
justify-content: center;
}

.my_campaign_detail .feedback_area{
padding: 0 20px;
}
.my_campaign_detail .feedback_area .subject{
display: flex;
justify-content: space-between;
}
.my_campaign_detail .feedback_area .subject h4{
font-weight: 700;
}
.my_campaign_detail .feedback_area .subject span{
font-weight: 700;
}

.my_campaign_detail .feedback_area .item{
padding-top: 0px;
padding-bottom: 10px;
border-top: none;
font-size: 14px;
color: #666;
display: flex;
flex-direction: column;
gap:5px;
height: 100%;
}
.my_campaign_detail .feedback_area .item:last-child{
border-bottom: none;
padding-bottom: 0;
}

.my_campaign_detail .feedback_area .item .feedback_desc{
height: 70px;
border-radius: 8px;
border: 1px solid #ddd;
background-color: #fff;
padding: 10px;
width: 100%;
}
.my_campaign_detail .feedback_area .item .count_area{
text-align: right;
}

.my_campaign_detail .feedback_area .save_btn{
text-align: center;
padding: 10px 0 30px;
}

.my_campaign_detail .BuyMission{
padding: 0 20px;
}

.my_campaign_detail .noti{
padding: 0 20px;
}

.my_campaign_detail .noti ol{
padding-left: 18px;
padding-bottom: 15px;
font-size: 15px;
color: #666;
}

.my_campaign_detail .point_tag{
display: flex;
align-items: flex-start;
flex-direction: column;
padding-top: 0;
gap:3px;

}
.my_campaign_detail .point_tag .point{
padding: 0;
margin: 0;
border: none;
font-weight: 700;
font-size: 20px;
line-height: 24px;
color: var(--primary-color);
}

.my_campaign_detail .point_tag .text{
font-size: 15px;
}
.my_campaign_detail .point_tag .best_feedback .text{
font-size: 12px; 
font-weight: 400;
}
.my_campaign_detail .point_tag .best_feedback .point{
font-size: 16px;
}
.my_campaign_detail .subject{
margin-bottom: 10px;
white-space: normal;
word-break: break-word;
}
.my_campaign_detail .option{
margin-bottom: 0;
}



.my_campaign_detail #missionModal .modal-layer .content{
max-height: initial;
overflow-y: initial;
}

.my_campaign_detail input[type="checkbox"]{
display: none;
}
.my_campaign_detail input[type="checkbox"] + label{
display: inline-block;
position: relative;
left: 0;
top: 0;
padding-left: 35px;
color: #000;
}
.my_campaign_detail input[type="checkbox"] + label::after{
content: '';
display: inline-block;
position: absolute;
background-image: url(../img/icon/tool/check.svg);
background-repeat: no-repeat;
background-size: cover;
left: 0;
width: 25px;
height: 25px;
top: 50%;
transform: translateY(-50%);
}

.my_campaign_detail input[type="checkbox"]:checked + label::after{
    background-image: url(../img/icon/tool/checked.svg);
}

.calendar_cont{
display: flex;
flex-direction: column;
align-items: center;
padding-bottom: 20px;
}

#calendar {
border: 1px solid #d9d9d9;
border-radius: 5px;

}

#calendar-month{
text-align: center;
padding: 5px 0 ;
border-bottom: 1px solid #D9D9D9;
display: flex;
align-items: center;
gap:10px;
justify-content: center;
}

#calendar-month span{
display: inline-block;
background-color: #16B9CB;
border-radius: 4px;
color: #fff;
text-align: center;
padding: 4.5px 8px;
font-size: 12px;
font-weight: 400;
letter-spacing: 0.6px;
}

#calendar-header,
.week {
display: flex;
gap:10px;
}

.yoil{
width: 30px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
}

.day {
width: 30px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}

.day.disable{
color:#B3B3B3;
}

.sunday{
color:#FF9A19;
}

.saturday{
color: #17A1FA;
}

/*
.day.disable.sunday{
color: #1270B0;
}

.day.disable.saturday{
color: #1270B0;
}
*/

#calendar-header{
padding: 0 5px;
}
#calendar-body{
padding: 0 5px;
}

.day:hover {
background-color: #EFEFEF;
border-radius: 4px;
}
.day.disable:hover {
background-color: #fff;
cursor: no-drop;
}
.day.active{
  background-color: #16B9CB;
border-radius: 4px;
color: #fff;
}

.schedule{
display: flex;
align-items: center;
}
.schedule span{
max-width: 90px;
width: 100%;
}
.schedule_date{
padding-bottom: 10px;
}

.schedule_date span{
max-width: 90px;
width: 100%;
}

.schedule_date #selected-date{
border-radius: 5px;
border: 1px solid #D9D9D9;
padding: 12.5px;
}


.schedule_time span{
display: flex;
}

.schedule_time .time_box{
display: flex;
gap:10px;
align-items: center;
width: 100%;
}
.schedule_time .time_box select{
width: 100%;
height: auto;
padding: 10.5px;
line-height: 1;
border-radius: 5px;
}

.app_bar{
display: none;
}


@media (max-width: 800px) {

.ch_link {
    height: auto;
    padding: 9px 24px 9px 9px;
    flex: 1;
    margin-bottom: 0;
    width: auto;
}
.customer_tool .Inquire_ div:last-child{
    width: 100%;
    flex-direction: column;
    gap: 5px;
}

.app_bar {
display: block;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
z-index: 95;
background-color: #fff;
border-top: 1px solid #eee;
box-sizing: border-box;
padding:10px 0;
}

.app_bar_menu {
display: flex;
justify-content: space-evenly;
align-items: center;
}

.app_bar_menu img {
display: block;
margin: auto;
max-width: 22px;

}
.app_bar6 img{
    border-radius: 50px;
    background-color: #EFEFEF;
    width: 22px;
    height: 22px;
}
.app_bar_menu svg {
    display: block;
    margin: auto;
/*        max-width: 22px;*/

}

.app_bar_menu li.app_bar5 svg{
    fill: #F55F71;
}
.app_bar_menu li.active svg{
    fill: var(--primary-color);
}


.app_bar_menu li.red_dot::before{
    content: "";
    position: absolute;
    display: inline-block;
    right: 30%;
    top: 0;
    width: 4px;
    height: 4px;
    background: var(--red-100-color);
    border-radius: 50%;
}

.app_bar_menu li {
position: relative;
font-size: 12px;
font-weight: 400;
letter-spacing: -0.48px;
text-align: center;
color: #666;
flex: 1;
display: flex;
justify-content: center;
}
.app_bar_menu li.app_bar5 img{
    /* max-width: 20px; */
    /* height: 20px; */
}

.app_bar_menu li.active{
color: var(--primary-color);
font-weight: 500;
}

.app_bar_menu li a {
display: flex;
flex-direction: column;
gap:10px;
line-height: 1;
width: fit-content;
}
/* #header .app_bar_menu li a:hover{
    color: inherit;
    font-weight: inherit;
} */
#header .app_bar_menu li.app_bar5.on a{
    color:var(--primary-color,#3ccbdb);
}


.app_bar.ad {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
z-index: 95;
background-color: #fff;
border-top: 1px solid #eee;
box-sizing: border-box;
padding:10px 0;
}

.ad .app_bar_menu {
display: flex;
justify-content: space-evenly;
align-items: center;
}

.ad .app_bar_menu img {
display: block;
margin: auto;
max-width: 20px;
}

.ad .app_bar_menu li {
position: relative;
font-size: 12px;
font-weight: 400;
letter-spacing: -0.48px;
text-align: center;
color: #666;
align-self: flex-end;
}

.ad .app_bar_menu li.active{
color: var(--primary-color);
font-weight: 500;
}

.ad .app_bar_menu li a {
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.ad .app_bar_menu li img{
max-width: 22px;
}

.ad .app_bar1 img {
padding-bottom: 6.2px;
}

.ad .app_bar2 img {
padding-bottom: 5.6px;
}

.ad .app_bar3 img {
padding-bottom: 5.3px;
}

.ad .app_bar4 img {
padding-bottom: 14px;
}

.field_area .field .item{
/*        padding-top: 15px;*/
}

.my_campaign_detail .heading_line01{
    font-size: 20px;
}

.my_campaign_detail .customBtn_p{
    font-size: 14px;
/*        width: 100%;*/
    padding: 11px ;
    background: var(--primary-color, #3ccbdb);
    text-align: center;
}

.my_campaign_detail .modal-layer .submitBtn{
    max-width: 220px;
    font-size: 15px;
}
.my_campaign_detail .modal-layer .submit_cont .submitBtn{
    flex: 1;
    max-width: none;
    height: 44px;
}

.my_campaign_detail .modal-layer .red_btn{
    height: 44px;
    border-radius: 5px;
}
.modal-layer .btn_area.submit_cont{
    padding-left: 0;
    padding-right: 0;
}
.my_campaign_detail .modal-layer .toggle_btn{
    
    font-size: 15px;
    border-radius: 4px;
/*        height: 44px;*/
    flex: 1;
    border-radius: 10px;
    padding: 15px 10px;
}


.my_campaign_detail .flexBox{
    flex-direction: column;
}

.my_campaign_detail .campaign_guide{
    order: 2;
}

.my_campaign_detail .top_area a{
    display: none;
}   

.my_campaign_detail .item{
    display: block;
    height: 62px;
    overflow: hidden;
    border-radius: 0;
}

.my_campaign_detail .item.show{
    height: auto;
}
.reservation:not(.item){
 padding-bottom: 20px;       
}

.my_campaign_detail .item .title{
    max-width: none;
    position: relative;
    margin-bottom: 10px;
}

.my_campaign_detail .item .title::before{
    content: "";
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(180deg);
    width: 15px;
    height: 8px;
    background: url(../img/icon/tool/arrow_L.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.my_campaign_detail .item.show .title::before{
    transform: translateY(-50%) rotate(0);
}

.my_campaign_detail .guide_desc .icon_box{
    justify-content: center;
}

.my_campaign_detail .guide_desc{
    padding-right: 0;
    font-size: 14px;
    width: 100%;
}

.my_campaign_detail .guide_desc .icon_box .icon_item{
    text-align: center;
    word-break: keep-all;
}
.my_campaign_detail .guide_desc .icon_box .icon_item p{
    line-height: 1.2;
    font-size: 14px;
    
}

.my_campaign_detail .top_area{
    padding: 20px 15px;
    display: none;
}

.my_campaign_detail .floating_section{
    box-shadow: none;
    max-width: none;
}
.my_campaign_detail .missionBlock{
    padding: 0;
    flex-direction: row;
}

.my_campaign_detail .sns_mission{
    padding: 0;
    padding-bottom: 20px;
}
.my_campaign_detail .mission_item{
    padding: 0;
    padding-bottom: 20px;
}
.my_campaign_detail .mission_item .section_title,.my_campaign_detail .BuyMission .section_title{
    display: flex;
    align-items: center;
    gap:5px;
}
.my_campaign_detail .mission_item .title h1{
    font-size: 16px;
}

.my_campaign_detail .noti{
    padding: 0;
}

.my_campaign_detail #missionModal .modal-layer{
    margin: 0;
    max-width: none;
}

.my_campaign_detail .campaign_guide._MO{
    display: block;
}

.my_campaign_detail .campaign_guide._MO#reservation{
    display: none;
}
.my_campaign_detail .campaign_guide._MO#buy{
    display: none;
}
.my_campaign_detail .campaign_guide._PC#reservation{
    display: block;
}
.my_campaign_detail .campaign_guide._PC#buy{
    display: block;
}

/*
.my_campaign_detail .campaign_guide._MO .item{
    height: auto;
}

.my_campaign_detail .campaign_guide._MO .item.buy_link{
    display: block;
    text-align: center;
}
.my_campaign_detail .campaign_guide._MO .item.select_opt{
    display: block;
}

.my_campaign_detail .campaign_guide._MO .item .title::before{
    display: none;
}
*/

.my_campaign_detail .campaign_guide .buy_link{
    text-align: center;
/*        display: none;*/
}
.my_campaign_detail .campaign_guide .select_opt{
/*        display: none;*/
}
.my_campaign_detail .campaign_guide ._PC{
    display: none;   
}

.my_campaign_detail .item .title .heading_line02 img.q_mark{
    display: inline-block;
    width: 17px;
    height: 17px;
}

.my_campaign_detail .item .title .heading_line02{
    margin-bottom: 20px;
    font-size: 16px;
}


.my_campaign_detail .campaign_guide .tel{
    display: none;
}
.my_campaign_detail .campaign_guide .location{
    display: none;
}
.my_campaign_detail .campaign_guide .store_info{
    display: none;
}

.my_campaign_detail .campaign_guide._MO .tel{
    display: block;
    text-align: center;
}
.my_campaign_detail .campaign_guide._MO .location{
    display: block;
    text-align: center;
}
.my_campaign_detail .campaign_guide._MO .store_info{
    display: block;
}

.my_campaign_detail .campaign_guide._MO .buy{
    padding-bottom: 20px;
}

.my_campaign_detail .campaign_guide._PC{
    display: none;
}

.my_campaign_detail .floating_section .modal-layer .notice_{
    width: 100% !important
}

.customBtn_p{
    padding: 5px 15px;
    font-weight: 700;
    font-size: 12px;   
}

#campaign_list_wrap .empty_cp_btn div{
    min-width: auto;
}

.campaign__ .title .tool{
    align-items: center;
    gap:10px;
}

.my_campaign_detail .feedback_area{
    padding: 0;
}

.my_campaign_detail .guide_desc .product_detail_img_box .product_detail_img{
    height: auto;
}
.my_campaign_detail .guide_desc .product_detail_img_box button{
    display: none;
}

.profile_area.nav{
    padding: 15px;
}

.my_campaign_detail .item .guide_cont{
    align-items: flex-start;
}
.my_campaign_detail .item .guide_cont .mission_error{
    margin-right: 10px;
}

}


@media (max-width:600px){
.real_time_contents .rank_list:not(.best_rank_slide){
    
}    
.real_time_contents .rank_list:not(.best_rank_slide) .item{
    flex: initial;
    max-width: initial;
    width: 100%;
}
.real_time_contents .keyword_cont .keyword_info h2{
    max-width: 50px;
}
.real_time_contents .best_rank_swiper{
    max-width: 180px;
}
}




.modal-dialog.message{
overflow: hidden;
z-index: 2000000001;
}
#modal-message{
max-width: 1200px;
width: 100%;
padding: 0;
overflow: hidden;
max-height: 80dvh;
height: 100%;
background: var(--bg-gray-color);
color: #666;
display: block;
border-radius: 15px;
position: relative;
font-size: 14px;
}
#modal-message.modal-content .closer{
position: static;
cursor: pointer;
line-height: 1;
}
#modal-message .flex_box{
display: flex;
height: 100%;
}

#modal-message .flex_box > .left{
flex: 1;
border-right: 1px solid #E4E8EE;
width: 380px;
}
#modal-message .flex_box .left .head{
background: var(--primary-color);
padding: 0 20px 0 0;
display: flex;
justify-content: space-between;
align-items: center;

}
#modal-message .flex_box .left .head > div{
cursor: pointer;
position: relative;
z-index: 999;
line-height: 0;
}
#modal-message .flex_box .left .tab{

}
#modal-message .flex_box .left .tab span{
padding: 23px 22px;
display: inline-block;
line-height: 1;
}
#modal-message .flex_box .left .tab > span.on{
background: #fff;
}
#modal-message .flex_box .left .selectBox{
padding: 14px 20px;
background: #fff;
}

#modal-message .flex_box .left .search_cont{
padding: 14px 20px;
background: #fff;

}
#modal-message .flex_box .left .search_cont input{
padding-left: 50px;
background-image: url(/skin/demo/img/icon/search_icon_black.svg);
background-size: 20px 20px;
background-position: 20px center;
background-repeat: no-repeat;
border-radius: 8px;
border: 1px solid #EDEDED;
font-size: 16px;
height: 50px;
}

#modal-message .flex_box .left .selectBox .brand_select .select__{
background-image: url(/skin/demo/img/icon/tool/select_down.svg);
border: 1px solid #EDEDED;
height: 50px;
}
#modal-message .flex_box .left .selectBox .brand_select .list__{
width: 100%;    
max-height:330px;
overflow:auto;
}

#modal-message .flex_box .left .list{
padding: 20px;
border-top: 1px solid #E4E8EE;
overflow-y: scroll;
height: calc(100% - 70px - 78px);
position: relative;
}
#modal-message .flex_box .empty_list{
height: 100%;
padding: 0;

}
#modal-message .flex_box .right .empty_list{
padding-top: 61px;
}
#modal-message .flex_box .empty_list img{
max-width: 87px;
}


#modal-message .flex_box .left .list .item{
padding: 20px;
border-bottom: 1px solid #E4E8EE;
cursor: pointer;
}
#modal-message .flex_box .left .list .item.on{
background: #fff;
border: 1px solid var(--primary-color);
border-radius: 8px;
box-shadow: 0px 5px 8px 0px #20ABC61A;

}
#modal-message .flex_box .left .list .item .memo{
display: flex;
align-items: center;
gap:5px;
padding-bottom: 8px;
font-size: 13px;
}
#modal-message .flex_box .left .list .item .user{
display: flex;
gap:20px;
}
#modal-message .flex_box .left .list .item .user .left{
max-width: 60px;
width: 100%;
height: 60px;
}

#modal-message .flex_box .left .list .item .user img{
max-width: 60px;
max-height: 60px;
border-radius: 50px;
width: 100%;
object-fit: cover;
}
#modal-message .flex_box .left .list .item .user .top{
display: flex;
justify-content: space-between;
align-items: center;
}
#modal-message .flex_box .left .list .item .user .name{
font-weight: 500;
font-size: 16px;
color: #222;
}
#modal-message .flex_box .left .list .item .user .text{
font-weight: 400;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
word-break: break-all;
}
#modal-message .flex_box .left .list .item .user .right{
display: flex;
flex-direction: column;
gap: 5px;
width: 100%;
}

#modal-message .flex_box .left .list .item .user .right .bottom{
display: flex;
gap:5px;
justify-content: space-between;
}
#modal-message .flex_box .left .list .item .user .right .bottom .noti{
border-radius: 50px;
color: #fff;
background: var(--red-100-color);
font-size: 12px;
padding: 0 5px 0 5px;
align-self: flex-start;
text-align: center;
}


#modal-message .flex_box > .right{
flex: 2;
position: relative;
background: var(--bg-gray-color);
}
#modal-message .flex_box .right .head {
background: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 15px 20px;
min-height: 69px;

}
#modal-message .flex_box .right .title{
font-size: 24px;
color: #222;
font-weight: 500;
}
#modal-message .flex_box .right .receiver::before{
content: "";
position: absolute;
border-top: 1px solid #E4E8EE;
top: 0;
left: 50%;
width: calc(100% - 40px);
transform: translateX(-50%);
}
#modal-message .flex_box .right .sender,#modal-message .flex_box .right .receiver{
position: relative;
background: #fff;
display: flex;
gap: 30px;
padding: 20px ;
align-items: center;
line-height: 1;
}
#modal-message .flex_box .right .sender h3,#modal-message .flex_box .right .receiver h3{
color: #222;
font-size: 14px;
min-width: 70px;
}
#modal-message .flex_box .right .receiver h3{
align-self: flex-start;
}
#modal-message .flex_box .right .receiver .item{
display: inline-flex;
flex-direction: column;
position: relative;
gap: 5px;
/*    width: 60px;*/
}
#modal-message .flex_box .right .receiver .receiver_list{
display: flex;
gap: 15px;
align-items: center;
max-width: 660px;
display: inline-flex;
white-space: nowrap;
overflow-x: auto;
min-width: 200px;
}
#modal-message .flex_box .right .receiver .item .delete{
position: absolute;
right: 0;
top: 0;
}
#modal-message .flex_box .right .receiver .item span{
font-size: 14px;
overflow: hidden;
/*    max-width: 60px;*/
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
#modal-message .flex_box .right .receiver .item img{
max-width: 50px;
max-height: 50px;
border-radius: 50px;
}
#modal-message .flex_box .right .head .user_info{
width: 60%
}
#modal-message .flex_box .right .head .user_info img{
max-width: 50px;
max-height: 50px;
border-radius: 50px;
}
#modal-message .flex_box .right .head .user_info .user{
display: flex;
align-items: center;
gap: 15px;
line-height: 1;
}
#modal-message .flex_box .right .head .user_info .user .right{
display: flex;
flex-direction: column;
gap:5px;
}

#modal-message .flex_box .right .head .user_info .user .name{
font-size: 18px;
color: #222;
font-weight: 500;
}

#modal-message .flex_box .right .head .user_info .user .memo_cont{
display: flex;
align-items: center;
gap:5px;
}
#modal-message .flex_box .right .head .user_info .user .memo_cont span.icon{
line-height: 1;
display: flex;
align-items: center;
cursor: pointer;
}
#modal-message .flex_box .right .img_noti{
display: none;
}
#modal-message .flex_box .right .img_noti .close{
align-self: flex-start;
width: 10px;
padding-top: 3px;
}

#modal-message .flex_box .right .cp_list_cont{
background: #fff;
padding: 0 20px;
position: relative;
/*    box-shadow: 2px 9px 10px -8px #20ABC61A;*/
/*    border-radius: 0 0 10px 10px;*/
border-bottom: 1px solid #E4E8EE;
}
#modal-message .flex_box .right .cp_list_cont .item{
padding: 20px 0 ;
border-top: 1px solid #E4E8EE;
display: flex;
gap:10px;
align-items: center;
position: relative;
}
#modal-message .flex_box .right .cp_list_cont .item > span{
min-width: 82px;
}
#modal-message .flex_box .right .cp_list_cont .item .cp_info{
display: flex;
align-items: center;
gap:25px;
}
#modal-message .flex_box .right .cp_list_cont .item .cp_info .status{
display: flex;
align-items: center;
gap:10px;
}
#modal-message .flex_box .right .cp_list_cont .item .cp_info .label{
color: var(--primary-color);
border: 1px solid var(--primary-color);
padding: 0 10px;
border-radius: 15px;
}
#modal-message .flex_box .right .cp_list_cont .item .cp_info .date{
color: var(--primary-color);
}
#modal-message .flex_box .right .cp_list_cont .item .cp_info .link{
display: flex;
align-items: center;
cursor: pointer;
}

#modal-message .flex_box .right .cp_list_cont .more_item{
height: 0;
max-height: 230px;
overflow: hidden;
}
#modal-message .flex_box .right .cp_list_cont .more_item .item{
padding: 0;
border-top: 0;
}
#modal-message .flex_box .right .cp_list_cont .more_item .item .cp_info .cp_name{
flex:1;
}
#modal-message .flex_box .right .cp_list_cont .more_item .item .cp_info{
padding: 10px 0;
border-top: 1px solid #E4E8EE;
width: 100%;
}
#modal-message .flex_box .right .cp_list_cont .more_item .item:first-child .cp_info{
border-top: 0;
}
#modal-message .flex_box .right .cp_list_cont .more_item.on{
height: 100%;
overflow: auto;
border-top: 1px solid #E4E8EE;
}
#modal-message .flex_box .right .cp_list_cont .open{
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
display: flex;
padding: 10px 0 10px 10px;

}
#modal-message .flex_box .right .cp_list_cont .open img{
transition: all .2s;
}

#modal-message .flex_box .right .cp_list_cont .open.on img{
transform: rotate(-180deg);
}

#modal-message .flex_box .right .message_cont{
height: calc(100% - 80px - 84px);
padding: 20px;
overflow-y: auto;
background: var(--bg-gray-color);
position: relative;
}
#modal-message .flex_box .right .message_cont.small{
height: calc(100% - 61px - 80px - 84px);
}
#modal-message .error_msg{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
#modal-message .flex_box .right .message_cont .receive_message{
display: flex;
gap: 10px;
padding-bottom: 25px;
justify-content: flex-start;
align-items: center;
}
#modal-message .flex_box .right .message_cont .receive_message:last-child{
padding-bottom: 0;
}
#modal-message .flex_box .right .message_cont .receive_message img{
max-width: 40px;
border-radius: 50px;
}
#modal-message .flex_box .right .message_cont .receive_message .text{
background: #fff;
padding: 15px;
border-radius: 0 10px 10px 10px;
white-space: pre-wrap;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .receive_message .text.file{
white-space: inherit;
display: flex;
align-items: center;
gap: 10px;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .receive_message .text.file > a{
line-height: 1;
padding: 8px;
border-radius: 50px;
background: #F8F8FA;
width: 41px;
border: none;
}
#modal-message .flex_box .right .message_cont .receive_message .text span{
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .receive_message .text svg{
stroke: #666;
}
#modal-message .flex_box .right .message_cont .time{
align-self: flex-end;
display: flex;
flex-direction: column;
font-size: 12px;
color: #888;
}

#modal-message .flex_box .right .message_cont .send_message.loading{
height: 35px;
}
#modal-message .flex_box .right .message_cont .send_message.loading .loader{
width: 25px;
height: 25px;
right: 0;
left: initial;
top: 0;
}
#modal-message .flex_box .right .message_cont .send_message{
display: flex;
gap:10px;
justify-content: flex-end;
padding-bottom: 25px;
position: relative;
}
#modal-message .flex_box .right .message_cont .send_message:last-child{
padding-bottom: 0;
}
#modal-message .flex_box .right .message_cont .send_message .time{
text-align: right;
}
#modal-message .flex_box .right .message_cont .send_message .text{
background: var(--primary-color);
border-radius: 10px 0 10px 10px;
padding: 15px;
color: #fff;
white-space: pre-wrap;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .send_message .text.file{
white-space: initial;
display: flex;
align-items: center;
gap: 10px;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .send_message .text.file a{
line-height: 1;
padding: 8px;
border-radius: 50px;
background: #F8F8FA;
width: 41px;
border: none;
}

#modal-message .flex_box .right .message_cont .send_message .text svg{
stroke: var(--primary-color);
}


#modal-message .flex_box .right .message_cont .receive_message{
display: flex;
gap: 10px;
padding-bottom: 25px;
}
#modal-message .flex_box .right .message_cont .receive_message:last-child{
padding-bottom: 0;
}
#modal-message .flex_box .right .message_cont .receive_message img{
width: 40px;
height: 40px;
border-radius: 50px;
object-fit: cover;
}
#modal-message .flex_box .right .message_cont .receive_message .text{
background: #fff;
padding: 15px;
border-radius: 0 10px 10px 10px;
white-space: pre-wrap;
}

#modal-message .flex_box .right .message_cont .receive_message .text.file{
white-space: initial;
display: flex;
align-items: center;
gap: 10px;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .receive_message .text.file > a{
line-height: 1;
padding: 8px;
border-radius: 50px;
background: #F8F8FA;
width: 41px;
}

#modal-message .flex_box .right .message_cont .receive_message .text svg{
stroke: #666;
}

#modal-message .flex_box .right .message_cont .send_message{
display: flex;
gap:5px;
justify-content: flex-end;
padding-bottom: 25px;
position: relative;
flex-direction: column;
align-items: flex-end;
}

#modal-message .flex_box .right .message_cont .send_message .brand_name{
font-weight: bold;
font-size: 12px;
color: #888;
}
#modal-message .flex_box .right .message_cont .send_message .bottom_box{
display: flex;
gap:10px;
align-items: flex-end;
}

#modal-message .flex_box .right .message_cont .send_message:last-child{
padding-bottom: 0;
}
#modal-message .flex_box .right .message_cont .send_message .time{
text-align: right;
}
#modal-message .flex_box .right .message_cont .send_message .text{
background: var(--primary-color);
border-radius: 10px 0 10px 10px;
padding: 15px;
color: #fff;
white-space: pre-wrap;
word-break: break-all;
}
#modal-message .flex_box .right .message_cont .send_message .text img{
max-height: 30px;
}
#modal-message .flex_box .right .message_cont .send_message .text.file{
white-space: initial;
display: flex;
align-items: center;
gap: 10px;
word-break: break-all;
}

#modal-message .flex_box .right .message_cont .send_message .text.file a{
line-height: 1;
padding: 8px;
border-radius: 50px;
background: #F8F8FA;
width: 41px;
}

#modal-message .flex_box .right .message_cont .send_message .text svg{
stroke: var(--primary-color);
}



#modal-message .flex_box .right .message_cont .send_message .text.function_text{
background: #fff;
color: #222;
white-space: normal;
display: flex;
flex-direction: column;
gap:20px;
max-width: 400px;
width: 100%;
}
#modal-message .flex_box .right .message_cont .send_message .text.function_text .title{
font-size: 14px;
}

#modal-message .flex_box .right .message_cont .send_message .text.function_text .person_type{
display:flex;
align-items: center;
gap:30px;
}
#modal-message .flex_box .right .message_cont .send_message .text.function_text .person_type .checkbox_{
}
#modal-message .flex_box .right .message_cont .send_message .text.function_text .reason_text{
border: 1px solid #E4E8EE;
border-radius: 5px;
padding: 8px;
min-height: 70px;
}

#modal-message .flex_box .right .message_cont .send_message .text.function_text .request_datetime{
display: flex;
justify-content: space-evenly;
gap:30px;
border: 1px solid #E4E8EE;
border-radius: 5px;
padding: 8px 20px;
}

#modal-message .flex_box .right .message_cont .send_message .text.function_text .noti{
border-radius: 5px;
padding: 8px;
background: #F4F5F9;
color: #666;
}

#modal-message .flex_box .right .message_cont .send_message .text.function_text .btn_wrap{
display: flex;
gap:20px;
}
#modal-message .flex_box .right .message_cont .send_message .text.function_text .btn_wrap button{
flex: 1;
padding: 10px;
line-height: 1;
}

#modal-message .flex_box .right .message_cont .receive_message .text.function_text{
background: #fff;
color: #222;
white-space: normal;
display: flex;
flex-direction: column;
gap:20px;
max-width: 400px;
width: 100%;
}
#modal-message .flex_box .right .message_cont .receive_message .text.function_text .title{
font-size: 14px;
}

#modal-message .flex_box .right .message_cont .receive_message .text.function_text .person_type{
display:flex;
align-items: center;
gap:30px;
}
#modal-message .flex_box .right .message_cont .receive_message .text.function_text .person_type .checkbox_{
}
#modal-message .flex_box .right .message_cont .receive_message .text.function_text .reason_text{
border: 1px solid #E4E8EE;
border-radius: 5px;
padding: 8px;
min-height: 70px;
}

#modal-message .flex_box .right .message_cont .receive_message .text.function_text .request_datetime{
display: flex;
justify-content: space-evenly;
gap:30px;
border: 1px solid #E4E8EE;
border-radius: 5px;
padding: 8px 20px;
}

#modal-message .flex_box .right .message_cont .receive_message .text.function_text .noti{
border-radius: 5px;
padding: 8px;
background: #F4F5F9;
color: #666;
}

#modal-message .flex_box .right .message_cont .receive_message .text.function_text .btn_wrap{
display: flex;
gap:20px;
}
#modal-message .flex_box .right .message_cont .receive_message .text.function_text .btn_wrap button{
flex: 1;
padding: 10px;
line-height: 1;
font-size: 14px;
}


#modal-message .flex_box .right .message_cont .date_chip{
background: #D2D2DF;
max-width: fit-content;
padding: 6px 20px;
border-radius: 50px;
color: #fff;  
margin: 0 auto 30px;
max-width: fit-content;
}


#modal-message .flex_box .right .typing_cont{
position: absolute;
bottom: 0;
background: #fff;
padding: 15px 20px;
width: 100%;
display: flex;
gap:10px;
align-items: center;
z-index: 99999999;
max-height: 250px;
}
#modal-message .flex_box .right .typing_cont textarea{
flex: 1;
padding: 0;
line-height: 1.5;
border: none;
height: 26px;
font-size: 15px;
max-height: 230px;
overflow-y: auto;
}
#modal-message .flex_box .right .typing_cont .file{
padding: 15px;
line-height: 1;
align-self: flex-start;
background: #fff;
border: none;
}
#modal-message .flex_box .right .typing_cont .send_btn{
background: var(--primary-color);
color: #fff;
border-radius: 4px;
padding: 16px 20px;
align-self: flex-start;
font-size: 14px;
font-weight: 500;
}


#modal-message.modal-content .memo_cont input{
 height: auto;
font-size: 14px;
padding: 5px 10px;
}

#modal-message .add_message_btn{
padding: 10px;
border-radius: 5px;
text-align: center;
background: #E4E8EE;
margin-bottom: 20px;
cursor: pointer;
}






#modal-message .flex_box .left .list::-webkit-scrollbar,
#modal-message .flex_box .right .receiver .receiver_list::-webkit-scrollbar,
#modal-message .flex_box .message_cont::-webkit-scrollbar,
#modal-message .flex_box .right .cp_list_cont .more_item::-webkit-scrollbar,
#modal-message .flex_box .left .selectBox .brand_select .list__::-webkit-scrollbar{
    width: 15px;
    background-color: transparent;
}
#modal-message .flex_box .left .list::-webkit-scrollbar-thumb,
#modal-message .flex_box .right .receiver .receiver_list::-webkit-scrollbar-thumb,
#modal-message .flex_box .message_cont::-webkit-scrollbar-thumb,
#modal-message .flex_box .right .cp_list_cont .more_item::-webkit-scrollbar-thumb,
#modal-message .flex_box .left .selectBox .brand_select .list__::-webkit-scrollbar-thumb{
    background-color: #D0D2D7;
    border: 5px solid #fff;
    border-radius: 15px;
    cursor: pointer;
    opacity: 0;
}
#modal-message .flex_box .left .list::-webkit-scrollbar-track,
#modal-message .flex_box .right .receiver .receiver_list::-webkit-scrollbar-track,
#modal-message .flex_box .message_cont::-webkit-scrollbar-track,
#modal-message .flex_box .right .cp_list_cont .more_item::-webkit-scrollbar-track,
#modal-message .flex_box .left .selectBox .brand_select .list__::-webkit-scrollbar-track{
    background-color: transparent;
    opacity: 0;
}

#modal-message .mobile_head{
display: none;
}


@media(max-width:800px){

.modal-dialog.message{
    top:-34px;
}

.modal-dialog.message .dim{
    background-color: transparent;
}

#modal-message{
    max-height: calc(100dvh - 63px);
    border-radius: 0;
}
#modal-message .mo_title{
    display: block;
}
#modal-message.on .mo_title{
    display: none;
}
#modal-message .back{
    display: none;
}
#modal-message.on .back{
    display: block;
}

#modal-message .mobile_head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    font-size: 18px;
    padding: 12px 20px;
    color: #222;
    font-weight: 500;
}

#modal-message.on .mobile_head{
    border-bottom: 1px solid #E4E8EE;
}


#modal-message .mobile_head .closer img{
    max-height: 18px;
    width: 18px;
}
#modal-message .flex_box{
    height: calc(100dvh - 51px - 67px);
}

#modal-message .flex_box > .left{
    flex: none;
    width: 100dvw;
    transition: width .2s;
}
#modal-message .flex_box .left .list{
    padding: 0 20px;
    height :calc(100% - 113px)
}

#modal-message .flex_box .left .list .item{
    padding: 20px 0 ;
}
#modal-message .flex_box .left .list .item.on{
    background: none;
    border: none;
    border-radius: 0px; 
    box-shadow: none;
}


#modal-message .flex_box > .right{
    flex: none;
    width: 0dvw;
    display: none;
    height: calc(100dvh - 102px);
}
#modal-message.on .flex_box > .right{
    display: block;
    width: 100dvw;
}
#modal-message.on .flex_box > .left{
    width: 0;
    opacity: 0;
}   
#modal-message.on .flex_box > .right .closer{
    display: none;
}

#modal-message .flex_box .right .typing_cont{
padding: 11px 15px;

}

#modal-message .flex_box .right .typing_cont .file{
padding: 10px;
}
#modal-message .flex_box .right .typing_cont .send_btn{
padding: 11px 15px;
}

#modal-message .flex_box .right .message_cont{
    height: calc(100% - 80px - 66px) ;
    /* padding-right: 0; */
}
/* #modal-message .flex_box .right .message_cont.small{
    height: calc(100% - 61px - 80px - 62px);
} */

#modal-message .flex_box .left .tab span{
    padding: 15px;
    
}
#modal-message .flex_box .left .tab span img{
    max-width: 25px;
}
#modal-message .flex_box .left .head > div img{
    max-height: 30px;
}

#modal-message .flex_box .left .selectBox{
    padding: 12px 20px;   
}

#modal-message .flex_box .left .selectBox .brand_select .select__{
    height: 40px;
}
#modal-message .flex_box .left .search_cont input{
    height: 40px;
}
#modal-message .flex_box .left .search_cont{
    padding: 12px 20px;
}
#modal-message .flex_box .left .search_cont input{
    background-size: 15px;
    padding-left: 40px;
    background-position: 14px center;
}

#modal-message .flex_box .right .head{
    padding: 10px 20px;
}

#modal-message .flex_box .right .message_cont .date_chip{
    margin-bottom: 20px;
}

#modal-message .flex_box .right .img_noti{
    display: none;
    background: #B8EDF4;
    padding: 10px 20px;
    display: none;
    gap: 10px;
    align-items: center;
}

#modal-message .flex_box .right .message_cont .send_message .text.function_text .person_type{
    gap:10px;
}


#modal-message .flex_box .right .head .user_info{
    width: 100%;
}


}


/* 로딩 스피너 
.loading_wait{
display: none;
justify-content: center;
align-items: center;
gap:20px;
}
/* // 로딩 스피너 */
@media (max-width: 800px) {
.mobile_none {
    display: none !important;
}

[data-btn-type="floating"]{
    right: 14px;
    bottom: 150px;
    width: 50px;
    height: 50px;
    padding: 6px;
}
[data-btn-type="floating"] span{
    font-size: 12px;
    font-weight: 400;
    line-height: 1.3;
}
[data-btn-type="floating"] span svg{
    width: 14px;
    height: 14px;
}

[data-btn-type="floating"] .message_count{
    width: 16px;
    height: 16px;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
}



/* 알림 설정 페이지 */

.notice_set{}
.notice_set .kakao_cont{
padding:0 ;
}
.notice_set .kakao_cont h4{
display: flex;
align-items: center;
gap:5px;
padding-bottom: 20px;
}
.notice_set .kakao_cont .desc{
font-size: 16px;
color: #777;
}
.notice_set .kakao_cont .item{
display: flex;
justify-content: space-between;
align-items: center;
border: 1px solid var(--primary-color);
padding: 20px;
border-radius: 20px;
gap:20px;
}
.notice_set .kakao_cont .item_cont{
padding: 20px 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.notice_set .kakao_cont .item .title{
font-size: 18px;
font-weight: 500;
padding-bottom: 5px;
}
.notice_set .kakao_cont .item .desc{
font-size: 16px;
color: #777;
}

.notice_set .term{
display: flex;
align-items: center;
gap:20px;
}
.notice_set .term a{
color: var(--primary-color);
font-size: 14px;
border-bottom: 1px solid var(--primary-color);
}

label {
display: inline-flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
}

[role="switch"] {
appearance: none;
position: relative;
border-radius: 30px;
width: 53px;
height: 30px;;
cursor: pointer;
background: #B0B0B0;
border: none;
}

[role="switch"]::before {
content: "";
position: absolute;
left: 4px;
top: 50%;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #fff;
transition: left 250ms linear;
transform: translate(0, -50%);
}

[role="switch"]:checked {
background-color: var(--primary-color);
/*  border-color: tomato;*/
}
[role="switch"]:checked:disabled:before{
background-color: #fff;
}

[role="switch"]:checked::before {
background-color: white;
left: calc(100% - 23px);
}

[role="switch"]:disabled {
border-color: lightgray;
opacity: 0.7;
cursor: not-allowed;
}
[role="switch"]:checked:disabled{
cursor: pointer;
}

[role="switch"]:disabled:before {
background-color: lightgray;
}

[role="switch"]:disabled + span {
opacity: 0.7;
cursor: not-allowed;
}

[role="switch"]:focus {
border-color: var(--primary-color);
}

@media(max-width:800px){
.notice_set .kakao_cont{
    padding: 0;
}
.notice_set .kakao_cont .item .title{
    font-size: 16px;
}
.notice_set .kakao_cont .desc{
    font-size: 14px;
}
.notice_set .kakao_cont .item .desc{
    font-size: 14px;
}
.notice_set .term{
    gap:10px;
    flex-direction: column;
    align-items: flex-start;
}
.notice_set .term a{
    margin-left: auto;
}
}



/* 알림 설정  */




/* 블로그 리뷰 검수 모달 창 */

/*
#mission_guide_check_modal{
    width: 90dvw;
    max-width: 600px;
    padding: 30px;
    box-shadow: none;
    border: 1px solid #E4E8EE;
    border-radius: 30px;
}
*/
#mission_guide_check_modal .modal-layer {
width: 90dvw;
max-width: 582px;
max-height: 90dvh;
height: 100%;
overflow-y: hidden;
}

#mission_guide_check_modal .content::-webkit-scrollbar {
width: 15px;
background-color: transparent;
}

#mission_guide_check_modal .content::-webkit-scrollbar-thumb {
background-color: #9499B4;
border: 5px solid #fff;
border-radius: 15px;
cursor: pointer;
opacity: 0;
}

#mission_guide_check_modal .content::-webkit-scrollbar-track {
background-color: transparent;
opacity: 0;
}

#mission_guide_check_modal h1{
    font-size: 25px;
    font-weight: 700;
    margin: 0;
    line-height: 1;
}
#mission_guide_check_modal .head{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 30px;
    border-bottom: 1px solid #888;
    position: relative;
    gap:20px;
}
#mission_guide_check_modal .head .check_noti {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    padding: 5px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    margin-top: 1px;
    cursor: pointer;
}
#mission_guide_check_modal .head .closer{
    cursor: pointer;
    background-image: none;
    width: auto;
    height: auto;
    top: 0;
    right: 0;
    margin: 0;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
}
#mission_guide_check_modal .content{
    padding-top: 30px;
    height: calc(100% - 70px);
    overflow-y: auto;
}
#mission_guide_check_modal .content .table_head{
    display: flex;
    border-bottom: 1px solid #888;
    
}
#mission_guide_check_modal .content .table_head div{
    font-size: 20px;
    font-weight: 500;
    padding: 15px 0;
    flex: 1;
    text-align: center;
}
#mission_guide_check_modal .content .table_head div:first-child{
     border-right: 1px solid #222;   
}
#mission_guide_check_modal .content .table_body{}
#mission_guide_check_modal .content .table_body .item{
    display: flex;
    border-bottom: 1px solid #888;
}
#mission_guide_check_modal .content .table_body .item div:first-child{
    border-right: 1px solid #888;
    display: flex;
    align-items: center;
    justify-content: center;
}
#mission_guide_check_modal .content .table_body .item div:first-child img{
    margin-right: 5px;        
}
#mission_guide_check_modal .content .table_body .item div{
    font-weight: 500;
    padding: 15px 0;
    flex: 1;
    text-align: center;
    font-size: 16px;
}
#mission_guide_check_modal .content .table_body .item .guide,
#mission_guide_check_modal .content .table_body .item .result{
    font-weight: bold;
    padding-left: 3px;
}

#mission_guide_check_modal .content .sponsor_cont{
padding: 30px 10px;
}
#mission_guide_check_modal .content .sponsor_cont p{
padding-bottom: 15px;
}

#mission_guide_check_modal .content .text_cont{}
#mission_guide_check_modal .content .text_cont textarea{
border-color: #3ccbdb;
border-radius: 5px;
padding: 10px;
width: 100%;
height: 130px;
}
#mission_guide_check_modal .content .text_cont textarea::placeholder{
color: var(--placeholder-color);
}
#mission_guide_check_modal .content .text_cont .noti{}


#mission_guide_check_modal .content .btn_area{
padding-top: 50px;
margin: 0;
gap:30px;
}
#mission_guide_check_modal .content .btn_area button{
max-width: 133px;
padding: 13px 0 ;
width: 100%;
line-height: 1;
border-radius: 5px;
font-weight: 500;
font-size: 14px;
}
#mission_guide_check_modal .content .btn_area .whiteBtn{
position: static;
background-image: none;
margin: 0;
height: auto;
}
#mission_guide_check_modal .content .btn_area .customBtn_p{}

.btn_area{
    text-align: center;
    padding-top: 20px;
}
.result_tag{
    border-radius: 5px;
    border: 1px solid;
    font-size: 14px;
    font-weight: 500;
    padding: 3px;
    width: fit-content;
    margin: 5px auto 0;
}
td .result_tag{
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}
.result_tag.error{
    border-color: #FF8B8B;
    color: #FF8B8B;
}
.result_tag.success{
    border-color: #3ccbdb;
    color: #3ccbdb;
}

#mission_guide_check_modal input[type="checkbox"]{
    display: none;
  }
#mission_guide_check_modal input[type="checkbox"] + label{
display: inline-block;
position: relative;
left: 0;
top: 0;
padding-left: 35px;
color: #000;
}
#mission_guide_check_modal input[type="checkbox"] + label::after{
content: '';
display: inline-block;
position: absolute;
background-image: url(../img/icon/tool/check.svg);
background-repeat: no-repeat;
background-size: cover;
left: 0;
width: 25px;
height: 25px;
top: 50%;
transform: translateY(-50%);
}

#mission_guide_check_modal input[type="checkbox"]:checked + label::after{
    background-image: url(../img/icon/tool/checked.svg);
}



@media(max-width:800px){
#mission_guide_check_modal h1{
    font-size: 20px;
}
#mission_guide_check_modal .head .check_noti{
    font-size: 16px;
    padding: 3px;
}

#mission_guide_check_modal .content .table_head div{
    font-size: 16px;
}
#mission_guide_check_modal .content .table_body .item div{
    font-size: 14px;
}
.result_tag{
    font-size: 12px;
}

#mission_guide_check_modal .content .sponsor_cont{
    font-size: 14px;
}
#mission_guide_check_modal .content .text_cont textarea{
    font-size: 14px;
}
#mission_guide_check_modal .content .text_cont .noti{
    font-size: 14px;
}
#mission_guide_check_modal .content .table_body .item div:first-child{
    font-weight: 400;
}

#mission_guide_check_modal .content .text_cont textarea{
    height: 107px;
}
#mission_guide_check_modal .content .table_body .item .guide, #mission_guide_check_modal .content .table_body .item .result{
    font-weight: 500;
}
}

/* 검수 기준 팝업 */
#mission_inspection_standards_modal .modal-layer{
max-width: 390px;
}

#mission_inspection_standards_modal .head .closer{
    cursor: pointer;
    background-image: none;
    width: auto;
    height: auto;
    top: 0;
    right: 0;
    margin: 0;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

#mission_inspection_standards_modal .head{
position: relative;
border-bottom: 1px solid #222;
padding: 0;
margin: 0 20px;
padding: 30px 0 20px;
}
#mission_inspection_standards_modal .content{
display: flex;
flex-direction: column;
gap:30px;
padding: 30px;
}
#mission_inspection_standards_modal .item{
font-size: 14px;

}
#mission_inspection_standards_modal .item h2{
display: flex;
align-items: center;
gap: 10px;
margin: 0;
padding: 0 0 10px 0;
line-height: 1;
font-weight: 500;
}
#mission_inspection_standards_modal .item .desc{
display: flex;
gap:8px;
padding-bottom: 5px;
}
#mission_inspection_standards_modal .item .desc:last-child{
padding-bottom: 0;
}
#mission_inspection_standards_modal .item .depth{
position: relative;
padding-left: 20px;
display: inline-block;

}
#mission_inspection_standards_modal .item .depth::after{
content: "";
width: 4px;
height: 4px;
border-radius: 50%;
background: #222;
position: absolute;
top: 7px;
left: 10px;
font-size: 12px;

}
#mission_inspection_standards_modal .btn_area{
margin: 0;
padding: 0;
gap:10px;
}
#mission_inspection_standards_modal .btn_area button{
font-size: 16px;
flex: 1;
}

#mission_inspection_standards_modal .btn_area .mission_submit_btn{
border: none;
}
#mission_inspection_standards_modal .btn_area .closer{
position: static;
background: none;
width: 131px;
height: auto;
padding: 13px;
line-height: 1;
border-radius: 5px;
margin: 0;
}


@media(max-width:800px){
.guide_background{
    padding: 20px 15px;
}
.guide_area .info_box div.inner_box{
    font-size: 14px;
}
.guide_area .info_box div.inner_box{
    padding: 10px;
    font-size: 14px;
}
.guide_area .info_box .desc{
    font-size: 12px;
}
.guide_area .icon_box .icon_item{
    font-size: 14px;
}
.my_campaign_detail .guide_desc .info_box div.inner_box{
    font-size: 14px;
}

#mission_inspection_standards_modal .btn_area button{
    font-size: 14px;
    padding: 13px;
}

}


.mission_item .air-datepicker-cell.-year-.-other-decade-, .mission_item .air-datepicker-cell.-day-.-other-month-{
color: #222;
}


#noticeModal .modal-layer{
max-width: 400px;
padding: 30px 25px;
}
#noticeModal .modal-layer .content{
padding: 0;
}
#noticeModal .modal-layer .btn_wrap{
width: 100%;
padding-top: 30px;
}
#noticeModal .modal-layer .btn_wrap button{
width: 100%;
padding: 10px;
text-align: center;
border: none;

}

/* 연장 요청 모달 */


.request_modal .modal-layer{
max-width: 600px;
}

.request_modal .modal-layer .head{
position: relative;
}

.request_modal .modal-layer .head h2{
font-size: 20px;
}
.request_modal .modal-layer .head .closer{
top: 50%;
transform: translateY(-50%);
background-image: url(../img/icon/tool/close.svg);
margin: 0;
width: 20px;
height: 20px;
right: 30px;
}

.request_modal .modal-layer .content{
padding: 30px;
}

.request_modal .modal-layer .field label{
width: auto;    
gap:0;
color: #666;
font-weight: 400;
}
.request_modal .field_area{
display: flex;
gap:20px;
flex-direction: column;
justify-items: center;
}
.request_modal .field_area .field{
gap:40px;
}

.request_modal textarea{
border: 1px solid var(--primary-color);
padding: 10px;
width: 100%;
overflow-y: auto;
min-height: 100px;
border-radius: 5px;
}
#visit_date_edit_modal.request_modal .date_area{
display: block;
width: 100%;
border: none;
}
.request_modal .date_area{
display: flex;
align-items: center;
justify-content: center;
border: 1px solid var(--primary-color);
border-radius: 5px;
position: relative;
}

.request_modal .desc{

}
.request_modal .desc > div.text{
padding-bottom: 20px;
padding-top: 30px;
}
.request_modal .desc .noti{
background: #F4F5F9;
padding: 10px;
color: #666;
display: flex;
flex-direction: column;
gap: 20px;
line-height: 1;
border-radius: 5px;
}
#review_cancel_modal.request_modal .desc .noti{
margin-top: 20px;
}

.request_modal .desc .noti h3{
font-weight: 500;
font-size: 16px;
}

.request_modal .desc .noti p{
font-weight: 400;
font-size: 14px;
 line-height: 1.2;   
}

.request_modal .modal-layer .btn_area{
margin: 0;
display: flex;
justify-content: center;
align-items: center;
gap:20px;
padding: 0 30px;
padding-bottom: 30px;
}
.request_modal .modal-layer .btn_area button{
flex: 1;
height: auto;
width: auto;
line-height: 1;
padding: 10px 0;
border-radius: 5px;
font-size: 16px;
}
.request_modal .modal-layer .btn_area .closer{
position: static;
background-image: none;
margin: 0;
}

.request_modal #req_datetime{
width: auto;
border: none;
text-align: center;
padding: 0;
cursor: pointer;
}

#deadline_extension_modal.request_modal #req_datetime{
width: 100%;
position: absolute;
border: 1px solid #3ccbdb;
border-radius: 5px;
text-indent: 30px;
}
#deadline_extension_modal.request_modal .date_area{
border: none;
}

#deadline_extension_modal.request_modal .date_area > div{
position: absolute;
z-index: 2;
left: calc(50% - 90px);
transform: translateX(-50%);  
}

#deadline_extension_modal.request_modal .date_area > svg{
position: absolute;
z-index: 2;
right: calc(50% - 100px);
transform: translateX(50%);
}

body .air-datepicker:not(.-custom-position-){

transform: translate(50%, 0);
}

body .air-datepicker.-active-:not(.-custom-position-){
transform: translate(50%, 0);
}

body #visit_date_edit_modal .air-datepicker:not(.-custom-position-){
width: 100%;
transform: translate(0, 0);
}

body #visit_date_edit_modal .air-datepicker.-active-:not(.-custom-position-){
transform: translate(0, 0);
}

body .mission_item .air-datepicker:not(.-custom-position-){
transform: translate(0, 0);
}

@media (max-width:460px){

 body .air-datepicker:not(.-custom-position-){
     
    transform: translate(10%, 0);
}

body .air-datepicker.-active-:not(.-custom-position-){
    transform: translate(10%, 0);
} 



}



#mission_confirm_modal .modal-layer{
max-width: 520px;
}

#mission_confirm_modal .modal-layer .head{
position: relative;
}

#mission_confirm_modal .modal-layer .closer{
background-image: url(../img/icon/tool/close.svg);
right: 30px;
top: 50%;
margin: 0;
width: 20px;
height: 20px;
transform: translateY(-50%);
}

#mission_confirm_modal .modal-layer .content{
padding: 30px;
}

#mission_confirm_modal .modal-layer .btn_wrap{
padding: 0 30px;
padding-bottom: 30px;
display: flex;
justify-content: space-between;
align-items: center;
gap:20px;
}



#mission_confirm_modal .modal-layer .btn_wrap button{
flex: 1;
padding: 10px ;
border-radius: 5px;
line-height: 1;
}

#mission_confirm_modal .modal-layer .btn_wrap button.fill_btn{
}


@media(max-width:800px){
#mission_confirm_modal .modal-layer .closer{
    top: 27px;
    width: 14px;
    height: 14px;
}
#mission_confirm_modal .modal-layer .btn_area{
    margin-top: 30px;
}

.request_modal .modal-layer .btn_area button{
    font-size: 14px;
}
.request_modal .modal-layer .content{
    padding: 20px;
    font-size: 14px;
    max-height: 70dvh;
    overflow-y: auto;
}

.request_modal .modal-layer .field label{
    font-size: 14px;
}
.modal-layer .btn_area.submit_cont.test button{
    height: 44px;
    font-size: 14px;
}
.my_campaign_detail input[type="checkbox"] + label{
    font-size: 14px;
}

.request_modal .modal-layer .head h2{
    font-size: 18px;
}


}


.custom-time-select {
display: flex;
justify-content: center;
gap: 10px;
padding: 10px;
border-top: 1px solid #eee;
}

.custom-time-select select {
padding: 5px;
border: 1px solid #ddd;
border-radius: 4px;
}


.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th{
background: none;
}

#mission_guide .modal-layer{
max-width: 600px;
}

#mission_guide .content{
padding: 30px 30px 20px 30px;
overflow: auto;
}

#mission_guide .content .img_cont{
background-color: #ECFCFF;
border-radius: 25px;
padding: 35px 24.5px;
text-align: center;
}
#mission_guide .content > .img_cont img{
width: 100%;
max-width: 360px;
max-height: 550px;
height: 100%;
object-fit: contain;

}

#mission_guide .btn_wrap{
display: flex;
justify-content: space-between;
gap:10px;
padding: 0 30px;
padding-bottom: 30px;
}

#mission_guide .btn_wrap button{
flex:1;
padding: 10px 0 ;
max-width: initial;
}



#visit_check_modal .content{
display: flex;
flex-direction: column;
row-gap: 8px;
}

#visit_check_modal .desc:nth-child(2){
padding: 10px 0 ;
}


#apply_submit_btn{
width: 100%;
line-height: 1;
padding: 12px 0;
border-radius: 5px;
height: auto;
font-weight: 500;
}

#apply .checkbox_ input + label:before{
/*    width: 30px;*/
/*    margin-top: 4px;*/
}


#apply .modal-layer .check_wrap .checkbox_ label{

}

.field.agree_cont{
margin-top: 20px;
align-items: flex-start;
background: transparent;
padding: 0;
gap:10px;
}
.field.agree_cont label{
padding-bottom: 10px;
color: #222;
font-size: 16px;
}
.field.agree_cont .checkbox_ label{
font-size: 14px;
}
#rv_agree{
min-height: auto;
}

#apply .modal-layer .check_wrap .checkbox_ label{
align-items: flex-start;
}










.qualified{
font-size: 12px;
display: flex;
gap:5px;
align-items: center;
position: relative;
padding-top: 8px;
}



.qualified .qualified_title{
color: var(--primary-color);
}
.qualified > .desc{
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin: 0;
}

.qualified_tooltip{
display: none;
position: absolute;
left: 0;
bottom: 20px;
padding: 15px;
border: 2px solid var(--primary-color);
border-radius: 10px;
background: #fff;
box-shadow: var(--box-shadow_black);
width: 450px;
z-index: 1;
}
.qualified .qualified_tooltip .desc{
flex: 1;
margin: 0;

}
.qualified:hover .qualified_tooltip{
display: flex;
gap:5px;
}


.qualified_box{
padding-bottom: 20px;
}


@media (max-width:800px){
.qualified{
    padding-top: 0;
}
.qualified_tooltip{
    width: calc(100vw - 30px);
}
li:nth-child(even) .qualified_tooltip{
    left: initial;
    right: 0;
    
}
}



.ui-modal-layer .tip_section{
padding-top: 5px;
font-size: 14px;
color: #888;
}
.ui-modal-layer .tip_section .title{
color: #DA2872;
}

@media (max-width:800px){
.ui-modal-layer .tip_section{
    font-size: 10px;
}
.visit_info_section{
    font-size: 12px;
}
}




.delivery_section{
display: flex;
flex-direction: column;
gap: 10px;    
padding-top: 10px;
}
.delivery_section h3{
font-weight: 500;
color: #222;
padding-left: 5px;
}

.delivery_section .address_section{
display: flex;
flex-direction: column;
gap: 5px;
}
.delivery_section .address_section .top{
display: flex;
gap:10px;
align-items: center;
}
.delivery_section .address_section .top button{
flex:1;
max-width: 80px;
line-height: 1;
border-color: var(--primary-color);
}
.delivery_section .address_section .top button:focus{
border:1px solid var(--primary-color);
}
.delivery_section .address_section .top input{
flex: 1;
}

.delivery_section .rv_dy_cont{
display: flex;
flex-direction: column;
gap: 5px;
}

.delivery_save{
padding-top: 10px;
}


.visit_info_section{
padding-top: 10px;

}

.visit_info_section .notice{
padding: 10px 5px;
}

.closed_campaign_cancel_btn_wrap{
text-align: right;
padding-bottom: 20px;
}



.listTab_area.wait{
margin-top: 50px;
margin-bottom: 20px;
padding: 0;
border-radius: 10px;
box-shadow: 0px 10px 10px rgba(212, 212, 223, 0.2);

}
.listTab_area.wait ul li + li{
margin-left: 0;
}
.listTab_area.wait a{
min-width: 150px;
}

.list_area .imgBox button{
position: absolute;
top: 0;
right: 0;
z-index: 1;
background: rgba(255, 255, 255, 0.5);
font-size: 12px;
border-radius: 8px;
}
.listTab_area.wait ul li a{
color: #888;
font-weight: 500;
}
.listTab_area.wait ul li.active a{
color: #222;
font-weight: 600;
}

.infl_grade .item .result{
font-size: 16px;
font-weight: 400;
color: #888;
display: flex;
align-items: center;
gap:3px;
}
.infl_grade .item .value{
font-size: 20px;
font-weight: 500;
}

@media (max-width:800px){
.aside_section .inner > .content.my_campaign{
    background-color: #f4f5f9;
}
.listTab_area.wait{
    margin-top: 0;
    box-shadow: none;
    border-bottom: none;
    border-radius: 0;
    margin-bottom: 14px;
}
.listTab_area.wait a{
    min-width: auto;
    font-size: 16px;
    padding: 10px;
    font-weight: 300;
}
.listTab_area.wait .tab_cont{
    font-size: 12px;
    background: #fff;
}
.listTab_area.wait ul li a{
    font-size: 16px;
    font-weight: 300;
}
.listTab_area.wait ul li.active a {
    font-weight: 500;
}

.listTab_area.wait ~ .list_area.col-03{
    background: #fff;
    padding: 15px;
}
.listTab_area.wait ~ .list_area.col-03 .empty{
    margin: 0;
    padding: 60px 0 40px;
}
.closed_campaign_cancel_btn_wrap{
    padding-bottom: 14px;
    padding-right: 15px;
}
.closed_campaign_cancel_btn_wrap button{
    font-size: 12px;
    background-color: #fff;
}


body:has(.my_page){
    background-color: var(--bg-gray);
}

.profile_card .info_ > div h5{
    margin: 0;
    font-size: 12px;
    font-weight: 400;
}
.profile_card .info_ .email{
    font-size: 12px;
    font-weight: 400;
    color: #222;
}


.infl_grade_wrap{
    display: flex;
    flex-direction: column;
    gap:10px;
}

.infl_grade{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    background-color: #ECF9FB;
    border-radius: var(--border-round-S);
    padding: 5px;
    grid-row-gap: 10px;
}
.repeat-3 .infl_grade{
    grid-template-columns: repeat(3, 1fr);
}
.infl_grade .item{
    display: flex;
    flex-direction: column;
    gap:5px;
    align-items: center;
}

.infl_grade .item .result{
    font-size: 16px;
    letter-spacing: -0.5px;
    color: #888;
    /* position: relative; */
    display: flex;
    align-items: center;
}
.infl_grade .item .result .tooltip{
    padding-left: 3px;
    line-height: 1;
    height: 12px;
}

.infl_grade .item .value{
    font-size: 13px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap:5px;
    line-height: 20px;
}


.infl_grade .rating img{
    max-width: 16px;
}

.receive_review{
    padding: 10px 0;
}
.receive_review .ui-button{
    padding: 13px 0 ;
}

.list_area .btnCont .ui-button{
    font-size: 12px;
    padding: 10px 0;
}

}




.tooltip {
position: relative;
display: flex;
cursor: pointer;
overflow: visible; 
height: 12px;
align-items: center;
}
.result:has(.tooltip):hover .tooltiptext {
visibility: visible;
opacity: 1;
z-index: 10;
}

.tooltiptext {
visibility: hidden;
background-color: #fff;
padding: 10px 16px;
border-radius: 10px;
position: absolute;
bottom: 20px;
left: 50%;
opacity: 0;
transition: opacity 0.3s;
transform: translate(-50%, 0);
border: 2px solid var(--primary-color);
border-radius: 10px;
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #000 !important;
text-align: left;
word-break: keep-all;
width: calc(100dvw - 40px);
max-width: 450px;
}
.tooltiptext.left{
left: initial;
right: 30px;
}
.tooltiptext .head{
font-weight: 600;
font-size: 16px;
}
.tooltiptext .desc{
font-size: 14px;
}

/* 말풍선 위에 삼각형 추가 */
.tooltiptext::after {
/*
content: "";
position: absolute;
top: 50%;
left: -28px;
border-width: 14px;
border-style: solid;
border-color: #ddd transparent transparent transparent;
transform: rotate(90deg) translateX(-50%);
z-index: 1;
*/
}

/* 말풍선 위에 삼각형 추가 */
.tooltiptext::before {
/*
content: "";
position: absolute;
top: 50%;
left: -24px;
border-width: 12px;
border-style: solid;
border-color: #fff transparent transparent transparent;
transform: rotate(90deg) translateX(-50%);
z-index: 2;
*/
}

.tooltiptext.left::after {
left: initial;
right: -28px;
transform: rotate(-90deg) translateX(50%);

}

/* 말풍선 위에 삼각형 추가 */
.tooltiptext.left::before {
/*
left: initial;
right: -24px;
transform: rotate(-90deg) translateX(50%);
*/
}
.blog_grade .tooltiptext{
max-width: 450px;

}



._tab{
background-color: #fff;
padding: 25px 30px 0;
margin-bottom: 30px;
border-radius: 15px;
box-shadow: 10px 10px 10px rgba(212,212,223,0.2);
position: sticky;
top: 142px;
z-index: 1;
}
._tab .status_label{
display: flex;
align-items: center;
gap:15px;
}
._tab a span{
font-size: 20px;
padding: 10px 20px 15px 20px;
}

.status_label a{
min-width: fit-content;
display: inline-block;
text-align: center;

}

.status_label a + a {
/*    margin-left: 32px;*/
}

.status_label span {
display: inline-block;
letter-spacing: -0.28px;
color: #888;
box-sizing: border-box;
font-size: 16px;
font-weight: 500;
line-height: 1;
padding: 10px 56px 20px;

}

.status_label span.badge{
position: relative;
}
.status_label span.badge::before{
content: "";
display: inline-block;
position: absolute;
right: calc(46px);
top: 7px;
width: 5px;
height: 5px;
background: #ff6262;
border-radius: 50%;
}

.status_label span.on {
color: #222;
font-weight: 600;
border-bottom: 5px solid #3ccbdb;
}

.mofidy_area .field_area .field.self_introduce{
border: 1px solid var(--line-color);
padding: 20px;
gap:20px;
}
.mofidy_area .field_area .field.self_introduce label{
width: 100%;
line-height: 1;
color: #222;
font-size: 20px;
font-weight: 400;
cursor: initial;
}
.mofidy_area .field_area .field.self_introduce .comment{
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
line-height: 1.5;
max-height: 7.5em; /* line-height * 5줄 */
}

.mofidy_area .field_area .field.self_introduce .comment.expanded {
display: block;
max-height: none;
-webkit-line-clamp: unset;
}
.mofidy_area .field_area .field.self_introduce .more-btn{
color: var(--primary-color);
border: none;
align-self: flex-start;
line-height: 1;
}

.mofidy_area .field_area .field.sns_area{
border: 1px solid var(--line-color);
padding: 20px;
margin-top: 20px;
}


.infl_grade{
display: grid;
grid-template-columns: repeat(4, 1fr);
width: 100%;
background-color: #ECF9FB;
border-radius: var(--border-round-S);
padding: 20px 0;
grid-row-gap: 10px;
}
.infl_grade + .infl_grade{
margin-top: 20px;
}
.repeat-3 .infl_grade{
grid-template-columns: repeat(3, 1fr);
}
.repeat-5 .infl_grade{
grid-template-columns: repeat(5, 1fr);
}
.infl_grade .item{
display: flex;
flex-direction: column;
gap:5px;
align-items: center;
}


.infl_grade .item .result .tooltip{
/*    position: absolute;*/
padding-left: 3px;
line-height: 20px;
}
.infl_grade .item .result:has(.tooltip){
padding-right: 12px;
display: flex;
align-items: center;
}


.infl_grade .rating img{
max-width: 16px;
}

.hidden_infl_grade{
justify-content: flex-start;
gap:10px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}


.grade_area{
padding: 30px;
}

.rating_area{
padding: 30px;
}

@media (max-width:800px){
.rating_area{
    padding: 0 15px;
}
}




.body{
/* overflow-y: auto; */
}
.body::-webkit-scrollbar {
width: 15px;
background-color: transparent;
}
.body::-webkit-scrollbar-thumb {
background-color: #9499B4;
border: 5px solid #F5F5FA;
border-radius: 15px;
cursor: pointer;
opacity: 0;
}
.body::-webkit-scrollbar-track {
background-color: transparent;
opacity: 0;
}
/*
.profile{
border-radius: 9999px;
max-width: 60px;
max-height: 60px;
overflow: hidden;
width: 100%;
}
*/
/*
.profile img{
width: 100%;
height: 60px;
object-fit: cover;
}
*/
.mb_section{}
.mb_section .mb_info{
display: flex;
gap:10px;
align-items: center;
padding-bottom: 20px;
color: #222;
font-weight: 400;
}
.mb_section .mb_info .name{
display: flex;
align-items: center;
gap: 5px;
}
.mb_section .mb_info .name img{
max-width: 23px;
width: 23px;
height: 23px;
}

.mb_rating{
padding-bottom: 20px;
color: #222;
font-size: 24px;
display: flex;
align-items: center;
line-height: 1;
}
.mb_rating span{
font-size: 20px;
color: #888;
font-weight: 400;
display: flex;
}
.mb_rating span + span{
padding-left: 20px;
}
.mb_rating .avg_rating{
font-size: 20px;
font-weight: 500;
color: #222;
}
.mb_rating .total_ratings{
font-size: 16px;
font-weight: 400;
padding-left: 10px;
}
.total_count{
color: #222;
padding-bottom: 20px;
font-size: 20px;
}

@media (max-width:800px){
.total_count{
    font-size: 14px;
    font-weight: 500;
    padding-bottom: 15px;
}

}

.rating_list{
display: flex;
flex-direction: column;
gap:45px;
}

.infomation{
background-color:#FFF8E7;
padding: 10px;
margin-bottom: 20px;
border-radius: var(--border-round-L);
color: #222;
font-weight: 400;
}
.rating_list .item .profile_area{
display: flex;
gap:10px;
line-height: 1;
align-items: center;
}
.rating_list .item .profile_area .rating{
font-size: 20px;
color: #222;
display: flex;
align-items: center;
gap:10px;
}
.rating_list .item .profile_area .rating .star_wrap{
display: flex;
gap:3px;
align-items: center;
}
.rating_list .item .profile_area .rating .star_wrap img{
max-width: 16px;
}
.rating_list .item .profile_area .rating .star_wrap svg{
width: 20px;
height: 20px;
}
.rating_list .item .profile_area .rating .rate{
font-size: 20px;
font-weight: 500;
}
.rating_list .item .profile_area .rate{
font-weight: 400;
font-size: 16px;
}
.rating_list .item .profile_area .email{
color:#222;
font-size: 16px;
margin: 0;
padding-left: 5px;
}
.rating_list .item .profile img{
max-width: 26px;
max-height: 26px;
width: 100%;
border-radius: 50%;
width: 26px;
}

.rating_list .item .type{
font-size: 16px;
font-weight: 400;
color: #888;
display: flex;
align-items: center;
line-height: 1;
padding: 17px 0 ;
}
.rating_list .item .type span + span{
border-left: 1px solid #888;
padding-left: 8px;
margin-left: 8px;
}
.rating_list .item .comment{
color: #222;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
line-height: 1.5;
max-height: 7.5em; /* line-height * 5줄 */
}
.rating_list .item .comment.expanded {
display: block;
max-height: none;
-webkit-line-clamp: unset;
}
.rating_list .item .comment + button{
font-size: 16px;
font-weight: 600;
color: var(--primary-color);
padding-top: 20px;
border: none;
background: none;
}
.rating_list .item .reply_comment .reply-more-btn{
color: #222;
}

.rating_list .item .date{
border-left: 1px solid #888;
padding-left: 8px;
font-weight: 400;
color: #888;

}

.rating_list .item .reply_btn{
margin-left: auto;
cursor: pointer;
}
.rating_list .item .reply_area{
margin-left: auto;
background-color: var(--bg-gray);
padding: 10px;
border-radius: 5px;
margin-top: 10px;
}

.rating_list .item .reply_area .top_area{
display: flex;
align-items: center;
justify-content: space-between;
}

.rating_list .item .reply_area .date_area{
display: flex;
align-items: center;
color:#888;
padding-bottom: 10px;
}
.rating_list .item .reply_area .date_area .date{
margin-left: 10px;
line-height: 1;
}
.rating_list .item .reply_area .edit_area{
display: flex;
align-items: center;
gap:10px;
}
.rating_list .item .reply_area .edit_area > div{
cursor: pointer;
}
.more_btn_wrap{
padding: 20px 0;
}
.more_btn_wrap button{
padding: 14px 0;
font-size: 18px;
font-weight: 500;
}



.back_title .ct_title{
display: flex;
gap:20px;
align-items: center;
}
.back_title .ct_title .back_btn{
cursor: pointer;
}


#modal-create-reply .body{}
#modal-create-reply .body textarea{
width: 100%;
height: 250px;
font-weight: 400;
}
#modal-create-reply .body textarea:focus{
border-color: var(--line-color);
}



@media (max-width:800px){
.rating_list .item .profile img{
    max-width: 18px;
    max-height: 18px;
}
.rating_list .item .profile_area .rating .star_wrap svg{
    width: 13px;
    height: 13px;
}
.rating_list .item .profile_area .rating .rate{
    font-size: 16px;
}
.rating_list .item .profile_area .email{
    font-size: 12px;
}
.rating_list .item .date{
    font-size: 12px;
}
.rating_list{
    gap:35px;
}
.rating_list .item .comment{
    font-size: 12px;
}
.rating_list .item .comment + button{
    font-size: 12px;
    padding-top: 7px;
    line-height: 1;
}

.rating_list .item .type{
    font-size: 12px;
    padding: 12px 0;
}
.more_btn_wrap button{
    padding: 12px 0;
}

#header + #container:has(.fixed_head).my_profile{
    padding-top: 46px;
}

._tab{
    padding: 0;
    top: 36px;
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 0;
}
._tab a span{
    font-size: 14px;
    font-weight: 300;
    padding: 10px;
}
._tab a span.on{
    font-weight: 500;
    border-bottom: 3px solid var(--primary-color);
}
._tab .status_label{
    gap:10px;
}
.my_profile div.ct_title.PC_content{
    display: none;
}
.profile_modify{
    padding: 15px;
    background: #fff;
    border-radius: 10px;
}

.mofidy_area .field_area .field.self_introduce{
    border-radius: 10px;
    padding: 10px;
    gap:10px;
}
.mofidy_area .field_area .field.self_introduce label{
    margin: 0;
    font-size: 14px;
    color: #222;
}
.mofidy_area .field_area .field.self_introduce .comment{
    font-size: 12px;
    font-weight: 400;
}
.mofidy_area .field_area .field.self_introduce .more-btn{
    font-size: 12px;
}

.grade_area,.rating_area{
    margin-top: 10px;
    padding: 15px;
    background-color: #fff;
    border-radius: 10px;
}
.grade_area .ct_title,.rating_area .ct_title{
    padding: 0;
    font-size: 14px;
    margin-bottom: 15px;
}
.grade_area div.ct_title .ui-button{
    padding: 8px;
}
.infl_grade{
    padding: 10px;
    grid-template-columns: repeat(3, 1fr);
}
.repeat-5 .infl_grade{
    grid-template-columns: repeat(3, 1fr);
}
.infl_grade + .infl_grade{
    margin-top: 5px;
    
}
.my_page .text{
    font-size: 12px;
}
.infl_grade .item .result{
    font-size: 11px;
    font-weight: 400;
}

.mb_rating span svg{
    width: 16px;
}
.mb_rating .total_ratings{
    font-size: 14px;
}
.mb_rating span + span{
    padding-left: 10px;
}
.rating_area .infomation{
    font-size: 12px;
    margin-bottom: 15px;
}

.profile_card .profile_img .modifyBtn{
    width: 20px;
    height: 20px;
}

.rating_list .item .reply_btn{
    font-size: 11px;
}
.total_count{
    padding-left: 5px;
    padding-right: 5px;
}
.rating_list{
    padding-left: 8px;
    padding-right: 8px;
}
.rating_list .item .reply_area .date_area{
    font-size: 12px;
}
.rating_list .item .reply_area .edit_area > div svg{
    max-width: 13px;
    height: 100%;
}
.rating_list .item .reply_area .reply_comment{
    font-size: 12px;
}


.mofidy_area label{
    font-size: 14px;
}

.mofidy_area input{
    font-size: 12px;
}
.mofidy_area .field_area.flex_col{
    gap:20px;
}
.mofidy_area .flex_col{
    gap:5px;
}
.mofidy_area #mb_introduce{
    font-size: 12px;
    padding: 10px;
}
.mofidy_area .field_area .SNS_ li .fixed_text{
    font-size: 12px;
    padding: 11px;
}
.mofidy_area .field_area .SNS_ li .icon{
    padding: 10px;
}
.mofidy_area .field_area .SNS_ li .icon img{
    max-width: 20px;
    max-height: 20px;
    width: 20px;
}

.interest_area .check_area.chip_cont{
    gap:15px;
}

.chip_cont.check_area .checkbox_.icon label img{
    max-width: 35px;
    gap:5px;
}

.interest_area .area_cont .check_area:not(.chip_cont){
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px 10px;
    width: 100%;
}


.tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
    overflow: visible; 
    /* height: 18px; */
}
.result:has(.tooltip):hover .tooltiptext {
    visibility: visible;
    opacity: 1;
    z-index: 1;
}

.tooltiptext {
    visibility: hidden;
    background-color: #fff;
    padding: 10px 16px;
    border-radius: 10px;
    position: fixed;
    bottom: 50%;
    left: 50%;
    opacity: 0;
    transition: opacity 0.3s;
    transform: translate(-50%, 50%);
    border: 2px solid var(--primary-color);
    border-radius: 10px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #000 !important;
    text-align: left;
    word-break: keep-all;
    width: calc(100dvw - 40px);
    max-width: 800px;
}
.tooltiptext.left{
    left: initial;
    right: 40px;
}
.tooltiptext .head{
    font-weight: 600;
    font-size: 12px;
}
.tooltiptext .desc{
    font-size: 12px;
}


.tooltiptext.left::after {
    left: initial;
    right: -28px;
    transform: rotate(-90deg) translateX(50%);
}

.interest_area .area_cont .check_area:not(.chip_cont) .checkbox_{
    min-width: initial;
}

.interest_area .notice_check label{
    font-size: 12px;
}

.mofidy_area .interest_area label.head{
    font-size: 14px;    
}
}






/* 툴팁 CSS */


.tooltip {
position: relative;
display: inline-block;
cursor: pointer;
overflow: visible; 
}

.tooltip:hover .tooltiptext {
visibility: visible;
opacity: 1;
z-index: 1;
}
.result:has(.tooltip):hover .tooltiptext {
visibility: visible;
opacity: 1;
z-index: 1;
}

.tooltiptext {
visibility: hidden;
background-color: #fff;
padding: 10px 16px;
border-radius: 10px;
position: absolute;
bottom: 50%;
left: 20px;
opacity: 0;
transition: opacity 0.3s;
transform: translateY(50%);
border: 2px solid var(--primary-color);
border-radius: 10px;
word-break: keep-all;
font-weight: 400;
font-size: 14px;
line-height: 20px;
color: #000 !important;
text-align: left;
width: max-content;
max-width: 450px;
word-break: keep-all;
}
.tooltiptext.left{
left: initial;
right: 30px;
}
.tooltiptext.top{
left: 0;
bottom: 25px;
transform: translateY(0);
}
.tooltiptext .head{
font-weight: 600;
font-size: 16px;
}
.tooltiptext .desc{
font-size: 14px;
}




@media (max-width:800px){

.tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
    overflow: visible; 
}
.result:has(.tooltip):hover .tooltiptext {
    visibility: visible;
    opacity: 1;
    z-index: 1;
}

.tooltip:hover .tooltiptext {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
    right: initial;
    left: 50%;
}

.tooltip.on .tooltiptext {
    visibility: visible;
    opacity: 1;
    z-index: 1;
    right: initial;
    left: 50%;
}


.tooltiptext {
    visibility: hidden;
    background-color: #fff;
    padding: 10px 16px;
    border-radius: 10px;
    position: fixed;
    bottom: 50%;
    left: 50%;
    opacity: 0;
    transition: opacity 0.3s;
    transform: translate(-50%, 50%);
    border: 2px solid var(--primary-color);
    border-radius: 10px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #000 !important;
    text-align: left;
    word-break: keep-all;
    width: calc(100dvw - 40px);
    max-width: 800px;
}

.tooltiptext .head{
    font-weight: 600;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: transparent;
    padding: 0;
    color: #222;
    overflow-x: auto;
}

.tooltiptext .head .close img{
    max-width: 12px;
}

.tooltiptext .desc{
    font-size: 12px;
    white-space: initial;
}
}




.edit_complete_btn_wrap{
position: relative;
padding-top: 10px;
}
.edit_complete_btn_wrap button{
width: 100%;
font-weight: 500;
font-size: 14px;
height: auto;
padding:12px 0 ;
line-height: 1;
border-radius: var(--border-round-S);
border: 1px solid var(--primary-color);
}

.edit_complete_btn_wrap .biz_tooltip{
top:55px;
background-color:var(--accent-color);
color:#222;
width: fit-content;
right: 11px;
left: initial;
}
.edit_complete_btn_wrap .biz_tooltip::before{
border-bottom: 18px solid var(--accent-color);
}
.edit_complete_btn_wrap .biz_tooltip .head{
border-bottom: none;
padding: 0;
height: auto;
justify-content: flex-start;
gap: 10px;
}

.edit_complete_btn_wrap .biz_tooltip span img{
position: static;
}

@media (max-width:800px){
.my_campaign_detail .modal-layer .edit_complete_btn_wrap .submitBtn{
    width: 100%;
    max-width: initial;
    font-size: 14px;
}
.my_campaign_detail .floating_section .modal-layer .notice_ #edit_desc{
    font-size: 12px;
}
.edit_complete_btn_wrap .biz_tooltip .head{
    font-size: 12px;
    font-weight: 400;
}
}



.notice_check_area{
padding-top: 10px;
}
.notice_check_area input{
height: 100%;
}




.compain_detials .head .bottom_area{
display: flex;
justify-content: space-between;
align-items: center;
}

.compain_detials .head .bottom_area .details{
flex: 1;
}

.compain_detials .head .bottom_area .price_area{
flex: 1;
}



/* 개인정보 유출 조회 페이지 전용 스타일 */
#container.privacy_leak_container{
padding-top: 15px;
height: 100%;
padding-bottom: 85px;
}
#container.privacy_leak_container + .app_bar{
max-width: 800px;
display: block;
left: 50%;
transform: translateX(-50%);
}
.privacy_leak_container {
padding: 20px;
background: #f4f5f9;
min-height: calc(100vh - 140px);
word-break: keep-all;
max-width: 800px;
margin: 0 auto;
}

.privacy_leak_header {
/* text-align: center; */
margin-bottom: 30px;
padding: 20px;
background: #fff;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.privacy_leak_header h3 {
font-size: 20px;
font-weight: 700;
color: #444C67;
margin-bottom: 10px;
}

.privacy_leak_header .description {
font-size: 14px;
color: #222;
line-height: 1.5;
word-break: keep-all;
}

.leak_status_card {
background: #fff;
border-radius: 12px;
padding: 25px 20px;
margin-bottom: 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
word-break: keep-all;
}
.leak_status_card .desc_cont{
padding-top: 15px;
}
.leak_status_card .desc{
font-size:14px;
}

.leak_status_header {
display: flex;
/* align-items: center; */
/* margin-bottom: 20px; */
padding-bottom: 15px;
/* border-bottom: 1px solid #EDEDED; */
flex-direction: column;
gap:15px;
}
.leak_status_header .desc{
font-size: 14px;
}

.leak_status_icon {
width: 24px;
height: 24px;
background: #FF4848;
border-radius: 50%;
margin-right: 12px;
position: relative;
}

.leak_status_icon::before {
content: '!';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-size: 14px;
font-weight: bold;
}

.leak_status_title {
font-size: 20px;
font-weight: 700;
color: #444C67;
}

.leak_items_grid {
display: grid;
gap: 10px;
font-size: 14px;
padding: 15px;
}

.leak_items_grid .sub_desc{
font-size: 12px;
color: #666;
font-weight: 400;
}

.leak_item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 15px;
background: #F8F9FA;
border-radius: 8px;
border-left: 4px solid #FF4848;
}

.leak_item_info {
display: flex;
align-items: center;
}

.leak_item_icon {
width: 20px;
height: 20px;
margin-right: 12px;
background: #FF4848;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
}

.leak_item_icon svg {
width: 12px;
height: 12px;
fill: #fff;
}

.leak_item_label {
font-size: 15px;
font-weight: 500;
color: #444C67;
}

.leak_status_badge {
background: #FF4848;
color: #fff;
padding: 4px 8px;
border-radius: 12px;
font-size: 12px;
font-weight: 500;
}

.notice_section {
background: #fff;
border-radius: 12px;
padding: 20px;
margin-top: 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.notice_title {
font-size: 16px;
font-weight: 700;
color: #444C67;
margin-bottom: 15px;
display: flex;
align-items: center;
}
/* 
.notice_title::before {
content: 'ℹ';
display: inline-block;
width: 20px;
height: 20px;
background: #3CCBDB;
color: #fff;
border-radius: 50%;
text-align: center;
line-height: 20px;
font-size: 12px;
margin-right: 8px;
} */

.notice_content {
font-size: 14px;
color: #222;
line-height: 1.6;
}

.contact_button {
width: 100%;
background: #3CCBDB;
color: #fff;
border: none;
padding: 12px;
border-radius: 8px;
font-size: 16px;
font-weight: 500;
margin-top: 20px;
cursor: pointer;
transition: background-color 0.2s;
}

.contact_button:hover {
background: #2BB5C7;
}

/* 모바일 반응형 */
@media (max-width: 800px) {
#container.privacy_leak_container {
    padding: 15px;
    padding-bottom: 85px;
}
#header + #container.privacy_leak_container {
    padding: 15px;
}

.privacy_leak_header {
    padding: 15px;
    margin-bottom: 20px;
}

.privacy_leak_header h3 {
    font-size: 18px;
}

.leak_status_card {
    padding: 20px 15px;
    margin-bottom: 15px;
}

.leak_item {
    padding: 12px;
}

.leak_item_label {
    font-size: 14px;
}

.notice_section {
    padding: 15px;
}
}


#fbank .select__wrap{
width: 100%;
}
.modal-layer .field .selectBox__.bank_ .select__{
width: 100%;
}

#bank_upload_btn{
position: absolute; 
right: 5px;
top: 13px;
font-size:15px;
font-weight: 700;
background-color: #3CCBDB;
color: #fff; 
border-radius: 10px; 
width: 65px; 
height: 35px;
}
.pb_save_cont{
padding-left: 127px;
padding-top: 10px;
}

@media (max-width: 800px){
#bank_upload_btn{
    top: 30px;
}
.pb_save_cont{
    padding-left: 0;
    padding-top: 0;
}
.jumin_cont{
    flex-direction: column;
}
.jumin_cont .item{
    width: 100%;
}
.modal-layer .check_wrap .checkbox_ + .checkbox_{
    margin-left: 20px;
}
}


.credit_noti_cont{
padding: 30px 15px;
background: #F9F9F9; 
border-radius: 10px;
display: flex;
flex-direction: column;
gap:10px;
}

.credit_noti_cont .head_title{
color: #666;
font-size: 16px;
font-weight: 500;
}
.credit_noti_cont .content_wrap{
display: flex;
flex-direction: column;
gap:5px;
}
.credit_noti_cont .content_wrap p{
color: #888;
font-size: 14px;
font-weight: 400;
}

/* 날짜 필터 컨테이너 스타일 */
.date-filter-container {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 15px;
/* width: 100%; */
}

@media (max-width: 800px){
.date-filter-container{
    flex-direction: column;
    width: 100%;
}
}
.date_select_area, .quick_select_area{
display: flex;
align-items: center;
gap: 15px;
}

.withdraw_history .right_cont{
gap:15px;
}

.date-input-wrapper {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 15px;
border-radius: 5px;
border: 1px solid #E4E8EE;
position: relative;
cursor: pointer;
max-width:164px;
width: 100%;
padding: 0 15px;
}

.date-input {
border: none;
background: transparent;
color: #666666;
font-size: 16px;
outline: none;
cursor: pointer;
padding: 0;
text-align: center;

}

.date-input::placeholder {
color: #666666;
}

.calendar-icon {
width: 18px;
height: 18px;
position: relative;
}

.calendar-icon-body {
width: 18px;
height: 20px;
position: absolute;
left: 3px;
top: 1.96px;
background: #666666;
}

.calendar-icon-top {
width: 10px;
height: 6px;
position: absolute;
left: 7px;
top: 10.96px;
background: #666666;
}

.date-separator {
width: 21.99px;
max-width: 60px;
overflow: hidden;
display: inline-flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
}

.separator-icon {
width: 24px;
height: 24px;
position: relative;
}

.filter-button {
padding: 10px 15px;
border-radius: 100px;
border: 1px solid #E4E8EE;
background: transparent;
color: #666666;
font-size: 16px;
font-family: 'Noto Sans KR', sans-serif;
font-weight: 400;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
justify-content: center;
align-items: center;
gap: 15px;
}

@media (max-width:800px){
.date-input-wrapper{
    justify-content: space-between;
    font-size: 14px;
    max-width: none;
}
.date-input-wrapper .date-input{
    font-size: 14px;
}

.withdraw_history .point_ p:first-child{
    font-size: 14px;
    font-weight: 600;
}
.withdraw_history .details_ div:last-child{
    font-size: 12px;
}
.withdraw_history .details_ span p{
    font-size: 10px;
}
}

.filter-button:hover {
background: #f5f5f5;
}

.filter-button.active {
background: #666666;
color: white;
font-weight: 500;
border-color: #666666;
}

.filter-button.active:hover {
background: #555555;
}




.ai_content_banner_cont{
width: 100%;
padding: 30px 0 ;
}
.ai_content_banner_cont a{
display: inline-block;
}

.ai_content_banner{
display: flex;
justify-content: center;
align-items: center;
align-self: stretch;
width: 100%;
padding: 20px;
border-radius: 10px;
background-image: url(/skin/demo/img/banner/campaign.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
gap: 55px;
}
.ai_content_banner_img img{
width: 100%;
height: 100%;
object-fit: cover;
}
.banner-text-cont{
display: flex;
gap:55px;
justify-content: center;
}

.banner-title-section {
display: inline-flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
gap: 5px;
}

.banner-title-row {
display: flex;
align-items: center;
gap: 5px;
line-height: 1;
}

.banner-title {
color: #222222;
font-size: 18px;
font-family: Noto Sans KR;
font-weight: 500;
word-wrap: break-word;
}

.banner-ai-badge {
color: #fff;
font-size: 16px;
font-weight: 400;
line-height: normal;
padding: 1px 5px;
background: rgba(111, 134, 255, 0.90);
border-radius: 5px;
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
}


.banner-content-section {
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 5px;
}

.banner-main-text {
color: #222222;
font-size: 16px;
font-family: Noto Sans KR;
font-weight: 500;
word-wrap: break-word;
}

.banner-sub-text {
color: #222222;
font-size: 16px;
font-family: Noto Sans KR;
font-weight: 400;
word-wrap: break-word;
}

.banner-cta-button {
padding: 8px 16px;
background: #778FFF;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.10);
border-radius: 6px;
display: inline-flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
gap: 10px;
cursor: pointer;
}

.banner-cta-inner {
align-self: stretch;
display: inline-flex;
justify-content: flex-start;
align-items: flex-start;
}

.banner-cta-text {
color: white;
font-size: 13px;
font-family: Noto Sans KR;
font-weight: 600;
word-wrap: break-word;
}

@media (max-width:800px){
.floating_box ~ .ai_content_banner_cont{
    padding: 0;
    line-height: 1;
}
.ai_content_banner_cont{
    padding: 10px 0 ;
}
.ai_content_banner{
    justify-content: space-between;
    gap:10px;
    padding: 15px 25px;
}
.banner-text-cont{
    flex-direction: column;
    gap:5px;
}
.banner-title{
    font-size: 14px;
}
.banner-ai-badge{
    font-size: 10px;
}

.banner-main-text{
    font-weight: 400;
    font-size: 13px;
}
.banner-sub-text{
    display: none;
}
}

.list_area .imgBox .fill_label{
position: absolute;
right: 10px;
bottom: 10px;
}


.point_info{
background-color: #f9f9f9;
padding: 30px 15px;
border-radius: 10px;
display: flex;
flex-direction: column;
gap: 10px;
color: #888;
}
.point_info .desc{
display: flex;
flex-direction: column;
gap: 5px;
}

@media (max-width:800px){
.point_info{
    background:#fff;
    border-top: 10px solid #f5f5f5;
    border-radius: 0;
}
.point_info h3{
    font-size: 14px;
}
.point_info .desc{
    font-size: 12px;
}
}

.compain_detials .head .details > div.price_label_cont{
margin-left: auto;
padding-right: 0;
display: flex;
align-items: center;
gap:10px;
flex-wrap: wrap;
}

.tex_info_cont{
text-align: right;
font-size: 14px;
color: #888;
padding-top: 5px;
}

.opt_info_area{
display: flex;
align-items: center;
gap:5px;
flex-wrap: wrap;
}
.opt_info_area .gray_border_label{
font-size: 14px;
}

@media (max-width:800px){
.compain_detials .head .details > div.price_label_cont{
    gap:5px;
}
.tex_info_cont{
    text-align: left;
    font-size: 10px;
}
.compain_detials .head .details > div.price_label_cont{
    margin-left: 0;
}
.opt_info_area .gray_border_label{
    font-size: 12px;
}
}