/* プロフィール */
.gp_profile_wrap {
    display: block;
    box-sizing: border-box;
    width: 100%;
}
.gp_profile_thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
    text-align: center;
}
.gp_profile_thumb img {
    max-width: 100%;
}
.gp_profile_desc {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
    font-size: 0.8em;
    color: #303030;
    line-height: 1.4;
}

/* SNS投稿 */
.gp_y_account_name {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding-left: 0.5em;
    margin-bottom: 0.5em;
    font-size: 0.8em;
    font-weight: bold;
    color: #303030;
}
.gp_y_account_name i {
    padding-right: 0.2em;
    color: #303030;
}

.gp_y_posts_wrap {
    display: block;
    box-sizing: border-box;
    width: 98%;
    padding-bottom: 0.5em;
    overflow-x: auto;
    white-space: nowrap;
}
.gp_y_post {
    display: inline-block;
    box-sizing: border-box;
    width: 45%;
    white-space: normal;
    vertical-align: top;
}
.gp_y_thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    text-align: center;
}
.gp_y_thumb img {
    max-width: 100%;
}
.gp_y_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
    color: #333333;
    font-size: 0.8em;
    font-weight: bold;
    line-height: 1.2;
}
.gp_y_icons {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
}
.gp_y_icon {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    margin-bottom: 0.2em;
    font-size: 0.6em;
    color: #303030;
}
.gp_y_icon i {
    padding-right: 0.2em;
}
.gp_y_desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    color: #303030;
    font-size: 0.8em;
    font-weight: normal;
    line-height: 1.2;
}

/* SNS投稿追加クラス */
.gy_t_desc {
    -webkit-line-clamp: 3;
}

/* SNS投稿タブ */
.gp_sns_tab_wrap {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 1em 0 0.5em;
}
.gp_sns_tab {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    padding: 0.5em 2em;
    margin-bottom: 0.5em;
    border: 1px solid #a0a0a0;
    border-radius: 3px;
    background-color: #ffffff;
    font-size: 0.8em;
    font-weight: bold;
    color: #303030;
}
.gp_sns_tab_selected {
    border: 1px solid rgb(230, 90, 90);
    background-color: rgb(230, 90, 90);
    font-size: 0.8em;
    font-weight: bold;
    color: #ffffff;
}
.gp_sns_tab_selected_t {
    border: 1px solid #1DA1F2;
    background-color: #1DA1F2;
    font-size: 0.8em;
    font-weight: bold;
    color: #ffffff;
}
.gp_sns_tab_selected_i {
    border: 1px solid #CF2E92;
    background-color: #CF2E92;
    font-size: 0.8em;
    font-weight: bold;
    color: #ffffff;
}

/* SNSランキング */
.gp_sns_rank_simple {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding-left: 0.5em;
    margin-bottom: 0.5em;
    font-size: 0.6em;
    font-weight: bold;
    color: #303030;
}

/* 黒板 */
.gp_sns_rankking_kokuban {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 2.2em 1em 1em;
    margin: 1em auto;
    background-color: #006633;
    color: #fff;
    border: 8px solid #b2771f;
    border-radius: 3px;
    box-shadow: 0 0 5px #333, 0 0 5px #555 inset;
    line-height: 2em;
}
.gp_sns_rankking_kokuban::before,
.gp_sns_rankking_kokuban::after {
    position: absolute;
    content: '';
    bottom: 0;
} 
.gp_sns_rankking_kokuban::before {
    right: 10px;
    border: solid 3px #fff;
    width: 20px; 
    border-radius: 3px 2px 0 2px;
}
.gp_sns_rankking_kokuban::after {
    right: 40px;
    border: solid 3px #ffff6b;
    width: 15px; 
    border-radius: 8px 5px 2px 5px;
}
.gp_sns_rankking_kokuban_title {
    position: absolute;
    top: .8em;
    font-weight: bold;
    font-size: 1.2em;
    color: #ffff6b;
    font-family: 'TanukiMagic';
}
.gp_sns_rankking_kokuban_title i {
    padding-right: 0.3em;
}
.gp_sns_rankking_kokuban_body_wrap {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding-top: 1em;
}
p.gp_sns_rankking_kokuban_body {
    display: block;
    box-sizing: border-box;
    width: 100%;
    font-weight: bold;
    font-size: 1em;
    margin-bottom: 0.7em;
    font-family: 'TanukiMagic';
    border-bottom: 1px solid #ffffff;
}
.gp_sns_rankking_kokuban_body_title {
    display: block;
    box-sizing: border-box;
    width: 100%;
    font-weight: bold;
    font-size: 1em;
    margin-bottom: 0.2em;
    font-family: 'TanukiMagic';
}
.gp_sns_rankking_kokuban_body_title i {
    font-size: 0.5em;
    padding-right: 0.5em;
    vertical-align: 10%;
}
.gp_sns_rankking_kokuban_body_text {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    font-weight: bold;
    font-size: 1em;
    margin-bottom: 0.2em;
    font-family: 'TanukiMagic';
}

