*,
*::before,
*::after {
    box-sizing: border-box;
}

/* @font-face {
  font-family: "Affogato";
  src: url(../font/AffogatoRegular.otf);
} */

body {
    width: 100%;
    height: 100%;
    font-family: "Zen Maru Gothic", sans-serif;
    letter-spacing: 0.1em;
    font-size: var(--fs14);
    font-weight: 400;
    color: var(--main-color2);
    background-color: var(--main-color1);
}

:root {
    --main-color1: #ab4747;
    --main-color2: #ebd4ad;
    --sub-color1: #fffef0;
    --sub-color2: #d1a352;
    --sub-color3: #544d42;
    --sub-color4: #DDB4AC;
    --fs10: calc(10 / 16 * 1rem);
    --fs11: calc(11 / 16 * 1rem);
    --fs12: calc(12 / 16 * 1rem);
    --fs13: calc(13 / 16 * 1rem);
    --fs14: calc(14 / 16 * 1rem);
    --fs15: calc(15 / 16 * 1rem);
    --fs16: calc(16 / 16 * 1rem);
    --fs17: calc(17 / 16 * 1rem);
    --fs18: calc(18 / 16 * 1rem);
    --fs19: calc(19 / 16 * 1rem);
    --fs20: calc(20 / 16 * 1rem);
    --fs21: calc(21 / 16 * 1rem);
    --fs22: calc(22 / 16 * 1rem);
    --fs23: calc(23 / 16 * 1rem);
    --fs24: calc(24 / 16 * 1rem);
    --fs25: calc(25 / 16 * 1rem);
    --fs26: calc(26 / 16 * 1rem);
    --fs27: calc(27 / 16 * 1rem);
    --fs28: calc(28 / 16 * 1rem);
    --fs29: calc(29 / 16 * 1rem);
    --fs30: calc(30 / 16 * 1rem);
    --fs31: calc(31 / 16 * 1rem);
    --fs32: calc(32 / 16 * 1rem);
    --fs33: calc(33 / 16 * 1rem);
    --fs34: calc(34 / 16 * 1rem);
    --fs35: calc(35 / 16 * 1rem);
    --fs36: calc(36 / 16 * 1rem);
    --fs37: calc(37 / 16 * 1rem);
    --fs38: calc(38 / 16 * 1rem);
    --fs39: calc(39 / 16 * 1rem);
    --fs40: calc(40 / 16 * 1rem);
    --fs42: calc(42 / 16 * 1rem);
    --fs44: calc(44 / 16 * 1rem);
    --fs46: calc(46 / 16 * 1rem);
    --fs48: calc(48 / 16 * 1rem);
    --fs50: calc(50 / 16 * 1rem);
    --fs52: calc(52 / 16 * 1rem);
    --fs54: calc(54 / 16 * 1rem);
    --fs56: calc(56 / 16 * 1rem);
    --fs58: calc(58 / 16 * 1rem);
    --fs60: calc(60 / 16 * 1rem);
    --fs70: calc(70 / 16 * 1rem);
    --fs80: calc(80 / 16 * 1rem);
}

p {
    font-size: var(--fs14);
    /* ↑上の変数を反映させる書き方 */
    /*  margin-bottom: 1em; */
}

.wrapper {
    width: 100%;
    height: 100%;
    position: relative;
}
.scroll-block {
  opacity: 0;
  transform: translateY(100px);
  transition: all 1.1s;
}
.blockIn {
  opacity: 1;
  transform: translateY(0px);
}