@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.3za
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/** 共通 **/
.tablepress {
  --odd-bg-color: #fbfbfb !important;
}

/* カテゴリ「用紙」「封筒」「写真」の関連記事を非表示 */
.categoryid-2 #related-entries,
.categoryid-3 #related-entries,
.categoryid-4 #related-entries {
  display: none;
}

/**/
figcaption,
figure {
  text-align: center;
}

.info {
  padding: 10px 10px 0px;
}

.desc {
  line-height: 1.2;
  font-size: 0.8em;
}

#sitename img {
  width: 300px;
}

.article h2 {
  font-weight: 600;
  margin-top: 3em;
  border-bottom: 3px solid #2595c7;
  background-color: #2595c7cc;
}

.article h2:after {
  left: 0;
  width: 10px;
  height: 100%;
  border-radius: 0;
  background: #0080aa;
}

.article h3 {
  margin-top: 3em;
  padding: 1em 20px;
  border-right: transparent;
  border-top: transparent;
  border-bottom: transparent;
  background-color: #2595c711;
}

.article h4 {
  border-top: none;
  margin-top: 3em;
}

dd {
  margin-bottom: 0;
}

p.meta {
  text-align: right;
}

div[id^="tile-"] .meta .category .first-item a {
  min-width: 100px;
}

.color_red {
  color: #c33;
}

.wp-caption {
  padding-top: 0;
  border: 0;
  background-color: inherit;
}

.waku01 {
  border: 3px solid #ccc;
  border-radius: 5px;
  padding: 10px 20px;
  background-color: #f6f6f6;
}

.waku_youbari {
  border: 2px solid #ccc;
  border-radius: 5px;
  padding: 10px 20px;
}

.moji_waku {
  display: inline-block;
  line-height: 1;
  border: 1px solid #666;
  padding: 7px 15px 5px;
  margin-bottom: 1em;
}

/* spec tabel*/
table {
  box-shadow: 0 0 2px #666;
}

table.spec {
  width: 100%;
}

table.spec th {
  width: 25%;
}

table.spec th,
table.spec td {
  padding: 0.9em;
}

/* list */
dt {
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 1px solid #ccc;
}

dt:not(:first-child) {
  margin-top: 1em;
}

dd {
  margin-left: 2em;
}

dl.spec {
  width: 100%;
  overflow: hidden;
  border: 1px solid #ccc;
  border-top: none;
  background: #f6f6f6;
}

dl.spec dt {
  width: 25%;
  float: left;
  padding: 5px 10px 0 10px;
  border-top: 1px solid #ccc;
  box-sizing: border-box;
}

dl.spec dd {
  margin-left: 25%;
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  background: #fff;
  padding: 5px 10px;
}

dl.spec dd:after {
  display: block;
  content: "";
  clear: both;
}

li.strong {
  font-weight: bold;
  font-size: 1.2em;
}

/**/

tr.center_td td {
  text-align: center;
}

/**/
.gd_border_list div {
  border: 1px solid #666;
  text-align: center;
  margin-left: -1px;
  margin-top: -1px;
  background: #f6f6f6;
  line-height: 1.25;
  padding: 10px;
}

.gd_border_list div a {
  display: block;
  text-decoration: none;
}

.gd_border_list div:hover {
  background-color: #ff9;
}

/* テーブル（tablepress） */

/* テーブル */
table tr:nth-of-type(2n + 1) {
  background-color: transparent;
}

.scrollable-table.stfc-sticky table:not(.wp-calendar-table) tr > *:first-child {
  background-color: rgba(37, 149, 199, 0.1);
}

.scrollable-table.stfc-sticky table thead tr > *:first-child,
.table thead th {
  background-color: #cae2ea !important;
  text-align: center;
}

.table td {
  background-color: transparent;
}

.table tbody th {
  background-color: #f7fafb;
  text-align: center;
}

.table th,
.table td {
  vertical-align: middle;
}

.tbl_waku {
  border: 2px solid #2595c7 !important;
}

.tbl_center td {
  text-align: center;
}

.tbl_mailbin td:nth-child(2) {
  font-weight: bold;
  text-align: center;
}

.tbl_att300 th:nth-child(5) {
  background-color: #cee1bf;
}

.tbl_att300 td:nth-child(5) {
  background-color: #ffc;
}

/**/
ul.tatebou_list {
  margin: 0;
  padding-left: 1em;
}
ul.tatebou_list li {
  display: inline-block;
  margin: 0;
}

ul.tatebou_list li:not(:first-child)::before {
  content: " ｜ ";
}

