:root {
	--color-main: #B1650C;
	--color-sub: #F4EADD;
	--color-white: #FFF;
	--color-black: #000000;
}
* {
	-webkit-appearance: none;
	font-family: "source-han-sans-japanese", sans-serif;
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	line-height: 1.6;
	font-weight: 300;
	font-style: normal;
}
body {
	font-size: 20px;
	background: #FFF;
}
img {
	width: 100%;
	vertical-align: bottom;
}



/*===parts*/
.hidden {
	overflow: hidden;
}
.btn-circle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	border-radius: 100%;
	text-decoration: none;
	font-weight: bold;
	border: 1px solid #FFF;
	cursor: pointer;
}
.btn-circle.ptn1 {
	background: var(--color-main);
	color: var(--color-white);
}
.btn-circle.ptn2 {
	background: var(--color-white);
	color: var(--color-main);
}
.btn-bar {
	display: block;
	text-decoration: none;
	padding: 10px 0;
	text-align: center;
	background: var(--color-black);
	color: var(--color-white);
	font-weight: bold;
	font-size: 0.9em;
	width: 90%;
	max-width: 600px;
	margin: auto;
	z-index: 2;
	cursor: pointer;
	user-select: none;
}
.font-din {
	font-family: "din-condensed", sans-serif;
	font-weight: bold;
	font-style: normal;
}


.section__bg {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 0;
	margin: auto;
	width: 80%;
	max-width: 1400px;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	opacity: 0.2;
}
.section__bg hr {
	display: block;
	border: 0;
	border: 0;
	width: 1px;
	height: 100%;
	background: #FFF;
}
.section__bg.orange hr {
	background: var(--color-main);
}


.tournament__list {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 50px 5%;
	margin-top: 50px;
}
.tournament__list .tournament__item-none {
	color: #FFF;
	text-align: center;
	padding: 40px 0;
	width: 200%;
	background: rgb(255 255 255 / 20%);
	margin: 20px auto;
	font-size: 0.7em;
}
.tournament__list .tournament__item {
	color: #FFF;
	text-decoration: none;
	transition: 0.3s;
}
.tournament__list .tournament__item:hover {
	transform: scale(1.1);
}
.tournament__list .tournament__item .tournament__item-cover {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center;
}
.tournament__list .tournament__item .tournament__item-flag {
	text-decoration: none;
	margin: 10px auto 10px 0;
	padding: 5px 10px;
	font-size: 0.6em;
	width: fit-content;
	background: var(--color-black);
}
.tournament__list .tournament__item .tournament__item-title {
	text-decoration: none;
	font-size: 0.8em;
	padding-bottom: 10px;
	font-weight: bold;
}
.tournament__list .tournament__item .tournament__item-title:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 30%;
	height: 2px;
	margin: auto;
	z-index: 2;
	background: #FFF;
}
.tournament__list .tournament__item table {
	margin-top: 10px;
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
}
.tournament__list .tournament__item table tr {}
.tournament__list .tournament__item table tr th {
	text-decoration: none;
	text-align: left;
	font-size: 0.7em;
	padding: 5px 0;
	width: 60px;
	min-width: 60px;
	vertical-align: sub;
}
.tournament__list .tournament__item table tr td {
	text-decoration: none;
	font-size: 0.6em;
	padding: 5px 0 5px 10px;
}

