/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@700&display=swap');

* {
margin:0;
padding:0;
vertical-align:top;
/*outline: 1px solid #ddd;*/
}
*,
::before,
::after {box-sizing:inherit;}

::before,
::after {
vertical-align:inherit;
text-decoration:inherit;
}
::selection {
color: #fff;
background-color: #78B97F;
}


body {
scroll-behavior: smooth;
height: 100%;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
form,
fieldset,
input,
textarea,
blockquote,
th,
td {margin:0;padding:0;}

address,
caption,
cite,
code,
em,
th,
var {font-style:normal;}

ul {list-style:none;}
table {
border-collapse:collapse;
border-spacing:0;
width: 100%;
}

caption,
th {text-align:left;}

q::before,
q::after {content:'';}

object,
embed {vertical-align:top;}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span {font-size:100%;}


/* ////////////// デバイス共通 ////////////// */
body {
font:18px/2.5 'Noto Sans JP', sans-serif;;
overflow-x:hidden;
color:#000;
display: flex;
flex-direction: column;
text-align: justify;
}
a{
color:#0066cc;
transition: all .2s;
text-decoration:none;
display: block;
}
a:active,
a:focus,
input:active,
input:focus {
outline:0;
}
img { width:100%; }
section {
width: 100%;
max-width: 1280px;
padding-top: 4em;
margin: 0 auto;
display: flex;
flex-direction: column;
}
h2 {
margin:0 0 1.5em;
text-align:center;
font-size:36px;
font-weight:bold;
}
h2 span {
background:#fff;
padding:0 80px;
}
h3{
margin: 0 auto;
font-size:28px;
font-weight:bold;
text-align: left;
}
h3 span{
padding:0;
}

.contents_box {
   padding-top: 4vh;
}

.inline{
   display: inline;
}

.strong_red{
   color:crimson;
   font-weight: 500;
}

/* PCのみで表示 */
.pc { display:inline!important; }
.sp { display:none!important; }

#InfoWrap,
#footerWrap,
.contents_box {
position:relative;
margin: 0 auto;
width: 100%;
max-width: 1280px;
display: block;
}
.box_colorwrap {
background-color: #F0EFE8;
}


/* --------- header --------- */
#header {
width:100%;
background-color: #fff;
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 9999;
}
#headerWrap {
position:relative;
margin: 0 auto;
width: 100%;
}
#headerWrap h1 {
font-size: 40px;
display: flex;
align-items: center;
justify-content: center;
height: 2.25em;
font-family: 'Shippori Mincho', serif;
}
#headerWrap a {
color:#325E35;
}
#headerWrap a:hover{
opacity: 0.8;
}

/* --------- header navi --------- */
.naviwrap {
background-color: #F0EFE8;
position: absolute;
width: 100%;
box-shadow: inset 0px 25px 20px -20px #D8D8D1;
}
.panel_pc {
width: 100%;
max-width: 1280px;
margin: 0 auto;
padding: 1em 0;
height: 60px;
}
#mainnav {
width: 100%;
}
#mainnav ul li {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
#mainnav ul li.btn {
width: calc(100% / 6);
float: left;
border-right:2px solid #325E35;
line-height: 1.7;
padding: 0 1.56%;
font-size: 0.9em;
}
#mainnav ul li.btn:hover {
opacity: 0.8;
}
#mainnav ul li.first,
#mainnav ul li.second,
#mainnav ul li.third,
#mainnav ul li.fifth {
padding: 0;
}
#mainnav ul li.fourth {
padding: 0 1.4%;
}
#mainnav ul li.noline {
border-right:none;
}
#mainnav a {
font-weight:bold;
}
#mainnav ul span:after {
content:'';
background-image: url('../img/arrow_anc.png');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
width: 20px;
height: 20px;
margin: 0 auto;
}
#mainnav ul li.btn_contact {
width: 10%;
float: left;
border: 2px solid #325E35;
background-color: #325E35;
border-radius: 16px;
padding: 0.5%;
font-size: 0.85em;
color: #fff;
}
#mainnav ul li.btn_contact:hover,
.btn_dl button:hover,.btn_common button:hover {
background:#fff;
border: 2px solid #325E35;
transform:translate(0,0);
transition: .2s;
color:#325E35;
}


/* --------- footer --------- */
#footer {
position: relative;
width: 100%;
}
.ground_image_footer {
background-image: url('../img/bg_bottom.png');
background-size: cover;
background-position: top center;
background-blend-mode:color-burn;
width: 100%;
height: 650px;
background-color: #F0EFE8;
}
.footer_sub_nav {
margin: 2em 0;
}

