@charset "UTF-8";
/* このファイルはサイト全体に充てる、文字フォントの共通cssファイル */
html { /*←①htmlファイル全体に対して最初の設定を行う  */
  font-size: 62.5%; /* 16px * 62.5% = 10px */ /*←htmlの基本設定サイズは16px*/
  /*文字のサイズ*/
  width: 100%;
  /*横いっぱい  */
  box-sizing: border-box;
  /*領域サイズの範囲box-sizingという方式で幅や高さを決めていくよ  */
  /*border-boxの範囲で、幅や高さを決めていくよ */
}
body { 
  background-color: #f1f1f1;
  color: #937118; 
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", sans-serif,"TBUD丸ゴシック Std R", "TBUD明朝 Std M", "A-OTF UD新丸ゴ Pr6N L", "A-OTF じゅん Pro 101", "A-OTF リュウミン Pr6N L-KL";
  /*フォントの種類 mac、windows両方にあるフォント遊ゴシック左から順番に種類を指定  */
  font-weight: 500;
  /*フォントの太さ　デフォルト500  */
  font-size: 1.6rem; /*em：親要素(ソースコードのhtmlのbody)に対しての1.6倍だよ、つまり16px(元の設定と同じ)だよ*/
  /*サイズ  */
  line-height: 2.4rem;
  /*高さ、フォントのサイズの2.5倍がいいらしい  */
  /*rem：トップのhtmlで設定されてる文字サイズの2.4倍だよ、つまり24pxになるよ*/
  text-align: center; /*文字の揃え方left,rightもある  */
} 
img{
  max-width: 100%;
}
section h2 { /*③section要素の中のh2の意  */
  font-size: 3.6rem;
  font-weight: 500;
  line-height: 1;
}
section h3 {
  font-size: 2.0rem;
}
footer h2{
  font-size: 3.6rem;
  font-weight: 500;
  line-height: 1;
}
a {
  color: #333;
}
a:hover { /*aアンカータグ(リンクとかに使う)、：は擬似クラス、hoverマウスカーソルを乗せた時  */
  opacity: 0.5;
  /*不透明度を0.5にします  */
}
.none {
  display: none; /*HTMLでnoneクラスの時は、表示を消すドロワーメニュー記載時に追記①*/
}
* {
  box-sizing: border-box;
}