img{
  width: 100%;
}

.green{
  color: #ccff00;
}

.yellow{
  color: #ffea00;
}

.txt-l{
  position: relative;
  bottom: -2px;
  font-size: 150%;
  
}

.cp-tradingcard{
  overflow: hidden;
  margin-bottom: 0 !important;
  background-image: url(../../../img/lp/release_campaign_tradingcard/tile.png);
  background-repeat: repeat;
  background-size: 43px 47px;
}

.view-pc{
  margin: 0 auto;
  width: 700px;
}

.hero-img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

.commission{
  margin-top: -125px;
}


.cp-tradingcard-inner{
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 45px 0 30px;
  position: relative;
  z-index: 10;
}

.week-block {
  margin: 10px 0 60px 0;
}

.week-block h2.week {
  color: #ccff00;
  font-size: 3.8rem;
  font-weight: bold;
  font-style: italic;
  letter-spacing: 1px;
  white-space: nowrap;
  text-align: center;
}

.week-block h2.week span {
  background: #ccff00;
  color: #000;
  font-size: 3.5rem;
  padding: 4px 8px 3px 57px;
  font-weight: bold;
  font-family: Roboto,YuGothic,sans-serif;
  font-style: italic;
  letter-spacing: 1px;
  position: relative;
  top: -3px;
  margin-right: 10px;
}

.week-block h2.week span::before{
  content: "";
  position: absolute;
  left: 10px;
  top: 4px;
  width: 40px;
  height: 40px;
  background-image: url(../../../img/lp/release_campaign_tradingcard/icon-week.png);
  background-repeat: no-repeat;
  background-size: 40px 40px;
}

.week-block .date {
  color: #fff;
  font-size: 2.4em;
  font-weight: bold;
  letter-spacing: 1px;
  margin: 30px 0 55px 0;
  text-align: center;

  font-family: din-2014, Avenir, 'Hiragino Sans', 'ヒラギノ角ゴ Pro W3','游ゴシック体', 'Yu Gothic', YuGothic, 'メイリオ','ＭＳ Ｐゴシック',sans-serif;
}

.week-block .present,
.week-block .coupon{
  position: relative;
  margin-bottom: 60px;
  padding: 0 15px 30px;
  background:  rgba(255,255,255,0.1);

  font-family: din-2014, Avenir, 'Hiragino Sans', 'ヒラギノ角ゴ Pro W3','游ゴシック体', 'Yu Gothic', YuGothic, 'メイリオ','ＭＳ Ｐゴシック',sans-serif;
}

.week-block .present .title-box,
.week-block .coupon .title-box {
	position:relative;
  top: -20px;
  width: calc(100% - 60px);
	height: 50px;
  margin: 0 auto;
	background:#ccff00;
}

.week-block .present .title-box:before,
.week-block .coupon .title-box:before{
	content:"";
	display:block;
	position:absolute;
	top:0;
	left:-16px;
	border-top:25px solid transparent; 
	border-bottom:25px solid transparent;
	border-right:16px solid #ccff00;
}
.week-block .present .title-box:after,
.week-block .coupon .title-box:after{
	content:"";
	display:block;
	position:absolute;
	top:0;
	right:-16px;
	border-top:25px solid transparent;
	border-bottom:25px solid transparent;
	border-left:16px solid #ccff00;
}

.week-block .present .title-box .title,
.week-block .coupon .title-box .title {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
  font-size: 2.8rem;
  font-weight: 600;
  font-weight: bold;
  text-align: center; 
}

.week-block .present .sec-title{
  margin: 0 0 20px 0;
  color: #fff;
  font-size: 3.5em;
  font-weight: bold;
  line-height: 1.1;
  letter-spacing: 1px;
  text-align: center;
}

 .week-block .item-block {
  width: 100%;
  height: auto;
  position: relative;
  margin: 0;
}

.week-block .present .item-wrapper .item-block .item-img{

}

.week-block .present .item-wrapper .item-block .item-img img{
  width: 100%;
}

.week-block .present .item-wrapper .item-block .choice {
  margin: 15px 0 20px 0;
  color: #fff;
  font-size: 2.6rem;
  font-weight: bold;
  line-height: 1.0;
  text-align: center;
  /* text-decoration: underline;
  text-decoration-color: #cf0;
  text-underline-offset: 4px;
  text-decoration-thickness: 2px; */
}

.week-block .present .item-wrapper .item-block .item-list-wrap{
  width: 350px;
  margin: 0 auto;
}

