@charset "UTF-8";
/* ----------------------------------------------
  PC設定
  ------------------------------------------------*/
#container .p-assessment .wrapper {
  max-width: 1400px;
}
#container .p-assessment__titleRow {
  margin-bottom: var(--m50);
  position: relative;
}
#container .p-assessment__titleRow::after {
  content: "";
  display: block;
  width: var(--m60);
  height: 6px;
  background-color: var(--maincol);
  margin: var(--m20) auto 0;
}
#container .p-assessment__titleRow__sub {
  font-size: var(--fs16_28);
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  grid-gap: var(--m40);
  margin-bottom: var(--m24);
  text-align: center;
}
#container .p-assessment__titleRow__sub::before, #container .p-assessment__titleRow__sub::after {
  content: "";
  display: inline-block;
  width: 22px;
  aspect-ratio: 22/32;
  background: url(/images/assessment/tit_deco.svg) center/100% no-repeat;
}
#container .p-assessment__titleRow__sub::before {
  transform: scaleX(-1);
}
#container .p-assessment__titleRow__main {
  font-size: var(--fs22_50);
  font-weight: bold;
  display: block;
  text-align: center;
}
#container .p-assessment__mv {
  position: relative;
  z-index: 1;
  margin-bottom: var(--m40);
}
#container .p-assessment__mv__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: var(--m35);
  height: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}
#container .p-assessment__mv__textArea {
  width: 65.4%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#container .p-assessment__mv__textArea__catch {
  margin-bottom: var(--m30);
}
#container .p-assessment__mv__textArea__catch .br {
  display: inline-block;
  font-size: var(--fs32_96);
  font-weight: bold;
  line-height: 1;
  padding: 0.2em 0.25em;
  background-color: #fff;
}
#container .p-assessment__mv__textArea__text .br {
  font-size: var(--fs16_24);
  font-weight: bold;
  line-height: 1.8;
}
#container .p-assessment__mv__image {
  width: 34.2%;
}
#container .p-assessment__topText {
  margin-bottom: var(--m40);
  font-size: var(--fs14_20);
  font-weight: bold;
  text-align: center;
}
#container .p-assessment__formArea {
  position: relative;
  padding-bottom: var(--m65);
  z-index: 1;
}
#container .p-assessment__formArea.top::after, #container .p-assessment__formArea.bottom::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 55%;
  background-color: var(--gray12);
  position: absolute;
  left: 0;
  z-index: -1;
}
#container .p-assessment__formArea.top::after {
  bottom: 0;
}
#container .p-assessment__formArea.bottom::after {
  top: 0;
}
#container .p-assessment__formArea__inner {
  border: 3px solid var(--maincol);
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
}
#container .p-assessment__formArea__left {
  width: 25%;
  border-right: 3px solid var(--maincol);
}
#container .p-assessment__formArea__left__title {
  padding: var(--m20) 0.25rem;
  background-color: var(--maincol);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
#container .p-assessment__formArea__left__title::before {
  content: "";
  display: inline-block;
  width: var(--m50);
  aspect-ratio: 1/1;
  background: url(/images/assessment/icon_search.svg) center/100% no-repeat;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(50%, -50%);
}
#container .p-assessment__formArea__left__title__textArea {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#container .p-assessment__formArea__left__title__textArea .br {
  font-size: var(--fs18_23);
  color: #fff;
  font-weight: bold;
  text-align: center;
}
#container .p-assessment__formArea__left__bottomArea {
  padding: var(--m25) var(--m50) var(--m14);
}
#container .p-assessment__formArea__left__bottomArea__text {
  margin-bottom: var(--m20);
}
#container .p-assessment__formArea__left__bottomArea__text .br {
  font-size: var(--fs14_18);
  font-weight: bold;
  text-align: center;
}
#container .p-assessment__formArea__left__bottomArea__illArea {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
#container .p-assessment__formArea__left__bottomArea__illArea__img {
  width: 37%;
  position: relative;
  z-index: 2;
}
#container .p-assessment__formArea__left__bottomArea__illArea__round {
  width: 53%;
  position: relative;
  z-index: 1;
  padding: calc(var(--fs18_23) * 2) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#container .p-assessment__formArea__left__bottomArea__illArea__round::after {
  content: "";
  display: inline-block;
  height: 100%;
  aspect-ratio: 1/1;
  background-color: var(--green03);
  border-radius: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
