@charset "utf-8";
/*-------------------------------------------------
Author : WB,Seo
Create date : 2023. 06. 27.
Last update : 
-------------------------------------------------*/

/* ==================================
    MOBILE
=================================== */
/* ============= VISUAL === */
#vs-slider .slick-dots {
    position: absolute;
    width: 100%; bottom: 16px;
    text-align: center;
}
#vs-slider .slick-dots li {
    display: inline-block;
    font-size: 0;
    width: 12px; height: 12px;
    background: rgba(255,255,255,.6);
    border-radius: 100%;
    cursor: pointer;
}
#vs-slider .slick-dots li:nth-child(n+2) {margin-left: 9px;}
#vs-slider .slick-dots li.slick-active {background: #f1551a;}

/* ============= MIDDLE === */
.middle-inner {
    padding: 20px 16px;
    background: #f1eee9;
}
.middle-inner .snb {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.middle-inner .snb li a {font-size: 1.3rem;}
.middle-inner .snb li.logo img {width: 22px;}

/* ============= ABOUT === */
.about-inner {background: url(/image/main/main_about_bg.jpg) no-repeat center/cover;}
.about-inner :is(.upper-area, .lower-area) {position: relative;}
.about-inner .upper-area {
    padding: 58px 16px;
    text-align: center;
}
.about-inner :is(.upper-area .bg, .lower-area .bg) {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
}
.about-inner .upper-area .bg {background: rgba(255,255,255,.7);}
.about-inner .upper-area :is(.title, .cont, .btn-link) {
    position: relative;
    color: var(--font);
    z-index: 2;
}
.about-inner .upper-area .title {
    font-size: 1.8rem;
    font-weight: 700;
}
.about-inner .upper-area .cont {
    margin: 18px 0 24px;
    font-size: 1.5rem;
    line-height: 1.5;
    white-space: pre-line;
    word-break: keep-all;
}
.about-inner .upper-area .btn-link {
    display: block;
    width: 160px; line-height: 40px;
    margin: 0 auto;
    font-size: 1.5rem;
    border: 1px solid var(--font);
}
.about-inner .upper-area .btn-link:hover {
    color: #fff;
    background: var(--font);
    transition: all .5s;
}
.about-inner .lower-area {
    display: flex;
    padding: 25px 16px;
    justify-content: space-between;
    align-items: center;
}
.about-inner .lower-area .bg {background: rgba(0,0,0,.3);}
.about-inner .lower-area :is(.title, .cont, .btn-link) {
    position: relative;
    color: #fff;
    z-index: 2;
}
.about-inner .lower-area .title {
    font-size: 1.8rem;
    font-weight: 700;
}
.about-inner .lower-area .cont {
    margin-top: 6px;
    font-size: 1.4rem;
    letter-spacing: -0.05rem;
}
.about-inner .lower-area .btn-link {
    width: 75px; line-height: 59px;
    font-size: 1.4rem;
    border: 1px solid rgba(255,255,255,.6);
    text-align: center;
}

#visual {
    margin: 0 0 234px;
}

