/*
 * Konya Movie Top - トップページ専用CSS
 * 対象：トップページのレイアウト、検索ヒーロー、映画／テレビ切り替え、検索フォーム、レスポンシブ表示。
 * サイト共通ヘッダーや検索結果ページのCSSは含めない。
 */

/* ========================================
   トップページ：1カラム化
   ======================================== */

body.home .sidebar {
    display: none !important;
}


body.home .main,
body.home .content {
    width: 100% !important;
    max-width: 100% !important;
}


body.home .main {
    margin-right: 0 !important;
}



/* ========================================
   TOPページ：日付を非表示
   ======================================== */

.home .date-tags {
    display: none !important;
}



/* ========================================
   TOPページ：余白を縮小
   ======================================== */

.home #main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}


.home .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}


.home .entry-content > * {
    margin-top: 0 !important;
    margin-bottom: 15px !important;
}


.home .entry-content > *:first-child {
    margin-top: 0 !important;
}


.home .entry-content h2 {
    margin-top: 0 !important;
}



/* ========================================
   TOPページ：見出し
   ======================================== */

.home .entry-content h2 {
    color: #333333;
    background-color: #eeeeee;
}



/* ========================================
   TOPページ：リンク
   ======================================== */

.home .entry-content a {
    color: #1976d2;
}


.home .entry-content a:hover {
    color: #125ea8;
}



/* ========================================
   TOPページ：検索・ジャンルボタン
   ======================================== */

.home .entry-content button,
.home .entry-content input[type="submit"],
.home .entry-content .wp-block-button__link {
    background-color: #333333;
    color: #ffffff;
    border-color: #333333;
}


.home .entry-content button:hover,
.home .entry-content input[type="submit"]:hover,
.home .entry-content .wp-block-button__link:hover {
    background-color: #222222;
    color: #ffffff;
}



/* ========================================
   TOPページ：検索フォーム
   ======================================== */

.home .entry-content input[type="text"],
.home .entry-content input[type="search"] {
    color: #333333;
    background-color: #ffffff;
    border-color: #cccccc;
}


.home .entry-content input::placeholder {
    color: #777777;
    opacity: 1;
}


/* =========================================================
   TOP：映画検索ヒーロー
   ========================================================= */

.home .home-movie-search {
    position: relative;
    box-sizing: border-box;

    width: 100%;
    min-height: 360px;

    margin: 0 0 35px;
    padding: 65px 50px 45px;

    border-radius: 10px;
    overflow: hidden;

    background-image:
        linear-gradient(
            rgba(8, 24, 43, 0.52),
            rgba(8, 24, 43, 0.52)
        ),
        url("https://konya-movie.com/wp-content/uploads/2026/09/haikei_search.png");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    color: #ffffff;
}


.home .home-movie-search h2,
.home .home-movie-search h3 {
    position: relative;
    z-index: 2;

    max-width: 100%;
    margin: 0 0 10px;
    padding: 0;

    color: #ffffff !important;
    background: transparent !important;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.4;

    overflow-wrap: break-word;
    word-break: break-word;
}


.home .home-movie-search .home-movie-search-description {
    position: relative;
    z-index: 2;

    max-width: 100%;
    margin: 0 0 25px;
    padding: 0;

    color: #ffffff !important;

    font-size: 16px;
    line-height: 1.7;

    overflow-wrap: break-word;
    word-break: break-word;
}


/* 実際のHTMLで使われているクラスと旧クラスの両方に対応 */
.home .home-movie-search .home-search-form,
.home .home-movie-search .home-movie-search-form {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: row;
    align-items: stretch;
    flex-wrap: nowrap;

    width: 100%;
    max-width: 760px;
    min-width: 0;

    margin: 0;
    padding: 0;
    gap: 0;

    box-sizing: border-box;
}