#container .p-assessment__formArea__left__bottomArea__illArea__round__sub {
  position: absolute;
  top: 0;
  left: 0;
  transform: rotate(-20deg);
  font-size: var(--fs12_16);
  font-weight: bold;
  color: #fff;
  padding: 0.15em 0.25em;
  border-radius: 5px;
  background-color: var(--maincol);
}
#container .p-assessment__formArea__left__bottomArea__illArea__round__sub::after {
  content: "";
  display: inline-block;
  width: 18px;
  aspect-ratio: 18/14;
  background: url(/images/assessment/fukidashi_deco.svg) center/100% no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-75%, -75%);
}
#container .p-assessment__formArea__left__bottomArea__illArea__round .br {
  font-size: var(--fs18_23);
  color: var(--maincol);
  font-weight: bold;
  line-height: 1.15;
  white-space: nowrap;
}
#container .p-assessment__formArea__form {
  width: 75%;
}
#container .p-assessment__formArea__inputRow {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
#container .p-assessment__formArea__inputRow__row {
  width: 33.3333333333%;
  padding: var(--m20) var(--m27) var(--m14);
}
#container .p-assessment__formArea__inputRow__row.type {
  background-color: var(--green03);
}
#container .p-assessment__formArea__inputRow__row.city {
  background-color: var(--green08);
}
#container .p-assessment__formArea__inputRow__row.town {
  background-color: var(--green09);
}
#container .p-assessment__formArea__inputRow__row__tit {
  margin-bottom: var(--m12px);
  display: flex;
  align-items: center;
  grid-gap: var(--m16);
}
#container .p-assessment__formArea__inputRow__row__tit__num {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--m10px);
  position: relative;
  z-index: 1;
}
#container .p-assessment__formArea__inputRow__row__tit__num::before {
  content: "";
  display: inline-block;
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 6px;
  background-color: var(--gray11);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