form {}
.label {
	display: block;
	margin: 40px auto;
}
.label .label__ttl {
	font-size: 0.8em;
	font-weight: bold;
	margin-bottom: 5px;
	user-select: none;
}
.label .input {
	display: block;
	padding: 10px;
	background: var(--color-sub);
	border-radius: 5px;
	font-size: 16px;
	width: 100%;
	border: 0;
}
.label .input:disabled {
	background: #EEE;
}
.label .radio {
	display: none;
}
.label .error__text {
	color: #FF0000;
	font-weight: bold;
	font-size: 0.7em;
	margin-top: 5px;
	user-select: none;
	opacity: 0;
}
.label .error__text.active {
	opacity: 1;
}
.label {
	display: block;
	margin: 40px auto;
	border: 0;
}
.label .label__radio {
	display: flex;
	margin-top: 10px;
	align-items: center;
	gap: 0 .5em;
	position: relative;
	cursor: pointer;
}
.label .label__radio::before,
.label .label__radio::after {
	border-radius: 3px;
	content: '';
	z-index: 2;
}
.label .label__radio::before {
	width: 18px;
	height: 18px;
	border: 2px solid #dee5eb;
	box-sizing: border-box;
}
.label .label__radio::after {
	position: absolute;
	top: 50%;
	left: 9px;
	transform: translate(-50%, -50%);
	width: 9px;
	height: 9px;
	background-color: #dee5eb;
}
.label .label__radio:has(:checked)::after {
	background-color: #b1650c;
	animation: anim-radio .3s linear;
}
@keyframes anim-radio {
	0% {
		box-shadow: 0 0 0 1px transparent;
	}
	50% {
		box-shadow: 0 0 0 10px #b1650c33;
	}
	100% {
		box-shadow: 0 0 0 10px transparent;
	}
}
.label .label__radio .label__radio-ttl {
	font-size: 0.8em;
	user-select: none;
}



/*===トーナメント表*/
.tournament_table {
	width: 100%;
	height: 500px;
	margin: 50px auto;
}
.tournament_table .vtb-item {
}
.tournament_table .vtb-item-players {
	background: rgb(255 255 255 / 0%);
}
.tournament_table .vtb-item-players .vtb-player {
	padding: 2px 10px 5px;
	border-radius: 10px;
}
.tournament_table .vtb-item-players .vtb-player span {
	font-size: 14px;
}
.tournament_table .vtb-item-players .defeated {}
.tournament_table .vtb-item-players .winner {}
.tournament_table .vtb-item-child:after,
.tournament_table .vtb-item-child:before {
	background-color: #FFF;
}
.tournament_table .vtb-item-parent:after {
	background-color: #FFF;
}


/*===DatePicker*/
#ui-datepicker-div.ui-datepicker {
	width: 90%;
}
#ui-datepicker-div.ui-widget.ui-widget-content {
	position: fixed !important;
	top: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	right: 0 !important;
	margin: auto;
	height: 430px;
	border: 0 !important;
	padding: 0;
	filter: drop-shadow(0 0 10px #bfbfbf);
	border-radius: 10px;
}
#ui-datepicker-div .ui-datepicker table {
	border-collapse: collapse !important;
	border-spacing: 0;
}
#ui-datepicker-div.ui-datepicker td {
	padding: 0;
}
#ui-datepicker-div.ui-datepicker td span,
#ui-datepicker-div.ui-datepicker td a {
	padding: 10px 5px;
	text-align: center;
}
#ui-datepicker-div .ui-datepicker-calendar .day-sunday > a,
#ui-datepicker-div .ui-datepicker-calendar .day-holiday > a {
	background: #ffc0c0;
}
#ui-datepicker-div .ui-datepicker-calendar .day-saturday > a {
	background: #c0d0ff;
}
#ui-datepicker-div .ui-state-default, .ui-widget-content .ui-state-default,
#ui-datepicker-div .ui-widget-header .ui-state-default,
#ui-datepicker-div .ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	border: 0 !important;
}



