/*
Theme Name: wancolab ec theme
Theme URI: https://wancolab.com
Author: DAVINCI inc.
Author URI: https://davinciinc.co.jp
Description: Custom WooCommerce Theme without Customizer
Version: 1.0
*/


.woocommerce div.product {
    margin: 20px 0;
}

/* --------------------------------------------------
 common
--------------------------------------------------- */

/* font setting
--------------------------------------------------- */

@charset "UTF-8";


/* reset
--------------------------------------------------- */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){color:inherit;text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:3px solid Highlight;outline-offset:2px;scroll-margin-block:10vh}:where(.visually-hidden:not(:focus-within,:active)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

/* input, textarea などの focus や outline 無効化 */
:where(input, textarea, select):focus,
:where(input, textarea, select):focus-visible,
:where(input, textarea, select):focus-within {
  outline: none !important;
  box-shadow: none !important;
  border-color: inherit !important;
}

/* iOSでのタップズーム対策：font-size 16px未満でズームされるのを防ぐ */
:where(input, textarea, select, button) {
  font-size: 16px !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  user-select: none;
}

:root {
    --color-bk: #292929;
    --color-bgy: #292929;
    --color-dgy: #444444;
    --color-wh: #ffffff;
    --color-lwgy: #f2f2f2;
    --color-wgy: #eeeeee;
    --color-lgy: #cccccc;
    --color-gy: #999999;
    
    --color-bl: #53737F;
    --color-dbl: #1A323A;
    --color-tuq: #4FA39D;
    --color-ye: #DDB462;
    --color-dye: #C19340;
    --color-og: #e29837;
    --color-rd: #d16f6f;
	--color-lrd: #efe1e1;
    --font-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Helvetica Neue", Arial, Meiryo, sans-serif;
    --font-dera: "M PLUS Rounded 1c", sans-serif;
    --font-en-01: "Abril Fatface", serif;
    --font-en-02: "Afacad Flux", serif;
    --font-en-03: "Inter", sans-serif;
    --font-xxs: 0.6rem;
    --font-xs: 0.8rem;
    --font-s: 0.9rem;
    --font-m: 0.95rem;
    --font-ml: 1rem;
    --font-l: 1.2rem;
    --font-xl: 1.4rem;
    --font-xxl: 1.8rem;
}
@media screen and (min-width: 768px) {
    :root {
        --font-xxs: 0.7rem;
        --font-xs: 0.9rem;
        --font-s: 0.95rem;
        --font-m: 1rem;
        --font-xl: 1.8rem;
        --font-xxl: 2.2rem;
    }
}
@media screen and (min-width: 1024px) {
    :root {
        --font-s: 0.95rem;
        --font-m: 1rem;
        --font-l: 1.3rem;
        --font-xl: 2rem;
        --font-xxl: 2.4rem;
    }
}
@media screen and (min-width: 1280px) {
    :root {
        --font-s: 0.95rem;
        --font-m: 1rem;
        --font-l: 1.4rem;
        --font-xl: 2rem;
        --font-xxl: 2.8rem;
    }
}

/* layout
--------------------------------------------------- */

html {
    height: 100%;
    font-size: 100%;
    background-color: var(--color-wh)!important;
}
body {
    height: 100%;
    font-family: var(--font-jp);
    font-size: var(--font-m);
    font-weight: 400;
    letter-spacing: .05em;
    line-height: 1.8;
    color: var(--color-bk);
    background-color: var(--color-wh)!important;
    overflow-y: scroll;
}
@media screen and (min-width: 768px) {
    body {
        font-size: var(--font-s);
        line-height: 2;
    }
}
body::after {
    z-index: 9999;
    content: "";
    position: fixed;
    top: 0;
    right: 0;
    width: 100vw;
    height: 100vh;
    background: var(--color-wh);
    pointer-events: none;
    animation-name: fadeOut;
    animation-delay: 0;
    animation-duration: .7s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
}
body.viewtrans::after {
    animation-name: fadeIn;
    animation-delay: 0;
    animation-duration: .7s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
}
@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
}
a {
    display: block;
    color: var(--color-bk);
    text-decoration: none;
    cursor: pointer;
}
p a {
    display: inline;
}
img,
svg {
    width: 100%;
    height: auto;
}

.wrap {
    position: relative;
    width: 100%;
    min-width: 320px;
    height: auto !important;
    height: 100%;
    min-height: 100%;
    margin: auto;
    background-color: var(--color-lwgy);
	overflow-x: hidden;
	transition: 1s;
}
.mask {
    width: 100%;
    height: auto;
    overflow: hidden;
}
.mask .mask__inner {
    width: inherit;
    height: inherit;
    opacity: 0;
}
.mask .mask__inner.inview {
    position: relative;
    animation-name: maskIn;
    animation-duration: .5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
    opacity: 1 !important;
}
.mask .mask__inner.inview::before {
    z-index: 1;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-bk);
    animation-name: maskOut;
    animation-duration: .5s;
    animation-delay: .5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
}
@keyframes maskIn {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}
@keyframes maskOut {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(101%);
    }
}
.fade {
    opacity: 0;
    transform: translate(0, 5px);
}
.fade.inview {
    position: relative;
    animation-name: fadeIn;
    animation-duration: .5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
    opacity: 0;
    transform: translate(0, 5px);
}
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translate(0, 5px);
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}

main {
    padding-top: 62px;
}
.is-top main {
    padding-top: 0;
}
@media screen and (min-width: 768px) {
    main {
        padding-top: 70px;
    }
}
@media screen and (min-width: 1280px) {
    main {
        padding-top: 74px;
    }
}

.c-inner {
    max-width: 1000px;
    margin: auto;
}
@media screen and (min-width: 1024px) {
    .c-inner {
        max-width: 1150px;
    }
}
@media screen and (min-width: 1401px) {
    .c-inner {
        max-width: 1400px;
    }
}

/* --------------------------------------------------
 header
--------------------------------------------------- */

.header {
    z-index: 999999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 62px;
    transition: .3s;
}
.is-products .header {
    background: var(--color-wh);
}

.header::before {
    z-index: 2;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-wh);
    opacity: 0;
    transition: .5s;
}
.header.scroll::before {
    opacity: 1;
}
.header__inner {
    z-index: 3;
    display: flex;
	flex-direction: row;
	align-items: center;
    justify-content: flex-start;
	position: relative;
	width: 100%;
    height: 100%;
    padding: 0 12px;
}
.header__inner .logo {
    display: flex;
    justify-content: flex-start;
    position: relative;
    width: auto;
    height: 100%;
    margin-right: auto;
}
.header__inner .logo a {
    display: block;
    width: 100%;
    height: 100%;
}
.header__inner .logo .logo__img {
    display: flex;
    align-items: center;
    height: 100%;
}
.header__inner .logo .logo__img img {
	display: block;
    width: auto;
    height: 100%;
    max-height: 29px;
}
@media screen and (min-width: 768px) {
    .header {
        height: 70px;
    }
    .header__inner {
        padding: 0 30px;
    }
    .header__inner .logo .logo__img img {
        max-height: 32px;
    }
}
@media screen and (min-width: 1280px) {
   .header {
        height: 74px;
    }
    .header__inner {
        padding: 0 60px;
    }
    .header__inner .logo .logo__img img {
        max-height: 34px;
    }
}

.c-nav-menu a {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.c-nav-menu a .icon {
    width: 38px;
}
.c-nav-menu a .text {
    display: none;
}
@media screen and (min-width: 768px) {
    .c-nav-menu a .icon {
        width: 42px;
    }
}
@media screen and (min-width: 1280px) {
    .c-nav-menu a {
        width: 84px;
    }
    .c-nav-menu a::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        width: 1px;
        height: 40px;
        background: var(--color-bk);
        transform: translate(0, -50%);
        opacity: 0.5;
    }
    .c-nav-menu a .icon {
        width: 38px;
    }
    .c-nav-menu a .text {
        display: block;
        font-size: 0.75rem;
    }
}

.c-nav {
    display: flex;
    width: auto;
    margin-left: auto;
    margin-right: 20px;
}
.c-account__menu ul {
    display: flex;
}
.c-account__menu ul li a span.cart-count {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -1px;
    right: -5px;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    font-family: var(--font-en-03);
    font-size: var(--font-xxs);
    background: var(--color-bk);
    color: var(--color-wh);
}
@media screen and (min-width: 768px) {
    .c-nav {
        margin-right: 40px;
    }
    .c-account__menu ul li a span.cart-count {
        width: 20px;
        height: 20px;
    }
}
@media screen and (min-width: 1280px) {
    .c-nav__inner {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    .c-account__menu ul li a span.cart-count {
        right: auto;
        left: 50%;
        margin-left: 5px;
        width: 20px;
        height: 20px;
    }
}

.pc-nav {
    display: none;
}
@media screen and (min-width: 1280px) {
    .pc-nav {
        display: block;
    }
    .pc-nav__list {
        width: auto;
    }
    .pc-nav__list ul {
        display: flex;
        flex-direction: row;
    }
}

.menu-btn {
    z-index: 999999;
    position: relative;
    width: 40px;
    height: 40px;
	cursor: pointer;
}
/*@media screen and (min-width: 768px) {
    .menu-btn {
        height: 70px;
    }
}
@media screen and (min-width: 1024px) {
    .menu-btn {
        display: none;
    }
}*/
.menu-btn span {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    height: 1px;
    background: var(--color-bk);
    transform: translate(0, -50%);
    transition: .3s;
}
.menu-btn span:nth-of-type(1) {
    margin-top: -3px;
}
.menu-btn span:nth-of-type(2) {
    margin-top: 3px;
}
.menu-btn.active span:nth-of-type(1) {
    margin: 0;
    transform: translate(0,-50%) rotate(30deg);
	background: var(--color-wh);
}
.menu-btn.active span:nth-of-type(2) {
	width: 100%;
    margin: 0;
    transform: translate(0,-50%) rotate(-30deg);
	background: var(--color-wh);
}

/* g-nav
--------------------------------------------------- */

.g-nav {
    z-index: 999998;
	display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100svh;
    overflow-y: scroll;
    transition: .3s;
	background: var(--color-bl);
	opacity: 0;
	pointer-events: none;
}
.g-nav.open {
	display: block;
    opacity: 1;
	pointer-events: auto;
}
.g-nav__inner {
	z-index: 5;
	display: flex;
	flex-direction: column;
	gap: 40px;
	position: relative;
}
@media screen and (min-width: 768px) {
    .g-nav__inner {
        gap: 60px;
    }
}
@media screen and (min-width: 1024px) {
	.g-nav {
		width: calc(100vw + 10px);
		padding-right: 10px;
	}
    .g-nav__inner {
		flex-direction: row;
        gap: 0;
    }
}
.g-nav__bg {
    position: relative;
    width: 100%;
    height: 40vh;
    overflow: hidden;
}
.g-nav__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media screen and (min-width: 768px) {
    .g-nav__bg {
        height: 50vh;
    }
}
@media screen and (min-width: 1024px) {
    .g-nav__bg {
		position: fixed;
		top: 0;
		left: 0;
		width: calc(100vw - 630px);
        height: 100svh;
    }
}
@media screen and (min-width: 1401px) {
    .g-nav__bg {
		position: fixed;
		top: 0;
		left: 0;
		width: calc(100vw - 830px);
        height: 100svh;
    }
}

.g-nav__menu {
    position: relative;
    width: 100%;
    padding: 0 20px 60px;
}
@media screen and (min-width: 768px) {
    .g-nav__menu {
        padding: 0 60px 60px;
    }
}
@media screen and (min-width: 1024px) {
    .g-nav__menu {
		width: 100vw;
        height: 100svh;
		overflow-y: scroll;
		-ms-overflow-style: none;
		scrollbar-width: none;
		padding: 0 0 0 calc(100vw - 630px);
    }
	.g-nav__menu::-webkit-scrollbar {
		display: none;
	}
}
@media screen and (min-width: 1401px) {
	.g-nav__menu {
		padding: 0 0 0 calc(100vw - 830px);
    }
}

.g-nav__list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    position: relative;
	width: 100%;
}
@media screen and (min-width: 1024px) {
	.g-nav__list {
		gap: 60px;
		padding: 80px 60px;
	}
}
@media screen and (min-width: 1280px) {
	.g-nav__list {
		gap: 70px;
		padding: 120px 80px;
	}
}
.g-nav__item {
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
    width: 100%;
}
.g-nav__item h2,
.g-nav__item h2 a {
    width: 100%;
    color: var(--color-wh);
    font-family: var(--font-en-01);
    font-size: 1.8rem;
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
}
.g-nav__item h2 {
    padding-bottom: 5px;
    border-bottom: 1px solid var(--color-wh);
}
.g-nav__item h2 span,
.g-nav__item h2 a span {
    font-family: var(--font-jp);
    font-size: 0.95rem;
    font-weight: 400;
    letter-spacing: .1em;
    margin-left: 1em;
}
@media screen and (min-width: 1024px) {
	.g-nav__item h2,
	.g-nav__item h2 a {
		font-size: 2.2rem;
	}
}
@media screen and (min-width: 1280px) {
	.g-nav__item h2,
	.g-nav__item h2 a {
		font-size: 2.4rem;
	}
}

.g-nav__item ul.parent-categories {
    display: flex;
    flex-direction: column;
}
.g-nav__breed ul.parent-categories {
    gap: 30px;
    padding-top: 20px;
}
@media screen and (min-width: 768px) {
    .g-nav__breed ul.parent-categories {
        padding-top: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .g-nav__breed ul.parent-categories {
		gap: 70px;
        padding-top: 40px;
    }
}

.g-nav__item ul li {
    position: relative;
    width: 100%;
    line-height: 1;
}
.g-nav__item ul li.has-child > a {
    width: calc(100% - 65px);
}
.g-nav__item ul li.has-child .btn {
    z-index: 2;
    display: block;
    position: absolute;
    top: 10px;
    right: 3px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    background: #ddd;
}
@media screen and (min-width: 1024px) {
	.g-nav__item ul li.has-child .btn {
		top: 5px;
	}
}

.g-nav__item ul li.has-child .btn::before,
.g-nav__item ul li.has-child .btn::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background: var(--color-bk);
    transform: translate(-50%, -50%);
}
.g-nav__item ul li.has-child .btn::before {
    width: 10px;
    height: 1px;
}
.g-nav__item ul li.has-child .btn::after {
    width: 1px;
    height: 10px;
}
.g-nav__item ul li.has-child.open > .btn::after {
    display: none;
}

.g-nav__item ul.parent-categories > li a {
    color: var(--color-wh);
}
.g-nav__item ul.parent-categories > li .child-title {
    display: block;
    margin-bottom: 20px;
    text-align: center;
}
.g-nav__item ul.parent-categories > li .child-title .child-title__deco {
    z-index: 4;
    position: relative;
    width: 100%;
}
.g-nav__item ul.parent-categories > li .child-title .child-title__deco span {
    position: absolute;
    top: 0;
    width: calc(50% - 10px);
    height: 20px;
    border-top: 1px solid var(--color-bk);
}
.g-nav__item ul.parent-categories > li .child-title .child-title__deco span:nth-child(1) {
    left: 0;
}
.g-nav__item ul.parent-categories > li .child-title .child-title__deco span:nth-child(2) {
    right: 0;
}
.g-nav__item ul.parent-categories > li .child-title .child-title__deco span:nth-child(2)::before {
    content: "";
    position: absolute;
    top: -3px;
    left: -6px;
    width: 1px;
    height: 100%;
    background: var(--color-bk);
    transform: rotate(40deg);
}
.g-nav__item ul.parent-categories > li .child-title h3 {
    padding: 10px;
    color: var(--color-wh);
    font-size: var(--font-s);
    text-align: center;
    border: 1px solid var(--color-bk);
    border-bottom: 0;
}
@media screen and (min-width: 1024px) {
	.g-nav__item ul.parent-categories > li .child-title .child-title__deco span {
		border-top: 1px solid var(--color-wh);
	}
	.g-nav__item ul.parent-categories > li .child-title .child-title__deco span:nth-child(2)::before {
		background: var(--color-wh);
	}
	.g-nav__item ul.parent-categories > li .child-title h3 {
		padding: 15px;
		border: 1px solid var(--color-wh);
		border-bottom: 0;
	}
}


.g-nav__item ul.child {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.g-nav__breed ul.child {
    padding-top: 20px;
}
.g-nav__item ul.breed-size {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
}
.g-nav__item ul.breed-size li {
    width: calc(33.3333% - (30px / 3));
}
@media screen and (min-width: 768px) {
    .g-nav__item ul.breed-size {
        gap: 30px;
		max-width: 500px;
		margin: auto;
        padding-top: 25px;
    }
    .g-nav__item ul.breed-size li {
        width: calc(33.3333% - (60px / 3));
    }
}
.g-nav__item ul.breed-size li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-size: var(--font-s);
}
.g-nav__item ul.breed-size li a .image {
    width: 100%;
    aspect-ratio: 1/1;
    border-radius: 100%;
    overflow: hidden;
}
.g-nav__item ul.breed-size li a .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.g-nav__item ul.breed-group {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}
.g-nav__item ul.breed-group li {
    width: calc(50% - (10px / 2));
}
.g-nav__item ul.breed-group li:nth-child(5) {
    width: calc(55% - (10px / 2));
}
.g-nav__item ul.breed-group li:nth-child(6) {
    width: calc(45% - (10px / 2));
}
.g-nav__item ul.breed-group li:nth-child(7) {
    width: calc(55% - (10px / 2));
}
.g-nav__item ul.breed-group li:nth-child(8) {
    width: calc(45% - (10px / 2));
}
.g-nav__item ul.breed-group li a {
    padding: 5px;
    font-size: var(--font-xs);
    line-height: 1.4;
    border: 1px solid var(--color-wh);
}
@media screen and (min-width: 768px) {
    .g-nav__item ul.breed-group {
        gap: 15px;
        padding-top: 25px;
    }
    .g-nav__item ul.breed-group li {
        width: calc(50% - (15px / 2));
    }
    .g-nav__item ul.breed-group li:nth-child(5) {
        width: calc(50% - (15px / 2));
    }
    .g-nav__item ul.breed-group li:nth-child(6) {
        width: calc(50% - (15px / 2));
    }
    .g-nav__item ul.breed-group li:nth-child(7) {
        width: calc(50% - (15px / 2));
    }
    .g-nav__item ul.breed-group li:nth-child(8) {
        width: calc(50% - (15px / 2));
    }
    .g-nav__item ul.breed-group li a {
        padding: 10px;
        font-size: var(--font-s);
    }
}
@media screen and (min-width: 1024px) {
	.g-nav__item ul.breed-group li a {
		padding: 12px 18px;
		
		border: 1px solid var(--color-wh);
		transition: .3s;
	}
	.g-nav__item ul.breed-group li a:hover {
		background: var(--color-wgy);
		color: var(--color-bk);
	}
}

.g-nav__product > ul,
.g-nav__column > ul {
    display: flex;
    flex-direction: column;
}
@media screen and (min-width: 1024px) {
	.g-nav__product > ul,
	.g-nav__column > ul {
		gap: 5px;
	}
}
.g-nav__product > ul > li > a,
.g-nav__column > ul > li > a {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    padding: 5px 0;
    font-size: 1rem;
}
@media screen and (min-width: 1024px) {
	.g-nav__product > ul > li > a,
	.g-nav__column > ul > li > a {
		font-size: 1rem;
	}
}
.g-nav__product > ul > li > a::before,
.g-nav__column > ul > li > a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--color-wh);
    opacity: 0.2;
}
.g-nav__product > ul > li.has-child > a::before,
.g-nav__column > ul > li.has-child > a::before {
    width: calc(100% + 65px);
}

.g-nav__product > ul > li a span.icon,
.g-nav__column > ul > li a span.icon {
    width: 34px;
}
@media screen and (min-width: 1024px) {
	.g-nav__product > ul > li a span.icon,
	.g-nav__column > ul > li a span.icon {
		width: 30px;
	}
}
.g-nav__product .child,
.g-nav__column .child {
    display: none;
}
.g-nav__product .child ul,
.g-nav__column .child ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px 10px;
    width: 100%;
    padding: 25px 0 40px;
}
.g-nav__product .child ul li,
.g-nav__column .child ul li {
    width: auto;
}
.g-nav__product .child ul li a,
.g-nav__column .child ul li a {
    width: auto;
    padding: 6px 15px 7px;
    border: 1px solid var(--color-wh);
    color: var(--color-wh);
    border-radius: 20px;
    font-size: 0.9rem;
}

/* pickup slider
--------------------------------------------------- */

/* 選択されていないサムネイルは薄くする */
.thumbnail-carousel .splide__slide {
  opacity: .6;
}
/* 選択されているサムネイルだけ透過しない */
.thumbnail-carousel .splide__slide.is-active {
  opacity: 1;
}
/* 画像サイズ調整 */
.splide__slide img {
  height: auto;
  width: 100%;
}
/* スライダーの幅 */
.wrapper {
  width: 100%;
}

/* --------------------------------------------------
 footer
--------------------------------------------------- */

.footer p.copy {
    padding: 15px;
    font-family: var(--font-jp);
    font-size: var(--font-xs);
    text-align: center;
}

/* f-nav
--------------------------------------------------- */

.f-nav {
    position: relative;
    width: 100%;
    background: var(--color-bl);
}
.f-nav__inner {
	z-index: 5;
	display: flex;
	flex-direction: column;
	gap: 60px;
	position: relative;
	padding: 50px 20px 60px;
}
@media screen and (min-width: 768px) {
    .f-nav__inner {
        padding: 50px 40px 60px;
    }
}
@media screen and (min-width: 1401px) {
    .f-nav__inner {
        padding: 100px 40px 110px;
    }
}
.f-nav__menu {
    position: relative;
    width: 100%;
}
.f-nav__list {
    display: flex;
    flex-direction: column;
    gap: 50px;
    position: relative;
	width: 100%;
}
.f-nav__item {
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
    width: 100%;
}
@media screen and (min-width: 1280px) {
    .f-nav__list {
        flex-direction: row;
        gap: 60px;
    }
    .f-nav__list .f-nav__item:nth-child(1) {
        width: calc(27% - (120px / 3));
    }
    .f-nav__list .f-nav__item:nth-child(2) {
        width: calc(27% - (120px / 3));
    }
    .f-nav__list .f-nav__item:nth-child(3) {
        width: calc(46% - (120px / 3));
    }
}
@media screen and (min-width: 1401px) {
    .f-nav__list {
        gap: 80px;
    }
    .f-nav__list .f-nav__item:nth-child(1) {
        width: calc(31% - (160px / 3));
    }
    .f-nav__list .f-nav__item:nth-child(2) {
        width: calc(31% - (160px / 3));
    }
    .f-nav__list .f-nav__item:nth-child(3) {
        width: calc(38% - (160px / 3));
    }
}


.f-nav__item h2,
.f-nav__item h2 a {
    width: 100%;
    color: var(--color-wh);
    font-family: var(--font-en-01);
    font-size: var(--font-xxl);
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
}
.f-nav__item h2 {
    padding-bottom: 5px;
    border-bottom: 1px solid var(--color-wh);
}
.f-nav__item h2 span,
.f-nav__item h2 a span {
    font-family: var(--font-jp);
    font-size: var(--font-m);
    font-weight: 400;
    letter-spacing: .1em;
    margin-left: 1em;
}
@media screen and (min-width: 1280px) {
    .f-nav__item h2,
    .f-nav__item h2 a {
        font-size: var(--font-xl);
    }
    .f-nav__item h2 span,
    .f-nav__item h2 a span {
        font-size: var(--font-s);
    }
}


