html {
    margin: 0;
    padding: 0;
    width: 100%;
    scroll-behavior: smooth;
    min-width: 320px;
    font-family: var(--font-family-main)
}

body {
    position: relative;
    margin: 0;
    padding: 0;
    width: 100%;
    font-style: normal;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
    min-height: 100vh;
    font-size: clamp(.7777777778rem, .1111111111rem + 2.0833333333vw, 1rem);
    line-height: 1.8;
    font-weight: 400
}

main {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
}

article,
button,
input,
select,
section,
textarea,
div,
span,
p,
a,
pre,
table,
th,
td,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0);
    text-decoration: none;
    word-break: break-all;
    word-wrap: break-word;
    list-style: none;
    vertical-align: baseline;
    outline: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
    text-rendering: optimizeLegibility;
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    color: inherit
}

img {
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    border: none;
    border-style: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0);
    vertical-align: bottom;
    outline: none;
    -ms-interpolation-mode: bicubic
}

a {
    color: var(--co_black);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    text-decoration: underline;
    -webkit-transition: .3s;
    transition: .3s
}

a:hover {
    opacity: .6;
    -webkit-transition: .3s;
    transition: .3s
}

a:focus,
a button:focus {
    outline: none
}

a img {
    -webkit-transition: .3s;
    transition: .3s
}

a img:hover {
    -webkit-filter: brightness(110%);
    filter: brightness(110%)
}

.br_txt {
    display: inline
}

@media screen and (max-width: 768px) {
    .br_txt {
        display: none
    }
}

.br_txt_ol {
    display: none
}

@media screen and (max-width: 768px) {
    .br_txt_ol {
        display: inline
    }
}

.global_nav .nav_toggle {
    margin-left: 20px
}

.global_nav .nav_toggle>.inner {
    width: 80px;
    height: 80px;
    position: relative;
    background: var(--co_brown);
    background: var(--co_blue);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
    z-index: 9999;
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
    -ms-flex-order: 3;
    order: 3
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle>.inner {
        width: 40px;
        height: 40px
    }
}

.global_nav .nav_toggle>.inner span {
    display: block;
    position: absolute;
    height: 3px;
    width: 40px;
    background: var(--co_white);
    opacity: .8;
    left: 20px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle>.inner span {
        left: 10px;
        width: 20px;
        height: 2px
    }
}

.global_nav .nav_toggle>.inner span:nth-child(1) {
    top: 23px
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle>.inner span:nth-child(1) {
        top: 10px
    }
}

.global_nav .nav_toggle>.inner span:nth-child(2) {
    top: 38px
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle>.inner span:nth-child(2) {
        top: 19px
    }
}

.global_nav .nav_toggle>.inner span:nth-child(3) {
    top: 53px
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle>.inner span:nth-child(3) {
        top: 28px
    }
}

.global_nav .nav_toggle.show>.inner span:nth-child(1) {
    -webkit-transform: translateY(15px) rotate(-45deg);
    transform: translateY(15px) rotate(-45deg)
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle.show>.inner span:nth-child(1) {
        -webkit-transform: translateY(9px) rotate(-45deg);
        transform: translateY(9px) rotate(-45deg)
    }
}

.global_nav .nav_toggle.show>.inner span:nth-child(2) {
    opacity: 0
}

.global_nav .nav_toggle.show>.inner span:nth-child(3) {
    -webkit-transform: translateY(-15px) rotate(45deg);
    transform: translateY(-15px) rotate(45deg)
}

@media screen and (max-width: 768px) {
    .global_nav .nav_toggle.show>.inner span:nth-child(3) {
        -webkit-transform: translateY(-9px) rotate(45deg);
        transform: translateY(-9px) rotate(45deg)
    }
}

.global_nav .menu {
    background: var(--co_gray);
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity .5s, visibility .5s;
    transition: opacity .5s, visibility .5s;
    display: grid;
    grid-template-columns: 1fr 1fr
}

@media screen and (max-width: 768px) {
    .global_nav .menu {
        display: block
    }
}

.global_nav .menu.show {
    opacity: 1;
    visibility: visible
}

.global_nav .menu .photo {
    background-image: url("../img/mv_gnav.png");
    background-position: center;
    background-size: cover
}

@media screen and (max-width: 768px) {
    .global_nav .menu .photo {
        display: none
    }
}

.global_nav .menu nav {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

.global_nav .menu nav .list {
    padding: 0 30px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 10px
}

.global_nav .menu nav .list li a {
    font-size: clamp(1rem, -.6666666667rem + 5.2083333333vw, 1.5555555556rem);
    text-decoration: none;
    font-family: var(--font-family-design);
    position: relative;
    padding-left: 50px;
    display: block
}

@media screen and (max-width: 768px) {
    .global_nav .menu nav .list li a {
        padding-left: 30px
    }
}

.global_nav .menu nav .list li a::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 0;
    width: 36px;
    height: 36px;
    background-color: var(--co_brown);
    background-color: var(--co_blue);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20333%20600%22%20style%3D%22enable-background%3Anew%200%200%20333%20600%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M300.2%2C250.4L61.6%2C11.8C47.9-1.9%2C25.7-1.9%2C12%2C11.8l0%2C0C-1.7%2C25.5-1.7%2C47.7%2C12%2C61.3L250.7%2C300L12%2C538.7%20c-13.7%2C13.7-13.7%2C35.9%2C0%2C49.6h0c13.7%2C13.7%2C35.9%2C13.7%2C49.6%2C0l238.7-238.7l17.9-17.9c17.5-17.5%2C17.5-45.9%2C0-63.4L300.2%2C250.4z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}

@media screen and (max-width: 768px) {
    .global_nav .menu nav .list li a::before {
        width: 18px;
        top: 2vw;
        height: 18px;
        background-size: 8px 8px
    }
}

body {
    background-image: url("../img/bg.png");
    background-position: center;
    background-size: cover
}

header.scroll {
    position: fixed;
    top: 0;
    margin-top: 0;
    width: 100%
}

