@charset "utf-8";
/* sp css*/

/* iphone6 Plus 横向き 以下のデバイスサイズ */
@media only screen and (max-width: 768px) {

/* スマホ テキスト改行 */
span.sp_br { display: block;}


body {min-width:100% ;}
#head { width:100%;}
#headInner {
	width:auto;
	margin: 0 20px;
	padding:10px 0;
}
#head .snsTool{
	float:none;
	width:auto;
	display:none;
}
#head .boxBtnOuter {
	float:none;
	position: relative;
	width:100%;
}
#head .boxBtns01 {
	float:right;

}
#head .boxBtns01 li a{
	font-size:11px;
	padding:12px 12px;
	float:none;
	-webkit-transition: width 0.3s;
    -moz-transition: width 0.3s;
    transition: width 0.3s;
    width:60px;
}
#head .boxBtns01 .btn01 span {
	background-image:none;
	padding:0;
}

.cbp-af-header.cbp-af-header-shrink #head .boxBtns01 li a {
    padding:4px 8px;
    background:url(../img/icon_mail_s.png) center center no-repeat #00a5ff;
	background-size:24px 17px;
	width:30px;
}


/*
.cbp-af-header.cbp-af-header-shrink #head .boxBtns01 span {
	display:block;
	height:24px;
	width:24px;
	padding:0 0;
	background-color:#00a5ff;
}
 */




#head .boxBtns01 .btn02 { display:none; }
#head .boxBtns01 .btn02 span {
	background-image:none;
	padding:0;
}
#head .boxBtns02 {
	float:left !important;
	clear:none;
	margin-right:0;
	margin-left:-10px;
}


.spOnly { display:block;}

#block01 {
	background-size:1000px 700px;
	position: relative;
	width:auto;
}
#block01 .boxInner{
	width:auto;
	height:auto;
	position: relative;
	top:40px;
	left:0;
	margin:0;
}
#block01 h1{
	width:128px;
	height:122px;
	background-size:128px auto;
	margin-bottom:20px;
}
#block01 h2{
	font-size:14px;
	margin:0 10px 20px;
	text-shadow: 0 0 5px #000;
	line-height:140% !important;
}
#block01 h2 .jp{
	line-height:160% !important;
}
#block01 h3{
	font-size:16px;
	text-shadow: 0 0 5px #000;
}

/* #block01 .btnDownLoad {
	margin-top:20px;
	margin-bottom:10px;
}

#block01 .btnDownLoad img{
	width:180px;
	height:53px;
} */


.btnDownLoad {
	margin-top:20px;
	width: 100%;
	padding: 0 20px;
	box-sizing: border-box !important;
}

.btnDownLoad div {
	width: 46%;
	height:53px;
	box-sizing: border-box;
  margin: 0 auto 40px;
}

.btnDownLoad a {
	width: 100%;
	height: 100%;
	border-radius: 8px;
	box-sizing: border-box !important;
  margin: 0 auto;
	border: 1px solid #fff;
}

.btnDownLoad span {
	font-size: 12px;
}

.btnDownLoad .btnApple img {
  width: 110px;
	height: 29px;
}

.btnDownLoad .btn3ds img {
  width: 140px;
	height: 35px;
}


.boxCont {
	width:auto;
	margin:0 24px;
	padding:20px 0 60px;
	margin-bottom:20px;
}
#block04.boxCont  { padding-bottom:50px;}
.boxCont h2{
	font-size:26px;
	margin-bottom:10px;
	line-height:120%;
}
.boxCont h2 .jp{
	line-height:140%;
	font-size:22px;
	font-weight:bold;
}


.boxSlide {
	width:100%;
	height:auto;
	background-image:none;
}
#block03 .bx-wrapper {
	top:0;
	left:0;
}

.boxSlide img {
	width:100%;
}


.boxNews {
    width:100%;
}
.boxNews dl {
	position:relative;
	width:100%;
}
.boxNews dt {
	position:absolute;
	width:70px;
	font-size:10px;
	padding:2px 2px 1px;
}
.boxNews dd {
	position:relative;
	padding-left:80px;
	width:100%;
}


#facebookLikeBox {
	width:100%;
	float:none;
	margin-bottom:60px;
}
.boxFacebook {
	width:100%;
	height:400px !important;
	float:none;
	margin:0 auto;
	margin-bottom:20px;
}
.fb-page-parent > .fb-page {
    width: 300px;
  }.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
  width: 100% !important;
}



#boxTwitterOuter {
	width:100% !important;
	float:none;
	margin:0 auto;

}
.boxTwitter {
border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

.boxTwitter iframe{
	width:100% !important;
}
.TwitterWidget #twitter-widget-0, twitter-widget-2 {
	width:100% !important;
}





.boxFacebook iframe{
	width:100% !important;
}

#facebook {
	width: 100% !important;
}
.likeBoxStream , ._5pcb{
	width: 100% !important;
}
.likeBoxStream img{
	width:50%  !important;
	height:auto  !important;
	display:none !important;
}

.fb-like-box,
.fb-like-box span,
.fb-like-box iframe[style]{
  width: 100%!important;
}

