@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
/* @import url("https://fonts.googleapis.com/css2?family=Anton&display=swap"); */

/* # root1 START # */
/* :root {
    --color01: #ffc569;
    --color02: #fff8ec;
    --color03: #fa6e59;
    --color04: #fff7b5;
    --bgi01: url('/import/tenant_1/162.43.35.243/images/paint02.webp');
    --bgi02: url('/import/tenant_1/162.43.35.243/images/paint00.webp');
    --bgi03: url('/import/tenant_1/162.43.35.243/images/paint01.webp');
    --bgi04: url('/import/tenant_1/162.43.35.243/images/top26.webp');
} */
/* # root1 END # */


/* # root2 START # */
:root {
    --color01: #c82c55;
    --color02: #f7e0e6;
    --color03: #b22249;
    --color04: #f79eb5;
    --bgi01: url('/import/tenant_1/162.43.35.243/images/paint02_002.webp');
    --bgi02: url('/import/tenant_1/162.43.35.243/images/paint00_002.webp');
    --bgi03: url('/import/tenant_1/162.43.35.243/images/paint01_002.webp');
    --bgi04: url('/import/tenant_1/162.43.35.243/images/top26_002.webp');
}
/* # root2 END # */


/* # root3 START # */
/* :root {
    --color01: #8fbc8f;
    --color02: #f5fff5;
    --color03: #618061;
    --color04: #e6fbe6;
    --bgi01: url('/import/tenant_1/162.43.35.243/images/paint02_003.webp');
    --bgi02: url('/import/tenant_1/162.43.35.243/images/paint00_003.webp');
    --bgi03: url('/import/tenant_1/162.43.35.243/images/paint01_003.webp');
    --bgi04: url('/import/tenant_1/162.43.35.243/images/top26_003.webp');
} */
/* # root3 END # */





/* 画像取り込み用 */
.bgi01-orange {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint02.webp');
}

.bgi01-pink {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint02_002.webp');
}

.bgi01-green {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint02_003.webp');
}

.bgi02-orange {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint00.webp');
}

.bgi02-pink {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint00_002.webp');
}

.bgi02-green {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint00_003.webp');
}

.bgi03-orange {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint01.webp');
}

.bgi03-pink {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint01_002.webp');
}

.bgi03-green {
    background-image: url('/import/tenant_1/162.43.35.243/images/paint01_003.webp');
}

.bgi04-orange {
    background-image: url('/import/tenant_1/162.43.35.243/images/top26.webp');
}

.bgi04-pink {
    background-image: url('/import/tenant_1/162.43.35.243/images/top26_002.webp');
}

.bgi04-green {
    background-image: url('/import/tenant_1/162.43.35.243/images/top26_003.webp');
}

body {
    font-family: "Noto Sans JP", sans-serif;
    color: #444;
    letter-spacing: 0.1em;
}

#wrapper {
    min-width: 375px;
    overflow: hidden;
}

/* ##### A-BiSUスライダー uk-slideshow ##### */
.uk-slidenav-position {
    height: 100%;
}

.uk-slideshow {
    height: 100% !important;
    overflow: hidden;
    position: relative;
}

.uk-slideshow::after {
    content: "";
    display: block;
    padding-top: 45%;
}

.uk-slideshow li {
    width: 100%;
    height: 100% !important;
    position: absolute;
    top: 0;
}

.uk-slideshow li>div {
    height: 100% !important;
}

.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;";
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
}

.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-color: #ccc;
}

.uk-dotnav-contrast>.uk-active>* {
    background-color: #565656;
}

.uk-position-bottom {
    bottom: -30px;
}

@media (max-width: 1024px) {
    .uk-slideshow::after {
        padding-top: 70%;
    }
}

@media (max-width: 599px) {
    .uk-slideshow::after {
        padding-top: 70vh;
    }
}

