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

body {
  background: #F3F3F1;
}

.c-header {
  width: 100%;
}

.top-logo {
  width: 20%;
  max-width: 110px;
  margin: 0 auto;
  display: block;
}

@media only screen and (max-width: 641px) {

  body#fs_CustomPage .fs-l-main {
    margin-top: 23%;
  }

}

@media only screen and (max-width: 900px) {

  body#fs_CustomPage .fs-l-main {
    margin-top: 7%;
  }

}

@media only screen and (max-width: 1200px) {

  body#fs_CustomPage .fs-l-main {
    margin-top: 4%;
  }

}
.capitalize {
  text-transform: capitalize;
}

.wrapper-realbuy_vol5 {
  padding: 0%;
  margin: 0;
}

.br::before {
  content: "\A";
  white-space: pre;
}

.br_size::before {
  content: "\A";
  white-space: pre;
}

.uppercase {
  text-transform: uppercase;
}

.cap {
  text-transform: capitalize;
}

.vertical {
  writing-mode: vertical-rl;
}

.-flex {
  display: flex;
}

.item-box.-flex.-mb5 {
  margin-bottom: 5%;
}

.item-box {
  background: #FFF;
}

.top-img img {
  width: 100%;
}

.staff-detail a {
  color: #FFF;
}

@media only screen and (min-width: 641px) {

  /*
  body#fs_CustomPage .fs-l-main {
    margin-top: 4%;
  }
  */
  

  .br::before {
    content: "";
  }
  
  /*-----pcディスプレイ幅-----*/

  .wrapper-realbuy_vol5 {
    margin: 0 auto;
    /* max-width: 641px; */
  }

  .top-img img.sp  {
    display: none;
  }
}


/*-----breadcrumb-----*/

.fs-c-breadcrumb__list .fs-c-breadcrumb__listItem + .fs-c-breadcrumb__listItem {
  padding-left: 16px;
  padding-bottom: 2%;
}

.breadcrumb {
  margin-top: 16% !important;
}

.inner-block.breadcrumb {
  padding: 0px 15px;
  width: auto;
}

@media only screen and (min-width: 641px){

  .breadcrumb {
      margin-top: -2% !important;
    }

}

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

.header-nav__inner {
  display: none !important;
}

.campaign-banner-block {
  display: none;
}
/*
.icon-menu {
  display: none;
}

.fs-p-logo {
  display: none;
}

.c-header h1 {
  width: 100%;
  font-size: 11px;
  line-height: 0.9rem;
  text-align: center;
  padding: 0;
  position: absolute;
  top: 30%;
}

.c-header h1 .uppercase {
  font-size: 21px;
  font-weight: bold;
  letter-spacing: -0.03rem;
}

.jam-logo img {
  width: 12%;
  min-width: 45px;
  max-width: 70px;
  position: absolute;
  top: 33%;
  left: 84%;
  z-index: 1;
}


@media only screen and (min-width: 641px) {

  .c-header {
    box-shadow: 0px 2px 6px 0px rgb(0 0 0 / 10%);
    height: 100px;
  }
  
  .c-header h1 {
    font-size: 16px;
    line-height: 1.5rem;
  }
  
  .c-header h1 .uppercase {
    font-size: 30px;
  }

  .jam-logo img {
      width: 5%;
    }

}
*/

/*-----section-top-----*/

.section-top {
  margin-bottom: 20%;
}

.section-top .top-img {
  position: relative;
}

.section-top .top-img img {
  margin-bottom: 8%;
}

.section-top h1 {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 5%;
}

.description {
  margin: 0 auto;
  padding: 0 10%;
  margin-bottom: 32%;
  line-height: 1.75rem;
  letter-spacing: 0.5px;
  font-size: 13px;
}

.description span {
  font-weight: bold;
}

.thumb {
  justify-content: center;
  padding: 0px 4%;
}

@media only screen and (min-width: 641px){

  .section-top {
    margin-bottom: 10%;
  }

  .description {
    padding: 0 15%;
    font-size: 16px;
    line-height: 1.85rem;
    margin-bottom: 15%;
  }

  .thumb {
    gap: 5%;
    padding: 0 15%;
  }

}

@media only screen and (min-width: 1000px){

  .section-top {
    padding: 0 15%;
  }

  .description {
    padding: 0 30%;
  }

  .thumb {
    padding: 0 30%;
  }

}

.thumb li {
  position: relative;
}


.thumb li::after {
  content: "";
  position: absolute;
  bottom: -29%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 7px solid transparent;
  border-top: 8px solid #000;
}

ul.-flex.thumb li {
  width: 20%;
}

ul.-flex.thumb li .-brand {
  position: absolute;
  top: -45%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.6rem;
  writing-mode: vertical-rl;
  font-weight: bold;
}

ul.-flex.thumb li .-brand.-loweco {
  top: -50%;
}

ul.-flex.thumb li .-brand::after {
  position: absolute;
  bottom: -46px;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 1px;
  height: 25px;
  background-color: #333;
}

