@charset "UTF-8";

/*-------------------------------------------------- common --------------------------------------------------*/
html,
body {
  margin: 0 auto;
  color: #262626;
  font-size: 22px;
}

@media screen and (max-width: 750px) {

  html,
  body {
    font-size: 2.9333333333vw;
  }
}

p {
  font-family: "FP-こぶりなゴシック StdN W3", FP-KoburinaGoStdN-W3, "こぶりなゴシック Std W3", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  letter-spacing: 1px;
  margin-block-start: 0;
  margin-block-end: 0;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

ul {
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
}

li {
  list-style: none;
}

sup,
sub {
  font-size: 0.6em;
  font-weight: normal;
}

sup {
  vertical-align: text-top;
}

hr {
  border: none;
  border-top: 2px dotted #d0cecf;
}

h3 {
  margin-block-start: 0;
  margin-block-end: 0;
}

:focus {
  outline: none;
}

.bold {
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
}

.clearfix::after {
  content: '';
  display: block;
  clear: both;
}

.container {
  font-family: Arial, sans-serif !important;
  overflow: hidden;
  line-height: 1.5;
}

@media screen and (max-width: 520px) {
  .container{
   font-size: 3.5vw;
  }
}


.note {
  margin-top: calc(40 / 780 * 100%);
  font-size: 0.6em;
  text-align: right;
}

.q_up{
  font-size: 1.05em;
}

/*accordion*/
.accordion-005 {
  max-width: auto;
  margin: 0;
  text-align: center;
}

.accordion-005:not([open]) {
  margin-bottom: 7px;
}

.accordion-005 summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #e8e8e8;
  position: relative;
  padding: 1em 2em;
  color: #333333;
  font-weight: 600;
  cursor: pointer;
}

.accordion-005 summary::-webkit-details-marker {
  display: none;
}

.accordion-005 summary::after {
  transform: translateY(-25%) rotate(45deg);
  width: 7px;
  height: 7px;
  margin-left: 10px;
  border-bottom: 3px solid #cfcfcf;
  border-right: 3px solid #cfcfcf;
  content: '';
  transition: transform .3s;
}

.accordion-005[open] summary::after {
  transform: rotate(225deg);
}

.accordion-005 p {
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  padding: 1em 2em 2em 2em;
  color: #333333;
  transition: transform .5s, opacity .5s;
}

.accordion-005[open] p {
  transform: none;
  opacity: 1;
}

.summary-text {
  background: #F9F7F7;
  font-size: 1.6em;
  border: 1px solid;
  padding: 20px 50px 20px 50px;
  margin: 0 auto;
}

/*accordion006*/
.accordion-006 {
  max-width: auto;
  margin: 0;
}

.accordion-006:not([open]) {
  margin-bottom: 7px;
}

.accordion-006 summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /*background: #e0e5e7;*/
  position: relative;
  padding: 1em 2em;
  color: #333333;
  font-weight: 600;
  cursor: pointer;
}

.accordion-006 summary::-webkit-details-marker {
  display: none;
}

.accordion-006 summary::after {
  transform: translateY(-25%) rotate(45deg);
  width: 7px;
  height: 7px;
  margin-left: 10px;
  border-bottom: 3px solid #cfcfcf;
  border-right: 3px solid #cfcfcf;
  content: '';
  transition: transform .3s;
}

.accordion-006[open] summary::after {
  transform: rotate(225deg);
}

.accordion-006 p {
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  color: #333333;
  transition: transform .5s, opacity .5s;
}

.accordion-006[open] p {
  transform: none;
  opacity: 1;
}

.summary-text006 {
  background: #ffffff;
  font-size: 1.6em;
  border: 1px solid;
  padding: 0.8em 1.4em;
  margin: 0 auto;
}

@media print,
screen and (min-width: 751px) {
  .container {
    margin: 0 auto;
    width: 750px;
  }
}

.inner {
  padding: 0 5.3333333333%;
}

.txt-orange {
  color: #e77b51;
}

.notes>li {
  padding: 0 5.33% 0.5em;
  font-size: 0.6em;
  line-height: 1.3333333333;
  position: relative;
}

@media screen and (max-width: 750px) {
  .notes>li {
    font-size: 2.4vw;
  }
}

.notes>li::before {
  position: absolute;
  top: 0;
  left: 0;
}

.mb-1e {
  margin-bottom: 1em;
}

/*-------------------------------------------------- kv --------------------------------------------------*/
#top h1{
  margin: 0;
}

/*-------------------------------------------------- lead --------------------------------------------------*/
#lead {
  padding: calc(80 / 700 * 100%) 5.33%;
  text-align: center;
}

#lead .lead_ttl{
  color: #42af9d;
  font-size: 1.6em;
  margin: 0 0 calc(40 / 780 * 100%);
}

/*-------------------------------------------------- linkarea --------------------------------------------------*/
#linkarea {
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #e2f4f4;
  text-align: center;
}

#linkarea .linkarea_ttl{
  color: #42af9d;
  font-size: 1.3em;
  text-align: center;
  margin: calc(40 / 780 * 100%) 0 calc(20 / 780 * 100%);
}

#linkarea ul.linkarea_item {
  width: 100%;
  display: flex;
  gap: 1em;
}

