﻿img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom
}

a:link,
a:visited,
a:active,
a:hover {
    overflow: hidden;
    outline: none
}

*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

figure {
    padding: 0;
    margin: 0
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

.hide-all {
    display: none !important
}

.hide-text {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    list-style-type: none;
    height: 0;
    overflow: hidden
}

@media (max-width: 767px) {
    .hide-sp {
        display: none !important
    }
}

@media print,
screen and (min-width: 768px) {
    .hide-pc {
        display: none !important
    }
}

.main {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    color: #362e2b
}

@media print,
screen and (min-width: 768px) {
    .main {
        min-width: 1260px
    }
}

.emergency-area {
    background: #333333
}

.emergency-area-inner {
    display: flex
}

@media print,
screen and (min-width: 768px) {
    .emergency-area-inner {
        width: 1260px;
        padding: 15px 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .emergency-area-inner {
        width: 93.75vw;
        margin: auto;
        padding: 10px 0px
    }
}

.emergency-title {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e60012
}

@media print,
screen and (min-width: 768px) {
    .emergency-title {
        flex-basis: 196px;
        width: 196px
    }
}

@media (max-width: 767px) {
    .emergency-title {
        flex-basis: 21.25vw;
        width: 21.25vw
    }
}

.emergency-title h2 {
    color: #fff
}

@media print,
screen and (min-width: 768px) {
    .emergency-title h2 {
        font-size: 16px;
        font-weight: 400
    }
}

@media (max-width: 767px) {
    .emergency-title h2 {
        font-size: 13px;
        font-weight: 700;
        text-align: center
    }
}

.emergency-text {
    background: #fff
}

@media print,
screen and (min-width: 768px) {
    .emergency-text {
        flex-basis: 1026px;
        width: 1026px
    }
}

@media (max-width: 767px) {
    .emergency-text {
        flex-basis: 72.5vw;
        width: 72.5vw
    }
}

.emergency-text ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center
}

@media print,
screen and (min-width: 768px) {
    .emergency-text ul {
        padding: 15px 20px
    }
}

@media (max-width: 767px) {
    .emergency-text ul {
        padding: 6px 10px
    }
}

.emergency-text ul li {
    line-height: 1.5;
    margin: 0
}

@media print,
screen and (min-width: 768px) {
    .emergency-text ul li {
        font-size: 16px
    }
}

@media (max-width: 767px) {
    .emergency-text ul li {
        font-size: 14px
    }
}

.emergency-text ul li a {
    color: #000;
    text-decoration: none
}

.oshirase-area {
    background: #fff
}

@media print,
screen and (min-width: 768px) {
    .oshirase-area-inner {
        width: 1000px;
        padding: 15px 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .oshirase-area-inner {
        width: 93.75vw;
        margin: auto;
        padding: 10px 0px
    }
}

.oshirase-box {
    border: 2px solid #ce4949;
    width: 100%
}

@media print,
screen and (min-width: 768px) {
    .oshirase-box {
        padding: 16px 50px 10px
    }
}

@media (max-width: 767px) {
    .oshirase-box {
        padding: 10px 13px
    }
}

@media print,
screen and (min-width: 768px) {
    .oshirase-box h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        margin: 0 0 12px
    }
}

@media (max-width: 767px) {
    .oshirase-box h2 {
        font-size: 14px;
        font-weight: 700;
        margin: 0 0 6px
    }
}

@media print,
screen and (min-width: 768px) {
    .oshirase-box p {
        font-size: 16px;
        line-height: 1.8;
        margin: 0 auto
    }
}

@media (max-width: 767px) {
    .oshirase-box p {
        font-size: 14px;
        line-height: 1.5;
        margin: 0
    }
}

.top_youtube-area {
    background: #333333
}

@media print,
screen and (min-width: 768px) {
    .top_youtube-area-inner {
        width: 1260px;
        padding: 30px 0 50px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .top_youtube-area-inner {
        width: 93.75vw;
        margin: auto;
        padding: 15px 0 30px
    }
}

.top_youtube-title h2 {
    color: #fff;
    font-weight: 400;
    text-align: center
}

@media print,
screen and (min-width: 768px) {
    .top_youtube-title h2 {
        font-size: 20px;
        width: 894px;
        margin: 0 auto 16px
    }
}

@media (max-width: 767px) {
    .top_youtube-title h2 {
        font-size: 14px;
        margin: 0 auto 10px
    }
}

@media print,
screen and (min-width: 768px) {
    .top_youtube-box {
        width: 894px;
        margin: auto
    }
}

.top_youtube-box-inner {
    position: relative;
    width: 100%;
    padding-top: 56.25%
}

.top_youtube-box-inner iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%
}

.now-on-air-area {
    background: #f8f5ed
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-area-inner {
        display: flex;
        width: 1260px;
        padding: 18px 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .now-on-air-area-inner {
        padding: 10px 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-box {
        flex-basis: 996px;
        width: 996px
    }
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-box-inner {
        width: 940px
    }
}

@media (max-width: 767px) {
    .now-on-air-box-inner {
        width: 87.5vw;
        margin: auto
    }
}

.now-on-air-slide {
    display: none
}

.now-on-air-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-item {
        width: 940px
    }
}

@media (max-width: 767px) {
    .now-on-air-item {
        width: 87.5vw
    }
}

.now-on-air-wrap {
    display: flex
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-wrap {
        width: 940px
    }
}

@media (max-width: 767px) {
    .now-on-air-wrap {
        width: 87.5vw
    }
}

.now-on-air-date {
    background: #ea5405;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-date {
        flex-basis: 120px;
        width: 120px;
        height: 94px;
        padding: 0 0 0 20px;
        border-radius: 10px 0 0 10px
    }
}

@media (max-width: 767px) {
    .now-on-air-date {
        flex-basis: 22.5vw;
        width: 22.5vw;
        height: 65px;
        padding: 0 0 0 10px;
        border-radius: 5px 0 0 5px
    }
}

.now-on-air-date .noa-date01 {
    font-size: 23px;
    font-weight: 700;
    margin: 0
}

@media (max-width: 767px) {
    .now-on-air-date .noa-date01 {
        font-size: 13px
    }
}

.now-on-air-date .noa-date02 {
    font-family: 'Oswald', sans-serif;
    font-size: 14px;
    font-weight: 400;
    margin: 0
}

@media (max-width: 767px) {
    .now-on-air-date .noa-date02 {
        font-size: 8px
    }
}

.now-on-air-title {
    background: #fff
}

@media print,
screen and (min-width: 768px) {
    .now-on-air-title {
        flex-basis: 820px;
        width: 820px;
        height: 94px;
        border-radius: 0 10px 10px 0;
        padding: 12px 30px 0px 10px
    }
}

@media (max-width: 767px) {
    .now-on-air-title {
        flex-basis: 77.5vw;
        width: 77.5vw;
        height: 65px;
        border-radius: 0 5px 5px 0;
        padding: 6px 20px 0px 10px
    }
}

.now-on-air-title h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0
}

