.u-mt5 {
    margin-top: 5px !important
}

.u-pt5 {
    padding-top: 5px !important
}

.u-mr5 {
    margin-right: 5px !important
}

.u-pr5 {
    padding-right: 5px !important
}

.u-mb5 {
    margin-bottom: 5px !important
}

.u-pb5 {
    padding-bottom: 5px !important
}

.u-ml5 {
    margin-left: 5px !important
}

.u-pl5 {
    padding-left: 5px !important
}

.u-mt10 {
    margin-top: 10px !important
}

.u-pt10 {
    padding-top: 10px !important
}

.u-mr10 {
    margin-right: 10px !important
}

.u-pr10 {
    padding-right: 10px !important
}

.u-mb10 {
    margin-bottom: 10px !important
}

.u-pb10 {
    padding-bottom: 10px !important
}

.u-ml10 {
    margin-left: 10px !important
}

.u-pl10 {
    padding-left: 10px !important
}

.u-mt15 {
    margin-top: 15px !important
}

.u-pt15 {
    padding-top: 15px !important
}

.u-mr15 {
    margin-right: 15px !important
}

.u-pr15 {
    padding-right: 15px !important
}

.u-mb15 {
    margin-bottom: 15px !important
}

.u-pb15 {
    padding-bottom: 15px !important
}

.u-ml15 {
    margin-left: 15px !important
}

.u-pl15 {
    padding-left: 15px !important
}

.u-mt20 {
    margin-top: 20px !important
}

.u-pt20 {
    padding-top: 20px !important
}

.u-mr20 {
    margin-right: 20px !important
}

.u-pr20 {
    padding-right: 20px !important
}

.u-mb20 {
    margin-bottom: 20px !important
}

.u-pb20 {
    padding-bottom: 20px !important
}

.u-ml20 {
    margin-left: 20px !important
}

.u-pl20 {
    padding-left: 20px !important
}

.u-mt25 {
    margin-top: 25px !important
}

.u-pt25 {
    padding-top: 25px !important
}

.u-mr25 {
    margin-right: 25px !important
}

.u-pr25 {
    padding-right: 25px !important
}

.u-mb25 {
    margin-bottom: 25px !important
}

.u-pb25 {
    padding-bottom: 25px !important
}

.u-ml25 {
    margin-left: 25px !important
}

.u-pl25 {
    padding-left: 25px !important
}

.u-mt30 {
    margin-top: 30px !important
}

.u-pt30 {
    padding-top: 30px !important
}

.u-mr30 {
    margin-right: 30px !important
}

.u-pr30 {
    padding-right: 30px !important
}

.u-mb30 {
    margin-bottom: 30px !important
}

.u-pb30 {
    padding-bottom: 30px !important
}

.u-ml30 {
    margin-left: 30px !important
}

.u-pl30 {
    padding-left: 30px !important
}

.u-mt35 {
    margin-top: 35px !important
}

.u-pt35 {
    padding-top: 35px !important
}

.u-mr35 {
    margin-right: 35px !important
}

.u-pr35 {
    padding-right: 35px !important
}

.u-mb35 {
    margin-bottom: 35px !important
}

.u-pb35 {
    padding-bottom: 35px !important
}

.u-ml35 {
    margin-left: 35px !important
}

.u-pl35 {
    padding-left: 35px !important
}

.u-mt40 {
    margin-top: 40px !important
}

.u-pt40 {
    padding-top: 40px !important
}

.u-mr40 {
    margin-right: 40px !important
}

.u-pr40 {
    padding-right: 40px !important
}

.u-mb40 {
    margin-bottom: 40px !important
}

.u-pb40 {
    padding-bottom: 40px !important
}

.u-ml40 {
    margin-left: 40px !important
}

.u-pl40 {
    padding-left: 40px !important
}

.u-mt45 {
    margin-top: 45px !important
}

.u-pt45 {
    padding-top: 45px !important
}

.u-mr45 {
    margin-right: 45px !important
}

.u-pr45 {
    padding-right: 45px !important
}

.u-mb45 {
    margin-bottom: 45px !important
}

.u-pb45 {
    padding-bottom: 45px !important
}

.u-ml45 {
    margin-left: 45px !important
}

.u-pl45 {
    padding-left: 45px !important
}

.u-mt50 {
    margin-top: 50px !important
}

.u-pt50 {
    padding-top: 50px !important
}

.u-mr50 {
    margin-right: 50px !important
}

.u-pr50 {
    padding-right: 50px !important
}

.u-mb50 {
    margin-bottom: 50px !important
}

.u-pb50 {
    padding-bottom: 50px !important
}

.u-ml50 {
    margin-left: 50px !important
}

.u-pl50 {
    padding-left: 50px !important
}

.u-mt55 {
    margin-top: 55px !important
}

.u-pt55 {
    padding-top: 55px !important
}

.u-mr55 {
    margin-right: 55px !important
}

.u-pr55 {
    padding-right: 55px !important
}

.u-mb55 {
    margin-bottom: 55px !important
}

.u-pb55 {
    padding-bottom: 55px !important
}

.u-ml55 {
    margin-left: 55px !important
}

.u-pl55 {
    padding-left: 55px !important
}

.u-mt60 {
    margin-top: 60px !important
}

.u-pt60 {
    padding-top: 60px !important
}

.u-mr60 {
    margin-right: 60px !important
}

.u-pr60 {
    padding-right: 60px !important
}

.u-mb60 {
    margin-bottom: 60px !important
}

.u-pb60 {
    padding-bottom: 60px !important
}

.u-ml60 {
    margin-left: 60px !important
}

.u-pl60 {
    padding-left: 60px !important
}

.u-fw-b {
    font-weight: bold
}

.only-pc {
    display: block
}

@media screen and (max-width: 767px) {
    .only-pc {
        display: none
    }
}

.only-sp {
    display: none
}

@media screen and (max-width: 767px) {
    .only-sp {
        display: block
    }
}

.from-md {
    display: none
}

@media screen and (max-width: 960px) {
    .from-md {
        display: block
    }
}

.cl::after {
    display: block;
    clear: both;
    content: ""
}

.c-on {
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.c-on:hover {
    opacity: 0.8
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    /* font-size: 100%; */
    font: inherit;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
main {
    display: block
}

ol,
ul {
    list-style: none
}

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

*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    overflow-y: scroll
}

sup {
    font-size: 1rem;
    vertical-align: text-top
}

sub {
    font-size: 1rem;
    vertical-align: text-bottom
}

img {
    max-width: 100%;
    height: auto;
    font-size: 0;
    line-height: 0;
    vertical-align: bottom
}



body {
    color: #404040;
    /* font-size: 1.4rem; */
    line-height: 1.8;
    font-family: "pingfang SC", "Microsoft YaHei", sans-serif;
    letter-spacing: 0.1em;
    background: #EAEAEA
}

body.no-scroll {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 960px) {
    body {
        letter-spacing: 0.05em
    }

    .cookie {
        display: none;
    }
}

.colorRed {
    color: #f00
}

.wrapper {
    overflow: hidden
}

a {
    color: inherit;
    text-decoration: none
}

@media (min-width: 768px) {
    a[href^="tel:"] {
        pointer-events: none;
        color: inherit;
        cursor: default;
        text-decoration: none
    }
}

.header {
    color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 100;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.header.has-bg {
    background: #404040
}

.header.is-active {
    background: #404040 !important
}

@media screen and (max-width: 960px) {
    .header {
        height: 64px
    }
}

.headerInner {
    position: relative
}

.headerInner_logo {
    position: absolute;
    top: 32px;
    left: 45px;
    z-index: 1
}

@media screen and (max-width: 960px) {
    .headerInner_logo {
        top: 20px;
        left: 20px
    }
}

.headerInner_logo img {
    width: 210px
}

@media screen and (max-width: 960px) {
    .headerInner_logo img {
        width: 168px
    }
}

.menuBtn {
    display: none
}

@media screen and (max-width: 960px) {
    .menuBtn {
        display: block;
        width: 28px;
        height: 20px;
        position: absolute;
        top: 22px;
        right: 28px
    }

    .menuBtn span {
        display: block;
        position: absolute;
        width: 100%;
        height: 1px;
        background: #fff;
        -webkit-transition: 0.4s;
        transition: 0.4s
    }

    .menuBtn span:nth-child(1) {
        top: 0
    }

    .menuBtn span:nth-child(2) {
        top: 50%;
        background: rgba(255, 255, 255, 0.3)
    }

    .menuBtn span:nth-child(2)::before {
        content: '';
        display: block;
        background: #fff;
        position: absolute;
        top: 0;
        left: 0;
        width: 50%;
        height: 1px
    }

    .menuBtn span:nth-child(3) {
        top: 100%
    }

    .menuBtn span:nth-child(4) {
        opacity: 0
    }
}

.menuBtn.is-open span {
    background: #fff;
    width: 15px
}

.menuBtn.is-open span:nth-child(1) {
    top: auto;
    -webkit-transform: translate(0px, 8px) rotate(135deg);
    transform: translate(0px, 8px) rotate(135deg)
}

.menuBtn.is-open span:nth-child(2) {
    top: auto;
    background: #fff;
    -webkit-transform: translate(14px, -5px) rotate(135deg);
    transform: translate(14px, -5px) rotate(135deg)
}

.menuBtn.is-open span:nth-child(2)::before {
    display: none
}

.menuBtn.is-open span:nth-child(3) {
    top: auto;
    -webkit-transform: translate(14px, 8px) rotate(225deg);
    transform: translate(14px, 8px) rotate(225deg)
}

.menuBtn.is-open span:nth-child(4) {
    opacity: 1;
    -webkit-transform: translate(0px, -5px) rotate(225deg);
    transform: translate(0px, -5px) rotate(225deg)
}

.navigation {
    position: absolute;
    top: 0;
    right: 60px;
    width: 100%
}

/* 搜索 */
.search {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /* background: #000; */
    background: rgba(0, 0, 0, 0.85);
    z-index: 999;
    display: none;
}

.search-box {
    width: 50%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 25%;
}

.search-box .inp {
    width: 100%;
    height: 6.25rem;
    background: none;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.7);
    font-size: 1.25rem;
    color: rgba(255, 255, 255, 0.7);
}

.inp::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.7);
}

.bu {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    color: rgba(255, 255, 255, 0.7);
    background: none;
    border: none;
}

.bu .iconfont {
    font-size: 2.5rem;
}

.search-con {
    position: absolute;
    right: 7%;
    top: 7%;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
}

