/* カスタマイズ用CSS */

/* ベース要素 */
body {
    -webkit-print-color-adjust: exact;
  }
.ec-role {
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 1.6;
    color: #333;
    -webkit-text-sizev-adjust: 100%;
    width: 100%;
    max-width: 930px;
}
@media screen and (min-width: 1024px) {
    .ec-role {
        width: calc(100% - 270px);
        margin-left: 30px;
        margin-right: 0;
    }
}
@media screen and (min-width: 1348px), print{
    .ec-role {
        width: 930px;
        margin-right: 0;
        margin-left: auto;
    }
}
.ec-pageHeader{
    margin-bottom:20px;
}
.ec-pageHeader h1{
    margin-bottom: 30px;
    padding-bottom: 10px;
    border-bottom: 3px solid #00cccc;
    color: #222;
    font-size: 2.2rem;
}
.ec-off1Grid{
    display: block;
    margin-bottom: 2em;
}
.ec-off1Grid a{
    color: #337ab7;
    text-decoration: underline;
}
.ec-off1Grid a:hover{
    color: #00cccc;
    text-decoration: none;
}
@media print{
    .tracking-nav {
        display: none;
    }
}
/* レスポンシブ切り替え */
.pc{
    display: none;
}
@media screen and (min-width: 600px){
    .pc{
        display: block;
    }
    .sp{
        display: none;
    }
}

/* ブレイクポイント変更 */

