@media (max-width: 768px) {
    .talent-list {
        /* 画面が狭くなったら、折り返して縦並びにする */
        flex-wrap: wrap; 
        justify-content: center;
    }
    
    .talent-item {
        margin: 20px; 
        width: calc(50% - 40px); /* 1行に2つ並べる例 */
    }

    .talent-item img {
        width: 100%; /* 親要素の幅に合わせて画像を広げる */
    }
}

h2{
    /* 文字色を濃いグレーに変更 */
    color: var(--main-text-color); 
    font-size: 3rem; 
    text-align: center;
    margin: 50px;
    letter-spacing: 0.2em; 
    font-weight: bold;
}

.button {
    text-align: center;      /* 中央寄せ */
    margin: 40px 0 40px;        /* 上下との間隔 */
}

/* ========== 紹介セクション ========== */
.introduction {
    display: flex;
    align-items: center;      /* 画像と本文の縦位置をそろえる */
    max-width: 1000px;
    width: 100%;
    margin: 20px auto;
    padding: 20px;
    font-weight: bold;
    align-items: stretch;
}

/**/
/*立ち絵*/
.tatie {
    text-align: center;
    flex: 0 0 auto;           /* 画像側の幅を固定気味に */

}

.tatie img {
  /*  */
    width: clamp(400px, 400vw, 400px);
    height: auto;
    display: block;
    margin: auto;
}

/*名前*/
.block h3 {
    font-size: 1.8rem;
    text-decoration-line: underline;   /* 下線を引く */
    text-decoration-color: #fff;    /* 線の色 */
    text-decoration-thickness: 5px;    /* 線の太さ */
    text-underline-offset: 0px;        /* 文字からどれだけ離すか */
}

.block {
    text-align: center;
    margin: 10px 0 30px;

}

.blockb h3 {
    font-size: 1.8rem;
    text-decoration-line: underline;   /* 下線を引く */
    text-decoration-color: #333;    /* 線の色 */
    text-decoration-thickness: 5px;    /* 線の太さ */
    text-underline-offset: 0px;        /* 文字からどれだけ離すか */
}

.blockb {
    text-align: center;
    margin: 10px 0 30px;
    color: #fff;
}

/* 本文側 */
.member {
    flex: 1;
    color: #333;
    line-height: 1.9;
    margin: 0 0 40px 20px;

}

.member p {
    white-space: normal;      /* ← 折り返しOK（nowrapは外す） */

}

/* 本文側 */
.memberb {
    flex: 1;
    color: #fff;
    line-height: 1.9;
    margin: 0 0 40px 20px;

}

.memberb p {
    white-space: normal;      /* ← 折り返しOK（nowrapは外す） */

}

.prof {
    display: inline-block;
    width: 100%;
    max-width: 1000px; /* お好みで幅調整 */
    font-size: 15px;
    color: #333;
    border-collapse: collapse;
}

.profb {
    display: inline-block;
    width: 100%;
    max-width: 1000px; /* お好みで幅調整 */
    font-size: 15px;
    color: #fff;
    border-collapse: collapse;
}

.row {
    display: flex;
    justify-content: flex-start;  /* 左右の項目を均等配置 */
    align-items: center;
    border-bottom: 1px solid rgba(0,0,0,0.1); /* 線をやわらかく */
    padding: 8px 0;

    gap: 20px;                    /* 項目と値の間の隙間 */
}

.rowb {
    display: flex;
    justify-content: flex-start;  /* 左右の項目を均等配置 */
    align-items: center;
    border-bottom: 1px solid rgb(0,0,0,0.1); /* 線をやわらかく */
    padding: 8px 0;

    gap: 20px;                    /* 項目と値の間の隙間 */
}

.label {
    margin-left: 20px;
    min-width: 110px;
}


.haisin {
    text-align: center;
    margin-top: 40px;
}

.haisin img {
    width: 250px;
}

.coharu-right {
    /*紹介欄のメンバーカラー*/
    width: 100%;
    background-color: #ffc2e8;
}

.moca-right {
    /*紹介欄のメンバーカラー*/
    width: 100%;
    background-color: #ffe7c2;
}

.picopi-right {
    /*紹介欄のメンバーカラー*/
    width: 100%;
    background-color: #ffeb99;
}

.luca-right {
    /*紹介欄のメンバーカラー*/
    width: 100%;
    background-color: #4910bc;
}

.haisin p {
    margin-bottom: 10px;
}


/* SNS */
.sns-area {
    width: 100%;
    max-width: 200px;
    margin: 20px auto;
}

.sns-link-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    font-size: 1.1em;
}

.sns-icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%; /* 丸くする */
    color: #ffffff;
    font-weight: bold;
    margin-right: 15px;
    margin-top: 0;
    margin-bottom: 0;
}

.x-icon {
    background-color: #000;
}
.youtube-icon {
    background-color: #ff0000;
    font-size: 0.7em;
}

.sns-link-item a {
    text-decoration: none;
    color: #333;
    transition: color 0.2s;
}

.sns-link-item a:hover {
    color: #6495ed;
}