body	{
	
}

#main>:not(#main1)>img	{ display:block;	}
#main1 h3		{ font-family:"Serlio"; font-weight:normal;
              background-color:#a9a9a9;
              padding : 5px;
            }
            #main h4{
                font-size: 16px;
                color: #202020;
                padding: 3px 0px 3px 0px ;
                font-weight : bold ;
                border-left: solid 15px #c8575c;
                border-bottom: solid 1px #c8575c;
                background: #ffffff;
                }
                #main h5{
                    font-size: 15px;
                    color: #882020;
                    font-weight : bold ;
                    text-decoration : underline;
                    }
    
/***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{
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;	 }

#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 {					height: auto; /*21000px;*/
            }
/*
#main_table>*	{ 	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;}

.sample		{ 	padding-left: 30px;	

}
.sample>ul 	{ 	list-style: disc; padding-left: 20px;
}
.sample>img	{ 	margin-left: 30px;
}

#whatnew_title_img {
            margin : 10px 20px;
}

#app_store	{ margin-left : 50px;}
#googleplay	{ margin-left : 50px;}

#footer		{  padding-top:10px;	height:30px; font-weight:normal; /*font-size:40%;*/	text-align:center;	margin-top:30%;	}
/*	#footer1>a	{ margin:0 1.5%;	}*/
#footer2	{ padding:2% 0;		}

}

/* *********** 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;
    width: 100%;
    }
#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 {	height: 100px;}

.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;		}

}


/* *********** 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;
}				



#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%;	}

}