.search-con .iconfont {
    font-size: 2.125rem;
    font-weight: 100;
}

.ds {
    cursor: pointer;
}

@media screen and (max-width: 960px) {
    .navigation {
        display: none;
        position: fixed;
        top: 64px;
        right: 0;
        height: calc(100% - 64px);
        padding: 40px 0 40px;
        overflow: scroll;
        background: #404040;
        border-top: 1px solid #595959
    }

    .navigation::after {
        content: '';
        display: block;
        background: #fff;
        position: absolute;
        top: -1px;
        left: 0;
        width: 50%;
        height: 1px
    }
}

.navigationInnerList {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: relative
}

.navigationInnerList .search {
    width: 15px;
    position: relative;
    top: -2px;
}

  .floating-image {
            position: absolute;
            width: 18.875rem;
            height: 6.4375rem;
            display: none;
        }

@media screen and (max-width: 960px) {
    .navigationInnerList {
        display: block
    }
}

.navigationInnerList>li {
    height: 100px;
    margin-left: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
}

.navigationInnerList>li:first-child {
    display: none
}

@media screen and (max-width: 960px) {
    .navigationInnerList>li:first-child {
        display: block
    }
}

@media screen and (max-width: 960px) {
    .navigationInnerList li {
        height: auto;
        display: block;
        margin: 12px 30px
    }
}

.navigationInnerList li>a {
    position: relative;
    font-family: niveau-grotesk, sans-serif;
    padding-bottom: 6px;
    font-size: 1rem;
}

@media screen and (max-width: 960px) {
    .navigationInnerList li>a {
        font-size: 1.6rem;
    }
}

.navigationInnerList li>a .c-border:before {
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    width: 0%;
    background: #fff
}

.navigationInnerList li>a .c-iconArrow {
    margin-left: 5px;
    position: relative;
    top: -1px
}

.navigationInnerList li>a .c-iconArrow img {
    width: 10px;
    vertical-align: middle
}

.navigationInnerList li.active>a .c-border:before,
.navigationInnerList li>a.is-current .c-border:before,
.navigationInnerList li>a.is-open .c-border:before,
.navigationInnerList li>a:hover .c-border:before {
    width: 100%
}

.navigationInnerList li .subNavWrap {
    display: none;
    position: fixed;
    top: 100px;
    left: 0;
    width: 100%
}

@media screen and (max-width: 960px) {
    .navigationInnerList li .subNavWrap {
        position: static
    }
}

.navigationInnerList li .subNav {
    font-family: niveau-grotesk, "中ゴシックBBB", sans-serif;
    color: #2f2f2f;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 40px 40px 22px;
    background: #fff
}

@media screen and (max-width: 960px) {
    .navigationInnerList li .subNav {
        color: #fff;
        display: block;
        background: none;
        padding: 0 0 0 10px
    }
}

.navigationInnerList li .subNavTit {
    font-size: 2.4rem;
    position: relative;
    margin: -30px 100px 0 0
}

@media screen and (max-width: 960px) {
    .navigationInnerList li .subNavTit {
        padding-top: 10px;
        font-size: 1.5rem;
        margin: 0
    }
}

.navigationInnerList li .subNavTit a .c-border:before,
.navigationInnerList li .subNavTit a .c-border:after {
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.navigationInnerList li .subNavTit a .c-border:before {
    width: 100%;
    background: #d5d5d5
}

.navigationInnerList li .subNavTit a .c-border:after {
    width: 50%;
    background: #2f2f2f
}

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

    .navigationInnerList li .subNavTit a .c-border:before,
    .navigationInnerList li .subNavTit a .c-border:after {
        display: none
    }
}

.navigationInnerList li .subNavTit a:hover .c-border:after {
    width: 100%
}

.navigationInnerList li .subNavItem {
    font-size: 1.2rem;
    width: 200px;
    margin-left: 30px
}

@media screen and (max-width: 960px) {
    .navigationInnerList li .subNavItem {
        width: 100%;
        margin-left: 0
    }

    .navigationInnerList li .subNavItem img {
        display: none
    }
}

.navigationInnerList li .subNavItem a:hover .c-border:after {
    width: 100%
}

.navigationInnerList li .subNavItem_txt {
    display: inline-block;
    margin-top: 10px;
    padding-bottom: 4px;
    position: relative
}

.navigationInnerList li .subNavItem_txt:before,
.navigationInnerList li .subNavItem_txt:after {
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.navigationInnerList li .subNavItem_txt:before {
    width: 100%;
    background: #d5d5d5
}

.navigationInnerList li .subNavItem_txt:after {
    width: 50%;
    background: #2f2f2f
}

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

    .navigationInnerList li .subNavItem_txt:before,
    .navigationInnerList li .subNavItem_txt:after {
        display: none
    }
}

.secInner {
    max-width: 1300px;
    margin: 0 auto;
    position: relative
}

@media screen and (max-width: 1350px) {
    .secInner {
        width: 86%;
        margin: 0 7%
    }
}

.footerInner {
    margin: 0 auto 0 100px;
    position: relative
}

@media screen and (max-width: 1350px) {
    .footerInner {
        width: 100%;
        margin: 0
    }
}

.footer .contactBox {
    color: #fff;
    padding: 0 80px;
    padding-left: 130px;
    width: 100%;
    height: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: #404040
}

@media screen and (max-width: 960px) {
    .footer .contactBox {
        padding: 0 5%
    }
}

.footer .contactBox:after {
    content: "";
    display: block;
    background: #404040;
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%
}

@media screen and (max-width: 1350px) {
    .footer .contactBox:after {
        display: none
    }
}

.footer .contactBox .secBox_tit {
    font-size: 5rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500
}

@media screen and (max-width: 960px) {
    .footer .contactBox .secBox_tit {
        font-size: 4rem;
        margin-bottom: 20px
    }
}

.footer .contactBox .secBox_txt1 {
    font-size: 2.4rem;
    margin-bottom: 20px
}

@media screen and (max-width: 960px) {
    .footer .contactBox .secBox_txt1 {
        font-size: 2rem;
        margin-bottom: 30px
    }
}

.footer .footerCnt {
    color: #2f2f2f;
    padding: 70px 130px 45px;
    background: #fff;
    position: relative;
    overflow: hidden;
}

@media screen and (max-width: 1350px) {
    .footer .footerCnt {
        padding: 70px 5% 45px 5%
    }
}

@media screen and (max-width: 960px) {
    .footer .footerCnt {
        padding: 30px 5% 30px 5%
    }
}

.footer .footerCnt:after {
    content: "";
    display: block;
    background: #fff;
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%
}

.footer .footerDetail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.2rem;
    line-height: 1.5;
    margin-bottom: 60px
}

.footer .footerDetail .footer_logo {
    margin-right: 30px
}

@media screen and (max-width: 960px) {
    .footer .footerDetail {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-bottom: 15px
    }

    .footer .footerDetail .footer_logo {
        margin-right: 0
    }

    .footer .footerDetail .footer_logo img {
        width: 240px
    }

    .footer .footerDetail_txt {
        display: none
    }
}

.footer .footerNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width: 1150px) {
    .footer .footerNav {
        display: none
    }
}

.footer .footerNav li {
    font-family: niveau-grotesk, sans-serif;
    position: relative;
    padding: 0 1rem;
}

.footer .footerNav li:first-child {
    padding-left: 0
}

.footer .footerNav li:first-child:before {
    display: none
}

.footer .footerNav li:before {
    content: "";
    display: block;
    width: 1px;
    height: 16px;
    background: #2f2f2f;
    position: absolute;
    top: calc(50% - 6px);
    left: 0
}

.footer .footerBottom {
    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
}

.footerCnt .fl {
    width: 60%;
    float: left;
}

.footerCnt .fr {
    width: 40%;
    float: right;
    text-align: center;
}

.footerCnt .fr img {
    width: 9.6875rem;

}

@media screen and (max-width: 960px) {
    .footer .footerBottom {
        display: block
    }
}

.footerCopy {
    color: #b4b4b4;
    font-family: niveau-grotesk, sans-serif;
    font-size: 1rem;
    margin: 20px 50px 0 0;
}

.footerCopy a {
    color: #b4b4b4;
}

@media screen and (max-width: 960px) {
    .footerCopy {
        text-align: center;
        font-size: 1rem;
        margin-right: 0
    }
}

.pointer {
    pointer-events: none;
    border-radius: 50%;
    position: fixed;
    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: 20px;
    height: 20px;
    background: #bbb;
    opacity: 0.5;
    z-index: 1000;
    -webkit-transition: -webkit-transform ease 0.1s;
    transition: -webkit-transform ease 0.1s;
    transition: transform ease 0.1s;
    transition: transform ease 0.1s, -webkit-transform ease 0.1s;
    mix-blend-mode: difference
}

.pointer.is-active {
    -webkit-transform: scale(2);
    transform: scale(2)
}

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

[data-aos="text-animation"]>div>span {
    overflow-y: hidden;
    display: inline-block;
    opacity: 0;
    -webkit-transform: translate(0, 70%);
    transform: translate(0, 70%)
}

