@charset "UTF-8";

.main_inner {
  overflow-x: hidden;
}
#breadcrumbs {
  width: 140rem;
  margin-inline: auto;
}
.font-jp {
  font-family: "Hiragino Sans","Hiragino Kaku Gothic ProN",sans-serif;
  font-weight: 500;
  font-style: normal;
}
.font-en {
  font-family: "ginger", sans-serif;
  font-weight: 400;
}
@font-face {
  font-family: "ginger";
  font-display: swap;
  font-weight: 700;
  src: url("../font/F37GingerBold.otf") format("opentype");
}

@font-face {
  font-family: "ginger";
  font-display: swap;
  font-weight: 400;
  src: url("../font/F37GingerRegular.ttf") format("truetype");
}






/*
///////////////////////////////////////////////////////////////////////////////////////
  ベーススタイル
///////////////////////////////////////////////////////////////////////////////////////
*/
.barbour_240924 {
  overflow: hidden;
}
.txt_Box02{
  text-align: justify;
  line-height: 1.8695652174;
}
.cont_inner {
  max-width: 960px;
  width: 100%;
  margin: 0 auto;
}
.credit a {
  font-size: 2rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0 0.7rem;
}
.gridArea{
  display: grid;
  margin: 0 auto;
}
.buy_btn {
  width: 4.5rem;
  display: inline-block;
}
.buy_btn01{
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  background-color: #295237;
}
.buy_btn01 span{
  color: #fff;
  letter-spacing: 0.00143em;
}
@media screen and (min-width: 768px) {
  .flexAreaPc {
    display: flex;
    margin: 0 auto;
  }
  .gridAreaPc{
    display: grid;
    margin: 0 auto;
  }
  .cont_inner {
    max-width: none;
  }
  .txt_Box02{
    font-size: 1.3rem;
    letter-spacing: 0.0075em;
    text-align: left;
  }
  .buy_btn01{
    width: 7.5rem;
    height: 3rem;
    margin: 2rem 0 0;
  }
  .buy_btn01 span{
    font-size: 1.5rem;
    font-weight: 200;
  }
}
@media screen and (max-width: 767px) {
  .credit ul li {
    font-size: calc(31 * (100vw / 750));
  }
  .credit a {
    font-size: calc(30 * (100vw / 750));
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 0 calc(8 * (100vw / 750));
  }
  .txt_Box02{
    font-size: calc(23* (100vw / 750));
    width: calc(680*(100vw / 750));
    text-align: center;
  }
  .buy_btn01{
    width: calc(115*(100vw / 750));
    height: calc(44*(100vw / 750));
    margin: calc(50*(100vw / 750)) auto 0;
  }
  .buy_btn01 span{
    font-size: calc(23* (100vw / 750));
  }
}


/*
///////////////////////////////////////////////////////////////////////////////////////
  メインエリア
///////////////////////////////////////////////////////////////////////////////////////
*/

.mv {
  width: 100%;
  margin: 0 auto;
}

.mv .mainArea {
  position: relative;
}
.main_txt01 {
  position: absolute;
  font-size: 4rem;
  letter-spacing: 0.0022em;
  line-height: 1.25;
  bottom: 20rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  color: #fff;
  text-align: center;
}

.main_txt02 h3{
  line-height: 1.5;
  letter-spacing: -0.01em;
  font-feature-settings: "palt";
  text-align: center;
}
.main_txt02 p {
  line-height: 2.1739130435;
  text-align: center;
}


@media screen and (min-width: 768px) {
  .mv{
    margin-bottom: 10rem;
  }
  .mv .mainArea {
    width: 108rem;
    margin: 0 auto 7.5rem;
  }
  .main_txt{
    width: 96rem;
    margin: 0 auto;
  }
  .main_txt02 h3{
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.00037em;
    margin-bottom: 3rem;
  }
  .main_txt02 p {
    font-size: 1.3rem;
    letter-spacing: 0.005em;
    line-height: 2.3076923077;
  }
}
@media screen and (max-width: 767px) {
  .mv {
    width: 100%;
    margin: 0 auto;
  }
  .mv .mainArea {
    position: relative;
  }
  .main_txt01 {
    width: 100%;
    font-size: calc(65*(100vw / 750));
    bottom: calc(85*(100vw / 750));
    letter-spacing: 0.0032em;
  }
  .main_txt02 h3{
    font-size: calc(30*(100vw / 750));
    font-weight: 700;
    line-height: 1.79;
    margin-top: calc(80*(100vw / 750));
  }
  .main_txt02 p {
    width: calc(700* (100vw / 750));
    font-size: calc(23*(100vw / 750));
    margin: calc(50* (100vw / 750)) auto;
    color: #000;
  }
}