@media only screen and (min-width: 641px){

  ul.-flex.thumb li .-brand {
    top: -66%;
    font-size: 0.8rem;
  }

  ul.-flex.thumb li .-brand.-loweco {
    top: -80%;
  }

}


/*section-realbuy*/

.section-realbuy {
  margin-bottom: 15%;
}

.section-realbuy .post {
  font-size: 10px;
  margin-left: 15px;
}

.section-realbuy h2 {
  font-size: 21px;
  font-weight: bold;
  margin-bottom: 3%;
}

.section-realbuy .name {
  font-size: 26px;
  color: #135384;
  margin-right: 3%;
}

.section-realbuy .item-box {
  padding: 5%;
  border: 1px solid #9ABCB6;
  border-radius: 10px;
  text-align: center;
  margin-bottom: 15%;
}



/* ブランドロゴ */


.section-realbuy .item-box .brand_logo {
  text-align: center;
  margin-bottom: 3%;
}

.section-realbuy .item-box .brand_logo img {
  width: 17%;
}

.section-realbuy.-loweco .item-box .brand_logo img {
    width: 24%;
}

.section-realbuy.-elulu .item-box .brand_logo img {
    width: 28%;
}

.section-realbuy.-adel .item-box .brand_logo img {
    width: 27%;
}







.section-realbuy .item-box img.-item {
  border-radius: 4%;
  margin-bottom: 5%;
}

.section-realbuy .item-box h3 {
  font-size: 0.9rem;
  font-weight: bold;
  margin-bottom: 3%;
}


.section-realbuy .item-box .detail {
  font-size: 10px;
  margin-bottom: 5%;
}

.section-realbuy .item-box .detail p {
  margin-bottom: 2%;
}

.section-realbuy .item-box .detail a {
  text-decoration: underline;
}

.section-realbuy .item-box .like-item {
  display: block;
  margin: 0 auto;
  width: 70%;
  padding: 2%;
  font-size: 1rem;
  font-weight: bold;
  color: #FFF;
  background-color: #135384;
  border-radius: 33px;
  margin-bottom: 5%;
}

.section-realbuy.-loweco .item-box .like-item {
  font-size: 0.6rem;
  padding: 4%;
}

.section-realbuy.-loweco .item-box .like-item:first-child {
  margin-bottom: 10px;
}



.section-realbuy_top {
  padding: 0 8%;
}
.section-realbuy_top.-sugino {
  margin-bottom: 2%;
}


@media only screen and (min-width: 641px){

  .section-realbuy_top {
    padding: 0 15%;
  }

  .section-realbuy {
    margin-bottom: 10%;
  }

  .section-realbuy .item-box h3 {
    font-size: 1.2rem;
  }

  .section-realbuy.-loweco .item-box .like-item {
    font-size: 1rem;
  }

  .section-realbuy .item-box .detail p {
    font-size: 0.9rem;
  }
  
  
}

@media only screen and (min-width: 1000px){

  .section-realbuy_top {
    padding: 0 35%;
  }
  
}


/*shop*/

.shop a {
    color: #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
}



/*interview*/

.interview {
  margin: 0 auto;
  padding: 0 10%;
  max-width: 650px;
}

@media only screen and (min-width: 641px){

  .interview {
    padding: 0 0%;
  }
  
}

.interview .-box {
  margin-bottom: 10%;
}

.interview .-box h3 {
  font-size: 16px;
  font-weight: bold;
  color: #8CB4B0;
  margin-bottom: 1%;
}

.interview .-box h4 {
  font-size: 12px;
  font-weight: bold;
  color: #AEAEAE;
  margin-bottom: 1%;
}

.interview .-box.-taniwaki p {
  margin-bottom: 3%;
}


.interview .-box > p {
  line-height: 1.75;
}

/*interview*/

.profile {
  max-width: 650px;
  margin: 0 10%;
  border-top: 2px dotted #000;
  border-bottom: 2px dotted #000;
  padding: 5% 0;
}

@media only screen and (min-width: 641px){

  .profile {
    margin: 0 auto;
    padding: 3% 0;
  }
  
}

.profile h3 {
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 5%;
  letter-spacing: 0.5px;
}

.box {
  display: table;
  width: 100%;
  margin-bottom: 6%;
}
.imgbox {
  display: table-cell;
  width: 30%;
}

.p-box {
  display: table-cell;
  vertical-align: middle;
  padding-left: 5%;
}

.p-box h4 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 2%;
}

.p-box .p-post {
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 2%;
  letter-spacing: -0.2px;
}

.p-box p {
  font-size: 12px;
  margin-bottom: 5%;
  line-height: 1.75;
  letter-spacing: 0.7px;
}

.p-box p a.-shop {
  color: #6d6d6d;
  border-bottom: 1px solid #6d6d6d;
}


.profile .sns {
  justify-content: flex-start;
  gap: 3%;
}

.sns a {
  padding: 2% 5%;
  background-color: #135384;
  font-size: 12px;
  font-weight: bold;
  color: #FFF;
  border-radius: 50px;
  letter-spacing: 1.2px;
  float: left;
  margin-right: 3%;
  margin-bottom: 3%;
}

