@charset "UTF-8";

:root {
    --bg-color-blue: #205fa0;
    --bg-color-light-blue: #c4dcf5;
    --bg-color-black: #3a3a3a;
    --bg-color-yellow: #f9cc4d;
    --bg-color-cream: #f9f7e6;
    --bg-color-orange: #de4801;
    --text-color-green: #205fa0;
    --text-color-yellow: #f9cc4d;
    --text-color-blue: #325a8c;
}

h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd, figure {
  margin: 0;
  padding: 0;
}

ul { list-style: none; }

strong { font-weight: normal; }
body {
  color: #333;
  font-size: 15px;
  font-family: "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-weight: normal;
  line-height: 1.6;
}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
a { color: #e17a00; }
img {
  max-width: 100%;
  width: 100%;
  vertical-align: bottom;
}
.w100 { width: 100%; }

.txt-red { color: #ba3714; }
.txt-orange {
  color: #e17a00;
  font-weight: bold; 
}
.txt-orange02 { color: #e16f00; }
.txt-green { color: #438d49; }


.point-text01 {
  color: var(--bg-color-blue);
  font-weight: bold;
}
.point-text02 { color: #e17a00; }
.point-text03 { color: #ffd512; }
.point-text04 { color: #bf0000; }
.point-text05 { color: var(--bg-color-orange); }


.txt-point-link {
  color:#ba3714;
  font-weight:bold;
}

.txt-point-link2 {
  color:#03c;
  font-weight: normal;
}

.txt-highlight {
  background-color: #fee280;
  background: -webkit-linear-gradient(transparent 65%, #fee280 0%);
  background: linear-gradient(transparent 65%, #fee280 0%);   /* Default */
}

.l-header {
  display: table;
  width: 100%;
  position: relative;
  z-index: 1;
  border-top: 2px solid #e16f00;
  border-bottom: 1px solid #222;
}

.logo {
  display: table-cell;
  width: 53.4375%;
  padding: 0 10.15625% 0 2.8125%;
  font-size: 0;
  vertical-align: middle;
}

.header-tel {
  display: table-cell;
  width: 46.5625%;
  padding: 1.5625% 1.875% 1.5625% 2.03125%;
  background-color: var(--bg-color-cream);
  border-left: 1px solid #222;
  border-right: 1px solid #222;
}
.l-footer {
  padding: 0 3.125% 6.6666666667%;
  background-color: var(--bg-color-cream);
  border-top: 1px solid #e16f00;
}

.footer-logo {
  width: 65.333333333%;
  margin: 0 auto;
  margin-top: 3.6666666667%;
  margin-bottom: 4.3333333333%;
}

.footer-group {
  padding: 4% 10%;
  font-size: 11px;
  font-size: 3.4375vw;
  font-weight: bold;
  color: #fff;
  line-height: 1;
  background: #e16f00 url("../../images/common/ico/ico_bee.png") 3.3333333333% center no-repeat;
  -webkit-background-size: 4.6666666667%;
  background-size: 4.6666666667%;
  border-radius: 2px 2px 0 0;
}

.footer-link {
  margin-bottom: 6.6666666667%;
  border: 1px solid #d89800;
  border-bottom: none;
}

.footer-link-a {
  position: relative;
  display: block;
  padding: 5.6666666667% 8.3333333333% 5.6666666667% 5.6666666667%;
  font-size: 11px;
  font-size: 3.4375vw;
  line-height: 1.3;
  color: #e17a00;
  text-decoration: none;
  background-color: #fff;
  border-bottom: 1px solid #d89800;
}

.footer-link-a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 5%;
  margin-top: -4px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #e16f00;
  border-right: 2px solid #e16f00;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.copyright {
  padding:3.125%;
  font-weight: normal;
  font-size: 11px;
  font-size: 3.4375vw;
  line-height: 1;
  color: #fff;
  text-align: center;
  background-color: #d89800;
}


.box-main {
  padding-top: 16.2666666667vw;
  text-align: justify;
  font-feature-settings: "palt";
  letter-spacing: 0.04em;
}

.l-header-globalnav {
  position: fixed;
  width: 100%;
  background-color: #fff;
  z-index: 200;
  transition: .4s;
}

.l-header-globalnav.hide{
    transform: translateY(-100%);
}

.is-drawerActive .l-header-globalnav.hide{
    transform: none;
}

.header-logo {
  float: left;
  width: 38.667vw;
  line-height: 1;
  font-size: 0;
  margin: 3.7333333333vw 0 0 2.667vw;
}

.header-board {
  float: left;
  width: 16.5333333333vw;
  height: 13.3333333333vw;
  margin-left: 5.8666666667vw;
  padding: 4.2666666667vw 0 0 2.4vw;
  font-size: 2.933vw;
  line-height: 1.227;
  font-weight: bold;
  background: #fff url(../../images/header/img_board.png) 0 0 no-repeat;
  background-size: cover;
}

.header-board-point { color: #f05500; }


.header-globalnav {
  float: right;
  width: 32vw;
  padding: 2.9333333333vw 2.9333333333vw 2.9333333333vw 4vw;
  border: none;
  border-left: 1px solid #cdcdcd;
  background-color: #fff;
  outline: none;
}

.header-globalnav-text {
  float: left;
  padding-top: 1.3333333333vw;
  font-size: 2.9333333333vw;
  line-height: 1.364;
}

.header-globalnav-text-close {
  display: none;
  float: left;
  padding: 2.9333333333vw 0 0 1.6vw;
  font-size: 2.9333333333vw;
  line-height: 1.364;
}

.is-drawerActive .header-globalnav-text { display: none; }
.is-drawerActive .header-globalnav-text-close { display: inline; }


.header-globalnav-button {
  position: relative;
  float: right;
  width: 9.867vw;
  height: 9.867vw;
  text-decoration: none;
  background-color: var(--bg-color-orange);
  border-radius: 0.667vw;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  cursor: pointer;
  transition: all .4s;
}

.header-globalnav-button:hover,
.header-globalnav-button:focus {
  box-shadow: 0 0 .5rem rgba(255, 255, 255, .5 );
}

.header-globalnav-button-line {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 4.533vw;
  height: 0.267vw;
  background-color: #fff;
  -webkit-transition: inherit;
          transition: inherit;
}
.header-globalnav-button-line::before,
.header-globalnav-button-line::after {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-color: inherit;
  content: '';
  -webkit-transition: inherit;
          transition: inherit;
}
.header-globalnav-button-line::before {
  top: -1.333vw;
}
.header-globalnav-button-line::after {
  top: 1.333vw;
}

.header-globalnav[aria-expanded="true"] .header-globalnav-button-line {
  background-color: transparent;
}

.header-globalnav[aria-expanded="true"] .header-globalnav-button-line::before,
.header-globalnav[aria-expanded="true"] .header-globalnav-button-line::after {
  top: 0;
  background-color: #f9d8ae;
}

.header-globalnav[aria-expanded="true"] .header-globalnav-button-line::before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.header-globalnav[aria-expanded="true"] .header-globalnav-button-line::after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}


.common-footer-title {
  position: relative;
  margin-bottom: 8vw;
  padding: 5.867vw 24vw 5.867vw 7.2vw;
  font-size: 4.267vw;
  line-height: 1;
  background-color: #f6c416;
}

.common-footer-title.knowledge:after {
  content: "";
  position: absolute;
  right: 2.133vw;
  top: -2.667vw;
  display: block;
  width: 22.4vw;
  height: 15.6vw;
  background: url("../../images/common/ico/ico_honeycomb.png") center center no-repeat;
  background-size: 22.4vw 15.6vw;
}

.common-footer-title.faq:after {
  content: "";
  position: absolute;
  right: 3.2vw;
  bottom: 0;
  display: block;
  width: 13.067vw;
  height: 19.067vw;
  background: url("../../images/common/ico/ico_faq.png") center center no-repeat;
  background-size: 13.067vw 19.067vw;
}

.l-footer-accordion {
  padding-bottom: 10.6666666667vw;
}

.footer-knowledge-list { padding: 0 6.667vw 0 4vw; }

.footer-knowledge-list-more {
  display: none;
  padding: 0 6.667vw 0 4vw;
}

.footer-knowledge-item { margin-bottom: 6.667vw; }

.footer-knowledge-list a,
.footer-knowledge-list-more a {
  display: table;
  width: 100%;
  text-decoration: none;
}

.footer-knowledge-img {
  display: table-cell;
  vertical-align: top;
  width: 20vw;
}

.footer-knowledge-body {
  display: table-cell;
  vertical-align: middle;
  padding-left: 4vw;  
}

.footer-knowledge-date {
  margin-bottom: 1.867vw;
  font-size: 2.933vw;
  line-height: 1;
  color: #999;
}

.footer-knowledge-name {
  font-size: 3.2vw;
  line-height: 1.75;
  font-weight: normal;
  color: var(--text-color-blue);
  text-decoration: underline;
}
.footer-faq-list {
  padding: 0 6.667vw 0 4vw;
}

.footer-faq-list-more {
  display: none;
  padding: 0 6.667vw 0 4vw;
}

.footer-faq-item { margin-bottom: 8vw; }

.footer-faq-link {
  position: relative;
  display: block;
  padding-left: 12vw;
  text-decoration: none;
}

.footer-faq-link:before {
  content: "";
  position: absolute;
  top: 1.067vw;
  left: 0;
  display: block;
  width: 8vw;
  height: 8vw;
  background: url("../../images/common/ico/ico_faq_question.png") center center no-repeat;
  background-size: 8vw 8vw;
}

.footer-faq-name {
  font-size: 3.2vw;
  line-height: 1.75;
  font-weight: normal;
  color: var(--text-color-blue);
  text-decoration: underline;
}

.footer-faq-date {
  margin-top: 1.867vw;
  font-size: 2.933vw;
  line-height: 1;
  color: #999;
}

.js-footer-accordion-close {
  display: none;
}
.l-footer-info {
  padding: 5.333vw 6.667vw 8vw;
  background-color: var(--bg-color-cream);
}

.footer-info {
  display: table;
  width: 100%;
}

.footer-info-list {
  display: table-cell;
  vertical-align: top;
  width: 42.667vw;
}

.footer-info-a {
  position: relative;
  display: block;
  padding: 2.667vw 0 2.667vw 4vw;
  font-size: 3.467vw;
  line-height: 1;
  text-decoration: none;
  color: #333;
}

.footer-info-a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 1.067vw 0 1.067vw 1.333vw;
  border-color: transparent transparent transparent var(--bg-color-orange);
}

.footer-logo02 {
  display: block;
  margin: 30px auto 0;
  width: 45.3333333333vw;
}
footer {
    margin-bottom: 22vw;
}
.copyright {
  display: block;
  padding: 2.667vw 0;
  font-size: 2.933vw;
  line-height: 1;
  text-align: center;
  color: #fff;
  background-color: var(--bg-color-orange);
}



.recommend-item { margin-bottom: 10.667vw; }

.recommend-link {
  display: block;
  text-decoration: none;
}


.recommend-name {
  font-weight: bold;
  font-size: 4.533vw;
  line-height: 1.706;
  background: var(--bg-color-light-blue);
  color: var(--text-color-blue);
  padding: 1.8vw;
  margin: 1.8vw 0;
}
.recommend-text {
  line-height: 1.706;
  border:1px solid var(--bg-color-blue);
  padding: 1.8vw;
  margin: 1.8vw 0;
}