@charset "utf-8";
/* CSS Document */

body { font-size:calc(18 * 0.25vw); line-height: 1.8; }
:target { scroll-margin-top: calc(108vw / 7.2); }

.manrope { font-weight: 700; }


.pc { display:none; }
.sp { display:block; }



.sp_left { text-align:left; }

.fs10vw { font-size:calc(10 * 0.25vw); }
.fs12vw { font-size:calc(12 * 0.25vw); }
.fs14vw { font-size:calc(14 * 0.25vw); }
.fs15vw { font-size:calc(15 * 0.25vw); }
.fs16vw { font-size:calc(16 * 0.25vw); }
.fs17vw { font-size:calc(17 * 0.25vw); }
.fs18vw { font-size:calc(18 * 0.25vw); }
.fs20vw { font-size:calc(20 * 0.21vw); }
.fs21vw { font-size:calc(20 * 0.21vw); }
.fs22vw { font-size:calc(22 * 0.20vw); }
.fs23vw { font-size:calc(23 * 0.20vw); }
.fs24vw { font-size:calc(24 * 0.19vw); }
.fs25vw { font-size:calc(25 * 0.19vw); }
.fs26vw { font-size:calc(26 * 0.19vw); }
.fs27vw { font-size:calc(27 * 0.18vw); }
.fs28vw { font-size:calc(28 * 0.18vw); }
.fs29vw { font-size:calc(29 * 0.18vw); }
.fs30vw { font-size:calc(30 * 0.18vw); }
.fs32vw { font-size:calc(32 * 0.18vw); }
.fs34vw { font-size:calc(34 * 0.18vw); }
.fs35vw { font-size:calc(35 * 0.18vw); }
.fs36vw { font-size:calc(36 * 0.18vw); }
.fs37vw { font-size:calc(37 * 0.18vw); }
.fs38vw { font-size:calc(38 * 0.17vw); }
.fs40vw { font-size:calc(40 * 0.17vw); }
.fs42vw { font-size:calc(42 * 0.17vw); }
.fs45vw { font-size:calc(45 * 0.17vw); }
.fs48vw { font-size:calc(48 * 0.14vw); }
.fs50vw { font-size:calc(50 * 0.17vw); }
.fs52vw { font-size:calc(52 * 0.17vw); }
.fs54vw { font-size:calc(54 * 0.17vw); }
.fs56vw { font-size:calc(56 * 0.15vw); }
.fs58vw { font-size:calc(58 * 0.15vw); }
.fs60vw { font-size:calc(60 * 0.14vw); }
.fs65vw { font-size:calc(65 * 0.14vw); }
.fs66vw { font-size:calc(66 * 0.14vw); }
.fs68vw { font-size:calc(68 * 0.14vw); }
.fs70vw { font-size:calc(70 * 0.12vw); }
.fs72vw { font-size:calc(72 * 0.12vw); }
.fs80vw { font-size:calc(80 * 0.1vw); }
.fs90vw { font-size:calc(90 * 0.1vw); }
.fs100vw { font-size:calc(100 * 1vw); }




.ttl { margin-block-end: 1em; }
.ttl.flex.center { display: block; }
.ttl.flex.center .ja { display: block; margin:0.5em auto 0 auto; }
.ttl.flex.center .logo { width: calc(129vw / 7.2); margin-right: 0.5em; vertical-align: baseline;}
.ttl.flex.center .logo2024 { width: calc(96vw / 7.2); margin-right: 0.5em; vertical-align: baseline; }


.more { width: calc(480vw / 7.2); height: 3.6em; padding: 0 calc(20vw / 7.2) 0 calc(20vw / 7.2); margin-block-start: 2em; }
.more .icon { width: calc(40vw / 7.2); }


.sp_center { display: block; margin-left: auto; margin-right: auto; text-align: center; }


.inner { width: 92% }
.middle_inner { width: 92% }
.low_inner { width: 92%; }
.minimum_inner { width: 92%; }


#header { height:calc(108vw / 7.2); }
#header .inner { /*margin:0 auto 0 0; width: 97%;*/ }
#header .header_left_box { display:none; }
#header .header_right_box { width:58%; align-items: center; }