#container .p-assessment__formArea__inputRow__row__tit__num .br {
  line-height: 1;
  font-size: var(--fs14_16);
  color: #fff;
  font-weight: bold;
}
#container .p-assessment__formArea__inputRow__row__tit__num .br:nth-of-type(2) {
  font-size: var(--fs20);
  margin-top: 0.1em;
}
#container .p-assessment__formArea__inputRow__row__tit__txt {
  font-size: var(--fs14_18);
  font-weight: bold;
}
#container .p-assessment__formArea__inputRow__row__inputSec {
  margin-bottom: var(--m12px);
}
#container .p-assessment__formArea__inputRow__row__inputSec select {
  width: 100%;
  padding: 0.5rem var(--m8_12);
  border: 2px solid var(--gray11);
  background: url(/images/common/select_arrow.svg) center right 0.5rem/13px no-repeat, #fff;
  font-size: var(--fs14_16);
}
#container .p-assessment__formArea__inputRow__row .check {
  display: flex;
  justify-content: flex-end;
}
#container .p-assessment__formArea__inputRow__row .check span {
  width: 100px;
  display: inline-block;
  padding: var(--m14) 1em;
  position: relative;
  font-weight: bold;
  font-size: var(--fs14_20);
  line-height: 1;
}
#container .p-assessment__formArea__inputRow__row .check span.ok {
  color: #fff;
  background-color: var(--gray11);
  text-align: center;
  display: inline-block;
}
#container .p-assessment__formArea__inputRow__row .check span.ok.none {
  display: none;
}
#container .p-assessment__formArea__inputRow__row .check span.yet {
  color: var(--gray11);
  text-align: center;
}
#container .p-assessment__formArea__inputRow__row .check span.yet::before, #container .p-assessment__formArea__inputRow__row .check span.yet::after {
  content: "";
  display: inline-block;
  width: 25px;
  height: 10px;
  position: absolute;
}
#container .p-assessment__formArea__inputRow__row .check span.yet::before {
  border-left: 2px solid var(--gray11);
  border-bottom: 2px solid var(--gray11);
  bottom: 0;
  left: 0;
}
#container .p-assessment__formArea__inputRow__row .check span.yet::after {
  border-right: 2px solid var(--gray11);
  border-top: 2px solid var(--gray11);
  top: 0;
  right: 0;
}
#container .p-assessment__formArea__inputRow__row .check span.yet.none {
  display: none;
}
#container .p-assessment__formArea__submitRow {
  padding: 1em 0 var(--m35);
  text-align: center;
}
#container .p-assessment__formArea__submitBt {
  width: 50%;
  max-width: 300px;
  z-index: 1;
  border: 1px solid #000;
  position: relative;
  display: inline-block;
  transition: background 0.5s;
}
#container .p-assessment__formArea__submitBt::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(5%, 30%);
  border: 1px solid var(--maincol);
  z-index: -1;
  transition: all 0.5s;
}
#container .p-assessment__formArea__submitBt input {
  display: block;
  width: 100%;
  height: 100%;
  padding: var(--m16) 0;
  border: none;
  background: rgb(255, 255, 255);
  color: #000;
  font-size: var(--fs18_23);
  cursor: pointer;
  transition: all 0.5s;
}
#container .p-assessment__formArea__submitBt .cross_icon {
  position: absolute;
  top: 50%;
  right: 1rem;
  transform: translateY(-50%);
}
#container .p-assessment__formArea__submitBt .cross_icon::before, #container .p-assessment__formArea__submitBt .cross_icon::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: var(--maincol);
  transition: all 0.5s;
}
#container .p-assessment__formArea__submitBt .cross_icon::before {
  width: 15px;
  height: 2px;
  transform: translate(-50%, -50%);
}
#container .p-assessment__formArea__submitBt .cross_icon::after {
  width: 2px;
  height: 15px;
  transform: translate(-50%, -50%);
}
#container .p-assessment__formArea__contact {
  padding: var(--m16) 0;
  width: 100%;
  background-color: var(--gray11);
  display: flex;
  align-items: center;
  justify-content: center;
  grid-gap: var(--m40);
}
#container .p-assessment__formArea__contact__txt {
  font-size: var(--fs14_18);
  color: #fff;
}
#container .p-assessment__formArea__contact__telArea__telLink {
  display: flex;
  align-items: baseline;
  grid-gap: var(--m8px);
}
#container .p-assessment__formArea__contact__telArea__img {
  width: var(--m35);
}
#container .p-assessment__formArea__contact__telArea__num {
  font-size: var(--fs20_28);
  color: #fff;
  font-weight: bold;
  line-height: 1;
}
#container .p-assessment__approach {
  padding-bottom: var(--m65);
  background-color: var(--gray12);
}
#container .p-assessment__approach__inner {
  border-radius: 10px;
  border: 3px solid var(--maincol);
  background-color: #fff;
  padding: var(--m90) var(--m16_100) var(--m65);
}
#container .p-assessment__approach__list {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: var(--m50);
}
#container .p-assessment__approach__list__approachBox {
  width: 25%;
  padding: var(--m8px) var(--m32) var(--m32);
}
#container .p-assessment__approach__list__approachBox__text {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#container .p-assessment__approach__list__approachBox__text .br {
  line-height: 1.5;
  font-size: var(--fs14_24);
  font-weight: bold;
  white-space: nowrap;
}
#container .p-assessment__approach__list__approachBox__text .br .big {
  font-size: var(--fs24_40);
  font-weight: bold;
  color: var(--maincol);
  line-height: 1;
}
#container .p-assessment__approach__list__approachBox figure {
  aspect-ratio: 23/17;
  display: flex;
  align-items: flex-end;
}
#container .p-assessment__approach__catch {
  font-size: var(--fs20_35);
  font-weight: bold;
  background-color: var(--orange03);
  line-height: 1.25;
  padding: 0.35em;
  text-align: center;
  margin-bottom: var(--m35);
}
#container .p-assessment__approach__text {
  font-size: var(--fs16_26);
  font-weight: bold;
  text-align: center;
}
#container .p-assessment__chart {
  padding-bottom: var(--m65);
  background-color: var(--gray12);
}
#container .p-assessment__chart__inner {
  border-radius: 10px;
  border: 3px solid var(--maincol);
  padding: var(--m90) var(--m16_100) var(--m65);
  background: url(/images/assessment/dot_bg.svg) top left/133px repeat, #fff;
}
#container .p-assessment__chart__chartArea {
  position: relative;
}
#container .p-assessment__chart__chartArea::before {
  content: "";
  display: inline-block;
  aspect-ratio: 334/313;
  width: 23.8%;
  background: url(/images/assessment/type_bg02.svg) center/100% no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-20%, -40%);
}
#container .p-assessment__chart__chartArea::after {
  content: "";
  display: inline-block;
  aspect-ratio: 355/154;
  width: 24%;
  background: url(/images/assessment/type_bg01.svg) center/100% no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(20%, -120%);
}
#container .p-assessment__chart__chartArea__resurt {
  width: 100%;
  padding: var(--fs18_48);
  padding-top: 0;
  display: flex;
  justify-content: space-between;
}
#container .p-assessment__chart__chartArea__resurtBox {
  width: 32.26%;
  border: 3px solid;
  border-radius: 10px;
  background-color: #fff;
  padding-bottom: var(--m40);
}
#container .p-assessment__chart__chartArea__resurtBox__about {
  padding: var(--m24) var(--m35) var(--m16);
}
#container .p-assessment__chart__chartArea__resurtBox__about .br {
  font-size: var(--fs16_24);
  text-align: center;
  color: #fff;
  font-weight: bold;
}
#container .p-assessment__chart__chartArea__resurtBox__tit {
  padding: var(--m40) var(--m35) 0;
  margin-bottom: var(--m30);
}
#container .p-assessment__chart__chartArea__resurtBox__tit .big {
  display: block;
  font-size: var(--fs20_40);
  font-weight: bold;
  line-height: 1.25;
  text-align: center;
}
#container .p-assessment__chart__chartArea__resurtBox__tit .txt {
  display: block;
  font-size: var(--fs14_24);
  text-align: center;
  line-height: 1.25;
  font-weight: bold;
}
#container .p-assessment__chart__chartArea__resurtBox__button {
  width: calc(100% - var(--m35) - var(--m35));
  margin: 0 var(--m35);
}
#container .p-assessment__chart__chartArea__resurtBox__button a {
  position: relative;
  z-index: 1;
  display: block;
  text-align: center;
  padding: calc(var(--fs16_26) * 0.5) 1em;
  border-radius: 8px;
  transition: all 0.5s;
}
#container .p-assessment__chart__chartArea__resurtBox__button a .txt {
  font-size: var(--fs16_26);
  color: #fff;
  font-weight: bold;
}
#container .p-assessment__chart__chartArea__resurtBox.assess01 {
  border-color: var(--maincol);
}
#container .p-assessment__chart__chartArea__resurtBox.assess01 .p-assessment__chart__chartArea__resurtBox__tit .big {
  color: var(--maincol);
}
#container .p-assessment__chart__chartArea__resurtBox.assess01 .p-assessment__chart__chartArea__resurtBox__about,
#container .p-assessment__chart__chartArea__resurtBox.assess01 .p-assessment__chart__chartArea__resurtBox__button a {
  background-color: var(--maincol);
}
#container .p-assessment__chart__chartArea__resurtBox.assess02 {
  border-color: var(--green01);
}
#container .p-assessment__chart__chartArea__resurtBox.assess02 .p-assessment__chart__chartArea__resurtBox__tit .big {
  color: var(--green01);
}
#container .p-assessment__chart__chartArea__resurtBox.assess02 .p-assessment__chart__chartArea__resurtBox__about,
#container .p-assessment__chart__chartArea__resurtBox.assess02 .p-assessment__chart__chartArea__resurtBox__button a {
  background-color: var(--green01);
}
#container .p-assessment__chart__chartArea__resurtBox.assess03 {
  border-color: var(--orange07);
}
#container .p-assessment__chart__chartArea__resurtBox.assess03 .p-assessment__chart__chartArea__resurtBox__tit .big {
  color: var(--orange07);
}
#container .p-assessment__chart__chartArea__resurtBox.assess03 .p-assessment__chart__chartArea__resurtBox__about,
#container .p-assessment__chart__chartArea__resurtBox.assess03 .p-assessment__chart__chartArea__resurtBox__button a {
  background-color: var(--orange07);
}
#container .p-assessment__point {
  background-color: var(--maincol);
  padding: var(--m80) 0 var(--m65);
}
#container .p-assessment__point .p-assessment__titleRow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  grid-gap: var(--m20) var(--m35);
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
#container .p-assessment__point .p-assessment__titleRow::before, #container .p-assessment__point .p-assessment__titleRow::after {
  content: "";
  display: inline-block;
  width: var(--m50);
  height: unset;
  aspect-ratio: 51/67;
  background: url(/images/assessment/tit_deco02.svg) center/100% no-repeat;
  margin: 0;
  position: absolute;
  top: 50%;
}
#container .p-assessment__point .p-assessment__titleRow::before {
  transform: scaleX(-1) translate(150%, -50%);
  left: 0;
}
#container .p-assessment__point .p-assessment__titleRow::after {
  transform: translate(150%, -50%);
  right: 0;
}
#container .p-assessment__point .p-assessment__titleRow__sub {
  margin: 0;
  font-size: var(--fs20_40);
  color: #fff;
}
#container .p-assessment__point .p-assessment__titleRow__sub::before, #container .p-assessment__point .p-assessment__titleRow__sub::after {
  content: unset;
}
#container .p-assessment__point .p-assessment__titleRow__main {
  font-size: var(--fs28_70);
  color: #fff;
  position: relative;
}
#container .p-assessment__point .p-assessment__titleRow__main::after {
  content: "";
  display: inline-block;
  width: 100%;
  aspect-ratio: 455/13;
  background: url(/images/assessment/tit_under.svg) center/100% no-repeat;
  position: absolute;
  bottom: 0;
  left: 0;
}
#container .p-assessment__point__list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  grid-gap: var(--m32) 3%;
}
#container .p-assessment__point__box {
  width: 30.33%;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--m50) 0;
}
#container .p-assessment__point__box::after {
  content: "";
  display: inline-block;
  height: 100%;
  aspect-ratio: 1/1;
  border-radius: 100%;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -2;
}
#container .p-assessment__point__box__round {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--m24) 0 15px;
  z-index: 1;
  transform: translate(20%, 20%);
}
#container .p-assessment__point__box__round::after {
  content: "";
  display: inline-block;
  height: 100%;
  aspect-ratio: 1/1;
  border-radius: 100%;
  background-color: var(--orange03);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 4px #fff solid;
  z-index: -2;
}
#container .p-assessment__point__box__round__txt {
  font-size: var(--fs16_20);
  font-weight: bold;
  line-height: 1;
}
#container .p-assessment__point__box__round__num {
  font-size: var(--fs24_43);
  font-weight: bold;
  line-height: 1;
}
#container .p-assessment__point__box__image {
  width: 50%;
  aspect-ratio: 180/176;
  margin-bottom: 0.5rem;
}
#container .p-assessment__point__box__image img {
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
#container .p-assessment__point__box__text .br {
  text-align: center;
  font-weight: bold;
  font-size: var(--fs14_20);
}
#container .p-assessment__voice {
  padding: var(--m65) 0;
  background-color: var(--gray12);
}
#container .p-assessment__voice__inner {
  border-radius: 10px;
  border: 3px solid var(--maincol);
  background-color: #fff;
  padding: var(--m90) var(--m16_100) var(--m65);
  position: relative;
}
#container .p-assessment__voice__inner::before {
  content: "";
  display: inline-block;
  aspect-ratio: 134/147;
  width: 9.57%;
  background: url(/images/assessment/satisfaction_bg01.svg) center/100% no-repeat;
  position: absolute;
  top: var(--m90);
  left: var(--m16_100);
}
#container .p-assessment__voice__inner::after {
  content: "";
  display: inline-block;
  aspect-ratio: 149/145;
  width: 10.64%;
  background: url(/images/assessment/satisfaction_bg02.svg) center/100% no-repeat;
  position: absolute;
  top: var(--m90);
  right: var(--m16_100);
}
#container .p-assessment__voice__tit {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: bold;
  font-size: var(--fs18_23);
  white-space: nowrap;
}
#container .p-assessment__voice__txt {
  text-align: center;
  font-size: var(--fs14_18);
  font-weight: bold;
  display: block;
}
#container .p-assessment__voice__circleChartList {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  grid-gap: var(--m32) 7.14%;
  margin-bottom: var(--m30);
}
#container .p-assessment__voice__circleChartList li {
  width: 28.57%;
  position: relative;
  z-index: 1;
}
#container .p-assessment__voice__circleChartList li::after {
  content: "";
  display: inline-block;
  width: calc(100% + 5px);
  height: calc(100% + 5px);
  border-radius: 100%;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -49%);
  z-index: -1;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.35);
}
#container .p-assessment__voice__circleChartList li .canvas_wrap {
  aspect-ratio: 1/1;
  width: 100%; /* 横幅は任意のサイズに */
  height: 100%;
  border-radius: 100%;
}
#container .p-assessment__voice__circleChartList li .canvas_wrap .chart-container {
  width: 100%; /* 横幅は任意のサイズに */
  height: 100%;
  position: relative; /* Canvasを調整するため */
}
#container .p-assessment__voice__circleChartList li .voice_box {
  position: absolute;
  top: calc(var(--m20) * -1);
  right: calc(var(--m20) * -1);
  padding: var(--m20) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
