@charset "utf-8";
/*---------------------------------------------------------------------
Parts Style
style.css
-----------------------------------------------------------------------
Copyright 2025 (c) linkpath Allrights Reserved.
Created: linkpath
Created url: https://linkpath.jp/
Coding: Hinako Hayashi
Last Update: 2025.06.12
---------------------------------------------------------------------*/
/*===========================================================
    font-size
===========================================================*/
.nav-declaration h2 {
    font-size: 200%;
}
.nav-menu__btn i {
    font-size: 200%;
}

.nav-menu__link,
.link-btn {
    font-size: 110%;
}
.h-shop ul li i,
.ec-cartNavi .ec-cartNavi__icon {
    font-size: 110%;
}
.nav-menu__child .nav-menu__link {
    font-size: 100%;
}

.nav-menu__btn {
    font-size: 90%;
}
.h-shop ul li span,
.ec-cartNavi__price {
    font-size: 85%;
}
.arrow-top {
    font-size: 80%;
}
.logo span,
.nav-contact__link small {
    font-size: 70%;
}

/*===========================================================
    parts
===========================================================*/
/* logo */
.logo {
    height: 25vh;
    height: 25svh;
    max-height: 15em;
    min-height: 10em;
    padding-right: 0.5em;
    position: fixed;
    top: 6.5em;
    left: 0.25em;
    pointer-events: none;
    opacity: 0;
    z-index: 10;
    transition: all 0.75s;
}
.logo img {
    width: auto;
    height: 100%;
}
.logo span {
    white-space: nowrap;
    position: absolute;
    top: 0;
    right: 0;
}
body.s-active .logo {
    pointer-events: auto;
    opacity: 1;
}
body.f-active .logo {
    pointer-events: none;
    opacity: 0;
}

/*wbr*/
.wbr {
    word-break: keep-all;
    overflow-wrap: break-word;
}

/* content-none */
.content-none,
.pc-content-none {
    display: none;
}

/* vertical */
.vertical {
    writing-mode: vertical-rl;
    text-orientation: upright;
}

/* arrow-top */
.arrow-top {
    width: 1em;
    height: 1em;
    display: block;
    position: relative;
}
.arrow-top::before, .arrow-top::after {
    content: "";
    position: absolute;
}
.arrow-top::before {
    width: 60%;
    height: 60%;
    top: 0;
    right: 0;
    transition: all 0.3s;
}
.arrow-top::after {
    width: calc(1em * 1.4);
    height: 1px;
    transform-origin: center;
    top: 55%;
    left: 45%;
    transform: translate(-50%, -50%) rotate(-45deg);
    transition: all 0.3s;
}
.arrow-top.base::before {
    border-top: solid 1px var(--color-base);
    border-right: solid 1px var(--color-base);
}
.arrow-top.base::after {
    background: var(--color-base);
}
.arrow-top.accent::before {
    border-top: solid 1px var(--color-accent);
    border-right: solid 1px var(--color-accent);
}
.arrow-top.accent::after {
    background: var(--color-accent);
}

/* arrow-left, arrow-right */
.arrow-left,
.arrow-right {
    width: 2em;
    height: 2em;
    display: block;
    position: relative;
}
.arrow-left::before,
.arrow-right::before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 40%;
    left: 0;
    transform: translateY(-50%);
}
.arrow-left::after,
.arrow-right::after {
    content: "";
    width: 0.75em;
    height: 1px;
    position: absolute;
    bottom: 40%;
}
.arrow-left::after {
    transform-origin: left;
    transform: rotate(-45deg) translateY(-50%);
    left: 0;
}
.arrow-right::after {
    transform-origin: right;
    transform: rotate(45deg) translateY(-50%);
    right: 0;
}

.arrow-left.base::before,
.arrow-left.base::after,
.arrow-right.base::before,
.arrow-right.base::after {
    background: var(--color-base);
}
.arrow-left.accent::before,
.arrow-left.accent::after,
.arrow-right.accent::before,
.arrow-right.accent::after {
    background: var(--color-accent);
}

