@charset "UTF-8";

body {
	color: #333;
	background-color:#EDEDED;
	font-size: 1rem;
	margin:0 0 0 0;
	height: calc(100vh - 10px);
    font-family: "M PLUS Rounded 1c", sans-serif;
}

#content{
    background-color: #fff;
}

/* 使い方 */
p {
  font-size: 1em;
}
h1 {
  font-size: 1.8rem;
    text-align: center;
}
h2 {
  font-size: 1.5rem
}

.wide   .px1 {
  border: none;           /* 初期の内蔵ボーダーを消す */
  height: 1px;            /* 線の太さ */
  background-color: #000EE7; /* 線の色 */
         /* 上下の余白 */
}

.sm {font-size: 0.75rem;}

.setsumei{
    margin-bottom: 2rem;
}
 
.icon{
    width : 64px;
    height : 64px;
    float: left;
    margin: 0.5rem 0 0 1rem;
}  

#container	{
	width:100%;
	height:100%;
	/*margin:auto;*/
	
			}

#title {
       color:#333;
       font-family: "M PLUS Rounded 1c", sans-serif;/**/
       font-weight: 700;
       float:left;
	   width:100%;
	   height:80px;
      
	   }

header h2 	{
	position:relative;
	/*top: 10px;
	left: 50%;
	-ms-transform: translate(-50%,-70%);
	-webkit-transform: translate(-50%,-70%);
	transform: translate(-50%,-70%);
    background-color:  #FFF3BF;
    */
    width:auto;
    text-align: left;
	/*font-size: 1.6em; */
   line-height:1.2;
	margin:  0.8rem 0 0 1rem;
	padding-left: 80px;

    }
			
.caution {
	line-height:1.2em;
	padding:1px 10px 1px 10px;
	color:red;	
}

.kannai{
	font-size:16px;
	margin:0 auto 10px auto;
}	 

.dl_btn a{
  /* ボタンをインラインブロック要素にして、文字の長さに合わせる */
  display: inline-block;
  
  /* 【重要】長丸にするために、高さに対して十分大きな数値を指定 */
  border-radius: 8px;
  
  margin: 0.2em 0 0 0 ;    
  /* 内側の余白（上下に12px、左右に32px）※サイズはお好みで */
  padding: 12px 32px;
  
  /* 背景色と文字色 */
  background-color: #007bff; /* 青色 */
  color: #ffffff;            /* 白色 */
  
  /* 文字のデザイン調整 */
  font-size: 1rem;           /* 先ほどのrem管理を取り入れるなら var(--text-base) */
  font-weight: bold;         /* 太字 */
  text-decoration: none;     /* リンクの下線を消す */
  
  /* マウスを乗せたときのアニメーションを滑らかにする設定 */
  transition: background-color 0.3s, transform 0.2s;
}

/* マウスを乗せたとき（ホバー時）の演出 */
.btn a:hover {
  background-color: #0056b3; /* 少し濃い青色にする */
  transform: translateY(-2px); /* ほんの少し上に浮き上がらせる（今風の演出） */
}

.free {
    font-size: 1.2em;
    font-weight: 700;
    color: #007bff;
}

.dl_btn a:hover {
    display: inline-block;
    color:#fff;
    background-color: #A4D5F8;
    text-decoration: none;
     /* 【重要】長丸にするために、高さに対して十分大きな数値を指定 */
  border-radius: 8px;
  transform: translateY(-1px); /* ほんの少し上に浮き上がらせる（今風の演出） */
}

.dl_btn a:active {
    display: inline-block;
    color:#fff;
    background-color: #0268d4;;
    text-decoration: none;
     /* 【重要】長丸にするために、高さに対して十分大きな数値を指定 */
  border-radius: 8px;
  transform: translateY(1px); /* ほんの少し上に浮き上がらせる（今風の演出） */
}

.bordered-image {
  /* border: 太さ 種類 色; */
  border: 1px solid #555; /* 5pxの太さ、実線、暗いグレー */
}

.store-badges {
    width:auto;
    display:flex;
  justify-content: center; /* 左右中央に寄せる場合 */
  gap: 16px;              /* バッジ同士の間に適切な隙間をあける */
  margin: 15px 0;         /* 周囲のクリアスペース（高さの1/4以上）を確保 
  background-color: aqua;  */  
}

.badge-img {
  height: 40px;           /* 双方のガイドラインを満たす最小サイズの40pxで統一 */
  width: auto;            /* 横幅は比率を維持して自動計算 */
  display: block;
}

.caption{
    font-size: 0.9rem;
    font-weight: 700;
    margin: -1em 0 1em 0;
    padding: 0 0  1.6em 0;
}


.clear { clear:both; }
.clear hr { display:none; }

.m-plus-rounded-1c-regular {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.m-plus-rounded-1c-medium {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.m-plus-rounded-1c-bold {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 700;
  font-style: normal;
}



/*　住所検索ボタン　


.btn_kukan_on{
	width:40px;
	height:48px;
	color:#fff;
	background-color:#ddd;
	font-size:14px;
	font-weight:bold;
	text-align:center;
	padding-top:3px;
	border-radius:3px;
	box-shadow: -1px -1px  #333  inset;
}*/

.btn_kukan{
	width:44px;
	height:26px;
	color:#035634;
	background-color:#eee;
	font-size:24px;
    font-stretch: 150%;
	font-weight:bold;
	text-align:center;
    vertical-align: bottom;
    margin: 3px 0 0px 0;
	padding:0px 0 4px 0;
	border-radius:5px;
    border: solid 1px #ccc;
	box-shadow: 1px 1px  #aaa  ;/**/
}

.btn_kukan a{
	display:block;/**/
	color:#777;
	text-decoration:none;
}

.btn_kukan a:hover{
    display:block; /*  !!!  */
    width:44px;
    height:26px;
    color:#aaa;
	background-color:#fff; /**/
	text-decoration:none;
	margin:-3px 0px 0 0px;
	padding:3px 0px 0px;
	border-radius:5px;/*
    border-bottom: solid 1px #bbb;
    box-shadow: 1px 1px  #aaa  inset;*/
}


#hanrei{
margin: 0 auto;
background-image:url("../../img/legend.jpg");
background-repeat: no-repeat; 
background-position: left 50%; 
background-size: 100%;
width: 100%;
height:calc(100vh - 190px);
}

.legend {
background-color:#fff;
width:100%;
margin-top: -36px;
}

footer {
	color: #6C6C6C;
	font-family: 'Helvetica Neue','Helvetica','Avenir',;
	font-size: 1rem;
    font-style:normal;
    font-weight: 600;
	background-color:#ddd; 
	padding: 20px 20px 20px 20px;
	border-top: 1px solid #B49B7B;
    text-align: center;
	}