/* ＃＃＃＃＃共通デザイン＃＃＃＃＃ */
.up-reader-change {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fead-cover:before {
    background-color: var(--color01);
    z-index: 3;
}

.list-inner {
    height: 100%;
}

.br-pc {
    display: block;
}

.br-tb {
    display: none;
}

.br-sp {
    display: none;
}

.span-br {
    display: inline-block;
}

.radius50 {
    border-radius: 50px;
}

.letter01 {
    letter-spacing: 0.1em;
}

.logo {
    width: 240px;
    max-width: 100%;
}

.logo a {
    display: block;
}

.white-box {
    overflow: hidden;
    padding: 1em;
    border-radius: 1em;
    background-color: white;
}

.float-parent {
    display: block;
}

.float-parent:before,
.float-parent:after {
    content: "";
    display: block;
    clear: both;
}

/* .float-content .text {
    line-height: 2.0;
} */

.float-wrap .float-parent+.float-parent {
    margin-top: 40px;
}

.float-wrap .float-parent .float-title {
    float: right;
}

.float-wrap .float-parent .float-img {
    float: left;
}

.float-wrap .float-parent .float-content {
    float: right;
}

.float-wrap .float-parent:nth-of-type(even) .float-title {
    float: left;
}

.float-wrap .float-parent:nth-of-type(even) .float-img {
    float: right;
}

.float-wrap .float-parent:nth-of-type(even) .float-content {
    float: left;
}

.float-wrap .float-parent02+.float-parent02 {
    margin-top: 40px;
}

.float-wrap.float-wrap2 .float-parent:nth-of-type(even) .float-title,
.float-wrap.float-wrap2 .float-parent:nth-of-type(even) .float-content {
    float: right;
}

.float-wrap.float-wrap2 .float-parent:nth-of-type(even) .float-img {
    float: left;
}

.float-wrap.-space-mini .float-parent+.float-parent {
    margin-top: 30px;
}

/* .notreverseがついたら画像が左（元）に戻る */
.float-img .notreverse {
    float: left;
}

.radius-img {
    position: relative;
}

.radius-img::before {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--color04);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.radius-img img {
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 50% 50% 40% 60% / 50% 60% 40% 50%;
}

.bg-parent {
    position: relative;
}

.bg-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.bg-img .cliphome {
    width: 100%;
    height: 100%;
}

.bg-img.-dark::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: rgba(0, 0, 0, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.bg-img img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    /* -webkit-filter: brightness(.8);
    filter: brightness(.8); */
}

.bg-img .cliphome {
    top: auto;
    bottom: 0;
    overflow: hidden;
}

.bg-img .cliphome img {
    height: 101% !important;
}

.bg-content {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto;
    position: relative;
    z-index: 2;
}

.lower-keyvisual .bg-content {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 96%;
    margin: auto;
    position: relative;
    z-index: 2;
}

.mask-image {
    -webkit-mask-image: url('/import/tenant_1/162.43.35.243/images/house_shape_002.webp');
    mask-image: url('/import/tenant_1/162.43.35.243/images/house_shape_002.webp');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.txt-orange {
    color: var(--color01);
}

.margin-left-1em {
    margin-left: 1em;
}

@media (max-width: 1024px) {
    .br-tb {
        display: block;
    }
}

@media(max-width:599px) {
    .up-reader-change {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-line-clamp: 2;
    }

    .logo {
        width: 350px;
        max-width: 80%;
    }

    .float-wrap .float-parent .float-title,
    .float-wrap .float-parent .float-img,
    .float-wrap .float-parent .float-content,
    .float-wrap .float-parent:nth-of-type(even) .float-title,
    .float-wrap .float-parent:nth-of-type(even) .float-img,
    .float-wrap .float-parent:nth-of-type(even) .float-content {
        float: none;
    }

    .float-wrap .float-parent:nth-of-type(even) .float-img,
    .float-wrap .float-parent .float-img {
        margin-left: auto;
        margin-right: auto;
    }

    .br-pc {
        display: block;
    }

    .br-sp {
        display: block;
    }

    .radius-img {
        margin-bottom: 1em;
    }


    .card-01 a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .card-img {
        width: 35%;
    }

    .card-content {
        width: 10%;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        margin-left: 1em;
    }

    .map {
        padding-top: 90%;
    }
}

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

.cliphome-relative .uk-slidenav-position::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: rgba(0, 0, 0, 0.2);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.cliphome {
    position: relative;
}

.cliphome::after {
    content: "";
    width: 100%;
    height: 100px;
    display: block;
    background: linear-gradient(to top left, transparent 50%, #fff calc(50% + 1px)) top left / 50% 100% no-repeat,
        linear-gradient(to top right, transparent 50%, #fff calc(50% + 1px)) top right / 50% 100% no-repeat;
    position: absolute;
    top: -0.1px;
    left: 0;
    z-index: 2;
}

.cliphome-absolute {
    width: 100%;
    margin: auto;
    font-size: 80px;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 3;
}



.cliphome-absolute .en {
    font-weight: 800;
    letter-spacing: 0.1em;
}

.cliphome-absolute .main {
    font-weight: 600;
    font-size: 55%;
    letter-spacing: 0.1em;
}


.cliphome-absolute .sub {
    padding: 0 30px;
    font-weight: 600;
    font-size: 30%;
    letter-spacing: 0.1em;
    position: relative;
}

/* .cliphome-absolute .sub::before {
    content: "";
    width: 0.8em;
    height: 2px;
    display: inline-block;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 0;
}

.cliphome-absolute .sub::after {
    content: "";
    width: 0.8em;
    height: 2px;
    display: inline-block;
    background-color: #fff;
    position: absolute;
    top: 50%;
    right: 0;
} */

@media(max-width:1024px) {
    .cliphome-absolute {
        font-size: 56px;
    }

    .cliphome-absolute .en {
        letter-spacing: 0.1em;
    }
}

@media(max-width:599px) {
    .cliphome-absolute {
        font-size: 44px;
    }
}

/* マージンで傾きをつくる 5deg */
.translate-parent {
    margin-top: 10em;
    margin-bottom: 5em;
    -webkit-transform: skew(0, 5deg);
    transform: skew(0, 5deg);
}

.translate-child {
    -webkit-transform: translate(0, -5deg);
    transform: skew(0, -5deg);
    position: relative;
}

.translate-grandchild_01 {
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
}

.translate-grandchild_01 span {
    display: block;
}

.translate-grandchild_02 {
    position: absolute;
    bottom: 5%;
    right: 5%;
}

/* マージンで傾きをつくる 10deg */
.translate-parent10 {
    margin-top: 8em;
    margin-bottom: 8em;
    -webkit-transform: skew(0, 10deg);
    transform: skew(0, 10deg);
}

.translate-child10 {
    -webkit-transform: translate(0, -10deg);
    transform: skew(0, -10deg);
    position: relative;
}

/* 吹き出し */
.balloon {
    width: 150px;
    height: 150px;
    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-weight: bold;
    font-size: 30px;
    color: white;
    line-height: 1.3;
    text-align: center;

    /*outline: 5px solid var(--color01);*/
    border: 5px solid white;
    border-radius: 100%;
    background-color: var(--color01);
    -webkit-box-shadow: 0px 0px 0px 5px var(--color01);
    box-shadow: 0px 0px 0px 5px var(--color01);
    -webkit-transform: rotate(310deg);
    transform: rotate(310deg);
    position: relative;
}

.balloon::before,
.balloon::after {
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
}



.balloon::before {
    content: "";
    width: 0;
    height: 0;
    border-width: 30px 15px 0 15px;
    border-style: solid;
    border-color: var(--color01) transparent transparent transparent;
    bottom: -26px;
    z-index: 3;
}

.balloon::after {
    content: "";
    width: 0;
    height: 0;
    border-width: 35px 17.5px 0 17.5px;
    border-style: solid;
    border-color: white transparent transparent transparent;
    bottom: -34px;
    z-index: 2;
}

.balloon-inner {
    -webkit-transform: rotate(-310deg);
    transform: rotate(-310deg);
}

.balloon-inner::before {
    content: "";
    width: 0;
    height: 0;
    border-width: 40px 20px 0 20px;
    border-style: solid;
    border-color: var(--color01) transparent transparent transparent;
    -webkit-transform: rotate(310deg);
    transform: rotate(310deg);
    position: absolute;
    bottom: -43px;
    right: -47px;
    z-index: 1;
}

.logo-decoy {
    display: none;
}

@media(max-width:1024px) {
    .balloon-inner::before {
        bottom: -34px;
        right: -43px;
    }

    .translate-parent {
        margin-top: 50px;
        margin-bottom: 30px;
    }

    .translate-parent10 {
        margin-top: 0;
        margin-bottom: 0;
    }

    .balloon::before {
        border-width: 20px 10px 0 10px;
        bottom: -19px;
    }

    .balloon::after {
        border-width: 25px 15px 0 15px;
        bottom: -27px;
    }

    .balloon-inner::before {
        border-width: 25px 18px 0 18px;
    }
   
   .balloon {
      width: calc(160px*0.7);
      height: calc(160px*0.7);
      font-size: calc(26px*0.7);
      -webkit-transform: rotate(310deg) scale(0.8);
      transform: rotate(310deg) scale(0.8);
  }
}

@media(max-width:599px) {
    .balloon {
        width: calc(160px*0.7);
        height: calc(160px*0.7);
        font-size: calc(26px*0.7);
    }

    .balloon-inner::before {
        bottom: -34px;
        right: -43px;
    }

    .translate-parent {
        margin-top: 50px;
        margin-bottom: 30px;
    }

    .translate-parent10 {
        margin-top: 0;
        margin-bottom: 0;
    }

    .balloon::before {
        border-width: 20px 10px 0 10px;
        bottom: -19px;
    }

    .balloon::after {
        border-width: 25px 15px 0 15px;
        bottom: -27px;
    }

    .balloon-inner::before {
        border-width: 25px 18px 0 18px;
    }

    .logo-decoy {
        display: block;
        width: 200px;
        position: absolute;
        z-index: 3;
        left: 5px;
        padding-top: 5px;
    }
}

/* 日付用の吹き出し */
.date-balloon {
    width: 110px;
    height: 110px;
    display: inline-block;
    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: 0 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    text-align: center;
    border-radius: 50%;
    background: var(--color01);
    position: relative;
    filter: drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 1px #fff) drop-shadow(0px 0px 1px #fff);
}

.date-balloon:before {
    content: "";
    margin-top: -15px;
    border: 15px solid transparent;
    border-left: 15px solid var(--color01);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    bottom: -8px;
    right: -8px;
    z-index: 0;
}

.guide .date-balloon {
    width: 75px;
    height: 75px;
    display: inline-block;
    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;
    padding: 0 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: bold;
    font-weight: bold;
    font-size: 12px;
    font-size: 20px;
    color: #fff;
    line-height: 1.3;
    text-align: center;
    border-radius: 50%;
    background-color: #c82c55;
    position: relative;
}

.guide .date-balloon::before {
    border-left: 15px solid #c82c55;
}

.guide .date-balloon .small-text {
    font-size: 65%;
}

@media(max-width:599px) {
    .date-balloon {
        width: 100px;
        height: 50px;
        padding: 0;
        font-size: 11px;
    }

    .guide .date-balloon {
        width: 80px;
        height: 80px;
    }
}


/* 斜め線 */
.translate-line {
    display: inline-block;
    padding: 0 1.5em;
    position: relative;
}

.translate-line::before {
    content: "";
    width: 1.5em;
    height: 5px;
    display: inline-block;
    border-radius: 5px;
    background-color: var(--color01);
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    position: absolute;
    top: 50%;
}

.translate-line::after {
    content: "";
    width: 1.5em;
    height: 5px;
    display: inline-block;
    border-radius: 5px;
    background-color: var(--color01);
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
    position: absolute;
    top: 50%;
}

.translate-line::before {
    left: 0;
}

.translate-line::after {
    right: 0;
}

@media (max-width: 1024px) {
    .translate-line {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
}

/* デコ */
.list-deco .card-content {
    background-color: white;
    position: relative;
    z-index: 1;
}

.list-deco li .deco-element {
    height: 100%;
    position: relative;
    z-index: 0;
}

.list-deco li .deco-element::before {
    content: "";
    width: 130px;
    height: 130px;
    display: inline-block;
    background-image: url('/import/tenant_1/162.43.35.243/images/top17.webp');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    z-index: -1;
}

.list-deco li:first-of-type .deco-element::before {
    top: -30px;
    left: -30px;
}

.list-deco li:nth-last-of-type(1) .deco-element::before {
    bottom: -30px;
    right: -30px;
}

@media (max-width: 599px) {
    .list-deco li .deco-element::before {
        width: calc(130px * 0.6);
        height: calc(130px * 0.6);
    }
}

/* 家のデザイン */
.house-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    /* -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end; */
    padding: 80px;
}

/* 天秤のデザイン */
.tenbin {
    width: 98%;
    margin: 0 auto;

    gap: 1em;
}

.tenbin-container {
    margin-bottom: 2.5em;
}

.tenbin-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    border-bottom: 10px solid var(--color01);
    border-bottom: 10px solid var(--color01);
    position: relative;
    position: relative;

    gap: 1em;
}

.tenbin-wrap::before {
    content: "";
    width: 0;
    height: 0;
    border-width: 0 25px 50px 25px;
    border-style: solid;
    border-color: transparent transparent var(--color01) transparent;
    border-radius: 0.5em;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    bottom: -50px;
    left: 50%;
}

.tenbin-item-plus {
    width: 50%;
    border: 3px solid var(--color01);
    border-radius: 0.5em;
}

.plus-title {
    padding: 0.3em 0.8em;
    font-weight: bold;
    font-size: 1.2em;
    font-size: 24px;
    color: #fff;
    text-align: center;
    background-color: var(--color01);
}

.tenbin-item-minus {
    width: 50%;
    border: 3px solid #797979;
    border-radius: 0.5em;
}

.minus-title {
    padding: 0.3em 0.8em;
    font-weight: bold;
    font-size: 1.2em;
    font-size: 24px;
    color: #fff;
    text-align: center;
    background-color: #797979;
}

.tenbin .text {
    padding: 1em;
}

.tenbin .text li {
    padding-left: 2em;
    font-size: 20px;
    position: relative;
}

.tenbin .text li::before {
    content: "";
    width: 1.5em;
    height: 1.5em;
    display: block;
    background-image: url('/import/tenant_1/162.43.35.243/images/icon_check.webp');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 0.15em;
    left: 0;
}

.tenbin .text li+li {
    margin-top: 0.75em;
}

.md-wrap .item+.item {
    margin-top: 30px;
}

.md-wrap .item {
    border: 2px solid var(--color01);
}

.md-wrap .item-minus {
    border: 2px solid #797979;
}

@media (max-width: 1024px) {
    .tenbin .text li {
        font-size: 18px;
    }
}

@media(max-width:599px) {
    .house-box {
        padding: 80px 0px 60px;
    }

    .tenbin .text {
        font-size: 0.8em;
    }

    .tenbin .text li {
        font-size: 16px;
    }

    .plus-title,
    .minus-title {
        font-size: 20px;
    }
}

/* ##### タイトル ##### */
.title_01 {
    margin-bottom: 1.5em;
    font-weight: 700;
    font-size: 48px;
    color: #444;
    letter-spacing: 0.2rem;
    position: relative;
    z-index: 1;
}


.title_01.-mb-0 {
    margin-bottom: 0;
}

.title_01>span {
    display: block;
}

.title_01 .main {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding:0.5rem 0.5rem 0 1rem;
    position: relative;
}

.title_01 .sub {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -0.5em;
    margin-left: auto;
    margin-right: auto;
    font-size: 45%;
    color: var(--color01);
    letter-spacing: 0.1em;
}

.title_01 .img {
    content: "";
    width: 100px;
    height: auto;
    background-image: var(--bgi02);
    background-size: contain;
    background-repeat: no-repeat;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    z-index: -1;

    aspect-ratio: 89/97;
}

.title_01.-white .main,
.title_01.-white .sub {
    color: white;
}

.title_01.-white .img {
    background-image: var(--bgi03);
}

.title_01-smaller {
    font-size: 35px;
    letter-spacing: 0.1em;
}

.title_01-smaller .img {
    width: 100px;

    /* height: 100px; */
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    z-index: -1;
}

.title_01-smaller .main {
    padding: 1.5em 0.5em 0.5em 1em;
}

.title_01.-left .main {
    margin-left: -1em;
}

.title_01.-left .sub {
    margin-left: 0;
}

.title_02 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 26px;
}


.title_02 span {
    display: block;
    font-weight: bold;

}

.paint-num,
.title_02 .main {
    width: 70px;
    height: 110px;
    background-image: var(--bgi01);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
    background-position: center top;
}

.paint-num .num,
.title_02 .num {
    width: 100%;
    letter-spacing: 0;
    padding-top: 0.2em;
    font-size: 120%;
    color: #fff;
    text-align: center;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    top: 0;
    left: 50%;
}

.paint-num .num {
    font-size: 32px;
}

.title_02 .sub {
    padding-top: 5px;
    padding-left: 10px;
    width: calc(100% - 70px);
    color: var(--color01);
}

.title_03 {
    font-weight: 700;
    font-size: 48px;
    color: #fff;
    letter-spacing: 0.1em;
    text-shadow: 0px 0px 15px rgb(0 0 0 / 80%);
    position: relative;
    z-index: 1;
}


.title_03 span {
    display: block;
}

.title_03 .main {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;

    /* padding: 0.5em 0.5em 0 1em; */
    position: relative;
}

.title_03 .sub {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: -0.5em;
    margin-bottom: 15px;
    margin-left: auto;
    margin-right: auto;
    font-size: 45%;
    letter-spacing: 0.1em;
}

.title_04 {
    width: 80px;
    height: 80px;
    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-size: 28px;
    border-radius: 100%;
    background-color: var(--color01);

    gap: 1em;
}

.title_04.-normal {
    display: block;
    font-size: inherit;
    border-radius: 0;
    background-color: transparent;
}

.title_04 span {
    display: block;
}

.title_04 .num {
    color: #fff;
}

.title_05 {
    width: 2em;
    height: 2em;
    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-size: 200%;
    border-radius: 100%;
}

.title_05 .main::before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #ffef6b;
}

[data-element-id] .up-sp-text .title_01-smaller{
  font-size: 22px !important;
}

@media(max-width:1024px) {
    .title_01 {
        font-size: 40px;
    }

    .title_01-smaller {
        font-size: 28px;
        letter-spacing: 0.1em;
    }

    .title_01-smaller .img {
        width: 80px;
        height: 80px;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        position: absolute;
        top: 50%;
        left: 0;
        z-index: -1;
    }

    .title_02 {
        font-size: 18px;
    }

    .title_02 .num {
        font-size: 140%;
    }

    .title_03 {
        font-size: 36px;
    }

    .paint-num,
    .title_02 .main {
        width: 60px;
        height: 90px;
    }
}

@media(max-width:599px) {
    .title_01 {
        font-size: 28px;
        letter-spacing: 1px;
    }

    .title_01-smaller {
        font-size: 22px;
        letter-spacing: 0.1em;
    }

    .title_01-smaller .img {
        width: 70px;
        height: 70px;
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        position: absolute;
        top: 50%;
        left: 0;
        z-index: -1;
    }

    .title_01-smaller .main {
        line-height: 1.3;
    }

    .title_02 {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 20px;
    }

    .title_02 .sub {
        width: calc(100% - 60px);
        padding-top: 10px;
        letter-spacing: 0;
    }

    .title_03 {
        font-size: 28px;
    }

    .title_02 .num {
        font-size: 120%;
    }

    .title_01 .sub {
        font-size: 16px;
    }

    .minus01 {
        margin-bottom: -30px;
    }

    .lower-keyvisual+section {
        margin-top: 20px !important;
    }

    .lower-keyvisual+section.lower-toptext {
        margin-top: 0px !important;
    }
}

/* カテゴリー */

.aside-container {
    overflow: hidden;
    padding-top: 50px;
}

.aside-container+.aside-container {
    margin-top: 50px;
}

.aside-container .wrap {
    padding: 0 10px 10px 10px;
    border: 4px solid var(--color01);
    background-color: #fff;
    position: relative;
}

.aside-container .wrap::before {
    content: "";
    width: 100%;
    height: 220px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    border: 4px solid var(--color01);
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    background-color: #fff;
    position: absolute;
    top: -50px;
    left: 0;
    z-index: -1;
}

.aside-container .wrap::after {
    content: "";
    width: 77%;
    height: 6px;
    background-color: #fff;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    top: -5px;
    left: 50%;
}

.aside-container .wrap .title {
    text-align: center;
    background-color: #fff;
}

.aside-container .wrap .title span {
    display: block;
    margin-bottom: 0.5em;
}

.aside-container .wrap li {
    padding: 0.5em;
}

.aside-container .wrap li:first-child {
    border-top: 2px solid var(--color01);
}

.aside-container .wrap li {
    border-bottom: 2px solid var(--color01);
}

.aside-container .wrap li:last-child {
    border-bottom: none;
}

.aside-container .wrap li a {
    width: 100%;
    height: 100%;
    display: block;
}

@media(max-width:1024px) {
    .aside {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .aside-container {
        width: 48%;
    }

    .aside-container+.aside-container {
        margin-top: 0;
    }

    .aside-container .wrap {
        height: 100%;
    }
}

@media(max-width:599px) {
    .aside {
        display: block;
    }

    .aside-container {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
    }

    .aside-container+.aside-container {
        margin-top: 30px;
    }
}

/* ページネーション */
.pager {
    margin: 50px 0;
}

.pagenation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.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;
    color: #fff;
    text-align: center;
    border-radius: 10px;
    background-color: var(--color01);
}

.pagenation li.prev a::before,
.pagenation li.next a::before {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #fff;
}

.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;
    }
}