.f-nav__item ul.parent-categories {
    display: flex;
    flex-direction: column;
}
.f-nav__breed ul.parent-categories {
    gap: 30px;
}
@media screen and (min-width: 768px) {
    .f-nav__breed ul.parent-categories {
        padding-top: 20px;
    }
}

.f-nav__item ul li {
    position: relative;
    width: 100%;
    line-height: 1;
}
.f-nav__item ul li.has-child > a {
    width: calc(100% - 65px);
}
.f-nav__item ul li.has-child .btn {
    z-index: 2;
    display: block;
    position: absolute;
    top: 10px;
    right: 3px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    background: #ddd;
}
@media screen and (min-width: 768px) {
    .f-nav__item ul li.has-child .btn {
        top: 12px;
        width: 26px;
        height: 26px;
    }
}
.f-nav__item ul li.has-child .btn::before,
.f-nav__item ul li.has-child .btn::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background: var(--color-bk);
    transform: translate(-50%, -50%);
}
.f-nav__item ul li.has-child .btn::before {
    width: 10px;
    height: 1px;
}
.f-nav__item ul li.has-child .btn::after {
    width: 1px;
    height: 10px;
}
.f-nav__item ul li.has-child.open > .btn::after {
    display: none;
}

.f-nav__item ul.parent-categories > li a {
    color: var(--color-wh);
}
.f-nav__item ul.parent-categories > li .child-title {
    display: block;
    padding: 6px 8px 8px;
    border-radius: 4px;
    background: var(--color-lwgy);
    color: var(--color-bk);
    font-size: var(--font-s);
    text-align: center;
}
.f-nav__item ul.child {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.f-nav__breed ul.child {
    padding-top: 15px;
}
.f-nav__item ul.breed-size {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}
.f-nav__item ul.breed-size li {
    width: calc(33.3333% - (20px / 3));
}
.f-nav__item ul.breed-size li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-size: var(--font-xs);
}
.f-nav__item ul.breed-size li a .image {
    width: 100%;
    aspect-ratio: 1/1;
    overflow: hidden;
}
.f-nav__item ul.breed-size li a .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .5s;
}
.f-nav__item ul.breed-size li a:hover .image img {
    transform: scale(1.1);
}

@media screen and (min-width: 768px) {
    .f-nav__item ul.breed-size {
        gap: 15px;
        padding-top: 25px;
    }
    .f-nav__item ul.breed-size li {
        width: calc(33.3333% - (30px / 3));
    }
}
.f-nav__item ul.breed-group {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}
.f-nav__item ul.breed-group li {
    width: calc(50% - (10px / 2));
}
.f-nav__item ul.breed-group li:nth-child(5) {
    width: calc(55% - (10px / 2));
}
.f-nav__item ul.breed-group li:nth-child(6) {
    width: calc(45% - (10px / 2));
}
.f-nav__item ul.breed-group li:nth-child(7) {
    width: calc(55% - (10px / 2));
}
.f-nav__item ul.breed-group li:nth-child(8) {
    width: calc(45% - (10px / 2));
}
.f-nav__item ul.breed-group li a {
    padding: 5px;
    font-size: var(--font-xs);
    line-height: 1.4;
    border: 1px solid var(--color-wh);
    transition: .2s;
}
.f-nav__item ul.breed-group li a:hover {
    background: var(--color-wgy);
    color: var(--color-bk);
}

@media screen and (min-width: 768px) {
    .f-nav__item ul.breed-group {
        gap: 15px;
        padding-top: 25px;
    }
    .f-nav__item ul.breed-group li {
        width: calc(50% - (15px / 2));
    }
    .f-nav__item ul.breed-group li:nth-child(5) {
        width: calc(50% - (15px / 2));
    }
    .f-nav__item ul.breed-group li:nth-child(6) {
        width: calc(50% - (15px / 2));
    }
    .f-nav__item ul.breed-group li:nth-child(7) {
        width: calc(50% - (15px / 2));
    }
    .f-nav__item ul.breed-group li:nth-child(8) {
        width: calc(50% - (15px / 2));
    }
    .f-nav__item ul.breed-group li a {
        padding: 10px;
    }
}

.f-nav__product > ul,
.f-nav__column > ul {
    display: flex;
    flex-direction: column;
}
.f-nav__product > ul > li > a,
.f-nav__column > ul > li > a {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    padding: 5px 0;
    font-size: var(--font-ml);
}
@media screen and (min-width: 768px) {
    .f-nav__product > ul > li > a,
    .f-nav__column > ul > li > a {
        padding: 10px 0;
    }
}
.f-nav__product > ul > li > a::before,
.f-nav__column > ul > li > a::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--color-wh);
    opacity: 0.2;
}
.f-nav__product > ul > li.has-child > a::before,
.f-nav__column > ul > li.has-child > a::before {
    width: calc(100% + 65px);
}

.f-nav__product > ul > li a span.icon,
.f-nav__column > ul > li a span.icon {
    width: 34px;
}
.f-nav__product .child,
.f-nav__column .child {
    display: none;
}
.f-nav__product .child ul,
.f-nav__column .child ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px 10px;
    width: 100%;
    padding: 25px 0 40px;
}
.f-nav__product .child ul li,
.f-nav__column .child ul li {
    width: auto;
}
.f-nav__product .child ul li a,
.f-nav__column .child ul li a {
    width: auto;
    padding: 6px 15px 7px;
    border: 1px solid var(--color-wh);
    color: var(--color-wh);
    border-radius: 20px;
    font-size: var(--font-s);
}

/* --------------------------------------------------
 top page
--------------------------------------------------- */

/* common
--------------------------------------------------- */

.c-title {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
	align-items: flex-end;
    gap: 3px 8px;
}
.c-title.contact-title {
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

@media screen and (min-width: 1024px) {
    .c-title {
        gap: 5px 15px;
    }
}
@media screen and (min-width: 1280px) {
    .c-title {
        flex-direction: row;
        align-items: flex-end;
    }
}

.title__main {
    font-family: var(--font-en-01);
    font-size: var(--font-xxl);
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
    line-height: 1.5;
}
.title__sub {
    margin-bottom: 8px;
    font-family: var(--font-jp);
    font-size: var(--font-xs);
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
    line-height: 1.5;
}
.c-title.contact-title .title__main {
	font-family: var(--font-en-02);
}
@media screen and (min-width: 1024px) {
    .title__sub {
        margin-bottom: 12px;
    }
}
@media screen and (min-width: 1280px) {
    .title__sub {
        font-size: var(--font-m);
        margin-bottom: 15px;
    }
}

.effect-link {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    height: 1em;
    overflow: hidden;
}
.effect-link:hover .effect-link__text {
    transform: translateY(-50%);
}
.effect-link__text {
    display: block;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.1428571429;
    letter-spacing: 0;
    color: var(--color-bk);
    transition: transform 0.3s;
}

.arrow-link {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}
.arrow-link__text {
    font-family: var(--font-en-02);
    font-size: 1rem;
    letter-spacing: normal;
}
.arrow-link .arrow-link__icon {
    width: 20px;
}


/* mv
--------------------------------------------------- */

.mv {
    width: 100%;
    height: 100vh;
    position: relative;
}
.mv__inner {
    width: 100%;
    padding: 0 30px;
}
@media screen and (min-width: 768px) {
    
}
.mv-title {
    z-index: 1;
    position: absolute;
    bottom: 140px;
    left: 0;
}
.mv-title p,
.mv-title h2 {
    display: block;
}
.mv-title p span.mv-title__main {
    display: inline-block;
    padding: 8px 20px;
    color: var(--color-wh);
    font-family: var(--font-en-01);
    font-size: 2.8rem;
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
    line-height: 1.2;
}
.mv-title h2 span.mv-title__sub {
    display: inline-block;
	width: 260px;
    margin-top: 10px;
	padding: 12px 20px;
	background-color: var(--color-wgy);
}
.mv-title h2 span.mv-title__sub img {
	width: 100%;
}
@media screen and (min-width: 768px) {
    .mv-title p span.mv-title__main {
        padding: 8px 60px;
        color: var(--color-bk);
        font-size: 5rem;
    }
    .mv-title h2 span.mv-title__sub {
        width: 320px;
        margin-top: 20px;
        margin-left: 60px;
        padding: 20px;
        background-color: var(--color-wh);
    }
}
@media screen and (min-width: 1024px) {
    .mv-title {
        bottom: 90px;
    }
}
@media screen and (min-width: 1280px) {
    .mv-title p span.mv-title__main {
        padding: 8px 60px;
        font-size: 7rem;
    }
}
@media screen and (min-width: 1401px) {
    .mv-title p span.mv-title__main {
        padding: 8px 90px;
        font-size: 8.5rem;
    }
    .mv-title h2 span.mv-title__sub {
        width: 350px;
        margin-left: 90px;
    }
}

/*@media screen and (min-width: 768px) {
    .mv-title {
		display: flex;
		flex-direction: column;
		align-items: center;
        top: 70%;
        bottom: auto;
		left: 50%;
		padding-bottom: 2rem;
		transform: translate(-50%, -50%);
	}
    .mv-title p span.mv-title__main {
        padding: 0;
		background-color: transparent;
        background-color: initial;
        color: var(--color-bk);
        font-size: 4rem;
        white-space: nowrap;
    }
	.mv-title h2 span.mv-title__sub {
		width: 330px;
		margin-top: 15px;
		background-color: var(--color-wh);
		border-radius: 30px;
    }
}
@media screen and (min-width: 1024px) {
    .mv-title {
	}
    .mv-title p span.mv-title__main {
		font-size: 5rem;
	}
	.mv-title h2 span.mv-title__sub {
		width: 340px;
	}
}
@media screen and (min-width: 1280px) {
    .mv-title p span.mv-title__main {
		font-size: 6rem;
	}
	.mv-title h2 span.mv-title__sub {
		width: 360px;
		padding: 12px 25px;
	}
}
@media screen and (min-width: 1401px) {
    .mv-title {
        padding-right: 10px;
        padding-left: 10px;
    }
    .mv-title p span.mv-title__main {
		font-size: 8rem;
	}
	.mv-title h2 span.mv-title__sub {
		width: 380px;
	}
}*/

.mv__splide.splide {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 95vh;
    margin-top: 0;
}
@media screen and (min-width: 768px) {
    .mv__splide.splide {
        top: 0;
        right: 0;
        left: auto;
        left: initial;
        width: 80vw;
        height: calc(100vh - 80px);
        margin: 0 calc(50% - 50vw);
    }
}
@media screen and (min-width: 1024px) {
    .mv__splide.splide {
        height: calc(100vh - 40px);
    }
}
@media screen and (min-width: 1401px) {
    .mv__splide.splide {
		width: 70vw;
    }
}
.splide__track {
    width: 100%;
    height: 100%;
}
.mv__splide > .splide__track > .splide__list > .splide__slide img {
    -webkit-transition: 8s ease-out;
    transition: 8s ease-out;
}
.mv__splide > .splide__track > .splide__list > .splide__slide.is-active img {
    -webkit-transform: scale(1.15);
    -webkit-transition-delay: 0s;
    transform: scale(1.15);
    transition-delay: 0s;
}
.splide__slide {
    width: 100%;
    height: 100%;
}
.mv-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

/* about
--------------------------------------------------- */

.about {
	z-index: 1;
	position: relative;
	width: 100%;
}
.about-bg {
	z-index: 2;
	position: absolute;
	top: -110px;
	left: 0;
    right: 0;
	width: 100vw;
	margin: 0 calc(50% - 50vw);
	overflow: hidden;
}
.about-bg ul {
	display: flex;
    width: 100%;
	gap: 20px;
}
.about-bg ul li {
	flex: 0 0 auto;
    padding-left: 0.5em;
	font-family: var(--font-en-01);
	font-size: 6rem;
	font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
	color: var(--color-wh);
}
.about-bg ul li:nth-child(odd) {
    -webkit-animation: loop 140s -70s linear infinite;
    animation: loop 140s -70s linear infinite;
}
.about-bg ul li:nth-child(even) {
    -webkit-animation: loop2 140s linear infinite;
    animation: loop2 140s linear infinite;
}
@-webkit-keyframes loop {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    to {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}
@keyframes loop {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    to {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}
@-webkit-keyframes loop2 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-200%);
        transform: translateX(-200%);
    }
}
@keyframes loop2 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-200%);
        transform: translateX(-200%);
    }
}
@media screen and (min-width: 768px) {
    .about-bg {
		top: -120px;
	}
    .about-bg ul li {
        font-size: 9rem;
    }
}
@media screen and (min-width: 1024px) {
    .about-bg {
		top: -80px;
	}
}


.about__inner {
	z-index: 3;
	position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 60px 20px 0;
}
@media screen and (min-width: 768px) {
	.about__inner {
		display: flex;
		justify-content: center;
		padding: 140px 40px 30px;
	}
}
@media screen and (min-width: 1024px) {
	.about__inner {
        padding: 180px 40px 60px;
    }
}

.about-image {
	width: 100%;
    aspect-ratio: 335/220;
}
.about-image img {
    width: 100%;
    height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}
@media screen and (min-width: 768px) {
    .about-image {
		width: 38%;
		height: 22.25rem;
		overflow: hidden;
	}
}
@media screen and (min-width: 1024px) {
    .about-image {
		width: 32%;
		height: 30rem;
	}
}
@media screen and (min-width: 1280px) {
    .about-image {
		width: 38%;
		height: 32rem;
	}
}
@media screen and (min-width: 1401px) {
    .about-image {
		width: 40%;
		height: 36rem;
	}
}

.about-contents {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
@media screen and (min-width: 768px) {
    .about-contents {
		width: 62%;
		justify-content: space-between;
		padding: 0 5px 0 45px;
    }
}
@media screen and (min-width: 1024px) {
    .about-contents {
		width: 68%;
		padding: 0 15px 0 70px;
    }
}
@media screen and (min-width: 1280px) {
    .about-contents {
		width: 62%;
		padding: 0 15px 0 100px;
    }
}
@media screen and (min-width: 1401px) {
    .about-contents {
		width: 60%;
		padding: 0 40px 0 130px;
    }
}

@media screen and (min-width: 1401px) {
    .about-title {
        padding-top: 40px;
    }
}

.about-text {
	display: flex;
	flex-direction: column;
	gap: 30px;
    padding-top: 10px;
}
@media screen and (min-width: 768px) {
	.about-text {
		gap: 2rem;
	}
}
@media screen and (min-width: 1280px) {
	.about-text {
        margin-top: 10px;
		gap: 2.5rem;
	}
}
.about-text__head {
	z-index: 1;
	display: flex;
	flex-direction: column;
	position: relative;
	gap: 8px;
}
.about-text__head p {
	z-index: 3;
	display: inline-block;
	position: relative;
	width: fit-content;
	padding: 8px 10px;
    font-size: var(--font-l);
    line-height: 1.5;
	letter-spacing: 0.05em;
	color: var(--color-wh);
}
.about-text__head p::before {
    z-index: -1;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: var(--color-bl);
    transition: 1s;
}
.about-text__head.inview p::before {
    width: 100%;
}

.about-text__desc {
    line-height: 1.8;
	color: var(--color-bk);
	text-align: justify;
	word-break: break-all;
}
.about-text__desc p {
    padding-top: 20px;
    letter-spacing: normal;
}
.about-text__desc p:nth-of-type(1) {
    padding-top: 0;
}
@media screen and (min-width: 1024px) {
    .about-text__desc {
        line-height: 2;
    }
    .about-text__desc p {
        font-size: var(--font-xs);
    }
}


/* shop
--------------------------------------------------- */

.shop {
    z-index: 1;
    position: relative;
    width: 100%;
    padding: 50px 20px 30px;
}
@media screen and (min-width: 768px) {
	.shop {
		padding: 30px 40px;
	}
}
@media screen and (min-width: 1280px) {
	.shop__inner {
        padding: 20px 40px 40px;
	}
}
@media screen and (min-width: 1401px) {
	.shop__inner {
        padding: 40px 40px 70px;
    }
}
.shop__inner ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
@media screen and (min-width: 768px) {
	.shop__inner ul {
		gap: 30px;
	}
}
@media screen and (min-width: 1024px) {
	.shop__inner ul {
		gap: 40px;
	}
}
@media screen and (min-width: 1280px) {
	.shop__inner ul {
		gap: 60px;
	}
}
.shop__inner ul li {
    width: 100%;
}
.shop__inner ul li a {
	z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
	position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    font-size: 1.05rem;
	font-weight: 700;
    letter-spacing: .05em;
	border-radius: 5px;
	overflow: hidden;
}
@media screen and (min-width: 768px) {
    .shop__inner ul li {
		width: calc(50% - (30px / 2));
	}
}
@media screen and (min-width: 1024px) {
	.shop__inner ul li {
		width: calc(50% - (40px / 2));
	}
	.shop__inner ul li a {
		aspect-ratio: 7 / 3;
	}
}
@media screen and (min-width: 1280px) {
	.shop__inner ul li {
		width: calc(50% - (60px / 2));
	}
	.shop__inner ul li a {
		aspect-ratio: 7 / 3;
	}
}
.shop__inner ul li a::before {
	z-index: 3;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--color-bk);
	opacity: 0.4;
}
.shop__inner ul li a .shop__text {
	z-index: 4;
	position: relative;
	color: var(--color-wh);
}
.shop__inner ul li a .shop__image {
	z-index: 2;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: translate(-50%, -50%);
}


/* news
--------------------------------------------------- */

.news {
    z-index: 1;
    position: relative;
    width: 100%;
    padding: 50px 20px 30px;
}
.news__inner {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
@media screen and (min-width: 768px) {
	.news {
		padding: 30px 40px;
	}
}
@media screen and (min-width: 1280px) {
	.news__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: 40px;
        padding: 20px 40px 40px;
	}
	.news__inner .news-title {
		width: 200px;
		padding-top: 15px;
	}
}
@media screen and (min-width: 1401px) {
	.news__inner {
        padding: 40px 40px 70px;
    }
}
.news-list {
	padding: 20px;
	background: var(--color-wh);
	border-radius: 6px;
}
.news-list ul li {
	padding: 15px 0;
	border-bottom: 1px solid var(--color-gy);
}
.news-list ul li:nth-last-child(1) {
	border-bottom: 0;
}
.news-list ul li a {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.news-list ul li a span.post-date {
	font-family: var(--font-en-02);
	font-size: 1.1rem;
}
@media screen and (min-width: 768px) {
	.news-list {
		padding: 20px 40px;
	}
	.news-list ul li a {
		flex-direction: row;
		align-items: flex-start;
		gap: 25px;
	}
	.news-list ul li a span.post-title {
		padding-top: 2px;
	}
}
@media screen and (min-width: 1280px) {
	.news-list {
		width: calc(100% - 240px);
	}
}


/* ranking
--------------------------------------------------- */

.ranking__inner {
    padding: 40px 20px 60px;
}
@media screen and (min-width: 768px) {
    .ranking__inner {
        padding: 60px 40px 80px;
    }
}
@media screen and (min-width: 1024px) {
    .ranking__inner {
        padding: 80px 40px 100px;
    }
}
@media screen and (min-width: 1280px) {
    .ranking__inner {
        padding: 100px 40px 120px;
    }
}


.ranking-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
    width: 100%;
    margin-top: 30px;
}
.ranking-list ul li {
    width: 100%;
}
@media screen and (min-width: 768px) {
	.ranking-list ul {
		gap: 20px;
	}
    .ranking-list ul li {
        width: calc(33.3333% - (40px / 3));
    }
}
@media screen and (min-width: 768px) {
	.ranking-list ul {
		gap: 30px;
	}
    .ranking-list ul li {
        width: calc(33.3333% - (60px / 3));
    }
}
@media screen and (min-width: 1280px) {
	.ranking-list ul {
		gap: 50px;
	}
    .ranking-list ul li {
        width: calc(33.3333% - (100px / 3));
    }
}

.ranking-image {
    z-index: 1;
    position: relative;
    width: 100%;
    padding: 25px;
    background: var(--color-wh);
}
.ranking-image__title {
    z-index: 3;
    position: absolute;
    top: 25px;
    left: 22px;
    transform: rotate(90deg);
    transform-origin: left bottom;
    font-family: var(--font-en-01);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .1em;
    color: var(--color-wh);
    opacity: 0.8;
}
.ranking-image img {
    width: 100%;
    height: 100%;
    transition: transform 0.6s ease;
}
@media screen and (min-width: 768px) {
    .ranking-image {
        padding: 13px;
        overflow: hidden;
    }
	.ranking-image__title {
		top: 5px;
		left: 10px;
		font-size: 1.3rem;
	}
    .ranking-image:hover img {
        transform: scale(1.04);
    }
}
@media screen and (min-width: 1280px) {
    .ranking-image {
        padding: 20px;
    }
	.ranking-image__title {
		top: 15px;
		left: 15px;
		font-size: 2.2rem;
	}
}

.ranking-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 18px;
}
.ranking-name {
    margin-right: auto;
    color: var(--color-bk);
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0.1em;
}
.ranking-text {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
}

/*
.ranking-text .btn__text {
    font-family: var(--font-jp);
}
.ranking-text .btn__text span::before {
    content: "＃";
    padding-right: 3px;
	color: var(--color-dgy);
}*/

/* popular
--------------------------------------------------- */

.popular {
    background-color: var(--color-wh);
}
.popular__inner {
    padding: 50px 20px;
}
@media screen and (min-width: 768px) {
    .popular__inner {
        padding: 70px 40px;
    }
}

/* slider common
--------------------------------------------------- */

.popular__splide {
    position: relative;
    width: 100%;
    margin-top: 50px;
}
@media screen and (min-width: 768px) {
    .popular__splide {
        margin-top: 5rem;
    }
}
.popular__splide .splide__wrapper {
    height: 100%;
}
.popular__splide .splide__wrapper .splide__slide {
    opacity: 1;
}
.popular__splide .splide__wrapper .splide__slide.is-active {
    opacity: 1;
}
.popular__splide .splide__track {
    overflow: visible;
}
.popular__splide .splide__controller {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
    height: auto;
    margin-top: 40px;
}
@media screen and (min-width: 768px) {
    .popular__splide .splide__controller {
        position: absolute;
        top: -160px;
        right: 0rem;
        width: 100px;
    }
}
@media screen and (min-width: 1024px) {
    .popular__splide .splide__controller {
        position: absolute;
        top: -165px;
        right: 0rem;
        width: 120px;
    }
}
.popular__splide .splide__controller .splide__arrows {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: static;
    position: initial;
    gap: 6px;
    top: auto;
    top: initial;
    right: auto;
    right: initial;
    bottom: auto;
    bottom: initial;
    left: auto;
    left: initial;
}
.popular__splide .splide__controller .splide__arrow {
    width: 34px;
    height: 34px;
    opacity: 1;
    background: var(--color-wh);
    transform: translateY(0);
}
@media screen and (min-width: 1024px) {
    .popular__splide .splide__controller .splide__arrow {
        width: 40px;
        height: 40px;
    }
}
.popular__splide .splide__controller .splide__arrow img {
    width: 100%;
    height: 100%;
}
.popular__splide .splide__controller .splide__arrow--prev {
    position: static;
    position: initial;
    left: auto;
    left: initial;
}
.popular__splide .splide__controller .splide__arrow--next {
    position: static;
    position: initial;
    right: auto;
    right: initial;
}

/* card
--------------------------------------------------- */

