@import'https://cdn.jsdelivr.net/npm/yakuhanjp@4.1.1/dist/css/yakuhanjp.css';
@import'https://cdnjs.cloudflare.com/ajax/libs/Swiper/6.8.4/swiper-bundle.min.css';

body {
    margin: 0;
    padding: 0
}

div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
    margin: 0;
    padding: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal
}

ol,
ul {
    list-style: none
}

fieldset,
img {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption,
th {
    text-align: left
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
    font-style: normal;
    font-weight: normal
}

img {
    vertical-align: bottom
}

input,
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #000;
    border-radius: 0px
}

html {
    margin: 0;
    padding: 0;
    width: 100%;
    -webkit-text-size-adjust: 100%
}

@media screen and (min-width: 768px)and (max-width: 1479px) {
    html {
        font-size: 20px;
        font-size: 1.3888888889vw;
        -ms-scroll-chaining: none;
        overscroll-behavior: none
    }
}

@media screen and (min-width: 1480px) {
    html {
        font-size: 20px;
        -ms-scroll-chaining: none;
        overscroll-behavior: none
    }
}

@media screen and (max-width: 767px) {
    html {
        font-size: 4.9751243781vw
    }
}

body {
    width: 100%;
    min-height: 100vh;
    background-color: #fff;
    color: #222;
    font-family: "Zen Kaku Gothic New", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", YuGothic, "游ゴシック体", "Meiryo", sans-serif;
    font-size: .8rem;
    font-weight: 400;
    font-optical-sizing: auto;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body.isAndroid {
    min-height: calc(var(--vh, 1vh)*100)
}

@media screen and (min-width: 768px)and (max-width: 1479px) {
    body {
        font-size: .6rem
    }
}

@media screen and (min-width: 1480px) {
    body {
        font-size: .6rem
    }
}

@media screen and (max-width: 767px) {
    body {
        font-size: 1.2rem
    }
}

body.maccrome {
    overscroll-behavior-y: none
}

/*
#wpadminbar {
    display: none
}
*/

#wpcom-launch-banner-wrapper {
    display: none
}

#wrapper {
    position: relative;
    width: 100%
}

#wrapper strong,
#wrapper b {
    font-weight: 500
}

#wrapper .pc {
    display: block !important
}

@media screen and (max-width: 767px) {
    #wrapper .pc {
        display: none !important
    }
}

#wrapper .sp {
    display: none !important
}

@media screen and (max-width: 767px) {
    #wrapper .sp {
        display: block !important
    }
}

#wrapper .pc_ib {
    display: inline-block !important
}

@media screen and (max-width: 767px) {
    #wrapper .pc_ib {
        display: none !important
    }
}

#wrapper .sp_ib {
    display: none !important
}

@media screen and (max-width: 767px) {
    #wrapper .sp_ib {
        display: inline-block !important
    }
}

#wrapper .pc_if {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important
}

@media screen and (max-width: 767px) {
    #wrapper .pc_if {
        display: none !important
    }
}

#wrapper .sp_if {
    display: none !important
}

@media screen and (max-width: 767px) {
    #wrapper .sp_if {
        display: -webkit-inline-box !important;
        display: -ms-inline-flexbox !important;
        display: inline-flex !important
    }
}

#wrapper svg {
    width: 100%;
    height: 100%;
    vertical-align: top
}

#wrapper img {
    width: 100%;
    height: auto;
    vertical-align: top
}

#wrapper img.w10 {
    width: 10%
}

#wrapper img.w20 {
    width: 20%
}

#wrapper img.w30 {
    width: 30%
}

#wrapper img.w40 {
    width: 40%
}

#wrapper img.w50 {
    width: 50%
}

#wrapper img.w60 {
    width: 60%
}

#wrapper img.w70 {
    width: 70%
}

#wrapper img.w80 {
    width: 80%
}

#wrapper img.w90 {
    width: 90%
}

#wrapper * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt"
}

#wrapper .vrl {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl
}

#wrapper .ita {
    font-style: italic
}

#wrapper .alp {
    font-family: "Roboto", serif
}

#wrapper span.palt {
    display: inline-block;
    text-indent: -0.5em
}

#wrapper .yakuhan {
    font-family: YakuHanJP, "Zen Kaku Gothic New", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", YuGothic, "游ゴシック体", "Meiryo", sans-serif
}

#wrapper span.yaku {
    font-weight: 300
}

a {
    color: #222;
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

a:hover {
    color: #222;
    text-decoration: none
}

#container {
    position: relative;
    width: 100%;
    overflow: hidden;
    opacity: 0
}

.end #container {
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear;
    opacity: 1 !important
}

#container .ang.fadeIn {
    opacity: 0;
    -webkit-transition: opacity .6s cubic-bezier(0.32, 0, 0.67, 0);
    transition: opacity .6s cubic-bezier(0.32, 0, 0.67, 0)
}

#container .ang.fadeIn.active {
    opacity: 1
}

.menued #container {
    position: fixed
}

#container main.contents .bg_wrapper {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 0%;
    height: 144.5138888889vw;
    overflow: hidden;
    -webkit-transition: 1.2s ease .6s;
    transition: 1.2s ease .6s
}

@media screen and (max-width: 767px) {
    #container main.contents .bg_wrapper {
        top: 4.75rem;
        height: 143.7810945274vw
    }
}

.end #container main.contents .bg_wrapper {
    width: 100%
}

#container main.contents .bg_wrapper .bg_line {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    height: 44.5138888889vw;
    background: url(../images/common/contents_kv_bg.png) no-repeat;
    background-size: cover;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation: bgLineAni 75s linear infinite;
    animation: bgLineAni 75s linear infinite;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter .8s linear .6s;
    transition: -webkit-filter .8s linear .6s;
    transition: filter .8s linear .6s;
    transition: filter .8s linear .6s, -webkit-filter .8s linear .6s
}

@media screen and (max-width: 767px) {
    #container main.contents .bg_wrapper .bg_line {
        height: 43.7810945274vw;
        background: url(../images/common/contents_kv_bg_sp.png) no-repeat;
        background-size: cover
    }
}

.end #container main.contents .bg_wrapper .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

#container main.contents#company .bg_wrapper,
#container main.contents#contact .bg_wrapper {
    top: 44rem;
    height: 128.6805555556vw
}

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

    #container main.contents#company .bg_wrapper,
    #container main.contents#contact .bg_wrapper {
        top: 44rem;
        height: 139.552238806vw
    }
}

.end #container main.contents#company .bg_wrapper,
.end #container main.contents#contact .bg_wrapper {
    width: 0%
}

#container main.contents#company .bg_wrapper .bg_line,
#container main.contents#contact .bg_wrapper .bg_line {
    height: 28.6805555556vw;
    background: url(../images/company/company_kv_bg.png) no-repeat;
    background-size: cover
}

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

    #container main.contents#company .bg_wrapper .bg_line,
    #container main.contents#contact .bg_wrapper .bg_line {
        height: 39.552238806vw;
        background: url(../images/company/company_kv_bg_sp.png) no-repeat;
        background-size: cover
    }
}

#container main.contents#company .bg_wrapper {
    top: 28rem
}

@media screen and (max-width: 767px) {
    #container main.contents#company .bg_wrapper {
        top: 36.5rem
    }
}

#container main.contents#company .bg_wrapper.active {
    width: 100%
}

#container main.contents #visual_area {
    margin: 0 auto;
    padding: 8rem 0 6rem;
    width: 100%
}

@media screen and (max-width: 767px) {
    #container main.contents #visual_area {
        padding: 5rem 0 7rem
    }
}

#container main.contents #visual_area h2.contents_header_title {
    margin: 0 auto;
    width: 66rem;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

@media screen and (max-width: 767px) {
    #container main.contents #visual_area h2.contents_header_title {
        width: 18.1rem
    }
}

.end #container main.contents #visual_area h2.contents_header_title {
    opacity: 1
}

#container main.contents #visual_area h2.contents_header_title .jpn {
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #container main.contents #visual_area h2.contents_header_title .jpn {
        font-size: 0.6rem;
        letter-spacing: .12em
    }
}

#container main.contents #visual_area h2.contents_header_title .eng {
    font-size: 4rem;
    font-weight: 200;
    line-height: 1;
    letter-spacing: .1em
}

@media screen and (max-width: 767px) {
    #container main.contents #visual_area h2.contents_header_title .eng {
        font-size: 2rem
    }
}

#container main.contents .sub_contents {
    position: relative;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end #container main.contents .sub_contents {
    opacity: 1
}

#container main.contents .sub_contents h3.sub_contents_title {
    margin: 0 auto;
    width: 66rem
}

@media screen and (max-width: 767px) {
    #container main.contents .sub_contents h3.sub_contents_title {
        width: 18.1rem
    }
}

#container main.contents .sub_contents h3.sub_contents_title .jpn {
    font-size: 0.8rem;
    line-height: 1.8;
    letter-spacing: .2em
}

@media screen and (max-width: 767px) {
    #container main.contents .sub_contents h3.sub_contents_title .jpn {
        font-size: 0.6rem;
        line-height: 1.9;
        letter-spacing: .12em
    }
}

#container main.contents .sub_contents h3.sub_contents_title .eng {
    font-size: 2.4rem;
    font-weight: 200;
    line-height: 1;
    letter-spacing: .1em
}

@media screen and (max-width: 767px) {
    #container main.contents .sub_contents h3.sub_contents_title .eng {
        font-size: 1.6rem
    }
}

#container .btn_area {
    margin: 0 auto 0;
    width: 19rem;
    height: 3.4rem
}

#container .btn_area.small {
    height: 2.4rem
}

#container .btn_area.small a {
    border-radius: 1.2rem
}

#container .btn_area.small a::before {
    border-radius: 1.2rem
}

#container .btn_area.small span.text {
    font-size: 0.7rem
}

#container .btn_area.small span.circle {
    margin: -1rem 0 0;
    width: 2rem;
    height: 2rem
}

#container .btn_area.small span.circle .progress {
    --size: 40px
}

#container .btn_area.small span.circle .progress circle {
    r: 19px
}

#container .btn_area.small span.ico {
    width: 0.35rem;
    height: 0.55rem
}

#container .btn_area.white a {
    color: #222;
    background: #fff
}

#container .btn_area.white span.circle .progress circle.bg {
    stroke: #bebebe
}

#container .btn_area.white span.circle .progress circle.fg {
    stroke: #bebebe
}

#container .btn_area.white span.circle .ico svg path {
    stroke: #bebebe
}

#container .btn_area.banner_area a::before {
    display: none
}

#container .btn_area.banner_area a.over {
    opacity: .6
}

#container .btn_area.banner_area a.over span.circle .progress circle.bg {
    opacity: 0
}

#container .btn_area.banner_area a span.text {
    margin: 0
}

#container .btn_area.form_btn {
    position: relative;
    width: 9.9rem;
    border-radius: 1.7rem;
    background: -webkit-gradient(linear, left top, right top, from(#5D5D5D), to(#404040));
    background: linear-gradient(90deg, #5D5D5D 0%, #404040 100%);
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media screen and (max-width: 767px) {
    #container .btn_area.form_btn {
        -webkit-transform-origin: top center;
        transform-origin: top center;
        -webkit-transform: scale(0.85);
        transform: scale(0.85)
    }
}

#container .btn_area.form_btn.input_back span.circle {
    position: absolute;
    top: 50%;
    right: auto;
    left: 0.2rem
}

#container .btn_area.form_btn.input_back span.ico {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

#container .btn_area.form_btn.disabled {
    opacity: .5;
    pointer-events: none
}

#container .btn_area.form_btn::before {
    pointer-events: none;
    opacity: 0;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(#B4855C), color-stop(50%, #DBB18C), to(#B4855C));
    background: linear-gradient(90deg, #B4855C 0%, #DBB18C 50%, #B4855C 100%);
    border-radius: 1.7rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    #container .btn_area.form_btn:hover::before {
        opacity: 1
    }

    #container .btn_area.form_btn:hover span.circle .progress {
        -webkit-animation: progress-animation .6s linear 0s 1 forwards;
        animation: progress-animation .6s linear 0s 1 forwards
    }

    #container .btn_area.form_btn:hover span.circle .progress circle.bg {
        stroke: #e4e4e4;
        stroke: rgba(0, 0, 0, 0)
    }

    #container .btn_area.form_btn:hover span.circle .progress circle.fg {
        stroke: #e4e4e4
    }

    #container .btn_area.form_btn:hover span.circle .ico svg path {
        stroke: #e4e4e4
    }
}

#container .btn_area.form_btn input {
    position: relative;
    border: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    background: rgba(0, 0, 0, 0);
    padding: 0 0 0 2.5rem;
    font-size: 0.8rem;
    -moz-text-align-last: left;
    text-align-last: left
}

@media print,
screen and (min-width: 768px) {
    #container .btn_area.form_btn input {
        cursor: pointer
    }
}

#container .btn_area.form_btn input#back_button {
    padding: 0 0 0 5rem
}

#container .btn_area.form_btn_back span.text {
    margin: 0 0 0 1.1rem
}

#container .btn_area.form_btn_back span.circle {
    position: absolute;
    top: 50%;
    right: auto;
    left: 0.2rem
}

#container .btn_area.form_btn_back span.ico {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

#container .btn_area a {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    border-radius: 1.7rem;
    background: -webkit-gradient(linear, left top, right top, from(#5D5D5D), to(#404040));
    background: linear-gradient(90deg, #5D5D5D 0%, #404040 100%);
    color: #fff;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

#container .btn_area a::before {
    pointer-events: none;
    opacity: 0;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(#B4855C), color-stop(50%, #DBB18C), to(#B4855C));
    background: linear-gradient(90deg, #B4855C 0%, #DBB18C 50%, #B4855C 100%);
    border-radius: 1.7rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

#container .btn_area a.over {
    color: #fff;
    opacity: 1
}

#container .btn_area a.over::before {
    opacity: 1
}

#container .btn_area a.over span.circle .progress {
    -webkit-animation: progress-animation .6s linear 0s 1 forwards;
    animation: progress-animation .6s linear 0s 1 forwards
}

#container .btn_area a.over span.circle .progress circle.bg {
    stroke: #e4e4e4;
    stroke: rgba(0, 0, 0, 0)
}

#container .btn_area a.over span.circle .progress circle.fg {
    stroke: #e4e4e4
}

#container .btn_area a.over span.circle .ico svg path {
    stroke: #e4e4e4
}

#container .btn_area span.text {
    position: relative;
    margin: 0 1.1rem 0 0;
    font-size: 0.8rem;
    letter-spacing: .08em
}

#container .btn_area span.circle {
    position: absolute;
    top: 50%;
    right: 0.2rem;
    z-index: 2;
    margin: -1.5rem 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%
}

#container .btn_area span.circle .progress {
    --size: 60px;
    --half-size: calc(var(--size) / 2);
    --stroke-width: 1px;
    --radius: calc((var(--size) - var(--stroke-width)) / 2);
    --circumference: calc(var(--radius) * pi * 2);
    --dash: calc((var(--progress) * var(--circumference)) / 100)
}

#container .btn_area span.circle .progress circle {
    opacity: .2;
    cx: var(--half-size);
    cy: var(--half-size);
    r: var(--radius);
    r: 29px;
    stroke-width: var(--stroke-width);
    fill: none;
    stroke-linecap: round
}

#container .btn_area span.circle .progress circle.bg {
    stroke: #e4e4e4
}

#container .btn_area span.circle .progress circle.fg {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: var(--half-size) var(--half-size);
    transform-origin: var(--half-size) var(--half-size);
    stroke-dasharray: var(--dash) calc(var(--circumference) - var(--dash));
    stroke: #e4e4e4
}

#container .btn_area span.ico {
    position: absolute;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    margin: 0 0 0 0.1rem;
    width: 0.4rem;
    height: 0.65rem
}

@keyframes bgLineAniPlus {
    0% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }

    10% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    20% {
        -webkit-transform: scaleY(1.04) translateY(0.5rem);
        transform: scaleY(1.04) translateY(0.5rem)
    }

    30% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    40% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    50% {
        -webkit-transform: scaleY(1.08) translateY(0.5rem);
        transform: scaleY(1.08) translateY(0.5rem)
    }

    60% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    70% {
        -webkit-transform: scaleY(0.92) translateY(0);
        transform: scaleY(0.92) translateY(0)
    }

    80% {
        -webkit-transform: scaleY(0.96) translateY(0.5rem);
        transform: scaleY(0.96) translateY(0.5rem)
    }

    90% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    100% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }
}

@-webkit-keyframes bgLineAniPlus {
    0% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }

    10% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    20% {
        -webkit-transform: scaleY(1.04) translateY(0.5rem);
        transform: scaleY(1.04) translateY(0.5rem)
    }

    30% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    40% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    50% {
        -webkit-transform: scaleY(1.08) translateY(0.5rem);
        transform: scaleY(1.08) translateY(0.5rem)
    }

    60% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    70% {
        -webkit-transform: scaleY(0.92) translateY(0);
        transform: scaleY(0.92) translateY(0)
    }

    80% {
        -webkit-transform: scaleY(0.96) translateY(0.5rem);
        transform: scaleY(0.96) translateY(0.5rem)
    }

    90% {
        -webkit-transform: scaleY(1) translateY(0.5rem);
        transform: scaleY(1) translateY(0.5rem)
    }

    100% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }
}

@keyframes bgLineAni {
    0% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }

    10% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    20% {
        -webkit-transform: scaleY(1.04) translateY(-0.5rem);
        transform: scaleY(1.04) translateY(-0.5rem)
    }

    30% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    40% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    50% {
        -webkit-transform: scaleY(1.08) translateY(-0.5rem);
        transform: scaleY(1.08) translateY(-0.5rem)
    }

    60% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    70% {
        -webkit-transform: scaleY(0.92) translateY(0);
        transform: scaleY(0.92) translateY(0)
    }

    80% {
        -webkit-transform: scaleY(0.96) translateY(-0.5rem);
        transform: scaleY(0.96) translateY(-0.5rem)
    }

    90% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    100% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }
}

@-webkit-keyframes bgLineAni {
    0% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }

    10% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    20% {
        -webkit-transform: scaleY(1.04) translateY(-0.5rem);
        transform: scaleY(1.04) translateY(-0.5rem)
    }

    30% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    40% {
        -webkit-transform: scaleY(0.96) translateY(0);
        transform: scaleY(0.96) translateY(0)
    }

    50% {
        -webkit-transform: scaleY(1.08) translateY(-0.5rem);
        transform: scaleY(1.08) translateY(-0.5rem)
    }

    60% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    70% {
        -webkit-transform: scaleY(0.92) translateY(0);
        transform: scaleY(0.92) translateY(0)
    }

    80% {
        -webkit-transform: scaleY(0.96) translateY(-0.5rem);
        transform: scaleY(0.96) translateY(-0.5rem)
    }

    90% {
        -webkit-transform: scaleY(1) translateY(-0.5rem);
        transform: scaleY(1) translateY(-0.5rem)
    }

    100% {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0)
    }
}

@property --progress {
    syntax: "<number>";
    inherits: false;
    initial-value: 0
}

@keyframes progress-animation {
    from {
        --progress: 0
    }

    to {
        --progress: 100
    }
}

@-webkit-keyframes progress-animation {
    from {
        --progress: 0
    }

    to {
        --progress: 100
    }
}

#menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 3.75rem;
    height: 3.75rem;
    z-index: 32
}

@media print,
screen and (min-width: 768px) {
    #menu {
        display: none
    }
}