#linkarea ul.linkarea_cp {
  margin: calc(60 / 780 * 100%) 0 0;
}

/*-------------------------------------------------- contents --------------------------------------------------*/
#contents .contents_link {
  position: relative;
  padding: 0 calc(80 / 780 * 100%);
  margin: calc(100 / 780 * 100%) 0 0;
}

#contents .contents_link ul li {
  list-style-type: none;
  position: relative;
  letter-spacing: 3px;
  background-position: left bottom 65%;
  background-size: calc(110 / 780 * 100%);
  background-repeat: no-repeat;
  padding-bottom: calc(32 / 780 * 100%);
  border-bottom: 1.5px dotted #42af9d;
  margin-bottom: calc(24 / 780 * 100%);
}

#contents .contents_link ul li a {
  font-size: 1.2em;
  text-decoration: none;
}

#contents .contents_link ul li img {
  width: 13%;
  float: left;
}

#contents .contents_link ul li:last-child {
  border: none;
  margin-bottom: 0;
}

#contents .contents_link ul li p span {
  font-size: 0.8em;
}

#contents .contents_link ul li p {
  padding-left: 21%;
  color: #1a1e1f;
  line-height: 1.4;
}

#contents .contents_link ul li p::after {
  position: absolute;
  content: "";
  background-image: url(../img/contents_link_arrow.png);
  background-size: 12px;
  display: inline-block;
  width: 12px;
  height: 12px;
  right: 0;
}

/*contets01*/
#contents #contents01 {
  position: relative;
  background-color: #ffffff;
  padding-top: calc(100 / 780 * 100%);
}

#contents #contents01 .contents__inner {
  position: relative;
  background-color: #ffffff;
}

#contents #contents01 .contents__inner .contents_ttl {
  position: absolute;
  z-index: 999;
  top: 5%;
  right: 6%;
  display: flex;
  flex-flow: column;
}

#contents #contents01 .contents__inner .contents_ttl sup{
  display: inline-block;
  transform: rotate(-90deg);
  vertical-align: baseline;
}

#contents #contents01 .contents__inner .ttl_img {
  position: absolute;
  z-index: 999;
  top: -2%;
  right: 4%;
  margin-left: auto;
  width: 18%;
}

#contents #contents01 .contents__inner .contents_ttl .ttl_text {
  writing-mode: vertical-rl;
  display: ruby;
  font-weight: bold;
  margin-top: 0%;
}

#contents #contents01 .contents__inner .contents_ttl p.ttl_lead {
  font-size: 1.2em;
  line-height: 1.3;
  margin-left: calc(8 / 780 * 100%);
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents01 .contents__inner .contents_ttl p.ttl_catch {
  font-size: 2em;
  line-height: 1.5;
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents01 .centents_text {
  padding: 0 calc(80 / 780 * 100%);
  margin-top: calc(80 / 780 * 100%);
  margin-bottom: calc(120 / 780 * 100%);
}

#contents .check_list .check_ttl {
  font-size: 1.2em;
  text-align: center;
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  margin-bottom: calc(54 / 780 * 100%);
}

#contents .check_list ul {
  margin: calc(40 / 780 * 100%) 0;
}

#contents .check_list ul li {
  position: relative;
  list-style-type: none;
  padding-bottom: calc(24 / 780 * 100%);
}

#contents .check_list ul li p {
  margin-left: 2.5em;
}

#contents .check_list ul li::before {
  position: absolute;
  content: "";
  width: 10%;
  height: 100%;
  background-image: url(../img/contents_check.png);
  background-size: 60%;
  background-repeat: no-repeat;
}

#contents .contents01_img{
  margin-top: calc(40 / 780 * 100%);
}

#contents #contents01 .hr::after {
  left: 50%;
  content: "";
  position: absolute;
  height: 60px;
  width: 1px;
  background-color: #1a1e1f;
}

#contents .reocommend {
  padding: 0 calc(80 / 780 * 100%);
  background-color: #ffffff;
  padding-bottom: calc(100 / 780 * 100%);
}

#contents .reocommend.hr::after {
  left: 50%;
  content: "";
  position: absolute;
  height: 60px;
  width: 1px;
  background-color: #1a1e1f;
}

#contents .reocommend .reocommend_lead {
  margin: 0 auto 30px auto;
  text-align: center;
}

#contents .reocommend .reocommend_lead p {
  background-color: #fff;
  display: inline-block;
  padding: 0 calc(14 / 780 * 100%);
}

#contents .reocommend .reocommend_ttl {
  border-top: 1px solid #1a1e1f;
  padding: calc(32 / 780 * 100%) 0;
  border-bottom: 1px solid #1a1e1f;
  font-size: 1.2em;
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  text-align: center;
  margin: calc(100 / 780 * 100%) 0 calc(40 / 780 * 100%);
}

#contents .skincaretips .reocommend_ttl{
border-top: 1px solid #42af9d;
  border-bottom: 1px solid #42af9d;
}

#contents .skincaretips .reocommend_ttl .img{
  margin: -2em auto 0;
}

@media screen and (max-width: 520px) {
  #contents .skincaretips .reocommend_ttl .img{
  width: calc(160 / 320 * 100%);
  }
}

