@charset 'UTF-8';
/*
Theme Name: GRATES 10
Version: 4.1
Author: GRATES
Description: 2025, GRATES
*/

* {
 padding: 0;
 margin: 0;
 border: none;
 box-sizing: border-box;
 outline: none; 
 font-weight: normal;
 font-style: normal;
}
html {
 overflow: auto;
 width: 100％;
 font-size: 62.5%;
 line-height: 1;
}
body {
 position: relative;
 display: flex; /* フッターを下部に固定 1/4 */
 flex-direction: column; /* フッターを下部に固定 2/4  */
 min-height: 100vh; /* フッターを下部に固定 3/4  */
 width: 100%; 
 height: 100%;
 font-family: helvetica, arial, sans-serif, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック";
 color: #103;
 background-color: #eee;
 -webkit-text-size-adjust: 100%; /*iPhoneの文字が大きくなるバグ対策*/
}
footer {
 margin-top: auto; /*  フッターを下部に固定 4/4  */
}
article,section,footer {
 display: block;
}
h2 {
 margin-bottom: 64px;
 font-size: 3.2rem;
 text-align: center;
 font-weight: bold;
}
p, h6, li {
 font-size: 2.0rem;
 line-height: 1.8;
}
a:link,
a:visited,
a:active {
 color: #103;
}
a:hover {
 transition: 0.5s;
}
svg.fillDrkPpl {
 fill: #103;
}
/* ---------------- media screen ---------------- */
@media screen and (max-width: 480px) {
 h2 {
  margin-bottom: 10%;
  font-size: 2.4rem;
 }
 p, h6, li {
  font-size: 1.6rem;
 }
}
/* -------------- media screen end -------------- */



/* --------------------------- */
/*  Loader  */
/* --------------------------- */

#loader {
 position: fixed;
 z-index: 100;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: rgba(255,255,255,1.0);
}
#loader div {
 position: absolute;
 z-index: 101;
 top: 50%;
 left: 50%;
 width: 200px;
 height: 200px;
 margin-top: -100px;
 margin-left: -100px;
 text-align: center;
}
#loader div img {
 width: 75%;
 height: auto;
}
#loader div p {
 margin-top: 16px;
 font-size: 1.6rem;
}



/* --------------------------- */
/*  article  */
/* --------------------------- */

article {
 width: 100%;
}
section {
 width: 90%; 
 max-width: 640px;
 margin: 120px auto;
}
section.topWrap {
 text-align: center;
}

/*  footer  */
footer p {
 margin: 0 auto 32px;
 width: 100%;
 font-size: 1.2rem;
 text-align: center;
}
footer a {
 text-decoration: underline;
}
footer svg {
 display: block;
 width: 200px;
 aspect-ratio: 19 / 4;
 margin: 0 auto 16px;
}
/* ---------------- media screen ---------------- */
@media screen and (max-width: 480px) {
 section {
  margin: 20% auto;
  }
 section.topWrap {
  text-align: left;
 }

 /*  footer  */
 footer p {
  margin: 0 auto 5%;
 }
}
/* -------------- media screen end -------------- */



/* --------------------------- */
/*  policy  */
/* --------------------------- */

h6 {
 margin-top: 40px;
 font-weight: bold;
}
ul {
 margin-bottom: 40px;
}
ul li {
 margin-left: 1.4em;
 text-indent: -1.2em;
 list-style-type: disc !important;
 list-style-position: inside !important;
}

/* ---------------- media screen ---------------- */
@media screen and (max-width: 480px) {
 h6 {
  margin-top: 10%;
 }
}
/* -------------- media screen end -------------- */



/* ----- reCAPTCHA ----- */
.grecaptcha-badge {
 visibility: hidden;
}