@charset "utf-8";

/* ==========================================================================
    BUTTON
   ========================================================================== */
.button01 {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--point-color01);
    width: 100%;
    height: 60px;
    font-size: 16px;
    font-weight: bold;
    color: var(--point-color01);
    padding: 0 20px;
    border-radius: 4px;
    transition: .2s ease-in-out;
    & span{padding-left: 27px; background: url('/assets/site/img/common/ico_mail01.png') no-repeat 0 center / 20px auto;}
    &:hover{color: var(--bg-color); background-color: var(--point-color01);}
    &.c01{color: var(--bg-color); background-color: var(--point-color01);}
    &.c02{color: var(--point-color01); border-color: var(--basic-color); background-color: var(--basic-color);}
    &.r01{color: var(--basic-color); border-color: var(--basic-color); border-radius: 30px; }
    &.r01:hover,
    &.r02{color: var(--point-color01); border-color: var(--basic-color); background-color: var(--basic-color); border-radius: 30px; }
}

.button02 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--point-color01);
    width: 120px;
    height: 50px;
    font-size: 16px;
    font-weight: bold;
    color: var(--point-color01);
    background-color: transparent;
    border-radius: 25px;
    text-transform: uppercase;
    &:hover{color: #fff; border-color: var(--point-color01); background-color: var(--point-color01);}
    &.c01,
    &.arr01{color: var(--point-color01); border-color: var(--basic-color); background-color: var(--basic-color);}
    &.arr01 span{padding-right: 14px; background: url('/assets/site/img/common/arr03.png') no-repeat right center / 7px auto;}
    &.s01{height: 60px; border-radius: 30px;}
    &.c02{color: var(--basic-color); border-color: var(--form-border);}
    &.c02:hover{border-color: var(--point-color01);}

}
.button03 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dedede;
    min-width: 110px;
    height: 48px;
    font-size: 16px;
    font-weight: bold;
    color: #777;
    padding: 0 20px;
    border-radius: 4px;
    transition: .2s ease-in-out;
    & span{color: var(--point-color01)}
    &:hover{color: #fff; border-color: #222; background-color: var(--basic-color);}
    &:hover span{color: #fff}
    @media (width <= 1023px) {
        min-width: 96px;
        height: 42px;
        font-size: 15px;
    }
    @media (width <= 767px) {
        min-width: 80px;
        height: 38px;
    }
}

.button04 {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 110px;
    width: 100%;
    height: 53px;
    font-size: 16px;
    font-weight: bold;
    color: #999;
    padding: 0 14px;
    border: 1px solid #ececec;
    border-radius: 2px;
    background-color: #fff;
    @media (width <= 1023px) {

    }
    @media (width <= 767px) {

    }
}

.form-btngroup-center{display: flex; justify-content: center;}
.form-btngroup-center > a,
.form-btngroup-center > button{margin: 0 4px;}

/* ==========================================================================
   COLOR
   ========================================================================== */
.cp01{color: var(--point-color01) !important;}
.cp02{color: var(--point-color02) !important;}
.cp0201{color: var(--point-color0201) !important;}
.cp03{color: var(--point-color03) !important;}

/* ==========================================================================
   FORM
   ========================================================================== */
.form-ip{display: block; width: 100%; height: var(--input-height); border: 1px solid var(--form-border); padding: 0 0 0 var(--form-padding); font-size: var(--form-fontsize); color: var(--form-fontcolor); line-height: var(--form-lineheight); background-color: transparent; border-radius: var(--radius01);}
.form-ip.vl-c{text-align: center; padding: 0 var(--form-padding);}
.form-ip.vl-r{text-align: right; padding: 0 var(--form-padding) 0 0;}
.form-ip:focus{border-color: var(--form-focus);}
select.form-ip{background-image: url('/assets/site/img/common/arr_select01.png'); background-repeat: no-repeat; background-position: calc(100% - 20px) center; background-size: 14px auto;}
select.form-ip option{font-weight: bold; }
.form-ip::-webkit-input-placeholder,
.form-ip:required:invalid{color: var(--form-placeholder);} /*placeholer*/
.form-ip01[type="date"],
.form-ip01[type="time"]{opacity: 0; position: relative; line-height: calc(var(--input-height) - 4px); text-align: left; z-index: 2; caret-color: transparent;}
.form-ip01[type="date"].has-value,
.form-ip01[type="time"]{opacity: 1; caret-color: auto;}
.form-ip01[type="date"]::-webkit-calendar-picker-indicator,
.form-ip01[type="time"]::-webkit-calendar-picker-indicator {width: 120px; height: 30px; background: none; z-index: 1;appearance: none; -webkit-appearance: none;}
textarea.form-ip{height: var(--textarea-height); padding: var(--form-padding1);}
textarea.form-ip:focus{border-color: var(--form-focus)}
textarea.term-box{height: 144px; font-size: 14px; font-weight: 300; color: #999; line-height: 22px;}
.form-gray{border: 1px solid var(--form-gray); background-color: var(--form-gray)}
.form-ip01 {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0;
    border: 0;
    font-size: 18px;
    font-weight: bold;
    background-color: transparent;
    border-radius: 0;
    &::-webkit-input-placeholder,
    &:required:invalid,
    &.select-placeholder{color: #bbb;}
    select&{background-image: url('/assets/site/img/common/arr07.png'); background-repeat: no-repeat; background-position: calc(100% - 10px) center; background-size: 10px auto;}
    select& option{font-weight: bold;}
    /*select& option{font-weight: bold; color: #fff; background-color: var(--form-basic);}*/
}

/*Select group - Checkbox, Radio*/
.form-chk01 {
    & input[type="radio"],
    & input[type="checkbox"]{appearance: none; width: 20px; height: 20px; border: 2px solid var(--form-border); background-color: #fff;}
    & input[type="radio"],
    & input[type="checkbox"]{border-radius: 50%;}
    & input[type="radio"],
    & input[type="checkbox"]{display: flex; justify-content: center; align-items: center;}
    & input[type="radio"]:checked::after,
    & input[type="checkbox"]:checked::after{content: ""; display: block; width: 10px; height: 10px; background-color: var(--point-color01); border-radius: 50%;}
    & label{font-size: 15px; line-height: 28px; padding-left: 6px;}
}
.form-chk02 {
    display: flex;
    align-items: center;
    & .chk-item{appearance: none; width: 18px; height: 18px; border: 1px solid var(--form-border);  background-color: var(--bg-color); background-repeat: no-repeat; background-position: center; background-size: 11px auto; border-radius: 4px; margin-top: 0;}
    & .chk-item:checked{border-color: var(--form-chk); background-color: var(--form-chk); background-image: url('/assets/site/img/common/ico_check01.png');}
    & .chk-label{font-size: 14px; color: #333; padding-left: 12px; user-select: none}
}
.form-chk03 {
    display: flex;
    align-items: center;
    & .chk-item{appearance: none; width: 20px; height: 20px; border: 1px solid var(--form-border); background-color: var(--bg-color); background-repeat: no-repeat; background-position: center; background-size: 11px auto; border-radius: 2px; margin-top: 0;}
    & .chk-item:checked{border-color: var(--point-color01); background-color: var(--point-color01); background-image: url('/assets/site/img/common/ico_check01.png');}
    & .chk-label{font-size: 14px; padding-left: 9px; user-select: none}
}
.form-chk04 {
    display: flex;
    & .chk-item{appearance: none; position: relative; top: 1px; width: 18px; height: 18px; border: 1px solid var(--form-border); background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: 11px auto; border-radius: 2px; margin-top: 0;}
    & .chk-item:checked{border-color: var(--point-color01); background-color: var(--point-color01); background-image: url('/assets/site/img/common/ico_check01.png');}
    & .chk-label{flex: 1; font-size: 12px; color: #888; line-height: 20px; padding-left: 9px; word-break: keep-all; user-select: none}
}

.form-btn01 {
    & .form-check-input{display: none;}
    & .form-check-label{display: flex; justify-content: center; align-items: center; width: 106px; height: 50px; border: 1px solid #f0ede7; border-radius: 25px; font-size: 15px;}
    & .form-check-input:checked + .form-check-label{font-weight: bold; color: #fff; border-color: var(--point-color01); background-color: var(--point-color01);}
    &.sm01{
        & .form-check-label{width: auto; min-width: 65px; height: 38px; padding: 0 19px; border-radius: 19px; line-height: 20px;}
    }
    @media (width <= 1024px) {
        & .form-check-label{height: 46px; border-radius: 23px;}
    }
}
.chk-btn01{
    gap: 8px;
    padding: 7px;
    background-color: #fff;
    border-radius: 28px;
    box-shadow: 5px 5px 10px 3px rgba(0,0,0,.05);
    & .form-chk01{display: block}
    & .form-check-input{display: none}
    & .form-check-label{display: flex; justify-content: center; align-items: center; height: 42px; font-size: 15px; font-weight: bold; color: #999; text-align: center; background-color: #f3f3f3; border-radius: 21px;}
    & .form-check-input:checked + .form-check-label{color: #fff; background-color: var(--point-color01);}
}
.chk-btn02 {
    & .form-check-input{display: none;}
    & .form-check-label{display: flex; justify-content: space-between; align-items: center; gap: 14px; font-size: 15px;}
    & .label-text {flex: 1;}
    & .form-check-label::after{content: ""; width: 22px; height: 22px; border: 1px solid #dedbd6; border-radius: 50%; background: #fff url('/assets/site/img/common/ico_plus01.png') no-repeat center / 9px auto;}
    & .form-check-input:checked + .form-check-label::after{border-color: var(--basic-color); background: var(--basic-color) url('/assets/site/img/common/ico_check0101.png') no-repeat center / 11px auto;}
}

.select-group01 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    & .chk-item{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
    & .chk-label{display: flex; justify-content: center; align-items: center; height: 62px; padding: 0 17px; border: 1px solid var(--form-border); font-size: 15px; font-weight: bold; color: #222; cursor:pointer; user-select: none; border-radius: 31px;}
    & .form-ip{max-width: 150px; height: 40px; padding: 0 0 0 12px; margin-left: 15px;}
    & .chk-item:checked + .chk-label{border-color: #222; background: #fff;}
}
.select-group02 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 26px;
    width: 100%;
    .form-chk01{display: flex; align-items: center;}
    .form-chk01 label{padding-left: 7px; font-size: 14px;}
}

.anti-spam {
    display: flex;
    > img{width: var(--input-buttonw); height: var(--input-height); border-radius: 0 4px 4px 0}
    > .form-ip{flex: 1;}

}
.attachment {
    display: flex;
    gap: 8px;
    > .form-ip{flex: 1; height: 41px; font-size: 14px; padding: 0 0 0 12px; background-color: #fdfbf8; border-radius: 4px;}
    .btn-file{position: relative; display: flex; justify-content: center; align-items: center; width: 70px; background: #666; border-radius: 4px;}
    .btn-file > input{position: absolute; width: 0; height: 0; overflow: hidden; padding: 0; border: 0}
    .btn-file span{font-size: 13px; color: #fffbf3;}
}
/*업로드 이미지*/
.upload-file01 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    .upload-item{position: relative;}
    .upload-box{width: 100%; aspect-ratio: 1 / 1; border: 1px solid #e5e1da; border-radius: 4px; overflow: hidden;}
    .thumb-preview{display: block; width: 100%; height: 100%; background: url('/assets/site/img/common/ico_photo01.png') no-repeat center / 22px auto;}
    .btn-del{position: absolute; top: 7px; right: 7px; display: block; width: 17px; aspect-ratio: 1 / 1; background: url('/assets/site/img/common/ico_x02.png') no-repeat center / 100% auto;}
}

/*게시판 상단*/
.searchbar01 {
    display: flex;
    gap: 4px;
    width: 100%;
    max-width: 450px;
    height: 44px;
    overflow: hidden;
    & input[type="text"]{flex: 1; height: inherit; font-size: 17px; font-weight: bold; padding-left: 17px;}
    & button{width: 68px; font-weight: bold; color: #fff; background: #222;}
}
/*장소 선택, 다이어리*/
.searchbar02 {
    display: flex;
    width: 100%;
    height: 60px;
    padding: 9px 9px 9px 24px;
    background-color: #f9f7f1;
    border-radius: 30px;
    overflow: hidden;
   & input[type="text"]{flex: 1; height: auto; font-size: 16px; font-weight: bold; padding-left: 30px; border:0; background: #f9f7f1 url('/assets/site/img/common/ico_glass01.png') no-repeat 0 center / 20px auto;}
   & input[type="text"]::-webkit-input-placeholder{color:#c5c3bf}
   & .btn-search{display: flex; justify-content: center; align-items: center; width: 120px; font-family: "jaf-domus-titling-web", sans-serif; font-size: 15px; font-weight: bold; color: #222; letter-spacing: 0; border:0; background: #fff; border-radius: 21px; text-transform: uppercase; box-shadow: 3px 3px 5px 3px rgba(0,0,0,.08);}
    & .btn-search:focus{box-shadow: 3px 3px 5px 3px rgba(0,0,0,.08) !important;}
}
.searchbar03 {
    display: flex;
    gap: 12px;
    width: 100%;
    height: 58px;
    & input[type="text"]{flex: 1; height: auto; font-size: 18px; font-weight: bold; padding-left: 28px; border:0; background: #fff; border-radius: 29px;}
    & input[type="text"]::-webkit-input-placeholder{color: rgba(34,34,34,.3);}
    & button{width: 160px; font-size: 16px; font-weight: bold; color: var(--point-color01); background: var(--basic-color); border-radius: 29px;}
}
.searchbar04 {
    display: flex;
    width: 100%;
    height: 44px;
    padding-left: 18px;
    border: 2px solid #000;
    border-radius: 22px;
    overflow: hidden;
    & input[type="text"]{flex: 1; height: auto; font-size: 15px; font-weight: bold; line-height: 22px; padding-left: 0; border:0; background-color: transparent;}
    & input[type="text"]::-webkit-input-placeholder{color:#c5c3bf}
    & .btn-search{display: flex; justify-content: center; align-items: center; width: 54px; font-size: 0;  border:0; background: url('../img/common/ico_glass01.png') no-repeat center / 18px auto; box-shadow: none;}
}


/* ==========================================================================
    TABS
    ========================================================================== */

/* ==========================================================================
    REQUEST
    ========================================================================== */
.request{
    position: relative;
    font-size: var(--form-fontsize);
    font-weight: 400;
    color: var(--form-fontcolor);
    & fieldset{padding: 0}
    /*&::before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background-color: #222;}*/
    & .dot::after{content: ""; position: absolute; top: 10px; right: 10px; display: block; width: 7px; height: 7px; background-color: var(--form-dot); border-radius: 50%; vertical-align: text-top; margin-left: 6px;}
    & .form-ip{border-color: #fff; background-color: #fff;}
    & .wrap-form{position: relative; display: flex; flex-direction: column; gap: var(--input-gap);}
    & .wrap-form > li{display: flex; flex-wrap: wrap; gap: var(--input-gap);}
    & .wrap-form > li.chk-btn01{gap: 8px;}
    & .wrap-form .form-item{position: relative}
    & .wrap-form .form-item.inactive .form-ip{border-color: #e8e8e8; background-color: #e8e8e8}
    & .wrap-form .form-item{position: relative; flex: 1;}
    & .wrap-form .form-item.col-small{flex: 0 1 calc(25% - 11px)}
    & .form-chk01 .btn-term .dot::after{top: -3px; right: -15px}
    & .chk-container{justify-content: space-between; padding: 14px; border-bottom: 1px solid rgba(255,255,255,.2);}
    & .chk-container .form-item{flex: 0 1 auto;}
    & .chk-container01{
        margin-top: 23px;
        & .tit-cate{font-size: 17px; font-weight: bold; color: #222; line-height: 1.3; margin-bottom: 22px;}
        & .chk-group > li{margin-bottom: 10px;}
        & .chk-group > li:last-child{margin-bottom: 0}
        & .form-check-label{font-size: 14px;}
    }
    & .refer1{font-size: 13px; color: #999; margin-top: 12px; }
    & .terms{display: flex; justify-content: space-between; align-items: center; margin-top: 20px}
    & .separate{width: 100%; height: 1px; background-color: #dedede;}
    & .sep01{margin: 27px 0 12px;}
    & .sep02{margin: 20px 0 0;}
    & .btn-container{display: flex; padding-top: 20px; border-top: 1px solid #dedede; margin-top: 20px;}
    & .btn-container button{height: var(--input-height)}
    @media (width <=1200px) {
        & .chk-btn01 .form-check-label{font-size: 14px;}
    }

    @media (width <=1200px) {
        & .wrap-form > li.chk-btn01{justify-content: flex-start; gap: 10px}
        & .wrap-form .chk-btn01{padding: 0; background-color: transparent; box-shadow: none}
        & .wrap-form .chk-btn01 .form-item{flex: 0 1 auto}
        & .chk-btn01 .form-check-label{min-width: 100px; padding: 0 24px; background-color: #fff}
    }

    @media (width <=1023px) {
        & .chk-container01 .tit-cate {font-size: 16px}
    }

    @media (width <= 767px) {
        /*& .wrap-form{padding: 15px 0 0;}*/
        /*& .wrap-form .form-item{flex: 1 1 100%; padding: 10px 0;}*/
        & .wrap-form .form-item{flex: 1 1 100%;}
        & .wrap-form > li.chk-btn01{justify-content: center}
        & .wrap-form > li.chk-container01{gap: 20px 0}
        & .wrap-form > li.chk-container{justify-content: flex-start; gap: 18px; padding: 14px 0;}
        & .chk-btn01 .form-check-label{min-width: 90px;}
        & .chk-container .form-item{flex: 0 1 auto;}
        & .chk-container01 .chk-group{display: flex; flex-wrap: wrap; gap: 8px 14px}
        & .wrap-form .form-item.col-small{flex: 1}
        & .sep01{margin: 12px 0 15px}
        & .attachment > label span{font-size: 14px}
        & .refer1{font-size: 12px;}
        & .terms{flex-direction: column-reverse; align-items: flex-start; gap: 30px; margin-top: 12px; }
        & .terms .form-chk01{width: 100%}
        & .terms .form-chk01:last-child{justify-content: flex-end;}
    }
}
/* ==========================================================================
   PAGING
   ========================================================================== */

/* ==========================================================================
   Slider & PLUG-IN
   ========================================================================== */
.marquee-slider .swiper-wrapper {
    position: relative;
    -webkit-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
    & .item-marquee{width: auto; /*position: relative; overflow: hidden;*/}
    & .item-marquee .logo{display: block; text-align: center; pointer-events: none; cursor: default;}
    & .item-marquee .logo img{max-width: 300px; width: 100%;}
}

.round-prevnext{
    & .swiper-button-prev,
    & .swiper-button-next{width: 48px; height: 48px; border: 1px solid #ddd; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: 16px auto; border-radius: 50%; opacity: 1; transition:ease-in-out .2s; margin-top: 0;}
    & .swiper-button-prev{left: auto; right: 60px; background-image:url('/assets/site/img/common/arr0205.png');}
    & .swiper-button-next{right: 0; background-image:url('/assets/site/img/common/arr0206.png');}
    & .swiper-button-prev:hover,
    & .swiper-button-next:hover{border-color: var(--point-color01); background-color: var(--point-color01);}
    & .swiper-button-prev:hover{background-image:url('/assets/site/img/common/arr0201.png');}
    & .swiper-button-next:hover{background-image:url('/assets/site/img/common/arr0202.png');}
    & .swiper-button-prev.swiper-button-disabled,
    & .swiper-button-next.swiper-button-disabled{opacity: .3;}
}


/* ==========================================================================
   ELEMENT 
   ========================================================================== */
.table01 {
    overflow-x: auto;
    /*white-space: nowrap;*/
    & table{width: 100%; min-width: 360px; table-layout: fixed; border-collapse: separate;}
    & th,
    & td{height: 37px; padding: 7px 14px; font-size: 14px; line-height: 22px; text-align: center; border: 1px solid #e0ddd7; border-top: 0; border-right: 0; word-break: break-all; vertical-align: middle;}
    & th{background-color: #f9f5ec;}
    & td{color: #666;}
    & tr:last-child th{border-top: 1px solid #e0ddd7;}
    & th:last-child:not(.tit-bar),
    & td:last-child{border-right: 1px solid #e0ddd7;}
    @media (width <= 1023px) {
    }
}

.table02 {
    overflow-x: auto;
    /*white-space: nowrap;*/
    & table{width: 100%; min-width: 500px; table-layout: fixed; border-collapse: separate;}
    & th,
    & td{font-size: 15px; line-height: 24px; border: 1px solid #ebebeb; border-top: 0; border-right: 0; vertical-align: middle;}
    & th{height: 52px; font-size: 16px; color: #ddd; text-align: center; border: 0; background-color: #666; text-transform: capitalize}
    & td{padding: 19px 22px; color: #666;}
    & td:last-child{border-right: 1px solid #e0e0e0;}
    & .t-item{font-family: 'Roboto', sans-serif; font-size: 17px; font-weight: bold; color: #222; text-align: center; background-color: #f9f9f9}
    & .list-type01 > li{padding-left: 14px; text-indent: -14px;}
    &.w01 .w0101{width: 27%}
    @media (width <= 1023px) {

    }
}


/* ==========================================================================
   ANIMATION
   ========================================================================== */
.scroll-bounce .stick{position: relative; display: inline-block; width: 1px; height: 37px; background-color: rgba(255,255,255,.2); overflow: hidden;}
.scroll-bounce .stick .bar{position: absolute; top: 10%; width: 100%; background-color: rgba(255,255,255,1); animation: scoll-stick-bar .9s linear infinite alternate}

@keyframes move01 {
    from {transform: scale(1)}
    to {transform: scale(1.15)}
}
@keyframes move02 {
    from {transform: scale(1.15)}
    to {transform: scale(1)}
}

@keyframes scoll-stick-bar {  
    from {top: 0; height: 9px; opacity: .8;}  
    to {top: 24px; height: 15px; opacity: 1;}
}

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

@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

@keyframes fadeUp {  
	from {opacity: 0; transform: translate(0, 20%);}
    to {opacity: 1; transform: translate(0, 0);}
}


@keyframes bounce01 {
    from {translate: 0 2px; opacity: .8;}
    to {translate: 0 -2px; opacity: 1;}
}

@keyframes flash01 {
    0% { background: rgba(0, 0, 0, 0);}
    50% { background: rgba(0, 0, 0, .8); opacity: .8}
    100% { background: rgba(0, 0, 0, 0);  visibility: hidden;}
}

/*LOADER*/
#loader{position: fixed; top: 0; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background-color: var(--bg-color); z-index: 10000; visibility: visible; opacity: 1; transition: .3s ease-in-out;}
#loader.load{visibility: hidden; opacity: 0;}
.lds-ellipsis{display: inline-block; position: relative; width: 80px; height: 80px;}
.lds-ellipsis div{position: absolute; top: 33px; width: 13px; height: 13px; border-radius: 50%; background: var(--point-color01); animation-timing-function: cubic-bezier(0, 1, 1, 0);}
.lds-ellipsis div:nth-child(1){left: 8px; animation: lds-ellipsis1 0.6s infinite;}
.lds-ellipsis div:nth-child(2){left: 8px; animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(3){left: 32px; animation: lds-ellipsis2 0.6s infinite;}
.lds-ellipsis div:nth-child(4){left: 56px; animation: lds-ellipsis3 0.6s infinite;}

@keyframes lds-ellipsis1 {
    0% {transform: scale(0);}
    100% {transform: scale(1);}
}

@keyframes lds-ellipsis3 {
    0% {transform: scale(1);}
    100% {transform: scale(0);}
}

@keyframes lds-ellipsis2 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(24px, 0);}
}

/* ==========================================================================
    EN
   ========================================================================== */