.facebookLikeBox{margin:0;}
#facebookLikeBox .fbcomments,
#facebookLikeBox .fb_iframe_widget,
#facebookLikeBox .fb_iframe_widget[style],
#facebookLikeBox .fb_iframe_widget iframe[style],
#facebookLikeBox .fbcomments iframe[style],
#facebookLikeBox .fb_iframe_widget span{
    width: 425px !important;
    height:400px !important;
	margin: auto !important;
}


.fbcomments,
.fb_iframe_widget,
.fb_iframe_widget[style],
.fb_iframe_widget iframe[style],
.fbcomments iframe[style],
.fb_iframe_widget span{
    width: 100% !important;
}


.btnSns a{
	font-size:16px;
}

.btnFb a{margin-bottom:60px; }


#footer {
	padding:40px 0 0;
}
#footer h2 {
	font-size:20px;
	padding:0 20px;
}
#footer h2 .jp{
	line-height:140%;
}
#footer ul.btn{
	width:auto !important;
	margin:0 20px 40px;
}

#footer ul.btn li a{
	width:auto !important;
	display:block;
}
#footer ul.btn li.btn01 a{
	float:none;
	margin-bottom:20px;
}
#footer ul.btn li.btn02 a{
	float:none;
}

#footer ul.btn li.btn01 a span{
	padding:3px 0 3px 50px;
	background:url(../img/icon_mail_l.png) 0 center no-repeat;
	background-size:44px 30px;
}

#footer ul.btn li.btn02 a span{
	padding:3px 0 3px 46px;
	background:url(../img/icon_press_l.png) 0 center no-repeat;
	background-size:40px 40px;
}


#footer .copy{
	text-align:center;
}



.boxStaffOuter {
	padding:40px 0 50px;
	margin-bottom:20px;
}
.boxStaff {
	width:100%;
	margin:0 auto;
}
.boxStaff h2 .jp{
	font-weight:normal;
	line-height:160%;
}
.boxStaff .member {
	width:80px;
	margin:0 10px;
}
.boxStaff .pic{
	width:80px;
	height:80px;
	border-radius: 80px;
    -webkit-border-radius: 80px;
    -moz-border-radius: 80px;
    margin:0 auto 5px;
    background-size:80px 80px !important;
}
.boxStaff .name a{
	font-size:10px;
	margin-bottom:6px;
	background-size:10px 10px;
	padding:4px 0 4px 14px;
	text-align:left;
}
.boxStaff .part{
	font-size:9px;
}

span.brW { display:block;}



#block06 .howToStep {
	margin-right:20px;
	margin-bottom:0;
	margin-bottom :0px !important;
}
/*
.step01 .howToStepInner { padding-right:8px; }
.step02 .howToStepInner { padding-left:8px; padding-right:8px; }
.step03 .howToStepInner { padding-left:8px; }
 */


#block06 .step03 {
	margin-right:0;
	margin-bottom:0;
}
#block06 .howToStep img{
	width:100%;
	height:auto;
}
#block06 .howToStep .howToImg{
	width:100%;
	height:100%;
	margin-bottom:10px;
}
#block06 .howToStep .howToText {
	padding:0;
}


.award {
	position: absolute;
	top:10px;
	left:10px;
}
.award li{
	display:block;
	margin:0 0 4px;
}
.award li img{
	display:block;
	width:90px;
	height:39px;
}


#block08 iframe{
	display:block;
	width:80% !important;
	height:640px !important;
	margin:0 auto;
}

#block08 .boxSoundTrack{
	float:none;
}

#block08 .textSoundTrack{
	float:none;
	width:auto;
}
#block08 h5{
	font-size:17px;
	color:#fff;
	font-weight:bold;
	line-height:140%;
	margin-bottom:20px;
}


#block08 .btnBC {
	display:none;
}


#gallery {
	padding-top:0;
	overflow:hidden;
}
#gallery ul {
	width:100%;
	text-align:center;
}
#gallery li {
	display:inline-block;
	width:68px;
	height:68px;
	overflow:hidden;
	margin:5px 5px;
	float:none;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}



}





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

	#block01 .boxInner{
		top:70px;

	}
	.boxNews dd {
		width:70%;
	}

	.facebookLikeBox{margin:0;}
	#facebookLikeBox .fbcomments,
	#facebookLikeBox .fb_iframe_widget,
	#facebookLikeBox .fb_iframe_widget[style],
	#facebookLikeBox .fb_iframe_widget iframe[style],
	#facebookLikeBox .fbcomments iframe[style],
	#facebookLikeBox .fb_iframe_widget span{
		width: 260px !important;
	}


	span.br { display:block;}
	span.brHp { display:none;}

	#block06  {
		padding-bottom:10px;
	}


	#block06 .howToStep {
	width:100%;
	height:100%;
	float:none;
	margin-right:0;
	margin-bottom:30px;
	}

	#block06 .step03 {
		margin-bottom:0;
	}

	.step01 .howToStepInner { padding:0; }
	.step02 .howToStepInner { padding:0; }
	.step03 .howToStepInner { padding:0; }

	#block08 iframe{
		width:100% !important;
		height:560px !important;
	}

	.award {
		top:-5px;
		left:8px;
	}

}






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

	.boxNews dd {
		width:68%;
	}

	.award {
		top:-10px;
	}

}






@media only screen and (max-height: 480px) {

	#block01 h2{
		line-height:120%;
	}

}