@charset "utf-8";

#summary{ background: none; }
#summary .btn-B{ width: 375px; font-size: 21px; }

/* -------------------------------------------------------- fv */
#fv{ padding: 0 0 70px; }
#fv::before{ height: 100%; }
#fv .kv{ width: 100%; min-width: 500px; height: auto; margin-right: -6%; }

#fv .txt-content{ padding: 75px 0 0 10%; }
#fv .prize{ margin: 0 0 35px; width: clamp(340px,71%,420px); }
#fv .pages-ttl{ margin: 0 0 30px; font-size: clamp(30px,2.7vw,43px); font-feature-settings: 'palt'; }
#fv .check-list{ padding-bottom: 45px; }


/* -------------------------------------------------------- sv */
.slider-content{ position: relative; padding: 20px 0 60px; text-align: center; }
.slider-content .txt strong{ font-size: clamp(20px,1.9vw,29px); }
.slider-content .position-item{ position: absolute; top: -20px; left: 50%; transform: translate(-50%,0); display: inline-block; padding: 5px 22px; border: 2px solid var(--main-color); color: var(--main-color); background: #fff; font-size: 21px; border-radius: 9999px; margin-bottom: 20px; font-weight: bold; }
.slider-content .position-item:after{ position: absolute; bottom: -10px; left: 50%; transform: rotate(45deg) translate(-50%,0); content: ""; width: 10px; height: 10px; background: #fff; border-bottom: 2px solid var(--main-color); border-right: 2px solid var(--main-color); }

.slider-content .sv-ttl{ font-size: clamp(20px,2.3vw,27px); font-weight: bold; line-height: 1.8; }
.slider-content .sv-ttl strong{ padding: 0 10px; color: var(--main-color); font-size: clamp(25px,3.5vw,55px); font-family: 'Gilroy-Bold'; }

.pic_slider{ display: flex; justify-content: center; align-items: center; gap: 25px 40px; margin: 0 auto 40px; }
.pic_slider .item img{ width: 176px; height: auto; display: block; margin: 0 auto; }


/* -------------------------------------------------------- about */
#about{ background: var(--bg-color); padding: 80px 0 310px; }
#about .s-ttl{ font-size: clamp(20px,2.3vw,37px); line-height: 1.7; }
/* #about .s-ttl:after{ transform: translate(-50%,0); } */
#about .s-ttl small{ font-size: clamp(17px,1.8vw,30px); }

.about-top{ display: flex; align-items: center; position: relative; margin-bottom: 60px; }
.about-top .inner{ display: flex; align-items: center; justify-content: space-between;  gap: 40px; }
.about-top img{ width: 50%; height: auto; }
.about-top .txt-content{ width: 35%; margin-left: 3%; }
.about-top .s-ttl-box{ font-size: clamp(20px,2.3vw,28px); font-weight: bold; line-height: 1.8; margin-bottom: 25px; }
.about-top .txt{ font-size: clamp(14px,1vw,16px); line-height: 1.8; }
.about-top .txt strong{ color: var(--main-color); font-weight: bold; font-size: clamp(18px,1.4vw,22px); }

.about-content-ttl{ font-size: clamp(24px,1.8vw,30px); text-align: center; font-weight: bold; margin-bottom: 40px; }

.arrow-list{ display: flex; justify-content: space-between; text-align: center; }
.arrow-list li{ position: relative; width: calc(100% / 3); height: 360px; padding: 3%; background: #fff; }
.arrow-list li:first-of-type{ clip-path: polygon(0% 0%, 91% 0, 100% 50%, 91% 100%, 0% 100%); }

.arrow-list li:last-of-type{ clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 100%, 9% 50%); padding-left: 4%; }
.arrow-list li figure{ display: flex; align-items: center; justify-content: center; }
.arrow-list li figure img{ width: auto; height: 100%; }

.arrow-list li p{ margin: 20px 0 0; font-size: 14px; text-align: left; }
.arrow-list a { color: #0389B1; margin: 8px 0 0; transition: color 0.3s ease; text-align: left; }
.arrow-list .arrow-list-ttl { display: flex; align-items: center; justify-content: center; font-size: clamp(18px,1.6vw,24px); font-weight: bold; margin-top: 15px; color: #000; }
.arrow-list .num { position: absolute; left: 0; top: 0; display: inline-block; background: var(--main-color); color: #fff; font-size: clamp(15px,1.4vw,21px); font-weight: bold; padding: 5px 12px; border-radius: 0 0 20px 0; margin-bottom: 15px; }

.arrow-link{ position: relative; padding-left: 25px; color: #3998DE!important; display: inline-block; }
.arrow-link::before { position: absolute; left: 0; top: 50%; transform: translate(0,-50%); content: '＞'; font-size: 12px; margin-left: 4px; color: var(--main-color); }
.arrow-link:hover { color: var(--main-color)!important; text-decoration: none; }

/* low */
.arrow-list-low li{ height: 200px; }
.arrow-list-low li figure{ height: 80px; }

/* 3step = default */
.arrow-list-3 li:nth-of-type(2){ clip-path: polygon(92% 0, 100% 50%, 92% 100%, 0% 100%, 8% 50%, 0% 0%); width: 35%; margin: 0 -5%; }

/* 4step */
.arrow-list-4 li{ width: calc(100% / 4); height: 410px; padding: 9% 3%; }
.arrow-list-4 li:first-of-type{}
.arrow-list-4 li:nth-of-type(2){ clip-path: polygon(92% 0, 100% 50%, 92% 100%, 0% 100%, 8% 50%, 0% 0%); }
.arrow-list-4 li:nth-of-type(3){ clip-path: polygon(92% 0, 100% 50%, 92% 100%, 0% 100%, 8% 50%, 0% 0%); }
.arrow-list-4 li:last-of-type{}
.arrow-list-4 .arrow-list-ttl {  height: 80px; }

/* terms */
.flow-list{ position: relative; }
.terms { display: flex; align-items: center; margin-top: -80px; position: relative; z-index: 1; }
.terms > div { position: relative; width: 33.33%; text-align: center; }
.terms p { width: 130px; display: inline-block; margin-right: 25px; padding: 5px 15px; border: 2px solid #ed1c24; color: #ed1c24; border-radius: 50px; font-weight: bold; font-size: 14px; background: #fff; position: relative; z-index: 2; }
.terms span { position: absolute; top: 35%; left: 0; width: 86%; height: 5px; background: #ed1c24; transform: translate(0,-50%); z-index: 1; }
.terms span:after{ clip-path: polygon(0 0, 0% 100%, 100% 50%); position: absolute; content: ""; width: 16px; height: 13px; background: var(--main-color); right: -10px; top: 50%; transform: translate(0,-50%); }

.ranking-info { }
.bubble.sp{ display: none; }
.bubble-wrapper { display: flex; justify-content: space-between; align-items: flex-start; gap: 5%; margin-bottom: 80px; }
.bubble { height: 115px; display: flex; align-items: center; justify-content: center; position: relative; background: #fff; border: 3px solid #FF1628; border-radius: 10px; padding: 20px 30px; color: #FF1628; font-weight: bold; font-size: 16px; text-align: center; line-height: 1.6; }
.bubble p{ margin: 0; font-size: clamp(15px,1.3vw,19px); }
.bubble::after { z-index: -1; content: ''; position: absolute; bottom: -68px; left: 50%; transform: translateX(-50%); width: 41px; height: 132px; background: url(../images/common/icn_arrow02.svg) center/cover no-repeat; }

.bubble-left { width: 30%; }
.bubble-right { width: 68%; }

.bubble-right::after{ left: 10%; }
.bubble-right::before{ z-index: -1; content: ''; position: absolute; bottom: -68px; left: 65%; transform: translateX(-50%); width: 41px; height: 132px; background: url(../images/common/icn_arrow02.svg) center/cover no-repeat; }

.ranking-cols { display: flex; justify-content: space-between; }
.ranking-info .col { width: 49%; background: #fff; padding: 30px 2%; border-radius: 10px; }
.ranking-info h3{ padding: 0 0 50px; font-size: clamp(17px,1.5vw,22px); font-weight: bold; text-align: center; }
.ranking-list { }

.ranking-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 24px; }
.ranking-list li { display: flex; align-items: flex-start; gap: 16px; }
.ranking-list img.item { width: 123px; height: 82px; object-fit: contain; }
.ranking-list .text { flex: 1; }
.ranking-list .text p { margin: 0; font-size: clamp(10px,0.9vw,13px); line-height: 1.6; color: #444; }
.ranking-list .text .ranking-ttl { font-size: clamp(20px,1.5vw,22px); font-weight: bold; color: #000; }
.ranking-list .text .ranking-desc { font-size: clamp(11px,0.9vw,14px); color: #666; }

.badge-wrapper { display: flex; justify-content: space-between; gap: 2%; margin: 0 0 30px; }
.badge { text-align: center; font-size: clamp(11px,0.9vw,14px); }
.badge p{ padding: 20px 0 0; font-size: clamp(13px,1vw,16px); font-weight: bold; }
.badge img { max-width: 100%; height: auto; }
.note { margin: 0; padding: 30px; font-size: clamp(12px,1.4vw,18px); font-weight: bold; text-align: center; color: #333; background: #F5F5F5; border-radius: 10px; line-height: 1.6; }

.service-more{ padding: 20px 5% 20px 2%; background: #fff; }
.service-more .flex{ display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.service-more .flex img{ width: 21%; height: auto; }
.service-more .flex p{ font-size: clamp(18px,1.6vw,25px); line-height: 1.8; font-weight: bold; }
.service-more .btn-content{ }

.road-map { }
.road-map-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; background: #fff; border: 4px solid #e60012; border-radius: 20px; align-items: center; text-align: center; }
.road-step { position: relative; padding: 20px; border-radius: 8px; position: relative; }
.road-step-title { margin: 0 0 13px; font-weight: bold; font-size: clamp(19px,1.5vw,22px); }
.road-step-sub { font-size: 13px; margin-bottom: 15px; }
.road-step-caption { font-size: 14px; margin: 10px 0 0; }
.road-step-image img { max-width: 100%; height: auto; }
.road-step-note{ z-index: 1; position: absolute; right: -25%; top: 50%; transform: translate(0, -50%); }
.road-step-note img{ width: clamp(100px, 9vw, 150px); height: auto; }
.road-step-note svg{ width: clamp(100px, 9vw, 150px); height: auto; }

.road-step01{ padding-right: 12%; }

.road-step02{ display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; /* width: 370px; */ height: 110%; background: var(--main-color); border-radius: 25px; padding: 20px 3%; color: #fff; }
.road-step02 .road-step-image{ width: 65%; margin: 0 auto; padding: 15px; background: #fff; }

.road-step03{ padding-left: 18%; }
.road-step03 .road-step-caption{ margin: 0; }
.road-step03 .road-step-sub{ margin: 0; font-size: 13px; }
.deco-txt{ position: relative; padding: 0 15px; }
.deco-txt:before,
.deco-txt:after{ position: absolute; content: ""; bottom: 0; width: 2px; height: 150%; background: #FFCE00;}
.deco-txt:before{ left: 0; transform: rotate(-45deg); }
.deco-txt:after{ right: 0; transform: rotate(45deg); }


/* -------------------------------------------------------- require */
#require{ margin: -200px 0 50px; }
.require{ display: flex; align-items: center; justify-content: center; padding: 50px 3%; border: 5px solid #FFE3E4; border-radius: 10px; background: #fff; }
.require .item{ width: 35%; height: auto; }

.require .txt-content{ width: 55%; margin-left: 5%; }
.require .s-ttl-box{ padding: 0 0 20px; font-size: clamp(20px,1.5vw,24px); font-weight: bold; }
.require .txt span{ font-weight: bold; }
.require .btn-B{ width: 85%; margin: 0 auto 0 0; }


/* -------------------------------------------------------- promote */
#promote{ position: relative; padding: 100px 0 0; }
#promote:before{ z-index: -1; content: ""; position: absolute; background: var(--bg-color); width: 100%; height: 43%; bottom: 0; left: 0; }
.promote-ttl{ position: absolute; top: 41%; left: 50%; transform: translate(-50%,0); font-size: clamp(24px,1.8vw,30px); font-weight: bold; text-align: center; line-height: 1.8;}

.promote-list{ display: flex; align-items: flex-start; justify-content: space-between; }
.promote-list li{ width: calc(100% / 3 - 1%); }

.trouble{ display: flex; justify-content: center; gap: 25px; margin: 0 auto 140px; padding: 0; list-style: none; }
.trouble{ display: flex; align-items: center; position: relative; background: #fff; border: 2px solid #DCDCDC; padding: 30px 10px; box-sizing: border-box; font-size: clamp(12px,1.5vw,18px); font-weight: bold; line-height: 1.8; width: 100%; }
.trouble::after{ content: ""; position: absolute; bottom: -17px; left: 50%; width: 30px; height: 30px; background: #fff; border-left: 2px solid #DCDCDC; border-bottom: 2px solid #DCDCDC; transform: translateX(-50%) rotate(-45deg); z-index: 1; }
.trouble img{ width: 65px; height: auto; }
.trouble p{ margin: 0 0 0 20px; }

.result{ flex-direction: column; display: flex; justify-content: space-between; gap: 25px; padding: 0 0 30px; }
.result .position-item{ display: block; margin: 0 auto; width: 280px; height: auto; }

.result .w-box{ padding: 30px 20px 20px; text-align: center; z-index: 3; background: transparent; background: #fff; }
.result .w-box figure{ display: flex; align-items: center; justify-content: center; flex-direction: column; height: 220px; }
/* .result .w-box figure img{ width: 100%; height: auto; } */
.result .w-box figcaption{ font-size: 18px; font-weight: bold; margin-bottom: 30px; }
.result .w-box img.position-item{ margin: 0 auto 20px; display: block; }

.result .comment{ display: flex; align-items: center; justify-content: flex-start; gap: 15px; margin-top: 20px; font-size: clamp(14px,1vw,16px); }
.result .comment img{ width: clamp(30px,4vw,70px); height: auto; }
.result .comment p{ font-size: clamp(10px,1.2vw,15px); text-align: left; line-height: 1.6; font-weight: bold; margin: 0; }
.result .comment p strong{ font-size: clamp(13px,1.4vw,22px); color: var(--main-color); font-weight: bold; }


/* -------------------------------------------------------- reason */
#reason{ padding: 100px 0 0; position: relative; }
#reason .s-ttl{ margin-bottom: 70px; }
#reason .position-item{ display: block; margin: 0 auto; width: 20%; }
#reason .promote-ttl{ position: initial; transform: none; text-align: center; font-size: clamp(20px,2.5vw,30px); font-weight: bold; padding: 30px 0; }

.reason-list{ display: flex; flex-direction: column; gap: 60px; }
.reason-list li{ display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.reason-list li:nth-child(even){ flex-direction: row-reverse; }

.reason-list figure{ width: 44%; height: auto; }
.reason-list figure img{ width: 100%; height: auto; }
.reason-list figcaption{ font-size: 11px; }

.reason-list .text{ width: 50%; }
.reason-list .num{ margin: 0; color: var(--main-color); font-size: clamp(30px,2.8vw,45px); font-family: 'Gilroy-Bold'; }
.reason-list-ttl{ font-size: clamp(24px,1.9vw,30px); font-feature-settings: 'palt'; font-weight: bold; margin-bottom: 15px; line-height: 1.8; }

.acquire { background: var(--main-color); margin: 50px 0 0; padding: 50px 0 60px; }

.acquire-list { display: flex; justify-content: space-between; gap: 40px; list-style: none; padding: 0; margin: 0; }
.acquire-list > li { position: relative; width: clamp(300px,45%,487px); background: #fff; text-align: center; box-sizing: border-box; }
.acquire-list > li:first-of-type:before{ position: absolute; content: ""; width: 50px; height: 200px; background: #fff; right: -18%; top: 61%; transform: translate(0,-50%); clip-path: polygon(0 0, 0% 100%, 100% 50%); }
.acquire-list > li h4 { background: var(--main-color); color: #fff; font-size: clamp(20px,1.7vw,30px); font-weight: bold; line-height: 1.8; padding: 20px 10px; text-align: center; }
.acquire-list > li .check-list{ padding: 0 5%; text-align: left; }
.acquire-list > li .btn-B{ height: 50px; margin: 0 auto; }

.acquire-list .w-box { padding: 40px 10%; }
.acquire-list h5 { font-size: clamp(18px,1.4vw,24px); font-weight: bold; margin-bottom: 10px; }
.acquire-list .txt { font-size: clamp(14px,1vw,17px); height: 50px; margin-bottom: 20px; }
.acquire-list img { display: block; margin: 0 auto 20px; max-width: 100%; height: auto; }


/* -------------------------------------------------------- comparison */
#comparison{ padding: 50px 0; }
#comparison .btn-content{ padding: 100px 0 0; }

.comparison .survey-scrollable-text {
	display: none;
}

.comparison .survey-table {
  width: 100%;
  padding: 0 0 10px;
}
.comparison .survey-table img{
  width: 36px;
  height: auto;
}
.comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(1) {
  min-width: 257px;
}
.comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(2) {
  min-width: 357px;
}
.comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(3) {
  min-width: 307px;
}
.comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(4) {
  min-width: 307px;
}
.comparison .survey-table > .rowgroup div[role=row] {
  display: flex;
  justify-content: start;
}
.comparison .survey-table > .rowgroup div[role=row] > div[role=rowheader] {
  padding: 28px 20px;
}
.comparison .survey-table > .rowgroup div[role=row] > div[role=rowheader]._unique-rowheader {
  padding-top: 25px;
  padding-bottom: 20px;
}
.comparison .survey-table > .rowgroup div[role=row] > div[role=rowheader]._unique-rowheader-02 {
  padding-bottom: 44px;
}
.comparison .survey-table > .rowgroup div[role=row] > div[role=rowheader]._unique-rowheader-03 {
  padding-bottom: 24px;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell {
  margin: 0 4px 4px 0;
  padding: 16px;
  width: 25%;
  text-align: center;
  font-size: 22px;
  font-weight: bold;
  background-color: #F8F8F8;
  line-height: 1.5;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell:last-child {
  margin-right: 0;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell > span {
  display: block;
  margin: 10px 0 0;
  font-size: clamp(14px,1vw,16px);
  font-weight: normal;
  line-height: 1.5;
}
.comparison .survey-table .tx-caption{
  font-size: 12px;
}
@media only screen and (max-width: 736px) {
  .js-scrollable{
	overflow-x: scroll;
  }
  .comparison .survey-scrollable-text {
    display: block;
  }
  .comparison .survey-scrollable-text {
    margin: 12px 0 0;
    font-size: 14px;
    text-align: center;
  }

  .comparison .survey-scrollable-text > span {
    position: relative;
    display: inline-block;
    padding-left: 22px;
  }
  .comparison .survey-scrollable-text > span::before {
    content: "";
    position: absolute;
    left: -4px;
    width: 22px;
    height: 23px;
    background-image: url(../images/common/scroll-icon.svg);
    background-repeat: no-repeat;
  }
  .comparison .survey-table > .rowgroup div[role=row] > .cell > span {
    margin-top: 6px;
  }
  .comparison .survey-table .tx-caption{
    font-size: 10px;
  }
}
.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell {
  display: flex;
  position: relative;
  padding: 0 4px 0;
  background-color: var(--main-color);
}
@media only screen and (max-width: 736px) {
  .comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell {
    padding: 0 4px 0;
  }
}

.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 16px 16px 20px;
  border-radius: 4px;
  background-color: #fff;
}
@media only screen and (max-width: 736px) {
  .comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner {
    padding-right: 16px;
    padding-left: 16px;
    padding-bottom: 16px;
  }
}

.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner > p {
  margin-bottom: 8px;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner > span {
  display: block;
  font-size: clamp(14px,1vw,16px);
  font-weight: normal;
  line-height: 1.5;
  margin: 10px 0 0;
}
@media only screen and (max-width: 960px) {
  .comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner._unique-cell-inner {
    padding-bottom: 20px;
  }
}

.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell::after {
  content: "";
  position: absolute;
  bottom: -8px;
  right: 0;
  left: 0;
  margin: auto;
  background-color: var(--main-color);
  width: 100%;
  height: 8px;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell._unique-cell-last::after {
  bottom: -4px;
  height: 4px;
  border-radius: 0 0 10px 10px;
}
@media only screen and (max-width: 960px) {
  .comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell._unique-cell-last::after {
    bottom: -4px;
  }
}

.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell-03 {
  padding-bottom: 10px;
}
.comparison .survey-table > .rowgroup div[role=row] > .cell > p {
  margin: 0 0 8px;
}
.comparison .survey-table > .rowgroup._unique div[role=row] > div[role=rowheader] {
  padding-top: 20px;
}
.comparison .survey-table > .rowgroup._unique div[role=row] > .cell {
  justify-content: center;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] .cell {
  margin-bottom: 0;
  background-color: #fff;
  padding: 0;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] .cell:first-child {
  padding: 12px 24px;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] .cell._unique-cell {
  background-color: var(--main-color);
  border-radius: 10px 10px 0 0;
  color: #fff;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] .cell._unique-cell::after {
  content: none;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] .cell._unique-cell .cell-inner {
  padding: 12px;
  background-color: var(--main-color);
  border-radius: 10px;
}
.comparison .survey-table > .rowgroup._rowgroup-th > div[role=row] [role=columnheader]:not(._unique-cell) {
  padding: 12px;
}
@media only screen and (max-width: 736px) {
  .comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(1) {
    min-width: 162px;
  }
  .comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(2) {
    min-width: 231px;
  }
  .comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(3) {
    min-width: 182px;
  }
  .comparison .survey-table > div[role=rowgroup] div[role=row] > .cell:nth-child(4) {
    min-width: 182px;
  }
  .comparison .survey-table > div[role=rowgroup] div[role=row] > div[role=columnheader] {
    font-size: 18px;
  }
  .comparison .survey-table > div[role=rowgroup] div[role=row] > .cell {
    font-size: clamp(14px,1vw,16px);
  }
  .comparison .survey-table > .rowgroup div[role=row] > .cell > span {
    font-size: 12px;
    text-align: left;
}

.comparison .survey-table > .rowgroup div[role=row] > .cell._unique-cell > .cell-inner > span {
  font-size: 12px;
  text-align: left;
}
  .comparison .survey-table > div[role=rowgroup] div[role=row] > div[role=rowheader] {
    padding: 20px 16px 16px;
  }
  .comparison .survey-table img{
    width: 28px;
    height: auto;
  }
}
@media only screen and (max-width: 960px) {
  .comparison .survey-table {
    margin-top: 20px;
  }
}

/* -------------------------------------------------------- instance */
#instance{ padding: 50px 0; }
#instance .txt{ text-align: center; }
#instance .btn-content{ padding: 90px 0 0; }
#instance .btn-content .btn-B:last-of-type{ margin-top: 80px; }

.case-list.grid-col-3{ display:grid; grid-template-columns:repeat(3,1fr); column-gap:40px; row-gap:40px; margin:30px 0 0; }
.case-pic{ border-radius:10px; overflow:hidden; aspect-ratio:3/2; }
.case-pic img{ width:100%; height:100%; -o-object-fit:cover; object-fit:cover; transition:-webkit-transform 0.3s cubic-bezier(0.170,0.935,0.305,1.000); transition:transform 0.3s cubic-bezier(0.170,0.935,0.305,1.000); transition:transform 0.3s cubic-bezier(0.170,0.935,0.305,1.000), -webkit-transform 0.3s cubic-bezier(0.170,0.935,0.305,1.000); }
.case-list li:hover .case-pic img{ transform:scale(1.1); -webkit-transform:scale(1.1); }
.case-txt{ margin-top:24px; text-align:left; }

.item-company{ color:var(--main-color); font-size:14px; font-weight:bold; position:relative; padding-left:16px; }
.item-company:before{ content:''; width:10px; height:1px; top:50%; left:0; position:absolute; background-color:var(--main-color); }
.case-list .item-ttl{ color:#333; font-size:16px; font-weight:bold; padding-top:10px; line-height:1.44; }
.case-list .item-ttl span{ background-image:linear-gradient(#111,#111); background-position:100% 100%; background-size:0% 1px; background-repeat:no-repeat; transition:background-size 0.6s cubic-bezier(0.170,0.935,0.305,1.000); }
.case-list li:hover .item-ttl span{ background-position:0% 100%; background-size:100% 1px; }

.item-case-tag{ font-size:12px; line-height:1.2; letter-spacing:0; display:flex; flex-wrap:wrap; gap:6px; -webkit-box-lines:multiple; -moz-box-lines:multiple; margin-top:16px; margin-bottom:0; }
.item-case-tag li{ color:var(--main-color); border-radius:26px; background-color:#fff; border:1px solid var(--main-color); padding:3px 6px; font-feature-settings:'palt' 1; display:block; -webkit-transition:.3s ease; -moz-transition:.3s ease; transition:.3s ease; position:relative; }
.item-case-tag li::before{ content:'#'; color:var(--main-color); padding-right:2px; }

.case-list a:focus, .case-list a:active, .case-list a:hover{ color:#444; text-decoration:none; }


/* -------------------------------------------------------- step */
#step{ padding: 50px 0; background: var(--bg-color); }
#step .txt{ margin-bottom: 40px; text-align: center; }
#step .s-ttl{ margin-bottom: 50px; }

/* #step .arrow-list li{ height: 350px; } */

/* -------------------------------------------------------- faq */
#faq{ padding: 50px 0; background: var(--bg-color); }

.faq-list{ display: flex; flex-direction: column; gap: 20px; }
.qa{ margin-bottom: 0; background: #fff; border-radius: 10px; overflow: hidden; }
.qa dt{ display: flex; align-items: center; justify-content: space-between; padding: 20px; position: relative; cursor: pointer; }
.qa dt .q{ color: var(--main-color); font-weight: bold; margin-right: 10px; font-size: 26px; font-family: 'Gilroy-Bold'; }
.qa dt p{ font-weight: bold; font-size: 18px; flex: 1; margin: 0; }
.qa dt::after{ content: "＋"; font-size: 28px; color: #fff; background: var(--main-color); border-radius: 50%; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; transition: transform 0.3s; }
.qa dd{ padding: 0 20px 20px; display: none; font-size: 14px; line-height: 1.7; }

.qa.open dd{ display:block; }
.qa.open dt::after{ content:"ー"; }


/* -------------------------------------------------------- contact */
#contact{ padding: 50px 0; }


/* -------------------------------------------------------- merit */
#merit{ padding: 100px 0 0; }
#merit .s-ttl{ margin-bottom: 50px; }

.pink-area{ background: #FFF5F5; border-radius: 16px; padding: 40px 3%; border: 9px solid #fff; }

.merit{ position: relative; margin: 0 0 60px; padding: 50px 0 80px; }
.merit:before{ z-index: -1; position: absolute; content: ""; width: 95%; height: 100%; background: var(--bg-color); left: 0; top: 0; }
.merit02:before{ left: initial; right: 0; }

.top-content { display: flex; align-items: center; justify-content: space-between; gap: 60px; margin-bottom: 40px; }
.top-content .txt-content { width: 50%; }
.top-content .txt-content .num { font-size: 32px; font-family: 'Gilroy-Bold'; color: #fff; background: var(--main-color); display: inline-block; padding: 3px 32px 0; margin-bottom: 55px; }
.top-content .txt-content .merit-ttl { font-size: clamp(25px,2.3vw,34px); line-height: 1.6; margin-bottom: 24px; font-weight: bold; }
.top-content .txt-content .merit-ttl span { color: var(--main-color); font-weight: bold; }
.top-content .txt-content .txt { font-size: clamp(14px,1vw,16px); line-height: 1.8; }
.top-content .txt-content .txt strong { font-weight: bold; font-size: clamp(14px,1vw,16px); }
.top-content .item { width: 465px; height: auto; }


.point-content { display: flex; justify-content: space-between; align-items: center; }
.point-content .txt-content { max-width: 50%; }
.point-content .point { display: inline-block; background: var(--main-color); color: #fff; font-weight: bold; font-size: 22px; padding: 0 18px; margin-bottom: 20px; }
.point-content .txt { font-size: clamp(20px,2vw,26px); line-height: 1.8; color: #000; font-weight: bold; }
.point-content .txt span { color: var(--main-color); font-weight: bold; }
.point-content img { width: 42%; height: auto; }

.accomplishment-ttl { background: #fff; border-radius: 10px; padding: 14px 20px; font-size: 22px; font-weight: bold; display: flex; align-items: center; gap: 8px; margin-bottom: 35px; }
.ac-icon { display: inline-block; width: 6px; height: 20px; background: #E60012; border-radius: 2px; }

.cases p { font-size: 18px; font-weight: bold; color: #000; display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; margin: 0; }
.cases p strong { font-size: 38px; color: var(--main-color); font-family: 'Gilroy-Bold'; font-weight: bold; line-height: 1; }
.cases small { font-size: 12px; color: #000; margin-left: 6px; }

.media-list { display: flex; justify-content: space-between; background: #FFF5F5; border-radius: 16px; padding: 40px 0; gap: 30px; }
.media-block { width: 32%; }
.media-title { background: #fff; color: var(--main-color); font-weight: bold; text-align: center; border-radius: 8px; padding: 10px 0; font-size: 18px; margin-bottom: 24px; }
.media-block ul { list-style: none; padding-left: 0; }
.media-block ul li { position: relative; padding-left: 1em; margin-bottom: 10px; font-size: clamp(14px,1vw,16px); line-height: 1.6; }
.media-block ul li::before { content: '・'; color: var(--main-color); position: absolute; left: 0; top: 0; }

.case-sturdy { background: #fff; padding: 30px 4%; border-radius: 12px; }
.case-title { font-size: 18px; font-weight: bold; margin-bottom: 25px; border-bottom: 1px solid #EDEDED; }
.case-items { display: flex; justify-content: space-between; gap: 5%; flex-wrap: wrap; }
.case-box { display: flex; gap: 20px; flex: 1; }
.case-icon { width: 80px; }
.case-icon img { display: block; margin: 0 auto 8px; }
.case-body { width: calc(100% - 80px); color: #000; font-size: 14px; }
.case-name { font-weight: bold; font-size: clamp(14px,1vw,16px); margin-bottom: 4px; }
.case-date { font-size: 12px; margin-bottom: 10px; font-weight: bold; }
.case-text { line-height: 2; }


/* -------------------------------------------------------- ranking-banner */
.ranking-banner { padding: 85px 0 0; }
.ranking-banner .flex { display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap; }
.ranking-banner img{ width: 100%; height: auto; }
.ranking-banner a{ display: flex; align-items: center; justify-content: center; color: #000; background: #f7f9f8; padding: 20px 0; }

.rb-imgs { flex: 1 1 47%; }
.rb-img { width: 100%; height: auto; display: block; }
.rb-cta { flex: 1 1 35%; display: flex; justify-content: center; align-items: center; background: #f3f5f7; color: #000; text-decoration: none; font-weight: bold; font-size: clamp(20px,1.6vw,27px); padding: 20px; transition: background 0.3s; }
.rb-cta:hover { background: #e1e4e3; }
.rb-cta span { display: inline-block; }
.rb-arrow { color: var(--main-color); font-size: 24px; margin-left: 10px; line-height: 1; font-weight: 400; }


/* -------------------------------------------------------------------------- 
	surveyページ 
---------------------------------------------------------------------------- */
#survey #fv .kv{ width: 86%; min-width: 3px; height: auto; margin-right: -17%; }
#survey #about{ padding-bottom: 100px; }

#survey .terms > div{ margin: 0 2.5% 0 0; }
#survey .terms01{ width: 48%; }
#survey .terms01 span{ width: 98%; }
#survey .terms02{ width: 25%; }

#survey .arrow-list li figure{ height: 100px; }


/* -------------------------------------------------------------------------- 
	ranking_serviceページ 
---------------------------------------------------------------------------- */
#ranking_service #fv .fv-inner{ justify-content: flex-start; }
#ranking_service #fv .txt-content{ width: 63%; }
#ranking_service #fv .kv{ width: 15%; min-width: 260px; }
#ranking_service #sv .sv-ttl{ padding: 20px 0; }
#ranking_service #about .s-ttl{ font-size: min(2.3vw,33px); }

.ranking-company-slide{
  overflow: hidden;
  margin-bottom:80px;
}
.ranking-company-slide .item {
  width: 400px;
  padding:0 10px;
  position: relative;
}
.ranking-company-slide .item {
  border-radius: 10px;
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.ranking-company-slide .item img{
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
/*   border-radius: 10px; */
  overflow: hidden;
}
@media only screen and (max-width: 960px) {
  .ranking-company-slide{
    overflow: hidden;
    margin-bottom:10px;
  }
  .ranking-company-slide .item {
    width: 320px;
    padding:0 10px;
  }
}

#ranking_service .terms02 span { width: 90%; }


/* -------------------------------------------------------------------------- 
	ranking_service2ページ 
---------------------------------------------------------------------------- */
#ranking_service2 #fv .fv-inner{ justify-content: flex-start; }
#ranking_service2 #fv .pages-ttl{ text-align: center; width: clamp(370px,80%,470px); }
#ranking_service2 #fv .txt-content{ width: 59%; }
#ranking_service2 #fv .kv{ width: 20%; max-width: 550px; }
#ranking_service2 #about .s-ttl{ font-size: clamp(20px,2vw,37px); }

#ranking_service2 .road-step02{ width: 110%; right: 0; }
#ranking_service2 .road-step02 .road-step-image{ width: 60%; padding: 0; background: none; }
#ranking_service2 .road-step03 .road-step-sub{ padding: 0 0 20px; font-size: 17px; }
#ranking_service2 .road-step-note{ right: -31%; }

#ranking_service2 .road-step03{ padding-left: 0; }

#ranking_service2 .slider-content{ padding: 60px 0; }
#ranking_service2 .slider-content .sv-ttl{ padding: 0 0 30px; }

.page-bottom-attension{
  padding:80px 0 40px;
}
.page-bottom-attension .inner {
  max-width: 1080px;
}
.page-bottom-attension .paragraph-1 {
  font-size: 12px;
  text-align: left;
}
.page-bottom-attension .paragraph-1 li{
  color:#666;
}
@media only screen and (max-width: 960px) {
  .page-bottom-attension{
    padding:40px 0 20px;
  }
}


#ranking_service2 #instance .txt strong{ font-size: clamp(16px,1.5vw,20px); }

#ranking_service2 #contact{ background: var(--bg-color); }

#ranking_service2 #summary{ padding: 130px 0 100px; }


/* ------------------------------------- mobile --------------------------------------- */
@media only screen and (max-width: 960px) {
	
	.btn-B{ margin: 0 auto; }
	
/* 	#summary{ padding-top: 0; } */
	#summary .btn-B{ width: 80%; margin-top: 20px; font-size: 16px; }
	
/* -------------------------------------------------------- fv */
	.fv-inner { display: flex; flex-direction: column; align-items: center; gap: 30px; position: relative; }

	#fv { position: relative; padding: 50px 0 40px; text-align: center; }
	#fv .kv { position: static; margin-right: -10%; width: 110%; min-width: initial; max-width: initial; height: auto; margin: 0 auto 20px; }
	#fv .txt-content { padding: 0; width: 100%; }
	#fv .prize { width: 100%; max-width: 280px; margin: 0 auto 20px; }

	#fv .pages-ttl { font-size: 24px; margin-bottom: 10px; }
	#fv .check-list { width: 90%; margin: 0 auto; padding-bottom: 20px; text-align: left; }
	#fv .btn-content { margin-top: 20%; }


/* -------------------------------------------------------- sv */
	#sv{ padding: 50px 0 40px; }
	
	.slider-content{ }
 	.slider-content .position-item{ position: relative; transform: none; top: initial; left: initial; font-size: 21px; padding: 7px 10px; margin-bottom: 15px; width: 250px; }
	.slider-content .sv-ttl{ font-size: 20px; letter-spacing: 0; margin-bottom: 30px; line-height: 1.4; }
	.slider-content .sv-ttl strong{ padding: 0 5px; font-size: 40px; }

	.pic_slider{ gap: 15px 20px; }
	.pic_slider .item img{ width: 120px; }

	.slider-content .txt{ line-height: 1.8; padding: 0 5%; text-align: center; }
	.slider-content .txt strong{ font-size: 18px; }
	
	
/* -------------------------------------------------------- about */
	#about{ padding: 50px 0; }
	#about .s-ttl{ text-align: left; }
	
	.about-top { flex-direction: column; align-items: center; gap: 30px; margin-bottom: 30px; }
	.about-top img { width: 100%; height: auto; }
	
	.about-top .txt-content { width: 100%; margin-left: 0; padding: 0 15px; text-align: center; }
	.about-top .s-ttl-box { font-size: 17px; margin-bottom: 15px; line-height: 1.6; }
	.about-top .txt { font-size: 16px; line-height: 1.7; text-align: left; }
	.about-top .txt strong { color: var(--main-color); font-weight: bold; font-size: clamp(14px,1vw,16px); }

	.about-content-ttl{ font-size: 20px; margin-bottom: 20px; }

	
	/* low */
	.arrow-list-low li{ height: auto; }
	
	.arrow-list{ gap: 20px; margin: 0 0 20px; flex-direction: column; }
	.arrow-list li{ width: 100%; height: auto; padding: 20px 20px 35px; }
	.arrow-list li:first-of-type{ clip-path: polygon(0 0, 100% 0%, 100% 90%, 50% 100%, 0 90%); }
	.arrow-list li:last-of-type{ clip-path: polygon(50% 10%, 100% 0%, 100% 100%, 0 100%, 0 0); }
	
	.arrow-list li figure{ width: 100px; height: auto; margin: 20px auto 0; }
	.arrow-list li p{ margin: 10px 0 0; font-size: 15px; text-align: left; }
	.arrow-list a{ font-size: 13px; }
	
	.arrow-list .arrow-list-ttl{ height: auto; font-size: 20px; }
	.arrow-list .num{ top: 0; font-size: 23px;}
	
	/* low */
	.arrow-list-low li{ height: auto; }

	/* 3step */
	.arrow-list-3 li:nth-of-type(2){ clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0, 50% 10%); width: 100%;  margin: -31px 0; padding: 40px 20px; }
	
	/* 4step */
	.arrow-list-4 li:nth-of-type(2){ clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0, 50% 10%); }
	.arrow-list-4 li:nth-of-type(3){ clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0, 50% 10%); }
	
	/* terms */
	.terms{ position: absolute; right: 10px; top: 0; height: 100%; display: block; margin-top: 0; }
	.terms > div{ width: auto; height: 52%; margin: 0; }
	.terms p{ position: absolute; top: 50%; right: -10px; transform: translate(0,-50%); width: 130px; margin-right: 0; padding: 5px; border-radius: 100px; font-size: 12px; }
	.terms span{ top: 0; width: 4px; height: 100%; left: initial; transform: none; right: 0; }
	.terms span::after{ right: -3px; top: 100%; width: 11px; clip-path: polygon(50% 100%, 0 0, 100% 0); }
	
	.terms .terms02{ height: 33%; margin: 32px 0 0; }
	
	.bubble{ height: 75px; padding: 5px; }
	.bubble::after { left: 50%; width: 31px; height: 107px; }
	.bubble.sp{ display: block; height: 60px; margin: 0 0 30px; }
	.bubble.sp::after{ height: 83px; bottom: -35px; background-position: center bottom; }
	
	.bubble-wrapper { align-items: center; gap: 10px; }
	.bubble-left{ width: 58%; }
	.bubble-right { width: 40%; }
		
	.bubble-right::before{ display: none; }
	
	.bubble p{ font-size: 15px; }
	
	.ranking-cols { flex-direction: column; gap: 20px; }
	.ranking-info h3{ padding: 0 0 30px; font-size: 19px; }
	
	.ranking-info .col { width: 100%; padding: 15px 2%; }
	.ranking-info .col.right h3{ padding: 0 0 20px; font-size: 14px; }
	
	.badge-wrapper { align-items: center; gap: 20px; margin: 0; }
	.badge p{ padding: 10px 0 0; font-size: 12px; }
	
	.note{ padding: 15px 5px; font-size: 14px; font-feature-settings: "palt"; }
	
	.ranking-list{ gap: 20px; }
	.ranking-list li{ gap: 10px; align-items: start; }
	.ranking-list .text .ranking-ttl{ font-size: 17px; }
	.ranking-list .text p{ font-size: 12px; }
	.ranking-list .text .ranking-ttl{ font-size: 17px; }
	.ranking-list .text .ranking-desc{ font-size: 11px; }
	.ranking-list img.item{ width: 90px; height: auto; }

	.service-more .flex { flex-direction: column; gap: 15px; text-align: center; }
	.service-more .flex img { width: 70%; height: auto; }
	.service-more .flex p { margin: 0; font-size: 18px; line-height: 1.6; }
	.service-more .btn{ width: 85%; }
	
	.service-more .btn-content{ width: 100%; }
	
	.road-map-list { grid-template-columns: 1fr; padding: 20px 16px; gap: 9px; }
	.road-step { padding: 0; }
	.road-step-title { font-size: 22px; margin: 15px 0 5px; }
	.road-step-sub { font-size: 14px; margin-bottom: 10px; }
	.road-step-caption { font-size: 13px; margin-top: 6px; }
	.road-step-note img{ width: 130px; }
	.road-step-note { width: 130px; right: initial; top: initial; transform: translate(-50%, 0); left: 50%; bottom: -36%; }
	
	.road-step01 { padding: 0 0 30px; }
	
	.road-step02 { width: 120%; left: 50%; transform: translate(-50%,0); height: auto; border-radius: 16px; padding: 50px 20px; }
	.road-step02 .road-step-image { width: 70%; padding: 10px; }
	.road-step02 .road-step-note{ bottom: -18%; }
	
	.road-step03 { padding: 30px 0 0; }
	.road-step03 .road-step-title{ margin: 40px 0 5px; }
	.road-step03 .road-step-sub { font-size: 13px; margin: 0; }
	.road-step03 .road-step-caption{ margin: 0; font-size: 14px; }
	
	.deco-txt { padding: 0 10px; }
	.deco-txt:before, .deco-txt:after { height: 120%; }


/* -------------------------------------------------------- require */
	#require{ margin: 0; padding: 0; background: var(--bg-color); }
	
	.require {  padding: 30px 5%; border: 3px solid #FFE3E4; flex-direction: column; }
	.require .item { width: 100%; }
	.require .txt-content { width: 100%; margin: 25px 0 0; }
	.require .s-ttl-box { padding: 0 0 20px; font-size: 18px; text-align: center; }
	.require .btn-B {  width: 100%; }


/* -------------------------------------------------------- promote */
	#promote{ padding: 50px 0 0; }
	#promote::before{ display: none; }
	.promote-list { display: block; margin: 0; }
	.promote-list li { width: 100%; margin-bottom: 40px; }
	.promote-list li:last-of-type{ margin: 0; }
	.promote-ttl { position: initial; transform: none; font-size: 18px; }
	
	.trouble { margin: 0 auto 30px; padding: 20px 10px; }
	.trouble p { font-size: 18px; margin: 0; }
	.trouble::after { left: 50%; transform: translateX(-50%) rotate(-45deg); } 
	.result { gap: 20px; } 
	.result .position-item { width: 180px; max-width: 80%; margin: 20px auto 0; }
	.result .w-box { padding: 30px 10px; border: 5px solid #F5F8F6; } 
	.result .w-box figure { width: 55%; height: auto; margin: 0 auto; } 
	.result .w-box figure img { width: 100%; height: auto; } 
	.result .comment p { font-size: 15px; } 
	.result .comment img { width: 70px; }


/* -------------------------------------------------------- reason */
	#reason{ padding: 50px 0 0; }
	#reason .s-ttl{ margin-bottom: 40px; }
	#reason .promote-ttl{ background: none; margin: 0 0 10px; font-size: 25px; }
	#reason .position-item{ width: 200px; }

	.reason-list{ gap: 20px; }
	.reason-list li{ align-items: flex-start; flex-direction: column!important; gap: 0; }
	.reason-list figure,
	.reason-list .text{ width: 100%; margin: 10px 0 0; }

	.reason-list .num{ font-size: 36px;}
	.reason-list-ttl{ margin-bottom: 7px; font-size: 18px; text-align: center; }
	.reason-list .txt{ font-size: 14px; }

	.trouble li::after{ display: none; }
	
/* 	.promote-ttl{ font-size: 15px; margin: 20px 0 30px; padding: 0 0 60px; background: url(../images/common/icn_arrow.svg) center bottom/140px no-repeat; } */
	
	.acquire { margin: 30px 0 0; padding: 20px 0 60px; }
	.acquire-list { flex-direction: column; gap: 100px; }
	.acquire-list >li { width: 100%; }
	.acquire-list > li:first-of-type::before{ clip-path: polygon(50% 100%, 0 0, 100% 0); width: 190px; height: 50px; right: initial; top: initial; left: 50%; bottom: -90px; transform: translate(-50%,0); }
	
	.acquire-list .w-box{ padding: 40px 5%; }
	.acquire-list > li h4 { font-size: 25px; padding: 15px 10px; line-height: 1.5; }
	.acquire-list .txt{ height: auto; font-size: 14px; margin-bottom: 15px; text-align: center; }
	.acquire-list > li .check-list{ margin: 0 0 40px 0; }
	.acquire-list > li .btn-B{ width: 90%; }
	.acquire-list h5 { font-size: 18px; }
	.result-list li .position-item{ display: none; }
	
/* -------------------------------------------------------- compare */
	#comparison{ padding: 10px 0 0; }
	#comparison .btn-content{ padding: 100px 0 0; }


/* -------------------------------------------------------- instance */
	#instance .txt strong{ font-size: clamp(14px,1vw,16px); }
	#instance .btn-content{ padding: 40px 0 0; }
	#instance .btn-content .btn-B:last-of-type{ margin-top: 100px; }

	.case{ padding:70px 0; }
	.section-heading{ font-size:24px; line-height:1.44; margin-bottom:20px; }
	.case-lead-copy{ font-size:18px; }
	.case-list.grid-col-3{ grid-template-columns:repeat(1,1fr); row-gap:40px; margin:20px 0 0; }
	.item-company{ font-size:12px; }

  
/* -------------------------------------------------------- step */
	#step{ padding-bottom: 40px; }
	#step .arrow-list li{ padding: 35px 20px; }


/* -------------------------------------------------------- faq */
	.qa{ margin: 0; }
	.qa dt::after { font-size: 18px; width: 26px; height: 26px; }
	.qa dt {  padding: 10px; }
	
	.qa dt p{ font-size: 14px; }


/* -------------------------------------------------------- faq */
	.faq-list{ gap: 10px; }

/* -------------------------------------------------------- merit */
	#merit{ padding: 50px 0 0; }
	.merit{ margin: 0; padding: 30px 0; }
	.merit::before{ width: 100%; }
	
	.pink-area{ padding: 10px 3%; border: 4px solid #fff; width: 100%; margin: 0 auto; }

	.top-content { flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 30px; padding: 0; }
	.top-content .txt-content { width: 100%; }
	.top-content .txt-content .num { font-size: 21px; padding: 5px 20px 2px; margin-bottom: 16px; }
	.top-content .txt-content .merit-ttl { font-size: 20px; line-height: 1.5; margin-bottom: 16px; }
	.top-content .txt-content .txt { margin: 0; font-size: 14px; line-height: 2; }
	.top-content .item { width: 100%; height: auto; }

	.point-content { flex-direction: column; padding: 24px 16px; text-align: center; }
	.point-content .txt-content { max-width: 100%; margin-bottom: 24px; text-align: left; }
	.point-content .point { font-size: 13px; padding: 4px 10px; }
	.point-content .txt { font-size: 16px; }
	.point-content img { width: 100%; max-width: 100%; height: auto; }

	.accomplishment-ttl { font-size: 14px; padding: 12px 10px; }
	.ac-icon{ width: 3px; }
	.cases p { justify-content: center; padding: 0 0 30px; font-size: 18px; }
	.cases p strong { font-size: 38px; }
	.cases .unit { font-size: 14px; top: -4px; }

	.media-list { flex-direction: column; padding: 5px 0; gap: 10px; }
	.media-block { width: 100%; }
	.media-title { font-size: 16px; padding: 8px 0; margin-bottom: 16px; }
	.media-block ul li { font-size: 14px; }
	
	.case-icon img{ width: auto; height: 58px; margin: 0; }
	.case-sturdy { padding: 10px 5%; }
	.case-title { font-size: 14px; padding: 0 0 5px; }
	.case-items { gap: 25px; flex-direction: column; }
	.case-box { gap: 5px; }
	.case-icon { margin: 0 auto; }
	.case-body { width: 100%; }
	
	.case-name{ font-size: 15px; }


/* -------------------------------------------------------- ranking-banner */
	.ranking-banner { padding: 40px 0 60px; }
	.ranking-banner .flex { display: block; }
	.ranking-banner a{ padding: 40px 0; }
	.rb-imgs { flex: 1 1 100%; }
	.rb-cta { flex: 1 1 100%; font-size: 18px; padding: 16px; }
	.rb-arrow { font-size: 20px; margin-left: 8px; }


	
/* -------------------------------------------------------------------------- 
	surveyページ 
---------------------------------------------------------------------------- */
	#survey #fv .kv{ margin: 0 auto; }
	#survey #about{ padding-bottom: 50px; }
	
	#survey .arrow-list li figure{ width: auto; height: 100px; }
	#survey .arrow-list li:last-of-type figure{ height: 70px; }
	
	#survey .terms > div{ width: auto; margin: 0; }
	#survey .terms .terms01 span{ width: 4px; }
	#survey .terms .terms02{ height: 22.5%; margin: 26px 0 0; }
	#survey .terms .terms02 p{ top: 15%; }


/* -------------------------------------------------------------------------- 
	ranking_serviceページ 
---------------------------------------------------------------------------- */
	#ranking_service #fv .kv{ min-width: initial; width: 130px; margin: 0 auto 20px; }
	#ranking_service #fv .txt-content{ width: 100%; }
	
	#ranking_service .about-top img{ width: 95vw; margin-left: -5%; }
	#ranking_service #about .s-ttl{ text-align: center; font-size: 20px; }
	
	#ranking_service #step{ padding: 40px 0; }
	
	#ranking_service .terms > div{ height: 30%; }
	#ranking_service .terms > .terms02{ height: 32%; }
	
	#ranking_service .terms p{ top: 11%; font-size: 16px; margin: 0; }
	#ranking_service .terms02 span{ top: -9px; width: 5px; }
	
	#ranking_service  .reason-list-ttl{ text-align: left; }
	
	#step .arrow-list li:first-of-type,
	#step .arrow-list-3 li:nth-of-type(2),
	#step .arrow-list-4 li:nth-of-type(2),
	#step .arrow-list-4 li:nth-of-type(3),
	#step .arrow-list li:last-of-type{ clip-path: none; width: 100%; margin: 0 auto; }


/* -------------------------------------------------------------------------- 
	ranking_service2ページ 
---------------------------------------------------------------------------- */
	#ranking_service2 #fv .txt-content{ width: 100%; }
	#ranking_service2 #fv .kv{ width: 100%; min-width: auto; }
	#ranking_service2 #fv .pages-ttl{ width: 100%; }
	
	#ranking_service2 .slider-content{ padding: 30px 0; }
	#ranking_service2 .slider-content .sv-ttl{ padding: 0; }
	
	#ranking_service2 #about .s-ttl{ text-align: center;}
	#ranking_service2 #about .btn-B{ margin: 0 auto; }
	#ranking_service2 .about-top{ margin-bottom: 50px; }
	#ranking_service2 .about-top .txt{ margin-bottom: 30px; }

	#ranking_service2 .road-step-note{ right: initial; margin: 0; bottom: -21%; }
	#ranking_service2 .road-step-note svg{ width: 130px; height: auto;}
	#ranking_service2 .road-step01{ padding: 0 0 30px; }
	#ranking_service2 .road-step01 .road-step-note{ bottom: -26%; }
	#ranking_service2 .road-step02 { transform: translate(-50%,8%); width: 120%; right: initial; bottom: -9%; padding: 50px 20px 30px; }
	#ranking_service2 .road-step02 .road-step-image{ width: 75%; margin: -10px 0; }
	#ranking_service2 .road-step03{ padding: 40px 0 20px; }
	#ranking_service2 .road-step01 .road-step-note{ bottom: -31%; }
	#ranking_service2 .road-step03 .road-step-sub{ margin-bottom: 0; }
	
	#ranking_service2 #summary{ padding: 0 0 50px; }
	#ranking_service2 .summary-ttl{ padding: 0 5% 20px; }

	#ranking_service2 .top-content{ flex-direction: column-reverse; gap: 30px; }
	


}


