@charset "utf-8";

.mainvisualWrapper{
	position: relative;
	margin-top: -82px;
	padding-bottom: 21px;
	background: url(../images/index/index_main_bg_sp.png) no-repeat 0% 0%;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	-ms-background-size: cover;
	z-index: 10;	
}

.mainvisual{
	padding-top: 82px;
	text-align: center;
}

.mainvisual_content{
	position: relative;
	margin-top: 5%;
	padding-top: 1px;	
	width: 100%;
	padding-top: 1px;		
	background: url(../images/index/index_main_character_sp.png) no-repeat 50% 0%;
	background-size: 88.125% auto;
	-moz-background-size: 88.125% auto;
	-webkit-background-size: 88.125% auto;
	-o-background-size: 88.125% auto;
	-ms-background-size: 88.125% auto;
}

.mainvisual_content img{
	width: 100%;
	height: auto;
}

.mainvisual_title{
	margin: -6% auto 0;
	width: 87.5%;
}

.mainvisual_copy1{
	margin: 80% auto 0;
	width: 87.5%;
}

.mainvisual_btn{
	margin: 0 auto;
	width: 75.3125%;
}

.mainvisual_movie{
	margin: 5% auto 0;
	width: 87.3%;
}

.mainvisual_download_rakuten img{
    margin: 2% auto 0;
    width: 50%;
}

.mainvisual_text {
    margin: 2% auto 0;
}

.mainvisual_text img{
    width: 150px;
}

.introduce{
	padding: 48px 0 0;
	position: relative;	
	margin: 0 auto;	
	background: url(../images/index/index_introduce_bg_sp.png) no-repeat 0% 0%;	
	text-align: center;
	background-size: 100% auto;
	-moz-background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-o-background-size: 100% auto;
	-ms-background-size: 100% auto;
}

.introduce img{
	width: 100%;
	height: auto;
}

.introduce_pointWrapper{
	position: relative;	
}

.introduce_point{
	position: relative;	
}

.introduce_point_detail{	
	line-height: 1.2em;
	text-align: left;	
}

.introduce_point_character{
	position: absolute;
	z-index: 10;
}

.introduce_point1 .introduce_point_text{
	padding-top: 5%;
	margin-left: 25%;
	width: 58%;
}

.introduce_point1 .introduce_point_detail{
	margin: 2% 0 0 39%;
	width: 57.5%;
}

.introduce_point1 .introduce_point_image{
	margin: 2% 0 0 27%;
	width: 69.2%;
}

.introduce_point .character1{	
	left: 0;	
	width: 25.4%;
}

.introduce_point2{
	margin-top: 3%;
}

.introduce_point2 .introduce_point_text{
	margin-left: 5%;	
	width: 77.8%;
}

.introduce_point2 .introduce_point_detail{
	margin-left: 20%;
	width: 52%;
}

.introduce_point2 .introduce_point_image{
	margin: 2% 0 0 20%;
	width: 52.81%;
}

.introduce_point .character2{
	top: 0;	
	right: 0;
	margin-top: 6%;
	width: 21.875%;
}

.introduce_point3{
	margin-top: 5%;
}

.introduce_point3 .introduce_point_text{
	margin-left: 25%;
	width: 62.8125%;
}

.introduce_point3 .introduce_point_detail{
	margin: 2% 0 0 40%;
	width: 51%;
}

.introduce_point3 .introduce_point_image{
	margin: 2% 0 0 37%;
	width: 51.5625%;
}

.introduce_point .character3{	
	left: 0;
	top: 0;
	margin-top: 8%;
	width: 25.4%;
}

.introduce_point4 .introduce_point_text{	
	margin-left: 5%;
	width: 74.21%;
}

.introduce_point4 .introduce_point_detail{
	margin: 1% 0 0 19%;
	width: 62.03%;
}

.introduce_point4 .introduce_point_image{
	margin: 2% 0 0 11%;
	width: 75.24%;
}

.character4{
	top: 0;
	left: 0;
	margin-top: 48%;
	width: 22.3%;
}

.character5{
	top: 0;
	right: 0;
	margin-top: 23%;
	width: 22.3%;
}

.introduce_banners{
	position: relative;
	z-index: 15;
}

.introduce_bannerWrapper{
	position: relative;
	margin-top: 20%;
}

.introduce_banners{
	margin: -3% auto;
	width: 93.75%;
}

.introduce_banners li{
	margin-top: 3%;
	float: left;
	margin-right: 1%;
	width: 49%;
}

.introduce_banners li.introduce_twitter,
.introduce_banners li.introduce_facebook{
	margin-top: 0;
	clear: both;
	width: 100%;
	position: relative;
}

.introduce_banners li.introduce_twitter{
	margin-top: 10%;
}

.introduce_banners .introduce_snstext.small{
	display: block;	
	text-align: left;
	margin-bottom: 10px;
	font-weight: bold;
}

.introduce_twitter .introduce_snstext{
	width: 16.83%;	
}

.introduce_facebook .introduce_snstext{
	margin-left: 22%;
	width: 22.5%;
}

.introduce_banners .introduce_snstext img{
	width: 100%;
	height: auto;
}

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

#twitter-widget-1[style]{	
	height: 195px!important;	
}

.introduce_timeline{
	position: absolute;
	top: 10%;	
	width: 79%;	
}

.introduce_twitter .introduce_timeline{
	left: 0;
}

.introduce_facebook .introduce_timeline{
	right: 0;
} 

.snsdummy{
	visibility: hidden;
	width: 100%;
	height: auto;
}

.character6{
	top: 63%;
	left: 0;	
	width: 18.75%;
}

.character7{
	top: 34%;
	right: 0;	
	width: 28.75%;
}

.carouselWrapper{
	position: relative;
	padding-bottom: 25%;
}

.carousel{
	margin: 0 auto;
	width: 78.125%!important;	
}

.carousel_control{
	position: absolute;
	top: 25%;
	width: 10.9375%;
	cursor: pointer;
}

.carousel_control_left{
	left: 0;
}

.carousel_control_right{
	right: 0;
}

.content_main_download_rakuten img{
    margin-top: 15px;
    width: 200px;
}