[data-aos="text-animation"].aos-animate>div>span {
    -webkit-animation-name: textAnimationText;
    animation-name: textAnimationText;
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes textAnimationText {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, 70%);
        transform: translate(0, 70%)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@keyframes textAnimationText {
    0% {
        opacity: 0;
        -webkit-transform: translate(0, 70%);
        transform: translate(0, 70%)
    }

    100% {
        opacity: 1;
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

.c-scrolldown {
    --line-height: 150px;
    --line-height-abs: -150px;
    font-family: niveau-grotesk, sans-serif;
    width: 1px;
    height: var(--line-height);
    position: absolute;
    top: calc(50% - var(--line-height) / 2);
    right: 35px;
    margin: 0 auto;
    z-index: 1
}

@media screen and (max-width: 960px) {
    .c-scrolldown {
        --line-height: 100px;
        --line-height-abs: -100px;
        top: calc(90% - var(--line-height) / 2)
    }
}

.c-scrolldown .c-label {
    position: absolute;
    bottom: 125px;
    left: -1.3em;
    text-align: center;
    letter-spacing: 0.1em;
    font-size: 12px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    line-height: 1
}

@media screen and (min-width: 768px) {
    .c-scrolldown .c-label {
        bottom: 175px;
        font-size: 14px
    }
}

.c-scrolldown .c-baseliine {
    position: absolute;
    z-index: 0;
    width: 1px;
    height: var(--line-height);
    background: rgba(255, 255, 255, 0.25)
}

.c-scrolldown .c-line {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: block;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #fff), color-stop(50%, rgba(255, 255, 255, 0)));
    background: linear-gradient(to bottom, #fff 50%, rgba(255, 255, 255, 0) 50%);
    background-position: 0 var(--line-height-abs);
    background-size: 100% 200%;
    -webkit-animation: scrolldown 2.2s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite;
    animation: scrolldown 2.2s cubic-bezier(0.76, 0, 0.3, 1) forwards infinite
}

@-webkit-keyframes scrolldown {
    0% {
        background-position: 0 var(--line-height-abs)
    }

    75% {
        background-position: 0 0
    }

    100% {
        background-position: 0 var(--line-height)
    }
}

@keyframes scrolldown {
    0% {
        background-position: 0 var(--line-height-abs)
    }

    75% {
        background-position: 0 0
    }

    100% {
        background-position: 0 var(--line-height)
    }
}

.c-mainSec {
    color: #fff;
    height: 780px;
    position: relative;
    background: #404040
}

@media screen and (max-width: 960px) {
    .c-mainSec {
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100)
    }
}

.c-mainSec .secInner {
    font-weight: 500;
    letter-spacing: 0.15em;
    height: inherit;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.c-mainSec.is-show .en span {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

.c-mainSec.is-show .ja span {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

.c-mainSec_tit span {
    display: block
}

.c-mainSec_tit .en {
    font-family: niveau-grotesk, sans-serif;
    font-size: 6rem;
    letter-spacing: 3px;
    font-weight: 400;
    overflow: hidden
}

.c-mainSec_tit .en span {
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-transform: translate(0, 70%);
    transform: translate(0, 70%);
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

.c-mainSec_tit .ja {
    font-size: 2.2rem
}

.c-mainSec_tit .ja span {
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-transform: translate(0, 70%);
    transform: translate(0, 70%);
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

@media screen and (max-width: 960px) {
    .c-mainSec_tit .en {
        font-size: 4rem
    }

    .c-mainSec_tit .ja {
        font-size: 1.6rem
    }
}

[data-aos="topsec-animation"].aos-animate {
    -webkit-animation-name: topsecAnimation;
    animation-name: topsecAnimation;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes topsecAnimation {
    0% {
        -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 200%);
        clip-path: polygon(0 0, 0 0, 0 100%, 0% 200%)
    }

    100% {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 200%, 0% 200%);
        clip-path: polygon(0 0, 100% 0, 100% 200%, 0% 200%)
    }
}

@keyframes topsecAnimation {
    0% {
        -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 200%);
        clip-path: polygon(0 0, 0 0, 0 100%, 0% 200%)
    }

    100% {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 200%, 0% 200%);
        clip-path: polygon(0 0, 100% 0, 100% 200%, 0% 200%)
    }
}

.c-topsec {
    margin-top: -100px;
    position: relative;
    -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%)
}

.c-topsec:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 100px);
    height: 100%;
    background: #fff
}

.er-ul {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .1);
    transition: 400ms ease-in-out;
    transform: scale(0);
    opacity: 0;
}

.er-ul>li {
    text-align: center;
    font-size: .875rem;
    line-height: 2.25rem
}

.er-ul>li:nth-child(1) {
    padding-top: .625rem
}

.er-ul>li:last-child {
    padding-bottom: .625rem
}

.navigationInnerList>li:hover .er-ul {
    opacity: 1;
    transform: scale(1)
}

.er-ul {
    width: 15rem;
    left: auto;
    background-color: rgba(255, 255, 255, .26);
    padding: 0 1.25rem;
}

.er-ul li a {
    color: #fff;
    text-align: left;
    display: block;
}

.er-ul li .iconfont {
    font-size: 1.5625rem;
}

.er-ul li:hover a {
    color: #e60020;
}

.er-ul1 {
    display: none;
}

/* .header.active{
    background: #fff;
    box-shadow: 0 0 2px rgba(0,0,0,.1);
}
.header.active .navigationInnerList > li > a {
    color: #3c3c3c;
} */

@media screen and (max-width: 1350px) {
    .c-topsec {
        background: #fff
    }
}

@media screen and (max-width: 960px) {
    .c-topsec {
        margin-top: 0
    }
}

.c-buttonStyle1 {
    display: inline-block;
    position: relative;
    font-size: 1.125rem;
    font-family: niveau-grotesk, sans-serif;
    padding-bottom: 5px;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.c-buttonStyle1 .c-label {
    color: #fff;
    font-size: .75rem;
}

@media screen and (max-width: 960px) {
    .c-buttonStyle1 {
        /* font-size: 1.6rem */
    }
}

.c-buttonStyle1 .c-border:before,
.c-buttonStyle1 .c-border:after {
    content: '';
    display: block;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.c-buttonStyle1 .c-border:before {
    width: 100%;
    background: #7a7a7a
}

.c-buttonStyle1 .c-border:after {
    width: 50%;
    background: #fff
}

.c-buttonStyle1 .c-icon {
    display: inline-block;
    width: 11px;
    height: 11px;
    position: relative;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.c-buttonStyle1 .c-icon:before,
.c-buttonStyle1 .c-icon:after {
    content: '';
    display: block;
    position: absolute;
    background: #fff
}

.c-buttonStyle1 .c-icon:before {
    width: 100%;
    height: 1px;
    top: calc(50% - 0.5px);
    left: 0
}

.c-buttonStyle1 .c-icon:after {
    width: 1px;
    height: 100%;
    top: 0;
    left: calc(50% - 0.5px)
}

.c-buttonStyle1:hover .c-border:after {
    width: 100%
}

.c-buttonStyle1:hover .c-icon {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.is-hover .c-buttonStyle1 .c-border:after {
    width: 100%
}

.is-hover .c-buttonStyle1 .c-icon {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.c-buttonGoogle {
    display: inline-block;
    border: 1px solid #404040;
    border-radius: 20px;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500;
    padding: 2px 12px;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

.c-buttonGoogle:hover {
    color: #fff;
    background: #404040
}

.c-buttonTarget {
    padding: 0 20px 0 0;
    background: url(../) no-repeat center right;
    background-size: 15px !important
}

.c-buttonTarget.-green {
    background: url(../) no-repeat center right
}

.c-buttonTarget.-orange {
    background: url(../) no-repeat center right
}

[data-aos="title-animation"].aos-animate span {
    -webkit-animation-name: titleAnimationText;
    animation-name: titleAnimationText;
    -webkit-animation-duration: 0.4s;
    animation-duration: 0.4s;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

[data-aos="title-animation"].aos-animate:before {
    -webkit-animation-name: titleAnimationLine;
    animation-name: titleAnimationLine;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@-webkit-keyframes titleAnimationText {
    0% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@keyframes titleAnimationText {
    0% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0)
    }
}

@-webkit-keyframes titleAnimationLine {
    0% {
        height: 0
    }

    100% {
        height: 100%
    }
}

@keyframes titleAnimationLine {
    0% {
        height: 0
    }

    100% {
        height: 100%
    }
}

.c-headingStyle1 {
    color: #fff;
    font-family: niveau-grotesk, sans-serif;
    font-size: 2.8rem;
    font-weight: 300;
    -webkit-writing-mode: tb-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: tb-rl;
    padding: 130px 0 0 5px;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden
}

@media screen and (max-width: 960px) {
    .c-headingStyle1 {
        font-size: 1.8rem;
        padding: 100px 0 0 5px
    }
}

.c-headingStyle1::before {
    content: '';
    display: block;
    width: 1px;
    height: 0%;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0
}

.c-headingStyle1 span {
    display: inline-block;
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0)
}

.c-headingStyle1.-black {
    color: #2f2f2f
}

.c-headingStyle1.-black:before {
    background: #2f2f2f
}

.c-headingStyle2 {
    color: #2f2f2f;
    font-size: 6.2rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500
}

.c-headingStyle3 {
    color: #2f2f2f;
    font-size: 2.4rem;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative
}

@media screen and (max-width: 960px) {
    .c-headingStyle3 {
        font-size: 2rem;
        margin-bottom: 20px;
        padding-bottom: 10px
    }
}

.c-headingStyle3:after {
    content: '';
    display: block;
    width: 18px;
    height: 1px;
    background: #2f2f2f;
    position: absolute;
    bottom: 0;
    left: 0
}

:placeholder-shown {
    color: #bfc2c5;
    font-size: inherit
}

::-webkit-input-placeholder {
    color: #bfc2c5;
    font-size: inherit
}

:-moz-placeholder {
    opacity: 1;
    color: #bfc2c5;
    font-size: inherit
}

::-moz-placeholder {
    opacity: 1;
    color: #bfc2c5;
    font-size: inherit
}

:-ms-input-placeholder {
    color: #bfc2c5;
    font-size: inherit
}

input[type=text],
input[type=search],
input[type=tel],
input[type=url],
input[type=email],
select,
button,
textarea {
    color: inherit;
    font-family: inherit;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none
}

input[type=text],
input[type=search],
input[type=tel],
input[type=url],
input[type=email],
select,
textarea {
    width: 100%;
    height: 45px;
    font-size: 16px;
    padding: 8px 10px;
    background-color: #EAEAEA
}

textarea {
    resize: none
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

input:-webkit-autofill,
textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #F7F7F7 inset;
    box-shadow: 0 0 0 1000px #F7F7F7 inset
}

select::-ms-expand {
    display: none
}

label {
    cursor: pointer
}

button {
    cursor: pointer
}

.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 101;
    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;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: 0.5s;
    transition: 0.5s
}

.loading img {
    width: 96px
}

@media screen and (max-width: 767px) {
    .loading img {
        width: 70px
    }
}

.loading-bar {
    margin-top: 20px;
    width: 96px;
    height: 1px;
    background: #666;
    position: relative
}

.loading-bar:before {
    content: "";
    display: block;
    width: 0;
    height: 1px;
    background: #fff;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    -webkit-transition: 2s;
    transition: 2s
}

.loading.is-load {
    opacity: 0;
    -webkit-transition-delay: 2s;
    transition-delay: 2s
}

.loading.is-load .loading-bar:before {
    width: 100%
}

.opening-grid {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -ms-grid;
    display: grid;
    z-index: 100;
    -ms-grid-rows: (1fr)[6];
    grid-template-rows: repeat(6, 1fr)
}

.opening-grid .blockTop {
    background: #404040;
    height: calc(100% + 1px);
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1 / 2;
    -webkit-transition: 0.4s;
    transition: 0.4s
}

.opening-grid .blockBtm {
    background: #404040;
    -ms-grid-row: 6;
    -ms-grid-row-span: 2;
    grid-row: 6 / 8;
    -webkit-transition: 0.4s;
    transition: 0.4s
}

.opening-grid .square {
    background: #404040;
    -webkit-transition: 0.7s;
    transition: 0.7s;
    -webkit-transition-timing-function: cubic-bezier(0, 0.36, 0, 1);
    transition-timing-function: cubic-bezier(0, 0.36, 0, 1)
}

.opening-grid.is-load .blockTop {
    -webkit-transform: translate(0, -100%);
    transform: translate(0, -100%);
    -webkit-transition-delay: 4.6s;
    transition-delay: 4.6s
}

.opening-grid.is-load .blockBtm {
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
    -webkit-transition-delay: 4.6s;
    transition-delay: 4.6s
}

.opening-grid.is-load .square:nth-child(2) {
    -webkit-transform: translate(100%, 0px);
    transform: translate(100%, 0px);
    -webkit-transition-delay: 2.1s;
    transition-delay: 2.1s
}

.opening-grid.is-load .square:nth-child(3) {
    -webkit-transform: translate(100%, 0px);
    transform: translate(100%, 0px);
    -webkit-transition-delay: 2.3s;
    transition-delay: 2.3s
}

.opening-grid.is-load .square:nth-child(4) {
    -webkit-transform: translate(100%, 0px);
    transform: translate(100%, 0px);
    -webkit-transition-delay: 2.5s;
    transition-delay: 2.5s
}

.opening-grid.is-load .square:nth-child(5) {
    -webkit-transform: translate(100%, 0px);
    transform: translate(100%, 0px);
    -webkit-transition-delay: 2.7s;
    transition-delay: 2.7s
}

#index {
    color: #fff
}

#index .c-scrolldown {
    opacity: 0;
    -webkit-transform: translate(50px, 0);
    transform: translate(50px, 0);
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transition-delay: 5.4s;
    transition-delay: 5.4s
}

#index.is-load .c-scrolldown {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

#index .backgroundMovie {
    position: fixed
}

#index .backgroundMovie video {
    width: inherit;
    height: inherit
}

#index .backgroundMovie .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: 0.3s;
    transition: 0.3s
}

#index .backgroundMovie .cover.is-active {
    background: rgba(0, 0, 0, 0.6)
}

