@charset "utf-8";

* {
margin: 0px;
padding: 0px;
}

/*--Reset------------------------------------------------------------*/

/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}




/*--Loader------------------------------------------------------------*/

div#loader{
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #fff;
  text-align: center;
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
}


div#loader div#description{
  margin: 20px auto;
}

.sk-cube-grid {
  width: 80px;
  height: 80px;
  margin: 200px auto;
  /*
   * Spinner positions
   * 1 2 3
   * 4 5 6
   * 7 8 9
   */ }
  .sk-cube-grid .sk-cube {
    width: 33.33%;
    height: 33.33%;
    background-color: #a13853;
    float: left;
    -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
            animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; }
  .sk-cube-grid .sk-cube1 {
    -webkit-animation-delay: 0.2s;
            animation-delay: 0.2s; }
  .sk-cube-grid .sk-cube2 {
    -webkit-animation-delay: 0.3s;
            animation-delay: 0.3s; }
  .sk-cube-grid .sk-cube3 {
    -webkit-animation-delay: 0.4s;
            animation-delay: 0.4s; }
  .sk-cube-grid .sk-cube4 {
    -webkit-animation-delay: 0.1s;
            animation-delay: 0.1s; }
  .sk-cube-grid .sk-cube5 {
    -webkit-animation-delay: 0.2s;
            animation-delay: 0.2s; }
  .sk-cube-grid .sk-cube6 {
    -webkit-animation-delay: 0.3s;
            animation-delay: 0.3s; }
  .sk-cube-grid .sk-cube7 {
    -webkit-animation-delay: 0.0s;
            animation-delay: 0.0s; }
  .sk-cube-grid .sk-cube8 {
    -webkit-animation-delay: 0.1s;
            animation-delay: 0.1s; }
  .sk-cube-grid .sk-cube9 {
    -webkit-animation-delay: 0.2s;
            animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1); }
  35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1); } }

@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1); }
  35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1); } }


/*--Base------------------------------------------------------------*/
html,body {
	width: 100%;
	height: 100%;
	text-align : center;
	background: #fff;
}
html {
	height: 100%;
	overflow-y: scroll;
}

/*--HTML5-----------------------------------------------------------*/
article,aside,details,footer,header,main,menu,nav,section,summary {
	display: block;
}


body#main, body#project, body#profile, body#policy, body#support, body#economy, body#government, body#randr, body#office, body#soukatsu {
	background-image: url(header_bg.gif);
	background-repeat: repeat-x;
	background-position: 0 0;
	text-align: center;
}

body#indexmain {
	text-align: center;
}




.prbutton {
display: block;
margin-right:auto;
margin-left:auto;
width:249px;
height:60px;
text-align:center;
text-decoration: none;
font-weight: bold;
line-height: 33px;
color: #000;
text-shadow: 0px 1px 0px #d5e8aa;
background: #279F5F;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #279F5F), color-stop(0.5, #87B68F));
background: -moz-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -o-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -ms-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: linear-gradient(top, #279F5F 50%, #87B68F 50%);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%')";
border-right: solid 1px #fff;
}

.prbutton a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}
.prbutton a::after {

}
.prbutton a:hover::after {

}

.abutton {
display: block;
margin-right:auto;
margin-left:auto;
width:239px;
height:60px;
text-align:center;
text-decoration: none;
font-weight: bold;
line-height: 33px;
color: #000;
text-shadow: 0px 1px 0px #d5e8aa;
background: #279F5F;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #279F5F), color-stop(0.5, #87B68F));
background: -moz-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -o-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -ms-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: linear-gradient(top, #279F5F 50%, #87B68F 50%);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%')";
border-right: solid 1px #fff;
}

.abutton a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}
.abutton a::after {

}
.abutton a:hover::after {

}

.pobutton {
display: block;
margin-right:auto;
margin-left:auto;
width:229px;
height:60px;
text-align:center;
text-decoration: none;
font-weight: bold;
line-height: 33px;
color: #000;
text-shadow: 0px 1px 0px #d5e8aa;
background: #279F5F;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #279F5F), color-stop(0.5, #87B68F));
background: -moz-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -o-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -ms-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: linear-gradient(top, #279F5F 50%, #87B68F 50%);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%')";
border-right: solid 1px #fff;
}

.pobutton a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}
.pobutton a::after {

}
.pobutton a:hover::after {

}

