@charset "UTF-8";

/*!
Theme Name: Simplicity2 child
Template:   simplicity2
Version:    20161002
*/

/* Simplicity子テーマ用のスタイルを書く */

#navi ul {
    position: relative;
    clear: both;
    border: 0px solid #ddd;
    background-color: #f7f7f700;
    border-radius: 7px;
    margin: 3px 0 -12px 0px;
    padding: 0px;
    width: 100%;
    box-sizing: border-box;
}

#main {
	border: 0px solid #ddd;
    border-radius: 7px;
	padding: -1px 29px;
}


#site-description {
    color: #7770;
}

/*---------------------------------
見出し
--------------------------------*/
.article h2 {
    position: relative;
    padding: 0.5em 0.75em;
    background-color: #5e810a;
    color: #fff;
    border-radius: 6px;
    border-left: none;
	margin: -3px 1px 20px;
}
.article h2::after {
	position: absolute;
	top: 100%;
	left: 30px;
	content: '';
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-top: 15px solid #5e810a;
}

.article h3,
#comment-area h3,
#related-entries h3{
	font-size:23px;
	border-bottom: 3px solid #5e810a;
}
 
.article h4 {
	border-left: 15px solid #b5ce94;
	border-bottom: 0px;
	padding: 5px 0 5px 10px;
	margin-bottom: 30px;
}

/*---------------------------------
グローバルナビホバー
--------------------------------*/
#navi ul li a:hover {
    border-radius: 9px;
	background-color: #dddddd87;
}

#navi ul li a {
padding: 1.3em 1.7em;
}

#navi-in{
    display: flex;
    justify-content: center;
}


/*---------------------------------
メインの背景透明化
--------------------------------*/
#main {
    background-color: #ffffffd4;
}
/*---------------------------------
記事を読むボタン右側
--------------------------------*/
.entry-read {
  text-align: right;
  margin-right: 10px; /* ここはお好みで */
}
.related-entry-read {
  text-align: right;
  margin-right: 10px; /* ここはお好みで */
}
/*---------------------------------
サイドバータイトル
--------------------------------*/
#sidebar h3 {
    margin-bottom: 10px;
    font-size: 20px;
    padding: 1px 8px 2px;
    border-left: solid 7px #5d761a;
    border-bottom: dotted 2px #5d761a;
}
/*---------------------------------
wordpress popular posts サムネイル丸
--------------------------------*/
.wpp-thumbnail {
    border-radius: 37px;
}

/* コメント欄の項目を非表示 */
.comment-form-email {display: none;}
.comment-form-url {display: none;}
.form-allowed-tags {display: none;}

p.comment-subscription-form{
display:none;
}
#email-notes{
display:none;
}
/*---------------------------------
関連記事 サムネイル丸
--------------------------------*/
.related-entry-thumb img {
    border-radius: 50px;
}
/*---------------------------------
エントリーラージサムネイル角丸影
--------------------------------*/
.entry-large-thumnail {
    width: 100%;
    height: auto;
    border-radius: 7px;
    box-shadow: 1px 1px 4px 0px #b1acac;
}
/*---------------------------------
profile画像のボーダーラインの設定
--------------------------------*/
img.aligncenter.wp-image-74.size-thumbnail {
    border: solid 1px #ffffff;
    padding: 8px;
}
/*---------------------------------
お問合せフォーム　確認画面・送信後
--------------------------------*/
.wpcf7c-conf {
    background-color: #e5fdf4 !important;
    color: black !important;
    border: 1px solid #cccccc !important;
}

