/*
    Bootstrap 4 と合わせる為の定義
*/
/**
.ASPECTRATIO(@h, @v, @width: 100%) {
    aspect-ratio: @h ~"/" @v;
    width: @width;
}
**/
@keyframes kf_BLINK {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes kf_FIREFLY {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.25;
  }
}
@keyframes kf_TEXT_BLINK {
  from {
    color: inherit;
  }
  to {
    color: transparent;
  }
}
@keyframes kf_FADEIN {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes kf_SLIDEIN_LEFT {
  from {
    opacity: 0;
    margin-left: -20px;
  }
  to {
    opacity: 1;
    margin-left: 0;
  }
}
@keyframes kf_SLIDEIN_RIGHT {
  from {
    opacity: 0;
    margin-left: 20px;
  }
  to {
    opacity: 1;
    margin-left: 0;
  }
}
@keyframes kf_SLIDEOUT_LEFT {
  from {
    opacity: 1;
    margin-left: 0;
  }
  to {
    opacity: 0;
    margin-left: -20px;
  }
}
@keyframes kf_SLIDEOUT_RIGHT {
  from {
    opacity: 1;
    margin-left: 0;
  }
  to {
    opacity: 0;
    margin-left: 20px;
  }
}
@keyframes kf_SPIN {
  from {
    -webkit-transform: rotate( 0deg );
    -moz-transform: rotate( 0deg );
    -ms-transform: rotate( 0deg );
    transform: rotate( 0deg );
  }
  to {
    -webkit-transform: rotate( 360deg );
    -moz-transform: rotate( 360deg );
    -ms-transform: rotate( 360deg );
    transform: rotate( 360deg );
  }
}
@keyframes kf_SWAY {
  from {
    -webkit-transform: rotate( 0deg );
    -moz-transform: rotate( 0deg );
    -ms-transform: rotate( 0deg );
    transform: rotate( 0deg );
  }
  25% {
    -webkit-transform: rotate( 6deg );
    -moz-transform: rotate( 6deg );
    -ms-transform: rotate( 6deg );
    transform: rotate( 6deg );
  }
  75% {
    -webkit-transform: rotate( -6deg );
    -moz-transform: rotate( -6deg );
    -ms-transform: rotate( -6deg );
    transform: rotate( -6deg );
  }
  to {
    -webkit-transform: rotate( 0deg );
    -moz-transform: rotate( 0deg );
    -ms-transform: rotate( 0deg );
    transform: rotate( 0deg );
  }
}
.hide {
  display: none !important;
}
.nobreak {
  white-space: nowrap;
}
.nobreak:before {
  white-space: normal;
  content: " ";
  font-size: 0;
}
:root.ie .nobreak:before {
  font-size: 1px;
}
.show-partial {
  white-space: nowrap;
  overflow: hidden;
}
.word-break-enable {
  word-wrap: break-word;
  word-break: break-all;
}
.word-break-disable {
  word-wrap: normal;
  word-break: normal;
}
.is-mobile .hidden-mobile {
  display: none !important;
}
.only-mobile-inline,
.only-mobile-block {
  display: none;
}
.is-mobile .only-mobile-inline {
  display: inline;
}
.is-mobile .only-mobile-block {
  display: block;
}
@media (min-width: 768px) and (min-height: 768px) {
  .hide-screen-pc {
    display: none !important;
  }
  .show-screen-mobile {
    display: none !important;
  }
}
@media (max-width: 767px), (max-height: 767px) {
  .show-screen-pc {
    display: none !important;
  }
  .hide-screen-mobile {
    display: none !important;
  }
}
/*
@FONT_SIZE_LARGEST          : @FONT_SIZE_DEFAULT + 4px;
@FONT_SIZE_LARGER           : @FONT_SIZE_DEFAULT + 2px;
@FONT_SIZE_SMALLER          : @FONT_SIZE_DEFAULT - 2px;
@FONT_SIZE_SMALLEST         : @FONT_SIZE_DEFAULT - 4px;
*/
@font-face {
  font-family: webfont_GeoMatrix;
  src: url('../fonts/Geomatrix Light.otf') format('opentype');
}
@font-face {
  font-family: webfont_GeoMatrix-light;
  src: url('../fonts/Geomatrix Thin.otf') format('opentype');
}
@font-face {
  font-family: webfont_Leelawadee;
  src: url('../fonts/leelawad_0-webfont.woff2') format('woff2'), url('../fonts/leelawad_0-webfont.woff') format('woff');
}
.button-wide {
  min-width: 250px;
}
.button-block {
  width: 100%;
}
.button-small {
  padding: 0.5em 0.7em !important;
  font-size: calc(1em - 2px) !important;
  letter-spacing: 0 !important;
}
.button-xsmall {
  padding: 0.3em 0.6em !important;
  font-size: calc(1em - 4px) !important;
  letter-spacing: 0 !important;
}
@media print {
  #header,
  #footer,
  #sidebar,
  #goto-top,
  #main-visual,
  .post-pager,
  #contact-form,
  #drawer,
  #eyecatch,
  #font-resizer,
  img,
  .wp-block-image,
  .wp-block-gallery,
  svg,
  .fa-solid,
  .fa-regular,
  .grecaptcha-badge,
  .gmap-embed,
  #wpadminbar,
  #wp-login-btn,
  .no-print {
    display: none !important;
  }
  #content {
    padding-top: 0 !important;
  }
  *,
  *:before,
  *:after,
  *:first-letter {
    color: #000000 !important;
    background: transparent none !important;
    border: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    -webkit-filter: none !important;
    -moz-filter: none !important;
    -ms-filter: none !important;
    filter: none !important;
    overflow: visible !important;
  }
  section:before,
  h2 .en,
  .sub-page .subpage-head,
  .lead-to-contact,
  .fee-simulation .updown,
  .site-examples .example-item .image,
  .site-examples .example-more,
  #movie-examples,
  #system-categories .cat-item .image,
  __any__ {
    display: none !important;
  }
  section {
    margin: 0 !important;
    padding: 0 !important;
  }
  section:not(:last-child):not(:has(#main-visual)) {
    padding-bottom: 100px !important;
  }
  .fee-simulation table,
  .fee-simulation table td,
  .fee-simulation table th {
    border: none !important;
  }
  .faq-list .faq-item .faq-answer {
    display: block !important;
  }
  /**
    // モーダル表示時はモーダル内だけを印刷対象とする
    body.modal-open {

        .MODAL() {
            #page {
                display: none;
            }

            .modal {
                position: relative; // fixedだと1ページ分しか印刷できない
                margin: 0;

                .modal-dialog {
                    margin: 0;
                    max-width: none;
                }

                .modal-header {
                    padding: 0 0 15px 0;
                }

                .modal-body {
                    padding: 0;
                }

                .modal-footer {
                    display: none;
                }
            }
        }
        .MODAL !important;
    }
**/
}
* {
  box-sizing: border-box;
}
:root {
  font-size: 19px;
}
@media (max-width: 767px) {
  :root {
    font-size: 17px;
  }
}
@font-face {
  font-family: "Noto Serif JP";
  src: url('../fonts/googleFonts/Noto_Serif_JP/NotoSerifJP-SemiBold.otf') format('opentype');
  font-display: swap;
}
.font-family-default {
  font-family: "Noto Serif JP", "Yu Mincho", "Songti SC Black", serif;
}
.font-sansserif {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
:root.is-windows .font-sansserif {
  font-weight: 500;
}
.font-sansserif-narrow {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
.font-serif {
  font-family: "Yu Mincho", "Songti SC Black", serif;
  font-weight: bold;
}
body {
  font-family: "Noto Serif JP", "Yu Mincho", "Songti SC Black", serif;
  font-style: normal;
  letter-spacing: 0;
  line-height: 1.8;
}
small,
.small {
  font-size: calc(1em - 4px);
  vertical-align: 1px;
}
b,
strong {
  font-weight: bold;
}
a {
  color: #4f90d9;
}
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none !important;
}
a:disabled,
button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
a.disabled,
button.disabled,
input.disabled,
select.disabled,
textarea.disabled {
  cursor: not-allowed !important;
  opacity: 0.5 !important;
}
h1,
h2,
h3,
h4 {
  margin: 0;
  padding: 0;
  line-height: 1.2;
  font-weight: normal;
  line-break: anywhere;
  text-align: justify;
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child {
  margin-top: 0 !important;
}
h1 {
  font-size: calc(1em + 4px);
}
@media (max-width: 991px) {
  h1 {
    font-size: calc(1em + 2px);
  }
}
h2 {
  margin-bottom: 100px;
  font-size: 2em;
}
@media (min-width: 768px) {
  h2 {
    margin-top: 160px;
  }
}
@media (max-width: 767px) {
  h2 {
    margin-top: 100px;
  }
}
h3 {
  margin-top: 100px;
  margin-bottom: 1.5em;
  font-size: 1.5em;
}
@media (max-width: 767px) {
  h3 {
    font-size: 1.3em;
  }
}
h4 {
  margin-top: 50px;
  margin-bottom: 1em;
  font-size: 1em;
}
p {
  margin: 0;
  text-indent: 1em;
  text-align: justify;
}
p:not(:last-child) {
  margin-bottom: 0.7em;
}
p > * {
  text-indent: 0;
}
/**
h2, h3, h4 {
    & ~ p {
        padding-left: 1em;
    }
}
**/
img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}
body figure {
  margin-bottom: 0;
}
ul,
ol {
  margin: 0;
  padding: 0;
}
ul li,
ol li {
  margin: 0;
  list-style-position: inside;
  text-indent: -1em;
  padding-left: 1em;
}
ul li:not(:last-child),
ol li:not(:last-child) {
  margin-bottom: 0.7em;
}
ul + ul,
ol + ul,
ul + ol,
ol + ol,
ul ul,
ol ul,
ul ol,
ol ol {
  margin-top: 0.7em;
}
ul.inline-list,
ol.inline-list {
  /**
    &:before, &:after {
        display: table;
        border-collapse: collapse;
        content: "";
    }
    &:after {
        clear: both;
    }
**/
}
ul.inline-list:after,
ol.inline-list:after {
  display: block;
  clear: both;
  content: "";
}
ul.inline-list li,
ol.inline-list li {
  float: left;
  margin: 0 2em 0 0;
}
fieldset {
  margin: 28px 0 20px;
  padding: 8px;
  border: solid 1px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}
fieldset:first-child {
  margin-top: 0;
}
fieldset legend {
  all: initial;
  margin: 0 0 0 20px;
  padding: 0 20px;
  color: rgba(48, 48, 48, 0.8);
  font-size: 1em;
  letter-spacing: 1px;
  line-height: 1;
}
.clickable {
  cursor: pointer;
}
.clickable img {
  opacity: 1;
  transition: opacity 0.4s;
}
.clickable:hover img {
  opacity: 0.9;
}
.banner {
  cursor: pointer;
  max-width: 100%;
}
.banner img {
  opacity: 1;
  transition: opacity 0.4s;
}
.banner:hover img {
  opacity: 0.9;
}
.banner img {
  outline: solid 0px transparent;
  transition: opacity 0.4s, outline 0.4s;
}
.banner:hover img {
  outline: solid 5px rgba(32, 32, 32, 0.07000000000000001);
}
iframe {
  max-width: 100% !important;
  min-width: auto !important;
}
.columns {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  gap: 100px 100px;
}
.columns + .columns {
  margin-top: 100px;
}
@media (min-width: 992px) {
  .columns.reverse {
    -ms-flex-direction: row-reverse;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    flex-direction: row-reverse;
  }
  .columns:not(.even-width) > * {
    -ms-flex-positive: 1;
    -webkit-box-flex: 1;
    flex-grow: 1;
  }
  .columns.even-width > * {
    width: 100%;
  }
  .columns.even-width-2 > * {
    -ms-flex: 0 0 calc((100% -  100px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  100px ) /  2 );
    flex: 0 0 calc((100% -  100px ) /  2 );
  }
  .columns.zigzag > *:nth-child(2n),
  .columns.zigzag ~ .columns > *:nth-child(2n) {
    margin-top: 50px;
  }
  .columns.zigzag ~ .columns {
    margin-top: 50px;
  }
}
@media (max-width: 991px) {
  .columns {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
}
textarea {
  overflow: hidden;
  resize: none;
  word-wrap: break-word;
  word-break: break-all;
}
textarea.single-line-input {
  height: 2.25rem;
}
textarea:not(.single-line-input) {
  height: 5.25rem;
}
@keyframes kf_DELAYED_FADE_IN {
  from {
    opacity: 0;
  }
  40% {
    opacity: 0;
    top: 25px;
  }
  to {
    opacity: 1;
    top: 0;
  }
}
@media screen {
  .appear-by-scroll {
    opacity: 0;
  }
  .appear-by-scroll.fade-in {
    position: relative;
    animation: kf_DELAYED_FADE_IN 1s linear 1 normal both;
  }
}
.parallax {
  overflow-y: hidden;
}
/**
@PARALLAX_RANGE_TEST : false;

.PARALLAX_IMAGE(@area_height_px, @image_file: none) {

    &.parallax {
        @RELLAX_JS_SPEED : -6;
        @IMG_OVERHEAD    : (100px * -@RELLAX_JS_SPEED / 2);  // ÷2は無根拠
        @IMG_HEIGHT      : @area_height_px + @IMG_OVERHEAD;

        .parallax-image {
            margin-top: -(@IMG_OVERHEAD / 2);
            height: @IMG_HEIGHT !important;
        }

        & when (@PARALLAX_RANGE_TEST) {
            overflow-y: visible !important;
            background: yellow;

            .parallax-image {
                box-shadow: inset 0 0 0 50px fade(red, 50%);
            }
        }

        & when not (@PARALLAX_RANGE_TEST) {

            .parallax-image {
                background-position: center center;
                background-size: cover;

                & when not (@image_file = none) {
                    background-image: url('@{IMAGES_PATH}@{image_file}');
                }
            }
        }
    }
}
**/
.grecaptcha-badge {
  bottom: 60vh !important;
  z-index: 1000000;
}
#goto-top {
  display: none;
  position: fixed;
  right: 20px;
  bottom: 20px;
  /**
    :root.is-pc & {
        bottom: 10vh;
    }
**/
  font-size: 25px;
  padding: 5px 15px;
  line-height: 1;
  cursor: pointer;
  z-index: 100;
  background: #d1d7dd;
  color: #808080;
  transition: background-color 0.2s;
}
#goto-top:hover,
#goto-top:active {
  background: #f9c50d;
}
.supplement,
.caution {
  margin: 8px 0;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 4px);
  line-height: 1.5;
  text-indent: -1em;
  padding-left: 1em;
  text-align: justify;
}
:root.is-windows .supplement,
:root.is-windows .caution {
  font-weight: 500;
}
.supplement:before,
.caution:before {
  content: "※ ";
}
.supplement:not(:last-child),
.caution:not(:last-child) {
  margin-bottom: 0;
}
p:not(.supplement):not(.caution) + p.supplement,
p:not(.supplement):not(.caution) + p.caution {
  padding-left: 2em;
}
.supplement {
  color: rgba(48, 48, 48, 0.8);
}
.caution {
  color: #ec6f6f;
}
.notice-box,
.supplement-box,
.alert-box {
  margin: 8px 0;
  border: none;
  border-radius: 10px;
  padding: 8px 20px;
  background: rgba(128, 128, 128, 0.06);
  color: #303030;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 2px);
  line-height: 1.5;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  gap: 1rem;
}
:root.is-windows .notice-box,
:root.is-windows .supplement-box,
:root.is-windows .alert-box {
  font-weight: 500;
}
.notice-box.inline,
.supplement-box.inline,
.alert-box.inline {
  display: -ms-inline-flexbox;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: inline-flex;
}
.notice-box:before,
.supplement-box:before,
.alert-box:before {
  font-size: 30px;
  vertical-align: middle;
}
.notice-box:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f4ad" "";
  color: #9ac0e9;
}
.supplement-box:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f071" "";
  color: #f9c50d;
}
.alert-box:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f06a" "";
  color: #ec6f6f;
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.page-nav {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
}
.page-nav a,
.page-nav a:hover,
.page-nav a:active,
.page-nav a:visited,
.page-nav a:focus {
  color: inherit;
  text-decoration: none;
}
.page-nav > .item {
  border: solid 1px #f5f5f5;
  padding: 8px 12px;
  background: #f8f8f8;
  color: rgba(48, 48, 48, 0.8);
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 2px);
  line-height: 1;
  cursor: not-allowed;
}
:root.is-windows .page-nav > .item {
  font-weight: 500;
}
.page-nav > .item:first-child {
  border-radius: 10px 0 0 10px;
}
.page-nav > .item:last-child {
  border-radius: 0 10px 10px 0;
}
.page-nav > .item:not(:first-child) {
  border-left: none;
}
.page-nav > .item.current {
  background: #f9c50d;
  color: #ffffff;
}
.page-nav > .item.clickable {
  background: transparent;
  cursor: pointer;
  transition: background-color 0.2s;
}
.page-nav > .item.clickable:hover,
.page-nav > .item.clickable:active {
  background: #f8f8f8;
}
#font-resizer {
  position: fixed;
  bottom: 0;
  left: 20px;
  z-index: 1000;
  background: #2463a8;
  color: rgba(255, 255, 255, 0.75);
  border: solid 1px #4f90d9;
  border-bottom: none;
  border-radius: 4px 4px 0 0;
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: 12px;
  line-height: 1;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}
