@font-face {
    font-family: "GillSans-SemiBold";
    src: url("fonts/GillSans-SemiBold.ttf");
    src: url("fonts/GillSans-SemiBold.ttf") format("ttf");
}
@font-face {
    font-family: hirakakupro-w6;
    src: url(fonts/hirakakupro-w6.otf);
    src: url(fonts/hirakakupro-w6.otf) format("otf");
}

@font-face {
    font-family: hirakakupro-w3;
    src: url(fonts/hirakakupro-w3.otf);
    src: url(fonts/hirakakupro-w3.otf) format("otf");
}

body {
    /* font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif; */
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    color: white;
}

.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

a,
a:hover{
    color: #fff;
    text-decoration: none;
}


/*.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto,
.col-lg,
.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-auto,
.col-md,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-auto,
.col-sm,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-auto,
.col-xl,
.col-xl-1,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-auto {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px
}

.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%
}

.col-auto {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none
}

.col-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%
}

.col-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%
}

.col-3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%
}

.col-4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%
}

.col-5 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%
}

.col-6 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%
}

.col-7 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%
}

.col-8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%
}

.col-9 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%
}

.col-10 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%
}

.col-11 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%
}

.col-12 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%
}*/
#nav-top a:hover {
    color: #58d4f5;
}
#nav-comedian a:hover {
    color: #edce00;
}
.modal-download-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
    width: 100vw;
}
.modal-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
    padding: 0 20px;
    position: relative;
}
/* .container-body {
    padding-top: 70px;
} */

.comedian-tab-navigation {
    width: 100%;
}
.tab-navigation {
    padding: 20px;
}
.tab-navigation-button {
    color: #aaa;
    word-break: keep-all;
}
.comedian-tab-navigation a .tab-navigation-button.active,
.comedian-tab-navigation a .tab-navigation-button:hover {
    color: #edce00;
    border-bottom:3px #edce00 solid;
}

section.app-main-visual {
    background-image: none;
    padding: 95px 0;
}

/*.navbar-default {
    border-bottom: 6px solid rgb(70,70,70);
}*/

.container-body {
    //top: 66px;
    padding-bottom: 66px;
    padding-top: 66px;
}
    
.div-container {
  /*//width: 480px;*/
  /*//height: 600px;*/
  /*overflow-x: scroll;*/
  /*overflow-y: hidden;*/
}

.inner {
  height: 100%;
  white-space:nowrap; 
}

.inner-vd {
  height: 100%;
  //white-space:nowrap; 
}

.floatLeft, .floatLeft-vd {
  //width: 200px;
  //height: 400px; 
  height: 200px; 
  margin:10px 10px 50px 10px; 
  display: inline-block;
}

/*img {
  height: 100%;
}*/

/*.image-popular, .image-popular-vd {
    padding-top: 15px;
    //position: relative;
}*/

.image-popular-vd {
    opacity: 0.85;
}

.image-popular-vd:hover {
    opacity: 1;
}

.div-img {
    position: relative;
}

.showcase #content-6.horizontal-images.content ul {
    margin-left: 10px;
    margin-right: 10px;
}
.horizontal-images.content ul, .vertical-images.content ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}
.horizontal-images.content li:first-child {
    margin-left: 0;
}
.horizontal-images.content li {
    margin: 0 3px;
    float: left;
}
#content-6.horizontal-images.content h2, .showcase #content-6.horizontal-images.content li img {
    height: 105px;
}
#content-6.horizontal-images.content h2 {
    color: #222;
    background-color: #c2beb2;
}
.horizontal-images.content h2 {
    color: #fff;
    background-color: #eb3755;
    padding: 10px 20px;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 165%;
}
.horizontal-images.content {
    height: 140px;
    width: 700px;
    max-width: 97%;
    padding: 5px 5px 0 5px;
}

#div-performers .div-container {
    height: 580px;
}

#div-performers .title-section {
    text-align:left; 
    font-size:22px; 
    padding-top: 20px;
}

#div-dvd-popular {
    border: none;
}

#div-dvd-popular .div-container {
    height: 300px;
}

#div-dvd-popular .title-section {
    text-align:left; 
    font-size:22px; 
}

.div-list-dvd,.div-list-dvd-scroll {
    border: none;
}

.div-list-dvd .div-container,.div-list-dvd-scroll  .div-container {
    height: 300px;
}

.div-list-dvd,.div-list-dvd-scroll .title-section {
    text-align:left; 
    font-size:22px; 
}

.div-list-dvd .floatLeft {
    height: 300px;
    display: flex!important;
    justify-content: flex-start;
    align-items: center;
    height: 300px;
}

#div-dvd-recommend {
    border: none; 
    //padding-top: 20px;
}

#div-dvd-recommend .title-section {
    text-align:left; 
    font-size:22px; 
}

#div-dvd-recommend .div-container {
    height: 300px;
}

#div-video-new {
    border: none; 
    padding-top: 60px;
    padding-bottom: 40px;
}

#div-video-new-child {
    background: rgba(88,212,245,0.18);
}

#div-video-new .title-section {
    text-align:left; 
    font-size:22px; 
}

#div-video-new .div-container {
    height: 250px; 
}

.div-video-same {
    border: none; 
    padding-top: 20px;
}

.div-video-same .div-container {
    height: 250px;
}

.div-video-same .title-section {
    text-align:left; 
    font-size:22px; 
}

#div-material {
    border: none; 
    padding-top: 20px;
}

#div-material .div-container {
    height: 250px;
}

#div-material .title-section {
    text-align:left; 
    font-size:22px; 
}

.list-inline > li {
    display: inline-block;
    padding-right: 30px;
    padding-left: 30px;
}

.footer-img {
    max-height: 32px;
}

.active-video a {
     color: rgb(88,212,245);
}

.footer-deactive a div {
    color: rgb(153,153,153)!important;
}

.active-live a {
     color: rgb(51,221,167);
}

.active-timeline a {
    color: rgb(255,205,10);
}

.active-user a {
    color: #943030;
}

.img-recommend-item {
    box-shadow: 11px 1px 5px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    border-radius: 8px;
}

/*.img-recommend-item:hover {
    opacity: 1;
    cursor: pointer;
}*/

.img-popular-news {
    box-shadow: 11px 1px 8px 3px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    border-radius: 8px;
}

.img-material {
    box-shadow: 11px 1px 8px 3px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    border-radius: 8px;
}

.footer {
    margin-top: 30px;
    border-top: 1px solid #232323;
    background-color: #000;
}

.div-title {
    padding-left: 10px;
    padding-right: 20px;
}

.tilte-left {
    display: inline-block;
    //width: 200px;
    font-size: 24px;
    color: #fff;
    padding-top: 20px;
}

