@charset "UTF-8";
/*******************************

particularCss

*******************************/
/*-----------------------------
Bnr-blcok
-----------------------------*/
.bnr-item {
    position: relative;
}

.bnr-bg {
    width: 100%;
    height: 310px;
    display: block;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 300ms 0s ease;
    transition: all 300ms 0s ease;
}

.bnr-bg:before {
    content: "";
    display: block;
    padding-top: 100%;
}

.bnr-bg img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    -o-object-fit: cover;
    object-fit: cover;
    vertical-align: top;
    -o-object-position: center;
    object-position: center;
    font-family: 'object-fit: cover; object-position: bottom;';
    -webkit-transition: all 1s 0s ease;
    transition: all 1s 0s ease;
}

a:hover .bnr-bg img {
    -webkit-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
}

.bnr-inner {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    color: #fff;
    text-align: left;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.bnr-inner .bnr-ttl {
    font-size: 350%;
    letter-spacing: .05em;
    margin-right: 30px;
}

.bnr-inner .jp {
    font-size: 180%;
    letter-spacing: .1em;
}

.bnr-inner .more {
    width: 190px;
    margin-left: auto;
}

.bnr-inner .more {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.bnr-inner .more:before {
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1px;
    background: #fff;
    display: block;
}

.bnr-inner .more:before {
    margin-right: .4em;
}

/*==== mobile スマフォ横〜用css ===*/
@media screen and (max-width: 896px) {
    .bnr-bg {
        height: 250px;
    }
    .bnr-inner .bnr-ttl {
        font-size: 250%;
    }
    .bnr-inner .jp {
        font-size: 150%;
    }
    .bnr-inner .more {
        width: 100px;
    }
}

/*==== mobile スマフォ縦用css ===*/
@media screen and (max-width: 480px) {
    .bnr-bg {
        height: 130px;
    }
    .bnr-inner .bnr-ttl {
        font-size: 240%;
        margin-right: 20px;
    }
    .bnr-inner .jp {
        font-size: 120%;
    }
}