/* ==========================================================
 * AV女優図鑑 Theme Pack
 * File : assets/css/avz.css
 * Version : 1.1.0
 * ========================================================== */


/* ==========================================================
   共通カード
========================================================== */

.avz-card{

    display:block;

    background:#fff;

    border:1px solid #e5e5e5;

    border-radius:8px;

    overflow:hidden;

    color:#333;

    text-decoration:none;

    transition:all .2s ease;

}

.avz-card:hover{

    transform:translateY(-2px);

    box-shadow:0 6px 18px rgba(0,0,0,.08);

}

.avz-card-image img{

    display:block;

    width:100%;

    height:auto;

}

.avz-card-body{

    padding:10px;

}


/* ==========================================================
   タイトル
========================================================== */

.avz-card-title{

    font-size:14px;

    font-weight:700;

    line-height:1.5;

    color:#222;

}


/* ==========================================================
   メタ情報
========================================================== */

.avz-card-meta{

    margin-top:6px;

}

.avz-card-meta-item{

    font-size:13px;

    color:#666;

    line-height:1.5;

}


/* ==========================================================
   小カード
========================================================== */

.avz-card-small{

    display:flex;

    align-items:flex-start;

    gap:10px;

    margin-bottom:14px;

    text-decoration:none;

    color:#333;

}

.avz-card-small:last-child{

    margin-bottom:0;

}

.avz-card-small-image{

    width:80px;

    flex-shrink:0;

}

.avz-card-small-image img{

    display:block;

    width:100%;

    height:auto;

}

.avz-card-small-body{

    flex:1;

    min-width:0;

}

.avz-card-small-title{

    font-size:13px;

    font-weight:700;

    line-height:1.4;

    color:#222;

}

.avz-card-small-meta{

    margin-top:4px;

}

.avz-card-small-meta-item{

    font-size:12px;

    color:#666;

    line-height:1.4;

}


/* ==========================================================
   ウィジェット
========================================================== */

.avz-widget-movie{

    display:flex;

    flex-direction:column;

    gap:12px;

}

.avz-widget-actress{

    display:flex;

    flex-direction:column;

    gap:12px;

}


/* ==========================================================
   グリッド
========================================================== */

.avz-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:16px;

}

@media(min-width:768px){

    .avz-grid{

        grid-template-columns:repeat(4,1fr);

    }

}