#font-resizer label,
#font-resizer .selector {
  overflow: hidden;
  transition: all 0.4s;
}
#font-resizer.open label {
  padding-left: 0;
  padding-right: 0;
  width: 0;
  opacity: 0;
}
#font-resizer:not(.open) .selector {
  width: 0;
  opacity: 0;
}
#font-resizer label {
  padding: 10px;
  width: auto;
  cursor: pointer;
  white-space: nowrap;
}
#font-resizer label:before {
  white-space: normal;
  content: " ";
  font-size: 0;
}
:root.ie #font-resizer label:before {
  font-size: 1px;
}
#font-resizer label .icon {
  margin-right: 0.3em;
}
body.font-resizer-larger #font-resizer label:after {
  content: "：大";
}
body.font-resizer-largest #font-resizer label:after {
  content: "：特大";
}
#font-resizer .icon {
  color: #f9c50d;
}
#font-resizer .selector {
  height: 100%;
  width: 200px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
}
#font-resizer .selector button {
  border: none;
  -ms-flex: 0 0 66.66666667px;
  -webkit-flex: 0 0 66.66666667px;
  flex: 0 0 66.66666667px;
  padding: 10px 0;
  color: rgba(255, 255, 255, 0.75);
}
#font-resizer .selector button:first-child {
  border-top-left-radius: 4px;
}
#font-resizer .selector button:last-child {
  border-top-right-radius: 4px;
}
#font-resizer .selector button:not(:first-child) {
  border-left: solid 1px #4f90d9;
}
#font-resizer .selector button.current {
  background: #1b4a7e;
  pointer-events: none;
}
#font-resizer .selector button:not(.current) {
  background: #2463a8;
}
#font-resizer .selector button.resize-btn-regular .icon {
  font-size: 0.6em;
}
#font-resizer .selector button.resize-btn-larger .icon {
  font-size: 0.8em;
}
body.font-resizer-larger #drawer,
body.font-resizer-larger #content,
body.font-resizer-larger #font-size-demo {
  font-size: 1.075rem;
}
body.font-resizer-largest #drawer,
body.font-resizer-largest #content,
body.font-resizer-largest #font-size-demo {
  font-size: 1.15rem;
}
#font-size-demo {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 100;
  padding: 20px;
  border: solid 1px #f5f5f5;
  background: #ffffff;
  color: #202020;
  display: grid;
  grid-template-columns: auto auto;
  gap: 20px;
  align-items: center;
}
#font-size-demo dt,
#font-size-demo dd {
  margin: 0;
  line-height: 1;
}
#font-size-demo dt {
  font-size: 1rem;
  font-weight: normal;
  text-align: center;
}
#font-size-demo .larger {
  font-size: calc(1em + 2px);
}
#font-size-demo .largest {
  font-size: calc(1em + 4px);
}
#font-size-demo .smaller {
  font-size: calc(1em - 2px);
}
#font-size-demo .smallest {
  font-size: calc(1em - 4px);
}
#font-size-demo .small {
  font-size: calc(1em - 4px);
}
#font-size-demo .h1 {
  font-size: calc(1em + 4px);
}
#font-size-demo .h2 {
  font-size: 2em;
}
#font-size-demo .h3 {
  font-size: 1.5em;
}
#font-size-demo .h4 {
  font-size: 1em;
}
#color-samples {
  position: fixed;
  bottom: 50px;
  left: 10px;
  width: 200px;
  z-index: 100000;
  border: solid 2px #202020;
}
#color-samples > div {
  padding: 20px;
  text-align: center;
}
#color-samples > div.darkblue {
  background: #2463a8;
}
#color-samples > div.darkblue:before {
  content: "darkblue";
}
#color-samples > div.blue {
  background: #4f90d9;
}
#color-samples > div.blue:before {
  content: "blue";
}
#color-samples > div.lightblue {
  background: #9ac0e9;
}
#color-samples > div.lightblue:before {
  content: "lightblue";
}
#color-samples > div.cyan {
  background: #f4f8fc;
}
#color-samples > div.cyan:before {
  content: "cyan";
}
#color-samples > div.gray {
  background: #d1d7dd;
}
#color-samples > div.gray:before {
  content: "gray";
}
#color-samples > div.yellow {
  background: #f9c50d;
}
#color-samples > div.yellow:before {
  content: "yellow";
}
#color-samples > div.lightyellow {
  background: #fbdd71;
}
#color-samples > div.lightyellow:before {
  content: "lightyellow";
}
#color-samples > div.green {
  background: #4fae2b;
}
#color-samples > div.green:before {
  content: "green";
}
.under-construction {
  border: solid 2px #ec6f6f;
  padding: 50px 20px;
  font-size: calc(1em + 4px);
  letter-spacing: 2px;
  color: #ec6f6f;
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  align-items: baseline;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
}
.under-construction:not(:first-child) {
  margin-top: 50px;
}
.under-construction:not(:last-child) {
  margin-bottom: 50px;
}
.under-construction:empty:before {
  content: "鋭意製作中";
}
.under-construction:after {
  content: "UNDER CONSTRUCTION";
  font-size: 12px;
  letter-spacing: 0;
}
.fee-simulation {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: center;
}
.fee-simulation .sim-inner {
  display: inline-block;
  border-radius: 10px;
  padding: 20px;
  text-align: left;
  line-height: 1;
}
.fee-simulation .sim-inner .sim-options {
  margin-bottom: 2rem;
  text-align: center;
}
.fee-simulation .sim-inner .sim-options .options-wrap {
  display: inline-block;
  text-align: left;
}
.fee-simulation .sim-inner .sim-options .options-wrap .form-check-label {
  font-size: calc(1em - 2px);
}
.fee-simulation .sim-inner .sim-details table {
  border-collapse: separate;
  border-spacing: 20px 20px;
  margin: -20px -20px;
}
.fee-simulation .sim-inner .sim-details table,
.fee-simulation .sim-inner .sim-details table * {
  border: none;
}
.fee-simulation .sim-inner .sim-details table th,
.fee-simulation .sim-inner .sim-details table td {
  padding: 0;
  vertical-align: top;
}
.fee-simulation .sim-inner .sim-details table th {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-weight: bold !important;
  letter-spacing: 1px;
}
:root.is-windows .fee-simulation .sim-inner .sim-details table th {
  font-weight: 500;
}
@media (max-width: 0) {
  .fee-simulation .sim-inner .sim-details table tr,
  .fee-simulation .sim-inner .sim-details table th,
  .fee-simulation .sim-inner .sim-details table td {
    display: block;
  }
  .fee-simulation .sim-inner .sim-details table tr {
    margin-top: 20px;
  }
  .fee-simulation .sim-inner .sim-details table > :first-child > tr:first-child {
    margin-top: 0;
  }
}
.fee-simulation .sim-inner .sim-details table tbody {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
.fee-simulation .sim-inner .sim-details table tbody th,
.fee-simulation .sim-inner .sim-details table tbody td {
  vertical-align: baseline;
}
@media (min-width: 576px) {
  .fee-simulation .sim-inner .sim-details table tbody td:first-child {
    white-space: nowrap;
  }
}
.fee-simulation .sim-inner .sim-details table tbody td:nth-child(2) {
  text-align: right;
}
.fee-simulation .sim-inner .sim-details table tbody td:last-child {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
@media (max-width: 575px) {
  .fee-simulation .sim-inner .sim-details table tbody td:last-child {
    max-width: 80px;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
.fee-simulation .sim-inner .sim-details table input.number {
  padding: 0;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
:root.is-windows .fee-simulation .sim-inner .sim-details table input.number {
  font-weight: 500;
}
.fee-simulation .sim-inner .sim-details table input.number:not(.variable) {
  width: 22px;
  border: none;
}
.fee-simulation .sim-inner .sim-details table input.number.variable {
  width: 2em;
  margin-right: 2px;
  border: solid 1px #d0d0d0;
  border-radius: 4px;
  background: #ffffff;
  color: rgba(48, 48, 48, 0.8);
  text-align: center;
  line-height: 1;
}
.fee-simulation .sim-inner .sim-details table .page-number {
  white-space: nowrap;
}
.fee-simulation .sim-inner .sim-details table .updown {
  white-space: nowrap;
}
.fee-simulation .sim-inner .sim-details table .updown:before {
  white-space: normal;
  content: " ";
  font-size: 0;
}
:root.ie .fee-simulation .sim-inner .sim-details table .updown:before {
  font-size: 1px;
}
.fee-simulation .sim-inner .sim-details table .updown .up,
.fee-simulation .sim-inner .sim-details table .updown .down {
  margin-left: 2px;
  border-radius: 4px;
  padding: 4px 8px;
  background: #4fae2b;
  color: #ffffff;
  font-size: 15px;
  line-height: 1;
  vertical-align: baseline;
  cursor: pointer;
  transition: opacity 0.2s;
}
.fee-simulation .sim-inner .sim-details table .updown .up:hover,
.fee-simulation .sim-inner .sim-details table .updown .down:hover {
  opacity: 0.7;
}
.fee-simulation .sim-inner .sim-details table .updown .up:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f062" "";
}
.fee-simulation .sim-inner .sim-details table .updown .down:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f063" "";
}
.fee-simulation .sim-inner .sim-result {
  margin-top: 2rem;
}
.fee-simulation .sim-inner .sim-result .result {
  text-align: center;
}
.fee-simulation .sim-inner .sim-result .result .amount {
  font-size: 1.5em;
}
.fee-simulation .sim-inner .sim-result .result .tax-rule {
  font-size: calc(1em - 4px);
  color: rgba(48, 48, 48, 0.5);
}
.button-primary {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #2463a8;
  border-radius: 4px;
  background: transparent;
  color: #2463a8;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button-primary {
  font-weight: 500;
}
.button-primary:hover,
.button-primary:active {
  color: #ffffff;
}
.button-primary:hover.arrow:after,
.button-primary:active.arrow:after {
  opacity: 0.6;
}
.button-primary.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button-primary.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button-primary.arrow:hover:after,
.button-primary.arrow:active:after {
  opacity: 0.6;
}
.button-primary:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #296fbd;
  transition: all 0.4s;
  content: "";
}
.button-primary:hover:before,
.button-primary:active:before {
  width: 100%;
}
.button-primary[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button-primary .icon {
  color: rgba(36, 99, 168, 0.5);
}
.button,
.button-primary-fill {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  border-radius: 4px;
  background: #4f90d9;
  color: #ffffff;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button,
:root.is-windows .button-primary-fill {
  font-weight: 500;
}
.button:hover,
.button-primary-fill:hover,
.button:active,
.button-primary-fill:active {
  color: #ffffff;
}
.button:hover.arrow:after,
.button-primary-fill:hover.arrow:after,
.button:active.arrow:after,
.button-primary-fill:active.arrow:after {
  opacity: 0.6;
}
.button.arrow:after,
.button-primary-fill.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button.arrow:not(:is(:hover, :active)):after,
.button-primary-fill.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button.arrow:hover:after,
.button-primary-fill.arrow:hover:after,
.button.arrow:active:after,
.button-primary-fill.arrow:active:after {
  opacity: 0.6;
}
.button:before,
.button-primary-fill:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #3a83d4;
  transition: all 0.4s;
  content: "";
}
.button:hover:before,
.button-primary-fill:hover:before,
.button:active:before,
.button-primary-fill:active:before {
  width: 100%;
}
.button[target="_blank"]:not(.external-link):not(:has(img)):after,
.button-primary-fill[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button .icon,
.button-primary-fill .icon {
  color: rgba(255, 255, 255, 0.5);
}
.button-secondary {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f9c50d;
  border-radius: 4px;
  background: transparent;
  color: #f9c50d;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button-secondary {
  font-weight: 500;
}
.button-secondary:hover,
.button-secondary:active {
  color: #ffffff;
}
.button-secondary:hover.arrow:after,
.button-secondary:active.arrow:after {
  opacity: 0.6;
}
.button-secondary.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button-secondary.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button-secondary.arrow:hover:after,
.button-secondary.arrow:active:after {
  opacity: 0.6;
}
.button-secondary:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #facb26;
  transition: all 0.4s;
  content: "";
}
.button-secondary:hover:before,
.button-secondary:active:before {
  width: 100%;
}
.button-secondary[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button-secondary .icon {
  color: rgba(249, 197, 13, 0.5);
}
.button-secondary-fill {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  border-radius: 4px;
  background: #f9c50d;
  color: #ffffff;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button-secondary-fill {
  font-weight: 500;
}
.button-secondary-fill:hover,
.button-secondary-fill:active {
  color: #ffffff;
}
.button-secondary-fill:hover.arrow:after,
.button-secondary-fill:active.arrow:after {
  opacity: 0.6;
}
.button-secondary-fill.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button-secondary-fill.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button-secondary-fill.arrow:hover:after,
.button-secondary-fill.arrow:active:after {
  opacity: 0.6;
}
.button-secondary-fill:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #e7b506;
  transition: all 0.4s;
  content: "";
}
.button-secondary-fill:hover:before,
.button-secondary-fill:active:before {
  width: 100%;
}
.button-secondary-fill[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button-secondary-fill .icon {
  color: rgba(255, 255, 255, 0.5);
}
.button-negative {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  border-radius: 4px;
  background: #808080;
  color: #ffffff;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button-negative {
  font-weight: 500;
}
.button-negative:hover,
.button-negative:active {
  color: #ffffff;
}
.button-negative:hover.arrow:after,
.button-negative:active.arrow:after {
  opacity: 0.6;
}
.button-negative.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button-negative.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button-negative.arrow:hover:after,
.button-negative.arrow:active:after {
  opacity: 0.6;
}
.button-negative:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #737373;
  transition: all 0.4s;
  content: "";
}
.button-negative:hover:before,
.button-negative:active:before {
  width: 100%;
}
.button-negative[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button-negative .icon {
  color: rgba(255, 255, 255, 0.5);
}
.button-simple {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #d1d7dd;
  border-radius: 4px;
  background: transparent;
  color: #808080;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows .button-simple {
  font-weight: 500;
}
.button-simple:hover,
.button-simple:active {
  color: #ffffff;
}
.button-simple:hover.arrow:after,
.button-simple:active.arrow:after {
  opacity: 0.6;
}
.button-simple.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.button-simple.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.button-simple.arrow:hover:after,
.button-simple.arrow:active:after {
  opacity: 0.6;
}
.button-simple:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #8d8d8d;
  transition: all 0.4s;
  content: "";
}
.button-simple:hover:before,
.button-simple:active:before {
  width: 100%;
}
.button-simple[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.button-simple .icon {
  color: rgba(128, 128, 128, 0.5);
}
.button-inline {
  margin: 8px;
  vertical-align: middle;
}
.buttons {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 20px;
}
.buttons.buttons-justify > * {
  -ms-flex-positive: 1;
  -webkit-box-flex: 1;
  flex-grow: 1;
}
.text-link {
  color: #4f90d9 !important;
  margin: 0 2px;
}
.text-link,
.text-link:hover,
.text-link:active,
.text-link:visited,
.text-link:focus {
  color: inherit;
  text-decoration: none;
}
.text-link  {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
.text-link:hover ,
.text-link:active  {
  text-decoration-color: #f9c50d !important;
}
.external-link:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
hr:not([class*="wp-block-separator"]),
hr.wp-block-separator.is-style-wide {
  display: block;
  /*
    border: 0 !important;
    height: 1px;
    background: @BORDER_LINE_COLOR;
    .BACKGROUND_GRADIENT(@PAGE_BG_COLOR ~"," @BORDER_LINE_COLOR 50% ~"," @PAGE_BG_COLOR, right);
*/
  border-bottom: solid 1px #f5f5f5;
  margin: 100px 0;
  opacity: 1;
}
/**
// Googleマップ埋め込み
.GOOGLEMAP_EMBED(@height, @trim_x: 0%, @trim_y: 0px) {
    height: @height;
    background: @SHADOW_COLOR_DEFAULT;
    overflow: hidden;
    position: relative;

    iframe {
        @gmap_card_height : 150px;  // カードを隠す
        width: 200% !important;
        max-width: none !important;
        height: (@height + ((@gmap_card_height + @trim_y) * 2)) !important;
        margin-left: (-50% + @trim_x);
        margin-top: -@gmap_card_height;
    }

    a.gmap-link {
        .ANCHOR_RESET;
        .HOVER_REACTION_2(darken(@SYMBOLIC_COLOR_BLUE, 5%), absolute);
        top: 0;
        right: 0;
        padding: 0.6em 1em;
        background: @SYMBOLIC_COLOR_BLUE;
        color: @TEXT_COLOR_ON_DARK !important;
        font-size: @FONT_SIZE_SMALLER;
        line-height: 1;
        .nobreak;
    }
}
**/
.lead-to-contact {
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #f9c50d;
}
.lead-to-contact .inner {
  width: 1400px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
  padding-top: 100px;
  padding-bottom: 100px;
  background-image: url('../images/lead-to-contact.png');
  background-size: auto 90%;
  background-repeat: no-repeat;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
}
@media (max-width: 991px) {
  .lead-to-contact .inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.section-yellow + .lead-to-contact .inner {
  margin-top: -100px;
}
@media (min-width: 992px) {
  .lead-to-contact .inner {
    background-position: bottom right 10%;
  }
}
@media (max-width: 991px) and (min-width: 576px) {
  .lead-to-contact .inner {
    background-position: bottom right 20px;
  }
}
@media (max-width: 575px) {
  .lead-to-contact .inner {
    background-position: bottom right -50px;
  }
}
.lead-to-contact .inner .content {
  margin-left: -10%;
  line-height: 1.5;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  text-shadow: 1px 0 1px #f9c50d, 0 1px 1px #f9c50d, -1px 0 1px #f9c50d, 0 -1px 1px #f9c50d, 1px 1px 1px #f9c50d, -1px 1px 1px #f9c50d, 1px -1px 1px #f9c50d, -1px -1px 1px #f9c50d;
}
.lead-to-contact .inner .content .title {
  font-size: 2rem;
}
.lead-to-contact .inner .content .desc {
  margin-top: 8px;
  border-radius: 4px;
  background: rgba(249, 197, 13, 0.5);
  font-size: calc(1em + 2px);
}
.lead-to-contact .inner .content .goto-btn {
  margin-top: 35px;
  line-height: 1;
}
.lead-to-contact .inner .content .goto-btn a {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: none;
  border-radius: 4px;
  background: #4f90d9;
  color: #ffffff;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  width: 100%;
}
:root.is-windows .lead-to-contact .inner .content .goto-btn a {
  font-weight: 500;
}
.lead-to-contact .inner .content .goto-btn a:hover,
.lead-to-contact .inner .content .goto-btn a:active {
  color: #ffffff;
}
.lead-to-contact .inner .content .goto-btn a:hover.arrow:after,
.lead-to-contact .inner .content .goto-btn a:active.arrow:after {
  opacity: 0.6;
}
.lead-to-contact .inner .content .goto-btn a.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.lead-to-contact .inner .content .goto-btn a.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.lead-to-contact .inner .content .goto-btn a.arrow:hover:after,
.lead-to-contact .inner .content .goto-btn a.arrow:active:after {
  opacity: 0.6;
}
.lead-to-contact .inner .content .goto-btn a:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #3a83d4;
  transition: all 0.4s;
  content: "";
}
.lead-to-contact .inner .content .goto-btn a:hover:before,
.lead-to-contact .inner .content .goto-btn a:active:before {
  width: 100%;
}
.lead-to-contact .inner .content .goto-btn a[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.lead-to-contact .inner .content .goto-btn a .icon {
  color: rgba(255, 255, 255, 0.5);
}
.lead-to-contact .inner .content .goto-btn a:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.lead-to-contact .inner .content .goto-btn a:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.lead-to-contact .inner .content .goto-btn a:hover:after,
.lead-to-contact .inner .content .goto-btn a:active:after {
  opacity: 0.6;
}
.site-examples .example-inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 50px;
}
.site-examples .example-inner figure.example-item .image {
  box-shadow: 6px 8px 2px rgba(32, 32, 32, 0.07000000000000001);
}
.site-examples .example-inner figure.example-item .image img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
  object-position: center top;
}
.site-examples .example-inner figure.example-item figcaption {
  margin-top: 20px;
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 2px);
  line-height: 1.5;
  word-break: break-all;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  align-items: baseline;
}
.site-examples .example-inner figure.example-item figcaption:not(.self):not(:has(a)):after,
.site-examples .example-inner figure.example-item figcaption:not(.self) a:after {
  content: " 様";
  font-size: 0.85em;
}
.site-examples .example-inner figure.example-item figcaption.self:not(:has(a)):after,
.site-examples .example-inner figure.example-item figcaption.self a:after {
  content: "（自主運営サイト）";
  font-size: 0.85em;
}
.site-examples .example-inner figure.example-item figcaption a {
  color: #303030 !important;
  margin: 0 2px;
}
.site-examples .example-inner figure.example-item figcaption a,
.site-examples .example-inner figure.example-item figcaption a:hover,
.site-examples .example-inner figure.example-item figcaption a:active,
.site-examples .example-inner figure.example-item figcaption a:visited,
.site-examples .example-inner figure.example-item figcaption a:focus {
  color: inherit;
  text-decoration: none;
}
.site-examples .example-inner figure.example-item figcaption a  {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
.site-examples .example-inner figure.example-item figcaption a:hover ,
.site-examples .example-inner figure.example-item figcaption a:active  {
  text-decoration-color: #f9c50d !important;
}
.site-examples .example-inner figure.example-item figcaption:has(a):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.faq-list .faq-item .item-inner {
  display: inline-block;
  cursor: pointer;
}
.faq-list .faq-item .item-inner .faq-question {
  padding: 20px 0;
  font-size: calc(1em + 2px);
  line-height: 1.5;
  transition: color 0.2s;
}
.faq-list .faq-item .item-inner .faq-question:before {
  content: "Q" ".";
  font-size: 24px;
  color: #f9c50d;
  line-height: 1;
  margin-right: 4px;
}
.faq-list .faq-item .item-inner .faq-answer {
  padding: 20px;
  margin: 5px 0 20px 1rem;
  background: #f6f7f8;
  border-radius: 4px;
  position: relative;
}
.faq-list .faq-item .item-inner .faq-answer:before {
  content: "A" ".";
  font-size: 24px;
  color: #4fae2b;
  line-height: 1;
  margin-right: 4px;
}
.faq-list .faq-item .item-inner .faq-answer:after {
  position: absolute;
  left: 15%;
  top: -18px;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 18px 8px;
  border-color: transparent transparent #f6f7f8 transparent;
  content: "";
}
.faq-list .faq-item .item-inner .faq-answer p {
  margin: 0.3em 0 0;
}
.faq-list .faq-item .item-inner:hover .faq-question,
.faq-list .faq-item .item-inner.selected .faq-question {
  color: #f9c50d;
}
.article-list a.article-item {
  display: block;
}
.article-list a.article-item,
.article-list a.article-item:hover,
.article-list a.article-item:active,
.article-list a.article-item:visited,
.article-list a.article-item:focus {
  color: inherit;
  text-decoration: none;
}
.article-list a.article-item .meta .meta-inner {
  color: #303030 !important;
  margin: 0 2px;
}
.article-list a.article-item .meta .meta-inner,
.article-list a.article-item .meta .meta-inner:hover,
.article-list a.article-item .meta .meta-inner:active,
.article-list a.article-item .meta .meta-inner:visited,
.article-list a.article-item .meta .meta-inner:focus {
  color: inherit;
  text-decoration: none;
}
.article-list a.article-item .meta .meta-inner .title {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
.article-list a.article-item .meta .meta-inner:hover .title,
.article-list a.article-item .meta .meta-inner:active .title {
  text-decoration-color: #f9c50d !important;
}
.article-list a.article-item .meta .meta-inner .date {
  color: rgba(48, 48, 48, 0.8);
}
.article-list a.article-item .meta .meta-inner .title {
  line-height: 1.5;
}
.work-flow .phase {
  color: #303030;
  position: relative;
}
@media (min-width: 768px) {
  .work-flow .phase {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    column-gap: 50px;
  }
}
.work-flow .phase:not(:last-child) {
  margin-bottom: 62px;
}
.work-flow .phase:not(:last-child):after {
  position: absolute;
  top: calc(100% +  20px );
  left: calc( 80px  - 8px);
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f175" "";
  font-size: 22px;
  line-height: 22px;
  color: #f9c50d;
}
.work-flow .phase .name {
  -ms-flex: 0 0 160px;
  -webkit-flex: 0 0 160px;
  flex: 0 0 160px;
  width: 160px;
  border: solid 1px #d9e7f6;
  border-radius: 10px;
  padding: 0.8em 8px;
  background: rgba(244, 248, 252, 0.5);
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  box-shadow: 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001);
}
.work-flow .phase .notes {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 2px);
  line-height: 1.5;
}
:root.is-windows .work-flow .phase .notes {
  font-weight: 500;
}
@media (min-width: 768px) {
  .work-flow .phase .notes {
    align-self: center;
  }
}
@media (max-width: 767px) {
  .work-flow .phase .notes {
    margin-top: 20px;
  }
}
.tooltip {
  --bs-tooltip-bg: #f8f8f8;
  --bs-tooltip-color: rgba(48, 48, 48, 0.8);
  -webkit-filter: drop-shadow( 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001) );
  -moz-filter: drop-shadow( 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001) );
  -ms-filter: drop-shadow( 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001) );
  filter: drop-shadow( 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001) );
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: inherit;
}
:root.is-windows .tooltip {
  font-weight: 500;
}
.tooltip.show {
  opacity: 1;
}
.tooltip .tooltip-inner {
  border-radius: 4px;
  padding: 6px 8px;
  font-size: calc(1em - 4px);
  font-weight: normal;
  line-height: 1.5;
  text-align: justify;
  word-break: break-all;
}
.popover {
  --bs-popover-bg: #ffffff;
  --bs-popover-border-color: #f5f5f5;
  --bs-popover-border-radius: 4px;
  --bs-popover-inner-border-radius: calc(var(--bs-popover-border-radius) - 1px);
  --bs-popover-font-size: calc(1em - 2px);
  --bs-popover-header-font-size: 1em;
  --bs-popover-header-color: rgba(48, 48, 48, 0.8);
  --bs-popover-header-bg: #fafcfe;
  --bs-popover-header-padding-x: 8px;
  --bs-popover-header-padding-y: 4px;
  --bs-popover-body-color: inherit;
  --bs-popover-body-padding-x: 8px;
  --bs-popover-body-padding-y: 4px;
  font-family: inherit;
  line-height: 1.5;
}
.popover .popover-header {
  margin: 0;
}
.popover .popover-body p {
  text-indent: 0 !important;
}
.form-control {
  border: solid 1px #f5f5f5;
  border-radius: 4px;
  color: #303030;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
:root.is-windows .form-control {
  font-weight: 500;
}
.form-control:focus {
  box-shadow: 0 0 0 2px #f5f5f5;
}
.form-check {
  line-height: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.form-check .form-check-input,
.form-check .form-check-label {
  cursor: pointer;
}
.form-check .form-check-input:checked {
  background-color: #4fae2b;
  border-color: #4fae2b;
}
/**
// モーダル
.modal {
    --bs-modal-margin: 1em 0;

    @media (max-width: @TABLET_MAX) {
        --bs-modal-margin: 0;
    }

    .modal-dialog {
        width: 100%;
        max-width: @PAGE_WIDTH;

        .modal-content {
            background: @COLOR_WHITE;

            .modal-header {
                border-bottom: solid 1px @BORDER_LINE_COLOR;
                padding: @MARGIN_TIGHT @MARGIN_DEFAULT;

                h5 {
                    font-size: @FONT_SIZE_LARGEST;
                    letter-spacing: 1px;
                }
            }

            .modal-body {
                padding: @MARGIN_DEFAULT @MARGIN_DEFAULT @MARGIN_LOOSE;
            }

            .modal-footer {
                border-top: none;
                padding: 0 @MARGIN_DEFAULT @MARGIN_TIGHT;
                .FLEX_CENTERING_X;

                .modal-close-btn {
                    .BUTTON_WIDE;
                }
            }
        }
    }
}
**/
.mt-article {
  margin-top: 50px !important;
}
.mt-loose {
  margin-top: 100px !important;
}
.gx-article {
  column-gap: 50px !important;
}
.gx-loose {
  column-gap: 100px !important;
}
.gy-loose {
  row-gap: 100px !important;
}
.wp-block-button.is-style-outline a {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0.8em 1em !important;
  text-indent: 0 !important;
  font-size: 1rem !important;
  text-decoration: none !important;
  letter-spacing: 1px !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: pointer !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  border: solid 1px #f9c50d !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: #f9c50d !important;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  transition: box-shadow 0.4s, color 0.4s !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 1 !important;
}
:root.is-windows .wp-block-button.is-style-outline a {
  font-weight: 500 !important;
}
.wp-block-button.is-style-outline a:hover,
.wp-block-button.is-style-outline a:active {
  color: #ffffff !important;
}
.wp-block-button.is-style-outline a:hover.arrow:after,
.wp-block-button.is-style-outline a:active.arrow:after {
  opacity: 0.6 !important;
}
.wp-block-button.is-style-outline a.arrow:after {
  font-family: FontAwesome !important;
  font-weight: normal !important;
  content: "" "\f061" "" !important;
  font-size: 10px !important;
  vertical-align: 2px !important;
  margin-left: 0.3em !important;
  transition: opacity 0.4s !important;
}
.wp-block-button.is-style-outline a.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both !important;
}
.wp-block-button.is-style-outline a.arrow:hover:after,
.wp-block-button.is-style-outline a.arrow:active:after {
  opacity: 0.6 !important;
}
.wp-block-button.is-style-outline a:before {
  position: absolute !important;
  z-index: -1 !important;
  top: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 100% !important;
  background: #facb26 !important;
  transition: all 0.4s !important;
  content: "" !important;
}
.wp-block-button.is-style-outline a:hover:before,
.wp-block-button.is-style-outline a:active:before {
  width: 100% !important;
}
.wp-block-button.is-style-outline a[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome !important;
  font-weight: normal !important;
  content: "" "\f35d" "" !important;
  font-size: 12px !important;
  color: #d0d0d0 !important;
  vertical-align: 1px !important;
  margin-left: 8px !important;
}
.wp-block-button.is-style-outline a .icon {
  color: rgba(249, 197, 13, 0.5) !important;
}
.wp-block-button:not(.is-style-outline) a {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0.8em 1em !important;
  text-indent: 0 !important;
  font-size: 1rem !important;
  text-decoration: none !important;
  letter-spacing: 1px !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: pointer !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  border: none !important;
  border-radius: 4px !important;
  background: #f9c50d !important;
  color: #ffffff !important;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  transition: box-shadow 0.4s, color 0.4s !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 1 !important;
}
:root.is-windows .wp-block-button:not(.is-style-outline) a {
  font-weight: 500 !important;
}
.wp-block-button:not(.is-style-outline) a:hover,
.wp-block-button:not(.is-style-outline) a:active {
  color: #ffffff !important;
}
.wp-block-button:not(.is-style-outline) a:hover.arrow:after,
.wp-block-button:not(.is-style-outline) a:active.arrow:after {
  opacity: 0.6 !important;
}
.wp-block-button:not(.is-style-outline) a.arrow:after {
  font-family: FontAwesome !important;
  font-weight: normal !important;
  content: "" "\f061" "" !important;
  font-size: 10px !important;
  vertical-align: 2px !important;
  margin-left: 0.3em !important;
  transition: opacity 0.4s !important;
}
.wp-block-button:not(.is-style-outline) a.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both !important;
}
.wp-block-button:not(.is-style-outline) a.arrow:hover:after,
.wp-block-button:not(.is-style-outline) a.arrow:active:after {
  opacity: 0.6 !important;
}
.wp-block-button:not(.is-style-outline) a:before {
  position: absolute !important;
  z-index: -1 !important;
  top: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 100% !important;
  background: #e7b506 !important;
  transition: all 0.4s !important;
  content: "" !important;
}
.wp-block-button:not(.is-style-outline) a:hover:before,
.wp-block-button:not(.is-style-outline) a:active:before {
  width: 100% !important;
}
.wp-block-button:not(.is-style-outline) a[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome !important;
  font-weight: normal !important;
  content: "" "\f35d" "" !important;
  font-size: 12px !important;
  color: #d0d0d0 !important;
  vertical-align: 1px !important;
  margin-left: 8px !important;
}
.wp-block-button:not(.is-style-outline) a .icon {
  color: rgba(255, 255, 255, 0.5) !important;
}
.wp-block-table table {
  border-collapse: separate !important;
  border-spacing: 0px;
  border-top: solid 1px #d9e7f6;
  border-left: solid 1px #d9e7f6;
  border-radius: 4px;
}
.wp-block-table table td,
.wp-block-table table th {
  border-width: 0 1px 1px 0 !important;
}
.wp-block-table table > :first-child > tr:first-of-type > :first-child {
  border-top-left-radius: 4px;
}
.wp-block-table table > :first-child > tr:first-of-type > :last-child {
  border-top-right-radius: 4px;
}
.wp-block-table table > :last-child > tr:last-of-type > :first-child {
  border-bottom-left-radius: 4px;
}
.wp-block-table table > :last-child > tr:last-of-type > :last-child {
  border-bottom-right-radius: 4px;
}
.wp-block-table table th,
.wp-block-table table td {
  border: solid 1px #d9e7f6;
  padding: 8px 0.7em;
  vertical-align: top;
}
.wp-block-table table th,
.wp-block-table table thead td,
.wp-block-table table tfoot td {
  background: rgba(244, 248, 252, 0.5);
  font-weight: normal;
  letter-spacing: 1px;
}
.wp-block-table table thead th,
.wp-block-table table tfoot th,
.wp-block-table table thead td,
.wp-block-table table tfoot td {
  text-align: center;
}
.wp-block-table table tbody td {
  background: rgba(255, 255, 255, 0.5);
}
.wp-block-table.wo-table-headcell table tbody td:first-child {
  background: rgba(244, 248, 252, 0.5);
  font-weight: normal;
}
.wp-block-file a.wp-element-button {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f9c50d;
  border-radius: 4px;
  background: transparent;
  color: #f9c50d;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  margin: 8px;
  vertical-align: middle;
}
:root.is-windows .wp-block-file a.wp-element-button {
  font-weight: 500;
}
.wp-block-file a.wp-element-button:hover,
.wp-block-file a.wp-element-button:active {
  color: #ffffff;
}
.wp-block-file a.wp-element-button:hover.arrow:after,
.wp-block-file a.wp-element-button:active.arrow:after {
  opacity: 0.6;
}
.wp-block-file a.wp-element-button.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
.wp-block-file a.wp-element-button.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
.wp-block-file a.wp-element-button.arrow:hover:after,
.wp-block-file a.wp-element-button.arrow:active:after {
  opacity: 0.6;
}
.wp-block-file a.wp-element-button:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #facb26;
  transition: all 0.4s;
  content: "";
}
.wp-block-file a.wp-element-button:hover:before,
.wp-block-file a.wp-element-button:active:before {
  width: 100%;
}
.wp-block-file a.wp-element-button[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
.wp-block-file a.wp-element-button .icon {
  color: rgba(249, 197, 13, 0.5);
}
@media (max-width: 991px) {
  .MOBILE_INNER_PADDING {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 991px) {
  .MOBILE_INNER_PADDING_EXCLUDE {
    margin-left: -15px;
    margin-right: -15px;
  }
}
.CONTENT_INNER_PADDING {
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  .CONTENT_INNER_PADDING {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.CONTENT_INNER_PADDING_EXCLUDE {
  margin-left: -50px;
  margin-right: -50px;
}
@media (max-width: 991px) {
  .CONTENT_INNER_PADDING_EXCLUDE {
    margin-left: -15px;
    margin-right: -15px;
  }
}
.HEADER_INNER_PADDING {
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  .HEADER_INNER_PADDING {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.FOOTER_INNER_PADDING {
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  .FOOTER_INNER_PADDING {
    padding-left: 15px;
    padding-right: 15px;
  }
}
body {
  margin: 0;
  min-width: 375px;
  background: #202020;
  color: #303030;
  -webkit-overflow-scrolling: touch;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
body #page {
  max-width: 2880px;
  margin: 0 auto;
  background: #ffffff;
  overflow-x: hidden;
}
body #page article {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
body .site-error {
  position: fixed;
  bottom: 50px;
  left: 0;
  padding: 8px 20px;
  background: #ec6f6f;
  color: #ffffff;
  font-size: calc(1em - 2px);
  z-index: 1000;
}
body #wp-login-btn {
  position: fixed;
  top: 120px;
  border: solid 0 #f5f5f5;
  left: 0;
  border-width: 1px 1px 1px 0;
  border-radius: 0 10px 10px 0;
  padding: 8px 20px;
  /*
        right: 0;
        border-width: 1px 0 1px 1px;
        border-radius: @BORDER_RADIUS_LARGE 0 0 @BORDER_RADIUS_LARGE;
        padding: @MARGIN_TIGHT (@MARGIN_DEFAULT + 20px) @MARGIN_TIGHT @MARGIN_DEFAULT;
*/
  background: #ffffff;
  box-shadow: 1px 1px 2px rgba(32, 32, 32, 0.07000000000000001);
  z-index: 1001;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
}
body #wp-login-btn,
body #wp-login-btn:hover,
body #wp-login-btn:active,
body #wp-login-btn:visited,
body #wp-login-btn:focus {
  color: inherit;
  text-decoration: none;
}
body #wp-login-btn .wp-logo {
  color: #5070d0;
  font-size: 30px;
  line-height: 1;
  margin-right: 8px;
  animation: kf_SWAY 2s linear infinite normal both;
}
body #wp-login-btn .title {
  font-size: calc(1em - 4px);
  line-height: 1.1;
  text-align: center;
}
#header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: #ffffff;
  line-height: 1;
  padding: 8px 0;
  box-shadow: 0 2px 1px rgba(32, 32, 32, 0.07000000000000001);
}
body.has-wp-adminbar #header {
  top: 32px;
}
@media (max-width: 782px) {
  body.has-wp-adminbar #header {
    top: 46px;
  }
}
#header,
#header #site-id,
#header #site-id .logo,
#header #nav-toggler {
  transition: all 0.4s;
}
#header .header-inner {
  width: 1400px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
  position: relative;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-align: end;
  -webkit-box-align: end;
  align-items: flex-end;
  column-gap: 20px;
}
@media (max-width: 991px) {
  #header .header-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
#header .header-inner #site-id {
  height: 100%;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  gap: 8px;
}
#header .header-inner #site-id,
#header .header-inner #site-id:hover,
#header .header-inner #site-id:active,
#header .header-inner #site-id:visited,
#header .header-inner #site-id:focus {
  color: inherit;
  text-decoration: none;
}
#header .header-inner #site-id .logo {
  height: 44px;
  width: auto;
}
#header .header-inner #site-id .desc .summary {
  font-size: calc(1em - 4px);
  margin-bottom: 4px;
  white-space: nowrap;
}
@media (min-width: 576px) {
  #header .header-inner #site-id .desc .summary .for-mobile {
    display: none;
  }
}
@media (max-width: 575px) {
  #header .header-inner #site-id .desc .summary .for-pc {
    display: none;
  }
}
#header .header-inner #site-id .desc .name {
  font-size: calc(1em + 2px);
  white-space: nowrap;
}
@media (min-width: 1101px) {
  #header .header-inner #nav-toggler {
    display: none;
  }
  #header .header-inner #main-nav .nav-inner {
    display: -ms-flexbox !important;
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: flex !important;
    -ms-flex-align: end;
    -webkit-box-align: end;
    align-items: flex-end;
    gap: 20px;
  }
  #header .header-inner #main-nav .nav-inner .nav-item.mobile-only {
    display: none;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a {
    display: block;
    line-height: 1;
    white-space: nowrap;
    transition: color 0.2s;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a,
  #header .header-inner #main-nav .nav-inner .nav-item a:hover,
  #header .header-inner #main-nav .nav-inner .nav-item a:active,
  #header .header-inner #main-nav .nav-inner .nav-item a:visited,
  #header .header-inner #main-nav .nav-inner .nav-item a:focus {
    color: inherit;
    text-decoration: none;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a:hover,
  #header .header-inner #main-nav .nav-inner .nav-item a:active {
    color: rgba(48, 48, 48, 0.8);
  }
  #header .header-inner #main-nav .nav-inner > .nav-item {
    position: relative;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item > a {
    font-size: 15px;
    text-align: center;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item > a:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f105" "";
    color: #d1d7dd;
    font-size: 10px;
    vertical-align: 1px;
    margin-left: 4px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.short-text > a {
    letter-spacing: 2px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.current > a {
    color: #957608;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.current > a:after {
    color: #f9c50d;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.current:has(.child-menu) > a:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f103" "";
    animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.current:not(:has(.child-menu)) > a:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f107" "";
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: -1rem;
    width: max-content;
    border-radius: 4px;
    padding: 28px 1rem 20px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(32, 32, 32, 0.07000000000000001);
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item {
    font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    font-size: calc(1em - 2px);
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item:not(:first-child) {
    margin-top: 20px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item:before {
    content: "-";
    margin-right: 4px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: " " "\f061" "";
    color: #f9c50d;
    font-size: 10px;
    vertical-align: 2px;
    opacity: 0;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item:hover:after {
    animation: kf_SLIDEIN_LEFT 0.2s linear 1 normal both;
  }
}
@media (max-width: 1100px) {
  #header .header-inner #nav-toggler {
    position: fixed;
    top: 11px;
    margin-top: 0;
    border: none;
    background: inherit;
    padding: 3px 15px;
    line-height: 1;
    color: #d0d0d0;
    font-size: 32px;
  }
  body.has-wp-adminbar #header .header-inner #nav-toggler {
    margin-top: 32px;
  }
  #header .header-inner #main-nav {
    display: none;
    position: absolute;
    top: calc(100% +  8px );
    right: 0;
    border: solid 1px #f5f5f5;
    border-right: none;
    border-radius: 0 0 0 4px;
    background: #ffffff;
    box-shadow: -1px 1px 2px rgba(32, 32, 32, 0.07000000000000001);
  }
  #header .header-inner #main-nav:focus,
  #header .header-inner #main-nav:focus-visible {
    outline: none !important;
  }
  #header .header-inner #main-nav .nav-inner {
    padding: 0 8px;
    width: 220px;
    max-height: calc(85vh -  60px );
    overflow-y: auto;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a {
    display: block;
    line-height: 1;
    color: #303030;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a,
  #header .header-inner #main-nav .nav-inner .nav-item a:hover,
  #header .header-inner #main-nav .nav-inner .nav-item a:active,
  #header .header-inner #main-nav .nav-inner .nav-item a:visited,
  #header .header-inner #main-nav .nav-inner .nav-item a:focus {
    color: inherit;
    text-decoration: none;
  }
  #header .header-inner #main-nav .nav-inner .nav-item a:hover,
  #header .header-inner #main-nav .nav-inner .nav-item a:active {
    background: #f8f8f8;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item:not(:first-child) {
    border-top: solid 1px #f5f5f5;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item > a {
    padding: 20px 0;
    text-align: center;
    transition: background-color 0.4s;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.short-text > a {
    letter-spacing: 4px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item.nav-small > a {
    font-size: calc(1em - 2px);
  }
  #header .header-inner #main-nav .nav-inner > .nav-item:last-child a {
    border-radius: 0 0 0 4px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu {
    display: block !important;
    padding-bottom: 8px;
  }
  #header .header-inner #main-nav .nav-inner > .nav-item .child-menu .nav-item {
    padding: 12px 20px;
    font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    font-size: calc(1em - 2px);
    color: rgba(48, 48, 48, 0.8);
    text-align: right;
  }
}
@media (max-width: 1100px) and (max-width: 782px) {
  body.has-wp-adminbar #header .header-inner #nav-toggler {
    margin-top: 46px;
  }
}
@media (max-width: 1100px) and (min-width: 768px) {
  #header .header-inner #nav-toggler {
    right: 8px;
  }
}
@media (max-width: 1100px) and (max-width: 767px) {
  #header .header-inner #nav-toggler {
    right: 0;
  }
}
#header.header-compact {
  height: 40px;
}
#header.header-compact #site-id {
  gap: 8px;
}
#header.header-compact #site-id .logo {
  height: 24px;
}
#header.header-compact #site-id .desc .summary {
  display: none;
}
@media (max-width: 1100px) {
  #header.header-compact #nav-toggler {
    top: 0px;
  }
}
#footer {
  min-height: 250px;
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #d1d7dd;
  color: #303030;
  padding: 50px 0 20px;
  z-index: 10;
}
@media (max-width: 767px) {
  #footer {
    padding-top: 20px;
    padding-bottom: 100px;
  }
}
#footer .footer-inner {
  width: 1400px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  #footer .footer-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
