/* 상세 */
.center {
    text-align: center;
}
br.pc {
    display: block;
}
br.mo {
    display: none;
}
.product .view_visual .btn_list {
    color: #fff;
}
.product .view_visual .btn_list::before {
    filter: brightness(0) invert(1);
}
.product .view_visual .type_title {
    margin-top: 2rem;
    color: #fff;
}

.product .view_visual .ic {
    display: block;
    margin: 0 auto;
    width: 8.6rem;
    height: 8.6rem;
}

.product .view_visual .ic img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product .view_visual em {
    display: block;
    margin-top: 0.6rem;
    color: #fff;
    font-size: 3rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.03rem;
}

.product .view_visual p {
    font-weight: 400;
    color: #fff;
}

.product .view_visual .solution_tag {
    justify-content: center;
}
.product .view_visual .solution_tag li {
    background-color: rgba(255, 255, 255, 0.1);
    border: none;
}
.product .view_visual .solution_tag li p {
    color: #fff;
}
.diagram {
    padding: 13rem 0;
    background: #f7f8f9;
}

.about_product {
    background-color: #f7f8f9;
    padding: 10rem 0;
    color: #000000;
}

.about_product .content > p {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -0.02rem;
    word-break: keep-all;
}

.about_list {
    /*	border: 1px solid black;*/
    margin: 3rem 0;
}

.about_list li {
    padding: 2.4rem 4rem;
    margin-bottom: 1rem;
    border: 1px solid #11111133;
    border-radius: 1rem;
}

.about_list li p {
}

.about_list li p span {
    font-weight: 700;
}

.characteristic {
    margin-top: 13rem;
}

.characteristic ul > li {
    padding: 2.4rem 4rem;
    margin-bottom: 0.5rem;
    border-radius: 1.6rem;
    background: var(--color-wht-off);
    overflow: hidden;
}

.characteristic ul > li.on button::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.characteristic .characteristic_title {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}

.characteristic .characteristic_title strong {
    color: #111;
    font-size: 2.2rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -0.022rem;
}

.characteristic .characteristic_title button {
    position: relative;
    display: block;
    width: 2.2rem;
    height: 2.2rem;
    font-size: 0;
    cursor: pointer;
    background: transparent;
}

.characteristic .characteristic_title button::before {
    content: "";
    width: 2.2rem;
    height: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #111;
}

.characteristic .characteristic_title button::after {
    content: "";
    width: 2.2rem;
    height: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-90deg);
    transition: transform 0.2s;
    background-color: #111;
}

.characteristic .on .characteristic_title button::after {
    transform: translate(-50%, -50%) rotate(-180deg);
}

.characteristic .characteristic_content {
    display: none;
    padding: 3rem 0 2rem;
}

.characteristic .characteristic_content .list li {
    color: #333;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: -0.018rem;
    word-break: keep-all;
}

.characteristic li.none_content button {
    display: none;
}

.benefit {
    margin: 13rem 0;
}

.benefit ol {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    margin-right: -2rem;
}

.benefit ol li {
    width: calc(100% / 3 - 2rem);
    min-height: 21.8rem;
    padding: 3.8rem;
    border-radius: 1.6rem;
    border: 1px solid rgba(17, 17, 17, 0.15);
    background: #fff;
}

.benefit ol li.half {
    width: calc(100% / 2 - 2rem);
}

.benefit ol li em {
    display: block;
    color: #111;
    font-family: Red Hat Display;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.04rem;
    word-break: keep-all;
}

.benefit ol li p {
    margin-top: 3.2rem;
    color: #111;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: -0.02rem;
    word-break: keep-all;
}

.product .view_list_box {
    margin-top: 8rem;
}

.product .product_list {
    margin-right: -2rem;
}

.subsidiary_info_wrap {
    padding: 9rem 0;
}

.subsidiary_info_area {
    display: flex;
    position: relative;
    margin-bottom: 13rem;
}

.subsidiary_info_area:last-child {
    margin-bottom: 0;
}

.sia_img {
    padding-right: 3.8rem;
}

.sia_img img {
    /*width: 76rem;*/
    min-width: 52rem;
    border-radius: 3rem;
    height: 300px;
}