/* slider-btn */
.slider-btn {
    width: 4em;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1 / 1;
    z-index: 2;
    transition: all 0.3s;
}
.slider-btn:hover {
    opacity: 0.8;
}
.slider-btn span {
    width: 60%;
    height: 60%;
}

/* slider-info */
.slider-info {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 2em;
}
.slider-counter {
    display: flex;
    gap: 0.5em;
}
.slider-info .slider-btn {
    position: static;
    transform: none;
}

/* link-btn */
.link-btn {
    max-width: 20em;
    min-width: 15em;
    width: 100%;
    letter-spacing: 0.1em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1em 2em;
}
.link-btn:hover {
    transform: translateY(-5px);
}
.link-btn.center {
    margin: 0 auto;
}
.link-btn.right {
    margin: 0 0 0 auto;
}

/* back-img */
.back-img {
    background: var(--color-base);
    position: relative;
}
.back-img::before {
    content: "";
    width: 100%;
    height: 100%;
    background: url(/html/user_data/assets/img/parts/back.webp);
    background-size: contain;
    background-repeat: repeat;
    background-position: center;
    opacity: 0.4;
    position: absolute;
    top: 0;
    left: 0;
}
.back-img > * {
    position: relative;
    z-index: 2;
}

/*===========================================================
    header
===========================================================*/
header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2em;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
}

/* h-nav */
.h-nav__items {
    width: 100%;
    height: 100vh;
    height: 100dvh;
    display: flex;
    justify-content: center;
    background: var(--color-base);
    padding: 4em;
    padding-top: 9em;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.6s;
    pointer-events: none;
    opacity: 0;
}
.h-nav__items::before {
    content: "";
    width: 100%;
    height: 100%;
    background: url(/html/user_data/assets/img/parts/back.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.4;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}

.h-nav .nav-menu {
    max-width: 375px;
    height: 100%;
    overflow-y: scroll;
}
.h-nav .nav-menu__parent > li >.nav-menu__link {
    border-bottom: solid 1px var(--color-accent__transparent);
    padding-bottom: 1em;
}
.h-nav .nav-menu__parent > li:first-of-type > .nav-menu__link {
    border-top: solid 1px var(--color-accent__transparent);
    padding-top: 1em;
}

header .nav-info {
    border-left: solid 1px var(--color-accent);
    padding-left: 4em;
}

/* h-nav */
.hb {
    display: flex;
    align-items: center;
    gap: 1em;
}
.hb:hover {
    opacity: 0.6;
}
.hb ul {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
    transition: color 0.6s, opacity 0.6s;
}
.hb ul li {
    width: 3em;
    height: 1px;
}
.hb-text {
    cursor: pointer;
}

/* h-shop */
.h-shop ul {
    display: flex;
    align-items: center;
    gap: 2em;
}
.h-shop ul li {
    border-left: solid 1px var(--color-base);
    padding-left: 2em;
}
.h-shop ul li:nth-of-type(2) {
    border-left: none;
    padding-left: 0;
}
.h-shop ul li:last-of-type {
    border-right: solid 1px var(--color-base);
    padding-right: 2em;
}
.h-shop ul li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
}
.h-shop ul li a:hover {
    opacity: 0.6;
}
.h-shop ul li svg {
    height: 1.5em;
}
.h-shop .search-sp__btn {
    display: none;
}

/* header.twig ec-cube */
header .ec-input input::placeholder {
    color: var(--color-base);
}
.ec-headerSearch .ec-headerSearch__keyword {
    border-left: solid 1px var(--color-base);
}
.ec-headerSearch {
    border: solid 1px var(--color-base);
}

/* s-active h-active */
header,
.hb,
.hb ul li,
.h-shop ul li,
.h-shop ul li a,
.h-shop ul li i,
.ec-cartNavi__price,
header .ec-input input::placeholder,
.ec-headerSearch,
.ec-headerSearch .ec-headerSearch__keyword,
.ec-headerSearch .ec-headerSearch__category .ec-select select,
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search::before,
.ec-cartNaviIsset,
.ec-cartNaviNull,
.h-shop .ec-icon i {
    transition: all 0.75s;
}

