@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 3.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/



body {
  font-size: 105%;
}

body.single {
	background-color: #fff !important;
}

#breadcrumb {
  background: #f1f8ff;
}
#main {
	/*
	width: auto;
	padding-right: 0;
	margin: 0 auto;
	*/
}
.one-column #main {
	max-width: 900px !important;
	box-shadow: none !important;
}
#entry {
	box-shadow: none;
}
#main .cat-name {
  background: #6b9eff;
  font-size: 10px;
}


/******************
テキストカード
 ******************/
.entry-content .text-card {
  display: block;
  padding: 0;
  margin: 2em 0;
  background: #ffffff;
  color: #464646;
  border-radius: 5px;
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15);
  font-weight: bold;
  text-decoration: none;
  font-size: 0.9em;
}
.entry-content .text-card:hover {
  box-shadow: 0 30px 30px rgba(0, 0, 0, 0.16);
}
.text-card .fa {
  height: 70px;
  display: block;
  text-align: center;
  line-height: 70px;
  font-size: 35px;
  background: #70b7ff3d;
  border-radius: 5px 5px 0 0;
  color: #70b7ff;
}
.text-card-title {
  display: block;
  padding: 1em;
}

.post-tab {
	max-width: 900px !important;
}

.home .post-tab__content {
	max-width: 900px;
	padding-top: 40px;
}

.home #main {
	overflow: visible;
}

.home .post-tab>.tab2 {
	border-right: none;
}

@media (min-width: 481px) {
  .entry-content .text-card {
    width: 40%;
    margin: 5%;
  }
}
@media (min-width: 768px) {
  .entry-content .text-card {
    width: 29%;
    margin: 2%;
  }
}



/******************
 ロゴ画像のサイズ調整
 ******************/
#logo img {
  padding: 15px 0;
}
@media only screen and (min-width: 768px) {
  h1 {
    font-size: 1.7em;
  }
	/*
  #logo,
  #logo img,
  .desktop-nav li a {
    height: 40px;
    line-height: 40px;
  }
	*/
} /*END 768px*/

/******************
引用内の箇条書きを調整
 ******************/
.entry-content blockquote ul,
.entry-content blockquote ol {
  border: none;
  padding: 5px 0 5px 20px;
  margin: 0;
}
/******************
コメント設定
 ******************/
#comments-title {
  margin-top: 3em;
  background: #6bb6ff;
  color: #fff;
}

/******************
 ナビドロワーの中身の設定
 ******************/

/*バツじるしを白に*/
.drawer__title .close span,
.drawer__title .close span:before {
  background: #fff;
}
/*画像まわりの余白を消す*/
#drawer__content .drawer__title {
  padding: 0;
  background: #b4e0fa;
  padding: 10px 0;
}
.drawer__title a {
  color: #0099dd;
  text-decoration: none;
}
.drawer--unshown {
	display: none;
}

/*「カスタマイズガイド」の文字と画像*/
.sango-customize {
  width: 100%;
  display: table;
}
.drawer__title p,
.drawer__title figure {
  vertical-align: middle;
  display: table-cell;
}
.drawer__title figure {
  display: none;
}
.drawer__title figure img {
  width: 100%;
}
.drawer__title p {
  width: calc(100% - 100px);
  margin: 0;
  padding: 0.5em 0;
  line-height: 1.2;
  text-align: left;
}
.sango-customize p {
	padding-right: 15px;
	padding-left: 15px;
}
/*検索フォーム*/
.drawer__title form {
  margin: 0 15px;
}
#drawer__content input#s {
  background: #ffffff;
}
/*カテゴリと記事一覧*/
.table_of_contents {
  margin: 15px 0;
}
.table_of_contents li {
  font-weight: bold;
}
.table_of_contents li a {
  color: #54626f;
  display: block;
  padding: 8px 15px;
}
.table_of_contents li a:hover {
  text-decoration: none;
  background: #efefef;
}
.table_of_contents li a i {
  color: #c3cdde;
}
.table_of_contents ul {
  margin: 0;
  display: none;
}
.table_of_contents ul li a {
  font-size: 0.83em;
  padding: 11px 12px 11px 40px;
  line-height: 1.4;
  position: relative;
}
.table_of_contents ul li a:before {
  content: "\f105";
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  left: 26px;
  color: #c3cdde;
  position: absolute;
}