#contents .skincaretips ul.skincaretips_cnt{
  display: flex;
  flex-direction: column;
  gap: 2em;
}

#contents .skincaretips .tips_2col {
    font-size: 0.9em;
    display: flex;
    align-items: center;
    gap: 1em;
}

#contents .skincaretips .tips_2col:nth-of-type(2){
  margin: calc(60 / 780 * 100%) 0;
}

#contents .skincaretips .tips_2col .ttl {
    font-weight: bold;
    font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
    font-size: 1.1em;
    margin: calc(10 / 780 * 100%) 0 calc(30 / 780 * 100%);
}

#contents .skincaretips .tips_2col .img{
  width: 40%;
  height: 100%;
}

@media screen and (max-width: 520px) {
  #contents .skincaretips .tips_2col .icn{
  width: calc(180 / 320 * 100%);
  }
}

#contents .features ul.features_img{
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 2em;
}

@media screen and (max-width: 520px) {
  #contents .features ul.features_img{
    width: 80%;
    margin: 0 auto;
  }
}

#contents .reocommend .topic_box {
  margin-top: calc(100 / 780 * 100%);
  margin-bottom: calc(80 / 780 * 100%);
}

#contents .reocommend .topic_box .topic_ttl {
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  margin-bottom: calc(32 / 780 * 100%);
}

#contents .reocommend .topic_box .topic_text {
  margin-top: calc(40 / 780 * 100%);
}

#contents .topic_2col {
  margin-top: calc(40 / 780 * 100%);
}

#contents .left .topic_2col img {
  width: 30%;
  float: left;
  margin-right: calc(36 / 780 * 100%);
}

#contents #contents03 .topic_2col {
  font-size: 0.9em;
}

#contents #contents03 .topic_2col::after {
  clear: both;
}

#contents .right .topic_2col img {
  width: 30%;
  float: right;
  margin-left: calc(36 / 780 * 100%);
}

#contents #contents03 .left,
#contents #contents03 .right {
  margin-bottom: calc(64 / 780 * 100%);
}

#contents #contents03 .topic_2col .ttl {
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-size: 1.1em;
  margin-bottom: calc(24 / 780 * 100%);
}

/*contents02*/
#contents #contents02 .contents__inner {
  position: relative;
  background-color: #fff;
}

#contents #contents02 .contents__inner .contents_ttl {
  position: absolute;
  z-index: 999;
  top: 20%;
  left: 9.5%;
  right: auto;
  display: flex;
  flex-flow: column;
}

#contents #contents02 .contents__inner .ttl_img {
  position: absolute;
  z-index: 999;
  top: -7%;
  left: 8%;
  right: auto;
  margin-left: auto;
  width: 18%;
}

#contents #contents02 .contents__inner .contents_ttl .ttl_text {
  writing-mode: vertical-rl;
  display: ruby;
  font-weight: bold;
  margin-top: 0%;
}

#contents #contents02 .contents__inner .contents_ttl p.ttl_lead {
  font-size: 1.2em;
  line-height: 1.3;
  margin-left: calc(8 / 780 * 100%);
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents02 .contents__inner .contents_ttl p.ttl_catch {
  font-size: 2em;
  line-height: 1.5;
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents03 .contents__inner .contents_ttl p.ttl_catch span.rolate {
  writing-mode: horizontal-tb;
  line-height: 1;
}

#contents #contents02 .centents_text {
  margin-left: 30%;
  padding: 0 calc(80 / 780 * 100%);
  margin-top: calc(80 / 780 * 100%);
  margin-bottom: calc(120 / 780 * 100%);
}

#contents .left {
  margin-bottom: calc(120 / 780 * 100%);
}

#contents .left .left_ttl {
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-size: 1.4em;
  font-weight: bold;
  padding-bottom: calc(32 / 780 * 100%);
  border-bottom: 1px solid #1a1e1f;
  margin-bottom: calc(40 / 780 * 100%);
  display: inline-block;
}

#contents #contents02 .topic_2col {
  margin-bottom: calc(60 / 780 * 100%);
}


#contents #contents02 .reocommend .reocommend_lead p {
  background-color: #ebe8e6;
  display: inline-block;
  padding: 0 calc(14 / 780 * 100%);
}

/*contents03*/
#contents #contents03 .contents__inner {
  position: relative;
  background-color: #ffffff;
}

#contents #contents03 .contents__inner .contents_ttl {
  position: absolute;
  z-index: 999;
  top: 10%;
  right: 6%;
  display: flex;
  flex-flow: column;
}

#contents #contents03 .contents__inner .ttl_img {
  position: absolute;
  z-index: 999;
  top: -4%;
  right: 4%;
  margin-left: auto;
  width: 18%;
}

#contents #contents03 .contents__inner .contents_ttl .ttl_text {
  writing-mode: vertical-rl;
  display: ruby;
  font-weight: bold;
  margin-top: 0%;
}

#contents #contents03 .contents__inner .contents_ttl p.ttl_lead {
  font-size: 1.2em;
  line-height: 1.3;
  margin-left: calc(8 / 780 * 100%);
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents03 .contents__inner .contents_ttl p.ttl_catch {
  font-size: 2em;
  line-height: 1.5;
  background-color: #fff;
  padding: 2% 0;
}