header {
    -webkit-transition: margin .2s ease;
    transition: margin .2s ease;
    -webkit-transition-property: margin;
    transition-property: margin;
    margin-top: -50px;
    top: 50px;
    overflow: hidden;
    position: absolute;
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
    background: -webkit-linear-gradient(top, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    z-index: 1;
    width: 100%
}

header>.inner {
    margin: auto;
    max-width: 1400px;
    width: 100%;
    padding: 0 1rem;
    display: grid;
    grid-template-columns: 1fr auto auto;
    width: 100%;
    padding: 20px
}

header>.inner>.logo h1 {
    background-image: url("../img/logo.png");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
    width: 100%;
    max-width: 456px;
    height: clamp(2.7777777778rem, -2.2222222222rem + 15.625vw, 4.4444444444rem);
    text-indent: -9999px;
    position: relative;
    z-index: 5
}

header>.inner>.cont {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: relative;
    z-index: 3
}

@media screen and (max-width: 768px) {
    header>.inner>.cont {
        position: fixed;
        display: block;
        bottom: 0;
        left: 0;
        width: 100%
    }
}

header>.inner>.cont>.inner {
    font-family: var(--font-family-design)
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner {
        background-color: var(--co_white)
    }
}

header>.inner>.cont>.inner>.tel {
    text-align: right;
    line-height: 40px
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.tel {
        line-height: normal
    }
}

header>.inner>.cont>.inner>.tel a {
    text-decoration: none;
    position: relative;
    padding-left: 26px;
    display: block
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.tel a {
        width: 100%;
        padding-left: 0;
        padding-top: 40px;
        padding-bottom: 5px;
        background-color: var(--co_brown);
        background-color: var(--co_blue);
    }
}

header>.inner>.cont>.inner>.tel a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2019.9%2027.4%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%2349291d%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M9.3%2C17.5s-3-5.1-3-5.1c-.6-1.4-1.1-2.7%2C0-3.4L1.9%2C1.7c-1.1.8-4.3%2C5.4%2C1.6%2C15.7%2C6.3%2C10.9%2C12.2%2C10.4%2C13.4%2C9.7l-4.2-7.1c-1%2C.6-1.8-.4-3.4-2.5ZM19.9%2C24.3h0s-3.3-5.6-3.3-5.6c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.2%2C7.2s2-1.2%2C2-1.2h0c.5-.3.6-.8.3-1.3ZM8.8%2C7.5h0c.5-.3.6-.8.3-1.3h0S5.7.5%2C5.7.5c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.3%2C7.3s2-1.2%2C2-1.2Z%22%2F%3E%3C%2Fsvg%3E");
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 20px 38px;
    width: 20px;
    height: 40px
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.tel a::before {
        background-size: 15px 24px;
        height: 24px;
        width: 100%;
        top: 10px;
        background-position: center top;
        background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2019.9%2027.4%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23ffffff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M9.3%2C17.5s-3-5.1-3-5.1c-.6-1.4-1.1-2.7%2C0-3.4L1.9%2C1.7c-1.1.8-4.3%2C5.4%2C1.6%2C15.7%2C6.3%2C10.9%2C12.2%2C10.4%2C13.4%2C9.7l-4.2-7.1c-1%2C.6-1.8-.4-3.4-2.5ZM19.9%2C24.3h0s-3.3-5.6-3.3-5.6c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.2%2C7.2s2-1.2%2C2-1.2h0c.5-.3.6-.8.3-1.3ZM8.8%2C7.5h0c.5-.3.6-.8.3-1.3h0S5.7.5%2C5.7.5c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.3%2C7.3s2-1.2%2C2-1.2Z%22%2F%3E%3C%2Fsvg%3E")
    }
}

header>.inner>.cont>.inner>.tel a .num {
    font-size: clamp(1.1111111111rem, -1.2222222222rem + 7.2916666667vw, 1.8888888889rem);
    display: block
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.tel a .num {
        display: none
    }
}

header>.inner>.cont>.inner>.tel a .ttl {
    display: none
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.tel a .ttl {
        text-align: center;
        display: block;
        width: 100%;
        color: var(--co_white)
    }
}

header>.inner>.cont>.inner>.txt {
    text-align: right;
    font-size: clamp(.7777777778rem, .4444444444rem + 1.0416666667vw, .8888888889rem);
    line-height: 18px
}

@media screen and (max-width: 768px) {
    header>.inner>.cont>.inner>.txt {
        display: none
    }
}

.yellow {
    color: var(--co_yellow)
}

main {
    position: relative;
    z-index: 0
}

main>.inner .visual {
    background-image: url("../img/mv.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    min-height: 100vh;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    z-index: 0
}

@media screen and (max-width: 768px) {
    main>.inner .visual {
        min-height: 90vh;
        -webkit-align-content: flex-end;
        -ms-flex-line-pack: end;
        align-content: flex-end;
        background-image: url("../img/mv_sp.png")
    }
}

main>.inner .visual::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%201400%2070%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23fff%3B%20fill-rule%3A%20evenodd%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20id%3D%22mv_wave.svg%22%20class%3D%22st0%22%20d%3D%22M-6%2C58S238%2C0%2C481%2C0s447%2C57%2C669%2C57%2C250-28%2C250-28v41H-6v-12Z%22%2F%3E%3C%2Fsvg%3E");
    background-position: center bottom;
    background-repeat: no-repeat
}

main>.inner .visual>.inner {
    z-index: 1;
    position: relative;
    margin: auto;
    max-width: 1400px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .visual>.inner>.cont {
    margin-top: 120px
}

main>.inner .visual>.inner>.cont>.ttl .line {
    display: inline;
    letter-spacing: .3rem;
    font-size: clamp(1.3333333333rem, -1rem + 7.2916666667vw, 2.1111111111rem);
    font-family: var(--font-family-design);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-color: var(--co_white-10);
    padding: 0 10px;
    font-weight: 600
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.ttl .line {
        letter-spacing: .2rem
    }
}

main>.inner .visual>.inner>.cont>.feature {
    margin-top: 40px;
    max-width: 740px
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature {
        margin-bottom: 30px;
        margin-top: -5px
    }
}

main>.inner .visual>.inner>.cont>.feature ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
    position: relative
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        height: clamp(16.6666666667rem, -20rem + 114.5833333333vw, 28.8888888889rem);
        gap: 0
    }
}

main>.inner .visual>.inner>.cont>.feature ul li {
    background-color: var(--co_white-10);
    border-radius: 50%;
    aspect-ratio: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    font-family: var(--font-family-design)
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li {
        width: clamp(8.8888888889rem, -11.1111111111rem + 62.5vw, 15.5555555556rem);
        position: absolute
    }
}

main>.inner .visual>.inner>.cont>.feature ul li .point {
    font-size: clamp(.6666666667rem, .3333333333rem + 1.0416666667vw, .7777777778rem);
    font-weight: 600;
    position: relative;
    padding-top: 32px
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li .point {
        padding-top: 22px
    }
}