.card a {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.card__flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.card__category {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.1428571429;
    letter-spacing: 0.1em;
    color: var(--color-bk);
}
.card__category--white {
    color: var(--color-wh);
}
.card__date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    gap: 0.5rem;
    font-family: var(--font-en-02);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.1428571429;
    letter-spacing: 0.1em;
    color: var(--color-bk);
}
.card__date--white {
    color: var(--color-wh);
}
.card__date::before {
    content: "";
    display: block;
    width: 8px;
    width: 0.5rem;
    height: 8px;
    height: 0.5rem;
    background-color: var(--color-theme-01);
    border-radius: 50%;
}
.card__date--white::before {
    background-color: var(--color-wgy);
}
.card__image {
    width: 100%;
    height: 100%;
    cursor: pointer;
    overflow: hidden;
    aspect-ratio: 300/200;
}
.card__image img {
    width: 100%;
    height: 100%;
	object-fit: cover;
    transition: transform 0.6s ease;
}
@media screen and (min-width: 768px) {
    .card a:hover .card__image img {
		transform: scale(1.1);
    }
}
.card__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.75;
    color: var(--color-bk);
    overflow: hidden;
    text-align: justify;
}
.card__title--white {
    color: var(--color-wh);
}
.card__detail {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 0.7rem;
    font-weight: 400;
    line-height: 2;
    color: var(--color-bk);
    overflow: hidden;
    text-align: justify;
}
.card__detail--white {
    color: var(--color-wh);
}

/* latest
--------------------------------------------------- */

.latest__inner {
	padding: 50px 20px;
}
@media screen and (min-width: 768px) {
    .latest__inner {
        padding: 80px 40px;
    }
}

.latest-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%;
    margin-top: 30px;
}
.latest-list .latest-list__item {
    display: flex;
    flex-wrap: wrap;
	gap: 0;
    width: 100%;
}
.latest-list .latest-list__item a {
	display: flex;
    flex-wrap: wrap;
    width: 100%;
	gap: 0;
    position: relative;
}
.latest-list .latest-list__item a::before {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: calc(100% - 105px);
	height: 1px;
	background: var(--color-dgy);
	opacity: 0.4;
}
.latest-list .latest-list__item a .latest-image {
	width: 90px;
	aspect-ratio: 1 / 1;
}
.latest-list .latest-list__item a .latest-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.latest-list .latest-list__item a .latest-text {
	position: relative;
	display: flex;
	flex-direction: column;
	width: calc(100% - 90px);
	padding: 0 0 0 15px;
}
.latest-list .latest-list__item a .latest-title {
	padding-top: 3px;
	font-family: var(--font-jp);
	font-size: var(--font-s);
	font-weight: 500;
	line-height: 1.4;
	text-align: justify;
}
.latest-list .latest-list__item a .latest-date {
    font-family: var(--font-en-02);
	font-size: var(--font-xs);
	margin-top: auto;
}
.latest-list .latest-list__item a .pc-date {
    display: none;
}

@media screen and (min-width: 768px) {
	.latest-list {
		margin-top: 60px;
	}
    .latest-list .latest-list__item a::before {
        width: calc(100% - 160px);
    }
    .latest-list .latest-list__item a .latest-image {
		width: 140px;
	}
	.latest-list .latest-list__item a .latest-text {
		width: calc(100% - 140px);
		padding: 15px 5px 10px 25px;
	}
	.latest-list .latest-list__item a .latest-title {
		padding-top: 8px;
		font-size: 1rem;
		font-weight: 700;
	}
	.latest-list .latest-list__item a .latest-detail {
		margin-top: 8px;
		font-size: 0.7rem;
		text-align: justify;
		word-break: break-all;
		color: var(--color-bgy);
	}
	.latest-list .latest-list__item a .latest-date {
		font-size: 0.75rem;
	}
}
@media screen and (min-width: 1024px) {
	.latest-list {
		gap: 40px;
	}
	.latest-list .latest-list__item {
		width: calc(25% - (40px * 3) / 4);
	}
	.latest-list .latest-list__item a {
		flex-direction: column;
	}
	.latest-list .latest-list__item a .latest-image {
		width: 100%;
		aspect-ratio: 8 / 5;
	}
	.latest-list .latest-list__item a .latest-text {
		width: 100%;
		padding: 15px 0 0;
	}
	.latest-list .latest-list__item a::before {
		left: 0;
		width: 100%;
	}
	.latest-list .latest-list__item a .latest-title {
		line-height: 1.6;
	}
	.latest-list .latest-list__item a .latest-date {
		padding: 10px 0 15px;
	}
    .latest-list .latest-list__item a .sp-date {
        display: none;
    }
    .latest-list .latest-list__item a .pc-date {
        display: block;
    }
}


/* category
--------------------------------------------------- */

.category {
    background: url("assets/images/category-bg.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: left;
}
.category__inner {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 50px 20px;
}
@media screen and (min-width: 768px) {
    .category__inner {
        gap: 50px;
        padding: 70px 40px;
    }
}
@media screen and (min-width: 1024px) {
    .category__inner {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        padding: 80px 40px;
    }
}
@media screen and (min-width: 1401px) {
    .category__inner {
        flex-direction: row;
    }
}

.category-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
	color: var(--color-wh);
}
@media screen and (min-width: 768px) {
    .category-title {
		flex-direction: row;
        align-items: flex-end;
        gap: 12px;
    }
}
@media screen and (min-width: 1401px) {
    .category-title {
		flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        width: 480px;
    }
}
.category-list {
    display: flex;
    flex-direction: column;
    gap: 40px;
	width: 100%;
}
.category-list__item {
    width: 100%;
}
.category-list__item h3 {
    color: var(--color-wh);
    font-family: var(--font-en-02);
    font-size: var(--font-xl);
    font-weight: 400;
    border-bottom: 1px solid var(--color-wh);
}
.category-list__item h3 span {
    margin-left: 0.5em;
    font-family: var(--font-jp);
    font-size: var(--font-xs);
}
@media screen and (min-width: 768px) {
    .category-list__item h3 span {
        margin-left: 0.8em;
        font-size: var(--font-s);
    }
}
@media screen and (min-width: 1024px) {
    .category-list {
        gap: 60px;
    }
}
@media screen and (min-width: 1401px) {
    .category-list {
        width: 750px;
        margin-left: auto;
    }
    .category-list__item h3 {
        padding-bottom: 10px;
    }
}
.category-list__item ul {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 10px;
    width: 100%;
    padding-top: 20px;
}
.category-list__item ul li {
    width: calc(50% - (10px / 2));
}
.category-list__item ul li a {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--font-s);
    line-height: 1;
    letter-spacing: 0;
	color: var(--color-wh);
	transition: .2s;
}
.category-list__item ul li a:hover {
    background-color: var(--color-theme-01);
    border: 1px solid var(--color-theme-01);
    opacity: 1;
}
.category-list__item ul li a span.icon {
    width: 28px;
}
.category-list__item ul li a span.text {
    width: calc(100% - 28px);
}
.category-list__item ul li a span.text span {
    display: none;
}
@media screen and (min-width: 768px) {
    .category-list__item ul li {
        width: calc(33.3333% - (20px / 3));
    }
    .category-list__item ul li a {
        font-size: var(--font-m);
    }
    .category-list__item ul li a span.icon {
        width: 32px;
    }
    .category-list__item ul li a span.text {
        width: calc(100% - 32px);
    }
    .category-list__item ul li a span.text span {
        display: inline;
    }
}
@media screen and (min-width: 1024px) {
    .category-list__item ul {
        gap: 14px 10px;
        padding-top: 40px;
    }
    .category-list__item ul li {
        width: calc(25% - (30px / 4));
    }
    .category-list__item ul li a span.icon {
        width: 36px;
    }
    .category-list__item ul li a span.text {
        width: calc(100% - 36px);
    }
}
@media screen and (min-width: 1401px) {
    .category-list__item ul {
        gap: 14px 10px;
        padding-top: 40px;
    }
    .category-list__item ul li {
        width: calc(25% - (30px / 4));
    }
    .category-list .category-list__item:nth-child(2) ul li {
        width: calc(25% - (30px / 4));
    }
    .category-list__item ul li a span.icon {
        width: 38px;
    }
    .category-list__item ul li a span.text {
        width: calc(100% - 38px);
        padding-left: 5px;
    }
}

/* contact
--------------------------------------------------- */

.contact {
    padding: 80px 20px;
}
.contact__inner {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 24px;
	border: 1px solid var(--color-bk);
}
.contact__box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
	position: relative;
    padding: 64px 0;
	transition: 1s;
}
.contact__box:hover {
	background: var(--color-dgy);
	color: var(--color-wh);
}
.contact__box::before,
.contact__box::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 1px;
	background: var(--color-bk);
	transition: 1s;
}
.contact__box::before {
	top: 0;
	left: 0;
}
.contact__box::after {
	bottom: 0;
	right: 0;
}
.contact__box:hover::before,
.contact__box:hover::after {
	content: "";
	width: 0;
}

.contact__link {
	padding: 10px 20px;
	border-bottom: 1px solid var(--color-wh);
}
@media screen and (min-width: 768px) {
    .contact {
        padding: 80px 40px;
    }
	.contact__link .btn .btn__text {
		font-size: 1rem;
	}
}

@media screen and (min-width: 1024px) {
    .contact__inner {
        max-width: 50rem;
    }
	.contact__box {
		padding: 100px 0;
	}
}

/* --------------------------------------------------
 page - common
--------------------------------------------------- */

.page-head {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.page-head p {
    font-family: var(--font-en-01);
    font-size: 1.8rem;
    text-indent: .05em;
}
.page-head h1 {
    font-family: var(--font-jp);
    font-size: var(--font-s);
    font-weight: 400;
    text-indent: .05em;
}
@media screen and (min-width: 768px) {
    .page-head p {
        font-size: 2.3rem;
    }
}
@media screen and (min-width: 1024px) {
    .page-head p {
        font-size: 2.6rem;
    }
}
@media screen and (min-width: 1280px) {
    .page-head p {
        font-size: 3rem;
    }
}

/* --------------------------------------------------
 page - contact
--------------------------------------------------- */

.page-contact {
    position: relative;
    width: 100%;
}
.page-contact__inner {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    padding: 30px 0;
}
@media screen and (min-width: 768px) {
    .page-contact__inner {
        gap: 30px;
        padding: 60px 0;
    }
}
@media screen and (min-width: 1024px) {
    .page-contact__inner {
        gap: 30px;
        padding: 90px 0;
    }
}
@media screen and (min-width: 1280px) {
    .page-contact__inner {
        gap: 30px;
        padding: 120px 0 90px;
    }
}

.form {
	position: relative;
    width: 100%;
}
.form-wrap {
    position: relative;
    width: 100%;
}
.form-desc {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.form-item {
	position: relative;
	width: 100%;
    padding: 0 20px;
}
.form-item a {
	display: inline;
	text-decoration: underline;
}
.form-item .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}
.form-item input[type="text"],
.form-item input[type="tel"],
.form-item input[type="email"],
.form-item input[type="url"],
.form-item input[type="number"],
.form-item select,
.form-item textarea {
    display: block;
    width: 100%;
    padding: .6em 0.6em;
	font-size: 0.95rem;
	color: var(--color-bk);
	background: var(--color-wh);
	border: 1px solid var(--color-bk);
	border-radius: 0;
}
.form-item input[type="text"].wpcf7-validates-as-required.wpcf7-not-valid,
.form-item input[type="tel"].wpcf7-validates-as-required.wpcf7-not-valid,
.form-item input[type="email"].wpcf7-validates-as-required.wpcf7-not-valid,
.form-item input[type="url"].wpcf7-validates-as-required.wpcf7-not-valid,
.form-item input[type="number"].wpcf7-validates-as-required.wpcf7-not-valid,
.form-item select.wpcf7-validates-as-required.wpcf7-not-valid,
.form-item textarea.wpcf7-validates-as-required.wpcf7-not-valid {
	background: var(--color-lrd);
}

.form-item select {
	position: relative;
    appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 30px;
}
.form-foot {
	position: relative;
}
.form-foot:has(select)::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 12px;
	width: 6px;
	height: 6px;
	border-bottom: 1px solid var(--color-bk);
	border-right: 1px solid var(--color-bk);
	transform: translateY(-50%) rotate(45deg);
	pointer-events: none;
}
.form-foot .wpcf7-not-valid-tip {
	display: none;
}

 .number .wpcf7-form-control-wrap {
    display: block;
    width: 200px;
}
.number span.num {
    display: block;
    width: calc(100% - 200px);
    padding-left: 1em;
}
.form-item input[type="text"]::placeholder,
.form-item input[type="tel"]::placeholder,
.form-item input[type="email"]::placeholder,
.form-item select::placeholder,
.form-item textarea::placeholder {
    color: var(--color-gy);
    opacity: .7;
}
.form-head {
    padding-bottom: .6em;
}
.form-head span {
    padding-left: .2em;
    color: var(--color-red);
}
.form-foot.num p {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 10px;
}
.form-foot span.txt {
    display: block;
    padding-top: 5px;
}
.form-attention {
    padding: 30px 30px 0;
}
.form-attention p {
    padding-bottom: 0;
}
.form-attention p span {
    display: block;
    padding-top: 5px;
    font-size: calc(var(--fs) * .85);
    line-height: 1.7;
}
.form-attention .checkbox input {
    display: none;
}
.form-attention .checkbox {
    text-align: center;
}
.form-attention .checkbox .wpcf7-list-item-label {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
    position: relative;
}
.form-attention .checkbox .wpcf7-list-item-label span.box {
	position: relative;
	width: 1.3em;
	aspect-ratio: 1 / 1;
	margin-top: 5px;
	border: 1px solid var(--color-bk);
}
.form-attention .checkbox input:checked + .wpcf7-list-item-label span.box::after {
    content: "";
    display: block;
    position: absolute;
    top: -5px;
    left: 3px;
    width: 9px;
    height: 18px;
    transform: rotate(40deg);
    border-bottom: 2px solid var(--color-rd);
    border-right: 2px solid var(--color-rd);
}
.form-attention .checkbox .wpcf7-list-item-label span.text {
	font-size: calc(var(--fs) * 1);
}
/*
.form-attention .checkbox .wpcf7-list-item-label {
	display: flex;
    position: relative;
    margin-right: 20px;
    padding-left: 25px;
}
.form-attention .checkbox .wpcf7-list-item-label::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 1px;
    width: 1em;
    height: 1em;
    border: 1px solid var(--color-gy);
    border-radius: 0;
    transform: translate(0, -50%);
}
.form-attention .checkbox input:checked + .wpcf7-list-item-label::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 6px;
    width: 7px;
    height: 14px;
    transform: rotate(40deg);
    border-bottom: 2px solid var(--color-rd);
    border-right: 2px solid var(--color-rd);
}*/
.form-attention .checkbox input:checked + .wpcf7-list-item-label {
    color: var(--color-red);
}
.form-wrap .submit {
    padding: 40px 40px 0;
}
.form-wrap input[type="submit"] {
    display: block;
    width: 100%;
    padding: 15px;
    background: var(--color-bk);
    color: var(--color-wh);
    text-align: center;
    letter-spacing: 0.8em;
    text-indent: 0.8em;
    border: none;
    transition: opacity 0.2s ease-in-out;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}
.form .sent .form-wrap {
    display: none;
}
.form .form-thanks {
    display: none;
    width: 100%;
    padding: 40px;
}
.form .sent .form-thanks  {
    display: block;
}
@media screen and (min-width: 768px) {
    .form {
        padding-top: 40px;
    }
	.form-desc {
		gap: 40px;
	}
    .form-item {
        display: flex;
        flex-wrap: wrap;
        padding: 0 80px;
    }
    .form-head,
    .form-foot {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    .num {
        flex-wrap: nowrap;
        justify-content: flex-start;
        text-align: left;
    }
    .form-head {
        width: 200px;
        padding: 0 20px 0 0;
    }
    .form-foot {
        width: calc(100% - 200px);
        padding: 0 0 0 20px;
    }
    .form-attention {
        padding: 50px 80px 0;
    }
    .form-wrap .submit {
        padding: 50px 80px 0;
    }
    .form-wrap input[type="submit"] {
        padding: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .form-attention {
        text-align: center;
    }
    .form-wrap input[type="submit"] {
        max-width: 500px;
        margin: auto;
        padding: 25px;
    }
    .form-wrap input[type="submit"]:hover {
        background: var(--color-gy02);
    }
}
@media screen and (min-width: 1280px) {
    .form-item {
        padding: 0 80px;
    }
    .form-head {
        width: 280px;
        padding: 0 30px 0 0;
    }
    .form-foot {
        width: calc(100% - 280px);
        padding: 0 0 0 30px;
    }
}

/* --------------------------------------------------
 page about
--------------------------------------------------- */

.page-about__inner {
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 40px;
	position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 60px 0 0;
}
@media screen and (min-width: 768px) {
	.page-about__inner {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 140px 0 30px;
	}
}
@media screen and (min-width: 1024px) {
	.page-about__inner {
		gap: 100px;
        padding: 180px 0 60px;
    }
}
.page-about__head {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.page-about__head p {
    font-family: var(--font-en-01);
    font-size: 1.8rem;
    text-indent: .05em;
}
.page-about__head h1 {
    font-family: var(--font-jp);
    font-size: var(--font-s);
    font-weight: 400;
    text-indent: .05em;
}
@media screen and (min-width: 768px) {
    .page-about__head p {
        font-size: 2.3rem;
    }
}
@media screen and (min-width: 1024px) {
    .page-about__head p {
        font-size: 2.6rem;
    }
}
@media screen and (min-width: 1280px) {
    .page-about__head p {
        font-size: 3rem;
    }
}

.page-about__contents {
	display: flex;
	flex-direction: column;
	gap: 30px;
	width: 100%;
}
.page-about__mv {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
}
.page-about__mv .image {
	width: 100%;
	height: 280px;
}
.page-about__mv .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.page-about__mv .text {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	padding: 20px;
}
.page-about__mv .text p {
	text-align: justify;
	word-break: break-all;
	font-size: 0.9rem;
}
@media screen and (min-width: 768px) {
	.page-about__mv .image {
		height: 350px;
	}
	.page-about__mv .text {
		padding: 40px;
	}
}
@media screen and (min-width: 1024px) {
	.page-about__mv {
		gap: 100px;
	}
	.page-about__mv .image {
		height: 750px;
	}
	.page-about__mv .text {
		max-width: 1030px;
		margin: auto;
		padding: 80px;
		border: 3px solid var(--color-wh);
	}
	.page-about__mv .text p {
		font-size: 0.95rem;
		line-height: 2.8;
	}
}

.page-about__data {
	width: 100%;
	padding: 20px;
}
.page-about__data .head h2 {
	font-family: var(--font-en-01);
    font-size: 1.8rem;
	font-weight: 400;
    text-indent: .05em;
}
.page-about__data .desc {
	display: flex;
	flex-direction: column;
	gap: 15px;
	padding-top: 30px;
}
.page-about__data .desc dl {
	padding-top: 15px;
	border-top: 1px solid var(--color-wh);
}
.page-about__data .desc dt {
	padding: 5px;
	font-family: var(--font-en-02);
	font-size: 1.2rem;
	border-bottom: 1px solid var(--color-gy);
}
.page-about__data .desc dd {
	padding: 5px;
	font-size: 0.9rem;
}
.page-about__data .desc dd span {
	font-family: var(--font-en-02);
	font-size: 1.1rem;
}
@media screen and (min-width: 768px) {
	.page-about__data {
		padding: 20px 40px 40px;
	}
	.page-about__data .head h2 {
		font-size: 2rem;
	}
	.page-about__data .desc dl {
		display: flex;
		align-items: center;
	}
	.page-about__data .desc dt {
		width: 180px;
		padding: 15px;
		border-bottom: 0;
	}
	.page-about__data .desc dd {
		width: calc(100% - 180px);
		padding: 15px 15px 15px 30px;
		border-left: 1px solid var(--color-wh);
	}
}
@media screen and (min-width: 1024px) {
	.page-about__data {
		max-width: 1150px;
		margin: auto;
		padding: 80px 60px 60px;
		
	}
}

.page-about__map {
	padding: 20px;
}
.page-about__map .head h2 {
	padding-bottom: 15px;
	font-family: var(--font-en-01);
    font-size: 1.8rem;
	font-weight: 400;
    text-indent: .05em;
}
.page-about__map .ggmap {
	position: relative;
	width: 100%;
	padding-top: 80.25%;
	height: 0;
}
.page-about__map .ggmap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (min-width: 768px) {
	.page-about__map {
		padding: 20px 40px 40px;
	}
	.page-about__map .head h2 {
		padding-bottom: 25px;
		font-size: 2rem;
	}
	.page-about__map .ggmap {
		padding-top: 40.25%;
	}
}
@media screen and (min-width: 1024px) {
	.page-about__map {
		padding: 20px 0 0;
	}
	.page-about__map .head {
		max-width: 1150px;
		margin: auto;
		padding: 60px 60px 20px;
	}
	.page-about__map .ggmap {
		padding-top: 32.25%;
	}
}



/* --------------------------------------------------
 category archive - common
--------------------------------------------------- */

.archive-head {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.archive-head p {
    font-family: var(--font-en-01);
    font-size: 1.8rem;
    text-indent: .05em;
}
.archive-head h1 {
    font-family: var(--font-jp);
    font-size: var(--font-s);
    font-weight: 400;
    text-indent: .05em;
}
@media screen and (min-width: 768px) {
    .archive-head p {
        font-size: 2.3rem;
    }
}
@media screen and (min-width: 1024px) {
    .archive-head p {
        font-size: 2.6rem;
    }
}
@media screen and (min-width: 1280px) {
    .archive-head p {
        font-size: 3rem;
    }
}

/* --------------------------------------------------
 category archive - breed
--------------------------------------------------- */

.breed {
    position: relative;
    width: 100%;
}
.breed__inner {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    padding: 30px 0;
}
@media screen and (min-width: 768px) {
    .breed__inner {
        gap: 30px;
        padding: 60px 0;
    }
}
@media screen and (min-width: 1024px) {
    .breed__inner {
        gap: 30px;
        padding: 90px 0;
    }
}
@media screen and (min-width: 1280px) {
    .breed__inner {
        gap: 30px;
        padding: 120px 0 90px;
    }
}

.breed__inner ul.breed-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
    padding: 0 20px;
}
.breed__inner ul.breed-list li {
    width: calc(33.3333% - (20px / 3));
}
.breed__inner ul.breed-list li a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    font-size: var(--font-xxs);
    line-height: 1.4;
}
@media screen and (min-width: 768px) {
    .breed__inner ul.breed-list {
        gap: 15px 20px;
        padding: 15px 40px 0;
    }
    .breed__inner ul.breed-list li {
        width: calc(20% - (80px / 5));
    }
}
@media screen and (min-width: 1024px) {
    .breed__inner ul.breed-list {
        gap: 20px 25px;
        padding-top: 15px;
    }
    .breed__inner ul.breed-list:not(:has(li:nth-child(6))) {
        justify-content: center;
    }
    .breed__inner ul.breed-list li {
        width: calc(16.6666% - (125px / 6));
    }
}
@media screen and (min-width: 1280px) {
    .breed__inner ul.breed-list {
        gap: 25px 30px;
        padding: 30px 40px;
    }
    .breed__inner ul.breed-list:not(:has(li:nth-child(8))) {
        justify-content: center;
    }
    .breed__inner ul.breed-list li {
        width: calc(12.5% - (210px / 8));
    }
}
@media screen and (min-width: 1401px) {
    .breed__inner ul.breed-list {
        gap: 25px 30px;
        padding: 30px 60px;
    }
    .breed__inner ul.breed-list li {
        width: calc(11.11% - (240px / 9));
    }
}
@media screen and (min-width: 1701px) {
    .breed__inner ul.breed-list {
        gap: 25px 30px;
        padding: 30px 60px;
    }
    .breed__inner ul.breed-list li {
        width: calc(10% - (270px / 10));
    }
}
@media screen and (min-width: 2001px) {
    .breed__inner ul.breed-list {
        gap: 30px 35px;
        padding: 30px 60px;
    }
    .breed__inner ul.breed-list:not(:has(li:nth-child(11))) {
        justify-content: center;
    }
    .breed__inner ul.breed-list li {
        width: calc(9.09% - (350px / 11));
    }
}

.breed-search {
    background: var(--color-wh);
}
.breed-search__inner {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 40px 20px;
}
@media screen and (min-width: 768px) {
    .breed-search__inner {
        gap: 40px;
        padding: 60px 40px;
    }
}
@media screen and (min-width: 1280px) {
    .breed-search__inner {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 50px 40px;
        padding: 80px 40px;
    }
}
.breed-search__inner .breed-country {
    width: 100%;
}
.breed-search__inner .breed-country__btn {
    position: relative;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-gy);
    font-family: var(--font-jp);
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    text-indent: .05em;
    cursor: pointer;
}
.breed-search__inner .breed-country__btn span {
    content: "";
    position: absolute;
    bottom: 10px;
    right: 5px;
    width: 14px;
    height: 14px;
}
.breed-search__inner .breed-country__btn span::before,
.breed-search__inner .breed-country__btn span::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: var(--color-bk);
    transform: translate(-50%, -50%);
}
.breed-search__inner .breed-country__btn span::before {
    width: 100%;
    height: 1.2px;
}
.breed-search__inner .breed-country__btn span::after {
    width: 1.2px;
    height: 100%;
    transition: .3s;
}
.breed-search__inner .breed-country__btn.open span::after {
    opacity: 0;
}
.breed-country__wrap {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-top: 30px;
}
.breed-country__item {
    width: 100%;
}
.breed-country__item h3 {
    padding-bottom: 15px;
    font-size: var(--font-m);
}
.breed-country__item ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.breed-country__item ul li a {
    padding: 5px;
    background: var(--color-wgy);
    font-size: var(--font-xs);
}
@media screen and (min-width: 768px) {
    .breed-country__item ul li a {
        padding: 8px;
    }
}
.breed-search__inner .breed-size {
    width: 100%;
}
.breed-search__inner .breed-group {
    width: 100%;
}
.breed-search__inner .breed-size h2,
.breed-search__inner .breed-group h2 {
    position: relative;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-gy);
    font-family: var(--font-jp);
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    text-indent: .05em;
}
.breed-search__inner .breed-size ul,
.breed-search__inner .breed-group ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 20px;
}
@media screen and (min-width: 768px) {
    .breed-search__inner .breed-size ul,
    .breed-search__inner .breed-group ul {
        gap: 15px;
    }
}
.breed-search__inner .breed-size ul li {
    width: calc(33.3333% - (20px / 3));
}
.breed-search__inner .breed-size ul li a {
    padding: 10px;
    background: var(--color-bl);
    color: var(--color-wh);
    text-align: center;
    border-radius: 4px;
}
.breed-search__inner .breed-group ul li {
    width: calc(50% - (10px / 2));
}
.breed-search__inner .breed-group ul li:nth-child(5) {
    width: calc(55% - (10px / 2));
}
.breed-search__inner .breed-group ul li:nth-child(6) {
    width: calc(45% - (10px / 2));
}
.breed-search__inner .breed-group ul li:nth-child(7) {
    width: calc(55% - (10px / 2));
}
.breed-search__inner .breed-group ul li:nth-child(8) {
    width: calc(45% - (10px / 2));
}
.breed-search__inner .breed-group ul li a {
    padding: 5px;
    background: var(--color-wgy);
    font-size: var(--font-xs);
}
@media screen and (min-width: 768px) {
    .breed-search__inner .breed-size ul li {
        width: calc(33.3333% - (30px / 3));
    }
    .breed-search__inner .breed-group ul li {
        width: calc(50% - (15px / 2));
    }
    .breed-search__inner .breed-group ul li:nth-child(5) {
        width: calc(50% - (15px / 2));
    }
    .breed-search__inner .breed-group ul li:nth-child(6) {
        width: calc(50% - (15px / 2));
    }
    .breed-search__inner .breed-group ul li:nth-child(7) {
        width: calc(50% - (15px / 2));
    }
    .breed-search__inner .breed-group ul li:nth-child(8) {
        width: calc(50% - (15px / 2));
    }
    .breed-search__inner .breed-group ul li a {
        padding: 10px;
    }
}
@media screen and (min-width: 1401px) {
    .breed-search__inner .breed-size {
        width: 30%;
    }
    .breed-search__inner .breed-group {
        width: calc(70% - 40px);
    }
    .breed-search__inner .breed-group ul li {
        width: calc(25% - (45px / 4));
    }
    .breed-search__inner .breed-group ul li:nth-child(5) {
        width: calc(25% - (45px / 4));
    }
    .breed-search__inner .breed-group ul li:nth-child(6) {
        width: calc(25% - (45px / 4));
    }
    .breed-search__inner .breed-group ul li:nth-child(7) {
        width: calc(25% - (45px / 4));
    }
    .breed-search__inner .breed-group ul li:nth-child(8) {
        width: calc(25% - (45px / 4));
    }
    .breed-search__inner .breed-group ul li a {
        padding: 10px;
    }
}