#contents #contents03 .centents_text {
  padding: 0 calc(80 / 780 * 100%);
  margin: calc(80 / 780 * 100%) 0 0;
}

#contents #contents03 .topic_box {
  text-align: center;
}

#contents #contents03 .topic_box img {
  margin: 0 auto;
}

#contents #contents03 .gray {
  margin-bottom: calc(40 / 780 * 100%);
}

#contents #contents03 .gray span {
  background-color: #83999e;
  color: #fff;
  padding: 5px;
  margin-right: 10px;
}

/*contents04*/
#contents #contents04 .contents__inner {
  position: relative;
  background-color: #fff;
}

#contents #contents04 .contents__inner .contents_ttl {
  position: absolute;
  z-index: 999;
  top: 12%;
  left: 9.5%;
  right: auto;
  display: flex;
  flex-flow: column;
}

#contents #contents04 .contents__inner .ttl_img {
  position: absolute;
  z-index: 999;
  top: -5%;
  left: 8%;
  right: auto;
  margin-left: auto;
  width: 18%;
}

#contents .contents__inner .ttl_catch sup{
  font-size: 0.35em;
}

#contents #contents04 .centents_text {
  padding: 0 calc(80 / 780 * 100%);
  margin: calc(80 / 780 * 100%) 0;
}

/*-------------------------------------------------- teiki --------------------------------------------------*/
#teiki {
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #ebe8e6;
}

#teiki h2{
  margin: 0 0 calc(40 / 780 * 100%);
  text-align: center;
  font-size: 1.4em;
}

/*-------------------------------------------------- linkarea_ft --------------------------------------------------*/
#linkarea_ft {
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #e2f4f4;
}

#linkarea_ft h2{
  margin: 0 0 calc(40 / 780 * 100%);
}

#linkarea_ft ul.linkarea_ft_set {
  display: flex;
  flex-direction: column;
  gap: 1em;
  margin-bottom: calc(40 / 780 * 100%);
}

#linkarea_ft ul.linkarea_ft_item {
    width: 100%;
    display: flex;
    gap: 1em;
}

#linkarea_ft>p {
  display: table;
  margin: 0 auto;
  text-align: center;
  margin-bottom: calc(40 / 780 * 100%);
}

#linkarea_ft ul.set {
  margin-bottom: calc(80 / 780 * 100%);
}

#linkarea_ft ul.set,
#linkarea_ft ul.item {
  display: table;
  padding: 0 4.33333333%;
  border-spacing: 1rem;
}

#linkarea_ft ul.set li:first-child {
  margin-right: 4.4%;
}

#linkarea_ft ul.set .set_gel {
  margin-right: 4.4%;
}

#linkarea_ft ul.set .set_gel,
#linkarea_ft ul.set .set_cream,
#linkarea_ft ul.item .cream,
#linkarea_ft ul.item .gel,
#linkarea_ft ul.item .wash {
  position: relative;
  display: table-cell;
  box-shadow: 0 5px 8px #ccc;
}

#linkarea_ft ul.set .set_gel>img {
  position: relative;
}

#linkarea_ft ul.set .set_gel .btn_teiki,
#linkarea_ft ul.set .set_cream .btn_teiki {
  top: 42%;
  margin: 0 auto;
}

#linkarea_ft ul.set .set_gel .btn_tudo,
#linkarea_ft ul.set .set_cream .btn_tudo {
  top: 75%;
}

#linkarea_ft ul.set .set_gel .btn_teiki,
#linkarea_ft ul.set .set_gel .btn_tudo,
#linkarea_ft ul.set .set_cream .btn_teiki,
#linkarea_ft ul.set .set_cream .btn_tudo,
#linkarea_ft ul.item .gel .btn_teiki,
#linkarea_ft ul.item .gel .btn_tudo,
#linkarea_ft ul.item .wash .btn_teiki,
#linkarea_ft ul.item .wash .btn_tudo,
#linkarea_ft ul.item .cream .btn_teiki,
#linkarea_ft ul.item .cream .btn_tudo {
  position: absolute;
  display: table;
  z-index: 99999;
}

#linkarea_ft ul.item .gel .btn_teiki,
#linkarea_ft ul.item .wash .btn_teiki,
#linkarea_ft ul.item .cream .btn_teiki {
  top: 44%;
}

#linkarea_ft ul.item .gel .btn_tudo,
#linkarea_ft ul.item .wash .btn_tudo,
#linkarea_ft ul.item .cream .btn_tudo {
  top: 75%;
}

.service_img {
  margin: 0 auto;
  display: table;
}

/*-------------------------------------------------- cp2 --------------------------------------------------*/
#cp2{
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #e2f4f4;
}

#cp2 .cp2_hiddenarea{
  padding-bottom: calc(24 / 780 * 100%);
  background-color: #ffffff;
}

#cp2 .cp2_hiddenarea .toggle{
  color: #42af9d;
  margin: 0 auto;
  padding: 0.5em 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
  border: 2px solid #42af9d;
  border-radius: 999px;
  width: 10em;
}