main>.inner .visual>.inner>.cont>.feature ul li .point::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2071%2073%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23370e0d%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M42.536%2C70.057c1.751%2C3.126%2C4.423%2C3.914%2C7.04%2C3.058s5.181-3.357%2C6.715-6.809c1.251-2.814%2C2.095-5.033%2C3.189-8.144s2.439-7.112%2C4.689-13.49c1.407-3.986%2C2.69-7.637%2C3.761-11.342s1.931-7.465%2C2.491-11.667c.75-5.627.116-9.917-1.545-13.156s-4.35-5.427-7.709-6.852c-7.223-3.064-12.233-1.376-16.145%2C1.079s-6.726%2C5.674-9.555%2C5.674-5.643-3.158-9.547-5.58S17.024-1.286%2C9.833%2C1.653c-3.377%2C1.38-6.066%2C3.569-7.723%2C6.819S-.171%2C16.034.579%2C21.661c.56%2C4.203%2C1.42%2C7.962%2C2.491%2C11.667s2.354%2C7.356%2C3.761%2C11.342c2.251%2C6.378%2C3.595%2C10.379%2C4.689%2C13.49s1.938%2C5.33%2C3.189%2C8.144c1.534%2C3.452%2C4.098%2C5.953%2C6.715%2C6.809s5.29.068%2C7.04-3.058c1.402-2.504%2C1.655-7.443%2C2.307-11.757s1.703-8.001%2C4.702-8.001%2C4.063%2C3.688%2C4.728%2C8.001.931%2C9.253%2C2.333%2C11.757Z%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-size: 26px 26px;
    background-repeat: no-repeat;
    width: 100%;
    height: 26px
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li .point::before {
        background-size: 18px 18px;
        height: 18px
    }
}

main>.inner .visual>.inner>.cont>.feature ul li .ttl {
    margin-top: 10px;
    font-size: clamp(.8888888889rem, .2222222222rem + 2.0833333333vw, 1.1111111111rem);
    height: 60px;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 15px
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li .ttl {
        margin-top: 1.3vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li .ttl {
        height: 40px;
        line-height: 140%
    }
}

/*main>.inner .visual>.inner>.cont>.feature ul li.point_01 .ttl .yellow {
    font-size: clamp(.8888888889rem, -.7777777778rem + 5.2083333333vw, 1.4444444444rem)
}*/

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li.point_01 {
        top: 0
    }
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li.point_02 {
        left: clamp(.2777777778rem, -5.5555555556rem + 18.2291666667vw, 2.2222222222rem);
        bottom: 0
    }
}

@media screen and (max-width: 768px) {
    main>.inner .visual>.inner>.cont>.feature ul li.point_03 {
        right: clamp(.2777777778rem, -5.5555555556rem + 18.2291666667vw, 2.2222222222rem);
        bottom: 0
    }
}

main>.inner .ttl_pre_more {
    font-family: var(--font-family-design);
    font-size: clamp(1.4444444444rem, .1111111111rem + 4.1666666667vw, 1.8888888889rem);
    position: relative
}

main>.inner .ttl_sec {
    font-family: var(--font-family-design);
    position: relative;
    font-size: clamp(1.1111111111rem, .4444444444rem + 2.0833333333vw, 1.3333333333rem)
}

main>.inner .ttl_pre {
    text-align: center;
    font-family: var(--font-family-design);
    font-size: clamp(1.4444444444rem, .1111111111rem + 4.1666666667vw, 1.8888888889rem);
    position: relative;
    padding-top: 50px
}

@media screen and (max-width: 768px) {
    main>.inner .ttl_pre {
        padding-top: 30px
    }
}

main>.inner .ttl_pre::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 36px;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2071%2073%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23370e0d%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M42.536%2C70.057c1.751%2C3.126%2C4.423%2C3.914%2C7.04%2C3.058s5.181-3.357%2C6.715-6.809c1.251-2.814%2C2.095-5.033%2C3.189-8.144s2.439-7.112%2C4.689-13.49c1.407-3.986%2C2.69-7.637%2C3.761-11.342s1.931-7.465%2C2.491-11.667c.75-5.627.116-9.917-1.545-13.156s-4.35-5.427-7.709-6.852c-7.223-3.064-12.233-1.376-16.145%2C1.079s-6.726%2C5.674-9.555%2C5.674-5.643-3.158-9.547-5.58S17.024-1.286%2C9.833%2C1.653c-3.377%2C1.38-6.066%2C3.569-7.723%2C6.819S-.171%2C16.034.579%2C21.661c.56%2C4.203%2C1.42%2C7.962%2C2.491%2C11.667s2.354%2C7.356%2C3.761%2C11.342c2.251%2C6.378%2C3.595%2C10.379%2C4.689%2C13.49s1.938%2C5.33%2C3.189%2C8.144c1.534%2C3.452%2C4.098%2C5.953%2C6.715%2C6.809s5.29.068%2C7.04-3.058c1.402-2.504%2C1.655-7.443%2C2.307-11.757s1.703-8.001%2C4.702-8.001%2C4.063%2C3.688%2C4.728%2C8.001.931%2C9.253%2C2.333%2C11.757Z%22%2F%3E%3C%2Fsvg%3E");
    background-position: center;
    background-size: 36px 36px;
    background-repeat: no-repeat
}

@media screen and (max-width: 768px) {
    main>.inner .ttl_pre::before {
        background-size: 24px 24px;
        height: 24px
    }
}

main>.inner .ttl_pre .en {
    margin-top: 10px;
    font-size: clamp(.6666666667rem, -.3333333333rem + 3.125vw, 1rem)
}

@media screen and (max-width: 768px) {
    main>.inner .ttl_pre .en {
        margin-top: 1.3vw
    }
}

main>.inner .en {
    font-family: var(--font-family-design);
    display: block;
    color: var(--co_yellow);
    text-transform: uppercase
}