.bbutton {
display: block;
margin-right:auto;
margin-left:auto;
width:230px;
height:60px;
text-align:center;
text-decoration: none;
font-weight: bold;
line-height: 33px;
color: #000;
text-shadow: 0px 1px 0px #d5e8aa;
background: #279F5F;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5, #279F5F), color-stop(0.5, #87B68F));
background: -moz-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -o-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: -ms-linear-gradient(top, #279F5F 50%,#87B68F 50%);
background: linear-gradient(top, #279F5F 50%, #87B68F 50%);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%');
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#279F5F 50%', endColorstr='#87B68F 50%')";
}

.bbutton a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}
.bbutton a::after {

}
.bbutton a:hover::after {

}





#image{
	background-image:url(top_base.png);
	position:relative;
	width:950px;
	height:600px;
	margin:0 auto;
}

#image img{
	position:absolute;
	left:0;
	top:0;
}

#imagefront{
	position:absolute;
	background-image:url(top_dummy.png);
	width:950px;
	height:600px;
	margin:0 auto;
}

table {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align : center;
background: #fff;
margin-right:auto;
margin-left:auto;
width: 100%;
}





.top a {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.top a::after {
  position: absolute;
  bottom: 2px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #333;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
.top a:hover::after {
  transform: scale(1, 1);
}




.box20{
    width: 900px;
    padding: 10px;
    margin: 10px;
    background: #f4f4f4;
    border-left: solid 6px #a13853;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
    text-align: left;
}
.box20 p {
    margin: 0;
    padding: 0;
    text-align: left;
}

.note_wrap{
  background: #fff;
  padding: 1em 2em;
  width: 80%;
  margin: 30px auto;
  /*box-shadow: 5px 5px 20px 5px rgba(0,0,0,0.7);*/
}
.note{
  background-image:
    linear-gradient(
      90deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 50%,
      #ffff 50%,
      #ffff 50%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0) 97%,
      #999 97%,
      #999 100%
    );
  background-size:
    8px 100%,
    100% 2em;
  line-height:2;
}
.note p{
  margin-bottom:2em;
}




.box22{
    width: 320px;
    padding: 10px;
    margin: 10px;
    background: #f4f4f4;
    border-left: solid 6px #a13853;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
    text-align: left;
}
.box22 p {
    margin: 0;
    padding: 0;
    text-align: left;
}




.box23{
    width: 320px;
    padding: 10px;
    margin: 10px;
    background: #f4f4f4;
    border-left: solid 6px #a13853;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
    text-align: left;
}
.box23 p {
    margin: 10;
    padding: 10;
    text-align: left;
}

.box23 a {
  text-decoration: none;
}
.box23 a::after {
}
.box23 a:hover::after {
}




.box24{
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
padding: 10px;
margin: 10px;
background: #f4f4f4;
border-left: solid 6px #a13853;
box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
margin: 0 auto;
width: 80%;

}
.flex{
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
width: 100%;

}
.flexitem{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 50%;
padding-bottom: 20px;
text-align: left;
margin-top: auto; /* 位置を下に揃える */
}
.flexitem img{
width: 100%;
}
.flexitem video{
width: 100%;
}





#rigntContents {
    width: 200px;
    padding: 5px;
    margin: 5px;
}

#rigntContents ul {
    padding: 0;
    margin: 0;
}

#rigntContents li {
	margin: 0 0 10px 0;
}


















.clover_bottom{
display: flex;
flex-direction: column;
padding: 0px;
background: #fff url(clover_bottom.png) no-repeat right bottom;
width: 100%;
height: 70px;
margin: 0;

}






.wrapper{
	min-height: 100vh;
	position: relative;/*←相対位置*/

	box-sizing: border-box;/*←全て含めてmin-height:100vhに*/
}

#footer {
	background: #B10132;
	margin: 30px 0 0 0;
	color: #FFFFFF;
	text-align: center;
	position: absolute;/*←絶対位置*/
	width: 100%;
}

#footerContents {
	width: 100%;
	margin: 0 auto;
	text-align: left;
}
#footerContentsBox {
	width: 100%;
}
#footerContentsBox .left {
padding: 15px;

	float: left;
	width: 100%;
}
#footerContentsBox .right {
	float: right;
	width: 120px;
	text-align: right;
}
.copyright {
	text-align: center;
	padding: 10px 0;
}
.footLink {
	text-align: center;

}
.footLink a {
	color: #FFFFFF;
	text-decoration: none;
}
.footLink a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}












