@charset "UTF-8";

/* ========================================
   背景ネットワーク
======================================== */

body #common_section_wrapper_5 {
  position: relative;
  overflow: hidden;
}


body #common_section_wrapper_5 .geo-network {
  position: absolute;
  display: block;
  z-index: 0;
  pointer-events: none;
}

body #common_section_wrapper_5 > *:not(.geo-network) {
  position: relative;
  z-index: 1;
}


/* ========================================
   PC 1025px〜1599px
======================================== */

/* 左上 */
body #common_section_wrapper_5 .geo-network-2 {
  left: 2%;
  top: 8%;
  width: 17%;
  height: auto;
  aspect-ratio: 220 / 330;
}

/* 右上 */
body #common_section_wrapper_5 .geo-network-3 {
  right: -2%;
  top: 23%;
  width: 14%;
  height: auto;
  aspect-ratio: 180 / 310;
}

/* 左下 */
body #common_section_wrapper_5 .geo-network-4 {
  left: 9%;
  top: 46%;
  width: 15%;
  height: auto;
  aspect-ratio: 220 / 295;
}

/* 右下 */
body #common_section_wrapper_5 .geo-network-5 {
  right: 3%;
  top: 73%;
  width: 16%;
  height: auto;
  aspect-ratio: 165 / 155;
}

/* SP追加 */
body #common_section_wrapper_5 .geo-network-2-sp {
  display: none;
}


/* ========================================
   LARGE PC 1600px以上
======================================== */

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

  /* 左上 */
  body #common_section_wrapper_5 .geo-network-2 {
    left: 8%;
    top: 8%;
    width: 11%;
  }

  /* 右上 */
  body #common_section_wrapper_5 .geo-network-3 {
    right: 6%;
    top: 23%;
    width: 9%;
  }

  /* 左下 */
  body #common_section_wrapper_5 .geo-network-4 {
    left: 13%;
    top: 46%;
    width: 10%;
  }

  /* 右下 */
  body #common_section_wrapper_5 .geo-network-5 {
    right: 9%;
    top: 73%;
    width: 10%;
  }

}




/* ========================================
   TABLET 641px〜1024px
======================================== */
@media screen and (min-width: 641px) and (max-width: 1024px) {

  /* 左上 */
  body #common_section_wrapper_5 .geo-network-2 {
        left: 4%;
        top: 12%;
        width: 20%;
  }

  /* 右上 */
  body #common_section_wrapper_5 .geo-network-3 {
    right: -3%;
    top: 23%;
    width: 20%;
  }

  /* 左下 */
  body #common_section_wrapper_5 .geo-network-4 {
    left: 1%;
    top: 46%;
    width: 20%;
  }

  /* 右下 */
  body #common_section_wrapper_5 .geo-network-5 {
    right: 1%;
    top: 73%;
    width:20%;
  }

  /* SP用はタブレットでは非表示 */
  body #common_section_wrapper_5 .geo-network-2-sp {
    display: none;
  }

}
/* ========================================
   SP
======================================== */

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

  /* 右上
  */
  body #common_section_wrapper_5 .geo-network-3 {
    right: -3%;
    top: 3%;

    width: 22%;
    height: auto;

    aspect-ratio: 180 / 310;
  }


  /* 左上
  */
  body #common_section_wrapper_5 .geo-network-2 {
    left: -3%;
    top: 26%;

    width: 26%;
    height: auto;

    aspect-ratio: 220 / 330;
  }


  /* 右下
  */
  body #common_section_wrapper_5 .geo-network-5 {
    right: -9%;
    top: 49%;

    width: 30%;
    height: auto;

    aspect-ratio: 165 / 155;
  }


  /* 左下
  */
  body #common_section_wrapper_5 .geo-network-4 {
    left: -5%;
    top: 83%;

    width: 27%;
    height: auto;

    aspect-ratio: 220 / 295;
  }


  /* 追加ネットワーク
  */
  body #common_section_wrapper_5 .geo-network-2-sp {
    display: block;

    right: -5%;
    top: 88%;

    width: 24%;
    height: auto;

    aspect-ratio: 220 / 330;
  }

}
/* ========================================
   こんなときにおすすめ PC
======================================== */

