<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";
/* =====
 * LAYOUT :: ALL DEVICE
=================================================================== */
@keyframes bounce {0% {transform: translateY(0) scale(1);}10% {transform: translateY(-4px) scale(1.04);}15% {transform: translateY(0) scale(0.98);}20% {transform: translateY(-2px) scale(1.02);}30% {transform: translateY(0) scale(1);}100% {transform: translateY(0) scale(1);}}

#Main .block-tips-01 {background: transparent url("../img/bg_01.webp") no-repeat 50% 0 / 100% auto;padding: 6em 0 3em;}
#Main .block-tips-01 figure {max-width: 773px;width: calc(100% - 4em);margin: 0 auto;}
#Main .block-tips-01 .grid-list-wrap {max-width: 950px;width: calc(100% - 4em);margin: 0 auto;overflow: hidden;}
#Main .block-tips-01 .grid-list {justify-content: space-between;}
#Main * {font-family: "M PLUS 1p";}

#Main .block-tips-02 {background-color: #f3f3f3;padding: 5em 0;}
#Main .block-tips-02 h2 {margin-bottom: 0.5em;font-size: 137.5%;}
#Main .block-tips-02 h2 small {background-color: #4a89d1;display: block;margin-bottom: 0.5em;border-radius: 2em;text-align: center;line-height: 2;font-weight: bold;font-size: 66.67%;font-family: "M PLUS Rounded 1c";color: #fff;}
#Main .block-tips-02 h2 span {display: inline-block;white-space: nowrap;font-weight: bold;}
#Main .block-tips-02 h4 {margin-bottom: 0;font-size: 137.5%;}
#Main .block-tips-02 h4 small {background-color: #fff;display: block;max-width: 12em;margin-bottom: 0.5em;border-radius: 2em;text-align: center;line-height: 2;font-weight: bold;font-size: 66.67%;font-family: "M PLUS Rounded 1c";color: #4a89d1;}
#Main .block-tips-02 h4 span {display: inline-block;white-space: nowrap;font-weight: bold;color: #fff;}
#Main .block-tips-02 h5 {margin-bottom: 0.5em;font-size: 137.5%;}
#Main .block-tips-02 h5 small {background-color: #fff;display: block;max-width: 12em;margin-bottom: 0.5em;border-radius: 2em;text-align: center;line-height: 2;font-weight: bold;font-size: 66.67%;font-family: "M PLUS Rounded 1c";color: #4a89d1;}
#Main .block-tips-02 h5 span {display: inline-block;white-space: nowrap;font-weight: bold;}
#Main .block-tips-02 h5 strong {background: linear-gradient(0deg, rgba(240, 235, 69, 1) 25%, rgba(240, 235, 69, 0) 25%);}
#Main .block-tips-02 article {background-color: #fff;padding: 1px 0;}
#Main .block-tips-02 article + article {margin-top: 3em;}
#Main .block-tips-02 .container {max-width: 950px;width: calc(100% - 4em);margin: 0 auto;}
#Main .block-tips-02 .introduction {display: flex;padding: 3em 3em 1.5em;}
#Main .block-tips-02 .lead {line-height: 2;}
#Main .block-tips-02 .lead span {display: inline-block;white-space: nowrap;font-weight: bold;}
#Main .block-tips-02 .accordion-header {position: relative;background-color: #f89e34;max-width: 14em;margin: 0 auto;padding: 1em 2em 1em 0;text-align: center;line-height: 1;color: #fff;font-family: "M PLUS Rounded 1c";font-size: 100%;font-weight: bold;animation: bounce 3s ease infinite;}
#Main .block-tips-02 .accordion-header::after {content: "";position: absolute;top: 50%;right: 0.75em;width: 1.5em;height: 1.5em;transition: transform ease 200ms;transform: translateY(-50%) rotate(90deg);background: transparent url("../img/icon_arrow.svg") no-repeat 50% / 95% auto;filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(63deg) brightness(105%) contrast(105%);}
#Main .block-tips-02 .accordion-content {padding-top: 1.5em;}
#Main .block-tips-02 .accordion-content header {position: relative;padding: 3em 3em 3em 30%;background-color: #4a89d1;}
#Main .block-tips-02 .accordion-content header::before {content: "";position: absolute;top: -1px;left: 50%;border-style: solid;border-color: #fff transparent transparent;border-width: 1em;transform: translateX(-50%);}
#Main .block-tips-02 .accordion-content header::after {content: "";position: absolute;top: 50%;left: 6%;width: 18%;aspect-ratio: 1 / 1;transform: translateY(-50%);border-radius: 100%;}
#Main .block-tips-02 .accordion-content footer {position: relative;background-color: #f89e34;}
#Main .block-tips-02 .accordion-content footer::before {content: "";position: absolute;top: -1px;left: 50%;border-style: solid;border-color: #fff transparent transparent;border-width: 1em;transform: translateX(-50%);}
#Main .block-tips-02 .accordion-content footer p {margin-bottom: 0;font-size: 137.5%;}
#Main .block-tips-02 .accordion-content footer p small {background-color: #fff;display: block;max-width: 12em;margin-bottom: 0.5em;border-radius: 2em;text-align: center;line-height: 2;font-weight: bold;font-size: 66.67%;font-family: "M PLUS Rounded 1c";color: #f89e34;}
#Main .block-tips-02 .accordion-content footer p span {display: inline-block;white-space: nowrap;font-weight: bold;color: #fff;}
#Main .block-tips-02 .accordion-content section {position: relative;padding: 1.25em 0 2em;}
#Main .block-tips-02 .accordion-content section::before {position: absolute;top: 0;left: 0;transform: translateY(-50%);font-weight: bold;font-size: 125%;font-family: "M PLUS Rounded 1c";color: #f89e34;}
#Main .block-tips-02 .accordion-content section::after {content: "";position: absolute;top: 0;left: 5em;right: 0;border: 1px solid #f89e34;opacity: 0.4;}
#Main .block-tips-02 .accordion-content section:nth-child(1)::before {content: "安心01";}
#Main .block-tips-02 .accordion-content section:nth-child(2)::before {content: "安心02";}
#Main .block-tips-02 .accordion-content section:nth-child(3)::before {content: "安心03";}
#Main .block-tips-02 .accordion-content section:last-child {padding-bottom: 0;}
#Main .block-tips-02 .accordion-content button {position: relative;display: block;border: none;background-color: transparent;margin: 1.5em auto;padding-right: 3em;text-align: center;cursor: pointer;color: #f89e34;}
#Main .block-tips-02 .accordion-content button::after {content: "";position: absolute;top: 50%;right: 0.75em;width: 1.5em;height: 1.5em;transform: translateY(-50%) rotate(-90deg);background: transparent url("../img/icon_arrow.svg") no-repeat 50% / 95% auto;filter: invert(83%) sepia(26%) saturate(5232%) hue-rotate(334deg) brightness(100%) contrast(95%);;}
#Main .block-tips-02 .accordion-content .column {display: flex;justify-content: space-between;padding: 8em 3em 3em;}
#Main .block-tips-02 .accordion-content .column &gt; div {position: relative;width: calc(50% - 1em);}
#Main .block-tips-02 .accordion-content .column &gt; div figure:nth-child(1) {position: absolute;top: 0;left: 0;right: 0;bottom: calc(30% + 0.75em);}
#Main .block-tips-02 .accordion-content .column &gt; div figure:nth-child(2) {position: absolute;top: calc(70% + 0.75em);left: 0;right: calc(50% + 0.75em);bottom: 0;}
#Main .block-tips-02 .accordion-content .column &gt; div figure:nth-child(3) {position: absolute;top: calc(70% + 0.75em);left: calc(50% + 0.75em);right: 0;bottom: 0;}
#Main .block-tips-02 .accordion-content .column &gt; div figure img {object-fit: cover;object-position: 50%;height: 100%;}
#Main .block-tips-02 .accordion-content .column &gt; div:nth-child(1)::before {content: "大英CODATEなら安心！";position: absolute;bottom: 100%;left: 0;margin-bottom: 2em;background-color: #f89e34;border-radius: 2em;padding: 0 1.5em;line-height: 2;font-weight: bold;font-family: "M PLUS Rounded 1c";color: #fff;}

