/* 
  font
*/
.lp_container *{line-height: 1.6;}
@media (max-width: 767px){
.fs16_p18{font-size:16px !important; line-height: 1.4 !important;}  
}
@media (min-width: 768px){
.fs16_p18{font-size:18px !important; line-height: 1.4 !important;}  
}
.bold{
  font-weight: bold;
}
.text-left{
  text-align: left;
}
/* margin
--------------------*/
.d_mb1 {margin-bottom: 1% !important;}
.d_mb2 {margin-bottom: 2% !important;}
.d_mb3 {margin-bottom: 3% !important;}
.d_mb4 {margin-bottom: 4% !important;}
.d_mt1 {margin-top: 1% !important;}
.d_mt2 {margin-top: 2% !important;}
.d_mt3 {margin-top: 3% !important;}
.d_mt4 {margin-top: 4% !important;}

/* column
--------------------*/
.lp_container .col-al-2 {
  width: 49%;
  float: left;
  margin-right: 2%;}
.lp_container .col-al-3 {
  width: 32%;
  float: left;
  margin-right: 2%;}
.lp_container .col-al-4 {
  width: 23.5%;
  float: left;
  margin-right: 2%;}
.lp_container .col-sp-2 {
  width: 49%;
  float: left;
  margin-right: 2%;}
.lp_container .col-sp-3 {
  width: 32%;
  float: left;
  margin-right: 2%;}
.lp_container .col-sp-4 {
  width: 23.5%;
  float: left;
  margin-right: 2%;}

.lp_container .col-al-2:nth-child(2n) {margin-right: 0;}
.lp_container .col-al-3:nth-child(3n) {margin-right: 0;}
.lp_container .col-al-4:nth-child(4n) {margin-right: 0;}
.lp_container .col-pc-2:nth-child(2n) {margin-right: 2%;}
.lp_container .col-pc-3:nth-child(3n) {margin-right: 2%;}
.lp_container .col-pc-4:nth-child(4n) {margin-right: 2%;}
.lp_container .col-sp-2:nth-child(2n) {margin-right: 0;}
.lp_container .col-sp-3:nth-child(3n) {margin-right: 0;}
.lp_container .col-sp-4:nth-child(4n) {margin-right: 0;
}

@media only screen and (min-width: 768px) {
  .lp_container .col-pc-2 {
    width: 49%;
    float: left;
    margin-right: 2%;
  }
  .lp_container .col-pc-3 {
    width: 32%;
    float: left;
    margin-right: 2%;
  }
  .lp_container .col-pc-4 {
    width: 23.5%;
    float: left;
    margin-right: 2%;
  }
  .lp_container .col-sp-2:nth-child(2n) {
    margin-right: 2%;
  }
  .lp_container .col-sp-3:nth-child(3n) {
    margin-right: 2%;
  }
  .lp_container .col-sp-4:nth-child(4n) {
    margin-right: 2%;
  }
  .lp_container .col-pc-2:nth-child(2n) {
    margin-right: 0;
  }
  .lp_container .col-pc-3:nth-child(3n) {
    margin-right: 0;
  }
  .lp_container .col-pc-4:nth-child(4n) {
    margin-right: 0;
  }
}
/* line
--------------------*/
.lp_container .BRbttm {
  border-bottom: 2px solid #CCC;
  margin-bottom: 3%;
  padding-bottom: 1%;
}
/* title
--------------------*/
.lp_container .headline {
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
  line-height: 1.4;}
.lp_container .headline.ptn01 {
  font-weight: 400;
  position: relative;}
.lp_container .headline.ptn01:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #c03;
  width: 5px;
  height: 24px;}
.lp_container .headline.ptn01:last-child {margin-bottom: 0;}
.lp_container .headline.ptn03 {
  display: inline-block;
  position: relative;
  line-height: 50px;
  vertical-align: middle;
  text-align: center;
  font-size: 18px;
  background: #c03;
  color: #FFF;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;}
.lp_container .headline.ptn03:before, .headline.ptn03:after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;}
.lp_container .headline.ptn03:before {
  top: 0;
  left: 0;
  border-width: 25px 0px 25px 10px;
  border-color: transparent transparent transparent #fff;
  border-style: solid;}
.lp_container .headline.ptn03:after {
  top: 0;
  right: 0;
  border-width: 25px 10px 25px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid;}