/* レコメンド */
.recommend .recommend-title {
    margin-bottom: 2em;
    padding-bottom: 0.5em;
    font-size: 1.5em;
    border-bottom: 8px dotted var(--color01);
}

.recommend span {
    display: block;
}

@media(max-width:599px) {
    .recommend .recommend-title {
        text-align: center;
    }

    .recommend .list-inner .img-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .recommend .list-inner .img-container .category {
        width: 100%;
        max-width: 100%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin: 0;
        position: static;
    }

    .recommend .list-inner .img-container .category span {
        font-size: 10px;
    }

    .recommend .list-inner .title {
        margin-top: 0;
    }
}

/* ##### ボタン ##### */
/* 詳細はこちら一覧はこちらボタン */
.detail-btn {
    width: 400px;
    max-width: 90%;
    margin: 1em auto 0em auto;
    color: #fff;
    border-radius: 0.5em;
    position: relative;
}

.detail-btn a,
.detail-btn button {
    width: 100%;
    height: 100%;
    display: block;
    border: none;
    position: relative;
}

.detail-btn a .btn-inner,
.detail-btn button .btn-inner {
    width: 100%;
    height: 100%;
    display: block;
    padding: 1em;
    font-size: 20px;
    letter-spacing: 0.1em;
    border-radius: 0.5em;
    background-color: var(--color01);
    position: relative;
    z-index: 2;
}

.detail-btn a::after,
.detail-btn button::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    border: 3px solid var(--color01);
    border-radius: 0.5em;
    background-color: #fff;
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1;
}

.detail-btn a:hover,
.detail-btn button:hover {
    opacity: 1;
}

.detail-btn a:hover::after,
.detail-btn button:hover::after {
    top: 0;
    left: 0;
}

/* 丸いボタン */
.round-btn a,
.round-btn.-noanchor {
    width: 2.5em;
    height: 2.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-size: 1.5em;
    color: white;
    border-radius: 100%;
    background-color: var(--color01);
}

.round-btn.-noanchor {
    border: 1px solid white;
    background-color: transparent;
}

.icon-arrow-next::before {
    content: "→";
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    line-height: 1;
}

/* コンタクトボタン */

.contact-btn {
    position: fixed;
    bottom: 10%;
    right: 1em;
    z-index: 20;
}

.contact-btn-img {
    width: 150px;
    background-image: var(--bgi03);
    background-size: contain;
    background-repeat: no-repeat;

    /* height: 150px; */
    position: relative;

    aspect-ratio: 89/97;
}

.contact-btn-img img {
    width: 100%;
    height: 100%;
}

.contact-btn-img::before {
    content: "\f0e0";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 2.5em;
    color: #fff;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    left: 50%;
}

.contact-btn-img .text {
    font-size: 0.75em;
    color: #fff;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    position: absolute;
    bottom: 35px;
    left: 50%;
}

@media (max-width: 1024px) {
    .contact-btn {
        display: none;
    }
}

/* 戻る・次へボタン */
.btn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

/* 一覧へ戻るボタン */
.tolist-btn {
    width: 200px;
    max-width: 90%;
    margin: 4em auto 4em auto;
    color: #fff;
    border-radius: 0.5em;
    position: relative;
}

.tolist-btn a {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
}

.tolist-btn a .btn-inner {
    width: 100%;
    height: 100%;
    display: block;
    padding: 1em;
    font-size: 20px;
    letter-spacing: 0.1em;
    border-radius: 0.5em;
    background-color: var(--color01);
    position: relative;
    z-index: 2;
}

.tolist-btn a::after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    border: 3px solid var(--color01);
    border-radius: 0.5em;
    background-color: #fff;
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1;
}

.tolist-btn a:hover {
    opacity: 1;
}

.tolist-btn a:hover::after {
    top: 0;
    left: 0;
}

.prevnext-btn {
    width: 59px;
    height: 51px;
    overflow: hidden;
    margin: 4em auto 4em auto;
    border-radius: 43% 57% 45% 55% / 54% 51% 49% 46%;
}

.prevnext-btn a {
    width: 100%;
    height: 100%;
    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;
    background-color: var(--color01);
}

/* リンクしない飾りだけのボタン */
.noancher-btn {
    margin: 1em 0 0.5em 0;
}

.noancher-btn span {
    display: inline-block;
    padding: 0.5em 1em;
    font-size: 14px;
    color: #fff;
    border-radius: 1.5em;
    background-color: var(--color01);
}

/* 横並びのボタン（お問い合わせのページで使用）*/
.contactbtn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 0.5em;
}

.contactbtn-wrap .detail-btn {
    width: 200px;
}

/* 上下マージンをせばめる */
.m-little {
    margin: 1em 1.5em;
}

@media(max-width:1024px) {
    .detail-btn {
        width: 300px;
    }
}

@media(max-width:599px) {
    .detail-btn {
        width: 250px;
    }

    .detail-btn.mk2 {
        width: 300px;
    }
}



/* ##### ハンバーガーボタン オーバーレイ hamburger overlay ##### */
.hamburger {
    display: none;
}

@media (max-width: 1024px) {
    .overlay {
        width: 100%;
        height: 100%;
        display: none;
        overflow: hidden;
        background-color: rgba(247, 224, 230, 0.6);
        position: fixed;
        top: 0;
        right: 0;
        z-index: 20;

        -ms-touch-action: none;
        touch-action: none;
    }

    .hamburger {
        width: 40px;
        height: 40px;
        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;
        padding: 0;
        cursor: pointer;
        -webkit-transition: 0.3s linear;
        transition: 0.3s linear;
        position: absolute;
        top: 20px;
        left: -70px;
        z-index: 30;
    }

    .menu-trigger {
        width: 100%;
        height: 100%;
        display: inline-block;
        -webkit-transition: 0.3s linear;
        transition: 0.3s linear;
        position: relative;
    }

    .menu-trigger span {
        width: 100%;
        height: 1px;
        display: inline-block;
        border-top: 3px solid var(--color01);
        -webkit-transition: 0.3s linear;
        transition: 0.3s linear;
        -webkit-transform-origin: center center;
        transform-origin: center center;
        position: absolute;
        left: 0;
    }

    .menu-trigger span:nth-of-type(1) {
        top: 0;
    }

    .menu-trigger span:nth-of-type(2) {
        -webkit-transform: translate(0, -50%);
        transform: translate(0, -50%);
        top: 50%;
    }

    .menu-trigger span:nth-of-type(3) {
        bottom: 0;
    }

    .activebody {
        overflow: hidden;

        -ms-touch-action: none;
        touch-action: none;
    }

    .drawer-active .overlay {
        display: block;
    }

    .drawer-active .menu-trigger {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }

    .drawer-active .menu-trigger span {
        width: 137%;
        border-top: 2px solid white;
    }

    .drawer-active .menu-trigger span:nth-of-type(1) {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
    }

    .drawer-active .menu-trigger span:nth-of-type(2) {
        opacity: 0;
    }

    .drawer-active .menu-trigger span:nth-of-type(3) {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: bottom left;
        transform-origin: bottom left;
    }
}

