@charset "UTF-8";
/*
Theme Name: XeoryExtensionChild
Theme URI: https://xeory.jp/extension
Template: xeory_extension
Description: Xeory拡張子テーマ
Author: バズ部
Author URI: https://bazubu.com/
Version: 1.0.0
*/
/* ----------------------------------
ヘッダー: ヘッダーバー
---------------------------------- */
#header {
    background: #27343c; /* ヘッダーバーの色 */
}
 
/* ----------------------------------
ヘッダーバー: グローバルナビ
---------------------------------- */
#gnav { 
    background-color: #27343c; /* 隙間 */
}
#gnav ul li a {
    background-color: #27343c; /* 背景色 */
    color: #fff; /* 文字色 */
}
#gnav ul li:hover a {
    background: #31414b; /* ホバー色 */
}
#gnav ul li.current-menu-item a {
    background: #31414b; /* セレクト色 */
}
 
/* ----------------------------------
ヘッダーバー: プライマリーナビ
---------------------------------- */
#header-fnav-area #header-fnav-btn a {
    background-color: #003037; /* ボタン背景色 */
}
#header a {
    color: #fff; /* アイコン色 */
}

/* ---------------------------------
ヘッダーナビ: スクリーンサイズ991px以下
---------------------------------- */
#header-nav-btn a {
    background-color: #31414b; /* ヘッダーメニューの色 */
}
#gnav-sp {
    background: #003037; /* メニュー背景色 */
}
 
/* ----------------------------------
スクリーンサイズ767px以下: ロゴ
---------------------------------- */
@media screen and (max-width: 767px) {
    #header #logo {
        float: left;
        display: inline-block;
        padding: 15px 0 10px 10px; /* 余白: 上右下左 */
    }
    #header #logo a img {
        width: 150px; /* 横サイズ */
        height: 38px; /* 縦サイズ */
    }
}
 
/* ----------------------------------
スクリーンサイズ767px以下: ハンバーガーメニュー
---------------------------------- */
@media screen and (max-width: 767px) {
    #header-nav-btn {
        display: block;
        width: auto;
        line-height: 1;
        float: right;
        margin: 0; 
    }
    #header-nav-btn a {
        display: block;
        text-align: center;
        font-size: 24px; /* アイコンサイズ */
        padding: 22px 10px 10px 10px; /* 余白: 上右下左 */
        line-height: 1;
        background: none;
        width: auto;
    }
}
 
/* ----------------------------------
スクリーンサイズ767px以下: ヘッダーの固定
---------------------------------- */
@media screen and (max-width: 767px) {
    #header {
        position: fixed;
        left: 0;
        right: 0;
        z-index: 999;
    }
    #main_visual,
    .breadcrumb-area {
        padding-top: 65px;
    }
}

/* ----------------------------------
ファーストビュー: 背景を画像に変更
画像のサイズは「1920×1080px」
---------------------------------- */
body.home #main_visual {
    background-image:url(http://kokoro-no-naka.secret.jp/wp-content/uploads/2022/07/P1010533-scaled-e1659095283897.jpg) !important;
    background-color: #000; /* 画像の下地色 */
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat;
	height:400px!important;
}
 
/* ----------------------------------
ファーストビュー: キャッチコピーの調整
---------------------------------- */
body.home #main_visual h2 {
    font-size: 25px; /* デフォルトは48px */
    color: #fff; /* 背景画像の色に合わせて変更 */ 
}
 
/* ----------------------------------
キャッチコピーの調整: レスポンシブ
---------------------------------- */
@media screen and (max-width: 480px) {
    body.home #main_visual h2 {
        font-size: 18px; /* 文字サイズ */
        }
}
 
/* ----------------------------------
ファーストビュー: サイト説明文の調整
---------------------------------- */ 
body.home #main_visual p {
    font-size: 15px; /* デフォルトは15px */
    color: #fff; /* 背景画像の色に合わせて変更 */ 
}
 
/* ----------------------------------
サイト説明文の調整: レスポンシブ
---------------------------------- */
@media screen and (max-width: 480px) {
    body.home #main_visual p {
        font-size: 12px; /* 文字サイズ */
        }
}

