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

/*
================================================================================================================
 表示・非表示
================================================================================================================
*/
.p980 {display:none;}
.p720 {display:none;}
.p640 {display:block;}




/*
================================================================================================================
 box_01
================================================================================================================
*/
.box_01 {
	position: relative;
	margin: 0 auto;
	background:url(../img/top/640/box01_bg01.jpg) top center no-repeat;
 	padding-bottom: calc(1100/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
	background-color:#FFF;
}
.box_01:after {
    content: "";
    position: absolute;
    bottom: -90px;
    width: 100%;
    height: 200px;
    transform: skew(0deg, -10deg);
    background-color: #000;
}
.box_01 .btn_all {
	width: 70%;
    float: right;
    margin-top: 88%;
}
.box_01 .btn_all .btn01 a, .box_01 .btn_all .btn02 a, .box_01 .btn_all .btn03 a, .box_01 .btn_all .btn04 a {
  	font-family:"游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HiraMinProN-W6", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	display: block;
	position: relative;
	width:100%;
	padding:0% 0px;
	text-align: left;
	text-decoration: none;
	font-weight:bold;
	-webkit-transition: background .2s linear;
	transition: background .2s linear;
	margin: 0px auto;
	box-shadow:0px 0px 4px 1px rgba(0,0,0,0.4);
}
/* IE8〜11はMS明朝 */
@media screen\0 {
.box_01 .btn_all .btn01 a, .box_01 .btn_all .btn02 a, .box_01 .btn_all .btn03 a, .box_01 .btn_all .btn04 a {
    font-family: 'MS Mincho', sans-serif;
  }
}
.box_01 .btn_all .btn01.store,
.box_01 .btn_all .btn02.linkage{
    width: 100%;
    padding: 3% 0;
    margin: 0px auto;
    text-align: center;
    background-color: rgba(0,0,0,0.8);
    box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.4);
    margin-bottom: 5px;
}
.box_01 .btn_all .btn02.linkage{
    background-color: rgba(255,255,255,0.8);
}
.box_01 .btn_all .btn01.store a,
.box_01 .btn_all .btn02.linkage a
 {
    width: 45%;
    display: inline-block;
    box-shadow: none;
    margin-bottom: 0;
}
.box_01 .btn_all .btn02.linkage a
 {
    width: 90%;
}

.box_01 .btn_all .btn01.store, .box_01 .btn_all .btn02.linkage.livequiz {
    padding: 1% 0;
}
.box_01 .btn_all .btn02.linkage.livequiz a {
    width: 98%;
}


.box_01 .btn_all .btn01.store a.appstore {
	width: 37%;
    display: inline-block;
    margin-right: 8px;
}
.box_01 .btn_all .btn01.store a.appstore img,
.box_01 .btn_all .btn01.store a.googleplay img,
.box_01 .btn_all .btn02.linkage a.linkage img
 {
	opacity: 1;
	width:100%;
	height: auto;
    vertical-align: middle;
}

/*.box_01 .btn_all .btn01 a:hover {
	background-image:url(../img/top/980/box01_btn01hover.png);
	background-size: 80% auto;
    background-position: 85% 50%;
	background-repeat:no-repeat;
	background-color: rgba(0, 143, 234, 0.8);
}*/
/*.box_01 .btn_all .btn02 a {
    top: 0px;
    right: 0;
    background-image: url(../img/top/980/google-play-badge.png);
    background-size: 93% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.8);
    margin-bottom: 5px;
}*/
.box_01 .btn_all .btn03 a {
    top: 0px;
    right: 0;
    background-image: url(../img/top/980/box01_btn03.png);
    background-size: 93% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: rgba(48, 185, 20, 0.8);
    margin-bottom: 5px;
}
.box_01 .btn_all .btn04 a {
    top: 0px;
    right: 0;
    background-image: url(../img/top/980/box01_btn04.png);
    background-size: 93% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
	background-color: rgba(0, 143, 234, 0.8);
}
.box_01 .btn_all .btn01 a img, .box_01 .btn_all .btn02 a img, .box_01 .btn_all .btn03 a img, .box_01 .btn_all .btn04 a img{
    height: 40px;
	opacity:0;
}