@media (max-width: 767px) {
    .now-on-air-title h3 {
        font-size: 12px;
        font-weight: 400
    }
}

.now-on-air-title h3 a {
    color: #362e2b;
    text-decoration: none
}

.now-on-air-title h3 a:hover {
    text-decoration: underline
}

.now-on-air-title p {
    font-size: 14px;
    margin: 0
}

@media (max-width: 767px) {
    .now-on-air-title p {
        display: none
    }
}

.now-on-air-title p br {
    display: none
}

.now-on-air-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 46px;
    height: 46px;
    position: absolute;
    top: calc(50% - 23px);
    z-index: 1000;
    cursor: pointer
}

@media (max-width: 767px) {
    .now-on-air-slide .arrow {
        width: 29px;
        height: 29px;
        top: calc(50% - 14px)
    }
}

.now-on-air-slide .arrow.prev {
    background: url(../images2021/prev.png) no-repeat 0 0;
    background-size: cover;
    left: -19px
}

@media (max-width: 767px) {
    .now-on-air-slide .arrow.prev {
        left: -15px
    }
}

.now-on-air-slide .arrow.next {
    background: url(../images2021/next.png) no-repeat 0 0;
    background-size: cover;
    right: -19px
}

@media (max-width: 767px) {
    .now-on-air-slide .arrow.next {
        right: -15px
    }
}

@media print,
screen and (min-width: 768px) {
    .timetable-box {
        flex-basis: 120px;
        width: 120px
    }
}

@media (max-width: 767px) {
    .timetable-box {
        display: none
    }
}

.timetable-box p {
    margin: 0
}

.timetable-box p a {
    display: block;
    background: #ea5405;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    width: 104px;
    height: 94px;
    padding: 60px 0 0;
    border-radius: 10px;
    position: relative
}

.timetable-box p a::after {
    content: '\f108';
    font-family: fontAwesome;
    font-size: 26px;
    font-weight: 400;
    position: absolute;
    top: 25px;
    left: 39px
}

.timetable-box p a:hover {
    opacity: 0.7
}

@media print,
screen and (min-width: 768px) {
    .week-box {
        flex-basis: 104px;
        width: 104px
    }
}

@media (max-width: 767px) {
    .week-box {
        display: none
    }
}

.week-box p {
    margin: 0
}

.week-box p a {
    display: block;
    background: #362e2b;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    width: 104px;
    height: 94px;
    padding: 60px 0 0;
    border-radius: 10px;
    position: relative
}

.week-box p a::after {
    content: '\f1ea';
    font-family: fontAwesome;
    font-size: 26px;
    font-weight: 400;
    position: absolute;
    top: 25px;
    left: 38px
}

.week-box p a:hover {
    opacity: 0.7
}

@media print,
screen and (min-width: 768px) {
    .pickup-box {
        padding: 20px 0
    }
}

@media (max-width: 767px) {
    .pickup-box {
        padding: 16px 0
    }
}

.pickup-slide {
    display: none
}

.pickup-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .pickup-item {
        width: 800px;
        margin: 0 22px
    }
}

@media (max-width: 767px) {
    .pickup-item {
        width: 87.5vw;
        margin: 0 1.09375vw
    }
}

.pickup-item a {
    text-decoration: none
}

@media print,
screen and (min-width: 768px) {
    .pickup-photo {
        width: 800px;
        height: 450px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .pickup-photo {
        width: 87.5vw;
        height: 49.21875vw;
        margin: 0 0 35px
    }
}

.pickup-date {
    color: #ea5405;
    line-height: 1.5
}

@media print,
screen and (min-width: 768px) {
    .pickup-date {
        font-size: 18px;
        margin: 0 0 4px
    }
}

@media (max-width: 767px) {
    .pickup-date {
        font-size: 16px;
        margin: 0
    }
}

.pickup-title {
    color: #000;
    line-height: 1.5
}

@media print,
screen and (min-width: 768px) {
    .pickup-title {
        font-size: 18px;
        margin: 0
    }
}

@media (max-width: 767px) {
    .pickup-title {
        font-size: 16px;
        font-weight: 700;
        margin: 0
    }
}

.pickup-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 23px;
    height: 37px;
    position: absolute;
    top: 197px;
    z-index: 1000;
    cursor: pointer
}

