@charset "UTF-8";

/* CSS Document */
/* btn ----------------------------*/
/* ---------------------------------------------------------
btn共通
--------------------------------------------------------- */
.btnarea {
    display: flex;
    gap: 20px;
}

.btnarea.btn-center {
    justify-content: center;
}

.btnarea.btn-right {
    justify-content: flex-end;
}

/* btn ----------------- */
.btn {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    transition: all ease 0.28s;
}

/* ボタン内容 */
.btn-cont {
    display: flex;
    align-items: center;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 35px;
    padding-right: 30px;
    line-height: 1.4;
    height: 100%;
}

/* ボタン03 */
.btn.btn-style02 {
    border: 1px solid #fff;
    border-radius: 9999px;
    transition: all ease 0.35s;
}

.arrow03 {
    width: 30px;
    height: 1px;
    position: absolute;
    top: 50%;
    right: 30px;
    transition: right ease 0.28s;
}

.arrow03::before,
.arrow03::after {
    content: "";
    height: 1px;
    background-color: #fff;
    position: absolute;
    right: 0;
}

.arrow03::before {
    width: 100%;
}

.arrow03::after {
    width: 10px;
    transform: rotate(45deg);
    transform-origin: right bottom;
}

.btn-arrow03 .btn-txt {
    color: #fff;
}

@media (min-width: 768px) {
    .btn.btn-style02:hover {
        background: rgba(255,255,255,0.1);
    }
}

/* ---------------------------------------------------------
 option
--------------------------------------------------------- */
/* ボタンの幅：デザイン案に合わせて編集 */
.btnW-s {
    max-width: 200px;
}

.btnW-s {
    max-width: 250px;
}

.btnW-m {
    max-width: 300px;
}

.btnW-l {
    max-width: 600px;
}

@media (max-width: 480px) {

    .btnW-s,
    .btnW-m,
    .btnW-l {
        max-width: none;
    }
}

/* ボタンの高さ：デザイン案に合わせて編集 */
.btnH-s {
    min-height: 60px;
}

.btnH-m {
    min-height: 70px;
}

.btnH-l {
    min-height: 130px;
}

@media (max-width: 480px) {
    .btnH-m {
        min-height: 60px;
    }
}

/* ---------------------------------------------------------
clip-path
--------------------------------------------------------- */
/* 左上 */
.clip-lt {
    clip-path: polygon(50px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 50px);
}

/* 右上 */
.clip-rt {
    clip-path: polygon(0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 0% 100%);
}

/* 左下 */
.clip-lb {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50px 100%, 0% calc(100% - 50px));
}

/* 右下 */
.clip-rb {
    clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% - 50px), calc(100% - 50px) 100%, 0% 100%);
}

@media (max-width: 480px) {

    /* 左上 */
    .clip-lt {
        clip-path: polygon(25px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 25px);
    }

    /* 右上 */
    .clip-rt {
        clip-path: polygon(0% 0%, calc(100% - 25px) 0%, 100% 25px, 100% 100%, 0% 100%);
    }

    /* 左下 */
    .clip-lb {
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 25px 100%, 0% calc(100% - 25px));
    }

    /* 右下 */
    .clip-rb {
        clip-path: polygon(0% 0%, 100% 0%, 100% calc(100% - 25px), calc(100% - 25px) 100%, 0% 100%);
    }
}

/* ---------------------------------------------------------
パターン背景
--------------------------------------------------------- */
.bg-dgray {
    background-image: url(../img/common/bg-dgray.jpg);
    background-size: 400px 400px;
    background-repeat: repeat;
}

.bg-gara-20 {
    background-image: url(../img/common/bg-gara-20.png);
    background-size: 400px 400px;
    background-repeat: repeat;
}

.bg-lgray_photogallery {
    background-image: url(../img/common/bg-lgray_photogallery.jpg);
    background-size: 400px 400px;
    background-repeat: repeat;
}

.bg-dgray_reserve {
    background-image: url(../img/common/bg-dgray_reserve.jpg);
    background-size: 400px 400px;
    background-repeat: repeat;
}

/* ---------------------------------------------------------
透明度
--------------------------------------------------------- */
.op-8 {
    opacity: 0.8;
}

.op-5 {
    opacity: 0.5;
}

.op-3 {
    opacity: 0.3;
}

.op-25 {
    opacity: 0.25;
}


/*------------------------------------------
layout-style
------------------------------------------*/
/* 右余白無し */
.wrap.box-ml-auto {
    width: 95%;
    margin-left: auto;
    margin-right: 0;
}

