/*! Luxeritas Child CSS */
/* Luxeritas WordPress Theme - free/libre wordpress platform
 *
 * @copyright Copyright (C) 2015 Thought is free.
 * @license http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later
 * @author LunaNuko
 * @link https://thk.kanzae.net/
 * @translators rakeem( http://rakeem.jp/ )
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 *   Theme Name: Luxeritas Child Theme
 *   Template: luxeritas
 *   Text Domain: luxech
 *   Theme URI: https://thk.kanzae.net/wp/
 *   Description: SEO optimized, Responsive layout, Super Fast, Multi Feature, Bootstrap
 *   Author: LunaNuko
 *   Author URI: https://thk.kanzae.net/
 *   License: GNU General Public License v2 or later
 *   License URI: http://www.gnu.org/licenses/gpl-2.0.html
 *   Tags: one-column, two-columns, three-columns, right-sidebar, left-sidebar, custom-header, custom-background, custom-colors, custom-menu, theme-options, featured-image-header, editor-style, sticky-post, threaded-comments, translation-ready
 *   Since: 20151206
 *   Modify: 20170922
 *   Version: 2.00
 *   Template Version: 2
 *
 * ここから上を消すと正しく動作しなくなることがあります。
 * ( Erasing the elements above here might cause system issues. )
*/

/* 以下、好みに応じて子テーマ用のスタイルをお書きください。
 * ( Below here, please write down your own styles for the child theme. )
*/

/* 見出しをメインカラーに */

.home h2,
.archive h2,
#side .widget h3,
.single h1 {
    color:#20a39e;
}

/* タイル型記事見出しホバー時：アクションカラーに */

.home h2 a:hover,
.archive h2 a:hover {
    color:#f9a730;
}
/* カテゴリー名をメインカラーに */

.home .category,
.page .category,
.archive .category,
.meta-box .category,
.home .category a,
.page .category a,
.archive .category a,
.meta-box .category a,
.home .fa-folder,
.page .fa-folder,
.archive .fa-folder,
.meta-box .fa-folder {
    color:#20a39e;
    text-decoration:none;
}

/* トップページとアーカイブページ：ページネーションをメインカラーに */

.pagination .active span {
    background-color:#20a39e;
}

.pagination li a:hover {
    background-color:#20a39e;
    color:#fff;
}

/* 新着記事 */

.new-title a {
    color:#20a39e;
}

.new-title a:hover {
    color:#f9a730;
}

/* サイドバー：タグ色の変更 */

.widget_tag_cloud a {
    border:none;
    background-color:#999;
    color:#fff;
}

.widget_tag_cloud a:hover {
    background-color:#000;
}

@media (min-width: 768px) {
    
.widget_tag_cloud a {
    font-size:13px !important;
}
        
}

/* 投稿ページの各見出しを変更 */

.post h2 {
    border-bottom: 3px solid #20a39e;
    border-left:none !important;
}

.post h2:first-letter {
    margin-right: .1em;
    font-size: 1.5em;
}

.post h3 {
    border-left:none !important;
    position: relative;
    border-bottom: 4px solid #ccc;
    margin-left:0;
}

.post h3::after {
    position: absolute;
    bottom: -4px;
    left: 0;
    z-index: 2;
    content: '';
    width: 20%;
    height: 4px;
    background-color: #20a39e;
}

.post h4 {
    border-left:solid 5px #20a39e  !important;
}

/* タグ名の色変更 下線消去 */

.meta-box .fa-tags,
.meta-box .tags,
.meta-box .tags a {
    color:#f9a730;
    text-decoration:none;
}

/* 記事作者名の色変更  下線消去 */

.meta-box .fa-pencil,
.meta-box .author,
.meta-box .author a {
    color:#165e83;
    text-decoration:none;
}

/* 「よろしければシェアお願いします」の下線色変更 */

.sns-msg h2 {
    border-bottom:solid 5px #E9F707;
}

/* 投稿ページ：ページネーションのホバー色を変更 */

#pnavi a:hover {
    color:#f9a730;
}

/* 関連記事の文字色及び記事名のホバー色を変更 */

.related {
    color:#20a39e;
}

.excerpt h3 a:hover {
    color:#f9a730 !important;
}