#footer_bnrWrap {
width: 100%;
background-color:#D5D4CD;
}
#footer_bnrWrap .bnr__area {
display: flex;
flex-wrap: wrap;
width: 100%;
max-width: 1280px;
margin: 0 auto;
padding: 2em 0;
justify-content: center;
}
li.bnr__list {
width: calc(70% / 2);
margin: 0;
padding: 0.5em;
vertical-align: top;
}
li.bnr__list:nth-child(2n+1) { clear:none; }
li.bnr__list:nth-child(3n+1) { clear:both; }
li.bnr__list:first-child {
margin-left: 0;
}
li.bnr__list:last-child {
margin-right: 0;
}
li.bnr__list a:hover {
opacity: 0.7;
}

.footer_add {
vertical-align: middle;
font-size: smaller;
}


/* --------- MV area --------- */
#mainImg {
width: 100%;
display: block;
}
.kvwrap {
width: 100%;
position: relative;
z-index: 0;
overflow: hidden;
}
.kvwrap .img_main {
width: 100%;
}
.kvwrap span.caption {
position: absolute;
left: 6.24%;
bottom: 12%;
z-index: 0;
color: #fff;
}
.box-circle {
background-image: url('../img/bg_arc.png');
background-size: cover;
background-position: bottom center;
min-width: 100%;
min-height: 60px;
position: absolute;
left: 0;
bottom: -2px;
}


/* --------- content --------- */
#InfoWrap {
margin: -3em auto 0;
}
#InfoWrap .ground_image {
background-image: url('../img/bg_info.png');
background-size: 70%;
background-position: top right;
position: absolute;
bottom: 0;
right: 0;
z-index: -1;
width: 100%;
height: 360px;
background-repeat: no-repeat;
}
.Info__text {
margin: 0 auto;
padding-bottom: 3em;
}
.Info__sign {
margin: 0 auto;
text-align: right;
display: block;
}

.h2_border {
border-bottom:2px solid #325E35;
}
.flex_bnr-box {
margin: 0 0 3em;
position: relative;
}
.image_file {
width: 40%;
margin: 0 0 3em;
position: absolute;
top: 0;
}
.image_file span {
display: block;
font-size: small;
line-height: 1.7;
}
.table_pdflink {
width: 50%;
margin: 0 auto 1em;
background-color: #fff;
padding: 1em 0.5em;
border-radius: 10px;
height: min-content;
font-weight: 500;
float: right;
}
.table_pdflink table {
border-collapse: separate;
border-spacing: 10px 5px;
}
.table_pdflink td {
vertical-align: middle;
line-height: 1.5;
}
.btn_common {
width: 180px;
text-align: center;
}
.btn_common button {
position: relative;
cursor: pointer;
background-color: #325E35;
border: 2px solid #325E35;
border-radius: 10px;
transition: .2s;
}
.btn_common button a {
color: #fff;
font-weight: bold;
font-size: medium;
padding: 1.3em 4em;
display: inline-block;
}
.btn_common button a:hover {
color: #325E35;
}
.btn_common button a:hover:after { opacity:0; }

.btn_dl {
width: 180px;
text-align: center;
}
.btn_dl button {
position: relative;
cursor: pointer;
background-color: #325E35;
border: 2px solid #325E35;
border-radius: 10px;
transition: .2s;
}
.btn_dl button a {
color: #fff;
font-weight: bold;
font-size: medium;
padding: 1.3em 4em;
display: inline-block;
}
.btn_dl button a:after {
content: '';
background-image: url('../img/arrow_dl.png');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
width: 30px;
height: 20px;
position: absolute;
right: 10px;
}
.btn_dl button a:hover {
color: #325E35;
}
.btn_dl button span:nth-child(2){
content: '';
background-image: url('../img/arrow_dlg.png');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
width: 30px;
height: 20px;
position: absolute;
right: 10px;
opacity:0;
}
.btn_dl button a:hover:after { opacity:0; }
.btn_dl button a:hover span:nth-child(2){ opacity:1; }

#Prize {
display: table;
}

#Subsidy {
display: table;
margin-bottom: -24em;
}