div.wpcf7-mail-sent-ok {
    border: 1px solid #cccccc !important;
}

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {
    border: 1px solid #f70000 !important;
}

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
    margin: -5px 0px -9px 13px !important;
    padding: 10px 29px !important;
}
/*---------------------------------
タイトルh2　画像挿入
--------------------------------*/
h2 a.entry-title:before {
font-size: 26px;
    margin-right: 0px;
    margin-bottom: -20px;
    margin-top: -33px;
    padding-top: 0px;
    content: "";
    display: inline-block;
    width: 3.5em;
    height: 4em;
    background: url(https://cocoiro.site/wp-content/uploads/2018/03/h1_illa.png);
}
.entry h2 {
    margin-bottom: 16px;
    margin-top: -24px;
}

/*---------------------------------
トップページナビ下のウィジェット調整&スマホの設定も
--------------------------------*/


@media screen and (max-width: 400px) {

div.top-page-under-globalmenu-widget.widget_mobile_text {
	margin: 10px;
}}


/*---------------------------------
固定ページの日付・更新日を非表示にする　28、105、2、26、179、2414、2358
--------------------------------*/

#post-28 .post-meta,#post-28 .post-meta,#post-28 .post-meta,#post-28 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */　

#post-105 .post-meta,#post-105 .post-meta,#post-105 .post-meta,#post-105 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-2 .post-meta,#post-2 .post-meta,#post-2 .post-meta,#post-2 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-26 .post-meta,#post-26 .post-meta,#post-26 .post-meta,#post-26 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-179 .post-meta,#post-179 .post-meta,#post-179 .post-meta,#post-179 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-452 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-474 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-523 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-637 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */
#post-661 .post-meta,#post-339 .post-meta,#post-339 .post-meta,#post-339 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */

#post-1148 .post-meta,#post-1148 .post-meta,#post-1148 .post-meta,#post-1148 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */
#post-2414 .post-meta,#post-2414 .post-meta,#post-2414 .post-meta,#post-2414 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */　

#post-2358 .post-meta,#post-2358 .post-meta,#post-2358 .post-meta,#post-2358 .post-meta{ 
 display: none; 
} /* ●●には記事IDを入れる */　

/*******************************
* post-xx の指定固定ページ記事タイトル非表示
********************************/

#post-179
.entry-title {
  display:none;
}
#post-452
.entry-title {
  display:none;
}
#post-105
.entry-title {
  display:none;
}
#post-2
.entry-title {
  display:none;
}
#post-474
.entry-title {
  display:none;
}

#post-26
.entry-title {
  display:none;
}

#post-28
.entry-title {
  display:none;
}

#post-523
.entry-title {
  display:none;
}
#post-637
.entry-title {
  display:none;
}
#post-661
.entry-title {
  display:none;
}
#post-1148
.entry-title {
  display:none;
}
#post-2414
.entry-title {
  display:none;
}
#post-2358
.entry-title {
  display:none;
}
#post-179
.entry-title {
  display:none;
}
/*---------------------------------
固定ページのウィジェットを非表示にする　26、28
--------------------------------*/

#post-●● .classic-text-widget{
  display: none;
}