/* もくじ */
.mokuji ul {
  border: solid 2px #ffb03f;
  padding: 0.5em;
  position: relative;
  margin-top: 2em;
}
.mokuji ul li {
  line-height: 1.5;
  padding: 0.5em 0 0.5em 1.4em;
  border-bottom: dashed 1px silver;
  list-style-type: none !important;
}
.mokuji ul li:last-of-type {
  border-bottom: none;
}
.mokuji ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f138"; /*アイコン種類*/
  font-weight: 900;
  position: absolute;
  left: 0.5em;
  color: #ffb03f;
}
.mokuji ul li:after {
  /*タイトルタブ*/
  background: #ffb03f;
  color: #fff;
  font-weight: bold;
  position: absolute;
  left: -2px;
  bottom: 100%;
  padding: 1px 7px;
  content: "もくじ";
  letter-spacing: 0.05em;
}

#sitename {
  margin: 0;
}

ul#ladmin-v li {
  padding: 6px 0;
}

#mobile-buttons li {
  padding: 4px 10px 4px;
  font-size: 1.3rem;
}

#close {
  padding: 6px 6px;
}

/*------------------------------------
 for RINKER plug-in
------------------------------------ */
/* 外枠 */
div.yyi-rinker-contents {
  margin: 1.5em auto 1.5em;
  width: 90%;
  /* box-shadow: none; */
  /* border: 1px solid #ccc; */
  border-radius: 4px;
}
div.yyi-rinker-contents div.yyi-rinker-box {
  padding: 3% 4% 1.5%;
}

/* 右側全体 */
div.yyi-rinker-contents div.yyi-rinker-info {
  padding: 0 0 0 3%;
  width: 100%;
}
div.yyi-rinker-contents div.yyi-rinker-detail .credit-box {
  display: none !important;
}

/* 外部リンクアイコン */
div.yyi-rinker-contents span.external-icon,
div.yyi-rinker-contents span.internal-icon {
  display: none;
}

/* 商品リンクタイトル */
div.yyi-rinker-contents div.yyi-rinker-title {
  font-weight: 600;
  line-height: 1.3;
}
div.yyi-rinker-contents div.yyi-rinker-title a:hover {
  text-decoration: underline;
}

/* 販売者と金額 */
div.yyi-rinker-contents div.yyi-rinker-detail {
  padding-left: 0;
  margin-top: 0.5em;
  line-height: 1.4;
}

div.yyi-rinker-contents div.yyi-rinker-detail .price-box .price {
  color: #b12704;
  font-size: 1.2em;
}

div.yyi-rinker-contents div.yyi-rinker-detail .price-box .price_at,
div.yyi-rinker-contents div.yyi-rinker-detail .price-box span:nth-child(3) {
  display: none;
}

.price-box:after {
  color: #aaa;
  font-size: 0.9em;
  content: " 〈Amazon調べ〉";
}

/* ボタン */
div.yyi-rinker-contents ul.yyi-rinker-links {
  margin: 10px 0 5px 0;
}
div.yyi-rinker-contents ul.yyi-rinker-links li {
  width: 48%;
  margin: 0.5em 0.5em 0 0;
  box-shadow: none;
  background: #fff;
}

/* ボタンの文字 */
div.yyi-rinker-contents ul.yyi-rinker-links li a {
  border-radius: 4px;
  text-align: center;
  font-weight: normal;
  font-size: 0.8em;
}
div.yyi-rinker-contents ul.yyi-rinker-links li a:hover {
  color: #fff;
  opacity: 1;
}

/* hover前の背景色 */
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonkindlelink,
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink,
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink,
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink {
  background: #ffffff;
}