/* --------------------------------------------------
 category archive - column
--------------------------------------------------- */

.column {
    position: relative;
    width: 100%;
}
.column__inner {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    padding: 30px 10px 30px 10px;
}
@media screen and (min-width: 768px) {
    .column__inner {
        gap: 30px;
        padding: 60px 40px;
    }
}
@media screen and (min-width: 1024px) {
    .column__inner {
        gap: 30px;
        padding: 90px 40px;
    }
}
@media screen and (min-width: 1280px) {
    .column__inner {
        gap: 30px;
        padding: 120px 40px 90px;
    }
}

.column-list {
    display: flex;
    flex-direction: column;
    width: 100%;
}
@media screen and (min-width: 768px) {
    .column-list {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 30px;
        padding-top: 30px;
    }
}
@media screen and (min-width: 1024px) {
    .column-list {
        gap: 40px;
        padding-top: 30px;
    }
}
@media screen and (min-width: 1280px) {
    .column-list {
        gap: 50px;
        padding-top: 40px;
    }
}
.column-list article {
    width: 100%;
}
@media screen and (min-width: 768px) {
    .column-list article {
        width: calc(33.3333% - (60px / 3));
    }
}
@media screen and (min-width: 1024px) {
    .column-list article {
        width: calc(33.3333% - (80px / 3));
    }
}
@media screen and (min-width: 1280px) {
    .column-list article {
        width: calc(33.3333% - (100px / 3));
    }
}
.column-list article a {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding: 15px 10px 15px 0;
    border-bottom: 1px solid var(--color-wh);
}
.column-list article a .image {
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 100%;
}
.column-list article a .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.column-list article a .text {
    position: relative;
    width: calc(100% - 90px);
    padding: 8px 0 8px 15px;
}
.column-list article a .text h2 {
    font-family: var(--font-jp);
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: justify;
}
.column-list article a .text h2 span {
    font-family: var(--font-dera);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--color-tuq);
}
@media screen and (min-width: 768px) {
    .column-list article a {
        flex-direction: column;
        align-items: center;
        gap: 15px;
        border-bottom: 0;
    }
    .column-list article a .image {
        width: 160px;
        height: 160px;
    }
    .column-list article a .text {
        width: 100%;
        padding: 0;
    }
    .column-list article a .text h2 {
        font-size: 0.95rem;
    }
    .column-list article a .text h2 span {
        font-size: 1rem;
    }
}
@media screen and (min-width: 1024px) {
    .column-list article a {
        align-items: flex-start;
    }
    .column-list article a .image {
        width: 100%;
        height: auto;
        aspect-ratio: 3/2;
        border-radius: 4px;
    }
    .column-list article a .text {
        padding: 20px;
        background: var(--color-wh);
    }
    .column-list article a .text::before {
        content: "";
        position: absolute;
        top: -25px;
        right: 50px;
        width: 25px;
        height: 25px;
        clip-path: polygon(0 0, 0% 100%, 100% 100%);
        background: var(--color-wh);
    }
}
@media screen and (min-width: 1280px) {
    .column-list article a .image {
        aspect-ratio: 5/3;
    }
}

.pager {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    font-family: var(--font-en-03);
}
.is-products .pager {
    padding: 40px 0;
}

.pager .page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    font-size: var(--font-xs);
    border: 1.5px solid var(--color-bk);
    border-left: 0;
}
.pager .page-numbers:nth-child(1) {
    border-left: 1.5px solid var(--color-bk);
}
.pager .page-numbers.current {
    background: var(--color-bk);
    color: var(--color-wh);
}
.pager-arrow__prev,
.pager-arrow__next {
    position: relative;
    width: 100%;
    height: 100%;
}
.pager-arrow__prev::before,
.pager-arrow__prev::after,
.pager-arrow__next::before,
.pager-arrow__next::after {
    content: "";
    position: absolute;
    top: 50%;
}
.pager-arrow__prev::after,
.pager-arrow__next::after {
    left: 50%;
    width: 12px;
    height: 1px;
    background: var(--color-bk);
    transform: translate(-50%, -50%);
}
.pager-arrow__prev::before {
    left: 10px;
    width: 4px;
    height: 4px;
    border-top: 1px solid var(--color-bk);
    border-left: 1px solid var(--color-bk);
    transform: translate(0, -50%) rotate(-45deg);
}
.pager-arrow__next::before {
    right: 10px;
    width: 4px;
    height: 4px;
    border-top: 1px solid var(--color-bk);
    border-right: 1px solid var(--color-bk);
    transform: translate(0, -50%) rotate(45deg);
}
@media screen and (min-width: 768px) {
    .pager {
        padding-top: 30px;
    }
    .is-products .pager {
        padding: 70px 0;
    }
    .pager .page-numbers {
        width: 38px;
        height: 38px;
    }
    .pager-arrow__prev::after,
    .pager-arrow__next::after {
        width: 14px;
    }
}
@media screen and (min-width: 1024px) {
    .pager .page-numbers {
        width: 42px;
        height: 42px;
    }
    .pager-arrow__prev::after,
    .pager-arrow__next::after {
        width: 17px;
    }
}

/* --------------------------------------------------
 single - news
--------------------------------------------------- */

.single-post .main__inner {
    display: flex;
    flex-direction: column;
	font-size: 0.95rem;
    line-height: 1.95;
}
@media screen and (min-width: 768px) {
    .single-post .main__inner {
		line-height: 2.1;
    }
}
@media screen and (min-width: 1024px) {
    .single-post .main__inner {
		max-width: 950px;
        margin: auto;
        padding: 60px 0;
        font-size: 1rem;
        line-height: 2.3;
    }
}
@media screen and (min-width: 1280px) {
    .single-post .main__inner {
        max-width: 1400px;
	}
}

.single-post .post-head {
	width: 100%;
}
.single-post .post-head .c-inner {
    padding: 40px 20px 20px;
}
.single-post .post-head .title {
    padding: 25px 5px 18px;
    border-bottom: 2px solid var(--color-wh);
}
.single-post .post-head .title h1 {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.7;
    text-align: justify;
}
.single-post .post-head .time {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 23px;
    font-family: var(--font-en-02);
    font-size: 0.9rem;
    line-height: 1;
    color: #777;
}
.single-post .post-head .time .release,
.single-post .post-head .time .modified {
    display: flex;
    align-items: center;
    gap: 5px;
}
.single-post .post-head .time span {
    width: 15px;
    padding: 0 0 2px;
}
@media screen and (min-width: 768px) {
	.single-post .post-head .c-inner {
		padding: 80px 40px 40px;
	}
}

.single-post .post-desc {
	width: 100%;
	padding: 20px 0 50px;
}
.single-post .post-desc .news-text__inner {
	padding: 0 25px;
}
.single-post .post-desc .news-text__inner p {
	text-align: justify;
}
@media screen and (min-width: 768px) {
	.single-post .post-desc {
		padding: 30px 0 70px;
	}
	.single-post .post-desc .news-text__inner {
		padding: 0 45px;
	}
}

/* --------------------------------------------------
 single - breed
--------------------------------------------------- */

.single-breed .main__inner {
    display: flex;
	flex-direction: column;
    gap: 90px;
    padding-bottom: 50px;
    font-size: 0.95rem;
    line-height: 1.95;
}
@media screen and (min-width: 768px) {
    .single-breed .main__inner {
        gap: 130px;
        line-height: 2.1;
    }
}
@media screen and (min-width: 1024px) {
    .single-breed .main__inner {
        gap: 110px;
        max-width: 1150px;
        margin: auto;
        padding: 60px 40px;
        font-size: 1rem;
        line-height: 2.3;
    }
}
@media screen and (min-width: 1280px) {
    .single-breed .main__inner {
        gap: 180px;
        max-width: 1400px;
		padding-bottom: 180px;
    }
}

.sbreed-mv {
	position: relative;
	width: 100%;
}
.sbreed-mv__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
	position: relative;
	width: 100%;
	padding: 20px 20px 0;
}
.sbreed-mv__inner .image {
	position: relative;
	width: calc(100vw - 40px);
	height: calc(100vw - 40px);
	margin: auto;
	padding: 20px;
	aspect-ratio: 1 / 1;
	border-radius: 100%;
	background: var(--color-wh);
	overflow: hidden;
}
.sbreed-mv__inner .image .thumb {
	z-index: 3;
	position: relative;
}
.sbreed-mv__inner .image .deco {
	z-index: 2;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	opacity: 0.3;
	transform: translate(-50%, -50%);
	transform-origin: center center;
	animation: spin 65s linear infinite;
}