.cardtype .entry-time {
	    margin: 8px 13px 0;
}

.admin-bar #drawer__content {
	margin-top: 0px;
}
body.admin-bar {
    margin-top: -32px;
    padding-bottom: 32px;
}

#drawer__content {
	padding-bottom: 0;
}


/*ナビドロワーの現在表示中のリンクを装飾*/
.active-parent {
  background: #f7f7f7;
}
.table_of_contents .active {
  background: #d6edff;
  color: #6bb6ff;
}
.table_of_contents .active:before {
  color: #6bb6ff;
}

.table_of_contents .accent-bc {
  background-color: #6bb6ff;
  color: #fff;
  border-radius: 5px;
  font-size: 10px;
  padding: 4px 6px;
}
.notfound {
  max-width: 698px;
  margin: 0 auto !important;
}

.footer {
	background-color: #0099dd !important;
}

.article-header {
    padding: 15px 0px 0px;
}

#breadcrumb {
    background: #f1f8ff !important;
	    margin: 0 !important;
    padding: 13px 15px !important;
}
.article-header {
    padding: 0px;
}
.entry-title {
    margin-top: 15px !important;
    padding: 0px 15px !important;
}

.home #main,
.archive #main,
.search #main
{
    width: 100%;
    padding: 15px;
}
 /*記事一覧のフォント*/
.sidelong .sidelong__title, .sidelong h2 {
	height: 1.5em;
	font-size: 15px;
}
 /*記事一覧の高さ調節*/
.sidelong__article {
min-height: auto;
}

 /*ページ中のリンクの設定*/

#toc_container .toc_list li a, .ez-toc-list li a,
.widget ul li a {
	color: #4f96f6;
	text-decoration: underline;
}

.widget ul li ul li a:before {
	display: inline-block;
}

a[target="_blank"]:after {
    content: "\f08e";
    font-family: FontAwesome;
    padding: 0 3px;
}

/*************************481px******************************/

/*ページ一覧を1行にする*/
@media only screen and (min-width: 481px){
.sidelong {
    display: block;
}
.sidelong__article {
    margin-bottom: 15px;
}	
	
}

/*************************768px******************************/


/******************
 ナビドロワーの設定
 1030px以上の場合、常に表示
 ******************/
@media (min-width: 768px) {
  /*ナビを1030pxまで表示*/
  #drawer__open {
    display: block;
  }
#content {
    margin-top: 0 !important;
}
	
  /*サイドバーのスペースを無くす*/
  .t-2of3 {
    float: none;
    width: 100%;
    padding-right: 0;
  }

  /*記事一覧のカードのサイズを調整*/
	.cardtype:before,
	.cardtype:after { display: none; }
/*   .cardtype__article {
    width: 45%;
    margin: 25px 3.5% 25px 2%;
  }
  .cardtype__article:nth-child(even) {
    margin-right: 2%;
  }
  .cardtype {
    max-width: 730px;
    margin: 0 auto;
  } */

  /*タブの幅*/
  .post-tab {
    margin: 1em auto 0;
    max-width: 700px;
  }

  /*1カラムの幅を調整*/
  .one-column #main {
    max-width: 800px;
  }

  /*アーカイブページのヘッダ幅を調節*/
  #archive_header {
    margin: 0 auto 1.5em;
    max-width: 698px;
  }

  /*検索結果を調整*/
  .search #inner-content {
    max-width: 900px;
    margin: 0 auto;
  }
  .notfound {
    margin-right: 0;
  }

  /*前の記事・次の記事のカード*/
  .prnx_tb {
    box-shadow: none;
    border: solid 2px #eaedf2;
  }

  /*コメント設定*/
  #comments-title,
  .commentlist {
    margin-left: 25px;
    margin-right: 25px;
  }
  .comment-respond {
    border-top: none;
  }
	#inner-content {
    width: 100%!important;
	padding: 0px;
	}
}


