@charset 'UTF-8';


  




/* ================================================================================================

　ACCESS

=================================================================================================== */

/* ▼ テーブル表:外枠*/
.info_table {
  width: 40%;
  margin: auto;
  }

/*-----------------------------------------------------------*/ 

/* ▼ テーブル表:アイテム*/
.info_item{
  display:flex;
  flex-wrap:wrap;/*アイテムを折り返して複数行に上から下*/
  justify-content: space-between;/*両端のアイテムを余白を空けずに配置し、他の要素は均等*/
  align-items:flex-start;/*上合わせ*/
  }

/* ↓ テーブル表:アイテム:区切り線*/
.info_item {border-bottom: 1px dotted #DEB971;margin-bottom: 20px;}/* not(:last-child) ＝最後の要素以外*/

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:アイテム:左側*/
.info_item_left{
  width: 100%;
  color: #DEB971;
  font-size: 15px;
  font-weight: bold;
  padding:0px 20px;
  box-sizing:border-box;/* paddingにより枠が広がることを防止 */
  display: grid;
  justify-content:left;/* 左寄せ */
  align-content:center;/* 上下中央 */
  }

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:アイテム:右側*/
.info_item_right{
  width: 100%;
  color: #FFFFFF;
  font-size: 15px;
  padding:0px 20px;
  box-sizing:border-box;/* paddingにより枠が広がることを防止 */
  display: grid;
  justify-content:left;/* 左寄せ */
  align-content:center;/* 上下中央 */
  margin-bottom: 20px;
  }
.info_item_right span{color: #C81432;}
.info_item_right span:hover{color: #FFFFFF;}

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:ボタン*/
.info_btn{
  width: 200px;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: bold;
  background: #3F3B3A;
  padding: 0px 5px;
  box-sizing:border-box;/* paddingにより枠が広がることを防止 */
  border-radius: 10px;/*角丸加工*/
  text-align: center;
  margin-top: 5px;
  }
.info_btn:hover{background: #EFEFEF;}

/*-----------------------------------------------------------*/ 

/* ▼ Google MAP -------- */
.info_map{
  width: 45%;
  height: 500px;
  padding: 10px;
  border: solid 1px #DEB971;
  }

/* ***************************************************************************************
レスポンシブ設定
****************************************************************************************** */
/* ▼ スマホ：760px以下の幅の場合に適応される////////////////////////////////*/
@media screen and (max-width:1000px){

/* ▼ テーブル表:外枠*/
.info_table {width: 100%;margin: 0px 0px 30px;}


/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:アイテム:左側*/
.info_item_left{
  width: 100%;
  font-size: 15px;
  padding:0px 0px;
  justify-content:center;/* 左右中央 */
  }

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:アイテム:右側*/
.info_item_right{
  width: 100%;
  font-size: 15px;
  padding:0px 10px;
  justify-content:center;/* 左右中央 */
  margin-bottom: 15px;
  }
.info_item_right span{color: #C81432;}
.info_item_right span:hover{color: #FFFFFF;}

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:ボタン*/
.info_btn{
  width: 200px;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: bold;
  background: #3F3B3A;
  padding: 0px 5px;
  box-sizing:border-box;/* paddingにより枠が広がることを防止 */
  border-radius: 10px;/*角丸加工*/
  text-align: center;
  margin-top: 5px;
  }
.info_btn:hover{background: #EFEFEF;}


/*-----------------------------------------------------------*/ 

/* ▼ Google MAP*/
.info_map{
  width:100%;/* 枠よりはみ出させる：左右に20%ずつ広げる */
  height: 300px;
  padding: 5px;
  }

}/*//////////////////////////////////////////////////////////////////////*/


/* ▼ タブレット：760pxから1280pxまでの幅の場合に適応される///////////////////*/
@media screen and (min-width:1001px) and (max-width:1280px){

/* ↓ テーブル表:アイテム:左側*/
.info_item_left{width: 100%;font-size: 14px;}

/*-----------------------------------------------------------*/ 

/* ↓ テーブル表:アイテム:右側*/
.info_item_right{width: 100%;font-size: 14px;}
  
}/*//////////////////////////////////////////////////////////////////////*/