body	{
	
	}

#main>:not(#main1)>img	{ display:block;	}
#main1 h3		{ font-family:"Serlio"; font-weight:ormal;
				  background-color:#a9a9a9;
				  padding : 5px;
				}


/***uehara write***/

.titles li  {
	border-bottom:medium solid #696969;
	padding-bottom:10px;
}

.titles li a:hover{
background-color:#dddddd;
} 

#main_contents{
	width :512px; 
}

#main_contents h2{
	text-align: center;
}

.strong_title{
	text-align: center;
	margin: 0;
}

#whatnew_title_img{
	height:650px;
	width:450px;
	margin:0 auto;
}

#app_store{
	text-align: center;
	margin: 0;
	padding :0;
}


#googleplay{
	text-align: center;
	margin: 0;
	padding :0;
}

.box {
  /* Choose the animation */
  animation-name: movingBox;

  /* The animation’s duration */
  animation-duration: 1300ms;

  /* The number of times we want
      the animation to run */
  animation-iteration-count: infinite;

  /* Causes the animation to reverse
      on every odd iteration */
  animation-direction: alternate;
}

@keyframes movingBox {
  0% {
    transform: translate(0, 0);
    opacity: 0.3;
  }

  25% {
    opacity: 0.9;
  }

  50% {
    transform: translate(100px, 100px);
    opacity: 0.2;
  }

  100% {
    transform: translate(30px, 30px);
    opacity: 0.8;
  }
}
/***uehara write***/


#main>:not(#main1)	{	position:relative;	 }
#main>:not(#main1)>h4	{
					 position:relative;	
					 font-family:"Serlio";
					font-weight:normal;
					position:absolute; margin:0;
}

#banner>div		{ border:1px solid #cccccc;	}
#banner			{ display:flex;	
					justify-content:space-between;
					/* flex-wrap: wrap; */
					
					/* flex-direction:column-reverse; */	
					flex-direction:row;	
				}
/* #banner>div:nth-of-type(1)	{
					order: 3;
				}
#banner>div:nth-of-type(2)	{
					order: 1;
				}
#banner>div:nth-of-type(3)	{
					order: 2;
				}
 */				
 

li {
	padding-top:5px;/*リスト上の余白*/
	padding-bottom:5px;/*リスト下の余白*/
}

#main1 h3 	{
	color : #FFFFFF;
}

/* *********** PC ****************** */	
@media screen and (min-width:769px)	{
	#mainbox	{	background-color:#ffffff;


		width : 1000px;
					margin : 0 auto;
	}
	#main>*		{ 	display: table-cell;
					vertical-align:top;
					width:237px;
					border-right:none;
	}
/*
	#main_table>*	{ 	display: table-cell;
		vertical-align:top;
		/*width:237px;
		width:390px;
		hegiht:608px;
		border:2px solid #ffffff; 
		border-right:none;
	}
*/

	#sub_table1>*	{ 	display: table-cell;
		vertical-align:top;
		/*width:237px;*/
		width:484px;
		hegiht:760px;
		border:2px solid #ffffff; 
		border-right:none;
	}

	#sub_table2>*	{ 	display: table-cell;
		vertical-align:top;
		/*width:237px;*/
		width:390px;
		hegiht:608px;
		border:2px solid #ffffff; 
		border-right:none;
	}


	#main1 {
		/* position : fixed; */
	}

	#main1		{	
					border:none;
					width:300px;
	}
	
	#main1>div	{	margin:30px 0 30px 30px;
	}
	
	#main1 h3	{	font-size:1.2rem;
	}
	#main1 ul	{ 	margin-left:30px;	}
	#main1 li	{	margin:9px 0;		}
	.small		{ display: none !important;		}
	.large		{ width : 263px; height : 425px;}

/*	#whatnew_title_img {
				margin : 10px 20px;
	}
*/
	#app_store	{ margin-left : 50px;}
	#googleplay	{ margin-left : 50px;}

	#main :not(#main1)>h4	{
		width:100%;
		text-align:center;
		left:0;
		bottom:200px;
		font-size:2rem;
	}