header.h-active .h-nav__items {
    pointer-events: auto;
    opacity: 1;
}

header.s-active {
    background: var(--color-base);
    padding: 1em 2em;
}
header.s-active .hb li,
header.h-active .hb li {
    background: var(--color-accent);
}
header.s-active .hb,
header.h-active .hb,
header.s-active .ec-headerSearch,
header.h-active .ec-headerSearch,
header.s-active .ec-input input::placeholder,
header.h-active .ec-input input::placeholder {
    color: var(--color-accent);
}
header.s-active .h-shop ul li,
header.h-active .h-shop ul li,
header.s-active .ec-headerSearch .ec-headerSearch__keyword,
header.h-active .ec-headerSearch .ec-headerSearch__keyword {
    border-left: solid 1px var(--color-accent);
}
header.s-active .h-shop ul li:nth-of-type(2),
header.h-active .h-shop ul li:nth-of-type(2) {
    border-left: none;
}
header.s-active .h-shop ul li:last-of-type,
header.h-active .h-shop ul li:last-of-type {
    border-right: solid 1px var(--color-accent);
}
header.s-active .h-shop ul li a,
header.h-active .h-shop ul li a,
header.s-active .h-shop ul li i,
header.h-active .h-shop ul li i,
header.s-active .ec-cartNavi__price,
header.h-active .ec-cartNavi__price,
header.s-active .ec-headerSearch .ec-headerSearch__category .ec-select select,
header.h-active .ec-headerSearch .ec-headerSearch__category .ec-select select {
    color: var(--color-accent);
}

header.s-active .ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search::before,
header.h-active .ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search::before {
    border-top: 6px solid var(--color-accent);
}

header.s-active .ec-headerSearch,
header.h-active .ec-headerSearch {
    border: solid 1px var(--color-accent);
}
header.s-active .ec-headerSearch {
    background: rgba(255, 255, 255, 0.75);
}
header.h-active .ec-headerSearch {
    opacity: 0;
    pointer-events: none;
}

header.h-active .hb li:nth-child(1) {
    transform: rotate(20deg) translateY(6px);
}
header.h-active .hb li:nth-child(2) {
    transform: rotate(-20deg) translateY(-6px);
}

header.s-active .ec-cartNaviIsset,
header.s-active .ec-cartNaviNull {
    margin-top: 30px;
}
header.h-active .ec-cartNaviIsset,
header.h-active .ec-cartNaviNull {
    opacity: 0;
    pointer-events: none;
}

/*===========================================================
    nav
===========================================================*/
/* nav-declaration */
.nav-declaration {
    max-width: 20em;
    min-width: 10em;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    background: url(/html/user_data/assets/img/parts/nav.webp);
    background-size: cover;
    background-position: top;
    padding: 5em 0;
    position: relative;
    z-index: -1;
}
.nav-declaration::before {
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.1));
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.nav-declaration h2 {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: 0.5em;
    line-height: 2em;
    text-shadow: 2px 2px 2px var(--color-accent__transparent);
}


/* nav-menu */
.nav-menu {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 1.5em;
    padding: 0 4em;
}

/* nav-menu__login */
.nav-menu__login {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1em;
}
.nev-menu__login__link {
    width: 100%;
}
.nav-menu__login__link a {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0.5em;
    padding: 1em;
    position: relative;
}
.nav-menu__login__link a .arrow-top {
    position: absolute;
    top: 50%;
    right: 1.5em;
    transform: translateY(-50%);
}