/*===header*/
header {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	align-items: center;
	position: fixed;
	top: 10px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 100;
	width: 90%;
	max-width: 1500px;
}
header .header__logo {
	max-width: 100px;
	margin-right: auto;
}
header .header__sns {
	width: 20px;
	margin-right: 10px;
	align-items: center;
	display: none;
}
header .header__sns img {
	height: 100%;
	object-fit: contain;
	object-position: center;
}
header .header__btnlink {
	margin-right: 10px;
	display: none;
	padding: 5px 10px;
	border-radius: 50px;
	background: rgba( 0, 0, 0, 0.5 );
}
header a {
	text-decoration: none;
	font-size: 0.8em;
	color: #FFF;
}
header .menu__openbtn {
	cursor: pointer;
	user-select: none;
	width: 40px;
	height: 30px;
}
header .menu__openbtn:before,
header .menu__openbtn:after,
header .menu__openbtn hr {
	display: block;
	border: 0;
	display: block;
	width: 100%;
	height: 4px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: #FFF;
	box-shadow: 0 0 10px 0 rgb(177 101 12 / 40%);
}
header .menu__openbtn:before {
	content: '';
	top: 20px;
}
header .menu__openbtn:after {
	content: '';
	bottom: 20px;
}



/*===menu*/
#menu {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: -200%;
	margin: auto;
	z-index: 110;
	background: var(--color-main);
	width: 100%;
	min-height: 100lvh;
	height: 100vh;
	height: 100lvh;
	overflow: auto;

	background-image: url('/common/img/menu_bg.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	transition: 0.3s;
}
#menu.active {
	right: 0;
}
#menu .menu__contents {
	max-width: 600px;
	width: 90%;
	margin: auto;
	padding: 50px 0;
	z-index: 1;
}
#menu .menu__contents .menu__logo {
	display: block;
	width: 150px;
	margin: auto;
}
#menu .menu__contents .sns__list {
	list-style: none;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	align-items: center;
	width: 200px;
	margin: 50px auto;
}
#menu .menu__contents .sns__list li {
	width: 30px;
}
#menu .menu__contents .sns__list li a {}
#menu .menu__contents .sns__list li a img {}
#menu .menu__contents .menu__btn {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 300px;
	margin: auto;
}
#menu .menu__contents .menu__btn a {
	border: 1px solid #FFF;
}
#menu .menu__contents .menu__list {
	margin: 50px auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	max-width: 600px;
}
#menu .menu__contents .menu__list .menu__list-contents {
	list-style: none;
}
#menu .menu__contents .menu__list .menu__list-contents:nth-child(1) {
	grid-area: 1 / 1 / 2 / 2;
}
#menu .menu__contents .menu__list .menu__list-contents:nth-child(2) {
	grid-area: 2 / 1 / 3 / 2;
}
#menu .menu__contents .menu__list .menu__list-contents:nth-child(3) {
	grid-area: 1 / 2 / 3 / 3;
}
#menu .menu__contents .menu__list .menu__list-contents li {
	margin-bottom: 20px;
}
#menu .menu__contents .menu__list .menu__list-contents li a {
	text-decoration: none;
	font-size: 0.8em;
	color: var(--color-white);
	padding: 5px 10px;
	border-radius: 50px;
	background: rgba( 0, 0, 0, 0.5 );
	white-space: nowrap;
}
#menu .menu__closebtn {
	position: fixed;
	left: 0;
	right: -300%;
	bottom: 10px;
	max-width: 200px;
	transition: 0.5s;
}
#menu.active .menu__closebtn {
	right: 0;
}




