
/* テーマ調整
----------------------------------------------- */
#wrapper {
  background: #E8F0CD url(/img/default/haikei1.jpg);
}
#breadcrumb {
  background: #FFF url(/img/capsule-toys/bg-v2.png) center bottom;
}
#breadcrumb ol {
  background: none;
}

#content a:hover img {
  opacity: 0.8;
}



/* トップバナー
----------------------------------------------- */
/* @-webkit-keyframes fluffy {
  0%,
  5%,
  10%,
  25%,
  50%,
  100% { -webkit-transform:translateY(0);
                 transform:translateY(0)
  }
  20%,
  30% { -webkit-transform:translateY(-10px);
                transform:translateY(-10px)
  }
}
@keyframes fluffy {
  0%,
  5%,
  10%,
  25%,
  50%,
  100% { -webkit-transform:translateY(0);
                 transform:translateY(0)
  }
  20%,
  30% { -webkit-transform:translateY(-10px);
                transform:translateY(-10px)
  }
}

#content .capsule .top-bn {
  position: relative;
}
#content .capsule .top-bn .jizen {
  -webkit-animation: fluffy 3s ease infinite;
          animation: fluffy 3s ease infinite;
  position: absolute;
  top: 0;
  right: 25px;
  width: 26.8%;
  max-width: 135px;
}
#content .capsule .top-bn a:hover img {
  opacity: 1;
} */



/* ボタン
----------------------------------------------- */
#content .app-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  padding-top: 1em;
  padding-bottom: 1em;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#content .app-btn li {
  list-style: none;
  margin: 0 1%;
  padding-bottom: 10px;
  width: 31%;
}
#content .capsule {
  padding-top: 0;
}
#content .capsule .app-btn li {
  width: 48%;
}


/* 見出し
----------------------------------------------- */
#content h2.heading {
  background: #f2c083;
  color: #333;
}
#content h2.heading {
  background: #1e527e;
  background-image: linear-gradient(90deg, #1e527e 46%, #ffffff 100%);
  padding-left: 3.8em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  height: 100%;
  border: #1e527e 1px solid;
  text-shadow: 1px 1px 0 #1e527e, -1px -1px 0 #1e527e,
  -1px 1px 0 #1e527e,  1px -1px 0 #1e527e,
  1px 0 0 #1e527e, -1px  0 0 #1e527e,
  0 1px 0 #1e527e,  0 -1px 0 #1e527e;
  position: relative;
  margin-top: 1em;
  color: #FFF;
}

/* 買取れるアイテム
----------------------------------------------- */
#content .taishou .kannrenn {
  font-weight: bold;
}
#content .taishou ul.item {
  background-image:
    url(../img/capsule-toys/cabinet-parts1.jpg),
    url(../img/capsule-toys/cabinet-parts2.jpg),
    url(../img/capsule-toys/cabinet-parts2.jpg);
  background-position:
    center top,
    left center,
    right center;
  background-repeat:
    repeat-x,
    repeat-y,
    repeat-y;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  padding: 13px 14px 0;
}
#content .taishou ul.item li {
  background-image:
    url(../img/capsule-toys/cabinet-parts1.jpg),
    url(../img/capsule-toys/cabinet-parts3.jpg);
  background-position:
    center bottom,
    left center;
  background-repeat: repeat-x;
  background-size:
    auto,
    auto 100%;
  text-align: center;
  margin: 0;
  padding: 10px 10px 13px;
  width: calc( 100% / 2 );
}
#content .taishou ul.item li img {
  margin: 0;
}
#content .taishou ul.item li:nth-child(2n+2) {
  background-position:
    center bottom,
    50% center;
}

