@charset "utf-8";







/* # root3 START # */

:root {

    --color01: #8fbc8f;

    --color02: #f5fff5;

    --color03: #618061;

    --color04: #e6fbe6;

    --bgi01: url(../images/hb.webp);

    --bgi02: url(../images/hb2.webp);

    --bgi03: url(../images/hb03.webp);

    --bgi04: url(../images/top26_003.webp);

}

/* # root3 END # */



/* # root2 START # */

/*:root {

    --color01: #c82c55;

    --color02: #f7e0e6;

    --color03: #b22249;

    --color04: #f79eb5;

    --bgi01: url(../images/paint02_002.webp);

    --bgi02: url(../images/paint00_002.webp);

    --bgi03: url(../images/paint01_002.webp);

    --bgi04: url(../images/top26_002.webp);

} */

/* # root2 END # */



/* # root1 START # */

/* :root {

    --color01: #ffc569;

    --color02: #fff8ec;

    --color03: #fa6e59;

    --color04: #fff7b5;

    --bgi01: url(../images/paint02.webp);

    --bgi02: url(../images/paint00.webp);

    --bgi03: url(../images/paint01.webp);

    --bgi04: url(../images/top26.webp);

} */

/* # root1 END # */



/* 画像取り込み用 */

.bgi01-orange {

    background-image: url(../images/paint02.webp);

}



.bgi01-pink {

    background-image: url(../images/paint02_002.webp);

}



.bgi01-green {

    background-image: url(../images/paint02_003.webp);

}



.bgi02-orange {

    background-image: url(../images/paint00.webp);

}



.bgi02-pink {

    background-image: url(../images/paint00_002.webp);

}



.bgi02-green {

    background-image: url(../images/paint00_003.webp);

}



.bgi03-orange {

    background-image: url(../images/paint01.webp);

}



.bgi03-pink {

    background-image: url(../images/paint01_002.webp);

}



.bgi03-green {

    background-image: url(../images/paint01_003.webp);

}



.bgi04-orange {

    background-image: url(../images/top26.webp);

}



.bgi04-pink {

    background-image: url(../images/top26_002.webp);

}



.bgi04-green {

    background-image: url(../images/top26_003.webp);

}



.bgc-02 {

    background: var(--color02);

}



body {

    font-family: "Noto Sans JP", sans-serif;

    color: #444;

    letter-spacing: 0.1em;

}



#wrapper {

    min-width: 375px;

    overflow: hidden;

    position: relative;

}



/* ##### 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: #ccc;

}



.uk-dotnav-contrast>.uk-active>* {

    background: #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: 80px;

}



.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-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(../images/house_shape_002.webp);

    mask-image: url(../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: none;

    }



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

        margin-left: 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: -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;

}



[data-element-id] .cliphome-absolute .up-sp-text {

    font-size: 44px;

}



.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 .main .img{

max-width: 500px;

    margin: auto;

}



[data-element-id] .cliphome-absolute .main .up-sp-text {

    font-size: 24px;

}



.cliphome-absolute .sub {

    padding: 0 5px;

    font-weight: 400;

    font-size: 30%;

    letter-spacing: 0.1em;

    position: relative;

}



[data-element-id] .cliphome-absolute .sub .up-sp-text {

    font-size: 13px;

}



/* .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;

    }

    .cliphome-absolute .main .img{

      max-width: 300px;

    }

}



/* マージンで傾きをつくる 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;

    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;



    aspect-ratio: 1;

}



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

}



@media(max-width:1024px) {

    .balloon {

        width: 120px;

        font-size: 20px;

    }



    .balloon-inner::before {

        bottom: -45px;

        right: -47px;

    }

}



@media(max-width:599px) {

    .balloon {

        width: 100px;

        font-size: 20px;

    }



    .balloon-inner::before {

        bottom: -40px;

        right: -41px;

    }



    .translate-parent10 {

        margin-top: 0;

    }

}



/* 日付用の吹き出し */

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

}



.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: #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: 100px;

        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(../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(../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;

    margin-bottom: 50px;

    font-weight: 700;

    font-size: 48px;

    color: #444;

    letter-spacing: 0.2em;

    position: relative;

    z-index: 1;

}



[data-element-id] .up-sp-text .title_01,

[data-element-id] .title_01 .up-sp-text {

    font-size: 28px;

}



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

    display: block;

    margin-left: auto;

    margin-right: auto;

    padding: 0.5em 0.5em 0 1em;

    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: 70px;

    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;

}



.title_01.-white .main,

.title_01.-white .sub {

    color: white;

}



