@charset "UTF-8";

/* header
================================================= */
header {
  width: 100%;
  padding-block: 1px;
  background: #0055A2;
  color: #fff;
}
header h1 {
  width: 75%;
	margin: 8% auto;
}
@media print, screen and (min-width: 600px) {
  header h1 { width: min(65%,780px); margin: min(6%,70px) auto; }
}


/* main : common
================================================= */
main {
  margin-block: 8%;
}
main > * + * {
  width: min(100%,1200px);
  margin-top: 15%;
  margin-inline: auto;
}
@media print, screen and (min-width: 600px) {
  main { margin-block: min(7%,100px); }
  main > * + * { margin-top: min(10%,120px); }
}

/* text : decoration */
.text-small {
  font-size: 0.85em;
}
.text-large {
  font-size: 1.25em;
}
.text-largest {
  font-size: 1.3em;
}
.text-bold {
  font-weight: bold;
}
.text-red {
  color: #C80028;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
@media print, screen and (min-width: 600px) {
  .text-largest { font-size: 1.45em; }
}
@media print, screen and (min-width: 960px) {
  .text-largest { font-size: 1.6em; }
}

/* text : line break control */
.clause {
  display: inline;
}
h2 .clause,
h3 .clause,
h4 .clause {
  display: inline-block;
}
@media print, screen and (min-width: 600px) {
  .clause { display: inline-block; }
}

/* button */
.btn-wrap {
  margin-top: 5%;
}
a.btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(90%,280px);
  height: 64px;
  margin: 0.4em auto;
  padding: 0 1.0em;
  border-radius: 3px;
  background: #e2da00;
  color: #222;
  font-size: 1.05em;
  font-weight: bold;
  line-height: 1.4;
  text-decoration: none;
  transition: .2s;
}
a.btn:hover,
a.btn:active {
  background: #222;
  color: #fff;
}
a.btn::after {
  content: '';
  display: block;
  width: 12px;
  height: 24px;
	background-image: url(../image/icon_arrow-head.svg);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: cover;
}
a.btn:hover::after,
a.btn:active::after {
	background-position: right center;
}
@media print, screen and (min-width: 600px) {
  .btn-wrap { margin-top: 3.5%; }
  a.btn { width: 320px; max-width: inherit; height: 72px; padding: 0 1.3em; }
}
@media print, screen and (min-width: 960px) {
  a.btn { width: 360px; height: 80px; }
}
@media print, screen and (min-width: 1366px) {
  a.btn { height: 84px; }
}

/* p */
p + p {
  margin-top: 0.4em;
}


/* main
================================================= */
/* lineup */
.lineup {
  width: min(90%,1200px);
  margin-inline: auto;
}
.lineup ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  list-style: none;
  margin: -5% 0 0;
  padding: 0;
}
.lineup li {
  width: 48%;
  margin-top: 4%;
  padding: min(2%,25px) min(3%,30px);
  border-radius: 5px;
  background-color: #ffffff;
}
.lineup li > a {
  display: block;
  font-size: 1.05em;
  font-weight: bold;
  line-height: 1.4;
  text-decoration: none;
  transition: .2s;
}
.lineup li > a img {
  margin-top: 0.2em;
  margin-bottom: calc(0.2em + 2%);
}
.lineup li > a:hover img,
.lineup li > a:active img {
  opacity: 0.7;
  transition: .2s;
}
@media print, screen and (min-width: 600px) {
  .lineup li { border-radius: 7px; }
  .lineup li > a { font-size: 1.1em; }
}
@media print, screen and (min-width: 960px) {
  .lineup li > a { font-size: 1.25em; }
}

/* intro */
.intro h2,
.intro > p {
  width: min(90%,1080px);
  margin-inline: auto;
}
.intro h2 {
  margin-bottom: min(2.5%,30px);
  font-size: 1.2em;
  line-height: 1.4;
  text-align: center;
}
.intro p + p {
  margin-top: 1.0em;
}
.intro .lineup {
  width: min(100%,1200px);
  margin-top: min(3%,35px);
  margin-inline: auto;
}
@media print, screen and (min-width: 600px) {
  .intro { text-align: center; }
  .intro h2 { font-size: 1.4em; }
}
@media print, screen and (min-width: 960px) {
  .intro h2 { font-size: 1.6em; }
}

/* inquiry */
.inquiry {
  width: 90%;
  margin-top: min(5%,40px);
  margin-inline: auto;
}
.inquiry section {
  padding: 4.5% 5%;
  border: 3px solid #0055A2;
  background: #fff;
}
.inquiry section h3 {
  margin-bottom: 2.5%;
  line-height: 1.4;
  text-align: center;
}
.inquiry section h3 {
  font-size: 1.15em;
}
.inquiry section ul {
  margin: 0.5em auto;
  padding: 0 0 0 1.5em;
}
.inquiry section li {
  margin-bottom: 0.3em;
}
.inquiry section p.notes {
  margin-top: 5%;
  font-size: 0.95em;
}
@media print, screen and (min-width: 600px) {
  .inquiry { width: min(80%,850px); }
  .inquiry h3 { font-size: 1.3em; }
  .inquiry section p.notes { margin-top: 3.5%; }
}

/* archives */
.archives {
  width: min(90%,1080px);
  margin-inline: auto;
}
.archives section {
  padding: 5%;
  border-radius: clamp(8px, 1.8vw, 20px);
  background: #fff;
}
.archives section + section {
  margin-top: 8%;
}
.archives section h2 {
  position: relative;
  margin-bottom: 5%;
  color: #0055A2;
  font-size: clamp(1.9rem, 6.0vw, 2.8rem);
  font-family: "MPLUS1p", sans-serif;
  line-height: 1.3;
  text-align: center;
}
.archives section h3 {
  font-size: 1.0em;
  margin-bottom: 0.1em;
}
.archives section h3::before {
  content: '【';
}
.archives section h3::after {
  content: '】';
}
.archives section .pic {
  margin-bottom: 4%;
}
.archives section .desc {
}
.archives section .award {
  margin-top: 5%;
  padding: min(4%,30px) min(5%,40px);
  border-radius: 5px;
  background: #E4EFFB;
}
.archives section .time {
  font-size: 1.05em;
  font-weight: bold;
}
@media print, screen and (min-width: 600px) {
  .archives section { padding: 4% 5%; }
  .archives section + section { margin-top: 5%; }
  .archives section h2 { margin-bottom: 4%; font-size: clamp(2.8rem, 4.5vw, 3.9rem); }
  .archives section .pic { width: min(90%,840px); margin-inline: auto; margin-bottom: 3%; }
  .archives section .award { margin-top: 3%; }
  .archives section .time { font-size: 1.1em; }
}
@media print, screen and (min-width: 960px) {
  .archives section h2 { font-size: clamp(3.9rem, 3.4vw, 4.8rem); }
  .archives section .time { font-size: 1.2em; }
}