@charset "utf-8";


/* TOP */
.top{
width: 100%;
margin: 0 auto;
padding: 40px 0 0 0;
}
.top > .title{
width: 100%;
text-align: center;
margin: 0 auto 40px auto;
}
.top > .title > h1{
font-size: 80px;
line-height: 80px;
}
.top > .title > span{
font-size: 32px;
line-height: 32px;
}
.top > img{
width: 100%;
margin: 0 auto;
}


/* イベント概要 */
.about{
max-width: 1000px;
margin: 0 auto;
padding: 60px 0;
}
.about > .text{
width: 50%;
float: left;
margin: 0;
padding: 0 10px;
}


/* グッズ一覧 */
.goods{
max-width: 1200px;
margin: 0 auto;
padding: 60px 0;
}
.goods-content{
width: 100%;
margin: 0 auto;
}
.goods-content > .box{
width: 50%;
float: left;
margin: 0;
padding: 0 10px;
}
/* テキスト */
#goods-text > .tags{
width: 100%;
margin: 0 0 20px -10px;
}
#goods-text > .tags > span{
background: #424242;
font-size: 14px;
line-height: 14px;
margin: 0 5px;
padding: 2px 10px;
}
#goods-text > h3{
width: 100%;
display: block;
font-size: 30px;
line-height: 34px;
color: #FF9800; /* イベントカラー */
margin: 0 0 40px 0;
}
#goods-text > h3:before{
width: 100%;
height: 100%;
content: " ";
border-left: 8px #FF9800 solid; /* イベントカラー */
position: absolute;
top: 0;
left: -22px;
}
#goods-text > .text{
width: 100%;
margin: 0;
}
/* イメージ */
#goods-image{
display: block;
}
#goods-image > img{
width: 100%;
margin: 0;
}
#goods-image-sp{
width: 100%;
display: none;
margin: 0 auto 20px auto;
}


/* キャンペーン */
.campaign{
max-width: 1200px;
margin: 0 auto;
padding: 60px 0;
display:-webkit-box;
display:-moz-box;
display:-ms-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
.campaign-content{
width: 50%;
float: left;
margin: 0 0 40px 0;
padding: 0 20px;
}
.campaign-content > .box{
width: 100%;
height: 100%;
overflow: hidden;
box-shadow: rgba(0,0,0,0.2) 0px 1px 6px 1px; -webkit-box-shadow: rgba(0,0,0,0.2) 0px 1px 6px 1px; -moz-box-shadow :rgba(0,0,0,0.2) 0px 1px 6px 1px;
border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px;
margin: 0;
}
.campaign-content > .box > .line{
width: 100%;
height: 10px;
background: url(../image/common/background01.gif) repeat center top;
margin: 0 auto;
}
.campaign-content > .box > h3{
width: 100%;
display: block;
font-size: 30px;
line-height: 34px;
margin: 0 auto;
padding: 40px;
}
.campaign-content > .box > .image{
width: 100%;
margin: 0;
padding: 0 40px;
}
.campaign-content > .box > .image > img{
width: 100%;
margin: 0;
}
.campaign-content > .box > .text{
width: 100%;
margin: 0;
padding: 40px;
}
.campaign > hr{
display: none;
}


/* リンク */
.site-link{
max-width: 1200px;
margin: 0 auto;
padding: 60px 0;
}
.site-link-content{
width: 20%;
display: block;
float: left;
margin: 0;
padding: 0 20px;
}
.site-link-content:link{
text-decoration: none;
}
.site-link-content > .box{
width: 100%;
text-align: center;
margin: 0;
}
.site-link-content > .box > img{
width: 100%;
border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%;
margin: 0 0 20px 0;
}


/* c表記 */
.copyright{
width: 100%;
text-align: center;
margin: 0 auto;
}



/* レスポンシブ */


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

  /* TOP */
  .top{
  padding: 20px 0 0 0;
  }
  .top > .title{
  margin: 0 auto 20px auto;
  }
  .top > .title > h1{
  font-size: 50px;
  line-height: 54px;
  }
  .top > .title > span{
  font-size: 20px;
  line-height: 20px;
  }

  /* イベント概要 */
  .about{
  padding: 40px 0;
  }
  .about > .text{
  width: 100%;
  float: none;
  margin: 0;
  padding: 0;
  }

  /* グッズ一覧 */
  .goods{
  padding: 40px 0;
  }
  .goods-content > .box{
  width: 100%;
  float: none;
  padding: 0;
  }
  #goods-text > h3:before{
  display: none;
  }
  #goods-text > h3 > br{
  display: none;
  }
  /* イメージ */
  #goods-image{
  display: none;
  }
  #goods-image-sp{
  display: block;
  }

  /* キャンペーン */
  .campaign{
  margin: 0 auto;
  padding: 40px 0;
  display: block;
  }
  .campaign-content{
  width: 100%;
  float: none;
  margin: 0 auto 20px auto;
  padding: 0;
  }
  .campaign-content > .box{
  box-shadow: rgba(0,0,0,0.0) 0px 1px 6px 1px; -webkit-box-shadow: rgba(0,0,0,0.0) 0px 1px 6px 1px; -moz-box-shadow :rgba(0,0,0,0.0) 0px 1px 6px 1px;
  border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px;
  }
  .campaign-content > .box > .line{
  display: none;
  }
  .campaign-content > .box > h3{
  font-size: 30px;
  line-height: 34px;
  color: #FF9800; /* イベントカラー */
  padding: 20px 0;
  }
  .campaign-content > .box > .image{
  padding: 0;
  }
  .campaign-content > .box > .text{
  padding: 20px 0;
  }
  .campaign > hr{
  display: block;
  }

  /* リンク */
  .site-link{
  padding: 40px 0;
  }
  .site-link-content{
  width: 50%;
  margin: 0 0 40px 0;
  }

}

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

  /* グッズ一覧 */
  #goods-text > h3{
  font-size: 24px;
  line-height: 28px;
  }

  /* キャンペーン */
  .campaign-content > .box > h3{
  font-size: 24px;
  line-height: 28px;
  }

  /* リンク */
  .site-link-content{
  margin: 0 0 20px 0;
  }
  .site-link-content > .box > span{
  display: none;
  }

}


/* end */