#menu span {
    position: absolute;
    top: 50%;
    left: 1.075rem;
    width: 1.6rem;
    height: 1px;
    background-color: #222;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

#menu span.top {
    -webkit-transform: translateY(-0.35rem) rotate(0deg);
    transform: translateY(-0.35rem) rotate(0deg)
}

#menu span.bottom {
    -webkit-transform: translateY(0.35rem) rotate(0deg);
    transform: translateY(0.35rem) rotate(0deg)
}

.menued #menu {
    background-color: #fff
}

.menued #menu span.top {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg)
}

.menued #menu span.middle {
    opacity: 0
}

.menued #menu span.bottom {
    -webkit-transform: translateY(0) rotate(-45deg);
    transform: translateY(0) rotate(-45deg)
}

@media print,
screen and (min-width: 768px) {

    #menu_area,
    nav.menu_area,
    nav.sub_menu_area {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-column-gap: 1.6rem;
        -moz-column-gap: 1.6rem;
        column-gap: 1.6rem;
        position: absolute;
        right: 1rem;
        top: 1rem;
        height: 1.75rem
    }
}

#menu_area ul.menu_list,
nav.menu_area ul.menu_list,
nav.sub_menu_area ul.menu_list {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-column-gap: 1.6rem;
    -moz-column-gap: 1.6rem;
    column-gap: 1.6rem
}

#menu_area ul.menu_list li,
nav.menu_area ul.menu_list li,
nav.sub_menu_area ul.menu_list li {
    position: relative
}

#menu_area ul.menu_list li .sub_menu_title,
nav.menu_area ul.menu_list li .sub_menu_title,
nav.sub_menu_area ul.menu_list li .sub_menu_title {
    position: relative;
    height: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

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

    #menu_area ul.menu_list li .sub_menu_title,
    nav.menu_area ul.menu_list li .sub_menu_title,
    nav.sub_menu_area ul.menu_list li .sub_menu_title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

#menu_area ul.menu_list li .sub_menu_title a,
nav.menu_area ul.menu_list li .sub_menu_title a,
nav.sub_menu_area ul.menu_list li .sub_menu_title a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

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

    #menu_area ul.menu_list li .sub_menu_title a,
    nav.menu_area ul.menu_list li .sub_menu_title a,
    nav.sub_menu_area ul.menu_list li .sub_menu_title a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

#menu_area ul.menu_list li .sub_menu_title .ico,
nav.menu_area ul.menu_list li .sub_menu_title .ico,
nav.sub_menu_area ul.menu_list li .sub_menu_title .ico {
    display: block;
    width: 0.55rem;
    height: 0.5rem;
    margin: 0 0 0 0.4rem
}

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

    #menu_area ul.menu_list li .sub_menu_title .ico,
    nav.menu_area ul.menu_list li .sub_menu_title .ico,
    nav.sub_menu_area ul.menu_list li .sub_menu_title .ico {
        margin: 0 0 0 0.3rem
    }
}

#menu_area ul.menu_list li .sub_menu_title .ico svg,
nav.menu_area ul.menu_list li .sub_menu_title .ico svg,
nav.sub_menu_area ul.menu_list li .sub_menu_title .ico svg {
    width: 0.45rem !important;
    height: 0.45rem !important
}

#menu_area ul.menu_list li .sub_menu_title .arr,
nav.menu_area ul.menu_list li .sub_menu_title .arr,
nav.sub_menu_area ul.menu_list li .sub_menu_title .arr {
    display: block;
    width: 0.4rem;
    height: 0.25rem;
    margin: 0 0 0 0.3rem
}

#menu_area ul.menu_list li .sub_menu_title .bar,
nav.menu_area ul.menu_list li .sub_menu_title .bar,
nav.sub_menu_area ul.menu_list li .sub_menu_title .bar {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 1px;
    background-color: #b4855c;
    -webkit-transition: width .3s linear;
    transition: width .3s linear;
    opacity: 0
}

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

    #menu_area ul.menu_list li .sub_menu_title .bar,
    nav.menu_area ul.menu_list li .sub_menu_title .bar,
    nav.sub_menu_area ul.menu_list li .sub_menu_title .bar {
        display: none
    }
}

@media print,
screen and (min-width: 768px) {

    #menu_area ul.menu_list li .sub_menu_title.over .bar,
    #menu_area ul.menu_list li .sub_menu_title.curr .bar,
    nav.menu_area ul.menu_list li .sub_menu_title.over .bar,
    nav.menu_area ul.menu_list li .sub_menu_title.curr .bar,
    nav.sub_menu_area ul.menu_list li .sub_menu_title.over .bar,
    nav.sub_menu_area ul.menu_list li .sub_menu_title.curr .bar {
        width: 100%;
        opacity: 1
    }
}

#menu_area ul.menu_list li .sub_menu_title span.text,
nav.menu_area ul.menu_list li .sub_menu_title span.text,
nav.sub_menu_area ul.menu_list li .sub_menu_title span.text {
    font-size: 0.6rem;
    font-weight: 500;
    letter-spacing: .16em;
    line-height: 1.9
}

#menu_area ul.menu_list li .sub_menu_title span.text.alp,
nav.menu_area ul.menu_list li .sub_menu_title span.text.alp,
nav.sub_menu_area ul.menu_list li .sub_menu_title span.text.alp {
    font-weight: 500;
    line-height: 1.4
}

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

    #menu_area ul.menu_list li .sub_menu_title span.text.alp,
    nav.menu_area ul.menu_list li .sub_menu_title span.text.alp,
    nav.sub_menu_area ul.menu_list li .sub_menu_title span.text.alp {
        line-height: 1.9
    }
}

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

    #menu_area ul.menu_list li .sub_menu_title span.text,
    nav.menu_area ul.menu_list li .sub_menu_title span.text,
    nav.sub_menu_area ul.menu_list li .sub_menu_title span.text {
        font-size: 1rem;
        height: 1.9rem
    }
}

@media print,
screen and (min-width: 768px) {

    #menu_area ul.menu_list li.submenu,
    nav.menu_area ul.menu_list li.submenu,
    nav.sub_menu_area ul.menu_list li.submenu {
        cursor: pointer
    }

    #menu_area ul.menu_list li.submenu .submenu_area,
    nav.menu_area ul.menu_list li.submenu .submenu_area,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        row-gap: 0.3rem;
        position: absolute;
        top: 1.15rem;
        left: 0;
        padding: 0.5rem 0 0;
        width: 4rem;
        font-size: 0.6rem;
        font-weight: 500;
        letter-spacing: .16em;
        line-height: 1.9;
        -webkit-transition: opacity .3s linear;
        transition: opacity .3s linear;
        opacity: 0;
        pointer-events: none
    }

    #menu_area ul.menu_list li.submenu .submenu_area a,
    nav.menu_area ul.menu_list li.submenu .submenu_area a,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area a {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }

    #menu_area ul.menu_list li.submenu .submenu_area a.over,
    nav.menu_area ul.menu_list li.submenu .submenu_area a.over,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area a.over {
        opacity: .7
    }

    #menu_area ul.menu_list li.submenu .submenu_area .other_link,
    nav.menu_area ul.menu_list li.submenu .submenu_area .other_link,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .other_link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    #menu_area ul.menu_list li.submenu .submenu_area .other_link .ico,
    nav.menu_area ul.menu_list li.submenu .submenu_area .other_link .ico,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .other_link .ico {
        display: block;
        width: 0.55rem;
        height: 0.5rem;
        margin: 0 0 0 0.3rem
    }

    #menu_area ul.menu_list li.submenu .submenu_area .other_link .ico svg,
    nav.menu_area ul.menu_list li.submenu .submenu_area .other_link .ico svg,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .other_link .ico svg {
        width: 0.5rem !important;
        height: 0.5rem !important
    }

    #menu_area ul.menu_list li.submenu.over .bar,
    nav.menu_area ul.menu_list li.submenu.over .bar,
    nav.sub_menu_area ul.menu_list li.submenu.over .bar {
        width: 100%;
        opacity: 1
    }

    #menu_area ul.menu_list li.submenu.over .submenu_area,
    nav.menu_area ul.menu_list li.submenu.over .submenu_area,
    nav.sub_menu_area ul.menu_list li.submenu.over .submenu_area {
        opacity: 1;
        pointer-events: auto
    }

    #menu_area ul.menu_list li.submenu.curr .bar,
    nav.menu_area ul.menu_list li.submenu.curr .bar,
    nav.sub_menu_area ul.menu_list li.submenu.curr .bar {
        width: 100%;
        opacity: 1
    }
}

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

    #menu_area ul.menu_list li.submenu .sub_menu_title .arr,
    nav.menu_area ul.menu_list li.submenu .sub_menu_title .arr,
    nav.sub_menu_area ul.menu_list li.submenu .sub_menu_title .arr {
        display: none
    }

    #menu_area ul.menu_list li.submenu .submenu_area .submenu,
    nav.menu_area ul.menu_list li.submenu .submenu_area .submenu,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .submenu {
        margin: 0.7rem 0 0
    }

    #menu_area ul.menu_list li.submenu .submenu_area .submenu a,
    nav.menu_area ul.menu_list li.submenu .submenu_area .submenu a,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .submenu a {
        display: block;
        font-size: 0.7rem;
        letter-spacing: .16em
    }

    #menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link,
    nav.menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    #menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico,
    nav.menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico {
        display: block;
        width: 0.55rem;
        height: 0.5rem;
        margin: 0 0 0 0.3rem
    }

    #menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico svg,
    nav.menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico svg,
    nav.sub_menu_area ul.menu_list li.submenu .submenu_area .submenu .other_link .ico svg {
        width: 0.5rem !important;
        height: 0.5rem !important
    }
}

@media screen and (max-width: 767px) {
    #menu_area {
        pointer-events: none;
        opacity: 0;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 30;
        padding: 0 0 3.85rem;
        width: 100%;
        height: 100vh;
        -webkit-transition: opacity .3s linear;
        transition: opacity .3s linear;
        overflow-y: auto;
        background-color: #fff
    }

    .menued #menu_area {
        pointer-events: auto;
        opacity: 1
    }

    .menued #menu_area .bg_wrapper {
        -webkit-transition: .8s ease .6s;
        transition: .8s ease .6s;
        height: 14.3rem
    }

    #menu_area .bg_wrapper {
        position: absolute;
        top: 0;
        right: 0;
        width: 11.05rem;
        height: 14.3rem;
        height: 0;
        overflow: hidden
    }

    #menu_area .bg_wrapper .bg_line {
        position: absolute;
        top: 0;
        right: 0;
        width: 11.05rem;
        height: 14.3rem;
        background: url(../images/common/menu_bg.png) no-repeat;
        background-size: cover
    }

    #menu_area ul.menu_list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        position: relative;
        width: 14.55rem;
        left: calc(50% - 14.55rem/2 - 1.175rem);
        top: auto;
        margin: 5.25rem 0 0
    }

    #menu_area ul.menu_list li {
        padding: 1.2rem 0;
        width: 100%;
        border-bottom: 1px solid #bebebe
    }
}

@media screen and (max-width: 767px) {
    #menu_area .btn_contact_area {
        position: relative;
        width: 14.55rem;
        left: calc(50% - 14.55rem/2 - 1.175rem);
        margin: 1.2rem 0 0
    }
}

#menu_area .btn_contact_area a {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-column-gap: 0.4rem;
    -moz-column-gap: 0.4rem;
    column-gap: 0.4rem;
    padding: 0 0.8rem;
    height: 1.75rem;
    overflow: hidden;
    background: #f1efea;
    border-radius: 0.85rem
}

@media screen and (max-width: 767px) {
    #menu_area .btn_contact_area a {
        -webkit-column-gap: 0.6rem;
        -moz-column-gap: 0.6rem;
        column-gap: 0.6rem;
        padding: 0 1.8rem;
        width: 12.9rem;
        height: 3rem;
        border-radius: 1.5rem
    }
}

#menu_area .btn_contact_area a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(#B4855C), color-stop(50%, #DBB18C), to(#B4855C));
    background: linear-gradient(90deg, #B4855C 0%, #DBB18C 50%, #B4855C 100%);
    opacity: 0;
    -webkit-transition: opacity .3s linear;
    transition: opacity .3s linear
}

#menu_area .btn_contact_area a.over:before {
    opacity: 1
}

#menu_area .btn_contact_area a.over .title {
    color: #fff
}

#menu_area .btn_contact_area a.over .line {
    background-color: #fff
}

#menu_area .btn_contact_area a.over .text {
    color: #fff
}

#menu_area .btn_contact_area .title {
    position: relative;
    font-size: 0.6rem;
    font-weight: 500;
    color: #b4855c;
    -webkit-transition: color .3s linear;
    transition: color .3s linear
}

@media screen and (max-width: 767px) {
    #menu_area .btn_contact_area .title {
        font-size: 0.9rem
    }
}

#menu_area .btn_contact_area .line {
    position: relative;
    display: block;
    width: 1px;
    height: 0.55rem;
    background-color: #bebebe;
    -webkit-transition: background-color .3s linear;
    transition: background-color .3s linear
}

@media screen and (max-width: 767px) {
    #menu_area .btn_contact_area .line {
        height: 0.825rem
    }
}

#menu_area .btn_contact_area .text {
    position: relative;
    font-size: 0.6rem;
    font-weight: 500;
    color: #222;
    -webkit-transition: color .3s linear;
    transition: color .3s linear
}

@media screen and (max-width: 767px) {
    #menu_area .btn_contact_area .text {
        font-size: 0.9rem
    }
}

header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 3.75rem;
    background-color: rgba(0, 0, 0, 0)
}

@media screen and (max-width: 767px) {
    header {
        height: 3.75rem
    }
}

.scrolled header {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.8)), color-stop(30%, rgba(255, 255, 255, 0.5)), to(transparent));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.5) 30%, transparent 100%)
}

body.top header {
    opacity: 0;
    -webkit-transition: .6s linear 2s;
    transition: .6s linear 2s
}

body.top #wrapper.end header {
    opacity: 1
}

header h1 {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 99;
    margin: 0;
    width: 6.7rem;
    height: 1.75rem
}

header h1 a {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: opacity .3s linear;
    transition: opacity .3s linear
}

header h1 a.over {
    opacity: .7
}

main {
    position: relative;
    width: 100%;
    padding: 0 0 6rem;
    margin: 0 auto 0
}

@media screen and (max-width: 767px) {
    main {
        padding: 0 0 3rem
    }
}

footer {
    position: relative;
    margin: 0 auto 0;
    width: 100%;
    height: 10rem;
    background-color: #323131;
    border-radius: .2rem .2rem 0 0
}

@media screen and (max-width: 767px) {
    footer {
        height: 13rem
    }
}

footer .logo {
    position: absolute;
    top: 2rem;
    left: 3rem;
    width: 9.9rem;
    height: 2.6rem
}

@media screen and (max-width: 767px) {
    footer .logo {
        top: 1rem;
        left: 1rem;
        width: 6.1rem;
        height: 1.6rem
    }
}

footer .logo a {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    footer .logo a.over {
        opacity: .7
    }
}

footer .logo a img {
    filter: brightness(0) invert(1);
}

footer nav.menu_area {
    position: absolute;
    right: 2rem;
    top: 2rem
}

@media screen and (max-width: 767px) {
    footer nav.menu_area {
        position: relative;
        right: auto;
        left: 10.15rem;
        top: auto;
        padding: 1rem 0 0;
        width: 9.9rem
    }
}

@media screen and (max-width: 767px) {
    footer nav.menu_area ul.menu_list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        row-gap: 0.4rem
    }
}

footer nav.menu_area ul.menu_list li.line {
    width: 1px;
    height: 0.65rem;
    background-color: #fff
}

@media screen and (max-width: 767px) {
    footer nav.menu_area ul.menu_list li.line {
        width: 1rem;
        height: 1px;
        background-color: rgba(255, 255, 255, .3)
    }
}

footer nav.menu_area ul.menu_list .sub_menu_title span.text.alp {
    font-weight: 300
}

@media screen and (max-width: 767px) {
    footer nav.menu_area ul.menu_list .sub_menu_title span.text {
        font-size: 0.6rem;
        height: auto
    }
}

footer nav.menu_area ul.menu_list a {
    letter-spacing: .28em;
    color: #fff;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    footer nav.menu_area ul.menu_list a.over {
        opacity: .7
    }
}

footer nav.sub_menu_area {
    position: absolute;
    right: 2rem;
    top: 4.15rem
}

@media screen and (max-width: 767px) {
    footer nav.sub_menu_area {
        position: relative;
        right: auto;
        left: 10.15rem;
        top: auto;
        margin: 1rem 0 0;
        width: 9.9rem
    }
}

@media screen and (max-width: 767px) {
    footer nav.sub_menu_area ul.menu_list {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        row-gap: 0.4rem;
        font-size: 0.4rem
    }
}

footer nav.sub_menu_area ul.menu_list a {
    font-size: 0.4rem;
    line-height: 1.9;
    letter-spacing: .28em;
    color: #fff
}

@media print,
screen and (min-width: 768px) {
    footer nav.sub_menu_area ul.menu_list a {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }

    footer nav.sub_menu_area ul.menu_list a.over {
        opacity: .7
    }
}

footer .copyright {
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    font-size: 0.6rem;
    line-height: 1;
    letter-spacing: .28em;
    color: #fff
}

@media screen and (max-width: 767px) {
    footer .copyright {
        left: 0;
        right: 0;
        bottom: 1rem;
        margin: 0 auto;
        text-align: center
    }
}

[data-simplebar] {
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.simplebar-wrapper {
    overflow: hidden;
    width: inherit;
    height: inherit;
    max-width: inherit;
    max-height: inherit
}

.simplebar-mask {
    direction: inherit;
    position: absolute;
    overflow: hidden;
    padding: 0;
    margin: 0;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: auto !important;
    height: auto !important;
    z-index: 0
}

.simplebar-offset {
    direction: inherit !important;
    -webkit-box-sizing: inherit !important;
    box-sizing: inherit !important;
    resize: none !important;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch
}

.simplebar-content-wrapper {
    direction: inherit;
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
    position: relative;
    display: block;
    height: 100%;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.simplebar-content-wrapper::-webkit-scrollbar,
.simplebar-hide-scrollbar::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0
}

.simplebar-content:before,
.simplebar-content:after {
    content: " ";
    display: table
}

.simplebar-placeholder {
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    pointer-events: none
}

.simplebar-height-auto-observer-wrapper {
    -webkit-box-sizing: inherit !important;
    box-sizing: inherit !important;
    height: 100%;
    width: 100%;
    max-width: 1px;
    position: relative;
    float: left;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    -webkit-box-flex: inherit;
    -ms-flex-positive: inherit;
    flex-grow: inherit;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0
}

.simplebar-height-auto-observer {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
    display: block;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 1000%;
    width: 1000%;
    min-height: 1px;
    min-width: 1px;
    overflow: hidden;
    pointer-events: none;
    z-index: -1
}

.simplebar-track {
    z-index: 1;
    position: absolute;
    right: 0;
    bottom: 0;
    pointer-events: none;
    overflow: hidden
}

[data-simplebar].simplebar-dragging {
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

[data-simplebar].simplebar-dragging .simplebar-content {
    pointer-events: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

[data-simplebar].simplebar-dragging .simplebar-track {
    pointer-events: all
}

.simplebar-scrollbar {
    position: absolute;
    left: 0;
    right: 0;
    min-height: 10px
}

.simplebar-scrollbar:before {
    position: absolute;
    content: "";
    background: #000;
    border-radius: 7px;
    left: 2px;
    right: 2px;
    opacity: 0;
    -webkit-transition: opacity .2s .5s linear;
    transition: opacity .2s .5s linear
}

.simplebar-scrollbar.simplebar-visible:before {
    opacity: .5;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: 0s;
    transition-duration: 0s
}

.simplebar-track.simplebar-vertical {
    top: 0;
    width: 11px
}

.simplebar-scrollbar:before {
    top: 2px;
    bottom: 2px;
    left: 2px;
    right: 2px
}

.simplebar-track.simplebar-horizontal {
    left: 0;
    height: 11px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
    right: auto;
    left: 0;
    top: 0;
    bottom: 0;
    min-height: 0;
    min-width: 10px;
    width: auto
}

[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
    right: auto;
    left: 0
}

.simplebar-dummy-scrollbar-size {
    direction: rtl;
    position: fixed;
    opacity: 0;
    visibility: hidden;
    height: 500px;
    width: 500px;
    overflow-y: hidden;
    overflow-x: scroll;
    -ms-overflow-style: scrollbar !important
}

.simplebar-dummy-scrollbar-size>div {
    width: 200%;
    height: 200%;
    margin: 10px 0
}

.simplebar-hide-scrollbar {
    position: fixed;
    left: 0;
    visibility: hidden;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none
}

main#top {
    padding: 0 0 6rem
}

@media screen and (max-width: 767px) {
    main#top {
        padding: 0 0 3rem
    }
}

main#top #visual_area {
    position: relative;
    width: 100%;
    height: 100vh
}

