@charset "utf-8";

/*---------- オータムフェスト　ページ共通 ----------*/

#saf6 {
    background: #f7f7f7;
    color: #4d3b42;
    line-height: 1.6;
    width: 100%;
    overflow: hidden;
    font-size: 3.5vw;
}

#saf6 .inner {
    max-width: 1216px;
    position: relative;
    z-index: 2;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

#saf6 img {
    vertical-align: bottom;
}

#saf6 article,
#saf6 section {
    background: inherit;
    position: relative;
}

#saf6 article:nth-of-type(odd) {
    background: #f7f7f7;
}

#saf6 article:nth-of-type(even) > section {
    background: inherit;
}

#saf6 article:nth-of-type(even),
#saf6 .bgYellow {
    background: #fff6e4;
}

#saf6 article:nth-of-type(even) > section:nth-of-type(odd),
#saf6 .bgYellow > section:nth-of-type(even) {
    background: #fffaf2;
}

#saf6 > article:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 4.875vw;
    top: -4.875vw;
    background: inherit;
    clip-path: url("#svgPath1");
    z-index: 0;
    pointer-events: none;
}

#saf6 > .hero.sub + article:before,
#saf6 > article section:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 3.125vw;
    top: -3.125vw;
    background: inherit;
    clip-path: url("#svgPath2");
    z-index: 0;
    pointer-events: none;
}

#saf6 article .inner {
    padding: 40px 0;
    padding-bottom: calc(4.875vw + 40px);
}

#saf6 article .inner .ttl {
    text-align: center;
}
#saf6 article .inner:has(+ section),
#saf6 article section .inner {
    padding-bottom: calc(3.125vw + 40px);
}

#saf6 .text-left{
    text-align: left;
}

#saf6 .text-center{
    text-align: center;
}

#saf6 .text-right{
    text-align: right;
}

#saf6 .text-right{
    text-align: right;
}

#saf6 .display-1 {
    font-size: 250%;
}

#saf6 .display-2 {
    font-size: 200%;
}

#saf6 .display-3 {
    font-size: 115%;
}

#saf6 .display-4 {
    font-size: 108%;
}

#saf6 .display-5 {
    font-size: 100%;
}

#saf6 .display-6 {
    font-size: 85%;
}

#saf6 article > .ttlWrap .inner {
    font-weight: bold;
    padding-bottom: calc(3.125vw + 40px);
}

#saf6 .ttl {
    font-weight: bold;
    letter-spacing: 0.01em;
    margin-bottom: 0.6em;
}

#saf6 .ttl span {
    display: block;
    font-size: 42.85%;
    color: #d93530;
    line-height: 1;
}

#saf6 a.btn {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: normal;
    text-align: center;
    padding: 1em;
    border-radius: 3em;
    background: #d93530;
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
}

#saf6 a.btn:hover {
    opacity: 0.8;
}

#saf6 #backtotop .inner {
    padding: 60px 0 60px;
}
#saf6 #backtotop .btn {
    max-width: 500px;
    margin: 0 auto;
}

/*---------- メインビジュアル ----------*/

#saf6 > .hero {
    background: #ede8d8 repeating-linear-gradient(90deg, transparent, transparent 8px, rgb(255 255 255 / 60%) 8px, rgb(255 255 255 / 60%) 9px,transparent 9px,transparent 14px,rgb(255 255 255 / 60%) 14px,rgb(255 255 255 / 60%) 29px,transparent 29px,transparent 34px,rgb(255 255 255 / 60%) 34px,rgb(255 255 255 / 60%) 35px,transparent 35px, transparent 43px);
    transition: 0.3s;
}

#saf6 > .hero:before,
#saf6 > .hero:after {
    content: "";
    position: absolute;
    width: 5em;
    height: 5em;
    top: -1.5em;
    pointer-events: none;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 0;
}

#saf6 > .hero:before {
    left: -1em;
    background-image: url("../images/leaf_01.png");
}

#saf6 > .hero:after {
    right: -1em;
    background-image: url("../images/leaf_02.png");
}

#saf6 > .hero .inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px 15px;
    padding-bottom: calc(4.875vw + 30px);
    pointer-events: none;
    z-index: 1;
    position: relative;
}

#saf6 > .hero h1{
    width: 100%;
    max-width: 864px;
}

#saf6 > .hero h2 {
    margin-top: 20px;
    width: 58.333%;
    max-width: 504px;
}

#saf6 > .hero.sub:has(a:hover) {
    background-color: #f0ede3;
}

