@charset "UTF-8";

/* ----------------------------------------------------
作成日: 2017.01.13
最終更新日: 

common.css： 共通設定
---------------------------------------------------- */

body {
	position:relative;
	min-width: 320px;
	font-size:41.6875% sans-serif;
	/*font-size:62.5%;10px*/
	font-family:"メイリオ", "ＭＳ Ｐゴシック", Helvetica , sans-serif;
	-webkit-text-size-adjust: 100%;
	line-height:1.6;
	background:url("../image/bg.jpg") repeat;
    height:100%;
}

img {
	max-width: 100%; 
	height:auto;
}
a:link, a:hover, a:active {
	color:#ff0000;
}
a:visited  {
	color: #ff0000;        
}
a:focus {outline: none;}

/*clearfix*/
.cf:before,
.cf:after {
	content:"";
	display:table;
}
.cf:after,.clear{clear:both;}

#wrapper{
	position:relative;
	height:100%;
}

.tc {text-align:center !important;}
.tr {text-align:right !important;}
.tl {text-align:left !important;}

.mt8 {margin-top:8% !important;}
.mt5 {margin-top:5% !important;}
.mt3 {margin-top:3% !important;}
.mt1 {margin-top:1% !important;}
.mt0 {margin-top:0% !important;}
.mb8 {margin-bottom:8% !important;}
.mb5 {margin-bottom:5% !important;}
.mb3 {margin-bottom:3% !important;}
.mb1 {margin-bottom:1% !important;}
.mb0 {margin-bottom:0% !important;}
.pt8 {padding-top:8% !important;}
.pt5 {padding-top:5% !important;}
.pt3 {padding-top:3% !important;}
.pt1 {padding-top:1% !important;}
.pt0 {padding-top:0% !important;}
.pb8 {padding-bottom:8% !important;}
.pb5 {padding-bottom:5% !important;}
.pb3 {padding-bottom:3% !important;}
.pb1 {padding-bottom:1% !important;}
.pb0 {padding-bottom:0% !important;}

.sd {
	filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, .5));
	-webkit-filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, .5));
	}

* {
  margin: 0;
  padding: 0;
  border: 0;
}

/*hover*/


/*==================================
header
===================================*/

header {
	position:relative;
    width: 100%;
    background: url("../image/mainimg.jpg") no-repeat top center;
    background-size: 100% auto;
    padding-bottom: 50%;
	}

h1 {display: none;}

.menu_pc {
    width: 100%;
    max-width: 980px;
    position: fixed;
    z-index: 1000;
    top: 0px;
    left: 0px;
    pointer-events:none;
    }

    .menu_pc li {
        pointer-events: auto;
        width: 14.69%;
        max-width: 110px;
        margin-top: 1%;
        }

.menu_sp {display: none;}

.snsBtn {
	position:relative; z-index:4;
	width:100%;
	max-width:980px;
	min-width:320px;
	margin:0 auto;
    list-style: none;
	text-align:center;
	}

.snsBtn li {
	width: 6.32%;
    float: right;
    margin: 1%;
	}
	
	
.topanime { animation: show 1s both; }

.d0 { animation-delay: 0.3s; }

.d1 { animation-delay: 0.7s; }

.d2 { animation-delay: 1.4s; }

.d3 { animation-delay: 2.1s; }

.d4 { animation-delay: 2.8s; }

.d4 { animation-delay: 3.0s; }
@keyframes show {
 0% {
 opacity:0;
}
 100% {
 opacity:1;
}
}
	
	
/*==================================
common
===================================*/

#main {
	width:100%;
	max-width:980px;
	min-width:320px;
	margin:-6% auto 0 auto;
	}
	

.contents {
	position: relative;
	width:100%;
	height:100%;
	max-width:980px;
	min-width:320px;
    margin-bottom: 5%;
    padding-bottom: 6%;
    background: url(../image/con_bg_f.png) no-repeat bottom;
    background-size: 100% auto;
}

    .contents .end_hanko {
        position: absolute; z-index: 100;
        width: 28.36%;
        top: 4%;
        right:1%;
    }

    .contents .box {
        position:relative;
        width:100%;
        background:url(../image/con_bg.png) repeat-y center, #fff;
        background-size: 100% auto;
        text-align:center;
        }

        .contents .box p.txt {
            width: 87.95%;
            max-width: 862px;
            margin:0 auto;
            padding-bottom: 3%;
            text-align: center;
            }

        .contents .box p.con_img {
            width: 77.95%;
            max-width: 764px;
            margin:0 auto;
            padding-bottom: 3%;
            text-align: center;
            }