/* nav-menu__btns */
.nav-menu__btns {
    max-width: 270px;
    display: flex;
    flex-wrap: wrap;
}
.nav-menu__btns li {
    width: 50%;
    position: relative;
}
.nav-menu__btns li:nth-child(1)::before {
    content: "";
    width: 100%;
    height: 1px;
    background: var(--color-accent);
    position: absolute;
    bottom: 0;
    left: 0;
}
.nav-menu__btns li:nth-child(1)::after {
    content: "";
    width: 1px;
    height: 100%;
    background: var(--color-accent);
    position: absolute;
    bottom: 0;
    right: 0;
}
.nav-menu__btns li:nth-child(2)::before {
    content: "";
    width: 100%;
    height: 1px;
    background: var(--color-accent);
    position: absolute;
    bottom: 0;
    left: 0;
}
.nav-menu__btns li:nth-child(3)::before {
    content: "";
    width: 1px;
    height: 100%;
    background: var(--color-accent);
    position: absolute;
    bottom: 0;
    right: 0;
}
.nav-menu__btn {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1em;
    aspect-ratio: 1 / 1;
    padding: 1em;
}

.nav-menu__btn span {
    border-radius: 100px;
    padding: 0em 1em;
    padding-top: 0.25em;
}

/* nav-menu__parent */
.nav-menu__parent {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1em 4em;
}
.nav-menu__parent li {
    width: 100%;
}
.nav-menu__link {
    width: 100%;
    letter-spacing: 0.05em;
    display: flex;
    justify-content: space-between;
}
.nav-menu__link:hover {
    opacity: 0.6;
}
.nav-menu__child {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    border-left: solid 1px var(--color-accent);
    padding-left: 1em;
    margin-top: 1em;
}

/* nav-info */
.nav-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1em;
}
.nav-info > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2em;
}
.nav-info > div > a {
    height: 35vh;
    height: 35svh;
}
.nav-info > div > a img {
    width: auto;
    height: 100%;
}

/* nav-address */
.nav-address {
    text-align: center;
}

/* nav-contact */
.nav-contact {
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.nav-contact__link {
    white-space: nowrap;
    display: flex;
    gap: 1em;
    justify-content: center;
    align-items: center;
    padding: 0.5em 2em;
}
.nav-contact__link:hover {
    opacity: 0.6;
}
.nav-contact__link span {
    text-align: center;
    letter-spacing: 0.05em;
    text-indent: 0.05em;
    display: block;
}
.nav-contact__link small {
    line-height: 1em;
    display: block;
    padding-bottom: 0.25em;
}
.nav-contact__link svg {
    width: 2em;
}

/* nav-other */
.nav-other {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5em;
    margin: 0 0 0 auto;
}
.nav-other__link {
    display: flex;
    gap: 1em;
    align-items: center;
}
.nav-other__link:hover {
    opacity: 0.6;
}
.nav-other p a {
    display: inline;
}

/*===========================================================
    wrap
===========================================================*/
/* more-content */
.more-content .show-content {
    transition: all 0.3s;
}
.more-content .show-content:hover {
    opacity: 0.6;
}
.more-content .hide-content {
	height: 0;
	overflow: hidden;
	opacity: 0;
	transform: translateY(-10px);
	transition: height 0.4s ease, opacity 0.3s ease, transform 0.3s ease;
}
.more-content.is-active .hide-content {
	opacity: 1;
	transform: translateY(0);
}

.more-mark {
    width: 2em;
    height: 2em;
    position: relative;
    transition: all 0.3s;
}
.more-mark::before,
.more-mark::after {
    content: "";
    width: 100%;
    height: 1px;
    background: var(--color-accent);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%);
    transition: all 0.3s;
}
.more-mark::after {
    transform: translate(-50%) rotate(90deg);
}
.more-content.is-active .more-mark::after {
    transform: translate(-50%) rotate(180deg);
}

/*===========================================================
    footer
===========================================================*/
.f-nav {
    display: flex;
    justify-content: center;
    gap: 5em;
    padding: 6em 5em;
}
.f-nav .nav-info {
    border-right: solid 1px var(--color-base);
    padding-right: 5em;
}
.f-nav .nav-menu {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0;
}
.f-nav .nav-menu__parent {
    max-width: calc(17em * 2 + 4em);
    width: 100%;
    justify-content: flex-end;
}
.f-nav .nav-menu__parent li {
    max-width: 17em;
    min-width: 13em;
    width: 100%;
}
.f-nav .nav-menu__child {
    border-left: solid 1px var(--color-base);
}
.f-nav .nav-other p {
    text-align: right;
}

