@charset "utf-8";
body {
	font: 16px "Hiragino Kaku Gothic ProN","メイリオ",'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	background: #ffffff;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #000000;
    -webkit-text-size-adjust: 100%;
}

* { 
margin: 0; 
padding: 0; 
}

img{
	margin: 0;
	padding: 0;
	border:none;
}

p{
	margin: 0;
	padding: 0;
	font-size:18px;
	line-height:36px;
}

a{
	margin: 0;
	padding: 0;
	color:#000;
	text-decoration:none;
}

ul{
	margin: 0;
	padding: 0;
}

li{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.clearfix:after {
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}

/*HEADER------------------------------------------------*/

header {
	width:100%;
	height: 70px;
	margin: 0;
	padding: 0;
	background: #ffffff;
}

header #inner{
	max-width: 1090px;
	width:100%;
	padding: 10px;
	margin: 0 auto;
}

header #inner h1{
	margin: 0;
	padding: 0;
	text-align: left;
	float: left;
}

header #inner h1 img{
	margin: 0;
	padding: 0;
	width: 100%;
}

header #inner nav{
	margin: 0;
	padding: 0;
	float: right;
}

header #inner nav #menu{
	float: right;
}

header #inner nav #menu li{
	margin: 0 10px 0 0;
	padding: 14px 0;
	display: inline-block;
	cursor: pointer;
}

header #inner nav #menu li a{
	padding: 10px 20px;
	background: #ffffff;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}

header #inner nav #menu li a:hover{
	background: #02a2f9;
	color: #ffffff;
}


header #inner #lang{
	margin: 0 0 0 40px;
	float: right;
}

header #inner #lang li{
	padding: 14px 20px 0 0;
	margin: 0;
	display: inline-block;
}

header #inner #lang li a{
	padding: 10px 20px;
	margin: 0 0 0 -20px;
	background: #ffffff;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}

header #inner #lang li a:hover{
	background: #02a2f9;
	color: #ffffff;
}

header #inner #lang #current{
	color:#cccccc;
}



/*メインイメージ------------------------------------------------*/

#content01{
	width:100%;
    background-image: url(../img/main_img01.png);
    background-repeat: repeat-x;
	background-position: center center;
	margin: 0;
	padding: 0;
}

#content01 #main #inner {
	max-width: 1090px;
	width:100%;
	padding: 0;
	margin: 0 auto;
	/*height: 430px;*/

}

#content01 #main {
	width:100%;
	background-image: url(../img/main_img03.png);
	background-position: center center; 
    background-repeat: no-repeat;
	margin: 0;
	padding: 0;
}

#content01 #inner img{
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0;
}

#content01 #inner #pc{
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0;
    display: block;
}

#content01 #inner #sp{
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0;
    display: none;
}


/*HELMOJI------------------------------------------------*/

#content02{
	width:100%;
    background: #ffffff;
	margin: 0;
	padding: 90px 0;
}

#about {
	max-width: 1090px;
	width:100%;
	padding: 0;
	margin: 0 auto;
	height: 100%;
}

#about section{
	margin: 40px 1.9% 0;
	padding: 0;
	float:left;
	width:29.5%;
	/*background: #bcc;*/
}

#about section img{
	width:80%;
}

#about section h2 img{
	width:60px;
	margin: 20px 0 0 0;
	padding: 0;
}

#about section h1{
	margin:0 0 52px 0;
	padding:0;
	font-size: 36px;
}

/*DOWNLOAD------------------------------------------------*/

#dl{
	width:100%;
    background: #ecfaed;
	margin: 0;
	padding: 90px 0;
}

#dl #inner{
	max-width: 900px;
	width:100%;
	margin: 0 auto;
	padding: 60px 0;
	text-align: left;
}

#dl #inner #appIcon{
	margin: 0 90px;
	padding: 0;
	float:left;
}

#dl #inner #dlBtn{
	margin: 20px 0 0 0;
	padding: 0;
}

/*CONTACT------------------------------------------------*/

#contact{
	width:100%;
	margin: 0;
	padding: 90px 0;
}
#contact #inner{
	max-width: 900px;
	width:100%;
	margin: 0 auto;
	padding: 60px 0 30px 0;
}

#contact #contactBtn a{
	width:200px;
	height: 50px;
	margin: 0;
	padding: 20px 40px;
	background: #f5f5f5;
	cursor: pointer;
}

#contact #contactBtn a:hover{
	background: #ffffff;
	border: solid 1px #cccccc;
}

/*FOOTER------------------------------------------------*/

footer {
	width:100%;
	height: 50px;
	margin: 0;
	padding: 20px 0 5px 0;
	background: #f5f5f5;
}