#footer .footer-inner .footer-columns {
  /**
            @media (max-width: @TABLET_MAX) {

                .column-info {
                    margin-top: 40px;
                }
            }
**/
}
@media (min-width: 992px) {
  #footer .footer-inner .footer-columns {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row-reverse;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    flex-direction: row-reverse;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-between;
  }
}
#footer .footer-inner #corp-info {
  line-height: 1;
}
#footer .footer-inner #corp-info .corp-name {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  column-gap: 8px;
}
#footer .footer-inner #corp-info .corp-name .logo {
  height: 50px;
  width: auto;
}
#footer .footer-inner #corp-info .corp-name .desc .summary {
  font-size: calc(1em - 2px);
  margin-bottom: 8px;
}
#footer .footer-inner #corp-info .corp-name .desc .name {
  font-size: calc(1em + 4px);
}
#footer .footer-inner #footer-nav {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
@media (min-width: 1101px) {
  #footer .footer-inner #footer-nav {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1em 1.5em;
    font-size: 14px;
  }
  #footer .footer-inner #footer-nav .nav-item a {
    display: block;
    line-height: 1;
    padding-bottom: 2px;
    border-bottom: dotted 1px transparent;
    transition: border-bottom-color 0.2s;
  }
  #footer .footer-inner #footer-nav .nav-item a,
  #footer .footer-inner #footer-nav .nav-item a:hover,
  #footer .footer-inner #footer-nav .nav-item a:active,
  #footer .footer-inner #footer-nav .nav-item a:visited,
  #footer .footer-inner #footer-nav .nav-item a:focus {
    color: inherit;
    text-decoration: none;
  }
  #footer .footer-inner #footer-nav .nav-item a:after {
    margin-left: 3px;
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f105" "";
    color: rgba(48, 48, 48, 0.5);
    text-shadow: none;
  }
  #footer .footer-inner #footer-nav .nav-item a:hover,
  #footer .footer-inner #footer-nav .nav-item a:active {
    border-bottom-color: #303030;
  }
  #footer .footer-inner #footer-nav .nav-item.short-text a {
    letter-spacing: 2px;
  }
  #footer .footer-inner #footer-nav .nav-item.current a:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f0d8" "";
    color: #f9c50d;
  }
}
@media (min-width: 1101px) and (min-width: 992px) {
  #footer .footer-inner #footer-nav {
    -ms-flex-pack: end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    max-width: 500px;
  }
}
@media (min-width: 1101px) and (max-width: 991px) {
  #footer .footer-inner #footer-nav {
    width: 100%;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
  }
}
@media (max-width: 1100px) {
  #footer .footer-inner #footer-nav {
    display: none;
  }
}
#footer .footer-inner #copyright {
  margin-top: 100px;
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 4px);
  text-align: center;
}
#footer .footer-inner #copyright .owner-name {
  margin-left: 8px;
  letter-spacing: 1px;
  white-space: nowrap;
}
section:has(.section-inner) {
  padding-top: 100px;
}
@media (min-width: 768px) {
  section:has(.section-inner) {
    padding-bottom: 160px;
  }
}
@media (max-width: 767px) {
  section:has(.section-inner) {
    padding-bottom: 100px;
  }
}
@media (min-width: 768px) {
  body.home section.section-yellow + section.section-yellow,
  body.home section.section-gray + section.section-gray,
  body.home section:not(:is(.section-yellow, .section-gray)) + section:not(:is(.section-yellow, .section-gray)) {
    margin-top: -160px;
  }
}
@media (max-width: 767px) {
  body.home section.section-yellow + section.section-yellow,
  body.home section.section-gray + section.section-gray,
  body.home section:not(:is(.section-yellow, .section-gray)) + section:not(:is(.section-yellow, .section-gray)) {
    margin-top: -100px;
  }
}
@media (min-width: 768px) {
  body.home section.section-yellow + section.section-yellow,
  body.home section.section-gray + section.section-gray,
  body.home section:not(:is(.section-yellow, .section-gray)) + section:not(:is(.section-yellow, .section-gray)) {
    padding-top: 160px;
  }
}
@media (max-width: 767px) {
  body.home section.section-yellow + section.section-yellow,
  body.home section.section-gray + section.section-gray,
  body.home section:not(:is(.section-yellow, .section-gray)) + section:not(:is(.section-yellow, .section-gray)) {
    padding-top: 100px;
  }
}
section.section-yellow {
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #f9c50d;
}
section.section-gray {
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #f6f7f8;
}
section.section-fullwidth .section-inner {
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  section.section-fullwidth .section-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
section.section-pagewidth .section-inner {
  width: 1400px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  section.section-pagewidth .section-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
#content {
  padding-top: 60px;
  min-height: calc(100vh -  250px );
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed;
}
body.has-wp-adminbar #content {
  padding-top: 92px;
}
@media (max-width: 782px) {
  body.has-wp-adminbar #content {
    padding-top: 106px;
  }
}
#content h2 {
  letter-spacing: 2px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  align-items: baseline;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px 20px;
}
@media (max-width: 767px) {
  #content h2 {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
  }
}
#content h2 .en {
  color: #fbdd71;
  font-family: webfont_GeoMatrix-light;
  font-size: 0.7em;
  letter-spacing: 1px;
}
#content .section-yellow h2 .en {
  color: #fdeeb6;
}
#content h3 {
  letter-spacing: 2px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