#header .central_banner { display:none; }

#header .sp_header { display:flex; justify-content: space-between; }
#header .logo { width: calc(92vw / 3.75); margin: 0; line-height: 1; position:relative; }

/** Aパターン向け対策 **/

#___gcse_0 { top: 0; right: 2.2em; width: calc(380vw / 7.2); height: calc(110vw / 7.2);}
.gsc-input .gsc-input-box { height: calc(50vw / 7.2) !important; }
table.gsc-search-box td { height: calc(50vw / 7.2) !important; }
input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus { background-size: 95% !important; }


/** Bパターン向け対策 **/
#___gcse_1 { width:75%; }

.gsib_a { padding:0 !important; }
input.gsc-input, .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus { height: calc(40vw / 6.2);}
table.gsc-search-box td.gsc-input input[type=text] {}
.gsc-search-button-v2 { height: calc(40vw / 6.2); width: calc(80vw / 6.2) !important; padding: 0 !important; }
.gsc-input-box { padding-top:0 !important; }
.gsc-search-button-v2 { border-radius:3px !important; }

table.gsc-search-box td.gsc-input input[type=text] {
	font-size: calc(18vw / 6.2); border:none !important; width: calc(200vw / 7.2) !important;height: calc(50vw / 7.2) !important;
	background-size: 55% !important;
}
/**/

#header #hamburger { caret-color: transparent; width: calc(66vw / 6.2); height: calc(66vw / 6.2); border-radius: 100vmax; z-index: 1001; }
#header #hamburger .bar {
	display: block; width: calc(26vw / 5.2); height: 2px; margin-left: auto; margin-right: auto;
	transition: transform 0.3s ease, opacity 0.3s ease;transform-origin: center center; transform: none;
}
#header #hamburger .bar_1 { margin-block-end:calc(10vw / 6.2); }
#header #hamburger .bar_2 { margin-block-end:calc(10vw / 6.2); }

#header #hamburger.active .bar_1 { transform: translateY(var(--offset)) rotate(45deg); width: calc(36.77vw / 5.2); }
#header #hamburger.active .bar_2 { opacity:0; }
#header #hamburger.active .bar_3 { transform: translateY(calc(var(--offset) * -1)) rotate(-45deg); width: calc(36.77vw / 5.2); }

#header #drawer {
	position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);display: flex; opacity:0;transition: opacity 0.3s ease; pointer-events:none;
	justify-content: flex-start;align-items: flex-start;z-index: 1000;
}
#header #drawer.open {opacity:1; pointer-events:auto;}

#header #drawer .drawer-content {
	width: 100%;height: 100%;transform: translateX(200%);transition: transform 0.3s ease; padding: 7em 1em 7em 1em; grid-template-rows: 20em;
}
#header #drawer.open .drawer-content {
	transform: translateX(0); display: flex; justify-content: center; align-items: center; overflow-y: scroll;
}

#header #drawer.open .drawer-content .flex.minimum_inner { display:block; }


#header #drawer .drawer-content ul { list-style-type:none; padding:0; width: 100%; margin: 0; }
#header #drawer .drawer-content ul li { letter-spacing: 0.1em; padding: 0.4em 0 0.4em 0; }
#header #drawer .drawer-content ul li.sub { letter-spacing: 0.1em; padding: 0.4em 0 0.4em 0; }
#header #drawer .drawer-content ul li a { align-items: end; }
#header #drawer .drawer-content ul a .slug {  }
#header #drawer .drawer-content ul a .ja {  }
#header #drawer .drawer-content ul li.sns { padding: 0.4em 0 0.4em 0; justify-content: flex-start; align-items:center; width: 100%; }
#header #drawer .drawer-content ul li.sns .text {  }
#header #drawer .drawer-content ul li.sns .bar { background-color:#B3B3B3; width:calc(20vw / 7.2); height:1px; margin: 0 1em 0 1em; }
#header #drawer .drawer-content ul li.sns i { font-size: calc(30 * 0.25vw); margin-right: 0.5em; }