/* アニメーションは rotate のみ適用 */
@keyframes spin {
	from {
		transform: translate(-50%, -50%) rotate(0deg);
	}
	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

.sbreed-mv__inner .data {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0;
}
.sbreed-mv__inner .data .name {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--color-gy);
}
.sbreed-mv__inner .data .name-jp {
	font-size: var(--font-m);
}
.sbreed-mv__inner .data .name-en {
	font-family: var(--font-en-02);
	font-size: var(--font-s);
}
.sbreed-mv__inner .data .desc {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding-top: 15px;
	border-bottom: 1px solid var(--color-lgy);
}
.sbreed-mv__inner .data .desc dl {
	display: flex;
	font-size: 0.8rem;
	border-top: 1px solid var(--color-lgy);
	border-left: 1px solid var(--color-lgy);
	border-right: 1px solid var(--color-lgy);
}
.sbreed-mv__inner .data .desc dl dt {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 110px;
	padding: 8px;
	line-height: 1;
	border-right: 1px solid var(--color-lgy);
}
.sbreed-mv__inner .data .desc dl dd {
	display: flex;
	align-items: center;
	padding: 8px 15px;
	line-height: 1.5;
}
.sbreed-mv__inner .data .attention {
	padding: 15px 0 30px;
}
.sbreed-mv__inner .data .attention p {
	font-size: 0.65rem;
	line-height: 1.5;
	text-align: justify;
	word-break: break-all;
}
@media screen and (min-width: 768px) {
	.sbreed-mv__inner {
		align-items: center;
		gap: 35px;
		padding: 40px 40px 0;
	}
	.sbreed-mv__inner .image {
		width: 450px;
		height: 450px;
	}
	.sbreed-mv__inner .data .name-jp {
		font-size: 1.4rem;
		line-height: 1.4;
	}
	.sbreed-mv__inner .data .name-en {
		font-size: 1.05rem;;
	}
	.sbreed-mv__inner .data .desc {
		flex-direction: row;
		flex-wrap: wrap;
		padding-top: 30px;
	}
	.sbreed-mv__inner .data .desc dl {
		width: 50%;
	}
	.sbreed-mv__inner .data .desc dl:nth-child(2n+2) {
		border-left: 0;
	}
}
@media screen and (min-width: 1024px) {
	.sbreed-mv__inner {
		flex-direction: row;
		align-items: flex-start;
        gap: 80px;
		padding: 40px 0;
	}
	.sbreed-mv__inner .image {
		width: 430px;
		height: 430px;
	}
    .sbreed-mv__inner .data .name-jp {
		font-size: 1.3rem;
		line-height: 1.4;
	}
	.sbreed-mv__inner .data {
		width: calc(100% - 510px);
	}
    .sbreed-mv__inner .data .desc dl dt {
        width: 80px;
    }
    .sbreed-mv__inner .data .desc dl dd {
        width: calc(100% - 80px);
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-mv__inner {
        gap: 110px;
        align-items: flex-end;
        padding: 60px 0;
    }
    .sbreed-mv__inner .image {
		width: 550px;
		height: 550px;
	}
    .sbreed-mv__inner .data .name-jp {
		font-size: 1.45rem;
    }
    .sbreed-mv__inner .data {
		width: calc(100% - 660px);
        padding-bottom: 25px;
	}
    .sbreed-mv__inner .data .desc dl {
        font-size: 0.9rem;
    }
    .sbreed-mv__inner .data .desc dl dt {
        width: 100px;
        padding: 12px;
    }
    .sbreed-mv__inner .data .desc dl dd {
        width: calc(100% - 100px);
        padding: 12px 15px;
    }
}

.sbreed-section {
    display: flex;
    flex-direction: column;
    gap: 70px;
}
@media screen and (min-width: 768px) {
    .sbreed-section {
        gap: 110px;
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-section {
        gap: 220px;
    }
}

/* sbreed block
--------------------------------------------------- */

.sbreed-block {
    margin-top: -100px;
    padding-top: 100px;
}
.sbreed-block__inner {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.sbreed-block__inner .sbreed-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    position: relative;
    padding: 30px 20px 0;
}
.sbreed-block__inner .sbreed-head::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 52px;
    height: 52px;
    background: url("assets/images/paw_bk.svg");
    background-size: contain;
    transform: translate(-50%, 0);
}
.sbreed-block__inner .sbreed-head .num {
    z-index: 5;
    position: relative;
    margin-top: -12px;
    font-family: var(--font-en-02);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: normal;
    color: var(--color-wgy);
}
.sbreed-block__inner .sbreed-head h2 {
    font-size: 1.1rem;
    text-align: justify;
}

.sbreed-block__inner .sbreed-image {
    margin: -20px 0 -15px;
    padding: 20px 0;
    border-top: 1px solid var(--color-wh);
    border-bottom: 1px solid var(--color-wh);
}
.sbreed-block__inner .sbreed-image img {
    opacity: 0;
    transition: .5s;
}
.sbreed-block__inner .sbreed-image.inview img {
    opacity: 1;
}
@media screen and (min-width: 768px) {
    .sbreed-block__inner {
        gap: 60px;
    }
    .sbreed-block__inner .sbreed-head {
        padding: 30px 40px 0;
    }
}
@media screen and (min-width: 1024px) {
    .sbreed-block__inner .sbreed-head::after {
        width: 58px;
        height: 58px;
    }
    .sbreed-block__inner .sbreed-head .num {
        margin-top: -12px;
        font-size: 1.1rem;
    }
    .sbreed-block__inner .sbreed-head h2 {
        font-size: 1.3rem;
    }
    .sbreed-block__inner .sbreed-image {
        padding: 40px;
        border: 1px solid var(--color-wh);
        border-radius: 8px;
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-block__inner {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .sbreed-block__inner .sbreed-head {
        width: 450px;
        margin-top: 90px;
        padding: 30px 0 0;
    }
    .sbreed-block__inner .sbreed-head h2 {
        text-align: center;
		font-size: 1.4rem;
        line-height: 2;
    }
    .sbreed-block__inner .sbreed-head h2 span {
        display: block;
    }
    .sbreed-block__inner .sbreed-image {
        width: calc(100% - 510px);
        padding: 25px;
		border: 1px solid var(--color-lgy);
        background-image: repeating-linear-gradient(-45deg, var(--color-lgy), var(--color-lgy) 2px, transparent 2px, transparent 6px);
    }
}


.sbreed-block__inner .sbreed-desc {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 0 20px;
}

.sbreed-block__inner .sbreed-desc .sbreed-desc__item {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.sbreed-block__inner .sbreed-desc .m-head {
    padding: 0 20px;
}
.sbreed-block__inner .sbreed-desc .m-head h3 {
    padding: 15px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 25px;
    position: relative;
    font-weight: 500;
    color: var(--color-bk);
}
.sbreed-block__inner .sbreed-desc .m-head h3 span.num {
    display: flex;
    align-items: center;
    position: relative;
    padding: 6px 10px;
    aspect-ratio: 1 / 1;
    font-size: 1rem;
    line-height: 1;
    font-family: var(--font-en-02);
    color: var(--color-bl);
    background: var(--color-wh);
    border-radius: 100%;
}
/*.sbreed-block__inner .sbreed-desc .m-head h3 span.num::before,
.sbreed-block__inner .sbreed-desc .m-head h3 span.num::after {
    content: "";
    position: absolute;
    left: 50%;
    width: 42px;
    height: 1px;
    background: var(--color-gy);
    transform: translate(-50%, 0);
}
.sbreed-block__inner .sbreed-desc .m-head h3 span.num::before {
    top: 0;
}
.sbreed-block__inner .sbreed-desc .m-head h3 span.num::after {
    bottom: 0;
}*/
.sbreed-block__inner .sbreed-desc .m-head h3 span.text {
    position: relative;
    padding-bottom: 15px;
    font-size: 1rem;
}
.sbreed-block__inner .sbreed-desc .m-head h3 span.text::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 42px;
    height: 1px;
    background: var(--color-gy);
    transform: translate(-50%, 0);
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .sbreed-desc__text,
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .sbreed-desc__text-column {
	display: flex;
    flex-direction: column;
    gap: 20px;
}


.sbreed-block__inner .sbreed-desc .sbreed-desc__item .text {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .text p {
    text-align: justify;
	word-break: break-all;
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .text p span {
    padding: 2px 4px;
    font-weight: 700;
    background: linear-gradient(transparent 0%, #eae8df 0%);
}
@media screen and (min-width: 768px) {
    .sbreed-block__inner .sbreed-desc {
        gap: 60px;
        padding: 0 40px;
    }
}
@media screen and (min-width: 1024px) {
    .sbreed-block__inner .sbreed-desc {
        gap: 80px;
    }
    .sbreed-block__inner .sbreed-desc .m-head h3 {
        gap: 35px;
    }
    .sbreed-block__inner .sbreed-desc .m-head h3 span.text {
        font-size: 1.1rem;
    }
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item {
        gap: 40px;
    }
}
@media screen and (min-width: 1280px) {
	.sbreed-block__inner .sbreed-desc {
        gap: 120px;
		width: 100%;
		padding: 90px 0 0;
	}
	.sbreed-block__inner .sbreed-desc .sbreed-desc__item {
        flex-direction: row;
		flex-wrap: wrap;
		width: 100%;
	}
	.sbreed-block__inner .sbreed-desc .m-head {
		width: 65%;
		padding: 130px 140px 390px;
		border: 4px solid var(--color-wh);
		background-image: repeating-linear-gradient(-45deg, var(--color-wh), var(--color-wh) 2px, transparent 2px, transparent 6px);
	}
    .sbreed-block__inner .sbreed-desc .m-head h3 {
        flex-direction: row;
        justify-content: flex-start;
		gap: 20px;
    }
	.sbreed-block__inner .sbreed-desc .m-head h3 span.num {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 50px;
		height: 50px;
		background: var(--color-bl);
		color: var(--color-wh);
	}
    .sbreed-block__inner .sbreed-desc .m-head h3 span.text {
        font-size: 1.4rem;
		font-weight: 700;
		line-height: 1.8;
        padding: 5px 5px 5px 20px;
	}
    .sbreed-block__inner .sbreed-desc .m-head h3 span.text::after {
        left: 0;
        width: 1px;
        height: 100%;
        transform: translate(0, 0);
    }
	
	.sbreed-block__inner .sbreed-desc .sbreed-desc__item .sbreed-desc__text {
		width: 100%;
		padding: 120px;
		background: var(--color-wh);
	}
	.sbreed-block__inner .sbreed-desc .sbreed-desc__item .sbreed-desc__text-column {
		width: 80%;
		margin-top: -350px;
		margin-left: auto;
		padding: 160px 90px 130px;
		background: var(--color-wh);
	}
	.sbreed-block__inner .sbreed-desc .sbreed-desc__item .text {
		gap: 30px;
	}
	.sbreed-block__inner .sbreed-desc .sbreed-desc__item .text p {
		font-size: 1.05rem;
		line-height: 2.5;
	}
}


.sbreed-block__inner .sbreed-desc .sbreed-desc__item .list {
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .list h4 {
    padding: 15px;
    background: var(--color-bl);
    color: var(--color-wh);
    font-size: var(--font-m);
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 20px 15px;
    background: var(--color-wh);
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul li {
    position: relative;
    padding-left: 25px;
    line-height: 1.5;
    border-bottom: 1px solid var(--color-wgy);
}
.sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul li::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 0;
    width: 16px;
    height: 16px;
    background-image: url("assets/images/paw_bl.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
@media screen and (min-width: 1024px) {
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item .list h4 {
        font-size: 1.05rem;
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item .list h4 {
        padding: 20px 40px;
    }
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul {
        gap: 25px;
        padding: 40px;
		background: var(--color-lwgy);
    }
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul li {
        padding-left: 32px;
		padding-bottom: 8px;
		border-bottom: 1px solid var(--color-wh);
    }
    .sbreed-block__inner .sbreed-desc .sbreed-desc__item .list-dot ul li::before {
        top: 3px;
        width: 20px;
        height: 20px;
    }
}

/* --------------------------------------------------
 single - breed - old
--------------------------------------------------- */

.sbreed-section-old {
    display: flex;
    flex-direction: column;
    gap: 70px;
}
@media screen and (min-width: 768px) {
    .sbreed-section-old {
        gap: 110px;
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-section-old {
        gap: 220px;
		padding-bottom: 100px;
    }
}

.sbreed-block-old {
    margin-top: -100px;
    padding-top: 100px;
}
.sbreed-block-old__inner {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.sbreed-block-old__inner .sbreed-head-old {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    position: relative;
    padding: 30px 20px 0;
}
.sbreed-block-old__inner .sbreed-head-old::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 52px;
    height: 52px;
    background: url("assets/images/paw_bk.svg");
    background-size: contain;
    transform: translate(-50%, 0);
}
.sbreed-block-old__inner .sbreed-head-old .num {
    z-index: 5;
    position: relative;
    margin-top: -12px;
    font-family: var(--font-en-02);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: normal;
    color: var(--color-wgy);
}
.sbreed-block-old__inner .sbreed-head-old h2 {
    font-size: 1.1rem;
    text-align: justify;
}

.sbreed-block-old__inner .sbreed-image-old {
    margin: -20px 0 -15px;
    padding: 20px 0;
    border-top: 1px solid var(--color-wh);
    border-bottom: 1px solid var(--color-wh);
}
.sbreed-block-old__inner .sbreed-image-old img {
    opacity: 0;
    transition: .5s;
}
.sbreed-block-old__inner .sbreed-image-old.inview img {
    opacity: 1;
}
@media screen and (min-width: 768px) {
    .sbreed-block-old__inner {
        gap: 60px;
    }
    .sbreed-block-old__inner .sbreed-head-old {
        padding: 30px 40px 0;
    }
}
@media screen and (min-width: 1024px) {
    .sbreed-block-old__inner .sbreed-head-old::after {
        width: 58px;
        height: 58px;
    }
    .sbreed-block-old__inner .sbreed-head-old .num {
        margin-top: -12px;
        font-size: 1.1rem;
    }
    .sbreed-block-old__inner .sbreed-head-old h2 {
        font-size: 1.3rem;
    }
    .sbreed-block-old__inner .sbreed-image-old {
        padding: 40px;
        border: 1px solid var(--color-wh);
        border-radius: 8px;
    }
}
@media screen and (min-width: 1280px) {
    .sbreed-block-old__inner {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .sbreed-block-old__inner .sbreed-head-old {
        width: 450px;
        margin-top: 90px;
        padding: 30px 0 0;
    }
    .sbreed-block-old__inner .sbreed-head-old h2 {
        text-align: center;
		font-size: 1.4rem;
        line-height: 2;
    }
    .sbreed-block-old__inner .sbreed-head-old h2 span {
        display: block;
    }
    .sbreed-block-old__inner .sbreed-image-old {
        width: calc(100% - 510px);
        padding: 25px;
		border: 1px solid var(--color-lgy);
        background-image: repeating-linear-gradient(-45deg, var(--color-lgy), var(--color-lgy) 2px, transparent 2px, transparent 6px);
    }
}

.sbreed-block-old__inner .sbreed-desc-old {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 0 20px;
}
.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item {
    display: flex;
    flex-direction: column;
    gap: 25px;
}
.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item p {
    text-align: justify;
	word-break: break-all;
}
.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item p span {
    padding: 2px 4px;
    font-weight: 700;
    background: linear-gradient(transparent 0%, #eae8df 0%);
}
@media screen and (min-width: 768px) {
    .sbreed-block-old__inner .sbreed-desc-old {
        gap: 60px;
        padding: 0 40px;
    }
}
@media screen and (min-width: 1024px) {
    .sbreed-block-old__inner .sbreed-desc-old {
        gap: 80px;
    }
	.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item {
        gap: 40px;
    }
}
@media screen and (min-width: 1280px) {
	.sbreed-block-old__inner .sbreed-desc-old {
        gap: 120px;
		width: 100%;
		padding: 90px 0 0;
	}
	.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item {
        flex-direction: row;
		flex-wrap: wrap;
		width: 100%;
		padding: 120px;
		background: var(--color-wh);
	}
	.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item {
		gap: 30px;
	}
	.sbreed-block-old__inner .sbreed-desc-old .sbreed-desc-old__item p {
		font-size: 1.05rem;
		line-height: 2.5;
	}
}

/* --------------------------------------------------
 single - column
--------------------------------------------------- */

.single-column .main__inner {
    display: flex;
    flex-direction: column;
    gap: 90px;
    font-size: 0.95rem;
    line-height: 1.95;
}
@media screen and (min-width: 768px) {
    .single-column .main__inner {
        gap: 90px;
        line-height: 2.1;
    }
}
@media screen and (min-width: 1024px) {
    .single-column .main__inner {
        gap: 110px;
        max-width: 950px;
        margin: auto;
        padding: 60px 0;
        font-size: 1rem;
        line-height: 2.3;
    }
}
@media screen and (min-width: 1280px) {
    .single-column .main__inner {
        max-width: 1150px;
        gap: 180px;
    }
}
.column-head .c-inner {
    padding: 20px;
}
.column-head .image {
    width: 100%;
    height: 230px;
    border-radius: 6px;
    overflow: hidden;
}
.column-head .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.column-head .title {
    padding: 25px 0 18px;
    border-bottom: 2px solid var(--color-wh);
}
.column-head .title h1 {
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.7;
    text-align: justify;
}
.column-head .time {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 23px;
    font-family: var(--font-en-03);
    font-size: 0.9rem;
    line-height: 1;
    color: #777;
}
.column-head .time .release,
.column-head .time .modified {
    display: flex;
    align-items: center;
    gap: 5px;
}
.column-head .time span {
    width: 15px;
    padding: 0 0 2px;
}
@media screen and (min-width: 768px) {
    .column-head .c-inner {
        padding: 40px 40px;
    }
    .column-head .image {
        height: 420px;
    }
    .column-head .title {
        padding: 30px 0 20px;
    }
    .column-head .title h1 {
        font-size: 1.3rem;
    }
    .column-head .time {
        font-size: 0.8rem;
    }
    .column-head .time span {
        padding: 0;
    }
}
@media screen and (min-width: 1024px) {
    .column-head .image {
        height: auto;
        padding: 30px;
        border: 1px solid var(--color-wh);
    }
    .column-head .image img {
        border-radius: 6px;
        overflow: hidden;
    }
    .column-head .title h1 {
        font-size: 1.2rem;
    }
}
@media screen and (min-width: 1280px) {
    .column-head .title {
		width: calc(100% - 60px);
		margin: auto;
        padding: 30px 0 20px;
    }
    .column-head .title h1 {
        font-size: 1.4rem;
        font-weight: 700;
    }
	.column-head .time {
		padding-right: 30px;
	}
}


/* column intro
--------------------------------------------------- */

.column-intro {
    margin-top: -30px;
}
.column-intro .c-inner {
    display: flex;
    flex-direction: column;
    gap: 60px;
    padding: 0 20px;
}
.column-intro .c-inner .head {
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
}
.column-intro .c-inner .head::after {
    z-index: 1;
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 90px;
    aspect-ratio: 1/1;
    background: url("assets/images/introduction.svg");
    background-size: contain;
    animation: 20s linear infinite rotation;
}
@keyframes rotation {
    0% { transform: translate(0, -50%) rotateZ(0);}
    100% { transform: translate(0, -50%) rotateZ(360deg); }
}

.column-intro .c-inner .head h2 {
    z-index: 3;
    position: relative;
    padding-bottom: 10px;
    font-size: 1.1rem;
}
.column-intro .c-inner .head h2::before,
.column-intro .c-inner .head h2::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 2px;
    background: var(--color-dye);
}
.column-intro .c-inner .head h2::after {
    left: 50px;
    width: calc(100% - 50px);
    background: var(--color-wh);
}

.column-intro .text {
    z-index: 2;
    position: relative;
}
.column-intro .text p {
    padding: 36px 0 0;
    text-align: justify;
}
.column-intro .c-inner .text p:nth-child(1) {
    padding-top: 0
}
.column-intro .c-inner .text p span {
    padding: 0 2px;
    font-weight: 700;
    background: linear-gradient(transparent 80%, #e8c8c8 80%);
}
@media screen and (min-width: 768px) {
    .column-intro .c-inner {
        padding: 0 40px;
    }
    .column-intro .c-inner .head h2 {
        font-size: 1.2rem;
    }
    /*.column-intro .c-inner {
        gap: 25px;
        
    }
    .column-intro .c-inner .head {
        padding-top: 50px;
    }
    .column-intro .c-inner .head::after {
        width: 120px;
    }
    
    .column-intro .c-inner .text {
        padding-top: 20px;
    }
    .column-intro .text p {
        padding: 35px 0 0;
    }*/
}
@media screen and (min-width: 1280px) {
	.column-intro {
		margin-top: -80px;
	}
    .column-intro .c-inner {
        gap: 40px;
        padding: 0 90px;
    }
    .column-intro .c-inner .head::after {
        z-index: 4;
        right: -60px;
        margin-top: 25px;
        background: url("assets/images/introduction-pc.svg");
        width: 180px;
    }
    .column-intro .c-inner .head h2 {
        padding-bottom: 20px;
        font-size: 1.3rem;
    }
    .column-intro .c-inner .text {
        padding: 80px 80px 70px;
        background: var(--color-wh);
    }
    .column-intro .text p {
        padding: 40px 0 0;
    }
}

/* share
--------------------------------------------------- */

.share {
    position: relative;
    width: 100%;
}
.share ul {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.share ul li {
    width: 20%;
}
.share ul li a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 13px 0;
    text-align: center;
    text-decoration: none;
    color: var(--color-wh);
    line-height: 1.4;
}
.share-btn-tw a {
    background-color: #000000;
}
.share-btn-fb a {
    background-color: #425993;
}
.share-btn-pk a {
    background-color: #dc4f5a;
}
.share-btn-bm a {
    background-color: #009bd2;
}
.share-btn-ln a {
    background-color: #00be00;
}
.share ul li a .sns-icon {
    display: inline-block;
    width: 23px;
    height: 23px;
    background-size: contain;
    background-position: center center;
}
.share ul li a span {
    display: none;
    width: 100%;
}
.share ul li a .sns-icon-tw {
    background-image: url("assets/images/icon-sns-twitter.svg");
}
.share ul li a .sns-icon-fb {
    background-image: url("assets/images/icon-sns-facebook.svg");
}
.share ul li a .sns-icon-pk {
    background-image: url("assets/images/icon-sns-pocket.svg");
}
.share ul li a .sns-icon-bm {
    background-image: url("assets/images/icon-sns-bookmark.svg");
}
.share ul li a .sns-icon-ln {
    background-image: url("assets/images/icon-sns-line.svg");
}
@media screen and (min-width: 768px) {
    .share ul li a {
        padding: 15px 0;
    }
}

@media screen and (min-width: 1024px) {
    .single-breed .share ul li a {
        padding: 10px 0;
    }
    .single-breed .share ul li a .sns-icon {
        width: 20px;
        height: 20px;
    }
}


/* column index
--------------------------------------------------- */

.column-index {
    padding: 0 20px;
}
.column-index .c-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.column-index h2 {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 8px 15px;
    background: var(--color-bk);
    color: var(--color-wh);
    font-size: 0.9rem;
    font-weight: 400;
}
.column-index ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    padding: 15px;
    background: var(--color-wh);
}
.column-index ul li {
    width: 100%;
    border-bottom: 1px solid var(--color-wgy);
}
.column-index ul li a {
    display: flex;
    align-items: flex-start;
    padding: 5px 0;
    font-size: 0.95rem;
    line-height: 1.5;
}
.column-index ul li a .num {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25px;
    height: 25px;
    background: var(--color-wgy);
    border-radius: 100%;
    font-family: var(--font-en-03);
    font-size: 0.85rem;
    line-height: 1;
}
.column-index ul li a .text {
    width: calc(100% - 25px);
    padding: 0 0 0 10px;
    text-align: justify;
}
@media screen and (min-width: 768px) {
    .column-index {
        padding: 0;
    }
    .column-index .c-inner {
        padding: 0 40px;
    }
    .column-index h2 {
        padding: 10px 15px;
        font-size: 0.95rem;
    }
    .column-index ul {
        gap: 13px;
        padding: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .column-index ul li a {
        font-size: 1rem;
    }
}
@media screen and (min-width: 1280px) {
    .column-index {
        margin: -40px 0 -20px;
        padding: 0 30px;
    }
    .column-index ul {
        gap: 18px;
        padding: 60px 60px 50px;
    }
    .column-index ul li a {
        align-items: center;
    }
    .column-index ul li a .text {
        padding-left: 22px;
        padding-bottom: 2px;
    }
}

/* column block
--------------------------------------------------- */

.column-block {
    margin-top: -100px;
    padding-top: 100px;
}
.column-block .c-inner {
    display: flex;
    flex-direction: column;
    gap: 60px;
}
.column-block .c-inner .head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    position: relative;
    padding: 30px 20px 0;
}
.column-block .c-inner .head::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 52px;
    height: 52px;
    background: url("assets/images/paw_bk.svg");
    background-size: contain;
    transform: translate(-50%, 0);
}
.column-block .c-inner .head .num {
    z-index: 5;
    position: relative;
    margin-top: -12px;
    font-family: var(--font-en-02);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: normal;
    color: var(--color-wgy);
}
.column-block .c-inner .head h2 {
    font-size: 1.1rem;
    text-align: justify;
}

.column-block .c-inner .image {
    margin: -20px 0;
}

.column-block .c-inner .image img {
    opacity: 0;
    transition: .5s;
}
.column-block .c-inner .image.inview img {
    opacity: 1;
}

@media screen and (min-width: 768px) {
    .column-block {
        margin-top: -150px;
        padding-top: 150px;
    }
    .column-block .c-inner {
        gap: 50px;
    }
    .column-block .c-inner .head {
        padding: 40px 20px 0;
    }
    .column-block .c-inner .head::after {
        width: 56px;
        height: 56px;
    }
    .column-block .c-inner .head .num {
        margin-top: -19px;
        margin-bottom: 10px;
        font-size: 1rem;
    }
    .column-block .c-inner .head h2 {
        font-size: 1.3rem;
    }
}

@media screen and (min-width: 1024px) {
    .column-block .c-inner .head {
        padding: 50px 20px 0;
    }
    .column-block .c-inner .head::after {
        width: 60px;
        height: 60px;
    }
    .column-block .c-inner .head .num {
        margin-top: -29px;
        font-size: 1.05rem;
    }
    .column-block .c-inner .head h2 {
        font-size: 1.3rem;
    }
    .column-block .c-inner .image {
        padding: 0 60px;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner {
        gap: 70px;
    }
    .column-block .c-inner .image {
        width: calc(100% - 120px);
        height: auto;
        margin: -40px auto -30px;
        padding: 30px;
        overflow: hidden;
        border: 1px solid var(--color-wh);
        border-radius: 6px;
    }
    .column-block .c-inner .image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 6px;
        overflow: hidden;
    }
}

.column-block .c-inner .text p {
    padding: 36px 20px 0;
    text-align: justify;
}
.column-block .c-inner .text p:nth-child(1) {
    padding-top: 0
}
.column-block .c-inner .text p span {
    padding: 0 2px;
    font-weight: 700;
    background: linear-gradient(transparent 80%, #e8c8c8 80%);
}
@media screen and (min-width: 768px) {
    .column-block .c-inner .text {
        padding: 0 40px;
    }
    .column-block .c-inner .text p {
        padding: 35px 0 0;
        letter-spacing: 0.03em;
    }
    .column-block .c-inner .text p span {
        display: inline;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner .text p {
        padding: 40px 30px 0;
    }
}

.column-block .c-inner .m-head {
    margin-bottom: -25px;
    padding: 0 20px;
}
.column-block .c-inner .m-head h3 {
    padding-bottom: 15px;
    position: relative;
    font-size: 1.05rem;
    color: var(--color-tuq);
}
.column-block .c-inner .m-head h3::before,
.column-block .c-inner .m-head h3::after {
    content: "";
    position: absolute;
    bottom: 0;
}
.column-block .c-inner .m-head h3::before {
    width: 50px;
    height: 2px;
    background: var(--color-bl);
    left: 0;
}
.column-block .c-inner .m-head h3::after {
    width: calc(100% - 50px);
    height: 2px;
    background: var(--color-wh);
    right: 0;
}

@media screen and (min-width: 768px) {
    .column-block .c-inner .m-head {
        padding: 15px 40px 0;
    }
    .column-block .c-inner .m-head h3 {
        padding: 20px 0;
        font-size: 1.2rem;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner .m-head {
        width: 100%;
        max-width: calc(100% - 60px);
        margin: 0 auto -30px;
    }
    .column-block .c-inner .m-head h3 {
        font-size: 1.2rem;
    }
}

.column-block .c-inner .list {
    padding: 0 20px;
}
.column-block .c-inner .list h4 {
    padding: 15px;
    background: var(--color-bl);
    color: var(--color-wh);
    font-size: var(--font-m);
}
.column-block .c-inner .list-dot ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px 15px;
    background: var(--color-wh);
}
.column-block .c-inner .list-dot ul li {
    position: relative;
    padding-left: 25px;
    line-height: 1.5;
    border-bottom: 1px solid var(--color-wgy);
}
.column-block .c-inner .list-dot ul li::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 0;
    width: 16px;
    height: 16px;
    background-image: url("assets/images/paw_bl.svg");
    background-repeat: no-repeat;
    background-size: contain;
}

.column-block .c-inner .list-breed ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 20px 0 0;
}
.column-block .c-inner .list-breed ul li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    width: calc(33.3333% - (20px / 3));
}
.column-block .c-inner .list-breed ul li a {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
}
.column-block .c-inner .list-breed ul li .list-breed__image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 1/1;
    background: var(--color-wh);
    border-radius: 100%;
    overflow: hidden;
}
.column-block .c-inner .list-breed ul li .list-breed__thumb {
    width: 40%;
}
.column-block .c-inner .list-breed ul li .list-breed__name {
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.4;
}

@media screen and (min-width: 768px) {
    .column-block .c-inner .list {
        padding: 0 40px;
    }
    .column-block .c-inner .list-breed ul {
        gap: 15px;
        padding: 40px 0 0;
    }
    .column-block .c-inner .list-breed ul li {
        gap: 8px;
        width: calc(20% - (60px / 5));
    }
    .column-block .c-inner .list-breed ul li .list-breed__name {
        font-size: 0.8rem;
    }
}
@media screen and (min-width: 1024px) {
    .column-block .c-inner .list h4 {
        font-size: 1.05rem;
    }
    .column-block .c-inner .list-breed ul {
        gap: 20px;
        padding: 40px 20px 0;
    }
    .column-block .c-inner .list-breed ul li {
        gap: 8px;
        width: calc(16.6666% - (100px / 6));
    }
    .column-block .c-inner .list-breed ul li .list-breed__thumb {
        width: 30%;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner .list {
        width: 100%;
        max-width: calc(100% - 60px);
        margin: auto;
    }
    .column-block .c-inner .list h4 {
        padding: 20px 40px;
    }
    .column-block .c-inner .list-dot ul {
        gap: 25px;
        padding: 40px;
    }
    .column-block .c-inner .list-dot ul li {
        padding-left: 32px;
    }
    .column-block .c-inner .list-dot ul li::before {
        top: 3px;
        width: 20px;
        height: 20px;
    }
    .column-block .c-inner .list-breed ul {
        gap: 30px;
        padding: 40px 20px 0;
    }
    .column-block .c-inner .list-breed ul li {
        gap: 8px;
        width: calc(16.6666% - (150px / 6));
    }
}

.column-block .c-inner .box {
    padding: 0 20px;
}
.column-block .c-inner .box__head {
    padding: 15px;
    background: var(--color-bl);
    color: var(--color-wh);
}
.column-block .c-inner .box__head h3 {
    font-size: var(--font-m);
}
.column-block .c-inner .box__text {
    padding: 15px;
    background: var(--color-wh);
}
.column-block .c-inner .box__text p {
    text-align: justify;
}
.column-block .c-inner .box__text p span {
    padding: 0 2px;
    font-weight: 700;
    background: linear-gradient(transparent 80%, #F2E5BB 80%);
}
@media screen and (min-width: 768px) {
    .column-block .c-inner .box {
        padding: 0 40px;
    }
    .column-block .c-inner .box__head {
        padding: 20px;
    }
    .column-block .c-inner .box__text {
        padding: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .column-block .c-inner .box__head h3 {
        font-size: 1.05rem;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner .box {
        width: 100%;
        max-width: calc(100% - 60px);
        margin: auto;
    }
    .column-block .c-inner .box__head {
        padding: 20px 40px;
    }
    .column-block .c-inner .box__text {
        padding: 30px 40px;
    }
}

.column-block .c-inner .table {
    padding: 0 20px;
}
.column-block .c-inner .table table {
    width: 100%;
    border-top: 1px solid var(--color-lgy);
    border-left: 1px solid var(--color-lgy);
}
.column-block .c-inner .table table tr td {
    padding: 8px;
    border-right: 1px solid var(--color-lgy);
    border-bottom: 1px solid var(--color-lgy);
    font-size: 0.9rem;
    line-height: 1.6;
}

.column-block .c-inner .table table.disease-table {
    border: 0;
}
.column-block .c-inner .table table.disease-table tr td {
    display: block;
    padding: 10px 15px;
    text-align: justify;
    border: 0;
}
.column-block .c-inner .table table.disease-table tr td:nth-child(1) {
    text-align: center;
    background: var(--color-tuq);
    color: var(--color-wh);
    font-weight: 700;
    letter-spacing: .1em;
    text-indent: .1em;
}
.column-block .c-inner .table table.disease-table tr td:nth-child(2) {
    background: var(--color-wh);
}

@media screen and (min-width: 768px) {
    .column-block .c-inner .table {
        padding: 0 40px;
    }
    .column-block .c-inner .table table.disease-table tr td {
        display: table-cell;
        border-bottom: 1px solid var(--color-wgy);
    }
    .column-block .c-inner .table table.disease-table tr td:nth-child(1) {
        width: 150px;
        text-align: center;
    }
    .column-block .c-inner .table table.disease-table tr td:nth-child(2) {
        padding: 20px;
        line-height: 1.8;
    }
}
@media screen and (min-width: 1280px) {
    .column-block .c-inner .table {
        width: 100%;
        max-width: calc(100% - 60px);
        margin: auto;
    }
    .column-block .c-inner .table table tr td {
        padding: 15px;
        font-size: 0.95rem;
        line-height: 1.6;
    }
    .column-block .c-inner .table table.disease-table tr td {
        padding: 15px;
    }
    .column-block .c-inner .table table.disease-table tr td:nth-child(1) {
        width: 180px;
    }
}


/* column recommend product
--------------------------------------------------- */

.recommend-product__item {
    position: relative;
    padding: 0 20px 30px;
}
.recommend-product__item .recommend-item__deco {
    z-index: 3;
    position: absolute;
    top: -10px;
    right: 8px;
    width: 40px;
    font-family: var(--font-en-02);
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: .2em;
}
.recommend-product__item .recommend-item__deco svg {
    overflow: visible;
}
.recommend-product__item .recommend-item__deco path {
    fill: none;
}
.recommend-product__item .recommend-item__deco text {
    fill: var(--color-gy);
}
.recommend-product__item a {
    z-index: 2;
    display: flex;
    position: relative;
    width: 100%;
    border-radius: 4px;
}
.recommend-product__item a::after {
    content: "";
    position: absolute;
}
.recommend-product__item a::after {
    z-index: 3;
    bottom: 10px;
    right: 10px;
    width: 20px;
    aspect-ratio: 5/2;
    background-image: url("assets/images/arrow-right-wh.svg");
    background-repeat: no-repeat;
    background-size: contain;
}

.recommend-product__item a .recommend-item__image {
    width: 90px;
    border-radius: 4px 0 0 4px;
    overflow: hidden;
}
.recommend-product__item a .recommend-item__image img {
    transition: .3s;
}
.recommend-product__item a:hover .recommend-item__image img {
    transform: scale(1.1);
}

.recommend-product__item a .recommend-item__desc {
    z-index: 1;
    display: flex;
    align-items: center;
    position: relative;
    width: calc(100% - 90px);
    padding: 25px 20px 10px;
    border-radius: 0 4px 4px 0;
    background: var(--color-bk);
    color: var(--color-wh);
    transition: .3s;
}
.recommend-product__item a:hover .recommend-item__desc {
    background: var(--color-dgy);
}
.recommend-product__item a .recommend-item__desc::before {
    z-index: 2;
    content: "おすすめアイテム";
    position: absolute;
    top: 0;
    left: 0;
    padding: 5px 8px;
    background: var(--color-ye);
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

.recommend-product__item a .recommend-item__desc .recommend-item__title {
    font-size: 0.85rem;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: justify;
    word-break: break-all;
}
@media screen and (min-width: 768px) {
    .recommend-product__item {
        padding: 0 40px 20px;
    }
    .recommend-product__item .recommend-item__deco {
        top: -10px;
        right: 70px;
        width: 54px;
    }
    .recommend-product__item a::after {
        bottom: 15px;
        right: 15px;
        width: 30px;
    }
    .recommend-product__item a .recommend-item__image {
        width: 150px;
        padding: 0;
        border: 0;
        border-radius: 4px 0 0 4px;
        overflow: hidden;
    }
    .recommend-product__item a .recommend-item__desc {
        width: calc(100% - 150px);
        padding: 60px 40px 20px;
    }
    .recommend-product__item a .recommend-item__desc::before {
        padding: 8px 12x;
        font-size: 0.8rem;
    }
    .recommend-product__item a .recommend-item__desc .recommend-item__title {
        font-size: 1rem;
        font-weight: 700;
    }
}
@media screen and (min-width: 1280px) {
    .recommend-product__item {
        max-width: calc(100% - 60px);
        margin: auto;
        padding-bottom: 40px;
    }
    .recommend-product__item .recommend-item__deco {
        right: 50px;
        width: 60px;
    }
}


/* column related post
--------------------------------------------------- */

.related-post {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 0 auto 10px;
    padding: 0 20px;
}
.related-post h2 {
    display: flex;
    position: relative;
    width: auto;
    padding: 0 20px;
    font-size: var(--font-xs);
    font-weight: 400;
}
.related-post h2::before,
.related-post h2::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 15px;
    height: 1px;
    background: var(--color-bk);
    transform: translate(0, -50%);
}
.related-post h2::before {
    left: 0;
}
.related-post h2::after {
    right: 0;
}
.related-post a {
    display: flex;
    width: 100%;
    border-radius: 6px;
    overflow: hidden;
}
.related-post a .related-post__image {
    width: 80px;
    height: 80px;
}
.related-post a .related-post__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.related-post a .related-post__text {
    display: flex;
    align-items: center;
    position: relative;
    width: calc(100% - 80px);
    padding: 5px 30px 5px 10px;
    background: var(--color-wh);
}
.related-post a .related-post__text::before,
.related-post a .related-post__text::after {
    content: "";
    position: absolute;
}
.related-post a .related-post__text::before {
    z-index: 2;
    top: 0;
    right: 0;
    width: 20px;
    height: 100%;
    background: var(--color-bk);
}
.related-post a .related-post__text::after {
    z-index: 3;
    top: 50%;
    right: 9px;
    width: 5px;
    height: 5px;
    border-top: 1px solid var(--color-wh);
    border-right: 1px solid var(--color-wh);
    transform: translate(0, -50%) rotate(45deg);
}

.related-post a .related-post__text p {
    font-size: 0.85rem;
    line-height: 1.5;
    text-align: justify;
}
.related-post a .related-post__text p.related-post__desc {
    display: none;
}
@media screen and (min-width: 768px) {
    .related-post {
        width: 100%;
        margin-top: 15px;
        margin-bottom: 20px;
        padding: 0 40px;
    }
    .related-post h2 {
        padding: 0 35px;
        font-size: 0.95rem;
    }
    .related-post h2::before,
    .related-post h2::after {
        width: 25px;
    }
    .related-post a .related-post__image {
        width: 180px;
        height: 100px;
    }
    .related-post a .related-post__text {
        width: calc(100% - 180px);
        padding: 10px 50px 10px 20px;
    }
    .related-post a .related-post__text::before {
        width: 25px;
    }
    .related-post a .related-post__text::after {
        right: 11px;
        width: 6px;
        height: 6px;
    }
    .related-post a .related-post__text p {
        font-size: 0.9rem;
    }
}
@media screen and (min-width: 1024px) {
    .related-post {
        max-width: calc(100% - 120px);
        padding: 30px 60px 15px;
    }
    .related-post h2 {
        font-size: 1.05rem;
    }
    .related-post a {
        margin-top: 20px;
    }
    .related-post a .related-post__image {
        width: 220px;
        height: 140px;
    }
    .related-post a .related-post__text {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        gap: 10px;
        width: calc(100% - 220px);
        padding: 10px 70px 10px 40px;
    }
    .related-post a .related-post__text p.related-post__title {
        font-size: 1.05rem;
        font-weight: 700;
        color: var(--color-bl);
    }
    .related-post a .related-post__text p.related-post__desc {
        display: block;
        font-size: 0.8rem;
    }
}


/* column author
--------------------------------------------------- */

.column-author .c-inner {
    display: flex;
    flex-direction: column;
    gap: 20px;
	margin-top: -15px;
    padding: 0 20px 70px;
}
.column-author .c-inner .head {
    padding: 10px 0 25px;
}
.column-author .c-inner .head .head__deco {
    z-index: 4;
    position: relative;
    width: 100%;
}
.column-author .c-inner .head .head__deco span {
    position: absolute;
    top: 0;
    width: calc(50% - 10px);
    height: 20px;
    border-top: 1.5px solid var(--color-bk);
}
.column-author .c-inner .head .head__deco span:nth-child(1) {
    left: 0;
}
.column-author .c-inner .head .head__deco span:nth-child(2) {
    right: 0;
}
.column-author .c-inner .head .head__deco span:nth-child(2)::before {
    content: "";
    position: absolute;
    top: -3px;
    left: -6px;
    width: 1.5px;
    height: 100%;
    background: var(--color-bk);
    transform: rotate(40deg);
}
.column-author .c-inner .head h2 {
    padding: 15px 25px;
    font-size: var(--font-m);
    text-align: center;
    border: 1.5px solid var(--color-bk);
    border-bottom: 0;
}



.column-author .c-inner a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.column-author .c-inner a .icon {
    width: 110px;
    aspect-ratio: 1/1;
    margin-top: 15px;
    border-radius: 100%;
    overflow: hidden;
}
.column-author .c-inner a .icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.column-author .c-inner a .desc {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    padding: 20px;
    background: var(--color-wh);
    border-radius: 4px;
}
.column-author .c-inner a .desc h3 {
    position: relative;
    padding-bottom: 8px;
    font-size: 1rem;
}
.column-author .c-inner a .desc h3::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: var(--color-gy);
}
.column-author .c-inner a .desc p {
    font-size: 0.85rem;
    line-height: 1.5;
    text-align: justify;
}
@media screen and (min-width: 768px) {
    .column-author .c-inner {
        gap: 40px;
        padding: 0 40px 70px;
    }
    .column-author .c-inner .head {
        width: 100%;
        padding: 15px 0;
    }
    .column-author .c-inner .head h2 {
        padding: 25px;
    }
    .column-author .c-inner a {
        flex-direction: row;
        align-items: flex-start;
        gap: 30px;
    }
    .column-author .c-inner a .icon {
        width: 180px;
    }
    .column-author .c-inner a .desc {
        width: calc(100% - 220px);
        padding: 30px;
    }
    .column-author .c-inner a .desc h3::before {
        left: -70px;
        width: calc(100% + 70px);
    }
}
@media screen and (min-width: 1024px) {
    .column-author .c-inner {
        gap: 60px;
    }
    .column-author .c-inner .head {
        padding: 15px;
    }
    .column-author .c-inner .head h2 {
        font-size: 1.1rem;
        letter-spacing: .05em;
        text-indent: .05em;
    }
    .column-author .c-inner a {
        gap: 50px;
    }
    .column-author .c-inner a .icon {
        width: 110px;
        height: 110px;
    }
    .column-author .c-inner a .desc {
        gap: 20px;
        width: calc(100% - 160px);
        padding: 40px;
    }
    .column-author .c-inner a .desc h3::before {
        left: -80px;
        width: calc(100% + 80px);
    }
    .column-author .c-inner a .desc h3 {
        padding-bottom: 12px;
        font-size: 1.1rem;
    }
    .column-author .c-inner a .desc p {
        font-size: 0.95rem;
    }
}
@media screen and (min-width: 1280px) {
	.column-author {
		margin-top: -30px;
	}
    .column-author .c-inner {
        padding: 0 60px 90px;
    }
    .column-author .c-inner a {
        gap: 80px;
        padding: 0 30px;
    }
    .column-author .c-inner a .icon {
        width: 140px;
        height: 140px;
    }
    .column-author .c-inner a .desc {
        gap: 20px;
        width: calc(100% - 220px);
        padding: 40px;
    }
     .column-author .c-inner a .desc h3::before {
        left: -100px;
        width: calc(100% + 100px);
    }
}

/* column related
--------------------------------------------------- */

.column-related {
	position: relative;
	width: 100%;
	margin-top: -80px;
	padding-bottom: 50px;
}
.column-related .c-inner {
	display: flex;
	flex-direction: column;
	gap: 15px;
	width: 100%;
}
.column-related .c-inner .head {
	width: 100%;
	padding: 0 20px;
	text-align: center;
}
.column-related .c-inner .head h2 {
	display: inline;
	position: relative;
	padding: 0 20px;
	font-size: 0.95rem;
	text-align: center;
}
.column-related .c-inner .head h2::before,
.column-related .c-inner .head h2::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 1px;
	height: 26px;
	background: var(--color-bk);
}
.column-related .c-inner .head h2::before {
	left: 0;
	transform: translate(0, -50%) rotate(-40deg);
}
.column-related .c-inner .head h2::after {
	right: 0;
	transform: translate(0, -50%) rotate(40deg);
}
.column-related .c-inner .list {
	width: 100%;
}
.column-related .c-inner .list__inner {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 0 20px;
}
.column-related .c-inner .list__inner .list__item {
	width: 100%;
	border-bottom: 1px solid var(--color-wh);
}
.column-related .c-inner .list__inner .list__item a {
	display: flex;
	align-items: center;
	width: 100%;
	padding: 15px 0;
}
.column-related .c-inner .list__inner .list__item a .image {
	width: 90px;
	aspect-ratio: 1 / 1;
	border-radius: 6px;
	overflow: hidden;
}
.column-related .c-inner .list__inner .list__item a .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.column-related .c-inner .list__inner .list__item a .desc {
	width: calc(100% - 90px);
	padding-left: 15px;
}
.column-related .c-inner .list__inner .list__item a .desc h3 {
	font-size: 0.9rem;
	font-weight: 400;
	text-align: justify;
}
.column-related .c-inner .list__inner .list__item a .desc p {
	display: none;
}
@media screen and (min-width: 768px) {
	.column-related {
		margin-top: -20px;
		padding-bottom: 50px;
	}
	.column-related .c-inner .head {
		padding: 0 20px 30px;
	}
	.column-related .c-inner .head h2 {
		padding: 0 25px;
		font-size: 1.05rem;
	}
	.column-related .c-inner .list__inner {
		gap: 20px;
		padding: 0 40px;
	}
	.column-related .c-inner .list__inner .list__item {
		width: calc(33.3333% - (40px / 3));
		border-bottom: 0;
	}
	.column-related .c-inner .list__inner .list__item a .desc p {
		display: block;
		padding-top: 8px;
		font-size: 0.85rem;
		line-height: 1.4;
		color: var(--color-gy);
		text-align: justify;
	}
	.column-related .c-inner .list__inner .list__item a {
		flex-direction: column;
		gap: 10px;
		padding: 0;
	}
	.column-related .c-inner .list__inner .list__item a .image {
		width: 100%;
		aspect-ratio: 6 / 4;
	}
	.column-related .c-inner .list__inner .list__item a .desc {
		width: 100%;
		padding: 0;
	}
}
@media screen and (min-width: 1280px) {
	.column-related {
		margin-top: -100px;
		padding-bottom: 50px;
	}
	.column-related .c-inner .head {
		padding: 0 60px 30px;
	}
	.column-related .c-inner .head h2 {
		padding: 0 25px;
		font-size: 1.1rem;
	}
	.column-related .c-inner .list__inner {
		gap: 30px;
		padding: 0 60px;
	}
	.column-related .c-inner .list__inner .list__item {
		width: calc(33.3333% - (60px / 3));
	}
	.column-related .c-inner .list__inner .list__item a .desc p {
		display: block;
		padding-top: 8px;
		font-size: 0.85rem;
		line-height: 1.4;
		color: var(--color-gy);
	}
	.column-related .c-inner .list__inner .list__item a {
		flex-direction: column;
		gap: 10px;
		padding: 0;
	}
	.column-related .c-inner .list__inner .list__item a .image {
		width: 100%;
		aspect-ratio: 6 / 4;
	}
	.column-related .c-inner .list__inner .list__item a .desc {
		width: 100%;
		padding: 0;
	}
}

/* --------------------------------------------------
 shop page - front
--------------------------------------------------- */

.shop-header {
    display: none;
}
@media screen and (min-width: 1024px) {
    .shop-header {
        display: block;
        background: var(--color-wh);
    }
    .shop-header__inner > ul {
        display: flex;
        flex-wrap: wrap;
        position: relative;
        border-top: 1px solid var(--color-wgy);
        border-bottom: 1px solid var(--color-wgy);
        padding: 0 20px;
    }
    .shop-header__inner > ul::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        height: 1px;
        background: var(--color-wgy);
        transform: translate(0, -50%);
    }
    .shop-header__inner > ul > li {
        position: relative;
        width: 20%;
        border-right: 1px solid var(--color-wgy);
    }
    .shop-header__inner > ul > li:nth-child(1) { z-index: 20;}
    .shop-header__inner > ul > li:nth-child(2) { z-index: 19;}
    .shop-header__inner > ul > li:nth-child(3) { z-index: 18;}
    .shop-header__inner > ul > li:nth-child(4) { z-index: 17;}
    .shop-header__inner > ul > li:nth-child(5) { z-index: 16;}
    .shop-header__inner > ul > li:nth-child(6) { z-index: 15;}
    .shop-header__inner > ul > li:nth-child(7) { z-index: 14;}
    .shop-header__inner > ul > li:nth-child(8) { z-index: 13;}
    .shop-header__inner > ul > li:nth-child(9) { z-index: 12;}
    
    
    
    .shop-header__inner > ul > li:nth-child(5n+5) {
        border-right: 0;
    }
    .shop-header__inner > ul > li > a {
        display: flex;
        align-items: center;
        gap: 5px;
        position: relative;
        padding: 10px 10px 10px 5px;
    }
    .shop-header__inner > ul > li > a::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 10px;
        width: 4px;
        height: 4px;
        border-top: 1px solid var(--color-bk);
        border-right: 1px solid var(--color-bk);
        transform: translate(0, -50%) rotate(45deg);
    }
    .shop-header__inner > ul > li > a .icon {
        width: 32px;
    }
    .shop-header__inner > ul > li > a .text {
        font-size: 0.85rem;
    }
    .shop-header__inner > ul > li .child {
        position: absolute;
        opacity: 0;
        max-height: 0;
        transition: opacity 0.3s ease, max-height 0.3s ease;
        overflow: hidden;
        pointer-events: none;
    }
    .shop-header__inner > ul > li.has-child:hover .child {
        width: 100%;
        opacity: 1;
        max-height: 600px;
        pointer-events: painted;
    }
    .shop-header__inner > ul > li.has-child:hover .child ul {
        width: 100%;
		padding: 15px 0;
		background: var(--color-bk);
    }
    .shop-header__inner > ul > li.has-child:hover .child ul li {
        width: 100%;
    }
    .shop-header__inner > ul > li.has-child:hover .child ul li a {
        width: 100%;
		padding: 5px 20px;
        background: var(--color-bk);
		color: var(--color-wh);
        transition: .3s;
    }
    .shop-header__inner > ul > li.has-child:hover .child ul li a:hover {
        background: var(--color-dgy);
    }
    
}
@media screen and (min-width: 1280px) {
    .shop-header__inner > ul {
        padding: 0 40px;
    }
    .shop-header__inner > ul > li > a {
        justify-content: flex-start;
        padding: 15px 15px 15px 15px;
    }
}
@media screen and (min-width: 1801px) {
    .shop-header__inner > ul::before {
        display: none;
    }
    .shop-header__inner > ul {
        padding: 0 80px;
    }
    .shop-header__inner > ul > li {
        width: 11.1111%;
    }
    .shop-header__inner > ul > li:nth-child(1) {
        border-left: 1px solid var(--color-wgy);
    }
    .shop-header__inner > ul > li:nth-child(5n+5) {
        border-right: 1px solid var(--color-wgy);
    }
    .shop-header__inner > ul > li > a {
        justify-content: flex-start;
        padding: 15px 20px;
    }
}

.shop-newitem {
	position: relative;
	width: 100%;
	padding: 40px 0;
}
.shop-newitem__inner {
	display: flex;
	flex-direction: column;
	gap: 60px;
	position: relative;
	width: 100%;
	padding: 0 20px;
}
.shop-newitem__item {
	display: flex;
	flex-direction: column;
	gap: 25px;
}
.shop-newitem__title {
	font-family: var(--font-en-01);
	font-size: 1.2rem;
}
.shop-newitem__title span {
	margin-left: 1em;
	font-family: var(--font-jp);
	font-size: 0.9rem;
	font-weight: normal;
}

.shop-newitem__item ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.shop-newitem__item ul li {
	width: calc(50% - 10px);
}
.shop-newitem__item ul li a {
	transition: .3s;
}
.shop-newitem__item ul li a:hover {
	opacity: 0.8;
}
.shop-newitem__item ul li .add_to_cart_button {
	display: none;
}
.shop-newitem__item ul li h2 {
	padding: 8px 0;
	font-size: 0.8rem;
	font-weight: normal;
	word-break: break-all;
}
.shop-newitem__item ul li .woocommerce-Price-amount {
	font-size: 1rem;
}
.shop-newitem__item ul li .woocommerce-Price-currencySymbol {
	font-size: 0.8rem;
}

.shop-newitem__item .viewmore {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 12px 0;
}
.shop-newitem__item .viewmore a {
	padding: 10px 20px;
	background: var(--color-bk);
	color: var(--color-wh);
	font-family: var(--font-en-03);
	font-size: 0.95rem;
	line-height: 1;
	border-radius: 20px;
}

@media screen and (min-width: 768px) {
	.shop-newitem {
		padding: 60px 0;
	}
	.shop-newitem__inner {
		gap: 60px;
		padding: 0 40px;
	}
	.shop-newitem__item ul {
		gap: 20px;
	}
	.shop-newitem__item ul li {
		width: calc(33.33333% - (40px / 3));
	}
}
@media screen and (min-width: 1024px) {
	.shop-newitem {
		padding: 60px 0;
	}
	.shop-newitem__inner {
		gap: 60px;
		padding: 0 40px;
	}
	.shop-newitem__title {
		font-size: 1.4rem;
	}
	.shop-newitem__title span {
		font-size: 0.95rem;
	}
	.shop-newitem__item ul {
		gap: 20px;
	}
	.shop-newitem__item ul li {
		width: calc(25% - (60px / 4));
	}
}
@media screen and (min-width: 1280px) {
	.shop-newitem {
		padding: 60px 0;
	}
	.shop-newitem__inner {
		max-width: 1400px;
		margin: auto;
		gap: 100px;
		padding: 0 40px;
	}
	.shop-newitem__item {
		gap: 40px;
	}
	.shop-newitem__title {
		display: flex;
		justify-content: center;
		font-size: 2.2rem;
	}
	.shop-newitem__title span {
		margin-top: 2px;
		margin-left: 1.5em;
		font-size: 1.05rem;
	}
	.shop-newitem__item ul {
		gap: 20px;
	}
	.shop-newitem__item ul li {
		width: calc(20% - (100px / 5));
	}
	.shop-newitem__item ul li:nth-child(11),
	.shop-newitem__item ul li:nth-child(12) {
		display: none;
	}
	.shop-newitem__item ul li h2 {
		font-size: 0.85rem;
	}
	.shop-newitem__item ul li .woocommerce-Price-amount {
		font-size: 1.1rem;
	}
	.shop-newitem__item ul li .woocommerce-Price-currencySymbol {
		font-size: 0.95rem;
	}
	.shop-newitem__item .viewmore a {
		padding: 15px 40px;
		font-size: 1.05rem;
		border-radius: 30px;
	}
}

/* --------------------------------------------------
 archive - product
--------------------------------------------------- */

.products-list .product_type_variable {
    display: none;
}

.products-category-title {
	padding: 70px 20px;
    background: var(--color-wh);
}
.products-category-title .en-text {
    font-family: var(--font-en-01);
    font-size: 1.8rem;
	font-weight: 400;
    text-align: center;
}
.products-category-title .jp-text {
    display: block;
	position: relative;
    width: 100%;
	padding-bottom: 18px;
	text-align: center;
    font-size: 0.95rem;
    font-weight: 400;
}
.products-category-title .jp-text::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 30px;
	height: 1px;
	background: var(--color-gy);
	transform: translate(-50%, 0);
}

@media screen and (min-width: 768px) {
    .products-category-title {
        padding: 80px 20px;
    }
}
@media screen and (min-width: 1280px) {
    .products-category-title {
		padding: 110px 20px 80px;
	}
    .products-category-title .en-text {
        font-size: 2.4rem;
        letter-spacing: .05em;
    }
	.products-category-title .jp-text {
        font-size: 1rem;
    }
}

.products-block {
    width: 100%;
}
.products-block__inner {
    display: flex;
    width: 100%;
    padding: 0;
}
@media screen and (min-width: 1024px) {
    .products-block__inner {
        padding: 20px;
    }
}
@media screen and (min-width: 1280px) {
    .products-block__inner {
        padding: 30px;
    }
}

.products-list {
    width: 100%;
}
.products-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1px;
	border-top: 1px solid var(--color-lwgy);
}
.products-list ul li {
    display: flex;
    flex-wrap: wrap;
    width: calc(50% - (1px / 2));
    background: var(--color-wh);
}
@media screen and (min-width: 768px) {
    .products-list ul li {
        width: calc(33.3333% - (2px / 3));
    }
}
@media screen and (min-width: 1024px) {
    .products-list {
        width: calc(100% - 260px);
        margin-left: auto;
        padding-left: 20px;
    }
    /*.products-list ul li {
        width: calc(25% - (3px / 4));
    }*/
}
@media screen and (min-width: 1280px) {
    .products-list {
        width: calc(100% - 280px);
        margin-left: auto;
        padding-left: 30px;
    }
    .products-list ul li {
        width: calc(25% - (4px / 5));
    }
}
@media screen and (min-width: 1601px) {
	.products-list {
		width: calc(100% - 320px);
	}
    .products-list ul li {
        width: calc(16.6666% - (5px / 6));
    }
}

.products-list ul li a {
    z-index: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    transition: .2s;
    overflow: hidden;
}
.products-list ul li a:hover {
    color: var(--color-wh);
}
.products-list ul li a::before {
    z-index: 2;
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: var(--color-bk);
    transition: .5s;
}
.products-list ul li a:hover::before {
    height: 100%;
}

.products-list ul li a img {
    z-index: 3;
    display: block;
    position: relative;
    transition: .4s;
}
.products-list ul li a:hover img {
    transform: scale(0.9);
}

.products-list ul li a h2 {
    z-index: 4;
    display: block;
    position: relative;
    padding: 10px 15px 8px;
    font-size: 0.85rem;
    letter-spacing: normal;
    font-weight: 400;
    line-height: 1.45em;
    text-align: justify;
    word-break: break-all;
    border-top: 1px solid var(--color-wgy);
    transition: .5s
}
.products-list ul li a:hover h2 {
    border-top: 1px solid var(--color-dgy);
}
.products-list ul li a .price {
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-top: auto;
    padding: 0 15px 10px;
    font-size: 0.8rem;
}
.products-list ul li a .price .woocommerce-Price-amount {
    font-size: 0.9rem;
}
.products-list ul li a .price .woocommerce-Price-amount .currency-symbol {
    font-size: 0.8rem;
}
@media screen and (min-width: 768px) {
    .products-list ul li a h2 {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding: 20px 25px 8px;
    }
    .products-list ul li a .price {
        padding: 0 25px 15px;
    }
}

.shop-sidebar {
    display: none;
}
@media screen and (min-width: 1024px) {
    .shop-sidebar {
        display: block;
        width: 260px;
    }
    .shop-sidebar__inner {
        padding: 15px;
        background: var(--color-wh);
    }
    
    .shop-search {
        display: flex;
        justify-content: center;
        margin: 20px 0 40px;
    }
    .shop-search form {
        display: flex;
        width: 100%;
        border: 1px solid #ccc;
        border-radius: 4px;
        overflow: hidden;
        background-color: #fff;
    }
    .shop-search input[type="search"] {
        width: calc(100% - 60px);
        padding: 8px 12px;
        border: none;
        font-size: 0.9rem!important;
		line-height: 1;
        outline: none;
    }
    .shop-search button {
        width: 60px;
        padding: 0 10px;
        border: none;
        background-color: var(--color-bl);
        color: #fff;
		font-size: 0.85rem!important;
		cursor: pointer;
		transition: background-color 0.3s ease;
        white-space: nowrap;
	}
	.shop-search button:hover {
		background-color: #005f8d;
	}
    .shop-category > ul {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .shop-category > ul > li > a {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 2px 0 4px;
        font-size: 0.9rem;
        border-bottom: 1px solid var(--color-wgy);    
    }
    .shop-category > ul > li > a span.icon {
        width: 30px;
    }
    .shop-sidebar__inner .child {
        padding: 10px 0 20px 15px;
    }
    .shop-sidebar__inner .child > ul {
        display: flex;
        flex-direction: column;
    }
    .shop-sidebar__inner .child > ul > li > a {
        display: flex;
        align-items: center;
        font-size: 0.8rem;
    }
}
@media screen and (min-width: 1280px) {
    .shop-sidebar {
		width: 280px;
    }
    .shop-sidebar__inner {
        padding: 20px;
        background: var(--color-wh);
    }
}
@media screen and (min-width: 1601px) {
	.shop-sidebar {
		width: 320px;
    }
    .shop-category > ul > li > a {
        font-size: 0.95rem;
    }
    .shop-sidebar__inner .child > ul > li > a {
        font-size: 0.85rem;
    }
}

/* --------------------------------------------------
 single - product
--------------------------------------------------- */

.product-item {
    display: flex;
    flex-direction: column;
    width: 100%;
}
@media screen and (min-width: 768px) {
    .product-item {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 30px;
        padding: 60px;
    }
}
@media screen and (min-width: 1024px) {
    .product-item {
        gap: 60px;
        padding: 100px;
    }
}
@media screen and (min-width: 1280px) {
    .product-item {
        gap: 100px;
        max-width: 1400px;
        margin: auto;
        padding: 100px;
    }
}

#main-carousel .splide__arrow {
  background: rgba(255, 255, 255, 0);
  color: #fff;
  border: none;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  transition: background 0.3s;
  z-index: 10;
}

#main-carousel .splide__arrow:hover {
  background: rgba(255, 255, 255, 0.8);
}

#main-carousel .splide__arrow--prev {
  left: 15px;
}

#main-carousel .splide__arrow--next {
  right: 15px;
}

#main-carousel .splide__arrow svg {
  width: 14px;
  height: 14px;
  fill: #363636;
}

.product-image {
    padding: 30px 20px 0;
}
.product-image__thumb {
    padding-top: 10px;
}
.product-image__thumb ul {
    display: flex;
    gap: 0;
}
.product-image__thumb ul li {
    margin: 0;
    width: 16.6666%;
    border-color: #fff!important;
    border-width: 0!important;
}
.product-image__thumb .is-active {
    border-width: 1px!important;
    border-color: #000!important;
}
@media screen and (min-width: 768px) {
    .product-image {
        width: calc(100% - 350px);
        padding: 0;
    }
}
@media screen and (min-width: 1024px) {
    .product-image {
        width: calc(100% - 380px);
    }
}
@media screen and (min-width: 1280px) {
    .product-image {
        width: calc(100% - 620px);
    }
}

.product-summary {
    padding: 20px;
}
.product-summary .sku_wrapper {
    font-size: 0.8rem;
    color: #777777;
    padding-bottom: 15px;
}

.product-summary h1 {
    font-size: 1.2rem;
    font-weight: 400;
}
@media screen and (min-width: 768px) {
    .product-summary {
        width: 320px;
        padding: 0;
    }
}
@media screen and (min-width: 1024px) {
    .product-summary {
        padding: 40px 0 0;
    }
}
@media screen and (min-width: 1280px) {
    .product-summary {
        width: 520px;
    }
    .product-summary h1 {
        font-size: 1.5rem;
        padding-bottom: 15px;
    }
}
.product-attention {
    padding-top: 30px;
}
.product-attention p {
    font-size: 0.85rem;
    line-height: 1.7;
    text-align: justify;
    color: #777777;
}
@media screen and (min-width: 768px) {
    .product-attention {
        padding-top: 40px;
    }
    .product-attention p {
        font-size: 0.9rem;
    }
}
@media screen and (min-width: 1024px) {
    .product-attention {
        padding-top: 40px;
    }
    .product-attention p {
        font-size: 0.8rem;
    }
}




.product-meta {
    width: 100%;
    padding: 20px;
}
@media screen and (min-width: 768px) {
    .product-meta {
        padding: 0;
    }
}

.variations {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px 0;
}
.variation-option .value ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%;
}
.variation-option .value ul li {
    width: calc(16.6666% - ((10px * 5) / 6));
    cursor: pointer;
}
.variation-option .value ul li.selected {
    border: 1px solid #000;
}
.variation-option .value ul[aria-label="size"],
.variation-option .value ul[aria-label="サイズ"] {
    gap: 6px;
}
.variation-option .value ul[aria-label="size"] li,
.variation-option .value ul[aria-label="サイズ"] li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(12.5% - ((6px * 7) / 8));
    aspect-ratio: 1 / 1;
    background: var(--color-wh);
    font-family: var(--font-en-03);
    font-size: 0.9rem;
}
.variation-option .value ul[aria-label="size"] li.selected,
.variation-option .value ul[aria-label="サイズ"] li.selected {
    border: 0;
    background: var(--color-bk);
    color: var(--color-wh);
}
@media screen and (min-width: 768px) {
    .variation-option .value ul li {
        width: calc(20% - ((10px * 4) / 5));
    }
    .variation-option .value ul[aria-label="size"],
    .variation-option .value ul[aria-label="サイズ"] {
        gap: 10px;
    }
    .variation-option .value ul[aria-label="size"] li,
    .variation-option .value ul[aria-label="サイズ"] li {
        width: calc(16.6666% - ((10px * 5) / 6));
        font-size: 0.9rem;
    }
}
@media screen and (min-width: 1280px) {
    .variation-option .value ul li {
        width: calc(14.285% - ((10px * 6) / 7));
    }
    .variation-option .value ul[aria-label="size"],
    .variation-option .value ul[aria-label="サイズ"] {
        gap: 10px;
    }
    .variation-option .value ul[aria-label="size"] li,
    .variation-option .value ul[aria-label="サイズ"] li {
        width: calc(12.5% - ((10px * 7) / 8));
        font-size: 0.9rem;
    }
}

.variations_button {
    display: flex;
}
.variations_button .plus,
.variations_button .minus {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 30px;
    height: 30px;
    border: 0;
    background: var(--color-lgy);
}
.variations_button .plus {
    border-left: 1px solid var(--color-wgy);
}
.variations_button .minus {
    border-right: 1px solid var(--color-wgy);
}
.variations_button .plus::before,
.variations_button .plus::after,
.variations_button .minus::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--color-bk);
}
.variations_button .plus::before {
    width: 10px;
    height: 1px;
}
.variations_button .plus::after {
    width: 1px;
    height: 10px;
}
.variations_button .minus::before {
    width: 10px;
    height: 1px;
}
.variations_button input.input-text {
    width: 80px;
    height: 30px;
    border-radius: 0;
    border: 0;
    font-family: var(--font-en-03);
    font-size: 0.9rem;
    text-align: center;
}
.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
    -moz-appearance:textfield;
}
.variations_button .single_add_to_cart_button {
    width: calc(100% - 160px);
    height: 30px;
    line-height: 30px;
    margin-left: auto;
    background: var(--color-bk);
    color: var(--color-wh);
    border: 0;
    font-size: 0.9rem;
}
@media screen and (min-width: 1280px) {
    .variations_button .plus,
    .variations_button .minus {
        width: 45px;
        height: 45px;
    }
    .variations_button .plus::before {
        width: 14px;
    }
    .variations_button .plus::after {
        height: 14px;
}
    .variations_button .minus::before {
        width: 14px;
    }
    .variations_button input.input-text {
        width: 90px;
        height: 45px;
        font-size: 0.95rem;
    }
    .variations_button .single_add_to_cart_button {
        width: calc(100% - 220px);
        height: 45px;
        line-height: 45px;
        font-size: 0.95rem;
    }
}