#content h3:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f107" "";
  color: #fbdd71;
  line-height: 1;
}
#content h4 {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-weight: bold !important;
}
:root.is-windows #content h4 {
  font-weight: 500;
}
@media (min-width: 576px) {
  #content .block-indent {
    padding-left: 1em;
  }
}
#content .inline-help {
  cursor: help;
  text-decoration: underline dotted 1px color-mix(in srgb, currentColor 40%, transparent);
  text-underline-offset: 0.2em;
}
#content .inline-help:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f059" "";
  color: color-mix(in srgb, currentColor 40%, transparent);
  font-size: 0.8rem;
  vertical-align: super;
  text-decoration: none;
}
#content .floatable {
  /**
    &:before, &:after {
        display: table;
        border-collapse: collapse;
        content: "";
    }
    &:after {
        clear: both;
    }
**/
}
#content .floatable:after {
  display: block;
  clear: both;
  content: "";
}
#content .insert-image.left,
#content .insert-image.right {
  width: 40%;
}
#content .insert-image.left {
  float: left;
  margin: 0 50px 20px 0;
}
#content .insert-image.right {
  float: right;
  margin: 0 0 20px 50px;
}
body.home #page #content #main-visual {
  background: #202020;
  position: relative;
}
body.home #page #content #main-visual #top-slider {
  text-align: center;
  position: relative;
}
body.home #page #content #main-visual #top-slider .sliders {
  background: rgba(32, 32, 32, 0.07000000000000001);
  overflow: hidden;
  position: relative;
}
@media (min-width: 992px) {
  body.home #page #content #main-visual #top-slider .sliders {
    height: calc(100vh -  95px );
    min-height: 700px;
  }
}
@media (max-width: 991px) and (min-width: 576px) {
  body.home #page #content #main-visual #top-slider .sliders {
    width: 100%;
    height: 0;
    padding-top: 66.66666667%;
    position: relative;
  }
  body.home #page #content #main-visual #top-slider .sliders > * {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