@media screen and (min-width: 1024px) {
    .content {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin: 0 auto;
        max-width: 100%;
    }
    .content--left {
        display: block;
        width: 240px;
    }
    .content--right-none {
        width: calc(100% - 270px);
        margin-left: 30px;
        margin-right: 0;
    }
    .main-header .category__nav {
        display: none;
    }
    .link-unit {
        overflow: unset;
        margin-bottom: 20px;
    }
    .link-unit__inr{
        gap:15px;
    }
    .block-detail__contents {
        width: calc(100% - 420px);
        padding: 40px 30px;
        margin-left: 20px;
    }
}
@media screen and (min-width: 1024px) and (max-width: 1347px)  {
    .content {
        justify-content: center;
    }
    .content--main{
        margin-left: 30px;
        margin-right: 0;
    }
}
@media screen and (max-width: 1240px)  {
    .content {
        padding: 0 15px;
        width: 100%;
        margin: 0;
    }
}
@media screen and (min-width: 1024px) and (max-width: 1220px) {
    .block-detail__item {
        display: block;
    }
    .block-detail__item__count__form {
        margin-top: 10px;
        font-size: 1.6rem;
    }
    .block-detail__boxitem {
        flex-wrap: wrap;
    }
    .block-detail__boxitem__name {
        flex: auto;
    }
}
@media screen and (min-width: 600px) and (max-width: 1023px) {
    .link-unit__inr .button__fixed {
        padding-right: 0;
        padding-left: 0;
        margin-right: 0;
        width: calc((100vw - 120px) / 5);
        max-width: 135px;
    }
    .block-productlist__item {
        width: calc((100% - 80px) / 5);
    }
    .block-productlist__item:nth-child(n+3) {
        margin-top: 0;
    }
    .block-productlist__item:not(:nth-child(2n+1)) {
        margin-left: auto;
    }
    .block-productlist__item:not(:nth-child(5n+1)) {
        margin-left: 20px;
    }
    .block-productlist__item:nth-child(n+6) {
        margin-top: 30px;
    }
    .block-productlist__item:nth-child(2n+3):before {
        content: none;
    }
}
/* 配置 */
.mT10{
    margin-top:10px;
}
.mT20{
    margin-top:20px; 
}
.mT30{
    margin-top:30px;
}
.mT40{
    margin-top:40px;
}
.mT50{
    margin-top:50px;
}
.mB10{
    margin-bottom:10px;
}
.mB20{
    margin-bottom:20px;
}
.mB30{
    margin-bottom:30px;
}
.mB40{
    margin-bottom:40px;
}
.mB50{
    margin-bottom:50px;
}
.fL{
    float:left;
}
.fR{
    float:right;
}
/* 文字色 */
.colorRd{
    color: #00cccc;
}
.red_b{
    color: #00cccc;
    font-weight: bold;
}
.txt_defo{
    font-size: 14px;
    margin-top: 0;
}
.txt_emp{
    font-size: 16px;
    font-weight: bold;
}
/* ボタン類 */
.primary-button__priority {
    border: 1px solid #fb781f;
    background: #fb781f;
}
.block-history__order__btns .block-history__order__btn .primary-button{
    border-width: 2px;
    background: #f3f3f3;
    color: #337ab7;
}
.btn_box{
    margin: 60px 0;
    text-align: center;
}
.btn_box .copy{
    margin-bottom: 20px;
    font-size: 22px;
    font-weight: bold;
}
a.btn_basis{
    display: inline-block;
    padding: 10px 20px;
    background-color: #00cccc;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}
a.btn_basis:hover{
    opacity: 0.7;
    text-decoration: none;
}
a.btn_large{
    display: block;
    padding: 16px 34px;
    font-size: 18px;
}
.btn_register{
    margin: 0 auto 20px;
}
@media screen and (min-width: 600px), print{
    .btn_register{
        width: 50%;
    }
    .btn_box .copy{
        font-size: 26px;
    }
}
.linkbtn a{
    text-decoration: none;
}
.linkbtn:hover{
    opacity: 0.7;
}
.grd_btn a{
    background: linear-gradient(to bottom, #f1f1f1 0%, #e8e8e8 100%);
    border: 1px solid #b2b2b2;
    display: inline-block;
    padding: 10px 15px;
    text-decoration: none;
    border-radius: 4px;
    color: #000;
    font-size: 15px;
    text-align: center;
}
/* 商品一覧_ページャーCSS打消し */
.block-productlist__operation {
    position: relative;
}
@media (min-width: 1024px){
    .pager-normal__item a:hover {
        background-color: #00cccc;
    }
}
/* 商品リストカード */
.product-comment,
.product-list__desc{
    color: #888888;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    line-height: 1.4;
    font-size: 1.2rem;
}
.max-line_2 {
    height: 3.2em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* パンクズリスト*/
.breadcrumbs{
    margin-bottom:10px;
    font-size: 13px;
}
.breadcrumbs > li{
    display:inline;
}
.breadcrumbs > li a{
    color:#337ab7;
    text-decoration: underline;
}
.breadcrumbs > li a:hover{
    text-decoration: none;
}
/* ヘッダー・フッター修正*/
.header-lite__wrap{
    display: flex;
    align-items: center;
    width: 100%;
    margin: auto;
}
.hamburgernav__title {
    padding-top: 5px;
    padding-bottom: 5px;
    background: #888;
    color: #fff;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
}
@media screen and (min-width: 1024px){
    .main-header__sub__text {
        font-size: 1.2rem;
    }
    .main-header__sub__text span{
        background: white;
        color: #00cccc;
        font-weight: bold;
        padding: 1px 4px;
        margin-right: 4px;
    }
    .header-lite__wrap{
        width: 1200px;
    }
}
  
/* 商品詳細 */

.product-detail .heading {
    border-bottom: 3px solid #00cccc;
}
.product-detail .heading .icon {
    background: #00cccc;
}
.product-detail .heading .icon::before {
    background: linear-gradient(to top right, #00cccc 50%, transparent 50%) top left / 100% 100% no-repeat;
}
.block-detail__contents {
    background-color: #f3f3f3;
}
.product-detail .subhead {
    border-left: 4px solid #00cccc;
}
.block-detail__thumb {
    margin-bottom:1em;
}
.block-detail__temp-link{
    margin-top: 15px;
}
.block-detail__temp-link .primary-button{
    width: 100%;
    font-size: 1em;
    box-sizing: border-box;
    background: #ff8d25;
    color: white;
    padding: 15px 20px;
}
.block-detail__temp-link .base{
    background: #c2c2c2;
    color: #ffffff;
}
.block-detail__temp-link .base:hover{
    opacity: 1;
    cursor: default;
}
.primary-button .icon-template{
    color: white;
    padding-right: 10px;
    font-size: 2rem;
}
.block-detail__main__item{
    display:none;
    border:1px solid rgba(255,255,255,0);
}
.slick-initialized .block-detail__main__item{
    display: block;
    border:1px solid #ccc;
}
.product_sub-detail{
    border-bottom: 1px solid #dedede;
    font-size: 19px;
    font-weight: bold;
    padding: 5px 0;
    margin-bottom: 15px;
}
.block-detail__news{
    background-color: #ffeded;
    padding: 15px 20px;
}
.block-detail__edit:last-of-type {
    margin-bottom: 60px;
}
/* 商品詳細 うちわQ&A・目安納期・注意点・ジャパンカラー */
.item_content_link {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px 0;
}
.item_content_link br{
    display: none;
}
.item_content_link li {
    width: 48.5%;
    margin-bottom:13px;
}
.item_content_link li img {
    width: 100%;
    vertical-align: bottom;
}
.item_content_link li a{
    display: block;
}
.item_content_link li a:hover{
    opacity: 0.7;
}
.inquiry-form_block{
    display: flex;
    flex-direction: column;
    background: #fefdcd;
    border: 1px solid #dedede;
    margin: 1em 0;
    padding: 20px 1em;
}
.inquiry-form_block p{
    padding:0 0 10px 0;
}
.inquiry-form_block img{
    max-width: 100%;
    vertical-align: bottom;
}
.inquiry-form_block a{
    display: block;
}
.inquiry-form_block a:hover{
    opacity: 0.7;
}
@media screen and (min-width: 1024px){
    .inquiry-form_block{
        flex-direction: row;
        align-items: center;
    }
    .inquiry-form_block p{
        width: calc(100% - 400px);
        padding:0 2em 0 0;
    }
    .inquiry-form_block img{
        width:400px;
    }
}

/* 商品詳細 うちわオプション */
.original_size_03 .temp_box {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    margin-bottom: 10px;
    line-height: normal;
}
.original_size_03 .temp_box .temp_img {
    float: left;
    width: 200px;
    margin: 0 15px 15px 0;
}
.original_size_03 .temp_box .temp_img img {
    width: 100%;
}
.original_size_03 .temp_box .temp_download {
    float: right;
    width: calc(100% - 215px);
}
.original_size_03 .temp_box .temp_download dl.option {
    display: inline-block;
    width: 100%;
    margin-bottom: 10px;
}
.original_size_03 .temp_box .temp_download dl.option dt {
    display: inline-block;
    background: #ffe52f;
    margin: 0 5px 5px 0;
    padding: 3px 6px;
    font-size: 14px;
    font-weight: bold;
    line-height: normal;
}
.original_size_03 .temp_box .temp_download dl.option dd {
    display: inline-block;
    font-weight: bold;
    font-size: 14px;
}
.original_size_03 .temp_box .temp_download dl.option dd red {
    color: #EE3333;
}
.accbox label {
    position: relative;
    font-size: 14px;
    padding: 10px 35px 10px 15px;
    border: 1px solid #afafaf;
    background: whitesmoke;
    font-weight: bold;
}
.accbox label:before {
    content: "";
    position: absolute;
    top: -5px;
    bottom: 0;
    right: 15px;
    margin: auto;
    padding: 0;
    width: 10px;
    height: 10px;
    border-top: 2px solid #888;
    border-right: 2px solid #888;
    transform: rotate(135deg);
}
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
    margin-bottom: 2%;
    font-size: 13px;
}
.item-content-group .numbering_list {
    margin-top: 10px;
    font-weight: bold;
}
.accbox .accshow p {
    margin: 15px 10px;
}
/* 商品詳細 テンプレート */
.design_temp_link{
    margin-top: 10px;
}
.design_temp_link a:hover{
    opacity: 0.8;
}
.block-template__download__item:nth-child(n+2) {
    margin-top: 0;
}
.block-template__download .subhead {
    margin: 20px 0 10px 0;
}
/* Sランク商品　選ばれるポイント */
.marker_yellow{
    display: inline;
    background: linear-gradient(transparent 50%, rgba(255, 252, 107, .69) 50%);
    font-size: 22px;
    font-weight: bold;
    padding: 0 20px;
}
.item_point_box{
    border: solid 1px #ccc;
    padding: 15px;
    margin: 30px 0;
}
.item_point_box ol{
    list-style: none;
    text-align: left;
    margin: 20px;
}
.item_point_box ol li{
    position: relative;
    font-size: 18px; 
    font-weight: bold;
    padding: 8px 30px;
}
.item_point_box ol li::before{
    content: "◎";
    position: absolute;
    color: #57bb6c;
    font-size: 24px;
    font-weight: bold;
    left: 0px;
    top: 3px;
}
.item_memo_box{
    background: #ffeaec;
    border-radius: 8px;
    text-align: center;
    font-size: 16px;
    padding: 15px;
}

/* 会社概要 */
table.company {
    border-style: solid none none solid;
    border-width: 1px;
    border-color: #dadada;
    margin-top: 10px;
    width: 100%;
    line-height: 1.7;
}
table.company tr th {
    border-style: none solid solid none;
    border-width: 1px;
    border-color: #dadada;
    padding: 10px 15px 9px;
    font-size: 14px;
    background-color: #f3f3f3;
    font-weight: bold;
    width: 25%;
}
table.company tr td {
    border-style: none solid solid none;
    border-width: 1px;
    border-color: #dadada;
    padding: 10px 15px 9px;
    font-size: 14px;
}
  
/* ガイド_ベース*/
.guide_frame{
    margin-bottom: 60px;
}
.guide_frame *{
    line-height: 1.8;
}
.guide_frame .ec-off1Grid p{
    margin-bottom: 1em;
    font-size: 14px;
}
.guide_frame .ec-off1Grid p:last-child{
    margin-bottom: 0;
}
.guide_frame .ec-off1Grid p img{
    display: block;
    margin: 0 auto;
}
.guide_frame h2{
    margin: 50px 0 15px;
    padding: 10px 15px;
    background: #414141;
    color: white;
    font-size: 20px;
    font-weight: bold;
}
.guide_frame h3{
    margin: 40px 0 15px;
    padding: 5px 10px;
    font-size: 18px;
    font-weight: bold;
    border: 1px solid #cccccc;
    background: #f8f8f8;
}
.guide_frame h4{
    margin: 20px 0 15px;
    padding: 3px 0;
    border-bottom: 1px solid #00cccc;
    font-size: 16px;
}
.guide_frame .clum2 {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
}
.guide_frame .clum2 .block {
    width: 100%;
    padding: 2% 0;
}
.guide_frame .clum2 .block img{
    display: block;
    margin: 0 auto;
}
.guide_frame .clum2 .block .boxnum{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-bottom: 15px;
}
.guide_frame .clum2 .block .boxnum dt{
    width: 25px;
    height: 25px;
    background: #e71e18;
    text-align: center;
    align-items: flex-end;
    line-height: 1.8;
    color: white;
    font-weight: bold;
    border-radius: 4px;
}
.guide_frame .clum2 .block .boxnum dd{
    width: calc(100% - 25px);
    padding-left:10px;
}
.complete-tel {
    border: 1px solid #00cccc;
}
.qa-item--question:before {
    background-color: #00cccc;
}
  @media screen and (min-width: 600px), print{
      .guide_frame .clum2 {
          -ms-flex-direction: row;
          flex-direction: row;
      }
      .guide_frame .clum2 .block {
          width: 50%;
          padding: 2% 0;
      }
  }
  .guide_frame .notes {
      font-size: 12px;
  }
  .guide_frame .notes.aside {
      color: #999;
  }
  img.cap{
    border: 1px solid #ccc;
    box-sizing: content-box;
  }
  /* ガイド_注意点 */
  .guide-note {
      display: -ms-flexbox;
      display: flex;
      align-items: flex-start;
      flex-wrap: wrap;
      margin-bottom:1em;
  }
  .guide-note dt {
      display: block;
      width: 90px;
      color: #fff;
      font-size: 14px;
      font-weight: bold;
      background-color: #00cccc;
      text-align: center;
      padding: 3px 0;
      margin-bottom: 7px;
  }
  .guide-note dd {
      width: calc(100% - 90px);
      padding: 3px 10px 2px;
      display: table-cell;
      vertical-align: middle;
  }
  /* ガイド_目次 */
  .guide-list-hgroup {
      margin: 20px 0;
      padding: 15px;
      background-color: #f6f6f6;
      border: solid 4px #e6e6e6;
  }
  .guide-list-hgroup ul {
      padding: 0% 1%;
  }
  .guide-list-hgroup ul li {
      margin-bottom: 0.5em;
  }
  .guide-list-hgroup ul li:last-child {
      margin-bottom: 0;
  }
  .guide-list-hgroup ul li a {
      position: relative;
      display: inline-block;
      padding: 0 0 0 16px;
      vertical-align: middle;
      text-decoration: underline;
      color: #337ab7;
      font-weight: bold;
  }
  .guide-list-hgroup ul li a:before {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      content: "";
      vertical-align: middle;
      left: 0;
      width: 5px;
      height: 5px;
      border-top: 2px solid #00cccc;
      border-right: 2px solid #00cccc;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
  }
  .guide-list-hgroup ul li a:hover {
      color:#00cccc;
      text-decoration: none;
  }
  .guide-list-hgroup .title {
      margin-bottom: 0;
      padding: 5px 0 5px 10px;
      font-size: 18px;
      font-weight: bold;
      border:none;
  }
  
  @media screen and (min-width: 600px), print{
      .guide-list-hgroup .pct20{
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
      }
      .guide-list-hgroup .pct20 li{
          width:20%;
      }
  }
  .guide-experienced-group {
      margin: 1em;
  }
  .guide-experienced-group p {
      word-break: break-all;
      word-wrap: break-word;
      margin-bottom: 1em;
  }
  .guide-experienced-group img{
      display: block;
      margin: auto;
  }
  .guide-experienced-table {
      border-style: solid none none solid;
      border-width: 1px;
      border-color: #dadada;
      margin: 1.5em 0;
      width: 100%;
  }
  .guide-experienced-table th {
      border-style: none solid solid none;
      border-width: 1px;
      border-color: #dadada;
      padding: 10px 15px 9px;
      background-color: #f3f3f3;
      font-weight: bold;
      width: 30%;
  }
  .guide-experienced-table td {
      border-style: none solid solid none;
      border-width: 1px;
      border-color: #dadada;
      padding: 10px 15px 9px;
  }
  .subGuidList{
      margin: 1em 0;
  }
  .subGuidList li{
      margin-bottom: 0.5em;
  }
  .subGuidList li a{
      position: relative;
      display: inline-block;
      padding: 0 0 0 16px;
      vertical-align: middle;
      font-size: 14px;
      font-weight: bold;
      text-decoration: underline;
      color: #414141;
  }
  .subGuidList li a:before{
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      margin: auto;
      content: "";
      vertical-align: middle;
      left: 0;
      width: 5px;
      height: 5px;
      border-top: 2px solid #00cccc;
      border-right: 2px solid #00cccc;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
  }
  @media screen and (min-width: 600px), print{
      .flex-list-group{
            display:-webkit-box;
            display:-ms-flexbox;
            display:flex;
      }
      .flex-list-group ul{
            flex: 1;
      }
  }
  /* ガイド_注文の流れ */
  .orderFlowWrap{
      
  }
  .orderFlowWrap .orderFlowDl{
      display: -ms-flexbox;
      display: flex;
      flex-direction: row;
  }
  .orderFlowWrap .orderFlowDl dt {
      width: 100px;
      font-weight: bold;
      position: relative;
      background: #00cccc;
      padding: 20px 10px 0;
      margin-bottom: 15px;
      text-align: center;
      color: #fff;
  }
  .orderFlowWrap .orderFlowDl dt:after {
      content: "";
      position: absolute;
      width: 0;
      height: 0;
      bottom: -15px;
      left: 0;
      border-style: solid;
      border-color: #00cccc transparent transparent transparent;
      border-width: 15px 50px 0 50px;
      z-index: 1;
  }
  .orderFlowWrap .orderFlowDl dd {
      width: calc(100% - 100px);
      padding: 1em 1em 2em;
  }
  @media screen and (min-width: 600px), print{
      .orderFlowWrap .orderFlowDl dt {
          width: 140px;
      }
      .orderFlowWrap .orderFlowDl dt:after {
          border-width: 15px 70px 0 70px;
      }
      .orderFlowWrap .orderFlowDl dd {
          width: calc(100% - 140px);
          padding: 1em 1em 2em 2em;
      }
  }
  .box_nagare {
      margin:10px 0;
  }
  .box_nagare .item {
      position: relative;
      border: 3px solid #dedede;
      margin: 0 0 20px;
      padding: 10px;
  }
  .box_nagare .step {
      border-bottom: 1px solid #999;
      margin-bottom: 5px;
      padding-bottom: 5px;
      text-align: center;
      font-size: 18px;
      font-weight: bold;
  }
  .box_nagare .icon {
      margin: 10px 0;
  }
  .box_nagare .icon img {
      display: block;
      max-width: 100%;
      margin: auto;
  }
  .box_nagare .comment{
      font-size: 13px;
      line-height: 1.4;
  }
  @media screen and (min-width: 600px), print{
      .box_nagare{
          display: -ms-flexbox;
          display: flex;
          justify-content: space-around;
          margin: 0 -10px;
      }
      .box_nagare .item {
          flex: 1 1 0%;
          margin: 10px;
      }
  }
  /* ガイド_サービス一覧 */
  .service_list{
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      justify-content: space-between;
      margin: 30px 0;
  }
  .service_item{
      display: -ms-flexbox;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      width: 100%;
      margin-bottom: 30px;
      padding: 15px;
      border: 1px solid #ccc;
  }
  .service_item .ttl{
      width: calc(100% - 70px);
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      line-height: 1.4;
  }
  .service_item .icon{
      width: 70px;
      margin: 0 auto;
  }
  .service_item .icon img{
      height: 70px;
      width: 70px;
      display: block;
  }
  .service_item .copy{
      margin: 10px 0;
      font-size: 13px;
      line-height: 1.6;
  }
  .service_item .linkbtn{
      display: block;
      margin: auto auto 0;
      max-width: 100%;
      width: 100%;
  }
  .service_item .linkbtn a{
      background: #00cccc;
      border: 1px solid #00cccc;
      color: white;
      display: block;
      text-align: center;
      padding: 5px;
      font-weight: bold;
  }
  @media screen and (min-width: 600px){
      .service_item {
          width: 48%;
      }
      .service_item .icon {
      }
      .service_item .ttl {
      }
  }
  @media screen and (min-width: 1000px), print{
      .service_item {
          width: 31.333%;
      }
  }
  /* ガイド_チェックマーク目次 */
  .guide-index-checklist {
      border: solid 10px #e7e7e7;
      margin-top: 25px;
      margin-bottom: 25px;
      padding: 15px 20px 20px;
  }
  .guide-index-checklist .list_ttl {
      font-size: 18px;
      font-weight: bold;
      color: #00cccc;
      border-bottom: 1px dotted #ccc;
  }
  .guide-index-checklist .checklist_wrap {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  }
  .guide-index-checklist .checklist {
      width: 100%;
  }
  .guide-index-checklist .checklist > li{
      position: relative;
      padding: 4px 0px 4px 2em;
      margin: 0px;
  }
  .guide-index-checklist .checklist > li:before,
  .guide-index-checklist .checklist > li:after{
      position: absolute;
      top: 50%;
      height: 1em;
      content: "";
  }
  .guide-index-checklist .checklist > li:before {
      left: 0px;
      transform: translateY(-50%);
      width: 1em;
      border: 1px solid #cccccc;
  }
  .guide-index-checklist .checklist > li:after {
      left: 0.6em;
      transform: translateY(-75%) rotate(45deg);
      width: 0.4em;
      border-bottom: 2px solid #00cccc;
      border-right: 2px solid #00cccc;
  }
  .guide-index-checklist .checklist > li a{
      color: #337ab7;
      text-decoration: underline;
  }
  .guide-index-checklist .checklist > li a:hover{
      color: #00cccc;
      text-decoration: none;
  }
  @media screen and (min-width: 600px), print{
      .guide-index-checklist .checklist{
          width:50%;
      }
  }
  .guide-index-menu{
      margin:1em 0;
  }
  .guide-index-menu .menu_box{
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      border-bottom: dotted 1px #ccc;
      padding: 20px 0;
  }
  .guide-index-menu .box_left{
      display: -ms-flexbox;
      display: flex;
      align-items: center;
  }
  .guide-index-menu .pic{
      width:60px;
  }
  .guide-index-menu .text{
      width:calc(100% - 60px);
      padding-left: 15px;
  }
  .guide-index-menu .text .ttl{
      font-size: 18px;
      font-weight: bold;
      margin-bottom: 5px;
  }
  .guide-index-menu .linkbtn{
      margin-top: 10px;
  }
  .guide-index-menu .linkbtn a{
      display: block;
      margin: 0 auto;
      padding: 15px 5px;
      background: #00cccc;
      text-align: center;
      color: #fff;
      font-size: 14px;
      font-weight: bold;
  }
  @media screen and (min-width: 600px), print{
      .guide-index-menu .menu_box{
          flex-direction: row;
          align-items: center;
      }
      .guide-index-menu .box_left{
          width:calc(100% - 200px);
      }
      .guide-index-menu .linkbtn{
          width:200px;
          margin: 0;
      }
  }
  /* ガイド_チェックリスト表 */
  table.chkListTbl{
      width: 100%;
  }
  table.chkListTbl th,
  table.chkListTbl td{
      vertical-align: middle;
      line-height: 1.4;
      word-break: break-all;
  }
  table.chkListTbl th {
      border: 1px solid #dadada;
      padding: 5px 10px;
      text-align: center;
      font-weight: normal;
      vertical-align: middle;
  }
  table.chkListTbl th.type {
      width: 10%;
  }
  table.chkListTbl th.item {
      width: 80%;
  }
  table.chkListTbl th.chk {
      width: 10%;
  }
  table.chkListTbl th .req {
      display: block;
      padding: 3px;
      color: #fff;
      font-weight: bold;
      background-color: #00cccc;
  }
  table.chkListTbl th .self {
      display: block;
      padding: 3px;
      color: #fff;
      font-weight: bold;
      background-color: #a7a7a7;
  }
  table.chkListTbl td {
      border: 1px solid #dadada;
      padding: 10px;
  }
  table.chkListTbl img{
      vertical-align: bottom;
  }
  .guide_frame table.chkListTbl a {
      color: #337ab7;
      font-weight: bold;
      text-decoration: underline;
  }
  .guide_frame table.chkListTbl a:hover {
      color: #00cccc;
      font-weight: bold;
      text-decoration: none;
  }
  /* ガイド_アプリ別注文意見出し*/
  .guide-read-notes {
      display: -ms-flexbox;
      display: flex;
      align-items: center;
      border: solid 1px #00cccc;
      margin-bottom: 20px;
      padding: 20px;
      border-radius: 10px;
      box-shadow: 3px 3px #00cccc;
  }
  .guide-read-notes .icon {
      width: 60px;
  }
  .guide-read-notes .icon img{
      vertical-align: bottom;
  }
  .guide-read-notes .text {
      width: calc(100% - 60px);
      padding-left: 15px;
  }
  /* ガイド_注意点チェックポイント*/
  .guide-check-point {
      margin: 20px 0;
  }
  .guide-check-point .check-point,
  .guide-check-point .check-point2 {
      margin-bottom:10px;
  }
  .guide-check-point .check-point dt,
  .guide-check-point .check-point2 dt {
      float: left;
      display: block;
      width: 90px;
      color: #fff;
      font-size: 12px;
      font-weight: bold;
      background-color: #00cccc;
      text-align: center;
      padding: 2px 0;
  }
  .guide-check-point .check-point dd,
  .guide-check-point .check-point2 dd {
      padding-left: 100px;
  }
  .guide-check-point .check-point2 dd span {
    color: #00cccc;
    font-weight: bold;
}
  .guide-check-point a {
      font-weight: bold;
      color: #337ab7;
      text-decoration: underline;
  }
  .guide-check-point a:hover{
      color: #00cccc;
      text-decoration: none;
  }
  .guide-indispensable{
      margin: 40px 0;
      padding: 20px 25px 5px;
      background-color: #ffece5;
  }
  .guide-indispensable .guide-check-point {
      padding: 10px;
      font-size: 14px;
      background: #fff;
  }
  .exltemp_box {
      width: 100%;
      border: 3px solid #39a200;
      padding: 15px 15px 15px;
      font-weight: bold;
      display: inline-block;
  }
  .exltemp_box dt {
      font-size: 17px;
      line-height: 150%;
  }
  /* ガイド_画像付き説明フレックスボックス*/
  .flex_box{
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      justify-content: space-between;
      padding: 0;
  }
  .flex_box li{
      display:block;
      margin: 1em auto;
  }
  .flex_box li img{
      display:block;
      margin: 0 auto 1em;
  }
  @media only screen and (min-width: 600px){
      .flex_box{
          -ms-flex-direction: row;
          flex-direction: row;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      }
      .flex_box li{
          flex:1 1 0%;
      }
      .flex_box.col_2 li{
          width: 50%;
      }
      .flex_box.col_3 li{
          width: 32%;
      }
  }
  .guide-explanation{
      border: solid 20px #fce5e2;
      margin: 20px 0;
      padding: 20px;
  }
  @media only screen and (min-width: 600px){
      .guide-explanation{
          border-width: 28px;
      }
  }
  .guide-explanation h2,
  .guide-explanation h3{
      margin-top: 0;
  }
  .guide-explanation hr{
      margin: 2em 0;
  }
  .guide-explanation p{
      margin-bottom: 1em ;
  }
  .guide-explanation img{
      display:block;
      margin: 1em auto;
  }
  .guide_frame .step {
      position: relative;
      margin: 2em 0 1em;
      padding-left: 40px;
      line-height: 1.6;
  }
  .guide_frame .step:before {
      position: absolute;
      color: white;
      background: #00cccc;
      width: 30px;
      text-align: center;
      height: 30px;
      top: 51%;
      left: 0;
      transform: translateY(-50%);
      font-weight: bold;
      line-height: 30px;
  }
  .step.step1:before {
      content: "1";
  }
  .step.step2:before {
      content: "2";
  }
  .step.step3:before {
      content: "3";
  }
  .step.step4:before {
      content: "4";
  }
  .step.step5:before {
      content: "5";
  }
  .step.step6:before {
      content: "6";
  }
  .step.step7:before {
      content: "7";
  }
  .step.step8:before {
      content: "8";
  }
  /* 初心者用 完全データ作成ガイド*/
  .guide-character {
    background-position: 0 0;
    background-repeat: no-repeat;
    margin-top: 20px;
    padding-left: 80px;
    min-height: 54px;
    height: auto !important;
    height: 54px;
    position: relative;
  }
  .guide-character .inner {
      display: block;
      border: 1px solid #ccc;
      border-radius: 5px;
      padding: 17px 20px;
      position: relative;
      word-break: break-all;
      vertical-align: top;
      line-height: 1.6;
  }
  .guide-character .inner:before {
      content: "";
      position: absolute;
      top: 1.7em;
      left: -10px;
      border-right: 11px solid #ffffff;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
      z-index: 2;
  }
  .guide-character .inner:after {
      content: "";
      position: absolute;
      top: 1.7em;
      left: -11px;
      border-right: 11px solid #ccc;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
  }
  .guide-character.guide-character0301 .inner,
  .guide-character.guide-character0401 .inner{
      background-color: #fffac6;
  }
  .guide-character.guide-character0301 .inner:before,
  .guide-character.guide-character0401 .inner:before{
      border-right-color: #fffac6;
  }
  .guide-character.guide-character0501 .inner{
      background-color: #00acdd;
  }
  .guide-character.guide-character0501 .inner:before{
      border-right-color: #00acdd;
  }
  .guide-character0101, .guide-character0102, .guide-character0103, .guide-character0104, .guide-character0105 {
      color: #eb6d94;
  }
  .guide-character0201, .guide-character0202, .guide-character0203, .guide-character0204, .guide-character0205 {
      color: #11b8d6;
  }
  .guide-character0301, .guide-character0401 {
      color: #ea5414;
  }
  .guide-character0101 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0101.gif);
  }
  .guide-character0102 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0102.gif);
  }
  .guide-character0103 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0103.gif);
  }
  .guide-character0104 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0104.gif);
  }
  .guide-character0105 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0105.gif);
  }
  .guide-character0201 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0201.gif);
  }
  .guide-character0202 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0202.gif);
  }
  .guide-character0203 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0203.gif);
  }
  .guide-character0204 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0204.gif);
  }
  .guide-character0205 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0205.gif);
  }
  .guide-character0301 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0301.gif);
  }
  .guide-character0401 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0401.gif);
  }
  .guide-character0501 {
      background-image: url(/html/user_data/assets/img/guide/beginners/character/character_0501.gif);
      min-height: 86px;
      height: auto !important;
      height: 86px;
      color: #fff;
  }
  .guide-character050 .inner {
    background-color: #00acdd;
  }
  .guide-character050 img.boxarrow {
    background: url(../../image/guide/character_arrow_blue.gif) no-repeat 0 0;
  }
  
  .guide-character img.boxarrow {
      background: url(../../image/guide/character_arrow_white.gif) no-repeat 0 0;
      width: 15px;
      height: 10px;
      display: block;
      position: absolute;
      top: 23px;
      left: -13px;
  }
  .guide-section{
      margin: 2em 0;
  }
  .guide-section img{
      display: block;
      margin: 0 auto;
  }
  /* 印刷方法の特性*/
  .printing_method_warp{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
      width: 100%;
  }
  .printing_method_warp li{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      margin-bottom: 1em;
  }
  .printing_method_warp li *{
      font-size: 13px;
      line-height: 1.5;
  }
  @media only screen and (min-width: 600px){
      .printing_method_warp li{
          width:33.333%;
          padding:0 10px;
      }
  }
  /* デザインテンプレート */
  .block-templatelist{
      font-size:1.4rem;
  }
  .block-templatelist *{
      transition: all 0.1s;
  }
  .templatelist_wrap{
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin: 0 -1.5%;
  }
  .template_box{
      width: 100%;
      margin: 0px 1.5% 50px;
      width: 47%;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -ms-flex-direction: column;
      flex-direction: column;
  }
  .template_box .tmb_box{
      margin-bottom: 5px;
      padding: 15px;
      background: #f7f7f7;
  }
  .template_box .tmb_box img{
      vertical-align: bottom
  }
  .template_box .txt_box{
          display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      flex-grow: 1;
  }
  .block-templatelist .temp_name{
      font-weight: bold;
      margin-bottom: 8px;
      font-size: 13px;
  }
  .block-templatelist .temp_dlbtn{
      display: block;
      width: 100%;
      margin-top: auto;
  }
  .block-templatelist .temp_dlbtn a{
      background: #00cccc;
      color: white;
      text-align: center;
      padding: 8px;
      font-weight: bold;
      font-size: 12px;
      border-radius: 4px;
      margin: 0 auto;
      display: block;
  }
  .block-templatelist .temp_dlbtn a:hover{
      opacity: 0.7;
  }
  .kiyaku_box{
      margin: 25px 0;
      padding: 15px;
      border: 1px solid #00cccc;
  }
  .kiyaku_box dt{
      font-weight: bold;
      font-size: 1.6rem;
      margin-bottom: 1rem;
      text-align: center;
      color: #00cccc;
  }
  @media screen and (min-width: 900px){
      .template_box {
          width: 22%;
      }
  }
  .temp-dl-list_wrap{
      font-size: 14px;
      line-height: 1.4;
      color: #525263;
  }
  .temp_dlbox {
      width: 100%;
      border: 1px solid #ccc;
      margin-bottom: 25px;
      font-size: 13px;
  }
  .temp_dlbox h3 {
      background: #f7f7f7;
      padding: 10px;
      font-size: 14px;
      font-weight: bold;
  }
  .temp_dlbox h3 .new {
      background: #00cccc;
      margin-left: 10px;
      padding: 0 7px;
      color: white;
      border-radius: 3px;
      font-size: 13px;
  }
  .temp_dlbox .temp_wrap {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
  }
  .temp_dlbox .temp_wrap {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 20px;
  }
  .temp_dlbox .temp_wrap .temp_img{
      width: 100%;
      text-align: center;
  }
  .temp_dlbox .temp_wrap .temp_img img{
      width: 100%;
      vertical-align: bottom;
  }
  .temp_dlbox .temp_wrap .temp_info{
      width: 100%;
  }
  .temp_info .temp_dlbtn {
      display: block;
      width: 100%;
      margin-top: 15px;
  }
  .temp_dlbox a:link:hover {
      opacity: 0.7;
  }
  .temp_info .temp_dlbtn a {
      position: relative;
      display: block;
      background: #00cccc;
      color: white;
      margin: 0 auto;
      padding: 9px;
      text-align: center;
      font-weight: bold;
      font-size: 14px;
      border-radius: 4px;
  }
  .temp_info .temp_dlbtn a:after {
      position: absolute;
      content: '';
      top: 0;
      bottom: 0;
      margin: auto;
      right: 15px;
      width: 1.5em;
      height: 1.5em;
      background-image: url(/html/user_data/assets/img/common/icon_dlbtn.svg);
      background-repeat: no-repeat;
  }
  .temp_info .cal_all_image {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      margin-top: 10px;
  }
  .temp_info .cal_all_image li {
      width: 48%;
  }
  .temp_info .cal_all_image li a {
      display: block;
      text-align: center;
      padding: 4px 0;
      border: 1px solid #ccc;
      border-radius: 50px;
      font-size: 11px;
      color: #333;
  }
  @media only screen and (min-width: 600px){
      .temp-dl-list_wrap{
             display: -ms-flexbox;
              display: flex; 
                -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      }
      .temp_dlbox{
          width: 31.3%;
          margin: 1% 1% 50px;
      }
      .temp_dlbox .temp_wrap {
      }
      .temp_dlbox .temp_wrap .temp_img{
      }
      .temp_dlbox .temp_wrap .temp_info{
      }
  }
  .temp_flexbox{
      display: flex;
      justify-content: space-around;
      margin: 20px 0;
  }
  .temp_flexbox img{
      max-width: 33%;
  }
  
  /* twitterタイムライン */
  .timeline_ttl {
      padding: 8px;
      text-align: center;
      background: #1da1f2;
      color: white;
      line-height: normal;
      border-radius: 7px 7px 0 0;
      font-size: 13px;
  }
  .timeline_wrap {
      border: 1px solid #46b8ed;
      border-radius: 0 0 7px 7px;
      overflow: hidden;
  }
  
  /* アコーディオンボックス */
  .accordion {
      margin: 3em auto;
  }
  .accordion .toggle {
      display: none;
  }
  .accordion .option {
      position: relative;
      margin-bottom: 5px;
  }
  .accordion .acd_title,
  .accordion .acd_content {
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      transform: translateZ(0);
  }
  .accordion .acd_title {
      border: none;
      padding: 14px 15px;
      display: block;
      color: #333;
      margin: 0;
      background: #eeeeee;
      font-size: 18px;
      font-weight: bold;
  }
  .accordion .acd_title::after,
  .accordion .acd_title::before {
      content: "";
      position: absolute;
      right: 1.25em;
      top: 1.25em;
      width: 2px;
      height: 0.75em;
      background-color: #00cccc;
      transition: all 0.3s;
  }
  .accordion .acd_title::after {
      transform: rotate(90deg);
  }
  .accordion .acd_content {
      border: 2px solid #eee;
      border-top: none;
      display: block;
      height: 0;
      opacity: 0;
      padding: 0 10px;
      visibility: hidden;
  }
  .accordion .acd_content p {
      margin-bottom: 1em;
      line-height: 1.6;
  }
  .accordion .acd_content img {
      transition: 0;
  }
  .toggle:checked + .acd_title + .acd_content {
      height: auto;
      opacity: 1;
      padding: 1.5em;
      visibility: visible;
      border: 5px solid #eee;
      border-top: none;
      margin-bottom: 2em;
  }
  .toggle:checked + .acd_title::before {
      transform: rotate(90deg) !important;
  }
  
  /* ガイド_外部リンク集*/
  .tbl_sitelink {
      display: block;
      width: 100%;
      margin: 2em 0;
      padding: 0 20px;
      background: #f8f8f8;
      border-radius: 10px;
  }
  .tbl_sitelink li {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
      flex-direction: column;
      padding: 1.5em 0;
      border-bottom: 1px solid #cccccc;
  }
  .tbl_sitelink li:last-child{
      border-bottom: none;
  }
  .tbl_sitelink .srv_img img{
      vertical-align: bottom;
      width: 100%;
  }
  .tbl_sitelink .srv_txt{
      padding: 1em 0 0 0;
      vertical-align: middle;
  }
  .tbl_sitelink .srv_txt span{
      display: block;
      margin:0;
  }
  .tbl_sitelink .srv_ttl{
      font-size: 1.6rem;
      font-weight: bold;
  }
  @media only screen and (min-width: 600px){
      .tbl_sitelink li {
          -ms-flex-direction: row;
          flex-direction: row;
      }
      .tbl_sitelink .srv_img{
          width: 250px;
      }
      .tbl_sitelink .srv_txt{
          width: calc(100% - 250px);
          padding: 0 0 0 1em;
      }
  }
  
  /* 注文手続き_活用方法*/
  @media (min-width: 1024px){
      .form-item__input--flex-wide {
          align-items: start;
      }
      .form-item__input--flex-wide > * {
          margin-right: 3%;
          width: 30.3333%;
      }
  }
  