@media screen and (max-width: 767px) {
    main#top #visual_area {
        padding: 21.15rem 0 0;
        height: 32.2rem
    }
}

main#top #visual_area .bg_wrapper {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 0%;
    height: 169.0277777778vw;
    overflow: hidden;
    -webkit-transition: .8s ease 1.2s;
    transition: .8s ease 1.2s
}

@media screen and (max-width: 767px) {
    main#top #visual_area .bg_wrapper {
        top: 4.9rem;
        height: 21.6rem
    }
}

.end main#top #visual_area .bg_wrapper {
    width: 100%
}

main#top #visual_area .bg_wrapper .bg_line {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    height: 69.0277777778vw;
    background: url(../images/top/kv_bg.png) no-repeat;
    background-size: cover;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-animation: bgLineAni 50s linear infinite;
    animation: bgLineAni 50s linear infinite;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter .8s linear 1.2s;
    transition: -webkit-filter .8s linear 1.2s;
    transition: filter .8s linear 1.2s;
    transition: filter .8s linear 1.2s, -webkit-filter .8s linear 1.2s
}

@media screen and (max-width: 767px) {
    main#top #visual_area .bg_wrapper .bg_line {
        height: 16.6rem;
        background: url(../images/top/kv_bg_sp.png) no-repeat;
        background-size: cover
    }
}

.end main#top #visual_area .bg_wrapper .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main#top #visual_area h2.title {
    position: absolute;
    top: 50%;
    left: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: -11.1rem 0 0 -30.2rem;
    font-size: 3rem;
    letter-spacing: .4em;
    line-height: 1.8;
    opacity: 0;
    -webkit-transition: 1.2s ease .2s;
    transition: 1.2s ease .2s
}

@media screen and (max-width: 767px) {
    main#top #visual_area h2.title {
        top: 5.45rem;
        left: 1rem;
        margin: 0;
        font-size: 1.8rem
    }
}

.end main#top #visual_area h2.title {
    opacity: 1
}

main#top #visual_area .about_area {
    position: absolute;
    left: 50%;
    bottom: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0;
    width: 30.5rem;
    opacity: 0;
    -webkit-transition: .6s linear 1.4s;
    transition: .6s linear 1.4s
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area {
        position: relative;
        left: auto;
        bottom: auto;
        display: block;
        margin: 0 auto 0;
        width: 18.1rem
    }
}

.end main#top #visual_area .about_area {
    opacity: 1
}

main#top #visual_area .about_area div.lead {
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area div.lead {
        font-size: 0.7rem;
        letter-spacing: 0em
    }
}

main#top #visual_area .about_area .banner_area {
    margin: 1.6rem 0 0;
    width: 22.5rem;
    height: 4rem
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area .banner_area {
        margin: 1rem auto 0;
        width: 18.1rem;
        height: 2.4rem
    }
}

main#top #visual_area .about_area .banner_area a {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    border-radius: .2rem;
    padding: 0 0 0 7.2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area .banner_area a {
        padding: 0 0 0 5.9rem;
        border-radius: .2rem
    }
}

main#top #visual_area .about_area .banner_area span.lead {
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area .banner_area span.lead {
        font-size: 0.6rem;
        line-height: 1.4
    }
}

main#top #visual_area .about_area .banner_area span.title {
    margin: 0.4rem 0 0;
    font-family: "Roboto", serif;
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: .03em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area .banner_area span.title {
        margin: 0.1rem 0 0;
        font-size: 1rem;
        letter-spacing: 0
    }
}

main#top #visual_area .about_area .banner_area .chara {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 6.25rem;
    height: 4rem;
    background: url(../images/top/banner_chara.png) no-repeat;
    background-size: cover
}

@media screen and (max-width: 767px) {
    main#top #visual_area .about_area .banner_area .chara {
        left: 0.5rem;
        width: 4.05rem;
        height: 2.4rem;
        background: url(../images/top/banner_chara_sp.png) no-repeat;
        background-size: cover
    }
}

main#top #visual_area .pagelink_area {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 0 -29.9rem;
    opacity: 0;
    -webkit-transition: .6s linear 1.4s;
    transition: .6s linear 1.4s
}

@media screen and (max-width: 767px) {
    main#top #visual_area .pagelink_area {
        position: relative;
        bottom: auto;
        left: auto;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: 0.6rem auto 0
    }
}

.end main#top #visual_area .pagelink_area {
    opacity: 1
}

main#top #visual_area .pagelink_area .pagelink+.pagelink {
    margin: 0 0 0 1.3rem
}

@media screen and (max-width: 767px) {
    main#top #visual_area .pagelink_area .pagelink+.pagelink {
        margin: 0 0 0 2rem
    }
}

main#top #visual_area .pagelink_area .pagelink a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

main#top #visual_area .pagelink_area .pagelink a.over {
    opacity: .6
}

main#top #visual_area .pagelink_area .pagelink span.text {
    font-size: 0.8rem;
    letter-spacing: .4em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main#top #visual_area .pagelink_area .pagelink span.text {
        font-size: 0.9rem;
        letter-spacing: .26em
    }
}

main#top #visual_area .pagelink_area .pagelink span.circle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1px solid #e4e4e4
}

@media screen and (max-width: 767px) {
    main#top #visual_area .pagelink_area .pagelink span.circle {
        margin: 0 0 0 0.4rem;
        width: 2.2rem;
        height: 2.2rem
    }
}

main#top #visual_area .pagelink_area .pagelink span.circle span.ico {
    width: 0.4rem;
    height: 0.25rem
}

main#top .find_contents.re .box {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

@media screen and (max-width: 767px) {
    main#top .find_contents.re .box {
        display: block
    }
}

main#top .find_contents .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto 0;
    width: 61rem
}

@media screen and (max-width: 767px) {
    main#top .find_contents .box {
        display: block;
        width: 18.1rem
    }
}

main#top .find_contents .box>.image {
    position: relative;
    margin: 0 auto 0;
    width: 100%;
    border-radius: .2rem;
    overflow: hidden
}

@media print,
screen and (min-width: 768px) {
    main#top .find_contents .box>.image {
        display: none
    }
}

main#top .find_contents .title_area {
    padding: 0 0 0 5.6rem;
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    main#top .find_contents .title_area {
        margin: 2rem auto 0;
        padding: 0;
        width: 100%
    }
}

main#top .find_contents .title_area h3.title .jpn {
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1
}

main#top .find_contents .title_area h3.title .eng {
    margin: 1rem 0 0;
    font-size: 3rem;
    font-weight: 200;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top .find_contents .title_area h3.title .eng {
        margin: 0.6rem 0 0;
        font-size: 2rem
    }
}

main#top .find_contents .title_area .lead {
    margin: 2rem 0 0 3.2rem;
    font-size: 2.2rem;
    letter-spacing: .2em;
    line-height: 1.5
}

@media screen and (max-width: 767px) {
    main#top .find_contents .title_area .lead {
        margin: 2rem 0 0 1.9rem;
        font-size: 1.2rem;
        line-height: 2
    }
}

main#top .find_contents .content_area {
    position: relative;
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    main#top .find_contents .content_area {
        width: 100%
    }
}

main#top .find_contents .content_area .image {
    width: 100%;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main#top .find_contents .content_area .image {
        display: none
    }
}

main#top .find_contents .content_area .body {
    margin: 2.4rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#top .find_contents .content_area .body {
        margin: 0;
        letter-spacing: .08em
    }
}

main#top .find_contents .content_area .btn_area {
    margin: 2.4rem 0 0
}

@media screen and (max-width: 767px) {
    main#top .find_contents .content_area .btn_area {
        position: relative;
        z-index: 2;
        margin: 2rem 0 0;
        width: 14.55rem;
        height: 2.7rem
    }

    main#top .find_contents .content_area .btn_area span.text {
        margin: 0 1.35rem 0 0;
        font-size: 0.7rem
    }

    main#top .find_contents .content_area .btn_area span.circle {
        right: 0.2rem;
        margin: -1.2rem 0 0;
        width: 2.4rem;
        height: 2.4rem
    }
}

main#top #top_job {
    position: relative;
    margin: 0 auto 0;
    padding: 2.75rem 0 8rem;
    opacity: 0;
    -webkit-transition: .6s linear 1.4s;
    transition: .6s linear 1.4s
}

@media screen and (max-width: 767px) {
    main#top #top_job {
        padding: 0 0 5rem
    }
}

.end main#top #top_job {
    opacity: 1
}

main#top #top_job .image {
    position: relative;
    width: 100%;
    height: 19.8rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main#top #top_job .image {
        top: 0;
        left: 0;
        height: 11.75rem
    }
}

main#top #top_job .image img {
    position: relative
}

main#top #top_job .image .image_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 113.5rem;
    height: 19.8rem;
    background-image: url(../images/top/bg_company.jpg);
    background-repeat: repeat-x;
    background-position: 100% center;
    background-size: 56.75rem 19.8rem;
    will-change: background-position;
    -webkit-animation: jobImageBgAnim 200s linear infinite;
    animation: jobImageBgAnim 200s linear infinite
}

@media screen and (max-width: 767px) {
    main#top #top_job .image .image_bg {
        width: 67.4rem;
        height: 11.75rem;
        background-size: 33.7rem 11.75rem
    }
}

main#top #top_job .content_area {
    padding: 0
}

@media screen and (max-width: 767px) {
    main#top #top_job .content_area {
        padding: 1.95rem 0 0
    }
}

main#top #top_job .content_area .body {
    margin: 2.4rem auto 0
}

@media screen and (max-width: 767px) {
    main#top #top_job .content_area .body {
        margin: 0 auto 0
    }
}

main#top #top_jinzai {
    position: relative;
    margin: 2.75rem auto 0;
    padding: 2.75rem 0 8rem
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai {
        margin: 0 auto 0;
        padding: 0 0 5rem
    }
}

main#top #top_jinzai.active .bg_wrapper {
    width: 100%
}

main#top #top_jinzai.active .bg_wrapper .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main#top #top_jinzai.active .box .image {
    opacity: 1
}

main#top #top_jinzai.active .content_area {
    opacity: 1
}

main#top #top_jinzai.active .title_area {
    opacity: 1
}

main#top #top_jinzai .bg_wrapper {
    pointer-events: none;
    position: absolute;
    top: -7.05rem;
    left: 50%;
    margin: 0 0 0 -50%;
    width: 0%;
    height: 180.2777777778vw;
    overflow: hidden;
    -webkit-transition: .8s ease .2s;
    transition: .8s ease .2s
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .bg_wrapper {
        top: -0.4rem;
        height: 19.9rem
    }
}

main#top #top_jinzai .bg_wrapper .bg_line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 80.2777777778vw;
    background: url(../images/top/jinzai_bg.png) bottom center no-repeat;
    background-size: cover;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter 1.2s linear .2s;
    transition: -webkit-filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s, -webkit-filter 1.2s linear .2s
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .bg_wrapper .bg_line {
        width: 100%;
        height: 14.9rem;
        background: url(../images/top/jinzai_bg_sp.png) no-repeat;
        background-size: cover
    }
}

main#top #top_jinzai .box .image {
    position: relative;
    opacity: 0;
    -webkit-transition: .6s linear 1s;
    transition: .6s linear 1s;
    width: 100%;
    height: 16.8rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .box .image {
        height: 10rem
    }
}

main#top #top_jinzai .box .image .image_bg {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -20.25rem 0 0 -33.95rem;
    width: 67.85rem;
    height: 40.2rem;
    background-image: url(../images/top/job_01.jpg);
    background-repeat: repeat-y;
    background-position: center 0%;
    background-size: 67.85rem 20.1rem;
    -webkit-transform: rotate(-16deg);
    transform: rotate(-16deg);
    will-change: background-position;
    -webkit-animation: imageBgAnim 50s linear infinite;
    animation: imageBgAnim 50s linear infinite
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .box .image .image_bg {
        z-index: 2;
        margin: -12.5rem 0 0 -21.1rem;
        width: 42.15rem;
        height: 25rem;
        background-image: url(../images/top/job_01.jpg);
        background-repeat: repeat-y;
        background-position: center 0%;
        background-size: 42.15rem 12.5rem
    }
}

main#top #top_jinzai .content_area {
    opacity: 0;
    -webkit-transition: .6s linear 1s;
    transition: .6s linear 1s
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .content_area {
        padding: 4rem 0 0
    }
}

main#top #top_jinzai .title_area {
    padding: 0 0 0 9.4rem;
    opacity: 0;
    -webkit-transition: .6s linear 1s;
    transition: .6s linear 1s
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .title_area {
        padding: 0
    }
}

main#top #top_jinzai .title_area .lead {
    margin: 2rem 0 0 3.2rem
}

@media screen and (max-width: 767px) {
    main#top #top_jinzai .title_area .lead {
        margin: 2rem 0 0 1.9rem
    }
}

main#top #link_area .link_box {
    position: relative;
    z-index: 2;
    margin: 0 auto 0;
    width: 66rem
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box {
        width: 18.1rem
    }
}

main#top #link_area .link_box.white {
    background: #fff;
    color: #222
}

main#top #link_area .link_box+.link_box {
    margin: 3rem auto 0
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box+.link_box {
        margin: 2rem auto 0
    }
}

@media screen and (max-width: 767px)and (max-width: 767px) {
    main#top #link_area .link_box+.link_box .btn_area {
        width: 13.45rem
    }

    main#top #link_area .link_box+.link_box .btn_area span.text {
        margin: 0 0.8rem 0 0
    }
}

main#top #link_area .link_box a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 3.75rem 3rem;
    border-radius: .2rem;
    background: -webkit-gradient(linear, left top, right top, from(#545454), to(#363636));
    background: linear-gradient(90deg, #545454 0%, #363636 100%);
    color: #fff
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box a {
        padding: 1.2rem 1.2rem
    }
}

main#top #link_area .link_box a.white {
    color: #222;
    background: #fff
}

main#top #link_area .link_box a.white .progress circle {
    opacity: .5 !important
}

main#top #link_area .link_box a.white .progress circle.bg {
    stroke: #000
}

main#top #link_area .link_box a.white .progress circle.fg {
    stroke: #000
}

main#top #link_area .link_box a.white .ico svg path {
    stroke: #222
}

main#top #link_area .link_box a.white.over .progress circle.bg {
    stroke: rgba(0, 0, 0, 0)
}

main#top #link_area .link_box a.white.over .progress circle.fg {
    stroke: #000
}

main#top #link_area .link_box a.over span.circle .progress {
    -webkit-animation: progress-animation .6s linear 0s 1 forwards;
    animation: progress-animation .6s linear 0s 1 forwards
}

main#top #link_area .link_box a.over span.circle .progress circle.bg {
    stroke: rgba(0, 0, 0, 0)
}

main#top #link_area .link_box a.over span.circle .progress circle.fg {
    stroke: #e4e4e4
}

main#top #link_area .link_box h3.title .jpn {
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box h3.title .jpn {
        font-size: 0.5rem
    }
}

main#top #link_area .link_box h3.title .eng {
    margin: 1rem 0 0;
    font-size: 2.4rem;
    font-weight: 200;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box h3.title .eng {
        margin: 0.6rem 0 0;
        font-size: 1.6rem
    }
}

main#top #link_area .link_box .body {
    margin: 1.6rem 0 0;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box .body {
        margin: 1rem 0 0;
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

main#top #link_area .link_box p.note {
    margin: 1.3rem 0 0;
    font-size: 0.6rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box p.note {
        margin: 0.8rem 0 0;
        letter-spacing: .12em
    }
}

main#top #link_area .link_box span.circle {
    position: absolute;
    top: 50%;
    right: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: -3rem 0 0;
    width: 6rem;
    height: 6rem;
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box span.circle {
        right: 1.2rem;
        margin: -1.2rem 0 0;
        width: 2.4rem;
        height: 2.4rem
    }
}

main#top #link_area .link_box span.circle .progress {
    --size: 60px;
    --half-size: calc(var(--size) / 2);
    --stroke-width: 0.5px;
    --radius: calc((var(--size) - var(--stroke-width)) / 2);
    --circumference: calc(var(--radius) * pi * 2);
    --dash: calc((var(--progress) * var(--circumference)) / 100)
}

main#top #link_area .link_box span.circle .progress circle {
    opacity: .3;
    cx: var(--half-size);
    cy: var(--half-size);
    r: var(--radius);
    r: 29px;
    stroke-width: var(--stroke-width);
    fill: none;
    stroke-linecap: round
}

main#top #link_area .link_box span.circle .progress circle.bg {
    stroke: #e4e4e4
}

main#top #link_area .link_box span.circle .progress circle.fg {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: var(--half-size) var(--half-size);
    transform-origin: var(--half-size) var(--half-size);
    stroke-dasharray: var(--dash) calc(var(--circumference) - var(--dash));
    stroke: #e4e4e4
}

main#top #link_area .link_box span.circle span.ico {
    position: absolute;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    margin: 0 0 0 0.1rem;
    width: 0.95rem;
    height: 1.5rem
}

@media screen and (max-width: 767px) {
    main#top #link_area .link_box span.circle span.ico {
        width: 0.4rem;
        height: 0.6rem
    }
}

main#top #top_heroproject {
    position: relative;
    margin: 5.25rem auto 0;
    padding: 2.75rem 0 0
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject {
        margin: 5rem auto 0;
        padding: 0
    }
}

main#top #top_heroproject.active .bg_wrapper {
    width: 100%
}

main#top #top_heroproject.active .bg_wrapper .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main#top #top_heroproject.active .box .text_area {
    opacity: 1
}

#top_heroproject .box .text_area {
    text-align: center;
    opacity: 0;
    -webkit-transition: .6s linear 1s;
    transition: .6s linear 1s;
}

main#top #top_heroproject.active .box .image_area {
    opacity: 1
}