@media (max-width: 575px) {
  body.home #page #content #main-visual #top-slider .sliders {
    width: 100%;
    height: 0;
    padding-top: 166.66666667%;
    position: relative;
  }
  body.home #page #content #main-visual #top-slider .sliders > * {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
body.home #page #content #main-visual #top-slider .sliders .slider-item {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  display: none;
}
body.home #page #content #main-visual #top-slider .sliders .slider-item.active,
body.home #page #content #main-visual #top-slider .sliders .slider-item.deactive {
  display: block;
}
body.home #page #content #main-visual #top-slider .sliders .slider-item.active {
  z-index: 1;
}
body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-position: center center;
  background-size: cover;
}
@media (min-width: 576px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-img.for-smapho {
    display: none;
  }
}
@media (max-width: 575px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-img:not(.for-smapho) {
    display: none;
  }
}
:root.is-pc body.home #page #content #main-visual #top-slider .sliders .slider-item.active .slider-img,
:root.is-pc body.home #page #content #main-visual #top-slider .sliders .slider-item.deactive .slider-img {
  animation: _kf_top_slider_img_zoom 8s 0s ease-out 1 normal both;
}
@keyframes _kf_top_slider_img_zoom {
  from {
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
  }
  to {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption {
  text-align: left;
}
@media (min-width: 992px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption {
    position: absolute;
    top: 40%;
    left: 30%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 40%;
  }
}
@media (max-width: 991px) and (min-width: 576px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption {
    position: absolute;
    top: 60%;
    left: 35%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 60%;
  }
}
@media (max-width: 575px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption {
    position: absolute;
    top: 70%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 90%;
  }
}
body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 {
  margin: 0;
  color: #404040;
  text-shadow: 1px 0 1px #f6f7f8, 0 1px 1px #f6f7f8, -1px 0 1px #f6f7f8, 0 -1px 1px #f6f7f8, 1px 1px 1px #f6f7f8, -1px 1px 1px #f6f7f8, 1px -1px 1px #f6f7f8, -1px -1px 1px #f6f7f8;
  position: relative;
}
@media (min-width: 576px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 {
    letter-spacing: 0.1em;
    margin-bottom: 40px;
    line-height: 1;
    white-space: nowrap;
  }
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 br {
    display: none;
  }
}
@media (max-width: 575px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 {
    letter-spacing: 0.05em;
    margin-bottom: 20px;
    line-height: 1.3;
  }
}
body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5:before {
  position: absolute;
  top: -40px;
  left: -40px;
  width: 130px;
  height: 180px;
  z-index: -1;
  background: #d1d7dd;
  content: "";
}
body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption .desc {
  border-radius: 4px;
  -webkit-backdrop-filter: blur(3px);
  -moz-backdrop-filter: blur(3px);
  -ms-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
@media (min-width: 576px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption .desc {
    position: relative;
    left: 15px;
    padding: 15px 20px;
    background: rgba(255, 255, 255, 0.5);
  }
}
@media (max-width: 575px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption .desc {
    padding: 8px;
    background: rgba(255, 255, 255, 0.8);
  }
}
@media (min-width: 992px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 {
    font-size: 2.2rem;
  }
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption .desc {
    font-size: calc(1em + 4px);
  }
}
@media (max-width: 991px) {
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption h5 {
    font-size: 2em;
  }
  body.home #page #content #main-visual #top-slider .sliders .slider-item .slider-caption .desc {
    font-size: calc(1em + 2px);
  }
}
:root.is-pc body.home #page #content #main-visual #top-slider .overlay-art {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed;
}
body.home #page #content #main-visual #top-slider .slider-ctrl {
  height: 35px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  border-radius: 4px 4px 0 0;
  background: #ffffff;
  position: relative;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item {
  margin: 1px 8px 0;
  cursor: pointer;
  position: relative;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-prev,
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-next {
  padding: 5px;
  color: #d0d0d0;
  font-size: 15px;
  line-height: 1;
  transition: color 0.2s;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-prev:hover,
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-next:hover {
  color: #b0b0b0;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-direct {
  width: 26px;
  height: 28px;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-direct:before {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  margin-top: 12px;
  height: 5px;
  background: #d0d0d0;
  transition: background-color 0.2s;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-direct:hover:before {
  background: #b0b0b0;
}
body.home #page #content #main-visual #top-slider .slider-ctrl .ctrl-item.slide-direct.active:before {
  background: #9ac0e9;
}
body.home #page #content #main-visual #goto-intro {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 135px;
  z-index: 10;
}
@media (max-width: 991px) {
  body.home #page #content #main-visual #goto-intro {
    display: none;
  }
}
body.home #page #content #main-visual #goto-intro a {
  font-family: webfont_Leelawadee;
  color: #ffffff !important;
  font-size: 30px;
  line-height: 1;
  -webkit-filter: drop-shadow( 0 0 2px #808080 );
  -moz-filter: drop-shadow( 0 0 2px #808080 );
  -ms-filter: drop-shadow( 0 0 2px #808080 );
  filter: drop-shadow( 0 0 2px #808080 );
  position: relative;
}
body.home #page #content #main-visual #goto-intro a,
body.home #page #content #main-visual #goto-intro a:hover,
body.home #page #content #main-visual #goto-intro a:active,
body.home #page #content #main-visual #goto-intro a:visited,
body.home #page #content #main-visual #goto-intro a:focus {
  color: inherit;
  text-decoration: none;
}
body.home #page #content #main-visual #goto-intro a:after {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 100%;
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f107" "";
}
@media (min-width: 992px) {
  body.home #page #content #section-intro {
    background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #f9c50d url('../images/eyecatch-default.jpg') bottom right / 50% auto no-repeat scroll;
  }
}
@media (max-width: 991px) {
  body.home #page #content #section-intro {
    background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #f9c50d url('../images/eyecatch-default.jpg') bottom right / auto 280px no-repeat scroll;
    padding-bottom: 280px;
  }
}
@media (min-width: 992px) {
  body.home #page #content #section-intro #intro-message {
    width: 60%;
    max-width: 100%;
  }
}
body.home #page #content #section-intro #intro-message .head {
  color: #ffffff;
  font-size: 2em;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  align-items: baseline;
  gap: 8px;
  line-height: 1.5;
}
body.home #page #content #section-intro #intro-message .head .icon {
  color: #fbdd71;
}
body.home #page #content #section-intro #intro-message .body {
  margin-top: 50px;
  background: rgba(249, 197, 13, 0.6);
  padding: 0 8px;
  border-radius: 0 4px 4px 0;
}
@media (min-width: 768px) {
  body.home #page #content #section-feature {
    background: url('../images/point.png') bottom right / 40% auto no-repeat fixed;
  }
}
body.home #page #content #section-feature #features {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 20px;
}
body.home #page #content #section-feature #features .feature-item {
  border-radius: 10px;
  background: rgba(246, 247, 248, 0.97);
  position: relative;
  overflow: hidden;
}
@media (min-width: 768px) {
  body.home #page #content #section-feature #features .feature-item {
    -ms-flex: 0 0 calc((100% -  20px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  20px ) /  2 );
    flex: 0 0 calc((100% -  20px ) /  2 );
  }
}
@media (max-width: 767px) {
  body.home #page #content #section-feature #features .feature-item {
    width: 100%;
  }
}
@media (min-width: 992px) {
  body.home #page #content #section-feature #features .feature-item {
    padding: 50px;
  }
}
@media (max-width: 991px) {
  body.home #page #content #section-feature #features .feature-item {
    padding: 50px 20px;
  }
}
body.home #page #content #section-feature #features .feature-item .content {
  position: relative;
  z-index: 1;
}
body.home #page #content #section-feature #features .feature-item .content .title {
  color: #4f90d9;
  font-size: 1.4em;
  letter-spacing: 1px;
  line-height: 1;
  text-shadow: 2px 2px 1px #ffffff;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  gap: 8px;
}
body.home #page #content #section-feature #features .feature-item .content .title .icon {
  color: #9ac0e9;
  font-size: 40px;
}
body.home #page #content #section-feature #features .feature-item .content .desc {
  margin-top: 50px;
}
body.home #page #content #section-feature #features .feature-item .content .links {
  margin-top: 20px;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  gap: 8px;
}
body.home #page #content #section-feature #features .feature-item .content .links a {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f9c50d;
  border-radius: 4px;
  background: transparent;
  color: #f9c50d;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  min-width: 160px;
}
:root.is-windows body.home #page #content #section-feature #features .feature-item .content .links a {
  font-weight: 500;
}
body.home #page #content #section-feature #features .feature-item .content .links a:hover,
body.home #page #content #section-feature #features .feature-item .content .links a:active {
  color: #ffffff;
}
body.home #page #content #section-feature #features .feature-item .content .links a:hover.arrow:after,
body.home #page #content #section-feature #features .feature-item .content .links a:active.arrow:after {
  opacity: 0.6;
}
body.home #page #content #section-feature #features .feature-item .content .links a.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.home #page #content #section-feature #features .feature-item .content .links a.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.home #page #content #section-feature #features .feature-item .content .links a.arrow:hover:after,
body.home #page #content #section-feature #features .feature-item .content .links a.arrow:active:after {
  opacity: 0.6;
}
body.home #page #content #section-feature #features .feature-item .content .links a:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #facb26;
  transition: all 0.4s;
  content: "";
}
body.home #page #content #section-feature #features .feature-item .content .links a:hover:before,
body.home #page #content #section-feature #features .feature-item .content .links a:active:before {
  width: 100%;
}
body.home #page #content #section-feature #features .feature-item .content .links a[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.home #page #content #section-feature #features .feature-item .content .links a .icon {
  color: rgba(249, 197, 13, 0.5);
}
body.home #page #content #section-feature #features .feature-item .content .links a:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.home #page #content #section-feature #features .feature-item .content .links a:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.home #page #content #section-feature #features .feature-item .content .links a:hover:after,
body.home #page #content #section-feature #features .feature-item .content .links a:active:after {
  opacity: 0.6;
}
body.home #page #content #section-feature #features .feature-item .big-icon {
  position: absolute;
  top: calc(50% -  110px );
  width: 220px;
  height: 220px;
  line-height: 220px;
  font-size: 220px;
  text-align: center;
  color: #ffffff;
}
body.home #page #content #section-feature #features .feature-item .big-icon.left {
  left: -66px;
}
body.home #page #content #section-feature #features .feature-item .big-icon.right {
  right: -66px;
}
body.home #page #content #section-feature #features .feature-item .big-icon.sway {
  animation: kf_SWAY 3s linear infinite normal both;
}
body.home #page #content #section-feature #features .feature-item .big-icon.spin {
  animation: kf_SPIN 20s linear infinite normal both;
}
body.home #page #content #section-feature #features .feature-item .big-icon .fa-stack {
  width: 1em;
  height: 1em;
  line-height: 1;
  vertical-align: unset;
  position: relative;
}
body.home #page #content #section-feature #features .feature-item .big-icon .fa-stack i {
  display: block;
}
body.home #page #content #section-feature #features .feature-item .big-icon .fa-stack i:first-of-type {
  width: 220px;
  height: 220px;
  line-height: 220px;
  font-size: 220px;
}
body.home #page #content #section-feature #features .feature-item .big-icon .fa-stack i:nth-of-type(2) {
  position: absolute;
  top: 22px;
  left: 22px;
  width: 176px;
  height: 176px;
  line-height: 176px;
  font-size: 176px;
  color: rgba(246, 247, 248, 0.97);
}
body.home #page #content #section-example #site-examples {
  margin-left: -50px;
  margin-right: -50px;
  padding-top: 50px;
  padding-bottom: 50px;
  background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, #9ac0e9;
}
@media (max-width: 991px) {
  body.home #page #content #section-example #site-examples {
    margin-left: -15px;
    margin-right: -15px;
  }
}
body.home #page #content #section-example #site-examples .example-inner {
  padding-left: 50px;
  padding-right: 50px;
}
@media (max-width: 991px) {
  body.home #page #content #section-example #site-examples .example-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (min-width: 992px) {
  body.home #page #content #section-example #site-examples .example-inner {
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
  }
}
@media (max-width: 575px) {
  body.home #page #content #section-example #site-examples .example-inner {
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
  }
}
@media (min-width: 992px) {
  body.home #page #content #section-example #site-examples .example-inner figure.example-item {
    -ms-flex: 0 0 calc((100% -  200px ) /  5 );
    -webkit-flex: 0 0 calc((100% -  200px ) /  5 );
    flex: 0 0 calc((100% -  200px ) /  5 );
    max-width: 250px;
  }
}
@media (max-width: 991px) and (min-width: 576px) {
  body.home #page #content #section-example #site-examples .example-inner figure.example-item {
    -ms-flex: 0 0 calc((100% -  100px ) /  3 );
    -webkit-flex: 0 0 calc((100% -  100px ) /  3 );
    flex: 0 0 calc((100% -  100px ) /  3 );
  }
}
@media (max-width: 575px) {
  body.home #page #content #section-example #site-examples .example-inner figure.example-item {
    -ms-flex: 0 0 calc((100% -  50px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  50px ) /  2 );
    flex: 0 0 calc((100% -  50px ) /  2 );
  }
}
body.home #page #content #section-example #site-examples .example-inner figure.example-item .image {
  width: 100%;
  height: 0;
  padding-top: 133.33333333%;
  position: relative;
}
body.home #page #content #section-example #site-examples .example-inner figure.example-item .image > * {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
body.home #page #content #section-example #site-examples .example-inner .example-more {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f4f8fc;
  border-radius: 4px;
  background: #9ac0e9;
  color: #f4f8fc;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  padding: 0.5em 0.7em !important;
  font-size: calc(1em - 2px) !important;
  letter-spacing: 0 !important;
}
:root.is-windows body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn {
  font-weight: 500;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:hover,
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:active {
  color: #ffffff;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:hover.arrow:after,
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:active.arrow:after {
  opacity: 0.6;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn.arrow:hover:after,
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn.arrow:active:after {
  opacity: 0.6;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #85b3e5;
  transition: all 0.4s;
  content: "";
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:hover:before,
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:active:before {
  width: 100%;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn .icon {
  color: rgba(244, 248, 252, 0.5);
}
@media (min-width: 576px) {
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn {
    min-height: 220px;
    writing-mode: vertical-rl;
    text-orientation: upright;
    letter-spacing: 2px !important;
  }
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:after {
    margin-top: 8px;
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f101" "";
    color: color-mix(in srgb, currentColor 50%, transparent);
  }
}
@media (max-width: 575px) {
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:after {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f061" "";
    font-size: 10px;
    vertical-align: 2px;
    margin-left: 0.3em;
    transition: opacity 0.4s;
  }
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:not(:is(:hover, :active)):after {
    animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
  }
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:hover:after,
  body.home #page #content #section-example #site-examples .example-inner .example-more .more-btn:active:after {
    opacity: 0.6;
  }
}
@media (min-width: 992px) {
  body.home #page #content #section-notice {
    background: url('../images/smapho-hands.png') bottom left / 30% auto no-repeat fixed;
  }
  body.home #page #content #section-notice .notice-container {
    padding-left: 40%;
  }
}
@media (min-width: 768px) {
  body.home #page #content #section-notice .article-list a.article-item:not(:first-child) {
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  body.home #page #content #section-notice .article-list a.article-item:not(:first-child) {
    margin-top: 50px;
  }
}
body.home #page #content #section-notice .article-list a.article-item .meta .meta-inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  align-items: baseline;
}
@media (min-width: 768px) {
  body.home #page #content #section-notice .article-list a.article-item .meta .meta-inner .date {
    -ms-flex: 0 0 150px;
    -webkit-flex: 0 0 150px;
    flex: 0 0 150px;
    font-size: calc(1em - 2px);
  }
}
@media (max-width: 767px) {
  body.home #page #content #section-notice .article-list a.article-item .meta .meta-inner {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    gap: 8px;
  }
}
body.home #page #content #section-notice .article-more {
  margin-top: 50px;
  text-align: center;
}
body.home #page #content #section-notice .article-more .more-btn {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f9c50d;
  border-radius: 4px;
  background: transparent;
  color: #f9c50d;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  padding: 0.5em 0.7em !important;
  font-size: calc(1em - 2px) !important;
  letter-spacing: 0 !important;
}
:root.is-windows body.home #page #content #section-notice .article-more .more-btn {
  font-weight: 500;
}
body.home #page #content #section-notice .article-more .more-btn:hover,
body.home #page #content #section-notice .article-more .more-btn:active {
  color: #ffffff;
}
body.home #page #content #section-notice .article-more .more-btn:hover.arrow:after,
body.home #page #content #section-notice .article-more .more-btn:active.arrow:after {
  opacity: 0.6;
}
body.home #page #content #section-notice .article-more .more-btn.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.home #page #content #section-notice .article-more .more-btn.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.home #page #content #section-notice .article-more .more-btn.arrow:hover:after,
body.home #page #content #section-notice .article-more .more-btn.arrow:active:after {
  opacity: 0.6;
}
body.home #page #content #section-notice .article-more .more-btn:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #facb26;
  transition: all 0.4s;
  content: "";
}
body.home #page #content #section-notice .article-more .more-btn:hover:before,
body.home #page #content #section-notice .article-more .more-btn:active:before {
  width: 100%;
}
body.home #page #content #section-notice .article-more .more-btn[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.home #page #content #section-notice .article-more .more-btn .icon {
  color: rgba(249, 197, 13, 0.5);
}
body.home #page #content #section-notice .article-more .more-btn:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.home #page #content #section-notice .article-more .more-btn:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.home #page #content #section-notice .article-more .more-btn:hover:after,
body.home #page #content #section-notice .article-more .more-btn:active:after {
  opacity: 0.6;
}
body.sub-page #page #content .subpage-head {
  padding: 20px 0;
  background: #f9c50d;
  height: 250px;
  position: relative;
}
body.sub-page #page #content .subpage-head #eyecatch {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
}
body.sub-page #page #content .subpage-head #eyecatch img {
  position: absolute;
  bottom: 0;
  right: 0;
}
@media (min-width: 992px) {
  body.sub-page #page #content .subpage-head #eyecatch img {
    width: auto;
    height: 200%;
  }
}
@media (max-width: 991px) {
  body.sub-page #page #content .subpage-head #eyecatch img {
    width: 65vw;
  }
}
body.sub-page #page #content .subpage-head .head-content {
  height: 100%;
  width: 1400px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 50px;
  padding-right: 50px;
  position: relative;
}
@media (max-width: 991px) {
  body.sub-page #page #content .subpage-head .head-content {
    padding-left: 15px;
    padding-right: 15px;
  }
}
body.sub-page #page #content .subpage-head .head-content .content-inner {
  height: 100%;
  animation: kf_FADEIN 0.8s linear 1 normal both;
  position: relative;
}
@media (max-width: 767px) {
  body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb {
    display: none;
  }
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 4px);
  line-height: 1;
  color: rgba(48, 48, 48, 0.8);
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item:not(:last-child):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f105" "";
  color: #fbdd71;
  margin: 0 8px;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a,
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:hover,
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:active,
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:visited,
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:focus {
  color: inherit;
  text-decoration: none;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a  {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:hover ,
body.sub-page #page #content .subpage-head .head-content .content-inner #breadcrumb .bc-inner .bc-item a:active  {
  text-decoration-color: rgba(48, 48, 48, 0.8) !important;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #page-title {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  width: 100%;
}
body.sub-page #page #content .subpage-head .head-content .content-inner #page-title .en {
  color: #fbdd71;
  font-family: webfont_GeoMatrix-light;
  font-size: 50px;
  letter-spacing: 2px;
  line-height: 0.8;
}
@media (max-width: 575px) {
  body.sub-page #page #content .subpage-head .head-content .content-inner #page-title .en {
    max-width: 250px;
  }
}
body.sub-page #page #content .subpage-head .head-content .content-inner #page-title .ja {
  margin-top: 8px;
  color: #404040;
  letter-spacing: 0.1em;
  text-shadow: 8px 8px 1px rgba(32, 32, 32, 0.07000000000000001);
  animation: kf_SLIDEIN_RIGHT 0.8s linear 1 normal both;
}
@media (max-width: 500px) {
  body.sub-page #page #content .subpage-head .head-content .content-inner #page-title .ja {
    text-shadow: 1px 0 1px #f9c50d, 0 1px 1px #f9c50d, -1px 0 1px #f9c50d, 0 -1px 1px #f9c50d, 1px 1px 1px #f9c50d, -1px 1px 1px #f9c50d, 1px -1px 1px #f9c50d, -1px -1px 1px #f9c50d;
  }
}
@media (min-width: 1400px) {
  body.sub-page #page #content .subpage-body.has-sidebar {
    position: relative;
  }
  body.sub-page #page #content .subpage-body.has-sidebar .page-content .section-inner {
    position: relative;
    left: -135px;
    width: 1130px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar .lead-to-contact .inner {
    position: relative;
    left: -135px;
    width: 1130px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container {
    position: absolute;
    top: 50px;
    right: calc(50vw -  700px );
    padding-right: 50px;
    width: 250px;
    z-index: 10;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 60px;
    font-size: calc(1em - 2px);
  }
  body.has-wp-adminbar body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 92px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 {
    font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    font-size: inherit;
    line-height: 1;
    padding-bottom: 8px;
    border-bottom: solid 1px rgba(136, 136, 136, 0.1);
    margin-bottom: 20px;
  }
  :root.is-windows body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 {
    font-weight: 500;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5:not(:first-child) {
    margin-top: 100px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5:has(.view-all) {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-between;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all {
    display: inline-block;
    padding: 4px 5px;
    border-radius: 3px;
    background: #4f90d9;
    color: rgba(255, 255, 255, 0.75) !important;
    font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    font-size: calc(1em - 4px);
    font-weight: normal;
    line-height: 1;
    vertical-align: 1px;
    transition: opacity 0.2s;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:hover,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:active,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:visited,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:focus {
    color: inherit;
    text-decoration: none;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:hover,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar h5 .view-all:active {
    opacity: 0.8;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item {
    display: block;
    line-height: 1.5;
    text-indent: -12px;
    padding-left: 12px;
    margin-bottom: 20px;
    transition: padding-left 0.4s;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:hover,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:active,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:visited,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:focus {
    color: inherit;
    text-decoration: none;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:before {
    font-family: FontAwesome;
    font-weight: normal;
    content: "" "\f105" " ";
    font-size: 13px;
    vertical-align: 1px;
    color: rgba(209, 215, 221, 0.7);
    transition: color 0.4s;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item.active:before {
    color: #fbdd71;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item:hover,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar #section-nav .nav-item.active {
    padding-left: 17px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar .latest-posts .article-list .article-item {
    margin-top: 1.8em;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar .latest-posts .article-list .article-item .date {
    display: block;
    font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    line-height: 1;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar .latest-posts .article-list .article-item .title {
    display: block;
    margin-top: 8px;
    line-height: 1.5;
  }
}
@media (min-width: 1400px) and (max-width: 782px) {
  body.has-wp-adminbar body.sub-page #page #content .subpage-body.has-sidebar #sidebar-container #sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 106px;
  }
}
@media (max-width: 1399px) {
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar {
    position: static !important;
    padding: 20px 0;
    background-image: -webkit-linear-gradient(bottom, #ffffff , #ffffff calc(100% - 10px), #f7f7f7);
    background-image: -moz-linear-gradient(bottom, #ffffff , #ffffff calc(100% - 10px), #f7f7f7);
    background-image: -ms-linear-gradient(bottom, #ffffff , #ffffff calc(100% - 10px), #f7f7f7);
    background-image: linear-gradient(to bottom, #ffffff , #ffffff calc(100% - 10px), #f7f7f7);
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar:not(:has(#section-nav)) {
    display: none;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner {
    width: 1400px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 50px;
    padding-right: 50px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
    gap: 20px;
    font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
    font-size: calc(1em - 2px);
    line-height: 1;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner > :not(:is(#section-nav, .head-section-nav)) {
    display: none;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner .head-section-nav {
    margin: 0;
    font-family: webfont_Leelawadee;
    font-size: inherit;
    color: #f9c50d;
    text-align: center;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 20px;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item:hover,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item:active,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item:visited,
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item:focus {
    color: inherit;
    text-decoration: none;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item:before {
    content: "- ";
    color: #f9c50d;
  }
}
@media (max-width: 1399px) and (max-width: 991px) {
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 1399px) and (max-width: 575px) {
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
  }
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav {
    width: 100%;
  }
}
@media (max-width: 1399px) and (max-width: 575px) {
  body.sub-page #page #content .subpage-body.has-sidebar #sidebar .sidebar-inner #section-nav .nav-item {
    -ms-flex: 0 0 calc((100% -  20px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  20px ) /  2 );
    flex: 0 0 calc((100% -  20px ) /  2 );
    text-align: left;
  }
}
@media (min-width: 992px) {
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section:not(:is(.section-yellow, .section-gray)):nth-of-type(2n+1) .section-inner {
    padding-right: 12%;
  }
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section:not(:is(.section-yellow, .section-gray)):nth-of-type(2n) .section-inner {
    padding-left: 12%;
  }
  body.sub-page #page #content .subpage-body .page-content section.section-pagewidth.section-content-narrow .section-inner {
    padding-left: 6%;
    padding-right: 6%;
  }
}
@media (min-width: 768px) {
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section + section:before {
    display: block;
    background: url('../images/bg-waves.png') bottom center / 100% auto no-repeat fixed, url('../images/glimpse-bg.jpg') center center / cover fixed;
    z-index: -1;
    content: "";
    margin-bottom: 100px;
  }
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section + section:nth-of-type(2n+1):before {
    margin-left: auto;
    mask: url('../images/brush-r.png') center center / 100% 100% no-repeat;
  }
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section + section:nth-of-type(2n):before {
    mask: url('../images/brush-l.png') center center / 100% 100% no-repeat;
  }
}
@media (min-width: 768px) and (min-width: 992px) {
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section + section:before {
    margin-top: -187.5px;
    height: 350px;
    width: 50%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  body.sub-page #page #content .subpage-body .page-content.section-zigzag section + section:before {
    margin-top: -162.5px;
    height: 250px;
    width: 90%;
  }
}
body.website-php #insert-001-pc {
  max-width: 280px;
}
body.website-php #insert-001-mobile {
  width: 270px;
  max-width: 70%;
}
body.website-php #insert-002-pc {
  margin-top: -40px !important;
  max-width: 170px;
}
body.website-php #insert-002-mobile {
  width: 160px;
  max-width: 40%;
}
body.website-php #insert-400-pc {
  max-width: 220px;
}
body.website-php #insert-server-mobile {
  width: 450px;
  max-width: 100%;
}
body.website-php #wordpress-logo,
body.website-php #eccube-logo {
  padding: 20px;
  background: rgba(209, 215, 221, 0.2);
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  gap: 20px;
}
@media (min-width: 768px) {
  body.website-php #wordpress-logo,
  body.website-php #eccube-logo {
    height: 100%;
  }
}
@media (max-width: 767px) {
  body.website-php #wordpress-logo,
  body.website-php #eccube-logo {
    margin: 0 auto;
    width: 300px;
  }
}
body.website-php #wordpress-logo .logo,
body.website-php #eccube-logo .logo {
  width: 200px;
  max-width: 100%;
}
body.website-php #wordpress-logo .link-btn,
body.website-php #eccube-logo .link-btn {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 4px);
  color: #303030 !important;
  margin: 0 2px;
}
body.website-php #wordpress-logo .link-btn,
body.website-php #eccube-logo .link-btn,
body.website-php #wordpress-logo .link-btn:hover,
body.website-php #eccube-logo .link-btn:hover,
body.website-php #wordpress-logo .link-btn:active,
body.website-php #eccube-logo .link-btn:active,
body.website-php #wordpress-logo .link-btn:visited,
body.website-php #eccube-logo .link-btn:visited,
body.website-php #wordpress-logo .link-btn:focus,
body.website-php #eccube-logo .link-btn:focus {
  color: inherit;
  text-decoration: none;
}
body.website-php #wordpress-logo .link-btn ,
body.website-php #eccube-logo .link-btn  {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
body.website-php #wordpress-logo .link-btn:hover ,
body.website-php #eccube-logo .link-btn:hover ,
body.website-php #wordpress-logo .link-btn:active ,
body.website-php #eccube-logo .link-btn:active  {
  text-decoration-color: #f9c50d !important;
}
body.website-php #wordpress-logo .link-btn:after,
body.website-php #eccube-logo .link-btn:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.website-php .price-list {
  border-collapse: separate !important;
  border-spacing: 0px;
  border-top: solid 1px #d9e7f6;
  border-left: solid 1px #d9e7f6;
  border-radius: 4px;
  min-width: 300px;
}
body.website-php .price-list td,
body.website-php .price-list th {
  border-width: 0 1px 1px 0 !important;
}
body.website-php .price-list > :first-child > tr:first-of-type > :first-child {
  border-top-left-radius: 4px;
}
body.website-php .price-list > :first-child > tr:first-of-type > :last-child {
  border-top-right-radius: 4px;
}
body.website-php .price-list > :last-child > tr:last-of-type > :first-child {
  border-bottom-left-radius: 4px;
}
body.website-php .price-list > :last-child > tr:last-of-type > :last-child {
  border-bottom-right-radius: 4px;
}
body.website-php .price-list th,
body.website-php .price-list td {
  border: solid 1px #d9e7f6;
  padding: 8px 0.7em;
  vertical-align: top;
}
body.website-php .price-list th,
body.website-php .price-list thead td,
body.website-php .price-list tfoot td {
  background: rgba(244, 248, 252, 0.5);
  font-weight: normal;
  letter-spacing: 1px;
}
body.website-php .price-list thead th,
body.website-php .price-list tfoot th,
body.website-php .price-list thead td,
body.website-php .price-list tfoot td {
  text-align: center;
}
body.website-php .price-list tbody td {
  background: rgba(255, 255, 255, 0.5);
}
body.website-php .price-list tbody td:last-child {
  text-align: right;
}
body.website-php .cost-list {
  border-collapse: separate !important;
  border-spacing: 0px;
  border-top: solid 1px #d9e7f6;
  border-left: solid 1px #d9e7f6;
  border-radius: 4px;
}
body.website-php .cost-list td,
body.website-php .cost-list th {
  border-width: 0 1px 1px 0 !important;
}
body.website-php .cost-list > :first-child > tr:first-of-type > :first-child {
  border-top-left-radius: 4px;
}
body.website-php .cost-list > :first-child > tr:first-of-type > :last-child {
  border-top-right-radius: 4px;
}
body.website-php .cost-list > :last-child > tr:last-of-type > :first-child {
  border-bottom-left-radius: 4px;
}
body.website-php .cost-list > :last-child > tr:last-of-type > :last-child {
  border-bottom-right-radius: 4px;
}
body.website-php .cost-list th,
body.website-php .cost-list td {
  border: solid 1px #d9e7f6;
  padding: 8px 0.7em;
  vertical-align: top;
}
body.website-php .cost-list th,
body.website-php .cost-list thead td,
body.website-php .cost-list tfoot td {
  background: rgba(244, 248, 252, 0.5);
  font-weight: normal;
  letter-spacing: 1px;
}
body.website-php .cost-list thead th,
body.website-php .cost-list tfoot th,
body.website-php .cost-list thead td,
body.website-php .cost-list tfoot td {
  text-align: center;
}
body.website-php .cost-list tbody td {
  background: rgba(255, 255, 255, 0.5);
}
body.website-php #about-domain {
  display: inline-block;
  border-radius: 10px;
  padding: 8px 20px;
  background: #f6f7f8;
  line-height: 1.5;
  word-break: break-all;
}
body.website-php #about-domain code {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  color: inherit;
}
body.website-php .fee-simulation .sim-inner {
  background: #facf35;
}
@media (min-width: 992px) {
  body.website-php #site-examples .example-inner figure.example-item {
    -ms-flex: 0 0 calc((100% -  100px ) /  3 );
    -webkit-flex: 0 0 calc((100% -  100px ) /  3 );
    flex: 0 0 calc((100% -  100px ) /  3 );
  }
}
@media (max-width: 991px) and (min-width: 576px) {
  body.website-php #site-examples .example-inner figure.example-item {
    -ms-flex: 0 0 calc((100% -  50px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  50px ) /  2 );
    flex: 0 0 calc((100% -  50px ) /  2 );
  }
}
@media (max-width: 575px) {
  body.website-php #site-examples .example-inner figure.example-item {
    width: 100%;
  }
}
body.website-php #site-examples .example-inner figure.example-item .image {
  width: 100%;
  height: 0;
  padding-top: 100%;
  position: relative;
}
body.website-php #site-examples .example-inner figure.example-item .image > * {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
body.website-php #other-site-links a {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  color: #303030 !important;
  margin: 0 2px;
}
body.website-php #other-site-links a,
body.website-php #other-site-links a:hover,
body.website-php #other-site-links a:active,
body.website-php #other-site-links a:visited,
body.website-php #other-site-links a:focus {
  color: inherit;
  text-decoration: none;
}
body.website-php #other-site-links a  {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
body.website-php #other-site-links a:hover ,
body.website-php #other-site-links a:active  {
  text-decoration-color: #f9c50d !important;
}
body.website-php #other-site-links a:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.website-php #movie-examples {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  gap: 50px;
}
@media (min-width: 991px) {
  body.website-php #movie-examples figure.example-item {
    width: 100%;
  }
}
@media (max-width: 767px) {
  body.website-php #movie-examples figure.example-item {
    width: 100%;
  }
}
body.website-php #movie-examples figure.example-item .video-embed {
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  position: relative;
}
body.website-php #movie-examples figure.example-item .video-embed > * {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
body.demosite-php .demo-sites {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 50px;
}
body.demosite-php .demo-sites figure.site-item {
  line-height: 1;
}
@media (min-width: 768px) {
  body.demosite-php .demo-sites figure.site-item {
    -ms-flex: 0 0 calc((100% -  50px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  50px ) /  2 );
    flex: 0 0 calc((100% -  50px ) /  2 );
  }
}
@media (max-width: 767px) {
  body.demosite-php .demo-sites figure.site-item {
    width: 100%;
  }
}
body.demosite-php .demo-sites figure.site-item figcaption {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em + 4px);
  font-weight: bold !important;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
}
:root.is-windows body.demosite-php .demo-sites figure.site-item figcaption {
  font-weight: 500;
}
body.demosite-php .demo-sites figure.site-item figcaption .view-btn {
  display: inline-block;
  padding: 4px 5px;
  border-radius: 3px;
  background: #4f90d9;
  color: rgba(255, 255, 255, 0.75) !important;
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: calc(1em - 4px);
  font-weight: normal;
  line-height: 1;
  vertical-align: 1px;
  transition: opacity 0.2s;
}
body.demosite-php .demo-sites figure.site-item figcaption .view-btn,
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:hover,
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:active,
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:visited,
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:focus {
  color: inherit;
  text-decoration: none;
}
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:hover,
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:active {
  opacity: 0.8;
}
body.demosite-php .demo-sites figure.site-item figcaption .view-btn:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.demosite-php .demo-sites figure.site-item .image {
  margin-top: 8px;
  width: 100%;
  height: 0;
  padding-top: 100%;
  position: relative;
  border: solid 1px #f5f5f5;
  box-shadow: 6px 8px 2px rgba(32, 32, 32, 0.07000000000000001);
}
body.demosite-php .demo-sites figure.site-item .image > * {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
body.demosite-php .demo-sites figure.site-item .image img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
  object-position: center top;
}
body.demosite-php .fee-simulation {
  margin-top: 50px;
}
body.demosite-php .fee-simulation .sim-inner {
  border: solid 1px rgba(136, 136, 136, 0.1);
}
body.demosite-php .fee-simulation .sim-inner .sim-options {
  display: none;
}
body.webapp-php #insert-001-pc {
  margin-top: -40px !important;
  max-width: 280px;
}
body.webapp-php #insert-001-mobile {
  width: 270px;
  max-width: 70%;
}
body.webapp-php #insert-002-pc {
  margin-top: -40px !important;
  max-width: 170px;
}
body.webapp-php #insert-002-mobile {
  width: 160px;
  max-width: 40%;
}
body.webapp-php #insert-100 {
  width: 400px;
}
body.webapp-php #system-categories {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 50px;
}
body.webapp-php #system-categories figure.cat-item {
  position: relative;
  padding-left: 20px;
}
@media (min-width: 768px) {
  body.webapp-php #system-categories figure.cat-item {
    -ms-flex: 0 0 calc((100% -  50px ) /  2 );
    -webkit-flex: 0 0 calc((100% -  50px ) /  2 );
    flex: 0 0 calc((100% -  50px ) /  2 );
  }
}
@media (max-width: 767px) {
  body.webapp-php #system-categories figure.cat-item {
    width: 100%;
  }
}
@media (min-width: 768px) {
  body.webapp-php #system-categories figure.cat-item .image {
    width: 100%;
    height: 0;
    padding-top: 40%;
    position: relative;
  }
  body.webapp-php #system-categories figure.cat-item .image > * {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