/*サンプル3*/
.pagetop3 {
  position: fixed;
  bottom: -300px;
  right: 24px;
  margin: 0 auto;
  z-index: 200;
  visibility: hidden;
  -webkit-transition: bottom 0.4s linear;
  transition: bottom 0.4s linear;
}
 
.pagetop3.visible {
  bottom: 30px;
}
 
.pagetop3 a {
  display: table-cell;
  width: 3.5em;
  height: 3.5em;
  text-align: center;
  vertical-align: middle;
  color: #fff;
  font-size: 1.2em;
  line-height: 1;
  border-radius: 50%;
  background: #000;
  behavior: url(PIE.htc); 
}














/* otherpagebase */

.buttonarea {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
margin: 0 auto;

width:100%;
padding: 10px 0px;
background: #D4ECEA;
}

.minibutton {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
margin: 0 auto;

width:18%;

font-size: 2.5vw;

text-decoration: none;
font-weight: bold;
line-height: 90px;
text-align: center;
color: #fff;

border-radius: 20px;

}

.minibutton img{
display:inline-block;
width:100%;
}

.minibutton a {
display:block; 
position:relative;
text-decoration:none;
}

.minibutton:before{
  content:"";
display: flex;
  position:absolute;
  z-index:2;
  background:#000;/*好みの色に変えてください。*/
  opacity:0;
  transition:0.3s;
border-radius: 20px;
}
.minibutton:after{
  content:"クリックでページ移動します";/*好みの文章に変更してください。*/
  display:block;
  color:#fff;
  line-height:120%;
  width:15%;
  border:solid 1px #fff;
  border-radius:5px;
  text-align:center;
  position:absolute;
  opacity:0;
  z-index:3;
  transition:0.3s;
  font-weight:bold;
  letter-spacing:0.2em;
  background:#000;/*好みの色に変えてください。*/

font-size: 80%;

}
.minibutton:hover:before{
  opacity:0.5;
}
.minibutton:hover:after{
  opacity:1;
  margin-top:-0.5em;
}










.main950{
	position:relative;
	width:100%;
	margin:0 auto;
-webkit-text-size-adjust: 100%;
}


.main950 p.centerleft{
	display: inline-block;
	position:relative;
	text-align : left;
	margin:0 auto;
	line-height: 2em;

	font-size: 3vw;
}

.main950 a{
	line-height: 3vw;
	font-size: 3vw;
}

.main950 p.centerleft2{
	display: inline-block;
	position:relative;
	text-align : left;
	margin:0 auto;
	font-size: 24px;
	padding:8px;
	font-weight:bold;
	line-height: 1.5em
}
.main950 img{
max-width: 100%;
}







/* Profile */