/* SNSニュース */
.gp_sns_news_wrap {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 1em;
}
.gp_sns_news {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: start;
    align-items: start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
}
.gp_sns_news_thumb {
    display: block;
    box-sizing: border-box;
    width: 25%;
    height: 5em;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.gp_sns_news_text {
    display: block;
    box-sizing: border-box;
    width: 75%;
    padding-left: 0.5em;
}
.gp_sns_news_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    color: #303030;
    font-size: 0.7em;
    font-weight: bold;
    line-height: 1.4;
}
.gp_sns_news_desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    color: #303030;
    font-size: 0.5em;
    font-weight: normal;
    line-height: 1.4;
}

/* コメント */
.gp_comments_wrap {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 0 0.5em;
    max-height: 20em;
    padding-bottom: 0.5em;
    overflow-y: auto;
}
.gp_comment {
    display: block;
    box-sizing: border-box;
    width: 100%;
}
.gp_comment_info {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
    font-size: 0.7em;
    color: #303030;
    font-weight: 400;
}
.gp_comment_info i {
    padding-right: 0.2em;
}
.gp_comment_body {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    font-size: 0.7em;
    color: #303030;
    line-height: 1.4;
}
.gp_comment_btns {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
    text-align: right;
    font-size: 0.8em;
    color: #303030;
    font-weight: bold;
}
.gp_comment_btn {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    padding-right: 0.5em;
}
.gp_comment_btns .good i {
    padding-right: 0.2em;
    color: rgb(225, 2, 0);
    font-weight: normal;
}
.gp_comment_btns .bad i {
    padding-right: 0.2em;
    color: #1DA1F2;
    font-weight: normal;
}

/* sns詳細ページプロフィール */
.gp_sns_prof_wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.5em;
}
.gp_sns_prof_wrap_sub {
    padding-top: 1.5em;
    margin-top: 2em;
    border-top: 2px dashed rgb(230, 90, 90);
}
.gp_sns_thumb {
    display: block;
    box-sizing: border-box;
    width: 30%;
    padding: 0.5em;
    text-align: center;
}
.gp_sns_thumb img {
    max-width: 100%;
    border-radius: 50%;
}
.gp_sns_table {
    box-sizing: border-box;
    width: 70%;
    border-collapse: collapse;
    background-color: #ffffff;
}
.gp_prof_table {
    width: 85%;
    margin: 0 auto 1em;
}
.gp_sns_table tbody {
    box-sizing: border-box;
    width: 100%;
}
.gp_sns_table tr {
    box-sizing: border-box;
    width: 100%;
    font-size: 0.7em;
}
.gp_sns_table tr:last-child {
    border-bottom: 0 none;
}
.gp_sns_table th {
    box-sizing: border-box;
    width: 40%;
    padding: 0.7em 0;
    border: 1px solid #f0f0f0;
    background-color: #f8f8f8;
    text-align: center;
    color: #303030;
    font-weight: bold;
}
.gp_sns_table td {
    box-sizing: border-box;
    width: 60%;
    padding: 0.7em 0;
    border: 1px solid #f0f0f0;
    text-align: center; 
}

