@font-face {
  font-family: 'Kosugi Maru', sans-serif;
  font-style: normal;
  font-weight: 400;
  display: swap;
  src: local("Arial Black"), url("ariblk_0.ttf") format("ttf");
}
html {
  font-size: 62.5%;
  min-height: 100%;
  overflow-y: scroll;
  background: #fff;
}
@media (max-width: 480px) {
  html {
    width: 100%;
    height: 100%;
  }
}
html img {
  width: 100%;
  display: block;
}
html body,
html dd,
html div,
html dl,
html dt,
html fieldset,
html form,
html h1,
html h2,
html h3,
html h4,
html h5,
html h6,
html input,
html li,
html ol,
html p,
html td,
html textarea,
html th,
html ul {
  padding: 0;
  margin: 0;
}
html article,
html aside,
html details,
html figcaption,
html figure,
html footer,
html header,
html hgroup,
html menu,
html nav,
html section {
  display: block;
  padding: 0;
  margin: 0;
}
html address,
html caption,
html em,
html strong,
html th {
  font-style: normal;
}
html caption,
html th {
  text-align: left;
}
html hr,
html legend {
  display: none;
}
html h1,
html h2,
html h3,
html h4,
html h5,
html h6 {
  font-size: 100%;
}
html ol,
html ul {
  list-style: none;
}
html a img,
html fieldset {
  border: none;
}
html a:visited {
  text-decoration: none;
}
html p {
  margin-bottom: 12px;
}
html * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
html blockquote,
html dl,
html ol,
html pre,
html table,
html ul {
  margin-bottom: 0;
}
html table {
  border-collapse: collapse;
  border-spacing: 0;
}

body {
  position: relative;
  color: #343434;
  font-size: 1.5em;
  font-family: 'Kosugi Maru', sans-serif;
  -webkit-text-size-adjust: none;
  letter-spacing: 0;
  line-height: 1.8;
  height: 100vh;
}
@media (max-width: 480px) {
  body {
    position: relative;
    width: 100%;
    min-width: 100%;
    font-size: 1.2987012987vw;
    -webkit-overflow-scrolling: touch;
  }
}

.loader {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 100;
}
.loader::after {
  position: fixed;
  content: " ";
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background-color: #fff;
}