.title-right {
    display: inline-block;
    float: right;
    font-size: 18px;
    color: #999;
    padding-top: 22px;
    cursor: pointer;
    text-align: right;
}
.title-right a {color: #999}
.footer .list-inline {
    margin: 0px auto;
    //padding: 6px;
}

.div-text {
    font-size: 18px;
    color: rgb(153,153,153);
    text-align: left;
    padding: 10px 0px 0px 0px;
    width: 180px;
    //padding: 5px;
}

.div-text-special {
    color: rgb(88,212,245);
    font-size: 20px;
    //text-align: center;
}

.div-button-new {
    position: absolute;
    top: 23px;
    left: 8px;
}

.div-button-new button {
    background: rgba(255,255,255,0.8);
    border-radius: 10px;
    color: #000;
    border: 0px;
    font-size: 14px;
    font-weight: bold;
    font-family: GillSans-Bold;
}

.div-button-free {
    position: absolute;
    top: 86%;
    left: 8px;
}

.div-button-free button {
    background: rgb(241,17,64);
    border-radius: 2px;
    color: #fff;
    border: 0px;
    font-size: 14px;
    font-weight: bold;
    font-family: HiraKakuProN-W6;
    height: 29px;
}

.div-video-new-button-free {
    position: absolute;
    top: 51%;
    left: 8px;
}

.div-video-new-button-free button {
    background: rgb(241,17,64);
    border-radius: 2px;
    color: #fff;
    border: 0px;
    font-size: 14px;
    font-weight: bold;
    font-family: HiraKakuProN-W6;
    height: 29px;
}

.div-popular-button-free {
    position: absolute;
    top: 51%;
    left: 8px;
}

.div-popular-button-free button {
    background: rgb(241,17,64);
    border-radius: 2px;
    color: #fff;
    border: 0px;
    font-size: 14px;
    font-weight: bold;
    font-family: HiraKakuProN-W6;
    height: 29px;
}

.div-material-button-free {
    position: absolute;
    top: 51%;
    left: 8px;
}

.div-material-button-free button {
    background: rgb(241,17,64);
    border-radius: 2px;
    color: #fff;
    border: 0px;
    font-size: 14px;
    font-weight: bold;
    font-family: HiraKakuProN-W6;
    height: 29px;
}

@media screen and (max-width: 768px) {
    .div-button-new {
        position: absolute;
        top: 20px;
        left: 5px;
    }
    .div-button-new button {
        border-radius: 10px;
        border: 0px;
        font-size: 8px;
        height: 16px;
        width: 37px;
        line-height: 7px;
        font-family: GillSans-Bold;
    }
    .div-video-new-button-free {
        position: absolute;
        top: 48%;
        left: 5px;
    }
    .div-video-new-button-free button {
        border-radius: 2px;
        border: 0px;
        font-size: 8px;
        font-weight: bold;
        font-family: HiraKakuProN-W6;
        height: 19px;
        width: 30px;
        line-height: 8px;
    }
    .div-button-free {
        position: absolute;
        top: 84%;
        left: 5px;
    }
    .div-button-free button {
        border-radius: 2px;
        border: 0px;
        font-size: 8px;
        font-weight: bold;
        font-family: HiraKakuProN-W6;
        height: 19px;
        width: 30px;
        line-height: 8px;
    }
    .div-popular-button-free {
        position: absolute;
        top: 47%;
        left: 5px;
    }
    .div-popular-button-free button {
        border-radius: 2px;
        border: 0px;
        font-size: 8px;
        font-weight: bold;
        font-family: HiraKakuProN-W6;
        height: 19px;
        width: 30px;
        line-height: 8px;
    }
    .div-material-button-free {
        position: absolute;
        top: 51%;
        left: 5px;
    }
    .div-material-button-free button {
        border-radius: 2px;
        border: 0px;
        font-size: 8px;
        font-weight: bold;
        font-family: HiraKakuProN-W6;
        height: 19px;
        width: 30px;
        line-height: 8px;
    }
}

.img-dvd-awatar {
    max-height: 576px;
    width: auto;
}

.title-right img {
    vertical-align: middle;
    padding: 2px 0px 5px 12px;
}

.div-image-header {
    max-height: 40px;
}

.div-parent {
    width:100%;
    text-align:center;
}

.div-left {
    float:left;
    width:100px;
    height: 40px;
    //background: #ff0000;
}

.div-center {
    display: inline-block;
    margin:0 auto;
    //width:400px;
    height: 40px;
    //background: #00ff00;
}

.div-right {
    float:right;
    width:150px;
    height: 40px;
    //background: #0000ff;
}

#div-favorite {
    display: inline-block;
    padding-right: 40px;
    cursor: pointer;
}

#div-share {
    display: inline-block;
}

#div-title-header {
    font-size: 24px;
    font-weight: bold;
}

.float-left {
    float: left;
}

#dvd-detail-header .tab-navigation{
    //padding: 12px;
    padding: 6px;
}  

#div-dvd-awatar {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
}

#div-dvd-awatar img {
    max-height: 100px;
}

#div-name {
    font-family: HiraKakuProN-W3;
    font-size: 24px;
}

#div-name {
    line-height: 90px;
}

#div-dvd-awatar {
    padding: 20px 0px 20px 0px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

#div-dvd-profile {
    padding-top: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 70%;
}

#div-dvd-awatar #div-img {
    padding-right: 5px;
}

#div-appearance {
    color: rgb(153,153,153);
    font-size: 20px;
    padding: 20px 0px 20px 0px;
    font-family: HiraKakuProN-W6;
}

.div-tag {
    font-size: 16px;
    font-family: HiraKakuProN-W3;
    border: 1px solid rgba(237,255,255,0.5);
    background: none;
    border-radius: 3px;
    display: inline-table;
    padding: 6px;
    margin: 3px 0px 3px 0px;
}

#div-dvd-content {
    font-family: HiraKakuProN-W3;
    color: rgb(153,153,153);
    font-size: 22px;
    padding: 20px 0px 20px 0px;
    float: left;
    width: 90%;
}

#div-img-up, #div-img-down {
    padding-top: 15px;
    width: 10%;
    text-align: right;
}

#div-img-up img , #div-img-down img{
    max-height: 9px;
}

.div-line {
    border-bottom: 1px solid rgb(51,51,51);
}

.div-flex {
    display: flex;
}

#dvd-list {
    padding: 20px 0px 20px 0px;
}

.float-right {
    float: right;
}

.dvd-item {
    padding: 20px 0px 20px 0px;
    //display: flex;
    //justify-content: flex-start;
    //align-items: center;
    position: relative;
    opacity: 0.85;
}

.dvd-item:hover {
    opacity: 1;
}

.div-item-img .item-img {
    height: 165px;
    width: 245px;
     box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    border-radius: 8px;
    //opacity: 0.8;
}

/*.div-item-img .item-img:hover {
    opacity: 1;
    cursor: pointer;
}*/

.div-item-img .dvd-img {
    height: 150px;
    width: 250px;
}

.div-item-text {
    font-size: 20px;
    font-family: HiraKakuProN-W6;
    color: rgb(88,212,245);
    //margin-left: 10px;
    text-align: left;
    //padding: 0 5px 0 5px;
}

.div-dvd-free {
    position: absolute;
/*    top: 62%;
    left: 1.5%;*/
    background-color: rgb(241,17,64);
    height: 32px;
    width: 50px;
    text-align: center;
    vertical-align: middle;
    line-height: 32px;
    border-radius: 3px;
    left: 10px;
    bottom: 30px;
}

.div-dvd-time {
    position: absolute;
    bottom: 8px;
    right: 8px;
    border-radius: 3px;
    background-color: rgba(0,0,0,0.4);
    text-align: center;
    vertical-align: middle;
    font-family: HiraKakuProN-W3;
    padding: 3px 6px 3px 6px;
}

/* ============== PREMIUM USER INFO ============== */
.caption-slider {
    text-align: center;
    position: relative;
    margin-top: 20%;
}

