@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Medium"); }
@font-face { font-family: "Yu Gothic M"; src: local("Yu Gothic Bold"); font-weight: bold; }
	
html, body {
		font-size: 1.4vw;
		color: #333;
		margin: 0;
		padding: 0;
		/*background-color: #81c0e3;*/
		min-height: 100%;
		height: auto;
}
@media screen and (min-width: 1281px) {/* 1281px以上の幅の場合に適応される */
html, body{	font-size: 14pt; }
}

body{
background: rgb(230,230,230);
/*background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(250,250,250,1) 49%, rgba(124,190,233,1) 100%);*/
}

* {
	box-sizing: border-box;
	font-family:
  -apple-system, BlinkMacSystemFont,
  "游ゴシック体", YuGothic,
  "Yu Gothic M",
  "游ゴシック Medium", "Yu Gothic Medium",
  "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3,
  "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN",
  "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",
  "メイリオ", Meiryo,
  Osaka,
  "ＭＳ Ｐゴシック", "MS PGothic",
  "Helvetica Neue", HelveticaNeue,
  Helvetica,
  Arial,
  "Segoe UI",
  sans-serif,
  "Apple Color Emoji",
  "Segoe UI Emoji",
  "Segoe UI Symbol",
  "Noto Color Emoji";
}

@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, *{ font-family: "メイリオ", Meiryo, Helvetica, Arial, sans-serif; } /* IE11 */
}

/*
暗　0e5cac　14	92	172
明　227ddb　34　125	219
*/
.clearfix::after {
   content: "";
   display: block;
   clear: both;
}

#mirai{ /*background-image: url("../img/bg.jpg"); background-size: cover; background-position: top center; background-repeat: no-repeat;*/ }

#Wrapper{ display: flex; flex-direction: column; min-height: 100vh; }

/*header{ display: block; position: relative; margin: 1vw auto 0; padding: 0; text-align: center; width: 80%; max-width: 1280px; }*/
header{ display: block; margin: 0 auto 10px; padding: 0; width: 100%; height: 360px; background-color: #00713d; background-image: url(../img/header-bg.webp); background-position: center center; background-size: cover; }
#headerBLK{ display: block; margin: 0; padding: 0; width: 100%; height: 100%; }
header img{ width: auto; height: 100%; margin: 0 auto; display: block; }
.symbolImage{ width: 21.5%; height: auto; margin: 0; padding: 0; display: inline-block; }
.symbolWord{ width: 78.5%; height: auto; margin: 0; padding: 0; display: inline-block; }
.symbolImage img,
.symbolWord img{ width: 100%; height: auto; margin: 0; display: block; }
.visuallyhidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(0px 0px 99.9% 99.9%);
  clip-path: inset(0px 0px 99.9% 99.9%);
  border: 0;
}
main{ width: 80%; max-width: 1280px; margin: 0 auto; padding: 0; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
header{ height: 40vw; }
main{ width: 90%; }
}

/*menu--------------------------------------------------------------*/

/*menu open--------------------------------------------------------------*/

section{	border-radius: 0.1rem; font-size: 1rem; /*line-height: 2em;*/ }