/* 左余白無し */
.wrap.box-mr-auto {
    width: 95%;
    margin-right: auto;
    margin-left: 0;
}

.cont-inr {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(40px, 5vw, 100px);
    align-items: center;
}

@media (max-width: 767px) {
    .wrap.box-ml-auto.sp-mr-auto {
        width: 90%;
        margin-right: 5%;
    }
}

/* ---------------------------------------------------------
btn-style
--------------------------------------------------------- */
/* btn-reserve */
.btn.btn-reserve {
    border: 1px solid #fff;
    /* 枠線の設定 */
    border-radius: 9999px;
    /*background-color: #ff9600; 		 背景色 */
    color: #fff;
    /* 文字色 */
    transition: all ease 0.35s;
}

.fixed-menus .btn.btn-reserve {
    width: 200px;
}

@media (min-width: 768px) {
    .btn.btn-style01:hover {

        /* 背景色 */
    }

    .btn.btn-reserve:hover,
    .btn.btn-style02:hover,
    .btn.btn-primary:hover {
        background-color: rgba(255, 255, 255, 0.1);
    }
}

/* btn-mail */
.btn.btn-mail {
    border: 1px solid #333;
    /* 枠線の設定 */
    background-color: #333;
    /* 背景色 */
    color: #fff;
    /* 文字色 */
}

@media (min-width: 768px) {
    .btn.btn-mail:hover {
        border: 1px solid #333;
        /* 枠線の設定 */
        background-color: #fff;
        /* 背景色 */
        color: #333;
        /* 文字色 */
    }
}

/* btn-primary */
.btn.btn-primary {
    border: 1px solid #fff;
    /* 枠線の設定 */
    /*background-color: #fff;			 背景色 */
    color: #fff;
    /* 文字色 */
    border-radius: 9999px;
}

.btn.btn-primary:active {
    /* border: 1px solid #000; 		枠線の設定 */
    /*background-color: #000;			 背景色 */
    /*color: #fff; 					 文字色 */
}



/* ---------------------------------------------------------
アイコンボタン：デザイン案に合わせて編集
--------------------------------------------------------- */
/*icon-共通*/
.btn .icon {
    width: 1.3em;
    height: 1.3em;
    background-size: contain;
    position: relative;
}

/*ボタン付き--------------------------*/
/*icon-left*/
.icon-left .btn-cont {
    padding-left: 55px;
}

.icon-left .icon {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
}

/*icon-right*/
.icon-right .btn-cont {
    /*    padding-right: 55px;*/
}

.icon-right .icon {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

/*文字付き--------------------------*/
/*icon-tleft*/
.icon-tleft .btn-cont {
    justify-content: flex-start;
    column-gap: 40px;
}

.icon-tleft .btn-cont .btn-txt {
    max-width: calc(100% - (1.2em + 10px));
}

@media (max-width: 480px) {
    .icon-tleft .btn-cont {
        column-gap: 20px;
    }
}

/*icon-tcenter*/
.icon-tcenter .btn-cont {
    justify-content: center;
    column-gap: 10px;
}

.icon-tcenter .btn-cont .btn-txt {
    max-width: calc(100% - (1.2em + 10px));
}

/*icon-tright*/
.icon-tright .btn-cont {
    justify-content: flex-end;
    column-gap: 10px;
}

.icon-tright .btn-cont .btn-txt {
    max-width: calc(100% - (1.2em + 10px));
}


/*アイコン各種--------------------------*/
/* お問合せ(画像アイコン)*/
.icon.i-mail {
    background: url(../img/common/icon_mail.svg) no-repeat center;
}

@media (min-width: 768px) {
    .btn:hover .icon.i-mail {
        background: url(../img/common/icon_mail_blk.svg) no-repeat center;
    }
}

/*外部リンクスタイル01*/
.icon.i-exit {
    background-image: url(../img/common/icon_btn.svg);
    width: 11px;
    height: 11px;
}

/*
.icon.i-exit:before,
.icon.i-exit:after {
	content: "";
	display: block;
	border-color: currentColor;
	position: absolute;
}
.icon.i-exit:before {
	width: 9px;
	height: 4px;
	border-top: 1px solid;
	border-right: 1px solid;
    top: 0;
	right: 0;
}
.icon.i-exit:after {
	width: 10px;
	height: 7px;
	border: 1px solid;
	bottom: 0;
	left: 0;
}*/

/* 矢印 */
.icon.i-arrow::before {
    content: "";
    width: 7px;
    height: 6px;
    position: absolute;
    right: 22px;
    top: 50%;
    transform: translateY(-50%);
    background: url(../img/common/arrow_bk.svg) no-repeat right center;
    background-size: 7px auto;
}

.btn:hover .icon.i-arrow::before {
    background: url(../img/common/arrow_wh.svg) no-repeat right center;
}




/* -------------------------------------- 
    共通パーツ
 -------------------------------------- */
/* sec-ttl */
.sec-ttl.flex {
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 3%;
    font-size: 17.0rem;
    font-size: clamp(60px, 11.30vw, 170px);
}

.sec-ttl .f-en {
    line-height: 0.8;
    letter-spacing: 0;
}

.sec-ttl .f-en.over-txt {
    margin-left: -1.3rem;
}

.sec-ttl .f-yumin {
    letter-spacing: 0.2em;
    white-space: nowrap;
}

@media (max-width: 1024px) {
    .sec-ttl.flex {
        flex-direction: column;
        align-items: flex-start;
    }

    .sec-ttl .f-en.over-txt {
        font-size: 1.0rem;
        font-size: clamp(90px, 15.15vw, 120px);
        opacity: 0.15;
    }

    .sec-ttl.over .f-yumin {
        position: absolute;
        top: 50%;
        transform: translate(5%, -100%);
    }
}

@media (max-width: 480px) {
    .sec-ttl .f-en.over-txt {
        margin-left: -5px;
        /*font-size: 0.75rem;
        font-size: clamp(70px, 11.15vw, 75px); */
        font-size: 21vw;
    }
}

/* cmn-list */
.cmn-list {}

.cmn-list .list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    /*padding-inline: 40px;*/
}

