@charset "UTF-8";

/* ---------------------------------------------------------------------------------------------
	Import
---------------------------------------------------------------------------------------------*/

@import url(destyle.css) layer(reset);
@import url(fontawesome.css);
@import url(common.css);

/* ---------------------------------------------------------------------------------------------
	Root
---------------------------------------------------------------------------------------------*/

:root {
	--DefaultFont: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	--Font-Awesome: bold 1em/1 "Font Awesome 6 Free";
	--Font-Awesome-Brands: bold 1em/1 "Font Awesome 6 Brands";
}

/* ---------------------------------------------------------------------------------------------
	Basic
---------------------------------------------------------------------------------------------*/

/* html { font: 500 16px/1.7 var(--DefaultFont); 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 print {
	.wrap { width: 95%; margin: 0 auto; }
}

img { max-width: 100%; }

a { transition: .4s;
	&:hover { opacity: .75; transition: .4s; }
}

.Ttl02 { width: fit-content; text-align: center; font: 600 2rem/1.7 "Noto Serif JP", serif; color: #DAAF08; margin: 0 auto 0.25rem auto;
	@media screen and ( 768px <= width ), print {
		font-size: 2.5rem;
	}
}

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

header .header-wrap { max-width: 1200px; }

/* header { padding: 16px 0 16px 0;
	.logo { max-width: 300px; padding: 0 20px; margin: 0 auto; }
}

footer { background: #00125e; color: #fff; font-size: .75em; text-align: center; padding: 40px 20px 40px 20px;
	.box { display: grid; grid-template-columns: 1fr; gap: 24px;
		.logo { max-width: 300px; margin: 0 auto; padding: 0 20px;
			img { filter: brightness(0) invert(1); }
		}
	}
}

#pageTop { position: fixed; bottom: 20px; right: 20px;
	a { display: block; z-index: 999; padding: 10px 10px; width: 50px; height: 50px; background-color: var(--MainColor); font-size: 0.99rem; color: #fff; font-weight: bold; text-align: center; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); }
} */

/* ---------------------------------------------------------------------------------------------
	Main Contents
---------------------------------------------------------------------------------------------*/

.TopLogo { max-width: 480px; margin: 40px auto 80px auto; }

.Introduction { font-family: "Noto Serif JP", serif; text-align: center; margin: 0 auto 80px auto;
	@media screen and ( width <= 767px ) {
		text-align: left;
		br { display: none; }
		p + p { margin-top: .75rem; }
	}
}

/* 受賞企業 */
table.award { width: fit-content; margin: 0 auto 80px auto;
	caption { text-align: center; font-weight: bold;
		&::before { content: '\f005'; font: var(--Font-Awesome); color: #b07c1f; margin-right: .5em; }
		&::after { content: '\f005'; font: var(--Font-Awesome); color: #b07c1f; margin-left: .5em; }
	}
	th, td { padding: 8px .5em; }
	td:nth-of-type(1) { text-align: center;
		span { display: block; border-radius: 50px; white-space: nowrap; padding: 0 1.25em; }
	}
	:is(.g, .s, .b) td:nth-of-type(1) span { outline: 3px ridge #fff; outline-offset: -3px; }
	.g td:nth-of-type(1) span { background: linear-gradient(45deg, #B67B03 0%, #DAAF08 15%, #ffdb59 50%, #DAAF08 85%, #B67B03 100%); outline-color: #ffdb59; }
	.s td:nth-of-type(1) span { background: linear-gradient(45deg, #757575 0%, #9E9E9E 15%, #d6d6d6 50%, #9E9E9E 85%, #757575 100%); outline-color: #d6d6d6; }
	.b td:nth-of-type(1) span { background: linear-gradient(45deg, #a03d0f 0%, #d14f1c 15%, #fec6a0 50%, #d14f1c 85%, #a03d0f 100%); outline-color: #fec6a0; }

	@media screen and ( width <= 767px ) {
		tr, th, td { display: block; }
	}

	@media screen and ( 768px <= width ), print {
		td:nth-of-type(1) { transform: scale(.95); }
		:is(.g, .s, .b) td:nth-of-type(1) span { text-align: justify; text-align-last: justify; }
	}
}

/* 応募企業一覧 */
table.list { width: 100%;  margin: 0 auto 80px auto;
	caption { margin-bottom: 1rem; }
	tr {
		/* border-bottom: 1px dotted #999; */
		padding: 1rem .5em; }
	tbody tr:nth-child(odd) { background: #ecedf5; }
	td:first-of-type {
		&:is(.g, .s, .b)::before { content: '\f521'; font: var(--Font-Awesome); font-size: 1.25em; margin-right: .25em; } 
		&.g::before { color: #DAAF08; }
		&.s::before { color: #9E9E9E; }
		&.b::before { color: #d14f1c; }
		@media screen and ( 768px <= width ), print {
			&:not(.g, .s, .b) { padding-left: 2.5em; }
		}
	}
	@media screen and ( width <= 767px ) {
		thead { display: none; }
		/* tr:first-of-type { border-top: 1px dotted #999; } */
		tr, th, td { display: block; }
		td:nth-of-type(1) { font-size: 1rem; font-weight: bold; }
		td:nth-of-type(n+2) { font-size: .85rem; }
	}
	@media screen and ( 768px <= width ), print {
		width: fit-content;
		caption { text-align: center; }
		thead { border-bottom: 1px solid #aaa; }
		tr { padding: 0; }
		td:first-of-type {
			&:is(.g, .s, .b)::before { margin-right: .5em; }
		}
		th, td { padding: 8px .5em; }
	}

	a { text-decoration: underline;
		&:hover { text-decoration: none; }
	}
	a[href^="http"]::after { content: '\f08e'; font: var(--Font-Awesome); margin-left: .25em; font-size: .8em; }
	a[href$=".pdf"]::after { content: '\f1c1'; font: var(--Font-Awesome); margin-left: .25em; }
}

/* 開催概要 */
.outline { width: fit-content; border: 1px solid #333; margin: 0 auto 80px auto; padding: 1.5rem;
	.Ttl { font-size: 1.25rem; margin-bottom: .25em; }
	@media screen and ( 768px <= width ), print {
		padding: 2rem;
	}
}