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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.main{background-color:transparent;}

/************************************
**Hタグデザイン
************************************/
.article h1{position:relative;padding:1rem 2rem calc(1rem + 10px);background:#f5f5f5}
.article h1:before{position:absolute;top:-7px;left:-7px;width:100%;height:100%;content:'';border:1px solid #ccc}
.article h3{position:relative;border:none;padding:18px 20px}
.article h3:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:7px;background:-webkit-repeating-linear-gradient(-45deg,#6ad1c8,#6ad1c8 2px,#fff 2px,#fff 4px);background:repeating-linear-gradient(-45deg,#6ad1c8,#6ad1c8 2px,#fff 2px,#fff 4px)}
.slant-bg {width: 100%;padding: 150px 0;clip-path: polygon(0 calc(0% + 7vw), 100% 0, 100% calc(100% - 7vw), 0 100%);background-color: #F1C122;}
.slant-bg p {width: 65%;margin: 0 auto;}
.fs-f{font-size:clamp(1.5rem,2vw + 1rem,2.25rem);font-weight:700}
.fs-f2{font-size:clamp(1rem,0.9rem + 0.5vw,1.5rem);font-weight:700}
.fs-7{font-size:.7rem}
.sppc{display:none}
.tagline{text-align:center;font-size:10px;margin:.6em 1em}
.date-tags{display:none}
.footer,.footer-bottom{margin:0 calc(50% - 50vw);width:100vw}
.footer{border-top:groove 3px #dcdcdc;background-color:#faf0e6;background-image:radial-gradient(rgba(210,180,140,0.52) 2%,transparent 15%),radial-gradient(rgba(210,180,140,0.52) 2%,transparent 15%);background-position:0 0,7px 7px;background-size:14px 14px}
.footer-bottom{border-top:groove 1px #dcdcdc}
.allwidth{margin-left: calc(50% - 50vw);margin-right: calc(50% - 50vw); overflow: hidden;}
.mipoint{position:relative;padding:2rem;text-align:center;border:3px solid #000;border-radius:0 10px 10px 10px;height:300px}
.mipoint:before{font-size:15px!important;font-size:1rem!important;position:absolute!important;top:-30px!important;left:-3px!important;height:28px!important;padding:0 1em!important;content:'POINT';color:#fff;border-radius:10px 10px 0 0;background:#000}
.parallax-window{min-height:400px;background:transparent}

/************************************
****　オリジナルボタンデザイン
************************************/
span.wpcf7-spinner{display:none}
input[type="submit"],input[type="reset"]{appearance:none;-webkit-appearance:none;-moz-appearance:none;font-size:20px;font-weight:700;width:200px;padding:10px;border-radius:10px;background-color:#233b6c;border:none;color:#fff;cursor:pointer}
.submit-btn{display:inline-block;position:relative}
.submit-btn::after{position:absolute;font-family:"Font Awesome 5 Free";content:"\f061";font-weight:900;color:#fff;right:20px;top:50%;transform:translateY(-50%)}
.btn3,a.btn3,button.btn3{font-size:1rem;font-weight:700;line-height:1.5;position:relative;display:inline-block;padding:.6rem 1.8rem;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s;transition:all .3s;text-align:center;vertical-align:middle;text-decoration:none;letter-spacing:.1em;color:#212529;border-radius:.5rem}
a.btn3-border{border:2px solid #000;border-radius:0;background:#fff;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}
a.btn3-border:before{position:absolute;top:0;left:0;width:15px;height:100%;content:'';-webkit-transition:all .3s;transition:all .3s;-webkit-transform:translateX(0) translateY(0);transform:translateX(0) translateY(0);border-radius:0 50% 50% 0;background:#000}
a.btn3-border:hover:before{font-family:'Font Awesome 5 Free';font-weight:700;line-height:30px;width:30px;height:30px;content:'\f061';-webkit-transform:translateX(460%) translateY(.5rem);transform:translateX(460%) translateY(.5rem);color:#fff;border-radius:50%}
/************************************
****　エントリーカードインデックス
************************************/
.ect-vertical-card .entry-card-wrap .entry-card-content{padding:3px;margin:0;display:flex;flex-direction:column;height:100%}
a.entry-card-wrap.a-wrap.border-element.cf{padding:0 0 .5em;border-radius:6px;width:33%;margin-bottom:1em}
a.entry-card-wrap.a-wrap{transition:all .1s}
a.entry-card-wrap.a-wrap:hover{transform:translateY(-1px);transition:all .1s;background-color:#fff}
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:200px;border-radius:6px 6px 0 0/ 6px 6px 0 0;overflow:hidden;display:flex;justify-content:center;align-items:center}
.e-card-thumb .cat-label{margin-top:.3em;margin-left:.3em}
.cat-label{background-color:#004f9d!important}
h2.entry-card-title.card-title.e-card-title{font-size:18px;color:#7b7b7b;font-weight:700;text-align:center;line-height:1.5rem;margin-top:.5em;margin-bottom:1rem;padding:0 .3em}
.entry-card-snippet.card-snippet.e-card-snippet{font-size:14px;color:#7b7b7b;text-align:center;border-top:3px dotted silver;line-height:1.8em;padding-top:.6em;margin-left:2em;margin-right:2em;margin-bottom:1em;max-height:20em}
.eye-catch .cat-label,.cat-label{font-size:.7em;padding:0 .5em;opacity:.85;background-color:#f5f5f5;color:#696969}
div.admin-pv{display:none}
/************************************
**　トップ新着・人気・関連記事ウィジェット 投稿日・更新日表示
************************************/
.new-entry-cards.a-wrap{display:flexbox}
.widget-entry-cards.card-large-image .a-wrap{border:solid 1px #ccc;border-radius:20px;width:24%;text-align:left;padding:0;margin:1px;height:400px}
.widget-entry-cards:not(.large-thumb-on) .card-title{font-size:16px;color:#7b7b7b;font-weight:700;text-align:center;line-height:1.5rem;margin-top:.5em;margin-bottom:1rem;padding:0 .3em}
.widget-entry-card-snippet{font-size:12px;color:#7b7b7b;text-align:center;border-top:3px dotted silver;line-height:1.5em;padding-top:.6em;margin-left:2em;margin-right:2em;margin-bottom:1em;max-height:20em}
.widget-entry-cards.card-large-image figure img{width:100%;display:block;border-radius:20px 20px 0 0;object-fit:cover}
.widget-entry-card-thumb{margin-top:0!important}
.eye-catch .cat-label,.cat-label{font-size:.7em;padding:0 .5em;margin-left:5px;opacity:.85;background-color:#f5f5f5;color:#696969}
div.admin-pv{display:none}
.new-entry-card-date{display:block;color:#a3a1a1;text-align:right;margin-right:15px}
.widget-entry-card-update-date{display:none}
.widget-entry-card-date{display:block;position:absolute;right:0;font-size:18px}
.widget-entry-card-date::before{font-family:"Font Awesome 5 Free";content:"\f017";font-weight:400;padding-right:0;font-size:14px}

/************************************
/***ステップバーデザイン１
************************************/
.step-wrap1 { counter-reset: count; margin: 2em 0; position: relative; }
.step-content1 { padding: 0 0 1.3em 2em; margin: 0; position: relative; }
.step-content1::before { content: ""; display: block; width: 13px; height: 13px; background: #6ab5a5; border: solid 3px #ffffff; border-radius: 50%; position: absolute; top: 3px; left: 3px; box-shadow: 0 0 0 2px #6ab5a5; }
.step-content1::after { content: ""; display: block; height: calc(100% - 35px); border-left: dotted 5px #768888; position: absolute; top: 30px; left: 10px; }
.step-title1 { font-weight: bold; font-size: 120%; }
.step-label1 { color: #768888; font-weight: bold; }
.step-label1::after { counter-increment: count; content: counter(count); position: relative; left: .3em; }
.step-body1 { margin-top: .5em; padding: 0 0 1em; border-bottom: dotted 2px #ddd; }
.step-wrap1 > :last-of-type::after { display: none; }


/************************************
** ヘッドナビ部分
************************************/
#navi .navi-in a{color:#630;font-size:1rem;font-weight:500}
#navi .navi-in a:hover{background-color:#e44c07;background-image:linear-gradient(180deg,#e44c07 0%,#b10e0e 74%);transition:all .3s ease-in-out;color:#FFF}
#navi .navi-in a:after{position:absolute;content:"";left:0;bottom:1px;height:2px;width:100%;background:#f30;transform:scale(0,1);transition:.3s}
#navi .navi-in a:hover:after{transform:scale(1)}
.navi-in > ul .sub-menu a{padding-left:16px;padding-right:16px;font-size:12px!important}
/*ヘッダーの現在のページに色を付ける指定*/
.page-id-11481 #navi li:nth-child(2) a {background: #e0ffff;}
.page-id-11496 #navi li:nth-child(3) a {background: #e0ffff;}
.page-id-11706 #navi li:nth-child(4) a {background: #e0ffff;}
.page-id-11696 #navi li:nth-child(5) a {background: #e0ffff;}
.page-id-11691 #navi li:nth-child(6) a {background: #e0ffff;}
.page-id-11496 #navi li:nth-child(7) a {background: #e0ffff;}

/************************************
** サイドバーの設定
************************************/
.widget_categories ul li a{color:#333;text-decoration:none;padding:6px 0;display:block;padding-right:4px;padding-left:4px;border-top:1px dotted #ccc;font-size:16px}
.widget_categories ul li a::before{font-family:"Font Awesome 5 Free";content:"\f192";color:#a8bcc8;padding-right:5px;font-weight:900;font-size:18px}
.widget_categories > ul > li > a:first-child{border-top:none}
.widget_categories > ul > li > a:last-child{border-bottom:1px dotted #ccc}
.widget_categories ul li a .post-count{display:block;float:right;background:#ededed;padding:0 1em;font-size:14px;margin-top:.2em;border-radius:4px}
.widget_categories ul li a:hover{background:none;transition:.5s;color:#72c7e6}
.widget_categories ul li a:hover .post-count{background:#72c7e6;color:#fff;transition:.5s}
.widget_categories ul li ul{border-bottom:1px dotted #ccc}
.widget_categories ul li ul li a{color:#333;text-decoration:none;padding:0 4px 4px;display:block;border:none}
.widget_categories ul li ul li a::before{display:inline-block;width:30px;height:30px;background:url(https://el-design.jp/wp-content/uploads/2024/11/83e0448450076e8838472f4ac197e3e1.svg) no-repeat}
.no-scrollable-sidebar .sidebar{height:100%}
.sidebar h3{background-color:#FFF;position:relative;font-size:1.2rem;font-weight:700;padding:12px 0 12px 40px;margin:16px 0;border-radius:2px}
.sidebar h3::before{position:absolute;content:'';left:0;bottom:0;width:100px;height:3px;background:#56afd5;z-index:1}
.sidebar h3::after{position:absolute;content:'';left:0;bottom:0;width:100%;height:3px;background:#f5f5f5}
.cat-label{color:#fff!important;border-radius:5px}
.widget_recent_entries ul li a,.widget_archive ul li a,.widget_pages ul li a,.widget_meta ul li a,.widget_rss ul li a,.widget_nav_menu ul li a{padding:5px 0;padding-right:9px;padding-left:5px;transition:all 1s;font-size:14px}
.widget_recent_entries ul li a,.widget_archive ul li a,.widget_pages ul li a,.widget_meta ul li a,.widget_rss ul li a,.widget_nav_menu ul li a:hover{transform:translate(20px,0px);background-color:#FFF}
.widget_recent_entries ul li a::after{position:absolute;content:"";display:block;width:10px;height:10px;background-color:#56afd5;border-radius:50%;top:10px;left:-20px;opacity:0;-webkit-transition:all .6s ease;transition:all .6s ease}
.widget_recent_entries ul li a:hover::after{opacity:1}
/*.widget_categories ul li a:hover{transform: translate(20px,0px);}
.widget_categories ul li a::after{ position: absolute; content: ""; display: block; width: 10px; height: 10px; background-color: #56afd5; border-radius: 50%; top: 10px; left: -20px; opacity: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease;}
.widget_categories ul li a:hover::after{ opacity: 1;}

/************************************
** サイドLINE告知用
************************************/
.pulse-btn{animation:pulse-btn 5s infinite ease-in-out .8s alternate;background:url(https://el-design.jp/wp-content/uploads/2024/10/LINE-_baner-el-design_03.png) no-repeat center center / 200px auto;display:inline-block;transition:1.5s ease-in-out;position:fixed;bottom:120px;right:5px;z-index:10000;width:200px;height:500px;cursor:pointer}
.pulse-btn img{width:100%}

/************************************
** サイドLカテゴリにアイコンを表示
************************************/
.widget_nav_menu ul li.cat-item-91 > a::before{font-family: "Font Awesome 5 Free";content: "\f549";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*academy*/
.widget_nav_menu ul li.cat-item-97 > a::before{font-family: "Font Awesome 5 Free";content: "\f7b6";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*カフェ*/
.widget_nav_menu ul li.cat-item-85 > a::before{font-family: "Font Awesome 5 Free";content: "\f54e";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*美容サロン*/
.widget_nav_menu ul li.cat-item-87 > a::before{font-family: "Font Awesome 5 Free";content: "\f500";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*求人*/
.widget_nav_menu ul li.cat-item-95 > a::before{font-family: "Font Awesome 5 Free";content: "\f1ad";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*企業*/
.widget_nav_menu ul li.cat-item-92 > a::before{font-family: "Font Awesome 5 Free";content: "\f0f8";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*整骨院*/
.widget_nav_menu ul li.cat-item-93 > a::before{font-family: "Font Awesome 5 Free";content: "\e05d";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*クリーニング*/
.widget_nav_menu ul li.cat-item-96 > a::before{font-family: "Font Awesome 5 Free";content: "\f66f";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*金融*/
.widget_nav_menu ul li.cat-item-88 > a::before{font-family: "Font Awesome 5 Free";content: "\f508";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*メーカー*/
.widget_nav_menu ul li.cat-item-94 > a::before{font-family: "Font Awesome 5 Free";content: "\f0c0";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*組合*/
.widget_nav_menu ul li.cat-item-90 > a::before{font-family: "Font Awesome 5 Free";content: "\f4c2";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*エステ*/
.widget_nav_menu ul li.cat-item-86 > a::before{font-family: "Font Awesome 5 Free";content: "\f806";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*ネイル*/

.widget_nav_menu ul li.cat-item-89 > a::before{font-family: "Font Awesome 5 Free";content: "\f0ac";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*WEB*/
.widget_nav_menu ul li.cat-item-99 > a::before{font-family: "Font Awesome 5 Free";content: "\f279";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*WEB*/
.widget_nav_menu ul li.cat-item-98 > a::before{font-family: "Font Awesome 5 Free";content: "\f1ea";color:#a8bcc8;padding-right:8px;font-weight: 900;font-size:18px;}/*折込チラシ*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
@media screen and (max-width: 1100px){
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:120px;}
}
@media screen and (max-width: 1023px){
div#list a {box-shadow: 0px 1px 5px 0 rgba(0,0,0,.2);}
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:180px;}
a.entry-card-wrap.a-wrap:hover {transform: none;background-color: #f7f7f7;}
}
@media screen and (max-width: 900px){
.widget-entry-cards.card-large-image .a-wrap {width:32%; /*タブレットで3列*/display: inline-flex;}
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:160px;
}
}
@media screen and (max-width: 750px){
.widget-entry-cards.card-large-image .a-wrap {width:49%; /*小さめのタブレットで2列*/display: inline-flex;}
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:130px;}
.sppc{display: block;}
}
@media screen and (max-width: 600px){
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:250px;}
a.entry-card-wrap.a-wrap.border-element.cf{margin:.5em 1em!important;}
.ect-vertical-card .entry-card-wrap {width: 95%!important;}
}
@media screen and (max-width: 480px){
.widget-entry-cards.card-large-image .a-wrap {width:100%; /*スマホで1列*/}
.e-card-thumb .cat-label{margin-left:1em;}
.pulse-btn｛display:none;｝
}
@media screen and (min-width: 601px) and (max-width: 834px){
div#content.content.cf{margin:1em;}
}