@charset "UTF-8";

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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/*############################## Basic ##############################*/
/*==================== Whole ====================*/
/*---------- Author Info ----------*/
.author-info{
  display: none;
}
/*---------- Date ----------*/
.page .date-tags .post-date{
  display: none;
}
.page .date-tags .post-update{
  display: none;
}
/*---------- List Style ----------*/
ul > li > ul {
  list-style-type: circle;
}
ul > li > ul > li > ul {
  list-style-type: square;
}
ul.lvg-list > li,
ol.lvg-list > li {
  font-weight: bold;
//  color: #040;
}
ul.lvg-list > li > ul > li,
ul.lvg-list > li > ol > li,
ol.lvg-list > li > ul > li,
ol.lvg-list > li > ol > li {
  font-weight: initial;
//  color: initial;
}
ul.lvg-list-2nd > li > ul > li,
ul.lvg-list-2nd > li > ol > li,
ol.lvg-list-2nd > li > ul > li,
ol.lvg-list-2nd > li > ol > li {
  font-weight: bold;
}
ul.lvg-list-2nd > li > ul > li > ul > li,
ul.lvg-list-2nd > li > ul > li > ol > li,
ul.lvg-list-2nd > li > ol > li > ul > li,
ul.lvg-list-2nd > li > ol > li > ol > li,
ol.lvg-list-2nd > li > ul > li > ul > li,
ol.lvg-list-2nd > li > ul > li > ol > li,
ol.lvg-list-2nd > li > ol > li > ul > li,
ol.lvg-list-2nd > li > ol > li > ol > li {
  font-weight: initial;
}

/*==================== Header ====================*/
/*---------- Global Navi Menu (PC) ----------*/
.header-container .menu-header {
  font-weight: bold;
}
.navi-in .sub-menu .menu-item {
  height: 3em;
  background-color: #509060;
}
.navi-in .sub-menu .item-label {
  font-size: 90%;
/*
  text-shadow:
    1px  1px 2px #588868,
   -1px  1px 2px #588868,
    1px -1px 2px #588868,
   -1px -1px 2px #588868,
    1px  0px 2px #588868,
    0px  1px 2px #588868,
   -1px  0px 2px #588868,
    0px -1px 2px #588868;
*/
}

/*
.navi-in a {
  color: #333;
  text-decoration: none;
  display: block;
  font-size: 16px;
  transition: all 0.3s ease-in-out;
}

.navi-in > ul li {
  display: block;
  width: 176px;
  height: 60px;
  line-height: 60px;
  position: relative;
}
*/

/*---------- Header / Footer Mobile Button (mobile) ----------*/
/*--- Color ---*/
.mobile-header-menu-buttons {
  background: #50b060;
  color: #fff;
}
.mobile-footer-menu-buttons {
//  background: #f7fff0;
  background: #d7f0d0;
  color: #000;
}
/*--- Caption ---*/
.mobile-header-menu-buttons .menu-caption {
  display: none;
}
.mobile-footer-menu-buttons .menu-caption {
//  display: none;
}
/*--- Layout ---*/
.mobile-header-menu-buttons .menu-button {
  width: initial;
}
.logo-menu-button {
//  flex-grow: initial;
  margin-left: 10px;
//  margin-right: auto;
//  border: 1px solid #f00;
//	text-align:left;
}
.mobile-header-menu-buttons .menu-button {
  justify-content:left;
}
.mobile-header-menu-buttons .logo-menu-button img.site-logo-image {
//  border: 1px solid #00f;
}
.search-menu-button, .navi-menu-button {
  padding-left: 15px;
  padding-right: 15px;
  width: 50px;
}
.navi-menu-button {
  margin-right: 10px;
}

/*==================== Footer ====================*/
.footer-bottom-content .source-org.copyright {
  font-size: x-small;
}

.navi-footer a {
  font-size: small;
}

/*==================== Index ====================*/
.index-tab-buttons .index-tab-button {
  padding: 8px 16px;
//  font-size: 14px;
//  margin: 2px;
  border-radius: 5px;
  background-color: #e0f0d0;
  border: 1px solid #e0f0d0;
//  width: 100%;
//  text-align: center;
}

#index-tab-1:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-1"],
#index-tab-2:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-2"],
#index-tab-3:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-3"],
#index-tab-4:checked ~ .index-tab-buttons .index-tab-button[for="index-tab-4"] {
  background: none #50b060;
  border: 1px solid #50b060;
}

/*==================== Title ====================*/
.entry-title {
}