#index .mainInner {
    position: relative;
    z-index: 1
}

#index .mainSec {
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    position: relative
}

#index .mainSec .secInner {
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500;
    letter-spacing: 0.15em;
    font-size: 6.2rem;
    height: inherit;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width: 960px) {
    #index .mainSec .secInner {
        font-size: 4rem;
        line-height: 1.4
    }
}

#index .mainSec .secInner .row {
    line-height: 1.1
}

#index .mainSec .secInner .row .mainTxt {
    display: inline-block;
    overflow: hidden;

}

#index .mainSec .secInner .row .ani._3 {
    font-size: 4rem;
}


@media screen and (max-width: 960px) {
    #index .mainSec .secInner .row .mainTxt {
        display: block
    }
}

#index .mainSec .secInner .row .ani {
    display: inline-block;
    font-weight: bold;
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
    -webkit-transition: 0.8s;
    transition: 0.8s
}

#index .mainSec .secInner .row .ani._1 {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
        /* transform: translate(0, 0); */
}

#index .mainSec .secInner .row .ani._2 {
    -webkit-transition-delay: 3.3s;
    transition-delay: 3.3s
}

#index .mainSec .secInner .row .ani._3 {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

#index .mainSec .secInner .row .ani._4 {
    -webkit-transition-delay: 3.7s;
    transition-delay: 3.7s
}

@media screen and (max-width: 960px) {
    #index .mainSec .secInner .row .ani._1 {
        -webkit-transition-delay: .3s;
        transition-delay: .3s
    }

    #index .mainSec .secInner .row .ani._2 {
        -webkit-transition-delay: 3.5s;
        transition-delay: 3.5s
    }

    #index .mainSec .secInner .row .ani._3 {
        -webkit-transition-delay: .7s;
        transition-delay: .7s
    }

    #index .mainSec .secInner .row .ani._4 {
        -webkit-transition-delay: 3.9s;
        transition-delay: 3.9s
    }
}

#index .mainSec .secInner .tit_in {
    font-weight: 300;
    margin-left: 20px
}

@media screen and (max-width: 767px) {
    #index .mainSec .secInner .tit_in {
        margin-left: 0
    }
}

#index.is-load .mainSec .row .ani {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

#index .sec {
    padding-top: 230px;
    position: relative
}

@media screen and (max-width: 960px) {
    #index .sec {
        padding-top: 100px
    }
}

#index .secBox {
    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
}

@media screen and (max-width: 960px) {
    #index .secBox {
        display: block
    }
}

#index .secBox.--imgRight {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

#index .secBox_cnt {
    width: 500px
}

@media screen and (max-width: 1350px) {
    #index .secBox_cnt {
        width: 45%
    }
}

@media screen and (max-width: 960px) {
    #index .secBox_cnt {
        width: 100%
    }
}

#index .secBox_img {
    width: 560px;
    position: relative;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    opacity: 0;
    -webkit-transform: translate(0, 70px);
    transform: translate(0, 70px)
}

@media screen and (max-width: 1350px) {
    #index .secBox_img {
        width: 42%
    }
}

@media screen and (max-width: 960px) {
    #index .secBox_img {
        width: calc(100% - 35px);
        margin-bottom: 60px
    }
}

#index .secBox_img img {
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-transition-delay: 0.7s;
    transition-delay: 0.7s;
    -webkit-transform: translate(70px, 70px);
    transform: translate(70px, 70px);
    opacity: 0
}

@media screen and (max-width: 960px) {
    #index .secBox_img img {
        -webkit-transform: translate(35px, 35px);
        transform: translate(35px, 35px)
    }
}

#index .secBox_img.aos-animate {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

#index .secBox_img.aos-animate img {
    opacity: 1
}

#index .secBox_img#about_usImg.aos-animate img {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

#index .secBox_img .blurBg {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    overflow: hidden;
    position: absolute;
    top: 70px;
    right: -70px;
    z-index: -1
}

@media screen and (max-width: 1350px) {
    #index .secBox_img .blurBg {
        top: 35px;
        right: -35px
    }
}

#index .secBox_tit {
    font-size: 5rem;
    font-family: niveau-grotesk, sans-serif;
    letter-spacing: 3px;
    font-weight: 400;
    margin-bottom: 0px
}

@media screen and (max-width: 960px) {
    #index .secBox_tit {
        font-size: 4rem;
        margin-bottom: 20px
    }
}

#index .secBox_txt1 {
    font-size: 2.4rem;
    margin-bottom: 0
}

@media screen and (max-width: 960px) {
    #index .secBox_txt1 {
        font-size: 2rem
    }
}

#index .secBox_btn {
    margin-top: 20px
}

#index .secBox_img {
    --swiper-pagination-color: #666
}

#index .secBox_img .swiper-slide .animation {
    opacity: 0;
    -webkit-transform: translate(0, 70px);
    transform: translate(0, 70px);
    -webkit-transition: 0.5s;
    transition: 0.5s
}

#index .secBox_img .swiper-slide img {
    opacity: 0
}

#index .secBox_img .swiper-slide-active .animation {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1
}

#index .secBox_img .swiper-slide-active img {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1
}

#index .secBox_img .swiper-container {
    overflow: visible
}

#index .secBox_img .swiper-bar {
    position: absolute;
    bottom: -102px;
    left: 70px;
    width: 60%;
    height: 1px;
    background: #666
}

@media screen and (max-width: 1350px) {
    #index .secBox_img .swiper-bar {
        left: 35px;
        bottom: -60px
    }
}

@media screen and (max-width: 1440px) {
    #index .mainSec .secInner {
        font-size: 4.2rem;
    }

    #index .mainSec .secInner .row .ani._3 {
        font-size: 3rem;
    }

    .footer .footerNav li {
        padding: 0 10px;
    }
}

#index .secBox_img .swiper-bar span {
    width: 0;
    height: 1px;
    display: block;
    background: #fff
}

#index .secBox_img .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border: 1px solid transparent;
    background: #B2B2B2;
    opacity: 1;
    margin: 0 6px
}

@media screen and (max-width: 960px) {
    #index .secBox_img .swiper-pagination-bullet {
        width: 7px;
        height: 7px;
        border-width: 1px
    }
}

#index .secBox_img .swiper-pagination-bullet-active {
    width: 10px;
    height: 10px;
    bottom: -1px;
    position: relative;
    background: #636363;
    border-color: #fff
}

#index .secBox_img .swiper-pagination {
    bottom: -115px;
    width: 30%;
    left: calc(70% + 70px);
    text-align: left
}

@media screen and (max-width: 1350px) {
    #index .secBox_img .swiper-pagination {
        bottom: -71px;
        left: calc(70% + 35px)
    }
}

#index .about_us {
    position: relative
}

#index .about_us .secInner {
    z-index: 2
}

@media screen and (max-width: 1500px) {
    #index .business .secBox_img {
        margin-right: 70px
    }
}

@media screen and (max-width: 1350px) {
    #index .business .secBox_img {
        margin-right: 35px
    }
}

@media screen and (max-width: 960px) {
    #index .business .secBox_img {
        margin-bottom: 80px
    }
}

#index .recruit {
    margin-top: 200px;
    padding-top: 0;
    overflow: hidden;
    height: 600px
}

@media screen and (max-width: 960px) {
    #index .recruit {
        margin-top: 120px
    }
}

#index .recruit a {
    display: block
}

#index .recruit a:hover .recruitBox {
    background: rgba(0, 0, 0, 0.15)
}

#index .recruit a:hover img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%)
}

#index .recruit img {
    width: 100%;
    height: 700px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%)
}

#index .recruitBox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 600px;
    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;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 1;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    background: rgba(0, 0, 0, 0.5)
}

#index .recruitBox .secBox_tit {
    margin-bottom: 0
}

#index .recruitBox .secBox_btn {
    margin-top: 40px
}

#index .secWrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 210px
}

@media screen and (max-width: 960px) {
    #index .secWrap {
        display: block;
        margin-bottom: 120px
    }
}

#index .secWrap .sec {
    width: 580px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

#index .secWrap .sec:nth-child(2n) {
    margin-top: 280px
}

