@media all and (max-width:960px){

	p{
		font-size: 12px;
	}
	
	/*------トップページ------*/
 
	#top{
		height: 500px;   
	}
	
	#top-back{
		height: 500px; 
		background-position: 60% -30px; 
		background-size: auto 960px;
	}
	
	/*------インフォメーション------*/

	#top-info{           	/*top+padding-top+padding-bottom=350px*/
  		top: 380px;
  		right: 0px;
  		left: 0px;
	
		width: auto;
		height: 100px;
		margin: 0px 0px 0px 0px;	
		padding: 10px 40px 10px 40px;		

		background: #000;
		border-radius: 0px;	
		opacity: 0.6;
	}
	
	/*------メニューボタン------*/
 
	#nav {
		position: fixed;
	  
		height: 40px;
		width: 100%;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
	
		text-align: right;
		background-color: #000;
		border-bottom: solid 1px #666;	
		opacity: 0.6;
	}

	#nav a:hover{ border-bottom: solid 1px #fff;}  
 
	ul.nav-global {
		margin: 0px 0px 0px 0px;
		padding: 5px 30px 0px 0px;
		list-style: none;
	}
	
	ul.nav-global li {
		display: inline;
		width: auto;	
		width: hight;
		margin: 0px 0px 0px 0px;
		padding: 5px 0px 0px 0px;
	}
	
	img.btn{
		width: auto;
		height: 30px;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		opacity: 1.0;
	}
	
	img.btn2{
		display: none; 
	}
	
	/*------コンテンツ------*/

	#allcontents {
    		width: auto;
		margin: 0px 0px 0px 0px;
		padding: 0px 25px 10px 25px; 
	}
	
	p.contents{
		padding: 0px 20px 0px 20px; 
	}	
	
	/*------見出し------*/

	h2:before {
		width: calc(100% - 20px);
	}

	img.title-sub{
		height: 40px;
	}
	
	/*------イラスト------*/

	img.grap-image{
		width: 150px;
		margin: 10px 10px 10px 10px;
	}

	img.grap-image-s{
		width: 150px;
		margin: 10px 10px 10px 10px;
	}

}


@media all and (max-width:375px){

	#allcontents{
		padding: 0px 5px 0px 5px;
	}

	h2 {
		padding: 0px 0px 0px 0px; 	
	}

	h2:before {
		width: 100%;
	}

	p.contents{
		padding: 0px 15px 0px 15px; 
	}

	#nav {
		text-align: center;
	}
	
	ul.nav-global {
		padding: 5px 0px 0px 0px;
	}
	
}