.profile_area_1{
padding: 20px 0px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.profile_area_1_box{
padding: 15px;

background: #F8C6BD url(clover_white.png) no-repeat right bottom;

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.profile_area_1_box img{
max-width: 100%;
}

.profile_area_1_title{
padding: 20px 0px;
color: red;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}

.profile_area_1_contents{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
line-height: 150%;
text-align: left;
}




.profile_area_2{
padding: 20px 0px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.profile_area_2_box{
padding: 15px;

background: #BEDFC2 url(clover_white.png) no-repeat right bottom;

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.profile_area_2_box img{
max-width: 100%;
}

.profile_area_2_title{
padding: 20px 0px;
color: #000;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}

.profile_area_2_contents{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
line-height: 150%;
text-align: left;
}

.profile_area_2_contents_img{
width: 100%;
margin:0 auto;

display: flex;
justify-content: center;

align-items:  flex-start;
}
.profile_area_2_contents_img img{
max-width: 30%;

width: auto;
height: 100%;
}




.profile_area_3{
padding: 20px 0px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.profile_area_3_box{
padding: 15px;

background: #FFFBC6 url(clover_white.png) no-repeat right bottom;

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.profile_area_3_box img{
max-width: 100%;
}

.profile_area_3_title{
padding: 20px 0px;
color: #000;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}

.profile_area_3_contents{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
line-height: 150%;
text-align: left;
}

.profile_area_3_contents_img{
width: 100%;
margin:0 auto;

}
.profile_area_3_contents_img img{
max-width: 30%;
}




.profile_area_4{
padding: 20px 0px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.profile_area_4_box{
padding: 15px;

background: #B9E3F9 url(clover_white.png) no-repeat right bottom;

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.profile_area_7_box img{
max-width: 100%;
}

.profile_area_4_title{
color: #000;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: center;
justify-content: center;
width: 80vw;
}

.profile_area_4_contents{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
text-align: left;
}

.profile_area_4_contents ul {
width: 100%;
display: flex;
justify-content: start;
flex-direction:row;
line-height: 150%;

}
.profile_area_4_contents li.left {
word-break: keep-all;
width: 30%;
text-align: left;
justify-content: left;
}
.profile_area_4_contents li.right {
word-break: break-all;
width: 70%;
text-align: left;
justify-content: left;
}











/* achievements */

.achievements_selector{
display: flex;
flex-wrap: wrap;
justify-content: center;
text-align: center;
width: 80%;
height: 100%;
margin: 0 auto;

}

.achievements_section{
display: flex;
flex-direction: column;
align-items: center;
width: 50%;
height: 100%;
}

.achievements_imagelink{
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
position:relative;
}

.achievements_imagelink img {
width:100%;
position:relative;
}

.achievements_imagelink a {
text-decoration:none;
width:100%;
position:relative;

}

.achievements_imagelink a:before{
  content:"";
  display:block;
  position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
  z-index:2;
  background:#000;/*好みの色に変えてください。*/
  opacity:0;
  transition:0.3s;
border-radius: 20px;
}
.achievements_imagelink a:after{
  content:"クリックでページ移動します";/*好みの文章に変更してください。*/
  display:block;
  color:#fff;
  line-height:120%;
  border:solid 1px #fff;
  border-radius:5px;
  text-align:center;
  position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);

  opacity:0;
  z-index:3;
  transition:0.3s;
  font-weight:bold;
  letter-spacing:0.2em;
  background:#000;/*好みの色に変えてください。*/

font-size: 80%;

width:90%;

}
.achievements_imagelink a:hover:before{
  opacity:0.5;
}
.achievements_imagelink a:hover:after{
  opacity:1;
  margin-top:-0.5em;
}



.achievements_guide{
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
height: 100%;
text-align: left;
padding:15px;

}

/* tag class="achievementsd hvr-trim"  */

.achievementsd {
height: 300px;
width: 300px;
background-image: url(achievements_selector_d.png);
}
.achievementsd a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
}
.achievementsd a::after {

}
.achievementsd a:hover::after {

}



.achievementsq {
height: 300px;
width: 300px;
background-image: url(achievements_selector_q.png);
}
.achievementsq a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
}
.achievementsq a::after {

}
.achievementsq a:hover::after {

}


.achievementsl {
height: 300px;
width: 300px;
background-image: url(achievements_selector_l.png);
}
.achievementsl a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
}
.achievementsl a::after {

}
.achievementsl a:hover::after {

}


.achievementsv {
height: 300px;
width: 300px;
background-image: url(achievements_selector_v.png);
}
.achievementsv a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
}
.achievementsv a::after {

}
.achievementsv a:hover::after {

}










/*クリックして開閉するスライドパネル*/
#slidepanel dl{
	width:600px;
	text-align : left;
	margin-right:auto;
	margin-left:auto;
  z-index: 5;

}
#slidepanel dl dt{
	width:574px;

	height:auto!important;
	height:20px;
	padding:8px;
	font-weight:bold;
	background-color:#F1E6DC; /* F1E6DC */
	border-left:#201004 solid 10px; /* 201004 左部分主題色 */
	color:#fff; /* 主題文字色 */
}
#slidepanel dl dt.open{
	background:#ED515D url('slide_open.gif') no-repeat 560px 9px scroll;
 cursor:pointer;
} /* F1E6DC 閉鎖時の主題部分背景色 */
#slidepanel dl dt.close{
	background:#ED515D url('slide_close.gif') no-repeat 560px 9px scroll;
} /* F1E6DC 開放時の主題部分背景色 */
#slidepanel dl dd{
	padding:10px;
	background-color:#FAF9E5; /* FAF9E5 開放時の文章部分背景色 */
	border-top:none; /* #FFF solid 1px; */
	border-left:#ED515D solid 10px; /* F1E6DC 開放時の文章の左部分背景色 */
	position:absolute;
  z-index: 5;
}
#slidepanel dl dd.close{
	width:570px;
	display:none;
}