/*---------------------------------
固定ページ上のウィジェット調整&スマホの設定も
--------------------------------*/
div.widget-over-page-article.classic-textwidget{
    border: 2px solid #dddddd;
    border-radius: 7px;
    margin-bottom: 7px;
    background-color: #ffffffd1;
background-image: url(https://cocoiro.site/wp-content/uploads/2018/03/11ccc8972eda42ff17c68620770df7a3-e1470254140832-320x196.jpg);
    background-repeat: no-repeat;
background-position: -10px -21px;
    padding-left: 260px;
}

@media screen and (max-width: 400px) {

div.widget-over-page-article.classic-textwidget{
background-position: 190px -21px;
 padding-left: 8px;
}
}

/* ------------------------------------------------------------
診断ジェネレーター作成プラグイン用style
------------------------------------------------------------*/
.diagnosis-wrap .question{
margin-bottom:1.5em;
}
.diagnosis-wrap .question .qcontents{
margin-bottom:.5em;
font-weight:bold;
}
.diagnosis-wrap .question .qselect span{
display:block;
}
.diagnosis-wrap .question .qselect span input{
margin:0 5px;
}
.diagnosis-wrap .submit input{
padding:1em;
width:300px;
max-width:80%;
margin-bottom:1em;
}


#diagnosis-form.diagnosis-result h3{
  animation: headline 8s cubic-bezier(.4, 0, .2, 1) infinite alternate;
  background: linear-gradient(to right top, #9c27b0, #c21fa0, #de268f, #f23a7e, #ff536f);
  border-radius: 2px;
  color: #fff;
  font-size: 24px;
	line-height: 11px;
	padding: 25px 24px;
	border-bottom: 1px solid #5e810a00;
}

@keyframes headline {
  100% {
    filter: hue-rotate(360deg);
  }
}
/* ------------------------------------------------------------
awesomeの色設定
------------------------------------------------------------*/
.my-gray {color: gray}
.my-skyblue {color: skyblue}
.my-orange {color: #fecb81}
.my-red {color : #ff0000}
.my-bule {color : #0000ff}
.my-green {color : #008000}

/*************************************************************************************************************************
 引用
*************************************************************************************************************************/
blockquote{
    background: none;
    margin: 0px;
    margin-top: 100px;
padding: 10px 25px 10px 25px;
    border: 2px solid #5c751a;
    border-radius: 10px;
    position: relative;
    z-index: 0;
}

blockquote:before{
    line-height: inherit;
    font-family: inherit;
	content: 'Key';
    color: #FFF;
    font-size: 20px;
    position: absolute;
    top: -37px;
    left: 20px;
    display: inline-block;
    padding: 5px 20px;
    background-color: #5c751a;
    border-radius: 10px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

blockquote:after{
    content: '';
    position: absolute;
    top: -84px;
    left: auto;
    right: -10px;
    display: inline-block;
    width: 130px;
    height:85px;
    background-image: url(https://cocoiro.site/wp-content/uploads/2018/07/key.png);
    background-repeat: no-repeat;
    z-index: 99;
}
/*ホバーボタン*/
.btn04 {
    background-color: #ffca34;
    border: 2px solid #ffca34;
    color: #fff !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.btn04:hover {
    background-color: transparent;
    border: 2px solid #ffca34!important;
    color: #ffca34 !important;

}

.btn12 {
    background: transparent;
    color: #999999 !important;
    -webkit-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    background: -webkit-linear-gradient(180deg, rgba(49,105,209,0.8), rgba(132, 179, 252, 0.8), rgba(205, 200, 252, 0), rgba(205, 200, 252, 0));
    background: -webkit-linear-gradient(right, rgba(49,105,209,0.8), rgba(132, 179, 252, 0.8), rgba(205, 200, 252, 0), rgba(205, 200, 252, 0));
    background: linear-gradient(270deg, rgba(209, 167, 49, 0.8), rgba(252, 226, 132, 0.8), rgba(205, 200, 252, 0), rgba(205, 200, 252, 0));
    background-position: 1% 50%;
    background-size: 300% 300%;
    border: none;
    border: 1px solid #999999;
}
.btn12:hover {
    background-position: 99% 50%;
    color: #fff !important;
    border: 1px solid rgba(205, 200, 252, 0)!important;
}

/*線*/
.border01 {
	border-image: linear-gradient(to right, #e91e63, #ffcdff, #cd96eb, #9662b3) 1/0 0 3px 0;
  border-style: solid;
}

#navi ul.sub-menu, #navi ul.children {
    margin-left: 5px;
	margin-top: 0px;
	min-height: 150px;
	min-width: 250px;
    border: 1px solid #b5b5b5;
    background-color: #ffffffab;
}
#navi .sub-menu li, #navi .children li {
    height: 60px;
}

@media screen and (max-width: 400px) {
	
	#navi ul.sub-menu, #navi ul.children {
		margin-left: 20px;
		margin-bottom: 5px;
			min-height:100px;
			min-width: 180px;
		border: 1px solid #b5b5b5;
    background-color: #ffffffab;
}
#navi .sub-menu li, #navi .children li {
	height: 30px;
	padding-left: 5px;
}

}


/*グローバルメニュー三角*/
.menu-item-31 > a:after {
  content: '\f0d7';
  display: inline-block;
  font: 16px/1 FontAwesome;
  margin-left: 8px;
}

/*メニューページリストデザイン*/

.post-523 ul {
	border: solid 1px #808080;
  padding: 0 0.5em;
  position: relative;
}

.post-523 ul li {
  line-height: 1.5;
  padding: 0.5em 0 0.5em 1.4em;
  border-bottom: dashed 1px silver;
  list-style-type: none!important;
}

.post-523 ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f35a";/*アイコン種類*/
  position: absolute;
  left : 0.5em; /*左端からのアイコンまで*/
  color: #808080; /*アイコン色*/
}

.post-523 ul li:last-of-type{
  border-bottom: none;
}

@media screen and (max-width: 400px) {
.wp-image-441{
	width: 200px;
}
}

/*---------------------------------
スマホのヘッダー画像マージン調整
--------------------------------*/

@media screen and (max-width: 480px) {

#h-top {
	min-height: 270px;
}
}

.article h5 {
    background: #8cdac4;
	    color: #fff;
}

#site-title, #site-description {
display: none;
}