/* 各ボタン色 */
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonkindlelink a {
  color: #139b45;
  border: 1px solid #139b45;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonkindlelink a:hover {
  background: #139b45;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a {
  color: #f6a307;
  border: 1px solid #f6a307;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:hover {
  background: #f6a307;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a {
  color: #c44540;
  border: 1px solid #c44540;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a:hover {
  background: #c44540;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a {
  color: #51a7e8;
  border: 1px solid #51a7e8;
  letter-spacing: -0.05em;
}
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a:hover {
  background: #51a7e8;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonkindlelink a:hover,
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:hover,
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a:hover,
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a:hover {
  color: #fff;
}

div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:after,
div.yyi-rinker-contents ul.yyi-rinker-links li.rakutenlink a:after,
div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a:after {
  content: "で探す";
}

/*media Queries 768px以下
-----------------------------------------------------------------------------*/

@media screen and (max-width: 768px) {
  /* 外枠 */
  div.yyi-rinker-contents {
    width: 95%;
  }

  div.yyi-rinker-contents div.yyi-rinker-box {
    display: block;
    padding: 4% 5% 3%;
  }

  /* 画像 */
  div.yyi-rinker-contents div.yyi-rinker-image {
    width: auto;
  }

  /* 右側全体 */
  div.yyi-rinker-contents div.yyi-rinker-info {
    padding: 0;
    margin-left: 0px;
  }

  div.yyi-rinker-contents ul.yyi-rinker-links {
    margin: 0;
  }

  /*ボタン*/
  div.yyi-rinker-contents ul.yyi-rinker-links li {
    width: 100%; /*横幅いっぱい*/
    margin: 0.5em 0; /*上下の余白　左右の余白削除*/
  }

  /* ボタン文字 */
  div.yyi-rinker-contents ul.yyi-rinker-links li a {
    font-size: 0.9em;
  }

  div.yyi-rinker-contents ul.yyi-rinker-links li.yahoolink a {
    letter-spacing: 0em;
  }
} /* end of nax-width 768*/

/***************************************/
/** mobiles  **/

.mobiles h3 {
  display: block;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  background-color: #00a0dd;
  margin: 2em 0 10px 0;
  padding: 13px 0 10px 20px;
  border-left: 0;
  border-radius: 5px;
  text-decoration: none;
  line-height: 1;
}

.mobiles h3:after,
.mobiles h4:after {
  opacity: 0;
}

.mobiles .release_date {
  line-height: 1.2;
  font-size: 1em;
  margin: 0 0 20px 0;
  padding: 0 20px;
}

.mobiles img {
  margin: 0 !important;
}

.b-left,
.b-right {
  width: 50%;
  float: left;
}

.b-left {
  padding-left: 10px;
}

.b-right {
  padding-left: 10px;
  padding-right: 20px;
}

.mobile_title {
  font-size: 1.4em;
  margin: 2em 20px 10px 0;
  padding: 0 0 0 0.5em;
  font-weight: bold;
  border-left: 0;
}

dl.mobile_spec {
  line-height: 1.2;
}

dl.mobile_spec dt {
  font-size: 0.7em;
  padding: 1.2em 0 0 0.5em;
  font-weight: 400;
}

dl.mobile_spec dd {
  font-size: 1.4em;
  font-weight: bold;
}

dl.mobile_spec dd .unit {
  font-size: 12px;
  margin-left: 0.25em;
}

.w-25 {
  width: 25%;
}

/**/
.grecaptcha-badge {
  visibility: hidden;
}

/**/
.logo-menu-button img {
  padding: 5px 30px;
}

.footer-bottom-logo img {
  height: 40px;
}

.envelope_group_title {
  font-weight: bold;
  border-bottom: 1px solid #999;
  padding-left: 1em;
  margin-bottom: 1em;
}

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

/*834px以下*/
@media screen and (max-width: 834px) {
  .tagline {
    display: none;
  }

  .article h1 {
    padding-right: 0;
    padding-left: 0;
  }

  .article h2 {
    margin-left: -16px !important;
    width: calc(100% + 32px) !important;
    border-radius: 0;
  }

  .article h3 {
    padding: 0.75em;
  }

  .wfull {
    margin-left: -16px !important;
    width: calc(100% + 32px) !important;
  }

  #gnavi ul.mobile-nav {
    width: 40px;
  }
  .mobile-nav li {
    min-height: 28px;
    line-height: 20px;
  }

  .info {
    text-align: left;
  }
  .footer-bottom {
    margin-top: 0;
  }

  .footer-bottom-logo img {
    height: 35px;
    margin-bottom: 20px;
  }

  .copyright {
    border-top: 1px solid #ccc;
    padding-top: 20px;
  }
}

/*480px以下*/
@media screen and (max-width: 480px) {
  /* table {
		font-size: 0.8em;
	} */

  table.tbl_scroll {
    border: 0 !important;
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .tbl_spc_rev th,
  .tbl_spc_rev td {
    display: block;
  }

  .tbl_spc_rev thead {
    display: flex;
    float: left;
  }

  .tbl_spc_rev thead th:first-child:before {
    padding: 1em;
  }

  .tbl_spc_rev tbody {
    display: flex;
    width: auto;
  }
  .tbl_spc_rev tbody tr {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
  }

  #sitename img {
    width: 220px;
  }

  .mobile_title {
    margin: 1em 20px 10px 0;
    padding: 0;
  }

  .mobiles .release_date {
    padding: 0;
  }

  dl.mobile_spec dt {
    padding-top: 0.1em;
  }

  dl.spec dt {
    width: 100%;
    float: none;
    margin: 0;
  }

  dl.spec dd {
    margin-left: auto;
    border-left: none;
  }

  li.strong {
    font-weight: bold;
    font-size: 1em;
  }
}