#cp2 .cp2_hiddenarea .target{
  margin: calc(60 / 780 * 100%) 5.33%;
}

#cp2 .cp2_hiddenarea .target img{
  margin: 0 auto;
}

.cp2_hiddenarea_btn::after {
  width: calc(56 / 700 * 100%);
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 4"><path fill="%2342af9d" d="M7.49999 3.3719C7.49999 3.47546 7.46146 3.57901 7.38419 3.6579C7.22987 3.81586 6.9797 3.81586 6.82537 3.6579L4.62012 1.4007C4.38774 1.16285 4.07868 1.03179 3.75007 1.03179C3.42145 1.03179 3.11221 1.16285 2.87982 1.4007L0.674569 3.65789C0.520241 3.81586 0.270075 3.81586 0.115746 3.65789C-0.0385821 3.50013 -0.0385821 3.24367 0.115746 3.08591L2.321 0.828719C3.10885 0.0221162 4.3911 0.0221162 5.17894 0.828719L7.38419 3.08591C7.46146 3.16479 7.49999 3.26835 7.49999 3.3719Z" /></svg>');
  display: block;
  transform: translateY(0.2em) rotate(180deg);
  transition: all .3s;
}

.cp2_hiddenarea_btn.opened::after {
  transform: translateY(-0.2em) rotate(0deg);
}

/*-------------------------------------------------- tab0318 --------------------------------------------------*/
ul.tab {
  margin-bottom: 20px;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0;
  padding: 0 5.5%;
  font-size: 0;
}

ul.tab li {
  width: calc(97%/2);
  display: inline-block;
  margin: 0 3% 3% 0;
  box-shadow: 0 3px 5px #ccc;
}

ul.tab li:hover {
  cursor: pointer;
}

ul.tab li:nth-child(even) {
  margin-right: 0;
}

ul.tab li.set01 {
  background-image: url("..img/btn_set01.png");
}

.setWrap {
  background-color: #f5f3f2;
  padding-bottom: 20px;
  width: 100%;
}

.setWrap label:hover {
  cursor: pointer;
}

.col01,
.col02 {
  display: inline-block;
  width: calc(87%/2);
  margin: 0 5% 2% 5.5%;
}

.col01 {
  margin-right: 2%;
}

.col02 {
  margin-left: 0;
}

.col03,
.col04,
.col05 {
  display: inline-block;
  width: calc(85%/3);
}

.col03 {
  margin-left: 5.5%;
}

.col04 {
  margin: 0 2% 3% 2%;
}

.col05 {
  margin-right: 5%;
}

.set_item {
  background-color: #ffffff;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #333333;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  box-shadow: 0 3px 5px #ccc;
}

.set_item img {
  width: 100%;
}

.set_item.left {
  margin-right: 0;
}

.set_item.right {
  margin-left: 3%;
}

.set_item:hover {
  opacity: 0.75;
}

input[name="set_item"] {
  display: none;
}

input[type="radio" i] {
  margin: 0;
}

.set_content {
  display: none;
  padding: 0 5.3333333333%;
  clear: both;
  overflow: hidden;
}

#set01:checked~#set01_content,
#set02:checked~#set02_content,
#set03:checked~#set03_content,
#set04:checked~#set04_content,
#set05:checked~#set05_content {
  display: block;
}

#set01 img {
  width: 100%;
}

.setWrap input:checked+.set_item {
  background-color: #fff;
  color: #333333;
  font-weight: bold;
}

.setbtn {
  margin: 0 0 30px 0;
  text-align: center;
}

.setbtn a {
  font-weight: bold;
  text-decoration: none;
  border-bottom: 1px #333 solid;
  color: #333;
  letter-spacing: 1px;
}

/*-------------------------------------------------- cv --------------------------------------------------*/
.cv {
  position: relative;
}

.cv .item.multi1,
.cv .item.multi2 {
  border: none;
  margin: 0;
  padding: 0;
}

.cv .item.multi1 {
  background-color: #e2e6e2;
}

.cv .item.multi2 {
  background-color: #d0d8dd;
}

.cv .item.multi1 .outline,
.cv .item.multi2 .outline {
  margin: 0;
}

.cv .item .teiki_note {
  font-size: 12.48px;
  text-align: right;
  margin: 0 5.9701492537% 10%;
}

.cv .item {
  margin: 10% 5.3333333333%;
}

.cv .item.two {
  background-color: #f2f2f2;
  border-radius: 30px;
}

.cv .item.two .teiki_note {
  margin-bottom: 0;
}

.cv .item .cv_btn.once,
.product .cv_btn.once {
  margin: 0 5.9701492537% 5.9701492537%;
}

.cv .item .cv_btn,
.product .cv_btn {
  position: relative;
  margin: 0 5.9701492537% calc(40 / 780 * 100%);
  background-color: #e77b51;
  border-radius: 999px;
}

.cv .item .outline img.single_img {
  position: relative;
}

@media print,
screen and (min-width: 521px) {

  .cv .item .cv_btn,
  .product .cv_btn {
    transition: all .3s;
  }

  .cv .item .cv_btn:hover,
  .product .cv_btn:hover {
    box-shadow: 0px 3.4666666667px 6.9333333333px 0px rgba(0, 0, 0, 0.2);
    transform: translateY(-5px);
  }
}

