@charset "utf-8";
/* CSS Document */
body { background:url(image/background.jpg) repeat; margin:0 0; }
a { outline:none; }
/* pic */
.pic { width:212px; height:305px; background-color:#000; margin:25px auto; padding:2px 2px 0 2px; }
.pic2 { width:424px; height:305px; background-color:#000; margin:25px auto; padding:2px 2px 0 2px; }
.pic span,
.pic2 span { display:block; }
.pic .photos,
.pic2 .photos { float:left; width:120px; padding-left:30px;}
.pic a,
.pic2 a  { font: 12px Arial, Helvetica, sans-serif; color:#FFF; text-decoration: none; }
.pic .text,
.pic2 .text { float:left; width:50px; margin-top:7px; }

/* left */
.bg { background:url(image/left_bg.gif) repeat;}
.spic { width:110px; height:141px; background-color:#000; margin:25px auto 0 auto; padding:2px;}
.t1 { text-align:center; font:12px Arial; color: #FFF; width:150px; margin:0 auto; padding:5px 0;}

/* top */
#top { background:url(image/top_bg.html) repeat-x; height:92px; text-align:right;}
#top2 { background:url(image/button_bg.html) repeat-x; height:49px; }
#top .l,
#top2 .l { float:left; }
#top2 .r { float:right; }

/*  big photo  */
.big { width:740px; margin:10px auto; padding:2px; background-color:#000; }
.icon { text-align:center; }
.icon img { margin:0 15px; }





.css {  font-family: "Arial"; font-size: 12px; text-decoration: none; color: #FFFFFF}
.left {
	font-family: "Verdana";
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: bold;
}

.img { width: 212px; height: 300px; }
  .thumb-wrapper{
    display:grid;
    grid-template-columns: repeat(2, auto); 
    justify-content:center;                 
    padding:16px;
  }
  /* 手機改單欄 */
  @media (max-width: 600px){
    .thumb-wrapper{ grid-template-columns: 1fr; justify-items:center; }
  }

  /* === 內層：列表只保留結構，不再決定排版 === */
  .thumb-grid{
    list-style:none;
    margin:0;
    padding:0;
    display:contents;
  }

  /* === 卡片 === */
  .thumb{
    width:212px;                
    color:#fff;
    overflow:hidden;
    margin-bottom: 16px;
    border: 4px #333 solid;
  }


  .thumb:nth-child(odd) {
  border-right: 0;
}


.thumb:nth-child(even) {
  border-left: 0;
}
  .thumb-link{ display:block; color:inherit; text-decoration:none; }
  .thumb-figure{ margin:0; }

  .thumb-media{
    width:212px;
    height:300px;                  
    overflow:hidden;
    position:relative;
  }
  .thumb-media img{
    width:100%; height:100%;
    object-fit:cover; display:block;
    transition:transform .25s ease;
  }
  .thumb:hover img,
  .thumb:focus-within img{ transform:scale(1.05); }

  /* === 下方黑底標籤（含放大鏡） === */
  .thumb-caption{
    display:flex; align-items:center; justify-content:center;
    gap:6px;
    padding:8px 10px;
    background:#000;
    color:#fff;
  }

  .thumb-caption::before{
    content:"";
    display:inline-block;
    width:20px; height:20px;
    background:url("image/zoom-icon.gif") center/contain no-repeat;
  }