#container .p-assessment__voice__circleChartList li .voice_box::after {
  content: "";
  display: inline-block;
  height: 100%;
  aspect-ratio: 1/1;
  background: url(/images/assessment/fukidashi.svg) center/100% no-repeat;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
#container .p-assessment__voice__circleChartList li .voice_box * {
  display: block;
  text-align: center;
}
#container .p-assessment__voice__circleChartList li .voice_box small {
  font-size: var(--fs16_28);
  font-weight: bold;
}
#container .p-assessment__voice__circleChartList li .voice_box .num {
  display: flex;
  align-items: baseline;
  justify-content: center;
  font-weight: bold;
  font-size: var(--fs16_28);
}
#container .p-assessment__voice__circleChartList li .voice_box .num .big {
  font-size: var(--fs24_43);
  font-weight: bold;
}
#container .p-assessment__flow {
  background-color: #fff;
  box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.3);
}
#container .p-assessment__flow__inner {
  border-radius: 10px;
  border: 3px solid var(--maincol);
  background-color: #fff;
  padding-top: var(--m90);
  position: relative;
}
#container .p-assessment__flow__inner::before {
  content: "";
  display: inline-block;
  aspect-ratio: 218/154;
  width: 15.16%;
  background: url(/images/assessment/flow_bg01.svg) center/100% no-repeat;
  position: absolute;
  top: var(--m90);
  left: var(--m16_100);
}
#container .p-assessment__flow__inner::after {
  content: "";
  display: inline-block;
  aspect-ratio: 278/125;
  width: 20.16%;
  background: url(/images/assessment/flow_bg02.svg) center/100% no-repeat;
  position: absolute;
  top: var(--m90);
  right: var(--m16_100);
}
#container .p-assessment__flow__stepArea {
  margin: 0 var(--m16_100);
  transition: height 0.5s;
  height: 200px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