.caption-slider .caption-slider--yellow{
    color: yellow;
    font-size: 2em;
    font-weight: bold;
}
.caption-slider .caption-slider--white{
    color: white;
    font-size: 1.5em;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.premium-controls .jumbotron{
    background: transparent;
    text-align: center;
}

.premium-controls .btn{
    padding: 0.5em 5em;
}

.premium-controls .line1,
.premium-about .line1 {
    font-size: 1.15em;
}
.premium-controls .line2,
.premium-about .line2 {
    font-size: 0.85em;
}
.premium-controls .link-button a{
    text-decoration: underline;
    color: #fff;
}

.premium-about{
    background: rgb(255,255,255,0.5);
    padding: 3em 1em 2em 1em;
    text-align: center;
}
.modal-premium-member{
    opacity: 1;
    color: #222222;
    margin: auto;
    font-size: 1.15em;
}
.modal-premium-member .modal-header a{
    color: #ffffff;
    text-decoration: underline;
}
.modal-premium-member .modal-body a{
    color: #222222;
}
.modal-premium-member .modal-body .premium-tabs a{
    border: 1px solid #222222;
    border-radius: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #ffffff;
}
.modal-premium-member .modal-body .premium-tabs{
    width: 100%;
}
.modal-premium-member .modal-body .premium-tabs a:first-child{
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    width: 50%;
}
.modal-premium-member .modal-body .premium-tabs a:last-child{
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    width: 50%;
}
.modal-premium-member .modal-body  .premium-tabs>a:hover,
.modal-premium-member .modal-body  .premium-tabs>a:focus,
.modal-premium-member .modal-body  .premium-tabs>a.active {
    text-decoration: none;
    background-color: #222222;
    color: #ffffff;
}

.modal-premium-member .modal-body .tab-content .tab-title p,
.modal-premium-member .modal-body .tab-content form,
.modal-premium-member .modal-body .tab-content .tab-body{
    margin-top: 1.5em;
}
.modal-premium-member .modal-body .tab-content .tab-body .list-group{
    align-items: center;
    justify-content: center;
    padding: 1em;
}
.modal-premium-member .modal-body .tab-content .tab-body .list-group-item{
    margin-top: 10px;
    text-align: center;
    padding: 1% 30% 1% 30%;
}
.modal-premium-member .modal-body .tab-content .tab-body .list-group-item:hover{
    opacity: 0.8;
}
.modal-premium-member .modal-body .tab-content .tab-body .list-group-item img{
    margin: auto;
}

.modal-premium-member .modal-body .tab-content input,
.modal-premium-member .modal-body .tab-content select{
    height: 50px;
    font-size: 1.25em;
}
.card-list,
.group-expire-date{
    display: flex;
}
.card-list .card-item{
    width: 55px;
    margin-right: 5px;
}
.card-list .card-item img{
    max-width: 100%;
}

.expire-date--label,
.expire-date--picker{
    margin-right: 1em;
}
.expire-date--picker{
    width: 20%;
    min-width: 100px;
}
.form-group--submit{
    text-align: center;
}
.btn-premium{
    padding: 0.5em 2em;
    font-size: 1.25em;
    color: #fff;
    background-color: #333;
    border-radius: 0;
}
.btn-white{
    background: rgb(255,255,255,0.5);
    color: #fff;
    border: 1px solid #fff;
    border-bottom-width: 3px;
}
.modal-premium-member .modal-body .tab-content .control-label{
    color: #ccc;
    margin-top: 12px;
}
.modal-premium-member .modal-dialog{
    margin: 0 auto;
}
.modal-premium-member .modal-header{
    padding: 30px;
    text-align: center;
    background: #222222;
    color: #ffffff;
    /* margin-top: 10px; */
    display: block;
}

/* ============== END PREMIUM USER INFO ============== */

/* ============== SETTING BOX ============== */
.setting-box,
.setting-box a,
.setting-box span{
    color: #fff;
}
.setting-box .setting-box__header,
.setting-box .setting-box__body{
    border: 1px solid #dddfe2;
    border-radius: 3px;
    box-sizing: border-box;
    border-color: transparent;
    border-left-width: 0;
    border-right-width: 0;
    padding: 20px;
    color: #1d2129;
}

.setting-box .setting-box__body{
    margin-top: 10px;
}

.setting-box .setting-box__body .large-text{
    font-size: 1.25em;
    color: rgb(153, 153, 153)
}

.setting-box .setting-box__header p{
    font-weight: 700;
    font-size: 1.25em;
    margin-bottom: 0;
}
.setting-box .list-setting{
    width: 100%;
}
.setting-box .list-setting li{
    padding-left: 0;
    background-color: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 2px 5px;
}
.setting-box .list-setting li a {
    display: block;
    width: 100%;
    padding: 10px 15px;
}
.setting-box .list-setting{
    padding: 20px;
}
.setting-box .list-setting li:hover{
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    margin-bottom: -1px;
    margin-left: -11px;
    padding-left: 10px;
    text-decoration: none;
}

/* ============== END SETTING INFO ============== */

/* ============== PROFILE BOX ============== */
.rb--common{
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    border: 0 solid #000;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    position: relative;
    height: 100%;
}
.register-box {
    min-height: 100%;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.register-box .register-box__body{
    margin: 0 auto;
    max-width: 935px;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.register-box .register-box__body .register-box__body__content {
    color: #262626;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 12px;
    max-width:  400px;
    width: 100%;
    padding: 30px 20px 40px;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.7);

}
.ui-message-container {
    background: #e87c03;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin: 0 0 16px;
}
.ui-message-container .ui-message-cotents{
    padding: 10px 20px;
    display: table-cell;
    vertical-align: middle;
    padding: 20px 10px;
    color: #fff;
}
.register-box .register-box__body .app-logo{
    text-align: center;
    margin: 22px auto 12px;
    color: #fff;
    font-size: 1.25em;
}

.register-box .register-box__body .app-logo i{
    font-size: 5rem;
}

.register-box .inp{
    border-radius: 0;
}
.register-box .btn-white{
    width: 100%;
}

.inp[readonly],
.inp {
    background: transparent;
    color: #fff;
    font-size: 1.25em;
    border-width: 1px;
}
.setting-box,
.profile-box{
    width: 100%;
    padding-right: 0;
    padding-left: 0;
}
.setting-box{
    max-width: 450px;
    margin: 5px auto;
}
.cover-img{
    width: 100%;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
/*.cover-img img{
    width: 100%;
}*/
.cover-img .setting-img{
    position: absolute;
    right: 20px;
    top: 20px;
}
.cover-img .setting-img:hover{
    opacity : 0.9;
    -webkit-animation-name: spin;
    -webkit-animation-duration: 4000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 4000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 4000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    animation-name: spin;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
/* SPIN ANIMATION*/
@-ms-keyframes spin {
    from { -ms-transform: rotate(0deg); }
    to { -ms-transform: rotate(360deg); }
}
@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
/* END SPIN ANIMATION*/
.user-info .user-info__icons{
    position: relative;
}
.user-info .user-info__icons .icon-upload{
    position: absolute;
    left: 52%;
    bottom: 0;
}
.btn-upload{
    background: #fff;
    background-image: url("../images/object_camera@2x.png");
    background-size: cover;
    background-position: center;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 1px solid #fff;
    
}

.avatar-img {
     position: relative;
}

.profile-box .user-info {
    text-align: center;
    z-index: 2;
    position: relative;
}
.profile-box .user-info .user-name{
    margin-top: 5px;
}
.profile-box .user-info .artist-name{
    font-size: 1.5em;
    color: yellow;
}
.profile-box .user-info img,
.profile-box .fans-list .body-list .image img{
    border-radius: 50%;
}
.profile-box .user-edit,
.profile-box .user-register{
    display: flex;
    flex-direction: column;
    align-items: center;
    //padding: 10px;
    padding: 0px;
}

.profile-box .user-register .btn-white{
    width: 300px;
    margin-top: 10px;
}
.profile-box .user-register .btn-white:hover{
    color: #fff;
}
.user-edit-wrapper{
    display: flex;
    justify-content: center;
}
.profile-box .user-edit{
    width: 100%;
    max-width: 500px;
}
.profile-box .user-edit p.title{
    font-size: 1.25em;
    padding-left: 15px;
    padding-right: 15px;
}
.profile-box .user-edit .comedian-fans-list{
    font-size: 1.25em;
    margin-bottom: 10px;
}
.profile-box .user-edit .comedian-fans-list label{ /*input[type="radio"] {*/
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.profile-box .user-edit .comedian-fans-list label input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.profile-box .user-edit .comedian-fans-list .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: transparent;
    border: 2px solid rgb(251, 80, 52);
    border-radius: 50%;
}
  
.profile-box .user-edit .comedian-fans-list label:hover input ~ .checkmark {
    opacity: 0.8;
}
/* .profile-box .user-edit .comedian-fans-list label input:checked ~ .checkmark {
    background-color: rgb(251, 80, 52);
} */
.profile-box .user-edit .comedian-fans-list .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.profile-box .user-edit .comedian-fans-list label input:checked ~ .checkmark:after {
    display: block;
}
.profile-box .user-edit .comedian-fans-list label .checkmark:after {
    top: 4px;
    left: 4px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: rgb(251, 80, 52);
}
  
.profile-box .user-edit button,
.profile-box .user-edit .inp{
    width: 100%;
    min-width: 300px;
    max-width: 350px;
}

.profile-box .user-edit .inp-user-name{
    height: 50px;
    text-align: center;
    margin-bottom: 30px;
    padding: 30px;
}

.profile-box .user-edit .inp-user-des{
    resize: none;
    height: 200px;
    padding: 20px;
    margin-bottom: 25px;
}
.profile-box .user-edit button{
    height: 55px;
}
.profile-box .fans-list,
.profile-box .bookmark-live-list,
.profile-box .history-live-list,
.profile-box .favorite-dvd-list,
.profile-box .favorite-video-list,
.profile-box .fun-video-list{
    margin-top: 15px;
    padding: 5px;
}
.profile-box .title-list{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.profile-box .fans-list .title-list .left{
    color: #eeff41;
}
.profile-box .bookmark-live-list .title-list .left{
    color: #1de9b6;
}
.profile-box .history-live-list .title-list .left,
.profile-box .favorite-dvd-list .title-list .left,
.profile-box .favorite-video-list .title-list .left,
.profile-box .fun-video-list .title-list .left{
    color: #40c4ff;
}
.profile-box .movie-list .title-list .left{
    color: #EDCE00;
}
.profile-box .favorite-dvd-list .div-list-dvd{
    padding-top: 0px;
}
.profile-box .title-list .left{
    width: 70%;
    font-size: 1.2em;
    font-weight: bold;
}
.profile-box .title-list .right{
    text-align: right;
    width: 30%;
    color: rgb(255, 255, 255, 0.5);
}
.profile-box .title-list .right a{
    color: rgb(255, 255, 255, 0.5);
}
.profile-box .fans-list .body-list{
    //margin-left: 15px;
    //margin-right: 15px;
    margin-top: 10px;
}
/*.profile-box .fans-list .body-list{
    display: flex;
    align-items: center;
    justify-content: space-around;
}*/
.profile-box .fans-list .body-list .image{
    display: flex;
    align-items: center;
    flex-direction: column;
}

.profile-box .bookmark-live-list .body-list .list-group li .live-content__date,
.profile-box .body-list .text{
    color: rgb(255, 255, 255, 0.5);
    font-family: "hirakakupro-w3";
}
.profile-box .body-list .text{
    text-align: center;
    //font-size: 1.5em;
    font-size: 1.2em;
}
.video-item{
    //display: flex;
    margin-top: 25px;
}

.video-item .item-image{
    position: relative;
    width: 225px;
    height: 125px;
    overflow: hidden;
    box-shadow: 11px 1px 5px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    border-radius: 13px;
    
}
.video-item .item-image.item-image--yellow{
    box-shadow: 11px 1px 8px 3px rgba(255,205,10,0.6);
    -webkit-box-shadow: 1px 1px 8px 3px rgba(255,205,10,0.6);
    -moz-box-shadow: 1px 1px 8px 3px rgba(255,205,10,0.6);
}
.video-item .item-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.text-top-left{
    position: absolute;
    top: 10px;
    left: 12px;
    background: rgb(255, 255, 255, 0.5);
    color: #222222;
    font-weight: bold;
    border-radius: 15px;
    padding: 3px 10px;
    width: auto;
    text-align: center;
    font-size: 0.75em;
}
.image-top-left{
    position: absolute;
    top: 10px;
    left: 12px;
    width: 70px;
}
.text-bottom-left{
    position: absolute;
    bottom: 10px;
    left: 12px;
    background: rgb(241,17,64);
    font-weight: bold;
    border-radius: 3px;
    padding: 3px 8px;
    width: auto;
    text-align: center;
}
.text-top-right{
    position: absolute;
    top: 10px;
    right: 0px;
    width: 70px;
    text-align: center;
    border: 3px solid rgb(88, 212, 245);
    color: rgb(88, 212, 245);
    font-weight: bold;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    //padding: 5px;
    font-size: 0.9rem;
}
.text-bottom-right{
    position: absolute;
    bottom: 10px;
    right: 10px;
    background-color: rgba(0,0,0,0.4);
    font-family: HiraKakuProN-W3;
    font-weight: bold;
    padding: 2px 10px;
    text-align: center;
    border-radius: 2px;
}
.video-item .item-text{
    margin: 10px 20px;
    width: calc( 100% - 225px);
}
.video-item .item-text p {
    margin-top: 0;
    margin-bottom: 0;
}
.video-item .item-text p.item-text__category{
    color: rgb(153, 153, 153);
    font-size: 1em;
}
.video-item .item-text p.item-text__title{
    color: rgb(88, 212, 245);
    font-size: 1.5em;
}
.profile-box .bookmark-live-list .body-list .list-group li{
    background: transparent;
    padding-left: 0px;
    padding-right: 0px;
    font-size: 1em;
}

.divider{
    height: 1px;
    margin-top: 10px;
    margin-bottom:  10px;
    background: #232323;
}
/* ============== END PROFILE BOX ============== */

/******************** LIVE INFORMATION *********************/
.live .title-header {
    padding: 20pt 0;
    align-items: center;
    border-bottom: 1px solid #ddd;
    position: relative;
}
.live .title-header .left-button {
    background: url('../images/btn_frame_w@3x.png') no-repeat;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: 100% 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
    padding: 0;
}
.live .title-header .left-button img {
    visibility: hidden;
    width: 100%;
}
.live .title-header .left-button a {
    position: absolute;
    font-size: 18pt;
}

.live .title-header .col-title {
    text-align: center;
    font-size: 24pt;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 40%;
    transform: translate(-50%,-50%);
}
.live .calendar {
    padding: 32pt 0;
}
.live .calendar .col-decimal-7 {
    font-family: GillSans-SemiBold;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(100% / 7);
    flex: 0 0 calc(100% / 7);
    max-width: calc(100% / 7);
    align-items: center;
    justify-content: center;
    display: flex;
    padding: 10pt 0;
}
.live .calendar .col-decimal-7 {
    padding: 5pt 0;
    position: relative;
    font-size: 26pt;
}
.live .calendar .col-decimal-7.date-off {
    color: rgb(51, 51, 51);
}
.live .calendar .col-decimal-7.date-off .item-date {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../images/calendar_off@3x.png) no-repeat;
    color: rgb(51, 51, 51);
    background-size: 100% auto;
    background-position: center center;
}
.live .calendar .col-decimal-7.date-on {
    color: rgb(255, 255, 255);
}
.live .calendar .col-decimal-7.date-on .item-date {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../images/calendar_on@3x.png) no-repeat;
    color: rgb(255, 255, 255);
    background-size: 100% auto;
    background-position: center center;
}
.live .calendar .col-decimal-7.date-today {
    color: rgb(51, 221, 167);
}
.live .calendar .col-decimal-7.date-today .item-date {
    display: flex;
    justify-content: center;
    align-items: center;
    background: url('../images/calendar_today@3x.png') no-repeat;
    color: rgb(51, 221, 167);
    background-size: 100% auto;
    background-position: center center;
}
.live .calendar .col-decimal-7 .text {
    position: absolute;
}
.live .calendar .col-decimal-7 img {
    visibility: hidden;
    //max-width: 100%;
    width: 100%;
    //max-height: 90px;
}
.schedule .date {
    text-align: center;
    font-size: 44pt;
    display: flex;
    justify-content: center;
    align-items: baseline;
    color: rgb(51, 221, 167);
}
.schedule .date .below {
    font-size: 24pt;
}
.schedule .item {
    //padding: 40pt 20pt;
    padding: 5px;
}
.schedule .row-info .image {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 26%;
    flex: 0 0 26%;
    max-width: 26%;
    padding-right: 0;
}
.schedule .row-info .image img {
    width: 100%;
    height: auto;
}
.schedule .row-info .content .title {
    font-size: 24pt;
    padding-bottom: 17pt;
    border-bottom: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.schedule .row-info .content .tag .title {
    padding: 4pt 0;
    border-bottom: 0;
    color: rgb(153, 153, 153);
}
.schedule .row-info .content .title .text{
    -webkit-box-flex: 0;
    -ms-flex: 0 0 92%;
    flex: 0 0 92%;
    max-width: 92%;
}
.schedule .row-info .content .time {
    padding-top: 18pt;
    color: rgb(153, 153, 153);
    font-size: 20pt;
}
.schedule .row-info .content .time .detail {
    padding-bottom: 12pt;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.schedule .row-info .content .time .detail:last-child {
    padding-bottom: 0;
}
.schedule .row-info .content .time img
{
    padding-right: 8pt;
}
.schedule .row-info .content .list-tag .col-tag {
    font-size: 18pt;
    padding: 4pt;
}
.schedule .row-info .content .list-tag .col-tag .rectangle {
    padding: 14pt 16pt;
    white-space: nowrap;
    border: 1px solid #fff;
    border-radius: 3pt;
}
.schedule .row-info .image .frame {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 16pt;
}
.schedule .row-info .image .frame  .text-btn {
    position: absolute;
    font-size: 20pt;
    color: rgb(51, 221, 167);
}
.calendar .current {
    color: rgb(51, 221, 167);
    display: flex;
    justify-content: center;
    align-items: baseline;
    position: relative;
}
.calendar .current .month {
    font-size: 54pt;
}
.calendar .current .year {
    font-size: 24pt;
}
.calendar .current .next {
    position: absolute;
    right: 2%;
    bottom: 10%;
}
.calendar .current .prev {
    position: absolute;
    left: 2%;
    bottom: 15%;
}

/******************** LIVE INFORMATION *********************/


#list-comment {
    padding: 5px 0px 0px 0px;
    font-family: HiraKakuProN-W3;
}

#list-comment img{
/*    max-height: 100px;
    max-width: 100px;*/
    height: 60px;
    width: 60px;
}

.item-comment {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 22px;
    padding: 5px 0px 5px 0px;
    margin: 0;
}

.padding-10 {
    padding: 10px;
}

.div-comment {
    background-color: #fff;
    color: rgb(0,0,0);
    border-radius: 10px;
    padding: 5px;
    display: inline-block;
    word-break: break-all;
}

#div-video-awatar {
    //padding: 20px 0px 20px 0px;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

#div-video-profile {
    padding-top: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

#div-video-awatar #div-img {
    padding-right: 20px;
}

.div-video-img img{
    max-height: 100px;
}

.vide-time {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: rgb(153,153,153);
    font-size: 12px;
    /*position: absolute;*/
    /*top: 70%;*/
    /*left: 104%;*/
    /*color: red;*/
}
.vide-time div{
    margin-top: auto;
    padding-left: 13pt;
}

.color-user-video {
    color:  rgb(62,143,164);
}

/*.parent-comment {*/
    /*width: -moz-calc(100% - 130px);*/
    /*width: -webkit-calc(100% - 130px);*/
    /*width: -o-calc(100% - 130px);*/
    /*width: calc(100% - 130px);*/
    /*display: flex;*/
    /*justify-content: flex-start;*/
/*}*/

/*.list-comment .parent-comment {*/
    /*display: flex;*/
    /*justify-content: flex-start;*/
/*}*/

.parent-comment {
    display: flex;
    justify-content: flex-start;
    font-size: 14px;
}

.col-left {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
}

.item-comment .col-left img {
    width: 100%;
}

.div-fixed {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 1030;
    height: 60px;
}

.width-100 {
    width: 100%;
}

#div-parent-receive {
    position: fixed;
    right: 0;
    bottom: 115px;
    border-top-left-radius: 53px;
    border-bottom-left-radius: 53px;
    padding: 10px 0px 10px 10px;
    z-index: 2;
    background-color: #000;
}

@media screen and (max-width: 768px) {
    #div-parent-receive {
        bottom: 88px;
    }
}