@media screen and (max-width: 1350px) {
    #index .secWrap .sec {
        width: 47%
    }
}

@media screen and (max-width: 960px) {
    #index .secWrap .sec {
        width: 100%
    }

    #index .secWrap .sec:nth-child(2n) {
        margin-top: 0
    }
}

#index .secWrap .secTit {
    font-family: niveau-grotesk, sans-serif;
    font-size: 3rem;
    font-weight: 300;
    -webkit-writing-mode: tb-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: tb-rl;
    padding-top: 150px;
    position: relative;
    overflow: hidden
}

@media screen and (max-width: 767px) {
    #index .secWrap .secTit {
        font-size: 2rem
    }
}

#index .secWrap .secTit span {
    display: block;
    -webkit-transform: translate(-100%, 0px);
    transform: translate(-100%, 0px);
    -webkit-transition: 0.3s;
    transition: 0.3s;
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s
}

#index .secWrap .secTit::before {
    content: "";
    display: block;
    width: 1px;
    height: 0;
    background: #fff;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s
}

#index .secWrap .sec.aos-animate .secTit span {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px)
}

#index .secWrap .sec.aos-animate .secTit::before {
    height: 140px
}

#index .secWrap .secImg {
    width: 500px
}

@media screen and (max-width: 1350px) {
    #index .secWrap .secImg {
        width: calc(100% - 60px)
    }
}

@media screen and (max-width: 767px) {
    #index .secWrap .secImg {
        width: calc(100% - 40px)
    }
}

#index .secWrap .secImg_in {
    position: relative;
    overflow: hidden
}

#index .secWrap .secImg a {
    display: block;
    position: relative;
    background: #000
}

#index .secWrap .secImg a .cnt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    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;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.2);
    opacity: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

#index .secWrap .secImg a .cnt .secBox_txt1 {
    margin-bottom: 20px
}

#index .secWrap .secImg a .cnt .secBox_btn {
    margin-top: 0
}

#index .secWrap .secImg .blur {
    opacity: 0;
    position: absolute;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    -webkit-filter: blur(5px);
    filter: blur(5px);
    -webkit-transform: translate(-5px, -5px);
    transform: translate(-5px, -5px);
    background-size: 100% !important;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s
}

#index .secWrap .secImg:hover a .cnt {
    opacity: 1
}

#index .secWrap .secImg:hover .blur {
    opacity: 1
}

#about_us .message .secInner {
    padding: 140px 110px 140px 0;
    background: #fff;
    margin: 0 auto
}

@media screen and (max-width: 1350px) {
    #about_us .message .secInner {
        padding: 140px 0 140px 0;
        width: 93%;
        margin: 0 7% 0 0
    }
}

@media screen and (max-width: 1150px) {
    #about_us .message .secInner {
        padding: 100px 0 0 0
    }
}

@media screen and (max-width: 960px) {
    #about_us .message .secInner {
        padding: 50px 0 0 0
    }
}

#about_us .message .bgText {
    color: #2f2f2f;
    font-size: 20rem;
    line-height: 1;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500;
    opacity: 0.05;
    margin-left: -140px
}

@media screen and (max-width: 1150px) {
    #about_us .message .bgText {
        font-size: 18rem;
        margin-left: 0
    }
}

@media screen and (max-width: 960px) {
    #about_us .message .bgText {
        font-size: 8rem;
        margin-bottom: 40px
    }
}

#about_us .message .secBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 30px
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox {
        display: block;
        margin-top: 0
    }
}

#about_us .message .secBox_cnt {
    width: 560px;
    margin-top: -185px;
    padding-bottom: 40px
}

@media screen and (max-width: 1350px) {
    #about_us .message .secBox_cnt {
        width: 46%
    }
}

@media screen and (max-width: 1150px) {
    #about_us .message .secBox_cnt {
        margin-top: -140px
    }
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_cnt {
        width: 93%;
        margin: 0 0 0 7%;
        padding-bottom: 30px
    }
}

#about_us .message .secBox_cntTit {
    color: #2f2f2f;
    font-size: 3.4rem;
    margin-bottom: 50px
}

@media screen and (max-width: 1150px) {
    #about_us .message .secBox_cntTit {
        font-size: 3rem
    }
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_cntTit {
        font-size: 2.4rem;
        margin-bottom: 30px
    }
}

#about_us .message .secBox_cntTxt1 {
    font-size: 1.6rem;
    line-height: 2;
    margin-bottom: 50px
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_cntTxt1 {
        font-size: 1.4rem;
        margin-bottom: 30px
    }
}

#about_us .message .secBox_cntTxt2 {
    color: #2f2f2f;
    font-size: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_cntTxt2 {
        font-size: 1.4rem
    }
}

#about_us .message .secBox_cntTxt2 .position {
    margin-right: 20px
}

#about_us .message .secBox_cntTxt2 .sign {
    width: 182px
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_cntTxt2 .sign {
        width: 142px
    }
}

#about_us .message .secBox_img {
    position: relative;
    z-index: 1;
    width: calc(100% - 650px)
}

@media screen and (max-width: 1350px) {
    #about_us .message .secBox_img {
        width: 48%
    }
}

@media screen and (max-width: 960px) {
    #about_us .message .secBox_img {
        width: 100%;
        margin: 0 0 30px 0
    }
}

#about_us .policy .secBox {
    padding-top: 200px
}

#about_us .policy .secBox_img {
    width: 697px;
    margin: 0 auto 150px
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_img {
        width: 100%;
        margin: 0 auto 50px
    }
}

#about_us .policy .secBox_cnt {
    width: 900px;
    margin: 0 auto
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_cnt {
        width: 100%
    }
}

#about_us .policy .secBox_cnt .policyList {
    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;
    margin-top: 100px
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_cnt .policyList {
        display: block;
        margin-top: 50px
    }
}

#about_us .policy .secBox_cnt .policyList dt {
    width: 260px;
    font-family: niveau-grotesk, sans-serif;
    line-height: 150px;
    border-right: 1px solid #6c6c6c;
    font-size: 18rem;
    font-weight: 300;
    color: #EAEAEA;
    color: #EAEAEA\0;
    -webkit-text-stroke: 1px #2f2f2f
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_cnt .policyList dt {
        width: 96px;
        padding-bottom: 10px;
        margin: 0 auto 20px;
        font-size: 9rem;
        line-height: 1;
        text-align: center;
        border-right: none;
        border-bottom: 1px solid #2f2f2f
    }
}

#about_us .policy .secBox_cnt .policyList dd {
    font-size: 1.6rem;
    width: 550px
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_cnt .policyList dd {
        width: 100%
    }
}

#about_us .policy .secBox_cnt .policyList_tit {
    color: #2F2F2F;
    font-size: 3rem;
    margin-bottom: 20px
}

@media screen and (max-width: 960px) {
    #about_us .policy .secBox_cnt .policyList_tit {
        font-size: 2.4rem;
        text-align: center
    }
}

#about_us .iso {
    margin-top: 110px
}

#about_us .iso .secInner {
    padding: 150px 0 150px 0
}

@media screen and (max-width: 1350px) {
    #about_us .iso .secInner {
        margin-bottom: 0;
        padding: 100px 0 100px 0
    }
}

@media screen and (max-width: 960px) {
    #about_us .iso .secInner {
        padding: 80px 0 80px 0
    }
}

#about_us .iso .secInner:before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: inherit
}

#about_us .iso .isoList {
    width: 890px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 1350px) {
    #about_us .iso .isoList {
        width: 100%;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: distribute;
        justify-content: space-around
    }
}

#about_us .iso .isoListItem {
    width: 130px;
    color: #2f2f2f;
    font-size: 1.2rem;
    text-align: center
}

@media screen and (max-width: 960px) {
    #about_us .iso .isoListItem {
        font-size: 1rem;
        width: 100px;
        margin-bottom: 20px
    }

    #about_us .iso .isoListItem img {
        width: 92px
    }
}

#about_us .iso .isoListItem:last-child {
    width: 310px
}

@media screen and (max-width: 960px) {
    #about_us .iso .isoListItem:last-child {
        width: 100%;
        margin-top: 20px
    }

    #about_us .iso .isoListItem:last-child img {
        width: 194px
    }
}

#about_us .iso .isoListItem_txt {
    margin-top: 10px
}

[data-aos="new-animation"]:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    background: #EAEAEA;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s
}

[data-aos="new-animation"].aos-animate:before {
    width: 0
}

#business.index .territory .secInner {
    padding: 140px 110px 40px 0;
    background: #fff
}

@media screen and (max-width: 1350px) {
    #business.index .territory .secInner {
        padding: 140px 0 0 0
    }
}

@media screen and (max-width: 1150px) {
    #business.index .territory .secInner {
        padding: 100px 0 20px 0
    }
}

@media screen and (max-width: 960px) {
    #business.index .territory .secInner {
        padding: 50px 0 0 0
    }
}

#business.index .territory .bgText {
    color: #2f2f2f;
    font-size: 20rem;
    line-height: 1;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 500;
    opacity: 0.05;
    margin-left: -130px
}

@media screen and (max-width: 1150px) {
    #business.index .territory .bgText {
        font-size: 18rem;
        margin-left: -7%
    }
}

@media screen and (max-width: 960px) {
    #business.index .territory .bgText {
        font-size: 8rem;
        margin-left: -5%;
        margin-bottom: 40px
    }
}

#business.index .territory .secBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 500px
}

@media screen and (max-width: 960px) {
    #business.index .territory .secBox {
        display: block;
        height: auto
    }
}

#business.index .territory .secBox_cnt {
    width: 550px;
    margin-top: -120px
}

@media screen and (max-width: 1350px) {
    #business.index .territory .secBox_cnt {
        width: 46%;
        padding-bottom: 40px
    }
}

@media screen and (max-width: 960px) {
    #business.index .territory .secBox_cnt {
        width: 100%;
        margin-top: 0;
        padding-bottom: 30px
    }
}

#business.index .territory .secBox_cntTit {
    color: #2f2f2f;
    font-size: 3.4rem;
    margin-bottom: 50px
}

@media screen and (max-width: 1150px) {
    #business.index .territory .secBox_cntTit {
        font-size: 3rem
    }
}

@media screen and (max-width: 960px) {
    #business.index .territory .secBox_cntTit {
        font-size: 2.4rem;
        margin-bottom: 30px
    }
}

#business.index .territory .secBox_cntTxt1 {
    font-size: 1.6rem;
    line-height: 2;
    margin-bottom: 50px
}