#container .p-assessment__flow__stepArea::after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 50%;
  background: linear-gradient(to top, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 30%, rgba(255, 255, 255, 0) 100%);
  position: absolute;
  bottom: 0;
  left: 0;
}
#container .p-assessment__flow__stepArea.open {
  height: 2700px;
  max-height: -moz-fit-content;
  max-height: fit-content;
}
#container .p-assessment__flow__stepArea.open::after {
  content: unset;
}
#container .p-assessment__flow__stepRow {
  width: 100%;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  grid-gap: var(--m16) var(--m32);
}
#container .p-assessment__flow__stepRow:last-of-type dd {
  margin-bottom: var(--m70);
}
#container .p-assessment__flow__stepRow dt {
  width: 10.25%;
  min-width: 80px;
  margin-top: 0.5em;
  position: relative;
  z-index: 1;
}
#container .p-assessment__flow__stepRow dt .txt {
  font-size: var(--fs24_40);
  color: #ccc;
  transition: color 0.5s;
  padding-bottom: 0.25em;
  display: block;
  text-align: center;
}
#container .p-assessment__flow__stepRow dt .line {
  display: inline-block;
  width: 2px;
  height: calc(100% - 2rem);
  background-color: #ccc;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  transition: background-color 0.5s;
  z-index: -1;
}
#container .p-assessment__flow__stepRow dt.ok .txt {
  color: var(--maincol);
}
#container .p-assessment__flow__stepRow dt.ok .line {
  background-color: var(--maincol);
}
#container .p-assessment__flow__stepRow dd {
  width: 85.4%;
  max-width: calc(100% - 80px);
  padding: var(--m40);
  background-color: var(--gray12);
  margin-bottom: var(--m45);
}
#container .p-assessment__flow__stepRow dd .title {
  display: flex;
  align-items: flex-start;
  grid-gap: var(--m32) var(--m30);
}
#container .p-assessment__flow__stepRow dd .title .check {
  width: var(--fs28_42);
  aspect-ratio: 44/42;
  margin-top: 0.25rem;
}
#container .p-assessment__flow__stepRow dd .title .check .none {
  display: none !important;
}
#container .p-assessment__flow__stepRow dd .title .check .yet,
#container .p-assessment__flow__stepRow dd .title .check .ok {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 100%;
}
#container .p-assessment__flow__stepRow dd .title .check .yet::after,
#container .p-assessment__flow__stepRow dd .title .check .ok::after {
  content: "";
  width: 100%;
  height: 100%;
  display: inline-block;
  background: url(/images/assessment/flow_check_yet.svg) center/100% no-repeat;
}
#container .p-assessment__flow__stepRow dd .title .check .ok::after {
  background: url(/images/assessment/flow_check.svg) center/100% no-repeat;
}
#container .p-assessment__flow__stepRow dd .title .text_area {
  width: calc(100% - var(--fs28_42) - var(--m30));
  margin-bottom: var(--m24);
}
#container .p-assessment__flow__stepRow dd .title .text_area .tit {
  font-size: var(--fs20_35);
  font-weight: bold;
  line-height: 1.35;
  margin-bottom: var(--m14);
  border-bottom: 2px solid var(--maincol);
}
#container .p-assessment__flow__stepRow dd .title .text_area .txt {
  color: var(--maincol);
  font-size: var(--fs18_30);
  font-weight: bold;
}
#container .p-assessment__flow__stepRow dd .text {
  width: calc(100% - var(--fs28_42) - var(--m30));
  margin-left: auto;
}
#container .p-assessment__flow__stepRow dd .text .br {
  font-size: var(--fs14_18);
}
#container .p-assessment__flow__stepRow dd .text .br.green {
  color: var(--maincol);
  font-weight: bold;
}
#container .p-assessment__flow .close_row {
  padding: var(--m24);
  background-color: var(--maincol);
  text-align: center;
}
#container .p-assessment__flow .close_row .close_button {
  padding: 0.25em 1em;
  width: 100%;
  max-width: 400px;
  font-size: var(--fs16_20);
  text-align: center;
  margin: 0 auto;
  background-color: #fff;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer;
}

