@charset "utf-8";

/* !HTML5 elements
---------------------------------------------------------- */
header, footer, nav, section, aside, article
{ display: block;}

/* !Reseting
---------------------------------------------------------- */

body, div, pre, p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td
{ margin: 0; padding: 0;}
input, textarea
{ margin: 0; font-size: 100%;}
label
{ cursor: pointer;}
table
{ border-collapse: collapse; border-spacing: 0; font-size: 100%;}
fieldset, img
{ border: 0;}
img
{ vertical-align: top; max-width: 100%;}
address, caption, cite, code, dfn, em, th, var
{ font-style: normal; font-weight: normal;}
ol, ul
{ list-style: none;}
caption, th
{ text-align: left;}
h1, h2, h3, h4, h5, h6
{ font-size: 100%; font-weight: normal;}
q:after, q:before
{ content:'';}
a, input,select,textarea,button
{ outline: none; }
abbr, acronym
{ border: 0;}



/* !Clearfix
---------------------------------------------------------- */
.clearfix {
	display: block;
	min-height: 1%;
}
.clearfix:after {
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html .clearfix {
	height: 1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* !Inline Align ------------------------------------------------------------ */
.taL { text-align: left   !important;}
.taC { text-align: center !important;}
.taR { text-align: right  !important;}

/*common*/
a{
	color: inherit;
	text-decoration: none;
	transition: all 0.5s !important;
	-moz-transition: all 0.5s !important; /* Firefox */
	-webkit-transition: all 0.5s !important; /* Chrome&Safari */
}
.op img {
	transition: all 0.5s !important;
	-moz-transition: all 0.5s !important; /* Firefox */
	-webkit-transition: all 0.5s !important; /* Chrome&Safari */
}
.op:hover img {
	opacity: .7;
	-webkit-opacity: .7;
	-moz-opacity: .7;
}

* { 
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

/* !Layout
---------------------------------------------------------- */
html { 
	overflow-y: scroll;
	font-size: 62.5%;
}
body {
	color: #0D4DA1;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
	font-size: 1.6rem;
	-webkit-text-size-adjust: none;
	line-height: 1.5;
}
.is_popup {
	overflow: hidden;
	height: 100vh;
}

.font_league {
	font-family: "League Gothic", sans-serif;
	font-weight: 400;
}
.font_oswald {
	font-family: "Oswald", sans-serif;
}

@media screen and (max-width: 1200px) {
	html {
		font-size: 0.83333vw;
	}
}
@media screen and (max-width: 834px) {
	html {
		font-size: 62.5%;
	}
}
@media screen and (max-width: 374px) {
	html {
		font-size: 2.6667vw;
	}
}

/*** pc ***/
@media screen and (min-width: 835px) {
	.sp {
		display: none;
	}
}
/*** sp ***/
@media screen and (max-width: 834px) {
	.pc {
		display: none;
	}
}

/* !yokohama_lp_wrapper
---------------------------------------------------------- */
#yokohama_lp_wrapper {
	position: relative;
	padding-top: 9.6rem;
}

/* !header
---------------------------------------------------------- */
#yokohama_lp_header {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99;
	padding-bottom: 1.2rem;
	width: 100%;
	background: url(../image/icon_line.png)repeat-x center bottom #004098;
	background-size: auto 1.2rem;
	color: #fff;
}
.header_inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 7rem;
}
.yokohama_lp_headlogo a {
	display: flex;
	align-items: center;
	gap: 0 0.8rem;
	height: 8.4rem;
	font-size: 0;
}
.yokohama_lp_headlogo img {
	width: 4.1rem;
}
.yokohama_lp_headlogo .txt {
	transition-duration: 0.3s;
	border-bottom: 1px solid transparent;
	line-height: 1;
	letter-spacing: 0.6px;
	font-size: 2rem;
}
#yokohama_lp_header .right {
	display: flex;
	align-items: center;
}
#yokohama_lp_navi ul {
	display: flex;
	gap: 0 3.2rem;
}
#yokohama_lp_navi li {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 8.4rem;
	text-align: center;
}
#yokohama_lp_navi li a {
	display: block;
}
#yokohama_lp_navi li .jap {
	letter-spacing: 0.48px;
	color: #FAFAFA;
	font-weight: 700;
}
#yokohama_lp_navi li span {
	transition-duration: 0.3s;
	border-bottom: 1px solid transparent;
}

.yokohama_lp_headlinks {
	margin-left: 4.5rem;
	width: 20.6rem;
}
.yokohama_lp_headlinks .btn {
	display: block;
	border-radius: 0.6rem;
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.28);
}
.yokohama_lp_btn_menu {
	display: none;
}