.title_01.-white .img {

    background-image: var(--bgi02);

}



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

    margin-bottom: 30px;

    padding-left: 10px;

    font-size: 26px;



    gap: 1em;

}



[data-element-id] .up-sp-text .title_02 {

    font-size: 20px;

}



.title_02 span {

    display: block;

}

.paint-num,

.title_02 .main {

    flex-shrink: 0;

    position: relative;

}

.paint-num .img,

.title_02 .main .img {

    width: 70px;

    -ms-flex-negative: 0;

    flex-shrink: 0;

    background-image: var(--bgi01);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    transform: translate(-50%, -50%);

    position: absolute;

    top: 15%;

    left: 50%;



    aspect-ratio: 1;

}



.paint-num .num,

.title_02 .num {

    width: 100%;

    font-size: 28px;

    color: #fff;

    line-height: 1.6;

    text-align: center;

    position: relative;

    z-index: 1;

}



.paint-num .num {

    font-size: 32px;

}



.title_02 .sub {

    -webkit-box-flex: 1;

    -ms-flex-positive: 1;

    flex-grow: 1;

    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;

}



[data-element-id] .up-sp-text .title_03 {

    font-size: 28px;

}



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

}



@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;

    }

}



@media(max-width:599px) {

  .title_01 .main{

    margin-bottom: 10px;

  }

    .title_01 {

        font-size: 28px;

        padding-left: 0;

    }

    

    .bg-parent .title_01{

      padding-left: 24px;

    }



    .title_01 .img {

        width: 60px;

    }



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

        margin-bottom: 15px;

        font-size: 20px;



        gap: 10px;

    }



    .title_02 .sub {

        -webkit-box-flex: 0;

        -ms-flex-positive: 0;

        flex-grow: 0;

    }



    .title_03 {

        font-size: 28px;

    }



    .title_02 .num {

        font-size: 120%;

    }



    .title_01 .sub {

        font-size: 16px;

    }



    .paint-num .img,

    .title_02 .main .img {

        width: 60px;

        height: 60px;

    }

}



[data-element-id] .title_01 .main{

  margin-bottom: 15px;

}



/* カテゴリー */



.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: 55px;

    height: 55px;

    -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);

    border:solid var(--color01) 1px;

}



.pagenation li a{

  background-color: #fff;

  color: var(--color01);

}



.pagenation li a:hover{

  background-color: var(--color01);

  color: #fff;

}



.pagenation li.prev a::before,

.pagenation li.next a::before {

    content: "\f105";

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

}



.pagenation li.prev a:hover::before,

.pagenation li.next a:hover::before{

    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: 4em auto 4em 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: 15%;

    right: 3%;

    z-index: 20;

}



.contact-btn a {

    display: block;

    position: relative;

}



.contact-btn .contact-btn-img {

    width: 135px;

    background-image: var(--bgi03);

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    transform: translate(-50%, -50%);

    position: absolute;

    top: 15%;

    left: 50%;



    aspect-ratio: 1;

}



.contact-btn .icon {

    font-size: 2.5em;

    color: var(--color01);

    line-height: 1;

    text-align: center;

}



.contact-btn .text {

    font-weight: bold;

    color: var(--color01);

    text-align: center;

}



@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);

}



.tolist-btn.new{

      width: 100%;

    max-width: 350px;

}



/* リンクしない飾りだけのボタン */

.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: 35%;

}



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

}



.header-mitumori.type-b a{

  position: relative;

  overflow: hidden;

}

.header-mitumori.type-b a::before {

    content: "";

    width: 200%;

    height: 200%;

    background: rgba(255, 255, 255, 0.5);

    transform: rotate(45deg);

    animation: shine 2s infinite;

    position: absolute;

    top: -50%;

    left: -50%;

}



@keyframes shine {

    0% {

        top: -50%;

        left: -150%;

    }

    50% {

        left: 150%;

    }

    100% {

        left: 150%;

    }

}



.type-b .header-mitumori a {

    background-color: var(--color03);

}



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

}



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

}



.sns-wrap {

    margin-top: 10px;

}



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

}



.sns-icon {

    line-height: 1;

}



.sns-icon+.sns-icon {

    margin-left: 1em;

}



.sns-icon a::before {

    list-style: 1;

    font-family: "Font Awesome 5 Brands";

    font-weight: 500;

    font-size: 40px;

}



.sns-line a::before {

    content: "\f3c0";

    color: #01b900;

}



.sns-insta a::before {

    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-top: 0;

    margin-left: 1em;

}



.header-fixed .header-container .address {

    display: none;

}



.header-fixed .header-logo {

    width: 220px;

}



