/*
Theme Name: Lightning Child COCO
Theme URI:
Template: lightning
Description:
Author:
Tags:
Version: 0.6.1
*/



body {
font-family: "Zen Kaku Gothic New", sans-serif !important;
font-weight: 400;
}

/* ---------------------------------
 ヘッダーロゴ横に検索窓
---------------------------------*/
/* デザインが崩れるので991.98px以下でform非表示 */
@media (max-width: 991.98px){
    #site-header-container form{
        display: none !important;
    }
}
#site-header-container .search-form{
    margin-left: auto;
}
/*虫眼鏡マーク*/
#site-header-container .search-form:after {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    margin: 0;
    content: "\f002";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    padding:14px 1.5em;
}
/*フィールド*/
#site-header-container .search-field{
    position: absolute;
    top: 50%;
    transform: translateY(-50%) ; 
    right: 0px;
}
/*submitボタン非表示*/
#site-header-container .search-submit{
    display: none;
}
/*テキストフィールド*/
#site-header-container form .search-field{
    z-index: 200;
    opacity: 0;
    width: 64px;
    transition: all 0.5s ease-in;
    padding: 1em 0.8em;
    cursor: pointer;
}
/*フォーカス時にテキストフィールド表示*/
#site-header-container form .search-field:focus {
    opacity: 1;
    width: 155px;
    transition: all 0.5s ease-in;
    /* 下線のみ */
    border: none;
    border-bottom: 2px solid #999999; /* 色はここで変更 */
    border-radius: 0; /* 角丸なし */
    /* 背景透過 */
    background-color: rgba(255, 255, 255, 0.8); /* 80%透過 */
    outline: none; /* フォーカス時の青枠を消す */
}

/* 活動情報の投稿者名を非表示 */
.entry-meta-item-author {
    display: none;
}

/* 活動情報の更新日を非表示
.entry-meta-item-updated { display: none; } */

/* SNSボタンカスタマイズ
.veu_socialSet .sb_icon.sb_facebook a,
.veu_socialSet .sb_icon.sb_twitter a,
.veu_socialSet .sb_icon.sb_hatena a,
.veu_socialSet .sb_icon.sb_line a,
.veu_socialSet .sb_icon.sb_pocket a,
.veu_socialSet .sb_icon.sb_copy button {
    background: rgba(255,255,255,.9);
    box-shadow: 0 0 0;
    transition: background .3s;
    border-radius: 20px;
}

.veu_socialSet .sb_icon.sb_facebook a:hover,
.veu_socialSet .sb_icon.sb_twitter a:hover,
.veu_socialSet .sb_icon.sb_hatena a:hover,
.veu_socialSet .sb_icon.sb_line a:hover,
.veu_socialSet .sb_icon.sb_pocket a:hover,
.veu_socialSet .sb_icon.sb_copy button:hover {
    color: #fff;
    transform: none;
}

.veu_socialSet .sb_icon.sb_facebook a {
    color: #425dab;
    border: 1px solid #425dab;
}
.veu_socialSet .sb_icon.sb_facebook a:hover {
    background: #425dab;
}

.veu_socialSet .sb_icon.sb_twitter a {
    color: #00abec;
    border: 1px solid #00abec;
}
.veu_socialSet .sb_icon.sb_twitter a:hover {
    background: #00abec;
}

.veu_socialSet .sb_icon.sb_hatena a {
    color: #007fc5;
    border: 1px solid #007fc5;
}
.veu_socialSet .sb_icon.sb_hatena a:hover {
    background: #007fc5;
}
.veu_socialSet .sb_icon.sb_line a {
    color: #6ebd30;
    border: 1px solid #6ebd30;
}
.veu_socialSet .sb_icon.sb_line a:hover {
    background: #6ebd30;
}

.veu_socialSet .sb_icon.sb_pocket a {
    color: #ea4654;
    border: 1px solid #ea4654;
}
.veu_socialSet .sb_icon.sb_pocket a:hover {
    background: #ea4654;
}

.veu_socialSet .sb_icon.sb_copy button {
    color: #228b22;
    border: 1px solid #228b22;
}
.veu_socialSet .sb_icon.sb_copy button:hover {
    background: #228b22;
} */

/* ボタンの並び順 */
li.sb_line {
    order: 1;
}

li.sb_twitter {
    order: 2;
}

li.sb_facebook {
    order: 3;
}

li.sb_pocket {
    order: 4;
}

li.sb_hatena {
    order: 5;
}

li.sb_copy {
    order: 6;
}

/* スライドの幅1400に設定 */
@media (min-width: 1400px) {

    .ltg-slide picture,
    .ltg-slide .swiper-slide>a {
        max-width: 1110px;
        display: block;
        margin: 0 auto;
    }

    .ltg-slide-text-set {
        max-width: 1110px;
        padding: 0 15px;
    }

    /* サイトロゴをスクロール時に常に表示 */
    .header_scrolled .site-header-logo {
        display: block;
        position: absolute;
        padding-top: 10px;
    }

    .site-header--layout--nav-float .site-header-logo {
        margin-right: 0;
        width: auto;
    }

    .header_scrolled .site-header-logo img {
        width: auto;
        height: 40px;
    }

    .header_scrolled .site-header .global-nav {
        margin-right: 0;
    }
}

