@charset "utf-8";

/*
キャラA：#5EC656
コミケS：#2DBEFF
電気街S：#FF9800
キャラO：#FF7444
コミケW：#916AFF
電気街W：#EF5350
*/

/* 共通 */
/* 注意テキスト追加 */
.caution{
width: 100%;
text-align: center;
margin: 0 auto 40px auto;
}


/* TOP */
#top{
max-width: 1660px;
overflow: hidden;
position: relative;
margin: 0 auto;
}
#top .title{
width: 100%;
z-index: 5;
text-align: center;
position: relative;
margin: 0 auto;
padding: 40px 0;
}
#top .title h1{
max-width: 500px;
font-size: 80px;
line-height: 80px;
margin: 0 auto;
}
#top .title h1 img{
width: 100%;
}
#top .title span{
font-size: 32px;
line-height: 32px;
color: #2DBEFF;
}
#top > img{ /* イメージ */
width: 100%;
display: block;
position: relative;
margin: 0 auto;
}


/* ランゲージ */
#language{
max-width: 180px;
background: #EEEEEE;
display: flex;
justify-content: center; /* 水平 */
position: relative;
margin: 0 auto;
padding: 10px;
}
#language a{
font-size: 14px;
line-height: 14px;
text-decoration: none;
}
#language #selecting{ color: #FF4949; }
#language span{ color: #9E9E9E; }


/* イベント概要 */
#about{
max-width: 1000px;
display: flex;
flex-wrap: wrap;
position: relative;
margin: 0 auto;
padding: 40px 0;
}
#about .text{
width: 50%;
position: relative;
margin: 0;
padding: 0 10px;
}
#about .text dl{
width: 100%;
display: flex;
margin: 0 0 10px 0;
}
#about .text dl dt{
width: 110px;
margin: 0 5px 0 0;
}
#about .text dl dd{
width: 100%;
margin: 0;
}
#about .text dl:last-child{ margin: 0; }


/* グッズ一覧 */
#goods{
max-width: 1200px;
position: relative;
margin: 0 auto;
padding: 40px 0;
}
#goods .content{
width: 100%;
display: flex;
position: relative;
margin: 0 auto;
}
#goods .content #goods-text,
#goods .content #goods-image{
width: 100%;
position: relative;
}
/* グッズ一覧 テキスト */
#goods #goods-text .tags{
width: 100%;
margin: 0 0 20px -10px;
}
#goods #goods-text .tags span{
background: #424242;
font-size: 14px;
line-height: 14px;
margin: 0 5px;
padding: 3px 10px;
border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;
}
#goods #goods-text h3{
width: 100%;
display: block;
font-size: 30px;
line-height: 34px;
color: #2DBEFF; /* イベントカラー */
position: relative;
margin: 0 0 30px 0;
padding: 0 0 0 18px;
}
#goods #goods-text h3:before{
width: 0px;
height: 100%;
content: " ";
border-left: 8px #2DBEFF solid; /* イベントカラー */
border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px;
position: absolute;
top: 0;
left: 0;
}
#goods #goods-text > div{
width: 100%;
position: relative;
margin: 0;
}
#goods #goods-text > div p{
width: 100%;
position: relative;
margin: 0 0 20px 0;
}
#goods #goods-text > div p:nth-child(2){
font-weight: 900;
}
/* グッズ一覧 概要 */
#goods #goods-text > div .overview{
width: 100%;
position: relative;
margin: 0;
}
#goods #goods-text > div .overview dl{
width: 100%;
display: flex;
margin: 0 0 5px 0;
}
#goods #goods-text > div .overview dl dt{
width: 130px;
margin: 0 5px 0 0;
}
#goods #goods-text > div .set dl dt{  /* セット内容用 */
width: 16px;
}
#goods #goods-text > div .overview dl dd{
width: 100%;
margin: 0;
}
#goods #goods-text > div .overview dl:last-child{ margin: 0; }
/* グッズ一覧 イメージ */
#goods #goods-image img{
width: 100%;
margin: 0;
}
#goods #goods-image-sp{
width: 100%;
display: none;
margin: 0 auto 20px auto;
}


/* 収納した情報一覧 */
.goods-min{
max-width: 100%;
margin: 0 auto;
padding: 60px 0 20px 0;
}
.good-thumbnail{
width: 16.66%;
display: block;
float: left;
margin: 0 0 40px 0;
padding: 20px;
text-decoration: none;
}
.good-thumbnail img{
width: 100%;
margin: 0 0 10px 0;
}
.good-thumbnail > .text{
width: 100%;
/*
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
*/
margin: 0;
}
.good-thumbnail:hover{
color: #FFFFFF;
background: #2DBEFF;  /* イベントカラー */
}
.good-thumbnail:hover > .text,
.good-thumbnail:hover > .text > span{
color: #FFFFFF;
}
/* 収納した情報用 */
.goods-min-box{
display: none;
}
.goods-min-content{
max-width: 1280px;
background: #FFFFFF;
overflow-y: auto;
margin: 0 auto;
padding: 40px;
}
.goods-min .T-14px{
font-size: 14px;
line-height: 18px;
}


/* キャンペーン */
.campaign{
max-width: 1200px;
margin: 0 auto;
padding: 60px 0;
}
.campaign .goods-content{
margin: 0 auto 60px auto;
}
.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: #2DBEFF;  /* イベントカラー */
/* background: #2DBEFF url(../image/common/background01.png) 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%;
display: block;
margin: 0 auto;
}
.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: 16.66%;
display: block;
float: left;
margin: 0;
padding: 0 20px 40px 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: 1000px){


/* TOP */


/* イベント概要 */
#about{
display: block;
padding: 40px 0 0 0;
}
#about .text{
width: 100%;
margin: 0 0 10px 0;
padding: 0;
}


/* グッズ一覧 */
#goods .content{ display: block; }
/* グッズ一覧 テキスト */
#goods #goods-text h3{ margin: 0 0 20px 0; }
#goods #goods-text h3:before{ display: none; }
#goods #goods-image{ display: none; }
#goods #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: #2DBEFF; /* イベントカラー */
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: 33.33%;
margin: 0 0 40px 0;
}

}

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

.caution{
text-align: left;
}

/* TOP */
.top > .title{
padding: 20px 0;
}

/* グッズ一覧 */
#goods-text > h3{
font-size: 24px;
line-height: 28px;
}
/* 収納した情報一覧 */
.good-thumbnail{
width: 50%;
}

/* キャンペーン */
.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;
}
.site-link-content{
width: 50%;
}

}


/* end */