@charset "UTF-8";
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font-weight: normal;
  font-style: normal;
}

html {
  font-size: 62.5%;
}

body {
  padding: 0;
  font-size: 1.6rem;
  font-family: "Noto Sans JP", "Noto Sans JP", "Noto Sans Japanese", sans-serif;
  position: relative;
}

body.fixed {
  height: 100%;
  overflow: hidden;
}

.container {
  overflow: hidden;
}

.pc {
  display: none;
}

@media screen and (min-width: 1200px) {
  .sp2 {
    display: none !important;
  }
}
@media screen and (min-width: 769px) {
  .sp {
    display: none !important;
  }
  .pc {
    display: block;
  }
}
h1 {
  font-size: 40px;
}
h1 span {
  font-size: 26px;
  display: block;
  letter-spacing: 0.1em;
}

h2 {
  font-size: 3.2rem;
  color: #333333;
  margin-bottom: 20px;
  font-weight: 700;
}

@media screen and (min-width: 769px) {
  h2 {
    font-size: 4rem;
  }
}
p {
  margin-bottom: 10px;
}

b {
  font-weight: 900;
  display: block;
  margin-bottom: 5px;
}

li {
  list-style: none;
}

a {
  text-decoration: none;
}

@media screen and (min-width: 769px) {
  a {
    transition: 0.3s;
  }
}
.free {
  writing-mode: vertical-rl;
}

.hr-dotted {
  border: none;
  border-bottom: 1px dotted #707070;
  margin: 0;
}

#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 99;
  /*ナビのスタート位置と形状*/
  top: -40%;
  left: 0;
  width: 100%;
  background: #fff;
  /*動き*/
  transition: all 0.4s ease-out;
}

/*下ろす位置*/
#g-nav.panelactive {
  top: 69px;
}

/*ナビゲーション*/
#g-nav ul {
  position: absolute;
  z-index: 999;
  left: 50%;
  transform: translate(-50%, 0%);
  width: 100%;
  background-color: #fff;
  box-shadow: 0px 9px 19px -16px rgba(0, 0, 0, 0.1);
}

#g-nav ul li.has-child::before {
  content: "";
  position: absolute;
  right: 15%;
  top: 9vh;
  width: 6px;
  height: 6px;
  border-top: 2px solid #333333;
  border-right: 2px solid #333333;
  transform: rotate(135deg);
}

/*下の階層を持っているulの指定*/
nav li.has-child ul {
  /*絶対配置で位置を指定*/
  position: absolute;
  left: 0;
  top: 62px;
  z-index: 4;
  /*形状を指定*/
  background-color: #F6F9FE;
  width: 180px;
  /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
  /*アニメーション設定*/
  transition: all 0.3s;
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
  padding: 0 9%;
}
#g-nav li a {
  color: #333;
  text-align: left;
  text-decoration: none;
  padding: 18px 10px;
  display: block;
  letter-spacing: 0.1em;
  font-weight: bold;
}

#g-nav {
  padding: 0;
}

#g-nav ul {
  display: block;
}

#g-nav li.has-child ul,
#g-nav li.has-child ul ul {
  position: relative;
  left: 50%;
  top: 0;
  width: 100%;
  background-color: #F6F9FE;
  box-shadow: none;
  visibility: visible; /*JSで制御するため一旦表示*/
  opacity: 1; /*JSで制御するため一旦表示*/
  display: none; /*JSのslidetoggleで表示させるため非表示に*/
  transition: none; /*JSで制御するためCSSのアニメーションを切る*/
}
#g-nav li.has-child ul li,
#g-nav li.has-child ul ul li {
  padding: 0;
}
#g-nav li.has-child ul li a,
#g-nav li.has-child ul ul li a {
  padding-left: 30px;
}

/*矢印の位置と向き*/
#g-nav ul li.has-child::before {
  right: 17%;
  top: 87px;
}

#g-nav ul ul li.has-child::before {
  transform: rotate(135deg);
  left: 20px;
}

#g-nav ul li.has-child.active::before {
  transform: rotate(-45deg);
}

.h-follow {
  left: 0;
  height: 70px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fff;
  position: fixed;
  z-index: 100;
  box-shadow: 0px 9px 19px -16px rgba(51, 51, 51, 0.1);
}
.h-follow .tellink {
  padding-left: 20px;
}
.h-follow h1 {
  padding-top: 10px;
}

@media screen and (min-width: 769px) {
  .tellink {
    display: none;
  }
  h1 {
    padding-left: 20px;
  }
}
.openbtn {
  position: relative; /*ボタン内側の基点となるためrelativeを指定*/
  z-index: 9999;
  cursor: pointer;
  width: 50px;
  height: 50px;
  right: 20px;
  /*×に変化*/
}
.openbtn span {
  display: inline-block;
  transition: all 0.4s; /*アニメーションの設定*/
  position: absolute;
  left: 14px;
  height: 3px;
  background: #DF2626;
  width: 45%;
}

.openbtn span:nth-of-type(1) {
  top: 15px;
}

.openbtn span:nth-of-type(2) {
  top: 23px;
}

.openbtn span:nth-of-type(3) {
  top: 31px;
}

/*activeクラスが付与されると線が回転して×に*/
.openbtn.active span:nth-of-type(1) {
  top: 18px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 30%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0; /*真ん中の線は透過*/
}

.openbtn.active span:nth-of-type(3) {
  top: 30px;
  left: 18px;
  transform: translateY(-6px) rotate(45deg);
  width: 30%;
}

.pc-nav {
  display: none;
}

@media screen and (min-width: 1200px) {
  .topandright {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1%;
    padding-right: 10px;
    /*img {
    	margin-left: 3%;
    	max-width: 290px;
    }*/
  }
  .topandright p {
    margin-bottom: 0;
  }
  .topandright .businesshours {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }
  .topandright .tell-number {
    color: #DF2626;
    font-size: 3.2rem;
    font-weight: bold;
    font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
    margin-right: 0.5%;
    width: 258px;
  }
  .topandright .tell-number::before {
    content: "";
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url("../img/common/freedial.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 10px;
    padding-bottom: 6px;
  }
  .topandright .topandright-button {
    bottom: 0;
    z-index: 100;
    height: 60px;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    padding: 10px;
    background-color: #DF2626;
    border-radius: 0 0 10px 10px;
    margin-left: 17px;
    width: 70px;
  }
  .topandright .topandright-button p {
    font-size: 1.1rem;
    color: #fff;
    font-weight: bold;
    margin-bottom: 0;
  }
  .topandright .topandright-button p span {
    display: none;
  }
  .topandright .topandright-button img {
    width: 50px;
    height: 50px;
  }
  .topandright .topandright-button .free {
    display: none;
  }
  .topandright .topandright-button:hover {
    opacity: 0.7;
  }
  /*HeightMinというクラス名がついたら高さを小さく、上部固定に*/
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .topandright .topandright-button {
    width: 240px;
    padding: 10px 21px;
    bottom: 0;
    z-index: 100;
    height: 60px;
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: center;
    background-color: #DF2626;
    border-radius: 0 0 10px 10px;
    margin-left: 17px;
  }
  .topandright .topandright-button p {
    font-size: 1.8rem;
  }
  .topandright .topandright-button p span {
    display: block;
    font-size: 1.8rem;
    color: #fff;
    font-weight: bold;
    margin-bottom: 0;
  }
  .topandright .topandright-button img {
    display: block;
    width: 50px;
    height: 50px;
  }
  .topandright .topandright-button .free {
    display: block;
    color: #DF2626;
    letter-spacing: 0.5rem;
    background-color: #fff;
    padding: 5px 4px 0;
    border-radius: 5px;
    text-align: center;
    margin-right: 12px;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 1200px) {
  .pc-nav {
    display: block;
    height: 130px;
    width: 100%;
    margin-bottom: 28px;
    background-color: #fff;
  }
  .pc-nav__content {
    text-align: center;
    /*background-color: #fff;*/
    max-width: 1400px;
    margin: 0 auto;
  }
  .pc-nav ul {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .pc-nav ul ul {
    display: block;
  }
  .pc-nav ul li {
    position: relative;
    text-align: center;
    width: 19%;
    top: -10px;
  }
  .pc-nav ul li + li {
    border-left: 0;
    border-right: 1px dotted #777;
  }
  .pc-nav ul li a {
    color: #333333;
    display: block;
    text-decoration: none;
    padding: 1px 25px;
    transition: all 0.3s;
    font-size: 1.8rem;
    font-weight: bold;
  }
  .pc-nav ul li a img {
    width: 227px;
  }
  .pc-nav ul li li a {
    padding: 10px 10px 10px 40px;
  }
  .pc-nav ul li a:hover {
    color: #DF2626;
  }
  .pc-nav ul li:first-child {
    top: -30px;
    padding-right: 20px;
  }
  .pc-nav ul li:first-child a {
    padding-left: 10px;
  }
  .pc-nav ul li:nth-child(2) {
    border-left: 1px dotted #777;
  }
  .pc-nav li.has-child ul {
    position: absolute;
    left: 0;
    top: 25px;
    z-index: 4;
    background: #F6F9FE;
    width: 100% !important;
    visibility: hidden;
    opacity: 0;
    transition: all 0.3s;
    top: 30px;
  }
  .pc-nav li.has-child ul li {
    width: 100% !important;
    border-right: none;
    border-left: none;
    top: 0 !important;
  }
  .pc-nav li.has-child ul li:first-child {
    top: 0 !important;
    padding: 0;
  }
  .pc-nav li.has-child:hover > ul, .pc-nav li.has-child ul li:hover > ul, .pc-nav li.has-child:active > ul {
    visibility: visible;
    opacity: 1;
  }
  .pc-nav li.has-child ul li:active > ul {
    visibility: visible;
    opacity: 1;
  }
  .pc-nav li.has-child ul li a {
    color: #333333;
    border-bottom: dotted 1px #707070;
    padding: 10px;
    font-size: 1.6rem;
  }
  .pc-nav li.has-child ul li a span {
    font-weight: bold;
  }
  .pc-nav li.has-child ul li:last-child a {
    border-bottom: none;
  }
  .pc-nav li.has-child ul li a:hover, .pc-nav li.has-child ul li a:active {
    color: #DF2626;
  }
  .pc-nav.HeightMin {
    left: 0;
    position: fixed;
    z-index: 999; /*最前面へ*/
    height: 80px;
    animation: DownAnime 0.5s forwards;
    box-shadow: 0px 9px 19px -16px rgba(51, 51, 51, 0.1);
  }
  .pc-nav.HeightMin .pc-nav__content {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    /*margin-top: -5px;*/
  }
  .pc-nav.HeightMin .topandright {
    max-width: 500px;
    padding: 0;
  }
  .pc-nav.HeightMin .topandright .businesshours {
    display: none;
  }
  .pc-nav.HeightMin .topandright .tell-number {
    font-size: 2.4rem;
    margin: 0;
    text-align: left;
    width: 195px;
  }
  .pc-nav.HeightMin .topandright .tell-number::before {
    width: 30px;
    height: 30px;
    /*vertical-align: top;*/
  }
  .pc-nav.HeightMin ul {
    max-width: 900px;
    margin-top: 12px;
    margin-right: 20px;
  }
  .pc-nav.HeightMin ul li {
    width: 135px;
    /*padding: 10px 0;*/
  }
  .pc-nav.HeightMin ul li:first-child {
    top: 0px;
    margin-top: -10px;
    margin-right: 50px;
  }
  .pc-nav.HeightMin ul li:first-child a img {
    width: 170px;
  }
  .pc-nav.HeightMin ul li a {
    font-size: 1.5rem;
    padding: 2px 14.5px;
  }
  .pc-nav.HeightMin ul li.has-child ul {
    top: 15px;
  }
  .pc-nav.HeightMin ul li.has-child ul li a {
    font-size: 1.4rem;
  }
  .pc-nav.HeightMin ul li.has-child ul li a span {
    display: none;
  }
  .pc-nav.HeightMin ul li.has-child ul li:first-child {
    padding: 10px 0;
    margin-top: 0px;
    padding: 0;
  }
  .pc-nav.HeightMin ul li.has-child ul li:nth-child(2) {
    padding: 0;
  }
  @keyframes DownAnime {
    from {
      opacity: 0;
      transform: translateY(-170px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}
footer nav {
  padding: 40px 40px 20px;
}
footer nav p {
  text-align: center;
  margin-bottom: 30px;
  line-height: 2;
}
footer nav p a {
  text-decoration: none;
  color: #333333;
}
footer nav p a:hover {
  color: #DF2626;
}
footer .footer-logoimg {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  display: block;
}
footer .footer-logoimg img {
  display: block;
  margin: 0 auto 40px;
}
footer small {
  display: block;
  text-align: center;
  margin-bottom: 4vw;
}

@media screen and (min-width: 769px) {
  footer {
    padding: 40px 40px 30px;
    display: flex;
    flex-direction: column;
  }
  footer nav {
    order: 2;
  }
  footer nav p {
    margin-bottom: 40px;
  }
  footer img {
    order: 1;
    width: 275px;
    height: 97px;
    margin-bottom: 25px;
  }
  footer small {
    order: 3;
  }
}
#page-top {
  position: fixed;
  bottom: 0;
  right: 0;
  background-size: 6rem;
  z-index: 100;
  width: 60px;
  height: 60px;
  background-color: #333333;
  cursor: pointer;
  border-radius: 10px 0 0 10px;
  margin-left: 2.8rem;
}
#page-top a {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  text-decoration: none;
}
#page-top a::before {
  content: "";
  display: inline-block;
  position: relative;
  top: 15%;
  left: 37%;
  width: 10px;
  height: 10px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  transform: rotate(-45deg);
}
#page-top a:hover {
  opacity: 0.7;
}
#page-top a::after {
  content: "TOP";
  font-size: 1.6rem;
  font-weight: bold;
  color: #fff;
  position: absolute;
  top: 40%;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

.scroll-cta-button {
  position: fixed;
  bottom: 0;
  z-index: 100;
  height: 60px;
  display: flex;
  gap: 6%;
  align-items: center;
  padding: 5px 20px;
  background-color: #DF2626;
  border-radius: 10px 10px 0 0;
  max-width: 220px;
  width: 60%;
  margin-left: 5%;
}
.scroll-cta-button:hover {
  opacity: 0.7;
}
.scroll-cta-button p {
  font-size: 1.8rem;
  color: #fff;
  font-weight: bold;
  margin-bottom: 0;
}
.scroll-cta-button img {
  width: 50px;
  height: 50px;
}
.scroll-cta-button .free {
  color: #DF2626;
  letter-spacing: 0.5rem;
  background-color: #fff;
  padding: 5px 4px 0;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 0;
}
.scroll-cta-button .free .bullets {
  display: none;
}

@media screen and (min-width: 1200px) {
  .scroll-cta-button {
    right: 0;
    bottom: 110px;
    height: 250px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    justify-content: space-around;
    padding: 20px;
    border-radius: 10px 0 0 10px;
    width: 60px;
    margin-left: 0;
  }
  .scroll-cta-button p {
    font-size: 2rem;
    writing-mode: vertical-rl;
    letter-spacing: 0.1em;
  }
  .scroll-cta-button .free {
    padding: 2px 8px 4px;
    margin-right: 0;
    writing-mode: inherit;
    letter-spacing: 0.1em;
  }
}
.f-follow {
  height: 70px;
  width: 100%;
}

/*JSを使いfixedクラスが付与された際の設定*/
.f-follow.fixed {
  position: fixed; /*fixedを設定して固定*/
  z-index: 999; /*最前面へ*/
  top: 0; /*位置指定*/
  left: 0; /*位置指定*/
}

@media screen and (min-width: 1200px) {
  .f-follow {
    height: 0;
  }
}
@media screen and (min-width: 769px) {
  .tellink {
    pointer-events: none;
  }
}
.ttl {
  position: relative;
  padding: 1.5rem;
  text-align: center;
  margin-bottom: 48px;
}
.ttl:after {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 40px;
  height: 4px;
  content: "";
  background: #DF2626;
}
.ttl h2 {
  display: block;
  margin: 0 auto 0 0;
}
.ttl h2::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
}

@media screen and (min-width: 769px) {
  .ttl {
    margin-bottom: 68px;
  }
  .ttl h2::before {
    vertical-align: inherit;
  }
}
.arrow {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
}
.arrow::before, .arrow::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.guide-cta {
  background-image: url("../img/top/bg.png");
  background-size: cover;
  background-position: center;
  padding: 5rem 3rem;
}
.guide-cta .bullets {
  display: none;
}
.guide-cta .userguide {
  padding: 10px 2.4rem 30px;
  max-width: 300px;
  margin: 0 auto 25px;
  background-color: #fff;
  border-radius: 10px;
}
.guide-cta .userguide h2::before {
  background-image: url("../img/common/beginnermark.png");
}
.guide-cta .userguide .guide-button {
  display: flex;
  flex-wrap: wrap;
  grid-gap: 15px;
  justify-content: center;
}
.guide-cta .userguide .guide-button a {
  padding: 6px 21px 7px;
  max-width: 100px;
  background-color: #FFD83F;
  color: #333333;
}
.guide-cta .userguide .guide-button a:hover {
  background-color: #ffe88c;
}
.guide-cta .userguide .guide-button a p {
  margin-bottom: 0;
}
.guide-cta .cta h2::before {
  background-image: url("../img/common/speechballoon-bk.png");
}
.guide-cta .cta p {
  text-align: center;
  font-size: 1.8rem;
}
.guide-cta .cta .cta-button {
  background-color: #DF2626;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  padding: 1rem;
  max-width: 300px;
  border-radius: 10px;
  margin: 20px auto 30px;
}
.guide-cta .cta .cta-button p {
  margin-bottom: 0;
  font-size: 2.8rem;
  font-weight: bold;
  color: #FFF;
  text-align: left;
  letter-spacing: 0.3rem;
  line-height: 1.2;
}
.guide-cta .cta .cta-button p br {
  display: block !important;
}
.guide-cta .cta .cta-button .free {
  color: #DF2626;
  font-size: 2.4rem;
  font-weight: bold;
  letter-spacing: 0.5rem;
  background-color: #fff;
  padding: 10px 8px 9px;
  border-radius: 10px;
  text-align: center;
  margin-right: 12px;
}
.guide-cta .cta .tell-number {
  margin-bottom: 10px;
}
.guide-cta .cta .tell-number a {
  font-size: 3.6rem;
  font-weight: bold;
  color: #DF2626;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  display: block;
  text-align: center;
}
.guide-cta .cta .tell-number a::before {
  content: "";
  display: inline-block;
  width: 60px;
  height: 60px;
  background-image: url("../img/common/freedial.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
  margin-bottom: 9px;
}
.guide-cta .cta .cta-info {
  text-align: left;
  max-width: 300px;
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .userguide h2, .cta h2 {
    font-size: 3.2rem;
  }
  .userguide h2::before, .cta h2::before {
    vertical-align: middle !important;
  }
}
@media screen and (min-width: 1150px) {
  .guide-cta .bullets {
    display: inline;
  }
  .guide-cta__contents {
    max-width: 1265px;
    margin: 0 auto;
    display: flex;
    gap: 30px;
    justify-content: space-around;
    align-items: center;
  }
  .guide-cta__contents .userguide {
    margin: 0;
    padding: 10px 48px 60px;
    width: 50%;
    max-width: 580px;
  }
  .guide-cta__contents .userguide h2 {
    font-size: 4rem;
  }
  .guide-cta__contents .userguide .guide-button {
    gap: 38px;
    justify-content: space-between;
    max-width: 480px;
    margin: 0 auto;
  }
  .guide-cta__contents .userguide .guide-button__br {
    display: none;
  }
  .guide-cta__contents .userguide .guide-button .arrow {
    margin-bottom: 0;
    text-align: left;
    max-width: 160px;
    width: 100%;
    padding: 22px 30px;
    position: relative;
  }
  .guide-cta__contents .userguide .guide-button .arrow::after {
    content: "";
    display: inline-block;
    position: absolute;
    left: 70%;
    top: 2.5px;
    width: 5px;
    height: 5px;
    border-top: 2px solid #333333;
    border-right: 2px solid #333333;
    transform: rotate(45deg);
  }
  .guide-cta__contents .userguide .guide-button .arrow p {
    max-width: 180px;
    width: 100%;
  }
  .guide-cta__contents .cta {
    max-width: 575px;
    width: 50%;
  }
  .guide-cta__contents .cta .ttl {
    margin-bottom: 48px;
  }
  .guide-cta__contents .cta .ttl h2 {
    font-size: 4rem;
  }
  .guide-cta__contents .cta .cta-button {
    max-width: 490px;
    width: 100%;
    height: 70px;
  }
  .guide-cta__contents .cta .cta-button:hover {
    /*transform: translateY(-5px);*/
    opacity: 0.7;
  }
  .guide-cta__contents .cta .cta-button .free {
    writing-mode: inherit;
    margin-right: 0;
    padding: 10px 8px 11px 14px;
  }
  .guide-cta__contents .cta .cta-button p br {
    display: none !important;
  }
  .guide-cta__contents .cta .tell-number a::before {
    width: 72px;
    height: 72px;
  }
  .guide-cta__contents .cta .cta-info {
    text-align: center;
    max-width: inherit;
  }
}
.breadcrumb-bg {
  background-color: #F6F9FE;
}

.breadcrumb {
  display: flex;
  justify-content: flex-start;
  padding: 16.5px 5%;
  margin-bottom: 30px;
}
.breadcrumb li {
  display: inline-block;
  margin: 0 12px 0 0;
  padding-right: 16px;
  position: relative;
  font-size: 1.2rem;
}
.breadcrumb li::after {
  content: "";
  position: absolute;
  background: url(../img/common/arrow-r-sp.png) no-repeat;
  width: 6px;
  height: 10px;
  top: calc(50% - 4px);
  right: 0;
}
.breadcrumb li a {
  color: #333333;
  position: relative;
  white-space: nowrap;
}
.breadcrumb li a:hover {
  text-decoration: underline;
}
.breadcrumb li:last-child {
  margin: 0;
  padding: 0;
  max-width: 40%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis; /* Safari */
  -o-text-overflow: ellipsis; /* Opera */
}
.breadcrumb li:last-child::after {
  content: none;
}

@media screen and (min-width: 1100px) {
  .breadcrumb {
    max-width: 1100px;
    margin: 0 auto 80px;
    padding: 20px 1%;
  }
  .breadcrumb li {
    margin: 0 18px 0 0;
    padding-right: 28px;
    font-size: 1.6rem;
  }
  .breadcrumb li::after {
    background: url(../img/common/arrow-r.png) no-repeat;
    width: 8px;
    height: 12px;
  }
  .breadcrumb li:last-child {
    max-width: 68%;
  }
}
header {
  height: 70px;
}
@media screen and (min-width: 1200px) {
  header {
    height: 155px;
  }
}

.sub__top-ttl {
  background-position: right;
  height: 120px;
  padding: 0;
  display: flex;
  align-items: center;
}
.sub__top-ttl .ttlArea {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  margin: 0 auto;
}
.sub__top-ttl .ttlArea h2 {
  text-align: left;
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1.1;
}
@media screen and (min-width: 769px) {
  .sub__top-ttl {
    height: 280px;
  }
  .sub__top-ttl .ttlArea {
    max-width: 1100px;
    width: 90%;
    display: flex;
    align-items: center;
    margin: 0 auto;
  }
  .sub__top-ttl .ttlArea h2 {
    font-size: 4rem;
  }
}

.sub-container {
  padding: 0 5%;
  margin: 0 auto;
  max-width: 500px;
}
@media screen and (min-width: 1100px) {
  .sub-container {
    max-width: 1100px;
    margin: 0 auto;
  }
}
.sub-container h3 {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 3rem;
}
.sub-container h3 span {
  color: #DF2626;
  font-weight: bold;
}
@media screen and (min-width: 769px) {
  .sub-container h3 {
    font-size: 2.4rem;
  }
}

.cta-sp {
  max-width: 500px;
  margin: 0 auto 50px;
  border: 1px dashed #333333;
  padding: 11px 16px;
}
.cta-sp .evocation {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 12px;
}
.cta-sp .evocation::before, .cta-sp .evocation::after {
  content: "";
  width: 2px;
  height: 36px;
  background-color: #333333;
}
.cta-sp .evocation::before {
  margin-right: 18px;
  transform: rotate(-35deg);
}
.cta-sp .evocation::after {
  margin-left: 18px;
  transform: rotate(35deg);
}
.cta-sp .cta-mini {
  display: flex;
  justify-content: space-around;
  margin-bottom: 12px;
  gap: 6px;
}
.cta-sp .cta-mini .mail-mini, .cta-sp .cta-mini .tell-mini {
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  background-color: #DF2626;
  border-radius: 8px;
  width: 40%;
  padding: 5px 10px;
}
.cta-sp .cta-mini .mail-mini::before, .cta-sp .cta-mini .tell-mini::before {
  content: "";
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: bottom;
  margin-right: 4%;
  margin-bottom: 4px;
}
.cta-sp .cta-mini .mail-mini::before {
  width: 24px;
  height: 18px;
  background-image: url("../img/list/mail-wt.png.png");
}
.cta-sp .cta-mini .tell-mini::before {
  width: 27px;
  height: 18px;
  background-image: url("../img/list/freedial-wt.png.png");
}
.cta-sp p {
  margin-bottom: 0;
  text-align: center;
}

@media screen and (min-width: 1100px) {
  .cta-sp {
    display: none;
  }
}
.cta-pc {
  display: none;
}

@media screen and (min-width: 1100px) {
  .cta-pc {
    display: block;
    border: 2px dashed #333333;
    padding: 30px 38px;
    max-width: 680px;
    margin: 0 auto 60px;
  }
  .cta-pc .evocation {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    text-align: center;
    margin-bottom: 24px;
    font-size: 2rem;
  }
  .cta-pc .evocation::before, .cta-pc .evocation::after {
    content: "";
    width: 2px;
    height: 32px;
    background-color: #333333;
  }
  .cta-pc .evocation::before {
    margin-right: 18px;
    transform: rotate(-35deg);
  }
  .cta-pc .evocation::after {
    margin-left: 18px;
    transform: rotate(35deg);
  }
  .cta-pc .contents {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .cta-pc .contents img {
    width: 220px;
  }
  .cta-pc .contents .right .cta-mini {
    background-color: #DF2626;
    margin: 0 auto;
    border-radius: 15px;
    width: 330px;
    height: 50px;
    padding: 15px 40px 15px 15px;
    font-size: 2rem;
    color: #fff;
    text-align: center;
    display: block;
    margin-bottom: 10px;
  }
  .cta-pc .contents .right .cta-mini:hover {
    opacity: 0.7;
  }
  .cta-pc .contents .right .cta-mini p {
    padding: 10px 0 0;
  }
  .cta-pc .contents .right .cta-mini span {
    font-size: 1.6rem;
    color: #DF2626;
    max-width: 40px;
    padding: 12px 6px 12px 12px;
    background-color: #fff;
    border-radius: 10px;
    font-weight: bold;
    margin-right: 10px;
  }
  .cta-pc .contents .right .tell {
    font-size: 3.2rem;
    font-weight: bold;
    color: #DF2626;
    text-align: center;
    margin-bottom: 0;
    font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  }
  .cta-pc .contents .right .tell::before {
    content: "";
    display: inline-block;
    width: 66px;
    height: 66px;
    background-image: url("../img/list/freedial-rd.png.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 3%;
    margin-bottom: 5px;
  }
}
a img {
  transition: 0.3s;
}
a img:hover {
  opacity: 0.7;
}

.ttl {
  position: relative;
  padding: 15px;
  text-align: center;
  margin-bottom: 48px;
}
.ttl:after {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 40px;
  height: 3px;
  content: "";
  background: #DF2626;
}
.ttl h2 {
  display: block;
  margin: 0 auto 0 0;
}
.ttl h2::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
}

@media screen and (min-width: 769px) {
  .ttl {
    margin-bottom: 68px;
  }
  .ttl h2::before {
    vertical-align: inherit;
    width: 40px;
    height: 40px;
  }
}
.arrow {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
}
.arrow::before, .arrow::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.sliderArea {
  max-width: 1100px;
  /*margin: 70px 0 0;*/
  padding: 0;
}
.sliderArea img {
  width: 100%;
}

.slider {
  overflow: hidden;
}

@media screen and (min-width: 769px) {
  .sliderArea {
    margin: 70px auto 50px;
    padding: 0 25px;
    max-width: 1400px;
  }
}
@media screen and (min-width: 1200px) {
  .sliderArea {
    margin: 0 auto 50px;
  }
}
.sliderArea.w300 {
  max-width: 300px;
}

.slick-slide {
  margin: 0 5px;
}

.slick-slide img {
  width: 100%;
  height: auto;
}

.slick-prev, .slick-next {
  z-index: 1;
  width: 30px;
  height: 30px;
}

.slick-prev {
  left: 7%;
}

.slick-next {
  right: 7%;
}

.slick-prev:before, .slick-next:before {
  color: #333;
  opacity: 1;
  font-size: 30px;
}

.slick-slide {
  transition: all ease-in-out 0.3s;
  opacity: 0.2;
}

.slick-active {
  opacity: 1;
}

.slick-current {
  opacity: 1;
}

.slick-list {
  width: 100%;
}

.slick-arrow:before {
  content: " " !important;
}

.slick-arrow:before {
  content: " " !important;
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
}

.slick-next:before {
  background: url("../img/top/s-right.png");
  background-size: 98%;
  margin-left: 5px;
  background-repeat: no-repeat;
}

.slick-prev:before {
  background: url("../img/top/s-left.png");
  background-size: 98%;
  margin-right: 10px;
  background-repeat: no-repeat;
}

.thumb.stop .slick-list .slick-track {
  transform: unset !important;
}

@media screen and (min-width: 769px) {
  .slick-list {
    max-width: 78%;
    margin: 0 auto;
  }
}
.thumb {
  margin: 20px auto 0;
  max-width: 1200px;
}

.thumb .slick-slide {
  cursor: pointer;
}

.thumb .slick-slide:hover {
  opacity: 0.7;
}

.information {
  padding: 30px 5%;
}
.information img {
  display: block;
  max-width: 490px;
  width: 100%;
  margin: 0 auto;
}
.information .whatisnew {
  margin: 60px auto 0;
  max-width: 490px;
}
.information .whatisnew .newsttl {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background-color: #333333;
  padding: 10px 0;
}
.information .whatisnew .newsttl h2 {
  color: #fff;
  font-size: 2.4rem;
  margin-bottom: 0;
  text-align: center;
}
.information .whatisnew .newsttl img {
  width: 32px;
  margin: 0;
}
.information .newslist {
  background-color: #F6F9FE;
  padding: 5%;
}
.information .newslist a {
  color: #333333;
}
.information .newslist a:hover {
  color: #DF2626;
}
.information .newslist dt, .information .newslist dd {
  text-align: left;
  margin-bottom: 0;
}
.information .newslist dt {
  font-weight: bold;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}
.information .newslist dd {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.information .newslist dl {
  padding: 10px 0;
}
.information .newslist .to-list-page {
  display: inherit;
  width: 85px;
  margin: 16px 26px 0 auto;
}
.information .newslist .to-list-page p {
  color: #333333;
  text-align: right !important;
  margin-bottom: 0;
  transition: 0.3s;
}
.information .newslist .to-list-page p:hover {
  color: #DF2626;
}
.information .newslist .to-list-page::after {
  width: 6px;
  height: 6px;
  border-top: 2px solid #DF2626;
  border-right: 2px solid #DF2626;
  transform: rotate(45deg);
  right: -10px;
}

@media screen and (min-width: 1190px) {
  .information {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto;
    gap: 30px;
    padding: 30px 5% 100px;
  }
  .information .whatisnew {
    display: flex;
    max-width: 550px;
    width: 100%;
    margin: 0;
  }
  .information .whatisnew .newsttl {
    padding: 0;
    width: 120px;
    height: 220px;
    box-sizing: border-box;
    flex-direction: column;
  }
  .information .whatisnew .newsttl h2 {
    writing-mode: vertical-rl;
    letter-spacing: 5px;
  }
  .information .whatisnew .newsttl img {
    width: 42px;
    margin: 0 auto -10px;
  }
  .information .newslist {
    padding: 20px 5% 22px;
  }
  .information .newslist a:hover {
    color: #DF2626;
  }
  .information .newslist dl {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }
  .information .newslist dt {
    margin-right: 20px;
    width: 90px;
  }
  .information .newslist dd {
    width: calc(100% - 80px);
  }
  .information .newslist .to-list-page {
    margin-top: 0;
    padding: 10px 0;
  }
}
.product {
  max-width: 1100px;
  margin: 0 auto;
}
.product .tab {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.product .tab li {
  display: block;
  width: 31%;
}
.product .tab li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #333333;
  margin: 0 2px;
  padding: 14px 0.2rem 18px;
  border-top: 4px solid #333;
}
.product .tab li a p {
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
}
.product .tab li a p::after {
  top: 40px;
  right: 40%;
  width: 8px;
  height: 8px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  transform: rotate(135deg);
}
.product .tab li a p span {
  display: none;
}

/*liにactiveクラスがついた時の形状*/
.tab li.active a {
  background: #F6F9FE;
  border-top: 4px solid #DF2626 !important;
  padding: 14px 0.2rem 18px;
}
.tab li.active p {
  color: #333333 !important;
}
.tab li.active p::after {
  top: 40px;
  right: 40%;
  width: 8px;
  height: 8px;
  border-top: 3px solid #DF2626 !important;
  border-right: 3px solid #DF2626 !important;
  transform: rotate(135deg);
}

/*エリアの表示非表示と形状*/
.area {
  display: none; /*はじめは非表示*/
  opacity: 0; /*透過0*/
  background: #F6F9FE;
  padding: 42px 4% 32px;
}

/*areaにis-activeというクラスがついた時の形状*/
.area.is-active {
  display: block; /*表示*/
  animation-name: displayAnime; /*ふわっと表示させるためのアニメーション*/
  animation-duration: 2s;
  animation-fill-mode: forwards;
}

@keyframes displayAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.product h2::before {
  background-image: url("../img/top/magnifyingglass.png");
}
.product a {
  color: #333333;
  text-decoration: none;
}
.product a:hover {
  color: #DF2626;
}
.product .wrapper {
  width: 100%;
  max-width: 960px;
  margin: 30px auto;
  background: #fefefe;
}
.product .area ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  max-width: 500px;
  margin: 0 auto;
}
.product .area ul li {
  width: 48%;
}
.product .area ul li img {
  max-width: 140px;
  width: 100%;
  margin: 0 auto;
  display: block;
}
.product .area ul li p {
  text-align: center;
  font-size: 1.55rem;
  margin-top: 10px;
}
.product .area .shape-area li:last-child {
  word-break: keep-all;
}
@media screen and (min-width: 769px) {
  .product .area ul {
    max-width: 1030px;
    justify-content: inherit;
    gap: 30px 2%;
  }
  .product .area ul li {
    width: 22.5%;
  }
  .product .area .shape-area {
    gap: 2%;
  }
  .product .area .shape-area li {
    width: 18.4%;
  }
  .product #maker ul {
    max-width: 1030px;
    margin: 0 auto;
    gap: 30px 3%;
  }
  .product #maker ul li a img {
    max-width: 209px;
  }
}

.button {
  display: block;
  margin: 40px auto 50px;
}

@media screen and (min-width: 769px) {
  .product {
    /*liにactiveクラスがついた時の形状*/
  }
  .product .tab li a {
    padding: 12px 0 14px 10%;
    max-width: 348px;
  }
  .product .tab li a p {
    margin-bottom: 0;
  }
  .product .tab li a p::after {
    top: 0;
    right: 115%;
    transform: rotate(45deg);
  }
  .product .tab li a p span {
    display: inline-block;
    font-size: 1.8rem;
    font-weight: bold;
  }
  .product .tab li.active p {
    color: #333333;
  }
  .product .tab li.active p::after {
    top: 0;
    right: 115%;
    transform: rotate(135deg);
  }
  .product .product a {
    text-decoration: none;
  }
  .product .product .wrapper {
    width: 100%;
    max-width: 960px;
    margin: 30px auto;
    background: #fefefe;
  }
  .product .product .area ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
  }
  .product .product .area ul li {
    padding: 0.6rem;
  }
  .product .product .area ul li :hover {
    opacity: 0.7;
  }
}
.introductionexample {
  padding: 15px 0 50px;
  background-color: #F6F9FE;
}
.introductionexample h2::before {
  background-image: url("../img/top/tools.png");
}
.introductionexample ul .card {
  background-color: #fff;
  max-width: 342px;
  margin: 40px auto 0;
  box-shadow: 0 0 10px rgba(51, 51, 51, 0.05);
  position: relative;
}
.introductionexample ul .card a {
  height: 100%;
  display: block;
}
.introductionexample ul .card::after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 85%;
  top: 90%;
  width: 8px;
  height: 8px;
  border-top: 3px solid #DF2626;
  border-right: 3px solid #DF2626;
  transform: rotate(45deg);
}
.introductionexample ul .card img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 229.84px;
}
.introductionexample ul .card .card-contents {
  padding: 20px 30px 30px;
}
.introductionexample ul .card .card-contents h3 {
  font-size: 1.7rem;
  font-weight: 500;
  color: #333333;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.introductionexample ul .card .card-contents .tag-wrap {
  margin-top: 16px;
}
.introductionexample ul .card .card-contents .tag-wrap .tag-list {
  color: #777;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 15px 20px;
}
.introductionexample ul .card .card-contents .tag-wrap .tag-list .tag {
  font-size: 1.4rem;
  padding: 1px 12px;
  border: 2px solid #d1d1d1;
  border-radius: 13px;
  width: -moz-fit-content;
  width: fit-content;
}
.introductionexample .button {
  display: block;
  margin: 40px auto 0;
  background: #F6F9FE;
}