/* 外部リンクのアイコン（Jump）表示
a[href^="http"]:after,
a[href^="//"]:after {
  margin: 0 0 0 3px;
  font-family: "Font Awesome 5 Free";
  content: '\f35d';
  font-weight: 900;
}
a[href^="https://cocotool.net/"]:after {
  margin: inherit;
  font-family: inherit;
  content: '';
  font-weight: inherit;
} */


/* 投稿ページの次へ前へのデザイン */
.next-prev-prev.card-horizontal .card-body {
    display: flex;
    padding: 0;
    align-items: center;
    justify-content: flex-start;
}

.next-prev-prev.card-horizontal .card-body:before {
    font-family: "Font Awesome 5 Free";
    content: "\f053";
    font-weight: bold;
    position: absolute;
    font-size: 3rem;
    color: rgba(0, 0, 0, 0.1);
    top: calc(50% - 1.5rem);
    left: 1rem;
}

.next-prev-prev.card-horizontal.vk_post .card-body .vk_post_title a {
    display: block;
    padding: 1.5rem 1.0rem 1.5rem 3.5rem;
}

.next-prev-next.card-horizontal .card-body {
    display: flex;
    padding: 0;
    align-items: center;
    justify-content: flex-end;
}

.next-prev-next.card-horizontal .card-body:before {
    font-family: "Font Awesome 5 Free";
    content: "\f054";
    font-weight: bold;
    position: absolute;
    font-size: 3rem;
    color: rgba(0, 0, 0, 0.1);
    top: calc(50% - 1.5rem);
    right: 1rem;
}

.next-prev-next.card-horizontal.vk_post .card-body .vk_post_title a {
    display: block;
    padding: 1.5rem 3.5rem 1.5rem 1.0rem;
}


/* 投稿ページのタイトル文字の再設定 */
#main h1.entry-title {
    font-size: 18px;
    padding: 0.5em;
    /*文字周りの余白*/
    /*display: inline-block;おまじない*/
    line-height: 1.3;
    /*行高*/
    background: #f9c2bb;
    /*背景色*/
    vertical-align: middle;
    border-radius: 25px 0px 0px 25px;
    /*左側の角を丸く*/
}

#main h1.entry-title:before {
    content: '●';
    /*color: white;*/
    margin-right: 8px;
}

/* 投稿ページのカテゴリ・アーカイブタイトル文字の再設定 */
#main h1.archive-header-title {
    font-size: 19px;
    color: white;
    padding: 0.5em;
    /*文字周りの余白*/
    /*display: inline-block;おまじない*/
    line-height: 1.3;
    /*行高*/
    background: #759BA0;
    /*背景色*/
    vertical-align: middle;
    border-radius: 25px 25px 25px 25px;
    /*左側の角を丸く*/
}

#main h1.archive-header-title:before {
    content: '●';
    color: white;
    margin-right: 8px;
}

/* スライドの文字背景設定 */
.ltg-slide-text-caption {
    display: inline-block;
    padding: 0.5em;
    background-color: rgba(255, 255, 255, 0.4);
    color: white;
}

/* アイキャッチのカテゴリラベル非表示 */
.vk_post_imgOuter_singleTermLabel {
display: none;
}
/* アイキャッチを非表示 */
.vk_post_imgOuter.media-img {
    display: none;
}
/* 関連記事のアイキャッチを非表示 */
.postList_thumbnail {
    display: none;
}
/* 新着！を非表示 */
.vk_post_title_new {
    display: none;
}
/* ヘッダー背景 */
.site-header {
    background-image: linear-gradient(127deg, rgba(252, 206, 252, 1), rgba(149, 243, 219, 1));
}
/* ヘッダー文字色
.global-nav-name {
    color: #fff;
} */
/* サイトタイトル文字色
.site-header-logo a {
    color: #fff;
} */
/* ページヘッダー背景 */
.page-header {
    background-image: linear-gradient(27deg, rgba(169, 156, 214, 1) 5%, rgba(160, 216, 233, 1) 95%);
}
.sub-menu {
    background-image: linear-gradient(27deg, rgba(169, 156, 214, 1) 5%, rgba(160, 216, 233, 1) 95%);
}

/* 検索窓全体のコンテナ */
/* .wp-block-search {
    max-width: 500px;
    margin: 20px auto;
} */

/* 「検索」というラベル（非表示にしてスッキリさせる場合） 
.wp-block-search__label {
    display: none;
}*/

/* 入力欄とボタンを囲むラッパー */
.wp-block-search__inside-wrapper {
    display: flex;
    border-bottom: 2px solid #7ab2b9; /* 下線のみのスタイル */
    transition: border-color 0.3s;
}

/* 入力欄 */
.wp-block-search__input {
    border: none !important;
    background: transparent !important;
    padding: 10px 0 !important;
    outline: none;
}

/* ボタン */
.wp-block-search__button {
    background: none !important;
    color: #7ab2b9 !important; /* 文字だけの色 */
    border: none !important;
    font-weight: bold;
    letter-spacing: 0.1em;
}

.wp-block-search__button:hover {
    color: #ffb6c1 !important; /* ホバーで色が変わる */
}