@media screen and (max-width: 960px) {
    #business.index .territory .secBox_cntTxt1 {
        font-size: 1.4rem;
        margin-bottom: 30px
    }
}

#business.index .territory .secBox_img {
    position: relative;
    z-index: 1;
    width: 1110px;
    margin: -70px 0 0 -315px
}

@media screen and (max-width: 1350px) {
    #business.index .territory .secBox_img {
        width: 72%;
        margin: -6% 0 0 -20%
    }
}

@media screen and (max-width: 960px) {
    #business.index .territory .secBox_img {
        width: 100%;
        margin: -17% 0 20px
    }
}

#business.index .project {
    padding: 40px 100px 180px 0
}

@media screen and (max-width: 1350px) {
    #business.index .project {
        padding: 0 0 180px 0
    }

    #business.index .project .secInner {
        width: 95%;
        margin: 0 0 0 5%
    }
}

@media screen and (max-width: 1150px) {
    #business.index .project {
        padding: 0 0 120px
    }
}

#business.index .project .bg {
    width: 600px;
    position: absolute;
    top: 180px;
    left: -100px
}

#business.index .project .projectWrap {
    padding-top: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

#business.index .project .projectBox {
    display: block;
    width: 1000px;
    position: relative
}

#business.index .project .projectBox+.projectBox {
    margin-top: 125px
}

@media screen and (max-width: 1350px) {
    #business.index .project .projectBox {
        margin-right: 0
    }
}

@media screen and (max-width: 1150px) {
    #business.index .project .projectBox {
        width: 80%
    }
}

#business.index .project .projectBox a:hover {
    background: #404040
}

#business.index .project .projectBox_cnt {
    color: #fff;
    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;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    width: 380px;
    height: 480px;
    position: absolute;
    top: calc(50% - 240px);
    left: -190px;
    z-index: 11;
    background: #868484;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

@media screen and (max-width: 1150px) {
    #business.index .project .projectBox_cnt {
        width: 320px;
        height: 420px;
        top: calc(50% - 210px);
        left: -160px
    }
}

@media screen and (max-width: 767px) {
    #business.index .project .projectBox_cnt {
        width: 220px;
        height: 280px;
        top: auto;
        bottom: -40px;
        left: -60px
    }
}

#business.index .project .projectBox_no {
    font-size: 3.2rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 300;
    padding-bottom: 40px;
    margin-bottom: 20px;
    position: relative
}

@media screen and (max-width: 1150px) {
    #business.index .project .projectBox_no {
        font-size: 2.8rem;
        padding-bottom: 20px;
        margin-bottom: 10px
    }
}

#business.index .project .projectBox_no:after {
    content: '';
    display: block;
    height: 22px;
    width: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    background: #fff
}

#business.index .project .projectBox_tit {
    font-size: 2.4rem
}

@media screen and (max-width: 1150px) {
    #business.index .project .projectBox_tit {
        font-size: 2.2rem
    }
}

#business.index .project .projectBox_btn {
    margin-top: 60px
}

@media screen and (max-width: 1150px) {
    #business.index .project .projectBox_btn {
        margin-top: 30px
    }
}

#business.index .project .projectBox_img {
    position: relative
}

#business.index .project .projectBox_img:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    background: #EAEAEA;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s
}

#business.index .project .projectBox.aos-animate .projectBox_img:before {
    width: 0
}

[data-aos="new-animation2"] {
    position: relative
}

[data-aos="new-animation2"]:after,
[data-aos="new-animation2"]:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10
}

[data-aos="new-animation2"]:after {
    background: #EAEAEA;
    z-index: 1
}

[data-aos="new-animation2"]:before {
    background: #bbb;
    z-index: 2;
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0)
}

[data-aos="new-animation2"].aos-animate:after {
    -webkit-animation-name: slideCoverBottom;
    animation-name: slideCoverBottom;
    -webkit-animation-duration: 0.8s;
    animation-duration: 0.8s;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

[data-aos="new-animation2"].aos-animate:before {
    -webkit-animation-name: slideCoverTop;
    animation-name: slideCoverTop;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@-webkit-keyframes slideCoverTop {
    0% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }

    45% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    55% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    100% {
        -webkit-transform: translate(100%, 0);
        transform: translate(100%, 0)
    }
}

@keyframes slideCoverTop {
    0% {
        -webkit-transform: translate(-100%, 0);
        transform: translate(-100%, 0)
    }

    45% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    55% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    100% {
        -webkit-transform: translate(100%, 0);
        transform: translate(100%, 0)
    }
}

@-webkit-keyframes slideCoverBottom {
    0% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    100% {
        -webkit-transform: translate(100%, 0);
        transform: translate(100%, 0)
    }
}

@keyframes slideCoverBottom {
    0% {
        -webkit-transform: translate(0%, 0);
        transform: translate(0%, 0)
    }

    100% {
        -webkit-transform: translate(100%, 0);
        transform: translate(100%, 0)
    }
}

#business.detail .c-mainSec_detailTit {
    font-size: 3rem;
    line-height: 1.35;
    overflow: hidden
}

@media screen and (max-width: 960px) {
    #business.detail .c-mainSec_detailTit {
        font-size: 2.4rem;
        width: 100%;
        height: 100%;
        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
    }

    #business.detail .c-mainSec_detailTit div span {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

#business.detail .c-mainSec_detailTit .no {
    font-family: niveau-grotesk, sans-serif;
    font-size: 5rem;
    font-weight: 200;
    padding-right: 80px;
    position: relative
}

@media screen and (max-width: 960px) {
    #business.detail .c-mainSec_detailTit .no {
        font-size: 3.2rem;
        padding-bottom: 30px;
        margin-bottom: 20px;
        padding-right: 0
    }
}

#business.detail .c-mainSec_detailTit .no:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    width: 40px;
    height: 1px;
    background: #fff
}

@media screen and (max-width: 960px) {
    #business.detail .c-mainSec_detailTit .no:after {
        height: 22px;
        width: 1px;
        top: auto;
        left: auto;
        bottom: 0;
        left: 50%
    }
}

#business.detail .c-mainSec_detailTit .txt {
    top: -4px;
    position: relative;
    font-weight: 200
}

#business.detail._01 .c-mainSec {
    background: url("../img/mainv_1.jpg") center;
    background-size: cover
}

@media screen and (max-width: 960px) {
    #business.detail._01 .c-mainSec {
        background: url("../img/mainv_m_2.jpg") center;
        background-size: cover
    }
}

#business.detail._01 .project {
    background: url("../img/project_bg_1.png") center;
    background-size: cover
}

#business.detail._02 .c-mainSec {
    background: url("../img/mainv_2.jpg") center;
    background-size: cover
}

@media screen and (max-width: 960px) {
    #business.detail._02 .c-mainSec {
        background: url("../img/mainv_m_1.jpg") center;
        background-size: cover
    }
}

#business.detail._02 .project {
    background: url("../img/project_bg.jpg") center;
    background-size: cover
}

#business.detail._03 .c-mainSec {
    background: url("../img/mainv_3.jpg") center;
    background-size: cover
}

@media screen and (max-width: 960px) {
    #business.detail._03 .c-mainSec {
        background: url("../img/mainv_m.jpg") center;
        background-size: cover
    }
}

#business.detail._03 .project {
    background: url("../img/project_bg.png") center;
    background-size: cover
}

#business.detail._04 .c-mainSec {
    background: url("../img/mainv.jpg") center;
    background-size: cover
}

@media screen and (max-width: 960px) {
    #business.detail._04 .c-mainSec {
        background: url("../img/mainv_m_3.jpg") center;
        background-size: cover
    }
}

#business.detail._04 .project {
    background: url("../img/project_bg_2.png") center;
    background-size: cover
}

#business.detail._04 .description {
    margin-bottom: 100px
}

#business.detail .description {
    margin-top: -100px;
    position: relative
}

#business.detail .description:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 100px);
    height: 100%;
    background: #fff
}

@media screen and (max-width: 1350px) {
    #business.detail .description {
        position: relative;
        background: #fff
    }
}

@media screen and (max-width: 960px) {
    #business.detail .description {
        margin-top: 0
    }
}

#business.detail .description .secInner {
    padding: 140px 110px 140px 0;
    background: #fff
}

@media screen and (max-width: 1350px) {
    #business.detail .description .secInner {
        padding: 140px 0 140px 0
    }
}

@media screen and (max-width: 960px) {
    #business.detail .description .secInner {
        padding: 40px 0 100px 0
    }
}

#business.detail .description .secInner:before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: inherit
}

#business.detail .description .secBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBox {
        display: block
    }
}

#business.detail .description .secBoxTit {
    color: #2F2F2F;
    font-size: 3.4rem;
    margin-bottom: 70px
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBoxTit {
        font-size: 2.4rem;
        margin-bottom: 30px
    }
}

#business.detail .description .secBox_cnt {
    width: 550px
}

@media screen and (max-width: 1350px) {
    #business.detail .description .secBox_cnt {
        width: 48%
    }
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBox_cnt {
        width: 100%;
        margin-bottom: 30px
    }
}

#business.detail .description .secBox_cnt p {
    line-height: 2
}

#business.detail .description .secBox_cnt p+p {
    margin-top: 50px
}

#business.detail .description .secBox_slide {
    width: 520px;
    --swiper-pagination-color: #fff
}

@media screen and (max-width: 1350px) {
    #business.detail .description .secBox_slide {
        width: 48%
    }
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBox_slide {
        width: 100%
    }
}

#business.detail .description .secBox_slide .swiper-container {
    overflow: visible
}

#business.detail .description .secBox_slide .swiper-bar {
    position: absolute;
    bottom: -36px;
    left: 0;
    width: 60%;
    height: 1px;
    background: #D5D5D5
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBox_slide .swiper-bar {
        bottom: -26px
    }
}

#business.detail .description .secBox_slide .swiper-bar span {
    width: 0;
    height: 1px;
    display: block;
    background: #2F2F2F
}

#business.detail .description .secBox_slide .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border: 2px solid #fff
}

#business.detail .description .secBox_slide .swiper-pagination-bullet-active {
    border: 2px solid #2F2F2F
}

#business.detail .description .secBox_slide .swiper-pagination {
    bottom: -48px;
    width: 30%;
    left: 70%;
    text-align: left
}

@media screen and (max-width: 960px) {
    #business.detail .description .secBox_slide .swiper-pagination {
        bottom: -38px
    }
}

#business.detail .works .secInner {
    padding: 200px 0 0 200px
}

