/* cyrillic-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu72xKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu5mxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu7mxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu4WxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu7WxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu7GxKKTU1Kvnz.woff2) format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/calendar/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.rl-box {
    position: relative;
    z-index: 9;
    width: 5.28rem;
    height: 5.28rem;
    margin: 0 auto;
    background: url(../images/s2-rlbg.png) no-repeat center center;
    background-size: cover;
    padding: .8rem;
    padding-bottom: 1rem;
    overflow: hidden;
    border-radius: 50%;
    margin-top: .4rem;
}

.calendar-d::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 1.3rem;
    transform: translateX(-50%);
    width: 100%;
    height: .45rem;
    background-color: rgba(10, 64, 156, 1);
}


.calendar-modal {
    display: none;
    position: absolute;
    background: #fdfdfd;
    border: .01rem solid #e8e8e8;
    box-shadow: .01rem .02rem .03rem #ddd
}

.calendar-inner {
    width: 100% !important;
    position: relative;
    z-index: 1;
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
    -ms-transform: perspective(10rem);
    -moz-transform: perspective(10rem);
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
}

.calendar-views {
    transform-style: preserve-3d;
}

.calendar .view {
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    -webkit-transition: .6s;
    transition: .6s;
}

.calendar-d .view-month,
.calendar-m .view-date {
    transform: rotateY(180deg);
    visibility: hidden;
    z-index: 1;
}

.calendar-d .view-date,
.calendar-m .view-month {
    transform: rotateY(0deg);
    visibility: visible;
    z-index: 2;
}

.calendar-ct,
.calendar-hd,
.calendar-views .week,
.calendar-views .days {
    overflow: hidden;
    position: relative;
}

.calendar-views {
    width: 100%;
}

.calendar .view,
.calendar-display,
.calendar-arrow .prev,
.calendar .date-items li {
    float: left;
    font-family: 'sy';
}

.calendar-display {
    /* width: 100%; */
    text-align: center;
    display: inline;
}

.calendar-arrow .prev {
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translateY(-50%);
    z-index: 9;
}

.calendar-arrow .next {
    position: absolute;
    top: 50%;
    right: 10%;
    transform: translateY(-50%);
    z-index: 9;
}


.calendar-arrow,
.calendar-arrow .next {
    float: right;
}

.calendar-hd {
    padding: .1rem 0;
    height: .5rem;
    line-height: .3rem;
    text-align: center;
    display: flex;
    justify-content: center;
}

.calendar-display {
    font-size: .28rem;
    text-indent: .1rem;
}

.view-month .calendar-hd {
    padding: .1rem;
}

.calendar-arrow,
.calendar-display {
    color: #fff;
}

.calendar li[disabled] {
    color: #bbb;
}

.calendar li.old[disabled],
.calendar li.new[disabled] {
    color: #eee;
}

.calendar-display .m,
.calendar-views .week,
.calendar-views .days .old,
.calendar-views .days .new,
.calendar-display:hover,
.calendar-arrow span:hover {
    color: #fff;
}

.calendar-views .week {
    position: relative;
}

.calendar-views .week li {
    position: relative;
    z-index: 9;
}

.calendar-arrow span,
.calendar-views .days li[data-calendar-day],
.calendar-views .view-month li[data-calendar-month] {
    cursor: pointer;
}

.calendar li[disabled] {
    cursor: not-allowed;
}

.calendar-arrow {
    margin-right: .1rem;
}

.calendar-arrow span {
    font: 500 .26rem sans-serif;
}

.calendar ol li {
    position: relative;
    float: left;
    text-align: center;
    border-radius: 50%;
    font-family: 'sy';
    color: #ffffff;
}

.calendar ol li.new {
    display: none;
}

.calendar .week li,
.calendar .days li {
    width: .4rem;
    height: .4rem;
    line-height: .4rem;
    color: #ffffff;
}

.calendar .month-items li {
    width: .7rem;
    height: .7rem;
    line-height: .7rem;
}

/* .calendar .days li[data-calendar-day]:hover,
.calendar .view-month li[data-calendar-month]:hover {
    background: #eee;
} */



.calendar .calendar-views .selected {
    color: #fff;
}

.calendar .calendar-views .now::before {
    content: "";
    display: block;
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.2rem;
    margin-left: -0.2rem;
    z-index: -1;
    background: #FFB008;
    border-color: transparent;
}

.calendar .calendar-views .selected:before {
    content: "";
    display: block;
    width: .4rem;
    height: .4rem;
    /* background: #CDE9D9 !important; */
    border: 1px solid #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.2rem;
    margin-left: -0.2rem;
    z-index: -1;
}

.calendar .calendar-views .dot {
    position: absolute;
    left: 54%;
    bottom: .04rem;
    margin-left: -0.2rem;
    width: .35rem;
    height: .35rem;
    background: #9b98982e !important;
    border-radius: 50%;
}

.calendar-views .now .dot {
    background: #fff;
}

.calendar .date-items {
    width: 300%;
    margin-left: -100%;
}

.calendar-label {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    padding: .05rem .1rem;
    line-height: .22rem;
    color: #fff;
    background: #000;
    border-radius: .03rem;
    opacity: .7;
    filter: alpha(opacity=70);
}

.calendar-label i {
    display: none;
    position: absolute;
    left: 50%;
    bottom: -0.12rem;
    width: 0;
    height: 0;
    margin-left: -0.03rem;
    border: .06rem solid transparent;
    border-top-color: #000;
}