@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*---------------------------------
 共通
---------------------------------*/
/*スタイル初期化*/
@media (min-width: 1200px){
.container {max-width:100%;}
}
@media (min-width: 992px){
.container {max-width:100%;}
}
@media (min-width: 768px){
.container {max-width:100%;}
}
@media (min-width: 576px){
.container {max-width:100%;}
}
@media (max-width: 767px){
  .eroad { height: 260px;width: 100%;}
  .eroadfooter {width: 100%;}
}
.content-in {margin: 0 auto;}
main{width: 860px;}
.l-btn__anime {display: none !important;}
.l-txt__center{text-align: center;}

/*ulタグのスタイル初期化*/
.l-card__header ul,.l-card__footer ul,.l-area__howto ul,.l-area__search ul,.l-form ul,.l-area__searchNeighborhood ul{list-style: none;padding:0;margin: 0;}


/*clearfixハック*/
.clearfix::after {display: block;clear: both;content: "";}

/*ボタンスタイル*/
.l-btn{display: block;padding: 0.3em 1em;text-decoration: none;border-radius: 10px;transition: .4s;font-weight: bold;text-align: center;margin: 10px 0;font-size: 1em!important;}
.l-btn--dotYellow:hover {opacity: 0.8;color: #333;}
.l-btn--dotYellow{color: #333;border: solid 2px #333;background: url(img/pattern-dot_01.png);background-size: 35px;}
.l-btn--dotPink{color: #333;border: solid 2px #333;background: url(img/pattern-dot_02.png);background-size: 35px;}
.l-btn--dotBlue{color: #333;border: solid 2px #333;background: url(img/pattern-dot_03.png);background-size: 35px;}

/*ヘッダー*/
.header{border-bottom: 2px solid #222;background: #15a468;}
.logo-header{line-height: 0;}
.logo-image{padding-bottom: 0;}
.tagline{margin-top: 0;}

/*フッター*/
.footer-bottom{background: #15A468;color: #fff;padding: 0 0 8px 0;margin: 8px 0 0 0;}
.navi-footer-in a{color: #fff;}
.l-spmenu__ico{background-position: center;}
.l-spmenu__ico--home{background-image:url(img/ico_menu_01.svg);background-repeat: no-repeat;}
.l-spmenu__ico--create{background-image: url(img/ico_menu_02.svg);background-repeat: no-repeat;}
.l-spmenu__ico--share{background-image: url(img/ico_menu_03.svg);background-repeat: no-repeat;}
.l-spmenu__ico--search{background-image: url(img/ico_menu_04.svg);background-repeat: no-repeat;}
.menu-icon,.menu-caption{opacity: 0!important;}
.l-footer__seotxt p{margin: 0 1em;color: #666;}


/* フッターモバイルメニュー　シェアボタンモーダル */
.l-shareBtn__modal .modal{display: none;height: 100vh;position: fixed;top: 0;width: 100%;}
.l-shareBtn__modal .modal__bg{background: rgba(0,0,0,0.8);height: 100vh;position: absolute;width: 100%;}
.l-shareBtn__modal .modal__content{background: #fff;
left: 50%;padding: 10px;position: absolute;top: 50%;transform: translate(-50%,-50%);width: 90%;border-radius: 10px;font-weight: bold;}
.l-shareBtn__modal .l-shareBtn-close{position: absolute;top:0;right: 10px;font-size:20px;color:rgba(0,0,0,0.3);}

/* QRボタンモーダル */
.l-qrBtn__modal .modal{display: none;height: 100vh;position: fixed;top: 0;width: 100%;}
.l-qrBtn__modal .modal__bg{background: rgba(0,0,0,0.8);height: 100vh;position: absolute;width: 100%;}
.l-qrBtn__modal .modal__content{background: #fff;
left: 50%;padding: 10px;position: absolute;top: 50%;transform: translate(-50%,-50%);width: 80%;border-radius: 10px;font-weight: bold;}
.l-qrBtn__modal .l-qrBtn-close{position: absolute;top:0;right: 10px;font-size:20px;color:rgba(0,0,0,0.3);}




/* フッターアコーディオンメニュー */
.l-area__footerSearch .l-hdg--primary{text-align: center;font-size: 1em;}
.l-acMenu .inner__txt a,.l-acMenu__txt a{color: #666;text-decoration: none;display: flex;justify-content: space-between;padding-right: 5px;}
.l-acMenu .inner__txt a::after{font-family: 'Font Awesome 5 Free';font-weight: 900;content:'\f054';opacity: 0.5;}
.l-acMenu {padding: 0 0 20px 0;margin: 1em 0 0 0;}
.l-acMenu .l-acMenu__inner {display: none;margin: 0;padding: 0;list-style: none;}
.l-acMenu p{cursor: pointer; padding: 10px;margin: 0;}
.l-acMenu p.l-acMenu__txt{display: flex;justify-content: space-between;}
.l-acMenu >li{background: #fff;border-left: #222 1px solid;border-right: #222 1px solid;border-bottom: #222 1px solid;}
.l-acMenu >li:first-child{border-top: #222 1px solid;}
.l-acMenu .l-acMenu__inner li{padding: 10px;}
.l-acMenu .l-acMenu__inner li.inner__txt{background: #eee;}
.l-acMenu__txt::after{font-family: 'Font Awesome 5 Free';font-weight: 900;content:'\f054';}
.l-acMenu__txt.active::after{content:'\f078';}
.l-acMenu li:first-child .active:after{content:'\f054';}




/*---------------------------------
 TOP
 検索結果
---------------------------------*/
.l-area__post .l-btn .l-btn__serchCriteria{border: #222 1.5px solid;padding: 0 5px;border-radius: 20px;display: flex;align-items: center;background: #222;}

.l-area__topSearch .l-hdg--primary{background: #ddd;margin: 0;font-size: 1em;}
.l-area__topSearch ul{list-style: none;padding:0;margin: 0;}
.l-area__topSearch li{border-bottom: 1px solid #eee;background: #fff;margin: 0!important;padding:0.6em 0 0.6em 0.8em;}
.l-area__topSearch a{width: 100%;display: block;text-decoration: none;color: #222;cursor: pointer;}
.l-area__topSearch a:hover{color:#222;opacity: 0.5;}

.l-area__post .l-hdg--primary{padding: 0 0.3em;background: transparent;border-left: solid 5px #429673;color: #222;}
.l-area__post .l-hdg--secondary{border:0;margin: 0;padding: 0.6em 0; display: flex;align-items: center;}
.l-area__post .l-hdg--secondary img{margin-right: 5px;}


.l-card__header ul{display: flex}
.l-card__header li{
   /* border: #222 1px solid;border-radius: 3px;background: #15A468;color: #fff;font-size:0.8em;padding: 0 5px; */

   background: #fff !important;
   display: inline-block;}
   .l-card__header li a{text-decoration: none;}
   .l-card__header li a::before{content: '#';}
.l-card__body{background: #fff;border: #ddd solid 1px;padding: 10px;margin-bottom: 1em;}
.l-card__txt{white-space: pre-wrap;}
.l-card__footer .l-btn__sns{border: #222 1.5px solid;padding: 0 5px;border-radius: 20px;display: flex;align-items: center;}
.l-card__footer .l-btn__sns a{width: 100%;display: block;text-decoration: none;color: #222;cursor: pointer;padding: 0 2px;}
.l-card__footer .l-btn__sns a:hover{color:#222;opacity: 0.5;}
.l-card__footer .l-link--danger a{color: crimson;font-weight: bold;}


.l-card__footer .l-date{font-weight: bold;letter-spacing: -1px;}
.l-card__footer .l-card__footerInner{display: flex;justify-content: space-between;align-items:flex-end;}
.l-card__footer .l-card__footerInner ul{display: flex;}
.l-card__footer .l-card__footerInner ul:last-child{justify-content: flex-end;}


.l-criteria{display: flex;align-items: center;}
.l-criteria h1{font-size: 14px;font-weight: normal!important;text-align: left!important;}
.l-criteria span{padding-right: 8px;}
.l-area__post .l-btn__serchCriteria{background: #fff;border: 1.5px solid #ccc;color: #737373;font-size: 0.8em!important;display: inline;;padding: 3px 5px;background: #eee;font-weight: 400;vertical-align: middle;}

.l-area__searchNeighborhood{display: flex;margin-bottom: 20px;align-items: baseline;}
.l-area__searchNeighborhood ul{display: list-item;}
.l-area__searchNeighborhood li a{color: #fff;text-decoration: none;}
.l-area__searchNeighborhood span{color: #15A468; font-weight: bold;font-size: 0.9em;min-width: 13em;}
.l-area__searchNeighborhood span::before{content: '\f002';font-family: 'Font Awesome 5 Free';font-weight: 900;padding-right: 3px;}
.l-area__searchNeighborhood li{border: #222 1px solid;border-radius: 3px;background: #15A468;color: #fff;font-size:0.8em;padding: 0 5px;display: inline-block;}


/* 旧ページャー */
/* .l-pager ul{display:block;list-style: none;padding-left: 0;}
.l-pager li{border: 2px solid #15A468;padding: 10px 20px;border-radius: 5px;}
.l-pager a{color: #15A468;}
.l-pager .l-pager--left{float: left;}
.l-pager .l-pager--right{float: right;}
.l-pager .l-pager--left i{margin-right: 10px;}
.l-pager .l-pager--right i{margin-left: 10px;}
.l-pager a{text-decoration: none;} */


/* 新ページャー */
.l-pager ul{display:block;list-style: none;padding-left: 0;margin-bottom: 1px;display: flex;justify-content: center;font-size: 14px;}
.l-pager li{display: inline;margin: 0;border-right: 1px solid #333;display: flex;justify-content: center;width: 100%;}
.l-pager li:last-child{border: none;}
.l-pager a{font-weight: bold;text-decoration: underline;}
.l-pager .l-pager--left{float: left;}
.l-pager .l-pager--right{float: right;}
.l-pager .l-pager--left i{margin-right: 10px;}
.l-pager .l-pager--right i{margin-left: 10px;}
.l-pager ul{text-align: center;line-height: 1;display: flex;justify-content: space-between;}
.l-pager ul> a{padding: 0 5px;}
.l-pager{text-align: center;}

/*バルーンアニメ*/
#fade {position: fixed;top: 0;right: 20px; }

a.l-btn__anime {-webkit-animation: horizontal 1s ease-in-out infinite alternate;animation: horizontal 1s ease-in-out infinite alternate; }
a.l-btn__anime img {-webkit-animation: vertical 1s ease-in-out infinite alternate;animation: vertical 1s ease-in-out infinite alternate; }

@-webkit-keyframes horizontal {
0% {-webkit-transform: translateX(-3px);transform: translateX(-3px); }
100% {-webkit-transform: translateX(0px);transform: translateX(0px); } }

@keyframes horizontal {
0% {-webkit-transform: translateX(-3px);transform: translateX(-3px); }
100% {-webkit-transform: translateX(0px);transform: translateX(0px); } }

@-webkit-keyframes vertical {
0% {-webkit-transform: translateY(-10px);transform: translateY(-10px); }
100% {-webkit-transform: translateY(0px);transform: translateY(0px); } }

@keyframes vertical {
0% {-webkit-transform: translateY(-10px);transform: translateY(-10px); }
100% {-webkit-transform: translateY(0px);transform: translateY(0px); } }


/*---------------------------------
サイドバー
---------------------------------*/
.sidebar h2 {background-color: #15a468;color: #fff;padding: 12px;margin: 16px 0;border-radius: 2px;font-size: 1.17em;}
.widget-entry-card{padding-right:28px;}
.new-entry-card.widget-entry-card.e-card.cf:before{
	content: "";
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 9px;
	height: 9px;
	border-top: 3px solid #15a468;
	border-right: 3px solid #15a468;
	transform: rotate(45deg);
}
.a-wrap:hover{background: #e6fff4 !important;}
.other_articles:hover{opacity: 0.7;}
/*---------------------------------
 投稿完了ページ
---------------------------------*/
.l-area__complete h1{text-align: center;}
.l-area__complete .l-area__completeInner{border: 2px solid #222;background: #fff;padding:1em;text-align:center;}
.l-area__complete .l-area__completeInner a{border: 2px solid #222; background: #FDF79B;display: block;text-decoration: none;color: #222;font-weight: bold;}

/*---------------------------------
 使い方
---------------------------------*/
.l-area__howto li{border-left: #222 1px solid;border-right: #222 1px solid;border-bottom: #222 1px solid;margin: 0!important;padding: 0.5em 0 0.5em 10px;background: #fff;}
.l-area__howto li:first-child{border-top: #222 1px solid;}
.l-area__howto a{width: 100%;color: #222;text-decoration: none;display: block;}
.l-area__howto a::after{content:'\f054';font-family: "Font Awesome 5 Free";font-weight:900;float: right;padding-right: 1em;}


/*---------------------------------
 運営社情報
---------------------------------*/
table {margin-bottom: 0;}
.l-area__company > div{border: 1px solid #222;}

/*---------------------------------
 お問い合わせ
 通報
 削除
---------------------------------*/
.l-area__contact span,.l-area__report span{color: crimson;}
.l-area__contact input[type='submit'],.l-area__report input[type='submit'],.l-area__delete input[type='submit']{display: block;padding: 0.3em 1em;text-decoration: none;border-radius: 10px;transition: .4s;font-weight: bold;text-align: center;margin: 10px 0;font-size: 1em;}
.l-area__contact input[type='submit'],.l-area__report input[type='submit'],.l-area__delete input[type='submit']{color: #333;border: solid 2px #333;background: url(img/pattern-dot_03.png);background-size: 35px;}

.l-area__reportInner,.l-area__deleteInner{border: 1px #222 solid;background: #FAE7E9;padding: 0 1em;}


/*---------------------------------
検索
---------------------------------*/
.l-area__search .l-commnet{border: #222 solid 1px;background: #fff;padding: 1em;}
.l-area__search .l-form__item{margin: 1em 0;}
.l-area__search input[type='submit']{display: block;padding: 0.3em 1em;text-decoration: none;border-radius: 10px;transition: .4s;font-weight: bold;text-align: center;margin: 10px 0;font-size: 1em;}


/* 性別ラジオボタン */
.l-form__radio {display: flex;border-radius: 3px;overflow: hidden;border: 1px solid #ccc;}
.l-form__radio .radio__inner {position: relative;flex: 1;}
.l-form__radio input {width: 100%;height: 45px;opacity: 0;}
.l-form__radio label {position: absolute;top: 0; left: 0;color: #b6b6b6;width: 100%;height: 100%;background: #fff;display: flex;align-items: center;justify-content: center;pointer-events: none;border-right: 1px solid #ccc;font-size: 16px;}
.l-form__radio .radio__inner:last-child label {border-right: 0;}
.l-form__radio input:checked + label {background: #15a468;font-weight: 500;color: #fff;}





/*---------------------------------
共通ページ
---------------------------------*/
.l-area__common .entry-title{padding: 0 0.3em;background: transparent;border-left: solid 5px #429673;color: #222;}
.toc{border: 1px solid #15a468 !important;}
.article h2{background: #15a468;color: #fff;}
.article h3{border-left:7px solid #15a468;border-right: 1px solid #15a468;border-top: 1px solid #15a468;border-bottom: 1px solid #15a468;}
/*ボタン　シアン*/
.btn-cyan, .btn-wrap.btn-wrap-cyan>a{display: block;margin: 16px 0;}
/*ボタン　オレンジ*/
.btn-orange, .btn-wrap.btn-wrap-orange>a{display: block;margin: 16px 0;position: relative;}
/*ボタン　ライトブルー*/
.btn-light-blue, .btn-wrap.btn-wrap-light-blue>a{display: block;}
/*ボタン　ライトグリーン*/
.btn-light-green, .btn-wrap.btn-wrap-light-green>a{display: block;}
/*ボタン　ピンク*/
.btn-pink, .btn-wrap.btn-wrap-pink>a{display: block;}
/*ボタン　紺色（インディゴ）*/
.btn-indigo, .btn-wrap.btn-wrap-indigo>a{display: block;}

/*共通ボタン*/
.btn-m:before{
	content: "";
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 40px; /* ②棒が長くなった分、左へ40px移動 */
	width: 11px;
	height: 11px;
	border-top: 3px solid #fff;
	border-right: 3px solid #fff;
	transform: rotate(45deg);
}

/*　黄色ボックス（白抜き）　*/
.blank-box.bb-yellow{background: #fff;}

/*---------------------------------
新規投稿ページ
---------------------------------*/
.l-area__create .l-form__item{margin: 1em 0;}


.l-form ul{list-style: none;padding-left: 0;}
.l-form__item{margin: 1em 0;}
.l-form__item small{color: #7e7e7e;font-weight: normal;}
.l-form__qr input{display: block;width: 100%;padding: 0.5em 0 2em 0.5em;border: 3px #ddd dotted; }
.l-form__item label{display: flex;}
.l-form__item textarea{display: block;}
.l-form__item #agree,.l-form__item #agree-error{justify-content: center;align-items: center;}
.l-form__qr a{display: block;}
.l-form__hdg{font-weight: bold;}
.l-form__required{font-weight: normal;color:crimson;}
.l-form__select{color: #7e7e7e;background: #fff;}
.l-form__submit input{border-radius: 30px;}
.l-form label.error,.l-form span.error{color: crimson;font-weight: bold;margin-top: 5px;padding: 7px 10px;min-width: 120px;background: #F6E3E7;font-size: 0.8em;width: 100%;}
.l-form input.error,.l-form textarea.error{border: 2px solid #ed143da1;}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*480px以上*/
@media screen and (min-width: 481px){
  /*必要ならばここにコードを書く*/
  .l-acMenu{list-style: none;width:1256px;margin: 0 auto;}
  .l-area__footerSearch .l-hdg--primary {width: 100%;margin:10px 0;}
  .footer-bottom{padding:15px;}
}



/*1240px以下*/
@media screen and (max-width: 1240px){
	.l-acMenu{list-style: none;}
  /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px){
	.l-acMenu{list-style: none;}
  /*必要ならばここにコードを書く*/
}

@media screen and (max-width: 1023px){
.mobile-menu-buttons {padding: 0 40px;}
.no-mobile-sidebar #sidebar{display: block;}
}

@media screen and (max-width:834px){
.l-acMenu{list-style: none;}
.navi-footer-in > .menu-footer{border-top: 1px dotted rgba(255,255,255,0.5);border-left: 1px dotted rgba(255,255,255,0.5);border-right: 1px dotted rgba(255,255,255,0.5);}
.navi-footer-in > .menu-footer li.menu-item{border-bottom: 1px dotted rgba(255,255,255,0.5);margin: 0;padding: 5px;}
.navi-footer-in > .menu-footer li.menu-item:nth-child(2n+1) {border-right: 1px dotted rgba(255,255,255,0.5);} /*奇数*/
main{width: 100%;}
}


/*768px以下*/
@media screen and (max-width: 768px){
	.l-acMenu{list-style: none;}
	.content-in {margin: 0 10px;}
}

/*480px以下*/
@media screen and (max-width: 480px){
	.l-acMenu{list-style: none;}
	.l-card__footer .l-btn__sns a{font-size: 12px;}
}
