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

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

/*　ページ全体　*/

body.public-page {
background: linear-gradient(0deg, rgba(142,237,0,1) 0%, rgba(255,255,255,0) 50px, rgba(255,255,255,0) 88%, rgba(142,237,0,0) 100%) , linear-gradient(
90deg, rgba(142,237,0,1) 0%, rgba(240,253,240,1) 5%, rgba(240,253,240,1) 95%, rgba(142,237,0,1) 100%);
}

.main {
background: rgba(255,255,255,0);
width: 560px;
}

.content-in {
padding-left: 2%;
padding-right: 2%;
}

#sidebar {
background: rgba(255,255,255,0);
}

#header-container {
background-color: #d1ed77;
}

/*　グローバルナビ 　*/

#header-container-in , #navi #navi-in .sub-menu {
background-image: url(https://new.acua123.com/wp-content/uploads/2021/08/IMG_6438.jpg);
background-repeat: no-repeat;
background-size: cover;
}


#header-container #navi , #navi #navi-in .sub-menu {
box-shadow: 0px 1px 8px 0px #999 , 0px -3px 8px 0px #fefefe inset;
background-color: rgba(228,237,213,.35);
}

#navi .navi-in a:hover {
color: #8eed00;
background-color: transparent;
}

.navi-in > ul li:last-of-type:after {
content: none;
}

.navi-in a {
font-size: 15px;
}

#navi .navi-in>ul>li>a {
padding: 0 1.6rem;
}

/*　フッターナビ 　*/

.navi-footer-in > .menu-footer li {
border-left: none;
}

.footer-bottom.fnm-text-width .menu-footer li a {
padding: 10px 15px;
}

.footer-bottom.fnm-text-width .menu-footer li {
position: relative;
}

#footer .footer-bottom .menu-footer li a:hover {
color: #8eed00;
}

.footer-bottom.fnm-text-width .menu-footer li:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 0;
border-right: #2e4d00 2px solid;
-webkit-transform: skewX(150deg);
-moz-transform: skewX(150deg);
transform: skewX(150deg);
height: 45%;
margin: auto;
}

.footer-bottom.fnm-text-width .menu-footer li:last-of-type:before {
content: none;
}

.navi-footer-in > .menu-footer li:last-child {
border-right: none;
}

.navi-footer-in a {
font-size: .8rem;
} 

/*　サイトタイトル　*/

.site-name-text , .merriweather {
font-family: 'Merriweather', serif;
font-size: 45px;
}

#header .site-name-text {
color: #8eed00;
text-shadow: 2px 2px 2px #5200cc, 5px 3px 3px #d1ed77;
}
}

.tagline {
font-family: 'Merriweather', serif;
color: #3a3a3a;
font-size: 16px;
}

/*　パンくずリスト　*/

.aioseo-breadcrumb-widget {
margin: 1em .4em;
color: #555;
font-size: 13px;
}

.aioseo-breadcrumb-widget a {
color: #555;
text-decoration: none;
}

.aioseo-breadcrumb-separator {
color: #111;
font-size: 17px;
font-weight: 700;
}

.aioseo-breadcrumb {
margin: 1em .4em;
}

/*　スライダー　*/

#metaslider_container_127 {
margin-top: 50px;
}

.caption-wrap .caption {
font-size: 17px;
text-align: center;
}

.flexslider .flex-control-paging li a.flex-active {
background: #00c44f;
}

.metaslider div.caption-wrap {
background: #2e4d00;
}

/*　トップページカラム　*/

.front-top-page .ect-big-card-first .a-wrap:first-of-type .card-thumb, .ect-big-card .card-thumb {
width: 85%;
margin: 0 auto;
}

.front-top-page .ect-big-card-first .a-wrap:first-of-type .card-content, .ect-big-card .card-content {
text-align: center;
}

.ect-big-card-first .entry-card-wrap {
width: 49.5%;
display: inline-block;
margin-bottom: 12px;
}

.ect-big-card-first .entry-card-wrap:first-of-type {
width: 100%;
}

