@charset "UTF-8";
.c-h1::after { content: ''; display: block; margin-top: 0.5rem; width: 100%; height: 1px; background-image: var(--gradation-color); }
.c-h1 { padding-bottom: 0.5rem; font-weight: 500; }
.main--cart .c-button, .main--cart .c-button-submit,.main--mypage-bookmark .c-button { color: var(--text-main); }
/* aside------------------------------------------ */
/* list toggle */
.aside section.__block.__block--category .__body ul.__tree li.__item.__item--has-children span.__js-toggle { display: block; height: 100%; }
.aside section.__block.__block--category .__body ul.__tree li.__item.__item--has-children span.__js-toggle::before { content: '\e313'; position: absolute; font-family: 'Material Symbols Outlined'; font-size: 1.75rem; font-weight: 300; color: var(--text-main); right: 0px; top: 0.6rem; }
/* item */
.aside section.__block .__heading.__heading--default, .aside section.__block .__heading.__heading--custom { border-bottom: none; margin: 0; padding: 0.5rem 1rem; background-color: var(--bg-light); font-size: 1.15rem; font-weight: 500; }
.aside section.__block.__block--calendar ul li table.cal { font-family: var(--font-en); }
/* __product--------------------------------------- */
.main.main--product-list section.__child ul li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.8em;
    margin-right: 0.5em;
    color: #fff;
    background-color: var(--accent-color);
    border-radius: 50px;
    font-size: 0.9333em;
    text-decoration: none;
}
.main.main--product-list section.__child ul li:last-child a {
    padding-right: 0.8em;
}
.main.main--product-list section.__child ul li a:hover {
    background-color: var(--primary-color);
    opacity: 1;
}
/* __photo */
.p-product-block ul.__product li.__item a .__photo,
.main.main--product-detail section.__information .__primary .__photo .__main,
.main.main--product-detail section.__information .__primary .__photo .__sub ul li a,
.main.main--product-list section.__list.__list--row ul.__product>li.__item a table tr td.__photo {  aspect-ratio: 1 / 1; border: 1px solid var(--border-color); }
.p-product-block ul.__product li.__item a .__photo img,
.main.main--product-detail section.__information .__primary .__photo .__main img,
.main.main--product-list section.__list.__list--row ul.__product>li.__item a table tr td.__photo img {  object-fit: cover; aspect-ratio: 1; max-height: unset;  width: 100%; max-width: unset; }
.main.main--product-detail section.__information .__primary .__photo .__sub ul li a img { object-fit: contain; aspect-ratio: 1; object-position: center; }
/* __label */
.p-product-block ul.__product li.__item a .__status ul li.__label,
.main.main--product-detail section.__information .__secondary .__status ul li.__item span:before,
.main.main--product-list section.__list.__list--row ul.__product > li.__item a table tr td.__detail .__status ul li.__label { color: var(--text-main)!important; font-weight: 400!important; }
.p-product-block ul.__product li.__item a .__title,
.p-product-block ul.__product li.__item a .__description dl.__price { font-size: 1rem; }
/* __information */
.main.main--product-detail section.__information .__secondary h1.__title,
.main.main--product-detail section.__information .__secondary h1.__title,
.main.main--product-detail section.__information .__secondary .__catch { font-weight: 500; }
.main.main--product-detail section.__information .__secondary .__description a { text-decoration: underline; }
/* __information __spec */
a.contact_form_link.__button.c-button {margin-top: 0.5em; border-radius: 1em; padding: 0.3em 0.8em; white-space: unset; }
/* __block--recommend */
.main section.__block.__block--recommend { padding-top: 2.5rem; border-top: 1px solid var(--border-color); }
.__block--recommend .p-product-block ul.__product { padding: 0; }

