@charset "UTF-8";
/*!
Theme Name: Cocoon tokidoki
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/
/************************************
** 子テーマ用のスタイルを書く
************************************/
:root {
  --tokidoki-accent-1: #f3faf3;
  --tokidoki-accent-2: #eef5ee;
  --tokidoki-accent-3: #add4c7;
  --tokidoki-accent-4: #83a89c;
  --tokidoki-em: #d4d3ad;
  --tokidoki-gray-1: #f6f6f6;
  --tokidoki-gray-2: #e9e9e9;
  --tokidoki-gray-3: #dfdfdf;
  --tokidoki-gray-4: #bbb;
  --tokidoki-base-opacity: 0.6;
}

.wp-block-image {
  margin-left: auto !important;
  margin-right: auto !important;
}

b,
em,
strong {
  font-weight: 600;
}

em {
  font-style: normal;
  background: linear-gradient(transparent 90%, var(--tokidoki-em) 90%);
}

strong {
  background: linear-gradient(transparent 60%, var(--tokidoki-em) 60%);
}

hr {
  border: 0;
  border-bottom: 1px solid var(--tokidoki-em);
}

blockquote {
  border: 0;
}

.text-center {
  text-align: center !important;
}

.item-center {
  align-items: center !important;
}

.justify-center {
  justify-content: center !important;
}

.border-0 {
  border: 0;
}

.w-xs {
  max-width: 150px;
}

.w-sm {
  max-width: 250px;
}

.w-md {
  max-width: 350px;
}

.w-lg {
  max-width: 450px;
}

.related-entry-heading {
  font-size: 20px;
}

.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
  font-size: 20px;
}
.article h2,
.article h3,
.article h4,
.article h5,
.article h6 {
  color: var(--tokidoki-accent-4);
}
.article h2 {
  background: var(--tokidoki-accent-2);
}
.article h2 .related-entry-heading {
  padding: 0;
  background: none;
}
.article h3 {
  border: 3px solid var(--tokidoki-accent-2);
}
.article h4 {
  border: 3px solid var(--tokidoki-accent-2);
  border-inline: none;
}
.article h5 {
  border-bottom: 3px solid var(--tokidoki-accent-2);
}
.article h6 {
  border: 0;
}
.article h6::before {
  content: "▶";
  margin-right: 0.625rem;
  color: var(--tokidoki-accent-2);
}

.sidebar {
  font-size: 14px;
}
.sidebar h3 {
  padding: 0;
  background: none;
  font-size: 14px;
}

.header-container {
  background: transparent !important;
}
.header-container .header .header-in,
.header-container .navi .navi-in {
  margin-block: 3.75rem;
}
.header-container .header .header-in {
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
}
.header-container .navi {
  background: transparent !important;
}
.header-container .navi .navi-in.wrap {
  width: 100%;
}
.header-container .navi .navi-in a {
  font-size: 14px;
  letter-spacing: 4px;
  padding-left: 4px;
  border: 1px solid transparent;
  background: var(--cocoon-white-color) !important;
  color: var(--cocoon-text-color) !important;
}
.header-container .navi .navi-in a:hover {
  border-color: var(--tokidoki-accent-3);
  z-index: 1;
}
.header-container .navi .navi-in ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
.header-container .navi .navi-in ul li {
  width: 100%;
  height: 50px;
  line-height: 50px;
  font-family: "Hina Mincho", "Yu Mincho", YuMincho, "Hiragino Mincho Pro", serif;
  font-weight: 500;
}
.header-container .logo {
  width: 150px;
  height: 150px;
  padding: 0;
}
.header-container .logo a,
.header-container .logo span {
  display: block;
  padding: 0;
  line-height: 1;
}
.header-container .tagline {
  margin: 0;
  font-family: "Hina Mincho", "Yu Mincho", YuMincho, "Hiragino Mincho Pro", serif;
  font-size: 20px;
  color: var(--cocoon-text-color);
}

.footer {
  margin-top: 90px;
  background: var(--tokidoki-accent-1) !important;
  color: var(--cocoon-text-color) !important;
}
.footer .footer-in .footer-bottom-logo .logo a {
  padding: 0;
}
.footer .footer-in .footer-bottom-logo .logo img {
  height: 100px;
}

.toc {
  padding: 0;
  border: 2px solid var(--tokidoki-gray-2) !important;
  border-radius: 6px;
}
.toc ul {
  list-style: inside;
}
.toc .toc-list ul,
.toc .toc-list ol {
  padding-left: 20px;
}

.toc-content > ul, .toc-content > ol {
  margin: 0;
  padding: 0 20px 0 30px !important;
}
.toc-content > ul li, .toc-content > ol li {
  margin: 0;
}

.toc-title {
  position: relative;
  padding: 10px;
  text-align: left;
  font-size: 90%;
  font-weight: 600;
}
.toc-title::after {
  content: "open";
  position: absolute;
  display: block;
  width: 50px;
  right: 10px;
  top: 7px;
  margin-left: 5px;
  padding: 5px 0;
  cursor: pointer;
  background: var(--tokidoki-gray-3);
  border-radius: 6px;
  text-align: center;
  font-size: 80%;
}

.toc-checkbox:checked + .toc-title::after {
  content: "close";
}

.product-item-box {
  border-radius: 6px;
  margin-inline: auto;
}

.wp-block-quote {
  border-radius: 6px;
  background: var(--tokidoki-gray-1);
}
.wp-block-quote::before, .wp-block-quote::after {
  position: absolute;
  aspect-ratio: 1/1;
  width: 22px;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  font-size: 20px;
  color: var(--tokidoki-accent-4);
  line-height: 1;
}
.wp-block-quote::before {
  content: "\f10d";
  top: 6px;
  left: 6px;
}
.wp-block-quote::after {
  content: "\f10e";
  right: 6px;
  bottom: 6px;
}