#header #drawer .drawer-content ul li.sp .central_banner { display:block; width: calc(221vw / 3.75); aspect-ratio: 221 / 76; position:relative; z-index:2; margin: 0 auto 1.5em auto; }
#header #drawer .drawer-content ul li.sp .heading { height:100%; object-fit:cover; }


#footer { padding:3em 0 3em 0; }
#footer .inner.flex { display: block; }
#footer .footer_info { display: block; }
#footer .footer_info .logo { width:calc(200vw / 3.75); margin: 0 auto; }

#footer .footer_info .sns { justify-content: center; }
#footer .footer_info .sns i { font-size: calc(30 * 0.25vw); margin: 0.3em; }

#footer .footer_menu { width:100%; }
#footer .footer_menu ul { justify-content: center; }
#footer .footer_menu ul li { padding: 0 0.75em 0 0.75em; }
#footer .footer_menu ul li a { font-size: calc(16 * 0.18vw); }


.page_header { height:calc(160vw / 3.75); background-image:url(../img/page_header_bg_sp.png); }


main { padding-top:calc(108vw / 7.2); }


.page_header { height:calc(380vw / 7.2); }
.page_header .page_header_ttl { display: block; }
.page_header .page_header_ttl .logo { display: none; }
.page_header .page_header_ttl .slug { display: block; margin-right: 0; line-height: inherit; }
.page_header .page_header_ttl .ja { display: block; width: auto; }




#top_news .news_list .box { display: block; }
#top_news .news_list .box dt { display: block; width:100%; padding: 1em 0 0 0; }
#top_news .news_list .box dd { display: block; padding: 0 0 1em 0; }
#top_news .news_list .box dt::after { display:none; }



#top_about .whats_yokohama_live {
	background-image:url(../img/home/whats_yokohama_live_bg_sp.webp);background-size: 100%;
	background-color:#DDF5FD;
}


#top_about .whats_yokohama_live .whats_yokohama_live_wrapper {
	width:100%; padding: 2em 0 3em 0;
	background: linear-gradient(to right, rgba(221, 245, 253, 0.3) 0%, rgba(221, 245, 253, 0.8) 40%, rgba(221, 245, 253, 0.8) 60%, rgba(221, 245, 253, 0.3) 100%);
}
#top_about .whats_yokohama_live .whats_yokohama_live_wrapper .whats_yokohama_live_thumb.pc { display:none; }
#top_about .whats_yokohama_live .whats_yokohama_live_wrapper .whats_yokohama_live_thumb.sp { display:block; }
#top_about .whats_yokohama_live .whats_yokohama_live_wrapper .whats_yokohama_live_thumb { width: calc(335vw / 3.65); }



#top_about .whats_yokohama_live .whats_yokohama_live_wrapper .link_box { display:block; }

#partner_events { width: 92%; margin:0 auto; }

.partner_events_ttl { margin-block-end: 1.5em; }
.partner_events_banner_box { display: block; width: 96%; margin:0 auto; }
.partner_events_banner_box .banner { width: 100%; height: 4em; margin: 0 0 1em 0; }


#top_central26 { background-image: url(../img/home/central2026_bg_sp.webp); background-size:cover; padding: 4em 0 5em 0; }
#top_central26 .ttl { margin-block-end: 3em; }
#top_central26 .ttl .logo { width: 100%; }


#top_highlight { padding: 3em 0 3em 0; }
#top_highlight .btn.half { width: 100%; float: none; }



#top_pickup .btn_box { display: block; width: 100%; border-radius: unset; padding: 0.5em; }

#top_pickup .btn_box .btn {
	display: inline-block; width: 100%; border-radius: 0.25em; height: auto; padding: 0.25em; margin: 0.25em 0 0.25em 0; text-align:center;
	font-size: calc(18 * 0.22vw);
}
#top_pickup .btn_box .btn br { display:none; }

.top_pickup_lists { display: block; }
.top_pickup_lists .box { width: 100%; margin: 1em 0 1em 0; }

.top_pickup_lists .box a {  }


#top_gallery .ttl.flex.center .slug {  line-height: 1.3; }

#top_gallery .swiper-wrapper { display: flex; justify-items: center; }