.contents .box .btn img {
    width: 57.24%;
    max-width: 561px;
    margin: 0 auto;
}

@media screen and (max-width:980px) {
    
#main {
	margin:-8% auto 0 auto;
	}
    
.menu_pc li {
    pointer-events: auto;
    width: 12.69%;
    max-width: 110px;
    margin-top: 1%;
    }

.contents {
    width:86.77%;
    max-width:870px;
    float:right;
    margin-bottom: 3%;
    padding-bottom: 6%;
    }
}


@media screen and (max-width:768px) {
    
header {
    padding-bottom: 0%;
    background-size: 140% auto;
	}
    
.menu_pc {display: none;}
    
.menu_sp  {
    display: table;
    padding-top: 71%;
    text-align: center;
    }
    
    .menu_sp li{
        display: table-cell;
        width: 50%;
        text-align: center;
    }
    
    .menu_sp li img{
        width: 97.95%;
        max-width: 480px;
    }
    
.snsBtn {
	position:relative; z-index:4;
	width:100%;
	max-width:980px;
	min-width:320px;
	margin:3% auto;
    
	text-align:center;
	}
    
.snsBtn li {
	width: 10.32%;
    margin: 1%;
    float: none;
    display: inline-block;
	}
	
.snsBtn li:last-child {
	margin-right:0;
	}
    
    
/*==================================
common
===================================*/

#main {
	width:100%;
	max-width:980px;
	min-width:320px;
	margin:0 auto;
	}
    
.contents {
    width:100%;
    float:none;
    }
    
.contents .box .btn img {
    width: 87.24%;
}
    
.contents .box p.txt {
    width: 95%;
    }    
   
}



/******* cont02 *******/		

	
.watching_link {
    width: 95%;
    display: table;
    table-layout: fixed;
    margin: 0 auto;
}

    .watching_link li {
        display: table-cell;
        width: 29.18%;
    }

    .watching_link li img {
        max-width: 100%;
        height: auto;
    }

	
/**** ハッシュタグ ****/

@media screen and (max-width:640px) {
.twhasBox {
	width:95%;
	margin:0 auto;
	}}
	
	
#twitter-widget-0 {
	border-radius: 5px !important;
	border:3px solid #ff5d00 !important;
	}

.timeline-Footer {
	    padding: 10px !important;
		}


	
/*** TWキャンペーン ***/


.wrap-slider {
	width: 100%;
	min-width: 320px;
	height:auto !important;
}



.sliderNav {
	display:table;
    table-layout: fixed;
	width: 100% !important;
	max-width:980px !important;
	min-width: 320px !important;
	margin:0 auto 3% auto;
}


.sliderNav li {
	display:table-cell;
	width:16%;
	margin:0;
	padding:0;
	}

.sliderNav li img {
        max-width: 100%;
        height: auto;
    }

.sliderNav li a {
    display: block;
    padding: 4%;
}

.sliderNav li a.active {
    background: url(../image/twcp_active.png) no-repeat;
    background-size: 100% auto;
}

.sliderNav li .end_hk {
    position: absolute;
    width: 15%;
}

.sliderNav li a.active .end_hk {
    width: 95%;
}
	
.bxslider {
  display: none !important;
  overflow:hidden !important;
}
	
.bxslider li {
  display: none !important;
  overflow:hidden !important;
}
.bx-viewport .bxslider li {
  display: block !important;
}
	
.slider {
	display:table !important;
	height:100%;
	max-width:980px;
	min-width:320px;
	margin:0 auto !important;
	text-align:center !important;
	}

	
.twitter-tweet {
	margin:0 auto !important;
	}
	
.twtr-timeline { height:auto!important; }
	
.slider li {
	position:relative !important;
	float: none;
	}
	
	.slider li p.txt {
		margin:10px auto;
		font-size:2.8rem;
		color:#00246b;
		}
		
	.slider li .item_btn {
		width:65.2%;
		margin:0 auto;
		}	
	
	
	
#twitter-widget-1, #twitter-widget-2 {
	margin:0 auto !important;
	}	
.EmbeddedTweet {
	margin:0 auto !important;
	}
	
.SandboxRoot {
	text-align:center !important;
	margin:0 auto !important;
	}

.retweetBox {
    width:75%;
    max-width: 772px;
	display: table !important;
    table-layout: fixed;
	margin:0 auto !important;
	}

.retweetBox img {
    max-width: 100%;
    height: auto;
}

.retweetBox p {
    position: relative;    
}