#saf6 > .hero.sub .inner {
    flex-direction: initial;
    justify-content: space-between;
    padding-bottom: calc(3.125vw + 25px);
    padding-right: 0;
    pointer-events: auto;
    transition: 0.3s;
}
#saf6 > .hero.sub:before,
#saf6 > .hero.sub:after {
    width: 4em;
    height: 4em;
    top: -1em;
}

#saf6 > .hero.sub:before {
    left: -1.5em;
}

#saf6 > .hero.sub:after {
    right: -0.6em;
}

#saf6 > .hero.sub .inner:hover {
    opacity: 0.7;
}

#saf6 > .hero.sub h1 {
    width: 53%;
}

#saf6 > .hero.sub h2 {
    width: 40%;
    margin: 0;
}


/*---------- コンテンツトップ　概要 ----------*/

#saf6 #outline .ttlWrap .inner {
    padding: 50px 0 0;
}

#saf6 #outline section {margin-top: 4em;}

#saf6 #outline section:before {
    width: 5em;
    height: 5em;
    top: -3em;
    bottom: auto;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    clip-path: none;
    z-index: 1;
    left: 0em;
    background-image: url(../images/leaf_03.png);
    transform: rotate(15deg);
}

#saf6 #outline section:nth-of-type(even):before {
    top: -3.6em;
    bottom: auto;
    right: -0.8em;
    left: auto;
    background-image: url(../images/leaf_04.png);
    transform: rotate(80deg);
}

#saf6 #outline section .ttlWrap {
    text-align: left;
    margin: 40px 10px;
}

#saf6 #outline section:last-of-type {
    display: block;
    text-align: center;
    padding-bottom: calc(4.875vw + 40px);
}

#saf6 #outline section:last-of-type:before {
    content: none;
}

#saf6 #outline section .imgWrap {
    width: 100%;
    object-fit: cover;
    background: #f9ebb7;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

#saf6 #outline section .imgWrap img {
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#saf6 #outline section .imgWrap + .ttlWrap {
}

#saf6 #outline section a.btn {
    margin-top: 30px;
}


#saf6 #about > .inner {
}

#saf6 .aboutList {display: flex;flex-wrap: wrap;align-items: center;}

#saf6 .aboutList dt, #saf6 .aboutList dd {
    margin-bottom: 1.3em;
}

#saf6 .aboutList dt:last-of-type,
#saf6 .aboutList dd:last-of-type {
    margin-bottom: 0;
}

#saf6 .aboutList dt {
    width: 6em;
    margin-right: 1em;
    padding: 0.3em;
    background: #d93530;
    color: #fff;
    text-align: center;
    border-radius: 0.5em;
}

#saf6 .aboutList dd {
    width: calc(100% - 7em);
}

/*---------- コンテンツトップ　よくあるご質問/ご利用にあたり ----------*/

#saf6 .qaList {
    /* display: flex; */
    /* flex-wrap: wrap; */
    /* align-items: center; */
    /* justify-content: space-between; */
    /* font-size: 107.14%; */
}

#saf6 .qaList dt,
#saf6 .qaList dd {
    margin-bottom: 2em;
    display: flex;
    align-items: center;
    position: relative;
}

#saf6 .qaList dt:before {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 1.7em;
    height: 1.7em;
    font-weight: bold;
    background: #d93530;
    color: #fff;
    margin-right: 0.8em;
    border-radius: 50%;
}

#saf6 .qaList dt:before {
    content: "Q";
}

#saf6 .qaList dd:before {
}

#saf6 .qaList dt:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 11px;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: auto;
    background: url("../images/balloon_bottom.png") no-repeat bottom center;
}

#saf6 .qaList dd:last-of-type {
    margin-bottom: 0;
}

#saf6 .qaList dt {
    width: 100%;
    justify-content: center;
    padding-bottom: 1em;
}

#saf6 .qaList dd {
    /* width: 64%; */
}

/*---------- コンテンツトップ　注意事項/お問合せ ----------*/

#saf6 #operation .inner {
    padding-bottom: 40px;
}

#saf6 #precautions li {
    display: inline;
    margin-right: 1em;
}

#saf6 #inquiry >.ttl {
    margin-top: 2em;
}

#saf6 #inquiry ul {
    /* display: flex; */
    /* justify-content: space-between; */
}

#saf6 #inquiry li {
    border-top: 1px solid #ccc;
    padding: 1em 0;
}

#saf6 #inquiry li:first-of-type {
    border: none;
}

/*---------- 番組コラボメニュー ----------*/
#saf6 #collaboration .ttlWrap{
    position:relative;
}

