@-webkit-keyframes animation-mask {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(70.3125%, 1350px);
        mask-size: min(70.3125%, 1350px)
    }
}

@keyframes animation-mask {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(70.3125%, 1350px);
        mask-size: min(70.3125%, 1350px)
    }
}

@-webkit-keyframes animation-mask--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(70.3125%, 1350px);
        mask-size: min(70.3125%, 1350px)
    }
}

@keyframes animation-mask--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(70.3125%, 1350px);
        mask-size: min(70.3125%, 1350px)
    }
}

@-webkit-keyframes animation-mask--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 800px;
        mask-size: 800px
    }
}

@keyframes animation-mask--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 800px;
        mask-size: 800px
    }
}

@-webkit-keyframes animation-mask--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 465px;
        mask-size: 465px
    }
}

@keyframes animation-mask--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 465px;
        mask-size: 465px
    }
}

@-webkit-keyframes animation-person {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 56%
    }
}

@keyframes animation-person {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 56%
    }
}

@-webkit-keyframes animation-person--pc {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: clamp(370px, 25.60875vw, 491.688px)
    }
}

@keyframes animation-person--pc {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: clamp(370px, 25.60875vw, 491.688px)
    }
}

@-webkit-keyframes animation-person--tb {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 54%
    }
}

@keyframes animation-person--tb {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 54%
    }
}

@-webkit-keyframes animation-person--sp {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 55.5%
    }
}

@keyframes animation-person--sp {
    0% {
        opacity: 0;
        top: 100%
    }

    50% {
        top: 100%
    }

    100% {
        top: 55.5%
    }
}

@-webkit-keyframes animation-mask-small {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 1050px;
        mask-size: 1050px
    }
}

@keyframes animation-mask-small {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 1050px;
        mask-size: 1050px
    }
}

@-webkit-keyframes animation-mask-small--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(83.1770833333%, 1597px);
        mask-size: min(83.1770833333%, 1597px)
    }
}

@keyframes animation-mask-small--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: min(83.1770833333%, 1597px);
        mask-size: min(83.1770833333%, 1597px)
    }
}

@-webkit-keyframes animation-mask-small--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 800px;
        mask-size: 800px
    }
}

@keyframes animation-mask-small--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 800px;
        mask-size: 800px
    }
}

@-webkit-keyframes animation-mask-small--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 465px;
        mask-size: 465px
    }
}

@keyframes animation-mask-small--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 465px;
        mask-size: 465px
    }
}

@-webkit-keyframes animation-mask-contact {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 860px;
        mask-size: 860px
    }
}

@keyframes animation-mask-contact {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 860px;
        mask-size: 860px
    }
}

@-webkit-keyframes animation-mask-contact--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 1091px;
        mask-size: 1091px
    }
}

@keyframes animation-mask-contact--pc {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 1091px;
        mask-size: 1091px
    }
}

@-webkit-keyframes animation-mask-contact--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 670px;
        mask-size: 670px
    }
}

@keyframes animation-mask-contact--tb {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 670px;
        mask-size: 670px
    }
}

@-webkit-keyframes animation-mask-contact--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 492px;
        mask-size: 492px
    }
}

@keyframes animation-mask-contact--sp {
    0% {
        -webkit-mask-size: 0;
        mask-size: 0
    }

    100% {
        -webkit-mask-size: 492px;
        mask-size: 492px
    }
}

body {
    color: #000
}

.l-group-footer {
    padding-bottom: 65px !important
}

.p-faq-pagetop.fixed {
    z-index: 99999
}

.l-contents {
    background: #fff;
    font-size: 14px
}