.cv .item .cv_btn a,
.product .cv_btn a {
  display: block;
  padding: 1px 0;
}

.cv .item .cv_btn img,
.product .cv_btn img {
  width: 58.5074626866%;
  margin: 1em auto;
}

.cv .item .cv_btn::after,
.product .cv_btn::after {
  content: "";
  display: block;
  position: absolute;
  right: 1.5em;
  top: 0;
  bottom: 0;
  margin: auto;
  background: url("../img/cv_btn_arrow.png") no-repeat right 50%/100% auto;
  width: 2%;
  height: 25%;
  padding-top: 0;
}

.cv .item .cv_btn.once,
.product .cv_btn.once {
  background-color: #83999e;
}

.cv .item .cv_btn.once img,
.product .cv_btn.once img {
  width: 28.3582089552%;
}

.cv .item.multi1 .cv_note,
.cv .item.multi2 .cv_note {
  padding-bottom: 12%;
}

.cv .item .cv_note {
  margin: 0 5.9701492537%;
}

.cv .item .cv_note li {
  font-size: 12.48px;
  font-feature-settings: "palt";
  text-indent: -1em;
  padding-left: 1em;
}

@media screen and (max-width: 520px) {
  .cv .item .cv_note li {
    font-size: 2.4vw;
  }
}

.cv.cv_single {
  padding: 1% 0;
  background-color: #f5f3f2;
}

.cv.cv_single h2 {
  width: 78.9333333333%;
  margin: 0 auto;
  padding: 14.6666666667% 0 0;
}

.cv.cv_single .item {
  border-radius: 12px;
  background-color: #ffffff;
  position: relative;
  border: none;
  padding-bottom: 4%;
}

.cv .rank {
  background-color: #FFF;
  border: #c9c9c9 solid 1px;
  margin: 8% 5.3333333333% 0;
  padding: 8% 0;
}

.cv .rank .outline {
  margin: 0 0 60px;
}

.cv .rank .rank_01,
.cv .rank .rank_02,
.cv .rank .rank_03 {
  position: relative;
  margin-bottom: 30px;
}

.cv .rank .rank_01 .btn_anchor {
  position: absolute;
  width: 195px;
  bottom: 15px;
  left: 230px;
}

.cv .rank .rank_02 .btn_anchor {
  position: absolute;
  width: 195px;
  bottom: 15px;
  left: 230px;
}

.cv .rank .rank_03 {
  margin-bottom: 80px;
}

.cv .rank .rank_03 .btn_anchor {
  position: absolute;
  width: 195px;
  bottom: 15px;
  left: 230px;
}

.cv.cv_single .rank {
  background-color: #FFF;
  border: none;
}

.cv .rank .cv_note {
  margin: 0 5.9701492537%;
}

.cv .rank .cv_note li {
  font-size: 12.48px;
  font-feature-settings: "palt";
}

@media screen and (max-width: 520px) {
  .cv .rank .cv_note li {
    font-size: 2.4vw;
  }

  .cv .rank .rank_01 .btn_anchor {
    width: 41%;
    bottom: 6vw;
    left: 50%;
  }

  .cv .rank .rank_02 .btn_anchor {
    width: 41%;
    bottom: 6vw;
    left: 50%;
  }

  .cv .rank .rank_03 .btn_anchor {
    width: 41%;
    bottom: -5vw;
    left: 50%;
  }

  .cv .rank .rank_03 {
    margin-bottom: 15vw;
  }
}

.cv__service {
  border-radius: clamp(12px, 3.0769230769vw, 16px);
  border: 1px solid #babbbb;
  margin: calc(60 / 700 * 100%) 5.3333333333% 0;
}

.cv__service-btn {
  display: flex;
  justify-content: space-between;
  padding: calc(40 / 700 * 100%);
  cursor: pointer;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-weight: bold;
  font-size: 21.3333333333px;
}

@media screen and (max-width: 520px) {
  .cv__service-btn {
    font-size: 4.1025641026vw;
  }
}

.cv__service-btn::after {
  width: calc(28 / 700 * 100%);
  margin: 0 0 0 .25em;
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8 4"><path fill="%231A1E1F" d="M7.49999 3.3719C7.49999 3.47546 7.46146 3.57901 7.38419 3.6579C7.22987 3.81586 6.9797 3.81586 6.82537 3.6579L4.62012 1.4007C4.38774 1.16285 4.07868 1.03179 3.75007 1.03179C3.42145 1.03179 3.11221 1.16285 2.87982 1.4007L0.674569 3.65789C0.520241 3.81586 0.270075 3.81586 0.115746 3.65789C-0.0385821 3.50013 -0.0385821 3.24367 0.115746 3.08591L2.321 0.828719C3.10885 0.0221162 4.3911 0.0221162 5.17894 0.828719L7.38419 3.08591C7.46146 3.16479 7.49999 3.26835 7.49999 3.3719Z" /></svg>');
  display: block;
  transform: translateY(0.2em) rotate(180deg);
  transition: all .3s;
}

.cv__service-btn.opened::after {
  transform: translateY(-0.2em) rotate(0deg);
}

