/*
Theme Name: XeoryBaseChild
Theme URI: https://xeory.jp/base/
Template: xeory_base
Description: Xeoryベース子テーマ
Author: バズ部
Author URI: https://bazubu.com/
Version: 1.0.0
*/

/************************************
** 子テーマ用のスタイル
************************************/

/* ----------------------------------------
* 全体
---------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400&display=swap');


html {
 font-size: 62.5%;
}

body {
 color: #666;
 font-size: 1.6rem;
 font-family: 'Noto Sans JP', sans-serif;
 letter-spacing: .1em;
 line-height: 1.8em;
 text-size-adjust: 100%;
 -webkit-text-size-adjust: 100%;
}

/* ----------------------------------------
* header
---------------------------------------- */
#header {
 padding: 30px;
 border-top: 15px solid #F0A8BA;
 border-bottom: 1px solid #DCDCDC;
}

#header #logo {
 font-size: 26px;
}

#header #logo a:hover {
 color: #CC6680;
}

/* ----------------------------------------
* breadcrumb
---------------------------------------- */
.breadcrumb {
 margin: 0 0 50px;
}

/* ----------------------------------------
* gloval nav
---------------------------------------- */
#gnav {
 margin: 0;
 background: #FFF;
 border-top: none;
 border-bottom: 1px #DCDCDC solid;
 font-size: 16px;
}

#gnav li a {
 display: block;
 border-top: none;
 margin-top: 0;
 padding: 20px;
 color: #333;
}

#gnav li a:hover,
#gnav li.current-menu-item a {
 padding-bottom: 17px;
 color: #333;
 border-top: none;
 border-bottom: 3px #F0A8BA solid;
}

/* ----------------------------------------
* main
---------------------------------------- */

.cat-content,
article.post,
article.page,
article.wp101,
article.seo101 {
 border: 1px #DCDCDC solid;
}

.post-content {
  padding: 42px 50px;
}

.post-loop-wrap .post-content {
  padding: 0 50px 42px;
}

.post-meta {
 margin: 0 0 20px;
 flex-direction: row-reverse;
}

.post-title {
 margin: 0 0 20px;
}

.post-title a:hover {
 color: #CC6680;
}

.post-content p,
.post-content pre {
 padding: 10px 40px;
 line-height: 1.8em;
}

/* 投稿記事内のイラスト用 */
.img-box {
 padding: 20px 0 50px;
 text-align: center;
}

.img-box img {
 border: 1px #DCDCDC solid;
}

.img-box .img-memo {
 font-size: .8em;
 color: #808080;
}

/* ----------------------------------------
* card
---------------------------------------- */



/* ----------------------------------------
* side
---------------------------------------- */
.side-widget-area {
  padding: 0 0 30px 10px;
}

/* サイドバーの自己紹介用 */
.side-profile {
 border: 1px #DCDCDC solid;
}

.side-text-space {
 margin: 20px 0 0;
 padding: 1em;
 font-size: 0.9em;
 line-height: 1.6em;
 letter-spacing: .05em;
}

.widget_recent_entries a:hover,
.widget_archive a:hover,
.widget_categories a:hover,
.widget_meta a:hover,
.widget_views a:hover,
.side-text-space a  {
  color: #CC6680;
}

/* ----------------------------------------
* footer
---------------------------------------- */

.footer-01 {
 padding: 0 0 0 10px;
 border-top: 1px #DCDCDC solid;
 font-size: 14px;
}

/* ----------------------------------------
* レスポンシブ
---------------------------------------- */

@media screen and (max-width: 991px) {
 /* tablet */

 #header {
  padding: 30px 10px;
 }

 #gnav ul li a {
  margin: 0;
  padding: 10px;
  color: #333;
 }

 #gnav li a:hover,
 #gnav ul li.current-menu-item a {
  margin: 0;
  padding: 10px;
  color: #333;
  border-bottom: 1px #DCDCDC solid;
  background-color: #F5F5F5;
 }

 /* 本文 */
 article {
  font-size: .9em;
 }
}

/* ----------------------------------------
* icon
---------------------------------------- */
.published:before {
  width: 13px;
  height: 13px;
  left: 0;
  top: 10px;
  background-color: #999;
}

.fa-home:before,
.fa-folder:before,
.fa-tag:before,
.fa-file:before,
.fa-file-text:before {
 background-color: #999;
 top: 3px;
}

.breadcrumb li,
.breadcrumb span {
 margin: 0 5px 0 0;
}

/* singleページの投稿下のカテゴリアイコン */
.cat .fa-folder:before {
 top: 5px;
}

/* ----------------------------------------
* pagetop
---------------------------------------- */
.pagetop span {
  background: #F0A8BA;
}

/* ----------------------------------------
* footer
---------------------------------------- */
#footer a:hover {
  color: #CC6680;
}