main>.inner .problem {
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
    background: -webkit-linear-gradient(top, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    padding-top: 80px
}

@media screen and (max-width: 768px) {
    main>.inner .problem {
        padding-top: 6.8vw
    }
}

main>.inner .problem>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .problem>.inner .cont {
    margin-top: 40px;
    position: relative;
    padding-bottom: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont {
        padding-bottom: 30px
    }
}

main>.inner .problem>.inner .cont::before {
    content: "";
    bottom: 0px;
    width: 100%;
    height: 40px;
    left: 0;
    position: absolute;
    z-index: 1;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2065%2032.5%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23dcd7d4%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22.382%200%2032.5%2032.118%2064.618%200%20.382%200%22%2F%3E%3C%2Fsvg%3E");
    background-size: 80px 40px;
    background-position: center bottom;
    background-repeat: no-repeat
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont::before {
        background-size: 60px 30px
    }
}

main>.inner .problem>.inner .cont>.inner {
    padding: 60px;
    background-color: var(--co_gray);
    border-radius: 6px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont>.inner {
        padding: 30px;
        gap: 30px;
        grid-template-columns: 1fr
    }
}

main>.inner .problem>.inner .cont>.inner .photo {
    border-radius: 3px;
    border: 1px solid var(--co_light_yellow);
    background-image: url("../img/photo_problem_01.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    aspect-ratio: 3/2
}

main>.inner .problem>.inner .cont>.inner .list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

main>.inner .problem>.inner .cont>.inner .list ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: clamp(.8333333333rem, -.8333333333rem + 5.2083333333vw, 1.3888888889rem)
}

main>.inner .problem>.inner .cont>.inner .list ul li {
    position: relative;
    padding-left: 40px;
    font-size: clamp(.8888888889rem, .2222222222rem + 2.0833333333vw, 1.1111111111rem);
    font-family: var(--font-family-design)
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont>.inner .list ul li {
        padding-left: 32px
    }
}

main>.inner .problem>.inner .cont>.inner .list ul li::before {
    content: "";
    left: 0;
    top: 0;
    position: absolute;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2030%2030%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23fff%3B%20%7D%20.st1%20%7B%20fill%3A%20%2349291d%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Crect%20class%3D%22st0%22%20width%3D%2230%22%20height%3D%2230%22%20rx%3D%221.892%22%20ry%3D%221.892%22%2F%3E%20%3Cpath%20class%3D%22st1%22%20d%3D%22M5.25%2C15.15l1.93%2C4.164%2C1.93%2C4.164c.338.711.736%2C1.235%2C1.193%2C1.574s.973.491%2C1.549.457c.474%2C0%2C.905-.085%2C1.295-.254s.736-.423%2C1.041-.761c1.083-1.93%2C2.039-3.647%2C2.869-5.154s1.532-2.801%2C2.108-3.885c.948-1.523%2C1.887-3.021%2C2.818-4.494s1.854-2.92%2C2.769-4.342l-1.625-1.066-1.625-1.066-4.824%2C7.718-4.824%2C7.718-1.32-3.199-1.32-3.199-1.98.812-1.98.812Z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px 24px;
    width: 24px;
    height: 100%
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .cont>.inner .list ul li::before {
        background-size: 20px 20px;
        width: 20px
    }
}

main>.inner .problem>.inner .answer {
    margin-top: 30px
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .answer {
        margin-top: 3.9vw
    }
}

main>.inner .problem>.inner .answer>.inner p {
    padding: 40px;
    font-size: clamp(.8888888889rem, .2222222222rem + 2.0833333333vw, 1.1111111111rem);
    font-family: var(--font-family-design);
    border: 1px solid var(--co_yellow);
    text-align: center;
    line-height: 200%
}

@media screen and (max-width: 768px) {
    main>.inner .problem>.inner .answer>.inner p {
        padding: 20px
    }
}

main>.inner .problem>.inner .answer>.inner p .line {
    color: var(--co_yellow);
    padding: 0 2px;
    letter-spacing: .1rem;
    font-size: clamp(1rem, 0rem + 3.125vw, 1.3333333333rem)
}

main>.inner>.feature {
    margin-top: 120px;
    background-color: var(--co_white-10)
}

@media screen and (max-width: 768px) {
    main>.inner>.feature {
        margin-top: 15.6vw
    }
}

main>.inner>.feature>.inner {
    margin: auto;
    max-width: 1400px;
    width: 100%;
    padding: 0 1rem;
    padding-top: 120px;
    padding-bottom: 240px
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner {
        padding-bottom: 20vw
    }
}

main>.inner>.feature>.inner>.list ul {
    margin-top: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 60px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 1200px) {
    main>.inner>.feature>.inner>.list ul {
        display: grid;
        grid-template-columns: 1fr 1fr;
        row-gap: 30px;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px
    }
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: 30px;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px
    }
}

main>.inner>.feature>.inner>.list ul li {
    width: 29%
}

@media screen and (max-width: 1200px) {
    main>.inner>.feature>.inner>.list ul li {
        width: 100%
    }
}

main>.inner>.feature>.inner>.list ul li .photo {
    border-radius: 3px;
    border: 1px solid var(--co_light_yellow);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 16/9
}

main>.inner>.feature>.inner>.list ul li .en {
    text-align: center;
    margin-bottom: 10px;
    margin-top: 20px;
    font-size: clamp(.6666666667rem, .3333333333rem + 1.0416666667vw, .7777777778rem)
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul li .en {
        margin-bottom: 1.3vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul li .en {
        margin-top: 3vw
    }
}

main>.inner>.feature>.inner>.list ul li .ttl {
    text-align: center;
    font-size: clamp(1rem, .6666666667rem + 1.0416666667vw, 1.1111111111rem);
    font-family: var(--font-family-design);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul li .ttl {
        height: auto
    }
}

main>.inner>.feature>.inner>.list ul li .txt {
    font-size: clamp(.7222222222rem, .2222222222rem + 1.5625vw, .8888888889rem);
    margin-top: 20px
}

@media screen and (max-width: 768px) {
    main>.inner>.feature>.inner>.list ul li .txt {
        margin-top: 3vw
    }
}

main>.inner>.feature>.inner>.list ul li.feature_01 .photo {
    background-image: url("../img/photo_feature_01.jpg")
}

main>.inner>.feature>.inner>.list ul li.feature_02 .photo {
    background-image: url("../img/photo_feature_02.jpg")
}

main>.inner>.feature>.inner>.list ul li.feature_03 .photo {
    background-image: url("../img/photo_feature_03.jpg")
}

main>.inner>.feature>.inner>.list ul li.feature_04 .photo {
    background-image: url("../img/photo_feature_04.jpg")
}

main>.inner>.feature>.inner>.list ul li.feature_05 .photo {
    background-image: url("../img/photo_feature_05.jpg")
}

main>.inner .inplant {
    background: var(--co_gray-10);
    position: relative
}

main>.inner .inplant>.sign {
    z-index: 0;
    text-transform: uppercase;
    font-family: var(--font-family-design);
    font-size: 180px;
    color: var(--co_gray);
    font-weight: 600;
    position: absolute;
    top: -240px;
    left: 0;
    opacity: .4
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.sign {
        top: -160px;
        font-size: 120px
    }
}

@media screen and (max-width: 768px) {
    main>.inner .inplant>.sign {
        top: -80px;
        font-size: 60px
    }
}

main>.inner .inplant>.inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
    gap: 80px
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner {
        display: block;
        margin: auto;
        max-width: 1400px;
        width: 100%;
        padding: 0 1rem;
        padding-bottom: 80px;
        padding-top: 80px
    }
}

@media screen and (max-width: 1200px)and (max-width: 768px) {
    main>.inner .inplant>.inner {
        padding-bottom: 6.8vw
    }
}

@media screen and (max-width: 1200px)and (max-width: 768px) {
    main>.inner .inplant>.inner {
        padding-top: 6.8vw
    }
}

