/* ===== Webサイト全体のスタイル ===== */
/* html */
html {
  height: 100%;
}

/* body */
body {
  font-family: 游明朝;/* フォントの種類 */
  height: 100%;
  margin: 0;
}

/* h1見出し */
h1 {
  color: #FFFFFF;/* フォントの色 */
  font-size: 100px;/* フォントの大きさ */
  font-family: lobster;/* フォントの種類 */
  text-align: center;/* 文字・画像を中央にそろえる */
  height: 320px;/* 高さ */
  filter: drop-shadow(0 0 5px white);
}


/* ===== ヘッダーのスタイル ===== */
/* ヘッダーの箱 */
header {
  background-image: url(img/熊本城.jpg) ;/*背景画像*/
  height: 500px;/* 高さ */
  padding-top: 150px;/* 上がわの余白 */
  background-repeat: no-repeat;/* 背景のくり返しをやめる */
  background-position: top center;/* 背景の位置 */
}

/* ===== お店紹介のスタイル ===== */
/* セクション */
.shop {
  background-color: #ffffee;/* 背景の色 */
  color: #663300;
  padding: 30px;
}


/* h2見出し */
.shop{ background: linear-gradient(to bottom right ,#FA8BFF 0%,#2BD2FF 50%, #2BFF88 100%);}
/* h2見出し */
.title {
  color: #8B4513;/* フォントの色*/
  font-size: 30px;
  border-left-style: solid;
  border-left-width: 10px;
  border-color:#9400d3;
  padding-left: 15px;
  margin-bottom: 50px;
}

/* 段落 */
.shop p {
  color: #000000;/* フォントの色　*/
  font-size:30px;
  padding: 20px;
  font-style: cursive;/* フォントの種類 */
  border-radius: 30px;
  height: 400px;
}

/* 小さな箱 */
.small {
  background-color: #ffffff;
  width: 240px;
  padding: 15px;
  margin: 20px;
}

.access {
  padding: 30px;
  background-color: #ffffdd;
  height: 400px;
  color: #663300;
}

/* h3見出し */
.access h3 {
  font-size: 50px;
  font-family: lobster;
  margin-top: 30px;
}

/* h2見出し */
.shop{ background: linear-gradient(to bottom right ,#FA8BFF 0%,#2BD2FF 50%, #2BFF88 100%);}
/* h2見出し */
.title {
  color: #8B4513;/* フォントの色*/
  font-size: 30px;
  border-left-style: solid;
  border-left-width: 10px;
  border-color:#9400d3;
  padding-left: 15px;
  margin-bottom: 50px;
}

/* 段落 */
.shop p {
  color: #000000;/* フォントの色　*/
  font-size:30px;
  padding: 20px;
  font-style: cursive;/* フォントの種類 */
  border-radius: 30px;
  height: 400px;
}

/* フッター */
footer {
  text-align: center;
  background-color:  #87ceeb;
}