@charset "utf-8";
/*
	Last Update: 2026/02/05
	Auther: yt
*/
/*===================================================================
	page layout
===================================================================*/
#page_title { position:relative; background:#000 url(../image/layout/page_title.jpg) no-repeat center center / cover; }
#page_title .title_wrap { position:absolute; top:50%; left:0; width:100%; transform:translateY(-50%); background-repeat:no-repeat; background-position:center center; background-size:contain; }
#page_title .main,
#page_title .sub { font-weight:bold; line-height:1.2; text-align:center; color:#fff; }
	@media (max-width: 767px){
		#page_title { height:110px; }
		#page_title .main { font-size:2em; }
	}
	@media (min-width: 768px) and (max-width: 991px){
		#page_title { height:200px; }
		#page_title .main { font-size:3em; letter-spacing:3px; }
	}
	@media (min-width: 992px){
		#page_title { height:280px; }
		#page_title .main { font-size:min(4em, 59px); letter-spacing:3px; }
		#page_title .sub { font-size:min(1.25em, 18px); }
	}

#contact #page_title .title_wrap { background-image:url(../image/layout/page_title_contact.png); }
#match #page_title .title_wrap { background-image:url(../image/layout/page_title_match.png); }
#news #page_title .title_wrap { background-image:url(../image/layout/page_title_news.png); }
#park #page_title .title_wrap { background-image:url(../image/layout/page_title_park.png); }
#players #page_title .title_wrap { background-image:url(../image/layout/page_title_players.png); }
#privacy #page_title .title_wrap { background-image:url(../image/layout/page_title_privacy.png); }
#schedule #page_title .title_wrap { background-image:url(../image/layout/page_title_schedule.png); }
#team #page_title .title_wrap { background-image:url(../image/layout/page_title_team.png); }

#pankuzu { font-size:13px; padding-top:5px; padding-bottom:5px; }
#pankuzu li, #pankuzu li:before { vertical-align:baseline; line-height:100%; }
#pankuzu li:before { display:inline-block; }
#pankuzu .home a { display:inline-block; background:url(../image/layout/pankuzu_home.png) no-repeat left center / auto 1em; width:1.2em; height:1em; overflow:hidden; }
#pankuzu .home a > span { opacity:0; }
#pankuzu ul > li:not(:first-child):before { content:"/"; margin:0 8px; color:#D9D9D9; }
body.pc #pankuzu li:not(.home) a:hover { text-decoration:underline; }
body.pc #pankuzu li.home a:hover { opacity:0.7; }
	@media (max-width: 575px){
		#pankuzu ul { text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
		#pankuzu li { display:inline; }
	}
	@media (min-width: 576px){
		#pankuzu li { display:inline-block; }
	}