#div-receive {
    border-left: 3px solid rgb(237,206,0);
    border-top: 3px solid rgb(237,206,0);
    border-bottom: 3px solid rgb(237,206,0);
    border-top-left-radius: 53px;
    border-bottom-left-radius: 53px;
    padding: 0px 10px 0px 10px;
}

#div-receive img {
    max-height: 52px;
}

#receive-text {
    padding: 0px 10px 0px 20px;
    font-family: HiraKakuProN-W6;
    color: rgb(237,206,0);
    font-size: 13px;
}

#txt_comment {
    font-family: HiraKakuProN-W3;
}

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

.width70 {
    width: 70%;
}

.width30 {
    width: 30%;
}

.width50 {
    width: 50%;
}

#div-parent-fan {
    text-align: right;
    cursor: pointer;
    width: 33%;
}

#div-parent-fan:hover {
    color: #ccc;
}

#div-fan {
    border: 1px solid;
    display: inline-table;
    padding: 5px 8px 5px 8px;
    border-radius: 25px;
    min-width: 120px;
    text-align: center;
}

.div-relative {
    position: relative;
}

.div-episode-free {
    position: absolute;
    top: 88%;
    left: 2%;
    background-color: rgb(241,17,64);
    border-radius: 3px;
    padding: 3px;
}

