﻿.for-pc {
  display:inline
}
@media screen and (max-width: 749px) {
  .for-pc {
    display:none
  }
}
.for-sp {
  display:inline
}
@media screen and (min-width: 750px) {
  .for-sp {
    display:none
  }
}
@keyframes bound {
  0% {
    -webkit-transform:translate(0, 0)
  }
  30% {
    -webkit-transform:translate(0, 0)
  }
  40% {
    -webkit-transform:translate(0, -5px)
  }
  50% {
    -webkit-transform:translate(0, 0)
  }
}
@keyframes bound2 {
  50% {
    transform:translateY(0);
    box-shadow:0 5px 0 color-mix(in srgb, var(--btn, #FF3F33) 80%, black)
  }
  75% {
    transform:translateY(5px);
    box-shadow:0 0 0 color-mix(in srgb, var(--btn, #FF3F33) 80%, black)
  }
}
@keyframes shiny {
  0% {
    transform:scale(0) rotate(45deg);
    opacity:0
  }
  80% {
    transform:scale(0) rotate(45deg);
    opacity:.5
  }
  81% {
    transform:scale(4) rotate(45deg);
    opacity:1
  }
  100% {
    transform:scale(50) rotate(45deg);
    opacity:0
  }
}
.w0 {
  width:0%
}
.mt0 {
  margin-top:0px !important
}
.mb0 {
  margin-bottom:0px !important
}
.w10 {
  width:10%
}
.mt10 {
  margin-top:10px !important
}
.mb10 {
  margin-bottom:10px !important
}
.w20 {
  width:20%
}
.mt20 {
  margin-top:20px !important
}
.mb20 {
  margin-bottom:20px !important
}
.w30 {
  width:30%
}
.mt30 {
  margin-top:30px !important
}
.mb30 {
  margin-bottom:30px !important
}
.w40 {
  width:40%
}
.mt40 {
  margin-top:40px !important
}
.mb40 {
  margin-bottom:40px !important
}
.w50 {
  width:50%
}
.mt50 {
  margin-top:50px !important
}
.mb50 {
  margin-bottom:50px !important
}
.w60 {
  width:60%
}
.mt60 {
  margin-top:60px !important
}
.mb60 {
  margin-bottom:60px !important
}
.w70 {
  width:70%
}
.mt70 {
  margin-top:70px !important
}
.mb70 {
  margin-bottom:70px !important
}
.w80 {
  width:80%
}
.mt80 {
  margin-top:80px !important
}
.mb80 {
  margin-bottom:80px !important
}
.w90 {
  width:90%
}
.mt90 {
  margin-top:90px !important
}
.mb90 {
  margin-bottom:90px !important
}
.w100 {
  width:100%
}
.mt100 {
  margin-top:100px !important
}
.mb100 {
  margin-bottom:100px !important
}
.m-auto {
  margin:auto
}
*,*::before,*::after {
  box-sizing:border-box
}
html {
  -moz-text-size-adjust:none;
  -webkit-text-size-adjust:none;
  text-size-adjust:none;
  font-size:62.5%;
  font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","游ゴシック","Yu Gothic",Meiryo,sans-serif;
  font-feature-settings:"palt";
  text-decoration-skip-ink:all
}
body {
  font-size:1.6rem;
  accent-color:#ed1c24;
  font-weight:500
}
@media screen and (min-width: 750px) {
  body {
    font-size:2rem
  }
}
body,h1,h2,h3,h4,p,figure,blockquote,dl,dd {
  margin:0
}
body {
  min-height:100vh;
  line-height:1.6
}
a:not([class]) {
  text-decoration-skip-ink:auto;
  color:currentColor
}
img,picture,svg,video {
  max-width:100%;
  display:block;
  height:auto
}
input,button,textarea,select {
  font:inherit
}
textarea:not([rows]) {
  min-height:10em
}
:target {
  scroll-margin-block:5ex
}
a,button {
  cursor:pointer;
  transition:all .4s ease
}
button {
  padding:0;
  border:none;
  outline:none;
  font:inherit;
  color:inherit;
  background:none
}
input[type=submit],input[type=button] {
  border-radius:0;
  -webkit-box-sizing:content-box;
  -webkit-appearance:button;
  appearance:button;
  border:none;
  box-sizing:border-box;
  cursor:pointer
}
input[type=submit]::-webkit-search-decoration,input[type=button]::-webkit-search-decoration {
  display:none
}
input[type=submit]::focus,input[type=button]::focus {
  outline-offset:-2px
}
.head {
  width:100%;
  padding:1rem;
  background:#fff;
  border-bottom:1px solid #eee
}
.head_inner {
  max-width:750px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.head .logo {
  width:150px
}
.head-logo {
  font-size:24px
}
.head-pr {
  border:1px solid #bdb5a5;
  border-radius:3px;
  padding:5px;
  line-height:1;
  font-size:14px;
  color:#bdb5a5
}
.head.flex-end .head_inner {
  justify-content:flex-end
}
.is-scroll {
  padding-top:50px
}
.is-scroll .head {
  position:fixed;
  top:0;
  left:0;
  z-index:999
}
.company h2 {
  padding:.5em;
  background:#ebf3f9;
  border-bottom:2px solid #78b3ce;
  font-size:1.2em
}
.company p {
  margin-bottom:1em;
  font-size:.9em
}
.company table {
  border-collapse:collapse
}
.company table th,.company table td {
  font-size:80%;
  border-bottom:1px solid #cbe4ef !important
}
.company table th {
  background:#ebf3f9 !important;
  color:inherit !important
}
.footer,footer {
  padding:3rem 1rem;
  background:#f6f6f6;
  text-align:center
}
.footer *,footer * {
  font-size:12px
}
@media screen and (min-width: 750px) {
  .footer *,footer * {
    font-size:14px
  }
}
.footer ul,footer ul {
  display:flex;
  justify-content:center;
  list-style-type:none;
  margin-top:1em;
  padding:0;
  gap:30px;
  list-style-type:none
}
.footer ul li,footer ul li {
  position:relative;
  padding-left:0 !important
}
footer a, .footer ul li a,footer ul li a {
  text-decoration:none
}
.footer ul li::before,footer ul li::before {
  display:none !important
}
.footer ul li::after,footer ul li::after {
  content:"";
  display:block;
  width:1px;
  height:1em;
  background:#414141;
  position:absolute;
  top:50%;
  right:-15px;
  margin-top:-0.5em
}
.footer ul li:last-of-type::after,footer ul li:last-of-type::after {
  display:none
}
.search h3 {
  margin:0 auto;
  padding:.5em;
  background:#4ba2e6;
  color:#fff;
  position:relative;
  cursor:pointer
}
.search h3::after {
  content:"";
  display:block;
  width:.5em;
  height:.5em;
  background:#fff;
  clip-path:polygon(0 0, 100% 0, 50% 100%);
  position:absolute;
  top:50%;
  right:1em
}
.search form {
  display:block;
  padding:1em;
  background:#f8f8f8;
  border-radius:0 0 5px 5px
}
.search form h4 {
  margin-bottom:.5em;
  position:relative
}
.search form h4:first-child {
  margin-top:0
}
.search form.hide {
  display:none
}
.search form .refine_btn {
  display:block;
  width:100%;
  max-width:300px;
  margin:.5em auto;
  border-radius:var(--round, 5px);
  padding:.5em;
  color:#fff;
  font-weight:bold;
  background:var(--btn, #FF6C0C);
  border:1px solid color-mix(in srgb, var(--btn, #FF6C0C) 80%, black);
  box-shadow:inset 2px 2px 2px hsla(0,0%,100%,.3),inset -2px -2px 2px rgba(0,0,0,.1),0 5px 5px rgba(0,0,0,.3);
  text-shadow:0 2px 0 rgba(0,0,0,.2);
  font-size:1.2em;
  text-decoration:none;
  transition:all .4s ease
}
.search form .refine_btn:hover {
  opacity:.5
}
.lp {
  max-width:800px;
  margin:auto;
  font-size:3.7vw
}
@media screen and (min-width: 750px) {
  .lp {
    font-size:1.7rem
  }
}
.lp .fv {
  margin-bottom:1em;
  position:relative
}
.lp .fv_text {
  display:flex;
  align-items:center;
  gap:5px;
  padding:1rem 1.5rem 1rem 1rem;
  background:#008aff;
  border-radius:0 0 10px 10px;
  color:#fff;
  font-weight:bold;
  font-size:clamp(1.4rem,2.5vw,2.4rem);
  position:absolute;
  top:-10px;
  left:2%;
  line-height:1.2;
  letter-spacing:.05em
}
.lp .fv_text img {
  width:1.6rem
}
@media screen and (min-width: 750px) {
  .lp .fv_text img {
    width:3rem
  }
}
.lp .fv_text::after {
  content:"";
  display:block;
  width:0;
  height:0;
  border-width:5px;
  border-style:solid;
  border-color:rgba(0,0,0,0) rgba(0,0,0,0) #356c9b #356c9b;
  position:absolute;
  top:0;
  right:-10px
}
.lp .inner {
  padding:1em
}
.lp .inner *:last-child {
  margin-bottom:0
}
.lp p {
  margin-bottom:1em
}
.lp .sec h2 {
  margin:30px auto
}
.lp .sec p {
  margin-bottom:1em;
  line-height:1.8
}
.lp .sec p:last-of-type {
  margin-bottom:0
}
.lp .slider_box {
  display:flex !important;
  gap:5%;
  padding:1em;
  background:#fffbdb;
  border:1px solid #ffc05b;
  border-radius:5px
}
.lp .slider_box figure {
  width:30%;
  text-align:center
}
.lp .slider_box figure span {
  display:block;
  background:#fff;
  border-radius:50%;
  overflow:hidden
}
.lp .slider_box figure figcaption {
  font-size:70%
}
.lp .slider_box_body {
  width:65%
}
.lp .slick-dots {
  display:flex;
  justify-content:center;
  gap:10px;
  margin:1em 0
}
.lp .slick-dots li {
  padding:0;
  margin:0
}
.lp .slick-dots li button {
  width:.6em;
  height:.6em;
  background:#ccc;
  border-radius:50%;
  text-indent:100%;
  overflow:hidden
}
.lp .slick-active button {
  background:#666 !important
}
.lp .table_wrap {
  padding:5% 2%
}
.lp .table table thead th {
  background:#8aadc3;
  border-bottom:none;
  border-radius:10px 10px 0 0;
  color:#fff
}
.lp .table table thead th:first-of-type {
  background:#ffb62b
}
.lp .table table tbody th {
  width:45px;
  background:#3e8cce;
  color:#fff;
  border-bottom:1px solid #fff
}
@media screen and (min-width: 750px) {
  .lp .table table tbody th {
    width:40px
  }
}
.lp .table table tbody td {
  width:100px;
  background:#f1f1f1;
  border-right:1px solid #ccc;
  border-bottom:1px dashed #ccc;
  vertical-align:middle
}
.lp .table table tbody td:first-of-type {
  background:#fffce3
}
.lp .table table tbody tr:last-of-type th,.lp .table table tbody tr:last-of-type td {
  border-bottom:none
}
.lp .table table tbody tr td:last-of-type {
  border-right:none
}
.lp .rate_wrap {
  width:100%;
  font-weight:bold;
  position:relative
}
.lp .rate_num {
  display:block;
  text-align:center;
  font-size:2rem
}
.lp .rate_score {
  position:relative;
  margin:auto;
  width:80px;
  height:16px;
  font-size:1.6rem;
  text-align:left
}
@media screen and (min-width: 750px) {
  .lp .rate_score {
    width:100px;
    height:20px;
    font-size:2rem !important
  }
}
.lp .rate_score::before,.lp .rate_score span {
  position:absolute;
  display:inline-block;
  height:16px;
  line-height:16px;
  font-size:1.6rem !important
}
@media screen and (min-width: 750px) {
  .lp .rate_score::before,.lp .rate_score span {
    height:20px;
    line-height:20px;
    font-size:2rem !important
  }
}
.lp .rate_score::before {
  content:"★★★★★";
  color:#c4c4c4
}
.lp .rate_score span {
  overflow:hidden;
  color:#ffb906;
  width:calc(var(--score)*16px)
}
@media screen and (min-width: 750px) {
  .lp .rate_score span {
    width:calc(var(--score)*20px)
  }
}
.lp .compare {
  width:98%;
  margin:0 auto 1em
}
@media screen and (min-width: 750px) {
  .lp .compare {
    width:100%
  }
}
.lp .compare_ttl {
  margin:2em auto 1em;
  position:relative
}
.lp .compare_ttl h2 {
  background:rgba(0,0,0,0);
  padding:0;
  margin:0;
  border:0
}
.lp .compare_ttl-bubble {
  display:inline-block;
  padding:.2em 1em;
  justify-content:center;
  background:#fff;
  border:2px solid #dab961;
  border-radius:50px;
  position:absolute;
  top:-1.3em;
  left:50%;
  transform:translateX(-50%)
}
.lp .compare_ttl-bubble::before,.lp .compare_ttl-bubble::after {
  content:"";
  display:block;
  width:0;
  height:0;
  border-width:12px 8px;
  border-style:solid;
  position:absolute;
  left:50%;
  transform:translateX(-50%)
}
.lp .compare_ttl-bubble::before {
  border-color:#dab961 rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  bottom:-24px;
  z-index:1
}
.lp .compare_ttl-bubble::after {
  border-color:#fff rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  bottom:-24px;
  z-index:2
}
.lp .compare_ttl-main {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:1.2em .5em .5em;
  background:#dab961;
  color:#fff;
  border:none;
  margin:0;
  text-align:center
}
.lp .compare table {
  border-collapse:separate;
  border-radius:6px;
  border:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black);
  overflow:clip;
  table-layout:fixed;
  text-align:center;
  border-spacing:0
}
@media screen and (min-width: 750px) {
  .lp .compare table {
    border-radius:10px
  }
}
.lp .compare table th,.lp .compare table td {
  white-space:normal;
  position:relative
}
.lp .compare table th {
  padding:.5rem 1rem !important;
  background:var(--table, #b6e6f4);
  border-right:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black);
  border-bottom:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black)
}
.lp .compare table th:last-of-type {
  border-right:none
}
.lp .compare table td {
  width:33.333%;
  padding:.5em .5em 1em !important;
  background:#fff;
  vertical-align:top;
  border-right:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black);
  border-bottom:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black)
}
.lp .compare table td:last-of-type {
  border-right:none
}
.lp .compare table td:first-of-type {
  background:#fffce3
}
.lp .compare table td p {
  margin-bottom:.5em;
  line-height:1.4
}
.lp .compare table td .icon {
  width:3em;
  height:3em;
  margin:0 auto .25em
}
.lp .compare table td .icon svg {
  width:100%;
  height:100%
}
.lp .compare table td .url {
  font-size:1rem;
  text-align:left;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
@media screen and (min-width: 750px) {
  .lp .compare table td .url {
    font-size:1.2rem
  }
}
.lp .compare table thead td:first-of-type {
  color:#ffd536
}
.lp .compare table thead td:nth-of-type(2) {
  color:#d2d0cd
}
.lp .compare table thead td:nth-of-type(3) {
  color:#af9280
}
.lp .compare table .cell-fixed {
  position:sticky;
  top:0;
  background:#fff;
  font-weight:bold;
  z-index:5
}
.lp .compare table .cell-fixed:before {
  content:"";
  position:absolute;
  top:0;
  left:-1px;
  width:100%;
  height:100%;
  border-bottom:1px solid color-mix(in srgb, var(--table, #b6e6f4) 90%, black);
  z-index:5;
  pointer-events:none
}
.lp .compare table .cell-fixed img {
  margin:auto
}
.lp .compare table .cell-fixed:first-of-type:before {
  left:0
}
.lp .compare table .btn {
  margin:0
}
.lp .compare table .btn a {
  padding:.5em;
  font-size:1em
}
.lp .compare_rank {
  width:80px;
  margin:auto;
  text-align:center
}
.lp .compare_name {
  color:#000;
  margin-top:5px
}
.lp .compare_name a {
  color:#2476ff;
  text-decoration:underline
}
.lp .compare_cellttl {
  margin-bottom:.5em;
  text-align:center;
  background:#2476ff;
  color:#fff;
  font-weight:bold;
  border-radius:50px
}
.lp .compare_more a {
  color:#2476ff;
  margin-top:5px
}
.lp .items {
  counter-reset:rank
}
.lp .items h2 {
  margin-bottom:1rem
}
@media screen and (min-width: 750px) {
  .lp .items h2 {
    margin-bottom:3rem
  }
}
.lp .items .item {
  margin:2em auto;
  padding:10px;
  box-shadow:0 0 10px rgba(0,0,0,.1);
  border-radius:10px;
  background:#fff;
  position:relative
}
.lp .items .item_head {
  display:flex;
  gap:1em;
  align-items:center;
  margin-bottom:15px
}
.lp .items .item_rank {
  width:60px
}
.lp .items .item_name {
  font-weight:bold;
  font-size:120%
}
.lp .items .item_main {
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  margin-bottom:10px;
  align-items:flex-start
}
.lp .items .item_thumb {
  width:100%;
  margin-bottom:10px
}
@media screen and (min-width: 750px) {
  .lp .items .item_thumb {
    width:40%;
    margin-bottom:0
  }
}
.lp .items .item_thumb img {
  width:100%;
  height:100%;
  object-fit:contain
}
.lp .items .item_feature {
  display:flex;
  gap:.5em 2%;
  flex-wrap:wrap;
  margin:1em auto
}
.lp .items .item_feature_box {
  width:23.5%;
  padding:.5em;
  background:#fcef91;
  text-align:center;
  border-radius:5px;
  font-weight:bold;
  font-size:80%
}
.lp .items .item_feature_box.is-none {
  background:#ccc;
  color:#666
}
.lp .items .item .review {
  width:95%;
  margin:3rem auto
}
.lp .items .item .review h3 {
  margin-bottom:1rem;
  color:#1d4687;
  text-align:center
}
@media screen and (min-width: 750px) {
  .lp .items .item .review h3 {
    margin-bottom:3rem
  }
}
.lp .items .item .review_list {
  background:#fff;
  border:2px solid #64c3e1;
  border-radius:10px;
  position:relative;
  overflow:hidden
}
.lp .items .item .review_list dl {
  padding:1rem;
  border-bottom:1px solid #64c3e1
}
@media screen and (min-width: 750px) {
  .lp .items .item .review_list dl {
    padding:2rem
  }
}
.lp .items .item .review_list dl:last-of-type {
  border-bottom:none
}
.lp .items .item .review_list dl dt {
  display:flex;
  align-items:center;
  padding-bottom:1rem;
  border-bottom:1px dashed #bad9e1;
  font-size:1.4rem
}
@media screen and (min-width: 750px) {
  .lp .items .item .review_list dl dt {
    font-size:1.6rem
  }
}
.lp .items .item .review_list dl dt span {
  display:block;
  width:40px;
  height:40px;
  margin-right:1rem;
  overflow:hidden;
  border-radius:50px
}
.lp .items .item .review_list dl dt span img {
  width:100%;
  height:100%;
  object-fit:cover
}
@media screen and (min-width: 750px) {
  .lp .items .item .review_list dl dt span {
    width:60px;
    height:60px;
    margin-right:2rem
  }
}
.lp .items .item .review_list dl dt p {
  font-weight:bold;
  color:#13a6d0
}
.lp .items .item .review_list dl dd {
  padding:1rem 1rem 0;
  line-height:1.8;
  font-size:1.4rem
}
@media screen and (min-width: 750px) {
  .lp .items .item .review_list dl dd {
    padding:2rem 2rem 0;
    font-size:1.6rem
  }
}
.lp .items .item .review_list.is-hide {
  overflow:hidden;
  height:150px
}
@media screen and (min-width: 750px) {
  .lp .items .item .review_list.is-hide {
    height:250px
  }
}
.lp .items .item .review .morebtn {
  max-width:200px;
  margin:0 auto 1rem;
  padding:.5rem 1rem 1rem;
  background:#64c3e1;
  border-radius:0 0 10px 10px;
  color:#fff;
  text-align:center;
  cursor:pointer;
  position:relative
}
.lp .items .item .review .morebtn::before {
  content:"もっと見る";
  font-size:1.6rem
}
.lp .items .item .review .morebtn::after {
  content:"";
  display:block;
  width:8px;
  height:8px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform:rotate(45deg);
  position:absolute;
  right:1.5rem;
  top:50%;
  margin-top:-8px
}
.lp .items .item .review .morebtn.is-show::before {
  content:"閉じる"
}
.lp .items .item .review .morebtn.is-show::after {
  transform:rotate(225deg);
  margin-top:-4px
}
.lp .items .item:first-of-type .item_rank {
  color:#ffd536
}
.lp .items .item:first-of-type .item_rank svg {
  fill:#ffd536
}
.lp .items .item:nth-of-type(2) .item_rank {
  color:#d2d0cd
}
.lp .items .item:nth-of-type(2) .item_rank svg {
  fill:#d2d0cd
}
.lp .items .item:nth-of-type(3) .item_rank {
  color:#af9280
}
.lp .items .item:nth-of-type(3) .item_rank svg {
  fill:#af9280
}
.lp .items .flow {
  counter-reset:flow
}
.lp .items .flow_box {
  position:relative
}
.lp .items .flow_box-num {
  width:3em;
  height:3em;
  padding:.6em;
  background:#f16767;
  border-radius:50%;
  color:#fff;
  text-align:center;
  position:absolute;
  top:0;
  left:0
}
.lp .items .flow_box-num span {
  display:block;
  font-size:60%;
  font-weight:bold;
  line-height:1
}
.lp .items .flow_box-num::after {
  content:counter(flow);
  counter-increment:flow;
  font-weight:bold;
  font-size:1.5em;
  line-height:1
}
.lp .items .flow_box-wrap {
  margin-left:1.5em;
  padding:.5em 1em 1em 2em;
  border-left:4px solid #f16767
}
.lp .items .flow_box-wrap dt {
  font-weight:bold;
  font-size:1em;
  color:#f16767
}
.lp .items .flow_box-wrap dd {
  font-size:.8em
}
.searchform {
  margin:30px -8px;
  padding:10px;
  background:#6ebbff
}
.searchform h2 {
  margin:0 auto 20px !important;
  text-align:center;
  color:#fff
}
.searchform_inner {
  padding:5%;
  background:#fff
}
.searchform_inner dl dt {
  margin-bottom:1em;
  padding-left:.5em;
  border-left:6px solid #13a6d0;
  color:#1f4788;
  font-size:2.4rem;
  font-weight:bold
}
.searchform_input {
  display:flex;
  flex-wrap:wrap;
  gap:5%
}
.searchform_input label {
  display:block;
  width:47.5%;
  margin-bottom:1rem;
  padding:1rem .5rem;
  border:2px solid #7baabb;
  background:#fff;
  border-radius:5px;
  transition:all .4s ease;
  cursor:pointer
}
@media screen and (min-width: 750px) {
  .searchform_input label {
    width:30%;
    padding:1rem
  }
}
.searchform_input label input {
  display:none
}
.searchform_input label span {
  display:flex;
  align-items:center;
  transition:all .4s ease;
  position:relative;
  font-size:1.4rem
}
@media screen and (min-width: 750px) {
  .searchform_input label span {
    font-size:1.8rem
  }
}
.searchform_input label span::before,.searchform_input label span::after {
  content:"";
  display:block;
  transition:all .4s ease
}
.searchform_input label span::before {
  width:1.6rem;
  height:1.6rem;
  margin-right:.5em;
  background:#e1e1e1;
  border-radius:3px;
  flex-shrink:0
}
@media screen and (min-width: 750px) {
  .searchform_input label span::before {
    width:2rem;
    height:2rem
  }
}
.searchform_input label span::after {
  width:.6rem;
  height:1.2rem;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  position:absolute;
  top:50%;
  left:.5rem;
  transform:rotate(45deg);
  margin-top:-0.7rem
}
@media screen and (min-width: 750px) {
  .searchform_input label span::after {
    width:.8rem;
    height:1.4rem;
    border-right:3px solid #fff;
    border-bottom:3px solid #fff;
    left:.6rem;
    margin-top:-0.8rem
  }
}
.searchform_input label input:checked+span {
  color:#4279e9
}
.searchform_input label input:checked+span::before {
  background:#4279e9
}
.searchform_input label:has(>input:checked) {
  border:2px solid #7baabb;
  background:#fff8ae
}
.pages {
  max-width:750px;
  min-height:80vh;
  padding:0 15px;
  margin:auto
}
@media screen and (min-width: 750px) {
  .pages {
    padding:0
  }
}
.pages h1,.pages h2,.pages h3,.pages h4,.pages h5,.pages h6,.pages p {
  margin-bottom:1em
}
.pages h1 {
  margin-top:1em
}
.archive_list li a {
  display:block;
  padding:.5em 1em;
  border-bottom:1px dashed #eee;
  border-left:3px solid #015aff;
  font-weight:bold;
  text-decoration:none;
  position:relative
}
.archive_list li a::after {
  content:"";
  display:block;
  width:.5em;
  height:.5em;
  border-top:2px solid #015aff;
  border-right:2px solid #015aff;
  position:absolute;
  top:50%;
  right:.1em;
  margin-top:-2px;
  transform:rotate(45deg)
}
.result {
  background:#f6f6f6
}
.result_search {
  padding:5%
}
.result_yours {
  padding:1rem 2rem;
  background:#fff;
  border:1px solid #eee
}
.result_yours h2 {
  margin-bottom:1rem;
  padding:.5rem 1rem;
  text-align:center;
  font-size:18px;
  font-weight:bold;
  border-bottom:1px solid #eee
}
@media screen and (min-width: 750px) {
  .result_yours h2 {
    margin-bottom:20px;
    font-size:20px
  }
}
.result_yours dl {
  display:flex;
  flex-wrap:wrap;
  border-bottom:1px dashed #eee
}
.result_yours dl dt {
  width:100%;
  padding:.5rem 0 0;
  font-weight:bold;
  font-size:12px;
  color:#91b5b2
}
@media screen and (min-width: 750px) {
  .result_yours dl dt {
    width:250px;
    padding:1rem;
    margin-right:50px
  }
}
.result_yours dl dd {
  width:100%;
  padding:0 0 .5rem;
  display:flex;
  flex-wrap:wrap
}
@media screen and (min-width: 750px) {
  .result_yours dl dd {
    padding:0 0 1rem
  }
}
.result_yours dl dd p {
  font-size:1.4rem
}
@media screen and (min-width: 750px) {
  .result_yours dl dd p {
    font-size:1.6rem
  }
}
.result_yours dl dd p::after {
  margin-right:.5em;
  content:","
}
.result_yours dl dd p:last-of-type::after {
  margin-right:0;
  content:""
}
@media screen and (min-width: 750px) {
  .result_yours dl dd {
    width:calc(100% - 300px);
    padding:1rem
  }
}
.result_yours-num {
  margin-top:1rem;
  padding:.5rem 1rem;
  background:#f8f8f8;
  text-align:center
}
.result_yours-num strong {
  color:#e2503a
}
.result-not {
  text-align:center;
  background:#fff;
  padding:2rem;
  border-radius:5px
}
.result_recommend-content {
  padding:5%;
  background:#fff;
  border:12px solid #edf8ff
}
.result_recommend-content p {
  margin-bottom:1em
}
.result_recommend-thumb {
  margin-bottom:15px
}
.result_recommend-thumb img {
  display:block;
  margin:auto
}
.faq {
  width:95%;
  margin:5rem auto
}
@media screen and (min-width: 750px) {
  .faq {
    width:100%
  }
}
.faq .sec_title {
  background-color:#071d5d;
  color:#fff;
  font-weight:bold;
  text-align:center;
  padding:2rem 1rem;
  position:relative;
  margin-bottom:0;
  border-radius:10px 10px 0 0
}
.faq .sec_title::after {
  content:"";
  display:block;
  width:0;
  height:0;
  border-width:10px;
  border-style:solid;
  border-color:#071d5d rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  position:absolute;
  bottom:-20px;
  left:50%;
  transform:translateX(-50%)
}
.faq dl {
  background:#fff;
  border-bottom:1px solid #b4aca1;
  transition:all .4s ease
}
.faq dl dt {
  font-weight:bold;
  border-bottom:1px dashed #eee;
  font-size:2rem;
  cursor:pointer;
  position:relative;
  transition:all .4s ease
}
.faq dl dt::before,.faq dl dt::after {
  content:"";
  display:block;
  position:absolute;
  transition:all .4s ease
}
.faq dl dt::before {
  width:16px;
  height:2px;
  background:#071d5d;
  right:20px;
  top:50%;
  margin-top:-1px
}
.faq dl dt::after {
  width:2px;
  height:16px;
  background:#071d5d;
  position:absolute;
  top:50%;
  margin-top:-8px;
  right:27px
}
.faq dl dt span {
  display:block;
  padding:20px;
  margin-right:50px
}
.faq dl dt span::before {
  content:"Q.";
  margin-right:1rem;
  font-family:"Times New Roman","YuMincho","Hiragino Mincho ProN","Yu Mincho","MS PMincho",serif;
  font-weight:bold
}
.faq dl dd {
  display:none;
  padding:20px 20px 20px 50px;
  font-size:1.8rem;
  position:relative
}
.faq dl dd::before {
  content:"A.";
  display:block;
  position:absolute;
  top:20px;
  left:20px;
  font-family:"Times New Roman","YuMincho","Hiragino Mincho ProN","Yu Mincho","MS PMincho",serif;
  font-weight:bold;
  font-size:2.4rem;
  line-height:1
}
.faq dl.is-open {
  background:#f4f7fd
}
.faq dl.is-open dt {
  color:#70a1c5;
  border-bottom:1px dashed #fff
}
.faq dl.is-open dt::before,.faq dl.is-open dt::after {
  transform:rotate(360deg)
}
.faq dl.is-open dt::after {
  opacity:0
}
.column h1 {
  padding-bottom:.5em;
  border-bottom:2px solid #eee
}
.pager ul {
  max-width:750px;
  width:90%;
  display:flex;
  justify-content:center;
  list-style-type:none;
  padding:0;
  margin:30px auto;
  gap:20px
}
.pager ul li a,.pager ul li.active {
  display:block;
  padding:.5em;
  color:#ccc;
  font-size:1.1em;
  text-decoration:none;
  border-radius:5px;
  transition:all .4s ease;
  line-height:1;
  font-size:1.6rem
}
.pager ul li a {
  border:1px solid #414141;
  color:#414141
}
a:not([class], footer a) {
  color:#2476ff
}
a:hover {
  opacity:.5
}
.inline {
  display:inline;
  vertical-align:middle
}
.icon-excellent {
  fill:#ed1c24 !important
}
.icon-good {
  fill:#f1d35b !important
}
.icon-average {
  fill:#8d96af !important
}
.icon-poor {
  fill:#414a85 !important
}
.icon-none {
  fill:#bdbdbd !important
}
.icon--tbl {
  width:3em;
  height:3em;
  margin:0 auto .25em
}
.icon-exlink {
  display:inline-block !important;
  margin:0 0 0 .25em !important;
  vertical-align:middle;
  fill:#2476ff
}
.bg-icon {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:1;
  opacity:.2
}
.bg-icon .icon {
  width:auto !important;
  height:auto !important
}
mark,.marker {
  color:inherit;
  font-weight:bold;
  background:linear-gradient(transparent 50%, var(--marker, #ffee00) 50%)
}
.marker-pink {
  color:inherit;
  font-weight:bold;
  background:linear-gradient(transparent 50%, #ffc5e2 50%)
}
.red {
  color:#f22226 !important
}
.blue {
  color:#3583cf !important
}
.gold {
  color:#ceaf79 !important
}
.orange {
  color:#fa812f !important
}
.yellow {
  color:#fee71a !important
}
.pink {
  color:#ee34cd !important
}
.navy {
  color:#373f70 !important
}
.green {
  color:#396 !important
}
.gray {
  color:#848484 !important
}
.line {
  color:#07cd07 !important
}
.bold {
  font-weight:bold !important
}
.text-l {
  font-size:150% !important
}
.text-m {
  font-size:120% !important
}
.text-s {
  font-size:80% !important
}
.underline {
  text-decoration:underline
}
.overline {
  text-decoration:overline
}
.line-through {
  text-decoration:line-through
}
.aligncenter {
  margin:auto;
  text-align:center
}
.text_bubble {
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:1rem;
  padding:.5em 1em .25em;
  font-size:80%;
  position:relative;
  z-index:2;
  line-height:1.2
}
.text_bubble::before,.text_bubble::after {
  content:"";
  display:block;
  width:3px;
  height:1em;
  background:#393939
}
.text_bubble::before {
  transform:rotate(-20deg)
}
.text_bubble::after {
  transform:rotate(20deg)
}
main h2,main h3,main h4,main h5,main h6 {
  max-width:800px;
  margin:auto;
  line-height:1.4;
  position:relative
}
main h2:has(.ttl_bubble),main h3:has(.ttl_bubble),main h4:has(.ttl_bubble),main h5:has(.ttl_bubble),main h6:has(.ttl_bubble) {
  margin-top:2em!important;
  padding-top:1em!important
}
main p {
  margin:0 auto 1em
}
main.--classic {
	font-family: "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	font-size: 1.6rem;
	line-height: 1.8;
}
@media screen and (min-width: 750px) {
  main.--classic {
	font-size: 2rem;
  }
}
main.--base h2 {
  margin:1em auto;
  padding:.5em;
  background:var(--bg, #4ba2e6);
  border:0;
  border-left:.4em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  border-radius:3px;
  color:var(--color, #fff);
  font-size:1.3em
}
main.--base h3 {
  margin:1em auto;
  padding:.3em;
  background:var(--bg, #4ba2e6);
  border:0;
  border-left:.2em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  border-radius:3px;
  color:var(--color, #fff);
  font-size:1.2em
}
main.--base h4 {
  margin:1em auto;
  padding:.3em .5em;
  border:0;
  background:color-mix(in srgb, var(--bg, #4ba2e6) 30%, white);
  border-radius:5px;
  color:var(--color, #000);
  font-size:1.1em
}
main.--base h5 {
  margin:1em auto;
  padding:.2em 0;
  border:0;
  border-bottom:3px solid var(--bg, #4ba2e6);
  color:var(--color, #000);
  font-size:1.1em
}
main.--base h6 {
  margin:1em auto;
  padding:.2em .5em;
  border:0;
  border-left:.3em solid var(--bg, #4ba2e6);
  color:var(--color, #000);
  font-size:1em
}
main .ttl_bubble {
  padding:.5em 1em;
  background:#fff;
  border:2px solid var(--bg, #4ba2e6);
  border-radius:100px;
  color:var(--bg, #4ba2e6);
  line-height:1em;
  font-size:70%;
  position:absolute;
  top:-1.5em;
  left:.5em;
  z-index:2
}
main .ttl_bubble::before,
main .ttl_bubble::after {
  content:"";
  display:block;
  position:absolute;
  width:0;
  height:0;
  border-width:10px 6px;
  border-style:solid;
}
main .ttl_bubble::before {
  border-color:#fff rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  bottom:-17px;
  left:2em;
  z-index:3
}
main .ttl_bubble::after {
  border-color:var(--bg, #4ba2e6) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
  bottom:-20px;
  left:2em
}
main.--simple h2 {
  margin:1em auto;
  padding:.5em;
  background:var(--bg, transparent);
  border:0;
  border-left:.4em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  border-bottom:.1em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  color:var(--color, #000);
  font-size:1.3em
}
main.--simple h3 {
  margin:1em auto;
  padding:.3em;
  background:var(--bg, #4ba2e6);
  border:0;
  border-left:.2em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  border-bottom:.1em dashed color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  color:var(--color, #000);
  font-size:1.2em
}
main.--simple h4 {
  margin:1em auto;
  padding:.3em .5em;
  border:0;
  border-left:.2em solid color-mix(in srgb, var(--bg, #4ba2e6) 80%, black);
  background:color-mix(in srgb, var(--bg, #4ba2e6) 30%, white);
  color:var(--color, #000);
  font-size:1.1em
}
main.--simple h5 {
  margin:1em auto;
  padding:.2em 0;
  border:0;
  border-bottom:3px solid var(--bg, #4ba2e6);
  color:var(--color, #000);
  font-size:1.1em
}
main.--simple h6 {
  margin:1em auto;
  padding:.2em .5em;
  border:0;
  border-left:.3em solid var(--bg, #4ba2e6);
  color:var(--color, #000);
  font-size:1em
}
table {
  width:100%;
  margin-bottom:1em;
  border-collapse:collapse
}
table th,table td {
  border:1px solid color-mix(in srgb, var(--table, #ebf3f9) 90%, black)
}
table thead th {
  text-align:center
}
table tbody th {
  text-align:left
}
table th,table td {
  padding:.5em
}
table th {
  background:var(--table, #ebf3f9);
  color:inherit
}
table.table-fixed {
  table-layout:fixed
}
table.table-first tr td:first-of-type {
  background:#feffd6
}
table [class^=btn] a,table [class*=" btn"] a {
  font-size:1em;
  padding:.5em .2em
}
table tfoot th,table tfoot td {
  border:none;
  background:none
}
table tfoot .bubble {
  padding:.7em;
  border-radius:5px;
  background:var(--bubble, #eee);
  white-space:normal;
  position:relative;
  font-size:.9em
}
table tfoot .bubble::before {
  content:"";
  display:block;
  width:.75em;
  height:.75em;
  background:var(--bubble, #eee);
  clip-path:polygon(50% 0, 100% 100%, 0 100%);
  position:absolute;
  top:-0.74em;
  left:50%;
  transform:translateX(-50%)
}
.box,.box_ttl,.box_ttl2,.bubble,.accordion,.tab {
  margin:0 0 1em 0
}
.box,.box_ttl-body,.box_ttl2-body,.bubble_body {
  position:relative
}
.box *:not(.bg-icon),.box_ttl-body *:not(.bg-icon),.box_ttl2-body *:not(.bg-icon),.bubble_body *:not(.bg-icon) {
  position:relative;
  z-index:2
}
.box *:last-child,.box_ttl-body *:last-child,.box_ttl2-body *:last-child,.bubble_body *:last-child {
  margin-bottom:0
}
.box {
  padding:1.5em;
  border-radius:5px;
  background:var(--box-bg, #fff);
  border:2px solid var(--box-border, #000)
}
.box_ttl-head {
  display:inline-block;
  padding:.5em 1em;
  margin-left:1rem;
  background:var(--box-border, #000);
  border-radius:3px 3px 0 0;
  color:#fff;
  line-height:1;
  font-weight:bold
}
.box_ttl-body {
  padding:1em;
  border-radius:5px;
  border-radius:0 0 3px 3px;
  background:var(--box-bg, #fff);
  flex-grow:1;
  border:2px solid var(--box-border, #000)
}
.box_ttl2 {
  display:flex;
  flex-direction:column;
  border-radius:5px;
  border:2px solid var(--box-border, #000)
}
.box_ttl2-head {
  padding:.5em 1em;
  border-radius:3px 3px 0 0;
  background:var(--box-border, #000);
  color:#fff;
  line-height:1;
  font-weight:bold
}
.box_ttl2-body {
  padding:1em;
  border-radius:0 0 3px 3px;
  background:var(--box-bg, #fff);
  flex-grow:1
}
.bubble {
  display:flex;
  align-items:flex-start;
  gap:1em
}
.bubble_icon {
  width:60px;
  height:60px;
  border-radius:50%;
  background:#f8f8f8;
  border:2px solid #eee;
  flex-shrink:0;
  position:sticky;
  top:5px;
  overflow:hidden
}
.bubble_icon img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
@media screen and (min-width: 750px) {
  .bubble_icon {
    width:calc(100% - 1em - 80px)
  }
}
@media screen and (min-width: 750px) {
  .bubble_icon {
    width:80px;
    height:80px
  }
}
.bubble_body {
  width:calc(100% - 1em - 60px);
  padding:1.5rem;
  background:var(--bubble-bg, #fff);
  border:2px solid var(--bubble-border, #000);
  border-radius:10px;
  position:relative
}
.bubble_body p:empty {
  display:none
}
.bubble_body::before,.bubble_body::after {
  content:"";
  display:block;
  position:absolute;
  width:0;
  height:0;
  border-width:8px 10px;
  border-style:solid
}
.bubble_body::before {
  top:20px;
  left:-22px;
  border-color:var(--bubble-border, #000) var(--bubble-border, #000) rgba(0,0,0,0) rgba(0,0,0,0);
  z-index:1
}
.bubble_body::after {
  top:22px;
  left:-16px;
  border-color:var(--bubble-bg, #fff) var(--bubble-bg, #fff) rgba(0,0,0,0) rgba(0,0,0,0);
  z-index:2
}
.bubble.bubble--right {
  flex-direction:row-reverse
}
.bubble.bubble--right .bubble_body::before {
  top:20px;
  right:-22px;
  left:auto;
  border-color:var(--bubble-border, #000) rgba(0,0,0,0) rgba(0,0,0,0) var(--bubble-border, #000);
  z-index:1
}
.bubble.bubble--right .bubble_body::after {
  top:22px;
  right:-16px;
  left:auto;
  border-color:var(--bubble-bg, #fff) rgba(0,0,0,0) rgba(0,0,0,0) var(--bubble-bg, #fff);
  z-index:2
}
.bubble+br {
  display:none
}
.accordion {
  border:2px solid var(--ac-bg, #000);
  border-radius:5px
}
.accordion_head {
  padding:1rem 3rem 1rem 1.5rem;
  background:var(--ac-bg, #000);
  color:var(--ac-color, #fff);
  cursor:pointer;
  position:relative;
  font-weight:bold
}
.accordion_head::before,.accordion_head::after {
  content:"";
  display:block;
  position:absolute;
  top:50%;
  transition:all .4s ease
}
.accordion_head::before {
  width:.3rem;
  height:2rem;
  background:var(--ac-color, #fff);
  right:1.85rem;
  margin-top:-1rem
}
.accordion_head::after {
  width:2rem;
  height:.3rem;
  background:var(--ac-color, #fff);
  right:1rem;
  margin-top:-0.15rem
}
.accordion_head.is-open::before {
  transform:rotate(90deg)
}
.accordion_head.is-open::after {
  transform:rotate(90deg);
  opacity:0
}
.accordion_body {
  display:none;
  padding:1.5rem
}
.tab_title {
  font-weight:bold;
  text-align:center;
  font-size:1.1em
}
.tab_title span {
  display:inline-block;
  border-bottom:2px solid #393939
}
.tab_nav {
  display:flex;
  gap:.5rem;
  padding:0;
  margin:0 0 -2px 0 !important;
  position:relative;
  z-index:2
}
.tab_nav li {
  margin-bottom:0;
  padding:1rem 2rem;
  border:2px solid var(--tab-border, #000);
  border-radius:8px 8px 0 0;
  line-height:1;
  font-weight:bold;
  background:color-mix(in srgb, var(--tab-border, #000) 20%, transparent);
  cursor:pointer
}
.tab_nav li.is-active {
  background:#fff;
  border-bottom-color:rgba(0,0,0,0)
}
.tab_body {
  background:#fff;
  border:2px solid var(--tab-border, #000)
}
.tab_box {
  display:none;
  padding:1.5rem
}
.tab_box.is-active {
  display:block
}
.flexbox {
  width:100%;
  display:flex !important;
  gap:1em 2%;
  flex-wrap:wrap
}
.flexbox>* {
  width:100% !important;
  box-sizing:border-box
}
@media screen and (min-width: 750px) {
  .flexbox>* {
    width:calc((100% - 2%*(var(--flex, 2) - 1))/var(--flex, 2)) !important
  }
}
ul,ol {
  padding:0;
  margin:0 0 1em
}
ul li,ol li {
  margin:0 0 1em 0;
  list-style-type:none;
  padding-left:1.5rem;
  position:relative;
  line-height:1.2
}
@media screen and (min-width: 750px) {
  ul li,ol li {
    padding-left:2rem
  }
}
ul li:last-of-type,ol li:last-of-type {
  margin-bottom:0
}
ul li::before,ul li::after,ol li::before,ol li::after {
  content:"";
  display:block;
  position:absolute
}
ul.none li,ol.none li {
  padding-left:0
}
ul.none li::before,ul.none li::after,ol.none li::before,ol.none li::after {
  display:none
}
ul:not([class]) li::before {
  width:6px;
  height:6px;
  background:var(--disc, #000);
  border-radius:50%;
  top:.5em;
  left:3px
}
@media screen and (min-width: 750px) {
  ul:not([class]) li::before {
    width:8px;
    height:8px;
    top:.5em
  }
}
ul.check li {
  padding-left:1.4em
}
@media screen and (min-width: 750px) {
  ul.check li {
    padding-left:1.2em
  }
}
ul.check li::before {
  width:1.2em;
  height:1.2em;
  background:var(--check, #000);
  border-radius:var(--round, 3px);
  top:0;
  left:0
}
@media screen and (min-width: 750px) {
  ul.check li::before {
    width:1em;
    height:1em;
    border-radius:var(--round, 3px);
    top:0;
    left:0
  }
}
ul.check li::after {
  width:.5em;
  height:.7em;
  border-right:3px solid #fff;
  border-bottom:3px solid #fff;
  top:.12em;
  left:.3em;
  transform:rotate(45deg)
}
@media screen and (min-width: 750px) {
  ul.check li::after {
    width:.4em;
    height:.6em
  }
}
ul.arrow li {
  padding-left:1.4em
}
@media screen and (min-width: 750px) {
  ul.arrow li {
    padding-left:1.2em
  }
}
ul.arrow li::before {
  width:1.2em;
  height:1.2em;
  background:var(--arrow, #000);
  border-radius:50px;
  top:3px;
  left:0
}
@media screen and (min-width: 750px) {
  ul.arrow li::before {
    width:1em;
    height:1em;
    border-radius:50px;
    top:0;
    left:0
  }
}
ul.arrow li::after {
  width:0;
  height:0;
  border-width:5px 7px;
  border-style:solid;
  border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #fff;
  top:.47em;
  left:.45em
}
@media screen and (min-width: 750px) {
  ul.arrow li::after {
    border-width:6px 8px;
    top:.39em;
    left:.39em
  }
}
ul.circle li {
  padding-left:1.2em
}
ul.circle li::before {
  content:"";
  display:block;
  width:.8em;
  height:.8em;
  border:3px solid var(--circle, #000);
  background:rgba(0,0,0,0);
  border-radius:50%;
  top:.8rem;
  left:0;
  position:absolute
}
ul.triangle li {
  padding-left:1.2em
}
ul.triangle li::before {
  content:"";
  display:block;
  --b:5px;
  width:1em;
  aspect-ratio:1/.8660254038;
  clip-path:polygon(50% 0, 100% 100%, 0 100%, 50% 0, 50% var(--b), calc(var(--b) * 0.8660254038) calc(100% - var(--b) / 2), calc(100% - var(--b) * 0.8660254038) calc(100% - var(--b) / 2), 50% var(--b));
  background:var(--triangle, #000);
  position:absolute;
  top:.7rem;
  left:0
}
ul.cross li {
  padding-left:1.2em;
  position:relative
}
ul.cross li::before,ul.cross li::after {
  content:"";
  display:block;
  width:.2em;
  height:1em;
  background:var(--cross, #000);
  position:absolute;
  top:.2em;
  left:.5em
}
ul.cross li::before {
  transform:rotate(45deg)
}
ul.cross li::after {
  transform:rotate(-45deg)
}
ul.note,ol.note {
  font-size:.8em
}
ul.note li,ol.note li {
  line-height:1.4;
  margin-bottom:.3em
}
ul.note li::before,ol.note li::before {
  position:absolute;
  top:0;
  left:0
}
ul.note.--gray,ol.note.--gray {
  color:#999
}
ul.note.center,ol.note.center {
  text-align:left;
  display:flex;
  flex-direction:column;
  align-items:center
}
ul.note.right,ol.note.right {
  text-align:left;
  display:flex;
  flex-direction:column;
  align-items:flex-end
}
ul.note li {
  padding-left:1.2em
}
ul.note li::before {
  content:"※";
  width:1em
}
ol.note {
  counter-reset:num
}
ol.note li {
  padding-left:2.2em
}
ol.note li::before {
  content:"※" counter(num);
  counter-increment:num;
  width:2em
}
ol.note li:first-of-type::before {
  counter-set:num var(--ini, 1)
}
ol:not([class]) {
  counter-reset:num
}
ol:not([class]) li {
  padding-left:1.2em
}
ol:not([class]) li::before {
  width:1.2em;
  height:1.2em;
  text-align:center;
  content:counter(num);
  counter-increment:num;
  color:#fff;
  background:var(--num, #000);
  border-radius:50px;
  line-height:1.2em;
  font-size:90%;
  top:4px;
  left:0;
  position:absolute;
  font-weight:bold
}
dl.num {
  margin:1em 0;
  counter-reset:num
}
dl.num dt {
  margin-bottom:.2em;
  padding-left:1.5em;
  font-weight:bold
}
dl.num dt::before {
  width:1.4em;
  height:1.4em;
  text-align:center;
  content:counter(num);
  counter-increment:num;
  color:#fff;
  background:var(--num, #000);
  border-radius:50px;
  line-height:1.4em;
  font-size:90%;
  top:2px;
  left:0;
  position:absolute;
  font-weight:bold
}
dl.num dd {
  margin-left:1.5em;
  margin-bottom:1em;
  font-size:90%
}
.bound {
  animation:bound 1s infinite linear alternate
}
.bound2 {
  animation:bound2 .5s ease infinite alternate
}
.shiny {
  position:relative;
  overflow:hidden
}
.shiny::before {
  position:absolute;
  content:"";
  display:inline-block;
  top:-180px;
  left:0;
  width:30px;
  height:100%;
  background-color:#fbfbfb;
  animation:shiny 2.5s ease-in-out infinite;
  z-index:2
}
.btn {
  margin:1em auto;
  border:0;
  border-radius:10px;
  font-weight:bold;
  text-decoration:none;
  transition:all .4s ease;
  position:relative;
  text-align:center
}
.btn_mc {
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:1rem;
  padding:.5em 1em .25em;
  color:color-mix(in srgb, var(--btn, #FF3F33) 80%, black 20%);
  font-size:80%;
  position:relative;
  z-index:2
}
.btn_mc::before,.btn_mc::after {
  content:"";
  display:block;
  width:3px;
  height:1.2em;
  background:color-mix(in srgb, var(--btn, #FF3F33) 80%, black 20%)
}
.btn_mc::before {
  transform:rotate(-20deg)
}
.btn_mc::after {
  transform:rotate(20deg)
}
@media screen and (min-width: 750px) {
  .btn_mc {
    font-size:1.8rem
  }
}
.btn a,.btn button {
  display:block;
  width:100%;
  border-radius:var(--round, 50px);
  padding:1em;
  color:#fff;
  font-weight:bold;
  background:var(--btn, #FF3F33);
  border:1px solid color-mix(in srgb, var(--btn, #FF3F33) 80%, black);
  box-shadow:inset 2px 2px 2px hsla(0,0%,100%,.3),inset -2px -2px 2px rgba(0,0,0,.1),0 5px 5px rgba(0,0,0,.3);
  text-shadow:0 2px 0 rgba(0,0,0,.2);
  font-size:1.2em;
  text-decoration:none;
  transition:all .4s ease
}
.btn a:hover,.btn button:hover {
  opacity:.5
}
.btn_bottom {
  font-size:60%;
  color:#797979;
  margin:.5em auto;
  text-align:center
}
.btn2 {
  margin:1em auto;
  border:0;
  border-radius:10px;
  font-weight:bold;
  text-decoration:none;
  transition:all .4s ease;
  position:relative;
  text-align:center
}
.btn2_mc {
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:1rem;
  padding:.5em;
  color:color-mix(in srgb, var(--btn, #FF3F33) 80%, black 20%);
  font-weight:bold;
  font-size:1em;
  position:relative;
  z-index:2
}
.btn2_mc::before,.btn2_mc::after {
  content:"";
  display:block;
  width:3px;
  height:1.2em;
  background:color-mix(in srgb, var(--btn, #FF3F33) 80%, black 20%)
}
.btn2_mc::before {
  transform:rotate(-20deg)
}
.btn2_mc::after {
  transform:rotate(20deg)
}
.btn2 a,.btn2 button {
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  min-height:var(--min-h, 4em);
  border-radius:var(--round, 5px);
  padding:1em;
  color:#fff;
  font-weight:bold;
  font-size:1.2em;
  line-height:1.2;
  background:var(--btn, #FF3F33);
  border:1px solid color-mix(in srgb, var(--btn, #FF3F33) 80%, black);
  box-shadow:0 5px 0 color-mix(in srgb, var(--btn, #FF3F33) 80%, black);
  text-shadow:0 2px 0 rgba(0,0,0,.2);
  text-decoration:none;
  transition:all .4s ease
}
.btn2 a:hover,.btn2 button:hover {
  opacity:.5
}
.btn2_bottom {
  font-size:90%;
  color:#797979;
  margin:.5em auto;
  text-align:center
}
.cta_2btn {
  display:flex;
  gap:5%;
  justify-content:space-between;
  align-items:center;
  margin:1em auto
}
.cta_2btn_content {
  margin-bottom:1em;
  padding:1em;
  background-color:#fff;
  border:2px dotted #ccc
}
.cta_2btn-base span,.cta_2btn-base a {
  display:block;
  text-decoration:none;
  color:#fff !important;
  border-radius:5px;
  text-align:center;
  font-weight:bold
}
.cta_2btn-no {
  width:35%
}
.cta_2btn-no span,.cta_2btn-no a {
  padding:10px;
  background:var(--no, #48A6A7);
  box-shadow:0 3px 0 color-mix(in srgb, var(--no, #48A6A7) 80%, black);
  animation:btn1 1s infinite;
  font-size:90%
}
.cta_2btn-start {
  width:60%
}
.cta_2btn-start span,.cta_2btn-start a {
  padding:15px;
  font-size:120%;
  background:var(--yes, #3bc300);
  box-shadow:0 3px 0 color-mix(in srgb, var(--yes, #3bc300) 80%, black);
  animation:btn2 1s infinite
}
.rate_wrap {
  width:100%;
  font-weight:bold;
  position:relative
}
.rate_num {
  display:block;
  text-align:center;
  font-size:2rem
}
.rate_score {
  position:relative;
  margin:auto;
  width:100px;
  height:20px;
  font-size:2rem;
  text-align:left
}
.rate_score::before,.rate_score span {
  position:absolute;
  display:inline-block;
  height:20px;
  line-height:20px
}
.rate_score::before {
  content:"★★★★★";
  color:#c4c4c4
}
.rate_score span {
  overflow:hidden;
  color:#ffb906
}
.align-left {
  text-align:left
}
.align-left,.align-left * {
  text-align:left
}
.align-center,.align-center * {
  text-align:center
}
.align-right,.align-right * {
  text-align:right
}
.scroll-hint-icon {
  z-index:20
}
.js-scrollable th,.js-scrollable td {
  white-space:nowrap
}
.js-scrollable .cellfixed-top {
  position:sticky;
  background:#f1f1f1;
  font-weight:bold;
  z-index:5;
  top:-1px
}
.js-scrollable .cellfixed-top::before {
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  border-bottom:1px solid #eee;
  z-index:5;
  pointer-events:none;
  top:0
}
.js-scrollable .cellfixed-left {
  position:sticky;
  background:#f1f1f1;
  font-weight:bold;
  z-index:5;
  left:-1px
}
.js-scrollable .cellfixed-left::before {
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  border-bottom:1px solid #eee;
  z-index:5;
  pointer-events:none;
  left:0;
  top:0
}
.js-scrollable .long-cont {
  white-space:normal
}
.sticky {
  position:sticky;
  top:0;
  left:0;
  background:none;
  border-left:none;
  border-right:none;
  z-index:10
}
.sticky ::before {
  content:"";
  position:absolute;
  top:0;
  left:-2px;
  width:100%;
  height:100%;
  border-left:1px solid #eee;
  border-right:1px solid #eee;
  background:#feeaff;
  z-index:-1
}
.slick-arrow {
  width:30px;
  height:30px;
  position:absolute;
  top:50%;
  overflow:hidden;
  text-indent:100%;
  background:#08f;
  border-radius:50%;
  z-index:10
}
.slick-arrow::after {
  content:"";
  display:block;
  width:12px;
  height:12px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  position:absolute;
  top:50%;
  left:50%
}
.slick-arrow.slick-disabled {
  background:#ccc
}
.slick-prev {
  left:-6px
}
.slick-prev::after {
  transform:rotate(225deg);
  margin:-6px 0 0 -3px
}
.slick-next {
  right:-6px
}
.slick-next::after {
  transform:rotate(45deg);
  margin:-6px 0 0 -8px
}
.intro_title {
  text-align:center;
  font-weight:bold;
  margin-bottom:1em
}
.intro_image {
  width:120px;
  height:120px;
  border-radius:50%;
  margin:1em auto;
  overflow:hidden;
  position:relative;
  background:var(--intro, #f8f8f8);
  border:2px solid #eee
}
.intro_image img {
  width:100%;
  height:100%;
  object-fit:cover
}

.w_icon {
  display:flex;
  align-items:center;
  gap:.5em
}
.w_icon .w_icon-icon {
  width:var(--icon, 1em);
  flex-shrink:0
}
.w_icon .w_icon-text {
  width:calc(100% - var(--icon, 1em))
}