@charset "utf-8";
/* CSS Document */

#wonderstretch {
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	font-size: 1.1rem;
	line-height:1.6em;
  color: #FFFFFF;
	-webkit-text-size-adjust: 100%;
  font-feature-settings: "palt";
  text-align: center;
  background-color: #000000;
}

#wonderstretch .font_source-han-sans-japanese {
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 900;
  font-style: normal;
}

#wonderstretch .font_brothers {
  font-family: "brothers", sans-serif;
  font-weight: 400;
  font-style: normal;
}

#wonderstretch .font_70 {
  font-size: 70%;
}

#wonderstretch .text_dot {
     border-bottom: 3px dotted #fee302;
}

/*::::::::::::::::::::::::::::::::::
　共通項目
:::::::::::::::::::::::::::::::::::*/


#wonderstretch .common_p_margin {
  margin: auto 2em;
}

#wonderstretch .common_ta_canter {
  text-align: center;
}

#wonderstretch .common_mt50 {
  margin-top: 5em;
}

#wonderstretch .mgt_minus {
  margin-top: -25px;
}

#wonderstretch .pb_plus {
  padding-bottom: 3em;
}

/*::::::::::::::::::::::::::::::::::
　トップイメージ
　～ふわっとエフェクト～
:::::::::::::::::::::::::::::::::::*/

div.animation_box {
  padding: 10px;
  animation: fadeIn 3s ease 1s 1 normal backwards;
}
 
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/*::::::::::::::::::::::::::::::::::
　タイトルデコレーション
:::::::::::::::::::::::::::::::::::*/


#wonderstretch h2 {
  font-size: 3.4rem;
	line-height:1.0em;
}

#wonderstretch h3 {
  font-size: 1.2rem;
  text-align: left;
}

#wonderstretch h4 {
  font-size: 1.6rem;
}

/*::::::::::::::::::::::::::::::::::
　商品見出し
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .item_title {
  background-color: #fff;
  color: #000;
  padding-bottom: 1em;
  margin-top: -1em;
}

#wonderstretch .item_title_pa {
  padding-top: 3em;
  padding-bottom: 1em;
}



/*::::::::::::::::::::::::::::::::::
　ストレッチ×タフネス×ソフト
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .material_point {
  display: flex;
  justify-content:space-around;
  align-items: center;
  margin: 2em 3em;
}


#wonderstretch .back_yellow {
  background-color: #fee302;
  color: #000000;
  padding: 0.6em 1.4em;
  font-size: 1.6rem;
}

#wonderstretch .text_yellow {
  color: #fee302;
}


/*::::::::::::::::::::::::::::::::::
　生地の説明
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .material_ex {
  margin: 0.8em 2.8em;
  text-align: left;
}

#wonderstretch .material_ex p {
  font-size: 1.1rem;
}

#wonderstretch .material_ex img {
  margin: 1em auto;
}

#wonderstretch .material_ex ul {
  text-align: left;
  line-height: 1.1rem;
  font-size: 0.8rem;
  margin: 0.8em 2.8em;
}


/*::::::::::::::::::::::::::::::::::
　商品詳細 Detail
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .detail_item {
  display: flex;
  justify-content:space-around;
  align-items: center;
}

/*::::::::::::::::::::::::::::::::::
　アンバサダー
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .ambassador p {
  text-align: left;
}

#wonderstretch .ambassador_h3 {
  margin-top: 2em;
  margin-bottom: 1em;
}

#wonderstretch .ambassador_js {
  background-color: #fff;
  color: #000;
  margin: 1em 2em 3em;
}

#wonderstretch .ambassador_js p {
  font-size: 0.8rem;
  line-height: 1.6em;
}


/*::::::::::::::::::::::::::::::::::
　開発者のこだわり
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .commitment p {
  text-align: left;
}

#wonderstretch .commitment_img {
  display: flex;
  justify-content:space-around;
  align-items: center;
}

#wonderstretch .commitment_img .img02 {
  padding-top: 5em;
}


/*モデル画像 横からスライド*/
.img__items.offs .effect {
  opacity: 0;
  transform: translate(0, 100px);
  -webkit-transform: translate(0, 100px);
}
.img__items.ons .effect {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: all 2s ease;
  transition: all 2s ease；;
}
/*以下、遅延の設定*/
.img__items.ons .delay-1 {
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
.img__items.ons .delay-2 {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}


/*::::::::::::::::::::::::::::::::::
　驚きの低価格
:::::::::::::::::::::::::::::::::::*/

#wonderstretch .surprised_price p {
  text-align: left;
}

#wonderstretch .img_bottom {
  background-color: #fff;
}


/*::::::::::::::::::::::::::::::::::
　デフォルト表示調整
:::::::::::::::::::::::::::::::::::*/

/*:: もっと見るを非表示にする :::::::::::::::::::::::*/
.block-link { 
  display: none;
}

.btn-more-link {
  margin-top: 30px;
  text-align: center;
}

.btn-more-link--link {
  padding: 0.5em 1em;
  margin: 2em 0;
  font-weight: bold;
  color: #363636;
  background: #FFF;
  border: solid 1px #363636;
  border-radius: 10px;
}

/*:: イベント上部の余白削除 :::::::::::::::::::::::*/
.block-top-event {
  padding: 0px;
}

/*:: 商品サムネイル中央寄せ :::::::::::::::::::::::*/
.block-thumbnail-t {
  display: flex;
  justify-content: center;
}

/*:: サムネイル商品名左寄せ :::::::::::::::::::::::*/
.block-thumbnail-t--goods-name {
    text-align: left;
}

/*:: サムネイル背景色 :::::::::::::::::::::::*/
.block-event-page--goods ,
.block-thumbnail-t {
  background-color: #fff;  
}


/*:: 表示形式を非表示にする :::::::::::::::::::::::*/
.block-goods-list--sort-order-items{ 
  display: none;
}
.block-goods-list--display-style-items {
  display: none;
}

/*:: 表示件数（上）を非表示にする :::::::::::::::::::::::*/
.block-goods-list--pager-top{ 
  display: none;
}

/* 表示件数（下）を非表示にする */
.block-goods-list--pager-bottom{ 
  display: none;
}