/* カテゴリページ*/
.main_v{
    margin-bottom: 40px;
}
.main_v img{
    vertical-align: bottom;
}
#cate_select {
    margin-bottom: 20px;
}
#cate_select dt{
    font-weight: bold;
    font-size: 20px;
    color: #555;
    display: block;
    margin-bottom: 10px;
}
#cate_select ul{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 40px;
    margin-top: -10px;
}
#cate_select li{
    margin-top: 10px;
    margin-right: 10px;
}
#cate_select li a{
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1;
    padding: 8px 38px 8px 20px;
    border: 1px solid #a5a5a5;
    border-radius: 16px;
    color: #222222;
    position: relative;
    display: block;
    transition: opacity 0.3s;
}
#cate_select li a:after{
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-right: 1px solid #9c9c9c;
    border-bottom: 1px solid #9c9c9c;
    transform: rotate(45deg) translateX(-1px);
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 18px;
}
#cate_select li a:hover{
    opacity:0.6;
}
#cate_select .select_shape{
    justify-content: flex-start;
    gap: 1%;
}
#cate_select .select_shape li{
    width: 85px;
}
#cate_select .select_shape a{
    padding: 8px;
    text-align: center;
}
#cate_select .select_shape a:after{
    display: none;
}
#cate_select .select_maker{
    justify-content: flex-start;
    gap: 0.5%;
}
#cate_select .select_maker li{
    width: 18%;
    position: relative;
    overflow: hidden;
}
#cate_select .select_maker a{
    padding: 5px 15px;
    text-align: center;
}
#cate_select .select_maker img{
    width: 100%;
    transition: all 0.2s;
}
#cate_select .select_maker .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#cate_select .select_maker li:hover .mask{
    opacity: 1;
}
#cate_select .select_maker a:after{
    display: none;
}
#cate_select .select_maker a:hover{
    opacity: 1;
    text-decoration: none;
    background: #f4f4f4;
    color: #bf0000;
}
#cate_select .select_maker a:hover img{
    background: none;
    opacity: 0;
}
#cate_select .select_maker a:hover .caption{
    color: #bf0000;
}
.category_subhead{
    margin-bottom: 30px;
    padding-bottom: 10px;
    border-bottom: 3px solid #00cccc;
    color: #222;
    font-size: 2.2rem;
}
.category_subhead .other a {
    font-size: 14px;
    font-weight: normal;
    padding-left: 15px;
    color: #0066c0;
}
.category_item_list{
    margin-top: 10px;
    padding-bottom: 100px;
}
.category_item_list ul{
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
}
.category_item_list li{
    position: relative;
    transition: opacity 0.3s;
}
.category_item_list li:hover {
    opacity:0.6;
}
.category_item_list li .item_name {
    display: block;
    line-height: 1.4;
    margin-top: 10px;
    font-size: 13px;
    word-break: break-all;
    text-decoration: underline;
}
.category_item_list li .tanka {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: nowrap;
    margin-top: 10px;
    font-size: 1rem;
    color: #888888;
}
.category_item_list li .tanka red {
    font-weight: bold;
    color: #ff0000;
    font-size: 1.4rem;
}
.category_item_list li .tanka red:before {
    content: "@";
}
.category_item_list a{
    text-decoration: none;
    color: #333;
}
.category_item_list .print{
    margin-top:10px;
}
.category_item_list .print span{
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    line-height: 1.3;
    padding: 2px 5px;
    margin-right: 5px;
    margin-bottom: 3px;
    font-size: 1rem;
    position: relative;
    color: #00cccc;
    background: #fff;
    border: 1px solid #eee;
}
.category_item_list .print span:before{
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: 3px;
    left: 6px;
}
.category_item_list .print span.fc{
    display: inline-flex;
    justify-content: flex-start;
    padding-left:18px;
    align-items: center;
    line-height: 1.3;
}
.category_item_list .print span.fc:before{
    background: no-repeat url(../img/common/ico_sm_cmyk.svg);
    background-size: contain;
}
.category_item_list .print span.oc{
    display: inline-flex;
    justify-content: flex-start;
    padding-left:18px;
    align-items: center;
    line-height: 1.3;
}
.category_item_list .print span.oc:before{
    background: no-repeat url(../img/common/ico_sm_mono.svg);
    background-size: contain;
}
.new_allitem_btn{
    margin:40px 0;
}
.new_allitem_btn a{
    padding: 30px 20px 30px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    border-radius: 5px;
    color: white;
    display: block;
    background: #00cccc;
    transition: opacity 0.3s
}
.new_allitem_btn a:hover{
    opacity: 0.6;
}
.subhead_txt {
    margin-bottom: 1em;
    line-height: 1.6;
    font-size: 15px;
}
@media (min-width: 600px){
    .category_item_list ul>li{
        width: calc((100% - 80px) / 5);
    }
    .category_item_list ul>li:not(:nth-child(5n+1)) {
        margin-left: 20px;
    }
    .category_item_list ul>li:nth-child(n+6) {
        margin-top: 30px;
    }
}
@media (max-width: 599px){
    .category_item_list{
    padding-bottom: 80px;
}
    .category_item_list ul>li{
        width: calc((100% - 20px) / 2);
    }
    .category_item_list ul>li:not(:nth-child(2n+1)) {
        margin-left: 20px;
    }
    .category_item_list ul>li:nth-child(n+6) {
        margin-top: 40px;
    }
    .category_item_list ul>li:nth-child(n+3) {
        margin-top: 40px;
    }
    .category_item_list ul>li:nth-child(2n+3) {
        position: relative;
    }
    .category_item_list ul>li:nth-child(2n+3):before {
        content: "";
        display: block;
        width: calc(200% + 20px);
        height: 1px;
        background: #ccc;
        position: absolute;
        bottom: calc(100% + 20px);
        left: 0;
    }
}
@media (max-width: 599px){
    #cate_select ul{
        justify-content: space-between;
    }
    #cate_select li{
        width: calc((100% - 10px) / 2);
        margin: 10px 0 0;
    }
    .wet-tissue_menu{
        margin-bottom: 20px;
    }
    .wet-tissue_menu ul{
        display: flex;
        flex-wrap: wrap;
    }
    .wet-tissue_menu li{
        width: 47%;
        margin: 10px 10px 0 0;
    }
}
@media (min-width: 600px){
    .wet-tissue_menu{
        margin-bottom: 20px;
    }
    .wet-tissue_menu ul{
        display: flex;
    }
    .wet-tissue_menu li{
        width: 33%;
        margin: 10px 10px 10px 0;
    }
    .wet-tissue_menu li:last-child{
        margin-right: 0;
    }
}
    
  /* デザつくリンク_旧サイト移行用 */
  .design_link{
    margin: 20px 0 40px;
    background: #fefdcd;
    border: 1px solid #cccccc;
    border-radius: 5px;
    overflow: hidden;
  }
  .design_link br{
      display:none;
  }
  .design_link a{
      display: block;
  }
  .design_link img{
      vertical-align: bottom;
      margin-bottom: 15px;
  }
  .design_link .d_btn{
      margin-bottom: 15px;
      padding: 0 20px;
  }
  .design_link .d_btn a{
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 20px;
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      height: auto;
      padding: 10px 30px;
      font-size: 1.2rem;
      font-weight: bold;
      text-decoration: none;
      transition: all 0.2s ease;
      border: 1px solid #ccc;
      background: none;
      color: #222;
      background: white;
      position: relative;
      padding-right: 20px;
      padding-left: 40px;
      width: 100%;
      box-sizing: border-box;
  }
  .design_link .d_btn a:before{
      content: "";
      position: absolute;
      top: 14px;
      left: 15px;
      width: 12px;
      height: 12px;
      background: url(/html/template/default/assets/img/icon_external.svg) no-repeat 0 0/contain;
  }
  .design_link .d_btn a:after{
      content: "";
      position: absolute;
      top: 8px;
      left: 18px;
      width: 12px;
      height: 12px;
      background: no-repeat 0 0/contain;
      background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20px 10px"><path fill="%23222" d="M3.214,7.857,6.429,4.643,5.357,3.571,3.929,5V0H2.5V5L1.071,3.571,0,4.643Z" /></svg>');
      transform: rotate(-125deg);
      transition: all 0.2s ease;
  }
  .design_link .d_btn a[target*=_blank]:hover::after {
      top: 6px;
      left: 20px;
  }
  
  /* デザツク用ブロック_修正版 */
  .button-band:hover,
  .button-band__text:hover,
  .button-band__type:hover{
      opacity: 1;
      cursor: initial;
  }
  .block-design{
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      background: #f7f7f7;
      border: 1px solid #ddd;
      border-radius: 10px;
      overflow: hidden;
      margin: 20px 0;
  }
  .block-design br{
      display: none;
  }
  .block-design__title{
      width: 100%;
      background-repeat: no-repeat;
      background-size: cover;
      display: -ms-flexbox;
      display: flex;
      align-items: center;
      justify-content: center;
      background: url(/html/user_data/common/image/guide/d_tsuku/block-dztk__background.jpg) ;
      padding:0 15px;
  }
  .block-design__inner{
      width: 100%;
      padding:15px;
  }
  .block-design .block-design__comment{
      text-align: center;
      font-size: 13px;
      color:#555;
  }
  .block-design .block-design__comment br{
      display:none;
  }
  .block-design .button-band{
      margin-top: 10px;
      padding: 7px 10px;
      background: #fff;
      border-radius: 5px;
      flex-wrap: nowrap;
  }
  .block-design .button-band:before {
      display: none;
  }
  .block-design .button-band__text{
      width: calc(100% - 120px);
      line-height: 1.3;
      font-size: 1.3rem;
  }
  .block-design .button{
      width: 110px;
      color: #ef840e;
      background: #ffffff;
  }
  .block-design__link {
      margin-top: 15px;
      text-align: center;
  }
  .block-design__link a{
      color: #333;
      text-decoration: none;
      font-weight: bold;
      font-size: 16px;
      transition: all 0.2s ease;
  }
  .block-design__link a:before{
      display: inline-block;
      content: '?';
      line-height: 22px;
      height: 20px;
      width: 20px;
      text-align: center;
      font-weight: bold;
      font-size: 1.5rem;
      border-radius: 50%;
      background-color: #ff8d25;
      color: #fff;
      vertical-align: middle;
      margin-right: 8px;
      margin-top: -2px;
  }
  .block-design__link a:hover{
      color: #ff8d25;
  }
  .block-detail__images .block-design {
      -ms-flex-direction: column;
      flex-direction: column;
  }
  @media (min-width: 768px){
      .block-design__title {
          width:50%;
      }
      .block-design__inner {
          width:50% ;
      }
      .block-detail__images .block-design__title,
      .block-detail__images .block-design__inner{
          width:100%;
      }
      .block-detail__images .block-design {
          -ms-flex-direction: column;
          flex-direction: column;
      }
      .block-design .button-band__text{
          font-size:1.4rem;
      }
      .block-design .block-design__comment br{
          display:initial;
      }
  }
  /* TOP_スライダー関連 */
  .slider{
      display: none;
  }
  .slider.slick-initialized{
      display: block; /*slick-initializedが付与されたら表示*/
  }

/* サイドナビ修正 */
.sidenav__list .list-item__text {
    font-size:12px;
}
.sidenav__list .list-item__text p{
    font-size:11px;
    color:#555;
}
.sidenav__banner img {
    vertical-align: bottom;
}
.sidenav__banner a {
    display:block;
}
.list-item .tag {
    padding-left: 5px;
}
.sidevav_more-link{
    margin-top:10px;
}
.sidevav_more-link a{
    display: flex;
    align-items: center;
    border: 1px solid #bf0000;
    justify-content: center;
    padding: 10px;
    font-size: 1.4rem;
    font-weight: bold;
    color: #222;
}
.sidevav_more-link a:hover{
    opacity: 0.7;
}
.sidevav_more-link img{
    margin-right:10px;
}

/* マイページ_会員情報編集 */
.form-rule__bottom {
    white-space: normal;
}
.block_withdraw{

}
.block_withdraw p{
    margin-top: 1em;
    font-size: 1.4rem;
}
.form_withdraw__btn{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    margin-top: 40px;
}
.form_withdraw__btn a{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    width: 100%;
    max-width: 260px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 1px solid #00cccc;
    background: #00cccc;
    color: #fff;
}
.form_withdraw__btn a:hover {
    opacity: 0.5;
    cursor: pointer;
    transition: all 0.2s ease;
}
@media (min-width: 1024px){
    .block_withdraw {
        max-width: 870px;
        margin-left: auto;
        margin-right: auto;
        padding-bottom: 100px;
    }
}
@media (max-width: 1023px){
    .block_withdraw {
        padding-bottom: 85px;
    }
}

/* アコーディオンボックス */
.accbox {
    padding: 0;
    max-width: 100%;
}
.accbox label {
    position: relative;
    font-size: 14px;
    padding: 10px 35px 10px 15px;
    border: 1px solid #afafaf;
    background: whitesmoke;
    font-weight: bold;
}
.accbox label:before {
    content: "";
    position: absolute;
    top: -5px;
    bottom: 0;
    right: 15px;
    margin: auto;
    padding: 0;
    width: 10px;
    height: 10px;
    border-top: 2px solid #888;
    border-right: 2px solid #888;
    transform: rotate(135deg);
}
.accbox label:before:hover {
    color: #bf0000;
}
.accbox input {
    display: none;
}
.accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
    margin-bottom: 2%;
    font-size: 13px;
}
.cssacc:checked + label:before {
    transform: rotate(-45deg);
    top: 0;
}
.cssacc:checked + label + .accshow {
    height: auto;
    padding: 2%;
    background: #ffffff;
    border: 1px solid #ccc;
    opacity: 1;
}
.accbox .accshow p {
    margin: 15px 10px;
}
  
.accbox .accshow_first {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
    margin-bottom: 2vh;
}
.cssacc:checked + label + .accshow_first {
    height: auto;
    padding: 2vh;
    background: #ffffff;
    opacity: 1;
}
.accbox.price label {
    border-radius: 0;
    font-size: 1.4em;
    padding: 1.5%;
}
.accbox.price .accshow .ac-small {
    font-size: 14px;
    color: #777;
}
.accbox.price .accshow .ac-small a {
    color: #0066c0;
}
.accbox.price .accshow .ac-small a:hover {
    color: orange;
    text-decoration: none;
}
.accbox.price h3.ac_in_ttl {
    border-bottom: 1px dashed #797878;
    padding: 1vh 1vh 0.5vh;
    font-size: 1.3em;
    color: #484848;
    font-weight: bold;
    display: block;
}
.accbox.price red {
    color: #EE3333;
}
.accbox.price .cssacc:checked + label + .accshow {
    border-radius: 0;
}
.accbox.price .accbox_opt {
    padding: 0;
    max-width: 100%;
}
.accbox_opt label {
    display: inline-block;
    padding: 1% 2%;
    font-size: 1.1em;
    cursor: pointer;
    transition: all 0.5s;
    border: solid 1px #a1a1a1;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#e5e5e5));
    border-radius: 4px;
    color: #000;
}
.accbox_opt label:before {
    content: '▶';
    padding-right: 15px;
}
.accbox_opt label:hover {
    background: linear-gradient(to bottom, #e1e3eb 0%, #d3d7dc 100%);
} 
.accbox_opt input {
    display: none;
}
.accbox_opt .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}
.accbox_opt .accshow p {
    margin: 15px 10px;
}
/* PRESS記事コーナー修正 */
.column-list{
    align-items: stretch;
}
.column-list > li{
    border: 1px solid #ccc;
    margin-bottom: 1.5em;
}
.column-list__item {
    border: none;
    margin: 0;
    width: 100%;
}
@media (min-width: 768px){
    .column-list > li{
        width:230px;
    }
}

/* カタログ請求注意点 */
.notice_wrap{
    border: 1px solid #cccccc;
    padding: 17px;
    margin: 20px 0;
}
.notice_wrap h5{
    font-size:16px;
    margin-bottom: 5px;
}
.notice_wrap p{
    line-height: 1.6;
    font-size:13px;
}

/* カテゴリページ_商品一覧タグ切替エリア */
.block-productlist#list-area{
    margin-top: 30px;
    padding-top: 20px;
    padding-bottom: 30px;
}
.list-cat__item a {
    position: relative;
    border-radius: 50px;
    padding: 8px 30px 8px 12px;
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    color: #333;
    transition: background-color 0.3s, color 0.3s;
}
.list-cat__item a:after {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-right: 1px solid #00cccc;
    border-bottom: 1px solid #00cccc;
    transform: rotate(45deg) translateX(-1px);
    position: absolute;
    top: -1px;
    bottom: 0;
    margin: auto;
    right: 12px;
}
.list-cat__item a:hover {
    color: #ffffff;
    background-color: #00cccc;
    border: 1px solid #00cccc;
    opacity: 1;
}
.list-cat__item.is-current a:after{
    border-color: #fff;
}
.list-cat__item a:hover:after{
    border-color: #fff;
}
.block-tag__sort{
    background: #eeeeee;
    padding: 15px;
    margin-top: 15px;
    border-radius: 5px;
}
.block-tag__title{
    font-size: 1.7rem;
    font-weight: bold;
}
.block-tag__title .icon{
    vertical-align: middle;
    color: #00cccc;
    margin-right: 5px;
}
.block-tag__sort .list-cat{
    margin-bottom: 5px;
}
.block-tag__sort .list-cat__item {
    margin-right: 5px;
    margin-top: 10px;
}
@media (max-width: 767px){
    .block-tag__sort .list-cat{
        justify-content: space-between;
        align-items: start;
    }
    .block-tag__sort .list-cat__item {
        margin-right: 0;
        width: 48%;
    }
    .block-tag__sort .list-cat__item a{
        border-radius: 5px;
        line-height: 1.2;
    }
}

/* 会員登録フォーム_特典バナー */
.banner_benefits{
    display:flex;
    justify-content: center;
    flex-direction: column;
    flex-wrap: wrap;
    gap:1em;
}
.banner_benefits img{
    vertical-align: bottom;
    max-width: 100%;
}
@media (min-width: 768px){
    .banner_benefits{
        flex-direction: row;
    }
    .banner_benefits li{
        width: calc((100% - 1em) / 2);
    }
}
@media (min-width: 1024px){
    .banner_benefits {
        padding-top: 70px;
    }
    .banner_benefits li{
        width: calc((100% - 2em) / 3);
    }
}

/* 商品詳細_カート・見積ボタン改修 */
.block-detail__order .primary-button__priority {
    background: #eb4d41;
    border: 1px solid #eb4d41;
    padding: 23px 0;
    font-size: 1.8rem;
}
.block-detail__estimate{
    margin: 15px 0 10px!important;
    width: 100%;
}
.primary-button__estimate{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    height: auto;
    padding-top: 15px;
    padding-bottom: 15px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.2s ease;
    border: none;
    color: #fff;
    background: #35b787;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    font-size: 1.4rem;
}
.primary-button__estimate:hover {
    opacity: 0.5;
    background-color: #35b787;
}
.primary-button__estimate .icon{
    padding-right: 15px;
    font-size:2.2rem;
}
.buttons_col-2 {
    justify-content: space-between;
}
.buttons_col-2 .block-detail__button:nth-child(n+3){
    display: none;
}
.buttons_col-2 .block-detail__button {
    width: calc((100% - 15px) / 2);
}
.buttons_col-2 .button-icon {
    flex-direction: row;
    width: 100%;
    height: 65px;
}
.buttons_col-2 .button-icon__text {
    margin: 0 0 0 10px;
    font-size: 1.2rem;
}
.buttons_col-2 .hidden-pc{
    display:none!important;
}
.buttons_col-2 .hidden-sp{
    display:block!important;
}
.buttons_col-4 .block-detail__button {
    width: calc((100% - 30px) / 4);
}
.buttons_col-4 .button-icon {
    width: 100%;
}
.buttons_col-4 .button-icon .icon {
    font-size: 2.5rem;
}
.buttons_col-4 .button-icon__text {
    font-size: 1.05rem;
}
.icon-cart,.icon-estimate,.icon-contact,.icon-large-lot{
    margin-right: 20px;
    width: 27px;
    height: 27px;
    background-position: center;
    background-repeat: no-repeat;
}
.primary-button .icon-balloon{
    margin-right: 20px;
    font-size: 2rem;
}
.icon-cart{
    background-image: url(/html/user_data/assets/img/common/icon_cart.svg);
}
.icon-estimate{
    background-image: url(/html/user_data/assets/img/common/icon_estimate.svg);
}
.icon-contact{
    background-image: url(/html/user_data/assets/img/common/icon_contact.svg);
}
.icon-large-lot{
    background-image: url(/html/user_data/assets/img/common/icon_large-lot.svg);
}
@media (max-width: 1023px){
    .buttons_col-4  {
        width: 315px;
        margin: 15px auto 10px;
    }
    .buttons_col-4 .block-detail__button {
        width: calc((100% - 15px) / 4);
    }
}
.caption--blue{
    color: #0287dd;
    font-size: 1.2rem;
}
.caption--black{
    color: #222;
    font-size: 1.2rem;
}

.block-detail__sample {
    text-align: left;
}
.block-detail__sample__in {
    padding-left: 15px;
    padding-right: 15px;
}
.block-detail__sample__in:after {
    left: 3em;
    right: inherit;
}