.size-14 {
    font-size: 14px;
}

.size-18 {
    font-size: 18px;
}

.div-episode-free p:first-child {
    font-size: 14px;
}

.div-episode-free p:nth-child(2) {
    font-size: 18px;
}

#dvd-detail-header .comedian-tab-navigation{
    width: 100%;
}

#dvd-detail-header .tab-navigation {
    width: 100%;
}

/*@media (min-width: 576px) {
    .container {
        max-width: none;
    }
}*/

.div-list-dvd .image-popular .img-recommendation, .div-list-dvd-scroll .image-popular img {
    max-height: 255px;
    max-width: 180px;
}

.img-recommendation {
    opacity: 0.8;
}

.img-recommendation:hover {
    opacity: 1;
}

#div-dvd-popular .image-popular img {
    max-height: 255px;
}

#div-dvd-recommend .image-popular img {
    max-height: 255px;
}

.div-image-icon-new {
    position: absolute;
    top: 8px;
    left: 8px;
}

.div-image-icon-new img {
    height: 23px;
}

.div-icon-free {
    position: absolute;
    left: 8px;
    bottom: 8px;
/*    top: 86%;
    left: 8px;*/
}

.div-icon-free img {
    height: 30px;
    width: auto!important;
}

/*#div-video-new .div-icon-free {
    top: unset;
    bottom: 74px;
}*/

.img-recommend-item {
    //height: 130px;
    height: 110px;
}

.div-video-same {
    border: none; 
    padding-top: 0px;
}

.div-video-same .div-container {
    height: 250px;
}

.div-video-same .title-section {
    text-align:left; 
    font-size:22px; 
}