/*
================================================================================================================
 box_01とbox_02の境にレイアウトする画像
================================================================================================================
*/

.adjust_01 {
    width: 100%;
    padding-top: 26%;
    background-color: #141e28;
    margin-top: -16%;
    transform: skew(0deg, -10deg);
}
section.sec-recently{
    overflow: hidden;
    background-color:#000;
    background-image: url(../img/top/980/recently-info-all-bg.jpg) ;
    background-position: 50% 50%;
    background-repeat:no-repeat;
    background-size:105%;
}

section.sec-recently h3{
    text-align: center;
}
section.sec-recently h3 img{
    width: 45%;
    margin-top: 15%;
}

.recently-info-all{
    position: relative;
    width:90%;
    margin: 0 auto;
    text-align: center;
}
section.sec-recently .recently-info-all iframe{
    width:100%;
    height:500px;
    border: 1px solid #5c5723;
    border-radius: 5px;
}

.inner-twt-timeline iframe{
    width: 650px !important;
}

.box-twt-timeline{
    margin: 37px auto;
    width: 90%;
    height: 380px;
    background-color: rgba(30, 50, 72, 0.47);
    overflow: hidden;
 }
 .box-twt-timeline a{
    text-decoration: none;
 }
 .box-twt-timeline h3{
    background-color: #0c86f8;
    color: #fff;
    padding: 7px;
    box-sizing: border-box;
    line-height: 1.2;
    font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
    font-size: 12px;
    border: 1px solid #8e6e00;
    border-radius: 3px;
 }

