html, body {
	scroll-padding-top: 170px;
    overflow-x: hidden;

}

/*アイコン部*/
.i_icon {
	width: 12px;
	height: 12px;
}
.w_icon {
	width: 15px;
	height: 15px;
}

a {
    text-decoration: none;
}

/* topヘッダ用 */
.top-link{
	text-align: left;
}
.top-link_iframw {
	margin: 0px;
	width: 100%;
    height: 100px;
	border: none;
	overflow: hidden;

	/*background-color: #FFFCE4;/* white fffcd8 */
	background-color: #FDF279;/* white fffcd8 */
    
	position: fixed; /* ヘッダーを固定する */
	z-index: 50;
    opacity: 0.9;
}

.top-sukima{
    height: 110px;
}


/* ギャラリー */
.out_gar{
    position: relative;
}
.in img{
    position: absolute;
	margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    opacity: 0;
    transition: .5s;
    z-index: 0;
}
@media (max-width: 1100px) {
    .gallery{
        display: block;
        height: auto;
        width: 95%;
        max-width: 900px;
	    margin: 0 auto;

	    border-radius: 5px;
	    -webkit-border-radius: 5px;
	    -moz-border-radius: 5px;
    }
}
@media (min-width: 1101px) {
    .gallery{
        display: block;
        height: auto;
        width: 70%;
        max-width: 900px;
	    margin: 0 auto;

	    border-radius: 5px;
	    -webkit-border-radius: 5px;
	    -moz-border-radius: 5px;
    }
}


input{
    display: none;
}

.in{
    display: flex;
    justify-content: center;
}

label span{
    display: block;
    width: 15px;
    height: 15px;
    padding: 7px;
    margin: -40px 0 0;
    border-radius: 100%;
    cursor: pointer;
    position: relative;
    z-index: 2;
}

label span::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    max-width:900px;
    background: #4287f5;
    opacity: 0.5;
    border-radius: 100%;
}

input:nth-of-type(1):checked ~ .in label:nth-of-type(1) span::before,
input:nth-of-type(2):checked ~ .in label:nth-of-type(2) span::before,
input:nth-of-type(3):checked ~ .in label:nth-of-type(3) span::before,
input:nth-of-type(4):checked ~ .in label:nth-of-type(4) span::before,
input:nth-of-type(5):checked ~ .in label:nth-of-type(5) span::before{
    background: #000;
    opacity: 1;
}
label span::before{
    animation: slidebutton 14s infinite;
}
@keyframes slidebutton{
    0%{opacity: 0.5;background: #4287f5;}
    3.5%{opacity: 1;background: #000;}
    25%{opacity: 1;background: #000;}
    28.5%{opacity: 0.5;background: #4287f5;}
}            
label:nth-of-type(2) span::before,label:nth-of-type(2) img{
    animation-delay: 3.5s;
}
label:nth-of-type(3) span::before,label:nth-of-type(3) img{
    animation-delay: 7s;
}
label:nth-of-type(4) span::before,label:nth-of-type(4) img{
    animation-delay: 10.5s;
}
label:nth-of-type(5) span::before,label:nth-of-type(5) img{
    animation-delay: 14s;
}   
input:nth-of-type(1):checked ~ .in label:nth-of-type(1) img,
input:nth-of-type(2):checked ~ .in label:nth-of-type(2) img,
input:nth-of-type(3):checked ~ .in label:nth-of-type(3) img,
input:nth-of-type(4):checked ~ .in label:nth-of-type(4) img,
input:nth-of-type(5):checked ~ .in label:nth-of-type(5) img{
    opacity: 1;
    z-index: 1;
}

.in img{
    animation: slide 14s infinite;
    opacity: 0;
}
@keyframes slide{
    0%{opacity: 0;}
    3.5%{opacity: 1;z-index: 1;}
    25%{opacity: 1;}
    28.5%{opacity: 0;z-index: 0;}
}
input:checked ~ .in img,input:checked ~ .in span::before{
    animation: none;
}
.in:hover img,.in:hover span::before{
    animation-play-state:paused;
}

/* 一覧 */
.all_list{
	text-align: center;
    position: relative;
}

@media (max-width: 1100px) {
    .a_list {
	    width: 22%;
	    height: 22%;
        display: inline-block;
        position: relative;
        background-color: rgba(255, 255, 255); /* 背景色を設定 */

        margin: 5px;
    }
}
@media (min-width: 1101px) {
    .a_list {
	    width: 12%;
	    height: 12%;
        display: inline-block;
        position: relative;
        background-color: rgba(255, 255, 255); /* 背景色を設定 */

        margin: 5px;
    }
}

.a_list:hover {
    background-color: rgba(255, 255, 255); /* 背景色を設定 */
}

.img_icon {
	width: 100%;
	height: 100%;

    border: 0;
    border-radius: 5px;
    transition: opacity 0.3s ease; /* スムーズなアニメーション */
}

.img_icon:hover {
    opacity: 0.7; /* ホバー時の透明度 */
}


/* お知らせ */
.news_list{
	text-align: center;
}

@media (max-width: 1100px) {
    .news_iframw {
	    margin: 0px;
	    width: 95%;
        height: 250px;
        max-width: 900px;
	    border: none;
	    overflow: hidden;
	    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
	
	    border-radius: 10px;
	    -webkit-border-radius: 10px;
	    -moz-border-radius: 10px;

        background-color: white;
    }
}
@media (min-width: 1101px) {
    .news_iframw {
	    margin: 0px;
	    width: 70%;
        height: 250px;
        max-width: 900px;
	    border: none;
	    overflow: hidden;
	    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
	
	    border-radius: 10px;
	    -webkit-border-radius: 10px;
	    -moz-border-radius: 10px;

        background-color: white;
    }
}

/* news用 */
.summary_div{
	text-align: center;
}

.ogusama {
	text-align: left;
	margin: auto;
	width: 70%;
	border: none;
	overflow: hidden;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
	
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	
    background: rgb(255, 250, 235);
	border : 15px solid rgb(255, 250, 235);
}