﻿#Topping, #Topping.topping {background:url(/s/r/i/Menu_bg.png) repeat-x bottom center;}
#Logo1 a{position:relative;display:block;height:100%;}
#Logo1:before{content:'';width:210px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1;margin:0 auto;height:0;border-width:0 37px 100px 37px;border-style:none solid solid;border-color:transparent transparent #801212;transition:all 0.4s ease;}
#Topping.topping #Logo1:before{transform:translate(-50%,-50%) scale(0.558);}
#Menu9L .L1, #Menu9R .L1{border-color:#d38700;}

#Footer{color:#ebddd4;background-color:#561313;}
#Footer a{color:#ebddd4;}
#WebDesign a,
#SiteCount{color:#9c4949;}
#Body .Kind{display:flex;gap:3px;justify-content:center;align-items:center;margin-bottom:10px;}
#Body .Kind:before{content:'';width:30px;height:36px;background:url(/s/r/i/Kind.png) no-repeat left center / 100%;}
.B1z .PostTime{padding:0 8px;border-radius:30px;}
#MHead{border-color:#116936;background-color:#e3a400;background-image:url(/s/r/i/MHead-bg.png);box-shadow:0 0 3px #ccc;}
#MMenu span{top:40%;}
#MMenu span,#MMenu span:before,#MMenu span:after{background-color:#000;}
#MMenu{position:relative;}
#MMenu:after{content:'欄目';position:absolute;bottom:3px;left:0;right:0;margin:0 auto;color:#000;text-align:center;font-size:1.4rem;}
#CellMenu .L1s > .L1 .Imgs{display:none;}
#MaskBox {background-color:rgba(0,0,0,0.7);}
#ShowBox{background:#5a0707;}
#CellMenu .L1s .L1{padding:0 20px;}
#CellMenu .L1s .L1,
#CellMenu .L1s .L1 .Title{color:#ffaa15;}
#CellMenu .L1s > .L1 .Title{display:block;padding:10px 0;height:auto;}

#PhotoList .L1s{display:grid;grid-template-columns:repeat(5, 1fr);gap:3rem;}
#PhotoList .L1{padding:0;}
#PhotoList .L1:hover .Img1{cursor:zoom-in;}
#PhotoList .FadeIn{display:none;padding:0 10px;font-size:1.3rem;box-sizing:border-box;}
#PhotoList.B1z.S1 .Imgs img{display:block;width:100%;height:auto;aspect-ratio:2 / 1.5;object-fit:cover;}
#PhotoLightboxOverlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;}
#PhotoLightboxOverlay .LightboxMask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.85);cursor:pointer;}
#PhotoLightboxOverlay .LightboxContent{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:1000px;height:80vh;pointer-events:none;}
#PhotoLightboxOverlay .photo-swiper{padding-top:40px;padding-bottom:40px;width:100%;height:calc(100% - 80px);position:relative;pointer-events:auto;}
#PhotoLightboxOverlay .photo-swiper .swiper-slide{display:flex;align-items:center;justify-content:center;}
#PhotoLightboxOverlay .photo-swiper .swiper-slide img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
#PhotoLightboxOverlay .photo-swiper .CloseBtn{position:absolute;top:0;right:1px;z-index:10000;color:#ffffff;cursor:pointer;font-size:4rem;line-height:1;transition:color 0.3s;}
#PhotoLightboxOverlay .photo-swiper .CloseBtn:hover{color:#ff0000;}
#PhotoLightboxOverlay .photo-swiper .swiper-pagination-fraction{position:absolute;bottom:-30px;top:auto;color:#ffffff;font-size:1.5rem;width:auto;left:50%;transform:translateX(-50%);background:transparent;z-index:10000;}
#PhotoLightboxOverlay .photo-swiper .swiper-button-next,#PhotoLightboxOverlay .photo-swiper .swiper-button-prev{color:#ffffff;--swiper-navigation-size:40px;}
#PhotoLightboxOverlay .photo-swiper .PhotoTitle{position:absolute;bottom:0;z-index:9999;width:100%;color:#fff;line-height:1.5;font-size:1.6rem;text-align:center;}
@media screen and (max-width:959px){
	#MLogo img{margin:0;height:0;}
	#MLogo a{display:block;width:100%;height:100%;background:url(/s/img/Sites/MLogo.png) no-repeat center / auto 100%;}
	#PhotoLightboxOverlay .photo-swiper{padding-top:30px;padding-bottom:80px;height:calc(100% - 110px);}
	#PhotoLightboxOverlay .photo-swiper .swiper-button-next,#PhotoLightboxOverlay .photo-swiper .swiper-button-prev{position:absolute;top:auto;bottom:0;color:#ffffff;--swiper-navigation-size:28px;}
	#PhotoLightboxOverlay .photo-swiper .swiper-pagination-fraction{bottom:0;}
	#PhotoLightboxOverlay .photo-swiper .PhotoTitle{bottom:35px;font-size:1.4rem;text-align:justify;}
}
@media screen and (max-width:639px){
	.B1z.E101 .L1 .FadeIn{align-items:flex-start;}
	#PhotoList .L1s{grid-template-columns:repeat(3, 1fr);gap:0.5rem;}
}