/*===footer*/
#anchortop {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 50;
	width: 40px;
	height: 40px;
	border-radius: 100%;
	background: var(--color-main);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	opacity: 0;
	transition: 0.3s;
}
#anchortop.active {
	opacity: 1;
}
#anchortop img {
	user-select: none;
	width: 50%;
}
footer {
	background-image: url('/common/img/footer_bg.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
footer .footer__contents {
	margin: auto;
	padding: 50px 0;
	width: 90%;
	z-index: 2;
}
footer .footer__contents h2 {
	font-size: 2em;
	font-weight: bold;
	color: var(--color-white);
	text-align: center;
}
footer .footer__contents .sns__list {
	list-style: none;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	align-items: center;
	width: 200px;
	margin: 20px auto 50px;
}
footer .footer__contents .sns__list li {
	width: 30px;
}
footer .footer__contents .sns__list li img {}

footer .footer__contents .footer__btn {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 300px;
	margin: auto;
}

footer .footer__contents #footer__list {
	margin: 50px auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(2, 1fr);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	max-width: 600px;
}
footer .footer__contents #footer__list .footer__list-contents {
	list-style: none;
}
footer .footer__contents #footer__list .footer__list-contents:nth-child(1) {
	grid-area: 1 / 1 / 2 / 2;
}
footer .footer__contents #footer__list .footer__list-contents:nth-child(2) {
	grid-area: 2 / 1 / 3 / 2;
}
footer .footer__contents #footer__list .footer__list-contents:nth-child(3) {
	grid-area: 1 / 2 / 3 / 3;
}
footer .footer__contents #footer__list .footer__list-contents li {
	margin-bottom: 20px;
}
footer .footer__contents #footer__list .footer__list-contents li a {
	text-decoration: none;
	font-size: 0.8em;
	color: var(--color-white);
}

footer .footer__contents .copy {
	text-align: center;
	color: var(--color-white);
	font-size: 0.7em;
}
footer .footer__filter {
	display: block;
	border: 0;
	background: rgb(0 0 0 / 75%);
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}

#loading__modal {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 10000;
	width: 100%;
	min-height: 100lvh;
	height: 100vh;
	height: 100lvh;
	background: rgb(255 255 255 / 30%);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur( 8px );
	display: none;
}
#loading__modal.active {
	display: flex;
	align-items: center;
	justify-content: center;
}
#loading__modal .loading {
	width: 50%;
	max-width: 200px;
}
#loading__modal .loading .loading__img {}
#loading__modal .loading .loading__text {
	text-align: center;
	font-size: 1em;
	margin: 20px auto auto;
}

.loading__container {
	width: 100%;
	height: 110px;
}
/*ボール*/
.loading__img {
	position: absolute;
	left: 0;
	right: 0;
	top:0;
	bottom: 0;
	margin: auto;
	width:100px;
	height:100px;
	z-index: 2;
	animation: bound-anim 1s infinite;
}
@keyframes bound-anim {
	0%,100% {top: 0;transform: scale(1);}
	30% {top: -60%; transform: scale(0.96,1.04);}
	60% {transform: scale(1);}
	90% {top: 0;transform: scale(1.15,0.9);}
}
/*影*/
.shadow {
	position: absolute;
	left: 0;
	right: 0;
	top:0;
	bottom: -95px;/*対象のheightと微調節*/
	margin: auto;
	width: 60px;
	height: 10px;
	border-radius: 50%;
	background: #000;
	filter: blur(6px);
	opacity:0.9;
	z-index: 1;
	animation: shadow-anim 1s infinite;
}

@keyframes shadow-anim {
	0%,100%  {transform: scale(1);filter: blur(4px);}
	30% {transform: scale(1.6,1);filter: blur(8px);}
}

/*===========================
=============================
PC 750~
=============================
===========================*/
@media screen and (min-width: 780px) {



	.tournament__list {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-gap: 50px 5%;
	}



	header .header__sns {
		display: flex;
	}
	header .header__btnlink {
		display: block;
	}



	#menu .menu__contents .menu__list,
	footer .footer__contents #footer__list {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: 1fr;
		grid-column-gap: 0px;
		grid-row-gap: 0px;
	}
	#menu .menu__contents .menu__list .menu__list-contents:nth-child(1),
	#menu .menu__contents .menu__list .menu__list-contents:nth-child(2),
	#menu .menu__contents .menu__list .menu__list-contents:nth-child(3),
	footer .footer__contents #footer__list .footer__list-contents:nth-child(1),
	footer .footer__contents #footer__list .footer__list-contents:nth-child(2),
	footer .footer__contents #footer__list .footer__list-contents:nth-child(3) {
		grid-area: auto / auto / auto / auto;
	}
}