main#top #top_heroproject .bg_wrapper {
    pointer-events: none;
    position: absolute;
    top: 6.4rem;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 0%;
    height: 90.5rem;
    overflow: hidden;
    -webkit-transition: 1.2s ease .2s;
    transition: 1.2s ease .2s
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_wrapper {
        top: 45.4rem;
        height: 35.8rem
    }
}

main#top #top_heroproject .bg_wrapper .bg_line {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    height: 90.5rem;
    height: 100vw;
    background: url(../images/top/heroproject_bg.png) no-repeat;
    background-size: cover;
    background-position: top center;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter 1.2s linear .2s;
    transition: -webkit-filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s, -webkit-filter 1.2s linear .2s
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_wrapper .bg_line {
        height: 35.8rem;
        background: url(../images/top/heroproject_bg_sp.png) no-repeat;
        background-size: cover
    }
}

main#top #top_heroproject .bg_area {
    position: absolute;
    top: -33.55rem;
    left: 0;
    width: 100%;
    height: 81.05rem
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_area {
        top: -27.85rem;
        height: 81.5rem
    }
}

main#top #top_heroproject .bg_area .bg_2_wrapper {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 58.8%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 58.8%, 0 100%)
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_area .bg_2_wrapper {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 87.5%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 87.5%, 0 100%);
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 89.6%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 89.6%, 0 100%)
    }
}

main#top #top_heroproject .bg_area .bg_2_wrapper .bg_before {
    position: relative;
    width: 100%;
    height: 18rem;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(30%, #FEFEFE), to(#F0EEEC));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FEFEFE 30%, #F0EEEC 100%)
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_area .bg_2_wrapper .bg_before {
        height: 14.45rem
    }
}

main#top #top_heroproject .bg_area .bg_2_wrapper .bg_2 {
    position: relative;
    width: 100%;
    height: 63.05rem;
    background: linear-gradient(197.39deg, #E8E0D9 36.41%, #EEEEEE 86.86%)
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_area .bg_2_wrapper .bg_2 {
        height: 67.05rem;
        background: linear-gradient(194.19deg, #E8E0D9 27.98%, #EEEEEE 70.28%);
        background: linear-gradient(194.19deg, #E8E0D9 10%, #EEEEEE 60%)
    }
}

main#top #top_heroproject .bg_area .bg_1 {
    position: absolute;
    top: 18rem;
    left: 0;
    width: 100%;
    height: 63.05rem;
    background-color: #e3d7cb;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 47%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 47%)
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .bg_area .bg_1 {
        top: 14.45rem;
        height: 67.05rem;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 87.5%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 87.5%)
    }
}

/* WordPress main.css - top_heroproject完全置換 */

main#top #top_heroproject .box {
    position: relative;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box {
        width: 18.1rem
    }
}

/* WordPress実装 - top_company CSS完全移植 */

main#top #top_heroproject h3.title .jpn {
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1;
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject h3.title .jpn {
        font-size: 0.5rem
    }
}

main#top #top_heroproject h3.title .eng {
    margin: 1rem 0 0;
    font-size: 3rem;
    font-weight: 200;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject h3.title .eng {
        margin: 0.6rem 0 0;
        font-size: 1.6rem
    }
}

main#top #top_heroproject .lead {
    margin: 4rem auto 0;
    font-size: 2.7rem;
    letter-spacing: .12em;
    line-height: 1;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .lead {
        margin: 1.6rem auto 0;
        font-size: 1.6rem;
        line-height: 1.6
    }
}

main#top #top_heroproject .body {
    margin: 0.8rem auto 0;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .body {
        margin: 1rem auto 0;
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

main#top #top_heroproject .btn_area {
    margin: 3.4rem auto 0;
    width: 14.65rem
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .btn_area {
        margin: 1.6rem auto 0;
        width: 11.9rem;
        height: 2.7rem
    }
}

main#top #top_heroproject .box .image_area {
    width: 38.25rem;
    opacity: 0;
    -webkit-transition: .6s linear 1.4s;
    transition: .6s linear 1.4s
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area {
        margin: 4rem auto 0;
        width: 100%
    }
}

main#top #top_heroproject .box .image_area a {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

main#top #top_heroproject .box .image_area a.over {
    opacity: .6
}

main#top #top_heroproject .box .image_area .image {
    border-radius: .2rem;
    overflow: hidden
}

main#top #top_heroproject .box .image_area .link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0.9rem 0 0;
    padding: 0.75rem 0;
    border-bottom: 1px solid #222
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area .link {
        display: block;
        margin: 0.4rem 0 0;
        padding: 0.4rem 0 0.8rem
    }
}

main#top #top_heroproject .box .image_area .link .ip_name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 0.8rem;
    font-weight: 300;
    letter-spacing: .08em;
    line-height: 1.3
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area .link .ip_name {
        font-size: 0.6rem
    }
}

main#top #top_heroproject .box .image_area .link .ip_name span.cross {
    margin: 0 0.4rem;
    width: 0.4rem;
    height: 0.4rem
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area .link .ip_name span.cross {
        margin: 0 0.3rem;
        width: 0.2rem;
        height: 0.2rem
    }
}

main#top #top_heroproject .box .image_area .link h4.title {
    margin: 0 0 0.2rem 1rem;
    font-size: 1.2rem;
    letter-spacing: .08em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area .link h4.title {
        margin: 0.5rem 0 0;
        font-size: 1rem;
        line-height: 1.4
    }
}

main#top #top_heroproject .box .image_area .link .ico_area {
    position: absolute;
    top: 50%;
    right: 0.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: -0.8rem 0 0;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .image_area .link .ico_area {
        margin: -0.4rem 0 0
    }
}

main#top #top_heroproject .box .image_area .link .ico_area span.circle {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

main#top #top_heroproject .box .image_area .link .ico_area span.ico {
    width: 0.35rem;
    height: 0.55rem
}

main#top #top_company {
    position: relative;
    margin: 12.95rem auto 0;
    padding: 2.75rem 0 0
}

@media screen and (max-width: 767px) {
    main#top #top_company {
        margin: 14.6rem auto 0;
        padding: 0
    }
}

main#top #top_company .bg_logo {
    position: absolute;
    top: 0.65rem;
    left: 50%;
    margin: 0 0 0 -13.95rem;
    width: 27.85rem;
    height: 30.1rem
}

@media screen and (max-width: 767px) {
    main#top #top_company .bg_logo {
        top: 1.25rem;
        margin: 0 0 0 -7.6rem;
        width: 15.2rem;
        height: 16.4rem
    }
}

main#top #top_company .box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 auto 0;
    width: 45rem
}

@media screen and (max-width: 767px) {
    main#top #top_company .box {
        width: 18.1rem
    }
}

@media screen and (max-width: 767px) {
    main#top #top_company h3.title {
        margin: 0 auto 0;
        width: 8.4rem
    }
}

main#top #top_company h3.title .jpn {
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #top_company h3.title .jpn {
        font-size: 0.5rem
    }
}

main#top #top_company h3.title .eng {
    margin: 1rem 0 0;
    font-size: 3rem;
    font-weight: 200;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #top_company h3.title .eng {
        margin: 0.6rem 0 0;
        font-size: 1.6rem
    }
}

main#top #top_company .lead {
    margin: 4rem auto 0;
    font-size: 2.7rem;
    letter-spacing: .12em;
    line-height: 1;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#top #top_company .lead {
        margin: 1.6rem auto 0;
        font-size: 1.6rem;
        line-height: 1.6
    }
}

main#top #top_company .body {
    margin: 0.8rem auto 0;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#top #top_company .body {
        margin: 1rem auto 0;
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

main#top #top_company .btn_area {
    margin: 3.4rem auto 0;
    width: 14.65rem
}

@media screen and (max-width: 767px) {
    main#top #top_company .btn_area {
        margin: 1.6rem auto 0;
        width: 11.9rem;
        height: 2.7rem
    }

    main#top #top_company .btn_area span.text {
        margin: 0 0.6rem 0 0;
        font-size: 0.7rem
    }

    main#top #top_company .btn_area span.circle {
        right: 0.2rem;
        margin: -1.2rem 0 0;
        width: 2.4rem;
        height: 2.4rem
    }
}

main#top #news_area {
    position: relative;
    margin: 17.35rem auto 0;
    padding: 2.75rem 0 0
}

@media screen and (max-width: 767px) {
    main#top #news_area {
        margin: 11rem auto 0;
        padding: 0
    }
}

main#top #news_area.active .bg_wrapper {
    width: 100%
}

main#top #news_area.active .bg_wrapper .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main#top #news_area.active .box {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

main#top #news_area.active .title_area {
    opacity: 1
}

main#top #news_area .bg_wrapper {
    pointer-events: none;
    position: absolute;
    top: -16.05rem;
    top: 0;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 0%;
    height: 223.125vw;
    height: 90rem;
    overflow: hidden;
    -webkit-transition: 1.6s ease .2s;
    transition: 1.6s ease .2s
}

@media screen and (max-width: 767px) {
    main#top #news_area .bg_wrapper {
        top: -6rem;
        top: 0;
        height: 19.95rem
    }
}

main#top #news_area .bg_wrapper .bg_line {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    height: 123.125vw;
    height: 90rem;
    background: url(../images/top/company_bg.png) no-repeat;
    background-size: cover;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter 1.2s linear .2s;
    transition: -webkit-filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s, -webkit-filter 1.2s linear .2s
}

@media screen and (max-width: 767px) {
    main#top #news_area .bg_wrapper .bg_line {
        height: 14.95rem;
        background: url(../images/top/company_bg_sp.png) no-repeat;
        background-size: cover;
        -webkit-clip-path: polygon(0 56.6%, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 56.6%, 100% 0, 100% 100%, 0 100%)
    }
}

main#top #news_area .bg_wrapper_bottom {
    pointer-events: none;
    position: absolute;
    top: 58.45rem;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    -webkit-transition: .8s ease .2s;
    transition: .8s ease .2s
}

@media print,
screen and (min-width: 768px) {
    main#top #news_area .bg_wrapper_bottom {
        display: none
    }
}

main#top #news_area .bg_wrapper_bottom.active {
    height: 37.25rem
}

main#top #news_area .bg_wrapper_bottom.active .bg_line {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main#top #news_area .bg_wrapper_bottom .bg_line {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 32.25rem;
    background: url(../images/top/news_bg_sp.png) no-repeat;
    background-size: cover;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter 1.2s linear .2s;
    transition: -webkit-filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s;
    transition: filter 1.2s linear .2s, -webkit-filter 1.2s linear .2s
}

main#top #news_area .bg_area {
    position: absolute;
    top: -16.05rem;
    left: 0;
    width: 100%;
    height: 90rem
}

@media screen and (max-width: 767px) {
    main#top #news_area .bg_area {
        top: -6rem;
        height: 105rem
    }
}

main#top #news_area .bg_area .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

main#top #news_area .bg_area .bg.bg_1 {
    background-color: #e3d7cb;
    -webkit-clip-path: polygon(0 0, 100% 38%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 38%, 100% 100%, 0 100%)
}

@media screen and (max-width: 767px) {
    main#top #news_area .bg_area .bg.bg_1 {
        -webkit-clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 100%)
    }
}

main#top #news_area .bg_area .bg.bg_2 {
    background: linear-gradient(12.88deg, #E8E0D9 50.37%, #EEEEEE 89.74%);
    -webkit-clip-path: polygon(0 38%, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 38%, 100% 0, 100% 100%, 0 100%)
}

@media screen and (max-width: 767px) {
    main#top #news_area .bg_area .bg.bg_2 {
        -webkit-clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%)
    }
}

main#top #news_area .box {
    position: relative;
    margin: 0 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 4rem 0 5.5rem;
    width: calc(100% - 3rem);
    background-color: #fff;
    border-radius: .2rem 0 0 .2rem;
    -webkit-transform: translateX(2.5rem);
    transform: translateX(2.5rem);
    opacity: 0;
    -webkit-transition: .6s linear 1s;
    transition: .6s linear 1s
}

@media screen and (max-width: 767px) {
    main#top #news_area .box {
        display: block;
        padding: 2rem 0 2rem;
        width: calc(100% - 1.1rem)
    }
}

main#top #news_area .box .title_area {
    margin: 0 0 0 3rem;
    width: 21.5rem
}

@media screen and (max-width: 767px) {
    main#top #news_area .box .title_area {
        margin: 0 0 0 1rem;
        width: 100%
    }
}

main#top #news_area .box .title_area h3.title .jpn {
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #news_area .box .title_area h3.title .jpn {
        font-size: 0.5rem
    }
}

main#top #news_area .box .title_area h3.title .eng {
    margin: 0.8rem 0 0;
    font-size: 2.4rem;
    font-weight: 200;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #news_area .box .title_area h3.title .eng {
        margin: 0.6rem 0 0;
        font-size: 1.6rem
    }
}

main#top #news_area .box .btn_area {
    position: absolute;
    bottom: 6rem;
    left: 6.45rem;
    width: 11.65rem
}

@media screen and (max-width: 767px) {
    main#top #news_area .box .btn_area {
        position: relative;
        bottom: auto;
        left: auto;
        margin: 2rem auto 0;
        width: 10.4rem;
        height: 2.7rem
    }

    main#top #news_area .box .btn_area span.text {
        margin: 0 0.6rem 0 0;
        font-size: 0.7rem
    }

    main#top #news_area .box .btn_area span.circle {
        right: 0.2rem;
        margin: -1.2rem 0 0;
        width: 2.4rem;
        height: 2.4rem
    }
}

main#top #news_area .box ul.news_list {
    width: 41.5rem
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list {
        margin: 2rem 0 0 1rem;
        width: 17.1rem
    }
}

main#top #news_area .box ul.news_list li.news {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media print,
screen and (min-width: 768px) {
    main#top #news_area .box ul.news_list li.news {
        cursor: pointer
    }

    main#top #news_area .box ul.news_list li.news:hover .image img {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

main#top #news_area .box ul.news_list li.news+li.news {
    margin: 2rem 0 0
}

main#top #news_area .box ul.news_list li.news .image {
    width: 14.5rem;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .image {
        width: 7.5rem
    }
}

main#top #news_area .box ul.news_list li.news .image img {
    -webkit-transition: .3s linear;
    transition: .3s linear
}

main#top #news_area .box ul.news_list li.news .text_area {
    margin: 0 0 0 1.6rem;
    width: 25.4rem
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area {
        margin: 0 0 0 1rem;
        width: 8.55rem
    }
}

main#top #news_area .box ul.news_list li.news .text_area .date_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area .date_area {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

main#top #news_area .box ul.news_list li.news .text_area .date {
    font-size: 0.8rem;
    font-weight: 300;
    letter-spacing: .2em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area .date {
        font-size: 0.6rem
    }
}

main#top #news_area .box ul.news_list li.news .text_area .category {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 0 0.6rem;
    padding: 0 0.8rem;
    height: 1.25rem;
    border-radius: 0.625rem;
    font-size: 0.6rem;
    font-weight: 300;
    letter-spacing: .2em;
    line-height: 1.4;
    color: #fff
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area .category {
        margin: 0.3rem 0 0;
        height: 1.1rem;
        font-size: 0.5rem
    }
}

main#top #news_area .box ul.news_list li.news .text_area .line {
    margin: 1.2rem 0 0;
    width: 1.6rem;
    height: 0.039rem;
    background-color: #e4e4e4
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area .line {
        margin: 0.5rem 0 0;
        width: 1.3rem
    }
}

main#top #news_area .box ul.news_list li.news .text_area h4.title {
    margin: 0.5rem 0 0;
    font-size: 1.2rem;
    letter-spacing: .16em;
    line-height: 1.8;
    max-height: 7.5rem;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

@media screen and (max-width: 767px) {
    main#top #news_area .box ul.news_list li.news .text_area h4.title {
        margin: 0.25rem 0 0;
        font-size: 0.7rem;
        letter-spacing: .12em;
        line-height: 1.6;
        max-height: 3.5rem;
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical
    }
}

main#top #news_area .box ul.news_list li.news .text_area .body {
    display: none
}

@keyframes imageBgAnim {
    0% {
        background-position: center 100%
    }

    100% {
        background-position: center 0%
    }
}

@-webkit-keyframes imageBgAnim {
    0% {
        background-position: center 100%
    }

    100% {
        background-position: center 0%
    }
}

@keyframes jobImageBgAnim {
    0% {
        background-position: 100% center
    }

    100% {
        background-position: 0% center
    }
}

@-webkit-keyframes jobImageBgAnim {
    0% {
        background-position: 100% center
    }

    100% {
        background-position: 0% center
    }
}

@media screen and (max-width: 767px) {
    main.find #visual_area .bg_wrapper {
        top: 12.5rem
    }
}

main.find #visual_area .text_area {
    position: relative;
    left: 50%;
    z-index: 2;
    margin: 1.25rem 0 0 1rem;
    width: 32rem;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end main.find #visual_area .text_area {
    opacity: 1
}

@media screen and (max-width: 767px) {
    main.find #visual_area .text_area {
        left: auto;
        z-index: 1;
        margin: 3.6rem auto 0;
        width: 18.1rem
    }
}

main.find #visual_area .text_area h3.title {
    font-size: 2.2rem;
    letter-spacing: .2em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main.find #visual_area .text_area h3.title {
        font-size: 1.3rem;
        letter-spacing: .12em
    }
}

main.find #visual_area .text_area p.body {
    margin: 2rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main.find #visual_area .text_area p.body {
        margin: 3rem 0 0;
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

main.find #visual_area .text_area .btn_area {
    margin: 2rem 0 0 auto;
    width: 11.65rem
}

@media screen and (max-width: 767px) {
    main.find #visual_area .text_area .btn_area {
        margin: 4rem 0 0 auto;
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scale(0.8);
        transform: scale(0.8)
    }
}

main.find .job_list_area {
    position: relative;
    margin: 3rem auto 0;
    padding: 3rem 0 3rem;
    width: 66rem;
    background-color: #fff;
    border-radius: .2rem;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end main.find .job_list_area {
    opacity: 1
}

@media screen and (max-width: 767px) {
    main.find .job_list_area {
        margin: 2.4rem auto 0;
        padding: 2rem 0 2rem;
        width: 18.1rem
    }
}

main.find .job_list_area h4.title {
    font-size: 1.6rem;
    letter-spacing: .16em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .job_list_area h4.title {
        font-size: 1rem;
        letter-spacing: .12em;
        line-height: 1.6
    }
}

main.find .job_list_area ul.job_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 3rem auto 0;
    gap: 1rem
}

@media screen and (max-width: 767px) {
    main.find .job_list_area ul.job_list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 1.6rem auto 0;
        gap: 1.6rem
    }
}

main.find .job_list_area ul.job_list li {
    width: 14.25rem
}

@media screen and (max-width: 767px) {
    main.find .job_list_area ul.job_list li {
        width: 14.1rem
    }
}

main.find .job_list_area ul.job_list li h5.title {
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: .2em;
    line-height: 1.8;
    text-align: center
}

main.find .job_list_area ul.job_list li .image_area {
    margin: 0.6rem auto 0;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main.find .job_list_area ul.job_list li .image_area {
        margin: 0.4rem auto 0
    }
}

main.find .job_list_area ul.job_list li .body {
    margin: 0.6rem auto 0;
    font-size: 0.6rem;
    letter-spacing: .2em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .job_list_area ul.job_list li .body {
        margin: 0.4rem auto 0;
        font-size: 0.7rem;
        letter-spacing: .08em;
        line-height: 1.9
    }
}