.l-dc-grid--two-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width: 767px) {
    .l-dc-grid--two-column {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.l-dc-section {
    padding: 0 0 80px;
    position: relative
}

@media screen and (max-width: 767px) {
    .l-dc-section {
        padding: 0 0 60px
    }
}

.l-dc-section--bg-01 {
    background: #50ced0;
    padding: 80px 0 0;
    z-index: 10
}

@media(min-width: 1316px) {
    .l-dc-section--bg-01 .l-dc-section__inner {
        max-width: 1345px;
        width: max(70.15625%, 1030px);
        padding: 0 15px
    }
}

@media screen and (max-width: 767px) {
    .l-dc-section--bg-01 {
        padding: 20px 0 0
    }
}

.l-dc-section--bg-01::after {
    background: #50ced0;
    border-bottom-right-radius: 150px;
    bottom: -80px;
    content: "";
    height: 80px;
    position: absolute;
    width: 100%
}

@media screen and (max-width: 767px) {
    .l-dc-section--bg-01::after {
        border-bottom-right-radius: 100px;
        bottom: -82px;
        height: 83px;
        width: 104%;
        left: -15px
    }
}

.l-dc-section--bg-02 {
    background: #ffe835;
    padding: 160px 0 0;
    z-index: 5
}

@media screen and (max-width: 767px) {
    .l-dc-section--bg-02 {
        padding: 113px 0 0
    }
}

.l-dc-section--bg-02::after {
    background: #ffe835;
    border-bottom-right-radius: 150px;
    bottom: -80px;
    content: "";
    height: 80px;
    position: absolute;
    width: 100%
}

@media screen and (max-width: 767px) {
    .l-dc-section--bg-02::after {
        border-bottom-right-radius: 100px;
        bottom: -82px;
        height: 83px;
        width: 104%;
        right: -15px
    }
}

.l-dc-section--bg-03,
.l-dc-section--bg-04 {
    background: #f4f4f4;
    padding: 160px 0 0;
    z-index: 1
}

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

    .l-dc-section--bg-03,
    .l-dc-section--bg-04 {
        padding: 123px 0 0
    }
}

.l-dc-section--bg-03::after,
.l-dc-section--bg-04::after {
    background: #f4f4f4;
    border-bottom-left-radius: 150px;
    bottom: -80px;
    content: "";
    height: 80px;
    position: absolute;
    width: 100%
}

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

    .l-dc-section--bg-03::after,
    .l-dc-section--bg-04::after {
        border-bottom-left-radius: 100px;
        bottom: -82px;
        height: 83px;
        width: 104%;
        left: -15px
    }
}

@media(min-width: 1316px) {

    .l-dc-section--bg-03 .l-dc-section__inner,
    .l-dc-section--bg-04 .l-dc-section__inner {
        max-width: 1345px
    }
}

@media(min-width: 1316px) {

    .l-dc-section--bg-03 .c-dc-heading-01,
    .l-dc-section--bg-04 .c-dc-heading-01 {
        margin: 0 0 38px
    }
}

.l-dc-section--bg-04 {
    background: none;
    padding: 80px 0 0;
    z-index: 10
}

.l-dc-section--bg-04::after {
    background: #fff;
    bottom: -70px;
    height: 70px
}

.l-dc-section__inner {
    margin: auto;
    max-width: 1000px;
    padding: 0 30px
}

