/*---------------------------------------------------------------------------------------- 

    Utility

----------------------------------------------------------------------------------------*/
@import url("https://use.typekit.net/bpk2aae.css");

.na-df{display:block; }
.na-serif{font-family: serif; letter-spacing: 0.2rem;}
.na-gotham{font-family: "gotham", sans-serif; letter-spacing: 0.4rem;}
.na-w4 { font-weight: 400;}
.na-lt02 { letter-spacing: 0.2em;}
.na-lt05 { letter-spacing: 0.05em;}

/*---------------------------------------------------------------------------------------- 

    上書き用

----------------------------------------------------------------------------------------*/
p { color:#333333 }
.block-category-list--children h2{background: #FAF8F8;}
/*---------------------------------------------------------------------------------------- 

    Utility

----------------------------------------------------------------------------------------*/
.na-sp {display: block;}
.na-pc {display: none;}
.na-w-100{ max-width: 100vw; margin-left: -2.0rem; width: 100vw; height: 100%;}
.na-br{border-radius: 4px; overflow: hidden;}
.na-img img{width: 100%;}
.na-tag{font-size: 1rem; background: #EA9292; padding:0.3rem 1.2rem 0.3rem 1.2rem;border-radius: 100vw;color: white;}
/*---------------------------------------------------------------------------------------- 

    na-mv

----------------------------------------------------------------------------------------*/
.na-mv{max-width: 100vw;margin-left: -2.0rem; width: 100vw;}
/*---------------------------------------------------------------------------------------- 

    na-campaign

----------------------------------------------------------------------------------------*/
.na-campaign{margin: 2.0rem auto;padding: 1.6rem;background: #FCFBFB;display: flex;align-items: center;position: relative;flex-wrap: wrap;border-radius: 4px;overflow: hidden; border: #F3F3F3 1px solid;}
.na-campaign img { height: 100%;position: absolute;right: 0;z-index: 1;}
.na-campaign-title { margin-right: 1.8rem; margin-bottom: 1.0rem; z-index: 2; }
.na-campaign-text  { z-index: 2; font-size: 1.2rem; line-height: 1.4;}
/*---------------------------------------------------------------------------------------- 

    na-pickupitem

----------------------------------------------------------------------------------------*/
.na-pickupitem{padding: 2.8rem 0 5.6rem 0;}
.na-pickupitem-title{ text-align: center; padding-bottom: 2.8rem;}
.na-pickupitem .na-title-en{font-size: 2rem; margin-bottom: .2em;}
.na-pickupitem .na-title-ja{font-size: 1.2rem; naacity: .5;}
/*---------------------------------------------------------------------------------------- 

    na-pickupitem-slide

----------------------------------------------------------------------------------------*/
.na-bg{height: 100%; background: linear-gradient(#faf8f800,#FAF8F8); z-index: 0; position:  absolute; bottom: 0;}
.na-pickupitem-slider{position: relative; width: 100%;}
.na-slide{display: flex; }
.na-slider-image{position: relative;}
.na-slider-badge{position: absolute; left: 0.5rem; tna: 0.5rem; width: 5.5rem; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 100vw; text-align: center; line-height: 1;} 
.na-slider-label{ display: inline-block;}
.na-slider-image {margin-bottom: 1.4rem;}
.na-slider-texts > *{ margin-bottom: 1.4rem;}
.na-slider{ width: 100%; margin: 0 auto; z-index: 2; position: relative;}
.na-slider-inner{width: calc(100% - .8rem); margin: 0 auto;  display: inline-block;}
.na-slider-texts{text-align: center;}
.na-slider-text-cate{naacity: .3; margin-bottom: .5rem; font-size: 1rem;}
.na-slider-text-name{letter-spacing: -0.05em; font-size: 1.35rem;}
.na-slider-text-name .na-num{letter-spacing: 0;}
.na-slider-badge-text{font-size:.8rem; letter-spacing: -0.01em;}
.na-slider-btn{background: #fff; display: inline-flex; align-items: center; padding: 0.4rem 1.0rem; border-radius: 100vw;}
.na-dot{naacity: 0.2;}
.na-dot.dot--active{naacity: 1;}
/*---------------------------------------------------------------------------------------- 

    anchor

----------------------------------------------------------------------------------------*/
.na-anchor{display: flex; flex-wrap: wrap;}
.na-anchor-item{width: 100%;border: #EEEEEE 1px solid; padding: 1rem;}
.na-anchor-inner{display: flex; align-items: center;  justify-content: space-between;}
.na-anchor-img{display: flex; align-items: center; gap: 1.8rem;}
.na-anchor-img img{ width: 6rem; aspect-ratio: 1/1;}
.na-anchor svg{margin: 1rem;}
.na-anchor { gap: 0.8rem 0rem; }
/*---------------------------------------------------------------------------------------- 

    Slider

----------------------------------------------------------------------------------------*/
.na-arrow.na-arrow--left{ background: url(/category/c30/img/common/icon_left.png); left: -1rem; tna: calc((100% - 2.0rem )/ 4);background-size: contain;}
.na-arrow.na-arrow--right{ background: url(/category/c30/img/common/icon_right.png); right: -1rem;tna: calc((100% - 2.0rem )/ 4);background-size: contain;}
.na-arrow--disabled{naacity: .2;}
.na-arrow { width: 9px; height: 13px; position: absolute;   tna: 50%;}
.na-dots{width: 100%; display: flex;justify-content: center; padding: 2rem 0 4.6rem 0;}
.na-dot{width: 8px; height: 8px; margin: 6px; background: #E88B7E; border-radius: 100vw;}
.keen-slider:not([data-keen-slider-disabled]) {-webkit-touch-callout: none;-webkit-tap-highlight-color: transparent; align-content: flex-start; display: flex; overflow: hidden; position: relative; touch-action: pan-y;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none; user-select: none;-khtml-user-select: none; width: 100%}
.keen-slider:not([data-keen-slider-disabled]) .keen-slider__slide { min-height: 100%; overflow: hidden; position: relative; width: 100%}
.keen-slider:not([data-keen-slider-disabled])[data-keen-slider-reverse] {flex-direction: row-reverse}
.keen-slider:not([data-keen-slider-disabled])[data-keen-slider-v] {flex-wrap: wrap}
/*---------------------------------------------------------------------------------------- 

    Responsive

----------------------------------------------------------------------------------------*/
@media screen and (min-width: 980px) {

    .na-w-100{  margin-left: calc((100vw - 980px) / -2); }
    .na-sp { display: none }
    .na-pc { display: block;}


    /**/
    
    /*---------------------------------------------------------------------------------------- 

    utility

    ----------------------------------------------------------------------------------------*/
    .na-tag{font-size: 1.2rem;}


    
    /*---------------------------------------------------------------------------------------- 

    mv

    ----------------------------------------------------------------------------------------*/
    .na-mv{max-width: 100vw;margin-left: 0rem; width: 100%;}
    /*---------------------------------------------------------------------------------------- 

    na-campaign

    ----------------------------------------------------------------------------------------*/
    .na-campaign{margin: 3.2rem auto}
    .na-campaign-title { margin-bottom: 0; }
    .na-campaign-text br { display: none;}
    .na-campaign-text{font-size: 1.4rem;}
    /*---------------------------------------------------------------------------------------- 

        na-pickupitem

    ----------------------------------------------------------------------------------------*/
    .na-pickupitem{padding: 5.6rem 0 8rem 0;}
    .na-pickupitem-title{padding-bottom: 5.6rem;}
    .na-pickupitem .na-title-en{font-size: 2.5rem; margin-bottom: .2em;}
    .na-pickupitem .na-title-ja{font-size:1.2rem; naacity: .5;}
    /*---------------------------------------------------------------------------------------- 

        na-pickupitem-slide
        
    ----------------------------------------------------------------------------------------*/
    .na-slider-badge-text{font-size:1.1rem}
    .na-slider-badge{width: 8rem; line-height: 1.4rem; left: 2rem; tna: 2rem;}
    .na-slider-text-cate{font-size: 1.2rem;}
    .na-slider-text-name {font-size: 2.0rem; letter-spacing: 0.05em;}
    .na-slider-texts > *{ margin-bottom: 2rem;}
    .na-slider-image {margin-bottom: 1.8rem;}
    /**/
    .na-arrow.na-arrow--left{left: -3.5rem; tna:calc((980px - 11rem) / 4)}
    .na-arrow.na-arrow--right{right: -3.5rem;tna:calc((980px - 11rem) / 4)}
    .na-dots{ padding: 4rem 0 5.6rem 0; }
    .na-slider-btn{background: #fff; display: inline-flex; align-items: center; padding: 0.8rem 1.2rem; border-radius: 100vw;}
    .na-slider{ width: calc((100% - 7rem));}
    .na-slider-inner{width: calc(100% - 4rem); }
    /*---------------------------------------------------------------------------------------- 

        na-bnr
        
    ----------------------------------------------------------------------------------------*/
    .na-bnr{margin:4rem auto -3.6rem auto;display: inline-block;}
    .na-anchor{  gap: 0 4rem; flex-wrap: nowrap; margin-bottom: -4rem;}
    .na-anchor-item{  width: 100%;}


    .container h2, .container .h2{font-size: 2rem;}
   
}
@media screen and (min-width: 960px) and (max-width: 980px) {
    .na-w-100{  margin-left: 0; }
}


/*---------------------------------------------------------------------------------------- 

    category btn

----------------------------------------------------------------------------------------*/

.nabtnObj.bsBtn {
  display: flex;
  justify-content: center;
}
.nabtnObj.bsBtn a {
  background: #727272;
  color: #fff;
  padding: 1em 0em 1em;
  line-height: 1;
  border-radius: 100px;
  width: min(100%, 200px);
  display: flex;
  justify-content: center;
  font-size: 14px;
  transition: 0.2s ease;
}
.nabtnObj.bsBtn a::after {
  content: "";
  background: url("/category/c50/img/icon_outerlink.png") no-repeat;
  position: relative;
  background-size: cover;
  width: 1em;
  height: 1em;
  margin-left: 1em;
}
.nabtnObj.bsBtn a:hover {
  text-decoration: none;
  opacity: 0.7;
  transition: 0.2s ease;
}