@media(max-width:1024px) {

    h1 {

        text-shadow: 1px 1px 0px white,

        -1px 1px 0px white,

        1px -1px 0px white,

        -1px -1px 0px white,

        1px 0px 0px white,

        0px 1px 0px white,

        -1px 0px 0px white,

        0px -1px 0px white;

        position: absolute;

        top: 0;

        left: 0;

        z-index: 1;

    }



    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.075em;

        text-align: center;

    }



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

        height: 60vh;

        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;

        margin-bottom: 450px;

    }



    .header-item-nav .header-element #gnav {

        width: 100%;

        height: 100%;

        -webkit-box-flex: 1;

        -ms-flex-positive: 1;

        flex-grow: 1;

        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 {

        overflow-y: hidden;

        -webkit-filter: blur(5px);

        filter: blur(5px);

    }



    .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>div {

        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;

    }

}



@media(max-width:599px) {

    h1 {

        padding-right: 60px;

    }



    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;

    }

    

    .header-item-logo .address{

      text-align: left;

      font-size: 14px;

    }

}



/* ##### 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: 100%;

    height: 40px;

    display: block;

    position: absolute;

    top: -40px;

    left: 0;

}



#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 {

        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: 110%;

    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: 35%;

    -ms-flex-negative: 0;

    flex-shrink: 0;

}



.news-box .list-news {

    width: 10%;

    -webkit-box-flex: 1;

    -ms-flex-wrap: nowrap;

    flex-wrap: nowrap;

    -ms-flex-positive: 1;

    flex-grow: 1;

}



.news-box .btn {

    width: 60px;

    -ms-flex-negative: 0;

    flex-shrink: 0;

    margin-left: 1em;

}



.list-news {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

}





.list-news dt {

    width: -webkit-fit-content;

    width: -moz-fit-content;

    width: fit-content;

    -ms-flex-negative: 0;

    flex-shrink: 0;

}



.list-news dd {

    width: 60%;

    -webkit-box-flex: 1;

    -ms-flex-positive: 1;

    flex-grow: 1;

    margin-left: 1em;

}



@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;

    }



    .news-box .title_01 {

        width: 100%;

        -ms-flex-negative: 0;

        flex-shrink: 0;

    }



    .list-news dd {

        width: 100%;

        margin-left: 0;

    }

}



/* ローディング */

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

    filter: blur(0);

    position: relative;

}



.loading-inner::before {

    content: "";

    width: 100%;

    height: 100%;

    display: block;

    background-color: #fff;

    -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.loading-content{

font-family: "Shippori Mincho", serif;

font-weight: 400;

}



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

}



.mv_text{

  font-family: "Shippori Mincho", serif;

}



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

    writing-mode: vertical-rl;

    border-radius: 6px;

    background-color: var(--color01);

    position: absolute;

    top: -10px;

    left: 20px;



    text-orientation: upright;

}



@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;

}



.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 {

    margin: 0 20px;

}



.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: 14px;

    color: var(--color01);

    letter-spacing: 0.1em;

}



.works-category .js-split-tag span {

    margin-right: 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: 110px;

    }



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

    }

}



/* トップページVOICE */

.qa-bg-image {

    overflow: hidden;

    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 ul {

    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: 18px;

    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%;

    }

}



/* トップページ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 ul li:last-of-type {

    position: relative;

}



.blog ul li:last-of-type {

    position: relative;

}



.blog iframe {

    border: 3px solid #fff;

    border-radius: 0.5em;

}



.blog .deco-element {

    margin-bottom: 1em;

}



.blog .deco-element img {

    border-radius: 0.25em;

}



.blog .date {

    margin-bottom: 1em;

    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%;

}



.map-deco {

    border: 4px solid white;

    border-radius: 1em;

}



@media(max-width:599px) {

    .access .title_01 {

        padding: 0em 1em 1em 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: 30vw 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: 100%;

        padding: 15px 10px 0;

    }

    .list-table dd{

      padding: 15px 10px;

    }

}



/* ＃＃＃＃＃＃下層ページ：初めての方へ＃＃＃＃＃ */

/* .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 .list-inner img {

    filter: drop-shadow(0px 0px 2px #4d4d4d);

}



.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: 3em 1em 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;

    }

}



/* ＃＃＃＃＃＃下層ページ：WB工法～ドローン＃＃＃＃＃ */

.lower-onayami,

.lower-timing {

    background-image: url(../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;

    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;

}



.list-nayami .box{

    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;

    }

    

    .list-nayami .c-l li{

      font-size: 16px;

    }

}



[data-element-id] .list-nayami .up-fz-26{

  font-size: 20px;

}



@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;

}



