@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Maru+Gothic&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP&family=Zen+Maru+Gothic&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Yuji+Syuku&display=swap");

:root {
    --text-color-01: #ee7800;
    --text-color-02: #f9f4ef;
    --text-color-03: #92b421;
    --text-color-04: #ffdf8f;
    --text-color-05: #ffc599;
    --text-color-06: #d0e075;
    --bg-color-01: #ee7800;
    --bg-color-02: #f9f4ef;
    --bg-color-03: #92b421;
    --bg-color-04: #ffdf8f;
    --bg-color-05: #ffc599;
    --bg-color-06: #d0e075;
    --btn-color-01: #ee7800;
    --btn-color-02: #f9f4ef;
    --btn-color-03: #92b421;
    --btn-color-04: #ffdf8f;
    --btn-color-05: #ffc599;
}

/*===================================
  基本設定
===================================*/
html {
    font-family: "Zen Maru Gothic", serif;
    font-weight: 400;
    font-size: 16px;
    color: #000;
    line-height: 1.5;
}

.list-inner {
    height: 100%;
}

.inner98\% {
    width: 98%;
    max-width: 98%;
    margin-left: auto;
    margin-right: auto;
}

/* PC・TB・SPで表示切替 */

.show\@tb {
    display: none;
}

.show\@pc {
    display: block;
}

.hide\@tb {
    display: block;
}

.hide\@pc {
    display: none;
}

@media (max-width: 1024px) {

    .hide\@tb {
        display: none;
    }

    .show\@tb {
        display: block;
    }
}

@media (max-width: 599px) {
    .hide\@sp {
        display: none;
    }

    .hide\@tb {
        display: none;
    }

    .show\@sp {
        display: block;
    }
}

.up-obp-bottom img {
    -o-object-position: center bottom;
    object-position: center bottom;
}

/* 改行 */
.reader1 {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reader2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;

    -webkit-line-clamp: 2;
}

.reader1to2 {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 599px) {
    .reader1to2 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        white-space: normal;

        -webkit-line-clamp: 2;
    }
}

/* セクションの区切り */
.bottom-arrow_01,
.bottom-arrow_02 {
    padding-top: 10vw;
    position: relative;
}

.bottom-arrow_01.ver02,
.bottom-arrow_02.ver02 {
    padding-top: 10vw;
    position: relative;
}

[class*="bottom-arrow"].-large-space {
    padding-top: 10vw;
}

.bottom-arrow_01 {
    /* margin-bottom: 7.5vw; */
    background-color: var(--bg-color-02);
}

.bottom-arrow_02 {
    margin-bottom: -7.5vw;
    padding-bottom: 7.5vw;
    background-color: white;
}

.bottom-arrow_01.-large-space {
    margin-bottom: 10vw;
}

.bottom-arrow_02.-large-space {
    margin-bottom: -10vw;
    padding-bottom: 10vw;
}

.bottom-arrow_01::after,
.bottom-arrow_02::after {
    content: "";
    width: 100%;
    height: 7.5vw;
    display: block;
    position: absolute;
    left: 0;
    z-index: 1;
}

.bottom-arrow_01::after {
    background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, var(--bg-color-02))) no-repeat top left/50% 100%,
        -webkit-gradient(linear, right bottom, left top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, var(--bg-color-02))) no-repeat top right/50% 100%;
    background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, var(--bg-color-02) 50.5%) no-repeat top left/50% 100%,
        linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, var(--bg-color-02) 50.5%) no-repeat top right/50% 100%;
    bottom: -7.5vw;
}

.bottom-arrow_02::after {
    background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, white)) no-repeat top left/50% 100%,
        -webkit-gradient(linear, right bottom, left top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, white)) no-repeat top right/50% 100%;
    background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, white 50.5%) no-repeat top left/50% 100%,
        linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, white 50.5%) no-repeat top right/50% 100%;
    bottom: 0;
}

.end-of-arrow_01 {
    padding: 7.5vw 0;
    background-color: var(--bg-color-02);
}

.end-of-arrow_02 {
    padding: 7.5vw 0;
    background-color: white;
}

@media(max-width:599px) {

    .bottom-arrow_01.ver02,
    .bottom-arrow_02.ver02 {
        padding-top: 0vw;
    }
}

.joint-img {
    margin: -10vw 0;
    position: relative;
    z-index: -1;
}

@media (max-width: 1024px) {
    .joint-img {
        margin: -15vw 0;
    }
}

/*===================================
  component.css
===================================*/

/* A-BiSUスライダー */
.main-visual .desktop-slide .uk-slidenav-position {
    height: 100%;
}

.main-visual .desktop-slide,
.main-visual .mobile-slide {
    height: 100%;
}

.main-visual .desktop-slide .uk-slideshow {
    height: 100% !important;
    overflow: hidden;
    position: relative;
}

.main-visual .desktop-slide .uk-slideshow::after {
    content: "";
    display: block;
    padding-top: 60%;
}

.main-visual .desktop-slide .uk-slideshow li {
    width: 100%;
    height: 100% !important;
    position: absolute;
    top: 0;
}

.main-visual .desktop-slide .uk-slideshow li>div {
    height: 100% !important;
}

.main-visual .desktop-slide .uk-slideshow img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    font-family: "object-fit: cover; object-position: center center;";
}

.uk-dotnav>*>* {
    width: 10px;
    height: 10px;
}

.uk-dotnav .uk-active>* {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.uk-dotnav li a:hover {
    opacity: 1;
}

.uk-dotnav-contrast>*>* {
    background: #ccc;
}

.uk-dotnav-contrast>.uk-active>* {
    background: #565656;
}

.uk-position-bottom {
    bottom: -30px;
}

@media (max-width: 599px) {
    .main-visual .uk-slideshow::after {
        padding-top: 140%;
    }
}

/* 背景に画像 */
.bg-parent {
    position: relative;
}

.bg-content {
    position: relative;
    z-index: 1;
}

.bg-content.orange {
    background-color: rgb(254 132 34 / 64%);
}

.bg-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.bg-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
}

/* テキストシャドウ text-shadow */
.text-shadow-color01 {
    text-shadow: 3px 3px 3px var(--text-color-01),
        -3px -3px 3px var(--text-color-01),
        -3px 3px 3px var(--text-color-01),
        3px -3px 3px var(--text-color-01),
        3px 0px 3px var(--text-color-01),
        -3px 0px 3px var(--text-color-01),
        0px 3px 3px var(--text-color-01),
        0px -3px 3px var(--text-color-01);
}

.text-shadow-color02 {
    text-shadow: 4px 4px 4px var(--text-color-03),
        -4px -4px 4px var(--text-color-03),
        -4px 4px 4px var(--text-color-03),
        4px -4px 4px var(--text-color-03),
        4px 0px 4px var(--text-color-03),
        -4px 0px 4px var(--text-color-03),
        0px 4px 4px var(--text-color-03),
        0px -4px 4px var(--text-color-03);
}

/* フォントサイズ font-size */
.fz180\% {
    font-size: 180%;
}

.fz150\% {
    font-size: 150%;
}

.fz120\% {
    font-size: 120%;
}

/* object-fit */
.up-obf-cover {
    -o-object-fit: cover;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .up-obf-cover\@tb {
        -o-object-fit: cover;
        object-fit: cover;
    }
}

@media (max-width: 599px) {
    .up-obf-cover\@sp {
        -o-object-fit: cover;
        object-fit: cover;
    }
}

/* 背景画像に丸をかさねたバナーデザイン */
.banner-container .bg-image img {
    -webkit-filter: contrast(0.5);
    filter: contrast(0.5);
}

