@charset "UTF-8";
/* html/body
------------------------------------------------- */
html{width: 100%;overflow-y: scroll;font-size: 62.5%;-webkit-font-smoothing: antialiased;scroll-behavior: smooth;}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
html {overflow-x: hidden;}
}
body {
font-family: 'Noto Sans JP', sans-serif;
position: relative;width: 100%;height: 100%;font-weight: 500;font-size: 16px;font-size: 1.6rem;line-height: 1.8;background: #fff; color: #333;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;overflow-x: hidden;position: relative;transition: 0.4s;overflow-x: hidden;box-sizing:border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;text-size-adjust: 100%;-webkit-text-size-adjust: 100%;/*Chrome,Safari*/-ms-text-size-adjust: 100%;/*EgdeMobile*/-moz-text-size-adjust: 100%;/*firefox*/
}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
body {font-size: 13px;font-size: 1.3rem;}
}

/*STYLE
------------------------------------------------- */
#wrapper {position: relative;}

#header{position: relative;}
#header .mainimg img{width: 100%;height: auto}
#header h1{z-index: 2; position: absolute;top: 30px;left: 30px;width: 20vw}
#header h2{position: absolute;left: 22%;top: 40%;width: 36vw}

#header .spon{position: absolute;bottom: 10px;right: 30px;width:130px}
#header .spon li{margin-bottom: 20px}
#header nav{position: absolute;right: 20px;top: 20px;}
#header nav a{color: #fff;font-size: 1.8rem;font-weight: bold;margin-left: 20px}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
#header h1{top: 14px;left:14px;}

#header h2{left: 5%;top: 50%;width: 60vw}
#header .spon{position: absolute;bottom:0px;right: 10px;width:20%}
#header .spon li{margin-bottom: 10px}
#header nav{width:80%}
#header nav a{color: #fff;font-size: 1.5rem;font-weight: bold;margin-left: 20px}
}

.pagenav li{
width: 23%;
padding-bottom: 10px;
}
.pagenav a{text-align: center; position: relative;display: block;padding: 10px 0; background: #0080C7;color: #fff;font-size: 1.7rem;font-weight: bold;border-radius: 30px}
.pagenav a::before { /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10%;
  width: 8px;    /* くの字を山なりに見た時、左側の長さ */
  height: 8px;   /* くの字を山なりに見た時、右側の長さ */
  border-top: 1px solid #fff;     /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 1px solid #fff;   /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);    /* くの字の向き */
}
.pagenav a:hover{opacity: 0.7}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.pagenav .inner--short{width: 90%;}
.pagenav li{width:48%;margin-bottom: 16px}
}