/* column_separator_8 */
#common_column_separator_8 {
  position: relative;
  width: 70%;
  min-height: 700px;
  padding-bottom: 80px;
  box-sizing: border-box;
}

#common_column_separator_8 .img_2 {
  position: absolute;
  top: 250px;
  left: 0;
  width: 50%;
  margin: 0;
  float: none;
}

/* column_separator_9 */
#common_column_separator_9 {
  position: relative;
  width: 70%;
  min-height: 800px;
  box-sizing: border-box;
}

#common_column_separator_9 .img_5,
#common_column_separator_9 .img_6 {
  position: absolute;
  margin: 0;
  float: none;
}

#common_column_separator_9 .img_5 {
  top: 420px;
  left: 30px;
  width: 55%;
}

#common_column_separator_9 .img_6 {
  top: 280px;
  right: -10%;
  width: 55%;
}

/* ========================================
   こんなときにおすすめ
   スクロールアニメーション
======================================== */

#common_column_separator_8,
#common_column_separator_9 {
  opacity: 0;
  transform: translateY(40px);
}

#common_column_separator_8.is-visible,
#common_column_separator_9.is-visible {
  animation: recommend-show 1.2s
    cubic-bezier(0.22, 1, 0.36, 1)
    forwards;
}

@keyframes recommend-show {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ========================================
   こんなときにおすすめ TABLET
======================================== */

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

  /* column_separator_8 */
  #common_column_separator_8 {
    width: 75%;
    min-height: 600px;
    padding-bottom: 60px;
  }

  #common_column_separator_8 .img_2 {
    top: 220px;
    left: 0;
    width: 50%;
  }
/* column_separator_9 */
  #common_column_separator_9 {
    width: 75%;
    min-height: 700px;
  }

  #common_column_separator_9 .img_5 {
    top: 350px;
    left: 2%;
    width: 52%;
  }

  #common_column_separator_9 .img_6 {
    top: 220px;
    right: -5%;
    width: 52%;
  }
}

/* ========================================
   こんなときにおすすめ SP
======================================== */

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

  #common_column_separator_8 {
    width: 100%;
    min-height: 350px;
    padding-bottom: 40px;
  }

  #common_column_separator_8 .img_2 {
        top: 35%;
        left: 1%;
  }
#common_column_separator_9 {
    width: 100%;
    min-height: 420px;
  }

  #common_column_separator_9 .img_5 {
    top: 250px;
    left: 2%;
    width: 50%;
  }

  #common_column_separator_9 .img_6 {
    top: 145px;
    right: 0;
    width: 50%;
  }
}


/* ========================================
   section_wrapper_7 背景
======================================== */

/* PC：1025px〜1599px */
@media screen and (min-width: 1025px) and (max-width: 1599px) {

  body #common_section_wrapper_7 {
    background-image: url(bg_6.png);
    background-repeat: no-repeat;
    background-position: left 0 top 8%;
    background-size: 62%;
  }

}

/* LARGE PC：1600px以上 */
@media screen and (min-width: 1600px) {

  body #common_section_wrapper_7 {
    background-image: url(bg_6.png);
    background-repeat: no-repeat;
    background-position: left 20% top 8%;
    background-size: 45%;
  }

}

/* TABLET：641px〜1024px */
@media screen and (min-width: 641px) and (max-width: 1024px) {

  body #common_section_wrapper_7 {
    background-image: url(bg_6.png);
    background-repeat: no-repeat;
    background-position: left 9% top 38%;
    background-size: 80%;
  }

}

/* SP：640px以下 */
@media screen and (max-width: 640px) {

  body #common_section_wrapper_7 {
    background-image: url(bg_6.png);
    background-repeat: no-repeat;
    background-position: left 14% top 34%;
    background-size: 130%;
  }

}


/* ========================================
   section_wrapper_8 背景
======================================== */