.woocommerce-Price-amount {
    font-family: var(--font-en-03);
    font-size: 1.3rem;
}
.product-price .currency-symbol {
    margin-left: 5px;
    font-size: 0.8rem;
}
@media screen and (min-width: 1280px) {
    .woocommerce-Price-amount {
        font-size: 1.4rem;
    }
    .product-price .currency-symbol {
        font-size: 0.85rem;
    }
}

.woocommerce-variation {
    display: flex;
    align-items: center;
    padding-bottom: 15px;
}
.woocommerce-variation-price {
    display: inline;
    margin-right: 15px;
    font-family: var(--font-en-03);
    font-size: 1.3rem;
}
.woocommerce-variation-price span.currency-symbol {
    margin-left: 5px;
    font-size: 0.8rem;
}
.woocommerce-variation-availability {
    font-size: 0.8rem;
    color: var(--color-dgy);
}
.out-of-stock {
    background: var(--color-bl);
    color: var(--color-wh);
    padding: 5px 10px;
    line-height: 1;
}
.reset_variations {
    display: none;
}
@media screen and (min-width: 1280px) {
    .woocommerce-variation {
        padding-top: 15px;
    }
    .woocommerce-variation-price {
        font-size: 1.4rem;
    }
    .woocommerce-variation-price span.currency-symbol {
        font-size: 0.85rem;
    }
    .woocommerce-variation-availability {
        margin-top: 6px;
        font-size: 0.9rem;
    }
    .out-of-stock {
        padding: 3px 10px 5px;
        font-size: 0.8rem;
    }
}