@media (max-width: 767px) {
    .pickup-slide .arrow {
        width: 12px;
        height: 19px;
        top: 20.625vw
    }
}

.pickup-slide .arrow.prev {
    background: url(../images2021/pickup-prev.png) no-repeat 0 0;
    background-size: cover;
    left: calc(50% - 434px)
}

@media (max-width: 767px) {
    .pickup-slide .arrow.prev {
        left: 2.1875vw
    }
}

.pickup-slide .arrow.next {
    background: url(../images2021/pickup-next.png) no-repeat 0 0;
    background-size: cover;
    right: calc(50% - 434px)
}

@media (max-width: 767px) {
    .pickup-slide .arrow.next {
        right: 2.1875vw
    }
}

.pickup-slide .slick-dots {
    text-align: center;
    padding: 0
}

@media print,
screen and (min-width: 768px) {
    .pickup-slide .slick-dots {
        position: relative;
        top: -95px
    }
}

@media (max-width: 767px) {
    .pickup-slide .slick-dots {
        width: 100%;
        position: absolute;
        top: 49.875vw
    }
}

.pickup-slide .slick-dots li {
    display: inline-block;
    width: 18px;
    margin: 0 4px;
    padding: 0
}

@media (max-width: 767px) {
    .pickup-slide .slick-dots li {
        width: 12px
    }
}

.pickup-slide .slick-dots li button {
    background: none;
    padding: 0;
    position: relative;
    text-indent: -9999px;
    border: 0;
    outline: none;
    cursor: pointer
}

@media print,
screen and (min-width: 768px) {
    .pickup-slide .slick-dots li button {
        width: 20px;
        height: 25px
    }
}

.pickup-slide .slick-dots li button::before {
    content: '●';
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
    color: #ececec;
    font-size: 18px;
    text-indent: 0px;
    position: absolute;
    top: 0;
    left: 0
}

@media (max-width: 767px) {
    .pickup-slide .slick-dots li button::before {
        font-size: 12px
    }
}

.pickup-slide .slick-dots li.slick-active button:before {
    color: #ea5405
}

