﻿
.header_wrap {padding: 24px 0;width: var(--viewportwidth);margin:0 auto;position:relative;}
.header_wrap .site_header {position:absolute;width:100%;display:flex;justify-content:space-between;z-index:1;}
.header_wrap .site_header .header_logo { position: relative; padding: 12px 36px 24px 16px; border-bottom-right-radius: var(--radius-l); background-color: var(--color-white100);}
.header_wrap .site_header .header_logo .curve_position{position:absolute;width:24px;height:24px;background-image:url(/images/common/parts/subtract.svg);background-size:cover; background-repeat:no-repeat;}
.header_wrap .site_header .header_logo .curve_position.right_top{top:0;right:-24px}
.header_wrap .site_header .header_logo .curve_position.left_bottom{bottom:-24px;left:0}
.header_wrap .site_header .header_icons {display: flex;align-items: center;justify-content: flex-end;gap: 14px;padding: 16px 20px;background-color: var(--color-white100);border-radius: var(--radius-m);margin: 24px 24px 0 auto;}
.header_wrap .site_header .header_icons .header_icon {position: relative;color: var(--color-black60);text-align: center;width: 52px;font-size:var(--caption-txtM-size);color: var(--color-black60);}
.header_wrap .site_header .header_icons .header_icon .count {font-size: 8px;transform: scale(.8);line-height: 15px;width: 15px;height: 15px;border-radius: 50%;color: var(--color-white100); background-color: #2DA9BF; position: absolute;top: -6px;right: 12px;text-align: center;}

#topSlider{position:relative;width:100%;height:520px;border-radius:var(--radius-l);overflow:hidden;}                                                                                                                                                                                                                                                 
#topSlider .splide__slide img{height:auto;width:100%}
#topSlider .thumbnail_carousel{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%)}
#topSlider .thumbnail_carousel .splide__slide{border-radius:var(--radius-s);border:solid 1px var(--color-white100);box-sizing:border-box;overflow:hidden}
#topSlider .thumbnail_carousel .splide__slide.is-active{border:solid 2px var(--color-turquoise70)}
#topSlider .thumbnail_carousel .splide__arrow--prev{left:-52px}                                                                                                                                                                                                                                                                                                                                                                
#topSlider .thumbnail_carousel .splide__arrow--next{right:-52px}
#topSlider .thumbnail_carousel .splide__arrows{position:absolute;top:50%;left:0%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);display:flex;justify-content:space-between;width:100%;z-index:2;pointer-events:none;height:36px}
#topSlider .thumbnail_carousel .splide__arrow{width:36px;height:36px;background:var(--color-white100);border:solid 1px var(--color-black30);opacity:1;pointer-events:auto}

.thumbnail_carousel .splide__arrow svg {
    fill: var(--color-turquoise50);
    height: auto;
    width: 12px
}

.shippingfeefreebar {font-size: 14px;line-height: 1.5;color: var(--color-white80);background-color: var(--color-turquoise50);border-radius: 44px;text-align: center;width: var(--viewportwidth);margin: 0 auto;padding: 8px 16px;margin-bottom: 12px;}
.shippingfeefreebar .emph {font-weight: bold;font-size: 16px;line-height: 1.5;letter-spacing: 0.04em;color: var(--color-white100);margin-right: 5px;}

.header_outerwrap.noslider .shippingfeefreebar {margin-top:8px;}
.header_outerwrap.noslider .header_wrap .site_header{ position:static; }
.header_outerwrap.noslider .header_wrap{padding-top:0;}
.header_outerwrap.noslider .header_wrap .site_header .header_icons{ margin-top:0; }
.header_outerwrap.noslider #ImportantNotices {border-top: solid 1px var(--color-black20); border-bottom: solid 1px var(--color-black20); margin-bottom: 24px;}

.search_textarea_wrp { flex: 0 0 auto; color: var(--color-black60); }
.search_textarea_wrp .search_textarea_inner {position:relative;}
.search_textarea_wrp .search_textarea_inner .txtbox_base[name=keywords1] { padding-right: 35px; width: 278px; }
.search_textarea_wrp .search_textarea_inner .searchbtn { position: absolute; left: 250px; top: 8px; }
.inithidden{display:none;}
@keyframes slideopenframe {
    0% { display:unset; width:0; overflow:hidden; }
   100% { display:unset; width:280px; overflow:hidden;   }
}
@keyframes slidecloseframe {
    0% { display: unset; width: 280px; overflow:hidden;  }
    100% { display: none; width: 0; overflow:hidden;   }
}