/* ==================================
    PC
=================================== */
/* @media screen and (min-width:1084px){ */

    /* ==================================
        RESET
    =================================== */

    /* ============= MIDDLE === */
    .middle-inner {padding: 35px 0;}
    .middle-inner .snb {
        width: 1200px;
        margin: 0 auto;
    }
    .middle-inner .snb li a {font-size: 1.6rem;}
    .middle-inner .snb li.logo {margin-top: -8px;}
    .middle-inner .snb li.logo img {width: 42px;}
    
    /* ============= ABOUT === */
    .about-inner .upper-area {padding: 167px 0 154px;}
    .about-inner .upper-area .title {font-size: 2.4rem;}
    .about-inner .upper-area .title:after {
        display: block;
        content: '';
        width: 46px; height: 1px;
        margin: 34px auto 42px;
        background: var(--font);
    }
    .about-inner .upper-area .cont {
        margin: 0 0 54px;
        font-size: 1.5rem;
        line-height: 24px;
    }
    .about-inner .upper-area .cont strong {font-weight: 600;}
    .about-inner .upper-area .btn-link {width: 195px; line-height: 50px;}
    .about-inner .lower-area {
        display: block;
        padding: 61px 0 56px;
        text-align: center;
    }
    .about-inner .lower-area .title {
        font-size: 3rem;
        font-weight: 300;
    }
    .about-inner .lower-area .cont {
        margin: 24px 0;
        font-size: 1.5rem;
        letter-spacing: 0;
    }
    .about-inner .lower-area .btn-link {
        display: block;
        width: 195px; line-height: 50px;
        margin: 0 auto;
        font-size: 1.5rem;
    }
    .about-inner .lower-area .btn-link:hover {
        color: #000;
        background: #fff;
        transition: all .5s;
    }
    .visual__item{
        width: 100%; 
        height: 330px; 
        background: url('/image/main/main_img_item01.png') no-repeat center/cover;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        left: 0;
        bottom: 0;
    }
    .visual__item_list{
        width: 750px;
        height: 330px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .visual__item_list_wp{
        width: 100%;
        height: 330px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .visual__item_list_wp a.but02 {
        width: 50%;
        height: 100%;
        background: url('/image/main/bt_02.png') no-repeat center/contain;
        
    }

    .visual__item_list_wp a.but01 {
        width: 50%;
        height: 100%;
        background: url('/image/main/bt_01.png') no-repeat center/contain;
    }
    
    .visual__item_list_wp a:nth-child(1):hover {
        background-image: url('/image/main/bt_01_1.png');
    }

    .visual__item_list_wp a:nth-child(2):hover {
        background-image: url('/image/main/bt_02_1.png');
    }



    .guarantee-box {
        width: 100%;
        height: 680px;
        background: url('/image/main/guarantee-box.png') no-repeat center/cover;
        display: flex;
        align-items: flex-end;
        /* display: flex;
        align-items: center;
        justify-content: center;
        position: static;
        left: 0;
        bottom: 0; */
    }

    .guarantee-box__item {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        height: calc(100% - 140px);
        display: flex;
        align-items: center;
        justify-content: center;
    }
        
    .snb-guarantee-box__item {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 100px;
        /* outline: 1px solid red; */
    }

    .snb-guarantee-box__item li {
        width: calc((100% - 300px) / 4);
        height: 100%;
        /* outline: 1px solid green; */
    }
    .snb-guarantee-box__item li a {
        display: block;
        width: 100%;
        height: 100%;
        background: url('/image/main/rental_e3_off.png') no-repeat center/contain;
    }

    /* .snb-guarantee-box__item a.item01 {
        background-image: url('/image/main/rental_e3_off.png');
    } */
    .snb-guarantee-box__item a.item02 {

        background-image: url('/image/main/rental_e5_off.png');
    }
    .snb-guarantee-box__item a.item03 {
        background-image: url('/image/main/rental_e7_off.png');
    }
    .snb-guarantee-box__item a.item04 {
        background-image: url('/image/main/rental_e11_off.png');
    }


    .snb-guarantee-box__item  a.item01:hover {
        background-image: url('/image/main/rental_e3_on.png');
    }
    .snb-guarantee-box__item  a.item02:hover {
        background-image: url('/image/main/rental_e5_on.png');
    }
    .snb-guarantee-box__item  a.item03:hover {
        background-image: url('/image/main/rental_e7_on.png');
    }
    .snb-guarantee-box__item  a.item04:hover {
        background-image: url('/image/main/rental_e11_on.png');
    } 

    .block-name__container{
        width: 100%;
        height: 680px;
        background: url('/image/main/main_sub_bg.png') no-repeat center/cover;
        display: flex;
        align-items: flex-end;
    }

    .block-name__container_name {
        width: 100%;
        max-width: 1200px;
        margin: 0 auto;
        height: calc(100% - 140px);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .block-name__container_name_wp {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .block-name__container_name_wp li {
        width: calc((100% - 50px) / 5);
        height: 100%;
    }

    .block-name__container_name_wp li a {
        display: block;
        width: 100%;
        height: 100%;
        background: url('/image/main/sub1_block_off.jpg') no-repeat center/contain;
    }

    .block-name__container_name_wp a.sub2_block {
        background-image: url('/image/main/sub2_block_off.jpg');
    }
    .block-name__container_name_wp a.sub3_block {
        background-image: url('/image/main/sub3_block_off.jpg');
    }
    .block-name__container_name_wp a.sub4_block {
        background-image: url('/image/main/sub4_block_off.jpg');
    }
    .block-name__container_name_wp a.sub5_block {
        background-image: url('/image/main/sub5_block_off.jpg');
    }

    .block-name__container_name_wp  a.sub1_block:hover {
        background-image: url('/image/main/sub1_block_on.jpg');
    }
    .block-name__container_name_wp  a.sub2_block:hover {
        background-image: url('/image/main/sub2_block_on.jpg');
    }
    .block-name__container_name_wp  a.sub3_block:hover {
        background-image: url('/image/main/sub3_block_on.jpg');
    }
    .block-name__container_name_wp  a.sub4_block:hover {
        background-image: url('/image/main/sub4_block_on.jpg');
    } 
    .block-name__container_name_wp  a.sub5_block:hover {
        background-image: url('/image/main/sub5_block_on.jpg');
    } 

    .sub_block li a:hover{
        color: gold;
    }

    .list-table__button_wp{
        background: url('/image/main/main_visual5.png') no-repeat center / cover;
        height: 275px;
    }

    .list-table__button_wp{
        display: flex;
        align-items: center;
        justify-content: right;
        padding-right: 300px;
        gap: 0 70px;
    }
/* } */