.retweetBox .end_hk {
    width:22.39%;
    position: absolute;
    right:5%;
    padding-top:2%;
}

@media screen and (max-width:640px) {
	
	#twitter-widget-1, #twitter-widget-2 {
		width:350px !important;
		margin:0 auto !important;
		}	
	
	.twitter-tweet {
		width:350px !important;
		margin:0 auto !important;
		}
		

twitterwidget, iframe[id^="twitter-widget-"] {
  margin-left: auto;
  margin-right: auto;
}
	}
	
@media screen and (max-width:450px) {
	
		#twitter-widget-1, #twitter-widget-2 {
		width:256px !important;
		margin:0 auto !important;
		}	
	
	.twitter-tweet {
		width:256px !important;
		margin:0 auto !important;
		}
	
	}
			
		

	.caution {
		width:95%;
		margin:0 auto ;
        padding-bottom: 5%;
		color:#00246b;
		word-break: break-all;
		}
		
		.caution h5 {
			font-size: 3.5rem;
    		font-weight: bold;
			
			}

        .caution ul {
            list-style: none;
        }
		
            .caution li {
                font-size:2.8rem;
                padding-left: 1em;
                text-indent: -1em;
                word-break: break-all;
                }


/*==================================
banner
===================================*/

.siteBtn {
	display:block;
	width:57.24%;
	margin:5% auto;
	}
	
@media screen and (max-width:640px) {
	.siteBtn {
	display:block;
	width:87.24%;
	margin:5% auto;
	}
	}


.banner {
	width:100%;
	max-width:970px;
	min-width:310px;
	margin:0 auto;
	text-align:center;
	}
	
.banner li {
	display:inline-block;
	margin-right:1%;
	margin-bottom:1%;
	
	}
			

#top_scroll_btn {
	position: fixed;
	z-index: 9999;
	width: 15.93%;
	height: auto;
	bottom: 10px;
	right: 10px;
}


/*==================================
appDl
===================================*/

.appDl {
	width:100%;
	padding:3% 0;
	background:#0d1049;
	color:#FFFFFF;
	font-size: 2rem;
	}
	
.appDl .box {
	width:100%;
	max-width:980px;
	min-width:320px;
	margin:0 auto;
	}

.appDl .box h3 {
	width:79.68%;
	margin:0 auto;
	}
	
.appDl .dl {
	text-align:center;
	}
	
.appDl .dl li {
	display:inline-block;
	width: 24.37%;
	background:url(../image/appDL-bg.png) no-repeat center top;
	background-size: 79%;
	}
	
@media screen and (max-width:640px) {
	.appDl .dl li {
	width:39.37%;
	}
	
	}
	
.appDl .dl li a img {
	width:90%;
	margin:3% 0 25% 0;
	}
	
.appDl .box .txt {
	width:50.31%;
	margin:0 auto;
	}
	
.appDl .box p {
	margin:0 auto;
	font-size:3.0rem;
	}
	

#top_scroll_btn img { opacity: 0.8; }

#top_scroll_btn img:hover { opacity: 1; }

/*==================================
footer
===================================*/

footer {
	position:relative;
	width: 100%;
	background: #ffffff;
	font-size: 3.0rem;
	color:#111111;
}

@media screen and (max-width:960px) {
	
	footer {
	min-width: 320px !important;

}
	}
	
@media screen and (max-width:640px) {
	
	footer {
	font-size: 3.0rem;

}
	}

.footer {
	width:90%;
	max-width:970px;
	min-width:310px;
	margin:0 auto;
	padding-bottom:5%
	}
	
@media screen and (max-width:640px) {
.footer {
	padding-bottom:18%
	}	
	}
	
#footerContents,#footer_text {
	padding: 10px;
    list-style: none;
}
#footer_text {
	padding-top: 0;
}
#footerContents li{
	float:left;
	margin-right:10px;
}
#footerContents li p {
		margin-top: 13px;
}


.sega-logo {
	display: inline-block;
    width: 104px;
    height: 36px;
    padding-top: 38px;
}

.sega-logo.sp {
	display: inline-block;
    width: 104px;
	padding-top: 0;
}

@media all and (-ms-high-contrast:none) {
.cero {
	display: inline-block;
    width: 60px;
    height: 74px;
}}

.copyFooter {
	display: table-cell;
	vertical-align:bottom;
	height:74px;
	line-height: 100px;
	}
	
.copyFooter.sp {
	display: table-cell;
	vertical-align:bottom;
	height:auto;
	line-height: 24px;
	}


#footer_text a {
	display:inline-block;
	margin-right:10px;
}