/*---------- page ----------*/
.page .entry-title {
  font-size: 200%;
  text-align: center;
  padding: 1em 0.8em;
  color: #ffffff;
//  background-color: #50b060;
  background-color: #5f514b;
}
/*---------- post ----------*/
.post .entry-title {
  font-size: 200%;
  text-align: left;
  color: #333333;
}

/*==================== Heading ====================*/
.entry-content h2 {
  margin-bottom: 1.5em;
  padding: 0.7em;
  color: #000000;
/*  background: #fffaf4;*/
  background: #f3f3f3;
/*  background: #faf8f6;*/
//  border-left: solid 12px #439b25;
  border-left: solid 12px #50b060;
  border-right: 0px;
  border-top: 0px;
  border-bottom: 0px;
}

.entry-content h3 {
  margin-bottom: 1.5em;
  padding: 0.6em;
  color: #000000;
//  border-left: solid 8px #63cb65;
  border-left: solid 8px #50b060;
  border-right: 0px;
  border-top: 0px;
  border-bottom: 0px;
}

.entry-content h4 {
  margin-bottom: 1.5em;
  padding: 0.2em 0.1em;
  background: transparent;
/*  border-left: solid 5px #63cb65;*/
  border-top: 0px;
  border-bottom: solid 3px #63cb65;
}

/*==================== Side bar ====================*/
/*---------- Whole ----------*/
#sidebar .widget {
  font-size: 80%;
}
#sidebar .widget-sidebar-title {
  background-color: #807060;
}
/*---------- Category Widget ----------*/
/*--- List ---*/
#sidebar .widget_categories > ul > li {
//  padding: 0 0 0 10px;
}
#sidebar .widget_categories > ul > li a {
  padding: 5px 10px;
}
/*--- Icon of parents ---*/
#sidebar .cat-item a::before {
  font-family: "Font Awesome 5 Free";
  content: "\f07b";
  font-weight: 900;
  color: #a0a0a0;
  margin-right: 6px;
}
/*--- Icon of children ---*/
#sidebar .cat-item .children a::before {
  font-family: "Font Awesome 5 Free";
  content: "\f07b";
  font-weight: 900;
//  font-weight: 400;
  color: #d0d0d0;
  margin-right: 6px;
}
/*--- Anchor & Hover ---*/
#sidebar aside li.cat-item a {
//  font-size: 15px;
//  padding: 6px;
}
#sidebar aside li.cat-item a:hover {
  background-color: #ffeedd;
//  color: #ca8004;
  color: #c08000;
  font-weight: bold;
}
/*--- Number of posts ---*/
/*
#sidebar aside li.cat-item span {
  float: right;
  line-height: 1;
  padding: 6px;
  border-radius: 50%;
  color: #fff;
  background: #ca8004;
}
*/
/*--- Uncategorized ---*/
#sidebar .cat-item-1 {
  display: none!important;
}

/*---------- Popular Article Widget ----------*/
#sidebar .popular-entry-card-title {
  font-size: 80%;
}

/*---------- Custom HTML Widget ----------*/
/*--- Manga ---*/
#sidebar .lvg_manga {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
/*
#sidebar .twitter-timeline {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
*/

/*==================== Table ====================*/
/*---------- Cocoon ----------*/
/*-- Disable auto-changing odd&even lines background color  */
.container table tr {
  background-color: transparent;
}

/*==================== Image ====================*/
.lvg-img {
  width: 90%;
  margin: auto;
  text-align: center;
}
.lvg-anime {
  width: 50%;
  margin: auto;
  text-align: center;
}
.lvg-img-small {
  width: 50%;
  margin: auto;
  text-align: center;
}
.lvg-img-title {
  font-weight: bold;
  text-align: center;
}

/*==================== Timeline ====================*/
.timeline-title {
  margin-bottom: 0.5em;
  padding: 0.2em;
  font-size: 120%;
  background-color: #eef0e5;
}

.timeline-item-title {
  color: #060;
}

.timeline-item-label {
  color: #060;
}

.timeline-item-snippet {
  font-size: 80%;
}

/*==================== Notes ====================*/
/* instead of 'footnotes' plugin */
.lvg-notes {
  list-style: none;
  counter-reset: num;
  font-size: 80%;
}
.lvg-notes > li {
  position: relative;
  padding-left: 3em;
}
.lvg-notes > li::before {
  position: absolute;
  left: 0;
  counter-increment: num;
  content: "(*" counter(num,decimal) ") : ";
}

/*==================== Code ====================*/
/*---------- Whole ----------*/
.wp-block-code code {
  white-space: pre !important;
  padding-left: 1em; }