.img-video-same {
    box-shadow: 11px 1px 5px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    border-radius: 8px;
    opacity: 0.8;
}

.img-video-same {
    //max-height: 130px;
    height: 110px;
}
.img-video-same:hover {
    opacity: 1;
    cursor: pointer;
}

.div-icon-same-free {
    position: absolute;
    left: 8px;
    bottom: 8px;
}

.div-icon-same-free img {
    height: 30px;
    width: auto!important;
}

.div-header {
    padding: 0;
    font-size: 18px;
}

.menu-active {
    color: rgb(88,212,245);
    font-weight: bold;
}

#rank-video-list {
    padding: 20px 0px 20px 0px;
}

.rank-video-item {
    padding: 20px 0px 20px 0px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}

.rank-item-img .item-img {
    box-shadow: 11px 1px 8px 3px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 8px 3px rgba(88,212,245,0.6);
    border-radius: 13px;
    //max-height: 130px;
    height: 250px;
    //max-width: 350px;
    width: 350px;
}

.rank-video-item .div-item-name{
    padding-left: 25px;
    color: rgb(153,153,153);
}

.rank-item-img {
    position: relative;
}

.icon-ranking-order {
    position: absolute;
    top: -8px;
    left: 5px;
}

.ranking-order {
    font-family: GillSans-Bold;
    position: absolute;
    top: 11px;
    left: 30px;
    color: #000;
}

.div-premium .div-container {
    height: 300px;
}

.div-premium .image-popular img {
    max-height: 255px;
}

#div-dvd-popular, #div-dvd-recommend {
    padding-top: 30px;
}

.div-list-dvd {
    padding-top: 30px;
}

.header .container> .navbar-header {
    margin-left: 0px;
    margin-right: 0px;
}

.div-dvd-premium {
    border: none;
}

.div-dvd-premium  .div-container {
    height: 300px;
}

.div-dvd-premium .title-section {
    text-align:left; 
    font-size:22px; 
}

.div-iframe {
    width: 60%;
    margin: 0 auto;
}

.div-grid {
    display: grid;
}
.clear {float:none;clear: both;}
.collapsed {display: none}

.comediantimeline .div-title {  margin: 20px 0;}
.top_search {margin: 0px 0px 20px 0px;padding-top:20px}
.search-bar-timeline{float: right; width: 89%}
.sendmail {background-image:url(../images/btn_request@h.png);
    background-repeat: no-repeat;
    width: 95px;height: 38px;  
    margin: 10px 20px 0px 0px;
    text-align: center;
    padding-top: 7px;
    float: left;
}
/*.div-video-new-premium {
    padding-top: 20px;
}*/

.dvd-item .div-image-icon-new {
    position: absolute;
    top: 10px;
    left: 10px;
}

.div-text-left {
    text-align: left;
    //margin-left: 10px;
}
.comedian-tab-navigation.brave {
  margin: 20px 0;
}
.brave .tab-navigation-button {
  border: 2.5px solid #aaa;
  color: #aaa;
  padding: 10px;
  border-radius: 22px;
  word-break: keep-all;
}
.brave .tab-navigation-button.active,
.brave .tab-navigation-button:hover {
  border: 2.5px solid #edce00;
}
a .tab-navigation-button.active,
a .tab-navigation-button:hover {
  color: #edce00;
}

.dvd-container{
    max-width: 93.5rem;
    margin: 0 auto;
    /* padding: 0 2rem; */
}
.dvd-items{
    width: auto;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    grid-gap: 1rem;
    
}
.dvd-items .item {
    position: relative;
    flex: 1 0 20rem;
    margin-top: 5px;
    color: #fff;
    cursor: pointer;
    max-width:300px
}

.dvd-items .item--image{
    position: relative;
}
.dvd-items .item--title{
    font-size: 1.25rem;
}

.dvd-items img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    /* max-width:260px;
    max-height:365px; */
}

.bg-trans{
    background-color: rgba(0,0,0,0.4);
}

.div-list-dvd-scroll .image-popular{
    padding: 5px;
}

.div-list-dvd-scroll {
    padding-top: 30px;
}

.div-list-dvd-scroll .floatLeft {
    margin: 10px 10px 10px 10px;
    display: inline-block;
    height: auto;
}

.div-list-dvd-scroll .div-image-icon-new {
    top: 12px;
    left: 12px;
}

.div-list-dvd-scroll .div-icon-free {
    bottom: 12px;
    left: 12px;
}

.col-dvd-list {
    max-width: calc(100% / 5);
    margin: 10px 0px 10px 0px;
    flex-grow: unset;
    flex-basis: unset;
}

.list-dvd-scroll {
    padding: 30px 0px 0px 0px;
}

/*.col-dvd-list .image-popular .img-recommendation {
    max-width: 100%;
}*/

/*.item {
    padding: 10px;
}*/

.item-content {
    position: relative;
    margin-bottom: 20px;
}

.item-awatar {
    position: absolute;
    top: 10px;
    left: 10px;
}

.video-item-list .item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.item-image .thumnail-video {
    //width: 100%;
    //max-height: 300px;
    width: 530px;
    height: 300px;
    box-shadow: 11px 1px 3px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 3px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 3px 1px rgba(88,212,245,0.6);
    border-radius: 13px;
    opacity: 0.5;
}
.item-image .thumnail-video:hover {
    opacity: 0.7;
    cursor: pointer;
}
.awatar-image{
    display: flex;
}
.awatar-image  .text-name {
    margin-left: 15px;
}
.awatar-image .name-comedian{
    font-size: 1.25em;
}
.awatar-image .name-company{
    color: rgb(153,153,153);
}
.awatar-image img{
    max-height: 70px;
}

.item-content .div-icon-free {
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.item-content .div-icon-new {
    position: absolute;
    bottom: 50px;
    left: 9px;
}
.item-content .div-icon-free img{
    max-height: 30px;
}
.item-content .div-icon-new img {
    max-height: 23px;
}

.video-duration {
    background-color: rgba(0,0,0,0.2);
    position: absolute;
    bottom: 10px;
    right: 10px;
    color: #fff;
    border-radius: 3px;
    padding: 5px 15px 5px 15px;
}

.item-type {
    position: absolute;
    top: 20px;
    right: 0px;
    color: rgb(88,212,245);
    font-size: 20px;
/*    border-left: 3px solid rgb(88,212,245);
    border-top: 3px solid rgb(88,212,245);
    border-bottom: 3px solid rgb(88,212,245);*/
    border: 4px solid rgb(88,212,245);
    border-top-left-radius: 53px;
    border-bottom-left-radius: 53px;
    padding: 5px 20px 5px 20px;
}

.video-content-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgb(88,212,245);
    font-size: 20px;
    font-weight: bold;
    z-index: 100;
}

.video-item-list {
    padding-top: 10px;
}

.col-item-video {
    max-width: calc(100% /2);
    margin: 10px 0px 10px 0px;
}

.loader {
    width: 3rem;
    height: 3rem;
    border: 0.6rem solid #999;
    border-bottom-color: transparent;
    border-radius: 50%;
    margin: 0 auto;
    animation: loader 500ms linear infinite;
}
@keyframes loader {
    to {
        transform: rotate(360deg);
    }
}

.div-item-img {
    position: relative;
    display: inline-block;
}

.item-type {
    position: absolute;
    top: 20px;
    right: 0px;
    color: rgb(88,212,245);
    font-size: 20px;
/*    border-left: 3px solid rgb(88,212,245);
    border-top: 3px solid rgb(88,212,245);
    border-bottom: 3px solid rgb(88,212,245);*/
    border: 4px solid rgb(88,212,245);
    border-top-left-radius: 53px;
    border-bottom-left-radius: 53px;
    padding: 5px 20px 5px 20px;
    min-width: 110px;
    text-align: center;
}

