@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap");
:root { --green: #38ab53; --yellow: #ffe100; --black: #3f3b56; --white: #fff; }

@media (min-width: 1201px) { :root { --width: 1920; }
  .sp-only { display: none; } }
@media screen and (min-width: 750px) and (max-width: 1200px), print { :root { --width: 1200; }
  .sp-only { display: none; } }
@media (max-width: 750px) { :root { --width: 750; }
  .pc-only { display: none; } }
/* site common */
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 62.5%; font-family: "Noto Sans JP", "YuGothic", "Yu Gothic medium", "Hiragino Sans", "Meiryo", "sans-serif"; font-weight: 500; font-style: normal; scroll-behavior: smooth; scroll-padding-top: 80px; overflow-x: clip; }
@media (max-width: 750px) and (min-width: 375px) { html { font-size: calc(100vw / 750 * 10); scroll-padding-top: calc((100 / 750) * 100vw); } }
@media (max-width: 375px) { html { font-size: calc(100vw / 375 * 10); scroll-padding-top: calc((33 / 375) * 100vw); } }

body { background-color: var(--green); color: var(--black); font-size: clamp(1.2rem, 1.25vw, 2rem); line-height: 1.5; scroll-padding-top: 80px; }
body.clip { overflow: clip; }

* { box-sizing: border-box; }

img { width: 100%; height: auto; vertical-align: top; object-fit: contain; }

a { transition: opacity ease .3s; }
a:has(img):hover { opacity: 0.5; }