/*トップアイキャッチ余白*/
#list .term img {
    margin-bottom: 0px;
    border-radius: 0px;
    padding: 0px;
}
/*レスポンシブアイキャッチ余白*/
#list div[id^="tile-"] .term img, #list div[id^="card-"] .term img {
    max-width: 575px;
    width: 100%;
}
/*日付余白*/
div[id^=tile-] .meta {
    margin-bottom: 10px;
}
/*抜粋文45文字余白*/
#list div[id^="tile-"] .excerpt {
    margin-top: 0px;
    margin-right: 10px;
    margin-bottom: 20px;
    margin-left: 10px;
}
/*記事一覧ボックス形状とマウスオーバー*/
div[id^="tile-"] 
.toc:not(#bottom-area):not(.posts-list-middle-widget):not(#bottom-area):not(.posts-list-under-widget) {
    padding: 0px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .13);
    border: none;
    transition: .3s;
    overflow: hidden;
}
div[id^="tile-"] .toc:not(#bottom-area):not(.posts-list-middle-widget):not(#bottom-area):not(.posts-list-under-widget):hover {
 box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
/*記事一覧の日付*/
.meta, .post .meta {
    border-top: 0px;
    padding-top: 13px;
    padding-right: 13px;
    padding-bottom: 0px;
    padding-left: 13px;
    color: #505454;
    font-weight: bolder;
}
/*記事一覧タイトル*/
div[id^="tile-"] h2, div[id^="card-"] h2 {
    color: #505454;
    font-weight: bolder;
    padding-top: 3px;
    padding-right: 13px;
    padding-bottom: 25px;
    padding-left: 13px;
    margin: 0px;
    font-size: 18px;
}
@media only screen and (max-width:575px){
div[id^="tile-"] h2, div[id^="card-"] h2 {
    font-size: 17px;
}}
.entry-title a {
    display: block;
}
/*記事一覧の日付*/
.meta, .post .meta {
    border-top: 0px;
    padding-top: 13px;
    padding-right: 13px;
    padding-bottom: 0px;
    padding-left: 13px;
    color: #505454;
    font-weight: bolder;
}
/*記事一覧のカテゴリー*/
span.tags a {
    color: #fff; /*←文字の色変更できます*/
    font-weight: bold;
    text-decoration: none;
}
span.tags a:hover {
    color: #dc143c;
}
#list span.category {
    text-align: center;
    position: absolute;
    top: 13px;
    left: 13px;
    height: 22px;
    border-radius: 14px;
    background: #20a39e; /*←背景色変更できます*/
    font-size: 11px;
    padding: 0 10px;
    line-height: 22px;
    vertical-align: middle;
    transition: .3s;
    color: #fff;
}
#list span.category a{
    color: #fff;
    font-weight: bold;
    text-decoration: none;
}
#list .fa-folder:before {
    content: none;
}
#list span.category:hover {
    background-color:#f9a730; /*←マウスを近づけた時の色変更できます*/
}
/*記事一覧アイキャッチサイズ*/
#list .term img {
    margin-bottom: 0px;
    border-radius: 2px 2px 0px 0px;
    padding: 0px;
}
#list div[id^="tile-"] .term img, #list div[id^="card-"] .term img {
    max-width: 575px;
    width: 100%;
}
/*記事一覧ボックス形状*/
div[id^="tile-"] 
.toc:not(#bottom-area):not(.posts-list-middle-widget):not(#bottom-area):not(.posts-list-under-widget) {
    padding: 0px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .13);
    border: none;
    transition: .3s;
}
div[id^="tile-"] .toc:not(#bottom-area):not(.posts-list-middle-widget):not(#bottom-area):not(.posts-list-under-widget):hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    transform: translateY(-5px);
}
/*記事一覧の日付余白*/
div[id^=tile-] .meta {
    margin-bottom: 5px;
}
/*カレンダーアイコン*/
.fa-calendar:before {
    content: "\f017";
    font-size: 115%;
}


/* グローバルナビアニメーション */
#gnavi li a:after {
	content: '';
	width: 0;
	transition: all 0.3s ease;
	border-bottom: 3px solid #fff;
	display: block;
}
#gnavi li a:hover:after {
	width: 100%;
	border-bottom: 3px solid #f9a730;
}
#gnavi li:hover a span {
    border: 0;
}

/* 一覧スマホ用 */
@media screen and (max-width:575px){
#list section {
    display: table;
}}
@media screen and (max-width:575px){
#list figure.term {
    display: table-cell;
    vertical-align: top;
}}
@media screen and (max-width: 575px){
div[id^=tile-] h2, div[id^=card-] h2 {
    font-size: 15px;
    display: table-cell;
    vertical-align: middle;
    padding-left: 2%;
}}
@media screen and (max-width: 575px){
#list span.category {
    top: 15px;
    left: 10px;
    height: 16px;
    border-radius: 0px;
    font-size: 10px;
    padding: 0 5px;
    line-height: 16px;
}}
@media screen and (max-width: 575px){
#list div[id^=tile-] .term img {
    width: 170px;
    height: 130px;
    object-fit: cover;
    margin: 0;
    padding: 15px 0 15px 10px
}}
@media screen and (max-width: 575px){
div[id^=tile-] .meta {
    margin: 0;
    padding: 0;
    font-size: 14px;
}}
@media screen and (max-width: 575px){
#list .toc {
    margin: 0 0 15px;
}}
@media screen and (max-width: 575px){
#list span.date {
    position: absolute;
    bottom: 3px;
    right: 8px;
}}
@media screen and (max-width: 575px){
#list .meta i:first-child {
    position: absolute;
    bottom: 6px;
    right: 86px;
}}
@media screen and (max-width: 575px){
#list i.fa.fa-tags, #list span.tags, #list i.fa.fa-folder {
    display: none;
}}