.cv__service-txt {
  padding: 0 calc(40 / 700 * 100%) calc(40 / 700 * 100%);
}

.cv__service-txt h4 {
  font-size: 21.3333333333px;
  margin: calc(60 / 700 * 100%) 0 calc(20 / 700 * 100%);
  border-bottom: 1px solid #babbbb;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
}

@media screen and (max-width: 520px) {
  .cv__service-txt h4 {
    font-size: 4.1025641026vw;
  }
}

.cv__service-txt h4:first-child {
  margin-top: 0;
}

.cv__service-txt p {
  margin: 0 0 1.2em;
  text-align: left;
}

.cv__service-txt p:last-child {
  margin-bottom: 0;
}

#area_cp #area_item{
  margin: 0 0 calc(60 / 780 * 100%);
}

#area_cp #area_item img{
   margin: 0 auto;
}

#area_cp .product .once_price{
  margin: calc(60 / 780 * 100%) 0 calc(16 / 780 * 100%);
}

#area_cp .cv_item{
  background-color: #ffffff;
  margin: 0 0 calc(80 / 780 * 100%);
  padding: 0 0 calc(40 / 780 * 100%);
  border-radius: 10px;
}

#area_cp .product.cv_single{
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #eeeeee;
}

#area_cp .cv_item:last-of-type{
  margin-bottom: 0;
}

#area_cp .product.cv_set{
  padding: calc(80 / 780 * 100%) 5.33%;
  background-color: #dcdddd;
}



/*-------------------------------------------------- attention --------------------------------------------------*/
.attention {
  position: relative;
  padding: calc(150 / 780 * 100%) calc(40 / 780 * 100%) calc(120 / 780 * 100%);
  background-color: #ffffff;
}

.attention__inner {
  border: #1a1e1f solid 1px;
  text-align: center;
  padding: 0 calc(40 / 700 * 100%) calc(40 / 700 * 100%);
}

.attention h2 {
  display: inline-block;
  background-color: #fbfafa;
  border: #1a1e1f solid 1px;
  font-size: 18.6666666667px;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-weight: bold;
  margin: 0 0 .5em;
  padding: .5em 1em;
  transform: translateY(-1.5em);
}

@media screen and (max-width: 520px) {
  .attention h2 {
    font-size: 3.5897435897vw;
  }
}

.attention h3 {
  font-size: 26.6666666667px;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-weight: bold;
  margin: 0 0 1.2rem;
}

@media screen and (max-width: 520px) {
  .attention h3 {
    font-size: 5.1282051282vw;
  }
}

.attention ul.attention_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.attention ul.attention_list li {
  position: relative;
  text-align: left;
  width: 95%;
  font-size: 20px;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-weight: bold;
  margin: 0 0 .8rem;
  padding: 0 0 0 1em;
}

@media screen and (max-width: 520px) {
  .attention ul.attention_list li {
    font-size: 3.8461538462vw;
  }
}

.attention ul.attention_list li span {
  border-bottom: #1a1e1f solid 1px;
  padding: 0 0 .2em;
}

.attention ul.attention_list li::before {
  content: "";
  position: absolute;
  width: .4em;
  height: .4em;
  left: 0;
  top: .7em;
  border-radius: 999px;
  border: #1a1e1f solid 1px;
}

.attention p {
  margin: 0 0 1.2rem;
}

.attention ul {
  text-align: left;
  font-size: 13.3333333333px;
}

@media screen and (max-width: 520px) {
  .attention ul {
    font-size: 2.5641025641vw;
  }
}

.attention ul li {
  display: flex;
}

.attention ul li::before {
  content: "・";
}

/*-------------------------------------------------- cautions --------------------------------------------------*/
#caution {
  padding: calc(100 / 780 * 100%) 5.3333333333% 0;
}

#caution .box {
  position: relative;
  border: 1px solid #262626;
  padding: 4em 5.3333333333% 3em;
}

#caution .box h2 {
  position: absolute;
  top: -2.5em;
  left: 0;
  z-index: 10;
  width: 100%;
  text-align: center;
}

#caution .box h2 span {
  display: inline-block;
  letter-spacing: .2em;
  background: #ffffff;
  border: 1px solid #262626;
  padding: 1em;
  font-weight: normal;
  font-size: 1em;
}

#caution .box p.caution {
  font-size: 2em;
  color: #42af9d;
  letter-spacing: .1em;
  margin-bottom: 1em;
  text-align: center;
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
}

#caution .box p.lead {
  font-size: 1.2em;
  letter-spacing: .2em;
  text-align: center;
  font-weight: bold;
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
}

#caution .box p.lead span.br {
  display: block;
  height: 2rem
}

#caution .box p.present{
  text-align: center;
  margin-top: 2em;
}

#caution .box .campaign {
  margin-top: 3em;
}

#caution .box .campaign ul{
  padding-inline-start: 1em;
  font-size: 0.8em;
}

#caution .box .campaign ul li {
  text-align: justify;
  list-style: disc;
}

#caution .box .order {
  margin-top: 3em;
  text-align: left;
}

#caution .box .order h3 {
  font-size: 1em;
  font-weight: normal;
  margin-bottom: 0.5em;
}

