@charset "utf-8";
/* font-family
============================ */

@font-face {
 font-family: "Yu Gothic";
 src: local("Yu Gothic Medium"), local("YuGothic-Medium");
}

@font-face {
 font-family: "Yu Gothic";
 src: local("Yu Gothic Bold"), local("YuGothic-Bold");
 font-weight: bold;
}

/* selector
============================ */

* {}

html {
 font-size: 100%;
}

@media (min-width: 1000px) and (max-width: 1250px) {
 html {
  font-size: calc((100vw - 1000px) / 250 * 1 + 15px);
 }
}

@media (max-width: 1000px) {
 html {
  font-size: 15px;
 }
}

@media (max-width: 767px) {
 html {
  font-size: calc((100vw - 320px) / 55 * 0.5 + 15.5px);
 }
}

body {
 color: var(--color__txt) !important;
 font-family: var(--font-family__base) !important;
 word-break: break-all;
 /* text-align: justify; */
 letter-spacing: .1em;
 }

h1, h2, h3, h4, h5 {}

ul {
 list-style: none;
}

p {
 font-size: 16px;
 line-height: 1.75;
}

a {
 color: var(--color__txt);
}

p a {
 font-weight: bold;
 text-decoration: underline;
}


a>* {}

a img {
 transition: all 0.6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
}

a img:hover {
/*  opacity: .7; */
}

em {
 font-style: normal;
 font-weight: bold;
}

img {
 vertical-align: middle;
 max-width: 100%;
 /* width: 100%; */
}

picture {
 display: block;
 line-height: 0;
 font-size: 0;
}

picture>img {
 font-size: 0px;
 font-size: 0rem;
}

::placeholder {
 color: rgba(0, 0, 0, .2);
}

*:focus {
 outline: none;
}

form input, form textarea {
 /* -webkit-appearance: none; */
}

/* Modifier
============================ */

.is-show {
 opacity: 1 !important;
}

.is-hide {
 opacity: 0 !important;
}

@media (min-width: 768px) {
 .pc {
  display: block;
 }

 .pc--inline {
  display: inline;
 }

 .sp {
  display: none !important;
 }

 .sp--inline {
  display: none !important;
 }
}

@media (max-width: 767px) {
 .pc {
  display: none !important;
 }

 .pc--inline {
  display: none !important;
 }

 .sp {
  display: block;
 }

 .sp--inline {
  display: inline;
 }
}

/*===========================================
 sp
========================================== */

@media (max-width: 767px) {
 p {
  line-height: 1.85;
  font-size: 14px;
  /* color: #444; */
 }
}