main.find .fixbox_area {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 6rem auto 0;
    padding: 0 0 6rem
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area {
        display: block;
        margin: 3rem auto 0;
        padding: 0;
        opacity: 1 !important
    }
}

main.find .fixbox_area+.fixbox_area {
    margin: 4rem auto 0
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area {
        padding: 0 0 5rem
    }
}

main.find .fixbox_area.open .fixbox .image_area .title_area span.arr {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

main.find .fixbox_area .fixbox {
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .fixbox {
        margin: 0 auto 0;
        width: 18.1rem
    }
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .image_area .title_area {
        margin: 1.6rem auto 0;
        padding: 0 0 1rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-bottom: 1px solid #bebebe
    }
}

main.find .fixbox_area .image_area .title_area span.arr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1.9rem;
    height: 1.9rem;
    border: 1px solid #b4855c;
    border-radius: 50%;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    main.find .fixbox_area .image_area .title_area span.arr {
        display: none
    }
}

main.find .fixbox_area .image_area .title_area span.arr span.ico {
    width: 0.75rem;
    height: 0.4rem
}

main.find .fixbox_area .image_area h4.title {
    font-size: 1.6rem;
    letter-spacing: .12em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .image_area h4.title {
        font-size: 1.2rem;
        line-height: 1.6
    }
}

main.find .fixbox_area .image_area .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .image_area .body {
        letter-spacing: .08em
    }
}

main.find .fixbox_area .image_area .image {
    margin: 2rem 0 0;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .image_area .image {
        margin: 1.2rem 0 0
    }
}

main.find .fixbox_area .text_area {
    margin: 0 0 0 5rem;
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area {
        display: none;
        margin: 3rem auto 0;
        width: 18.1rem
    }
}

main.find .fixbox_area .text_area .reason_area h5.title {
    font-size: 1rem;
    letter-spacing: .12em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .reason_area h5.title {
        line-height: 1.6
    }
}

main.find .fixbox_area .text_area .reason_area .line {
    margin: 0.6rem 0 0;
    width: 100%;
    height: 1px;
    background-color: #e4e4e4
}

main.find .fixbox_area .text_area .reason_area ul.reason_list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 2rem auto 0
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .reason_area ul.reason_list {
        gap: 0.8rem;
        margin: 1.6rem auto 0
    }
}

main.find .fixbox_area .text_area .reason_area ul.reason_list li {
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9;
    padding: 0.5rem 1.2rem;
    background-color: rgba(232, 224, 217, .2);
    border-radius: 2.1rem
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .reason_area ul.reason_list li {
        letter-spacing: .08em;
        padding: 0.3rem 0.6rem
    }
}

main.find .fixbox_area .text_area .about_area {
    margin: 4rem auto 0;
    padding: 2rem;
    background-color: rgba(232, 224, 217, .2);
    border-radius: .2rem
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .about_area {
        margin: 3rem auto 0;
        padding: 1.6rem 2rem
    }
}

main.find .fixbox_area .text_area .about_area h5.title {
    font-size: 1.2rem;
    letter-spacing: .12em;
    line-height: 1;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .about_area h5.title {
        line-height: 1.6
    }
}

main.find .fixbox_area .text_area .about_area .line {
    margin: 1rem auto 0;
    width: 100%;
    height: 1px;
    background-color: #e4e4e4
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .about_area .line {
        margin: 1.2rem auto 0
    }
}

main.find .fixbox_area .text_area .about_area .body {
    margin: 1rem auto 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .about_area .body {
        margin: 1.2rem auto 0;
        letter-spacing: .08em
    }
}

main.find .fixbox_area .text_area .about_area .note {
    margin: 1rem auto 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .about_area .note {
        margin: 0.8rem auto 0;
        letter-spacing: .08em
    }
}

main.find .fixbox_area .text_area .flow_area {
    margin: 4rem auto 0
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .flow_area {
        margin: 3rem auto 0
    }
}

main.find .fixbox_area .text_area .flow_area h5.title {
    font-size: 1rem;
    letter-spacing: .12em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .fixbox_area .text_area .flow_area h5.title {
        line-height: 1.6
    }
}

main.find .fixbox_area .text_area .flow_area>.line {
    margin: 0.6rem 0 0;
    width: 100%;
    height: 1px;
    background-color: #e4e4e4
}

main.find .fixbox_area .text_area .flow_area ul.flow_list {
    margin: 2rem 0 0
}

main.find .flow_area ul.flow_list {
    border: 1px solid #f6f6f6;
    border-radius: .2rem;
    overflow: hidden
}

main.find .flow_area ul.flow_list li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.5rem 1rem 1.5rem 0;
    background-color: #faf9f7
}

main.find .flow_area ul.flow_list li:nth-child(2n) {
    background-color: #fff
}

main.find .flow_area ul.flow_list li .num {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.1rem;
    font-size: 2rem;
    font-weight: 100
}

main.find .flow_area ul.flow_list li .body_area {
    padding: 0 0 0 1rem;
    width: 25.4rem;
    border-left: 1px solid #e4e4e4
}

@media screen and (max-width: 767px) {
    main.find .flow_area ul.flow_list li .body_area {
        width: 13rem
    }
}

main.find .flow_area ul.flow_list li .body_area h6.title {
    font-size: 1rem;
    letter-spacing: .12em;
    line-height: 1
}

main.find .flow_area ul.flow_list li .body_area .text {
    margin: 0.6rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main.find .flow_area ul.flow_list li .body_area .text {
        letter-spacing: .08em
    }
}

main.find .flow_area ul.flow_list li .body_area .text a {
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {
    main.find .flow_area ul.flow_list li .body_area .text a:hover {
        text-decoration: none
    }
}

main.find .flow_area ul.flow_list li .bottom_line {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.1rem;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0.4rem, #e4e4e4), color-stop(0.4rem, transparent));
    background-image: linear-gradient(to right, #e4e4e4 0.4rem, transparent 0.4rem);
    background-size: 0.8rem 1px;
    background-repeat: repeat-x;
    background-position: -0.2rem bottom
}

main.find .flow_area ul.flow_list li .arr {
    position: absolute;
    bottom: -0.5rem;
    left: 1.6rem;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1rem;
    height: 1rem;
    background-color: #b4855c;
    border-radius: 50%
}

main.find .flow_area ul.flow_list li .arr .ico {
    width: 0.5rem;
    height: 0.3rem
}

main.find .btn_close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 2rem auto 0;
    width: 100%;
    height: 1.8rem;
    border: 1px solid #bebebe;
    border-radius: 0.9rem;
    font-size: 0.8rem;
    letter-spacing: .12em
}

@media print,
screen and (min-width: 768px) {
    main.find .btn_close {
        display: none
    }
}

main.find .link_area {
    position: relative;
    margin: 0 auto 0;
    padding: 5rem 0 5rem;
    background: -webkit-gradient(linear, left top, right top, from(#545454), to(#363636));
    background: linear-gradient(90deg, #545454 0%, #363636 100%);
    color: #fff
}

main.find .link_area.active .bg_area {
    width: 100%
}

main.find .link_area.active .bg_area .bg {
    -webkit-filter: blur(0);
    filter: blur(0)
}

main.find .link_area .bg_area {
    position: absolute;
    top: 0;
    right: 50%;
    margin: 0 -50% 0 0;
    width: 0;
    height: 100%;
    overflow: hidden;
    -webkit-transition: .8s ease .6s;
    transition: .8s ease .6s
}

main.find .link_area .bg_area .bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100vw;
    height: 100%;
    background: url(../images/job/link_area_bg.png) center top no-repeat;
    background-size: 100% auto;
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: -webkit-filter 1.2s linear .6s;
    transition: -webkit-filter 1.2s linear .6s;
    transition: filter 1.2s linear .6s;
    transition: filter 1.2s linear .6s, -webkit-filter 1.2s linear .6s
}

@media screen and (max-width: 767px) {
    main.find .link_area .bg_area .bg {
        background: url(../images/job/link_area_bg_sp.png) center bottom no-repeat;
        background-size: 100% auto
    }
}

main.find .link_area .inner {
    position: relative;
    margin: 0 auto 0;
    width: 66rem
}

@media screen and (max-width: 767px) {
    main.find .link_area .inner {
        width: 18.1rem
    }
}

main.find .link_area .inner h3.sub_contents_title .jpn {
    font-size: 0.8rem;
    line-height: 1.8;
    letter-spacing: .2em
}

@media screen and (max-width: 767px) {
    main.find .link_area .inner h3.sub_contents_title .jpn {
        font-size: 0.6rem;
        line-height: 1.9;
        letter-spacing: .12em
    }
}

main.find .link_area .inner h3.sub_contents_title .eng {
    margin: 0.6rem 0 0;
    font-size: 2.4rem;
    font-weight: 200;
    line-height: 1;
    letter-spacing: .1em
}

@media screen and (max-width: 767px) {
    main.find .link_area .inner h3.sub_contents_title .eng {
        margin: 0.2rem 0 0;
        font-size: 1.6rem
    }
}

main.find .link_area .inner .lead {
    margin: 2rem 0 0;
    font-size: 1.6rem;
    letter-spacing: .2em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main.find .link_area .inner .lead {
        font-size: 1.2rem;
        letter-spacing: .05em;
        line-height: 1.6
    }
}

main.find .link_area .inner .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main.find .link_area .inner .body {
        font-size: 0.7rem;
        letter-spacing: .2em;
        line-height: 2.2
    }
}

#container main.find .link_area .inner .link_btn_area {
    position: absolute;
    bottom: 0;
    right: 0;
    width: auto !important;
    height: 6rem !important
}

@media screen and (max-width: 767px) {
    #container main.find .link_area .inner .link_btn_area {
        position: relative;
        bottom: auto;
        right: auto;
        margin: 1.6rem 0 0 auto;
        height: 3.5rem !important
    }
}

#container main.find .link_area .inner .link_btn_area a {
    background: rgba(0, 0, 0, 0);
    border-radius: inherit
}

@media screen and (max-width: 767px) {
    #container main.find .link_area .inner .link_btn_area a {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

#container main.find .link_area .inner .link_btn_area a:before {
    display: none
}

#container main.find .link_area .inner .link_btn_area a span.circle {
    position: relative
}

#container main.find .link_area .inner .link_btn_area .text {
    position: relative;
    margin: 0 1rem 0 0;
    font-size: 1.2rem;
    letter-spacing: .2em
}

#container main.find .link_area .inner .link_btn_area span.circle {
    top: auto;
    right: auto;
    margin: 0;
    width: 6rem;
    height: 6rem
}

@media screen and (max-width: 767px) {
    #container main.find .link_area .inner .link_btn_area span.circle {
        width: 3.5rem;
        height: 3.5rem
    }
}

#container main.find .link_area .inner .link_btn_area span.circle .progress {
    --size: 120px;
    --half-size: calc(var(--size) / 2);
    --stroke-width: 1px;
    --radius: calc((var(--size) - var(--stroke-width)) / 2);
    --circumference: calc(var(--radius) * pi * 2);
    --dash: calc((var(--progress) * var(--circumference)) / 100)
}

#container main.find .link_area .inner .link_btn_area span.circle .progress circle {
    cx: var(--half-size);
    cy: var(--half-size);
    r: var(--radius);
    r: 59px;
    stroke-width: var(--stroke-width);
    fill: none;
    stroke-linecap: round
}

#container main.find .link_area .inner .link_btn_area span.ico {
    width: 0.5rem;
    height: 0.85rem
}

main.find .faq_area {
    margin: 0 auto 0;
    padding: 6rem 0 0;
    width: 66rem
}

@media screen and (max-width: 767px) {
    main.find .faq_area {
        padding: 2.1rem 0 0;
        width: 18.1rem
    }
}

main.find .faq_area .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width: 767px) {
    main.find .faq_area .box {
        display: block
    }
}

main.find .faq_area .title_area {
    width: 22rem
}

@media screen and (max-width: 767px) {
    main.find .faq_area .title_area {
        width: 18.1rem
    }
}

main.find .faq_area .title_area h3.sub_contents_title .jpn {
    font-size: 0.8rem;
    line-height: 1.8;
    letter-spacing: .2em
}

@media screen and (max-width: 767px) {
    main.find .faq_area .title_area h3.sub_contents_title .jpn {
        font-size: 0.7rem;
        line-height: 1.9;
        letter-spacing: .08em
    }
}

main.find .faq_area .title_area h3.sub_contents_title .eng {
    margin: 0.6rem 0 0;
    font-size: 2.4rem;
    font-weight: 200;
    line-height: 1;
    letter-spacing: .1em
}

@media screen and (max-width: 767px) {
    main.find .faq_area .title_area h3.sub_contents_title .eng {
        margin: 0.2rem 0 0;
        font-size: 1.6rem
    }
}

main.find .faq_area .faq_list {
    width: 44rem
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list {
        margin: 2rem auto 0;
        width: 18.1rem
    }
}

main.find .faq_area .faq_list .faq {
    background-color: rgba(232, 224, 217, .2);
    border-radius: .2rem
}

main.find .faq_area .faq_list .faq+.faq {
    margin: 1.6rem auto 0
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq+.faq {
        margin: 1rem auto 0
    }
}

main.find .faq_area .faq_list .faq.open .question span.ico {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

main.find .faq_area .faq_list .faq .question {
    position: relative;
    padding: 1rem 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media print,
screen and (min-width: 768px) {
    main.find .faq_area .faq_list .faq .question {
        cursor: pointer
    }
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq .question {
        padding: 1rem 1rem
    }
}

main.find .faq_area .faq_list .faq .question span.num {
    font-size: 2rem;
    font-weight: 200;
    line-height: 1;
    text-align: center
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq .question span.num {
        font-size: 1.6rem;
        font-weight: 300
    }
}

main.find .faq_area .faq_list .faq .question span.title {
    margin: 0 0 0 0.95rem;
    width: 100%;
    font-size: 1rem;
    letter-spacing: .12em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq .question span.title {
        margin: 0 0 0 0.4rem;
        font-size: 0.7rem;
        letter-spacing: .08em;
        line-height: 1.9
    }
}

main.find .faq_area .faq_list .faq .question span.ico {
    margin: 0 0 0 0.95rem;
    width: 2.4rem;
    height: 2.4rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq .question span.ico {
        margin: 0 0 0 0.4rem
    }
}

main.find .faq_area .faq_list .faq .pulldown_inner {
    display: none;
    position: relative;
    padding: 1rem 2rem
}

@media screen and (max-width: 767px) {
    main.find .faq_area .faq_list .faq .pulldown_inner {
        padding: 1rem 1rem
    }
}

main.find .faq_area .faq_list .faq .pulldown_inner .line {
    position: absolute;
    top: 0;
    left: 2rem;
    width: calc(100% - 4rem);
    height: 0.1rem;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0.4rem, #e4e4e4), color-stop(0.4rem, transparent));
    background-image: linear-gradient(to right, #e4e4e4 0.4rem, transparent 0.4rem);
    background-size: 0.8rem 1px;
    background-repeat: repeat-x;
    background-position: -0.2rem bottom
}

main.find .faq_area .faq_list .faq .pulldown_inner .answer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

main.find .faq_area .faq_list .faq .pulldown_inner .answer .num {
    width: 2.4rem;
    font-size: 2rem;
    font-weight: 200;
    line-height: 1;
    text-align: center
}

main.find .faq_area .faq_list .faq .pulldown_inner .answer .body {
    margin: 0 0 0 0.95rem;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

main.find .faq_area .faq_list .faq .pulldown_inner .answer .body a {
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {
    main.find .faq_area .faq_list .faq .pulldown_inner .answer .body a:hover {
        text-decoration: none
    }
}

main.find .sub_contents {
    position: relative
}

#job {
    position: relative
}

#job #visual_area {
    background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#F1EDE9));
    background: linear-gradient(180deg, #FEFEFE 0%, #F1EDE9 100%)
}

@media screen and (max-width: 767px) {
    #job #visual_area {
        background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#EFE9E2));
        background: linear-gradient(180deg, #FEFEFE 0%, #EFE9E2 100%);
        padding: 5rem 0 5.5rem
    }
}

#job .sub_contents.overview {
    margin: 6rem auto 0
}

@media screen and (max-width: 767px) {
    #job .sub_contents.overview {
        margin: 5rem auto 0
    }
}

#jinzai {
    position: relative
}

@media screen and (max-width: 767px) {
    #jinzai #visual_area {
        padding: 5rem 0 3.2rem !important
    }
}

@media screen and (max-width: 767px) {
    #jinzai #visual_area .text_area {
        margin: 5.95rem auto 0
    }
}

#jinzai #visual_area .text_area .btn_area {
    width: 15.1rem
}

#jinzai .sub_contents.overview .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 5rem;
    margin: 4rem auto 0;
    padding: 0 0 4.65rem;
    width: 66rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.overview .box {
        display: block;
        margin: 3rem auto 0;
        padding: 0 0 4.8rem;
        width: 18.1rem
    }
}

#jinzai .sub_contents.overview .sub_contents_box {
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.overview .sub_contents_box {
        margin: 0 auto 0;
        width: 18.1rem
    }

    #jinzai .sub_contents.overview .sub_contents_box+.sub_contents_box {
        margin: 3rem auto 0
    }

    #jinzai .sub_contents.overview .sub_contents_box+.sub_contents_box .image {
        margin: 1.6rem auto 0
    }
}

#jinzai .sub_contents.overview .sub_contents_box h4.title {
    font-size: 1.6rem;
    letter-spacing: .12em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.overview .sub_contents_box h4.title {
        margin: 1.6rem 0 0;
        font-size: 1.2rem;
        line-height: 1.6
    }
}

#jinzai .sub_contents.overview .sub_contents_box .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.overview .sub_contents_box .body {
        letter-spacing: .08em
    }
}

#jinzai .sub_contents.overview .sub_contents_box .image {
    margin: 2rem 0 0;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.overview .sub_contents_box .image {
        margin: 0 auto 0
    }
}

#jinzai .sub_contents.merit {
    margin: 0 auto 0;
    padding: 3.35rem 0 15rem;
    background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#F1EDE9));
    background: linear-gradient(180deg, #FEFEFE 0%, #F1EDE9 100%)
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit {
        padding: 0 0 2rem
    }
}

#jinzai .sub_contents.merit.active .merit_image ul.list li {
    opacity: 1
}

#jinzai .sub_contents.merit.active .merit_image ul.list li .circle .progress {
    -webkit-animation: progress-animation 1s linear .5s 1 forwards;
    animation: progress-animation 1s linear .5s 1 forwards
}

#jinzai .sub_contents.merit.active .merit_image ul.list li:nth-child(2) .circle .progress {
    -webkit-animation: progress-animation 1s linear 1.5s 1 forwards;
    animation: progress-animation 1s linear 1.5s 1 forwards
}

#jinzai .sub_contents.merit.active .merit_image ul.list li:nth-child(3) .circle .progress {
    -webkit-animation: progress-animation 1s linear 2.5s 1 forwards;
    animation: progress-animation 1s linear 2.5s 1 forwards
}