section.contents{ width:100%; margin: 2em auto; padding: 1em; background-color: #fff; box-shadow: 0 0 5px rgba(20,20,20,0.1); line-height: 1.65; }/*calc( 100% - 18em )*/
section.contents section.contents{ box-shadow: 0 0 0 !important; border: 2px solid rgba(14,92,172,0.5); margin: 2em auto 0; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
section{	/*border-radius: 1rem;*/ font-size: 2.8rem; }
section.contents { /*flex: 0 1 100%; margin: 3rem;*/ margin: 3rem auto; padding: 3rem; }
}


footer{ display: block; width: 100%; background-color: #333; text-align: center; font-size: 0.7em; color:#ddd; margin: auto 0 0 0; padding: 2.5em 0; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
footer{ font-size: 2.2rem; padding: 4rem 0; }
}

.poster{ position: relative; width: 60%; margin: 0 auto 2em;}
.posterImage{ margin: 0 auto; padding: 0; width: 100%; /*max-width: 500px;*/ height: auto; display: block; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
.poster { width: 100%; }
.posterImage{ }
}

.pc{ display: inline-block !important; }
.sp{ display: none !important; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
.pc{ display: none !important; }
.sp{ display: inline-block !important; }
}


h1{ }
h2{ font-size: 1.6em; font-weight: bold; /*color:#023592;*/ padding: 0.25em 0.5em; margin-bottom: 0.8em; border-radius: 0.1rem; color: #fff; background: #777;
/*background: linear-gradient(-15deg, rgba(0,126,255,1) 0%, rgba(81,145,255,1) 49%, rgba(48,117,188,1) 100%);*/
background: rgb(31,48,84);
background: linear-gradient(90deg, rgba(0,113,61,1) 0%, rgba(0,174,134,1) 100%);
}
h2.backnum{ color: #fff; background: #444; }
h3{ font-size: 1.2em; font-weight: bold; margin-bottom: 0.5em; padding-bottom: 0.2em; }
/*
h3{ font-size: 1.2em; font-weight: bold; color: #0e5cac; border-bottom: 2px dotted rgba(14,92,172,0.3); margin-bottom: 0.5em; padding-bottom: 0.2em; }
h3:before { font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f152"; margin-right: 0.5em; }
h3.h3ex:before { content: "\f1b2" !important; }
*/
p{ font-size: 1rem; line-height: 2em; }
p.justify{ overflow-wrap: break-word; word-wrap: break-word; text-align: justify; }
p::after {
   content: "";
   display: block;
   clear: both;
}
img.photo{ display: inline-block; float: right; width: auto; height: 120px; position: relative; margin: 0 0 0 1em; border: 2px solid rgba(14,92,172,0.5); }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
h1{	}
h2{ font-size: 4.5rem; padding: 0.2em 0.5em; }
h3{ font-size: 3.5rem; }
p{ font-size: 2.8rem; line-height: 5rem; }
}


/*丸数字ほかインデント*/
span.indent{ display: inline-block; padding-left: 1em; text-indent: -1em; }
span.indent2{ display: inline-block; padding-left: 2em; text-indent: -2em; }
span.indent3{ display: inline-block; padding-left: 3em; text-indent: -3em; }
span.indent4{ display: inline-block; padding-left: 4em; text-indent: -4em; }
span.indent5{ display: inline-block; padding-left: 5em; text-indent: -5em; }
span.indent6{ display: inline-block; padding-left: 6em; text-indent: -6em; }


/* スライド表示トグル -----------------------*/
div.toggleBox {
font-size: 1.6em; font-weight: bold; /*color:#023592;*/ padding: 0.25em 0.5em; margin: 0; border-radius: 0.4rem; color: #fff;
background: rgb(48,117,188);
background: linear-gradient(-15deg, rgba(0,126,255,1) 0%, rgba(81,145,255,1) 49%, rgba(48,117,188,1) 100%);
}
.mRow {
  display: none;
}
.mClick { /*clearfix*/ overflow: hidden; *zoom: 1; }
.mClick div {
  background-image: url(../img/acc-open.svg);
  background-repeat: no-repeat !important;
  background-position: right center !important;
  cursor: pointer;
  /*background-size: contain;*/background-size: 1em 1em;
		padding-right: 2em;
}
.mClick.active div {
  background-image: url(../img/acc-close.svg);
}
.mClick div span {
  display: none !important;
}
.answer{ }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
div.toggleBox { font-size: 4rem; padding: 0.2em 0.5em; }
.mClick div { background-size: 3rem 3rem; padding-right: 1em; }
.answer{ }
}


