@charset "UTF-8";

.footer-sns_wrapper	{ width: 100%; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 5%; padding: 60px 5% 70px; background-color: #fff; border-top: 1px solid #eee; position: relative; z-index: 6; }
.footer-sns_wrapper > h5	{ width: 20%; max-width: 140px; line-height: 1; display: -webkit-flex; display: flex; }
.footer-sns_wrapper > h5 a	{ opacity: 1; transition: opacity .6s cubic-bezier(0.215, 0.61, 0.355, 1); }
.footer-sns_wrapper > h5 img	{ width: 100%; line-height: 1; vertical-align: middle; }
.footer-sns-link	{ display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 220px; gap: 13%; list-style: none; }
.footer-sns-link > li	{ flex: 1; display: -webkit-flex; display: flex; }
.footer-sns-link > li a	{ flex: 1; display: -webkit-flex; display: flex; width: 100%; opacity: 1; transition: opacity .6s cubic-bezier(0.215, 0.61, 0.355, 1); }
.footer-sns-link > li img	{ width: 100%; line-height: 1; vertical-align: middle; }
@media (min-width: 980px) { 
	.footer-sns_wrapper > h5 a:hover, 
	.footer-sns-link > li a:hover	{ opacity: .5; }
}
@media (max-width: 580px) { 
	.footer-sns_wrapper	{ flex-direction: column; gap: 20px; padding: 60px 2%; }
	.footer-sns_wrapper > h5	{ width: 70%; max-width: 160px; }
}

.categoryBanner_wrapper	{ width: 100%; position: relative; z-index: 6; background-color: rgba(255,255,255,1); overflow: hidden; }

.section_storeTopBanner	{padding-top: 1.5rem; padding-bottom: 2rem; position: relative; }
.storeTopBanner_new	{ position: absolute; top: calc(1.5rem * -1); right: 1rem; width: 54px; height: 54px; background: #2A292F; display: flex; justify-content: center; align-items: center; color: #ffffff!important; border-radius: 50%; z-index: 1; font-size: 14px; visibility:hidden; }
@media screen and (max-width: 1000px){
	.storeTopBanner_new	{ width:32px; height:32px; font-size:9px; top:calc(1.5rem * -0.5); }
}
.storeTopBannerItem	{ margin-right: 12px !important; }
@media screen and (min-width: 1001px) {
    .storeTopBannerItem	{margin-right: 20px !important; }
}
@media screen and (min-width: 1440px) {
    .storeTopBannerItem	{ margin-right: 30px !important; }
}
.storeTopBanner_image	{ width: 100%; height: auto; }
@media screen and (max-width: 1000px){
	.storeTopBanner_image:hover	{ transform:scale(1); }
}
.storeTopBanner_subtext	{ margin-top: 1rem; font-size: 12px; color: #555555; line-height: 1.5; }
.storeTopBanner_title	{ font-size: 16px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; line-height: 1.5; }
.storeTopBanner_link	{ text-decoration:none; }
.storeTopBanner_link:hover	{ text-decoration:none; }
.storeTopBanner_photo	{ overflow: hidden; }
.top_activity_image	{ width: 100%; height: auto; }
@media screen and (min-width: 1001px) {
    .contents_title {
        margin-top: 2.25rem;
        -webkit-margin-start: 2.5rem;
        margin-inline-start: 2.5rem;
        margin-inline-end: 2.5rem;;
        line-height: 1;
        font-size: 68px;
    }

    .section_storeTopBanner {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .storeTopBanner_title {
        font-size: 20px;
    } 
}

.swiper-horizontal>.swiper-pagination-progressbar, 
.swiper-pagination-progressbar.swiper-pagination-horizontal {
    bottom: 24px!important;
    top: auto!important;
    left: 50%!important;
    -webkit-transform: translateX(-50%)!important;
    -moz-transform: translateX(-50%)!important;
    -ms-transform: translateX(-50%)!important;
    transform: translateX(-50%)!important;
    width: 240px!important;
    height: 1px!important;
}

.swiper-pagination-progressbar {
    background: rgba(255,255,255,0.8)!important;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: #1A1A1A!important;
}

.section_storeTopBanner:hover .swiper-button-prev,
.section_storeTopBanner:hover .swiper-button-next {
    opacity: 1!important;
}
.section_storeTopBanner .swiper-button-prev,
.section_storeTopBanner .swiper-button-next {
    position: absolute;
    top: 40%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0 10px;
    opacity: 0!important;
    -webkit-transition: all 0.3s cubic-bezier(0.65,0,0.35,1);
    transition: all 0.3s cubic-bezier(0.65,0,0.35,1);
}
.section_storeTopBanner .swiper-button-prev:hover,
.section_storeTopBanner .swiper-button-next:hover {
    -webkit-transform: translateY(-50%) scale(1.04);
    transform: translateY(-50%) scale(1.04);
}
.section_storeTopBanner .swiper-button-prev,
.section_storeTopBanner .swiper-button-next{
	pointer-events: all;
	cursor: pointer;
}
.swiper-button-prev,
.swiper-button-next {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    appearance: none;
    align-items: center;
    justify-content: center;
    user-select: none;
    position: relative;
    white-space: nowrap;
    vertical-align: middle;
    outline: 2px solid transparent;
    outline-offset: 2px;
    line-height: 1.2;
    font-weight: var(--chakra-fontWeights-normal);
    transition-property: var(--chakra-transition-property-common);
    transition-duration: var(--chakra-transition-duration-normal);
    font-feature-settings: "palt";
    letter-spacing: 0.08em;
    min-width: 2.5rem;
    font-size: 16px;
    -webkit-padding-start: 1rem;
    padding-inline-start:1rem;
    -webkit-padding-end: 1rem;
    padding-inline-end:1rem;
    color: #ffffff;
    padding: 0px;
    -webkit-transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
    background: #ffffff;
    width: 54px!important;
    height: 54px!important;
    border-radius: 50%;
    -webkit-filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.1));
    filter: drop-shadow(0px 4px 16px rgba(0, 0, 0, 0.1));
}
.swiper-button-prev:after,
.swiper-button-next:after {
    color: #000!important;
    font-size: 16px!important;
}

@media (min-width: 980px) { 
	.storeTopBanner_photo img	{ transition: all .6s; object-fit: cover; opacity: 1; }
	a:hover .storeTopBanner_photo img	{ transform: scale(1.04); opacity: .6; }
}