@media screen and (max-width: 1340px) {
	.header_inner {
		padding: 0 2rem;
	}
	#yokohama_lp_navi ul {
	    gap: 0 2.4rem;
	}
	.yokohama_lp_headlinks {
	    margin-left: 3.2rem;
	}
}
/*** hover ***/
@media screen and (min-width: 960px) {
	.yokohama_lp_headlogo a:hover .txt {
		border-color: #fff;
	}
	
	#yokohama_lp_navi li a:hover span {
		border-bottom-color: #fff;
	}
}
/*** sp ***/
@media screen and (max-width: 834px) {
	#yokohama_lp_wrapper {
	    padding: 6rem 0 5.8rem;
	}
	
	.yokohama_lp_headlogo a {
	    height: 4.8rem;
	}
	.header_inner {
		padding: 0 1.6rem;
	}
	#yokohama_lp_navi {
		visibility: hidden;
		opacity: 0;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		transition-duration: 0.3s;
		padding: 8rem 1.6rem;
		width: 100%;
		height: 100vh;
		background: #004098;
	}
	#yokohama_lp_navi.open {
		visibility: visible;
		opacity: 1;
	}
	#yokohama_lp_navi ul {
		display: block;
		border-top: 2px solid #014CB3;
	}
	#yokohama_lp_navi li {
	    display: block;
	    height: auto;
	    text-align: left;
		border-bottom: 2px solid #014CB3;
	}
	#yokohama_lp_navi li a {
		padding: 0.8rem 2.4rem 0.8rem 0;
		background: url(../image/icon_arr_link.svg)no-repeat right center;
		background-size: 2.4rem;
		font-size: 1.8rem;
	}
	.yokohama_lp_headlinks {
		position: fixed;
		left: 0;
		bottom: 0;
		margin-left: 0;
		width: calc(100% - 5.8rem);
		background: #fff;
		border-top: 2px solid #fff;
		border-bottom: 2px solid #fff;
	} 
	.yokohama_lp_headlinks .btn img {
		object-fit: cover;
		width: 100%;
		height: 5.4rem;
	}
	.yokohama_lp_btn_menu {
		display: block;
		position: fixed;
		right: 0;
		bottom: 0;
		z-index: 5;
		width: 5.8rem;
		height: 5.8rem;
		background: url(../image/icon_menu.svg)no-repeat center #fff;
		background-size: 100%;
	}
	.yokohama_lp_btn_menu.active {
		background-image: url(../image/icon_menu_close.svg);
	}
}


/* yokohama_lp_footer
-----------------------------------------------------------*/
.yokohama_lp_pagetop {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 5.8rem;
	background: #0F218B;
}
.yokohama_lp_pagetop img {
	width: 2.6rem;
}

.yokohama_lp_footer {
	padding: 6.4rem 0 7.6rem;
	background: #004098;
	color: #fff;
}
.yokohama_lp_footer .foot_inner {
	margin: 0 auto;
	max-width: 72rem;
}
.yokohama_lp_footer .footlogo {
	margin-bottom: 3.2rem;
	text-align: center;
}
.yokohama_lp_footer .footlogo img {
	width: 10rem;
}
.yokohama_lp_footer .sns {
	display: flex;
	justify-content: center;
	gap: 2.2rem;
	position: relative;
	padding: 4rem 0;
}
.yokohama_lp_footer .sns:before {
	content: "FOLLOW US";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	text-align: center;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
}
.yokohama_lp_footer .sns a {
	width: 2.4rem;
}
.yokohama_lp_footer .footlinks {
	border-top: 1px solid;
}
.yokohama_lp_footer .footlinks li {
  padding: 1rem 0;
  border-bottom: 1px solid #fff;
}
.yokohama_lp_footer .footlinks a {
	display: block;
	padding: 1rem 4rem;
	background: url(../image/icon_link_wh.svg)no-repeat right 0.8rem center;
	background-size: 0.8rem;
	font-size: 1.3rem;
	font-weight: 700;
}
.yokohama_lp_footer #copyright {
	margin-top: 2.5rem;
	text-align: center;
	font-size: 1rem;
	font-weight: 700;
}

/*** hover ***/
@media screen and (min-width: 835px) {
	.yokohama_lp_footer a:hover {
		opacity: 0.7;
	}
}
/*** sp ***/
@media screen and (max-width: 834px) {
	.yokohama_lp_footer {
		padding: 6.4rem 3.2rem 8.8rem;
	}
	.yokohama_lp_footer .footlogo {
	    margin-bottom: 2.4rem;
	}
	.yokohama_lp_footer .sns {
		justify-content: space-between;
		padding: 4.5rem 0 2.4rem;
	}
	.yokohama_lp_footer .sns:before {
		font-family: "League Gothic", sans-serif;
		font-size: 2.4rem;
		font-weight: 400;
	}
	.yokohama_lp_footer .footlinks li {
	    padding: 1.2rem 0;
	}
	.yokohama_lp_footer .footlinks a {
		padding: 1rem 2rem 1rem 0;
		background-position: right center;
		font-size: 1.3rem;
	}
	.yokohama_lp_footer #copyright {
		margin-top: 6.4rem;
		font-weight: 400;
	}
}



/* !common
---------------------------------------------------------- */
.yokohama_lp_kv .movie {
	position: relative;
	/* padding-top: 56.25%; */
	width: 100%;
}
.yokohama_lp_kv .movie iframe {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
}

.yokohama_lp_inner {
	padding: 0 5rem;
	margin: 0 auto;
	max-width: 120rem;
}

.color_red {
	color: #ED1845;
}

.yokohama_lp_hdl {
	margin-bottom: 4rem;
}
.yokohama_lp_hdl p + p {
	margin-top: 0.8rem;
}
.yokohama_lp_hdl .jap {
	line-height: 1.2;
	font-size: 4.4rem;
	font-weight: 700;
}
.yokohama_lp_hdl .jap::first-letter {
	font-size: 5.6rem;
}
.yokohama_lp_hdl .eng {
	line-height: 1;
	font-size: 2.4rem;
}

.yokohama_lp_btn .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 6.4rem;
	background: no-repeat right 1.2rem center;
	background-size: 1rem;
	border-radius: 0.8rem;
	text-align: center;
	font-size: 2rem;
	font-weight: 700;
}
.yokohama_lp_btn .btn_game {
	background-image:url(../image/icon_link_wh.svg);
	background-color: #B99652;
	color: #fff;
}
.yokohama_lp_btn .btn_look {
	background-image:url(../image/icon_link.svg);
	background-color: #fff;
	border: 2px solid #0D4DA1;
	color: #0D4DA1;
}
.yokohama_lp_btn .btn_ticket {
	border-radius: 1.8rem;
}

