/* Reset basic link styles */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    display: block; 
    box-sizing: border-box;
    background-color: #FFFDF7;
    font-family: "M PLUS Rounded 1c", sans-serif;
    color: #333333;
}

h1, h2, h3, h4, h5 {
	font-family: "M PLUS Rounded 1c", sans-serif;
    color: #333333;
}

a {
    text-decoration: none;
    color: inherit; 
}

.mobile-br {
    display: none;
}

@media (max-width: 1080px) {
    .mobile-br {
        display: block;
    }
}

:root {
    --pc: 1472 * 100vw;
    --sp: 375 * 100vw;
}
@keyframes fade {
    0% { opacity: 0;  }
    100% { opacity: 1; }
}

@media (max-width: 1080px) {
  [id] {
    scroll-margin-top: 65px;
  }
}

.until-400px{
    display: none;
}
@media screen and (max-width: 400px) {
    .until-400px{
        display: block;
    }
}
.until-370px{
    display: none;
}
@media screen and (max-width: 370px) {
    .until-370px{
        display: block;
    }
}
.until-500px{
    display: none;
}
@media screen and (max-width: 500px) {
    .until-500px{
        display: block;
    }
}
.until-620px{
    display: none;
}
@media screen and (max-width: 620px) {
    .until-620px{
        display: block;
    }
}
.until-380px{
    display: none;
}
@media screen and (max-width: 380px) {
    .until-380px{
        display: block;
    }
}
.until-370px{
    display: none;
}
@media screen and (max-width: 370px) {
    .until-370px{
        display: block;
    }
}