/* --------- gotoTOP --------- */
#pageTop {
position: sticky;
position: -webkit-sticky;
z-index: 9999;
left: 90vw;
bottom: 8vh;
margin: -10vh;
}
#pageTop a {
border-radius:60px;
width:60px;
height:60px;
background-color:#325E35;
transition: .2s;
}
.fa-chevron-up:before {
position: absolute;
top: 28%;
left: 34%;
content: '';
display: inline-block;
width: 20px;
height: 28px;
background-image: url('../img/arrow_top.png');
background-size: contain;
}
.btntextchange {
position: relative;
padding: 20px;
border-radius:60px;
width:40px;
height:40px;
border: 2px solid #325E35;
background-color:#325E35;
color:#fff;
text-decoration:none;
transition: .2s;
}
.btntextchange:hover { /*hoverした際の変化*/
background:#fff;
border: 2px solid #325E35;
color:#325E35;
}
.btntextchange span{/*絶対配置でテキストの位置を決める*/
position: absolute;
top: 31%;
left: 38%;
transform:translate(-50%,-50%);
transition: .2s;
}
.btntextchange span:nth-child(2){/*差し替わるテキストの設定*/
opacity:0;
position: absolute;
top: 50%;
left: 50%;
content: '';
display: inline-block;
width: 20px;
height: 28px;
background-image: url('../img/arrow_topg.png');
background-size: contain;
}
/*hoverするとテキストが入れ替わる設定*/
.btntextchange:hover span:nth-child(1){ opacity:0;/*透過0に*/ }
.btntextchange:hover span:nth-child(2){ opacity:1;/*不透明に*/ }


/* --------- notice_content --------- */
.notice_content {
    margin: 0 auto 150px;
    padding: 0 1em;
    max-height: 600px; /* 最大高さを設定 */
    overflow-y: auto; /* 縦スクロールを有効にする */
    overflow-x: hidden; /* 横スクロールは無効 */
    
    /* スクロールバーのスタイリング（Webkit系ブラウザ用） */
    scrollbar-width: thin; /* Firefox用 */
    scrollbar-color: #325E35 #f0f0f0; /* Firefox用 */
}
.notice_content dl{
display: flex;
margin-top:1.56%;
border-bottom:1px solid #ccc;
}
.notice_content_news {
margin: 0 auto 150px;
padding: 0 1em;
}
.notice_content_news .title{
   font-size: 1.2rem;
   font-weight: bold;
   color: #585858;
}
.notice_content_news a {
   color: #325E35;
}
.notice_content_news a:hover {
   color: #78B97F;
}
.notice_content_news p {
   line-height:2.2rem;
}

.notice_content_news dd {
padding:0 0 1.56% 3.12%;
}

/* --------- about --------- */
.about_detail{
font-size: 0.95rem;
line-height: 1.6rem;
padding-bottom: 70px;
margin: 0 ;
}
.about_detail .whole{
border-collapse: collapse;
border: none;
}
.about_detail .whole th,td,tr{
padding: 10px 0;
}
.about_detail .whole td,tr{
border: none;
border-bottom: 1px solid #ccc;
}
.about_detail .whole td,tr:first-child th{
border-bottom:none;
}

.about_detail .label{
width: 5em;
}
.about_detail .position{
width: 5em;
}

/* ////////////// 幅 980px〜1280px ////////////// */
@media (min-width: 981px) and (max-width: 1280px) {
   #headerWrap,
   #footerWrap,
   #InfoWrap,
   .main_contents_box {
   max-width: 100%;
   }
   .panel_pc {
   width: 100%;
   max-width:1260px;
   margin: 0 auto;
   }
   #mainnav ul li.btn {
   font-size: small;
   }
   #mainnav ul li.btn span:after {
   background-size: 20px;
   }
   .footer_sub_nav {
   margin: 2em;
   }
   section {
   max-width: 90%;
   margin: 0 auto;
   }
   section #Info {
   margin-top:0;
   }
   .box-circle {
   min-height: 40px;
   bottom: -2px;
   }
   .kvwrap span.caption {
   font-size: small;
   }
   
   #Prize,
   #Subsidy {
   margin: 0 auto;
   }
   .ground_image_footer {
   height: 500px;
   margin-top: -8vh;
   }
}

