html{
    font-size: 62.5%;
}

body{
    font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "ヒラギノ角ゴ ProN W3", 'Hiragino Kaku Gothic Pro', "Meiryo UI", "メイリオ", "Meiryo", "MS Pゴシック", "MS PGothic", sans-serif;
}

*{
    box-sizing: border-box;
}

img{
    display: block;
}

/*メインビジュアル*/

.main-vj{
    position: relative;
    width: 100%;
    height: auto;
}
.main-vj img{
    width: 100%;
}
.main-vj h1,p{
    position: absolute;
    color: #ffffff;
}
.main-vj h1{
    font-size: clamp(2.4rem, 5.3vw, 10rem);
    width: 100%;
    text-align: center;
    top: 64%;
    text-shadow: 
      0 0 10px #044a96,
      0 0 10px #044a96,
      0 0 10px #044a96;
}
.main-vj p{
    width: 100%;
    font-size: clamp(1rem, 2vw, 3.5rem);
    font-weight: 600;
    text-align: center;
    line-height: 2;
    top: 75%;
    left: 50%;
    transform: translateX(-50%);
}

.sec-interval h2{
    padding: 12% 0 8%;
    font-size: clamp(1.2rem, 2.6vw, 3.2rem);
    color: #3e3a39;
    text-align: center;
    position: relative;
}
.sec-interval h2::after{
    content: "";
    display: inline-block;
    width: 3%;
    height: 9%;
    background: #3e3a39;
    clip-path: polygon(0 0, 100% 0%, 50% 100%);
    position: absolute;
    bottom: 18%;
    left: 50%;
    transform: translateX(-50%);
}


/*共通*/
.case{
    width: 100%;
    height: auto;
    position: relative;
}
.case img{
    width: 100%;
}
.case h3{
    top: 15.5%;
    position: absolute;
    width: 60%;
    font-size: clamp(1rem, 2.7vw, 4.7rem);
    text-align: center;
    line-height: 1.5;
    padding: 0 0 0 2%;
}
.case:last-of-type{
    margin-bottom: 20%;
}

/*CASE03*/
#case03-text{
    top: 15%;
}

/*リンク*/
.link-area{
    background-color: #0081cc;
    width: 100%;
    padding: 5% 0;
    position: fixed;
    bottom: 0;
}
.link-area a{
    width: 60%;
    margin: 0 auto;
    display: block;
}
.link-area a img{
    width: 100%;
}