@charset "UTF-8";

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

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

/* ----------------------------------------------------------------------
全体
---------------------------------------------------------------------- */
html {
scroll-behavior: smooth;
}
.article h3 {
border: none;
}
.page .article h2 {
margin-bottom: 0;
}
a:hover img {
opacity:0.6;
filter:alpha(opacity=60);
-ms-filter: “alpha( opacity=60 )”;
}
.eng {
font-family: 'Mea Culpa', sans-serif;
}
.label-box-content {
border-width: 1px;
border-radius: initial;
}
table:not(.has-border-color) :where(th, td) {
padding: 15px;
}
.cat-link {
background-color: #fdb438;
}

/* ----------------------------------------------------------------------
サイトタイトル
---------------------------------------------------------------------- */
.logo-text {
padding: 0;
}
.site-name-text {
font-size: 32px;
letter-spacing: 0.05em;
}
@media screen and (max-width: 834px){
#header .site-name-text {
font-size: 26px;
}
}
.tagline {
letter-spacing: 0.18em;
font-size: 14px;
font-weight: bold;
margin-top: 0;
}

/* ----------------------------------------------------------------------
グローバルナビメニュー
---------------------------------------------------------------------- */
.navi-in a{
font-size:20px;
font-weight: bold;
}
.sub-menu .caption-wrap {
font-size:16px;
}
.sub-caption {
font-size: 0.6em;;
}
.slicknav_menu {
background: #f2d04b;
}
.slicknav_nav a {
color: #333;
}

/* ----------------------------------------------------------------------
カルーセル
---------------------------------------------------------------------- */
.carousel-in {
background-color: initial;
}
.cat-label {
background-color: rgba(253, 180, 56, 0.7);
}

/* ----------------------------------------------------------------------
吹き出し見出し
---------------------------------------------------------------------- */
.fukimida {
text-align: center;
background-color: #fff;
padding: 0.8em 1.4em;
margin: 40px 0;
border: 3px solid #333;
box-shadow: 3px 3px 0 0 #333;
position: relative;
}
.fukimida::before, .fukimida::after {
content: '';
height: 0;
width: 0;
border: solid transparent;
position: absolute;
left: 30px;
}
.fukimida::before {
border-color: transparent;
border-top-color: #333;
border-right-color: #333;
border-width: 10px;
top: 100%;
left: 26px;
}
.fukimida::after {
border-color: transparent;
border-top-color: #fff;
border-right-color: #fff;
border-width: 6.5px;
top: 99%;
}

/* ----------------------------------------------------------------------
ページタイトル
---------------------------------------------------------------------- */
.post > .article-header > h1.entry-title {
margin-top: 50px;
margin-bottom: 30px;
color: ;
font-size: 36px;
}
.main {
padding: 0px 10px;
}

/* ----------------------------------------------------------------------
Contact Form 7
---------------------------------------------------------------------- */
@media(max-width:500px){
.inquiry th,.inquiry td {
display:block!important;
width:100%!important;
border-top:none!important;
-webkit-box-sizing:border-box!important;
-moz-box-sizing:border-box!important;
box-sizing:border-box!important;
}
.inquiry tr:first-child th{
border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */	
.inquiry .haveto,.inquiry .any {	
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
text-align:left;
font-size:16px;
color:#333;
padding-right:5px;
width:30%;
background:#f7f7f7;
border:solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td{
font-size:13px;
border:solid 1px #d7d7d7;
background-color: #fff;
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{
font-size:7px;
padding:5px;
background:red;
color:#fff;
border-radius:2px;
margin-right:5px;
position:relative;
bottom:1px;
}
/*任意の調整*/
.any{
font-size:7px;
padding:5px;
background:blue;
color:#fff;
border-radius:2px;
margin-right:5px;
position:relative;
bottom:1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
display: block;
padding:1em 0;
margin-top:30px;
width:100%;
background:#ea6270;
color:#fff;
font-size:18px;
font-weight:bold;
border-radius:2px;
border: none;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
background:#F7B7C8;
color:#fff;
}
.siteContent_after {
display:none
}
table th, table td {
padding: 15px;
}

/* ----------------------------------------------------------------------
サイドバー
---------------------------------------------------------------------- */
#sidebar {
font-size: 13px;
}
.sidebar h3 {
background-color: #fff;
color: #333;
border-top: solid 1px #fdb438;
border-bottom: solid 1px #fdb438;
}

/* ----------------------------------------------------------------------
フッター
---------------------------------------------------------------------- */
.footer-title {
font-size: 20px;
font-weight: normal;
text-align: center;
letter-spacing: 2px;
margin-bottom: 12px;
}
#footer h4 {
text-align: center;
}
#footer p {
font-size: 14px;
text-align: center;
margin-bottom: 20px;
}

/* ----------------------------------------------------------------------
背景色最大横幅
---------------------------------------------------------------------- */
.back-full {
background: #f2d04b;
margin: 0 calc((100% - 100vw) / 2);
padding: 0 29px 1em;
}

.back-full > h2 {
margin: 0 calc((100% - 100vw) / 2);
padding: 25px calc((100vw - 1142px) / 2) 15px;
}

.back-full > p,
.back-full > div,
.back-full > h3 {
margin-left: auto;
margin-right: auto;
max-width: 1142px;
}

@media screen and (max-width: 1202px) {
.back-full > h2 {
padding: 25px calc((100vw - 100%) / 2) 15px;
}
}

@media screen and (max-width: 768px) {
.back-full {
padding: 0 10px 1em;
}
.back-full .column-wrap {
text-align: center;
}
}

@media screen and (max-width: 480px) {
.back-full > h2 {
padding: 10px calc((100vw - 100%) / 2) 8px;
}
}

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

/*1023px以下*/
@media screen and (max-width: 1023px){
.mobile-header-menu-buttons {
background-color: #111;
color: #fff;
}
}

/*834px以下*/
@media screen and (max-width: 834px){
.footer-widgets {
display: block;
}
}

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