html{
    font-size: 62.5%;
}
body{
    font-family: "Noto Sans JP", sans-serif;
    color: #333333;
    margin: 0;
}

h1{
    font-size: 3.2rem;
}
h2{
    font-size: 2.6rem;
}
/* h1{
    font-size: 6rem;
}
h2{
    font-size: 5.2rem;
} */
h3{
    font-size: 4.4rem;
}
h4{
    font-size: 3.6rem;
}
h5{
    font-size: 2.8rem;
}
h6{
    font-size: 2rem;
}
h1, h2, h3, h4, h5, h6{
    font-weight: normal;
}
p{
    font-size: 1.6rem;
}
.text-large{
    font-size: 1.8rem;
}

.text-center{
    text-align: center;
}

/* 色の設定 */
.color-white{
    color: #ffffff;
}
.color-red{
    color: #ff0000;
}

/* 余白の設定 */
.pb-28{
    padding-bottom: 28px;
}
.pb-80{
    padding-bottom: 80px;
}

.contents{
    width: 1000px;
    margin: 0 auto;
}

.box1{
    background-color: #00BAFF;
    width: 100%;
    height: 200px;
    margin-bottom: 80px;
}

.box2{
    background-color: #00BAFF;
    width: 600px;
    height: 200px;
    margin: 0 auto 80px auto;
}
.box3{
    background-color: #00709A;
    width: 100%;
    height: 200px;
    padding: 28px 0 0;
    margin-bottom: 80px;
    color: #ffffff;
}
.box3 h2{
    width: 600px;
    margin: 0 auto;
    padding-bottom: 28px;
}
.box3 p{
    width: 600px;
    margin: 0 auto;
}

.box4{
    width: 580px;
    margin: 0 auto;
}
.box4 img{
    width: 100%;
}
/* .box1{
    width: 500px;
    padding: 40px;
    text-align: center;
    margin: 100px auto;
    background-color: #ffc72b;
}
.img-box{
    width: 300px;
}
img{
    width: 100%;
} */