@media (max-width: 599px) {
    .hamburger {
        width: 30px;
        height: 30px;
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
        top: 10px;
        left: -40px;
    }

    .active .menu-trigger span {
        border-top: 2px solid white;
    }
}

/* ##### パンくずリスト breadcrumbs ##### */
.breadcrumbs {
    padding: 30px 0;
    background-color: white;
}

.breadcrumbs-box {
    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;
}

.breadcrumbs-list {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;

    /* margin-left: auto; */
    padding-left: 1em;
}

.breadcrumbs-list li {
    display: inline;
    font-size: 14px;
    letter-spacing: 1px;
}

.breadcrumbs-list li.breadcrumbs-home,
.breadcrumbs-list li.breadcrumbs-prevpage {
    font-weight: bold;
    color: var(--color01);
}

.breadcrumbs-list li+li::before {
    content: "";
    width: 8px;
    height: 8px;
    display: inline-block;
    margin: 0 10px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

@media (max-width: 1024px) {
    .breadcrumbs {
        padding: 20px 0;
        font-size: 14px;
    }

    .breadcrumbs-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        align-items: flex-start;
        -ms-flex-align: start;
    }

    .breadcrumbs-list {
        width: 90%;
        margin-top: 1em;
    }

    .breadcrumbs li {
        font-size: 12px;
    }

    .breadcrumbs li+li::before {
        width: 8px;
        height: 8px;
        margin: 0 5px 1px;
    }
}

@media (max-width: 599px) {
    .breadcrumbs {
        padding: 15px 0;
        font-size: 12px;
    }

    .breadcrumbs li+li::before {
        width: 6px;
        height: 6px;
    }
}

/* ##### パンくずリスト breadcrumbs ここまで ##### */

/* ＃＃＃＃＃ヘッダー＃＃＃＃＃ */
h1 {
    width: 1200px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0.5em 0.5em 0;
    font-size: 12px;
}

header {
    width: 100%;
    padding: 10px 10px;
    background-color: white;
}

.header-container {
    width: 1200px;
    max-width: 98%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 3;
}

.header-item {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.header-item-logo {
    width: 30%;
}

.header-item-logo .header-logo {
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
}

.header-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin: 1em 0;
}

.header-nav li {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.header-nav li+li {
    margin-left: 1.5em;
}

.header-mitumori a {
    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: 0.5em 2em;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    letter-spacing: 0.25em;
    border-radius: 0.5em;
    background: var(--color01);
}

.type-b .header-mitumori a  {
    background-color: #444C5C;
}

.header-mitumori a::before {
    content: "\f044";
    margin-right: 0.25em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 140%;
    line-height: 0;
}

.type-b .phone .tel a::before{
  background-color: #444C5C;
}

.header-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-bottom: 5px;
}

.header-info .phone {
    margin-left: 1em;
    line-height: 1;
}


.phone .tel a {
    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-size: 38px;
    white-space: nowrap;
}

.phone .tel a::before {
    content: "\f2a0";
    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;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 0.1em;
    padding: 0.3em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 30px;
    color: #fff;
    line-height: 1;
    border-radius: 100%;
    background-color: var(--color01);
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    margin-right: 5px;
}

.sns-icon {
    line-height: 1;
}

.sns-icon+.sns-icon {
    margin-left: 1em;
}

.sns-icon a {
    display: block;
}

.sns-icon a::after {
    list-style: 1;
    font-family: "Font Awesome 5 Brands";
    font-weight: 500;
    font-size: 40px;
}

.sns-line a::after {
    content: "\f3c0";
    color: #01b900;
}

.sns-insta a::after {
    content: "\f16d";
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%),
        radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%),
        radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%),
        radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%),
        radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%),
        radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%),
        radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent),
        -webkit-gradient(linear, left top, left bottom, from(#6559ca), color-stop(30%, #bc318f), color-stop(50%, #e33f5f), color-stop(70%, #f77638), to(#fec66d));
    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%),
        radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%),
        radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%),
        radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%),
        radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%),
        radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%),
        radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent),
        linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;
}

.header-br {
    display: none;
}

/* ヘッダー固定（bodyにheader-fixedのクラス名がついたときのcss） */
.header-fixed header {
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-box-shadow: 0px 4px 2px -2px rgb(0, 0, 0, 0.2);
    box-shadow: 0px 4px 2px -2px rgb(0, 0, 0, 0.2);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
}

.header-fixed header::after {
    display: none;
}

.header-fixed .header-container {
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
}

.header-element {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.header-element .sns-wrap {
    margin-left: 1em;
}

.header-fixed .header-container .address {
    display: none;
}

.header-fixed .header-logo {
    width: 220px;
}

.h1-dummy {
    display: none;
    font-size: 12px;
    letter-spacing: 0;
}

@media(max-width:1024px) {
    h1 {
        display: none;
    }

    .h1-dummy {
        display: block;
    }

    header {
        width: 65%;
        height: 100%;
        padding: 1em 3em;
        background-color: var(--color02);
        -webkit-transition: 0.3s linear;
        transition: 0.3s linear;
        position: fixed;
        top: 0;
        right: -65%;
        z-index: 30;
    }

    .header-container {
        max-width: 100%;
        height: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;

    }

    .header-item {
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
    }

    .header-item-logo {
        width: 100%;
    }

    .header-item-logo .header-logo {
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }

    .header-item-logo .address {
        margin: 10px 0;
        letter-spacing: 0;
        text-align: left;
        font-size: 14px;
    }

    .header-item-nav {
        height: 10%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-box-orient: vertical;
        -webkit-box-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

    .header-item-nav .header-element {
        height: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-positive: 1;
        flex-grow: 1;
        margin-top: 30px;
        height: 55vh;
        margin-bottom: 450px;
    }

    .header-item-nav .header-element #gnav {
        width: 100%;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;

        height: 100%;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
    }

    .sns-wrap {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .drawer-active header {
        -webkit-box-shadow: -2px 0px 15px -5px #000;
        box-shadow: -2px 0px 15px -5px #000;
        right: 0;
    }

    .drawer-active main,
    .drawer-active footer,
    .drawer-active h1 {
        -webkit-filter: blur(5px);
        filter: blur(5px);
        overflow-y: hidden;
    }

    .fixed-content {
        width: 65%;
        padding: 10px 10px 10px 30px;
        border-radius: 20px 0 0 0;
        background-color: rgba(0, 0, 0, 0.2);
        position: fixed;
        bottom: 0;
        right: 0;
        z-index: 10;
    }

    .header-info {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-bottom: 0;
    }

    .header-info .phone,
    .header-mitumori {
        width: 48%;
        margin: 1%;
    }

    .header-info .phone {
        margin-left: 0;
    }

    .header-mitumori a {
        padding: 0.5em;
        font-size: 18px;
    }

    .header-info .phone .tel a {
        font-size: 20px;
        text-shadow: 0 0 2px white, 0 0 2px white, 0 0 2px white, 0 0 2px white;
    }

    /*    .drawer-active .fixed-content {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0;
        background-color: transparent;
        position: static;
    }*/

    .drawer-active .fixed-content {
        display: none;
    }

    .drawer-active .fixed-content .header-mitumori,
    .drawer-active .fixed-content .phone {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }

    .phone .tel a::before {
        font-size: 20px;
        text-shadow: none;
    }

    .header-element .sns-wrap {
        margin-left: 0;
        margin-top: 20px;
    }
}

@media(max-width:599px) {
    h1 {
        padding-right: 45px;
        letter-spacing: 0;
    }

    header {
        width: 80%;
        padding: 1em;
        right: -80%;
    }

    .header-item-logo .header-logo {
        width: 85%;
    }

    .fixed-content {
        width: 100%;
        padding: 5px;
        border-radius: 0;
    }

    .header-mitumori a {
        font-size: 15px;
        letter-spacing: 0;
    }

    .header-info .phone .tel a {
        font-size: 18px;
    }
}

/* ##### nav ##### */
#dropmenu {
    width: 100%;
    max-width: 1000px;
    margin: auto;
}

#dropmenu>li>a,
#dropmenu>li>.dropdown-btn {
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 400;
    letter-spacing: 1px;
    text-decoration: none;
    position: relative;
}

#dropmenu li a:hover {
    opacity: 1;
}

#dropmenu li a:after {
    content: "";
    width: 100%;
    height: 1px;
    background: white;
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: left top;
    transform-origin: left top;
    position: absolute;
    bottom: 0;
    left: 0;
}

#dropmenu li a:hover::after {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
}

#dropmenu li.index-link span {
    display: none;
}

#dropmenu span.drop-btn {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 18px;
    letter-spacing: 1px;
    text-align: left;
    border: none;
    position: relative;
}

#dropmenu span.drop-btn:after {
    content: "\f0d7";
    font-family: fontawesome;
    font-size: 14px;
    color: #ed6f92;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    position: absolute;
    bottom: -20px;
    left: 50%;
}

.dropmenu .dropdown {
    overflow: hidden;
    position: relative;
}

#dropmenu .dropdown:hover {
    overflow: visible;
    cursor: pointer;
}

.dropmenu .dropdown ul {
    width: 300px;
    display: block;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    padding: 1em;
    border-radius: 1em;
    background-color: var(--color01);
    opacity: 0;
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
    position: absolute;
    top: 100%;
    left: -150px;
    right: -150px;
    z-index: -999;
}

.dropmenu .dropdown ul::before {
    content: "";
    width: 0;
    height: 0;
    margin: auto;
    border-width: 0 15px 20px 15px;
    border-style: solid;
    border-color: transparent transparent var(--color01) transparent;
    position: absolute;
    top: -18px;
    left: 0;
    right: 0;
}

.dropmenu .dropdown ul::after {
    content: "";
    width: 100px;
    height: 40px;
    display: block;
    position: absolute;
    top: -40px;
    left: 50%;
    transform:translateX(-50px);
}

#dropmenu .dropdown ul li {
    width: 100%;
    display: block;
    margin: 0;
}

#dropmenu .dropdown ul li a {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    padding: 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: white;
    background: var(--color01);
    position: relative;
}

#dropmenu .dropdown:hover {
    overflow: visible;
}

#dropmenu .dropdown:hover ul {
    -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);
    opacity: 1;
    -webkit-transform: unset;
    -webkit-transform: translate(0, -10%);
    transform: unset;
    transform: translate(0, -10%);
    z-index: 10;
}

.sab-nav {
    width: 200px;
    position: absolute;
    bottom: 0;
    left: 0;
}

.sab-nav li a {
    width: 100%;
}

#dropmenu .sp-only {
    display: none;
}

.dropmenu-display {
    display: none;
}