.sidebar h2 {
  margin: 1.25rem 0;
  padding: 0;
  background: transparent;
  font-size: 14px;
  color: var(--tokidoki-accent-3);
}
.sidebar .toc-center {
  margin-left: 0;
}
.sidebar .widget-entry-card {
  font-size: 95%;
}
.sidebar .widget_categories a .post-count,
.sidebar .widget_categories a .tag-link-count,
.sidebar .widget_tag_cloud a .post-count,
.sidebar .widget_tag_cloud a .tag-link-count,
.sidebar .widget_archive a .post-count,
.sidebar .widget_archive a .tag-link-count {
  margin: 0;
  padding: 0 5px;
  border-radius: 20px;
}
.sidebar .widget_tag_cloud a,
.sidebar .widget_archive a {
  display: flex;
  flex: 1 1 auto;
  justify-content: space-between;
  margin: 0;
  padding: 3px 8px;
  border-radius: 20px;
  color: var(--cocoon-text-color);
  text-decoration: none;
}
.sidebar .widget_tag_cloud a .post-count,
.sidebar .widget_tag_cloud a .tag-link-count,
.sidebar .widget_archive a .post-count,
.sidebar .widget_archive a .tag-link-count {
  margin: 0;
  padding: 0 5px;
  border-radius: 20px;
}
.sidebar .widget_categories {
  font-size: 12px;
}
.sidebar .widget_categories a {
  padding: 6px 0;
}
.sidebar .widget_categories a .post-count {
  background: var(--tokidoki-accent-2);
}
.sidebar .widget_tag_cloud .tagcloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 4px;
  font-size: 10px;
}
.sidebar .widget_tag_cloud a {
  background: var(--tokidoki-accent-2);
  border: 1px solid var(--tokidoki-accent-2);
  font-size: 10px;
}
.sidebar .widget_tag_cloud a .tag-link-count {
  background: var(--cocoon-white-color);
}
.sidebar .widget_tag_cloud a:hover {
  background: var(--tokidoki-accent-1);
}
.sidebar .widget_archive ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 4px;
  font-size: 10px;
}
.sidebar .widget_archive ul a {
  gap: 6px;
  font-weight: 500;
  border: 1px solid var(--tokidoki-accent-3);
}
.sidebar .widget_archive ul a .post-count {
  background: var(--tokidoki-accent-2);
}
.sidebar .widget_archive ul a:hover {
  border-color: var(--tokidoki-accent-2);
}

.go-to-top-button {
  color: var(--cocoon-text-color);
  background: transparent;
}

.blogcard,
.ecb-entry-border .entry-card-wrap,
.page-numbers,
.pagination-next-link,
.comment-btn,
.index-tab-buttons .index-tab-button,
.border-square .a-wrap,
.author-box,
.blank-box,
.is-style-triangle-box {
  border-color: var(--tokidoki-gray-2) !important;
}

.blogcard-footer {
  font-size: 14px;
}

.a-wrap {
  color: var(--cocoon-text-color);
}

.is-style-triangle-box::before {
  border-left-color: var(--tokidoki-gray-2);
}
.is-style-triangle-box::after {
  border-bottom-color: var(--tokidoki-gray-2);
}

.ecb-entry-border .entry-card-wrap,
.page-numbers,
.pagination-next-link,
.comment-btn,
.index-tab-buttons .index-tab-button,
.border-square a {
  border-color: var(--tokidoki-gray-3) !important;
  border-radius: 6px;
}

.blank-box {
  border-radius: var(--cocoon-middle-border-radius);
}

.pagination-next-link,
.comment-btn,
.page-numbers {
  color: var(--tokidoki-gray-3);
}

.pagination-next-link,
.comment-btn {
  background: transparent;
}
.pagination-next-link:hover,
.comment-btn:hover {
  background: var(--tokidoki-gray-3);
  color: var(--cocoon-white-color);
}

figure.wp-block-table table {
  margin-left: auto;
  margin-right: auto;
}

table:not(.has-border-color) th,
table:not(.has-border-color) td,
table:not(.has-border-color) thead {
  border-color: var(--tokidoki-gray-2);
}
table:not(.has-border-color) :where(th, td) {
  border-color: var(--tokidoki-gray-2);
}

.video-container,
.instagram-container,
.facebook-container,
.twitter-tweet {
  margin-left: auto;
  margin-right: auto;
}

.product-item-title-link {
  font-weight: 600;
}

.label-box-label-text,
.caption-box-label,
.tab-caption-box-label {
  font-weight: 600;
}

.blank-box,
.is-style-blank-box-red,
.is-style-blank-box-navy,
.is-style-blank-box-blue,
.is-style-blank-box-yellow,
.is-style-blank-box-green,
.is-style-blank-box-pink,
.is-style-blank-box-orange,
.is-style-sticky-gray,
.is-style-sticky-yellow,
.is-style-sticky-red,
.is-style-sticky-blue,
.is-style-sticky-green,
.booklink-box,
.information,
.question,
.alert,
.ranking-item,
.timeline-box,
.booklink-box,
.kaerebalink-box,
.tomarebalink-box,
.product-item-box,
.box-content {
  border-width: 2px !important;
  border-color: var(--tokidoki-gray-2) !important;
}

.cocoon-block-label-box.not-nested-style > .box-content {
  border-width: 2px !important;
  border-color: var(--tokidoki-gray-2) !important;
}

.blogcard-label {
  color: var(--cocoon-text-color);
}

.product-item-box {
  width: 90%;
}

.box-content > .product-item-box {
  width: 100%;
}

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