body {
	margin-left:8em;
	margin-right:8em;
}
@media only screen and (max-width: 640px) {
body {
	margin-left:0em;
	margin-right:0em
}
}

.accordion {
	max-width: 300px;
	font-family: sans-serif;
}
@media only screen and (max-width: 640px) {
.accordion {
	max-width: 99%;
	font-family: sans-serif;
}
}
.accordion-item {
	border: 1px solid #ccc;
	border-radius: 5px;
	margin-bottom: 0.5em;
	overflow: hidden;
}

.accordion-toggle {
	display: none;
}

.accordion-title {
	display: block;
	padding: 0.5em;
	font-weight: bold;
	background-color: #000000;
	color: #ffffff;
	cursor: pointer;
	position: relative;
}

.accordion-title::after {
	content: "＋";
	position: absolute;
	right: 1em;
	font-size: 1.2em;
	transition: transform 0.3s;
}

.accordion-toggle:checked + .accordion-title::after {
	content: "－";
	transform: rotate(180deg);
}

.accordion-content {
	max-height: 0;
	overflow: hidden;
	padding: 0 1em;
	background-color: #f2f2f2;
	transition: max-height 0.4s ease, padding 0.4s ease;
}

.accordion-toggle:checked + .accordion-title + .accordion-content {
	max-height: 500px;
	padding: 1em;
}
.content::-webkit-scrollbar{
	display:none;
}
.logo_a{
	background-image: url(../image/logo_nps.png);
	width:640px;
	height:55px;
	position:absolute;
	top:1em;
	left:18%;
}
.logo_c{
	position:absolute;
	top:4%;
	left:69%;
}
@media only screen and (max-width: 640px) {
.logo_a{
	background-image: url(../image/nps-sword.png);/*logo_nps2.png);*/
	width:145px;
	height:76px;
	position:absolute;
	top:0;
	bottom:1em;
	left:3%;
	background-repeat:no-repeat;
}
.logo_c{
	position:absolute;
	top:4%;
	left:58%;
}
}
.table1 {
	width: 100%;
	height: 70px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.float_left{
	width:40%;
	float:left;
	padding-left:5em;
}
.float_right{
	width:40%;
	float:right;
	padding-left:1em;
	padding-right: 5em
}
@media only screen and (max-width: 640px) {
.float_left{
	width:99%;
	padding-left:0;
}
.float_right{
	width:99%;
	padding-right: 0;
}
}

.slideBox {
	height: 235px;
	width:394px;
	overflow: hidden;
	position: relative;
	margin-left:3em;
	margin-right:3em;
	margin-top:2em;
}
@media only screen and (max-width: 640px) {
	.slideBox {
		height: 235px;
		width:394px;
		overflow: hidden;
		position: relative;
		margin-left:0;
		margin-right:0;
		margin-top:0;
	}
	.slidebox1 {
		height: 108px;
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 auto;
	}
}
.imgs{
	margin-left:0;
	padding-left: 0;
	filter: grayscale(99%);
}
.imgs:hover{
	filter: grayscale(10%);
}
.labell{
	padding: 7px 5px 5px 10px;
	margin: 0px 0px 10px;
	border-left: 10px solid #F4CC0B;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #800000;
}
@media only screen and (max-width: 640px) {
.labell{
	width: 98%;
	padding: 7px 5px 5px 10px;
	margin: 0px 0px 10px;
	border-left: 10px solid #F4CC0B;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #800000;
}
}
.footer {
	width: 90%;
	height: 30px;
	padding: 10px 0px;
	border-top: 5px solid #CCCCCC;
	background-image: url(../image/green-line.gif);
	color: #FFFFFF;
	opacity: 0.6;
	text-align: center;
	margin: 0px auto;
	text-align: center;
}
@media only screen and (max-width: 640px) {
.footer {
	width: auto;
	padding: 10px 0px;
	border-top: 5px solid #CCCCCC;
	color: #FFFFFF;
	text-align: center;
	background-image: url(../image/green-line.gif);
	margin: 0px auto;
	text-align: center;
}
}
a{
	color:#000000;
}
.sty9{
	font-size: large;
	font-weight: bold;
	margin-left:2em;
}
.calenders{
	margin-top: 5em;
}
@media only screen and (max-width: 640px) {
.calenders{
	margin-bottom:3em;
	margin-left:3em;
}
.back_img{
	position: relative;
	z-index: 1;
	background-image:url(../image/back_img/inuyamajo33.webp);
	background-color:rgba(255,255,255,0.6);
	background-blend-mode:lighten;
	background-size: cover;
	ackground-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
}
.back_img::after{
	content: "";
	osition: absolute;
	z-index: 9;
	background-color: white;
	opacity: 0.2;
}
}
/*-------------------------- */
.sample {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #f0f0f0;
    z-index: -1;
}
.sample li {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat:no-repeat;
    opacity: 0;
    -webkit-animation: anime 50s linear 0s infinite ;
    animation: anime 50s linear 0s infinite ;
}
.sample li:nth-child(1) { 
    background-image: url(../image/back_img/hachimanjo33.webp);
}
.sample li:nth-child(2) {
    background-image: url(../image/back_img/gifujo33.webp);
    -webkit-animation-delay: 10s;
    animation-delay: 10s;
}
.sample li:nth-child(3) {
    background-image: url(../image/back_img/ohgakijo33.webp);
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
}
.sample li:nth-child(4) {
    background-image: url(../image/back_img/sunomatajo33.webp);
    -webkit-animation-delay: 30s;
    animation-delay: 30s;
}
.sample li:nth-child(5) {
    background-image: url(../image/back_img/inuyamajo33.webp);
    -webkit-animation-delay: 40s;
    animation-delay: 40s;
}
@-webkit-keyframes anime { 
    0% {
        -webkit-animation-timing-function: ease-in;
        opacity: 0;
    }
    10% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
    20% {
        -webkit-transform: scale(1.1);
            -webkit-animation-timing-function: ease-out;
        opacity: 1;
    }
    30% {
        -webkit-transform: scale(1.2);
        opacity: 0;
    }
    100% { opacity: 0 }
}
@keyframes anime { 
    0% {
        animation-timing-function: ease-in;
        opacity: 0;
    }
    10% {
        transform: scale(1);
        opacity: 1;
    }
    20% {
        transform: scale(1.1);
            animation-timing-function: ease-out;
        opacity: 1;
    }
    30% {
        transform: scale(1.2);
        opacity: 0;
    }
    100% { opacity: 0 }
}
.item1 {
	opacity: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-animation: animes 15s 0s infinite;
	animation: animes 15s 0s infinite;
}
.item1:nth-of-type(2) {
	-webkit-animation-delay: 5s;
	animation-delay: 5s;
}

.item1:nth-of-type(3) {
	-webkit-animation-delay: 10s;
	animation-delay: 10s;
}
@keyframes animes {
	0% {
		opacity: 0; z-index: 9;
	}
	20% {
		opacity: 1;
	}
	33% {
		opacity: 1;
	}
	63% {
		opacity: 0;
	}
	100% {
		opacity: 0; z-index: 1;
	}
}

@-webkit-keyframes animes {
	0% {
		opacity: 0; z-index: 9;
	}
	20% {
		opacity: 1;
	}
	33% {
		opacity: 1;
	}
	63% {
		opacity: 0;
	}
	100% {
	opacity: 0; z-index: 1;
	}
}
/*
.back_img{
	background-image: url('../image/back_img/back_img_2.webp');
	background-color:rgba(255,255,255,0.6);
	background-blend-mode:lighten;
	background-size: cover;
	ackground-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
.back_img::after{
	content: "";
	osition: absolute;
	z-index: 9;
	background-color: white;
	opacity: 0.2;
}

.target {
  background-image: url(../image/back_img/inuyamajo.jpg), url(../image/back_img/ohgakijo2.jpg); 
	background-size: cover;
	ackground-position: top center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	position: relative;
  animation: image_anime 1s ease; 
  animation-fill-mode: forwards; 
  animation-delay: 10s; 
}

@keyframes image_anime {
  100% {
    background-image: url(../image/back_img/ohgakijo2.jpg); 
  }
}
*/