#saf6 #collaboration .ttlWrap:before,
#saf6 #collaboration .ttlWrap:after {
    content: "";
    position: absolute;
    width: 4em;
    height: 4em;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    clip-path: none;
    z-index: 1;
    pointer-events: none;
}

#saf6 #collaboration .ttlWrap:before {
    top: 0;
    left: -0.7em;
    background-image: url(../images/leaf_03.png);
}

#saf6 #collaboration .ttlWrap:after {
    position: absolute;
    bottom: 0em;
    right: -1em;
    background-image: url(../images/leaf_04.png);
    transform: rotate(20deg);
}

#saf6 #collaboration section .inner {
}

#saf6 #collaboration .logo {
    width: 100%;
    margin: 0 auto;
}

#saf6 #collaboration .logo img {
    display: block;
    width: 100%;
    max-width: 650px;
    margin: 0 auto;
}

#saf6 #collaboration section .ttl {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    font-weight: bold;
    font-size: 183%;
    margin: 1em auto;
    color: #d53530;
    letter-spacing: 0.068em;
}

#saf6 #collaboration .description {
    display: flex;
    flex-direction: column;
    margin-top: 1.5em;
}

#saf6 #collaboration .caption {
    font-size: 120%;
    font-weight: bold;
    margin: auto 0;
    line-height: 1.6;
}

#saf6 #collaboration .caption + p {
    margin-top: 0.5em;
}

#saf6 #collaboration a.btn {
    max-width: 500px;
    margin: 0 auto;
    margin-top: 30px;
}

#saf6 #collaboration .recomend {
    border: 1px solid #e8a294;
    padding: 12px;
    border-radius: 12px;
    margin-top: 1.5em;
}

#saf6 #collaboration .author {
    margin-bottom: 1em;
}

#saf6 #collaboration .author img {
    object-fit: cover;
    width: 6.8em;
    height: 6.8em;
    aspect-ratio: 1/1;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 3px 3px 3px rgb(0 0 0 / 20%);
    margin-right: 1em;
    margin-bottom: 1em;
    float: left;
}

#saf6 #collaboration .authorName {
    font-weight: bold;
    font-size: 131.3%;
    float: left;
    margin: 1.7em 0;
    width: calc(100% - 6em);
}

#saf6 #collaboration .authorName span {
    background: linear-gradient(transparent 65%, rgb(217 53 48 / 30%) 65%,rgb(217 53 48 / 30%) 90%,transparent 90%);
}

#saf6 #collaboration .authorComment {
    min-height: 2.8em;
    letter-spacing: 0.013em;
    clear: both;
    display: block;
}

#saf6 #collaboration .recomendItem li {
    display: flex;
    align-items: center;
    margin-top: 0.6em;
    padding-top: 0.6em;
    border-top: 2px dotted rgb(232 162 148 / 50%);
}

#saf6 #collaboration .recomend .recomendItem li:first-of-type {
    padding-top: 0;
    margin-top: 0;
    border-top: none;
}

#saf6 #collaboration .recomendItem img {
    width: 7.3em;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    margin-right: 1em;
}

#saf6 #collaboration .recomendText {
    font-weight: bold;
    font-size: 118%;
    letter-spacing: 0.055em;
}

#saf6 #collaboration .recomendText span {
    font-size: 62.5%;
    display: block;
}

#saf6 #collaboration .gallery {
    width: 100vw;
    margin-left: -10px;
}

#saf6 #collaboration .gallery .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#saf6 #collaboration .gallery-slider {
    width: 100%;
    aspect-ratio: 16 / 9;
    margin-bottom: 10px;
}

#saf6 #collaboration .gallery-slider .swiper-slide {
    border: 1px solid rgb(77 59 66 / 20%);
}

#saf6 #collaboration .gallery-slider .swiper-slide iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#saf6 #collaboration .gallery-thumbs {
    width: 100%;
    padding: 0;
}

#saf6 #collaboration .gallery-thumbs .swiper-slide {
    width: calc(100% / 4.4);
    aspect-ratio: 4 / 3;
    border: 1px solid rgb(77 59 66 / 20%);
}

#saf6 #collaboration .gallery-thumbs .swiper-slide-active,
#saf6 #collaboration .gallery-thumbs .swiper-slide-active:hover {
    border: 1px solid #ebbe10;
}

#saf6 #collaboration .gallery-thumbs .swiper-slide img {
    opacity: 0.6;
    transition: 0.3s;
    cursor: pointer;
}

#saf6 #collaboration .gallery-thumbs .swiper-slide:hover img {
    opacity: 0.8;
}

