/* ===== 全体のスタイル ===== */
* {
  margin: 0;
  padding: 0;
}

/* ===== ヘッダーのスタイル ===== */
/* ヘッダー */
header {
  /* 背景の色 */
  background-color: burlywood;
  background-blend-mode:multiply;
  /* 背景の画像 */
  background-image: url(img/top_image.jpg);
  /* 背景の画像を枠いっぱいに広げる */
  background-size: cover;
  /* 内がわの余白 */
  padding: 240px;
}



/* h1見出し */
h1 {
  /* 文字の大きさ */
  font-size: 40px;
  /* 文字の種類 */
  font-family: serif;
  /* 文字の色 */
  color: white;
  /* 文字の整列 */
  text-align: center;
  padding:0px;
}
/*サブタイトル*/
h1 .subtitle{
  font-size:25px;
  font-weight:normal;
  font-family:serif;
}
/*ナビゲーションの箱*/
nav{

background-color:antiquewhite;
padding-top:30px;
padding-bottom:30px;
}



/*リスト全体*/
nav ul{
margin-top:0px;
margin-bottom:0px;
text-align:center;
}

/*1つ１つのリスト*/
nav li{
display:inline-block;
margin-right:100px;
}

/*リンク*/
nav a{
color:indianred;
font-size:17px;
font-family:serif;
text-decoration:none;
background-color:antiquewhite;
background-image:linear-gradient(to right,antiquewhite 40%,transparent 50%,rosybrown 50%);
background-position:0 0;
background-size:200% auto;
transition:0.3s;
border-radius:3px;
padding:10px;
}

/*リンクに触れた時*/
nav a:hover{
color:white;
background-position:-100% 0;
}

/* ===== introduction ===== */
/* セクション */
.intro {
  /* 背景の色 */
 background-color:lightgray;
 background-blend-mode:multiply;
  background-image:url(img/girlgirl.jpg);
background-size:cover;
  /* 内がわの余白 */
  padding: 200px;
  /* 文字の整列 */
}

/* h2見出し */
.intro-title {
  /* 文字の色 */
  color: white;
  /* 文字の大きさ */
  font-size: 35px;
  font-family:serif;
  /* 下がわの余白 */
  margin-bottom: 15px;
  background-color: rgba(255,255,255,0.3);
  border-style:solid;
  border-radius:10px;
}

.intro-title::first-letter {
  font-size: 80px;
font-weight: 600;

}


.intro p{
  color:white;
  font-size:20px;
  font-family:serif;
  padding:40px;
  background-color: rgba(255,255,255,0.3);
border-style:solid;
border-radius:10px;
}

/* レイアウト用の箱 */
div {
  /* レイアウトのルール */
  display: flex;
}

/* 画像 */
img {
  /* 横幅 */
  width: 200px;
  /* 角丸 */
  border-radius: 10px;
}

/* 段落 */
p {
  /* 文字の行間 */
  line-height: 180%;
  /* 左がわの余白 */
  margin-left: 20px;
}

.whitebox{
  background-color:antiquewhite;
  padding:40px;

}

.freeschool{
  background-color:lightgray;
  background-blend-mode:multiply;
  background-image:url(img/twochildren.jpg);
  padding:200px;
}

.freeschool-title{
   /* 文字の色 */
  color: white;
  /* 文字の大きさ */
  font-size: 35px;
  font-family:serif;
  /* 下がわの余白 */
  margin-bottom: 15px;
}

.freeschool-title::first-letter {
  font-size: 80px;
font-weight: 600;

}

.freeschool p{
  color:white;
  font-size:20px;
  font-family:serif;
  padding:40px;
}


/* ===== フッターのスタイル ===== */
/* フッター */
footer {
  /* 文字の色 */
  color: rosybrown;
  /* 背景の色 */
  background-color: antiquewhite;
  /* 文字の整列 */
  text-align: center;
  /* 内がわの余白 */
  padding: 10px;
}