@media screen and (max-width: 1350px) {
    #business.detail .works .secInner {
        padding: 200px 0 0 100px
    }
}

@media screen and (max-width: 960px) {
    #business.detail .works .secInner {
        padding: 180px 0 0 0
    }
}

#business.detail .works .worksWrap {
    margin: 0 -40px 20px 0
}

@media screen and (max-width: 1350px) {
    #business.detail .works .worksWrap {
        margin: 3% -3% 3% 0
    }
}

#business.detail .works .worksPhoto {
    float: left;
    width: 340px;
    margin: 0 40px 40px 0;
    overflow: hidden
}

@media screen and (max-width: 1350px) {
    #business.detail .works .worksPhoto {
        width: 30.3333%;
        margin-right: 3%
    }
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksPhoto {
        width: 48%;
        margin: 0 2% 30px 0
    }
}

#business.detail .works .worksBox {
    position: relative
}

#business.detail .works .worksCnt_detail {
    margin: 20px 0 0;
    padding-left: 20px;
    border-left: 1px solid #B8B7B7
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksCnt_detail {
        font-size: 1.3rem;
        margin: 10px 0 0;
        padding-left: 10px;
        line-height: 1.5
    }
}

#business.detail .works .worksCnt_detail dl dd {
    margin-bottom: 10px
}

#business.detail .works .worksOther {
    margin-bottom: 120px
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOther {
        margin-bottom: 60px
    }
}

#business.detail .works .worksOtherTit {
    font-size: 2.8rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 200;
    margin-bottom: 30px
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOtherTit {
        font-size: 2.6rem;
        margin-bottom: 20px
    }
}

#business.detail .works .worksOther dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

#business.detail .works .worksOther dl+dl {
    margin-top: 35px
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOther dl+dl {
        margin-top: 20px
    }
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOther dl {
        display: block
    }
}

#business.detail .works .worksOther dl dt {
    width: 50%;
    border-bottom: 1px solid #B8B7B7;
    padding-bottom: 5px;
    position: relative
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOther dl dt {
        width: 100%;
        padding: 5px 0
    }

    #business.detail .works .worksOther dl dt:before {
        content: '';
        height: 1px;
        width: 50%;
        position: absolute;
        bottom: -1px;
        right: 0;
        background: #838282;
        z-index: 1
    }
}

#business.detail .works .worksOther dl dd {
    width: 50%;
    border-bottom: 1px solid #838282;
    padding-bottom: 5px
}

@media screen and (max-width: 960px) {
    #business.detail .works .worksOther dl dd {
        width: 100%;
        padding: 5px 0;
        border-bottom: none
    }
}

#business.detail .project {
    padding-bottom: 440px;
    margin-bottom: -270px
}

@media screen and (max-width: 960px) {
    #business.detail .project {
        padding-bottom: 120px;
        margin-bottom: -0
    }
}

#business.detail .project .secInner {
    padding: 200px 0 0 200px
}

#business.detail .project .swiper-wrapper {
    position: relative
}

#business.detail .project .projectSlide {
    position: relative;
    width: calc(50% + 500px);
    left: 50%;
    margin-left: -500px
}

@media screen and (max-width: 960px) {
    #business.detail .project .projectSlide {
        width: 100%;
        left: auto;
        margin-left: 0
    }
}

#business.detail .project .swiper-slide a {
    display: block;
    position: relative
}

#business.detail .project .swiper-slide a:hover .slide_cnt {
    opacity: 1
}

#business.detail .project .swiper-slide .slide_cnt {
    color: #fff;
    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;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    opacity: 0
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-slide .slide_cnt {
        opacity: 1
    }
}

#business.detail .project .swiper-slide .slide_cnt .no {
    font-size: 3.2rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 300;
    padding-bottom: 40px;
    margin-bottom: 20px;
    position: relative
}

@media screen and (max-width: 1150px) {
    #business.detail .project .swiper-slide .slide_cnt .no {
        font-size: 2.8rem;
        padding-bottom: 20px;
        margin-bottom: 10px
    }
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-slide .slide_cnt .no {
        font-size: 2.6rem
    }
}

#business.detail .project .swiper-slide .slide_cnt .no:after {
    content: '';
    display: block;
    height: 22px;
    width: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    background: #fff
}

#business.detail .project .swiper-slide .slide_cnt .txt {
    font-size: 2.4rem
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-slide .slide_cnt .txt {
        font-size: 2.2rem
    }
}

#business.detail .project .swiper-button {
    position: absolute;
    top: -100px;
    z-index: 10;
    background: url("../img/swiper-navigation-arrow.png");
    background-size: 100%;
    width: 22px;
    height: 42px;
    outline: none;
    opacity: 0.6;
    -webkit-transition: 0.3s;
    transition: 0.3s
}

#business.detail .project .swiper-button:hover {
    opacity: 1
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-button {
        top: -70px;
        width: 18px;
        height: 34px
    }
}

#business.detail .project .swiper-custom-button-next {
    right: 150px
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-custom-button-next {
        right: 60px
    }
}

#business.detail .project .swiper-custom-button-prev {
    right: 190px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media screen and (max-width: 960px) {
    #business.detail .project .swiper-custom-button-prev {
        right: 100px
    }
}

#company .profile .secInner {
    padding: 140px 110px 0 200px;
    background: #fff
}

@media screen and (max-width: 1350px) {
    #company .profile .secInner {
        padding: 140px 0 0 200px
    }
}

@media screen and (max-width: 960px) {
    #company .profile .secInner {
        padding: 180px 0 0 0
    }
}

#company .profile .profileBox {
    padding-bottom: 140px
}

@media screen and (max-width: 767px) {
    #company .profile .profileBox {
        padding-bottom: 70px
    }
    .sygg img{
        max-width: 150px;
    }
}

#company .profile .profileBoxRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 960px) {
    #company .profile .profileBoxRow {
        display: block
    }
}

#company .profile .profileBoxRow+.profileBoxRow {
    margin-top: 35px
}

#company .profile .profileBoxRow dt {
    width: 190px;
    color: #2f2f2f;
    border-bottom: 1px solid #2f2f2f
}

@media screen and (max-width: 960px) {
    #company .profile .profileBoxRow dt {
        width: 100%;
        font-size: 1.6rem;
        padding-bottom: 8px;
        position: relative;
        border-bottom: 1px solid #6c6c6c
    }

    #company .profile .profileBoxRow dt:before {
        content: '';
        display: block;
        width: 50%;
        height: 1px;
        background: #2f2f2f;
        position: absolute;
        bottom: -1px;
        left: 0;
        z-index: 1
    }
}

#company .profile .profileBoxRow dd {
    color: #6c6c6c;
    width: calc(100% - 210px);
    border-bottom: 1px solid #6c6c6c
}

#company .profile .profileBoxRow dd .profileBoxIn+.profileBoxIn {
    margin-top: 8px
}

@media screen and (max-width: 960px) {
    #company .profile .profileBoxRow dd {
        width: 100%;
        padding-top: 8px;
        border-bottom: none
    }
}

#company .profile .profile_img {
    width: calc(100% - 100px)
}

@media screen and (max-width: 1350px) {
    #company .profile .profile_img {
        width: 100%
    }
}

#company .map {
    padding-bottom: 200px
}

@media screen and (max-width: 767px) {
    #company .map {
        padding-bottom: 100px
    }
}

#company .map .secInner {
    padding: 140px 0 0 200px
}

@media screen and (max-width: 960px) {
    #company .map .secInner {
        padding: 180px 0 0 0
    }
}

#company .map .mapBox+.mapBox {
    margin-top: 100px
}

@media screen and (max-width: 767px) {
    #company .map .mapBox+.mapBox {
        margin-top: 60px
    }
}

@media screen and (max-width: 1150px) {
    #company .map .mapBox iframe {
        height: 400px
    }
}

@media screen and (max-width: 767px) {
    #company .map .mapBox iframe {
        height: 220px
    }
}

#company .map .mapBoxDetail {
    margin-top: 20px
}

#company .map .mapBoxDetail dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 960px) {
    #company .map .mapBoxDetail dl {
        display: block
    }
}

#company .map .mapBoxDetail dl dt {
    width: 175px;
    border-bottom: 1px solid #404040
}

@media screen and (max-width: 960px) {
    #company .map .mapBoxDetail dl dt {
        width: 100%;
        font-size: 1.6rem;
        position: relative;
        border-bottom: none;
        padding-bottom: 10px;
        margin-bottom: 10px
    }

    #company .map .mapBoxDetail dl dt:before {
        content: '';
        display: block;
        width: 15px;
        height: 1px;
        background: #404040;
        position: absolute;
        bottom: 0;
        left: 0
    }
}

#company .map .mapBoxDetail dl dd {
    width: calc(100% - 200px)
}

#company .map .mapBoxDetail dl dd .address {
    margin-right: 15px
}

@media screen and (max-width: 960px) {
    #company .map .mapBoxDetail dl dd {
        width: 100%
    }

    #company .map .mapBoxDetail dl dd .c-buttonGoogle {
        margin-top: 10px
    }
}

@media screen and (max-width: 1350px) {
    #history .history.sec {
        background: none
    }
}

#history .history.sec:before {
    display: none
}

@media screen and (max-width: 1350px) {
    #history .history .secInner {
        width: 100%;
        margin: 0
    }
}

#history .history_mainv {
    height: 800px;
    width: calc(100% - calc(50% - 650px));
    margin-top: -100px;
    background: url(../img/mainv_4.jpg) center;
    background-size: cover
}

@media screen and (max-width: 1350px) {
    #history .history_mainv {
        width: 100%;
        height: 700px
    }
}

@media screen and (max-width: 767px) {
    #history .history_mainv {
        height: 400px;
        margin-top: 0
    }
}

#history .history .yearBox {
    width: 880px;
    height: 740px;
    padding: 1px 100px
}

@media screen and (max-width: 1350px) {
    #history .history .yearBox {
        width: 70%
    }
}

@media screen and (max-width: 767px) {
    #history .history .yearBox {
        width: 90%;
        height: 280px;
        padding: 1px 30px
    }
}

#history .history .yearBox .yearTxt {
    display: block;
    line-height: 1;
    margin-top: 100px
}

#history .history .yearBox .yearTxt svg {
    width: 100%;
    height: auto
}

#history .history .yearBox .yearTxt .year {
    display: block;
    width: 360px
}

#history .history .yearBox .yearTxt .th {
    width: 216px;
    display: block;
    margin-top: 60px
}

