@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

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

/************************************
** 見出しのデザインリセット
************************************/

/* H2 */
.article h2{
background:none;　/* 背景色をリセット */
padding: 0;
  position: relative;
  padding: 0.5em;
  background: #a6d3c8;
  color: white;
}

.article h2::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0;
  border: none;
  border-bottom: solid 15px transparent;
  border-right: solid 20px rgb(149, 158, 155);
}

/* H3 */
.article h3{
border:none;　/* 枠線をリセット */
padding: 0;
  position: relative;
  padding: 0.6em;
  background: #A6D3C8;
}

.article h3:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #A6D3C8;
  width: 0;
  height: 0;
}

/* H4 */
.article h4{
border:none;
padding: 0;
  position: relative;
  color: #333;
  text-shadow: 0 0 2px white;
}
.article h4:before {
  content: "";
  position: absolute;
  background: #A6D3C8;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  top: 50%;
  /* border: dashed 1px white; */
  left: -15px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: -1;
}

/* H5 */
.article h5{
border:none;
padding: 0;
  position: relative;
  padding: 8px 15px;
  margin-left: 40px;
  background: #A6D3C8;
  border-radius: 20px;
}

.article h5:before {
  font-family: "Font Awesome 5 Free";
  content: "\f111";
  font-weight: 900;
  position: absolute;
  font-size: 15px;
  left: -40px;
  bottom: 0;
  color: #A6D3C8;
}

.article h5:after {
  font-family: "Font Awesome 5 Free";
  content: "\f111";
  font-weight: 900;
  position: absolute;
  font-size: 23px;
  left: -23px;
  bottom: 0;
  color: #A6D3C8;
}

/* H6 */
.article h6{
border:none;
padding: 0;
}

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

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

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

/************************************
** ボタンのカスタマイズ
************************************/

/* −−ボタンを浮かして影をつける−−*/
 .btn{
 box-shadow: 0 7px 0px #808080;
 }
/*−−−ボタンが重なったときに沈む−−−*/
 .btn:hover{
 box-shadow: 0 1px 0 #808080 ;
 transform: translateY(6px);
 -webkit-transform: translateY(6px);
 }
/*−−−カーソルを外したときに元に戻す−−−*/
 .btn{
 transition:.5s ease-in-out;
 }

/************************************
** ページ指定＋背景画像を変更
************************************/

/* セルフセラピー１・２　体験版　7STEPメール講座受講者 */
body.page-id-174 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　体験版　ココ灯メルマガ */
body.page-id-644 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　体験版　LINE */
body.page-id-681 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　体験版　FB */
body.page-id-635 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　体験版　HP */
body.page-id-665 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　製品版　30％OFF */
body.page-id-564 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　製品版　15％OFF */
body.page-id-566 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/* セルフセラピー１・２　製品版　List Price */
body.page-id-165 {
	background-image: url(https://lp.kokoro-tomosu.com/wp-content/uploads/2021/06/bg.jpg);
/* 背景画像の表示を指定 */
	background-position: center center;
/* フルスクリーン */
	background-size: cover;
}

/************************************
** モバイルフッターメニューを消す
************************************/
.mobile-footer-menu-buttons{
  display: none;
}

/************************************
** FAQブロック
************************************/
.article dd {
    margin-left: 0;
}
.faq_block .faq_q::before,
.faq_block .faq_a::before {
    color: #fff;
    box-shadow: none;
    border-radius: 50%;
    position: absolute;
    top: .75em;
    left: 0;
    display: block;
    width: 2em;
    line-height: 2;
    text-align: center;
    font-family: Arial,sans-serif;
}
.faq_block .faq_q::before {
    font-weight: 400;
    content: "Q";
    background-color: #d55656;
}
.faq_block .faq_a::before {
    content: "A";
    background-color: #6599b7;
}
.faq_block .faq_q,
.faq_block .faq_a {
    position: relative;
    padding: 0.75em 1em 1em 3em;
    line-height: 1.8;
}
.faq_block .faq_q {
    font-weight: 700;
}
.faq_block .faq_a:not(:last-child) {
    margin-bottom: 1em;
    padding-bottom: 2em;
    border-bottom: solid 1px rgba(200,200,200,.5);
}
.faq_block .faq_q {
    font-weight: 700;
}