.news{margin: 70px 0}
.news .col3{width: 34%}
.news .col4{width: 28%}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.news{margin:40px 0}
.news .col3{width: 100%;}
.news .col3:nth-child(1){display: none}
.news .col4{width: 80%;margin: 0 auto 20px}
.news img{width: 100%;height: auto}
}
.news p{font-size: 30px;
margin-bottom: 15px;
color: #d32f2f}

.message{position: relative;background: url("../images/fukushima_p1.jpg") no-repeat left top;background-size: 60%;padding-top: 150px}
.message .box{margin-left: 40%;width: 44%;background: #1b80c3;padding: 20px 0px 120px;box-sizing:border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;color: #fff;text-align: center;position: relative}
.message .box h2{position: relative; font-size: 2.6rem;font-weight: bold;padding: 30px 0;margin-bottom: 40px}
.message .box h2:before {width: 230px;height: 100px;content: "";background: url("../images/txt_messsge.svg") no-repeat center center;background-size: 100%;    position: absolute;
top: 0px;left: 0;right: 0;margin: auto}
.message .box p.txt{line-height: 2.4}
.message .box p.p2{position: absolute;right: 10%;bottom: -50px;width: 50%}

.message .bt{width: 500px;margin: 80px auto 0}
.message .bt a{text-align: center; display: block;background: #fc3ea1;color: #fff;font-size: 2rem;border-radius: 10px;font-weight: bold; padding: 20px 0;position: relative}
.message .bt a:before {width: 20px;height: 20px;content: "";background: url("../images/icon_arow.svg") no-repeat center center;background-size:auto 20px;    position: absolute;
top: 50%;right: 3%;margin: auto;transform: translate(0%, -50%);}
.message .bt a:hover{opacity: 0.7}
@media screen and (max-width: 1000px) {/*スマホのスタイル*/
.message .box{margin-left: 30%;width: 64%;}
}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.message{background-size: 100%;padding-top: 230px}
.message .box{margin-left: auto;margin: auto; width: 90%;padding: 20px 0px 120px;}
.message .box h2{font-size: 2rem}
.message .box p.p2{position: absolute;right: 10%;bottom: -20px;width: 70%}
.message .bt{width: 80%;}
}

.leaflet{background: #ddeaf7;padding: 40px 0;margin: 80px 0;text-align: center}
.leaflet h2{position: relative; font-size: 2.6rem;font-weight: bold;padding: 30px 0;margin-bottom: 40px}
.leaflet h2:before {width: 230px;height: 140px;content: "";background: url("../images/txt_leaflet.svg") no-repeat center center;background-size: 100%;    position: absolute;
top: 0px;left: 0;right: 0;margin: auto}
.leaflet a{display: block;color: #000}
.leaflet a p{position: relative; display: block;border: 1px solid #000;padding: 20px 0;color: #000;background: #fff}
.leaflet a p:before {width: 20px;height: 20px;content: "";background: url("../images/icon_pdf.png") no-repeat center center;background-size:auto 20px;    position: absolute;
top: 50%;right: 3%;margin: auto;transform: translate(0%, -50%);}
.leaflet a:hover{opacity: 0.7}
@media screen and (max-width: 768px) {/*スマホのスタイル*/

.leaflet h2{font-size: 2rem}
.leaflet a p{padding: 12px 0}
.leaflet .col3{width: 80%}
}


.WPnews{padding: 40px 0;margin: 80px 0;text-align: center}
.WPnews h2{position: relative; font-size: 2.6rem;font-weight: bold;padding: 30px 0;margin-bottom: 20px}
.WPnews h2:before {width: 200px;height: 120px;content: "";background: url("../images/txt_news.svg") no-repeat center center;background-size: 100%;    position: absolute;
top: 0px;left: 0;right: 0;margin: auto}

.WPnews li{width: 30%; border: 1px solid #ccc;border-radius: 10px;margin-bottom: 40px;}
.WPnews li .photo{   position: relative;   overflow: hidden;   padding-top: 60%;}
.WPnews li .photo img{border-radius: 10px 10px 0 0;   position: absolute;   top: 50%;   left: 50%;   transform: translate(-50%,-50%);   width: 100%;   height: 100%;   object-fit: cover;}

.WPnews li a{display: block;position: relative;color: #000;}
.WPnews li .box{padding: 16px;text-align: left}
.WPnews li .box .date{margin-bottom: 8px}
.WPnews li .box h3{font-size: 1.6rem;line-height: 1.7}
.WPnews ul::after {display: block;content:"";width: 30%;}
.WPnews .bt{width: 30%;margin: auto}
.WPnews .bt a{margin: 20px auto 0; display: block;color: #000}
.WPnews .bt a{position: relative; display: block;border: 1px solid #000;padding: 20px 0;color: #000;background: #fff}
.WPnews .bt a:hover{opacity: 0.7}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.WPnews ul{width: 90%;margin: auto}
.WPnews li{width: 48%; }
.WPnews li .box h3{font-size: 1.4rem;line-height: 1.7}

.WPnews{padding: 0px 0 30px;margin: 20px 0;text-align: center}
.WPnews h2:before {width: 160px;height: 80px;}
.WPnews h2{font-size: 2rem;margin-bottom: 20px}
.WPnews .bt{width: 80%}
}

.about{background: #ddeaf7;padding: 60px 0;margin: 80px 0;text-align: center}
.about h2{position: relative; font-size: 2.6rem;font-weight: bold;padding: 30px 0;margin-bottom: 40px}
.about h2:before {width: 230px;height: 140px;content: "";background: url("../images/txt_about.svg") no-repeat center center;background-size: 100%;    position: absolute;
top: 0px;left: 0;right: 0;margin: auto}
.about .txt{line-height: 2.5;text-align: left}

.about a:hover{opacity: 0.7}
.about .bt{width: 500px;margin: 30px auto 0}
.about .bt a{display: block;background: #fc3ea1;color: #fff;font-size: 2rem;border-radius: 10px;font-weight: bold; padding: 20px 0;position: relative}
.about .bt a span{font-size: 1.5rem}
.about .bt a:before {width: 20px;height: 20px;content: "";background: url("../images/icon_arow.svg") no-repeat center center;background-size:auto 20px;    position: absolute;
top: 50%;right: 3%;margin: auto;transform: translate(0%, -50%);}


@media screen and (max-width: 768px) {/*スマホのスタイル*/
.about{padding: 60px 30px;}
.about h2{font-size: 2rem}
.about .bt{width: 90%}
.about .bt a{font-size: 1.7rem;}
.about .bt a span{font-size: 1.3rem}
.about .col3_2{width: 100%;margin-bottom: 20px}
.about .col3{width: 100%;}
}


.sponsor{/*background: #ddeaf7;*/padding: 60px 0;text-align: center}
.sponsor .bg{background: #ddeaf7;padding: 60px 0;margin-top: 80px}
.sponsor h2{position: relative; font-size: 2.6rem;font-weight: bold;padding: 30px 0;margin-bottom: 40px}
.sponsor h2:before {width: 230px;height: 140px;content: "";background: url("../images/txt_sponsor.svg") no-repeat center center;background-size: 100%;    position: absolute;
top: 0px;left: 0;right: 0;margin: auto}
.sponsor .txt{line-height: 2.5}
.sponsor .link{width: 80%;margin: 40px auto}
.sponsor .link a{position: relative; display: block;border: 1px solid #000;padding: 20px 0;color: #000;background: #fff}
.sponsor .link a.pdf:before {width: 20px;height: 20px;content: "";background: url("../images/icon_pdf.png") no-repeat center center;background-size:auto 20px;    position: absolute;
top: 50%;right: 3%;margin: auto;transform: translate(0%, -50%);}
.sponsor a:hover{opacity: 0.7}
.sponsor .bt{width: 80%;margin: auto}
.sponsor .bt a{display: block;background: #fc3ea1;color: #fff;font-size: 2rem;border-radius: 10px;font-weight: bold; padding: 20px 0;position: relative}
.sponsor .bt a span{font-size: 1.5rem}
.sponsor .bt a:before {width: 20px;height: 20px;content: "";background: url("../images/icon_arow.svg") no-repeat center center;background-size:auto 20px;    position: absolute;
top: 50%;right: 3%;margin: auto;transform: translate(0%, -50%);}

.sponsor h3{ font-size: 2.6rem;font-weight: bold;margin: 80px 0 20px}
.sponsor h3.first{margin-top: 0}
.sponsor h4{font-size: 2rem;font-weight: bold;margin-bottom: 20px}
.sponsor .okumura{width: 80%;margin: auto; background: #fff;border-radius: 30px;padding: 30px}
.sponsor .okumura li.col3_2{text-align: left}
.sponsor .okumura li.col3 p{margin-bottom: 20px}

.sponsor .g-a,
.sponsor .g-b,
.sponsor .g-c,
.sponsor .g-d{margin-top: 60px}
.sponsor .g-b{margin:60px auto 0; border-bottom: 1px solid #999;border-top: 1px solid #999;padding: 40px 0;}
.sponsor .g-d{border-top: 1px solid #999;padding-top: 40px}

.sponsor .g-a li img,
.sponsor .g-b li img,
.sponsor .g-c li img{width: 100%;height: auto}

.sponsor .g-a li,
.sponsor .g-b li,
.sponsor .g-c li,
.sponsor .g-d li{display: flex;
    justify-content: center;
    align-items: center;border: 1px solid #999;margin-bottom: 12px;min-height: 120px}
.sponsor li.pc{border: none}
.sponsor .g-a li a,
.sponsor .g-b li a,
.sponsor .g-c li a,
.sponsor .g-d li a{display: flex;padding: 6px 0;  justify-content: center;align-items: center;color: #333;font-size: 1.3rem}

.sponsor .g-a::after {display: block;content:"";width: 30%;}
.sponsor .g-b::after {display: block;content:"";width:23%;}
.sponsor .g-b::before {  order:1;  content: "";  width: 23%;}

@media screen and (max-width: 768px) {/*スマホのスタイル*/
.sponsor h2{font-size: 2rem}
.sponsor .link .col2{width: 100%;margin-bottom: 12px}
.sponsor .bt a{font-size: 1.7rem;}
.sponsor .bt a span{font-size: 1.3rem}
.sponsor .link{width: 70%;}
.sponsor .link a{padding: 12px 0}
.sponsor .link .col4{width: 100%;margin-bottom: 20px}

.sponsor h3{ font-size: 2rem;font-weight: bold;margin: 80px 0 20px}
.sponsor h4{font-size: 2rem;font-weight: bold;margin-bottom: 20px}
.sponsor .okumura{padding: 20px}
.sponsor .okumura li.col3{width: 70%;margin: auto}
.sponsor .okumura li.col3_2{width: 100%}
.sponsor .okumura>p img{width: 70%}


.sponsor .g-a,
.sponsor .g-b,
.sponsor .g-c,
.sponsor .g-d{margin-top: 20px}
.sponsor .g-b{margin:20px auto 0; padding: 20px 0;}
.sponsor .g-d{padding-top: 20px}
.sponsor .g-a li,
.sponsor .g-b li,
.sponsor .g-c li,
.sponsor .g-d li{min-height: 70px}
.sponsor .g-a li.col3{width: 48%}
.sponsor .g-b li.col4{width: 31%}
.sponsor .g-c li.col5,
.sponsor .g-d li.col5{width: 31%;}
.sponsor .g-c li.col5 img{width: 90%}
.sponsor .g-d li a{font-size: 0.7rem}

.sponsor .g-a::after {display: block;content:"";width: 48%;}
.sponsor .g-b::after {display: block;content:"";width:31%;}
.sponsor .g-b::before {  order:1;  content: "";  width: 31%;}
}

#footer{background:#1b80c3;padding: 70px 0;color: #fff;text-align: center;margin-top: 60px }
#footer h3{margin: 12px 0;font-size: 2rem;}
#footer p{font-size: 1.4rem;margin-bottom: 8px}

#footer .icon{width:100px;margin: 30px auto 0}
#footer .icon .col2{width: 40%}


@media screen and (max-width: 768px) {/*スマホのスタイル*/
#footer{padding: 40px 0;margin-top: 30px}
#footer h2{width: 30%;margin: auto}
#footer h3{font-size: 1.6rem;}
#footer p{font-size: 1.2rem;margin-bottom: 8px}
}

@media print{
html,body{width:1020px;overflow:hidden;}
.sp{display:none!important;}
img{max-width: 100%;height: auto}
.inner--base{width:100%;}
.inner--short{width: 80%}

}
div.ec{
margin-top: 40px;
}
.inner--base{margin:auto;width: 1200px; position: relative}
.inner--short{width: 750px;margin:auto;position: relative}
@media screen and (max-width: 1200px){
.inner--base{width:  96%;min-width: 96%;}
}


@media screen and (max-width: 768px) {/*スマホのスタイル*/
.inner--base{width: 100%;min-width: 100%;}
}

.douga{text-align: center;width: 70%;margin: auto;}
.youtube-variable{
position: relative;
/* [disabled]width: 80%; */
padding-top: 56.25%;
margin-bottom: 30px;
}

.youtube-variable iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
img[usemap]{
  max-width: 100%;
  height: auto;
}