@media (max-width: 767px) {
  body.webapp-php #system-categories figure.cat-item .image {
    width: 100%;
    height: 0;
    padding-top: 50%;
    position: relative;
  }
  body.webapp-php #system-categories figure.cat-item .image > * {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
body.webapp-php #system-categories figure.cat-item .image img {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
}
body.webapp-php #system-categories figure.cat-item figcaption {
  position: absolute;
  top: 25%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  padding: 8px 20px;
  background: #4f90d9;
  color: #ffffff;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  line-height: 1.5;
  box-shadow: 4px 4px 2px rgba(32, 32, 32, 0.2);
}
:root.is-windows body.webapp-php #system-categories figure.cat-item figcaption {
  font-weight: 500;
}
body.webapp-php #system-categories figure.cat-item figcaption small {
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
body.notice-php .wo-pagination {
  -ms-flex-pack: end;
  -webkit-box-pack: end;
  justify-content: flex-end;
}
body.notice-php .wo-pagination:first-child {
  margin-bottom: 50px;
}
body.notice-php .wo-pagination:last-child {
  margin-top: 50px;
}
@media (min-width: 768px) {
  body.notice-php .section-inner .article-list a.article-item:not(:first-child) {
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  body.notice-php .section-inner .article-list a.article-item:not(:first-child) {
    margin-top: 50px;
  }
}
body.notice-php .section-inner .article-list a.article-item .meta .meta-inner {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  align-items: baseline;
}
@media (min-width: 768px) {
  body.notice-php .section-inner .article-list a.article-item .meta .meta-inner .date {
    -ms-flex: 0 0 180px;
    -webkit-flex: 0 0 180px;
    flex: 0 0 180px;
  }
  body.notice-php .section-inner .article-list a.article-item .meta .meta-inner .title {
    font-size: calc(1em + 2px);
  }
}
@media (max-width: 767px) {
  body.notice-php .section-inner .article-list a.article-item .meta .meta-inner {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    gap: 8px;
  }
}
body.wp-single-php .post-before {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
  gap: 20px;
}
body.wp-single-php .post-before #back-to-list {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #d1d7dd;
  border-radius: 4px;
  background: transparent;
  color: #808080;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
  padding: 0.5em 0.7em !important;
  font-size: calc(1em - 2px) !important;
  letter-spacing: 0 !important;
}
:root.is-windows body.wp-single-php .post-before #back-to-list {
  font-weight: 500;
}
body.wp-single-php .post-before #back-to-list:hover,
body.wp-single-php .post-before #back-to-list:active {
  color: #ffffff;
}
body.wp-single-php .post-before #back-to-list:hover.arrow:after,
body.wp-single-php .post-before #back-to-list:active.arrow:after {
  opacity: 0.6;
}
body.wp-single-php .post-before #back-to-list.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body.wp-single-php .post-before #back-to-list.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body.wp-single-php .post-before #back-to-list.arrow:hover:after,
body.wp-single-php .post-before #back-to-list.arrow:active:after {
  opacity: 0.6;
}
body.wp-single-php .post-before #back-to-list:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #8d8d8d;
  transition: all 0.4s;
  content: "";
}
body.wp-single-php .post-before #back-to-list:hover:before,
body.wp-single-php .post-before #back-to-list:active:before {
  width: 100%;
}
body.wp-single-php .post-before #back-to-list[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body.wp-single-php .post-before #back-to-list .icon {
  color: rgba(128, 128, 128, 0.5);
}
body.wp-single-php .post-before .post-meta {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
:root.is-windows body.wp-single-php .post-before .post-meta {
  font-weight: 500;
}
body.wp-single-php .post-before .post-meta .post-date:after {
  content: " 投稿";
}
body.wp-single-php h2.post-title {
  margin-top: 50px;
}
body.wp-single-php .post-pager {
  /**
    &:before, &:after {
        display: table;
        border-collapse: collapse;
        content: "";
    }
    &:after {
        clear: both;
    }
**/
}
@media (min-width: 768px) {
  body.wp-single-php .post-pager {
    margin-top: 160px;
  }
}
@media (max-width: 767px) {
  body.wp-single-php .post-pager {
    margin-top: 100px;
  }
}
body.wp-single-php .post-pager:after {
  display: block;
  clear: both;
  content: "";
}
body.wp-single-php .post-pager .nav-item {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  width: 50%;
  padding-top: 20px;
  line-height: 1.5;
}
body.wp-single-php .post-pager .nav-item.next {
  float: left;
}
body.wp-single-php .post-pager .nav-item.next .arrow {
  margin-right: 8px;
}
body.wp-single-php .post-pager .nav-item.prev {
  float: right;
  text-align: right;
  -ms-flex-pack: end;
  -webkit-box-pack: end;
  justify-content: flex-end;
}
body.wp-single-php .post-pager .nav-item.prev .arrow {
  margin-left: 8px;
}
body.wp-single-php .post-pager .nav-item a {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  font-family: "Yu Gothic UI", "Meiryo UI", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
}
body.wp-single-php .post-pager .nav-item a,
body.wp-single-php .post-pager .nav-item a:hover,
body.wp-single-php .post-pager .nav-item a:active,
body.wp-single-php .post-pager .nav-item a:visited,
body.wp-single-php .post-pager .nav-item a:focus {
  color: inherit;
  text-decoration: none;
}
body.wp-single-php .post-pager .nav-item a .title {
  text-decoration: underline dotted 1px transparent !important;
  text-underline-offset: 0.3em;
  transition: text-decoration-color 0.4s;
}
body.wp-single-php .post-pager .nav-item a:hover .title,
body.wp-single-php .post-pager .nav-item a:active .title {
  text-decoration-color: #5070d0 !important;
}
body.wp-single-php .post-pager .nav-item a .arrow {
  color: #d0d0d0;
  font-size: 18px;
  transition: color 0.2s;
}
body.wp-single-php .post-pager .nav-item a .date {
  color: rgba(48, 48, 48, 0.8);
  font-size: calc(1em - 4px);
}
body.wp-single-php .post-pager .nav-item a .title {
  margin-top: 2px;
  font-size: calc(1em - 2px);
}
body.wp-single-php .post-pager .nav-item a:hover .arrow {
  color: #808080;
}
body.contact-php #contact-form .require-mark:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f069" "";
  color: #f9c50d;
  font-size: 11px;
  vertical-align: 1px;
}
body.contact-php #contact-form .form-container {
  margin: 0 auto;
  width: 760px;
  max-width: 100%;
  border: solid 1px rgba(136, 136, 136, 0.1);
  border-radius: 10px;
  position: relative;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background: #fcfcfc;
  /**
            #opener {
                .COVER_PARENT;
                .FLEXBOX;
                .FLEX_CENTERING_X;
                .FLEX_CENTERING_Y;
                .FORM_BG;
                border-radius: @BORDER_RADIUS_LARGE;
                font-size: @FONT_SIZE_LARGER;
                color: @TEXT_COLOR_BRIGHT;
                cursor: pointer;
                z-index: 1;

                .icon {
                    font-size: 24px;
                    color: @SYMBOLIC_COLOR_GREEN;
                    margin-right: @MARGIN_TIGHT;
                }
            }
**/
}
:root.is-windows body.contact-php #contact-form .form-container {
  font-weight: 500;
}
@media (min-width: 768px) {
  body.contact-php #contact-form .form-container {
    padding: 30px 35px;
  }
}
@media (max-width: 767px) {
  body.contact-php #contact-form .form-container {
    padding: 20px;
  }
}
body.contact-php #contact-form .form-container form .row:not(:last-of-type) {
  margin-bottom: 20px;
}
body.contact-php #contact-form .form-container form .col-form-label {
  font-size: calc(1em - 2px);
  font-weight: bold;
}
@media (min-width: 992px) {
  body.contact-php #contact-form .form-container form .col-form-label {
    padding-top: 0.5em;
    text-align: right;
  }
}
@media (max-width: 991px) {
  body.contact-php #contact-form .form-container form .col-form-label {
    padding-top: 0;
  }
}
body.contact-php #contact-form .form-container form .form-control {
  border-color: rgba(136, 136, 136, 0.1);
}
body.contact-php #contact-form .form-container form .require .col-form-label:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f069" "";
  color: #f9c50d;
  font-size: 11px;
  vertical-align: 1px;
  margin-right: 3px;
}
body.contact-php #contact-form .form-container form input[name="name"],
body.contact-php #contact-form .form-container form input[name="corp"],
body.contact-php #contact-form .form-container form input[name="email"] {
  max-width: 400px;
}
body.contact-php #contact-form .form-container form .phone-inputter {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: start;
  -webkit-box-align: start;
  align-items: flex-start;
  width: 250px;
  max-width: 100%;
}
body.contact-php #contact-form .form-container form .phone-inputter input {
  text-align: center;
}
body.contact-php #contact-form .form-container form .phone-inputter .phone-bridge {
  margin: 18px 4px 0;
  -ms-flex: 0 0 8px;
  -webkit-flex: 0 0 8px;
  flex: 0 0 8px;
  height: 2px;
  background: #b0b0b0;
}
body.contact-php #contact-form .form-container form .error-baloon {
  color: #ec6f6f;
  font-size: calc(1em - 4px);
}
body.contact-php #contact-form .form-container form .agree-preface {
  font-size: calc(1em - 2px);
}
@media (min-width: 992px) {
  body.contact-php #contact-form .form-container form .agree-columns {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row-reverse;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    flex-direction: row-reverse;
    -ms-flex-pack: end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
  }
  body.contact-php #contact-form .form-container form .agree-columns .privacy-view-btn {
    margin-left: 100px;
  }
}
@media (max-width: 991px) {
  body.contact-php #contact-form .form-container form .agree-columns .privacy-view-btn {
    margin-bottom: 20px;
  }
}
body.contact-php #contact-form .form-container form #privacy-agree {
  display: inline-block;
  border: dashed 1px #b0b0b0;
  border-radius: 10px;
  padding: 8px 20px;
}
body.contact-php #contact-form .form-container form #privacy-agree,
body.contact-php #contact-form .form-container form #contact-submit {
  min-width: 250px;
}
body.contact-php #contact-form .form-container form #contact-submit .icon {
  font-size: 22px;
  vertical-align: -1px;
  margin-right: 8px;
}
body.contact-php #contact-form .form-container form #send-error {
  margin-top: 20px;
}
:root:not(.is-dev-env) body.contact-php #contact-form .form-container form #send-error .dbg-msg {
  display: none;
}
body.contact-php #contact-form .form-container #sending {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: 1;
  border-radius: 10px;
  background: rgba(252, 252, 252, 0.97);
}
@media (min-width: 768px) {
  body.contact-php #contact-form .form-container #sending {
    padding: 30px 35px;
  }
}
@media (max-width: 767px) {
  body.contact-php #contact-form .form-container #sending {
    padding: 20px;
  }
}
body.contact-php #contact-form .form-container #sending .sign {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  top: 100px;
  text-align: center;
  line-height: 1;
}
body.contact-php #contact-form .form-container #sending .sign .icon {
  color: #d1d7dd;
  font-size: 30px;
}
body.contact-php #contact-form .form-container #sending .sign .desc {
  margin-top: 8px;
  font-size: calc(1em - 4px);
}
body.contact-php #contact-form .form-container #thanks {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: 2;
  border-radius: 10px;
  background: #fcfcfc;
}
@media (min-width: 768px) {
  body.contact-php #contact-form .form-container #thanks {
    padding: 30px 35px;
  }
}
@media (max-width: 767px) {
  body.contact-php #contact-form .form-container #thanks {
    padding: 20px;
  }
}
body.contact-php #contact-form .form-container #thanks .icon {
  color: #d1d7dd;
  font-size: 45px;
  text-align: center;
  line-height: 1;
}
body.contact-php #contact-form .form-container #thanks .thanks-msg {
  margin-top: 20px;
}
body.contact-php #contact-form .form-container #thanks .thanks-close {
  margin-top: 100px;
  text-align: center;
}
body.about-me-php #business-summary {
  border-collapse: separate;
  border-spacing: 20px 50px;
  margin: -50px -20px;
}
body.about-me-php #business-summary,
body.about-me-php #business-summary * {
  border: none;
}
body.about-me-php #business-summary th,
body.about-me-php #business-summary td {
  padding: 0;
  vertical-align: top;
}
body.about-me-php #business-summary th {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-weight: bold !important;
  letter-spacing: 1px;
}
:root.is-windows body.about-me-php #business-summary th {
  font-weight: 500;
}
@media (max-width: 767px) {
  body.about-me-php #business-summary tr,
  body.about-me-php #business-summary th,
  body.about-me-php #business-summary td {
    display: block;
  }
  body.about-me-php #business-summary tr {
    margin-top: 50px;
  }
  body.about-me-php #business-summary > :first-child > tr:first-child {
    margin-top: 0;
  }
}
body.about-me-php #business-summary tbody th {
  min-width: 120px;
}
body.about-me-php #business-summary #skill-table {
  border-collapse: separate;
  border-spacing: 20px 8px;
  margin: -8px -20px;
}
body.about-me-php #business-summary #skill-table,
body.about-me-php #business-summary #skill-table * {
  border: none;
}
body.about-me-php #business-summary #skill-table th,
body.about-me-php #business-summary #skill-table td {
  padding: 0;
  vertical-align: top;
}
body.about-me-php #business-summary #skill-table th {
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-weight: bold !important;
  letter-spacing: 1px;
}
:root.is-windows body.about-me-php #business-summary #skill-table th {
  font-weight: 500;
}
@media (max-width: 767px) {
  body.about-me-php #business-summary #skill-table tr,
  body.about-me-php #business-summary #skill-table th,
  body.about-me-php #business-summary #skill-table td {
    display: block;
  }
  body.about-me-php #business-summary #skill-table tr {
    margin-top: 8px;
  }
  body.about-me-php #business-summary #skill-table > :first-child > tr:first-child {
    margin-top: 0;
  }
}
body._404-php #page-not-found {
  text-align: center;
}
body._404-php #page-not-found .icon {
  color: #ec6f6f;
  font-size: 50px;
  line-height: 1;
}
body._404-php #page-not-found .title {
  margin-top: 8px;
  color: #ec6f6f;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  font-size: 1.6rem;
  line-height: 1.1;
}
:root.is-windows body._404-php #page-not-found .title {
  font-weight: 500;
}
body._404-php #page-not-found .desc {
  display: inline-block;
  margin-top: 100px;
}
body._404-php #page-not-found .desc .in-wp-login {
  margin-top: 8px;
}
body._404-php #page-not-found .goto-home {
  margin-top: 100px;
}
body._404-php #page-not-found .goto-home a {
  display: inline-block;
  margin: 0;
  padding: 0.8em 1em;
  text-indent: 0;
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 1px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: solid 1px #f9c50d;
  border-radius: 4px;
  background: transparent;
  color: #f9c50d;
  font-family: "Yu Gothic", "Meiryo", "MS PGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Osaka, sans-serif;
  letter-spacing: 0;
  text-shadow: none;
  transition: box-shadow 0.4s, color 0.4s;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