@media(min-width: 1316px) {
    .l-dc-section__inner {
        width: max(70.15625%, 1030px);
        max-width: 1345px;
        padding: 0 15px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .l-dc-section__inner {
        padding: 0
    }
}

@media screen and (max-width: 767px) {
    .l-dc-section__inner {
        padding: 0 24px
    }
}

.c-dc-mask {
    -webkit-mask-image: url(/common/img/business/service/demandcontroller/img_binoculars.png);
    mask-image: url(/common/img/business/service/demandcontroller/img_binoculars.png);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: min(70.3125%, 1350px);
    mask-size: min(70.3125%, 1350px);
    position: relative
}

@media(min-width: 1316px) {
    .c-dc-mask {
        -webkit-mask-size: min(70.3125%, 1350px);
        mask-size: min(70.3125%, 1350px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-mask {
        -webkit-mask-size: 465px;
        mask-size: 465px;
        -webkit-mask-position: center 58%;
        mask-position: center 58%
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-mask {
        -webkit-mask-size: 800px;
        mask-size: 800px;
        -webkit-mask-position: center 65%;
        mask-position: center 65%
    }
}

.c-dc-text {
    font-size: 16px;
    margin: 0 0 15px
}

@media screen and (max-width: 767px) {
    .c-dc-text {
        font-size: 14px;
        margin: 0 0 10px
    }
}

@media(min-width: 1316px) {
    .c-dc-text__wrapper {
        max-width: 1317px;
        width: max(68.59375vw, 1000px);
        margin: 0 auto
    }
}

.c-dc-text--lg {
    font-size: 19px
}

@media screen and (max-width: 767px) {
    .c-dc-text--lg {
        font-size: 18px;
        margin: 0 0 10px
    }
}

.c-dc-text--xl {
    font-size: 35px;
    margin: 0 0 23px
}

@media(min-width: 1316px) {
    .c-dc-text--xl {
        margin: 0 0 38px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-text--xl {
        font-size: 26px;
        margin: 0 0 20px
    }
}

.c-dc-text--sm {
    font-size: 12px
}

.c-dc-text--link {
    color: #000
}

.c-dc-text--link .c-icon-gl {
    fill: #50ced0
}

.c-dc-text--note {
    font-size: 12px;
    margin: 10px 0 0;
    padding-left: 3em;
    text-indent: -3em
}

.c-dc-list {
    font-size: 14px
}

.c-dc-list .c-dc-text--note {
    margin: 0
}

.c-dc-list__item {
    padding: 0 0 0 10px;
    position: relative;
    margin: 0 0 3px
}

.c-dc-list__item:last-child {
    margin: 0
}

.c-dc-list__item::before {
    background: #000;
    border-radius: 50%;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    top: 9px;
    width: 3px
}

.c-dc-heading--sub-01,
.c-dc-heading--sub-02 {
    margin: 0 0 15px 0;
    padding: 0 0 0 35px;
    position: relative
}

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

    .c-dc-heading--sub-01,
    .c-dc-heading--sub-02 {
        margin: 0 0 12px;
        padding: 23px 0 0
    }
}

.c-dc-heading--sub-01::after,
.c-dc-heading--sub-01::before,
.c-dc-heading--sub-02::after,
.c-dc-heading--sub-02::before {
    background: #ffe835;
    border-radius: 50%;
    content: "";
    height: 11px;
    position: absolute;
    top: 7px;
    width: 11px
}

.c-dc-heading--sub-01::after,
.c-dc-heading--sub-02::after {
    left: 9px
}

.c-dc-heading--sub-01::before,
.c-dc-heading--sub-02::before {
    left: 0
}

.c-dc-heading--sub-02::after,
.c-dc-heading--sub-02::before {
    background: #50ced0
}

.c-dc-heading--sub-03 {
    background: #50ced0;
    border-radius: 30px;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    margin: 0 0 30px;
    padding: 0px 15px
}

@media screen and (max-width: 767px) {
    .c-dc-heading--sub-03 {
        font-size: 14px;
        margin: 0 0 20px
    }
}

.c-dc-heading-01 {
    font-size: 35px;
    letter-spacing: .05em;
    line-height: 52.5px;
    margin: 0 0 38px
}

@media screen and (max-width: 767px) {
    .c-dc-heading-01 {
        font-size: 26px;
        line-height: 160%;
        margin: 0 0 20px;
        padding: 0
    }
}

.c-dc-heading-02 {
    font-size: 32px;
    font-weight: 600;
    margin: 0 0 30px
}

.c-dc-heading-02 span {
    font-size: 19px
}

@media screen and (max-width: 767px) {
    .c-dc-heading-02 span {
        font-size: 17px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-heading-02 {
        font-size: 24px;
        margin: 0 0 18px
    }
}

.c-dc-heading-03 {
    color: #50ced0;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 15px;
    padding: 0 0 0 13px;
    position: relative
}

.c-dc-heading-03::before {
    background: #50ced0;
    border-radius: 50%;
    content: "";
    height: 6px;
    left: 0;
    position: absolute;
    top: 7px;
    width: 6px
}

.c-dc-box__link {
    display: block;
    max-width: 900px;
    margin: 0 auto;
    -webkit-transition: .2s;
    transition: .2s
}

.c-dc-box__link:hover {
    opacity: .8
}

.c-dc-box--case {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: auto
}

@media(min-width: 1316px) {
    .c-dc-box--case {
        max-width: 1345px;
        margin: 0 -15px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--case {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        max-width: 297px;
        position: relative;
        top: 30px;
        z-index: 20
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--case {
        max-width: 600px
    }
}

.c-dc-box--case .c-dc-box__img {
    margin: 0 0 30px;
    text-align: center
}

@media(min-width: 1316px) {
    .c-dc-box--case .c-dc-box__img {
        width: 85%;
        margin: 0 auto 30px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--case .c-dc-box__img img {
        width: 192px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--case .c-dc-box__img img {
        width: auto
    }
}

.c-dc-box--case .c-dc-box__item {
    width: 260px
}

@media(min-width: 1316px) {
    .c-dc-box--case .c-dc-box__item {
        width: 402px;
        padding: 0 15px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--case .c-dc-box__item {
        margin: 0 0 35px;
        width: 100%
    }

    .c-dc-box--case .c-dc-box__item:last-child {
        margin: 0
    }

    .c-dc-box--case .c-dc-box__item:last-child .c-dc-text {
        margin: 0
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--case .c-dc-box__item {
        max-width: 100%
    }
}

.c-dc-box--binoculars .c-dc-mask {
    background: #fff;
    height: 580px;
    -webkit-mask-size: 0;
    mask-size: 0;
    position: relative
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-mask {
        height: min(43.9583333333vw, 844px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-mask {
        -webkit-mask-position: center 75%;
        mask-position: center 75%
    }
}

.c-dc-box--binoculars .c-dc-mask.is-active {
    -webkit-animation-name: animation-mask-small;
    animation-name: animation-mask-small;
    -webkit-animation-duration: .7s;
    animation-duration: .7s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-mask-size: 1050px;
    mask-size: 1050px;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-small--pc;
        animation-name: animation-mask-small--pc;
        -webkit-mask-size: min(83.1770833333%, 1597px);
        mask-size: min(83.1770833333%, 1597px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-small--sp;
        animation-name: animation-mask-small--sp;
        -webkit-mask-size: 465px;
        mask-size: 465px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-small--tb;
        animation-name: animation-mask-small--tb;
        -webkit-mask-size: 800px;
        mask-size: 800px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars {
        height: 549px
    }
}

.c-dc-box--binoculars .c-dc-heading--sub-02 {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 15px
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-heading--sub-02 {
        margin: 0 0 15px
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-heading--sub-02 {
        font-size: 14px;
        padding: 0 0 0 35px;
        margin: 0 0 12px
    }
}

.c-dc-box--binoculars .c-dc-box__inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    left: 0;
    margin: auto;
    max-width: 1068px;
    position: absolute;
    right: 0;
    top: 25%;
    z-index: 10
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-box__inner {
        max-width: 1597px;
        width: 83.1770833333vw
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__inner {
        height: auto;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 0 0 253px;
        top: 130px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__inner {
        max-width: 630px
    }
}

.c-dc-box--binoculars .c-dc-box__item {
    width: 564px
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__item {
        position: relative;
        width: 100%;
        z-index: 50
    }
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-box__item {
        width: 800px
    }
}

.c-dc-box--binoculars .c-dc-box__item:first-child {
    padding: 100px 55px 80px 100px
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-box__item:first-child {
        padding: 100px min(7.5520833333vw, 148px) 80px min(7.5520833333vw, 148px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__item:first-child {
        padding: 0
    }

    .c-dc-box--binoculars .c-dc-box__item:first-child .c-dc-text {
        margin: 0
    }
}

.c-dc-box--binoculars .c-dc-box__item:last-child {
    padding: 100px 100px 80px 55px
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-box__item:last-child {
        padding: 100px min(5.2083333333vw, 100px) 80px min(2.8645833333vw, 55px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__item:last-child {
        height: 100%;
        padding: 0
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__text-area {
        padding: 0 24px
    }

    .c-dc-box--binoculars .c-dc-box__text-area .c-dc-text,
    .c-dc-box--binoculars .c-dc-box__text-area .c-dc-text--xl {
        padding: 0 15px
    }

    .c-dc-box--binoculars .c-dc-box__text-area .c-dc-text {
        line-height: 200%
    }
}

.c-dc-box--binoculars .c-dc-box__img {
    padding: 16px 0 0;
    text-align: center
}

@media(min-width: 1316px) {
    .c-dc-box--binoculars .c-dc-box__img {
        max-width: 100%;
        width: 33.5057291667vw;
        padding: 0
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__img {
        top: 0;
        left: 0;
        margin: auto;
        padding: 0;
        position: absolute;
        right: 0;
        width: 292px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--binoculars .c-dc-box__img {
        top: -30%
    }
}

.c-dc-box--radius {
    background: #f4f4f4;
    border-radius: 150px;
    padding: 80px 0
}

@media screen and (max-width: 767px) {
    .c-dc-box--radius {
        border-radius: 100px;
        padding: 62px 24px 60px
    }
}

.c-dc-box--radius .c-dc-heading-01 {
    margin: 0 0 38px
}

@media screen and (max-width: 767px) {
    .c-dc-box--radius .c-dc-heading-01 {
        margin: 0 0 20px
    }
}

.c-dc-box--radius .c-dc-box__inner {
    margin: auto;
    padding: 0 30px;
    max-width: 1000px
}

@media(min-width: 1316px) {
    .c-dc-box--radius .c-dc-box__inner {
        max-width: 1345px;
        width: max(70.15625%, 1030px);
        padding: 0 15px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--radius .c-dc-box__inner {
        padding: 0
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--radius .c-dc-box__inner {
        padding: 0
    }
}

.c-dc-box--square {
    padding: 80px 0;
    position: relative;
    z-index: 1
}

@media screen and (max-width: 767px) {
    .c-dc-box--square {
        margin: 20px 0 0;
        padding: 60px 24px 60px
    }
}

.c-dc-box--square::after {
    background: #f4f4f4;
    border-radius: 150px 0px 0px 150px;
    content: "";
    height: 98%;
    position: absolute;
    right: 0;
    top: 0;
    width: 45%;
    z-index: -1
}

@media screen and (max-width: 767px) {
    .c-dc-box--square::after {
        border-radius: 100px 0px 0px 100px
    }
}

.c-dc-box--square~.c-dc-box--square {
    margin-top: 10px
}

.c-dc-box--square .l-dc-grid__item {
    margin: 60px 0 0
}

@media screen and (max-width: 767px) {
    .c-dc-box--square .l-dc-grid__item {
        margin: 30px 0 0
    }
}

.c-dc-box--square .l-dc-grid__item:first-child {
    max-width: 459px
}

.c-dc-box--square .l-dc-grid__item:first-child .c-dc-text--sm {
    padding: 0 0 0 13px
}

.c-dc-box--square .l-dc-grid__item:last-child .c-dc-text--sm {
    margin: 10px 0 0
}

.c-dc-box--square .c-dc-heading-02 {
    position: relative
}

.c-dc-box--square .c-dc-heading-02 img {
    bottom: 20px;
    position: absolute;
    left: 200px
}

@media(min-width: 1316px) {
    .c-dc-box--square .c-dc-heading-02 img {
        bottom: -20px;
        left: 232px;
        width: min(8.2291666667vw, 158px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--square .c-dc-heading-02 img {
        bottom: 0;
        left: 170px;
        width: 120px
    }
}

.c-dc-box--square .c-dc-box__img {
    margin: 0 0 10px;
    text-align: center
}

.c-dc-box--square .c-dc-box__inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: auto;
    padding: 0 30px;
    max-width: 1000px
}

@media(min-width: 1316px) {
    .c-dc-box--square .c-dc-box__inner {
        max-width: 1345px;
        width: max(70.15625%, 1030px);
        padding: 0 15px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .c-dc-box--square .c-dc-box__inner {
        padding: 0
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--square .c-dc-box__inner {
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 0
    }
}

.c-dc-box--square .c-dc-box__item:first-child {
    width: 260px
}

@media(min-width: 1316px) {
    .c-dc-box--square .c-dc-box__item:first-child {
        width: min(31.6628701595%, 417px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--square .c-dc-box__item:first-child {
        width: 100%;
        margin: 0 0 15px
    }
}

.c-dc-box--square .c-dc-box__item:first-child .c-dc-box__img {
    max-width: 176px
}

.c-dc-box--square .c-dc-box__item:last-child {
    width: 630px
}

@media(min-width: 1316px) {
    .c-dc-box--square .c-dc-box__item:last-child {
        width: min(63.0979498861%, 831px)
    }
}

@media screen and (max-width: 767px) {
    .c-dc-box--square .c-dc-box__item:last-child {
        width: 100%
    }
}

.c-dc-movie {
    text-align: center
}

@media(min-width: 1316px) {
    .c-dc-movie iframe {
        height: 500.8px !important;
        width: 670.4px !important
    }
}

@media screen and (max-width: 767px) {
    .c-dc-movie iframe {
        width: 100% !important
    }
}

.p-dc-floating-link {
    background: #50ced0;
    border: 3px solid #000;
    border-radius: 20px;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    padding: 30px;
    right: 0;
    z-index: 999
}

@media screen and (max-width: 767px) {
    .p-dc-floating-link {
        border-radius: 20px;
        font-size: 18px;
        padding: 15px;
        text-align: center;
        width: 100%
    }
}

.p-dc-floating-link:focus,
.p-dc-floating-link:hover {
    background: #fff;
    color: #50ced0
}

.p-dc-floating-link:focus span::before,
.p-dc-floating-link:hover span::before {
    background: url(/common/img/business/service/demandcontroller/icon_mail_gr.png) no-repeat;
    background-size: contain
}

.p-dc-floating-link span {
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    white-space: pre;
    padding: 35px 0 0;
    position: relative;
    width: 33px
}

@media screen and (max-width: 767px) {
    .p-dc-floating-link span {
        -webkit-writing-mode: horizontal-tb;
        -ms-writing-mode: lr-tb;
        writing-mode: horizontal-tb;
        white-space: normal;
        padding: 0 0 0 35px
    }
}

.p-dc-floating-link span::before {
    background: url(/common/img/business/service/demandcontroller/icon_mail.png) no-repeat;
    background-size: contain;
    content: "";
    height: 29px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 37px
}

@media screen and (max-width: 767px) {
    .p-dc-floating-link span::before {
        bottom: 0;
        height: 21px;
        right: auto;
        width: 27px
    }
}

.p-dc-faq .c-dc-heading-01 {
    margin: 0 0 38px
}

@media screen and (max-width: 767px) {
    .p-dc-faq .c-dc-heading-01 {
        margin: 0 0 20px
    }
}

.p-dc-faq__box {
    padding: 25px 100px
}

@media screen and (max-width: 767px) {
    .p-dc-faq__box {
        padding: 10px 15px
    }
}

.p-dc-faq__content {
    margin: auto;
    width: 100%
}

.p-dc-faq__icon::after,
.p-dc-faq__icon::before {
    background: #000;
    bottom: 0;
    content: "";
    margin: auto;
    position: absolute;
    top: 0;
    -webkit-transition: .2s;
    transition: .2s
}

.p-dc-faq__icon::after {
    height: 20px;
    right: 38px;
    width: 3px
}

@media screen and (max-width: 767px) {
    .p-dc-faq__icon::after {
        right: 18px
    }
}

.p-dc-faq__icon::before {
    height: 3px;
    right: 30px;
    width: 20px
}

@media screen and (max-width: 767px) {
    .p-dc-faq__icon::before {
        right: 10px
    }
}

.p-dc-faq__inner {
    display: none
}

.p-dc-faq__text {
    font-size: 16px;
    margin: 0 0 5px
}

@media screen and (max-width: 767px) {
    .p-dc-faq__text {
        font-size: 14px
    }
}

.p-dc-faq__title {
    background: #f4f4f4;
    border-radius: 5px 5px 0px 0px;
    font-size: 16px;
    font-weight: 600;
    padding: 23px 35px 23px 105px;
    position: relative;
    text-align: left;
    width: 100%
}

@media screen and (max-width: 767px) {
    .p-dc-faq__title {
        font-size: 14px;
        padding: 23px 35px 23px 60px
    }
}

.p-dc-faq__title::before {
    bottom: 0;
    content: "";
    height: 22px;
    left: 20px;
    margin: auto;
    position: absolute;
    top: 0;
    width: 41px
}

@media screen and (max-width: 767px) {
    .p-dc-faq__title::before {
        left: 10px
    }
}

.p-dc-faq__title.open .p-dc-faq__icon::after {
    height: 0
}

.p-dc-faq__item {
    margin: 0 0 5px
}

.p-dc-faq__item:last-child {
    margin: 0
}

.p-dc-faq__item:nth-child(1) .p-dc-faq__title::before {
    background: url(/common/img/business/service/demandcontroller/img_q1.png) no-repeat;
    background-size: contain;
    height: 19px
}

.p-dc-faq__item:nth-child(2) .p-dc-faq__title::before {
    background: url(/common/img/business/service/demandcontroller/img_q2.png) no-repeat;
    background-size: contain;
    height: 19px
}

.p-dc-faq__item:nth-child(3) .p-dc-faq__title::before {
    background: url(/common/img/business/service/demandcontroller/img_q3.png) no-repeat;
    background-size: contain
}

.p-dc-faq__item:nth-child(4) .p-dc-faq__title::before {
    background: url(/common/img/business/service/demandcontroller/img_q4.png) no-repeat;
    background-size: contain
}

.p-dc-faq__item:nth-child(5) .p-dc-faq__title::before {
    background: url(/common/img/business/service/demandcontroller/img_q5.png) no-repeat;
    background-size: contain
}

.p-dc-faq .c-dc-text--note {
    margin: 0
}

.p-dc-mv {
    background: #50ced0;
    height: 630px;
    height: min(47.9087452471vw, 776px);
    min-height: 500px;
    overflow: hidden;
    position: relative;
    z-index: 1
}

@media(min-width: 1316px) {
    .p-dc-mv {
        height: min(40.4166666667vw + 30px, 776px);
        padding: 30px 0 0
    }
}

@media(max-width: 1310px) {
    .p-dc-mv {
        max-height: 776px
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv {
        height: calc(100vh - 57px);
        max-height: 630px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv {
        height: calc(100vh - 110px)
    }
}

.p-dc-mv .c-dc-mask {
    background: url(/common/img/business/service/demandcontroller/img_bg.png);
    height: 100%;
    margin: auto;
    -webkit-animation-name: animation-mask;
    animation-name: animation-mask;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

@media(min-width: 1316px) {
    .p-dc-mv .c-dc-mask {
        -webkit-animation-name: animation-mask--pc;
        animation-name: animation-mask--pc
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv .c-dc-mask {
        -webkit-animation-name: animation-mask--sp;
        animation-name: animation-mask--sp
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv .c-dc-mask {
        -webkit-animation-name: animation-mask--tb;
        animation-name: animation-mask--tb
    }
}

.p-dc-mv__title {
    position: relative
}

.p-dc-mv__title img {
    width: clamp(450px, 42.4453125vw, 814.95px)
}

@media(min-width: 1316px) {
    .p-dc-mv__title img {
        width: min(42.4453125vw, 814.95px)
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__title img {
        width: 100%
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__title img {
        width: 100%
    }
}

.p-dc-mv__title span {
    display: none
}

.p-dc-mv__title--sub {
    margin: 0 0 28px;
    position: relative
}

@media screen and (max-width: 767px) {
    .p-dc-mv__title--sub {
        margin: 0 0 12px
    }
}

.p-dc-mv__title--sub img {
    width: clamp(350px, 32.9895833333vw, 633.4px)
}

@media screen and (max-width: 767px) {
    .p-dc-mv__title--sub img {
        width: 263px
    }
}

.p-dc-mv__title-area {
    left: 40px;
    position: absolute;
    top: 12.1673003802vw;
    z-index: 50
}

@media(min-width: 1316px) {
    .p-dc-mv__title-area {
        left: 0;
        top: min(11.25vw + 15px, 216px)
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__title-area {
        left: 25px;
        top: 30px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__title-area {
        left: 60px;
        top: 30px
    }
}

@media(min-width: 1316px) {
    .p-dc-mv__img-wrapper {
        height: 745px;
        margin: auto;
        max-width: 1350px;
        position: relative
    }
}

.p-dc-mv__img--en {
    bottom: 5%;
    position: absolute;
    right: 1.5%;
    width: max(11.875vw, 120px);
    z-index: 30
}

@media(min-width: 1316px) {
    .p-dc-mv__img--en {
        bottom: 5%;
        right: .5;
        -webkit-transform: translate(3%, 10%);
        transform: translate(3%, 10%);
        width: min(11.875vw, 228px)
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__img--en {
        bottom: 0;
        width: 109px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__img--en {
        bottom: 0;
        width: 150px
    }
}

.p-dc-mv__img--person {
    top: 56%;
    left: 22%;
    position: absolute;
    width: 212px;
    z-index: 10;
    -webkit-animation-name: animation-person;
    animation-name: animation-person;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear
}

@media(min-width: 1316px) {
    .p-dc-mv__img--person {
        top: clamp(370px, 25.60875vw, 491.688px);
        left: max(50% - 23.2vw, 229.547px);
        width: min(15.1041666667vw, 290px);
        -webkit-animation-name: animation-person--pc;
        animation-name: animation-person--pc
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__img--person {
        top: 55.5%;
        left: 0;
        width: 152px;
        -webkit-animation-name: animation-person--sp;
        animation-name: animation-person--sp
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__img--person {
        top: 54%;
        left: -2%;
        width: 290px;
        -webkit-animation-name: animation-person--tb;
        animation-name: animation-person--tb
    }
}

.p-dc-mv__img--phone {
    position: absolute;
    left: 45%;
    top: 50%;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    width: clamp(220px, 21.5104166667vw, 413px);
    z-index: 40
}

@media(min-width: 1316px) {
    .p-dc-mv__img--phone {
        left: 45%
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__img--phone {
        left: 16%;
        top: 60%;
        width: 200px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__img--phone {
        left: 25%;
        top: 49%;
        width: 43.1034482759vw
    }
}

.p-dc-mv__inner {
    height: 100%;
    left: 0;
    margin: auto;
    max-width: 1600px;
    width: 83.3333333333%;
    position: absolute;
    right: 0;
    top: 0
}

@media(min-width: 1316px) {
    .p-dc-mv__inner {
        width: 83.3333333333%
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-mv__inner {
        width: 100%
    }
}

@media screen and (max-width: 767px) {
    .p-dc-mv__inner {
        width: 100%
    }
}

.p-dc-contact .c-dc-text--sm {
    margin: 0 0 14px
}

@media screen and (max-width: 767px) {
    .p-dc-contact .c-dc-text--sm {
        margin: 0 0 7px
    }
}

.p-dc-contact .c-dc-text--lg {
    margin: 0 0 44px
}

@media screen and (max-width: 767px) {
    .p-dc-contact .c-dc-text--lg {
        margin: 0 0 15px
    }
}

.p-dc-contact .c-dc-mask {
    -webkit-mask-size: 0;
    mask-size: 0
}

.p-dc-contact .c-dc-mask.is-active {
    -webkit-animation-name: animation-mask-contact;
    animation-name: animation-mask-contact;
    -webkit-animation-duration: .7s;
    animation-duration: .7s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-mask-size: 860px;
    mask-size: 860px;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out
}

@media(min-width: 1316px) {
    .p-dc-contact .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-contact--pc;
        animation-name: animation-mask-contact--pc;
        height: 576px;
        -webkit-mask-size: 1091px;
        mask-size: 1091px
    }
}

@media screen and (max-width: 767px) {
    .p-dc-contact .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-contact--sp;
        animation-name: animation-mask-contact--sp;
        -webkit-mask-size: 492px;
        mask-size: 492px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-contact .c-dc-mask.is-active {
        -webkit-animation-name: animation-mask-contact--tb;
        animation-name: animation-mask-contact--tb;
        -webkit-mask-size: 670px;
        mask-size: 670px
    }
}

.p-dc-contact__content {
    background: #ffe835;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 455px;
    margin: auto;
    max-width: 1000px;
    overflow: hidden;
    position: relative
}

@media(min-width: 1316px) {
    .p-dc-contact__content {
        max-width: 1317px
    }
}

@media screen and (max-width: 767px) {
    .p-dc-contact__content {
        height: 260px
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-contact__content {
        height: 355px;
        max-width: 848px
    }
}

.p-dc-contact__btn {
    background: #50ced0;
    border: 3px solid #000;
    border-radius: 20px;
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: 600;
    padding: 33px 63px 33px 115px;
    position: relative;
    text-align: center
}

@media screen and (max-width: 767px) {
    .p-dc-contact__btn {
        font-size: 18px;
        padding: 23px 52px 23px 100px
    }
}

.p-dc-contact__btn:focus,
.p-dc-contact__btn:hover {
    background: #fff;
    color: #50ced0
}

.p-dc-contact__btn:focus::before,
.p-dc-contact__btn:hover::before {
    background: url(/common/img/business/service/demandcontroller/icon_mail_gr.png) no-repeat;
    background-size: contain
}

.p-dc-contact__btn::before {
    background: url(/common/img/business/service/demandcontroller/icon_mail.png) no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    height: 29px;
    left: 63px;
    margin: auto;
    position: absolute;
    top: 0;
    width: 37px
}

@media screen and (max-width: 767px) {
    .p-dc-contact__btn::before {
        left: 52px
    }
}

.p-dc-contact__btn-wrapper {
    margin: auto
}

.p-dc-contact__img--person {
    bottom: -17%;
    left: 7%;
    position: absolute;
    width: 180px
}

@media(min-width: 1316px) {
    .p-dc-contact__img--person {
        left: 9%;
        width: 224px
    }
}

@media screen and (max-width: 767px) {
    .p-dc-contact__img--person {
        bottom: -45%;
        left: -30px;
        width: 143px;
        z-index: 10
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-contact__img--person {
        bottom: -30%;
        left: 0;
        width: 180px
    }
}

.p-dc-table {
    overflow: hidden;
    border: 3px solid #50ced0;
    border-top: none;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 50px;
    width: 100%
}

@media(min-width: 1316px) {
    .p-dc-table {
        max-width: 1317px;
        width: max(68.59375vw, 1000px);
        margin: 0 auto
    }
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-table {
        width: 1000px
    }
}

@media screen and (max-width: 767px) {
    .p-dc-table {
        width: 1000px
    }
}

.p-dc-table .col-01 {
    width: 90px
}

@media(min-width: 1316px) {
    .p-dc-table .col-01 {
        width: 93px
    }
}

.p-dc-table .col-02 {
    width: 333px
}

@media(min-width: 1316px) {
    .p-dc-table .col-02 {
        width: 461px
    }
}

.p-dc-table .c-dc-list {
    font-weight: 600
}

.p-dc-table .c-dc-text--note {
    font-weight: 400
}

.p-dc-table th {
    background: #50ced0;
    border-left: 3px solid #f4f4f4
}

.p-dc-table td {
    background: #f4f4f4;
    border-left: 3px solid #50ced0
}

.p-dc-table td:first-child {
    border-left: 3px solid #f4f4f4
}

.p-dc-table thead th {
    padding: 34px 30px 33px
}

.p-dc-table thead th:first-child {
    background: #50ced0;
    border: none
}

.p-dc-table tbody td {
    padding: 20px 30px 50px;
    vertical-align: top
}

.p-dc-table tbody td:last-child {
    text-align: center;
    vertical-align: middle
}

.p-dc-table tbody td:last-child .c-dc-text {
    font-weight: 600;
    margin: 0 0 18px
}

.p-dc-table tbody td:last-child .c-dc-text--lg {
    font-size: 25px;
    font-weight: 600;
    margin: 0
}

.p-dc-table tbody th {
    background: #50ced0;
    border: none;
    color: #f4f4f4;
    font-size: 20px;
    font-weight: 600;
    padding: 16px 0 0;
    vertical-align: top;
    text-align: center
}

@media screen and (max-width: 767px) {
    .p-dc-table tbody th {
        padding: 42px 0 0
    }
}

.p-dc-table tbody th span {
    letter-spacing: 5px;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    white-space: pre
}

.p-dc-table__title {
    border-radius: 30px;
    color: #f4f4f4;
    font-size: 19px;
    font-weight: 600;
    margin: 0;
    text-align: center
}

.p-dc-table__title .c-dc-text--sm {
    font-weight: 400
}

@media(min-width: 520px)and (max-width: 767px) {
    .p-dc-table__wrapper {
        overflow-x: auto
    }
}

@media screen and (max-width: 767px) {
    .p-dc-table__wrapper {
        overflow-x: auto
    }
}

.u-dc-pt--150 {
    padding-top: 150px
}

.u-dc-pt--160 {
    padding-top: 160px
}

.u-dc-pt--170 {
    padding-top: 170px
}

.u-dc-pt--270 {
    padding-top: 270px
}

@media screen and (max-width: 767px) {
    .u-dc-pt-sp--145 {
        padding-top: 145px
    }
}

@media screen and (max-width: 767px) {
    .u-dc-pt-sp--165 {
        padding-top: 165px
    }
}

.c-bluebox__img {
    background: #57bfc3;
    border-radius: 18px;
    padding: 20px 0 5px
}

@media screen and (max-width: 767px) {
    .c-bluebox__img {
        border-radius: 2.34375vw
    }
}