@charset "utf-8";
/* CSS Document */



/*---------------------------
	MainVisual
 ----------------------------*/
/*mainVisual*/
.mainVisual{
	width:100%;
	height:490px;
	background:#2a2a2a;
}
/*.ja .mainVisualInner{
    width: 100%;
    height: 100%;
	background:url(../img/top/bg_main.jpg?ver=1) no-repeat  50% 50%;
	margin:0 auto;
}*/
.mainVisualInner{
    width: 100%;
    height: 100%;
	background:url(../img/top/bg_main_151023.jpg?ver=1) no-repeat  50% 50%;
	margin:0 auto;
}

.first .mainVisualInner{
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2) inset;
	-webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2) inset;
	-moz-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2) inset;
	-ms-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2) inset;
}
.mainVisualBox{
	position:relative;
	width:1006px;
	height:490px;
	margin:0 auto;
}

@media screen and (max-width: 768px) {
.mainVisual{
/*	position: static;*/
/*	margin: 50px 0 0;*/
/*background: none;*/
height: auto;
}
.ko .mainVisualInner{
	background:url(../img/top/bg_main_sp_ko.jpg) no-repeat 0 0;
	background-size: contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-ms-background-size: contain;
	margin: 0 auto;
	width: 100%;
	height: 0;
	padding-top:81.2%;
/*	padding-top:93.7%;*/
}
.cn_trd .mainVisualInner{
	background:url(../img/top/bg_main_sp_ch.jpg) no-repeat 0 0;
	background-size: contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-ms-background-size: contain;
	margin: 0 auto;
	width: 100%;
	height: 0;
	padding-top:81.2%;
/*	padding-top:93.7%;*/
}
.mainVisualInner{
	background:url(../img/top/bg_main_sp_en.jpg?ver=1) no-repeat 0 0;
	background-size: contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-ms-background-size: contain;
	margin: 0 auto;
	width: 100%;
	height: 0;
	padding-top:81.2%;
/*	padding-top:93.7%;*/
}
.ja .mainVisualInner{
	background:url(../img/top/bg_main_sp.jpg?ver=1) no-repeat 0 0;
	background-size: contain;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-ms-background-size: contain;
	margin: 0 auto;
	width: 100%;
	height: 0;
	padding-top:81.2%;
/*	padding-top:93.7%;*/
}
.mainVisualBox{
	display: none;
}
.bigLogo{
	display: none;
}
}

