
.btn{
	/*アニメーションの起点とするためrelativeを指定*/
	position: relative;
	overflow: hidden;
	/*ボタンの形状*/
	outline: none;
	border: solid 1px rgba(255,255,255,1.00);
	/*アニメーションの指定*/   
	transition: ease .2s;
}

/*ボタン内spanの形状*/
.btn span {
	position: relative;
	z-index: 3;
	color: #FFFFFF;
	margin: 10px;
}
li a .btn2 {
	font-size: 14px;
	color: #FFFFFF;
}

.btn a {
	position: relative;
	z-index: 3;
	color: #333;
}

.btn:hover span{
	color:#000000;
}

.btn:hover a{
	color:#fff;
}

/*== 背景が流れる（左から右） */
.bgleft:before {
 	content: '';
    /*絶対配置で位置を指定*/
 	position: absolute;
 	top: 0;
 	left: 0;
 	z-index: 2;
    /*色や形状*/
 	background:#B41A1A;/*背景色*/
 	width: 100%;
	height: 100%;
    /*アニメーション*/
 	transition: transform .4s cubic-bezier(0.8, 0, 0.2, 1) 0s;
 	transform: scale(0, 1);
	transform-origin: right top;
}
/*hoverした際の形状*/
.bgleft:hover:before{
	transform-origin:left top;
	transform:scale(1, 1);
}





/* Loading背景画面設定　*/
#splash {
/*fixedで全面に固定*/
  position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: #333;
    text-align: center;
    color: #fff;
    background-color: #000000;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:100%;
}

/*ページ内切り替え*/
/* ▼タブ機能の掲載領域の装飾(※必須ではありません) */
   .tabbox { 
	   margin: 0px; 
	   padding: 1em; 
	   text-align: center;
}

   /* ▼タブ機能を制御するラジオボタン(非表示にする) */
   .tabbox input { display: none; }

   /* ▼タブ(共通装飾＋非選択状態の装飾) */
   .tab {
	  font-size: 15px;
      display: inline-block;
      border-radius: 1em ;
      padding: 0.55em 1.5em;
      color: black;
      font-weight: bold;
	  
   }

   /* ▼タブにマウスポインタが載った際の装飾 */
   .tab:hover {
      background-color: #000;
      color: white;
      cursor: pointer;
   }

   /* ▼チェックが入っているラジオボタンの隣にあるタブの装飾(＝選択状態のタブ) */
   input:checked + .tab {
      color: red;
      position: relative;
      z-index: 0;
   }

   /* ▼タブの中身(共通装飾＋非選択状態の装飾) */
   .tabcontent {
      display: none;
      margin-top: 10px;
      padding: 1em;
      position: relative;
      z-index: 0;
      background-color:rgb(255,255,255);
	  border-radius: 1em ;
	  text-align: center; 
   }
 /* ▼チェックが入っているラジオボタンに対応するタブの中身を表示する */
   #tabcheck1:checked ~ #tabcontent1 { display: block; }
   #tabcheck2:checked ~ #tabcontent2 { display: block; }
   #tabcheck3:checked ~ #tabcontent3 { display: block; }
   #tabcheck4:checked ~ #tabcontent4 { display: block; }
   #tabcheck5:checked ~ #tabcontent5 { display: block; }
   #tabcheck6:checked ~ #tabcontent6 { display: block; }
   #tabcheck7:checked ~ #tabcontent7 { display: block; }
   #tabcheck8:checked ~ #tabcontent8 { display: block; }
   #tabcheck9:checked ~ #tabcontent9 { display: block; }
   #tabcheck10:checked ~ #tabcontent10 { display: block; }
   #tabcheck11:checked ~ #tabcontent11 { display: block; }
   #tabcheck12:checked ~ #tabcontent12 { display: block; }
   #tabcheck13:checked ~ #tabcontent13 { display: block; }
   #tabcheck14:checked ~ #tabcontent14 { display: block; }
   #tabcheck15:checked ~ #tabcontent15 { display: block; }
   #tabcheck16:checked ~ #tabcontent16 { display: block; }
   #tabcheck17:checked ~ #tabcontent17 { display: block; }
   #tabcheck18:checked ~ #tabcontent18 { display: block; }
   #tabcheck19:checked ~ #tabcontent19 { display: block; }
   #tabcheck20:checked ~ #tabcontent20 { display: block; }
	#tabcheck21:checked ~ #tabcontent21 { display: block; }
	#tabcheck22:checked ~ #tabcontent22 { display: block; }
	#tabcheck23:checked ~ #tabcontent23 { display: block; }
	#tabcheck24:checked ~ #tabcontent24 { display: block; }
	#tabcheck25:checked ~ #tabcontent25 { display: block; }
	#tabcheck26:checked ~ #tabcontent26 { display: block; }
	#tabcheck27:checked ~ #tabcontent27 { display: block; }
	#tabcheck28:checked ~ #tabcontent28 { display: block; }
	#tabcheck29:checked ~ #tabcontent29 { display: block; }
	#tabcheck30:checked ~ #tabcontent30 { display: block; }
	#tabcheck31:checked ~ #tabcontent31 { display: block; }
	#tabcheck32:checked ~ #tabcontent32 { display: block; }
	#tabcheck33:checked ~ #tabcontent33 { display: block; }
	#tabcheck34:checked ~ #tabcontent34 { display: block; }
	#tabcheck35:checked ~ #tabcontent35 { display: block; }
	#tabcheck36:checked ~ #tabcontent36 { display: block; }
	#tabcheck37:checked ~ #tabcontent37 { display: block; }
	#tabcheck38:checked ~ #tabcontent38 { display: block; }
	#tabcheck39:checked ~ #tabcontent39 { display: block; }
	#tabcheck40:checked ~ #tabcontent40 { display: block; }
	#tabcheck41:checked ~ #tabcontent41 { display: block; }
	#tabcheck42:checked ~ #tabcontent42 { display: block; }
	#tabcheck43:checked ~ #tabcontent43 { display: block; }
	#tabcheck44:checked ~ #tabcontent44 { display: block; }

/*ページ内切り替え*/
@media screen and (min-width:768px) and ( max-width:1024px){
.tab {
	  font-size: 12px;
      border-radius: 1em ;
      padding: 0.2em 1em;
      color: black;
      font-weight: bold;
	  
   }
}
@media screen and (max-width: 768px){
	.tab {
	  font-size: 12px;
      border-radius: 1em ;
      padding: 0.2em 1em;
      color: black;
      font-weight: bold;
	  
   }
	.tabbox { 
	   margin: 0; 
	   padding: 0; 
	   
}
	.tabcontent {
     
	  border-radius: 0 ;
	  
   }
}
@media screen and (max-width: 480px){
	.tab {
	  font-size: auto;
      border-radius: 1em ;
      padding: 0.2em 1em;
      color: black;
      font-weight: bold;
	  
   }
	.tabbox { 
	   margin: 0; 
	   padding: 0; 
	   
}
	.tabcontent {
	  border-radius: 0 ;
	  
   }
}