.cmn-list .list:not(:last-child) {
    margin-bottom: 5px;
}

@media (max-width: 767px) {
    .cmn-list dl {
        border-bottom: 1px solid rgba(225, 225, 225, 0.5);
    }
}

@media (max-width: 480px) {
    .cmn-list .list {}
}

/* フォトギャラリー */

@media(min-width:768px) {
    #gallery .sbox-item a img {
        transition: transform ease 0.3s;
    }

    #gallery .sbox-item a:hover img {
        transform: scale(1.07);
    }
}

/* i-plus */
.sbox-item .img {
    position: relative;
}

.sbox-item .i-plus {
    background-color: #000;
    width: 40px;
    height: 40px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.sbox-item .i-plus span::before {
    content: "";
    display: block;
    background-color: #fff;
    width: 1px;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    ;
    z-index: 2;
}

.sbox-item .i-plus span::after {
    content: "";
    display: block;
    background-color: #fff;
    width: 20px;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    ;
    z-index: 2;
}



/* -------------------------------------- 
    pager
 -------------------------------------- */
.pager {
    position: relative;
}

.pager::before {
    margin-top: -1px;
    content: "";
    display: block;
    width: calc(100% - 232px);
    height: 1px;
    background-color: rgba(255, 255, 255, 0.3);
    position: absolute;
    top: 50%;
    left: 0;
    z-index: -1;
}

.pager ul {
    display: flex;
    justify-content: flex-end;
}

.pager ul li {
    height: 60px;
}

.pager .nav-current {
    min-width: 100px;
    padding: 0 15px;
    text-align: center;
}

.nav-current span {
    line-height: 60px;
}

.pager ul li a,
.pager ul li>span {
    display: inline-block;
    height: 60px;
    position: relative;
}

.pager .nav-pre {
    text-align: left;
}

.pager .nav-next {
    text-align: right;
    margin-left: 1px;
}

.pager .nav-next i,
.pager .nav-pre i,
.pager .nav-backlist i {
    display: inline-block;

    vertical-align: middle;

    width: 55px;
    height: 55px;
    overflow: hidden;
    border: 1px solid;
    border-radius: 9999px;
    text-align: center;
    position: relative;
}

.pager .nav-pre>span,
.pager .nav-next>span {
    opacity: 0.2;
}

.pager .nav-pre a,
.pager .nav-pre>span,
.pager .nav-backlist a {
    text-align: left;
}

.pager .nav-pre a span,
.pager .nav-pre>span span {
    line-height: 60px;
    padding-left: 60px;
    position: absolute;
}

.pager .nav-backlist a span {
    display: inline-block;
    vertical-align: middle;
    padding-left: 20px;
    line-height: 60px;
}

.pager .nav-next a,
.pager .nav-next>span {
    text-align: right;
}

.pager .nav-next a span,
.pager .nav-next>span span {
    /*    line-height: 60px;
    padding-right: 60px;*/
}

.pager .nav-pre a:hover,
.pager .nav-next a:hover {}

.pager .nav-pre i::before,
.pager .nav-backlist i::before,
.pager .nav-next i::before {
    content: "";
    position: absolute;
    top: 50%;
    display: block;
    width: 10px;
    height: 10px;
}

.pager .nav-pre i:before,
.pager .nav-backlist i:before {
    left: 50%;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    transform: translate(-50%, -50%) rotate(-45deg);
}

.pager .nav-next i:before {
    left: 50%;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    transform: translate(-50%, -50%) rotate(45deg);
}

.pager ul .nav-pre a:hover i:before,
.pager .nav-backlist a:hover i:before {
    animation: move-left-anim .65s ease 0s 1 forwards;
}

.pager ul .nav-next a:hover i:before {
    animation: move-right-anim .65s ease 0s 1 forwards;
}

@keyframes move-left-anim {
    0% {
        transform: translate(-50%, -50%) rotate(-45deg);
        opacity: 1;
    }

    50% {
        transform: translate(-100%, -50%) rotate(-45deg);
        opacity: 0;
    }

    50.1% {
        transform: translate(0%, -50%) rotate(-45deg);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) rotate(-45deg);
        opacity: 1;
    }
}