@media (max-width: 1024px) {
    #dropmenu {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #dropmenu li+li {
        margin-top: 1em;
        margin-left: 0;
    }

    .dropmenu .dropdown {
        overflow: visible;
        position: static;
    }

    .dropmenu .dropdown ul {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        padding-left: 1em;
        background: transparent;
        opacity: 1;
        -webkit-transition: unset;
        transition: unset;
        position: static;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

    #dropmenu .dropdown:hover ul {
        -webkit-box-shadow: unset;
        box-shadow: unset;
        -webkit-transform: unset;
        transform: unset;
    }

    .dropmenu .dropdown ul::before,
    .dropmenu .dropdown ul::after {
        display: none;
    }

    #dropmenu .dropdown ul li a {
        color: inherit;
        background: transparent;
    }

    #dropmenu .dropdown ul li a {
        padding-left: 2em;
        position: relative;
    }

    #dropmenu .dropdown ul li a::before {
        content: "\f105";
        display: inline-block;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        line-height: 1;
        position: absolute;
        top: 1em;
        left: 0.5em;
    }

    .dropmenu-display {
        display: block;
    }
}

/* ＃＃＃＃＃フッター＃＃＃＃＃ */
footer {
    width: 100%;
}

.footer .footer-item+.footer-item {
    margin-top: 2em;
}

.footer-item-middle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: baseline;
}

.footer-item-middle .footer-address,
.footer-item-middle .sns-wrap {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.footer-item-middle .sns-wrap {
    /* width: 10%; */
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 1em;
}

.footer-tel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    font-size: 2.0em;
}

.footer-tel::before {
    content: "\f879";
    display: block;
    margin-right: 0.3em;
    padding: 0.3em;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #fff;
    line-height: 1;
    border-radius: 50%;
    background-color: var(--color01);
}

.footer-tel a {
    color: inherit;
}

.footer-payment {
    padding: 1em;
    line-height: 1.8;
    border: 1px solid #444;
}

.footer-payment dt {
    padding-left: 1em;
    position: relative;
}

.footer-title::before,
.footer-payment dt::before {
    content: "■";
    color: var(--color01);
    position: absolute;
    top: 0;
    left: 0;
}

.footer-title {
    margin-bottom: 1em;
    padding-left: 1.4em;
    font-weight: bold;
    font-size: 16px;
    position: relative;
}

.footer-nav-inner li {
    padding-left: 1em;
}

.footer-nav-inner li+li {
    margin-top: 1em;
}

.footer-copyright {
    padding: 4em 1em 2em;
    font-size: 14px;
    color: white;
    text-align: center;
    background-image: var(--bgi04);
    background-size: auto 100%;
    background-repeat: repeat-x;
    background-position: top center;
}

@media(max-width:1024px) {
    .footer-item-middle {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .footer-item-middle .footer-address,
    .footer-item-middle .sns-wrap {
        width: 100%;
        margin-left: 0;
    }

    .footer-nav-inner {
        margin-right: 0.5em;
    }

    .footer-nav-inner ul {
        font-size: 14px;
    }

    .phone .tel a {
        font-size: 32px;
    }

    .footer-copyright {
        padding: 4em 1em 8em;
        font-size: 12px;
        background-size: 160% 100%;
    }
}

@media(max-width:599px) {
    .footer .logo {
        max-width: 250px;
        margin-left: auto;
        margin-right: auto;
    }

    .footer .footer-item+.footer-item {
        margin-top: 2em;
        margin-bottom: 2em;
    }

    .footer-copyright {
        padding: 4em 1em 6em;
        background-size: 310% 100%;
    }
}

/* ＃＃＃＃＃TOPページ＃＃＃＃＃ */

/* TOPページのメインビジュアル */
.footer {
    position: relative;
    z-index: 1;
}

.top-slide {
    margin-top: 30px;
    margin-bottom: -30px;
    background-color: white;
    -webkit-transform: translate(0, -30px);
    transform: translate(0, -30px);

    -webkit-clip-path: polygon(50% 0%, 0% 20%, 0% 100%, 100% 100%, 100% 20%);
    clip-path: polygon(50% 0%, 0% 20%, 0% 100%, 100% 100%, 100% 20%);
}

@media(max-width:1024px) {
    .top-slide {
        margin-top: 0;
        margin-bottom: 0;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);

        -webkit-clip-path: unset;
        clip-path: unset;
    }
}

/* トップページNEWS */
.news {
    position: relative;
}

.news::before {
    content: "";
    width: 90%;
    height: 100%;
    display: block;
    background-color: var(--color02);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.news-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    align-items: baseline;
    -ms-flex-align: baseline;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 50px 70px;
}

.news-box .title_01 {
    width: 30%;
}

.news-box .list-news {
    width: 10%;
    flex-grow: 1;
}

.news-box .btn {
    width: 60px;
    margin-left: 1em;
}

.list-news a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}


.list-news dt {
    width: 110px;
    color: var(--color01);
    font-weight: bold;
    letter-spacing: 0;
}

.lower-news .list-news dt {
    width: 100%;
}

.list-news dd {
    width: calc(100% - 110px);
}

@media(max-width:1024px) {
    .news::before {
        width: 100%;
    }

    .news-box {
        padding: 50px 30px;
    }

    .news-box .list-news {
        max-width: 350px;
    }
}

@media(max-width:599px) {
    .news-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 30px;
    }

    .news-box .list-news {
        width: 100%;
        display: block;
        margin: 30px 0 15px 0;
    }

    .news-box .title_01 {
        width: 100%;
    }

    .list-news dd {
        width: 100%;
        margin-left: 0;
    }

    .title_01.-left {
        padding-left: 30px;
    }

    .news-box .btn {
        margin-left: auto;
    }

    .news::before {
        height: 100%;
    }
}

/* ローディング */
.loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}

.loading-inner {
    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;
    padding: 1em;
    position: relative;
    filter: blur(0);
}

.loading-inner::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: var(--color02);
    -webkit-transition: height 0.5s linear;
    transition: height 0.5s linear;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.loading-inner .loading-item {
    -webkit-filter: blur(10px);
    filter: blur(10px);
    -webkit-transition: 0.5s linear;
    transition: 0.5s linear;
    position: relative;
    z-index: 2;
}

.loading-inner .loading-item.logo{
    width: 350px;
}

.loading-inner .loading-item+.loading-item {
    margin-top: 1em;
}

.loading-text {
    font-size: 14px;
    color: var(--color01);
    text-align: center;
}

.mv_text {
    line-height: 1.2;
    opacity: 0;
    -webkit-filter: blur(10px);
    filter: blur(10px);
    -webkit-transition: 0.5s linear;
    transition: 0.5s linear;
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
}

.mv_text+.mv_text {
    margin-top: 2vw;
}

/* ロードされたら */
.loading.loaded .loading-inner .loading-item {
    -webkit-filter: blur(0);
    filter: blur(0);
}

.loading.loaded2 .loading-inner .loading-item {
    opacity: 0;
}

.loading.loaded3 .loading-inner::before {
    height: 0;
}

.loading.loaded4 {
    width: 0;
    height: 0;
    visibility: hidden;
    opacity: 0;
    z-index: -999;
}

