.berry-image{
	position: relative;
	
	
	 display: block;
      
      height: auto;
     transition: transform 0.2s;
}


 .berry-image:hover {
	 
      animation: squish 0.4s ease;
    }


    @keyframes squish {
      0%   { transform: scaleY(1); }
      30%  { transform: scaleY(0.85); } 
      60%  { transform: scaleY(1.1); }  
      100% { transform: scaleY(1); }
    }

.berry-wrapper{
	width:70%;
	margin:0 auto;
	top:100px;
	max-width:900px;
	opacity: 0;
      animation: fadeIn 1s ease forwards;
}
@keyframes fadeIn {
      to {
        opacity: 1;
      }
    }


  .image-wrapper {
	  width:100%;
      position: relative;
      display: inline-block;
    }

   
    
    .checker-wrapper {
      position: absolute;
      width: 100%;
      height: 49px;
      left: 0;
      z-index: 0;
      overflow: hidden; 
		 border: 5px solid black;
    }

    .checker-top {
      top: 0;
      transform: translateY(-40px); 
    }

    .checker-bottom {
      bottom: 0;
      transform: translateY(40px); 
    }

    
    .checkerboard {
      width: 100%;
      height: 100%;
      background: repeating-conic-gradient(
        #fff 0% 25%,
        #ebe73e 0% 50%
      ) 0 0 / 40px 40px;
      animation: movePattern 4s linear infinite;
    }

    @keyframes movePattern {
      from {
        background-position: 0 0;
      }
      to {
        background-position: 80px 0;
      }
    }

    @keyframes movePattern {
      from {
        background-position: 0 0;
      }
      to {
        background-position: 80px 0;
      }
    }















.orenge{
	

	
	padding:100px 0;
}




.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
  margin-top: 300px;
	margin-bottom:300px;
}

.gallery-img {
  width: 100%;
  max-width: 100%;
  height: 150px;
  object-fit: cover;
  object-position: top;
  display: block;
}

.gallery-img:hover {
  transform: scale(1.05);
}




.lightbox {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.8);
  justify-content: center;
  align-items: center;
}

.lightbox-img {
  max-width: 90%;
  max-height: 90%;
;
}

.close {
  position: absolute;
  top: 30px;
  right: 40px;
  font-size: 40px;
  color: white;
  cursor: pointer;
}





.caption {
  position: absolute;
  bottom: 20px;
  right: 30px;
  color: white;
  font-size: 18px;
  background-color: rgba(0, 0, 0, 0.4); /* ちめE��と黒背景で読みめE��ぁE*/
  padding: 8px 12px;
  border-radius: 5px;
  max-width: 90%;
}






.gallery-item {
  text-align: center;
  width: 150px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	  font-weight: bold;
  color: #222;
}

.thumb-caption {
  margin-top: 8px;
  font-size: 16px;
  color: #444;
}




/*説明文*/


.textsentence{
	
	
}


.content-wrappercomic{
	
	width:80%;
	margin:0 auto ;
background:hsla(359,46%,51%,1.00);
	
}