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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
body.public-page { background-color: rgb(251, 250, 248) !important; }
#header-container { display: none; }
.appeal-in { padding-top: 155px; }
#go-to-top { display: none; }
.appeal-content .appeal-button { background-color: #9d8b73 !important; }
#header-container, #header-container .navi, #navi .navi-in>.menu-header .sub-menu, .article h2, .sidebar h2, .sidebar h3, .cat-link, .cat-label, .appeal-content .appeal-button, .demo .cat-label, .blogcard-type .blogcard-label, #footer { background-color: #beaf99; }
table:not(.has-border-color) th, table:not(.has-border-color) td, table:not(.has-border-color) thead, table:not(.has-border-color) tfoot, .page-numbers, .page-numbers.dots, .tagcloud a, .list.ecb-entry-border .entry-card-wrap, .related-entries.recb-entry-border .related-entry-card-wrap, .carousel .a-wrap, .pager-post-navi.post-navi-border a.a-wrap, .article .toc, .a-wrap .blogcard, .author-box, .comment-reply-link, .ranking-item { border-color: rgb(157 139 115 / 20%); }
table tr:nth-of-type(2n+1), .page-numbers.dots, .a-wrap:hover, .pagination a:hover, .pagination-next-link:hover, .widget_recent_entries ul li a:hover, .widget_categories ul li a:hover, .widget_archive ul li a:hover, .widget_pages ul li a:hover, .widget_meta ul li a:hover, .widget_rss ul li a:hover, .widget_nav_menu ul li a:hover, .pager-links a:hover span, .tag-link:hover, .tagcloud a:hover { background-color: rgb(157 139 115 / 5%); }
.widget h2 { font-size: 15px; font-weight: 500; }
.widget_recent_entries ul li a, .widget_categories 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, .widget_block ul li a { color: #717576; font-size: 14px; }
.body blockquote :last-child, .body .wp-block-media-text__content :last-child, .body .wp-block-columns :last-child, .body .column-left :last-child, .body .column-center :last-child, .body .column-right :last-child, .body .timeline-box :last-child, .body .wp-block-cover :last-child, .body .blogcard-type :last-child, .body .btn-wrap :last-child, .body .wp-block-group:not(.is-content-justification-left, .is-content-justification-center, .is-content-justification-right, .is-content-justification-space-between, .is-layout-flex) :last-child, .body .wp-block-gallery :last-child, .body .block-box :last-child, .body .blank-box :last-child, .body .common-icon-box :last-child, .body .info-box :last-child, .body .primary-box :last-child, .body .success-box :last-child, .body .warning-box :last-child, .body .danger-box :last-child, .body .secondary-box :last-child, .body .light-box :last-child, .body .dark-box :last-child, .body .tab-content :last-child, .body .toc :last-child, .body .wp-block-social-links :last-child { color: #717576; font-size: 14px;}
.wp-block-latest-comments[class*=-font-size] a, .wp-block-latest-comments[style*=font-size] a { color: #717576; font-size: 14px; }
.fz-18px { font-size: 16px; font-weight: 400; }
.fz-16px { font-size: 14px; font-weight: 400; }
.sidebar h2, .sidebar h3 { padding: 4px 12px; color: #fff; }
.sidebar a { color: #717576 !important; }
blockquote, .key-btn { background-color: rgb(251 250 248); border-color: rgb(157 139 115 / 20%); }
.pagination-next-link, .comment-btn { font-size: 16px; }
.related-entry-heading, .comment-title { font-size: 18px; color: #cecfd0; }
.appeal-title { margin-bottom: 10px; color: #897a65; }
.appeal-message { margin-bottom: 1.5em; font-size: 14px; line-height: 2em; color: #717576; }
.related-entry-card-title, .entry-card-title { color: #897a65; font-weight: 500; }
.entry-card-thumb, .author-thumb, .blogcard-thumbnail, .related-entry-card-thumb, .popular-entry-card-thumb, .new-entry-card-thumb { margin-right: 4%; }
.wp-block-search__label { color: #9ca6ab; font-size: 14px; }
.wp-block-search__button { border: none; font-size: 12px; padding: 10px 20px; }
input[type=text], input[type=password], input[type=date], input[type=datetime], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=url], textarea, select, .search-edit { padding: 8px 11px; }
@media screen and (max-width: 834px){
  .appeal-in { padding-top: 95px; padding-bottom: 20px; }
}
@media screen and (max-width: 480px) {
  .appeal-title { font-size: 16px; }
  .appeal-message { font-size: 12px; }
  a.appeal-button { font-size: 14px; padding: 9px 20px; }
  .e-card-title { font-size: 14px; padding-top: 1px; }
}
/* add */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
body {
  min-width: 375px;
  font-size: 14px;
  font-family: "Noto Sans JP", sans-serif !important;
  font-style: normal;
  letter-spacing: 0em;
  line-height: 1.7;
  color: #000000;
  overflow-x: hidden;
}
@media screen and (max-width: 1030px) {
  body {
    font-size: 14px;
  }
}
body.is-scroll-hidden {
  overflow: hidden;
}
img {
  max-width: 100%;
  vertical-align: top;
}
ul, ol, dl {
  list-style: none;
  margin: 0;
  padding: 0;
}
p {
  margin: 0;
}
a {
  color: #000000;
  transition: all 0.1s ease;
}
a:hover {
  color: #444444;
  text-decoration: none;
}
.allwrap {
  display: grid;
  grid-template-columns: 350px 1fr;
  width: min(80%, 960px);
  margin: 0 auto;
  padding-top: 180px;
}
@media screen and (max-width: 767px) {
  .allwrap {
    grid-template-columns: 1fr;
    padding-top: 52px !important;
  }
}
.u-container {
  box-sizing: border-box;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  width: min(80vw, 960px);
}
@media screen and (max-width: 1030px) {
  .u-container {
    padding-left: 20px;
    padding-right: 20px;
    width: auto;
  }
}
/******************************/
/* header */
/******************************/
.l-header {
  top: 0;
  z-index: 1000;
  width: 100%;
  transition: all 0.3s ease;
  overflow-x: hidden;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  color: #636262;
  height: min(12.083vw,145px);
  position: absolute;
}
.l-header-bg {
  background: #fff;
  border-bottom-left-radius: min(100vw,1200px) min(9.167vw,110px);
  border-bottom-right-radius: min(100vw,1200px) min(9.167vw,110px);
  margin-left: max(-8.333vw,-100px);
  margin-right: max(-8.333vw,-100px);
  height: min(9.167vw,110px);
  box-shadow: 0px 10px 10px -6px rgba(226, 195, 172, 0.1);
}
@media screen and (max-width: 1030px) {
  .l-header-bg {
    height: 95px;
  }
}
@media screen and (max-width: 767px) {
  .l-header-bg {
    height: 72px;
    border-bottom-left-radius: 100vw 15.385vw;
    border-bottom-right-radius: 100vw 15.385vw;
  }
}
.l-header .u-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 1030px) {
  .l-header .u-container {
    padding: 7px 3%;
    width: 99vw;
  }
}
@media screen and (max-width: 767px) {
  .l-header {
    height: auto;
  }
  .l-header .u-container {
    padding: 0 1.5% 0 4.5%;
  }
}
@media screen and (max-width: 1030px) {
  .l-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    min-height: 60px;
    min-width: 375px;
  }
}
@media screen and (max-width: 1030px) {
  .l-header-main {
    padding-right: 0;
  }
}
.l-header-main__in {
  padding-top: 22px;
}
@media screen and (max-width: 1030px) {
  .l-header-main__in {
    padding-top: 11px;
  }
  .l-header-right-wrap {
    display: flex;
    align-items: center;
  }
}
@media screen and (max-width: 1030px) {
  .l-header-logo {
    margin-right: auto;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .l-header-logo {
    flex: 1;
    overflow: hidden;
  }
}
.l-header-logo__img {
  margin: 0;
  max-width: 114px;
  word-break: break-all;
}
@media screen and (max-width: 767px) {
  .l-header-logo__img {
    max-width: 84px;
  }
}
/******************************/
/* footer */
/******************************/
.l-go-top {
  padding-top: 90px;
}
.l-go-top__btn {
  position: relative;
  height: 30px;
  border: 0;
  width: 100%;
  background: #f8f5f1;
  overflow: hidden;
  text-indent: -99999px;
  transition: all ease 0.2s;
}
.l-go-top__btn:hover {
  background: rgba(157, 139, 115, 0.2);
}
.l-go-top__btn:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -3px;
  margin-left: -5px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #9d8b73;
  border-bottom: 2px solid #9d8b73;
  transform: rotate(-135deg);
  transition: all ease 0.2s;
}
.l-go-top__btn:hover:before {
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
}
.l-footer {
  padding: 45px 0 60px;
  background: #fff;
}
.l-footer-main {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 1030px) {
  .l-footer-main {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .l-footer {
    padding: 25px 0;
  }
}
.l-footer h4 {
  font-size: 12px;
  line-height: 2.33333em;
  letter-spacing: .1em;
  color: #cdcfd0;
  margin: 1.33em 0 1.083em;
}
.l-footer-navi-list__item,
.l-footer-shopinfo-list__item {
  line-height: 1.33em;
}

.l-footer-shopinfo {
  flex: 1;
  margin-right: auto;
  word-break: break-all;
}
@media screen and (max-width: 1030px) {
  .l-footer-shopinfo {
    margin-bottom: 40px;
  }
}
.l-footer-shopinfo__logo img {
  max-width: 170px;
}
.l-footer-shopinfo__txt {
  margin-top: 10px;
  font-size: 12px;
  color: #909090;
}
.l-footer-sns-list {
  display: flex;
  margin-top: 25px;
}
.l-footer-sns-list__item {
  margin-right: 20px;
}
.l-footer-qrcode {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .l-footer-qrcode {
    display: none;
  }
}
.l-footer-navi-wrap {
  padding-right: 55px;
}
.l-footer-navi {
  display: flex;
}
@media screen and (max-width: 767px) {
  .l-footer-navi-wrap {
    margin-bottom: 40px;
  }
  .l-footer-navi {
    display: block;
    margin-top: 0;
  }
}
.l-footer-navi-list {
  margin-right: 45px;
}
@media screen and (max-width: 1030px) {
  .l-footer-navi-list {
    margin-left: 0;
    width: 33.3333%;
  }
}
@media screen and (max-width: 767px) {
  .l-footer-navi-list {
    width: auto;
  }
}
.l-footer-navi-list__item a,
.l-footer-shopinfo-list__item a {
  font-size: 12px;
  line-height: 2.33333em;
  letter-spacing: .025em;
  color: #717576;
  transition: color .5s ease-out;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  .l-footer-navi-list__item {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .l-footer-navi-list__link,
  .l-footer-shopinfo-list__item {
    display: block;
    position: relative;
    padding: 0 0 10px;
  }
}
.l-footer-copyright {
  padding-top: 10px;
  padding-bottom: 60px;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "Noto Serif JP", serif;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .l-footer-copyright {
    padding-top: 0;
    padding-bottom: 30px;
  }
}
.l-copyright {
  padding-top: 30px;
  padding-bottom: 30px;
  font-size: 12px;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .l-copyright {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
.l-copyright__logo {
  margin-top: 15px;
}
.l-copyright__logo a {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.l-copyright__logo img {
  margin-left: 10px;
  width: 200px;
  height: 36px;
}

p.f-footer__copyright {
  font-size: 12px;
  margin-top: 90px;
  color: #717576;
  letter-spacing: .1em;
}
@media screen and (max-width: 767px) {
  p.f-footer__copyright {
    margin-top: 65px;
  }
}
.c-shareLink { display: block }
.sns-icon { height: auto }
.sns-icon--facebook { width: 19px }
.sns-icon--twitter { width: 17px }
.sns-icon--instagram { width: 17px }
.sns-icon--youtube { width: 23px }
.sns-icon--line { width: 19px }

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

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

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