.yokohama_lp_anchorarea {
	position: relative;
}
.yokohama_lp_anchorarea .anchor {
	position: absolute;
	top: -9.6rem;
}

.hide {
	display: none;
}

.toggleBtn {
	cursor: pointer;
}
.toggleBox {
	display: none;
}

.yokohama_lp_bg {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
}
.yokohama_lp_bg img {
	position: sticky;
	top: 9.6rem;
	object-fit: cover;
	width: 100%;
	height: 100vh;
}

/*** hover ***/
@media screen and (min-width: 835px) {
	.yokohama_lp_btn a:hover {
		opacity: 0.7;
	}
}
/*** sp ***/
@media screen and (max-width: 834px) {
	.yokohama_lp_inner {
	    padding: 0 1.6rem;
	}
	.yokohama_lp_hdl {
	    margin-bottom: 3.2rem;
	}
	.yokohama_lp_hdl .jap {
	    font-size: 3.6rem;
	}
	.yokohama_lp_hdl .jap::first-letter {
		font-size: 4rem;
	}
	.yokohama_lp_hdl .eng {
	    font-size: 1.8rem;
	}
	
	.yokohama_lp_btn .btn {
		height: 4.8rem;
		background-position: right 0.7rem center;
		background-size: 0.6rem;
		font-size: 1.6rem;
	}
	
	.yokohama_lp_anchorarea .anchor {
		top: -6rem;
	}
	
	.yokohama_lp_bg img {
		top: 6rem;
		object-position: right top;
	}
	
	
	
}


/* !page
---------------------------------------------------------- */
.yokohama_lp_anchors {
	padding: 6.4rem 0 9.6rem;
	background: url(../image/bg_anchor.png) center;
	background-blend-mode: luminosity;
}
.yokohama_lp_anchors .intro .midashi {
	line-height: 1.75;
	color: #252525;
	font-weight: 700;
	font-size: 3.2rem;
	margin-bottom: 1.6rem;
}
.yokohama_lp_anchors .intro .sub {
	line-height: 1.75;
	color: #252525;
	font-size: 1.8rem;
}
.yokohama_lp_anchors ul {
	margin-top: 6.4rem;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1.6rem;
}
.yokohama_lp_anchors li a {
	display: flex;
	overflow: hidden;
	position: relative;
	padding: 1.6rem 1.2rem 3.6rem;
	height: 100%;
	border-radius: 1.2rem;
	border: 3px solid #ED1845;
	background: url(../image/icon_down_red.svg)no-repeat center bottom 0.8rem #FFF;
	background-size: 2.4rem;
	box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.25);
	font-weight: 700;
}
.yokohama_lp_anchors li .logo {
	position: absolute;
	right: 1.6rem;
	top: 1.6rem;
	width: 4rem;
}
.yokohama_lp_anchors li .date {
	line-height: 1;
}
.yokohama_lp_anchors li .date-d {
	display: inline-block;
}
.yokohama_lp_anchors li .date-d:first-child {
	display: block;
}
.yokohama_lp_anchors li .date-d:after {
	content: "OR";
	font-size: 2rem;
	font-family: "League Gothic", sans-serif;
	font-weight: 400;
}
.yokohama_lp_anchors li .date-d:last-child:after {
	content: none;
}
.yokohama_lp_anchors li .date .day {
	font-size: 4rem;
}
.yokohama_lp_anchors li .team {
	margin-top: 0.8rem;
	line-height: 1.2;
	font-size: 1.4rem;
}
.yokohama_lp_anchors li .team:before {
	content: "VS";
	margin-right: 0.2rem;
	font-size: 1.2rem;
}

.yokohama_lp_match {
	position: relative;
	z-index: 2;
	padding: 9.6rem 0;
	color: #fff;
}
.yokohama_lp_match .yokohama_lp_bg {
	
}
.yokohama_lp_match .yokohama_lp_bg .fix_bg {
	position: sticky;
	top: 9.6rem;
	width: 100%;
	height: 100vh;
	background: url(../image/bg_blue_pc.jpg)no-repeat center;
	background-size: cover;
}
.yokohama_lp_match .yokohama_lp_bg .fix_bg img {
	opacity: 0.8;
	mix-blend-mode: screen;
}
.yokohama_lp_match .match_area {
	padding: 6.4rem 5rem;
	border-top: 8px solid #ED1845;
	border-bottom: 8px solid #ED1845;
	background: url(../image/bg_match2.png)no-repeat center;
	background-size: cover;
}
.yokohama_lp_match .match_area + .match_area {
	margin-top: 6.4rem;
}
.match_area .title {
	display: flex;
	align-items: flex-end;
	gap: 0 2.4rem;
	margin-bottom: 1.6rem;
	color: #0D4DA1;
	font-weight: 700;
}
.match_area .date {
	display: flex;
	line-height: 1;
	font-size: 2.4rem;
}
.match_area .date-d + .date-d:before {
	content: "OR";
	font-family: "League Gothic", sans-serif;
	font-size: 3.2rem;
	font-weight: 400;
}
.match_area .date .day {
	font-size: 7.2rem;
}
.match_area .section {
	line-height: 1.2;
	font-size: 2rem;
}
.match_area .section .section-label{
	display: flex;
	align-items: baseline;
	margin-bottom: 0.4rem;
}
.match_area .section .section-label .time{
	margin-left: 0.8rem;
	font-size: 2.8rem;
}

.match_area .team {
	font-size: 2.8rem;
}
.match_area .team:before {
	content: "VS";
	margin-right: 0.2rem;
	font-size: 1.6rem;
}
.match_area .match_display {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.match_area .match_display .img {
	width: calc(50% + 2.5rem);
}
.match_area .match_display .btns {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.6rem 0;
	width: calc(45% - 0.8rem);
	text-align: center;
}
.match_area .match_display .btns a {
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.32);
}
.match_area .match_display .btns .btn_game,
.match_area .match_display .btns .btn_look {
	max-width: 38.5rem;
}