.video-item {
    padding: 5px;
/*    display: flex;
    justify-content: flex-start;
    align-items: center;*/
    position: relative;
    opacity: 0.85;
}
.video-item:hover{
/*    background: #222;
    border-top-left-radius: 13px;
    border-bottom-left-radius: 13px;*/
    opacity: 1;
}

.video-item .div-image-icon-new {
    top: 10px;
    left: 10px;
}

.video-item .item-type {
    position: absolute;
    top: 15px;
    right: 0px;
    color: rgb(88,212,245);
    font-size: 14px;
/*    border-left: 3px solid rgb(88,212,245);
    border-top: 3px solid rgb(88,212,245);
    border-bottom: 3px solid rgb(88,212,245);*/
    border: 3px solid rgb(88,212,245);
    border-top-left-radius: 53px;
    border-bottom-left-radius: 53px;
    padding: 2px 10px 2px 10px;
    text-align: center;
    min-width: 70px;
}

.video-list {
    padding-top: 40px;
}
/*.comedian #slider1_container {border: 1px solid #edce00;border-radius: 10px}*/
.classnone {display: none}
.comedianlist .comediantimeline .div-title {display: block}
.comediantimeline .div-title {display: none}
.div-dvd-icon-free {
    position: absolute;
    left: 8px;
    bottom: 8px;
}

#div-name:hover {
    cursor: pointer;
}

.div-dvd-thumnail {
    position: absolute;
    display: table;
    margin: 0 auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.div-video-title {
/*    position: absolute;
    bottom: 40px;
    left: 10px;
    z-index: 10;*/
    position: absolute;
    bottom: 0px;
    z-index: 10;
    width: 100%;
    padding: 10px;
    background: #000;
    opacity: 0.5;
    text-align: left;
}

.hide {
    display: none;
}

.show {
    display: block;
}

#div-img-up, #div-img-down {
    cursor: pointer;
}

.div-background {
    background: url('https://s3-ap-northeast-1.amazonaws.com/lalalive/dvds/thumbnails/32.jpg');
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    height: 576px;
    width: 100%;
    filter: blur(8px);
  -webkit-filter: blur(8px);
}

#div-share {
    cursor: pointer;
}

.black-color {
    color: #000;
}

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

.align-right {
    text-align: right;
}

.div-share-twitter {
    padding: 10px 10px 10px 10px;
    cursor: pointer;
}

.div-share-twitter img {
    height: 40px;
}

.div-share-facebook {
    height: 50px;
    padding: 10px 20px 10px 20px;
    cursor: pointer;
}

.div-share-facebook img {
    height: 40px;
}

.div-share-mail {
    height: 50px;
    padding: 20px 20px 40px 10px;
    cursor: pointer;
}

.div-share-mail img {
    height: 35px;
}

#shareModal .modal-dialog {
    width: 300px;
}

.div-email-text {
    padding-left: 20px;
}

.align-center {
    text-align: center;
}

#fanModal .modal-header {
    color: #000;
}

.width-full {
    width: 100%;
}

/*.modal-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}*/

#shareModal {
    top: 25%;
}

.div-is-fan {
    background-color: #fff;
    color: #000;
}

.popup-notice {
  /* apply 3 second hiding animation after 10 second delay */
  //animation: hide 3s 10s forwards;
  animation: hide 60s 100s forwards;

  /* fix popup at the center of screen, optional style */
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  padding: 20px;
  /* dimming entire screen except popup */
  //outline: 100vmax solid #ccc;
  background-color: #fff;
  color: #000;
}

@keyframes hide {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

#noticeModal .notice-content {
    padding: 25px;
    text-align: center;
}

#noticeModal .modal-footer {
    display: block;
    text-align: center;
}

.pointer {
    cursor: pointer;
}

.did-blur {
    //background: url('https://images.unsplash.com/photo-1486723312829-f32b4a25211b?dpr=2&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=&bg=');
/*    background: url('https://images.unsplash.com/photo-1486723312829-f32b4a25211b?dpr=2&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=&bg=') no-repeat center center fixed;
    filter: blur(8px);
    -webkit-filter: blur(8px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;*/
    width: 100%;
    height: 576px;
    filter: blur(18px)!important;
    -webkit-filter: blur(18px)!important;
    background-position: center!important;
    background-repeat: no-repeat!important;
    background-size: cover!important;
    opacity: 0.8;
}

#div-detail-image {
    position: relative;
}

#dvd-detail-header {
    padding-left: 0;
    padding-right: 0;
}

#dvd-detail-header .container {
    padding-left: 5px;
    padding-right: 5px;
}

#shareModal {
    overflow: hidden;
}

.div-video-img {
    padding-right: 5px;
}

#div-receive img {
    margin-left: 15px;
}

.nav-link.new{background-image:url(../images/btn_new_off_y@2x.png);}
.nav-link.new:hover,.nav-link.new.active{background-image:url(../images/btn_new_on_y@2x.png);}
.nav-link.popular{background-image:url(../images/btn_ranking_off@2x.png);}
.nav-link.popular:hover, .nav-link.popular.active{background-image:url(../images/btn_ranking_on_y@2x.png);}
.nav-link {padding: 10px  3px;background-size: 120px;color: transparent;background-repeat: no-repeat;}
.ranking_line_y img {height: 45px;}
.nav-link:hover{color: transparent;}
.nav{justify-content:center;padding-top: 10px}
.profile-box--comedian .info-wrapper{
    padding: 2rem 1rem;    
    color: #fff;
}
.profile-box--comedian .info-wrapper .info--basic{
    display: flex;
    justify-content: space-between;
}

.info--basic .info--left p.user-name{
    font-size: 2rem;
    font-weight: bold;
}
.info--more{
    display: none;
    margin-top: -15px; 
    
}
.info--more.open{
    display: block;
    transition-delay: 1s;
    transition: display 3s;
}

ul.list-icons {
    list-style: none;
}

.body-list--comedian-fan ul.list-icons{
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}

ul.list-icons li{
    display: inline-block;
    position: relative;
    margin-left: 1rem;
    width: 35px;
    height: 35px;
    font-size: 1rem;
}

ul.list-icons.list-icon--medium li{
    width: 60px;
    height: 60px;
}
ul.list-icons.list-icon--circle li img{
    border-radius: 100%;
}
ul.list-icons.list-icon--circle li p{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
ul.list-icons img:hover{
    opacity: 0.5;
}
ul.list-icons li:first-child{
    margin-left: 0;
}
ul.list-icons li img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.btn-white-round{
    border-radius: 3rem;
    border: 0.5px solid #fff;
    background: transparent;
    color: #fff;
    padding: 0.75rem 2rem;
}
.info--basic .info--right .btn-white-round{
    margin-top: 1rem;
}

.btn--subcried{
    background: #fff;
    color: #222;

}
.btn-white-round:hover{
    opacity: 0.6;
}

.div-dropdown:hover {
    cursor: pointer;
}

.dropdown-menu{
    padding: 0;
    border-radius: 0;
}
.dropdown-divider{
    margin: 0;
}
.dropdown-menu a{
    padding: 15px;
    margin-top: 1px;
    background: #fff;
   
}
.dropdown-menu a:hover,
.dropdown-menu a:focus,
.dropdown-menu a:active{
    background: #222;
    color: #fff;
}

.dropdown-menu .dropdown-item{
    padding: 15px;
    margin-top: 1px;
    background: #fff;
    cursor: pointer;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:active{
    background: #222;
    color: #fff;
}

#toast-bar {
    visibility: hidden;
    width: 450px;
    margin: auto;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    padding: 16px;
    position: fixed;
    left: 0;
    right:0;
    top: 50px;
    font-size: 17px;
    z-index: 10000;
}

#toast-bar.show {
    visibility: visible;
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
  }
  
  @-webkit-keyframes fadein {
    from {top: 0; opacity: 0;} 
    to {top: 50px; opacity: 1;}
  }
  
  @keyframes fadein {
    from {top: 0; opacity: 0;}
    to {top: 50px; opacity: 1;}
  }
  
  @-webkit-keyframes fadeout {
    from {top: 50px; opacity: 1;} 
    to {top: 0; opacity: 0;}
  }
  
  @keyframes fadeout {
    from {top: 50px; opacity: 1;}
    to {top: 0; opacity: 0;}
  }
  
  #player-video {
      text-align: center;
      margin: auto;
  }
  