@media all and (min-width: 1300px) {
  #container .p-assessment__chart__chartArea__resurtBox__about .br {
    white-space: nowrap;
  }
  #container .p-assessment__chart__chartArea__resurtBox__tit .big {
    white-space: nowrap;
  }
}
@media all and (min-width: 769px) {
  #container .p-assessment__formArea__submitBt:hover::after {
    transform: translate(0, 0);
  }
  #container .p-assessment__formArea__submitBt:hover input {
    background-color: var(--green01);
    color: #fff;
  }
  #container .p-assessment__formArea__submitBt:hover .cross_icon::before, #container .p-assessment__formArea__submitBt:hover .cross_icon::after {
    background-color: #fff;
  }
  #container .p-assessment__formArea__submitBt:hover .cross_icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
  }
  #container .p-assessment__chart__chartArea__resurtBox__button a:hover {
    background-color: var(--red01) !important;
  }
}
@media all and (max-width: 980px) {
  #container .p-assessment__formArea__left {
    width: 100%;
    border-right: unset;
    display: flex;
    flex-wrap: wrap;
  }
  #container .p-assessment__formArea__left__title {
    width: 33.333%;
  }
  #container .p-assessment__formArea__left__bottomArea {
    width: 66.666%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 0;
  }
  #container .p-assessment__formArea__left__bottomArea__text {
    width: 50%;
    padding: var(--m16);
  }
  #container .p-assessment__formArea__left__bottomArea__illArea {
    width: 50%;
    padding: var(--m16);
    padding-bottom: 0;
    align-items: flex-end;
  }
  #container .p-assessment__formArea__form {
    width: 100%;
  }
  #container .p-assessment__approach__list__approachBox {
    width: 33.3333333333%;
  }
  #container .p-assessment__point__box {
    width: 48.5%;
  }
  #container .p-assessment__voice__inner::before {
    left: var(--m40);
  }
  #container .p-assessment__voice__inner::after {
    right: var(--m40);
  }
  #container .p-assessment__voice__circleChartList {
    justify-content: center;
  }
  #container .p-assessment__voice__circleChartList li {
    width: 46.43%;
  }
}
/* ----------------------------------------------
  PAD設定
  ------------------------------------------------*/