/* PC：1025px〜1599px */
@media screen and (min-width: 1025px) and (max-width: 1599px) {

  body #common_section_wrapper_8 {
    background-image:
      url(bg_7.png),
      url(bg_8.png);
    background-repeat: no-repeat;
    background-position:
      right -21% top -4%,
      left 12% top 80%;
    background-size:
      40%,
      20%;
  }

}

/* LARGE PC：1600px以上 */
@media screen and (min-width: 1600px) {

  body #common_section_wrapper_8 {
    background-image:
      url(bg_7.png),
      url(bg_8.png);
    background-repeat: no-repeat;
    background-position:
      right 2% top -4%,
      left 12% top 80%;
    background-size:
      30%,
      20%;
  }

}

/* TABLET：641px〜1024px */
@media screen and (min-width: 641px) and (max-width: 1024px) {

  body #common_section_wrapper_8 {
    background-image:
      url(bg_7.png),
      url(bg_8.png);
    background-repeat: no-repeat;
    background-position:
      right -28% top 6%,
      left -13% top 83%;
    background-size:
      45%,
      30%;
  }

}

/* SP：640px以下 */
@media screen and (max-width: 640px) {

  body #common_section_wrapper_8 {
    background-image:
      url(bg_7.png),
      url(bg_8.png);
    background-repeat: no-repeat;
    background-position:
      right -425% top -7%,
      left -35% top 87%;
    background-size:
      90%,
      50%;
  }

}


/* ========================================
   body #common_section_wrapper_10 背景
======================================== */

body #common_section_wrapper_10 {
  position: relative;
  width: 100%;
  background-image:
    url("bg_9.png");
  background-repeat: repeat-x;
  background-position:
    top center;
  background-size:
  100%;
}

@media screen and (min-width: 2000px) {
  body #common_section_wrapper_10 {
  background-size:
  60%;
  }
}

@media screen and (max-width: 640px) {
body #common_section_wrapper_10 {
  position: relative;
  width: 100%;
  background-image:
    url("bg_9_sm.png");
  background-repeat: repeat-x;
  background-position:
    top 20% center;
  background-size:
  100%;
}
}

/* ========================================
   body #common_section_wrapper_13 背景
======================================== */

body #common_section_wrapper_13 {
  position: relative;
  width: 100%;
  background-image:
    url("bg_16.png");
  background-repeat: repeat-x;
  background-position:
    top center;
  background-size:
  100%;
}

@media screen and (min-width: 2000px) {
  body #common_section_wrapper_13 {
  background-size:
  60%;
  }
}

@media screen and (max-width: 640px) {
body #common_section_wrapper_13 {
  position: relative;
  width: 100%;
  background-image:
    url("bg_16_sm.png");
  background-repeat: repeat-x;
  background-position:
    top 0% center;
  background-size:
  100%;
}
}



/* ========================================
   h3
======================================== */

.product_1 {
  position: relative;
  display: inline-block;
  z-index: 0;
  text-align: center;
}

.product_1::after {
  content: "";
  position: absolute;
  top: 0px;
  bottom: -15px;
  left: 10%;
  width: 80%;
  z-index: -1;
  background-color: #cfff00;
  transform: scaleX(0);
  transform-origin: left center;
}

.product_1.is-visible::after {
  animation: marker-draw 2.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes marker-draw {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}


/* ========================================
   h3 SP
======================================== */

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

  .product_1::after {
    top: -6px;
    bottom: -8px;
    left: 0;
    width: 100%;
  }

  .product_1.is-visible::after {
    animation: marker-draw-sp 2.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }

  .product_1 p {
    font-size: 0.85em;
  }
}

@keyframes marker-draw-sp {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

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

  .product_1 p {
    font-size: 0.75em;
  }
}

/* ========================================
   list PC
======================================== */



@media screen and (min-width: 1025px) {
  .list {
    font-size: 1.1em;
  line-height: 1em !important;
  }

  .list_1 {
    font-size: 1.1em;
  line-height: 1em !important;
  }
}