/* ////////////// 幅 980px以下〜 ////////////// */
@media only screen and (max-width:980px) { 
   .pc { display:none!important; }
   .sp { display:inline!important; }
   img { max-width: 100%; }

   #header {
   width: auto;
   height: auto;
   line-height: 1.4;
   padding: 1em 0;
   box-shadow: 0px 10px 20px -10px rgba(148, 148, 148, 0.7);
   }
   #headerWrap h1 {
   font-size: x-large;
   display: block;
   height: auto;
   margin: 0 80px 0 20px;
   }
   .notice_content {
   width: 90%;
   margin: 0 auto;
   line-height: 2;
   }
   .notice_content dl{
   display: block;
   margin-top:3.12%;
   border-bottom:1px solid #ccc;
   }
   .notice_content_news dt{ width: auto;}
   .notice_content_news dd {
   padding:0 0 3.12% 0;
   }
   .notice_content_news_more {
   padding:3.12% 0;
   }
   
   .notice_content_news dt{ width: auto;}
   .notice_content_news dd {
   padding:0 0 3.12% 0;
   }
   .notice_content_news_more {
   padding:3.12% 0;
   }

   /* --------- about --------- */
   .about_detail{
   width: 90%;
   table-layout: fixed;
   margin: 0 auto;
   }

   #mainImg {
   height: auto;
   margin-top: -1em;
   }
   .kvwrap {
   padding-bottom: 0;
   }
   .kvwrap span.caption {
   font-size: small;
   }
   .box-circle {
   min-height: 25px;
   }


   .ground_image_footer {
   background-size: 160%;
   width: 100%;
   height: 180px;
   margin-top: -5vh;
   }
   .footer_add {
   margin: 0 3.12%;
   line-height: 1.7;
   }

   #InfoWrap {
   margin: -2em auto 0;
   }
   #InfoWrap .ground_image {
   background-position: bottom right;
   width: 100%;
   height: 180px;
   }
   .Info__text {
   width: 90%;
   line-height: 2;
   }

   #Subsidy {
   display: block;
   margin-bottom: 0;
   }


   #menuWrap {
   position: absolute;
   right: 0;
   top: 0;
   }
   a#menu{
   display:inline-block;
   position:relative;
   width: 40px;
   height: 40px;
   margin: -2em 1em 0 0;
   z-index: 100;
   }
   #menuBtn{
   display:block;
   position:absolute;
   top:0;
   right: 0;
   width:40px;
   height:1px;
   margin:0;
   background:#000;
   transition: .2s;
   }  
   #menuBtn::before, #menuBtn::after{
   display:block;
   content:"";
   position:absolute;
   top:50%;
   right: 0;
   width:40px;
   height:1px;
   background:#000;
   transition: .2s;
   }
   #menuBtn::before{
   margin-top: -10px;
   }
   #menuBtn::after{
   margin-top: 10px;
   }
   a#menu .close{
   background:transparent;
   }
   a#menu .close::before,
   a#menu .close::after{
   margin-top:0;
   }
   a#menu .close::before{
   transform:rotate(-45deg);
   -webkit-transform:rotate(-45deg);
   background:#000;
   }
   a#menu .close::after{
   transform:rotate(-135deg);
   -webkit-transform:rotate(-135deg);
   background:#000;
   }
   .panel{
   width:100%;
   margin: 0;
   display:none;
   overflow:hidden;
   position:relative;
   left: 0;
   top: 1em;
   z-index:0;
   transform: inherit;
   }

   #mainnav{
   position:absolute;
   top:0;
   width:100%;
   text-align:right;
   z-index:500;
   }
   #mainnav ul{
   background: rgba(242, 238, 228, 0.9);
   text-align: left;
   margin-top: 0;
   padding: 3em 0;
   height: 100vh;
   }
   #mainnav ul li {
   margin-bottom: 3.12%;
   font-size: large;
   }
   #mainnav ul li a {
   position:relative;
   display:block;
   padding:0 0 1em;
   font-weight:bold;
   margin:0 auto;
   width:85%;
   }
   #mainnav ul span:after {
   display: inline-block;
   width: 20px;
   height: 24px;
   margin: 0 0 0 10px;
   }
   #mainnav ul li.btn_contact {
   background-color: #325E35;
   width: 80%;
   border-radius: 10px;
   padding: 3%;
   text-align: center;
   margin: 0 auto;
   float: none;
   }
   #mainnav ul li.btn_contact a {
   color: #fff;
   padding: 0.3em 0;
   }
   #mainnav ul li.btn_contact a:hover {
   color: #325E35;
   }

   li.bnr__list {
   width: 80%;
   margin: 1em auto 0;
   padding: 0.5em;
   }
   li.bnr__list:first-child {
   margin-left: auto;
   margin-top: 2em;
   }
   li.bnr__list:last-child {
   margin-right: auto;
   margin-bottom: 2em;
   }
   
   h2 {
   margin:0 0 1.5em;
   font-size:x-large;
   line-height: 1.5;
   }
   .h2_border {
   width: 90%;
   margin: 2em auto;
   padding-bottom: 1em;
   }
   .flex_bnr-box {
   margin: 0 auto 3em;
   height: auto;
   }
   .image_file {
   width: 88%;
   margin: 0 auto 3em;
   position: inherit;
   }
   .table_pdflink {
   width: 85%;
   float: none;
   margin: 0 auto 1em;
   }
   .table_pdflink td {
   display: inline-table;
   margin: 0;
   width: 100%;
   }
   .btn_common {
   padding: 5% 0;
   }
   .btn_common button {
   width: 80%;
   }
   .btn_dl {
   padding: 5% 0;
   }
   .btn_dl button {
   width: 80%;
   }
      

   #pageTop {
   left: 78vw;
   bottom: 8vh;
   }
   .btntextchange {
   width:20px;
   height:20px;
   }
   .btntextchange span {
   top: 26%;
   left: 33%;
   }
   
}