@media screen and (min-width: 769px) {
  .introductionexample {
    padding: 65px 0 50px;
  }
  .introductionexample .card-box {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
  }
  .introductionexample .card-box .card-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start;
    gap: 40px;
    max-width: 720px;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    padding: 0 0 20px;
  }
  .introductionexample .card-box .card-list .card {
    display: block;
    max-width: 340px;
    margin: 0;
    padding-bottom: 20px;
  }
  .introductionexample .card-box .card-list .card a img {
    height: 228.5px;
  }
  .introductionexample .card-box .card-list .card:hover a {
    opacity: 0.7;
  }
  .introductionexample .card-box .card-list .card:hover a img {
    opacity: 1;
  }
  .introductionexample .card-box .card-list .card:hover::after:hover {
    opacity: 0.7;
  }
}
@media screen and (min-width: 1120px) {
  .introductionexample .card-box .card-list {
    max-width: 1100px;
    width: 100%;
  }
}
.button {
  border: 2px solid #DF2626;
  background-color: #fff;
  padding: 10px 40px 13px;
  width: 140px;
  display: block;
  margin: 40px auto 50px;
}
.button p {
  color: #DF2626;
  font-size: 1.6rem;
  text-align: center;
  margin: 0 0 0 10px;
}
.button p::after {
  top: 1px;
  right: -15px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #DF2626;
  border-right: 2px solid #DF2626;
  transform: rotate(45deg);
}
.button:hover {
  background: #DF2626 !important;
}
.button:hover p {
  color: #fff;
}
.button:hover p::after {
  top: 1px;
  right: -15px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}

@media screen and (min-width: 769px) {
  .button {
    margin: 45px auto 120px;
  }
}
.feature h2::before {
  background-image: url("../img/top/checklist.png");
}
.feature .feature-contents .f-img {
  width: 100%;
  height: 100%;
  max-width: 550px;
  margin: 0 auto;
  display: block;
}
.feature .feature-contents__text {
  padding: 20px 5% 30px;
}
.feature .feature-contents__text img {
  display: block;
  margin: 0 auto;
}
.feature .feature-contents__text h3 {
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}
.feature .feature-contents__text h3 span {
  color: #DF2626;
  font-weight: bold;
}
.feature .feature-contents__text p {
  line-height: 1.7;
}

@media screen and (min-width: 769px) {
  .feature {
    padding: 100px 5% 70px;
    max-width: 1200px;
    margin: 0 auto;
  }
  .feature .feature-contents {
    display: flex;
    flex-direction: row-reverse;
    margin-bottom: 50px;
    padding-top: 50px;
  }
  .feature .feature-contents .f-img {
    width: 50%;
    margin: 0;
  }
  .feature .feature-contents__text {
    padding: 0;
    max-width: 540px;
    margin-top: -75px;
  }
  .feature .feature-contents__text img {
    margin: 0 auto 0 0;
  }
  .feature .feature-contents__text h3 {
    text-align: left;
    margin-bottom: 20px;
  }
  .feature .odd {
    margin-right: 50px;
  }
  .feature .odd .f-img {
    margin-left: 60px;
  }
  .feature .even {
    flex-direction: row;
    margin-left: 50px;
    padding: 80px 0 60px;
  }
  .feature .even .f-img {
    margin-right: 60px;
  }
}
.merit {
  padding: 30px 5%;
  margin: 0 5% 40px;
  background-color: #FDEEEE;
  border-radius: 10px;
}
.merit .arrow_box {
  position: relative;
  width: 190px;
  height: 80px;
  padding: 0 5px 10px;
  text-align: center;
  border-bottom: 4px solid;
  border-right: 4px solid;
  border-color: #DF2626;
  border-bottom-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-bottomright: 10px;
  margin: 0 auto;
}
.merit .arrow_box::after, .merit .arrow_box::before {
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 84%;
}
.merit .arrow_box::after {
  border-color: rgba(223, 38, 38, 0);
  border-top-width: 11px;
  border-bottom-width: 11px;
  border-left-width: 9px;
  border-right-width: 9px;
  margin-left: -9px;
  border-top-color: #FDEEEE;
}
.merit .arrow_box::before {
  border-color: rgba(223, 38, 38, 0);
  border-top-width: 15px;
  border-bottom-width: 15px;
  border-left-width: 13px;
  border-right-width: 13px;
  margin-left: -13px;
  margin-top: 4px;
  border-top-color: #DF2626;
}
.merit .arrow_box h4 {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
}
.merit .arrow_box h4::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/top/uni.png");
  background-size: contain;
  vertical-align: super;
  position: absolute;
  top: -10px;
  left: 5px;
}
.merit ul {
  padding-left: 20px;
  padding-top: 20px;
  list-style-type: disc;
  list-style-position: outside;
}
.merit ul li {
  margin-top: 16px;
  text-indent: -2rem;
}
.merit ul li::before {
  content: " ";
  position: relative;
  display: inline-block;
  width: 14px;
  height: 14px;
  background-image: url("../img/top/check.png");
  background-size: contain;
  margin-right: 10px;
}

