@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
*/

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

/************************************
****　FAQ　アコーディオン
************************************/
.is-style-accordion div.faq-question-label.faq-item-label{
color: #D55656;
font-size: 18px;
padding: 3px 8px;
margin-right: 0.4em;
border-radius: 10%;
font-weight: bold;
}
.is-style-accordion div.faq-answer-label.faq-item-label{
color: #6599B7;
font-size: 18px;
padding: 3px 8px;
border-radius: 10%;
font-weight: bold;
}
.is-style-accordion .faq-question {
background-color: #f0f0f0;
padding: 1em 2em 1em 1em;
margin: -25px 0px;
}
.is-style-accordion .faq-answer {
padding: 1em;
margin-top: 30px;
}
.is-style-accordion .faq-question-content.faq-item-content {
color: #337AB7;
}
.is-style-accordion .faq-question::before {
font-weight: 700;
}
@media screen and (max-width: 390px){
.is-style-accordion div.faq-question-label.faq-item-label{
margin-right: 0.3em;
}
.is-style-accordion .faq-question {
padding-left: .5em;
}}
.faq p,.faq .wp-block-image{
margin-bottom:0;
}


/************************************
****　FAQ　角型ラベル
************************************/
.is-style-square {
    background-color: #f7f7f7;/*背景色の変更はこちら*/
}
.is-style-square div.faq-question-label.faq-item-label{
    background-color: #D55656;
    font-size: 16px;
    padding: 3px 8px;
    border-radius: 10%;
    font-weight: bold;
}
.is-style-square div.faq-answer-label.faq-item-label{
    background-color: #6599B7;
    font-size: 16px;
    padding: 3px 8px;
    border-radius: 10%;
    font-weight: bold;


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

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

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