@media print,
screen and (min-width: 768px) {
    .pickup-banner-box {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .pickup-banner-box {
        width: 93.75vw;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .pickup-banner-box-inner {
        width: 1120px;
        margin: auto
    }
}

.pickup-banner-box-inner ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

@media print,
screen and (min-width: 768px) {
    .pickup-banner-box-inner ul {
        margin: 0 -20px
    }
}

@media (max-width: 767px) {
    .pickup-banner-box-inner ul {
        margin: 0 -1.5625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .pickup-banner-box-inner ul li {
        flex-basis: 250px;
        width: 250px;
        margin: 0 20px 40px
    }
}

@media (max-width: 767px) {
    .pickup-banner-box-inner ul li {
        flex-basis: 45.3125vw;
        width: 45.3125vw;
        margin: 0 1.5625vw 16px
    }
}

.pickup-banner-box-inner ul li.empty {
    height: 0;
    border: none
}

.new-area {
    background: #f8f5ed
}

@media print,
screen and (min-width: 768px) {
    .new-area {
        padding: 60px 0 90px;
        position: relative
    }
}

@media (max-width: 767px) {
    .new-area {
        padding: 35px 0 60px
    }
}

@media print,
screen and (min-width: 768px) {
    .new-title {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .new-title h2 {
        background: url(../images2021/new-title.png) no-repeat 0 0;
        background-size: 42px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 58px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .new-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .new-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/new-title.png) no-repeat 0 0;
        background-size: 27px auto;
        width: 27px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

.new-slide {
    display: none
}

.new-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .new-box {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .new-box {
        padding: 0 0 0 3.125vw
    }
}

@media print,
screen and (min-width: 768px) {
    .new-item {
        width: 356px;
        margin: 0 13px
    }
}

@media (max-width: 767px) {
    .new-item {
        width: 78.125vw;
        margin: 0 2.03125vw
    }
}

.new-item a {
    text-decoration: none
}

.new-item-photo {
    margin: 0 0 10px
}

.new-item-title {
    max-height: 58px
}

@media (max-width: 767px) {
    .new-item-title {
        max-height: 53px
    }
}

.new-item-title p {
    color: #362e2b;
    font-size: 16px;
    line-height: 1.5;
    width: 356px;
    margin: 0
}

@media (max-width: 767px) {
    .new-item-title p {
        font-size: 14px;
        width: 78.125vw
    }
}

.new-item-category p {
    color: #a7a7a7;
    font-size: 13px;
    line-height: 1.5;
    margin: 0
}

.new-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 23px;
    height: 37px;
    position: absolute;
    top: 82px;
    z-index: 1000;
    cursor: pointer
}

.new-slide .arrow.slick-disabled {
    display: none !important
}

@media (max-width: 767px) {
    .new-slide .arrow {
        width: 12px;
        height: 19px;
        top: 20.625vw
    }
}

.new-slide .arrow.prev {
    background: url(../images2021/pickup-prev.png) no-repeat 0 0;
    background-size: cover;
    left: 20px
}

@media (max-width: 767px) {
    .new-slide .arrow.prev {
        left: 2.1875vw
    }
}

.new-slide .arrow.next {
    background: url(../images2021/pickup-next.png) no-repeat 0 0;
    background-size: cover;
    right: 20px
}

@media (max-width: 767px) {
    .new-slide .arrow.next {
        right: 2.1875vw
    }
}

.new-box .slick-slide {
    transition: all ease-in-out .3s;
    opacity: .2
}

.new-box .slick-active {
    opacity: 1
}

.new-box .slick-current {
    opacity: 1
}

@media print,
screen and (min-width: 768px) {
    .new-list-btn {
        width: 1260px;
        padding: 0 20px;
        margin: auto;
        position: relative
    }
}

.new-list-btn p {
    margin: 0
}

.new-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .new-list-btn p a {
        position: absolute;
        top: -390px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .new-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.new-list-btn p a:hover {
    opacity: 0.7
}

.new-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .new-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-box {
        width: 1220px;
        margin: 50px auto 0
    }
}

.new-pickup-box-inner {
    background: #e2ddd1
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-box-inner {
        padding: 50px 20px
    }
}

@media (max-width: 767px) {
    .new-pickup-box-inner {
        width: 93.75vw;
        margin: auto;
        padding: 36px 0 10px
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-box h3 {
        background: url(../images2021/new-pickup-title_pc.png) no-repeat 0 0;
        font-size: 22px;
        font-weight: 700;
        line-height: 29px;
        text-align: center;
        width: 204px;
        height: 29px;
        margin: 0 auto 50px
    }
}

@media (max-width: 767px) {
    .new-pickup-box h3 {
        background: url(../images2021/new-pickup-title_sp.png) no-repeat 0 0;
        background-size: 132px auto;
        font-size: 15px;
        font-weight: 700;
        line-height: 20px;
        text-align: center;
        width: 132px;
        height: 20px;
        margin: 0 auto 35px
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-box-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 1120px;
        margin: auto
    }

    .new-pickup-box-wrap .empty {
        height: 0;
        border: none
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item {
        width: 540px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .new-pickup-item {
        width: 84.375vw;
        margin: 0 auto 20px
    }
}

.new-pickup-item a {
    display: block;
    color: #362e2b;
    text-decoration: none
}

.new-pickup-item a:hover {
    opacity: 0.7
}

@media print,
screen and (min-width: 768px) {

    .new-pickup-item-wrap:before,
    .new-pickup-item-wrap:after {
        content: " ";
        display: table
    }

    .new-pickup-item-wrap:after {
        clear: both
    }
}

@media (max-width: 767px) {
    .new-pickup-item-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item01 {
        float: left;
        width: 230px
    }
}

@media (max-width: 767px) {
    .new-pickup-item01 {
        flex-basis: 40.625vw;
        width: 40.625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item02 {
        float: right;
        width: 300px
    }
}

@media (max-width: 767px) {
    .new-pickup-item02 {
        flex-basis: 40.625vw;
        width: 40.625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item02 p {
        font-size: 16px;
        margin: 0 0 12px
    }
}

@media (max-width: 767px) {
    .new-pickup-item02 p {
        font-size: 14px;
        margin: 0
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item03 {
        float: right;
        width: 300px
    }
}

@media (max-width: 767px) {
    .new-pickup-item03 {
        flex-basis: 100%;
        width: 100%;
        margin: 8px 0 0
    }
}

@media print,
screen and (min-width: 768px) {
    .new-pickup-item03 p {
        font-size: 14px;
        margin: 0
    }
}

@media (max-width: 767px) {
    .new-pickup-item03 p {
        font-size: 12px;
        margin: 0
    }
}

@media print,
screen and (min-width: 768px) {
    .news-area {
        padding: 60px 0 70px;
        position: relative
    }
}

@media (max-width: 767px) {
    .news-area {
        padding: 24px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .news-title {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .news-title h2 {
        background: url(../images2021/news-title.png) no-repeat 0 0;
        background-size: 57px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 72px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .news-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 28px
    }

    .news-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/news-title.png) no-repeat 0 0;
        background-size: 38px auto;
        width: 38px;
        height: 40px;
        margin: 0 8px -12px 0
    }
}

.news-slide {
    display: none
}

.news-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .news-box {
        width: 1260px;
        padding: 0 20px;
        margin: 0 auto 56px
    }
}

@media (max-width: 767px) {
    .news-box {
        padding: 0 0 0 3.125vw
    }
}

@media print,
screen and (min-width: 768px) {
    .news-item {
        width: 266px;
        margin: 0 10px
    }
}

@media (max-width: 767px) {
    .news-item {
        width: 78.125vw;
        margin: 0 2.03125vw
    }
}

.news-item a {
    text-decoration: none
}

.news-item-photo {
    margin: 0 0 10px
}

@media print,
screen and (min-width: 768px) {
    .news-item-photo {
        width: 266px;
        height: 150px
    }
}

@media (max-width: 767px) {
    .news-item-photo {
        width: 64.375vw;
        height: 36.25vw
    }
}

@media print,
screen and (min-width: 768px) {
    .news-item-photo figure img {
        max-width: 266px;
        max-height: 150px;
        margin: auto;
    }
}

@media (max-width: 767px) {
    .news-item-photo figure img {
        max-width: 64.375vw;
        max-height: 36.25vw;
        margin: auto;
    }
}

.news-item-title {
    height: 48px
}

@media (max-width: 767px) {
    .news-item-title {
        height: 53px
    }
}

.news-item-title p {
    color: #362e2b;
    font-size: 14px;
    line-height: 1.5;
    width: 266px;
    margin: 0
}

@media (max-width: 767px) {
    .news-item-title p {
        font-size: 14px;
        width: 78.125vw
    }
}

.news-item-date p {
    color: #a7a7a7;
    font-size: 14px;
    line-height: 1.5;
    margin: 0
}

.news-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 23px;
    height: 37px;
    position: absolute;
    top: 56px;
    z-index: 1000;
    cursor: pointer
}

.news-slide .arrow.slick-disabled {
    display: none !important
}

@media (max-width: 767px) {
    .news-slide .arrow {
        width: 12px;
        height: 19px;
        top: 20.625vw
    }
}

.news-slide .arrow.prev {
    background: url(../images2021/pickup-prev.png) no-repeat 0 0;
    background-size: cover;
    left: 20px
}

@media (max-width: 767px) {
    .news-slide .arrow.prev {
        left: 2.1875vw
    }
}

.news-slide .arrow.next {
    background: url(../images2021/pickup-next.png) no-repeat 0 0;
    background-size: cover;
    right: 20px
}

@media (max-width: 767px) {
    .news-slide .arrow.next {
        right: 2.1875vw
    }
}

.news-box .slick-slide {
    transition: all ease-in-out .3s;
    opacity: .2
}

.news-box .slick-active {
    opacity: 1
}

.news-box .slick-current {
    opacity: 1
}

@media print,
screen and (min-width: 768px) {
    .news-list-btn {
        width: 1260px;
        padding: 0 20px;
        margin: auto;
        position: relative
    }
}

.news-list-btn p {
    margin: 0
}

.news-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .news-list-btn p a {
        position: absolute;
        top: -390px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .news-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.news-list-btn p a:hover {
    opacity: 0.7
}

.news-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .news-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

@media print,
screen and (min-width: 768px) {
    .news-banner-box {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .news-banner-box {
        width: 93.75vw;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .news-banner-box-inner {
        width: 1120px;
        margin: auto;
        padding: 54px 0 0;
        border-top: 1px dotted #cecece
    }
}

.news-banner-box-inner ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

@media print,
screen and (min-width: 768px) {
    .news-banner-box-inner ul {
        margin: 0 -10px
    }
}

@media (max-width: 767px) {
    .news-banner-box-inner ul {
        margin: 0 -1.5625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .news-banner-box-inner ul li {
        flex-basis: 250px;
        width: 250px;
        margin: 0 10px 18px
    }
}

@media (max-width: 767px) {
    .news-banner-box-inner ul li {
        flex-basis: 45.3125vw;
        width: 45.3125vw;
        margin: 0 1.5625vw 16px
    }
}

.weather-area {
    background: #f8f5ed
}

@media print,
screen and (min-width: 768px) {
    .weather-area {
        padding: 60px 0 70px;
        position: relative
    }
}

@media (max-width: 767px) {
    .weather-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .weather-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto;
        position: relative
    }
}

@media (max-width: 767px) {
    .weather-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .weather-title h2 {
        background: url(../images2021/weather-title.png) no-repeat 0 0;
        background-size: 44px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 58px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .weather-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .weather-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/weather-title.png) no-repeat 0 0;
        background-size: 30px auto;
        width: 30px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

@media print,
screen and (min-width: 768px) {

    .weather-box-inner:before,
    .weather-box-inner:after {
        content: " ";
        display: table
    }

    .weather-box-inner:after {
        clear: both
    }
}

@media (max-width: 767px) {
    .weather-box-inner {
        width: 93.75vw;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .weather-item01 {
        float: left;
        width: 420px
    }
}

@media (max-width: 767px) {
    .weather-item01 {
        margin: 0 0 28px
    }
}

.weather-item01 ul {
    list-style: none;
    margin: 0 0 8px;
    padding: 0
}

.weather-item01 ul li {
    display: inline-block;
    color: #a7a7a7;
    font-size: 16px;
    line-height: 30px;
    padding: 0 12px 0 15px;
    border-left: 2px solid #000;
    cursor: pointer
}

.weather-item01 ul li:first-of-type {
    border-left: none;
    padding-left: 0
}

.weather-item01 ul li.active {
    color: #000
}

.weather-item01 figure {
    display: none
}

.weather-item01 figure.active {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .weather-item02 {
        float: left;
        width: 420px;
        margin: 0 0 0 30px
    }
}

.weather-item02 p {
    font-size: 16px;
    line-height: 30px;
    margin: 0 0 8px
}

.weather-list-btn p {
    margin: 0
}

.weather-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .weather-list-btn p a {
        position: absolute;
        top: 20px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .weather-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.weather-list-btn p a:hover {
    opacity: 0.7
}

.weather-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .weather-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

@media print,
screen and (min-width: 768px) {
    .weather-ad-box {
        float: left;
        width: 300px;
        margin: 38px 0 0 50px
    }
}

@media (max-width: 767px) {
    .weather-ad-box {
        width: 93.75vw;
        text-align: center
    }
}

@media print,
screen and (min-width: 768px) {
    .event-area {
        padding: 60px 0 70px;
        position: relative
    }
}

@media (max-width: 767px) {
    .event-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .event-title {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .event-title h2 {
        background: url(../images2021/event-title.png) no-repeat 0 0;
        background-size: 70px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 82px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .event-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .event-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/event-title.png) no-repeat 0 0;
        background-size: 46px auto;
        width: 46px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

.event-slide {
    display: none
}

.event-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .event-box {
        width: 1260px;
        padding: 0 20px;
        margin: 0 auto 56px
    }
}

@media (max-width: 767px) {
    .event-box {
        padding: 0 0 0 3.125vw
    }
}

@media print,
screen and (min-width: 768px) {
    .event-item {
        width: 266px;
        margin: 0 10px
    }
}

@media (max-width: 767px) {
    .event-item {
        width: 78.125vw;
        margin: 0 2.03125vw
    }
}

.event-item a {
    text-decoration: none
}

.event-item-photo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 10px
}

@media print,
screen and (min-width: 768px) {
    .event-item-photo {
        height: 150px
    }
}

@media (max-width: 767px) {
    .event-item-photo {
        height: 43.75vw
    }
}

@media print,
screen and (min-width: 768px) {
    .event-item-photo figure img {
        max-width: 266px;
        max-height: 150px
    }
}

@media (max-width: 767px) {
    .event-item-photo figure img {
        max-width: 78.125vw;
        max-height: 43.75vw
    }
}

.event-item-category p {
    background-color: #ccc;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin: 0 0 8px
}

@media print,
screen and (min-width: 768px) {
    .event-item-category p {
        line-height: 23px;
        width: 78px;
        height: 23px
    }
}

@media (max-width: 767px) {
    .event-item-category p {
        line-height: 22px;
        width: 70px;
        height: 22px
    }
}

.event-item-category p.event {
    background-color: #86428B
}

.event-item-category p.stage {
    background-color: #1A83B0
}

.event-item-category p.sports {
    background-color: #ED9D00
}

.event-item-category p.music {
    background-color: #F14949
}

.event-item-category p.arts {
    background-color: #A88B24
}

.event-item-category p.musical {
    background-color: #22AC38
}

.event-item-category p.other {
    background-color: #949494
}

.event-item-title p {
    color: #362e2b;
    font-size: 14px;
    line-height: 1.5;
    width: 266px;
    margin: 0
}

@media (max-width: 767px) {
    .event-item-title p {
        width: 78.125vw
    }
}

.event-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 23px;
    height: 37px;
    position: absolute;
    top: 56px;
    z-index: 1000;
    cursor: pointer
}

.event-slide .arrow.slick-disabled {
    display: none !important
}

@media (max-width: 767px) {
    .event-slide .arrow {
        width: 12px;
        height: 19px;
        top: 20.625vw
    }
}

.event-slide .arrow.prev {
    background: url(../images2021/pickup-prev.png) no-repeat 0 0;
    background-size: cover;
    left: 20px
}

@media (max-width: 767px) {
    .event-slide .arrow.prev {
        left: 2.1875vw
    }
}

.event-slide .arrow.next {
    background: url(../images2021/pickup-next.png) no-repeat 0 0;
    background-size: cover;
    right: 20px
}

@media (max-width: 767px) {
    .event-slide .arrow.next {
        right: 2.1875vw
    }
}

.event-box .slick-slide {
    transition: all ease-in-out .3s;
    opacity: .2
}

.event-box .slick-active {
    opacity: 1
}

.event-box .slick-current {
    opacity: 1
}

@media print,
screen and (min-width: 768px) {
    .event-list-btn {
        width: 1260px;
        padding: 0 20px;
        margin: auto;
        position: relative
    }
}

.event-list-btn p {
    margin: 0
}

.event-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .event-list-btn p a {
        position: absolute;
        top: -390px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .event-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.event-list-btn p a:hover {
    opacity: 0.7
}

.event-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .event-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

.timeline-area {
    background: #f8f5ed
}

@media (max-width: 767px) {
    .timeline-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .timeline-area-inner {
        width: 1260px;
        padding: 60px 20px 70px;
        margin: auto;
        position: relative
    }
}

.timeline-area .dnptl-widget {
    width: 1120px;
    margin: auto
}

@media print,
screen and (min-width: 768px) {
    .timeline-title h2 {
        background: url(../images2021/timeline-title.png) no-repeat 0 0;
        background-size: 48px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 62px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .timeline-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .timeline-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/timeline-title.png) no-repeat 0 0;
        background-size: 32px auto;
        width: 32px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

@media (max-width: 767px) {
    .timeline-area .dnptl-widget {
        width: 93.75vw;
        margin: auto
    }
}

.timeline-list-btn p {
    margin: 0
}

.timeline-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .timeline-list-btn p a {
        position: absolute;
        top: 70px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .timeline-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.timeline-list-btn p a:hover {
    opacity: 0.7
}

.timeline-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .timeline-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

@media print,
screen and (min-width: 768px) {
    .ana-area {
        padding: 60px 0 70px;
        position: relative
    }
}

@media (max-width: 767px) {
    .ana-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .ana-title {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media print,
screen and (min-width: 768px) {
    .ana-title h2 {
        background: url(../images2021/ana-title.png) no-repeat 0 0;
        background-size: 46px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 62px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .ana-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .ana-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/ana-title.png) no-repeat 0 0;
        background-size: 31px auto;
        width: 31px;
        height: 40px;
        margin: 0 6px -14px 0
    }
}

.ana-slide {
    display: none
}

.ana-slide.slick-initialized {
    display: block
}

@media print,
screen and (min-width: 768px) {
    .ana-box {
        width: 1260px;
        padding: 0 20px;
        margin: 0 auto 56px
    }
}

@media (max-width: 767px) {
    .ana-box {
        padding: 0 0 0 3.125vw
    }
}

@media print,
screen and (min-width: 768px) {
    .ana-item {
        width: 266px;
        margin: 0 10px
    }
}

@media (max-width: 767px) {
    .ana-item {
        width: 78.125vw;
        margin: 0 2.03125vw
    }
}

.ana-item a {
    text-decoration: none
}

.ana-item-photo {
    margin: 0 0 10px
}

.ana-item-title p {
    color: #362e2b;
    font-size: 16px;
    line-height: 1.5;
    width: 266px;
    margin: 0 0 8px
}

@media (max-width: 767px) {
    .ana-item-title p {
        font-size: 14px;
        width: 78.125vw
    }
}

.ana-item-name-box:before,
.ana-item-name-box:after {
    content: " ";
    display: table
}

.ana-item-name-box:after {
    clear: both
}

.ana-item-name-box-l {
    float: left;
    width: 39px
}

.ana-item-name-box-l figure {
    width: 34px
}

.ana-item-name-box-r {
    float: left
}

@media print,
screen and (min-width: 768px) {
    .ana-item-name-box-r {
        width: 227px
    }
}

@media (max-width: 767px) {
    .ana-item-name-box-r {
        width: 167px
    }
}

.ana-item-name {
    color: #362e2b;
    font-size: 12px;
    margin: 0 0 5px
}

.ana-item-date {
    color: #a7a7a7;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    margin: 0
}

.ana-slide .arrow {
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    width: 23px;
    height: 37px;
    position: absolute;
    top: 82px;
    z-index: 1000;
    cursor: pointer
}

.ana-slide .arrow.slick-disabled {
    display: none !important
}

@media (max-width: 767px) {
    .ana-slide .arrow {
        width: 12px;
        height: 19px;
        top: 20.625vw
    }
}

.ana-slide .arrow.prev {
    background: url(../images2021/pickup-prev.png) no-repeat 0 0;
    background-size: cover;
    left: 20px
}

@media (max-width: 767px) {
    .ana-slide .arrow.prev {
        left: 2.1875vw
    }
}

.ana-slide .arrow.next {
    background: url(../images2021/pickup-next.png) no-repeat 0 0;
    background-size: cover;
    right: 20px
}

@media (max-width: 767px) {
    .ana-slide .arrow.next {
        right: 2.1875vw
    }
}

.ana-box .slick-slide {
    transition: all ease-in-out .3s;
    opacity: .2
}

.ana-box .slick-active {
    opacity: 1
}

.ana-box .slick-current {
    opacity: 1
}

@media print,
screen and (min-width: 768px) {
    .ana-list-btn {
        width: 1260px;
        padding: 0 20px;
        margin: auto;
        position: relative
    }
}

.ana-list-btn p {
    margin: 0
}

.ana-list-btn p a {
    display: block;
    color: #362e2b;
    font-size: 13px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    width: 220px;
    height: 40px;
    border: 2px solid #362e2b;
    border-radius: 8px
}

@media print,
screen and (min-width: 768px) {
    .ana-list-btn p a {
        position: absolute;
        top: -450px;
        right: 20px
    }
}

@media (max-width: 767px) {
    .ana-list-btn p a {
        font-size: 12px;
        line-height: 38px;
        width: 84.375vw;
        height: 40px;
        margin: 40px auto;
        position: relative
    }
}

.ana-list-btn p a:hover {
    opacity: 0.7
}

.ana-list-btn p a::after {
    content: '\f04b';
    font-family: fontAwesome;
    color: #362e2b;
    font-size: 10px;
    position: absolute;
    top: 0px;
    right: 10px;
    margin: 0
}

@media (max-width: 767px) {
    .ana-list-btn p a::after {
        top: 0;
        right: 15px
    }
}

.preview-area {
    background: #e2ddd1
}

@media print,
screen and (min-width: 768px) {
    .preview-area {
        padding: 60px 0 30px;
        position: relative
    }
}

@media (max-width: 767px) {
    .preview-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .preview-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .preview-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .preview-title h2 {
        background: url(../images2021/preview-title.png) no-repeat 0 0;
        background-size: 42px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 58px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .preview-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .preview-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/preview-title.png) no-repeat 0 0;
        background-size: 27px auto;
        width: 27px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .preview-box {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 1120px;
        margin: auto
    }
}

.preview-box .empty {
    display: none
}

.preview-item {
    background: #fff
}

@media print,
screen and (min-width: 768px) {
    .preview-item {
        width: 540px;
        border-radius: 8px;
        padding: 25px 29px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .preview-item {
        width: 93.75vw;
        border-radius: 4px;
        padding: 16px 4.6875vw;
        margin: 0 auto 20px
    }
}

.preview-item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #362e2b;
    text-decoration: none
}

@media (max-width: 767px) {
    .preview-item a {
        width: 100%
    }
}

.preview-item a:hover {
    opacity: 0.7
}

@media print,
screen and (min-width: 768px) {
    .preview-photo {
        width: 230px;
        flex-basis: 230px
    }
}

@media (max-width: 767px) {
    .preview-photo {
        width: 40.625vw;
        flex-basis: 40.625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .preview-title {
        width: 240px;
        flex-basis: 240px
    }
}

@media (max-width: 767px) {
    .preview-title {
        width: 40.625vw;
        flex-basis: 40.625vw
    }
}

.preview-title p {
    font-size: 16px;
    line-height: 1.5
}

@media (max-width: 767px) {
    .preview-title p {
        font-size: 14px
    }
}

.cinema-area {
    background: #f8f5ed
}

@media print,
screen and (min-width: 768px) {
    .cinema-area {
        padding: 60px 0 30px;
        position: relative
    }
}

@media (max-width: 767px) {
    .cinema-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .cinema-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .cinema-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .cinema-title h2 {
        background: url(../images2021/cinema-title.png) no-repeat 0 0;
        background-size: 42px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 58px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .cinema-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .cinema-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/cinema-title.png) no-repeat 0 0;
        background-size: 27px auto;
        width: 27px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .cinema-banner-box {
        width: 1120px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .cinema-banner-box {
        width: 93.75vw;
        margin: auto
    }
}

.cinema-banner-box ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

@media print,
screen and (min-width: 768px) {
    .cinema-banner-box ul {
        margin: 0 -13px
    }
}

@media (max-width: 767px) {
    .cinema-banner-box ul {
        margin: 0 -1.5625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .cinema-banner-box ul li {
        flex-basis: 260px;
        width: 260px;
        margin: 0 13px 25px
    }
}

@media (max-width: 767px) {
    .cinema-banner-box ul li {
        flex-basis: 45.3125vw;
        width: 45.3125vw;
        margin: 0 1.5625vw 16px
    }
}

@media print,
screen and (min-width: 768px) {
    .banner-area {
        padding: 60px 0 30px;
        position: relative
    }
}

@media (max-width: 767px) {
    .banner-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .banner-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .banner-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .banner-banner-box {
        width: 1120px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .banner-banner-box {
        width: 93.75vw;
        margin: auto
    }
}

.banner-banner-box ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

@media print,
screen and (min-width: 768px) {
    .banner-banner-box ul {
        margin: 0 -13px
    }
}

@media (max-width: 767px) {
    .banner-banner-box ul {
        margin: 0 -1.5625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .banner-banner-box ul li {
        flex-basis: 260px;
        width: 260px;
        margin: 0 13px 25px
    }
}

@media (max-width: 767px) {
    .banner-banner-box ul li {
        flex-basis: 45.3125vw;
        width: 45.3125vw;
        margin: 0 1.5625vw 16px
    }
}

@media print,
screen and (min-width: 768px) {
    .information-area {
        padding: 20px 0 80px;
        position: relative
    }
}

@media (max-width: 767px) {
    .information-area {
        padding: 35px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .information-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .information-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .information-title h2 {
        background: url(../images2021/information-title.png) no-repeat 0 0;
        background-size: 46px auto;
        font-size: 26px;
        font-weight: 700;
        padding: 16px 0 16px 60px;
        margin: 0 0 40px
    }
}

@media (max-width: 767px) {
    .information-title h2 {
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        padding: 12px 0 12px 0;
        margin: 0 0 40px
    }

    .information-title h2::before {
        content: '';
        display: inline-block;
        background: url(../images2021/information-title.png) no-repeat 0 0;
        background-size: 31px auto;
        width: 31px;
        height: 40px;
        margin: 0 9px -14px 0
    }
}

@media print,
screen and (min-width: 768px) {
    .information-box-inner {
        display: flex;
        justify-content: space-between
    }
}

.info-list {
    border-top: 1px solid #c8c8c8
}

@media print,
screen and (min-width: 768px) {
    .info-list {
        width: 880px;
        flex-basis: 880px
    }
}

@media (max-width: 767px) {
    .info-list {
        width: 93.75vw;
        margin: 0 auto 50px
    }
}

.info-item {
    border-bottom: 1px solid #c8c8c8
}

@media print,
screen and (min-width: 768px) {
    .info-item {
        padding: 15px 10px
    }
}

@media (max-width: 767px) {
    .info-item {
        padding: 15px 0px
    }
}

.info-item-date {
    color: #a7a7a7;
    font-size: 12px;
    margin: 0 0 6px
}

.info-item-text {
    color: #362e2b;
    font-size: 16px;
    line-height: 1.5;
    margin: 0
}

@media (max-width: 767px) {
    .info-item-text {
        font-size: 14px
    }
}

.info-item-text a {
    color: #362e2b;
    text-decoration: none
}

.info-item-text a:hover {
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {
    .info-ad {
        width: 300px;
        flex-basis: 300px
    }
}

@media (max-width: 767px) {
    .info-ad {
        text-align: center;
        width: 93.75vw;
        margin: auto
    }
}

.banner2-area {
    background: #f8f5ed
}

@media print,
screen and (min-width: 768px) {
    .banner2-area {
        padding: 50px 0 30px;
        position: relative
    }
}

@media (max-width: 767px) {
    .banner2-area {
        padding: 40px 0 25px
    }
}

@media print,
screen and (min-width: 768px) {
    .banner2-area-inner {
        width: 1260px;
        padding: 0 20px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .banner2-area-inner {
        padding: 0px
    }
}

@media print,
screen and (min-width: 768px) {
    .banner2-banner-box {
        width: 960px;
        margin: auto
    }
}

@media (max-width: 767px) {
    .banner2-banner-box {
        width: 93.75vw;
        margin: auto
    }
}

.banner2-banner-box ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

@media print,
screen and (min-width: 768px) {
    .banner2-banner-box ul {
        margin: 0 -10px
    }
}

@media (max-width: 767px) {
    .banner2-banner-box ul {
        margin: 0 -1.5625vw
    }
}

@media print,
screen and (min-width: 768px) {
    .banner2-banner-box ul li {
        flex-basis: 225px;
        width: 225px;
        margin: 0 10px 20px
    }
}

@media (max-width: 767px) {
    .banner2-banner-box ul li {
        flex-basis: 45.3125vw;
        width: 45.3125vw;
        margin: 0 1.5625vw 16px
    }
}