#caution .box .order ul{
  font-size: 0.8em;
}

#caution .box .order ul li {
  text-align: justify;
  padding-left: 1.5em;
  position: relative;
}

#caution .box .order ul li:before {
  content: '※';
  position: absolute;
  top: 0;
  left: 0;
}

/*-------------------------------------------------- return --------------------------------------------------*/
#return {
  padding: calc(60 / 780 * 100%) 5.3333333333%;
}

#return dl dt {
  position: relative;
  border: 1px solid #262626;
  padding: 1rem;
  letter-spacing: .15em;
  font-size: 1.4em;
}

#return dl dt i {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 3rem;
  width: 3rem;
  height: 3rem;
  margin: auto
}

#return dl dt i:after,
#return dl dt i:before {
  content: '';
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 3rem;
  height: .2rem;
  background: var(--black900);
  transition: transform .3s
}

#return dl dt i:after {
  transform: rotate(90deg)
}

#return dl dt.is-active i:after {
  transform: rotate(0)
}

#return dl dd {
  margin-top: 2em;
  margin-bottom: 1em;
  text-align: left;
  margin-inline-start: 0;
}

#return dl dd p.txt {
 font-size: 0.8em;
 margin-bottom: 2em;
}

#return dl dd ul.notes{
  font-size: 1.5em;
}

#return dl dd ul.notes li {
  text-align: justify;
  padding-left: 1.5em;
  position: relative;
  margin: 0;
}

#return dl dd ul.notes li:before {
  content: '※';
  position: absolute;
  top: 0;
  left: 0;
}

#return dl dd .contact {
  margin-top: 3em;
}

#return dl dd .contact h3 {
  font-size: 0.8em;
  margin-bottom: 1em;
  font-weight: normal;
}

#return dl dd .contact p.tel a {
  display: inline-block;
  font-size: 1.5em;
  line-height: 1;
  letter-spacing: .1em;
  text-decoration: none;
  color: #262626;
}

#return dl dd .contact p.time {
  font-size: 0.8em;
  margin-bottom: 1em;
}

#return dt::before,
#return dt::after {
  content: "";
  display: block;
  width: .75em;
  height: 1px;
  background-color: #1a1e1f;
  right: 1em;
  transition: all .2s;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

#return dt::after {
  transform: rotate(90deg);
}

#return dt.opened::after {
  transform: rotate(0deg);
}

#return dd {
  font-size: 1.1em;
  margin-bottom: 1em;
}

/*-------------------------------------------------- component --------------------------------------------------*/
.component {
  position: relative;
  padding: 10.2564102564% 10.2564102564% 2%;
  background: #ebe8e6;
  color: #1a1e1f;
}

.component h2 {
  font-family: "FP-こぶりなゴシック StdN W6", FP-KoburinaGoStdN-W6, "こぶりなゴシック Std W6", KoburinaGoStd-W6, "游ゴシック Bold", YuGothic, YuGothicB, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  margin-bottom: 1em;
  display: flex;
  align-items: center;
  /* 垂直中心 */
  justify-content: center;
  /* 水平中心 */
}

.component h2:before,
.component h2:after {
  border-top: 2px solid;
  content: "";
  width: 1em;
}

.component h2:before {
  margin-right: 1em;
  /* 文字の右隣 */
}

.component h2:after {
  margin-left: 1em;
  /* 文字の左隣 */
}

@media screen and (max-width: 520px) {
  .component h2 {
    font-size: 3.0769230769vw;
  }
}

.component .component__list dt {
  cursor: pointer;
  position: relative;
  font-size: 16px;
  padding: 0 2em 1.5em 0;
}

@media screen and (max-width: 520px) {
  .component .component__list dt {
    font-size: 3.0769230769vw;
  }
}

.component .component__list dt::before,
.component .component__list dt::after {
  content: "";
  display: block;
  position: absolute;
  width: .75em;
  height: 1px;
  background-color: #1a1e1f;
  right: 0;
  top: .8em;
  transition: all .2s;
}

.component .component__list dt::after {
  transform: rotate(90deg);
}

.component .component__list dt.opened::after {
  transform: rotate(0deg);
}

.component .component__list dd {
  font-size: 14.6666666667px;
  margin-bottom: 1em;
}

@media screen and (max-width: 520px) {
  .component .component__list dd {
    font-size: 2.8205128205vw;
  }
}

/*-------------------------------------------------- footer --------------------------------------------------*/
#footer {
  padding: 9.3333333333% 0;
  color: #fff;
  background: #2c2b2b;
}

#footer h2 {
  padding-bottom: 7.4626865672%;
}

#footer h2 img {
  width: 38.8059701493%;
}

#footer .nav {
  border: 1px solid #fff;
  border-left: none;
  border-right: none;
}

#footer .nav li {
  margin: 1.5em 0;
  font-size: 28px;
}

@media screen and (max-width: 750px) {
  #footer .nav li {
    font-size: 3.7333333333vw;
  }
}

#footer .nav li a {
  color: #fff;
  text-decoration: none;
}

#footer .copyright {
  margin-top: 1.8em;
  font-size: 24px;
}

@media screen and (max-width: 750px) {
  #footer .copyright {
    font-size: 3.2vw;
  }
}