/*===================================================================
	entry
===================================================================*/
.entry a { font-weight:bold; }
.entry ul > li:before { content:"●"; }
.entry ul > li > ul > li:before { content:"■"; }
.entry table tr > * { border:1px solid #DDDDDD; }
.entry table thead th { background:#000; color:#fff; font-weight:bold; }
.entry table thead td { background:#EFEFEF; color:#000; font-weight:bold; }
.entry table tbody th { background:#EFEFEF; color:#000; font-weight:500; }
.entry table tbody td { background:#fff; color:#000; }


/*===================================================================
	team_schedule
===================================================================*/
#team_schedule { background:#EBEBEA; }

.schedule_tab_contents { padding-top:80px; }
.schedule_tab_title_wrap { position:relative; margin-bottom:45px; }
.schedule_tab_title_wrap .hl_3::after { margin-bottom:0; }
.schedule_tab_title_wrap .select { position:absolute; right:0; top:50%; transform:translateY(-50%); }
.schedule_tab_title_wrap .select select { min-width:120px; border:2px solid #000; border-radius:5px; padding:5px 10px; font-weight:500; border-radius:0; }

.schedule_comment { font-weight:500; }

.schedule_map { position:relative; width:100%; height:min(500px, 80vw); }
.schedule_map iframe { width:100%; height:100%; position:absolute; top:0; left:0; border:0; }

@media (max-width: 767px) {
	.schedule_tab_contents { padding-top:40px;}
	.schedule_tab_title_wrap { margin-bottom:30px; }
}
@media (max-width: 575px) {
	.schedule_tab_title_wrap .hl_3 { text-align:left; }
	.schedule_tab_title_wrap .hl_3::after { margin-left:0; }
}

.match_logs { background:#F2F2F2; }
.match_visitors { display:block; background:#fff; padding:20px; text-align:center; }
.match_visitors .label { font-weight:bold; font-size:2em; }
.match_visitors .num { font-weight:bold; font-size:2.5em; color:var(--c-red); padding:0 5px; }
.match_visitors .unit { font-weight:bold; font-size:1.5em; }
.match_logs_list .match_logs_row { display:grid; gap:20px; grid-template-columns:repeat(2,1fr); padding-bottom:25px; border-bottom:1px solid #B4B4B4; margin-bottom:25px; }
.match_logs_list .match_logs_unit .title { background:#000; text-align:center; padding:10px 20px; }
.match_logs_list .match_logs_unit .title .main { color:#fff; font-size:1.25em; font-weight:bold; position:relative; padding-left:30px; display:inline-block; line-height:1.2; }
.match_logs_list .match_logs_unit .title .main::before { content:''; display:block; position:absolute; top:50%; transform:translateY(-50%); left:0; background:var(--theme-color-main); mask:var(--mask-image) no-repeat center center / contain; -webkit-mask:var(--mask-image) no-repeat center center / contain; width:22px; height:22px; }
.match_logs_list .match_logs_unit._info .title .main::before { --mask-image:url(../image/icon/info.svg); }
.match_logs_list .match_logs_unit._voice .title .main::before { --mask-image:url(../image/icon/voice.svg); }
.match_logs_list .match_logs_unit .content { padding:20px; background:#fff; font-weight:500; }
.match_logs_list .match_logs_unit .content table tr > * { vertical-align:top; }
.match_logs_list .match_logs_unit .content table tr > th { width:1.75em; }
.match_logs_list .match_logs_unit._voice .content table tr > th { color:var(--c-red); }
.match_logs .tab_list_sticky_area { padding:10px 20px 0; position:sticky; top:var(--header-height); z-index:10; width:calc(100% + 40px); margin-left:-20px; margin-right:-20px; background:#F2F2F2; }
.match_logs .tab_list .button:not(.is-active) { background:#fff; }
.match_logs .tab_list .voice_count { background:var(--c-red); color:#fff; display:inline-block; padding:0px 5px; border-radius:2px; font-size:.6em; font-weight:bold; line-height:1.2; margin-left:5px; }
@media (min-width: 768px) {
	.match_logs .tab_list_sticky_area { display:none; }
}
@media (max-width: 767px) {
	.match_logs { padding-bottom:60px; margin-bottom:-60px; }
	.match_logs_list { padding-top:20px; }
	.match_logs_list .match_logs_row { grid-template-columns:1fr; }
	.match_logs_list .match_logs_unit:not(.is-active) { display:none; }
}

.match_live { background:url(../image/layout/match_bg.jpg) no-repeat center center / cover; color:#fff; }

/*===================================================================
	team
===================================================================*/
.tbl_team { width:100%; }
.tbl_team > tbody > tr > * { border:1px solid #ddd; vertical-align:middle; }
.tbl_team > tbody > tr > th { background:#000; color:#fff; font-weight:bold; }
.tbl_team .sp_table_wrap { padding-bottom:1px; }
	@media (max-width: 575px) {
		.tbl_team,
		.tbl_team > tbody,
		.tbl_team > tbody > tr,
		.tbl_team > tbody > tr > * { display:block; }
		.tbl_team > tbody > tr > th { padding:5px 5px 5px 10px; }
		.tbl_team > tbody > tr > td { padding:8px 5px 20px 10px; }
	}
	@media (min-width: 576px) {
		.tbl_team > tbody > tr > th { padding:20px 10px 20px 10px; text-align:center; width:275px; font-size:min(1.25em, 20px); }
		.tbl_team > tbody > tr > td { padding:20px 20px 20px 40px; }
	}


/*===================================================================
	players
===================================================================*/
#players .hl_2.plx { transition-property:opacity, transform; transition-duration:.7s; }
#players .hl_2.plx:not(.plx_on) { opacity:0; transform:translateY(40px); }
#players .players_list.plx .unit_wrap { transition-property:opacity, transform; transition-duration:.6s; }
#players .players_list.plx:not(.plx_on) .unit_wrap { opacity:0; transform:translateY(15%); }

#players_profile { display:flex; --player-head-height:min(55vw, 450px); height:var(--player-head-height); background:#222222; }
#players_profile .image { width:40%; background:var(--theme-color-main); display:flex; align-items:flex-end; justify-content:flex-end; position:relative; clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); transition-property:clip-path, opacity; transition-duration:.4s; }
#players_profile.plx:not(.plx_on) .image { clip-path:polygon(0 0, 0 0, 0 100%, 0 100%); opacity:0; }
#players_profile .image::before { content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:#000000; opacity:.02; clip-path:polygon(100% 0, 100% 100%, 0 100%); }
#players_profile .image img { width:auto; height:100%; position:relative; z-index:2; object-fit:contain; object-position:bottom right; }
#players_profile .text { flex:1; color:#fff; display:flex; align-items:center; position:relative; overflow:hidden; padding:20px 7%; }
#players_profile .text .bg_num { position:absolute; bottom:-.1em; right:0; font-size:calc(var(--player-head-height) * .9); line-height:1; font-weight:bold; opacity:.05; z-index:1;letter-spacing:-.05em; padding-right:.05em; transition-property:opacity; transition-duration:1.5s; }
#players_profile.plx:not(.plx_on) .text .bg_num { opacity:0; }
#players_profile .text .text_inner { position:relative; z-index:2; transition-property:opacity, transform; transition-duration:.6s; transition-delay:.2s; }
#players_profile.plx:not(.plx_on) .text .text_inner { opacity:0; transform:translateY(10%); }
#players_profile .text .text_inner .name { margin-bottom:20px; }
#players_profile .text .text_inner .name .new_tag { font-size:1.1em; letter-spacing:.15em; padding:2px 10px; margin-bottom:5px; }
#players_profile .text .text_inner .name .main { font-size:2.5em; font-weight:bold; color:#fff; margin-bottom:10px; }
#players_profile .text .text_inner .name .sub { font-size:1.1em; font-weight:bold; color:#6F6F6F; letter-spacing:1px; }
#players_profile .text .text_inner .position_wrap { display:flex; align-items:center; gap:10px; }
#players_profile .text .text_inner .position_wrap .position { font-size:1.2em; font-weight:bold; }
#players_profile .text .text_inner .position_wrap .number { font-size:2em; font-weight:bold; letter-spacing:2px; }
@media (max-width: 767px) {
	#players_profile .image { width:42%; }
	#players_profile .text { padding:20px 5%; }
	#players_profile .text .text_inner .name .main { font-size:1.75em; }
	#players_profile .text .text_inner .name .sub { font-size:.85em; }
	#players_profile .text .text_inner .position_wrap .position { font-size:1em; }
	#players_profile .text .text_inner .name .main { margin-bottom:0; }
	#players_profile .text .text_inner .name { margin-bottom:5px; }
}

#players_detail { background:#000; }
#players_message { color:#fff; display:flex; flex-direction:row-reverse; gap:40px 20px; }
#players_message .image { width:35%; transition-property:opacity, clip-path; transition-duration:.4s; clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%); transition-delay:.3s; }
#players_message.plx:not(.plx_on) .image { opacity:0; clip-path:polygon(100% 0, 100% 0, 100% 100%, 100% 100%); }
#players_message .text { flex:1; transition-property:opacity, transform; transition-duration:.6s; }
#players_message.plx:not(.plx_on) .text { opacity:0; transform:translateY(40px); }
#players_message .text .hl_profile_message { font-weight:bold; font-size:1.5em; padding-bottom:10px; border-bottom:1px solid #fff; margin-bottom:20px; letter-spacing:1px; }
@media (max-width: 575px) {
	#players_message { flex-direction:column; }
	#players_message .image { width:100%; text-align:center; }
	#players_message .image img { max-width:240px; }
}

.tbl_profile { width:100%; transition-property:opacity, transform; transition-duration:.4s; }
.tbl_profile.plx:not(.plx_on) { opacity:0; transform:translateY(40px); }
.tbl_profile > tbody > tr > * { border:1px solid #ddd; vertical-align:middle; }
.tbl_profile > tbody > tr > th { background:#EFEFEF; font-weight:bold; padding:20px 10px 20px 10px; text-align:center; width:275px; font-size:min(1.25em, 20px); }
.tbl_profile > tbody > tr > td { background:#fff; padding:20px 20px 20px 40px; }
.tbl_profile .sp_table_wrap { padding-bottom:1px; }
.mode_women .tbl_profile > tbody > tr > th { background:#FFE1EE; }
@media (max-width: 991px) {
	.tbl_profile > tbody > tr > th { width:140px; font-size:min(1.1em, 17px); }
	.tbl_profile > tbody > tr > td { padding-left:20px; padding-right:20px; }
}
@media (max-width: 575px) {
	.tbl_profile,
	.tbl_profile > tbody,
	.tbl_profile > tbody > tr,
	.tbl_profile > tbody > tr > * { display:block; }
	.tbl_profile > tbody > tr > th { padding:5px 5px 5px 10px; width:100%; }
	.tbl_profile > tbody > tr > td { padding:8px 5px 20px 10px; }
}

/*===================================================================
	privacy
===================================================================*/
.privacy_unit { margin-bottom:40px; }
.privacy_unit + .privacy_unit { margin-bottom:40px; }
.privacy_unit dt { font-weight:bold; font-size:1.5em; font-weight:bold; padding:0 10px 10px; border-bottom:1px solid #DBDBDB; margin-bottom:10px; color:var(--theme-color-main); }
.privacy_unit dd { padding:0 10px; font-weight:500; }
.privacy_unit dd ul li { padding-left:1em; text-indent:-1em; }
.privacy_unit dd ul li::before { content:"・"; }
@media (max-width: 575px) {
	.privacy_unit dt { padding-left:0; padding-right:0; font-size:1.2em; }
	.privacy_unit dd { padding-left:0; padding-right:0; }
}

/*===================================================================
	form
===================================================================*/
.form_step { margin-bottom:30px; display:flex; justify-content:space-between; height:85px; overflow:hidden; list-style:none; }
.form_step > li { flex:1 0 0; position:relative; background:#f1f1f1; height:85px; display:flex; flex-flow:column; justify-content:center; align-items:center; }
.form_step li > * { display:block; text-align:center; line-height:1.2; }
.form_step .sub { font-size:0.9em; font-weight:500; margin-bottom:5px; }
.form_step .main { font-size:1.15em; font-weight:normal; }
.form_step li:not(:last-child)::before,
.form_step li:not(:last-child)::after { content:""; position: absolute; top:-1px; width:15px; height:calc(100% + 2px); clip-path:polygon(0% 0%, calc(100% - 10px) 0%, 100% 50%, calc(100% - 10px) 100%, 0% 100%); }
.form_step li::before { background:#fff; left:calc(100% - 5px); z-index:2; }
.form_step li::after { left:calc(100% - 10px); z-index:3; }
.form_step li.active > * { color:#fff !important; font-weight:bold !important; }
.form_step li.active,
.form_step li.active::after { background:var(--portal-color-main); }
.form_step li:not(.active),
.form_step li:not(.active)::after { background:#eee; }
.form_step li:not(.active) .sub { color:var(--portal-color-main); }
	@media (max-width: 575px){
		.form_step { font-size:0.85em; }
		.form_step li { padding:0 15px 0; }
		.form_step li:first-child .main, .form_step li:last-child .main { height:2.4em; }
	}

.tbl_form { width:100%; }
.tbl_form tr > th { background:#F7F7F7; font-weight:500; }
.tbl_form tr > th > div { position:relative; padding-right:60px; line-height:100%; }
.tbl_form tr > th .need { position:absolute; right:0; top:50%; transform:translateY(-50%); background:#D53D3D; }
	@media (max-width: 767px) {
		.tbl_form,
		.tbl_form tbody,
		.tbl_form tr,
		.tbl_form tr > * { display:block; }
		.tbl_form tr > th { padding:15px 10px; }
		.tbl_form tr > td { padding:10px 0 30px; }
		.tbl_form .birthday_wrap .row { max-width:300px; }
	}
	@media (min-width: 786px){
		.tbl_form tr > * { vertical-align:top; border:1px solid #DBDBDB; }
		.tbl_form tr > th { padding:30px 15px; }
		.tbl_form tr > td { padding:20px 15px; }
	}

.form_dl { display:flex; width:100%; align-items:start; }
.form_dl + .form_dl { margin-top:10px; }
.form_dl dt { flex:0 0 auto; font-weight:500; width:80px; padding:8px 0 0; }
.form_dl dd { flex:1 0 auto; }

.button._zip { display:inline-flex; align-items:center; justify-content:center; background:#F7F7F7; border-radius:30px; border:1px solid #DBDBDB; width:140px; height:41px; }
.button._submit,
.button._back { display:inline-flex; align-items:center; justify-content:center;  border-radius:30px; width:300px; height:55px; }
.button._submit { background:var(--portal-color-main);}
.button._back { background:#e3e3e3; }
.button._submit > .main,
.button._back > .main { flex:1 0 auto; font-weight:500; font-size:22px; }
.button._submit > .main { color:#fff; }