/* 400px以下 */
@media screen and (max-width: 400px) {
  .list_1 {
    font-size: 0.8em;
  }

}

.listpack > ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

.listpack li {
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1em !important;
}


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


.kaori_p {
    font-size: 0.8em;
  }

}




/* ========================================
   marker
======================================== */

.marker {
  background-color: #cfff00;
  padding: 2px 4px 6px;
}

.marker2 {
  background-color: #ffd200;
  padding: 2px 4px 6px;
}



/* ========================================
   point部分　枠線
======================================== */

.line {
  position: relative;
  background:
    linear-gradient(#cfff00, #cfff00) left top / 0 2px no-repeat,
    linear-gradient(#cfff00, #cfff00) right top / 2px 0 no-repeat,
    linear-gradient(#cfff00, #cfff00) right bottom / 0 2px no-repeat,
    linear-gradient(#cfff00, #cfff00) left bottom / 2px 0 no-repeat;
  transition: background-size 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.line.is-visible {
  background-size:
    100% 2px,
    2px 100%,
    100% 2px,
    2px 100%;
}


/* ========================================
   point部分　枠線
======================================== */

.line2 {
  position: relative;
  background:
    linear-gradient(#ffd200, #ffd200) left top / 0 2px no-repeat,
    linear-gradient(#ffd200, #ffd200) right top / 2px 0 no-repeat,
    linear-gradient(#ffd200, #ffd200) right bottom / 0 2px no-repeat,
    linear-gradient(#ffd200, #ffd200) left bottom / 2px 0 no-repeat;
  transition: background-size 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.line2.is-visible {
  background-size:
    100% 2px,
    2px 100%,
    100% 2px,
    2px 100%;
}


/* ========================================
   炭酸泡サイズの比較
======================================== */

  .is-layoutB .g-TileLinkVUnit--v2__leadBlock {
    margin-bottom: 3px;
  }

.tile_img img {
  border: 2px solid #cfff00;
}

.tile,
.tile a,
.tile::before,
.tile::after {
  border: none !important;
  box-shadow: none !important;
}

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

  .g-TileLinkVUnit--v2 {
    padding: 5px !important;
  }
}



@media screen and (min-width: 400px) and (max-width: 640px) {

  .tile_p {
    font-size: 0.7em;
  }
}

/* 400px以下 */
@media screen and (max-width: 400px) {
  .tile_p {
    font-size: 0.6em;
  }

}




/* ========================================
   　GIF
======================================== */

.quick .g-Image-v2__img {
  text-align: center !important;
}

.quick {
  display: inline-block !important;
  float: none !important;
  border: 2px solid #cfff00;
  width:90%;
}

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

  .quick {
    border: 2px solid #cfff00;
  width:100%;
  }
}

/* ========================================
   GIF
======================================== */

.kiwami .g-Image-v2__img {
  text-align: center !important;
}

.kiwami img {
  display: inline-block !important;
  float: none !important;
  border: 2px solid #ffd200;
  width:90%;
}

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

  .kiwami img {
    border: 2px solid #ffd200;
  width:100%;
  }
}


/* ========================================
   ポイント部分　背景
======================================== */

body #common_section_wrapper_11 {
  position: relative;
  width: 100%;
  background-image:
    url("bg_10.png"),
    url("bg_11.png"),
    url("bg_12.png"),
    url("bg_13.png"),
    url("bg_14.png");
  background-repeat: no-repeat;
  background-position:
    left 10% top -1%,
    right 5% top 33%,
    left 8% top 45%,
    right 0% top 80%,
    left 7% top 97%;
  background-size:
    28%,
    28%,
    28%,
    28%,
    28%;
}

/* ========================================
   ポイント部分　背景 TABLET
======================================== */

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

  body #common_section_wrapper_11 {
    background-position:
      left -7% top -1%,     /* bg_10 */
      right -27% top 33%,   /* bg_11 */
      left -11% top 62%,    /* bg_12 */
      right -26% top 90%,   /* bg_13 */
      left -18% top 97%;    /* bg_14 */

    background-size:
      45%,
      45%,
      45%,
      45%,
      45%;
  }

}
/* ========================================
   ポイント部分　背景 SP
======================================== */

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

  body #common_section_wrapper_11 {
    background-position:
      left -53% top -2%,     /* bg_10 */
      right -89% top 29%,   /* bg_11 */
      left -42% top 48%,    /* bg_12 */
      right -121% top 85%,   /* bg_13 */
      left -77% top 96%;

    background-size:
      70%,
      70%,
      70%,
      70%,
      70%;
  }

}

/* ======================================== 
   ポイント部分　背景 
======================================== */ 

body #common_section_wrapper_14 { 
  position: relative; 
  width: 100%; 

  background-image: 
    url("bg_18.png"), 
    url("bg_19.png"), 
    url("bg_20.png"), 
    url("bg_21.png");

  background-repeat: no-repeat; 

  background-position: 
right -11% top 0%, 
    left -5% top 27%, 
    right -4% top 62%, 
    left -7% top 88%; 

  background-size: 
    32%, 
    32%, 
    32%, 
    32%; 
} 


/* ======================================== 
   ポイント部分　背景 TABLET 
======================================== */ 

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

  body #common_section_wrapper_14 { 

    background-position: 
right -35% top -1%, 
left -38% top 33%, 
right -25% top 68%, 
left -36% top 97%; 

    background-size: 
      45%, 
      45%, 
      45%, 
      45%; 
  } 

}