main>.inner .inplant>.inner::before {
    opacity: .6;
    z-index: 0;
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200px;
    height: 200px;
    background-position: center;
    background-size: 200px 200px;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2071%2073%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23FFFFFF%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M42.536%2C70.057c1.751%2C3.126%2C4.423%2C3.914%2C7.04%2C3.058s5.181-3.357%2C6.715-6.809c1.251-2.814%2C2.095-5.033%2C3.189-8.144s2.439-7.112%2C4.689-13.49c1.407-3.986%2C2.69-7.637%2C3.761-11.342s1.931-7.465%2C2.491-11.667c.75-5.627.116-9.917-1.545-13.156s-4.35-5.427-7.709-6.852c-7.223-3.064-12.233-1.376-16.145%2C1.079s-6.726%2C5.674-9.555%2C5.674-5.643-3.158-9.547-5.58S17.024-1.286%2C9.833%2C1.653c-3.377%2C1.38-6.066%2C3.569-7.723%2C6.819S-.171%2C16.034.579%2C21.661c.56%2C4.203%2C1.42%2C7.962%2C2.491%2C11.667s2.354%2C7.356%2C3.761%2C11.342c2.251%2C6.378%2C3.595%2C10.379%2C4.689%2C13.49s1.938%2C5.33%2C3.189%2C8.144c1.534%2C3.452%2C4.098%2C5.953%2C6.715%2C6.809s5.29.068%2C7.04-3.058c1.402-2.504%2C1.655-7.443%2C2.307-11.757s1.703-8.001%2C4.702-8.001%2C4.063%2C3.688%2C4.728%2C8.001.931%2C9.253%2C2.333%2C11.757Z%22%2F%3E%3C%2Fsvg%3E")
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner::before {
        opacity: .4;
        bottom: auto;
        top: 20px;
        left: auto;
        right: 20px
    }
}

main>.inner .inplant>.inner>.cont {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner>.cont {
        padding: 0
    }
}

main>.inner .inplant>.inner>.cont>.inner {
    padding-left: 60px;
    max-width: 700px;
    min-height: 500px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    z-index: 1
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner>.cont>.inner {
        padding: 0;
        max-width: 100%;
        padding-left: 0px
    }
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner>.cont>.inner {
        min-height: 100%
    }
}

main>.inner .inplant>.inner>.cont>.inner h2 .en {
    margin-top: 10px;
    font-size: clamp(.7222222222rem, -.1111111111rem + 2.6041666667vw, 1rem)
}

@media screen and (max-width: 768px) {
    main>.inner .inplant>.inner>.cont>.inner h2 .en {
        margin-top: 1.3vw
    }
}

main>.inner .inplant>.inner>.cont>.inner .ttl_sec {
    margin-top: 10px
}

@media screen and (max-width: 768px) {
    main>.inner .inplant>.inner>.cont>.inner .ttl_sec {
        margin-top: 1.3vw
    }
}

main>.inner .inplant>.inner>.cont>.inner .txt {
    margin-top: 10px
}

@media screen and (max-width: 768px) {
    main>.inner .inplant>.inner>.cont>.inner .txt {
        margin-top: 1.3vw
    }
}