.breeding-rhombus-spinner {
  height: 65px;
  width: 65px;
  position: relative;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  z-index: 1000;
}
.breeding-rhombus-spinner .rhombus {
  height: calc(65px / 7.5);
  width: calc(65px / 7.5);
  -webkit-animation-duration: 2000ms;
          animation-duration: 2000ms;
  top: calc(65px / 2.3077);
  left: calc(65px / 2.3077);
  background-color: #ff1d5e;
  position: absolute;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.breeding-rhombus-spinner .rhombus:nth-child(2n+0) {
  margin-right: 0;
}
.breeding-rhombus-spinner .rhombus.child-1 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-1;
          animation-name: breeding-rhombus-spinner-animation-child-1;
  -webkit-animation-delay: calc(100ms * 1);
          animation-delay: calc(100ms * 1);
  background-color: #ff1db0;
}
.breeding-rhombus-spinner .rhombus.child-2 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-2;
          animation-name: breeding-rhombus-spinner-animation-child-2;
  -webkit-animation-delay: calc(100ms * 2);
          animation-delay: calc(100ms * 2);
  background-color: #d61dff;
}
.breeding-rhombus-spinner .rhombus.child-3 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-3;
          animation-name: breeding-rhombus-spinner-animation-child-3;
  -webkit-animation-delay: calc(100ms * 3);
          animation-delay: calc(100ms * 3);
  background-color: #651dff;
}
.breeding-rhombus-spinner .rhombus.child-4 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-4;
          animation-name: breeding-rhombus-spinner-animation-child-4;
  -webkit-animation-delay: calc(100ms * 4);
          animation-delay: calc(100ms * 4);
  background-color: #341dff;
}
.breeding-rhombus-spinner .rhombus.child-5 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-5;
          animation-name: breeding-rhombus-spinner-animation-child-5;
  -webkit-animation-delay: calc(100ms * 5);
          animation-delay: calc(100ms * 5);
  background-color: #1de1ff;
}
.breeding-rhombus-spinner .rhombus.child-6 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-6;
          animation-name: breeding-rhombus-spinner-animation-child-6;
  -webkit-animation-delay: calc(100ms * 6);
          animation-delay: calc(100ms * 6);
  background-color: #1dff87;
}
.breeding-rhombus-spinner .rhombus.child-7 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-7;
          animation-name: breeding-rhombus-spinner-animation-child-7;
  -webkit-animation-delay: calc(100ms * 7);
          animation-delay: calc(100ms * 7);
  background-color: #a8ff1d;
}
.breeding-rhombus-spinner .rhombus.child-8 {
  -webkit-animation-name: breeding-rhombus-spinner-animation-child-8;
          animation-name: breeding-rhombus-spinner-animation-child-8;
  -webkit-animation-delay: calc(100ms * 8);
          animation-delay: calc(100ms * 8);
  background-color: #ffa51d;
}
.breeding-rhombus-spinner .rhombus.big {
  height: calc(65px / 3);
  width: calc(65px / 3);
  -webkit-animation-duration: 2000ms;
          animation-duration: 2000ms;
  top: calc(65px / 3);
  left: calc(65px / 3);
  color: #fff;
  background-color: #ff1d5e;
  -webkit-animation: breeding-rhombus-spinner-animation-child-big 2s infinite;
          animation: breeding-rhombus-spinner-animation-child-big 2s infinite;
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.breeding-rhombus-spinner .rhombus.big .spell {
  font-size: 2.6rem;
  font-weight: bold;
  display: block;
  position: absolute;
  bottom: -14px;
  left: -2px;
}
@media (max-width: 480px) {
  .breeding-rhombus-spinner .rhombus.big .spell {
    font-size: 5.8441558442vw;
    bottom: -2.8571428571vw;
    left: -0.5194805195vw;
  }
}

@-webkit-keyframes breeding-rhombus-spinner-animation-child-1 {
  50% {
    -webkit-transform: translate(-325%, -325%);
            transform: translate(-325%, -325%);
  }
}

@keyframes breeding-rhombus-spinner-animation-child-1 {
  50% {
    -webkit-transform: translate(-325%, -325%);
            transform: translate(-325%, -325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-2 {
  50% {
    -webkit-transform: translate(0, -325%);
            transform: translate(0, -325%);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-2 {
  50% {
    -webkit-transform: translate(0, -325%);
            transform: translate(0, -325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-3 {
  50% {
    -webkit-transform: translate(325%, -325%);
            transform: translate(325%, -325%);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-3 {
  50% {
    -webkit-transform: translate(325%, -325%);
            transform: translate(325%, -325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-4 {
  50% {
    -webkit-transform: translate(325%, 0);
            transform: translate(325%, 0);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-4 {
  50% {
    -webkit-transform: translate(325%, 0);
            transform: translate(325%, 0);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-5 {
  50% {
    -webkit-transform: translate(325%, 325%);
            transform: translate(325%, 325%);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-5 {
  50% {
    -webkit-transform: translate(325%, 325%);
            transform: translate(325%, 325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-6 {
  50% {
    -webkit-transform: translate(0, 325%);
            transform: translate(0, 325%);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-6 {
  50% {
    -webkit-transform: translate(0, 325%);
            transform: translate(0, 325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-7 {
  50% {
    -webkit-transform: translate(-325%, 325%);
            transform: translate(-325%, 325%);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-7 {
  50% {
    -webkit-transform: translate(-325%, 325%);
            transform: translate(-325%, 325%);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-8 {
  50% {
    -webkit-transform: translate(-325%, 0);
            transform: translate(-325%, 0);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-8 {
  50% {
    -webkit-transform: translate(-325%, 0);
            transform: translate(-325%, 0);
  }
}
@-webkit-keyframes breeding-rhombus-spinner-animation-child-big {
  50% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
}
@keyframes breeding-rhombus-spinner-animation-child-big {
  50% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
}
 /*============================
.header
============================*/
.header {
  padding: 15px 15px 2px;
  border-bottom: 1px solid #a1a1a1;
}
@media (max-width: 480px) {
  .header {
    padding: 2.5974025974vw 3.8961038961vw;
    border-width: 0.1298701299vw;
  }
}
.header .company-head {
  padding: 0 0 10px;
  margin-bottom: 15px;
  border-bottom: 1px solid #e4e4e4;
}
@media (max-width: 480px) {
  .header .company-head {
    display: none;
  }
}
.header .company-head__in {
  max-width: 1200px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin: 0 auto;
}
.header .company-logo {
  width: 84px;
  -webkit-transition: opacity .2s;
  transition: opacity .2s;
}
.header .company-logo:hover {
  opacity: 0.7;
}
.header .header__in {
  max-width: 1200px;
  min-width: 1020px;
  margin: 0 auto 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 480px) {
  .header .header__in {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    margin-bottom: 1.2987012987vw;
  }
}
.header .header-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 480px) {
  .header .header-left {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    padding-top: 0.6493506494vw;
  }
}
.header .header-logo {
  width: 120px;
  margin-right: 20px;
}
@media (max-width: 480px) {
  .header .header-logo {
    width: 19.4805194805vw;
    margin-right: 1.9480519481vw;
  }
}
.header .header-jpx {
  width: 80px;
  margin-right: 15px;
}
@media (max-width: 480px) {
  .header .header-jpx {
    width: 15.5844155844vw;
    margin-right: 1.2987012987vw;
  }
}
.header .header-txt {
  font-size: 1.2rem;
  color: #aaa;
  line-height: 1.5;
}
@media (max-width: 480px) {
  .header .header-txt {
    width: 100%;
    font-size: 1.9480519481vw;
    padding-top: 1.2987012987vw;
    line-height: 1.2;
  }
}
.header .header-right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 480px) {
  .header .header-right {
    display: none;
  }
}
.header .header-tel {
  width: 200px;
  margin-left: 20px;
}
.header .header-btn {
  width: 210px;
}
.header .header-link {
  position: relative;
  display: block;
  font-size: 1.6rem;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  background-color: #32b16c;
  border-radius: 18.5px;
  padding: 5px 0 5px 28px;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
}
.header .header-link::before {
  position: absolute;
  content: " ";
  background-image: url(../images/ico_02.svg);
  background-repeat: no-repeat;
  background-size: contain;
  width: 14px;
  height: 21px;
  left: 23px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media (max-width: 1020px) {
  .header .header-link:hover {
    opacity: 0.7;
  }
}

.contents-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-weight: bold;
  line-height: 1;
  padding: 70px 0;
}
@media (max-width: 480px) {
  .contents-header {
    padding: 9.0909090909vw 0 16.8831168831vw;
  }
}
.contents-header .contents-header__sub {
  font-size: 2rem;
  padding-bottom: 17px;
  margin-bottom: 17px;
  border-bottom: 1px solid #333;
  letter-spacing: 6px;
}
@media (max-width: 480px) {
  .contents-header .contents-header__sub {
    font-size: 3.1168831169vw;
    padding-bottom: 3.8961038961vw;
    margin-bottom: 3.8961038961vw;
    letter-spacing: 0.7792207792vw;
  }
}
.contents-header .contents-header__title {
  font-size: 3.3rem;
  font-weight: 600;
  color: #333;
  letter-spacing: 12px;
  line-height: 1.4;
}
@media (max-width: 480px) {
  .contents-header .contents-header__title {
    font-size: 4.5454545455vw;
    letter-spacing: 1.5584415584vw;
  }
}

 /*============================
.footer
============================*/
.footer {
  padding: 0 0 20px;
  background: #ffffff;
}
@media (max-width: 480px) {
  .footer {
    padding: 9.0909090909vw 0 2.5974025974vw;
  }
}
.footer .footer-navi {
  background-color: #333;
  padding: 70px 0 60px;
}
@media (max-width: 480px) {
  .footer .footer-navi {
    padding: 9.0909090909vw 1.2987012987vw 7.7922077922vw 5.1948051948vw;
  }
}
.footer .footer-navi__in {
  max-width: 1200px;
  min-width: 1020px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 480px) {
  .footer .footer-navi__in {
    max-width: 100%;
    min-width: 100%;
    display: block;
  }
}
.footer .footer-navi__ttl {
  width: 230px;
  color: #fff;
}
@media (max-width: 480px) {
  .footer .footer-navi__ttl {
    font-size: 3.6363636364vw;
    margin-bottom: 2.5974025974vw;
  }
}
.footer .footer-navi-list {
  width: 550px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media (max-width: 480px) {
  .footer .footer-navi-list {
    width: 100%;
  }
}
.footer .footer-navi-list__item {
  width: 33.33%;
  margin-bottom: 10px;
}
@media (max-width: 480px) {
  .footer .footer-navi-list__item {
    width: 38%;
    margin-bottom: 1.9480519481vw;
  }
}
@media (max-width: 480px) {
  .footer .footer-navi-list__item:not(:nth-child(3n)) {
    width: 31%;
  }
}
.footer .footer-navi-list__link {
  position: relative;
  font-size: 1.4rem;
  color: #fff;
  text-decoration: none;
  padding-left: 20px;
}
@media (max-width: 480px) {
  .footer .footer-navi-list__link {
    font-size: 2.5974025974vw;
    padding-left: 3.2467532468vw;
  }
}
.footer .footer-navi-list__link::before {
  position: absolute;
  content: " ";
  width: 5px;
  height: 1px;
  background-color: #fff;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media (max-width: 480px) {
  .footer .footer-navi-list__link::before {
    width: 0.6493506494vw;
  }
}
@media (max-width: 1020px) {
  .footer .footer-navi-list__link:hover {
    text-decoration: underline;
  }
}
.footer .footer-link {
  max-width: 1200px;
  min-width: 1020px;
  margin: 0 auto 30px;
  padding-top: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 480px) {
  .footer .footer-link {
    max-width: 100%;
    min-width: 100%;
    display: block;
    margin-bottom: 10.3896103896vw;
  }
}
.footer .footer-link__ttl {
  font-weight: bold;
  font-size: 2.2rem;
  color: #505050;
  line-height: 1.4;
}
@media (max-width: 480px) {
  .footer .footer-link__ttl {
    font-size: 4.2857142857vw;
    text-align: center;
    margin-bottom: 5.1948051948vw;
  }
}
.footer .footer-link-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 480px) {
  .footer .footer-link-list {
    display: block;
  }
}
.footer .footer-link-list__item:not(:last-child) {
  margin-right: 10px;
}
@media (max-width: 480px) {
  .footer .footer-link-list__item:not(:last-child) {
    margin-right: 0;
    margin-bottom: 1.9480519481vw;
  }
}
.footer .footer-link-list__set {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 240px;
  height: 50px;
  color: #fff;
  padding-left: 50px;
  border-radius: 60px;
  background-repeat: no-repeat;
  background-position: left 10px center;
  background-size: 33px auto;
  font-size: 1.7rem;
  font-weight: bold;
  position: relative;
  text-decoration: none;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  outline: none;
  letter-spacing: 1px;
}
@media (max-width: 480px) {
  .footer .footer-link-list__set {
    width: 68.8311688312vw;
    height: 11.6883116883vw;
    font-size: 3.8961038961vw;
    margin: 0 auto;
    padding-left: 14.2857142857vw;
    border-radius: 6.8831168831vw;
    background-size: 7.7922077922vw auto;
    background-position: left 3.8961038961vw center;
  }
}
.footer .footer-link-list__set.hikari {
  background-color: #004ea2;
  background-image: url(../images/footer_icon_03.png);
}
.footer .footer-link-list__set.denki {
  background-color: #ffcc00;
  background-image: url(../images/footer_icon_02.png);
  color: #004ea2;
}
.footer .footer-link-list__set.gas {
  background-color: #34b1e8;
  background-image: url(../images/footer_icon_01.png);
}
@media (max-width: 1020px) {
  .footer .footer-link-list__set:hover {
    opacity: .7;
  }
}
.footer .footer-link-list__set::before {
  content: "";
  background: url(../images/icon_popup_white.png) no-repeat center center/contain;
  width: 14px;
  height: 10px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 10px;
}
@media (max-width: 480px) {
  .footer .footer-link-list__set::before {
    width: 3.8961038961vw;
    height: 2.5974025974vw;
    right: 3.8961038961vw;
  }
}
.footer .footer__inner {
  width: 100%;
  max-width: 1200px;
  min-width: 1020px;
  margin: 0 auto;
  padding: 25px 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  border-top: 1px solid #cccccc;
}
@media (max-width: 480px) {
  .footer .footer__inner {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    display: block;
    padding: 6.4935064935vw 1.9480519481vw;
  }
}
.footer .footer__inner .footer-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer-left {
    margin-bottom: 5.1948051948vw;
    display: block;
  }
}
.footer .footer__inner .footer-logo {
  width: 125px;
  margin-right: 30px;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer-logo {
    width: 25.974025974vw;
    margin: 0 auto;
  }
}
.footer .footer__inner .footer-left-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 10px;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer-left-list {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.footer .footer__inner .footer-left-list__item:not(:last-child) {
  margin-right: 20px;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer-left-list__item:not(:last-child) {
    margin-right: 3.8961038961vw;
  }
}
.footer .footer__inner .footer-left-list__item a {
  font-size: 1.4rem;
  color: #34495e;
  padding: 0 16px 0 0;
  display: block;
  text-decoration: none;
  background-repeat: no-repeat;
  background-size: 11px;
  background-position: top 8px right;
}
.footer .footer__inner .footer-left-list__item a:hover {
  text-decoration: underline;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer-left-list__item a {
    font-size: 3.1168831169vw;
    padding: 0 3.8961038961vw 0 0;
    text-decoration: underline;
    background-size: 2.987012987vw;
    background-position: top 1.5584415584vw right;
  }
}
.footer .footer__inner .footer__copy {
  text-align: center;
  font-size: 1.1rem;
  color: #34495e;
}
@media (max-width: 480px) {
  .footer .footer__inner .footer__copy {
    font-size: 2.8571428571vw;
  }
}
.footer .footer__inner .footer__copy p {
  margin-bottom: 0;
}
.footer .footer__inner img {
  width: 100%;
}