@keyframes move-right-anim {
    0% {
        transform: translate(-50%, -50%) rotate(45deg);
        opacity: 1;
    }

    50% {
        transform: translate(0%, -50%) rotate(45deg);
        opacity: 0;
    }

    50.1% {
        transform: translate(-100%, -50%) rotate(45deg);
        opacity: 0;
    }

    100% {
        transform: translate(-50%, -50%) rotate(45deg);
        opacity: 1;
    }
}

@media screen and (max-width: 767px) {
    .pager .nav-pre a span {
        display: none;
    }

    .pager .nav-next a span {
        display: none;
    }

    .pager .nav-pre>span span,
    .pager .nav-next>span span {
        display: none;
    }

    .pager .nav-pre a:hover,
    .pager .nav-next a:hover,
    .pager .nav-backlist a:hover {
        background: none !important;
    }
}

@media screen and (max-width: 480px) {
    .pager {
        padding: 20px 0;
    }
}

/* cmn-reservation */
#cmn-reservation {
    position: relative;
    z-index: 1;
    background-color: #595A60;
}

/*
#cmn-reservation:before {
	content: "";
	display: block;
	width: 100%;
	height: 50px;
	background-color: #fff;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
}
    */
#cmn-reservation .scroll-box {
    position: absolute;
    width: 100%;
    top: -128px;
}

#cmn-reservation .scroll-container {
    overflow: hidden;
    display: flex;
    white-space: nowrap;
    color: #5A5C61;
    position: relative;
}

#cmn-reservation .loop {
    display: inline-block;
    padding-right: 0.5em;
    animation: marquee 10s linear infinite;
    font-size: 170px;
    line-height: 0.9em;
}

#cmn-reservation .box-reservlogo {
    width: 325px;
    margin-left: auto;
    margin-right: auto;
}

#cmn-reservation .btnarea {
    justify-content: center;
}

#cmn-reservation .btnarea .btn-reserve .btn-cont {
    justify-content: space-between;
    padding-left: 55px;
    padding-right: 55px;
}

#cmn-reservation .icon.i-exit {
    width: 22px;
    height: 22px;
}

@media (max-width: 991px) {
    #cmn-reservation .ttl .f-en {
        font-size: 130px;
    }

    #cmn-reservation .scroll-box {
        top: -98px;
    }
}

@media (max-width: 767px) {
    #cmn-reservation .ttl .f-en {
        font-size: 100px;
    }

    #cmn-reservation .scroll-box {
        top: -75px;
    }

}

@media (max-width: 480px) {

    #cmn-reservation .box-reservlogo {
        width: 75%;
    }

    #cmn-reservation .ttl .f-en {
        font-size: 75px;
    }

    #cmn-reservation .scroll-box {
        top: -56px;
    }

    #cmn-reservation .btnarea .btn-reserve {
        min-height: 70px;
    }

    #cmn-reservation .icon.i-exit {
        width: 15px;
        height: 15px;
    }

    #cmn-reservation .btnarea .btn-reserve .btn-cont {
        padding-left: 25px;
        padding-right: 25px;
    }

    #cmn-reservation .btnarea .btn-reserve .btn-cont .btn-txt {
        font-size: 2.0rem;
        font-size: clamp(1.8rem, 1.6672rem + 0.28vw, 2rem);
    }

}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}


