@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  -webkit-text-size-adjust: 100%; }

main {
  display: block; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

pre {
  font-family: monospace, monospace;
  font-size: 1em; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted; }

b,
strong {
  font-weight: bolder; }

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  padding: 0.35em 0.75em 0.625em; }

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

progress {
  vertical-align: baseline; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

details {
  display: block; }

summary {
  display: list-item; }

/* ----------base---------- */
html {
  margin: 0;
  padding: 0; }

body {
  margin: 0;
  padding: 0;
  color: #1A1C1E;
  font-size: 16px;
  font-family: -apple-system, blinkMacSystemFont, Meiryo, "Segoe UI", "Hiragino Kaku Gothic ProN", YuGothicM, YuGothic, sans-serif;
  line-height: 1.5;
  background: #ffffff; }

a {
  color: #1D6194;
  transition: 0.2s; }

a:hover {
  opacity: 0.7;
  text-decoration: none; }

footer, header, nav, picture {
  display: block; }

dd, dl, dt, li, ol, ul {
  margin: 0;
  padding: 0;
  list-style-type: none; }

img {
  line-height: 0;
  max-width: 100%; }

p {
  margin: 0; }

.u-pc {
  display: none; }
  @media screen and (min-width: 600px) {
    .u-pc {
      display: block; } }

.u-sp {
  display: block; }
  @media screen and (min-width: 600px) {
    .u-sp {
      display: none !important; } }

.list-disc li {
  list-style: disc;
  margin-left: 1.5em;
  margin-bottom: 5px; }

.list-nomark li {
  list-style: none; }

/* ----------misc.---------- */
.clear {
  zoom: 1; }

.clear:after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  content: ''; }

.is-hidden {
  display: none; }

.is-serif {
  font-family: "Noto Serif JP", Times New Roman, "HG明朝B", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  vertical-align: text-bottom; }

.sp-inner {
  margin: 0 auto;
  padding: 0 16px;
  width: min(100%,980px);
  box-sizing: border-box; }
  @media screen and (min-width: 1025px) {
    .sp-inner {
      padding: 0; } }

#header {
  padding: 10px 0;
  border-bottom: 1px solid #DCDEE1; }

.header-inner {
  margin: 0 auto;
  width: min(95%,100%); }

.header-logo-horizon {
  width: min(50%,200px);
  margin-right: auto; }

.header-nav {
  display: flex;
  align-items: center;
  justify-content: space-between; }

.header-nav li:last-child {
  margin-left: 10px; }

.hdr-btn {
  padding: 16px;
  position: relative;
  display: inline-block;
  outline: none;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border-radius: 4px;
  box-sizing: border-box;
  transition: all .25s;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .hdr-btn {
      width: auto; } }

#footer {
  margin-top: 30px;
  padding: 8px;
  box-sizing: border-box;
  background: #1A1C1E; }

#footer .copyright {
  text-align: center;
  color: #fff;
  font-size: 14px; }

.btn_pagetop {
  position: fixed;
  right: 16px;
  bottom: 16px; }

.btn_pagetop a {
  width: 48px;
  height: 48px;
  display: block; }

.btn_pagetop a img {
  width: 48px;
  height: 48px; }

[class*="sec-"] {
  margin: 30px 0;
  padding: 30px 0; }

.sentence {
  margin: 0 auto;
  width: min(85%,900px); }