#jinzai .sub_contents.merit .merit_image {
    position: absolute;
    top: 3.35rem;
    left: 50%;
    margin: 0 0 0 -12.4rem;
    width: 40.4rem;
    height: 16.1rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image {
        position: relative;
        top: auto;
        left: auto;
        margin: 2rem auto 0;
        width: 18.1rem;
        height: 17.15rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list {
    width: 100%;
    height: 100%
}

#jinzai .sub_contents.merit .merit_image ul.list li {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 16.1rem;
    height: 16.1rem;
    opacity: 0;
    -webkit-transition: 1s linear;
    transition: 1s linear
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li {
        left: 4.2rem;
        width: 9.8rem;
        height: 9.8rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li:nth-child(2) {
    left: 14.65rem;
    -webkit-transition: 1s linear 1s;
    transition: 1s linear 1s
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li:nth-child(2) {
        top: auto;
        bottom: 0;
        left: 0
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li:nth-child(3) {
    left: 29.3rem;
    -webkit-transition: 1s linear 2s;
    transition: 1s linear 2s
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li:nth-child(3) {
        top: auto;
        bottom: 0;
        left: auto;
        right: 0
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li .circle {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 16.1rem;
    height: 16.1rem;
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li .circle {
        width: 10rem;
        height: 10rem
    }

    #jinzai .sub_contents.merit .merit_image ul.list li .circle svg {
        width: 9.8rem;
        height: 9.8rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li .circle .progress {
    --size: 322px;
    --half-size: calc(var(--size) / 2);
    --stroke-width: 0.6px;
    --radius: calc((var(--size) - var(--stroke-width)) / 2);
    --circumference: calc(var(--radius) * pi * 2);
    --dash: calc((var(--progress) * var(--circumference)) / 100)
}

#jinzai .sub_contents.merit .merit_image ul.list li .circle .progress circle {
    cx: var(--half-size);
    cy: var(--half-size);
    r: var(--radius);
    r: 161px;
    stroke-width: var(--stroke-width);
    fill: none;
    stroke-linecap: round
}

#jinzai .sub_contents.merit .merit_image ul.list li .circle .progress circle.bg {
    stroke: rgba(0, 0, 0, 0)
}

#jinzai .sub_contents.merit .merit_image ul.list li .circle .progress circle.fg {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: var(--half-size) var(--half-size);
    transform-origin: var(--half-size) var(--half-size);
    stroke-dasharray: var(--dash) calc(var(--circumference) - var(--dash));
    stroke: #bebebe
}

#jinzai .sub_contents.merit .merit_image ul.list li .eng {
    font-size: 0.6rem;
    font-weight: 300;
    letter-spacing: .1em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li .eng {
        font-size: 0.4rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li .num {
    margin: 0.6rem 0 0;
    font-size: 2.4rem;
    font-weight: 300;
    letter-spacing: .04em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li .num {
        margin: 0.4rem 0 0;
        font-size: 1.45rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li .line {
    margin: 0.6rem auto 0;
    width: 1rem;
    height: 1px;
    background-color: #b4855c
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li .line {
        margin: 0.4rem 0 0;
        width: 0.6rem
    }
}

#jinzai .sub_contents.merit .merit_image ul.list li .title {
    margin: 0.6rem auto 0;
    font-size: 0.8rem;
    letter-spacing: .2em;
    line-height: 1.6;
    text-align: center
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .merit_image ul.list li .title {
        margin: 0.4rem 0 0;
        font-size: 0.6rem;
        letter-spacing: .12em;
        line-height: 1.9
    }
}

#jinzai .sub_contents.merit .job_list_area {
    position: absolute;
    bottom: -5rem;
    left: 50%;
    z-index: 2;
    margin: 0 0 0 -33rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.merit .job_list_area {
        margin: 0 0 0 -9.05rem
    }
}

#jinzai .link_area {
    padding: 10rem 0 5rem
}

@media screen and (max-width: 767px) {
    #jinzai .link_area {
        padding: 9rem 0 4rem
    }
}

#jinzai .link_area .bg_area .bg {
    background: url(../images/jinzai/link_area_bg.png) center top no-repeat;
    background-size: 100% auto
}

@media screen and (max-width: 767px) {
    #jinzai .link_area .bg_area .bg {
        background: url(../images/jinzai/link_area_bg_sp.png) center bottom no-repeat;
        background-size: 100% auto
    }
}

#jinzai .sub_contents.flow {
    margin: 0 auto 0;
    padding: 6rem 0 0
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow {
        padding: 5rem 0 0
    }
}

#jinzai .sub_contents.flow .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5rem;
    margin: 4rem auto 0
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .box {
        display: block;
        margin: 2rem auto 0
    }
}

#jinzai .sub_contents.flow .flow {
    width: 30.5rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow {
        margin: 0 auto 0;
        width: 18.1rem
    }
}

#jinzai .sub_contents.flow .flow .flow_title_area {
    position: relative
}

#jinzai .sub_contents.flow .flow .flow_title_area h4.title {
    font-size: 1.6rem;
    letter-spacing: .12em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .flow_title_area h4.title {
        padding: 1rem 0 0;
        font-size: 1.2rem;
        line-height: 1.6
    }
}

#jinzai .sub_contents.flow .flow .flow_title_area .box_line {
    margin: 1rem 0 0;
    width: 28.5rem;
    height: 1px;
    background-color: #e4e4e4
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .flow_title_area .box_line {
        margin: 1rem 0 0;
        width: 100%
    }
}

#jinzai .sub_contents.flow .flow .flow_title_area span.arr {
    position: absolute;
    top: 1rem;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1.9rem;
    height: 1.9rem;
    border: 1px solid #b4855c;
    border-radius: 50%;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    #jinzai .sub_contents.flow .flow .flow_title_area span.arr {
        display: none
    }
}

#jinzai .sub_contents.flow .flow .flow_title_area span.arr span.ico {
    width: 0.75rem;
    height: 0.4rem
}

#jinzai .sub_contents.flow .flow .flow_area {
    margin: 2rem auto 0
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .flow_area {
        padding: 0 0 4rem
    }
}

#jinzai .sub_contents.flow .flow .flow_area h5.title {
    font-size: 1rem;
    letter-spacing: .12em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .flow_area h5.title {
        line-height: 1.6
    }
}

#jinzai .sub_contents.flow .flow .flow_area ul.flow_list {
    margin: 1.2rem 0 0
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .flow_area ul.flow_list {
        margin: 1.6rem auto 0
    }
}

@media print,
screen and (min-width: 768px) {
    #jinzai .sub_contents.flow .flow .pulldown_inner {
        display: block !important;
        height: auto !important
    }
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.flow .flow .pulldown_inner {
        display: none
    }
}

#jinzai .sub_contents.case {
    margin: 8rem auto 0;
    padding: 0 0 2rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case {
        margin: 4.6rem auto 0;
        padding: 0 0 2.7rem
    }
}

#jinzai .sub_contents.case .slider_btn_area {
    position: absolute;
    top: 0;
    left: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 0 23rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case .slider_btn_area {
        top: 1rem;
        left: auto;
        right: 1.3rem;
        margin: 0 auto 0
    }
}

#jinzai .sub_contents.case .slider_btn_area .slider_btn {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 0;
    width: 4rem;
    height: 4rem;
    border: 1px solid #e4e4e4;
    border-radius: 50%
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case .slider_btn_area .slider_btn {
        width: 2.6rem;
        height: 2.6rem
    }
}

#jinzai .sub_contents.case .slider_btn_area .slider_btn+.slider_btn {
    margin: 0 0 0 2rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case .slider_btn_area .slider_btn+.slider_btn {
        margin: 0 0 0 1rem
    }
}

#jinzai .sub_contents.case .slider_btn_area .slider_btn::after {
    display: none
}

@media print,
screen and (min-width: 768px) {
    #jinzai .sub_contents.case .slider_btn_area .slider_btn {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }

    #jinzai .sub_contents.case .slider_btn_area .slider_btn:hover {
        opacity: .6
    }
}

#jinzai .sub_contents.case .slider_btn_area .slider_btn .ico {
    width: 0.6rem;
    height: 1.05rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case .slider_btn_area .slider_btn .ico {
        width: 0.4rem;
        height: 0.7rem
    }
}

#jinzai .sub_contents.case #jinzai_case_slider {
    margin: 3.25rem auto 0
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider {
        margin: 3.6rem auto 0
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case {
    margin: 0 0.5rem;
    padding: 2.6rem;
    width: 37.3rem;
    height: auto;
    background-color: #faf9f7;
    border-radius: .2rem
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case {
        margin: 0 0.3rem;
        padding: 1rem 1.6rem;
        width: 17.1rem
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case .title_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0 0.8rem;
    border-bottom: 1px solid #bebebe
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case .title_area {
        padding: 0 0 1rem
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case .title_area .num_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 2.9rem
}

#jinzai .sub_contents.case #jinzai_case_slider .case .title_area .num_area .eng {
    font-size: 0.6rem;
    font-weight: 300;
    letter-spacing: .1em;
    line-height: 1
}

#jinzai .sub_contents.case #jinzai_case_slider .case .title_area .num_area .num {
    margin: 0.2rem 0 0;
    font-size: 2.4rem;
    font-weight: 200;
    line-height: 1
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case .title_area .num_area .num {
        font-size: 2rem
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case .title_area h4.title {
    margin: 0 0 0 1.75rem;
    font-size: 1.3rem;
    letter-spacing: .12em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case .title_area h4.title {
        margin: 0 0 0 0.6rem;
        font-size: 1rem;
        line-height: 1.4
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case .problem {
    margin: 0.6rem auto 0;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case .problem {
        margin: 1rem auto 0;
        font-size: 0.7rem;
        line-height: 1.9
    }
}

#jinzai .sub_contents.case #jinzai_case_slider .case .answer {
    margin: 1.2rem auto 0;
    padding: 1.2rem 1.6rem;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8;
    border-radius: .2rem;
    background-color: #fff
}

@media screen and (max-width: 767px) {
    #jinzai .sub_contents.case #jinzai_case_slider .case .answer {
        margin: 0.6rem auto 0;
        padding: 0.6rem;
        font-size: 0.7rem;
        line-height: 1.9
    }
}

.company #container {
    background-color: #faf9f7
}

#company {
    padding: 0;
    position: relative;
    background-color: #fff
}

@media screen and (max-width: 767px) {
    #company #visual_area {
        padding-bottom: 5.5rem !important
    }
}

#company .sub_contents.philosophy {
    padding: 8rem 0 0
}

@media screen and (max-width: 767px) {
    #company .sub_contents.philosophy {
        padding: 5rem 0 0
    }
}

#company .sub_contents .box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 6rem auto 0;
    gap: 0 5.85rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents .box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 3rem auto 0;
        gap: 2rem 0
    }
}

@media screen and (max-width: 767px) {
    #company .sub_contents .box .text_area {
        text-align: center
    }
}

#company .sub_contents .box .text_area h4.title {
    font-size: 3rem;
    line-height: 1.8;
    letter-spacing: .4em
}

@media screen and (max-width: 767px) {
    #company .sub_contents .box .text_area h4.title {
        margin: 0 auto 0;
        width: 12.5rem
    }
}

#company .sub_contents .box .text_area .body {
    margin: 2rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #company .sub_contents .box .text_area .body {
        margin: 1rem 0 0;
        line-height: 2.4;
        letter-spacing: .08em
    }
}

#company .sub_contents .box .logo_area {
    width: 14rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents .box .logo_area {
        margin: 2rem 0 0;
        width: 8.75rem
    }
}

#company .sub_contents .box .left,
#company .sub_contents .box .right {
    width: calc((100% - 5.85rem)/2)
}

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

    #company .sub_contents .box .left,
    #company .sub_contents .box .right {
        width: 100%
    }
}

#company .sub_contents .box .left h4.title,
#company .sub_contents .box .right h4.title {
    font-size: 1.6rem;
    line-height: 1.8;
    letter-spacing: .12em
}

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

    #company .sub_contents .box .left h4.title,
    #company .sub_contents .box .right h4.title {
        font-size: 1rem;
        line-height: 1.6
    }
}

#company .sub_contents .box .left .body,
#company .sub_contents .box .right .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

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

    #company .sub_contents .box .left .body,
    #company .sub_contents .box .right .body {
        letter-spacing: .08em
    }
}

#company .sub_contents.philosophy .box {
    width: 43.25rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents.philosophy .box {
        width: 18.1rem
    }
}

#company .sub_contents.service {
    margin: 18.9rem auto 0
}

@media screen and (max-width: 767px) {
    #company .sub_contents.service {
        margin: 8rem auto 0
    }
}

#company .sub_contents.service .box {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 4rem auto 0;
    width: 66rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents.service .box {
        margin: 3rem auto 0;
        width: 18.1rem
    }
}

#company .sub_contents.company {
    margin: 8rem auto 0;
    padding: 6rem 0;
    background-color: #faf9f7
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company {
        margin: 4rem auto 0;
        padding: 3rem 0
    }
}

#company .sub_contents.company table.data_list {
    margin: 6rem auto 0;
    width: 45rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list {
        margin: 3rem auto 0;
        width: 18.1rem
    }
}

#company .sub_contents.company table.data_list tr {
    border-bottom: 1px solid #e4e4e4
}

#company .sub_contents.company table.data_list th {
    padding: 1rem 0;
    width: 6rem;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.9;
    letter-spacing: .04em;
    vertical-align: top
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list th {
        width: 4rem
    }
}

#company .sub_contents.company table.data_list td {
    padding: 1rem 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list td {
        letter-spacing: .08em
    }
}

#company .sub_contents.company table.data_list td dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%
}

#company .sub_contents.company table.data_list td dl dt {
    position: relative;
    width: 3.55rem;
    padding-bottom: 0.45rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list td dl dt {
        width: 3.3rem
    }
}

#company .sub_contents.company table.data_list td dl dt span {
    position: relative;
    z-index: 1;
    display: block;
    background-color: #faf9f7
}

#company .sub_contents.company table.data_list td dl dt:not(:last-of-type):after {
    content: "";
    position: absolute;
    width: 1px;
    height: 100%;
    background-color: #e4e4e4;
    bottom: 0;
    left: 1.2rem;
    right: 0
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list td dl dt:not(:last-of-type):after {
        left: 1.05rem
    }
}

#company .sub_contents.company table.data_list td dl dd {
    width: calc(100% - 3.55rem);
    padding-bottom: 0.45rem
}

@media screen and (max-width: 767px) {
    #company .sub_contents.company table.data_list td dl dd {
        width: calc(100% - 3.3rem)
    }
}

#company .sub_contents.company table.data_list td ul.list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 1.6rem
}

#company .sub_contents.company table.data_list td ul.list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0 0.2rem
}

#company .sub_contents.company table.data_list td ul.list a {
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    #company .sub_contents.company table.data_list td ul.list a {
        cursor: pointer
    }
}

#company .sub_contents.company table.data_list td ul.list a.over {
    opacity: .7
}

#company .sub_contents.company table.data_list td .btn_area {
    margin: 1.6rem 0 0;
    width: 11.5rem
}

#company .sub_contents.company table.data_list .ico_pdf {
    display: block;
    width: 0.6rem;
    height: 0.65rem
}

.post-type-archive-address #container {
    background-color: #faf9f7
}

#address {
    padding: 0;
    position: relative;
    background-color: #fff
}

@media screen and (max-width: 767px) {
    #address #visual_area {
        padding-bottom: 7.45rem !important
    }
}

#address .btn_area {
    margin: 1rem 0 0;
    width: 12.5rem;
    height: 2.4rem
}

@media screen and (max-width: 767px) {
    #address .btn_area {
        width: 11.15rem
    }
}

#address .btn_area a {
    gap: 0 0.7rem;
    font-weight: 400;
    font-size: 0.7rem;
    line-height: 1.6;
    letter-spacing: 0
}

#address .btn_area a.over span.text_ico svg circle {
    fill: #c49770
}

#address .btn_area a span.text_ico {
    display: block;
    position: relative;
    margin: 0 0 0.15rem 0;
    width: 0.65rem;
    height: 0.85rem
}

#address .btn_area a span.text_ico svg circle {
    -webkit-transition: .3s linear;
    transition: .3s linear
}

#address .btn_area a span.text_eng {
    position: relative;
    margin: 0 1.1rem 0 0
}

#address #address_list {
    position: relative;
    margin: 0 auto;
    width: 55rem;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end #address #address_list {
    opacity: 1
}

@media screen and (max-width: 767px) {
    #address #address_list {
        width: 18.1rem
    }
}

#address #address_list ul.list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 4rem 0;
    margin-bottom: 70px;
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list {
        gap: 3rem 0
    }
}

#address #address_list ul.list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 2rem
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list li {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 1.6rem 0
    }
}

#address #address_list ul.list li .map_area {
    width: 19rem;
    height: 14rem
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list li .map_area {
        width: 100%
    }
}

#address #address_list ul.list li .map_area iframe {
    width: 100%;
    height: 100%
}

#address #address_list ul.list li .text_area {
    width: calc(100% - 2rem - 19rem);
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list li .text_area {
        width: 100%;
        font-size: 0.6rem;
        letter-spacing: .12em
    }
}

#address #address_list ul.list li .text_area h3.title {
    margin: 0 0 0.5rem 0;
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: .12em
}

#address #address_list ul.list li .text_area .title_line {
    margin: 0.6rem 0 0;
    width: 100%;
    height: 1px;
    background-color: #e4e4e4
}

#address #address_list ul.list li .text_area .address {
    margin: 1rem 0 0
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list li .text_area .address {
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

#address #address_list ul.list li .text_area .phone_area {
    margin: 0.4rem 0 0
}

@media screen and (max-width: 767px) {
    #address #address_list ul.list li .text_area .phone_area {
        font-size: 0.7rem;
        letter-spacing: .16em
    }
}

#address #other_address_list {
    position: relative;
    margin: 6rem auto 0;
    padding: 6rem 0;
    background-color: #faf9f7
}

@media screen and (max-width: 767px) {
    #address #other_address_list {
        margin: 4rem auto 0;
        padding: 4rem 0 3rem
    }
}

#address #other_address_list .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 2.5rem;
    margin: 0 auto;
    width: 55rem
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 0 4rem;
        width: 18.1rem
    }
}

#address #other_address_list .box .pin-spacer {
    padding: 0 1.5rem 0 0;
    width: 12.25rem
}

@media print,
screen and (min-width: 768px) {
    #address #other_address_list .box .list_area .inner {
        height: 90vh;
        overflow-y: auto;
        overflow-x: hidden;
        width: 12.25rem
    }

    #address #other_address_list .box .list_area .inner::-webkit-scrollbar {
        width: 3px
    }

    #address #other_address_list .box .list_area .inner::-webkit-scrollbar-track {
        background-color: rgba(0, 0, 0, 0)
    }

    #address #other_address_list .box .list_area .inner::-webkit-scrollbar-thumb {
        background-color: #b4855c;
        border-radius: 3px
    }
}

#address #other_address_list .box .list_area .list_title {
    width: 10.75rem;
    font-size: 1.6rem;
    line-height: 1.8;
    letter-spacing: .12em
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .list_title {
        width: 100%;
        font-size: 1.2rem;
        line-height: 1.6
    }
}

#address #other_address_list .box .list_area .line {
    margin: 0.4rem 0 0;
    width: 10.75rem;
    height: 1px;
    background-color: #b4855c
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .line {
        width: 100%
    }
}