/* 個別要素*/
.ja .mainCopy{
	position:absolute;
	left:295px;
	top:135px;
	width: 370px;
	height: 30px;
	background:url(../img/top/img_maincopy.png) no-repeat;
	font-weight:bold;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.mainCopy{
	position:absolute;
	left:295px;
	top:135px;
	width: 370px;
	height: 30px;
	background:url(../img/top/img_maincopy_en.png?ver=1) no-repeat;
	font-weight:bold;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.cn_trd .mainCopy{
	position:absolute;
	left:295px;
	top:135px;
	width: 370px;
	height: 30px;
	background:url(../img/top/img_maincopy_cn_trd.png) no-repeat;
	font-weight:bold;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.ko .mainCopy{
	position:absolute;
	left:295px;
	top:135px;
	width: 370px;
	height: 30px;
	background:url(../img/top/img_maincopy_ko.png) no-repeat;
	font-weight:bold;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.ja .bigLogo{
	position:absolute;
	left:200px;
	top:20px;
	width:560px;
	height:100px;
	background:url(../img/top/logo_big_200s.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.bigLogo{
	position:absolute;
	left:200px;
	top:20px;
	width:560px;
	height:100px;
	background:url(../img/top/logo_big_200s_en.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.cn_trd .bigLogo{
	position:absolute;
	left:200px;
	top:20px;
	width:560px;
	height:100px;
	background:url(../img/top/logo_big_200s_cn_trd.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.ko .bigLogo{
	position:absolute;
	left:200px;
	top:20px;
	width:560px;
	height:100px;
	background:url(../img/top/logo_big_200s_ko.png) no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.product200s{
	position:absolute;
	left:0;
	top:120px;
	background:url(../img/top/img_200s.png) no-repeat;
	width:308px;
	height:288px;
	text-indent:100%;/*text消す*/
	white-space: nowrap;/*text消す*/
	overflow: hidden;/*text消す*/
}
.productApp{
	position:absolute;
	left:485px;
	top:330px;
	background:url(../img/top/img_smartphone.png?ver=150825_3) no-repeat;
	width:287px;
	height:158px;
	text-indent:100%;/*text消す*/
	white-space: nowrap;/*text消す*/
	overflow: hidden;/*text消す*/
}

.buyAppBox{
	position:absolute;
	left:600px;
	top:340px;
	width:310px;
}
/*
.appImg,
.googleImg{
	width:150px;
	float:left;
}
.appImg{
	margin:0 10px 10px 0;
}*/
@media screen and (max-width: 768px) {
.mainCopy{
	position:static;
	text-align: center;
	color:#fff;
	font-size:18px;
	font-weight:bold;
	margin: 0 auto ;
	padding: 30px 0 0;
}
.bigLogo{
	position:static;
	margin: 0 auto 20px;
	width:300px;
	height:38px;
	background:url(../img/top/logo_big_200s.png) no-repeat;
	background-size:300px 42px;
	-moz-background-size:300px 42px;
	-webkit-background-size:300px 42px;
	-ms-background-size:300px 42px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.product200s{
	position: static;
	height: auto;
	width: auto;
	min-height: 203px;
	background:url(../img/top/img_product_sp.png) no-repeat top center;
	background-size: 280px 203px;
 	-webkit-background-size: 280px 203px;
 	-moz-background-size: 280px 203px;
 	-ms-background-size: 280px 203px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.productApp,
.appScreenBox{
	display: none;
}
.buyAppBox{
	position: static;
	margin: 0 auto;mainCopy
 	 overflow: hidden;
 	 width: 310px;
}
}




 /*---------------------------
	dartsboard
 ----------------------------*/
#dartsboard {
	 margin:20px 0 0;
	 overflow:hidden;
	 background: #ffffff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZmVmZWYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #ffffff 0%, #efefef 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#efefef)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#efefef 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#efefef 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#efefef 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#efefef 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 ); /* IE6-8 */
 }
.contentTit{
  font-size:28px;
  font-weight:bold;
  text-align:center;
}

.textBox{
  width:400px;
}

.contentTit{
   color:#1b4e92;
}
/*#dartsboard .textBox{
  margin:20px 0 0;
}*/
@media screen and (max-width: 768px) {
#dartsboard {
	margin: 0;
}
.contentTit{
  font-size:24px;
  line-height: 1.5;
}
.en .contentTit{
  line-height: 1.3;
}
.cn_trd .contentTit{
  line-height: 1.3;
}
.ko .contentTit{
  line-height: 1.3;
}

#dartsboard .textBox,
.textBox{
 	 width:100%;
 	 margin: 40px 0 30px;
	}
.imgBox{
	margin: 0 auto 20px;
	text-align: center;
}
.imgBox img{
	width: 300px;
}
}

/*---------------------------
	App
----------------------------*/

#app{
	background:#1b2b59;
	color:#fff;
	overflow:hidden;
}
#app .appBg{
	background:url(../img/top/bg_app.jpg) no-repeat  50% top  ;
	width:100%;
	overflow:hidden;
}
#app .contentTit{
	color: #FFF;
}
#app .textBox{
	margin:50px 0 0;
}
#app .imgBox{
	width:420px;
	margin:20px 0 0;
	overflow: hidden;
}
.appImgBox ul{
	display:block;
	overflow: hidden;
}
.appImgBox li{
	float:left;
	width:210px;
	margin:0 auto 15px;
	text-align:center;
}
.appImgBox span{
	font-size:14px;
	display:block;
	font-weight:bold;
}
/*ボタン*/

.whiteBtn{
	background:#fff;
    border-radius: 4px;        /* CSS3草案 */
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */
    -moz-border-radius: 4px;   /* Firefox用 */
	text-align:center;
}
.whiteBtn a{
	display:block;
	text-decoration:none;
	background:url(../img/arrow.png) no-repeat 98% 50%  ;
	color:#1b2b59;
	padding:10px 0;
}

@media screen and (max-width: 768px) {
#app .textBox{
	margin:40px 0 30px;
}
#app .imgBox{
	width:300px;
	margin:20px auto 0;
}
.appImgBox{
	width: 100%;
}
.appImgBox span{
	width: 140px;
	height: 50px;
	display: block;
}
.appImgBox li{
	float:left;
	width:150px;
	margin:0 auto 15px;
	text-align:center;
}
.appImgBox li img{
	width:100px;
	}
}

/*---------------------------
	movie
----------------------------*/
/*.youtube{
	text-align:center;
	margin: 10px 0 20px;
}
.youtube iframe{
	width: 560px;
	height: 315px;
}
.sp_movie{
	display: none;
}*/

.sp_movie img{
	width: 560px;
}


#movie .contentTit{
  margin: 20px 0 10px;
  line-height: 1.2;
}
#movie .contentInner{
	text-align: center;
}

/*.youtube {
	display: none;
}*/
.sp_movie{
	margin: 0 auto;
}
@media screen and (max-width: 768px) {
#movie .contentTit{
  font-size:18px;
}
.sp_movie img{
	width: 100%;
}
}
/*.youtube iframe{
	width: 300px;
	height: 169px;
}*/

.newline:before {
    content: "\A";
    white-space: pre;
}

 /*---------------------------
	InfoBox
 ----------------------------*/
#infoBox{
 	background: #E6E6E6;
 }