.lp_container .headline.ptn02 {
  font-size: 18px;
  text-align: center;}
.lp_container .headline.ptn02 span {
  position: relative;
  display: inline-block;
  padding: 0 0.5em;}
.lp_container .headline.ptn02 span::before, .headline.ptn02 span::after {
  position: absolute;
  top: 49%;
  content: '';
  width: 2em;
  height: 2px;
  background-color: #000;}
.lp_container .headline.ptn02 span::before {
  left: 100%;}
.lp_container .headline.ptn02 span::after {
  right: 100%;
}

@media only screen and (min-width: 768px) {
  .lp_container .headline.ptn02, .lp_container .headline.ptn03 {
    font-size: 26px;
  }
  .lp_container .headline {
    font-size: 26px;
    line-height: 1.4;
    margin-bottom: 20px;
  }
  .lp_container .headline.ptn01:after {
    width: 10px;
    height: 32px;
  }
}
/* button
--------------------*/
.lp_container .btnbox{width:85%;margin:0 auto;}
.lp_container .sng-btn {
    width: 84vw;
    margin-left: auto;
    margin-right: auto;
    max-width: 330px;
  }
@media screen and (min-width: 768px){
.lp_container .sng-btn {
    max-width: 330px;
    margin-left: auto;
    margin-right: auto;
}}
.lp_container .lp-btn{
  display: block;
  font-size: 3vw;
  line-height: 1.3em;
  text-decoration: none;
  color: #fff;
  text-align: center;
  /*padding: 3% 0;*/
  padding: 0.85em;
  margin-bottom: 2%;
  position: relative;
  background-color: #C03;
  /* ボタン角丸化に伴い追記 */
  border-radius: 6px;
}
.lp_container .btn-l {
    font-size: 18px;
  }
.lp_container .btn-s {
    font-size: 12px;
  } 
.lp_container .lp-btn::after {
  content: '';
  width: 7px;
  height: 7px;
  border: 0px;
  border-top: solid 1px #FFF;
  border-right: solid 1px #FFF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  margin-top: -5px;
  right: 10px;
}
.lp_container .btn-bd_red{
  background: #FFF;
  color: #000;
  border: 1px solid #c03;
}
.lp_container .btn-bd_red::after {
  content: '';
  border-top: solid 1px #c03;
  border-right: solid 1px #c03;
}

@media only screen and (min-width: 768px) {
  .lp_container .lp-btn {
    font-size: 15px;
  }
  .lp_container .btn-l {
    font-size: 24px;
  }
  .lp_container .btn-s {
    font-size: 14px;
  } 
  .lp_container .lp-btn::after {
    content: '';
    width: 10px;
    height: 10px;
    border: 0px;
    border-top: solid 2px #FFF;
    border-right: solid 2px #FFF;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    margin-top: -6px;
    right: 15px;
  }
  .lp_container .btn-bd_red::after {
  content: '';
  border-top: solid 1px #c03;
  border-right: solid 1px #c03;
}
}
.lp_container .lp-btn.bg-pink {
  background-color: #ec407a;}
.lp_container .lp-btn.bg-blue {
  background-color: #42a5f5;
}
/*------------------------------------------
  キャンペーン系のCSS
------------------------------------------*/
.lp_container .bnStyle .top {
  /* ドコモレッド赤ボタン */
  font-size: 16px;
  padding: 0.85em;
  background-color: #C03;
  letter-spacing: .1em;
}

@media all and (min-width: 768px) {
  .lp_container .bnStyle .top {
    font-size: 18px;
  }
}

.lp_container .bnStyle .top.large {
  /* ドコモレッド赤ボタン ちょっと大きめ */
  padding: 1em;
  font-size: 19px;
  letter-spacing: .02em;
}

@media all and (min-width: 768px) {
  .lp_container .bnStyle .top.large {
    font-size: 24px;
  }
}
/*------------------------------------------
  LPテンプレートCSS
------------------------------------------*/
/* カウントダウン */
.lp_container .cdt_wrapper {
  background-color: #333;
  font-weight: bold;
  text-align: center;
  line-height: 1.6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media all and (min-width: 768px) {
  .lp_container .cdt_wrapper {
    font-size: 1.8rem;
    padding: 0 20px;
  }
}

.lp_container .cdt_wrapper .cdt {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;}
.lp_container .cdt_wrapper .cdt_date,
.lp_container .cdt_wrapper .cdt_txt {
  font-size: 5.5vw;
  color: #fff;
}

@media all and (min-width: 768px) {
  .lp_container .cdt_wrapper .cdt_date,
  .lp_container .cdt_wrapper .cdt_txt {
    font-size: 1.8rem;
  }
}

.lp_container .cdt_wrapper .cdt_txt span {
  display: block;
  padding: 0 .4em;
  line-height: 1;}
.lp_container .cdt_wrapper .cdt_num {
  color: #fff;
  padding: 0 .15em;
  display: inline-block;
}

@media all and (min-width: 768px) {
  .lp_container .cdt_wrapper .cdt_num {
    line-height: 1;
    padding: .3em .15em;
  }
}

.lp_container .cdt_wrapper small {
  font-size: .6em;
  padding: 0 .4em;
  color: #FFF;
}

/* MVサイズスライダー */
.lp_container .mv_swiper {
  position: relative;
  padding-bottom: 18px;
  margin-bottom: 4.7%;
}

@media all and (min-width: 768px) {
  .lp_container .mv_swiper {
    padding-bottom: 30px;
    margin-bottom: 0;
  }
}

.lp_container .mv_swiper .swiper-container {
  overflow: hidden;
  padding: 0;
  opacity: inherit;}
.lp_container .mv_swiper .swiper-wrapper li {
  width: 100%;}
.lp_container .mv_swiper .swiper-wrapper li img {
  width: auto;
  max-width: 100%;
  cursor: pointer;}
.lp_container .mv_swiper .swiper-button-prev,
.lp_container .mv_swiper .swiper-button-next {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 22px;
  margin-top: -18px;
  z-index: 10;
  cursor: pointer;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  outline: none;
}

@media all and (min-width: 768px) {
  .lp_container .mv_swiper .swiper-button-prev,
  .lp_container .mv_swiper .swiper-button-next {
    width: 18px;
    height: 34px;
  }
}

.lp_container .mv_swiper .swiper-button-prev {
  left: 3%;}
.lp_container .mv_swiper .swiper-button-next {
  right: 3%;}
.lp_container .mv_swiper .swiper-pagination-bullets {
  bottom: 0;
  left: 0;
  width: 100%;}
.lp_container .mv_swiper .swiper-pagination-bullet {
  background: #a4a4a4;
  opacity: 1;
  margin: 0 5px;
  width: 7px;
  height: 7px;
}

@media all and (min-width: 768px) {
  .lp_container .mv_swiper .swiper-pagination-bullet {
    margin: 0 8px;
    width: 12px;
    height: 12px;
  }
}

.lp_container .mv_swiper .swiper-pagination-bullet-active {
  background: #353535;
  outline: none;
}

/* 見出し＋スライド＋テキスト＋ボタン
   NANOEXCLUSIVEM19AW */
.lp_container .sec-items {
  padding-top: calc(30 / 750 * 100%);
  padding-bottom: calc(40 / 750 * 100%);
}

@media all and (min-width: 768px) {
  .lp_container .sec-items {
    padding-top: calc(40 / 980 * 100%);
    padding-bottom: calc(38 / 980 * 100%);
  }
}

.lp_container .sec-items .sec-items__title {
  text-align: center;
  margin: 0 auto calc(30 / 750 * 100%);
  font-size: 16px;
  line-height: 1.5;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__title {
    font-size: 28px;
    letter-spacing: 0.02em;
    line-height: 1.5;
  }
}

.lp_container .sec-items .sec-items__title img {
  width: calc(257 / 750 * 100%);
  min-width: 120px;
  margin-bottom: 2px;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__title img {
    width: auto;
    max-width: 100%;
    margin-bottom: 5px;
  }
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__wrap {
    padding: 0 3%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__slider {
    width: calc(444 / 920 * 100%);
  }
}

.lp_container .sec-items .sec-items__slider .swiper_area {
  width: 94%;
  margin: 0 auto calc(30 / 750 * 100%);
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__slider .swiper_area {
    width: 100%;
    margin-bottom: 0;
  }
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__content {
    width: calc(450 / 920 * 100%);
  }
}
.lp_container .sec-items .sec-items__comment {
  width: calc(566 / 750 * 100%);
  margin: calc(40 / 750 * 100%) auto 0;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.02em;
  padding: 0.5em;
  border: 1px solid #333;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__comment {
    width: 100%;
    font-size: 14px;
    line-height: 1.5;
    padding: 0.5em 1em;
  }
}
.lp_container .sec-items .sec-items__detail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.lp_container .sec-items .sec-items__detail img{
  width: 100%;
}
.lp_container .sec-items .sec-items__detail li {
  width: 48.5%;}
.lp_container .sec-items .sec-items__detail li p {margin-top: .5em;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .sec-items__detail {
    width: 100%;
    font-size: 14px;
    line-height: 1.14286;
  }
}

.lp_container .sec-items .sec-items__btn .btn-price {
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  transition: opacity 0.4s;}
.lp_container .sec-items .sec-items__btn .btn-price:hover {
  opacity: 0.7;
}

/* .sec-items swiper周り */
.lp_container .sec-items .swiper_area {
  position: relative;
  padding-bottom: 18px;
  margin-bottom: 4.7%;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper_area {
    padding-bottom: 30px;
    margin-bottom: 0;
  }
}

.lp_container .sec-items .swiper-container {
  width: calc(500 / 706 * 100%);
  overflow: hidden;
  padding: 0;
  opacity: inherit;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper-container {
    width: 81%;
    max-width: 340px;
  }
}

.lp_container .sec-items .swiper-wrapper li {
  width: 100%;}
.lp_container .sec-items .swiper-wrapper li img {
  width: 100%;
  cursor: pointer;}
.lp_container .sec-items .swiper-button-prev,
.lp_container .sec-items .swiper-button-next {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 22px;
  margin-top: -18px;
  z-index: 10;
  cursor: pointer;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  outline: none;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper-button-prev,
  .lp_container .sec-items .swiper-button-next {
    width: 18px;
    height: 34px;
  }
}

.lp_container .sec-items .swiper-button-prev {
  left: 0;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper-button-prev {
    left: calc(5.4% - 18px);
  }
}

.lp_container .sec-items .swiper-button-next {
  right: 0;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper-button-next {
    right: calc(5.4% - 18px);
  }
}

.lp_container .sec-items .swiper-pagination-bullets {
  bottom: 0;
  left: 0;
  width: 100%;}
.lp_container .sec-items .swiper-pagination-bullet {
  background: #a4a4a4;
  opacity: 1;
  margin: 0 5px;
  width: 7px;
  height: 7px;
}

@media all and (min-width: 768px) {
  .lp_container .sec-items .swiper-pagination-bullet {
    margin: 0 8px;
    width: 12px;
    height: 12px;
  }
}

.lp_container .sec-items .swiper-pagination-bullet-active {
  background: #353535;
  outline: none;
}

/* インスタ風の画像リスト
   BCPREORDERL */
.lp_container .section_itemList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -3.8%;
  /* reset li margin */
  margin-bottom: 5%;}
.lp_container .section_itemList li {
  width: 30.8%;
  margin-top: 3.8%;
  position: relative;}
.lp_container .section_itemList li img {
  width: 100%;}
.lp_container .section_itemList li a:after {
  opacity: 0;
  -webkit-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
  content: '';
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  background: rgba(0, 0, 0, 0.85);}
.lp_container .section_itemList li a:hover:after {
  opacity: 0.5;}
.lp_container .section_itemList li a:hover {
  opacity: 1;
  /* default reset */
}

/* 売れ筋ランキング
   /campaign/mail200.html */
.lp_container .lanking {
  background: #ddd;}
.lp_container .lanking .lanking-ttl {
  text-align: center;
  margin-bottom: 0.8em;
  font-size: 20px;
  line-height: 1.6;
}

@media all and (min-width: 768px) {
  .lp_container .lanking .lanking-ttl {
    font-size: 28px;
  }
}

@media all and (min-width: 768px) {
  .lp_container .lanking .cover-hidecontent .list-item-cmn li:nth-child(9),
  .lp_container .lanking .cover-hidecontent .list-item-cmn li:nth-child(10) {
    display: block;
  }
}

.lp_container .lanking .cover-hidecontent .ranking_output_container + .box-link-list {
  border-bottom: 0;
}

/* SNSボタン
   /guide/gooddeal.html */
.snsList {
  border: 1px solid #ccc;
  margin: 10% 3% 3%;
  padding: 5% 2% 2%;}
.snsList .box-tit {
  background-color: #fff;
  width: 18em;
  margin: -8% auto 0;
}

@media all and (min-width: 768px) {
  .snsList .box-tit {
    width: 50%;
  }
}

.snsList ul {
  width: 90%;
  text-align: center;
  margin: 5% auto 3%;}
.snsList ul li {
  display: inline-block;
  width: 100%;
  margin: 1% 0;
}

@media all and (min-width: 768px) {
  .snsList ul li {
    width: 30%;
    margin: 1%;
  }
}

.snsList ul li a {
  display: block;
  color: #fff;
  border-radius: 6px;
}

@media all and (min-width: 768px) {
  .snsList ul li a:hover {
    -webkit-transition: opacity 0.4s;
    -o-transition: opacity 0.4s;
    transition: opacity 0.4s;
  }
  .snsList ul li a:hover:hover {
    opacity: 0.7;
  }
}

.snsList ul li img {
  width: 30px;
  height: 30px;
  margin: 1em 1em 1em 0;}
.snsList ul li.snsMailmag a {
  background-color: #f06292;}
.snsList ul li.snsMailmag a img {
  width: 26px;
  height: 32px;}
.snsList ul li.snsLine a {
  background-color: #1eb01e;}
.snsList ul li.snsInstagram a {
  background-color: #7e57c2;}
.snsList ul li.snsName {
  line-height: 1.1em;
  font-size: 0.9em;
  font-weight: bold;}
.snsList .btn-price {
  line-height: 25px;
}
/* shareボタン
--------------------*/
.sec-sns .sec-sns__text {
  text-align: center;
  margin-bottom: 0.85em;}
.sec-sns .sec-sns__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;}
.sec-sns .sec-sns__btn {margin-left: 1.6%;
  margin-right: 1.6%;
}

@media all and (min-width: 768px) {
  .sec-sns .sec-sns__btn {
    margin-left: 0.81633%;
    margin-right: 0.81633%;
  }
}

.sec-sns .sec-sns__btn a {
  display: block;
  width: 44px;
  height: 44px;
  background: #ddd;
  text-align: center;
  line-height: 44px;
  border-radius: 50%;
  overflow: hidden;
  color: #fff;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  transition: opacity 0.4s;}
.sec-sns .sec-sns__btn a:hover {
  opacity: 0.7;
}

@media all and (min-width: 768px) {
  .sec-sns .sec-sns__btn a {
    width: auto;
    height: auto;
    border-radius: 5px;
    line-height: 1;
    padding: 1em;
  }
}

.sec-sns .sec-sns__btn a i {
  font-size: 15px;
}

@media all and (min-width: 768px) {
  .sec-sns .sec-sns__btn a i {
    font-size: 1.1em;
    margin-right: .5em;
    vertical-align: middle;
    position: relative;
    top: -2px;
  }
.sec-sns .sec-sns__btn .fab{
    width:17px;/*icon size*/
    margin: 0 5px 2px 0;
}
}

@media all and (max-width: 767px) {
  .sec-sns .sec-sns__btn a span {
    display: none;
  }
  .sec-sns .sec-sns__btn .fab{
    max-width: 42%;/*icon size*/
    margin: 0 0 2px 0;
}
}
.sec-sns .sec-sns__btn.sns__twitter a {
  background: #1da1f2;
}
.sec-sns .sec-sns__btn.sns__fb a {
  background: #1877f2;
}
.sec-sns .sec-sns__btn.sns__line a {
  background: #00b900;
}

/* アニメーション関連
--------------------*/
.lp_container .js-animation:not(.show) {
  opacity: 0;}
.lp_container .js-animation:not(.show).active {
  -webkit-animation-name: fade-in-up;
  animation-name: fade-in-up;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@media all and (min-width: 768px) {
  .lp_container .js-animation.delay05s {
    -webkit-animation-delay: .5s;
    animation-delay: .5s;
  }
}

@-webkit-keyframes fade-in-up {
  from {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fade-in-up {
  from {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
  }
  to {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
/* モーダル関連
--------------------*/

/* 引用：moda_SNS.css */

.itemModal.modal{
  overflow-y: auto;
  -ms-overflow-style:none;/* IE, Edge */
  scrollbar-width: none;/* firefox */
  width: 80%;
  height: auto;
  max-width: 500px;
  max-height: 90%;
  margin: 0 auto;}
.itemModal.modal::-webkit-scrollbar{
  display:none !imporatnt;/* Chrome, Safari */
}

.itemModal .fancybox-close-small:after {
  top: 2%;
  right: 2%;
}/* ×印調整 */

.itemModal #modal{
  width: 100%;}
.itemModal #modal.box-inner {
  padding: 5% 4%;/* モーダル内部padding */
  box-sizing: border-box;}
.itemModal .modal_content {
  background: #fff;
  position: relative;
}

/* .modal_slidewrap */
.itemModal .modal_slidewrap {
  width: 86.7%;/* モーダル全体におけるスライダー幅 */
  /*padding-top: 86.7%;/* スライダー高さ */
  padding-top: 0;
  margin: 0 auto;
  margin-bottom: calc(7.6219% + 8px);
  position: relative;/* レスポンシブ化 */
}

.itemModal .modal_slidewrap .swiper-box {
  position: static;
  /*position: absolute;
  top: 0;
  left: 0;
  width: 100%;*/
}

.itemModal .modal_slidewrap .swiper-container {
  width: 100% !important;
  opacity: 1 !important;
  overflow: hidden;
  padding-bottom: 0 !important;}
.itemModal .modal_slidewrap .swiper-container img {
  width: 100% !important;
  vertical-align: bottom;}
.itemModal .swiper-container .swiper-slide {
  width: 100% !important;
  padding: 1px;/* reset */
}

.itemModal .swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 4px;
  vertical-align: top;}
.itemModal .swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #00a0e9;}
.itemModal .swiper-pagination {
  width: 100%;
  height: 8px;
  margin-top: 3.8%;}
.itemModal .modal_slidewrap .swiper-button-prev {
  right: 100%;
  left: auto;}
.itemModal .modal_slidewrap .swiper-button-next {
  right: auto;
  left: 100%;
}

/* modal_itemtext */
.itemModal .modal_itemtext {
  line-height: 1.6;}
.itemModal .modal_itemtext_fav {
  text-align: center;}
.itemModal .modal_itemtext_fav span {margin-bottom: 1.5em;}
.itemModal .modal_itemtext_fav span {
  background: #353535;
  color: #fff;
  letter-spacing: 0.075em;
  display: inline-block;
  padding: 0.5em 2em;
  border-radius: 20px;
  position: relative;
  font-size: 12px;}
.itemModal .modal_itemtext_fav span:before {
  content: '';
  display: inline-block;
  border-top: 8px solid #353535;
  border-left: 8px solid transparent; 
  border-right: 8px solid transparent;
  position: absolute;
  left: calc(50% - 4px);
  top: 100%;}
.itemModal .modal_itemtext_fav span:after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  background: url(/excludes/df/section/WEBSHOPSNSITEM/icon_SNS_02.gif) center no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-left: 4px;}
.itemModal .modal_itemtext_detail {
  width: 86.7%;
  margin: 0 auto 3%;}
.itemModal .modal_itemtext_detail dt {
  font-weight: bold;
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: 0.075em;
  margin-bottom: 0.5em;}
.itemModal .modal_itemtext_detail dd {
  font-size: 12px;
  line-height: 1.5;}
.itemModal .modal_itemtext_btn a {
  text-align: center;
  display: block;
  padding: 1em;
  letter-spacing: 0.1em;
  background: #e24154;
  color: #fff;
  position: relative;
  border-radius: 4px;}
.itemModal .modal_itemtext_btn a:after {
  content: '';
  width: 8px;
  height: 8px;
  border: 1px solid #fff;
  border-bottom: 1px solid transparent;
  border-left: 1px solid transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  display: block;
  position: absolute;
  right: 6.5%;
  top: calc(50% - 5px);
  }

/*category*/
#categories .box-c-list {
    border-top: solid #CCCCCC 1px;
}
#categories .box-c-inner-list__link {
      height: 4em;
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      align-items: center;
      -webkit-align-items: center;
      position: relative; }
      #categories .box-c-inner-list__link.icn-link:after {
        display: block;
        position: absolute;
        top: 50%;
        right: 5px;
        margin-top: -12px; }
#categories .box-c-inner-list__item {
      width: 50%;
      height: 4em;
      padding: 0 0 0 0;
      margin: 0 0 0 0;
      border-bottom: solid #CCCCCC 1px; }
#categories .box-c-inner-list__item{width: 100%;border-right: 0;height:100%;}
#categories .box-c-inner-list__link{height:100%;}
#categories .box-c-list__tit-thumb img {
    transform: scale(1.2);
}
#categories .box-c-inner-list__inner {
      margin: 0 30px 0 10px;
      padding: 5px 0;
  font-size: 12px;
      vertical-align: middle}
@media (min-width: 980px){
#categories .box-c-list {
    border-top: none;
    border-bottom: solid #CCCCCC 1px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: flex-start;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 30px 40px;
}
#categories .box-c-list{margin:0;}
#categories .box-c-inner-list__link{padding:1% 2%;}
#categories .box-c-inner-list__item{width: 50%;border: 1px solid #ccc;border-width:1px 0;margin-bottom: -1px;}
#categories .box-c-inner-list__item:nth-child(odd){border-width:1px 1px 0 0;}
#categories .box-c-list__tit-thumb{max-width: 64px;width: 20%;position: static;display: inline-block;margin-right: 2%;}
#categories .box-c-inner-list__link.icn-link:after{right:2%;}
}
#categories .box-c-list__tit-thumb{width: 45px;height: 45px;overflow: hidden;}
#categories .box-c-list__tit-thumb img{transform: scale(1.2);}
#categories .box-c-list__tit-thumb img.tf_btm{transform-origin:bottom center;}
#categories .box-c-list__tit-thumb img.tf_bl{transform-origin:bottom left;}
#categories .box-c-inner-list__link{display: flex;}
#categories .box-c-inner-list__inner {font-size: 14px;}

/*SEO対策FAQ*/
.lp_container .simplifiedfaq .box-c-list03__tit{padding-left:3%;border-top: 1px solid #ccc;border-bottom: 0;}
.lp_container .simplifiedfaq .box-c-list03__tit .btn-ac::before {content: '';}
.lp_container .simplifiedfaq .js-ac-content{padding: 3%;}


/* スクロールスライダー .swiper-scroll 201001*/
.lp_container .swiper-scroll {
  padding-bottom: 20px;
  position: relative;
  overflow: hidden;
}

@media all and (min-width: 768px) {
  .lp_container .swiper-scroll {
    padding-bottom: 40px;
    width: 93.87755%;
  }
}

.lp_container .swiper-scroll .swiper-slide {
  padding: 0;
  padding-left: 3.2%;
}

@media all and (min-width: 768px) {
  .lp_container .swiper-scroll .swiper-slide {
    padding-left: 0;
    padding-right: 2.2449%;
  }
}

.lp_container .swiper-scroll .swiper-scrollbar {
  width: 94%;
  left: 3%;
}

@media all and (min-width: 768px) {
  .lp_container .swiper-scroll .swiper-scrollbar {
    width: 100%;
    left: 0%;
  }
}

.lp_container .swiper-scroll .swiper-scrollbar-drag {
  /* スクロールバーのカラーが変更できます */
  background-color: inherit;
}


/* TAB_special */

#fwCms_wrapper .cont_wrap{
	display: none;
}
#fwCms_wrapper .cont_wrap:nth-child(1){
	display: block;
}
#tab_conts li {
	width: 100%;
	background: #fff;
	line-height: 1.5em;
	text-align: center;
	border-left: 1px solid #424242;
	border-bottom: 1px solid #424242;
	font-size: 14px;
	/*margin-bottom: 3%;*/
}
#tab_conts li a{
	padding: 0.8em 0;
	display: block;
}
ul#tab_conts {
	display: flex;
	border-top: 1px solid #424242;
}
#tab_conts li:first-child{
	border-left: none;
}
#tab_conts li.tab_select a {
	background: #424242;
	color: #fff;
}
#fwCms_wrapper .cont_wrap>.box-link-list:last-child{
	border-bottom: 0;
}

@media screen and (min-width:768px) {
#tab_conts li {
	line-height: 20px;
	font-size: 18px;
	/*margin-bottom: 20px;*/
}
#tab_conts li a {
	padding: 20px;
	display: block;
}
}