#Main .block-tips-02 .accordion-header {cursor: pointer;}
#Main .block-tips-02 .accordion-header.active {animation: none;}
#Main .block-tips-02 .accordion-header.active::after {transform: translateY(-50%) rotate(-90deg);}
#Main .block-tips-02 .accordion-content {max-height: 0;overflow: hidden;transition: max-height 0.3s ease-in-out;}

#Main .block-tips-02 #Sec01 h2 small {max-width: 20em;}
#Main .block-tips-02 #Sec01 .accordion-content header::after {background: #fff url("../img/icon_01.svg") no-repeat 50% -10% / 92% auto;}
#Main .block-tips-02 #Sec02 h2 small {max-width: 20em;}
#Main .block-tips-02 #Sec02 .accordion-content header::after {background: #fff url("../img/icon_02.svg") no-repeat 50% -10% / 92% auto;}
#Main .block-tips-02 #Sec03 h2 small {max-width: 22em;}
#Main .block-tips-02 #Sec03 .accordion-content header::after {background: #fff url("../img/icon_03.svg") no-repeat 50% -10% / 92% auto;}
#Main .block-tips-02 #Sec04 h2 small {max-width: 18em;}
#Main .block-tips-02 #Sec04 .accordion-content header::after {background: #fff url("../img/icon_04.svg") no-repeat 50% -10% / 92% auto;}
#Main .block-tips-02 #Sec05 h2 small {max-width: 19em;}
#Main .block-tips-02 #Sec05 .accordion-content header::after {background: #fff url("../img/icon_05.svg") no-repeat 50% -10% / 92% auto;}