/* 検索入力 */
.home .home-movie-search .home-search-form input[type="text"],
.home .home-movie-search .home-search-form input[type="search"],
.home .home-movie-search .home-movie-search-form input[type="text"],
.home .home-movie-search .home-movie-search-form input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;

    height: 54px;
    margin: 0;
    padding: 0 20px 0 48px;

    box-sizing: border-box;

    border: none !important;
    border-radius: 27px 0 0 27px !important;

    background: #ffffff !important;
    color: #333333 !important;

    font-size: 16px;
    box-shadow: none !important;
}


.home .home-movie-search .home-search-form input::placeholder,
.home .home-movie-search .home-movie-search-form input::placeholder {
    color: #777777;
    opacity: 1;
}


/* 虫眼鏡 */
.home .home-movie-search .home-search-form::before,
.home .home-movie-search .home-movie-search-form::before {
    content: "";
    position: absolute;

    left: 18px;
    top: 17px;

    width: 15px;
    height: 15px;

    border: 2px solid #526174;
    border-radius: 50%;

    z-index: 3;
    pointer-events: none;
}


.home .home-movie-search .home-search-form::after,
.home .home-movie-search .home-movie-search-form::after {
    content: "";

    position: absolute;

    left: 32px;
    top: 32px;

    width: 8px;
    height: 2px;

    background: #526174;

    transform: rotate(45deg);

    z-index: 3;
    pointer-events: none;
}


/* 検索ボタン */
.home .home-movie-search .home-search-form button,
.home .home-movie-search .home-search-form input[type="submit"],
.home .home-movie-search .home-movie-search-form button,
.home .home-movie-search .home-movie-search-form input[type="submit"] {
    flex: 0 0 100px;

    width: 100px;
    height: 54px;

    margin: 0;
    padding: 0;

    border: none !important;
    border-radius: 0 27px 27px 0 !important;

    background: #1685e5 !important;
    color: #ffffff !important;

    font-size: 16px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
    white-space: nowrap;
}


.home .home-movie-search .home-search-form button:hover,
.home .home-movie-search .home-search-form input[type="submit"]:hover,
.home .home-movie-search .home-movie-search-form button:hover,
.home .home-movie-search .home-movie-search-form input[type="submit"]:hover {
    background: #0876d1 !important;
}


.home .home-movie-search .home-movie-search-note {
    position: relative;
    z-index: 2;

    margin: 14px 0 0;

    color: #eeeeee !important;

    font-size: 13px;
    line-height: 1.6;
}


/* 人気キーワード */
.home .home-movie-search::after {
    content:
        "人気のキーワード　 邦画　 洋画　 アニメ　 サスペンス　 コメディ";

    display: block;
    position: relative;
    z-index: 2;

    margin-top: 22px;

    color: #ffffff;

    font-size: 13px;
    line-height: 1.8;
    opacity: 0.95;
}


    .home .home-movie-search {
        min-height: 340px;
        padding: 55px 35px 40px;
        border-radius: 8px;
    }


    .home .home-movie-search h2,
    .home .home-movie-search h3 {
        font-size: 28px;
    }


    .home .home-movie-search {
        min-height: 360px;
        padding: 40px 20px;
        border-radius: 6px;
        background-position: center;
    }


    .home .home-movie-search h2,
    .home .home-movie-search h3 {
        font-size: 25px;
    }


    .home .home-movie-search .home-movie-search-description {
        font-size: 14px;
        line-height: 1.7;
    }


    /* スマホでも入力欄＋検索ボタンを横並び */
    .home .home-movie-search .home-search-form,
    .home .home-movie-search .home-movie-search-form {
        width: 100% !important;
        max-width: 100% !important;
        gap: 6px !important;
    }


    .home .home-movie-search .home-search-form input[type="text"],
    .home .home-movie-search .home-search-form input[type="search"],
    .home .home-movie-search .home-movie-search-form input[type="text"],
    .home .home-movie-search .home-movie-search-form input[type="search"] {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;

        height: 50px !important;
        padding: 0 12px !important;

        border: 1px solid #cccccc !important;
        border-radius: 6px !important;

        font-size: 16px;
    }


    .home .home-movie-search .home-search-form button,
    .home .home-movie-search .home-search-form input[type="submit"],
    .home .home-movie-search .home-movie-search-form button,
    .home .home-movie-search .home-movie-search-form input[type="submit"] {
        flex: 0 0 85px !important;
        width: 85px !important;
        min-width: 85px !important;
        height: 50px !important;

        border-radius: 6px !important;

        font-size: 13px !important;
    }


    /* スマホではフォームの虫眼鏡を入力欄内に置くため非表示 */
    .home .home-movie-search .home-search-form::before,
    .home .home-movie-search .home-search-form::after,
    .home .home-movie-search .home-movie-search-form::before,
    .home .home-movie-search .home-movie-search-form::after {
        display: none;
    }


    .home .home-movie-search::after {
        margin-top: 18px;
        font-size: 12px;
        line-height: 1.8;
    }


    .home .home-movie-search .home-search-form button,
    .home .home-movie-search .home-search-form input[type="submit"],
    .home .home-movie-search .home-movie-search-form button,
    .home .home-movie-search .home-movie-search-form input[type="submit"] {
        flex-basis: 82px !important;
        width: 82px !important;
        min-width: 82px !important;
        font-size: 12px !important;
    }