#saf6 #collaboration .gallery-thumbs .swiper-slide-active img,
#saf6 #collaboration .gallery-thumbs .swiper-slide-active:hover img {
    opacity: 1;
}


@media screen and (max-width: 820px) {
    #saf6 #collaboration section .inner {
    }
    #saf6 #collaboration .gallery,
    #saf6 #collaboration .description {
    }
    #saf6 #collaboration .description {
    }
}




#saf6 #schedule .ttlWrap .inner{
    padding-bottom: 40px;
}

#saf6 #schedule section .inner {
    padding-top: 0;
}
#saf6 #schedule section:before,
#saf6 #schedule section:after {
    content: "";
    position: absolute;
    width: 4em;
    height: 4em;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    clip-path: none;
    z-index: 1;
    pointer-events: none;
}

#saf6 #schedule section:before {
    top: -2em;
    left: -0.7em;
    background-image: url(../images/leaf_03.png);
}

#saf6 #schedule section:after {
    bottom: 0;
    right: -1em;
    background-image: url(../images/leaf_04.png);
    transform: rotate(20deg);
}

#saf6 #schedule .contentsWrap {
    border-radius: 20px;
    background-color: #fff;
    overflow: hidden;
    margin-bottom: 32px;
    display: flex;
    flex-direction: column;
}

#saf6 #schedule .contentsWrap:last-of-type {
    margin-bottom: 0;
}

#saf6 #schedule .contentsWrap .ttl {
    background-color: #d93530;
    color: #fff;
    padding: 1%;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    margin: 0;
}

#saf6 #schedule .tableWrap {
    margin: 12px;
    overflow-x: scroll;
}

#saf6 #schedule table {
    font-weight: bold;
    width: 100%;
    line-height: 1.55;
    min-width: 850px;
    border-collapse: separate;
    border-top: solid 1px #b7b0b3;
}

#saf6 #schedule th,
#saf6 #schedule td {
    background: #fff;
    border-right: solid 1px #b7b0b3;
    border-bottom: solid 1px #b7b0b3;
    vertical-align: middle;
    padding: 0.3em 0.7em;
}

#saf6 #schedule th {
    font-size: 111%;
    min-width: 5.4em;
    position: sticky;
    left: 0;
    z-index: 5;
    border-left: solid 1px #b7b0b3;
}

#saf6 #schedule th span {
    font-size: 0.6em;
}

#saf6 #schedule td.time {
    min-width: 8em;
}

#saf6 #schedule table td span {
    display: block;
    font-weight: normal;
    font-size: 72.222%;
    margin-top: 0.3em;
    line-height: 1.4;
}

#saf6 #schedule .sat th,#saf6 #schedule .sat td {
    background-color: #f4f9fb;
}

#saf6 #schedule .sat th {
    color: #2c7cb6;
}

#saf6 #schedule .sun th,#saf6 #schedule .sun td {
    background-color: #fff9f9;
}

#saf6 #schedule .sun th {
    color: #d53530;
}

#saf6 #schedule .textCnter {
    text-align: center;
}

#saf6 #schedule .dj_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px;
    margin: 12px;
    text-align: center;
    font-weight: bold;
}

#saf6 #artist > .ttlWrap .inner {
    padding: 50px 0 0;
}

#saf6 #artist > .ttlWrap .ttl {
    margin-bottom: 0.3em;
}

#saf6 #artist > .ttlWrap .notes {
    font-weight: normal;
}

#saf6 #artist section {
    margin-top: 1em;
    background: none;
}

#saf6 #artist section:before {
    width: 3.5em;
    height: 3.5em;
    top: -2em;
    bottom: auto;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    clip-path: none;
    z-index: 1;
    left: 0em;
    background-image: url(../images/leaf_03.png);
    transform: rotate(10deg);
}

#saf6 #artist section:nth-of-type(even):before {
    bottom: auto;
    right: 0;
    left: auto;
    background-image: url(../images/leaf_04.png);
    transform: rotate(80deg);
}

#saf6 #artist section .ttlWrap {
    text-align: left;
    margin: 1.3em 10px 3em;
}

#saf6 #artist section .ttlWrap span {
    color: #4d3b42;
}

#saf6 #artist section:last-of-type {
    display: block;
    text-align: center;
    padding-bottom: calc(4.875vw + 40px);
}

#saf6 #artist section:last-of-type:before {
    content: none;
}

#saf6 #artist section .imgWrap {
    width: 100%;
    object-fit: contain;
    background: #f9ebb7;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

#saf6 #artist section .imgWrap img {
    max-width: none;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gFooter .pageTop {
    display: none;
}