#history .history .yearBox .yearTxt .th svg {
    vertical-align: top
}

@media screen and (max-width: 1150px) {
    #history .history .yearBox .yearTxt .year {
        width: 240px
    }

    #history .history .yearBox .yearTxt .th {
        margin-top: 30px;
        width: 150px
    }
}

@media screen and (max-width: 767px) {
    #history .history .yearBox .yearTxt {
        margin-top: 30px
    }

    #history .history .yearBox .yearTxt .year {
        width: 60%
    }

    #history .history .yearBox .yearTxt .th {
        margin-top: 20px;
        width: 32%
    }
}

#history .history .history_img2 {
    text-align: right;
    margin: -610px -70px 0 0
}

#history .history .history_img2 img {
    width: 600px
}

@media screen and (max-width: 1350px) {
    #history .history .history_img2 {
        margin: -360px 0 0 0
    }

    #history .history .history_img2 img {
        width: 50%
    }
}

@media screen and (max-width: 767px) {
    #history .history .history_img2 {
        margin: -90px 0 0 0
    }
}

#history .historyDetail {
    padding-top: 250px
}

@media screen and (max-width: 960px) {
    #history .historyDetail {
        padding-top: 150px
    }
}

@media screen and (max-width: 767px) {
    #history .historyDetail {
        padding-top: 0
    }
}

#history .historyDetailWrap {
    padding: 0 100px
}

@media screen and (max-width: 1350px) {
    #history .historyDetailWrap {
        padding: 0
    }
}

#history .historyDetailWrap_in {
    position: relative;
    padding-bottom: 150px
}

@media screen and (max-width: 767px) {
    #history .historyDetailWrap_in {
        padding: 100px 0
    }
}

#history .historyDetailWrap_in .line {
    display: block;
    height: 100%;
    width: 1px;
    background: #404040;
    position: absolute;
    top: 0;
    left: 0
}

#history .historyDetailBox {
    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;
    padding-left: 50px;
    position: relative
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox {
        display: block;
        padding-left: 30px
    }
}

#history .historyDetailBox+.historyDetailBox {
    margin-top: 40px
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox+.historyDetailBox {
        margin-top: 60px
    }
}

#history .historyDetailBox.-imgNone {
    min-height: 220px
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox.-imgNone {
        min-height: 1px
    }
}

#history .historyDetailBox.-imgNone .historyDetailBox_cnt {
    width: 100%
}

#history .historyDetailBox_cnt {
    width: calc(100% - 360px)
}

@media screen and (max-width: 1150px) {
    #history .historyDetailBox_cnt {
        width: calc(100% - 320px)
    }
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox_cnt {
        width: 100%
    }
}

#history .historyDetailBox_cnt .year {
    font-family: niveau-grotesk, sans-serif;
    font-size: 4.7rem;
    font-weight: 300;
    line-height: 0.7;
    border-bottom: 1px solid #B7B7B7;
    margin-bottom: 24px;
    padding-bottom: 24px;
    position: relative
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox_cnt .year {
        font-size: 3rem;
        margin-bottom: 10px;
        padding-bottom: 12px
    }
}

#history .historyDetailBox_cnt .year:before {
    content: '';
    display: block;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    background: #404040;
    position: absolute;
    bottom: -7px;
    left: -55px
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox_cnt .year:before {
        left: -35px
    }
}

#history .historyDetailBox_cnt .txt {
    padding-right: 20px
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox_cnt .txt {
        padding-right: 0
    }
}

#history .historyDetailBox_img {
    width: 360px
}

@media screen and (max-width: 1150px) {
    #history .historyDetailBox_img {
        width: 320px
    }
}

@media screen and (max-width: 960px) {
    #history .historyDetailBox_img {
        width: 100%;
        margin-top: 20px
    }
}

#contact .tel {
    margin-top: 0;
    background: #EAEAEA
}

#contact .tel:before {
    background: #EAEAEA
}

#contact .tel .secInner {
    padding: 140px 110px 140px 200px
}

@media screen and (max-width: 1350px) {
    #contact .tel .secInner {
        padding: 140px 110px 140px 110px
    }
}

@media screen and (max-width: 960px) {
    #contact .tel .secInner {
        padding: 180px 0 100px 0
    }
}

#contact .telTxt1 {
    color: #2f2f2f;
    font-size: 5rem;
    font-family: niveau-grotesk, sans-serif;
    font-weight: 200;
    margin-bottom: 10px
}

@media screen and (max-width: 1350px) {
    #contact .form {
        background: #fff
    }
}

#contact .form .secInner {
    padding: 140px 260px 80px 200px
}

@media screen and (max-width: 1350px) {
    #contact .form .secInner {
        padding: 140px 110px 80px 110px
    }
}

@media screen and (max-width: 960px) {
    #contact .form .secInner {
        padding: 180px 0 70px 0
    }
}

#contact .formTxt1 {
    margin-bottom: 30px
}

#contact .formCnt {
    margin-bottom: 30px
}

#contact .formCnt dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 960px) {
    #contact .formCnt dl {
        display: block
    }
}

#contact .formCnt dl+dl {
    margin-top: 25px
}

@media screen and (max-width: 960px) {
    #contact .formCnt dl+dl {
        margin-top: 15px
    }
}

#contact .formCnt dl dt {
    width: 180px;
    padding-top: 14px
}

@media screen and (max-width: 960px) {
    #contact .formCnt dl dt {
        width: 100%;
        padding-top: 0
    }
}

#contact .formCnt dl dd {
    width: calc(100% - 180px)
}

@media screen and (max-width: 960px) {
    #contact .formCnt dl dd {
        width: 100%
    }
}

#contact .formCnt input,
#contact .formCnt select {
    width: 387px;
    height: 52px;
    border-radius: 8px
}

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

    #contact .formCnt input,
    #contact .formCnt select {
        width: 100%;
        height: 45px
    }
}

#contact .formCnt input.w100p,
#contact .formCnt select.w100p {
    width: 100%
}

#contact .formCnt input.zip,
#contact .formCnt select.zip {
    width: 176px
}

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

    #contact .formCnt input.zip,
    #contact .formCnt select.zip {
        width: calc(50% - 1em)
    }
}

#contact .formCnt textarea {
    height: 220px;
    border-radius: 8px
}

@media screen and (max-width: 960px) {
    #contact .formCnt textarea {
        height: 180px
    }
}

#contact .formCnt select {
    background: #EAEAEA url("../img/select-bg.png") no-repeat;
    background-position: calc(100% - 20px) center;
    background-size: 16px
}

#contact .form .policyBox {
    padding: 60px;
    border: 1px solid #6C6C6C
}

@media screen and (max-width: 960px) {
    #contact .form .policyBox {
        padding: 30px 10px
    }
}

#contact .form .policyBoxTxt1 {
    color: #2F2F2F;
    text-align: center
}

#contact .form .policyBoxTxt1 span {
    text-decoration: underline;
    cursor: pointer
}

#contact .form .policyBoxTxt1 span:hover {
    text-decoration: none
}

#contact .form .policyBox .checkboxTxt {
    color: #2F2F2F;
    font-size: 1.8rem;
    text-align: center;
    margin-top: 10px
}

#contact .form .policyBox .checkboxTxt input[type="checkbox"] {
    display: none
}

#contact .form .policyBox .checkboxTxt input[type="checkbox"]+span {
    position: relative
}

#contact .form .policyBox .checkboxTxt input[type="checkbox"]+span:before {
    content: '';
    width: 23px;
    height: 23px;
    border-radius: 50%;
    border: 3px solid #D0D0D0;
    display: inline-block;
    margin: 0 8px -4px 0
}

#contact .form .policyBox .checkboxTxt input[type="checkbox"]:checked+span:before {
    background: #D0D0D0
}

#contact .form .policyBoxCnt {
    padding: 50px 0 50px
}

@media screen and (max-width: 960px) {
    #contact .form .policyBoxCnt {
        padding: 30px 0 30px
    }
}

#contact .form .policyBoxCnt p {
    margin-bottom: 1.5em
}

#contact .form .policyBoxCnt ul {
    margin-bottom: 1.5em
}

#contact .form .policyBoxCnt ul li {
    text-indent: -1em;
    padding-left: 1em
}

#contact .form .buttonBox button {
    color: #fff;
    font-size: 1.8rem;
    background: #2F2F2F;
    width: 300px;
    height: 60px;
    margin: 60px auto 0;
    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;
    border-radius: 30px
}

#contact .form .buttonBox button.is-off {
    opacity: 0.6
}

#contact .form .myError {
    color: #f00;
    display: inline-block;
    margin-top: 5px
}

#contact .form input.myError,
#contact .form textarea.myError,
#contact .form select.myError {
    border: 1px solid #f00;
    background-color: #fde8e8
}

/*# sourceMappingURL=styles.css.map */


@media screen and (max-width: 1024px) {
    .navigationInnerList li {
        margin-left: 26px;
    }

    .headerInner_logo img {
        width: 150px;
    }

    .headerInner_logo {
        left: 20px;
    }

    .navigation {
        /* right: 20px; */
    }

    .backgroundMovie video {
        display: none;
    }

    #index .backgroundMovie .cover.is-active,
    #index .backgroundMovie .cover {
        background: url(../img/mainv_m_4.jpg) center/cover no-repeat;
    }

    /* .backgroundMovie-img{
        height: 100vh;
    } */
}

@media screen and (max-width: 767px) {
    #index .mainSec .secInner .row .ani._3 {
        font-size: 1.8rem;
    }

    #index .mainSec .secInner {
        letter-spacing: 0.05em;
        font-size: 2.8rem;
    }

    #index .secBox_tit {
        font-size: 3rem;
        margin-bottom: 10px;
        line-height: 45px;
    }
}


.cookie {
    position: fixed;
    right: 0;
    bottom: 0;
    width: 35%;
    z-index: 555;


}

.cookie_box {
    background: #fff;
    width: 100%;
    padding: 4.1875rem 3.25rem;
    overflow: hidden;
}

.cookie_box .cookie_top {
    font-size: 1rem;
    line-height: 1.875rem;
    color: #595959;
    float: left;

}

.cookie_but span {
    display: inline-block;
    padding: 0 2.8125rem;
    line-height: 2.5rem;
    background: #595959;
    border-radius: .375rem;
    cursor: pointer;
}

.cookie_but {
    float: right;
}

.cookie-cli {
    color: #000000;
    position: absolute;
    right: .9375rem;
    top: .9375rem;
}