/* ======================================== 
   ポイント部分　背景 SP 
======================================== */ 

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

  body #common_section_wrapper_14 { 

    background-position: 
right -130% top -1%, 
      left -142% top 28%, 
      right -117% top 62%, 
      left -119% top 91%;

    background-size: 
      70%, 
      70%, 
      70%, 
      70%; 
  } 

}

/* ========================================
   各テキスト調整
======================================== */

.point_p {
  line-height: 1.4;
  text-shadow:
    0 0 3px rgba(0, 0, 0, 0.8),
    0 0 6px rgba(0, 0, 0, 0.5);
}

 point_p_quick{
  line-height: 1.4;
  text-shadow:
    0 0 3px rgba(0, 0, 0, 0.8),
    0 0 6px rgba(0, 0, 0, 0.5);
} 

 point_p_kiwami{
  line-height: 1.4;
  text-shadow:
    0 0 3px rgba(0, 0, 0, 0.8),
    0 0 6px rgba(0, 0, 0, 0.5);
} 

.point_p_2 {
  line-height: 1.4;
}

.point_p_3 {
  line-height: 1.4;
font-size:1.2em;
}

.point_p_3_kiwami{
  line-height: 1.4;
font-size:1.2em;
}

.point_p p,
.point_p_kiwami,
.point_p_quick,
.kaori_p p,
.caption p {
  margin: 0 !important;
}

.caption {
  line-height: 1;
}

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

  .product_text {
    font-size: 0.7em;
  }

  .point_p {
    font-size: 0.8em;
  }

.point_p_kiwami {
    font-size: 0.8em;
  }

.point_p_quick {
    font-size: 0.8em;
  }


.point_p_3 {
  line-height: 1.4;
font-size:0.95em;
}

.point_p_3_kiwami{
  line-height: 1.4;
font-size:0.95em;
}

.point_p_3_quick{
  line-height: 1.4;
font-size:0.95em;
}

}


@media screen and (min-width: 400px) and (max-width: 640px) {

  .point_p_2 {
    font-size: 0.7em;
  }
}

/* 400px以下 */
@media screen and (max-width: 400px) {
  .tile_p {
    font-size: 0.6em;
  }


.point_p_3_kiwami{
    font-size: 0.85em;
}

.point_p_kiwami {
    font-size: 0.7em;
  }

.point_p_quick {
    font-size: 0.75em;
  }

}

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

  .point_p_2 {
    font-size: 0.6em;
  }


}