.yokohama_lp_match .match_event {
	overflow: hidden;
	margin-top: 4rem;
	border-radius: 0.8rem;
	color: #fff;
}
.match_event .head {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	transition-duration: 0.3s;
	height: 6.4rem;
	background: #0D4DA1;
	text-align: center;
	font-size: 2rem;
	font-weight: 700;
}
.match_event .head:after {
	content: "";
	position: absolute;
	right: 1.8rem;
	top: 0;
	transition-duration: 0.3s;
	width: 2.8rem;
	height: 100%;
	background: url(../image/icon_down_wh.svg)no-repeat center;
	background-size: 100%;
}
.match_event .head.open:after {
	transform: rotate(180deg);
}
.match_event a{
	text-decoration: underline;
}
.match_event .display {
	display: flex;
	justify-content: space-between;
	padding: 2.4rem 1.6rem;
	background: #3D71B4;
	border-top: 2px solid #fff;
}
.match_event .display .img {
	width: calc(50% - 3.4rem);
}
.match_event .display .info {
	width: calc(50% + 1rem);
	line-height: 1.75;
}
.match_event .display .tit {
	margin-bottom: 0.8rem;
	line-height: 1.2;
	font-size: 2rem;
	font-weight: 700;
}

.yokohama_lp_beginners {
	padding: 6.4rem 0;
	background: url(../image/bg_watch_pc.jpg)no-repeat center;
	background-size: cover;
}
.yokohama_lp_beginners .head {
	margin-bottom: 3.2rem;
	text-align: center;
	font-size: 2.4rem;
	font-weight: 700;
}
.yokohama_lp_beginners .img {
	margin: 0 auto;
	max-width: 68rem;
}
.yokohama_lp_beginners .yokohama_lp_btn {
	margin-top: 3.2rem;
	text-align: center;
}
.yokohama_lp_beginners .yokohama_lp_btn .btn {
	max-width: 34rem;
	height: 4.8rem;
	background-image: url(../image/icon_open_new_wh.svg);
	background-size: 2.4rem;
}

.yokohama_lp_event {
	overflow: hidden;
	padding: 9.6rem 0;
	background: url(../image/bg_event_pc.jpg)no-repeat center;
	background-size: cover;
	color: #fff;
}

.yokohama_lp_event_swiper {
	position: relative;
}
.yokohama_lp_event_swiper ul {
	justify-content: center;
	gap: 0 3.2rem;
}
.yokohama_lp_event_swiper li {
	display: none;
	padding-bottom: 5.4rem;
	width: 27.6rem;
	height: auto;
}
.yokohama_lp_event_swiper li:nth-of-type(1),
.yokohama_lp_event_swiper li:nth-of-type(2),
.yokohama_lp_event_swiper li:nth-of-type(3),
.yokohama_lp_event_swiper li:nth-of-type(4) {
	display: block;
}
.yokohama_lp_event_swiper .common_ctrl {
	display: none;
}
.yokohama_lp_event_swiper .img {
	margin-bottom: 1.6rem;
}
.yokohama_lp_event_swiper .tit {
	margin-bottom: 1.6rem;
	font-size: 2rem;
	font-weight: 700;
}
.yokohama_lp_event_swiper .txt {
	line-height: 1.7;
}
.yokohama_lp_event_swiper .more {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}
.yokohama_lp_event_swiper .more a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0 0.6rem;
	width: 100%;
	height: 3.8rem;
	background: #fff;
	border-radius: 5rem;
	color: #004098;
	font-size: 2rem;
}
.yokohama_lp_event_swiper .more a:after {
	content: "";
	display: block;
	width: 2rem;
	height: 2rem;
	background: url(../image/icon_search_plus.svg)no-repeat center;
	background-size: 100%;
}

.fancybox_content {
	max-width: 62rem;
}
.fancybox_display {
	padding: 3.2rem 2.4rem 2.4rem 3.2rem;
}
.fancybox_display .scrollbar {
	padding-right: 0.8rem;
	overflow-y: auto;
	height: 68rem;
}
.fancybox_display .scrollbar::-webkit-scrollbar {
	width: 7px; 
}
.fancybox_display .scrollbar::-webkit-scrollbar-track {
	background: #F1F1F1;
}
.fancybox_display .scrollbar::-webkit-scrollbar-thumb {
	background: #004098;
}
.fancybox_display .img {
	margin-bottom: 2.4rem;
}
.fancybox_display .img img {
	width: 100%;
}
.fancybox_display .info .tit {
	color: #004098;
	font-size: 1.6rem;
	font-weight: 700;
}
.fancybox_display .info p {
	margin-bottom: 1.6rem;
	line-height: 1.7;
	color: #1B1B1B;
	font-size: 1.4rem;
}
.fancybox_close {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0 0.8rem;
	margin: 2.4rem auto 0;
	height: 4.4rem;
	max-width: 31.1rem;
	background: #004098;
	border-radius: 5rem;
	color: #fff;
	font-size: 2.2rem;
}
.fancybox_close:before {
	content: "";
	display: block;
	width: 1.8rem;
	height: 1.8rem;
	background: url(../image/icon_close_wh.svg) no-repeat center;
	background-size: 100%;
}