@media all and (max-width: 768px) {
  #container .p-assessment__mv__inner {
    padding-top: var(--m50);
    position: static;
    transform: unset;
  }
  #container .p-assessment__mv__textArea {
    width: 100%;
  }
  #container .p-assessment__mv__textArea__text {
    width: 65%;
  }
  #container .p-assessment__mv__image {
    width: 40%;
    margin-left: auto;
    margin-top: -20vw;
  }
  #container .p-assessment__mv__bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: var(--gray12);
  }
  #container .p-assessment__mv__bg::after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url(/images/assessment/main_bg.svg) center/cover no-repeat;
    z-index: -1;
  }
  #container .p-assessment__mv__bg::before {
    content: "";
    display: inline-block;
    width: 55%;
    height: 100%;
    -webkit-clip-path: polygon(60% 0, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(60% 0, 100% 0%, 100% 100%, 0% 100%);
    background: linear-gradient(to left, rgba(111, 185, 44, 0.7), rgba(111, 185, 44, 0.7)), url(/images/assessment/main_sp.jpg) left 30% center/cover no-repeat;
    position: absolute;
    bottom: 0;
    right: 0;
  }
}
/* ----------------------------------------------
  SP設定
  ------------------------------------------------*/
@media all and (max-width: 520px) {
  #container .p-assessment__topText {
    text-align: left;
  }
  #container .p-assessment__formArea__left__title {
    width: 100%;
  }
  #container .p-assessment__formArea__left__title__textArea {
    flex-direction: row;
  }
  #container .p-assessment__formArea__left__bottomArea {
    width: 100%;
  }
  #container .p-assessment__formArea__left__bottomArea__text {
    width: 40%;
  }
  #container .p-assessment__formArea__left__bottomArea__illArea {
    width: 60%;
  }
  #container .p-assessment__formArea__form {
    width: 100%;
  }
  #container .p-assessment__formArea__inputRow__row {
    width: 100%;
    padding: var(--m27);
  }
  #container .p-assessment__formArea__submitRow {
    padding: var(--m50) 0;
  }
  #container .p-assessment__formArea__submitBt {
    width: 80%;
  }
  #container .p-assessment__formArea__contact {
    flex-direction: column;
    grid-gap: 0.25rem;
  }
  #container .p-assessment__formArea__contact__telArea__img {
    width: 35px;
  }
  #container .p-assessment__formArea__contact__telArea__num {
    font-size: 28px;
  }
  #container .p-assessment__approach__list__approachBox {
    width: 50%;
  }
  #container .p-assessment__point__box {
    width: 100%;
    max-width: 300px;
  }
  #container .p-assessment__point .p-assessment__titleRow::before {
    transform: scaleX(-1) translate(0%, -50%);
  }
  #container .p-assessment__point .p-assessment__titleRow::after {
    transform: translate(0%, -50%);
  }
  #container .p-assessment__voice__inner::before {
    left: 2%;
    width: 20%;
    transform: translateY(120%);
  }
  #container .p-assessment__voice__inner::after {
    right: 2%;
    width: 20%;
    transform: translateY(120%);
  }
  #container .p-assessment__voice__circleChartList {
    justify-content: center;
  }
  #container .p-assessment__voice__circleChartList li {
    width: 100%;
    max-width: 250px;
  }
  #container .p-assessment__flow__inner::before {
    left: 2%;
    width: 25%;
    transform: translateY(100%);
  }
  #container .p-assessment__flow__inner::after {
    right: 2%;
    width: 25%;
    transform: translateY(200%);
  }
  #container .p-assessment__flow__stepRow {
    grid-gap: 0;
  }
  #container .p-assessment__flow__stepRow dt {
    min-width: unset;
    width: -moz-fit-content;
    width: fit-content;
  }
  #container .p-assessment__flow__stepRow dt .txt {
    font-size: 16px;
  }
  #container .p-assessment__flow__stepRow dd {
    max-width: calc(100% - 60px);
    padding: 12px;
  }
  #container .p-assessment__flow__stepRow dd .text {
    width: 100%;
  }
}