﻿/*begin::common styles*/
:root {
    --bg-main-color: #79ABB9;
    --text-main-color: #595757;
    --text-second-color: #999999;
    --ja-font-family: 'M PLUS 1p', sans-serif;
    --swiper-navigation-color: #FFFFFF;
    --form-check-input-bg: #79ABB9;
}
body, html {
    font-size: 16px;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body{font-family:'Roboto',sans-serif!important;font-weight:400}
/*body.ja-JP{font-family: Meiryo, 'メイリオ', ArialMT, Hiragino Kaku Gothic Pro, 'ヒラギノ角ゴ Pro W3', Osaka, Verdana, 'ＭＳ Ｐゴシック' !important;font-weight: 400;font-size: 1rem;}*/
body { padding-right: 0 !important }
.modal-open {padding-right: 0px !important;}
.btn{font-family:unset}
.float-left{float:left}
.float-right{float:right}
.main-color{color:var(--root--color-info)}
.nopadding{padding:0!important}
.nomargin{margin:0!important}
.width-1{width:10%}
.width-1-5{width:15%}
.width-2{width:20%}
.width-3{width:30%}
.width-4{width:40%}
.width-5{width:50%}
.full-width{width:100%;}
.full-height{width:100%;}
.fz-12{font-size:12px!important}
.fz-13{font-size:13px!important}
.fz-14{font-size:14px!important}
.fz-15{font-size:15px!important}
.fz-16{font-size:16px!important}
.fz-17{font-size:17px!important}
.fz-18{font-size:18px!important}
.fz-19{font-size:19px!important}
.fz-20{font-size:20px!important}
.fz-22{font-size: 22px !important}
.fz-24{font-size: 24px !important}
.fz-25{font-size:25px!important}
.fz-27 {
    font-size: 27px !important
}
.fz-30{font-size:30px!important}
.fz-35 {
    font-size: 35px !important
}
.fz-40 {
    font-size: 40px !important
}
.fz-45 {
    font-size: 45px !important
}
.fz-50 {
    font-size: 50px !important
}
.fz-55 {
    font-size: 3vw !important
}
.mt0{margin-top:0!important}
.mt5{margin-top:5px!important}
.mt7{margin-top:7px!important}
.mt8{margin-top:8px!important}
.mt10{margin-top:10px!important}
.mt15{margin-top:15px!important}
.mt20{margin-top:20px!important}
.mt25{margin-top:25px!important}
.mt30{margin-top:30px!important}
.mt40{margin-top:40px!important}
.mt50{margin-top: 50px !important}
.mb0{margin-bottom:0!important}
.mb5{margin-bottom:5px!important}
.mb10{margin-bottom:10px!important}
.mb15{margin-bottom:15px!important}
.mb20{margin-bottom:20px!important}
.mb25{margin-bottom:25px!important}
.mb30{margin-bottom:30px!important}
.mb40{margin-bottom:40px!important}
.mb50{margin-bottom: 50px !important}
.mr0{margin-right:0!important}
.mr5{margin-right:5px!important}
.mr10{margin-right:10px!important}
.mr15{margin-right:15px!important}
.mr20{margin-right:20px!important}
.mr25{margin-right:25px!important}
.mr30{margin-right:30px!important}
.mr40{margin-right:40px!important}
.ml0{margin-left:0!important}
.ml5{margin-left:5px!important}
.ml10{margin-left:10px!important}
.ml15{margin-left:15px!important}
.ml20{margin-left:20px!important}
.ml25{margin-left:25px!important}
.ml30{margin-left:30px!important}
.ml40{margin-left:40px!important}
.pt0{padding-top:0!important}
.pt5{padding-top:5px!important}
.pt10{padding-top:10px!important}
.pt15{padding-top:15px!important}
.pt20{padding-top:20px!important}
.pt25{padding-top:25px!important}
.pt30{padding-top:30px!important}
.pt40{padding-top:40px!important}
.pt50{padding-top: 50px !important}
.pt60{padding-top: 60px !important}
.pb0{padding-bottom:0!important}
.pb5{padding-bottom:5px!important}
.pb10{padding-bottom:10px!important}
.pb15{padding-bottom:15px!important}
.pb20{padding-bottom:20px!important}
.pb25{padding-bottom:25px!important}
.pb30{padding-bottom:30px!important}
.pb40{padding-bottom:40px!important}
.pb50{padding-bottom: 50px !important}
.pr0{padding-right:0!important}
.pr5{padding-right:5px!important}
.pr10{padding-right:10px!important}
.pr15{padding-right:15px!important}
.pr20{padding-right:20px!important}
.pr25{padding-right:25px!important}
.pr30{padding-right:30px!important}
.pr40{padding-right:40px!important}
.pl0{padding-left:0!important}
.pl5{padding-left:5px!important}
.pl10{padding-left:10px!important}
.pl15{padding-left:15px!important}
.pl20{padding-left:20px!important}
.pl25{padding-left:25px!important}
.pl30{padding-left:30px!important}
.pl40{padding-left:40px!important}
.left{float:left}
.clearfix{clear:both}

body.ja-JP {
    font-family: var(--ja-font-family) !important;
}
.label-line {
    border-top: 3px solid var(--bg-main-color);
}
.is-current {
    border-bottom: 3px solid var(--bg-main-color);
}
.border-bottom-3 {
    border-bottom: 3px solid #CCCCCC;
}
.m-redirect__options {
    position: relative;
    z-index: 2;
    line-height: 1.5;
}
.row {
    margin-right: 0;
    margin-left: 0;
}
.video-list {
    margin-right: -10px !important;
    margin-left: -10px !important;
}
.slick-track {
    margin-left: 0 !important;
}
/*Fix Focus Safari*/
@supports (-webkit-overflow-scrolling: touch) {
    input[type="color"],
    input[type="date"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="email"],
    input[type="month"],
    input[type="number"],
    input[type="password"],
    input[type="search"],
    input[type="tel"],
    input[type="text"],
    input[type="time"],
    input[type="url"],
    input[type="week"],
    select,
    textarea {
        font-size: 16px !important;
    }
}
/*end focus*/
.fz-55 {
    font-size: clamp(28px, 2.8vw, 55px) !important;
}
.fz-40 {
    font-size: clamp(25px, 2.2vw, 40px) !important;
}
.fz-30 {
    font-size: clamp(25px, 1.8vw, 30px) !important;
}
.fz-27 {
    font-size: clamp(20px, 1.6vw, 27px) !important;
}
.fz-25 {
    font-size: clamp(16px, 1.36vw, 25px) !important;
}
.fz-24 {
    font-size: clamp(16px, 1.34vw, 24px) !important;
}
.fz-20 {
    font-size: clamp(16px, 1.08vw, 20px) !important;
}
.fz-18 {
    font-size: clamp(16px, 1vw, 18px) !important;
}
.fz-17 {
    font-size: clamp(12px, 0.92vw, 17px) !important;
}
.fz-16 {
    font-size: clamp(14px, 0.9vw, 16px) !important;
}
@media (max-width: 1199px) {
    .m-videos-item__detail .fz-25 {
        font-size: clamp(18px, 2vw, 21px) !important;
    }
    .m-videos-item__detail .fz-20 {
        font-size: clamp(18px, 1.5vw, 20px) !important;
    }
    .m-videos-item__detail .fz-17 {
        font-size: clamp(12px, 1.5vw, 14px) !important;
    }
}
@media (max-width: 991px) {
    .m-videos-item__detail .fz-25 {
        font-size: clamp(18px, 2.5vw, 22px) !important;
    }

    .m-videos-item__detail .fz-20 {
        font-size: clamp(18px, 2vw, 20px) !important;
    }

    .m-videos-item__detail .fz-17 {
        font-size: clamp(10px, 1.8vw, 12px) !important;
    }
}
@media (max-width: 767px) {
    .fz-55 {
        font-size: clamp(30px, 3.8vw, 40px) !important;
    }
    .fz-40 {
        font-size: clamp(25px, 3.6vw, 38px) !important;
    }
    .fz-30 {
        font-size: clamp(25px, 4vw, 30px) !important;
    }
    .fz-27 {
        font-size: clamp(20px, 3vw, 22px) !important;
    }
    .fz-24 {
        font-size: clamp(20px, 2.6vw, 22px) !important;
    }
    .m-videos-item__detail .fz-25 {
        font-size: clamp(20px, 3.3vw, 25px) !important;
    }
    .m-videos-item__detail .fz-20 {
        font-size: clamp(18px, 3vw, 22px) !important;
    }
    .m-videos-item__detail .fz-17 {
        font-size: clamp(14px, 2.5vw, 16px) !important;
    }
    .m-redirect__options.is-sp {
        margin-top: 20px !important;
    }
}
@media (max-width: 419px){
    .m-videos-item__detail .fz-25 {
        font-size: clamp(17px, 3.3vw, 25px) !important;
    }
    .m-videos-item__detail .fz-20 {
        font-size: clamp(16px, 3vw, 22px) !important;
    }
    .m-videos-item__detail .fz-17 {
        font-size: clamp(12px, 2.5vw, 16px) !important;
    }
}
/*@media (max-width: 574px) {
    body, html {
        font-size: 3.6vw !important;
    }
    .fz-40-sp {
        font-size: 6.5vw !important;
    }
    .fz-35-sp {
        font-size: 6vw !important;
    }
    .fz-30-sp {
        font-size: 5.5vw !important;
    }
    .fz-25-sp {
        font-size: 5vw !important;
    }
    .fz-22-sp {
        font-size: 4.2vw !important;
    }
    .fz-20-sp {
        font-size: 4vw !important;
    }
    .fz-18-sp {
        font-size: 3.8vw !important;
    }
    .fz-16-sp {
        font-size: 3.6vw !important;
    }
    .fz-14-sp {
        font-size: 3.2vw !important;
    }
}*/
/*end::common styles*/
/*begin::login, register page styles*/
.m-login.m-login--2 .m-login__wrapper {
    min-height: 100vh;
    padding: 0;
    margin: 0;
}
.m-login__login-container {
    color: var(--text-main-color);
    width: 450px;
    margin: 0 auto;
}
.form-control {
    font-family: var(--ja-font-family);
}
.m-login__login-container .m-form .m-form__group {
    padding-bottom: 5px;
    padding-top: 5px;
}
.form-group.m-form__group.m-form__group .m-form__group-label {
    color: var(--text-main-color);
}
.m-login.m-login--2 .m-login__wrapper .m-login__login-container .m-login__form .form-control.m-input {
    color: var(--text-main-color);
    margin: 0;
    border-radius: 8px;
    padding: 12px;
    background: none;
    border: 1px solid var(--text-second-color);
}
.m-login__btn, .btn.btn-info {
    font-family: var(--ja-font-family);
    color: #FFFFFF;
    /*padding: 12px 0;*/
    border-radius: 8px;
    border-color:#a5d3cc;
    background: linear-gradient(to right, #84CDB9, #97C3D0, #84CDB9);
    padding-top:12px;
    padding-bottom:12px;
}
.m-login__forget-password-text {
    color: var(--bg-main-color);
}
.m-auth__logo-img {
    height: 80px;
    width: auto;
}
@media (max-width: 767px) {
    .m-login__login-container {
        width: 82vw;
    }
}
@media (max-width: 574px) {
    .m-login__login-container {
        width: 86vw;
    }
    .m_auth--title {
        margin-top: 30px !important;
    }
    .m-auth__logo-img {
        height: auto;
        width: 30vw;
    }
}
/*end::login, register page styles*/

/*begin::home page styles*/
.m-home__banner-img {
    border-radius: 30px;
}
@media (max-width: 767px) {
    .m-header-left__slogan-img {
        /*display: none;*/
    }
    .m-home__banner-img {
        border-radius: 20px;
    }
}
@media (max-width: 574px) {
    .m-home__banner {
        margin-top: 20px !important;
    }
    .m-home__catalog-list-container {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
    .m-home__banner-img {
        border-radius: 20px;
    }
}
/*end::home page styles*/

/*begin::video detail page styles*/
.m-video-detail {
    margin: 0 auto;
}
.m-video__head {
    width: 81%;
    margin: 0 auto;
}
.m-video__thumbnail-wrapper {
    position: relative;
    width: 81%;
    height: 38.6vw;
    border-radius: 10px;
    margin: 0 auto;
}
.m-video__thumbnail {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}
.m-video__distributor-img {
    width: clamp(55px, 12vw, 150px);
    height: clamp(55px, 12vw, 150px);
}
.m-video__detail.is_pc {
    display: block;
}
.m-video__detail.is_sp {
    display: none;
}
@media (max-width: 767px) {
    .m-video__head {
        width: 100%;
    }
    .m-video__thumbnail-wrapper, .m-video__thumbnail {
        width: 100%;
        height: 46vw;
        border-radius: 0;
    }
    .m-video__detail.is_pc {
        display: none !important;
    }
    .m-video__detail.is_sp {
        display: block !important;
    }
    .m-video__tags {
        margin-top: 30px !important;
        margin-bottom: 30px !important;
    }
    .m-video__distributor-img {
        width: clamp(55px, 9vw, 100px);
        height: clamp(55px, 9vw, 100px);
    }
}
@media (max-width: 574px) {
    .m-video__thumbnail-wrapper, .m-video__thumbnail {
        height: 57vw;
    }
}
/*end::video detail page styles*/

/*begin::video list styles*/
.m-videos-item__thumbnail-wrapper {
    position: relative;
    height: clamp(160px, 11.2vw, 213px);
    border-radius: 10px;
    overflow:hidden;
    border:1px solid #ddd;
    transition: all 0.5s;
}

.m-videos-item__thumbnail-wrapper img{
    transition: all 0.5s;
}

.m-videos-item__thumbnail-wrapper:hover img{
    transform:scale(1.5);
}

.m-videos-item__thumbnail-wrapper:hover{
    box-shadow: rgba(60, 64, 67, 0.3) 0px 3px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}

.m-videos-item__thumbnail-wrapper.border {
    border: 1px solid var(--text-main-color) !important;
}
.m-videos-item__length {
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 5px;
    font-size: 10px;
    color: #FFFFFF;
    background-color: #666666;
    border-radius: 5px;
}
.m-videos-item__thumbnail {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}
.m-videos-item__detail-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 50px;
}
@media (max-width: 574px) {
    .m-videos-item__thumbnail-wrapper {
    height: 35vw;
    }
}
/*end::video list styles*/

@media (max-width: 1199px) {
    .m-purchase-list .m-videos-item__thumbnail-wrapper, .m-view-history .m-videos-item__thumbnail-wrapper {
        height: clamp(180px, 18vw, 200px);
    }
}
@media (max-width: 991px) {
    .m-videos-item__thumbnail-wrapper {
        height: clamp(180px, 22vw, 200px);
    }
    .m-purchase-list .m-videos-item__thumbnail-wrapper, .m-view-history .m-videos-item__thumbnail-wrapper {
        height: clamp(160px, 22vw, 264px);
    }
}
@media (max-width: 767px) {
    .m-videos-item__thumbnail-wrapper {
        height: clamp(180px, 30vw, 280px);
    }
}
@media (max-width: 575px) {
    .m-videos-item__thumbnail-wrapper {
        height: clamp(160px, 35vw, 220px);
    }
    .m-purchase-list .m-videos-item__thumbnail-wrapper, .m-view-history .m-videos-item__thumbnail-wrapper {
        height: clamp(180px, 50vw, 300px);
    }
}
@media (max-width: 419px) {
    .m-videos-item__thumbnail-wrapper {
        height: clamp(160px, 30vw, 280px);
    }
}
@media (max-width: 767px) {
    .m-purchase-list .mt30.is-sp {
        margin-top: 20px !important;
    }
    .m-purchase-list .video-list {
        margin-top: 40px !important;
    }
}

.m-page--fluid .m-header,.m-page--wide .m-header {
    background-color: #fff
}

.m-page--boxed .m-header .m-header-head {
    background-color: #fff
}

@media (min-width: 1025px) {
    .m-header {
        height:70px
    }

    .m-header--fixed .m-header {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        z-index: 101;
        position: fixed;
        top: 0;
        left: 0;
        right: 0
    }

    .m-header .m-header-head {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none
    }

    .m-header--static.m-aside-left--fixed .m-header .m-header-head {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
        padding-left: 255px
    }

    .m-header--static.m-aside-left--fixed.m-aside-left--minimize .m-header .m-header-head {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
        padding-left: 80px
    }

    .m-header--fixed.m-header--hide .m-header {
        height: 70px;
        -webkit-transition: all .3s ease .5s;
        -moz-transition: all .3s ease .5s;
        -ms-transition: all .3s ease .5s;
        -o-transition: all .3s ease .5s;
        transition: all .3s ease .5s;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .m-header--fixed.m-header--show .m-header {
        height: 70px;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    body.m-aside-left--skin-dark .m-header .m-header-head {
        -webkit-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        -moz-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        box-shadow: 0 1px 15px 1px rgba(69,65,78,.1)
    }

    body.m-aside-left--skin-light .m-header {
        -webkit-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        -moz-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        box-shadow: 0 1px 15px 1px rgba(69,65,78,.1)
    }
}

@media (max-width: 1024px) {
    .m-header {
        height:60px!important
    }

    .m-header .m-header__nav {
        top: -100%;
        position: relative
    }

    .m-header>.m-container>.m-grid {
        height: 60px
    }

    .m-header>.m-container>.m-grid>.m-grid__col {
        height: 60px
    }

    .m-header--fixed-mobile .m-header {
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        z-index: 101;
        position: fixed;
        top: 0;
        left: 0;
        right: 0
    }

    .m-header--fixed-mobile.m-header--hide .m-header {
        height: 60px;
        -webkit-transition: all .3s ease .5s;
        -moz-transition: all .3s ease .5s;
        -ms-transition: all .3s ease .5s;
        -o-transition: all .3s ease .5s;
        transition: all .3s ease .5s;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    .m-header--fixed-mobile.m-header--show .m-header {
        height: 60px;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0)
    }

    .m-header--fixed-mobile .m-header .m-header-head {
        -webkit-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        -moz-box-shadow: 0 1px 15px 1px rgba(69,65,78,.1);
        box-shadow: 0 1px 15px 1px rgba(69,65,78,.1)
    }
}

.m-dropdown {
    position: relative
}

.m-dropdown.m-dropdown--inline {
    display: inline-block
}

.m-dropdown .m-dropdown__toggle .la-ellipsis-h {
    font-size: 2.1rem
}

.m-dropdown .m-dropdown__wrapper {
    top: 100%;
    text-align: left;
    display: none;
    position: absolute;
    z-index: 1100;
    padding-top: 0;
    width: 245px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__inner {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__inner .m-dropdown__content,.m-dropdown .m-dropdown__wrapper .m-dropdown__inner .m-dropdown__scrollable,.m-dropdown .m-dropdown__wrapper .m-dropdown__inner .mCSB_container,.m-dropdown .m-dropdown__wrapper .m-dropdown__inner .mCustomScrollBox {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__header {
    padding: 20px 20px;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-title {
    display: block;
    padding: 0 0 5px 0;
    font-size: 1.5rem;
    font-weight: 400
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-subtitle {
    display: block;
    padding: 0;
    font-size: 1rem
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__body {
    padding: 20px
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__body .mCSB_scrollTools {
    right: -10px
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__body.m-dropdown__body--paddingless {
    padding: 0
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__body.m-dropdown__body--paddingless .mCSB_scrollTools {
    right: 0
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__footer {
    padding: 20px
}

.m-dropdown.m-dropdown--header-bg-fil .m-dropdown__wrapper .m-dropdown__inner {
    -webkit-border-radius: 8px 8px 4px 4px;
    -moz-border-radius: 8px 8px 4px 4px;
    -ms-border-radius: 8px 8px 4px 4px;
    -o-border-radius: 8px 8px 4px 4px;
    border-radius: 8px 8px 4px 4px
}

.m-dropdown.m-dropdown--header-bg-fil .m-dropdown__wrapper .m-dropdown__inner .m-dropdown__header {
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0
}

.m-dropdown.m-dropdown--footer-bg-fil .m-dropdown__wrapper .m-dropdown__inner {
    -webkit-border-radius: 4px 4px 8px 8px;
    -moz-border-radius: 4px 4px 8px 8px;
    -ms-border-radius: 4px 4px 8px 8px;
    -o-border-radius: 4px 4px 8px 8px;
    border-radius: 4px 4px 8px 8px
}

.m-dropdown.m-dropdown--footer-bg-fil .m-dropdown__wrapper .m-dropdown__inner .m-dropdown__footer {
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px
}

.m-dropdown.m-dropdown--small .m-dropdown__wrapper {
    width: 225px
}

.m-dropdown.m-dropdown--medium .m-dropdown__wrapper {
    width: 325px
}

.m-dropdown.m-dropdown--large .m-dropdown__wrapper {
    width: 380px
}

.m-dropdown.m-dropdown--huge .m-dropdown__wrapper {
    width: 455px
}

.m-dropdown.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--open .m-dropdown__wrapper {
    display: block;
    -webkit-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-up .3s ease-out 1;
    -moz-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-up .3s ease-out 1;
    -ms-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-up .3s ease-out 1;
    -o-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-up .3s ease-out 1;
    animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-up .3s ease-out 1
}

@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none) {
    .m-dropdown.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--open .m-dropdown__wrapper {
        animation: none!important
    }
}

@media screen\0 {
    .m-dropdown.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--open .m-dropdown__wrapper {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        -o-animation: none;
        animation: none
    }
}

@media screen\0 and (-ms-high-contrast:none) {
    .m-dropdown.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--open .m-dropdown__wrapper {
        animation: none!important
    }
}

.m-dropdown.m-dropdown--up .m-dropdown__wrapper {
    padding-top: 0;
    top: auto;
    bottom: 100%;
    padding-bottom: 0
}

.m-dropdown.m-dropdown--up.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--up.m-dropdown--open .m-dropdown__wrapper {
    display: block;
    -webkit-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-down .3s ease-out 1;
    -moz-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-down .3s ease-out 1;
    -ms-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-down .3s ease-out 1;
    -o-animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-down .3s ease-out 1;
    animation: m-dropdown-fade-in .3s ease 1,m-dropdown-move-down .3s ease-out 1
}

@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none) {
    .m-dropdown.m-dropdown--up.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--up.m-dropdown--open .m-dropdown__wrapper {
        animation: none!important
    }
}

@media screen\0 {
    .m-dropdown.m-dropdown--up.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--up.m-dropdown--open .m-dropdown__wrapper {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        -o-animation: none;
        animation: none
    }
}

@media screen\0 and (-ms-high-contrast:none) {
    .m-dropdown.m-dropdown--up.m-dropdown--hoverable:hover .m-dropdown__wrapper,.m-dropdown.m-dropdown--up.m-dropdown--open .m-dropdown__wrapper {
        animation: none!important
    }
}

.m-dropdown.m-dropdown--align-right .m-dropdown__wrapper {
    right: 0
}

.m-dropdown.m-dropdown--align-right.m-dropdown--align-push .m-dropdown__wrapper {
    margin-right: -20px
}

.m-dropdown.m-dropdown--align-left .m-dropdown__wrapper {
    left: 0
}

.m-dropdown.m-dropdown--align-left.m-dropdown--align-push .m-dropdown__wrapper {
    margin-left: -20px
}

.m-dropdown.m-dropdown--align-center .m-dropdown__wrapper {
    left: 50%;
    width: 245px;
    margin-left: -122.5px
}

.m-dropdown.m-dropdown--align-center.m-dropdown--small .m-dropdown__wrapper {
    width: 225px;
    margin-left: -112.5px
}

.m-dropdown.m-dropdown--align-center.m-dropdown--medium .m-dropdown__wrapper {
    width: 325px;
    margin-left: -162.5px
}

.m-dropdown.m-dropdown--align-center.m-dropdown--large .m-dropdown__wrapper {
    width: 380px;
    margin-left: -190px
}

.m-dropdown.m-dropdown--align-center.m-dropdown--huge .m-dropdown__wrapper {
    width: 455px;
    margin-left: -227.5px
}

@media (max-width: 768px) {
    .m-dropdown.m-dropdown--mobile-full-width.m-dropdown--align-center>.m-dropdown__wrapper,.m-dropdown.m-dropdown--mobile-full-width>.m-dropdown__wrapper {
        width:auto;
        margin: 0 auto;
        left: 30px;
        right: 30px
    }

    .m-dropdown.m-dropdown--mobile-full-width.m-dropdown--align-center>.m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-title,.m-dropdown.m-dropdown--mobile-full-width>.m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-title {
        font-size: 1.2rem;
        font-weight: 500
    }

    .m-dropdown.m-dropdown--mobile-full-width.m-dropdown--align-center>.m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-subtitle,.m-dropdown.m-dropdown--mobile-full-width>.m-dropdown__wrapper .m-dropdown__header .m-dropdown__header-subtitle {
        font-size: 1rem
    }
}

.m-dropdown__dropoff {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    display: block;
    z-index: 1099
}

@-webkit-keyframes m-dropdown-fade-in {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@-moz-keyframes m-dropdown-fade-in {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@-o-keyframes m-dropdown-fade-in {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes m-dropdown-fade-in {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@-webkit-keyframes m-dropdown-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-moz-keyframes m-dropdown-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-o-keyframes m-dropdown-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@keyframes m-dropdown-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-webkit-keyframes m-dropdown-arrow-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-moz-keyframes m-dropdown-arrow-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-o-keyframes m-dropdown-arrow-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@keyframes m-dropdown-arrow-move-up {
    from {
        margin-top: 10px
    }

    to {
        margin-top: 0
    }
}

@-webkit-keyframes m-dropdown-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@-moz-keyframes m-dropdown-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@-o-keyframes m-dropdown-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@keyframes m-dropdown-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@-webkit-keyframes m-dropdown-arrow-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@-moz-keyframes m-dropdown-arrow-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@-o-keyframes m-dropdown-arrow-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

@keyframes m-dropdown-arrow-move-down {
    from {
        margin-bottom: 10px
    }

    to {
        margin-bottom: 0
    }
}

.m-dropdown.m-dropdown--arrow .m-dropdown__wrapper {
    padding-top: 10px
}

.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper {
    padding-top: 0;
    padding-bottom: 11px
}

.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow {
    position: absolute;
    line-height: 0;
    display: inline-block;
    overflow: hidden;
    height: 10px;
    width: 40px;
    position: relative;
    left: 50%;
    margin-left: -20px;
    top: auto;
    position: absolute;
    margin-top: 0
}

.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow:before {
    display: inline-block;
    font-family: Metronic;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    line-height: 0;
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    content: ""
}

.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow:before {
    position: relative;
    top: 100%;
    margin-top: 9px;
    font-size: 40px
}

@media screen\0 {
    .m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow:before {
        margin-top: 11px
    }
}

@media screen\0 {
    .m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow {
        margin-top: -1px
    }
}

@supports (-ms-ime-align:auto) {
    .m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__wrapper .m-dropdown__arrow {
        margin-top: -1px
    }
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow {
    position: absolute;
    line-height: 0;
    display: inline-block;
    overflow: hidden;
    height: 11px;
    width: 40px;
    position: relative;
    left: 50%;
    margin-left: -20px;
    top: 0;
    position: absolute
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow:before,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow:before {
    display: inline-block;
    font-family: Metronic;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    line-height: 0;
    text-decoration: inherit;
    text-rendering: optimizeLegibility;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    content: ""
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow:before,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow:before {
    position: relative;
    top: 100%;
    margin-top: 11px;
    font-size: 40px
}

@media screen\0 {
    .m-dropdown.m-dropdown--arrow .m-dropdown__arrow:before,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow:before {
        margin-top: 13px
    }
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow.m-dropdown__arrow--left,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow.m-dropdown__arrow--left {
    left: 15px;
    margin-left: 0
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow.m-dropdown__arrow--right,.m-dropdown.m-dropdown--arrow.m-dropdown--up .m-dropdown__arrow.m-dropdown__arrow--right {
    right: 15px;
    left: auto;
    margin-left: auto
}

.m-dropdown.m-dropdown--skin-dark .m-dropdown__wrapper .m-dropdown__inner {
    background-color: #282a3c;
    box-shadow: 0 0 15px 1px rgba(69,65,78,.4)
}

.m-dropdown.m-dropdown--skin-dark.m-dropdown--arrow .m-dropdown__arrow {
    color: #282a3c
}

.m-dropdown.m-dropdown--skin-dark .m-dropdown__header {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none
}

.m-dropdown.m-dropdown--skin-dark.m-dropdown--header-bg-fill.m-dropdown--arrow .m-dropdown__arrow {
    color: #716aca
}

.m-dropdown.m-dropdown--skin-dark.m-dropdown--header-bg-fill .m-dropdown__header {
    background-color: #716aca
}

.m-dropdown.m-dropdown--skin-dark.m-dropdown--header-bg-fill .m-dropdown__header .m-dropdown__header-title {
    color: #fff
}

.m-dropdown.m-dropdown--skin-dark.m-dropdown--header-bg-fill .m-dropdown__header .m-dropdown__header-subtitle {
    color: #fff
}

.m-dropdown .m-dropdown__wrapper .m-dropdown__inner {
    background-color: #fff;
    box-shadow: 0 0 15px 1px rgba(69,65,78,.2)
}

.m-dropdown.m-dropdown--arrow .m-dropdown__arrow {
    color: #fff
}

.m-dropdown .m-dropdown__header {
    -webkit-box-shadow: 1px 34px 52px -19px rgba(68,62,84,.03);
    -moz-box-shadow: 1px 34px 52px -19px rgba(68,62,84,.03);
    box-shadow: 1px 34px 52px -19px rgba(68,62,84,.03)
}

.m-dropdown.m-dropdown--header-bg-fill.m-dropdown--arrow .m-dropdown__arrow {
    color: transparent
}

.m-dropdown.m-dropdown--header-bg-fill .m-dropdown__header {
    background-color: transparent
}

.m-dropdown.m-dropdown--header-bg-fill .m-dropdown__header .m-dropdown__header-title {
    color: #fff
}

.m-dropdown.m-dropdown--header-bg-fill .m-dropdown__header .m-dropdown__header-subtitle {
    color: #fff
}

@media (min-width: 1920px){
    .m-home__container {
        max-width: 1600px;
        margin: 0 auto;
    }
}
.m-home__container {
    width: 85.3vw;
    margin: 0 auto;
}

select.form-control:not([size]):not([multiple]) {
    height: auto;
}

.img-round{
    border-radius:50%;
    overflow:hidden;
    border:1px solid #ddd;
}

.img-round img{
    object-fit:contain;
    height:100%;
    width:100%;
}

.skeleton-video:empty {
    position: relative;
    height: 290px;
    background-color: #ffffff;
    border-radius: 0px 0px 0px 0px;
    background-image: linear-gradient(#e0e0e0 20px, transparent 0), radial-gradient(circle 17.5px at 17.5px 17.5px, #e0e0e0 16.5px, transparent 17.5px), linear-gradient(#e0e0e0 200px, transparent 0);
    background-repeat: repeat-y;
    background-size: 300px 290px, 35px 290px, 360px 290px;
    background-position: left 70px top 244px, left 20px top 236px, left 20px top 20px;
}
.skeleton-video:empty:before {
    content: " ";
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 290px;
    -webkit-mask-image: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 80%);
    -webkit-mask-repeat: repeat-y;
    -webkit-mask-size: 50px 290px;
    -webkit-mask-position: -20% 0;
    background-image: linear-gradient(rgba(168, 164, 164, 1) 20px, transparent 0), radial-gradient(circle 17.5px at 17.5px 17.5px, rgba(168, 164, 164, 1) 16.5px, transparent 17.5px),
        linear-gradient(rgba(168, 164, 164, 1) 200px, transparent 0);
    background-repeat: repeat-y;
    background-size: 300px 290px, 35px 290px, 360px 290px;
    background-position: left 70px top 244px, left 20px top 236px, left 20px top 20px;
    animation: shine-skeleton-video 2s infinite;
}
@keyframes shine-skeleton-video {
    to {
        -webkit-mask-position: 120% 0;
    }
}
.video-item{text-decoration:none !important;}
.m-categories {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
    gap: 10px;
}
.m-categories_item {
    background-color: #E6E6E6;
    border-radius: 5px;
    padding: 5px 10px;
}

@media (max-width: 574px){
    .m-categories {
        grid-template-columns: repeat(auto-fill, minmax(20vw, 1fr));
    }
}

a{color: var(--text-main-color);}
a:hover{color: var(--root--color-info) !important;}
.m-categories_item a{color: var(--text-main-color);}
.field-validation-error{color:#e10e0e;}
.btn-loading > .fa:before {
    content: "\f110" !important;
    animation: fa-spin 2s infinite linear;
    display: inline-block;
}
.btn-loading {
    background: #ccc !important;
    cursor: auto;
    color: var(--root--color-info) !important;
}
.btn-loading:hover, .btn-loading :active, .btn-loading:hover:not(:disabled) {
    background: var(--root--color-info) !important;
    cursor: auto;
    color: #fff !important;
}

.btn.btn-loading:focus, .btn.btn-loading:hover:not(:disabled) {
    background: var(--root--color-info) !important;
    cursor: auto;
    color: #fff !important;
}

.m-categories {
   /* display: grid;
    grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
    gap: 10px;*/
   display:flex;
   flex-wrap:wrap;
}
.m-categories_item {
    background-color: #E6E6E6;
    border-radius: 5px;
    padding: 5px 10px;
}
@media (max-width: 574px){
    .m-categories {
        grid-template-columns: repeat(auto-fill, minmax(20vw, 1fr));
    }
}