#top_gallery .swiper-slide { margin:0; padding: 0 calc(10vw / 7.2) 0 calc(10vw / 7.2); }
#top_gallery .gallery_swiper { padding: 2em 0 3em 0; width: 200%; margin: 0 -50% 0 -50%; }

#top_gallery .swiper-button-prev { left: 30%; width: calc(50vw / 7.2); height: calc(50vw / 7.2); }
#top_gallery .swiper-button-next { right: 30%; width: calc(50vw / 7.2); height: calc(50vw / 7.2); }

#sponsor .sponsor-grid { padding: 0 0 1em 0; }

#sponsor .sponsor-grid .sponsor-item.sponsor-item--gold { width: calc(120vw / 3.75); margin: 1em calc(20vw / 3.75) 1em calc(20vw / 3.75); }
#sponsor .sponsor-grid .sponsor-item.sponsor-item--silver {width: calc(90vw / 3.75); margin: 1.5em calc(10vw / 3.75) 1.5em calc(10vw / 3.75); }
#sponsor .sponsor-grid .sponsor-item.sponsor-item--bronze { width: calc(80vw / 3.75); aspect-ratio: 3 / 1; margin: 1em calc(15vw / 3.75) 1em calc(15vw / 3.75); }

#related_sites .bottom_link_wrapper .box { width: calc(120vw / 3.75); margin: 1em; }



#about .about_ttl .icon { width: calc(46vw / 7.2); }

#about #about_overview .indent_box { padding: 0; }

#about #about_overview .detail { display:block; }
#about #about_overview .detail dt { display:block; width:100%; border-right:none; border-bottom:solid 1px #D9D9D9; }
#about #about_overview .detail dd { display:block; }


#about #about_concept .concept_list { display:block; }
#about #about_concept .concept_list .box { width: 100%; }

#about #about_greeting .profile { margin:2.5em 0 2.5em 0; }
#about #about_greeting .profile .profile_header { display:block; }
#about #about_greeting .profile .profile_header .thumb { width:100%; }
#about #about_greeting .profile .profile_header .profile_name { width:100%; }





#timetable .btn_box { width: 96%; }
#timetable .btn_box .btn { width: 31%; height: calc(86vw / 7.2); }

#timetable .search_box .box dt { display: block; width: 100%; text-align: left; }
#timetable .search_box .box dd { display: block; padding: 0 1em 0 1em; }
#timetable .search_box .box dd.select_box { width:100%; }
#timetable .search_box .box dd.button_box { display: block; text-align: center; }

#timetable .search_box .box dd.button_box button[type="submit"] { width: 6em; height: 2.5em; }

#timetable .header { display:none; }

#timetable .timetable_list .list { display:block; margin: 1.5em 0 1.5em 0; border-radius: 0.5em; }
#timetable .timetable_list .list dd { display:block; margin: 0; }
#timetable .timetable_list .list dd .sp { display:block; }

#timetable .timetable_list .list dd.time {
	display: flex; width:100%; background-color:#003456; color:#FFFFFF; border:none; border-top-left-radius: 0.5em; border-top-right-radius: 0.5em;
}
#timetable .timetable_list .list .time_dt { width:4em; }

#timetable .timetable_list .list dd.venue { display: flex;  width:100%; border:none; }
#timetable .timetable_list .list .venue_dt { width:4em; }

#timetable .timetable_list .list dd.performer { width:100%; border:none; }

#timetable .timetable_list .list dd.performer .performer_box .thumb { width: calc(140vw / 3.75); height: calc(99vw / 3.75); }

#timetable .timetable_list .list dd.performer .performer_box .performer_name { width: 48%; }



#program .btn_box { flex-wrap: wrap; width: 100%; border-radius: unset; padding: 1% 0 1% 0; }
#program .btn_box .btn { width: 46%; height: calc(86vw / 7.2); font-size: calc(20 * 0.20vw); border-radius: 0.5em; margin: 1% 2% 1% 2%; }

#program .select_day { display:block; padding: 0.5em 0.75em 1em 0.75em; }
#program .select_day dt { display:block; width: 100%; }
#program .select_day dd { display:flex; width: 100%; padding: 0.5em 0 0 0; }
#program .select_day dd .btn { width: 32%; height: calc(70vw / 7.2); border-radius: 0.25em; }


