﻿.wrapper {

	margin: 0 auto;

	max-width: 1100px;


	padding: 0 10px;

}

.wrapper2 {

	margin: 0 auto;

	max-width: 1100px;

padding: 0 10px;

	    background-color:#F0F8FF;


}


iframe {border:0;}

.utube iframe{
  width: 100%;

}



.auto-style1 {
	text-align: center;
}


.clearLeft { clear: left; }/*回り込み解除*/


h1 {font-size: 20px;}/*見出し文字サイズ。*/
h2 {font-size: 20px;}/*見出し文字サイズ。*/


p.resizeimage img { width: 100%; }

p.bresizeimage img { width: 30%; float: right;}



p.aresizeimage img { width: 49%; }
p.cresizeimage img { width: 30%; }



.rsample{
    position:relative;
}
.rsample span{


  font-size: 3vw;

    position:absolute;
    bottom:5px;
    left:0px;
    width:100%;
    text-align:center;
    
    color:#fff;
    
    
    background-color:#000;
    
    opacity: 0.8;
}

.txt5{
  	text-align: right;

}

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%;
}

   

  
.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;

	}
	
	


.contents article {
	width: 1100px;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	overflow: hidden;
	margin: 0 auto;
	padding: 10px 0;
	min-height: 500px;/*サンプル用に高さ設定してあります。*/

background: #FA8072;
	
}

.osrs {
	width: 500px;/*センター固定 or リキッドレイアウトの変更(リキッドレイアウトにする場合はwidthを100%に変更)*/
	min-width: 100px;
	
	margin: 0 auto 20px auto;
	padding: 10px 0;
	 background: #4169e1;


}


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;
}


    }
 