.wp-block-code::before {
  border-right: thin solid #606060; }

/*---------- No code (pre without code) ----------*/
.is-code-row-number-enable pre.lvg-nocode::before {
  content: none;
  /*delete number*/ }

.is-code-row-number-enable pre.lvg-nocode {
  padding: 0.5em;
  /*adjust space*/
  color: initial;
  background-color: initial; }

/*---------- No number ----------*/
.is-code-row-number-enable pre.lvg-code-nonum {
  padding: 0.5em;
  /*adjust space*/ }

.is-code-row-number-enable pre.lvg-code-nonum::before {
  content: none;
  /*delete number*/ }

/*---------- Title ----------*/
.lvg-code-title code::before {
  position: absolute;
  padding: 1px 0.8em;
  top: 0;
  left: 0;
  z-index: 2;
  border-radius: 4px 0 4px 0;
  border: 2px solid #000;
  content: attr(codetitle);
  font-family: system-ui;
  font-size: 0.9em;
  font-weight: bold;
  background: #eee;
  color: #000; }

.lvg-code-title code {
  margin-top: 28px; }

.lvg-code-title::before {
  margin-top: 28px; }

/*
.hljs::before {
  padding: 2em;
  border-radius: 10px;
}
*/
/*---------- Copy Button ----------*/
.lvg-code-copybtn {
  position: absolute;
  margin: 4px;
  top: 0px;
  right: 0px;
  padding: 0px 6px 0px;
  border: none;
  border-radius: 20%;
  font-size: 18px;
  color: #ccc;
  background-color: #000;
  opacity: 0.9;
  transition: 0.3s; }

.lvg-code-copybtn:hover {
  cursor: pointer;
  color: #fff;
  opacity: 1; }

.lvg-code-copybtn:hover:fucus {
  background-color: #ccc; }

.lvg-code-copybtn:hover:active {
  background-color: #ccc; }

.lvg-code-copybtn::before {
  font-family: "Font Awesome 5 Free";
  content: "\f0c5";
  background-color: transparent; }

/*---------- Copy Button Notice ----------*/
.lvg-code-copybtn-notice {
  position: absolute;
  visibility: hidden;
  pointer-events: none;
  z-index: 1;
  top: 5px;
  right: calc(100% + 4px);
  padding: 2px 6px 0px;
  border-radius: 3px;
  font-weight: bold;
  font-size: 13px;
  color: #000;
  background: #fff; }

.lvg-code-copybtn-notice-after {
  visibility: visible; }

/*==================== Blog Card ====================*/
/*---------- Whole ----------*/
.blogcard-type {
  padding-top: 10px;
}

/*---------- SNS Share/Follow ----------*/
#main .button-caption {
  display: none;
}

/*---------- SNS Share ----------*/
.sns-share-message{
  font-weight: bold;
  color: #875d5b;
}
.sns-share-buttons {
  flex-wrap: nowrap;
  justify-content: center;
}
.sns-share-buttons a {
//  border-radius: 50%;
  font-size: 20px;
  margin: 0 10px;
}
#main .sns-share a {
  width: 40px;
  height: 40px;
}

/*---------- SNS Follow ----------*/
.sns-follow-message{
  font-weight: bold;
  color: #875d5b;
}
.sns-follow-buttons {
  justify-content: center;
}
.sns-follow-buttons a {
//  border-radius: 50%;
  font-size: 20px;
  margin: 0 10px;
}
#main .sns-follow a {
  width: 40px;
  height: 40px;
}

/*==================== reCAPTCHA ====================*/
/*---------- Whole ----------*/
.grecaptcha-badge {
  visibility: hidden;
}
/*---------- for Contact Page ----------*/
.recaptcha_policy {
  padding: 0;
  margin: 0;
  text-align: center;
  font-size: 0.9em;
  color: #808080;
}
.recaptcha_policy a {
}

/*==================== Advertisement ====================*/
/*---------- Whole ----------*/
.lvg-ad-btn-frame {
  margin: 2.5em auto 0;
  width: 90%;
  border: thin solid #c0c0c0;
  border-radius: 10px;
}
.lvg-ad-btn-description {
  margin: 0.7em 1.5em 1.5em;
  font-weight: bolder;
  font-size: 0.9em;
}
.lvg-ad-btn-btns {
  margin: 0 1.5em 0.2em;
  text-align: center;
}
/*---------- Button ----------*/
.lvg-ad-btn > a {
  width: 95%;
}
.lvg-ad-btn > a::after {
  font-family: "Font Awesome 5 Free";
  content: "\f105";
  position: absolute;
  right: 0;
  font-size: 1.5em;
}
/*---------- Settings for Advertisers ----------*/
.lvg-ad-btn.lvg-ad-btn-amazon > a {
  background-color: #ff9900;
}
.lvg-ad-btn.lvg-ad-btn-rakuten > a {
  background-color: #c02524;
}
.lvg-ad-btn.lvg-ad-btn-yahoo > a {
  background-color: #5090d0;
}

/*==================== Link Grid (Original) ====================*/
.lvg-linkgrid-frame {
}
.lvg-linkgrid-frame a, .lvg-linkgrid-frame a:hover {
  text-decoration: none;
}

.lvg-linkgrid-item {
  margin: 0 1em 2em;
  padding: 0.5em;
  background-color: #ffffff;
  transition: all .3s ease;
}
.lvg-linkgrid-item:hover {
  box-shadow: 0 0 20px #000000;
}
.lvg-linkgrid-item-nolink {
  margin: 0 1em 2em;
  padding: 0.5em;
  background-color: #ffffff;
}

/*
 * Resize the image to use in LinkGrid to a 3:2 aspect ratio.
 */
.lvg-linkgrid-img {
  text-align: center;
}
.lvg-linkgrid-img img {
  width: 100%;
  background-color: #ffffff;
}

.lvg-linkgrid-title {
  font-weight: bold;
  font-size: 110%;
  color: #000000;
}

.lvg-linkgrid-text {
  min-height: 6em;
  /*@ max 3 lines*/
  font-size: 85%;
  color: #000000;
}

.lvg-linkgrid-seemore {
  text-align: right;
  font-weight: bold;
//  font-size: 85%;
  color: #30a0f0;
}

/*==================== Showmore Button (Original) ====================*/
.lvg-btn-showmore {
  > a {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 260px;
    padding: 4px 25px;
    border: 2px solid #666;
    border-radius: 50px;
    text-decoration: none;
    font-size: 80%;
    font-weight: bold;
    color: #666;
    background: #fff;
    transition: 0.3s ease-in-out;
  }

  > a::before {
  }
  > a::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    width: 5px;
    height: 5px;
    border-radius: 1px;
    border-top: 3px solid #666;
    border-right: 3px solid #666;
    transform: rotate(45deg) translateY(-50%);
    transition: 0.3s ease-in-out;
  }

  > a:hover {
    background-color: #f7fff0;
    color: #333;
  }
  > a:hover::before {
  }
  > a:hover::after {
//    border-color: #50b060;
  }
}

/*############################## Plugin ##############################*/
/*==================== [Plugin] TOC+ ====================*/
/*---------- Whole ----------*/
#toc_container {
  display:table;
  min-width: 60%;
  margin-left: auto;
  margin-right: auto;
  background-color: #fefefe;;
  border: 1px solid #c0c0c0;
  border-radius: 3px;
  font-size: 90%;
  counter-reset: num01;
}

