@charset "utf-8";

/* button */
/*.btn{display: block; margin: 0 auto; width: 100%; max-width: 240px; background: #fff; border-radius: 24px; border: 0; font-size: 14px;}*/
/*.btn-follow{background: #fff; color: #be3455}*/
/*.btn-follow.on{background: #646464;}*/
/*.btn-pink { background: #be3455; border-radius: 21px;}*/
/*.btn-gray { background: #646464; border-radius: 21px;}*/
/*.btn-white {background: #ffffff; border-radius: 24px;}*/
/*.btn-border-w {border: 1px solid #fff; background: transparent; color: #fff;}*/
/*.btn-transparent{background: transparent; border-radius: 5px; border: solid 1px #a8a8a8;}*/
/*.btn-opacity{ border-radius: 10px; background-color: rgba(0, 0, 0, 0.7); }*/
/*.btn-private{ font-size: 13px;  color: rgba(255, 255, 255, 0.5);}*/
/*.btn-visit{width: 36px;height: 36px; text-align: center; line-height: 34px; background: url(../images/metaroom/ic_home_white.svg) no-repeat center; }*/
/*.btn-visit.disable{background: url(../images/metaroom/ic_home_gray.svg) no-repeat center; border: 1px solid #4d4d4d; pointer-events: none;}*/
/*.btn-private{width: 58px;height: 36px; border: none; text-align: center; line-height: 34px}*/
/*.btn-disable{background-color: transparent; border: solid 1px rgba(255, 255, 255, 0.5); color: #fff; opacity: 0.5; pointer-events: none;}*/
/*.btn-able{ background: #be3455; opacity: 1; color: #fff;}*/
/*.room-menu {display: block; position: absolute; top:50px; left: 50px; }*/
/*.btn-f{!*width: 71px; height: 36px;*! border-radius: 5px;text-align: center; line-height: 34px; background: #be3455}*/
/*.btn-edit{width: 100%; max-width: calc(100% - 27px); height: 54px; line-height: 52px; margin: 0; margin-top: 10px;}*/
/*.btn-box .btn{font-weight:500; !*width: 87px; height: 44px; *! max-height: 44px;  border-radius: 22px; word-break: keep-all;}*/

/*.icon-close { !*position: absolute; top: 44px; left: 37px; *! width: 17px; height: 17px; background: url(../../assets/images/metaroom/icon_popup_close.svg) no-repeat center; text-indent: -9999px; cursor: pointer;z-index: 99999; }*/
/*.right-box .icon-back { position: absolute; top: 39px; left: 37px; width: 17px; height: 17px; background: url(../images/metaroom/arrow-r-white.svg) no-repeat center; background-size: contain; transform: rotate(180deg); text-indent: -9999px; cursor: pointer; }*/
/*.btn-right-box-close { position: absolute; top: 39px; left: 37px; width: 17px; height: 17px; background: url(../../assets/images/metaroom/icon_popup_close.svg) no-repeat center; text-indent: -9999px; cursor: pointer; z-index: 99999; }*/



/*@media all and (max-width: 1000px){*/
/*    .room-menu.disable{display: none;}*/
/*!*    .icon-close { left: 20px; top: 28px; }*!*/
/*    .btn-right-box-close { left: 30px; top: 28px; }*/

/*}*/


/*.text-hidden { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }*/

/*.pd-r20 { padding-right: 20px; }*/