/*クリックして開閉するスライドパネル*/
#list12 dl{
	width:500px;
	text-align : left;
	margin-right:auto;
	margin-left:auto;
  z-index: 5;

}
#list12 dl dt{
	width:474px;

	height:auto!important;
	height:20px;
	padding:8px;
	font-weight:bold;
	background-color:#F1E6DC; /* F1E6DC */
	border-left:#201004 solid 10px; /* 201004 左部分主題色 */
	color:#fff; /* 主題文字色 */
}
#list12 dl dt.open{
	background:#ED515D url('slide_open.gif') no-repeat 460px 9px scroll;
 cursor:pointer;
} /* F1E6DC 閉鎖時の主題部分背景色 */
#list12 dl dt.close{
	background:#ED515D url('slide_close.gif') no-repeat 460px 9px scroll;
} /* F1E6DC 開放時の主題部分背景色 */
#list12 dl dd{
	padding:10px;
	background-color:#FAF9E5; /* FAF9E5 開放時の文章部分背景色 */
	border-top:none; /* #FFF solid 1px; */
	border-left:#ED515D solid 10px; /* F1E6DC 開放時の文章の左部分背景色 */

}
#list12 dl dd.close{
	display:none;
}









/* RESET */
ul, li {
  display: block;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.tab-title {
  position: relative;
  width: 100%;
}
.tab-title:before, .tab-title:after {
  display: table;
  content: '';
}
.tab-title:after {
  clear: both;
}
.tab-title li {
  position: relative;
  float: left;
  width: 8.3%;
  padding: .8em 0;
  color: #fff;
  text-align: center;
  background-color: #26C6DA;
  cursor: pointer;
  overflow: hidden;
}
.tab-title-bar {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 8.3%;
  height: 2px;
  background-color: #F06292;
  -webkit-transition: .45s ease-in-out;
  -moz-transition: .45s ease-in-out;
  -o-transition: .45s ease-in-out;
  transition: .45s ease-in-out;
}
.tab-contents li {
  display: none;
  padding: 1.4em;
  background-color: #fff;
}
.tab-contents li.active {
  display: block;
}

/* 波紋 */
.ripple {
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 100%;
  background-color: rgba(255, 255, 255, 0.4);
  opacity: 1;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
.ripple-animation {
  -webkit-animation: ripple .6s linear;
  -moz-animation: ripple .6s linear;
  animation: ripple .6s linear;
}
@-webkit-keyframes ripple {
  100% {
    opacity: 0;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    transform: scale(2);
  }
}
@keyframes ripple {
  100% {
    opacity: 0;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    transform: scale(2);
  }
}










#yeararea {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
background: #EAF6FD;
}


#yeartitle {
font-size: 32px;
text-align: left;
vertical-align: middle;
display:table-cell;
padding: 5%;
}
#yeartitle h2 {
border-left:5px solid #48832C;
padding:3px 15px;
background-color:#FFF;
font-weight: bold;
display: inline-block;
}
#yeartitle p {
margin: 10;
padding: 10;
}


#yearselect {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
font-size: 3vw;
}
#yearselect p {
line-height: 250%;
}
#yearselect a {
font-size: 3vw;
text-decoration: none;
text-align: center;
color: #000;
border: solid #000;
margin: auto;
padding: 3% 1%;
margin: 2% 1%;
background: #fff;

}
#yearselect a::after {

}
#yearselect a:hover::after {

}

#yearselect span {
color: #000;
border: solid #000;
background: #F6F1D6;
padding: 3% 1%;
margin: 2% 1%;
}









/* Diary */

.diary_contents_area{
align-items: center;
justify-content: center;
padding: 10px;
text-align: left;
font-size: 3vw;
line-height: 150%;
background: #fff;
}

.diary_contents_area div.left {
width: 100%;
}

.diary_contents_area div.left ul {
display: flex;
justify-content: start;
width: 100%;
}
.diary_contents_area div.left li.date {
word-break: keep-all;
}
.diary_contents_area div.left li.act {
word-break: break-all;
width: 80%;
}


.right {
margin:0 auto;
display: flex;
align-items: center;
justify-content: center;
}
.right img {
max-width: 80%;
}




#jquery-ui-tabs {
font-size: 16px;
}
#jquery-ui-tabs div.left {
width: 100%;
}
#jquery-ui-tabs div.left p {
text-align: left;
margin:0 auto;
display: flex;
align-items: center;
justify-content: center;
font-size: 2vw;
}
#jquery-ui-tabs .ui-tabs-panel {
overflow: auto;
height: 100%;
}
#jquery-ui-tabs div.right {

}