/* カテゴリ_カレンダー */
.calen_select .select_box{
    margin-top: -15px;
}
.calen_select .select_box .seletc_ttl {
    font-weight: bold;
    font-size: 1.7em;
    color: #bf0000;
}
.calen_select ul {
    display: inline-block;
    letter-spacing: -0.4em;
}
.calen_select ul li {
    letter-spacing: normal;
    display: inline-block;
    vertical-align: top;
    border: 1px solid #ccc;
    border-bottom: none;
    border-right: none;
    padding: 5px 10px;
}
.calen_select ul li a {
    display: block;
    width: 100%;
    background: #ffffff;
    overflow: hidden;
    transition: all 0.3s ease;
    color: #000;
}
.calen_select ul li a span.select_l {
    float: right;
    display: block;
}
.calen_select ul li a span.select_l img {
    border: 1px solid #999;
    border-radius: 5px;
    width: 100%;
}
.calen_select ul li a span.select_r {
    float: right;
    display: block;
    padding: 5% 5% 5% 1%;
}
.calen_select ul li a span.select_r .item_name {
    display: block;
    margin: 0 0 4px;
    font-weight: bold;
    text-align: left;
    line-height: 1.3;
    color: #0a63c0;
}
.calen_select ul li a span.select_r .item_txt {
    display: block;
    text-align: left;
}