/*.btn-pink-color { background-color: #be3455 !important; color: #fff !important; }
.btn-gray-color { background: #646464 !important; color: #fff !important; }*/
.btn-gray-color2 { }
.btn-gray-color3 { background: #bcbcbc !important; color: #fff !important; }
.btn-pink-line { border: 1px solid #be3455 !important; color: #be3455 !important; }
.btn-white-line { border: 1px solid #fff !important; color: #fff !important; }

.btn-pink-color.disable { color: #d06e85 !important; pointer-events: none !important; user-select: none !important; }
.btn-gray-color2.disable { color: #d7d7d7 !important; pointer-events: none !important; user-select: none!important; }
.btn-white-line.disable { color: #a8a8a8 !important; pointer-events: none !important; user-select: none !important; }

.btn-radius05 { border-radius: 5px !important; }
.btn-radius10 { border-radius: 10px !important; }
.btn-radius30 { border-radius: 30px !important; }


.btn-size-full { width: 100% !important; padding: 17px !important; }

.btn-flex-box { display: flex; justify-content: center; gap: 10px; width: 100%; }
.btn-flex-box button { flex: 1 1 0; }

.btn-dot-menu { width: 5px; height: 30px; margin: 0 10px; background: url('../images/metaroom/icon_popup_more_default.svg') no-repeat center center;  }
.btn-dot-menu:hover { background: url('../images/metaroom/icon_popup_more_pressed.svg') no-repeat center center;  }




@media all and (max-width: 1000px){
    .pd-r20 { padding-right: 10px; }

    .btn-size-full { padding: 11px !important; }

    .btn-flex-box button { flex: 0 0 auto; }

    .btn-dot-menu,
    .btn-dot-menu:hover { background-size: 66%; }

}

input[type="file"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); word-break: initial; word-wrap: initial; }
.img.img-preview-box span label { display:flex; justify-content: center; align-items: center; width: 100%; height:100%; }



/* my-box-menu */
.my-box-menu .menu-content .mybox-list { display: none; position: relative; width: inherit; color: #fff; }
.my-box-menu .menu-content .mybox-list.on {display: flex; flex-direction: column; }
.my-box-menu .menu-content .mybox-list .content-m .sub-text { margin-top: 3px; font-size: 13px; text-align: left; }


/* my-box-menu *//* room-list-line */
.room-list-line { display: flex; flex-direction: column; flex: 1; overflow: hidden; }
.room-list-line .room-list-ul { padding-right: 20px; overflow-y: auto; }
.room-list-line .room-list-ul .room-list-li { display: flex; justify-content: space-between; align-items: center; gap: 7px; padding: 12px 0; border-bottom: 1px solid #4b4b4b; }
.room-list-line .room-list-ul .room-list-li .room-info { display: flex; align-items: center; gap: 10px; width: 100%; max-width: calc(100% - 40px); font-size: 14px; }
.room-list-line .room-list-ul .room-list-li .room-info .img { position: relative; width: 54px; height: 54px; flex: 0 0 auto; }
.room-list-line .room-list-ul .room-list-li .room-info .img span { display: inline-block; width: 100%; height: 100%; border: none; border-radius: 50%; text-align: center; overflow: hidden; }
.room-list-line .room-list-ul .room-list-li .room-info .img span img { display: inline-block; width: 100%; height: 100%; object-fit: cover; object-position: center center; margin: 0 auto; border-radius: 50%; }
.room-list-line .room-list-ul .room-list-li .room-info .txt { overflow: hidden; color: #fff; }
.room-list-line .room-list-ul .room-list-li .room-info .txt p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.room-list-line .room-list-ul .room-list-li .room-info .txt .rm-domain { font-size: 13px; color: #767676; }

.room-list-line .room-list-ul .room-list-li .btn-group { flex: 0 0 auto; }
.room-list-line .room-list-ul .room-list-li .btn-group a { width: 36px; height: 36px; border-radius: 50%; }
.room-list-line .room-list-ul .room-list-li .btn-group a.btn-room-live { background: url(../../assets/images/metaroom/icon_live.svg) no-repeat center center; background-size: contain; }
.room-list-line .room-list-ul .room-list-li .btn-group a.btn-room-white { background: url(../images/metaroom/ic_home_white.svg) no-repeat center center; border: 1px solid #fff; }
.room-list-line .room-list-ul .room-list-li .btn-group a.btn-room-pink { background: url(../../assets/images/metaroom/ic_home_pink.svg) no-repeat center center; border: 1px solid #be3455; }
.room-list-line .room-list-ul .room-list-li .btn-group a.btn-room-in { background: #434343 url(../images/metaroom/ic_in_gray.svg) no-repeat center center; }
.room-list-line .room-list-ul .room-list-li .btn-group a span { position: relative; display: inline-block; text-indent: -9999px; }

@media all and (max-width:1000px){
    .room-list-line .room-list-ul .room-list-li { padding: 7px 0; }
    .room-list-line .room-list-ul .room-list-li .room-info { display: flex; align-items: center; gap: 10px; width: 100%; max-width: calc(100% - 40px); }
    .room-list-line .room-list-ul .room-list-li .room-info .img { width: 42px;height: 42px; }
    .room-list-line .room-list-ul .room-list-li .room-info .txt .rm-domain { font-size: 12px; }
    .room-list-line .room-list-ul .room-list-li .btn-group a { width: 32px; height: 32px; }

}

/* my-box-menu *//* room-list-gallery */
/*.room-list-gallery ul { display: flex; flex-wrap: wrap; gap: 20px; padding: 20px 20px 24px 0; }*/
/*.room-list-gallery ul li { position: relative; width: calc(50% - 10px); height: 49%; border-radius: 5px; }*/
/*.room-list-gallery ul li .room-name { margin: 10px 0; color: #fff; font-size: 15px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }*/
/*.room-list-gallery ul li .room-link { width: 100%; padding: 10px; margin-bottom: 5px; border-radius: 21px; color: #fff; font-size: 13px; text-align: center; }*/
/*.room-list-gallery ul li .room-link.room-in { background: #666; cursor: default; }*/
/*.room-list-gallery ul li .room-link.room-have { background: #be3455; }*/
/*.room-list-gallery ul li .room-link.room-buy { border: 1px solid #fff; background: transparent; }*/
/*.room-list-gallery ul li .icon-new{display: none;position: absolute;top: 10px;left: 8px;width: 20px;height: 20px;border-radius: 50%;background: url(../../assets/images/metaroom/icon_new.svg) no-repeat center;z-index: 999;}*/
/*.room-list-gallery ul li .icon-new.on{display: block;}*/
/*.room-list-gallery ul li .icon-mainroom { display: none; position: absolute; top: 10px; left: 8px; height: 20px; padding: 0 8px; border-radius: 22px; background-color: #be3455; font-size: 12px; font-weight: lighter; color:#fff; z-index: 999;}*/
/*.room-list-gallery ul li .icon-mainroom.on{display: block;}*/

/*@media all and (max-width: 1000px){*/
/*    .room-list-gallery-wrap:first-child { margin-top: 30px; }*/
/*    .room-list-gallery ul { gap: 14px 15px; padding: 10px 20px 24px 0; }*/
/*    .room-list-gallery ul li { width: calc(50% - 8px); }*/
/*    .room-list-gallery ul li .room-name { margin: 3px 0 7px; font-size: 12px; }*/
/*    .room-list-gallery ul li .room-link { padding: 6px; font-size: 11px; }*/
/*    .room-list-gallery ul li .icon-new{top: 6px;left: 6px;}*/
/*}*/

.user-cnt { display: flex; justify-content: center; gap: 8px; width: 100%; font-size: 14px; }
.user-cnt .img { position: relative; flex: 0 0 auto; width: 40px; height: 40px; }
.user-cnt .txt { flex: 1 1 0; }


/* dim box */
.dim-box{width: 100%;height: 100%;}
.dim-box .img{position: relative;width: 100%; max-width: 100%; z-index: 1;}
.dim-box .img span,
.dim-box .img p {position: relative;z-index: 1;width: 100%;padding-top: 100%;display: inline-block;font-size: 0; border-radius: 5px;}
.dim-box .img span img,
.dim-box .img p img {position: absolute; left: 0; top: 0; margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; border-radius: 5px; cursor: pointer; }

/* swiper tab */
.swiper-menu { width:100%; max-width: calc(100% - 20px); padding-bottom: 3px; margin-bottom: 12px; border-bottom: 1px solid #4d4d4d; overflow: hidden; }
.swiper-menu .swiper-wrapper { display: flex; align-items: center;  }
.swiper-menu .swiper-wrapper button { position: relative; width: auto; padding: 8px 18px; font-size: 14px; color: #A8A8A8; }
.swiper-menu .swiper-wrapper button.on{ font-weight: bold; color:#fff; }
/*.right-content .menu-content .social-form .social-form-top button.swiper-slide-active::after*/
.swiper-menu .swiper-wrapper button.on::after { content: ""; position: absolute; left: 0; bottom: -3px; display: block; width: 100%; height: 3px; background-color:#be3455; }

.swiper-menu .swiper-button-prev,
.swiper-menu .swiper-button-next { top: 0; height: 100%; color: #666; padding: 0 3px; background-color: #222; }
.swiper-menu .swiper-button-prev { left: -2px; }
.swiper-menu .swiper-button-next { right: -2px; }
.swiper-menu .swiper-button-prev.swiper-button-disabled,
.swiper-menu .swiper-button-next.swiper-button-disabled { display: none; }
.swiper-menu.wide { max-width: calc(100% - 30px); }

.swiper-btn { width:100%; max-width: calc(100% - 20px); margin: 20px 0; overflow: hidden; }
.swiper-btn .swiper-wrapper { position: relative; display: flex; align-items: center; gap: 12px; }
.swiper-btn .swiper-wrapper button { position: relative; width: auto; padding: 8px 18px; border: 1px solid #fff; border-radius: 22px; font-size: 14px; font-weight: 500; color: #fff; }
.swiper-btn .swiper-wrapper button.on{ color:#be3455; background-color: #fff; }






/* modal */
.mask { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); transition: all 0.5s; visibility: hidden; opacity: 0; z-index: 9; }
.modal-wrap { display: none; justify-content:center; align-items:center; position:fixed; top: 50%; left: 50%; width: 100%; height: 100%; transform:translate(-50%,-50%); background: rgba(0, 0, 0, 0.35); transition: 0.5s; visibility: hidden; opacity: 0; z-index:100; }
.modal { position: relative; width: 90%; max-width: 280px; padding: 24px 20px 20px; border-radius: 20px; background-color:  var(--gray1e); color:  #fff; font-size: 15px; }
.modal-head h5 { font-size: 14px; font-weight: 600; text-align: left; color: #fff;}
.modal-head .modal-close { position: absolute; top: 15px; right: 15px; }
.modal-head .modal-close::before { display:block; content:"\e922"; width: 25px;	height: 24px; line-height: 24px;font-size: 16px; font-family: 'xeicon'; } /* x */
.modal-body { font-size: 14px; text-align: center;}
.modal-body .form-basic,
.modal-body .btn-box { margin:0; }
.modal-body .form-basic + .form-basic,
.modal-body .form-basic + .btn-box { margin-top: 10px; }
.modal-body .input-chk.invalid span { font-size: 12px; }
.modal-body .respTable table td { padding: 10px 5px; }
.modal-body .select-style { user-select: none; }
.modal-body .select-style li { padding: 9px; font-size: 15px; cursor: pointer; }
.modal-body .select-style li:hover,
.modal-body .select-style li.checked { color: var(--primary); }
.modal-body .no-data { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; }
.modal-foot { display: flex; justify-content: space-between; margin-top:20px; gap: 12px;}
/*.modal-foot .modal-close{width: 50%; max-width: 142px; background: rgba(0, 0, 0, 0.5);}*/
/*.modal-foot .modal-confirm{width: 50%; max-width: 142px; background: #be3455;}*/
.modal-foot button { flex: 1 1 0; padding: 14px 10px; border-radius: 8px; font-size: 15px; }
.modal-foot .btn-full { width: 100%; max-width: 100%; }
.modal-foot .btn-size-full { width: 100%; max-width: 100%; padding: 0 !important; }
.modal-foot .btn-half { width: 50%; }
.modal.modal370 { max-width: 370px; }
.modal.modal600 { max-width: 600px; }
.modal.modal-warning .modal-body { text-align: center; }
.modal.modal-warning .modal-body p.err { font-size: 16px; color: red; }
.modal.modal-warning .modal-body p.err::before { display: block; content: "\e9ab"; width: 40px; height: 40px; line-height: 40px; margin: 0 auto 10px; } /* ! */

.modal .icon-close { position: absolute; top: 26px; right: 22px; width: 16px; height: 16px; text-indent: -9999px; cursor: pointer; z-index: 10;}
.visible { visibility: visible; opacity: 1; display: flex;}
.not_scroll {overflow: hidden; }

#all-open .modal-foot .modal-confirm{width: 100%; max-width: 100%;}
#confirm-remove .modal-foot .modal-confirm{width: 100%; max-width: 100%;}

#popup .modal-foot button{width: 100%; max-width: 100%;}


#joinBox { opacity: 1; visibility: visible; }
#joinBox .modal { display: flex; flex-direction: column; width: 90%; max-width: 484px; height: 90%; max-height: 880px; padding: 36px 42px; border-radius: 47px; }
#joinBox .modal-head{margin-bottom: 35px;}
#joinBox .modal-head h5{ font-size: 22px; color: #000; }
#joinBox .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#joinBox .modal-body .form-wrap label { display: block; font-size: 14px; font-weight: 500; }
#joinBox .modal-body .form-wrap input { display: block; width: 99%; padding: 14px; margin: 8px auto 14px; border-radius: 8px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16); font-size: 13px; }
#joinBox .modal-body .agree-wrap input[type="checkbox"]{display: none;}
#joinBox .modal-body .agree-wrap p { width: 99%; padding: 12px 15px; margin: 24px auto 14px; border-radius: 8px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.16); font-size: 15px; font-weight: 500; }
#joinBox .modal-body .agree-wrap p label::before { content:""; display: inline-block; width: 20px; height: 20px; margin-right: 10px; border-radius: 50%; vertical-align: middle; background: #dbdbdb url('/assets/images/metaroom/checkbox_check.svg') no-repeat center center; }
#joinBox .modal-body .agree-wrap p input[type="checkbox"]:checked + label::before { background-color: #be3455; }
#joinBox .modal-body .agree-wrap ul { padding: 0 22px 24px; margin-bottom: 18px; border-bottom: 1px solid  #ededed; }
#joinBox .modal-body .agree-wrap ul li { display: flex; justify-content: space-between; font-size: 13px; line-height: 190%; }
#joinBox .modal-body .agree-wrap ul li label::before { display: inline-block; content:""; width: 11px; height: 8px; margin-right: 14px; background: url('/assets/images/metaroom/icon_check_gray.svg') no-repeat center center;  }
#joinBox .modal-body .agree-wrap ul li input[type="checkbox"]:checked + label::before{ background: url('/assets/images/metaroom/icon_check_pink.svg') no-repeat center center;  }
#joinBox .modal-body .agree-wrap ul li a { font-size: 13px;  color: #666; text-decoration: underline; }
#joinBox .modal-foot { margin-top: 24px; }
#joinBox .modal-foot button { max-width: 340px; background: #be3455; }
#joinBox .modal .icon-close{top: 40px; left: initial; right: 40px; background: url(../../assets/images/metaroom/icon_close_black.svg) no-repeat center center; }

#domainExist .modal .modal-foot .modal-close,
#domainTrue .modal .modal-foot .modal-close,
#settingSave .modal .modal-foot .modal-close { width: 100%; max-width: 100%; background: #be3455; }

#flw-room { }
#flw-room .modal { display: flex; flex-direction: column; padding: 35px 20px 20px; max-height: 85%; }
#flw-room .modal-body { max-height: calc(100% - 50px); padding: 0; overflow-y: auto; }
#flw-room .modal-body .user-rm-list { }
#flw-room .modal-body .user-rm-list .user-rooms { display: flex; justify-content: space-between; align-items: center; gap: 7px; }
#flw-room .modal-body .user-rm-list .user-rooms .user-info { display: flex; align-items: center; gap: 10px; width: 100%; max-width: calc(100% - 43px); font-size: 14px; text-align: left; }
#flw-room .modal-body .user-rm-list .user-rooms .user-info .img { position: relative;width: 54px;height: 54px; flex: 0 0 auto; }
#flw-room .modal-body .user-rm-list .user-rooms .user-info .img span{width: 100%;height: 100%;display: inline-block;border: none;border-radius: 50%;text-align: center;overflow: hidden;}
#flw-room .modal-body .user-rm-list .user-rooms .user-info .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; border-radius: 50%;}
#flw-room .modal-body .user-rm-list .user-rooms .user-info .txt { overflow: hidden; }
#flw-room .modal-body .user-rm-list .user-rooms .user-info .txt p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#flw-room .modal-body .user-rm-list .user-rooms .user-info .txt .rm-domain { font-size: 13px; color: #767676; }
#flw-room .modal-body .user-rm-list .user-rooms .btn-box { flex: 0 0 auto; }
#flw-room .modal-body .user-rm-list .user-rooms .btn-box a { width: 36px; height: 36px; border-radius: 50%; }
#flw-room .modal-body .user-rm-list .user-rooms .btn-box a.btn-change-room { background: url(../../assets/images/metaroom/ic_home_pink.svg) no-repeat center center; border: 1px solid #be3455; }
#flw-room .modal-body .user-rm-list .user-rooms .btn-box a.btn-now-room { background: #dbdbdb
 url(../images/metaroom/ic_in_white.svg) no-repeat center center;  }
#flw-room .modal-body .user-rm-list .user-rooms .btn-box a span { position: relative; display: inline-block; text-indent: -9999px; }
#flw-room .modal-body .user-rm-list .user-rooms + .user-rooms { padding-top: 12px; margin: 12px 0; border-top: 1px solid #ededed; }
#flw-room .modal-foot { margin-top: 18px; }
#flw-room .modal-foot .modal-close { width: 100%; max-width: 100%; background-color: #bcbcbc; }

@media all and (max-width: 1000px){
    #flw-room .modal { padding: 25px 20px; }
    #flw-room .modal-body .user-rm-list .user-rooms .user-info { font-size: 13px; }
    #flw-room .modal-body .user-rm-list .user-rooms .user-info .img { width: 42px;height: 42px; }
    #flw-room .modal-body .user-rm-list .user-rooms .user-info .txt .rm-domain { font-size: 12px; }
    #flw-room .modal-body .user-rm-list .user-rooms .btn-box a { width: 32px; height: 32px;}
    #flw-room .modal-body .user-rm-list .user-rooms .btn-box a.btn-change-room,
    #flw-room .modal-body .user-rm-list .user-rooms .btn-box a.btn-now-room { background-size: 12px;  }
    #flw-room .modal-body .user-rm-list .user-rooms + .user-list-cnt { padding-top: 9px; margin: 9px 0; }
    #flw-room .modal-foot { margin-top: 18px; }

}

#work-detail.modal-wrap{background: transparent;}
#work-detail .modal{position: relative;width: 90%;max-width: 410px;max-height: 86%;padding: 25px 8px 25px 30px; border-radius: 20px;background-color: rgba(0, 0, 0, 0.8);box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);display: flex;flex-direction: column;}
#work-detail .modal .modal-head{padding-bottom: 16px;}
#work-detail .modal .modal-head h5{font-size: 18px}
#work-detail .modal .modal-body {text-align: left; overflow-y: auto; padding-right: 16px; padding-top: 0;}
#work-detail .modal .modal-body .user-info {display: flex; margin-bottom: 10px;}
#work-detail .modal .modal-body .user-info .img-desc .num-edition{margin-top: 15px;}
#work-detail .modal .modal-body .user-info .img{position: relative;width: 40px;height: 40px;z-index: 1;}
#work-detail .modal .modal-body .user-info .img span{width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 12px;   text-align: center;   overflow: hidden;}
#work-detail .modal .modal-body .user-info .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; border-radius: 50%;}
#work-detail .modal .modal-body .nft-desc{color: #fff; font-weight: normal; height: 100%; max-height: 137px;}
#work-detail .modal .modal-foot {margin-top: 20px; width: calc(100% - 22px);}
#work-detail .modal .modal-foot .modal-close{ width: 100%; max-width: 100%; border-radius: 24px;border: solid 1px #fff; background: transparent;}
#work-detail .img-wrap{width: 100%;max-width: 89px;font-size: 0;}
#work-detail .img-wrap .img-box p {position: relative;z-index: 1;width: 100%;padding-top: 161%;display: inline-block;font-size: 0;}
#work-detail .img-wrap .img-box p img{position: absolute;left: 0;top: 0;margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#work-detail .img-desc .img-wrap{width: 100%; max-width: 40px; font-size: 0;}
#work-detail .img-desc .img-wrap .img-box p {position: relative;z-index: 1;width: 100%;padding-top: 100%;display: inline-block;font-size: 0;}
#work-detail .img-desc .img-wrap .img-box p img{position: absolute;left: 0;top: 0;margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; border-radius: 50%;}

@media all and (max-width: 1000px){
    #work-detail .modal .modal-foot .modal-close{height: 40px; line-height: 38px;}
}

.img-wrap{width: 100%;max-width: 89px;font-size: 0;}
.img-wrap .img-box p {position: relative;z-index: 1;width: 100%;padding-top: 161%;display: inline-block;font-size: 0;}
.img-wrap .img-box p img{position: absolute;left: 0;top: 0;margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
.scroll-box{flex: 1; display: block; overflow-y: auto; padding-right: 20px;}
/*
프로그래스바
*/
.pg-wrap{position: fixed; left: 0; top: 0;  width: 100%; height: 100%; background: rgba(0,0,0,0.7);}
.pg-wrap > div{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);width: 80%;max-width: 400px;height: 50%;max-height: 90px;background: #fff;border-radius: 15px;padding: 20px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.pg-wrap > div > p{text-align: center; font-size: 16px; color: #be3455}
.progress_bar {margin: 10px 18px;width: 90%;height: 3px;background-color: #eee;border-radius: 5px;overflow: hidden;}
.progress_bar .progress_line {height: 100%;width: 0;text-align: center;line-height: 30px;font-weight: 300;letter-spacing: 1px;font-family: sans-serif;color: #fff;content: "";background-color: #be3455;}

.loader-115 {text-align: center;display: inline-block;color: #be3455;position: relative;font-size: 16px;}
.loader-115::after {content: '';width: 5px;height: 5px;background: #be3455;position: absolute;bottom: 4px;right: -10px;animation: animloader115 1s linear infinite;}
@keyframes animloader115 {
    0% { box-shadow: 10px 0 rgba(190,52,85, 0), 20px 0 rgba(190,52,85, 0);}
    50% { box-shadow: 10px 0 rgba(190,52,85, 1), 20px 0 rgba(190,52,85, 0);}
    100% { box-shadow: 10px 0 rgba(190,52,85, 1), 20px 0 rgba(190,52,85, 1);}
}
.message-box{position: absolute; right: 0; bottom: 0; width: 90%; max-width: 392px; height: 179px; background-color: rgba(0, 0, 0, 0.8); color: #fff; padding: 25px; text-align: center; display: none; flex-direction: column; }
.message-box.on{display: flex;}
.message-box div:first-child{ font-size: 15px; display: flex; align-items: center;justify-content: center; flex: 1; padding-bottom: 30px;}
.message-box div:first-child img{width: 14px; height: 20px; margin-right: 5px;}
.message-box div:first-child span {margin-left: 5px;}
.message-box .btn-box .btn{  border-radius: 5px; background-color: #fff; width: 156px; height: 48px; color: #000;}

@media all and (max-width: 1000px){
    .message-box{width: 40%; max-width: 392px; height: auto; max-height: 179px;  }
    .message-box .btn-box .btn{  border-radius: 5px; background-color: #fff; width: 100%; max-width: 156px; height: 30px; color: #000; font-size: 12px;}

}



/* swiper 새로 만듦*/
.message-wrap{position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: none;}
.message-wrap.on{display: block}
.swiper.messageSwiper{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);background: #fff9c9;width: 50%;max-width: 630px;height: 70%;max-height: 630px; overflow: visible;}
.swiper.messageSwiper .swiper-button-next{right: -10%;left: auto;font-size: 0;width: 19px; height: 34px; background: url(../images/metaroom/arrow-r-white.svg) no-repeat center center;}
.swiper.messageSwiper .swiper-button-prev{left: -10%;right: auto;font-size: 0;width: 19px; height: 34px; background: url(../images/metaroom/arrow-r-white.svg) no-repeat center center; transform: rotate(-180deg)}
.messageSwiper .swiper-wrapper .swiper-slide{width: 70%;max-width: 630px; z-index: 1; position: relative;}
.messageSwiper .swiper-wrapper .swiper-slide .user-list{opacity: 0;}
.messageSwiper .swiper-wrapper .swiper-slide-active .user-list{opacity: 1; visibility: visible; overflow-y: auto;}
.messageSwiper .swiper-wrapper .swiper-slide-nest .user-list,
.messageSwiper .swiper-wrapper .swiper-slide-prev .user-list{opacity: 0; pointer-events: none; z-index: 0;}


.messageSwiper .message-footer{display: flex; justify-content: space-between; color: #fff; margin-top: 5%;}
.messageSwiper .message-footer > div:first-child{width: 60%;}
.messageSwiper .message-footer > div button { font-size: 24px; text-decoration: underline;}
.messageSwiper .message-footer > div button:first-child{margin-right: 11.42%;}
.messageSwiper .swiper-pagination{position: relative; bottom: 0; width: auto; font-size: 24px;}
.messageSwiper .swiper-pagination .swiper-pagination-total{opacity: 0.35;}

.messageSwiper .swiper-slide .user-list { height: 100%; display: flex; flex-direction: column; padding: 9%;}
.messageSwiper .swiper-slide .user-list .user-list-cnt{display: flex; align-items: center;}
.messageSwiper .swiper-slide .user-list .user-message{margin: 5% 0 2% 0; font-size: 24px; flex: 1;}
.messageSwiper .swiper-slide .user-list button{border: 1px solid #000; border-radius: 0; height: 72px; line-height: 70px; width: 100%; max-width: 510px; margin: 0 auto;}
.messageSwiper .swiper-slide .user-list .user-list-cnt .img{position: relative;width: 70px;height: 70px;z-index: 1; margin-right: 20px;}
.messageSwiper .swiper-slide .user-list .user-list-cnt .img span{position: relative;z-index: 1;width: 100%;padding-top: 100%;display: inline-block;font-size: 0;}
.messageSwiper .swiper-slide .user-list .user-list-cnt .img span img{position: absolute;left: 0;top: 0;margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; }

.messageSwiper .swiper-slide .user-list .user-list-cnt .txt > a{position: relative; font-size: 24px; display: flex; align-items: center;}
.messageSwiper .swiper-slide .user-list .user-list-cnt .txt > a:after{margin-left: 10px; content: 'N';  width: 36px; height: 36px;display: flex;justify-content: center;align-items: center;color: #fff;border-radius: 18px;background-color: #be3455;}
.messageSwiper .swiper-slide .user-list .user-list-cnt .txt > p{font-size: 14px; color: #a8a8a8}
.message-wrap .icon-close{position: absolute; right: 5%; top: 6%; background: url(../../assets/images/metaroom/icon_popup_close.svg) no-repeat center center; background-size: cover; width: 42px; height: 42px;}

.swiper.giftSwiper{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);background: #fff9c9;width: 50%;max-width: 630px;height: 70%;max-height: 630px; overflow: visible;}
.swiper.giftSwiper .swiper-button-next{right: -10%;left: auto;font-size: 0;width: 19px; height: 34px; background: url(../images/metaroom/arrow-r-white.svg) no-repeat center center;}
.swiper.giftSwiper .swiper-button-prev{left: -10%;right: auto;font-size: 0;width: 19px; height: 34px; background: url(../images/metaroom/arrow-r-white.svg) no-repeat center center; transform: rotate(-180deg)}
.giftSwiper .swiper-wrapper .swiper-slide{width: 70%;max-width: 630px; z-index: 1; position: relative;}
.giftSwiper .swiper-wrapper .swiper-slide .user-list{opacity: 0;}
.giftSwiper .swiper-wrapper .swiper-slide-active .user-list{opacity: 1; visibility: visible; overflow-y: auto;}
.giftSwiper .swiper-wrapper .swiper-slide-nest .user-list,
.giftSwiper .swiper-wrapper .swiper-slide-prev .user-list{opacity: 0; pointer-events: none; z-index: 0;}


.giftSwiper .message-footer{display: flex; justify-content: space-between; color: #fff; margin-top: 5%;}
.giftSwiper .message-footer > div:first-child{width: 60%;}
.giftSwiper .message-footer > div button { font-size: 24px; text-decoration: underline;}
.giftSwiper .message-footer > div button:first-child{margin-right: 11.42%;}
.giftSwiper .swiper-pagination{position: relative; bottom: 0; width: auto; font-size: 24px;}
.giftSwiper .swiper-pagination .swiper-pagination-total{opacity: 0.35;}

.giftSwiper .swiper-slide .user-list { height: 100%; display: flex; flex-direction: column; padding: 9%;}
.giftSwiper .swiper-slide .user-list .user-list-cnt{display: flex; align-items: center;}
.giftSwiper .swiper-slide .user-list .user-message{margin: 5% 0 2% 0; font-size: 24px; flex: 1;}
.giftSwiper .swiper-slide .user-list .user-message p {font-weight: 500}
.giftSwiper .swiper-slide .user-list button{border: 1px solid #000; border-radius: 0; height: 72px; line-height: 70px; width: 100%; max-width: 510px; margin: 0 auto;}
.giftSwiper .swiper-slide .user-list .user-list-cnt .img{position: relative;width: 70px;height: 70px;z-index: 1; margin-right: 20px;}
.giftSwiper .swiper-slide .user-list .user-list-cnt .img span{position: relative;z-index: 1;width: 100%;padding-top: 100%;display: inline-block;font-size: 0;}
.giftSwiper .swiper-slide .user-list .user-list-cnt .img span img{position: absolute;left: 0;top: 0;margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; }

.giftSwiper .swiper-slide .user-list .user-list-cnt .txt > a{position: relative; font-size: 24px; display: flex; align-items: center;}
.giftSwiper .swiper-slide .user-list .user-list-cnt .txt > a:after{margin-left: 10px; content: 'N';  width: 36px; height: 36px;display: flex;justify-content: center;align-items: center;color: #fff;border-radius: 18px;background-color: #be3455;}
.giftSwiper .swiper-slide .user-list .user-list-cnt .txt > p{font-size: 14px; color: #a8a8a8}


@media all and (max-width: 1000px){
    .message-wrap .messageSwiper .user-list .user-list-cnt .img{width: 36px; height: 36px;}
    .messageSwiper .swiper-slide .user-list{padding: 20px;}
    .messageSwiper .message-footer{font-size: 12px; margin-top: 2%;}
    .messageSwiper .swiper-slide .user-list .user-list-cnt .txt > a{font-size: 14px;}
    .messageSwiper .swiper-slide .user-list .user-list-cnt .txt > p{font-size: 10px;}
    .messageSwiper .swiper-slide .user-list .user-message{font-size: 14px;}
    .messageSwiper .swiper-slide .user-list .user-list-cnt .txt > a:after{width: 16px; height: 16px; font-size: 10px; margin-left: 6px;}
    .messageSwiper .swiper-slide .user-list button{height: 40px; line-height: 38px;}
    .messageSwiper .message-footer > div button{font-size: 12px;}
    .messageSwiper .swiper-pagination{font-size: 12px;}

    .message-wrap .giftSwiper .user-list .user-list-cnt .img{width: 36px; height: 36px;}
    .giftSwiper .swiper-slide .user-list{padding: 20px;}
    .giftSwiper .message-footer{font-size: 12px; margin-top: 2%;}
    .giftSwiper .swiper-slide .user-list .user-list-cnt .txt > a{font-size: 14px;}
    .giftSwiper .swiper-slide .user-list .user-list-cnt .txt > p{font-size: 10px;}
    .giftSwiper .swiper-slide .user-list .user-message{font-size: 14px;}
    .giftSwiper .swiper-slide .user-list .user-list-cnt .txt > a:after{width: 16px; height: 16px; font-size: 10px; margin-left: 6px;}
    .giftSwiper .swiper-slide .user-list button{height: 40px; line-height: 38px;}
    .giftSwiper .message-footer > div button{font-size: 12px;}
    .giftSwiper .swiper-pagination{font-size: 12px;}

    .message-wrap .icon-close{width: 14px; height: 14px;}
}

#add_nft{opacity: 1; visibility: visible;} /*flex로 바뀌어야됨*/
#add_nft.modal-wrap{background: transparent;}
#add_nft .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 90%; max-height: 618px;}
#add_nft .modal-head{margin-bottom: 29px;}
#add_nft .modal-head h5{ font-size: 18px;}
#add_nft .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#add_nft .modal-body .nft-list{display: flex; align-items: center; padding: 9px 0;}

#add_nft .modal-body .nft-list input[type="checkbox"]{display: none;}
#add_nft .modal-body .nft-list input[type="checkbox"] + label{display: block; margin-right: 25px; width: 24px; height: 24px; background-color: #fff; border-radius: 5px;}
/* label 로 display 왔다갔다 해야됨 */
#add_nft .modal-body .nft-list input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}

#add_nft .modal-body .nft-list .img{position: relative;width: 86px;height: 86px;z-index: 1;}
#add_nft .modal-body .nft-list .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 12px;   text-align: center;   overflow: hidden;}
#add_nft .modal-body .nft-list .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#add_nft .modal-body .nft-list .txt{display: flex; flex-direction: column; color: #fff; padding: 0 15px; flex: 1;}

#add_nft .modal-body .nft-list .txt div{ font-size: 14px; font-weight: 500}
#add_nft .modal-body .nft-list .txt span{ color: #999; font-size: 12px;}


#add_nft .modal-foot .modal-close{width: 100%;max-width: calc(100% - 14px);background: #be3455;margin: 0;}
#add_nft .modal .icon-close{top: 40px; right: 40px;}

@media all and (max-width: 1000px){
    #add_nft .modal{max-height: 318px;}
    #add_nft .modal-head{margin-bottom: 15px;}
    #add_nft .modal-body .nft-list .img{width: 56px; height: 56px;}
    #add_nft .modal-body .nft-list .txt div{font-size: 12px;}
    #add_nft .modal-body .nft-list .txt span{font-size: 10px;}
    #add_nft .modal-foot{margin-top: 20px;}

}



#playlist_nft{opacity: 1; visibility: visible;}
#playlist_nft.modal-wrap{background: transparent; height: 90%;}
#playlist_nft .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 100%; max-height: 618px;}
#playlist_nft .modal-head{margin-bottom: 29px;}
#playlist_nft .modal-head h5{ font-size: 18px;}
#playlist_nft .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#playlist_nft .modal-body .nft-list{display: flex; align-items: center; padding: 9px 0;}
#playlist_nft .modal-body .nft-list input[type="checkbox"]{display: none;}
#playlist_nft .modal-body .nft-list input[type="checkbox"] + label{display: none; margin-right: 25px; width: 24px; height: 24px; background-color: #fff; border-radius: 5px;}
#playlist_nft .modal-body .nft-list input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#playlist_nft .modal-body.on .nft-list input[type="checkbox"]{display: none;}
#playlist_nft .modal-body.on .nft-list input[type="checkbox"] + label{display: block; margin-right: 25px; width: 24px; height: 24px; background-color: #fff; border-radius: 5px;}
#playlist_nft .modal-body.on .nft-list input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#playlist_nft .modal-body .nft-list .img{position: relative;width: 86px;height: 86px;z-index: 1;}
#playlist_nft .modal-body .nft-list .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 12px;   text-align: center;   overflow: hidden;}
#playlist_nft .modal-body .nft-list .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#playlist_nft .modal-body .nft-list .txt{display: flex; flex-direction: column; color: #fff; padding: 0 15px; flex: 1;}
#playlist_nft .modal-body .nft-list .txt div{ font-size: 14px; font-weight: 500}
#playlist_nft .modal-body .nft-list .txt span{ color: #999; font-size: 12px;}
#playlist_nft .modal-body .none-nft {width: 100%; padding-top: 100px; margin-bottom: 0; margin-top: 0; color: #fff; text-align: center; }
#playlist_nft .modal-foot{}
#playlist_nft .modal-foot .btn-choice{width: 100%;max-width: calc(100% - 14px);background: transparent; border:1px solid #fff; margin: 0;}
#playlist_nft .modal-foot .btn-choice.on{background: #be3455; border: none;}
#playlist_nft .modal .icon-close{top: 40px; right: 40px;}

@media all and (max-width: 1000px){
    #playlist_nft .modal{max-height: 318px;}
    #playlist_nft .modal-head{margin-bottom: 15px;}
    #playlist_nft .modal-body .nft-list .img{width: 56px; height: 56px;}
    #playlist_nft .modal-body .nft-list .txt div{font-size: 12px;}
    #playlist_nft .modal-body .nft-list .txt span{font-size: 10px;}
    #playlist_nft .modal-foot{margin-top: 20px;}
}

#play-add.modal-wrap{background: transparent;}

#playlist_music{opacity: 1; visibility: visible;}
#playlist_music.modal-wrap{background: transparent; height: 90%;}
#playlist_music .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 100%; max-height: 618px;}
#playlist_music .modal-head{margin-bottom: 29px;}
#playlist_music .modal-head h5{ font-size: 18px;}
#playlist_music .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#playlist_music .modal-body .music-li{display: flex; gap: 12px; }
#playlist_music .modal-body .music-li + .music-li { margin-top: 10px; }
#playlist_music .modal-body .music-li input[type="checkbox"]{display: none;}
#playlist_music .modal-body .music-li input[type="checkbox"] + label{display: none; width: 24px; height: 24px; margin-top: 11px; background-color: #fff; border-radius: 5px;}
#playlist_music .modal-body .music-li input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#playlist_music .modal-body.on .music-li input[type="checkbox"] + label{display: block; }
#playlist_music .modal-body.on .music-li input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#playlist_music .modal-body .music-li .img{position: relative;width: 42px;height: 42px; margin-top: 3px; z-index: 1;}
#playlist_music .modal-body .music-li .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 5px;   text-align: center;   overflow: hidden;}
#playlist_music .modal-body .music-li .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#playlist_music .modal-body .music-li .txt{ width: calc(100% - 54px); display: flex; flex-direction: column; color: #fff; flex: 1; overflow: hidden; }
#playlist_music .modal-body .music-li .txt .m-tit { font-size: 15px; font-weight: 500; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#playlist_music .modal-body .music-li .txt .m-tit span.m-type { display: inline-block; width: 20px; height: 20px; margin-right: 5px; border-radius: 50%; background-color: #2b2b2b; text-align: center; vertical-align: text-bottom; }
#playlist_music .modal-body .music-li .txt .m-tit span.piki_bg { background-color: #be3455; }
#playlist_music .modal-body .music-li .txt .m-tit span.m-type img { padding: 3px; }
#playlist_music .modal-body .music-li .txt .m-time { font-size: 13px; color: #999; font-size: 12px; vertical-align: text-top; }
#playlist_music .modal-body .none-music { width: 100%; padding-top: 100px; margin-bottom: 0; margin-top: 0; color: #fff; text-align: center; }
#playlist_music .modal-foot { display: flex; justify-content: space-between; gap: 26px; }
#playlist_music .modal-foot .btn-choice { flex: 1 1 0; background: transparent; border:1px solid #fff; margin: 0;}
#playlist_music .modal-foot .btn-choice.on {max-width: calc(100% - 14px); background: #be3455; border: none;}
#playlist_music .modal .icon-close{top: 40px; right: 40px;}

@media all and (max-width: 1000px){
    #playlist_music .modal{max-height: 318px;}
    #playlist_music .modal-head{margin-bottom: 15px;}
    #playlist_music .modal-body .music-li .txt .m-tit { font-size: 14px; }
    #playlist_music .modal-body .music-li .txt .m-artist { font-size: 12px; }
}

#add_music{opacity: 1; visibility: visible;} /*flex로 바뀌어야됨*/
#add_music.modal-wrap{background: transparent;}
#add_music .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 90%; max-height: 618px;}
#add_music .modal-head{margin-bottom: 29px;}
#add_music .modal-head h5{ font-size: 18px;}
#add_music .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}

#add_music .modal-body input[type="checkbox"]{display: none;}
#add_music .modal-body input[type="checkbox"] + label { display: inline-block; width: 24px; height: 24px; border-radius: 5px; border: 1px solid #fff; }
#add_music .modal-body input[type="checkbox"]:checked + label{border: none; background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#add_music .modal-body.on input[type="checkbox"] + label{display: block; }
#add_music .modal-body.on input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#add_music .modal-body .chk-all { margin-bottom: 10px; }
#add_music .modal-body .chk-all span { color: #fff; margin-left: 10px; }
#add_music .modal-body .chk-wrap { display: flex; align-items: center; gap: 14px; margin-bottom: 23px; }
#add_music .modal-body .chk-type { display: flex; align-items: center; color: #fff; gap: 10px; margin-bottom: 23px; }
#add_music .modal-body .chk-type input[type="checkbox"] + label { margin-top: 0; }
#add_music .modal-body .chk-type.chk-piki span,
#add_music .modal-body .chk-type.chk-koong span { width: 24px; height: 24px; padding: 3px; border-radius: 50%; background-color: #2b2b2b; text-align: center; }

#add_music .modal-body .music-li{display: flex; align-items: center; gap: 12px;}
#add_music .modal-body .music-li + .music-li { margin-top: 10px; }
#add_music .modal-body .music-li .img{position: relative;width: 42px;height: 42px; margin-top: 3px;z-index: 1;}
#add_music .modal-body .music-li .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 5px;   text-align: center;   overflow: hidden;}
#add_music .modal-body .music-li .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#add_music .modal-body .music-li .txt{display: flex; flex-direction: column; color: #fff; flex: 1;}
#add_music .modal-body .music-li .txt .m-tit { font-size: 15px; font-weight: 500}
#add_music .modal-body .music-li .txt .m-tit span.m-type { display: inline-block; width: 20px; height: 20px; margin-right: 5px; border-radius: 50%; background-color: #2b2b2b; text-align: center; vertical-align: text-bottom; }
#add_music .modal-body .music-li .txt .m-tit span.m-type img { padding: 3px; }
#add_music .modal-body .music-li .txt .m-artist { font-size: 13px; }
#add_music .modal-body .music-li .txt .m-artist span { font-size: 13px; color: #999; font-size: 12px; vertical-align: text-top;}
#add_music .modal-body .music-li .txt .m-artist span::before { display: inline-block; content: "·"; margin: 0 6px; }
#add_music .modal-foot .btn-add { max-width: 100%; flex: 1 1 0; background: transparent; border:1px solid #fff; margin: 0; opacity: 0.5;  pointer-events: none; user-select : none; }
#add_music .modal-foot .btn-add.on { background: #be3455; border: none; opacity: 1; pointer-events: auto; user-select: auto;}
#add_music .modal-foot .modal-close{width: 100%;max-width: calc(100% - 14px);background: #be3455;margin: 0; }
#add_music .modal .icon-close{top: 40px; right: 40px;}

@media all and (max-width: 1000px){
    #add_music .modal{max-height: 318px;}
    #add_music .modal-head{margin-bottom: 15px;}
    #add_music .modal-body .chk-all { margin-bottom: 13px; }
    #add_music .modal-body .music-li .txt .m-tit { font-size: 14px; }
    #add_music .modal-body .music-li .txt .m-artist { font-size: 12px; }
    #add_music .modal-foot{margin-top: 20px;}
}

#sell_list.modal-wrap { background: transparent; }
#sell_list { opacity: 1; visibility: visible; }
#sell_list .modal { display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 530px; padding: 45px 40px; height: 90%; max-height: 880px; }
#sell_list .modal-head{margin-bottom: 30px;}
#sell_list .modal-head h5{ font-size: 22px;}
#sell_list .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#sell_list .modal-body input[type="checkbox"]{display: none;}
#sell_list .modal-body input[type="checkbox"] + label { display: inline-block; width: 24px; height: 24px; margin-top: 11px; border-radius: 5px; border: 1px solid #fff; }
#sell_list .modal-body input[type="checkbox"]:checked + label{border: none; background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#sell_list .modal-body.on input[type="checkbox"] + label{display: block; }
#sell_list .modal-body.on input[type="checkbox"]:checked + label{background: #be3455 url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#sell_list .modal-body .chk-all { display: flex; align-items: center; color: #fff; gap: 10px; margin-bottom: 23px; }
#sell_list .modal-body .chk-all input[type="checkbox"] + label { margin-top: 0; }
#sell_list .modal-body .pd-li {display: flex; align-items: center; gap: 18px;}
#sell_list .modal-body .pd-li + .pd-li { margin-top: 20px; }
#sell_list .modal-body .pd-li input[type="checkbox"] + label { margin-top: 0; }
#sell_list .modal-body .pd-li .img{position: relative;width: 70px; height: 70px; border-radius: 10px; background-color: #fff; overflow: hidden; z-index: 1; }
#sell_list .modal-body .pd-li .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 5px; text-align: center; overflow: hidden;}
#sell_list .modal-body .pd-li .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover; object-position: center center;}
#sell_list .modal-body .pd-li .txt{display: flex; flex-direction: column; color: #fff; flex: 1; overflow: hidden; }
#sell_list .modal-body .pd-li .txt .pd-name { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#sell_list .modal-body .pd-li .txt .pd-cost { font-size: 14px; }
#sell_list .modal-body .none-data { display: block; max-width: 100%; width: 100%; padding-top: 100px; margin-bottom: 0; margin-top: 0; text-align: center; color: #fff; }
#sell_list .modal-foot .modal-confirm { max-width: 100%; flex: 1 1 0; background: transparent; border:1px solid #fff; margin: 0; opacity: 0.5;  pointer-events: none; user-select : none; }
#sell_list .modal-foot .modal-confirm.on { background: #be3455; border: none; opacity: 1; pointer-events: auto; user-select: auto;}
#sell_list .modal-foot .modal-close { width: 100%; max-width: calc(100% - 14px);background: #be3455;margin: 0; }
#sell_list .modal .icon-close{top: 50px; left: initial; right: 40px; }

@media all and (max-width: 1000px){
    #sell_list .modal{max-height: 318px;}
    #sell_list .modal-head{margin-bottom: 15px;}
    #sell_list .modal-head h5{ font-size: 19px;}
    #sell_list .modal-body .chk-all { margin-bottom: 13px; }
    #sell_list .modal-body .pd-li { gap: 10px; }
    #sell_list .modal-body .pd-li .img{width: 55px; height: 55px; }
    #sell_list .modal-body .pd-li .txt .pd-name { font-size: 17px; font-weight: 500}
    #sell_list .modal-body .pd-li .txt .pd-cost { font-size: 13px; }
    #sell_list .modal-foot{margin-top: 20px;}
}

#product-view { opacity: 1; visibility: visible; }
#product-view .modal { display: flex; flex-direction: column; width: 90%; max-width: 340px; padding: 25px 15px; max-height: 90%; }
#product-view .modal-head{margin-bottom: 10px; }
#product-view .modal-head h5{ font-size: 24px; text-align: center; color: #000;}
#product-view .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#product-view .modal-body .pd-overview .img{position: relative;width: auto; height: 220px; border-radius: 10px; z-index: 1; }
#product-view .modal-body .pd-overview .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 5px; text-align: center; overflow: hidden;}
#product-view .modal-body .pd-overview .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: contain; object-position: center center;}
#product-view .modal-body .pd-overview ul { margin:10px; color: #1e1e1e; }
#product-view .modal-body .pd-overview .pd-desp { /*max-height: 45px; overflow-y: auto;*/ margin:10px 10px 18px; color: #1e1e1e; }
#product-view .modal-body .pd-overview .pd-cost { padding: 10px 10px 0; border-top: 1px solid #e6e6e6; font-size: 32px; font-weight: bold; text-align: right; }
#product-view .modal-body .pd-overview .pd-cost span { font-size: 15px; font-weight: 400; vertical-align: baseline; }
#product-view .modal-foot { margin-top: 30px; }
#product-view .modal-foot .modal-confirm { background: #be3455; border: none; opacity: 1; border-radius: 15px; pointer-events: auto; user-select: auto;}
#product-view .modal-foot .modal-confirm.on { background: #be3455; border: none; opacity: 1; pointer-events: auto; user-select: auto;}
#product-view .modal-foot .modal-close { max-width: 100%; flex: 1 1 0; background: transparent; margin: 0; opacity: 0.5; background: #b4b4b4; border-radius: 15px; color:#fff; }



@media all and (max-width: 1000px){
    #product-view .modal { max-height: 90%; }
    #product-view .modal-head h5{ font-size: 18px; }
    #product-view .modal-body .pd-overview .img{ height: 120px; }
    #product-view .modal-body .pd-overview ul { font-size: 13px; }
    #product-view .modal-body .pd-overview .pd-desp { max-height: 100%; margin:0 10px 10px; font-size: 13px; line-height: 140%; }
    #product-view .modal-body .pd-overview .pd-cost { padding: 10px 10px 0; font-size: 22px; }
    #product-view .modal-foot { margin-top: 20px; }

}


#product-soldOut { opacity: 1; visibility: visible; }
#product-soldOut .modal { display: flex; flex-direction: column; width: 90%; max-width: 340px; padding: 25px 15px; max-height: 462px; }
#product-soldOut .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#product-soldOut .modal-body .pd-overview { position: relative; }
#product-soldOut .modal-body .pd-overview .img{position: relative;width: auto; height: 220px; border-radius: 10px; z-index: 1; }
#product-soldOut .modal-body .pd-overview .img.sold-out{ position: absolute; width: 77%; height: auto; top: 18%; left: 50%; transform: translateX(-50%); z-index: 100; }
#product-soldOut .modal-body .pd-overview .img span {width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 5px; text-align: center; overflow: hidden;}
#product-soldOut .modal-body .pd-overview .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: contain; object-position: center center;}
#product-soldOut .modal-body .pd-overview .txt { text-align: center; }
#product-soldOut .modal-body .pd-overview .txt strong { display: block; margin: 10px; font-size: 27px;  }
#product-soldOut .modal-foot { margin-top: 30px; }
#product-soldOut .modal-foot .modal-close { max-width: 100%; flex: 1 1 0; background: transparent; margin: 0; opacity: 0.5; background: #b4b4b4; border-radius: 15px; color:#fff; }

@media all and (max-width: 1000px){
    #product-soldOut .modal { max-height: 90%; }
    #product-soldOut .modal-head h5{ font-size: 18px; }
    #product-soldOut .modal-body .pd-overview .img{ height: 120px; }
    #product-soldOut .modal-body .pd-overview .img.sold-out{ width: 50%; top: 15%; }
    #product-soldOut .modal-body .pd-overview .txt strong { display: block; margin: 10px; font-size: 22px;  }
    #product-view .modal-foot { margin-top: 20px; }

}






/*#specific{opacity: 1; visibility: visible; }*/
/*#specific .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 86%; max-height: 618px;}*/
/*#specific .modal-head{margin-bottom: 29px;}*/
/*#specific .line-box{margin-bottom: 14px;}*/
/*#specific .modal-head h5{ font-size: 18px;}*/
/*#specific .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}*/
/*#specific .modal-body .nft-list{display: flex; align-items: center; padding: 9px 0;}*/
/*#specific .modal-body .user-list-cnt{color:#fff; display: flex;align-items: center; font-size: 14px; margin-bottom: 14px; width:100%; padding-right: 19px; cursor:pointer;}*/
/*#specific .modal-body .user-list-cnt input[type="checkbox"]{display: none;}*/
/*#specific .modal-body .user-list-cnt input[type="checkbox"] + label{display: inline-block; margin-right: 13px; width: 18px; height: 18px;  border: solid 1px #707070;background: rgba(0, 0, 0, 0.65);}*/
/*#specific .modal-body .user-list-cnt input[type="checkbox"]:checked + label{background: url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}*/
/*#specific .modal-body .user-list-cnt .img{position: relative;width: 40px;height: 40px;min-width: 40px; z-index: 1; margin: 0; }*/
/*#specific .modal-body .user-list-cnt .img span{width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 12px;   text-align: center;   overflow: hidden;}*/
/*#specific .modal-body .user-list-cnt .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}*/
/*#specific .modal-body .user-list-cnt .txt{display: flex; flex-direction: column; margin: 0; margin-left: 8px; font-size: 14px;width: 100%; text-align: left;}*/
/*#specific .modal-body .user-list-cnt .txt > a{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}*/
/*#specific .modal-foot{margin-top: 0;}*/
/*#specific .modal-foot button{border: 1px solid #fff; max-width: calc(100% - 14px);}*/

#myroom{opacity: 1; visibility: visible;}
#myroom .modal{display: flex; flex-direction: column; background: rgba(0, 0, 0, 0.85); width: 90%; max-width: 490px; padding: 35px 26px 35px 40px; height: 86%; max-height: 618px;}
#myroom .modal-head{margin-bottom: 29px;}
#myroom .line-box{margin-bottom: 14px;}
#myroom .modal-head h5{ font-size: 18px;}
#myroom .modal-body{ text-align: left; overflow-y: auto; height: calc(100% - 100px); padding-top: 0;}
#myroom .modal-body .nft-list{display: flex; align-items: center; padding: 9px 0;}
#myroom .modal-body .user-list-cnt{color:#fff; display: flex;align-items: center; font-size: 14px; margin-bottom: 14px; width:100%; padding-right: 19px; cursor:pointer;}
#myroom .modal-body .user-list-cnt input[type="checkbox"]{display: none;}
#myroom .modal-body .user-list-cnt input[type="checkbox"] + label{display: inline-block; margin-right: 13px; width: 18px; height: 18px;  border: solid 1px #707070;background: rgba(0, 0, 0, 0.65);}
#myroom .modal-body .user-list-cnt input[type="checkbox"]:checked + label{background: url(../../assets/images/metaroom/checkbox_check.svg) no-repeat center;}
#myroom .modal-body .user-list-cnt .img{position: relative;width: 40px;height: 40px;min-width: 40px; z-index: 1; margin: 0; }
#myroom .modal-body .user-list-cnt .img span{width: 100%;height: 100%;display: inline-block;border: none;   border-radius: 12px;   text-align: center;   overflow: hidden;}
#myroom .modal-body .user-list-cnt .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center;}
#myroom .modal-body .user-list-cnt .txt{display: flex; flex-direction: column; margin: 0; margin-left: 8px; font-size: 14px;width: 100%; text-align: left;}
#myroom .modal-body .user-list-cnt .txt > a{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
#myroom .modal-foot{margin-top: 0;}
#myroom .modal-foot button{border: 1px solid #fff; max-width: calc(100% - 14px);}

#specific .modal-foot button.on,
#myroom .modal-foot button.on{background: #be3455; border: 0;}

/* profile history */
#profile-history {opacity: 1; visibility: visible; background:rgba(0, 0, 0, 0.9);}
#profile-history .modal {display: flex; flex-direction: column; background: none; width: 100%; max-width: 100%; height: 100%; max-height: 100%; border-radius: 0; padding: 40px; box-shadow: none; }
#profile-history .modal-body { flex: 1 1 0; max-height: calc(100% - 75px); padding: 0; }
#profile-history .modal-body .swiper { width: 100%; height: 100%; }
#profile-history .modal-body .swiper-wrapper { align-items: center; }
#profile-history .modal-body .swiper-slide { height: initial; }
#profile-history .modal-body ul li {}
#profile-history .modal-body ul li img { max-width: calc(90vw - 170px); max-height: 85vh; }
#profile-history .modal-body .profile-more {  }
#profile-history .modal-body .profile-more .swiper-button-prev,
#profile-history .modal-body .profile-more .swiper-button-next { width: 40px; height: 75px; }
#profile-history .modal-body .profile-more .swiper-button-prev:after,
#profile-history .modal-body .profile-more .swiper-button-next:after { width: 100%; height: 100%; text-indent: -99999px; }
#profile-history .modal-body .profile-more .swiper-button-prev:after { background: url('../../assets/images/metaroom/icon_arr_next.svg') no-repeat center center; background-size: contain;  transform: rotate(-180deg); }
#profile-history .modal-body .profile-more .swiper-button-next:after { background: url('../../assets/images/metaroom/icon_arr_next.svg') no-repeat center center; background-size: contain;  }
#profile-history .modal-foot { margin-top: 25px; }
#profile-history .modal-foot .img-count { font-size: 24px; color:#767676; pointer-events: none;  }
#profile-history .modal-foot .img-count span { color: #fff; }
#profile-history .modal-foot .btn-group { display: flex; align-items: center; gap: 30px; }
#profile-history .modal-foot .btn-group button { max-width: 40px; height: 35px; line-height: 35px;  }
#profile-history .modal-foot .btn-group button img { width: 100%; vertical-align: middle; }
#profile-del-confirm .modal-foot button { width: 100%; max-width: 100%; background-color: #be3455; }


@media all and (max-width: 1000px){
#profile-history .modal { padding: 3.5%; }
#profile-history .modal-body { max-height: calc(100% - 45px); }
#profile-history .modal-body ul li img { max-width: calc(90vw - 100px); }
#profile-history .modal-foot .btn-group button { max-width: 20px; height: 22px; line-height: 22px; }
#profile-history .modal-body .profile-more .swiper-button-prev,
#profile-history .modal-body .profile-more .swiper-button-next { top: 45%; width: 25px; height: 50px; }
#profile-history .modal-body .profile-more .swiper-button-prev { left: 0; }
#profile-history .modal-body .profile-more .swiper-button-next { right: 0; }
#profile-history .modal-foot { margin-top: 15px; }
#profile-history .modal-foot .img-count { font-size: 17px; }
}
    /*
        #guest-memo .memo-box { width: 100%; max-width: 100%; height: 100%; max-height: 100%; }
        #guest-memo .memo-box .memo-area { width: 100%; max-width: 100%; }
        #guest-memo .memo-box > div { justify-content: flex-start; }
        #guest-memo .memo-box > .color-box { position: absolute; top: 32px; left: 90px; flex-direction: row; gap: 10px; width: auto; max-width: initial; padding-bottom: 0; z-index: 1; }
        #guest-memo .memo-box .color-box span { width: 25px; height: 25px; margin: 0; border: 1px solid rgba(0, 0, 0, 0.2); }
        #guest-memo .memo-box .memo-limit { position: absolute; bottom: 15px; right: 20px; flex: 0 0 auto; }
        #guest-memo #memo_content { font-size: 20px; }
        #guest-memo .modal { max-width: 100%; max-height: 100%; padding: 100px 80px 10px; }
        #guest-memo .modal-foot { align-items: center; position: absolute; width: 210px; top: 20px; right: 20px; margin: 0; font-size: 14px; }
        #guest-memo .modal-foot .gst-private { flex: 0 0 auto; color: #000; }
        #guest-memo .modal-foot .gst-private input[type="checkbox"] + label { border: 1px solid rgba(0, 0, 0, 0.2); }
        #guest-memo .modal-foot button { flex: 0 0 auto; align-items: center; max-width: 120px; height: 50px; line-height: 48px; }
        #guest-memo .modal-close { top: 20px; left: 20px; width: 52px; height: 52px; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 50%; background: #fff url(../../assets/images/metaroom/icon_prev_m.svg) no-repeat center center; background-size: 20px; }*/









#guest-memo{opacity: 1; visibility: visible; /*flex-direction: column;*/ background:rgba(0, 0, 0, 0.8); }
#guest-memo .modal{display: flex;flex-direction: column;background: #fff9c9;width: 100%;max-width: 630px;padding: 58px 58px 34px;height: 100%;max-height: 630px;border-radius: 0;box-shadow: none;font-size: 24px;color: #000;margin-left: auto; resize: none;}
#guest-memo #memo_content::placeholder{color: #000;}
#guest-memo .memo-box{width: 90%;max-width: 710px;height: 90%;max-height: 730px;/*min-height: 300px;*/ display: flex;}
#guest-memo .memo-box .memo-area{width: 90%; max-width: 630px; justify-content: center}
#guest-memo .memo-box .memo-limit{text-align: right; color: #000; font-size: 14px;}
#guest-memo #memo_content {padding: 0; resize: none; width: 100%; height: 100%; background-color: #fff9c9; }
#guest-memo #memo_content::placeholder { color: #767676; }
#guest-memo .memo-box > div {position: relative; display: flex; flex-direction: column; justify-content: flex-end;}
#guest-memo .memo-box > .color-box {padding-bottom: calc(60px + 5%); margin-right: 5%; width: 10%; max-width: 42px;}
#guest-memo .memo-box .color-box span { display: inline-block; width: 42px; height: 42px; border-radius: 50%; margin: 10px 0;}
#guest-memo .memo-box .color-box span:nth-child(1){background: #fff;}
#guest-memo .memo-box .color-box span:nth-child(2){background: #fff9c9;}
#guest-memo .memo-box .color-box span:nth-child(3){background: #deeda1;}
#guest-memo .memo-box .color-box span:nth-child(4){background: #bde0f0;}
#guest-memo .memo-box .color-box span:last-child{margin-bottom: 0;background: #ebd6de;}
#guest-memo .modal-foot{display: flex;justify-content: space-between;align-items: flex-start;width: 100%;max-width: 630px;margin-top: 5%;font-size: 20px; resize: none; }
#guest-memo .modal-foot .gst-option{display: flex; flex: 0 0 auto; align-items: center; color: #fff;}
#guest-memo .modal-foot .gst-option input[type="checkbox"]{display: none;}
#guest-memo .modal-foot .gst-option input[type="checkbox"] + label{display: block; margin-right: 12px; width: 24px; height: 24px; background-color: #fff;}
/* label 로 display 왔다갔다 해야됨 */
#guest-memo .modal-foot .gst-option input[type="checkbox"]:checked + label{background: #fff url(../../assets/images/metaroom/icon_check_viva.svg) no-repeat center;}
#guest-memo .modal-foot .gst-user {}
#guest-memo .modal-foot .gst-user .img{position: relative;width: 60px;height: 60px;min-width: 60px;z-index: 1;margin-right: 10px;}
#guest-memo .modal-foot .gst-user .img span{width: 100%;height: 100%;display: inline-block;border: none;border-radius: 12px;text-align: center;overflow: hidden;}
#guest-memo .modal-foot .gst-user .img span img{margin: 0 auto;display: inline-block;width: 100%;height: 100%;object-fit: cover;object-position: center center; border-radius: 50%;}
#guest-memo .modal-foot button {width: 100%; max-width: 200px; border-radius: 30px; border: solid 1px rgba(0,0,0,0.2); background: #fff; color: #000; height: 60px; line-height: 58px;}
#guest-memo .modal-close{position: absolute; right: 5%; top: 10%; width: 42px; height: 42px; background: url(../../assets/images/metaroom/icon_popup_close.svg) no-repeat center;text-indent: -9999px;cursor: pointer; background-size: 100%; display: block;}
#count{color: #999;}
@media all and (max-width: 1000px){

    #guest-memo .memo-box { width: 100%; max-width: 100%; height: 100%; max-height: 100%; }
    #guest-memo .memo-box .memo-area { width: 100%; max-width: 100%; }
    #guest-memo .memo-box > div { justify-content: flex-start; }
    #guest-memo .memo-box > .color-box { position: absolute; top: 32px; left: 90px; flex-direction: row; gap: 10px; width: auto; max-width: initial; padding-bottom: 0; z-index: 1; }
    #guest-memo .memo-box .color-box span { width: 25px; height: 25px; margin: 0; border: 1px solid rgba(0, 0, 0, 0.2); }
    #guest-memo .memo-box .memo-limit { position: absolute; bottom: 15px; right: 20px; flex: 0 0 auto; }
    #guest-memo #memo_content { font-size: 20px; }
    #guest-memo .modal { max-width: 100%; max-height: 100%; padding: 100px 80px 10px; }
    #guest-memo .modal-foot { align-items: center; position: absolute; width: auto; top: 20px; right: 20px; margin: 0; font-size: 14px; color:#000; }
    #guest-memo .modal-foot .gst-option { flex: 0 0 auto; color: #000; }
    #guest-memo .modal-foot .gst-option input[type="checkbox"] + label { border: 1px solid rgba(0, 0, 0, 0.2); }
    #guest-memo .modal-foot button { flex: 0 0 auto; align-items: center; width: initial; max-width: initial; height: initial; line-height: initial; padding: 14px 25px; }
    #guest-memo .modal-foot .gst-user .img{width: 50px;height: 50px;min-width: 50px;}
    #guest-memo .modal-close { top: 20px; left: 20px; width: 52px; height: 52px; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 50%; background: #fff url(../../assets/images/metaroom/icon_prev_m.svg) no-repeat center center; background-size: 20px; }
/*

    #guest-memo #memo_content{padding-right: 10px;}
    #guest-memo .modal{display: flex;flex-direction: column;background: #fff9c9;width: 100%;max-width: 250px;padding: 18px 8px 10px 18px;height: 100%;max-height: 224px;border-radius: 0;box-shadow: none;font-size: 14px;color: #000;margin-left: auto;}
    #guest-memo .memo-box{justify-content: center;}
    #guest-memo .memo-box .memo-area{max-width: 250px;}
    #guest-memo .modal-foot button{max-width: 164px; height: 40px; line-height: 38px; font-size: 14px;}
    #guest-memo .modal-foot .gst-private{font-size: 14px;}
    #guest-memo .modal-foot .gst-private input[type="checkbox"] + label{width: 16px; height: 16px;}
    #guest-memo .memo-box > div{justify-content: center;}
    #guest-memo .memo-box > .color-box{margin-right:15px; max-width: 24px; height: 66%; padding-bottom: 0; justify-content: center;}
    #guest-memo .memo-box .color-box span{max-width: 24px;margin:5px 0;}
    #guest-memo .memo-box .color-box span:nth-child(1){margin-top: 0;}
    #guest-memo .memo-box .memo-limit{color: #000; padding-right: 10px;}
    #guest-memo .modal-close{width: 20px; height: 20px;}
*/
}

#guest-memo- .modal{display: flex;flex-direction: column;background: #fff9c9;width: 100%;max-width: 630px;padding: 58px 20px 34px 58px;height: 100%;max-height: 630px;border-radius: 0;box-shadow: none;font-size: 24px;color: #000;margin-left: auto; resize: none;}

/* 모바일 일때 나오는 메모장*/
/*#m-guest-memo{opacity: 1; visibility: visible; flex-direction: column; background:#fff9c9; padding: 20px;}*/
/*#m-guest-memo .modal-head{width: 100%; height: 100%;}*/
/*#m-guest-memo .modal-head .modal-top{display: flex; align-items: center;}*/

/*#m-guest-memo .modal-head .modal-close{*/
/*    position: relative; right: 0; top: 0; display: inline-block; width: 48px; height: 48px; border: 1px solid rgba(0,0,0,0.2); background: #fff url(../../assets/images/metaroom/icon_prev_m.svg) no-repeat center center; background-size: 60%; border-radius: 50%; margin-right: 22px; text-indent: -9999px;}*/
/*#m-guest-memo .modal-head .modal-close:before{display: none}*/

/*#m-guest-memo .modal-top .color-list{display: flex; margin-left: auto;}*/
/*#m-guest-memo .modal-top .color-list span {width: 100%;max-width: 24px;min-width: 24px;height: 24px;border-radius: 50%;margin: 0 10px; border: 1px solid rgba(0, 0, 0, 0.2);}*/
/*#m-guest-memo .modal-top .color-list span:nth-child(1){background: #fff;}*/
/*#m-guest-memo .modal-top .color-list span:nth-child(2){background: #fff9c9;}*/
/*#m-guest-memo .modal-top .color-list span:nth-child(3){background: #deeda1;}*/
/*#m-guest-memo .modal-top .color-list span:nth-child(4){background: #bde0f0;}*/
/*#m-guest-memo .modal-top .color-list span:last-child{margin-right: 0;background: #ebd6de;}*/

/*#m-guest-memo .modal-head .modal-top button{border: solid 1px rgba(0, 0, 0, 0.2);background-color: #fff;width: 100%;max-width: 124px;height: 100%;max-height: 48px;line-height: 46px;border-radius: 24px;margin-left: 24px;}*/

/*#m-guest-memo .modal{background: #fff9c9;width: 100%;max-width: 630px;padding: 35px 35px 35px 40px;height: 100%;max-height: 630px;border-radius: 0;box-shadow: none;color: #000; font-size: 18px}*/
/*#m-guest-memo .modal::placeholder{color: #000; font-size: 18px;}*/





#television::-webkit-media-controls {
display: none !important;
}

#television::-webkit-media-controls-enclosure {
display: none !important;
}

#television::-webkit-media-controls-panel {
display: none !important;
}

#television::-webkit-media-controls-time-remaining-display,
#television::-webkit-media-controls-fullscreen-button {
  display: none !important;
}