.sia_sub {
    width: 70%;
    letter-spacing: -0.17px;
    color: #111;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.sia_sub h3 {
    font-size: 3rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.sia_sub p {
    font-size: 1.7rem;
    line-height: 1.6;
    padding-bottom: 2rem;
    display: flex;
    word-break: keep-all;
}

.dream_curator {
    padding: 9rem 0;
}

.deco_type4 .flex {
    justify-content: flex-end;
}

.main_marquee {
    position: relative;
    padding-bottom: 25.6rem;
    z-index: -1;
}

.main_marquee::before {
    content: "";
    background: url(/assets/images/main_bg2-2857b64fde53865e203497a82790086a.jpg) no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 255.8rem;
    height: 126.8rem;
}

.marquee_wrap .logo_left,
.marquee_wrap .logo_right {
    height: 16rem;
    position: relative;
    margin-bottom: 1rem;
}

.marquee_wrap .logo_left > div,
.marquee_wrap .logo_right > div {
    position: absolute;
    top: 0;
}

.marquee_wrap .js-marquee {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.marquee_wrap div .logo_box {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    width: 34rem;
    height: 16rem;
    margin-right: 1rem;
    border-radius: 1.6rem;
    border: 1px solid #e6e6e6;
    background: #fff;
}
.itext .marquee_wrap div .logo_box {
    background: transparent;
    border: none;
}
.itext .marquee_wrap {
    margin-top: 10rem;
}
.marquee_wrap div .logo_box img {
    max-width: 100%;
    /*	max-height: 100%;*/
    object-fit: contain;
}

.s_text {
    margin-bottom: 5rem;
    color: #000;
    font-size: 2.4rem;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.024rem;
}

.s_text b {
    font-weight: 700;
}

@media (max-width: 1180px) {
    br.pc {
        display: none;
    }
    br.mo {
        display: block;
    }
    .product .view_visual .type_title {
        margin-top: calc(100vw * (20 / 1180));
    }

    .product .view_visual .ic {
        width: calc(100vw * (86 / 1180));
        height: calc(100vw * (86 / 1180));
    }

    .product .view_visual em {
        margin-top: calc(100vw * (6 / 1180));
        font-size: calc(100vw * (30 / 1180));
        letter-spacing: calc(100vw * (-0.3 / 1180));
    }

    .diagram {
        padding: calc(100vw * (130 / 1180)) 0;
    }

    .about_product .content > p {
        font-size: calc(100vw * (18 / 1180));
        letter-spacing: calc(100vw * (-0.18 / 1180));
    }

    .about_list li {
        padding: calc(100vw * (24 / 1180)) calc(100vw * (40 / 1180));
        border-radius: calc(100vw * (12 / 767));
    }

    .about_list li p {
        font-size: calc(100vw * (18 / 1180));
        letter-spacing: calc(100vw * (-0.18 / 1180));
    }

    .characteristic {
        margin-top: calc(100vw * (130 / 1180));
    }

    .characteristic ul > li {
        padding: calc(100vw * (24 / 1180)) calc(100vw * (40 / 1180));
        margin-bottom: calc(100vw * (5 / 1180));
        border-radius: calc(100vw * (16 / 1180));
    }

    .characteristic .characteristic_title strong {
        font-size: calc(100vw * (22 / 1180));
        letter-spacing: calc(100vw * (-0.22 / 1180));
    }

    .characteristic .characteristic_title button {
        width: calc(100vw * (22 / 1180));
        height: calc(100vw * (22 / 1180));
    }

    .characteristic .characteristic_title button::before {
        width: calc(100vw * (22 / 1180));
    }

    .characteristic .characteristic_title button::after {
        width: calc(100vw * (22 / 1180));
    }

    .characteristic .characteristic_content {
        padding: calc(100vw * (30 / 1180)) 0 calc(100vw * (20 / 1180));
    }

    .characteristic .characteristic_content .list li {
        font-size: calc(100vw * (18 / 1180));
        letter-spacing: calc(100vw * (-0.18 / 1180));
    }

    .benefit {
        margin: calc(100vw * (130 / 1180)) 0;
    }

    .benefit ol {
        gap: calc(100vw * (20 / 1180));
        margin-right: calc(100vw * (-20 / 1180));
    }

    .benefit ol li {
        width: calc(100% / 3 - calc(100vw * (20 / 1180)));
        min-height: calc(100vw * (197 / 1180));
        padding: calc(100vw * (34 / 1180));
        border-radius: calc(100vw * (15 / 1180));
    }

    .benefit ol li.half {
        width: 100%;
    }

    .benefit ol li em {
        font-size: calc(100vw * (24 / 1180));
        letter-spacing: calc(100vw * (-0.36 / 1180));
    }

    .benefit ol li p {
        margin-top: calc(100vw * (30 / 1180));
        font-size: calc(100vw * (18 / 1180));
        letter-spacing: calc(100vw * (-0.18 / 1180));
    }

    .product .view_list_box {
        margin-top: calc(100vw * (80 / 1180));
    }

    .product .product_list {
        margin-right: calc(100vw * (-20 / 1180));
    }

    .subsidiary_info_wrap {
        padding: 3rem 0 6rem;
    }

    .subsidiary_info_area {
        display: flex;
        position: relative;
        margin-bottom: calc(100vw * (130 / 1180));
    }

    .subsidiary_info_area:last-child {
        margin-bottom: 0;
    }

    .sia_img {
        padding-right: calc(100vw * (38 / 1180));
    }

    .sia_img img {
        width: calc(100vw * (520 / 1180));
        height: calc(100vw * (280 / 1180));
        min-width: calc(100vw * (520 / 1180));
        border-radius: calc(100vw * (30 / 1180));
    }

    .sia_sub {
        letter-spacing: calc(100vw * (-0.26 / 1180));
        color: #111;
    }

    .sia_sub h3 {
        font-size: calc(100vw * (28 / 1180));
        font-weight: 700;
        margin-bottom: calc(100vw * (20 / 1180));
    }

    .sia_sub p {
        font-size: calc(100vw * (22 / 1180));
        line-height: calc(100vw * (30 / 1180));
        padding-bottom: calc(100vw * (20 / 1180));
    }

    .dream_curator {
        padding: calc(100vw * (120 / 1180)) 0;
    }

    .main_marquee {
        padding-bottom: calc(100vw * (242 / 1180));
    }

    .main_marquee::before {
        background: url(/assets/images/main_bg2_tb-6e3e0699778c0eaf43f2b45e32a4061b.jpg) no-repeat;
        background-size: contain;
        width: calc(100vw * (2028 / 1180));
        height: calc(100vw * (1050 / 1180));
    }

    .marquee_wrap .logo_left,
    .marquee_wrap .logo_right {
        height: calc(100vw * (102 / 1180));
        margin-bottom: calc(100vw * (10 / 1180));
    }

    .marquee_wrap div .logo_box {
        /*padding: calc(100vw * (35/ 1180));*/
        width: calc(100vw * (218 / 1180));
        height: calc(100vw * (102 / 1180));
        margin-right: calc(100vw * (10 / 1180));
        border-radius: calc(100vw * (16 / 1180));
    }

    .s_text {
        margin-bottom: calc(100vw * (50 / 1180));
        font-size: calc(100vw * (22 / 1180));
        letter-spacing: calc(100vw * (-0.22 / 1180));
    }
}

@media (max-width: 767px) {
    .product_pdf_tabmenu li button {
        font-size: calc(100vw * (32 / 767));
        padding: calc(100vw * (20 / 767)) calc(100vw * (40 / 767));
        height: auto;
    }

    .product .view_visual .type_title {
        margin-top: calc(100vw * (24 / 767));
    }

    .product .view_visual .ic {
        width: calc(100vw * (130 / 767));
        height: calc(100vw * (130 / 767));
    }

    .product .view_visual em {
        margin-top: calc(100vw * (4 / 767));
        font-size: calc(100vw * (34 / 767));
        letter-spacing: calc(100vw * (-0.34 / 767));
    }

    .product .view_visual {
        padding-bottom: calc(100vw * (140 / 767));
    }

    .product .center {
        margin-top: calc(100vw * (60 / 767));
    }

    .diagram {
        padding: calc(100vw * (130 / 767)) 0;
    }

    .about_product .content > p {
        font-size: calc(100vw * (32 / 767));
        letter-spacing: calc(100vw * (-0.32 / 767));
        word-break: keep-all;
    }

    .about_list li {
        padding: calc(100vw * (30 / 767)) calc(100vw * (40 / 767));
        margin-bottom: calc(100vw * (5 / 767));
        border-radius: calc(100vw * (16 / 767));
        min-height: calc(100vw * (130 / 767));
        display: flex;
        align-items: center;
    }

    .about_list li p {
        font-size: calc(100vw * (32 / 767));
        letter-spacing: calc(100vw * (-0.32 / 767));
        word-break: keep-all;
    }

    .characteristic {
        margin-top: calc(100vw * (54 / 767));
    }

    .characteristic ul > li {
        padding: calc(100vw * (30 / 767)) calc(100vw * (40 / 767));
        margin-bottom: calc(100vw * (5 / 767));
        border-radius: calc(100vw * (16 / 767));
    }

    .characteristic .characteristic_title strong {
        font-size: calc(100vw * (30 / 767));
        letter-spacing: calc(100vw * (-0.3 / 767));
    }

    .characteristic .characteristic_title button {
        width: calc(100vw * (30 / 767));
        height: calc(100vw * (30 / 767));
    }

    .characteristic .characteristic_title button::before {
        width: calc(100vw * (30 / 1180));
    }

    .characteristic .characteristic_title button::after {
        width: calc(100vw * (30 / 1180));
    }

    .characteristic .characteristic_content {
        padding: calc(100vw * (30 / 767)) 0 calc(100vw * (10 / 767));
    }

    .characteristic .characteristic_content .list li {
        font-size: calc(100vw * (26 / 767));
        letter-spacing: calc(100vw * (-0.26 / 767));
    }

    .benefit {
        margin: calc(100vw * (130 / 767)) 0;
    }

    .benefit ol {
        gap: calc(100vw * (20 / 767));
        margin-right: 0;
    }

    .benefit ol li {
        width: 100%;
        min-height: 100%;
        padding: calc(100vw * (50 / 767)) calc(100vw * (70 / 767));
        border-radius: calc(100vw * (30 / 767));
    }

    .benefit ol li em {
        font-size: calc(100vw * (32 / 767));
        letter-spacing: calc(100vw * (-0.64 / 767));
    }

    .benefit ol li p {
        margin-top: calc(100vw * (40 / 767));
        font-size: calc(100vw * (26 / 767));
        letter-spacing: calc(100vw * (-0.3 / 767));
    }

    .product .view_list_box {
        margin-top: calc(100vw * (38 / 767));
    }

    .product .product_list {
        margin-right: 0;
    }

    .product .product_intro .container > .flex .content > ul {
        display: block;
    }

    .product .product_intro .container > .flex .content > ul > li {
        float: none;
        margin-bottom: calc(100vw * (20 / 767));
    }

    .product .product_intro .container > .flex .content > ul > li:last-child {
        margin-bottom: 0;
    }

    .subsidiary_info_wrap {
        padding: 3rem 0 6rem;
    }

    .subsidiary_info_wrap {
        padding-top: calc(100vw * (120 / 767));
    }

    .subsidiary_info_area {
        display: flex;
        position: relative;
        margin-bottom: calc(100vw * (130 / 767));
        flex-direction: column;
    }

    .subsidiary_info_area:last-child {
        margin-bottom: 0;
    }

    .sia_img {
        padding-right: 0;
    }

    .sia_img img {
        height: calc(100vw * (500 / 1180));
        width: 100%;
        min-width: 100%;
        border-radius: calc(100vw * (30 / 767));
    }

    .sia_sub {
        width: 100%;
        letter-spacing: calc(100vw * (-0.26 / 767));
        color: #111;
        padding-top: calc(100vw * (60 / 767));
    }

    .sia_sub h3 {
        font-size: calc(100vw * (40 / 767));
        padding-bottom: calc(100vw * (10 / 767));
    }

    .sia_sub p {
        font-size: calc(100vw * (32 / 767));
        line-height: calc(100vw * (64 / 1180));
        padding-bottom: calc(100vw * (20 / 767));
        word-break: keep-all;
    }

    .main_marquee {
        padding-bottom: calc(100vw * (415 / 767));
    }

    .main_marquee::before {
        background: url(/assets/images/main_bg2_mo-01255caf05ace691cd81f3bcf3103907.jpg) no-repeat;
        background-size: contain;
        width: calc(100vw * (1968 / 750));
        height: calc(100vw * (1368 / 750));
    }

    .marquee_wrap .logo_left,
    .marquee_wrap .logo_right {
        height: calc(100vw * (160 / 767));
        margin-bottom: calc(100vw * (10 / 767));
    }

    .marquee_wrap div .logo_box {
        /*padding: calc(100vw * (50/ 767));*/
        width: calc(100vw * (340 / 767));
        height: calc(100vw * (160 / 767));
        margin-right: calc(100vw * (10 / 767));
        border-radius: calc(100vw * (16 / 767));
    }

    .s_text {
        margin-bottom: calc(100vw * (60 / 767));
        font-size: calc(100vw * (28 / 767));
        letter-spacing: calc(100vw * (-0.28 / 767));
    }
}