#infoBox .contentInner{
  	margin: 0 auto;
}
.info{
	background: #fff;
	border-radius: 10px;
 	-webkit-border-radius: 10px;
 	-moz-border-radius: 10px;
 	margin: 20px auto;
 	width: 640px;
 	text-align: center;
 	overflow: hidden;
}
.teazer .info{
}
/*teaser01*/

.teaser .infoTit{
	color: #cc1c0e;
	font-size: 30px;
	font-weight: bold;
	margin: 20px 0 15px;
	line-height: 1.2;
}
.teaser .infoTxt{
	font-weight: bold;
	font-size: 22px;
	margin: 0 auto 5px;
}
.teaser .infoMiniTxt{
	font-size: 18px;
}
.teaser .hiveBnr{
	width: 300px;
	margin: 0 auto 10px;
}
/*teaser02*/
.teaser02 .info{
	background: #cc1c0e;
	color: #fff;
}
.teaser02 .infoTit{
	font-size: 30px;
	font-weight: bold;
	margin: 20px 0 15px;
	line-height: 1.2;
}
.teaser02 .infoTxt{
	font-weight: bold;
	font-size: 22px;
	margin: 0 auto 5px;
}
.teaser02 .infoMiniTxt{
	font-size: 24px;
}
.teaser02 .hiveBnr{
	width: 300px;
	margin: 0 auto 10px;
}
@media screen and (max-width: 768px) {
.info{
 	width: 90%;
}
/*teaser01*/
.teaser .infoTit{
	font-size: 20px;
}
.teaser .infoTxt{
	font-size: 16px;
}
.teaser .infoMiniTxt{
	font-size: 14px;
}
.teaser .hiveBnr{
	width: 90%;
}
/*teaser02*/
.teaser02 .infoTit{
	font-size: 20px;
}
.teaser02 .infoTxt{
	font-size: 16px;
}
.teaser02 .infoMiniTxt{
	font-size: 14px;
}
.teaser02 .hiveBnr{
	width: 90%;
}
}
 /*---------------------------
	news
 ----------------------------*/
 .news{
 	width: 640px;
	margin: 40px auto;
 }