/*---------------------------------- 
トップページ: ブログ記事一覧
---------------------------------- */
#popular_post_content h2 i,
#recent_post_content h2 i {
    display: none; /* 見出しアイコンを消す */
}
body.home .front-loop .popular_post_box .p_category {
    background-color: #fff;
    border:solid 1px #009fb7;
    color:#009fb7;
}
body.home .front-loop .popular_post_box h3 a:hover {
  color: #FF6C00;
  text-decoration: none;
}

/* ----------------------------------
トップページ: ボックス共通項目
---------------------------------- */
body.home .front-main-cont .front-cont-header {
    background-color: #003037; /* タイトルバーの背景色 */
}
.c_btn .btn {
    background-color: #0d7484 !important; /* 詳細ボタンの背景色 */ 
    color: #fff !important; /* 詳細ボタンの文字色 */ 
}
body.home .tri-border {
    display: none; /* 見出しの突起を消す */
}

/* ----------------------------------
投稿ページ: アーカイブ等の記事一覧ページ
background-color: #5f9ea0; 「続きを読む」の背景色 
---------------------------------- */
.post-header .cat-name span {
    border: 1px solid #079292; /* カテゴリーの枠線の色と太さ */
    color: #079292; /* カテゴリーの文字色 */
}
#content .post-title a:hover {
    color: #1e679d; /* タイトルのホバー色 */
	text-decoration: none; /* リンクの下線を消す */
}
#content .post-footer a.morelink{
 	background-color: #fafafa; /* 「続きを読む」の色 */ 
 	border: 1px #2581c4 solid;
  	padding: 12px 24px;
  	line-height: 26px;
  	margin-bottom: 64px;
  	box-sizing: border-box;
  	clear: both;
  	color: #2581c4;
  	font-size: 14px;
	text-decoration: none; /* リンクの下線を消す */
}
#content .post-footer a.morelink:hover{
 	background-color: #2581c4; /* 「続きを読む」のホバー色 */ 
 	border: 1px #5f9ea0 solid;
  	padding: 12px 24px;
  	line-height: 26px;
  	margin-bottom: 64px;
  	box-sizing: border-box;
  	clear: both;
  	color: #FFFFFF;
  	font-size: 14px;
}

.front-loop .popular_post_box .p_category h3 a:hover {
	color: #FF6C00;
	text-decoration: none; /* リンクの下線を消す */
}

/* ----------------------------------
個別・投稿ページ: 記事外デザイン
---------------------------------- */
#content {
    background-color: #fafafa; /* 背景を単色に*/
}
.breadcrumb-area a {
    color: #2581c4; /* パンくずリストのリンク色 */
}
.breadcrumb-area a:hover {
    color: #1e679d; 
	text-decoration: none; /* リンクの下線を消す */
}
.side-widget a {
    color: #2581c4; /* サイドバーのリンクの色 */
	text-decoration: none; /* リンクの下線を消す */
}
.side-widget a:hover {
    color: #1e679d; /* サイドバーのリンクのホバー色 */
	text-decoration: none; /* リンクの下線を消す */
}

/* ----------------------------------
固定・投稿ページ: 記事内デザイン
---------------------------------- */
li.comments {
    display:none !important; /* コメント数の表示を消す */
}
.single #main article a,
.page #main article a {
    color: #2581c4; /* 本文リンクの色 */
	text-decoration: none; /* リンクの下線を消す */
}
.page #main article a:hover{
    color: #1e679d; /* 本文リンクリンクのホバー色 */
	text-decoration: none; /* リンクの下線を消す */
}
.breadcrumb-area a {
    color:#2581c4 !important;
	text-decoration: none; /* リンクの下線を消す */
    }
.breadcrumb-area a:hover {
    color: #1e679d; /* サイドバーのリンクのホバー色 */
	text-decoration: none; /* リンクの下線を消す */
}

#content .pagination .current {
    background-color: #079292; /* ページャーの色 */
}
.pagination a:hover {
    background: #079292; /* ページャーのホバー背景色 */
    color: #fff !important; /* ページャーのホバー文字色 */
	text-decoration: none; /* リンクの下線を消す */
}
	
