xmp,pre{
    max-width: 100%;
    white-space: pre-wrap;
    font-weight: inherit !important;
    font-size: inherit !important;
    font-family: inherit !important;
    line-height: inherit !important;
}

textarea{
    font-weight: inherit !important;
    font-size: inherit !important;
    font-family: inherit !important;
    line-height: inherit !important;
}
.layered-popup {
    display:none;
    position: absolute;
    width:400px;
    z-index: 8;
    top:70px;
    font-size:20px;
    padding-left:5px;
    padding-right:5px;
}
.popup-wrap {
    position: absolute;
    width: 100%;
    text-align: center;
}
.popup-inner{
    position: relative;
    width: 1460px;
    display: inline-block;
}
.layered-popup img {
    width: 100%;
    border: 1px solid black;
    float: left;
    /*height: 340px;*/
}
.layered-popup .button_area{
    text-align: center;
}
.layered-popup .button_area .button{
    background-color: #B69F6D;
    color: white;
    display: inline-block;
    width: 50%;
    float: left;
    font-size: 13px;
    padding: 8px 12px;
    cursor: pointer;
}
.layered-popup .button_area .button:nth-child(1){
    border-right: 1px solid black;
}
.text-tiny{
    font-size: 0.7em !important;
}
.text-small{
    font-size: 0.85em !important;
}
.text-big{
    font-size: 1.4em !important;
}
.text-huge{
    font-size: 1.8em !important;
}
#ai_chat_pop iframe{
    width: 100%;
    height: 100%;
    border: 0;
}
.sub1_2_new_sec .service_tab_area li a{
    border: 1px solid #03adff;
}
.service_tab .ss_tab_area li a{
    border: 2px solid #03adff;
}
.sub_cont .clean_list *{
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
@media only screen and (max-width: 1200px){
    .sub5_2 .show_w_box{
        flex-direction: column;
    }
    .sub5_2 .show_contact{
        display: block;
        width: 100%;
    }
}

@media only screen and (max-width: 1024px){
    .layered-popup{
        left: unset !important;
        right: 50px !important;
        top: 80px !important;
    }
    .popup-wrap{
        width: 100%;
    }
    .popup-inner{
        width: 100%;
    }
    .pop-img-wrap{
        height: 200px;
    }
    #contact_step iframe{
        min-height: 700px;
        max-height: 800px;
        height: 120vw;
    }
    .sub_cont .fs-20 {
        font-size: clamp(15px, 2vw, 38px);
    }
    .sub_cont .clean_list li dl dt::after{
        z-index: 1;
    }
    .sub_cont .clean_list li dd>*{
        z-index: 2;
    }
    .visual_wrap .scroll-nav ul{
        gap: 0;
        justify-content: space-evenly;
    }
    .visual_wrap .scroll-nav ul li a{
        font-size: clamp(10px, 4.2vw, 17px);
    }
}

@media only screen and (max-width: 768px){
    .layered-popup{
        left:0px!important;
        top:66px!important;
        width: 100% !important;
        padding:0px!important;
    }
    .layered-popup img{
        width: 100%;
        /*height: 100vw;*/
    }

    .showroom {
        display: flex !important;
        width: 100%;
        /*max-width: 300px;*/
        margin: 0 auto;
        overflow-x: scroll;
        gap: 0 15px;
        div {
            span {
                border-radius: 15px;
                white-space: nowrap;
                display: block;
                background: #fff;
                padding: 10px 15px;
                border: 1px solid var(--line-color);
            }
            img {
                height: 50px;
            }
        }
    }
}


.dialog {
    &.open {
        display: flex;
    }
    display: none;
    position: fixed;
    flex-direction: column;
    background-color: #fff;
    width: 100%;
    z-index: 444301;

    max-width: 560px;
    inset: 50% auto auto 50%;
    border-radius: 5px;
    transform: translate(-50%, -50%);
}

.dialog-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1rem;
    border-bottom: 1px solid #f3f4f5;
    h2 {
        font-size: 1.25rem;
    }
}

.dialog-body {
    text-align: center;
    padding: 48px 0 64px;
    p {
        line-height: 1.5rem
    }

    .qrcode {
        img {
            width: 210px;
            padding: 40px 0;
        }
    }

    .gck808d {
        position: absolute;
        padding: 0;
        border: none;
        background: none;
        cursor: pointer;
        width: 24px;
        height: 24px;
        top: calc(1rem + 2px);
        right: 1rem;
        color: #2a3038;
    }
}

@keyframes enter {
    0% {
        opacity: 1;
    }
}

.gck8089 {
    &.open {
        display: flex;
    }
    display: none;

    animation: enter;
    animation-timing-function: cubic-bezier(.35, 0, .35, 1);
    animation-duration: .15s;

    position: fixed;
    z-index: 444300;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #00000080;
}

@media only screen and (max-width: 425px){
    .show_contact #contact_step{
        padding: 10px;
    }
}
@media only screen and (max-width: 375px){
    .show_contact .tit > *,
    .show_contact #contact_step iframe{
        zoom: 0.8;
    }

    .show_contact .tit {
        flex-direction: column;
        color: #000 !important;;
    }
}
@media only screen and (max-width: 300px){
    .show_contact .tit > *,
    .show_contact #contact_step iframe{
        zoom: 0.6;
    }
}
@media only screen and (max-width: 250px){
    .show_contact #contact_step iframe{
        zoom: 0.4;
    }
}

.mobile {
    display: none;
}

@media only screen and (max-width: 768px) {
    .mobile {
        display: block;
    }
}

footer .bottom .adr_list + .adr_list .s_nm {
    min-width: 120px;
    max-width: 120px;
}

.showroom-step-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 100;
    /*opacity: 0;*/
    /*visibility: hidden;*/
    /*pointer-events: none;*/
    transition-duration: 1s;
    .showroom_step-inner {
        position: relative;
        width: 100%;
        height: 100%;
    }
}

.sr-pointer-wrap {
    position: absolute;
    .sr-pointer-inner {
        position: relative;
    }
}

.sr-pointer-wrap .sr-pointer:hover ~ .sr-pointer-tip-wrap {
    opacity: 1;
    visibility: visible;
}

.sr-pointer-wrap .sr-pointer-tip-wrap {
    position: absolute;
    left: 50%;
    top: 40px;
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
}

.sr-pointer-tip-inner {
    position: relative;
    text-align: center;
    padding-top: 14px;
    display: block;
    .box-text {
        display:block;
        background-color: rgb(255, 255, 255);
        white-space: nowrap;
        font-size: 14px;
        font-style: normal;
        line-height: 1;
        letter-spacing: -0.3px;
        color: #000000;
        text-align: center;
        padding: 13px 24px;
        border-radius: 22px;
    }
    .triangle-top {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-bottom: 14px solid rgb(255, 255, 255);
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
    }
}

.sr-pointer:hover .sr-pointer-tip-wrap {
    visibility: visible;
    opacity: 1;
}

.sr-pointer.active:hover .sr-pointer-pin {
    width: 24px;
    height: 24px;
    /*opacity: 0;*/
}

.sr-pointer.blue .sr-pointer-pin {
    background: #1d6ceb;
}

.sr-pointer-pin {
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #fff;
    z-index: 3;
    transition: 0.2s ease-out;
}