/* flow ------------*/
.p-form-flow { margin-top: 2rem; max-width: 500px; }
.p-form-flow:before { border-bottom: 2px solid #bbb; }
.p-form-flow .__flow .__number { font-family: var(--font-en); }
.main.main--regist-finish section.__back-home a { color: var(--text-main); font-weight: 500; }
.main.main--regist-finish section.__back-home a::before {  content: '\e5cc'; font-size: 1.34em; font-family: var(--font-icon); vertical-align: sub; padding-right: 0; font-weight: 400; }

/* contact ------------*/
.main.main--contact-finish section.__back-home a {  font-weight: 500; }
.main.main--contact-finish section.__back-home a::before { content: '\e5cc'; font-size: 1.34em; font-family: var(--font-icon); vertical-align: sub; padding-right: 0; font-weight: 400; }

/* c-more ------------*/
.c-more a:before { content: '\e5cc'; font-size: 1.34em; font-family: var(--font-icon); vertical-align: sub; padding-right: 0; font-weight: 400;    margin-right: 0; }

/* howto ------------*/
html { scroll-behavior: smooth; }
:target { scroll-margin-top: 80px; }
.main.main--howto .__step h2.__heading { display: none; }
.main.main--howto .__step .__body ul.__list li.__item { margin-top: 0; }
.main.main--howto .__step .__body ul.__list li.__item .__title { background: var(--bg-light); padding: 0.5em 1em; }
.main.main--howto .__step .__body ul.__list li .__mt--2 { margin-top: 2em; }
.main.main--howto .__step .__body ul.__list li .__mt--3 { margin-top: 3em; }
.main.main--howto .__step .__body ul.__list li b { font-weight: 500; }
.main.main--howto .__step .__body ul.__list li a { text-decoration: underline; color: var(--primary-color); }
.main.main--howto .__step ol { padding-left: 1.5em; }
.main.main--howto .__step ol li::marker { color: var(--text-main);  }
.main.main--howto .__step ul { padding-left: 1.5em; list-style-type: disc; }
.main.main--howto .__step ul  li::marker { color: var(--text-main); }
/* __order-flow */
.main.main--howto .__step .__body .__order-flow {--flow-primary-light: #d4e0f9;--flow-customer-number: #5278c5;--flow-shop-number: #7e90a0;gap: 3px;max-width: 100%;padding: 0;display: flex;position: relative;flex-direction: column;}
.main.main--howto .__step .__body .__order-flow::before {content: "";position: absolute;z-index: 0;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.main.main--howto .__step .__body .__order-flow [class*="__item--step-"] {position: relative;padding: clamp(1em, 1.67vw, 1.067em) 0 0  clamp(.536em, 1.56vw, 1em); list-style: none; }
.main.main--howto .__step .__body .__order-flow .__card { position: relative; overflow: hidden; display: grid; border: 0.2em solid var(--border-color);border-radius: .667em; background: var(--white); }
.main.main--howto .__step .__body .__order-flow .__number {position: absolute;z-index: 2;top: 50%;left: 0;display: grid;place-items: center;width: clamp(1.5em, 2.78vw, 1.667em);height: clamp(1.5em, 2.78vw, 1.667em);border-radius: 50%;background: var(--flow-shop-number);color: var(--white);font-family: var(--font-en);font-size: clamp(1.571em, 2.5vw, 1.6em);font-weight: 400;line-height: 1;}
.main.main--howto .__step .__body ul.__list li.__item + li.__item { margin-top: 3em; }
.main.main--howto .__step .__body .__order-flow .__item--customer .__number { background: var(--flow-customer-number); }
.main.main--howto .__step .__body .__order-flow .__item--customer .__card { border-color: var(--flow-primary-light);  position: relative; }
.main.main--howto .__step .__body .__order-flow .__flow-title {position: relative;z-index: 1; color: var(--text-sub);font-size: clamp(.929em, 1.46vw, .933em);font-weight: 600;line-height: 1.2; letter-spacing: 0; }
.main.main--howto .__step .__body .__order-flow .__item--customer .__flow-title { grid-row: 1; align-self: center; color: var(--primary-color);}
.main.main--howto .__step .__body .__order-flow .__role {max-width: max-content;justify-self: center;max-height: fit-content; height: fit-content; padding: clamp(.444em, .52vw, .5em) clamp(.889em, 1.15vw, 1.19em);border-radius: 50px;background: var(--border-color);color: var(--text-sub);font-size: clamp(.643em, 1.04vw, .667em);font-weight: 600;line-height: 1.4;text-align: center;white-space: nowrap;position: relative;z-index: 1;}
.main.main--howto .__step .__body .__order-flow .__item--customer .__role {background: var(--flow-primary-light);color: var(--primary-color); }
.main.main--howto .__step .__body .__order-flow .__card::after {position: absolute;content: '';display: block;width: 100%;height: 100%;background-repeat: no-repeat;z-index: 0;background-size: 100%;}
.main.main--howto .__step .__body .__order-flow .__item--step-1 .__card::after {background-image: url(../img/common/icon-step1-1.svg);right: 6px;bottom: -2px;width: 2.733em;height: 3.267em; }
.main.main--howto .__step .__body .__order-flow .__item--step-2 .__card::after {background-image: url(../img/common/icon-step2-1.svg);right: -2px;bottom: -4px;width: 3.4em;height: 2.933em; }
.main.main--howto .__step .__body .__order-flow .__item--step-3 .__card::after {background-image: url(../img/common/icon-step3.svg);right: 6px;bottom: -4px; width: 2.8em; height: 3.467em; }
.main.main--howto .__step .__body .__order-flow .__item--step-4 .__card::after {background-image: url(../img/common/icon-step4-1.svg);right: 9px;bottom: -4px;width: 3.2em;height: 3.333em; }
.main.main--howto .__step .__body .__order-flow .__item--step-5 .__card::after {background-image: url(../img/common/icon-step5-1.svg);right: -4px;bottom: -4px;width: 3.333em;height: 3.267em; }
/* table */
.main.main--howto .__step .__body table.__table--payment thead th {padding: 0 1em;letter-spacing: 0;text-align: center;border-top: 1px solid var(--border-color-dark);border-right: 1px solid var(--border-color-dark);border-bottom: 1px solid var(--border-color-dark);background-color: #ECEFF1;font-size: .85em;font-weight: 600;white-space: nowrap;height: 40px;line-height: 1.2;}
.main.main--howto .__step .__body table.__table--payment thead th:last-child { border-right: none; }
.main.main--howto .__step .__body table.__table--payment tbody td {padding: .75em 1em;vertical-align: middle;border-top: 1px solid var(--border-color-dark);border-right: 1px solid var(--border-color-dark);border-bottom: 1px solid var(--border-color-dark);font-size: .9em; font-feature-settings: 'palt';}
.main.main--howto .__step .__body table.__table--payment tbody td:last-child { border-right: none; }
.main.main--howto .__step .__body table.__table--payment .__heading { display: none; }

/* sitemap------------ */
.main.main--sitemap .__wrap .__block h2.__heading { font-weight: 400; font-size: 1.2rem; }
.main.main--sitemap .__wrap .__block .__body ul li a:before { content: '\e5cc'; font-size: 1.34em; font-family: var(--font-icon); vertical-align: sub; padding-right: 0; font-weight: 400; color: var(--text-main); }

/* order-------------- */
/* カート　注文へ進むボタン非表示 */
div.__control > ul > li.__to-order > button { display: none!important; }
/* 見積完了ページ */
.main.main--order-finish .__message section.__estimate-pdf { margin-bottom: -1em; }
.main.main--order-finish .__message section.__estimate-pdf a:before { display: none; }
.main.main--order-finish .__message section.__estimate-pdf a:after {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f0da";
  margin-left: 0.3em;
}

@media screen and (max-width: 1023px) {
.header { border-bottom: 1px solid var(--border-color); }

.main.main--law .__content-top, .main.main--law .__content-bottom, .main.main--law .__information,
.main.main--corporate .__description, .main.main--corporate .__profile,
.main.main--corporate .__open { padding: 0 1rem; }


}


@media screen and (max-width: 959px) {
   .__block--recommend .c-heading-main { padding: 0 0.5rem; }
   .c-form { padding: 0 1rem; }
   .__shipping .c-form,
   .main.main--order-form section.__block.__block--order, .main.main--order-confirm section.__block.__block--order,
   .main.main--news-list .c-h1 { padding: 0; }
   
}

@media screen and (max-width: 599px) {
    .main.main--howto .__step .__body .__order-flow::before { transform: translate(-50%,-50%); border-left: 0.2em solid #E9EEF2; height: 100%; }
    .main.main--howto .__step .__body .__order-flow [class*="__item--step-"] {padding-left: 1em;padding-top: 0;}
    .main.main--howto .__step .__body .__order-flow .__card {padding-left: 2em;grid-template-columns: 1fr 50px 50px;align-items: center; border-width: 2px; }
    .main.main--howto .__step .__body .__order-flow .__number { transform: translateY(-50%); }
    .main.main--howto .__step .__body .__order-flow .__card::after {position: absolute;content: '';display: block;width: 100%;height: 100%;background-repeat: no-repeat;z-index: 0;background-size: 100%;top: 1px;}
    .main.main--howto .__step .__body .__order-flow .__item--step-1 .__card::after {background-size: 95%;background-position: center;right: 3px;}
    .main.main--howto .__step .__body .__order-flow .__item--step-2 .__card::after {top: 6px;background-size: 95%;background-position: center;}
    .main.main--howto .__step .__body .__order-flow .__item--step-3 .__card::after {background-size: 95%;background-position: center;right: 3px;}
    .main.main--howto .__step .__body .__order-flow .__item--step-4 .__card::after {top: 0;right: 2px;background-size: 90%;background-position: center;}
    .main.main--howto .__step .__body .__order-flow .__item--step-5 .__card::after {top: 4px;background-size: 90%;background-position: center;}
 }

@media screen and (min-width: 600px) {
.main.main--product-detail section.__information .__primary { width: 41%; }
.main.main--product-detail section.__information .__secondary { width: 59%; }
.main.main--cart section.__shipping-wrap .__shipping { border-top: none; border-bottom: 2px solid #ddd; }

.main.main--howto .__step .__body .__order-flow { display: grid;grid-template-columns: repeat(5, 1fr); gap: 1px; }
.main.main--howto .__step .__body .__order-flow::before { top: calc(50% + 0.5em); width: 70%; border-top: 3px solid #E9EEF2; }
.main.main--howto .__step .__body .__order-flow .__card { grid-template-rows: 3.6666em auto; height: 100px; }
.main.main--howto .__step .__body .__order-flow .__flow-title { margin-bottom: 0.57em; text-align: center; }
.main.main--howto .__step .__body .__order-flow .__number { top: 0; }
.main.main--howto .__step .__body .__order-flow .__role { place-self: start center; }
}


@media (min-width: 1024px) {
.header::before { position: absolute; content: ''; border-bottom: 1px solid var(--border-color); width: 100%; left: -50%; height: 70px; z-index: -1; }
.header::after { position: absolute; content: ''; border-bottom: 1px solid var(--border-color); width: 100%; right: -50%; height: 70px; z-index: -1; }

/* サイドナビ----------------------- */
.wrapper .__inner .main, .wrapper .__inner .aside { padding-top: 4rem; }
.aside section.__block.__block--category .__body ul.__tree> li.__item a { padding: 0.816em 0; }
.aside section.__block.__block--category .__body ul.__tree > li.__item.__item--has-children > a {  font-weight: bold; }
/* 小カテゴリを小さいくしてインラインブロック（span付与はjsで実装） */
.aside ul.__tree > li > a[href*="list.php"] .category-sub { font-size: 13px; letter-spacing: -0.75px; }
.aside ul.__tree > li > ul > li > a[href*="list.php"] .category-sub { display: block; font-size: 12px; letter-spacing: -0.75px; }
}

@media screen and (min-width: 1280px) {
.wrapper.wrapper--column-2 .__inner .aside { width: 23.833333%; }
.wrapper.wrapper--column-2 .__inner .main { width: 76.166667%; }

.p-product-block ul.__product li.__item {  width: 25%; }

}