#program .program_list article { width: 100%; }
#program .program_list article .thumb { height: calc(270vw / 6.2); }

#program .single_post .single_post_detail { display: block; }
#program .single_post .single_post_detail .thumb { width: 100%; margin-block-end: 1.5em; }
#program .single_post .single_post_detail .text { width: 100%; }

#program .performers { display: block; }
#program .performers .performer { width: 100%; margin: 0 0 2em 0; }
#program .performers .performer .thumb { height: calc(420vw / 6.2); }

.modal_gallery_box .modal_content { width: 96%; }
.modal_gallery_box .modal_close { top: -1.5em; right: 0.5em; }

#program .link_block { display: block; }
#program .link_block .more { width: 90%; height: 4.5em; font-size: calc(18 * 0.18vw); margin: 1.5em auto 1.5em auto; }


.post-navigation .nav-links-next-prev .nav-previous a,
.post-navigation .nav-links-next-prev .nav-next a { width: calc(200vw / 7.2); height: calc(80vw / 7.2); }
.post-navigation .nav-links-home { position: static; width: 100%; }
.post-navigation .nav-links-home .nav-home a { width: calc(420vw / 7.2); height: calc(80vw / 7.2); }



#program .single_post .content .sns_link_list li { display: block; align-items: center; margin: 1em 0 1em 0; }

#program .single_post .content .sns_link_list li span { display: block; width: 100%; }
#program .single_post .content .sns_link_list li a { overflow-wrap: break-word; /* 現在の標準 */ word-wrap: break-word;  word-break: break-all;  }




span.page-numbers { margin: 0 calc(15vw / 6.2) 0 calc(15vw / 6.2); width: calc(60vw / 6.2); height: calc(60vw / 6.2); }
a.page-numbers { margin: 0 calc(15vw / 6.2) 0 calc(15vw / 6.2); width: calc(60vw / 6.2); height: calc(60vw / 6.2); }
a.page-numbers.next { width: calc(140vw / 6.2); }
a.page-numbers.prev { width: calc(140vw / 6.2); }




#venue_map .single_post .venue_header { background: linear-gradient(to left bottom, #0071BC 0, #00AEEF 50%, #80D7F7 100%); }
#venue_map .single_post .venue_header .text { float:none; width: 100%; aspect-ratio: unset; padding: 0 1em 0 1em; }
#venue_map .single_post .venue_header .thumb { float:none; width: 100%; }

#venue_map .single_post .gmap_btn { width: 12em; height: 2.5em; }

#venue_map .program_list { display: block; }

#venue_map .program_list .program { width: 100%; }
#venue_map .program_list .program .thumb { height: calc(270vw / 6.2); }



#gallery .gallery_wrapper .modal_gallery {
	width: 48%; aspect-ratio:3 / 2; margin: 0 4% 1em 0;
}

#gallery .gallery_wrapper .modal_gallery:nth-of-type(3n) { margin-right:4%; }
#gallery .gallery_wrapper .modal_gallery:nth-of-type(2n) { margin-right:0; }


#central .content { padding:0; }

#central .central_header { margin-block: 0 10vw; padding: 3em 4% 3.25vw; }
#central .central_header .central_header_ttl {margin-block-start: 0;}
#central .central_header .central_header_ttl .logo1 {inline-size: min(788px,100%);}
#central .central_header .central_header_ttl .catch {font-size: calc(29 * 0.18vw); margin-block-end: 2em;}


#central [class^="column"] .border_ttl1 {margin-block-end: 1.5em;}
#central .central_header .summary {line-height: 1.75;text-align: left;font-size: calc(19 * 0.21vw);}
#central [class^="column"] .text1 {padding-inline: 0;}
#central [class^="column"] .box {padding-inline: 0;}
#central [class^="column"] .box .img_side {inline-size: min(580px,100%);float: none; margin-block-end: 1em; }
#central [class^="column"] .box .img_side .yagura_img { width: 100%; }