.list-inner .img-container .date-wrap {

    position: absolute;

    top: 0;

    left: 0;

    z-index: 1;

    display: none;

}



.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-inner .img-container .category span {

    display: inline-block;

    margin: 0.1em;

    line-height: 1.2;

}

.list-inner .img-container .category .js-split-tag span,

.voice .category .js-split-tag span{

    border-bottom: solid 1px;

    margin-right: 5px;

    margin-bottom: 2px;

}

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

    }

}



@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;

    }



    .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 .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 {

display: inline-block;

    margin: 1px;

    padding: 0.1em 0.5em;

    font-size: 14px;

    color: #fff;

    background-color: var(--color01);

}



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

}



.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: 2em 1em;

    }



    .voice-detail-img,

    .voice-detail-content {

        width: 100%;

    }



    .voice-detail-img {

        margin-bottom: 15px;

    }



    .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 10px;

    color: var(--color01);

}



.lower-news .list-news .category span {

    display: inline-block;

    margin-left: 0.5em;

    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;

    }



    .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 .title {

        font-size: 20px;

    }



    .lower-news-detail .content .category span {

        font-size: 12px;

    }

}



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

.blog-info-wrap {

    margin: 0.5em 0;

}



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

    padding: 20px;

    border-bottom: 1px solid var(--color01);

}



.lower-recruit-detail dl dt {

    width: 150px;

    flex-shrink: 0;

    margin-right: 20px;

    font-weight: bold;

}



.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 .textbox {

    width: 80%;

    margin-left: auto;

    margin-right: auto;

}



.contactbox_02 .textbox ul li {

    margin-left: 1em;

    text-indent: -1em;

}



.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: #fff;

}



.contact-wrap dl {

    margin-bottom: 30px;

}



.contact-wrap dt {

    width: 160px;

}



.contact-wrap dt div {

    color: #fff;

    background: #7b6c61;

}



.contact-wrap dl dt.t-new div{

      color: #444;

    background: none;

}



.contact-wrap dl dt.t-new .t-text {

    display: flex;

}



.contact-wrap dd {

    width: calc(100% - 170px);

}



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

}



@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;

    -webkit-box-shadow: 20px 20px 60px #dcdcdc,

    -20px -20px 60px white;

    box-shadow: 20px 20px 60px #dcdcdc,

    -20px -20px 60px white;

}



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

}



@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;

}



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



[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;

}



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

    margin-bottom: 3px;

    margin-right: 3px;

    padding: 5px 10px;

    font-size: 16px;

    line-height: 1em;

    border: 3px solid var(--color01);

    border-radius: 6px;

}



/*@media(max-width:599px){

  .header-item.header-item-nav{

    position:fixed;

    z-index:900;

  }

}*/



.uk-lb {

    cursor: pointer;

}



[data-element-id] .lower-keyvisual .bg-content {

    width: 650px;

    min-width: 650px;

    border: 3px dashed #fff;

}



@media(max-width:599px) {

    .fixed-content {

        width: 100%;

        max-width: 100vw;

        padding: 8px;

        border-radius: 0;

        background-color: rgba(0, 0, 0, 0.2);

        opacity: 1;

        position: fixed;

        bottom: 0;

        right: 0;

        z-index: 31;

        ;

    }



    .header-info .phone,

    .header-mitumori {

        margin: 0;

    }



    .header-info .phone .tel a {

        font-size: 16px;

        letter-spacing: 0;

    }



    .news-box {

        padding: 30px 5px;

    }

}



.d-none-tb,

.d-none-sp {

    display: block;

}

.d-b-tb,

.d-b-sp {

    display: none;

}

@media (max-width: 1024px) {

    .d-b-tb {

        display: block;

    }

    .d-none-tb {

        display: none;

    }

}

@media (max-width: 599px) {

    .d-none-sp {

        display: none;

    }

    .d-b-sp {

        display: block;

    }

}



.c-l li {

    padding-left: 1em;

    position: relative;

}

.c-l li+li {

    margin-top: 5px;

}

.c-l li::after {

    content: "";

    width: 5px;

    height: 5px;

    border-radius: 50%;

    background: #000;

    position: absolute;

    top: 10px;

    left: 0;

}



.js-split-tag{

  display: flex;

    flex-wrap: wrap;

        align-items: flex-start;

}



.picbox-container .day{

  flex-shrink: 0;

}



.contact-wrap dd.radio{

  position: relative;

}



.contact-wrap dd.radio .uk-text-danger {

    position: absolute;

    left: 0;

        bottom: 0;

}



@media (max-width: 599px) {

  .contact-wrap dd.radio .uk-text-danger {

        position: relative;

    }

}