/* ========================================
   トップページ：検索見出しの重なり修正
   ======================================== */

.home .entry-content .home-movie-search h2,
.home .entry-content .home-movie-search h3 {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    line-height: 1.4 !important;
}


.home .entry-content .home-movie-search .home-movie-search-description {
    margin-top: 0 !important;
    margin-bottom: 25px !important;
    line-height: 1.8 !important;
}


    .home .entry-content .home-movie-search h2,
    .home .entry-content .home-movie-search h3 {
        font-size: 24px !important;
        line-height: 1.4 !important;
        white-space: normal !important;
    }


    .home .entry-content .home-movie-search .home-movie-search-description {
        margin-top: 0 !important;
        margin-bottom: 22px !important;
        line-height: 1.7 !important;
    }

/* =========================================================
   TOP：映画／テレビ検索 最終版
   既存の古いタブ指定を廃止し、現在のTOP HTMLだけを制御
   ========================================================= */

/* タブ全体 */
/* CSS moved to Konya Movie Top plugin. */


/* タブ共通 */
/* CSS moved to Konya Movie Top plugin. */


/* 映画：選択中＝青 */
/* CSS moved to Konya Movie Top plugin. */


/* 映画：未選択＝薄い青 */
/* CSS moved to Konya Movie Top plugin. */


/* テレビ：選択中＝緑 */
/* CSS moved to Konya Movie Top plugin. */


/* テレビ：未選択＝薄い緑 */
/* CSS moved to Konya Movie Top plugin. */


/* 左右の角 */
/* CSS moved to Konya Movie Top plugin. */


/* CSS moved to Konya Movie Top plugin. */


/* ホバーで色を勝手に白へ戻さない */
/* CSS moved to Konya Movie Top plugin. */


/* CSS moved to Konya Movie Top plugin. */


/* CSS moved to Konya Movie Top plugin. */