.yokohama_lp_seat {
	position: relative;
	z-index: 2;
	padding: 9.6rem 0;
	background: #fff;
}
.yokohama_lp_seat .yokohama_lp_bg img {
	opacity: 0.15;
}
.yokohama_lp_seat .sub {
	line-height: 1.75;
	color: #252525;
}
.yokohama_lp_seat .seat_category {
	margin: 6.4rem auto 0;
	max-width: 75rem;
}
.seat_category li {
	margin-bottom: 1.6rem;
}
.seat_category .head {
	padding: 1.2rem 5rem 1.2rem 2.4rem;
	background: url(../image/icon_plus.svg)no-repeat right 2.4rem center #004098;
	background-size: 2.4rem;
	color: #fff;
	font-weight: 700;
}
.seat_category .head.open {
	background-image: url(../image/icon_minus.svg);
}
.seat_cate_btns {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2.4rem;
	padding: 1.6rem;
	background: #EEE;
	border-radius: 0 0 1.5rem 1.5rem;
}
.yokohama_lp_seat .btn_seat {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem 1.6rem;
	height: 4.4rem;
	width: 100%;
	max-width: 31.1rem;
	background: url(../image/icon_arr_link.svg)no-repeat right 2.4rem center #004098;
	background-size: 2.4rem;
	border-radius: 5rem;
	text-align: center;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 700;
}