#jquery-ui-tabs-new {
    font-size: 16px;
}
#jquery-ui-tabs-new div.left {
    width: 100%;
}
#jquery-ui-tabs-new div.left p {
    text-align: left;
    margin:0 auto;
display: flex;
align-items: center;
justify-content: center;
font-size: 2vw;
}
#jquery-ui-tabs-new .ui-tabs-panel {
    overflow: auto;
    height: 100%;
}
#jquery-ui-tabs-new div.right {

}




















.list12 {
display: block;
  text-align: center;
  background: #f4f4f4;
  box-shadow: 0 2px 3px rgba(0,0,0,.22);
	text-align: left;


}
.list12-title {
  font-size: 200%;
  padding: 4px 0 4px 16px;
  background: #ee8992;
  color: #fff6e6;
  font-weight:bold;
}
#list12 ul,.list12 ol {
  position: relative;
  margin: 0;
  padding: 0 0.5em 0 0.5em;
  color: #000;
  border: none;
  list-style-type: none;
}
#list12 ol {
  counter-reset: number;
}
#list12 ul li,.list12 ol li {
  line-height: 1;
  padding: 0.2em 0 0.2em 1.6em;
  border-bottom: dashed 1px #ee8992;
}
#list12 ul li:before {

}
#list12 ol li:before {
  display: inline-block;
  content: counter(number);
  counter-increment: number;
  left: 0.5em;
  width: 22px;
  height: 22px;
  border-radius: 20%;
  background: #ee8992;
  color: white;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  line-height: 22px;
}
#list12 ul li:last-of-type,.list12 ol li:last-of-type{
  border-bottom: none;
}

















/* quesution */

.area {
  width: 100%;
  margin: auto;
  flex-wrap: wrap;
  display: flex;
align-items: center;
justify-content: center;
text-align: center;
background: #FDEEED;
}
 
.tab_class {
  font-size: 3vw;
  text-align: center;
  display: block;
  float: left;
  order: -1;
border: solid #000;
margin: 2%;
padding: 3%;
background: #fff;
}
 
input[name="tab_name"] {
  display: none;
}
 
input:checked + .tab_class {
color: #000;
border: solid #000;
background: #F6F1D6;
}
 
.content_class {
  display: none;
  width: 100%;
}
 
input:checked + .tab_class + .content_class {
  display: block;
}


.contents_area{
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;
line-height: 150%;
background: #fff;
}








/* policy */

.title_word{
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-size: 5vw;
font-weight: bold;
font-family: "Meiryo UI, Yu Gothic" ;
width: 100%;
height: 100%;
line-height: 150%;
margin: 0 auto;
background: #F6F1D6;
}

.subtitle_word{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: center;
font-size: 3vw;
font-family: "Meiryo UI, Yu Gothic" ;
}

.contents_word{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;
line-height: 150%;
}

.subtitle_word_pickup{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: center;
font-size: 4vw;
font-family: "Meiryo UI, Yu Gothic" ;

color: #fff;
font-weight: bold;
background: #F3994F;
width: 80%;
margin: 0 auto;
border-radius: 20px 20px 0px 0px; /* 左上・右上・右下・左下 */
}

.contents_word_pickup{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;

color: #fff;
background: #F3994F;
width: 80%;
margin: 0 auto;
border-radius: 0px 0px 20px 20px; /* 左上・右上・右下・左下 */
line-height:150%
}





.contents_number{
display: flex;
align-items: center;
justify-content: center;

padding: 20px;
font-size: 3vw;

background: #F7AB00;
}

.contents_number_item{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;
}

.contents_proposal{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;

background: #FFF212;
}

.contents_proposal_item{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;
}

.contents_answer{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;

background: #61C1BE;
}

.contents_answer_item{
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
text-align: left;
font-size: 3vw;
}











/* newslog 	margin:0 auto; #tabs */


.main750{
	width:100%;
-webkit-text-size-adjust: 100%;
}
.ui-ntabs-vertical {
 width: 750px; 
margin:0 auto;
}
.ui-ntabs-vertical .ui-tabs-nav {
padding: .2em .1em .2em .2em; float: left; width: 110px;
}
.ui-ntabs-vertical .ui-tabs-nav li {
 clear: left; width: 100%; border-bottom-width: 1px !important;
 border-right-width: 0 !important; margin: 0 -1px .2em 0; 
}
.ui-ntabs-vertical .ui-tabs-nav li a {
 display:block; 
}
.ui-ntabs-vertical .ui-tabs-nav li.ui-tabs-active {
 padding-bottom: 0; padding-right: .1em; border-right-width: 1px; 
}
.ui-ntabs-vertical .ui-tabs-panel {
padding: 70px; float: right; 
width: 550px;
text-align: left;

}