footer a{
	text-decoration: underline;
}

footer a:hover{
	text-decoration: none;
}

/*PAGE TOP------------------------------------------------*/

#page-top {
    position: fixed;
    bottom: 50px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #02a2f9;
    text-decoration: none;
    color: #fff;
    width: 64px;
    padding: 20px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    text-decoration: none;
    background: #80d0fc;
}

/*PRIVACY POLICY------------------------------------------------*/

#privacy {
	width:100%;
	/*height: 70px;*/
	margin: 0;
	padding: 0;
	background: #ffffff;
	    text-align:left;
}

#privacy h1{
	width:100%;
	height: 70px;
	margin: 0;
	padding: 0;
    background-image: url(../img/ttl_pp_bg.png);
}

#privacy h1 #inner{
	max-width: 1090px;
	width:100%;
	padding: 0;
	margin: 0 auto;
}

#privacy h1 #inner img{
	margin: 0;
	padding: 22px 0 0 0;
	width: 474px;
}


#privacy #inner{
	max-width: 1090px;
	width:100%;
	padding: 60px 0 100px 0;
	margin: 0 auto;
}

#privacy #inner p{
	padding: 0;
	margin: 0;
}

#privacy #inner p a{
	text-decoration: underline;
}

#privacy #inner p a:hover{
	text-decoration: none;
}

/*------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1090px) {

/*PRIVACY POLICY------------------------------------------------*/
	
#privacy h1 #inner img{
	margin: 0;
	padding: 25px 0 0 20px;
	width: 340px;
}

#privacy #inner p{
	padding: 0 20px;
	margin: 0;
}
}

/*スマホ用-----------------------------------------------------------------------------------------------*/

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

/*HEADER------------------------------------------------*/

header {
	width:100%;
	height: 120px;
	margin: 0;
	padding: 0;
	background: #ffffff;
	border-bottom: solid 1px #d3e8e9;
	background-image: url(../img/header_bg.png);
}

header #inner{
	max-width: 1090px;
	width:100%;
	padding: 10px 0 10px 0;
	margin: 0 auto;
}

header #inner h1{
	margin: 0;
	padding: 0;
	text-align: left;
	float: left;
}

header #inner h1 img{
	margin: 0;
	padding: 0 0 0 10px;
	width: 70%;
}

header #inner nav{
	max-width: 1090px;
	width:100%;
	padding: 0;
	margin: 5px auto;
	float: left;
}

header #inner nav #menu{
	float: none;
	margin: 0;
	padding: 0;
    font-size: 14px;
}

header #inner nav #menu li{
	margin: 0;
	padding: 16px 1% 0;
	display: inline-block;
	cursor: pointer;
}

header #inner nav #menu li a{
	margin: 0;
	padding: 10px;
	background: #ffffff;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}

header #inner nav #menu li a:hover{
	background: #02a2f9;
	color: #ffffff;
}


header #inner #lang{
	margin: 5px 10px 20px 40px;
	float: right;
	position: absolute;
	top: 0;
	right: 0;
}

header #inner #lang li{
	margin: 0;
	padding: 14px 0 0 0;
	display: inline-block;
	cursor: pointer;
}

header #inner #lang li a{
	padding: 10px 20px;
	background: #ffffff;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}

header #inner #lang li a:hover{
	background: #02a2f9;
	color: #ffffff;
}



/*メインイメージ------------------------------------------------*/
	
#content01 #main {
	width:100%;
	background-image: url(../img/main_img03_sp.png);
	background-position: center center; 
    background-repeat: no-repeat;
	margin: 0;
	padding: 0;
}

#content01 #inner img{
    width: 100%;
    height: 380px;
	padding: 0;
	margin: 0;
}

#content01 #inner #pc{
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0;
    display: none;
}

#content01 #inner #sp{
    width: 100%;
    height: auto;
	padding: 0;
	margin: 0;
	display: block;
}

/*HELMOJI------------------------------------------------*/

#about {
	max-width: 1090px;
	width:100%;
	padding: 0;
	margin: 0 auto;
	/*height: 100%;*/
}

#about section{
	margin: 40px 5% 60px;
	padding: 0;
	float: none;
	width: 90%;
}

/*DOWNLOAD------------------------------------------------*/

#dl #inner{
	max-width: 900px;
	width: 90%;
	margin: 0 auto;
	padding: 60px 5% 0;
	text-align: center;
}

#dl #inner #appIcon{
	margin: 0;
	padding: 0;
	float: none;
}

/*CONTACT------------------------------------------------*/
	
#contact #inner{
	width:95%;
}


/*FOOTER------------------------------------------------*/


}