.yokohama_lp_seat .tabWrap {
	margin-top: 6.4rem;
}
.yokohama_lp_seat .seat_ctrl {
	overflow-x: auto;
	position: relative;
	padding: 0 0 1.2rem;
	margin-bottom: 1.6rem;
	width: 100%;
}
.scrollbar_icon {
	position: absolute;
	right: 0;
	top: 0;
	z-index: 3;
	width: 6.8rem;
}
.seat_ctrl::-webkit-scrollbar {
	height: 4px; 
}
.seat_ctrl::-webkit-scrollbar-track {
	background: #F1F1F1;
}
.seat_ctrl::-webkit-scrollbar-thumb {
	background: #BF9C46;
}
.seat_ctrl .swiper-scrollbar {
	left: 0;
	bottom: 0;
	background: rgba(255,255,255,0);
	border-radius: 0;
}
.seat_ctrl .swiper-scrollbar-drag {
	background: #BF9C46;
	border-radius: 0;
}
.seat_ctrl ul {
	display: flex;
	align-items: flex-end;
	gap: 0 0.4rem;
}
.seat_ctrl li {
	width: 11.5rem;
}
.seat_ctrl li a {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	height: 6.7rem;
	background: #fff;
	border-width: 1px 1px 1.3rem;
	border-style: solid;
	border-color: #004098;
	text-align: center;
	line-height: 1.2;
	color: #000;
	font-weight: 700;
	font-size: 1.4rem;
}
.seat_ctrl li a.seat_all:after {
	content: "";
	position: absolute;
	left: 0;
	top: 100%;
	height: 1.3rem;
	width: 100%;
	background: linear-gradient(90deg, #E60039 33%, #fff 33%, #fff 66%, #004098 66%);
}
.seat_ctrl li .active {
	border-radius: 0.8rem 0.8rem 0 0;
}

.seat_display {
	display: flex;
	justify-content: space-between;
}
.seat_display .floor {
	width: 55%;
}
.seat_display .info {
	width: 42.6%;
	line-height: 1.7;
	color: #1B1B1B;
}
.seat_display .head {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 3.8rem;
	background: #004098;
	border-radius: 0.4rem 0.4rem 0 0;
	text-align: center;
	color: #fff;
	font-weight: 700;
}
.seat_display .img_seat {
	margin-bottom: 1.6rem;
	padding: 3rem;
	background: #fff;
}
.seat_display .prices {
	margin: 1.6rem auto 0;
	max-width: 31.1rem;
}
.seat_display .prices li {
	display: flex;
	margin-bottom: 0.8rem;
	text-align: center;
	line-height: 1.2;
}
.seat_display .prices .th {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 10rem;
	background: #004098;
	color: #fff;
	font-weight: 700;
}
.seat_display .prices .td {
	padding: 0.7rem 0;
	width: calc(100% - 10rem);
	background: #fff;
	border: 1px solid #E8E8E8;
	border-left: 0;
	font-size: 1.2rem;
}
.seat_display .prices .td .price {
	margin-left: 0.8rem;
	font-size: 1.8rem;
	font-weight: 700;
}
.seat_display .btn_seat {
	margin: 0 auto;
}
.seat_display .notes {
	margin-top: 0.8rem;
	line-height: 1.5;
	font-size: 1.4rem;
}
.seat_display .notes a {
	text-decoration: underline;
}

.seat_cate_btns .st_yellow,
.st_yellow .seat_display .head,
.st_yellow .seat_display .prices .th,
.st_yellow .seat_display .btn_seat {
	background-color: #C57C0A;
}
.seat_cate_btns .st_yellow2,
.st_yellow2 .seat_display .head,
.st_yellow2 .seat_display .prices .th,
.st_yellow2 .seat_display .btn_seat {
	background-color: #edc94b;
}
.seat_cate_btns .st_yellow3,
.st_yellow3 .seat_display .head,
.st_yellow3 .seat_display .prices .th,
.st_yellow3 .seat_display .btn_seat {
	background-color: #967b26;
}
.seat_cate_btns .st_yellow4,
.st_yellow4 .seat_display .head,
.st_yellow4 .seat_display .prices .th,
.st_yellow4 .seat_display .btn_seat {
	background-color: #c7a857;
}
.seat_cate_btns .st_purple,
.st_purple .seat_display .head,
.st_purple .seat_display .prices .th,
.st_purple .seat_display .btn_seat {
	background-color: #7C1D6F;
}
.seat_cate_btns .st_purple2,
.st_purple2 .seat_display .head,
.st_purple2 .seat_display .prices .th,
.st_purple2 .seat_display .btn_seat {
	background-color: #804d85;
}
.seat_cate_btns .st_purple3,
.st_purple3 .seat_display .head,
.st_purple3 .seat_display .prices .th,
.st_purple3 .seat_display .btn_seat {
	background-color: #6B2865;
}
.seat_cate_btns .st_light_blue,
.st_light_blue .seat_display .head,
.st_light_blue .seat_display .prices .th,
.st_light_blue .seat_display .btn_seat {
	background-color: #77b8df;
}
.seat_cate_btns .st_blue,
.st_blue .seat_display .head,
.st_blue .seat_display .prices .th,
.st_blue .seat_display .btn_seat {
    border-color: #2D75CC;
}
.seat_cate_btns .st_green,
.st_green .seat_display .head,
.st_green .seat_display .prices .th,
.st_green .seat_display .btn_seat {
	background-color: #3c7e44;
}
.seat_cate_btns .st_orange,
.st_orange .seat_display .head,
.st_orange .seat_display .prices .th,
.st_orange .seat_display .btn_seat {
	background-color: #f37123;
}
.seat_cate_btns .st_brown,
.st_brown .seat_display .head,
.st_brown .seat_display .prices .th,
.st_brown .seat_display .btn_seat {
	background-color: #78272f;
}
.seat_cate_btns .st_lotus,
.st_lotus .seat_display .head,
.st_lotus .seat_display .prices .th,
.st_lotus .seat_display .btn_seat {
	background-color: #ae3246;
}
.seat_cate_btns .st_pink,
.st_pink .seat_display .head,
.st_pink .seat_display .prices .th,
.st_pink .seat_display .btn_seat {
	background-color: #fb7ca6;
}
.seat_cate_btns .st_skin,
.st_skin .seat_display .head,
.st_skin .seat_display .prices .th,
.st_skin .seat_display .btn_seat {
	background-color: #fe8162;
}

.seat_ctrl li .st_yellow {
	border-color: #C17A16;
}
.seat_ctrl li .st_yellow2 {
	border-color: #edc94b;
}
.seat_ctrl li .st_yellow3 {
	border-color: #967b26;
}
.seat_ctrl li .st_yellow4 {
	border-color: #C7A857;
}
.seat_ctrl li .st_brown {
	border-color: #78272f;
}
.seat_ctrl li .st_pink {
	border-color: #fb7ca6;
}
.seat_ctrl li .st_lotus {
	border-color: #ae3246;
}
.seat_ctrl li .st_light_blue {
    border-color: #77b8df;
}
.seat_ctrl li .st_blue {
    border-color: #2D75CC;
}
.seat_ctrl li .st_green {
	border-color: #3c7e44;
}
.seat_ctrl li .st_purple {
	border-color: #7C1D6F;
}
.seat_ctrl li .st_purple2 {
	border-color: #804d85;
}
.seat_ctrl li .st_purple3 {
	border-color: #6B2865;
}
.seat_ctrl li .st_orange {
	border-color: #f37123;
}
.seat_ctrl li .st_skin {
	border-color: #fe8162;
}

.yokohama_lp_access {
	position: relative;
	z-index: 2;
	padding: 9.6rem 0;
	background: linear-gradient(180deg, rgba(0, 47, 111, 0) 0%, #002F6F 100%);
	color: #fff;
}
.yokohama_lp_access .yokohama_lp_bg {
	mix-blend-mode: multiply;
}
.yokohama_lp_access .btn_google a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 0.9rem;
	width: 100%;
	background: #fff;
	border-radius: 5rem;
	color: #004098;
	font-weight: 700;
}
.yokohama_lp_access .btn_google a:before {
	content: "";
	display: block;
	background: url(../image/icon_point.svg)no-repeat center;
	background-size: 100%;
}
.yokohama_lp_access .access_display {
	display: flex;
	justify-content: space-between;
}
.access_display .img {
	width: 50.2%;
}
.access_display .map {
	width: 46.6%;
}
.access_display .map iframe {
	width: 100%;
	height: 50rem;
	background: #D9D9D9;
	border: 0;
}
.access_display .map .btn_google {
	margin-top: 1.6rem;
	text-align: center;
}
.access_display .btn_google a {
	gap: 0 1rem;
	height: 4.5rem;
	max-width: 29.3rem;
}
.access_display .btn_google a:before {
	width: 2.2rem;
	height: 2.2rem;
}

.yokohama_lp_access .access_info {
	margin-top: 5rem;
}
.access_info_routes {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 3.2rem;
}
.yokohama_lp_access .item + .item {
	margin-top: 3.2rem;
}
.yokohama_lp_access .head {
	position: relative;
	padding: 0.5rem 0 1.3rem 4rem;
	margin-bottom: 2.4rem;
	background: url(../image/icon_info.svg)no-repeat left top;
	background-size: 3.2rem;
	border-bottom: 2px solid #fff;
	font-weight: 700;
}
.yokohama_lp_access .head:before,
.yokohama_lp_access .head:after {
	content: "";
	position: absolute;
	top: 1.5rem;
	right: 0.5rem;
	transition-duration: 0.3s;
	width: 1.4rem;
	border-top: 0.2rem solid #fff;
}
.yokohama_lp_access .head:after {
	transform: rotate(90deg);
}
.yokohama_lp_access .head.open:after {
	transform: rotate(0deg);
}
.yokohama_lp_access .head2 {
	padding: 0.2rem 0 0.2rem 3.2rem;
	margin-bottom: 1.6rem;
	background: no-repeat left center;
	background-size: 2.4rem;
	color: #BF9C46;
	font-size: 1.4rem;
	font-weight: 700;
}
.yokohama_lp_access .head3 {
	padding: 0.8rem 0 0.8rem 4.8rem;
	margin-bottom: 1.6rem;
	background: url(../image/icon_map.svg)no-repeat left top;
	background-size: 4rem;
	line-height: 1.2;
	font-size: 2rem;
	font-weight: 700;
}
.yokohama_lp_access .icon_walk {
	background-image: url(../image/icon_walk.svg);
}
.yokohama_lp_access .icon_car {
	background-image: url(../image/icon_car.svg);
}
.yokohama_lp_access .icon_bus {
	background-image: url(../image/icon_bus.svg);
}
.access_info_routes {
	line-height: 1.7;
	font-size: 1.4rem;
}
.access_info_routes .routes {
	border-top: 2px solid #014CB3;
}
.access_info_routes .routes li {
	padding: 1.6rem 0;
	border-bottom: 2px solid #014CB3;
}
.access_info_routes .routes li .tit {
	margin-bottom: 0.8rem;
	line-height: 1.5;
	font-weight: 700;
}
.access_info_routes .note {
	font-size: 1.2rem;
}
.access_info_routes .routes .space_between {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.access_info_routes .routes .btn_google a {
	gap: 0 0.4rem;
	height: 2.4rem;
	max-width: 7.5rem;
	font-size: 1.2rem;
}
.access_info_routes .btn_google a:before {
	width: 1.6rem;
	height: 1.6rem;
}
.access_info_routes .bus_stop {
	margin-bottom: 1.6rem;
	text-align: center;
} 
.access_info_routes .bus_stop .tit {
	margin-bottom: 1.6rem;
	font-weight: 700;
}
.yokohama_lp_access .stadium_display {
	display: flex;
	justify-content: space-between;
	margin: 5rem auto 0;
	max-width: 90rem;
}
.stadium_display .img {
	width: calc(50% + 2.5rem);
}
.stadium_display .info {
	width: calc(50% - 5rem);
	line-height: 1.75;
}
.stadium_display .yokohama_lp_btn {
	margin-top: 2.4rem;
}
.stadium_display .yokohama_lp_btn .btn {
	height: 4.8rem;
	background-position: right 1.6rem center;
	background-size: 0.8rem;
	font-size: 1.6rem;
}



/*** hover ***/
@media screen and (min-width: 835px) {
	.yokohama_lp_anchors li a:hover {
		opacity: 0.7;
		box-shadow: 0 0 0;
	}
	
	.seat_display .notes a:hover {
		text-decoration: none;
	}
	
	.match_event .head:hover,
	.yokohama_lp_access .btn_google a:hover {
		opacity: 0.7;
	}
	
	
}
/*** sp ***/
@media screen and (max-width: 834px) {
	.yokohama_lp_anchors .intro .midashi {
		font-size: 2.8rem;
		margin-bottom: 1.6rem;
		line-height: 1.5;
	}
	.yokohama_lp_anchors .intro .sub {
		font-size: 1.6rem;
	}
	.yokohama_lp_anchors {
	    padding: 4.8rem 0;
	}
	.yokohama_lp_anchors ul {
	    grid-template-columns: repeat(2, 1fr);
	    gap: 1.6rem 1.2rem;
	}
	.yokohama_lp_anchors li a {
		align-items: center;
		background-position: center bottom 0.4rem;
		background-size: 2rem;
	}
	.yokohama_lp_anchors li .logo {
	    right: 1.2rem;
	    top: 1.2rem;
	}
	.yokohama_lp_anchors li .date {
		font-size: 1.4rem;
	}
	.yokohama_lp_anchors li .date .day {
	    font-size: 3.2rem;
	}
	
	.yokohama_lp_match {
		padding: 4.8rem 0;
	}
	.yokohama_lp_match .yokohama_lp_bg {
	    background-image: url(../image/bg_blue_sp.jpg);
	}

	.yokohama_lp_match .yokohama_lp_bg .fix_bg {
		top: 6rem;
	}

	.yokohama_lp_match .match_area {
	    padding: 3.2rem 1.6rem 2.8rem;
	    border-top: 4px solid #ED1845;
	    border-bottom: 4px solid #ED1845;
	}
	.yokohama_lp_match .match_area + .match_area {
	    margin-top: 5.6rem;
	}
	.match_area .title {
		flex-wrap: wrap;
	    gap: 1.6rem;
	    margin-bottom: 0.8rem;
	}
	.match_area .date {
	    font-size: 1.8rem;
	}
	.match_area .date-d + .date-d:before {
		font-size: 2.4rem;
	}
	.match_area .date .day {
	    font-size: 5.6rem;
	}
	.match_area .section {
	    font-size: 1.4rem;
	}
	.match_area .section .section-label .time{
	margin-left: 0.4rem;
	font-size: 1.8rem;
	}
	.match_area .team {
	    font-size: 1.8rem;
	}
	.match_area .team:before {
	    font-size: 1.2rem;
	}
	.match_area .match_display {
	    display: block;
	}
	.match_area .match_display .img {
		margin-bottom: 1.6rem;
		width: auto;
	}
	.match_area .match_display .btns {
	    flex-direction: row-reverse;
		justify-content: center;
	    gap: 0.7rem;
		width: auto;
	}
	.match_area .match_display .btns .btn_game, 
	.match_area .match_display .btns .btn_look {
		padding-right: 1rem;
		max-width: 31.1rem;
		font-size: 1.4rem;
	}
	.match_area .match_display .btns .btn_ticket {
		display: none;
	}
	.yokohama_lp_match .match_event {
	    margin: 1.6rem auto 0;
		max-width: 31.1rem;
	}
	.match_event .head {
	    height: 4.3rem;
	    font-size: 1.6rem;
	}
	.match_event .display {
	    display: block;
	    padding: 1.6rem 0.8rem;
	}
	.match_event .display .img {
		margin-bottom: 0.8rem;
		width: auto;
	}
	.match_event .display .info {
		width: auto;
	}
	.match_event .display .tit {
	    margin-bottom: 0.4rem;
	    font-size: 1.6rem;
	}
	.match_area .yokohama_lp_btn {
	    margin-top: 1.2rem;
		text-align: center;
	}
	
	.yokohama_lp_beginners {
	    padding: 4rem 0;
		background-image: url(../image/bg_watch_sp.jpg);
	}
	.yokohama_lp_beginners .head {
	    margin-bottom: 1.6rem;
	    font-size: 1.4rem;
	}
	.yokohama_lp_beginners .yokohama_lp_btn .btn {
	    height: 4.3rem;
	}
	
	.yokohama_lp_event {
	    padding: 4rem 0;
		background-image: url(../image/bg_event_sp.jpg);
	}
	.yokohama_lp_event_swiper {
		position: relative;
		margin: 0 auto;
		max-width: 31.1rem;
	}
	.yokohama_lp_event_swiper ul {
	    justify-content: flex-start;
	    gap: 0;
	}
	.yokohama_lp_event_swiper li {
	    display: block;
	}
	.yokohama_lp_event_swiper .more {
		text-align: right;
	}
	.yokohama_lp_event_swiper .more a {
		gap: 0 0.8rem;
		padding: 0 3.2rem;
		width: auto;
		height: 4.4rem;
		font-size: 2.2rem;
	}
	.yokohama_lp_event_swiper .more a:after {
	    width: 2.8rem;
	    height: 2.8rem;
	}
	
	.yokohama_lp_event_swiper .common_ctrl {
	    display: flex;
		justify-content: flex-end;
		align-items: center;
		gap: 0 1.6rem;
		margin-top: 3.2rem;
	}
	.common_ctrl .swiper-pagination {
	    display: flex;
		position: static;
		width: auto;
		line-height: 1;
		font-size: 0;
	}
	.common_ctrl .swiper-pagination-current,
	.common_ctrl .swiper-pagination-total {
		width: 4.8rem;
		text-align: center;
		font-size: 2.2rem;
	}
	.common_ctrl .swiper-pagination-total {
		border-left: 2px solid;
	}
	.common_ctrl .swiper-button-prev:after,
	.common_ctrl .swiper-button-next:after {
		display: none;
	}
	.common_ctrl .swiper-button-prev,
	.common_ctrl .swiper-button-next {
		position: static;
		margin: 0 !important;
		width: 5rem;
		height: 5rem;
		background: no-repeat center;
		background-size: 100%;
		border-radius: 100%;
	}
	.common_ctrl .swiper-button-prev {
		background-image: url(../image/icon_prev.svg);
	}
	.common_ctrl .swiper-button-next {
		background-image: url(../image/icon_next.svg);
	}
	
	.fancybox_content {
		height: 100vh;
	}
	.fancybox_display {
	    padding: 1.6rem 0.8rem 2.4rem 1.6rem;
	}
	.fancybox_display .scrollbar {
	    padding-right: 0.8rem;
		height: calc(100vh - 13rem);
	}
	.fancybox_close {
	    gap: 0 0.8rem;
	    margin-top: 4.4rem;
	}
	
	.yokohama_lp_seat {
		padding: 4rem 0;
	}
	.yokohama_lp_seat .sub {
		font-size: 1.4rem;
	}
	.yokohama_lp_seat .seat_category {
		margin-top: 3.2rem;
	}
	.seat_category li {
		overflow: hidden;
		border-radius: 0.8rem;
	}
	.seat_cate_btns {
	    gap: 0.8rem;
		border-radius: 0 0 0.8rem 0.8rem;
		border: 2px solid #0D4DA1;
	}
	.yokohama_lp_seat .tabWrap {
	    margin-top: 3.2rem;
	}
	.seat_ctrl li {
	    width: 7.8rem;
	}
	.seat_ctrl li a {
		height: 6.5rem;
		font-size: 1.2rem;
	}
	.seat_display {
	    display: block;
	}
	.seat_display .floor {
		margin-bottom: 1.6rem;
		width: auto;
	}
	.seat_display .info {
		width: auto;
		font-size: 1.4rem;
	}
	.seat_display .img_seat {
		padding: 1.5rem;
	}
	.seat_display .notes {
	    margin-top: 2.4rem;
	}
	
	.yokohama_lp_access {
		padding: 4rem 0;
	}
	.yokohama_lp_access .access_display {
	    display: block;
	}
	.access_display .img {
		margin-bottom: 2.4rem;
		width: auto;
	}
	.access_display .map {
		margin: 0 auto;
		width: auto;
		max-width: 31.1rem;
	}
	.access_display .map iframe {
	    height: 22rem;
	}
	.access_display .btn_google a {
	    gap: 0 1rem;
	    height: 4.3rem;
	    max-width: 29.3rem;
		border-radius: 0.8rem;
		font-size: 1.4rem;
	}
	.yokohama_lp_access .access_info {
	    margin-top: 3.2rem;
	}
	.access_info_routes {
	    grid-template-columns: repeat(1, 1fr);
	}
	.yokohama_lp_access .head3 {
		padding-left: 4rem;
		margin-bottom: 0.8rem;
		background-size: 3.2rem;
		font-size: 1.6rem;
	}
	.yokohama_lp_access .stadium_display {
	    display: block;
	    margin-top: 3.2rem;
	}
	.stadium_display .img {
		margin-bottom: 1.6rem;
		width: auto;
	}
	.stadium_display .info {
		width: auto;
		font-size: 1.4rem;
	}
	.stadium_display .yokohama_lp_btn .btn {
		font-size: 1.4rem;
	}
	
	
	
	
}