#address #other_address_list .box .list_area .map_area_list {
    margin: 2.5rem 0 0;
    width: 10.75rem
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 1.8rem;
        width: 100%;
        border-bottom: 1px solid #e4e4e4
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area {
    border-bottom: 1px solid #e4e4e4
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area {
        border: none
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area .map_area_title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.4rem 0;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area .map_area_title {
        display: block;
        padding: 0
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area .map_area_title .title {
    font-size: 1rem;
    line-height: 1.8;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area .map_area_title .title {
        font-size: 0.7rem;
        line-height: 1.9;
        letter-spacing: .08em
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area .map_area_title span.ico {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 0.8rem;
    height: 0.8rem;
    border: 1px solid #b4855c;
    border-radius: 0.4rem
}

#address #other_address_list .box .list_area .map_area_list .map_area .map_area_title span.ico span.arr {
    display: block;
    width: 0.4rem;
    height: 0.4rem
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area .map_area_title span.ico {
        display: none
    }
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area .map_area_title.curr {
        border-bottom: 0.1rem solid #b4855c
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area .address_list {
    padding: 0.5rem 0 0.5rem;
    text-align: right
}

#address #other_address_list .box .list_area .map_area_list .map_area .address_list ul.list li {
    padding: 0 0 0.4rem
}

#address #other_address_list .box .list_area .map_area_list .map_area .address_list ul.list li a {
    display: inline-block;
    font-size: 0.6rem;
    line-height: 1.9;
    letter-spacing: .16em
}

#address #other_address_list .box .list_area .map_area_list .map_area .address_list.pulldown_inner {
    display: none
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .map_area_list .map_area .address_list.pulldown_inner {
        display: none !important
    }
}

#address #other_address_list .box .list_area .map_area_list .map_area.open span.ico span.arr {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .list_area .address_list.sp {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        gap: 0 1rem;
        margin: 1.2rem 0 0;
        padding: 0 0 0.5rem;
        overflow-x: scroll;
        overflow-y: hidden
    }

    #address #other_address_list .box .list_area .address_list.sp .address {
        width: auto;
        -ms-flex-negative: 0;
        flex-shrink: 0
    }

    #address #other_address_list .box .list_area .address_list.sp .address.hide {
        display: none
    }

    #address #other_address_list .box .list_area .address_list.sp .address a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        gap: 0 0.4rem
    }

    #address #other_address_list .box .list_area .address_list.sp .address a span.text {
        font-size: 0.7rem;
        line-height: 1.9;
        letter-spacing: .08em
    }

    #address #other_address_list .box .list_area .address_list.sp .address a span.ico {
        display: block;
        width: 0.3rem;
        height: 0.3rem
    }
}

#address #other_address_list .box .data_area {
    width: calc(100% - 2.5rem - 10.75rem)
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area {
        width: 100%
    }
}

#address #other_address_list .box .data_area ul.list li {
    padding: 2rem 0;
    border-bottom: 1px solid #e4e4e4
}

#address #other_address_list .box .data_area ul.list li:last-of-type {
    padding: 2rem 0 0;
    border: none
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area ul.list li:last-of-type {
        padding: 3rem 0 0
    }
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area ul.list li {
        padding: 3rem 0
    }
}

#address #other_address_list .box .data_area h3.title {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.8;
    letter-spacing: .12em;
    border-bottom: 1px solid #f6f6f6
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area h3.title {
        font-size: 1.2rem
    }
}

#address #other_address_list .box .data_area .address {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area .address {
        letter-spacing: .08em
    }
}

#address #other_address_list .box .data_area .phone_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 1.6rem;
    margin: 0.4rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #address #other_address_list .box .data_area .phone_area {
        letter-spacing: .08em
    }
}

#news {
    position: relative
}

#news #news_list {
    position: relative;
    margin: 0 auto;
    width: 55rem
}

@media screen and (max-width: 767px) {
    #news #news_list {
        width: 18.1rem
    }
}

#news #news_list>ul.list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 3rem 1.6rem
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 1.6rem 0
    }
}

#news #news_list>ul.list li {
    width: 17.25rem;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media print,
screen and (min-width: 768px) {
    #news #news_list>ul.list li:hover .image img {
        -webkit-transform: scale(1.05);
        transform: scale(1.05)
    }
}

#news #news_list>ul.list li .image {
    border-radius: .2rem;
    overflow: hidden
}

@media print,
screen and (min-width: 768px) {
    #news #news_list>ul.list li .image img {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .image {
        width: 8.5rem
    }
}

#news #news_list>ul.list li .text_area {
    margin: 1rem 0 0
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area {
        margin: 0 0 0 1rem;
        width: 8.55rem
    }
}

#news #news_list>ul.list li .text_area .date_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 0.6rem;
    -moz-column-gap: 0.6rem;
    column-gap: 0.6rem
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area .date_area {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-column-gap: 0.3rem;
        -moz-column-gap: 0.3rem;
        column-gap: 0.3rem
    }
}

#news #news_list>ul.list li .text_area .date_area .date {
    font-size: 0.8rem;
    font-weight: 400;
    letter-spacing: .2em
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area .date_area .date {
        font-size: 0.6rem;
        font-weight: 300
    }
}

#news #news_list>ul.list li .text_area .date_area .category {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0.8rem;
    width: auto !important;
    height: 1.05rem;
    border-radius: 0.525rem;
    font-size: 0.6rem;
    font-weight: 300;
    letter-spacing: .2em;
    line-height: 1.4;
    color: #fff
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area .date_area .category {
        margin: 0.3rem 0 0;
        height: 1.1rem;
        font-size: 0.5rem
    }
}

@media print,
screen and (min-width: 768px) {
    #news #news_list>ul.list li .text_area .line {
        display: none
    }
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area .line {
        margin: 0.5rem 0 0;
        height: 0.039rem;
        width: 1.3rem;
        background-color: #e4e4e4
    }
}

#news #news_list>ul.list li .text_area h4.title {
    margin: 0.5rem 0 0;
    font-size: 0.8rem;
    line-height: 1.8;
    letter-spacing: .04em
}

@media screen and (max-width: 767px) {
    #news #news_list>ul.list li .text_area h4.title {
        margin: 0.25rem 0 0;
        font-size: 0.7rem;
        letter-spacing: .12em;
        line-height: 1.6;
        max-height: 3.5rem;
        display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical
    }
}

#news #news_list>ul.list li .body {
    display: none
}

#news #news_list .pagenavi_area {
    margin: 3rem auto 0
}

@media screen and (max-width: 767px) {
    #news #news_list .pagenavi_area {
        margin: 2rem auto 0
    }
}

#news #news_list .pagenavi_area nav.pagination ul.list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-column-gap: 1rem;
    -moz-column-gap: 1rem;
    column-gap: 1rem
}

@media screen and (max-width: 767px) {
    #news #news_list .pagenavi_area nav.pagination ul.list {
        -webkit-column-gap: 0.7rem;
        -moz-column-gap: 0.7rem;
        column-gap: 0.7rem
    }
}

#news #news_list .pagenavi_area nav.pagination ul.list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border: 1px solid #e4e4e4;
    border-radius: 1.5rem
}

@media screen and (max-width: 767px) {
    #news #news_list .pagenavi_area nav.pagination ul.list li {
        width: 2.4rem;
        height: 2.4rem
    }
}

#news #news_list .pagenavi_area nav.pagination ul.list li span.num,
#news #news_list .pagenavi_area nav.pagination ul.list li a {
    font-size: 0.9rem;
    font-weight: 300;
    line-height: 1;
    letter-spacing: .04em
}

#news #news_list .pagenavi_area nav.pagination ul.list li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 1.5rem
}

@media print,
screen and (min-width: 768px) {
    #news #news_list .pagenavi_area nav.pagination ul.list li a {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }

    #news #news_list .pagenavi_area nav.pagination ul.list li a.over {
        background: #b4855c;
        color: #fff
    }
}

#news #news_list .pagenavi_area nav.pagination ul.list li.index {
    background: #b4855c
}

#news #news_list .pagenavi_area nav.pagination ul.list li.index span.num,
#news #news_list .pagenavi_area nav.pagination ul.list li.index a {
    color: #fff
}

#news #news_list .pagenavi_area nav.pagination ul.list li.btn_arr .ico {
    display: block;
    width: 0.35rem;
    height: 0.6rem
}

@media print,
screen and (min-width: 768px) {
    #news #news_list .pagenavi_area nav.pagination ul.list li.btn_arr {
        -webkit-transition: .3s linear;
        transition: .3s linear
    }

    #news #news_list .pagenavi_area nav.pagination ul.list li.btn_arr a.over path {
        stroke: #fff
    }
}

#popup_news {
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -100;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: rgba(34, 34, 34, .6);
    opacity: 0;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media screen and (max-width: 767px) {
    #popup_news {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 3.5rem 0 0
    }
}

#popup_news.on {
    z-index: 1000;
    pointer-events: auto
}

#popup_news.view {
    opacity: 1
}

#popup_news .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#popup_news .inner {
    position: relative;
    padding: 3rem 1rem 3rem 2.5rem;
    width: 55rem;
    height: calc(100vh - 8.8rem);
    background-color: #fff
}

@media screen and (max-width: 767px) {
    #popup_news .inner {
        padding: 2rem 0.5rem 1rem 1rem;
        margin: 0 auto;
        width: 18.1rem;
        height: calc(100vh - 9.4rem)
    }
}

#popup_news .inner .btn_close {
    position: absolute;
    top: -3.4rem;
    right: 0;
    width: 2.4rem;
    height: 2.4rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    #popup_news .inner .btn_close {
        cursor: pointer
    }

    #popup_news .inner .btn_close:hover {
        opacity: .7
    }
}

@media screen and (max-width: 767px) {
    #popup_news .inner .btn_close {
        top: -2.4rem;
        width: 1.4rem;
        height: 1.4rem
    }
}

#popup_news .inner .news_data_area {
    position: relative;
    padding: 0 3rem 0 0;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area {
        padding: 0 1rem 0 0
    }
}

#popup_news .inner .news_data_area .simplebar-track {
    width: 0.15rem
}

@media print,
screen and (min-width: 768px) {
    #popup_news .inner .news_data_area .simplebar-track:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0.05rem;
        width: 1px;
        height: 100%;
        background-color: #f6f6f6
    }
}

#popup_news .inner .news_data_area .simplebar-scrollbar:before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 1;
    background-color: #b4855c
}

#popup_news .inner .news_data_area .simplebar-content-wrapper {
    scrollbar-width: auto;
    -ms-overflow-style: auto
}

#popup_news .inner .news_data_area .simplebar-content-wrapper::-webkit-scrollbar,
#popup_news .inner .news_data_area .simplebar-hide-scrollbar::-webkit-scrollbar {
    display: initial;
    width: initial;
    height: initial
}

#popup_news .inner .news_data_area .image {
    display: none
}

#popup_news .inner .news_data_area .text_area .date_area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 0.6rem;
    -moz-column-gap: 0.6rem;
    column-gap: 0.6rem
}

#popup_news .inner .news_data_area .text_area .date_area .date {
    font-size: 0.8rem;
    font-weight: 300;
    letter-spacing: .2em
}

#popup_news .inner .news_data_area .text_area .date_area .category {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0.8rem;
    height: 1.25rem;
    width: auto !important;
    border-radius: 0.625rem;
    font-size: 0.6rem;
    font-weight: 300;
    letter-spacing: .2em;
    line-height: 1.4;
    color: #fff
}

#popup_news .inner .news_data_area .text_area h4.title {
    position: relative;
    margin: 0.7rem 0 0;
    padding: 0 0 0.7rem 0;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: .04em
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .text_area h4.title {
        font-size: 1rem
    }
}

#popup_news .inner .news_data_area .text_area h4.title:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #bebebe
}

#popup_news .inner .news_data_area .body {
    margin: 2rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .16em;
    word-break: break-all
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .body {
        margin: 1.6rem 0 0;
        letter-spacing: .08em
    }
}

#popup_news .inner .news_data_area .body h1,
#popup_news .inner .news_data_area .body h2,
#popup_news .inner .news_data_area .body h3,
#popup_news .inner .news_data_area .body h4,
#popup_news .inner .news_data_area .body h5 {
    margin: 1.6rem 0 0;
    font-weight: 500
}

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

    #popup_news .inner .news_data_area .body h1,
    #popup_news .inner .news_data_area .body h2,
    #popup_news .inner .news_data_area .body h3,
    #popup_news .inner .news_data_area .body h4,
    #popup_news .inner .news_data_area .body h5 {
        margin: 1.2rem 0 0
    }
}

#popup_news .inner .news_data_area .body h1 {
    position: relative;
    padding: 0 0 0 0.6rem;
    font-size: 0.9rem
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .body h1 {
        font-size: 0.8rem
    }
}

#popup_news .inner .news_data_area .body h1:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0.1rem;
    height: 100%;
    background-color: #b4855c
}

#popup_news .inner .news_data_area .body h2 {
    font-size: 0.85rem
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .body h2 {
        font-size: 0.8rem
    }
}

#popup_news .inner .news_data_area .body h3 {
    font-size: 0.8rem
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .body h3 {
        font-size: 0.75rem
    }
}

#popup_news .inner .news_data_area .body em {
    font-style: italic
}

#popup_news .inner .news_data_area .body img {
    margin: 1.6rem auto 0;
    border-radius: .2rem
}

@media screen and (max-width: 767px) {
    #popup_news .inner .news_data_area .body img {
        margin: 1.2rem auto 0
    }
}

#popup_news .inner .news_data_area .category_bt {
    display: none
}

.post-type-archive-heroproject #container {
    background-color: #faf9f7
}

#heroproject {
    padding: 0;
    position: relative;
    background-color: #fff
}

#heroproject #visual_area {
    padding-bottom: 7.5rem !important
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area {
        padding-bottom: 5.35rem !important
    }
}

#heroproject #visual_area .contents_header_box {
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end #heroproject #visual_area .contents_header_box {
    opacity: 1
}

@media print,
screen and (min-width: 768px) {
    #heroproject #visual_area .contents_header_box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 6rem auto 0;
        width: 66rem
    }
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area .contents_header_box {
        margin: 5rem auto 0;
        width: 18.1rem
    }
}

#heroproject #visual_area .contents_header_box .text_area {
    margin: 0 0 0 5.5rem;
    width: 35rem
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area .contents_header_box .text_area {
        margin: 0 0 3rem 0;
        width: 18.1rem
    }
}

#top_heroproject .box .text_area h3.title {
    display: inline-block;
    text-align: left;
}

#heroproject #visual_area .contents_header_box .text_area h3.title {
    font-size: 1.6rem;
    line-height: 1.8;
    letter-spacing: .16em
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area .contents_header_box .text_area h3.title {
        font-size: 1.2rem;
        line-height: 2.2
    }
}

#heroproject #visual_area .contents_header_box .text_area .body {
    margin: 2.3rem 0 0;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1.8
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area .contents_header_box .text_area .body {
        font-size: 0.7rem;
        line-height: 1.9;
        letter-spacing: .08em
    }
}

#heroproject #visual_area .contents_header_box .image {
    width: 25.5rem;
    border-radius: .2rem;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    #heroproject #visual_area .contents_header_box .image {
        width: 100%
    }
}

#heroproject .sub_contents.archive_area {
    position: relative;
    padding: 6rem 0 7.25rem;
    width: 100%;
    background-color: #faf9f7
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area {
        padding: 2.65rem 0 3rem
    }
}

#heroproject .sub_contents.archive_area>.box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 4rem auto 0;
    width: 55rem
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area>.box {
        display: block;
        margin: 1.3rem auto 0;
        width: 18.1rem
    }
}

#heroproject .sub_contents.archive_area .nav_area {
    position: relative;
    width: 12.75rem
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .nav_area {
        width: 100%
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive {
    position: relative
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .nav_area .archive.open .nav_button span.ico {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .nav_area .archive.open .archive_content {
        display: block
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive .nav_button {
    position: relative;
    padding: 0.85rem 0;
    border-bottom: 1px solid #e4e4e4;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    #heroproject .sub_contents.archive_area .nav_area .archive .nav_button {
        cursor: pointer
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive .nav_button.over {
    opacity: .7
}

#heroproject .sub_contents.archive_area .nav_area .archive .nav_button .year {
    font-size: 0.6rem;
    letter-spacing: .16em;
    line-height: 1.9
}

#heroproject .sub_contents.archive_area .nav_area .archive .nav_button .ip_name {
    margin: 0.4rem 0 0;
    width: 11.4rem;
    font-size: 1rem;
    letter-spacing: .16em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .nav_area .archive .nav_button .ip_name {
        width: 15.9rem;
        line-height: 1.9;
        letter-spacing: .08em
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive .nav_button span.ico {
    position: absolute;
    top: 50%;
    right: 0;
    margin: -0.425rem 0 0;
    width: 0.8rem;
    height: 0.85rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .nav_area .archive .nav_button span.ico {
        margin: -0.6rem 0 0;
        width: 1.2rem;
        height: 1.2rem;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive .archive_content {
    display: none;
    padding: 0.8rem 0 2.3rem;
    border-bottom: 1px solid #e4e4e4
}

@media print,
screen and (min-width: 768px) {
    #heroproject .sub_contents.archive_area .nav_area .archive .archive_content {
        display: none !important
    }
}

#heroproject .sub_contents.archive_area .nav_area .archive .archive_content .image {
    width: 100%;
    border-radius: .2rem;
    overflow: hidden
}

#heroproject .sub_contents.archive_area .nav_area .archive .archive_content h5.title {
    margin: 1.2rem 0 0;
    font-size: 1.2rem;
    line-height: 1.4;
    letter-spacing: .17em
}

#heroproject .sub_contents.archive_area .nav_area .archive .archive_content .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    line-height: 1.9;
    letter-spacing: .08em
}

#heroproject .sub_contents.archive_area .btn_area {
    margin: 2rem 0 0;
    width: 15.65rem
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .btn_area {
        margin: 2rem auto 0;
        width: 13.9rem
    }
}

#heroproject .sub_contents.archive_area .btn_area a.over span.ico .rect {
    fill: #c49770
}

#heroproject .sub_contents.archive_area .btn_area span.text {
    margin: 0 1rem 0 0;
    line-height: 1.4
}

@media screen and (max-width: 767px) {
    #heroproject .sub_contents.archive_area .btn_area span.text {
        margin: 0 1.5rem 0 0;
        font-size: 0.7rem
    }
}

#heroproject .sub_contents.archive_area .btn_area span.ico {
    width: 0.75rem;
    height: 0.75rem
}

#heroproject .sub_contents.archive_area .btn_area span.ico .rect {
    -webkit-transition: .3s linear;
    transition: .3s linear
}

#heroproject .sub_contents.archive_area #archive_list {
    margin: 0 0 0 4rem;
    width: 38.25rem
}

#heroproject .sub_contents.archive_area #archive_list .archive {
    position: relative;
    display: none;
    opacity: 0;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

#heroproject .sub_contents.archive_area #archive_list .archive.on {
    display: block
}

#heroproject .sub_contents.archive_area #archive_list .archive.view {
    opacity: 1
}

#heroproject .sub_contents.archive_area #archive_list .archive.current {
    display: block;
    opacity: 1
}

#heroproject .sub_contents.archive_area #archive_list .archive .image {
    width: 100%;
    border-radius: .2rem;
    overflow: hidden
}

#heroproject .sub_contents.archive_area #archive_list .archive h5.title {
    margin: 2rem 0 0;
    font-size: 1.6rem;
    letter-spacing: .17em;
    line-height: 1.4
}

#heroproject .sub_contents.archive_area #archive_list .archive .body {
    margin: 1rem 0 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

#heroproject .sub_contents.archive_area #archive_list .archive .body p+p {
    margin: 1.5rem 0 0
}

main#contact {
    position: relative
}

main#contact .bg_wrapper {
    position: fixed;
    top: 17rem
}

@media screen and (max-width: 767px) {
    main#contact .bg_wrapper {
        top: 24.65rem
    }
}