.section-title {
  font-size: clamp(20px, 4.167vw, 30px);
  text-align: center;
  color: #103957; }

.section-title::after {
  display: block;
  margin: 10px auto 30px;
  content: "";
  width: 200px;
  height: 2px;
  background: #103957; }

.sec-main {
  position: relative;
  margin: 0;
  padding: 0;
  background: #ECF1F8;
  background-size: contain;
  color: #103957; }

.main-inner {
  margin: 0 auto;
  width: min(90%,900px); }

.mainvisual-note {
  padding-bottom: 10px;
  font-size: 12px;
  color: #51606F; }
  @media screen and (min-width: 600px) {
    .mainvisual-note {
      font-size: 14px; } }

.lead-text {
  margin-bottom: 20px;
  font-size: clamp(16px, 3.333vw, 18px);
  text-align: justify; }
  @media screen and (min-width: 600px) {
    .lead-text {
      text-align: center; } }

.lead-image {
  margin: 40px 0 32px; }
  @media screen and (min-width: 600px) {
    .lead-image {
      margin: 40px auto 32px;
      width: 80%; } }

.sec-lead .btnarea .btn-hosyo {
  margin-bottom: 10px; }

.sec-policy .btnarea a {
  margin-bottom: 10px; }

@media screen and (min-width: 600px) {
  .btnarea {
    text-align: center; } }

.c-btn {
  padding: 16px;
  position: relative;
  display: inline-block;
  outline: none;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border-radius: 100px;
  box-sizing: border-box;
  transition: all .25s;
  width: 100%; }
  @media screen and (min-width: 600px) {
    .c-btn {
      width: 334px; } }

.btn-regist {
  cursor: pointer;
  background: #103957;
  color: #FFF; }
  @media (hover: hover) {
    .btn-regist:hover {
      background: #081d2c;
      color: #FFF; } }

.btn-hosyo {
  background: #ECF1F8;
  cursor: pointer; }
  @media (hover: hover) {
    .btn-hosyo:hover {
      background: #b4c8e3; } }

.btn-login {
  cursor: pointer;
  background: transparent;
  border: 1px solid #72777F;
  color: #103957; }
  @media (hover: hover) {
    .btn-login:hover {
      background: rgba(114, 119, 127, 0.1); } }

.btn-request {
  cursor: pointer;
  background: transparent;
  border: 1px solid #72777F;
  color: #103957; }
  @media (hover: hover) {
    .btn-request:hover {
      background: rgba(114, 119, 127, 0.1); } }

.btn-contact {
  cursor: pointer;
  background: #103957;
  color: #FFF;
  max-width: 100%; }
  @media (hover: hover) {
    .btn-contact:hover {
      background: #081d2c;
      color: #FFF; } }

.btn-noregist {
  background: #ECF1F8;
  cursor: pointer; }
  @media (hover: hover) {
    .btn-noregist:hover {
      background: #b4c8e3; } }

/* material icon */
.material-symbols-outlined {
  font-size: inherit !important;
  vertical-align: -3px; }

/* sec-main */
.sec-main h1 {
  margin: 0; }

/* sec-howto_step */
.howto-text {
  text-align: center; }

.sec-howto_step .lead-text {
  font-weight: bold; }

.sec-howto_step .btnarea .btn-regist {
  margin-bottom: 10px; }

.required-note {
  margin-top: 20px;
  font-size: 14px; }

/* 3STEP */
.step_boxs {
  display: flex;
  flex-wrap: wrap; }

.step_boxs li {
  position: relative;
  margin: 40px 10px;
  padding: 24px 8px 8px;
  width: 100%;
  border-width: 2px;
  border-style: solid;
  border-radius: 10px;
  box-sizing: border-box; }
  @media screen and (min-width: 600px) {
    .step_boxs li {
      margin: 40px 20px;
      width: calc((100% - 20px*6) / 3); } }

.step_boxs li img {
  display: block;
  margin: 25px auto 0;
  width: 20%; }
  @media screen and (min-width: 600px) {
    .step_boxs li img {
      width: 40%; } }

.step_box_num {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -30px;
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 50px;
  text-align: center;
  color: #ffffff;
  font-size: 27px;
  font-weight: 700;
  font-family: "Noto Serif JP", Times New Roman, "HG明朝B", "ＭＳ Ｐ明朝", "MS PMincho", serif; }

.step_box_title {
  text-align: center; }

.howto_notice {
  margin-bottom: 30px;
  font-size: 14px; }

.howto_notice ul li {
  margin-bottom: 8px; }

.step_box_arrow {
  width: 0;
  height: 0;
  position: absolute; }
  @media screen and (max-width: 599px) {
    .step_box_arrow {
      bottom: -37px;
      right: 50%;
      transform: translateX(50%); } }
  @media screen and (min-width: 600px) {
    .step_box_arrow {
      top: 50%;
      transform: translateY(-50%);
      right: -27px; } }

.step_box01 {
  border-color: #417ca7; }
  .step_box01 .step_box_num {
    background: #417ca7; }
  @media screen and (max-width: 599px) {
    .step_box01 .step_box_arrow {
      border-left: 20px solid transparent;
      border-right: 20px solid transparent;
      border-top: 15px solid #417ca7; } }
  @media screen and (min-width: 600px) {
    .step_box01 .step_box_arrow {
      border-left: 10px solid #417ca7;
      border-top: 15px solid transparent;
      border-bottom: 15px solid transparent; } }

.step_box02 {
  border-color: #41a79a; }
  .step_box02 .step_box_num {
    background: #41a79a; }
  @media screen and (max-width: 599px) {
    .step_box02 .step_box_arrow {
      border-left: 20px solid transparent;
      border-right: 20px solid transparent;
      border-top: 15px solid #41a79a; } }
  @media screen and (min-width: 600px) {
    .step_box02 .step_box_arrow {
      border-left: 10px solid #41a79a;
      border-top: 15px solid transparent;
      border-bottom: 15px solid transparent; } }

.step_box03 {
  border-color: #f5961b; }
  .step_box03 .step_box_num {
    background: #f5961b; }

/* 3STEP */
/* 会員・製品登録の必要事項 */
/* sec-notice */
.sec-notice ul {
  font-size: 14px; }

.list-child li {
  list-style: none;
  margin-left: 0;
  text-indent: -2.5em;
  padding-left: 2.5em; }

/* sec-contact */
.sec-contact {
  background: url("../img/contact-background.jpg") no-repeat;
  background-size: cover; }
  @media screen and (min-width: 600px) {
    .sec-contact {
      background-position: center bottom 30%; } }

.sec-contact .section-title {
  color: #fff; }
  .sec-contact .section-title::after {
    background: transparent; }

.contact-box {
  margin: 0 auto;
  padding: 30px 10px;
  background: #fff;
  box-sizing: border-box; }
  @media screen and (min-width: 600px) {
    .contact-box {
      width: 50%; } }

.contact-box p {
  margin-bottom: 30px; }

/* sec-banner_area */
.banner_area-inner {
  text-align: center; }

/* sec-policy */
.sec-policy {
  margin: 0; }

.b-pc-wrapper-body-box {
  height: 200px;
  border: 1px solid #72777F;
  overflow: auto;
  font-size: 14px; }
  @media screen and (min-width: 600px) {
    .b-pc-wrapper-body-box {
      height: 300px; } }

.member-policy-title {
  margin-top: 0;
  font-size: 18px;
  color: #103957; }

.u-r {
  text-align: right; }