.week-block .present .item-wrapper .item-block .item-list-title{
  color: #fff;
  font-size: 2.0rem;
  font-weight: 600;
  margin: 15px 0 10px 0;
  padding: 5px 0 4px;
  background: #ffffff20;
  text-align: center;
}

.week-block .present .item-wrapper .item-block .item-list{
  margin: 0 0 20px 0;
}

.week-block .present .item-wrapper .item-block .item-list li{
  margin-left: 18px;
  color: #fff;
  line-height: 1.5;
  list-style: square;
}

.week-block .present .item-wrapper .item-block .item-list li a{
  color: #fff;
  font-weight: 300;
  font-size: 1.3rem;
  line-height: 2;
  text-decoration: underline;
}

.week-block .present .notice{
  color: #fff;
  font-size: 1.2em;
  font-weight: 300;
  letter-spacing: 1px;
  margin: 15px 0 20px 0;
  text-align: center;
}


/* tweet */
.week-block .item-block .btn {
  width: 100%;
  height: 50px;
  text-align: center;
  display: inline-block;
  border-radius: 5px;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 3.4;
  z-index: 10;
  position: relative;
  box-sizing: border-box;
}

.week-block .item-block .btn.tweet {
  border: 2px solid #3399ff;
  color: #3399ff;
  background-image: url(../../../img/campaign/cam-btn-icon-1-20190520.png);
  background-color: rgba(0,0,0,0.3);
  background-size: 28px auto;
  background-repeat: no-repeat;
  background-position: left 12px center;
  margin: 25px 0 0 0;
}

.week-block .item-block .btn.sell {
  border: 2px solid #fff;
  color: #fff;
  background-image: url(../../../img/lp/release_campaign_tradingcard/icon-sell.png);
  background-color: rgba(0,0,0,0.3);
  background-size: 28px auto;
  background-repeat: no-repeat;
  background-position: left 12px center;
  margin: 25px 0 0 0;
}

/* WEB ONLY */
.week-block .item-block .app-btn-text {
  font-size: 1.6rem;
  color: #fff;
  font-weight: bold;
  margin: 25px 0 15px;
  text-align: center;
}


.campaign .week-block .item-block .app-store-block {
  width: 300px;
  height: auto;
  text-align: center;
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

/* APP ONLY */
.campaign .week-block .item-block .btn {
  width: 350px;
  height: 50px;
  text-align: center;
  display: block;
  border-radius: 5px;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 3.4;
  z-index: 10;
  position: relative;
  box-sizing: border-box;
  left: 50%;
  transform: translateX(-50%);
}

.campaign .week-block .item-block .btn.submit {
  color: #fff;
  background-color: #ff0033;
  background-image: url(../../../img/campaign/cam-btn-icon-2-20190520.png);
  background-size: 25px auto;
  background-repeat: no-repeat;
  background-position: left 12px center;
  border: none;
  outline: none;
}

.campaign .week-block .item-block .btn.before {
  opacity: 0.5;
  border: none;
  background-color: #333;
  cursor: not-allowed;
}

.campaign .week-block .item-block .btn.submit.end {
  opacity: 0.5;
  background-color: #333;
  cursor: not-allowed;
}

.coupon .coupon-txt-s{
  margin-bottom: 10px;
  color: #fff;
  font-size: 2.0rem;
  font-weight: bold;
  text-align: center;
}

.coupon .coupon-txt-l{
  margin-bottom: 15px;
  color: #fff;
  font-size: 2.8rem;
  font-weight: bold;
  text-align: center;
}

.coupon .link{
  text-align: center;
}

.coupon .txt-link{
  color: #fff;
  font-size: 1.5rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.liner{
  width: 100%;
}

.commission-2{
  margin: -20px 0 60px;
}

.attention{
  font-size: 1.3rem;
  line-height: 1.5;
  font-weight: 300;
  color: #fff;
}

.attention li{
  padding-left:1em;
	text-indent:-1em;
}


/* 注意事項など */
.note{
  margin-bottom: 60px;
  padding: 0 15px;
}

.note-t{
  color: #fff;
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 10px;
}

.note ul{
  margin-bottom: 20px;
}

.note-s{
  margin-bottom: 5px;
  color: #fff;
  font-size: 1.3rem;
  font-weight: 300;
  line-height: 1.5;
  padding-left:1em;
	text-indent:-1em;
}


/* シェア */
.share-box {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 99;
}

.share-box ul {
  display: inline-block;
}

.share-box ul li {
  display: inline-block;
  margin: 10px 0 0 5px;
}

.share-box ul li.fb div {
  top: -2px;
}