.news .newsTit{
	text-align: center;
	font-size: 26px;
	font-weight: bold;
	color: #414141;
}
.news .newsBox{
	border-top: 1px solid #D2D2D2;
	padding: 20px 10px;
}
.news .newsList{
	line-height: 1.4;
}
.news .newsList li{
/*	text-indent: -14px;
	padding-left: 14px;*/
	margin: 0 0 10px;
	clear: both;
	overflow: hidden;
	border-bottom: 1px solid #D2D2D2;
	padding: 0 0 10px;
}
.news .newsList li:last-child{
	margin: 0;
	border-bottom: none;
}
.news .thumbNewsBox{
	clear: both;
	overflow: hidden;
/*	margin: 0 0 10px;*/
	display: block;
}
.news .thumbImg{
	width: 30%;
	float: left;
	margin: 0 20px 0 0;
}
.news .thumbTxt{
	float: right;
	text-align: left;
	width: 65%;
	line-height: 1.4;
}
@media screen and (max-width: 768px) {
 .news{
 	margin: 40px auto 10px;
  	width: 90%;
 }
 .news .newsTit{
	font-size: 20px;
 }
.news .newsBox{
	border-top: 1px solid #D2D2D2;
	padding: 20px 0px;
}
.news .newsList{
	font-size: 14px;
}
.news .thumbTxt{
	width: 60%
}
}
 /*---------------------------
	buyInfoBox
 ----------------------------*/
#buyInfoBox .contentInner{
 	width: 600px;
	text-align: center;
 	margin: 0px auto 20px;
 }
 .ja #buyInfoBox .contentInner{
 	width: 700px;
	text-align: center;
 	margin: 40px auto;
 }
 .ja .productBuy{
 	float: left;
 }
 .ja .appBuy{
 	float: right;
 }
#buyInfoBox h3{
  font-weight: bold;
  float: left;
  margin: 5px 0 0;
}
.ja #buyInfoBox h3{
	float: none;
  	margin: 0;
  }

 .icon200s{
	width: 50px;
	height: 46px;
 	display: inline-block;
 	background-position: -300px -43px;
   vertical-align:middle;
 }
 .iconApp{
 	width: 33px;
	height: 46px;
 	display: inline-block;
 	background-position: -360px -43px;
   vertical-align:middle;
 }
.en .iconApp{
 	float: left;
  	margin: 0 20px 0 0;
 }
.cn_trd .iconApp{
 	float: left;
  	margin: 0 20px 0 0;
 }
.ko .iconApp{
 	float: left;
  	margin: 0 20px 0 0;
 }

@media screen and (max-width: 768px) {
.ja #buyInfoBox .contentInner{
 	margin: 40px auto 20px;
 }
.ja .productBuy{
 	float: none;
    margin: 0px 20px 50px;
 }
.appBuy{
 	float: none;
 }
  .ja .appBuy{
 	float: none;
 }
 .en #buyInfoBox .contentInner{
 	width: auto;
	text-align: center;
 	margin: 40px auto 20px;
 }
 .en #buyInfoBox h3{
 	float: none;
 	font-size: 16px;
}
.en .iconApp{
 	float: none;
  	margin: 0;
 }
 .cn_trd #buyInfoBox .contentInner{
 	width: auto;
	text-align: center;
 	margin: 40px auto 20px;
 }
 .cn_trd #buyInfoBox h3{
 	float: none;
 	font-size: 16px;
}
.cn_trd .iconApp{
 	float: none;
  	margin: 0;
 }
 .ko #buyInfoBox .contentInner{
 	width: auto;
	text-align: center;
 	margin: 40px auto 20px;
 }
 .ko #buyInfoBox h3{
 	float: none;
 	font-size: 16px;
}
.ko .iconApp{
 	float: none;
  	margin: 0;
 }
}