@media screen and (min-width: 960px) and (max-width: 1300px) {
/*===========================================================
    parts
===========================================================*/
.logo img {
    max-height: 7.5em;
}
.logo span {
    font-size: 10px;
}
}

@media screen and (max-width: 1080px) {
/*===========================================================
    font-size
===========================================================*/

/*===========================================================
    parts
===========================================================*/

/*===========================================================
    header
===========================================================*/
header .nav-info {
    padding-left: 2.5em;
}

/*===========================================================
    nav
===========================================================*/
/* nav-declaration */
.nav-declaration {
    display: none;
}

/* nav-menu */
.nav-menu {
    padding: 0 2.5em;
}

/* nav-menu__login */

/* nav-menu__btns */

/* nav-info */

/*===========================================================
    wrap
===========================================================*/

/*===========================================================
    footer
===========================================================*/
}

@media screen and (max-width: 959px) {
/*===========================================================
    font-size
===========================================================*/
.h-shop ul li i,
.ec-cartNavi .ec-cartNavi__icon {
    font-size: 130%;
}
.h-shop ul li span,
.ec-cartNavi__price,
.ec-cartNavi .ec-cartNavi__price,
.hb-text {
    font-size: 70%;
}

/*===========================================================
    parts
===========================================================*/
/* logo */
.logo {
    height: 20vh;
    height: 20svh;
    top: 0.5em;
}

/* content-none */
.sp-content-none {
    display: none;
}
.pc-content-none {
    display: block;
}

/*===========================================================
    header
===========================================================*/
header {
    flex-direction: row-reverse;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.15em;
    padding: 0;
    padding-top: 0.5em;
}
header.s-active,
header.h-active {
    padding-top: 0;
}

/* h-nav */
.h-nav__items {
    flex-direction: column;
    justify-content: flex-start;
    overflow-y: scroll;
    padding-top: 8em;
}

/* h-nav nav-menu */
.h-nav .nav-menu {
    max-width: 500px;
    height: fit-content;
    padding-bottom: 3em;
    overflow-y: unset;
}

/* h-nav nav-info */
.h-nav .nav-info {
    border-left: none;
    padding-left: 0;
}

/* hb */
.hb {
    width: 4.25em;
    text-align: center;
    flex-direction: column;
    justify-content: flex-end;
    aspect-ratio: 1 / 1;
}
.hb-text {
    line-height: 1em;
    padding-bottom: 1em;
}

/* h-shop */
.h-shop ul {
    gap: 0.15em;
}
.h-shop ul li {
    width: 4.25em;
    border-left: none;
    aspect-ratio: 1 / 1;
    padding: 0;
}
.h-shop ul li a {
    height: 100%;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0.8em;
}
.h-shop ul li span,
.ec-cartNavi .ec-cartNavi__price {
    line-height: 1em;
    padding-bottom: 1em;
}
.h-shop ul li:last-of-type {
    border-right: none;
    padding-right: 0;
}
.search-sp__btn,
.cart-box {
    padding-bottom: 1em;
}

.cart-box {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.h-shop ul li svg {
    height: 2em;
}
.h-shop .search-sp__btn {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 0.8em;
}
.h-shop .search-box {
    width: 90%;
    position: absolute;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.65;
    opacity: 0;
    pointer-events: none;
}
.h-shop .search-box.is-active {
    opacity: 1;
    pointer-events: auto;
}
.h-shop .ec-cartNaviWrap {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
}

/* header.twig ec-cube */
.ec-headerSearch {
    background: rgba(225, 223, 212, 0.5);
}


/* s-active h-active */
header.s-active {
    background: none;
    padding: 0;
}
header.s-active .hb li,
header.h-active .hb li {
    background: var(--color-base);
}
header.s-active .hb,
header.h-active .hb {
    color: var(--color-base);
}
header.s-active .h-shop ul li,
header.h-active .h-shop ul li {
    border-left: none;
}
header.s-active .h-shop ul li > a,
header.h-active .h-shop ul li > a,
header.s-active .h-shop ul li,
header.h-active .h-shop ul li,
header.s-active .h-shop ul li i,
header.h-active .h-shop ul li i,
header.s-active .ec-cartNavi__price,
header.h-active .ec-cartNavi__price {
    color: var(--color-base);
}

header.s-active .hb,
header.h-active .hb,
header.s-active .h-shop ul li > a,
header.h-active .h-shop ul li > a,
header.s-active .search-sp__btn,
header.h-active .search-sp__btn,
header.s-active .cart-box,
header.h-active .cart-box {
    background: var(--color-accent);
}

header.h-active .hb li:nth-child(1) {
    transform: rotate(20deg) translateY(6px);
}
header.h-active .hb li:nth-child(2) {
    transform: rotate(-20deg) translateY(-6px);
}

header.s-active .ec-cartNaviIsset,
header.s-active .ec-cartNaviNull {
    margin-top: 10px;
}

header.s-active .h-shop .ec-icon i {
    color: var(--color-accent);
}


/*===========================================================
    nav
===========================================================*/
.nav-menu,
.nav-info {
    max-width: 500px;
    width: 100%;
    margin: 0 auto;
}
/* nav-declaration */

/* nav-menu */

/* nav-menu__login */

/* nav-menu__btns */

/* nav-menu__parent */
/* nav-info */
.nav-contact {
    width: 100%;
}

/*===========================================================
    wrap
===========================================================*/

/*===========================================================
    footer
===========================================================*/
.f-nav {
    flex-direction: column;
}
.f-nav .nav-info {
    border-right: none;
    padding-right: 0;
}
.f-nav .nav-menu__parent {
    justify-content: flex-start;
}
.f-nav .nav-menu__parent li {
    max-width: 15em;
}

.f-nav .nav-other {
    margin-top: 5em;
}
}

@media screen and (max-width: 767px) {
/*===========================================================
    font-size
===========================================================*/

/*===========================================================
    parts
===========================================================*/

/*===========================================================
    header
===========================================================*/
/* header.twig ec-cube */
.ec-headerSearch .ec-headerSearch__keyword {
    border-left: none;
    border-top: solid 1px var(--color-base);
}
header.s-active .ec-headerSearch .ec-headerSearch__keyword,
header.h-active .ec-headerSearch .ec-headerSearch__keyword {
    border-left: none;
    border-top: solid 1px var(--color-accent);
}


/*===========================================================
    nav
===========================================================*/
/* nav-declaration */

/* nav-menu */

/* nav-info */

/*===========================================================
    wrap
===========================================================*/

/*===========================================================
    footer
===========================================================*/
}

@media screen and (max-width: 482px) {
/*===========================================================
    font-size
===========================================================*/
.h-shop ul li i,
.ec-cartNavi .ec-cartNavi__icon {
    font-size: 120%;
}
.link-btn {
    font-size: 100%;
}

/*===========================================================
    parts
===========================================================*/

/*===========================================================
    header
===========================================================*/
/* h-nav */
.h-nav__items {
    padding: 4em 2.5em;
    padding-top: 7em;
}
.h-nav .nav-menu {
    padding: 0;
    padding-bottom: 3em;
}

/* h-shop */
.h-shop ul li {
    width: 4em;
}

/* hb */
.hb {
    width: 4em;
}

/*===========================================================
    nav
===========================================================*/
/* nav-declaration */

/* nav-menu */

/* nav-menu__login */

/* nav-menu__btns */

/* nav-menu__parent */

/* nav-info */

/*===========================================================
    wrap
===========================================================*/

/*===========================================================
    footer
===========================================================*/
.f-nav {
    gap: 3em;
    padding: 4em 2.5em;
}

.f-nav .nav-info {
    border-bottom: solid 1px var(--color-base);
    padding-bottom: 3em;
}

.f-nav .nav-menu__parent > li {
    max-width: 100%;
    min-width: 100%;
    border-bottom: solid 1px var(--color-base__transparent);
    padding-bottom: 2em;
}
}