.banner-container .bg-parent::before {
    content: "";
    width: 40%;
    height: 100%;
    display: block;
    border-radius: 0 350px 350px 0;
    background-color: rgba(117, 177, 169, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.banner-container.ver02 .bg-parent::before {
    background-color: rgba(158, 189, 175, 0.5);
}

.banner-container.ver03 .bg-parent::before {
    background-color: rgba(83, 112, 114, 0.5);
}

.banner-container.ver04 .bg-parent::before {
    background-color: rgba(151, 184, 194, 0.5);
}

@media (max-width: 599px) {
    .banner-container .bg-parent::before {
        width: 100%;
    }
}

.fead-order li.mv {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/*===================================
  下層で使用
===================================*/
.category-container .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 1em;
    border-bottom: 1px solid #ddd;
}

.category-container .item+.item {
    margin-top: 1em;
}

.category-container .item .title {
    width: 20%;
}

.category-container .item .list {
    width: 80%;
}

.category-container.form {
    padding: 30px;
    border: 3px solid var(--text-color-01);
    border-radius: 20px;
}

.list-category01 li {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 3px;
}

.list-category01 li a {
    width: 100%;
    height: 100%;
    display: block;
    padding: 0.25em 0.5em;
    color: var(--text-color-01);
    border: 1px solid var(--text-color-01);
    border-radius: 1em;
}

.list-category02-wrap {
    padding: 20px;
    border: 4px solid var(--text-color-03);
    border-radius: 1em;
    background-color: #fff;
}

.list-category02-wrap .title {
    margin-bottom: 1em;
    font-size: 20px;
    text-align: center;
}

.list-category02 li+li {
    margin-top: 0.5em;
}

.list-category02.ver02 li+li {
    margin-top: 0;
}

.list-category02.ver02 li {
    margin-bottom: 0.5em;
}

@media(max-width:599px) {
    .category-container .item .title {
        width: 100%;
        margin-bottom: 20px;
    }

    .category-container .item .list {
        width: 100%;
    }
}

/* ##### パンくずリスト breadcrumbs ##### */
.breadcrumbs {
    padding: 1em 0;
}

.breadcrumbs-list li {
    display: inline;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.breadcrumbs-list li.breadcrumbs-home,
.breadcrumbs-list li.breadcrumbs-prevpage,
.breadcrumbs-list li.breadcrumbs-thispage {
    font-size: 14px;
}

.breadcrumbs-list li.breadcrumbs-home,
.breadcrumbs-list li.breadcrumbs-prevpage {
    font-weight: bold;
}

.breadcrumbs-list li.breadcrumbs-thispage::before {
    content: "";
    width: 0.8em;
    height: 0.8em;
    display: inline-block;
    margin: 0 1em 0 0.5em;
    border-top: 2px solid;
    border-right: 2px solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.breadcrumbs-list li.breadcrumbs-prevpage a::before {
    content: "";
    width: 0.8em;
    height: 0.8em;
    display: inline-block;
    margin: 0 1em 0 0.5em;
    border-top: 2px solid;
    border-right: 2px solid;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.breadcrumbs a {
    display: inline;
}

/* ページネーション */
.pagenation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.pagenation li {
    width: 50px;
    height: 50px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 10px;
}

.pagenation li a,
.pagenation li .now {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 24px;
    text-align: center;
    border-radius: 10px;
}

.pagenation li.prev a::before,
.pagenation li.next a::before {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

.pagenation li.prev a::before {
    content: "\f104";
}

@media (max-width: 599px) {
    .pagenation li {
        width: 40px;
        height: 40px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        margin-right: 5px;
    }
}

/* newsblog_detail */
.newsblog_detail .category span {
    display: inline-block;
    margin: 0 3px;
    padding: 0.25em;
    font-size: 14px;
    color: #fff;
    border-radius: 0.25em;
    background-color: #119dd8;
}

/* voice_detail */
.papper-content-wrap .item+.item {
    margin-top: 1em;
}

.papper-content-wrap .item .q {
    margin-bottom: 0.5em;
    font-weight: bold;
    font-size: 18px;
}

/* works_detail */
.list-info {
    border: 2px solid #000;
}

.list-info li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 2px solid #000;
}

.list-info li:last-child {
    border-bottom: none;
}

.list-info .title {
    padding: 0.5em;
    font-size: 1.5em;
    color: #fff;
    text-align: center;
    background-color: var(--bg-color-01);
    width: 50%;
    border-right: 2px solid #000;
}

.list-info .content {
    padding: 1em;
    background-color: var(--bg-color-04);
    width: 50%;
}

.works_detail .date {
    margin: 1em 0;
    font-size: 1.5em;
}

.works_detail .img-wrap .before {
    position: relative;
}

.works_detail .img-wrap .before::before {
    content: "Before";
    display: block;
    font-weight: bold;
    font-size: 20px;
    color: #fff;
    text-shadow: 3px 3px 3px #ee7800,
        -3px -3px 3px #ee7800,
        -3px 3px 3px #ee7800,
        3px -3px 3px #ee7800,
        3px 0px 3px #ee7800,
        -3px 0px 3px #ee7800,
        0px 3px 3px #ee7800,
        0px -3px 3px #ee7800;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.works_detail .img-wrap .after {
    position: relative;
}

.works_detail .img-wrap .after::before {
    content: "After";
    display: block;
    font-weight: bold;
    font-size: 40px;
    color: #fff;
    text-shadow: 3px 3px 3px #ee7800,
        -3px -3px 3px #ee7800,
        -3px 3px 3px #ee7800,
        3px -3px 3px #ee7800,
        3px 0px 3px #ee7800,
        -3px 0px 3px #ee7800,
        0px 3px 3px #ee7800,
        0px -3px 3px #ee7800;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.works_detail_items .item+.item {
    margin-top: 30px;
}

.works_detail_items .subtitle {
    margin-bottom: 0.5em;
    font-size: 20px;
}

/* 「ブログ詳細ぺージ」見出し用CSS */
.detail-content h2 {
    margin: 1.5em 0 1em;
    padding: 0.2em 0.5em;
    font-weight: bold;
    font-size: clamp(1.375rem, 1.15rem + 0.97vw, 1.875rem);
    border-bottom: 2px solid var(--text-color-01);
}

.detail-content h3 {
    margin: 1.5em 0 1em;
    padding-left: 0.5em;
    font-weight: bold;
    font-size: clamp(1.25rem, 1.02rem + 0.97vw, 1.75rem);
    border-left: 10px solid var(--text-color-01);
}

.detail-content h4 {
    margin: 1.5em 0 1em;
    padding: 0.2em;
    font-weight: bold;
    font-size: clamp(1.125rem, 0.9rem + 0.97vw, 1.625rem);
    border-bottom: 2px dotted var(--text-color-01);
}

.detail-content ol {
    list-style: auto;
    list-style-position: outside;
    margin: 1em 0;
    padding-left: 2em;
}

.detail-content ul {
    list-style: inherit;
    list-style-position: outside;
    margin: 1em 0;
    padding-left: 2em;
}

/* お問い合わせフォームの基本 */

.contact-form input[type="text"],
.contact-form textarea {
    width: 100%;
    padding: 15px;
    border: 1px solid #bfbfbf;
    border-radius: 5px;
}

.contact-form textarea {
    height: 200px;
}

.contact-form dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.5em 0;
}

.contact-form dt {
    width: 25%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    font-weight: bold;
    font-size: 1.2em;
}

.contact-form dt .require-icon {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: inline-block;
    margin-left: 0.5em;
    padding: 1px 10px;
    font-size: 0.8em;
    color: #fff;
    border-radius: 5px;
    background-color: var(--bg-color-01);
}

.contact-form dd {
    width: 10%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.ten-form .contact-form dt {
    width: 35%;
}

.tenform-btn li {
    margin: 5px;
}

@media (max-width: 1024px) {
    .contact-form dl {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .contact-form dt,
    .contact-form dd {
        width: 100%;
    }

    .ten-form .contact-form dt {
        width: 100%;
    }

    .tenform-confirm .tenform-btn li {
        width: 48%;
        margin: 1%;
    }

    .tenform-confirm .tenform-btn li button {
        width: 100%;
        display: block;
        padding: 0.5em 1em;
        font-size: 1.25em;
        text-align: center;
    }
}

@media (max-width: 599px) {
    .contact-form dl {
        display: block;
    }

    .contact-form dt {
        width: 100%;
        -webkit-box-orient: initial;
        -webkit-box-direction: initial;
        -ms-flex-direction: initial;
        flex-direction: initial;
        -webkit-box-pack: initial;
        -ms-flex-pack: initial;
        justify-content: initial;
        margin-bottom: 0.5em;
        padding-left: 0;
        padding-right: 0;
    }

    .contact-form dd {
        width: 100%;
    }

    .contact-form input[type="text"],
    .contact-form textarea {
        padding: 10px;
        border-radius: 3px;
    }

    .tenform-confirm .tenform-btn li button {
        font-size: 1em;
    }
}

.tenform-confirm .ten-form .contact-form {
    padding: 1.5em;
    border-radius: 1em;
    background-color: rgba(255, 255, 255, 0.5);
}

/* .contact-item をつけることで解決*/
.contact-item.radiobtn dd {
    padding: 0.5em;
}

.contact-item.radiobtn dd label {
    display: inline-block;
    margin: 0.5em 0;
    padding: 0 10px 0 30px;
    position: relative;
}

.contact-item.radiobtn dd label::before {
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    border: 2px solid #dcdcdc;
    border-radius: 3px;
    background-color: white;
    position: absolute;
    top: 0;
    left: 0;
}

.contact-item.radiobtn dd label:hover {
    text-decoration: underline;
    cursor: pointer;
}

.contact-item.radiobtn dd input {
    display: none;
}

.contact-item.radiobtn dd input:checked+label {
    text-decoration: underline;
}

.contact-item.radiobtn dd input:checked+label::after {
    content: "\f00c";
    width: 0;
    height: 0;
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 20px;
    color: #ffc599;
    line-height: 1;
    background-color: transparent;
    position: absolute;
    top: -3px;
    left: 2px;
}

.contact-item.radiobtn dd input+label {
    margin-left: 15px;
}

@media (max-width: 599px) {
    .contact-item.radiobtn dd {
        padding: 0.5em 0;
    }
}

/*===================================
  共通デザイン
===================================*/
/* 背景色 */
.colorline {
    color: #06c755;
}

.coloryoutube {
    color: #f00;
}

.bgcwhite{
  background-color: #fff;
}

.bgc01 {
    background-color: var(--bg-color-01);
}

.color01 {
    color: var(--text-color-01);
}

.bgc02 {
    background-color: var(--bg-color-02);
}

.color02 {
    color: var(--text-color-02);
}

.bgc03 {
    background-color: var(--bg-color-03);
}

.color03 {
    color: var(--text-color-03);
}

.bgc04 {
    background-color: var(--bg-color-04);
}

.color04 {
    color: var(--text-color-04);
}

.bgc05 {
    background-color: var(--bg-color-05);
}

.color05 {
    color: var(--text-color-05);
}

.bgc06 {
    background-color: var(--bg-color-06);
}

.color06 {
    color: var(--text-color-06);
}

.bgc07 {
    background-color: var(--bg-color-07);
}

.color07 {
    color: var(--text-color-07);
}

.bgc08 {
    background-color: var(--bg-color-08);
}

.color08 {
    color: var(--text-color-08);
}

.bgc09 {
    background-color: var(--bg-color-09);
}

.color09 {
    color: var(--text-color-09);
}

.bgc10 {
    background-color: var(--bg-color-10);
}

.color10 {
    color: var(--text-color-10);
}

/*===================================
  btn
===================================*/
button {
    border: none;
}

.btn01 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.btn01 a,
.btn01 button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    overflow: hidden;
    padding: 0.75em 3em;
    font-size: 1.5em;
    color: #fff;
    border-radius: 2em;
    background-color: var(--bg-color-01);
}

.btn01.large-btn a,
.btn01.large-btn button {
    padding: 0.75em 4em;
    font-size: 1.5em;
    letter-spacing: 0.1em;
}

.btn01 a .btn-text,
.btn01 button .btn-text {
    margin-right: 10px;
}

.btn01 a .btn-icon,
.btn01 button .btn-icon {
    width: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.btn01.center {
    margin-left: auto;
    margin-right: auto;
}

.btn01.right {
    margin-left: auto;
}

.btn01.banner {
    min-width: 500px;
}

.btn01.banner02 {
    min-width: 600px;
}

.btn01.banner a {
    padding: 0 0 0 2em;
    position: relative;
}

.btn01.banner a .img-wrap {
    overflow: hidden;
    padding: 3em;
    padding: 0;
    border-radius: 0 1em 1em 0;
    position: relative;

    -webkit-clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
}

/* 戻るボタンver */
.btn01.back a,
.btn01.back button {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.btn01.back a .btn-text,
.btn01.back button .btn-text {
    margin-left: 10px;
    margin-right: 0;
}

.btn01.back a .btn-icon,
.btn01.back button .btn-icon {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media(max-width:1024px) {

    .btn01 a,
    .btn01 button {
        padding: 0.75em 1.5em;
        font-size: 1.25em;
    }

    .btn01.banner {
        min-width: 400px;
    }

    .btn01.banner a {
        padding: 0 0 0 1em;
    }

    .btn01.banner02 {
        min-width: 500px;
    }
}

@media(max-width:599px) {
    .btn01.banner {
        min-width: 100%;
        max-width: 100%;
    }

    .btn01.banner a {
        font-size: 1em;
    }

    .btn01.same {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .btn01.same a {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .btn01.same02 {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .btn01.same02 a {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .btn01.banner02 {
        width: 100%;
        min-width: auto;
    }

    .btn01.large-btn a,
    .btn01.large-btn button {
        padding: 0.75em 2em;
    }
}

/* .link-btn */
.link-btn01 {
    max-width: 700px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    border-radius: 0 50px 0 50px;
    background-color: #50d5f9;
}

.link-btn01 a {
    width: 100%;
    height: 100%;
    display: block;
}

.link-btn01 a .img-wrap {
    -webkit-clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
}

.link-btn01 a .content-wrap .btn-text {
    font-size: 40px;
    color: #fff;
    letter-spacing: 0.1em;
    text-align: center;
    position: relative;
}

.link-btn01 a .content-wrap .btn-text:after {
    content: "Click!";
    display: block;
    font-size: 60%;
    border-bottom: 4px double;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
    position: absolute;
    bottom: -20px;
    right: -30px;
    z-index: 1;
}

.link-btn01 a .content-wrap .btn-text .strong {
    font-size: 1.2em;
}

@media(max-width:599px) {
    .link-btn01 a .content-wrap .btn-text {
        font-size: 20px;
    }

    .link-btn01 a .content-wrap .btn-text:after {
        font-size: 16px;
    }
}

/*===================================
  title
===================================*/
.komidashi {
    margin-bottom: 20px;
    font-size: 2em;
}

.marker {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(65%, #fca95e));
    background: linear-gradient(transparent 65%, #fca95e 65%);
}

.marker02 {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(65%, #d0e075));
    background: linear-gradient(transparent 65%, #d0e075 65%);
}

.markerpink {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(65%, #f978ad));
    background: linear-gradient(transparent 65%, #f978ad 65%);
}

.markerblue {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(65%, #a8d6e3));
    background: linear-gradient(transparent 65%, #a8d6e3 65%);
}

.markerred {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(65%, rgb(238 59 0 / 50%)));
    background: linear-gradient(transparent 65%, rgb(238 59 0 / 50%) 65%);
}

.title01 {
    margin-bottom: 0.5em;
    font-size: 40px;
}

.title01 .marker {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(70%, #fca95e));
    background: linear-gradient(transparent 70%, #fca95e 70%);
}

.title01 .marker .main {
    font-weight: bold;
}

.title01 .marker .sub {
    font-weight: bold;
    font-size: 80%;
}

.title01.google {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 0 3em;
    padding: 1em 3em;
    font-size: 40px;
    line-height: 1;
    border-radius: 3em;
    background-color: white;
    position: relative;
}

.title01.google::before,
.title01.google::after {
    content: "";
    width: 2.5em;
    height: 2.5em;
    display: block;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 1.25em;
}

.title01.google::before {
    background-image: url(/upload/tenant_1/review_001.webp);
    left: 0;
}

.title01.google::after {
    background-image: url(/upload/tenant_1/review_002.webp);
    right: 0;
}

@media (max-width: 1024px) {
    .title01 {
        font-size: calc(40px * 0.8);
    }

    .title01.google {
        font-size: 28px;
    }

    .komidashi {
        font-size: 1.8em;
    }
}

@media(max-width:599px) {
    .title01 {
        font-size: calc(40px * 0.6);
    }

    .title01 .marker .main {
        font-size: 28px;
    }

    .title01 .marker .sub {
        font-size: 24px;
    }

    .komidashi {
        font-size: 1.5em;
    }
}

.title02 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    font-weight: bold;
    font-size: 52px;
    text-align: center;
    text-shadow: 1px 1px 0px white,
        -1px 1px 0px white,
        1px -1px 0px white,
        -1px -1px 0px white,
        1px 0px 0px white,
        0px 1px 0px white,
        -1px 0px 0px white,
        0px -1px 0px white;
    position: relative;
}

.title02::before {
    content: "";
    width: 7.5em;
    height: 2em;
    display: block;
    background-image: url(/upload/tenant_1/penki.webp);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.8;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    bottom: -0.5em;
    left: 50%;
    z-index: -1;
}

.title02.v-bigger::before {
    content: "";
    width: 7.5em;
    height: 4em;
    display: block;
    background-image: url(/upload/tenant_1/penki-orange370-removebg-preview.webp);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.8;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    bottom: -0.5em;
    left: 50%;
    z-index: -1;
}

.title02.mini {
    font-size: 24px;
}

.title02.tenform {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -2.5em;
    margin-left: auto;
    margin-right: auto;
    padding: 0.25em 1em;
    text-shadow: none;
    border: 3px solid var(--bg-color-01);
    border-radius: 2em;
    background-color: white;
    position: relative;
    font-size: 42px;
}

.title02.tenform::before {
    display: none;
}

.title02.tenform .balloon {
    display: block;
    line-height: 1;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
    position: absolute;
    top: -1.5em;
    left: -0.5em;
}

.title02.tenform .balloon .balloon-inner {
    padding: 0.25em 1em;
    font-size: 16px;
    color: white;
    border-radius: 1em;
    background-color: var(--bg-color-01);
    position: relative;
}

.title02.tenform .balloon .balloon-inner::after {
    content: "";
    width: 1em;
    height: 1.5em;
    display: inline-block;
    background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, var(--bg-color-01))) no-repeat top left/50% 100%,
        -webkit-gradient(linear, right bottom, left top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, var(--bg-color-01))) no-repeat top right/49.5% 100%;
    background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, var(--bg-color-01) 50.5%) no-repeat top left/50% 100%,
        linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, var(--bg-color-01) 50.5%) no-repeat top right/49.5% 100%;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-35deg);
    position: absolute;
    bottom: -1em;
    left: 2em;
}

@media(max-width:1024px) {
    .title02 {
        font-size: calc(52px * 0.8);
    }

    .title02.tenform {
        font-size: 30px;
    }

    .title02.tenform:before {
        font-size: 14px;
        left: 0;
    }
}

@media(max-width:599px) {
    .title02 {
        font-size: calc(52px * 0.6);
    }

    .title02.-mini {
        font-size: calc(52px * 0.5);
    }

    .title02.tenform {
        width: 100%;
        margin-top: -2.5em;
        font-size: 24px;
    }

    .title02.tenform:before {
        font-size: 12px;
        top: -30px;
        left: -40px;
    }
}

.title03 {
    font-weight: bold;
    font-size: 48px;
    color: #fff;
    text-shadow: 3px 3px 3px #ee7800, -3px -3px 3px #ee7800, -3px 3px 3px #ee7800,
        3px -3px 3px #ee7800, 3px 0px 3px #ee7800, -3px 0px 3px #ee7800,
        0px 3px 3px #ee7800, 0px -3px 3px #ee7800;
}

.title03.-mini {
    font-size: 3em;
}

@media (max-width: 1024px) {
    .title03 {
        font-size: 36px;
    }

    .title03.-mini {
        font-size: 2.5em;
    }
}

@media(max-width:599px) {
    .title03 {
        font-size: 28px;
    }
}

.title04 {
    font-weight: bold;
    font-size: 24px;
    text-align: center;
}

.title04 .titlein-01 {
    font-weight: 900;
    font-size: 30px;
    color: var(--text-color-01);
}

.title04 .titlein-02 {
    font-weight: 900;
    font-size: 30px;
}

.title05 {
    font-weight: bold;
    font-size: 36px;
}

.title05 .sub {
    display: block;
    font-weight: initial;
    font-size: 50%;
}

@media(max-width:599px) {
    .title05 {
        font-size: 28px;
    }
}

.title06 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0.25em 0.5em;
    font-size: 24px;
    color: #fff;
    border-radius: 1em;
    background-color: var(--bg-color-01);
}

.title06.gaiheki {
    background-color: #a8d6e3;
}

.title06.yane {
    background-color: rgba(252, 152, 61, 0.7);
}

@media(max-width:599px) {
    .title06 {
        width: 100%;
        text-align: center;
    }
}

.title07 {
    padding: 0.25em 0.5em;
    font-size: 24px;
    color: #fff;
    background-color: var(--bg-color-01);
}

.title08 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    font-size: 2em;
    font-weight: bold;
    margin-bottom: 1em;
    position: relative;
    line-height: 1.5;
    padding: 0.25em 1.5em;
    background-color: #b0c4de;
    border-radius: .5em;
}

.title08::after {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    position: absolute;
    bottom: 10px;
    left: 2em;
    -webkit-transform: translate(0, 100%) rotate(-25deg);
    transform: translate(0, 100%) rotate(-25deg);
    background: -webkit-gradient(linear, left bottom, right top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, #b0c4de)) no-repeat top left/50% 100%,
        -webkit-gradient(linear, right bottom, left top, color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50.5%, #b0c4de)) no-repeat top right/50% 100%;
    background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #b0c4de 50.5%) no-repeat top left/50% 100%,
        linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, #b0c4de 50.5%) no-repeat top right/50% 100%;
}

@media (max-width: 1024px) {
    .title08 {
        font-size: 1.8em;
    }
}

@media (max-width: 599px) {
    .title08 {
        font-size: 1.6em;
    }
}

/*===================================
  layer
===================================*/
.layer01 {
    position: relative;
}

.layer01::before {
    content: "";
    width: 80%;
    height: 260px;
    display: block;
    border-radius: 0 20px 20px 0;
    background-color: var(--bg-color-04);
    position: absolute;
    bottom: 10vw;
    left: 0;
    z-index: 0;
}

@media(max-width:599px) {
    .layer01::before {
        width: 90%;
        height: 90%;
    }
}

.layer01_02 {
    position: relative;
}

.layer01_02::before {
    content: "";
    width: 80%;
    height: 260px;
    display: block;
    border-radius: 20px 0 0 20px;
    background-color: var(--bg-color-06);
    position: absolute;
    bottom: 70px;
    right: 0;
    z-index: 0;
}

@media(max-width:599px) {
    .layer01_02::before {
        content: "";
        width: 80%;
        height: 1530px;
        display: block;
        display: none;
        border-radius: 20px 0 0 20px;
        background-color: var(--bg-color-06);
        position: absolute;
        bottom: -25px;
        right: 0;
        z-index: 0;
    }
}

.layer02 {
    position: relative;
}

.layer02::before {
    content: "";
    width: 98%;
    height: 545px;
    display: block;
    border-radius: 20px 0 0 20px;
    background-color: var(--bg-color-05);
    position: absolute;
    bottom: 35px;
    right: 0;
    z-index: 0;
}

.layer02_02 {
    position: relative;
}

.layer02_02::before {
    content: "";
    width: 92%;
    height: 400px;
    display: block;
    border-radius: 20px 0 0 20px;
    background-color: var(--bg-color-05);
    position: absolute;
    bottom: 35px;
    right: 0;
    z-index: 0;
}

.list-bg-color-05 {
    padding: 2em;
    border-radius: 1.5em;
    background-color: var(--bg-color-05);
}

@media(max-width:1024px) {
    .layer02::before {
        height: 700px;
        top: 0;
        bottom: auto;
    }
}

@media(max-width:599px) {
    .layer02::before {
        height: 760px;
        top: auto;
        bottom: 0;
    }

    .layer02_02::before {
        height: 720px;
        bottom: 0;
    }
}

.layer03 {
    position: relative;
}

.layer03 .layer03-in {
    position: relative;
    top: -30px;
}

.layer03::before {
    content: "";
    width: 200px;
    height: 500px;
    display: block;
    border-radius: 20px 0 0 20px;
    background-color: var(--bg-color-03);
    position: absolute;
    top: -50px;
    right: 0;
    z-index: 0;
}

.layer03_02 {
    position: relative;
}

.layer03_02 .layer03-in {
    position: relative;
    top: -30px;
}

.layer03_02::before {
    content: "";
    width: 200px;
    height: 430px;
    display: block;
    border-radius: 0 20px 20px 0;
    background-color: var(--bg-color-01);
    position: absolute;
    top: -50px;
    left: 0;
    z-index: 0;
}

.layer04 {
    position: relative;
}

.layer04 .layer04-in {
    position: relative;
    z-index: 1;
}

.layer04::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;

    -webkit-clip-path: polygon(50% 0%, 100% 50%, 100% 100%, 0 100%, 0 50%);
    clip-path: polygon(50% 0%, 100% 50%, 100% 100%, 0 100%, 0 50%);
}

@media(max-width:599px) {
    .layer04::before {
        -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 100%, 0 100%, 0 25%);
        clip-path: polygon(50% 0%, 100% 25%, 100% 100%, 0 100%, 0 25%);
    }
}


/*===================================
  ヘッダー・ナビ・フッター・MV
===================================*/
/* first-view */
.first-view {
    position: relative;
}

.lower .first-view {
    padding-bottom: 20px;
}

@media (max-width: 599px) {
    .first-view::before {
        width: 300px;
    }

    .lower .first-view {
        margin-bottom: 0;
        padding-bottom: 0;
    }
}

/* info-container */
.info-container {
    padding: 0.5em 0;
    background-color: white;
    position: relative;
    z-index: 3;
}

.info-container .info-container-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.info-container .logo-wrap {
    width: 20%;
    min-width: 290px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.info-container .info-wrap {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.info-container .info-wrap .open .span01 {
    margin-right: 1em;
    padding: 0 0.75em;
    color: #fff;
    border-radius: 20px;
    background-color: var(--bg-color-01);
}

.info-container .info-wrap .open .span02 {
    font-family: "Noto Sans JP", sans-serif;
}

.info-container .info-wrap .tel-wrap {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 900;
    font-size: 28px;
}

.info-container .info-wrap .tel-wrap .tel {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 900;
    font-weight: 900;
    font-weight: 300;
    font-size: 36px;
}

.info-container .info-wrap .tel-wrap .tel a {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 900;
}

.info-container .info-wrap .area {
    padding: 0 0.75em;
    font-size: 14px;
    color: #fff;
    background-color: var(--bg-color-03);
}

@media(max-width:1024px) {
    .info-container .logo-wrap {
        width: 45%;
    }

    .info-container .header-medal {
        width: 60%;
    }

    .info-container .info-wrap {
        display: none;
    }
}

@media (max-width: 599px) {
    .info-container .logo-wrap {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .info-container .logo-wrap .logo {
        width: 200px;
    }
}

/* mainvisual-container（トップページ） */
.index .mainvisual-container,
.index .mainvisual-content {
    position: relative;
}

.top-mainvisual .desktop-slide,
.top-mainvisual .mobile-slide {
    height: 100%;
}

.top-mainvisual .uk-slidenav-position {
    height: 100%;
}

.top-mainvisual .uk-slideshow {
    height: 100% !important;
    overflow: hidden;
    position: relative;
}

.top-mainvisual .uk-slideshow::after {
    content: "";
    display: block;
    padding-top: 35%;
}

.top-mainvisual .uk-slideshow li {
    width: 100%;
    height: 100% !important;
    position: absolute;
    top: 0;
}

.top-mainvisual .uk-slideshow li>div {
    height: 100% !important;
}

.top-mainvisual .uk-slideshow img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    font-family: "object-fit: cover; object-position: center center;";
}

.uk-dotnav>*>* {
    width: 10px;
    height: 10px;
}

.uk-dotnav .uk-active>* {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.uk-dotnav li a:hover {
    opacity: 1;
}

.uk-dotnav-contrast>*>* {
    background: #ccc;
}

.uk-dotnav-contrast>.uk-active>* {
    background: #565656;
}

.uk-position-bottom {
    bottom: -30px;
}

@media (max-width: 1024px) {
    .top-mainvisual .desktop-slide {
        height: 0;
        visibility: hidden;
    }

    .top-mainvisual .uk-slideshow::after {
        padding-top: 80%;
    }
}

@media (max-width: 599px) {
    .top-mainvisual .uk-slideshow::after {
        padding-top: 70vh;
    }
}

.index .mainvisual {
    width: 100%;
    height: 100%;
    margin: auto;
    opacity: 0.9;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 2;
}

.index .mainvisual .img {
    width: 100%;
    height: 100%;
}

.index .mainvisual-content {
    width: 100%;
    padding: 20vw 0 5vw;
    z-index: 2;
}

.index .mainvisual-content .catch {
    margin-top: 0.5em;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 900;
    font-weight: bold;
    font-size: 45px;
}

.info-container .list-medal-box {
    margin-left: auto;
    margin-right: auto;
}

.list-medal {
    max-width: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.list-medal li {
    width: 23%;
    max-width: 300px;
    margin: 1%;
}

.medal-box {
    position: relative;
}

.medal-img img {
    -webkit-filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.2));
}

.medal-content {
    margin: auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 900;
    font-size: 0.9em;
    text-align: center;
    text-shadow: white 2px 0px,
        white -2px 0px,
        white 0px -2px,
        white 0px 2px,
        white 2px 2px,
        white -2px 2px,
        white 2px -2px,
        white -2px -2px,
        white 1px 2px,
        white -1px 2px,
        white 1px -2px,
        white -1px -2px,
        white 2px 1px,
        white -2px 1px,
        white 2px -1px,
        white -2px -1px;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 45%;
    left: 0;
    right: 0;
    z-index: 1;
}

.medal-content .text {
    line-height: 1.2;
}

.medal-content .text-red {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 5vw;
    display: -ms-grid;
    display: grid;
    display: grid;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.2vw;
    color: red;
    line-height: 1;

    -ms-grid-columns: 2fr 3% 1fr;
    grid-template-columns: 2fr 1fr;
    -ms-grid-rows: 0.5fr 0% 1.5fr;
    grid-template-rows: 0.5fr 1.5fr;
    gap: 0% 3%;
    grid-template-areas: "left-top right"
        "left-bottom right";
}

.medal-content .text-red2 {
    font-size: 1.2vw;
    color: red;
    line-height: 1;
}

.medal-content .left-bottom {
    font-size: 140%;
    text-align: right;
    /* autoprefixer: ignore next */

    grid-area: left-bottom;
}

.medal-content .right {
    font-size: 200%;
    text-align: left;
    /* autoprefixer: ignore next */

    grid-area: right;
}

.medal-content .left-top {
    font-size: 50%;
    text-align: right;
    /* autoprefixer: ignore next */

    grid-area: left-top;
}

.medal-content .text-notice {
    font-size: 50%;
}

@media (max-width: 1024px) {
    .index .mainvisual-content {
        padding: 5vw 0;
    }

    .index .mainvisual-content .catch {
        margin-top: 7em;
        font-size: calc(40px * 0.8);
    }

    .list-medal {
        max-width: 70vw;
    }

    .medal-content {
        font-size: 1.4vw;
    }

    .medal-content .text-notice {
        font-size: 55%;
    }
}

@media (max-width: 599px) {
    .index .mainvisual-content {
        padding: 10vw 0;
    }

    .index .mainvisual-content [class*="inner"] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .index .mainvisual-content .catch {
        margin-top: 1em;
        margin-left: auto;
        margin-right: 1em;
        font-size: calc(40px * 0.6);
        -ms-writing-mode: tb-rl;
        -webkit-writing-mode: vertical-rl;
        writing-mode: vertical-rl;
    }

    .list-medal-box {
        width: 30%;
        max-width: 50%;
    }

    .list-medal {
        width: 100%;
        display: block;
    }

    .list-medal li {
        width: 98%;
    }

    .medal-content {
        font-size: 3.2vw;
    }

    .medal-content .text-red {
        width: 100%;
        font-size: 5vw;
    }

    .medal-content .text-red2 {
        font-size: 4.8vw;
    }
}

/* .mainvisual-container(下層) */
.lower .mainvisual-container {
    margin-top: 20px;
    position: relative;
}

.lower .mainvisual-container .main-visual {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
}

.lower .mainvisual-container::before {
    content: none;
}

.lower .mainvisual-container .catch-copy {
    width: 100%;
    margin: auto;
    font-weight: bold;
    font-size: 3em;
    color: var(--text-color-01);
    text-shadow: 2px 2px 0px white,
        -2px 2px 0px white,
        2px -2px 0px white,
        -2px -2px 0px white,
        2px 0px 0px white,
        0px 2px 0px white,
        -2px 0px 0px white,
        0px -2px 0px white;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
}

.lower .mainvisual-container .catch-copy .main .span01 {
    letter-spacing: 0.1em;
}

@media(max-width:1024px) {
    .lower .mainvisual-container .catch-copy {
        font-size: 2.5em;
    }
}

@media(max-width:599px) {
    .mainvisual-container .catch-copy {
        position: absolute;
    }

    .lower .mainvisual-container .catch-copy {
        font-size: 2em;
        line-height: 1.2;
        text-shadow: 1px 1px 0px white,
            -1px 1px 0px white,
            1px -1px 0px white,
            -1px -1px 0px white,
            1px 0px 0px white,
            0px 1px 0px white,
            -1px 0px 0px white,
            0px -1px 0px white;
    }
}


h1 {
    font-size: 12px;
}

header {
    width: 100%;
    padding: 3em 0;
    -webkit-transition: padding 0.3s linear;
    transition: padding 0.3s linear;
    position: relative;
    z-index: 10;
}

.lower header {
    margin-top: 20px;
}

@media(max-width:1024px) {
    header {
        display: contents;
        padding: 0;
        z-index: 15;
    }

    .scrolled header {
        padding: 0;
    }
}

@media(max-width:599px) {
    header {
        margin-top: 0;
    }

    .lower header {
        margin-top: 0;
    }

    h1 {
        padding-right: 75px;
    }
}

/* ナビ */
nav {
    padding-top: 0.75em;
    padding-bottom: 0.75em;
    border-radius: 1em;
    background-color: var(--bg-color-02);
}

.list-gnav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.list-gnav li {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    border-left: 2px solid var(--text-color-01);
}

.list-gnav li a {
    width: 100%;
    height: 100%;
    display: block;
    padding: 0.5em 0;
}

.list-gnav li.first {
    border-left: none;
}

.list-gnav li:last-child {
    border-right: 2px solid var(--text-color-01);
}

@media (max-width: 1024px) {
    nav {
        width: 50%;
        height: 100vh;
        display: block;
        padding: 50px;
        border-radius: initial;
        background-color: var(--bg-color-02);
        -webkit-transition: right ease 0.5s;
        transition: right ease 0.5s;
        position: fixed;
        top: 0;
        right: -90%;
        z-index: 250;
    }

    .drawer-active nav {
        right: 0;
    }

    body.drawer-active {
        overflow: hidden;
        -ms-touch-action: none;
        touch-action: none;
    }

    .list-gnav {
        height: 100%;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        display: block;
        margin-top: 0;
    }

    .list-gnav li {
        margin-bottom: 1em;
        font-size: 16px;
        color: #493a37;
        text-align: left;
        border-left: none;
    }

    .list-gnav li.sns {
        font-size: 30px;
    }

    .list-gnav li:last-child {
        border-right: none;
    }

    .list-gnav .logo-wrap {
        color: #493a37;
    }
}

@media (max-width: 599px) {
    nav {
        width: 90%;
    }
}

/* ナビ（固定された時） */
.fixed header {
    position: fixed;
    top: 0;
    left: 0;
}

.scrolled header {
    padding: 1em 0;
}

.fixed header nav {
    -webkit-box-shadow: 0px 0px 15px -5px #777;
    box-shadow: 0px 0px 15px -5px #777;
}

/* .fixed .gnav {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: var(--bg-color-02);
    position: fixed;
    top: 0;
    left: 0;
} */

/* .fixed .gnav .list-gnav {
    margin-top: 0;
    color: #493a37;
}

.fixed .gnav .list-gnav .drop-menu-item a {
    color: #fff;
    background-color: var(--bg-color-01);
}

.fixed .gnav .list-gnav li:nth-child(2) {
    border-left: none;
}

.fixed .gnav .list-gnav li:last-child {
    border-right: none;
} */

/* ナビ（ドロップダウンメニュー） */
.drop-menu {
    position: relative;
}

.drop-menu-list {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1;
}

.drop-menu:hover .drop-menu-list {
    visibility: visible;
    padding-top: 1em;
    opacity: 1;
    -webkit-transition: opacity 0.3s, visibility 0.3s;
    transition: opacity 0.3s, visibility 0.3s;
}

.drop-menu:hover .drop-menu-list li a {
    padding: 0.5em 1em;
    color: #fff;
    background-color: var(--bg-color-01);
}

.drop-menu:hover .drop-menu-list li a:hover {
    opacity: 0.8;
}

.list-gnav .drop-menu-list li {
    text-align: left;
    border-left: none;
}

.list-gnav .drop-menu-list li:last-child {
    border-right: none;
}

@media (max-width: 1024px) {
    .drop-menu-list {
        visibility: visible;
        margin-top: 1em;
        opacity: 1;
        position: initial;
    }

    .drop-menu .drop-menu-list li a {
        padding: 0.5em 0;
    }

    .drop-menu:hover .drop-menu-list li a {
        padding: 0.5em 0;
        color: #000;
        background-color: transparent;
    }

    .drop-menu:hover .drop-menu-list {
        padding-top: 0;
    }
}

/* トグル */
.toggle {
    width: 70px;
    height: 30px;
    display: none;
    cursor: pointer;
    position: fixed;
    top: 5px;
    right: 5px;
    z-index: 260;
    background-color: rgba(255,255,255,0.5);
}

.toggle .bar {
    width: 60px;
    height: 2px;
    display: block;
    margin-top: -1px;
    padding: 0;
    text-indent: 9999px;
    background: #583822;
    -webkit-transition: ease 0.4s;
    transition: ease 0.4s;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.toggle .bar:before {
    content: "";
    width: 60px;
    height: 2px;
    display: block;
    background: #583822;
    position: absolute;
    top: -5px;
    left: 0;
}

.toggle .bar:after {
    content: "";
    width: 50px;
    height: 2px;
    display: block;
    background: #583822;
    position: absolute;
    top: 5px;
    right: 0;
}

.drawer-active .toggle .bar {
    background-color: transparent;
}

.drawer-active .toggle .bar:before {
    -webkit-transition: top 300ms 50ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease,
        -webkit-transform 300ms 350ms ease;
    -webkit-transform: rotate(20deg);
    transform: rotate(20deg);
    top: 0;
    left: 0;
}

.drawer-active .toggle .bar:after {
    width: 60px;
    -webkit-transition: top 300ms 50ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease, -webkit-transform 300ms 350ms ease;
    transition: top 300ms 50ms ease, transform 300ms 350ms ease,
        -webkit-transform 300ms 350ms ease;
    -webkit-transform: rotate(-20deg);
    transform: rotate(-20deg);
    top: 0;
    left: 0;
}

@media (max-width: 1024px) {
    .toggle {
        display: block;
    }
}

/* オーバーレイ */
.overlay {
    width: 100%;
    height: 100vh;
    display: none;
    background-color: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 200;
}

.drawer-active .overlay {
    display: block;
}

/* フッター */
.map {
    overflow: hidden;
    padding-top: 35%;
    position: relative;
}

footer {
    position: relative;
}

.foot-info.layer04::before {
    -webkit-clip-path: polygon(50% 0%, 100% 30%, 100% 100%, 0 100%, 0 30%);
    clip-path: polygon(50% 0%, 100% 30%, 100% 100%, 0 100%, 0 30%);
}

.foot-info .tel-wrap {
    font-size: 18px;
    text-align: center;
}

.foot-info .tel-wrap .tel {
    font-family: "Noto Sans JP", sans-serif;
    font-family: メイリオ, Meiryo, "ヒラギノ角ゴシック", "Hiragino Sans", sans-serif;
    font-weight: bold;
    font-size: 2em;
}

.foot-info .open {
    font-size: 1.5em;
    text-align: center;
}

.foot-info .open .span01 {
    margin-right: 1em;
    padding: 0 0.5em 0.1em 0.5em;
    font-size: 80%;
    color: #fff;
    border-radius: 20px;
    background-color: var(--bg-color-01);
}

.foot-info .open .span02 {
    font-family: "Noto Sans JP", sans-serif;
}

.foot-info .open .span03 {
    font-size: 12px;
}

.foot-info .area {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0.75em 0.1em 0.75em;
    font-size: 0.8em;
    color: #fff;
    background-color: var(--bg-color-03);
}

.foot-info .list-sns li {
    margin: 10px;
}

.foot-info .list-sns li a,
.foot-info .list-sns li i {
    width: 1em;
    height: 1em;
    display: block;
    line-height: 1;
}

.foot-info .list-sns li i::before {
    line-height: 1;
}

.foot-nav {
    color: #fff;
}

.foot-nav .title {
    margin-bottom: 0.75em;
    font-weight: bold;
    font-size: 18px;
}

.foot-nav .list {
    padding-left: 1.5em;
    position: relative;
}

.foot-nav .list::before {
    content: "";
    width: 1px;
    height: 100%;
    display: block;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0.5em;
}

.foot-nav .list li {
    font-size: 14px;
    line-height: 1;
}

.foot-nav .list li.indent {
    padding-left: 2em;
}

.foot-nav .list li+li {
    margin-top: 0.5em;
}

.foot-nav .list li a {
    width: 100%;
    height: 100%;
    display: block;
}

.copyright {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    letter-spacing: 0.25em;
    text-align: center;
    background-color: var(--bg-color-03);
}

.lower footer .mini-banner-wrap a {
    text-decoration: none;
    cursor: default;
    pointer-events: none;
}

@media(max-width:599px) {
    .map {
        padding-top: 70%;
    }

    .foot-info .area {
        padding: 0.5em 0.75em 0.5em 0.75em;
        font-size: 0.8em;
    }

    .foot-info .list-sns li {
        margin: 0;
    }

    .logo-foot {
        max-width: 200px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* 追従ボタン */
.fixed-container {
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: fixed;
    top: 50%;
    right: 0;
    z-index: 10;
}

.fixed-btn {
    margin-bottom: 10px;
}

.fixed-btn a,
.fixed-btn>div {
    display: block;
    padding: 2em 1em;
    color: #fff;
    border-radius: 1em 0 0 1em;
    background-color: var(--bg-color-01);
}

.fixed-btn a .btn-text,
.fixed-btn>div .btn-text {
    font-size: 20px;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

.fixed-btn a .btn-icon,
.fixed-btn>div .btn-icon {
    width: 24px;
    margin-top: 0.5em;
    margin-left: auto;
    margin-right: auto;
}

.fixed-btn.contact:hover {
    cursor: pointer;
}

.fixed-btn.mitumori a {
    background-color: var(--bg-color-03);
}

.fixed-btn a .btn-text .add {
    display: none;
    font-size: 10px;
}

@media (max-width: 1024px) {
    .fixed-container {
        top: 60%;
    }
}

@media (max-width: 599px) {
    .fixed-container {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-transform: none;
        transform: none;
        top: auto;
        bottom: 0;
    }

    .fixed-container>div {
        width: 50%;
    }

    .fixed-container .fixed-btn.mitumori {
        width: 100%;
        height: 100%;
    }

    .fixed-container>div>div {
        height: 100%;
    }

    .fixed-btn {
        margin-bottom: 0;
    }

    .fixed-btn+.fixed-btn {
        margin-top: 0;
    }

    .fixed-btn a {
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -webkit-box-align: center;
        align-items: center;
        -ms-flex-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0.5em;
        border-top: 2px solid #fff;
        border-radius: 1em 1em 0 0;
    }

    .fixed-btn a .btn-text {
        -ms-writing-mode: initial;
        -webkit-writing-mode: initial;
        writing-mode: initial;
    }

    .fixed-btn.mitumori a .btn-text {
        font-size: 17px;
    }

    .fixed-btn a .btn-text .add {
        display: block;
        text-align: center;
    }

    .fixed-btn a .btn-icon {
        margin-top: 0;
        margin-left: 0;
        margin-right: 0.5em;
    }
}

/* 筆文字 */
.with-sign-img {
    position: relative;
}

.with-sign-img .sign-img {
    width: 80%;
    max-width: 200px;
    position: absolute;
    bottom: 0.5em;
    right: 0.5em;
    z-index: 1;
}

.with-sign-img .sign-img img {
    -webkit-filter: drop-shadow(1px 1px 1px rgba(255, 255, 255, 1));
    filter: drop-shadow(1px 1px 1px rgba(255, 255, 255, 1));
}

/*===================================
  container
===================================*/
.container01 {
    overflow: hidden;
    position: relative;
}

.container01 [class*="inner"] {
    position: relative;
    z-index: 2;
}

.container01 .content-wrap {
    width: 50%;
    margin: 80px 0;
    z-index: 1;
}

.container01 .content-wrap-in {
    padding: 3em 2em;
    border-radius: 1.5em;
    background-color: var(--bg-color-02);
}

.container01 .content-wrap .text-wrap {
    margin: auto;
    font-size: 22px;
    line-height: 2;
}

.container01 .img-wrap {
    width: 100%;
    height: 100%;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
}

.container01 .img-wrap .img-wrap-inner-list {
    height: 100%;
}

.container01 .img-wrap .img-wrap-inner-list li {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.container01.ver02 .content-wrap .text-wrap {
    font-size: 16px;
    line-height: 1.5;
}

.br30 {
    border-radius: 30px;
}

.br3em {
    border-radius: 3em;
}

.br100 {
    overflow: hidden;
    border-radius: 100%;
}

@media (max-width: 1024px) {
    .container01 .content-wrap {
        width: 80%;
        margin: 50px 0;
        position: static;
    }
}

@media(max-width:599px) {
    .container01 {
        height: auto;
    }

    .container01 .img-wrap {
        margin-top: 20px;
        -webkit-transform: none;
        transform: none;
        position: initial;
    }

    .container01.ver02 .img-wrap {
        margin-top: 0;
    }

    .container01 .content-wrap {
        width: 100%;
        position: initial;
    }

    .container01.ver02 .content-wrap {
        margin: 0;
    }

    .container01 .content-wrap-in {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        padding: 2em 1em;
    }

    .container01.ver02 .content-wrap-in {
        padding: 0 1em 2em 1em;
    }
}

/*===================================
  banner-container
===================================*/
/* .banner-container00 */
.banner-container00-in {
    border: 6px solid #27b1d6;
    background-color: #e9faff;
    position: relative;
}

.banner-container00-in a {
    width: 100%;
    height: 100%;
    display: block;
}

.banner-container00-in .img-wrap {
    position: relative;
}

.banner-container00-in .img-wrap .img-02 {
    position: absolute;
    bottom: 0;
}

.banner-container00-in .text-wrap {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 30px 40px 20px 40px;
    position: absolute;
    top: 0;
    left: 0;
}

.banner-container00-in .text-wrap .text-01 {
    font-size: 30px;
    text-align: center;
}

.banner-container00-in .text-wrap .text-01 .span01 {
    font-size: 1.2em;
    color: #fff;
    text-shadow: 3px 3px 3px #ee7800,
        -3px -3px 3px #ee7800,
        -3px 3px 3px #ee7800,
        3px -3px 3px #ee7800,
        3px 0px 3px #ee7800,
        -3px 0px 3px #ee7800,
        0px 3px 3px #ee7800,
        0px -3px 3px #ee7800;
}

.banner-container00-in .text-wrap .text-01 .span02 {
    font-size: 1.2em;
}

.banner-container00-in .text-wrap .text-02 {
    font-weight: bold;
    font-size: 20px;
    letter-spacing: 0.05em;
    text-align: center;
}

@media(max-width:1024px) {
    .banner-container00-in .text-wrap .text-01 {
        font-size: 18px;
    }

    .banner-container00-in .text-wrap .text-02 {
        font-size: 16px;
    }
}

@media(max-width:599px) {
    .banner-container00-in {
        padding-top: 80px;
    }

    .banner-container00-in .text-wrap {
        padding: 30px 0;
    }

    .banner-container00-in .img-wrap {
        -webkit-filter: opacity(0.5);
        filter: opacity(0.5);
    }
}

/* .banner-container01 */
.banner-container01 {
    position: relative;
}

.banner-container01 .banner-container01-in {
    padding: 1em 0;
    background-color: var(--bg-color-02);
    position: relative;
    z-index: 1;

    -webkit-clip-path: polygon(50% 0%, 100% 20%, 100% 100%, 0 100%, 0 20%);
    clip-path: polygon(50% 0%, 100% 20%, 100% 100%, 0 100%, 0 20%);
}

.banner-container01 .banner-container01-in.bigger {
    padding: 3em 0 1em 0;
}

.banner-container01.menu .banner-container01-in {
    padding: 50px;
}

.banner-container01 .btn .deco {
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 18px;
    color: var(--text-color-01);
    text-align: center;
}

.banner-container01 .btn.mitumori .deco {
    color: var(--text-color-03);
}

.banner-container01 .btn .link:hover {
    cursor: pointer;
}

.banner-container01 .btn a,
.banner-container01 .btn .link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    border-radius: 15px;
    background-color: var(--bg-color-01);
}

.banner-container01.ver02 .btn a,
.banner-container01.ver02 .btn .link {
    padding: 10px;
}

.banner-container01 .btn.mitumori a {
    background-color: var(--bg-color-03);
}

.banner-container01 .btn a .btn-text,
.banner-container01 .btn .link .btn-text {
    font-size: 40px;
}

.banner-container01.ver02 .btn a .btn-text,
.banner-container01.ver02 .btn .link .btn-text {
    font-size: 15px;
}

.banner-container01 .btn a .btn-icon,
.banner-container01 .btn .link .btn-icon {
    width: 35px;
    margin-left: 10px;
}

.banner-container01.ver02 .btn a .btn-icon {
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.banner-container01 .imgwrap01 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.banner-container01 .imgwrap02 {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}

.banner-container01.ver02 .omakase-wrap .btn a .btn-text,
.banner-container01.ver02 .omakase-wrap .btn .link .btn-text {
    font-size: 40px;
}

@media(max-width:1024px) {
    .banner-container01 .banner-container01-in {
        -webkit-clip-path: polygon(50% 0%, 100% 15%, 100% 100%, 0 100%, 0 15%);
        clip-path: polygon(50% 0%, 100% 15%, 100% 100%, 0 100%, 0 15%);
    }

    .banner-container01 .btn a .btn-text,
    .banner-container01 .btn .link .btn-text {
        font-size: 35px;
    }

    .banner-container01 .btn a .btn-text {
        font-size: 30px;
    }

    .banner-container01.ver02 .omakase-wrap .btn a .btn-text,
    .banner-container01.ver02 .omakase-wrap .btn .link .btn-text {
        font-size: 35px;
    }

    .banner-container01 .btn.mitumori a {
        padding: 0.25em;
    }

    .banner-container01.ver02 .omakase-wrap .btn a,
    .banner-container01.ver02 .omakase-wrap .btn .link {
        padding: 10px;
    }

    .banner-container01.ver02 .omakase-wrap .btn a .btn-text,
    .banner-container01.ver02 .omakase-wrap .btn .link .btn-text {
        font-size: 30px;
    }
}

@media(max-width:599px) {
    .banner-container01 .banner-container01-in {
        padding: 40px 20px;

        -webkit-clip-path: polygon(50% 0%, 100% 5%, 100% 100%, 0 100%, 0 5%);
        clip-path: polygon(50% 0%, 100% 5%, 100% 100%, 0 100%, 0 5%);
    }

    .banner-container01.menu .banner-container01-in {
        padding: 75px 20px 20px 20px;
    }

    .banner-container01 .btn a .btn-text {
        padding: 0.5em;
        font-size: 24px;
        border-radius: 1em;
    }

    .banner-container01 .btn a .btn-icon,
    .banner-container01 .btn .link .btn-icon {
        margin-left: -10px;
    }

    .banner-container01 .btn.jcsb a .btn-text {
        margin-right: 1em;
    }

    .banner-container01.ver02 .omakase-wrap .btn a,
    .banner-container01.ver02 .omakase-wrap .btn .link {
        padding: .5em;
    }

    .banner-container01.ver02 .omakase-wrap .btn a .btn-text,
    .banner-container01.ver02 .omakase-wrap .btn .link .btn-text {
        font-size: 24px;
        padding: 4px 0;
    }
}

/* .banner-container02 */
.banner-container02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border: 10px solid var(--text-color-01);
    position: relative;
}

.banner-container02 .content-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 20px;
    position: relative;
    z-index: 1;
}

.banner-container02 .content-wrap .title {
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 20px;
    white-space: nowrap;
}

.banner-container02 .content-wrap .tel-wrap .tel2 {
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 600;
    font-size: 48px;
    position: relative;
}

.banner-container02 .content-wrap .tel-wrap .tel2 .ruby {
    width: 100%;
    font-family: "Zen Maru Gothic",
        serif;
    font-size: 14px;
    text-align: center;
    position: absolute;
    top: 0;
}

.banner-container02 .content-wrap .tel-wrap .time .span01 {
    margin-right: 0.5em;
    padding: 0.25em 0.5em;
    font-size: 14px;
    color: #fff;
    border-radius: 20px;
    background-color: var(--bg-color-01);
}

.banner-container02 .content-wrap .tel-wrap .time .span02 {
    font-family: "Noto Sans JP", sans-serif;
}

.banner-container02 .content-wrap .tel-wrap .time .span03 {
    font-size: 12px;
}

.banner-container02 .content-wrap .btn a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0.5em;
    padding: 0.5em 1em;
    font-size: 30px;
    color: #fff;
    border-radius: 20px;
    background-color: var(--bg-color-03);
}

.banner-container02 .content-wrap .btn a .btn-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-color: var(--bg-color-03);
}

.banner-container02 .content-wrap .btn a .btn-icon {
    width: 45px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 0.5em;
}

@media(max-width:1024px) {
    .banner-container02 .content-wrap .tel-wrap .tel {
        font-size: 30px;
    }

    .banner-container02 .content-wrap .btn {
        max-width: 450px;
        margin-top: 10px;
    }

    .banner-container02 .img-wrap {
        height: 100%;
        -webkit-filter: opacity(0.5);
        filter: opacity(0.5);
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        position: absolute;
        top: 50%;
        right: 0;
    }
}

@media(max-width:599px) {
    .banner-container02 .content-wrap .title {
        white-space: initial;
    }

    .banner-container02 .content-wrap .tel-wrap .tel2 {
        font-size: 34px;
    }

    .banner-container02 .content-wrap .tel-wrap .tel2 .ruby {
        font-size: 10px;
    }

    .banner-container02 .content-wrap .tel-wrap .time .span01 {
        font-size: 12px;
    }

    .banner-container02 .content-wrap .tel-wrap .time .span03 {
        font-size: 10px;
    }

    .banner-container02 .content-wrap .btn a {
        font-size: 18px;
    }
}

/* .banner-container03 */
.banner-container03-in a {
    width: 100%;
    height: 100%;
    display: block;
    border: 8px solid #d0e075;
    position: relative;
}

.banner-container03-in a .img-container {
    background-color: #d0e075;
}

.banner-container03-in a .img-container .img-wrap-01 {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-filter: opacity(0.5);
    filter: opacity(0.5);
}

.banner-container03-in a .img-container .img-wrap-01 li {
    width: calc(100% / 3);
}

.banner-container03-in a .text-container {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.banner-container03-in a .text-container .text-01 {
    margin: 5px 0;
    font-weight: bold;
    font-size: 36px;
    color: #fff;
    text-align: center;
    text-shadow: 3px 3px 1px #08470a,
        -3px 3px 1px #08470a,
        3px -3px 1px #08470a,
        -3px -3px 1px #08470a,
        3px 0px 1px #08470a,
        0px 3px 1px #08470a,
        -3px 0px 1px #08470a,
        0px -3px 1px #08470a;
}

.banner-container03-in a .text-container .text-01 .span01 {
    font-size: 1.2em;
}

.banner-container03-in a .text-container .text-02 li {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.banner-container03-in a .text-container .text-02 li div {
    padding: 0.25em 1em;
    font-size: 18px;
    color: #fff;
    letter-spacing: 0.25em;
    border-radius: 25px;
    background-color: #08470a;
}

.banner-container03-in a .text-container .text-02 li:last-child div {
    font-weight: bold;
    font-size: 18px;
    color: #000;
    letter-spacing: 0.25em;
    text-shadow: 1px 1px 1px #fff,
        -1px 1px 1px #fff,
        1px -1px 1px #fff,
        -1px -1px 1px #fff,
        1px 0px 1px #fff,
        0px 1px 1px #fff,
        -1px 0px 1px #fff,
        0px -1px 1px #fff;
    border-radius: none;
    background-color: transparent;
}

.banner-container03-in a .text-container .text-03 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    font-weight: bold;
    font-size: 18px;
    color: #785028;
    text-shadow: 1px 1px 1px #fff,
        -1px 1px 1px #fff,
        1px -1px 1px #fff,
        -1px -1px 1px #fff,
        1px 0px 1px #fff,
        0px 1px 1px #fff,
        -1px 0px 1px #fff,
        0px -1px 1px #fff;
}

.banner-container03-in a .text-container .text-04 {
    font-weight: bold;
    font-size: 18px;
    color: var(--text-color-01);
    text-shadow: 1px 1px 1px #fff,
        -1px 1px 1px #fff,
        1px -1px 1px #fff,
        -1px -1px 1px #fff,
        1px 0px 1px #fff,
        0px 1px 1px #fff,
        -1px 0px 1px #fff,
        0px -1px 1px #fff;
    position: absolute;
    bottom: -25px;
    right: 40px;
    z-index: 1;
}

.banner-container03-in a .text-container .btn {
    position: absolute;
    bottom: -35px;
    right: 0;
    z-index: 1;
}

.banner-container03-in a .text-container .arrow::before {
    content: "";
    width: 70px;
    height: 70px;
    display: block;
    background-color: var(--bg-color-01);
    position: absolute;
    bottom: -35px;
    right: -8px;
    z-index: 0;

    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

@media(max-width:1024px) {
    .banner-container03-in a .text-container .text-01 {
        font-size: 20px;
        text-shadow: 1px 1px 1px #08470a,
            -1px 1px 1px #08470a,
            1px -1px 1px #08470a,
            -1px -1px 1px #08470a,
            1px 0px 1px #08470a,
            0px 1px 1px #08470a,
            -1px 0px 1px #08470a,
            0px -1px 1px #08470a;
    }

    .banner-container03-in a .text-container .text-02 li div {
        font-size: 14px;
    }

    .banner-container03-in a .text-container .text-03 {
        margin-top: 0;
        font-size: 14px;
    }

    .banner-container03-in a .text-container .arrow::before {
        width: 50px;
        height: 50px;
    }
}

@media (max-width: 599px) {
    .banner-container03-in a .img-container {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
    }

    .banner-container03-in a .img-container .img-wrap-01 {
        height: 100%;
    }

    .banner-container03-in a .img-container .img-wrap-01 li {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

    .banner-container03-in a .text-container {
        height: 100%;
        padding: 0.5em;
        position: relative;
        z-index: 1;
    }
}

/* banner001 */
.banner001 {
    width: 100%;
    max-width: 800px;
    margin: 2em auto;
}

.banner001 a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    border: 2px solid var(--btn-color-01);
    border-radius: 1.5em;
    background-color: white;
}

.banner001 a .banner-content {
    width: calc(55% + ((100% * 0.45) * 0.20));
    margin-right: calc((-100% * 0.45) * 0.20);
    padding: 1.5em;
    padding-right: calc(((100% * 0.45) * 0.20) + 1.5em);
    position: relative;
}

.banner001 a .banner-content .banner-content-img {
    width: 40%;
    position: absolute;
    top: 0;
    right: 0;
}

.banner001 a .banner-content .banner-content-inner {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.banner001 a .banner-img {
    width: 45%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;

    -webkit-clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(20% 0%, 100% 0, 100% 100%, 0% 100%);
}

.banner001 a .banner-img .banner-img-inner {
    height: 100%;
}

.banner001 a .banner-content .banner-title {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.banner001 a .banner-content .banner-title .sub {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: inline-block;
    padding: 0.5em 2em;
    font-weight: bold;
    font-size: 120%;
    color: var(--text-color-01);
    line-height: 1;
    border-radius: 1.5em;
    background-color: #dcdcdc;
}

.banner001 a .banner-content .banner-title .main {
    display: block;
    margin: 0.25em 0;
    font-weight: bold;
    font-size: 2em;
    color: var(--text-color-01);
}

.banner001 a .banner-content .banner-title .main span {
    width: 1.25em;
    height: 1.25em;
    display: inline-block;
    margin: 1px;
    padding: 0.1em 0 0.1em 0.1em;
    line-height: 1;
    border: 1px solid var(--btn-color-01);
    background-color: white;
}

.banner001 a .banner-content .dammy-btn {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: auto;
    margin-left: auto;
    padding: 0.5em 2em;
    color: white;
    line-height: 1;
    border-radius: 0.5em;
    background-color: var(--bg-color-01);
    position: relative;
}

.banner001 a .banner-content .dammy-btn::after {
    content: "\f0a4";
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 120%;
    line-height: 1;
    position: absolute;
    top: 0.4em;
    right: 0.5em;
}

@media (max-width: 599px) {
    .banner001 a .banner-content {
        width: 100%;
        margin-right: 0;
        padding-right: 1.5em;
    }

    .banner001 a .banner-content .banner-title .main {
        font-size: 1.8em;
    }

    .banner001 a .banner-content .dammy-btn {
        margin-top: 0.5em;
        padding: 0.5em 2em 0.5em 1em;
        font-size: 0.8em;
    }

    .banner001 a .banner-img {
        width: 100%;

        -webkit-clip-path: none;
        clip-path: none;
    }
}

/* banner002 */
.banner002 {
    width: 100%;
    max-width: 1000px;
    margin: 50px 0;
    background-color: white;
}

.banner002 a {
    width: 100%;
    display: block;
    overflow: hidden;
    border-radius: 2em;
    position: relative;
}

.banner002 .banner002-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.banner002 .banner002-img .list-house {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.banner002 .banner002-img .list-house li {
    width: 20%;
    height: 50%;
    display: block;
    position: relative;
}

.banner002 .banner002-img .list-house li .img::after {
    content: "";
    display: block;
    padding-top: 100%;
}

.banner002 .banner002-img .list-house li .img img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    position: absolute;
    top: 0;
    left: 0;
}

.banner002 .banner002-content {
    width: 90%;
    height: 90%;
    margin: 5%;
    padding: 2em;
    border-radius: 2em;
    background-color: rgba(255, 255, 255, 0.65);
    position: relative;
    z-index: 1;
}

.list-housemaker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 1em 0;
    padding: 1em;
    border-radius: 1em;
    background-color: var(--bg-color-01);
}

.list-housemaker li {
    margin: 0.25em 0.5em;
    font-weight: bold;
    font-size: 1.2em;
    color: white;
}

.upper-text,
.bottom-text {
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシック", "Hiragino Sans", sans-serif;
    font-weight: bold;
    font-weight: bold;
    font-size: 1.55em;
    text-align: center;
    text-shadow: 1px 1px 0px white,
        -1px 1px 0px white,
        1px -1px 0px white,
        -1px -1px 0px white,
        1px 0px 0px white,
        0px 1px 0px white,
        -1px 0px 0px white,
        0px -1px 0px white;
}

@media (max-width: 1024px) {

    .upper-text,
    .bottom-text {
        font-size: 1.25em;
    }
}

@media (max-width: 599px) {
    .banner002 .banner002-content {
        padding: 2em 1em;
    }

    .banner002 .banner002-content {
        margin: 10% 5%;
    }

    .banner002 .banner002-img .list-house li {
        width: 50%;
        height: 20%;
    }

    .list-housemaker {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .list-housemaker li {
        font-size: 1em;
    }

    .upper-text,
    .bottom-text {
        font-size: 1em;
    }
}

/* banner003 */
.banner003 {
    width: 100%;
    max-width: 1000px;
    margin-top: 50px;
    border-radius: 2em;
    background-color: white;
}

.banner003 a {
    width: 100%;
    display: block;
    overflow: hidden;
    border-radius: 2em;
    position: relative;
}

.banner003 .banner003-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.banner003 .banner003-img .img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    position: absolute;
    top: 0;
    left: 0;
}

.banner003 .banner003-content {
    width: 90%;
    height: 90%;
    margin: 5%;
    padding: 2em;
    border-radius: 2em;
    background-color: rgba(255, 255, 255, 0.65);
    position: relative;
    z-index: 1;
}

.banner003-title {
    margin-bottom: 0.5em;
    font-family: メイリオ, Meiryo, "ヒラギノ角ゴシック", "Hiragino Sans", sans-serif;
    font-weight: bold;
    font-size: 1.75em;
    text-align: center;
    text-shadow: 1px 1px 0px white,
        -1px 1px 0px white,
        1px -1px 0px white,
        -1px -1px 0px white,
        1px 0px 0px white,
        0px 1px 0px white,
        -1px 0px 0px white,
        0px -1px 0px white;
}

.list-dammy-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.list-dammy-btn li {
    width: 48%;
    margin: 1%;
    padding: 0.5em 1em;
    font-weight: bold;
    font-size: 1.5em;
    color: white;
    line-height: 1.2;
    text-align: center;
    border-radius: 2em;
    background-color: var(--bg-color-01);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);
}

.list-dammy-btn li:nth-of-type(even) {
    color: #fff;
    background-color: var(--bg-color-03);
}

@media (max-width: 1024px) {
    .list-dammy-btn li {
        padding: 1em;
        font-size: 1em;
    }
}

@media (max-width: 599px) {
    .banner003-title {
        font-size: 1.25em;
    }

    .list-dammy-btn li {
        width: 98%;
        margin: 2% 1%;
    }
}

/* .mini-banner-wrap */
.mini-banner-wrap a {
    width: 100%;
    height: 100%;
    display: block;
}

.mini-banner-wrap a img {
    width: 100%;
}

/* サイン sign */
.sign-wrap {
    position: relative;
}

.sign {
    width: 75%;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

/*===================================
  list
===================================*/
/* list-maker */
.list-maker li {
    display: inline-block;
    margin: 0.1em;
}

/* .list-menu */
.list-menu .list-inner {
    position: relative;
}

.list-menu.-with-bar {
    position: relative;
}

.list-menu.-with-bar::before {
    content: "";
    width: 200%;
    height: 110%;
    display: block;
    border-radius: 0 1em 1em 0;
    background-color: var(--bg-color-04);
    position: absolute;
    top: -5%;
    right: 5%;
    z-index: -1;
}

.list-menu .list-inner a {
    width: 100%;
    height: 100%;
    display: block;
    padding: 20px 20px 50px 20px;
    border: 4px solid #fff;
    border-radius: 25px 25px 0 25px;
    background-color: #50d5f9;
    -webkit-box-shadow: 0px 0px 15px -5px #777;
    box-shadow: 0px 0px 15px -5px #777;
    position: relative;
}

.list-menu li:nth-child(2) .list-inner a {
    background-color: #fc983d;
}

.list-menu li:nth-child(3) .list-inner a {
    background-color: #9fe530;
}

.list-menu li:nth-child(4) .list-inner a {
    background-color: #f978ad;
}

.list-menu li:nth-child(5) .list-inner a {
    background-color: #fcd73d;
}

.list-menu .list-inner a .title {
    height: 3em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: bold;
    font-size: 22px;
    text-align: center;
}

.list-menu .list-inner a .btn {
    position: absolute;
    bottom: 0;
    right: 5px;
    z-index: 1;
}

.list-menu .list-inner .btn>div {
    position: relative;
    z-index: 1;
}

.list-menu .list-inner .btn::before {
    content: "";
    width: 50px;
    height: 50px;
    display: block;
    background-color: var(--bg-color-01);
    position: absolute;
    bottom: 0;
    right: -5px;
    z-index: 0;

    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

@media (max-width: 599px) {
    .list-menu .list-inner a .title {
        height: auto;
        font-size: 20px;
    }
}

/* .list-flow */
.list-flow li {
    position: relative;
}

.list-flow li::before {
    content: "";
    width: 30px;
    height: 45px;
    display: block;
    background-color: var(--bg-color-01);
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: -15px;
    z-index: 1;

    -webkit-clip-path: polygon(0 0, 0 100%, 100% 50%);
    clip-path: polygon(0 0, 0 100%, 100% 50%);
}

.list-flow li:first-child::before {
    content: none;
}

.list-flow .list-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 50px 40px;
    border: 4px solid #fff;
    border-radius: 20px 20px 0 20px;
    background-color: var(--bg-color-06);
    -webkit-box-shadow: 0px 0px 15px -5px #777;
    box-shadow: 0px 0px 15px -5px #777;
    position: relative;
}

.list-flow .list-inner .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 1.6vw;
    text-align: center;
}

.list-flow .list-inner .title.ver02 {
    color: #fff;
    text-shadow: 3px 3px 1px #92b421,
        -3px 3px 1px #92b421,
        3px -3px 1px #92b421,
        -3px -3px 1px #92b421,
        3px 0px 1px #92b421,
        0px 3px 1px #92b421,
        -3px 0px 1px #92b421,
        0px -3px 1px #92b421;
}

@media(max-width:1024px) {
    .list-flow.arrow li:nth-child(3)::before {
        -webkit-transform: translate(-50%, 0) rotate(90deg);
        transform: translate(-50%, 0) rotate(90deg);
        top: -40px;
        left: -15px;
        left: 50%;
    }

    .list-flow.arrow li:nth-child(4)::before {
        -webkit-transform: translate(0, -50%) rotate(180deg);
        transform: translate(0, -50%) rotate(180deg);
        top: 50%;
        left: auto;
        right: -15px;
    }
}

@media (max-width: 599px) {
    .list-flow .list-inner {
        padding: 15px;
    }

    .list-flow li::before {
        width: 15px;
        height: 30px;
        left: -10px;
    }

    .list-flow .list-inner .title {
        height: auto;
        margin-bottom: 0;
        font-size: 5vw;
    }

    .list-flow.arrow li:nth-child(3)::before {
        top: -30px;
    }
}

/* .list-flow.ver02 */
.list-flow.ver02 .list-inner {
    display: block;
    padding: 2em 1em;
    background-color: var(--bg-color-05);
}

.list-flow.ver02 .list-inner .img-wrap{
    width: 80%;
    margin: 0 auto;
}

.list-flow.ver02 .list-inner .title {
    display: block;
    margin-bottom: 0;
    /* 16 24 320 1200 */
    font-size: clamp(1.25rem, 1.136rem + 0.48vw, 1.5rem);
    line-height: 1.3;
}

.list-flow.ver02 .list-inner .title.sp {
    display: none;
}

.list-flow .list-inner .title.ver02 {
    height: auto;
    font-size: 30px;
    color: #fff;
    letter-spacing: 0.1em;
    text-shadow: 3px 3px 3px #92b421,
        -3px -3px 3px #92b421,
        -3px 3px 3px #92b421,
        3px -3px 3px #92b421,
        3px 0px 3px #92b421,
        -3px 0px 3px #92b421,
        0px 3px 3px #92b421,
        0px -3px 3px #92b421;
}

.list-flow .list-inner .title.ver03 {
    height: 60px;
    font-size: 30px;
    color: #fff;
    letter-spacing: 0.1em;
    text-shadow: 3px 3px 3px #ee7800,
        -3px -3px 3px #ee7800,
        -3px 3px 3px #ee7800,
        3px -3px 3px #ee7800,
        3px 0px 3px #ee7800,
        -3px 0px 3px #ee7800,
        0px 3px 3px #ee7800,
        0px -3px 3px #ee7800;
}

.list-flow.ver02 .list-inner .title .sub {
    font-size: 80%;
}

.list-flow.ver02 .list-inner .text {
    font-weight: bold;
}

@media (max-width: 1024px) {
    .list-flow.ver02 .list-inner .title {
        font-size: 3vw;
    }
}

@media(max-width:599px) {
    .list-flow.ver02 .list-inner {
        position: relative;
    }

    .list-flow.ver02 .list-inner .title {
        -ms-writing-mode: initial;
        -webkit-writing-mode: initial;
        writing-mode: initial;
    }

    .list-flow.ver02 .list-inner .title.pc {
        display: none;
    }

    .list-flow.ver02 .list-inner .title.sp {
        display: block;
        white-space: normal;
        position: relative;
        z-index: 1;
        font-size: 5vw;
        margin-bottom: 1em;
    }

    .list-flow.ver02 .list-inner .img-wrap {
        width: 35%;
        -webkit-filter: opacity(0.5);
        filter: opacity(0.5);
        position: absolute;
        top: 0;
        right: 0;
        z-index: 0;
    }

    .list-flow.ver02 .list-inner .text {
        position: relative;
        z-index: 1;
    }

    .list-flow.ver02 li::before {
        width: 30px;
        height: 15px;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        top: -20px;
        left: 50%;

        -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
        clip-path: polygon(0 0, 50% 100%, 100% 0);
    }
}


/* .list-flow.ver03 */
.list-flow.ver03 li+li {
    margin-top: 30px;
}

.list-flow.ver03 li::before {
    width: 30px;
    height: 15px;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: -30px;
    left: 50%;

    -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    ;
}

.list-flow.ver03 .list-inner {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 20px;
    background-color: var(--bg-color-05);
}

.list-flow.ver03 .list-inner .title {
    height: auto;
    display: block;
    margin-bottom: 0.5em;
    text-align: left;
    white-space: initial;
    -ms-writing-mode: initial;
    -webkit-writing-mode: initial;
    writing-mode: initial;
}

.list-flow.ver03.new .list-inner .title {
    font-size: 1.5vw;
}

@media(max-width:1024px) {
    .list-flow.ver03.new .list-inner .title {
        font-size: 2.5vw;
    }
}

@media(max-width:599px) {
    .list-flow.ver03 .list-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .list-flow.ver03.new .list-inner .title {
        font-size: 5vw;
    }
}

/* .list-shape01 */
.list-shape01 .list-inner {
    border: 4px solid var(--text-color-01);
    border-radius: 0 0 0 50px;
    background-color: #fff;
}

.list-shape01 .list-inner .title {
    padding: 1em 0;
    font-weight: bold;
    font-size: 1.4em;
    text-align: center;
}

.list-shape01 .list-inner .title.ver02 {
    padding: 30px 15px;
}

.list-shape01 .list-inner .title.ver03 {
    padding: 10px 0;
}

.list-shape01 .list-inner .title .marker {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(70%, #fca95e));
    background: linear-gradient(transparent 70%, #fca95e 70%);
}

.list-shape01 .list-inner .title .kyoku,
.list-shape01 .list-inner .title .date {
    display: block;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}

.youtube {
    overflow: hidden;
    padding-top: 60%;
    position: relative;
}

.list-shape01 .list-inner .name-wrap {
    padding: 10px 0;
}

.list-shape01 .list-inner .name-wrap .name {
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}

.list-shape01 .list-inner .name-wrap .shop {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0.5em auto 0.5em auto;
    padding: 0.25em 0.5em;
    font-weight: bold;
    text-align: center;
    background-color: var(--bg-color-05);
}

.list-shape01 .list-inner .name-wrap .shop span+span {
    padding-left: 0.5em;
    position: relative;
}

.list-shape01 .list-inner .name-wrap .shop span+span::before {
    content: "/";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
}

@media(max-width:599px) {
    .list-shape01 .list-inner .title {
        padding: 10px 0;
    }
}

/* .list-shape01.staff */
.list-shape01.staff .list-inner {
    overflow: hidden;
}

.list-shape01.staff .list-inner .name-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px 5px;
    line-height: 1;
}

.list-shape01.staff .list-inner .name-wrap .name {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 5px;
    font-size: initial;
}

.list-shape01.staff .list-inner .name-wrap .shop {
    margin: 0;
    padding: 0;
    background-color: transparent;
}

.list-shape01.staff .list-inner .name-wrap .shop span {
    height: 0;
    display: none;
    visibility: hidden;
    opacity: 0;
}

.list-shape01.staff .list-inner .name-wrap .shop span.職人,
.list-shape01.staff .list-inner .name-wrap .shop span.施工管理,
.list-shape01.staff .list-inner .name-wrap .shop span.二級施工管理技士,
.list-shape01.staff .list-inner .name-wrap .shop span.外壁診断士,
.list-shape01.staff .list-inner .name-wrap .shop span.リフォームアドバイザー,
.list-shape01.staff .list-inner .name-wrap .shop span.事務員,
.list-shape01.staff .list-inner .name-wrap .shop span.インテリアコーディネーター,
.list-shape01.staff .list-inner .name-wrap .shop span.二級土木施工管理技士,
.list-shape01.staff .list-inner .name-wrap .shop span.二級建築施工管理技士
{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: auto;
    display: block;
    visibility: visible;
    padding: 0.25em;
    font-weight: bold;
    font-size: 15px;
    text-align: center;
    background-color: var(--bg-color-05);
    opacity: 1;
}

.list-shape01.staff .list-inner .name-wrap .shop span.インテリアコーディネーター{
    font-size: 12px;
    padding: 0.5em;
}

.list-shape01.staff .list-inner .name-wrap .shop span+span {
    margin-top: 5px;
}

.list-shape01.staff .list-inner .name-wrap .shop span+span::before {
    content: none;
}

.list-shape01.staff .list-inner .comment {
    padding: 0 10px 20px 10px;
}


@media(max-width:599px) {
    .list-shape01.staff .list-inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .list-shape01.staff .list-inner .img-wrap {
        width: 45%;
    }

    .list-shape01.staff .list-inner .content-wrap {
        width: 55%;
    }

    .list-shape01.staff .list-inner .name-wrap {
        display: block;
    }

    .list-shape01.staff .list-inner .name-wrap .name {
        margin-top: 10px;
    }

    .list-shape01.staff .list-inner .name-wrap .shop {
        margin: 0 0 0 0;
    }
}

/* .list-shop */
.list-shop li+li {
    margin-top: 15px;
}

.list-shop .list-inner {
    padding: 1.5em;
    border: 3px solid var(--text-color-01);
    border-radius: 20px;
    background-color: #fff;
}

.list-shop .name-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
}

.list-shop .name-wrap .name {
    width: 35%;
    margin-right: 1em;
    padding: 0.5em 1em;
    font-weight: bold;
    font-size: 20px;
    color: #fff;
    text-align: center;
    background-color: var(--bg-color-01);
}

.list-shop .name-wrap .name::before {
    content: "\f3c5";
    margin-right: 0.5em;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    line-height: 1;
}

.list-shop .content-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.list-shop .content-wrap .img-wrap {
    width: 35%;
}

.list-shop .content-wrap .map-wrap {
    width: 65%;
}

.list-shop li:nth-child(even) .list-inner {
    border: 3px solid var(--text-color-03);
}

.list-shop li:nth-child(even) .name-wrap .name {
    background-color: var(--bg-color-03);
}

@media(max-width:599px) {
    .list-shop .list-inner {
        overflow: hidden;
        padding: 0;
    }

    .list-shop .name-wrap {
        overflow: hidden;
    }

    .list-shop .name-wrap .name {
        width: 100%;
        margin-right: 0;
        padding: 1em;
    }

    .list-shop .name-wrap .add {
        width: 100%;
        padding: 1em;
    }

    .list-shop .content-wrap {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .list-shop .content-wrap .img-wrap,
    .list-shop .content-wrap .map-wrap {
        width: 100%;
    }
}

/* .list-voice */
.list-voice li+li {
    margin-top: 30px;
}

.list-voice.recommend li+li {
    margin-top: 0;
}

.list-voice .list-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1.5em;
    border: 4px solid var(--text-color-01);
    border-radius: 3em 3em 0 3em;
    background-color: #fff;
}

.list-voice.recommend .list-inner {
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
}

.list-voice .list-inner .img-wrap {
    width: 35%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.list-voice li .img-wrap .voice-img {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.list-voice li .img-wrap .voice-img:has(img[src='']) {
    display: none;
}

.list-voice li .img-wrap .voice-img {
    width: 80%;
}

.list-voice li .img-wrap .voice-img+.voice-img {
    z-index: 1;
    position: relative;
}

.list-voice .list-inner .content-wrap {
    width: 60%;
}

.list-voice .list-inner .content-wrap .title {
    margin-bottom: 1em;
    font-weight: bold;
    font-size: 1.5em;
    line-height: 1.4;
}

.list-voice .list-inner .content-wrap .name {
    font-weight: bold;
    font-size: 1.25em;
    margin-bottom: 1em;
}

.list-voice .list-inner .content-wrap .text {
    font-size: 16px;
}

.shape-house {
    display: block;

    -webkit-mask-image: url(/upload/tenant_1/home.webp);
    mask-image: url(/upload/tenant_1/home.webp);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

@media(max-width:599px) {
    .list-voice .list-inner .img-wrap {
        width: 100%;
        margin-bottom: 10px;
    }

    .list-voice .list-inner .content-wrap {
        width: 100%;
    }
}

/* .list-kuchikomi */
.list-kuchikomi li+li {
    margin-top: 10px;
}

.list-kuchikomi .list-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 30px;
    border: 4px solid var(--text-color-03);
    border-radius: 0 20px 20px 20px;
    background-color: #fff;
}

.list-kuchikomi .list-inner .img-wrap {
    width: 10%;
}

.list-kuchikomi .list-inner .content-wrap {
    width: 85%;
}

.list-kuchikomi .list-inner .content-wrap .star {
    color: #fbbc04;
}

@media (max-width: 599px) {
    .list-kuchikomi .list-inner {
        padding: 1.5em 0.75em;
    }

    .list-kuchikomi .list-inner .img-wrap {
        width: 20%;
    }

    .list-kuchikomi .list-inner .content-wrap {
        width: 75%;
    }
}

/* .list-works */
.list-works .list-inner {
    padding: 2em 1em;
    border: 4px solid var(--text-color-01);
    border-radius: 20px 20px 0 20px;
    background-color: #fff;
    position: relative;
}

.list-works .list-inner .category {
    padding: 20px 0;
    text-align: center;
}

.list-works .list-inner .category span {
    display: inline-block;
    margin: 1px;
    padding: 0.25em;
    font-size: 12px;
    color: #fff;
    background-color: #119dd8;
}

.list-works .list-inner .title {
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}

.list-works .list-inner .date {
    font-weight: bold;
    font-size: 12px;
    text-align: center;
}

.list-works .list-inner .btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 1;
}

.list-works .list-inner .btn>div {
    position: relative;
    z-index: 1;
}

.list-works .list-inner .btn::before {
    content: "";
    width: 50px;
    height: 50px;
    display: block;
    background-color: var(--bg-color-01);
    position: absolute;
    bottom: -10px;
    right: -10px;
    z-index: 0;

    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

/* list-works（中にcard） */
.list-works li .list-inner .card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.list-works li .list-inner .card .card-img {
    width: 45%;
}

.list-works li .list-inner .card .card-img .img {
    height: 100%;
}

.list-works li .list-inner .card .card-content {
    width: 50%;
}

.list-works li .list-inner .card .card-content .card-title {
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight: bold;
    font-size: 1.25em;
    line-height: 1.2;
    white-space: inherit;

    -webkit-line-clamp: 3;
}

.list-works li .list-inner .card .card-content .card-category {
    margin-bottom: 0.5em;
}

.list-works li .list-inner .card .card-content .card-category span {
    display: inline-block;
    margin: 1px;
    padding: 0.25em 1em;
    font-weight: bold;
    font-size: 1em;
    color: white;
    line-height: 1.2;
    text-align: center;
    background-color: var(--bg-color-01);
}

.list-works li .list-inner .with-card-like-btn {
    margin-top: 1em;
    padding: 0.5em 2em;
    font-weight: bold;
    font-size: 1.2em;
    color: white;
    line-height: 1.2;
    text-align: center;
    background-color: var(--bg-color-03);
    position: relative;
    position: relative;
}

.list-works li .list-inner .with-card-like-btn::after {
    content: "\f105";
    display: inline-block;
    margin: auto;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    right: 0.5em;
    z-index: 1;
}

/* .list-check */
.list-check li {
    font-size: 24px;
}

.list-check li+li {
    margin-top: 0.6em;
}

.list-check li .list-check-inner {
    padding-left: 1em;
    position: relative;
    width: 100%;
    height: 100%;
}

.list-check li .list-check-inner::before {
    content: "";
    width: 1em;
    height: 1.5em;
    display: block;
    background-image: url("/import/tenant_1/162.43.27.166/html/images/banner-parts-03-03.webp");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    left: 0;
}

@media (max-width: 599px) {
    .list-check li {
        font-size: 22px;
    }
}

/* .list-newsblog */
.list-newsblog li+li {
    margin-top: 1.5em;
}

.list-newsblog li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
}

.list-newsblog li a .date {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 18px;
}

.list-newsblog li a .category {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.list-newsblog li a .category span {
    display: inline-block;
    margin: 0 1em;
    padding: 0.25em 0.5em;
    font-size: 14px;
    color: #fff;
    border-radius: 20px;
    background-color: #a8d6e3;
}

.list-newsblog li a .category span.営業時間・休業日について {
    background-color: #c4a3bd;
}

.list-newsblog li a .category span.お得なキャンペーン情報 {
    background-color: #e3a8a8;
}

.list-newsblog li a .category span.外壁塗装 {
    background-color: #d5997c;
}

.list-newsblog li a .category span.屋根塗装・屋根工事 {
    background-color: #d6b7a8;
}

.list-newsblog li a .category span.防水工事 {
    background-color: #a8cbe3;
}

.list-newsblog li a .category span.リフォーム {
    background-color: #8d9966;
}

.list-newsblog li a .category span.スタッフの日常 {
    background-color: #ad907c;
}

.list-newsblog li a .category span.豆知識コラム {
    background-color: #a2a67a;
}

.list-newsblog li a .category span.その他 {
    background-color: #a8a8a8;
}

.list-newsblog li a .title {
    font-weight: bold;
    font-size: 18px;
}

.border-left {
    padding-left: 5%;
    border-left: 3px solid var(--text-color-01);
}

@media(max-width:1024px) {
    .list-newsblog li a {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .list-newsblog li a .title {
        width: 100%;
        margin-top: 5px;
    }
}

/* .list-newsblog02 */
.list-newsblog02 .list-inner {
    padding: 20px 20px 50px 20px;
    border: 4px solid var(--text-color-03);
    border-radius: 20px 20px 0 20px;
    background-color: #fff;
    position: relative;
}

.list-newsblog02 .list-inner .img-wrap {
    margin-bottom: 10px;
}

.list-newsblog02 .list-inner .category span {
    display: inline-block;
    margin: 1px;
    padding: 0.25em;
    font-size: 12px;
    color: #fff;
    background-color: #a8d6e3;
}

.list-newsblog02 .list-inner .category span.営業時間・休業日について {
    background-color: #c4a3bd;
}

.list-newsblog02 .list-inner .category span.お得なキャンペーン情報 {
    background-color: #e3a8a8;
}

.list-newsblog02 .list-inner .category span.外壁塗装 {
    background-color: #d5997c;
}

.list-newsblog02 .list-inner .category span.屋根塗装・屋根工事 {
    background-color: #d6b7a8;
}

.list-newsblog02 .list-inner .category span.防水工事 {
    background-color: #a8cbe3;
}

.list-newsblog02 .list-inner .category span.リフォーム {
    background-color: #8d9966;
}

.list-newsblog02 .list-inner .category span.スタッフの日常 {
    background-color: #ad907c;
}

.list-newsblog02 .list-inner .category span.豆知識コラム {
    background-color: #a2a67a;
}

.list-newsblog02 .list-inner .category span.その他 {
    background-color: #a8a8a8;
}

.list-newsblog02 .list-inner .title {
    font-weight: bold;
    font-size: 16px;
}

.list-newsblog02 .list-inner .date {
    font-weight: bold;
}

.list-newsblog02 .list-inner .btn {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 1;
}

.list-newsblog02 .list-inner .btn>div {
    position: relative;
    z-index: 1;
}

.list-newsblog02 .list-inner .btn::before {
    content: "";
    width: 50px;
    height: 50px;
    display: block;
    background-color: var(--bg-color-03);
    position: absolute;
    bottom: -10px;
    right: -10px;
    z-index: 0;

    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

/* .list-youkou */
.list-youkou li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1em;
    padding-bottom: 1em;
    border-bottom: 1px solid #333333;
}

.list-youkou .title {
    width: 25%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.list-youkou .content {
    width: 70%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.list-youkou .list li {
    display: block;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

@media (max-width: 599px) {
    .list-youkou .title {
        width: 100%;
    }

    .list-youkou .content {
        width: 100%;
        font-size: 14px;
    }
}

/* .list-youkou.ver02*/
.list-youkou.ver02 li {
    margin-bottom: 0;
    padding-bottom: 0;
}

.list-youkou.ver02 .title {
    width: 70%;
    padding: 1em;
}

.list-youkou.ver02 .content {
    width: 30%;
    padding: 1em;
    text-align: right;
}

.list-youkou.ver02.gaiheki .title {
    background-color: #a8d6e3;
}

.list-youkou.ver02.yane .title {
    background-color: rgba(252, 152, 61, 0.7);
}

.list-youkou.ver02.gaiheki,
.list-youkou.ver02.yane {
    border: 2px solid #000;
}

.list-youkou.ver02.gaiheki .title,
.list-youkou.ver02.yane .title {
    width: 50%;
}

.list-youkou.ver02.gaiheki .content,
.list-youkou.ver02.yane .content {
    width: 50%;
    font-weight: bold;
    letter-spacing: 0.1em;
    border-left: 2px solid #000;
}

.list-youkou.ver02.gaiheki li,
.list-youkou.ver02.yane li {
    border-bottom: 2px solid #000;
}

.list-youkou.ver02.gaiheki li:last-child,
.list-youkou.ver02.yane li:last-child {
    border-bottom: none;
}

@media(max-width:599px) {
    .list-youkou.ver02 .title {
        width: 60%;
    }

    .list-youkou.ver02 .content {
        width: 40%;
        font-size: 16px;
    }

    .list-youkou.ver02.gaiheki .content,
    .list-youkou.ver02.yane .content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
}

/* .list-youkou.ver03*/
.list-youkou.ver03 li {
    margin-bottom: 0;
    padding-bottom: 0;
}

.list-youkou.ver03 .title {
    width: 50%;
    padding: 1em;
    background-color: rgba(252, 152, 61, 0.7);
}

.list-youkou.ver03 .content {
    width: 50%;
    padding: 1em;
}

/* .list-skew */
.list-skew li {
    position: relative;
}

.list-skew .list-inner {
    padding: 20px;
    border-radius: 1em;
    background-color: var(--bg-color-04);
}

.list-skew .list-inner .title {
    margin: 20px 0 10px 0;
    font-weight: bold;
    font-size: 1.75em;
    text-shadow: 1px 1px 0px white,
        -1px 1px 0px white,
        1px -1px 0px white,
        -1px -1px 0px white,
        1px 0px 0px white,
        0px 1px 0px white,
        -1px 0px 0px white,
        0px -1px 0px white;
    position: relative;
    z-index: 2;
}

.list-skew .num {
    width: 1.5em;
    height: 1.5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-family: "Noto Serif JP", serif;
    font-size: 100px;
    color: #ddd;
    color: white;
    line-height: 1;
    line-height: 1;
    border-radius: 70% 50% 70% 60% / 40% 80% 60% 70%;
    background-color: var(--bg-color-01);
    position: absolute;
    top: -100px;
    right: -15px;
    z-index: 1;
}

@media(max-width:1024px) {
    .list-skew .num {
        font-size: 90px;
        right: 0;
    }
}

@media(max-width:599px) {
    .list-skew .num {
        font-size: 65px;
        top: -50px;
        right: 10px;
    }

    .list-skew .list-inner .title {
        font-size: 1.5em;
    }
}

/* .list-skew.ver02 */
.list-skew.ver02 .list-inner .num {
    font-size: 70px;
    top: -30px;
    right: -5px;
}

.list-skew.ver02 .list-inner .title {
    height: 3em;
    font-size: 1.5em;
}

@media(max-width:1024px) {
    .list-skew.ver02 .list-inner .num {
        font-size: 55px;
    }
}

@media(max-width:599px) {
    .list-skew.ver02 .list-inner .num {
        right: 5px;
    }

    .list-skew.ver02 .list-inner .title {
        font-size: 1.2em;
        height: auto;
    }
}

/* .list-skew.ver03 */
.list-skew.ver03 .num {
    top: -50px;
}

/* .list-cross */
.list-cross .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.list-cross .item+.item {
    margin-top: 50px;
}

.list-cross .item:nth-child(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

/* .list-cross.ver02 */
@media(max-width:599px) {
    .list-cross.ver02 .item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .list-cross.ver02 .item:last-child {
        display: block;
    }
}

/* .list-faq */
.list-faq .faq-q {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    padding: 20px 20px 20px 80px;
    font-weight: bold;
    border-bottom: 2px solid;
}

.list-faq .faq-q:hover {
    cursor: pointer;
}

.list-faq .faq-q .label {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 50px;
    color: #583822;
}

.list-faq .faq-q .text {
    width: 100%;
    margin: 0 50px;
}

.list-faq .faq-q .btn {
    width: 20px;
    height: 20px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 24px;
    position: relative;
}

.list-faq .faq-q .btn:before {
    content: "";
    width: 20px;
    height: 4px;
    display: block;
    border-radius: 20px;
    background-color: #000;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.list-faq .acc-parent .faq-q .btn:after {
    content: "";
    width: 4px;
    height: 20px;
    display: block;
    border-radius: 20px;
    background-color: #000;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.list-faq .acc-parent.action .faq-q .btn:after {
    -webkit-transition: linear 0.3s;
    transition: linear 0.3s;
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    transform: translate(-50%, -50%) rotate(90deg);
}

.list-faq .faq-a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    padding: 20px 20px 20px 80px;
    background-color: var(--bg-color-02);
}

.list-faq .faq-a .label {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 50px;
}

.list-faq .faq-a .text {
    width: 100%;
    margin-left: 50px;
}

.list-faq li+li {
    margin-top: 10px;
}

@media(max-width:599px) {
    .list-faq .faq-q {
        padding: 20px 20px 20px 20px;
    }

    .list-faq .faq-q .text {
        margin: 0 20px;
    }

    .list-faq .faq-a {
        padding: 20px 20px 20px 20px;
    }

    .list-faq .faq-a .text {
        margin-left: 20px;
    }
}

/* .list-order */
@media(max-width:1024px) {
    .list-order li:nth-child(1) {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .list-order li:nth-child(2) {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
    }

    .list-order li:nth-child(3) {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
    }

    .list-order li:nth-child(4) {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
    }
}

/* .list-hikaku */
.list-hikaku .list-inner {
    background-color: #fff;
    padding: 20px;
    border-radius: 1em;
}

.list-hikaku li.us .list-inner {
    background-color: var(--bg-color-02);
}

.list-hikaku .list-inner .title {
    text-shadow: none;
}

.list-hikaku .list-inner .img {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.list-hikaku .list-inner .text {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

.list-hikaku .list-inner .text:after {
    content: "↓";
    display: block;
    height: 2em;
    color: #ee3b00;
}

.list-hikaku .list-inner .result-text {
    background-color: var(--bg-color-01);
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    padding: 0.5em;
}

.list-hikaku li.us .list-inner .result-text {
    background-color: #ee3b00;
}


/* 検索フォーム */
.search-item .search-item-content {
    width: 80%;
}

.search-item title {
    width: 20%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.search-item input {
    display: none;
}

.search-item label {
    display: inline-block;
    margin: 3px;
    padding: 0.25em 0.5em;
    color: var(--text-color-01);
    border: 1px solid var(--text-color-01);
    border-radius: 1em;
}

.search-item input:checked+label {
    color: #fff;
    background-color: var(--text-color-01);
}


/* ABテスト */
.reflection {
    overflow: hidden;
    position: relative;
}

.reflection::before {
    content: "";
    width: 30px;
    height: 100%;
    background-color: #fff;
    opacity: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: reflection 2s ease-in-out infinite;
    animation: reflection 2s ease-in-out infinite;
    position: absolute;
    top: -180px;
    left: 0;
    z-index: 1;
}

/* モーダル */
.modal-section {
    position: relative;
    z-index: -5;
}

.active-modal-01 .modal-section {
    z-index: 15;
}

.modal-01 {
    padding: 40px;
    border-radius: 1em;
    background: var(--bg-color-05);
    opacity: 0;
    -webkit-transition: ease-in 0.3s;
    transition: ease-in 0.3s;
    position: fixed;
    top: 25%;
    right: 100px;
    z-index: -1;
}

.switch-modal-02 {
    position: relative;
}

.modal-02 {
    width: 100%;
    padding: 20px;
    border-radius: 1em;
    background: var(--bg-color-05);
    opacity: 0;
    -webkit-transition: ease-in 0.3s;
    transition: ease-in 0.3s;
    position: absolute;
    top: -215px;
    left: 0;
    z-index: -1;
}

.modal-03 {
    width: 100%;
    padding: 10px;
    border-radius: 1em;
    background: var(--bg-color-05);
    opacity: 0;
    cursor: pointer;
    -webkit-transition: ease-in 0.3s;
    transition: ease-in 0.3s;
    position: absolute;
    top: -105px;
    left: 0;
    z-index: -1;
}

.modal-01 .btn-close,
.modal-02 .btn-close,
.modal-03 .btn-close {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: 0.5em;
    margin-left: auto;
    margin-right: auto;
    padding: 0.25em 0.5em;
    color: #fff;
    border-radius: 0.25em;
    background: var(--bg-color-01);
}

.modal-01 .btn-close:hover,
.modal-02 .btn-close:hover,
.modal-03 .btn-close:hover {
    cursor: pointer;
}

.active-modal-01 .modal-01 {
    max-height: 216px;
    visibility: visible;
    opacity: 1;
    z-index: 1;
}

.active-modal-02 .modal-02 {
    visibility: visible;
    opacity: 1;
    z-index: 1;
}

.active-modal-03 .modal-03 {
    visibility: visible;
    opacity: 1;
    z-index: 1;
}

@media(max-width:1024px) {
    .modal-03 {
        top: -92px;
    }
}

@media(max-width:599px) {
    .modal-section {
        visibility: hidden;
        opacity: 0;
    }
}


@-webkit-keyframes reflection {
    0% {
        opacity: 0;
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
    }

    80% {
        opacity: 0.5;
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
    }

    81% {
        opacity: 1;
        -webkit-transform: scale(4) rotate(45deg);
        transform: scale(4) rotate(45deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(50) rotate(45deg);
        transform: scale(50) rotate(45deg);
    }
}

@keyframes reflection {
    0% {
        opacity: 0;
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
    }

    80% {
        opacity: 0.5;
        -webkit-transform: scale(0) rotate(45deg);
        transform: scale(0) rotate(45deg);
    }

    81% {
        opacity: 1;
        -webkit-transform: scale(4) rotate(45deg);
        transform: scale(4) rotate(45deg);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(50) rotate(45deg);
        transform: scale(50) rotate(45deg);
    }
}

/* 10秒お問い合わせフォーム */
.ten-form {
    border: 5px solid var(--text-color-01);
    border-radius: 1em;
    background-image: url(/upload/tenant_1/AdobeStock_430737115.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: rgba(255, 255, 255, 0.6);

    background-blend-mode: lighten;
}

@media (max-width: 1024px) {
    .ten-form {
        width: 600px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media(max-width:599px) {
    .ten-form {
        width: 100%;
        padding: 2em 1em;
        position: relative;
    }

    .ten-form .img-wrap {
        -webkit-filter: opacity(0.1);
        filter: opacity(0.1);
        position: absolute;
        top: 0;
        left: 10%;
        z-index: -1;
    }
}

/* シミュレーション */
.simulation-balloon {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    padding: 0 50px;
    font-family: メイリオ, Meiryo, ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, Arial, sans-serif;
    font-weight: bold;
    font-size: 1em;
    text-align: center;
    position: relative;
}

.simulation-balloon::before,
.simulation-balloon::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: 100%;
    background-image: url('/upload/tenant_1/deco-orange-removebg-preview.webp');
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
}

.simulation-balloon::before {
    -webkit-transform: translate(0, -50%) rotate(-15deg);
    transform: translate(0, -50%) rotate(-15deg);
    left: 0;
}

.simulation-balloon::after {
    -webkit-transform: translate(0, -50%) rotate(15deg) scale(-1, 1);
    transform: translate(0, -50%) rotate(15deg) scale(-1, 1);
    right: 0;
}

@media (max-width: 599px) {
    .price2 .box-flexb dl dd+dd {
        margin-top: 0.5em;
    }

    .price2 .box-flexb dl+dl {
        margin-top: 30px;
    }
}

.text.-with-deco {
    padding: 1.5em;
    border-radius: 1.5em;
    background-color: var(--bg-color-05);
    position: relative;
}

.text.-with-deco::after {
    content: "";
    width: 200%;
    height: 100%;
    display: block;
    border-radius: 1.5em;
    background-color: inherit;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.google-img {
    width: auto;
    height: 58px;
    display: inline-block;
}

.google-img img {
    height: 100%;
}

@media(max-width:1024px) {
    .google-img {
        height: 42px;
    }
}

@media(max-width:599px) {
    .google-img {
        height: 35px;
    }
}

.o-container {
    overflow: hidden;
    padding: 50px;
    border-radius: 20px;
    background-color: var(--bg-color-05);
}

@media(max-width:599px) {
    .o-container {
        padding: 20px;
    }
}

.p-backimg {
    background-image: url("/upload/tenant_1/AdobeStock_606233991.webp");
    background-size: contain;
    background-color: rgba(255, 255, 255, 0.5);

    background-blend-mode: lighten;
}

.p-backimg02 {
    background-image: url("/upload/tenant_1/AdobeStock_606233991_moto.webp");
    background-size: cover;
    background-color: rgba(255, 255, 255, 0.5);

    background-blend-mode: lighten;
}

.o-imgborder {
    overflow: hidden;
    border: 5px solid var(--text-color-01);
    border-radius: 1em;
}

/* 施工事例詳細ページの本文 */
.construction-detail table tr td:has(> img) {
    text-align: center;
}

.construction-detail img,
.construction-detail table tr td img {
    overflow: hidden;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    border: 3px solid var(--bg-color-01);
    border-radius: 0.5em;
}

.whitespace{
  white-space: nowrap;
}

/* 見たまま編集画面 */
[data-ab-test-block] [data-ab-test-contents]+[data-ab-test-contents] {
    display: none;
}

[data-element-id] .index .mainvisual {
    -webkit-transform: unset;
    transform: unset;
    position: static;
}

[data-element-id] .index .mainvisual .mobile-slide {
    max-width: 768px;
    margin: 1em auto;
}

[data-element-id].up-h-100\% {
    height: auto;
}

[data-element-id].list-gnav {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

[data-element-id].list-gnav li {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
}

[data-element-id].drop-menu-list {
    visibility: visible;
    opacity: 1;
}

[data-element-id] .drop-menu:hover .drop-menu-list {
    padding-top: 0;
}

[data-element-id].drop-menu:hover .drop-menu-list li a {
    padding: 0.5em 0;
    color: #000;
    background-color: transparent;
}

[data-element-id].gnav {
    margin-bottom: 50px;
    padding-bottom: 300px;
}

[data-element-id] .show\@sp {
    max-width: 375px;
    margin-left: auto;
    margin-right: auto;
}

[data-element-id].lower .mainvisual-container .catch-copy.show\@sp {
    font-size: 27px;
    -webkit-transform: none;
    transform: none;
    top: auto;
    bottom: 0;
}

[data-element-id].tel2-num {
    display: block;
    border: 1px solid #000;
    position: relative;
}

[data-element-id].tel2-num::before {
    content: "発信される番号";
    width: 100%;
    display: block;
    font-size: 10px;
    color: #fff;
    text-align: center;
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
}

[data-element-id].banner-container02 .content-wrap .tel-wrap .tel2 .ruby {
    position: initial;
}

[data-element-id].fixed-container {
    width: 130px;
    margin-left: auto;
    -webkit-transform: none;
    transform: none;
    position: initial;
}

[data-element-id].modal-01 {
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #000;
    opacity: 1;
    position: initial;
    position: relative;
    z-index: 1;
}

[data-element-id].modal-01::before {
    content: "右側固定のお問い合わせをクリックで表示（PC）";
    width: 100%;
    display: block;
    color: #fff;
    text-align: center;
    border-radius: 1em 1em 0 0;
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

[data-element-id].modal-02 {
    border: 1px solid #000;
    opacity: 1;
    position: initial;
    z-index: 1;
}

[data-element-id].modal-02::before {
    content: "お問い合わせボタンをクリックで表示（PC）";
    width: 100%;
    display: block;
    color: #fff;
    text-align: center;
    border-radius: 1em 1em 0 0;
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

[data-element-id].banner-container01 .btn.show\@sp a .btn-text {
    font-size: 30px;
}

[data-element-id].title01.show\@sp .marker .main {
    font-size: 28px;
}

[data-element-id].title01.show\@sp .marker .sub {
    font-size: 24px;
}

[data-element-id].title02.show\@sp {
    font-size: 24px;
    position: relative;
    z-index: 2;
}

[data-element-id].title03.show\@sp {
    font-size: 28px;
}

[data-element-id].title05.show\@sp {
    font-size: 28px;
}

[data-element-id] .komidashi.show\@tb {
    font-size: 1.8em;
}

[data-element-id] .komidashi.show\@sp {
    font-size: 1.5em;
}

[data-element-id] .joint-img {
    z-index: 0;
}

[data-element-id] .list-flow.ver03 .list-inner .show\@sp .title {
    font-size: 18px;
}


.nini-icon{
  color: #ee7800 !important;
    background: #fff !important;
    border: 1px solid #ee7800  !important;
}


.line-banar{
  margin: 60px auto 30px;
}

.tel-p01{
  text-align: center;
    /* font-size: 20px; */
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 20px;
    background: #09796a;
    color: #fff;
    padding: 13px;
}

.tel-p02{
  text-align: center;
    font-size: 19px;
    margin-bottom: 40px;
    color: #b30707;
    font-weight: bold;
}

.tel-03box{
  display: flex;
}

.div01{
  width: 27%;
}

.div02{
  width: 23%;
}

.teltel{
  display: block;
  width: 50%
}

.contact-tel{
  margin: 60px auto 70px;
}

.teltel p{
  font-size: 20px;
  text-align: center;
  font-weight: bold;
}

.teltel p span{
  background: #0981b1;
    color: #fff;
  padding: 8px 12px;
    border-radius: 10px;
    margin-right: 3px;
}

.tap-tel{
  margin-top: 30px;
    font-weight: bold;
}

.red{
  color: #b30707 !important;
  background: #fff !important;
  padding: 0 !important;
    border-radius: 0px !important;
    margin-right: 0 !important;
}

.btn-submit::after {
    content: "▲";
    font-size: 12px;
    color: rgb(45, 45, 45);
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(90deg);
    position: absolute;
    width: 30px;
    height: 30px;
    padding-bottom: 3px;
    box-sizing: border-box;
    top: 0px;
    right: 30px;
    bottom: 0px;
    background-color: rgb(255, 255, 255);
    border-radius: 50%;
    margin: auto 0px;
}

.tel-bango{
  background: #e76c11;
  padding: 10px 0 15px;
    width: 330px;
    margin: 10px auto 0;
    border-radius: 73px;
    color: #fff;
    font-size: 30px !important;
    line-height: 1;
}

.nenmatsu{
  font-size: 14px;
  background: #e76c11 !important;
}

.yubin-p{
 width: 78%;
    text-align: right;
    font-size: 14px;
    margin-bottom: 10px;
}

.pc-none{
  display: none;
}

.sp-br{
  display: none;
}

.line-p01{
  text-align: center;
    font-size: 20px;
    margin-bottom: 10px;
    font-weight: bold;
}

@media (max-width: 1024px) {
.btn-submit::after {
    content: "▲";
    font-size: 12px;
    color: rgb(45, 45, 45);
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(90deg);
    position: absolute;
    width: 20px;
    height: 20px;
    padding-bottom: 3px;
    box-sizing: border-box;
    top: 0px;
    right: 8px;
    bottom: 0px;
    background-color: rgb(255, 255, 255);
    border-radius: 50%;
    margin: auto 0px;
}

.yubin-p {
    width: 55%;
}

.div01 {
    width: 22%;
}

.teltel {
    display: block;
    width: 54%;
}

.div02 {
    width: 20%;
}

}



@media (max-width: 599px) {
  .tel-line-box {
    display: block;
    margin: 60px auto;
}

.div01{
  display: none;
}

.pc-none{
  display: block
}

.sp-none{
  display: none;
}

.sp-flex01{
  display: flex;
  justify-content: space-between;
}

.btn-03-tel span {
    background: #0981b1;
    color: #fff;
    padding: 8px 12px;
    border-radius: 10px;
    margin-right: 3px;
}

.btn-03-tel{
  font-weight: bold;
  text-align: center;
  font-size: 18px;
}

.tel-p02 {
    text-align: left;
    font-size: 18px;
    margin-bottom: 0px;
}

.contact-tel {
    margin: 45px auto 60px;
}

.teltel p {
    font-size: 16px;
}

.tel-bango {
    background: #e76c11;
    padding: 10px 0 15px;
    width: 250px;
    margin: 10px auto 0;
    border-radius: 73px;
    color: #fff;
    font-size: 24px !important;
    line-height: 1;
}

.div02 {
    width: 27%;
    margin-top: 20px;
}

.teltel {
    display: block;
    width: 73%;
}

.sp-br{
  display: block;
}

.line-p01 {
    font-size: 14px;
}
}

.c-red{
   color: #ee161f;
}

.sp-block{
  display: none;
}

@media screen and (max-width:599px) {
 .sp-block{
  display: block;
}

.indent-list li{
    text-indent: -1rem;
    padding-left: 1rem;
}

}

/*===================================
  toptest
===================================*/
/* ナビ */
.gnav-sp{
  display: none;
}

.gnav-sp{
  padding: 50px 20px 20px 20px;
}

@media(max-width:1024px){
.gnav-sp .list-gnav .item01 a{
  border: 0.5px solid;
}

.gnav-sp .list-gnav .item01.telitem a{
  border: none;
}
  
.gnav-sp .list-gnav .item02 a{
  border: 0.5px solid;
}
}

@media(max-width:599px) {
.gnav-sp{
  padding: 50px 20px 100px 20px;
}
}

.gnav-sp .list-gnav{
  display: flex;
  flex-wrap: wrap;
}

.gnav-sp .list-gnav .item{
  text-align: center;
  margin-bottom: 0.25em;
}

.gnav-sp .list-gnav .item a{
  display: block;
  width: 100%;
  height: 100%;
  padding: 1em;
  background-color: #fff;
  border-radius: 10px;
  padding: 10px;
}

.gnav-sp .list-gnav .item.contact a{
  background-color: #E60012;
  color: #fff;
}

.gnav-sp .list-gnav .item a .text{
  display: flex;
  justify-content: center;
  align-items: center;
/*   line-height: 1.2; */
  font-size: 12px;
}

.gnav-sp .list-gnav .item a .icon img{
  width: auto;
  height: 1.5em;
}

.gnav-sp .list-gnav .item01{
  width: 100%;
}

.gnav-sp .list-gnav .item01 a{
  display: flex;
  justify-content: center;
  gap: 20px;
}

.gnav-sp .list-gnav .item02{
  width: 48%;
  flex-grow: 0;
}

.gnav-sp .list-gnav .item02 a{
  display: flex;
  flex-direction: column;
}

.gnav-sp .list-gnav .item02 a .text{
  flex-grow: 1;
}

@media(max-width:1024px) {
.gnav{
  display: none;
}  
  
.gnav-sp{
  display: block;
}
}

[data-element-id].gnav-sp{
  display: block;
}

/* 基本の動く電話アイコン */
.taptel-text-wrap{
  background-color: #E60012;
  color: #fff;
  text-align: center;
  margin-bottom: 0.5em;
}

.taptel-tel-wrap{
  position: relative;
  background-color: #19BC03;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600;
}

.taptel-tel-wrap .tel-wrap{
  font-size: 3em;
}

.taptel-tel-wrap .text{
  text-align: center;
  font-size: 1.5em;
  padding-bottom: 0.5em;
} 

.c-bnr__btnBox01{
    position: relative;
    width: 50%;
  }

.topBox .mainBox.banner .c-bnr__btnBox01-link{
    position: absolute;
    bottom: -6px;
    right: 0;
      width: fit-content;
      z-index: 500;
      cursor: pointer;
      pointer-events: visible;
      max-width: 100%;
  }

.c-bnr__btnBox01-svg{
    width: 1.5em;
　}

.c-bnr__btnBox01-svg .line01{
    -webkit-animation: callanime01 infinite ease 1.5s;
    animation: callanime01 infinite ease 1.5s;
}

.c-bnr__btnBox01-svg .line02{
    -webkit-animation: callanime02 infinite ease 1.5s;
    animation: callanime02 infinite ease 1.5s;
}

.c-bnr__btnBox01-svg .line03{
    -webkit-animation: callanime03 infinite ease 1.5s;
    animation: callanime03 infinite ease 1.5s;
}

@-webkit-keyframes callanime01 {
    30%, 60% {
      fill-opacity: 0;
    }
    80% {
      fill-opacity: 1;
    }
  }
  @keyframes callanime01 {
    30%, 60% {
      fill-opacity: 0;
    }
    80% {
      fill-opacity: 1;
    }
  }
  @-webkit-keyframes callanime02 {
    40%, 70% {
      fill-opacity: 0;
    }
    100% {
      fill-opacity: 1;
    }
  }
  @keyframes callanime02 {
    40%, 70% {
      fill-opacity: 0;
    }
    100% {
      fill-opacity: 1;
    }
  }
  @-webkit-keyframes callanime03 {
    50%, 80% {
      fill-opacity: 0;
    }
    100% {
      fill-opacity: 1;
    }
  }
  @keyframes callanime03 {
    50%, 80% {
      fill-opacity: 0;
    }
    100% {
      fill-opacity: 1;
    }
  }
  
@media(max-width:1024px) {
.taptel-tel-wrap .tel-wrap{
  font-size: 2.5em;
}

.taptel-tel-wrap .text{
  text-align: center;
  font-size: 0.75em;
} 
}

@media (max-width: 599px){
  .taptel-tel-wrap .tel-wrap{
    font-size: 2em;
}
}

/* フッターの動く電話アイコン */
footer .taptel-tel-wrap .tel-wrap{
  font-size: 2em;
}

@media(max-width:1024px) {
footer .taptel-container{
  width: 93%;
  margin: 0 auto;
}    
}

/* バナーの動く電話アイコン */
.banner-container02 .taptel-tel-wrap .text {
    font-size: 1em;
}

@media(max-width:1024px){
.banner-container02 .taptel-container{
  max-width: 450px;
}     
}

@media(max-width:1024px) {
.banner-container02 .taptel-tel-wrap .tel-wrap {
        font-size: 2em;
    }
    
.banner-container02 .taptel-tel-wrap .text {
        font-size: 0.75em;
    }    
}

/* スマホのナビ内の電話アイコン */
.gnav-sp .list-gnav .item01.telitem a {
    display: block;
}

.gnav-sp .list-gnav .item01.telitem a {
    background-color: transparent;
    padding: 0px 10px 0 10px;
}

.item01.telitem .taptel-container {
    border: 2px solid #E60012;
    border-radius: 10px 10px 0 0;
}

.item01.telitem .taptel-tel-wrap {
    color: #000;
    background-color: transparent;    
}

.item01.telitem .taptel-tel-wrap .tel-wrap {
    font-size: 2em;
}

.item01.telitem .taptel-text-wrap {
    margin-bottom: 0;
    font-size: 12px;
}

@media screen and (min-width:600px) and (max-width:1024px) {
   .gnav-sp .list-gnav .item01 a {
    display: flex;
    justify-content: center;
    gap: 20px;
    align-items: center;
}

.tb-none{
  display: none;
}
}

@media screen and (max-width:599px) {
 .sp-block{
   display: block;
}
}

@media screen and (max-width:1024px) {
 .teltel p span {
    padding: 5px 0px;
}
}

.tel-wrap path{
  fill: #ee7800;
}



table {
  border-collapse: collapse;
  border: 2px solid rgb(140 140 140);
  font-family: sans-serif;
  font-size: 0.8rem;
  letter-spacing: 1px;
}

caption {
  caption-side: bottom;
  padding: 10px;
  font-weight: bold;
}

thead,
tfoot {
  background-color: rgb(228 240 245);
}

th,
td {
  border: 1px solid rgb(160 160 160);
  padding: 8px 10px;
}

td:last-of-type {
  text-align: center;
}

tbody > tr:nth-of-type(even) {
  background-color: rgb(237 238 242);
}

tfoot th {
  text-align: right;
}

tfoot td {
  font-weight: bold;
}

.footer-text{
  padding: 0 15px;
}


/* 2024.06.20 */

.reason-sp{
  display: none;
}

.reason-01, .reason-02{
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}

.reason-01 div, .reason-02 div{
  width: 23%;
  border: 1px solid;
    border-radius: 10px;
    margin: 0 1.5%;
}

.reason01p{
  background: #719c8b;
    color: #fff;
    text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
}

.reason01p2{
  padding: 10px;
}

.reason02p{
  background: #7b8baf;
    color: #fff;
    text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
}

.reason03p{
  text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
    background: #e4d78f;
    color: #fff;
}

.reason04p{
  text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
    background: #e2bb90;
    color: #fff;
}

.reason05p{
  text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
    background: #d9a5b2;
    color: #fff;
}

.reason06p{
  background: #d28c8c;
    color: #fff;
    text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
}

.reason07p{
  background: #7eb3d5;
    color: #fff;
    text-align: center;
    border-radius: 10px 10px 0 0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
}

.gijutsu-h2,
.maker-h2{
  padding: 10px 0;
    font-size: 30px;
    text-align: center;
    background: #719c8b;
    margin-bottom: 10px;
    color: #fff;
}

.gijutsu-h2.ver02,
.maker-h2.ver02{
  background-color: #7b8baf;
}

.gijutsu-h2.ver03,
.maker-h2.ver03{
  background-color: #e4d78f;
}

.gijutsu-h2.ver04,
.maker-h2.ver04{
  background-color: #e2bb90;
}

.gijutsu-h2.ver05,
.maker-h2.ver05{
  background-color: #d9a5b2;
}

.gijutsu-h2.ver06,
.maker-h2.ver06{
  background-color: #d28c8c;
}

.gijutsu-h2.ver07,
.maker-h2.ver07{
  background-color: #7eb3d5;
}

.gijutsu-h2.ver08,
.maker-h2.ver08{
  background-color: #4472c7;
}

.maker-h3{
  font-size: 20px;
  background: #4472c7;
  color: #fff;
  width: fit-content;
  padding: 0.5em 0.25em;
  margin-bottom: 1em;
  border-radius: 0.1em;
}

.gijutsu-span,
.maker-span{
  font-size: 18px;
}

.inner02{
  margin-top: 80px;
}

.gijutsu-p,
.maker-p{
  text-align: center;
  font-size: 18px;
}

.gijutsu-img{
  display: flex;
  justify-content: space-between;
}

.gijutsu-img div{
  width: 47%;
}

.gijutsu-img div img{
  width: 100%;
}

.reasonp{
  font-size: 20px;
}

.gijutsu-arrow{
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 100px solid transparent;
  border-left: 100px solid transparent;
  border-top: 30px solid #555555;
  border-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}

.reason-contents+.reason-contents,
.maker-contents+.maker-contents{
  margin-top: 50px;
}

.img-kasane-wrap .img-wrap{
  position: relative;
}

.img-kasane-wrap .img-wrap .text{
  position: absolute;
  bottom: 0;
  left: -100px;
  z-index: 1;
  transform: rotate(330deg);
  font-size: 3em;
}

.list-shitaji li .text{
  text-align: center;
}

.list-shitaji li .img-wrap{
  position: relative;
}

.list-shitaji li+li .img-wrap::before{
  content: "▶";
  display: block;
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translate(0, -50%);
}

.btn01.w400{
  width: 400px;
}

.float-wrap{
  overflow: hidden;
}

.float-wrap .text-wrap{
  width: 60%;
  float: left;
}

.float-wrap .img-wrap{
  width: 40%;
  float: right;
}

.maker-list li .list-inner{
  background-color: #f3f3f3;
  border-radius: 0.5em;
  overflow: hidden;
}

.maker-list li .title{
  background-color: #811f1f;
  color: #fff;
  text-align: center;
  padding: 0.25em
}

.maker-list li .text{
  padding: 0.5em;
  min-height: 140px;
}

@media(max-width:1024px){
.reasonp{
  font-size: 17px;
}

.btn01.w400{
  width: 350px;
}

.maker-list li .text{
  min-height: 185px;
}
}

.bgc0_cf{
  background-color: #000;
  color: #fff;
  width: fit-content;
  padding: 0.5em;
}

@media(max-width:599px) {
  .reason-sp{
  display: block;
}

.reason-pc{
  display: none;
}

.reason-02 div{
  width: 48%;
}

.reason07p, .reason05p, .reason01p, .reason02p, .reason03p, .reason04p, .reason06p {
    font-size: 18px;
}

.gijutsu-h2,
.maker-h2{
  padding: 10px 0;
  font-size: 22px;
  text-align: center;
  background: #719c8b;
  margin-bottom: 10px;
  color: #fff;
}

.reason-02 .img-wrap{
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.gijutsu-span,
.maker-span{
  font-size: 15px;
}

.gijutsu-p,
.maker-p{
  text-align: left;
  font-size: 16px;
}

.img-kasane-wrap .img-wrap .text{
  left: -50px;
  font-size: 1.5em;
}

.btn01.w400{
  width: 300px;
}

.maker-h3{
  font-size: 16px;
}

.maker-list li .text{
  min-height: auto;
}

.list-shitaji li .text {
    font-size: 14px;
}
}

/* ハウスメーカーぺージのスライダー */
@media(max-width:599px) {
.list-works.housemaker li .list-inner .card {
    display: block;
}

.list-works.housemaker li .list-inner .card .card-img {
    width: 100%;
}

.list-works.housemaker li .list-inner .card .card-content {
    width: 100%;
}

.list-works.housemaker li .list-inner .card .card-content .card-category span {
    font-size: 12px;
}
}


[data-element-id].reason-sp {
    display: block;
}

/* 2024.06.21 */

.seconds10-tel{
  margin-top: 30px;
}

.btn01.banner {
    min-width: 860px;
}

.mt60{
  margin-top: 60px;
}

.sekou-10form dt{
  font-size: 18px;
}

#seko10form{
  display: none;
}

.fs18{
  font-size: 18px;
}

@media (max-width: 599px) {
  .btn01.banner {
    max-width: 100%;
    min-width: 100%;
  }
}

/* 2024/07/11 */
.slick-slide{
  padding-left: 10px;
  padding-right: 10px;
}

@media(max-width:1024px) {
.slide-container{
  margin-top: 30px;
}
}

[data-element-id].slide00{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  position: relative;
  border: 1px solid #000;
  padding-top: 1.5em;
}

[data-element-id].slide00::before{
  content: "バナースライダー";
  display: block;
  background-color: #000;
  color: #fff;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.search-container .ttl{
  background-color: var(--bg-color-01);
  color: #fff;
  font-size: 36px;
  text-align: center;
  border-radius: 20px;
  padding: 0.5em 0;
  position: relative;
  cursor: pointer;
}

.search-container .ttl .btn-wrap{
  position: absolute;
  right: 50px;
  top: 50%;
  transform: translate(0, -50%);
}

.search-container .contents{
  margin-top: 20px;
}

.search-container .btn {
    width: 20px;
    height: 20px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 24px;
    position: relative;
}

.search-container .btn:before {
    content: "";
    width: 20px;
    height: 4px;
    display: block;
    border-radius: 20px;
    background-color: #fff;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.search-container .btn:after {
    content: "";
    width: 4px;
    height: 20px;
    display: block;
    border-radius: 20px;
    background-color: #fff;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.search-container.action .btn:after {
    -webkit-transition: linear 0.3s;
    transition: linear 0.3s;
    -webkit-transform: translate(-50%, -50%) rotate(90deg);
    transform: translate(-50%, -50%) rotate(90deg);
}

@media(max-width:599px) {
.search-container .ttl{
  font-size: 28px;
}

.search-container .ttl .btn-wrap{
  right: 30px;
}
}

/* 2024/07/17 */
/* TOPぺージのバナースライダー */
#slide00 .slick-prev,
#slide00 .slick-next{
  top: auto;
  bottom: -35px;
  left: 40%;
  transform: translate(-50%, -50%);
  z-index: 1
}

#slide00 .slick-next{
  left: auto;
  right: 39.5%;
  transform: translate(0, -50%);
}

#slide00 .slick-prev:before{
  content: "\f053";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  line-height: 1; 
  color: #333;
}

#slide00 .slick-next:before{
  content: "\f054";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  line-height: 1; 
  color: #333;
}

@media(max-width:1024px){
#slide00 .slick-prev,
#slide00 .slick-next{
  left: 35%;
}

#slide00 .slick-next{
  left: auto;
  right: 34%;
}    
}

@media(max-width:599px){
#slide00 .slick-prev,
#slide00 .slick-next{
  left: 20%;
}

#slide00 .slick-next{
  left: auto;
  right: 18.5%;
}    
}

/* 施工事例の検索フォーム */
#generated-text{
  width: 100%;
  text-align: center;
  font-weight: bold;
}


@media (max-width: 599px) {
.info-container {
  padding: 0.3em 0;
}

h1 {
 line-height: 1.2;
}
}

/* 2024.08.01 */

.top-youtube{
  display: flex;
  justify-content: space-between;
}

.youtube020304{
  display: block;
  width: 45%;
  
}

.youtube0304{
  display: flex;
  justify-content: space-between;
  padding-top: 2%;
}

.pdt140{
      padding-top: 140px;
      padding-bottom: 100px;
}

.fs20{
  font-size: 20px !important;
}

.youtube01{
  width: 55%;
  
}

.youtube0304 div{
  width: 48%;
}

.youtube02 img{
  margin: auto;
    width: 100%;
}

.youtube01 p{
  text-align: center;
  margin-top: 10px;
    font-size: 18px;
}

.shippai{
  text-align: center;
}

.youtube-movie{
  width: 100%;
    margin: 0 auto 50px;
}

.youtube-movie iframe{
  width: 100%;
    height: 560px;
}

.youtube-movie02{
  width: 83%;
    margin: 0 auto 50px;
}


@media (max-width: 1024px) {
  .top-youtube {
    display: block;
  }

.youtube01 {
    width: 83%;
    margin: 0 auto 30px;
}

.youtube020304 {
    display: block;
    width: 83%;
    margin: auto;
}

.youtube0304 {
    display: flex;
    justify-content: space-between;
    padding-top: 7%;
}

.youtube-movie iframe {
    width: 100%;
    height: 414px;
}

.youtube-movie02 {
    width: 96%;
}
}


@media(max-width:599px) {
  .pdt140 {
    padding-top: 60px;
    padding-bottom: 70px;
}

.youtube01 {
        width: 99%;
        margin: 0 auto 30px;
}

.youtube01 p {
    text-align: left;
    margin-top: 7px;
    font-size: 16px;
}

    .youtube020304 {
        display: block;
        width: 99%;
}

    .youtube-movie iframe {
        width: 100%;
        height: 217px;
    }
}

/* 2024.08.05 */
.list-pickup .list-inner a{
  display: flex;
  justify-content: space-between;
  border: 3px solid var(--text-color-01);
  border-radius: 20px;
  overflow: hidden;
  height: 100%;
}

.list-pickup .list-inner a .img-wrap{
  width: 50%;
}

.list-pickup .list-inner a .content-wrap{
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 24px;
  font-weight: bold;
  margin-left: 1em;
  position: relative;
}

.list-pickup .list-inner a .content-wrap .btn-icon{
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  background-color: var(--bg-color-01);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  padding: 8px;
}

.list-pickup .list-inner a .content-wrap .en{
  color: var(--text-color-01);
  font-size: 80%;
}

@media(max-width:1024px){
.list-pickup .list-inner a .content-wrap{
  font-size: 22px;
}  
  
.list-pickup .list-inner a .content-wrap .btn-icon{
  right: 15px;
  width: 20px;
  height: 20px;
  padding: 5px;
}    
}

.list-way .list-inner{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.list-way li{
  border-top: 3px dashed #000;
  border-bottom: 3px dashed #000;
  padding: 1em 0 2.5em;
  position: relative;
}

.list-way li::after{
  content: "▼";
  display: block;
  position: absolute;
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.list-way li:last-child::after{
  content: none;
}

.list-way li +li{
  margin-top: 1em;
  border-top: 0;
}

.list-way .title-wrap{
  display: flex;
  align-items: center;
  font-size: 1.5em;
  margin-bottom: 0.5em;
}

.list-way .title-wrap .num{
  margin-right: 0.5em;
  background-color: #000;
  color: #fff;
  border-radius: 50%;
  width: 2em;
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media(max-width:599px) {
.list-way .list-inner{
  flex-direction: column-reverse;
} 

.list-way li{
  border-top: 1px dashed #000;
  border-bottom: 1px dashed #000;
}

.list-way .text{
  background-color: #fff;
  border: 1px solid #000;
  padding: 0.5em;
}
}

.title10{
  background-color: #ffdf8f;
  padding: 0.5em 0;
  border-radius: 5px;
}

.title10.black{
  background-color: #000;
  color: #fff;
}


.w40{
  width: 65%;
  margin: auto;
}

.w40 img{
  width: 100%;
}


@media(max-width:599px) {
.w40 {
    width: 100%;
    margin: auto;
}

.gnav-sp .list-gnav .item {
    text-align: center;
}
}


.minutes1{
  width: 100%;
}


.minutes1 img{
  width: 100%;
    margin-bottom: 20px;
}

/* 2024/08/07 */
.maker-h3.white{
  background: #fff;
  border: 1px solid #999;
  border-bottom: none;
  color: #000;
  position: relative;
  padding: 0.5em 1em 1em;
}

.maker-h3.white::before{
  content: "";
  display: block;
  width: 100%;
  height: 10px;
  background-color: #77a5c8;
  position: absolute;
  bottom: 0;
  left: 0;
}

.maker-h3.white.sumitomo::before{
  background-color: #008d54;
}

.maker-h3.white.daiwa::before{
  background-color: #e6324c;
}

.maker-h3.white.sekisui::before{
  background-color: #21529F;
  width: 50%;
}

.maker-h3.white.sekisui::after{
  content: "";
  display: block;
  width: 50%;
  height: 10px;
  position: absolute;
  bottom: 0;
  right: 0;  
  background-color: #F40028;
}


.kokuchi{
  margin-top: -40px;
}

.kokuchi-img{
width: 63%;
    margin: 0 auto 60px;
}

@media (max-width: 1024px) {
  .kokuchi-img {
    width: 90%;
  }
}

@media (max-width: 599px) {
  .kokuchi {
    margin-top: 0px;
}

.kokuchi-img {
        width: 100%;
        margin: 0px auto 40px;
}
}


/* 2024.09.10 */

.simulationtel-flex{
  display: flex;
  justify-content: space-between;
}

.simulationwtel-p{
  width: 66%;
}

.simulationtel-img{
  width: 33%;
}

.simulationtel-img img{
  width: 100%;
}

.simulation-tel-box{
  margin: 40px auto;
  background: #fff;
  width: 48%;
}

.simulationtel-tel{
  border: 3px solid #19bc03;
}

.simulationtel-telp{
  padding: 8px 0;
    text-align: center;
    background: #fff !important;
}

.simulation03 {
    background: #e3860e;
    color: #fff;
    padding: 5px 8px;
    border-radius: 10px;
    margin-right: 8px;
    font-size: 18px;
}

.simulation-kohcira{
  background: #19bc03;
    color: #fff;
    padding: 7px 0;
    text-align: center;
    font-size: 20px;
    margin-bottom: 10px;
}

.simulation-mimashita {
    font-size: 22px;
    margin-bottom: 20px;
    border-left: 8px solid #e9038d;
    padding-left: 10px;
    margin-left: 10px;
    margin-top: 30px;
}

.simulation-muryo{
  margin-left: 3px;
    color: #e9038d;
    font-size: 22px;
    font-weight: bold;
}

.simulation-03block{
  margin-left: 10px;
}

.raijo{
  text-align: center;
    padding: 10px 0;
}

.simulation-flex{
  display: flex;
justify-content: space-between;
}

.simulation-net-p01{
  margin-top: 21px;
    background: #e9038d;
    margin-bottom: 20px;
    padding: 20px 0;
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
}

.simulation-net-p02{
  
    background: #e9038d;
    padding: 20px 0;
    text-align: center;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
}

.net-kohcira{
  background: #e3860e;
}

.web24{
  color: #e3860e;
    margin-left: 32px;
    font-size: 20px;
    font-weight: bold;
}

.pc-none{
  display: none;
}


@media (max-width: 1024px) {
  .simulation-flex {
    display: block;
  }

.simulation-tel-box {
    width: 100%;
}
}

@media(max-width:599px) {
.simulation-mimashita {
    font-size: 16px;
    margin-top: 10px;
}

.simulation03 {
    font-size: 14px;
}

.simulation-muryo {
    font-size: 20px;
}

.simulation-03block {
    margin-left: 10px;
    margin-bottom: 10px;
    line-height: 1.8;
}

.simulationtel-img {
    width: 37%;
    margin-top: 38px;
}

.simulation-net-p01 {
    margin-top: 21px;
    background: #e9038d;
    margin-bottom: 10px;
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-size: 20px;
}

.simulation-net-p02 {
    background: #e9038d;
    padding: 10px 0;
    text-align: center;
    color: #fff;
    font-size: 20px;
}

.pc-none{
  display: block;
}
}

/* 2024/10/15 */
/* 施工についてぺージの修正 */
.flow-item{
  position: relative;
}

.flow-item::after{
  content: "▶";
  display: block;
  width: 1em;
  height: 1em;
  position: absolute;
  top: 50%;
  right: -10px;
  transform: translate(0, -50%);
  z-index: 1;
}

.flow-item:nth-child(3n)::after{
  content: none;
}

.flow-item:last-child::after{
  content: none;
}

.flow-item-inner{
  padding: 20px;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px #666666;
  height: 100%;
}

.flow-item-ttl{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.5em;
}

.flow-item-img{
  margin-bottom: 0.5em;
}

.flow-item-ttl .num{
  background-color: var(--text-color-01); 
  margin-right: 0.5em;
  color: #fff;
  border-radius: 50%;
  width: 2em;
  height: 2em;
  display: flex;
  justify-content: center;
  align-items: center;
}

.flow-item-ttl .text{
  font-size: 1.2em;
  border: none;
}

.koutei-scroll-img{
  display: none;
}

#slide02 .slick-prev,
#slide02 .slick-arrow{
  z-index: 1;
  color: #000;
  background-color: #dddddd;
  width: 30px;
  height: 30px;
}

#slide02 .slick-prev {
    left: 25px;
}

#slide02 .slick-next {
    right: 25px;
}

#slide02 .slick-next {
    right: 25px;
}

#slide02 .slick-list{
  padding: 10px 50px !important;
}

#slide02 .slick-track {
  display: flex;
}

#slide02 .slick-slide{
  height: auto;
}

@media(max-width:599px) {
.flow-item::after{
  content: none;
}

.koutei-scroll-img{
  display: block;
}
}

[data-element-id].koutei-scroll-img{
  display: block;
}

/* スライド別バージョン */
.koutei-flow-container.ver02 .flow-item:first-child{
  display: none;
}

.koutei-flow-container.ver02 .flow-item:nth-child(3n)::after{
  content: "▶";
}

.koutei-flow-container.ver02 .flow-item:nth-child(4)::after,
.koutei-flow-container.ver02 .flow-item:nth-child(7)::after,
.koutei-flow-container.ver02 .flow-item:nth-child(10)::after {
  content: none;
}


.flow-item.first{
  display: flex;
  align-items: center;
}

@media(max-width:599px) {
.koutei-flow-container.ver02 .flow-item:first-child{
  display: block;
}

.koutei-flow-container.ver02 .flow-item:nth-child(3n)::after{
  content: none;
}
}

[data-element-id].koutei-flow-container.ver02 .flow-item:first-child{
  display: block;
}

/* TOPぺージの修正 */
.btn01.arrow button::after{
  content: "▶";
  display: block;
  color: #fff;
  margin-left: 0.5em;
}

.list-housemaker.ver02{
  background-color: transparent;
}

.list-housemaker.ver02 li{
  padding: 0.5em 1em;
}

.list-housemaker.ver02 li:nth-child(1){
  background: linear-gradient(90deg, #2255A4 0%, #2255A4 50%, #FA0026 50%, #FA0026 100%);
}

.list-housemaker.ver02 li:nth-child(2){
  background: #0872BE;
}

.list-housemaker.ver02 li:nth-child(3){
  background: #D0002A;
}

.list-housemaker.ver02 li:nth-child(4){
  background: #4D4D4D;
}

.list-housemaker.ver02 li:nth-child(5){
  background: #0075C2;
}

.list-housemaker.ver02 li:nth-child(6){
  background: #0068B6;
}

.list-housemaker.ver02 li:nth-child(7){
  background: #D5000F;
}

.list-housemaker.ver02 li:nth-child(8){
  background: #A61E42;
}

.list-housemaker.ver02 li:nth-child(9){
  background: linear-gradient(90deg, #006F8A 0%, #006F8A 33%, #EC6C00 33%, #EC6C00 66%, #E85383 66%, #E85383 100%);
}

.list-housemaker.ver02 li:nth-child(10){
  background: #9BA800;
}

.list-housemaker.ver02 li:nth-child(11){
  background: #172a88;
}

.banner002.transparent {
  background-color: transparent;
}

.banner002 .btn01 a{
  display: flex;
}

@media(max-width:599px) {
.list-housemaker.ver02 li {
    width: 100%;
    text-align: center;
}    
}

/* 2024/11/07 */
/* 補助金・助成金・保険についてぺージ */
.lp-section .strong01{
  color: var(--text-color-01);
  font-weight: bold;
}

.lp-section .strong02{
  color: red;
  font-weight: bold;
}

.lp-section .strong03{
  color: #d37283;
  font-weight: bold;
}

.lp-section .strong04{
  color: #2b95b4;
  font-weight: bold;
}

.lp-section .strong05{
  color: var(--text-color-03);
  font-weight: bold;
}

.lptitle01{
  font-size: 36px;
  margin-bottom: 1em;
  line-height: 1.2;
}

.lptitle01 .half{
  font-size: 50%;
}

.lptitle02{
  font-size: 24px;
  text-align: center;
  display: flex;
  justify-content: center;
}

.lptitle02:before{
  display: block;
  content: "/";
  margin-right: 0.5em;
  transform: scale(-1, 1);
}

.lptitle02:after{
  display: block;  
  content: "/";
  margin-left: 0.5em;
}

.lptitle03{
  font-size: 24px;
  text-align: center;
  background-color: var(--bg-color-01);
  color: #fff;
  border-radius: 10px;
  padding: 0.25em 0.5em;
}

.lptitle03.ver02{
  background-color: #e3ebb7;
  color: #333;
  font-weight: bold;
}

.lptitle04{
  font-size: 20px;
  font-weight: bold;
  background: #fff;
    padding: 15px;
}

.lptitle05{
  font-size: 24px;
  text-align: center;
  font-weight: bold;
}

.img-wrap.br1em{
  border-radius: 1em;
  overflow: hidden;
}

.list-koumoku li{
  background-color: var(--bg-color-01);
  color: #fff;
  padding: 0.25em 0.5em;
  text-align: center;
  border-radius: 1em;
}

.list-koumoku li+li{
  margin-top: 0.5em;
}

.list-koumoku li:nth-child(2),
.list-koumoku li:nth-child(4){
  background-color: #e7ad82;
}

.intro {
  font-size: 24px;
  width: fit-content;
  border-bottom: 1px dotted #999;
  padding-bottom: 1em;
  margin: 100px auto 75px;
  text-align: center;
  position: relative;
}

.intro::after{
  content: "▼";
  position: absolute;
  bottom: -35px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 1;
}

.list-comment li{
  display: flex;
  justify-content: space-between;
}

.list-comment li+li{
  margin-top: 20px;
}

.list-comment li .img-wrap{
  width: 20%;
}

.list-comment li .comment-wrap{
  width: 75%;
  background-color: #fff;
  border-radius: 1em;
  padding: 30px;
}

.list-comment li:nth-child(even){
  flex-direction: row-reverse;
}

.img-btn{
  display: flex;
  justify-content: center;
}

.img-btn a{
  display: block;
  width: 300px;
  text-align: center;
}

.img-btn img{
  max-width: 200px;
  background-color: #fff;
  border-radius: 50px 50px 0 0;
  padding: 50px 25px 25px 25px;
}

.img-btn .text{
  max-width: 300px;
  border: 3px solid var(--text-color-01);
  border-radius: 1em;
  background: #fff;
  padding: 0.5em;
  text-align: center;
  position: relative;
}

.img-btn .text:after{
  content: "▼";
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: -25px;
  background-color: var(--bg-color-01);
  color: #fff;
  font-size: 10px;
  border-radius: 100%;
  padding: 10px;
}

.disaster-container-inner{
  padding: 50px;
  background-color: #fff;
}

.disaster-container .ttl{
  border-radius: 1em 1em 0 0;
    background-color: var(--bg-color-01);
    color: #fff;
    text-align: center;
    padding: 0.5em 0.5em;
    font-size: 18px;
}

.kasaihoken-jirei .jirei01 .ttl{
  color: #d37283;
}

.kasaihoken-jirei .jirei01 .ttl02{
  background-color: #d37283;
  color: #fff;
  padding: 0.5em;
  border-radius: 1em;
}

.kasaihoken-jirei .jirei02 .ttl{
  color: #2b95b4;
}

.kasaihoken-jirei .jirei02 .ttl02{
  background-color: #2b95b4;
  color: #fff;
  padding: 0.5em;
  border-radius: 1em;
}

@media(max-width:599px) {
.up-tal\@sp{
  text-align: left;
}  
  
.lptitle01{
  font-size: 24px;
}

.lptitle01 .half{
  font-size: 60%;
}

.lptitle02{
  font-size: 20px;
  display: block;
  position: relative;
  padding: 0 1em;
}

.lptitle02:before{
  position: absolute;
  top: 0;
  left: 0;
}

.lptitle02:after{
  position: absolute;
  top: 0;
  right: 0;
}

.lptitle03{
  font-size: 18px;
}

.intro {
  font-size: 20px;
  text-align: left;
  margin: 50px auto 75px;
}
}

/* ローンについてぺージ */
.loanicon-container .item .list-inner{
  background-color: #e3ebb7;
  padding: 20px;
  border-radius: 1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.loanicon-container .item .list-inner .img-wrap{
  width: 30%;
  background-color: #fff;
  padding: 30px;
  border-radius: 1em;  
}

.loanicon-container .item .list-inner .text-wrap{
  width: 65%;
  background-color: #00773A;
  color: #fff;
  text-align: center;
  padding: 1em;
  border-radius: 1em;
}

.loan-container{
  background-color: #fff;
  padding: 50px;
}

.loan-container .ttl{
  background-color: #00773A;
  color: #fff;
  padding: 0.5em;
  border-radius: 1em;
  width: fit-content;
  margin-bottom: 20px;
}

.loan-container dl{
  display: flex;
  justify-content: space-between;
}

.loan-container dl+dl{
  margin-top: 10px;
}

.loan-container dt{
  width: 20%;
    background-color: #d37283;
    color: #fff;
    text-align: center;
    padding: 0.5em 0.5em;
    display: grid;
    align-items: center;
}

.loan-container dd{
  width: 75%;
  color: #d37283;
}

.list-loanflow li{
  display: flex;
  align-items: center;
}

.list-loanflow .num{
  background-color: red;
  color: #fff;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.5em;
  height: 1.5em;
  margin-right: 0.5em;
}

.list-loanflow .text{
  display: block
}

.list-loanflow li:nth-child(even){
  padding-left: 2em;
  margin-bottom: 15px;
}

@media(max-width:599px) {
.loan-container{
  padding: 20px;
}    
}


.insta-box{
  display: flex;
    width: 98%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    flex-wrap:wrap;
}

.insta-box li{
  width: 33%;
    padding: 2% 2%;
}

.insta-more{
  width: 250px;
    margin: 20px auto;
    padding: 20px 30px;
    font-size: 20px;
    color: #fff;
    border-radius: 2em;
    background-color: var(--bg-color-01);
    display: flex;
    justify-content: center;
}

.insta-more .btn-icon{
  width: 20px;
    align-items: center;
    display: flex;
}

.insta-more p{
  margin-right: 10px;
}

.bottom-arrow_02 {
    padding-top: 7vw;
}


@media(max-width:599px) {
  .insta-box li {
    width: 33%;
    padding: 1% 1%;
}

.insta-more {
    width: 200px;
    margin: 20px auto;
    padding: 15px 30px;
    font-size: 18px;
}

.insta-more .btn-icon {
    width: 16px;
}

.bottom-arrow_02 {
    padding-top: 4rem;
}
}

.fs26{
  font-size: 26px !important;
}

.fs38{
  font-size: 38px !important;
}

.hojo-h2{
  line-height: 1.5;
}

@media(max-width:599px) {
  .fs26 {
    font-size: 20px !important;
}

.fs38 {
    font-size: 28px !important;
}

}

.kugiri{
  border: 1px dotted;
    margin: 40px auto;
}

.hojotel{
justify-content: center;
}

.mt50{
  margin-top: 50px;
}

/* 2024/12/17 */
/* 年末年始のお知らせのＭＶを出すときに奈良の外壁塗装、屋根塗装専門店！～を削除 */
.index .mainvisual-content .catch {
  opacity: 0;
}

.five .index .mainvisual-content .catch {
  opacity: 1;
}

@media(max-width:599px) {
.list-medal{
  opacity: 0;
}

.five .list-medal{
  opacity: 1;
}
}



.hope-06 label{
  padding: 8px 20px 8px 3px;
} 

.healing-p{
  background: #315bb5 !important;
    padding: 5px;
}


.samu-img{
  margin-top: 15px;
  margin-bottom: 10px;
}



/* 2025.04.25 */

.coco-youtube{
  width: 50% !important;
}


@media (max-width: 1024px) {
.coco-youtube {
    width: 66% !important;
}
}

@media (max-width: 599px) {
.coco-youtube {
   width: 100% !important;
}

.coco-youtube iframe{
height: 203px;
}
}

/* 2025/05/15 */
.info-container.verchat .info-wrap .area {
  padding: 0.5em;
  font-size: 12px;
  text-align: center;
}

.info-container.verchat .info-wrap .open {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.info-container.verchat .info-wrap .open .span01 {
  display: block;
  text-align: center;
  margin-right: 0;
  width: 45%;
}

.info-container.verchat .info-wrap .open .span02 {
  display: block;
  width: 45%;
}

.info-container.verchat .info-wrap .open .span03 {
  display: block;
  width: 100%;
  text-align: center;
}

.info-container.verchat .info-wrap .tel-wrap {
  font-size: 22px;
  text-align: center;
}

.info-container.verchat .info-wrap .tel-wrap .tel {
  font-size: 24px;
}

@media(max-width:1024px){
.info-container.verchat .imgwrap {
    text-align: center;
} 
  
.info-container.verchat .info-wrap {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.info-container.verchat .info-wrap .area {
  text-align: left;
}

.info-container.verchat .info-wrap .tel-wrap {
  text-align: center;
}

.list-medal-box.verchat {
  width: 100%;
  max-width: 100%;
  display: flex;
  justify-content: center;
}
  
.list-medal.verchat{
  opacity: 1;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.list-medal.verchat li{
  width: calc( (100% - 30px) / 4 );
}

.chatbot-sectionin{
  width: 100%;
}
}

/* 2025/05/26 */
.lpimgwrap{
  display: flex;
  justify-content: center;
}

.lpbgc00{
  background-color: #cccccc;
}

.lpbgc01{
  background-color: #F8F5EF;
}

.lp-whitebox{
  background-color: #fff;
  padding: 20px;
}

.lptitle06{
  color: #0E63B0;
  font-weight: bold;
}

.lptitle07{
  color: #664630;
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 1em;
}

.lptitle08{
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 1em;
  border-left: 3px solid #07A469;
  padding-left: 1em;
}

.lptitle09{
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 1em;
  position: relative;
}

.lptitle09::before{
  content: "";
  width: 30px;
  height: 3px;
  display: block;
  background-color: #07A469;
  position: absolute;
  bottom: -0.5em;
  left: 50%;
  transform: translateY(-50%);
  z-index: 1;
}

.lp-list li{
  padding-left: 1.5em;
  text-indent: -1.5em;
  font-size: 18px;
}

.lp-list li::before{
  content: "\f14a";
  font-family: "Font Awesome 6 Free";
  font-weight: 400;
  line-height: 1;
  margin-right: 0.5em;
}

.lp-list.ver02 li::before{
  content: "";
  display: inline-block;
  margin-right: 0.5em;
  width: 16px;
  height: 16px;
  background-color: #000;
  border-radius: 100%;
}

.komidashi.ver02{
  transform: rotate(355deg);
  font-weight: bold;
}

.lptxtwrap.brown{
  color: #664630;
}

.banner-container01-in.ver02{
  padding-top: 200px;
}

.baby{
  width: fit-content;
  position: absolute;
  top: 100px;
  transform: translateY(-50%);
  left: 63%;
  z-index: 1;
}

@media(max-width:1024px){
.banner-container01-in.ver02{
  padding-top: 250px;
}

.baby{
  left: 66%;
}
}

@media(max-width:599px) {
.banner-container01-in.ver02{
  padding-top: 100px;
}

.baby{
  top: 30px;
}

.komidashi.ver03{
  font-size: 1.25em;
}

.lptitle07{
  font-size: 20px;
}

.lptitle08{
  font-size: 20px;
}
}

/* 2025/05/28 */
.list-menu-new li .list-inner a{
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--bg-color-02);
  padding: 20px;
  border-radius: 20px;
}

.list-menu-new li .list-inner a::after{
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background-color: var(--bg-color-01);
  background-image: url('/import/tenant_1/162.43.27.166/html/images/btn-iconfff.webp');
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  right: -15px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}

.list-menu-new li .list-inner .img-wrap{
  width: 30%;
  border-radius: 10px;
  overflow: hidden;
}

.list-menu-new li .list-inner .content-wrap{
  width: 65%;
}

.list-menu-new li .list-inner .content-wrap .ttl{
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 0.5em;
}

.list-menu-new li .list-inner .content-wrap .price{
  font-size: 1.5em;
  color: red;
}

.list-menu-new li .list-inner .content-wrap .price .strong{
  font-size: 2em;
}

.list-menu-new li .list-inner a{
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: var(--bg-color-02);
  padding: 20px;
  border-radius: 20px;
}

@media(max-width:1024px){
.list-menu-new{
  width: calc( 100% - 15px );
}

.list-menu-new li+li{
  margin-top: 10px;
}
}

@media(max-width:599px) {
.list-menu-new li .list-inner .content-wrap .ttl{
  font-size: 1.25em;
}

.list-menu-new li .list-inner .content-wrap .price{
  font-size: 1.25em;
}

.list-menu-new li .list-inner .content-wrap .price .strong{
  font-size: 1.5em;
}

.list-menu-new li .list-inner .img-wrap{
  width: 40%;
}

.list-menu-new li .list-inner .content-wrap{
  width: 55%;
}

.list-menu-new li .list-inner .img-wrap>div{
  height: 100%;
}
}

.mt3rem{
  margin-top: 3rem;
}

/* 2025/06/10 */
/* 商品メニューぺージ */
.list-productmenu{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  background-color: #fff;
  padding: 20px;
  border: 1px solid #000;
}

.list-productmenu li{
  width: calc((100% - 40px) / 3);
}

.list-productmenu li a{
  display: block;
  width: 100%;
  height: 100%;
  background-color: #4472C4;
  color: #fff;
  text-align: center;
  font-size: 18px;
  padding: 0.5em 0;
}

.list-productmenu.ver02 li{
    background-color: #4472C4;
    color: #fff;
    text-align: center;
    font-size: 18px;
    padding: 0.5em 0;
}

.list-productmenu.ver03{
  background-color: transparent;
  border: none;
}

.list-productmenu.ver03 li{
    background-color: #fff;
    color: #000;
    border: 2px solid #000;
    padding: 0.5em;
    border-radius: 10px;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}


.bluebox{
  background-color: #5B9BD5;
  padding: 30px;
  border-radius: 50px;
}

.productmenutxt{
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 2;
}

.productmenutxt.ver02 {
  font-size: 24px;
}

.productmenutxt .strong01{
  background-color: #FFC000;
  color: #000;
  padding: 0.5em;
  margin-right: 0.5em;
}

.productmenutxt .strong02{
  color: red;
}

.productmenuflex{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;  
}

.productmenuflex li{
  width: calc((100% - 40px) / 3); 
}

.productmenuflex li .ttl{
  text-align: center;
  margin-bottom: 10px;
  font-size: 18px;
  font-weight: bold;
}

.productmenuflex.ver02 li .img{
  border-radius: 100%;
  overflow: hidden;
}

.productmenuflex.ver02 li .txt{
  text-align: center;
}

.list-productmenu-toryo{
  display: flex;
  flex-wrap: wrap;
  gap: 30px 10px;
}

.list-productmenu-toryo li{
  width: calc((100% - 30px) / 4);
}

.list-productmenu-toryo li .ttl{
  font-size: 18px;
  text-align: center;
}

.list-productmenu-toryo li .content{
  background-color: #EDAD6B;
  padding: 20px;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.list-productmenu-toryo li:nth-child(even) .content{
  background-color: #DEE9BC;
}

.list-productmenu-toryo.ver02 li .content{
  background-color: #8EB2BB;
}

.list-productmenu-toryo.ver02 li:nth-child(even) .content{
  background-color: #F5DDE8;
}

.list-productmenu-toryo li .price{
  font-weight: bold;
  text-align: center;
}

.list-productmenu-toryo li .price .strong{
  color: red;
  font-size: 2em;
  font-family: 'Noto Sans JP';
}

.list-productmenu-toryo li .taxprice{
  text-align: center;
}

.list-productmenu-toryo li .btn a{
  display: block;
  width: fit-content;
  margin: 0 auto; 
  height: 100%;
  background-color: #083190;
  color: #fff;
  text-align: center;
  margin-top: 10px;
  padding: 0.5em 1em;
}

.list-productmenu-toryo li .list-content li{
  background-color: #fff;
  width: 100%;
  padding: 0.5em;
  text-align: center;
}

.list-productmenu-toryo li .list-content li+li{
  margin-top: 0.5em;
}

.productmenu_btn a{
  display: block;
  width: 300px;
  margin: 0 auto;
  background-color: #4472c4;
  color: #fff;
  border-radius: 10px;
  padding: 0.5em 0;
  text-align: center;
}

.list-productflow{
  display: flex;
  justify-content: center;
  gap: 10px;
  background-color: #EDFAFF;
  padding: 20px;
}

.list-productflow.ver02{
  background-color: #FFEEEE;
}

.list-productflow li{
  width: calc((100% - 40px) / 5);
  position: relative;
}

.list-productflow li.arrow{
  display: flex;
  justify-content: center;
  align-items: center;
}

.list-productflow li.arrow .img{
  max-width: 50px;
  margin: 0 auto;
}

.list-productflow li.arrow .img.ver02{
  margin-top: 24px;
}

.list-productflow li.fukidashiwrap{
  background-color: #f8bd1b;
  height: 50%;
}

.list-productflow li.fukidashiwrap .in{
  padding: 30px;  
  position: relative;
  transform: rotate(-10deg);
  z-index: 1;
}

.list-productflow li.fukidashiwrap .in::after{
  content: "";
  width: 60px;
  height: 30px;
  background-color: #f8bd1b;
  position: absolute;
  bottom: 5px;
  left: 0px;
  z-index: -1;
}

.c01{
  color: #F39800;
}

.c02{
  color: #EA5414;
}

.c03{
  color: #00A1E9;
}

.c04{
  color: #ee7800;
}

.label01{
  color: #833c0b;
  background-color: lightgray;
  padding: 0.25em;
  border-radius: 10px;
}

.label02{
  color: #833c0b;
  background-color: #EDFAFF;
  padding: 0.25em;
  border-radius: 10px;
}

.label03{
  color: #833c0b;
  background-color: #ffe357;
  padding: 0.25em;
  border-radius: 10px;
}

.productmenu_box04 .windowimg{
  position: relative;
}

.productmenu_box04 .windowimg .deco01{
  position: absolute;
  bottom: 35%;
  left: 50px;
  background-color: #fff;
  color: #000;
  font-size: 12px;
  padding: 0.25em 0.5em;
}

.productmenu_box04 .windowimg .deco02{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%);  
  background-color: #ee7800;
  color: #fff;
  font-size: 12px;
  padding: 0.25em 0.5em;
}

.productmenu_box04 .windowimg .deco03{
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: gray;
  color: #fff;
  font-size: 12px;
  width: 6em;
  height: 6em;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  transform: rotate(-10deg);
}

.productmenu_box{
  border: 5px solid #27B597;
  background-color: #D5EAD7;
  padding: 20px;
}

.productmenu_box .ttl{
  color: #146435;
  font-weight: bold;
  font-size: 78px;
  text-shadow: 2px 2px 0px white, -2px 2px 0px white, 2px -2px 0px white, -2px -2px 0px white, 2px 0px 0px white, 0px 2px 0px white, -2px 0px 0px white, 0px -2px 0px white;
  font-family: 'Noto Sans JP';
}

.productmenu_box .ttl .sub{
  font-size: 30%;
}

.productmenu_box .img{
  position: relative;
}

.productmenu_box .heibei{
  position: absolute;
  bottom: 10px;
  left: 10px;
  background-color: #fff;
  color: #000;
  border: 3px solid #000;
  font-size: 30px;
  font-weight: bold;
  padding: 0.5em;
}

.productmenu_box .price{
  font-size: 120px;
  font-weight: bold;
  color: #fff;
  text-shadow: 2px 2px 0px red, -2px 2px 0px red, 2px -2px 0px red, -2px -2px 0px red, 2px 0px 0px red, 0px 2px 0px red, -2px 0px 0px red, 0px -2px 0px red;
  line-height: 1;
  font-family: 'Noto Sans JP';
}

.productmenu_box .price .sub{
  font-size: 30%;
  line-height: 1.25;
}

.productmenu_box .txt{
  font-family: 'Noto Sans JP';
}

.up-w-49\%{
  width: 49%;
}

.productmenu_box02{
  border: 5px solid #6B6A6B;
  background-color: #F8DFEB;
  padding: 20px;
}

.productmenu_box02 .ttl{
  color: #6B6A6B;
  font-weight: bold;
  font-size: 60px;
  text-shadow: 2px 2px 0px white, -2px 2px 0px white, 2px -2px 0px white, -2px -2px 0px white, 2px 0px 0px white, 0px 2px 0px white, -2px 0px 0px white, 0px -2px 0px white;
  font-family: 'Noto Sans JP';
}

.productmenu_box02.ver02 .ttl{
  color: #7B4698;
}

.productmenu_box02 .ttl .sub{
  font-size: 50%;
  text-align: center;
}

.productmenu_box02 .txt{
  color: #6B6A6B;
  font-family: 'Noto Sans JP';
  font-weight: bold;
}

.productmenu_box02 .txt02{
  background-color: #6B6A6B;
  color: #fff;
  padding: 0.25em;
  font-family: 'Noto Sans JP';
}

.productmenu_box02.ver02 .txt02{
  background-color: #7b4698;
}

.productmenu_box02 .price{
  font-weight: bold;
  color: red;
  font-size: 1.25em;
  font-family: 'Noto Sans JP';
  text-align: right;
  margin-top: 0.25em;
  margin-bottom: 1em;
}

.productmenu_box02 .price .mini{
  font-size: 0.75em;
}

.productmenu_box03{
  background-color: #FEFAC7;
  padding: 20px;
}

.productmenu_box03 .imgwrap{
  display: flex;
  justify-content: space-between;
}

.productmenu_box03 .imgwrap .img{
  width: 49%;
  position: relative;
}

.productmenu_box03 .imgwrap .img.before::before{
  content: "Before";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: #1E7FC0;
  color: #fff;
  padding: 0.25em;
}

.productmenu_box03 .imgwrap .img.after::before{
  content: "After";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: red;
  color: yellow;
  padding: 0.25em;
}

.productmenu_box03 .contentwrap{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.productmenu_box03 .contentwrap>div{
  width: 49%;
  position: relative;
}

.productmenu_box03 .contentwrap .ttl{
  font-size: 30px;
  font-weight: bold;
  font-family: 'Noto Sans JP';
}

.productmenu_box03 .contentwrap .price{
  font-size: 1.25em;
  color: red;
  font-family: 'Noto Sans JP';
  font-weight: bold;
}

.productmenu_box03 .contentwrap .price .mini{
  font-size: 0.75em;
}

.productmenu_box04{
  background-color: #F7F2E9;
  padding: 20px;
}

.productmenu_box04 .ttl{
  width: fit-content;
  margin: 0 auto;
  background-color: #EDFAFF;
  color: #833C0B;
  font-size: 1.5em;
}

.productmenu_box04.ver02 .ttl{
  background-color: #FFE357;
}

.productmenu_box04 .deco01{
  background-color: #469FD8;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.productmenu_box04.ver02 .deco01{
  background-color: #76BC29;
}

.productmenu_box04 .deco02{
  display: flex;
  gap: 10px;
}

.productmenu_box04 .deco02 span{
  display: block;
  width: 5em;
  height: 5em;
  background-color: #469FD8;
  color: #fff;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.productmenu_box04 .price{
  font-size: 1.75em;
  color: red;
  font-family: 'Noto Sans JP';
  font-weight: bold;
}

.productmenu_box04 .price .price__em {
  font-weight: 700;
  font-size: 1.25em;
}

@media(max-width:1024px){
.list-productmenu-toryo li {
    width: calc((100% - 10px) / 2);
}

.up-w-49\%{
  width: 100%;
}

.list-productflow li::before {
  right: -50%;
  font-size: 14px;  
}

.list-productflow li.fukidashiwrap .in{
  padding: 10px;  
  font-size: 14px;
}
}


@media(max-width:599px) {
.list-productflow {
    padding: 10px;
}  

.list-productflow li.arrow .img {
  max-width: 25px;
}

.list-productflow li.arrow .txt {
  font-size: 10px;
}

.list-productflow li.fukidashiwrap{
  flex: 0.8;
}

.list-productflow li.fukidashiwrap .in {
  font-size: 12px;
  text-align: center;
}

.productmenuflex{
  gap: 10px;  
}

.productmenuflex li{
  width: calc((100% - 10px) / 2); 
}

.list-productmenu-toryo li {
  width: 100%;
}

.productmenu_box .ttl {
  font-size: 44px;
}

.productmenu_box .price{
  font-size: 65px;
}

.productmenu_box02 .ttl{
  font-size: 48px;
}

.productmenu_box .heibei{
  font-size: 20px;
}

.productmenu_box03+.productmenu_box03{
  margin-top: 20px;
}

.productmenu_box03 .contentwrap .price {
  font-size: 1em;
}

.list-productflow li::before {
  top: 105%;
  right: -100%;
  font-size: 10px;
}

.list-productflow li+li::before {
  left: -55%;
}

.productmenu_box03 .contentwrap>div{
  width: 100%;
}

.productmenu_box02 .price{
  font-size: 0.9em;
}

.productmenutxt.ver02 {
  font-size: 16px;
}

.list-productmenu.ver03 li{
  width: 45%;
}

.bluebox {
  padding: 20px;
}

.list-productflow.ver02 li+li::before {
  left: -50%;
}

.productmenu_box04 .deco01{
  font-size: 10px;
}

.productmenu_box04 .deco02 span{
  font-size: 10px;
}

.label01{
  font-size: 10px;
}

.label02{
  font-size: 10px;
}

.label03{
  font-size: 10px;
}


.productmenu_box04 .windowimg .deco01{
  bottom: 55%;
  left: 10px;
  font-size: 10px;
}

.productmenu_box04 .windowimg .deco02{
  top: 40%;
  left: 55%;
  font-size: 10px;
}

.productmenu_box04 .windowimg .deco03{
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: gray;
  color: #fff;
  font-size: 12px;
  width: 6em;
  height: 6em;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  transform: rotate(-10deg);
}
}

/* その他の工事ぺージ */
.obi-beige{
  background-color: #FCE7D9;
  padding: 0.5em 0;
  text-align: center;
}

.banner-container01-in.ver02.ver0201 {
    padding-top: 300px;
}

@media(max-width:1024px){
.banner-container01-in.ver02.ver0201 {
    padding-top: 250px;
}    
}

@media(max-width:599px){
.banner-container01-in.ver02.ver0201 {
    padding-top: 100px;
}    
}

/* 2025/06/16 */
.toryo-box{
  font-family: 'Noto Sans Japanese';
}

.toryo-box .paint-container {
  margin: 30px auto;
  padding: 20px;
  background: #E49F6B;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05);
  border-radius: 5px;  
}

.toryo-box.ver02 .paint-container {
  background: #DBE5BA;
}

.toryo-box.ver03 .paint-container {
  background: #8AACB5;
}

.toryo-box.ver04 .paint-container {
  background: #F2DBE5;
}

.toryo-box .tagline {
  text-align: center;
  margin-bottom: 10px;
}

.toryo-box .main-title {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 20px;
  background-color: #fff;
  padding: 10px;
}

.toryo-box .main-title span {
  font-size: 20px;
}

.toryo-box .recommend-item {
  flex: 1 1 48%;
  background: #fff;
  border-left: 5px solid #b86922;
  padding: 10px;
  margin: 5px 0;
}

.toryo-box.ver02 .recommend-item {
  border-left: 5px solid #92b421;
}

.toryo-box.ver03 .recommend-item {
  border-left: 5px solid #406f6f;
}

.toryo-box.ver04 .recommend-item {
  border-left: 5px solid #c989ac;
}

.toryo-box .recommend-item span {
  font-weight: bold;
  display: block;
  margin-bottom: 5px;
}

.toryo-box .section-title {
  background: #b86922;
  color: #fff;
  padding: 10px;
  font-weight: bold;
  font-size: 16px;
}

.toryo-box.ver02 .section-title {
  background: #92b421;
}

.toryo-box.ver03 .section-title {
  background: #406f6f;
}

.toryo-box.ver04 .section-title {
  background: #c989ac;
}

.toryo-box .about-section {
  background-color: #fff;
  margin-top: 20px;
}

.toryo-box .about-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding: 20px;
}

.toryo-box .about-text {
  flex: 1 1 60%;
  line-height: 1.6;
}

.toryo-box .about-text .strong {
  font-size: 1.1em;
  color: #d12c00;
}

.toryo-box .about-text li {
  margin-bottom: 10px;
}

.toryo-box .about-image {
  flex: 1 1 35%;
  text-align: center;
}

.toryo-box .about-image img {
  max-width: 100%;
  height: auto;
}

.toryo-box .info-boxes {
  display: flex;
  justify-content: space-between;
  margin: 20px 0;
  gap: 10px;
}

.toryo-box .info-box {
  flex: 1 1 45%;
  background: #fff;
  text-align: center;
  padding: 15px;
  border-radius: 5px;
} 

.toryo-box .info-box span {
  font-size: 20px;
  font-weight: bold;
  color: #d12c00;
}

.toryo-box .price-box {
  text-align: center;
  background: #e4eaf0;
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 5px;
}

.toryo-box.price-label {
  background: #5d90c7;
  display: inline-block;
  padding: 5px 10px;
  color: #fff;
  font-size: 14px;
  border-radius: 4px;
  margin-bottom: 10px;
}

.toryo-box .price-main {
  font-size: 32px;
  font-weight: bold;
  color: #d12c00;
}

.toryo-box .price-main span {
  font-size: 40px;
}

.toryo-box .price-sub {
  font-size: 14px;
  color: #444;
}

.toryo-box .btn {
  display: block;
  background: #e50028;
  color: white;
  text-align: center;
  padding: 15px;
  font-weight: bold;
  font-size: 16px;
  text-decoration: none;
  border-radius: 5px;
  margin-top: 10px;
}

.toryo-box .btn:hover {
  background: #cc0022;
}

.toryo-table-container .table-wrap{
  overflow-x: auto;
}

.toryo-table-container .paint-plan{
  width: 100%;
  min-width: 600px;
}

@media(max-width:599px) {
.toryo-box .info-boxes {
  display: block;
}

.toryo-box .info-box+.info-box {
  margin-top: 10px;
}
}

.prace-li{
  display: flex;
    align-items: center;
    justify-content: center;
}

/* 2025/06/19 */
.list-productmenu-toryo li .ttl.deco01 {
  position: relative;
}

.list-productmenu-toryo li .ttl.deco01 .deco01wrap {
  width: 70px;
  height: 70px;
  background-color: #009b44;
  color: #fff;
  border-radius: 100%;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.list-productmenu-toryo li .ttl.deco02 {
  position: relative;
}

.list-productmenu-toryo li .ttl.deco02 .deco02wrap {
  width: 70px;
  height: 70px;
  background-color: #eb6102;
  color: #fff;
  border-radius: 100%;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.list-productmenu-toryo li .ttl.deco03 {
  position: relative;
}

.list-productmenu-toryo li .ttl.deco03 .deco03wrap {
  width: 70px;
  height: 70px;
  background-color: #e70017;
  color: #fdc800;
  border-radius: 100%;
  position: absolute;
  right: -30px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.list-productmenu-toryo li .ttl.deco03.right0 .deco03wrap {
  right: 0px;
}

@media(max-width:599px) {
.list-productmenu-toryo li .ttl.deco03 .deco03wrap {
  right: 0px;
}    
}