#Main .block-tips-03 {background-color: #f3f3f3;padding: 0 0 5em;}
#Main .block-tips-03 figure figcaption {margin-bottom: 0.75em;background: linear-gradient(0deg, rgba(240, 235, 69, 1) 15%, rgba(240, 235, 69, 0) 15%);text-align: center;font-weight: bold;font-size: 87.5%;}
#Main .block-tips-03 figure figcaption strong {display: block;border-radius: 5px 5px 0 0;background-color: #f89e34;margin-bottom: 0.5em;text-align: center;font-size: 150%;font-weight: bold;color: #fff;}
#Main .block-tips-03 .container {position: relative;max-width: 950px;width: calc(100% - 4em);margin: 0 auto;padding: 3em;box-sizing: border-box;background-color: #fff;border: 2px solid #f89e34;border-radius: 10px;}
#Main .block-tips-03 .container h3 {position: absolute;bottom: 100%;left: 50%;transform: translateX(-50%);margin-bottom: -3px;line-height: 1;letter-spacing: 0.15em;font-size: 250%;font-weight: bold;color: #f89e34;}
#Main .block-tips-03 .container h4 {position: relative;margin: 0 auto;max-width: 18em;text-align: center;font-family: "M PLUS Rounded 1c";line-height: 1.25;font-weight: bold;font-size: 200%;color: #4a89d1;}
#Main .block-tips-03 .container h4 small {display: block;margin-bottom: 0.5em;font-weight: bold;font-size: 50%;}
#Main .block-tips-03 .container h4::before {content: "";position: absolute;bottom: 0;left: 0;width: 1px;height: 2em;background-color: #4a89d1;transform: skewX(18deg);}
#Main .block-tips-03 .container h4::after {content: "";position: absolute;bottom: 0;right: 0;width: 1px;height: 2em;background-color: #4a89d1;transform: skewX(-18deg);}
#Main .block-tips-03 .container h5 {background-color: #f89e34;max-width: 20em;margin: 0.5em auto 1em;border-radius: 2em;line-height: 1.75;text-align: center;font-size: 137.5%;font-weight: bold;color: #fff;}
#Main .block-tips-03 .column {display: flex;justify-content: space-between;}
#Main .block-tips-03 .column &gt; div:nth-child(1) {width: calc(60% - 2em);}
#Main .block-tips-03 .column &gt; div:nth-child(2) {width: 40%;}
#Main .block-tips-03 .caps {font-size: 10px;line-height: 1.5;}
#Main .block-tips-03 .lead span {display: inline-block;white-space: nowrap;font-weight: bold;}

#Main .conversion {max-width: 950px;width: calc(100% - 4em);margin: 5em auto;display: flex;justify-content: center;}
#Main .conversion li {width: 50%;}
#Main .conversion li a {position: relative;padding: 1em;background-color: #333333;white-space: nowrap;font-size: 150%;font-weight: bold;text-align: center;line-height: 1;color: #fff;}
#Main .conversion li a::after {content: "〉";position: absolute;top: 50%;right: 0.5em;transform: translateY(-50%) scaleY(0.75);font-size: 75%;color: #fff;}
#Main .conversion li:nth-child(2) a {background-color: #ef9b01;}