main#contact #visual_area .bg_wrapper {
    top: 17rem;
    width: 0% !important;
    -webkit-transition: 1.2s ease 2.2s;
    transition: 1.2s ease 2.2s
}

@media screen and (max-width: 767px) {
    main#contact #visual_area .bg_wrapper {
        top: 24.65rem
    }
}

main#contact #visual_area.thanks .bg_wrapper {
    width: 100% !important
}

main#contact #input_area {
    position: relative
}

main#contact #input_area.hide {
    display: none
}

main#contact #confirm_area {
    display: none;
    position: relative
}

main#contact #confirm_area.view {
    display: block
}

main#contact #thanks_area {
    pointer-events: none;
    position: absolute;
    opacity: 0;
    -webkit-transition: opacity .6s linear 1s;
    transition: opacity .6s linear 1s
}

@media screen and (max-width: 767px) {
    main#contact #thanks_area {
        padding: 0 0 1rem
    }
}

main#contact #thanks_area.view {
    position: relative;
    pointer-events: auto;
    opacity: 1
}

main#contact #visual_area {
    padding: 8rem 0 0 !important
}

@media screen and (max-width: 767px) {
    main#contact #visual_area {
        padding: 5rem 0 0 !important
    }
}

main#contact .main_area {
    margin: 4rem auto 0;
    width: 45rem;
    opacity: 0;
    -webkit-transition: 1.2s ease .8s;
    transition: 1.2s ease .8s
}

.end main#contact .main_area {
    opacity: 1
}

@media screen and (max-width: 767px) {
    main#contact .main_area {
        margin: 3rem auto 0;
        width: 18.1rem
    }
}

main#contact .main_area .lead_area {
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#contact .main_area .lead_area {
        letter-spacing: .08em
    }
}

main#contact .main_area .lead_area a {
    color: #b4855c;
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {
    main#contact .main_area .lead_area a:hover {
        text-decoration: none
    }
}

main#contact .main_area .confirm_lead_area {
    font-size: 1.2rem;
    letter-spacing: .2em;
    line-height: 1.9;
    text-align: center
}

main#contact .main_area .step_area {
    position: relative;
    margin: 0 auto 0;
    padding: 3rem;
    background-color: #f6f6f6;
    border-radius: .2rem
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area {
        padding: 1.6rem 1rem
    }
}

main#contact .main_area .step_area.step_1 {
    margin: 4rem auto 0
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area.step_1 {
        margin: 3rem auto 0
    }
}

main#contact .main_area .step_area.step_3 {
    padding: 2.5rem 3rem 0 3rem;
    background-color: rgba(0, 0, 0, 0)
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area.step_3 {
        padding: 0.75rem 1rem 0 1rem
    }
}

main#contact .main_area .step_area .hidden_data {
    pointer-events: none;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0
}

main#contact .main_area .step_area .step_no {
    position: absolute;
    top: -1rem;
    left: 3rem;
    font-size: 2.3rem;
    font-weight: 200;
    letter-spacing: .16em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area .step_no {
        top: -0.85rem;
        left: 1rem;
        font-size: 1.6rem
    }
}

main#contact .main_area .step_area .step_title {
    padding: 0 0 0.4rem;
    font-size: 1.2rem;
    letter-spacing: .2em;
    line-height: 1.9;
    border-bottom: 1px solid #e4e4e4
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area .step_title {
        font-size: 1rem
    }
}

main#contact .main_area .step_area .radio_buttons {
    margin: 1.2rem auto 0
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area .radio_buttons {
        margin: 1rem auto 0
    }
}

main#contact .main_area .step_area .radio_buttons .step_radio {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1rem
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area .radio_buttons .step_radio {
        gap: 0.6rem
    }
}

main#contact .main_area .step_area .radio_buttons .step_radio input {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden
}

main#contact .main_area .step_area .radio_buttons .step_radio .wpcf7-list-item {
    margin: 0
}

main#contact .main_area .step_area .radio_buttons .step_radio .wpcf7-list-item-label {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0.6rem 1.1rem;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9;
    background-color: #fff;
    border-radius: .2rem;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media print,
screen and (min-width: 768px) {
    main#contact .main_area .step_area .radio_buttons .step_radio .wpcf7-list-item-label {
        cursor: pointer
    }

    main#contact .main_area .step_area .radio_buttons .step_radio .wpcf7-list-item-label:hover {
        background-color: #b4855c;
        color: #fff
    }
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_area .radio_buttons .step_radio .wpcf7-list-item-label {
        padding: 0.3rem 0.6rem;
        letter-spacing: .08em
    }
}

main#contact .main_area .step_area .radio_buttons .step_radio input:checked+.wpcf7-list-item-label {
    background-color: #b4855c;
    color: #fff
}

main#contact .main_area .step_arr {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto 0;
    height: 4.4rem
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_arr {
        height: 4rem
    }
}

main#contact .main_area .step_arr .step_ico {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1.6rem;
    height: 1.6rem;
    background-color: #b4855c;
    border-radius: 50%
}

main#contact .main_area .step_arr .step_ico span.ico {
    width: 0.7rem;
    height: 0.4rem
}

main#contact .main_area .step_arr .line {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: -1;
    margin: 0 0 0 -0.075rem;
    width: 0.1rem;
    height: 100%;
    background-color: #f6f6f6
}

main#contact .main_area .step_arr .line.long {
    height: 7.5rem
}

@media screen and (max-width: 767px) {
    main#contact .main_area .step_arr .line.long {
        height: 4.7rem
    }
}

main#contact .form_wrapper.entry {
    margin: 1.6rem auto 0;
    width: 39rem
}

@media screen and (max-width: 767px) {
    main#contact .form_wrapper.entry {
        margin: 2rem auto 0;
        width: 16.1rem
    }
}

main#contact .form_area {
    margin: 3rem auto 0
}

@media screen and (max-width: 767px) {
    main#contact .form_area {
        margin: 1.6rem auto 0
    }
}

main#contact .form_area .red {
    color: red
}

main#contact .form_area .inquiry_info {
    text-align: right;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

main#contact .form_area .form_data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 1.6rem auto 0
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data {
        display: block
    }
}

main#contact .form_area .form_data ::-webkit-input-placeholder {
    color: #bebebe
}

main#contact .form_area .form_data ::-moz-placeholder {
    color: #bebebe
}

main#contact .form_area .form_data :-ms-input-placeholder {
    color: #bebebe
}

main#contact .form_area .form_data ::-ms-input-placeholder {
    color: #bebebe
}

main#contact .form_area .form_data ::placeholder {
    color: #bebebe
}

main#contact .form_area .form_data>label {
    width: 11.45rem;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: .04em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data>label {
        display: block;
        margin: 0 0 0.8rem;
        width: 100%;
        line-height: 1
    }
}

main#contact .form_area .form_data .input_area {
    position: relative;
    width: 33.55rem;
    font-size: 0.7rem
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data .input_area {
        width: 100%
    }
}

main#contact .form_area .form_data .input_area.selectbox .wpcf7-form-control-wrap {
    position: relative;
    display: inline-block
}

main#contact .form_area .form_data .input_area.selectbox .wpcf7-form-control-wrap:after {
    pointer-events: none;
    content: "";
    position: absolute;
    top: 1.2rem;
    right: 0.6rem;
    width: 0.5rem;
    height: 0.3rem;
    background: url(../images/common/ico_selectbox.svg) no-repeat;
    background-size: cover
}

main#contact .form_area .form_data .input_area.selectbox.w100 .wpcf7-form-control-wrap {
    display: block
}

main#contact .form_area .form_data .input_area span.text {
    display: inline-block;
    padding: 0 0.25rem;
    font-size: 0.7rem
}

main#contact .form_area .form_data .wpcf7-list-item {
    margin: 0
}

main#contact .form_area .form_data textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    height: 13.35rem;
    border: 1px solid #e4e4e4;
    border-radius: 0.2rem;
    padding: 0.6rem;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9;
    font-family: "Zen Kaku Gothic New", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", YuGothic, "游ゴシック体", "Meiryo", sans-serif
}

main#contact .form_area .form_data input[type=text],
main#contact .form_area .form_data input[type=email],
main#contact .form_area .form_data input[type=tel] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border: 1px solid #e4e4e4;
    border-radius: 0.2rem;
    padding: 0.6rem 0.6rem;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

main#contact .form_area .form_data select {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    border: 1px solid #e4e4e4;
    border-radius: 0.2rem;
    padding: 0.6rem 1.2rem 0.6rem 0.6rem;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

main#contact .form_area .form_data input[type=radio] {
    position: absolute !important;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    border: 0;
    overflow: hidden
}

main#contact .form_area .form_data .wpcf7-radio .wpcf7-list-item+.wpcf7-list-item {
    margin: 0 0 0 1.6rem
}

main#contact .form_area .form_data .wpcf7-radio label {
    font-weight: 400
}

main#contact .form_area .form_data .wpcf7-radio .wpcf7-list-item-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media print,
screen and (min-width: 768px) {
    main#contact .form_area .form_data .wpcf7-radio .wpcf7-list-item-label {
        cursor: pointer
    }
}

main#contact .form_area .form_data .wpcf7-radio .wpcf7-list-item-label::before {
    content: "";
    margin: auto .5em auto 0;
    width: 1.3rem;
    height: 1.3rem;
    background: #fff;
    border-radius: 100%;
    border: 1px solid #e4e4e4
}

main#contact .form_area .form_data .wpcf7-radio input[type=radio]:checked+.wpcf7-list-item-label::before {
    background-color: #666;
    -webkit-box-shadow: inset 0 0 0 0.35rem #fff;
    box-shadow: inset 0 0 0 0.35rem #fff
}

main#contact .form_area .form_data .wpcf7-not-valid-tip {
    font-size: 0.6rem;
    color: red;
    line-height: 1.4
}

main#contact .form_area .form_data .check_area {
    margin: 0 auto 0;
    width: 100%
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data .check_area {
        margin: 2rem auto 0
    }
}

main#contact .form_area .form_data .check_area .wpcf7-form-control-wrap {
    display: block;
    text-align: center
}

main#contact .form_area .form_data .check_area label {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 0 0 2.5rem;
    width: 100%;
    text-align: center;
    font-weight: 400;
    letter-spacing: .16em;
    line-height: 1
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data .check_area label {
        padding: 0 0 0 1.8rem;
        text-align: left;
        font-size: 0.7rem;
        letter-spacing: .08em;
        line-height: 1.9
    }
}

main#contact .form_area .form_data input[type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: none
}

main#contact .form_area .form_data input[type=checkbox]+span {
    font-size: 0.65rem;
    letter-spacing: .16em;
    line-height: 1.9
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data input[type=checkbox]+span {
        letter-spacing: .08em
    }
}

main#contact .form_area .form_data input[type=checkbox]+span:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1.75rem;
    height: 1.7rem;
    background: url(../images/common/ico_checkbox.svg) center center no-repeat;
    background-size: cover
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data input[type=checkbox]+span:before {
        width: 1.2rem;
        height: 1.2rem
    }
}

main#contact .form_area .form_data input[type=checkbox]+span:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1.75rem;
    height: 1.7rem;
    background: url(../images/common/ico_checkbox_on.svg) center center no-repeat;
    background-size: cover;
    opacity: 0;
    -webkit-transition: .3s linear;
    transition: .3s linear
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_data input[type=checkbox]+span:after {
        width: 1.2rem;
        height: 1.2rem
    }
}

main#contact .form_area .form_data input[type=checkbox]+span a {
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {
    main#contact .form_area .form_data input[type=checkbox]+span a:hover {
        text-decoration: none
    }
}

main#contact .form_area .form_data input[type=checkbox]:checked+span:after {
    opacity: 1
}

main#contact .form_area .form_btn_area {
    margin: 2rem auto 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 5rem
}

@media screen and (max-width: 767px) {
    main#contact .form_area .form_btn_area {
        gap: 0
    }
}

main#contact .form_area .form_btn_area .form_btn {
    margin: 0
}

main#contact .wpcf7-response-output {
    border: 0 !important;
    font-size: 0.7rem;
    letter-spacing: .08em;
    line-height: 1.6;
    color: red;
    text-align: center;
}

main#contact #confirm_area .form_area {
    margin: 3rem auto 0
}

main#contact #confirm_area .form_area .form_data {
    margin: 0 auto 0;
    padding: 2rem 0
}

main#contact #confirm_area .form_area .form_data+.form_data {
    border-top: 1px solid #f6f6f6;
    margin: 0 auto 0
}

main#contact #confirm_area .form_area .form_data .input_area>span {
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9
}

main#contact #thanks_area h3.title {
    position: relative;
    margin: 3rem auto 0;
    font-size: 2.2rem;
    letter-spacing: .2em;
    line-height: 1.8;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#contact #thanks_area h3.title {
        font-size: 1.2rem;
        line-height: 1.9
    }
}

main#contact #thanks_area .lead_area {
    position: relative;
    margin: 2rem auto 0;
    font-size: 0.7rem;
    letter-spacing: .16em;
    line-height: 1.9;
    text-align: center
}

@media screen and (max-width: 767px) {
    main#contact #thanks_area .lead_area {
        letter-spacing: .08em
    }
}

main#contact #thanks_area .btn_area {
    position: relative;
    margin: 4rem auto 0;
    width: 10.8rem
}

@media screen and (max-width: 767px) {
    main#contact #thanks_area .btn_area {
        margin: 2rem auto 0
    }
}

#policy {
    position: relative
}

#policy #visual_area {
    padding-bottom: 4rem !important
}

@media screen and (max-width: 767px) {
    #policy #visual_area {
        padding-bottom: 4.5rem !important
    }
}

#termsofuse {
    position: relative
}

#policy .sub_contents,
#termsofuse.sub_contents {
    margin: 0 auto;
    width: 45rem
}

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

    #policy .sub_contents,
    #termsofuse.sub_contents {
        width: 18.1rem
    }
}

#policy .sub_contents.text_contents .text_contents_area+.text_contents_area,
#termsofuse.sub_contents.text_contents .text_contents_area+.text_contents_area {
    margin: 4rem 0 0
}

#policy .sub_contents.text_contents .text_contents_area h3.title,
#termsofuse.sub_contents.text_contents .text_contents_area h3.title {
    font-size: 1rem;
    line-height: 1.8;
    letter-spacing: .16em
}

#policy .sub_contents.text_contents .text_contents_area .line,
#termsofuse.sub_contents.text_contents .text_contents_area .line {
    margin: 1rem 0 0;
    width: 100%;
    height: 1px;
    background-color: #f6f6f6
}

#policy .sub_contents.text_contents .text_contents_area .body,
#termsofuse.sub_contents.text_contents .text_contents_area .body {
    margin: 1rem 0 0;
    font-size: 0.6rem;
    line-height: 1.9;
    letter-spacing: .16em
}

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

    #policy .sub_contents.text_contents .text_contents_area .body,
    #termsofuse.sub_contents.text_contents .text_contents_area .body {
        font-size: 0.7rem;
        letter-spacing: .08em
    }
}

#policy .sub_contents.text_contents .text_contents_area .body a,
#termsofuse.sub_contents.text_contents .text_contents_area .body a {
    text-decoration: underline
}

@media print,
screen and (min-width: 768px) {

    #policy .sub_contents.text_contents .text_contents_area .body a:hover,
    #termsofuse.sub_contents.text_contents .text_contents_area .body a:hover {
        text-decoration: none
    }
}

/* Privacy Policy テーブル - レスポンシブ修正 */
#policy table {
    width: 100%;
    max-width: 45rem;
    border-collapse: collapse;
}

#policy table td {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #eee;
    vertical-align: top;
    line-height: 1.6;
}

#policy table td:first-child {
    width: 25%;
    font-weight: 500;
    color: #333;
}

#policy table td:last-child {
    width: 75%;
    color: #666;
}

@media (max-width: 767px) {
    #policy table td {
        padding: 0.8rem 1rem;
        font-size: 0.7rem;
        /* PC版より小さく */
    }

    #policy table td:first-child {
        width: 30%;
    }
}

/* PC版で人材派遣セクションの開閉機能を無効化 */
@media screen and (min-width: 768px) {
    .fixbox.pulldown {
        pointer-events: none;
        cursor: default;
    }

    .fixbox.pulldown .title_area {
        pointer-events: none;
        cursor: default;
    }

    .fixbox.pulldown .arr {
        display: none;
    }
}

/* Privacy Policy テーブル - レスポンシブ修正 */
#policy table {
    width: 100%;
    max-width: 45rem;
    border-collapse: collapse;
}

#policy table td {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #eee;
    vertical-align: top;
    line-height: 1.6;
}

#policy table td:first-child {
    width: 25%;
    font-weight: 500;
    color: #333;
}

#policy table td:last-child {
    width: 75%;
    color: #666;
}

@media (max-width: 767px) {
    #policy table td {
        padding: 0.8rem 1rem;
        font-size: 0.7rem;
        /* PC版より小さく */
    }

    #policy table td:first-child {
        width: 30%;
    }
}

.wpcf7-spinner {
    display: none !important;
}

#sns {
    position: fixed;
    top: 15vh;
    right: 0;
    text-align: center;
    z-index: 500;
    width: 56px;
    height: 180px;
    background: #fff;
    box-shadow: 0px 2px 6px 3px rgba(0, 0, 0, 0.1);
    font-size: 0;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#sns .icon {
    position: absolute;
    top: 0;
    right: 0;
}

#sns .icon img {
    width: 36px;
    margin-top: 20px;
    opacity: 0.8;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#sns .icon a:hover {
    opacity: 0.8;
    -webkit-transition: .3s all ease;
    transition: .3s all ease;
}

@media screen and (max-width: 1200px) {
    #sns {
        width: 46px;
    }

    #sns .icon {
        right: -2px;
    }

    #sns .icon img {
        width: 32px;
    }

}

@media screen and (max-width: 768px) {
    #sns {
        width: 38px;
        height: 130px;
    }

    #sns .icon {
        right: -2px;
    }

    #sns .icon img {
        width: 24px;
        margin-top: 16px;
    }

}

@media screen and (max-width: 480px) {
    #sns .icon img {
        margin-top: 12px;
    }
}

.scroll_up {
    position: absolute;
    top: -60px;
    right: 10px;
    z-index: 150;
    color: #000;
}

.scroll_up span {
    font-weight: 600;
    font-size: 85%;
    letter-spacing: 2px;
    transform: rotate(90deg);
    display: block;
    color: #000;
    width: 30px;
}

.scroll_up:hover {
    text-decoration: none;
}

.scroll_up:after {
    content: "";
    position: absolute;
    bottom: 50px;
    right: 6px;
    width: 10px;
    height: 60px;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(-135deg) skew(45deg);
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.scroll_up:hover:after {
    bottom: 60px;
}

@media screen and (max-width: 768px) {
    .scroll_up {
        top: -130px;
        right: 0;
        margin-right: 5px;
    }

    .scroll_up span {
        font-size: 50%;
        width: 20px;
    }

    .scroll_up:after {
        bottom: 40px;
        right: 3px;
        width: 8px;
        height: 40px;
    }

    .scroll_up:hover:after {
        bottom: 50px;
    }
}

@media screen and (max-width: 767px) {
    main#top #top_heroproject .box .text_area .btn_area span.circle {
        right: 0.2rem;
        margin: -1.2rem 0 0;
        width: 2.4rem;
        height: 2.4rem;
    }
}

/*# sourceMappingURL=main.css.map */