#central [class^="column"] .box .text_side {inline-size: 100%;float: none;}
#central .column3 .box .text_side {padding-block-start: 8vw;}
#central [class^="column"] .tri_img_box {padding-inline: 0;display: block;}
#central .column2 .summary {padding-inline: 0;margin-block-start: 1em;}
#central [class^="column"] .box .corner_img_side {inline-size: min(567px,100%);float: none;}
#central .column3 .box .text_side {inline-size: 100%;padding-block-start: 5.5vw;padding-inline-end: 0;}
#central [class^="column"] .field_illust {inline-size: min(1080px,100%);}
#central .column4 .summary {padding-inline: 0;}
#central [class^="column"] .more1 {margin-block: 10vw 14vw;}

#central [class^="column"] .border_ttl2 { margin-block-end: 1.5em;}

#central [class^="column"] .tri_img_box .h_img { display: block; width: 80%; margin: 0.5em auto 0.5em auto; }
#central [class^="column"] .yokohama { aspect-ratio: 25 / 34; }





#news { padding: 5em 0 5em 0; }
#news .news_list .list { display: block; }

#news .news_list .posts { width: 100%; margin-right: 0; margin-block-end: 3em; }
#news .news_list .posts .thumb { height: calc(233vw / 3.75); }

#news .nav-home a { width: calc(420vw / 7.2); height: calc(80vw / 7.2); }

#news .single_post .entry-content a.more {  width: calc(500vw / 7.2); height: 3.6em; margin:1em auto 0 auto; }
#news .single_post .entry-content .flex_cener { display:block; }

#news .single_post .post-thumbnail { width: 100%; }






.widget-area .wp-block-heading { font-size: calc(20 * 0.18vw); }
.widget-area .wp-block-latest-posts__list li time { font-size: calc(12 * 0.2vw); }
.widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { width: 85%; float: right; font-size: calc(16 * 0.18vw); padding: 0 0 0 calc(16vw / 7.2); margin-block-end: 0.5em; }



.widget-area .wp-block-categories-list li a { font-size: calc(16 * 0.2vw); }
.widget-area .wp-block-archives-list li a { font-size: calc(16 * 0.2vw); }

.sidebar_reserv_btn { margin-block-start: 3em; }

.widget-area .widget_block { margin-block-end: calc(40vw / 7.2); }




.post-navigation .nav-links .nav-home a { font-size: calc(16 * 0.2vw); width: calc(200vw / 7.2); height: calc(80vw / 7.2); }
.post-navigation .nav-links .nav-previous a { font-size: calc(16 * 0.2vw); width: calc(140vw / 7.2); height: calc(80vw / 7.2); }
.post-navigation .nav-links .nav-next a { font-size: calc(16 * 0.2vw); width: calc(140vw / 7.2); height: calc(80vw / 7.2); }

.post-navigation .nav-links .nav-previous a .icon { width: calc(12vw / 7.2); }
.post-navigation .nav-links .nav-next a .icon { width: calc(12vw / 7.2); }

.post-navigation .nav-links .nav-home { margin: 0 calc(30vw / 7.2) 0 calc(30vw / 7.2); }







#contact { padding: 5em 0 5em 0; }

form .box { display:block; }
form .box .field { display:block; width:100%; padding: 0.7em 1em 0.7em 1em; }
form .box .text { display:block; padding:1em 3% 1em 3%; width: 100%; }
form .box textarea { width: 100%; }

#privacy_policy { margin-block-start: 1em; }

.privacy_policy_word { padding: 0 1em; height: 10em; }
form .send_btn { width: calc(500vw / 7.2); height: calc(100vw / 7.2); margin-block-start: 2em; }

form .box input[type=text], form .box input[type=tel], form .box input[type=email],
form .box input[type=number], form .box select { padding: 0.4em; height: 2.5em; }
form .check_box input[type=checkbox]:checked::before {
	left: 0.5em; top: -0.5em; width: calc(12vw / 3.75); height: calc(24vw / 3.75); border-width: 0 4px 4px 0;
}





/**** old site ******************************/
.entry-content-old .entry-buttons {
        padding: 0 1em; display: block;
    }

.entry-content-old .button {
        width: 100%;
    }