/*画像エフェクト（ホバー変色グレ－）*/
.figure1 img {-webkit-filter: grayscale(0%); filter: grayscale(0%); -webkit-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;}
.figure1:hover img {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
/*画像エフェクト（ホバー変色セピア）*/
.figure2 img {-webkit-filter: sepia(0%); filter: sepia(0%); -webkit-transition: .1s ease-in-out; transition: .1s ease-in-out;　margin-bottom: 0px;}
.figure2:hover img {-webkit-filter: sepia(100%); filter: sepia(100%);}

/*リスト表示（横ボックス）*/
nav ul {display:flex;padding-left:0px;}
nav ul li {width: 100%; background-color: #dddddd; text-align:center; padding: 1px; list-style:none; margin:0 5px;height: 15px;}
nav li:hover{background-color: #FFAF87;}

/*画像エフェクト（写真フレーム）*/
.effect1 {padding: 11px; background-color: #FFFFFF;  box-shadow: 0 3px 18px -4px rgba(0, 0, 0, 0.8);}

/*スライドショー（フェイド1）*/
.slide1 {position:relative; width:265px; height:265px; overflow:hidden; z-index:0; margin:auto;}
.slide1 div {position:absolute; top:0;}
.slide1 div:nth-of-type(1){animation:show1 32s 0s infinite both;z-index:8;}
.slide1 div:nth-of-type(2){animation:show1 32s 4s infinite both;z-index:7;}
.slide1 div:nth-of-type(3){animation:show1 32s 8s infinite both;z-index:6;}
.slide1 div:nth-of-type(4){animation:show1 32s 12s infinite both;z-index:5;}
.slide1 div:nth-of-type(5){animation:show1 32s 16s infinite both;z-index:4;}
.slide1 div:nth-of-type(6){animation:show1 32s 20s infinite both;z-index:3;}
.slide1 div:nth-of-type(7){animation:show1 32s 24s infinite both;z-index:2;}
.slide1 div:nth-of-type(8){animation:show1 32s 28s infinite both;z-index:1;}
@keyframes show1{
 0% {left 0; opacity:0; transform:scale(1.2);}5% { opacity:1;} 20%{opacity:1;} 25%{opacity:0;} 26%{opacity:0; transform:scale(1);} 100%{opacity:0;}}

/*スライドショー（フェイド2）*/
.slide2{position:relative; overflow:hidden; width:265px; height:265px; margin:auto;}
.slide2:before{content:"";	display:block; padding-top:66%;}
.slide2 img{position:absolute; width:265px; height:265px; object-fit:cover; top:0; left:0; opacity:0;
 animation:show2 9s infinite;}
.slide2 img:nth-of-type(1) {animation-delay:0s;}
.slide2 img:nth-of-type(2) {animation-delay:3s;}
.slide2 img:nth-of-type(3) {animation-delay:6s;}
/*
.slide2 img:nth-child(4){animation-delay:9s;}
.slide2 img:nth-child(5){animation-delay:12s;}
.slide2 img:nth-child(6){animation-delay:15s;}
.slide2 img:nth-child(7){animation-delay:18s;}
.slide2 img:nth-child(8){animation-delay:21s;}
*/
@keyframes show2{
 0%{opacity:0; transform:scale(1.2);} 8%{opacity:1;} 17%{opacity:1;} 25%{opacity:0; transform:scale(1);} 100%{opacity:0;}}

/*スライドショー（フェイド3）*/
.slide3 {position: relative; overflow: hidden;width: 265px;height: 265px;margin: auto;background : #fff;}
.slide3 img {display: block;position: absolute;width: inherit; height: inherit;　opacity: 0;animation: slide3 24s ease infinite;}
.slide3 img:nth-of-type(1) { animation-delay: 0s }
.slide3 img:nth-of-type(2) { animation-delay: 3s }
.slide3 img:nth-of-type(3) { animation-delay: 6s }
.slide3 img:nth-of-type(4) { animation-delay: 9s }
.slide3 img:nth-of-type(5) { animation-delay: 12s }
.slide3 img:nth-of-type(6) { animation-delay: 15s }
.slide3 img:nth-of-type(7) { animation-delay: 18s }
.slide3 img:nth-of-type(8) { animation-delay: 21s }
@keyframes slideAnime{0% {opacity: 0 } 1% { opacity: 1 } 11% { opacity: 1 } 12% { opacity: 0 } 100% { opacity: 0 }}