.vbox-content h5 {margin-bottom: 0;font-size: 137.5%;font-family: "M PLUS Rounded 1c";color: #f89e34;}
.vbox-content figure {margin-bottom: 1em;}
.vbox-content p strong {color: #f89e34;}
.vbox-content .caps {font-size: 10px;}
.vbox-content .container {padding: 1em;}
.vbox-content .vbox-inline {height: auto!important;box-sizing: border-box;border: 2px solid #f89e34;}
/* =====
* LAYOUT :: PC
=================================================================== */
@media only screen and (min-width: 769px) {
  #Main .block-tips-01 .grid-list &gt; div {width: calc(33.33% - 1em);margin-top: 2em;}

  #Main .block-tips-02 .introduction &gt; div:nth-child(1) {width: 70%;}
  #Main .block-tips-02 .introduction &gt; div:nth-child(2) {width: 30%;}
  #Main .block-tips-02 #Sec02 .introduction {flex-direction: row-reverse;}
  #Main .block-tips-02 #Sec02 .introduction &gt; div:nth-child(1) {padding-left: 3em;box-sizing: border-box;}
  #Main .block-tips-02 #Sec04 .introduction {flex-direction: row-reverse;}
  #Main .block-tips-02 #Sec04 .introduction &gt; div:nth-child(1) {padding-left: 3em;box-sizing: border-box;}

  #Main .block-tips-02 .accordion-content footer {padding: 3em 3em 3em 35%;}
  #Main .block-tips-02 .accordion-content footer::after {content: "";position: absolute;top: 50%;left: 1em;height: calc(100% - 2em);width: calc(35% - 4em);transform: translateY(-50%);}
  #Main .block-tips-02 #Sec01 .accordion-content footer::after {background: transparent url("../img/img_04.webp") no-repeat 50% / cover;}
  #Main .block-tips-02 #Sec02 .accordion-content footer::after {background: transparent url("../img/img_14.webp") no-repeat 50% / cover;}
  #Main .block-tips-02 #Sec03 .accordion-content footer::after {background: transparent url("../img/img_24.webp") no-repeat 50% / cover;}
  #Main .block-tips-02 #Sec04 .accordion-content footer::after {background: transparent url("../img/img_34.webp") no-repeat 50% / cover;}
  #Main .block-tips-02 #Sec05 .accordion-content footer::after {background: transparent url("../img/img_44.webp") no-repeat 50% / cover;}

  .vbox-content .vbox-inline {max-width: 552px;}
}
@media only screen and (min-width: 769px) and (max-width: 1240px) {}
/* =====
* LAYOUT :: SP
=================================================================== */
@media only screen and (max-width: 768px) {
  #Main .block-tips-01 .grid-list &gt; div {width: calc(50% - 0.5em);margin: 1em 0 0;}

  #Main .block-tips-02 {padding-top: 2em;}
  #Main .block-tips-02 h4 {position: relative;z-index: 2;text-align: center;}
  #Main .block-tips-02 h4 small {margin: 0 auto 0.5em;}
  #Main .block-tips-02 .introduction {display: block;}
  #Main .block-tips-02 .introduction &gt; div:nth-child(2) img {width: 60%;margin: 1.5em auto 0;}
  #Main .block-tips-02 .accordion-content header {padding: 10em 3em 3em 3em;}
  #Main .block-tips-02 .accordion-content header::after {top: 2em;left: 50%;width: 30%;transform: translateX(-50%);}
  #Main .block-tips-02 .accordion-content .column {display: block;}
  #Main .block-tips-02 .accordion-content .column &gt; div {width: 100%;}
  #Main .block-tips-02 .accordion-content .column &gt; div + div {margin-top: 3em;aspect-ratio: 1 / 1;}
  #Main .block-tips-02 .accordion-content .column &gt; div:nth-child(1)::before {right: 0;text-align: center;}
  #Main .block-tips-02 .accordion-content footer {padding: 3em;}
  #Main .block-tips-02 .accordion-content footer p {text-align: center;}
  #Main .block-tips-02 .accordion-content footer p small {margin: 0 auto 0.5em;}

  #Main .block-tips-03 .container h5 {font-size: 125%;}
  #Main .block-tips-03 .column {display: block;}
  #Main .block-tips-03 .column &gt; div:nth-child(1) {width: 100%;}
  #Main .block-tips-03 .column &gt; div:nth-child(2) {width: 100%;margin-top: 1.5em;}

  #Main .conversion {display: block;}
  #Main .conversion li {width: auto;}
}
@media only screen and (max-width: 768px) and (orientation: landscape) {}
@media only screen and (max-width: 640px) {}
@media only screen and (max-width: 480px) {}</pre></body></html>