.ect-big-card-first {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.ect-big-card-first .entry-card-wrap .entry-card-thumb {
width: 100%;
float: none;
}

.ect-big-card-first .entry-card-wrap .entry-card-content {
margin: 0;
}

.ect-vertical-card .entry-card-wrap

.front-top-page .a-wrap:first-of-type .card-thumb {
float: none;
width: 100%;
}

.ect-vertical-card .entry-card-wrap {
width: 49.5%;
display: inline-block;
margin-bottom: 12px;
}

/*　カラム　*/

.list-title-in {
font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
text-shadow: 1px 1px 2px #8eed00;
font-size: 1.55rem;
margin: 2rem 0 1rem 0;
color: #333;
}

.list-title-in:before, .list-title-in:after {
background-color: #2e4d00;
}

/*　ブログエントリー　*/

.entry-card-snippet, .related-entry-card-snippet {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
}

/*　パンくずリスト　*/

.sp span {
color: #2e4d00;
}

.breadcrumb a , .breadcrumb {
color: #555;
}

/*　固定ページ　*/

article.type-page div.date-tags {
display: none;
}

/*　サイドバー　*/

.sidebar h3 {
position: relative;
display: inline-block;
margin: 1rem 0 1.5rem 0;
font-size: 1rem;
font-weight: 400;
padding: .25rem 1.5rem;
color: #333;
border: 2px solid #8eed00;
border-bottom: 1px solid #aaa;
border-radius: 10px 10px 0 0;
background: rgba(255,255,255,0);
-webkit-box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
box-shadow: 3px 3px 5px rgba(0, 0, 0, .2);
}

.sidebar h3:before {
position: absolute;
bottom: -10px;
left: -2px;
width: 0;
height: 0;
content: '';
border-top: 10px solid #00c44f;
border-left: 10px solid transparent;
}

.border-partition a:first-of-type {
border-top: 2px dotted #e4edd5;
}

.border-partition a {
border-bottom: 2px dotted #e4edd5;
}

/*　ページ送り　*/

#pager-post-navi {
position: relative;
margin: 50px 0;
}

a.next-post:after , a.prev-post:after {
color: #555;
font-family: 'Merriweather', serif;
font-size: 1.1rem;
position: absolute;
top: -1.2rem;
transform: translateX(-50%);
}

a.next-post:after {
content: "次の記事";
left: 75%;
}

a.prev-post:after {
content: "前の記事";
left: 25%;
}

/*　スマホメニュー　*/

.mobile-menu-buttons .menu-button {
background: rgba(142,237,0,.4);
}

.mobile-menu-buttons .menu-icon {
color: #00c44f;
}

.mobile-menu-buttons .menu-caption {
color: #111;
}

/*　スライドメニュー　*/

#navi-menu-content {
background: rgba(255,255,255,.85);
}

.menu-drawer a {
font-size: 15px;
font-weight: 600;
color: #333;
padding: 12px;
border-bottom: 1px #00c44f dashed;
}

.menu-close-button {
color: #00c44f;
}

/*　テーブル　*/

.wp-block-table table {
width: 90%;
overflow-x: scroll;
margin: 0 auto;
}

.wp-block-table table td {
white-space: nowrap;
padding: 1em;
}

/*　検索　*/

.search-submit > span {
color: #00c44f;
}

/*　見出し　*/

.article h1:first-letter {
font-size: 130%;
color: #00c44f;
}

.article h1 {
margin-top: 4rem;
padding-bottom: 10px;
position: relative;
display: inline-block;
overflow: hidden;
}

.article h1:before {
content: '';
width: 110%;
height: 2px;
background-color: #2e4d00;
display: block;
position: absolute;
left: .6rem;
bottom: 2px;
}

html .body .article h2 {
color: #333;
}

.article h2 {
font-size: 22px;
line-height: 110%;
font-weight: bold;
padding: 0.5rem 0 0.5rem 0.5rem;
background: transparent;
border-left: 6px solid #00d44f;
margin: 4rem 0 2rem 5px;
border-bottom: none;
border-right: none;
border-top: none;
}

.article h3 {
font-size: 20px;
font-weight: 400;
position: relative;
padding: 1em 0.8em 1em 3em;
margin: 5rem 0 2rem;
border: 1px solid #ddd;
border-radius: 5px;
}

