/*
 Theme Name:   Studio Clew Child
 Theme URI:    https://studioclew.org/
 Description:  Studio Clew Child Theme
 Author:       Takuro Inokuchi
 Template:     twentyseventeen
 Version:      1.0.0
*/

/* ==========================================================================
   トップページの不要な要素を非表示
   ========================================================================== */
/* 最初の空の「ホームページ」セクションを丸ごと消して隙間をなくす */
.twentyseventeen-front-page .site-main > article:first-of-type {
    display: none !important;
}

/* ==========================================================================
   ディスコグラフィー（作品集）のレイアウト
   ========================================================================== */
.discography-grid {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 30px;
}

.disco-item {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    padding: 20px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

@media (min-width: 768px) {
    .disco-item {
        flex-direction: row;
        gap: 30px;
        padding: 30px;
    }
}

.disco-item:hover {
    transform: translate(-2px, -2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* 左側：アプリアイコン（レコードジャケット） */
.disco-visual {
    flex: 0 0 160px;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .disco-visual {
        margin-bottom: 0;
    }
}

.disco-img {
    width: 100%;
    height: auto;
    border-radius: 18px; /* アプリアイコン風の角丸 */
    border: 1px solid #eee;
}

.disco-img-placeholder {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #f5f5f5;
    border: 2px dashed #ccc;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #999;
    font-size: 1.5rem;
    text-align: center;
    line-height: 1.2;
}

/* 右側：タイトルとクレジットと概要 */
.disco-info {
    flex: 1;
}

.disco-title {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 1.8rem;
    color: #222;
    border-bottom: 2px solid #eee;
    display: inline-block;
    padding-bottom: 5px;
}

.disco-credits {
    list-style: none;
    padding: 15px;
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    background: #f9f9f9;
    border-left: 4px solid #ddd;
}

.disco-credits li {
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.disco-credits li:last-child {
    margin-bottom: 0;
}

.disco-credits strong {
    color: #555;
    width: 110px;
    display: inline-block;
    font-weight: bold;
}

.disco-desc {
    font-size: 1rem;
    line-height: 1.7;
    color: #444;
}

.disco-desc p {
    margin-bottom: 10px;
}

/* ==========================================================================
   Twenty Seventeen の2カラムレイアウトを1カラム（全幅）に拡張
   ========================================================================== */
@media screen and (min-width: 48em) {
    /* 左側のタイトルと、右側のコンテンツの分割を解除し、100%の幅にする */
    .page-two-column .panel-content .entry-header,
    .page-two-column .panel-content .entry-content {
        float: none !important;
        width: 100% !important;
    }
    
    /* タイトルの下に余白を設け、中央揃えにする（モダンな印象） */
    .page-two-column .panel-content .entry-header {
        margin-bottom: 40px;
        text-align: center;
    }
}