/* SNSアカウント description */
.gp_sns_account_desc {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 1.5em 1em;
    margin: 1em auto;
    border: 2px solid #d0d0d0;
    border-radius: 5px;
    background-color: #fafafa;
    font-size: 0.7em;
    color: #303030;
    line-height: 1.8;
    text-align: left;
}

/* 他SNSボタン */
.gp_other_sns_btns_wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    margin: 1em 0 2em;
}
.gp_other_sns_btn {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    padding: 0.5em 2em;
    margin-bottom: 0.3em;
    text-align: center;
    font-size: 0.8em;
    font-weight: bold;
    border-radius: 3px;
}
.gp_other_sns_btn i {
    padding-right: 0.3em;
}
.gp_other_sns_btn_youtube {
    border: 1px solid rgb(225, 2, 0);
    color: rgb(225, 2, 0);
}
.gp_other_sns_btn_twitter {
    border: 1px solid #1DA1F2;
    color: #1DA1F2;
}
.gp_other_sns_btn_instagram {
    border: 1px solid #CF2E92;
    color: #CF2E92;
}

/* YouTube詳細ページ */
.gp_sns_block_title {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 0.3em;
    margin: 1em 0;
    border-bottom: 1px solid #303030;
    font-size: 0.8em;
    font-weight: bold;
    color: #303030;
} 

/* YouTube最新投稿 */
.gp_y_latest_post {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    margin: 0.5em auto;
}
.gp_y_latest_post_thumb {
    display: block;
    box-sizing: border-box;
    width: 35%;
    height: 10em;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.gp_y_latest_post_texts {
    display: block;
    box-sizing: border-box;
    width: 65%;
    padding-left: 0.5em;
    color: #303030;
}
.gp_y_latest_post_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    font-size: 0.8em;
    font-weight: bold;
    line-height: 1.4;
    color: #303030;
}
.gp_y_latest_post_info {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    font-size: 0.6em;
    font-weight: normal;
    color: #303030;
}
.gp_y_latest_post_info i {
    padding-right: 0.3em;
}
.gp_y_latest_post_desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    font-size: 0.7em;
    font-weight: normal;
    line-height: 1.4;
    color: #303030;
}

/* Twitter最新投稿追加クラス */
.gp_t_latest_post_thumb {
    height: 6em;
}

/* YouTube人気投稿 */
.gp_y_pop_posts_wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: start;
    align-items: start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
}
.gp_y_pop_post {
    display: block;
    box-sizing: border-box;
    width: 33%;
    margin-bottom: 1em;
}
.gp_y_pop_post_thumb {
    display: block;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
}
.gp_y_pop_post_thumb img {
    max-width: 100%;
}
.gp_y_pop_post_title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    font-size: 0.7em;
    font-weight: bold;
    line-height: 1.4;
    color: #303030;
}
.gp_y_pop_post_info {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 0.3em;
    font-size: 0.5em;
    font-weight: normal;
    color: #303030;
}
.gp_y_pop_post_info i {
    padding-right: 0.3em;
}
.gp_y_pop_post_desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    box-sizing: border-box;
    width: 100%;
    font-size: 0.6em;
    font-weight: normal;
    line-height: 1.4;
    color: #303030;
}

/* YouTube投稿一覧 */
.gp_y_all_posts_wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    -webkit-align-items: start;
    align-items: start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
    padding: 0 0.5em;
    max-height: 30em;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    overflow-y: auto;
}

@media only screen and (min-width: 980px) {

    /* SNS投稿 */
    .gp_y_post {
        width: 30%;
    }

    /* YouTube最新投稿 */
    .gp_y_latest_post {
        width: 70%;
    }

    /* YouTube人気投稿 */
    .gp_y_pop_post {
        width: 24%;
        margin-bottom: 1em;
    }

    /* YouTube投稿一覧 */
    .gp_y_all_posts_wrap {
        max-height: 30em;
    }

    /* SNSニュース */
    .gp_sns_news_thumb {
        width: 20%;
    }
    .gp_sns_news_text {
        width: 80%;
    }

}