/* corona */


.corona {
width:90%;
text-align:center;
margin-right:auto;
margin-left:auto;

font-size: 10vw;
}

.corona_left {
width:90%;
text-align:left;
margin-right:auto;
margin-left:auto;

font-size: 3vw;
}

/* Outline Out */
.highlight_hvr-outline-out {
padding: 20px;
text-decoration: none;
  font-size: 35px;
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  background: #853b36;
  color: white;

}
.highlight_hvr-outline-out:before {
  content: '';
  position: absolute;
  border: #e1e1e1 solid 4px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: top, right, bottom, left;
  transition-property: top, right, bottom, left;
}
.highlight_hvr-outline-out:hover:before, .highlight_hvr-outline-out:focus:before, .highlight_hvr-outline-out:active:before {
  top: -8px;
  right: -8px;
  bottom: -8px;
  left: -8px;
}

/* Sweep To Right */
.highlight_hvr-sweep-to-right {
font-size: 6vw;
font-weight: 900;
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.highlight_hvr-sweep-to-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2098D1;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.highlight_hvr-sweep-to-right:hover, .highlight_hvr-sweep-to-right:focus, .highlight_hvr-sweep-to-right:active {
  color: white;
}
.highlight_hvr-sweep-to-right:hover:before, .highlight_hvr-sweep-to-right:focus:before, .highlight_hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}









/* For policy */

