@import "https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css";
@import "https://fonts.googleapis.com/css?family=Raleway:400,100,200,300,600,700,800,900,500";
@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab+Highlight:wght@700&display=swap');

.not_scroll{
    position: fixed;
    overflow: hidden;
    width: 100%;
    height: 100%
}

.not_scroll .cont {
    position: relative;
    top: 0;
}

.top_bar {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    height: 53px;
    border-bottom: 1px solid #e5e5e5;
    display: table;
    clear: both;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 224;
}

.logo {
    display: block;
}

.logo_menu_m {
    display: none;
}

.logo_m {
    /*display: inline-block !important;*/
    display: none;
    width: 25px;
    margin-top: 13px;
    margin-left: 50px;
    position: absolute;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

/* To Navigation Style */
.codrops-top {
    background: #566472;
    background: rgba(255, 255, 255, 0.2);
    text-transform: uppercase;
    width: 100%;
    font-size: 0.69em;
    line-height: 2.2;
}

.codrops-top a {
    padding: 0 1em;
    letter-spacing: 0.1em;
    color: #fff;
    display: inline-block;
}

.codrops-top a:hover {
    background: rgba(255, 255, 255, 0.8);
    color: #2c3e50;
}

.codrops-top span.right {
    float: right;
}

.codrops-top span.right a {
    float: left;
    display: block;
}

.codrops-icon:before {
    font-family: 'codropsicons';
    margin: 0 4px;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
    content: "\e001";
}

.codrops-icon-prev:before {
    content: "\e004";
}

.rankingrelay1 {
    display: inline-table;
    border: 1px solid #e5b0ca;
    text-align: center;
    font-size: 14px;
    border-radius: 8px;
    background-color: #ffffff;
    color: #e979b8;
    padding: 0px 10px;
    margin: 10px 0px 0px 0px;
}

.rankingrelay3 {
    display: inline-table;
    border: 1px solid #edd193;
    text-align: center;
    font-size: 14px;
    border-radius: 8px;
    background-color: #ffffff;
    color: #e7a200;
    padding: 0px 10px;
    margin: 10px 0px 0px 0px;
}

.rankingrelay10 {
    display: inline-table;
    border: 1px solid #efefef;
    text-align: center;
    font-size: 14px;
    border-radius: 8px;
    background-color: #ffffff;
    color: #7b7b7b;
    padding: 0px 10px;
    margin: 10px 0px 0px 0px;
}

@media screen and (max-width: 46.0625em) {
    .column {
        width: 100%;
        min-width: auto;
        min-height: auto;
        padding: 1em;
    }

    .column p {
        text-align: left;
        font-size: 1.5em;
    }

    .column:nth-child(2) {
        box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
    }
}

@media screen and (max-width: 25em) {

    .codrops-icon span {
        display: none;
    }

}

.eks-tabs {
    width:100%;
    display:inline-block;
}

.eks-tabs__input{
    display: none;
}

.eks-tabs__labels{
    position: relative;
    max-width:600px;
    width:100%;
    margin:20px auto;
    display:flex;
}

.eks-tabs__labels_m{
    display:none;
}

.eks-tabs__label{
    height: 55px;
    line-height: 55px;
    position: relative;
    font-size: 15px;
    margin: 0;
    text-align: center;
    color: #bbb;
    background: #f7f7f7;
    width:33.3%;
    border:1px solid #ddd;
    overflow:hidden;
}

.eks-tabs__label:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.eks-tabs__label:nth-child(2) {
    /*border-right:none;*/
}

.eks-tabs__label:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.eks-tabs__label-inner{
    pointer-events: none;
}

.eks-tabs__label:hover {
    color: #e877ae;
    background:#fff;
    cursor: pointer;
}

.eks-tabs__content {
    display: none;
    background: #fff;
    overflow: hidden;
}

[id^=eks-tab-1]:checked  ~ .eks-tabs__labels .eks-tabs__label[for*=eks-tab-1],
[id^=eks-tab-2]:checked  ~ .eks-tabs__labels .eks-tabs__label[for*=eks-tab-2],
[id^=eks-tab-3]:checked  ~ .eks-tabs__labels .eks-tabs__label[for*=eks-tab-3],
[id^=eks-tab-4]:checked  ~ .eks-tabs__labels .eks-tabs__label[for*=eks-tab-4]{
    color: #e877ae;
    background: #fff;
}

[id^=eks-tab-1]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-1],
[id^=eks-tab-2]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-2],
[id^=eks-tab-3]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-3],
[id^=eks-tab-4]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-4]{
    display: block;
}

.my_menu {
    position: absolute;
    top: 50px;
    right: 25px;
    width: 250px;
    border: 1px solid #ddd;
    border-radius: 15px;
    background-color: #fff;
    display: none;
    overflow:hidden;
}

.my_menu_list {
    cursor: pointer;
    float: static;
    font-size: 13px;
    padding: 7px 15px;
    cursor: pointer;
}

.my_menu_list a {
    font-size: 13px;
}

.my_menu_list span.icon {
    width:20px;
    display:inline-block;
}

.notice_new_icon {
}

.notice_new_icon img {
    width:13px;
    margin-left:3px;
    vertical-align:middle;
}

.alarm_new {
    color:red;
    font-size:13px;
}

.alarm_new2 {
    color:#a80000;
    font-size:13px;
}

.my_menu_list:hover {
    background: #f9f9f9;
    text-decoration: underline;
    overflow:hidden;
}

.my_menu_list:last-child:hover {
    text-decoration: underline;
    background: #ebebeb;
}

.my_menu_list img {
    margin-bottom: 3px;
}

.bc-ebebeb {
    background:#ebebeb;
}

.menu_cnt {
    cursor: pointer;
}

.menu_cnt:hover {
    text-decoration: underline;
}

.top_menu {
    margin-left: 212px;
}

.my_menu_btn {
    border: 1px solid #aaa;
    background-color: #fff;
    border-radius: 5px;
    font-size: 13px;
}

.top_menu > li {
}

.top_bar > ul.top_menu > li.login_top_menu {
    float: right;
    line-height: 45px;
    height: 40px;
    vertical-align: top;
    position: relative;
    padding: 2px 0px;
}

.top_bar .top_btn {
    padding: 0 20px;
}

.top_bar ul li:nth-child(2).login_top_menu2 {
    position: relative;
}

.top_bar ul li:nth-child(3).login_top_menu3 {
    position: relative;
    float: right;
    line-height: 50px;
    height: 40px;
    vertical-align: top;
    padding-right: 0px;
    cursor: pointer;
}

.bell_icon {
    margin-bottom: 5px;
}

.pic_wrap {
    float:left;
    position:relative;
    display:inline-block;
    margin:0 5px;
}

.pic_wrap > div.top_user_img {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    border: 1px solid #ddd;
    overflow: hidden;
    float: left;
    margin-right: 5px;
}

.pic_wrap img {
    width:100%;
    vertical-align:baseline;
}

.featured_img {
    float:left;
    width:280px;
    margin-right:15px;
    border-radius:10px;
    overflow:hidden;
    display:inline-block;
}

.nickname {
    float: right;
    margin-right: 30px;
    margin-left: 10px;
}

.nickname:hover {
    cursor:pointer;
}

.search_bar {
    margin-top: -7px;
    width: 280px;
    text-indent: 10px;
    background-color: #fafafa !important;
    border: 3px solid transparent !important;
    background: -webkit-linear-gradient(white, white), -webkit-linear-gradient(right, #e777af 0%, #7e73f2 100%) !important;
    background: -o-linear-gradient(white, white), -o-linear-gradient(right, #e777af 0%, #7e73f2 100%) !important;
    /*background: linear-gradient(white, white), linear-gradient(to left, #e777af 0%, #7e73f2 100%) !important;*/
    background: linear-gradient(#fbfbfb, #fbfbfb), linear-gradient(to left, #e5e5e5 0%, #e5e5e5 100%) !important;
    -webkit-background-clip: padding-box, border-box !important;
    -moz-background-clip: padding-box, border-box !important;
    background-clip: padding-box, border-box !important;
    -webkit-background-origin: border-box !important;
    background-origin: border-box !important;
    -webkit-background-size: 100% 100% !important;
    background-size: 100% 100% !important;
    border-radius: 20px !important;
}

.search_block {
    float: left;
    margin-left: 25px;
    margin-top: 14px;
}

.search_btn {
    cursor: pointer;
    position: absolute;
    top: -2px;
    right: 10px;
    width: 26px;
}

.top_bar ul .top_menu_li {
    float: left;
    margin-top: 0px;
}

.search_wrap {
    position: relative;
}

.main_con {
    width: calc(100% - 280px);
    margin-top: 46px;
    margin-left: 280px;
    /*background: #eff1f6;*/
    height:calc(100% - 76px);
}

.wrap_con {
    width: calc(100% - 280px);
    margin-top: 76px;
    margin-left: 280px;
    height:calc(100% - 75px);
    display:inline-block;
}

.left_top li {
    padding:10px 10px;
    text-align: center;
    width:100%;
}

.left_menu {
    width: 240px;
    position: fixed;
    top: 53px;
    left: 0;
    border-right: 1px solid #e5e5e5;
    height: 100%;
    font-size: 15px;
    z-index: 3;
    overflow-y: auto;
    background: #f5f5f5;
    padding-bottom: 50px;
    -ms-overflow-style: none;
}

.left_menu::-webkit-scrollbar {
    display: none;
}

.left_menu ul {
    padding: 15px 0;
    border-bottom: 1px solid #e5e5e5;
}

.left_menu ul li {
    width: 100%;
    position: relative;
    font-size:15px;
}

.left_menu ul li div.left_menu_li {
    display:flow-root;
    padding: 10px 25px;
    color: #242424;
    font-weight: 300;
}

.left_menu ul li div.left_menu_li:hover {
    background:#fcfcfc;
    color:#e877ae;
}

.left_menu ul li div.left_menu_li.left_on {
    background:#e5e5e5;
    color:#000000;
    font-weight: 400;
}

.left_menu ul li div.left_menu_li > span.icon img {
    margin: 0 10px 5px 0;
    width:22px;
    image-rendering:-webkit-optimize-contrast;
}

.left_menu ul li button.inlive_btn span img {
    margin: 0 10px 5px 0;
    width:22px;
    image-rendering:-webkit-optimize-contrast;
}

.left_menu ul li span.icon {
    width:30px;
    display:inline-block;
}

.left_menu ul li img.left_in {
    margin: 0;
}

.left_menu .button_box {
    border: 0;
    padding: 30px 0;
    box-sizing: border-box;
}

.left_menu .button_box button {
    width: 190px;
    border: 1px solid #ddd;
    color: #555;
    font-size: 12px;
    text-align: left;
    border-radius: 5px;
    font-weight: 600;
    line-height: 50px;
    text-indent: 15px;
}

.left_menu .button_box button:hover {
    background: #f9f9f9;
}

.left_menu .button_box button span {
    float: right;
}

.left_menu .button_box .inlive_btn2 {
    border: 1px solid #aaa;
    background-color: #f2f4f7;
    color: #565656;
    box-sizing: border-box;
}

.left_menu ul li a:hover {
    text-decoration:none;
}

.app_down_qr {
    width:230px;
}

.app_down_qr > span {
    border:1px solid #ddd;
    background-color: #ffffff;
    border-radius:5px;
    padding:10px 25px;
    width:100%;
    display:inline-block;
    font-size:14px;
    color:#555;
    font-weight:600;
    text-align:center;
}

.app_down_qr > span > img {
    width:100px;
}

.card-columns {
    display: inline-block;
    width: 100%;
}

.card-columns2 {
    display: inline-block;
    width: 100%;
}

.btn_broad {
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    font-size: 15px;
    color: #ffffff;
    width: 100%;
    height: 40px;
    border-color: #ffffff;
    border-width: 0px;
    border-style: solid;
}

.member_icon {
    width:16px;
}

.btn_broad_st1 {
    /*background-image: linear-gradient(to right, #7e73f2 0%, #e776ae 70%) !important;*/
    background-color: #e877ae;
}

.btn_change {
    border: 1px solid #999;
    color: #333;
    padding: 5px 15px;
    background: none;
    border-radius:5px;
    line-height:initial;
}

.class_table {
    width: 100%;
    border-top: 2px solid #666;
}

.class_table th {
    background: #f9f9f9;
    line-height: 50px;
    border-bottom: 1px solid #ddd;
    text-align: center;
}

.class_table td {
    line-height: 50px;
    border-bottom: 1px solid #ddd;
    text-indent: 15px;
}

.class_table td.class_id {
    font-weight: 500;
}

.broad_box_tier_effect_m80 {
    border: 1px solid #fffef6;/*#c2bbed*/
    background-color: #fffef6;
    box-shadow: 0px 0px 8px 0px #9aa0ff;
}

.broad_box_tier_effect_f80 {
    border: 1px solid #fffef6;/*#ffc9c9*/
    background-color: #fffef6;
    box-shadow: 0px 0px 8px 0px #ff9aa2;
}

.broad_box_tier_effect_50 {
    border: 1px solid #ffe1c4;
    background-color: #fffbf6;
}

.broad_box_tier_effect_normal {
    border: 1px solid #ffffff;
    background-color: #ffffff;
}

.broad_box {
    /*background: #fff;*/
    padding: 20px 12px;
    margin: 0.5% 0.5% 1.5% 0.5%;/*margin:0.5%;*/
    width:15.5%;/*width:19%;*/
    float:left;
    border-radius:10px;
}

.content {
    max-width: 1560px;
    padding: 20px 20px;
    margin: 0 auto;
    width:100%;
    border-bottom: 1px solid #e5e5e5;
}

.content2 {
    /*max-width: 1000px;*/
    max-width: 800px;
    margin: 0 auto;
    width:100%;
}

.content3 {
    max-width: 1260px;
    padding: 50px 30px;
    margin: 0 auto;
    width:100%;
}

.toggleSwitch {
    width: 60px;
    height: 30px;
    display: block;
    position: relative;
    border-radius: 30px;
    background-color: #ebebeb;
    /*box-shadow: 0 0 16px 3px rgba(0 0 0 / 15%);*/
    cursor: pointer;
    /*margin: 30px;*/
}
.toggleSwitch .toggleButton {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #e877ae;
}
#f_allow_img:checked ~ .toggleSwitch {
    background: #e877ae;
}
#f_allow_img:checked ~ .toggleSwitch .toggleButton {
    left: calc(100% - 24px);
    background: #fff;
}
.toggleSwitch, .toggleButton {
    transition: all 0.2s ease-in;
}

.whisperbordereffect {
    border: 1px solid #cf5f95;
    box-shadow: rgb(85, 85, 85) 0px 0px 5px;
}

.respmsgoptbox {
    padding: 20px 10px 40px 10px;
    border-bottom: 1px solid #efefef;
}

.chatmorepopmenu {
    position: absolute;
    z-index: 10;
    background-color: #fff;
    box-shadow: 10px 10px 15px 0 rgba(7, 0, 2, 0.1);
    display: none;
    border: 1px solid #c4c5c8;
    border-radius: 10px;
    min-width: 100px;
    top: 79px;
    right: 20px;
}

.chatmorepopmenu li {
    padding: 6px 15px;
    color: #999;
    cursor: pointer;
    font-size: 16px;
    border-radius: 10px;
}

.chatmorepopmenu li:hover {
    background: #f8f9fb;
}

.chatmorepopmenu li.modal_nick {
    text-align: center;
    color: #333;
    font-weight: 600;
    background: #fff;
    border-bottom: 1px dotted #ddd;
}

.chat_nextcj_balloon {
    display: none;
    top: 30px;
    position: relative;
    color: #fff;
    font-size: 14px;
    padding: 10px;
    border-radius: 5px;
    width: 160px;
    text-align: center;
    padding: 10px 15px;
    text-align: left;
    background: rgb(0 0 0 / 50%);
}
.chat_nextcj_balloon:before {
    content: '';
    position: absolute;
    left: 80%;
    top: -10px;
    border-bottom: 10px solid rgb(0 0 0 / 50%);
    border-left: 10px solid transparent;
}

.chatting_write_box_emoji {
    cursor: pointer;
    position: absolute;
    top: -29px;
    right: 264px;
    font-size: 24px;
    z-index: 8;
}

.chat_ymdmis {
    color: #e3e3e3;
    font-size: 11px;
    background: rgb(35 35 35 / 7%);
    border-radius: 5px;
    padding: 1px 5px;
}

.chat_content {
    max-width: 1560px;
    margin: 0 auto;
    width: 100%;
    height:100%;
    position: relative;
}

.invo_content {
    max-width: 1560px;
    margin: 0 auto;
    width: 100%;
    height:100%;
    position: relative;
}

.chat_bslevel_line {
    display: none !important;
}

.chat_content2 {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    height:100%;
    position: relative;
}

.card-item2_con {
    position: relative;
    min-height: calc(100% - 75px);
    padding-top: 75px;
}

.audioSlider_invoice > #audioSlider {
    top:-8px;
    left:25px;
}

.audio_con2 {
    position: relative;
    height: calc(100% - 12px);
    margin-top: 32px;
    padding: 20px 0;
}

.invo_audio_con {
    position: relative;
    height: calc(100% - 75px);
    margin-top: 75px;
    padding:20px 0;
}

.sub_content_ul {
    width: 100%;
    display: inline-block;
}

.main_top_banner {
    width: 100%;
    background: #fff;
    display:inline-block;
    padding-bottom: 20px;
}

.content_title {
    clear: both;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 10px;
    font-family: 'S-CoreDream-6Bold';
    position:relative;
    vertical-align:middle;
}

.content_title span.log_set {
    margin-left:15px;
    color:#ddd;
    font-size:18px;
    position:absolute;
    top:4px;
}

.content_title span.log_set:hover {
    cursor:pointer;
    color:#eee;
}

.bx_txt1 {
    font-size: 18px;
    font-weight: bold;
    width: 100%;
    margin-bottom:5px;
}

.bx_txt2 {
    font-size: 15px;
    width: 100%;
    margin-bottom: 12px;
    color:#999;
    font-weight:400;
}

.bx_txt3 {
    font-size: 15px;
    height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.bx_icon {
    margin-top:10px;
}

.bx-wrapper span {
    float: left;
}

.bx-wrapper img.banner_icon {
    display: inline-block;
    vertical-align:bottom;
}

.inlive_mobile {
    float: left;
    margin: 0 30px;
}

.rbanner_txt1 {
    font-size: 17px;
    margin-bottom: 5px;
}

.rbanner_txt2 {
    font-size: 12px;
    margin-bottom: 12px;
    color: #72b8ef;
}

.bd1px {
    border-right: 1px solid #e5e5e5;
}

.bxslider > li {
    height: 180px;
}

.bxslider li.rbanner_txt1 {
    height: 42px;
}

.bxslider2 .rbanner_box li {
    height: auto;
}

.bx-wrapper {
    margin-bottom: 0;
    padding-top:15px;
}

.featured {
    min-height:220px;
}

.banner_icon {
    margin-right:1px;
    width:16px;
    vertical-align:bottom;
}



.myitem_topmenu {
    width: 100%;
    margin: 20px 0;
    position: relative;
}

.myitem_topmenu ul {
    width: auto;
    display: table;
    overflow: visible;
}

.myitem_topmenu li {
    display: table-cell;
    display: inline-block;
    padding: 5px;
}



.hash_box {
    width: 100%;
    margin: 20px 0;
    /*height: 39px;*/
    position: relative;
}

.hash_box ul {
    width: auto;
    display: table;
    overflow: visible;
}

.hash_box li {
    display: table-cell;
    border: 1px solid #ddd;
    padding: 4px 20px;
    border-radius: 30px;
    font-size: 16px;
    background: #fff;
    margin-right: 10px;
    display: inline-block;
    margin-bottom: 8px;
    cursor: pointer;
}

.hash_box li.hashtagon {
    background-color: #222222;
    border: 1px solid #000000;
    color: #ffffff;
}

.hash_box_bak li:hover {
    border: 1px solid transparent !important;
    background: -webkit-linear-gradient(white, white), -webkit-linear-gradient(right, #e777af 0%, #7e73f2 100%);
    background: -o-linear-gradient(white, white), -o-linear-gradient(right, #e777af 0%, #7e73f2 100%);
    background: linear-gradient(white, white), linear-gradient(to left, #e777af 0%, #7e73f2 100%);
    -webkit-background-clip: padding-box, border-box, text;
    -moz-background-clip: padding-box, border-box, text;
    background-clip: padding-box, border-box;
    -webkit-background-origin: border-box, text;
    background-origin: border-box, text;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    color: #7e73f2;
}

.hash_box2 span {
    border: 1px solid #ddd;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 12px;
    margin-right: 5px;
    display: inline-block;
    margin-bottom: 5px;
    margin-top: 10px;
}

.question_mark {
    background-color: #6e6e6e;
    width: 21px;
    height: 21px;
    border-radius: 15px;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 15px;
}

.question_mark2 {
    background-color: #6e6e6e;
    width: 28px;
    height: 28px;
    border-radius: 15px;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 19px !important;
}

.more_btn {
    float: right;
    font-weight: 400;
    font-size: 15px;
    color: #777;
    padding-top: 7px;
}

.more_btn::after {
    /*background: url('/images/sprite_pc_arrow.png');*/
    display: inline-block;
    width: 8px;
    height: 13px;
    background-position: 17px 3px;
    content: '';
}

.card-item {
    background: #fff;
    padding: 30px 10px;
    margin:0.5%;
    width:15.5%;
    float:left;
    border-radius:10px;
}

.card-item:hover {
    content: '';
    z-index: 3;
}

.card-item-mc {
    background: #fff;
    padding: 30px 10px;
    margin:0.5%;
    width:32%;
    float:left;
    border-radius:10px;
}

.card-item-mc:hover {
    content: '';
    z-index: 3;
}

.card-item2:hover {
    content: '';
    z-index: 3;
}

.card-item2 {
    /* background: #fff; */
    padding: 25px 12px;
    margin: 0.5%;
    width: 15.5%;
    float: left;
    border-radius: 10px;
}

.card-item3 {
    background: #fff;
    padding: 30px 10px;
    margin:0.5%;
    width:32%;
    float:left;
    border-radius:10px;
}

.card-item3:hover {
    content: '';
    z-index: 3;
}

.card-item4 {
    background: #fff;
    overflow:hidden;
    border-radius:15px;
    position:relative;
}

.intalk_list_box {
    margin:0.5% 0.5% 1% 0.5%;
    width:19%;
    float:left;
}

.intalk_list_box2 {
    margin:0.5% 0.5% 1% 0.5%;
    width:32%;
    float:left;
}

.intalk_accept_icon {
    text-align:center;
    margin-bottom:10px;
}

.intalk_detail_heart {
    position:absolute;
    top:10px;
    left:120px;
    color:#555;
}

.box-file-input label{
    display:inline-block;
    background:#none;
    line-height:35px;
    cursor:pointer;
}

.box-file-input label:after{
    content:"\f65e";
    font-family:'Font Awesome 5 Free';
    font-weight:600;
    color:#333;
}

.box-file-input .file-input{
    display:none;
}

.box-file-input .filename{
    display:inline-block;
    padding-left:10px;
}

.box-file-input2 {
    display:inline-block;
    width:40px;
    height:40px;
}

.box-file-input2 label {
    display: inline-block;
    width:40px;
    max-width:50px;
    height:40px;
    line-height:40px;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid #ddd;
    border-radius: 50%;
}

.box-file-input2 input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.log_mycon {
    position: relative;
    padding-top: 60%;
    overflow: hidden;
    border: none;
    border-radius: 5px;
    margin-bottom: 10px
}

.log_mycon img {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    bottom: 0%;
    width:100%;
    max-width: 100%;
    height: 100%;
}

.thumbnail-wrapper {
    position: relative;
    cursor: pointer;
}

.thumbnail {
    position: relative;
    padding-top: 60%;
    /* 1:1 ratio */
    overflow: hidden;
    border: none;
    border-radius: 5px;
    margin-bottom: 10px;
    border: 1px solid #ebebeb;
}

.thumbnail img {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    bottom: 0%;
    width:100%;
    max-width: 100%;
    height: 100%;
}

.intalk_thumbnail {
    padding: 55%;
    /* 1:1 ratio */
    border: none;
    border-radius: 5px;
}

.intalk_thumbnail:after {
    position:absolute;
    content:'';
    top:0;
    left:0;
    background:rgba(0,0,0,.3);
    width:100%;
    height:100%;
}

.intalk_thumbnail img {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    bottom: 0%;
    width:100%;
    max-width: 100%;
    height: 100%;
}

.userlevel90effect {
    position: absolute;
    top: -65px;
    left: 1px;
    z-index: 3;
    background-color: rgb(0 0 0 / 70%);
    color: #ffd600;
    padding: 0px 6px 2px 6px;
    font-size: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-radius: 20px;
}

.thumbnail_txt1 {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 3;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 4px 7px;
    font-size: 13px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-radius:5px;
}

.thumbnail_txt2 {
    z-index: 1;
    padding: 3px 5px 10px 5px;
    border-radius: 5px;
    font-size: 15px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /*max-width: 80%;*/
    max-width: 99%;
}

.thumbnail_txt2 span {
    font-weight: 500;
    color: #e877ae;
}

.thumbnail_txt2 span:hover {
    cursor: pointer;
    text-decoration: underline;
}

.thumbnail_txt3 {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 3px 5px;
    border-radius: 5px;
    font-size: 13px;
}

.thumbnail_txt4 {
    position: absolute;
    bottom: 0;
    right: 0;
    width:100%;
    z-index: 1;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 7px 15px;
    border-radius: 5px;
    font-size: 13px;
}

.toplive_txt1 {
    /*margin-bottom: 3px;*/
    line-height: 26px;
    font-size: 16px;
    font-weight: 500;
    width: 98%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.toplive_txt1:hover {
    cursor: pointer;
    text-decoration: underline;
}

.intalk_txt1 {
    margin-bottom: 5px;
    font-size: 15px;
    font-weight: 500;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.intalk_txt1:hover {
    cursor: pointer;
    text-decoration: underline;
}

.talk_end {
    position:absolute;
    right:15px;
    color:#F2450C;
}

.toplive_txt2 {
    margin-bottom: 3px;
    font-size: 12px;
    color: #999;
}

.toplive_txt2 span {
    font-weight: 400;
    /*padding:4px 7px;
	border:1px solid #ddd;
	border-radius:15px;
	display:inline-block;*/
    background:linear-gradient(to top, #eee 50%, transparent 50%);
    color:#555;
    margin-right:10px;
}

.toplive_txt4 {
    padding:8px 0;
    font-size: 12px;
    color: #999;
}

.toplive_txt4 span {
    font-weight: 400;
    /*padding:4px 7px;
	border:1px solid #ddd;
	border-radius:15px;
	display:inline-block;*/
    background: linear-gradient(to top, #555 50%, transparent 50%);
    color:#ccc;
    margin-right:10px;
}

.toplive_txt3 {
    /*margin-top: 20px;*/
    color: #adadad;
}

.origin_thumb_box {
    width: 170px;
    height: 170px;
    overflow: hidden;
    border: 1px solid #eee;
    border-radius: 170px;
    float: left;
    margin-right: 20px;
}

.thumb_img {
    width: 100%;
}

.origin_txt_box {
    float: left;
}

.ori_icon_box {
    text-align: center;
    display: inline-block;
    margin-top:10px;
}

.origin_txt1 {
    font-size: 15px;
    margin-top: 20px;
}

.ori_icon_wrap {
    float: left;
    margin-right: 30px;
}

.ori_icon_wrap:last-child {
    margin-right: 0;
}

.cnt_box {
    width: 134px;
    margin-top: 23px;
}

.origin_con {
    background: #fff;
}

.mobile_ft {
    display: none;
}

.thumbnail_cover {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 5px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: none;
}

.play_btn {
    font-size: 60px;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    margin-left: -30px;
    margin-top: -30px;
    display: none;
}

.listen_close {
    position: absolute;
    right: 15px;
    top: 15px;
    margin: 0;
    display: none;
}

.invoice_right_close {
    position: absolute;
    right: 15px;
    top: 15px;
    margin: 0;
    display: none;
}

.pc_none {
    display: none;
}

.mobile_block {
    display: none;
}

.content_title .txt2 {
    font-size: 16px;
    color: #646464;
}

.sub_content_title span {
    font-size: 24px;
    vertical-align:middle;
}

.content_cj,
.content_broad,
.content_live,
.content_audio {
    width: 100%;
    display: inline-block;
}



.rank_tab_menu {
    margin: 30px 0 20px 0;
    display: inline-block;
    height: 50px;
    max-width: 400px;
    width:100%;
    position: relative;
}

.rank_tab_menu li {
    float: left;
    width: 25%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    background:#f9f9f9;
    color:#888;
    border:1px solid #ddd;
}

.rank_tab_menu li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.rank_tab_menu li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    border-left:none;
}

.rank_tab_menu li:nth-child(2) {
    border-right:none;
}

.rank_tab_menu li a:link {
    display:block;
}

.rank_tab_menu li:hover {
    color: #e877ae;
    font-weight:600;
}

.rank_tab_menu li a:hover {
    color: #e877ae;
    font-weight:600;
}

.rank_tab_menu li:first-child {
    padding-left: 0;
}

.rank_tab_menu li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
    overflow:hidden;
}


.live_tab_menu {
    margin: 30px 0 10px 0;
    display: inline-block;
    height: 50px;
    max-width: 400px;
    width:100%;
    position: relative;
}

.live_tab_menu li {
    float: left;
    width: 20%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    background:#f9f9f9;
    color:#888;
    border:1px solid #ddd;
}

.live_tab_menu li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.live_tab_menu li:nth-child(2) {
    border-right:none;
}

.live_tab_menu li:nth-child(3) {
    border-right:none;
}

.live_tab_menu li:nth-child(4) {
    border-right:none;
}

.live_tab_menu li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}



.live_tab_menu li a:link {
    display:block;
}

.live_tab_menu li:hover {
    color: #e877ae;
    font-weight:600;
}

.live_tab_menu li a:hover {
    color: #e877ae;
    font-weight:600;
}

.live_tab_menu li:first-child {
    padding-left: 0;
}

.live_tab_menu li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
    overflow:hidden;
}

.live_sub_tab_menu {
    margin: 0 0 6px 0;
    padding: 0 0 0 30px;
    display: inline-block;
    height: 40px;
    max-width: 400px;
    width:100%;
    position: relative;
}

.live_sub_tab_menu li {
    float: left;
    width: 30%;
    font-size: 13px;
    line-height: 40px;
    height: 40px;
    cursor: pointer;
    text-align: center;
    background:#f9f9f9;
    color:#888;
    border:1px solid #ddd;
}

.live_sub_tab_menu li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.live_sub_tab_menu li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.live_sub_tab_menu li:nth-child(2) {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.live_sub_tab_menu li a:link {
    display:block;
}

.live_sub_tab_menu li:hover {
    color: #e877ae;
    font-weight:600;
}

.live_sub_tab_menu li a:hover {
    color: #e877ae;
    font-weight:600;
}

.sub_tab_menu li:first-child {
    padding-left: 0;
}

.live_sub_tab_menu li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
    overflow:hidden;
}

/**/

.sub_tab_menu {
    margin: 30px 0 20px 0;
    display: inline-block;
    height: 50px;
    max-width: 400px;
    width:100%;
    position: relative;
}

.sub_tab_menu li {
    float: left;
    width: 50%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    background:#f9f9f9;
    color:#888;
    border:1px solid #ddd;
}

.sub_tab_menu li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.sub_tab_menu li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.sub_tab_menu li:nth-child(2) {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.sub_tab_menu li a:link {
    display:block;
}

.sub_tab_menu li:hover {
    color: #e877ae;
    font-weight:600;
}

.sub_tab_menu li a:hover {
    color: #e877ae;
    font-weight:600;
}

.sub_tab_menu li:first-child {
    padding-left: 0;
}

.sub_tab_menu li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
    overflow:hidden;
}

.sub_tab_menu2 {
    margin: 30px 0;
    background-size: 100% 100%;
    display: inline-block;
    height: 50px;
    width: 99%;
    position: relative;
}

.sub_tab_menu2 li {
    float: left;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    width: 100px;
    background: #f9f9f9;
    color:#888;
    margin: 0 1px;
}

.sub_tab_menu2 li a:link {
    display:block;
}

.sub_tab_menu2 li:hover {
    color: #222;
    background-color: #fff;
    font-weight:600;
}

.sub_tab_menu2 li a:hover {
    color: #222;
    background-color: #fff;
    font-weight:600;
}

.sub_tab_menu2 li:first-child {
    padding-left: 0;
}

.sub_tab_menu2 li.active {
    color: #e877ae;
    font-weight: 600;
    border: 1px solid #e877ae;
    background: #fff;
}

.sub_tab_menu3 {
    margin: 30px 0;
    display: inline-block;
    height: 50px;
    max-width: 600px;
    width:100%;
    position: relative;
}

.sub_tab_menu3 li {
    float: left;
    width: 33.33%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    background:#f9f9f9;
    color:#888;
    text-align: center;
    border:1px solid #ddd;
    overflow:hidden;
}

.sub_tab_menu3 li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.sub_tab_menu3 li:nth-child(2) {
    border-right:none;
}

.sub_tab_menu3 li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.sub_tab_menu3 li a:link {
    display:block;
}

.sub_tab_menu3 li:hover {
    color: #e877ae;
    background-color: #fff;
    font-weight:500;
}

.sub_tab_menu3 li a:hover {
    color: #e877ae;
    background-color: #fff;
    font-weight:500;
}

.sub_tab_menu3 li:first-child {
    padding-left: 0;
}

.sub_tab_menu3 li.active {
    color: #e877ae;
    font-weight: 500;
    background-color: #fff;
}

.sub_tab_menu3 li a {
    text-decoration:none;
}

.sub_tab_menu4 {
    margin: 30px 0;
    border-bottom: 2px solid #e877ae;
    display: inline-block;
    height: 50px;
    width: 99%;
    position: relative;
}

.sub_tab_menu4 li {
    float: left;
    width: 25%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    /*cursor: pointer;*/
    text-align: center;
    color:#888;
}

.sub_tab_menu4 li:hover {
    /*color: #222;*/
    /*border-bottom: 2px solid #fff;*/
}

.sub_tab_menu3 li:first-child {
    padding-left: 0;
}


.itemmall_tab_menu4 {
    margin: 30px 0;
    display: inline-block;
    height: 50px;
    max-width: 600px;
    width:100%;
    position: relative;
}

.itemmall_tab_menu4 li {
    float: left;
    width: 25%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    background:#f9f9f9;
    color:#888;
    text-align: center;
    border:1px solid #ddd;
    overflow:hidden;
}

.itemmall_tab_menu4 li:first-child {
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-right:none;
}

.itemmall_tab_menu4 li:nth-child(2) {
    border-right:none;
}

.itemmall_tab_menu4 li:nth-child(3) {
    border-right:none;
}

.itemmall_tab_menu4 li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.itemmall_tab_menu4 li a:link {
    display:block;
}

.itemmall_tab_menu4 li:hover {
    color: #e877ae;
    background-color: #fff;
    font-weight:500;
}

.itemmall_tab_menu4 li a:hover {
    color: #e877ae;
    background-color: #fff;
    font-weight:500;
}

.itemmall_tab_menu4 li:first-child {
    padding-left: 0;
}

.itemmall_tab_menu4 li.active {
    color: #e877ae;
    font-weight: 500;
    background-color: #fff;
}

.itemmall_tab_menu4 li a {
    text-decoration:none;
}

.itemmall_tab_menu4 li:first-child {
    padding-left: 0;
}



.sub_tab_menu4 li.active {
    color: #222;
    font-weight: 600;
    border-bottom: 2px solid #fff;
    background-color: #fff;
    border: 2px solid #e877ae;
}

.sub_tab_menu5 {
    margin: 30px 0;
    display: inline-block;
    height: 50px;
    width: 1000px;
    position: relative;
}

.sub_tab_menu5 li {
    float: left;
    width: 20%;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
    color:#888;
    border:1px solid #ddd;
    background:#f9f9f9;
}

.sub_tab_menu5 li:hover {
    color: #e877ae;
    background-color: #fff;
    font-weight:600;
}

.sub_tab_menu5 li:first-child {
    border-right:none;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
}

.sub_tab_menu5 li:nth-child(2) {
    border-right:none;
}

.sub_tab_menu5 li:nth-child(3) {
    border-right:none;
}

.sub_tab_menu5 li:nth-child(4) {
    border-right:none;
}

.sub_tab_menu5 li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.sub_tab_menu5 li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
}

.sub_tab_menu6 {
    margin: 30px 0;
    display: inline-block;
    height: 66px;
    width: 1000px;
    position: relative;
}

.sub_tab_menu6 li {
    float: left;
    width: 16%;
    border:1px solid #ddd;
    background:#f9f9f9;
    color:#888;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
}

.sub_tab_menu6 li:first-child {
    border-right:none;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
}

.sub_tab_menu6 li:nth-child(2) {
    border-right:none;
}

.sub_tab_menu6 li:nth-child(3) {
    border-right:none;
}

.sub_tab_menu6 li:nth-child(4) {
    border-right:none;
}

.sub_tab_menu6 li:nth-child(5) {
    /*border-right:none;*/
}

.sub_tab_menu6 li:last-child {
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
}

.sub_tab_menu6 li:hover {
    color: #e877ae;
    background-color: #fff;
}

.sub_tab_menu6 li.active {
    color: #e877ae;
    font-weight: 600;
    background-color: #fff;
}

.m_sub_tab_menu6 {
    margin: 30px 0;
    display: inline-block;
    width: 100%;
    position: relative;
}

.m_sub_tab_menu6 li {
    float: left;
    border:1px solid #ddd;
    background:#f9f9f9;
    color:#888;
    font-size: 14px;
    line-height: 50px;
    height: 50px;
    cursor: pointer;
    text-align: center;
}

.m_sub_tab_menu6 li:first-child {
    border-right:none;
    border-top-left-radius:10px;
    width:33.3%;
}

.m_sub_tab_menu6 li:nth-child(2) {
    border-right:none;
    width:33.3%
}

.m_sub_tab_menu6 li:nth-child(3) {
    border-top-right-radius:10px;
    width:33.3%;
}

.m_sub_tab_menu6 li:nth-child(4) {
    border-right:none;
    border-top:none;
    border-bottom-left-radius:10px;
    width:50%;
}

.m_sub_tab_menu6 li:last-child {
    border-top:none;
    border-bottom-right-radius:10px;
    width:50%;
}

.tabs {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
}

.tabs nav {
    text-align: center;
}

.tabs nav ul {
    position: relative;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    -ms-box-orient: horizontal;
    -ms-box-pack: center;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
}

.tabs nav ul li {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.tabs nav a {
    position: relative;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 2.5;
}

.tabs nav a span {
    vertical-align: middle;
    font-size: 0.75em;
}

.tabs nav li.tab-current a {
    color: #e877ae;
}

.tabs nav a:focus {
    outline: none;
}

/* Content */
.content-wrap {
    position: relative;
    margin-top: 30px;
}

.content-wrap section {
    display: none;
    margin: 0 auto;
}

.content-wrap section.content-current {
    display: block;
}

/* Fallback */
.no-js .content-wrap section {
    display: block;
    padding-bottom: 2em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.6);
}

.no-flexbox nav ul {
    display: block;
}

.no-flexbox nav ul li {
    min-width: 15%;
    display: inline-block;
}

@media screen and (max-width: 58em) {
    .tabs nav a.icon span {
        display: none;
    }

    .tabs nav a:before {
        margin-right: 0;
    }
}

/*****************************/
/* 방송하기 탭 */
/*****************************/

.tabs-style-linetriangle nav a {
    overflow: visible;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.tabs-style-linetriangle nav a span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}

.tabs-style-linetriangle nav li.tab-current a:after,
.tabs-style-linetriangle nav li.tab-current a:before {
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    border: solid transparent;
    content: '';
    pointer-events: none;
}

.tabs-style-linetriangle nav li.tab-current a:after {
    margin-left: -10px;
    border-width: 10px;
    border-top-color: #fff;
}

.tabs-style-linetriangle nav li.tab-current a:before {
    margin-left: -11px;
    border-width: 11px;
    border-top-color: rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 58em) {
    .tabs-style-linetriangle nav {
        font-size: 0.6em;
    }
}

.sub_tab_title {
    font-weight: 600;
    font-size: 18px;
    position: relative;
}

.m_tab {
    display: none;
}

.search_cj {
    margin-top:20px;
}

.search_cj_li {
    width: 32%;
    float: left;
    background: #f9f9f9;
    padding: 10px 15px 15px 15px;
    margin: 5px;
    display: inline-block;
    border-radius:10px;
}

.search_cj_li:hover {
    cursor:pointer;
    background:#f6f6f6;
}

.search_cj_wrap > div {
    display:inline-block;
    vertical-align:middle;
    position:relative;
}

.search_cj_wrap > div > span.img_wrap {
    width:45px;
    height:45px;
    overflow:hidden;
    border-radius:50%;
    display:inline-block;
}

.search_cj_wrap > div > span.img_wrap img {
    width:100%;
    height:100%;
}

.search_cj_wrap > div.live_state {
    float: right;
    margin-top:20px;
}

.search_cj_wrap > div > span.nick {
    display: inline-block;
    font-weight:500;
}

.search_cj_wrap > div > span.id {
    display: inline-block;
    color:#999;;
    font-weight:300;
    font-size:14px;
}

.btn_log {
    border: 1px solid #ddd;
    color: #666;
    background: #fff;
    font-size: 13px;
    width: 100px;
    height: 33px;
}

.btn_follow {
    border: 1px solid #ddd;
    color: #666;
    background: #f9f9f9;
    font-size: 13px;
    width: 100px;
    height: 33px;
    color: #999;
}

.img_wrap {
    border-radius: 50%;
    overflow: hidden;
    margin-right: 20px;
}

.sub_more_btn {
    color: #a0a0a0;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 15px;
    font-weight: normal;
}

.more_btn:hover {
    text-decoration: underline;
    cursor: pointer;
}

.sub_live {
    padding-top: 20px;
}

.inlive_btn {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 15px;
    color: #777;
    width: 90px;
    text-align: center;
    padding: 5px;
    line-height: 20px;
    box-sizing: border-box;
}

.inlive_btn2 {
    background-color: #fff;
    border: 3px solid #1d8dea;
    border-radius: 15px;
    font-weight: 600;
    color: #1d8dea;
    width: 90px;
    text-align: center;
    padding: 3px;
    line-height: 20px;
    box-sizing: border-box;
}

.ranking_btn_on {
    background: none;
    color: #999;
    /*border: 1px solid #ddd;*/
    border:none;
    padding: 7px 12px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    position:relative;
}

.ranking_btn_on:hover {
    color:#e877ae;
    font-weight:600;
}

.ranking_btn_on:after {
    content:'';
    position:absolute;
    border-right:1px solid #999;
    height:13px;
    top:12px;
    right:0;
}

.ranking_btn_on2 {
    background: none;
    color: #999;
    /*border: 1px solid #ddd;;*/
    border:none;
    padding: 7px 12px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.ranking_btn_on2:hover {
    color:#e877ae;
    font-weight:600;
}

.ranking_btn {
    /*background: rgba(232,119,174,.2);
	border: 1px solid #e877ae;*/
    background:none;
    color: #e877ae;
    padding: 7px 12px;
    font-weight:600;
    position:relative;
    border-radius:5px;
}

.ranking_ul .active {
    background-color: #eee;
}

.inlive_btn:hover {
    border: 1px solid #e877ae;
    box-sizing: border-box;
    color: #e877ae;
}

.ranking_li {
    width: 100%;
    padding: 20px 0;
}

.ranking_li:nth-child(2n-1) {
    background:#fafafa;
    border-radius:15px;
}

.ranking_ul {
}

.ranking_wrap {
    position:relative;
    width:45px;
    text-align:center;
}

.livetop4_content {
    clear: both;
    position: relative;
    width: 100%;
}

.livetop4_content li {
    display:inline-block;
    vertical-align:middle;
}

.livetop4_txt3 {
    font-size: 12pt;
    font-weight: bold;
    width: calc(100% - 10px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-top: 16px;
}

.livetop4_txt4 {
    font-size: 12pt;
    color: #999999;
    /*width: 170px;*/
    width: calc(100% - 10px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.livetop4_content li.txt2 {
    margin-right: 20px;
    position: relative;
    border-radius: 40px;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,.1);
    /*width: 320px;*/
    width: 22.4%;
    margin-bottom: 20px;
}

.livetop4_content li.txt2 .livetop4_wrap .livetop4_img {
    width: 75px;
    height: 75px;
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position:relative;
    top: 2px;
    left: 2px
}

.livetop4_content li.txt2 .livetop4_wrap .livetop4_img span {
    margin:2px;
    position:absolute;
    z-index:3;
    width:71px;
    height:71px;
    border-radius:50%;
    background:#fff;
    left:0;
    top:0;
    overflow:hidden;
}

.livetop4_content li.txt2 .livetop4_img img{
    width:100%;
}

.livetop4_img_border {
    border-Width: 2px;
    position: absolute;
    border-radius: 50%;
    width: 75px;
    height: 75px;
    top: 2px;
    left: 2px;
}

.livetop4_img_border:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 50%;
    z-index: 1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}



.ranking_content {
    clear: both;
    position: relative;
    width: 100%;
}

.ranking_content li {
    display:inline-block;
    vertical-align:middle;
}

.ranking_content li.txt1 {
    width: 50px;
    line-height: 60px;
    font-weight: 600;
}

.ranking_content li.txt2 {
    margin-right: 30px;
    position: relative;
}

.ranking_content li.txt2 .ranking_wrap .ranking_img {
    width: 45px;
    height: 45px;
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    position:relative;
}

.ranking_content li.txt2 .ranking_wrap .ranking_img span {
    margin:2px;
    position:absolute;
    z-index:3;
    width:41px;
    height:41px;
    border-radius:50%;
    background:#fff;
    left:0;
    top:0;
    overflow:hidden;
}

.ranking_content li.txt2 .ranking_img img{
    width:100%;
}

.ranking_content li.txt2 .ranking_live {
    position:absolute;
    bottom:0;
    left:50%;
    margin-left:-17px;
}

.ranking_content li.txt4 p.ranking_broad_title {
    font-weight:600;
    white-space:nowrap;
    /*width:80%;*/
    overflow:hidden;
    text-overflow:ellipsis;
}

.ranking_content li.txt4 span img {
    width:18px;
}

.ranking_log {
    font-size:12px;
    color:#999;
}

.ranking_log:hover {
    cursor:pointer;
    text-decoration:underline;
}

.ranking_log img {
    width:15px;
}

.ranking_content li.txt3 {
    width: 65px;
    text-align: center;
    line-height: 60px;
    margin-right: 5px;
}

.ranking_content li.txt4 {
    line-height: 25px;
    min-width: 200px;
    overflow: hidden;
    white-space:nowrap;

}

.ranking_content li.txt4 span {
    display:block;
    color:#999;
    font-weight:300;
}

.ranking_content li.txt5 {
    float: right;
    margin-top: 15px;
}

.ranking_content li.txt5 span {
    margin-left: 25px;
}

.ranking_content li.txt5 span:first-child {
    margin: 0;
}

.ranking_content .rank_up {
    color: #eb5374;
    font-size: 11px;
    font-weight: normal;
    background:rgba(235, 83, 116, .12);
    padding:2px 5px;
    border-radius:6px;
}

.ranking_content .rank_down {
    color: #5673eb;
    font-size: 11px;
    font-weight: normal;
    background:rgba(86, 115, 235, .12);
    padding:2px 5px;
    border-radius:6px;
}

.ranking_content .rank_new {
    color: #a6ce39;
    font-size: 12px;
    font-weight: normal;
}

.event_title {
    font-size: 18px;
    font-weight: 600;
    margin-top: 15px;
    padding:0 15px;
}

.event_ymd {
    font-size: 15px;
    color: #999;
    padding:15px;
}

.event-item {
    margin-bottom: 40px;
    cursor: pointer;
    width: 31%;
    margin: 15px;
    float: left;
    border:1px solid #ddd;
    position:relative;
    border-radius:10px;
    overflow:hidden;
}

.event_img img {
    width: 100%;
}

.event_black {
    background-color:rgba(0,0,0,.8);
    z-index:3;
    position:absolute;
    width:100%;
    height:100%;
}

.paging_box {
    width: 100%;
    text-align: center;
    margin-top: 30px;
    display:inline-block;
}

.paging_box button {
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    font-weight: 600;
    color: #222;
    border-radius:3px;
}

.paging_box button.active {
    border: 1px solid #e877ae;
    color: #e877ae;
}

.end_btn {
    width: 100px;
    text-align: center;
    padding: 5px 0;
    float: right;
    background-color: #646464;
    border-radius: 15px;
    color: #fff;
}

.event_content {
    text-align: center;
    padding: 20px 0;
    border-bottom: 1px solid #aaa;
    border-top:1px solid #ddd;
}

.reply_cnt {
    font-weight: 600;
    margin-bottom:10px;
}

.reply_textarea {
    width: 100%;
    border: 1px solid #ddd;
    padding: 10px;
    height:70px;
}

.event_insert_box {
    width: 100%;
    position: relative;
}

.event_insert_box textarea {
    resize:none;
}

.reply_check {
    position: absolute;
    bottom: 8px;
    right: 5px;
}

.event_insert_box .reply_check span {
    font-size:13px;
    color:#888;
}

.reply_insert_btn {
    border: 1px solid #e877ae;
    background-color: #e877ae;
    color: #fff;
    border-radius: 3px;
    padding: 5px 20px;
    font-size:14px;
}

.btn_box div:first-of-type {
    float: left;
}

.btn_box div:last-of-type {
    float: right;
}

.reply_list .txt1 {
    font-weight: 600;
    font-size: 15px;
    color: #3c3c3c;
}

.reply_list .txt1 span {
    font-weight: normal;
    color: #999;
    font-size: 14px;
}

.reply_list .txt2 {
    font-weight: 400;
    font-size: 14px;
    color: #646464;
}

.reply_list .txt3 {
    font-weight: 200;
    font-size: 14px;
    color: #3c3c3c;
}

.reply_list > li {
    margin: 15px;
    position: relative;
}

.re_report {
    top: 0;
    right: 10px;
    position: absolute;
}

.reply_list .reply2 {
    margin-left: 30px;
    position: relative;
}

.reply_list .reply2::before {
    content: "";
    position: absolute;
    background: url('/images/reply.png');
    width: 15px;
    height: 15px;
    top: 0;
    left: -20px;
}

.listen_reply_option {
    font-size:14px;
}

.reply_list > li > .listen_reply_option {
    position:absolute;
    top:0;
    right:0;
}

.reply_list > li > .listen_reply_option ul > li {
    padding:0;
    margin:0;
}

.chat_schdule_btn {
    border:1px solid #ddd;
    background:#fff;
    color:#555;
    font-size:13px;
    padding:0px 4px;
    border-radius:7px;
    display:inline-block !important;
    height:20px;
    line-height:20px;
    cursor: pointer;
    float: right;
}

.invoice_re_btn {
    border:1px solid #ddd;
    background:#fff;
    color:#555;
    font-size:12px;
    padding:0px 4px;
    border-radius:5px;
    display:inline-block !important;
    position:absolute;
    top:4px;
    right:35px;
    height:20px;
    line-height:20px;
}

.invoice_re_btn a {
    cursor:pointer;
    color: #555;
    font-weight:400;
    font-size: 12px;
    display: inline-block !important;
}

.invoice_re_btn2 {
    border:1px solid #ddd;
    background:#fff;
    color:#555;
    font-size:12px;
    padding:0px 4px;
    border-radius:5px;
    display:inline-block !important;
    position:absolute;
    top: 5px;
    right:20px;
}

.invoice_re_btn2 a {
    color:#555;
    cursor:pointer;
    font-size:12px;
    font-weight:400;
}

.invoice_re_nick {
    color:#e877ae !important;
    position:inherit !important;
    display:inline-block !important;
    margin-right:10px;
    font-weight:500 !important;
    font-size:14px !important;
    margin-top:5px;
}

.terms_box {
    width: 100%;
    /*height: 520px;*/
    border: 1px solid #ddd;
    /*overflow: hidden;*/
    color: #666;
    background: #f9f9f9;
    line-height:26px;
    padding: 20px;
}

.terms_box p.terms_tit {
    font-weight: 600;
    color: #333;
    font-size: 16px;
    margin:20px 0 10px 0;
}

.terms_box .terms_txt ul {
    list-style:decimal;
    list-style-position : inside;
}

.terms_box .terms_txt ul li {
    text-indent:-17px;
    padding-left:30px;
    line-height:26px;
}

.terms_box .terms_txt ul li ul {
    list-style:none;
}

.terms_box .terms_txt ul li ul li {
    text-indent:0;
    padding-left:0;
    line-height:26px;
}

.terms_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.terms_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.terms_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.terms_scroll {
    overflow:auto;
    height:520px;
    visibility:hidden;
    padding:15px;
}

.terms_scroll-inner,
.terms_scroll:hover {
    visibility: visible;
}

.terms_modal {
    width: 100%;
    padding: 10px;
    color: #666;
    line-height:26px;
}

.terms_modal p.terms_tit {
    font-weight: 600;
    color: #333;
    font-size: 16px;
    margin:20px 0 10px 0;
}

.terms_modal .terms_txt ul {
    list-style:decimal;
    list-style-position : inside;
}

.terms_modal .terms_txt ul li {
    text-indent:-17px;
    padding-left:30px;
    line-height:26px;
}

.terms_modal .terms_txt ul li ul {
    list-style:none;
}

.terms_modal .terms_txt ul li ul li {
    text-indent:0;
    padding-left:0;
    line-height:26px;
}

.favorites_ul {
    width: 100%;
    display: table;
    clear: both;
}

.favorites_content {
    display: table;
    clear: both;
    width: 100%;
}

.favorites_content li {
    float: left;
}

.favorites_content > li.txt1 {
    line-height: 80px;
    position:relative;
}

.favorites_content > li.favorites_con {
    width:calc(100% - 90px);
}

.favorites_content li.txt1 .img_wrap {
    width: 60px;
    height: 60px;
    overflow: hidden;
}

.favorites_content li.txt1 .img_wrap span {
    margin:2px;
    position:absolute;
    z-index:3;
    width:56px;
    height:56px;
    border-radius:50%;
    background:#fff;
}

.favorites_content li.txt1 .img_wrap img {
    width:100%;
    height:100%;
    border-radius:50%;
    line-height:initial;
    vertical-align:initial;
}

.favorites_content > li.favorites_con > ul > li.live_on {
    float:none;
}

.favorites_content > li.favorites_con > ul > li.txt2 {
    float:none;
    color:#333;
    font-size:15px;
    position:relative;
}

.favorites_content > li.favorites_con > ul > li.txt2 span.favorite_bname {
    float:none;
    display:block;
    color:#e877ae;
    font-size:14px;
}

.favorites_content > li.favorites_con > ul > li.txt2 span.favorite_chatname {
    float:none;
    display:block;
    color:#333;
    font-size:16px;
    font-weight:500;
}

.favorites_content > li.favorites_con > ul > li.txt2 span.favorite_cj {
    float:none;
    display:block;
    color:#999;
    font-size:13px;
}

.ranking_wrap .live_on {
    position:absolute;
    top:35px;
    display:block;
    left:5px;
    width:45px;
}

.log_top_box .live_on {
    position:absolute;
    bottom:0;
    left:45px;
}

.log_top_box .live_on2 {
    position:absolute;
    bottom:0;
    left:45px;
}

.live_on {
    background: #fb4a59;
    display: inline-block;
    color: #fff;
    font-size: 11px;
    border-radius: 10px;
    padding: 0 3px;
    font-weight: 600;
    font-family:'Raleway', sans-serif;
    position:absolute;
    left:50%;
    bottom:-3px;
    margin-left:-32px;
    line-height:initial;
    z-index:3;
}

.live_on:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 10px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

.live_on2 {
    background: #fb4a59;
    display: inline-block;
    color: #fff;
    font-size: 11px;
    border-radius: 10px;
    padding: 0 3px;
    font-weight: 600;
    font-family:'Raleway', sans-serif;
    position:absolute;
    left:50%;
    bottom:-3px;
    margin-left:-22px;
    z-index:3;
    -webkit-transform:scale(0.88);
}

.live_on2:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 10px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

.live_on3 {
    background: #fb4a59;
    display: inline-block;
    color: #fff;
    font-size: 11px;
    border-radius: 10px;
    padding: 0 3px;
    font-weight: 600;
    font-family:'Raleway', sans-serif;
    z-index:3;
    -webkit-transform:scale(0.88);
}

.live_on3:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 10px;
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

@keyframes animatedgradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.img_border {
    position:absolute;
    width:60px;
    height:60px;
    border-radius:50%;
    z-index:2;
    top:0;
    left:0;
}

.img_border2 {
    border-Width: 2px;
    position: absolute;
    border-radius:50%;
    width:45px;
    height:45px;
    top:0px;
    left:0px;
}

.img_border2:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 50%;;
    z-index: 1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

.gradient-border {
    border-Width: 2px;
    position: relative;
    border-radius:50%;
}

.gradient-border:after {
    content: '';
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
    border-radius: 50%;;
    z-index: 1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

.live_on .bar {
    fill: #fff;
    width: 18px;
    animation: equalize 4s 0s infinite;
}

.live_on .bar:nth-child(1) {
    animation-delay: -1.9s;
}

.live_on .bar:nth-child(2) {
    animation-delay: -2s;
}

.live_on .bar:nth-child(3) {
    animation-delay: -2.3s;
}

.live_on .bar:nth-child(4) {
    animation-delay: -2.4s;
}

.live_on .bar:nth-child(5) {
    animation-duration: -2.1s;
}

.live_on2 .bar {
    fill: #fff;
    width: 18px;
    animation: equalize 4s 0s infinite;
}

.live_on2 .bar:nth-child(1) {
    animation-delay: -1.9s;
}

.live_on2 .bar:nth-child(2) {
    animation-delay: -2s;
}

.live_on2 .bar:nth-child(3) {
    animation-delay: -2.3s;
}

.live_on2 .bar:nth-child(4) {
    animation-delay: -2.4s;
}

.live_on2 .bar:nth-child(5) {
    animation-duration: -2.1s;
}

.live_on3 .bar {
    fill: #fff;
    width: 18px;
    animation: equalize 4s 0s infinite;
}

.live_on3 .bar:nth-child(1) {
    animation-delay: -1.9s;
}

.live_on3 .bar:nth-child(2) {
    animation-delay: -2s;
}

.live_on3 .bar:nth-child(3) {
    animation-delay: -2.3s;
}

.live_on3 .bar:nth-child(4) {
    animation-delay: -2.4s;
}

.live_on3 .bar:nth-child(5) {
    animation-duration: -2.1s;
}

@keyframes equalize {
    0% {
        height: 60px;
    }

    4% {
        height: 50px;
    }

    8% {
        height: 40px;
    }

    12% {
        height: 30px;
    }

    16% {
        height: 20px;
    }

    20% {
        height: 30px;
    }

    24% {
        height: 40px;
    }

    28% {
        height: 10px;
    }

    32% {
        height: 40px;
    }

    36% {
        height: 60px;
    }

    40% {
        height: 20px;
    }

    44% {
        height: 40px;
    }

    48% {
        height: 70px;
    }

    52% {
        height: 30px;
    }

    56% {
        height: 10px;
    }

    60% {
        height: 30px;
    }

    64% {
        height: 50px;
    }

    68% {
        height: 60px;
    }

    72% {
        height: 70px;
    }

    76% {
        height: 80px;
    }

    80% {
        height: 70px;
    }

    84% {
        height: 60px;
    }

    88% {
        height: 50px;
    }

    92% {
        height: 60px;
    }

    96% {
        height: 70px;
    }

    100% {
        height: 80px;
    }
}

/*라이브 이미지 효과*/
.equilizer {
    height: 12px;
    width: 12px;
    transform: rotate(180deg);
}

.equilizer .bar2 {
    fill: #fff;
    width: 18px;
    animation: equalize 4s 0s infinite;
}

.equilizer .bar2:nth-child(1) {
    animation-delay: -1.9s;
}

.equilizer .bar2:nth-child(2) {
    animation-delay: -2s;
}

.equilizer .bar2:nth-child(3) {
    animation-delay: -2.3s;
}

.equilizer .bar2:nth-child(4) {
    animation-delay: -2.4s;
}

.equilizer .bar2:nth-child(5) {
    animation-duration: -2.1s;
}

@keyframes equalize {
    0% {
        height: 60px;
    }

    4% {
        height: 50px;
    }

    8% {
        height: 40px;
    }

    12% {
        height: 30px;
    }

    16% {
        height: 20px;
    }

    20% {
        height: 30px;
    }

    24% {
        height: 40px;
    }

    28% {
        height: 10px;
    }

    32% {
        height: 40px;
    }

    36% {
        height: 60px;
    }

    40% {
        height: 20px;
    }

    44% {
        height: 40px;
    }

    48% {
        height: 70px;
    }

    52% {
        height: 30px;
    }

    56% {
        height: 10px;
    }

    60% {
        height: 30px;
    }

    64% {
        height: 50px;
    }

    68% {
        height: 60px;
    }

    72% {
        height: 70px;
    }

    76% {
        height: 80px;
    }

    80% {
        height: 70px;
    }

    84% {
        height: 60px;
    }

    88% {
        height: 50px;
    }

    92% {
        height: 60px;
    }

    96% {
        height: 70px;
    }

    100% {
        height: 80px;
    }
}

.favorites_content li.txt6 {
    margin-top: 18px;
}

.favorites_content li.txt6 span {
    color: #999;
}

.favorites_content li.txt3 {
    margin-top: 25px;
    float: right;
}

.favorites_content li.txt3 button {
    margin-left: 10px;
}

.favorites_li {
    padding: 15px;
    max-width:700px;
    width:100%;
    margin:10px auto;
    background:#f9f9f9;
    border-radius:15px;
}

.img_wrap2 {
    border: 1px solid #ddd;
    border-radius: 0;
    margin-right: 20px;
    width: 129px;
    height: 80px;
    box-sizing: border-box;
}

.customer_wrap {
    margin:50px 0 30px 0;
}

.customer_ul {
    font-size: 15px;
    width: 100%;
    /*margin-bottom:50px;*/
    position: relative;
}

.customer_ul > li {
    width: 100%;
    padding: 20px 10px;
    border-bottom: 1px solid #ddd;
    display: table;
    clear: both;
    table-layout: fixed;
}

.customer_ul > li:first-child {
    border-top: 1px solid #ddd;
}

.customer_ul > li span {
    float: right;
    padding-right:20px;
}

.customer_ul > li > a:hover {
    color:#e877ae;
}

.customer_view {
    font-size: 15px;
    padding: 20px 10px;
    position: relative;
    border-bottom: 1px solid #ddd;
}

.studiouserimg {
    text-align:center;
    margin:0 auto;
    display:block;
}

.customer_view_btn {
    position:relative;
    display:inline-block;
}

.customer_view_btn_layer {
    position:absolute;
    top:34%;
    left:70%;
    width:20%;
    height:auto;
    cursor:pointer;
}

.customer_layer_pop {
    display:none;
}

.btn_box {
    width:100%;
    display:inline-block;
}

.download_data {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.download_data a:link {
    color:#337ab7;
}

.board_notice_modal {
    margin: 10px 0;
    padding: 20px;
    background: #f9f9f9;
    border: 1px solid #eee;
    cursor: pointer;
    font-size:16px;
}

.board_notice_modal:hover {
    cursor:pointer;
    text-decoration:underline;
}

.board_notice_modal span {
    color:#e877ae;
}

.board_notice_wrap p.board_notice_tit {
    font-weight: 600;
    color: #333;
    font-size: 18px;
    margin:20px 0 10px 0;
}

.board_notice_wrap .board_notice_txt > ul {
    list-style:decimal;
    list-style-position : inside;
}

.board_notice_wrap .board_notice_txt > ul > li {
    text-indent:-17px;
    padding-left:30px;
    line-height:26px;
    margin-top:10px;
}

.board_notice_wrap .board_notice_txt > ul > li span {
    font-weight:600;
}

.board_notice_wrap .board_notice_txt > ul > li > ul {
    list-style:none;
}

.board_notice_wrap .board_notice_txt > ul > li > ul > li {
    text-indent:-10px;
    padding-left:10px;
    line-height:26px;
    word-break:keep-all;
}

.board_notice_wrap .board_notice_txt > ul > li > ul > li:before {
    content:'-';
    padding-right:5px;
}

.board_notice_wrap .board_notice_txt > ul > li > ul > li > span {
    background:linear-gradient(to top, #f0dbe6 40%, transparent 40%);
    font-weight:normal;
}

.faq_view {
    padding: 20px 10px;
    display: none;
    border-bottom: 1px solid #ddd;
    word-break:keep-all;
}

.faq_ul {
    margin-bottom: 50px;
}

.faq_ul li {
    cursor: pointer;
}

.faq_title {
    width: 100%;
    border-bottom: 1px solid #ddd;
    padding: 20px 10px;
    display: table;
    clear: both;
}

.faq_ul li:first-child {
    border-top: 1px solid #ddd;
}

.faq_title span {
    float: right;
}

.question_table {
    width: 60%;
    margin-bottom: 50px;
    margin: 0 auto;
    border-top: 2px solid #666;
}

.question_table tr th {
    width: 90px;
    border-bottom: 1px solid #ddd;
}

.question_table tr td {
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.question_table tr th span {
    color:red;
    width:10px;
    display:inline-block;
}

.question_table tr td input {
    width:190px;
}

.question_table tr td select {
    width:190px;
}

.question_box {
    width:700px;
    margin:0 auto;
    margin-top:20px;
}

.question_box ul {
    background:#f9f9f9;
    margin-top:10px;
    padding:15px;
}

.question_box ul li {
    color:#666;
    padding-left:25px;
    font-size:14px;
}

.requestion_insert_box {
    text-align: center;
    margin-top: 30px;
}

.requestion_insert_box button {
    width: 150px;
    border: none;
    border-radius: 5px;
    background-color: #e877ae;
    color: #fff;
    padding: 11px 0;
}

.requestion_insert_box button.btn_close {
    width: 150px;
    border: 1px solid #999;
    border-radius: 5px;
    background-color: #fff;
    color: #333;
    padding: 10px 0;
}

.user_board_tab {
    display: table;
    clear: both;
    margin-bottom: 30px;
}

.user_board_tab li {
    float: left;
    padding: 0 15px;
    position: relative;
    color: #999;
    cursor: pointer;
}

.user_board_tab li:hover {
    color: #333;
}

.user_board_tab li::before {
    content: "|";
    position: absolute;
    top: 2px;
    left: 0;
    font-size:11px;
    color:#ccc;
}

.user_board_tab li:first-child {
    padding-left: 0;
}

.user_board_tab li:first-child::before {
    content: "";
}

.user_board_tab li a.active {
    color:#e877ae;
    font-weight:500;
}

.user_table tr th {
    text-align: center;
    padding: 17px 10px;
    border-top: 2px solid #666;
    border-bottom: 1px solid #ddd;
    font-size: 16px;
}

.user_table tr td {
    text-align: center;
    padding: 17px 10px;
    font-size: 15px;
    border-bottom: 1px solid #ddd;
    color: #a0a0a0;
    position: relative;
}

.user_table tr td .pic_icon {
    margin-left:10px;
}

.user_table tr td .pic_icon img {
    width:18px;
    display:inline-block;
    vertical-align:middle;
}

.user_table tr td span.user_nick:hover {
    cursor:pointer;
    text-decoration:underline;
}

.user_table tr.tbl_notice td {
    background: #f9f9f9;
    font-weight: 500;
    color: #333;
}

.user_table {
    width: 100%;
    margin-bottom: 30px;
    margin-top:20px;
}

.user_table ul.item_title {
    width:100%;
}

.user_table ul.item_title li {
    text-align: center;
    padding: 17px 10px;
    border-top: 2px solid #666;
    border-bottom: 1px solid #ddd;
    font-size: 16px;
    float:left;
}

.user_table ul.item_title li:first-child {
    width:30%;
}

.user_table ul.item_title li:nth-child(2) {
    width:20%;
}

.user_table ul.item_title li:nth-child(3) {
    width:20%;
}

.user_table ul.item_title li:last-child {
    width:30%;
}

.user_table ul.item_list {
    width:100%;
    display:flex;
}

.user_table ul.item_list:hover {
    background:#f9f9f9;
}

.user_table ul.item_list li {
    text-align: center;
    padding: 17px 10px;
    font-size: 13px;
    border-bottom: 1px solid #ddd;
    color: #a0a0a0;
    position: relative;
    font-weight:400;
    float:left;
}

.user_table ul.item_list li:first-child {
    width:30%;
}

.user_table ul.item_list li:nth-child(2) {
    width:20%;
}

.user_table ul.item_list li:nth-child(3) {
    width:20%;
}

.user_table ul.item_list li:last-child {
    width:30%;
}

.user_table ul.item_list li span.user_nick:hover {
    text-decoration:underline;
    cursor:pointer;
}

.user_table ul.item_list li .pic_icon {
    margin-left:10px;
}

.user_table ul.item_list li .pic_icon img {
    width:18px;
    display:inline-block;
    vertical-align:middle;
    image-rendering:-webkit-optimize-contrast;
}

.qna_table {
    width: 100%;
    margin-bottom: 30px;
    margin-top:20px;
}

.qna_table > li.qna_table_header {
    text-align: center;
    padding: 17px 10px;
    border-top: 2px solid #666;
    border-bottom: 1px solid #ddd;
    font-size: 16px;
}

.qna_table > li.qna_table_header > ul {
    width:100%;
    display:inline-block;
}

.qna_table > li.qna_table_header > ul > li {
    float:left;
    text-align:center;
    font-weight:600;
}

.qna_table > li.qna_table_header > ul > li:first-child {
    width:160px;
}

.qna_table > li.qna_table_header > ul > li:nth-child(2) {
    width:calc(100% - 260px);
}

.qna_table > li.qna_table_header > ul > li:last-child {
    width:100px;
}

.qna_table > li.qna_table_list {
    text-align: center;
    padding: 17px 10px;
    font-size: 15px;
    border-bottom: 1px solid #ddd;
    color: #555;
    position: relative;
    font-weight:400;
}

.qna_table > li.qna_table_list > ul {
    width:100%;
    display:inline-block;
}

.qna_table > li.qna_table_list > ul > li {
    float:left;
}

.qna_table > li.qna_table_list > ul > li:first-child {
    width:160px;
}

.qna_table > li.qna_table_list > ul > li:nth-child(2) {
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    width:calc(100% - 260px);
}

.qna_table > li.qna_table_list > ul > li:last-child {
    width:100px;
}

.qna_table > li.qna_table_list > ul > li.qna_state span.wait {
    color:#999;
}

.qna_table > li.qna_table_list > ul > li.qna_state span.end {
    color:#ff4141;
}

.qna_answer {
    background:#f9f9f9;
    display:inline-block;
    width:100%;
}

.qna_answer > ul {
    margin:25px;
    background:#fff;
}

.qna_answer > ul > li {
    padding:10px;
}

.qna_answer > ul > li.qna_answer_inlive {
}

.qna_answer > ul > li.qna_answer_inlive img{
    width:100px;
}

.qna_answer > ul > li.qna_answer_tit {
    font-weight:600;
    font-size:17px;
}

.qna_answer > ul > li > ul.qna_answer_txt {
    border:1px solid #ddd;
    padding:15px;
}

.community_reply {
    color:#e877ae;
    margin-right:5px;
}

.reply_cnt2 {
    margin-left:5px;
    font-size:13px;
}

.reply_cnt2 b {
    color:#333;
}

.user_table tr.tbl_notice td {
    background: #f9f9f9;
    font-weight: 500;
    color: #333;
}

.user_table tr.tbl_notice span.tbl_category {
    color: #e877ae;
    border: 1px solid #e877ae;
    padding: 2px 10px;
    font-size: 13px;
}

.user_board_id_select {
    position: absolute;
    border: 1px solid #ddd;
    background-color: #fff;
    border-radius: 5px;
    z-index: 1;
    display: none;
    box-shadow: 2px 2px 2px #999;
}

.user_board_id_select > li {
    padding: 5px 10px;
    font-size: 14px;
    color:#666;
    font-weight:400;
}

.user_board_id_select > li:hover {
    color: #e877ae;
    cursor:pointer;
}

.user_board_id_select a:hover {
    text-decoration:none;
    color:#999;
}

.user_board_id_select2 {
    position: absolute;
    border: 1px solid #ddd;
    background-color: #fff;
    border-radius: 5px;
    z-index: 1;
    display: none;
    box-shadow: 2px 2px 2px #999;
}

.user_board_id_select2 li {
    padding: 5px 10px;
    font-size: 14px;
    text-indent:initial;
    text-align:center;
}

.user_board_id_select2 li:hover {
    color: #e877ae;
    text-decoration:underline;
    cursor:pointer;
}

.user_table tr td.text_left {
    text-align: left;
    color: #666;
}

.user_board_box {
    text-align: right;
}

.studio_board_new {
    border-radius: 10px;
    border: solid 1px #e877ae;
    padding: 0px 4px;
    font-size: 12px;
    color: #e877ae;
}

.studio_song {
    color:#e877ae;
    text-align:right;
    font-weight:500;
}

.live_gift_btn {
    border: 1px solid #e877ae;
    background-color: #fff;
    padding: 12px 30px;
    color: #e877ae;
    font-size: 15px;
    font-weight: 600;
    display: inline-block;
    border-radius:10px;
}

.board_btn {
    border: 1px solid #e877ae;
    background-color: #fff;
    padding: 6px 16px;
    color: #e877ae;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    border-radius:5px;
}

.board_btn1 {
    background-color: #fff;
    border: 1px solid #bbb;
    border-radius:5px;
    padding: 6px 16px;
    color: #999;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
}

.board_btn2 {
    background-color: #fff;
    border: 1px solid #999;
    padding: 6px 16px;
    color: #555;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    border-radius:5px;
}

.board_btn3 {
    border: none;
    background-color: #e877ae;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn4 {
    border: none;
    background-color: #b7b7b7;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn5 {
    border: 1px solid #c863a4;
    background: rgba(200, 99, 164, 0.2);
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn5 img {
    height:16px;
}

.board_btn6 {
    background:#ea4673;
    border:none;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn7 {
    border: none;
    background-color: #b7b7b7;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn8 {
    background-color: #fff;
    border: 1px solid #999;
    padding: 6px 16px;
    color: #555;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
    border-radius:5px;
}

.board_btn9 {
    background-color: #e877ae;
    border: none;
    padding:12px 50px;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    display: inline-block;
    border-radius:5px;
}

.board_btn10 {
    border: none;
    background-color: #343453;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.board_btn11 {
    border: none;
    background-color: #8d2458;
    padding: 7px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.log_follow_btn {
    border: none;
    background: rgba(232,119,174,1);
    padding: 8px 17px;
    color: #fff;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}

.log_following_btn {
    border: none;
    background: rgba(249,249,249,1);
    padding: 8px 17px;
    color: #999;
    font-size: 14px;
    display: inline-block;
    border-radius:5px;
}


.copy_btn {
    background-color: #fff;
    border: 1px solid #999;
    padding: 3px 6px;
    color: #555;
    font-size: 12px !important;
    font-weight: 400 !important;
    display: inline-block;
    border-radius:5px;
    margin-left:15px;
}

.favorite_btn {
    position:absolute;
    background-color: #fff;
    border: 1px solid #999;
    padding: 6px 16px;
    color: #555;
    font-size: 13px !important;
    font-weight: 400 !important;
    display: inline-block;
    border-radius:5px;
    right:15px;
    top:13px;
}

.search_box {
    text-align: center;
}

.user_board_view_top .txt1 {
    font-size: 20px;
    margin-bottom: 5px;
    font-weight:500;
}

.user_board_view_top > li > .txt2 {
    font-size: 15px;
    color: #a0a0a0;
    position:relative;
    font-weight:300;
    display:inline-block;
}

.user_board_view_top > li > .txt2 > .studio_user {
    float:left;
    color:#333;
    font-weight:500;
    margin-right:5px;
}

.user_board_view_top > li > .txt2 > .studio_user > ul > li {
    text-indent:initial;
    text-align:center;
    font-weight:400;
}

.user_table tr td.active {
    font-weight: 600;
    color: #222;
}

.user_board_write_table {
    width: 100%;
}

.user_board_write_table > ul > li {
    display:inline-block;
    width:100%;
    margin:5px 0;
}

.user_board_write_table > ul > li > ul > li.user_board_write_title {
    width:100px;
    float:left;
    font-weight:500;
    margin-top:6px;
}

.user_board_write_table > ul > li > ul > li.user_board_write_content {
    width:calc(100% - 100px);
    float:left;
}

.user_board_write_table textarea {
    border:1px solid #ddd;
    border-top:none;
    height:222px;
    display:block;
    padding:15px;
}

.user_board_write_table textarea:focus {
    outline:none;
}

.user_board_write_table textarea.music_letter_box {
    width:100%;
    border:1px solid #ddd;
    resize:none;
    height:300px;
    border-radius:3px;
    padding:5px;
}

.log_text {
    resize:none;
    border:1px solid #ddd;
    border-top:none;
    padding:10px;
    font-size:14px;
}

.log_text:focus {
    outline:none;
}

.image_upload {
    background:#f9f9f9;
    width:30%;
    display:inline-block;
    height:20px;
    position:relative;
    text-align:center;
}

.image_upload_wrap {
    width:100%;
    height:180px;
    border-bottom:none;
    border:1px solid #ddd;
    display:flex;
    padding:10px;
    background:#f9f9f9;
}

.image_upload_wrap > .image_upload2 {
    width:20%;
    float:left;
}

.image_upload_list_wrap {
    float:left;
    width:80%;
    height:158px;
    border-left:none !important;
    display:inline-block;
    /*border:1px dashed #ddd;
	background:#fff;*/
}

.image_upload_list {
    margin-top:15px !important;
}

.image_upload_list li {
    height:128px;
}

.image_upload_item {
    margin:15px;
    border:1px solid #ddd;
    width:100%;
    height:100%;
    display:inline-block;
    position:relative;
    overflow:hidden;
}

.image_upload_item img {
    width:140%;
    top:50%;
    left:50%;
    position:absolute;
    transform:translate(-50%, -50%);
}

.image_delete_btn {
    position:absolute;
    width:25px;
    height:25px;
    border-radius:50%;
    background:rgba(255, 255, 255, .8);
    top:5px;
    right:5px;
    color:#666;
    z-index:1;
}

.image_delete_btn:hover {
    background:#fff;
    cursor:pointer;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    transition: background 0.5s ease;
    z-index:6;
}

.image_upload2:hover .overlay {
    display: block;
    background: rgba(0, 0, 0, .1);
}

.image_delete {
    position: absolute;
    left:50%;
    top: 50%;
    text-align: center;
    opacity: 0;
    transition: opacity .35s ease;
    z-index:7;
    color:#fff;
    font-size:30px;
    transform:translate(-50%, -50%);
}

.image_upload2:hover .image_delete {
    opacity: 1;
    cursor:pointer;
}

.image_upload_icon {
    z-index:3;
    position:relative;
    height:100%;
    display:inline-block;
}

.image_upload_icon img {
    height:auto;
    width:auto;
    max-width:100%;
    max-height:100%;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

.image_upload_icon span {
    color:#aaa;
    font-weight:300;
    position:absolute;
    width:80px;
    top:70%;
    left:50%;
    transform:translate(-50%, -50%);
    font-size:13px;
}

.image_upload:after {
    content:'\f03e';
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    font-family:'Font Awesome 5 Free';
    color:#ddd;
    font-size:50px;
    z-index:2;
}

.image_upload2 {
    background:#f9f9f9;
    width:100%;
    display:inline-block;
    height:158px;
    position:relative;
    text-align:center;
    /*border-right:1px solid #ddd !important;*/
    border:1px dashed #ddd
}

.image_upload2:after {
    content:'\f03e';
    position:absolute;
    top:45%;
    left:50%;
    transform:translate(-50%, -50%);
    font-family:'Font Awesome 5 Free';
    color:#ddd;
    font-size:50px;
    z-index:2;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    /*background: #fff;*/
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.file_upload {
    width:100%;
    background:#f9f9f9;
    border:1px solid #ddd;
    padding:5px;
}

.file_upload button{
    border:1px solid #ddd;
    background:#fff;
    border-radius:3px;
}

.login_box {
    padding: 0px 10px;
    width:310px;
    margin: 9% auto 0;
    text-align: center;
    top: -30px;
}

.login_box ul {
    margin-bottom: 30px;
}

.login_box ul li {
    margin-bottom: 10px;
}

.login_box ul li.logo_wrap {
    margin-bottom: 30px;
}

.login_box ul li.logo_wrap  img {
    width:150px;
}

.login_box ul li input[type=text] {
    width: 100%;
}

.login_box ul li input[type=checkbox] {
    padding: 5px;
    margin: 2px 5px 0 0;
}

.login_box ul li.id_save {
    text-align: left;
    font-size: 12px;
}

.login_box ul li.id_save span {
    float: left;
    cursor: pointer;
}

.login_box ul li.id_save span.find_id {
    float: right;
    font-size: 15px;
}

.login_box ul li button {
    width: 100%;
    padding: 8px 0;
    border-radius: 5px;
    cursor: pointer;
}

.login_btn1 {
    background: linear-gradient(to right, #7e73f2 0%, #e777af 100%);
    border: none;
    color: #fff;
    font-size: 15px;
}

.login_btn2 {
    background-color: #3ec729;
    border: 1px solid #3ec729;
    color: #fff;
}

.login_btn3 {
    background-color: #fff;
    border: 1px solid #ddd;
    color: #666;
}

.login_btn4 {
    background:#000;
    border:1px solid #000;
    color:#fff;
}

.login_box ul li.txt1 {
    color: #999;
    font-size: 13px;
    cursor: pointer;
}

.login_box ul li label {
    font-weight: 400;
    color: #333;
}

.login_box ul li.txt2 {
    font-weight: 600;
    color: #666;
    cursor: pointer;
}

.login_footer {
    border-top: 1px solid #ccc;
    text-align: center;
    padding: 20px 0;
    color: #666;
}

.join_table {
    width: 60%;
    margin:30px auto;
    border-bottom: 1px solid #ddd;
}

.join_table tr td {
    padding-bottom: 10px;
}

.join_table tr th {
    width: 90px;
    padding-bottom: 10px;
}

.btn_join {
    background-color: #e877ae;
    border: none;
    color: #fff;
    padding: 12px 30px;
    border-radius:5px;
    width:60%;
}

.btn_join1 {
    background-color: #fff;
    border: 1px solid #999;
    color: #333;
    padding: 6px 0;
    width: 100px;
    border-radius:5px;
    font-size:14px;
}

.join_table span {
    font-size: 12px;
    color: #aaa;
}

.phone_chk {
    color:#ea4673 !important;
}

.join_info_table {
    width: 60%;
    margin:0 auto;
    font-size: 14px;
    border-bottom: 1px solid #ddd;
}

.join_info_table tr th {
    background-color: #ebebeb;
    padding: 10px 15px;
    text-align: center;
    color: #666;
}

.join_info_table tr td {
    padding: 10px;
    color: #999;
    word-break:keep-all;
    text-align:center;
}

.join_ul {
    font-size: 13px;
    width:60%;
    margin:30px auto;
}

.join_ul li {
    padding: 3px 0;
}

.join_ul li a {
    text-decoration: underline;
    color: #4b8dc0;
    font-weight: normal;
    cursor: pointer;
}

.find_table {
    margin: 0px auto;
    margin-top:30px;
    min-height:150px;
}

.find_table > li {
    display:table;
    margin:0 auto;
}

.find_table > li > ul {
}

.find_table > li > ul > li:first-child {
    display:table-cell;
    width:120px;
    font-weight:500;
}

.find_table > li > ul > li:last-child {
    display:table-cell;
    width:320px;
}

.fint_table > li > ul > li > input {
    width:185px;
}

.find_table2 {
    margin: 0px auto;
    margin-top:30px;
    min-height:150px;
}

.find_table2 > li {
    display:table;
    margin:0 auto;
}

.find_table2 > li > ul {
}

.find_table2 > li > ul > li:first-child {
    display:table-cell;
    width:300px;
    font-weight:500;
}

.find_table2 > li > ul > li:last-child {
    display:table-cell;
    width:100px;
}

.find_table_text {
    font-size:14px;
    color:#999;
    margin-top:5px;
}

.find_email_form {
    display: none;
}

.find_hp_form {
    display: none;
}

.inlive_dj_box .txt1 {
    font-weight: 600;
}

.inlive_dj_box .txt2 {
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 20px;
}

.inlive_dj_box .txt3 {
    color: #666;
    word-break:keep-all;
}

.inlive_dj_table {
    width: 100%;
    color: #666;
    margin: 0 auto;
}

.inlive_dj_table2 {
    color: #666;
    margin: 0 auto;
}

.inlive_dj_table tr {
    border-bottom:1px solid #eee;
}

.inlive_dj_table tr td {
    padding: 5px;
}

.inlive_dj_table tr td.txt1 {
    width: 90px;
}

.inlive_dj_table tr td.txt2 {
}

.inlive_dj_table tr td.txt3 {
    width: 100px;
}

.inlive_dj_table tr td ul li {
    padding:3px 0;
    line-height:22px;
    text-indent:-10px;
    margin-left:-14px;
}

.inlive_dj_table2 tr th {
    width: 140px;
    line-height: 53px;
}

.inlive_dj_table2 tr td {
    color: #999;
    padding: 5px;
}

.inlive_dj_table2 ul.radio_btn li {
    float: left;
    margin-right: 50px;
}

.broad_step ul li {
    width:50%;
    float:left;
    padding:0 10px;
    margin-bottom:20px;
    text-align:center;
}

.broad_step ul li img {
    width:100%;
    max-width:700px;
}

.broad_popup {
    padding: 20px;
}

.broad_popup p {
    font-weight: 500;
}

.out_notice li {
    background: url('/images/bullet.png') left top no-repeat;
    padding-left: 30px;
    margin: 10px 0;
    color: #666;
}

.out_broad {
    display: inline-block;
    border: 1px solid #e9e9e9;
    background: #f9f9f9;
    padding: 20px;
    width: 100%;
}

.out_broad li {
    display: table-cell;
}

.out_broad li:after {
    content: "|";
    padding: 0 10px;
}

.out_broad li:last-child:after {
    content: none;
}

#radio-attribute {
    float: left;
    width: 100%;
    font-size: 16px;
}

#radio-attribute ul {
    list-style: none;
    float: left;
}

#radio-attribute a {
    color: #ffffff;
}

.radio-attribute img {
    padding: 2px;
}

.radio-attribute label > input {
    /* HIDE RADIO */
    visibility: hidden;
    /* Makes input not-clickable */
    position: absolute;
    /* Remove input from document flow */
}

.radio-attribute label > input + img {
    /* IMAGE STYLES */
    cursor: pointer;
    border: 2px solid transparent;
}

.radio-attribute label > input:checked + img {
    /* (RADIO CHECKED) IMAGE STYLES */
    border: 2px solid #f00;
}

.radio-attribute span {
    font-weight: bold;
}

.radio-attribute li {
    display: inline-block;
    padding-right: .5em;
    text-align: center;
    color: #000000;
    float: left;
}

#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg:hover {
    opacity: 0.7;
}

.board_info {
    font-size: 12px;
    margin-top: 10px;
    display:inline-block;
}

.board_info span {
    color: #E03629;
}

.img_td .sample_img {
    margin-right: 10px;
    float: left;
    width: 100%;
}

.camera_icon {
    margin: 5px 0;
}

.request_box {
    padding: 30px 300px;
}

.request_box ul li {
    font-size: 15px;
    line-height: 23px;
}

.origin_sub_title {
    font-size: 18px;
    font-weight: 600;
}

.search_cnt {
    color: #ff0606;
}

.origin_img_wrap {
    float: left;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 20px;
    cursor:pointer;
}

.party_notice_box {
    z-index: 6;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    position: absolute;
    background-color: #f5f5f5;
    width: 50px;/*50~250*/
    height: 50px;
    top: 180px;
    right: 0px;
    padding-top: 2px;
    display: none;
    cursor: pointer;
}

.instation_party_thumbs_up {
    margin-right:16px;
    color: #ffb100;
    position: relative;
    top: -7px;
    cursor: pointer;
}

.instation_party_thumbs_dn {
    margin-left:16px;
    color: #ababab;
    position: relative;
    top: -7px;
    cursor: pointer;
    transform: scaleX(-1);
}

.party_radar_canvas {
    top: 30px;
    z-index:5;
    opacity:0.9;
    position: relative;
    left: calc(50% - 190px);
    width: 380px;
    height: 380px;
}

.instation_party_good {
    position: absolute;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, .8);
    /*
    color: #ffb100;
    cursor: pointer;
    left: 31px;
    top: 31px;
    font-size: 60px;
    width: 90px;
    height: 90px;
    */
    font-size: 40px;
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.party_talk_body {
    display: none;
    position: absolute;
    z-index: 5;
    bottom: 0;
    left: 0;
    margin-top:20px;
    height:54px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    width: 100%;
    background: rgba(8, 8, 8, 0.9);
}

.party_talk_ctrl {
    width: calc(100% - 5px);
    height: 220px;
}

.party_talk_topbar {
    width: 100%;
    height:54px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.party_talk_topbar_title {
    position: absolute;
    width: calc(100% - 50px);
    left: 0px;
    display: flex;
    align-items: center;
}

.party_talk_topbar_title_img {
    margin: 0px 10px 0px 10px;
    width: 36px;
    height: 36px;
    overflow: hidden;
    border-radius: 50%;
    float: left;
}

.party_talk_topbar_title_img > img {
    width: 36px;
    height: 36px;
}

.party_talk_topbar_title_txt {
    padding: 6px 0;
    cursor: pointer;
}

.party_talk_row {
    clear: left;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

.party_talk_sw {
    position: absolute;
    width: 50px;
    text-align: center;
    right: 0px;
    font-size: 16px;
    padding: 0px 0px 6px 0px;
    cursor: pointer;
}

.party_talk_send_btn {
    padding: 16px 20px;
    color: #e76f9c;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 20px;
    background: rgba(72, 72, 72, 0.5);
    margin: 0px 10px 0px 10px;
    cursor: pointer;
}

.party_talklist_ctrl {
    width: calc(100% - 5px);
    height: 254px;
}

.party_talklist_group_btn {
    border: 1px solid #e1e1e1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    overflow: hidden;
    border-radius: 20px;
    float: left;
    color: #e1e1e1;
    font-size: 13px;
    cursor:  pointer;
}

.party_talklist_group_btn.btntype1 {
    margin: 0px 5px 0px 10px;
    padding: 0 10px;
}

.party_talklist_group_btn.btntype2 {
    margin: 0px 5px 0px 0px;
    padding: 0 15px;
}

.party_talklist_group_btn.btntype3 {
    margin: 0px 5px 0px 0px;
    padding: 0 10px;
}

.party_talklist_group_btn.btntype4 {
    margin: 0px 5px 0px 0px;
    padding: 0 15px;
}

.party_talklist_group_btn.btntype5 {
    margin: 0px 7px 0px 0px;
    padding: 0 10px;
}

.party_talklist_grouptype {
    margin: 0px 10px 0px 5px;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    overflow: hidden;
    border-radius: 20px;
    float: left;
    color: #efefef;
    font-size: 13px;
}

.party_talklist_grouptype.color1 {
    background-color: #383838;
}

.party_talklist_grouptype.color2 {
    background-color: #ad7c00;
}

.party_talklist_grouptype.color3 {
    background-color: #c55b8f;
}

.party_talklist_grouptype.color4 {
    background-color: #408c52;
}

.party_talklist_grouptype.color5 {
    background-color: #4c698c;
}

.party_talklist_body {
    display: none;
    position: absolute;
    z-index: 6;
    bottom: 0;
    left: 0;
    margin-top:20px;
    height:354px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    width: 100%;
    background: rgba(8, 8, 8, 1.0);
}

.party_talklist_tab_body {
    width: 100%;
    height:54px;
    display: flex;
    align-items: center;
}

.party_talklist_tab {
    width: calc(100% - 60px);
    float: left;
    background: rgb(46 46 46);
    padding: 5px;
    margin: 5px;
    border-radius: 10px;
}

.party_talklist_row {
    clear: left;
    margin-bottom: 15px;
}

.party_talklist_sw {
    width: 50px;
    text-align: center;
    float: right;
    font-size: 16px;
    padding: 0px 0px 6px 0px;
    cursor: pointer;
}

.party_talklist_option {
    border: 1px solid #e1e1e1;
    border-radius: 20px;
    height: 26px;
    font-size: 13px;
    margin-right: 8px;
    padding: 3px 6px;
    float: left;
    cursor: pointer;
}

.party_talklist_info_txt {
    padding: 16px 20px;
    color: #e76f9c;
    font-size: 13px;
}

.intalk_title {
    font-size:16px;
    font-weight:600;
}

.intalk_wrap {
    width:100%;
    display:flex;
    position:relative;
    height:100%;
    overflow:hidden;
    border: 1px solid #eee;
}

.intalk_cover_title {
    width:80px;
}

.intalk_cover_arrow {
    display:table-cell;
    padding-left:5px;
}

.intalk_write_box {
    border:1px dashed #ddd;
    width:340px;
    height:340px;
    margin:10px auto;
    border-radius:15px;
    resize:none;
    display:block;
    position:relative;
    overflow:hidden;
}

.intalk_write_box:before {
    position:absolute;
    content:'';
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.15) !important;
}

.intalk_write_textarea {
    position:absolute;
    background:none;
    resize:none;
    border:none;
    width:100%;
    height:100%;
    padding:10px;
    color:#fff;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.intalk_write_textarea::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

textarea.intalk_write_textarea::-webkit-input-placeholder {
    color: #fff;
}

textarea.intalk_write_textarea:-moz-placeholder { /* Firefox 18- */
    color: #fff;
}

textarea.intalk_write_textarea::-moz-placeholder {  /* Firefox 19+ */
    color: #fff;
}

textarea.intalk_write_textarea:-ms-input-placeholder {
    color: #fff;
}

.color_orange {
    background:#FDB430;
    color:#fff;
}

.color_green {
    background:#18AD63;
    color:#fff;
}

.color_blue {
    background:#3B95FA;
    color:#fff;
}

.color_violet {
    background:#885AFA;
    color:#fff;
}

.color_pink {
    background:#FF9090;
    color:#fff;
}

.color_gray {
    background:#666;
    color:#fff;
}

.intalk_wrap_bg {
    width:45%;
    float:left;
}

.intalk_left {
    width:50%;
    height:100%;
    float:left;
    border-right:1px solid #ddd;
}

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

.intalk_list_btn:hover {
    cursor:pointer;
}

.intalk_color_bg {
    width:100%;
    height:500px;
    display:inline-block;
}

.intalk_color_img_bg {
    width:100%;
}

.intalk_color_img_bg img {
    width:100%;
    height:100%;
}

.intalk_thumb_txt {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    color:#fff;
    font-size:13px;
    z-index:3;
    width: 60%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
}

.intalk_img_wrap {
    height:auto;
    border-right:1px solid #ddd;
}

.intalk_cover_color {
    width:320px;
    margin:10px auto;
    position:relative;
    vertical-align:middle;
    display:table;
}

.intalk_cover_color span {
    vertical-align:middle;
    display:table-cell;
    padding-right:10px;
}

.listen_right2 {
    width:50%;
    height:100%;
    float:left;
    position:relative;
}

.intalk_img {
    position:relative;
    max-height:500px;
    overflow:hidden;
    height:100%;
    max-width:100%;
    margin:0 auto;
}

.intalk_img:after {
    content:'';
    background:rgba(0,0,0,.3);
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
}

.intalk_list_wrap {
    border-top:1px solid #ddd;
}

.intalk_list_title {
    position:relative;
}

.intalk_list_txt {
    position:absolute;
    z-index:3;
    top:45%;
    left:50%;
    height:45px;
    width:70%;
    text-align:center;
    overflow:hidden;
    transform:translate(-50%, -50%);
    color:#fff;
    word-break:break-all;
}

.intalk_txt {
    position:absolute;
    top:40%;
    left:50%;
    color:#fff;
    z-index:2;
    width:80%;
    transform:translate(-50%, -50%);
    text-align:center;
    font-size:16px;
    word-break:break-all;
    overflow:hidden;
}

.intalk_user {
    position:absolute;
    bottom:30px;
    width:100%;
    z-index:2;
    color:#fff;
}

.intalk_icon {
    margin-left:25px;
    margin-top:15px;
}

.intalk_icon li {
    font-size:15px;
    float:left;
}

.intalk_icon li:hover {
    cursor:pointer;
}

.intalk_icon li:first-child {
    margin-right:30px;
}

.intalk_icon li:nth-child(2) {
    margin-right:30px;
}

.intalk_icon li:last-child {
    position:absolute;
    right:30px;
}

.intalk_icon img {
    width:25px;
}

.intalk_gift:hover{
    cursor:pointer;
}

.intalk_list_title h2 {
    font-size:15px;
    padding:15px 10px;
    border-bottom:1px solid #ddd;
}

.intalk_list_title h2 span {
    font-size:14px;
    font-weight:400;
    color:#999;
    float:right;
}

.intalk_list_title h2 span b {
    color:red;
}

.intalk_btn_wrap {
    padding:30px 10px;
    position:relative;
}

.intalk_btn_wrap > ul {
    position:absolute;
    right:10px;
    top:10px;
}

.intalk_btn_wrap > ul > li {
    text-align:center;
    width:40px;
    float:left;
    margin:0 7px;
}

.intalk_btn_wrap > ul > li > span {
    width:40px;
    height:40px;
    line-height:40px;
    border:1px solid #ddd;
    display:inline-block;
    border-radius:50%;
    text-align:center;
    background:#fff;
}

.intalk_btn_wrap ul li.intalk_btn {
    font-size:13px;
}

.intalk_btn_wrap ul li.intalk_btn:hover {
    cursor:pointer;
}

.intalk_list {
    padding:10px;
}

.intalk_accept {
    /*background:#fdfdfd;*/
    padding:10px;
    border-top:1px solid #ddd;
    border-bottom:1px solid #ddd;
}

.intalk_accept h2 {
    font-size:17px;
    padding:10px 0;
    color:#e877ae;
    position:relative;
}

.intalk_accept h2 span {
    color:#999;
}

.intalk_check_icon {
    position:absolute;
    right:10px;
    top:55px;
    color:#666;
    font-size:13px;
}

.intalk_check_icon img {
    width:20px;
}

.record_wrap {
    background:#f9f9f9;
    width:100%;
}

.record_wrap .record_box {
    padding:15px 0 0 15px;
    text-align:center;
    display:inline-block;
    width:100%;
}

.record_wrap .record_box ul li.record_time {
    color:red;
    font-size:16px;
    font-weight:500;
}

.record_wrap .record_box ul {
    float:left;
    width:calc(100% - 200px);
}

.intalk_record_btn {
    float:left;
    padding:7px 25px;
    background:#e877ae;
    color:#fff;
    border-radius:5px;
    margin-top:5px;
    margin-right:10px;
    font-size:13px;
}

.intalk_record_btn2 {
    float:left;
    padding:6px 25px;
    background:#fff;
    color:#666;
    border:1px solid #ddd;
    border-radius:5px;
    margin-top:5px;
    font-size:13px;
}

.intalk_heart_icon {
    position:absolute;
    top:10px;
    left:10px;
    z-index:3;
    color:#fff;
    font-size:13px;
}

.record_txt {
    font-size:13px;
}

.intalk_heart_icon img {
    width:auto;
    position:initial;
}

.current_list {
    background:#f9f9f9;
}

.dubbing_list {
    background:#3f515f;
}

.dubbing_list img {
    width:100%;
    height:100%;
}

.origin_txt_wrap {
    float: left;
    width: 300px;
    padding: 15px 0 0 15px;
}

.origin_area {
    font-size: 15px;
    font-weight: 500;
    color: #e877ae;
}

.agree h2 {
    font-size: 17px;
    font-weight: 600;
}

.agree > ul {
    padding: 20px;
    background: #f9f9f9;
}

.origin_questions {
    font-size: 17px !important;
    font-weight: 600;
    margin-bottom: 10px;
}

.origin_title {
    display: inline-block;
    width: 100%;
    font-weight: 500;
    font-size: 18px;
    height: 55px;
    cursor:pointer;
    word-break:keep-all;
}

.origin_title:hover {
    cursor:pointer;
    text-decoration:underline;
}

.hashtag-item {
    width: 46%;
    float: left;
    margin-right: 4%;
    margin-bottom: 30px;
}

.hash-item2 {
    width: 50%;
    float: left;
}

.charge-item .txt1 {
    margin-bottom: 5px;
}

.charge-item .txt2 {
    font-size: 19px;
    font-weight: 600;
    margin-bottom: 10px;
    text-align: center;
}

.my_cash {
    width: 100%;
    background: url('/images/cash_bg.png');
    padding: 15px 0;
    font-size: 18px;
    /*margin-bottom: 30px;*/
}

.my_cash span.cash_txt {
    color: #C14844;
    font-weight: 600;
    font-size: 20px;
}

.my_cash .cash_bg {
    background: #fff;
    width: 97%;
    /*height: 80px;*/
    /*line-height: 80px;*/
    display: inline-block;
    font-size: 16px;
    padding: 5px;
}

.cash_info {
    color: #828282;
    font-weight: 600;
    margin-bottom: 30px;
}

.cash_btn {
    width: 100%;
    margin-bottom: 20px;
}

.cash_btn_wrap {
    width:100%;
    display:inline-block;
}

.cash_more_btn {
    font-weight: 600;
    color: #828282;
    cursor: pointer;
    float: right;
    display:inline-block;
}

.charge_list_ul {
    display: inline-block;
    clear: both;
    width: 100%;
}

.charge_list_ul li {
    float: left;
    margin-right: 20px;
    cursor: pointer;
}

.cash_end {width:100%;
    padding:30px 20px;
    /*background:#f9f9f9;*/
    border:2px solid #ddd;
    text-align:center;
    font-size:20px;
    font-weight:600;
}

.cash_end p{
    font-size:15px;
    color:#666;
    font-weight:300;
}

.cash_tbl {
    width:100%;
    border-top:2px solid #666;
}

.cash_tbl > th, td{
    height:50px;
}

.cash_tbl th {
    text-align:center;
    background:#f9f9f9;
}

.cash_tbl td {
    text-indent:30px;
}

.cash_end span {
    color:#a80000;
}

.point_txt {
    font-size: 16px;
    font-weight: 800;
}

.point_info {
    background-color: #f9f9f9;
    padding: 30px;
    font-size: 15px;
    color: #666;
}

.color-7c73f3 {
    color: #7c73f3;
}

.excharge_ex {
    font-size: 12px;
}

.excharge_table1 {
    width: 100%;
}

.excharge_table1 th {
    width: 110px;
    padding: 5px 0;
}

.excharge_table1 td {
    padding: 5px 0;
}

input[type=text].input_hp {
    width: 70px;
}

.my_left {
    width: 60%;
    float: left;
}

.my_profile {
    width: 100%;
    padding: 23px;
    clear: both;
    display: table;
    position: relative;
}

.my_profile_img {
    border: 1px solid #eee;
    border-radius: 50%;
    width: 70px;
    height: 70px;
    overflow: hidden;
    margin-right: 25px;
    float: left;
}

.my_profile_img img {
    width: 100%;
}

.profile_modal_btn {
    width:100%;
    display:inline-block;
    border:1px solid #ddd;
    border-radius:5px;
    overflow:hidden;
    margin-top:10px;
}

.profile_modal_btn li  {
    float:left;
    width:50%;
    text-align:center;
}

.profile_modal_btn li.log {
    padding:5px 0;
}

.profile_modal_btn li:hover {
    background:#f9f9f9;
    cursor:pointer;
}

.profile_modal_btn li.follow {
    border-left:1px solid #ddd;
}

.my_profile_txt {
    display:inline-block;
}

.my_profile_txt ul li:first-child {
    font-size: 18px;
    font-weight:600;
}

.my_profile_txt ul li:last-child {
    margin-top: 15px;
    display:inline-block;
}

.my_profile_txt ul li:last-child > p {
    float: left;
    margin-right: 20px;
    color: #666;
}

.my_profile_txt ul li:last-child > p:last-child {
    margin: 0;
}

.my_profile_txt ul li:last-child > p span {
    font-size: 16px;
    font-weight: 600;
    color: #222;
    border-bottom: 1px solid #333;
}

.profile_modify_icon {
    position: absolute;
    top: 0;
    right: 0;
    padding: 10px;
    margin: 20px;
    cursor: pointer;
}

.my_page_ul li {
    border-bottom: 1px solid #eee;
    line-height: 60px;
    display: table;
    width: 100%;
    padding: 0 20px;
    font-weight:500;
}

.my_page_ul li:hover {
    background:#f9f9f9;
}

.my_page_ul li span.my_link {
    color:#e877ae;
}

.my_page_ul li span.my_link:hover {
    text-decoration:underline;
}

.my_page_ul li span.my_page_icon {
    width:30px;
    display:inline-block;
}

.my_page_ul li span.friends {
    float:right;
    color:#aaa;
    font-weight:400;
}

.invite_page {
    margin-top:20px;
    background:#f9f9f9;
    padding:15px;
    font-size:13px;
    text-align:left;
}

.invite_page h2 {
    font-size:18px;
}

.invite_box {
    padding: 10px;
    width:310px;
    margin: 30px auto;
    text-align: center;
}

.invite_box ul {
    margin-bottom: 30px;
}

.invite_box ul li {
    margin-bottom: 10px;
}

.invite_box ul li.logo_wrap {
    margin-bottom: 30px;
}

.invite_box ul li button {
    width: 100%;
    padding: 8px 0;
    border-radius: 5px;
    cursor: pointer;
}

.invite_txt {
    position:relative;
    max-width:800px;
    width:100%;
    margin:30px auto;
}

.invite_txt h2 {
    font-size:18px;
}

.invite_wrap {
    width:800px;
    margin:20px auto;
    padding:30px;
    background:#f9f9f9;
    border-radius:10px;
    position:relative;
}

.invite_wrap h2 {
    font-size:18px;
}

.invite_wrap_list {
    margin-top:10px;
}

.invite_wrap_list li {
    padding:3px 0;
}

.invite_wrap_list li span {
    background:linear-gradient(to top, yellow 50%, transparent 50%)
}

.invite_btn_wrap {
    position:absolute;
    right:10px;
    top:50%;
}

.my_profile_title {
    font-size: 18px;
}

.no_contents {
    text-align:center;
    padding:30px 0;
}

.m_my_list {
    width: 41%;
    float: right;
}

.user_list {
    border: 1px solid #ddd;
}

.my_profile_title2 {
    font-weight: 600;
    padding: 15px 10px;
    border-bottom: 1px solid #ddd;
    display: table;
    font-size: 16px;
    clear: both;
    width: 100%;
    background: #f9f9f9;
}

.ttiring_pic_wrap {
    position:relative;
}

.ttiring_pic_wrap span.log_profile_img {
    width: 70px;
    height: 70px;
    display: inline-block;
    overflow:hidden;
    border-radius: 50%;
}

.ttiring_pic_wrap img {
    width: 100%;
}

.ttiring_pic_wrap img {
    width:100%;
}

.ttiring_level {
    position:absolute;
    width:73px;
    height:87px;
    z-index:4;
    left:calc(50% - 36px);
    top:-1px;
}

.ttiring_level > span {
    position:absolute;
    width:auto;
    height:auto;
    display:initial;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:13px;
    transform:translate(-50%, 0);
}

.ttiring_signal_off
{
    height: 54px;
    display: none;
}

.ttiring_refuse_btn {
    position: absolute;
    left: 50px;
    bottom: 20px; cursor:pointer;
}

.ttiring_hangup_btn {
    position: absolute;
    left: calc(50% - 30px);
    bottom: 20px;
    cursor:pointer;
}

.ttiring_accept_btn {
    position: absolute;
    right: 50px;
    bottom: 20px;
    cursor:pointer;
}

.ttiring_level  > img {
    width:100%;
}

.ttiring_signal {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin: 1em;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}
.ttiring_signal,
.ttiring_signal:before,
.ttiring_signal:after {
    animation: 1s infinite ease-in-out;
}
.ttiring_signal:before,
.ttiring_signal:after {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
}
.ttiring_signal:before,
.ttiring_signal:after {
    content: '';
    background-color: #333;
    transform: scale(0);
    animation: ttiring_signal 1.5s infinite ease-in-out;
}
.ttiring_signal:after { animation-delay: 0.75s; }
@keyframes ttiring_signal {
    0%   { transform: translateX(-100%) scale(0); }
    33%  { transform: translateX(0%)    scale(1); }
    100% { transform: translateX(100%)  scale(0); }
}

.ttiring_user_info {
    z-index: 1041;
    position: absolute;
    left: calc(50% - 140px);
    top: 158px;
    width: 280px;
    height: 60px;
    max-width: 400px;
    color: #fff;
    font-size: 14px;
    margin-top: 6px;
    padding: 10px;
    border-radius: 5px;
    background: rgba(8, 8, 8, 1);
    display: none;
}

.room_ttiring_user_nick {
    font-size: 12px;
    float: right;
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 3px;
}

.room_ttiring_user_status {
    font-size: 12px;
    color: #ff6599;
    font-weight:bold;
    line-height: 30px;
    position: relative;
    left: 3px;
}

.level_bg_wrap {
    width: 100%;
    padding:15px;
    background: url('/images/cash_bg.png');
    font-size: 18px;
    margin-bottom: 30px;
}

.level_bg {
    background:#fff;
    padding:15px;
    display:inline-block;
    width:100%;
}

.level_bg h2 {
    font-size:16px;
    color:#666;
}

.level_bg h2 span {
    color:red;
}

.level_wrap {
    max-width:1000px;
    width:100%;
    margin:0 auto;
    padding:30px 0;
    display:flex;
}

.level_img_wrap {
    margin-left:20px;
}

.level_img {
    float:left;
    position:relative;
}

.level_nick {
    margin-left:10px;
    float:left;
    width:200px;
    margin-top:6px;
}

.level_nick ul li:first-child {
    font-size:15px;
    font-weight:500;
}

.level_nick ul li:nth-child(2) {
    font-size:14px;
    color:#999;
}

.level_bar_wrap {
    float:left;
    position:relative;
}

.level_q {
    font-size:14px;
    font-weight:600;
    text-align:center;
    margin-bottom:5px;
    display:inline-block;
    width:100%;
}

.level_q span.studio_level_exp {
    background:#fff;
    color:#222;
    font-size:12px;
    border-radius:3px;
    padding:0 3px;
    font-weight:300;
}

.level_q span.studio_level_icon {
    margin-right:30px;
    display:inline-block;
}

.level_q span.studio_level_icon img {
    width:30px;
    /*vertical-align:bottom;*/
    margin: 0px 5px;
}

.level_bar_wrap ul {
    width:100%;
}

.level_bar_wrap ul li {
    position:absolute;
    font-size:12px;
}

.level_bar_wrap ul li:first-child {
    left:0;
}

.level_bar_wrap ul li:nth-child(2) {
    left:50%;
    transform:translate(-50%, 0%);
}

.level_bar_wrap ul li:last-child {
    right:0;
}

.level_bar {
    position:relative;
    width:470px;
    height:13px;
    border:1px solid #666;
    display:inline-block;
    border-radius:10px;
    overflow:hidden;
}

.level_img > span {
    border: 1px solid #eee;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    overflow: hidden;
    margin-right: 25px;
    display:inline-block;
}

.level_img > span > img {
    width:100%;
}

.level_border {
    position:absolute;
    top:0;
    left:0;
    width:45px;
    height:55px;
    z-index:4;
}

.level_border span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border img {
    width:100%;
}

.level_border_top {
    position:absolute;
    top:0px;
    left:0;
    width:40px;
    height:49px;
    z-index:4;
}

.level_border_top span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_top img {
    width:100%;
}

.level_border_cj {
    position:absolute;
    top:-1px;
    left:-1px;
    width:52px;
    height:62px;
    z-index:4;
}

.level_border_cj span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:12px;
    transform:translate(-50%, 0);
}

.level_border_cj img {
    width:100%;
}

.live_item_booster {
    position: absolute;
    bottom: 70px;
    left: calc(50% - 128px);
    margin: auto;
    width: 256px;
    z-index: 5;
    text-align: center;
    animation: live_item_booster_fire 1s;
    display: none;
}

@keyframes live_item_booster_fire {
    0% { transform:translate(0,0) }
    10% { transform:translate(10px,0) }
    20% { transform:translate(0,0) }
    30% { transform:translate(10px,0) }
    40% { transform:translate(0,0) }
    50% { transform:translate(10px,0) }
    60% { transform:translate(0,0) }
    70% { transform:translate(10px,0) }
    80% { transform:translate(0,0) }
    90% { transform:translate(10px,0) }
    100% { transform:translate(0,0) }
}

.level_border_chat {
    position:absolute;
    top:-1px;
    left:-1px;
    width:42px;
    height:51px;
    z-index:4;
}

.level_border_chat_line {
    width:32px !important;
    height:41px !important;
}

.level_border_chat span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_chat img {
    width:100%;
}

.level_border_list {
    position:absolute;
    top:0px;
    left:0;
    width:40px;
    height:49px;
    z-index:4;
}

.level_border_list span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_list img {
    width:100%;
}

.level_border_in {
    position:absolute;
    top:-1px;
    left:0;
    width:46px;
    height:55px;
    z-index:4;
}

.level_border_in span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_in img {
    width:100%;
}

.level_border_foll {
    position:absolute;
    top:0px;
    left:0;
    width:45px;
    height:55px;
    z-index:4;
}

.level_border_foll span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_foll img {
    width:100%;
}

.level_border_rank {
    position:absolute;
    top:-1px;
    left:0;
    width:46px;
    height:56px;
    z-index:4;
}

.level_border_rank span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_rank img {
    width:100%;
}

.level_border_cj_modal {
    position:absolute;
    top:0px;
    left:0;
    width:51px;
    height:61px;
    z-index:4;
}

.level_border_cj_modal > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:11px;
    transform:translate(-50%, 0);
}

.level_border_cj_modal img {
    width:100%;
}

.level_border_studio {
    position:absolute;
    top:0px;
    left:0;
    width:70px;
    height:83px;
    z-index:4;
}

.level_border_studio span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:13px;
    transform:translate(-50%, 0);
}

.level_border_studio img {
    width:100%;
}

.level_border_broad_top {
    position:absolute;
    top:-1px;
    left:-1px;
    width:52px;
    height:62px;
    z-index:4;
}

.level_border_broad_top > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:12px;
    transform:translate(-50%, 0);
}

.level_border_broad_top > span > img {
    width:100%;
}

.level_border_broad_rank {
    position:absolute;
    top:-1px;
    left:-1px;
    width:73px;
    height:87px;
    z-index:4;
}

.level_border_broad_rank > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:15px;
    transform:translate(-50%, 0);
}

.level_border_broad_rank > span > img {
    width:100%;
}

.level_border_broad_rank2 {
    position:absolute;
    top:0px;
    left:0px;
    width:40px;
    height:49px;
    z-index:4;
    float:none !important;
    padding:0 !important;
}

.level_border_broad_rank2 > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:11px;
    -webkit-transform:scale(0.93) translate(-55%, 0);
}

.level_border_broad_rank2 > span > img {
    width:100%;
}

.level_border_left {
    position:absolute;
    top:0px;
    left:0;
    width:36px;
    height:44px;
    z-index:4;
}

.level_border_left > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:scale(0.93) translate(-55%, 0);
}

.level_border_left img {
    width:100%;
}

.level_border_my {
    position:absolute;
    top:23px;
    left:23px;
    width:71px;
    height:86px;
    z-index:4;
}

.level_border_my > span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:14px;
    transform:translate(-50%, 0);
}

.level_border_my  > img {
    width:100%;
}

.level_border_log {
    position: absolute;
    top: -1px;
    left: -1px;
    width: 93px;
    height: 108px;
    z-index: 4;
}

.level_border_log > span {
    position:absolute;
    width:auto;
    height:auto;
    display:initial;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:13px;
    transform:translate(-50%, 0);
}

.level_border_log  > img {
    width:100%;
}

.level_border_log2 {
    position:absolute;
    top:0px;
    left:0px;
    width:46px;
    height:55px;
    z-index:4;
}

.level_border_log2 > span {
    position:absolute;
    width:auto;
    height:auto;
    display:initial;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_log2  > img {
    width:100%;
}

.level_border_sch {
    position:absolute;
    top:-1px;
    left:0;
    width:46px;
    height:56px;
    z-index:4;
}

.level_border_sch span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    line-height:normal;
    font-size:10px;
    transform:translate(-50%, 0);
}

.level_border_sch img {
    width:100%;
}

.level_txt_wrap {
    padding: 30px;
    font-size: 15px;
    color: #666;
}

.level_txt_wrap h2 {
    font-size:16px;
    color:#333;
    font-weight:600;
}

.level_txt ul.level_list {
}

.level_txt ul.level_list > li {
    position:relative;
    margin:2px 0;
    display:inline-block;
    width:100%;
    background:#f9f9f9;
    border:1px solid #ddd;
    border-radius:5px;
    overflow:hidden;
}

.level_txt ul.level_list > li > ul > li:first-child {
    float:left;
    margin-right:0;
    width:232px;
    font-weight:600;
    font-size:14px;
    background:#fff;
    padding:7px 10px;
}

.level_txt ul.level_list > li > ul > li > span.txt1 {
    font-size:12px;
    color:#999;
    margin-left:5px;
    font-weight:500;
}

.level_txt ul.level_list > li > ul > li > span.txt2 {
    color:#e877ae;
    font-weight:600;
}

.level_txt ul.level_list > li > ul > li:nth-child(2) {
    float:left;
    font-size:14px;
    padding:7px 15px;
}

.level_grade {}

.level_grade > ul {
    width:150px;
    margin:0 auto;
}

.level_grade > ul > li {
    margin-bottom:10px;
    width:100%;
    display:inline-block;
}

.level_grade > ul > li > ul > li:first-child {
    width:40px;
    float:left;
}

.level_grade > ul > li > ul > li:first-child img {
    width:100%;
}

.level_grade > ul > li > ul > li:nth-child(2) {
    float:left;
    margin-left:10px;
    text-align:center;
    margin-top:10px;
}

.level_grade2 {}

.level_grade2 > ul {
    width:290px;
    margin:0 auto;
}

.level_grade2 > ul > li {
    margin-bottom:10px;
    width:100%;
    display:inline-block;
}

.level_grade2 > ul > li > ul > li:first-child {
    width:40px;
    float:left;
}

.level_grade2 > ul > li > ul > li:first-child img {
    width:100%;
}

.level_grade2 > ul > li > ul > li:nth-child(2) {
    float:left;
    margin-left:10px;
    text-align:center;
    margin-top:10px;
    width:100px;
    font-weight:500;
    font-size:14px;
}

.level_grade2 > ul > li > ul > li:last-child {
    margin-top:10px;
    float:left;
    font-size:14px;
    color:#999;
}

.level_border2 {
    position:absolute;
    top:-10px;
    left:0;
    width:42px;
    line-height:normal;
    height:56px;
    z-index:222;
}

.level_border2 span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:10px;
    transform:translate(-50%, 0);
    font-family: 'Russo One', sans-serif;
}

.level_border2 img {
    width:100%;
}

.level_border3 {
    position:absolute;
    top:0px;
    left:0;
    width:51px;
    height:56px;
    z-index:222;
}

.level_border3 span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:10px;
    transform:translate(-50%, 0);
    font-family: 'Russo One', sans-serif;
}

.level_border3 img {
    width:100%;
}

.level_border4 {
    position:absolute;
    top:0px;
    left:25px;
    width:50px;
    height:56px;
    z-index:222;
}

.level_border4 span {
    position:absolute;
    bottom:0;
    left:50%;
    color:#fff;
    font-size:10px;
    transform:translate(-50%, 0);
    font-family: 'Russo One', sans-serif;
}

.level_border4 img {
    width:100%;
}

.achieve_list {
    width:800px;
    margin:30px auto;
}

.achieve_list ul li {}

.achieve_list h2 {
    font-size:16px;
    color:#666;
}

.achieve_list h2 span {
    color:red;
}

.achieve_list > ul > li  {
    display:inline-block;
    width:100%;
    margin-top:5px;
    border:none;
    background:#f9f9f9;
    padding:10px 20px;
    border-radius:40px;
    position:relative;
}

.achieve_list ul li ul li {
    float:left;
}

.achieve_list ul li ul li:first-child {
    margin-right:15px;
    margin-top:3px;
}

.achieve_list ul li ul li:first-child img {
    width:40px;
}

.achieve_list ul li ul li:nth-child(3) {
    margin-right:30px;
}

.achieve_list ul li ul li:nth-child(2) {
    float:left;
    margin-top:10px;
    margin-right:30px;
    font-size:13px;
    font-weight:600;
}

.achieve_list ul li ul li:nth-child(4) {
    position:absolute;
    right:130px;
    top:18px;
}

.achieve_list ul li ul li:last-child {
    position:absolute;
    right:40px;
    top:18px;
}

.achieve_list ul li ul li:nth-child(2) img {
    width:25px;
}

.achieve_list ul li ul li span.title {
    font-size:16px;
    font-weight:600;
    display:block;
}

.achieve_list ul li ul li span.condition {
    color:#999;
    font-size:14px;
    font-weight:400;
}


.myitem_list {
    width:800px;
    margin:30px auto;
}

.myitem_list ul li {}

.myitem_list h2 {
    font-size:16px;
    color:#666;
}

.myitem_list h2 span {
    color:red;
}

.myitem_list > ul > li  {
    display:inline-block;
    width:100%;
    margin-top:5px;
    border:none;
    background:#f9f9f9;
    padding:10px 20px;
    border-radius:40px;
    position:relative;
}

.myitem_list ul li ul li {
    float:left;
}

.myitem_list ul li ul li:first-child {
    margin-left:15px;
    margin-right:15px;
    margin-top:3px;
}

.myitem_list ul li ul li:first-child img {
    width:60px;
}

.myitem_list ul li ul li:nth-child(3) {
    margin-right:30px;
}

.myitem_list ul li ul li:nth-child(2) {
    float:left;
    margin-top:10px;
    margin-right:30px;
    font-size:13px;
    font-weight:600;
}

.myitem_list ul li ul li:nth-child(4) {
    position:absolute;
    right:130px;
}

.myitem_list ul li ul li:last-child {
    position:absolute;
    right:40px;
}

.myitem_list ul li ul li:nth-child(2) img {
    width:25px;
}

.myitem_list ul li ul li span.title {
    font-size:16px;
    font-weight:600;
    display:block;
}

.myitem_list ul li ul li span.condition {
    color:#999;
    font-size:12px;
    font-weight:400;
}


.day_achieve_list {
    width:100%;
    margin:0px auto;
    padding:0 15px;
}

.day_achieve_list ul li {}

.day_achieve_list h2 {
    font-size:16px;
    color:#333;
    text-align:center;
    margin-top:20px;
    margin-bottom:5px;
}

.day_achieve_list h3 {
    font-size:14px;
    color:#999;
    text-align:center;
}

.day_achieve_list h2 span {
    color:red;
}

.day_achieve_list > ul {
    display:inline-block;
    line-height:initial;
}

.day_achieve_list > ul > li  {
    display:inline-block;
    width:100%;
    margin-top:5px;
    border:2px solid #eee;
    padding:7px 12px;
    border-radius:10px;
    position:relative;
    line-height:initial;
}

.day_achieve_list ul li ul li {
    float:left;
}

.day_achieve_list ul li ul li:first-child img {
    width:18px;
}

.day_achieve_list ul li ul li:last-child {
    width:100%;
    display:block;
    margin-top:5px;
}

.day_achieve_list ul li ul li span.title {
    font-size:13px;
    font-weight:600;
    height:23px;
    margin-left:10px;
}

.day_achieve_list ul li ul li span.condition {
    color:#999;
    font-size:12px;
    font-weight:400;
    display:block;
    line-height:23px;
    padding-left:30px;
}

.day_notice {
    padding-bottom:10px;
}

.day_notice > li:before {
    position:absolute;
    content:'\f00c';
    font-family:'Font Awesome 5 Free';
    font-weight:600;
    text-indent:-15px;
}

.day_notice h2 {
    font-size:14px;
    text-align:left;
    padding-bottom:5px;
}

.day_notice li {
    font-size:12px;
    border:none !important;
    margin-top:0 !important;
    padding:0 0 0 18px !important;
    border-radius:0 !important;

}

.mission_btn  {
    width:100%;
    height:30px;
    background:#f9f9f9;
    border-radius:5px;
    border:none;
    font-size:12px;
    line-height:30px;
    display:inline-block;
}

.mission_btn span {
    color:#fa4427;
    font-weight:500;
}

.mission_btn_on {
    width:100%;
    height:30px;
    border-radius:5px;
    border:none;
    font-size:12px;
    line-height:30px;
    display:inline-block;
    color:#fff;
    background:#FA4427;
}

.btn_achi {
    padding:4px 10px;
    border-radius:15px;
    border:none;
    background:#fff;
    font-size:13px;
    border:1px solid #888;
}

.btn_achi:hover {
    background:#e877ae;
    border:1px solid #e877ae;
    color:#fff;
}

.btn_achi_on {
    padding:5px 18px;
    border-radius:15px;
    border:none;
    background:#e877ae;
    color:#fff;
    font-size:13px;
}


.btn_myitem {
    padding:4px 10px;
    border-radius:15px;
    border:none;
    background:#fff;
    font-size:13px;
    border:1px solid #888;
}

.btn_myitem:hover {
    background:#e877ae;
    border:1px solid #e877ae;
    color:#fff;
}

.btn_myitem_on {
    padding:5px 18px;
    border-radius:15px;
    border:none;
    background:#a1a1a1;
    color:#fff;
    font-size:13px;
}


.btn_myitem_topmenu {
    padding:4px 10px;
    border-radius:15px;
    border:none;
    background:#fff;
    font-size:13px;
    border:1px solid #888;
}

.btn_myitem_topmenu:hover {
    background:#b9b9b9;
    border:1px solid #b9b9b9;
    color:#fff;
}

.btn_myitem_topmenu_on {
    padding:4px 10px;
    border-radius:15px;
    border:none;
    background:#161616;
    color:#fff;
    font-size:13px;
}

.no_access {
    position:relative;
    background:#f9f9f9;
    text-align:center;
    padding:30px 0;
    min-height:320px;
    vertical-align:middle;
}

.no_access > .close {
    padding-right:20px;
}

.no_access_wrap {
    position:absolute;
    width:80%;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

.no_access .txt {
    padding-bottom:30px;
}

.no_access .txt img {
    width:100px;
}


.my_profile_title2 span {
    font-weight: normal;
    font-size:14px;
}

.follower_list {
    width: 100%;
    display: table;
    clear: both;
}

.follower_list li {
    padding: 10px 20px 15px 20px;
    clear: both;
    display: table;
    width: 100%;
    overflow: hidden;
}

.follower_list li.no_list {
    text-align:center;
    padding:30px 0;
}

.follower_list li span.foll_img {
    width: 45px;
    height: 45px;
    border: 1px solid #ddd;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    vertical-align: middle;
}

.follower_list li span img {
    width: 100%;
}

.follower_list li div {
    margin-right: 10px;
    display: inline-block;
}

.follower_list li div.follower_txt4 {
    float: right;
    margin-top: 8px;
    margin-right:0;
}

.follower_list_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.follower_list_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.follower_list_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.follower_list_scroll {
    overflow:auto;
    height:350px;
    visibility:hidden;
}

.follower_list_scroll-inner,
.follower_list_scroll:hover {
    visibility: visible;
}

.usermenu_whisperlist {
    display: block;
    bottom: 60px;
    left: 54px;
}

.user_option_modal {
    position: absolute;
    z-index: 10;
    background-color: #fff;
    box-shadow: 10px 10px 15px 0 rgba(7, 0, 2, 0.1);
    display: none;
    border: 1px solid #c4c5c8;
    border-radius: 10px;
}

.user_option_modal li {
    padding: 6px 15px;
    color: #999;
    cursor: pointer;
    font-size: 13px;
    border-radius: 10px;
}

.user_option_modal li:hover {
    background: #f8f9fb;
}

.user_option_modal li.modal_nick {
    text-align: center;
    color: #333;
    font-weight: 600;
    background: #fff;
    border-bottom: 1px dotted #ddd;
}

.charge_modal_txt1 {
    font-size: 16px;
    color: #999;
    display: inline-block;
    width: 100%;
    border-bottom: 2px solid #333;
}

.charge_modal_txt2 {
    float: right;
    font-size: 26px;
    color: #222;
}

.charge_txt {
    float: left;
    margin-top: 8px;
}

.charge_choice {
    clear: both;
    margin-top: 30px;
}

.charge_select_btn {
    width: 100%;
    background-color: #fff;
    padding: 15px;
    border: 2px solid #ddd;
    margin: 5px 0;
}

.charge_select_btn:hover {
    border: 2px solid #e877ae;
    color: #e877ae;
}

.music_modal_title {
    display: table;
    clear: both;
    width: 100%;
}

.report_modal_con {
    padding: 20px;
}

.report_modal_con ul li {
    padding: 5px 0;
}

.report_modal_title {
    padding: 10px;
    background-color: #eee;
}

.smallbt {
    border-radius:20px;
    padding:3px 15px;
}

.btn_follow1 {
    border:1px solid #e877ae;
    background:#e877ae;
    color:#fff;
}

.btn_following {
    border:1px solid #eee;
    background:#f9f9f9;
    color:#999;
}

.follower_modal2 {
    width: 400px;
    position: fixed;
    top: 25%;
    left: 50%;
    margin-left: -200px;
    z-index: 5;
    background-color: #fff;
    padding: 20px;
    display: none;
}

.follower_list li div {
    display:inline-block;
    margin-right:15px;
    vertical-align:middle;
}

.follower_list li .follower_txt1 {
    width: 20px;
    margin-right: 5px;
}

.follower_txt2 {
    position:relative;
}

.follower_txt2 span.follower_img {
    width:45px;
    height:45px;
    border:1px solid #ddd;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
    vertical-align:middle;
}

.follower_txt3 {
    font-size: 15px;
    width: calc(100% - 270px);
}

ul.display-none {
    display: none;
}

ul li.display-none {
    display: none;
}

.follower_list li .follower_txt4 {
    float: right;
    margin-top:8px;
}

.follower_txt2 img {
    width: 100%;
    height: 100%;
}

.modal_list {
    width: 100%;
    height: 360px;
    display: block;
}

.profile_table {
    width: 100%;
    margin-left:20px;
}

.profile_table td {
    height:70px;
}

.profile_wrap {
    background:#f9f9f9;
    display:block;
    width:70%;
    height:100%;
    padding:40px 50px;
    margin:30px auto;
}

.profile_box {
    padding: 20px 0;
    background:#fff;
}

.profile_pic_wrap {
    width: 174px;
    height: 174px;
    overflow: hidden;
    border: 1px solid #eee;
    border-radius: 50%;
    margin:0 auto;
}

.profile_pic_wrap img {
    width:100%;
}

.profile_modify_info {
    font-size: 12px;
    color: #aaa;
}

.profile_table2 {
    width: 100%;
}

.profile_table2 th {
    width: 100px;
    padding: 5px 0;
}

.profile_table2 td {
    padding: 5px 0;
}

.profile_table3 {
    width: 60%;
    margin:0 auto;
}

.profile_table3 th {
    width: 85px;
    padding: 5px 0;
}

.profile_table3 td {
    padding: 5px 0;
}

.profile_table4_wrap {
    margin-top:30px;
    padding:50px 30px;
    border-top:2px solid #666;
    border-bottom:1px solid #ddd;
    background:#f9f9f9;
}

.profile_table4 {
    width: 100%;
    margin:0 auto;
}

.profile_table4 th {
    width: 130px;
    padding: 5px 0;
}

.profile_table4 td {
    padding: 5px 0;
}

.withdrawal_box span.title {
    font-weight:600;
    margin:5px 0;
    display:block;
}

.withdrawal_box span.red {
    color:red;
}

.invoice_wrap {
    background:#f2f2f2;
    padding:50px 100px;
    max-width:1200px;
    margin:0 auto;
}

.intalk_box {
    background:#f2f2f2;
    padding:50px 100px;
    max-width:1000px;
    margin:0 auto;
}

.bg_setting {
    clear: both;
    text-align: center;
    border: 1px solid #ddd;
    padding: 20px 0;
    background: #fff;
}

.solo_bg {
    width: 180px;
    height: 180px;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid #ddd;
    display: inline-block;
}

.solo_bg img {
    width: 100%;
    height: 100%;
}

.solo_setting_box {
    font-size: 14px;
    margin-bottom: 20px;
    position: relative;
    clear: both;
    width: 100%;
    display: inline-block;
}

.solo_setting_box h2 {
    font-size: 16px;
    font-weight:600;
}

.solo_setting_box h2 span {
    font-size:13px;
    color:#999;
    font-weight:400;
    margin-left:10px;
}

.solo_setting_box > .box {
    display: inline-block;
    width: 100%;
}

.btn_msg {
    position:relative;
    width:100%;
    margin:20px 0 10px 0;
    display:inline-block;
}

.btn_msg ul {
    display:inline-block;
    float:right;
}

.btn_msg ul li {
    position:relative;
    float:left;
    padding:0 15px;
}

.btn_msg ul li:first-child a:hover {
    color:#333;
}

.btn_msg ul li:last-child a:hover {
    color:#aaa;
}

.btn_msg ul li:first-child:after {
    position:absolute;
    content:'|';
    margin-left:10px;
    right:0;
    font-size:11px;
    top:50%;
    transform:translate(-50%, -50%);
    color:#aaa;
}

.btn_msg ul li:first-child {
    font-weight:500;
}

.btn_msg ul li:last-child {
    color:#aaa;
    font-weight:300;
}

.msg_table {
    width: 100%;
    display:inline-block;
}

.msg_table .msg_list {
    width:100%;
    display:block;
}

.msg_table .msg_list li {
    height:50px;
    float:left;
    line-height:50px;
}

.msg_list li span.nick_thumb {
    width:35px;
    height:35px;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
}

.msg_list li > div {
    position:relative;
    display:flex;
}

.msg_list li span.nick_id {
    vertical-align:middle;
    margin-left:15px;
}

.msg_list li span img {
    width:100%;
}

.msg_title {
    width:100%;
    display:inline-flex;
}

.msg_title li {
    float:left;
    padding: 17px 0;
    background: #f9f9f9;
    text-align: center;
    border-top: 2px solid #333;
}

.msg_title li:first-child {
    width:3%;
}

.msg_title li:nth-child(2) {
    width:32%;
}

.msg_title li:nth-child(3) {
    width:calc(100% - 65%);
}

.msg_title li:nth-child(4) {
    width:25%;
}

.msg_title li:last-child {
    width:5%;
}

.msg_list li.msg_ck {
    width:3%;
}

.msg_list li.name {
    width:32%;
}

.msg_list li.msg_con {
    width:calc(100% - 65%);
}

.msg_list li.date {
    width:25%;
}

.msg_list li.state {
    width:5%;
}

.msg_table li {
    text-align: center;
    cursor: pointer;
    border-bottom:1px solid #ddd;
}

.msg_list:hover {
    background: #f9f9f9;
}

.msg_table .msg_view {
    display: none;
}

.msg_table thead th {
    background: #f9f9f9;
}

.msg_table .msg_view li {
    text-align: left;
    background-color: #efefef;
    padding: 10px 20px;
    display:inline-block;
    width:100%;
}

.msg_list > li.msg_con {
    text-align:left;
    text-indent:20px;
}

.msg_list .state span.no_read {
    color:#ff0707;
}

.msg_list .state span.read {
    color:#1d8dea;
}

.msg_table {
    width: 100%;
    display:inline-block;
}

.msg_table .msg_list {
    width:100%;
    display:inline-flex;
}

.msg_table .msg_list li {
    height:50px;
    float:left;
    line-height:50px;
}

.msg_list li span.nick_thumb {
    width:35px;
    height:35px;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
}

.msg_list li > div {
    position:relative;
    display:flex;
}

.msg_list li span.nick_id {
    vertical-align:middle;
    margin-left:15px;
}

.msg_list li span img {
    width:100%;
}

.b_member_title {
    width:100%;
    display:table;
    height:50px;
}

.b_member_title li {
    display:table-cell;
    background: #f9f9f9;
    text-align: center;
    vertical-align:middle;
    border-top: 2px solid #333;
}

.b_member_title li:first-child {
    width:3%;
}

.b_member_title li:nth-child(2) {
    width:10%;
}

.b_member_title li:nth-child(3) {
    width:calc(100% - 70%);
}

.b_member_title li:nth-child(4) {
    width:25%;
}

.b_member_title li:last-child {
    width:15%;
}

.b_member_list li.msg_ck {
    width:3%;
}

.b_member_list li.name {
    width:10%;
}

.b_member_list li.msg_con {
    width:calc(100% - 70%);
}

.b_member_list li.date {
    width:25%;
}

.b_member_list li.state {
    width:15%;
}

.b_member_table li {
    text-align: center;
    cursor: pointer;
    border-bottom:1px solid #ddd;
    height:50px;
}

.b_member_table .msg_view {
    display: none;
}

.b_member_table thead th {
    background: #f9f9f9;
}

.b_member_table .msg_view li {
    text-align: left;
    background-color: #efefef;
    padding: 10px 20px;
}

.b_member_list > li.msg_con {
    text-align:left;
    text-indent:20px;
}

.b_member_list .state span.no_read {
    color:#ff0707;
}

.b_member_list .state span.read {
    color:#1d8dea;
}

.b_member_table {
    width: 100%;
    display:inline-block;
}

.b_member_table .b_member_list {
    width:100%;
    display:table;
}

.b_member_table .b_member_list li {
    height:60px;
    position:relative;
    display:table-cell;
    vertical-align:middle;
}

.b_member_list li span.nick_thumb {
    width:35px;
    height:35px;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
}

.b_member_list li > div {
    position:relative;
    display:block;
}

.b_member_list li span.nick_id {
    vertical-align:middle;
    margin-left:15px;
    position:absolute;
    top:10px;
}

.b_member_list li span img {
    width:100%;
    vertical-align:baseline;
}

.time_tab-wrapper{
    text-align: center;
    display: block;
    margin: auto;
    max-width: 1000px;
}

.time_tabs {
    margin: 0;
    padding: 0;
    justify-content: center;
    display:inline-block;
    width:100%;
    border-top:2px solid #666;
    border-bottom:1px solid #ddd;
}

.time_tab-link{
    list-style: none;
    float:left;
    width:14%;
    padding: 10px 0;
    color: #aaa;
    cursor: pointer;
    transition: all ease 0.5s;
    border-bottom: solid 3px rgba(255,255,255,0.0);
}

.time_tab-link:hover{
    color: #333;
    border-color: #e877ae;
    font-weight:500;
}

.time_tab-link.active{
    color: #333;
    border-color: #e877ae;
    font-weight:500;
}

.content-wrapper{
    max-width:1000px;
    margin:0 auto;
}

.time_tab-content{
    display: none;
    text-align: center;
    color: #666;
    font-weight: 300;
    font-size: 15px;
    opacity: 0;
    transform: translateY(15px);
    animation: fadeIn 0.5s ease 1 forwards;
}

.time_tab-content.active{
    display: block;
}

@keyframes fadeIn{
    100%{
        opacity: 1;
        transform: none;
    }
}

.schedule_title {
    width:100%;
    height:50px;
}

.schedule_title li {
    float:left;
    width:14%;
    text-align: center;
    vertical-align:middle;
    border-top: 2px solid #333;
    border-bottom:1px solid #ddd;
    padding:5px 0;
    color:#999;
}

.schedule_title li:hover {
    cursor:pointer;
}

.schedule_title li.today {
    font-weight:500;
    color:#333;
}

.schedule_list {
    width:100%;
    display:table;
}

.schedule_list > li {
    height:70px;
    position:relative;
    display:table-cell;
    vertical-align:middle;
}

.schedule_list > li > ul {
    border-bottom:1px solid #ddd;
    width:100%;
    display:table;
    height:70px;
}

.schedule_list > li > ul > li {
    vertical-align:middle;
    display:table-cell;
}

.schedule_list > li > ul > li:first-child {
    width:200px;
    text-align:center;
}

.schedule_list > li > ul > li:nth-child(2) {
    width:calc(100% - 270px);
    text-align:left;
}

.schedule_list > li > ul > li:last-child {
    width:70px;
    font-size:20px;
    color:#aaa;
}

.schedule_list > li > ul > li:last-child > i:hover {
    cursor:pointer;
    color:#555;
}

.schedule_list > li > ul > li > div {
    position:relative;
    display:inline-block;
    vertical-align:middle;
}

.schedule_list > li > ul > li > span {
    vertical-align:middle;
}

.schedule_list > li > ul > li > div > span.nick_thumb {
    width:45px;
    height:45px;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
}

.schedule_list li span.nick_id {
    vertical-align:middle;
    margin-left:15px;
    position:absolute;
    top:10px;
}

.schedule_list li span img {
    width:100%;
    vertical-align:baseline;
}

.schedule_btn_wrap {
    margin-top:30px;
    float:right;
}

.schedule_btn {
    width:50px;
    height:50px;
    border-radius:50%;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    box-shadow:1px 1px 5px #ddd;
}

.schedule_btn:hover {
    cursor:pointer;
    background:#fafafa;
}

.no_schedule {
    padding:50px 0;
    text-align:center;
}

.schedule_table_wrap {
    background: url('/images/cash_bg.png');
    width:100%;
    display:inline-block;
}

.schedule_table {
    width:calc(100% - 20px);
    display:table;
    margin:10px;
    background:#fff;
    padding:10px;
}

.schedule_table li {
    vertical-align:middle;
    display:table-cell;
    text-align:center;
}

.schedule_table li:first-child {
    font-weight:500;
}

.schedule_table li select {
}

.schedule_time li {
    margin:6px 0;
    display:inline-block;
    width:100%;
}

.schedule_time li ul {
    display:table;
    width:100%;
    max-width:300px;
    margin:0 auto;
}

.schedule_time li ul li {
    display:table-cell;
}

.schedule_time li ul li:first-child {
    width:90px;
}

.schedule_time li ul li:last-child {
    width:calc(100% - 90px);
}

.schedule_time li ul li select {
    width:100px;
    width:80px;
}

.mb_list {
    width: 70%;
    margin: 30px auto;
}

.mb_list > li {
    padding: 10px 0;
}

.mb_list > li > ul {
    display: table;
    width: 100%;
}

.mb_list > li > ul > li {
    display: table-cell;
}

.mb_list > li > ul > li.img span {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: inline-block;
    overflow: hidden;
    vertical-align: middle;
    margin-right: 10px;
}

.mb_list > li > ul > li.img span > img {
    width: 50px;
}

.mb_list > li > ul > li:first-child {
    width: 130px;
    padding-left: 20px;
}

.mb_list > li > ul > li:last-child {
    width: 130px;
    text-align: right;
}

.mb_list > li > ul > li:last-child > button.board_btn {
    margin-top: 0px;
}

.msg_textarea {
    padding: 8px ;
    /*width:calc(100% - 180px);*/
    border:1px solid #ddd;
    border-radius:3px;
}

.msg_textarea::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

.reply_box > li {
    margin-bottom: 30px;
    position:relative;
}

.reply_box > li:last-child {
    border: none;
}

.reply_box .txt1 {
    font-weight: 600;
}

.reply_box .txt1 > div {
    float:left;
}

.reply_box .txt1 > div > ul > li {
    font-weight:400;
    text-align:center;
}

.reply_box .txt1 span {
    color: #999;
    font-weight: 300;
    margin-left: 15px;
    font-size:13px;
}

.reply_box .txt2 {
    color: #777;
    margin-top: 5px;
    font-weight:400;
    font-size:15px;
}

.reply_box .txt3 {
    color: #999;
    font-weight: normal;
    text-decoration: underline;
}

.reply_box .listen_reply_option {
    position:absolute;
    top: 5px;
    right: 10px;
}

.reply_box .listen_reply_option ul > li {
    padding:0;
    margin:0;
}

.studio_reply2:before {
    content:'';
    background: url('/images/reply2.png') no-repeat;
    position: absolute;
    top:10px;
    left: 10px;
    width: 10px;
    height: 10px;
}

.re_reply {
    border: none;
    background: none;
    text-decoration: underline;
    padding: 0;
}

.reply2 {
    padding-left: 20px;
    position: relative;
}

.reply2:before {
    content: '';
    background: url('/images/reply.png') no-repeat;
    position: absolute;
    left: 0;
    width: 20px;
    height: 20px;
}

.request_music {
    display: none;
    background: #f9f9f9;
    /*margin: 10px 0 10px 100px;*/
    padding: 10px 20px;
}

.request_music input[type=text] {
    background: #fff;
}

.request_heart {
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 3px;
    padding: 7px 15px;
    display: inline-block;
}

.heart_text {
    margin-top: 10px;
}

.heart_text > span.heart_nick {
    font-weight: 600;
}

.heart_text > span.num {
    color: #f44336;
}

.reply_msg {
    position: relative;
    border:1px solid #ddd;
    background:#fff;
    display:flex;
    padding:5px;
}

.textarea_btn {
    background-color: #fff;
    border: 1px solid #333;
    color: #333;
    padding: 5px 20px;
}

.reply_box2 {
    position: absolute;
    top: 8px;
    right: 20px;
}

.msg_txt {
    padding: 10px 0;
    word-break:break-all;
    display:inline-block;
}

.send_msg_table {
    width: 70%;
}

.send_msg_table td {
    padding: 5px 0;
}

.send_msg_table th {
    padding: 5px 0;
    width: 90px;
}

.send_msg_input {
    width: calc(100% - 90px);
}

.follow_btn {
    border: 1px solid #e877ae;
    background-color: #fff;
    color: #e877ae;
    padding: 5px;
    line-height: 20px;
}

.modal_tab_box {
    margin: 10px 0;
}

.modal_tab {
    width: 49%;
    display: inline-block;
    text-align: center;
    padding: 5px 0;
    cursor: pointer;
}

.modal_tab_box .active {
    color: #e877ae;
    border-bottom: 2px solid #e877ae;
    font-weight: 600;
}

.fol2_list {
    display: none;
}

.log_sub_title {
    /*
	font-size: 15px;
    color: #aaa;
	*/
    font-size: 15px;
    color: #e877ae;
    font-weight: bold;
}

.log_wrap {
    margin-top:100px;
}

.cover_box {
    margin-top:100px;
}

.cover:before {
    content:'';
    background:rgba(0,0,0,.5);
    position:absolute;
    width:100%;
    height:100%;
}

.cover {
    position:relative;

    /*width:1000px;*/
    width: 100%;
    max-width: 800px;

    /*height:300px;*/
    height:240px;
    margin:0 auto;
    /*background:url('/images/cover.png') no-repeat top center;*/
}

.cover_wrap {
    margin:0 auto;
    position:relative;
    /*display:inline-block;*/
    color:#fff;
    top: 30px;
}

.log_top_box {
    clear: both;
    display: table;
    position: relative;
}

.log_top_box li {
    float: left;
}

.log_top_box li:first-child {
    padding:15px 10px 0 35px;
}

.log_top_box li:nth-child(2) {
    padding:25px 0px 0 10px;
}

.log_pic_wrap {
    position:relative;
}

.log_pic_wrap span.log_profile_img {
    width: 90px;
    height: 90px;
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
}

.log_pic_wrap img {
    width: 100%;
}

.sub_content_title2 {
    padding:0 30px;
}

.log_data {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    color:#fff;
}

.broad_data {
    position: absolute;
    top: 20px;
    right: 30px;
    cursor: pointer;
    color:#fff;
}

.padright10 {
    padding-right: 10px;
}

.log_fol_box {
    color: #aaa;
    padding: 0 15px
}

.log_fol_box > ul > li {
    display: inline-block;
    margin: 20px 20px 20px 0;
}

.log_fol_box > ul > li span {
    color:#222;
}

.log_fol_box > ul > li:last-child {
    color:#e877ae;
    font-weight:500;
}

.log_txt1 {
    padding: 20px;
    border: 1px solid #ddd;
    color: #666;
    font-size: 15px;
    margin-bottom: 30px;
    position: relative;
    word-break:break-all;
}

.log_reply_txt1 {
    margin:15px 0 15px 0;
    word-break:break-all;
    display:inline-block;
    width:100%;
}

.log_txt_box > li {
    border: 1px solid #ddd;
    padding: 15px;
    margin: 15px 0;
}

.log_list_img img{
    max-width:700px;
}

.log_reply_write_box {
    background-color: #f9f9f9;
}

.log_list_img  {
    text-align:center;
}

.reply_box3 {
    padding: 20px 5px;
    position:relative;
}

.reply_box3 li {
    border: 0;
    padding: 0 0 10px 0;
    position:relative;
    border-bottom:1px solid #ddd;
}

.reply_box3 li.log_reply2 {
    padding-left:30px;
}

.reply_box3 li:last-child {
    border: none;
}

.reply_box3 > li > .listen_reply_option {
    position:absolute;
    top:0;
    right:0;
}

.reply_box3 > li > .listen_reply_option ul > li {
    padding:0;
    margin:0;
}

.reply_box3 .txt1 {
    font-weight: 600;
    margin-top: 10px;
}

.reply_box3 .txt1 span {
    color: #999;
    font-weight: normal;
    margin-left: 15px;
}

.log_reply_id {
    font-weight:500;
    color:#e877ae;
    margin-right:5px;
}

.reply_box3 .txt2 {
    color: #666;
    margin-top: 5px;
}

.reply_box3 .txt3 {
    color: #999;
    font-weight: normal;
    text-decoration: underline;
}

.log_table {
    width:100%;
}

.log_txt1 .log_ymd {
    position: absolute;
    top: 20px;
    right: 20px;
}

.log_txt1 .log_img {
    float:left;
    position:relative;
}

.log_txt1 .log_img > span {
    width:45px;
    height:45px;
    display:inline-block;
    border-radius:50%;
    background:#f9f9f9;
    overflow:hidden;
    border:1px solid #ddd;
    margin-right:10px;
}

.log_txt1 .log_reply_cnt {
    position: absolute;
    bottom: 5px;
    right: 20px;
    color:#2f6f9f;
    font-size:13px;
}

.log_txt1 .log_reply_cnt:hover {
    text-decoration:underline;
    cursor:pointer;
}

.log_data_table {
    width: 60%;
    margin:0 auto;
}

.log_data_table th {
    width: 120px;
}

.log_data_table td {
    padding: 5px 0;
}

.log_manage_title {
    display:none;
}

.log_img_wrap {
    width: 100%;
    border: 1px solid #ddd;
    margin-bottom: 5px;
}

.nick_box {
    position: relative;
    margin-left:5px;
}

#nick_box img {
    width:100%;
}

.nick_box img {
    width:100%;
}

.nick_box span {
    color:#999;
    font-weight:normal;
    margin-top:4px;
    display:inline-block;
    width:100%;
    font-size:13px;
    white-space:nowrap;
}

.nick_box .txt1 {
    color:#333;
    font-weight:500;
    display:inline-block;
    width:auto;
}

.nick_box .txt1 div {
    margin-top:5px;
}

.nick_box .txt1 div#user_id2:hover {
    cursor:pointer;
    text-decoration:underline;
}

.nick_box .txt1 div > ul > li {
    color:#999;
}

.nick_box span img {
    width: 100%;
}

.nick_box > .listen_reply_option {
    position:absolute;
    top:0;
    right:0;
}

.nick_box > .listen_reply_option ul > li {
    padding:0;
    margin:0;
}

.nick_option {
    width: 100px;
    background-color: #fff;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #e8e8e8;
    position: absolute;
    top: 0;
    left: 150px;
    box-shadow: 2px 2px 5px #aaa;
    display: none;
}

.nick_option p {
    padding: 3px;
    color: #999;
    cursor: pointer;
    z-index: 1;
}

.charge_btn {
    width: 67%;
}

.card-last {
    margin-bottom: 30px;
}

.company_txt1 {
    font-size: 2rem;
    text-align: center;
    font-weight: 600;
}

.company_txt2 {
    font-size: 2rem;
    text-align: center;
    font-weight: 600;
    background-color: #eee;
    padding: 20px 0;
    color: #666;
}

.company_txt3 {
    font-size: 1.5rem;
    color: #999;
    font-weight: 600;
    margin-bottom: 30px;
}

.company_img {
    width: 100%;
    max-width: 720px;
}

.studio_box {
    width: 100%;
    background: url(/images/broad_bg.png) no-repeat top right;
    padding: 0;
    display: table;
    clear: both;
    margin: 0;
    padding: 0;
    height:250px;
    border-radius: 10px;
}

.studio_box::before {
    content:'';
    background:rgba(0,0,0,.5);
    position:absolute;
    width:100%;
    height:100%;
    border-radius: 10px;
}

.studio_top {
    width: 90%;
    margin: 20px 30px;
    clear: both;
    display: table;
    position:absolute;
    bottom:15px;
}

.studio_top .log_pic_wrap {
    float: left;
    margin-right: 15px;
}

.log_pic_wrap img {
    width:100%;
}

.log_pic_wrap > .live_on {
    position:absolute;
    bottom:0;
    left:10px;
}

.broad_select {
    display: inline-block;
}

.board_write_check {
    display: inline-block;
    margin:7px 0;
}

.board_write_check li {
    display: inline-block;
}

.broadcast_name {
    color: #fff;
    font-size:18px;
    margin-top: 8px;
}

.broadcast_name img {
    margin-bottom: 3px;
}

.broadcast_name .favorite {
    cursor:pointer;
    font-size:12px;
    margin-left:20px;
    border:1px solid #999;
    border-radius:5px;
    padding:2px 5px;
}

.broadcast_url {
    color: #93b7cd;
    margin-top:5px;
    display:block;
}

.broadcast_url2 {
    color: #93b7cd;
    margin-top:10px;
    /*display:block;*/
    float:left;
    font-size:12px;
}

.studio_name {
    float:left;
    margin-top:10px;
}

.studio_level {
    float:right;
    color:#fff;
}

.right_btn {
    margin: 20px 0;
    font-weight: 600;
    display:inline-block;
    float:right;
}

.live_top {
    width: 100%;
    display: table;
    clear: both;
    border-bottom: 1px solid #ddd;
    padding-bottom: 20px;
    position:relative;
}

.live_top .live_top_txt1 {
    float: left;
    margin-right: 20px;
}

.live_top  span.studio_pro_img {
    width: 70px;
    height: 70px;
    border: 1px solid #ddd;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
}

.live_top .live_top_txt1 span img {
    width: 100%;
}

.live_top .live_top_txt2 {
    font-size: 16px;
    font-weight: 600;
    margin: 8px 0;
}

.live_ul {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    margin-bottom: 10px;
}

.live_ul li {
    padding: 10px 0;
    color: #666;
    font-weight: 600;
    cursor: pointer;
}

.member_list_wrap {
    width:100%;
    height:460px;
    border:1px solid #ddd;
    border-radius:5px;
}

.member_list_wrap:hover {
    background:#fefefe;
}

.member_list {
    padding:15px 10px;
}

.member_list_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.member_list_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.member_list_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.member_list_scroll {
    overflow:auto;
    height:100%;
    visibility:hidden;
}

.member_list_scroll-inner {
    height:100%;
}

.member_list_scroll-inner,
.member_list_scroll:hover {
    visibility: visible;
}

.studio_member_icon {
    width: 40px;
    height: 40px;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
}

.member_list li div span.studio_log_icon {
    color:#999;
    margin-left:5px;
}

.member_list li div span.studio_log_icon:hover {
    color:#e877ae;
    cursor:pointer;
}

.member_list li div span img {
    width: 100%;
    display:block;
}

.member_list > li {
    padding: 5px;
    width: 100%;
    display: table;
    clear: both;
    line-height: 40px;
    font-size: 13px;
    overflow: hidden;
}

.member_list > li > div {
    float: left;
    margin-right: 10px;
    position:relative;
}

.member_log_icon {
    width:18px;
    margin-top:-3px;
    cursor:pointer;
}

.log_btn {
    width: 70px;
}

.log_more_btn {
    position:absolute;
    top:15px;
    right:18px;
    font-size: 20px;
}

.log_more_btn span {
    color:#fff !important;
}

.log_random_btn {
    position: absolute;
    top: 12px;
    right: 42px;
    color: #ffffff;
    font-size: 22px;
    cursor: pointer;
}

.log_option_btn {
    position:absolute;
    top:200px;
    right:10px;
    cursor:pointer;
    font-size: 20px;
}

.log_option_btn span {
    color:#fff !important;
}


.heart_box {
    border: 1px solid #ddd;
    padding: 10px;
}

.heart_modal_title {
    color: #f49ac1;
    padding: 10px;
}

.heart_modal_table {
    width: 100%;
    color: #333;
    font-size: 15px;
}

.heart_modal_table td {
    padding: 5px 10px;
}

.heart_modal_table th {
    padding: 5px 10px;
    width: 100px;
}

.heart_modal_btn {
    background-color: #f49ac1;
    color: #fff;
    border: 1px solid #f49ac1;
    border-radius: 5px;
    margin: 20px 0;
    width: 100px;
}

.buy_heart_table tr:hover {
    /*text-decoration:underline;*/
    /*cursor:pointer;*/
}

.buy_heart_table td.heart_modal_cnt {
    text-indent: 50px;
}

.buy_heart_table td.heart_modal_coin {
    font-weight: 600;
}

.buy_heart_table td.heart_modal_coin:hover {
    cursor: pointer;
    color: #e877ae;
}

.buy_heart_title {
    padding: 10px;
    position: relative;
    background-color: #f49ac1;
    color: #fff;
    font-size: 18px;
}

.heart_back_btn {
    position: absolute;
    top: 15px;
    left: 10px;
    font-size: 24px;
    cursor: pointer;
}

.heart_close_btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 24px;
    cursor: pointer;
}

.my_heart_td {
    background-color: #eee;
    padding: 10px;
}

.buy_heart_table {
    width: 100%;
}

.buy_heart_table th {
    padding: 5px 10px;
}

.buy_heart_table td {
    padding: 10px;
}

.member_level {
    margin-right: 20px;
    display: inline-block;
}

.pairing_table {
    width: 100%;
}

.pairing_table th {
    text-align: center;
    line-height: 45px;
    border-top: 2px solid #333;
    border-bottom: 1px solid #ddd;
    font-size: 17px;
}

.pairing_table td {
    line-height: 45px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.pairing_table td {
    position: relative;
}

.pairing_table td:hover {
    background: #f9f9f9;
}

.pair_hover {
    opacity: 0;
}

.sel_pairing {
    width: 100%;
    height: 100%;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
}

.sel_pairing .txt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.sel_pairing .txt .cj_img {
    vertical-align: middle;
    margin-right: 5px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-block;
}

.sel_pairing .txt .cj_img img {
    width: 100%;
    display: block;
}

.cj_bg1 {
    background: #f3e0f6;
}

.cj_bg2 {
    background: #aacbab;
}

.cj_bg3 {
    background: #f6e8e0;
}

.cj_bg4 {
    background: #e0ebf6;
}

.cj_bg5 {
    background: #ffe47a;
}

.cj_bg6 {
    background: #c9addd;
}

.cj_bg7 {
    background: #ff9c9e;
}

.cj_bg8 {
    background: #c4a183;
}

.cj_bg9 {
    background: #d5f1c8;
}

.cj_bg10 {
    background: #ffbe8e;
}

.pair_close {
    position: absolute;
    right: 10px;
    top: 10px;
}

.selectbox {
    position: relative;
    width: 200px;
    border: 1px solid #ddd;
    z-index: 1;
    display: inline-block;
}

.selectbox:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    width: 0;
    height: 0;
    margin-top: -1px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #ddd;
}

.selectbox label {
    position: absolute;
    top: 1px;
    left: 5px;
    padding: .8em .5em;
    color: #999;
    z-index: -1;
    font-weight: 500;
    font-size: 13px;
}

.selectbox select {
    width: 100%;
    height: auto;
    line-height: normal;
    font-family: inherit;
    padding: .6em .5em;
    border: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.selectbox2 {
    position: relative;
    width: 200px;
    border: 1px solid #ddd;
    z-index: 1;
    display: inline-block;
}

.selectbox2:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 15px;
    width: 0;
    height: 0;
    margin-top: -1px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #ddd;
}

.selectbox2 label {
    position: absolute;
    top: 1px;
    left: 5px;
    padding: 0;
    color: #999;
    z-index: -1;
    font-weight: 500;
    font-size: 13px;
}

.selectbox2 select {
    width: 100%;
    height: auto;
    line-height: normal;
    font-family: inherit;
    padding: .6em .5em;
    border: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

label.box-radio-input {
    margin-bottom: 0 !important;
    vertical-align: middle;
}

.box-radio-input input[type="radio"] {
    display: none;
}

.box-radio-input input[type="radio"] + span {
    display: block;
    background: none;
    border: 1px solid #dfdfdf;
    text-align: center;
    width: 30px;
    height: 30px;
    font-weight: 500;
    cursor: pointer;
}

.box-radio-input input[type="radio"]:checked + span {
    color: #fff;
    border: 1px solid #333;
}

.today_ymd {
    font-size: 28px;
    color: #999;
}

.pairing_modal_table {
    width: 100%;
    border-top: 2px solid #333;
}

.pairing_modal_table tr th {
    line-height: 50px;
    background-color: #f9f9f9;
    border-bottom: 1px solid #ddd;
    text-align: center;
}

.pairing_modal_table tr td {
    border-bottom: 1px solid #ddd;
    padding-left: 10px;
}

.top_menu li.login_top_menu span.menu_cnt {
    font-size: 13px;
}

.listen_bg_box {
    /*width: 55%;*/
    width: 68%;
    float: left;
    overflow: hidden;
    height: calc(100% - 0px);
    background: no-repeat center center;
    background-size: cover;
}

.listen_bg {
    width: 55%;
    position: relative;
    z-index: 1;
    color: #fff;
    background-size: cover;
    position: relative;
    float: left;
    margin: 20px 0;
}

.listen_bg:after {
    width: 55%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover;
    opacity: 0.5;
    content: '';
    width: 100%;
    height: 100%;
    z-index: -1;
}

.chat_bg1 { position: relative;  z-index: 1; }
.chat_bg1:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 1.0; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg2 { position: relative;  z-index: 1; }
.chat_bg2:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.9; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg3 { position: relative;  z-index: 1; }
.chat_bg3:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.8; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg4 { position: relative;  z-index: 1; }
.chat_bg4:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.7; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg5 { position: relative;  z-index: 1; }
.chat_bg5:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.6; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg6 { position: relative;  z-index: 1; }
.chat_bg6:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.5; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg7 { position: relative;  z-index: 1; }
.chat_bg7:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.4; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg8 { position: relative;  z-index: 1; }
.chat_bg8:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.3; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg9 { position: relative;  z-index: 1; }
.chat_bg9:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.2; content: ''; width: 100%; height: 100%; z-index: -1; }
.chat_bg10 { position: relative;  z-index: 1; }
.chat_bg10:after { background-color: #000; position: absolute; top: 0; left: 0; background-size: cover; opacity: 0.1; content: ''; width: 100%; height: 100%; z-index: -1; }



.listen_bg2 {
    position: relative;
    z-index: 1;
}

.listen_bg2:after {
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover;
    opacity: 0.5;
    content: '';
    width: 100%;
    height: 100%;
    z-index: -1;
}

.dubbing_bg {
    border:1px solid #eee;
    border-right:none;
    background:#3f515f;
}

.dubbing_bg .oc_top .origin_back {
    top:25px;
}

.dubbing_img_area {
    position:absolute;
    display:inline-block;
    bottom:0;
}

.dubbing_img {
    width:100%;
}

.dubbing_img > img {
    width:100%;
}

.listen_ori_bg {
    width: 70%;
    background-color: #000;
    color: #fff;
    background-size: cover;
    position: relative;
    float: left;
}

.invo_ori_bg {
    width: 100%;
    height: 540px;
    background-color: #000;
    color: #fff;
    background-size: cover;
    position: relative;
    float: left;
}

/*
.listen_ori_bg:after {
	background: url(/images/ori_bg1.jpg) no-repeat center left;
	background-color: #000;
	position: absolute;
	top: 0;
	left: 0;
	background-size: cover;
	opacity: 0.5;
	content: '';
	width: 100%;
	height: 100%;
	z-index: -1;
}*/

.listen_ori_bg2{
    width: 70%;
    height:100%;
    color: #fff;
    position: relative;
    float: left;
}

.listen_right {
    width: 32%;
    height:100%;
    float: left;
    position:relative;
    border: 1px solid #eee;
}

.live_right_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.live_right_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.live_right_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.live_right_scroll {
    overflow:auto;
    visibility:hidden;
    padding:10px 0px 0px 30px;
    height:100%;
}

.live_right_scroll,
.live_right_scroll:hover {
    visibility: visible;
}

.listen_right_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.listen_right_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.listen_right_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.listen_right_scroll {
    overflow:auto;
    visibility:hidden;
    padding:10px 30px;
    height:100%;
}

.listen_right_scroll-inner {
}

.listen_right_scroll-inner,
.listen_right_scroll:hover {
    visibility: visible;
}

.invo_list_hot_title {
    margin-top: 100px;
}

.invo_list_pick_title_sub {
    color: #adadad;
    font-size: 20px;
    font-weight: 300;
}

.invo_list_pick_title {
    padding: 50px 0px 50px 20px;
}

.invo_list_pick_item {
    display: flex;
    justify-content: center;
    float: left;
    margin: 10px 40px 40px 0px;
    cursor: pointer;
}

.invo_list_pick_item_nick {
    display: flex;
    justify-content: center;
    padding-top: 10px;
    font-size: 16px;
}

.invo_list_pick_img {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    border: 1px solid #e9e9e9;
}

.invo_left {
    position: relative;
    float: left;
    width: calc(100% - 560px);
    margin-left: 30px;
}

.invo_right {
    width: 440px;
    /*height: 100%;*/
    float: right;
    /*position: relative;*/
    /*position: absolute;*/
    right: 0px;
}

.invo_right_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.invo_right_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.invo_right_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.invo_right_scroll {
    overflow:auto;
    visibility:hidden;
    /*padding:10px 30px;*/
    height: calc(100% - 175px);
}

.invo_right_scroll-inner {
}

.invo_right_scroll-inner,
.invo_right_scroll:hover {
    visibility: visible;
}



.intalk_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.intalk_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.intalk_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.intalk_scroll {
    overflow:auto;
    height:100%;
    visibility:hidden;
}

.intalk_scroll-inner,
.intalk_scroll:hover {
    visibility: visible;
}

.broad_input {
    border:1px solid #ddd;
    padding:7px 0;
    border-radius:3px;
    text-indent:10px;
}

.gift_right_scroll2 {
    height:calc(100% - 300px);
}

.listen_right_scroll2 {
    padding: 0px 20px;
    height:calc(100% - 105px);
}

.chat_respmsgbox {
    display: none;
    right: 15px;
    top: 245px;
    width: 260px;
    border-radius: 10px;
    background-color: rgb(0 0 0 / 80%);
    color: #fff;
    padding: 10px 15px;
    max-width: 70%;
    position: absolute;
    z-index: 9;
}

.chat_respmsgbox > textarea {
    background-color: rgba(0, 0, 0, 0);
    border: 0px solid;
    width: 226px;
    height: 110px;
    margin-bottom: 10px;
}

.chat_respmsgqsize {
    float: right;
    color: #000000;
    background-color: #e1e1e1;
    border-radius: 20px;
    font-weight: bold;
    padding: 1px 7px;
}

.chat_tab_wrap {
    width:100%;
    background:#fff;
    z-index:2;
    padding-left:30px;
}

.chat_moodshotmenu {
    color: #ffffff;
    font-size: 22px;
    right: 20px;
    top: 240px;
    position: absolute;
    z-index: 2;
}

.chat_moodshotimg {
    max-width: 160px;
    max-height: 200px;
    border-radius: 12px;
    margin: 5px 0px;
}

.chat_quickmenu {
    color: #ffffff;
    font-size: 22px;
    right: 15px;
    bottom: 100px;
    position: absolute;
    z-index: 2;
}

.chat_quickmenu_node {
    cursor: pointer;
    padding: 3px 0px;
}

.dubbing_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.dubbing_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.dubbing_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.dubbing_scroll {
    overflow:auto;
    height:100%;
    visibility:hidden;
}

.dubbing_scroll-inner {
    height:100%;
}

.dubbing_scroll-inner,
.dubbing_scroll:hover {
    visibility: visible;
}

.listen_btn {
    border: 1px solid #fff;
    background-color: rgba(0, 0, 0, 0);
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 13px;
    margin-left: 10px;
}

.listen_top {
    width: 100%;
    color: #fff;
    position: relative;
}

.listen_top:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    padding: 20px 30px;
    width: 100%;
    height: 100%;
    color: #fff;
    z-index: -1;
}

.listen_top2 {
    width: 100%;
    color: #fff;
    position: relative;
}

.listen_top2:after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    padding: 20px 30px;
    width: 100%;
    height: 100%;
    color: #fff;
    z-index: -1;
}

.listen_top_ul {
    width: 100%;
    clear: both;
    display: table;
    padding:15px 0;
}

.listen_top_ul > li:nth-child(2) {
    width:calc(100% - 150px);
}


.invoice_top_ul {
    width: 100%;
    clear: both;
    display: table;
    padding: 15px 0px 20px 0px;
    border-bottom: 1px solid #e5e5e5;
}

.invoice_top_ul > li:nth-child(2) {
    width:calc(100% - 55px);
}

.request_msg {
    background-color: rgba(55, 55, 55, 0.6);
    border-radius: 5px;
    padding: 10px;
    color: #ffffff;
    position: relative;
    margin: 20px 0;
    display: inline-block;
    width: 70%;
}

.cj_ending_msg {
    background-color: rgb(181 181 181 / 60%);/*rgb(203 71 0 / 0.6)*/
    border-radius: 5px;
    padding: 10px;
    color: #ffffff;
    position: relative;
    margin: 20px 0;
    display: inline-block;
    width: 100%;
}

.listen_back_btn {
    position: absolute;
    top: 4px;
    left: 20px;
    font-size: 24px;
    cursor: pointer;
}

.listen_back_btn2 {
    position: absolute;
    top: 30px;
    left: 20px;
    font-size: 24px;
    cursor: pointer;
}

.invoice_back_btn2 {
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 24px;
    cursor: pointer;
}


.request_heart_cnt {
    position: absolute;
    top:50%;
    transform:translate(-50%, -50%);
    right: 20px;
    font-size: 15px;
    color: #fff;
}

.chat_request_msg {
    width: 70%;
}

.chat_cj_ending_msg {
    width: 100%;
}

.listen_content {
    position: relative;
    display: flex;
    overflow: hidden;
    height: 100%;
    margin: 0 auto;
}

.invoice_content {
    position: relative;
    overflow: hidden;
    height: 100%;
    margin: 0 auto;
}

.dim {
    display:none;
    position:absolute;
    z-index:10;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:0.8;
}

.btn_guide_open {
    position: absolute;
    top: 2px;
    right: 10px;
    border: none;
    background: none;
    font-size: 20px;
}

.guide_pop {
    display:none;
    position:absolute;
    z-index:20;
    top:0;
    left:0;
    box-sizing:border-box;
    width:100%;
    height:100%;
    padding:30px;
    background:none;
}

.guide_pop span {
    display:inline-block;
}

.guide_pop span.guide_close {
    position:absolute;
    z-index:22;
    left:4%;
    top:1%;
    max-width:113px;
    width:100%;
}

.guide_pop span.guide_nick {
    position:absolute;
    z-index:22;
    left:6%;
    top:6%;
    max-width:286px;
    width:100%;
}

.guide_pop span.guide_title {
    position:absolute;
    z-index:22;
    left:33%;
    top:1%;
    max-width:208px;
    width:100%;
}

.guide_pop span.guide_report {
    position:absolute;
    z-index:22;
    left:52%;
    top:8%;
    max-width:52px;
    width:100%;
}

.guide_pop span.guide_count {
    position:absolute;
    z-index:22;
    left:4.2%;
    top:11%;
    max-width:417px;
    width:100%;
}

.guide_pop span.guide_favorite {
    position:absolute;
    z-index:22;
    left:4%;
    bottom:2.2%;
    max-width:98px;
    width:100%;
}

.guide_pop span.guide_btn {
    position:absolute;
    z-index:22;
    left:41%;
    bottom:6%;
    max-width:198px;
    width:100%;
}

.guide_pop .btn_guide_close {
    position:absolute;
    top:1%;
    right:1%;
    background:none;
    border:none;
    color:#fff;
    font-size:20px;
}

.listen_top_ul > li{
    float: left;
    position:relative;
}

.listen_top_ul .audio_title {
    margin-left:10px;
}

.listen_top_ul > li.user_img_wrap {
    margin-right: 3px;
    margin-left: 16px;
}

.listen_top_ul > li.user_img_wrap2 {
    margin-right: 3px;
    margin-left: 45px;
}

.listen_top_ul > li:first-child(2) {
    font-size: 18px;
}

.listen_top_ul > li.float-right {
    float: right;
    margin-top: 20px;
}

.listen_top_ul > li > ul > li {
    position: relative;
}

.listen_top_ul > li > ul > li:first-child {
    font-weight: 500;
    font-size: 16px;
}

.listen_top_ul > li > ul > li:first-child img {
    width: 18px;
    position:absolute;
    top:3px;
    left:80px;
}

.listen_top_ul > li > ul > li:nth-child(2) {
    margin-top: 5px;
    float:left;
}

.listen_top_ul > li > ul > li:nth-child(3) {
    margin-top: 5px;
    margin-left: 10px;
    float:left;
}

.listen_top_ul > li > ul > li:nth-child(4) {
    margin-top: 20px;
    margin-left: -5px;
}

.invoice_stat_text {
    position: relative;
    float:left;
    width: 35%;
}

.invoice_top_ul > li{
    float: left;
    position:relative;
}

.invoice_top_ul .audio_title {
    margin-left:10px;
}

.invoice_top_ul > li.user_img_wrap {
    margin-right: 3px;
    margin-left: 16px;
}

.invoice_top_ul > li.user_img_wrap2 {
    margin-right: 3px;
}

.invoice_top_ul > li:first-child(2) {
    font-size: 18px;
}

.invoice_top_ul > li.float-right {
    float: right;
    margin-top: 20px;
}

.invoice_top_ul > li > ul > li {
    position: relative;
}

.invoice_top_ul > li > ul > li:first-child {
    font-weight: 500;
    font-size: 16px;
}

.invoice_top_ul > li > ul > li:first-child img {
    width: 18px;
    position:absolute;
    top:3px;
    left:80px;
}

.invoice_top_ul > li > ul > li:nth-child(2) {
    margin-top: 5px;
    float:left;
}

.invoice_top_ul > li > ul > li:nth-child(3) {
    margin-top: 5px;
    margin-left: 10px;
    float:left;
}

.invoice_top_ul > li > ul > li:nth-child(4) {
    margin-top: 20px;
    margin-left: -5px;
}


.admin_icon {
    display: inline-block;
    width: 20px;
}

.audio_title {
    margin-left:10px;
}

.audio_con_top {
    padding: 0;
    height: 100vh;
}

.audio_option_bg {
    display:none;
    background:rgba(0, 0, 0, .5);
    width:100%;
    height:100vh;
    position:absolute;
    left:0;
    top:0;
    z-index:11;
}

.audio_option {
    width: auto;
    position: absolute;
    top: 60px;
    right: 25px;
    z-index: 13;
}

.audio_option_ul {
    width: 100%;
    background:#fff;
    padding: 6px 10px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
}

.audio_option_ul li {
    padding: 5px 0;
    color: #222;
}

#hash_insert {
    border: 1px solid #ddd;
}
.user_profile_image {
    text-align:center;
}

.user_profile_image img {
    width:100%;
}

.hash_tag_modal {
    z-index: 13;
    padding:10px 0;
    border-radius: 10px;
}

.hash_tag_modal span {
    /*border: 1px solid #ccc;*/
    border-radius: 20px;
    padding: 5px 12px;
    /*background:#fff;*/
    /*color: #aaa;*/
    display: inline-block;
    margin-bottom: 5px;
}

.hash_tag_modal span:hover {
    border:1px solid #e877ae;
    color:#e877ae;
    cursor:pointer;
}

.hash_tag_modal span.active {
    border: 2px solid #e877ae;
    color: #e877ae;
}

.hash_tag_g1 {
    border: 1px solid #d69bdd;
    color: #3b3b3b;
    background-color: #fceaff;
}

.hash_tag_g2 {
    border: 1px solid #ccc;
    color: #aaa;
    background-color: #ffffff;
}

.record_border {
    background: #fff;
    color: #222;
    border: 2px solid #ddd;
}

.record_border_on {
    background: #e877ae;
    color: #fff;
    border: 2px solid #e877ae;
}

.record_upload {
    border: 1px solid #ddd;
    min-height:150px;;
    background: #fff;
    padding-top:45px;
    text-align: center;
}

.record_upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.record_upload label {
    display: inline-block;
    padding: .5em .75em;
    color: #666;
    font-size: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #fdfdfd;
    cursor: pointer;
    border: 1px solid #aaa;
    border-radius: .25em;
    margin-bottom: 0;
}

/* named upload */
.record_upload .upload-name {
    display: inline-block;
    padding: .5em .75em;
    font-size: inherit;
    font-family: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #f9f9f9;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.record_upload .upload-display {
    margin-bottom: 5px;
}

.record_upload_wrap {
    padding:20px 0;
}

.record_upload_wrap > ol {
    margin-top:15px;
}

.record_upload_wrap ol audio {
    outline:none;
    border:none;
}

.record_upload_wrap ol audio:active {
    outline:none;
    border:none;
}

.record_upload_wrap > span.phone_chk {
    display:block;
    margin:15px 0;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

/* Flex center */
.flex-center, div#home-screen, div#home-screen div.home-content div.app-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
}

/* Flex */
.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.fa.add {
    position: relative;
}

.fa.add::after {
    background: #444444;
    border-radius: 100px;
    content: '\f055';
    font-size: 10px;
    left: 2px;
    position: absolute;
    top: -1px;
    width: 10px;
    height: 11px;
}

div.jcarousel {
    /*position: relative;*/
}

div.jcarousel ul#songs li.song {
    margin: 30px 15px;
    text-align: center;
}

div.jcarousel ul#songs li.song img {
    width: 92.5%;
    -webkit-box-shadow: 0px 5px 25px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 5px 25px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 5px 25px rgba(50, 50, 50, 0.5);
}

div.jcarousel ul#songs li.song p {
    color: white;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

div.jcarousel ul#songs li.song p.song-title {
    font-size: 20px;
    font-weight: 600;
    margin: 10px 0 5px;
}

div.jcarousel ul#songs li.song p.song-artist {
    color: #b3b3b3;
    font-size: 16px;
    margin: 0;
}

div#controls {
    color: white;
    display: table;
    margin: 10px auto 30px;
    text-align: center;
    width: 75%;
    position:relative;
    z-index:3;
}

div#controls span {
    display: table-cell;
    font-size: 20px;
    vertical-align: middle;
}

div#controls span#play-btn {
    font-size: 34px;
}

div#controls span i {
    cursor: pointer;
}

.music_control {
    margin:15px 0;
    display:inline-block;
    position:relative;
    width:100%;
}

.music_control span.music_refresh {
    position:absolute;
    left:28px;
}

.music_control span.music_volume {
    position:absolute;
    right:70px;
}

.music_control span.invoice_music_refresh {
    position:absolute;
    left:180px;
}

div#sub-controls {
    color: #fff;
    cursor: default;
    font-size: 14px;
    margin: 20px 0 0;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    font-size:20px;
}

div#sub-controls .svg {
    height: 14px;
    position: relative;
    top: 2px;
    width: 14px;
}

div#sub-controls .svg path {
    fill: #999999;
}

div#sub-controls i, div#sub-controls .svg {
    margin: 0 15px;
}

div#sub-controls i.active, div#sub-controls .svg.active {
    color: #e74c3c;
}


div.invoice_btn_controls {
    color: #fff;
    cursor: default;
    font-size: 14px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    font-size:20px;

    position: relative;
    float:right;
    width: 65%;
    color: #a5a5a5;
    text-align: right;
}

div.invoice_btn_controls .svg {
    height: 14px;
    position: relative;
    top: 2px;
    width: 14px;
}

div.invoice_btn_controls .svg path {
    fill: #999999;
}

div.invoice_btn_controls i, div.invoice_btn_controls .svg {
    margin: 0 10px;
}

div.invoice_btn_controls i.active, div.invoice_btn_controls .svg.active {
    color: #e74c3c;
}


div#timeline {
    position: relative;
    margin: 0 auto;
    width: 92.5%;
}

div#timeline > span {
    color: #ddd;
    font-size: 15px;
    position: absolute;
    top: -30px;
}

div#timeline span#current-time {
    left: 0;
}

div#timeline span#total-time {
    right: 0;
}

div#timeline div.slider {
    background-color: #ddd;
    border-radius: 2px;
    cursor: pointer;
    height: 2px;
    position: relative;
    width: 100%;
}

div#timeline div.slider div.progress2 {
    background-color: #e74c3c;
    height: 100%;
    pointer-events: none;
    position: absolute;
    width: 0;
}

div#timeline div.slider div.progress2 div.pin {
    background-color: white;
    border-radius: 8px;
    height: 13px;
    position: absolute;
    pointer-events: all;
    right: -5px;
    top: -5px;
    width: 13px;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);
    -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.32);
    -webkit-transition: transform 0.25s ease;
    -moz-transition: transform 0.25s ease;
    -ms-transition: transform 0.25s ease;
    -o-transition: transform 0.25s ease;
    transition: transform 0.25s ease;
}

div#timeline div.slider div.progress2 div.pin:active {
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}

div#song-options div#song-info {
    margin: 0 0 20px;
    position: relative;
}

div#song-options div#song-info img {
    float: left;
    width: 50px;
    -webkit-box-shadow: 0 2px 5px rgba(50, 50, 50, 0.2);
    -moz-box-shadow: 0 2px 5px rgba(50, 50, 50, 0.2);
    box-shadow: 0 2px 5px rgba(50, 50, 50, 0.2);
}

div#song-options div#song-info div.artist-wrap {
    box-sizing: border-box;
    float: right;
    padding: 0 0 0 8px;
    width: calc(100% - 50px);
}

div#song-options div#song-info div.artist-wrap p {
    bottom: 4px;
    font-size: 16px;
    position: absolute;
}

div#song-options div#song-info div.artist-wrap p span {
    display: block;
}

div#song-options div#song-info div.artist-wrap p span.artist {
    font-size: 12px;
    font-weight: 300;
    margin: 4px 0 0;
}

div#song-options ul {
    font-size: 16px;
}

@keyframes spin {
    from {
        transform: rotateZ(0);
    }

    to {
        transform: rotateZ(1turn);
    }
}

.audiofile {
    width: 320px;
    margin: 0 auto;
}

.audiofile > .filebox > label {
    border: none;
}

.audiofile > .filebox {
    text-align: center;
}

.audiofile > .filebox > .upload-name {
    margin:0 auto;
    max-width:280px;
    text-align: center;
    display: block;
    color: #fff !important;
    background: none;
    border: none;
    font-size:17px;
}

.btn-tertiary {
    color: #e877ae;
    padding: 0;
    line-height: 50px;
    width: 300px;
    margin: auto;
    display: block;
    border: 2px solid #e877ae;
}

.btn-tertiary:hover, .btn-tertiary:focus {
    color: #fff;
    background: #e877ae;
}
/* input file style */
.input-file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.has-file {
    background:#ddd;
    border:2px solid #ddd;
    color:#fff;
}

.input-file + .js-labelFile {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 10px;
    cursor: pointer;
}

.input-file + .js-labelFile .icon:before {
    content: "\f093";
}

.input-file + .js-labelFile.has-file .icon:before {
    content: "\f00c";
    color: #5AAC7B;
}

.filebox .upload-thumb-wrap {
    display: inline-block;
    width: 54px;
    padding: 2px;
    vertical-align: middle;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #fff;
}

.filebox .upload-display img {
    display: block;
    max-width: 100%;
    width: 100% \9;
    height: auto;
}

.filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.filebox label {
    display: inline-block;
    padding: 6px 10px;
    color: #555;
    font-size: 14px;
    font-weight:500;
    line-height: normal;
    vertical-align: middle;
    background-color: #fdfdfd;
    cursor: pointer;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
    margin-bottom: 0;
}

/* named upload */
.filebox .upload-name {
    display: inline-block;
    padding: 6px 10px;
    font-size: 14px;
    font-family: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #f5f5f5;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.filebox label.file_del {
    display: inline-block;
    padding: 6px 10px;
    font-size: 13px;
    font-family: inherit;
    line-height: normal;
    vertical-align: middle;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.filebox label.file_ok {
    display: inline-block;
    padding: 15px 30px;
    font-size: 16px;
    font-family: inherit;
    font-weight:300;
    line-height: normal;
    vertical-align: middle;
    border: none;
    box-shadow:2px 3px 10px #ddd;
    background:#e877ae;
    color:#fff;
    border-radius: 2em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.filebox label.file_ok:hover {
    background:#e877ae;
}

.broad_cnt {
    margin-top: 0px;
    padding:0 20px;
    display:inline-block;
}

.broad_title {
    margin-left:10px;
}

.broad_name {
    position: relative;
    margin-top: 0;
    background: rgba(0, 0, 0, .3);
    color: #fff;
    text-align: center;
    padding: 5px 0;
}

.broad_name img {
    width:20px;
    margin-right:10px;
}

.broad_name > a.chat_name:link, a.chat_name:visited {
    color:#fff;
}

.broad_name > a.chat_name:hover {
    color:#e877ae;
}

.mental_broadcast > li > .user_rank_style {
    width: 70%;
    position: absolute;
    top: -9px;
    left: 0px;
    z-index: 4
}

.mental_broadcast > li.arrow {
    font-size: 16px;
    /*background: rgba(255, 255, 255, .3);*/
    border-radius: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    display: inline-block;
    margin-top: 3px;
    /*margin-left: -5px;*/
}

.user_img_wrap > span {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    display:inline-block;
    cursor: pointer;
    box-shadow:3px 3px 25px #333;
}

.user_img_wrap img {
    width: 100%;
}

.user_img_wrap2 > div.user_cj {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    background:#fff;
    border:1px solid #ddd;
}

.user_img_wrap2 > div.user_cj img {
    width: 100%;
}

.user_img_wrap2 > div.user_cj img:hover {
    cursor:pointer;
}



.chat_notifi_wrap {
    position: absolute;
    top: 5px;
    right: 20px;
    width: 240px;
    z-index: 5;
}

.chat_notifi_msg {
    width: 100%;
    color: #fff;
    font-size: 14px;
    padding: 10px 15px;
    border-radius: 5px;
    background: rgba(8, 8, 8, 0.8);
    clear: both;
    display: inline-block;
    margin: 2px 0;
    position: relative;
    top: -30px;
    right: -16px;
}

.chat_notifi_btn {
    width: 100%;
    text-align: right;
    color:#ffffff;
    font-size:14px;
    margin-bottom: 6px;
}

.cj_modal_ul > li > .user_img_wrap2 {
    width: 50px;
    height: 50px;
    display: inline-block;
    overflow: hidden;
    border-radius: 50%;
    border:1px solid #eee;
}

.cj_modal_ul > li > .user_img_wrap2 > img {
    width: 100%;
}

.cj_modal_ul {
    display: flex;
    font-size:14px;
}

.cj_modal_ul span.profile_report {
    position:absolute;
    top:20px;
    right:20px;
    width:18px;
}

.cj_modal_ul span.profile_report :hover {
    cursor:pointer
}

.cj_modal_ul span.profile_report img {
    width:100%;
}

.cj_modal_ul > li {
    float: left;
    margin-left: 10px;
}

.cj_modal_ul > li:first-child {
    margin-left:0;
    position:relative;
}

.cj_modal_ul > li.cj_info {
    width:calc(100% - 75px);
}

.cj_modal_ul > li > span.log {
    display: block;
    font-size: 13px;
    cursor: pointer;
}

.cj_info > ul > li.user_cnt {
    color: #999;
    margin: 0;
}

.cj_info > ul > li.cj_title {
    font-size: 16px;
    margin-top: 5px;
    font-weight: 500;
}

.cj_info > span {
    position: absolute;
    top: 20px;
    right: 10px;
    display:contents;
}

.achieve {
    margin-bottom:5px;
}

.achieve > span {
    font-size: 12px;
    border: 1px solid #999;
    border-radius: 3px;
    padding: 0 8px;
    background: aliceblue;
    color:#555;
}

.achieve > img {
    width:20px;
}

.cj_btn_following {
    /*background: url("/images/follow.png") no-repeat 15px center;*/
    background-size:16px;
    padding:6px 0;
    border:none;
    width:100%;
    font-size:14px;
    color:#999;
}

.cj_btn_follow {
    /*background-image: url("/images/following.png") no-repeat 15px center;*/
    background-color:#e877ae;
    color:#fff;
    padding:6px 0;
    background-size:16px;
    border:none;
    width:100%;
    font-size:14px;
}

.cj_btn_following img {
    width:18px;
}

.cj_btn_follow img {
    width:18px;
}

.cj_btn_following2 {
    /*background: url("/images/follow.png") no-repeat 15px center;*/
    background-size:16px;
    padding:6px 0;
    border:none;
    width:100%;
    font-size:14px;
}

.cj_btn_follow2 {
    /*background-image: url("/images/following.png") no-repeat 15px center;*/
    background-color:#e877ae;
    color:#fff;
    padding:6px 0;
    background-size:16px;
    border:none;
    width:100%;
    font-size:14px;
}

.cj_btn_following2 img {
    width:18px;
}

.cj_btn_follow2 img {
    width:18px;
}

.broad_cnt > li {
    float: left;
    margin-right: 20px;
    font-size: 14px;
}

.pd_line {
    background: #e877ae;
    /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #7c73f3, #e877ae);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #7c73f3, #e877ae);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #7c73f3, #e877ae);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #7c73f3, #e877ae);
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.level {
    font-family: 'Zilla Slab Highlight', cursive;
}

.cj_line {
    background-color: #ff6599;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.bdmin_line {
    background-color: #790000;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.staff_line {
    background-color: #f7941d;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.admin_line {
    background-color: #000000;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.listener_line {
    background-color: #acacac;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.hotlistener_line {
    background-color: #dc3545;
    padding: 0px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.favomem_line {
    background-color: #00c9c7;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.zzinfan_line {
    background-color: #0080ff;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.kingfan_line {
    background-color: #0080ff;
    padding: 1px 10px;
    margin-right: 5px;
    border-radius: 5px;
    color: #fff;
}

.cj_line_s {
    background-color: #ff6599;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.bdmin_line_s {
    background-color: #790000;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.staff_line_s {
    background-color: #f7941d;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.kingfan_line_s {
    background-color: #0080ff;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.zzinfan_line_s {
    background-color: #0080ff;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.favomem_line_s {
    background-color: #00c9c7;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.listen_play_btn3 {
    background:#f3f3f3;
    height:40px;
    width:180px;
    line-height:40px;
    border-radius:10px;
    padding:0 20px;
    display:inline-block;
}

.listen_play_btn3 > .d_btn_play {
    vertical-align:middle;
    text-align:center;
}

.listen_play_btn3 > .d_btn_play > span {
    width:40px;
    height:40px;
    text-align:center;
    border-radius:50%;
    vertical-align:middle;
    color:#666;
}

.volume {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 8px 0 0 10px;
}

.volume input[type=range] {
    display: none;
}

.volume .icon-size {
    font-size: 18px;
    color:#666;
}

.volume .bar-hoverbox {
    padding: 10px;
    opacity: 0.7;
    transition: opacity .2s;
}

.volume .bar-hoverbox:hover {
    opacity: 1;
    cursor: pointer;
}

.volume .bar {
    background: #999;
    height: 5px;
    width: 70px;
    border-radius: 15px;
    overflow: hidden;
    pointer-events: none;
}

.volume .bar .bar-fill {
    background: #e877ae;
    width: 0%;
    height: 100%;
    background-clip: border-box;
    pointer-events: none;
}

.admin_line_s {
    background-color: #000000;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.listener_line_s {
    background-color: #acacac;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.hotlistener_line_s {
    background-color: #dc3545;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.public_info {
    padding-left:50px;
}

.listen_tit {
    margin-top:10px;
}

.listen_tit .subj {
    font-size: 20px;
}

.listen_tit .subj2 {
    font-size: 16px;
    color:#e877ae;
}

.listen_hash {
    font-size: 14px;
    margin: 10px 0 0 0px;
}

.listen_hash span {
    padding: 3px 10px;
    border: 1px solid #fff;
    border-radius: 15px;
}

.invoice_tit {
    margin-top: 0px;
}

.invoice_tit .subj {
    font-size: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.invoice_tit .subj2 {
    font-size: 16px;
    color:#e877ae;
}

.invoice_tit > li {
    height: 36px;
}

.invoice_hash {
    font-size: 14px;
    margin: 10px 0 0 0px;
}

.invoice_hash span {
    padding: 3px 10px;
    border: 1px solid #fff;
    border-radius: 15px;
    background-color: #f3f3f3;
}

.color-red {
    color: #e03629;
    font-weight: 400;
}

.listen_play_btn {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin-left: -50px;
    margin-top: -50px;
    cursor: pointer;
}

.listen_play_btn img {
    width: 100%;
}

.listen_bottom {
    color: #fff;
    width: 100%;
    /*margin: 0 5%;*/
    position: absolute;
    bottom: 170px;
    left: 0;
}

.invoice_bottom {
    color: #fff;
    width: 100%;
    position: absolute;
    bottom: 20px;
    left: 0;
}

.listen_cnt {
    margin-bottom: 30px;
}

.listen_cnt span {
    display: inline-block;
    width: 55px;
}

.listen_cnt span img {
    margin-bottom: 4px;
}

.progress_wrap {
    width: 100%;
    display: table;
    clear: both;
}

.progress_wrap li {
    float: left;
}

.start_time,
.end_time {
    width: 80px;
}

.end_time {
    text-align: right;
}

.progress_box {
    width: calc(100% - 160px);
}

.progress {
    height: 8px;
    margin-top: 8px;
}

.gift {
    margin: 15px 0 10px;
}

.thumbnail-wrapper2 {
    width: 168px;
    height: 94px;
    overflow: hidden;
    margin: 0;
    position: relative;
    float: left;
    margin-right: 10px;
    border-radius: 5px;
    border: 1px solid #ebebeb;
    cursor:pointer;
}
/*
.thumbnail-wrapper2 div {
	width:100%;
	height:100%;
}*/

.thumbnail-wrapper2 img {
    width: 100%;
    height:100%;
}

.dubbing_thumb {
    background:#3f515f;
}

.dubbing_thumb img {
    height:auto;
    transform:translate(0, -20px);
}

.dubbing_thumb:after {
    position:absolute;
    background:rgba(0,0,0,.3);
    width:100%;
    height:100%;
    content:'';
    left:0;
    top:0;
    z-index:2;
}

.thumbnail-wrapper3 {
    width: 160px;
    overflow: hidden;
    margin: 0;
    position: relative;
    float: left;
    margin-right: 10px;
    border-radius: 5px;
}

.thumbnail-wrapper3 img {
    width: 100%;
    height:100%;
}

.chat_list_txt {
    width: calc(100% - 200px);
    float: left;
}

.chat_list_txt1 {
    font-size: 18px;
    font-weight:500;
}

.chat_list_txt2 {
    width: 40px;
    margin: 0;
    float: left;
    margin: 15px 10px 15px;
    position: relative;
}

.chat_list_txt3 {
    margin-top: 5px;
    display:inline-block;
    width: calc(100% - 60px);
}

.chat_list_cnt {
    margin: 5px 0;
}

.chat_broad_name {
    font-weight: 600;
    color: #e877ae;
}

.chat_user_type1 {
    background-color: #f06eaa;
    color: #fff;
    padding: 1px 5px;
    border-radius: 5px;
    margin-bottom:10px;
}

.chat_user_type2 {
    background-color: #a0410d;
    color: #fff;
    padding: 1px 5px;
    border-radius: 5px;
    margin-bottom:10px;
}

.chat_user_type3 {
    background-color: #f7941d;
    color: #fff;
    padding: 1px 5px;
    border-radius: 5px;
    margin-bottom:10px;
}

.chat_user_type4 {
    background-color: #acacac;
    color: #fff;
    padding: 1px 5px;
    border-radius: 5px;
    margin-bottom:10px;
}

.listen_txt {
    width: calc(100% - 200px);
    float: left;
    margin: 0;
    padding: 10px 20px;
}

.invoice_txt {
    width: calc(100% - 200px);
    float: left;
    margin: 0;
    padding: 4px;
    color: #5c5c5c;
}

.listen_reply_box {
    display: table;
    clear: both;
    margin: 15px 0;
    width: 100%;
}

.listen_reply_box p {
    float: left;
}

.listen_reply_box li.listen_img_wrap {
    width: 45px;
    height: 45px;
    margin-right: 10px;
    margin-bottom: 10px;
    overflow: hidden;
    border-radius: 50%;
    display:inline-block;
    float:left;
}

.listen_reply_box li.listen_img_wrap:hover {
    cursor: pointer;
}

.listen_reply_box p.listen_reply_id span {
    color: #999;
    font-weight: 300;
}

.listen_reply_box p.listen_msg {
    width: 70%;
    color: #555;
}

.listen_reply_box p.listen_reply_option {
    font-size: 14px;
    float: right;
}

.listen_reply_box .btn_play {
    border:1px solid #ddd;
    width:120px;
    height:40px;
    display:inline-block;
    text-align:center;
    line-height:40px;
    cursor:pointer;
    background:#e877ae;
    color:#fff;
}

.listen_reply_box2 {
    display: table;
    clear: both;
    margin: 20px 0;
    border-bottom: 1px solid #ddd;
    width: 100%;
    padding: 20px 0;
}

.listen_reply_box2 p {
    float: left;
    display:inline-block;
}

.listen_reply_box2 p.listen_img_wrap {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.listen_reply_box2 li.listen_reply_id {
    height: 27px;
    line-height: 27px;
    overflow: hidden;
    width: calc(100% - 60px);
    color: #333;
    font-weight:300;
}

.listen_reply_box2 li.listen_reply_id span {
    color: #222;
    font-weight:500;
}

.listen_reply_box2 p.listen_msg {
    width: 70%;
    color: #555;
}

.listen_reply_box li.listen_reply_option {
    font-size: 13px;
    position:absolute;
    right: 17px;
    top:5px;
}

.dropdown-option {
    position: relative;
    float:left;
}

.dropdown-option > span {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.dropdown-option > span,
.dropdown-option > div {
    cursor: pointer;
    outline: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.dropdown-option > div {
    background-color: rgba(0, 0, 0, 0);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
}

.dropdown-option > span:focus ~ div {
    display: block;
}

.dropdown-option > ul {
    position: absolute;
    z-index: 1;
    visibility: hidden;
    transition: visibility 0.5s;
    border:1px solid #ddd;
    background:#fff;
    opacity: 0;
    right:3px;
    border-radius:5px;
}

.dropdown-option > span:focus ~ ul {
    visibility: visible;
    opacity: 1;
}

.dropdown-option2 {
}

.dropdown-option2 > span {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.dropdown-option2 > span,
.dropdown-option2 > div {
    cursor: pointer;
    outline: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.dropdown-option2 > div {
    background-color: rgba(0, 0, 0, 0);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
}

.dropdown-option2 > span:focus ~ div {
    display: block;
}

.dropdown-option2 > ul {
    position: absolute;
    z-index: 3;
    visibility: hidden;
    transition: visibility 0.5s;
    border:1px solid #ddd;
    background:#fff;
    opacity: 0;
    top:35px;
    right:3px;
    border-radius:5px;
    font-size:15px;
}

.dropdown-option2 > span:focus ~ ul {
    visibility: visible;
    opacity: 1;
}

/* The .sample-menu-style below is for illustration purpose.
   Feel free to use different style. */

.sample-menu-style > span {
    color: #999;
}

.sample-menu-style > span:hover {
    opacity: 0.75;
}

.sample-menu-style > ul {
    padding: 0;
    margin-top: 2px;
}

.sample-menu-style li {
    border-bottom: 1px solid #ddd;
    height: 26px;
    line-height:26px;
    width:140px;
    text-align:center;
    white-space: nowrap;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.sample-menu-style li:last-child {
    border-bottom:none;
}

.sample-menu-style li:not(:first-child) {
    border-top: none;
}

.sample-menu-style li:hover {
    background: #f8f8f4;
}

.sample-menu-style a {
    text-decoration: none;
    color: #555;
}

.listen_reply_box {
    position:relative;
}

.listen_reply_box p {
    float: left;
}

.listen_reply_box li.listen_img_wrap img {
    width: 100%;
}

.listen_reply_box li.listen_reply_id {
    line-height: 24px;
    float:left;
    font-size: 15px;
    font-weight:500;
    width:calc(100% - 60px);
    margin-bottom:10px;
    word-break:break-all;
}

.listen_reply_box li.listen_reply_id span.listen_reply_time {
    color: #999;
    font-size:12px;
    font-weight:200;
    display:block;
}

.listen_reply_box li.listen_msg {
    font-size: 14px;
    color:#666;
    line-height:20px;
    font-weight:300;
    margin-top:5px;
    padding-right: 20px;
}

.listen_reply_box li.listen_msg span{
    position:absolute;
    right:0;
}

.listen_reply_box li.listen_msg span .far {
    color:#ff0000;
}

.listen_reply_box .listen_msg2 {
    font-size: 14px;
    color:#666;
    border-radius:5px;
    line-height:20px;
    font-weight:300;
    background:#f9f9f9;
    display:flow-root;
    width:100%;
    position:relative;
}

.listen_msg2_wrap {
    margin:10px;
    position:relative;
    display:inline-block;
    width:calc(100% - 20px);
}

.listen_reply_box .listen_msg2 span .far {
    color:#ff0000;
}


.listen_msg2 li.listen_img_wrap > span {
    width: 45px;
    height: 45px;
    margin-right: 10px;
    margin-bottom: 10px;
    overflow: hidden;
    border-radius: 50%;
    display:inline-block;
    float:left;
}

.listen_reply_box li.listen_img_wrap:hover {
    cursor: pointer;
}

.listen_reply_box li.listen_reply_option span.btn_rec {
    float:left;
}

.listen_reply_box .btn_play {
    border:1px solid #ddd;
    width:120px;
    height:40px;
    display:inline-block;
    text-align:center;
    line-height:40px;
    cursor:pointer;
    background:#e877ae;
    color:#fff;
}

.listen_reply_option img {
    margin-bottom: 3px;
    margin-left: 10px;
    width:13px;
}

.listen_reply_write {
    margin-bottom:50px;
    position: absolute;
    bottom: 0;
    margin-bottom: 0;
    background: #fff;
    left: 0;
    padding: 10px;
    width:100%;
    z-index:5;
}

.listen_reply_write textarea {
    width: calc(100% - 100px);
    border: 0;
    float:left;
    border:1px solid #ddd;
    height:65px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    resize:none;
}

.bsrm_reply_write textarea {
    width: calc(100% - 50px);
    border: 0;
    float: left;
    border: 1px solid #ddd;
    height: 65px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    resize: none;
}

.bsrm_reply_write_btn {
    background: #e877ae;
    border: 0;
    color: #fff;
    width: 50px;
    height: 65px;
    display: inline-block;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    float: left;
}

.invoice_reply_write {
    margin-bottom: 30px;
    background: #fff;
    left: 0;
    padding: 20px 10px 6px 0px;
    width:100%;
    z-index:5;
}

.invoice_reply_write textarea {
    width: calc(100% - 100px);
    border: 0;
    float:left;
    border:1px solid #ddd;
    height:65px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    resize:none;
}

.listen_msg2_wrap > li.listen_img_wrap > .level_border_in {
    top:0;
}

.listen_reply_write2 {
    width:100%;
    z-index:5;
    display:inline-block;
}

.listen_reply_write2 textarea {
    width: calc(100% - 100px);
    border: 0;
    float:left;
    border:1px solid #ddd;
    height:65px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    resize:none;
    padding:10px;
    font-size:13px;
    color:#888;
    font-weight:400;
}

.listen_reply_write3 {
    width:100%;
    z-index:5;
    display:inline-block;
}

.listen_reply_write3 textarea {
    width: calc(100% - 110px);
    border: 0;
    float:left;
    border:1px solid #ddd;
    height:65px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    resize:none;
    padding:10px;
    font-size:13px;
    color:#888;
    font-weight:400;
}

.listen_reply_write_text {
    display:inline-block;
}

.listen_reply_write_btn {
    /*background: #e877ae;*/
    /* For browsers that do not support gradients */
    /*background: -webkit-linear-gradient(left, #7c73f3, #e877ae);*/
    /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(right, #7c73f3, #e877ae);*/
    /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(right, #7c73f3, #e877ae);*/
    /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(to right, #7c73f3, #e877ae);*/

    background: #cbcbcb;
    border: 0;
    color: #fff;
    width:100px;
    height:65px;
    display:inline-block;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    float:left;
}

.listen_reply_list {
    width: 100%;
    height:100%;
}

.listen_reply_list > #listen_reply_ul {
    padding-bottom:80px;
}

.invoice_bg_status {
    left: calc(50% - 30px);
    top: calc(50% - 30px);
    position: relative;
    font-size: 60px;
    cursor: pointer;
    width: 60px;
    height: 60px;
    display: none;
}

.invoice_reply_list {
    width: 100%;
}

.invoice_reply_list > #listen_reply_ul {
    padding-bottom:80px;
}


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

.listen_broadlist2 {
    width: 100%;
    max-height: 600px;
    display: none;
}

.btn_rec {
    display: inline-block;
    height: 18px;
    line-height: 18px;
    position: relative;
    float:left;
    font-size: 12px;
    text-decoration: none;
}

.btn-counter:after,
.btn-counter:hover:after {
    text-shadow: none;
}

.btn-counter:after {
    padding: 0 5px;
    color: #777;
    content: attr(data-count);
}

.btn_rec {
    border-color: #bbb;
    color: #666;
}

.btn_rec.active {
    color:#333;
}

.btn_rec span {
    color: #222;
}

.btn_rec.active, .btn_rec.active span {
    color: #f64136;
}

.user_type_ul {
    margin-top:10px;
    margin-bottom:30px;
    display:inline-block;
    font-size:15px;
}

.alram {
    width: 320px;
    position: absolute;
    top: 50px;
    right: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    display: none;
}

.alram_hidden {
    height:100%;
    min-height:100%;
    overflow:hidden !important;
    touch-action:none;
}

.mission_wrap {
    width: 330px;
    position: absolute;
    top: 50px;
    right: 10px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    display: none;
}

.mission_wrap > h2 {
    font-size:14px;
    position:absolute;
    width:100%;
    text-align:center;
    top:17px;
}

.mission_box {
    background:#fff;
    margin:50px 10px 10px 10px;
}

.mission_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.mission_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.mission_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.mission_scroll {
    overflow:auto;
    height:480px;
}

.alram_top {
    padding: 5px 10px;
    clear: both;
    border-bottom: 1px solid #ddd;
}

.alram_top span {
    font-size: 13px;
}

.top_menu li:nth-child(2).login_top_menu span.alram_clear {
    color: #E877AE;
    float: right;
}

.top_menu li:nth-child(2).login_top_menu span.alram_clear:hover {
    cursor:pointer;
    text-decoration:underline;
}

.alram_ul {
    width: 100%;
}

.alram_ul > li.alram_li {
    /*padding: 10px 20;*/
    padding: 7px 15px;
    width: 100%;
    position: relative;
    margin: 0;
    display:flex;
    cursor: pointer;
    font-size: 12px;
    border-bottom: 1px solid #ddd;
}

.alram_ul > li.alram_li:hover {
    background-color: #f9f9f9;
}

.alram_ul > li.alram_li > span {
    line-height:23px;
    display:inline-block;
    vertical-align:middle;
}

.top_bar ul li:nth-child(2).alram_li {
    float: static;
}

.alram_ul > li.alram_li > ul {
    display:inline-block;
    width:100%;
}

.alram_ul > li.alram_li > ul > li {
    float:left;
    vertical-align:middle;
    position:relative;
}

.alram_ul > li.alram_li > ul > li:first-child {
    width:45px;
}

.alram_ul > li.alram_li > ul > li:nth-child(2) {
    width:calc(100% - 55px);
}

.alram_li > ul > li > .alram_img {
    width:35px;
    height:35px;
    border-radius:50%;
    overflow:hidden;
    border:1px solid #ddd;
    display:block;
}

.alram_li > ul > li > .alram_img img {
    width:100%;
    vertical-align:baseline;
}

.alram_li > ul > li > .alram_txt {
    display:block;
    line-height:16px;
    font-size:13px;
    color:#333;
}

.alram_li > ul > li > .alram_time {
    display:block;
    line-height:20px;
    font-size:12px;
    color:#aaa;
}

.alram_ul .active {
    background-color: #f9f9f9;
}

.alram_delete {
    position: absolute;
    top: 9px;
    right: 10px;
    color: #aaa;
    display:flex;
    z-index:222;
    font-size:14px;
}

.alram_delete:hover {
    color:#E877AE;
}

.alram_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.alram_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.alram_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.alram_scroll {
    overflow:auto;
    height:350px;
}


.listen_list_item {
    width: 100%;
    clear: both;
    padding: 10px 0px;
    margin-bottom: 20px;
    display:inline-block;
}

.invoice_list_item {
    width: 100%;
    clear: both;
    padding: 4px 0px;
    /*margin-bottom: 20px;*/
    display:inline-block;
}

.origin_back {
    font-size: 24px;
    cursor: pointer;
    position: absolute;
    top: 12px;
    left: 30px;
}

.oc_top {
    position: relative;
    text-align: center;
    font-size: 20px;
    padding: 10px 20px;
    background:#eee;
    color:#555;
}

.oc_bottom {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.dubbing_txt {
    border: 1px solid #666;
    background: Rgba(0,0,0,.3);
    /* background-color: white; */
    width: 70%;
    margin: 0 auto;
    padding: 20px;
    color: #ddd;
    border-radius: 15px;
    margin-top: 70px;
}

.oc_bottom2 {
    width: 100%;
    color:#fff;
    text-align:center;
    padding:30px 0;
    line-height:32px;
    font-size:18px;
    position:absolute;
    top:100px;
}

.oc_bottom2 > .oc_control > .oc_control_line1 > .oc_good {
    top:15px;
}

.oc_bottom2 > .oc_control > .oc_control_line1 > .oc_reply {
    top:15px;
    right:30px;
}

.oc_title {
    width: 100%;
    padding: 3%;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.35);
    clear: both;
    position: relative;
}

.oc_title2 {
    color: #fff;
    font-weight: 500;
    font-size: 15px;
    clear: both;
    position: relative;
    height: 35px;
    background: rgba(255, 255, 255, 0.1);
    margin: 5px 10px;
    border-radius: 25px;
}

.oc_title_wrap {
    width: calc(100% - 76px);
    margin: 0 auto;
    position: relative;
    height: 36px;
    overflow: hidden;
}

.oc_control {
    padding: 30px 0;
    position: relative;
}

.play_txt1 {
    font-size: 26px;
    width: calc(100% - 38px);
    height: 45px;
    position: relative;
    overflow: hidden;
    margin: 0;
    line-height: 45px;
}

.play_txt1_1 {
    position: relative;
    overflow:hidden;
    height:35px;
}

.music_icon02 {
    position: absolute;
    top: 3px;
    left: 5px;
}

.sitemessage {
    height:100%;
    display: inline-block;
    white-space: nowrap;
    padding-left:100%;
    /*Initial offset*/
    line-height: 35px;
    /* Starting position */
    -moz-transform:translateX(100%);
    -webkit-transform:translateX(100%);
    transform:translateX(100%);
    /* Apply animation to this element */
    -moz-animation: sitemessage 20s linear infinite;
    -webkit-animation: sitemessage 20s linear infinite;
    animation: sitemessage 20s linear infinite;
}

.sitemessage:after {
    content:"";
    white-space:nowrap;
    padding-right:50px;
}

@-webkit-keyframes sitemessage {
    from   { -webkit-transform: translate(0%);}
    99%,to { -webkit-transform: translate(-100%);}
}
@-moz-keyframes sitemessage {
    from   { -moz-transform: translate(0%);}
    99%,to { -moz-transform: translate(-100%);}
}
@-ms-keyframes sitemessage {
    from   { -ms-transform: translate(0%);}
    99%,to { -ms-transform: translate(-100%);}
}
@-o-keyframes sitemessage {
    from   { -o-transform: translate(0%);}
    99%,to { -o-transform: translate(-100%);}
}
@keyframes sitemessage {
    from   { transform: translate(0%);}
    99%,to { transform: translate(-100%);}
}

.sitemessage:hover {
    -moz-animation-play-state: paused;
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
}

.oc_icon01 {
    float: left;
    margin-top: 5px;
}

.sitemessage:hover {
    animation-play-state: paused;
}

@keyframes floatText {
    to {
        transform: translateX(-100%);
    }
}

.play_txt2 {
    font-size: 14px;
    color: #aaa;
    margin-top: -20px;
}

.oc_control_line1 {
    position: relative;
    font-size: 19px;
    font-weight: 600;
}

.oc_good {
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}

.oc_reply {
    position: absolute;
    bottom: 15px;
    right: 15px;
    cursor: pointer;
    font-size:12px;
    width:50px;
    height:50px;
    border-radius:50%;
    z-index:4;
    background:#e877ae;
    box-shadow:0px 1px 8px #444;
}

.oc_reply span {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

.oc_control_line2 {
    position: relative;
    line-height: 72px;
    text-align: center;
    font-size: 24px;
    margin-top: 20px;
}

.oc_left {
    position: absolute;
    top: 120px;
    left: 50%;
    margin-left: -120px;
    cursor: pointer;
}

.oc_right {
    position: absolute;
    top: 120px;
    left: 50%;
    margin-left: 90px;
    cursor: pointer;
}

.user_cnt {
    margin-top: 10px;
    clear: both;
    font-size: 15px;
}

.user_cnt img {
    margin-bottom: 3px;
}

.wsp_everyone {
    cursor: pointer;
    position: absolute;
    top: -33px;
    left: 66px;
    font-size: 26px;
    color: #373737;
    z-index: 8;
}

.wsp_target {
    display: none;
    cursor: pointer;
    position: absolute;
    top: -32px;
    left: 50px;
    z-index: 8;
}

.user_cnt .chatting_user_wrap {
    display: inline-block;
    text-align: center;
    margin: 14px 0 0 15px;
}

.mental_broadcast {
    position: absolute;
    right: 15px;
    z-index: 1;
    top: -30px;
}

.invoice_heart_user {
    position: relative;
    height: 90px;
    padding: 23px 0;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 30px;
}

.invoice_heart_user_icon {
    float:left;
    padding-top:8px;
    padding-right:8px;
    /*color:#e877ae;*/
    font-size:16px;
}

.invoice_heart_user ul {
    list-style: none;
    /*float: right;*/
    /*background: rgba(8, 8, 8, 0.3);*/
    border-radius: 30px;
    /*padding: 10px 10px 14px 10px;*/
}

.invoice_heart_user ul p {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 0 -8px 0;
    border: 1px solid #e877ae;
    box-sizing: border-box;
    position: relative;
}

.invoice_heart_user ul p img {
    width: 100%;
    height: 100%;
    margin-bottom: 7px;
}

.user_rank_wrap {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 0 -8px 0;
    padding: 0;
    border: 2px solid #e877ae;
    box-sizing: border-box;
    position: relative;
}

.user_rank_wrap img {
    width: 100%;
    height: 100%;
    margin-bottom: 7px;
}

.chat_data_ul {
    clear: both;
    display: table;
    padding:0 20px;
    position: relative;
    width: 100%;
}

.chat_data_ul li {
    position: relative;
    float: left;
}

.chat_data_ul li.pairing_icon {
    position: absolute;
    top: -5px;
    right: -10px;
}

.mute_icon {
    position: absolute;
    top: 4px;
    right: 15px;
    display:table;
}

.mute_icon span {
    width:28px;
    height:28px;
    display:table-cell;
    background:#222;
    color:#fff;
    border-radius:50%;
    text-align:center;
    vertical-align:middle;
    font-size:15px;
}

.mute_icon span i {
    font-size:13px;
}

.broad_time {
    position:absolute;
    color:#fff;
    top:7px;
    right:90px;
    font-size: 13px;
}

.balloon {
    position:absolute;
    width:230px;
    right:10px;
    padding:15px;
    top:90px;
    background:rgba(0,0,0,.5);
    border-radius: 10px;
    z-index:4;
    color:#fff;
    font-size:13px;
}

.balloon:after {
    border-top:0px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid rgba(0,0,0,.5);
    content:"";
    position:absolute;
    top:-10px;
    left:190px;
}

.btn_extension {
    background:rgba(232,119,174,.7);
    border:none;
    border-radius:5px;
}

.one_hours {
    padding:30px 0 !important;
}

.btn_one {
    text-align:center;
    border:1px solid #333;
    padding:10px;
    cursor:pointer;
}

.balloon h2 {
    font-size:16px;
    margin-bottom:10px;
}

.balloon p {
    text-align:center;
}

.chat_option {
    position: absolute;
    top: -2px;
    right: 18px;
    font-size: 24px;
    cursor: pointer;
}

.chat_option span {
    margin-left:10px;
}

.chat_option img {
    width:16px;
}

.chat_option2 {
    position: absolute;
    top: 20px;
    right: 25px;
    cursor:pointer
}

.chatting_write_box {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
}

.chatting_write_btn {
    position: absolute;
    font-size: 17px;
    top: 11px;
    right: 130px;
    color: #333;
    background-color: #fff;
    border: 1px solid #333;
    padding: 10px 15px;
    border-radius: 5px;
}

.chatting_write_box > input {
    color: #000;
    border-radius: 25px;
    text-indent: 15px;
    position: absolute;
    left: 55px;
    display: inline-block;
    bottom: 10px;
    z-index: 7;
    height: 42px;
    font-size: 16px;
    width: calc(100% - 315px);
    margin-top: 2px;
    padding-right: 36px;
    padding-left: 33px;
}

.play_btn_wrap {
    /*
    width:95%;
    height:50px;
    bottom:10px;
    left:50%;
    transform:translate(-50%, 0);
    */
    width:26px;
    height:26px;
    left:4px;
    cursor:pointer;
    z-index: 2000;
    font-size: 24px;
    position:absolute;
    display:none;
    z-index:8;
}

.chat_box {
    width: calc(100% - 260px);
    color: #000;
    float: left;
    border-radius: 25px;
    height: 45px;
    line-height:40px;
    text-indent: 15px;
    margin-right:10px;
    resize:none;
    overflow:hidden;
}

.bsp-progress-panel {
    height: 30px;
    width: 100%;
    cursor: pointer;
}

.bsp-progress-panel .bsp-progress-slider {
    position: relative;
    height: 100%;
}

.bsp-progress-panel .bsp-progress-slider-track {
    height: 2px;
    width: 100%;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -1px;
    background: gray;
}

.bsp-progress-panel .bsp-progress-slider-progress {
    height: 100%;
    width: 0%;
    background: red;
    position: relative;
}

.bsp-progress-panel .bsp-progress-slider-handle {
    height: 12px;
    width: 12px;
    position: absolute;
    top: -5px;
    right: -6px;
    background: white;
    border-radius: 6px;
}

.bsp-volume-panel {
    height: 10px;
    width: 60px;
    cursor: pointer;
    display:inline-block;
    float:right;
    margin:2px;
}

.bsp-volume-panel .fa {
    color:#fff;
    font-size:24px;
    float:left;
    width:45px;
    height:45px;
    line-height:45px;
    display:inline-block;
    text-align:center;
}

.bsp-volume-panel .bsp-volume-slider {
    position: relative;
    height: 100%;
    width:60px;
    float:left;
    display:inline-block;
    margin-left:8px;
}

.bsp-volume-panel .bsp-volume-slider-track {
    height: 2px;
    width: 100%;
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -1px;
    background: #aaa;
}

.bsp-volume-panel .bsp-volume-slider-progress {
    height: 100%;
    width: 0%;
    background: red;
    position: relative;
}

.bsp-volume-panel .bsp-volume-slider-handle {
    height: 14px;
    width: 14px;
    position: absolute;
    top: -6px;
    right: -6px;
    background: white;
    border-radius: 6px;
}

/* Icons button */
.icobutton {
    font-size: 3em;
    position: relative;
    margin: 0;
    padding: 0;
    color: #c0c1c3;
    border: 0;
    background: none;
    overflow: visible;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.icobutton .fa {
    display: block;
    padding: 0 0.1em;
}

.icobutton__text {
    font-size: 0.75em;
    position: absolute;
    top: 100%;
    left: -50%;
    width: 200%;
    text-align: center;
    line-height: 1.5;
    color: #a6a6a6;
}

.icobutton__text--side {
    top: 0;
    left: 100%;
    width: 100%;
    width: auto;
    padding: 0 0 0 0.25em;
}

/* fix for mo.js */
.icobutton svg {
    left: 0;
}

.icobutton:hover,
.icobutton:focus {
    outline: none;
}

/* Unicorn */
.icobutton--unicorn svg {
    fill: #c0c1c3;
}

.special-link {
    position: relative;
    color: #f64040;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.special-link svg {
    left: 0;
}

.special-link:hover,
.special-link:focus {
    color: #D52828;
}

.codrops-header {
    position: relative;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-items: center;
    align-items: center;
    padding: 1.75em 0.85em 1.5em;
    letter-spacing: 1px;
}

.main-title {
    font-size: 2.5em;
    line-height: 1;
    padding: 1em 0.5em 0;
    margin: 0;
    text-align: center;
    width: 100%;
}

.main-title__upper {
    display: block;
    padding: 0 0 1.5em 0;
    font-size: 0.65em;
    color: #aaa;
    letter-spacing: 5px;
    text-indent: 5px;
    font-family: 'Patrick Hand SC', cursive;
}

.dotted {
    color: #f64040;
}

.dotted::before,
.dotted::after {
    content: '\2022';
    font-size: 0.75em;
    opacity: 0.4;
}

.main-info {
    padding: 2em 1em 0;
    margin: 0 auto;
    font-weight: bold;
    color: #D1CECE;
    max-width: 40em;
    text-align: center;
}

/* Top Navigation Style */

.codrops-links {
    position: relative;
    display: inline-block;
    text-align: center;
    white-space: nowrap;
    pointer-events: auto;
}

.codrops-links::after,
.codrops-demos a:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1px;
    height: 100%;
    background: #aaa;
    -webkit-transform: translateY(-50%) rotate3d(0, 0, 1, 22.5deg);
    transform: translateY(-50%) rotate3d(0, 0, 1, 22.5deg);
}

.codrops-icon {
    display: inline-block;
    width: 1.5em;
    margin: 0 0.5em;
    text-decoration: none;
}

.codrops-icon span {
    display: none;
}

.codrops-icon::before {
    font-family: 'codropsicons';
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    margin: 0 5px;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    speak: none;
}

.codrops-icon--drop::before {
    content: '\e001';
    color: #988ADE;
}

.codrops-icon--prev::before {
    content: '\e004';
}

/* Demo links */
.codrops-demos {
    font-weight: bold;
    line-height: 1;
    margin: 0 1em 0 auto;
    text-align: center;
}

.codrops-demos a {
    position: relative;
    display: inline-block;
    pointer-events: auto;
}

.codrops-demos a:not(:last-child)::after {
    left: calc(100% + 0.5em);
}

.codrops-demos a:not(:last-child) {
    margin: 0 1em 0.1em 0;
}

.codrops-demos a.current-demo {
    color: #504f55;
}

.grid {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    padding: 0;
    list-style: none;
    max-width: 60em;
    margin: 3em auto 0;
}

.content--related {
    font-weight: bold;
    padding: 8em 1em;
    margin: 15em 0 0;
    text-align: center;
    background: #26252a;
    color: #f0f0f0;
}

.media-item {
    display: inline-block;
    padding: 1em;
    vertical-align: top;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.media-item__img {
    max-width: 100%;
    opacity: 0.3;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
}

.media-item:focus .media-item__img,
.media-item:hover .media-item__img {
    opacity: 1;
}

.media-item:focus,
.media-item:hover {
    color: #988ADE;
}

.media-item__title {
    font-size: 1em;
    margin: 0;
    padding: 0.5em;
}

.chat_icon_btn {
    margin: 2px;
    float: left;
    width: 20px;
    height: 30px;
    font-size: 20px;
    border-radius: 2px;
    color: #fff;
    display: block;
    text-align: center;
    position:relative;
    line-height: 30px;
}

.chat_icon_btn2 {
    margin: 2px;
    float: left;
    width: 110px;
    font-size: 20px;
    border-radius: 2px;
    color: #fff;
    display: block;
    text-align: left;
    height: 35px;
    line-height: 30px;
}

.chat_menu_btn {
    display:inline-block;
    position:absolute;
    bottom:15px;
}

.chat_btn1 {
    position:absolute;
    right:140px;
    bottom:10px;
}

.chat_btn2 {
    position:absolute;
    bottom:15px;
    right:95px;
}

.chat_btn3 {
    position:absolute;
    bottom:15px;
    right:55px;
}

.chat_btn4 {
    position:absolute;
    bottom:15px;
    right:15px;
}

.one_minute_icon {
    position:absolute;bottom:40px;
}

.one_minute_icon img {
    animation: lock 1s cubic-bezier(.36,.07,.57,.99) infinite;
    width:23px;
}

@keyframes lock {
    0% {
        transform: scale(1.5) translateY(0);
    }
    20% {
        transform: scale(1.5) translateY(-5px);
    }
    30% {
        transform: scale(1.5) translateY(5px);
    }
    50% {
        transform: scale(1.5) translateY(-5px);
    }
    60% {
        transform: scale(1.5) translateY(5px);
    }
    100% {
        transform: scale(1.5) translateY(0);
    }
}

.music_menu {
    z-index:222;
}

.music_menu label {
    margin-bottom:0;
}

.menu-toggler {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 40px;
    height: 40px;
    z-index: 2;
    opacity: 0;
    cursor: pointer;
}

.menu-toggler:hover + label,
.menu-toggler:hover + label:before,
.menu-toggler:hover + label:after {
    background: white;
}

.menu-toggler:checked + label {
    background: transparent;
}

.menu-toggler:checked + label:before,
.menu-toggler:checked + label:after {
    top: 0;
    width: 40px;
    transform-origin: 50% 50%;
}
.menu-toggler:checked + label:before {
    transform: rotate(45deg);
}
.menu-toggler:checked + label:after {
    transform: rotate(-45deg);
}

.menu-toggler:checked ~ ul .menu-item {
    opacity: 1;
}

.menu-toggler:checked ~ ul .menu-item:nth-child(1) {
    transition-duration: 180ms;
    -webkit-transition-duration: 180ms;
    -webkit-transform: translate3d(0.08361px, -40px, 0);
    transform: translate3d(0.08361px, -40px, 0);
}

.menu-toggler:checked ~ ul .menu-item:nth-child(2) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -80px, 0);
    transform: translate3d(0.08361px, -80px, 0);
}

.menu-toggler:checked ~ ul .menu-item a {
    pointer-events: auto;
}

.menu-toggler + label {
    width: 40px;
    height: 5px;
    display: block;
    z-index: 1;
    border-radius: 2.5px;
    background: rgba(255, 255, 255, 0.7);
    transition: transform 0.5s, top 0.5s;
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

.menu-toggler + label:before,
.menu-toggler + label:after {
    width: 40px;
    height: 5px;
    display: block;
    z-index: 1;
    border-radius: 2.5px;
    background: rgba(255, 255, 255, 0.7);
    transition: transform 0.5s, top 0.5s;
    content: "";
    position: absolute;
    left: 0;
}

.menu-toggler + label:before {
    top: 10px;
}

.menu-toggler + label:after {
    top: -10px;
}

.menu-item {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 40px;
    height: 40px;
    display: block;
    opacity: 0;
    transition: 0.5s;
    cursor:pointer;
}

.menu-item span {
    display: block;
    width: inherit;
    height: inherit;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    font-size: 20px;
    pointer-events: none;
    transition: 0.2s;
    cursor:pointer;
}

.menu_green {
    background-color: #70CC72;
    box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12);
    border-radius: 50%;
}

.menu_red {
    background-color: #FE4365;
    box-shadow: 3px 3px 0 0 rgba(0, 0, 0, 0.14);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.12);
    border-radius: 50%;
}

.chat_menu-toggler {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 40px;
    height: 40px;
    z-index: 6;
    opacity: 0;
    cursor: pointer;
}

.chat_menu-toggler:hover + label,
.chat_menu-toggler:hover + label:before,
.chat_menu-toggler:hover + label:after {
    background: white;
}

.chat_menu-toggler:checked + label {
    background: transparent;
}

.chat_menu-toggler:checked + label:before,
.chat_menu-toggler:checked + label:after {
    top: 0;
    width: 40px;
    transform-origin: 50% 50%;
}
.chat_menu-toggler:checked + label:before {
    transform: rotate(45deg);
}
.chat_menu-toggler:checked + label:after {
    transform: rotate(-45deg);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item {
    border-bottom:1px dashed #ddd;
    opacity: 1;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(1) {
    transition-duration: 180ms;
    -webkit-transition-duration: 180ms;
    -webkit-transform: translate3d(0.08361px, -50px, 0);
    transform: translate3d(0.08361px, -50px, 0);
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    border-bottom:none;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(2) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -90px, 0);
    transform: translate3d(0.08361px, -90px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(3) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -130px, 0);
    transform: translate3d(0.08361px, -130px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(4) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -170px, 0);
    transform: translate3d(0.08361px, -170px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(5) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -210px, 0);
    transform: translate3d(0.08361px, -210px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(6) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -250px, 0);
    transform: translate3d(0.08361px, -250px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(7) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -290px, 0);
    transform: translate3d(0.08361px, -290px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(8) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    -webkit-transform: translate3d(0.08361px, -290px, 0);
    transform: translate3d(0.08361px, -330px, 0);
}

/*
.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(8) {
	transition-duration: 280ms;
	-webkit-transition-duration: 280ms;
	-webkit-transform: translate3d(0.08361px, -330px, 0);
	transform: translate3d(0.08361px, -330px, 0);
}

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(9) {
	transition-duration: 280ms;
	-webkit-transition-duration: 280ms;
	-webkit-transform: translate3d(0.08361px, -370px, 0);
	transform: translate3d(0.08361px, -370px, 0);
}
*/

.chat_menu-toggler:checked ~ ul .chat_menu-item:nth-child(9) {
    transition-duration: 280ms;
    -webkit-transition-duration: 280ms;
    /*-webkit-transform: translate3d(0.08361px, -410px, 0);
	transform: translate3d(0.08361px, -410px, 0);*/
    -webkit-transform: translate3d(0.08361px, -330px, 0);
    transform: translate3d(0.08361px, -370px, 0);
    border-top-left-radius:10px;
    border-top-right-radius:10px;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item a {
    pointer-events: auto;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item a:hover {
    color:#333;
    background:#fefefe;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item label {
    border: 0px;
    padding: 0px;
    position: relative;
    background:none;
    display:block;
    color:inherit;
}

.chat_menu-toggler:checked ~ ul .chat_menu-item label span:hover {
    color:#333;
    background:#fefefe;
}

.chat_menu-toggler + label {
    width: 40px;
    height: 5px;
    display: block;
    z-index: 1;
    transition: transform 0.5s, top 0.5s;
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

.chat_menu-toggler + label:before,
.chat_menu-toggler + label:after {
    width: 40px;
    height: 5px;
    display: block;
    z-index: 1;
    transition: transform 0.5s, top 0.5s;
    content: "";
    position: absolute;
    left: 0;
}

.chat_menu-toggler + label:before {
    top: 10px;
}

.chat_menu-toggler + label:after {
    top: -10px;
}

.chat_menu-item {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 100px;
    height: 40px;
    display: block;
    opacity: 0;
    transition: 0.5s;
    cursor:pointer;
    background:#fff;
    color:#999;
    z-index:5;
}

.chat_menu-item:hover {
    color:#333;
    background:#fefefe;
}

.chat_menu-item span {
    display: block;
    width: inherit;
    height: inherit;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    font-size: 13px;
    pointer-events: none;
    transition: 0.2s;
    cursor:pointer;
}


.music_list {}

.music_list > ul > li > ul {
    display:inline-block;
    width:100%;
    border-bottom:1px dashed #ddd;
    padding:10px 0;
}

.right_list_date {
    padding: 0px 12px;
    color: #c4c4c4;
}

.right_list_end  img {
    opacity:.3;
    filter:grayscale(1);
}

.music_list > ul > li > ul.list_end {
    opacity:.3;
    filter:grayscale(1);
}

.music_list > ul > li > ul > li {
    float:left;
    position:relative;
}

.music_list > ul > li > ul > li:nth-child(2) {
    width:calc(100% - 50px);
}

.music_list > ul > li > ul > li:last-child {
    float:right;
    padding-right:10px;
}

.music_list > ul > li > ul > li > div.music_list_nick {
    height:25px;
}

.music_list > ul > li > ul > li > div.music_list_nick span.date {
    float:right;
    color:#aaa;
    font-weight:400;
    font-size:13px;
}

.music_list > ul > li > ul > li > div.music_list_nick span.music_letter_heart {
    font-size:14px;
    color:#999;
}

.music_list > ul > li > ul > li > p.music_list_nick {
    height:25px;
}

.music_list > ul > li > ul > li > p.music_list_nick span.date {
    float:right;
    color:#aaa;
    font-weight:400;
    font-size:13px;
}

.music_list > ul > li > ul > li > p.music_list_nick span.music_letter_heart {
    font-size:14px;
    color:#999;
}

.music_list > ul > li > ul > li > p.music_list_title {
    display:block;
    font-weight:500;
    width:calc(100% - 50px);
    height:50px;
    padding-top: 12px;
    text-overflow:ellipsis;
    overflow:hidden;
    font-size: 18px;
}

.music_list > ul > li > ul > li > p.music_list_title span {
    border:1px solid #ddd;
    border-radius:5px;
    font-size:13px;
    color:#888;
    float:right;
}

.music_letter_btn_wrap {
    position:absolute;
    right:0px;
    top:25px;
}

.music_letter_btn {
    border:1px solid #ddd;
    background:none;
    border-radius:5px;
    font-size:13px;
    color:#888;
    /*float:right;*/
    top: -1px;
    position: relative;
    margin-right: 10px;
}

.music_letter_btn i {
    color:#e877ae
}

.music_list_letter {
    /*background:#f9f9f9;*/
    width:100%;
    /*padding:10px;*/
    border-radius:10px;
    margin-top:5px;
    font-size:14px;
}

.music_list_letter p {
    line-height:23px;
    font-size:16px;
    color:#666;
}

.music_list > ul > li > ul.music_letter_story {
    display:block;
}

.music_list_scroll::-webkit-scrollbar {
    width: 5px;
    right:5px;
    position:absolute;
    background:transparent;
    border:none;
}

.music_list_scroll::-webkit-scrollbar-track {
    background:transparent;
    -webkit-box-shadow:none;
}

.music_list_scroll::-webkit-scrollbar-thumb {
    background:#ddd;
    border-radius:10px;
}

.music_list_scroll {
    overflow:auto;
    height:450px;
    /*visibility:hidden;*/
}

.music_list_scroll-inner,
.music_list_scroll:hover {
    visibility: visible;
}

.chatting {
    width: 100%;
    height: calc(100% - 250px);
    font-size: 14px;
    color: #fff;
    overflow-y: auto;
    padding: 15px;
}

.scrollbar {
    width: 100%;
    height: calc(100% - 295px);
    font-size: 14px;
    color: #fff;
    overflow-y:auto;
}

.scrollbar,
[data-simplebar-direction] {
    position: relative;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}

.scrollbar .scrollbar-scroll-content,
[data-simplebar-direction] .scrollbar-scroll-content {
    overflow-y: scroll;
    overflow-x: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    -ms-overflow-style: none;
}

.scrollbar-scroll-content::-webkit-scrollbar {
    display: none;
}

[data-simplebar-direction="horizontal"] .scrollbar-scroll-content,
.scrollbar.horizontal .scrollbar-scroll-content {
    overflow-x: scroll;
    overflow-y: auto;
}

.scrollbar-track {
    z-index: 99;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 11px;
}

.scrollbar-track .scrollbar-scrollbar {
    position: absolute;
    right: 0px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    min-height: 10px;
    width: 7px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    opacity: 0;
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
    background: #6c6e71;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
}

.scrollbar-track:hover .scrollbar-scrollbar {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    opacity: 0.7;
    -webkit-transition: opacity 0 linear;
    -moz-transition: opacity 0 linear;
    -o-transition: opacity 0 linear;
    -ms-transition: opacity 0 linear;
    transition: opacity 0 linear;
}

.scrollbar-track .scrollbar-scrollbar.visible {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    opacity: 0.7;
}

[data-simplebar-direction="horizontal"] .scrollbar-track,
.scrollbar.horizontal .scrollbar-track {
    top: auto;
    left: 0;
    width: auto;
    height: 11px;
}

[data-simplebar-direction="horizontal"] .scrollbar-track .scrollbar-scrollbar,
.scrollbar.horizontal .chatting-track .scrollbar-scrollbar {
    right: auto;
    top: 2px;
    height: 7px;
    min-height: 0;
    min-width: 10px;
    width: auto;
}

.basic_chat2 {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.music_title {
    font-size: 16px;
}

.chat_user_pic_wrap {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    float: left;
    cursor: pointer;
    margin-right: 10px;
}

.chat_user_pic_wrap_line {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
    float: left;
    cursor: pointer;
    margin-right: 10px;
}

.chat_user_pic_wrap img {
    width: 100%;
    height: 100%;
}

.chat_user_pic_wrap_line img {
    width: 100%;
    height: 100%;
}

.chat_user_pic_wrap2 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
    float: left;
    text-align: center;
    margin-right: 10px;
}

.chat_user_pic_wrap2 img,
.chat_user_pic_wrap3 img {
    width: 100%;
    height: 100%;
}

.chat_user_pic_wrap3 {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
    text-align: center;
}

.heart_msg {
    width: 100%;
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    color: #666;
    margin-bottom: 20px;
    border: 10px solid #fff;
    border-radius: 10px;
}

.heart_msg p {
    float: left;
}

.user_type_ul li {
    clear: both;
    margin-bottom: 15px;
    display: table;
    position:relative;
}

.chat_user_nickname {
    float: left;
    line-height: 40px;
    padding: 0 10px;
    cursor: pointer;
}

.heart_msg_cnt {
    font-weight: 400;
}

.icon_1004 {
    margin-right: 10px;
    width: 40px;
    height: 40px;
}

.heart_txt1 {
    width: 100%;
    line-height: 30px;
    margin-left: 10px;
    text-align: left;
    margin-bottom: 10px;
}

.chat_msg_td {
    float: left;
    width: 85%;
    margin-left:10px;
    margin-top: 5px;
    word-break:break-all;
}

.chat_msg_td_line {
    margin-top: 0px !important;
    margin: 2px 0px !important;
}

.send_heart_ul {
    clear: both;
    display: table;
    margin: 0 auto;
    width: 100%;
}

.send_heart_wrap {
    text-align: center;
    display: table;
    clear: both;
    margin: 0 auto;
}

.send_heart_ul li.float-left {
    float: left;
}

.send_heart_ul li.float-static {
    float: none;
    clear: both;
}

.chat_msg_td .chat_nickname {
    cursor: pointer;
    display:inline-block;
    width:auto;
    white-space:nowrap;
}

.chat_msg_td .chat_nickname_line {
    cursor: pointer;
    display: inline-block;
    width: auto;
    white-space: nowrap;
    float: left;
    top: 5px;
    padding: 0px 4px 0px 0px;
    position: relative;
}

.heart_icon_md {
    width: 14px;
    height: 14px;
}

.chat_nextbsinfobox {
    display: none;
    width: 60%;
    position: absolute;
    z-index: 1000;
    transform: translate(-50%, -50%);
    left: calc(100% + 400px);
    top: 330px;
    background: rgba(43, 43, 43, 0.90);
    padding: 15px 5px;
    border-radius: 10px;
    border: 1px solid rgb(69, 69, 69);
}

.chat_msg_td .chat_msg {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 5px 15px;
    /*font-weight: 300;*/
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    margin-top: 5px;
    margin-bottom: 10px;
    width: auto;
    display: table;
    word-break: break-all;
}

.chat_msg_td .chat_msg_line {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 4px 12px;
    /*font-weight: 300;*/
    border-radius: 15px;
    margin-bottom: 10px;
    width: auto;
    display: table;
    word-break: break-all;
    position: relative;
    top: 1px;
}

.chat_msg_td .chat_img {
    background-color:transparent;
    padding:0;
    border-radius:15px;
    overflow:hidden;
    display:table;
    margin-top:5px;
    margin-bottom:10px;
}

.chat_msg_login {
    color: #fff;
    padding: 5px 15px;
    border-radius: 5px;
    text-align: center;
    clear: both;
    display: inline-block;
}

.chat_msg_gift {
    color: #fff;
    padding: 10px 15px;
    border-radius: 5px;
    text-align: center;
    background: rgba(55, 55, 55, 0.6);
    clear: both;
    display: inline-block;
    margin: 10px 60px;
}

.chat_login_wrap {
    text-align: center;
    clear: both;
}

.chat_msg_login3 {
    padding: 5px 15px;
    border-radius: 5px;
    clear: both;
    display: inline-block;
}

.chat_msg_login2 {
    background-color: #fff;
    padding: 10px 15px;
    border-radius: 5px;
    margin-bottom: 15px;
    margin: 0 auto 20px;
    text-align: center;
    clear: both;
    color: #666;
    display: inline-block;
}

.chat_msg_music {
    border-radius: 5px;
    clear: both;
    color: #fff;
    display: inline-block;
    width: 100%;
    text-align: center;
}

.chat_msg_login span {
    font-weight: 600;
}

.chat_gift_msg2 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    margin-left: -150px;
    z-index: 3;
}

.music_msg_wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 94%;
    margin-left: -47%;
    z-index: 3;
}

.chat_login_msg {
    display: inline-block;
    line-height: 32px;
}

.display-none {
    display: none;
}

.chat_msg_td .chat_msg2 {
    background-color: rgba(240, 146, 145, 0.6);
    color: #fff;
    /*font-weight: 300;*/
    padding: 10px 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    margin-top: 5px;
    margin-bottom: 15px;
    /*width: auto;*/
    max-width: 70%;
    display: block;
    word-break: break-all;
}

.chat_msg .float-static {
    float: static;
}

.user_chat_img {
    vertical-align: top;
    padding: 0;
}

.user_type1 {
    background-color: #f7941d;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.user_type2 {
    background-color: #f96798;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.user_type3 {
    background-color: #790000;
    display: inline-block;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    padding: 0px 4px;
    border-radius: 5px;
    margin-right: 5px;
}

.user_modal_ul {
    text-align: center;
    display: inline-block;
    width: 100%;
}

.user_modal_ul li.user_img_wrap {
    text-align: center;
    margin: 0 auto;
}

.user_modal_ul li.user_img {
    float: left;
}

.user_modal_follow {
    float: right;
    text-align: left;
}

.cj_info ul li p.follow_txt {
    font-size: 13px;
    color: #666;
    font-weight: 300;
}

.cj_info ul li p.follow_txt span {
    font-weight: 600;
    color: #333;
}

.user_icon {
    vertical-align:bottom;
    margin-left:5px;
}

.user_icon img {
    width:16px;
}

.user_broad {
    margin-top: 10px;
    background: #f9f9f9;
    padding: 10px;
}

.user_group_box {
    margin: 20px 0 5px;
    position: relative;
}

.user_broad p {
    width: 100%;
    padding: 10px;
    display: inline-block;
    font-size:14px;
}

.user_broad p span {
    margin-right: 10px;
    width: 45px;
    height: 45px;
    display: inline-block;
    overflow: hidden;
}

.user_broad h2 {
    font-size: 15px !important;
}

.user_modal_close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 24px;
    cursor: pointer;
    color: #666;
}

.live_gift_modal_td {
    text-align: center;
    padding: 10px 5px 10px 5px;
    /*border: 1px solid #ddd;*/
    cursor: pointer;
    font-size:13px;
}

.live_gift_modal_td p img {
    width:60px;
}

.gift_modal_td {
    text-align: center;
    padding: 5px;
    border: 1px solid #ddd;
    cursor: pointer;
    font-size:13px;
}

.gift_modal_td p img {
    width:45px;
}

.gift_modal_table {
    width: 100%;
}

.gift_heart_ul {
    padding: 10px;
}

.gift_heart_ul li {
    padding: 10px 0;
    clear: both;
    position: relative;
}

.gift_heart_input2 {
    width: 80% !important;
}

.gift_input {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
}

.music_ul {
    padding: 20px;
    display: inline-block;
}

.music_ul li {
    clear: both;
    margin: 0 0 10px 0;
    display: inline-block;
    width: 100%;
}

.music_ul li:last-child{
    text-align:center;
    color:#999;
    background:#f9f9f9;
    padding:10px 0;
    font-weight:400;
    font-size:14px;
}

.music_tit {
    font-size: 17px;
    font-weight: 600;
    width: 120px;
}

.music_text {
    float: right;
    width: calc(100% - 120px);
}

.music_text input {
    width: 100%;
}

.music_letter {
    width:100%;
    border:1px solid #ddd;
    border-radius:3px;
    resize:none;
    height:70px;
}

.music_modal ul.gif_ {
    text-align: center;
    padding: 10px;
    border: 1px solid #ddd;
    cursor: pointer;
}

.music_modal_table {
    width: 100%;
}

.heart_send {
    position: absolute;
    top: 25%;
    left: 50%;
    background-color: #fff;
    margin-left: -200px;
    width: 400px;
    z-index: 10;
    padding-bottom: 20px;
    display: none;
    overflow-y: auto;
    margin-bottom: 20px;
}

.hash_wrap {
    padding: 10px;
    display: block;
    background: #f9f9f9;
}

.hash_wrap span {
    border: 1px solid #bbb;
    background: #fff;
    border-radius: 15px;
    padding: 5px 10px;
    font-size: 13px;
    margin: 10px 5px;
    display: inline-block;
}

.cj_modal_close {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 24px;
    color: #666;
    cursor: pointer;
}

.pairing_modal2 {
    position: fixed;
    top: 25%;
    left: 50%;
    background-color: #fff;
    margin-left: -170px;
    width: 340px;
    z-index: 10;
    display: none;
    padding: 15px;
}

.pairing_title2 {
    padding: 10px;
    font-weight: 600;
}

.pairing_title2 > span {
    font-size: 20px;
    width: 100%;
    padding-bottom: 15px;
    font-size: 18px;
    display: inline-block;
    border-bottom: 2px solid #333;
}

.rank_modal_title {
    padding: 20px;
    position: relative;
}

.rank_modal_close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 24px;
    color: #999;
    cursor: pointer;
}

.total_point {
    text-align: center;
    background-color: #fff200;
    padding: 5px;
}

.chat_rank_ul {
    height: 429px;
}

.chat_rank_ul li:first-child {
    text-align: center;
    margin: 0 auto;
    position: relative;
}

.chat_rank_ul li {
    padding: 10px 0;
    width: 100%;
    font-size:14px;
}

.chat_rank_imgwrap span.chat_rank_img {
    border-radius: 50%;
    overflow: hidden;
    width: 70px;
    height: 70px;
    text-align: center;
    position:relative;
    display:inline-block;
}

.img-center {
    margin:0 auto;
}

.chat_rank_imgwrap {
    position:relative;
    width:70px;
}

.chat_rank_imgwrap img {
    width: 100%;
    height: 100%;
}

.rank_num {
    position: absolute;
    top: 10px;
    left: 50%;
    margin-left: -47px;
    font-weight: 600;
    color: #666;
}

.chat_rank_ul .char_rank_li {
    display: table;
    clear: both;
    height: 60px;
    border-bottom: 1px solid #ddd;
    line-height: 40px;
    width: 100%;
    padding: 10px 0;
}

.chat_rank_ul .char_rank_li div {
    float: left;
    padding: 0 10px;
}

.chat_rank_ul .char_rank_li div.chat_rank_imgwrap2 span.chat_rank_img {
    border-radius: 50%;
    overflow: hidden;
    width: 40px;
    height: 40px;
    text-align: center;
    padding: 0;
    display:inline-block;
}

.chat_rank_imgwrap2 {
    position:relative;
    padding:0 !important;
}

.chat_rank_imgwrap2 img {
    width:100%;
}

.my_id {
    height: 91px;
}

.fa-chevron-right {
    cursor: pointer;
}

.chat_rank_ul .char_rank_li div.chat_heart_cnt {
    float: right;
}

.pairing_modal_table2 {
    width: 100%;
    margin: 10px 0;
}

.pairing_modal_table2 td {
    padding: 15px 10px;
    font-size: 13px;
    border-bottom: 1px dotted #ddd;
}

.pairing_modal_table2 tr.now {
    font-weight:500;
    background:#f9f9f9;
}

.basic_chat {
    clear: both;
}

.user_chat_img {
    display: block;
    margin: 0 0 0 10px;
    float: left;
    position:relative;
}

.user_chat_img_line {
    display: block;
    margin: 3px 0 0 10px;
    float: left;
    position: relative;
}

.report_menu2 {
    top: 65px;
    right: 45px;
}

.charge-item .txt2 {
    font-size: 14px;
    background: #f9f9f9;
    padding: 5px 5px;
}

.charge-item .type_c1 {
    text-decoration: line-through;
    font-size: 14px;
    color: darkgray;
}

.charge-item .type_c11 {
    font-size: 16px;
}

.charge-item .type_c2 {
    font-size: 14px;
    color: #ffffff;
    font-weight: normal;
    background: rgba(235, 86, 100, .99);
    padding: 0px 10px 0px 10px;
    border-radius: 6px;
}

.chat_icon {
    height: 11px;
    vertical-align: baseline;
    margin-right: 5px;
}

.chat_icon2 {
    height: 14px;
    vertical-align: bottom;
    margin-right: 5px;
}

.cash_animation img {
    position: absolute;
    display: none;
    top: 10%;
    left: calc(100% - 100px);
    transform: translate(-50%, -50%);
    /*width: 100%;*/
    height: auto;
    z-index: 1000;
    /*width: 100%;*/
}

.delete_box {
    padding: 30px;
    background: #f9f9f9;
}

.wd50px li {
    float: left;
    margin-right: 10px;
    font-size:12px;
}

.wd50px li:last-child {
    margin: 0;
}

.pairing_icon {
    position: absolute;
    color:#fff;
    top: 220px;
    height:25px;
    display:inline-block;
    right: 15px;
    font-size:20px;
    z-index:3;
}

.bell-icon {
    font-size: 23px;
    padding: 0 5px;
    color: #999;
    margin-left: 10px;
    float:left;
    position:relative;
    width:38px;
    text-align:center;
}

.bell-icon:hover {
    cursor:pointer;
}

.bell-icon span {
    width:7px;
    height:7px;
    background:red;
    display:inline-block;
    border-radius:50%;
    position:absolute;
    right:7px;
    top:10px;
}

.mission {
    float:left;
    font-size:21px;
    color:#999;
    position:relative;
}

.mission:hover {
    cursor:pointer;
}

.music_menu span.newreqsong {
    width: 7px;
    height: 7px;
    background: red;
    display: inline-block;
    border-radius: 50%;
    position: absolute;
    right: 9px;
    top: 17px;
}

.mission span.newbell {
    width:7px;
    height:7px;
    background:red;
    display:inline-block;
    border-radius:50%;
    position:absolute;
    right:-3px;
    top:10px;
}

.msgp-icon {
    font-size: 23px;
    padding: 0 5px;
    color: #999;
    margin-left: 6px;
    float:left;
    position:relative;
    width:38px;
    top: -2px;
    text-align:center;
    cursor: pointer;
}

.m_content {
    display: none;
}

.sleep_account {
    max-width:650px;
    width:100%;
    padding:20px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

.sleep_account h2 {
    text-align:center;
}

.sleep_account_txt {
    color:#666;
    padding:50px;
}

.sleep_account ul {
    border:3px solid #e877ae;
    padding:20px;
}

.sleep_account ul li {
    margin:7px 0;
    display:inline-block;
    width:100%;
}

.sleep_account ul li span {
    width:100px;
    display:inline-block;
    color:#333;
    font-weight:500;
}

.sleep_account ul li input {
    border:1px solid #ddd;
    border-radius:3px;
    padding:6px;
    background:#fff;
}

.sleep_account_txt ul li button {
    font-size:14px;
}

.sleep_account span.txt_b {
    color:#ff6e03;
}

.sleep_account_notice {
    background:#f9f9f9;
    padding:20px;
    font-size:14px;
    color:#777;
}

.sleep_account_notice dt {
    color:#555;
    text-align:center;
}

.sleep_account_notice  dd {
    text-align:center;
    margin-bottom:3px;
}

.sleep_account_notice dd span {
    color:#999;
}

.pw_change {
    background:#fff;
    max-width:1000px;
    width:100%;
    margin:0 auto;
    padding:20px;
    border-radius:20px;
    margin:0px auto;
    border:1px solid #eee;
}

.pw_change h2 {
    text-align:center;
    padding:30px 0;
    border-bottom:2px solid #333;
}

.pw_change_txt {
    color:#666;
    padding:50px;
}

.pw_change_txt ul {
    border:3px solid #e877ae;
    padding:20px;
}

.pw_change_txt ul li {
    margin:7px 0;
    display:inline-block;
    width:100%;
}

.pw_change_txt ul li span {
    width:150px;
    display:inline-block;
    color:#333;
    font-weight:500;
}

.pw_change_txt ul li input[type="password"] {
    border:1px solid #ddd;
    width:50%;
    border-radius:3px;
    padding:6px;
    background:#fff;
    font-size:14px;
    display:block;
}

.pw_change_txt span.txt_b {
    color:#ff6e03;
}

.btn_pw {
    width:200px;
    height:50px;
    border-radius:5px;
    background:#e877ae;
    color:#fff;
    border:none;
}

.btn_pw2 {
    width:200px;
    height:50px;
    border-radius:5px;
    background:#fff;
    color:#666;
    border:1px solid #ddd;
}

.pw_change_notice {
    background:#f9f9f9;
    padding:20px;
    font-size:14px;
    color:#777;
}

.pw_change_notice dt {
    color:#555;
}

.pw_change_notice  dd {
    background:url('../images/menu_manage_icon.png')no-repeat top left;
    padding-left:20px;
    margin-bottom:3px;
    word-break:keep-all;
}

.pw_change_notice dd span {
    color:#999;
}

.height100 {
    height:100vh;
}

.question_textarea {
    resize:none;
}

.api_txt h2 {
    font-size:18px;
    padding:20px 0 10px 0;
}

.api_txt div {
    color:#888;
    font-size:13px;
}

.api_left {
    width:37%;
    float:left;
}

.api_right {
    width:60%;
    float:right;
}

.api_right p {
    font-weight:500;
}

.tbl_api {
    width:100%;
    border-bottom:1px solid #ddd;
    font-size:13px;
    margin-top:10px;
}

.tbl_api tr th {
    background:#f3f7f9;
    font-weight:400;
    height:35px;
}

.tbl_api tr td {
    height:45px;
}

.instation_typewrite_text{
    position: absolute;
    top: 10px;
    right: 10px;
    max-width: 220px;
    font-size: 13px;
    color: #fff;
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    width: 25%;
    margin:0 auto;
    padding: 10px 15px;
    border-radius: 5px;
    background: rgba(8, 8, 8, 0.6);
    clear: both;
    display: inline-block;
    margin: 2px 0;
}

.party_albumimg {
    display:none;
    width:150px;
    height:150px;
    border-radius: 70%;
    overflow: hidden;
}

/*************************************************************min-height:900px***********************************************************/
@media(min-height:900px) {
    .audio_con2 {
        height: calc(100% - 40px);
    }
    .chatting_write_box {
        bottom: 10px;
    }
}
/*************************************************************min-height:1100px***********************************************************/
@media(min-height:1100px) {
    .audio_con2 {
        height: calc(100% - 60px);
    }
}


/*************************************************************max-width:1899px***********************************************************/

@media(max-width:1899px) {


    .origin_wrap {
        width: 32%;
        margin-right: 1%;
        margin-bottom: 1%;
        float: left;
        background: #fff;
    }

    .origin_txt_wrap {
        width: 100%;
        padding: 0;
        text-align: center;
        margin-top: 15px;
        float: none;
    }

    .origin_img_wrap {
        float: none;
        margin: 0 auto;
        width: 120px;
        height: 120px;
    }

    .profile_table3 {
        width: 60%;
    }

    .search_cj_li {
        width: 48%;
        float: left;
    }
}

/*************************************************************min-width:1640px***********************************************************/
@media(max-width:1640px) {
    .invo_list_pick_img {
        width: 130px;
        height: 130px;
    }
}


/*************************************************************min-width:1520px***********************************************************/
@media(max-width:1520px) {
    .broad_box {
        width:18.0%;
    }
    .thumbnail-wrapper3 {
        width: 140px;
    }
    .chat_list_txt {
        width: calc(100% - 170px);
    }
    .chat_list_txt3 {
        font-size: 13px;
    }
}

/*************************************************************min-width:1400px***********************************************************/


@media(min-width:1400px) {

    .chat_moodshotmenu {
        top: 276px;
    }

    .height100{
        height:100vh;
    }

    .hash_box {
        height: auto;
    }

    .hash_box2 {
        width: 160px;
    }

    .origin_wrap {
        width: 32%;
        margin: 1% 0.6%;
        float: left;
        background: #fff;
    }

    .ranking_content li.txt5 {
        float: right;
    }


}


/*************************************************************max-width:1500px***********************************************************/
@media(max-width:1500px) {
    .invo_list_pick_img {
        width: 114px;
        height: 114px;
    }
}


/*************************************************************max-width:1399px***********************************************************/


@media(max-width:1399px) {
    .chatmorepopmenu li {
        font-size: 13px;
    }

    .respmsgoptbox {
        padding: 20px 0px 40px 0px;
    }

    .chatmorepopmenu {
        top: 54px;
    }

    .wsp_everyone {
        top: -45px;
        left: 66px;
        font-size: 26px;
    }

    .wsp_target {
        top: -44px;
    }

    .chat_tab_wrap {
        padding: 0px 10px;
    }

    .live_right_scroll {
        padding:10px 0px 0px 10px;
    }

    .chatting_write_box_emoji {
        top: -41px;
    }

    .invo_left {
        width: calc(100% - 500px);
    }

    .livetop4_content li.txt2 {
        width: 44.8%;
    }


    .chat_list_txt {
        width: calc(100% - 172px);
        float: left;
        overflow:hidden;
    }

    .featured_img {
        width:230px;
        border-radius:15px;
    }

    .mute_icon {
        position: absolute;
        top: 2px;
        right: 15px;
        display:table;
    }

    .mute_icon span {
        width:20px;
        height:20px;
        display:table-cell;
        background:#222;
        color:#fff;
        border-radius:50%;
        text-align:center;
        vertical-align:middle;
        font-size:12px;
    }

    .pairing_icon {
        top: 185px;
    }

    .chat_content {
        /*max-width:1100px;*/
    }

    .invo_content {
        /*max-width: 1100px;*/
    }

    .chat_content2 {
        max-width:1200px;
    }

    .card-item {
        width:23.8%;
    }

    .card-item-mc {
        width:23.8%;
    }

    .card-item2 {
        width:23.8%;
    }

    .card-item3 {
        width:23.8%;
    }

    .broad_box {
        width:23.0%;/*width:32%;*/
    }

    .listen_top_ul {
        padding:7px 0;
    }

    .cj_line {
        font-size:11px;
    }

    .admin_line {
        font-size:11px;
    }

    .bdmin_line {
        font-size:11px;
    }

    .hotlistener_line {
        font-size:11px;
    }

    .listener_line {
        font-size:11px;
    }

    .staff_line {
        font-size:11px;
    }

    .cj_line_s {
        font-size:11px;
    }

    .admin_line_s {
        font-size:11px;
    }

    .bdmin_line_s {
        font-size:11px;
    }

    .hotlistener_line_s {
        font-size:11px;
    }

    .staff_line_s {
        font-size:11px;
    }

    .kingfan_line_s {
        font-size:11px;
    }

    .zzinfan_line_s {
        font-size:11px;
    }

    .favomem_line_s {
        font-size:11px;
    }

    .listen_top_ul > li > ul > li:first-child {
        font-weight: 500;
        font-size: 15px;
    }

    .listen_top_ul > li > ul > li:nth-child(2) {
        font-size: 13px;
    }

    .invoice_top_ul > li > ul > li:first-child {
        font-weight: 500;
        font-size: 15px;
    }

    .invoice_top_ul > li > ul > li:nth-child(2) {
        font-size: 13px;
    }

    .invo_list_pick_item {
        margin: 10px 20px 40px 0px;
    }

    .invo_list_pick_img {
        width: 106px;
        height: 106px;
    }

    .oc_title2 {
        font-size:13px;
        height:30px;
    }

    .oc_title_wrap {
        height: 32px;
    }

    .play_txt1_1 {
        height:30px;
    }

    .music_title {
        line-height:30px;
        font-size:13px;
    }

    .broad_cnt > li {
        font-size:12px;
    }

    .music_icon02 {
        width:22px;
    }

    .user_chat_img {
        width:40px;
    }

    .user_img_wrap > span {
        width:41px;
        height:41px;
    }

    .level_border_cj {
        width:43px;
        height:53px;
    }

    .level_border_cj span {
        font-size:11px;
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .level_border_chat {
        width:42px;
        height:51px;
    }

    .level_border_list {
        /*width:42px;*/
        /*height:50px;*/
    }

    .level_border_list span {
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .chatting {
        font-size:0.92em;
        height: calc(100% - 226px);
    }

    .chatting_write_box {
        padding:4px 15px;
    }

    .chatting_write_box > input {
        height:42px;
        font-size:16px;
        width:calc(100% - 315px);
        margin-top:2px;
    }

    .chat_icon_btn {
        width:20px;
        height:30px;
        line-height:30px;
    }

    .chat_icon_btn2 {
        width:110px;
        height:35px;
        line-height:30px;
    }

    #audioSlider {
        /*top:-16px !important;*/
    }

    #invoiceAudioSlider {
        top:-15px !important;
    }

    .chat_msg_gift {
        padding:5px 15px;
    }

    .chat_user_pic_wrap {
        width:40px;
        height:40px;
    }

    .chat_user_nickname {
        line-height:35px;
    }

    .chat_msg_td .chat_msg {
        margin-bottom:5px;
    }

    .listen_right_scroll {
        padding:10px 15px;
        height:calc(100% - 75px);
    }

    .listen_right_scroll2 {
        padding:0px 20px;
        height:calc(100% - 75px);
    }

    .invo_right_scroll {
        /*padding:10px 15px;*/
        height: calc(100% - 175px);
    }

    .user_type_ul {
        margin-bottom:10px;
    }

    .live_tab_menu {
        margin:15px 0;
        height:40px;
    }

    .live_tab_menu li {
        font-size:13px;
        height:40px;
        line-height:40px;
    }

    .sub_tab_menu {
        margin:15px 0;
        height:40px;
    }

    .sub_tab_menu li {
        font-size:13px;
        height:40px;
        line-height:40px;
    }

    .listen_list_item {
        /*padding:15px;*/
    }

    .thumbnail-wrapper3 {
        width:150px;
    }

    .chat_list_txt1 {
        font-size:15px;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .chat_list_txt2 {
        width:40px;
        margin:10px 10px 15px 0;
    }

    .chat_list_txt3 {
        margin-top:5px;
        font-size:12px;
    }

    .chat_list_cnt {
        font-size:12px;
    }

    .hash_box {
        height: auto;
    }

    .hash_box2 {
        width: 160px;
    }

    .broad_step ul li {
        width:100%;
        margin-bottom:20px;
        text-align:center;
    }

    .mobile_banner {
        text-align:center;
        width:100%;
        padding:15px;
    }

    .origin_wrap {
        cursor: pointer;
        width: 32%;
        margin: 2% 0.6%;
        float: left;
        background: #fff;
    }

    .origin_img_wrap {
        float: none;
        margin: 0 auto;
        width: 120px;
        height: 120px;
    }

    .origin_txt_wrap {
        float: none;
        margin-top: 15px;
        padding: 0;
        text-align: center;
    }

    .origin_title {
        font-size: 16px;
    }

    .profile_table3 {
        width: 100%;
    }

    .ranking_content li.txt5 {
        margin-top: 20px;
    }

    .alram {
        width: 300px;
        position: absolute;
        background-color: #fff;
        border: 1px solid #ddd;
        display: none;
    }

    .guide_pop span.guide_close {
        position:absolute;
        z-index:22;
        left:4%;
        top:1%;
    }

    .guide_pop span.guide_nick {
        position:absolute;
        z-index:22;
        left:6%;
        top:5%;
    }

    .guide_pop span.guide_title {
        position:absolute;
        z-index:22;
        left:33%;
        top:1%;
    }

    .guide_pop span.guide_report {
        position:absolute;
        z-index:22;
        left:51%;
        top:8%;
    }

    .guide_pop span.guide_count {
        position:absolute;
        z-index:22;
        left:5%;
        top:8%;
    }

    .guide_pop span.guide_favorite {
        position:absolute;
        z-index:22;
        left:5%;
        bottom:2.2%;
    }

    .guide_pop span.guide_btn {
        position:absolute;
        z-index:22;
        left:39%;
        bottom:4%;
    }

    .guide_pop span.guide_btn img {
        width:80%;
    }

    .guide_pop .btn_guide_close {
        position:absolute;
        top:2%;
        right:2%;
        background:none;
        border:none;
        color:#fff;
        font-size:20px;
    }

    .intalk_list_box {
        margin:0.5%;
        width:24%;
        float:left;
    }

    .intalk_list_box2 {
        margin:0.5%;
        width:49%;
        float:left;
    }

    .intalk_list_txt {
        height:43px;
        font-size:14px;
    }
}

/*************************************************************max-width:1200px***********************************************************/


@media(max-width:1200px) {
    .right_list_date {
        padding: 0px 6px;
        font-size: 13px;
    }
    .thumbnail-wrapper2 {
        width: 90px;
        height: 64px;
        margin-right: 8px;
    }
    .listen_txt {
        width: calc(100% - 100px);
        float: left;
        margin: 0;
        padding: 5px;
    }

    .thumbnail-wrapper3 {
        width: 120px;
    }
    .chat_list_txt {
        width: calc(100% - 130px);
        float: left;
        overflow: hidden;
    }
    .chatting_write_box_emoji {
        right: 270px;
    }

    .logo_m {
        display: block;
    }

    .logo_menu_m {
        display: block;
    }

    .card-item {
        padding:30px 10px;
        width:19%;
    }

    .card-item-mc {
        padding:30px 10px;
        width:19%;
    }

    .broad_box {
        padding:25px 3px;
        width:15.0%;/*width:32.2%;*/
    }

    .card-item2 {
        padding:30px 10px;
        width:19%;
    }

    .card-item3 {
        padding:30px 10px;
        width:19%;
    }

    .left_top {
        background:#f9f9f9;
        padding:0 !important;
    }

    .left_top li {
        /*padding:0 !important;*/
        text-align:center;
        cursor:none !important;
    }

    .left_login2 {
        height:50px;
        width:100%;
        display:table;
    }

    .left_login2 > div.nickname {
        float:none;
        margin:0;
        width:100%;
        vertical-align:middle;
        display:table-cell;
    }

    .left_login2 > div.nickname > .pic_wrap {
        float:none;
        vertical-align:middle;
    }

    .left_login2 > div.nickname > .pic_wrap span.left_pro_img {
        width:35px;
        height:35px;
        border-radius:50%;
        overflow:hidden;
        display:inline-block;
    }

    .left_login2 > div.nickname > .login_txt {
        float:none;
        margin-left:5px;
        vertical-align:middle;
    }

    .log_top_box .live_on {
        left: 38px;
    }

    .log_manage_title {
        display:none;
    }

    .my_left {
        width: 100%;
        float: none;
    }

    .bx-pager {
        left:50%;
        transform:translate(-50%, 0);
        bottom:-10px !important;
    }

    .my_right {
        display: none;
    }

    .bell-icon {
        float: left;
    }

    .listen_end {
        width: 100%;
    }

    .listen_bg {
        width: 100%;
        height: calc(100% - 75px);
        margin: 0;
    }

    .listen_ori_bg {
        width: 100%;
        margin: 0;
    }

    .invo_list_pick_img {
        width: 110px;
        height: 110px;
    }

    .invo_list_pick_title {
        padding: 50px 0px 10px 20px;
    }

    .invo_list_hot_title {
        margin-top: 0px;
    }

    .invo_list_pick_item {
        margin: 10px 20px 40px 0px;
    }

    .invo_list_pick_img {
        width: 105px;
        height: 105px;
    }

    .invo_ori_bg {
        width: 100%;
        height: 400px;
    }

    .listen_ori_bg2 {
        width: 100%;
        height: calc(100% - 75px);
        margin: 0;
    }

    .audio_con2 {
        padding: 0;
        height: calc(100% - 52px);
        margin-top: 52px
    }

    .chatting_write_box > input {
        width:calc(100% - 320px);
    }

    .chat_box {
        width:calc(100% - 270px);
    }

    .intalk_left {
        width:100%;
        float:none;
    }
    /*
        .listen_bg_box {
            width: 100%;
            margin: 0;
        }
        .listen_right {
            position: absolute;
            width: 100%;
            display: none;
            padding-top: 0px;
            padding-bottom: 0px;
            background: #fff;
            margin: 0;
            z-index: 5;
            top: 0;
            height:calc(100vh - 65px);
        }
    */


    .listen_right2 {
        position: absolute;
        width: 100%;
        display: none;
        padding-top: 0px;
        padding-bottom: 0px;
        background: #fff;
        margin: 0;
        z-index: 5;
        top: 0;
        height:100%;
    }

    .listen_right_scroll {
        padding:0px 15px;
        visibility:visible;
    }

    .gift_right_scroll2 {
        padding:0px 15px;
        visibility:visible;
    }

    .listen_right_scroll2 {
        padding:0px 20px;
        visibility:visible;
        height:calc(100% - 65px);
    }

    .invo_right_scroll {
        /*padding:0px 15px;*/
        visibility:visible;
        height: calc(100% - 175px);
    }

    .guide_pop span.guide_close {
        left:5%;
        top:1%;
    }

    .guide_pop span.guide_nick {
        left:7%;
        top:4%;
    }

    .guide_pop span.guide_title {
        left:50%;
        top:1%;
        margin-left:7%;
    }

    .guide_pop span.guide_report {
        left:auto;
        right:1%;
        top:8%;
    }

    .guide_pop span.guide_count {
        left:5%;
        top:7%;
    }

    .guide_pop span.guide_favorite {
        left:5%;
        bottom:8%;
    }

    .guide_pop span.guide_btn {
        left:auto;
        right:4%;
        bottom:11%;
    }

    .report_menu {
        font-size: 13px;
    }

    .report_menu2 {
        font-size: 11px;
    }

    .wrap_con {
        width: 100%;
        margin-left: 0;
    }

    .wrap_con2 {
        width: 100%;
        margin-left: 0;
    }

    .main_con {
        width: 100%;
        margin-top: 46px;
        margin-left: 0;
    }

    .rbanner_box {
        width: 100%;
    }

    .rbanner_txt1 {
        min-width: 50%;
    }

    .hash_box2 {
        width: 60%;
    }

    .cnt_box {
        width: 19%;
        text-align: right;
    }

    .wd50px {
        text-align: center;
    }

    .logo_box {
        width: 25%;
        display: table-cell;
        clear: both;
    }

    .logo {
        display: none;
    }

    .top_menu {
        display: table-cell;
        margin: 0;
        float: right;
    }

    .top_menu ul li.search_block {
        margin: 0 auto;
        margin-top: 20px;
        left: 50%;
        position: absolute;
        margin-left: -15%;
    }

    .card-columns .card-item:nth-of-type(n+9) {
        display: none;
    }

    .left_menu {
        position: fixed;
        /*top: 75px;*/
        left: -280px;
        z-index: 10;
    }

    .nickname {
        margin: 0 10px;
    }

    .nickname > i {
        color: #999;
    }

    .content {
        width: 100%;
        padding: 15px 15px;
        display: inline-block;
    }

    .chat_content {
        width: 100%;
        padding: 0;
        max-width:100%;
    }

    .invo_content {
        width: 100%;
        padding: 0;
        max-width:100%;
    }

    .chat_content2 {
        width: 100%;
        padding: 0;
        max-width:100%;
    }

    .wrap_con2 {
        margin-left: 0;
        width: 100%;
    }

    .notice {
        line-height: 62px;
    }

    footer .notice li {
        line-height: 62px;
    }

    .footer_con {
        padding: 15px;
    }


    .rbanner_box {
        display: flex;
        flex-wrap: wrap;
        margin-top: 10px;
    }

    .googleplay_btn {
        order: 1;
        margin-right: 20px;
    }

    .rbanner_txt1 {
        order: 2;
        margin: 0;
        line-height: 21px;
    }

    .bd1px {
        border: 0;
    }

    .mobile_line {
        width: 100%;
        height: 1px;
        position: absolute;
        top: 230px;
        left: 0;
        border-top: 1px solid #e5e5e5;
    }

    ul.notice_box {
        margin: 0;
        padding: 0 15px;
        line-height: 45px !important;
    }

    .main_top_banner {
        position: relative;
        background:none;
        padding-bottom: 0px;
    }

    .main_top_banner .content {
        padding-bottom: 25px;
    }

    .cover_box {
        margin-top:55px;
    }

    .cover_wrap {
        width:100%;
    }

    .log_pic_wrap span.log_profile_img {
        width:55px;
        height:55px;
    }

    /*
	.log_top_box li:first-child {
		padding:10px 10px 0 0px;
		position:relative;
	}

	.log_top_box li:nth-child(2) {
		padding:10px 0px 0 15px;
	}
*/
    .log_top_box li p button img {
        display:none;
    }

    /*level_border {
		width:40px;
		height:44px;
	}*/

    .level_border_log {
        width:57px;
        height:69px;
    }

    .log_data {
        bottom:-50px;
        top:inherit;
        font-size:13px;
        right:0;
        background:rgba(0,0,0,.6);
    }

    .hash_box {
        width: 100%;
        margin: 20px 0 0 0;
        /*height: 60px;*/
        overflow: hidden;
        overflow-x: auto;
        position: relative;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */
        cursor: pointer;
    }

    .hash_box::-webkit-scrollbar {
        display: none;
        /* Chrome,Safari,Opera*/
    }

    .hash_box ul {
        width: auto;
        display: table;
        overflow: visible;
        /*white-space: nowrap;*/
    }


    .wd50px {
        display: inline-block;
    }

    .oc_top {
        font-size: 16px;
        padding: 10px;
        margin-top:0px;
    }

    .origin_back {
        font-size: 20px;
        top: 12px;
    }

    .oc_left {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: -120px;
        cursor: pointer;
    }

    .oc_right {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: 90px;
        cursor: pointer;
    }

    .oc_control_line2 {
        position: relative;
        line-height: 50px;
        text-align: center;
        margin-top: 20px;
    }

    .oc_control_line2 > .oc_left > img {
        width: 25px;
    }

    .oc_control_line2 > .oc_right > img {
        width: 25px;
    }

    .oc_control_line1 {
        font-size: 15px;
    }

    .request_box {
        background: #f9f9f9;
        padding: 30px;
    }

    .search_block {
        display: inline-block;
        position: absolute;
        left: 200px;
    }

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

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

    .m_content {
        /*display: inline-block;*/
        display:none;
        padding: 150px 0;
        width: 100%;
    }

    .m_tab {
        display: inline-block;
        width: 100%;
    }

    .m_content p {
        text-align: center;
    }

    .pc_none {
        /*display: inline-block;*/
    }

    .my_page_ul {
        width:100%;
    }

    .terms_box {
        padding: 0;
        font-size: 13px;
        /*height:330px;*/
    }

    .profile_wrap {
        width:100%;
        padding:30px 20px;
    }

    .profile_box {
        padding: 20px 0;
        background:#fff;
    }

    .profile_table {
        margin-left:0;
        margin:0 auto;
        width:55%;
    }

    .profile_pic_wrap {
        width:120px;
        height:120px;
    }

    .tab_select {
        position: relative;
        display: block;
        margin: 0 auto;
        width: 100%;
        color: #333;
        font-size: 17px;
        font-weight: 600;
        vertical-align: middle;
        text-align: left;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
    }

    .tab_select .placeholder {
        position: relative;
        display: block;
        background-color: #fff;
        z-index: 1;
        padding: 10px;
        border-radius: 2px;
        border: 2px solid #e877ae;
        cursor: pointer;
    }

    .tab_select .placeholder:after {
        position: absolute;
        right: 1em;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        font-family: 'FontAwesome';
        content: '\f078';
        z-index: 10;
        color: #e877ae;
    }

    .tab_select.is-open .placeholder:after {
        content: '\f077';
    }

    .tab_select.is-open ul {
        display: block;
    }

    .tab_select.select--white .placeholder {
        background: #fff;
        color: #999;
    }

    .tab_select.select--white .placeholder:hover {
        background: #fafafa;
    }

    .tab_select ul {
        display: none;
        position: absolute;
        overflow: hidden;
        width: 100%;
        background: #fff;
        border-radius: 2px;
        top: 100%;
        left: 0;
        list-style: none;
        padding: 0;
        z-index: 100;
    }

    .tab_select ul li {
        display: block;
        text-align: left;
        padding: 0.8em 1em 0.8em 1em;
        color: #999;
        cursor: pointer;
        background: #f9f9f9;
        margin: 1px 0;
        font-size: 16px;
        font-weight: 500;
    }

    .tab_select ul li:hover {
        background: #4ebbf0;
        color: #fff;
    }

    .m_follower {
        line-height: 60px;
        float: left;
        margin-right: 10px;
    }

    .m_follower span {
        margin: 0 5px;
        width: 40px;
        height: 40px;
        border: 1px solid #ddd;
        border-radius: 50%;
        display: inline-block;
        overflow: hidden;
        vertical-align: middle;
    }

    .m_follower span img {
        width: 100%;
        display: block;
    }

    .event_title {
        font-size: 16px;
        font-weight: 600;
        margin-top: 15px;
    }

    .event_ymd {
        font-size: 13px;
        color: #999;
        margin-top: 10px;
    }

    .event-item {
        margin-bottom: 40px;
        cursor: pointer;
        width: 48%;
        margin: 0 3px 15px 3px;
        float: left;
    }

    .event_img img {
        width: 100%;
        height: 100%;
    }

    .company_txt1 {
        font-size:22px;
    }

    .company_txt2 {
        font-size:22px;
    }

    .company_txt3 {
        font-size:18px;
        font-weight:500;
    }
    .content2 {
        /*padding:0 15px;*/
    }

    .cover_box {
        margin-top:100px;
    }

}

/*************************************************************max-width:1100px***********************************************************/
@media(max-width:1100px) {
    .invo_left {
        width: calc(100% - 460px);
    }
    .invo_right {
        width: 400px;
    }
    .broad_box {
        width: 18.0%;
    }
    .top_bar ul li:nth-child(3).login_top_menu3 {
        padding-right: 15px;
    }
    .invo_ori_bg {
        width: 100%;
        height: 400px;
    }
}
/*************************************************************max-width:991px***********************************************************/

@media(max-width:991px) {

    .listen_close {
        display: block;
        font-size: 18px;
    }
    .listen_bg_box {
        width: 100%;
        margin: 0;
    }
    .listen_right {
        position: absolute;
        width: 100%;
        display: none;
        padding-top: 0px;
        padding-bottom: 0px;
        background: #fff;
        margin: 0;
        z-index: 5;
        top: 0;
        height:calc(100vh - 65px);
    }

    .pairing_icon {
        top: 200px;
    }

    .invoice_stat_text {
        display: none;
    }

    div.invoice_btn_controls {
        width: 100%;
    }

    .thumbnail-wrapper2 {
        width: 90px;
        height: 64px;
        margin-right: 8px;
    }

    .invoice_txt {
        width: calc(100% - 142px);
    }

    .invo_left {
        width: calc(100% - 400px);
    }

    .invo_right {
        width: 340px;
    }

    .invoice_re_btn {
        right: 30px;
    }

    .listen_reply_box li.listen_reply_option {
        right: 13px;
    }

    .invoice_reply_list > #listen_reply_ul {
        padding-bottom: 10px;
    }

    .invoice_tit .subj {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        line-height: 1.8;
        font-size: 20px;
    }

    .invo_list_pick_item {
        width: 22.5%;
        margin: 10px 5px 40px 0px;
    }

    .invo_list_pick_img {
        width: 130px;
        height: 130px;
    }

    .toplive_txt1 {
        font-size: 15px;
    }

    .featured_img {
        width:205px;
        margin-right:10px;
        border-radius:10px;
    }

    .eks-tabs__labels{
        display:none;
    }

    .eks-tabs__labels_m {
        display:inline-block;
        width:100%;
        margin:20px 0;
    }

    .eks-tabs__label{
        height: 45px;
        line-height: 45px;
        position: relative;
        font-size: 12px;
        margin: 0;
        text-align: center;
        color: #bbb;
        background: #f7f7f7;
        width:33.3%;
        float:left;
        border:1px solid #ddd;
        overflow:hidden;
        font-weight:500;
    }

    .eks-tabs__label:first-child {
        border-right:none;
    }

    .eks-tabs__label:hover {
        color: #e877ae;
        background:#fff;
        cursor: pointer;
    }
    .eks-tabs__content {
        display: none;
        background: #fff;
        overflow: hidden;
    }

    [id^=eks-tab-1]:checked  ~ .eks-tabs__labels_m .eks-tabs__label[for*=eks-tab-1],
    [id^=eks-tab-2]:checked  ~ .eks-tabs__labels_m .eks-tabs__label[for*=eks-tab-2],
    [id^=eks-tab-3]:checked  ~ .eks-tabs__labels_m .eks-tabs__label[for*=eks-tab-3],
    [id^=eks-tab-4]:checked  ~ .eks-tabs__labels_m .eks-tabs__label[for*=eks-tab-4]{
        color: #e877ae;
        background: #fff;
    }

    [id^=eks-tab-1]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-1],
    [id^=eks-tab-2]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-2],
    [id^=eks-tab-3]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-3],
    [id^=eks-tab-4]:checked ~ .eks-tabs__contents [id^=eks-tabs__content-4]{
        display: block;
    }

    footer {
        margin-top:30px;
    }

    .oc_control_line1 {
        font-size: 15px;
        position:absolute;
        bottom:0;
    }

    .featured {
        min-height:150px;
    }

    .tab_select {
        font-size:15px;
    }

    .mobile_block {
        display: none;
    }

    .main_con {
        width: 100%;
        margin-left: 0;
        margin-top:46px;
    }

    .main_top_banner .content {
        padding-bottom: 15px;
    }

    .bell-icon {
        float: none;
        font-size: 20px;
        padding: 0 5px;
        color: #999;
        position:absolute;
        top:0;
        right:170px;
    }

    .mission {
        font-size:21px;
        color:#999;
        position:absolute;
        right:210px;
    }

    .search_block {
        display: inline-block;
        position: absolute;
        left: 200px;
    }

    .bx-wrapper .bx-pager.bx-default-pager a {
        width:5px;
        height:5px;
    }

    .nickname {
        margin:-3px 5px;
    }

    .bell-icon2 {
        float: right;
        font-size: 23px;
        padding: 0 5px;
        color: #7c73f3;
    }

    .bxslider > li {
        height: 130px;
    }

    .wd50px li {
        float: left;
        margin-right: 10px;
        font-size:11px;
    }

    .card-item {
        padding: 20px 10px;
        width:31.2%;
        margin:1%;
    }

    .card-item-mc {
        padding: 20px 10px;
        width:31.2%;
        margin:1%;
    }

    .broad_box {
        width:23.0%;
    }

    .card-item2 {
        padding: 26px 10px;
        width:31.2%;
        margin:1%;
    }

    .card-item3 {
        padding: 20px 10px;
        width:31.2%;
        margin:1%;
    }

    .origin_area {
        font-size: 13px;
    }

    footer .notice {
        height: 65px;
    }

    .footer_list {
        font-size:13px;
    }

    .footer_list li:before {
        padding:0 5px;
    }

    .mobile_ft {
        display: block;
        margin-top: 20px;
    }

    .footer_txt1 {
        margin-top: 10px;
        color: #999;
        font-size: 12px;
        padding: 0;
    }

    footer .notice .ft_wrap {
        width: 100%;
        margin: 0 auto;
        padding:0;
    }

    footer .footer_con {
        width: 100%;
        margin: 0 auto;
    }

    .selectbox {
        position: relative;
        width: 200px;
        border: 1px solid #ddd;
        z-index: 1;
    }

    .selectbox:before {
        content: "";
        position: absolute;
        top: 50%;
        right: 15px;
        width: 0;
        height: 0;
        margin-top: -1px;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 5px solid #ddd;
    }

    .selectbox label {
        position: absolute;
        top: 1px;
        left: 5px;
        padding: .6em .5em;
        color: #999;
        z-index: -1;
        font-weight: 500;
        font-size: 13px;
    }

    .selectbox select {
        width: 100%;
        height: auto;
        line-height: normal;
        font-family: inherit;
        padding: .8em .5em;
        font-size:12px;
        border: 0;
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }

    .listen_txt{
        width:calc(100% - 160px);
        padding:10px;
    }

    .btn-tertiary {
        color: #e877ae;
        padding: 0;
        line-height: 40px;
        width: 230px;
        margin: auto;
        display: block;
        border: 2px solid #e877ae;
    }

    .dubbing_bg .oc_top .origin_back {
        top:12px;
    }
    div#controls {
        margin: 0px auto 30px;
    }

    .paging_box button {
        width:35px;
        height:35px;
        font-size:13px;
    }

    .top_btn {
        display: none;
    }

    .left_menu ul.left_login {
        padding: 10px;
        display: block;
        display: block;
        background: #f9f9f9;
    }

    .left_menu ul.left_login > li {
        padding: 10px 0;
        text-align: center;
    }

    .left_menu .left_broad {
        display: none;
    }

    div.chat_content {
        width: 100%;
        height:100%;
        padding: 0px;
    }

    div.invo_content {
        width: 100%;
        height:100%;
        padding: 0px;
    }

    div.chat_content2 {
        width: 100%;
        height:100%;
        padding: 0px;
    }

    .chat_data_ul {
        clear: both;
        display: table;
        position: relative;
    }

    .chat_data_ul li {
        position: relative;
        float: left;
        margin-right: -2px;
        font-size: 12px;
        text-align: center;
    }

    .dubbing_bg .oc_top  {
        margin-top:0px;
        padding:10px 30px;
    }

    .chat_data_ul li.pairing_icon {
        position: absolute;
        top: -5px;
        right: -10px;
    }

    .broad_title {
        margin-top:0;
    }

    .broad_name {
        background: rgba(0, 0, 0, .3);
        color: #fff;
        text-align: center;
        padding: 5px 0;
        font-size:14px;
    }

    .broad_cnt > li {
        font-size: 12px;
    }

    .request_heart_cnt {
        font-size: 13px;
    }

    .listen_btn {
        padding: 3px 5px;
        font-size: 13px;
    }

    .user_cnt {
        margin-top: 5px;
        clear: both;
        width: 100%;
        display: table;
        font-size: 15px;
    }

    .user_cnt img {
        margin-bottom: 3px;
    }

    .user_cnt .chatting_user_wrap {
        display: inline-block;
        width: 75px;
    }

    .origin_title {
        font-size: 15px;
        height: 45px;
    }

    .listen_bg_box {
        width: 100%;
        height: calc(100% - 52px);
        margin: 0;
    }

    .listen_reply_box {
        display: table;
        clear: both;
        margin: 5px 0;
        width: 100%;
        padding: 5px 0;
        font-size:14px;
    }

    .listen_reply_box p {
        float: left;
    }

    .listen_reply_box li.listen_img_wrap {
        width: 40px;
        height: 40px;
        margin-right: 5px;
        margin-bottom: 5px;
    }

    .listen_reply_box li.listen_reply_id {
        width: calc(100% - 45px);
    }

    .listen_reply_box > li.listen_reply_id > span {
        color: #222;
        font-weight: 600;
        font-size: 13px;
    }

    .listen_reply_box p.listen_msg {
        width: 70%;
        color: #222;
        font-size: 13px;
    }


    .listen_msg2 li.listen_img_wrap > span {
        width: 40px;
        height: 45px;
    }

    .listen_reply_box p.listen_reply_option {1
    font-size: 13px;
        float: right;
    }

    .listen_reply_option img {
        margin-bottom: 3px;
        margin-left: 10px;
    }

    .listen_reply_write {
        position: absolute;
        bottom:0;
        margin-bottom:0;
        background:#fff;
        left:0;
        padding:10px;
    }

    .listen_reply_write textarea {
        width: calc(100% - 102px);
        height:65px;
        font-size:14px;
    }

    .listen_reply_list {
        width: 100%;
        font-size:14px;
    }

    invoice_reply_list {
        width: 48%;
        font-size:14px;
    }

    div.jcarousel ul#songs li.song p.song-title {
        font-size: 18px;
    }
    div.jcarousel ul#songs li.song p.song-artist {
        font-size: 14px;
    }

    .listen_broadlist {
        display:none;
    }

    .green-audio-player {
        width:300px;
    }

    .heart_modal_title {
        color: #f49ac1;
        padding: 10px;
    }

    .heart_modal_table {
        width: 100%;
        background-color: #f49ac1;
        color: #fff;
        font-size: 12px;
    }

    .heart_modal_table td {
        padding: 5px 10px;
    }

    .heart_modal_table th {
        padding: 5px 10px;
        width: 100px;
    }

    .heart_modal_btn {
        background-color: #f49ac1;
        color: #fff;
        border: 1px solid #f49ac1;
        border-radius: 5px;
        margin: 20px 0;
        width: 100px;
    }

    .pairing_modal_table {
        width: 100%;
        border-top: 2px solid #333;
    }

    .pairing_modal_table tr th {
        line-height: 50px;
        background-color: #f9f9f9;
        border-bottom: 1px solid #ddd;
        text-align: center;
    }

    .pairing_modal_table tr td {
        border-bottom: 1px solid #ddd;
        padding-left: 10px;
    }

    .user_modal_close {
        color: #fff;
    }

    .heart_send {
        position: absolute;
        top: 15%;
        left: 50%;
        background-color: #fff;
        margin-left: -200px;
        width: 400px;
        z-index: 10;
        padding-bottom: 20px;
        display: none;
        overflow-y: auto;
        margin-bottom: 20px;
    }

    .pairing_title2 span {
        font-size: 15px;
    }

    .pairing_modal_table2 td span {
        font-size: 12px;
    }

    .pairing_modal_table2 td {
        font-size: 13px;
        padding: 7px 0;
    }

    .rank_modal_close {
        position: absolute;
        top: 20px;
        right: 20px;
        font-size: 24px;
        color: #999;
        cursor: pointer;
    }

    .thumbnail_txt1 {
        position: absolute;
        top: 0px;
        right: 0px;
        z-index: 3;
        background-color: rgba(0, 0, 0, 0.6);
        color: #fff;
        padding: 5px;
        font-size: 11px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .thumbnail_txt3 {
        position: absolute;
        bottom: 5px;
        right: 0px;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.7);
        color: #fff;
        padding: 3px 5px;
        border-radius: 5px;
        font-size: 11px;
        -webkit-transform: scale(0.83);
    }

    .banner_icon {
        width:13px;
        margin-right:3px;
    }

    .font11 {
        font-size: 11px;
    }

    .listen_right_scroll {
        padding:15px;
    }

    .listen_right_scroll2 {
        height:calc(100% - 65px);
    }

    .invo_right_scroll {
        /*padding:0px 15px;*/
        height: calc(100% - 175px);
    }

    .audio_con2 {
        height:100%;
    }

    .invo_audio_con {
        height:calc(100% - 75px);
        padding:20px 0;
    }

    .listen_bg {
        width: 100%;
        height: calc(100% - 55px);
        margin-top: 0;
    }

    .request_box {
        background: #f9f9f9;
        padding: 30px;
    }

    .listen_ori_bg {
        width: 100%;
        height: calc(100% - 75px);
        margin: 0;
    }

    .invo_ori_bg {
        width: 100%;
        height: 300px;
    }

    .listen_ori_bg2 {
        width: 100%;
        height: calc(100% - 75px);
        margin: 0;
    }

    .origin_btn {
        margin-top: 30px;
    }

    .log_data_table {
        width: 100%;
    }

    .msg_table {
        width: 100%;
        border-top: 2px solid #333;
    }

    .msg_table thead {
        display: none;
    }

    .msg_list {
        display: inline-block !important;
        width:100%;
        position: relative;
        border-bottom: 1px solid #eee;
        padding: 5px 0;
    }

    .msg_table .msg_list li {
        border: none;
        padding: 6px 5px;
        font-size: 13px;
        height:auto;
        line-height:initial;
    }

    .msg_table .msg_list li.date {
        color:#999;
        font-weight:400;
        width:100%;
        display:inline-block;
        text-align:left;
    }

    .msg_title {
        display:none;
    }

    .msg_list li.msg_ck {
        width:50px;
        float:left;
    }

    .msg_list > li.name {
        font-weight: 600;
        height:auto;
        text-align:left;
        width:calc(100% - 50px);
        display:inline-block;
        float:none;
    }

    .msg_list > li.msg_con {
        display: block;
        text-align: left;
        color: #666;
        text-indent:initial;
        word-break:break-all;
        height:auto;
        width:100%;
        float:none;
    }

    .msg_list > li.state {
        display: contents;
    }

    .msg_list > li.state span {
        position: absolute;
        right: 10px;
        bottom: 10px;
        display:inline-block;
    }

    .msg_table .msg_view {
        display: none;
    }

    .msg_txt {
        font-size: 13px;
        padding:0px 0px 10px 0;
    }

    .msg_table .msg_view li {
        text-align: left;
        background-color: #eaeaea;
        padding: 10px;
    }

    .send_msg_table th {
        font-size:13px;
    }

    .reply_box2 {
        float: right;
        font-size: 13px;
        position: initial;
        margin-top: 5px;
        text-align:right;
    }

    .textarea_btn {
        padding: 5px 10px;
        font-size: 13px;
    }

    .msg_textarea {
        width: 100%;
        border: 1px solid #ddd;
        font-size: 13px;
        padding: 10px;
        min-height: 30px;
        resize: none;
        vertical-align: bottom;
        outline: none;
    }

    .msg_table .msg_view {
        display: none;
    }

    .send_msg_table {
        width: 100%;
    }

    .origin_wrap {
        width: 47%;
        margin: 2% 1.4444%;
    }

    .origin_txt_wrap {
        width: 100%;
    }

    .inlive_dj_table,
    .inlive_dj_table2 {
        width: 100%;
    }

    .find_table {
        width: 100%;
    }

    .find_table > li {
        margin:initial;
    }

    .find_table > li > ul {
        font-size:13px;
    }

    .find_table > li > ul > li:first-child {
        display:table-cell;
        width:70px;
        font-weight:600;
    }

    .find_table > li > ul > li:last-child {
        display:table-cell;
        width:calc(100% - 70px);
        margin-top:10px;
    }

    .find_table > li > ul > li >input {
        width:150px;
    }

    .find_table2 {
        margin: 0px auto;
        margin-top:30px;
        min-height:150px;
    }

    .find_table2 > li {
        display:table;
        margin:0 auto;
    }

    .find_table2 > li > ul {
        font-size:13px;
    }

    .find_table2 > li > ul:last-of-type {
        margin-top:20px;
    }

    .find_table2 > li > ul > li > input {
        width:100%;
    }

    .find_table2 > li > ul > li:first-child {
        display:block;
        width:100%;
        font-weight:600;
    }

    .find_table2 > li > ul > li:last-child {
        display:block;
        width:100%;
        margin-top:10px;
    }

    .find_table_text {
        font-size:13px;
    }

    .join_info_table {
        width: 100%;
    }

    .join_btn_box {
        width: 100%;
    }

    .join_table {
        width: 100%;
    }

    .question_table {
        width: 100%;
    }

    .card-columns .card-item:nth-of-type(n+7) {
        display: none;
    }

    .cnt_box {
        width: 50%;
        text-align: right;
    }

    .mobile_line {
        width: 100%;
        height: 1px;
        position: absolute;
        top: 73%;
        left: 0;
        border-top: 1px solid #e5e5e5;
    }

    .bx_txt1 {
        margin-bottom: 3px;
    }

    .bx_txt2 {
        margin-bottom: 3px;
        font-size:13px;
    }

    .hash_box2 {
        float: none;
    }



    .oc_left {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: -120px;
        cursor: pointer;
    }

    .oc_right {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: 90px;
        cursor: pointer;
    }

    .search_cj_li {
        width: 100%;
    }

    .favorites_content li.txt3 {
        float: left;
        clear: both;
        margin-top: 20px;
    }

    .charge_list_ul {
        font-size:14px;
    }

    .user_table {
        font-size:14px;
    }

    .user_table tr th {
        font-size:14px;
        padding:10px;
    }

    .profile_wrap {
        margin:20px 0;
        font-size:14px;
    }

    .withdrawal_box {
        font-size:14px;
    }

    .user_board_write_table {
        width:100%;
        float:none;
    }

    .user_board_write_table tr td {
        display:contents;
    }

    .image_upload {
        width:100%;
        border:1px solid #ddd;
        border-top:none;
    }

    .event-item {
        margin-bottom: 40px;
        cursor: pointer;
        width: 100%;
        margin: 0 0px 15px 0px;
    }

    .level_border_in {
        top:4px;
        left:0;
        width:41px;
        height:50px;
    }

    .level_nick {
        margin-left:10px;
        float:left;
        width:100px;
        margin-top:6px;
    }

    .cover_box {
        margin-top:100px;
    }

    .intalk_wrap {
        display:block;
    }

    .intalk_left {
        width:100%;
        float:none;
    }

    .listen_right2 {
        width:100%;
        float:none;
    }

    .intalk_thumbnail  {
        height:220px;
    }

    .intalk_list_box {
        margin:0.5%;
        width:32%;
        float:left;
    }
    .intalk_color_bg {
        width:100%;
        height:350px;
    }

    .intalk_color_img_bg {
        width:100%;
        height:100%;
    }

}

/*************************************************************max-width:767px***********************************************************/



@media(max-width:767px) {

    .usermenu_whisperlist {
        bottom: 52px;
    }

    .wsp_everyone {
        top: -27px;
        left: 60px;
        font-size: 24px;
    }

    .wsp_target {
        top: -26px;
        left: 42px;
    }
    .chatting_write_box > input {
        /*padding-left: 24px !important;*/
    }

    .popcast:nth-child(n+6) {
        display: none;
    }
    .popcast:nth-child(-n+5) {
        width: 20% !important;
    }
    .newcast:nth-child(n+6) {
        display: none;
    }
    .newcast:nth-child(-n+5) {
        width: 20% !important;
    }

    .chat_ymdmis {
        display: none;
    }

    .chatting_write_box_emoji {
        top: -26px;
        right: 136px;
    }

    .chat_msg_td {
        width: 75%;
    }

    .top_bar ul li:nth-child(3).login_top_menu3 {
        line-height: 24px;
        padding-right: 0px;
    }

    .audioSlider_instation .ui-slider-horizontal .ui-slider-handle {
        top: -.4em !important;
        margin-left: -5px !important;
    }

    .invoiceAudioSlider_instation .ui-slider-horizontal .ui-slider-handle {
        top: -.4em !important;
        margin-left: -5px !important;
    }

    .user_table tr.tbl_notice span.tbl_category {
        border: 0px solid #e877ae;
        padding: 0px;
    }

    .content3 {
        padding: 30px 0px;
    }

    .inlive_dj_table2 tr th {
        width: 80px;
        font-size: 13px;
    }

    .board_notice_modal {
        font-size: 13px;
    }

    .listen_close {
        display: block;
    }

    .invoice_right_close {
        display: none;
    }

    .invo_left {
        width: calc(100% - 0px);
        margin-left: 0px;
        padding: 0px 10px 0px 10px;
    }

    .invo_right {
        width: 100%;
        padding: 0px 10px 0px 10px;
        position: relative;
    }

    .invoice_broadlist {
        margin-bottom: 30px;
    }

    .invo_list_pick_img {
        width: 110px;
        height: 110px;
    }

    div.invoice_btn_controls {
        font-size: 14px ;
    }

    .broadcast_url {
        font-size:10px;
        display: none;
    }

    .bell-icon {
        position:absolute;
        top:0;
        right:105px;
    }

    .mission {
        font-size:19px;
        color:#999;
        position:absolute;
        top:-1px;
        right:145px;
    }


    .mission span.newbell {
        top:0px;
    }

    .bell-icon span {
        top:0;
    }

    .alram {
        top:40px;
        right:0;
    }

    .mission_wrap {
        top:40px;
        right:0;
    }

    .featured_img {
        width:150px;
        margin-right:10px;
        border-radius:5px;
        overflow:hidden;
        display:inline-block;
    }

    .content {
        width: 100%;
        padding: 15px 15px;
        display: inline-block;
    }

    .content_title {
        font-size:18px;
    }

    .user_type_ul {
        font-size:13px;
    }

    .toplive_txt2 {
        font-size:12px;
    }

    .broadcast_url2 {
        font-size:10px;
        float:none;
    }

    .copy_btn {
        margin-left:0;
    }

    .toplive_txt4 {
        font-size:12px;
        padding:5px 0;
    }

    .left_menu ul li {
        width: 100%;
        position: relative;
        font-size: 14px;
    }

    .image_upload_wrap {
        height:100px;
        padding:5px;
    }

    .image_upload_wrap > .image_upload2 {
        width:20%;
        float:left;
    }

    .image_upload_list_wrap {
        float:left;
        width:80%;
        height:88px;
        border-left:none;
        display:inline-block;
    }

    .image_upload_list {
        margin-top:7px !important;
    }

    .image_upload_list li {
        height:75px;
    }

    .image_upload_item {
        margin:15px;
        border:1px solid #ddd;
        width:100%;
        height:100%;
        display:inline-block;
        position:relative;
    }

    .image_upload_item img {
        width:100%;
        height:100%;
    }

    .image_delete_btn {
        position:absolute;
        top:5px;
        right:5px;
        color:#fff;
        opacity:0.5;
    }

    .image_upload2 {
        background:#f9f9f9;
        width:100%;
        display:inline-block;
        height:88px;
        position:relative;
        text-align:center;
        border-right:1px solid #ddd;
    }

    .image_upload2:after {
        font-size:30px;
    }

    .image_upload_icon span {
        font-size:11px;
    }

    .pc_none {
        display: inline-block;
    }

    .tp_none {
        display: none;
    }

    .mobile_none {
        display:none;
    }

    .no_contents {
        font-size:13px;
    }

    .top_bar {
        height: 55px;
    }

    .top_bar ul .top_menu_li {
        margin-top: 15px;
    }

    .search_block {
        display: none;
    }

    .display-none {
        display: none;
    }

    .bars {
        top: 15px;
    }

    .member_icon {
        width:15px;
    }

    .logo_m {
        display: inline-block !important;
        margin-top: 15px;
        position:absolute;
        margin-left:0;
        left:50px;
    }

    .main_con {
        width: 100%;
        margin-left: 0;
        margin-top: 46px;
    }

    .bx-wrapper .bx-pager {
        padding-top:10px;
    }

    .sub_tab_title {
        font-size:16px;
    }

    .log_top_box .live_on {
        left: 38px;
    }

    .cover_box {
        margin-top:55px;
    }

    .content_title span.log_set {
        top:0;
    }

    .profile_table input {
        width:100%;
    }

    .profile_table input.input_confirm {
        width:calc(100% - 65px);
    }

    .profile_table3 th {
        font-size:13px;
    }

    .profile_table3 td {
        font-size:13px;
    }

    .listen_list_item {
        padding:0;
    }

    .footer_txt1 span:after {
        content:none;
    }

    div#sub-controls {
        font-size:15px;
    }

    .listen_reply_box li.listen_reply_id {
        font-size: 13px;
        line-height:22px;
    }

    .listen_reply_box li.listen_msg {
        font-size:13px;
    }

    .listen_reply_box .listen_msg2 {
        font-size: 13px;
    }

    .listen_right {
        position: absolute;
        width: 100%;
        height:100%;
        display: none;
        padding-top: 0px;
        padding-bottom: 0px;
        background: #fff;
        margin: 0;
        z-index: 5;
        top: 0;
    }

    .thumbnail-wrapper3 {
        width: 120px;
        overflow: hidden;
        margin: 0;
        position: relative;
        float: left;
        margin-right: 10px;
        border-radius: 5px;
    }

    .thumbnail-wrapper3 img {
        width: 100%;
    }

    .chat_list_txt {
        width: calc(100% - 140px);
        float: left;
        overflow:hidden;
    }

    .chat_list_txt1 {
        font-size: 14px;
        font-weight:500;
        white-space:nowrap;
    }

    .chat_list_txt2 {
        width: 35px;
        margin: 0;
        float: left;
        margin: 5px;
        position: relative;
    }

    .chat_list_txt3 {
        margin-top: 5px;
        display:inline-block;
    }

    .chat_list_cnt {
        margin: 5px 0;
    }

    .chat_icon_btn {
        bottom:10px;
    }

    .chat_icon_btn2 {
        bottom:10px;
    }

    .level_border{
        width:45px;
        height:54px;
    }

    .level_border_chat {
        width:37px;
        height:45px;
    }

    .level_border_chat span {
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .level_border_list {
        width:37px;
        height:45px;
    }

    .level_border_list span {
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .chat_rank_imgwrap {
        width:50px;
    }

    .level_border_broad_rank {
        width:52px;
        height:62px;
    }

    .level_border_broad_rank span {
        font-size:12px;
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .level_border_foll {
        top:0px;
        left:0;
        width:40px;
        height:49px;
    }

    .level_bg_wrap {
        width: 100%;
        padding:15px;
        background: url('/images/cash_bg.png');
        font-size: 18px;
        margin-bottom: 30px;
    }

    .level_bg {
        background:#fff;
        padding:10px;
        display:inline-block;
        width:100%;
    }

    .level_bg h2 {
        font-size:16px;
        color:#666;
    }

    .level_bg h2 span {
        color:red;
    }

    .level_wrap {
        max-width:300px;
        width:100%;
        margin:0 auto;
        padding:10px 0;
        display:block;
    }

    .level_img_wrap {
        width:100%;
        display:inline-block;
    }

    .level_img {
        float:left;
        position:relative;
        margin-left:20px;
    }

    .level_nick {
        margin-left:10px;
        float:left;
        width:auto;
        margin-top:6px;
    }

    .level_nick ul li:first-child {
        font-size:15px;
        font-weight:500;
    }

    .level_nick ul li:nth-child(2) {
        font-size:14px;
        color:#999;
    }

    .level_bar_wrap {
        float:none;
        position:relative;
        width:100%;
        display:inline-block;
        margin-top:15px;
    }

    .level_q {
        font-size:14px;
        font-weight:600;
        text-align:center;
        margin-bottom:5px;
    }

    .level_q span.studio_level_exp {
        background:#fff;
        color:#222;
        font-size:12px;
        border-radius:3px;
        padding:0 3px;
        font-weight:300;
    }

    .level_q span.studio_level_icon {
        margin-right:30px;
        display:inline-block;
    }

    .level_q span.studio_level_icon img {
        width:30px;
        /*vertical-align:bottom;*/
        margin: 0px 5px;
    }

    .level_bar_wrap ul {
        width:100%;
        padding-bottom:15px;
    }

    .level_bar_wrap ul li {
        position:absolute;
        font-size:11px;
    }

    .level_bar_wrap ul li:first-child {
        left:0;
    }

    .level_bar_wrap ul li:nth-child(2) {
        left:50%;
        transform:translate(-50%, 0%);
    }

    .level_bar_wrap ul li:last-child {
        right:0;
    }

    .level_bar {
        position:relative;
        width:100%;
        height:13px;
        border:1px solid #666;
        display:inline-block;
        border-radius:10px;
        overflow:hidden;
    }

    .level_txt_wrap {
        padding:10px 0;
    }

    .level_txt_wrap p {
        font-size:13px;
    }

    .level_txt ul.level_list > li > ul > li:first-child {
        float:none;
        width:100%;
        font-size:13px;
    }

    .level_txt ul.level_list > li > ul > li:nth-child(2) {
        font-size:13px;
    }

    .level_img > span {
        border: 1px solid #eee;
        border-radius: 50%;
        width: 45px;
        height: 45px;
        overflow: hidden;
        margin-right: 25px;
        display:inline-block;
    }

    .level_img > span > img {
        width:100%;
    }

    .achieve_list {
        width:350px;
        margin:0px auto;
    }

    .achieve_list h2 {
        font-size:14px;
    }

    .achieve_list > ul > li  {
        display:inline-block;
        width:100%;
        margin-top:5px;
        border:none;
        background:#f9f9f9;
        padding:10px 20px;
        border-radius:40px;
        position:relative;
    }

    .achieve_list ul li ul li {
        float:left;
    }

    .achieve_list ul li ul li:first-child {
        margin-right:15px;
        margin-top:3px;
        display:none;
    }

    .achieve_list ul li ul li:first-child img {
        width:20px;
    }

    .achieve_list ul li ul li:nth-child(3) {
        margin-right:10px;
    }

    .achieve_list ul li ul li:nth-child(2) {
        float:left;
        margin-top:5px;
        margin-right:10px;
        font-size:13px;
        font-weight:600;
    }

    .achieve_list ul li ul li:nth-child(4) {
        position:absolute;
        right:15px;
        top:18px;
        font-size:12px;
    }

    .achieve_list ul li ul li:last-child {
        position:absolute;
        right:40px;
        top:18px;
        display:none;
    }

    .achieve_list ul li ul li:nth-child(2) img {
        width:20px;
    }

    .achieve_list ul li ul li span.title {
        font-size:13px;
        font-weight:600;
        display:block;
    }

    .achieve_list ul li ul li span.condition {
        color:#999;
        font-size:13px;
        font-weight:400;
    }

    .achieve_list {
        width:350px;
        margin:0px auto;
    }

    .achieve_list h2 {
        font-size:14px;
    }

    .achieve_list > ul > li  {
        display:inline-block;
        width:100%;
        margin-top:5px;
        border:none;
        background:#f9f9f9;
        padding:10px 20px;
        border-radius:40px;
        position:relative;
    }


    .myitem_list {
        width:350px;
        margin:0px auto;
    }

    .myitem_list h2 {
        font-size:14px;
    }

    .myitem_list > ul > li  {
        display:inline-block;
        width:100%;
        margin-top:5px;
        border:none;
        background:#f9f9f9;
        padding:10px 20px;
        border-radius:40px;
        position:relative;
    }

    .myitem_list ul li ul li {
        float:left;
    }

    .myitem_list ul li ul li:first-child {
        margin-left:0px;
        margin-right:15px;
        margin-top:3px;
        display:none;
    }

    .myitem_list ul li ul li:first-child img {
        width:2px;
        display: none;
    }

    .myitem_list ul li ul li:nth-child(3) {
        margin-right:10px;
    }

    .myitem_list ul li ul li:nth-child(2) {
        float:left;
        margin-top:5px;
        margin-right:10px;
        font-size:13px;
        font-weight:600;
    }

    .myitem_list ul li ul li:nth-child(4) {
        position:absolute;
        right:100px;
        font-size:12px;
    }

    .myitem_list ul li ul li:last-child {
        position:absolute;
        right:20px;
        /*display:none;*/
    }

    .myitem_list ul li ul li:nth-child(2) img {
        width:20px;
    }

    .myitem_list ul li ul li span.title {
        font-size:13px;
        font-weight:600;
        display:block;
    }

    .myitem_list ul li ul li span.condition {
        color:#999;
        font-size:12px;
        font-weight:400;
    }

    .myitem_list {
        width:350px;
        margin:0px auto;
    }

    .myitem_list h2 {
        font-size:14px;
    }

    .myitem_list > ul > li  {
        display:inline-block;
        width:100%;
        margin-top:5px;
        border:none;
        background:#f9f9f9;
        padding:10px 20px;
        border-radius:40px;
        position:relative;
    }


    .btn_achi {
        padding:4px 10px;
        border-radius:15px;
        border:none;
        background:#fff;
        font-size:13px;
        border:1px solid #888;
    }

    .btn_achi:hover {
        background:#e877ae;
        color:#fff;
        border:none;
    }

    .btn_achi_on {
        padding:5px 18px;
        border-radius:15px;
        border:none;
        background:#e877ae;
        color:#fff;
        font-size:13px;
    }


    .btn_myitem {
        padding:4px 10px;
        border-radius:15px;
        border:none;
        background:#fff;
        font-size:13px;
        border:1px solid #888;
    }

    .btn_myitem:hover {
        background:#e877ae;
        color:#fff;
        border:none;
    }

    .btn_myitem_on {
        padding:5px 18px;
        border-radius:15px;
        border:none;
        background:#a1a1a1;
        color:#fff;
        font-size:13px;
    }


    .oc_bottom2 {
        font-size:14px;
    }

    .filebox label.file_ok {
        font-size:14px;
        padding:15px 20px;
    }

    .my_menu {
        top:39px;
        right: 0;
    }

    .my_profile_txt ul li:first-child {
        font-size: 15px;
        font-weight:600;
    }

    .my_profile_txt ul li:last-child {
        margin-top:5px;
    }

    .my_profile_txt ul li:last-child > p {
        font-size:13px;
    }

    .top_menu {
        display: table-cell;
        margin: 0;
        float: right;
    }

    .origin_list {
        margin-top:15px;
    }

    .mute_icon {
        right:7px;
    }

    .mute_icon span {
        width:22px;
        height:22px;
        display:table-cell;
        background:#222;
        color:#fff;
        border-radius:50%;
        text-align:center;
        vertical-align:middle;
        font-size:13px;
    }

    .mute_icon span i {
        font-size:11px;
    }

    .oc_top {
        font-size:14px;
    }

    .oc_title_wrap {
        width: calc(100% - 65px);
        height: 26px;
    }

    .tabtab {
        width: 100%;
        margin: 20px 0;
        overflow: hidden;
        overflow-x: auto;
        position: relative;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */
        cursor: pointer;
    }

    .tabtab::-webkit-scrollbar {
        display: none;
        /* Chrome,Safari,Opera*/
    }

    .my_profile_img {
        width: 45px;
        height: 45px;
        margin-right: 10px;
    }

    .level_border_my {
        width:45px;
        height:55px;
    }

    .level_border_log {
        width:57px;
        height:67px;
    }

    .level_border_log span {
        font-size:10px;
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .level_border_log2 {
        width:40px;
        height:49px;
    }

    .level_border_log2 span {
        font-size:10px;
        -webkit-transform:scale(0.93) translate(-55%, 0);
    }

    .level_border_my > span {
        font-size:11px;
    }

    .level_border_rank {
        top:-1px;
        left:4px;
        width:42px;
        height:51px;
    }

    .level_border_sch {
        top:-1px;
        left:0px;
        width:42px;
        height:51px;
    }

    .follower_list li {
        padding: 10px 0;
    }

    .follower_list li span.foll_img {
        width: 40px;
        height: 40px;
    }

    .follower_list li div {
        margin-right:10px;
    }

    .m_my_list {
        display: none;
    }

    .follower_txt3 {
        font-size: 13px;
        width: calc(100% - 238px);
        white-space:nowrap;
        text-overflow:ellipsis;
        overflow:hidden;
    }

    .smallbt {
        font-size: 12px;
    }

    .m_follower span {
        margin: 0 2px;
        width: 30px;
        height: 30px;
    }

    .live_tab_menu {
        height: 40px;
        margin:10px 0;
    }

    .live_tab_menu li {
        font-size: 14px;
        line-height: 40px;
        height: 40px;
    }

    .sub_tab_menu {
        height: 40px;
        margin:10px 0;
    }

    .sub_tab_menu li {
        font-size: 14px;
        line-height: 40px;
        height: 40px;
    }

    .sub_tab_menu2 {
        height: 40px;
    }

    .sub_tab_menu2 li {
        font-size: 14px;
        line-height: 40px;
        height: 40px;
    }

    .sub_tab_menu3 {
        height: 40px;
        margin:20px 0 0 0;
    }

    .sub_tab_menu3 li {
        font-size: 14px;
        line-height: 40px;
        height: 40px;
    }

    .sub_tab_menu4 {
        height: 40px;
    }

    .sub_tab_menu4 li {
        font-size: 14px;
        line-height: 40px;
        height: 40px;
    }

    .sub_tab_menu6 {
        width:100%;
        margin:10px 0;
    }

    .sub_tab_menu6 li {
        font-size: 13px;
        cursor: pointer;
        width: 33%;
        text-align: center;
        padding: 0 5px;
        height:40px;
        line-height:40px;
    }

    .sub_tab_menu6 li:first-child {
        border-bottom-left-radius:0;
        border-bottom:none;
    }

    .sub_tab_menu6 li:nth-child(2) {
        border-bottom:none;
    }

    .sub_tab_menu6 li:nth-child(3) {
        border-right:1px solid #ddd;
        border-top-right-radius:10px;
        border-bottom:none;
    }

    .sub_tab_menu6 li:nth-child(4) {
        border-bottom-left-radius:10px;
        width: 49%;
    }

    .sub_tab_menu6 li:last-child {
        border-top-right-radius:0;
        border-right:1px solid #ddd;
        width: 50%;
    }

    .sub_tab_menu3 li > img,
    span.tab_txt {
        display: none;
    }

    .card-columns2 .card-item2:nth-of-type(n+4) {
        display: block;
    }

    .wrap_con {
        margin: 0;
        width: 100%;
        margin-top:55px;
    }

    .wrap_con2 {
        margin-left: 0;
        width: 100%;
        height:100%;
    }

    .main_con {
        margin-left: 0;
        width: 100%;
        height:calc(100% - 55px);
        margin-top: 46px;
    }

    .hash_box2 span {
        border: 0;
        padding: 0;
    }



    .mobile_block {
        display: inline-block;
    }

    .m_search {
        float: left;
        margin: 0 15px;
    }

    .logo {
        display: none;
    }

    .origin_img_wrap {
        width: 100px;
        height: 100px;
    }

    .origin_area {
        font-size:13px;
    }

    .origin_title {
        font-size: 14px;
        white-space: normal;
        height: 38px;
        word-break:keep-all;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .ori_icon_wrap {
        float: left;
        margin: 0 10px;
    }

    .top_bar ul li {
    }

    .top_bar ul li:nth-child(2).login_top_menu {
        right: 0;
        line-height:20px;
    }

    .logo_box {
        margin: 0 auto;
        display: table;
        text-align: center;
    }

    .left_menu {
        top: 55px;
    }

    .level_border_top {
        width:27px;
        height:35px;
    }

    .level_border_top span {
        font-size:10px;
        -webkit-transform:scale(0.82) translate(-65%, 0);
    }

    .studio_member_icon {
        width: 27px;
        height: 27px;
    }

    .member_list > li {
        line-height: 0px;
    }

    .pic_wrap > span.left_pro_img img {
        width:100%;
        display: block;
    }

    .pic_wrap > div.top_user_img {
        width:27px;
        height:27px;
    }

    .modal_bg {
        top: 55px;
    }

    .top_menu > li.login_top_menu > span {
        color: #999;
    }

    .top_menu li.login_top_menu span.menu_cnt {
        font-size: 12px;
    }

    .top_menu li:nth-child(2) span.top_btn {
        margin-top: 5px;
        padding-right: 0;
    }

    footer .notice {
        height: 45px;
    }

    footer .notice li {
        font-size: 14px;
        line-height: 45px;
    }

    footer .notice li:nth-child(2) {
        font-size: 14px;
        float: left;
        white-space:nowrap;
        width:calc(100% - 90px);
        overflow:hidden;
    }

    footer .notice li:nth-child(3) {
        font-size: 14px;
    }

    .notice_ymd {
        display: none;
    }

    .origin_thumb_box {
        width: 120px;
        height: 120px;
    }

    .origin_txt1 {
        font-size: 14px;
    }

    .hash_box li {
        padding: 4px 8px;
        font-size: 13px;
    }

    .cnt_box {
        margin-top: 0;
    }

    .sub_content_title span {
        font-size:18px;
    }

    .content_sub_title {
        font-size: 13px;
    }

    .thumbnail_txt2 {
        font-size: 13px;
    }

    .bx_txt1 {
        font-size: 15px;
        color: #222;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .bx_txt3 {
        font-size: 12px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        height:35px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .top_bar ul li.search_block {
        position: absolute;
        width: 100%;
        top: 62px;
        margin: 0;
        padding: 0;
        left: 0;
        z-index: 2;
    }

    .search_block input {
        width: 100%;
        font-size:13px;
    }

    .infinity_btn {
        display: none;
    }

    .ranking_li {
        padding: 7px 0 13px 0;
    }

    .ranking_content .rank_new {
        font-size:10px;
        -webkit-transform: scale(0.83);
    }

    .ranking_content .rank_down {
        font-size:10px;
        -webkit-transform: scale(0.83);
    }

    .ranking_content li.txt1 {
        width: 38px;
        line-height:50px;
    }

    .ranking_content li.txt2 {
        margin: 0;
        clear: both;
    }

    .ranking_content li.txt2 .ranking_wrap {
        width:50px;
    }

    .ranking_content li.txt2 .ranking_wrap .live_on {
        left:8px;
    }

    .ranking_content li.txt2 .ranking_wrap .img_border2 {
        left:5px;
        width:42px;
        height:42px;
    }

    .ranking_content li.txt2 .ranking_wrap .ranking_img {
        width:40px;
        height:40px;
    }

    .ranking_content li.txt2 .ranking_wrap .ranking_img span {
        width:38px;
        height:38px;
    }

    .ranking_content li.txt2 span.ranking_img img {
        width:100%;
    }

    .ranking_content li.txt3 {
        width:35px;
        line-height:55px;
    }

    .ranking_content li.txt4 {
        font-size:13px;
        min-width: 150px;
        width:calc(100% - 160px);
    }

    .ranking_content li.txt4 p.ranking_broad_title {
        font-weight:500;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
        width:calc(100% - 30px);
    }

    .ranking_content li.txt5 span:first-child {
        margin: 0;
    }

    .ranking_content .rank_up {
        font-size:10px;
        -webkit-transform: scale(0.83);
    }

    .rank_date {
        font-size:13px;
    }

    .wd20 {
        width: 15%;
    }

    .find_table {
        margin-top:20px;
    }

    .join_wrap {
        padding:40px 20px;
        margin:0 auto;
    }

    .join_ul {
        width:100%;
    }

    .join_wrap span.join_info_table_tit {
        width:100%;
    }

    .radio_btn input[type="radio"] + label {
        margin-right:10px;
    }

    .left_menu {
        top: 55px;
    }

    .chat_data_ul {
        margin-top: 60px;
    }

    .audio_con {
        padding-top: 0;
        /*min-height: calc(100vh - 55px);*/
    }

    .audio_con2 {
        width:100%;
        height:calc(100% - 55px);
        padding:0;
        margin-top:55px;
        overflow:hidden;
    }

    .invo_audio_con {
        width:100%;
        height:calc(100% - 55px);
        padding:0;
        margin-top:55px;
        overflow:hidden;
    }

    .listen_bg_box {
        width: 100%;
        height: 100%;
        margin-top: 0;
    }

    .invoice_wrap {
        padding:50px 15px;
        font-size:14px;
    }

    .intalk_box {
        padding:50px 15px;
        max-width:100%;
        margin:0 auto;
    }

    .intalk_title {
        font-size:14px;
    }

    .intalk_write_box {
        width:100%;
    }

    .intalk_user {
        bottom:15px;
    }

    .intalk_user > .listen_top_ul > .user_img_wrap2 {
        margin-left:15px;
    }

    .intalk_user > .invoice_top_ul > .user_img_wrap2 {
        margin-left:15px;
    }

    .intalk_icon {
        margin-left:20px;
    }

    .intalk_icon li {
        font-size:13px;
    }

    .intalk_list_box {
        margin:0.5%;
        width:49%;
        float:left;
    }

    .intalk_list_txt {
        font-size:13px;
        height:38px;
    }

    .intalk_txt {
        font-size:12px;
    }

    .intalk_txt1 {
        font-size:13px;
    }

    .intalk_btn_wrap {
        font-size:13px;
    }

    .intalk_heart_icon {
        font-size:12px;
    }

    .thumbnail_txt4 {
        padding:5px 15px;
    }

    .thumbnail_txt4 span {
        font-size:11px;
        margin-right:6px;
    }

    .solo_setting_box h2 {
        font-size:14px;
    }

    .solo_bg {
        width:150px;
        height:150px;
    }

    .listen_content {
        height: 100%;
        width:100%;
    }

    .user_img_wrap {
        width: 40px;
        height: 40px;
    }

    .user_img_wrap2 {
        width: 40px;
        height: 40px;
    }

    .listen_top_ul > li > ul > li.arrow {
        margin-top: 10px;
    }

    .listen_top_ul > li {
        float: left;
    }

    .listen_top_ul > li:nth-child(2) {
        font-size: 14px;
        width:calc(100% - 130px);
    }

    .listen_top_ul > li.float-right {
        margin-top: 0;
    }

    .listen_top_ul > li > ul > li:first-child {
        font-size: 14px;
        white-space:nowrap;
        text-overflow:ellipsis;
        overflow:hidden;
    }

    .listen_top_ul > li > ul > li:nth-child(2) {
        font-size:13px;
        width:100%;
    }

    .listen_top_ul > li > ul > li:nth-child(3) {
        margin-top: 5px;
        margin-left: 5px;
        font-weight:200;
    }

    .listen_top_ul > li > ul > li:nth-child(4) {
        margin-top: 10px;
        margin-left: -5px;
    }

    .listen_top_ul > li > ul > li > .user_rank_style {
        width: 70%;
        position: absolute;
        top: -12px;
        left: -2px;
        z-index: 4;
    }

    .cj_btn_follow {
        float: right;
        font-size:13px;
    }

    .listen_tit {
        margin-left: 0px;
    }

    .listen_tit .subj {
        font-size: 16px;
        margin-left: 0;
    }

    .listen_tit .subj2 {
        margin-left: 0;
        font-size:14px;
    }

    .listen_hash {
        font-size: 11px;
        margin: 10px 0 0 0px;
    }

    .listen_hash span {
        padding: 3px 10px;
        border: 1px solid #fff;
        border-radius: 15px;
    }

    .user_cnt .chatting_user_wrap {
        width: auto;
        font-size: 12px;
        margin-right: 10px;
    }

    .listen_top {
        margin-top:0px;
    }

    .listen_top2 {
        position:relative;
    }

    .listen_top_ul {
        padding:10px 0;
    }

    .invoice_top_ul {
        padding:10px 0;
    }

    .mental_broadcast {
        font-size: 13px;
    }

    .pairing_icon {
        position: absolute;
        bottom: 14px;
        right: 10px;
    }

    .chat_content {
        width: 100%;
        padding: 0px;
    }

    .invo_content {
        width: 100%;
        padding: 0px;
    }

    .chat_content2 {
        width: 100%;
        padding: 0px;
    }

    .mental_broadcast > img {
        width: 22px;
    }

    .chat_data_ul {
        margin-top: 0px;
    }

    .chat_data_ul .point_icon {
        width: 15px;
    }

    .listen_btn img {
        width: 11px;
    }

    .pairing_icon {
        margin: 0;
    }

    .pairing_icon img {
        width: 24px;
    }

    .chatting {
        padding: 10px;
        font-size: 14px;
        height: calc(100% - 216px);
    }

    .scrollbar {
        padding: 10px;
        font-size: 14px;
        height: calc(100% - 215px);
    }

    .chat_user_pic_wrap {
        width: 35px;
        height: 35px;
        margin-right:5px;
    }

    .chat_user_pic_wrap2 {
        width: 30px;
        height: 30px;
        margin: 5px 5px 0 0;
        margin-bottom: 3px;
    }

    .chat_msg_td .chat_msg {
        padding: 7px 10px;
        max-width: 80%;
        word-break: break-all;
    }

    .chat_msg_login {
        padding: 5px 10px;
    }

    .chat_msg_gift {
        padding: 7px 10px;
        font-size: 12px;
    }

    .chat_msg_td .chat_msg2 {
        /*max-width: 80%;*/
        max-width: 50%;
    }

    .listen_bg {
        height: 100%;
        margin-top: 0;
    }

    .listen_ori_bg {
        height: 100%;
        margin-top: 0;
    }
    /*
    .invo_ori_bg {
        height: 100%;
        margin-top: 0;
    }
*/
    .listen_ori_bg2 {
        height: 100%;
        margin-top: 0;
    }

    .listen_end {
        height: 90vh;
        margin-top: 0;
    }

    .user_chat_img {
        display: block;
        width: 36px;
        height: 40px;
        margin: 0;
        float: left;
    }

    .listen_back_btn {
        position: absolute;
        top: 10px;
        left: 15px;
        font-size: 20px;
        cursor: pointer;
    }

    .listen_back_btn2 {
        position: absolute;
        top: 18px;
        left: 15px;
        font-size: 20px;
        cursor: pointer;
    }

    .chatting_write_box {
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        padding: 10px;
    }

    .chatting_write_btn {
        position: absolute;
        font-size: 13px;
        top: 11px;
        right: 98px;
        color: #333;
        background-color: #fff;
        border: 1px solid #333;
        padding: 8px 10px;
        border-radius: 5px;
    }

    .chat_icon_btn2 {
        width:75px;
        display:none;
    }
    /*
	#audioSlider {
		width:35px !important;
		top:-15px !important;
	}
*/
    #invoiceAudioSlider {
        width:35px !important;
        top:-15px !important;
    }

    .chatting_write_box > input {
        width: calc(100% - 185px);
        color: #000;
        float: left;
        font-size: 13px;
        height: 35px;
        left:50px;
    }

    .chat_box {
        width: calc(100% - 190px);
        color: #000;
        float: left;
        font-size: 13px;
        height: 35px;
        line-height:30px;
    }

    .chat_icon_btn {
        margin: 2px;
        float: left;
        width: 20px;
        height: 30px;
        font-size: 17px;
        border-radius: 2px;
        color: #fff;
        display: block;
        text-align: center;
        line-height: 30px;
    }

    .chatting_write_box2 {
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        background-color: #d4d4d4;
        padding: 10px;
    }

    .chatting_write_btn2 {
        position: absolute;
        font-size: 13px;
        top: 12px;
        right: 98px;
        color: #333;
        background-color: #fff;
        border: 1px solid #333;
        padding: 8px 10px;
        border-radius: 5px;
    }

    .chatting_write_box2 > input {
        width: calc(100% - 88px);
        padding: 7px 55px 7px 12px;
        color: #000;
        float: left;
    }

    .live_tab_menu li {
        font-size: 14px;
    }

    .sub_tab_menu li {
        font-size: 14px;
        width:140px;
    }

    .music_title {
        font-size: 13px;
        line-height: 25px;
    }

    .music_list {
        font-size:13px;
    }

    .music_list > ul > li > ul {
        width:100%;
        border-bottom:1px dashed #ddd;
        padding:8px 0;
    }

    .music_list > ul > li > ul > li {
        float:left;
    }

    .music_list > ul > li > ul > li:nth-child(2) {
        width:calc(100% - 65px);
    }

    .music_list > ul > li > ul > li > div.music_list_nick {
        height:35px;
    }

    .music_list > ul > li > ul > li > div.music_list_nick span.date {
        font-size:12px;
    }

    .music_list > ul > li > ul > li > div.music_list_nick span.music_letter_heart {
        font-size:12px;
    }

    .music_list > ul > li > ul > li > p.music_list_nick {
        height:35px;
    }

    .music_list > ul > li > ul > li > p.music_list_nick span.date {
        font-size:12px;
    }

    .music_list > ul > li > ul > li > p.music_list_nick span.music_letter_heart {
        font-size:12px;
    }

    .music_list > ul > li > ul > li > p.music_list_title span {
        border-radius:5px;
        font-size:12px;
    }

    .music_list > ul > li > ul > li > p.music_list_title {
        display:block;
        font-weight:500;
        width:calc(100% - 55px);
        height:38px;
    }

    .music_list_letter {
        background:#f9f9f9;
        width:100%;
        padding:10px;
        border-radius:10px;
        font-size:14px;
    }

    .music_list_letter p {
        line-height:19px;
        font-size:13px;
    }

    .music_letter_btn_wrap {
        top:23px;
    }

    .music_letter_btn {
        font-size:12px;
    }

    .chatting {
        font-size: 12px;
    }

    .music_icon02 {
        width: 20px;
        height: 20px;
    }

    .oc_title2 {
        height: 25px;
    }

    .board_btn {
        border: 1px solid #e877ae;
        background-color: #fff;
        padding: 7px 16px;
        color: #e877ae;
        font-size: 13px;
        font-weight: 600;
        display: inline-block;
    }

    .board_btn2 {
        background-color: #fff;
        border: 1px solid #999;
        padding: 7px 16px;
        color: #555;
        font-size: 13px;
        font-weight: 600;
        display: inline-block;
    }

    .board_btn3 {
        border: none;
        background-color: #e877ae;
        padding: 7px 17px;
        color: #fff;
        font-size: 13px;
        display: inline-block;
    }

    .board_btn4 {
        border: none;
        background-color: #b7b7b7;
        padding: 7px 17px;
        color: #fff;
        font-size: 13px;
        display: inline-block;
    }

    .board_btn5 {
        border: 1px solid #c863a4;
        padding: 5px 3px;
        color: #fff;
        font-size: 11px;
        display: inline-block;
    }

    .log_follow_btn {
        border: none;
        padding: 5px 13px;
        color: #fff;
        background:#e877ae;
        font-size: 13px;
        display: inline-block;
        border-radius:5px;
    }

    .oc_left {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: -120px;
        cursor: pointer;
    }

    .oc_right {
        position: absolute;
        top: 60%;
        left: 50%;
        margin-left: 90px;
        cursor: pointer;
    }

    .company_txt1 {
        font-size: 15px;
        text-align: center;
        font-weight: 600;
    }

    .company_txt2 {
        font-size: 15px;
        text-align: center;
        font-weight: 600;
        background-color: #eee;
        padding: 20px 0;
        color: #666;
    }

    .company_txt3 {
        font-size: 15px;
        color: #999;
        font-weight: 600;
        margin-bottom: 30px;
    }

    .company_img {
        width: 100%;
        max-width: 720px;
    }

    .log_txt1 .log_img span#nick_box {
        width:40px;
        height:40px;
    }

    .log_txt1 {
        font-size:14px;
    }

    .log_txt_box > li {
        font-size:13px;
        padding:10px;
    }

    .nick_box > .txt1 > span {
        font-size:12px;
    }

    .event_title {
        font-size:14px;
        margin-top:5px;
    }

    .event_ymd {
        margin-top:5px;
    }

    .tab_select ul li {
        font-size:14px;
    }

    .audio_option_ul li {
        font-size:13px;
    }

    .cj_info > ul > li.cj_title {
        font-size:14px;
    }

    .listen_reply_write_text {
        font-size:13px;
    }

    .sort_menu {
        font-size:13px;
        margin-top:5px;
    }

    .log_data_table th {
        display:none;
    }

    .log_manage_title {
        font-weight:600;
        display:inline-block;
    }

    .profile_table {
        width:100%;
    }

    .profile_modal_btn li {
        font-size:13px;
    }

    .log_list_img img {
        width:100%;
    }

    .ranking_btn_on {
        padding: 5px 15px;
        font-size:12px;
    }

    .ranking_btn_on2 {
        padding: 5px 15px;
        font-size:12px;
    }

    .ranking_btn_on:after {
        height:11px;
        top:9px;
        right:0;
    }

    .ranking_btn {
        padding: 5px 15px;
        margin-left: -1px;
        font-weight:500;
    }

    .pw_change {
        padding:10px;
    }

    .pw_change h2 {
        text-align:center;
        padding:30px 0;
        border-bottom:2px solid #333;
        font-size:20px;
        word-break:keep-all;
    }

    .pw_change_txt {
        padding:10px;
        font-size:14px;
    }

    .pw_change_txt ul {
        padding:20px;
    }

    .pw_change_txt ul li {
        margin:7px 0;
        display:inline-block;
        width:100%;
    }

    .pw_change_txt ul li span {
        width:150px;
        display:inline-block;
        color:#333;
        font-weight:500;
    }

    .pw_change_txt ul li input[type="password"] {
        border:1px solid #ddd;
        width:200px;
        border-radius:3px;
        padding:6px;
        background:#fff;
        font-size:14px;
    }

    .pw_change_notice {
        padding:10px;
        font-size:13px;
    }

    .sleep_account h2 {
        text-align:center;
    }

    .sleep_account_txt {
        color:#666;
        padding:10px;
    }

    .sleep_account ul li input {
        width:160px;
    }

    .hash_tag_modal span {
        font-size:13px;
    }

    .guide_pop span img {
        width:75%;
    }

    .guide_pop span.guide_close {
        left:7%;
        top:1%;
    }

    .guide_pop span.guide_nick {
        left:13%;
        top:5%;
    }

    .guide_pop span.guide_title {
        left:50%;
        top:1%;
        margin-left:7%;
    }

    .guide_pop span.guide_report {
        left:auto;
        right:-1%;
        top:8%;
    }

    .guide_pop span.guide_count {
        left:11%;
        top:8%;
    }

    .guide_pop span.guide_favorite {
        left:7%;
        bottom:1%;
    }

    .guide_pop span.guide_btn {
        left:auto;
        right:-6%;
        bottom:4%;
    }

    .qna_table {
        width: 100%;
        margin-bottom: 0;
        margin-top:20px;
    }

    .qna_table > li.qna_table_header {
        padding: 12px 10px;
        font-size: 14px;
    }

    .qna_table > li.qna_table_header > ul {
        width:100%;
        display:inline-block;
    }

    .qna_table > li.qna_table_header > ul > li:first-child {
        /*width:80px;*/
        display:none;
    }

    .qna_table > li.qna_table_header > ul > li:nth-child(2) {
        width:calc(100% - 60px);
    }

    .qna_table > li.qna_table_header > ul > li:last-child {
        width:60px;
    }

    .qna_table > li.qna_table_list {
        padding: 12px 10px;
        font-size: 13px;
    }

    .qna_table > li.qna_table_list > ul {
        width:100%;
        display:inline-block;
    }

    .qna_table > li.qna_table_list > ul > li {
        float:left;
    }

    .qna_table > li.qna_table_list > ul > li:first-child {
        /*width:80px;*/
        display:none;
    }

    .qna_table > li.qna_table_list > ul > li:nth-child(2) {
        white-space:nowrap;
        text-overflow:ellipsis;
        overflow:hidden;
        width:calc(100% - 60px);
        text-align:left;
    }

    .qna_table > li.qna_table_list > ul > li:last-child {
        width:60px;
    }

    .qna_table > li.qna_table_list > ul > li.qna_state span.wait {
        color:#999;
    }

    .qna_table > li.qna_table_list > ul > li.qna_state span.end {
        color:#ff4141;
    }

    .qna_answer {
        background:#f9f9f9;
        display:inline-block;
        width:100%;
    }

    .qna_answer > ul {
        margin:10px;
        background:#fff;
    }

    .qna_answer > ul > li {
        padding:10px;
    }

    .qna_answer > ul > li.qna_answer_inlive {
    }

    .qna_answer > ul > li.qna_answer_inlive img{
        width:100px;
    }

    .qna_answer > ul > li.qna_answer_tit {
        font-weight:600;
        font-size:15px;
    }

    .qna_answer > ul > li > ul.qna_answer_txt {
        border:1px solid #ddd;
        padding:5px;
        font-size:13px;
    }

    .user_board_view_top .txt1 {
        font-size:15px;
    }

    .user_board_view_top > li > .txt2 {
        font-size:13px;
    }

    .customer_view {
        padding:10px;
    }

    .chat_tab_wrap {
        background:#fff;
        z-index:2;
        padding-left:10px;
    }

    .search_cj_li {
        padding:5px 15px 12px 15px;
    }

    .search_cj_wrap > div > span.img_wrap {
        width:40px;
        height:40px;
    }

    .search_cj_wrap > div > span.nick {
        font-size:13px;
    }

    .search_cj_wrap > div > span.id {
        font-size:12px;
    }

    .invite_wrap {
        width:100%;
        margin:20px auto;
        padding:20px;
        background:#f9f9f9;
        border-radius:10px;
        position:relative;
        font-size:13px;
    }

    .invite_wrap h2 {
        font-size:18px;
    }

    .invite_wrap_list {
        margin-top:10px;
    }

    .invite_wrap_list li {
        padding:3px 0;
    }

    .invite_btn_wrap {
        position:initial;
        margin:30px auto;
        text-align:center;
        display:inline-block;
        right:initial;
        top:initial;
        transform:initial;
        width:100%;
    }

    .chat_rank_imgwrap span.chat_rank_img {
        width: 50px;
        height: 50px;
    }

    .msg-item {
        margin-bottom: 10px;
    }

    .send_msg_input {
        font-size:13px;
    }

    .chat_rank_ul li {
        font-size:13px;
    }

    .favorites_content li {
        margin-top:0;
    }

    .favorites_content li.favorites_con {
        margin-top:7px;
    }

    .music_ul li {
        font-size:13px;
    }

    .music_tit {
        font-size: 13px;
        width:90px;
    }

    .music_text {
        width:calc(100% - 90px);
    }

    .music_text input {
        width:100% !important;
        font-size:13px;
    }

    .music_letter {
        font-size:13px;
    }

    .music_ul li:last-child {
        font-size:12px;
    }

    .user_table {
        width: 100%;
        margin-bottom: 30px;
        margin-top:20px;
        border-top:2px solid #666;
    }

    .user_table ul.item_title {
        width:100%;
        display:none;
    }

    .user_table ul.item_list {
        width:100%;
        display:flow-root;
        border-bottom: 1px solid #ddd;
        position:relative;
    }

    .user_table ul.item_list:hover {
        background:#f9f9f9;
    }

    .user_table ul.item_list li {
        text-align: center;
        padding: 3px 10px;
        font-size: 13px;
        color: #a0a0a0;
        position: relative;
        font-weight:400;
        float:left;
        border-bottom:none;
    }

    .user_table ul.item_list li:first-child {
        width:40%;
        text-align:left;
        font-size:12px;
        padding:10px 0 3px 10px;
    }

    .user_table ul.item_list li:nth-child(2) {
        width:40%;
        position:absolute;
        bottom:6px;
        text-align:left;
    }

    .user_table ul.item_list li:nth-child(3) {
        width:25%;
        float:right;
        padding:10px 10px 3px 0;
    }

    .user_table ul.item_list li:last-child {
        width:100%;
        display:block;
        text-align:right;
        padding:3px 10px 10px 0;
    }

    .user_table ul.item_list li span.user_nick:hover {
        text-decoration:underline;
        cursor:pointer;
    }

    .user_table ul.item_list li .pic_icon {
        margin-left:10px;
    }

    .user_table ul.item_list li .pic_icon img {
        width:18px;
        display:inline-block;
        vertical-align:middle;
        image-rendering:-webkit-optimize-contrast;
    }

    .user_table tr td {
        font-size:13px;
    }

    .reply_box3 .txt1 span {
        font-size:12px;
    }

    .log_txt1 .log_reply_cnt {
        font-size:12px;
    }

    .log_wrap {
        margin-top:55px;
    }

    .modal-auto {
        max-width:320px;
    }

    .invoice_re_nick {
        font-size:13px !important;
    }

    .broad_box {
        width:31.0%;
    }
}

/*************************************************************max-width:580px***********************************************************/
@media(max-width:580px) {

    .ranking_list_col2 {
        display: none !important;
    }
    .ranking_list_col4 {
        width: calc(100% - 250px) !important;
    }
    .ranking_list_col6 {
        width: calc(100% - 270px) !important;
    }

    .popcast:nth-child(n+4) {
        display: none;
    }
    .popcast:nth-child(-n+3) {
        width: 33% !important;
    }
    .newcast:nth-child(n+4) {
        display: none;
    }
    .newcast:nth-child(-n+3) {
        width: 33% !important;
    }

    .broad_time {
        display: none;
    }

    .chat_msg_td {
        width: 70%;
    }

    .broad_box {
        width:48.0%;
    }

    .invo_list_pick_img {
        width: 90px;
        height: 90px;
    }

    .card-item {
        width:48%;
        margin:1%;
    }

    .card-item-mc {
        width:48%;
        margin:1%;
    }

    .broad_box {
        width:48%;
    }

    .card-item2 {
        width:48%;
        margin:1%;
    }

    .card-item3 {
        width:48%;
        margin:1%;
    }

    .instation_typewrite_text {
        display: none;
    }

    .party_notice_box {
        top: 88px;
    }
}

/*************************************************************max-width:450px***********************************************************/
@media(max-width:450px) {
    .ranking_list_col6 {
        width: calc(100% - 210px) !important;
    }
    .live_tab_menu li {
        width: 29%;
    }
    .livetop4_content li.txt2 {
        width: 98%;
    }

    .invo_list_pick_item {
        width: 47.5%;
        margin: 10px 5px 10px 0px;
    }

    .invo_list_pick_img {
        width: 100px;
        height: 100px;
    }
}

/*************************************************************max-width:414px***********************************************************/

@media(max-width:414px) {

    .ranking_list_col4 {
        width: calc(100% - 170px) !important;
    }
    .ranking_list_col5 {
        display: none !important;
    }

    .audioSlider_invoice > #audioSlider {
        left:25px;
    }

    .music_control span.invoice_music_refresh {
        left: 164px;
    }

    .music_control span.music_volume {
        position: absolute;
        right: 40px;
    }

    .studio_top .log_pic_wrap {
        display: none;
    }

    .level_border_my {
        width:45px;
        height:55px;
        top:20px;
        left:10px;
    }

    .guide_pop span img {
        width:65%;
    }

    .guide_pop span.guide_close {
        left:10%;
        top:1%;
    }

    .guide_pop span.guide_nick {
        left:20%;
        top:8%;
    }

    .guide_pop span.guide_title {
        left:50%;
        top:1%;
        margin-left:7%;
    }

    .guide_pop span.guide_report {
        left:auto;
        right:-2%;
        top:12%;
    }

    .guide_pop span.guide_count {
        left:17%;
        top:13%;
    }

    .guide_pop span.guide_favorite {
        left:12%;
        bottom:2%;
    }

    .guide_pop span.guide_btn {
        left:auto;
        right:-12%;
        bottom:6%;
    }

    .height100{
        height:100%;
    }

    .main_con {
        width: 100%;
        margin-left: 0;
        height:calc(100% - 55px);
    }

    .user_rank_wrap {
        width: 25px;
        height: 25px;
        box-shadow: -2px 1px 6px #333;
    }

    .listen_bg {
        height: calc(100vh - 65px);
        margin-top: 0;
    }

    .btn_follow {
        width: 33px;
        height: 33px;
    }

    .btn_log {
        width: 33px;
        height: 33px;
    }

    .btn_log span {
        display: none;
    }

    .btn_follow span {
        display: none;
    }

    .email_input {
        width: 44%;
    }

    .email_select {
        width: 44%;
    }

    .email_at {
        display: inline-block;
        width: 7%;
        text-align: center;
    }

    .top_bar {
        background-color: #f4f4f4;
    }

    .footer_list {
        font-size: 12px;
    }

    .thumbnail {
        padding-top: 65%;
    }

    .hash_box2 {
        width: 100%;
    }

    .wd50px {
        width: auto;
        margin: 0 10px 0 0;
    }

    footer .notice .notice_box {
        line-height: 45px;
    }

    footer .notice li:nth-child(2) {
        font-size: 13px;
        max-width: 70%;
        margin: 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        float: left;
    }

    footer .notice li:nth-child(3) {
        width: 30%;
        margin: 0;
        float: right;
        line-height: 20px;
    }

    .ranking_content li.txt5 span {
        margin-left: 10px;
    }

    .rank_follow_btn {
        float: right !important;
    }

    .favorites_content li.txt3 button {
        margin-left: 3px;
    }

    .follow_btn2 {
        width: 80px;
    }

    .listen_bg {
        height: 93vh;
    }

    .live_gift_modal_td {
        padding: 5px;
        font-size: 12px;
        font-weight:600 !important;
    }

    .gift_modal_td {
        padding: 5px;
        font-size: 12px;
        font-weight:600 !important;
    }

    .gift_heart_ul li {
        padding: 5px 0;
        font-size: 13px;
    }

    .live_tab_menu li {
        font-size: 13px;
    }

    .sub_tab_menu li {
        font-size: 13px;
    }

    .login_footer {
        font-size: 14px;
    }

    .report_menu {
        width: 80px;
        font-size: 13px;
    }

    .report_menu2 {
        width: 70px;
        font-size: 12px;
        text-align: center;
    }

    .chat_data_ul li {
        font-size:12px;
    }

    .chat_data_ul li .user_rank_style {
        width: 70%;
        top: -8px;
        left: -1px;
    }

    .chat_rank_ul .char_rank_li {
        line-height:30px;
        height:40px;
        font-size:13px;
    }

    .chat_rank_ul .char_rank_li div.chat_rank_imgwrap2 span.chat_rank_img {
        width: 35px;
        height: 35px;
    }

    .chat_rank_ul .char_rank_li div.chat_rank_imgwrap2 img {
        width: 100%;
    }

    .chat_rank_imgwrap span.chat_rank_img {
        width: 50px;
        height: 50px;
    }

    .chat_rank_ul {
        height: 278px;
        font-size:13px;
    }

    .level_border_broad_rank2 {
        width:35px;
        height:44px;
    }

    .level_border_broad_rank2 span {
        -webkit-transform: scale(0.83) translate(-55%, 0);
    }

    div.my_id {
        height: 56px;
    }

    .gift_heart_input {
        width: 100px !important;
    }

    .live_gift_modal_td .gift_icon {
        width: 35%;
    }

    .gift_modal_td .gift_icon {
        width: 35%;
    }

    .chat_login_msg {
        display: inline-block;
        line-height: 20px;
    }

    .chat_user_pic_wrap3 {
        width: 30px;
        height: 30px;
    }

    .heart_msg_cnt {
        font-size: 14px;
    }

    .request_heart_cnt {
        right: 0px;
    }

    .chat_request_msg {
        font-size: 11px;
        float: left;
        width: 60%;
    }

    .chat_cj_ending_msg {
        font-size: 11px;
        float: left;
        width: 90%;
    }

    .oc_good img,
    .oc_reply img {
        width: 18px;
    }

    .oc_txt {
        font-size: 14px;
    }

    .company_txt1 {
        font-size: 15px;
        text-align: center;
        font-weight: 600;
    }

    .company_txt2 {
        font-size: 15px;
        text-align: center;
        font-weight: 600;
        background-color: #eee;
        padding: 20px 0;
        color: #666;
    }

    .company_txt3 {
        font-size: 15px;
        color: #999;
        font-weight: 600;
        margin-bottom: 30px;
    }

    .company_img {
        width: 100%;
        max-width: 720px;
    }

    .favorites_content li.txt1 .img_wrap {
        width:50px;
        height:50px;
    }

    .favorites_content li.txt1 .img_wrap span {
        width:46px;
        height:46px;
    }

    .favorites_content > li.favorites_con > ul > li.txt2 {
        font-size:13px;
        font-weight:500;
    }

    .favorites_content > li.favorites_con > ul > li.txt2 span {
        font-size:13px;
        font-weight:400;
    }

    .favorite_btn {
        right:0;
    }

    .paging_box button {
        width:32px;
        height:32px;
        font-size:12px;
    }

    .more_btn {
        font-size:13px;
    }

    .my_page_ul li {
        font-size:13px;
        line-height:50px;
        padding:0 10px;
    }

    .m_follower {
        line-height:50px;
    }

    .msg_write {
        font-size:13px;
    }

    .invoice_write > button {
        font-size:13px;
    }

    .my_cash span.cash_bg {
        /*height:60px;*/
        /*line-height:60px;*/
        font-size:16px;
    }

    .charge-item {
        font-size:13px;
        padding:0 5px;
    }

    .cash_info {
        font-size:13px;
    }

    .point_info {
        padding:15px;
        font-size:13px;
    }

    .cash_more_btn {
        font-size:13px;
        font-weight:600;
    }

    .customer_wrap {
        margin:20px 0 10px 0;
    }

    .customer_ul {
        font-size:13px;
    }

    .customer_ul > li {
        padding:15px 0;
    }

    .customer_ul > li > a > span {
        display:none;
    }

    .customer_subject {
        text-overflow:initial;
        overflow:initial;
        white-space:break-spaces;
        width:100%;
        height:auto;
    }

    .customer_view {
        font-size:14px;
        padding:10px;
    }

    .faq_title {
        font-size:14px;
        padding:15px 0;
        word-break:keep-all;
    }

    .faq_view {
        font-size:14px;
    }

    .question_table tr th {
        font-size:14px;
    }

    .question_table tr td {
        font-size:14px;
    }

    .my_profile {
        padding:20px 10px;
    }

    .profile_modify_icon {
        top:35px;
        padding:0;
        margin:0;
    }

    .profile_box {
        font-size:14px;
    }

}

.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}

.scroll-wrapper > .scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0 10px;
    position: relative !important;
    top: 0;
    width: auto !important;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.scroll-element {
    display: none;
}

.scroll-element, .scroll-element div {
    box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {
    cursor: default;
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999;
}

.scroll-textarea > .scroll-content {
    overflow: hidden !important;
}

.scroll-textarea > .scroll-content > textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important;
}

.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.chatting > .scroll-element,
.chatting > .scroll-element div {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}

.chatting > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.chatting > .scroll-element .scroll-element_track {
    display: none;
}

.chatting > .scroll-element .scroll-bar {
    background-color: #999999;
    display: block;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
}

.chatting:hover > .scroll-element .scroll-bar,
.chatting > .scroll-element.scroll-draggable .scroll-bar {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.chatting > .scroll-element.scroll-x {
    bottom: 0px;
    height: 0px;
    left: 0;
    min-width: 100%;
    overflow: visible;
    width: 100%;
}

.chatting > .scroll-element.scroll-y {
    height: 100%;
    min-height: 100%;
    right: 0px;
    top: 0;
    width: 0px;
}

/* scrollbar height/width & offset from container borders */
.chatting > .scroll-element.scroll-x .scroll-bar {
    height: 7px;
    min-width: 10px;
    top: -9px;
}

.chatting > .scroll-element.scroll-y .scroll-bar {
    left: -9px;
    min-height: 10px;
    width: 7px;
}

.chatting > .scroll-element.scroll-x .scroll-element_outer {
    left: 2px;
}

.chatting > .scroll-element.scroll-x .scroll-element_size {
    left: -4px;
}

.chatting > .scroll-element.scroll-y .scroll-element_outer {
    top: 2px;
}

.chatting > .scroll-element.scroll-y .scroll-element_size {
    top: -4px;
}

/* update scrollbar offset if both scrolls are visible */
.chatting > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size {
    left: -11px;
}

.chatting > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size {
    top: -11px;
}

.invite {
    text-align:center;
    color:#666;
}

.invite span.invite_q {
    display:block;
    margin-top:10px;
}

.invite span.name {
    font-weight:500;
    color:#222;
}

.invite_con {
    background:#f9f9f9;
    padding:15px;
}

.invite_btn {
    border:1px solid #e877ae;
    background:#e877ae;
    color:#fff;
}

.invite_btn:hover {
    background:#EB5791;
    border:1px solid #e877ae;
}

#output {
    color: black;
    font-size: 18px;
    padding-right: 30px;
}

div.particle-box {
    width: 100px;
    height: 365px;
    position: absolute;
    bottom: 80px;
    right: 10px;
}

div.particle {
    width: 30px;
    height: 30px;
    opacity: 1;
    position: absolute;
    bottom: 0%;
    display: none;
}

div.particle i {
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0.3;
}

div.particle i.fa-thumbs-up {
    z-index: 1;
    opacity: 0.8;
}

div.musicletter-box {
    width: 100px;
    height: 0px;
    position: absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

div.musicletter {
    width: 30px;
    height: 30px;
    opacity: 1;
    position: absolute;
    bottom: 0%;
    display: none;
}

div.musicletter i {
    position: absolute;
    left: 0px;
    top: 0px;
    opacity: 0.3;
}

div.musicletter i.fa-thumbs-up {
    z-index: 1;
    opacity: 0.8;
}

.colOne {
    color: #FCE473;
}

.colTwo {
    color: #F68B39;
}

.colThree {
    color: #662829;
}

.colFour {
    color: #5B39E3;
}

.colFive {
    color: #5AD11E;
}

.colSix {
    color: #2C70EB;
}

.colSeven {
    color: #FA81EE;
}

.colEight {
    color: #198581;
}

.colNine {
    color: #F04771;
}

.colTen {
    color: #39CFE3;
}

/* Animations */
@keyframes flowOne {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 20%;
    }

    30% {
        opacity: 0.8;
        right: 93%;
    }

    50% {
        opacity: 1;
        right:80%;
        bottom:50%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        bottom: 80%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 28%;
    }
}

@keyframes flowTwo {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 20%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 67%;
    }

    60% {
        opacity: 1;
        bottom:56%;
    }

    80% {
        right:33%;
    }

    100% {
        opacity: 0;
        right: 73%;
        bottom: 99%;
    }
}

@keyframes flowThree {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 90%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 40%;
        bottom: 70%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        right:78%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right:42%;
    }
}

@keyframes flowFour {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 16%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 63%;
    }

    60% {
        opacity: 0.2;
        bottom: 70%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 0%;
    }
}

@keyframes flowFive {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 23%;
    }

    40% {
        opacity: 0.8;
        bottom:30%;
    }

    50% {
        opacity: 1;
        right: 60%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        bottom: 70%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 73%;
    }
}

@keyframes flowSix {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 76%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 30%;
        bottom:44%;
    }

    60% {
        opacity: 0.2;
    }

    70% {
        bottom: 70%;
        right:54%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 86%;
    }
}

@keyframes flowSeven {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 12%;
    }

    40% {
        opacity: 0.8;
        bottom:50%;
    }

    50% {
        opacity: 1;
        right: 87%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        bottom: 70%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 42%;
    }
}

@keyframes flowEight {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 70%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 11%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        bottom: 60%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 78%;
    }
}

@keyframes flowNine {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 10%;
    }

    40% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
        right: 84%;
    }

    60% {
        opacity: 0.2;
    }

    80% {
        bottom: 60%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 45%;
    }
}

@keyframes flowTen {
    0% {
        opacity: 0;
        bottom: 0%;
        right: 43%;
    }

    40% {
        opacity: 0.8;
        right: 23%;
        bottom:34%;
    }

    50% {
        opacity: 1;
    }

    60% {
        opacity: 0.2;
        right:65%;
    }

    80% {
        bottom: 78%;
    }

    100% {
        opacity: 0;
        bottom: 99%;
        right: 16%;
    }
}

/*채팅방 애니메이션 효과*/

.svg-container {
    width: 80%;
    max-width: 300px;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    z-index:999;
}

.clouds {
    display: block;
    -webkit-animation: verticalScroll 0s infinite ease-in;
    -moz-animation: verticalScroll 0s infinite ease-in;
    animation: verticalScroll 0s infinite ease-in;
}

#rocket {
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-animation: takeOff 2s infinite ease-in;
    animation: takeOff 2s infinite ease-in;
}

.flame-outer {
    -webkit-animation: outerFlame .5s infinite linear;
    -moz-animation: outerFlame .5s infinite linear;
    animation: outerFlame .5s infinite linear;
}

.flame-inner {
    -webkit-animation: innerFlame .5s infinite linear;
    -moz-animation: innerFlame .5s infinite linear;
    -ms-animation: innerFlame .5s infinite linear;
    animation: innerFlame .5s infinite linear;
}

@-webkit-keyframes verticalScroll {
    0% {
        -webkit-transform: translateY(0)
    }
    100% {
        -webkit-transform: translateY(500px)
    }
}

@-moz-keyframes verticalScroll {
    0% {
        -moz-transform: translateY(0)
    }
    100% {
        -moz-transform: translateY(500px)
    }
}

@keyframes verticalScroll {
    0% {
        transform: translateY(0)
    }
    100% {
        transform: translateY(500px)
    }
}

@-webkit-keyframes takeOff {
    0% {
        -webkit-transform: scale(1) translateY(0);
    }
    100% {
        -webkit-transform: scale(0) translateY(-500px);
    }
}

@-moz-keyframes takeOff {
    0% {
        -moz-transform: scale(1) translateY(0);
    }
    100% {
        -moz-transform: scale(0) translateY(-500px);
    }
}

@keyframes takeOff {
    0% {
        transform: scale(1) translateY(0);
    }
    100% {
        transform: scale(0) translateY(-500px);
    }
}

@-webkit-keyframes outerFlame {
    0% { fill: red}
    33% { fill: orange  }
    66% {fill: yellow }
    75% { fill: orange}
    100% {fill: red  }
}

@-moz-keyframes outerFlame {
    0% { fill: red}
    33% { fill: orange  }
    66% {fill: yellow }
    75% { fill: orange}
    100% {fill: red  }
}

@keyframes outerFlame {
    0% { fill: red}
    33% { fill: orange  }
    66% {fill: yellow }
    75% { fill: orange}
    100% {fill: red  }
}

@-webkit-keyframes innerFlame {
    0% { fill: orange}
    33% { fill: yellow  }
    66% {fill: orange }
    100% {fill: red  }
}

@-moz-keyframes innerFlame {
    0% { fill: orange}
    33% { fill: yellow  }
    66% {fill: orange }
    100% {fill: red  }
}

@keyframes innerFlame {
    0% { fill: orange}
    33% { fill: yellow  }
    66% {fill: orange }
    100% {fill: red  }
}

.broad_booster {
    background:rgba(0,0,0,.5);
    color:#fff;
    font-size:13px;
    text-align:center;
    border:1px solid #e877ae;
    padding:10px 20px;
    border-radius:15px;
    width:100%;
}

/*** jelly 20220121 *********/
.itemmall_tab {
    width:100%;
    display:inline-block;
}

.itemmall_tab li {
    float:left;
    border:1px solid #ddd;
    padding:0px 15px;
    margin-right:10px;
    border-radius:15px;
    height:40px;
    line-height:40px;
}

.itemmall_tab li:hover {
    border:1px solid #e877ae;
    color:#e877ae;
    cursor:pointer;
}

.itemmall_tab li.on {
    border:1px solid #e877ae;
    color:#e877ae;
}

.itemmall_tab li a {
    text-decoration:none;
}

.item_icon_size19 {
    height: 19px;
    width: 19px;
}

.instation_loader {
    display: flex;
    align-items: center;
    justify-content: center;
    /*margin: auto;*/
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: instation_spin 2s linear infinite;
}

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

.instation_musicinfo {
    display: flex;
    justify-content: center;
}

.logcloud_top {
    position: absolute;
    width: 100%;
    text-align: center;
    display: none;
}
.logcloud_top img {
    position: absolute;
    display: none;
    top: 1px;
    /*left: calc(100% - 100px);*/
    transform: translate(-50%, -50%);
    height: auto;
    /*opacity: 0.2;*/
    z-index: 200;
}
.logcloud_right img {
    position: absolute;
    display: none;
    top: 60px;
    right: -200px;
    transform: translate(-50%, -50%);
    height: auto;
    /*opacity: 0.2;*/
    z-index: 200;
}
.logcloud_left img {
    position: absolute;
    display: none;
    top: 60px;
    left: -100px;
    transform: translate(-50%, -50%);
    height: auto;
    /*opacity: 0.2;*/
    z-index: 200;
}

/*************************************************************max-width:320px***********************************************************/
@media(max-width:320px) {
    .broad_box {
        width:98.0%;
    }

    .card-item {
        width:98%;
    }

    .card-item-mc {
        width:98%;
    }

    .card-item2 {
        width:98%;
    }

    .card-item3 {
        width:98%;
    }

    .invoice_music_refresh {
        display: none;
    }
}


/*************************************************************max-height:880px***********************************************************/
@media (max-height: 880px) {
    .listen_bottom {
        bottom: 70px;
    }
}
/*************************************************************max-height:780px***********************************************************/
@media (max-height: 780px) {
    .listen_tit .subj2 {
        display: none;
    }
    .listen_hash {
        display: none;
    }
    div.jcarousel ul#songs li.song p.song-title {
        font-size: 13px;
    }
    div.jcarousel ul#songs li.song p.song-artist {
        font-size: 11px;
    }
    div#controls {
        margin: -24px auto -5px;
    }
    .instation_party_good {
        width: 120px;
        height: 120px;
    }
    .party_albumimg {
        width: 120px;
        height: 120px;
    }
    .instation_party_thumbs_up {
        margin-right: 10px;
    }
    .instation_party_thumbs_dn {
        margin-left: 10px;
    }
    .party_radar_canvas {
        top: 30px;
        z-index:5;
        opacity:0.9;
        position: relative;
        left: calc(50% - 110px);
        width: 220px;
        height: 220px;
    }
}