/* TV検索グループ */
body.home .home-movie-search .home-search-group[data-search-group="tv"] {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


body.home .home-movie-search .home-search-group[data-search-group="tv"][hidden] {
    display: none !important;
}


body.home .home-movie-search .home-search-group[data-search-group="tv"] .home-search-form {
    width: 100% !important;
    max-width: 750px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* 映画検索ボタン＝青 */
body.home .home-movie-search .home-search-group[data-search-group="movie"] .home-search-form button {
    background: #1976d2 !important;
    background-color: #1976d2 !important;
    color: #ffffff !important;
    border-color: #1976d2 !important;
}


/* テレビ検索ボタン＝緑 */
body.home .home-movie-search .home-search-group[data-search-group="tv"] .home-search-form button {
    background: #2e7d32 !important;
    background-color: #2e7d32 !important;
    color: #ffffff !important;
    border-color: #2e7d32 !important;
}


/* 人気キーワードの疑似要素を完全に消す */
body.home .home-movie-search::after {
    content: none !important;
    display: none !important;
}


/* 追加CSS内の汎用button指定より検索ボタンを優先 */
body.home .entry-content .home-movie-search .home-search-form button {
    color: #ffffff !important;
}

    /* CSS moved to Konya Movie Top plugin. */


    /* CSS moved to Konya Movie Top plugin. */

/* 現行プラグインの切り替えタブと検索パネル */
/* ==========================================================
   TOP検索 v1.1.4
   旧TOP検索CSS/JSの影響を受けない専用クラスを使用
   ========================================================== */
.home .home-movie-search .konya-v120-tabs {
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    width:100% !important;
    max-width:760px !important;
    margin:0 auto 20px !important;
    padding:0 !important;
    gap:0 !important;
    box-sizing:border-box !important;
}

.home .home-movie-search .konya-v120-tab {
    display:flex !important;
    flex:1 1 50% !important;
    width:50% !important;
    max-width:50% !important;
    min-width:0 !important;
    height:54px !important;
    min-height:54px !important;
    margin:0 !important;
    padding:0 10px !important;
    border:1px solid rgba(255,255,255,.45) !important;
    border-radius:0 !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    font-size:18px !important;
    font-weight:700 !important;
    line-height:1 !important;
    text-align:center !important;
    cursor:pointer !important;
    opacity:1 !important;
}

.home .home-movie-search .konya-v120-tab:first-child {
    border-radius:6px 0 0 6px !important;
}
.home .home-movie-search .konya-v120-tab:last-child {
    border-radius:0 6px 6px 0 !important;
}

.home .home-movie-search .konya-v120-tab[data-mode="movie"] {
    background:#bbdefb !important;
    background-color:#bbdefb !important;
    color:#174a7e !important;
}
.home .home-movie-search .konya-v120-tab[data-mode="movie"].is-active {
    background:#1565c0 !important;
    background-color:#1565c0 !important;
    color:#fff !important;
}
.home .home-movie-search .konya-v120-tab[data-mode="tv"] {
    background:#c8e6c9 !important;
    background-color:#c8e6c9 !important;
    color:#1b5e20 !important;
}
.home .home-movie-search .konya-v120-tab[data-mode="tv"].is-active {
    background:#2e7d32 !important;
    background-color:#2e7d32 !important;
    color:#fff !important;
}

.home .home-movie-search .konya-v120-panel {
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;
}
.home .home-movie-search .konya-v120-panel.is-hidden {
    display:none !important;
}

.home .home-movie-search .konya-v120-panel .home-search-form {
    width:100% !important;
    box-sizing:border-box !important;
}

.home .home-movie-search .konya-v120-movie-panel .home-search-form button,
.home .home-movie-search .konya-v120-movie-panel .home-search-form input[type="submit"] {
    background:#1976d2 !important;
    background-color:#1976d2 !important;
    color:#fff !important;
}

.home .home-movie-search .konya-v120-tv-panel .home-search-form button,
.home .home-movie-search .konya-v120-tv-panel .home-search-form input[type="submit"] {
    background:#2e7d32 !important;
    background-color:#2e7d32 !important;
    color:#fff !important;
}

.home .home-movie-search .konya-v120-tv-panel .home-search-form {
    margin-bottom:0 !important;
}

@media screen and (max-width:600px) {
    .home .home-movie-search .konya-v120-tab {
        height:50px !important;
        min-height:50px !important;
        font-size:16px !important;
    }
}