#content .taishou ul.item li .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  height: 100%;
  -webkit-transition: -webkit-transform 0.3s linear;
  -o-transition: -o-transform 0.3s linear;
  transition: -webkit-transform 0.3s linear;
  -o-transition: transform 0.3s linear;
  transition: transform 0.3s linear;
  transition: transform 0.3s linear, -webkit-transform 0.3s linear;
}
#content .taishou ul.item li .wrapper:hover {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
#content .taishou ul.item li .wrapper:hover img {
  opacity: 1;
}
#content .taishou ul.item li a {
  display: flex;
  flex-direction: column;
  height: 100%;
}
#content .taishou .image {
  max-width: 180px;
  margin: 0 auto;
}
#content .taishou ul.item li a span {
  background: #FFF;
  border-right: 1px #333 solid;
  border-left: 1px #333 solid;
  border-bottom: 1px #333 solid;
  color: #0044b4;
  font-weight: bold;
  display: block;
  padding: 2px 10px;
  position: relative;
}
#content .taishou ul.item li a span:after {
  background: #FFF;
  background: -webkit-gradient(linear, left top, right top, from(#333333),color-stop(30%, #ffffff),color-stop(70%, #ffffff),to(#333333));
  background: -o-linear-gradient(left, #333333 0%,#ffffff 30%,#ffffff 70%,#333333 100%);
  background: linear-gradient(to right, #333333 0%,#ffffff 30%,#ffffff 70%,#333333 100%);
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
}
#content .taishou ul.item li .txt {
  border-right: 1px #333 solid;
  border-left: 1px #333 solid;
  border-bottom: 1px #333 solid;
  background: #FFF;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: left;
  padding: 2px 10px;
}



/* アイテムブロック */
.categorise {
  padding: 0.5em;
  padding: 10px 10px 10px 10px;
}
.categorise ul {
background-color: #dbecfb;
clear: both;
display: flex;
flex-wrap: wrap;
margin: 0 auto  !important;
padding: 2em 1em;
overflow: auto !important;
border-radius: 5px;
gap: 1em;
}
.categorise  ul li {
float: none !important;
width: calc(33.33% - 30px) !important;
text-align: center;
box-sizing: border-box;
padding: 0;
background-color: #C0D1DF;
}
.categorise ul.with-link li:hover {
background: #CEE1FF;
}
.categorise ul li:hover {
background: #C0D1DF;
}
.categorise ul li a {
color: #333;
display: block;
}
.categorise ul li a:after {
clear: both;
content: "";
display: block;
}
.categorise ul li span {
color: #000;
display: block;
padding: 1em;
margin-bottom: 0 !important;
text-align: left;
line-height: 1.2em;
}
.categorise ul li  .img-box {
background-color: #FFF;
padding: 1em;
}
.categorise ul li img {
float: none;
width: 100% !important;
background-color: #FFF;
}

/*CTA
----------------------------------------------- */
  .capsule-toys-cta li p {
  font-family: "Hiragino Maru Gothic Pro", "M PLUS Rounded 1c", "Rounded Mplus 1c", sans-serif;
  font-weight: bold;
  font-size: 1rem;
  text-align: center;
  margin: 4px 0 0;
  -webkit-text-stroke: 3px #fff;
  paint-order: stroke fill;
}

/* TEL */
.capsule-toys-cta li:nth-child(1) p {
  color: #f09b00;
}

/* フォーム */
.capsule-toys-cta li:nth-child(2) p {
  color: #539bea;
}

/* LINE */
.capsule-toys-cta li:nth-child(3) p {
  color: #00b700;
}


/* qa
----------------------------------------------- */

/*
.qa_box .sbcontents {
  display: none;
}
*/




/* 専門スタッフからのご案内
----------------------------------------------- */
.capsule-about .imagebox {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1em;
}

.capsule-about .imagebox > div {
  flex: 0 0 calc((100% - 1.5rem) / 4);
}

.capsule-about .imagebox img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .capsule-about .imagebox > div {
    flex-basis: calc((100% - 0.5rem) / 2);
  }

  .capsule-about .imagebox img {
    aspect-ratio: 4 / 3;
    height: auto;
    object-fit: cover;
  }
}



/* ジャーナル記事
----------------------------------------------- */



/* MOREボタン
----------------------------------------------- */
#content .box .more {
  text-align: center;
}
#content .box .more a {
  background: #2e9b28;
  border-radius: 14px;
  color: #FFF;
  display: inline-block;
  text-align: center;
  line-height: normal;
  margin: 0;
  padding: 0.5em 0;
  width: 80%;
}
#content .box .more a:hover {
  opacity: 0.8;
}