/*--------------------次テキストリンク-----------------------*/
.gotoSCH{ text-align:center; padding-top: 1em; }
a.textLink { text-decoration: none; color: #00713d; display: inline-block; font-size: 1em; margin: 0 auto; border-bottom: none; line-height: 2em; }
a.textLink:hover { color: #990000; }
a.textLink::after { font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f138"; margin-left: 0.5em; }
a.textLink { position: relative; }
a.textLink::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #ee0000;
  transform-origin: bottom right;
  transform: scaleX(0);
  transition: transform 0.5s ease;
}
a.textLink:hover::before {
  transform-origin: bottom left;
  transform: scaleX(1);
}


/*--------------------ボタン-----------------------*/
.btnWrap{	text-align:center; position: relative; margin: 3% auto;	}
.btnShadow{	position: relative; display: inline-block;	}
.btnShadow:before {
  content: "";
  height: 3em;
  display: inline-block;
  position: absolute;
  left: 5%;
  right: 5%;
  bottom: -0.5em;
  /*z-index: -1;*/
  border-radius: 2rem;
  opacity: .5;
  filter: blur(1.5em);
  transform-style: preserve-3d;
  transition: all .3s ease-out;
		background: #000;
}
.btnShadow:hover::before {
  bottom: 0;
  filter: blur(1em);
}
 a.btn {
  display: inline-block;
		position: relative;
		font-size: 1.6em;
		font-weight: bold;
		margin: 0;
  padding: 0.5em 1em 0.5em 1em;
  text-decoration: none;
  border-radius: 0.4rem;
  color: #ffffff;
  background: linear-gradient(45deg, #003592 0%, #0861ff 100%);
  z-index: 2;
  will-change: transform, filter;
  transform-style: preserve-3d;
  transition: all .3s ease-out;
}
@media screen and (max-width: 1024px) {
/* 1024pxまでの幅の場合に適応される */
.btnWrap{	margin: 5% auto;	}
a.btn { font-size: 4em; padding: 0.5em 1em 0.5em 1.5em; border-radius: 1rem; color: #fff;	}
}
a.btn:hover {
  transform: scale(0.98); color: #fff;
}
a.btn:active,
a.btn:visited { color: #fff; }
a.btn:after { font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f35d"; margin-left: 0.5em; }
/*--------------------締め切り-----------------------*/
.close{ text-align: center; margin: 1em 0 0; font-weight: bold; color: #c00; }

/* scroll2top */
.scroll2top { display: table-cell; text-decoration: none; position: fixed; bottom: 10px; right: 10px; overflow: hidden; width: 50px; height: 50px; border: medium none; text-indent: 100%; background-color: #0e5cac; background-image: url(../img/backtotop.png); background-repeat: repeat; background-position: 0px 0px; border-radius: 5px 5px 5px 5px; transition: all 0.4s ease 0s; z-index: 10000; }
.scroll2top:hover { background-color: #227ddb; background-image: url(../img/backtotop.png); background-position: 0px -50px; }
.scroll2top:active, .scroll2top:focus { outline: medium none; }


/* バックナンバー */
ul#backnumBLK{ margin: 0; padding: 0; list-style: none; font-size: 1rem; }
ul#backnumBLK li{ display: block; margin: 1em 0 0 0; padding: 0 0 01em 0; border-bottom: 1px dotted #ccc; }
ul#backnumBLK li a{ text-decoration: none; border-bottom: none; }
ul#backnumBLK li a span{ display: inline-block; margin: 0 0.5em 0 0; padding: 0.1em; background-color: #999; color: #fff; border-radius: 3px; width: 4.5em; text-align: center; font-size: 0.9em; font-weight: bold; }
@media screen and (max-width: 1024px) {
/* 1024pxまでの幅の場合に適応される */
ul#backnumBLK li{ font-size: 2.8rem; }
ul#backnumBLK li a span{ display: block; margin-bottom: 0.5em; }
}

/*共催協賛*/
table.corpTable1{ display: inline-block; float: left;}
table.corpTable2{ display: inline-block; float: none;}
table.corpTable2::after{ content: ""; clear: both; clear: all; }
@media screen and (max-width: 1024px) {
/* 1024pxまでの幅の場合に適応される */
table.corpTable1{ display: block; float: none;}
table.corpTable2{ display: block; float: none;}
}

/*枠線説明*/
fieldset{ padding: 0.5em 1em 1em; border-color: rgba(14,92,172,0.3); border-radius: 0.5em; margin: 0.5em 0; }
legend{ padding: 0 0.5em; font-weight: bold; }
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
fieldset{ font-size: 2.8rem; line-height: 5rem; }
}

/**/
ol{ margin-left:1em; }
.insertImg{ display: block; margin: 0 auto; border: none; width: 50%; height: auto; }
.insertImg.semiwideImg{ width: 75%; }
.insertImg.wideImg{ width: 100%; }
.prImg{ display: block; margin: 0 auto; border: none; width: 50%; height: auto; }
.prImg.semiwideImg{ width: 75%; }
.prImg.wideImg{ width: 100%; }
.corpLink{ text-align: center; }
.colmnWrap{ display: flex; justify-content: space-between; align-items: flex-start; }
.colmnDiv{ display: block; width: 48%; }
.colmnDiv .insertImg{ width: 90%; height:auto; }
.list-link{ list-style: none; display: flex; flex-wrap: wrap; justify-content: center; padding: 0; margin: 1.5em auto; }
.list-link li{ margin: 0 10px 10px; padding: 0; }
.list-link li a{ text-decoration: none; }
.list-link li a::after{ font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f138"; margin-left: 0.2em; }
html {scroll-behavior: smooth;}
@media screen and (max-width: 1024px) {/* 1024pxまでの幅の場合に適応される */
.prImg,
.insertImg.semiwideImg,
.insertImg.wideImg,
.prImg,
.prImg.semiwideImg,
.prImg.wideImg{ width: 100%; }
.colmnWrap{ display: block; }
.colmnDiv{ width: 100%; }
.colmnDiv + .colmnDiv{ margin-top: 1em; }
.insertImg{ width: 100%; }
.list-link{ font-size: 2.8rem; margin: 1em auto; }
}


/*テキストリンク*/
a{color:#00713d; text-decoration: none; border-bottom: 1px dotted #00713d;}
a:hover,a:active{color:#00713d;}
a:visited{color:#00713d;}