.article h3:after {
top: calc(50% - 1rem);
font-family: "Font Awesome 5 Free";
content: "\f7c0";
font-weight: 900;
font-size: 1.8rem;
position: absolute;
left: .55em;
color: #00d44f;
}

.article h4 {
font-size: 16px;
font-weight: bold;
color: #555;
margin: 2rem 0 1rem 10px;
position: relative;
display: inline-block;
border-top: none;
border-bottom: none;
}

.article h4:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 8px;
background: -webkit-repeating-linear-gradient(
-45deg, #00d44f, #00d44f 2px, #fff 2px, #fff 4px);
    background: repeating-linear-gradient(
-45deg, #00d44f, #00d44f 2px, #fff 2px, #fff 4px);
}

.article h5 {
font-size: 16px;
font-weight: bold;
color: #555;
margin: 20px 0 10px 10px;
position: relative;
padding-left: 1.8em;
overflow: hidden;
border-bottom: none;
}

.article h5:before {
font-family: "Font Awesome 5 Free";
content: "\f35a";
position: absolute;
font-weight: 900;
font-size: 1.4em;
left: 0;
top: 0;
color: #00d44f;
line-height: 1.8;
}

.wp-block-media-text h1 , .wp-block-media-text h2 , .wp-block-media-text h3 , .wp-block-media-text h4 , .wp-block-media-text h5 , .wp-block-media-text h6 {
margin-top: .5rem;
}

.seedling {
position: relative;
padding-left: 1.6em;
}

.seedling:before {
font-family: "Font Awesome 5 Free";
content: "\f4d8";
font-weight: 900;
font-size: 1.3em;
position: absolute;
top: 0;
left: 0;
color: #00ff3b;
}

/*　ボタン　*/

.list-more-button-wrap a , .wpcf7-form input[type='submit'] {
display: flex;
justify-content: center;
align-items: center;
margin: 1rem auto;
padding: .5rem .8rem;
max-width: 165px;
font-size: 16px;
background-color: #e4edd5;
box-shadow: 3px 3px 0 #00c44f;
border-radius: 3px;
border: none;
transition: 0.3s;
}

.list-more-button-wrap a:hover {
text-decoration: none;
background-color: #e0ffe0;
box-shadow: 0 0 0;
}

/*　メディアとテキスト　*/

.wp-block-media-text {
row-gap: 2em;
}

/*　リスト　*/

ul.soul {
padding: 0.5em 1em 0.5em 2.2em;
margin: 2em 0 2.5em 2em;
position: relative;
border: solid 1px #1483CC;
border-radius: 5px;
display: inline-block;
}

ul.soul li {
line-height: 1.4em;
padding: 0.5em 0;
list-style-type: none!important;
}

ul.soul li:before {
font-family: "Font Awesome 5 Brands";
content: "\f83f";
position: absolute;
font-weight: 400;
font-size: 1.2em;
color: #00c40d;
left: .6em;
}

ul.leaf {
padding: 0 1em 0 1.3em;
margin: 2em 0 1em 2em;
position: relative;
}

ul.leaf li {
line-height: 1.4em;
padding: 0.5em 0;
list-style-type: none!important;
}

ul.leaf li:before {
font-family: "Font Awesome 5 Brands";
content: "\f18c";
font-weight: 400;
font-size: 1.4em;
position: absolute;
left : 0;
color: #5f00ed;
}

ul.kiwi {
padding: 0.5em 1em 0.5em 1.5em;
margin: 7px 0 7px 12px;
position: relative;
}

ul.kiwi li {
line-height: 1.4em;
padding: 0.5em 0 0.5em 0em;
list-style-type: none!important;
}

ul.kiwi li:before {
font-family: "Font Awesome 5 Free";
content: "\f535";
font-weight: 900;
position: absolute;
left: .15em;
color: #b6ed00;
}

/* フォームレイアウト
---------------------------------------------------- */

.forma {
position: relative;
max-width: 80%;
margin: 15px 3%;
}

.forma input[type='text'], input[type='email'], input[type='tel'], input[type='number'], input[type='date'], select, textarea {
font: 0.9em/2 sans-serif;
box-sizing: border-box;
padding: 0.5em;
transition: 0.3s;
letter-spacing: 1px;
color: black;
border: 1px solid #333;
border-radius: 4px;
max-width: 100%;
display: block;
}

.fd input[type='text']:focus, input[type='email']:focus, input[type='tel']:focus, input[type='number']:focus, input[type='date']:focus, select:focus, textarea:focus {
border: 1px solid #00c44f;
outline: none;
box-shadow: 0 0 12px 5px rgb(0 196 79 / 50%);
}

span.wpcf7-radio > span.wpcf7-list-item > label {
margin: 0.5rem;
display: block;
}

span.wpcf7-radio > span.wpcf7-list-item {
display: block;
margin: 0;
}

span.wpcf7-list-item input[type=radio] {
position: absolute;
opacity: 0;
}

span.wpcf7-list-item input[type=radio] + span.wpcf7-list-item-label:before {
  content: "";
  background: #f4f4f4;
  border-radius: 100%;
  border: 1px solid #333;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  position: relative;
  top: 0;
  margin-right: .5em;
  vertical-align: top;
  cursor: pointer;
  text-align: center;
  transition: all 250ms ease;
}

span.wpcf7-list-item input[type=radio]:checked + span.wpcf7-list-item-label:before {
background-color: #00c44f;
box-shadow: inset 0 0 0 5px #f4f4f4;
}

span.wpcf7-list-item input[type=radio]:focus + span.wpcf7-list-item-label:before {
outline: none;
border-color: #00c44f;
box-shadow: inset 0 0 0 5px #f4f4f4, 0 0 12px 5px rgb(0 196 79 / 50%);
}

span.wpcf7-list-item input[type=radio]:disabled + span.wpcf7-list-item-label:before {
  box-shadow: inset 0 0 0 5px #f4f4f4;
  border-color: #b4b4b4;
  background: #b4b4b4;
}

span.wpcf7-list-item input[type=radio] + span.wpcf7-list-item-label:empty:before {
  margin-right: 0;
}

.numberofpeople {
display: inline-block;
margin-right: .5rem;
}

.forma .fd .rqd {
background: red;
font-size: 12px;
font-weight: bold;
color: white;
margin-left: .8em;
border-radius: 4px;
padding: 3px;
}

.forma .fd .fdtext {
margin-left: .4em;
}

.forma .fdtextat {
font-size: 13px;
color: #333;
display: block;
}

.forma .fd i {
color: #8eed00;
}

.wpcf7-form input[type='submit'] {
margin: 10px 3%;
display: block;
}

.single-contents .mailbtn {
margin: 0 0 0 30px;
}

.line-button {
width: 180px;
}

/*　フッダー　*/
#footer {
background: rgba(255,255,255,0)
}

.copyright {
display: inline-block;
font-size: .7rem;
font-weight: 400;
background: #e4edd5;
padding: 5px 30px;
color: #2e4d00;
border-radius: 2px;
}

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

/*834px以下*/
@media screen and (max-width: 834px){
#header .site-name-text { font-size: 40px; }
#metaslider_container_127 { margin-top: 30px; }
.caption-wrap .caption { font-size: 16px; }
.metaslider { width: 92%; }
#navi-footer { display: none; }

}

/*480px以下*/
@media screen and (max-width: 480px){
#metaslider_container_127 { margin-top: 20px; }
.list-title-in { font-size: 1.15rem; }
.article p , .wp-block-media-text__content p { padding-left: 0; }
#main .seedling { padding-left: 1.6em;}
div.wp-block-media-text .wp-block-media-text__content { padding: 0; }
a.next-post:after { top: auto; bottom: -1.2rem; }
a.next-post:after , a.prev-post:after { font-size: .9rem; }
}

/*356px以下*/
@media screen and (max-width: 356px){
.front-top-page .ect-big-card-first .a-wrap:first-of-type .card-thumb, .ect-big-card .card-thumb { width: 100%; }
.ect-big-card-first .entry-card-wrap { width: 100% !important; }
}