/* MOREボタン
----------------------------------------------- */
.responsive-image img {
  width: 100%;
}

/* ３つの買取案内ブロック
----------------------------------------------- */
@media (max-width: 600px) {
    #content .houhou .decorative-image {
        margin-bottom: 0;
        /* text-align: center; */
        display: flex;
        justify-content: center;
    }
}

/* mobile （w690px 未満）
----------------------------------------------- */
@media (max-width:689px){

  /* スマホで非表示 */
    #content .pc-on {
      display: none;
    }



  /* アイテムブロック */
  .categorise ul li {
      flex-direction: column;
      text-align: center;
      flex: 0 1 calc(50% - 8px);
  }
  .categorise ul li img {
      float: none;
      margin-bottom: 0.5em;
      margin-right: 0;
      width: 180px !important;
  }
  #content .taishou .image {
    max-width: unset;
  }
  #content h2.heading {
    padding-left: 0.5em;
  }
    /* お客様の声 */
    #content [id*="-review"] h2.heading {
      font-size: 24px;
      padding: 0.5em 1em 0.5em 1em;
      margin: 0 auto;
      width: 60%;
      color: #1e527e;
      text-align: center;
      background-color: rgba(255,255,255,0.6);
      border: none;
      background-image: none;
      text-shadow: none;
      font-weight: bold;
      text-shadow: 2px 2px 2px 	#C0D1DF,
                  4px 4px 5px  #c9c9c9;
      margin-bottom: 1rem;
    }
    #content [id*="-review"] {
      border: 9px solid #1e527e;
      padding: 1em 0.5em 1em;
      margin-top: 5em;
      border-radius: 5px;
      background:repeating-linear-gradient(
      -45deg,
    #DAE4EC,
    #DAE4EC 5px,
    #F9FBFC 5px,
    #F9FBFC 10px);
    }
    #content [id*="-review"] .total_rating {
      border: none;
      background:rgba(255,255,255,0.6);
    }
    .box[id*="review"] h2:after {
      content: unset;
  }

} /* max689 */