.mv_text.loaded5 {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.mv_text.loaded6 {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.mv_text.loaded7 {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

/* ２回目の訪問の場合 */
.loading.visited {
    width: 0;
    height: 0;
    display: none;
    visibility: hidden;
    opacity: 0;
    z-index: -999;
}

.loading.visited .loading-inner .loading-item {
    -webkit-filter: blur(0);
    filter: blur(0);
}

.loading.visited .loading-inner .loading-item {
    opacity: 0;
}

.loading.visited .loading-inner::before {
    height: 0;
}

.loading.visited.loaded4 {
    width: 0;
    height: 0;
    visibility: hidden;
    opacity: 0;
    z-index: -999;
}

.mv.mv_text {
    opacity: 1;
    -webkit-filter: blur(0);
    filter: blur(0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.visited.mv_text#mv_text_02 {
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.visited.mv_text#mv_text_03 {
    -webkit-transition-delay: 0.75s;
    transition-delay: 0.75s;
}

@media (max-width: 1024px) {
    .mv_text+.mv_text {
        margin-top: 3vw;
    }
}

@media (max-width: 599px) {
    .loading-text {
        font-size: 12px;
    }

    .mv_text+.mv_text {
        margin-top: 6vw;
    }
}

/* トップページSERVICE */
.index .list-inner .text {
    margin-top: 0.8em;
}

.list-service li a {
    display: block;
}

.label-wrap {
    position: relative;
}

.service-img {
    overflow: hidden;
    border-radius: 6px;
}

.label-wrap .label {
    height: 100%;
    padding: 0.5em;
    font-size: 1.2em;
    color: #fff;
    letter-spacing: 0.2em;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    border-radius: 6px;
    background-color: var(--color01);
    position: absolute;
    top: -10px;
    left: 20px;
}

@media(max-width:599px) {
    .service-img {
        margin-bottom: 2em;
    }
}

@media(max-width:599px) {
    .label-wrap .label {
        height: auto;
    }
}

/* トップページWORKS */
.slide01 {
    position: relative;
}

.slide01 .slick-arrow {
    width: 50px;
    height: 50px;
    border: none;
    border-radius: 100%;
    background-color: var(--color01);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: calc(50% - 580px);
    z-index: 2;
    border: 2px solid #fff;
}

.slide01 .slick-arrow::before {
    content: "\f061";
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: white;
    line-height: 1;
}

.slide01 .slick-prev {
    left: calc(50% - 580px);
    right: auto;
}

.slide01 .slick-prev::before {
    content: "\f060";
}


.works-item a {
    display: block;
    position: relative;
}

.works-item a .works-item-content {
    min-width: 50%;
    max-width: 90%;
    padding: 0.5em 3em;
    text-align: center;
    border-radius: 1em 0 0 0;
    background-color: white;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.works-category {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-weight: bold;
    font-size: 26px;
    color: var(--color01);
    letter-spacing: 0.1em;
}

.works-category span {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.works-category span+span {
    margin-left: 0.5em;
}

.one-tag [class*="category"] span:nth-of-type(n+2) {
    display: none !important;
}

@media (max-width: 1024px) {
    .slide01 .slick-arrow {
        right: 50px;
    }

    .slide01 .slick-prev {
        right: auto;
        left: 50px;
    }

    .works-item a .works-item-content {
        padding: 0.25em 1.5em;
    }

    .works-category {
        font-size: 18px;
    }
}

@media (max-width: 599px) {
    .slide01 {
        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;
    }

    .slide01 .slick-list {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
    }

    .slide01 .slick-arrow {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        margin: 20px;
        position: static;
        transform: translateY(0%);
    }
}

/* トップページVOICE */
.qa-bg-image {
    position: relative;
}

.qa-bg-image::before {
    content: "";
    width: 200%;
    height: 80%;
    display: block;
    margin: auto;
    background-color: var(--color02);
    -webkit-transform: translate(0, -50%) rotate(-5deg);
    transform: translate(0, -50%) rotate(-5deg);
    position: absolute;
    top: 50%;
    left: -50%;
    right: 0;
}

.voice .list-voice {
    position: relative;
}

.voice .content a {
    height: 100%;
    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: 1em;
    border: 3px solid var(--color01);
    border-radius: 6px;
    background-color: white;
}

.voice .category {
    font-size: 1.4em;
    color: var(--color01);
}

.voice .comment {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;

    -webkit-line-clamp: 2;
}

@media(max-width:1024px) {
    .voice .comment {
        font-size: 14px;
    }

}

@media (max-width: 599px) {
    .voice .content a {
        -webkit-box-align: end;
        align-items: flex-end;
        -ms-flex-align: end;
    }

    .qa-bg-image::before {
        height: 110%;
        -webkit-transform: translate(0, 0) rotate(-10deg);
        transform: translate(0, 0) rotate(-10deg);
        top: -5%;
    }

    .qa-bg-image {
        overflow: hidden;
    }
}

/* トップページQ&A */
.list-faq li a {
    display: block;
    overflow: hidden;
    border-radius: 1em;
    position: relative;
}

.list-faq li a .caption {
    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;
    padding: 1em;
    color: white;
    background-color: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0;
    left: 0;
}

.list-faq li a .caption .main {
    font-size: 40px;
    letter-spacing: 0.2em;
}

.list-faq li a .caption .btn {
    position: absolute;
    bottom: 30px;
    right: 30px;
}

.list-faq .img {
    position: relative;
}

@media(max-width:1024px) {
    .list-faq li a .caption .main {
        font-size: 32px;
    }
}

@media(max-width:599px) {
    .list-faq li a .caption .main {
        font-size: 42px;
    }
}

/* トップページBLOG */
.blog .list-blog .top-blog-item:last-of-type {
    position: relative;
}

.blog iframe {
    border: 3px solid #fff;
    border-radius: 0.5em;
}


.blog .deco-element img {
    border-radius: 0.25em;
}

.blog .date {
    color: var(--color01);
}

.blog .comment {
    margin-bottom: 1em;
    font-size: 1.2em;
}

@media(max-width:1024px) {
    .blog .date {
        margin-bottom: 0.5em;
    }

    .blog .comment {
        margin-bottom: 0.5em;
        font-size: 1em;
    }
}

@media(max-width:599px) {
    .blog .deco-element {
        margin-bottom: 0;
    }
}

/* トップページACCESS */
.access,
.bgc-beige {
    background-color: var(--color02);
}

.access-background img {
    width: 100%;
    min-width: 600px;
}

.map-deco {
    border: 4px solid white;
    border-radius: 1em;
}




/* ＃＃＃＃＃＃下層ページ：共通＃＃＃＃＃ */

.lower-keyvisual .house-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -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;
    padding: 8vw 0;
}

@media(max-width:1024px) {
    .lower-keyvisual .cliphome::after {
        display: none;
    }
}

@media(max-width:599px) {
    .lower-keyvisual .house-box {
        padding: 20vw 0;
    }
}

/* ＃＃＃＃＃＃下層ページ：会社案内＃＃＃＃＃ */
.list-table-wrap {
    max-width: 1000px;
    margin: 0 auto;
    background-color: rgba(0, 0, 0, 0.1);
}

.list-table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border: 1px solid #fff;
}

.list-table dt {
    width: 25%;
    display: block;
    padding: 1.5em;
}

.list-table dd {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: 10%;
    display: block;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 1.5em;
}

@media(max-width:599px) {
    .list-table dt {
        width: 25%;
        padding: 1.5em 0.5em;
    }
}

/* ＃＃＃＃＃＃下層ページ：初めての方へ＃＃＃＃＃ */
/* .lower-guide-greeting img {
    border-radius: 3em;
} */

.lower-guide-reason .title_04 {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.lower-guide-reason .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;

    gap: 3em;
}

.lower-guide-reason .item+.item {
    margin-top: 1.5em;
}

.area-item [class*="up-ofi"]::before {
    content: "";
    width: 80%;
    height: 80%;
    margin: auto;
    border-radius: 100%;
    background-color: #f7e0e6;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
}

.area-item .list-inner {
    position: relative;
    z-index: 1;
}

.area-item-title {
    font-weight: bold;
    font-size: 18px;
    text-align: center;
}

/* .lower-guide-reason .item .text {
    font-size: 2em;
    line-height: 1.2em;
} */

.lower-guide-area .text-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;
    font-size: 1.5em;
}

.pdf-box {
    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;
}

.img-container {
    position: relative;
}

.img-container .year {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto;
    font-weight: bold;
    font-size: 22px;
    color: #c82c55;
    text-shadow: 3px 3px 3px #fff, -3px -3px 3px #fff,
        -3px 3px 3px #fff, 3px -3px 3px #fff,
        3px 0px 3px #fff, -3px -0px 3px #fff,
        0px 3px 3px #fff, 0px -3px 3px #fff;
    position: absolute;
    bottom: 25%;
    left: 0;
    right: 0;
    z-index: 1;
}

@media(max-width:1024px) {
    .lower-guide-greeting .float-wrap .float-parent .float-img {
        width: 100%;
    }

    .lower-guide-reason .item {
        gap: 2em;
    }
}

@media(max-width:599px) {
    .lower-guide-reason .item {
        gap: 1em;
    }

    .lower-guide-reason .item .text {
        font-size: 1.5em;
    }
}

/* ＃＃＃＃＃＃下層ページ：ご依頼の流れ＃＃＃＃＃ */
.lower-flow .list-inner {
    padding: 1em;
    color: #444;
    border: 2px solid var(--color01);
    background-color: white;
}

.lower-flow .list-inner .title-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    margin-bottom: 1em;

    gap: 1em;
}

.lower-flow .title_04 {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    color: white;
    background-color: var(--color01);
}

.lower-flow .title {
    font-size: 2em;
}

.translate-child10 .list-inner .title {
    margin-top: 0em;
}

.list-how-wrap {
    margin-top: 50px;
}

.list-how+.list-how {
    margin-top: 1em;
}

.list-how {
    padding: 1em;
    border-radius: 1em;
    background-color: white;
}

.list-how dt {
    font-weight: bold;
    font-size: 110%;
    color: var(--color01);
}

@media(max-width:1024px) {
    .lower-flow .title {
        font-size: 1.5em;
    }
}

@media(max-width:599px) {
    .lower-flow .title {
        font-size: 22px;
    }
}

[data-element-id] .lower-flow .up-sp-text .title{
  font-size: 22px;
}

[data-element-id] .up-sp-text .paint-num,[data-element-id] .up-sp-text .title_02 .main {
        width: 60px;
        height: 90px;
    }

/* ＃＃＃＃＃＃下層ページ：外壁塗装～ドローン＃＃＃＃＃ */
.lower-onayami,
.lower-timing {
    background-image: url('/import/tenant_1/162.43.35.243/images/bg_wall.webp');
    background-size: cover;
    background-repeat: no-repeat;
}

.lower-onayami.bgc-beige {
    background-image: none;
}

.lower-onayami.white {
    background-image: none;
}

.lower-onayami .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    font-size: 1.5em;
    gap: 1em;
}

/* ##### 価格の目安 ##### */
.service-table table {
    width: 100%;
    table-layout: fixed;
    border: none;
    border: 1px solid var(--color01);
    border-collapse: collapse;
    background-color: white;
}

.service-table table tr .service-table-title {
    color: white;
    background-color: var(--color01);
}

.service-table table tr .service-table-title.-name {
    width: 250px;
}

.service-table table tr th+th {
    border-left: 1px solid white;
}

.service-table table td,
.service-table table th {
    padding: 1em;
    text-align: center;
    border: none;
    border-top: 1px solid var(--color01);
    border-left: 1px solid var(--color01);
}


.service-table table td:first-child,
.service-table table th:first-child {
    border-left: none;
}

.service-table .first-row th {
    font-weight: bold;
    border-top: none;
}

.scroll-parent .service-table {
    width: 100%;
    /*min-width: 1000px;*/
    table-layout: fixed;
    overflow: hidden;
    border-collapse: collapse;
}

@media(max-width:599px) {
    .service-table {
        font-size: 12px;
    }

    .service-table table tr .service-table-title.-name {
        width: 160px;
    }
}

@media(max-width:599px) {
    .gaiheki .float-wrap .float-parent .float-img {
        width: 100%;
    }

    .lower-onayami .item .text {
        font-size: 16px;
    }

    .service-table table td,
    .service-table table th {
        padding: 20px 1px;
    }
}

/* ##### list ##### */
.list-nayami li {
    padding-left: 2em;
    font-size: 26px;
    position: relative;
}

.list-nayami .onayami-container {
    padding-left: 0em;
}

.list-nayami .onayami-list {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 1em;
    border-radius: 30px;
    background-color: #fff;
}

.white .list-nayami .onayami-list {
    border: 3px solid #f79eb5;
}

.list-nayami .onayami-list .img {
    width: 30%;
}

.list-nayami .onayami-list .nayami-content {
    width: 10%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 5%;
}

@media(max-width:1024px) {
    .list-nayami li {
        font-size: 22px;
    }
}

@media(max-width:599px) {

    .list-nayami .onayami-list .img,
    .list-nayami .onayami-list .nayami-content {
        width: 100%;
        margin-left: 0;
    }

    .list-nayami li {
        font-size: 20px;
    }
}

/* ＃＃＃＃＃＃下層ページ：施工事例＃＃＃＃＃ */
.list-inner .img-container {
    padding-top: 40px;
    padding-left: 10px;
    position: relative;
}

.works-item a {
    display: block;
    position: relative;
}

.works-item .date-wrap {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.list-inner .img-container .date-wrap {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.list-inner .img-container .category {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 50%;
    max-width: 80%;
    padding: 0.5em 1em;
    font-size: 12px;
    color: var(--color01);
    border-radius: 1em 0 0 0;
    background-color: #fff;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.list-work.one-tag .list-inner .img-container .category {
    max-width: 90%;
    font-size: 18px;
    font-weight: bold
}

.list-inner .img-container .category span {
    display: inline-block;
    margin: 5px;
    line-height: 1.2;
}

.list-work.one-tag .list-inner .img-container .category span {
    font-size: 18px;
    font-weight: bold
}

.list-inner .area,
.list-inner .title {
    margin-top: 0.5em;
}

@media (max-width: 1024px) {
    .list-inner .img-container .category span {
        margin: 2px;
        font-size: 12px;
    }

    .list-work.one-tag .list-inner .img-container .category span {
        font-size: 16px;
    }
}

@media (max-width: 599px) {
    .list-work .list-inner .img-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-top: 10px;
    }

    .list-work .list-inner .img-container .category {
        width: 100%;
        max-width: 100%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin: 0;
        position: static;
    }

    .list-work.one-tag .list-inner .img-container .category {
        padding: 0;
        max-width: 100%;
        transform: translateX(-10px);
    }

    .list-work .list-inner .img-container .category span {
        font-size: 10px;
    }

    .list-work .list-inner .title {
        margin-top: 0;
    }
}

/* ＃＃＃＃＃＃下層ページ：施工事例(詳細)＃＃＃＃＃ */
.picbox {
    margin: 50px 0;
    position: relative;
}

.picbox .before {
    width: 50%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.picbox .after {
    width: 100%;
}

.picbox .before+.after {
    width: 80%;
    padding-top: 15%;
}


.picbox .before-text {
    font-size: 28px;
    color: var(--color01);
    letter-spacing: 0.1em;
    text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff;
    position: absolute;
    top: -20px;
    right: 0;
    z-index: 2;
}

.picbox .after-text {
    font-size: 28px;
    color: var(--color01);
    letter-spacing: 0.1em;
    text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff, 0 0 2px #fff;
    position: absolute;
    bottom: -20px;
    left: 0;
    z-index: 2;
}

.lower-works-detail .content .title {
    font-size: 1.5em;
}



.lower-works-detail .content .category span {
    margin: 1px;
    padding: 0.15em 0.5em 0.25em;
    font-size: 14px;
    color: #fff;
    line-height: 1.2;
    background-color: var(--color01);
    display: inline-block;
}

.lower-works-detail .aside {
    margin-top: 80px;
}

@media(max-width:599px) {
    .lower-works-detail .aside {
        margin-top: 50px;
    }
}

/* ＃＃＃＃＃＃下層ページ：お客様の声＃＃＃＃＃ */
.lower-voice-container .list-inner {
    height: 100%;
    padding: 1em;
    border: 4px solid var(--color01);
    border-radius: 10px;
    background-color: white;
}

.lower-voice .title {
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 10px;
    font-size: 1.5em;
    color: var(--color01);
    white-space: inherit;

    -webkit-line-clamp: 2;
}

.lower-voice .title span {
    display: block;
}

.lower-voice .area {
    margin-bottom: 10px;
    font-size: 1.2em;
}

/* ＃＃＃＃＃＃下層ページ：お客様の声（詳細）＃＃＃＃＃ */
.voice-detail-wrap {
    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: 2em;
    border: 4px solid var(--color01);
    border-radius: 2em;
}

.voice-detail-title {
    margin-bottom: 1em;
    padding-left: 0.5em;
    font-weight: bold;
    font-size: 28px;
    border-left: 5px solid var(--color01);
}

.voice-detail-img {
    width: 40%;
}

.voice-detail-content {
    width: 55%;
}



.list-voice-detail+.list-voice-detail {
    margin-top: 1em;
}

.list-voice-detail dt {
    width: 25%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 0.5em 0.5em;
    font-size: 14px;
    color: white;
    line-height: 1;
    text-align: center;
    background-color: var(--color01);
}

.list-voice-detail dd {
    width: 100%;
    margin-top: 1em;
}


.voice-detail-text {
    width: 100%;
    margin-top: 30px;
}

.list-voice-detail2+.list-voice-detail2 {
    margin-top: 2em;
}

.list-voice-detail2 dt {
    font-weight: bold;
    font-size: 120%;
    border-bottom: 1px solid var(--color01);
}

.list-voice-detail2 dd {
    padding: 0.5em 0 0 0;
}

.voice-detail-btn {
    margin: 50px auto 0;
}

.voice-detail-btn[data-work=""] {
    display: none;
}

.voice-detail-btn a {
    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;
    padding: 0.5em 2em;
    color: white;
    border-radius: 0.5em;
    background-color: var(--color01);
}

@media (max-width: 599px) {
    .voice-detail-wrap {
        padding: 1em 1em;
    }

    .voice-detail-img,
    .voice-detail-content {
        width: 100%;
    }

    .voice-detail-img {
        margin-bottom: 15px;
        border-radius: 15px;
        overflow: hidden;
    }

    .list-voice-detail {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        align-items: flex-start;
        -ms-flex-align: start;
    }

    .list-voice-detail dt {
        width: 30%;
    }

    .list-voice-detail2 dt {
        font-size: 110%;
    }

    .list-voice-detail dd {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        margin-top: 0em;
        margin-left: 1em;
    }
}

/* ＃＃＃＃＃＃下層ページ：ニュース＃＃＃＃＃ */
.lower-news .list-news {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 2em 0.5em;
    border-bottom: 3px dotted var(--color01);
}

.lower-news .list-news dt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.lower-news .list-news dd {
    width: 100%;
    margin-left: 0;
    padding: 5px 10px;
    font-size: 18px;
}

.lower-news .list-news .date {
    padding: 5px 0;
    width: 110px;
    color: var(--color01);
}

.lower-news .list-news .category {
    width: calc(100% - 110px);
}

.lower-news .list-news .category span {
    display: inline-block;
    margin-left: 0.5em;
    margin-bottom: 2px;
    padding: 5px 10px;
    color: #fff;
    border-radius: 3px;
    background-color: var(--color01);
}


@media(max-width:1024px) {}

@media(max-width:599px) {
    .lower-news .list-news {
        font-size: 12px;
    }

    .lower-news .list-news dd {
        font-size: 16px;
    }

    .lower-news .list-news .date {
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 70px;
    }

    .lower-news .list-news .category span {
        padding: 5px;
    }
}

/* ＃＃＃＃＃＃下層ページ：ニュース(詳細)＃＃＃＃＃ */
.lower-news-detail .content {
    padding: 2em;
    border-radius: 2em;
    background-color: var(--color02);
}

.lower-news-detail .content .category {
    margin-bottom: 1em;
    text-align: left;
}

.lower-news-detail .content .category span {
    display: inline-block;
    margin: 1px;
    padding: 0.5em 1em;
    font-size: 14px;
    color: #fff;
    background-color: var(--color01);
}

.lower-news-detail .content .title {
    margin-bottom: 0.5em;
    font-size: 1.5em;
}

.lower-news-detail .content .date {
    margin-bottom: 0.5em;
    color: var(--color01);
}

@media(max-width:599px) {
  .lower-news-detail .content{
    padding: 2rem 1rem;
  }
  
    .lower-news-detail .content .title {
        font-size: 20px;
    }

    .lower-news-detail .content .category span {
        font-size: 12px;
    }
}

/* ＃＃＃＃＃＃下層ページ：ブログ＃＃＃＃＃ */

.blog-info-wrap .date {
    color: var(--color01);
}

.blog-info-wrap .category {
    line-height: 1;
}

.blog-info-wrap .category span {
    display: inline-block;
    margin: 1px;
    padding: 0.25em 1em;
    font-size: 12px;
    color: white;
    line-height: 1.2;
    background-color: var(--color01);
}

.lower-blog .blog-title {
    font-weight: bold;
    font-size: 18px;
}

@media(max-width:599px) {
    .blog-info-wrap {
        margin: 0;
    }

    .blog-info-wrap .category span {
        font-size: 10px;
    }

    .lower-blog .blog-title {
        font-size: 16px;
    }
}

/* ＃＃＃＃＃＃下層ページ：よくある質問＃＃＃＃＃ */

.faq-qa {
    font-weight: normal;
    color: var(--color03);
}

.faq-q {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-negative: 0;
    padding-bottom: 0.5em;
    padding-right: 1em;
    font-weight: bold;
    font-size: 18px;
    border-bottom: 3px dotted var(--color01);
    position: relative;
    z-index: 1;
}

.faq:hover {
    cursor: pointer;
}

.faq-q::before {
    content: "Q";
    display: block;
    margin-right: 1em;
}

.faq-q::after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
    position: absolute;
    top: 0;
    right: 0;
}

.faq-q:hover {
    cursor: pointer;
}

.faq-a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 400;
    color: #444;
}

.faq-a::before {
    content: "A";
    display: block;
    margin-right: 1.5em;
}

.action .faq-q::after {
    -webkit-transition: 0.3s linear;
    transition: 0.3s linear;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

/* ＃＃＃＃＃＃下層ページ：採用情報（詳細）＃＃＃＃＃ */
.lower-recruit-detail dl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border-bottom: 1px solid var(--color01);
}

.lower-recruit-detail dl dt {
    width: 150px;
    margin-right: 20px;
    font-weight: bold;
}

.lower-recruit-detail dl dd {
    width: calc(100% - 170px);
}

.lower-recruit-detail dl>dd>dl:first-of-type {
    padding-top: 0;
}

.lower-recruit-detail dl>dd>dl:last-child,
.lower-recruit-detail dl:last-child {
    padding-bottom: 0;
    border-bottom: none;
}

@media(max-width:1024px) {
    .lower-recruit-detail dl {
        flex-wrap: wrap;
    }

    .lower-recruit-detail dl dt {
        width: 100%;
        margin-right: 0px;
    }
}

@media(max-width:599px) {

    .lower-recruit-detail dl dt,
    .lower-recruit-detail dl dd {
        width: 100%;
    }

    .lower-recruit-detail dl dt {
        margin-bottom: 10px;
    }
}

/* ＃＃＃＃＃＃下層ページ：お問い合わせ＃＃＃＃＃ */
.contactbox_01 {
    margin-bottom: 1.5em;
}

.contactbox_01 .text {
    margin-bottom: 1.5em;
    text-align: center;
}

.contactbox_01 .phone {
    margin-bottom: 1.5em;
}

.list-time-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.list-time-area+.list-time-area {
    margin-top: 0.5em;
}

.list-time-area dt {
    width: 20%;
    min-width: 80px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-weight: bold;
    color: var(--color01);
}

.list-time-area dd {
    width: 10%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 1em;
}

.contactbox_02 {
    margin-top: 80px;
}

.contactbox_02 .text {
    margin-bottom: 1.5em;
}

.data {
    width: calc(100% - 160px);
}

.radio-wrap {
    max-width: 480px;
}

.radio-box {
    min-width: 177px;
}

.contact-wrap dl dt {
    display: block;
    font-weight: bold;
}

.contact-wrap dl dt * {
    display: block;
}

.contact-wrap dl dt .require {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.require {
    margin-top: 0.5em;
    padding: 2px 10px;
    font-size: 12px;
    color: #fff;
    background: var(--color01);
}

.send-btn {
    width: 100%;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.send-btn button {
    width: 100%;
    padding: 1em;
    font-size: 14px;
    color: #fff;
    border: none;
    border-radius: 0.5em;
    background: rgba(0, 102, 185, 0.8);
}

.contact-wrap {
    padding: 30px 120px;
    border-radius: 30px;
    background-color: #fff;
}

.contact-wrap dl {
    margin-bottom: 30px;
}

.contact-wrap dt {
    width: 210px;
}

.contact-wrap dt div {
    color: #fff;
    background-color: #7b6c61;
}

.contact-wrap dd {
    width: calc(100% - 160px);
}

.contact-wrap dl dd.radiobtn label {
    display: inline-block;
    padding: 0 10px 0 30px;
    position: relative;
}

.contact-wrap dl dd.radiobtn label::before {
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    border: 2px solid #dcdcdc;
    border-radius: 3px;
    background-color: white;
    position: absolute;
    top: 0.2em;
    left: 0;
}

.contact-wrap dl dd.radiobtn label:hover {
    text-decoration: underline;
    cursor: pointer;
}

.contact-wrap dl dd.radiobtn input {
    display: none;
}

.contact-wrap dl dd.radiobtn input:checked+label {
    text-decoration: underline;
}

.contact-wrap dl dd.radiobtn input:checked+label::after {
    content: "\f00c";
    width: 0;
    height: 0;
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 24px;
    line-height: 1;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 2px;
}

.contact-wrap dl dd.radiobtn input+label {
    margin-right: 15px;
}

.contact-wrap-input {
    width: 100%;
    padding: 20px 10px;
    border: none;
    background-color: #eaecec;
}

.policy div {
    margin-bottom: 20px;
}

.contact-check-list li {
    flex-wrap: wrap;
}

.contact-check-list li .uk-text-danger {
    width: 100%;
}


.contact-check-list li input {
    margin: 3px 5px 0 0;
}

.slide01.under4 {
    display: flex;
    justify-content: center;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.slide01.under4 .works-item {
    width: 25%;
}

.slide01.under2 {
    display: flex;
    justify-content: center;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.slide01.under2 .works-item {
    width: 50%;
}

.slide01.under1 {
    display: flex;
    justify-content: center;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.slide01.under1 .works-item {
    width: 80%;
}

@media(max-width:1024px) {
    .contact-wrap {
        padding: 30px;
    }
}


@media (max-width: 599px) {
    .list-time-area dt {
        width: 25%;
    }

    .contact-wrap {
        padding: 30px;
        border-radius: 30px;
    }

    .contact-wrap dd {
        width: 100%;
    }

    .contact-wrap dl dt {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        margin-bottom: 0.5em;
    }

    .contact-wrap dl dt label {
        padding: 5px 10px 5px 0;
        font-size: 14px;
    }

    .contactbox_01 .text {
        text-align: left;
    }

    .lower-contact .title_01 {
        font-size: 26px;
    }

    .contact-check-list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .contact-check-list li {
        -webkit-box-align: center;
        align-items: center;
        -ms-flex-align: center;
        margin-left: 0;
    }

    .contact-check-list li+li {
        margin-top: 0.5em;
        margin-left: 0;
    }

    .contact-wrap dl dd.radiobtn {
        padding: 0.5em 0;
    }

    .require {
        margin-top: 0;
        margin-left: 0.5em;
    }
}

/* 下層ページバナー */
.banner {
    margin: 80px 0;
}

.banner a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    border-radius: 2em;
    box-shadow: 0px 0px 15px #999;
}

.banner-item {
    width: 50%;
}

.banner-content {
    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: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1.5em 1.5em 2.5em;
}

.banner-content .title_01 {
    margin-bottom: 1em;
}


.banner-content .banner-text {
    text-align: center;
}

.banner-title {
    margin-bottom: 1em;
    font-size: 2em;
    color: var(--color01);
}

.banner-img {
    width: 57.5%;
    overflow: hidden;
    margin-right: -7.5%;
    -webkit-transform: skew(-20deg);
    transform: skew(-20deg);
}

.banner-img .img {
    -webkit-transform: skew(20deg) scale(1.3);
    transform: skew(20deg) scale(1.3);
}

@media (max-width: 599px) {
    .banner-item {
        width: 100%;
    }

    .banner-content {
        padding: 3.5em 1.5em 1.5em;
    }

    .banner-img {
        width: 100%;
        -webkit-transform: skew(0);
        transform: skew(0);
    }

    .banner-img .img {
        width: 100%;
        -webkit-transform: skew(0) scale(1);
        transform: skew(0) scale(1);
    }

    .banner-title {
        font-size: 1.8em;
    }
}

/* ##### 詳細ページのh2h3h4 ##### */
.detail-content h2 {
    margin-top: 50px;
    margin-bottom: 20px;
    padding: 0.5em;
    font-weight: bold;
    font-size: 22px;
    letter-spacing: 2px;
    border-bottom: 3px solid var(--color01);
}

.detail-content h3 {
    margin-top: 50px;
    margin-bottom: 20px;
    padding: 0.5em 1em;
    font-weight: bold;
    font-size: 20px;
    color: #fff;
    letter-spacing: 2px;
    background: var(--color01);
}

.detail-content h4 {
    margin-top: 50px;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 18px;
    color: var(--color01);
    letter-spacing: 2px;
}

.detail-content ol {
    counter-reset: count 0;
}

.detail-content ol li {
    margin: 10px 0;
    padding-left: 20px;
    font-size: 16px;
    color: #000;
    position: relative;
}

.detail-content ol li::before {
    content: counter(count) ". ";
    display: inline-block;
    counter-increment: count 1;
    color: var(--color01);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0;
}

.detail-content ul li {
    margin: 10px 0;
    padding-left: 20px;
    font-size: 16px;
    color: #000;
    position: relative;
}

.detail-content ul li::before {
    content: "";
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 50%;
    background: var(--color01);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0;
}

.detail-content ol li marker {
    display: none;
}

.detail-content iframe[src*="youtube"] {
    height: 100%;
    margin-top: 30px;

    aspect-ratio: 16 / 9;
}

.pc-4none li:nth-child(4) {
    display: none;
}

@media (max-width: 599px) {
    #popup-url-411 {
        width: 80vw;
    }

    .pc-4none li:nth-child(4) {
        display: block;
    }
}

.form_shape li {
    margin-right: 20px;
}

.form_shape li input {
    margin-right: 5px;
}

.ad-text {
    font-size: 12px;
    letter-spacing: 0;
    background-color: unset !important;
    color: var(--color01) !important;
}

.left .detail-date-ctgr.clearfix,
.left .blog_link.detail_box_wrap.clearfix,
.left .more_btn.detail_btm {
    display: none !important;
}

.new-tags>span {
    display: inline-block;
    padding: 5px 10px;
    line-height: 1em;
    border: 3px solid var(--color01);
    border-radius: 6px;
    font-size: 16px;
    margin-right: 3px;
    margin-bottom: 3px;
}

/*@media(max-width:599px){
  .header-item.header-item-nav{
    position:fixed;
    z-index:900;
  }
}*/

.uk-lb {
    cursor: pointer;
}


@media(max-width:599px) {
    .fixed-content {
        width: 100%;
        padding: 8px;
        border-radius: 0;
        background-color: rgba(0, 0, 0, 0.2);
        position: fixed;
        bottom: 0;
        right: 0;
        z-index: 31;
        opacity: 1;
        max-width: 100vw
    }

    .header-info .phone,
    .header-mitumori {
        margin: 0;
        width: 50%;
    }

    .header-info .phone .tel a {
        font-size: 16px;
        letter-spacing: 0;
    }

    .news-box {
        padding: 30px 5px;
    }
}

.h-adr .onk {
    padding-left: 20px;
    position: relative;
}

.onk>.onk-t {
    position: absolute;
    top: 15px;
    left: 0;
}

body.drawer-active {
    overflow: hidden;
    -ms-touch-action: none;
    touch-action: none;
}


.check-boxer label {
    display: inline-block;
    margin: 0.5em 0;
    padding: 0 10px 0 24px;
    position: relative;
    margin-right: 15px;
}

.check-boxer label::before {
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    border: 2px solid #dcdcdc;
    border-radius: 3px;
    background-color: white;
    position: absolute;
    top: 3px;
    left: 0;
}

.check-boxer label:hover {
    text-decoration: underline;
    cursor: pointer;
}

.check-boxer input {
    display: none;
}

.check-boxer input:checked+label {
    text-decoration: underline;
}

.check-boxer 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: var(--color-03);
    line-height: 1;
    background-color: transparent;
    position: absolute;
    top: 2px;
    left: 2px;
}

/* 見たまま編集画面用 */

[data-element-id] .abtest-parent>div>div {
    opacity: 1;
}

[data-element-id] .abtest-parent>div>div:nth-of-type(n+2) {
    display: block;
}

[data-element-id] *::before,
[data-element-id] *::after {
    pointer-events: none;
}

[data-element-id].loading {
    width: 500px;
    height: 300px;
    margin: 50px auto;
    position: static;
    top: 100px;
    left: 100px;
    z-index: 10;
}

[data-element-id] .loading-inner .loading-item {
    -webkit-filter: unset;
    filter: unset;
}

[data-element-id] .header-nav {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    align-items: flex-start;
    -ms-flex-align: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

[data-element-id] .header-nav li {
    margin: 5px;
}

[data-element-id] .dropmenu-display {
    min-width: 120px;
    display: block;
    padding-top: 1em;
    border: 2px solid green;
    position: relative;
}

[data-element-id] .dropmenu-display::before {
    content: "モバイルのみ表示";
    width: 100%;
    display: block;
    padding: 0.25em;
    font-size: 10px;
    color: white;
    line-height: 1;
    text-align: center;
    background-color: green;
    position: absolute;
    top: 0;
    left: 0;
}

[data-element-id] #dropmenu .dropdown ul {
    margin-top: 10px;
    opacity: 1;
    -webkit-transform: unset;
    transform: unset;
    position: static;
    z-index: 10;
}

[data-element-id] .dropmenu .dropdown ul::before {
    top: 20px;
    left: 30px;
    right: initial;
}

[data-element-id] .slide01 div[data-collection-list-content] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow-x: scroll;
}

[data-element-id] .slide01 div[data-collection-list-content] .works-item {
    width: 24%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: 1%;
}

[data-element-id] .mv_text {
    opacity: 1;
    -webkit-filter: unset;
    filter: unset;
    -webkit-transform: unset;
    transform: unset;
}

[data-element-id] .contact-btn {
    display: block;
    position: absolute;
}

[data-element-id] .list-faq li a .caption {
    position: static;
}

[data-element-id] .loading-inner {
    border: 2px solid green;
}

[data-element-id] .loading-inner::after {
    content: "ローディング画面です";
    width: 100%;
    height: 20px;
    display: block;
    padding: 0.25em;
    font-size: 10px;
    color: white;
    line-height: 1;
    text-align: center;
    background-color: green;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

[data-element-id].news-box .list-news {
    width: 80%;
}

[data-element-id] .up-d-none {
    display: block;
    border: solid 4px black;
    position: relative;
}

[data-element-id] .up-d-none:after {
    content: "モバイル用";
    display: block;
    padding: 5px;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
    text-align: center;
    background: black;
}

[data-element-id] .up-sp-text {
    width: 100%;
    max-width: 375px;
    margin: auto;
}

[data-element-id] .cliphome-absolute .up-sp-text {
    font-size: 44px;
}

[data-element-id] .cliphome-absolute .main .up-sp-text {
    font-size: 24px;
}

[data-element-id] .cliphome-absolute .sub .up-sp-text {
    font-size: 13px;
}

[data-element-id] .up-sp-text .title_01,
[data-element-id] .title_01 .up-sp-text {
    font-size: 28px;
    letter-spacing: 1px;
}

[data-element-id] .up-sp-text .title_02 {
    font-size: 20px;
    letter-spacing: 0;
}

[data-element-id] .up-sp-text .title_03 {
    font-size: 28px;
}

[data-element-id] .lower-keyvisual .bg-content {
    width: 650px;
    min-width: 650px;
    border: 3px dashed #fff;
}

[data-element-id].onayami-list>.up-sp-text {
    margin: 0px calc(100% - 375px) 0 0;
}