.p-tabs {
    margin: 20px 0;
}
.p-tab {
    display: inline-block;
    padding: 10px 20px;
    cursor: pointer;
    background-color: #f0f0f0;
    font-weight: bold;
    text-align: center;
}
.p-tab:hover {
    background-color: #ddd;
}
.p-tab.active {
    background-color: var(--color-bl);
    color: var(--color-wh);
}
.p-content {
    display: none;
    padding: 20px 0;
    border-top: 1px solid #ccc;
}
.p-content.active {
    display: block;
}
.p-content__inner {
    padding: 20px;
    background: var(--color-wh);
}
.p-content__inner p {
    padding-top: 25px;
    font-size: 0.9rem;
}
.p-content__inner p:nth-of-type(1) {
    padding-top: 0;
}
@media screen and (min-width: 1280px) {
    .p-content__inner {
        padding: 40px;
        border-radius: 6px;
    }
}

.related-products {
    position: relative;
    width: 100%;
}
.related-products__inner {
    padding-bottom: 60px;
}
.related-products__inner h2 {
    padding-bottom: 30px;
    text-align: center;
    font-family: var(--font-en-01);
    font-size: 1.6rem;
    color: var(--color-bl);
}
@media screen and (min-width: 768px) {
    .related-products__inner {
        padding-top: 10px;
    }
    .related-products__inner h2 {
        padding-bottom: 50px;
        font-size: 2rem;
    }
}
@media screen and (min-width: 1280px) {
    .related-products__inner {
        padding-top: 10px;
        padding-bottom: 90px;
    }
    .related-products__inner h2 {
        padding-bottom: 70px;
        font-size: 2.4rem;
    }
}
.recommend__splide {
    z-index: 7;
    position: relative;
}
.related-product__link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.related-product__link .related-product__desc {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.related-product__link .related-product__title {
    font-size: 0.8rem;
    line-height: 1.5;
}
.related-product__link .price {
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-top: auto;
    padding: 0 15px 10px;
    font-size: 0.8rem;
}
.related-product__link .price .woocommerce-Price-amount {
    font-size: 0.9rem;
}
.related-product__link .price .woocommerce-Price-amount .currency-symbol {
    font-size: 0.8rem;
}

.recommend__splide .splide__pagination {
    left: -140px;
    bottom: -47px;
}
.recommend__splide .splide__pagination__page {
    width: 9px;
    height: 9px;
    margin: 3px 4px;
    background: var(--color-wh);
    border: 1px solid var(--color-theme-03);
}
.recommend__splide .splide__pagination__page.is-active {
    background: var(--color-theme-03);
    border: 1px solid var(--color-theme-03);
    transform: scale(1.0);
}
.recommend__splide .arrow {
    position: absolute;
    bottom: -40px;
    right: 0;
    width: 100px;
}
.recommend__splide .splide__arrow {
    background: var(--color-theme-03);
}
.recommend__splide .splide__arrow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 1px;
    background: var(--color-base);
    transform: translate(-50%, -50%);
}
.recommend__splide .splide__arrow::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    border-top: 1px solid var(--color-base);
    border-left: 1px solid var(--color-base);
}
.recommend__splide .splide__arrow--prev::after {
    transform: translate(-100%, -50%) rotate(-45deg);
}
.recommend__splide .splide__arrow--next::after {
    transform: translate(calc(50% - 2.5px), -50%) rotate(135deg);
}
@media screen and (min-width: 768px) {
    .recommend__splide .arrow {
        bottom: -60px;
        right: 40px;
        width: 140px;
    }
    .recommend__splide .splide__arrow {
        width: 50px;
        height: 50px;
    }
}

/* --------------------------------------------------
 registration-thanks
--------------------------------------------------- */

.registration-thanks {
    width: 100%;
}
.registration-thanks__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    width: 100%;
    padding: 60px 20px 40px;
}
.registration-thanks__inner h1 {
    font-size: 1.3rem;
    font-weight: 500;
}
.registration-thanks__inner .text p {
    text-align: justify;
    font-size: 0.95rem;
    line-height: 2;
}

@media screen and (min-width: 768px) {
    .registration-thanks__inner {
        padding: 110px 40px 90px;
    }
    .registration-thanks__inner .text {
        padding: 50px;
        background: var(--color-wh);
    }
}
@media screen and (min-width: 1024px) {
    .registration-thanks__inner {
        gap: 50px;
        max-width: 950px;
        margin: auto;
        padding: 160px 40px 140px;
    }
    .registration-thanks__inner .text {
        padding: 90px 90px 80px;
        background: var(--color-wh);
    }
    .registration-thanks__inner h1 {
        font-size: 1.4rem;
    }
    .registration-thanks__inner .text p {
        font-size: 1rem;
    }
}


/* --------------------------------------------------
 woocommerse setting
--------------------------------------------------- */

.page-head-text {
    padding: 40px 20px 0;
}
.page-head-text h2 {
    padding-bottom: 8px;
    font-size: 1.1rem;
    letter-spacing: .1em;
    border-bottom: 1px solid var(--color-gy);
}

.wp-block-woocommerce-coming-soon {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 500px;
    padding: 60px 20px 0;
}
.wp-block-woocommerce-coming-soon h1 {
    margin: 0;
    padding-bottom: 15px;
    font-family: var(--font-en-01);
    font-weight: 500;
    letter-spacing: .05em;
    text-indent: .05em;
    text-align: center;
}
.wp-block-woocommerce-coming-soon p {
    margin: 0;
    padding: 0;
    font-size: 0.85rem;
    line-height: 2;
    text-align: center
}
@media screen and (min-width: 768px) {
    .wp-block-woocommerce-coming-soon {
        height: 800px;
    }
    .wp-block-woocommerce-coming-soon h1 {
        font-size: 2.3rem;
    }
}
@media screen and (min-width: 1280px) {
    .wp-block-woocommerce-coming-soon {
        height: 1000px;
    }
    .wp-block-woocommerce-coming-soon h1 {
        font-size: 2.8rem;
    }
}

.my-account-head,
.woocommerce-message {
    display: none;
}

.my-account-desc {
    padding: 20px;
}
@media screen and (min-width: 768px) {
    .my-account-desc {
        padding: 60px 40px;
    }
}
@media screen and (min-width: 1280px) {
    .my-account-desc {
        max-width: 1400px;
        margin: auto;
        padding: 130px 40px 120px;
    }
}
#customer_login h2 {
    margin-bottom: -20px;
    font-size: 1.1rem;
}
.woocommerce-form p.form-row .woocommerce-form-login__submit {
    margin-top: 12px;
}
.woocommerce-form p.form-row .woocommerce-form__label {
    margin-top: 14px;
}
.woocommerce-LostPassword {
    padding-top: 10px;
}
.woocommerce-LostPassword a {
    font-size: 0.85rem;
    text-decoration: underline;
}
.woocommerce-privacy-policy-text p {
    padding: 20px 0;
    font-size: 0.8rem;
    line-height: 1.4;
    text-align: justify;
}
.woocommerce-form p.form-row .woocommerce-form-login__submit,
.woocommerce-form p.form-row .woocommerce-form-register__submit {
    background: var(--color-bk);
    color: var(--color-wh);
}

.woocommerce-MyAccount-navigation {
    padding: 20px 0;
}
.woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.woocommerce-MyAccount-navigation ul li {
    display: flex;
    align-items: center;
    width: calc(50% - 5px);
}
.woocommerce-MyAccount-navigation ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 5px;
    background: var(--color-wh);
}
.woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--color-bl);
    color: var(--color-wh);
}
@media screen and (min-width: 768px) {
    .woocommerce-MyAccount-navigation ul li {
        width: calc(33.3333% - (20px / 3));
    }
    .woocommerce-MyAccount-navigation ul li a {
        padding: 10px;
        font-size: 0.9rem;
    }
}
@media screen and (min-width: 1024px) {
    .woocommerce-MyAccount-navigation ul li {
        width: calc(16.6666% - (50px / 6));
    }
}


.woocommerce-MyAccount-content {
    padding: 25px 0 40px;
}
.woocommerce-MyAccount-content > p mark {
    background: none;
    font-weight: 700;
    color: var(--color-rd)!important;
}

.woocommerce-MyAccount-content form h2 {
    font-size: 1rem;
}
.woocommerce-address-fields #billing_country_field {
    display: none;
}
.woocommerce-address-fields__field-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.woocommerce-address-fields__field-wrapper .form-row {
	width: calc(50% - 5px);
}
.woocommerce-address-fields__field-wrapper .form-row-wide {
	width: 100%!important;
}
.woocommerce-address-fields__field-wrapper .woocommerce-input-wrapper {
	width: 100%;
	background: #ddd;
}
.woocommerce-address-fields__field-wrapper input {
	width: 100%;
    border: 1px solid var(--color-lgy)!important;
    font-size: 0.95rem!important;
}

.woocommerce-order-details,
.woocommerce-customer-details {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.woocommerce-order-details {
    padding-top: 40px;
}
.woocommerce-order-details h2,
.woocommerce-customer-details h2 {
    font-size: 1rem;
}
.woocommerce-table--order-details tr.woocommerce-table__line-item td.woocommerce-table__product-name {
    font-size: 0.8rem;
}
.woocommerce-table--order-details tr.woocommerce-table__line-item td.woocommerce-table__product-name a {
    text-decoration: underline;
}
.woocommerce-table--order-details td .woocommerce-Price-amount {
    font-size: 1.2rem;
    font-weight: normal!important;
}
.woocommerce-table--order-details td .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
    font-size: 0.95rem;
    font-weight: normal!important;
}
.woocommerce-table--order-details tfoot tr:nth-child(2) td {
    font-size: 0.9rem;
    font-weight: normal!important;
}