/*  #div-receive img:hover{
      animation: shake 0.5s;
      animation-iteration-count: infinite;
  }

  @keyframes shake {
      0% { transform: translate(1px, 1px) rotate(0deg); }
      10% { transform: translate(-1px, -2px) rotate(-1deg); }
      20% { transform: translate(-3px, 0px) rotate(1deg); }
      30% { transform: translate(3px, 2px) rotate(0deg); }
      40% { transform: translate(1px, -1px) rotate(1deg); }
      50% { transform: translate(-1px, 2px) rotate(-1deg); }
      60% { transform: translate(-3px, 1px) rotate(0deg); }
      70% { transform: translate(3px, 1px) rotate(-1deg); }
      80% { transform: translate(-1px, -1px) rotate(1deg); }
      90% { transform: translate(1px, 2px) rotate(0deg); }
      100% { transform: translate(1px, -2px) rotate(-1deg); }
  }*/

/*#div-receive img {
    -moz-transition: transform 0.5s;
    -webkit-transition: transform 0.5s;
    transition: transform 0.5s;
}

.flip {
  transform: rotate(30deg);
}*/

/*#div-receive img {
    -moz-transition: transform 0.1s;
    -webkit-transition: transform 0.1s;
    transition: transform 0.1s;
}*/

.flip {
    -webkit-animation: rotation 0.5s infinite linear;
}

@-webkit-keyframes rotation {
    0%  {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(30deg);}   
}

#player_video {
    text-align: center;
    margin: auto;
}

.padding-bottom-20 {
    padding-bottom: 20px;
}

#video_detail_screen .embed-responsive-16by9::before {
    padding-top: 0;
}

.comedian-contents .no-fan{
    font-size: 1.25rem;
    color: rgb(237, 206, 0);
    font-weight: bold;
}

.display-flex {
    display: flex!important;
}

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

.div-video-list .div-image-icon-new {
    top: 8px;
}

.div-video-list .div-icon-free {
    bottom: 8px;
}
.company .name-fan {font-size: 16px}

.bottom-10 {
    bottom: 10px!important;
}

.company_name {padding-top: 20px;text-align: center}

.div-item-img .dvd-img {
    box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -webkit-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    -moz-box-shadow: 1px 1px 5px 1px rgba(88,212,245,0.6);
    border-radius: 8px;
}

.modal-alert .modal-content{
    color: rgba(0,0,0,.65);
}
.modal-alert .modal-content .modal-header{
    margin-bottom: 13px;
    margin-top: 26px;
    font-weight: 600;
    padding: 13px 16px;
    font-size: 1.35rem;
    border :none;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.3);
}
.modal-alert .modal-content .modal-body{
    font-size: 1.25rem;
    margin: 0;
    padding: 0 10px;
    font-weight: 400;
    color: rgba(0,0,0,.64);
    border :none;
}
.modal-alert .modal-content .modal-footer{
    background-color: rgb(245, 248, 250);
    margin-top: 32px;
    border-top: 1px solid rgb(233, 238, 241);
    overflow: hidden;
    padding: 13px 16px;
    
}
.btn-gray{
    color: #555;
    background: linear-gradient(to right, #efefef, #ebe6e6e1);
    /* background-color: #efefef; */
    padding: 10px 24px;
    border: none;
    box-shadow: none;
    border-radius: 5px;
    font-weight: 600;
}
.btn-light-blue{
    background: linear-gradient(to right, #7cd1f9, #40c4ff);
    color: #fff;
    border: none;
    box-shadow: none;
    border-radius: 5px;
    font-weight: 600;
    padding: 10px 24px;
}

.row-info .content .tag .appearance {
    font-size: 20pt;
    color: rgb(153, 153, 153);
}

.div-dvd-img-parent {
    height: 255px;
    width: 180px;
    display: flex;
    align-items: center;
}

.div-dvd-img {
    position: relative;
}

.col .div-image-icon-new {
    top: 2px;
}

.padding-0 {
    padding-top: 0px!important;
}

.padding-82 {
    padding-top: 82px;
}

.truncated-text{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.wrap{
    white-space: pre-wrap;
   white-space: -moz-pre-wrap; 
   white-space: -pre-wrap; 
   white-space: -o-pre-wrap;
   word-wrap: break-word;
}
/*.comedian-tab-navigation .div-left {width: 0px;}*/

.div-flex {
    display: flex;
}

.div-flex-center {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}

.div-item-name {
    padding: 10px 0px 0px 0px;
    color: rgb(153,153,153);
}

.div-list-dvd .div-text {
    color: #fff;
}
.form-group .bg-custom {
    background: #222;
}

.border-none {
    border: none;
}

#txt_comment {
    background-color: #4C4C4C;
    border: none;
    //color: rgb(253,253,253);
    color: #fff;
}

#comment_icon {
    height: 42px;
    opacity: 0.5;
}

.comment-active {
    opacity: 1!important;
}

.modal-footer-center {
    justify-content: center;
}

.comedian-genre {padding-top: 15px!important}
.bookmark-live-list-comedian {padding-left: 0px!important}

.div-item-img .ovr-text-top-right {
    width: 60px;
    padding: 0;
    padding-top: 3px;
}
.div-item-img .ovr-text-bottom-right {
    right: 12px;
}

#player_video {
    width: 500px;
    height: 360px;
}
.dvd-item .comedian-name-custom {
    width: 100%;
    //text-align: center;
}

::-webkit-scrollbar {
    height: 8px;
    overflow: visible;
    width: 8px;
}

.left-no-width .div-left {width: 0px}

.btn-no-color {
    border: 1px solid #fff;
    //background-color: unset;
    background: rgba(255,255,255,0.12);
}

.comedian-detail .empty{color:#999}
.left-no-width .div-left {width: 0px}

.notice-register {
    padding: 15px 0 10px 0;
    font-size: 12px;
}

.display-block {
    display: block!important;
}

.div-bar-center .div-left {
    width: 10%!important;
}

.div-bar-center .div-center {
    width: 80%!important;
}

.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}

.div-text-parent {
    padding: 8px;
}

a:hover {
    cursor: pointer;
}

.div-block {
    display: block;
}

.div-inline {
    display: inline-block;
}

.btn-black {
    background-color: #222;
}

.align-left {
    text-align: left!important;
}

.display-unset {
    display: unset!important;
}

.div-keyword {
    font-size: 16px;
    font-family: HiraKakuProN-W3;
    //border: 1px solid rgba(237,255,255,0.5);
    border-radius: 3px;
    display: inline-table;
    padding: 6px;
    margin: 3px 0px 3px 0px;
}

.div-parent-keyword {
    width: 89%;
    background: rgba(0,0,0,0.9);
    padding: 7px;
    border-radius: 3px;
    position: absolute;
    z-index: 2;
}

.div-keyword:hover {
    opacity: 0.6;
}

.div-title-keyword {
    padding: 7px;
    color: #a68700;
}

.view-more-color {
    color: #999;
}

.grey-color {
    color: #999;
}

.text-bold {
    font-weight: bold;
}