/*---------- Title ----------*/
#toc_container .toc_title {
  margin: 0;
  padding: 0.5em;
  text-align: center;
  color: #303030;
  border-bottom: 1px dotted #c0c0c0;
}

/*---------- Toggle ----------*/
#toc_container .toc_toggle a{
  text-decoration: none;
  font-size: 90%;
  font-weight: normal;
  color: #a0a0a0;
}
#toc_container .toc_toggle a:hover {
  text-decoration: underline;
  color: #a0c0a0;
}

/*---------- List(common) ----------*/
/*--- Whole ---*/
#toc_container ul.toc_list {
  padding: 1em 2em;
}
#toc_container ul.toc_list li{
  position: relative;
  margin: 0;
  padding: 0;
  font-size: 94%;
  font-weight: normal;
}
/*--- Disable bullets to define in theme ---*/
#toc_container ul.toc_list, .toc_list ul {
  list-style: none;
}

/*---------- Contents List(link) ----------*/
/*--- Text Color ---*/
#toc_container ul.toc_list a,
#toc_container ul.toc_list a:visited {
  color: #5f7b96;
}
/*--- Common ---*/
#toc_container ul.toc_list li a {
  display: inline-block;
  text-decoration: none;
  margin-left: 0.5em;/*spacing between bullet and text*/
  transition: all .3s ease;/*behavior on hover*/
}
#toc_container ul.toc_list li a:hover {
  text-decoration: none;
  box-shadow: 0 1.5px;
}

/*---------- Contents List(1st layer) ----------*/
/*-- Whole --*/
#toc_container ul.toc_list > li {
}
/*--- Bullet [number(ordered)] ---*/
#toc_container ul.toc_list > li::before {
  counter-increment: num01;
  content: counter(num01);
  font-weight: normal;
  text-align: center;
  color: #ffffff;
  background-color: #608070;
  border-radius: 50%;
  padding-right: 0.5em;/*oval shape*/
  padding-left: 0.5em;/*oval shape*/
}
/*--- Link part(set purposely not to LI but A for margin adjustment) ---*/
#toc_container ul.toc_list > li > a {
  font-weight: bold;
  margin-left:0.4em;
}