.woocommerce-orders-table {
    border: 0!important;
}
.woocommerce-orders-table tbody {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}
.woocommerce-orders-table tbody tr th {
    display: block!important;
    width: 100%;
    margin-bottom: 15px;
    background: var(--color-bk);
    border-top: 0!important;
}
.woocommerce-orders-table tbody tr th a {
    color: var(--color-wh);
    font-size: 0.95rem!important;
    line-height: 1;
    padding: 10px;
}
.woocommerce-orders-table tbody tr td {
    display: flex;
    align-items: center;
    position: relative;
    padding: 8px!important;
    background: none!important;
    border-top: 0!important;
    border-bottom: 1px solid var(--color-wh);
    font-size: 0.95rem!important;
}
.woocommerce-orders-table tbody tr td .woocommerce-Price-amount {
    font-size: 110%!important;
}
.woocommerce-orders-table tbody tr td .woocommerce-Price-currencySymbol {
    font-size: 100%!important;
}
.woocommerce-orders-table tbody tr td::before {
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translate(0, -50%);
    font-size: 0.9rem!important;
    font-weight: 500;
}
@media screen and (min-width: 1024px) {
    .woocommerce-orders-table thead {
        display: table;
        width: 100%;
    }
    .woocommerce-orders-table thead tr th {
        width: 20%;
        text-align: center;
    }
    .woocommerce-orders-table tbody {
        display: table;
        width: 100%;
    }
    .woocommerce-orders-table tbody tr th {
        display: table-cell!important;
        border-top: 0!important;
        border-bottom: 1px solid var(--color-wh);
        background: none;
        padding: 20px 8px 10px!important;
    }
    .woocommerce-orders-table tbody tr th a {
        color: var(--color-bk);
    }
    .woocommerce-orders-table tbody tr td {
        display: table-cell;
        padding: 20px 8px 10px!important;
    }
    .woocommerce-orders-table tbody tr td a {
        font-size: 0.8rem!important;
    }
    .woocommerce-orders-table tbody tr th,
    .woocommerce-orders-table tbody tr td {
        width: 20%;
        text-align: center;
    }
}

.woocommerce-Addresses {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}
.woocommerce-Address {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}
.woocommerce-Address-title {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
}
.woocommerce-Address-title h2 {
    display: block;
    font-size: 1rem;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--color-gy);
    width: 100%;
}
.woocommerce-Address-title a {
    margin-left: auto;
    padding: 8px;
    background: var(--color-bk);
    color: var(--color-wh);
    font-size: 0.85rem;
    line-height: 1;
}
.woocommerce-Address address {
	padding: 10px;
    background: var(--color-wh);
    font-style: normal;
    width: 100%;
}
.woocommerce-Address address a {
	display: inline;
}
@media screen and (min-width: 768px) {
    .woocommerce-Address address {
        padding: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .woocommerce-Addresses {
        flex-direction: row;
        gap: 0;
        padding-top: 40px;
    }
    .woocommerce-Address {
        width: calc(50% - 20px);
    }
    .col-2.woocommerce-Address {
        margin-left: auto;
    }
}

.woocommerce-EditAccountForm input {
    border: 1px solid var(--color-lgy)!important;
    font-size: 0.95rem!important;
}
.woocommerce-EditAccountForm .woocommerce-form-row span em {
    display: block;
    padding: 10px 0 0;
    font-size: 0.85rem!important;
    font-style: normal;
    line-height: 1.4;
    text-align: justify;
}
.woocommerce-EditAccountForm fieldset {
    margin-bottom: 20px;
    padding: 15px;
}
.woocommerce-EditAccountForm fieldset label {
    font-size: 0.85rem;
}
.woocommerce-EditAccountForm .button {
    background: var(--color-bk)!important;
    color: var(--color-wh)!important;
    font-size: 0.9rem!important;
    line-height: 1!important;
    font-weight: 500!important;
    float: right;
}
@media screen and (min-width: 1024px) {
    .woocommerce-EditAccountForm {
        margin-top: 30px;
        padding: 50px 80px 80px;
        background: var(--color-wgy);
    }
    .woocommerce-EditAccountForm input {
        padding: 12px!important;
    }
    .woocommerce-EditAccountForm fieldset {
        margin: 25px 0;
        padding: 30px;
    }
    .woocommerce-EditAccountForm fieldset label {
        font-size: 0.95rem;
    }
    .woocommerce-form-row--first,
    .woocommerce-form-row--last {
        width: calc(50% - 10px)!important;
    }
}

.cart-head {
    width: 100%;
    max-width: 1400px;
    margin: auto;
    padding: 40px 20px 20px;
}
.cart-head h2 {
    padding: 5px;
    font-size: 1.1rem;
    letter-spacing: normal;
    letter-spacing: .05em;
}
.cart-desc {
    width: 100%;
    max-width: 1400px;
    margin: auto;
    padding: 0 20px 60px;
}
.wp-block-woocommerce-empty-cart-block {
    padding-bottom: 60px;
}
.wp-block-woocommerce-empty-cart-block p {
    padding: 0 8px;
}

.cart-desc .cart-empty {
	padding: 8px;
}
.cart-desc .return-to-shop {
	padding: 10px 8px;
}
.cart-desc .return-to-shop a {
	position: relative;
	padding: 10px 10px 10px 35px;
	background: var(--color-bk);
	color: var(--color-wh);
	transition: .3s;
}
.cart-desc .return-to-shop a:hover {
	background: var(--color-dgy);
	color: var(--color-wh);
}
.cart-desc .return-to-shop a::before,
.cart-desc .return-to-shop a::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 8px;
}
.cart-desc .return-to-shop a::before {
	width: 4px;
	height: 4px;
	border-top: 1px solid var(--color-wh);
	border-left: 1px solid var(--color-wh);
	transform: translate(0, -50%) rotate(-45deg);
}
.cart-desc .return-to-shop a::after {
	width: 15px;
	height: 1px;
	background: var(--color-wh);
	transform: translate(0, -50%);
}
@media screen and (min-width: 768px) {
    .cart-head {
        padding: 60px 40px 20px;
    }
    .cart-desc {
		padding: 20px 40px 80px;
    }
	.cart-desc .return-to-shop a {
		padding: 15px 15px 15px 38px;
	}
	.cart-desc .return-to-shop a::before,
	.cart-desc .return-to-shop a::after {
		left: 12px;
	}
    .wp-block-woocommerce-empty-cart-block {
        padding-bottom: 90px;
    }
}

.cart-desc .shop_table .cart_item td {
	padding: 15px;
}
.cart-desc .shop_table .cart_item .product-thumbnail {
	display: block!important;
}
.cart-desc .shop_table .cart_item .product-thumbnail::before {
	display: none;
}
.cart-desc .shop_table .cart_item .product-thumbnail img {
	max-width: 120px;
	margin: auto;
}
.cart-desc .shop_table .cart_item .product-name,
.cart-desc .shop_table .cart_item .product-price,
.cart-desc .shop_table .cart_item .product-quantity,
.cart-desc .shop_table .cart_item .product-subtotal {
	display: flex;
	justify-content: flex-start;
	gap: 15px;
	width: 100%;
}
.cart-desc .shop_table .cart_item .product-name {
	font-size: 0.8rem;
}
.cart-desc .shop_table .cart_item .product-name::before,
.cart-desc .shop_table .cart_item .product-price::before,
.cart-desc .shop_table .cart_item .product-quantity::before,
.cart-desc .shop_table .cart_item .product-subtotal::before {
	width: 90px;
	font-size: 0.95rem;
	text-align: left;
}
.cart-desc .shop_table .cart_item .product-name a {
	text-align: left;
}
.cart-desc .shop_table .cart_item .product-price span.woocommerce-Price-amount,
.cart-desc .shop_table .cart_item .product-subtotal span.woocommerce-Price-amount,
.cart-desc .shop_table .cart_item .product-quantity .quantity {
	margin-left: auto;
}
.cart-desc .shop_table .cart_item .product-price span.woocommerce-Price-amount,
.cart-desc .shop_table .cart_item .product-subtotal span.woocommerce-Price-amount {
    font-size: 1.1rem;
}
.cart-desc .shop_table .cart_item .product-price span.woocommerce-Price-amount span.woocommerce-Price-currencySymbol,
.cart-desc .shop_table .cart_item .product-subtotal span.woocommerce-Price-amount span.woocommerce-Price-currencySymbol {
    font-size: 0.9rem;
}

.cart-desc .shop_table .cart_item .product-remove {
	
}
.cart-desc .shop_table .cart_item .product-remove a {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 100%;
	padding: 20px;
	background: var(--color-dgy);
	color: var(--color-wh)!important;
	border-radius: 0;
}
.cart-desc .shop_table .cart_item .product-remove a::before {
	content: "商品を削除する";
	font-size: 0.85rem;
	margin-right: 10px;
}
.cart-desc .shop_table tr td.actions {
	padding: 20px 12px;
}
.cart-desc .shop_table tr td .coupon {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 12px;
	width: 100%;
}
.cart-desc .shop_table tr td .coupon::before {
	display: none;
}
.cart-desc .shop_table tr td .coupon label {
	width: 70px;
}
.cart-desc .shop_table tr td .coupon input#coupon_code {
	width: calc(100% - 100px);
	padding: 8px;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	outline: none !important;
	border: 1px solid #ccc;
	background: #fff;
	border-radius: 0!important;
}
.cart-desc .shop_table tr td .coupon input#coupon_code:focus {
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
	outline: none !important;
	border-color: #007cba;
	background: #fff;
	border-radius: 0!important;
}
.cart-desc .shop_table tr td .coupon button.button {
	margin: 5px 0;
	font-size: 0.9rem!important;
	background: var(--color-dgy);
	color: var(--color-wh);
}
.cart-desc .shop_table tr td button[name="update_cart"].button {
	background: none;
	margin-top: 15px;
	padding: 10px;
	border-top: 1px solid var(--color-bk);
	border-bottom: 1px solid var(--color-bk);
	font-size: 1rem;
	font-weight: normal;
	color: var(--color-bk);
	opacity: 1;
	border-radius: 0;
}
.cart-desc .shop_table tr td .wps_wpr_apply_custom_points {
	padding: 20px 0;
}
.cart_totals.calculated_shipping {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.cart_totals.calculated_shipping h2 {
	padding: 5px;
    font-size: 1.1rem;
    letter-spacing: normal;
    letter-spacing: .05em;
	border-bottom: 1px solid var(--color-bk);
}
.cart_totals.calculated_shipping table tbody tr td {
	padding: 12px;
}
.cart_totals.calculated_shipping table tbody tr td .woocommerce-Price-amount {
	font-size: 1rem;
}
.cart_totals.calculated_shipping table tbody tr td .woocommerce-Price-currencySymbol {
	font-size: 0.9rem;
}

.woocommerce-shipping-totals.shipping td {
	display: flex!important;
	flex-direction: column!important;
	align-items: flex-start;
	gap: 15px;
}
.cart-desc .woocommerce-shipping-totals.shipping td::before {
	
}
.cart-desc .woocommerce-shipping-methods {
	display: flex!important;
	flex-direction: column!important;
	align-items: flex-start;
}
.cart-desc .woocommerce-shipping-methods li {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
    font-size: 0.9rem;
}
.cart-desc .woocommerce-shipping-destination,
.cart-desc .woocommerce-shipping-calculator {
	display: none;
}

.cart-desc .woocommerce-shipping-methods li .woocommerce-Price-amount {
    font-size: 1.1rem;
    font-weight: normal!important;
}
.cart-desc .woocommerce-shipping-methods li .woocommerce-Price-amount span.woocommerce-Price-currencySymbol {
    font-size: 0.9rem;
}

.cart-desc .woocommerce-cart-form {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.cart-desc .woocommerce-cart-form .points-discount {
	display: none;
}
.cart-desc .wc-proceed-to-checkout {
	display: flex;
	justify-content: center;
}
.cart-desc .wc-proceed-to-checkout a {
	background: var(--color-rd)!important;
}

.cart-desc .cart_totals {
    width: 100%;
}
.cart-desc .cart_totals h2 {
    padding-bottom: 8px;
    font-size: 1rem;
}
.cart-desc .cart_totals .cart-subtotal .woocommerce-Price-amount {
    font-size: 1.1rem;
}
.cart-desc .cart_totals .cart-subtotal .woocommerce-Price-amount span.woocommerce-Price-currencySymbol {
    font-size: 0.9rem;
}
.cart-desc .cart_totals .order-total .woocommerce-Price-amount,
.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount td  .woocommerce-Price-amount {
    font-size: 1.1rem;
}
.cart-desc .cart_totals .order-total .woocommerce-Price-amount span.woocommerce-Price-currencySymbol,
.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount td .woocommerce-Price-amount span.woocommerce-Price-currencySymbol {
    font-size: 0.9rem;
}
.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount td {
    display: flex;
}
.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount td::before {
    margin-right: auto;
}
.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount td .wps_remove_virtual_coupon {
    margin-left: 10px;
    font-size: 0.85rem;
}


@media screen and (min-width: 768px) {
	.cart-desc .woocommerce-cart-form {
		flex-direction: row;
	}
	.cart-desc .woocommerce-cart-form .shop_table {
		width: calc(55% - 10px);
	}
	.cart-desc .woocommerce-cart-form .cart-collaterals {
		width: calc(45% - 10px);
	}
	.cart-desc .woocommerce-cart-form .cart-collaterals h2 {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40px;
		border: 0;
		background: var(--color-bl);
		color: var(--color-wh);
		text-align: center;
        line-height: 1;
        padding: 8px 0 8px;
	}
    .cart-desc .woocommerce-cart-form .cart-collaterals tr td {
        padding: 15px 10px;
    }
	.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table {
		width: 100%;
	}
}
@media screen and (min-width: 1024px) {
	.cart-desc .woocommerce-cart-form {
		flex-direction: column;
	}
	/*.cart-desc .woocommerce-cart-form .shop_table {
		width: 100%;
	}
	.cart-desc .woocommerce-cart-form .shop_table th {
		text-align: center;
	}
	.cart-desc .shop_table .cart_item .product-name,
	.cart-desc .shop_table .cart_item .product-price,
	.cart-desc .shop_table .cart_item .product-quantity,
	.cart-desc .shop_table .cart_item .product-subtotal {
		display: table-cell;
		width: auto;
	}
	.cart-desc .woocommerce-cart-form .shop_table th.product-thumbnail,
	.cart-desc .shop_table .cart_item .product-thumbnail {
		width: 180px;
	}
	.cart-desc .shop_table .cart_item .product-thumbnail img {
		width: 100%;
		max-width: 100%;
	}
	.cart-desc .woocommerce-cart-form .shop_table th.product-price,
	.cart-desc .woocommerce-cart-form .shop_table th.product-subtotal,
	.cart-desc .shop_table .cart_item .product-price,
	.cart-desc .shop_table .cart_item .product-subtotal {
		width: 150px;
		text-align: center;
	}
	.cart-desc .woocommerce-cart-form .shop_table th.product-quantity,
	.cart-desc .shop_table .cart_item .product-quantity {
		width: 100px;
		text-align: center;
	}
	.cart-desc .shop_table .cart_item .woocommerce-Price-amount {
		font-size: 1.05rem;
	}
	.cart-desc .shop_table .cart_item .woocommerce-Price-currencySymbol {
		font-size: 0.9rem;
	}
	.cart-desc .shop_table .cart_item .product-remove a::before {
		display: none;
	}
	
	.cart-desc .woocommerce-cart-form .cart-collaterals {
		width: 100%;
        background: #363636;
        padding: 0;
	}
	.cart-desc .woocommerce-cart-form .cart-collaterals h2 {
		border: 0;
		background: var(--color-bl);
		color: var(--color-wh);
		text-align: center;
	}
	.cart-desc .woocommerce-cart-form .cart-collaterals .shop_table {
		width: 100%;
	}
	.cart-desc .woocommerce-cart-form .shop_table td.actions {
		position: relative;
		width: 100%;
		padding: 40px 20px 80px;
	}
	.cart-desc .woocommerce-cart-form .shop_table td.actions .coupon {
		width: calc(50% - 10px);
	}
	.cart-desc .shop_table tr td .coupon input#coupon_code {
		width: calc(100% - 250px);
	}
	.cart-desc .shop_table tr td .coupon button.button {
		width: 150px;
		margin: 0;
	}
	.cart-desc .shop_table tr td button[name="update_cart"].button {
		position: absolute;
		bottom: 20px;
		left: 20px;
		width: calc(50% - 10px);
	}
	.cart-desc .woocommerce-cart-form .shop_table td.actions .wps_wpr_apply_custom_points {
		width: calc(50% - 10px);
		padding: 0;
		margin: 0;
	}
	.cart-desc .woocommerce-cart-form .shop_table td.actions .wps_wpr_apply_custom_points input.input-text {
		width: calc(100% - 150px)!important;
		background: var(--color-wh)!important;
		border-radius: 0!important;
		border: 1px solid var(--color-dgy)!important;
	}
	.cart-desc .woocommerce-cart-form .shop_table td.actions .wps_wpr_apply_custom_points .button {
		font-size: 0.9rem!important;
		width: 150px!important;
	}
	.cart-collaterals {
		width: 100%!important;
	}
	.cart-collaterals::before {
		display: none;
	}
	.cart_totals.calculated_shipping {
		width: 100%!important;
	}*/
    
    .cart-desc .woocommerce-cart-form .shop_table {
        display: block;
		width: 100%;
	}
    .cart-desc .woocommerce-cart-form .shop_table thead {
        display: block;
        width: 100%;
        border-bottom: 1px solid #ddd;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr {
        display: flex;
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th {
        text-align: center;
        font-weight: 500;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody {
        display: block;
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr {
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item {
        display: flex;
        align-items: center;
        width: 100%;
        border-bottom: 1px solid #ccc;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td {
        border-top: 0;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-thumbnail,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-thumbnail {
        width: 100px;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-name,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-name {
        width: calc(100% - 500px);
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-price,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-price {
        width: 100px;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-quantity,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-quantity {
        width: 100px;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-subtotal,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-subtotal {
        width: 100px;
    }
    .cart-desc .woocommerce-cart-form .shop_table thead tr th.product-remove,
    .cart-desc .woocommerce-cart-form .shop_table tbody tr.cart_item td.product-remove {
        width: 100px;
    }
    .cart-desc .shop_table .cart_item .product-remove a {
        justify-content: center;
        width: auto!important!important;
        padding: 15px;
        background: var(--color-wh);
        color: var(--color-bk)!important;
        font-size: 0.9rem;
        font-weight: 400;
    }
    .cart-desc .shop_table .cart_item .product-remove a::before {
        display: none;
    }
    
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions {
        display: flex;
        align-items: center;
        gap: 15px;
        width: 100%!important;
        max-width: 100%!important;
        margin: 0!important;
        padding: 0;
        padding: 15px 15px 15px 0;
        border: 0;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions .coupon {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        width: auto;
        padding: 0!important;
        order: 1;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions .coupon label {
        display: block;
        margin: 0;
        font-size: 0.8rem;
        white-space: nowrap;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions input.input-text {
        width: 140px!important;
        font-size: 0.9rem!important;
        background: var(--color-wh)!important;
        border-radius: 0!important;
        border: 1px solid var(--color-gy)!important;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions .coupon button[type="submit"] {
        white-space: nowrap;
        font-weight: 400;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions button[name="update_cart"].button {
        display: block;
        width: 200px;
        margin: 0;
        margin-left: auto;
        padding: 15px 10px;
        font-size: 0.8rem!important;
        background: var(--color-gy);
        color: var(--color-wh);
        border: 0;
        order: 3;
        white-space: nowrap;
        border-radius: 4px;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions .wps_wpr_apply_custom_points {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        margin: 0;
        padding: 0;
        order: 2;
    }
    .cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions .wps_wpr_apply_custom_points .wps_cart_points_apply {
        font-size: 0.85rem!important;
        background: var(--color-dgy);
        color: var(--color-wh);
        white-space: nowrap;
        font-weight: 400;
    }
    
    .cart-desc .woocommerce-cart-form .cart-collaterals {
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .cart_totals {
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table,
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody {
        display: block;
        width: 100%;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 0 40px;
        border: 0;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr th,
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr td {
        border: 0;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr th {
        font-size: 0.9rem;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-subtotal {
        border-bottom: 1px solid #ccc;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.cart-discount {
        border-bottom: 1px solid #ccc;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.woocommerce-shipping-totals {
        border-bottom: 1px solid #ccc;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.woocommerce-shipping-totals th {
        width: 80px;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr.order-total {
        background: var(--color-wh);
    }
}
@media screen and (min-width: 1401px) {
    .cart-desc .woocommerce-cart-form {
        display: flex;
        flex-direction: row;
        gap: 30px;
        align-items: flex-start;
        flex-wrap: nowrap;
    }
    .cart-desc .woocommerce-cart-form .shop_table {
        width: calc(100% - 350px);
	}
    /*.cart-desc .woocommerce-cart-form .shop_table tbody tr td.actions {
        min-width: 1320px;
    }*/
    .cart-desc .woocommerce-cart-form .cart-collaterals {
        width: 320px;
    }
    .cart-desc .woocommerce-cart-form .cart-collaterals .shop_table tbody tr {
        padding: 0 10px;
    }
}



.checkout-desc {
    padding: 0 20px;
}
.checkout-desc h2 {
    font-size: 1rem!important;
    font-weight: normal!important;
}
.checkout-desc .icon {
    display: block!important;
    width: 20px!important;
    height: auto!important;
}
@media screen and (min-width: 768px) {
	.checkout-head {
		max-width: 1400px;
		margin: auto;
		padding: 60px 40px 20px;
	}
	.checkout-desc {
		max-width: 1400px;
		margin: auto;
		padding: 0 40px 60px;
	}
}

.wc-block-checkout__shipping-method-option-title-wrapper {
	display: flex!important;
	align-items: center!important;
}
.wc-block-checkout__shipping-method-option-title-wrapper svg {
	width: 28px;
	height: 28px;
	margin-top: 2px;
}
.wc-block-checkout__shipping-method-option-title {
	line-height: 1;
}
.wc-block-components-radio-control__description svg {
	width: 24px;
	height: 24px;
}
.wc-block-components-checkout-return-to-cart-button svg {
	width: 24px;
	height: 24px;
}

.wc-blocks-components-select__container svg {
    width: 20px;
    height: auto;
}

#wps_wpr_button_to_add_points_section {
	padding: 10px 15px 15px;
}
#wps_wpr_button_to_add_points_section a {
	display: inline-block;
	padding: 3px 12px;
	background: var(--color-dgy);
	color: var(--color-wh);
}
.wps_wpr_apply_custom_points {
	padding: 5px 15px 20px;
}

.woocommerce-order {}
.woocommerce-order p.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
	font-size: 0.95rem!important;
	line-height: 1.4;
	text-align: justify;
	padding: 15px 0;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding-top: 15px;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details::before {
	display: none;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li {
	margin: 0;
	padding: 0;
	padding-right: 10px;
	font-size: 0.7rem!important;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong {
	font-size: 0.9rem!important;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong .woocommerce-Price-amount {
	font-size: 0.95rem!important;
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
	font-size: 0.9rem!important;
}
@media screen and (min-width: 1024px) {
	.woocommerce-order {
		max-width: 1200px;
		margin: auto;
		padding: 0 40px;
	}
	.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details {
		gap: 15px;
		padding-top: 15px;
	}
	.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li {
		padding-right: 15px;
		font-size: 0.8rem!important;
	}
	.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong {
		font-size: 1rem!important;
	}
	.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong .woocommerce-Price-amount {
		font-size: 1.05rem!important;
	}
	.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details li strong .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
		font-size: 1rem!important;
	}
}

.wps_ways_to_gain_points_section {
	display: none;
}

.woocommerce form .form-row-first,
.woocommerce-page form .form-row-first,
.woocommerce form .form-row-last,
.woocommerce-page form .form-row-last {
	float: none !important;
}
.woocommerce-EditAccountForm {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.woocommerce-EditAccountForm .woocommerce-form-row {
	width: calc(50% - 5px);
}
.woocommerce-EditAccountForm .woocommerce-form-row--wide {
	width: 100%;
}
.woocommerce-EditAccountForm fieldset {
	width: 100%;
}