@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    0.0.5
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

header, #header, #h-top, .top-title-catchphrase {background:none;}

#header {
width: 100%;
    background-image: url("https://atstory.net/wp-content/uploads/201809atstory_top.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 0;
    padding: 0 0 28.03738%;
    overflow: hidden;
    margin-bottom: 0px;
}

@media screen and (max-width: 640px) {
#header-in .top-title-catchphrase {padding:1px 2px 5px 2px;}
}

/* 全体のフォントサイズ */
/* フォント設定　通常フォント（ヒラギノ、メイリオ、または游ゴシック）で表示 */
body, #main {font-family:"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-size:100.0%;background-color:#fefefe;}
span.site-name-text::before {content:"\f1ec  ";font-family:"FontAwesome";}
a.site-name-text-link:hover {text-decoration:underline;}
/*  */
/* sns_btn, モバイルのヘッダーメニュー */
.sns-buttons a, .slicknav_menu {background-color: #3f7c9d;}
.slicknav_btn {background-color: #144149;}

/* -- カテゴリの文字サイズ 2016/11/28 --*/
.widget_categories ul li a {font-size:0.9em;line-height:1.1em;}
.widget_categories ul li a img.wpp-thumbnail {width:50px;height:50px;}
/* ヘッダー タイトル */
div.tagline {display:inline-block;padding:5px 8px;color:#000;/* background-color: rgba(255,255,255,0.8); */}
.site-name-text {font-size: 32px;letter-spacing:0.1em;padding:10px 20px;color:#000;
/*	background-color: rgba(255,255,255,0.8); */
}
/* パンくずリスト */
.breadcrumb, .breadcrumb a {color: #144149;}

/* menu */
.navi-in > ul li {height: 40px;line-height: 30px;}
/* #navi ul li a {padding: .2em .2em;} */
#navi ul li a {font-size:13px;display: block;padding: .8em .8em;color:#111;text-decoration:none;z-index:99;}

.entry-content .top_fix2 {font-size:1.1em;line-height:1.4em;display:table;margin: 0px;padding: 8px 0px 8px 0px;width: 100%;border-spacing:1em 3px;border:#aaa 2px dotted;}
.entry-content .top_fix2 a {text-decoration:none;color:#400040;}
.entry-content .top_fix2 a:hover {text-decoration:underline;color:#800040;}
@media screen and (max-width: 640px) {
.entry-content div.top_fix2 {display: block;}
.entry-content div.top_fix2 {display: block;width: 100%;padding-left:8px;}
.entry-content div.top_fix2 {display: block;border:none;width: 100%;padding-left:8px;}
}

.main_top_tip{font-weight:bold;text-align:center;padding:10px 0;background-color:#f5f8fa;}
.main_top_tip::before{font-family: FontAwesome;content: '\f0ce  ';}

/* カテゴリタグ */
.cat-label, .cat-link {background-color: rgba(20, 65, 73, 0.8);}
.tag-link {color: #144149;border: 1px solid #144149;}
/* 日付などのmetaの背景無 */
.post-meta {background:transparent;}

/* -- h1 -- */
.article h1 {margin-top:26px;margin-bottom:30px;padding-bottom:8px;font-size: 26px;line-height:117%;border-bottom:2px dotted #888;}
.article h1::before {content:'\f02e';font-family:"FontAwesome";padding-right:10px;}
/* -- h2 -- */
.article h2 {border-left:0px solid #888;border-bottom:2px dotted #144149;position: relative;color: #111;font-size: 26px;line-height: 1;margin: 40px 10px 10px 5px;padding: 14px 5px 10px 15px;background-color:transparent;}
.article h2:before {content: "";position: absolute;background: #3f7c9d;top: 0;left: -5px;height: 12px;width: 12px;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);}
.article h2:after {content: "";position: absolute;background:#97cfca;top: 15px;left: -10px;height: 8px;width: 8px;
-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg);
-o-transform: rotate(15deg);
-ms-transform: rotate(15deg);
transform: rotate(15deg);}
.article h3, #comment-area h3, #related-entries h3 {font-size:18px;border-bottom:0px solid #e7e7e7;padding:0px 0px 0px 10px;}
.article h3 {border:0;position:relative;padding-left:10px;border-bottom:2px solid #ccc;font-weight: bold;font-size: 20px;line-height: 38px;width:98%;}
.article h3:before {content:'\f1ec';font-family:"FontAwesome";padding-right:10px;}

.article h4, #comment-area h4, #related-entries h4 {font-size:18px;border-bottom:0px solid #e7e7e7;padding:0px 0px 0px 18px;}
.article h4 {position:relative;padding-left:22px;border-bottom:2px dotted #ccc;font-weight: bold;font-size: 20px;line-height: 28px;}
.article h4:before {content:'\f044';font-family:"FontAwesome";padding-right:10px;}

.article h5, #comment-area h5, #related-entries h5 {font-size:15px;border-bottom:0px solid #e7e7e7;padding:0px 0px 0px 18px;}
.article h5 {position:relative;padding-left:20px;border-bottom:1px solid #ccc;font-weight: bold;font-size: 18px;line-height: 20px;}
.article h5:before {content:'\f05d ';font-family:"FontAwesome";padding-right:10px;}

/* -- hr -- */
hr.line-gr {
border: 0;height: 1px;
background-image: -webkit-linear-gradient(left, rgba(155,155,155,0), rgba(155,155,155,0.75), rgba(155,155,155,0));
background-image:    -moz-linear-gradient(left, rgba(155,155,155,0), rgba(155,155,155,0.75), rgba(155,155,155,0));
background-image:     -ms-linear-gradient(left, rgba(155,155,155,0), rgba(155,155,155,0.75), rgba(155,155,155,0));
background-image:      -o-linear-gradient(left, rgba(155,155,155,0), rgba(155,155,155,0.75), rgba(155,155,155,0));
}
/* */
.top_cont {border-spacing:0.1em 3px;border:#aaa 2px dotted;margin-bottom:5px;text-align:center;font-size:1.2em;font-weight:1.2em;padding:0px;width:100%;}
.top_fix {font-size:1.0em;display:table;margin: 0px;padding: 5px 0px 0px 5px;width: 100%;border-spacing:0.1em 3px;border:#aaa 2px dotted;}
.boxa {display:table-cell;width:48%;padding-right:2%;padding-left:2%;line-height:1.5em;}
.boxb {display:table-cell;width:48%;padding-right:2%;padding-left:2%;line-height:1.5em;}

.top_fix a {text-decoration:none;color:#400040;}
.top_fix a:hover {text-decoration:underline;color:#800040;}

div.top_fix a.linkfa:before {font-family: FontAwesome;content: "\f114";position: absolute;background: #c9e2ff;color: #153c6e;font-size: 10px;font-weight:bold;border-radius: 50%;left: 0;width: 20px;height: 20px;line-height: 20px;text-align: center;top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);}

div.top_fix a.linkfa {position: relative;line-height: 22px;padding-left: 25px;color:#153c6e;}

div.top_fix a.linkfa2:before {font-family: FontAwesome;content: "\f1ec";position: absolute;background: #578ED5;color: #fff;font-size: 14px;font-weight: normal;border-radius: 50%;left: 0;width: 24px;height: 24px;line-height: 24px;text-align: center;top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);}

div.top_fix a.linkfa2 {position: relative;line-height: 22px;padding-left: 28px;color:#153c6e;font-weight:bold;}

.tagarc1 {border-bottom: dotted 2px gray;padding-top:15px;margin-bottom:8px;}
.tagarc1:before{padding-top:15px;margin-bottom:8px;}

/* LRS家計チェック */
.lrslnk{position: relative;color: black;font-size:1.2em;background: #efefef;line-height: 1.2;padding: 0.2em 0.2em;margin: 1em 0 0.5em;border-radius: 0 5px 5px 5px;}
.lrslnk a {text-decoration:none;color:#222;}
.lrslnk:before{color: black;font-family: FontAwesome;content: '\f0ce  ';}
.lrslnk:after {/*タブ*/
position: absolute;font-family: FontAwesome,'Quicksand','Avenir','Arial',sans-serif;content: '\f00c Check';background: #578ED5;color: #fff;left: 0px;bottom: 100%;border-radius: 5px 5px 0 0;padding: 3px 7px 1px;font-size: 0.6em;line-height: 1;letter-spacing: 0.05em}

/* tags01:bf */
div.top_fix div.boxa div.tags01:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags01 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags01:before{ font-family: FontAwesome;
content: "\f0d6";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags02:bf */
div.top_fix div.boxa div.tags02:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags02 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags02:before{ font-family: FontAwesome;
content: "\f022";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags03:bf */
div.top_fix div.boxa div.tags03:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags03 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags03:before{ font-family: FontAwesome;
content: "\f02d";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags04:bf */
div.top_fix div.boxb div.tags04:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxb div.tags04 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxb div.tags04:before{ font-family: FontAwesome;
content: "\f080";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags05:bf */
div.top_fix div.boxa div.tags05:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags05 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags05:before{ font-family: FontAwesome;
content: "\f201";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

div.top_fix div.boxb h2:before{display:none;}
div.top_fix div.boxb h2:after{display:none;}

/* tags06:bf */
div.top_fix div.boxb div.tags06:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxb div.tags06 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxb div.tags06:before{ font-family: FontAwesome;
content: "\f015";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags07:bf */
div.top_fix div.boxa div.tags07:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags07 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags07:before{ font-family: FontAwesome;
content: "\f0ed";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags08:bf */
div.top_fix div.boxa div.tags08:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxa div.tags08 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxa div.tags08:before{ font-family: FontAwesome;
content: "\f07a";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags09:bf */
div.top_fix div.boxb div.tags09:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxb div.tags09 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxb div.tags09:before{ font-family: FontAwesome;
content: "\f1ae";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

/* tags10:bf */
div.top_fix div.boxb div.tags10:first-letter {font-size: 1.2em;color: #008;font-weight:normal;}
div.top_fix div.boxb div.tags10 {position: relative;padding-left: 1.4em;line-height: 1.2;}
div.top_fix div.boxb div.tags10:before{ font-family: FontAwesome;
content: "\f005";position: absolute;font-size: 1.2em;left: 0;top: 0;color: #008;}

@media screen and (max-width: 640px) {
div.top_fix {display: block;margin: 0px;width: 95%;}
div.top_fix div.boxa {display: block;width: 97%;padding-left:2%;padding-right:1%;}
div.top_fix div.boxb {display: block;border:none;width: 97%;padding-left:2%;padding-right:1%;}
}

/* トップページのベスト５ */
#wpp-7 {padding:10px;border:#ddd solid 1px;}
#wpp-7 .widget-index-top-title {font-size:1.2em;text-align:center;border-bottom: double 3px #888;color:#000;}
#wpp-7 .widget-index-top-title:before {content:"\f004  ";font-family:"FontAwesome";}
ol.top-wpp-list li {padding:3px 0px 3px 0px;border-bottom:#888 dotted 2px;}
ol.top-wpp-list li a {text-decoration:none;color:#333;}
ol.top-wpp-list li a:after {content:"\f1ea  \f0a9";font-family:"FontAwesome";}
/* */

/* 投稿ページのtoc */
.toc {padding:8px 18px;border: 3px double #ccc;line-height: 1.8;background-color:#f9fbfd;display: block;}
/*目次*/
/*h3以下の下側ボーダー*/
.toc ul li a, .toc ol li a {display: block;border-bottom: 1px dashed #ccc;margin-left: -20px;padding-left: 20px;}
.toc ul.toc-list>li, .toc ol.toc-list>li {margin-top: 1em;}
/*h2の下側ボーダー*/
.toc ul.toc-list>li>a, .toc ol.toc-list>li>a {border-bottom: 1px solid #ccc;}

/* -- 今までの人気TOP10記事 -- */
#recent-posts-2 li {font-size:0.9em;}

/* -- プチ引用 -- */
.puchi01{margin-left:10px;padding-left:10px;font-size:0.85em;border-left:#ccc 2px solid;line-height:1.4em;}

/* あわせて読みたい記事 */
.yomitai{position: relative;color: black;font-size:1.2em;background: #fff0f0;line-height: 1.4;padding: 0.6em 0.5em;margin: 2em 0 0.5em;border-radius: 0 5px 5px 5px;}
.yomitai:before{color: black;font-family: FontAwesome;content: '\f1ea  ';}
.yomitai:after {/*タブ*/
position: absolute;font-family: FontAwesome,'Quicksand','Avenir','Arial',sans-serif;content: '\f00c Check';background: #ff8000;color: #fff;left: 0px;bottom: 100%;border-radius: 5px 5px 0 0;padding: 3px 7px 1px;font-size: 0.7em;line-height: 1;letter-spacing: 0.05em}

/* あわせて読みたい記事2 */
.yomitai2{position: relative;color: black;font-size:1.2em;background: #fff0f0;line-height: 1.4;padding: 0.6em 0.5em;margin: 2em 0 0.5em;border-radius: 0 5px 5px 5px;}
.yomitai2:after {/*タブ*/
position: absolute;font-family: FontAwesome,'Quicksand','Avenir','Arial',sans-serif;content: '\f00c Check';background: #ff8000;color: #fff;left: 0px;bottom: 100%;border-radius: 5px 5px 0 0;padding: 3px 7px 1px;font-size: 0.7em;line-height: 1;letter-spacing: 0.05em}

/* サイドバーのカテゴリ体裁 */
.widget_categories ul li a {display:block;}
.widget_categories ul li a .post-count {display:inline-block;float:none;}
.widget_categories ul li a .post-count::before {content:"\00a0\00a0(";}
.widget_categories ul li a .post-count::after {content:")";}
/* side-cat */
#categories-2 ul li.cat-item a {color: #222;text-decoration: none;line-height:1.0em;}
.widget_categories ul li a {font-size: 0.8em;line-height: 1.0em;padding: 3px 0;}

/* -- サイドバーのタイトルアイコン-- */
.sidebar h3 {position: relative;padding-left:40px;color:#333;background-color:transparent;font-weight:normal;border-bottom: dotted 1px #444;line-height:2.0;padding: 5px 0px 5px 38px;margin: 5px 0;}
.sidebar h3::before { position: absolute;content:"\f1ec"; font-family:"FontAwesome";background: #144149;color: #fff;font-size: 18px;border-radius: 50%;left: 0;width: 30px;height: 30px;line-height: 30px;text-align: center;top: 50%;-moz-transform: translateY(-50%);-webkit-transform: translateY(-50%);-ms-transform: ranslateY(-50%);transform: translateY(-50%);}

/* サイドバーのカレンダー */
#wp-calendar td a {color: #333;background-color: #e6feeb;}
#wp-calendar td a:hover {background-color: #8ad5d8;}
#wp-calendar #today, #wp-calendar #today a {background-color: #8ad5d8;}
#wp-calendar {width:85%;text-align:right;}

/* トラコミュ体裁 */
.tc_ns {letter-spacing:-1px;line-height:154%;font-size:0.95em;padding-bottom:5px;}
.tc_ns a {color:#000;text-decoration:none;}
.tc_ns a:hover {color:#ff0000;text-decoration:underline;}
/* --- at_set_style_15/08 --- */
/* 応援して */
.entry-content {margin-bottom:30px;}

/* トラコミュ用 */
.trcm ul li {list-style-type:none;font-size:0.8em;line-height:1.2em;}
.trcm ul li a {text-decoration:none;color:#333;}
.trcm ul li a:before {content:"\f046  "; font-family:"FontAwesome";}
.prof1:before {content:"\f2bc  "; font-family:"FontAwesome";}

/* 過去1ヶ月の人気記事 */
#sidebar .wpp-list {font-size:0.8em;}
#sidebar .wpp-list li {padding:0px 0;margin:0px 0;line-height:1.5em;}
#sidebar .wpp-list li a:hover{color:#b70000;text-decoration:underline;}
#sidebar .wpp-list li a {color:#555;text-decoration:none;}

.search_box{max-width:300px;}
#cse-search-box {width: 252px !important;}

/* LRS家計記事一覧のスタイル */
.getPost {background: #fafafa;border-left:2px #999 solid;border-bottom:2px #ccc solid;}
.getPostStringArea {padding:0 10px;}
h3.getPostTitle a {text-decoration:none;color:#222;}
.getPostContent {font-size:0.9em;line-height:1.2em;}

/* */
ul > li > a.wpp-post-title{color:#333;text-decoration:none;}
#wpp-4 > ul > li > a:hover{color:#b70000;text-decoration:underline;}
#wpp-5 > ul > li > a:hover{color:#b70000;text-decoration:underline;}
.widget_recent_entries ul li a {font-size:0.9em;padding: 5px 0;margin:2px 0;border-bottom:1px dotted #888;}
/*  */

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px){
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
  /*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
		div.tagline {display:none;}
}