/*************************ナビを1030px以上******************************/

@media only screen and (min-width: 1030px) {
	
	/*サイドウィジットの検索ボックス周り*/
#drawer__content .widget_search {
	margin: 0;
	padding: 1em;
	background-color: #efefef;
}
.searchform__submit, .footer .wp-block-search .wp-block-search__button, .sidebar .wp-block-search .wp-block-search__button, .drawer .wp-block-search .wp-block-search__button {
    top: 4px;
	width: 44px;
    height: 44px;
}
	
	 /*記事一覧のフォント*/
	.sidelong .sidelong__title, .sidelong h2 {
		font-size: 18px;
	}
	
  /*ナビを1030px〜非表示*/
  #drawer__open {
    display: none;
  }
 /*閉じるボタンを非表示*/
	.drawer__title {display: none;}	

  /*ヘッダーに余計なアニメーションをつけない*/
  .home .header,
  .header {
    animation: none;
    box-shadow: none;
  }

  /*メニューの中身を常に表示*/
  #drawer__content {
    transform: translateX(0%);
    width: 300px;
    left: 0;
    box-shadow: 3px 0 3px rgba(0, 0, 0, 0.1);
  }
	
  /*バツボタンと開くボタンを消す*/
	/*.drawer__title.dfont,*/
  .drawer__title .close,
  #drawer__open {
    display: none;
  }

  /*メニュー分のスペースを空ける*/
  #container,
  body > .footer {
    padding-left: 300px;
  }

  /*サイドバー分のスペースを消す*/
/*   .wrap {
    width: auto;
  } */

  /*コメント設定*/
  #comments-title,
  .commentlist {
    margin-left: 40px;
    margin-right: 40px;
  }
}

#inner-content {
	margin: 0 auto;
}


/*high-light.js*/
/*以下highlight.js*/

.hljs {
  display: block;
  white-space: pre-wrap;
  word-wrap: break-word;
  padding: 1em;
  background: #f3f5f6;
  font-size: 15px;
}
.hljs .bold {
  background: linear-gradient(transparent 60%, #ffe1b8 60%);
  font-weight: normal;
}
.post-content pre.hljs {
  padding: 20px 5px 10px;
  margin: 0;
  border-bottom: solid 1px #dadada;
  overflow-x: hidden;
  overflow-y: hidden;
  line-height: 2.3;
}

.hljs,
.hljs-tag,
.hljs-subst {
  color: #39464e;
}

.hljs-strong,
.hljs-emphasis {
  color: #a8a8a2;
}

.hljs-bullet,
.hljs-quote,
.hljs-number,
.hljs-regexp,
.hljs-literal,
.hljs-link {
  color: #ed5c65;
}

.hljs-code,
.hljs-title,
.hljs-section,
.hljs-selector-class {
  color: #f18c16;
}

.hljs-strong {
  font-weight: bold;
}

.hljs-emphasis,
.itly {
  font-style: italic;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-name {
  color: #2795ee;
}
.hljs-attr {
  color: #f18c16;
}
.hljs-symbol,
.hljs-attribute {
  color: #39464e;
}

.hljs-params,
.hljs-class .hljs-title {
  color: #6c6c6a;
}

.hljs-string,
.hljs-type,
.hljs-built_in,
.hljs-builtin-name,
.hljs-selector-id,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
  color: #249d7f;
}

.hljs-comment,
.hljs-deletion {
  color: #afafaf;
  font-size: 0.85em;
}
.hljs-meta {
  color: #717171;
}
.cardtype__article:nth-child(2n) {
	margin-right: 0;
}
/*ここまでhighlight.js*/
@media only screen and (min-width: 1240px) {
  .single .wrap,
  .page .wrap,
  .archive .wrap,
  .single #inner-content,
  .page #inner-content {
    width: auto;
  }
}

.home .post-tab__content {
	margin: 0 auto;
}


@media screen and (min-width: 768px) {
#archive_header {
	    max-width: 1100px;
}
}