p.notes { color: #fff; font-size: 1.3rem; line-height: 1.7; text-indent: -1.3rem; margin-left: 1.3rem; }
p.notes::before { content: '※'; }

/* HEADER */
header#header { display: flex; align-items: center; flex-wrap: wrap; padding: calc((32 / var(--width)) * 100vw) 0 calc((24 / var(--width)) * 100vw); transition: all ease .3s; width: 100%; position: sticky; top: 0; left: 0; z-index: 10; }
header#header.sticky { backdrop-filter: blur(3px); padding: calc((16 / var(--width)) * 100vw) 0; }
header#header.sticky ul.gnav__items li a { color: var(--black); }
@media (max-width: 750px) { header#header.sticky ul.gnav__items li a { color: #fff; } }
header#header.open { background-color: var(--green); }

.logo-area { flex-shrink: 0; background-color: var(--white); border-top-right-radius: calc((36 / var(--width)) * 100vw); border-bottom-right-radius: calc((36 / var(--width)) * 100vw); max-width: 590px; padding: calc((14 / var(--width)) * 100vw) calc((52 / var(--width)) * 100vw) calc((15 / var(--width)) * 100vw) calc((126 / var(--width)) * 100vw); }
.logo-area a.logo { display: block; width: calc((412 / var(--width)) * 100vw); height: auto; max-width: 412px; }

@media (max-width: 750px) { .logo-area { padding: calc((13 / 750) * 100vw) calc((47 / 750) * 100vw) calc((13 / 750) * 100vw) calc((55 / 750) * 100vw); } }
/* navigation */
nav.gnav { flex-shrink: 0; margin-left: auto; }
nav.gnav ul.gnav__items { font-size: 1.6rem; font-weight: bold; color: #fff; display: flex; align-items: center; }
@media (max-width: 750px) { nav.gnav ul.gnav__items { font-size: 1.8rem; } }
nav.gnav ul.gnav__items > li { flex-shrink: 0; margin-right: calc((24 / 1920) * 100vw); }
nav.gnav ul.gnav__items > li:has(a) a { display: inline-block; height: 100%; color: #fff; position: relative; }
nav.gnav ul.gnav__items > li:has(a) a::after { content: ''; display: block; background-color: var(--yellow); border-radius: 4px; width: 0%; height: 5px; position: absolute; right: 0; bottom: -12px; left: 0; margin: auto; transition: width ease .45s; }
nav.gnav ul.gnav__items > li:has(a) a:hover::after { width: 100%; }
nav.gnav ul.gnav__items > li:has(a) a.current::after { width: 100%; }

@media (max-width: 1200px) { nav.gnav { visibility: hidden; opacity: 0; height: 0; }
  nav.gnav.open { visibility: visible; opacity: 1; width: 100%; height: 100vh; padding-top: calc((100 / 750) * 100vw); overflow-y: auto; padding-bottom: calc((32 / 750) * 100vw); }
  nav.gnav.open ul.gnav__items { display: block; text-align: center; }
  nav.gnav.open ul.gnav__items li { margin-bottom: 16px; }
  nav.gnav.open ul.gnav__items li a { color: #fff !important; } }
/* mennu button */
button.menubtn { display: none; visibility: hidden; opacity: 0; }

@media (max-width: 1200px) { button.menubtn { display: block; visibility: visible; opacity: 1; cursor: pointer; width: calc((85 / 750) * 100vw); height: calc((58 / 750) * 100vw); max-width: 85px; max-height: 58px; margin-left: auto; margin-right: calc((23 / 750) * 100vw); position: relative; z-index: 20; overflow: clip; }
  button.menubtn span { display: block; width: calc((85 / 750) * 100vw); height: calc((6 / 750) * 100vw); max-width: 85px; max-height: 6px; background-color: var(--yellow); border-radius: calc((4 / 750) * 100vw); transform-origin: center center; transition: all ease .3s; position: absolute; }
  button.menubtn span:first-child { top: 0; left: 0; right: 0; }
  button.menubtn span:nth-child(2) { top: 50%; left: 0; right: 0; transform: translateY(-50%); }
  button.menubtn span:nth-child(3) { margin-bottom: 0; left: 0; right: 0; bottom: 0; }
  button.menubtn.close span:first-child { top: 50%; transform: rotate(25deg); }
  button.menubtn.close span:nth-child(2) { top: 50%; transform: rotate(155deg); }
  button.menubtn.close span:nth-child(3) { transform: scale(0%); } }
@media (max-width: 750px) { button.menubtn { max-height: 48px; } }
/* MAIN */
.inner { max-width: 1200px; margin-inline: auto; }

@media (max-width: 1200px) { .inner { padding-inline: calc((60 / 1200) * 100vw); } }
@media (max-width: 750px) { .inner { padding-inline: calc((60 / 750) * 100vw); } }
/* MV */
.mv { background-color: var(--white); margin-top: calc((64 / var(--width)) * 100vw); margin-bottom: calc((64 / var(--width)) * 100vw); overflow-x: clip; position: relative; z-index: 1; }
@media screen and (min-width: 750px), print { .mv { height: calc(((1000 - 124) / 1920) * 100vw); } }
.mv::before, .mv::after { content: ''; display: block; width: 100%; height: calc((64 / var(--width)) * 100vw); max-height: 64px; position: absolute; left: 0; z-index: -1; }
.mv::before { background: url("../img/wave_top.png") left bottom repeat-x; background-size: calc((280 / var(--width)) * 100vw) calc((64 / var(--width)) * 100vw); top: calc((-60 / var(--width)) * 100vw); }
.mv::after { background: url("../img/wave_bottom.png") left top repeat-x; background-size: calc((280 / var(--width)) * 100vw) calc((64 / var(--width)) * 100vw); bottom: calc((-60 / var(--width)) * 100vw); }
@media screen and (min-width: 750px), print { .mv .inner { padding-top: calc((72 / var(--width)) * 100vw); } }
@media (max-width: 750px) { .mv .inner { padding-bottom: calc(((480 - 141) / 750) * 100vw); } }
.mv .mv__title { width: calc((886 / 1920) * 100vw); height: auto; max-width: 886px; margin: 0 auto calc((70 / 1920) * 100vw); position: relative; }
@media (max-width: 750px) { .mv .mv__title { width: calc((634 / 750) * 100vw); height: auto; max-width: 634px; margin: 0 auto calc((24 / 750) * 100vw); } }
.mv .mv__title::before { content: ''; display: block; width: calc((174 / 1920) * 100vw); height: calc((164 / 1920) * 100vw); max-width: 174px; max-height: 164px; background: url("../img/fukidashi.png") center center no-repeat; background-size: contain; }
@media screen and (min-width: 750px), print { .mv .mv__title::before { position: absolute; top: calc((-81 / 1920) * 100vw); left: calc((-154 / 1920) * 100vw); } }
@media (max-width: 750px) { .mv .mv__title::before { width: calc((235 / 750) * 100vw); height: calc((124 / 750) * 100vw); max-width: 235px; max-height: 124px; background: url("../img/fukidashi_sp.png") center center no-repeat; background-size: contain; margin-left: calc((30 / 750) * 100vw); margin-bottom: calc((38 / 750) * 100vw); } }
.mv .ribon { display: block; width: calc((638 / 1920) * 100vw); height: auto; max-width: 638px; margin: 0 auto calc((26 / 1920) * 100vw); }
@media (max-width: 750px) { .mv .ribon { width: calc((638 / 750) * 100vw); height: auto; } }
.mv .mv__illust { display: block; pointer-events: none; position: absolute; z-index: -1; }
.mv .mv__illust.il01 { height: auto; width: calc((231 / 1920) * 100vw); max-width: 231px; top: calc((153 / 1920) * 100vw); left: calc((64 / 1920) * 100vw); }
@media (max-width: 750px) { .mv .mv__illust.il01 { width: calc((93 / 750) * 100vw); max-width: 93px; top: auto; bottom: calc((208 / 750) * 100vw); left: calc((31 / 750) * 100vw); } }
.mv .mv__illust.il02 { height: auto; width: calc((422 / 1920) * 100vw); max-width: 422px; left: calc((68 / 1920) * 100vw); bottom: calc((5 / 1920) * 100vw); }
@media (max-width: 750px) { .mv .mv__illust.il02 { width: calc((171 / 750) * 100vw); max-width: 171px; bottom: calc((12 / 750) * 100vw); left: calc((-15 / 750) * 100vw); } }
.mv .mv__illust.il03 { height: auto; width: calc((260 / 1920) * 100vw); max-width: 260px; top: calc((35 / 1920) * 100vw); right: calc((61 / 1920) * 100vw); }
@media (max-width: 750px) { .mv .mv__illust.il03 { width: calc((130 / 750) * 100vw); max-width: 130px; top: auto; right: calc((17 / 750) * 100vw); bottom: calc((217 / 750) * 100vw); } }
.mv .mv__illust.il04 { height: auto; width: calc((483 / 1920) * 100vw); max-width: 483px; right: calc((-17 /1920) * 100vw); bottom: 0; }
@media (max-width: 750px) { .mv .mv__illust.il04 { width: calc((173 / 750) * 100vw); max-width: 173px; right: calc((-12 / 750) * 100vw); bottom: calc((19 / 750) * 100vw); } }

.zerokun__anm { max-width: 647px; max-height: 415px; width: calc((647 / 1920) * 100vw); height: calc((415 / 1920) * 100vw); position: relative; pointer-events: none; }
@media screen and (min-width: 750px), print { .zerokun__anm { margin-inline: auto; } }
@media (max-width: 750px) { .zerokun__anm { width: calc((537 / 750) * 100vw); height: calc((480 / 750) * 100vw); max-width: 537px; max-height: 480px; position: absolute; right: calc((60 / 750) * 100vw); bottom: calc((-141 / 750) * 100vw); } }
.zerokun__anm .zerokun01 { max-width: 440px; max-height: 411px; width: calc((440 / 1920) * 100vw); height: calc((411 / 1920) * 100vw); position: relative; }
@media screen and (min-width: 750px), print { .zerokun__anm .zerokun01 { margin-left: calc((117 / 1920) * 100vw); } }
@media (max-width: 750px) { .zerokun__anm .zerokun01 { width: calc((440 / 750) * 100vw); height: calc((411 / 750) * 100vw); position: absolute; left: 6px; bottom: 0; } }
.zerokun__anm .zerokun01 img { width: 100%; height: auto; position: absolute; bottom: 0; left: 0; }
.zerokun__anm .zerokun01 img:first-child { animation: frame01 infinite steps(1, end) 1.75s; }
.zerokun__anm .zerokun01 img:nth-child(2) { animation: frame02 infinite steps(1, end) 1.75s; }
.zerokun__anm .serihu { width: calc((145 / 1920) * 100vw); height: calc((61 / 1920) * 100vw); position: absolute; }
@media screen and (min-width: 750px), print { .zerokun__anm .serihu { top: calc((128 / 1920) * 100vw); left: 0; } }
@media (max-width: 750px) { .zerokun__anm .serihu { width: calc((145 / 750) * 100vw); height: calc((61 / 750) * 100vw); top: 0; left: 0; } }
.zerokun__anm .name { width: calc((105 / 1920) * 100vw); height: calc((54 / 1920) * 100vw); position: absolute; }
@media screen and (min-width: 750px), print { .zerokun__anm .name { right: 0; bottom: calc((19 / 1920) * 100vw); } }
@media (max-width: 750px) { .zerokun__anm .name { width: calc((105 / 750) * 100vw); height: calc((54 / 750) * 100vw); right: 0; bottom: 0; } }

@keyframes frame01 { 0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
@keyframes frame02 { 0% { opacity: 1; }
  50% { opacity: 0; }
  100% { opacity: 1; } }
/* COMMON PARTS */
.ttl { text-align: center; margin-bottom: calc((56 / var(--width)) * 100vw); }
@media (max-width: 750px) { .ttl { margin-bottom: calc((48 / 750) * 100vw); } }
.ttl img { width: calc((404 / var(--width)) * 100vw); height: auto; max-width: 404px; }
@media (max-width: 750px) { .ttl img { width: calc((444 / 750) * 100vw); max-width: 444px; } }

.btn { display: inline-block; background-color: var(--white); border: calc((4 / var(--width)) * 100vw) solid var(--black); border-radius: calc((70 / var(--width)) * 100vw); color: var(--black); font-size: 2rem; font-weight: bold; text-align: center; letter-spacing: 0.15rem; min-width: 552px; padding: calc((20 / var(--width)) * 100vw) calc((45 / var(--width)) * 100vw); position: relative; }
@media (max-width: 750px) { .btn { font-size: 1.6rem; min-width: 100%; } }
.btn::after { content: ''; display: block; width: calc((12 / var(--width)) * 100vw); height: calc((21 / var(--width)) * 100vw); background: url("../img/common/btn-arrow_bk.svg") center center no-repeat; position: absolute; top: 50%; right: calc((24 / var(--width)) * 100vw); transform: translateY(-50%); transition: all ease .3s; }
.btn:hover::after { right: calc((18 / var(--width)) * 100vw); }
.btn.anchor::after { top: 55%; transform: translateY(-55%) rotate(90deg); }
.btn.anchor:hover::after { right: calc((22 / var(--width)) * 100vw); top: 65%; transform: translateY(-65%) rotate(90deg); }
.btn.youkou { background-color: var(--black); color: #fff; padding: calc((12 / var(--width)) * 100vw) calc((32 / var(--width)) * 100vw); min-width: 331px; }
@media (max-width: 750px) { .btn.youkou { min-width: 300px; } }
.btn.youkou::after { background: url("../img/common/btn-arrow_wh.svg") center center no-repeat; }
.btn.sns--x i { display: inline-block; vertical-align: middle; width: calc((30 / var(--width)) * 100vw); height: calc((28 / var(--width)) * 100vw); }
.btn.sns--x span { vertical-align: middle; }
.btn.cl--y { background-color: var(--yellow); }

.bg--green { background-color: var(--green); }

.bg--yellow { background-color: var(--yellow); }

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

.txt--right { text-align: right; }

.txt--left { text-align: left; }

/* ABOUT */
section.about { padding-top: calc((148 / var(--width)) * 100vw); padding-bottom: calc((194 / var(--width)) * 100vw); }
@media (max-width: 750px) { section.about { padding-top: calc((200 / 750) * 100vw); padding-bottom: calc((164 / 750) * 100vw); } }
section.about article:not(:last-child) { margin-bottom: calc((182 / var(--width)) * 100vw); }
@media (max-width: 750px) { section.about article:not(:last-child) { margin-bottom: calc((100 / 750) * 100vw); } }
section.about p.readtxt { color: #fff; font-size: 1.8rem; text-align: center; line-height: 2; max-width: 733px; margin: 0 auto calc((69 / var(--width)) * 100vw); }
@media (max-width: 750px) { section.about p.readtxt { font-size: 1.6rem; margin-bottom: calc((38 / 750) * 100vw); } }

ol.prize { list-style: none; }
@media screen and (min-width: 750px), print { ol.prize { display: flex; align-items: flex-start; justify-content: center; margin-bottom: calc((28 / var(--width)) * 100vw); } }
@media screen and (min-width: 750px), print { ol.prize li { width: calc((334 / 1200) * 100vw); max-width: 334px; flex-shrink: 0; } }
@media (max-width: 750px) { ol.prize li { width: calc((464 / 750) * 100vw); max-width: 464px; margin: auto; }
  ol.prize li:not(:last-child) { margin-bottom: calc((24 / 750) * 100vw); } }

ol.prize + div:has(a.btn) { margin-top: calc((48 / var(--width)) * 100vw); }
@media (max-width: 750px) { ol.prize + div:has(a.btn) { margin-top: calc((56 / 750) * 100vw); } }

/* SCHEDULE */
#schedule figure.img_youkou { height: auto; max-width: 1000px; margin: 0 auto calc((31 / var(--width)) * 100vw); }
@media (max-width: 750px) { #schedule figure.img_youkou { width: 110%; margin: 0 -5% calc((37 / 750) * 100vw); } }

/* HOWTO */
#howto .box { margin-bottom: calc((75 / var(--width)) * 100vw); }
@media (max-width: 750px) { #howto .box { width: 100%; margin: 0 auto calc((48 / 1200) * 100vw); } }
#howto .box.col2 { display: flex; align-items: flex-end; justify-content: center; }
@media (max-width: 750px) { #howto .box.col2 { flex-wrap: wrap; } }
@media (max-width: 750px) { #howto .box.col2 > div { flex-shrink: 0; width: 100%; } }
#howto .box .howto_img { max-width: 478px; height: auto; /*@media screen and (min-width: 750px), print {  width: calc((478 / var(--width)) * 100vw);
}*/ }
#howto .follow { text-align: center; }
#howto .follow p { /*width: calc((698 / var(--width)) * 100vw);*/ height: auto; max-width: 698px; margin: 0 auto calc((10 / var(--width)) * 100vw); }
@media (max-width: 750px) { #howto .follow p { width: calc((522 / 750) * 100vw); height: auto; max-width: 522px; margin: 0 auto calc((30 / 750) * 100vw); } }

.btns__area { text-align: center; }

.zerokun__anm02 { width: calc((430 / 1200) * 100vw); height: calc((389 / 1200) * 100vw); max-width: 430px; max-height: 389px; position: relative; pointer-events: none; }
@media (max-width: 750px) { .zerokun__anm02 { order: 2; width: calc((470 / 750) * 100vw); height: calc((389 / 750) * 100vw); max-width: 470px; margin: 0 auto; } }
.zerokun__anm02 .zerokun02 { width: calc((405 / 1200) * 100vw); height: calc((389 / 1200) * 100vw); max-width: 405px; max-height: 389px; position: relative; margin: auto; }
@media (max-width: 750px) { .zerokun__anm02 .zerokun02 { width: calc((405 / 750) * 100vw); height: calc((389 / 750) * 100vw); } }
.zerokun__anm02 .zerokun02 img { width: 100%; height: auto; object-fit: contain; vertical-align: bottom; position: absolute; bottom: 0; right: 0; transition: all ease .3s; }
.zerokun__anm02 .zerokun02 img:first-child { animation: frame01_02 infinite steps(1, end) 3s; }
.zerokun__anm02 .zerokun02 img:nth-child(2) { animation: frame02_02 infinite steps(1, end) 3s; }
.zerokun__anm02 .zerokun02 img:nth-child(3) { animation: frame03_02 infinite steps(1, end) 3s; }
.zerokun__anm02 .serihu02 { display: block; width: calc((138 / 1200) * 100vw); height: calc((49 / 1200) * 100vw); max-width: 138px; max-height: 49px; position: absolute; left: calc((-26 / var(--width)) * 100vw); top: calc((90 / var(--width)) * 100vw); max-width: 138px; }
@media (max-width: 750px) { .zerokun__anm02 .serihu02 { width: calc((191 / 750) * 100vw); height: calc((67 / 750) * 100vw); max-width: 191px; left: calc((3 / 750) * 100vw); top: calc((82 / 750) * 100vw); } }
.zerokun__anm02 .serihu02 img { width: 100%; height: auto; }

@keyframes frame01_02 { 0% { opacity: 1; }
  25% { opacity: 0; }
  50% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes frame02_02 { 0% { opacity: 0; }
  25% { opacity: 1; }
  50% { opacity: 0; }
  100% { opacity: 0; } }
@keyframes frame03_02 { 0% { opacity: 0; }
  25% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; } }
/* PRIZE */
#prize { background-color: #ffd42c; padding-top: calc((124 / var(--width)) * 100vw); padding-bottom: calc((186 / var(--width)) * 100vw); position: relative; z-index: 1; }
@media (max-width: 750px) { #prize { padding-top: calc((48 / 750) * 100vw); padding-bottom: calc((48 / 750) * 100vw); } }
#prize::before, #prize::after { content: ''; display: block; width: 100%; height: calc((64 / var(--width)) * 100vw); position: absolute; left: 0; z-index: -1; }
#prize::before { background: url("../img/wave_top_y.svg") left bottom repeat-x; background-size: calc((280 / var(--width)) * 100vw) calc((64 / var(--width)) * 100vw); top: calc((-62 / var(--width)) * 100vw); }
#prize::after { background: url("../img/wave_bottom_y.svg") left top repeat-x; background-size: calc((280 / var(--width)) * 100vw) calc((64 / var(--width)) * 100vw); bottom: calc((-62 / var(--width)) * 100vw); }
#prize ol { list-style: none; max-width: 1000px; margin-inline: auto; }
#prize ol li img { width: 100%; height: auto; }
#prize ol li:not(:last-child) { margin-bottom: calc((48 / var(--width)) * 100vw); }

/* ABOUT net0 */
#about-net0 { background-color: #fff; padding-top: calc((194 / var(--width)) * 100vw); padding-bottom: calc((166 / var(--width)) * 100vw); }
@media (max-width: 750px) { #about-net0 { padding-top: calc(((58 + 64) / 750) * 100vw); padding-bottom: calc((138 / 750) * 100vw); } }
#about-net0 .inner { text-align: center; max-width: 720px; margin: auto; }
#about-net0 .logo__netzero { width: calc((683 / var(--width)) * 100vw); max-width: 683px; height: auto; margin: 0 auto calc((90 / var(--width)) * 100vw); }
@media (max-width: 750px) { #about-net0 .logo__netzero { width: 100%; margin-bottom: calc((105 / 750) * 100vw); } }
#about-net0 h4 { font-size: 2.6rem; font-weight: bold; line-height: 1.7; margin-bottom: calc((58 / var(--width)) * 100vw); }
@media (max-width: 750px) { #about-net0 h4 { font-size: 1.8rem; } }
#about-net0 p { font-size: 1.7rem; line-height: 2.17; }
#about-net0 p:not(:last-child) { margin-bottom: min(calc((55 / 750) * 100vw), 55px); }
@media (max-width: 750px) { #about-net0 p { font-size: 1.6rem; } }
#about-net0 .btn { margin-bottom: min(calc((79 / var(--width)) * 100vw), 79px); }

/* FOOTER */
.footer { background-color: var(--green); padding-bottom: calc((48 / var(--width)) * 100vw); }
.footer .inner { max-width: 783px; }
.footer .ttl { transform: translateY(-50%); margin-bottom: 0; }
.footer .ttl + p { color: #fff; font-size: 1.7rem; text-align: center; margin-bottom: calc((42 / var(--width)) * 100vw); }
@media (max-width: 750px) { .footer .ttl + p { font-size: 1.6rem; } }
.footer p.copy { font-size: 1.5rem; color: #fff; text-align: center; margin-top: min(calc((36 / var(--width)) * 100vw), 36px); }
@media (max-width: 750px) { .footer p.copy { font-size: 1.3rem; } }

.contacts { background-color: #fff; border-radius: calc((32 / var(--width)) * 100vw); padding: calc((30 / var(--width)) * 100vw) calc((30 / var(--width)) * 100vw) calc((38 / var(--width)) * 100vw); margin-bottom: calc((47 / var(--width)) * 100vw); }
.contacts p { font-size: 2rem; line-height: 1.5; text-align: center; margin-bottom: min(calc((44 / var(--width)) * 100vw), 44px); }
@media (max-width: 750px) { .contacts p { font-size: 1.7rem; } }
.contacts dl.contact { max-width: 600px; margin: auto; }
@media screen and (min-width: 751px), print { .contacts dl.contact div { display: grid; grid-template-columns: 1fr 1fr; } }
.contacts dl.contact div:not(:last-child) { margin-bottom: calc((38 / var(--width)) * 100vw); }
.contacts dl.contact dt { font-size: 1.7rem; }
@media (max-width: 750px) { .contacts dl.contact dt { font-size: 1.6rem; } }
.contacts dl.contact dt span { vertical-align: middle; }
.contacts dl.contact dd small { font-size: 1.4rem; }
@media (max-width: 750px) { .contacts dl.contact dd small { font-size: 1.3rem; } }
.contacts i.icon--email { display: inline-block; vertical-align: middle; width: calc((30 / var(--width)) * 100vw); height: calc((20 / var(--width)) * 100vw); max-width: 30px; max-height: 20px; margin-right: calc((22 / var(--width)) * 100vw); }
.contacts i.icon--tel { display: inline-block; vertical-align: middle; width: calc((25 / var(--width)) * 100vw); height: calc((25 / var(--width)) * 100vw); max-width: 25px; max-height: 25px; margin-right: calc((22 / var(--width)) * 100vw); }
.contacts span.txt-email { color: var(--green); font-size: 1.6rem; line-height: 1.3; }
@media (max-width: 750px) { .contacts span.txt-email { font-size: 1.6rem; } }
.contacts span.txt-tel { color: var(--green); font-size: 2.6rem; }
@media (max-width: 750px) { .contacts span.txt-tel { font-size: 2.4rem; } }

.btn--privacy { display: block; color: var(--green); font-size: 1.5rem; text-align: center; background-color: #ffd42c; border-radius: calc((24 / var(--width)) * 100vw); padding: calc((13 / var(--width)) * 100vw); max-width: 250px; margin: auto; transition: background ease .3s; }
@media (max-width: 750px) { .btn--privacy { border-radius: calc((32 / 750) * 100vw); } }
.btn--privacy:hover { background-color: var(--black); }

/* ANIMATION */
.up { opacity: 0; transform: translateY(30px); }

.up--active { animation: fadeUP 0.75s forwards; opacity: 0; }

@keyframes fadeUP { from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); } }
.delay1 { animation-delay: 0.1s; }

.delay2 { animation-delay: 0.2s; }

.delay3 { animation-delay: 0.3s; }

.delay4 { animation-delay: 0.4s; }