@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/* FPSMダッシュボードの投稿一覧をサムネイル付きにスタイリング */
.fpsm-dashboard-row {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.fpsm-dashboard-post-title {
    display: flex;
    align-items: center;
}

.fpsm-dashboard-post-title img {
    width: 50px;
    height: 50px;
    margin-right: 10px;
}

/*ALL以下のプルダウンメニューを非表示*/
.fpsm-dashboard-post-status-filter {
    display: none;
}


/*この投稿者の投稿一覧をスクロールバー式にする*/
/* この投稿者の投稿一覧をスクロールバー式にする */
.author-posts-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.slider-wrapper {
    display: flex;
    overflow-x: scroll; /* 水平スクロールを有効にする */
    white-space: nowrap; /* 子要素を横並びにする */
}

@media (min-width: 601px) {
    .author-posts-list {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
        flex-wrap: nowrap; /* 子要素が複数行にわたらないようにする */
    }

    .author-posts-list li {
        margin-right: 20px; /* 投稿間のスペースを調整 */
        min-width: 150px; /* サムネイルの幅を調整 */
        display: inline-block; /* 横並びにする */
        vertical-align: top; /* 上揃えにする */
        white-space: nowrap; /* 子要素を横並びにする */
    }

    .author-posts-list li a img {
        display: block;
        width: 100%;
        height: auto;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
}

/* この投稿者の投稿一覧のボタン部分の見た目 */
.prev-btn, .next-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
　　background-color: rgba(255, 255, 255, 0.7) !important; /* 初期状態で透過する背景色 */
    border: none;
    cursor: pointer;
    padding: 10px;
    z-index: 1;
    font-size: 24px; /* フォントサイズを大きくする */
    color: #000; /* ボタンの初期色 */
}

.prev-btn {
    left: 0;
}

.next-btn {
    right: 0;
}

/* ホバー時に色を変更 */
.prev-btn:hover, .next-btn:hover {
    color: #888; /* 灰色に変更 */
    background-color: rgba(255, 255, 255, 0.7); /* ホバー時の背景色を少し濃くする */
}










/*編集　削除　確認　のテキストを横並びにする*/
.fpsm-dashboard-column.fpsm-dashboard-action a {
    display: inline-block;
    margin-right: 10px; /* ボタンの間隔を調整 */
}

.fpsm-dashboard-column.fpsm-dashboard-action {
    white-space: nowrap;
}


/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}