@charset "UTF-8";

/* ---------------------------------------------------------------------------------------------
	基本設定
---------------------------------------------------------------------------------------------*/

/* レイヤー */
@layer reset, base, custom1, custom2;

/* インポート */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
@import url(destyle.css) layer(reset);
@import url(fontawesome.css) layer(base);

/* 変数 */
:root {
	--txt_base_color: #454545;
	--main-color: #65B6EB;
	--sub-color1: #009EE5;
	--sub-color2: #C7EAFB;
	--DefaultFont: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	--Font-Awesome: bold 1em/1 "Font Awesome 5 Free";
	--Font-Awesome-Brands: bold 1em/1 "Font Awesome 5 Brands";
	--box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, .15);
}


html { font: 15px/1.7 "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; color: #454545; -webkit-text-size-adjust: 100%; animation: fadeIn 1.5s ease 0s 1 normal; }
@keyframes fadeIn { 0% {opacity: 0} 100% {opacity: 1} }

.wrap { width: 90%; margin: 0 auto; }

@media ( 670px <= width <= 1279px ) {
	.wrap { width: 95%; margin: 0 auto; }
}

@media ( 1280px <= width ), print {
	.wrap { width: 1200px; margin: 0 auto; }
}

/* ---------------------------------------------------------------------------------------------
	各ページ共通
---------------------------------------------------------------------------------------------*/

a { transition: .4s; }
a:hover { opacity: .65; transition: .4s; }
img { max-width: 100%; }
article { padding: 40px 0; }

/* 余白 */
.Mb005 { margin-bottom: 0.5em!important; }
.Mb010 { margin-bottom: 1em!important; }
.Mb015 { margin-bottom: 1.5em!important; }
.Mb020 { margin-bottom: 2em!important; }
.Mb025 { margin-bottom: 2.5em!important; }
.Mb030 { margin-bottom: 3em!important; }
.Mb040 { margin-bottom: 4em!important; }
.Mb050 { margin-bottom: 5em!important; }
.Mb060 { margin-bottom: 6em!important; }
.Mb070 { margin-bottom: 7em!important; }
.Mb080 { margin-bottom: 8em!important; }
.Mb120 { margin-bottom: 12em!important; }

.Mr005 { margin-right: .5em!important; }
.Mr010 { margin-right: 1em!important; }
.Mr015 { margin-right: 1.5em!important; }

.Ml-05 { margin-left: -0.5em!important; }
.Ml000 { margin-left: 0!important; }
.Ml005 { margin-left: .5em!important; }
.Ml010 { margin-left: 1em!important; }
.Ml015 { margin-left: 1.5em!important; }
.Ml020 { margin-left: 2em!important; }
.Ml025 { margin-left: 2.5em!important; }
.Ml030 { margin-left: 3em!important; }
.Ml040 { margin-left: 4em!important; }

.center { text-align: center; }
.right { text-align: right; }
.brackets { text-indent: -.5em; }

/* フォントサイズ */
.Fs09 { font-size: 0.9em !important; }
.Fs08 { font-size: 0.8em !important; }
.Fs07 { font-size: 0.7em !important; }
.Fs06 { font-size: 0.6em !important; }
.Fs05 { font-size: 0.5em !important; }

/* カラー */
.red { color: #CC0000; }
.reds { font-size: 0.7em; color: #CC0000; }

/* 下層ページ大見出し */
h1 { background: var(--sub-color1); color: #fff; font-size: 1.6em; border-top: 10px solid var(--sub-color1);}
h1 > span { display: block; padding-left: 15px; }
h1 > span > span { font-size: 1rem; margin-left: 1.5rem; }

/* 下層ページ見出し */
h2.Ttl02 { text-align: center; font-size: 1.2em; background: var(--sub-color2); font-weight: bold; border-radius: 50px; padding: .5em .5em; margin-bottom: 1.5rem; }

/* ボックス */
.box-shadow { border-radius: 10px; box-shadow: var(--box-shadow); padding: 20px; }

/* リスト */
ul.disc { list-style-type: disc; margin-left: 1.5em; } /* 黒丸 */

:is(ul, ol).ref li { text-indent: -1em; padding-left: 1em; } /* ※印 */
:is(ul, ol).ref li::before { content: "※"; }

/* ボタン */
a.btn01 { min-width: 172px; display: inline-block; text-align: center; font: bold .9em/1.7 var(--DefaultFont); background: #FED325; border-radius: 50px; text-decoration: none!important; margin: 8px auto; padding: 4px 2em; }
a.btn01.gray { background: #ebebeb; color: #999; }
a.btn01:is( .pre, .end ) { background: #ebebeb; color: #999; pointer-events: none; }

/* 改行調整 */
@media screen and ( width <= 670px ) {
	br.pc { display: none; }
}

@media screen and ( 671px <= width ), print {
	br.sp { display: none; }
}

/* パンくずリスト */
#breadcrumb { line-height: 1;  background: var(--sub-color2); }
#breadcrumb > span { display: block; padding: 8px 0; }
#breadcrumb ul { padding-left: 15px; }
#breadcrumb li { display: inline-block; list-style: none; text-align: left; }
#breadcrumb li:after { font: var(--Font-Awesome); content: '\f054'; color: #9F9FA0; position: relative; left: 2px; padding: 0 .5em; }
#breadcrumb li:last-child { color: var(--main-color); }
#breadcrumb li:last-child:after { content: ''; }
#breadcrumb li a { text-decoration: none; color: #666; }
#breadcrumb li a:hover { text-decoration: underline; }

@media screen and ( min-width:1024px ), print {
	#breadcrumb { font-size: 1em; margin: 0px auto 0 auto; }
	#breadcrumb ul li { display: inline; }
}

/* Back to top */
#pageTop { position: fixed; bottom: 15px; right: 5%; z-index: 2; }
#pageTop a { display: block; z-index: 10; width: 50px; height: 50px; background: var(--main-color); font-size: 1rem; color: #fff; font-weight: bold; text-decoration: none; text-align: center; opacity: 1; padding: 10px 10px; display: flex; justify-content: center; align-items: center; }
#pageTop a:hover { text-decoration: none; opacity: .8; }

@media screen and ( 671px <= width ), print {
	#pageTop { bottom: 40px; right: 40px; }
}

/* ---------------------------------------------------------------------------------------------
	header
---------------------------------------------------------------------------------------------*/

[class*="header-box"] { display: flex; }

.header-box1 { height: 70px; justify-content: space-between; gap: .5rem; padding-bottom: 8px; }
.sns-box { display: none; }

@media ( width <= 670px ) {
	header .logo picture { padding: 0 0 4px 5%; }
}

header .logo img { max-width: 100%; }

header .logo { max-width: 100px; flex: 1; display: flex; align-items: center; margin-left: .5rem; }
@media ( 671px <= width ), print { header .logo { max-width: 160px; } }
@media ( 1024px <= width ), print { header .logo { max-width: 240px; max-height: auto; margin: 0; } }

@media ( 671px <= width ), print {
	.header-box1 { height: auto; }
}


@media ( 1024px <= width ), print {
	[class*="header-box"] { display: flex; }
	.header-box1 { height: auto; justify-content: space-between; gap: 80px; padding: 0 20px 10px 20px; }
	.header-box2 { align-items: end; gap: 40px; }

	
	
	#header-nav {
		div {
			> ul { display: flex;
				> li { width: calc((100%/7)); text-align: center;
					a { display: block; color: #429DD7; background: #CFE2F3; font-weight: bold; padding: 10px 0;
						&:hover { background: #9BCFF2; color: #fff; opacity: 1; }
						::after { content: "▼"; margin-left: 8px; }
						span { display: none; }
					}
				}
			}
		}
		ul.DropMenu {
			> li { position: relative; transition: .4s;
				&:hover {
					ul { z-index: 1;
						li { transform: translateY(0%); opacity: 1; transition: .4s; }
					}
				}
			}
			ul { position: absolute; width: 100%; z-index: -1; transition: .4s; display: block;
				li { opacity: 0; transition: .4s; }
				li:nth-child(1) { transform: translateY(-100%); }
				li:nth-child(2) { transform: translateY(-200%); }
				li:nth-child(3) { transform: translateY(-300%); }
				li:nth-child(4) { transform: translateY(-400%); }
				li:nth-child(5) { transform: translateY(-500%); }
				li:nth-child(6) { transform: translateY(-600%); }
			}
		}
	}
	.sns-box { display: flex; gap: 5px; position: relative; bottom: 4px; }
	.sns-box > a { width: 36px; }
}

@media ( 1023px <= width <= 1439px )  {
	#header-nav ul li ul li { font-size: 1vw; }
}

ul.DropMenu ul { display: none; }

/* ---------------------------------------------------------------------------------------------
	カウントダウン
---------------------------------------------------------------------------------------------*/

.timer { position: relative; display: flex; align-items: center; margin-right: 70px; z-index: 0; }
.time-box { display: flex; justify-content: center; gap: 4px; }
.time-box > span { position: relative; min-width: 43px; line-height: 1; }
.timer__txt { display: block; width: fit-content; letter-spacing: 0.5px; background: #DCDCDC; font: bold 8px/1.7 'Roboto Condensed', sans-serif; transform: scale(1, 1); padding: .5em 1em .5em 1em; margin: 0 auto; }
.timer__txt br { display: none; }

.timer__en { display: block; text-align: center; font: 600 8px/1 'Roboto Condensed', sans-serif; position: relative; margin: 8px auto 0 auto; }
.timer div.bg { display: block; text-align: center; }
.timer__num { display: block; min-width: 1.5em; text-align: center; font: bold 1.6em/1 'Roboto Condensed', sans-serif; display: inline-block; }

@media ( 671px <= width ), print {
	.timer { height: auto; display: block; }
	.timer__en { font-size: 12px; }
	.timer__box { min-width: 43px; line-height: 1; }
	.timer__num { font-size: 2em; }
}

@media ( 1024px <= width ), print {
	.timer { text-align: center; margin: 0; }
	.timer__txt { width: 100%; font-size: 12px; white-space: nowrap; margin: 0 auto 1px auto; }
	.timer__txt br { display: initial; }
	.timer__en { font-size: 10px; }
	.timer__num { font-size: 2.8em; }
}


/* ---------------------------------------------------------------------------------------------
	Drawer Menu
---------------------------------------------------------------------------------------------*/

@media screen and ( max-width:1023px ) {
	.drawer_menu * { margin: 0; padding: 0; outline: none; appearance: none; text-decoration: none; list-style: none; }
	.drawer_menu a { color: inherit; text-decoration: none; }
	.drawer_menu a:visited { color: inherit; }

	.drawer_menu .drawer_bg { width: 100%; height: 100%; position: fixed; z-index: 999; background-color: rgba(255, 255, 255, .5); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); display: none; top: 0; left: 0; }

	.drawer_menu .drawer_button { display: block; background: none; border: none; padding: 0; width: 42px; letter-spacing: 0.1em; cursor: pointer; position: absolute; top: 10px; right: 11px; z-index: 1001; text-align: center; outline: none; }

	.drawer_menu .drawer_button.active .drawer_bar { width: 49px; position: relative; }
	.drawer_menu .drawer_button.active .drawer_bar1 { transform: rotate(45deg); top: 0px; right: 0; }
	.drawer_menu .drawer_button.active .drawer_bar2 { opacity: 0; }
	.drawer_menu .drawer_button.active .drawer_bar3 { transform: rotate(-45deg); top: 5px; left: -3px; }
	.drawer_menu .drawer_button.active .drawer_menu_text { display: none; }
	.drawer_menu .drawer_button.active .drawer_close { display: block; }
	.drawer_menu .drawer_bar { display: block; height: 5px; margin: 10px 0; transition: all 0.2s; transform-origin: 0 0; }
	.drawer_menu .drawer_text { text-align: center; font-size: 10px; }
	.drawer_menu .drawer_close { letter-spacing: 0.08em; display: none; }
	.drawer_menu .drawer_menu_text { display: block; }

	.drawer_menu .drawer_nav_wrapper { width: 420px; height: 100%; transition: all 0.2s; transform: translate(420px); position: fixed; top: 0; right: 0; z-index: 1000; background: rgba(0, 0, 0, .5); background: var(--main-color); filter: opacity(.75); overflow-y: auto; }

	.drawer_menu .drawer_nav_wrapper.open { transform: translate(0); }
	.drawer_menu.left .drawer_button { right: auto; left: 32px; }
	.drawer_menu.left .drawer_nav_wrapper { transform: translate(-420px); right: auto; left: 0; }
	.drawer_menu.left .drawer_nav_wrapper.open { transform: translate(0); }

	/*+++ Default Navigation CSS +++*/
	.drawer_menu .drawer_nav > li { line-height: 2; }
	.drawer_menu .drawer_nav li ul { margin-top: 15px; }

	/*+++ Default Button Color +++*/
	.drawer_menu .drawer_button { color: #000; }
	.drawer_menu .drawer_button .drawer_bar { background-color: var(--main-color); }
	.drawer_menu .drawer_button.active .drawer_bar { background-color: #fff; }


	#header-nav ul { margin: 5em 0 1em 0; }
	#header-nav ul a { color: #fff; font-size: 1.4em; line-height: 1.4; display: block; padding: .8em .5em; font-weight: bold; position: relative; }
	#header-nav ul a span { display: block; font-size: .55em; margin-left: 1em; font-weight: normal; }
	#header-nav ul a:hover { background: rgba(0, 0, 0, .3); }
}

@media screen {
	.drawer_menu .drawer_button { position: fixed; }
}

@media screen and ( max-width:670px ) {
	.drawer_menu .drawer_nav_wrapper { width: 100%; transform: translate(100%); }
}

@media screen and ( max-width:1023px ) {
	.drawer_menu .drawer_nav_wrapper.open li.new a b::after { content: "NEW"; background: #fff; color: var(--main-color); font-size: 12px; font-weight: bold; padding: 3px 8px; position: absolute; top: 22px; margin-left: 12px; line-height: 1; border-radius: 4px }
}

/* ---------------------------------------------------------------------------------------------
	フッター - footer
---------------------------------------------------------------------------------------------*/

footer h2 { width: fit-content; border: 1px solid; text-align: center; border-radius: 50px; padding: 0 2em; margin: 0 auto 1rem auto; }
.footer-box { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 1rem; padding: 2rem 0; }
.footer-box > div { width: 100%; }
footer #footer-nav { width: 100%; }
footer #footer-nav ul { gap: 1em; text-align: center; }
footer #footer-nav ul a { color: var(--main-color); }
figure.footer-contact { max-width: 200px; margin: 0 auto 1.5rem auto; }

#Copyright { background: var(--main-color); color: #fff; font-size: 10px; text-align: center; padding: 5px 0; }

@media screen and ( 671px <= width ), print {
	footer h2 { margin: 0 0 1rem 0; }
	.footer-box { gap: 15%; }
	.footer-box > div { width: auto; }
	footer #footer-nav { width: auto; }
	footer #footer-nav ul { display: flex; gap: 1em; margin: 0 0 0 1rem; }
	#Copyright { font-size: 1rem; }
}

/* ---------------------------------------------------------------------------------------------
	トップページ - index.html
---------------------------------------------------------------------------------------------*/

.top_image * { width: 100%; }

.contents-flex { padding: 1rem 0 40px 0; }
.contents-flex { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }

.banner-area div {
	> div + div { margin-top: 20px; }
	img { outline: 1px solid #ccc; }
}

main#Index section.banner-area > div:empty + section { margin: 0; }

main#Index {
	section.banner-area {
		a.btn {
			display: block; background: #FED325; color: #666; font: bold 1em/1.7 var(--DefaultFont); text-align: center; padding: 14px 14px;
			@media screen and ( 671px <= width ), print {
				font-size: 1.7em;
			}

			&.yellow { background: #FED325; }
			&.blue { background: #9BCFF2; }
			&.pink { background: #ED9EBE; }
		}
	}
}

.video-area { margin-bottom: 20px;
	iframe { width: 100%; aspect-ratio: 16/9; }
}

/* .main-column { width: 100%; } */


@media screen and ( width <= 670px ) {
	.main-column { width: 100%; margin-top: 40px; } /* バナーエリアが無い時 */
	.main-column:has(> .banner-area) { margin-top: 0px; } /* バナーエリアがある時 */
}

@media screen and ( 671px <= width ), print {
	.contents-flex { flex-wrap: nowrap; gap: 40px; padding: 40px 0 100px 0; }
	.main-column { flex: 1; width: calc(100% - 220px); }
}

@media screen and ( 1024px <= width ), print {
	.contents-flex {  gap: 40px; padding: 40px 0 40px 0; }
	.main-column { flex: 1; width: calc(100% - 280px); }
}



/* サイドバー */
.sidebar :is( h2, h3 ) { text-align: center; font-weight: bold; }
.sidebar > div + div { margin-top: 1rem; }

.sidebar a { display: block; width: fit-content; margin: 0 auto; }

.sidebar .other .sponsor-group li { width: 85%; margin: 12px auto 0 auto; }
.sidebar .sponsor-group li + li { margin-top: 12px; }

.sidebar h3 { color: #fff; text-shadow: 2px 2px 1px #33333388; border-radius: 50px; margin-bottom: 15px; }
.sidebar .sponsor_list { text-align: center; margin-bottom: 30px; }
.sidebar .sponsor_list img { border: 1px solid #ccc; }


.sidebar .gold h3 { background: linear-gradient(45deg, #B67B03 0%, #DAAF08 45%, #ffdb59 70%, #DAAF08 85%, #B67B03 90% 100%); }
.sidebar .silver h3 { background: linear-gradient(45deg, #757575 0%, #9E9E9E 45%, #d6d6d6 70%, #9E9E9E 85%, #757575 90% 100%); }
.sidebar .bronze h3 { background: linear-gradient(45deg, #a03d0f 0%, #d14f1c 45%, #fec6a0 70%, #d14f1c 85%, #a03d0f 90% 100%); }
.sidebar .medical h3 { background: #e34444; }
.sidebar .other2 h3 { background: #464646 }
.sidebar h3 { background: #97cd6d; }

.sidebar .hotel img { max-width: 240px; }

@media screen and ( 671px <= width ), print {
	.sidebar { width: 180px; }
	.sidebar h3 { font-size: 1em; }
	.sidebar .hotel img { max-width: 180px; }
}

@media screen and ( 1024px <= width ), print {
	.sidebar { width: 240px; }
	.sidebar h3 { font-size: 1.2em; }
	.sidebar .hotel img { max-width: 240px; }
}


main#Index section + section { margin-top: 80px; }
main#Index .banner-area + section { margin-top: 2.5rem; }

@media screen and ( 671px <= width ), print {
	main#Index .banner-area + section { margin-top: 52px; }
}

main#Index .main-column h2 { position: relative; font-size: 1.5em; font-weight: bold; height: 2.5em; margin: 0 auto 25px auto; 
	background-size: auto auto;
background-color: #c7e8fa;
background-image: repeating-linear-gradient(0deg, transparent, transparent 4px, rgba(84, 195, 241, 1) 4px, rgba(84, 195, 241, 1) 5px );
border-bottom: 5px solid #54C3F1 ;

}

main#Index .main-column h2:before { position: absolute; content: ''; display: block; bottom: 0px; left: 0px; width: 15%; height: calc(100%); background-color: #fff; clip-path: polygon(60% 0, 0% 0%, 0% 100%, 75% 0%); }
main#Index .main-column h2:after { position: absolute; content: ''; display: block; bottom: -5px; right: -1px; width: 15%; height: calc(100% + 6px); background-color: #fff; clip-path: polygon(60% 0, 100% 0%, 100% 100%, 75% 0%); }

main#Index .main-column h2 span { position: absolute; bottom: -5px; display: block; width: 200px; text-align: center; border-radius: 50% / 100% 100% 0 0; background: #54C3F1; color: #fff; padding: 0 1.5em; line-height: 1; backface-visibility: hidden; overflow: hidden; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: 'Archivo Black', cursive; padding: 40px 0px 4px 0px; }
main#Index .main-column h2 span::first-letter { font-size: 1.5em; }



@media screen and ( 671px <= width ), print {
	main#Index .main-column h2 { background-image: url(../image/headline.png), repeating-linear-gradient(0deg, transparent, transparent 4px, rgba(84, 195, 241, 1) 4px, rgba(84, 195, 241, 1) 5px ); background-repeat: no-repeat, repeat; background-size: 50%, auto; background-position: bottom 4px right 28px, 0;}
}

main#Index .sns-area .box { width: 100%; }
main#Index .sns-area .box .Twitter { width: 100%; margin-bottom: 2rem; }
main#Index .sns-area .box .YouTube { width: 100%; }

main#Index .sns-area .box .YouTube iframe { width: 100%; aspect-ratio: 16/9; }

/* main#Index .sns-area h3 { border: 1px solid; border-radius: 50px; text-align: center; width: fit-content; padding: 0 2em; margin: 0 auto 25px auto; } */
main#Index .sns-area h3 { font-size: 1.3em; border: 1px solid; border-radius: 50px; text-align: center; width: fit-content; padding: 0 2em; margin: 0 auto 25px auto; }
main#Index .sns-area .box > div + div { margin-top: 2rem; }
main#Index .sns-area .box .YouTube h3 { padding: 0 4em; }
main#Index .sns-area .column1 { display: grid; grid-template-columns: repeat(1, 1fr); gap: 25px; margin-bottom: 25px; }
main#Index .sns-area .column2 { width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(1, 1fr); gap: 25px; margin-bottom: 25px; }

@media screen and ( 671px <= width ), print {
	main#Index .sns-area .box { gap: 25px; }
	main#Index .sns-area .box .Twitter { width: 100%; }
	main#Index .sns-area .box .YouTube { width: 100%; }
}

@media screen and ( 1024px <= width ), print {
	main#Index .sns-area .box { gap: 25px; }
	main#Index .sns-area .box .Twitter { width: 100%; }
	main#Index .sns-area .box .YouTube { width: 100%; }
	main#Index .sns-area .column1 { margin-bottom: 25px; }
	main#Index .sns-area .column2 { width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; }
	main#Index .sns-area .column3 { width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }

	/* main#Index .sns-area .box { width: 100%; display: flex; gap: 25px; }
	main#Index .sns-area .box .Twitter { width: 40%; margin-bottom: 0; }
	main#Index .sns-area .box .YouTube { width: 60%; } */
}

table.EntryState { width: 100%; text-align: center; font-size: 17px; /*font-size: 14px;*/ }
table.EntryState :is( th, td ) { display: block; }
table.EntryState th { display: none; background: #ffe0ee; text-align: center; }
table.EntryState td { background: #ffffff; }

table.EntryState [class^="btn"] { min-width: 8em; text-decoration: none;  font-weight: 700; overflow: hidden; transition: all .3s ease; position: relative; display: inline-block; box-shadow: inset 2px 2px 2px 0 hsl(0deg 0% 100% / 50%); white-space: nowrap; border-radius: 50px; padding: 5px 15px; opacity: 1; transition: .4s; }
table.EntryState [class^="btn"]:hover { opacity: .7; transition: .4s; }
table.EntryState .btn { color: #555; background: #FED325; }
table.EntryState .btn_pre { color: #555; background: #ddd; pointer-events: none; }
table.EntryState .btn_end { color: #fff; background: #ce4040; /*pointer-events: none;*/ }
table.EntryState .btn:hover { padding-right: 24px; padding-left: 8px; }
table.EntryState .btn:hover::after { opacity: 1; right: 5px; }
table.EntryState .btn::after { content: "\BB"; position: absolute; opacity: 0; font-size: 1.5em; top: 0; right: -20px; transition: .4s; }

table.EntryState td:nth-child(1)::before { content: ""; display: inline-block; width: 3em; background: #fff; color: #e60012; font-size: .8em; border-radius: 3px; text-align: center; margin-right: 1em; }
table.EntryState td.ad:nth-child(1)::before { content: "先行"; display: inline-block; border: 1px solid; width: 4em; }
table.EntryState td.gen:nth-child(1)::before { content: "一般"; display: inline-block; border: 1px solid; width: 4em; }
table.EntryState td.new:nth-child(1)::before { content: "募集中"; display: inline-block; background: #e60012; color: #fff; border: 2px solid #e60012; width: 4em;  }


@media screen and ( 440px <= width ) {
	table.EntryState br { display: none; }
}

@media screen and ( width <= 670px ) {
	/* table.EntryState { font-size: 12px; } */
	table.EntryState :is( th, td ) { padding: .4em .4em; }
	table.EntryState tr { display: flex; justify-content: center; flex-wrap: wrap; }
	table.EntryState tr:first-child { display: none; }
	/* table.EntryState td:nth-child(1) { width: 75%; text-align: left; background: #ffe0ee; }
	table.EntryState td:nth-child(2) { width: 25%; border: 1px solid #ffe0ee; }
	table.EntryState td:nth-child(3) { width: 50%; display: flex; }
	table.EntryState td:nth-child(3) a { width: 100%; margin-top: 3px; }
	table.EntryState td:nth-child(4) { width: 100%; padding-top: 0; } */
	table.EntryState td:nth-child(1) { width: 100%; text-align: left; background: #ffe0ee; }
	table.EntryState td:nth-child(2) { width: 50%; display: flex; }
	table.EntryState td:nth-child(2) a { width: 100%; margin-top: 3px; }
	table.EntryState td:nth-child(3) { width: 100%; padding-top: 0; }
	table.EntryState tr + tr { margin: .5rem 0 0 0; }
	table.EntryState tr { border: 3px solid #ffe0ee; }
}

@media screen and ( 671px <= width ), print {
	table.EntryState :is( th, td ) { width: auto; display: table-cell; vertical-align: middle; padding: 1em; }
	table.EntryState tr + tr { border-top: 1px solid #ffe0ee; }
	table.EntryState tr:last-child { border-bottom: 1px solid #ffe0ee; }
	table.EntryState td:nth-child(1) { text-align: left; }
	table.EntryState .btn::after { top: -1.3px; }
}

/* トップ・エントリーページ 共通 */
/* ボタン点滅 */
/* :is( table.EntryState, #Entry) .btn { animation: blink 0.7s ease-in-out 0s infinite alternate; }
@keyframes blink { 0% {opacity: 0.4} 100% {opacity: 1} } */

:is( table.EntryState, #Entry) .btn_end { color: #aaa !important; background: #efefef !important; }


.news-box { display: flex; flex-wrap: wrap; gap: 1rem; }
.news-box li { width: 100%; border: 1px solid #ccc;
	&.close {
		figure { position: relative;
			&::before { content: "受付終了"; font: 900 1.1em/1.7 var(--DefaultFont); color: #fff; background: #009844; position: absolute; top: 0; left: 0; z-index: 1; padding: 0 2px; }
			@media screen and ( 671px <= width ), print {
				&::before { font-size: .8em; }
			}
		}
	}
}
.news-box li img { width: 100%; }
.news-box li a { display: block; height: 100%; }
.news-box li .txt { padding: .5em; }
.news-box li:nth-child(n+13) { display: none; }

.news-box [class*="cat-"] { display: inline-block; width: 11em; text-align: center; font-size: .6em; line-height: 1; color: #fff; padding: 5px 0; }
.news-box .cat-entry { background: #009FE8; } /* エントリー */
.news-box .cat-root { background: #009844; } /* 応援 */
.news-box .cat-prize { background: #009844; } /* 参加賞Tシャツ, 抽選商品 */
.news-box .cat-guest { background: #FF8000; } /* ゲスト */
.news-box .cat-event { background: #E3007F; } /* イベント */
.news-box .cat-video { background: #E50012; } /* 動画 */
.news-box .cat-comment { background: #69008c; } /* 名誉大会長コメント */
.news-box .cat-press-conference { background: #000000; } /* 記者会見 */
.news-box .cat-other { background: #FFC926; } /* その他 */
.news-box .cat-feature { background: #AA005E; } /* 特集記事 */
.news-box .cat-info { background: #0bbab5; } /* インフォメーション */
.news-box .cat-news { background: #C28F6D; } /* お知らせ */

.news-box .date { font-size: .8em; margin-left: 5px; }
.news-box li p { margin-top: 4px; }

@media screen and ( 671px <= width ), print {
	.news-box li { width: calc((100% - ( 1rem * 1 )) / 2 ); }
}

@media screen and ( 1024px <= width ), print {
	.news-box li { width: calc((100% - ( 1rem * 1 )) / 2 ); }
}

@media screen and ( 1280px <= width ), print {
	.news-box li { width: calc((100% - ( 1rem * 3 )) / 4 ); }
}

/* ---------------------------------------------------------------------------------------------
	ニュース - news.html
---------------------------------------------------------------------------------------------*/

#News section { box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem; }
#News section + section { margin-top: 3rem; }
#News section h2 { text-align: center; font-size: 1.2em; font-weight: bold; border-radius: 50px; padding: .5em .5em; margin-bottom: 1.5rem; }
#News section .date { text-align: right; margin-bottom: 1rem; }
#News section p + p { margin-top: 1rem; }
#News section :is(figure, picture) { display: block; max-width: 95%; text-align: center; margin: 0 auto; }
#News section figure figcaption { margin-top: 1rem; }
#News section iframe { width: 100%; aspect-ratio: 16/9; }
#News section :is(figure, picture) + :is(p,div) { margin-top: 2rem; }
#News .cont { font-size: 1.3em; }
#News section a { text-decoration: underline; }
#News section a:hover { text-decoration: none; }

@media screen and ( 1024px <= width ), print {
	#News section { padding: 3rem; }
	#News section h2 { font-size: 1.4em; }
	#News section :is(figure, picture) { max-width: 850px; }
}

#News section.cat-entry h2 { background: #009FE833; } /* エントリー */
#News section.cat-root h2 { background: #00984433; } /* 応援 */
#News section.cat-prize h2 { background: #00984433; } /* 参加賞Tシャツ, 抽選商品 */
#News section.cat-guest h2 { background: #FF800033; } /* ゲスト */
#News section.cat-event h2 { background: #E3007F33; } /* イベント */
#News section.cat-video h2 { background: #E5001233; } /* 動画 */
#News section.cat-comment h2 { background: #69008c33; } /* 名誉大会長コメント */
#News section.cat-press-conference h2 { background: #66666633; } /* 記者会見 */
#News section.cat-other h2 { background: #FFC92633; } /* その他 */
#News section.cat-feature h2 { background: #E4007F33; } /* 特集記事 */
#News section.cat-info h2 { background: #0bbab533; } /* インフォメーション */
#News section.cat-news h2 { background: #C28F6D33; } /* お知らせ */

/* 参加賞Tシャツ */
.SizeTable { width: 100%; table-layout: fixed; border-collapse: separate; background: var(--sub-color2); border: 5px solid var(--sub-color2); border-spacing: 2px 2px; margin: 0 0 10px 0; }
.SizeTable :is( th, td ) { width: auto; text-align: center; vertical-align: middle; padding: .5em 0em; } 
.SizeTable th { background: var(--main-color); color: #fff; }
.SizeTable td { background: #fff; }

/* 記事別調整 */
#News .modal { text-align: center; margin-bottom: 40px; }
#News .modal > .flexbox { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
#News .modal a { display: block; width: fit-content; text-decoration: none; margin: 0 auto; }
#News .modal img { border: 1px solid #ccc; }
#News .modal p { margin-top: 15px; }

@media screen and ( 671px <= width ), print {
	#News .modal > .flexbox { flex-wrap: nowrap; gap: 25px; }
}


#News [class^="btn_"] { width: fit-content; min-width: 174px; font-size: initial; text-decoration: none;  font-weight: 700; overflow: hidden; transition: all .3s ease; position: relative; display: inline-block; box-shadow: inset 2px 2px 2px 0 hsla(0, 0%, 100%, 0.5); white-space: nowrap; border-radius: 50px; padding: 5px 15px; margin-top: 20px; opacity: 1; transition: .4s; }
#News [class^="btn_"]:hover { opacity: .7; transition: .4s; }
#News .btn_app { color: #555; background: #FED325; }
#News .btn_end { color: #aaa; background: #efefef; text-align: center; pointer-events: none; min-width: 174px; }

#News #sec29 [class^="btn_"] { margin: 10px 0 15px 0; }

@media screen and (min-width: 671px), print {
	#News [class^="btn_"] { font-size: initial; text-align: center; margin-top: 15px; }
	#News [class^="btn_"]::after { top: -12px; }

	#News [class^="btn_"] { width: fit-content; }

	#News :is(.btn_app):hover { width: fit-content; padding-right: 48px; padding-left: 24px; }
	#News :is(.btn_app):hover::after { opacity: 1; right: 12px; }
	#News :is(.btn_app)::after { content: "\BB"; position: absolute; opacity: 0; font-size: 2.15em; top: -.3em; right: -20px; transition: .4s; }
}

#News .open { margin-top: 1rem; }
#News .open[data-readmore] { transition: height 750ms; overflow: hidden; }
#News a[class^="more-btn"] { display: block; max-width: 600px; text-align: center; background: #F1F1F1; border-radius: 10px; text-decoration: none; margin: 0px auto 0 auto; padding: 5px 3em; }
#News a.more-btn_close { margin: 16px auto 0 auto; }

#News .flexbox { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 2rem; }

@media screen and ( 671px <= width ), print {
	#News .flexbox { flex-wrap: nowrap; gap: 25px; }
	#News .vertical img { max-height: 760px; }
}

#News .cont {
	[class^="column"] { display: grid; gap: 10px; margin-bottom: 2rem; }
	.column1 { grid-template-columns: repeat(1, 1fr); }
	.column2 { grid-template-columns: repeat(2, 1fr); }
	.column3 { grid-template-columns: repeat(3, 1fr); }
}

#News .cat-feature p { text-indent: 1em; }
:is(#sec14, #sec20) img { border: 1px solid #ccc; }

#sec20 .cont .column3 { margin-top: 24px; }
#sec20 figcaption::before { font-family: "Font Awesome 5 Free"; content: "\f1c1"; font-weight: bold; margin-right: 5px; }

@media screen and ( width <= 670px ) {
	#sec20 .cont .column3 { grid-template-columns: repeat(1, 1fr); }
}


@media screen and ( 671px <= width ), print {
	#sec14 .flexbox { flex-direction: row-reverse; }
}


.notes { color: #cc0000; font-weight: 700; border-radius: 5px; padding: 1em; margin: 1em 0; }
.cat-entry .notes { background: #009FE81a; } /* エントリー */
.cat-root .notes { background: #0098441a; } /* 応援 */
.cat-prize .notes { background: #0098441a; } /* 参加賞Tシャツ, 抽選商品 */
.cat-guest .notes { background: #FF80001a; } /* ゲスト */
.cat-event .notes { background: #E3007F1a; } /* イベント */
.cat-video .notes { background: #E500121a; } /* 動画 */
.cat-comment .notes { background: #69008c1a; } /* 名誉大会長コメント */
.cat-press-conference .notes { background: #6666661a; } /* 記者会見 */
.cat-other .notes { background: #FFC9261a; } /* その他 */
.cat-feature .notes { background: #E4007F1a; } /* 特集記事 */
.cat-info .notes { background: #0bbab51a; } /* インフォメーション */
.cat-news .notes { background: #C28F6D1a; } /* お知らせ */

.newser {
	background: #FFF9E6;
	color: #cc0000;
	font-weight: 700;
	border-radius: 5px;
	padding: 1em;
	margin: 1em 0;
}

/* ---------------------------------------------------------------------------------------------
	大会インフォメーション - information.html
---------------------------------------------------------------------------------------------*/

.AnkerList { font-size: 3vw; font-weight: bold; display: grid; flex-wrap: wrap; grid-template-columns: repeat(2, 1fr); text-align: center; gap: 1em; justify-content: center; margin: 0 auto 2.5rem auto;
	li {
		/* width: calc((100% - 2em) / 3); */
		/* @media screen and ( 1024px <= width ), print { width: calc( (100% - 4em) / 5); } */
	}
	a { display: block; background: var(--sub-color2); border-radius: 50px; padding: 8px 1em; }
	@media screen and ( 671px <= width ), print {
		font-size: 1.2em;
	}
	@media screen and ( 1024px <= width ), print {
		font-size: 1.2em; grid-template-columns: repeat(4, 1fr);
	}
}

#Information {
	
	
	section { font-size: 1em; box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem;
		@media screen and ( 1024px <= width ), print { font-size: 1.3em; }
		+ section { margin-top: 3rem; }

		a { text-decoration: underline;
			&:hover { text-decoration: none; }
		}

		h2 { text-align: center; font-size: 1.2em; background: var(--sub-color2); font-weight: bold; border-radius: 50px; padding: .5em .5em; margin-bottom: 1.5rem; }
		
		[class^="column"] { display: grid; gap: 10px;
			:is(figure, picture) { display: block; max-width: 95%; text-align: center; margin: 0 auto; }
			:is(figure, picture) + :is(p,div) { margin-top: 2rem; }
			a { text-decoration: underline; }
			a:hover { text-decoration: none; }
			img { border: 1px solid #ccc; }

			@media screen and ( width <= 670px ) { grid-template-columns: repeat(1, 1fr); }
		}

		figcaption { margin-top: 1rem; }
		figcaption::before { font-family: "Font Awesome 5 Free"; content: "\f1c1"; font-weight: bold; margin-right: 5px; }

		:is(figure, picture) + :is(p,div) { margin-top: 2rem; }
		:is(figure, picture) { max-width: 850px; margin: 0 auto; }

		.flex-box { display: flex; justify-content: center; align-items: center; gap: 20px 30px; }
		.flex-box.flex-wrap { flex-wrap: wrap; }

		&#option-entry .flex-box { align-items: flex-end; max-width: 870px; margin: 0 auto; }

		p + p { margin-top: 1rem; }

		/* 記事別調整 */
		.modal { text-align: center; margin-bottom: 40px; }
		.modal > .flexbox { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
		.modal a { display: block; width: fit-content; text-decoration: none; margin: 0 auto; }
		.modal img { border: 1px solid #ccc; }
		.modal p { margin-top: 15px; }

		@media screen and ( 671px <= width ), print {
			.modal > .flexbox { flex-wrap: nowrap; gap: 25px; }
		}

		[class^="btn_"] { width: fit-content; min-width: 174px; font-size: initial; text-decoration: none;  font-weight: 700; overflow: hidden; transition: all .3s ease; position: relative; display: inline-block; box-shadow: inset 2px 2px 2px 0 hsla(0, 0%, 100%, 0.5); white-space: nowrap; border-radius: 50px; padding: 5px 15px; margin-top: 20px; opacity: 1; transition: .4s; }
		[class^="btn_"]:hover { opacity: .7; transition: .4s; }
		.btn_app { color: #555; background: #FED325; }
		.btn_end { color: #aaa; background: #efefef; text-align: center; pointer-events: none; min-width: 174px; }


		@media screen and (min-width: 671px), print {
			[class^="btn_"] { font-size: initial; text-align: center; margin-top: 15px; }
			[class^="btn_"]::after { top: -12px; }

			[class^="btn_"] { width: fit-content; }

			:is(.btn_app):hover { width: fit-content; padding-right: 48px; padding-left: 24px; }
			:is(.btn_app):hover::after { opacity: 1; right: 12px; }
			:is(.btn_app)::after { content: "\BB"; position: absolute; opacity: 0; font-size: 2.15em; top: -.3em; right: -20px; transition: .4s; }
		}
	}
	

	@media screen and ( 671px <= width ), print {
		.column3 { grid-template-columns: repeat(3, 1fr); }
	}

	#traffic {
		.notes { background: #E9F7FD; }
	}

	#runner-guide {
		a { width: fit-content; display: block; margin: 0 auto; }
		.flexbox { display: grid; gap: 1.5em;
			@media screen and ( 671px <= width ), print { grid-template-columns: repeat(2, 1fr); gap: 1em }
			h3 { text-align: center; font-size: 1em; background: #aaaaaa33; border-radius: 6px; padding: .5em .5em; margin-bottom: 1.5rem; }
			img { width: 100%; max-width: 100%; }
		}
	}
}

#sec31 .cont .column3 { margin-top: 24px; }
#sec31 figcaption::before { font-family: "Font Awesome 5 Free"; content: "\f1c1"; font-weight: bold; margin-right: 5px; }

@media screen and ( width <= 670px ) {
	#sec31 .cont .column3 { grid-template-columns: repeat(1, 1fr); }
}

#News section { box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem; }
#News section + section { margin-top: 3rem; }
#News section h2 { text-align: center; font-size: 1.2em; font-weight: bold; border-radius: 50px; padding: .5em .5em; margin-bottom: 1.5rem; }
#News section p + p { margin-top: 1rem; }
#News section :is(figure, picture) { display: block; max-width: 95%; text-align: center; margin: 0 auto; }
#News section figure figcaption { margin-top: 1rem; }
#News section iframe { width: 100%; aspect-ratio: 16/9; }
#News section :is(figure, picture) + :is(p,div) { margin-top: 2rem; }
#News .cont { font-size: 1.3em; }
#News section a { text-decoration: underline; }
#News section a:hover { text-decoration: none; }

@media screen and ( 1024px <= width ), print {
	#News section { padding: 3rem; }
	#News section h2 { font-size: 1.4em; }
	#News section :is(figure, picture) { max-width: 850px; }
}

/* ---------------------------------------------------------------------------------------------
	大会要項 - outline.html
---------------------------------------------------------------------------------------------*/

#Outline section { font-size: 1.3em; box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem; }

@media screen and ( 1024px <= width ), print {
	#Outline section { font-size: 1.3em; }
	#Outline section + section { margin-top: 3rem; }
}

#Outline table { border-collapse: separate; border-spacing: 2px; }
#Outline table :is( th, td ) { width: 100%; display: block; }
#Outline table th { background: var(--main-color); color: #fff; text-align: justify; text-align-last: justify; text-align: center; padding: 1em 20%; }
#Outline table td {  background: #f6fbff; padding: 1em 1em; }

#Outline table ol li { text-indent: -1em; margin-left: 1em; }

#Outline table ul.disc { list-style: disc; margin-left: 1.5em; }
#Outline table ul.underline li { text-decoration: underline; }

#Outline table a { text-decoration: underline; }
#Outline table a:hover { text-decoration: none; }

@media screen and ( 671px <= width ), print {
	#Outline table th { width: 24%; white-space: nowrap; padding: 1em 2em; }
	#Outline table :is( th, td ) { display: table-cell; vertical-align: middle; }
}

/* ---------------------------------------------------------------------------------------------
	エントリー - entry.html
---------------------------------------------------------------------------------------------*/

#Entry .AnkerList a[href="#caution"] { background: #ffe9ef; }

#Entry article > section { font-size: 1.3em; }

#Entry section + section { margin-top: 2.5rem; }
#Entry section > section { margin: 0; transition: .4s; }
#Entry section > section:hover { transform: scale(1.05); transition: .4s; }
/* #Entry section > section:nth-child(1):hover {  background: #effaff; }
#Entry section > section:nth-child(2):hover { transform: scale(1.05); }
#Entry section > section:nth-child(3):hover { box-shadow: 0px 0px 6px 1px rgba(77, 172, 255, .6); } */
#Entry section a { text-decoration: underline; }

#Entry .entry-list { display: grid; grid-template-columns: repeat(1, 1fr); gap: 2.5rem; }
#Entry .entry-list > section > div + div { margin-top: 1.5em; }
#Entry .entry-list h3 { display: inline-block; font-weight: bold; border: 1px solid #aaa; border-radius: 8px; padding: 0 1em; margin-bottom: 8px; }
#Entry .entry-list h3.pre { border-color: transparent; background: #d1f1ff; }
#Entry .entry-list h3.gen { border-color: #999; }
#Entry .entry-list .bnr { text-align: center; }
#Entry .entry-list .bnr a { display: inline-block; text-decoration: none; }
#Entry .entry-list .bnr img { border: 1px solid #ccc; }
#Entry .entry-list .bnr .btn { width: 100%; display: inline-block; font: bold .9em/1.7 var(--DefaultFont); background: #fbf2c7; border-radius: 50px; text-decoration: none; margin-top: 16px; padding: 8px 0; }
#Entry .entry-list .bnr .btn { background: #FED325; color: #555; }
#Entry #caution h2 { background: #ffe9ef; }
#Entry .entry-list .bnr .btn:is( .pre, .end ){ background: #ebebeb; color: #999; }
#Entry .entry-list .bnr :has( .pre, .end ) { pointer-events: none; }
#Entry .entry-list div.end { position: relative; padding: 12px; }
#Entry .entry-list div.end a { pointer-events: none; }
#Entry .entry-list div.end::before { position: absolute; top: 0; left: 0; content: ""; width: 100%; height: 100%; border-radius: 8px; z-index: 1; background: #eeeeeed9; display: block; }
#Entry .entry-list div.end::after { content: "受付終了"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);z-index: 2; font: bold 1.35em/1.7 var(--DefaultFont) ; }

@media screen and ( 1024px <= width ), print {
	#Entry .AnkerList { display: none; }
	#Entry .entry-list { grid-template-columns: repeat(3, 1fr); gap: 3rem; }
}


/* ---------------------------------------------------------------------------------------------
	コース図
---------------------------------------------------------------------------------------------*/

#Coursemap .map { text-align: center; }
#Coursemap .map figure { text-align: center; margin-bottom: .5em; box-shadow: var(--box-shadow); border-radius: 10px; width: fit-content; margin: 0 auto; }
#Coursemap .map figure img { max-width: 100%; border-radius: 10px; }
#Coursemap .map p { font-size: 1.2em; background: #ffffffcc; margin-bottom: 10px; }
#Coursemap .pdf_icon::before { font-family: "Font Awesome 5 Free"; content: "\f1c1"; font-weight: bold; margin-right: 5px; }

@media screen and ( 671px <= width ), print {
	#Coursemap .map p br { display: none; }
}

/* --------------------------------------------------------------------------------------------
	スポンサー
-------------------------------------------------------------------------------------------- */

#Sponsor section { box-shadow: var(--box-shadow); border-radius: 10px; padding: 2rem; margin-bottom: 2rem; }

#Sponsor .sponsor_list img { border: 1px solid #ccc; }

#Sponsor h3 { color: #fff; font-size: 1em; font-weight: bold; text-align: center; text-shadow: 2px 2px 1px #33333388; letter-spacing: 1px; border-radius: 50px; padding: 10px 0px; margin-bottom: calc( 2rem + 5px ); }

#Sponsor section.gold h3 { background: linear-gradient(45deg, #B67B03 0%, #DAAF08 45%, #ffdb59 70%, #DAAF08 85%, #B67B03 90% 100%); }
#Sponsor section.silver h3 { background: linear-gradient(45deg, #757575 0%, #9E9E9E 45%, #d6d6d6 70%, #9E9E9E 85%, #757575 90% 100%); }
#Sponsor section.bronze h3 { background: linear-gradient(45deg, #a03d0f 0%, #d14f1c 45%, #fec6a0 70%, #d14f1c 85%, #a03d0f 90% 100%); }
#Sponsor section.other h3 { background: #97cd6d; }
#Sponsor section.medical h3 { background: #e34444; }
#Sponsor section.other2 h3 { background: #464646; }

@media screen and ( 1024px <= width ), print {
	#Sponsor h3 { font-size: 1.2em; }
}

#Sponsor ul.sponsor_list { display: flex; flex-wrap: wrap; justify-content: center; gap: 1em; text-align: center; list-style: none; }
#Sponsor ul.sponsor_list li { width: 100%; }
#Sponsor ul.sponsor_list li a { display: block; width: fit-content; text-decoration: none; color: #454545; font-size: 12px; margin: 0 auto; }
#Sponsor ul.sponsor_list li a:hover { opacity: 1; animation: flash 0.6s ease 0s  alternate; }
@keyframes flash { 0% {opacity: 0.2;} 100% {opacity: 1;} }
#Sponsor ul.sponsor_list img { vertical-align: bottom; max-width: 100%; }

#Sponsor section.gold span { font-size: 1.8em; }
#Sponsor section.silver span { font-size: 1.8em; }
#Sponsor section.bronze span { font-size: 1.8em; }


#Sponsor ul.sponsor_list.hotel div { max-width: 240px; }

@media screen and (max-width: 670px) {
	.sala1 { display: none; }
}

@media screen and (min-width: 671px), print {
	.sala2 { display: none; }
	#Sponsor ul.sponsor_list li { width: auto; }
	
	#Sponsor .sponsor-group.column3 li { width: calc(((100%) - 2em) / 3); }
	#Sponsor .sponsor-group.column4 li { width: calc(((100%) - 3em) / 4); }
	#Sponsor section.gold img { max-width: 500px; }
	#Sponsor section.silver img { max-width: 450px; }
	#Sponsor section.bronze img { max-width: 400px; }
	#Sponsor section.medical img { max-width: 450px; }
	
}

@media screen and ( 1024px <= width ), print {
	#Sponsor .sponsor-group.column3 { max-width: 65%; margin: 0 auto; }
}

/* ---------------------------------------------------------------------------------------------
	ゲスト - guest.html
---------------------------------------------------------------------------------------------*/

#Guest .grid { display: grid; grid-template-columns: repeat(1, 1fr); gap: 2rem; }
#Guest h2 { width: 100%; height: fit-content; }

#Guest .guestbox { padding: 20px; }
#Guest .guestbox .name { font-size: 1.5em; font-weight: bold; color: var(--main_color); margin-bottom: 1rem; }
#Guest .guestbox .photo { margin-bottom: 1em; }
#Guest .guestbox .comment { background: #ffeef5; border-radius: 10px; padding: 1em; margin-top: 1rem; }
#Guest .guestbox .position { margin-bottom: 1em; }
#Guest .guestbox p + p { margin-top: 1em; }
#Guest .guestbox a { text-decoration: underline; word-break: break-all; }
#Guest .guestbox a:hover { text-decoration: none; }
#Guest .guestbox .ComingSoon { display: flex; align-items: center; justify-content: center; font-size: 1.2em; width: 100%; min-height: 200px; }
#Guest .guestbox .ComingSoon p { margin-top: 1em; }

@media screen and ( 671px <= width ), print {
	#Guest .flex-box { display: flex; gap: 20px; }
	#Guest .photo { flex: 25%; }
	#Guest .textarea { flex: 75%; }
}

/* @media ( 671px <= width <= 1023px ) {
	#Guest .flex-box { display: flex; gap: 20px; }
	#Guest .photo { flex: 25%; }
	#Guest .textarea { flex: 75%; }
} */

/* @media screen and ( 1024px <= width ), print {
	#Guest .grid { display: grid; grid-template-columns: repeat(2, 1fr); }
	#Guest .guestbox .ComingSoon p { margin-top: 1em; }
} */


/* ---------------------------------------------------------------------------------------------
	共通設定 穂の国ランニングサポーター/チャリティーエントリー - entry-supporter.html/entry-charity.html
---------------------------------------------------------------------------------------------*/

:is(#Entry-supporter, #Charity-entry) .cont { font-size: 1.3em; }

:is(#Entry-supporter, #Charity-entry) [class^="btn"] { width: 95%; font-size: 1.3em; text-decoration: none;  font-weight: 700; overflow: hidden; transition: all .3s ease; position: relative; display: inline-block; box-shadow: inset 2px 2px 2px 0 hsla(0, 0%, 100%, 0.5); border-radius: 50px; padding: 14px 30px; }
:is(#Entry-supporter, #Charity-entry) [class^="btn"]:hover { opacity: 1; }
:is(#Entry-supporter, #Charity-entry) .btn { color: #555; background: #FED325; }
:is(#Entry-supporter, #Charity-entry) .btn_pre { color: #555; background: #ddd; pointer-events: none; }
:is(#Entry-supporter, #Charity-entry) .btn_end { color: #fff; background: #ce4040; pointer-events: none; }

:is(#Entry-supporter, #Charity-entry) .btn::before { content: "\f25a"; font: var(--Font-Awesome); margin-right: 8px; }


@media screen and (min-width: 671px), print {
	:is(#Entry-supporter, #Charity-entry) [class^="btn"] { font-size: 1.5em; width: 580px; padding: 10px 24px; margin-top: 20px; }
	:is(#Entry-supporter, #Charity-entry) .btn::after { top: -12px; }

	:is(#Entry-supporter, #Charity-entry) .btn:hover { padding-right: 48px; padding-left: 24px; }
	:is(#Entry-supporter, #Charity-entry) .btn:hover::after { opacity: 1; right: 12px; }
	:is(#Entry-supporter, #Charity-entry) .btn::after { content: "\BB"; position: absolute; opacity: 0; font-size: 2.15em; top: -.3em; right: -20px; transition: .4s; }
}


/* ---------------------------------------------------------------------------------------------
	穂の国ランニングサポーター - entry-supporter.html
---------------------------------------------------------------------------------------------*/

#Entry-supporter article > section { box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem; }
#Entry-supporter section + section { margin-top: 3rem; }
#Entry-supporter section h2 { background: var(--sub-color2); text-align: center; font-size: 1.2em; font-weight: bold; border-radius: 6px; padding: .5em .5em; margin-bottom: 1.5rem; }
#Charity-entry section + section { margin-top: 3rem; }
#Entry-supporter figure { text-align: center; margin: 0 auto; }
#Entry-supporter :is(p,div,figure) + :is(p,div,figure) { margin-top: 2rem; }
#Entry-supporter p + p { margin-top: 1rem; }
#Entry-supporter .flex-box { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 20px 30px; }

#Entry-supporter figure.bib { max-width: 480px; margin: 0 auto; }
#Entry-supporter figure.bib img { border: 1px solid #ccc; }
#Entry-supporter figure.bib figcaption { font-size: 1em; margin-top: 8px; }

table.Lifesaving-training { max-width: 100%; border-collapse: collapse; }
table.Lifesaving-training :is(th,td) { font-size: 1.15rem; border: 1px #CCCCCC solid; vertical-align: middle; padding: 8px 8px; }
table.Lifesaving-training caption { margin-bottom: 8px; }

#Entry-supporter .img_group { display: flex; justify-content: center; gap: 5%; }
#Entry-supporter .img_group figure { margin: 0; }
#Entry-supporter .img_group figure img { max-width: 120px; }
#Entry-supporter .img_group figure figcaption { font-size: .85em; margin-top: 8px; }

#Entry-supporter figure.Lifesaving-training { margin: 0; }



@media screen and ( 1024px <= width ), print {
	#Entry-supporter section { padding: 3rem; }
	#Entry-supporter section + section { margin-top: 0rem; }
	#Entry-supporter section h2 { font-size: 1.4em; }
	#Entry-supporter figure { max-width: 850px; }
}

/* ---------------------------------------------------------------------------------------------
	チャリティーエントリー - entry-charity.html
---------------------------------------------------------------------------------------------*/

#Charity-entry article > section { box-shadow: var(--box-shadow); border-radius: 10px; padding: 1.5rem; }
#Charity-entry section + section { margin-top: 3rem; }
#Charity-entry section h2 { background: var(--sub-color2); text-align: center; font-size: 1.2em; font-weight: bold; border-radius: 6px; padding: .5em .5em; margin-bottom: 1.5rem; }
#Charity-entry a { text-decoration: underline; }
#Charity-entry a:hover { text-decoration: none; }


#Charity-entry :is(p,div,figure) + :is(p,div,figure) { margin-top: 2rem; }
#Charity-entry p + p { margin-top: 1rem; }

#Charity-entry .banner { width: fit-content; margin: 15px auto 0 auto; }
#Charity-entry .banner { display: block; }
#Charity-entry .banner div + div { margin-top: 10px; }

@media screen and ( 1024px <= width ), print {
	#Charity-entry section { padding: 3rem; }
	#Charity-entry section + section { margin-top: 0rem; }
	#Charity-entry section h2 { font-size: 1.4em; }
	#Charity-entry figure { max-width: 850px; }
}


/* ---------------------------------------------------------------------------------------------
	動画 - video
---------------------------------------------------------------------------------------------*/

#opv-wrap { position: relative; z-index: 9999; }
video.opv { position: fixed; top: 0; left: 0; object-fit: cover; width: 100vw; height: 100vh; vertical-align: bottom; background: #fff; }

@media screen and ( width <= 670px ) {
	video.opv.pc { display: none; }
}

@media screen and ( 671px <= width ), print {
	video.opv.sp { display: none; }
}

/* 動画非表示 確認用 後で消す */
/* #opv-wrap { display: none; z-index: -10; }
video#opv { display: none; } */

#opv-wrap.finished { animation: VideoFadeOut 1.5s ease 0s 1 forwards; }
@keyframes VideoFadeOut { 0% {opacity: 1} 100% { opacity: 0; display: none; z-index: -10; } }

#opv-wrap.visited { display: none; }