@charset "UTF-8";

:root {
    --color-pink: #f82f7d;
    --color-black: #000;
    --color-white: #fff;
    --color-gray-light: #ccc;
    --color-gray-text: #999;
    --space-sm: 10px;
    --space-md: 20px;
    --space-lg: 30px;
    --space-xl: 40px;
}

#nylonjp_release01 {
    width: 640px;
}

/* 記事本文セクション (.div001 の代替) */
.article-body {
    letter-spacing: 0.01em;
    margin-bottom: var(--space-lg);
    line-height: 1.8em;
}

.gallery-container {
    margin-bottom: 50px;
}
.thumbnail-size {
    width: 100px;
}

/* 埋め込みコンテンツ */
.video-embed, .full-width-image {
    width: 640px;
    margin-bottom: var(--space-xl);
    display: block;
}

/* テキストコンテンツ */
.highlight-pink {
    color: var(--color-pink);
    font-weight: bold;
}
.release-text {
    margin-top: var(--space-md); 
}


/* 商品情報ボックス (.div002 の代替) */
.product-info-box {
    border: 1px solid var(--color-black); 
    padding: var(--space-md); 
    margin: var(--space-xl) 0 0;
    line-height: 1.8em;
    
    /* table から Flexbox への移行 */
    display: flex;
    gap: var(--space-md);
    align-items: flex-start;
}

/* 左カラム：表紙画像リスト */
.info-cover-list {
    flex: 0 0 250px;
    text-align: center;
}
.cover-image {
    width: 250px;
    margin: 5px 0 5px;
    border: 1px solid var(--color-gray-light);
}
.caption, .disclaimer {
    color: var(--color-gray-text);
}
.disclaimer {
    font-size: 10px;
}

/* 右カラム：詳細情報 */
.info-details {
    flex-grow: 1;
    text-align: left;
    padding-left: 20px;
    padding-top: 5px;
 letter-spacing: 0.01em;
}
.magazine-title {
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    margin-bottom: var(--space-sm); 
}

/* キャスト情報ブロック */
.cast-block {
    margin-bottom: 10px;
}
.cast-block .label {
    background: var(--color-black);
    color: var(--color-white);
    padding: 3px;
    display: inline-block;
}
.cast-block .cast-name {
    font-weight: bold;
    font-size: 16px;
    display: block;
    margin-top: 3px;
}

/* 商品概要の修正 */
.product-spec {
    margin-top: var(--space-md);
}
.product-spec h3 {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 5px;
}


/* 購入リンク */
.buy-links {
    margin-top: var(--space-md);
}
.buy-link-item {
    display: block; 
    margin-top: var(--space-sm);
}
.buy-img-size {
    width: 300px;
}
.hoverImg:hover {
    opacity: 0.8;
}

/* キャンペーンボックス */
.campaign-box {
    border: 1px var(--color-black) solid;
    padding: var(--space-md);
    margin: var(--space-xl) 0 var(--space-xl);
    line-height: 2em;
    text-align: center;
}
.campaign-image {
    width: 400px;
    display: block;
    margin: 0 auto 20px;
}
.campaign-deadline {
    font-size: 12px;
    color: var(--color-gray-text);
}