/*
///////////////////////////////////////////////////////////////////////////////////////
  contents01
///////////////////////////////////////////////////////////////////////////////////////
*/

/* PC */
@media screen and (min-width: 768px) {
  .contents01 {
    margin: 0 auto 16.2rem;
  }
  .contents01 .txt_Box02{
    line-height: 2.31;
  }
  .contents01 .buy_btn01{
    margin: 4.14824rem 0 0;
  }
  .contents01 .gridArea01{
    width: 91rem;
    grid-template-columns: 55rem 3rem auto;
    grid-template-rows: 66rem 21rem auto;
    justify-content: center;
  }
  .contents01 .box01 {
    width: 58rem;
    grid-column: 1 / 3;
    grid-row: 1 / 3;
  }
  .contents01 .box02 {
    width: 48rem;
    grid-column: 1 / 2;
    grid-row: 3 / 4;
    justify-self: flex-start;
    align-self: end;
    letter-spacing: 0.075em;

  }
  .contents01 .box03 {
    width: 37rem;
    grid-column: 2 / 4;
    grid-row: 2 / 4;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .contents01 {
    margin-bottom: calc(150* (100vw / 750));
  }
  .contents01 .box01 {
    width: calc(650* (100vw / 750));
    margin: 0 auto calc(50* (100vw / 750)) 0;
  }
  .contents01 .box02 {
    width: calc(700* (100vw / 750));
    margin: 0 auto calc(50* (100vw / 750));
  }
  .contents01 .box03 {
    width: calc(500* (100vw / 750));
    margin: 0 calc(50* (100vw / 750)) 0 auto;
  }
}

/*
///////////////////////////////////////////////////////////////////////////////////////
  contents02
///////////////////////////////////////////////////////////////////////////////////////
*/

/* PC */
@media screen and (min-width: 768px) {
  .contents02 {
    margin-bottom: 16.2rem;
  }
  .contents02 .gridArea01{
    grid-template-columns: 40rem 8rem auto;
    grid-template-rows: 50rem 10rem auto;
  }
  .contents02 .box01 {
    width: 86rem;
    margin: 0 auto 5rem;
  }
  .contents02 .box02 {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 65rem;
    margin: 0 auto 5rem;
  }
  .contents02 .box03 {
    width: 50rem;
    margin: 0 auto;
  }
  .contents02 .txt_Box02{
    text-align: center;
    line-height: 1.7692307692;
    letter-spacing: 0.075em;
  }
  .contents02 .buy_btn01{
    margin-right: auto;
    margin-left: auto;
    margin: 4.6rem 0 0;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .contents02 {
    margin-bottom: calc(150* (100vw / 750));
  }
  .contents02 .box01 {
    width: 100%;
    margin-bottom: calc(50* (100vw / 750)) ;
  }
  .contents02 .box02 {
    width: calc(700* (100vw / 750));
    margin: 0 auto calc(100* (100vw / 750));
  }
  .contents02 .box02 .txt_Box02{
    width: calc(700* (100vw / 750));
  }
  .contents02 .box03 {
    width: calc(550* (100vw / 750));
    margin: 0 auto;
  }

}
/*
///////////////////////////////////////////////////////////////////////////////////////
  contents03
///////////////////////////////////////////////////////////////////////////////////////
*/

/* PC */
@media screen and (min-width: 768px) {
  .contents03 {
    margin-bottom: 16.2rem;
  }
  .contents03 .gridArea02{
    width: 95rem;
    grid-template-columns: 40rem 5rem auto;
    grid-template-rows: 40rem 12.8rem auto;
    margin: 0 auto 20rem;
    justify-content: center;
  }
  .contents03 .box01 {
    width: 40rem;
    grid-column: 1 / 2;
    grid-row: 1 / 3;
  }
  .contents03 .box02 {
    width: 28rem;
    grid-column: 3 / 4;
    grid-row: 2 / 4;
  }
  .contents03 .buy_btn01 {
    grid-column: 1 / 2;
    grid-row: 3 / 4;
    margin: 0 auto;
    align-self: center;
  }

  .contents03 .flexAreaPc{
    width: 100rem;
    margin: 0 auto;
    align-items: center;
    justify-content: space-between;
  }
  .contents03 .box03 {
    width: 50rem;
  }
  .contents03 .box04 {
    width: 46rem;
  }
  .contents03 .txt_Box02{
    width: 51.5rem;
    letter-spacing: 0.075em;
    line-height: 1.7692307692;
  }
  .contents03 .box04 .buy_btn01{
    margin-right: auto;
    margin-left: 0;
    margin-top: 4.13652rem;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .contents03 {
    margin-bottom: calc(100* (100vw / 750));
  }
  .contents03 .gridArea02{
    width: 100%;
    grid-template-columns: calc(370*(100vw / 750)) calc(50*(100vw / 750)) auto;
    grid-template-rows: calc(400* (100vw / 750)) calc(80* (100vw / 750)) auto;
    margin-bottom: calc(150* (100vw / 750));
  }
  .contents03 .box01 {
    width: (400* (100vw / 750));
    grid-column: 1 / 3;
    grid-row: 1 / 3;
  }
  .contents03 .box02 {
    width: calc(380* (100vw / 750));
    grid-column: 2 / 4;
    grid-row: 2 / 4;
  }
  .contents03 .box03 {
    width: calc(600* (100vw / 750));
    margin: 0 auto calc(70* (100vw / 750));
  }
  .contents03 .box04 {
    width: calc(600* (100vw / 750));
    margin: 0 auto;
  }
  .contents03 .box04 {
    width: calc(600* (100vw / 750));
    margin: 0 auto;
  }
  .contents03 .box04 .txt_Box02{
    width: calc(600* (100vw / 750));
    margin: 0 auto;
  }
  .contents03 .gridArea02 .hidden-mobile{
    display: none;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
  contents04
///////////////////////////////////////////////////////////////////////////////////////
*/

/* PC */
@media screen and (min-width: 768px) {
  .contents04 {
    margin-bottom: 16.2rem;
  }
  .contents04 .box01 {
    width: 70rem;
    margin: 0 auto 20rem;
  }
  .contents04 .box02 {
    width: 58rem;
    margin: 0 auto 5rem;
  }
  .contents04 .gridArea03{
    width: 96rem;
    grid-template-columns: 37rem 4rem auto;
    grid-template-rows: 47rem auto;
    margin: 0 auto 16.5rem;
  }
  .contents04 .box03 {
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    justify-self: center;
    align-self: baseline;
    margin-left: 3rem;
    margin-top: 4rem;
  }
  .contents04 .box04 {
    width: 41rem;
    grid-column: 1 / 3;
    grid-row: 1 / 3;
  }
  .contents04 .txt_Box02{
    width: 50rem;
    line-height: 1.7692307692;
    letter-spacing: 0.075em;
  }
  .contents04 .buy_btn01{
    margin: 4rem 0 0;
  }
  .contents04 .box05 {
    width: 33rem;
    grid-column: 2 / 4;
    grid-row: 2 / 3
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .contents04 {
    margin-bottom: calc(100* (100vw / 750));
  }
  .contents04 .box01 {
    width: 100%;
    margin-bottom: calc(150* (100vw / 750));
  }
  .contents04 .box02 {
    width: calc(650* (100vw / 750));
    margin: 0 auto calc(50* (100vw / 750));
  }
  .contents04 .gridArea03{
    grid-template-columns: calc(350* (100vw / 750)) calc(80* (100vw / 750)) auto;
    grid-template-rows: auto calc(834* (100vw / 750));
  }
  .contents04 .box03 {
    width: calc(650* (100vw / 750));
    grid-column: 1 / 4;
    grid-row: 1 / 2;
    margin: 0 auto calc(100* (100vw / 750));
  }
  .contents04 .box03 .txt_Box02{
    width: calc(650* (100vw / 750));
  }
  .contents04 .box04 {
    width: calc(600* (100vw / 750));
    grid-column: 1 / 3;
    grid-row: 2 / 4;
  }
  .contents04 .box05 {
    width: calc(400* (100vw / 750));
    grid-column: 2 / 4;
    grid-row: 3 / 4;
  }
}
/*
///////////////////////////////////////////////////////////////////////////////////////
  contents05
///////////////////////////////////////////////////////////////////////////////////////
*/

.contents05 .txt_Box02{
  text-align: center;
}
/* PC */
@media screen and (min-width: 768px) {
  .contents05 {
    margin-bottom: 5rem;
  }
  .contents05 .cont_inner{
    width: 90rem;
    margin: 0 auto;
  }

  .contents05 .box01{
    width: 100%;
  }
  .contents05 .box02{
    width: 65rem;
    margin: 5rem auto 0;
  }
  .contents05 .txt_Box02{
    letter-spacing: 0.075em;
    line-height: 2.3076923077;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .contents05 {
    margin-bottom: calc(30* (100vw / 750));
  }
  .contents05 .box01{
    width: 100%;
  }
  .contents05 .txt_Box02{
    width: calc(740*(100vw / 750));
    margin: calc(50*(100vw / 750)) auto calc(100*(100vw / 750));
  }
}

/*
///////////////////////////////////////////////////////////////////////////////////////
  last-contents
///////////////////////////////////////////////////////////////////////////////////////
*/

.last-contents .item{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.last-contents .item-price{
  display: inline-block;
}
.last-contents .tax{
  display: inline;
}

.last-contents .buy_btn{
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  background-color: #295237;
}
.last-contents .buy_btn span{
  color: #fff;
}
.last-contents .item-credit{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 400;
}
.last-contents .item-price{
  font-weight: 400;
}
/* PC */
@media screen and (min-width: 768px) {
  .last-contents .cont_inner {
    width: 100rem;
    overflow: hidden;
    margin: 0 auto 10rem;
  }
  .last-contents .item{
    width: 15rem;
  }
  .last-contents .item-credit{
    font-size: 2rem;
    margin-bottom: 2rem;
    letter-spacing: 0.0006em;
  }
  .last-contents .item-price{
    font-size: 2rem;
  }
  .last-contents .item-price{
    font-size: 2rem;
    margin-top: 0.5rem;
  }
  .last-contents .tax{
    font-size: 1.8rem;
  }
  .last-contents .buy_btn{
    width: 12rem;
    height: 4.5rem;
  }
  .last-contents .buy_btn span{
    font-size: 2rem;
    letter-spacing: 0.0006em;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  .last-contents .cont_inner {
    width: 100%;
    margin-bottom: calc(100* (100vw / 750));
  }
  .last-contents .item{
    width: calc(600* (100vw / 750));
  }
  .last-contents .item-img{
    width: calc(650* (100vw / 750));
    margin: 0 auto;
  }
  .last-contents .item-credit{
    font-size: calc(24*(100vw / 750));
    margin-bottom: calc(40*(100vw / 750));
  }
  .last-contents .item-price{
    font-size: calc(24*(100vw / 750));
    margin-top: calc(20*(100vw / 750));
  }
  .last-contents .tax{
    font-size: calc(20*(100vw / 750));
    padding-left: calc(10*(100vw / 750));
  }
  .last-contents .buy_btn{
    width: calc(135*(100vw / 750));
    height: calc(55*(100vw / 750));
  }
  .last-contents .buy_btn span{
    font-size: calc(24* (100vw / 750));
  }

}

/*
///////////////////////////////////////////////////////////////////////////////////////
  アニメーション
///////////////////////////////////////////////////////////////////////////////////////
*/
.swiper-slide {
  opacity: .3; /* 左右のスライドを薄くする */
  transform: scale(.8); /* 左右のスライドを小さくする */
  transition: .7s; /* ゆっくり小さくさせる */
}
.swiper-slide-active {
  opacity: 1; /* 中央のスライドは薄くしない */
  transform: scale(1); /* 中央のスライドは小さくしない */
  z-index: 1; /* 中央のスライドを一番上にする */
}
.jsFade {
  opacity: 0;
  transform: translateY(20px);
}
.jsFade.isActive {
  opacity: 1;
  transform: translateY(0px);
  transition: all .7s;
}
/* 前へ次への矢印カスタマイズ */
.swiper-button-prev::after,
.swiper-button-next::after {
  content: "";
  top: 0;
  bottom: 0;
  height: 0;
  margin: auto;
  position: absolute;
  width: 0;
}
.swiper{
  position: relative;
}
.swiper-button-prev,
.swiper-button-next{
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44* 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px -(var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
}

.swiper-button-next:after,
.swiper-button-prev:after{
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
  line-height: 1;
  width: 100%;
  height: 100%;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after{
  content: 'prev';
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after{
  content: 'next';
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev{
  right: 10px;
  left: auto;
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next{
  left: 10px;
  right: auto;
}

@media screen and (min-width: 768px) {
  /* 前へ次への矢印カスタマイズ */
  .swiper-button-prev,
  .swiper-button-next{
    width: 2rem;
    height: 2.5rem;
  }

  .swiper-button-prev {
    left: 29rem!important;
  }
  .swiper-button-next {
    right: 29rem!important;
  }
  .swiper-button-next:after,
  .swiper-button-prev:after{
    font-size: 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .swiper-button-next,
  .swiper-rtl .swiper-button-prev{
    right: 20px;
    left: auto;
  }
  .swiper-button-prev,
  .swiper-rtl .swiper-button-next{
    left: 20px;
    right: auto;
  }

  .swiper-button-prev{
    display: inline-block;
    width: calc(23*(100vw / 750));
    height: calc(23*(100vw / 750));
    margin: 0 calc(10*(100vw / 750));
    border-left: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: rotate(45deg);
  }
  .swiper-button-next{
    display: inline-block;
    width: calc(23*(100vw / 750));
    height: calc(23*(100vw / 750));
    margin: 0 calc(10*(100vw / 750));
    border-top: 2px solid #000;
    border-right: 2px solid #000;
    transform: rotate(45deg);
  }
  .swiper-button-next:after,
  .swiper-button-prev:after{
    display: none;
  }
}