/*	#footer		{  padding-top:10px;	height:30px; font-weight:normal; font-size:40%;	text-align:center;	margin-top:60%;	}*/
/*	#footer1>a	{ margin:0 1.5%;	}*/
/*	#footer2	{ padding:2% 0;		}*/
/*	#footer			{ margin-top:8%; padding-top:2%; position:absolute; top:3500px;	}*/
	#footer			{ margin-top:8%; padding-top:2%; position:relative; top:1400px	}
	#footer1>a		{ display:block; float:left;	border:1px solid #999999;	width:32%;	margin-right:2%; margin-top:2%; }
	
	#footer1>a:nth-child(3n)	{	margin-right:0;		}
	#footer2		{ padding:3% 0; 	background-color:#FFFFFFF;	margin-top:3%;	}


}
/* *********** Tablet ****************** */	
@media screen and (max-width:768px) and (min-width:481px)	{
/*	#main		{ 	display:table;	}
	#main>*		{	display:table-cell;	}
	#main1		{ vertical-align:middle;	}
	.small		{ display: none !important;		}*/
	#header		{ background-color:#ffffff;}
	#mainbox    { width: 100%;
				  background-color:#d3d3d3;
				}
	#main       { width: 90%;
				  margin : 0 auto;
				  background-color:#ffffff;
				}
	
	body        {
				  background-color:#ffffff;
				}
	
	#main1		{ 	display:table;	}
	
	 .title2 h3	{   width: 100%;
					height : 30px;
					text-align:center;
					  				
				}
	
	.titles li {   width: 20%;
					height : 100px;
 					text-align: center;
					background-color: #f0f8ff;
  					float: left;
					border-left:2px solid #d3d3d3;
  					margin-bottom : 10px;
  					border-bottom:none;
				}

	.titles li:first-child {
					border-left:none;
				}			

	.title2{
					clear:left;
  					margin-top : 30px;
  					margin-bottom : 30px;
			}				
	#main_contents{
		width:90%;
		margin:0 auto;
	}
	#whatnew_title_img{
	width:90%;
	margin:0 auto;
}

#app_store{
	width:90%;
	text-align: center;
	margin:0 auto;
	padding :0;
}


#googleplay{
	width:100%;
	text-align: center;
	margin:0 auto;
	padding :0;
}
	
	
				
						
	#banner			{	margin-top:2px;
				}

/*
	#footer		{  padding-top:2%;	height:60px; font-size:2.5vw;	text-align:center;	margin-top:8%;	}
	#footer1>a	{ margin:0 1.5%;	}
	#footer2	{ padding:2% 0;		}
*/
	#footer			{ margin-top:10%; padding-top:2%;	}
	#footer1>a		{ display:block; float:left;	border:1px solid #999999;	width:32%;	margin-right:2%; margin-top:2%; }
	
	#footer1>a:nth-child(3n)	{	margin-right:0;		}
	#footer2		{ padding:3% 0; 	background-color:#FFFFFFF;	margin-top:3%;	}

}


/* *********** SmartPhone ****************** */	
@media screen and (max-width:480px)	{
/*	#main1 		{ display: none;		}
	.large		{ display: none !important;		}
	
	#main>*		{ border:1px solid #aaa;
					margin-bottm:2%;
	}
	#main>:not(#main1)>h4	{
					 font-family:"Serlio";
					font-weight:normal;
					position:absolute; margin: 0 auto;
					left: 50%;
					top: 50%;
	}*/
	
		#header		{ background-color:#ffffff;
				  width: 100%;
				  height:200px;
				  margin : 0 auto;
				  text-align:center;
				}
	#header {
		 position : static;
	}
	#mainbox    { width: 100%;
				  background-color:#d3d3d3;
				  margin-top :0;
				}
	#main       { width: 90%;
				  margin : 0 auto;
				  background-color:#ffffff;
				}
	
	body        {
				  background-color:#ffffff;
				}
	
		
	.title2 h3	{   width: 100%;
					height : 30px;
					text-align:center;
				}
				
	.titles li {   
					text-align:center;
				}
	#main_contents{
		width:90%;
		margin:0 auto;
	}

#app_store{
	width:90%;
	text-align: center;
	margin:0 auto;
	padding :0;
}


#googleplay{
	width:100%;
	text-align: center;
	margin:0 auto;
	padding :0;
}				

#whatnew_title_img{
	height:450px;
	width:80%;
	margin:0 auto;
}
	
	
	#footer			{ margin-top:8%; padding-top:2%;	}
	#footer1>a		{ display:block; float:left;	border:1px solid #999999;	width:32%;	margin-right:2%; margin-top:2%; }
	
	#footer1>a:nth-child(3n)	{	margin-right:0;		}
	#footer2		{ padding:3% 0; 	background-color:#FFFFFFF;	margin-top:3%;	}
	
}