.img_metis {
    width: 49%;
    margin-top: -48%;
    left: 3%;
    position: absolute;
    background: url(../img/top/980/metis.png) top center no-repeat;
    padding-bottom: calc(460/680*100%);
    background-size: 100% auto;
    z-index: 10;
}
.img_box_02_copy01 {
    width: 38%;
    margin-top: -29%;
    left: 56%;
    position: absolute;
    background: url(../img/top/640/box02_copy01.png) top center no-repeat;
    padding-bottom: calc(284/688*100%);
    background-size: 100% auto;
    transform: skew(0deg, 0deg);
    z-index: 10;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.bnr-superbroadcast{
    width: 80%;
    background-color: #000;
    background-image: url(../img/top/980/bnr-superbraodcast-sp.png);
    background-repeat: no-repeat;
    background-size: 97%;
    background-position: 50% 0;
    padding: 16% 0;
    margin: 0 auto 9%;
    border-radius: 11px;
    border: 1px solid #515151;
}


/*
================================================================================================================
 box_02
================================================================================================================
*/
.box_02 {
	width:100%;
	left:0%;
	position: relative;
	margin: -9% auto 9% auto;
 	padding-bottom: calc(540/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#000000;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_02.pv2 {
	width: 100%;
    left: 0%;
    position: relative;
    margin: -9% auto 0% auto;
    padding-bottom: 15%;
    transform: skew(0deg, 0deg);
    background-image: url(../img/top/980/box_02-recently-pv2-bg.jpg);
    background-size: 111% auto;
    background-position: center 100%;
    background-repeat: no-repeat;
    overflow: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01 .img01 {
    position: absolute;
    top: 20%;
    left: 5%;
    width: 48%;
}

.box_02.pv1 {
	width:100%;
	left:0%;
	position: relative;
	margin: -9% auto 9% auto;
    padding-bottom: calc(220/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#000000;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01,
.box_02.recently-info-02  {
    width: 100%;
    left: 0%;
    position: relative;
    margin: -9% auto -9% auto;
    padding-bottom: 45%;
    transform: skew(0deg, 0deg);
    background-image: url(../img/top/980/box_02-recently-info-bg.jpg);
    background-size: 100% auto;
    background-position: 0% 106%;
    background-repeat: no-repeat;
}

.box_02.recently-info-02  {
	padding-bottom: calc(515/980*100%);
    transform: skew(0deg, 0deg);
    background-image: url(../img/top/980/box_02-recently-info-2-bg.jpg);
    background-size: 153% auto;
    background-position: center 0%;
    background-repeat: no-repeat;
}
.box_02.recently-info-01 .content01:before {
    content: "";
    position: absolute;
    width: 100%;
    padding-bottom: calc(1630/980*100%);
    top: -81%;
    margin: 0 0 0;
    background-color: #000;
    transform: skew(0deg, 15deg);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01 .content01,
.box_02.recently-info-02 .content01 {
    position: absolute;
    width: 100%;
    background: none;
    padding-bottom: calc(1700/980*100%);
    background-color: none;
    margin: -9% auto 9% auto;
    transform: skew(0deg, 0deg);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01 .content02{
    position: absolute;
    width: 100%;
    padding-bottom: calc(1630/980*100%);
    background: none;
    margin: -9% auto 9% auto;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01 .content03 {
    padding-bottom: calc(1630/6814*100%);
    width: 100%;
    margin: -107px 0 0;
    background-color: none;
    margin: -9% auto 3% auto;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02.recently-info-01 .img01 {
	position: absolute;
    top: 12%;
    left: 5%;
    width: 44%;
}
.box_02.recently-info-01 .img02 {
    position: absolute;
    top: 8%;
    left: 40%;
    width: 58%;
}
.box_02.recently-info-01 .img03 {
    position: absolute;
    top: 184%;
    left: 5%;
    width: 35%;
    opacity: 1;
}
.box_02.recently-info-02 .img01 {
    position: absolute;
    top: 11%;
    left: 1%;
    width: 48%;
}
.box_02.recently-info-02 .img02 {
    position: absolute;
    top: 4%;
    left: 49%;
    width: 50%;
}
.box_02.recently-info-02 .img03 {
    position: absolute;
    top: 23%;
    left: 49%;
    width: 51%;
    opacity: 1;
}
.box_02 .content01 {
	position: absolute;
    width: 100%;
    height: auto;
    background: url(../img/top/640/box02_bg01.jpg) top center no-repeat;
    padding-bottom: calc(800/640*100%);
    background-size: 100% auto;
    background-color: #000000;
    background-position: 0px -53%;
    transform: skew(0deg, 10deg);
    margin: -9% auto 9% auto;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
}
.box_02_01 {
	width:54%;
	float:right;
	margin-top:2%;
	background:url(../img/top/980/box02_copy01.png) top center no-repeat;
 padding-bottom: calc(170/540*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
}
.box_02_02 {
    width: 40%;
    margin: 15% auto 0 auto;
    background: url(../img/top/980/box02_btn01.png) top center no-repeat;
    padding-bottom: calc(11/310*100%);
    background-size: 100% auto;
}
.box_02.pv2 .box_02_02 {
    width: 47%;
    margin: 15% auto 0 auto;
    background: url(../img/top/980/box02_btn02.png) top center no-repeat;
    padding-bottom: 5%;
    background-size: 100% auto;
}
.box_02_02.soon {
	width:50%;
	margin:50% auto 0 auto;
	background:url(../img/top/980/box02_btn01_soon.png) top center no-repeat;
 padding-bottom: calc(168/310*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
}
.box_02_02 a {
	width:100%;
}
.box_02_02 a img {
	width:100%;
	z-index:20;
	opacity: 0.0;
	filter: alpha(opacity=0);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.box_02_02 a img:hover {
/*	opacity: 1.0;
	filter: alpha(opacity=1);*/
}

/*movie-0906*/
.box_02 .qma-mv-non{
    position: absolute;
    top: 186%;
    left: 22px;
    width: 34vw;
}
.box_02 .qma-mv-non img{
    width: 100%;   
}

/*
================================================================================================================
 box_03
================================================================================================================
*/
.box_03 {
	width:100%;
	left:0%;
	position: relative;
	margin: -9% auto 9% auto;
 padding-bottom: calc(770/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#FFFFFF;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_03 .content01 {
	position: absolute;
	width:100%;
	height:auto;
	background:url(../img/top/640/box03_bg01.png) top center no-repeat;
 padding-bottom: calc(1000/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
	background-color:#000000;
	transform:skew(0deg, 10deg);
	margin: -9% auto 9% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_03 .content01 img {
	position: absolute;
	width:80%;
	height:auto;
	bottom:20%;
	margin:0 10% 0 10%;
}
.box_03 .content02 {
	position: absolute;
	width:100%;
	height:auto;
	bottom:0px;
	background:url(../img/top/980/box03_text01.png) top center no-repeat;
	padding-bottom: calc(148/720*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 98% auto;
	background-color:rgba(240,0,00,0.9);
	/*transform:skew(0deg, 10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;*/
    margin: -9% auto 0% auto;
}

.box_03 .content02 .text01 img {
	position: relative;
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	line-height:0;
}
.box_03 .content02 .text01, .box_03 .content02 .text02 {
  font-family:"游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HiraMinProN-W6", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	width:100%;
	color:#FFFFFF;
	height:auto;
	text-align:center;
	font-weight:bold;
	text-shadow:#900 1px 1px 1px;
}
/* IE8〜11はMS明朝 */
@media screen\0 {
.box_03 .content02 .text01, .box_03 .content02 .text02 {
    font-family: 'MS Mincho', sans-serif;
  }
}
.box_03 .content02 .text01 {
	padding:20px 0 10px 0;
}
.box_03 .content02 .text02 {
	padding:0 0 20px 0;
}

/*
================================================================================================================
 box_04
================================================================================================================
*/
.box_04 {
	width:100%;
	left:0%;
	position: relative;
	margin: -9% auto 9% auto;
 padding-bottom: calc(530/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#000000;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_04 .content01 {
	position: absolute;
	width:100%;
	height:auto;
	background-color:#000000;
	transform:skew(0deg, 10deg);
	margin: -9% auto 9% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_04 .content01 img {
	position: relative;
	width:auto;
	height:auto;
	float:left;
	padding:0;
	margin:0;
	line-height:0;
}
.box_04 .content01 .img01 {
	width:34%;
}
.box_04 .content01 .img02 {
	width:66%;
}


/*
================================================================================================================
 box_05
================================================================================================================
*/
.box_05 {
	width:100%;
	left:0%;
	position: relative;
	margin: -27% auto 9% auto;
 padding-bottom: calc(1600/640*100%);
 /*padding-bottom: calc(1680/640*100%);/*Twitterバナー公開時に表示*/
	background-color:#E10000;
	transform:skew(0deg, 10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content01 img {
	position: absolute;
	width:100%;
	height:auto;
	transform:skew(0deg, -10deg);
	margin: -9% auto 9% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content02 img {
	position: absolute;
	width:32%;
	margin-top:140%;
	right:-3%;
	height:auto;
	transform:skew(0deg, -10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content03 img {
	position: absolute;
	width:66%;
	margin-top:184%;
	left:-6%;
	height:auto;
	transform:skew(0deg, -10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content04 a {
	position: absolute;
	width:100%;
	height: auto;
	padding:1% 0 1% 0;
	color:#000000;
	background-color:rgba(53,184,254,1.0);
	transform:skew(0deg, -19.4deg);
	margin: 230% auto 0% auto;
	-webkit-transition: background .2s linear;
	transition: background .2s linear;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content04 a:hover {
	color:#000000;
	background-color:rgba(100,220,255,1.0);
}
.box_05 .content04 #twitterQ { opacity:0;}
.box_05 .content04 .twitter_01 {
	position: relative;
	width:100%;
	transform:skew(10deg, 0deg);
	margin: 0% auto 0% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_05 .content04 .twitter_01 img {
	width:100%;
}
.box_05 .content04 .yaji_01 img {
	position: absolute;
	width:12%;
	margin-top:200%;
	left:83%;
	height:auto;
	transform:skew(0deg, -10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}

/*
================================================================================================================
 box_06
================================================================================================================
*/
.box_06 {
	width:100%;
	left:0%;
	position: relative;
	margin: -27% auto 9% auto;
 padding-bottom: calc(540/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#000000;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_06 .content01 {
	position: absolute;
	width:100%;
	height:auto;
	background:url(../img/top/640/box06_bg01.jpg) top center no-repeat;
 padding-bottom: calc(730/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
	background-color:#000000;
	transform:skew(0deg, 10deg);
	margin: -10% auto 0% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_06 .content02 {
	position: absolute;
	width:100%;
	height:auto;
	top:0px;
	color:#FFFFFF;
	background-color:rgba(00,00,00,0.9);
	/*transform:skew(0deg, 10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;*/
    margin: 1% auto 0% auto;
}
.box_06 .content02 img{
	position: relative;
	width:80%;
	height:auto;
	transform:skew(10deg,0deg);
	margin: 0 10% 0 10%;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_06 .content03 {
	position: absolute;
	width:100%;
	height:auto;
	bottom:-1%;
	color:#000000;
	background-color:rgba(255,255,255,0.9);
	/*transform:skew(0deg, 10deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;*/
    margin: 0% auto 0% auto;
}
.box_06 .content03 img{
	position: relative;
	width:90%;
	height:auto;
	transform:skew(10deg,0deg);
	margin: 0 5% 0 5%;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_06 .content03 span {
	margin:0% auto;
	transform:skew(10deg, 0deg);
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_06 .content02 .text01, .box_06 .content02 .text02, .box_06 .content03 .text01, .box_06 .content03 .text02 {
  font-family:"游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W6", "Hiragino Mincho Pro", "HiraMinProN-W6", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	width:100%;
	height:auto;
	text-align:center;
	font-weight:bold;
	transform:skew(10deg, 0deg);
	text-shadow:#999 1px 1px 1px;
	vertical-align: middle;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
/* IE8〜11はMS明朝 */
@media screen\0 {
.box_06 .content02 .text01, .box_06 .content02 .text02, .box_06 .content03 .text01, .box_06 .content03 .text02 {
    font-family: 'MS Mincho', sans-serif;
  }
}
.box_06 .content02 .text01, .box_06 .content03 .text01 {
	padding:1% 0 1% 0;
}
.box_06 .content02 .text02, .box_06 .content03 .text02 {
	padding:0 0 -1% 0;
}

/*
================================================================================================================
 box_07
================================================================================================================
*/
.box_07 {
	width:100%;
	left:0%;
	position: relative;
	margin: -9% auto 9% auto;
 padding-bottom: calc(640/640*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-color:#000000;
	transform:skew(0deg, -10deg);
	overflow:hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}
.box_07 .content01 {
	position: absolute;
	width:100%;
	height:auto;
	background:url(../img/top/720/box07_bg01.jpg) top center no-repeat;
 padding-bottom: calc(720/720*100%);/* calc(100*ImageHeight/ImageWidth)% */
	background-size: 100% auto;
	background-color:#000000;
	transform:skew(0deg, 10deg);
	margin: -10% auto 0% auto;
	backface-visibility:hidden;
	-webkit-backface-visibility: hidden;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
}

/*
================================================================================================================
 box_08
================================================================================================================
*/
.box_08 {
	width:100%;
	height:100%;
	left:0%;
	position: relative;
	margin: -18% auto 0 auto;
	padding:0 0 4% 0;
	background: #c10000; /* Old browsers */
	background: -moz-linear-gradient(top, #c10000 0%, #860b1a 4%, #000000 20%, #000000 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #c10000 0%, #860b1a 4%, #000000 20%, #000000 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #c10000 0%, #860b1a 4%, #000000 20%, #000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c10000', endColorstr='#000000', GradientType=0 ); /* IE6-9 */
	overflow:hidden;
}
.box_08.beta {
	margin: 5px auto 0 auto;
	background: #000;
}
.box_08 .content01 {
	position: relative;
	width:100%;
	max-width:660px;
	height:100%;
	background-color: transparent;
	margin: 1% auto 1% auto;
}
.box_08 .content02 {
	position: relative;
	width:92%;
	max-width:610px;
	height:100%;
	background-color: transparent;
	margin: 0% auto 0% auto;
}
.box_08 .box_08_img01 img {
	position: relative;
	width:100%;
	max-width:660px;
	height:100%;
	background-color: transparent;
	margin: 0% auto 0% auto;
}
.box_08 .box_08_img02 img, .box_08 .box_08_img03 img {
	position:relative;
	width: 100%;
	margin: 0% auto 0% auto;
}
.box_08 .box_08_img02 {
	margin:0 0 -2% 0;
	padding:0;
	line-height:0;
}
.box_08 .box_08_img02 img {
	margin:0;
	padding:0;
	line-height:0;
	z-index:30;
}
.box_08 .box_08_img03 {
	border-bottom:#FFFFFF solid 1px;
	margin:0;
	padding:0;
	line-height:0;
}
.box_08 .box_08_img03 img {
	margin:0;
	padding:0;
	line-height:0;
	z-index:20;
}
.box_08 .content01 .btn_all {
	position:relative;
	width: 92%;
	margin: -10% auto 4% auto;
	-webkit-transition: background .2s linear;
	transition: background .2s linear;
	padding:1% 10px;
}

.box_08 .content01 .btn_all .btn01{
    width: 100%;
    padding: 0 0px;
    background-image: url(../img/top/980/box01_btn01.png);
    background-size: 76% auto;
    background-position: 12% 50%;
    background-repeat: no-repeat;
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-transition: background .2s linear;
    transition: background .2s linear;
    margin-bottom: 5px;
}
.box_08 .content01 .btn_all .btn02{
    width: 100%;
    padding: 0 0px;
    background-image: url(../img/top/980/box01_btn02.png);
    background-size: 76% auto;
    background-position: 12% 50%;
    background-repeat: no-repeat;
    background-color: rgba(40, 40, 40, 1);
    -webkit-transition: background .2s linear;
    transition: background .2s linear;
    margin-bottom: 5px;
}
.box_08 .content01 .btn_all .btn03{
    width: 100%;
    padding: 0 0px;
    background-image: url(../img/top/980/box01_btn03.png);
    background-size: 76% auto;
    background-position: 12% 50%;
    background-repeat: no-repeat;
    background-color: rgba(48, 185, 20, 0.8);
    -webkit-transition: background .2s linear;
    transition: background .2s linear;
    margin-bottom: 5px;
}
.box_08 .content01 .btn_all .btn04{
    width: 100%;
    padding: 0 0px;
    background-image: url(../img/top/980/box01_btn04.png);
    background-size: 76% auto;
    background-position: 12% 50%;
    background-repeat: no-repeat;
    background-color: rgba(53,184,254,1);
    -webkit-transition: background .2s linear;
    transition: background .2s linear;
}
/*.box_08 .content01 .btn_all .btn01 a:hover {
	background-image:url(../img/top/980/box08_btn01hover.png);
	background-size: 100% auto;
	background-position:center left;
	background-repeat:no-repeat;
	background-color: rgba(0, 143, 234, 0.8);
}*/
.box_08.beta .content01 .btn_all .btn01 a {
	background-image:url(../img/top/980/box08_btn01_beta.png);
}
.box_08.beta .content01 .btn_all .btn01 a:hover {
	background-image:url(../img/top/980/box08_btn01_beta_hover.png);
}
.box_08 .content01 .btn_all .btn01 a img, .box_08 .content01 .btn_all .btn02 a img, .box_08 .content01 .btn_all .btn03 a img, .box_08 .content01 .btn_all .btn04 a img{
	position:relative;
	opacity:0;
}

/*
================================================================================================================
 box_09
================================================================================================================
*/
.box_09 {
	width:100%;
	left:0%;
	position: relative;
	margin: 0% auto;
	background-color:#E10000;
}
.box_09 .content01 {
	position: relative;
	width:100%;
	padding:1% 0 0 0;
	bottom:0%;
	color:#000000;
	background-color:rgba(53,184,254,1.0);
	margin: 0% auto 0% auto;
	-webkit-transition: background .2s linear;
	transition: background .2s linear;
}
.box_09 .content01:hover {
	bottom:0%;
	color:#000000;
	background-color:rgba(100,220,255,1.0);
}
.box_09 .content01 .twitter_01 {
	position: relative;
	width:96%;
	max-width:620px;
	margin: 0% auto 0% auto;
}
.box_09 .content01 .twitter_01 img {
	width:100%;
}
.contents-compatible-models{
	color: #fff;
	line-height: 1.3;
	width:90%;
	margin:53px auto 70px;
}
.contents-compatible-models h4{
	border-top: 1px solid #505050;
	border-bottom: 1px solid #505050;
	padding: 3px 0;
    font-size: 12px;
}
.contents-compatible-models dl{
	margin-top:20px;
}
.contents-compatible-models dl dt,
.contents-compatible-models dl dd
{
    font-size: 10px;
}
.contents-compatible-models span{
	margin-top:20px;
	display: block;
	font-size: 10px;
}