/* ============================================================
   home.css
   TOPページ専用スタイル
   対象: index.html のみ読み込む
   ============================================================ */

/* ------------------------------------------------------------
   TOP 作品一覧リスト
   ※ .item → .sec_item / .image → .sec_image 等に変換済み
   ------------------------------------------------------------ */
.sec_top_list{padding:0 10px 10px;}
@media only screen and (max-width: 768px){.sec_top_list{padding:0 1rem 1rem}}

.sec_top_list .sec_item{margin-bottom:10px;position:relative}
@media only screen and (max-width: 768px){.sec_top_list .sec_item{margin-bottom:1rem}}

.sec_top_list .sec_item.current{z-index:200;transform:scale(2)}

.sec_top_list .sec_item {display:block;text-decoration:none;opacity:1;position:relative;height:480px;overflow:hidden}

.sec_top_list .sec_item > *{height:100%;}

.sec_top_list .sec_item:hover .sec_image img{transform:scale(1.05);opacity:.7}

.sec_top_list .sec_item .sec_image{position:relative;z-index:1;height:100%}

.sec_top_list .sec_item .sec_image::before{content:" ";display:block;width:100%;height:100%;background-color:rgba(0,0,0,.33);position:absolute;top:0;left:0;z-index:1}

.sec_top_list .sec_item .sec_image img{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;z-index:0;transition:all .3s ease-out}

.sec_top_list .sec_item .sec_textbody{width:290px;height:100%;padding:45px 25px;position:absolute;top:0;left:0;z-index:2;overflow:hidden;color:#fff}
@media only screen and (max-width: 768px){.sec_top_list .sec_item a .sec_textbody{width:100%;height:auto;padding:2rem;bottom:0;top:inherit}}

.sec_top_list .sec_item .sec_textbody::before{content:" ";display:block;width:100%;height:100%;background:rgba(0,0,0,.15);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:absolute;top:0;left:0;z-index:-1}

.sec_top_list .sec_item .sec_textbody .sec_category{margin-bottom:5px;font-family:"Lato",sans-serif;font-size:1.3rem}
@media only screen and (max-width: 768px){.sec_top_list .sec_item a .sec_textbody .sec_category{margin-bottom:.5rem;font-size:1.1rem}}

.sec_top_list .sec_item .sec_textbody .sec_heading{margin-bottom:30px;font-family:"Lato","Noto Sans JP","游ゴシック",YuGothic,"Hiragino Sans","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;font-size:2rem;font-weight:500;line-height:1.4}
@media only screen and (max-width: 768px){.sec_top_list .sec_item a .sec_textbody .sec_heading{margin-bottom:1rem;font-size:1.6rem}}

.sec_top_list .sec_item .sec_textbody .sec_jp_heading{margin-bottom:10px;font-size:1.5rem;line-height:1.5}
@media only screen and (max-width: 768px){.sec_top_list .sec_item a .sec_textbody .sec_jp_heading{margin-bottom:.5rem;font-size:1.3rem}}

.sec_top_list .sec_item a .sec_textbody .sec_tx{font-size:1.3rem}
@media only screen and (max-width: 768px){.sec_top_list .sec_item a .sec_textbody .sec_tx{font-size:1.1rem}}

.sec_top_list .sec_item:last-child{margin-bottom:0}

.not-found {padding: 5rem 0 10rem;text-align: center;}
@media only screen and (max-width: 768px){.not-found {padding: 3rem 0 5rem;text-align: center;}}

