/* book_list */
#book_list li { position: relative; }
#book_list li .img_box {aspect-ratio: 4 / 3;}
#book_list li .atag_item { display: flex; justify-content: center; align-items: center; }
#book_list li .time{margin-top: 20px;}
#book_list li .h3  {height: auto;color: #333;-webkit-line-clamp: 2;font-weight: 500;}
#book_list li  article {height: auto;-webkit-line-clamp: 1;margin-top: 10px;font-size: 16px;font-weight: 500;letter-spacing: 0.05em;}

/* book_area */
#book_area { border-top: 1px var(--g_200) solid; }

/* content_wrap */
#content_wrap #book_list { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 1.5em; }



/* album_list */
#album_list { width: 100%; margin: 2.5em auto 0; column-count: 3; column-gap: 1em; }
#album_list >div { margin: 0 auto 1em; break-inside: avoid; box-shadow: 0 0 .5em var(--g_200); }

@media screen and (max-width: 980px){
    #content_wrap #book_list{grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width: 640px){
	#content_wrap #book_list { grid-template-columns: repeat(2, 1fr); }
	#album_list { column-count: 2; }
}
@media screen and (max-width: 550px){
	#content_wrap #book_list {grid-template-columns: 1fr;}
}


#book_list{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 26px;margin:0;padding:0;list-style:none;}
#book_list li{position:relative;overflow:hidden;background:#fff;border-top:1px solid #d8d8d8;padding: 20px 0 45px;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s ease;}
#book_list li:hover{transform:translateY(-8px);border-color:var(--primary,#C6312D);}
#book_list .img_box{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;overflow:hidden;transition:transform .8s cubic-bezier(.16,1,.3,1),filter .5s ease;}
#book_list li:hover .img_box{transform:scale(1.035);filter:brightness(.92);}
#book_list .time{display:block;margin-top:20px;font-size:15px;line-height:1.5;letter-spacing:.08em;color:var(--primary,#C6312D);}
#book_list .h3{margin-top:10px;font-size:22px;line-height:1.45;font-weight:500;letter-spacing:-.01em;color:#222;}
#book_list article{margin-top:10px;font-size:16px;line-height:1.85;color:#666;-webkit-line-clamp:2;}
#book_list .atag_item{position:absolute;z-index:3;inset:0;}
#book_list li:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--primary,#C6312D);transition:width .5s cubic-bezier(.16,1,.3,1);}
#book_list li:hover:after{width:100%;}
#book_list li:before{content:"VIEW CASE";position:absolute;z-index:2;right:16px;bottom:16px;font-size:12px;letter-spacing:.08em;color:#999;opacity:0;transform:translateX(-8px);transition:opacity .35s ease,transform .4s cubic-bezier(.16,1,.3,1);}
#book_list li:hover:before{opacity:1;transform:translateX(0);}
@media(max-width:1024px){#book_list{grid-template-columns:repeat(2,1fr);gap:30px 22px;}#book_list .h3{font-size:20px;}}
@media(max-width:768px){#book_list{grid-template-columns:1fr 1fr;gap:26px 18px;}#book_list .time{font-size:15px;}#book_list article{font-size:15px;}}
@media(max-width:560px){#book_list{grid-template-columns:1fr;gap:34px;}#book_list .h3{font-size:20px;}#book_list article{font-size:15px;}#book_list li:before{display:none;}}