@media screen and (min-width: 992px){
    .calen_select ul li:first-child:nth-last-child(6):nth-last-of-type(-n+6), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-last-of-type(-n+6) {
        border-bottom: 1px solid #ccc;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-child(5n), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-child(5n) {
        border-right: none;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-child(6n), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-child(6n) {
        border-right: 1px solid #ccc;
    }
    .calen_select ul li:first-child:nth-last-child(6),.calen_select ul li:first-child:nth-last-child(6) ~ li:nth-last-of-type(-n+6) {
        width: 16.66666%;
    }
    .calen_select ul li:first-child:nth-last-child(6) a,.calen_select ul li:first-child:nth-last-child(6) ~ li a {
        height: 210px;
    }
    .calen_select ul li:first-child:nth-last-child(6) a span.select_l, .calen_select ul li:first-child:nth-last-child(6) a span.select_r,
    .calen_select ul li:first-child:nth-last-child(6) ~ li a span.select_l, .calen_select ul li:first-child:nth-last-child(6) ~ li a span.select_r,
    .calen_select ul li:first-child:nth-last-child(6) a span.select_r,
    .calen_select ul li:first-child:nth-last-child(6) ~ li a span.select_l, .calen_select ul li:first-child:nth-last-child(6) ~ li a span.select_r{
        width: 100%;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-child(6n), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-child(6n) {
        border-right: 1px solid #ccc;
    }
    .calen_select .select_box .seletc_ttl {
        margin-bottom: 5px;
    }
    .calen_select ul li {
        width: 20%;
    }
    .calen_select ul li a {
        height: 87px;
    }
    .calen_select ul li a span.select_l {
        width: 40%;
        padding: 3% 0;
        margin: 0;
    }
    .calen_select ul li a span.select_r {
        width: 60%;
    }
    .calen_select ul li a span.select_r .item_name {
        font-size: 12px;
    }
    .calen_select ul li a span.select_r .item_txt {
        font-size: 11px;
        line-height: 1.5;
        height: 3em;
        overflow: hidden;
    }
    .calen_select ul li:nth-child(5n) {
        border-right: 1px solid #ccc;
    }
    .calen_select ul li:nth-last-of-type(-n+5) {
        border-bottom: 1px solid #ccc;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px){
    .calen_select ul li:first-child:nth-last-child(6),.calen_select ul li:first-child:nth-last-child(6) ~ li {
        width: 33.333%;
    }
    .calen_select ul li:first-child:nth-last-child(6) a, .calen_select ul li:first-child:nth-last-child(6) ~ li a {
        height: 90px;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-child(3n), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-child(3n) {
        border-right: 1px solid #ccc;
        border-bottom: none;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-child(4n), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-child(4n) {
        border-right: none;
    }
    .calen_select ul li:first-child:nth-last-child(6):nth-last-of-type(-n+3), .calen_select ul li:first-child:nth-last-child(6) ~ li:nth-last-of-type(-n+3) {
        border-bottom: 1px solid #ccc;
    }
    .calen_select ul li {
        width: 25%;
    }
    .calen_select ul li a {
        height: 87px;
    }
    .calen_select ul li a span.select_l {
        width: 30%;
        padding: 3% 0;
        margin: 0;
    }
    .calen_select ul li a span.select_r {
        width: 70%;
    }
    .calen_select ul li a span.select_r .item_name {
        font-size: 13px;
    }
    .calen_select ul li a span.select_r .item_txt {
        font-size: 11px;
        line-height: 1.5;
    }
    .calen_select ul li:nth-child(4n) {
        border-right: 1px solid #ccc;
    }
    .calen_select ul li:nth-last-of-type(-n+4) {
        border-bottom: 1px solid #ccc;
    }
}
@media screen and (max-width: 767px){
    .calen_select ul li {
        width: 50%;
    }
    .calen_select ul li a {
        height: 87px;
    }
    .calen_select ul li a span.select_l {
        width: 30%;
        padding: 3% 0 3% 2%;
        margin: 0;
    }
    .calen_select ul li a span.select_r {
        width: 70%;
    }
    .calen_select ul li a span.select_r .item_name {
        font-size: 14px;
    }
    .calen_select ul li a span.select_r .item_txt {
        font-size: 11px;
        line-height: 1.5;
    }
    .calen_select ul li:nth-child(2n) {
        border-right: 1px solid #ccc;
    }
    .calen_select ul li:nth-last-of-type(-n+2) {
        border-bottom: 1px solid #ccc;
    }
    }

/* 価格表 */
.message-comment{
    margin-bottom: 15px;
}

/*  */
.item_link_btn{
    position: relative;
    display: block;
    background: #ebebeb;
    border: solid 1px #ccc;
    border-radius: 5px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    margin-bottom: 15px;
}
.item_link_btn:after{
    content: '';
    width: 8px;
    height: 8px;
    border-top: solid 3px #551a8b;
    border-right: solid 3px #551a8b;
    position: absolute;
    right: 3%;
    top: 16px;
    transform: rotate(45deg);
}
.item_link_btn:hover{
    background: #ff8d25;
    color: #fff;
}
.item_link_btn:hover:after{
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
}


/* フッター_サポートセンター写真 */
.contact__text{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.contact__image{
    width:100px;
}
.contact__image img{
    width:100%;
    height: fit-content;
}
.contact__heading{
    width: calc(100% - 110px);
    margin-left: 10px;
    margin-right: 0;
}
.contact__heading .sub {
    font-size: 1.3rem;
    text-align: left;
}
.contact__heading .title {
    font-size: 2.1rem;
    font-weight: bold;
}
.contact__lead{
    font-size: 1.2rem;
    text-align: left;
}
@media screen and (min-width: 1348px){
    .contact__heading .sub {
        font-size: 1.5rem;
    }
    .contact__heading .title {
        font-size: 2.5rem;
        font-weight: bold;
    }
    .contact__lead{
        font-size: 1.3rem;
    }
    .contact__lead br{
        display:none;
    }
}

/* TOP_見出し修正(SEO施策) */
.product-list__name {
    font-weight: normal;
}

/* お届け先注意文 */
.sample-caution{
    background-color: #fefdcd;
    padding:10px;
}
.caution-comment{
    font-size:18px;
    font-weight: bold;
    text-align: center;
}
.icon-caution{
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/html/user_data/assets/img/guide/dezatuku/caution_mark.png);
    background-size: 25px;
    background-position: inherit;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 5px;
}

/* レイアウト_flex縦並び */
.main-footer__sub {
    flex-direction: column;
}

/* 下部インフォメーション（支払方法・送料等） */
.main-footer__information{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 13px;
    margin-bottom: 50px;
    padding-top: 50px;
    border-bottom: 1px solid #ccc;

}
.main-footer__information .info-title{
    font-weight: bold;
    font-size: 1.4em;
    border-left: 7px solid #00cccc;
    padding-left: 7px;
    line-height: 1.2;
    margin-bottom: 10px;
    margin-top: 40px;
}
.main-footer__information .info-title:first-child{
    margin-top: 0;
}
.main-footer__information .info-subtitle{
    font-weight: bold;
    font-size: 1.2em;
    margin-top: 20px;
    margin-bottom: 5px;
}
.main-footer__information .info-subtitle:first-child{
    margin-top: 0;
}
.main-footer__information .info-subtitle span{
    font-size: 0.8em;
    vertical-align: middle;
    color: #555;
}
.main-footer__information .info-link a{
    text-decoration: underline;
    color: #337ab7;
}
.main-footer__information .info-link a:hover{
    text-decoration: none;
}
.main-footer__information img{
    vertical-align: bottom;
}
@media screen and (min-width: 1024px){
    .information__left{
        width: 30%;
    }
    .information__center{
        width: 35%;
    }
    .information__right{
        width: 23%;
    }
}
@media screen and (max-width: 1024px){
    .information__center,
    .information__right{
        margin-top: 40px;
    }
}

/* 商品詳細_納期カレンダーボタン */
.unker-button_calendar{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 230px;
    max-width: 100%;
    background: #6bcc00;
    color: #fff;
    margin: 5px auto 0;
    padding: 6px;
    border-radius: 50px;
    font-weight: bold;
}
.unker-button_calendar:hover{
    opacity: 0.5;
    cursor: pointer;
    transition: all 0.2s ease;
}
.unker-button_calendar .icon-calendar{
    margin-right:7px;
    font-size:1.7rem;
}

/* フリーエリア修正 */
.block-detail__edit .block-items__list{
    font-size: 1rem;
}

/* Sランク商品_下部サムネエリア */
.srank_thumb_wrap{
    display:flex;
    flex-direction: column;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
    gap:20px;
}
.srank_thumb_wrap img{
    width: 500px;
    max-width: 100%;
    vertical-align: bottom;
}
@media (min-width: 768px){
    .srank_thumb_wrap{
        flex-direction: row;
        justify-content: space-between;
    }
    .srank_thumb_wrap img{
        width: calc((100% - 20px) / 2);
    }
}
/* =============================================
ジャンル
============================================= */
.category_main_title {
    font-size: 2.5em;
}
.category_explanation {
    margin-top: 20px;
    font-size: 1.4em;
}
.category_explanation a{
    text-decoration: underline;
    color: #00cccc;
}
.category_explanation a:hover{
    text-decoration: none;
}
@media (min-width: 768px){
    .category_explanation{
        font-size:1.5rem;
    }
}

/* 商品詳細_納期カレンダーボタン */
.block-price__table .cell_campaign{
    background-color: #fffd74;
}

/* TOP_商品・特集一覧ボタン（大） */
.button__more{
    margin-top: 20px;
    margin-bottom:50px; 
}
.button__more a{
    box-sizing: border-box;
    position: relative;
    width: 350px;
    max-width: 100%;
    margin: auto;
    padding: 15px 40px;
    border: #ccc solid 1px;
    border-radius: 5px;
    display: block;
    text-align: center;
    color: #00cccc;
    font-size: 1.6rem;
    font-weight: bold;
}
.button__more a:after{
    content: "";
    position: absolute;
    top: 46%;
    right: 15px;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: #939393;
    transform: rotate(-45deg) translate(0, -50%);
}
@media (min-width: 1024px){
    .button__more{
        margin-top:0;
    }
}
/* 商品詳細ページ_改修 */
.block-detail__head-icon{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    margin-top: -15px;
    margin-bottom: -15px;
}
.button-simple{
    background: #fff;
    border-radius: 100px;
    font-size: 2.2rem;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.button-simple .simple-icon_copy{
    width: 25px;
    height: 25px;
    background: url(/html/user_data/assets/img/common/icon_link-copy.svg) no-repeat;
}
.button-simple .simple-icon_heart{
    width: 25px;
    height: 25px;
    background: url(/html/user_data/assets/img/common/icon_bookmark-off.svg) no-repeat;
}
.block-detail__button--selected .button-simple .simple-icon_heart{
    background: url(/html/user_data/assets/img/common/icon_bookmark-on.svg) no-repeat;
}

/* カート画面_改修 */
.block-speech__wrap{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}
.block-speech__balloon{
    display: block;
    width: calc(100% - 70px);
    margin-right: 20px;
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 15px;
    position: relative;
    word-break: break-all;
    line-height: 1.6;
}
.block-speech__balloon:before{
    content: "";
    position: absolute;
    top: 45%;
    right: -10px;
    border-left: 11px solid #ffffff;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    z-index: 2;
}
.block-speech__balloon:after{
    content: "";
    position: absolute;
    top: 45%;
    right: -11px;
    border-left: 11px solid #ccc;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
}
.block-speech__comment{
    font-size: 1.25rem;
}
.block-speech__image{
    width: 50px;
}
.block-draft {
    border: none;
}
.block-cart {
    margin-top: 40px;
}
.block-caption__box{
    border:1px solid #ccc;
    padding:20px;
}
.block-caption__title{ 
    position: relative;
    margin-bottom: 5px;
    padding-left:3rem;
    font-size: 1.8rem;
    font-weight: bold;
}
.block-caption__title::before {
    content: "";
    position: absolute;
    top: 45%;
    left: 0;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    background: url(/html/template/default/assets/img/icon_alert.svg) no-repeat 0 0/contain;
}
.block-caption__list{ 
    line-height: 1.4;
    padding-left: 1.5em;
}
.block-caption__list li{ 
    list-style: disc;
}
.block-caption__list li::marker{ 
    color:#bf0000;
    font-size: 20px;
}
.block-cart__draft{
    display: none;
}
@media (min-width: 1024px){
    .block-cart__right__head {
        align-items: flex-start;
        flex-direction: column;
    }
    .block-speech__balloon{
        width: calc(100% - 100px);
        padding: 20px;
    }
    .block-speech__comment{
        font-size: 1.5rem;
    }
    .block-speech__image{
        width: 80px;
    }
}

/* 注文手続き画面_改修 */
.block-cart:first-child{
    border-bottom: 1px solid #ccc;
    border-top: none;
}
.form-item__name {
    color: #00bebe;
}
.sub-button__priority {
    border: 1px solid #fb781f;
    background: #fb781f;
}
@media (min-width: 1024px) {
    .form-vertical .form-block{
        display: block;
    }
    .form-vertical .form-item__input {
        margin-top: 15px;
    }
    .form-vertical .form-info__input {
        margin-top:15px;
    }
    .form-vertical .form-item__name {
        width: auto;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    .form-vertical .form-item__name .tag--required {
        margin-left: 10px;
        margin-bottom: 0;
    }
    .form-item__name {
        flex-wrap: wrap;
    }
    .form-item__sub-name{
        font-size:1.3rem;
    }
}

/* 遅延お知らせ */
.delivery-information {
    margin: 25px 0;
    padding: 15px 20px;
    line-height: 1.8;
    border: 1px solid #ccc;
    background: #f9f9f9;
    border-radius: 5px;
    font-size: 1.4rem;
}

/* 商品ページ_在庫数確認表 */
.block-zaiko__title{
    font-size: 1.7rem;
    margin-bottom: 5px;
}
.block-zaiko__list{
    width: 500px;
    max-width: 100%;
}
.block-zaiko__table{
    width: 100%;
    table-layout: fixed;
}
.block-zaiko__table th,
.block-zaiko__table td{
    vertical-align: middle;
    text-align: center;
    border: 1px solid #ccc;
    padding: 5px;
    font-size: 1.2rem;
}
.block-zaiko__top{
    color: #ffffff;
    background-color: #666666;
    font-weight: 600;
}
.block-zaiko__subttl{
    font-weight: 600;
    background-color: #f7f7f7;
}
.block-zaiko__type-head{
    color: #ffffff;
    background-color: #ff8d25;
    font-weight: 600;
    width: 160px;
}
.block-zaiko__type{
    background-color: #fff1e4;
    font-weight: 600;
}
.block-zaiko__count{
    width: calc((100% - 160px) / 2);
}

/* TOP_キャンペーン情報コーナー */
.campaign-list__wrap{
    overflow-x: scroll;
}
.campaign-list{
    display: flex;
    width: max-content;
}
.campaign-list__item{
    width: 130px;
    margin-bottom: 10px;
}
.campaign-list__item:not(:nth-child(5n)) {
    margin-right: 15px;
}
.campaign-list__item:last-child {
    margin-right: 0;
}
.campaign-list__item a{
    display: block;
    color:#222;
}
.campaign-list__item img{
    width:100%;
    vertical-align: bottom;
    border: 1px solid #ddd;
}
.campaign-list__item:hover{
    opacity: 0.7;
}
.campaign-list__limit{
    display: block;
    background: #000;
    margin: 5px 0;
    padding: 3px 10px;
    color: #fff;
    text-align: center;
    font-size: 1.3rem;
}
.campaign-list__comment{
    font-size:1.3rem;
}
@media (min-width: 1024px){
    .campaign-list__wrap{
        overflow-x: unset;
    }
    .campaign-list{
        width: 100%;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .campaign-list__item{
        width: calc((100% - 60px) / 4);
    }  
}

/* TOP_主力商品紹介コーナー */
.thumbnail-detail__wrap{
    margin-bottom: 10px;
    background: #f9f9f9;
    position: relative;
}
.thumbnail-detail__wrap a {
    transition: all 0.2s;
}
.thumbnail-detail__wrap a:hover{
    opacity: 0.7;
}
.thumbnail-detail__title{
    color:#00cccc;
    font-size:1.8rem;
    font-weight: bold;
    padding-bottom:10px;
}
.thumbnail-detail__image img{
    vertical-align: bottom;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.thumbnail-detail__text{
    padding: 15px;
}
.thumbnail-detail__comment{
    font-size:1.4rem;
}
.thumbnail-detail__leading{
    margin: 10px auto 0;
    border-radius: 5px;
    text-align: center;
}
.thumbnail-detail__leading a{
    position: relative;
    color: #222;
    padding: 7px 30px 7px 50px;
    font-size: 1.4rem;
    display: inline-block;
    font-weight: bold;
    border: 1px solid #dddddd;
    border-radius: 50px;
    max-width: 100%;
    background: #fff;
}
.thumbnail-detail__leading a:before,
.thumbnail-detail__leading a:after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 15px;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.thumbnail-detail__leading a:before{
    width: 16px;
    height: 16px;
    background: #ff8100;
    border-radius: 50%;
}
.thumbnail-detail__leading a:after{
    left: 21px;
    box-sizing: border-box;
    width: 5px;
    height: 5px;
    border: 4px solid transparent;
    border-left: 5px solid #fff;
}
.thumbnail-detail__tag{
    position: absolute;
    width: 85px;
    height: 85px;
    top: -3px;
    left: -3px;
    background-repeat: no-repeat;
    filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.2));
}
.thumbnail-detail__tag.tag_ichioshi {
    background-image: url(/html/user_data/assets/img/common/slider-tag_ichioshi.svg);
}
@media screen and (min-width: 768px){
    .thumbnail-detail__wrap{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .thumbnail-detail__title{
        font-size:1.8rem;
    }
    .thumbnail-detail__image{
        width: 360px;
    }
    .thumbnail-detail__text{
        width: calc(100% - 360px);
        padding: 15px 20px;
    }
}

/* カテゴリナビ(PC)_2カラム */
.sidenav__item{
    margin-bottom: 30px;
    border: none;
}
.sidenav__title{
    background: #717171;
    font-size: 1.4rem;
    font-weight: bold;
}
.sidenav__list_pc .list-item {
    display: flex;
    align-items: center;
    position: relative;
    padding:10px 0;
    border-bottom: 1px solid #ddd;
    color:#222;
}
.sidenav__list_pc .list-item::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 5px;
    height: 5px;
    transform: rotate(-45deg) translate(0, -50%);
    border-bottom: 2px solid #bbb;
    border-right: 2px solid #bbb;
}
.sidenav__list_pc .list-item:hover {
    background: none;
}
.sidenav__list_pc .list-item:hover .list-item__text{
    color:#bf0000;
    transition: all 0.2s ease;
}
.sidenav__list_pc .list-item img {
    margin-right: 10px;
}
.sidenav__list_pc .list-item__text {
    font-size: 1.25rem;
    font-weight: bold;
    width: 170px;
    margin-right: 10px;
}
.sidenav__list_pc .list-item .tag {
    position: absolute;
    top: 50%;
    right: 20px;
    margin: 0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
}
.sidenav__list_pc .list-item:hover img{
    opacity: 0.5;
    transition: all 0.2s ease;
}
.sidenav__list_pc .list-item__text p {
    font-weight: normal;
}
.sidevav_more-link{
    margin-top:10px;
}
.sidevav_more-link a{
    display: flex;
    align-items: center;
    border: 1px solid #bf0000;
    justify-content: center;
    padding: 10px;
    font-size: 1.4rem;
    font-weight: bold;
    color: #222;
}
.sidevav_more-link a:hover{
    opacity: 0.7;
}
.sidevav_more-link img{
    margin-right:10px;
}

/* 商品詳細ページ　商品画像コーナー */
.detail-contents {
text-align: center;
}
.detail-contents img:hover {
	opacity: 0.5 ;
}
@media only screen and (min-width: 600px) {
.detail {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 50px;
}
.detail-contents {
    width: calc(50% - 9px);
}
}

/* カテゴリ_タイプ別紹介コーナー */
.category-contents{
    display: flex;
    flex-wrap: wrap;
    gap:10px;
    padding-bottom: 50px;
}
.category-contents__item{
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    overflow: hidden;
}

.category-contents__item a,
.category-contents__item > div{
    display: flex;
    flex-direction: column;
    color: #222;
    height: 100%;
    padding:10px;
    box-sizing: border-box;
    transition: all 0.2s;
}
.category-contents__item a:has(.category-contents__title) {
    flex-direction: column-reverse;
    justify-content: flex-end;
    gap:10px;
}
.category-contents__item a:hover{
    opacity: 0.7;
}
.category-contents__item a:hover .category-contents__title{
    color:#00cccc;
}
.category-contents__item .contents_text{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 0;
    height: 100%;
    font-size: 1.4rem;
}
.category-contents__title{
    position: relative;
    width: 100%;
    margin-bottom: 5px;
    text-align: center;
    line-height: 1.4;
    font-size:1.4rem;
    font-weight: bold;
}
.category-contents__flexbox .flexbox_text {
    text-align: center;
    margin-top: 5px;
    line-height: 1.6;
    font-size: 1.4rem;
}
.flexbox_text_re{
    text-align: center;
    margin-top: 5px;
    line-height: 1.6;
    font-size: 1.1rem;
}
.category-contents__floatbox{
    display: block;
    padding: 0 5px;
}
.category-contents__floatbox img{
    float:right;
    margin:0 0 10px 15px;
}
.category-contents__floatbox .floatbox_text{
    line-height: 1.6;
    font-size: 1.3rem;
}
.category-contents__hover{
    display: flex;
    position: relative;
    align-items: center;
    opacity: 1;
    height: 100%;
    min-height: 75px;
}
.category-contents__hover img{
    vertical-align: bottom;
    width: 100%;
    transition: all 0.2s;
}
.category-contents__hover .hover_text{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    font-size: 1.4rem;
    font-weight: bold;
}
.category-contents__hover:hover .hover_text{
    opacity: 1;
    background: #fff;
}
@media screen and (min-width: 768px) {
    .category-contents{
        gap:15px;
    }
    .category-contents__item.col-l{
        width: calc((100% - 15px) / 2);
    }
    .category-contents__item.col-m{
        width: calc((100% - 45px) / 4);
        padding:0;
    }
    .category-contents__item.col-s{
        width: calc((100% - 75px) / 6);
    }
    .category-contents__item.col-ss{
        width: calc((100% - 105px) / 8);
    }
    .category-contents__item.col-ss .category-contents__flexbox{
        flex-direction: column;
    }
    .category-contents__item.col-ss .category-contents__flexbox .flexbox_text {
        width: 100%;
        text-align: center;
    }
    .category-contents__floatbox{
        padding:10px 15px;
    }
    .category-contents__item.col-ss:nth-child(8n){
        margin-right:0;
    }
    .category-contents__item a,
    .category-contents__item > div{
        display: block;
        padding: 0;
    }
    .cate-contents__flexbox{
        display: flex;
    }
    .category-contents__flexbox{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .category-contents__title{
        padding: 10px;
        background: #f4f4f4;
        text-align: left;
        font-size: 1.5rem;
        font-weight: bold;
    }
    .category-contents a .category-contents__title:after{
        content: "";
        position: absolute;
        top: 50%;
        right: 7px;
        width: 5px;
        height: 5px;
        transform: rotate(-45deg) translate(0, -50%);
        border-bottom: 2px solid;
        border-right: 2px solid;
        border-color:#bbb;
    }
    .category-contents a:hover .category-contents__title:after{
        border-color:#00cccc;
    }
    .category-contents__flexbox{
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px;
    }
    .category-contents__flexbox img{
        width: 65px;
        height: max-content;
    }
    .category-contents__flexbox .flexbox_text {
        display: block;
        width: calc(100% - 75px);
        margin:0;
        text-align: start;
        font-size: 1.3rem;
    }
    .category-contents__title + .category-contents__flexbox{
        flex-direction: column;
        gap:10px;
    }
    .category-contents__title + .category-contents__flexbox img {
        width:100px;
    }
    .category-contents__title + .category-contents__flexbox .flexbox_text {
        width:100%;
    }
    .category-contents__hover{
        padding: 10px;
    }
}
@media screen and (max-width: 767px) {
    .category-contents__item.col-l{
        width: 100%;
    }
    .category-contents__item.col-l:nth-child(2n){
        margin-right:0;
    }
    .category-contents__item.col-l .category-contents__title {
        font-size: 1.6rem;
        margin-bottom:10px;
    }
    .category-contents__item.col-2,
    .category-contents__item.col-m,
    .category-contents__item.col-s,
    .category-contents__item.col-ss{
        width: calc((100% - 20px) / 3);
    }
    .category-contents__flexbox img{
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
}
/* カテゴリ_タブ選択 */
@media screen and (max-width: 767px){
    .category-tab_wrap .tab-list {
        display: flex;
        justify-content: space-between;
        gap: 3px;
        padding: 0 5px;
    }
    .category-tab_wrap .tab-list-item {
        position: relative;
        text-align: center;
        background-color: #e8e8e8;
        padding: 15px 5px;
        width: 100%;
        line-height: 1.4;
        font-size: 14px;
        font-weight: bold;
        border-radius: 5px 5px 0 0;
    }
    .category-tab_wrap .tab-list-item:hover {
        color:#00cccc;
        cursor: pointer;
    }
    .category-tab_wrap .tab-list-item.active {
        background-color: #00cccc;
        color: #fff;
    }
    .category-tab_wrap .tab-list-item.active:after{
        content: "";
        position: absolute;
        z-index: 1;
        left: 40%;
        bottom: -8px;
        border-top: 9px solid #00cccc;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 0;
    }
    .category-tab_wrap{
        margin-bottom: 50px;
    }
    .category-tab_wrap .tab-contents{
        background: #f7f7f7;
        padding: 25px 10px 20px;
    }
    .category-tab_wrap .tab-contents-item {
        display: none;
    }
    .category-tab_wrap .tab-contents-item.show {
        display: block;
    }
    .category-tab_wrap .tab-contents-item .category-contents{
        padding-bottom:0;
    }
}

/* ボトム_制作事例*/
.example-list__inr {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 40px;
}
.example-list__inr li {
    letter-spacing: normal;
    border-bottom: 1px solid #ccc;
    margin-bottom: 0;
    padding: 1.5% 0;
    vertical-align: top;
}
.example-list__inr li a {
    color: #000;
    position: relative;
    padding: 5% 5% 0;
}
.rankList li a, .example-list__inr li a {
    display: block;
}
.new {
    background: #ff654a;
    padding: 3px 5px;
    font-size: 1.2em;
    color: #fff;
    position: absolute;
    z-index: 1;
    left: 5%;
    top: 3%;
    border-radius: 4px;
}
.example-list__inr li img {
    max-width: 90%;
    max-height: 90%;
    display: block;
    margin: auto;
}
.example-list__inr li .wc_news {
    display: block;
    width: 100%;
    bottom: 0;
    padding-top: 5%;
}
.example-list__inr li .wc_news .wc_company {
    font-size: 13px;
    font-weight: bold;
    line-height: 16px;
    display: block;
}
.example-list__inr li .wc_news .wc_item {
    font-size: 11px;
    padding-top: 5px;
    line-height: 1.4;
    color: #575757;
}
.rankList li a:hover, .example-list__inr li a:hover {
    opacity: 0.7;
}
.content__lead {
    margin-top: 0;
    text-align: left;
    font-size: 1.4rem;
}
.staff-reaction{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 30px 20px;
    gap: 20px;
    background: #f7f7f7;
    margin-top:30px;
    margin-bottom: 60px;
    border-radius: 10px;
}
.staff-reaction__box{
    padding: 10px;
    position: relative;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 1px 5px rgb(0 0 0 / 20%);
}
.staff-reaction__inr{
    border: 1px dashed #ccc;
    padding: 16px;
    border-radius: 5px;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.staff-reaction__heading{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
}
.staff-reaction__heading img{
    width: 75px;
    margin-top: -35px;
    height: max-content;
}
.staff-reaction__caption{
    font-size: 1.6rem;
    line-height: 1.4;
    font-weight: bold;
}
.staff-reaction__comment{
    font-size: 1.3rem;
}
.staff-reaction__comment red{
    font-weight: bold;
    color:#00cccc;
}
.sub_title{
    margin-bottom: 20px;
    font-size: 2rem;
    text-align: center;
    color: #00cccc;
}
@media screen and (max-width: 767px){
    .example-list{
        overflow-x: scroll;
    }
    .example-list__inr{
        width: max-content;
    }
    .example-list__inr li {
        width: 150px;
    }
    .example-list__inr li .wc_news {
        height: 80px;
    }
}
@media screen and (min-width: 768px){
    .example-list__inr li {
        width: 20%;
    }
    .example-list__inr li .wc_news {
        height: 90px;
    }
    .staff-reaction{
        margin-top:0;
    }
    .staff-reaction__box{
        width: calc((100% - 40px) / 3);
    }
}

/* ボトム_素材別メリット*/
.category-merit{
    padding-bottom:50px;
}
.category-merit__grid{
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-columns: 150px 1fr;
    gap: 0 15px;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px dashed #ccc;
}
.category-merit__title{
    grid-row: 1 / 2;
    grid-column: 2 / 3;
    margin-bottom:10px;
    font-size: 1.8rem;
    color: #00cccc;
}
.category-merit__grid img{
    grid-row: 1 / 3;
    grid-column: 1 / 2;
    vertical-align: bottom;
}
.category-merit__note{
    grid-row: 2 / 3;
    grid-column: 2 / 3;
    font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
    .category-merit__note{
        font-size: 1.5rem;
    }
}

/* カテゴリ_PRESS記事リンク */
.category-contents__press {
    border:1px solid #ccc;
    width: 100%;
}
.category-contents__press a{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px;
    height: 100%;
    box-sizing: border-box;
}
.category-contents__press a:hover{
    opacity: 0.7;
}
.category-contents__press img{
    width: 180px;
    height: max-content;
    vertical-align: bottom;
}
.category-contents__press .column-list__wrap{
    width: calc(100% - 180px);
    padding: 0 0 0 15px;
}

@media screen and (min-width: 768px) {
    .category-contents__press:only-child {
        width: 100%!important;
    }
    .category-contents__press:only-child a{
        flex-direction: row!important;
    }
    .category-contents__press:only-child img{
        width: 180px!important;
    }
    .category-contents__press:only-child .column-list__wrap {
        width: calc(100% - 180px)!important;
    }
    .category-contents__press:first-child:nth-last-child(2n),
    .category-contents__press:first-child:nth-last-child(2n) ~ * {
        width: calc((100% - 15px) / 2);
    }
    .category-contents__press:first-child:nth-last-child(2n+1),
    .category-contents__press:first-child:nth-last-child(2n+1) ~ * {
        width: calc((100% - 30px) / 3);
    }
    .category-contents__press:first-child:nth-last-child(2n+1) a,
    .category-contents__press:first-child:nth-last-child(2n+1) ~ * a{
        flex-direction: column;
        padding:0;
    }
    .category-contents__press:first-child:nth-last-child(2n+1) img,
    .category-contents__press:first-child:nth-last-child(2n+1) ~ * img{
        width: 100%;
    }
    .category-contents__press:first-child:nth-last-child(2n+1) .column-list__wrap,
    .category-contents__press:first-child:nth-last-child(2n+1) ~ * .column-list__wrap{
        width: 100%;
        padding:10px;
    }
}


/* 新規カテゴリページ */
.contents_text {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    padding: 10px;
    height: 100%;
    font-size: 1.4rem;
    position: relative;
}
.difference-point_box {
    margin-top: 50px;
    margin-bottom: 70px;
    }
    
.difference-point {
    padding: 10px;
    margin-bottom: 20px;
    }
.difference-point_img {
    width: 100%;
    }
    
.difference-point_text {
    font-size: 1.6em;
    margin-left: 20px;
    }
    
.difference-point_text {
    font-size: 1.6em;
    }

.green-product_content {
    text-align: center;
}

.green-product_text {
    font-size: 1.6em;
    }

.green-product_content_01 {
    width: 50%;
    margin: 20px auto 20px;
}
.green-product_content_02 {
    width: 50%;
    margin: 20px auto 20px;
}

.green-product_btn {
    box-sizing: border-box;
    position: relative;
    width: 350px;
    max-width: 100%;
    margin: 20px auto;;
    padding: 15px 40px;
    border: #ccc solid 1px;
    border-radius: 5px;
    display: block;
    text-align: center;
    color: #00cccc;
    font-size: 1.6rem;
    font-weight: bold;
    }
    
.green-product_btn:after {
    content: "";
    position: absolute;
    top: 46%;
    right: 15px;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: #939393;
    transform: rotate(-45deg) translate(0, -50%);
    }
    
h3.category_title {
font-size: 1.6rem;
font-weight: bold;
border-left: 6px solid #00cccc;
padding-left: 10px;
margin: 40px 0 20px;
    }
h3.category_title_exercise {
    font-size: 1.6rem;
    font-weight: bold;
    border-left: 6px solid #00cccc;
    padding-left: 10px;
    margin: 0 0 20px;
}
.trivia {
    margin-bottom: 50px;
}
.staff-reaction__content {
    padding: 8px;
    position: relative;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 1px 5px rgb(0 0 0 / 20%);
    background-color: #fffde6;
}
.staff-reaction__item {
    border: 1.5px dashed #c33636;
    padding: 15px;
    border-radius: 5px;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.staff-reaction__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid #c33636;
}
.flex_banner-list{
    display: flex;
    flex-direction: column;
    gap:20px;
}
.flex_banner-list a{
    display: block;
    transition: all 0.2s;
}
.flex_banner-list a:hover{
    opacity: 0.7;
}
.flex_banner-list li img{
    width:100%;
    vertical-align: bottom;
}
.category-header_back{
    display: flex;
    align-items: center;
    height: 70px;
    margin-bottom: 30px;
    padding-left: 15px;
    border-left: 7px solid #00cccc;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: right;
    background-size: cover;
}
.category-header_title{
    font-size: 2.4rem;
    font-weight: bold;
    text-shadow: 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa, 0 0 3px #fafafa;
}
@media screen and (min-width: 768px) {
    .category-contents__flexbox {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px;
    }
    .cate-contents__flexbox{
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px;
    }
    .staff-reaction__content {
        width: calc((100% - 40px) / 3);
    }
    .difference-point {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }   
    .difference-point_img {
        width: 40%;
        height: 100%;
    }  
    .difference-point_text {
        width: 60%;
    }  
    .guide_frame .clum2 .block {
        padding: 0;
    }   
    .green-product_content {
        display: flex;
        width: 100%;
        margin-top: 30px;
        align-items: center;
    }
    .green-product_content_01 {
        flex-grow: 1;
        width: 100px;
        padding: 20px;
    }
    .green-product_content_02 {
        flex-grow: 1;
        width: 100px;
        padding: 20px;
    }
    .green-product_content_03 {
        flex-grow: 2;
    }
    .green-product_btn {
        margin: auto;
    }
    .flex_banner-list{
        flex-direction: row;
        gap:15px;
    }
    .head_anchor .contents_text {
        font-weight: bold;
    }
    .head_anchor .contents_text::after {
        content: '';
        width: 6px;
        height: 6px;
        border: 0;
        border-top: solid 2px #bbb;
        border-right: solid 2px #bbb;
        position: absolute;
        top: 50%;
        right: 15px;
        margin-top: -5px;
        transform: rotate(135deg);
    }
    .category-header_back{
        height: 100px;
    }
    .category-header_title{
        font-size: 2.8rem;
    }
}


/* TOP_おすすめ特集（タブ切替） */
.trend-tab__wrap{
    margin: 30px 0;
}
.trend-tab__wrap .tab-list {
    display: flex;
    justify-content: space-between;
    gap: 5px;
    padding: 0 5px;
}
.trend-tab__wrap .tab-list-item {
    position: relative;
    text-align: center;
    background-color: #e8e8e8;
    padding: 15px 5px;
    width: 100%;
    line-height: 1.4;
    font-size: 1.8rem;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.trend-tab__wrap .tab-list-item span{
    display: none;
}
.trend-tab__wrap .tab-list-item:hover {
    color:#00cccc;
    cursor: pointer;
}
.trend-tab__wrap .tab-list-item.active {
    background-color: #00cccc;
    color: #fff;
}
.trend-tab__wrap .tab-list-item.active:after{
    content: "";
    position: absolute;
    z-index: 1;
    left: 40%;
    bottom: -8px;
    border-top: 9px solid #00cccc;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 0;
}
.trend-tab__wrap .tab-contents{
    background: #f7f7f7;
    padding: 20px 10px;
}
.trend-tab__wrap .tab-contents-item {
    display: none;
}
.trend-tab__wrap .tab-contents-item.show {
    display: block;
    padding-bottom: 10px;
}
.trend-tab__wrap .tab-contents-item .category-contents{
    padding-bottom:0;
}
.category-list{
    gap: 10px;
    justify-content: flex-start;
}
.trend-tab__wrap .category-list__item{
    width: calc((100% - 10px) / 2);
    margin: 0;
}
.trend-tab__wrap .category-list__item img{
    max-height: 137px;
    vertical-align: bottom;
}
.trend-tab__wrap .button__more{
    margin: 0;
}
.trend-tab__wrap .button__more a{
    background: #fff;
}
@media screen and (min-width: 768px){
    .trend-tab__wrap .tab-contents{
        padding: 20px 20px 30px;
    }
    .trend-tab__wrap .category-list__item{
        width: calc((100% - 20px) / 3);
        margin: 0;
    }
    .trend-tab__wrap .tab-list-item span{
        display: inline-block;
        font-size:1.2rem;
        font-weight: normal;
    }
}
/*クリアファイル リサイクルマーク*/
@media screen and (min-width: 768px){
    .pc__recycle{
        display: flex;
    }
    .pc__recycle img{
        width: 60px;
    }
    .pc__design {
        padding: 0.6rem 0rem 0.6rem 0.4rem;
        border-left: 5px solid #898989;
        background: #f4f4f4;
        margin-top: 1.2rem;
        margin-bottom: 50px;
    }
}

/* 配信メッセージ */
.notification_info{
    
}
.notification_info .mail-button{
    display: inline-block;
    justify-content: center;
    align-items: center;
    position: relative;
    border-radius: 5px;
    height: auto;
    padding: 10px 30px 10px 70px;
    font-size: 1.6rem;
    font-weight: bold;
    text-decoration: none;
    background: #00cccc;
    color: #fff;
    transition: all 0.2s ease;
    box-sizing: border-box;
}
.notification_info .mail-button:before{
    position: absolute;
    content: "";
    width: 20px;
    height: 14px;
    top: 50%;
    left: 25px;
    transform: translateY(-50%);
    background: no-repeat 0 0/contain;
    background-image: url(/html/template/default/assets/img/ico_mail_w.svg);
}

/* 青色に書き換え */
.title{
    border-bottom: 3px solid #00cccc;
}
.header-lite{
    border-top: 10px solid #00cccc;
}
.main-header__body .logo img {
    width: auto;
    height: fit-content;
}
.main-header__body .search__button{
    background: #00cccc url(/html/template/default/assets/img/ico_search.svg) no-repeat 50% 50%;
}
.main-header .search-sp__button{
    background: #00cccc url(/html/template/default/assets/img/ico_search.svg) no-repeat 50% 50%;
}
.main-header .search-sp__copy{
    color: #00cccc;
}
.main-header__body{
    border-bottom: 2px solid #00cccc;
}
.main-header .category__link{
    background: #00cccc;
}
.main-header .search-sp__detail{
    color: #00cccc;
}
.main-header .category__button{
    background: #00cccc;
}
.contact__info .tel__num::before{
    background-image: url(/html/user_data/assets/img/common/ico_lg_tel.svg);
}
.content-front .title{
    border-bottom: 3px solid #00cccc;
}
.heading{
    color: #00cccc;
}
.contact__info .tel__time{
    color: #00cccc;
}
.contact__info .mail-button{
    background: #00cccc;
}
.contact__info .tel__num{
    color: #00cccc;
}
.calendar__time{
    color: #00cccc;
}
.main-footer__body{
    background: #00cccc;
}
.main-footer__info{
    border-top: 3px solid #00cccc;
}
.flow-order__item--current{
    background: #00cccc;
}
.flow-order__item--current:after{
    border-left: 7px solid #00cccc;
}
.hamburgernav__contact{
    background: #00cccc;
}
.pager-normal__item--active{
    background: #00cccc;
}
.list-cat__item.is-current a{
    background-color: #00cccc;
    border: 1px solid #00cccc;
}
.product-detail .title{
    border-bottom: 3px solid #00cccc;
    background: #00cccc;
}
.block-detail__tags .icon{
    color: #00cccc;
}
@media screen and (min-width: 1348px){
    .main-footer__info {
        display: block;
        justify-content: center;
        align-items: center;
        padding-right: 0;
        padding-left: 0;
    }
    .main-footer__inr{
        margin: 0 auto;
    }
    .main-header__body .search__copy{
        color: #00cccc;
    }
}

@media screen and (min-width: 1024px){
    .main-header__sub{
        background: #00cccc;
    }
 }


/* カテゴリ_人気ランキング（ver.20230427） */
.product-list__ranking {
    width: 130px;
}
.product-list__ranking .ranking__rank {
    z-index: 1;
}
.product-list__ranking .ranking__rank:before {
    font-size: 2.2rem;
    font-weight: bold;
}
.product-list__ranking:first-of-type .ranking__rank {
    color: #dbb20b;
}
.product-list__ranking:first-of-type .ranking__rank:before {
    content: "1";
}
.product-list__ranking:nth-of-type(2) .ranking__rank {
    color: #4d7099;
}
.product-list__ranking:nth-of-type(2) .ranking__rank:before {
    content: "2";
}
.product-list__ranking:nth-of-type(3) .ranking__rank {
    color: #cc5229;
}
.product-list__ranking:nth-of-type(3) .ranking__rank:before {
    content: "3";
}
.product-list__ranking:nth-of-type(4) .ranking__rank:before {
    content: "4";
}
.product-list__ranking:nth-of-type(5) .ranking__rank:before {
    content: "5";
}
.category-ranking__wrap{
    background: #fffbda;
    margin-bottom: 30px;
    padding: 10px;
}
.category-ranking__title {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
    font-size: 2rem;
    margin-bottom: 10px;
}
.icon-crown{
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 0 5px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position-y: bottom;
    background-image:url(/html/user_data/assets/img/common/icon_crown.svg); 
}
.category-ranking__wrap .block-items__item__img {
    padding-top: 0;
}
.category-ranking__wrap .ranking__rank {
    position: initial;
    background: none;
    padding: 0;
    display: block;
    width: auto;
    height: auto;
    text-align: center;
    line-height: 1.2;
    background-image: url(/html/user_data/assets/img/common/icon_rank-back.webp);
    background-repeat: no-repeat;
    background-size: 50px;
    background-position-x: center;
    background-position-y: 2px;
}
.category-ranking__wrap .product-list__ranking:first-of-type .ranking__rank {
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_gold.webp);
}
.category-ranking__wrap .product-list__ranking:nth-of-type(2) .ranking__rank {
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_silver.webp);
}
.category-ranking__wrap .product-list__ranking:nth-of-type(3) .ranking__rank {
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_bronze.webp);
}
.category-ranking__wrap .block-items__item__link{
    display: flex;
    flex-direction: column;
    transition: all 0.2s;
}
.category-ranking__wrap .block-items__item__link:hover{
    opacity: 0.7;
}
.category-ranking__wrap .block-items__item__img img  {
    position: relative;
    max-height: 300px;
}
.category-ranking__wrap .product-list__ranking{
    margin: 0;
    background: #fff;
    padding: 5px 10px 10px;
}
.category-ranking__wrap .product-list__inr{
    gap: 5px;
    justify-content: space-around;
    align-items: stretch;
}
.category-ranking__wrap .product-list__name {
    color: #222;
    height: 2.8em;
    line-height: 1.4;
    font-size: 1.2rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.category-ranking__wrap .product-list__lot {
    font-size: 1rem;
}
.category-ranking__wrap .product-comment{
    font-size: 1.2rem;
    color: #888888;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    margin-top: auto;
}
.category-ranking__wrap .product-comment *{
    font-size: 1.1rem;
    color: #888888;
    font-weight: normal;
    text-decoration: none;
}
.category-ranking__wrap .product-comment a a,
.category-ranking__wrap .product-comment a + a,
.category-ranking__wrap .product-comment div,
.category-ranking__wrap .product-comment ul,
.category-ranking__wrap .product-comment img{
    display: none;
}
@media screen and (min-width: 1023px){
    .category-ranking__wrap{
        padding: 15px;
    }
    .category-ranking__wrap .product-list__inr{
        flex-wrap: nowrap;
        overflow: hidden;
    }
    .category-ranking__wrap .product-list__ranking{
        min-width: calc((100% - 20px) / 5);
        width: 100%;
        max-width: 400px;
    }
}

/* 説明用ボタン＋モーダルウインドウ内レイアウト */
.question{
    display: inline-block;
    cursor: pointer;
}
.question:before{
    display: flex;
    align-items: center;
    justify-content: center;
    content: '?';
    height: 18px;
    width: 18px;
    font-weight: bold;
    font-size: 1.4rem;
    line-height: 1;
    border-radius: 50%;
    background-color: #00cccc;
    color: #fff;
    transition: all 0.3s;
}
.question:hover:before{
    background-color: #ff8d25;
}
.modal-title{
    display: flex;
    gap: 10px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 15px;
    padding-bottom: 5px;
    align-items: center;
    color: #00cccc;
    font-size: 1.8rem;
}
.modal-title img{
    vertical-align: bottom;
}

/* 注文フロー修正 */
.flow-order__list {
    align-items: normal;
}
@media (min-width: 1024px){
    .flow-order {
        position: relative;
        margin: 15px 0 20px;
    }
}
@media (max-width: 1023px){
    .flow-order__item {
        height: auto;
        padding: 10px 5px;
        line-height: 1.2;
        text-align: center;
    }
}

/* 商品仕様選択エリア改修 */
.buttons_col-3 .block-detail__button {
    width: calc((100% - 20px) / 3);
}
.buttons_col-3 .button-icon .icon {
    font-size: 2.8rem;
}
.buttons_col-3 .button-icon {
    flex-wrap: nowrap;
    width: 100%;
    height: 100%;
    padding: 10px 0;
}
.buttons_col-3 .button-icon__text {
    margin-top: 5px;
    text-align: center;
    line-height: 1.2;
    font-size: 1.2rem;
}
.block-detail__contact .primary-button {
    justify-content: start;
    box-sizing: border-box;
    padding-left: 2.5vw;
    font-size: 1.6rem;
}
@media (max-width: 1023px){
    .buttons_col-3 .button-icon__text {
        font-size: 1.1rem;
    }
    .block-detail__contact .primary-button {
        padding-left: 4.5vw;
        font-size: 1.4rem;
    }
}

/* 商品詳細ページ_商品画像改修 */
.block-detail__contents {
    background: none;
    padding: 0;
}
.block-detail__contents form{
    background-color: #f3f3f3;
    padding: 30px 15px;
}
@media (min-width: 1024px) {
    .block-detail__images {
        width: 470px;
    }
    .block-detail__contents {
        width: calc(100% - 490px);
        padding: 35px 25px;
    }
    .block-detail__main {
        height: 472px;
    }
    .block-detail__main__item img {
        height: 470px;
    }
    .block-detail__thumb__item {
        height: 86px;
    }
    .block-detail__contents {
        background: none;
        margin-top: -100px;
        padding: 100px 0 0 0;
        font-size: 1.3rem;
    }
    .block-detail__contents form{
        padding: 35px 25px;
    }
    .form-control {
        font-size: 1.3rem;
    }
    .block-detail__box {
        padding: 15px;
    }
}

/* 商品一覧_サイズ改修 */
.block-productlist__wrap .block-items__item__img img,
.new-item-block .block-items__item__img img{
    border:1px solid #ddd;
}
.block-productlist__wrap .block-items__item__name,
.new-item-block .block-items__item__name {
    font-size: 1.5rem;
    line-height: 1.5;
    text-decoration: none;
}
.block-productlist__wrap .block-items__item__price--unit,
.new-item-block .block-items__item__price--unit {
    font-size: 1.6rem;
}
@media (min-width: 600px) {
    .block-productlist__item {
        width: calc((100% - 45px) / 4);
    }
    .block-productlist__item:not(:nth-child(5n+1)) {
        margin-left: 0;
    }
    .block-productlist__item:not(:nth-child(4n+1)) {
        margin-left: 15px;
    }
    .block-productlist__item:nth-child(n+5) {
        margin-top: 30px;
    }
}

/* マイページ_注文状況修正 */
@media (max-width: 1023px) {
    .block-history__heading__number {
        position: static;
        justify-content: flex-start;
    }
}

/* ヘッダー全改修_20250127 */
.main-header__body2{
    display: block;
    border-bottom: 1px solid #ccc;
}
.main-header__inner{
    display: flex;
    justify-content: space-between;
    gap: 1vw;
    padding: 10px 0 5px;
    align-items: flex-start;
    position: relative;
    width: 1200px;
    max-width: 100%;
    margin: auto;
    background-color: #fff;
    z-index: 2;
    transform: translateZ(0);
}
.main-header__inner .header-logo{
    width: 16vw;
    max-width: 250px;
    min-width: 150px;
}
.main-header__inner .header-logo a{
    display: block;
}
.main-header__inner .header-logo img{
    width: 100%;
    vertical-align: bottom;
}
.header-search{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    width: calc(100% - 700px);
}
.header-search_form{
    display: flex;
    align-items: center;
    width: 100%;
}
.header-search .search___detail{
    position: relative;
    width: 95px;
    padding: 10px 30px 10px 10px;
    line-height: 1;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 1px solid #aaa;
    border-right: none;
    background: #eee;
    color: #222;
    vertical-align: middle;
    word-break: keep-all;
    font-size: 1.2rem;
    font-weight: bold;
}
.header-search .search___detail:after{
    content: '';
    position: absolute;
    transform: translateY(-25%) rotate(45deg);
    width: 6px;
    height: 6px;
    top: 40%;
    right: 10px;
    margin-left: 10px;
    border-bottom: 2px solid #222;
    border-right: 2px solid #222;
    transition: transform .5s;
}
.header-search .search__form{
    padding: 10px 30px 10px 10px;
    width: -webkit-fill-available;
    border: 1px solid #888;
    font-size: 1.2rem;
}
.header-search .search__button {
    width: 30px;
    height: 30px;
    background: url(/html/user_data/assets/img/common/ico_search_g.svg) no-repeat 50% 50%;
    border: none;
    border-radius: 0 5px 5px 0;
    margin-left: -20px;
    top: 3px;
    right: 13px;
    position: relative;
}
.header-search .category-btn{
    display: flex;
    align-items: center;
    gap: 10px;
    width: 120px;
    position: relative;
    padding: 10px;
    border: 1px solid #00cccc;
    color: #00cccc;
    line-height: 1;
    font-size: 1.4rem;
    font-weight: bold;
    cursor: pointer;
}
.header-search .category-btn:hover{
    opacity: 0.7;
}
.header-search .category-btn:before{
    content: "";
    top: 9px;
    left: 15px;
    width: 14px;
    height: 14px;
    background: url(/html/user_data/assets/img/common/ico_grid.svg) no-repeat 0 0 / contain;
}
.header-search .category-btn:after{
    transform: translateY(-25%) rotate(45deg);
    width: 6px;
    height: 6px;
    border-bottom: 2px solid #00cccc;
    border-right: 2px solid #00cccc;
    content: '';
    transition: transform .5s;
}
.header-search .search__keywords{
    width: 100%;
    margin: 0;
}
.header-search_form .form{ 
    display: flex;
    width: -webkit-fill-available;
}
.header-search_category{
    display: none;
    position: relative;
}
.header-menu{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.header-menu_user{
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex-shrink: 0;
}
.header-menu_nav{
    display: flex;
}
.header-menu_nav li{
    width: calc(100% / 5);
    border-right: 1px solid #666666;
}
.header-menu_nav li:last-child{
    border:none;
}
.fixed .header-menu_nav li{
    border: none;
}
.header-menu_nav li img {
    width: 30px;
    height: 30px;
}
.header-menu_nav li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    position: relative;
    width: 65px;
    color: #222;
    gap: 5px;
}
.header-menu_nav li a:hover {
    opacity: 0.7;
}
.header-menu_nav li span {
    font-size: 1.05rem;
}
.header-menu_nav li .header-nav__badge{
    font-size: 1rem;
}
.header-nav__badge {
    background: #00cccc;
}
.header-menu_flow{
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 7px;
}
.header-menu_flow li{
    display: flex;
    flex-direction: column;
}
.header-menu_flow a{
    display: flex;
    align-items: center;
    gap: 5px;
    color: #222;
    border: 1px solid #aaa;
    padding: 5px;
    border-radius: 3px;
}
.header-menu_flow span{
    font-size:1.05rem;
}
.main-header__inner .user-info__name {
    margin: auto;
    font-size: 1.1rem;
    max-width: 100%;
}
.main-header__inner .user-info__benefit a{
    display: flex;
    align-items: center;
    position: relative;
    text-decoration: none;
    padding: 8px 15px;
    color: #fff;
    background: #00cccc;
    font-weight: bold;
}
.main-header__inner .user-info__benefit a:hover{
    opacity: 0.7;
}
.main-header__inner .user-info__benefit a:before{
    margin-right: 4px;
    content: "";
    width: 16px;
    height: 16px;
    background: no-repeat 0 0/contain;
    background-image: url(/html/user_data/assets/img/common/ico_register.svg);
}
.main-header__body2.fixed {
    position: fixed;
    z-index: 102;
    width: 100%;
    height: 86px;
    top: 0;
    left: 0;
    background: #fff;
    animation: slideDown 0.3s; /* アニメーションを適用 */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}
.main-header__body2.fixed .header-logo {
    width: 175px;
    max-width: 100%;
    min-width: auto;
}
.main-header__body2.fixed .js-header.-before{
    display: none;
}
.main-header__body2.fixed .js-header.-after{
    display: block;
}
.main-header__body2.fixed .header-search {

    width: calc(100% - 570px);
}
.main-header__body2.fixed .search__keywords,
.main-header__body2.fixed .user-info__text,
.main-header__body2.fixed .header-menu_nav li span {
    display: none;
}
.main-header__body2.fixed .header-menu_nav li a {
    width: auto;
}
.main-header__body2.fixed .header-menu_flow {
    gap: 5px;
}
.main-header__body2.fixed .header-menu_flow a{
    border: none;
    padding: 0;
}
.main-header__inner.header-sp{
    display: none;
}
.main-header__body2.fixed .header-menu_nav {
    gap: 9px;
}
.main-header__body2.fixed .header-menu_nav li img{
    width: 33px;
    height: 33px;
}
@media screen and (max-width: 1023px) {
    .header-search{
        display: none;
    }
    .main-header__inner {
        height: auto;
        padding:10px 10px 5px;
    }
    .main-header__inner.header-sp{
        display: block;
        margin-top: 10px;
        padding:15px;
        border-top: 2px solid #00cccc;
    }
    .main-header__inner.header-sp .header-search {
        display: flex;
        width: 100%;
    }
    .header-search_category{
        display: block;
    }
    .main-header__body2{
        height: auto;
    }
    .main-header__inner.header-pc{
        padding-bottom:30px;
    }
    .header-menu_nav li span,
    .main-header__inner .user-info__name {
        display: none;
    }
    .header-menu_nav li a {
        width: 50px;
    }
    .main-header__inner .header-menu_flow {
        gap: 5px;
    }
    .main-header__inner .header-menu_flow a{
        border: none;
        padding: 0;
    }
    .main-header__inner .header-logo {
        width: 150px;
        max-width: 100%;
        min-width: auto;
    }
    .main-header__inner .js-header.-before{
        display: none;
    }
    .main-header__inner .js-header.-after{
        display: block;
    }
    .main-header__body2.fixed .main-header__inner.header-sp {
        margin-top: 0;
        border-top: none;
    }
    .main-header__body2 .user-info__coupon {
        left: 0;
        right:0;
    }
    .main-header__body2.unlogged .main-header__inner.header-pc{
        padding-bottom: 5px;
    }
    .header-search_form {
        width: calc(100% - 140px);
    }
    .main-header__body2.fixed .header-pc{
        display: none;
    }
    .main-header__body2.fixed {
        height: 101px;
    }
}
@media screen and (max-width: 767px) {
    .main-header__body2.fixed {
        height: auto;
    }
    .header-menu_nav,
    .header-menu_flow {
        display: none;
    }
    .main-header__inner.header-sp .header-search {
        gap:10px;
    }
    .header-search .search__form {
        font-size: 1.1rem;
    }
    .header-search .search___detail {
        width: 90px;
        font-size: 1.05rem;
        padding: 5px 15px 5px 6px;
    }
    .header-search .search___detail:after {
        width: 4px;
        height: 4px;
        right: 5px;
        border-width: 1px;
    }
    .header-search_form {
        width: calc(100% - 90px);
    }
    .header-search .category-btn {
        width: 80px;
        padding: 10px 5px;
        font-size: 1.1rem;
        line-height: 1.2;
    }
    .header-search .category-btn:before {
        width: 13px;
        height: 13px;
    }
    .header-search .category-btn:after {
        content: none;
    }
}

/* カテゴリ一覧アコーディオン */
.header-search_category .acc_wrap {
    display: none;
}
.header-search_category .acc_wrap.active {
    display: block;
    position: absolute;
    top:45px;
    right: -385px;
    width: 900px;
    background: #e5e5e5;
    padding: 20px;
    z-index: 2;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
}
.header-search_category .acc_wrap ul{
    display: flex;
    flex-wrap: wrap;
    gap: 1px;
}
.header-search_category .acc_wrap li{
    width: calc((100% - 2px) / 3);
}
.header-search_category .acc_wrap a{
    display: flex;
    align-items: center;
    gap: 5px;
    position: relative;
    padding: 8px 20px 8px 7px;
    background: #fff;
    height: 100%;
    box-sizing: border-box;
}
.header-search_category .acc_wrap a span{
    color: #222;
    font-size: 1.2rem;
    font-weight: bold;
}
.header-search_category .acc_wrap a:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 7px;
    width: 5px;
    height: 5px;
    transform: rotate(-45deg) translate(0, -50%);
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: #bbb;
}
.header-search_category .acc_wrap a:hover{
    background: #f5f5f5;
}
.header-search_category .acc_wrap a:hover span{
    color:#00cccc;
}
.header-search_category .acc_wrap a:hover:after{
    border-color: #00cccc;
}
@media screen and (max-width: 1347px) {
    .header-search_category .acc_wrap.active {
        right: 0;
        width: 94vw;
    }
}
@media screen and (max-width: 767px) {
    .header-search_category .acc_wrap.active {
        position: fixed;
        width: auto;
        height: calc(100vh - 183px);
        overflow-y: scroll;
        top: 58px;
        right: 0;
        padding: 15px 15px 75px;
        box-shadow: none;
    }
    .header-search_category .acc_wrap li{
        width: calc((100% - 1px) / 2);
    }
    .header-search_category .acc_wrap a{
        padding: 6px 20px 6px 7px;
    }
    .header-search_category .acc_wrap a span{
        font-size:1rem;
    }
    .main-header__body2.fixed .header-search_category .acc_wrap.active {
        height: calc(100vh - 127px);
        top: 67px;
    }
}

/* グロナビ */
.header-gnav__inner{
    display: flex;
    justify-content: space-between;
    width: 1200px;
    max-width: 100%;
    margin: auto;
}
.gnav_left{
    display: flex;
    align-items: baseline;
}
.gnav_left > li {
    position: relative;
}
.gnav_left > li:hover .nav-acc_wrap {
    display: block;
}
.gnav_left > li > a,
.gnav_left > li > span{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    padding: 15px;
    color: #222;
    box-sizing: border-box;
    text-align: center;
    line-height: 1;
    font-size: 1.3rem;
    font-weight: bold;
    transition: all 0.2s;
    cursor: pointer;
}
.gnav_left > li > span{
    color: #fb781f;
    font-size:1.8rem
}
.gnav_left > li > a:before,
.gnav_left > li > span:before{
    position: absolute;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #00cccc;
    bottom: -1px; 
    transform: scale(0, 1);     
    transform-origin: left top; 
    transition: transform 0.3s; 
}
.gnav_left > li > a:after,
.gnav_left > li > span:after{
    content: "";
    height: calc(8.66025px);
    width: 15px;
    clip-path: polygon(0px 0px, 100% 0px, 50% 100%);
    margin-left: 5px;
    background: rgb(0, 204, 204);
}
.gnav_left > li > a:hover,
.gnav_left > li > span:hover{
    background: #f5f5f5;
    color:#00cccc;
}
.gnav_left > li > a:hover:before,
.gnav_left > li > span:hover:before{
    transform: scale(1, 1);   
}
.gnav_left > li > a:hover:after,
.gnav_left > li > span:hover:after{
    border-color: #00cccc;
}
.gnav_left > li img,
.gnav_left > li img{
    width: 25px;
    height:25px;
    object-fit:contain;
}
.gnav_right{
    display: flex;
    align-items: center;
    gap:10px;
}
.gnav_right .tel{
    display: flex;
    align-items: center;
    gap: 10px;
}
.gnav_right .tel a{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    padding-left: 35px;
    color: #00cccc;
    font-size: 2.2rem;
    font-weight: bold;
}
.gnav_right .tel a:before{
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 6px;
    left: 10px;
    background: no-repeat 0 0 / contain;
    background-image: url(/html/user_data/assets/img/common/ico_lg_tel.svg);
}
.gnav_right .tel span{
    line-height: 1.2;
    font-size: 1.1rem;
}
.gnav_right .mail a{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: auto;
    height: 32px;
    margin-bottom: 3px;
    padding: 10px 30px 10px 40px;
    box-sizing: border-box;
    background: #666666;
    color: #fff;
    line-height: 1;
    font-size: 1.3rem;
    font-weight: bold;
    transition: all 0.2s ease;
}
.gnav_right .mail a:hover{
    opacity: 0.7;
}
.gnav_right .mail a:before{
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    top: 8px;
    left: 10px;
    background: no-repeat 0 0 / contain;
    background-image: url(/html/template/default/assets/img/ico_mail_w.svg);
}
.gnav_right .mail a:after{
    content: "";
    position: absolute;
    top: 46%;
    right: 7px;
    width: 5px;
    height: 5px;
    transform: rotate(-45deg) translate(0, -50%);
    border-bottom: 2px solid;
    border-right: 2px solid;
    border-color: #fff;
}
.nav-acc_wrap {
    display: none;
    position: absolute;
    background-color: #f5f5f5;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.3);
    top: 44px;
    z-index: 11;
    width: 100%;
    padding: 10px 0;
    border-radius: 0 5px 5px 5px;
    opacity: 0; /* 初期状態で非表示 */
    transition: opacity 0.3s ease; /* フェードインするアニメーション */
}
.gnav_left > li:hover .nav-acc_wrap {
    display: block;
    width: max-content;
    opacity: 1; /* ホバー時に表示 */
}
.nav-acc_wrap > ul {
    display: flex;
    flex-direction: column;
}
.nav-acc_wrap > ul > li a,
.nav-acc_wrap > ul > li span{
    display: flex;
    align-items: center;
    gap:10px;
    padding: 11px 18px;
    color: #222;
    line-height: 1;
    font-size: 1.3rem;
    font-weight: bold;
    transition: all 0.2s;
}
.nav-acc_wrap > ul > li a:hover{
    color:#00cccc;
}
.category-list,
.category-link {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 0;
}
.category-link > div {
    display: none;
}
.category-link > .active {
    display: block;
}
.gnav_left > li:hover .acc_catgory{
    width: 1100px;
    max-width: 94vw;
    height: auto;
    padding:20px;
}
.acc_catgory ul{
    flex-direction: row;
    flex-wrap:wrap;
        gap: 7px 10px;
}
.acc_catgory li{
    width: calc((100% - 30px) / 4);
}
.nav-acc_wrap.acc_catgory li span{
    padding:0;
    font-size:1.2rem;
}
.nav-acc_wrap.acc_catgory li a{
    position: relative;
    height: 100%;
    box-sizing: border-box;
    padding: 12px 15px 12px 10px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.nav-acc_wrap.acc_catgory li a:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 5px;
    width: 5px;
    height: 5px;
    transform: rotate(-45deg) translate(0, -50%);
    border-bottom: 2px solid #bbb;
    border-right: 2px solid #bbb;
}
.nav-acc_wrap.acc_catgory li a:hover span{
    color:#00cccc;
}
.nav-acc_wrap.acc_catgory li a:hover:after{
    border-color:#00cccc;
}
.main-header__body2.fixed .header-gnav__wrap{
    padding-bottom: 2px;
}
.main-header__body2.fixed .gnav_left > li > a,
.main-header__body2.fixed .gnav_left > li > span {
    padding: 10px;
    font-size: 1.2rem;
}
.main-header__body2.fixed .gnav_left > li > span {
    font-size: 1.6rem;
}
.main-header__body2.fixed .gnav_right .tel a{
    font-size: 1.9rem;
}
.main-header__body2.fixed .gnav_right .tel a:before{
    width: 17px;
    height: 17px;
    top: 6px;
}
.main-header__body2.fixed .gnav_right .tel span {
    font-size: 1.05rem;
}
.main-header__body2.fixed .gnav_right .mail a{
    height: 25px;
    padding: 10px 20px 10px 35px;
    font-size: 1.2rem;
}
.main-header__body2.fixed .gnav_right .mail a:before{
    width: 17px;
    height: 17px;
    top: 7px;
}
.main-header__body2.fixed .nav-acc_wrap {
    top: 33px;
}
@media screen and (max-width: 1347px){
    .header-gnav__wrap {
        padding: 0 10px;
    }
    .gnav_left > li > a, .gnav_left > li > span {
        padding: 15px 7px;
        font-size: 1.3rem;
    }
    .gnav_right .tel a {
        font-size: 1.8rem;
    }
    .gnav_right .tel a:before {
        width: 20px;
        height: 20px;
        top: 2px;
        left: 10px;
    }
    .gnav_right .tel span {
        font-size: 1rem;
    }
    .gnav_right .mail a {
        height: 30px;
        padding: 10px 20px 10px 35px;
        font-size: 1.3rem;
    }
    .gnav_right .mail a:before {
        width: 18px;
        height: 18px;
        top: 9px;
        left: 7px;
    }
}
@media screen and (max-width: 1023px){
    .gnav_right{
        display:none;
    }
}
@media screen and (max-width: 767px){
    .header-gnav__wrap{
        display:none;
    }
}

/* 検索バー・詳細検索改修 */
.search-detail__taglist {
    gap: 5px 10px;
}
.search-detail__tagitem {
    margin: 0;
    padding:0;
}
.search-tag {
    display: block;
    padding: 7px 9px;
    line-height: 1;
    color: #00b1b1;
}
input[type=checkbox]:checked + .search-tag {
    background: #00b1b1;
    border: 1px solid #00b1b1;
}
.search-tag:hover{
    background-color: #eee;
}
@media screen and (min-width: 600px){
    .search-detail__form {
        max-width: 1000px;
    }
}
/* よく検索されるワード */
.search__keywords{
    display: flex;
    flex-direction: column;
    gap:5px;
}
.search__keywords_title{
    color: #555;
    line-height: 1;
    font-size: 1.05rem;
    font-weight: bold;
}
.search__keywords_scroll{
    overflow-x: scroll;
}
.search__keywords_list{
    display: flex;
    gap: 5px;
    width: max-content;
}
.search__keywords_list a{
    display: block;
    padding: 5px 10px 5px 20px;
    border-radius: 50px;
    color: #fff;
    line-height: 1;
    font-size: 1.05rem;
    transition: all 0.2s;
    position: relative;
    background: #666666;
}
.search__keywords_list a:before {
    position: absolute;
    top: 5px;
    left: 6px;
    width: 0.7em;
    height: 0.7em;
    box-sizing: border-box;
    border: 0.15em solid #fff;
    border-radius: 50%;
    background-color: #666666;
    content: '';
    z-index: 1;
    color: #ffffff;
}
.search__keywords_list a:after {
    position: absolute;
    top: 5px;
    left: 11px;
    transform: rotate(-45deg);
    width: 0.15em;
    height: 1em;
    box-sizing: border-box;
    background-color: #ffffff;
    content: '';
}
.search__keywords_list a:hover{
    opacity: 0.7;
}
.body-fixed .search__keywords{
    display: none;
} 
.search-sp + .search__keywords{
    margin: 0 0 15px;  
    padding:0 15px;
}
.wrap-left .search__copy{
    line-height: 1;
    font-size: 1.3rem;
    font-weight: bold;
    margin-right: 20px;
    flex-shrink: 1;
    word-break: keep-all;
}
.wrap-left .search__copy span{
    color: #9d0000;
    background: #fff;
    padding: 0 5px;
    margin-right: 5px;
    font-size: 1.4rem;
    font-weight: bold;
}
.main-header__sub__text {
    line-height: 1.3;
    font-size: 1.1rem;
}
.main-header .search-sp__detail {
    margin: 0 10px 0 0;
}
@media screen and (min-width: 500px){
    .search__keywords{
        flex-direction: row;
        align-items: center;
        gap:8px;
        margin-top: 10px;
    }
    .search__keywords_scroll{
        overflow-x: hidden;
    }
}
@media screen and (min-width: 1024px){
    .search__keywords{
        gap:15px;
    }
    .header-full.body-fixed .search__form {
        width: calc(100vw - 650px);
    }
    .main-header__body .body-fixed .search__detail {
        border-radius: 5px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        height: auto;
        padding-top: 5px;
        padding-right: 10px;
        padding-bottom: 5px;
        padding-left: 10px;
        margin-left: 5px;
        font-size: 1.2rem;
        font-weight: bold;
        text-decoration: none;
        transition: all 0.2s ease;
        border: 1px solid #aaa;
        background: #eee;
        color: #222;
        vertical-align: middle;
        width: 80px;
        word-break: keep-all;
    }
}
@media screen and (min-width: 1348px){
    .main-header__body .search___detail {
        border-radius: 5px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        height: auto;
        padding-top: 5px;
        padding-right: 10px;
        padding-bottom: 5px;
        padding-left: 10px;
        margin-left: 5px;
        font-size: 1.2rem;
        font-weight: bold;
        text-decoration: none;
        transition: all 0.2s ease;
        border: 1px solid #aaa;
        background: #eee;
        color: #222;
        vertical-align: middle;
        word-break: keep-all;
    }
    .search-detail.header_fixed{
        height: calc(100vh - 55px);
    }
    .header_fixed .search-detail__form {
        height: calc(100vh - 170px);
    }
    .header_fixed .search-detail__close {
        top: 75px;
    }
    .main-header__body .search__form {
        width: calc(100vw - 1130px);
    }
    .main-header__body .search__form {
        padding-top: 11px;
        padding-bottom: 11px;
        border-radius: 0;
    }
    .main-header__body .search__button {
        width: 55px;
        height: 38px;
        background-size: 25px;
    }
    .main-header__body .search___detail {
        position: relative;
        height: 38px;
        margin: 0;
        padding: 8px 30px 8px 15px;
        border-radius: 5px 0 0 5px;
        line-height: 1;
        font-size: 1.3rem;
    }
    .main-header__body .search___detail:after {
        position: absolute;
        transform: translateY(-25%) rotate(45deg);
        width: 6px;
        height: 6px;
        top: 40%;
        right: 10px;
        margin-left: 10px;
        border-bottom: 2px solid #222;
        border-right: 2px solid #222;
        content: '';
        transition: transform .5s;
    }
    .main-header__body .body-fixed .search___detail {
        width: auto;
        height: 32px;
        padding: 5px 30px 5px 10px;
        border-radius: 5px 0 0 5px;
    }
    .main-header__body .body-fixed .search__form {
        border-radius: 0;
        border-left: none;
    }
    .search__keywords{
        gap:8px;
    }
    .search-sp + .search__keywords{
        display: none;  
    }
    .search___detail:hover{
        opacity: 0.7;
    }
}

/* 商品ランキングTOP5(タブ付き) */
.ranking-tabs{
    display: flex;
    padding: 0px 5px;
    gap: 3px;
    height: 40px;
}
.tab-button{
    width: calc(100% / 5);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    margin-top: auto;
    padding: 5px;
    background: #555;
    color: #fff;
    border-radius: 5px 5px 0 0;
    line-height: 1.2;
    font-size: 1.2rem;
    font-weight: bold;
}
.tab-button:hover,
.tab-button.active{
    background: #00cccc;
    color: #fff;
    height: 40px;
    opacity: 1;
}
.tab-panel{
    display: none;
}
.ranking-content h2{
    display: flex;
    justify-content: center;
    padding-bottom: 10px;
    font-size: 1.5rem;
}
.ranking-content h2:before{
    content:'';
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 0 5px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position-y: bottom;
    background-image: url(/html/user_data/assets/img/common/icon_crown.svg);
}
.ranking-content{
    padding: 15px 10px;
    border: 2px solid #ccc;
    background: #fff;
}
.ranking-list_inr{
    overflow-x: scroll;
}
.ranking-list_inr ul{
    display: flex;
    width: max-content;
    background: #fff;
}
.ranking-list_inr li{
    width:120px;
    border-right: 1px solid #ddd;
}
.ranking-list_inr li:last-child{
    border-right: none;
}
.ranking-list_inr .product-image {
    position: relative;
    margin-bottom: 5px;
}
.ranking-list_inr img{
    vertical-align: bottom;
}
.ranking-list_inr a{
    display:flex;
    padding: 0 10px;
    flex-direction: column;
    transition: all 0.2s;
}
.ranking-list_inr a:hover{
    opacity: 0.7;
}
.ranking-list_inr h3{
    height: 2.8em;
    line-height: 1.4;
    margin-bottom: 5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #222;
    font-size: 1.3rem;
}
.ranking-list_inr .ranking_num{
    position: initial;
    background: none;
    margin-bottom: 5px;
    padding: 0;
    display: block;
    width: auto;
    height: auto;
    text-align: center;
    color:#555;
    line-height: 1.2;
    background-image: url(/html/user_data/assets/img/common/icon_rank-back.webp);
    background-repeat: no-repeat;
    background-size: 50px;
    background-position-x: center;
    background-position-y: 2px;
    font-size: 1.3rem;
}
.ranking-list_inr li .ranking_num:before{
    font-size: 2rem;
    font-weight: bold;
}
.ranking-list_inr li:nth-of-type(1) .ranking_num:before{
    content: "1";
}
.ranking-list_inr li:nth-of-type(2) .ranking_num:before{
    content: "2";
}
.ranking-list_inr li:nth-of-type(3) .ranking_num:before{
    content: "3";
}
.ranking-list_inr li:nth-of-type(4) .ranking_num:before{
    content: "4";
}
.ranking-list_inr li:nth-of-type(5) .ranking_num:before{
    content: "5";
}
.ranking-list_inr li:nth-of-type(1) .ranking_num{
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_gold.webp);
    color: #dbb20b;
}
.ranking-list_inr li:nth-of-type(2) .ranking_num{
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_silver.webp);
    color: #4d7099;
}
.ranking-list_inr li:nth-of-type(3) .ranking_num{
    background-image: url(/html/user_data/assets/img/common/icon_rank-back_bronze.webp);
    color: #cc5229;
}
.ranking-list_inr .product-list__lot {
    font-size: 1rem;
}
.ranking-list_inr .product-list__desc{
    font-size: 1rem;
}
@media screen and (min-width: 768px){
    .ranking-tabs{
        gap: 5px;
    }
    .tab-button{
        height: 35px;
        font-size: 1.4rem;
    }
    .ranking-content h2{
        font-size: 2rem;
    }
    .ranking-content h2 br{
        display: none;
    }
    .ranking-list_inr{
        overflow-x: auto;
    }
    .ranking-list_inr ul{
        width: 100%;
    }
    .ranking-list_inr li{
        width: calc(100% / 5);
    }
    .ranking-list_inr .product-list__lot {
        font-size: 1.1rem;
    }
    .ranking-list_inr .product-list__desc{
        font-size: 1.1rem;
    }
}

/* サブバナーリスト */
.sub-banner-list__wrap{
    overflow-x: scroll;
}
.sub-banner-list__wrap ul{
    display: flex;
    gap: 15px;
    width: max-content;
    padding-bottom: 30px;
    border-bottom: 1px solid #ccc;
}
.sub-banner-list__wrap li{
    width: 125px;
}
.sub-banner-list__wrap a{
    display: block;
    transition: all 0.2s;
}
.sub-banner-list__wrap img{
    border: 1px solid #ddd;
    vertical-align: bottom;
}
.sub-banner-list__wrap a:hover{
    opacity: 0.7;
}
@media screen and (min-width: 768px){
    .sub-banner-list__wrap{
        overflow-x: unset;
    }
    .sub-banner-list__wrap ul{
        width: 100%;
        gap: 15px;
    }
    .sub-banner-list__wrap li{
        width: calc(100% / 5);
    }
}

/* 注目ノベルティ */
.product-list_featured{
    overflow-x: scroll;
}
@media screen and (min-width: 1024px){
    .product-list_featured{
        overflow-x: unset;
    }
    .product-list__item {
        width: 232px;
        max-width: calc((100% - 80px) / 5);
    }
}

/* 縦書きタイトルコンテンツ */
.vertical_content{
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 50px 0;
    border-bottom: 1px solid #ccc;
}
.vertical_content:last-child{
    border-bottom: none;
}
.vertical_title{
    position: relative;
    font-size: 1.7rem;
    padding:  0 0 0 30px;
}
.vertical_title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 45%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border: 5px solid #00cccc;
    border-radius: 50%;
    background-color: transparent;
}
.bg_gr .vertical_title::before{
    border-color:#ff7200;
}
.vertical_content .block-items__item__img{
    border: 1px solid #ddd;
}
@media (min-width: 768px){
    .vertical_content{
        flex-direction: row;
    }
    .vertical_title{
        position: relative;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        font-size: 1.7rem;
        letter-spacing: 3px;
        padding: 30px 0 0 0;
    }
    .vertical_title::before {
        left: 15%;
        top: 10px;
    }
    .vertical_content .product-list__inr{
        gap:20px;
    }
    .vertical_content .product-list__item{
        margin:0;
        width: 280px;
        max-width: calc((100% - 60px) / 4);
    }
}

/* TOP_カテゴリ・特集バナーリスト */
.category-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap:10px;
    padding-bottom: 20px;
}
.category-list__item{
    width: calc((100% - 10px) / 2);
}
.category-list__item a{
    display: block;
}
.category-list__item img{
    width:100%;
    vertical-align: bottom;
}
.category-list__item:hover{
    opacity: 0.7;
}
@media (min-width: 768px){
    .category-list__item {
        width: calc((100% - 20px) / 3);
    }
}

/* TOP_メッセージ */
.top_message_wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.top_message{
    margin: auto;
}
.top_message h3{
    margin-bottom: 20px;
    font-size:2rem;
}
.top_message .comment{
    font-size:1.6rem;
}
@media (min-width: 768px){
    .top_message_wrap{
        flex-direction: row;
    } 
}

/* TOP_おすすめカテゴリ・シーン */
.category-list__wrap{
    display: flex;
    flex-wrap: wrap;
}
.category-list__box{
    width: calc(100% / 2);
    background: #fff;
    outline: 1px solid #ccc;
}
.category-list__box a{
    display: flex;
    flex-direction: column;
    gap:5px;
    box-sizing: border-box;
    height: 100%;
    padding:6px;
    color: #222;
}
.category-list__box a:hover{
    opacity: 0.7;
}
.category-list__box img{
    width: 100%;
    object-fit: cover;
    vertical-align: bottom;
}
.category-list__text{
    display: flex;
    flex-direction: column;
    gap:3px;
}
.category-list__title{
    position: relative;
    line-height: 1.3;
    font-weight: bold;
    font-size:1.45rem;
}
.category-list__caption{
    word-break: break-all;
    line-height: 1.5;
    margin-bottom:5px;
}
.category-list__caption br{
    display: none;
}
.category-list__arrow{
    display: none;
    text-align: right;
    position: relative;
    color: #fff;
    font-size: 1.05rem;
    line-height: 1.2;
    margin-top: auto;
    padding-right:1.5rem;
}
.category-list__arrow:after{
    content: "";
    position: absolute;
    top: 30%;
    right: 0;
    width: 6px;
    height: 6px;
    transform: rotate(-45deg) translate(0, -50%);
    border-bottom: solid;
    border-right: solid;
    border-width: 2px;
    color: #9d0000;
}
@media screen and (min-width:501px) {
    .category-list__box{
        width: calc(100% / 3);
    }
    .category-list__title:after{
        content: "";
        display: inline-block;
        vertical-align: middle;
        color: #00cccc;
        line-height: 1;
        width: 9px;
        height: 9px;
        margin: -4px 0 0 8px;
        border: 2px solid currentColor;
        border-left: 0;
        border-bottom: 0;
        box-sizing: border-box;
        transform: translateX(-25%) rotate(45deg);
    }
}
@media screen and (min-width:768px) {
    .category-list__box{
        width: calc(100% / 2);
    }
    .category-list__box a{
        flex-direction: row-reverse;
        align-items: center;
        gap:5px;
        padding:10px;
    }
    .category-list__box img{
        height: fit-content;
        width: 36%;
    }
    .category-list__text{
        width: 64%;
    }
    .category-list__caption{
        font-size: 1.2rem;
    }
    .category-list__title{
        font-size: 1.8rem;
    }
    .category-list__caption br{
        display: block;
    }
}
@media screen and (min-width: 1200px){
    .category-list__wrap{

    }
    .category-list__box{
        width: calc(100% / 3);
    }
}

/* 学販だけ消す */
.scpr_hidden{
    display: none;
}

/* TOP_h1帯 */
.top-band{
    padding: 4px 30px;
    background: #00cccc;
    background-repeat: no-repeat;
    background-size: 100% 100%, 100%;
    background-position: center;
    color: #fff;
    font-size: 1.4rem;
    text-align: center;
    line-height: 1.5;
    overflow: hidden;
}
@media screen and (min-width: 1024px){
    .top-band{
        font-size: 1.6rem;
    }
}
@media screen and (max-width: 500px){
    .top-band h1{
      display     : inline-block;
      padding-left: 100%;
      white-space : nowrap;
      line-height : 1em;
      animation   : scrollAnime 10s linear infinite;
    }
    @keyframes scrollAnime{
        0% { transform: translateX(0)}
      100% { transform: translateX(-100%)}
    }
}

/* コンテンツパーツの配置変更 */
@media screen and (min-width: 1024px) {
    .content--right {
        display: block;
    }
    .content {
        flex-direction: row-reverse;
    }
}
@media screen and (min-width: 1348px) {
    .content--right {
        width: 240px;
    }
}

/* バナー_ボトム固定 */
.fixed-banner__bottom{
    margin: auto;
    width: fit-content;
    position: fixed;
    bottom: 70px;
    left: 10px;
    right: 10px;
    z-index: 1;
    box-shadow: 0 0 3px rgba(0,0,0,0.5);
}

.fixed-banner__bottom img{
    vertical-align: bottom;
}

.fixed-banner__bottom a{
    transition: all 0.2s;
}

.fixed-banner__bottom a:hover{
    opacity: 0.7;
}

.fixed-banner__bottom .close-btn {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 24px;
    height: 24px;
    background: #ffffff;
    border-radius: 50px;
    color: #222;
    font-size: 15px;
    cursor: pointer;
    z-index: 2;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}

@media screen and (min-width: 1023px) {
    .fixed-banner__bottom{
        bottom: 15px;
        left:calc(240px + 10px);
    }
}

/* ==========================================================================
  Category Menu CSS (Header / Side / Footer / Mobile)
  - 統合版（安定版1本）
  - side吹き出し三角：content:"" !important で強制生成（他CSSに負けない）
  - SP外側アコーディオン：spCatBody[hidden] を display:block !important でUAの display:none を上書き
============================================================================ */

/* =========================================================
  共通：カテゴリグリッド
========================================================= */
.catGrid{
  --cols: 4;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

/* ヘッダー：4列 */
.catMenu--header{ --cols: 4; }

/* サイド：縦並び */
.catMenu--side{
  --cols: 1;
  position: relative;
  gap: 0;
  overflow: visible;
}

/* フッター */
.catMenu--footer{ --cols: 1; }

@media (max-width: 1023px){
  .catMenu--header{ --cols: 2; }
}
@media (max-width: 767px){
  .catMenu--header{ --cols: 2; }
  .catMenu--footer{ --cols: 1; }
}

/* 既存運用のスクロール制御（必要なら残す） */
@media (max-height: 899px){
  .gnav_left > li:hover .acc_catgory{
    height: 75vh;
    overflow-y: scroll;
  }
}

/* =========================================================
  親カテゴリ（共通）
========================================================= */
.catBtn{
  width: 100%;
  height: 44px;
  padding: 0 32px 0 8px;
  border: 1px solid #ccc;
  border-radius: 8px;
  background: #fff;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  cursor: pointer;
  font: inherit;

  text-decoration: none;
  color: inherit;

  position: relative;
  overflow: visible;
  box-sizing: border-box;
}

.catBtn__left{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.catBtn__img{
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex: 0 0 auto;
  transition: opacity .15s ease;
}

.catBtn__label{
  font-weight: 700;
  font-size: clamp(1.1rem, 1vw, 1.3rem);
}

.catBtn__labelLink{
  text-decoration: none;
  color: inherit;
  display: inline-block;
  min-width: 0;
  text-align: left;
  line-height: 1.4;
}
.catBtn__labelLink:hover,
.catBtn__labelLink:focus-visible{
  text-decoration: underline;
  color: #bf0000;
  outline: none;
}

/* 右側アイコン（headerのベース） */
.catBtn__icon{
  position: absolute;
  width: 18px;
  height: 18px;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 999px;
  flex: 0 0 auto;
}

/* リンク型：くの字 */
.catBtn__icon--chev::before{
  content:"";
  position:absolute;
  top: 50%;
  left: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid #bbb;
  border-bottom: 2px solid #bbb;
  transform: translate(-60%, -50%) rotate(-45deg);
  transition: transform .18s ease, border-color .18s ease;
}

/* 展開型：＋（丸） */
.catBtn__icon--pm{
  border: 1px solid #d33;
  transition: background-color .18s ease, border-color .18s ease;
}
.catBtn__icon--pm::before,
.catBtn__icon--pm::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width: 10px;
  height: 2px;
  background: #d33;
  transform: translate(-50%, -50%);
  transition: background-color .18s ease, opacity .18s ease;
}
.catBtn__icon--pm::after{ transform: translate(-50%, -50%) rotate(90deg); }
.catBtn.is-open .catBtn__icon--pm::after{ opacity: 0; }

/* =========================================================
  子カテゴリ（共通）
========================================================= */
.childLink__wrap{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.childLink__text{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.childLink__img{
  display: none;
  transition: opacity .15s ease;
}

.childPanel{
  grid-column: 1 / -1;
  border-radius: 8px;
  background: #e6e6e6;
  padding: 18px 22px;
  position: relative;
  box-shadow: 0 0 8px rgba(0,0,0,.1) inset;
}
.childPanel__inner{
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  gap: 12px;
  align-items: center;
}
.childLink{
  display: flex;
  align-items: center;
  gap: 10px;

  font-size: clamp(1.05rem, 1vw, 1.2rem);
  font-weight: 800;
  text-decoration: none;
  color: #111;

  line-height: 1.2;
  white-space: nowrap;
}
.childLink::before{
  content: "›";
  font-size: 22px;
  font-weight: 900;
}

/* 親/子：hover画像半透明（header + side） */
.catMenu--header .catBtn:hover .catBtn__img,
.catMenu--header .catBtn:focus-visible .catBtn__img,
.catMenu--side   .catBtn:hover .catBtn__img,
.catMenu--side   .catBtn:focus-visible .catBtn__img{
  opacity: 0.7;
}
.catMenu--header .childLink:hover .childLink__img,
.catMenu--header .childLink:focus-visible .childLink__img,
.catMenu--side   .childLink:hover .childLink__img,
.catMenu--side   .childLink:focus-visible .childLink__img{
  opacity: 0.7;
}

/* =========================================================
  HEADER（click）
========================================================= */
.catMenu--header .catBtn--link:hover .catBtn__label,
.catMenu--header .catBtn--link:focus-visible .catBtn__label,
.catMenu--header .catBtn--acc:hover  .catBtn__label,
.catMenu--header .catBtn--acc:focus-visible .catBtn__label{
  color: #bf0000;
}
.catMenu--header .childLink:hover,
.catMenu--header .childLink:focus-visible{
  color: #bf0000;
  outline: none;
}
.catMenu--header .catBtn--link:hover .catBtn__icon--chev::before,
.catMenu--header .catBtn--link:focus-visible .catBtn__icon--chev::before{
  transform: translate(-45%, -50%) rotate(-45deg);
  border-color: #bf0000;
}
.catMenu--header .catBtn--acc:hover .catBtn__icon--pm,
.catMenu--header .catBtn--acc:focus-visible .catBtn__icon--pm{
  background: #bf0000;
  border-color: #bf0000;
}
.catMenu--header .catBtn--acc:hover .catBtn__icon--pm::before,
.catMenu--header .catBtn--acc:hover .catBtn__icon--pm::after,
.catMenu--header .catBtn--acc:focus-visible .catBtn__icon--pm::before,
.catMenu--header .catBtn--acc:focus-visible .catBtn__icon--pm::after{
  background: #fff;
}
.catMenu--header .catBtn--acc.is-open .catBtn__icon--pm{
  background: #bf0000;
  border-color: #bf0000;
}
.catMenu--header .catBtn--acc.is-open .catBtn__icon--pm::before{ background:#fff; }

/* header：子カテゴリ画像表示／›削除 */
.catMenu--header .childLink__img{
  display: block;
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex: 0 0 auto;
}
.catMenu--header .childLink::before{ content: none; }
.catMenu--header .childLink__text{
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

/* header：展開型の親テキストリンクは無効化 */
.catMenu--header .catBtn--acc .catBtn__labelLink{
  pointer-events: none;
  text-decoration: none;
  color: inherit;
}

/* header：親→子パネル三角 */
.catGrid[data-mode="click"] .catBtn.is-open{
  position: relative;
  overflow: visible;
}
.catGrid[data-mode="click"] .catBtn.is-open::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-10px;
  transform: translateX(-50%);
  width:0; height:0;
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-top:10px solid #bf0000;
  z-index: 5;
  pointer-events:none;
}
.catGrid[data-mode="click"] .catBtn.is-open::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-11px;
  transform: translateX(-50%);
  width:0; height:0;
  border-left:11px solid transparent;
  border-right:11px solid transparent;
  border-top:11px solid #ccc;
  z-index: 4;
  pointer-events:none;
}

/* =========================================================
  SIDE（hover）
========================================================= */
.catMenu--side .catBtn{
  height: auto;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  border-bottom: 1px solid #e6e6e6;
}
.catMenu--side .catBtn__img{ width: 28px; height: 28px; }
.catMenu--side .catBtn__label{
  font-size: 1.25rem;
  font-weight: 700;
  color: #111;
}
.catMenu--side .catBtn--link:hover,
.catMenu--side .catBtn--acc:hover{ background: #efefef; }
.catMenu--side .catBtn--link:hover .catBtn__label,
.catMenu--side .catBtn--link:focus-visible .catBtn__label,
.catMenu--side .catBtn--acc:hover  .catBtn__label,
.catMenu--side .catBtn--acc:focus-visible .catBtn__label{
  color: #bf0000;
}
.catMenu--side .catBtn--acc{ position: relative; overflow: visible; }

/* side：右端アイコン（borderで統一） */
.catMenu--side .catBtn__icon{
  right: 0;
  width: 16px;
  height: 16px;
  border: 0;
  border-radius: 0;
}
.catMenu--side .catBtn--link .catBtn__icon::before{
  content:"";
  position:absolute;
  inset: 0;
  margin: auto;
  width: 5px;
  height: 5px;
  border-right: 2px solid #bbb;
  border-bottom: 2px solid #bbb;
  transform: rotate(-45deg);
}
.catMenu--side .catBtn--acc .catBtn__icon::before{
  content:"";
  position:absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 2px;
  background: #bf0000;
  transform: translate(-50%, -50%);
}
.catMenu--side .catBtn--acc .catBtn__icon::after{
  content:"";
  position:absolute;
  left: 50%;
  top: 50%;
  width: 2px;
  height: 12px;
  background: #bf0000;
  transform: translate(-50%, -50%);
}
.catMenu--side .catBtn--acc.is-open .catBtn__icon::after{ opacity: 0; }
.catMenu--side .catBtn--link:hover .catBtn__icon::before{ border-color:#bf0000; }

/* side：子カテゴリパネル（右隣） */
.catMenu--side .childPanel{
  position: absolute;
  top: 0;
  left: calc(100% - 16px);
  width: min(760px, 72vw);
  background: #fff;
  border-radius: 10px;
  padding: 18px 18px 16px;
  box-shadow: 0 12px 24px rgba(0,0,0,.18);
  z-index: 10;
  grid-column: auto;
  margin-top: 0;
  overflow: visible;
  --anchor-y: 22px;

  opacity: 0;
  transform: translateX(-10px);
  transition: opacity .18s ease, transform .18s ease;
  will-change: opacity, transform;
}
.catMenu--side .childPanel:not([hidden]){
  opacity: 1;
  transform: translateX(0);
}

/* ✅ side：吹き出し三角（強制生成） */
.catGrid[data-mode="hover"] .childPanel::before{
  content:"" !important;
  position:absolute;
  left:-16px;
  top: var(--anchor-y);
  transform: translateY(-50%);
  width:0; height:0;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-right: 16px solid #d8d8d8;
  pointer-events:none;
  z-index: 20;
}
.catGrid[data-mode="hover"] .childPanel::after{
  content:"" !important;
  position:absolute;
  left:-15px;
  top: var(--anchor-y);
  transform: translateY(-50%);
  width:0; height:0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 15px solid #fff;
  pointer-events:none;
  z-index: 21;
}

/* side：中身 */
.catMenu--side .childPanel__inner{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: start;
}
.catMenu--side .childLink.is-head{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #e6e6e6;
  font-size: 1.5rem;
  font-weight: 800;
  text-decoration: none;
  color: #337ab7;
}
.catMenu--side .childGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 26px;
  row-gap: 4px;
}
.catMenu--side .childLink__img{
  display: block;
  width: 28px;
  height: 28px;
  object-fit: cover;
  flex: 0 0 auto;
}
.catMenu--side .childLink::before{ content: none; }
.catMenu--side .childLink.is-head::after,
.catMenu--side .childLink.is-item::after{
  content:"";
  width: 8px;
  height: 8px;
  border-right: 2px solid #a9a9a9;
  border-bottom: 2px solid #a9a9a9;
  transform: rotate(-45deg);
  flex: 0 0 auto;
}
.catMenu--side .childLink.is-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #ededed;
  font-size: 1.25rem;
  font-weight: 700;
  color: #111;
  text-decoration: none;
}
.catMenu--side .childLink.is-item .childLink__wrap{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}
.catMenu--side .childLink.is-item .childLink__text{ white-space: nowrap; }
.catMenu--side .childLink:hover,
.catMenu--side .childLink:focus-visible{
  color: #bf0000;
  outline: none;
}
.catMenu--side .childLink:hover::after,
.catMenu--side .childLink:focus-visible::after{
  border-color: #bf0000;
}
.catMenu--side .childLink br{ display: none; }

/* side：被せ部分が親クリックを阻害しない */
.catMenu--side .childPanel{ pointer-events: none; }
.catMenu--side .childPanel__inner,
.catMenu--side .childGrid{ pointer-events: auto; }

/* =========================================================
  GUARD：side(hover) の吹き出し三角が他CSSに潰されるのを防ぐ
  - content:none を上書きして「生成」を保証
  - overflow:hidden を上書きして「はみ出し」を許可
  ※ side(hover)のchildPanelだけに限定
========================================================= */
.catGrid[data-mode="hover"] .childPanel{
  overflow: visible !important;
}

.catGrid[data-mode="hover"] .childPanel::before,
.catGrid[data-mode="hover"] .childPanel::after{
  content: "" !important;
  position: absolute !important;
  z-index: 999999 !important;
}

/* =========================================================
  FOOTER（JS生成）
========================================================= */
.catMenu--footer .footerCats{
  column-count: 4;
  column-gap: 36px;
  max-height: 2000px;
  margin-top: 8px;
}
.catMenu--footer .footerCats__section{
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  margin: 0 0 22px;
}
.footerCats__titleLink{
  display: block;
  font-weight: 800;
  color: #c00;
  font-size: 1.5rem;
  margin-bottom: 10px;
  text-decoration: none;
}
.catMenu--footer .footerCats__titleLink:hover,
.catMenu--footer .footerCats__titleLink:focus-visible{
  text-decoration: underline;
  outline: none;
}
.footerCats__list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}
.footerCats__list a{
  color: #111;
  text-decoration: none;
  font-weight: 400;
  font-size: 1.25rem;
  white-space: normal;
  line-height: 1.4;
}
.footerCats__list a:hover,
.footerCats__list a:focus-visible{
  text-decoration: underline;
  outline: none;
}
@media (max-width: 767px){
  .footernav__item{
    display:none;
  }
}

/* =========================================================
  SPメニュー：外側アコーディオン（商品カテゴリ / 特集 / メーカー）
========================================================= */
.spAccList{ margin: 0; padding: 0; }

.spCatWrap{
  margin: 0;
  padding: 0;
  border-top: 1px solid #e6e6e6;
}
.spCatToggle{
  position: relative;
  width: 100%;
  margin: 0;
  padding: 16px 46px 16px 12px;
  background: transparent;
  border: 0;

  display: flex;
  align-items: center;
  justify-content: space-between;

  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.3;

  cursor: pointer;
}
.spCatToggle[aria-expanded="true"]{ color: #bf0000; }

.spCatToggle__icon{
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
}
.spCatToggle__icon::before{
  content:"";
  position:absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 2px;
  background: #bf0000;
  transform: translate(-50%, -50%);
}
.spCatToggle__icon::after{
  content:"";
  position:absolute;
  left: 50%;
  top: 50%;
  width: 2px;
  height: 14px;
  background: #bf0000;
  transform: translate(-50%, -50%);
  transition: opacity .15s ease;
}
.spCatToggle[aria-expanded="true"] .spCatToggle__icon::after{ opacity: 0; }

/* spCatBody：paddingは0（余白原因を排除） */
.spCatBody{
  padding: 0;
  margin: 0;

  display: block;
  max-height: 0;
  overflow: hidden;

  opacity: 0;
  transform: translateY(-4px);
  transition: max-height .28s ease, opacity .18s ease, transform .18s ease;
  will-change: max-height, opacity, transform;
}
/* ✅ hidden属性（UAのdisplay:none）を上書きしてアニメを殺さない */
.spCatBody[hidden]{ display: block !important; }

.spCatWrap.is-open .spCatBody{
  opacity: 1;
  transform: translateY(0);
  max-height: none;
}

/* 特集/メーカーのシンプルリンク一覧（任意） */
.spLinkList{
  list-style: none;
  margin: 0;
  padding: 6px 12px 12px;
  display: grid;
  gap: 10px;
}
.spLinkList a{
  text-decoration: none;
  color: #111;
  font-weight: 700;
  font-size: 1.2rem;
}
.spLinkList a:hover,
.spLinkList a:focus-visible{
  color: #bf0000;
  outline: none;
}

/* =========================================================
  SP（mobile）：親直下アコーディオン（右出し無効化）
========================================================= */
.catGrid[data-mode="mobile"] .childPanel{
  position: static !important;
  inset: auto !important;
  width: auto !important;
  z-index: auto !important;

  display: block !important;
  grid-column: 1 / -1;

  background: #f7f7f7;
  border-radius: 8px;
  box-shadow: none;

  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height .26s ease, opacity .18s ease, transform .18s ease;
  will-change: max-height, opacity, transform;

  padding: 0 12px;
  margin: 0;
}
.catGrid[data-mode="mobile"] .childPanel.is-open{
  opacity: 1;
  transform: translateY(0);
  max-height: var(--sp-child-h, 520px);
  padding: 10px 12px 12px;
  margin: 0 0 8px 0;
}
.catGrid[data-mode="mobile"] .childPanel::before,
.catGrid[data-mode="mobile"] .childPanel::after{
  content: none !important;
}
.catGrid[data-mode="mobile"] .childPanel__inner{
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: start;
}
.catGrid[data-mode="mobile"] .childGrid{ display: contents; }

/* mobile：誤タップ防止（padding/border） */
.catGrid[data-mode="mobile"] .childLink{
  padding: 10px 0;
  line-height: 1.35;
  white-space: normal;
}
.catGrid[data-mode="mobile"] .childPanel__inner > .childLink{
  border-top: 1px solid #e6e6e6;
}
.catGrid[data-mode="mobile"] .childPanel__inner > .childLink:first-child{ border-top: 0; }
.catGrid[data-mode="mobile"] .childLink__wrap{
  width: 100%;
  justify-content: flex-start;
  gap: 12px;
}
.catGrid[data-mode="mobile"] .childLink__img{
  width: 28px;
  height: 28px;
  border-radius: 6px;
  object-fit: cover;
  flex: 0 0 auto;
}
.catGrid[data-mode="mobile"] .childLink::after{ margin-left: auto; }

/* =========================================================
  SP（mobile）：微調整
========================================================= */

/* 親カテゴリ：padding 四方10px */
.catGrid[data-mode="mobile"] .catBtn{
  padding: 10px !important;
}

/* 親カテゴリ：右端アイコン位置を右から10px内側へ */
.catGrid[data-mode="mobile"] .catBtn__icon{
  right: 10px !important;
}

/* 子カテゴリ：内部のgapを0に */
.catGrid[data-mode="mobile"] .childPanel__inner{
  gap: 0 !important;
}

/* 子カテゴリ：右端に「>」矢印（borderで生成） */
.catGrid[data-mode="mobile"] .childLink{
  width: 100%;
  justify-content: space-between;
}

.catGrid[data-mode="mobile"] .childLink::after{
  content: "";
    width: 5px;
    height: 5px;
  border-right: 2px solid #bbb;
  border-bottom: 2px solid #bbb;
  transform: rotate(-45deg);
  flex: 0 0 auto;
}

.spCatBody .sidenav__list_pc .list-item{
    padding:10px;
}
.spCatBody .sidenav__list_pc  .list-item::before {
    right: 10px;
}

.spCatBody .sidenav__list_pc .list-item__text {
    width: 100%;
}

.hamburgernav__user-info .header-nav__sub li a {
    font-size: 1.2rem;
}