/* -------------------------------------------- fv */

/* .fv { border-bottom: 1px solid #B3B3B3; } */
.fv a { opacity: 1 ! important; }
.fv .slider { width: 100%; overflow: hidden; }
.fv .slider .slide { padding-top: 57%; position: relative; overflow: hidden; box-sizing: border-box; }
.fv .slider .slide a { display: block; }
.fv .slider .slide picture { display: block; }
.fv .slider .slide img { position: absolute; width: auto; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.fv .slider .dots { left: 0; right: 0; bottom: 1.5rem; margin: auto; }
.fv .slider .slick-dots { display: flex; flex-wrap: wrap; justify-content: center; }
.fv .slider .slick-dots li { width: 3rem; height: 4px; margin: 0 8px; position: relative; overflow: hidden; cursor: pointer; }
.fv .slider .slick-dots li::before,
.fv .slider .slick-dots li::after { width: 100%; content: ''; display: block; position: absolute; height: 50%; left: 0; margin: auto; top: 0; bottom: 0; }
.fv .slider .slick-dots li::after {  width: 0%; background: #DA2308; }
.fv .slider .slick-dots li.slick-active::after { transition: 4.1s linear; width: 100%; }
.fv .slider .slick-dots li::before { background-color: #dadada; }
.fv .slider .slick-dots button { width: 1px; font-size: 0px; opacity: 0; position: absolute; left: -100%; }

/* -------------------------------------------- about */

.about { padding: 2rem 0 6rem; }
.about .box { margin-top: -4rem; }
.about h3 { font-size: 2.25rem; line-height: 180%; }
.about .txt { padding: 1.5rem 0 3rem; }

/* -------------------------------------------- event */

.event { padding: 340px 0 6rem; overflow: hidden; background-image: url(../img/top/bg-event.jpg); }
.event::before { left: 0; top: 0; width: 100%; height: 580px; background: url(../img/top/event-img1.jpg) no-repeat center center; background-size: cover; z-index: 0; }
.event .wbox { padding: 4rem 0 6rem; width: calc(100% - 3%); max-width: calc(50% + 800px); box-sizing: border-box; z-index: 1; }
.event_wrap { width: 97%; max-width: 1600px; padding: 0 4%; box-sizing: border-box; }
.event_inner { max-width: 1200px; box-sizing: border-box; margin: auto; }
.event .col_left { max-width: 500px; width: 42%; }
.event .col_left .head1 { padding-top: 1.25rem; }
.event .col_left .btn_wrap { padding: 3rem 0 5rem; }
.event .col_left .event_item .row dl { font-size: 18px; }
.event .col_left .event_item .row dl dt { width: 120px; }
.event .col_left .event_item .row dl dd { width: calc(100% - 120px); }
.event .col_left .event_item .ttl { font-size: 1.75rem; }
.event .col_left .event_item .cat { font-size: 1rem; }
.event .col_right { width: 56%; max-width: 650px; }
.event .col_right .event_item .ttl { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.event .bnr { max-width: 1000px; }
.event .bnr_wrap a { display: block; width: 48%; }

/* -------------------------------------------- performance */

.performance { padding: 6rem 0; }
.performance h3 { font-size: 1.75rem; }
.performance h3 span { display: block; font-size: 2.25rem; }
.performance ul { padding: 2rem 0 0; }
.performance ul li { width: calc((100% / 3) - 1rem); padding-bottom: 3rem; }
.performance ul li a figure { padding-top: 52%; }
.performance ul li a:hover figure img { width: 104%; }
.performance ul li .ttl { font-size: 2rem; padding: 1rem 0 0; line-height: 110%; }
.performance ul li .ttl span { font-size: 1rem; display: block; text-transform: uppercase; letter-spacing: 2px; }
.performance .bnr { width: 94%; max-width: 640px; }

/* -------------------------------------------- works */

.works { padding: 4rem 0; }
.works .slider { padding-bottom: 4rem; }
.works .btn_wrap { max-width: 1000px; margin: auto; }
.works .slider .slide figure img { height: 100%; width: auto; }

/* -------------------------------------------- lineup */

.lineup { padding: 4rem 0 2rem; }
.lineup ul { padding: 4rem 0; }
.lineup ul li { width: 48%; padding-bottom: 2rem; }
.lineup ul li figure { padding-top: 50%; }
.lineup ul li .txt { padding: 0.75rem 0; }
.lineup ul li .tll { font-size: 2rem; padding: 0 1.25rem; line-height: 180%; display: inline-block; }
.lineup ul li .tll::before,
.lineup ul li .tll::after { width: 25px; height: 25px; }
.lineup ul li .tll::before { top: 0; left: 0; border-left: 1px solid #DDDDDD; border-top: 1px solid #DDDDDD; }
.lineup ul li .tll::after { bottom: 0; right: 0; border-right: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; }
.lineup ul li .link { padding: 0.75rem 0 0; }

/* -------------------------------------------- fudosan */

.fudosan { padding: 6rem 0; border-top: 1px solid #AAAAAA; }

/* -------------------------------------------- sns */

.sns { padding: 4rem 0 6rem; }
.sns_wrap { padding: 4rem 0 0; }
.sns .col { box-sizing: border-box; }
.sns .col:first-child { border-right: 1px solid #000; }
.sns .col .ttl { font-size: 2.5rem; line-height: 100%; }
.sns .col .ttl .icon { margin-right: 0.5rem; width: 25px; }
.sns .col.yt .ttl .icon { width: 30px; }
.sns .ig { width: 46.5%; }
.sns .yt { width: 53.5%; }
.sns .ig ul { width: 92%; padding-top: 1.5rem; }
.sns .ig ul li { width: calc((100% / 3) - 0.5rem); margin-bottom: 0.75rem; background-color: #ffffff; }
.sns .yt ul { width: 92%; margin-left: auto; margin-right: 0; padding-top: 1.5rem; }
.sns .yt ul li:first-child { width: 100%; }
.sns .yt ul li { width: 48%; margin-bottom: 4%; }
.sns .yt ul li a { display: block; }
.sns .yt ul li a figure { padding-top: 56%; }

/* -------------------------------------------- staff */

.staff { padding: 4rem 0; }
.staff .btn_wrap { padding-top: 4rem; }
.staff ul { padding: 3rem 0 0; }
.staff ul li { width: calc((100% / 5) - 0.5rem); }
.staff ul li a { color: #fff; display: block; }
.staff ul li a .ttl { padding-top: 1rem; font-size: 15px; }
.staff ul li a .name { font-size: 1.25rem; padding: 2px 0; }
.staff ul li .pos { font-size: 12px; }

/* -------------------------------------------- articles */

.articles { padding: 4rem 0; }
.articles .col { width: 31%; }
.articles .col .head1 { padding-bottom: 2rem; }
.articles .col .head1 .ttl { font-size: 4rem; }
.articles .col .head1 .sub_ttl { font-size: 1.1rem; }
.articles .col ul li { padding: 1.5rem 0; border-top: 1px solid #DCDCDC; }
.articles .col ul li:first-child { border: none; } 
.articles .col ul li .pic { width: 100px; }
.articles .col ul li .info { width: calc(100% - 115px); } 
.articles .col ul li .tags span { height: 20px; line-height: 20px; display: inline-block; border: 1px solid #DCDCDC; font-size: 11px; padding: 0 0.5rem; }
.articles .col ul li .ttl { font-size: 15px; font-weight: 600; padding: 0.5rem 0 0.25rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.articles .col ul li .date { font-size: 12px; color: #555555; }
.articles .col ul li .row { width: 100%; }
.articles .col.blog ul li .ttl { padding: 0 0 2px; }
.articles .col ul li .author figure { width: 36px;  }
.articles .col ul li .author .details { width: calc(100% - 50px); }
.articles .col ul li .author .name { line-height: 100%; padding-bottom: 0.5rem; }
.articles .col ul li .author .pos { font-size: 12px; color: #555555; line-height: 100%; }
.articles .col .link { padding-top: 2rem; }

/* -------------------------------------------- tablet */

@media screen and (max-width: 1100px) {

    .event { padding-top: 12rem; }
    .event::before { height: 400px; }
    .event .wbox { padding: 2rem 0; }
    .event_wrap .head1 { text-align: center; padding-bottom: 2rem; }
    .event .col_left { width: 100%; max-width: none; padding-bottom: 2rem; }
    .event .col_left .event_item { max-width: 520px; margin: auto; }
    .event .col_right { width: 100%; max-width: none; }
    
    .performance h3 { font-size: 1.5rem; }
    .performance h3 span { font-size: 1.75rem; }
    .performance ul li { width: 32%; }
    .performance ul li .ttl { font-size: 1.25rem; }

    .performance .bnr_wrap { padding-top: 0; }

    .works .slider { padding-bottom: 2rem; }
    .works .btn_wrap { width: 88%; margin: auto; }

    .articles { padding: 0 0 4rem; }
    .articles .col { width: 100%; max-width: 520px; margin: auto; }
    .articles .col .head1 { padding: 3rem 0 1rem; }
    .articles .col .link { padding-top: 1rem; text-align: center; }
}

/* -------------------------------------------- sp */

@media screen and (max-width: 767px) {
    .fv { border-bottom: 1px solid #DCDCDC; }
    .fv .slider .slide { padding-top: 178%; }

    .fv .slider .dots { bottom: 1rem; }
    .fv .slider .slick-dots li::before { background-color: #DCDCDC; }

    .about { padding-top: 0; }
    .about .box { margin: 0; }
    .about h3 { font-size: 1.65rem; line-height: 150%; }
    .about .txt { font-size: 1rem; padding: 1rem 0 2rem; }
    
    .event::before { height: 200px; }
    .event .wbox { width: 100%; }
    .event_wrap { width: 88%; padding: 0; margin: auto; }
    .event_wrap .bnr_wrap { padding: 0; }
    .event .col_right { margin: auto; max-width: 520px; }

    .event .bnr_wrap a { width: 100%; margin: 0.5rem 0; }

    .performance h3 { font-size: 1rem; }
    .performance h3 span { line-height: 150%; padding-top: 1rem; }
    .performance ul li { width: 100%; }

    .slider1 .slide { width: 250px !important; }

    .lineup ul { padding: 2rem 0; }
    .lineup ul li .txt { font-size: 12px; }
    .lineup ul li { width: 100%; }
    .lineup ul li .tll { font-size: 1.5rem; }
    .lineup ul li .tll::before,
    .lineup ul li .tll::after { width: 15px; height: 15px; }
    .lineup ul li .link a { font-size: 12px; }

    .sns { padding: 3rem 0; }
    .sns_wrap { padding: 2rem 0 0; }
    .sns .col { width: 100%; border: none !important; }
    .sns .ig ul { width: 100%; }
    .sns .yt { padding-top: 2rem; }
    .sns .yt ul { width: 100%; }
    
    .staff ul { max-width: 520px; margin: auto; }
    .staff ul li { width: 100%; display: flex; border-top: 1px solid #cacaca; }
    .staff ul li:first-child { border: none; }
    .staff ul li a { padding: 1rem 0; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; }
    .staff ul li figure { width: 100px; }
    .staff ul li .info { width: calc(100% - 120px); }
    .staff ul li a .ttl { padding: 0; }
    .staff ul li .pos { font-size: 10px; }

    .fudosan { padding: 3rem 0; }
}