html {
  scroll-behavior: smooth;
}


.wrapper {

	margin: 0 auto;

	max-width: 1100px;


	padding: 0 10px;

}

.wrapper2 {

	margin: 0 auto;

	max-width: 1100px;

padding: 0 10px;

	    background-color:#F0F8FF;


}


.vid_contents {
width: 100%;/*背景色を横幅いっぱいに広げる*/
text-align: center;
margin: auto;
padding: 4% 4% 4% 4%;/*ここで動画の周りの余白を調整*/
background: #e6e6e6;/*余白の背景色*/
}
.vid_main {
width: 100%;
max-width: 920px;/*PC版での最大幅*/
}

.auto-style8 {
	text-align: right;
	font-size: small;
}

.auto-style10 {
	font-size: large;
}
.auto-style11 {
	background-color: #99CCFF;
}

.auto-style14 {
	border-width: 0px;
}

.auto-style17 {
	font-size: x-large;
		color: #808080;
}


.auto-style16 {
	text-align: left;
	color: #808080;
	font-size: xx-large;
}

.auto-style2 {
	text-align: center;
		color: #808080;

}

.auto-style3 {
	text-align: left;
	  color: #333333;

}



iframe {border:0;}

.utube iframe{
  width: 100%;

}



.auto-style1 {
	text-align: center;
}


.clearLeft { clear: left; }/*回り込み解除*/



p.resizeimage img { width: 100%; }

p.bresizeimage img { width: 30%; float: right;}



p.aresizeimage img { width: 49%; }
p.cresizeimage img { width: 30%; }



.txt5{
  	text-align: right;

}

.txt6{
  	text-align: center;

}



header {
	min-width: 100px;
	
	max-width: 1100px;
	
	margin: 0 auto 20px auto;

	
	padding: 10px 0;
}

.tlogo
  {  
  
   min-width: 100px;
	
	max-width: 500px;
	margin: 0 auto 0 auto;
	padding: 10px 0 0 0;

   }
   
   
   .tlogo2
  {  
  
   min-width: 100px;
	max-width: 1100px;
	
  margin: 0 auto 0 auto;

	padding: 10px 10px;
	
	    background-color:#ffffff;

	

   }
   
      .tlogo4
  {  
  
   min-width: 100px;
	max-width: 1100px;
	
  margin: 0 auto 0 auto;

	padding: 10px 10px;
	
	    background-color:#ffffff;

	

   }

      .tlogo3
  {  
  
   min-width: 100px;
	max-width: 500px;
	
  margin: 0 auto 0 auto;

	padding: 10px 10px;
	

   }


.tlogotst

  {  
  
   min-width: 100px;
	
	max-width: 300px;

   }
   
.tlogotst2

  {  
  
   min-width: 500px;
	
	max-width: 1000px;
	
	  margin: 0 auto 0 auto;

	padding: 10px 10px;
	
	    background-color:#ffffff;


   }




.moviers {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.moviers iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

   
 div.vid_contents {
width: 100%;/*背景色を横幅いっぱいに広げる*/
text-align: center;
}
video.vid_main {
width: 100%;
max-width: 920px;/*PC版での最大幅*/
}  

  
.spees {

	height: 60px;
	width: 450px;

	
	border: thin solid #FF0000;
	text-align: center;
      background: #f0e68c;
      float: left;
}
   
  
   .speesm {
   
        font-size: 18px;
        
    font-weight: bold;   

        
	height: 23px;
	width: 100px;
	border: thin solid #FF0000;
	text-align: center;
	
	
		margin: 10px 30px 0 auto;

      
      float: left;

	}

   .speesm:hover {

	  background: #FFFF00;

	}
	
	 .speesl {
   
        font-size: 18px;

    font-weight: bold;
        
	height: 23px;
	width: 150px;
	border: thin solid #FF0000;
	text-align: center;
	
	
			margin: 10px 30px 0 auto;

      
      float: left;

	}

   .speesl:hover {

	  background: #FFFF00;

	}


 
   .speesw {
   
        font-size: 18px;

    font-weight: bold;
        
	height: 23px;
	width: 180px;
	border: thin solid #FF0000;
	text-align: center;
	
	
			margin: 10px 30px 0 auto;

      
      float: left;

	}

   .speesw:hover {

	  background: #FFFF00;

	}
	
	footer {
	width: 100%;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	margin: 20px auto 0 auto;
	padding: 10px 0;
	border-top: 2px solid #9fb7d4;
}



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


header {
	width: 100%;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	min-width: 100px;
	
	
		max-width: 320px;

	margin: 0 auto 20px auto;
	padding: 10px 0;

}




       
       
  .speesw {
        font-size: 14px;
	height: 36px;
	width: 100px;
	border: thin solid #FF0000;
	text-align: center;
      background: #4169e1;

	float: left;
}

   .speesw:hover {

	  background: #8a2be2;

	}




.contents article {
	width: 400px;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	overflow: hidden;
	margin: 0 auto;
	padding: 10px 0;
	min-height: 500px;/*サンプル用に高さ設定してあります。*/
}
footer {
	width: 100%;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	margin: 20px auto 0 auto;
	padding: 10px 0;
	border-top: 2px solid #9fb7d4;
}


    }