/* 固定・投稿ページの文字サイズを変更 */

.post-content {
    font-size:15px;
    line-height:1.8em;
    }

@media (min-width: 768px) {
.post-content {
    font-size:16px;
    } 
}

@media (min-width: 992px) {
.post-content {
    font-size:18px;
    }  
}

/* 固定・投稿ページの背景色を変更 */

#content {
    background-color:#fafafa !important;
    }
/* 投稿ページのカテゴリー色を変更 */
.post-header .cat-name span {
    border: 1px solid #009fb7;
    color: #009fb7;
    }
/* 投稿ページの見出し色を変更 */

/* ----------------------------------
記事内デザイン: 見出し2
---------------------------------- */

#content .post-content h2 {
  color: #241913;
  background:#fff;
  font-weight: bold;
  margin: 80px 0 32px;
  padding: 0 0 12px;
  border:none;
  border-bottom: 1px solid #efefef;
}

/* ----------------------------------
記事内デザイン: 見出し3
---------------------------------- */

#content .post-content h3 {
    border-bottom: 2px solid #58656e;
}

/* ----------------------------------
記事内デザイン: 見出し4
---------------------------------- */

#content .post-content h4 {
    border-left: 5px solid #58656e;
    }
	
/* ----------------------------------
投稿ページ: CTAボックス
---------------------------------- */
#content .post-cta {
    background-color: #003037; /* 背景色 */
}
#main article .post-cta-btn .button {
    background-color: #079292; /* ボタンの背景色 */
    color: #fff; /* ボタンの文字色 */
}
  
/* ----------------------------------
投稿ページ: コメント欄
---------------------------------- */
#content #comments h4 {
    border-bottom: 3px solid #079292; /* タイトルの下線 */
}
#content #comments a {
    color: #079292; /* リンクの色 */
    text-decoration: none; /* リンクの下線を消す */
}
#content form input[type="submit"] {
    background-color: #0d7484; /* ボタンの背景色 */
}
	
/* ----------------------------------
フッター: サブフッターメニュー
---------------------------------- */
#sub-footer-menu a {
    font-size: 12px; /* 文字サイズ */
    text-decoration: none;
}
#sub-footer-menu ul li {
    display: inline-block; /* 横並び */
    list-style-type: none;
    text-transform: uppercase;
}
#sub-footer-menu ul li::before {
    content: "|"; /* 区切り線 */
    padding: 0 0.6em;
}
#sub-footer-menu ul li:first-child::before {
    content: "";
    padding: 0;
}
#sub-footer-menu ul {
    text-align: center;
    margin: 10px 0;
    color: #079292; /* 区切り線の色 */
}
#sub-footer-menu ul .sub-menu {
    display: none;
}
 
/* ----------------------------------
サブフッターメニュー: レスポンシブ
---------------------------------- */
@media screen and (max-width: 767px) {
    #sub-footer-menu {
        display: list-item;  /* 縦並び */
    }
}
 
/* ----------------------------------
フッター: カラーの変更
---------------------------------- */
#footer .footer-01 {
    background-color: #003037; /* 背景色 */
}
#footer {
    border-top: 8px solid #fff; /* 上部ボーダーの色と太さ */
}
#footer #footer-brand-area {
    border-bottom: 1px solid #079292; /* 区切り線の色と太さ */
}
#footer .footer-02 {
    background-color: #003037; /* 最下部フッターの色 */
}
.footer-address {
    text-align: left !important; /* フッターテキストの左寄せ */
}

/* --------------------------------------------
投稿ページ（一覧）のアイキャッチの大きさの変更
-------------------------------------------- */
.post-loop-wrap .post-thumbnail img{
	width:40%; /* 記事のサムネイル画像の大きさ */
	float:left;
	margin:20px 40px 20px 40px ;
}
@media screen and (max-width: 480px) {
	.post-loop-wrap .post-thumbnail img{
		width:85%; /* 記事のサムネイル画像の大きさ */
}