:root.is-windows body._404-php #page-not-found .goto-home a {
  font-weight: 500;
}
body._404-php #page-not-found .goto-home a:hover,
body._404-php #page-not-found .goto-home a:active {
  color: #ffffff;
}
body._404-php #page-not-found .goto-home a:hover.arrow:after,
body._404-php #page-not-found .goto-home a:active.arrow:after {
  opacity: 0.6;
}
body._404-php #page-not-found .goto-home a.arrow:after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f061" "";
  font-size: 10px;
  vertical-align: 2px;
  margin-left: 0.3em;
  transition: opacity 0.4s;
}
body._404-php #page-not-found .goto-home a.arrow:not(:is(:hover, :active)):after {
  animation: kf_FIREFLY 0.8s ease-in-out infinite alternate both;
}
body._404-php #page-not-found .goto-home a.arrow:hover:after,
body._404-php #page-not-found .goto-home a.arrow:active:after {
  opacity: 0.6;
}
body._404-php #page-not-found .goto-home a:before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: #facb26;
  transition: all 0.4s;
  content: "";
}
body._404-php #page-not-found .goto-home a:hover:before,
body._404-php #page-not-found .goto-home a:active:before {
  width: 100%;
}
body._404-php #page-not-found .goto-home a[target="_blank"]:not(.external-link):not(:has(img)):after {
  font-family: FontAwesome;
  font-weight: normal;
  content: "" "\f35d" "";
  font-size: 12px;
  color: #d0d0d0;
  vertical-align: 1px;
  margin-left: 8px;
}
body._404-php #page-not-found .goto-home a .icon {
  color: rgba(249, 197, 13, 0.5);
}