@charset "UTF-8";
/* Break point
---------------------------------------------------------- */
/* Font
---------------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");
/* Mixin
---------------------------------------------------------- */
/* Animation
---------------------------------------------------------- */
.a-fadeIn {
  opacity: 0;
  -webkit-transform: translateY(10px);
          transform: translateY(10px);
  -webkit-transition: all 0.8s ease;
  transition: all 0.8s ease;
}
.a-fadeIn.-start {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

@-webkit-keyframes arrowAnime {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@keyframes arrowAnime {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: translateX(10px);
            transform: translateX(10px);
    opacity: 0;
  }
  51% {
    -webkit-transform: translateX(-10px);
            transform: translateX(-10px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes arrowAnime2 {
  0% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(0);
            transform: scaleX(var(--arrow-scale)) translateX(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(10px);
            transform: scaleX(var(--arrow-scale)) translateX(10px);
    opacity: 0;
  }
  51% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(-10px);
            transform: scaleX(var(--arrow-scale)) translateX(-10px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(0);
            transform: scaleX(var(--arrow-scale)) translateX(0);
    opacity: 1;
  }
}
@keyframes arrowAnime2 {
  0% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(0);
            transform: scaleX(var(--arrow-scale)) translateX(0);
    opacity: 1;
  }
  50% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(10px);
            transform: scaleX(var(--arrow-scale)) translateX(10px);
    opacity: 0;
  }
  51% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(-10px);
            transform: scaleX(var(--arrow-scale)) translateX(-10px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleX(var(--arrow-scale)) translateX(0);
            transform: scaleX(var(--arrow-scale)) translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes dengenkunAnime {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.7) translateY(10px);
            transform: scale(0.7) translateY(10px);
  }
  70% {
    opacity: 1;
    -webkit-transform: scale(1.05) translateY(-5px);
            transform: scale(1.05) translateY(-5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
  }
}
@keyframes dengenkunAnime {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.7) translateY(10px);
            transform: scale(0.7) translateY(10px);
  }
  70% {
    opacity: 1;
    -webkit-transform: scale(1.05) translateY(-5px);
            transform: scale(1.05) translateY(-5px);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
  }
}
/* ==========================================================================//
//
//　変数
//
// ========================================================================== */
:root {
  /* Color
  ---------------------------------------------------------- */
  --color-plus-main: #FFD600;
  --color-plus-bg: #FFFCCE;
  --color-plus-sub: #E5F3FD;
  --color-plus-line: #DDD;
  --color-plus-hover: #adb0df;
  /* font
  ---------------------------------------------------------- */
  /* width
  ---------------------------------------------------------- */
  --plus-maxWidth: 1140px;
  --plus-sidePadding: 15px;
  --plus-header: 60px;
}
@media screen and (min-width: 768px) {
  :root {
    --plus-sidePadding: 40px;
  }
}
@media screen and (min-width: 960px) {
  :root {
    --plus-header: 90px;
  }
}

.c-breadcrumb {
  padding: 0 var(--sidePadding);
}
.c-breadcrumb__list {
  color: #949494;
}
.c-breadcrumb__list li a {
  color: var(--color-main);
  text-decoration: underline;
}
@media screen and (min-width: 960px) {
  .c-breadcrumb__list li a:hover {
    text-decoration: none;
  }
}
.c-breadcrumb__list li + li::before {
  border-color: #949494;
}
.c-breadcrumb + * {
  margin-top: 30px;
}

.l-plus-second-section {
  padding: 0 var(--plus-sidePadding);
}
.l-plus-second-section + .l-plus-second-section {
  margin-top: 60px;
}
@media screen and (min-width: 768px) {
  .l-plus-second-section + .l-plus-second-section {
    margin-top: 110px;
  }
}
.l-plus-second-section__inner {
  max-width: var(--plus-maxWidth);
  margin-right: auto;
  margin-left: auto;
}
.l-plus-second-section .c-plus-ttl-1 + *:not(.l-plus-article, .l-plus-tableOfContents) {
  margin-top: 50px;
}
.l-plus-second-section .l-plus-tableOfContents + .l-plus-article {
  margin-top: 20px;
}
@media screen and (min-width: 768px) {
  .l-plus-second-section .l-plus-tableOfContents + .l-plus-article {
    margin-top: 40px;
  }
}
@media screen and (min-width: 1140px) {
  .l-plus-second-section .c-plus-whiteBox__content {
    padding-top: 40px;
  }
  .l-plus-second-section .c-plus-whiteBox__content .c-plus-article__list:first-child {
    margin-top: 40px;
  }
}

.l-plus-tableOfContents {
  margin-top: 15px;
  max-width: var(--plus-maxWidth);
  margin-right: auto;
  margin-left: auto;
  background-color: #fff;
  border-radius: 10px;
  padding: var(--plus-sidePadding);
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents {
    margin-top: 90px;
    line-height: var(--lhL);
  }
}
@media screen and (min-width: 960px) {
  .l-plus-tableOfContents {
    padding: 50px 80px;
  }
}
.l-plus-tableOfContents__ttl {
  position: relative;
}
.l-plus-tableOfContents__ttl button {
  display: block;
  width: 100%;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: var(--font-b);
  color: var(--color-main);
  padding-left: 35px;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__ttl button {
    padding-left: 40px;
    font-size: 32px;
    font-size: 2rem;
  }
}
@media screen and (min-width: 960px) {
  .l-plus-tableOfContents__ttl button {
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
  }
  .l-plus-tableOfContents__ttl button:hover {
    opacity: 0.7;
  }
}
.l-plus-tableOfContents__ttl::before {
  content: "";
  display: block;
  width: 25px;
  aspect-ratio: 1/1;
  background: url(/coselplus/assets/img/ico-minus.svg) no-repeat center/calc(100% - 14px), var(--color-plus-sub);
  border-radius: 9999px;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__ttl::before {
    width: 30px;
  }
}
.l-plus-tableOfContents__ttl.-active::before {
  background-image: url(/coselplus/assets/img/ico-plus.svg);
}
.l-plus-tableOfContents__list {
  margin-top: 15px;
  padding-left: 35px;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list {
    margin-top: 30px;
    padding-left: 40px;
  }
}
.l-plus-tableOfContents__list li {
  --list1-pl: 28px;
  --list2-pl: 16px;
}
.l-plus-tableOfContents__list li + li {
  margin-top: 5px;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li + li {
    margin-top: 10px;
  }
}
.l-plus-tableOfContents__list li a {
  display: block;
  width: 100%;
  font-weight: var(--font-m);
}
.l-plus-tableOfContents__list li a.-link1 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li a.-link1 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.l-plus-tableOfContents__list li a.-link1 .c-icon-svg {
  width: 18px;
  height: 18px;
  background: var(--color-main);
  color: #fff;
  padding: 3.5px;
  border-radius: 9999px;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  -webkit-transform-origin: center;
          transform-origin: center;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li a.-link1 .c-icon-svg {
    margin-top: 0.3em;
  }
}
.l-plus-tableOfContents__list li a.-link2, .l-plus-tableOfContents__list li a.-link3 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px;
}
.l-plus-tableOfContents__list li a.-link2::before, .l-plus-tableOfContents__list li a.-link3::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background: url(/coselplus/assets/img/ico-arrow2-blue.svg) no-repeat center/cover;
  margin-top: 0.4em;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li a.-link2::before, .l-plus-tableOfContents__list li a.-link3::before {
    margin-top: 0.5em;
  }
}
.l-plus-tableOfContents__list li a.-link2 {
  padding-left: var(--list1-pl);
}
.l-plus-tableOfContents__list li a.-link3 {
  padding-left: calc(var(--list1-pl) + var(--list2-pl));
}
@media screen and (min-width: 960px) {
  .l-plus-tableOfContents__list li a:hover {
    text-decoration: underline;
  }
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li:has(.-link1) + li:has(.-link2, .-link3) {
    margin-top: 15px;
  }
}
.l-plus-tableOfContents__list li:not(:first-child) .-link1 {
  border-top: 1px solid var(--color-plus-line);
  padding-top: 10px;
  margin-top: 10px;
}
@media screen and (min-width: 768px) {
  .l-plus-tableOfContents__list li:not(:first-child) .-link1 {
    padding-top: 20px;
    margin-top: 20px;
  }
}