/* ========================================
   各テキスト調整 TABLET
======================================== */

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

  .tile_p {
    font-size: 0.8em;
  }

  .product_text {
    font-size: 0.8em;
  }

  .point_p {
    font-size: 0.85em;
  }

  .point_p_quick {
    font-size: 0.85em;
  }

  .point_p_kiwami {
    font-size: 0.85em;
  }

  .point_p_2 {
    font-size: 0.8em;
  }

.point_p_3 {
font-size:0.9em;
}

.point_p_3_kiwami{
font-size:0.9em;
}

.point_p_3_quick{
font-size:0.9em;
}


}

/* ========================================
   縦ラインアニメーション
======================================== */

.lineanimation {
  position: relative;
  padding-bottom: 120px;
}

.lineanimation::after {
  content: "";
  position: absolute;

  left: 50%;
  bottom: 10px;

  width: 2px;
  height: 140px;

  background: linear-gradient(
    to bottom,
    #d2fd00 0%,
    #ffd202 100%
  );

  transform: translateX(-50%) scaleY(0);
  transform-origin: top;

  animation: liner 3.2s cubic-bezier(0.65, 0, 0.35, 1) infinite;

  z-index: 2;
  pointer-events: none;
}

@keyframes liner {
  0% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: top;
  }

  40% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: top;
  }

  60% {
    transform: translateX(-50%) scaleY(1);
    transform-origin: bottom;
  }

  100% {
    transform: translateX(-50%) scaleY(0);
    transform-origin: bottom;
  }
}

/* スマホのみ */
@media screen and (max-width: 640px) {
  .lineanimation {
    padding-bottom: 95px;
  }

  .lineanimation::after {
    height: 90px;
  }
}


/* ========================================
   h3
======================================== */

.product_2 {
  position: relative;
  display: inline-block;
  z-index: 0;
  text-align: center;
}

.product_2::after {
  content: "";
  position: absolute;
  top: -15px;
  bottom: -15px;
  left: 10%;
  width: 80%;
  z-index: -1;
  background-color: #ffd200;
  transform: scaleX(0);
  transform-origin: left center;
}

.product_2.is-visible::after {
  animation: marker-draw 2.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes marker-draw {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}


/* ========================================
   h3 SP
======================================== */

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

  .product_2::after {
        top: -12px;
        bottom: -10px;
        left: 0;
        width: 100%;
  }

  .product_2.is-visible::after {
    animation: marker-draw-sp 2.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }

  .product_2 p {
    font-size: 0.85em;
  }
}

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

  .product_2 p {
    font-size: 0.75em;
  }
}


@keyframes marker-draw-sp {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

/* ========================================
   文字周り調整
======================================== */

/* 641px以上 */
@media screen and (min-width: 641px) {
  .movie_title p {
    font-size: 1.4em;
  }

  .h2_p p {
    font-size: 1.2em;
  }

  .howto_p p {
    font-size: 1.2em;
  }
}

.subtitle {
  text-shadow:
    1.5px 0 1px #000,
    -1.5px 0 1px #000,
    0 1.5px 1px #000,
    0 -1.5px 1px #000;
}

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

  .movie_title p {
    font-size: 1.0em;
  }

  .h2_p p {
    font-size: 1.0em;
  }

  .howto_p p {
    font-size: 0.9em;
  }

.subtitle {
    font-size: 0.8em;
}
}

/* 640px以下 */
@media screen and (max-width: 640px) {
  .subtitle {
    font-size: 0.8em;
  }

  .howto_p p {
    font-size: 0.9em;
  }
}
.cap {
  text-shadow:
    1px 0 1px #000,
    -1px 0 1px #000,
    0 1px 1px #000,
    0 -1px 1px #000,
    0 0 4px rgba(0, 0, 0, 0.9),
    0 0 7px rgba(0, 0, 0, 0.7);
}

/* ========================================
   brand lineup
======================================== */

/* PC */
.brandlineup p {
  font-size: 46px;
}

/* タブレット */
@media screen and (max-width: 1024px) {
  .brandlineup p {
    font-size: 36px;
  }
}

/* スマホ */
@media screen and (max-width: 640px) {
  .brandlineup p {
    font-size: 27px;
  }
}