.dot {
  margin: 6% auto 0;
  text-align: center;
  font-size: 23px;
  font-weight: bold;
}

/*shop_info*/

.shop_info.-flex {
  background-color: #E9E9E9;
  padding: 5% 5%;
  justify-content: center;
  align-items: baseline;
  letter-spacing: -0.2px;
  line-height: 1.55;
  color: #333333;
  margin-bottom: 6%;
}

.shop_info.-flex .-img {
  width: 35%;
  margin-right: 3%;
}

.shop_info.-flex .-detail {
  width: 65%;
}

.shop_info.-flex .-detail h5 {
  font-size: 0.8rem;
  font-weight: bold;
}

.shop_info.-flex .-detail a {
  font-size: 0.7rem;
  text-decoration: underline;
}

@media only screen and (min-width: 641px){

  .shop_info.-flex .-detail h5 {
    font-size: 1rem;
  }

  .shop_info.-flex .-detail a {
    font-size: 0.9rem;
  }
  
}

/*brand_sns*/

.brand_sns.-flex {
  justify-content: flex-end;
  align-items: center;
  letter-spacing: -0.2px;
  line-height: 1.75;
  color: #333333;
  gap: 10px;
}

.brand_sns.-flex h5 {
  font-size: 0.8rem;
  font-weight: bold;
}

.brand_sns.-flex a {
  width: 35px;
  height: 35px;
}





/*slider*/

.slider {
  padding: 0;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 10%;
}


@media only screen and (min-width: 641px){

  .slider {
    margin-bottom: 5%;
  }

}

.slider img {
  width: 100%;
}
.slider .slick-slide {
  height: auto!important;
  margin-left: 0;
}
/*
@media only screen and (min-width: 641px) {
  
  .slick-list {
    overflow: visible !important;
  }

}
*/


/*
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
  display: none;
}
*/

/*section-special*/

.section.special {
  padding: 0 3% 5%;
}


@media only screen and (min-width: 641px){

  .section.special {
    padding: 0 0% 5%;
    max-width: 650px;
    margin: 0 auto;
  }
  
}

.special-tlt h2 {
  font-size: 16px;
  font-weight: bold;
  text-align: left;
  margin-left: 3%;
  margin-bottom: 2%;
}

.section.special img{
  margin-bottom: 5%;
} 


.section.special .-flex {
  justify-content: center;
  gap: 3%;
}

/*scroll-pagetop*/
.pagetop {
  cursor: pointer;
  position: fixed;
  right: 19px;
  bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  transition: .3s;
  color: #FFF;
  background: #135384;
  opacity: 0;
  z-index: 30;
  text-transform: uppercase;
  font-weight: 500;
  border-radius: 50%;
}

.pagetop img {
  width: 45%;
}


/*SWIPER*/

.swiper--wrapper {
  /* wrapperのサイズを調整 */
  width: 100%;
  height: 300px;
}

.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  width: 100%;
  height: 100%;
  text-align: center;
}

.swiper-slide:nth-child(3n + 1) {
  background-color: #FFF;
}

.swiper-slide:nth-child(3n + 2) {
  background-color: #FFF;
}

.swiper-slide:nth-child(3n + 3) {
  background-color: #FFF;
}

.swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  margin: 0 0 0 10px !important;
  background: #333 !important;
}

.swiper-pagination-bullet:first-child {
  margin: 0 !important;
}

.swiper-button-next:after, .swiper-button-prev:after  {
  display: none;
}



/*arrow初期化CSS*/
/* 前ページ、次ページボタン共通のスタイル */
.swiper-button-prev,
.swiper-button-next {
	width: 48px; /* ボタンの幅 */
	height: 48px; /* ボタンの高さ */
	background-size: 48px 48px; /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
	margin-top: -24px; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
}
/* 次ページボタンのスタイル */
.swiper-button-next {
	background-image: url(画像アドレス);
}
/* 前ページボタンのスタイル */
.swiper-button-prev {
	background-image: url(画像アドレス);
	transform: scale(-1, 1); /* 左右反転 */
}
/*arrowカスタムCSS*/
.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(-1 * var(--swiper-navigation-size) / 2);
 z-index: 10;
 cursor: pointer;
 display: flex;
 align-items: center;
 justify-content: center;
 color: var(--swiper-navigation-color, var(--swiper-theme-color));
 width: 35px; /* ボタンの幅 */
 height: 35px; /* ボタンの高さ */
 background-size: 35px 35px; /* 背景画像としてのサイズ（＝表示したい画像サイズ） */
 margin-top: -24px; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
}
/* 次ページボタンのスタイル */
.swiper-button-next {
 background-image: url(//jamtrading.itembox.design/item/jam/img/special/2024/realbuy2024-vol3/arrow_left2.png);
 transform: scale(-1, 1); /* 左右反転 */
}
/* 前ページボタンのスタイル */
.swiper-button-prev {
 background-image: url(//jamtrading.itembox.design/item/jam/img/special/2024/realbuy2024-vol3/arrow_right2.png);
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
  opacity: 0;
}