.l-plus-article {
  margin-top: 15px;
  max-width: var(--plus-maxWidth);
  margin-right: auto;
  margin-left: auto;
  background-color: #fff;
  border-radius: 10px;
  padding: var(--plus-sidePadding) var(--plus-sidePadding) 60px;
}
@media screen and (min-width: 768px) {
  .l-plus-article {
    margin-top: 90px;
    line-height: var(--lhL);
  }
}
@media screen and (min-width: 960px) {
  .l-plus-article {
    padding: 80px 80px 120px;
  }
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl {
    margin-top: 40px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .l-plus-article__mainTtl:has(.-img img) {
    grid-template-columns: 1fr 50%;
  }
}
@media screen and (min-width: 1100px) {
  .l-plus-article__mainTtl:has(.-img img) {
    grid-template-columns: 1fr 500px;
  }
}
.l-plus-article__mainTtl .-txtBox {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5px;
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl .-txtBox {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 10px;
  }
}
.l-plus-article__mainTtl .-txtBox .-category {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 5px 10px 4px;
  background: #fff;
  border: 1px solid var(--color-plus-line);
  color: var(--color-main);
  border-radius: 9999px;
  font-weight: var(--font-m);
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl .-txtBox .-category {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}
.l-plus-article__mainTtl .-txtBox .-ttl {
  line-height: var(--lhL);
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl .-txtBox .-ttl {
    font-size: 32px;
    font-size: 2rem;
    text-align: left;
  }
}
.l-plus-article__mainTtl .-img {
  margin-top: 40px;
  width: calc(100% + var(--plus-sidePadding) * 2);
  position: relative;
  left: calc(0% - var(--plus-sidePadding));
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl .-img {
    display: none;
  }
  .l-plus-article__mainTtl .-img:has(img) {
    display: block;
    margin-top: 0;
    width: 100%;
    aspect-ratio: 1/0.7;
    left: auto;
  }
  .l-plus-article__mainTtl .-img:has(img)::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: #FFF29C;
    border-radius: 15px;
    position: absolute;
    top: 30px;
    left: 30px;
  }
}
.l-plus-article__mainTtl .-img img {
  height: 150px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 768px) {
  .l-plus-article__mainTtl .-img img {
    height: 100%;
    border-radius: 15px;
    position: relative;
    z-index: 1;
  }
}
.l-plus-article > * + * {
  margin-top: 15px;
}
@media screen and (min-width: 768px) {
  .l-plus-article > * + * {
    margin-top: 20px;
  }
}
.l-plus-article > p + p {
  margin-top: 5px;
}
.l-plus-article a {
  text-decoration: underline;
  text-underline-position: from-font;
}
@media screen and (min-width: 960px) {
  .l-plus-article a:hover {
    text-decoration: none;
  }
}
.l-plus-article .c-plus-colorBox {
  margin-top: 30px;
}
@media screen and (min-width: 768px) {
  .l-plus-article .c-plus-colorBox {
    margin-top: 85px;
  }
}
.l-plus-article [class*=l-plus-article__ttl-] + [class*=l-plus-article__ttl-]:not(.l-plus-article__ttl-1) {
  margin-top: 15px;
}
@media screen and (min-width: 768px) {
  .l-plus-article [class*=l-plus-article__ttl-] + [class*=l-plus-article__ttl-]:not(.l-plus-article__ttl-1) {
    margin-top: 30px;
  }
}
.l-plus-article .c-qaBox + * {
  margin-top: 30px;
}
@media screen and (min-width: 960px) {
  .l-plus-article .c-qaBox + * {
    margin-top: 60px;
  }
}
.l-plus-article__ttl-1 {
  padding: 5px 0 5px 10px;
  border-left: 6px solid var(--color-plus-main);
  color: var(--color-main);
  font-size: 21px;
  font-size: 1.3125rem;
  font-weight: var(--font-b);
}
@media screen and (min-width: 768px) {
  .l-plus-article__ttl-1 {
    padding-left: 24px;
    font-size: 32px;
    font-size: 2rem;
  }
}
.l-plus-article__ttl-1:not(:nth-of-type(1)) {
  margin-top: 60px;
}
@media screen and (min-width: 768px) {
  .l-plus-article__ttl-1:not(:nth-of-type(1)) {
    margin-top: 80px;
  }
}
.l-plus-article__ttl-2 {
  margin-top: 30px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--color-plus-line);
  font-size: 17px;
  font-size: 1.0625rem;
  font-weight: var(--font-b);
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .l-plus-article__ttl-2 {
    margin-top: 40px;
    padding-bottom: 15px;
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.l-plus-article__ttl-3 {
  margin-top: 30px;
  padding: 10px;
  background: var(--color-plus-sub);
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: var(--font-b);
}
@media screen and (min-width: 768px) {
  .l-plus-article__ttl-3 {
    margin-top: 40px;
    padding: 10px 15px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.l-plus-article__ttl-4 {
  margin-top: 30px;
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: var(--font-b);
}
@media screen and (min-width: 768px) {
  .l-plus-article__ttl-4 {
    margin-top: 40px;
    font-size: 16px;
    font-size: 1rem;
  }
}
.l-plus-article__backBtn {
  margin-top: 30px;
  padding: 0 var(--plus-sidePadding) 50px;
  border-bottom: 1px solid var(--color-plus-line);
}
@media screen and (min-width: 768px) {
  .l-plus-article__backBtn {
    margin-top: 80px;
    padding: 0 var(--plus-sidePadding) 80px;
  }
}
.l-plus-article__backBtn a, .l-plus-article__backBtn button {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .l-plus-article__backBtn a, .l-plus-article__backBtn button {
    width: auto;
    min-width: 350px;
  }
}
.l-plus-article .c-plus-btn-1 a::before {
  content: none;
}
@media screen and (min-width: 960px) {
  .l-plus-article .c-plus-btn-1 a:hover {
    opacity: 0.7;
  }
}