@font-face {
  font-family: 'hsr';
  src: url('../fonts/hsr_web.woff2') format('woff2');
}
html,body{
 width:100%;
 height:100%;
 padding:0;
 margin:0;
 font-family: 'hsr', "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
 overscroll-behavior-y: none;
}

iframe{
 width:100%;
 height:100%;
 padding:0;
 margin:0;
 border:0;
 }
iframe#ifr{
 width:100%;
 height:100%;
 padding:0;
 margin-top:0px;
 border:0;
 }
iframe#ifr1{
 width:100%;
 height:100%;
 padding:0;
 margin-top:0px;
 border:0;
 }
iframe#ifr2{
 width:100%;
 height:100%;
 padding:0;
 margin-top:0px;
 border:0;
 }
iframe#ifr3{
 width:100%;
 height:100%;
 padding:0;
 margin-top:0px;
 border:0;
 }
iframe#ifr4{
width:100%;
height:100%;
padding:0;
margin-top:0px;
border:0;
}
iframe#ifr5{
  width:100%;
  height:100%;
  padding:0;
  margin-top:0px;
  border:0;
  }
iframe#ifr6{
  width:100%;
  height:100%;
  padding:0;
  margin-top:0px;
  border:0;
  }
button {
  /* ブラウザ特有のスタイルを無効に */
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;

  /* 整える */
  width: 60px;
  height: 30px;
  margin: 1em 0; /* 前後の隙間 */
  padding: 0.6em 1em; /* 塗りの余白 */
  font-size: 0.1em; /* フォントサイズ */
  background-color: #ffffff00; /* 背景色 */
  color: rgb(0, 0, 0); /* テキストカラー */
  cursor: pointer; /* カーソルを指マークに */
  border-radius: 3px; /* 角の丸み */
  border: 0; /* 枠線を消す */
  transition: 0.3s; /* ホバーの変化を滑らかに */
}

  /* top.html */
#tabs {
  display: flex;
  justify-content: center;
  position: fixed;
  width: 100%;
  bottom: 0; /* タブを上に固定 */
  z-index: 1000; /* 適切な z-index の値を設定 */
  margin-bottom: 0px;
}

.tablink {
  flex: 1;
  text-align: center;
  height: 35px;
  margin: 0;
  padding: 5px;
  cursor: pointer;
  border-radius: 0px;
  background-color: black;
  color: #8a8a8a;
  border: 1px solid #8a8a8a;
  border-bottom: 2px solid #8a8a8a;
  font-size: 1em;
  font-family: 'hsr';
}
.tab-content {
  display: none;
}
.tab-content.active {
  display: block;
  padding-bottom: 20px;
}
.tab-content img {
  margin-bottom: 20px; /* 余白を追加 */
}


table {
  border-collapse: collapse;
  width: 94%;
  margin: 3%;
}
td {
  border: 1px solid #000000;
  height: 20px;
}
tr {
  padding: 3px;
  height: 20px;
}

td:nth-child(1){
  text-align: right;
  width: 55px;
  padding: 2px 4px 2px 0px;
}
td:nth-child(2){
  text-align: left;
  width: 40px;
  padding: 2px 0px 2px 4px;
}
td:nth-child(3){
  text-align: left;
  padding: 2px 2px 2px 4px;
  width: calc(100% - 95px);
}


#budget {
  border-collapse: collapse;
  width: 94%;
  margin: 3%;
}
#budget td {
  border: 1px solid #000000;
  height: 16px;
}
#budget tr {
  padding: 3px;
  height: 16px;
}

#budget td:nth-child(1) {
  text-align: right;
  width: 55px;
  padding: 2px 4px 2px 0px;
}
#budget td:nth-child(2) {
  text-align: left;
  width: calc(100% - 220px);
  padding: 2px 0px 2px 4px;
}
#budget td:nth-child(3) {
  text-align: right;
  padding: 2px 4px 2px 0px;
  width: 90px;
}
#budget td:nth-child(4) {
  text-align: right;
  padding: 2px 4px 2px 0px;
  width: 75px;
}

#budget tr:nth-child(even) td {
	background: #eeeeee;
}


.small-text {
  font-size: smaller;
}


input#i1 {
  height: 35px;
  margin: 0.1em 0; /* 前後の隙間 */
  padding: 0.6em 1em; /* 塗りの余白 */
  font-size: 1em; /* フォントサイズ */
  font-family: inherit;
  background-color: #ffffff00; /* 背景色 */
  color: rgb(255, 255, 255); /* テキストカラー */
  border-color: #ffffff;
}
input {
  height: 25px;
  margin: 0.1em 0; /* 前後の隙間 */
  padding: 0.3em 1em; /* 塗りの余白 */
  font-size: 0.8em; /* フォントサイズ */
  font-family: inherit;
  background-color: #ffffff00; /* 背景色 */
  color: rgb(255, 255, 255); /* テキストカラー */
  border-color: #ffffff;
}