@media screen and (min-width: 769px) {
  .merit {
    max-width: 674px;
    margin: 0 auto 70px;
    display: flex;
    align-items: center;
    padding: 25px 5% 35px 2%;
  }
  .merit .arrow_box {
    background: #FDEEEE;
    padding: 0;
  }
  .merit .arrow_box::after, .merit .arrow_box::before {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    left: 100%;
    top: 71%;
  }
  .merit .arrow_box::after {
    border-color: rgba(223, 38, 38, 0);
    border-top-width: 12px;
    border-bottom-width: 12px;
    border-left-width: 12px;
    border-right-width: 12px;
    margin-top: -12px;
    margin-left: -1px;
    border-left-color: #FDEEEE;
  }
  .merit .arrow_box::before {
    border-color: rgba(223, 38, 38, 0);
    border-top-width: 14px;
    border-bottom-width: 14px;
    border-left-width: 14px;
    border-right-width: 14px;
    margin-top: -14px;
    margin-left: 4px;
    border-left-color: #DF2626;
  }
  .merit ul {
    padding-top: 0;
  }
}
.shoplist {
  padding: 30px 5% 0;
}
.shoplist h2::before {
  background-image: url("../img/top/shop.png");
}
.shoplist h3 {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 10px;
}
.shoplist p {
  margin-bottom: 15px;
}
.shoplist li {
  margin: 0 auto 30px;
  padding: 25px;
  border-radius: 10px;
  max-width: 285px;
}
.shoplist li:last-child {
  margin-bottom: 0 !important;
}
.shoplist li .map-button {
  padding: 5px 15px 5px 10px;
  background-color: #FFD83F;
  font-weight: bold;
}
.shoplist li .map-button:hover {
  background-color: #ffe88c;
}
.shoplist li .map-button p {
  color: #333333;
  margin-bottom: 5px;
}
.shoplist li .map-button p::after {
  content: "";
  display: inline-block;
  position: relative;
  top: -3px;
  right: -5px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #333333;
  border-right: 2px solid #333333;
  transform: rotate(45deg);
}
.shoplist li .tellink {
  margin-bottom: 0;
  margin-top: 15px;
  display: block;
  color: #333333;
  font-weight: bold;
}
.shoplist li .tellink::before {
  content: "";
  display: inline-block;
  background-image: url("../img/top/freedial-bk.png");
  vertical-align: middle;
  background-size: contain;
  width: 28px;
  height: 28px;
  margin-right: 10px;
  margin-bottom: 4px;
}
.shoplist li:nth-child(odd) {
  background-color: #F6F9FE;
}
.shoplist li:nth-child(even) {
  border: solid 5px;
  border-color: #F6F9FE;
  padding: 20px;
}

@media screen and (min-width: 769px) {
  .shoplist {
    padding: 105px 5% 120px;
  }
  .shoplist ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 40px;
    max-width: 1100px;
    margin: 0 auto;
  }
  .shoplist ul li {
    width: 100%;
    margin: 0;
  }
}
header {
  height: 70px;
}
@media screen and (min-width: 1200px) {
  header {
    height: 130px;
  }
}

.list-page {
  background-image: url("../img/list/list-topimg-sp.jpg");
  background-size: cover;
  background-position: right;
  background-repeat: no-repeat;
}
.list-page .ttlArea img {
  width: 36px;
  height: 38.5px;
  margin-right: 10px;
  margin-top: 2px;
}
.list-page .ttlArea h2 {
  margin-bottom: 0;
  letter-spacing: 0.1em;
}

@media screen and (min-width: 769px) {
  .list-page {
    background-image: url("../img/list/list-topimg-pc.jpg");
  }
  .list-page .ttlArea img {
    width: 70px;
    height: 72px;
    margin-right: 28px;
  }
  .list-page .ttlArea h2 {
    text-align: left;
    max-width: 1100px;
  }
}
.list-container {
  padding: 0 5%;
  margin: 0 auto;
  max-width: 500px;
}

@media screen and (min-width: 1100px) {
  .list-container {
    display: flex;
    justify-content: space-between;
    gap: 60px;
    max-width: 1100px;
    margin: 0 auto;
  }
  .list-container .side {
    width: 100%;
    max-width: 280px;
  }
  .list-container .list-main {
    width: 100%;
    max-width: 760px;
  }
}
/*アコーディオン全体*/
.menu-pc {
  display: none;
}

.menu-sp {
  width: 100%;
  max-width: 500px;
  margin: 0 auto 30px;
  background-color: #F6F9FE;
}

.menu-sp #menu_bar01 {
  display: none; /*チェックボックスを隠す*/
}

/*バー部分*/
.menu-sp label {
  cursor: pointer;
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: left;
  margin-bottom: 0;
  background-color: #FFEB42;
  background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  padding: 18px 0 19px;
}
.menu-sp label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 27px;
  background-image: url("../img/list/filter.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
  margin-left: 24px;
}

/*開いたときに表示される部分*/
.menu-sp ul {
  display: none;
  margin: 0;
  list-style: none;
  margin-bottom: 1px;
}

.menu-sp li {
  display: none;
  margin-bottom: 20px;
  overflow-y: hidden;
  transition: padding-bottom 0.5s, padding-top 0.5s; /*閉じるときのアニメーション*/
  -webkit-transition: padding-bottom 0.5s, padding-top 0.5s;
  -moz-transition: padding-bottom 0.5s, padding-top 0.5s;
  -ms-transition: padding-bottom 0.5s, padding-top 0.5s;
  -o-transition: padding-bottom 0.5s, padding-top 0.5s;
}
.menu-sp li h4 {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 1rem;
  border-left: 3px solid #DF2626;
  margin-bottom: 8px;
}
.menu-sp li .keyword-input {
  box-sizing: border-box;
  border: none;
  padding: 11px;
  border-radius: 10px;
  width: 100%;
  display: block;
  font-size: 1.6rem;
  /*被りを消す*/
  height: auto;
  line-height: inherit;
  color: inherit;
  background-image: inherit;
  background-color: #fff;
}
.menu-sp li select {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  border: none;
  padding: 12px;
  border-radius: 10px;
  width: 100%;
  display: block;
  background-color: #fff;
  appearance: none; /* デフォルトの矢印を非表示 */
  background-image: url("../img/list/triangle-gr.png");
  background-position: right 14px center;
  background-repeat: no-repeat;
  color: #777;
  font-size: 1.6rem;
}
#menu_bar01:checked ~ #links01 {
  display: block;
  animation: appear 1s ease;
  padding: 30px 20px 28px;
}

@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
#menu_bar01:checked ~ #links01 li {
  display: block;
  height: auto !important; /*開いたときに表示されるliの高さ*/
  opacity: 1;
}
/*開いたときの下の余白*/
#menu_bar01:checked ~ #links01 li:last-child {
  margin-bottom: 0px;
}

/*閉じた状態の矢印描画*/
.menu-sp label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333 3px solid;
  border-right: #333 3px solid;
  transform: rotate(135deg);
  position: absolute;
  right: 7%;
  top: 0;
  bottom: 15%;
  margin: auto;
}

/*開いた状態の矢印描画*/
.menu-sp input[type=checkbox]:checked + label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333 3px solid;
  border-right: #333 3px solid;
  transform: rotate(-45deg);
  position: absolute;
  right: 7%;
  top: 7%;
  bottom: 0;
  margin: auto;
}

.search-button {
  border: 0px;
  background: url("../img/list/btn-sp.png");
  background-repeat: no-repeat;
  background-size: contain;
  width: 280px;
  height: 56px;
  margin: 0 auto;
  display: block;
  cursor: pointer;
}

@media screen and (min-width: 1100px) {
  .menu-sp {
    display: none;
  }
  .menu-pc {
    display: block;
    max-width: 280px;
    margin: 0 auto;
    background-color: #F6F9FE;
    padding-bottom: 28px;
  }
  .menu-pc h3 {
    position: relative;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0;
    background-color: #FFEB42;
    background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
    padding: 18px 0 19px;
  }
  .menu-pc h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 27px;
    background-image: url("../img/list/filter.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 10px;
  }
  .menu-pc h3::after {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
    border-right-width: 5px;
    margin-left: -5px;
    border-top-color: #FFEB42;
    top: 100%;
    left: 50%;
  }
  .menu-pc ul {
    padding: 30px 28px 0;
  }
  .menu-pc ul li {
    margin-bottom: 22px;
  }
  .menu-pc ul li:nth-last-child(2) {
    margin-bottom: 24px;
  }
  .menu-pc ul li:last-child {
    margin-bottom: 0;
  }
  .menu-pc ul li h4 {
    font-size: 1.8rem;
    font-weight: bold;
    padding: 2px 1rem;
    border-left: 3px solid #DF2626;
    margin-bottom: 9px;
  }
  .menu-pc ul li .keyword-input {
    box-sizing: border-box;
    width: 100%;
    border: none;
    padding: 16px 12px;
    border-radius: 10px;
    display: block;
    /*被りを消す*/
    height: auto;
    line-height: inherit;
    color: inherit;
    background-image: inherit;
    background-color: #fff;
  }
  .menu-pc ul li select {
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    border: none;
    padding: 16px 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
    background-color: #fff;
    appearance: none; /* デフォルトの矢印を非表示 */
    background-image: url("../img/list/triangle-gr.png");
    background-position: right 14px center;
    background-repeat: no-repeat;
    color: #777;
  }
  .menu-pc .search-button {
    background: url("../img/list/btn-pc.png");
    width: 224px;
    height: 56px;
    max-width: inherit;
    padding: inherit;
    border-radius: inherit;
    background-repeat: no-repeat;
    background-size: contain;
    transition: 0.3s;
  }
  .menu-pc .search-button:hover {
    opacity: 0.7;
  }
}
.flyer-pc {
  display: none;
}

