@font-face {
    font-family: 'd-Alternate';
    src: url('../../css/fonts/Alternate.ttf');
}
.font-alternate {
    font-family: d-Alternate;
}
.img-box {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.img-hover-box img {
    transition: all .6s;
}
.img-hover-box:hover img {
    transform: scale(1.2);
}
.flex-start {
    display: flex;
    align-items: center;
}
.flex-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}
.items-base {
    align-items: baseline!important;
}
.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.flex-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.align-items-normal {
    align-items: normal;
}
.transition-2 {
    transition: all .2s ease-out;
}
.transition-3 {
    transition: all .3s ease-out;
}
.transition-5 {
    transition: all .5s ease-out;
}
.relative {
    position: relative;
}
.absolute {
    position: absolute;
}

.font-12 {
    font-size: 12px;
}
.font-14 {
    font-size: 14px;
}
.font-16 {
    font-size: 16px;
}
.font-18 {
    font-size: 18px;
}
.font-20 {
    font-size: 20px;
}
.font-22 {
    font-size: 22px;
}
.font-24 {
    font-size: 24px;
}
.font-28 {
    font-size: 28px;
}
.font-32 {
    font-size: 32px;
}
.font-34 {
    font-size: 34px;
}
.font-40 {
    font-size: 40px;
}
.font-bold {
    font-weight: bold;
}
.font-400 {
    font-weight: 400;
}
.font-500 {
    font-weight: 500;
}
.font-normal {
    font-weight: normal;
}
.w-h-100 {
    width: 100%;
    height: 100%;
}
.w-20 {
    width: 20%;
}
.w-30 {
    width: 30%;
}
.w-40 {
    width: 40%;
}
.w-50 {
    width: 50%;
}
.w-60 {
    width: 60%;
}
.w-70 {
    width: 70%;
}
.w-100 {
    width: 100%;
}
.h-50 {
    height: 50%;
}
.h-100 {
    height: 100%;
}
.h-fix-24 {
    height: 24px;
}
.margin-r-5 {
    margin-right: 5px;
}
.margin-t-5 {
    margin-top: 5px;
}
.margin-t-10 {
    margin-top: 10px;
}
.margin-t-16 {
    margin-top: 16px;
}
.margin-t-18 {
    margin-top: 18px;
}
.margin-t-20 {
    margin-top: 20px;
}
.margin-t-25 {
    margin-top: 25px;
}
.margin-t-40 {
    margin-top: 40px;
}
.margin-t-60 {
    margin-top: 60px;
}
.margin-l-5 {
    margin-left: 5px;
}
.margin-l-8 {
    margin-left: 8px;
}
.margin-r-3 {
    margin-right: 3px;
}
.margin-r-8 {
    margin-right: 8px;
}
.margin-r-10 {
    margin-right: 10px;
}
.margin-r-16 {
    margin-right: 16px;
}
.margin-r-20 {
    margin-right: 20px;
}
.margin-r-24 {
    margin-right: 24px;
}
.margin-r-40 {
    margin-right: 40px;
}
.margin-l-10 {
    margin-left: 10px;
}
.margin-l-20 {
    margin-left: 20px;
}
.margin-l-24 {
    margin-left: 24px;
}
.margin-b-3 {
    margin-bottom: 3px;
}
.margin-b-5 {
    margin-bottom: 5px;
}
.margin-b-8 {
    margin-bottom: 8px;
}
.margin-b-10 {
    margin-bottom: 10px;
}
.margin-b-16 {
    margin-bottom: 16px;
}
.margin-b-20 {
    margin-bottom: 20px;
}
.margin-b-25 {
    margin-bottom: 25px;
}
.margin-b-30 {
    margin-bottom: 30px;
}
.margin-5 {
    margin: 5px;
}
.margin-8 {
    margin: 8px;
}
.margin-10 {
    margin: 10px;
}
.margin-16 {
    margin: 16px;
}
.margin-20 {
    margin: 20px;
}
.padding-4 {
    padding: 4px;
}
.padding-5 {
    padding: 5px;
}
.padding-6 {
    padding: 6px;
}
.padding-8 {
    padding: 8px;
}
.padding-10 {
    padding: 10px;
}
.padding-16 {
    padding: 16px;
}
.padding-20 {
    padding: 20px;
}
.padding-24 {
    padding: 24px;
}
.gap-8 {
    gap: 8px;
}
.gap-10 {
    gap: 10px;
}
.gap-16 {
    gap: 16px;
}
.gap-20 {
    gap: 20px;
}
.shrink-0 {
    flex-shrink: 0;
}
.shrink-1 {
    flex-shrink: 1;
}
.grow-0 {
    flex-grow: 0;
}
.grow-1 {
    flex-grow: 1;
}
.z-index-0 {
    z-index: 0;
}
.z-index-1 {
    z-index: -1;
}
.shadow-0 {
    box-shadow: 0 0 20px 0 rgba(0, 21, 46, 0.05);
}
.shadow-1 {
    box-shadow: 0 4px 24px 0 rgba(0, 159, 255, 0.12);
}
.radius-50 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.radius-2 {
    border-radius: 2px;
}
.radius-4 {
    border-radius: 4px;
}
.radius-6 {
    border-radius: 6px;
}
.radius-8 {
    border-radius: 8px;
}
.radius-10 {
    border-radius: 10px;
}
.over-hide {
    overflow: hidden;
}
.over-ellipse {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.over-y-auto {
    overflow-y: auto;
}
.cursor-p {
    cursor: pointer;
}
.hover-shadow:hover {
    box-shadow: 2px 2px 12px 0 rgba(0, 0, 0, 0.2);
}
.color-danger {
    color: #FF0000;
}
.bg-danger {
    background: #FF0000;
}
.color-white-0 {
    color: #ffffff;
}
.bg-white-0 {
    background: #ffffff;
}
.color-blue-0 {
    color: #009FFF;
}
.bg-blue-0 {
    background: #009FFF;
}
.color-blue-1 {
    color: #D5E2FE;
}
.color-blue-2 {
    color: #c6e7fc;
}
.color-blue-3 {
    color: #0086f6;
}
.color-blue-4 {
    color: #095dc4;
}
.bg-blue-1 {
    background: #D5E2FE;
}
.bg-blue-2 {
    background: #c6e7fc;
}
.bg-blue-2 {
    background: #4A7DFF;
}
.color-black-0 {
    color: #484848;
}
.bg-black-0 {
    background: #484848;
}
.color-black-1 {
    color: #4E4E4E;
}
.bg-black-1 {
    background: #4E4E4E;
}
.color-black-2 {
    color: #2D2D2D;
}
.bg-black-2 {
    background: #2D2D2D;
}
.color-black-3 {
    color: #202020;
}
.bg-black-3 {
    background: #202020;
}
.color-gray-0 {
    color: #E8E8E8;
}
.bg-gray-0 {
    background: #E8E8E8;
}
.color-gray-1 {
    color: #696969;
}
.bg-gray-1 {
    background: #696969;
}
.color-gray-2 {
    color: #B4C1CA;
}
.bg-gray-2 {
    background: #B4C1CA;
}
.color-gray-3 {
    color: #F0F3F8;
}
.bg-gray-3 {
    background: #F0F3F8;
}
.color-yellow-0 {
    color: #FFAE00;
}
.bg-yellow-0 {
    background: #FFAE00;
}
.color-purple-0 {
    color: #C78EEC;
}
.bg-purple-0 {
    background: #C78EEC;
}
.color-pink-0 {
    color: #FF9696;
}
.bg-pink-0 {
    background: #FF9696;
}
.color-green-0 {
    color: #1CD803;
}
.bg-green-0 {
    background: #1CD803;
}