.top2{
font-family: "Yu Mincho", "Hiragino Mincho ProN" ;
font-size: 4vw;
font-weight: bold;
padding: 20px 0px;
background: #12B63F;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}


.outline_white {
color          : #000000; /* 文字の色 */
font-size      : 32pt;  /* 文字のサイズ */
letter-spacing : 6px; /* 文字間 */
text-shadow    : 
 3px  3px 1px #ffffff,
-3px  3px 1px #ffffff,
 3px -3px 1px #ffffff,
-3px -3px 1px #ffffff,
 3px  0px 1px #ffffff,
 0px  3px 1px #ffffff,
-3px  0px 1px #ffffff,
 0px -3px 1px #ffffff; /* 文字の影 */
word-break: break-all;
text-align: justify;
}


.outline2 {
display: inline-block;
font-size: 4vw;
font-weight: 900;
color       : #000;
text-shadow:  2px  2px 10px #ffffce ,
             -2px  2px 10px #ffffce ,
              2px -2px 10px #ffffce ,
             -2px -2px 10px #ffffce;
word-break: break-all;
text-align: justify;

opacity: 1; /* 単位が%でない！ */
animation: fadeIn 5s;
animation-iteration-count: 1;
}



@media only screen and (max-width: 750px) {
.top2{
font-family: "Yu Mincho", "Hiragino Mincho ProN" ;
font-size: 6vw;
font-weight: bold;
padding: 20px 0px;
background: #12B63F;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.outline2 {
display: inline-block;
font-size: 8vw;
font-weight: 900;
color : #000;
text-shadow:  2px  2px 10px #ffffce ,
             -2px  2px 10px #ffffce ,
              2px -2px 10px #ffffce ,
             -2px -2px 10px #ffffce;
word-break: break-all;
text-align: justify;

padding: 15px 0px;

}
}



.top3{
background: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
width: 100%;
height: 100%;
}

.top3_1{
padding: 20px 0px;
background: #fff;
display: flex;
flex-wrap:nowrap;
align-items: left;
justify-content: left;
text-align: left;
width: 100%;
height: 100%;
}

.red{
padding: 10px 50px;
color: #fff;
font-size: 2.0rem;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
margin: 0px;
background: #B10132;
display: flex;
align-items: center;
justify-content: left;
width:-moz-fit-content; /* Firefox */
width:fit-content; /* other browsers */
border-radius: 0px 20px 20px 0px; /* 左上・右上・右下・左下 */ 
}

.redside{
margin: 0px;
}
.redside img{
width: 50px;
}


.white{
font-size: 4vw;
word-break: break-all;
padding: 15px;
background: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
width: 85vw;
height: 100%;
line-height:150%
}



.top4{
padding: 20px 0px;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.blue{
padding: 15px;
background: #EAEFF9;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.blue img{
width: 50vw;
}

.blue1{
color: red;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}

.blue2{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
line-height:150%
}

.yellow{
padding: 15px;
background: #FFF899;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}
.yellow img{
width: 50vw;
}

.yellow1{
color: red;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}



.yellow2{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
line-height:150%
}

.yellow3{
color: #000;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
text-align: left;
width: 80vw;
line-height:150%
}

.yellow3 span{
color: red;
}



.wisteria{
padding: 15px;
background: #FBE6EF;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px;
}

.wisteria1{
color: red;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
}

.wisteria2{
color: #000;
font-size: 4vw;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
line-height:150%
}

.gray{
padding: 15px;
color: red;
font-size: 6vw;
font-weight: bold;
font-family: "Meiryo UI", "Yu Gothic" ;
display: flex;
align-items: left;
justify-content: center;
text-align: left;
width: 80vw;
background: #E1E1E1;
border-radius: 20px;
}
.gray a{
color: red;
text-align: center;
width: 100%;
height: 100%;
text-decoration: none;
}
.gray a:hover {
color: blue;
background: #E1E1E1;
}




.top5{
padding: 20px 0px;
background: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 100%;
height: 100%;
}

.pink{

padding: 15px;
background: #FCE4E2 url(clover_white.png) no-repeat right bottom;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: left;
width: 80vw;
border-radius: 0px 0px 20px 20px;

font-size: 3vw;
word-break: break-all;
line-height:150%

}

.ph{
padding: 15px;
background: #FDE8D0 url(clover_white_name.png) no-repeat left bottom;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
width: 80vw;
border-radius: 20px 20px 0px 0px;

font-size: 3vw;

}
.ph img{
width: 20vw;
}





















/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:block;
    overflow:hidden;
}
 
.cf:after {
    clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}

















****************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
img {
	border:0;
	vertical-align: top;
}
.flash-replaced .alt {
	position:absolute;
	overflow:hidden;
	display:block;
	height:0;
	width:0;
}


/****************************************************************************
	margin
*/
.mgn-0 {
	margin-bottom:0;
}
.mgn-3 {
	margin-bottom:3px;
}
.mgn-5 {
	margin-bottom:5px;
}
.mgn-7 {
	margin-bottom:7px;
}
.mgn-10 {
	margin-bottom:10px;
}
.mgn-15 {
	margin-bottom:15px;
}
.mgn-20 {
	margin-bottom:20px;
}
.mgn-25 {
	margin-bottom:25px;
}
.mgn-30 {
	margin-bottom:30px;
}
.mgn-40 {
	margin-bottom:40px;
}
.mgn-55 {
	margin-bottom:55px;
}
.mgn-65 {
	margin-bottom:65px;
}
.mr-5 {
	margin-right: 5px;
}
.mr-10 {
	margin-right: 10px;
}
.mr-15 {
	margin-right: 15px;
}
.mt-0 {
	margin-top: 0 !important;
}
.mt-10 {
	margin-top: 10px !important;
}
.mt-20 {
	margin-top: 20px !important;
}
.mt-30 {
	margin-top: 30px !important;
}

.al-c {
	text-align: center;
}
.alr {
	text-align: right;
}

/****************************************************************************
	alignment
*/
.ac {
	margin-left:auto;
	margin-right:auto;
}
.ar {
	margin-left:auto;
	margin-right:0;
	text-align: right;
}
.ar-10 {
	margin-left:auto;
	margin-right:10px;
}
.ar-15 {
	margin-left:auto;
	margin-right:15px;
}
.al {
	margin-left:0;
	margin-right:auto;
}
.al-10 {
	margin-left:10px;
	margin-right:auto;
}
.al-15 {
	margin-left:15px;
	margin-right:auto;
}
.r_mgn10 {margin:0 10px 0 0;}

.borderL {
	border-left: 1px solid #CECECE;
}
.borderB {
	border-bottom: 1px solid #CECECE;
}
.borderT {
	border-top: 1px solid #CECECE;
}
/****************************************************************************
*/

.imgText {
	text-indent: -9999px;
	line-height: 100%;
}

/****************************************************************************
	clearFix
*/

.c-r {
	clear: right;
}
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/****************************************************************************
	scroll
*/

/****************************************************************************