/* PC （w690px 以上）
----------------------------------------------- */
@media only screen and (min-width: 690px){

  /* PCで非表示 */
    #content .sp-on {
      display: none;
    }

  /* テーマ調整 */
  #breadcrumb {
    background: none;
  }

  /* ボタン */
  #content .app-btn li {
    width: 26%;
  }
  #content .capsule .app-btn li {
    width: 23%;
  }

  /* 見出し */
    #content .capsule h1 span {
        font-size: 2em;
    }

  /* 買取れるアイテム */
  #content .taishou .kannrenn {
    font-size: 1.5em;
  }
  #content .taishou ul.item li,
  #content .taishou ul.item li:last-child {
    padding-right: 10px;
    padding-left: 10px;
    width: calc( 100% / 3 );
  }
  #content .taishou ul.item li:nth-child(3n+1) {
    background-position:
      center bottom,
      left center;
  }
  #content .taishou ul.item li:nth-child(3n+2) {
    background-position:
      center bottom,
      calc( 100% / 3 ) center;
  }
  #content .taishou ul.item li:nth-child(3n+3) {
    background-position:
      center bottom,
      right center;
  }

  /* 専門スタッフからのご案内 */
  .capsule-about h3 {
    text-align: center;
  }


    /* h2見出し装飾 カートイへおまかせ！*/
  #content #capsule-toys-omakase h2.heading::after,
  #content #capsule-toys-qa h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_001.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
    }

  /* h2見出し装飾 こんなアイテムを買取しています*/
  #content #capsule-toys-kaitori h2.heading::after,
  #content .toiawase h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_002.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
    }

  /* h2見出し装飾 メーカーはこちら */
  #content #capsule-toys-capsule-many h2.heading::after,
  #content #capsule-toys-about h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_003.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }

  /* h2見出し装飾 メーカー別 プラモデル買取価格表 */
  #content #capsule-toys-taishou h2.heading::after,
  #content #item-categories h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_004.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }

  /* h2見出し装飾 メーカー別 プラモデル買取価格表 */
  #content #capsule-toys-point h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_005.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }

  /* h2見出し装飾  プラモデル買取実績*/
  #content #capsule-toys-result h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_006.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }
  /* h2見出し装飾  お客様の声*/
  #content .box[id*="review"] h2:after {
      width: 10%;
      left: 10px;
  }

  /* h2見出し装飾  全国から手数料無料で買取受付中！*/
  #content #capsule-toys-area h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_007.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }
  /* h2見出し装飾  ３つの買取方法のご案内*/
  #content #method-flow-image h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_008.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
  }
  /* h2見出し装飾  買取価格表＆アイテム一覧*/
  #content .clearfix h2.heading::after {
    position: absolute;
    top: 50%;
    left: -2%;
    width: 128px;
    height: calc(10vw);
    max-height: 34px;
    content: "";
    background-image: url(/img/capsule-toys/pramo_bar_10.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transform: translateY(-50%);
  }
    /* h2見出し装飾  よくある質問　プラモデル編*/
    #content #capsule-toys-qa h2.heading::after {
    position: absolute;
    content: "";
    background-image: url(/img/capsule-toys/capsule_70x55_001.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    top: 50%;
    left: -2%;
    border-top: none;
    width: 128px;
    height: calc(10vw);
    max-height: 50px;
    transform: translateY(-50%);
    }
    #content .box[id*="review"] h2 {
      padding-left: 3.8em;
    }

}/* Eo min690 */




/* layout用（w1000px 以上）
----------------------------------------------- */
@media only screen and (min-width: 1000px){

  /* 買取れるアイテム */
    #content .taishou ul.item li a span,
    #content .taishou ul.item li .txt {
      max-width: 180px;
      margin-right: auto;
      margin-left: auto;
      width: 100%;
    }

}/* Eo min1000 */

.capsule-toys-cta {
  display: flex;
  justify-content: center;
  gap: 1em;
  /* margin-top: 2em; */
}

.capsule-lead { 
  display: flex;
  align-items: center;
  gap: 40px;
}

.contact-box {
  margin: 1.5rem 0;
}

.image-text {
  flex: 1;
}

.decorative-image {
  width: 40%;
}

.decorative-image img {
  width: 100%;
  display: block;
}



@media (max-width: 768px) {

  .capsule-lead {
    flex-direction: column;
    gap: 1rem;
  }

  .decorative-image {
    display: block;
    margin-inline: auto;
    width: auto !important;
    text-align: center;
  }

  .decorative-image img {
    width: min(40vw, 200px) !important;
  }
}

.capsule-items {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding: 0;
  margin: 0 0 10px;
  list-style: none;
}

.capsule-items > li {
  box-sizing: border-box;
  text-align: center;
}

.capsule-items img {
  max-width: 100%;
  height: auto;
  display: block;
  margin-inline: auto;
}

/* PC：3列 */
@media only screen and (min-width: 690px) {
  .capsule-items > li {
    flex: 0 0 calc((100% - 40px) / 3);
    max-width: calc((100% - 40px) / 3);
margin-left: 0px !important;
  }
}

/* スマホ：1列 */
@media only screen and (max-width: 689px) {
  .capsule-items {
    flex-direction: column;
  }

  .capsule-items > li {
    flex: 0 0 100%;
    max-width: 100%;
  }
}