/*---------- Contents List(from 2nd layer) ----------*/
/*--- Whole ---*/
#toc_container ul.toc_list > li ul {
  margin-bottom: 0.5em;
  padding-left: 2.5em;
}
#toc_container ul.toc_list > li ul li {
}
/*--- Bullet [symbol] ---*/
#toc_container ul.toc_list > li ul li::before {
  position: absolute;
  font-family: "Font Awesome 5 Free";
  content: '\f105';
  font-weight: 900;
  color: #608070;
  top: 0.08em;/*position adjustment of 'content'*/
}
/*--- Link part(set purposely not to LI but A for margin adjustment) ---*/
#toc_container ul.toc_list > li ul li a {
  font-weight: normal;
  margin-left:0.8em;
}

/*==================== [Plugin] Contact Form 7 ====================*/
/*------ Whole ------*/
/*--- Frame ---*/
.wpcf7 .inquiry th {
  padding-right: 5px;
  width: 30%;
  text-align: left;
  color: #444444;
  background-color: #f7f7f7;
  border: solid 1px #d7d7d7;
}
.wpcf7 .inquiry td {
  background-color: #ffffff;
  border: solid 1px #d7d7d7;
}
.wpcf7 .inquiry tr, .wpcf7 table {
  border: solid 1px #d7d7d7;
}
/*--- Icons ---*/
.wpcf7 .mandatory {
  position: relative;
  margin-right: 5px;
  bottom: 1px;
  padding: 1% 2% 2% 2%;
  font-size: 80%;
  color: #ffffff;
  background-color: #ff9393;
  border-radius: 2px;
}
.wpcf7 .optional {
  position: relative;
  margin-right: 5px;
  bottom: 1px;
  padding: 1% 2% 2% 2%;
  font-size: 80%;
  color: #ffffff;
  background-color: #93c9ff;
  border-radius: 2px;
}
/*--- Send button ---*/
.wpcf7 #formbtn {
  display: block;
  margin-top: 30px;
  padding: 0.5em 0;
  width: 25%;
  color: #ffffff;
  background-color: #7bc17a;
  font-size: x-large;
  font-weight: bold;
  border-radius: 2px;
  border: none;
}
.wpcf7 #formbtn:hover {
  background-color: #ffaa66;
  color: #ffffff;
}

/******* Responsive *******/
@media(max-width:500px) {
  /*--- Frame ---*/
  .wpcf7 .inquiry th, .wpcf7 .inquiry td {
    display: block!important;
    width: 100%!important;
    border-top: none!important;
    -webkit-box-sizing: border-box!important;
    -moz-box-sizing: border-box!important;
    box-sizing: border-box!important;
  }
  .wpcf7 .inquiry tr:first-child th {
    border-top: 1px solid #d7d7d7!important;
  }
  /*--- Icons ---*/
  .wpcf7 .inquiry .mandatory, .wpcf7 .inquiry .optional {
    font-size: 10px;
  }
}

/*==================== [Plugin] footnotes  ====================*/
/* Setting in "Custom CSS" on footnotes settings */



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

  /*==================== Title ====================*/
  .entry-title {
    font-size: 150%!important;
  }

  /*==================== Image ====================*/
  .lvg-anime {
    width: 80%;
  }

  .lvg-img-small {
    width: 80%;
  }
  /*==================== Code ====================*/
  /*---------- Button ----------*/
  .lvg-code-copybtn {
    margin: 3px;
//    top: 3px;
//    right: 3px;
    padding: 0px 6px 0px;
    font-size: 14px;}
  /*--- Button notice ---*/
  .lvg-code-copybtn-notice {
    top: 1px;
    right: calc(100% + 2px);
    padding: 2px 6px 0px;
    border-radius: 3px;
    font-size: 11px;
  }
}

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

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

  /*==================== Link Grid (Original) ====================*/
  .lvg-linkgrid-title {
    font-size: 130%;
  }
  .lvg-linkgrid-text {
    font-size: 100%;
  }

  /*==================== [Plugin] TOC+ ====================*/
  /* もとは @media only screen and (max-width: 667px) 用だった */
  #toc_container{
    width: 100%!important;
  }
  #toc_container ul.toc_list {
    padding-left: 3vw;
    padding-right: 3vw;
  }
  #toc_container ul.toc_list > li > ul {
  }
  #toc_container ul.toc_list > li ul li::before {
    top: 0;
  }
}

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