/* footer ----------------------------*/
.site-footer {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(../img/common/footer_img.jpg);
    background-size: cover;
    background-position: center;
}

.site-footer .f-info>* {
    display: block;
}

.site-footer .text-box {
    flex: 1;
    padding-left: 5%;
    padding-right: 5%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.site-footer .text-box .text01 span {
    display: block;
}

.site-footer .text-box ul {
    display: flex;
}

.site-footer .text-box li:nth-child(1) {
    margin-right: 2%;
}

.site-footer .text-box li a {
    display: flex;
    align-items: center;
    color: #003884;
    padding: 3px;
}

.site-footer .text-box li a:hover p {
    text-decoration: none;
}

.site-footer .text-box li .icon {
    margin-right: 5px;
    display: inline-block;
    width: 15px;
    height: 20px;
    background-size: 14px auto;
    background-repeat: no-repeat;
    background-position: center 50%;
}

.site-footer .f-inst>a {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.site-footer .f-inst .icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(../img/common/i-instagram.svg) no-repeat center 50% / contain;
}

.site-footer .text-box li .icon.i-map {
    background-image: url(../img/common/icon_map_blue.svg);
}

.site-footer .text-box li .icon.i-parking {
    background-image: url(../img/common/icon_parking_blue.svg);
}

.site-footer .text-box li p {
    text-decoration: underline;
}

.site-footer .text-box .num {
    margin-left: 21px;
}

.site-footer .text-box .link {
    margin-left: -1px;
    display: inline-block;
}

.site-footer .text-box .link a .icon.i-facebook {
    display: inline-block;
    width: 39px;
    height: 39px;
    background: url(../img/common/icon_face.svg) no-repeat center center;
}

.site-footer .text-box .link a {
    display: flex;
    align-items: center;
    transition: all ease 0.28s;
}

.site-footer .text-box .link a:hover {
    background: rgba(0, 0, 0, 0.08);
}

.site-footer .text-box .link span {
    padding: 0 15px;
}

.site-footer .to-gmap a {
    border: 1px solid #fff;
    border-radius: 9999px;
    padding: 8px 35px;
    transition: all 0.35s ease;
}

.site-footer .to-gmap a:hover {
    background-color: rgba(255,255,255,0.1);
}

.site-footer .copy-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.site-footer .f-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px 45px;
}

.site-footer .f-nav li a {}

.site-footer .f-nav li a:hover {
    opacity: 0.8;
}


@media (max-width: 767px) {
    .site-footer .f-box {
        flex-wrap: wrap;
    }

    .site-footer .f-nav {
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .site-footer .f-nav {
        flex-direction: column;
        align-content: center;
        align-items: flex-start;
    }

}

/* toTop ----------------------------*/
#toTop {
    position: fixed;
    width: 65px;
    height: 65px;
    bottom: 0;
    right: 0;
    color: #fff;
    cursor: pointer;
    display: none;
    z-index: 999;
    text-align: center;
    background: rgba(0, 0, 0, 0.5);
    animation: toTop-animation 0.3s ease forwards;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

#toTop>span {
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -7px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px;
    border: solid #fff;
    transform: rotate(-45deg);
    border-width: 1px 1px 0 0;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

@media (min-width: 768px) {
    #toTop:hover>span {
        top: 30%;
    }
}

@media screen and (max-width: 480px) {
    #toTop {
        width: 50px;
        height: 50px;
    }

    #toTop>i {
        line-height: 50px;
        font-size: 2.0rem;
    }
}

@keyframes toTop-animation {
    from {
        opacity: 0;
        transform: translateY(101%);
        -webkit-transform: translateY(101%);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes toTop-animation {
    from {
        opacity: 0;
        -webkit-transform: translateY(101%);
        transform: translateY(101%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* 共通アニメーション
========================= */
/*[class*="js-item"] {
	transform: translateY(40px);
	opacity: 0;
}*/
.js-item01,
.js-item02,
.js-item03,
.js-item04,
.js-item05,
.js-item06,
.js-item07,
.js-item08,
.js-item09,
.js-item10 {
    transform: translateY(40px);
    opacity: 0;
}

/*.js-item01, .js-item02, .js-item03, .js-item04, .js-item05, .js-item06, .js-item07 {
    transform: translateY(40px);
	opacity: 0;
}

*/
.js-fade {
    opacity: 0;
}