body{

}
.maxWidth {
max-width:1200px;
}

:root {

}

.h2block{
background-color:#2b2b2b;
color:#fff;
}




h2{
color: #ff6333; 
}

.my-button {
  background-color: #007bff; 
  color: white; 
  padding: 10px 20px;
  border-radius: 5px;
  text-align: center;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  border: none;
  display: inline-block;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}


.list-inline-icon {
  width: 25px; /* アイコンの幅 */
  height: 25px; /* アイコンの高さ */
  vertical-align: middle; /* テキストと画像の高さを中央揃えにする */
  margin-right: 5px; /* アイコンとテキストの間に少し余白を入れる */
}


h3{
color: #ff6333;
}

p{
font-weight: bold;
font-size: 18px;
}

.bg-color{
  background-color: #ff6333; 
}

.MDSnoscroll span{
cursor: pointer;
}

a:hover img{
opacity:0.9;
}

.url-b {
width: 400px !important;
text-align: center;
}


.copy-button {
  background-color: #007bff; /* 主要なアクションを示す青 */
  color: white; /* 白い文字 */
  padding: 12px 20px; /* パディングでクリック可能な領域を確保 */
  border: none; /* ボーダーをなくす */
  border-radius: 8px; /* 角を丸くする */
  cursor: pointer; /* マウスオーバーでポインター表示 */
  font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; /* フォントを指定 */
  font-size: 16px; /* フォントサイズ */
  font-weight: 600; /* 少し太字に */
  text-align: center;
  text-decoration: none; /* 下線を消す（もし<a>タグでボタン風にしている場合） */
  display: inline-block; /* ボタンがインライン要素のように振る舞いつつ、幅や高さを設定可能に */
  transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; /* ホバー時のアニメーション */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* わずかな影で立体感 */
}