@media screen and (min-width: 1100px) {
  .flyer-pc {
    display: block;
  }
  .flyer-pc img {
    max-width: 280px;
    margin-top: 40px;
  }
}
.list-container .cta-sp {
  max-width: 500px;
  margin: 0 auto 50px;
  border: 1px dashed #333333;
  padding: 11px 16px;
}
.list-container .cta-sp .evocation {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin-bottom: 12px;
}
.list-container .cta-sp .evocation::before, .list-container .cta-sp .evocation::after {
  content: "";
  width: 2px;
  height: 36px;
  background-color: #333333;
}
.list-container .cta-sp .evocation::before {
  margin-right: 18px;
  transform: rotate(-35deg);
}
.list-container .cta-sp .evocation::after {
  margin-left: 18px;
  transform: rotate(35deg);
}
.list-container .cta-sp .cta-mini {
  display: flex;
  justify-content: space-around;
  margin-bottom: 12px;
  gap: 6px;
}
.list-container .cta-sp .cta-mini .mail-mini, .list-container .cta-sp .cta-mini .tell-mini {
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  background-color: #DF2626;
  border-radius: 8px;
  width: 40%;
  padding: 5px 10px;
}
.list-container .cta-sp .cta-mini .mail-mini::before, .list-container .cta-sp .cta-mini .tell-mini::before {
  content: "";
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: bottom;
  margin-right: 4%;
  margin-bottom: 4px;
}
.list-container .cta-sp .cta-mini .mail-mini::before {
  width: 24px;
  height: 18px;
  background-image: url("../img/list/mail-wt.png.png");
}
.list-container .cta-sp .cta-mini .tell-mini::before {
  width: 27px;
  height: 18px;
  background-image: url("../img/list/freedial-wt.png.png");
}
.list-container .cta-sp p {
  margin-bottom: 0;
  text-align: center;
}
@media screen and (min-width: 1100px) {
  .list-container .cta-sp {
    display: none;
  }
}
.list-container .cta-pc {
  display: none;
}
@media screen and (min-width: 1100px) {
  .list-container .cta-pc {
    display: block;
    border: 2px dashed #333333;
    padding: 30px 38px;
    max-width: 680px;
    margin: 0 auto 60px;
  }
  .list-container .cta-pc .evocation {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    text-align: center;
    margin-bottom: 24px;
    font-size: 2rem;
  }
  .list-container .cta-pc .evocation::before, .list-container .cta-pc .evocation::after {
    content: "";
    width: 2px;
    height: 32px;
    background-color: #333333;
  }
  .list-container .cta-pc .evocation::before {
    margin-right: 18px;
    transform: rotate(-35deg);
  }
  .list-container .cta-pc .evocation::after {
    margin-left: 18px;
    transform: rotate(35deg);
  }
  .list-container .cta-pc .contents {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .list-container .cta-pc .contents img {
    width: 220px;
  }
  .list-container .cta-pc .contents .right .cta-mini {
    background-color: #DF2626;
    margin: 0 auto;
    border-radius: 15px;
    width: 330px;
    height: 50px;
    padding: 15px 40px 15px 15px;
    font-size: 2rem;
    color: #fff;
    text-align: center;
    display: block;
    margin-bottom: 10px;
  }
  .list-container .cta-pc .contents .right .cta-mini:hover {
    opacity: 0.7;
  }
  .list-container .cta-pc .contents .right .cta-mini p {
    padding: 10px 0 0;
  }
  .list-container .cta-pc .contents .right .cta-mini span {
    font-size: 1.6rem;
    color: #DF2626;
    max-width: 40px;
    padding: 12px 6px 12px 12px;
    background-color: #fff;
    border-radius: 10px;
    font-weight: bold;
    margin-right: 10px;
  }
  .list-container .cta-pc .contents .right .tell {
    font-size: 3.2rem;
    font-weight: bold;
    color: #DF2626;
    text-align: center;
    margin-bottom: 0;
    font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  }
  .list-container .cta-pc .contents .right .tell::before {
    content: "";
    display: inline-block;
    width: 66px;
    height: 66px;
    background-image: url("../img/list/freedial-rd.png.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 2%;
    margin-bottom: 5px;
  }
}

.result-title {
  border-top: 4px solid #DF2626;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  background-color: #F6F9FE;
  max-width: 760px;
  margin: 0 auto 24px;
  padding: 12px 3% 12px;
  line-height: 1em;
  align-items: center;
}
.result-title h3 {
  font-size: 1.8rem;
  font-weight: bold;
}
.result-title h3 span {
  font-size: 2.8rem;
  font-weight: bold;
  color: #DF2626;
}
.result-title select {
  border: 2px solid #DF2626;
  background-color: #fff;
  border-radius: 4px;
  padding: 7px 38px 7px 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none; /* デフォルトの矢印を非表示 */
  background-image: url("../img/list/triangle-rd.png");
  background-position: right 14px center;
  background-repeat: no-repeat;
  color: #333333;
}
.result-detail {
  max-width: 335px;
  margin: 0 auto 40px;
}
.result-detail .result-product {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-bottom: 16px;
  position: relative;
  transition: 0.3s;
}
.result-detail .result-product:hover {
  opacity: 0.7;
}
.result-detail .result-product img {
  width: 335px;
  height: 335px;
  -o-object-fit: cover;
     object-fit: cover;
  margin: 0 auto;
  display: block;
  outline: 1px solid #333;
}
.result-detail .result-product img:hover {
  opacity: 1;
}
.result-detail .result-product__note {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  max-width: 335px;
  width: 100%;
  position: absolute;
  top: 0;
}
.result-detail .result-product__note img {
  width: 130px;
  height: auto;
  margin: 10px auto 0 15px;
  outline: none;
}
.result-detail .result-product__note img:hover {
  opacity: 1;
}
.result-detail .result-product__note .modelnumber {
  display: flex;
  margin: -1px -1px 0 0;
}
.result-detail .result-product__note .modelnumber .modelnumber-title {
  border-top: 1px solid #333333;
  border-left: 1px solid #333333;
  border-bottom: 1px solid #333333;
  color: #fff;
  background-color: #777;
  padding: 3px 8px;
  font-size: 1.4rem;
}
.result-detail .result-product__note .modelnumber .modelnumber-number {
  border: 1px solid #333333;
  padding: 3px 8px;
  color: #333333;
  background-color: #fff;
  font-size: 1.4rem;
}
.result-detail h4 {
  font-size: 2.4rem;
  margin-bottom: 10px;
  font-weight: 500;
}
.result-detail .tag-list {
  margin-bottom: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  border-bottom: 1px solid #707070;
  padding-bottom: 16px;
}
.result-detail .tag-list .tag {
  font-size: 1.4rem;
  color: #777;
  border: 1px solid #d1d1d1;
  border-radius: 100vh;
  padding: 2px 9px;
}
.result-detail .price {
  margin-bottom: 20px;
}
.result-detail .price p {
  margin-bottom: 0;
}
.result-detail .price p .span-naname {
  position: relative;
}
.result-detail .price p .span-naname::before {
  position: absolute;
  content: "";
  display: block;
  transform: rotate(-6deg);
  background-color: #DF2626;
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
}
.result-detail .price p .span-bold {
  font-size: 2.4rem;
  font-weight: bold;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}
.result-detail .price .price2 {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.result-detail .price .price2 img {
  width: 32px;
}
.result-detail .price .price2 p {
  color: #DF2626;
  font-size: 2rem;
  font-weight: bold;
  text-align: right;
  background: linear-gradient(transparent 70%, #FFEB42 70%);
  width: -moz-fit-content;
  width: fit-content;
  margin-left: 7px;
}
.result-detail .price .price2 p span {
  font-size: 3.6rem;
  font-weight: bold;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}
.result-detail .detail-button, .result-detail .estimate-button {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  border-radius: 100vh;
  padding: 10px 0;
  margin-bottom: 8px;
  display: block;
}
.result-detail .detail-button p, .result-detail .estimate-button p {
  margin-bottom: 0;
}
.result-detail .detail-button {
  color: #DF2626;
  border: 1px solid #DF2626;
}
.result-detail .detail-button:hover {
  opacity: 0.7;
}
.result-detail .estimate-button {
  color: #fff;
  background-color: #DF2626;
}
.result-detail .estimate-button:hover {
  opacity: 0.7;
}

@media screen and (max-width: 374px) {
  .result-detail {
    max-width: 300px;
  }
  .result-detail .result-product img {
    width: 300px;
    height: 300px;
  }
  .result-detail .result-product .result-product__note {
    max-width: 300px;
  }
  .result-detail .result-product .result-product__note img {
    width: 100px;
    height: auto;
  }
}
@media screen and (min-width: 1100px) {
  .result .result-title {
    margin: 0 auto 60px;
  }
  .result .result-title h3 {
    font-size: 2.8rem;
  }
  .result .result-title h3 span {
    font-size: 4.8rem;
  }
  .result .result-title .box select {
    font-size: 2rem;
    padding: 7px 52px 7px 14px;
  }
  .result .wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 0 7%;
    max-width: 760px;
    margin: 0 auto 52px;
  }
  .result .wrap .result-detail {
    width: 46%;
    margin: 0 0 60px 0;
  }
  .result .result-detail {
    /*&:last-child {
    margin: 0 auto 0 0 !important;
    }*/
  }
  .result .result-detail h4 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 70px;
  }
  .result .result-detail .tag-list {
    padding-bottom: 18px;
    height: 90px;
    align-items: center;
    align-content: center;
  }
  .result .result-detail .tag-list .tag {
    height: 20px;
  }
  .result .result-detail .tag-list .tag:hover {
    opacity: 0.7;
  }
}
@media screen and (min-width: 1080px) and (max-width: 1220px) {
  .wrap:after {
    content: "";
    display: block;
    width: 310px; /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
  }
  .result-detail {
    max-width: 310px;
  }
  .result-detail .result-product img {
    width: 310px;
    height: 310px;
  }
  .result-detail .result-product .result-product__note {
    max-width: 310px;
  }
  .result-detail .result-product .result-product__note img {
    width: 100px;
    height: auto;
  }
}
@media screen and (min-width: 1220px) {
  .wrap:after {
    content: "";
    display: block;
    width: 350px; /* .boxに指定したwidthと同じ幅を指定する */
    height: 0;
  }
  .result-detail {
    max-width: 350px;
  }
  .result-detail .result-product img {
    width: 350px;
    height: 350px;
  }
  .result-detail .result-product .result-product__note {
    max-width: 350px;
  }
  .result-detail .result-product .result-product__note img {
    width: 100px;
    height: auto;
  }
}
.pagenation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: -20px auto 70px;
}
.pagenation .forward, .pagenation .next {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 50px;
}
.pagenation .forward a, .pagenation .next a {
  color: #333333;
  border: inherit;
  font-size: 1.6rem;
  font-weight: inherit;
  font-family: "Noto Sans JP", "Noto Sans JP", "Noto Sans Japanese", sans-serif;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: -6px;
}
.pagenation .forward a img, .pagenation .next a img {
  width: 8px;
  margin-top: 2px;
}
.pagenation li {
  margin-top: 20px;
}
.pagenation .pagenation-n {
  width: 40px;
  height: 40px;
}
.pagenation .pagenation-n a {
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  display: block;
  padding: 5px 0;
  line-height: 1;
  background-color: #fff;
  border: 2px solid #DF2626;
  font-size: 2.4rem;
  font-weight: bold;
  color: #DF2626;
  text-align: center;
}
.pagenation .pagenation-n.active a {
  background-color: #DF2626;
  color: #fff;
}
.pagenation .threepoint {
  width: 20px !important;
  margin: 0;
  padding-top: 30px !important;
}
.pagenation .threepoint::before {
  content: "";
  width: 2rem;
  height: 4px;
  background-image: url("../img/list/three-point.png");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  padding-bottom: 10px;
}

@media screen and (min-width: 1100px) {
  .pagenation {
    margin: 0 auto 120px;
  }
  .pagenation .forward, .pagenation .next {
    width: 76px;
  }
  .pagenation .forward a, .pagenation .next a {
    font-size: 2.4rem;
    margin-top: -7px;
  }
  .pagenation .forward a img, .pagenation .next a img {
    width: 12px;
    margin-top: 4px;
  }
  .pagenation .forward {
    margin-right: 10px;
  }
  .pagenation .next {
    margin-left: 10px;
  }
  .pagenation li {
    margin-top: 0 !important;
    width: 50px;
    height: 50px;
  }
  .pagenation li span {
    font-size: 2.8rem;
    padding: 11px 5px;
  }
  .pagenation li a {
    padding: 11px 5px;
    font-size: 2.8rem;
  }
  .pagenation li a:hover {
    opacity: 0.7;
  }
  .threepoint {
    margin: 0 10px !important;
  }
}
.flyer-sp {
  padding: 0 5%;
}
.flyer-sp img {
  max-width: 335px;
  width: 100%;
  margin: 0 auto 50px;
  display: block;
}

@media screen and (min-width: 1100px) {
  .flyer-sp {
    display: none;
  }
}
header {
  height: 70px;
}
@media screen and (min-width: 1200px) {
  header {
    height: 155px;
  }
}

.list-detail-container {
  max-width: 734px;
  padding: 0 5% 50px;
  margin: 0 auto;
  /*アコーディオン全体*/
  /*バー部分*/
  /*開いたときに表示される部分*/
  /*開いたときの下の余白*/
  /*閉じた状態の矢印描画*/
  /*開いた状態の矢印描画*/
}
.list-detail-container .list-detail-main {
  max-width: 500px;
  margin: 0 auto;
}
.list-detail-container .list-detail-main .product-detail {
  max-width: 335px;
  margin: 0 auto;
  margin-bottom: 40px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left {
  max-width: 335px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin: 0 auto 16px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img {
  width: 100%;
  display: block;
  outline: 1px solid #333333;
  height: 335px;
  overflow: hidden;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img img {
  width: 335px;
  height: 335px;
  -o-object-fit: cover;
     object-fit: cover;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note {
  position: absolute;
  display: flex;
  align-items: flex-start;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note img {
  width: 33%;
  margin: 20px auto 0 20px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note .modelnumber {
  display: flex;
  margin: -1px -1px 0 auto;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note .modelnumber .modelnumber-title {
  border-top: 1px solid #333333;
  border-top: 1px solid #333333;
  border-top: 1px solid #333333;
  color: #fff;
  background-color: #777;
  padding: 3px 8px;
  font-size: 1.4rem;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note .modelnumber .modelnumber-number {
  border: 1px solid #333333;
  padding: 3px 8px;
  background-color: #fff;
  font-size: 1.4rem;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  margin: 16px auto 24px;
  gap: 4%;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img li img {
  border: 1px solid #333333;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img img {
  cursor: pointer;
  width: 72px;
  height: 72px;
  -o-object-fit: cover;
     object-fit: cover;
}
.list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img li.current img {
  border: 1px solid red;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right {
  max-width: 335px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons {
  display: flex;
  justify-content: flex-start;
  margin: 0 auto 10px;
  gap: 2.9%;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons p {
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 20%;
  max-width: 59px;
  height: 59px;
  color: #fff;
  font-weight: bold;
  border-radius: 8px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon1 {
  background-color: #FFEB42;
  display: inline-block;
  color: #333333;
  text-align: center;
  line-height: 1.2;
  padding: 3px 0 2px;
  height: 55px;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon1 span {
  color: #DF2626;
  font-weight: bold;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon1 span .span5 {
  font-size: 2.5rem;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon2 {
  background-color: #42C0FF;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon3 {
  background-color: #FF42BA;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon4 {
  background-color: #FFA742;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon5 {
  background-color: #ADE63C;
}
.list-detail-container .list-detail-main .product-detail .product-detail__right h2 {
  font-size: 2.4rem;
  padding-bottom: 16px;
  border-bottom: 1px dashed #333333;
  margin: 0 auto 16px;
}
.list-detail-container .list-detail-main .product-detail .r-price {
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin: 0 auto;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .makerprice {
  color: #777;
  font-size: 1.4rem;
  font-weight: bold;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .makerprice span {
  display: inline-block;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  font-size: 2rem;
  font-weight: bold;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .makerprice span .span-naname {
  position: relative;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .makerprice span .span-naname::before {
  position: absolute;
  content: "";
  display: block;
  transform: rotate(-6deg);
  background-color: #DF2626;
  width: 100%;
  height: 2px;
  top: 50%;
  left: 0;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .makerprice span .span-naname .yen {
  color: #777;
  font-size: 1.4rem;
  font-weight: bold;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .specialprice {
  color: #DF2626;
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 0;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .price2 {
  color: #DF2626;
  font-size: 2.1rem;
  margin-bottom: 0;
}
.list-detail-container .list-detail-main .product-detail .r-price__left .price2 span {
  display: inline-block;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: bold;
  font-size: 3.5rem;
}
.list-detail-container .list-detail-main .product-detail .r-price__right p {
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  font-size: 2.2rem;
  color: #DF2626;
  font-weight: bold;
  width: 96px;
  height: 96px;
  text-align: center;
  margin-bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("../img/list-detail/polygon.png");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.list-detail-container .list-detail-main .product-detail .r-price__right p span {
  font-size: 3.2rem;
  display: contents;
  font-weight: 600;
}
.list-detail-container .list-detail-main .product-detail .r-price__button p {
  background-color: #DF2626;
  color: #fff;
  width: 100%;
  border-radius: 8px;
  display: flex;
  gap: 10px;
  align-items: center;
  height: 54px;
  justify-content: center;
  font-size: 2rem;
  font-weight: bold;
  margin: 20px auto 16px;
}
.list-detail-container .list-detail-main .product-detail .r-price__button p span {
  background-color: #fff;
  color: #DF2626;
  max-width: 54px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  width: 100%;
  font-size: 1.4rem;
  font-weight: bold;
}
.list-detail-container .list-detail-main .product-detail .r-price__tel {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 74px;
  border: 1px solid #DF2626;
  border-radius: 8px;
  margin: 0 auto 40px;
}
.list-detail-container .list-detail-main .product-detail .r-price__tel div {
  display: flex;
  align-items: center;
  gap: 10px;
}
.list-detail-container .list-detail-main .product-detail .r-price__tel div a {
  color: #DF2626;
  font-size: 2.2rem;
  font-weight: bold;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}
.list-detail-container .list-detail-main .product-detail .r-price__tel p {
  font-size: 1.4rem;
  margin-bottom: 0;
}
@media screen and (min-width: 769px) {
  .list-detail-container .list-detail-main .tellink {
    display: block;
  }
}
@media screen and (min-width: 1100px) {
  .list-detail-container .list-detail-main {
    max-width: 760px;
  }
  .list-detail-container .list-detail-main .product-detail {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 4%;
    max-width: 760px;
    width: 100%;
    margin-bottom: 60px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left {
    width: 360px;
    max-width: inherit;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .product-img {
    max-width: 360px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img {
    height: 360px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img img {
    width: 360px;
    height: 360px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note img {
    height: inherit;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .product-img .main-img__note .modelnumber {
    margin: -1px -1px 0 auto;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img {
    max-width: 360px;
    margin: 15px auto 0;
    gap: 3.8%;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__left .sub-img img {
    max-width: inherit;
    width: 78px;
    height: 78px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__right {
    width: 368px;
    max-width: inherit;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons {
    max-width: 320px;
    margin: 0 0 10px;
    gap: 3.1%;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons p {
    height: 56px;
    max-width: 56px;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__right .r-icons .r-icon1 {
    padding: 1px 0 0;
  }
  .list-detail-container .list-detail-main .product-detail .product-detail__right h2 {
    width: 368px;
    max-width: inherit;
    margin: 0 auto 21px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price {
    max-width: 768px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__left .makerprice {
    font-size: 1.6rem;
    margin-bottom: 14px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__left .makerprice span .spna-naname {
    font-size: 2.2rem;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__left .price2 {
    font-size: 2.4remt;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__left .price2 span {
    font-size: 4rem;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__right p {
    width: 106px;
    height: 106px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__button p {
    max-width: 350px;
    height: 56px;
    margin: 25px auto 16px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__button:hover {
    opacity: 0.7;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__tel {
    max-width: 350px;
    height: 76px;
    margin: 0 auto;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__tel img {
    width: 40px;
    height: 40px;
  }
  .list-detail-container .list-detail-main .product-detail .r-price__tel .tellink {
    font-size: 2.4rem;
  }
}
.list-detail-container .productsummary {
  margin-bottom: 40px;
}
.list-detail-container .productsummary h2 {
  padding: 11px 12px 16px;
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  font-size: 2.4rem;
  margin-bottom: 30px;
}
.list-detail-container .productsummary h2::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  background-image: url("../img/list-detail/airconditioner.png");
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  margin-right: 10px;
  margin-top: -4px;
}
.list-detail-container .productsummary img {
  max-width: 280px;
  margin: 0 auto 20px;
  display: block;
  width: 100%;
}
.list-detail-container .productsummary p {
  margin: 0 auto;
}
@media screen and (min-width: 1100px) {
  .list-detail-container .productsummary {
    width: 760px;
    margin-bottom: 60px;
  }
  .list-detail-container .productsummary h2 {
    margin-bottom: 36px;
  }
  .list-detail-container .productsummary div {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .list-detail-container .productsummary div img {
    margin: 0 0 20px;
  }
  .list-detail-container .productsummary div p {
    max-width: 440px;
    margin: 0 10px 0 0;
  }
}
.list-detail-container .productspecifications {
  margin-bottom: 80px;
}
.list-detail-container .productspecifications h2 {
  padding: 11px 12px 16px;
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  font-size: 2.4rem;
  margin-bottom: 30px;
}
.list-detail-container .productspecifications h2::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 30px;
  background-image: url("../img/list-detail/document.png");
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  margin-right: 10px;
  margin-top: -4px;
}
.list-detail-container .productspecifications table {
  width: 100%;
  margin: 0 auto 10px;
  border-collapse: collapse;
  border-left: none;
  border-right: none;
}
.list-detail-container .productspecifications table tbody tr {
  text-align: left;
}
.list-detail-container .productspecifications table tbody tr th {
  font-weight: bold;
  border: 1px solid #d1d1d1;
  border-left: none;
  width: 68px;
  padding: 16px 20px;
}
.list-detail-container .productspecifications table tbody tr td {
  font-weight: bold;
  color: #707070;
  border: 1px solid #d1d1d1;
  border-right: none;
  padding: 16px 20px;
}
.list-detail-container .productspecifications p {
  font-size: 1.35rem;
  max-width: 350px;
  margin: 0 auto;
}
.list-detail-container .productspecifications a {
  font-size: 2rem;
  font-weight: bold;
  display: flex;
  gap: 9%;
  justify-content: center;
  align-items: center;
  margin: 30px auto 80px;
  height: 60px;
  color: #333333;
  background-color: #FFEB42;
  border-radius: 12px;
}
.list-detail-container .productspecifications a::after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #333333;
  margin-top: 3px;
}
.list-detail-container .productspecifications a:hover {
  opacity: 0.7;
}
@media screen and (min-width: 1100px) {
  .list-detail-container .productspecifications {
    margin-bottom: 120px;
  }
  .list-detail-container .productspecifications h2 {
    margin-bottom: 36px;
  }
  .list-detail-container .productspecifications table {
    max-width: 760px;
  }
  .list-detail-container .productspecifications table tbody tr th {
    width: 68px;
    padding: 16px 66px;
  }
  .list-detail-container .productspecifications table tbody tr td {
    padding: 16px 66px;
  }
  .list-detail-container .productspecifications p {
    margin: 0;
    font-size: 1.6rem;
    max-width: inherit;
  }
  .list-detail-container .productspecifications a {
    width: 350px;
    margin: 40px auto 120px;
  }
}
.list-detail-container .menu-pc {
  display: none;
}
.list-detail-container .menu-sp {
  width: 100%;
  max-width: 500px;
  margin: 0 auto 30px;
  background-color: #F6F9FE;
}
.list-detail-container .menu-sp #menu_bar01 {
  display: none; /*チェックボックスを隠す*/
}
.list-detail-container .menu-sp label {
  cursor: pointer;
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: left;
  margin-bottom: 0;
  background-color: #FFEB42;
  background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  padding: 18px 0 19px;
}
.list-detail-container .menu-sp label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 27px;
  background-image: url("../img/list/filter.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
  margin-left: 24px;
}
.list-detail-container .menu-sp ul {
  display: none;
  margin: 0;
  list-style: none;
  margin-bottom: 1px;
}
.list-detail-container .menu-sp li {
  display: none;
  margin-bottom: 20px;
  overflow-y: hidden;
  transition: padding-bottom 0.5s, padding-top 0.5s; /*閉じるときのアニメーション*/
  -webkit-transition: padding-bottom 0.5s, padding-top 0.5s;
  -moz-transition: padding-bottom 0.5s, padding-top 0.5s;
  -ms-transition: padding-bottom 0.5s, padding-top 0.5s;
  -o-transition: padding-bottom 0.5s, padding-top 0.5s;
}
.list-detail-container .menu-sp li h4 {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 1rem;
  border-left: 3px solid #DF2626;
  margin-bottom: 8px;
}
.list-detail-container .menu-sp li .keyword-input {
  border: none;
  padding: 11px;
  border-radius: 10px;
  width: 100%;
  display: block;
  font-size: 1.6rem;
  /*被りを消す*/
  height: auto;
  line-height: inherit;
  color: inherit;
  background-image: inherit;
  background-color: #fff;
}
.list-detail-container .menu-sp li select {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  border: none;
  padding: 12px;
  border-radius: 10px;
  width: 100%;
  display: block;
  background-color: #fff;
  appearance: none; /* デフォルトの矢印を非表示 */
  background-image: url("../img/list/triangle-gr.png");
  background-position: right 14px center;
  background-repeat: no-repeat;
  color: #777;
  font-size: 1.6rem;
}
.list-detail-container #menu_bar01:checked ~ #links01 {
  display: block;
  animation: appear 1s ease;
  padding: 30px 20px 28px;
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.list-detail-container #menu_bar01:checked ~ #links01 li {
  display: block;
  height: auto !important; /*開いたときに表示されるliの高さ*/
  opacity: 1;
}
.list-detail-container #menu_bar01:checked ~ #links01 li:last-child {
  margin-bottom: 0px;
}
.list-detail-container .menu-sp label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333 3px solid;
  border-right: #333 3px solid;
  transform: rotate(135deg);
  position: absolute;
  right: 7%;
  top: 0;
  bottom: 15%;
  margin: auto;
}
.list-detail-container .menu-sp input[type=checkbox]:checked + label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333 3px solid;
  border-right: #333 3px solid;
  transform: rotate(-45deg);
  position: absolute;
  right: 7%;
  top: 7%;
  bottom: 0;
  margin: auto;
}
.list-detail-container .search-button {
  border: 0px;
  background: url("../img/list/btn-sp.png");
  background-repeat: no-repeat;
  background-size: contain;
  width: 280px;
  height: 56px;
  margin: 0 auto;
  display: block;
  cursor: pointer;
}
@media screen and (min-width: 1100px) {
  .list-detail-container .menu-sp {
    display: none;
  }
  .list-detail-container .menu-pc {
    display: block;
    max-width: 280px;
    margin: 0 auto;
    background-color: #F6F9FE;
    padding-bottom: 28px;
  }
  .list-detail-container .menu-pc h3 {
    position: relative;
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0;
    background-color: #FFEB42;
    background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
    padding: 18px 0 19px;
  }
  .list-detail-container .menu-pc h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 27px;
    background-image: url("../img/list/filter.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 10px;
  }
  .list-detail-container .menu-pc h3::after {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
    border-right-width: 5px;
    margin-left: -5px;
    border-top-color: #FFEB42;
    top: 100%;
    left: 50%;
  }
  .list-detail-container .menu-pc ul {
    padding: 30px 28px 0;
  }
  .list-detail-container .menu-pc ul li {
    margin-bottom: 22px;
  }
  .list-detail-container .menu-pc ul li:nth-last-child(2) {
    margin-bottom: 24px;
  }
  .list-detail-container .menu-pc ul li:last-child {
    margin-bottom: 0;
  }
  .list-detail-container .menu-pc ul li h4 {
    font-size: 1.8rem;
    font-weight: bold;
    padding: 2px 1rem;
    border-left: 3px solid #DF2626;
    margin-bottom: 9px;
  }
  .list-detail-container .menu-pc ul li .keyword-input {
    border: none;
    max-width: 100%;
    padding: 16px 12px;
    border-radius: 10px;
    display: block;
    /*被りを消す*/
    height: auto;
    line-height: inherit;
    color: inherit;
    background-image: inherit;
    background-color: #fff;
  }
  .list-detail-container .menu-pc ul li select {
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    border: none;
    padding: 16px 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
    background-color: #fff;
    appearance: none; /* デフォルトの矢印を非表示 */
    background-image: url("../img/list/triangle-gr.png");
    background-position: right 14px center;
    background-repeat: no-repeat;
    color: #777;
  }
  .list-detail-container .menu-pc .search-button {
    background: url("../img/list/btn-pc.png");
    width: 224px;
    height: 56px;
    max-width: inherit;
    padding: inherit;
    border-radius: inherit;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .list-detail-container .menu-pc .search-button:hover {
    opacity: 0.7;
  }
}
.list-detail-container .side-flyer img {
  width: 100%;
  margin: 0 auto;
  display: block;
}
@media screen and (min-width: 1100px) {
  .list-detail-container .side-flyer img {
    margin: 40px auto 0;
  }
}

@media screen and (min-width: 1100px) {
  .list-detail-container {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-around;
    gap: 60px;
  }
}
header {
  height: 70px;
}
@media screen and (min-width: 1200px) {
  header {
    height: 130px;
  }
}

.case-page {
  background-image: url("../img/case/case-topimg-sp.png");
  background-size: cover;
  background-position: right;
  background-repeat: no-repeat;
}
.case-page .ttlArea img {
  width: 36px;
  height: 36px;
  margin-right: 10px;
}
.case-page .ttlArea h2 {
  margin-bottom: 0;
  letter-spacing: 0.1em;
}

@media screen and (min-width: 769px) {
  .case-page {
    background-image: url("../img/case/case-topimg.jpg");
  }
  .case-page .ttlArea img {
    width: 70px;
    height: 70px;
    margin-right: 30px;
  }
  .case-page .ttlArea h2 {
    text-align: left;
    max-width: 1100px;
  }
}
.case-container {
  padding: 0 5%;
  margin: 0 auto;
  max-width: 500px;
  /*アコーディオン全体*/
  /*バー部分*/
  /*開いたときに表示される部分*/
  /*開いたときの下の余白*/
  /*閉じた状態の矢印描画*/
  /*開いた状態の矢印描画*/
}
.case-container .tag-search-pc {
  display: none;
}
.case-container .tag-search-sp {
  /*min-width: 304px;*/
  max-width: 335px;
  width: 100%;
  margin: 0 auto 30px;
  margin-bottom: 50px;
}
.case-container .tag-search-sp input {
  display: none; /*チェックボックスを隠す*/
}
.case-container .tag-search-sp label {
  cursor: pointer;
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0;
  background-color: #FFEB42;
  background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  padding: 18px 38px 18px 24px;
}
.case-container .tag-search-sp label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 27px;
  background-image: url("../img/case-detail/tag.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
}
.case-container .tag-search-sp ul {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1px;
  background-color: #F6F9FE;
}
.case-container .tag-search-sp li {
  display: none;
  margin-bottom: 30px;
  overflow-y: hidden;
}
.case-container .tag-search-sp li:nth-child(2) {
  margin-bottom: 0px;
}
.case-container .tag-search-sp li h4 {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 1rem;
  border-left: 3px solid #DF2626;
  margin-bottom: 15px;
}
.case-container .tag-search-sp li ul li {
  height: 0;
  overflow-y: hidden;
}
.case-container #menu_bar01:checked ~ #links01 {
  display: block;
  animation: appear 1s ease;
  padding: 30px 20px 40px;
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.case-container #menu_bar01:checked ~ #links01 li {
  display: block;
  height: auto !important; /*開いたときに表示されるliの高さ*/
  opacity: 1;
}
.case-container #menu_bar01:checked ~ #links01 li:last-child {
  margin-bottom: 0;
}
.case-container .tag-search-sp label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(135deg);
  position: absolute;
  right: 9%;
  top: 0;
  bottom: 15%;
  margin: auto;
}
.case-container .tag-search-sp input[type=checkbox]:checked + label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(-45deg);
  position: absolute;
  right: 9%;
  top: 19%;
  bottom: 0;
  margin: auto;
}
@media screen and (min-width: 1100px) {
  .case-container .tag-search-sp {
    display: none;
  }
  .case-container .tag-search-pc {
    display: block;
    min-width: 304px;
    max-width: 335px;
    width: 100%;
    margin: 0 auto;
    background-color: #F6F9FE;
  }
  .case-container .tag-search-pc h3 {
    text-align: center;
    padding: 18px 0 19px;
    position: relative;
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 0;
    background-color: #FFEB42;
    background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  }
  .case-container .tag-search-pc h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 27px;
    background-image: url("../img/case-detail/tag.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 2%;
  }
  .case-container .tag-search-pc h3::after {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
    border-right-width: 5px;
    margin-left: -5px;
    border-top-color: #FFEB42;
    top: 100%;
    left: 50%;
  }
  .case-container .tag-search-pc ul {
    padding: 30px 29px 10px;
  }
  .case-container .tag-search-pc ul li {
    margin-bottom: 30px;
  }
  .case-container .tag-search-pc ul li h4 {
    font-size: 1.8rem;
    font-weight: bold;
    padding: 0 1rem;
    border-left: 3px solid #DF2626;
    margin-bottom: 15px;
  }
  .case-container .tag-search-pc ul li input {
    border: none;
    max-width: 85%;
    padding: 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
  }
  .case-container .tag-search-pc ul li select {
    border: none;
    max-width: 90%;
    padding: 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
  }
}
.case-container .tag-list {
  padding: 0 !important;
}
.case-container .tag-list .tag {
  margin-bottom: 0;
}
.case-container .tag-list .tag a {
  color: #333333;
  text-align: center;
  border: 2px solid #d1d1d1;
  background-color: #fff;
  border-radius: 100vh;
  padding: 5px 0;
  display: block;
}
.case-container .tag-list .tag a:hover {
  color: #fff;
  border: 2px solid #DF2626;
  background-color: #DF2626;
}
.case-container .tag-list .tag a:active {
  color: #fff;
  border: 2px solid #DF2626;
  background-color: #DF2626;
}
.case-container .odd {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 10px;
  justify-content: flex-start;
}
.case-container .odd .tag a {
  width: 138px;
}
@media screen and (min-width: 1100px) {
  .case-container .odd {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
    justify-content: flex-start;
  }
  .case-container .odd .tag a {
    width: 114px;
  }
}
.case-container .even li {
  margin-bottom: 20px !important;
}
.case-container .even li:last-child {
  margin-bottom: 30px !important;
}
.case-container .side-flyer {
  max-width: 335px;
  margin: 0 auto;
}
.case-container .side-flyer img {
  width: 100%;
}
.case-container .flyer-pc img {
  max-width: 304px !important;
}
.case-container .result .wrap {
  margin-bottom: 50px;
}
.case-container .result .wrap .card {
  background-color: #fff;
  max-width: 335px;
  margin: 40px auto 0;
  box-shadow: 0 0 10px rgba(51, 51, 51, 0.05);
  position: relative;
  padding-bottom: 30px;
}
.case-container .result .wrap .card a {
  height: -moz-fit-content;
  height: fit-content;
  display: block;
}
.case-container .result .wrap .card img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 225.63px;
}
.case-container .result .wrap .card .card-contents {
  padding: 18px 34px 20px;
}
.case-container .result .wrap .card .card-contents h3 {
  font-size: 1.7rem;
  font-weight: 500;
  color: #333333;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.case-container .result .wrap .card .card-contents h3:hover {
  color: #DF2626;
}
.case-container .result .wrap .card .card-contents .tag-wrap {
  margin-top: 15px;
  margin-bottom: 10px;
}
.case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list {
  color: #777;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 12px 14px;
}
.case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list .a-tag a {
  font-size: 1.4rem;
  padding: 0 9px 2px;
  border: 2px solid #d1d1d1;
  border-radius: 100vh;
  width: -moz-fit-content;
  width: fit-content;
  color: #777;
  text-decoration: none;
  margin-bottom: -3px;
}
.case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list .a-tag:hover {
  opacity: 0.7;
}
.case-container .result .wrap .card .card-contents .arrow-link {
  width: 11px;
  height: 17px;
  display: block;
  margin-left: auto;
  position: absolute;
  bottom: 30px;
  right: 37px;
}
.case-container .result .button {
  display: block;
  margin: 40px auto 0;
  background: #F6F9FE;
}
@media screen and (min-width: 769px) {
  .case-container .result {
    padding: 0;
  }
  .case-container .result .wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 64px 10px;
    max-width: 734px;
    margin: 0 auto;
    padding-bottom: 70px;
  }
  .case-container .result .wrap .card {
    display: block;
    max-width: 340px;
    transition: 0.3s;
    margin: 0 auto;
    padding-bottom: 28px;
  }
  .case-container .result .wrap .card img {
    -o-object-fit: cover;
       object-fit: cover;
    height: 269.5px;
    width: 340px;
  }
  .case-container .result .wrap .card .card-contents {
    padding: 25px 39px 31px;
  }
  .case-container .result .wrap .card .card-contents h3 {
    font-size: 1.8rem;
    transition: 0.3s;
  }
  .case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list {
    gap: 12px 14px;
  }
  .case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list .a-tag {
    transition: 0.3s;
  }
  .case-container .result .wrap .card .card-contents .tag-wrap .a-tag-list .a-tag:hover {
    opacity: 0.7;
  }
}
@media screen and (min-width: 1100px) {
  .case-container .result .wrap {
    width: 734px;
  }
  .case-container .result .wrap .card:last-child {
    margin: 0 auto 0 10px;
  }
}
.case-container .pagenation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 30px auto 70px;
}
.case-container .pagenation .forward, .case-container .pagenation .next {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 50px;
}
.case-container .pagenation .forward a, .case-container .pagenation .next a {
  color: #333333;
  border: inherit;
  font-size: 1.6rem;
  font-weight: inherit;
  font-family: "Noto Sans JP", "Noto Sans JP", "Noto Sans Japanese", sans-serif;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: -6px;
}
.case-container .pagenation .forward a img, .case-container .pagenation .next a img {
  width: 8px;
  margin-top: 2px;
}
.case-container .pagenation li {
  margin-top: 20px;
}
.case-container .pagenation .pagenation-n {
  width: 40px;
  height: 40px;
}
.case-container .pagenation .pagenation-n a {
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  display: block;
  padding: 5px 0;
  line-height: 1;
  background-color: #fff;
  border: 2px solid #DF2626;
  font-size: 2.4rem;
  font-weight: bold;
  color: #DF2626;
  text-align: center;
}
.case-container .pagenation .pagenation-n span {
  display: block;
  padding: 5px 0;
  line-height: 1;
  border: 2px solid #DF2626;
  color: #fff;
  background-color: #DF2626;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
}
.case-container .pagenation .pagenation-n.active a {
  background-color: #DF2626;
  color: #fff;
}
.case-container .pagenation .threepoint {
  width: 20px !important;
  margin: 0;
  padding-top: 30px !important;
}
.case-container .pagenation .threepoint::before {
  content: "";
  width: 2rem;
  height: 4px;
  background-image: url("../img/list/three-point.png");
  background-size: contain;
  background-repeat: no-repeat;
  display: inline-block;
  padding-bottom: 10px;
}
@media screen and (min-width: 1100px) {
  .case-container .pagenation {
    margin: 0 auto 120px;
  }
  .case-container .pagenation .forward, .case-container .pagenation .next {
    width: 76px;
  }
  .case-container .pagenation .forward a, .case-container .pagenation .next a {
    font-size: 2.4rem;
    margin-top: -7px;
  }
  .case-container .pagenation .forward a img, .case-container .pagenation .next a img {
    width: 12px;
    margin-top: 4px;
  }
  .case-container .pagenation .forward {
    margin-right: 10px;
  }
  .case-container .pagenation .next {
    margin-left: 10px;
  }
  .case-container .pagenation li {
    margin-top: 0 !important;
    width: 50px;
    height: 50px;
  }
  .case-container .pagenation li span {
    font-size: 2.8rem;
    padding: 11px 5px;
  }
  .case-container .pagenation li a {
    padding: 11px 5px;
    font-size: 2.8rem;
  }
  .case-container .pagenation li a:hover {
    opacity: 0.7;
  }
  .case-container .threepoint {
    margin: 0 10px !important;
  }
}

@media screen and (min-width: 1100px) {
  .case-container {
    display: flex;
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0;
  }
  .side {
    max-width: 304px;
    margin-bottom: 120px;
  }
}
header {
  height: 70px;
}
@media screen and (min-width: 1200px) {
  header {
    height: 155px;
  }
}

.case_detail-container {
  max-width: 734px;
  padding: 0 5% 50px;
  margin: 0 auto;
  /*アコーディオン全体*/
  /*バー部分*/
  /*開いたときに表示される部分*/
  /*開いたときの下の余白*/
  /*閉じた状態の矢印描画*/
  /*開いた状態の矢印描画*/
}
.case_detail-container .tag-search-pc {
  display: none;
}
.case_detail-container .tag-search-sp {
  min-width: 304px;
  max-width: 335px;
  width: 100%;
  margin: 0 auto 30px;
  margin-bottom: 80px;
}
.case_detail-container .tag-search-sp input {
  display: none; /*チェックボックスを隠す*/
}
.case_detail-container .tag-search-sp label {
  cursor: pointer;
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0;
  background-color: #FFEB42;
  background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  padding: 18px 38px 18px 24px;
}
.case_detail-container .tag-search-sp label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 27px;
  background-image: url("../img/case-detail/tag.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
}
.case_detail-container .tag-search-sp ul {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1px;
  background-color: #F6F9FE;
}
.case_detail-container .tag-search-sp li {
  display: none;
  margin-bottom: 30px;
  overflow-y: hidden;
}
.case_detail-container .tag-search-sp li:nth-child(2) {
  margin-bottom: 0px;
}
.case_detail-container .tag-search-sp li h4 {
  font-size: 1.8rem;
  font-weight: bold;
  padding: 0 1rem;
  border-left: 3px solid #DF2626;
  margin-bottom: 15px;
}
.case_detail-container .tag-search-sp li ul li {
  height: 0;
  overflow-y: hidden;
}
.case_detail-container #menu_bar01:checked ~ #links01 {
  display: block;
  animation: appear 1s ease;
  padding: 30px 20px 40px;
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.case_detail-container #menu_bar01:checked ~ #links01 li {
  display: block;
  height: auto !important; /*開いたときに表示されるliの高さ*/
  opacity: 1;
}
.case_detail-container #menu_bar01:checked ~ #links01 li:last-child {
  margin-bottom: 0;
}
.case_detail-container .tag-search-sp label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(135deg);
  position: absolute;
  right: 9%;
  top: 0;
  bottom: 15%;
  margin: auto;
}
.case_detail-container .tag-search-sp input[type=checkbox]:checked + label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(-45deg);
  position: absolute;
  right: 9%;
  top: 19%;
  bottom: 0;
  margin: auto;
}
@media screen and (min-width: 1100px) {
  .case_detail-container .tag-search-sp {
    display: none;
  }
  .case_detail-container .tag-search-pc {
    display: block;
    /*min-width: 304px;*/
    max-width: 335px;
    width: 100%;
    margin: 0 auto 30px;
    background-color: #F6F9FE;
    margin-bottom: 40px;
  }
  .case_detail-container .tag-search-pc h3 {
    text-align: center;
    padding: 18px 0 19px;
    position: relative;
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 0;
    background-color: #FFEB42;
    background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  }
  .case_detail-container .tag-search-pc h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 27px;
    background-image: url("../img/case-detail/tag.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 2%;
  }
  .case_detail-container .tag-search-pc h3::after {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
    border-right-width: 5px;
    margin-left: -5px;
    border-top-color: #FFEB42;
    top: 100%;
    left: 50%;
  }
  .case_detail-container .tag-search-pc ul {
    padding: 30px 29px 10px;
  }
  .case_detail-container .tag-search-pc ul li {
    margin-bottom: 30px;
  }
  .case_detail-container .tag-search-pc ul li h4 {
    font-size: 1.8rem;
    font-weight: bold;
    padding: 0 1rem;
    border-left: 3px solid #DF2626;
    margin-bottom: 15px;
  }
  .case_detail-container .tag-search-pc ul li input {
    border: none;
    max-width: 85%;
    padding: 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
  }
  .case_detail-container .tag-search-pc ul li select {
    border: none;
    max-width: 90%;
    padding: 12px;
    border-radius: 10px;
    width: 100%;
    margin: 0 auto;
    display: block;
  }
}
.case_detail-container .tag-list {
  padding: 0 !important;
}
.case_detail-container .tag-list .tag {
  margin-bottom: 0;
}
.case_detail-container .tag-list .tag a {
  color: #333333;
  text-align: center;
  border: 2px solid #d1d1d1;
  background-color: #fff;
  border-radius: 100vh;
  padding: 5px 0;
  display: block;
}
.case_detail-container .tag-list .tag a:hover {
  color: #fff;
  border: 2px solid #DF2626;
  background-color: #DF2626;
}
.case_detail-container .tag-list .tag a:active {
  color: #fff;
  border: 2px solid #DF2626;
  background-color: #DF2626;
}
.case_detail-container .odd {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 10px;
  justify-content: flex-start;
}
.case_detail-container .odd .tag a {
  width: 138px;
}
@media screen and (min-width: 1100px) {
  .case_detail-container .odd {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 10px;
    justify-content: flex-start;
  }
  .case_detail-container .odd .tag a {
    width: 114px;
  }
}
.case_detail-container .even li {
  margin-bottom: 20px !important;
}
.case_detail-container .even li:last-child {
  margin-bottom: 30px !important;
}
.case_detail-container .side-flyer {
  max-width: 335px;
  margin: 0 auto;
}
.case_detail-container .side-flyer img {
  width: 100%;
}
.case_detail-container .new-case {
  /*アコーディオン全体*/
  /*バー部分*/
  /*開いたときに表示される部分*/
  /*開いたときの下の余白*/
  /*閉じた状態の矢印描画*/
  /*開いた状態の矢印描画*/
}
.case_detail-container .new-case .new-case-pc {
  display: none;
}
.case_detail-container .new-case .new-case-sp {
  min-width: 304px;
  max-width: 335px;
  width: 100%;
  margin: 0 auto 30px;
}
.case_detail-container .new-case .new-case-sp input {
  display: none; /*チェックボックスを隠す*/
}
.case_detail-container .new-case .new-case-sp label {
  cursor: pointer;
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: left;
  margin-bottom: 0;
  background-color: #FFEB42;
  background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
  padding: 18px 24px 18px 50px;
}
.case_detail-container .new-case .new-case-sp label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 27px;
  background-image: url("../img/case-detail/tools.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 2%;
  margin-top: -10px;
}
.case_detail-container .new-case .new-case-sp ol {
  margin: 0;
  list-style: none;
  margin-bottom: 1px;
  padding: 0px;
  background-color: #F6F9FE;
}
.case_detail-container .new-case .new-case-sp li {
  display: none;
  /*height: 0;*/
  overflow-y: hidden;
}
.case_detail-container .new-case #menu_bar02:checked ~ #links02 li {
  /*height: auto; /*開いたときに表示されるliの高さ*/
  /*opacity: 1;*/
  padding: 20px 0 5px;
  margin: 0 auto;
  max-width: 295px;
  width: 100%;
  display: block;
  animation: appear 1s ease;
}
.case_detail-container .new-case #menu_bar02:checked ~ #links02 li img {
  margin: 0 auto;
  max-width: 295px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 198.25px;
}
.case_detail-container .new-case #menu_bar02:checked ~ #links02 li h4 {
  color: #333333;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.case_detail-container .new-case #menu_bar02:checked ~ #links02 li:last-child {
  padding: 20px 0 25px;
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.case_detail-container .new-case #menu_bar01:checked ~ #links01 li {
  display: block;
  height: auto !important; /*開いたときに表示されるliの高さ*/
  opacity: 1;
}
.case_detail-container .new-case #menu_bar02:checked ~ #links02 li:last-child {
  margin-bottom: 20px;
}
.case_detail-container .new-case .new-case-sp label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(135deg);
  position: absolute;
  right: 9%;
  top: 0;
  bottom: 15%;
  margin: auto;
}
.case_detail-container .new-case .new-case-sp input[type=checkbox]:checked + label:after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  border-top: #333333 3px solid;
  border-right: #333333 3px solid;
  transform: rotate(-45deg);
  position: absolute;
  right: 9%;
  top: 19%;
  bottom: 0;
  margin: auto;
}
@media screen and (min-width: 1100px) {
  .case_detail-container .new-case-sp {
    display: none;
  }
  .case_detail-container .new-case-pc {
    display: block !important;
    min-width: 304px;
    max-width: 335px;
    width: 100%;
    margin: 0 auto 40px;
  }
  .case_detail-container .new-case-pc h3 {
    position: relative;
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 0;
    background-color: #FFEB42;
    background-image: repeating-linear-gradient(-45deg, #FFF061, #FFF061 5px, transparent 0, transparent 10px);
    text-align: center;
    padding: 18px 0 19px;
  }
  .case_detail-container .new-case-pc h3::before {
    content: "";
    display: inline-block;
    width: 28px;
    height: 27px;
    background-image: url("../img/case-detail/tools.png");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 2%;
  }
  .case_detail-container .new-case-pc h3::after {
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    pointer-events: none;
    position: absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
    border-right-width: 5px;
    margin-left: -5px;
    border-top-color: #FFEB42;
    top: 100%;
    left: 50%;
  }
  .case_detail-container .new-case-pc ol {
    padding: 20px;
    background-color: #F6F9FE;
  }
  .case_detail-container .new-case-pc ol li {
    margin: 0 auto 25px;
    max-width: 295px;
    width: 100%;
  }
  .case_detail-container .new-case-pc ol li a:hover {
    opacity: 0.7;
  }
  .case_detail-container .new-case-pc ol li a img {
    margin: 0 auto;
    width: 264px;
    height: 177.42px;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .case_detail-container .new-case-pc ol li a img:hover {
    opacity: 1;
  }
  .case_detail-container .new-case-pc ol li a h4 {
    color: #333333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .case_detail-container .new-case-pc ol li:last-child {
    margin: 0 auto;
  }
}
.case_detail-container article a {
  color: #DF2626;
  text-decoration: underline;
}
.case_detail-container article a:hover {
  color: #a11818;
  opacity: 1;
}
.case_detail-container article .case-ttl p {
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  color: #A0A0A0;
  font-size: 1.4rem;
  margin-bottom: 0;
}
.case_detail-container article .case-ttl .a-tag-list {
  margin: 10px 0;
  color: #777;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 14px 6px;
}
.case_detail-container article .case-ttl .a-tag-list .a-tag a {
  font-size: 1.4rem;
  padding: 3px 10px;
  border: 2px solid #d1d1d1;
  border-radius: 100vh;
  width: -moz-fit-content;
  width: fit-content;
  color: #777;
  text-decoration: none;
}
.case_detail-container article .case-ttl h2 {
  font-size: 2.4rem;
  font-weight: bold;
  position: relative;
  text-align: left;
  border-bottom: 2px solid #333333;
  padding-bottom: 5px;
}
.case_detail-container article .case-ttl h2::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 12%;
  transform: translateX(-50%);
  width: 24%;
  height: 1px;
  background-color: #DF2626;
}
.case_detail-container article .case-ttl img {
  display: block;
  margin: 0 auto 30px;
  max-width: 734px;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .case_detail-container article .case-ttl__top {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    margin-bottom: 15px;
  }
  .case_detail-container article .case-ttl__top .a-tag-list {
    margin: 0 0 0 20px;
    gap: 14px;
  }
  .case_detail-container article .case-ttl h2 {
    font-size: 3rem;
    margin-bottom: 40px;
  }
  .case_detail-container article .case-ttl h2::after {
    width: 14%;
    left: 7%;
    height: 2px;
  }
  .case_detail-container article .case-ttl img {
    margin: 0 auto 40px;
  }
}
.case_detail-container article .profile, .case_detail-container article .machine {
  border: 1px solid #A0A0A0;
  border-radius: 5px;
  padding: 5px 15px 5px 5px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 10px;
  gap: 20px;
}
.case_detail-container article .profile h3, .case_detail-container article .machine h3 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  padding: 1rem 0;
  background-color: #333333;
  color: #fff;
  font-weight: 400;
  font-size: 1.4rem;
  width: 90px;
}
.case_detail-container article .profile h3::after, .case_detail-container article .machine h3::after {
  position: absolute;
  top: 0;
  content: "";
  border-width: 25px 10px 25px 0;
  border-style: solid;
  border-color: transparent #333333 transparent transparent;
  transform: rotate(180deg);
  right: -10px;
}
.case_detail-container article .profile p, .case_detail-container article .machine p {
  margin-bottom: 0;
  width: calc(100% - 90px);
}
@media screen and (min-width: 769px) {
  .case_detail-container article .profile h3, .case_detail-container article .machine h3 {
    font-size: 1.6rem;
    width: 123px;
  }
  .case_detail-container article .profile p, .case_detail-container article .machine p {
    margin-left: 10px;
    width: calc(100% - 123px);
  }
}
.case_detail-container article .main-text {
  margin: 0 auto;
  padding-bottom: 20px;
}
.case_detail-container article .main-text .point {
  margin: 30px auto;
  background-color: #F6F9FE;
  padding: 25px 20px;
}
.case_detail-container article .main-text .point h3 {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  position: relative;
  border-bottom: none;
}
.case_detail-container article .main-text .point h3::before {
  content: " ";
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("../img/case-detail/check.png");
  background-size: contain;
  margin-right: 10px;
}
.case_detail-container article .main-text .point h3::after {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 40px;
  height: 3px;
  content: "";
  background: #DF2626;
}
.case_detail-container article .main-text .point p {
  margin: 30px auto 0;
  line-height: 2;
}
@media screen and (min-width: 769px) {
  .case_detail-container article .main-text .point {
    margin: 50px auto;
    padding: 25px 35px 35px;
  }
  .case_detail-container article .main-text .point p {
    line-height: 2.5;
  }
}
.case_detail-container article .main-text a {
  color: #DF2626;
}
.case_detail-container article .main-text a:hover {
  color: #a11818;
  opacity: 1;
}
.case_detail-container article .main-text p {
  margin-bottom: 30px;
  line-height: 2;
}
.case_detail-container article .main-text img {
  display: block;
  margin: 0 auto 30px;
  max-width: 734px;
  width: 100%;
}
.case_detail-container article .main-text h3 {
  font-size: 2rem;
  font-weight: bold;
  border-bottom: 2px solid #333;
  padding-bottom: 5px;
  margin-bottom: 30px;
}
@media screen and (min-width: 769px) {
  .case_detail-container article .main-text {
    padding-bottom: 60px;
  }
  .case_detail-container article .main-text p {
    margin-bottom: 50px;
    line-height: 2.5;
  }
  .case_detail-container article .main-text img {
    margin: 0 auto 50px;
  }
  .case_detail-container article .main-text h3 {
    font-size: 2.4rem;
    margin-bottom: 50px;
  }
}
.case_detail-container .below h2 {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  color: #DF2626;
  margin-bottom: 40px;
}
.case_detail-container .below img {
  display: block;
  margin: 0 auto 50px;
  max-width: 734px;
  width: 100%;
}
.case_detail-container .below .return-case {
  color: #DF2626;
  border: 2px solid #DF2626;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  border-radius: 100vh;
  padding: 20px 0;
  margin: 0 auto 50px;
  display: block;
  max-width: 335px;
  position: relative;
}
.case_detail-container .below .return-case::after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 25px;
  top: 44%;
  width: 8px;
  height: 8px;
  border-top: 3px solid #DF2626;
  border-right: 3px solid #DF2626;
  transform: rotate(45deg);
}
@media screen and (min-width: 769px) {
  .case_detail-container .below img {
    margin: 0 auto 100px;
  }
  .case_detail-container .below h2 {
    font-size: 2.6rem;
    margin-bottom: 30px;
  }
  .case_detail-container .below h2 .pc {
    display: inline-block;
  }
  .case_detail-container .below .return-case {
    margin: 0 auto 50px;
  }
  .case_detail-container .below .return-case:hover {
    color: #fff;
    background-color: #DF2626;
  }
  .case_detail-container .below .return-case:hover::after {
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
  }
}

@media screen and (min-width: 1100px) {
  .return-case {
    margin: 0 auto;
  }
  .case_detail-container {
    max-width: 1100px;
    padding: 0 5% 140px;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    gap: 60px;
  }
}
header {
  height: 70px;
  margin: 0 5%;
}
@media screen and (min-width: 1200px) {
  header {
    height: 155px;
  }
}

.law-page {
  background-image: url("../law/img/law-topimg-sp.png");
  background-size: cover;
  background-repeat: no-repeat;
}
.law-page .ttlArea img {
  width: 50px;
  height: 50px;
  margin-right: 10px;
  margin-top: 3px;
}
.law-page .ttlArea h2 {
  margin-bottom: 0;
  letter-spacing: 0.1em;
}

@media screen and (min-width: 769px) {
  .law-page {
    background-image: url("../law/img/law-topimg-pc.png");
    justify-content: flex-start;
  }
  .law-page .ttlArea img {
    width: 72px;
    height: 72px;
    margin-right: 24px;
    margin-top: 6px;
  }
  .law-page .ttlArea h2 {
    text-align: left;
    max-width: 1100px;
  }
}
.law-container {
  padding: 0 5%;
}
.law-container section {
  margin-bottom: 60px;
}
.law-container section h3 {
  padding: 13px 18px 18px;
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  max-width: 500px;
  margin: 0 auto 30px;
  text-align: left !important;
}
.law-container section table {
  max-width: 335px;
  width: 100%;
  margin: 0 auto 10px;
  border-collapse: collapse;
  border-left: none;
  border-right: none;
}
.law-container section table tbody tr {
  text-align: left;
  display: flex;
  flex-direction: column;
  border: 1px solid #d1d1d1;
  border-bottom: none;
  letter-spacing: 0.04em;
}
.law-container section table tbody tr:last-child {
  border-bottom: 1px solid #d1d1d1;
}
.law-container section table tbody tr th {
  font-weight: bold;
  padding: 13px 20px;
  background-color: rgba(223, 38, 38, 0.1);
}
.law-container section table tbody tr td {
  padding: 18px 20px;
  line-height: 1.8;
  font-weight: 500;
  word-break: break-word;
}
.law-container section table tbody tr td a {
  color: #DF2626;
  text-decoration: underline;
}
.law-container section table tbody tr td a:hover {
  opacity: 0.7;
}
.law-container section table tbody tr td b {
  color: #DF2626;
  margin-bottom: 0;
}
.law-container section table tbody tr td p {
  margin-bottom: 0;
  font-weight: 500;
}
.law-container section table tbody tr td .customer-convenience {
  margin-bottom: 20px;
}
.law-container section table tbody tr td .tellink {
  color: #333333;
  text-decoration: none;
}

@media screen and (min-width: 769px) {
  .breadcrumb-law {
    margin: 0 auto 60px;
  }
  .law-container {
    max-width: 1100px;
    margin: 0 auto;
  }
  .law-container section {
    margin-bottom: 120px;
  }
  .law-container section h3 {
    max-width: 1100px;
  }
  .law-container section table {
    max-width: 1100px;
    margin: 0 auto 10px;
    border-collapse: collapse;
    border-left: none;
    border-right: none;
  }
  .law-container section table tbody tr {
    display: block;
    text-align: left;
    border: none;
  }
  .law-container section table tbody tr th {
    font-weight: bold;
    border: 1px solid #d1d1d1;
    border-bottom: none;
    max-width: 280px;
    width: 25.5%;
    padding: 30px 2%;
    text-align: center;
    vertical-align: middle;
  }
  .law-container section table tbody tr td {
    border: 1px solid #d1d1d1;
    border-bottom: none;
    width: 780px;
    padding: 30px;
  }
  .law-container section table tbody tr td a {
    color: #DF2626;
  }
  .law-container section table tbody tr td a:hover {
    color: #a11818;
    opacity: 1;
  }
  .law-container section table tbody tr td b {
    color: #DF2626;
  }
  .law-container section table tbody tr td .tellink {
    display: block;
  }
}
.error-container .error_box {
  display: flex;
  flex-direction: column;
}
.error-container .error_box .error_txt h2 {
  font-size: 5.6rem;
  color: #DF2626;
  letter-spacing: 0;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.error-container .error_box .error_txt h2::after {
  content: none;
}
.error-container .error_box .error_txt h2 img {
  width: 4rem;
  margin-left: 1.6rem;
  vertical-align: baseline;
}
.error-container .error_box .error_txt h3 {
  text-align: left;
  margin-bottom: 2rem;
  font-size: 2rem;
}
.error-container .error_box .error_txt p {
  margin-bottom: 2.8rem;
}
.error-container .error_box .error_img {
  text-align: center;
}
.error-container .error_box .error_img img {
  max-width: 400px;
  width: 64vw;
}
@media screen and (min-width: 1100px) {
  .error-container .error_box {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 80px;
  }
  .error-container .error_box .error_txt h2 {
    font-size: 10rem;
    margin-top: 0;
    margin-bottom: 5.2rem;
    text-align: left;
  }
  .error-container .error_box .error_txt h2 img {
    width: 6.5rem;
    margin-left: 2.4rem;
  }
  .error-container .error_box .error_txt h3 {
    margin-bottom: 3rem;
  }
  .error-container .error_box .error_txt p {
    margin-bottom: 0;
  }
}
.error-container .submit__button a {
  width: 100%;
  text-align: center;
  margin: 3.4rem auto 5rem;
  color: #DF2626;
  border: 2px solid #DF2626;
  border-radius: 50vw;
  padding: 2rem;
  background: #fff;
  position: relative;
  display: block;
  font-size: 1.8rem;
  transition: 0.3s;
  box-sizing: border-box;
}
.error-container .submit__button a::after {
  content: "";
  position: absolute;
  background: url("../img/404/allow.svg") no-repeat;
  background-size: cover;
  width: 8px;
  height: 16px;
  bottom: calc(50% - 8px);
  right: 22px;
}
.error-container .submit__button a:hover {
  background: #DF2626;
  color: #fff;
  cursor: pointer;
}
.error-container .submit__button a:hover::after {
  transition: 0.3s;
  background: url("../img/404/allow_white.svg") no-repeat;
}
@media screen and (min-width: 769px) {
  .error-container .submit__button a {
    width: 400px;
    font-size: 2rem;
    padding: 25px 20px;
    margin: 100px auto 120px;
  }
  .error-container .submit__button a::after {
    width: 10px;
    height: 18px;
    bottom: calc(50% - 9px);
    right: 30px;
  }
}

.guide {
  background: url("../img/common/top-img01_sp.jpg") no-repeat;
  background-size: cover;
}
.guide .ttlArea img {
  width: 36px;
}
.guide .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .guide {
    background: url("../img/common/top-img01.jpg") no-repeat;
    background-size: cover;
  }
  .guide .ttlArea img {
    width: 70px;
  }
  .guide .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.sub-container h2 {
  text-align: center;
  position: relative;
  margin-bottom: 6rem;
  letter-spacing: 4px;
}
.sub-container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 40px;
  height: 3px;
  background-color: #DF2626;
  bottom: -2rem;
  left: calc(50% - 20px);
}
@media screen and (min-width: 769px) {
  .sub-container h2 {
    margin: 120px auto 70px;
  }
}
.sub-container .d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .sub-container .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.guide-container section p {
  line-height: 30px;
}
@media screen and (min-width: 769px) {
  .guide-container section p {
    line-height: 38px;
  }
}
.guide-container .paymenu_box {
  margin: 60px 0;
  max-width: 1100px;
}
.guide-container .paymenu_box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.guide-container .paymenu_box ul li {
  width: 248px;
  border: 1px solid #D1D1D1;
  text-align: center;
  position: relative;
  transition: 0.3s;
}
.guide-container .paymenu_box ul li::after {
  position: absolute;
  content: "";
  background: url("../area/img/icon_arrow.svg") no-repeat;
  background-size: contain;
  width: 12px;
  height: 7px;
  bottom: calc(50% - 3.5px);
  right: 22px;
  cursor: pointer;
}
.guide-container .paymenu_box ul li:hover {
  background-color: rgba(209, 209, 209, 0.1);
}
.guide-container .paymenu_box ul li a {
  display: block;
  color: #333333;
  padding: 2rem 1rem;
}
@media screen and (max-width: 768px) {
  .guide-container .paymenu_box {
    width: 100%;
    margin: 5rem 0;
  }
  .guide-container .paymenu_box ul {
    justify-content: center;
  }
  .guide-container .paymenu_box ul li {
    width: calc(50% - 2px);
    text-align: left;
  }
  .guide-container .paymenu_box ul li::after {
    width: 10px;
    height: 6px;
    bottom: calc(50% - 3px);
    right: 1.2rem;
  }
  .guide-container .paymenu_box ul .menu02, .guide-container .paymenu_box ul .menu04 {
    margin-left: -1px;
  }
  .guide-container .paymenu_box ul .menu03, .guide-container .paymenu_box ul .menu04 {
    margin-top: -1px;
  }
}
.guide-container .pay_box {
  margin-bottom: 5rem;
  padding-top: 100px;
  margin-top: -100px;
}
.guide-container .pay_box h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  max-width: 760px;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.guide-container .pay_box h4 {
  color: #DF2626;
  font-size: 2rem;
  font-weight: bold;
  margin: 3rem 0;
}
.guide-container .pay_box p {
  margin-bottom: 3rem;
}
.guide-container .pay_box img {
  width: 100%;
  margin-bottom: 3rem;
}
.guide-container .pay_box ul {
  margin-bottom: 3rem;
}
.guide-container .pay_box ul li {
  line-height: 30px;
}
.guide-container .pay_box .pay_list01 li {
  list-style: disc;
  margin-left: 1.6em;
}
.guide-container .pay_box .pay_list02 li {
  list-style: decimal;
  margin-left: 1.2em;
  padding-left: 0.4em;
}
.guide-container .pay_box .pay_list03 li {
  color: #DF2626;
  text-indent: -1em;
  padding-left: 1em;
}
.guide-container .pay_box .pay_list03 li::before {
  content: "■";
  margin-right: 0.5em;
}
.guide-container .pay_box .pay_list03 li:first-of-type::before {
  content: "※";
}
.guide-container .pay_box .txt_box {
  padding: 2.7rem 2rem;
  border: 1px solid #D1D1D1;
}
.guide-container .pay_box .txt_box p {
  margin-bottom: 2rem;
}
.guide-container .pay_box .txt_box p:last-of-type {
  margin-bottom: 0;
}
.guide-container .pay_box .txt_box .btn {
  margin-top: 2.4rem;
}
.guide-container .pay_box .txt_box .btn a {
  display: block;
  width: 100%;
  padding: 1rem 0;
  text-align: center;
  border: 1px solid #DF2626;
  border-radius: 50px;
  font-size: 2rem;
  color: #DF2626;
  font-weight: bold;
  position: relative;
}
.guide-container .pay_box .txt_box .btn a::after {
  position: absolute;
  content: "";
  background: url("../pay/img/icon_arrow_red.svg") no-repeat;
  background-size: contain;
  width: 7px;
  height: 12px;
  bottom: calc(50% - 7px);
  right: 2rem;
}
.guide-container .pay_box .txt_box .btn a:hover {
  color: #FFFFFF;
  background-color: #DF2626;
}
.guide-container .pay_box .txt_box .btn a:hover::after {
  background: url("../pay/img/icon_arrow_white.svg") no-repeat;
}
@media screen and (min-width: 769px) {
  .guide-container .pay_box {
    margin-bottom: 80px;
  }
  .guide-container .pay_box h3 {
    max-width: 1100px;
  }
  .guide-container .pay_box img {
    width: 374px;
  }
  .guide-container .pay_box ul li {
    line-height: 38px;
  }
  .guide-container .pay_box .txt_box {
    padding: 30px 38px;
  }
  .guide-container .pay_box .txt_box p {
    margin-bottom: 30px;
  }
  .guide-container .pay_box .txt_box p:last-of-type {
    margin-bottom: 0;
  }
  .guide-container .pay_box .txt_box .btn {
    margin-top: 36px;
  }
  .guide-container .pay_box .txt_box .btn a {
    width: 350px;
    padding: 1rem 0;
    margin: 0 auto;
    transition: 0.3s;
  }
  .guide-container .pay_box .txt_box .btn a::after {
    bottom: calc(50% - 6px);
    right: 24px;
  }
}

.guide {
  background: url("../img/common/top-img01_sp.jpg") no-repeat;
  background-size: cover;
}
.guide .ttlArea img {
  width: 36px;
}
.guide .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .guide {
    background: url("../img/common/top-img01.jpg") no-repeat;
    background-size: cover;
  }
  .guide .ttlArea img {
    width: 70px;
  }
  .guide .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.sub-container h2 {
  text-align: center;
  position: relative;
  margin-bottom: 6rem;
  letter-spacing: 4px;
}
.sub-container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 40px;
  height: 3px;
  background-color: #DF2626;
  bottom: -2rem;
  left: calc(50% - 20px);
}
@media screen and (min-width: 769px) {
  .sub-container h2 {
    margin: 120px auto 70px;
  }
}
.sub-container .d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .sub-container .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.sub-container .menu_box {
  margin: 60px 0;
  max-width: 1100px;
}
.sub-container .menu_box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.sub-container .menu_box ul li {
  width: 248px;
  border: 1px solid #D1D1D1;
  text-align: center;
  position: relative;
  transition: 0.3s;
}
.sub-container .menu_box ul li::after {
  position: absolute;
  content: "";
  background: url("../area/img/icon_arrow.svg") no-repeat;
  background-size: contain;
  width: 12px;
  height: 7px;
  bottom: calc(50% - 3.5px);
  right: 22px;
  cursor: pointer;
}
.sub-container .menu_box ul li:hover {
  background-color: rgba(209, 209, 209, 0.1);
}
.sub-container .menu_box ul li a {
  display: block;
  color: #333333;
  padding: 2rem 0;
}
@media screen and (max-width: 768px) {
  .sub-container .menu_box {
    width: 100%;
    margin: 5rem 0;
  }
  .sub-container .menu_box ul {
    justify-content: center;
  }
  .sub-container .menu_box ul li {
    width: calc(50% - 2px);
  }
  .sub-container .menu_box ul li::after {
    width: 10px;
    height: 6px;
    bottom: calc(50% - 3px);
    right: 1.2rem;
  }
  .sub-container .menu_box ul .menu02, .sub-container .menu_box ul .menu04 {
    margin-left: -1px;
  }
  .sub-container .menu_box ul .menu03, .sub-container .menu_box ul .menu04 {
    margin-top: -1px;
  }
}

.guide-container section p {
  line-height: 30px;
}
@media screen and (min-width: 769px) {
  .guide-container section p {
    line-height: 38px;
  }
}
.guide-container .area_txt p span {
  color: #DF2626;
  font-weight: bold;
}
.guide-container .area_box {
  margin-bottom: 5rem;
  padding-top: 100px;
  margin-top: -100px;
}
.guide-container .area_box h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  max-width: 760px;
  padding: 0.8rem 1.8rem 1.2rem;
  font-size: 2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.guide-container .area_box h4 {
  color: #DF2626;
  font-size: 2rem;
  font-weight: bold;
  margin: 3rem 0;
}
.guide-container .area_box .right {
  text-align: right;
  font-size: 1.4rem;
  line-height: 24px;
  margin-top: 2rem;
}
.guide-container .area_box table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.guide-container .area_box table tbody {
  display: block;
  margin-bottom: 0.5rem;
  border: 1px solid #D1D1D1;
}
.guide-container .area_box th {
  width: 186px;
  background-color: rgba(223, 38, 38, 0.1);
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}
.guide-container .area_box td {
  padding: 30px 40px;
  text-align: left;
  overflow-wrap: break-word;
  line-height: 38px;
}
.guide-container .area_box .white {
  width: 1020px;
  display: block;
}
@media screen and (min-width: 769px) {
  .guide-container .area_box {
    margin-bottom: 80px;
  }
  .guide-container .area_box h3 {
    max-width: 1100px;
    font-size: 2.4rem !important;
  }
  .guide-container .area_box .right {
    font-size: 16px;
  }
}
@media screen and (max-width: 1099px) {
  .guide-container .area_box .area_table table {
    display: block;
  }
  .guide-container .area_box .area_table table tr {
    display: block;
    width: 100%;
  }
  .guide-container .area_box .area_table table th {
    display: block;
    width: 100%;
    padding: 1.2rem 0;
  }
  .guide-container .area_box .area_table table td {
    display: block;
    padding: 2rem;
    line-height: 30px;
  }
  .guide-container .area_box .area_table table .white {
    width: calc(100% - 4rem);
  }
}

.cta-sp {
  margin-top: 50px;
}
.cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}

.cta-pc {
  margin: 120px auto;
}

.guide {
  background: url("../img/common/top-img01_sp.jpg") no-repeat;
  background-size: cover;
}
.guide .ttlArea img {
  width: 36px;
}
.guide .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .guide {
    background: url("../img/common/top-img01.jpg") no-repeat;
    background-size: cover;
  }
  .guide .ttlArea img {
    width: 70px;
  }
  .guide .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.sub-container h2 {
  text-align: center;
  position: relative;
  margin-bottom: 6rem;
  letter-spacing: 4px;
}
.sub-container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 40px;
  height: 3px;
  background-color: #DF2626;
  bottom: -2rem;
  left: calc(50% - 20px);
}
@media screen and (min-width: 769px) {
  .sub-container h2 {
    margin: 120px auto 70px;
  }
}
.sub-container .d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .sub-container .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.guide-container section p {
  line-height: 30px;
}
@media screen and (min-width: 769px) {
  .guide-container section p {
    line-height: 38px;
  }
}
.guide-container .support_box {
  margin-bottom: 5rem;
}
.guide-container .support_box h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  max-width: 760px;
  padding: 0.8rem 1.8rem 1.2rem;
  font-size: 2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.guide-container .support_box h4 {
  color: #DF2626;
  font-size: 2rem;
  font-weight: bold;
  margin: 3rem 0;
}
.guide-container .support_box .support_list {
  margin: 3rem 0;
  line-height: 30px;
}
.guide-container .support_box .support_list li {
  position: relative;
  padding-left: 1em;
}
.guide-container .support_box .support_list li::before {
  position: absolute;
  content: "●";
  left: 0;
}
.guide-container .support_box .note {
  background-color: rgba(255, 216, 63, 0.1);
  border-radius: 10px;
  padding: 2rem;
  position: relative;
  margin-top: 3rem;
}
.guide-container .support_box .note p {
  width: 60%;
  margin-bottom: 0;
}
.guide-container .support_box .note img {
  position: absolute;
  bottom: 20%;
  right: 7%;
  width: 97px;
}
.guide-container .support_box .rtxt {
  color: #DF2626;
}
.guide-container .support_box .right {
  text-align: right;
  margin-top: 2rem;
}
.guide-container .support_box .support_table {
  margin-top: 3rem;
}
.guide-container .support_box table {
  width: 850px;
  border-collapse: collapse;
}
.guide-container .support_box thead td {
  background-color: #F6F9FE;
  font-weight: bold;
}
.guide-container .support_box th, .guide-container .support_box td {
  border: 1px solid #D1D1D1;
  padding: 15px 0;
  width: 150px;
  text-align: center;
}
.guide-container .support_box th {
  background-color: rgba(223, 38, 38, 0.1);
  font-weight: bold;
}
.guide-container .support_box .lease_wrap {
  border: 1px solid #D1D1D1;
  border-radius: 10px;
  padding: 3rem;
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.guide-container .support_box .lease_wrap .d-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 56px;
  justify-content: flex-start;
}
.guide-container .support_box .lease_wrap .d-flex li {
  background-color: #F6F9FE;
  width: 217px;
  height: 110px;
  border-radius: 5px 5px 0 0;
  position: relative;
}
.guide-container .support_box .lease_wrap .d-flex li:nth-of-type(1)::after {
  content: "";
  position: absolute;
  background: url("../support/img/icon_cross.svg") no-repeat;
  background-size: contain;
  width: 24px;
  height: 44px;
  top: calc(50% - 12px);
  right: -40px;
}
.guide-container .support_box .lease_wrap .d-flex li:nth-of-type(2)::after {
  content: "";
  position: absolute;
  background: url("../support/img/icon_equal.svg") no-repeat;
  background-size: contain;
  width: 24px;
  height: 44px;
  top: calc(50% - 12px);
  right: -40px;
}
.guide-container .support_box .lease_wrap .d-flex li .lh3::after {
  content: "";
  position: absolute;
  background: url("../support/img/icon_allow.svg") no-repeat;
  background-size: contain;
  width: 15px;
  height: 17px;
  top: 50%;
  right: -37px;
}
.guide-container .support_box .lease_wrap .d-flex li .blue {
  background: #26BEF3;
}
.guide-container .support_box .lease_wrap .d-flex li .green {
  background-color: #3DC142;
}
.guide-container .support_box .lease_wrap .d-flex li .red {
  background-color: #DF2626;
}
.guide-container .support_box .lease_wrap .d-flex li .lease_ttl {
  color: #FFFFFF;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 0;
  height: 40px;
  border-radius: 5px 5px 0 0;
}
.guide-container .support_box .lease_wrap .d-flex li .lease_price {
  font-family: "Arial", "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 0;
  padding: 1.8rem 0;
}
.guide-container .support_box .lease_wrap .d-flex li .lease_price span {
  font-family: "Noto Sans JP", "Noto Sans JP", "Noto Sans Japanese", sans-serif;
  font-size: 1.6rem;
  font-weight: bold;
  margin-left: 0.8rem;
}
@media screen and (min-width: 769px) {
  .guide-container .support_box {
    margin-bottom: 80px;
  }
  .guide-container .support_box h3 {
    max-width: 1100px;
    font-size: 2.4rem !important;
  }
  .guide-container .support_box .support_list {
    line-height: 38px;
  }
  .guide-container .support_box .note {
    padding: 28px 36px;
    margin-top: 42px;
  }
  .guide-container .support_box .note p {
    width: 100%;
  }
  .guide-container .support_box .note img {
    bottom: 0;
    right: 25px;
    width: 150px;
  }
  .guide-container .support_box table {
    width: 1100px;
  }
}
@media screen and (max-width: 1099px) {
  .guide-container .support_box .support_table table {
    display: block;
    width: 100%;
  }
  .guide-container .support_box .support_table table tbody {
    display: flex;
  }
  .guide-container .support_box .support_table table tr {
    display: block;
    width: 50%;
  }
  .guide-container .support_box .support_table table th, .guide-container .support_box .support_table table td {
    display: block;
    width: 100%;
  }
  .guide-container .support_box .support_table table td {
    border-top: none;
  }
  .guide-container .support_box .support_table table .last th, .guide-container .support_box .support_table table .last td {
    border-left: none;
    margin-left: 1px;
  }
}
@media screen and (max-width: 768px) {
  .guide-container .support_box .lease_wrap {
    padding: 1.8rem;
  }
  .guide-container .support_box .lease_wrap .d-flex {
    gap: 5rem 3rem;
    justify-content: center;
  }
  .guide-container .support_box .lease_wrap .d-flex li:nth-of-type(1)::after {
    right: -27px;
  }
  .guide-container .support_box .lease_wrap .d-flex li:nth-of-type(2)::after {
    top: 104px;
    right: 102%;
    transform: rotate(90deg);
  }
  .guide-container .support_box .lease_wrap .d-flex li .lease_ttl {
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.2;
  }
  .guide-container .support_box .lease_wrap .d-flex li .lh1 {
    height: 30px;
    padding-top: 10px;
  }
  .guide-container .support_box .lease_wrap .d-flex li .lh2 {
    height: 36px;
    padding-top: 4px;
  }
  .guide-container .support_box .lease_wrap .d-flex li .lh3 {
    height: 34px;
    padding-top: 16px;
  }
  .guide-container .support_box .lease_wrap .d-flex li .lh3::after {
    top: 70px;
    right: calc(50% - 7.5px);
    transform: rotate(90deg);
  }
  .guide-container .support_box .lease_wrap .d-flex li .lh4 {
    height: 42px;
    padding-top: 8px;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_half {
    border-radius: 5px 5px 0 0;
    width: 44.5%;
    height: 100px;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_half .lease_ttl {
    border-radius: 5px 5px 0 0;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_half .lease_price {
    padding: 1.6rem 0;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_full {
    border-radius: 5px 0 0 5px;
    max-width: 100%;
    width: calc(89% + 3rem);
    display: flex;
    height: 50px;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_full .lease_ttl {
    border-radius: 5px 0 0 5px;
    width: 11rem;
  }
  .guide-container .support_box .lease_wrap .d-flex .lease_full .lease_price {
    padding: 1rem 4.4rem;
  }
}

.cta-sp {
  margin-top: 50px;
}
.cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}

.cta-pc {
  margin: 120px auto;
}

.guide {
  background: url("../img/common/top-img01_sp.jpg") no-repeat;
  background-size: cover;
}
.guide .ttlArea img {
  width: 36px;
}
.guide .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .guide {
    background: url("../img/common/top-img01.jpg") no-repeat;
    background-size: cover;
  }
  .guide .ttlArea img {
    width: 70px;
  }
  .guide .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.sub-container h2 {
  text-align: center;
  position: relative;
  margin-bottom: 6rem;
  letter-spacing: 4px;
}
.sub-container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 40px;
  height: 3px;
  background-color: #DF2626;
  bottom: -2rem;
  left: calc(50% - 20px);
}
@media screen and (min-width: 769px) {
  .sub-container h2 {
    margin: 120px auto 70px;
  }
}
.sub-container .d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .sub-container .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.sub-container .mt30 {
  margin-top: 3rem;
}

.guide-container section p {
  line-height: 30px;
}
@media screen and (min-width: 769px) {
  .guide-container section p {
    line-height: 38px;
  }
}
.guide-container .step_box {
  margin-top: 9.2rem;
}
.guide-container .step_box .step_wrap {
  gap: 7.7rem;
  align-items: center;
}
.guide-container .step_box .step_wrap .item {
  width: 29.5rem;
  border: 1px solid #D1D1D1;
  border-radius: 10px;
  padding: 5rem 2rem 1rem;
  text-align: center;
  position: relative;
}
.guide-container .step_box .step_wrap .item::before {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  top: -32px;
  left: calc(50% - 32px);
}
.guide-container .step_box .step_wrap .item:nth-child(1)::before {
  background: url("../flow/img/icon_step1.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item:nth-child(2)::before {
  background: url("../flow/img/icon_step2.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item:nth-child(3)::before {
  background: url("../flow/img/icon_step3.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item:nth-child(4)::before {
  background: url("../flow/img/icon_step4.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item:nth-child(5)::before {
  background: url("../flow/img/icon_step5.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item:nth-child(6)::before {
  background: url("../flow/img/icon_step6.svg") no-repeat;
  background-size: contain;
}
.guide-container .step_box .step_wrap .item::after {
  content: "";
  position: absolute;
  background: url("../flow/img/allow.svg") no-repeat;
  background-size: contain;
  width: 17px;
  height: 15px;
  bottom: -34px;
  right: calc(50% - 8.5px);
}
.guide-container .step_box .step_wrap .item:last-child::after {
  content: none;
}
.guide-container .step_box .step_wrap .item .step_ttl {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 0;
}
.guide-container .step_box .step_wrap .item img {
  margin: 1.5rem 0 2rem;
}
.guide-container .step_box .step_wrap .item .step_txt {
  text-align: left;
}
.guide-container .step_box .step_wrap .item .step_txt a {
  color: #DF2626;
  text-decoration: underline;
}
@media screen and (min-width: 769px) {
  .guide-container .step_box {
    margin-top: 104px;
  }
  .guide-container .step_box .step_wrap {
    gap: 60px;
    justify-content: center;
    align-items: stretch;
  }
  .guide-container .step_box .step_wrap .item {
    width: 260px;
    position: relative;
  }
  .guide-container .step_box .step_wrap .item::after {
    bottom: 50%;
    right: calc(0% - 40px);
    transform: rotate(-90deg);
  }
  .guide-container .step_box .step_wrap .item .step_txt {
    line-height: 1.6;
  }
  .guide-container .step_box .step_wrap .item .step_txt a:hover {
    color: #a11818;
    opacity: 1;
  }
  .guide-container .step_box .step_wrap .item .step_txt .telsp {
    color: #333333;
    text-decoration: none;
    pointer-events: none;
  }
}

.cta-sp {
  margin-top: 50px;
}

.cta-pc {
  margin: 120px auto;
}

.guide {
  background: url("../img/common/top-img01_sp.jpg") no-repeat;
  background-size: cover;
}
.guide .ttlArea img {
  width: 36px;
}
.guide .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .guide {
    background: url("../img/common/top-img01.jpg") no-repeat;
    background-size: cover;
  }
  .guide .ttlArea img {
    width: 70px;
  }
  .guide .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.sub-container h2 {
  text-align: center;
  position: relative;
  margin-bottom: 6rem;
  letter-spacing: 4px;
}
.sub-container h2::after {
  content: "";
  display: block;
  position: absolute;
  width: 40px;
  height: 3px;
  background-color: #DF2626;
  bottom: -2rem;
  left: calc(50% - 20px);
}
@media screen and (min-width: 769px) {
  .sub-container h2 {
    margin: 120px auto 70px;
  }
}
.sub-container .d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .sub-container .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.sub-container .mt30 {
  margin-top: 3rem;
}

.guide-container section p {
  line-height: 30px;
}
@media screen and (min-width: 769px) {
  .guide-container section p {
    line-height: 38px;
  }
}
.guide-container .point_box {
  margin: 5rem 0;
}
.guide-container .point_box .item_wrap {
  gap: 4.7rem;
}
.guide-container .point_box li {
  position: relative;
  width: 300px;
  margin: 0 auto;
}
.guide-container .point_box li::before {
  content: "";
  position: absolute;
  width: 54px;
  height: 54px;
  top: -27px;
  left: -20px;
  z-index: 1;
}
.guide-container .point_box li:nth-child(1)::before {
  background: url("../howto/img/icon_point1.svg") no-repeat;
  background-size: contain;
}
.guide-container .point_box li:nth-child(2)::before {
  background: url("../howto/img/icon_point2.svg") no-repeat;
  background-size: contain;
}
.guide-container .point_box li:nth-child(3)::before {
  background: url("../howto/img/icon_point3.svg") no-repeat;
  background-size: contain;
}
.guide-container .point_box .item {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
  width: 30rem;
  border-width: 2px 2px 40px;
  border-style: solid;
  border-color: #DF2626;
  border-radius: 10px;
  padding: 1.6rem 0;
  margin: 0 auto;
  position: relative;
}
.guide-container .point_box .item:hover {
  opacity: 0.8;
}
.guide-container .point_box .item::after {
  content: "";
  position: absolute;
  background: url("../howto/img/allow.svg") no-repeat;
  background-size: contain;
  width: 28px;
  height: 16px;
  bottom: -28px;
  left: calc(50% - 14px);
}
.guide-container .point_box .item p {
  color: #333333;
  margin: 0 0 0 1rem;
  font-size: 1.8rem;
  font-weight: bold;
}
.guide-container .point_box .item img {
  width: 7rem;
  pointer-events: none;
}
@media screen and (min-width: 769px) {
  .guide-container .point_box h3 {
    font-size: 2rem;
    margin-bottom: 6.2rem;
  }
  .guide-container .point_box .item_wrap {
    gap: 60px;
    justify-content: center;
  }
  .guide-container .point_box li {
    margin: 0;
  }
  .guide-container .point_box li::before {
    width: 66px;
    height: 66px;
    top: -33px;
    left: calc(50% - 33px);
  }
  .guide-container .point_box .item {
    flex-direction: column;
    border-width: 2px 2px 60px;
    padding: 50px 0 20px;
    height: 206px;
  }
  .guide-container .point_box .item::after {
    width: 36px;
    height: 20px;
    bottom: -40px;
    left: calc(50% - 18px);
  }
  .guide-container .point_box .item p {
    margin: 0;
    font-size: 20px;
    text-align: center;
  }
  .guide-container .point_box .item img {
    width: 140px;
  }
}
.guide-container .badcase_box {
  margin: 3rem 0 6rem;
}
.guide-container .badcase_box .item_wrap {
  background-color: #F6F9FE;
  padding: 3rem;
  margin: 3rem 0;
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.guide-container .badcase_box .item_wrap .item h3 {
  text-align: left;
  padding-bottom: 1rem;
  padding-left: 1.8em;
  margin-bottom: 2rem;
  border-bottom: 1px solid #333333;
  position: relative;
  font-size: 2rem;
}
.guide-container .badcase_box .item_wrap .item h3::before {
  content: "";
  position: absolute;
  background: url("../howto/img/icon_cross.svg") no-repeat;
  background-size: contain;
  width: 24px;
  height: 24px;
  top: 2px;
  left: 0;
}
.guide-container .badcase_box .item_wrap .item p {
  text-align: left;
  margin-bottom: 0;
}
@media screen and (min-width: 769px) {
  .guide-container .badcase_box {
    margin: 50px 0 80px;
  }
  .guide-container .badcase_box .item_wrap {
    padding: 40px;
  }
  .guide-container .badcase_box .item_wrap .item h3::before {
    top: 3px;
  }
  .guide-container .badcase_box .item_wrap .item p {
    text-align: left;
    margin-bottom: 0;
  }
}
.guide-container .point {
  padding-top: 100px;
  margin-top: -100px;
  margin-bottom: 5rem;
}
.guide-container .point h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  max-width: 760px;
  margin: 0 auto 3rem;
  padding: 0.8rem 1rem 1.2rem;
  text-align: left;
  display: flex;
  align-items: center;
}
.guide-container .point h3 img {
  margin: 0 1rem 0 0;
}
.guide-container .point .subttl {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 2rem;
}
.guide-container .point table {
  width: 907px;
  margin-top: 3rem;
  border-collapse: collapse;
}
.guide-container .point th, .guide-container .point td {
  border: 1px solid #D1D1D1;
  padding: 15px 0;
  width: 150px;
  text-align: center;
}
.guide-container .point thead {
  background-color: rgba(223, 38, 38, 0.1);
}
@media screen and (min-width: 769px) {
  .guide-container .point h3 {
    max-width: 1100px;
  }
  .guide-container .point table {
    width: 1100px;
  }
  .guide-container .point th, .guide-container .point td {
    width: 183px;
  }
  .guide-container .point .mt30 {
    margin-top: 50px;
  }
}
.guide-container .point_boxB {
  margin: 5rem 0;
}
.guide-container .point_boxB .item_wrap {
  gap: 3rem;
}
.guide-container .point_boxB .item {
  width: 30rem;
  border: 2px solid #DF2626;
  border-radius: 10px;
  padding: 3rem 0;
  margin: 0 auto;
  text-align: center;
}
.guide-container .point_boxB .item p {
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.8;
}
.guide-container .point_boxB .item img {
  width: 24rem;
}
@media screen and (min-width: 769px) {
  .guide-container .point_boxB h3 {
    font-size: 2rem;
  }
  .guide-container .point_boxB .item_wrap {
    gap: 60px;
    justify-content: center;
  }
  .guide-container .point_boxB .item {
    margin: 0;
  }
}

.cta-sp {
  margin-top: 50px;
}
.cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}

.cta-pc {
  margin: 120px auto;
}

.news {
  background: url("../img/news/header-bg_sp.jpg") no-repeat;
  background-size: cover;
}
.news .ttlArea img {
  width: 36px;
}
.news .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .news {
    background: url("../img/news/header-bg.jpg") no-repeat;
    background-size: cover;
  }
  .news .ttlArea img {
    width: 70px;
  }
  .news .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.news-detail {
  border-bottom: 1px dashed #d1d1d1;
  margin-bottom: 40px;
  padding-bottom: 40px;
}
.news-detail time {
  font-family: "Arial", "メイリオ";
  color: #a0a0a0;
  font-size: 14px;
}
.news-detail h3 {
  border-bottom: solid 2px #333333;
  position: relative;
  text-align: left !important;
  margin-top: 15px;
  padding-bottom: 5px;
}
.news-detail h3::after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 2px #df2626;
  bottom: -2px;
  width: 10%;
}
.news-detail p {
  line-height: 1.5em;
  letter-spacing: 1.5px;
  margin-bottom: 0;
}
@media screen and (min-width: 769px) {
  .news-detail p {
    line-height: 2;
  }
}
.news-detail p + p {
  margin-top: 20px;
}
.news-detail p .red {
  color: #df2626;
  font-weight: 500;
}
.news-detail p strong {
  font-weight: 500;
}
.news-detail p a {
  color: #DF2626;
  text-decoration: underline;
}
.news-detail p a:hover {
  color: #a11818;
  opacity: 1;
}

.pagenation-box__prev {
  width: 48%;
  float: left;
}
@media screen and (min-width: 769px) {
  .pagenation-box__prev {
    width: auto;
  }
}
.pagenation-box__prev a {
  width: 100%;
  text-align: center;
  color: #333333;
  border-radius: 5px;
  border: 1px solid #d1d1d1;
  border-radius: 50vw;
  padding: 10px 20px;
  background: #fff;
  position: relative;
  display: block;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .pagenation-box__prev a {
    width: 200px;
  }
}
.pagenation-box__prev a::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  position: absolute;
  top: 50%;
  left: 20px;
  transform: rotate(-135deg) translateY(30%);
}
.pagenation-box__prev a:hover {
  background: #d1d1d1;
  color: #333333;
}
.pagenation-box__prev a:hover::after {
  transition: 0.3s;
  border-color: #333333;
}
.pagenation-box__next {
  width: 48%;
  float: right;
}
@media screen and (min-width: 769px) {
  .pagenation-box__next {
    width: auto;
  }
}
.pagenation-box__next a {
  width: 100%;
  text-align: center;
  color: #333333;
  border-radius: 5px;
  border: 1px solid #d1d1d1;
  border-radius: 50vw;
  padding: 10px 20px;
  background: #fff;
  position: relative;
  display: block;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .pagenation-box__next a {
    width: 200px;
  }
}
.pagenation-box__next a::after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: rotate(45deg) translateY(-50%);
}
.pagenation-box__next a:hover {
  background: #d1d1d1;
  color: #333333;
}
.pagenation-box__next a:hover::after {
  transition: 0.3s;
  border-color: #333333;
}

.news-top {
  text-align: center;
  clear: both;
  margin-top: 130px;
}
.news-top a {
  width: 100%;
  text-align: center;
  margin: 0 auto 60px;
  color: #df2626;
  border-radius: 5px;
  border: 1px solid #df2626;
  border-radius: 50vw;
  padding: 15px 20px;
  background: #fff;
  position: relative;
  display: block;
  font-size: 18px;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .news-top a {
    width: 350px;
    font-size: 20px;
    padding: 20px 20px;
  }
}
.news-top a::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #df2626;
  border-right: 1px solid #df2626;
  position: absolute;
  top: 50%;
  right: 30px;
  transform: rotate(45deg) translateY(-50%);
}
.news-top a:hover {
  background: #df2626;
  color: #fff;
}
.news-top a:hover::after {
  transition: 0.3s;
  border-color: #fff;
}

.faq {
  background: url("../faq/img/header-bg_sp.jpg") no-repeat;
  background-size: cover;
}
.faq .ttlArea img {
  width: 36px;
}
.faq .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .faq {
    background: url("../faq/img/header-bg.jpg") no-repeat;
    background-size: cover;
  }
  .faq .ttlArea img {
    width: 70px;
  }
  .faq .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.faq-detail {
  border-bottom: 1px dashed #d1d1d1;
  margin-bottom: 40px;
  padding-bottom: 40px;
}

.accordion-item + .accordion-item {
  margin-top: 50px;
}

.accordion-container .accordion-title {
  display: block;
  position: relative;
  margin: 0;
  padding: 25px 2.5em 25px 4em;
  font-size: 16px;
  letter-spacing: 1.2px;
  font-weight: normal;
  color: #333333;
  background: #f6f9fe;
  cursor: pointer;
  margin-top: 20px;
  border: 1px solid #d1d1d1;
  font-weight: 500;
  transition: 0.3s;
}
@media screen and (min-width: 769px) {
  .accordion-container .accordion-title {
    font-size: 18px;
  }
}

.accordion-container .accordion-title::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  background-image: url("../faq/img/icon.svg");
  background-size: contain;
  vertical-align: middle;
}
@media screen and (min-width: 769px) {
  .accordion-container .accordion-title::before {
    left: 25px;
  }
}

.accordion-container .accordion-title.open {
  background-color: #c8daf9;
  color: #333333;
}

@media screen and (min-width: 769px) {
  .accordion-container .accordion-title:hover,
  .accordion-container .accordion-title:active,
  .accordion-container .content-entry.open .accordion-title {
    background-color: #c8daf9;
    color: #333333;
  }
}
.accordion-container .accordion-title:hover i:before,
.accordion-container .accordion-title:hover i:active,
.accordion-container .content-entry.open i {
  color: white;
}

.accordion-title:after {
  content: "";
  position: absolute;
  right: 25px;
  top: 45%;
  transition: all 0.2s ease-in-out;
  display: block;
  width: 5px;
  height: 5px;
  border-top: solid 1px #333333;
  border-right: solid 1px #333333;
  transform: rotate(135deg);
}

.accordion-title.open:after {
  transform: rotate(-45deg);
  top: 45%;
}

.accordion-content {
  display: none;
  padding: 30px 20px;
  border-right: 1px solid #d1d1d1;
  border-left: 1px solid #d1d1d1;
  border-bottom: 1px solid #d1d1d1;
}
@media screen and (min-width: 769px) {
  .accordion-content {
    padding: 30px 30px;
  }
}
.accordion-content p {
  letter-spacing: 1.2px;
  line-height: 2;
  margin-bottom: 0;
  font-size: 14px;
}
@media screen and (min-width: 769px) {
  .accordion-content p {
    font-size: 16px;
  }
}
.accordion-content p a {
  color: #df2626;
  text-decoration: underline;
  transition: 0.3s;
}
.accordion-content p a:hover {
  color: #a11818;
}

.cta-sp {
  margin-top: 50px;
}
.cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}

.cta-pc {
  margin: 120px auto;
}

.contact {
  background: url("../contact/img/header-bg_sp.jpg") no-repeat;
  background-size: cover;
}
.contact .ttlArea img {
  width: 36px;
}
.contact .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .contact {
    background: url("../contact/img/header-bg.jpg") no-repeat;
    background-size: cover;
  }
  .contact .ttlArea img {
    width: 70px;
  }
  .contact .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.contact-container .contact-lead h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.contact-container .contact-lead p {
  letter-spacing: 1.5px;
  line-height: 2;
}
.contact-container .contact-lead p span.red {
  color: #df2626;
}
.contact-container .contact-lead p a {
  color: #df2626;
  text-decoration: underline;
  transition: 0.3s;
}
.contact-container .contact-lead p a:hover {
  color: #a11818;
}
.contact-container .cta-sp {
  margin-top: 50px;
}
.contact-container .cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}
.contact-container .cta-pc {
  margin: 60px auto;
}
.contact-container .contact-form h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.contact-container .contact-form p {
  letter-spacing: 1.5px;
  line-height: 2;
}
.contact-container .contact-form p span.red {
  color: #df2626;
}
.contact-container .contact-form p a {
  color: #df2626;
  text-decoration: underline;
  transition: 0.3s;
}
.contact-container .contact-form p a:hover {
  color: #a11818;
}
.contact-container .contact-form__lead {
  font-weight: bold;
  font-size: 20px;
}
.contact-container #form {
  padding-top: 100px;
  margin-top: -100px;
}
.contact-container form {
  max-width: 820px;
  margin: 40px auto;
  box-sizing: border-box;
  /* Firefox */
  /* Firefox 18以前 */
  /* IE */
  /* Chrome, Safari */
  /* Firefox */
  /* Firefox 18以前 */
  /* IE */
}
.contact-container form input.invalid,
.contact-container form select.invalid,
.contact-container form textarea.invalid {
  background-color: #fef4f4 !important;
  border: 1px solid #df2626 !important;
}
.contact-container form input[type=text],
.contact-container form input[type=tel],
.contact-container form input[type=email] {
  display: block;
  width: 100%;
  height: 60px;
  padding: 15px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  box-sizing: border-box;
}
.contact-container form textarea {
  display: block;
  width: 100%;
  height: 100px;
  padding: 20px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  font-family: "Noto Sans JP", "Noto Sans JP", "Noto Sans Japanese", sans-serif;
}
.contact-container form textarea::-moz-placeholder {
  color: #a5a2a2;
}
.contact-container form textarea::placeholder {
  color: #a5a2a2;
}
.contact-container form .form-price input[type=text] {
  display: block;
  width: 300px;
  height: 60px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  margin-right: 10px;
}
.contact-container form .form-block {
  width: 100%;
  box-sizing: border-box;
}
.contact-container form .form-block p {
  letter-spacing: normal;
}
.contact-container form .form-block input[type=text] {
  display: block;
  width: 100%;
  height: 60px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  box-sizing: border-box;
}
.contact-container form .form-pref {
  margin: 20px 0;
}
.contact-container form .form-pref .form-label {
  width: 80px;
  margin: 0;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-pref .form-label {
    width: 100px;
  }
}
.contact-container form .form-pref .select-wrap {
  position: relative;
  width: calc(100% - 80px);
}
@media screen and (min-width: 769px) {
  .contact-container form .form-pref .select-wrap {
    width: auto;
  }
}
.contact-container form .form-pref .select-wrap::after {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  position: absolute;
  top: 40%;
  right: 20px;
  transform: rotate(-225deg);
  pointer-events: none;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-pref .select-wrap::after {
    right: 30px;
  }
}
.contact-container form .form-pref select {
  display: block;
  width: 100%;
  height: 50px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  margin-right: 10px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-pref select {
    width: 300px;
  }
}
.contact-container form .form-pref + .invalid-text {
  margin-top: -10px;
  margin-bottom: 20px;
}
.contact-container form .form-zip__inner {
  display: flex;
  width: calc(100% - 80px);
}
@media screen and (min-width: 769px) {
  .contact-container form .form-zip__inner {
    width: auto;
  }
}
.contact-container form .form-zip input[type=text] {
  display: block;
  width: 130px;
  height: 60px;
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #f6f9fe;
  background-image: none;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  margin-right: 10px;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-zip input[type=text] {
    width: 200px;
    height: 60px;
    padding: 6px 12px;
  }
}
.contact-container form .form-zip .form-label {
  width: 80px;
  margin: 0;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-zip .form-label {
    width: 100px;
  }
}
.contact-container form .form-zip button {
  background: #333333;
  border: 1px solid #333;
  color: #fff;
  border-radius: 5px;
  padding: 10px 10px;
  transition: 0.3s;
  width: calc(100% - 130px);
  font-size: 13px;
  height: 60px;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-zip button {
    width: auto;
    padding: 10px 20px;
    font-size: 16px;
  }
}
.contact-container form .form-zip button:hover {
  cursor: pointer;
  background: #fff;
  color: #333;
}
.contact-container form .invalid-text {
  color: #df2626;
  font-size: 14px;
  margin-top: 5px;
  display: block;
  width: 100%;
}
.contact-container form .form-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}
.contact-container form .form-item + .form-item {
  margin-top: 30px;
}
.contact-container form .form-flexItem {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
}
.contact-container form .form-label {
  letter-spacing: normal;
  margin: 0 10px 0 0;
  font-size: 14px;
  width: 70px;
}
@media screen and (min-width: 769px) {
  .contact-container form .form-label {
    margin: 0;
    font-size: 16px;
    width: 100px;
  }
}
.contact-container form label {
  width: 100%;
  display: block;
  margin-bottom: 15px;
}
.contact-container form label .label-required {
  background: #df2626;
  color: #fff;
  border-radius: 50vw;
  padding: 2px 15px;
  font-size: 14px;
  margin-right: 10px;
}
.contact-container form label .label-any {
  background: #a0a0a0;
  color: #fff;
  border-radius: 50vw;
  padding: 2px 15px;
  font-size: 14px;
  margin-right: 10px;
}
.contact-container form input::-webkit-input-placeholder {
  color: #a0a0a0;
}
.contact-container form input::-moz-placeholder {
  color: #a0a0a0;
}
.contact-container form input:-moz-placeholder {
  color: #a0a0a0;
}
.contact-container form input:-ms-input-placeholder {
  color: #a0a0a0;
}
.contact-container form .form-control::-webkit-input-placeholder {
  color: #a0a0a0;
}
.contact-container form .form-control::-moz-placeholder {
  color: #a0a0a0;
}
.contact-container form .form-control:-moz-placeholder {
  color: #a0a0a0;
}
.contact-container form .form-control:-ms-input-placeholder {
  color: #a0a0a0;
}
.contact-container .form-check {
  margin-top: 50px;
  text-align: center;
}
.contact-container .form-check label {
  text-align: center;
}
.contact-container .form-check .CheckboxInput {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.contact-container .form-check .CheckboxInput-Input {
  margin: 0;
  width: 0;
  opacity: 0;
}
.contact-container .form-check .CheckboxInput:hover > .CheckboxInput-DummyInput {
  border: solid 2px #df2626;
}
.contact-container .form-check .CheckboxInput-Input:focus + .CheckboxInput-DummyInput {
  border: solid 2px #df2626;
}
.contact-container .form-check .CheckboxInput-Input:checked + .CheckboxInput-DummyInput {
  border: solid 2px #df2626;
  background: #ffffff;
}
.contact-container .form-check .CheckboxInput-Input:checked + .CheckboxInput-DummyInput::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../contact/img/check.svg") no-repeat center;
  background-size: contain;
}
.contact-container .form-check .CheckboxInput-DummyInput {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  width: 20px;
  height: 20px;
  border: solid 2px #888888;
  background: #ffffff;
  border-radius: 4px;
}
.contact-container .form-check .CheckboxInput-DummyInput.invalid {
  background-color: #fef4f4 !important;
  border: 2px solid #df2626 !important;
}
.contact-container .form-check .CheckboxInput-LabelText {
  margin-left: 12px;
  display: block;
  font-size: 16px;
}
@media screen and (min-width: 769px) {
  .contact-container .form-check .CheckboxInput-LabelText {
    font-size: 18px;
  }
}
.contact-container .form-check p {
  color: #df2626;
  font-size: 12px;
  margin-bottom: 0;
}
@media screen and (min-width: 769px) {
  .contact-container .form-check p {
    font-size: 16px;
  }
}
.contact-container .privacypolicy {
  border: 1px solid #d1d1d1;
  border-radius: 5px;
  height: 200px;
  width: 100%;
  overflow-y: scroll;
  padding: 20px;
  box-sizing: border-box;
  margin-top: 40px;
}
@media screen and (min-width: 769px) {
  .contact-container .privacypolicy {
    padding: 30px;
  }
}
.contact-container .privacypolicy__title {
  font-weight: bold;
  font-size: 16px;
}
@media screen and (min-width: 769px) {
  .contact-container .privacypolicy__title {
    font-size: 18px;
  }
}
.contact-container .privacypolicy__text {
  font-size: 14px;
}
@media screen and (min-width: 769px) {
  .contact-container .privacypolicy__text {
    font-size: 16px;
  }
}
.contact-container .privacypolicy__text__title {
  font-weight: bold;
}
.contact-container .privacypolicy ul li + li {
  margin-top: 10px;
}
.contact-container .submit__button {
  margin-top: 20px;
}
@media screen and (min-width: 769px) {
  .contact-container .submit__button {
    margin-top: 50px;
  }
}
.contact-container .submit__button button,
.contact-container .submit__button a {
  width: 100%;
  text-align: center;
  margin: 40px auto 30px;
  color: #df2626;
  border-radius: 5px;
  border: 1px solid #df2626;
  border-radius: 50vw;
  padding: 15px 20px;
  background: #fff;
  position: relative;
  display: block;
  font-size: 16px;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .contact-container .submit__button button,
  .contact-container .submit__button a {
    width: 350px;
    font-size: 18px;
    padding: 20px 20px;
    margin: 0 auto 60px;
  }
}
.contact-container .submit__button button::after,
.contact-container .submit__button a::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #df2626;
  border-right: 1px solid #df2626;
  position: absolute;
  top: 50%;
  right: 30px;
  transform: rotate(45deg) translateY(-50%);
}
.contact-container .submit__button button:hover,
.contact-container .submit__button a:hover {
  background: #df2626;
  color: #fff;
  cursor: pointer;
}
.contact-container .submit__button button:hover::after,
.contact-container .submit__button a:hover::after {
  transition: 0.3s;
  border-color: #fff;
}
.contact-container .submit__button--confirm {
  margin-top: 20px;
  display: block;
}
@media screen and (min-width: 769px) {
  .contact-container .submit__button--confirm {
    margin-top: 50px;
    display: flex;
    align-items: center;
  }
}
.contact-container .submit__button--confirm .back {
  width: 100%;
  text-align: center;
  margin: 0 auto 20px;
  color: #333333;
  border-radius: 5px;
  border: 1px solid #333333;
  border-radius: 50vw;
  padding: 15px 20px;
  background: #fff;
  position: relative;
  display: block;
  font-size: 16px;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .contact-container .submit__button--confirm .back {
    width: 350px;
    font-size: 18px;
    padding: 20px 20px;
    margin: 0 auto;
  }
}
.contact-container .submit__button--confirm .back::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  position: absolute;
  top: 50%;
  left: 30px;
  transform: rotate(-135deg) translateY(80%);
}
.contact-container .submit__button--confirm .back:hover {
  background: #333333;
  color: #fff;
  cursor: pointer;
}
.contact-container .submit__button--confirm .back:hover::after {
  transition: 0.3s;
  border-color: #fff;
}
.contact-container .submit__button--confirm .submit {
  width: 100%;
  text-align: center;
  margin: 0 auto 60px;
  color: #df2626;
  border-radius: 5px;
  border: 1px solid #df2626;
  border-radius: 50vw;
  padding: 15px 20px;
  background: #fff;
  position: relative;
  display: block;
  font-size: 16px;
  transition: 0.3s;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .contact-container .submit__button--confirm .submit {
    width: 350px;
    font-size: 18px;
    padding: 20px 20px;
    margin: 0 auto;
  }
}
.contact-container .submit__button--confirm .submit::after {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 1px solid #df2626;
  border-right: 1px solid #df2626;
  position: absolute;
  top: 50%;
  right: 30px;
  transform: rotate(45deg) translateY(-50%);
}
.contact-container .submit__button--confirm .submit:hover {
  background: #df2626;
  color: #fff;
  cursor: pointer;
}
.contact-container .submit__button--confirm .submit:hover::after {
  transition: 0.3s;
  border-color: #fff;
}
.contact-container .confirm-form .form-item {
  border-bottom: 1px solid #d1d1d1;
  padding-bottom: 20px;
  margin-bottom: 20px;
}
.contact-container .confirm-form .privacy__text {
  text-align: center;
  margin: 40px auto;
}

.recruit {
  background: url("../recruit/img/header-bg_sp.jpg") no-repeat;
  background-size: cover;
}
.recruit .ttlArea img {
  width: 36px;
}
.recruit .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .recruit {
    background: url("../recruit/img/header-bg.jpg") no-repeat;
    background-size: cover;
  }
  .recruit .ttlArea img {
    width: 70px;
  }
  .recruit .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.d-pc-flex {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 769px) {
  .d-pc-flex {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.recruit-lead__img img {
  width: 100%;
}
.recruit-lead__text {
  text-align: left;
}
@media screen and (min-width: 769px) {
  .recruit-lead__text {
    text-align: center;
  }
}
.recruit-lead__text p {
  letter-spacing: 1.5px;
  line-height: 2;
  margin-bottom: 0;
  margin-top: 30px;
}
.recruit-lead__text p span {
  font-size: 20px;
  color: #df2626;
  font-weight: bold;
}

.recruit-cta .cta-sp {
  margin-top: 50px;
}
.recruit-cta .cta-sp .cta-mini a {
  height: 30px;
  line-height: 29px;
}
.recruit-cta .cta-pc {
  margin: 60px auto 100px;
}
.recruit-cta .cta-pc .contents {
  align-items: center;
  justify-content: center;
}
.recruit-cta .cta-pc .contents img {
  width: 200px;
}
.recruit-cta .cta-pc .contents .right .cta-mini {
  padding: 15px;
}

.recruit-flow {
  margin-bottom: 50px;
}
@media screen and (min-width: 769px) {
  .recruit-flow {
    margin-bottom: 100px;
  }
}
.recruit-flow h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.recruit-flow .step_box {
  margin-top: 60px;
}
.recruit-flow .step_box .step_wrap {
  gap: 7.7rem;
  align-items: center;
}
.recruit-flow .step_box .step_wrap .item {
  width: 29.5rem;
  border: 1px solid #d1d1d1;
  border-radius: 10px;
  padding: 5rem 2rem 1rem;
  text-align: center;
  position: relative;
}
.recruit-flow .step_box .step_wrap .item::before {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  top: -32px;
  left: calc(50% - 32px);
}
.recruit-flow .step_box .step_wrap .item:nth-child(1)::before {
  background: url("../flow/img/icon_step1.svg") no-repeat;
  background-size: contain;
}
.recruit-flow .step_box .step_wrap .item:nth-child(2)::before {
  background: url("../flow/img/icon_step2.svg") no-repeat;
  background-size: contain;
}
.recruit-flow .step_box .step_wrap .item:nth-child(3)::before {
  background: url("../flow/img/icon_step3.svg") no-repeat;
  background-size: contain;
}
.recruit-flow .step_box .step_wrap .item::after {
  content: "";
  position: absolute;
  background: url("../flow/img/allow.svg") no-repeat;
  background-size: contain;
  width: 17px;
  height: 15px;
  bottom: -34px;
  right: calc(50% - 8.5px);
}
.recruit-flow .step_box .step_wrap .item:last-child::after {
  content: none;
}
.recruit-flow .step_box .step_wrap .item .step_ttl {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 0;
}
.recruit-flow .step_box .step_wrap .item img {
  margin: 1.5rem 0 2rem;
}
.recruit-flow .step_box .step_wrap .item .step_txt {
  text-align: center;
}
.recruit-flow .step_box .step_wrap .item .step_txt a {
  color: #DF2626;
  text-decoration: underline;
}
.recruit-flow .step_box .step_wrap .item .step_txt a:hover {
  color: #a11818;
  opacity: 1;
}
@media screen and (min-width: 769px) {
  .recruit-flow .step_box {
    margin-top: 104px;
  }
  .recruit-flow .step_box .step_wrap {
    gap: 60px;
    justify-content: center;
    align-items: stretch;
  }
  .recruit-flow .step_box .step_wrap .item {
    width: 260px;
    position: relative;
  }
  .recruit-flow .step_box .step_wrap .item::after {
    bottom: 50%;
    right: calc(0% - 40px);
    transform: rotate(-90deg);
  }
  .recruit-flow .step_box .step_wrap .item .step_txt {
    line-height: 1.6;
  }
  .recruit-flow .step_box .step_wrap .item .step_txt .telsp {
    color: #333333;
    text-decoration: none;
    pointer-events: none;
  }
}

.company {
  background: url("../company/img/header-bg_sp.jpg") no-repeat;
  background-size: cover;
}
.company .ttlArea img {
  width: 36px;
}
.company .ttlArea h2 {
  margin: 0 0 0 4px;
}
@media screen and (min-width: 769px) {
  .company {
    background: url("../company/img/header-bg.jpg") no-repeat;
    background-size: cover;
  }
  .company .ttlArea img {
    width: 70px;
  }
  .company .ttlArea h2 {
    margin: 0 0 0 20px;
  }
}

.company-lead__box {
  display: block;
}
@media screen and (min-width: 769px) {
  .company-lead__box {
    display: flex;
  }
}
.company-lead__img {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .company-lead__img {
    width: 300px;
  }
}
.company-lead__img img {
  width: 100%;
}
.company-lead__text {
  width: 100%;
  margin-left: 0;
  margin-top: 20px;
}
@media screen and (min-width: 769px) {
  .company-lead__text {
    width: calc(100% - 330px);
    margin-left: 30px;
    margin-top: 0;
  }
}
.company-lead__text p {
  letter-spacing: 1.5px;
  line-height: 2;
}
.company-lead__flex {
  display: block;
  margin-top: 50px;
}
@media screen and (min-width: 769px) {
  .company-lead__flex {
    display: flex;
  }
}
.company-lead__flex--l {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .company-lead__flex--l {
    width: 50%;
  }
}
.company-lead__flex--l .company-lead__item {
  padding: 36px 30px;
}
.company-lead__flex--r {
  width: 100%;
  margin-left: 0;
  margin-top: 30px;
}
@media screen and (min-width: 769px) {
  .company-lead__flex--r {
    width: 50%;
    margin-left: 30px;
    margin-top: 0;
  }
}
.company-lead__item {
  background: #f6f9fe;
  padding: 20px;
  text-align: center;
  border-radius: 10px;
}
@media screen and (min-width: 769px) {
  .company-lead__item {
    padding: 30px;
  }
}
.company-lead__item + .company-lead__item {
  margin-top: 30px;
}
.company-lead__itemTitle {
  background: #fff;
  border: 2px dashed #333333;
  border-radius: 50vw;
  padding: 10px;
  font-size: 20px;
  color: #df2626;
  font-weight: bold;
  width: 100%;
  margin: 0 auto 20px;
  box-sizing: border-box;
}
@media screen and (min-width: 769px) {
  .company-lead__itemTitle {
    width: 250px;
  }
}
.company-lead__itemTitle span {
  margin-right: 10px;
}
.company-lead__itemTitle span img {
  width: 25px;
}
.company-lead__item p {
  margin-bottom: 0;
  line-height: 1.8;
}
.company-lead__item p + p {
  margin-top: 15px;
}
.company-lead__itemText {
  background: #fff;
  padding: 10px;
}
.company-lead__itemText span {
  color: #df2626;
}

.company-about {
  margin-top: 80px;
}
.company-about h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.company-about table {
  width: 100%;
  border-collapse: collapse;
}
.company-about thead td {
  background-color: #F6F9FE;
  font-weight: bold;
}
.company-about th,
.company-about td {
  border: 1px solid #d1d1d1;
  padding: 15px;
  text-align: center;
  font-size: 13px;
}
@media screen and (min-width: 769px) {
  .company-about th,
  .company-about td {
    font-size: 16px;
    padding: 15px 20px;
  }
}
.company-about th {
  background-color: rgba(223, 38, 38, 0.1);
  font-weight: bold;
  width: 30%;
  vertical-align: middle;
}
@media screen and (min-width: 769px) {
  .company-about th {
    width: 25%;
    vertical-align: top;
  }
}
.company-about td {
  width: 75%;
  text-align: left;
}

.company-map {
  margin-top: 80px;
}
.company-map h3 {
  border-top: 4px solid #DF2626;
  background-color: #F6F9FE;
  padding: 0.8rem 1.8rem 1.2rem;
  text-align: left !important;
  display: flex;
  align-items: center;
}
.company-map__item + .company-map__item {
  margin-top: 60px;
}
.company-map__item p {
  border-left: 5px solid #DF2626;
  font-size: 20px;
  font-weight: bold;
  padding-left: 10px;
  margin-bottom: 30px;
}
@media screen and (min-width: 769px) {
  .company-map__item p {
    font-size: 24px;
  }
}
.company-map__itemFlex {
  display: block;
}
@media screen and (min-width: 769px) {
  .company-map__itemFlex {
    display: flex;
  }
}
.company-map__itemImg {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .company-map__itemImg {
    width: 300px;
  }
}
.company-map__itemImg img {
  width: 100%;
}
.company-map__itemTable {
  width: 100%;
  margin-left: 0;
  margin-top: 30px;
}
@media screen and (min-width: 769px) {
  .company-map__itemTable {
    width: calc(100% - 340px);
    margin-left: 40px;
    margin-top: 0;
  }
}
.company-map__itemTable table {
  width: 100%;
  border-collapse: collapse;
}
.company-map__itemTable thead td {
  background-color: #F6F9FE;
  font-weight: bold;
}
.company-map__itemTable th,
.company-map__itemTable td {
  border: 1px solid #d1d1d1;
  padding: 15px;
  text-align: center;
  font-size: 13px;
}
@media screen and (min-width: 769px) {
  .company-map__itemTable th,
  .company-map__itemTable td {
    font-size: 16px;
    padding: 15px 20px;
  }
}
.company-map__itemTable th {
  background-color: rgba(223, 38, 38, 0.1);
  font-weight: bold;
  width: 35%;
  vertical-align: middle;
}
@media screen and (min-width: 769px) {
  .company-map__itemTable th {
    width: 25%;
  }
}
.company-map__itemTable td {
  width: 65%;
  text-align: left;
}
@media screen and (min-width: 769px) {
  .company-map__itemTable td {
    width: 75%;
  }
}
.company-map__itemTable td a.tel-link {
  color: #df2626;
  text-decoration: underline;
}
@media screen and (min-width: 769px) {
  .company-map__itemTable td a.tel-link {
    pointer-events: none;
    color: #333;
    text-decoration: none;
  }
}
.company-map__itemMap {
  margin-top: 30px;
}
@media screen and (min-width: 769px) {
  .company-map__itemMap {
    margin-top: 50px;
  }
}
.company-map__itemMap div {
  width: 100% !important;
  height: 250px !important;
}/*# sourceMappingURL=style.css.map */