main>.inner .inplant>.inner>.photo {
    position: relative;
    border: 1px solid var(--co_light_yellow);
    border-radius: 3px 0px 0px 3px;
    border-right: 0;
    z-index: 1;
    margin-top: -60px;
    min-height: 300px;
    aspect-ratio: 4/3;
    background-image: url("../img/photo_inplant_01.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 40px
}

@media screen and (max-width: 1200px) {
    main>.inner .inplant>.inner>.photo {
        border-radius: 3px;
        border-right: 1px solid var(--co_light_yellow);
        min-height: 100%;
        aspect-ratio: 16/9;
        margin-top: 40px;
        margin-bottom: 0px
    }
}

@media screen and (max-width: 1200px)and (max-width: 768px) {
    main>.inner .inplant>.inner>.photo {
        margin-top: 5.2vw
    }
}

main>.inner .merit {
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .merit {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .merit {
        padding-bottom: 15.6vw
    }
}

main>.inner .merit>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .merit>.inner>.list {
    margin-top: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list {
        margin-top: 5.2vw
    }
}

main>.inner .merit>.inner>.list ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 60px
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul {
        gap: 40px
    }
}

main>.inner .merit>.inner>.list ul li {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li {
        grid-template-columns: 1fr;
        gap: 20px
    }
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li.merit_02>.cont {
        grid-column: 1/2;
        grid-row: 2/3
    }
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li.merit_02>.photo {
        grid-column: 1/2;
        grid-row: 1/2
    }
}

main>.inner .merit>.inner>.list ul li.merit_01>.cont,
main>.inner .merit>.inner>.list ul li.merit_03>.cont {
    grid-column: 2/3;
    grid-row: 1/2
}

@media screen and (max-width: 768px) {

    main>.inner .merit>.inner>.list ul li.merit_01>.cont,
    main>.inner .merit>.inner>.list ul li.merit_03>.cont {
        grid-column: 1/2;
        grid-row: 2/3
    }
}

main>.inner .merit>.inner>.list ul li.merit_01>.photo,
main>.inner .merit>.inner>.list ul li.merit_03>.photo {
    grid-column: 1/2;
    grid-row: 1/2
}

@media screen and (max-width: 768px) {

    main>.inner .merit>.inner>.list ul li.merit_01>.photo,
    main>.inner .merit>.inner>.list ul li.merit_03>.photo {
        grid-column: 1/2;
        grid-row: 1/2
    }
}

main>.inner .merit>.inner>.list ul li>.cont {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column
}

main>.inner .merit>.inner>.list ul li>.cont>.en {
    font-size: clamp(.6666666667rem, .3333333333rem + 1.0416666667vw, .7777777778rem)
}

main>.inner .merit>.inner>.list ul li>.cont>.ttl {
    font-size: clamp(1.1111111111rem, .9444444444rem + .5208333333vw, 1.1666666667rem);
    font-family: var(--font-family-design);
    border-bottom: 1px dotted var(--co_light_yellow)
}

main>.inner .merit>.inner>.list ul li>.cont>.txt dl {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 100px auto;
    row-gap: 10px;
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li>.cont>.txt dl {
        margin-top: 3vw
    }
}

main>.inner .merit>.inner>.list ul li>.cont>.txt dl dt {
    font-family: var(--font-family-design);
    position: relative;
    border: 1px solid var(--co_light_yellow);
    height: 36px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li>.cont>.txt dl dt {
        height: 30px
    }
}

main>.inner .merit>.inner>.list ul li>.cont>.txt dl dd {
    height: 36px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li>.cont>.txt dl dd {
        height: 30px
    }
}

main>.inner .merit>.inner>.list ul li>.cont>.txt p {
    margin-top: 15px
}

@media screen and (max-width: 768px) {
    main>.inner .merit>.inner>.list ul li>.cont>.txt p {
        margin-top: 2vw
    }
}

main>.inner .merit>.inner>.list ul li>.photo {
    border-radius: 3px;
    border: 1px solid var(--co_light_yellow);
    aspect-ratio: 1/1;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

main>.inner .merit>.inner>.list ul li.merit_01>.photo {
    background-image: url("../img/photo_merit_01.jpg")
}

main>.inner .merit>.inner>.list ul li.merit_02>.photo {
    background-image: url("../img/photo_merit_02.jpg")
}

main>.inner .merit>.inner>.list ul li.merit_03>.photo {
    background-image: url("../img/photo_merit_03.jpg")
}

main>.inner .function {
    background-color: var(--co_white-10);
    background-image: url("../img/bg_feature_01.png");
    background-size: 50% auto;
    background-position: right top;
    background-repeat: no-repeat;
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .function {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .function {
        padding-bottom: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .function {
        background-size: 60% auto
    }
}

main>.inner .function>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .function>.inner>.list {
    margin-top: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .function>.inner>.list {
        margin-top: 5.2vw
    }
}

main>.inner .function>.inner>.list li {
    -webkit-box-shadow: 0px 0px 10px var(--co_gray-10);
    box-shadow: 0px 0px 10px var(--co_gray-10);
    background-color: var(--co_white);
    padding: 40px;
    display: grid;
    grid-template-columns: 40% auto;
    grid-template-rows: auto;
    gap: 40px;
    border-radius: 6px
}

@media screen and (max-width: 768px) {
    main>.inner .function>.inner>.list li {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px
    }
}

main>.inner .function>.inner>.list li>.cont {
    grid-row: 1/2;
    grid-column: 2/3;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%
}

main>.inner .function>.inner>.list li>.cont .ttl {
    font-family: var(--font-family-design);
    font-size: clamp(1.1111111111rem, .4444444444rem + 2.0833333333vw, 1.3333333333rem);
    margin-bottom: 10px;
    color: var(--co_brown);
    color: var(--co_blue);
    border-bottom: 1px dotted var(--co_light_yellow)
}

@media screen and (max-width: 768px) {
    main>.inner .function>.inner>.list li>.cont .ttl {
        margin-bottom: 1.3vw
    }
}

main>.inner .function>.inner>.list li>.photo {
    grid-row: 1/2;
    grid-column: 1/2;
    border-radius: 3px;
    border: 1px solid var(--co_light_yellow);
    aspect-ratio: 3/2;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

main>.inner .function>.inner>.list li.function_01 .photo {
    background-image: url("../img/photo_function_01.jpg")
}

main>.inner .function>.inner>.list li.function_02 .photo {
    background-image: url("../img/photo_function_02.jpg")
}

main>.inner .function>.inner>.list li.function_03 .photo {
    background-image: url("../img/photo_function_03.jpg")
}

main>.inner .comparison {
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2030%2030%22%20style%3D%22enable-background%3Anew%200%200%2030%2030%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bopacity%3A0.4%3B%7D%20.st1%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg%20class%3D%22st0%22%3E%20%3Crect%20x%3D%2228%22%20y%3D%220%22%20class%3D%22st1%22%20width%3D%222%22%20height%3D%2230%22%2F%3E%3C%2Fg%3E%3Cg%20class%3D%22st0%22%3E%20%3Crect%20y%3D%2228%22%20class%3D%22st1%22%20width%3D%2230%22%20height%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-size: 28px 28px;
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .comparison {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .comparison {
        padding-bottom: 15.6vw
    }
}

main>.inner .comparison>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .comparison>.inner .list {
    margin-top: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .comparison>.inner .list {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .comparison>.inner .list .list_table {
        overflow-x: scroll
    }
}

@media screen and (max-width: 768px) {
    main>.inner .comparison>.inner .list .list_table table {
        min-width: 580px
    }
}

main>.inner .comparison>.inner .list .list_table table tbody {
    display: grid;
    grid-template-columns: 1fr;
    grid-row: auto auto auto auto auto auto auto auto;
    border-bottom: 1px solid var(--co_light_gray)
}

main>.inner .comparison>.inner .list .list_table table tbody tr {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto;
    line-height: 120%;
    border-right: 1px solid var(--co_light_gray)
}

main>.inner .comparison>.inner .list .list_table table tbody tr th,
main>.inner .comparison>.inner .list .list_table table tbody tr td {
    padding: 20px;
    min-height: 80px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-top: 1px solid var(--co_light_gray);
    border-left: 1px solid var(--co_light_gray);
    background-color: var(--co_white)
}

@media screen and (max-width: 768px) {

    main>.inner .comparison>.inner .list .list_table table tbody tr th,
    main>.inner .comparison>.inner .list .list_table table tbody tr td {
        min-height: 64px
    }
}

main>.inner .comparison>.inner .list .list_table table tbody tr>.none {
    background: none !important;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    overflow: hidden;
    text-indent: -9999px
}

@media screen and (max-width: 768px) {
    main>.inner .comparison>.inner .list .list_table table tbody tr>.none {
        text-indent: 0;
        border-top: 1px solid var(--co_light_gray);
        border-left: 1px solid var(--co_light_gray);
        background: var(--co_brown) !important;
        background: var(--co_blue) !important;
    }
}

main>.inner .comparison>.inner .list .list_table table tbody tr .th_sec {
    text-align: left;
    background-color: var(--co_brown);
    background-color: var(--co_blue);
    color: var(--co_white);
    position: -webkit-sticky;
    position: sticky;
    left: 0
}

main>.inner .comparison>.inner .list .list_table table tbody tr .th_sec:before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%
}

main>.inner .comparison>.inner .list .list_table table tbody tr .th_pre {
    background-color: var(--co_gray)
}

main>.inner .comparison>.inner .list .list_table table tbody tr .th_inp {
    background-color: var(--co_yellow);
    color: var(--co_white)
}

main>.inner .comparison>.inner .list .list_table table tbody tr .td_inp {
    background-color: var(--co_light_yellow-10)
}

main>.inner .comparison>.inner .list .list_table table tbody tr td {
    text-align: center
}

main>.inner .price {
    background-color: var(--co_white-10);
    background-image: url("../img/bg_price_01.png");
    background-size: 50% auto;
    background-position: left top;
    background-repeat: no-repeat;
    background-color: var(--co_gray-10);
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .price {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .price {
        padding-bottom: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .price {
        background-size: 60% auto
    }
}

main>.inner .price>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .price>.inner>.cont {
    margin-top: 40px;
    background-color: var(--co_brown);
    background-color: var(--co_blue);
    padding: 40px;
    position: relative;
    z-index: 1
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont {
        padding: 30px
    }
}

main>.inner .price>.inner>.cont::before {
    z-index: -1;
    content: "";
    position: absolute;
    left: -6px;
    top: -6px;
    display: block;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border: 1px solid var(--co_brown);
    border: 1px solid var(--co_blue);
}

main>.inner .price>.inner>.cont>.list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list {
        gap: 20px;
        grid-template-columns: 1fr
    }
}

main>.inner .price>.inner>.cont>.list li {
    -webkit-box-shadow: 0px 0px 10px var(--co_gray-10);
    box-shadow: 0px 0px 10px var(--co_gray-10);
    background-color: var(--co_white);
    padding: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list li {
        padding: 20px
    }
}

main>.inner .price>.inner>.cont>.list li>.ttl {
    border: 1px solid var(--co_brown);
    color: var(--co_brown);
    border: 1px solid var(--co_blue);
    color: var(--co_blue);
    font-size: clamp(1.1111111111rem, .7777777778rem + 1.0416666667vw, 1.2222222222rem);
    font-family: var(--font-family-design);
    padding: 20px;
    min-height: 122px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

main>.inner .price>.inner>.cont>.list li>.ttl span {
    line-height: 26px
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list li>.ttl {
        min-height: auto
    }
}

main>.inner .price>.inner>.cont>.list li>.ttl .plus {
    font-family: var(--font-family-main);
    font-weight: bold;
    color: var(--co_light_yellow)
}

main>.inner .price>.inner>.cont>.list li .photo {
    margin-top: 20px
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list li .photo {
        margin-top: 3vw
    }
}

main>.inner .price>.inner>.cont>.list li .list {
    margin-top: 20px
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list li .list {
        margin-top: 3vw
    }
}

main>.inner .price>.inner>.cont>.list li .list dl {
    margin-top: 10px;
    display: grid;
    grid-template-columns: 2fr 1fr;
    border-top: 1px solid var(--co_gray);
    border-left: 1px solid var(--co_gray);
    font-size: clamp(.8888888889rem, .2222222222rem + 2.0833333333vw, 1.1111111111rem)
}

@media screen and (max-width: 768px) {
    main>.inner .price>.inner>.cont>.list li .list dl {
        margin-top: 1.3vw
    }
}

main>.inner .price>.inner>.cont>.list li .list dl dt {
    padding: 5px 10px;
    font-family: var(--font-family-design);
    border-right: 1px solid var(--co_gray);
    border-bottom: 1px solid var(--co_gray)
}

main>.inner .price>.inner>.cont>.list li .list dl dd {
    text-align: right;
    padding: 5px 10px;
    border-right: 1px solid var(--co_gray);
    border-bottom: 1px solid var(--co_gray)
}

main>.inner .price>.inner>.cont>.list li .list span {
    font-weight: normal;
    display: block;
    text-align: right;
    font-size: clamp(.7777777778rem, .4444444444rem + 1.0416666667vw, .8888888889rem)
}

main>.inner .flow {
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .flow {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .flow {
        padding-bottom: 15.6vw
    }
}

main>.inner .flow>.inner {
    margin: auto;
    max-width: 1400px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .flow>.inner>.cont {
    margin-top: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont {
        margin-top: 5.2vw
    }
}

main>.inner .flow>.inner>.cont .list {
    -webkit-box-shadow: 0px 0px 10px var(--co_gray);
    box-shadow: 0px 0px 10px var(--co_gray);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont .list {
        grid-template-columns: 1fr;
        min-height: auto
    }
}

main>.inner .flow>.inner>.cont .list li {
    text-align: center;
    padding: 30px;
    position: relative
}

main>.inner .flow>.inner>.cont .list li::before {
    content: "";
    position: absolute;
    height: 100%;
    background-position: left center;
    background-repeat: no-repeat;
    width: 24px;
    background-size: 24px 100%;
    right: -22px;
    top: 0;
    z-index: 2
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont .list li::before {
        background-position: center bottom;
        width: 100%;
        height: 24px;
        background-size: 100% 24px;
        bottom: -22px;
        right: 0;
        top: auto
    }
}

main>.inner .flow>.inner>.cont .list li:nth-child(even) {
    background-color: var(--co_gray-10)
}

main>.inner .flow>.inner>.cont .list li:nth-child(even)::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2032.5%2065%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23ede9e7%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22.2%2064.6%2032.3%2032.5%20.2%20.4%20.2%2064.6%22%2F%3E%3C%2Fsvg%3E")
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont .list li:nth-child(even)::before {
        background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2065%2032.5%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23ede9e7%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22.4%200%2032.5%2032.1%2064.6%200%20.4%200%22%2F%3E%3C%2Fsvg%3E")
    }
}

main>.inner .flow>.inner>.cont .list li:nth-child(odd) {
    background-color: var(--co_gray)
}

main>.inner .flow>.inner>.cont .list li:nth-child(odd)::before {
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2032.5%2065%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23dcd7d4%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22.2%2064.6%2032.3%2032.5%20.2%20.4%20.2%2064.6%22%2F%3E%3C%2Fsvg%3E")
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont .list li:nth-child(odd)::before {
        background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2065%2032.5%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%23dcd7d4%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20class%3D%22st0%22%20points%3D%22.382%200%2032.5%2032.118%2064.618%200%20.382%200%22%2F%3E%3C%2Fsvg%3E")
    }
}

main>.inner .flow>.inner>.cont .list li:last-child::before {
    display: none
}

main>.inner .flow>.inner>.cont .list li .step .en {
    font-size: clamp(.6666666667rem, .3333333333rem + 1.0416666667vw, .7777777778rem)
}

main>.inner .flow>.inner>.cont .list li .step .ttl {
    font-size: clamp(1rem, .6666666667rem + 1.0416666667vw, 1.1111111111rem);
    font-family: var(--font-family-design)
}

main>.inner .flow>.inner>.cont .list li .photo {
    margin-top: 20px;
    border: 1px solid var(--co_light_yellow);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    aspect-ratio: 3/2
}

@media screen and (max-width: 768px) {
    main>.inner .flow>.inner>.cont .list li .photo {
        margin-top: 3vw
    }
}

main>.inner .flow>.inner>.cont .list li.step_01 .photo {
    background-image: url("../img/photo_flow_01.jpg")
}

main>.inner .flow>.inner>.cont .list li.step_02 .photo {
    background-image: url("../img/photo_flow_02.jpg")
}

main>.inner .flow>.inner>.cont .list li.step_03 .photo {
    background-image: url("../img/photo_flow_03.jpg")
}

main>.inner .flow>.inner>.cont .list li.step_04 .photo {
    background-image: url("../img/photo_flow_04.jpg")
}

main>.inner .faq {
    background-color: var(--co_white-10);
    padding-top: 120px;
    padding-bottom: 120px
}

@media screen and (max-width: 768px) {
    main>.inner .faq {
        padding-top: 15.6vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .faq {
        padding-bottom: 15.6vw
    }
}

main>.inner .faq>.inner {
    margin: auto;
    max-width: 1200px;
    width: 100%;
    padding: 0 1rem
}

main>.inner .faq>.inner .cont {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont {
        margin-top: 5.2vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont {
        grid-template-columns: 1fr
    }

    main>.inner .faq>.inner .cont .photo {
        grid-row: 1/2
    }
}

main>.inner .faq>.inner .cont .list {
    border-top: 1px dotted var(--co_light_yellow)
}

main>.inner .faq>.inner .cont .list dt {
    margin-top: 30px;
    font-family: var(--font-family-design);
    font-size: clamp(1rem, .6666666667rem + 1.0416666667vw, 1.1111111111rem);
    position: relative;
    padding-left: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 60px
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont .list dt {
        margin-top: 3.9vw
    }
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont .list dt {
        min-height: auto;
        margin-bottom: 20px
    }
}

@media screen and (max-width: 768px)and (max-width: 768px) {
    main>.inner .faq>.inner .cont .list dt {
        margin-bottom: 3vw
    }
}

main>.inner .faq>.inner .cont .list dt::before {
    font-size: clamp(.7777777778rem, .4444444444rem + 1.0416666667vw, .8888888889rem);
    position: absolute;
    content: "Q";
    left: 0;
    width: 30px;
    height: 30px;
    background-color: var(--co_brown);
    background-color: var(--co_blue);
    color: var(--co_white);
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont .list dt::before {
        top: 0
    }
}

main>.inner .faq>.inner .cont .list dd {
    border-bottom: 1px dotted var(--co_light_yellow);
    position: relative;
    padding-left: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 60px;
    padding-bottom: 40px
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont .list dd {
        padding-bottom: 5.2vw
    }
}

main>.inner .faq>.inner .cont .list dd::before {
    font-size: clamp(.7777777778rem, .4444444444rem + 1.0416666667vw, .8888888889rem);
    position: absolute;
    content: "A";
    top: -2px;
    left: 0;
    width: 30px;
    height: 30px;
    background-color: var(--co_yellow);
    color: var(--co_white);
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

main>.inner .faq>.inner .cont .photo {
    border-radius: 3px;
    border: 1px solid var(--co_light_yellow);
    background-image: url("../img/photo_faq_01.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top
}

@media screen and (max-width: 768px) {
    main>.inner .faq>.inner .cont .photo {
        width: 100%;
        aspect-ratio: 16/9
    }
}

footer {
    background-color: var(--co_gray-10);
    padding-top: 80px
}

@media screen and (max-width: 768px) {
    footer {
        padding-top: 6.8vw
    }
}

footer .pagetop {
    height: 50px;
    width: 50px;
    position: fixed;
    right: 30px;
    bottom: 70px;
    background: var(--co_brown);
    background: var(--co_blue);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 2
}

@media screen and (max-width: 768px) {
    footer .pagetop {
        right: 20px;
        bottom: 100px
    }
}

footer .pagetop .pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid var(--co_white);
    border-right: 3px solid var(--co_white);
    -webkit-transform: translateY(20%) rotate(-45deg);
    transform: translateY(20%) rotate(-45deg)
}

footer>.inner {
    margin: auto;
    max-width: 1400px;
    width: 100%;
    padding: 0 1rem;
    padding-bottom: 80px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px
}

@media screen and (max-width: 768px) {
    footer>.inner {
        padding-bottom: 6.8vw
    }
}

@media screen and (max-width: 768px) {
    footer>.inner {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        gap: 30px
    }
}

footer>.inner>.cont .logo {
    max-width: 450px
}

@media screen and (max-width: 768px) {
    footer>.inner>.cont .logo {
        max-width: 320px
    }
}

footer>.inner>.cont>.tel {
    margin-top: 10px;
    position: relative;
    font-family: var(--font-family-design);
    font-size: clamp(1.4444444444rem, .7777777778rem + 2.0833333333vw, 1.6666666667rem)
}

footer>.inner>.cont>.tel a {
    text-decoration: none
}

@media screen and (max-width: 768px) {
    footer>.inner>.cont>.tel {
        margin-top: 1.3vw
    }
}

footer>.inner>.cont>.tel::before {
    content: "";
    position: relative;
    display: inline-block;
    background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2019.9%2027.4%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.st0%20%7B%20fill%3A%20%2349291d%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M9.3%2C17.5s-3-5.1-3-5.1c-.6-1.4-1.1-2.7%2C0-3.4L1.9%2C1.7c-1.1.8-4.3%2C5.4%2C1.6%2C15.7%2C6.3%2C10.9%2C12.2%2C10.4%2C13.4%2C9.7l-4.2-7.1c-1%2C.6-1.8-.4-3.4-2.5ZM19.9%2C24.3h0s-3.3-5.6-3.3-5.6c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.2%2C7.2s2-1.2%2C2-1.2h0c.5-.3.6-.8.3-1.3ZM8.8%2C7.5h0c.5-.3.6-.8.3-1.3h0S5.7.5%2C5.7.5c-.3-.4-.8-.6-1.3-.3l-2%2C1.2%2C4.3%2C7.3s2-1.2%2C2-1.2Z%22%2F%3E%3C%2Fsvg%3E");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center bottom;
    width: 15px;
    margin-bottom: -2px;
    height: 30px;
    margin-right: 6px
}

footer>.inner>.cont>.schedule {
    margin-top: 10px;
    font-size: clamp(.7222222222rem, .5555555556rem + .5208333333vw, .7777777778rem)
}

@media screen and (max-width: 768px) {
    footer>.inner>.cont>.schedule {
        margin-top: 1.3vw
    }
}

footer>.inner>.cont>.schedule>.list table {
    width: 100%;
    max-width: 540px;
    border-spacing: 0
}

@media screen and (max-width: 768px) {
    footer>.inner>.cont>.schedule>.list table {
        max-width: 100%
    }
}

footer>.inner>.cont>.schedule>.list table th,
footer>.inner>.cont>.schedule>.list table .tal {
    background: var(--co_gray);
    color: var(--co_brown);
}

footer>.inner>.cont>.schedule>.list table tr {
    display: grid;
    grid-template-columns: 3fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
}

footer>.inner>.cont>.schedule>.list table th,
footer>.inner>.cont>.schedule>.list table td {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 40px
}

footer>.inner>.cont>.schedule>.list table td {
    width: 100%;
    text-align: center;
    background: var(--co_white-10);
}

footer>.inner>.cont>.schedule>.more {
    margin-top: 10px
}

@media screen and (max-width: 768px) {
    footer>.inner>.cont>.schedule>.more {
        margin-top: 1.3vw
    }
}

footer>.inner>.cont>.schedule>.more ul li {
    display: inline-block;
    margin-right: 10px
}

footer>.inner>.access {
    font-size: clamp(.7222222222rem, .5555555556rem + .5208333333vw, .7777777778rem);
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto
}

footer>.inner>.access .map iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 200px
}

footer>.inner>.access .add {
    margin-top: 15px
}

@media screen and (max-width: 768px) {
    footer>.inner>.access .add {
        margin-top: 2vw
    }
}

footer>.copy {
    background-color: var(--co_brown);
    background-color: var(--co_blue);
    color: var(--co_white);
    text-align: center;
    padding: 10px;
    font-size: clamp(.6666666667rem, .3333333333rem + 1.0416666667vw, .7777777778rem)
}