﻿@charset "utf-8";
/* CSS Document */

/*--------------------------------------
    main
--------------------------------------*/

.visual{
    width:100%;
    height:auto;
    /*padding-top: 50%;
    padding-top: min(50%,950px);
    position: relative;*/
}
.visual .slick-track{
    /*width: 100% !important;*/
}
.visual .bg{
    width:100%;
    height:100%;
    position: absolute;
    top:0;
    left:0;
    z-index: -1;
}
/*.visual .bg img{
    width:100%;
    height:100%;
    object-fit: cover;
}*/
.visual h2{
    width:694px;
    height:459px;
    margin: auto;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index: 999;
}
@media (max-width: 768px) {
    .visual{
        padding-top: 0;
    }
    .visual .slick-slide{
        aspect-ratio:1 / 1;
    }
    .visual .slick-dots{
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap:10px;;
    }
    .visual .slick-dots li{
        text-indent: -9999px;
        overflow: hidden;
        width:40px;
        height:3px;
        background: #CCCCCC;
        border-radius: 2px;
    }
    .visual .slick-dots li button{
        text-indent: -9999px;
        overflow: hidden;
        width:100%;
        height:100%;
        background: rgba(0,0,0,0);
        border:none;
        -webkit-appearance: none;
        box-shadow: none;
        text-shadow: none;
        border-radius: 1px;
    }
    .visual .slick-dots li.slick-active{
        background: #FF7482;
    }
    .visual h2{
        width:75vw;
        height:auto;
    }
    .visual h2::after{
        content: "";
        width:100%;
        padding-top: 66.14%;
        display: block;
    }
    .visual h2 img{
        width:100%;
        height:100%;
        object-fit: contain;
        position: absolute;
        top:0;
        left:0;
    }
}

/*--------------------------------------
    campaignArea
--------------------------------------*/

.campaignArea{
    margin: 95px auto 0;
}
.campaignArea h2.style001 span{
    font-size:42px;
}
.campaignArea .slider{
    margin: 30px auto 0;
}
.campaignArea .slider .box{
    width:360px !important;
    height:180px !important;
    margin-left: 0;
    margin-right: 60px;
    border-radius: 6px;
    overflow: hidden;
}
.campaignArea .slider .box a{
    width:100%;
    height:100%;
    display: block;
}
.campaignArea .slider .box a img{
    width:100%;
    height:100%;
    object-fit: cover;
}
@media (max-width: 1500px) {
    .campaignArea .slider .box{
        width:calc(300px + (1vw - 11px)*15) !important;
        height:calc(150px + (1vw - 11px)*7.5) !important;
        margin-right: calc(30px + (1vw - 11px)*7.5);
    }
}
@media (max-width: 1100px) {
    .campaignArea .slider .box{
        width: 300px !important;
        height: 150px !important;
        margin-right: 30px;
    }
}
@media (max-width: 768px) {
    .campaignArea{
        margin: 40px auto 0 auto;
    }
    .campaignArea h2.style001 span{
        font-size:32px;
    }
    .campaignArea .slider{
        width:80vw;
    }
    .campaignArea .slider .box{
        width: 80vw !important;
        height: 40vw !important;
        margin-right: 20px;
    }
}

/*--------------------------------------
    movieArea
--------------------------------------*/
.movieArea{
    margin: 30px auto 134px;
}
@media (max-width: 768px) {
    .movieArea{
        margin: 20px auto 50px;
    }
}

/*--------------------------------------
    conceptArea
--------------------------------------*/

.conceptArea{
    width:100%;
    height:730px;
    height:min(calc(530px + ((1vw - 15px)*50)),730px);
    position: relative;
}
.conceptArea::before{
    width:64%;
    height:674px;
    height:min(calc(100% - (36px + ((1vw - 15px)*5))),674px);
    content: "";
    position: absolute;
    top:0;
    left:0;
    right:auto;
    bottom:auto;
    margin: auto;
    border-radius: 0 6px 6px 0;
    background: #FF7482;
    z-index: -1;
}
.conceptArea::after{
    width:79%;
    height:50%;
    content: "";
    position: absolute;
    top:auto;
    left:auto;
    right:0;
    bottom:0;
    margin: auto;
    border-radius: 6px 0 0 6px;
    background: rgba(255,116,130,0.18);
    z-index: -2;
}
.conceptArea h2.style001{
    font-size:100px;
    font-size:min(calc(60px + ((1vw - 15px)*10)),100px);
    line-height: 1.3;
    position: absolute;
    top:50px;
    top:min(calc(30px + ((1vw - 15px)*5)),50px);
    left:0;
    right:0;
    bottom:auto;
    display: block;
    transform: translate(0,-50%);
    z-index: 100;
    text-align: right;
    padding-right: 30px;
    padding-right: min(calc(15px + ((1vw - 15px)*3.5714)),30px);
}
.conceptArea h2.style001 span{
    font-size:100px;
    font-size:min(calc(60px + ((1vw - 15px)*10)),100px);
    line-height: 1;
}
.conceptArea .rightArea{
    width:52%;
    position: absolute;
    top:0;
    left:auto;
    right:0;
    bottom:0;
    margin: auto;
}
.conceptArea .rightArea .pic{
    width:100%;
    height:586px;
    height: min(calc(440px + ((1vw - 15px)*36.5)),586px);
    position: absolute;
    top:50px;
    top:min(calc(30px + ((1vw - 15px)*5)),50px);
    left:0;
    right:0;
    bottom:auto;
    margin: auto;
    border-radius: 6px 0 0 6px;
    overflow: hidden;
    z-index: 80;
}
.conceptArea .rightArea .pic img{
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin: auto;
}
.conceptArea .leftArea{
    width:29%;
    position: absolute;
    top:94px;
    top:min(calc(54px + ((1vw - 15px)*10)),94px);
    left:auto;
    right:60%;
    bottom:auto;
    margin: auto;
}
.conceptArea .leftArea h3{
    font-size:34px;
    font-size:min(calc(26px + ((1vw - 15px)*2)),34px);
    font-weight: 600;
    color:#FFFFFF;
    display: inline;
    background: linear-gradient(to right,#FFEF72 5px,transparent 5px) repeat-x left bottom/10px 5px;
    background: linear-gradient(to right,#FFEF72 min(calc(3px + ((1vw - 15px)*0.5)),5px),transparent min(calc(3px + ((1vw - 15px)*0.5)),5px)) repeat-x left bottom/min(calc(1vw - 9px),10px) min(calc(3px + ((1vw - 15px)*0.5)),5px);
    padding-bottom: 5px;
    padding-bottom: min(calc(3px + ((1vw - 15px)*0.5)),5px);
    line-height: 1.7;
}
.conceptArea .leftArea .text{
    font-size:18px;
    font-size:min(calc(16px + ((1vw - 15px)*0.5)),18px);
    font-weight: 600;
    color:#FFFFFF;
    line-height: 1.7;
    margin-top: 50px;
    margin-top: min(calc(30px + ((1vw - 15px)*5)),50px);
    margin-bottom: 90px;
    margin-bottom: min(calc(54px + ((1vw - 15px)*9)),90px);
}
.conceptArea .leftArea .btn{
    width:420px;
    width:min(calc(360px + ((1vw - 15px)*15)),420px);
    height:66px;
    height:min(calc(54px + ((1vw - 15px)*3)),66px);
    background: #FFFFFF;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 33px;
    border-radius: min(calc(27px + ((1vw - 15px)*1.5)),33px);
}
.conceptArea .leftArea .btn::after{
    content: "";
    width:7px;
    height:13px;
    background: url("../common/images/icon_arrow_pink.png") no-repeat center center/contain;
    position: absolute;
    top:0;
    left:auto;
    right:40px;
    right:min(calc(28px + ((1vw - 15px)*3)),40px);
    bottom:0;
    margin: auto;
}
.conceptArea .leftArea .btn span{
    font-size: 18px;
    font-size: min(calc(16px + ((1vw - 15px)*0.5)),18px);
    font-weight: 600;
    color:#FF7482;
}
@media (max-width: 1500px) {
    .conceptArea{
        height:530px;
        height:calc(410px + ((1vw - 11px)*30));
    }
    .conceptArea::before{
        height:494px;
        height:calc(382px + ((1vw - 11px)*30));
    }
    .conceptArea h2.style001{
        font-size:60px;
        font-size:calc(48px + ((1vw - 11px)*3));
        top:30px;
        top:calc(24px + ((1vw - 11px)*1.5));
        padding-right: 15px;
        padding-right: calc(12px + ((1vw - 11px)*0.75));
    }
    .conceptArea h2.style001 span{
        font-size:60px;
        font-size:calc(48px + ((1vw - 11px)*3));
    }
    .conceptArea .rightArea .pic{
        height:440px;
        height: calc(340px + ((1vw - 11px)*25));
        top:30px;
        top:calc(24px + ((1vw - 11px)*1.5));
    }
    .conceptArea .leftArea{
        top:54px;
        top:calc(48px + ((1vw - 11px)*1.5));
    }
    .conceptArea .leftArea h3{
        font-size:26px;
        font-size:calc(20px + ((1vw - 11px)*1.5));
        background: linear-gradient(to right,#FFEF72 3px,transparent 3px) repeat-x left bottom/6px 3px;
        background: linear-gradient(to right,#FFEF72 calc(2px + ((1vw - 11px)*0.25)),transparent calc(2px + ((1vw - 11px)*0.25)) repeat-x left bottom/calc(4px + ((1vw - 11px)*0.5)) calc(2px + ((1vw - 11px)*0.25)));
        padding-bottom: 3px;
        padding-bottom: calc(2px + ((1vw - 11px)*0.25));
    }
    .conceptArea .leftArea .text{
        font-size:16px;
        font-size:calc(14px + ((1vw - 11px)*0.5));
        margin-top: 30px;
        margin-top: calc(20px + ((1vw - 11px)*2.5));
        margin-bottom: 54px;
        margin-bottom: calc(32px + ((1vw - 11px)*5.5));
    }
    .conceptArea .leftArea .btn{
        width:360px;
        width:calc(320px + ((1vw - 11px)*10));
        height:54px;
        height:calc(44px + ((1vw - 11px)*2.5));
        border-radius: 27px;
        border-radius: calc(22px + ((1vw - 11px)*1.25));
    }
    .conceptArea .leftArea .btn::after{
        right:28px;
        right:calc(18px + ((1vw - 11px)*2.5));
    }
    .conceptArea .leftArea .btn span{
        font-size: 14px;
        font-size: calc(12px + ((1vw - 11px)*0.5));
    }
}
@media (max-width: 1100px) {
    .conceptArea{
        height:410px;
    }
    .conceptArea::before{
        height:382px;
    }
    .conceptArea h2.style001{
        font-size:48px;
        top:24px;
        padding-right: 12px;
    }
    .conceptArea h2.style001 span{
        font-size:48px;
    }
    .conceptArea .rightArea .pic{
        height:340px;
        top:24px;
    }
    .conceptArea .leftArea{
        width:314px;
        top:48px;
        right:min(calc(415px + ((1vw - 7.68px)*73.8)),660px);
    }
    .conceptArea .leftArea h3{
        font-size:20px;
        background: linear-gradient(to right,#FFEF72 2px,transparent 2px) repeat-x left bottom/4px 2px;
        padding-bottom: 2px;
    }
    .conceptArea .leftArea .text{
        font-size:14px;
        margin-top: 20px;
        margin-bottom: 32px;
    }
    .conceptArea .leftArea .btn{
        width:320px;
        height:44px;
        border-radius:22px;
    }
    .conceptArea .leftArea .btn::after{
        right:18px;
    }
    .conceptArea .leftArea .btn span{
        font-size: 12px;
    }
}
@media (max-width: 768px) {
    .conceptArea{
        height:auto;
    }
    .conceptArea::before{
        display: none;
    }
    .conceptArea::after{
        display: none;
    }
    .conceptArea h2.style001{
        font-size:24px;
        top:0;
        left:4%;
        right:4%;
        bottom:auto;
        transform: none;
        text-align: left;
        padding-right: 0;
    }
    .conceptArea h2.style001 span{
        font-size:24px;
        text-align: center;
    }
    .conceptArea .rightArea{
        width:100%;
        position: static;
        margin: 0 auto 0 auto;
        padding-top: 40px;
    }
    .conceptArea .rightArea .pic{
        height:auto;
        padding-top: 75%;
        position: relative;
        top:0;
        margin: auto;
        border-radius: 0 0 0 0;
    }
    .conceptArea .leftArea{
        width:100%;
        padding: 30px 4% 30px 4%;
        background: #FF7482;
        box-sizing: border-box;
        position: static;
    }
    .conceptArea .leftArea h3{
        font-size:18px;
    }
    .conceptArea .leftArea .btn{
        width:min(100%,320px);
        margin: auto;
    }
}


/*--------------------------------------
    eventArea
--------------------------------------*/

.eventArea{
    margin: 107px auto 126px;
}
.eventArea h2.style001 span{
    font-size:50px;
}
.eventArea article{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 60px;
    margin: 40px auto 0;
}
.eventArea article a h3{
    text-align: center;
}
.eventArea article a .thumb{
    width:100%;
    height:auto;
    padding-top: 100%;
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 15px;
}
.eventArea article a .thumb img{
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    top:0;
    left:0;
}
.eventArea article a span{
    width:78px;
    height:30px;
    line-height: 30px;
    display: block;
    text-align: center;
    font-size:15px;
    margin-bottom: 15px;
    color:#FFFFFF;
}
.eventArea article a span.status001{
    background: #5AD19A;
}
.eventArea article a span.status002{
    background: #FF7482;
}
.eventArea article a span.status001{
    background: #6E6E6E;
}
.eventArea article a h4{
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 20px;
}
.eventArea article a ul li{
    font-size: 15px;
    line-height: 1.2;
    margin-bottom: 2px;
}
@media (max-width: 1500px) {
    .eventArea article{
        column-gap: calc(30px + (1vw - 11px)*7.5);
    }
}
@media (max-width: 1100px) {
    .eventArea article{
        column-gap: 30px;
    }
}
@media (max-width: 768px) {
    .eventArea{
        margin: 50px auto 50px auto;
    }
    .eventArea h2.style001 span{
        font-size:32px;
    }
    .eventArea article{
        width:calc(100%,320px);
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
}


/*--------------------------------------
    worksArea
--------------------------------------*/

.worksArea{
    margin: 126px auto 0 auto;
    padding: 90px 0 124px 0;
    background: rgba(255,231,0,0.12);
    position: relative;
}
.worksArea h2.style001 span{
    font-size:50px;
}
.worksArea .bubble{
    background: url("../images/top/icon_works.png") no-repeat center center/contain;
    width:189px;
    height:189px;
    content: "";
    position: absolute;
    top:-10px;
    left:calc(50% - 432px);
    right:auto;
    bottom:auto;
    margin: auto;
    z-index: 10;
}
.worksArea .bubble span{
    font-size:20px;
    line-height: 1.4;
    font-weight: 600;
    position: absolute;
    top:50%;
    left:0;
    right:0;
    bottom:auto;
    transform: translate(0,-50%);
    text-align: center;
}
.worksArea article{
    position: relative;
    z-index: 999;
    width:863px;
    margin: 40px auto 160px;
    overflow: visible;
}
.worksArea article::after{
    background: url("../images/top/img_works.png") no-repeat center top/cover;
    width:256px;
    height:215px;
    content: "";
    position: absolute;
    top:-215px;
    left:auto;
    right:12px;
    bottom:auto;
    margin: auto;
    z-index: 10;
}
.worksArea article .slick-list{
    z-index: 1000;
    overflow: visible;
}
.worksArea article a{
    display: block;
    position: relative;
    margin-right: 73px;
    opacity: 0.4;
}
.worksArea article a.slick-active{
    opacity: 1;
}
.worksArea article a:hover{
    opacity: 0.4;
}
.worksArea article a.slick-active:hover{
    opacity: 0.4;
}
.worksArea article a .thumbArea{
    width:863px;
    height:auto;
    position: relative;
    padding-top: 68.7138%;
    z-index: 700;
}
.worksArea article a .thumbArea .thumb{
    width:100%;
    height:100%;
    z-index: 300;
    position: absolute;
    top:0;
    left:0;
    overflow: hidden;
}
.worksArea article a .thumbArea .thumb img{
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    top:0;
    left:0;
}
.worksArea article a .new .status{
    width:500px;
    height:500px;
    display: block;
    position: absolute;
    top:0;
    left:0;
    transform: translate(-30%,-30%) rotate(-45deg);
    overflow: hidden;
}
.worksArea article a .new .status::before{
    content: "NEW";
    width:100%;
    height:75px;
    font-size:50px;
    text-align: center;
    color:#FFFFFF;
    font-weight: bold;
    background: #FF7482;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin: auto;
    z-index: 999;
}
.worksArea article a .thumbArea .family{
    width:160px;
    height:160px;
    border-radius: 50%;
    z-index: 500;
    position: absolute;
    bottom:25px;
    right:25px;
    border:5px solid #FFFFFF;
    overflow: hidden;
}
.worksArea article a .thumbArea .family img{
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    top:0;
    left:0;
}
.worksArea article a .inner{
    width:582px;
    height:auto;
    padding: 30px 52px 30px 52px;
    box-sizing: border-box;
    border-radius: 6px;
    background: #FFFFFF;
    position: absolute;
    top:auto;
    left:0;
    right:0;
    bottom:-100px;
    margin: auto;
    z-index: 1000;
}
.worksArea article a .inner h3{
    font-size:20px;
    font-weight: 600;
    color:#553E2E;
    margin-bottom: 22px;
}
.worksArea article a .inner ul{
    display: flex;
    align-items: center;
}
.worksArea article a .inner ul li{
    padding: 0 12px;
    position: relative;
    font-size:18px;
    color:#553E2E;
    font-weight: 600;
}
.worksArea article a .inner ul li.address{
    width:auto;
    height:38px;
    line-height: 38px;
    display: block;
    margin-right: 16px;
}
.worksArea article a .inner ul li.address span{
    text-align: center;
    height:38px;
    line-height: 38px;
    display: inline-block;
    font-size:18px;
    font-weight: 600;
    color:#FF7482;
    background: rgba(255,116,130,0.24);
    border-radius: 7px;
    padding: 0 25px;
}
.worksArea article a .inner ul li::after{
    width:2px;
    height:17px;
    content: "";
    background: #707070;
    position: absolute;
    top:2px;
    left:auto;
    right:-1px;
    bottom:0;
    margin: auto;
}
.worksArea article a .inner ul li:first-of-type::after,
.worksArea article a .inner ul li:last-of-type::after{
    display: none;
}
.worksArea article .prev-arrow,
.worksArea article .next-arrow{
    width:40px;
    height:40px;
    position: absolute;
    top:0;
    bottom:0;
    margin: auto;
    z-index: 2000;
    transition: 0.3s;
}
.worksArea article .prev-arrow{
    left:-93px;
    right:auto;
    background: url("../common/images/icon_prev.png") no-repeat center center/contain;
}
.worksArea article .next-arrow{
    left:auto;
    right:-93px;
    background: url("../common/images/icon_next.png") no-repeat center center/contain;
}
.worksArea article .prev-arrow:hover,
.worksArea article .next-arrow:hover{
    opacity: 0.5
}
@media (max-width: 768px) {
    .worksArea{
        margin: 50px auto 0 auto;
        padding: 40px 4% 40px 4%;
    }
    .worksArea h2.style001 span{
        font-size:32px;
    }
    .worksArea .bubble{
        width:80px;
        height:80px;
        left:4%;
    }
    .worksArea .bubble span{
        font-size:10px;
    }
    .worksArea article{
        width:80vw;
        margin: 30px auto 30px auto;
    }
    .worksArea article::after{
        display: none;
    }
    .worksArea article a{
        width:80vw;
        margin-right: 28px;
    }
    .worksArea article a .thumbArea{
        width:100%;
    }
    .worksArea article a .thumbArea .family{
        width:80px;
        height:80px;
        bottom:10px;
        right:10px;
        border:2px solid #FFFFFF;
    }
    .worksArea article a .new .status{
        width:120px;
        height:120px;
        transform: translate(-25%,-25%) rotate(-45deg);
    }
    .worksArea article a .new .status::before{
        height:30px;
        font-size:20px;
    }
    .worksArea article a .inner{
        width:100%;
        position: relative;
        top:auto;
        left:auto;
        right:auto;
        bottom:auto;
        padding: 15px 20px 15px 20px;
    }
    .worksArea article a .inner h3{
        font-size:18px;
        margin-bottom: 12px;
    }
    .worksArea article a .inner ul{
        flex-wrap: wrap;
    }
    .worksArea article a .inner ul li{
        padding: 0 6px;
        font-size:14px;
    }
    .worksArea article a .inner ul li.address{
        width:100%;
        height:30px;
        line-height: 30px;
        margin-right: 6px;
        margin-bottom: 6px;
    }
    .worksArea article a .inner ul li.address span{
        height:30px;
        line-height: 30px;
        font-size:14px;
        padding: 0 15px;
    }
    .worksArea article a .inner ul li::after{
        height:12px;
    }
    .worksArea article .prev-arrow,
    .worksArea article .next-arrow{
        width:20px;
        height:20px;
    }
    .worksArea article .prev-arrow{
        left:-24px;
    }
    .worksArea article .next-arrow{
        right:-24px;
    }
}


/*--------------------------------------
    lineupArea
--------------------------------------*/

.lineupArea{
    margin: 0 auto 0 auto;
    padding: 100px 0 115px 0;
    padding: min(calc(76px + ((1vw - 15px)*6)),100px) 0 min(calc(87px + ((1vw - 15px)*7)),115px) 0;
    background:url("../images/top/bg_lineup.jpg") no-repeat center center/cover;
}
.lineupArea h2.style001{
    color:#FFFFFF;
}
.lineupArea h2.style001 span{
    color:#FFFFFF;
    font-size:50px;
}
.lineupArea .boxArea{
    width:1510px;
    width:min(calc(1120px + ((1vw - 15px)*97.5)),1510px);
    display: flex;
    column-gap:5px;
    justify-content: space-between;
    margin: 50px auto 0;
}
.lineupArea .boxArea .box{
    width:500px;
    width:min(calc(370px + ((1vw - 15px)*32.5)),500px);
    border-radius: 6px;
    overflow: hidden;
    background: #FFFFFF;
}
.lineupArea .boxArea .box .thumb{
    width:100%;
    height:auto;
    padding-top: 71.2%;
    position: relative;
}
.lineupArea .boxArea .box .thumb img{
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    top:0;
    left:0;
}
.lineupArea .boxArea .box .inner{
    position: relative;
    text-align: center;
    padding: 0 0 50px;
    padding: 0 0 min(calc(30px + ((1vw - 15px)*5)),50px);
}
.lineupArea .boxArea .box .inner::before{
    content: "";
    position: absolute;
    top:auto;
    left:0;
    right:auto;
    bottom:100%;
    margin: auto;
    border-left:250px solid transparent;
    border-left:min(calc(185px + ((1vw - 15px)*16.25)),250px) solid transparent;
    border-right:250px solid transparent;
    border-right:min(calc(185px + ((1vw - 15px)*16.25)),250px) solid transparent;
    border-bottom:54px solid #FFFFFF;
    border-bottom:min(calc(30px + ((1vw - 15px)*6)),54px) solid #FFFFFF;
}
.lineupArea .boxArea .box .inner h3{
    text-align: center;
    margin: 0 auto 10px;
    line-height: 1;
    font-weight: 600;
}
.lineupArea .boxArea .box .inner h3 span{
    font-family:Montserrat;
    font-size:45px;
    font-size:min(calc(37px + ((1vw - 15px)*2)),45px);
    text-align: center;
    display: inline-block;
    margin: 10px auto 0;
    line-height: 1.2;
    font-weight: 600;
    position: relative;
}
.lineupArea .boxArea .box:nth-child(1) .inner h3,
.lineupArea .boxArea .box:nth-child(1) .inner h3 span{
    color:#C6AE6E;
}
.lineupArea .boxArea .box:nth-child(2) .inner h3,
.lineupArea .boxArea .box:nth-child(2) .inner h3 span{
    color:#7FB995;
}
.lineupArea .boxArea .box:nth-child(3) .inner h3,
.lineupArea .boxArea .box:nth-child(3) .inner h3 span{
    color:#89ADB5;
}
.lineupArea .boxArea .box .inner h3 span::before{
    content: "";
    background: url("../images/top/icon_pickup.png") no-repeat center center/contain;
    width:31px;
    height:31px;
    position: absolute;
    top:-15px;
    left:-23px;
}
.lineupArea .boxArea .box:nth-child(1) .inner h3 span::before{
    background: url("../images/top/icon_lineup_001.png") no-repeat center center/contain;
}
.lineupArea .boxArea .box:nth-child(2) .inner h3 span::before{
    background: url("../images/top/icon_lineup_002.png") no-repeat center center/contain;
}
.lineupArea .boxArea .box:nth-child(3) .inner h3 span::before{
    background: url("../images/top/icon_lineup_003.png") no-repeat center center/contain;
}
.lineupArea .boxArea .box .inner .type{
    margin:0 auto 25px;
    height:30px;
    line-height: 30px;
    font-size:15px;
    padding: 0 30px;
    color:#FFFFFF;
    display: inline-block;
    position: relative;
    font-weight: 600;
}
.lineupArea .boxArea .box:nth-child(1) .inner .type{
    background: #C6AE6E;
}
.lineupArea .boxArea .box:nth-child(2) .inner .type{
    background: #7FB995;
}
.lineupArea .boxArea .box:nth-child(3) .inner .type{
    background: #89ADB5;
}
.lineupArea .boxArea .box .inner .type::before{
    content: "";
    position: absolute;
    top:0;
    left:0;
    right:auto;
    bottom:auto;
    margin: auto;
    border-top:15px solid transparent;
    border-left:6px solid #FFFFFF;
    border-bottom:15px solid transparent;
}
.lineupArea .boxArea .box .inner .type::after{
    content: "";
    position: absolute;
    top:0;
    left:auto;
    right:0;
    bottom:auto;
    margin: auto;
    border-top:15px solid transparent;
    border-right:6px solid #FFFFFF;
    border-bottom:15px solid transparent;
}
.lineupArea .boxArea .box .inner .text{
    font-size:18px;
    font-size:min(calc(16px + ((1vw - 15px)*0.5)),18px);
    text-align: center;
    margin: 0 auto 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.lineupArea .boxArea .box .inner .price{
    display: inline-block;
    padding-left: 56px;
    font-size:22px;
    text-align: center;
    margin: 0 auto;
    position: relative;
}
.lineupArea .boxArea .box .inner .price::before{
    content: "";
    background: url("../images/top/icon_price.png") no-repeat center center/contain;
    width:45px;
    height:45px;
    position: absolute;
    top:0;
    left:0;
    right:auto;
    bottom:0;
    margin: auto;
}
.lineupArea .boxArea .box .inner .price span{
    display: inline-block;
    font-family:Montserrat;
    font-size:57px;
    font-weight: 600;
    margin-right: 10px;
    line-height: 1.2;
}
.lineupArea .boxArea .box .inner .price rt{
    font-size:12px;
}
.lineupArea .boxArea .box .inner .btn{
    width:min(calc(290px + ((1vw - 15px)*20)),370px);
    height:min(calc(54px + ((1vw - 15px)*3)),66px);
    border-radius: min(calc(27px + ((1vw - 15px)*1.5)),33px);
    margin: min(calc(30px + ((1vw - 15px)*7.5)),60px) auto 0 auto;
}
.lineupArea .boxArea .box .inner .btn::after{
    right:min(calc(28px + ((1vw - 15px)*3)),40px);
}
.lineupArea .boxArea .box .inner .btn span{
    font-size: min(calc(16px + ((1vw - 15px)*0.5)),18px);
}
@media (max-width: 1500px) {
    .lineupArea{
        padding: 76px 0 87px 0;
    }
    .lineupArea .boxArea{
        width:calc(970px + ((1vw - 11px)*37.5));
    }
    .lineupArea .boxArea .box{
        width:calc(320px + ((1vw - 11px)*12.5));
    }
    .lineupArea .boxArea .box .inner{
        padding: 0 0 30px;
    }
    .lineupArea .boxArea .box .inner::before{
        border-left:calc(160px + ((1vw - 11px)*6.25)) solid transparent;
        border-right:calc(160px + ((1vw - 11px)*6.25)) solid transparent;
        border-bottom:30px solid #FFFFFF;
    }
    .lineupArea .boxArea .box .inner h3 span{
        font-size:37px;
    }
    .lineupArea .boxArea .box .inner .text{
        font-size:16px;
    }
    .lineupArea .boxArea .box .inner .btn{
        width:290px;
        height:54px;
        border-radius: 27px;
        margin: 30px auto 0;
    }
    .lineupArea .boxArea .box .inner .btn::after{
        right:28px;
    }
    .lineupArea .boxArea .box .inner .btn span{
        font-size: 16px;
    }
}
@media (max-width: 1100px) {
    .lineupArea .boxArea{
        width: 970px;
    }
    .lineupArea .boxArea .box{
        width: 320px;
    }
    .lineupArea .boxArea .box .inner::before{
        border-left: 160px solid transparent;
        border-right: 160px solid transparent;
    }
}
@media (max-width: 768px) {
    .lineupArea{
        padding: 50px 4% 50px 4%;
    }
    .lineupArea h2.style001 span{
        font-size:32px;
    }
    .lineupArea .boxArea{
        width: min(320px,100%);
        display: block;
        margin: 30px auto 0;
    }
    .lineupArea .boxArea .box{
        width: min(320px,100%);
        margin: 20px auto 0 auto;
    }
    .lineupArea .boxArea .box .inner::before{        
        width:100%;
        height:30px;
        clip-path: polygon(50% 0,0 100%,100% 100%);
        border-left: none;
        border-right: none;
        border-bottom: none;
        background: #FFFFFF;
    }
    .lineupArea .boxArea .box .inner h3 span{
        font-size:32px;
    }
    .lineupArea .boxArea .box .inner .btn{
        width:min(290px,92%);
    }
}


/*--------------------------------------
    infoArea
--------------------------------------*/

.infoArea{
    width:1122px;
    padding: 106px calc(50% - 561px);
    margin: 0 auto;
    display: flex;
    gap:32px;
    justify-content: space-between;
    background: #FF7482;
}
.infoArea a{
    font-size:22px;
    width:100%;
    height:116px;
    position: relative;
    box-sizing: border-box;
    background: #FFFFFF;
    display: block;
}
.infoArea a span{
    font-size:22px;
    font-weight: 700;
    line-height: 1.3;
    position: absolute;
    top:50%;
    transform: translate(0,-50%);
}
.infoArea a:nth-of-type(1) span{
    width:calc(100% - 240px);
    left:240px;
}
.infoArea a:nth-of-type(2) span{
    width:calc(100% - 244px);
    left:244px;
}
.infoArea a:nth-of-type(1)::before{
    width:133px;
    height:114px;
    content: "";
    position: absolute;
    top:-12px;
    left:55px;
    right:auto;
    bottom:auto;
    margin: auto;
    background:url("../images/top/img_info_001.png") no-repeat right top/contain;
}
.infoArea a:nth-of-type(2)::before{
    width:170px;
    height:84px;
    content: "";
    position: absolute;
    top:0;
    left:59px;
    right:auto;
    bottom:0;
    margin: auto;
    background:url("../images/top/img_info_002.png") no-repeat right center/contain;
}
.infoArea a::after{
    width:26px;
    height:26px;
    content: "";
    position: absolute;
    top:0;
    left:auto;
    right:32px;
    bottom:0;
    margin: auto;
    background: url("../common/images/icon_next.png") no-repeat center center;
    background-size:contain;
}
@media (max-width: 1500px) {
    .infoArea{
        width:calc(982px + ((1vw - 11px)*35));
        padding: 106px calc(50% - (491px + ((1vw - 11px)*17.5)));
    }
    .infoArea a{
        font-size:calc(18px + ((1vw - 11px)*1));
    }
    .infoArea a span{
        font-size:calc(18px + ((1vw - 11px)*1));
    }
}
@media (max-width: 1100px) {
    .infoArea{
        width:982px;
        padding: 106px calc(50% - 491px);
    }
    .infoArea a{
        font-size:18px;
    }
    .infoArea a span{
        font-size:18px;
    }
}
@media (max-width: 768px) {   
    .infoArea{
        width:100%;
        padding: 30px 4%;
        box-sizing: border-box;
        display: block;
    }
    .infoArea a{
        font-size:18px;
        margin-top: 5px;
    }
    .infoArea a span{
        font-size:18px;
    }
    .infoArea a:nth-of-type(1) span{
        width:calc(100% - 164px);
        left:110px;
    }
    .infoArea a:nth-of-type(2) span{
        width:calc(100% - 164px);
        left:110px;
    }
    .infoArea a:nth-of-type(1)::before{
        width:67px;
        height:57px;
        top:0;
        left:20px;
        bottom:0;
    }
    .infoArea a:nth-of-type(2)::before{
        width:68px;
        height:34px;
        top:0;
        left:20px;
        bottom:0;
    }
    .infoArea a::after{
        right:16px;
    }
}

/*--------------------------------------
    guideArea
--------------------------------------*/

.guideArea{
    width:1122px;
    margin: 90px auto;
    display: flex;
    gap:32px;
    justify-content: space-between;
}
.guideArea a{
    font-size:22px;
    width:100%;
    height:116px;
    position: relative;
    box-sizing: border-box;
    background: #F7EAC6;
    display: block;
}
.guideArea a span{
    font-size:22px;
    font-weight: 700;
    line-height: 1.3;
    position: absolute;
    top:50%;
    transform: translate(0,-50%);
}
.guideArea a.downloadLink span{
    width:calc(100% - 194px);
    left:194px;
}
.guideArea a.reserveLink span{
    width:calc(100% - 224px);
    left:224px;
}
.guideArea a.downloadLink::before{
    width:184px;
    height:161px;
    content: "";
    position: absolute;
    top:50%;
    left:-29px;
    right:auto;
    bottom:auto;
    margin: auto;
    transform: translate(0,-50%);
    background:url("../common/images/img_contact_001.png") no-repeat center center/contain;
}
.guideArea a.reserveLink::before{
    width:156px;
    height:154px;
    content: "";
    position: absolute;
    top:auto;
    left:55px;
    right:auto;
    bottom:0;
    margin: auto;
    background:url("../common/images/img_contact_002.png") no-repeat center center/contain;
}
.guideArea a::after{
    width:26px;
    height:26px;
    content: "";
    position: absolute;
    top:0;
    left:auto;
    right:32px;
    bottom:0;
    margin: auto;
    background: url("../common/images/icon_next.png") no-repeat center center/contain;
}
@media (max-width: 1500px) {
    .guideArea{
        width:calc(982px + ((1vw - 11px)*35));
    }
    .guideArea a{
        font-size:calc(18px + ((1vw - 11px)*1));
    }
    .guideArea a span{
        font-size:calc(18px + ((1vw - 11px)*1));
    }
}
@media (max-width: 1100px) {
    .guideArea{
        width:982px;
    }
    .guideArea a{
        font-size:18px;
    }
    .guideArea a span{
        font-size:18px;
    }
}
@media (max-width: 768px) {
    .guideArea{
        width:92%;
        box-sizing: border-box;
        display: block;
        margin: 30px auto;
    }
    .guideArea a{
        font-size:18px;
        margin-top: 5px;
    }
    .guideArea a span{
        font-size:18px;
    }
    .guideArea a.downloadLink span{
        width:calc(100% - 74px);
        left:20px;
    }
    .guideArea a.reserveLink span{
        width:calc(100% - 74px);
        left:20px;
    }
    .guideArea a::before {
        display: none;
    }
    .guideArea a::after{
        right:16px;
    }
}

/*--------------------------------------
    loanArea
--------------------------------------*/

.loanArea .pic{
    width:100%;
    height:366px;
}
.loanArea .pic img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.loanArea .inner{
    width:100%;
    background:url("../images/top/bg_loan_002.png") no-repeat center -25px;
}
.loanArea .inner .contentWidth{
    position: relative;
    padding:100px 0 0;
}
.loanArea .inner h2{
    width:437px;
    height:102px;
    line-height: 102px;
    color:#FF7482;
    font-weight: 700;
    font-size:39px;
    box-sizing: border-box;
    padding-left: 75px;
    position: absolute;
    top:-82px;
    left:0;
    right:0;
    bottom:auto;
    margin: auto;
    background: #FFFFFF;
}
.loanArea .inner h2::after{
    width:93px;
    height:93px;
    content: "";
    background: url("../images/top/icon_loan_001.png") no-repeat center center/contain;
    position: absolute;
    top:-47px;
    left:auto;
    right:-46px;
    bottom:auto;
    margin: auto;
}
.loanArea .inner h3{
    font-size:59px;
    font-weight: 700;
    line-height: 1.3;
    padding:0 0 0 52px;
}
.loanArea .inner h3 span{
    font-size:88px;
    font-weight: 700;
    color:#FF7482;
    display: inline-block;
    border-bottom: 4px solid #FF7482;
    position: relative;
    line-height: 1.3;
    margin: 10px 0 0 -52px;
}
.loanArea .inner h3 span::before{
    width:44px;
    height:44px;
    content: "";
    background: url("../images/top/icon_pickup_002.png") no-repeat center center/contain;
    position: absolute;
    top:-7px;
    left:-50px;
}
.loanArea .inner h3 span::after{
    width:44px;
    height:44px;
    content: "";
    background: url("../images/top/icon_pickup_003.png") no-repeat center center/contain;
    position: absolute;
    top:-7px;
    right:-42px;
}
.loanArea .inner h4{
    font-size:26px;
    font-weight: 700;
    line-height: 1.3;
    margin: 80px auto 20px;
}
.loanArea .inner .text{
    font-size:18px;
    line-height: 1.64;
}
.loanArea .inner .img{
    position: absolute;
    top:auto;
    left:auto;
    right:0;
    bottom:247px;
}
.loanArea .inner .boxArea{
    margin: 63px auto 0 auto;
    display: flex;
    justify-content: space-between;
    gap:36px;
}
.loanArea .inner .boxArea a.box{
    width:582px;
    height: 175px;
    display: flex;
    border-radius: 6px;
    overflow: hidden;
}
.loanArea .inner .boxArea a.box:nth-of-type(1){
    background: #CBB092;    
}
.loanArea .inner .boxArea a.box:nth-of-type(2){
    background: #FF7482;    
}
.loanArea .inner .boxArea a.box .thumb{
    width:227px;
    height: 100%;
}
.loanArea .inner .boxArea a.box .thumb img{
    width:100%;
    height: 100%;
    object-fit: cover;
}
.loanArea .inner .boxArea a.box .text{
    width:355px;
    height:100%;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 30px;
    position: relative;
}
.loanArea .inner .boxArea a.box .text::after{
    content: "";
    width:10px;
    height:19px;
    background: url("../common/images/icon_arrow_white.png") no-repeat center center/contain;
    position: absolute;
    top:0;
    left:auto;
    right:36px;
    bottom:0;
    margin: auto;
}
.loanArea .inner .boxArea a.box .text span{
    font-size:22px;
    font-weight: 700;
    color:#FFFFFF;
}
@media (max-width: 1500px) {
    .loanArea .inner h3{
        font-size:calc(43px + ((1vw - 11px)*4));
        padding: 0 0 0 calc(48px + ((1vw - 11px)*1));
    }
    .loanArea .inner h3 span{
        font-size:calc(64px + ((1vw - 11px)*6));
        margin: 10px 0 0 calc(-48px - ((1vw - 11px)*1));
    }
    .loanArea .inner h4{
        font-size:calc(22px + ((1vw - 11px)*1));
    }
    .loanArea .inner .text{
        font-size:calc(16px + ((1vw - 11px)*0.5));
    }
    .loanArea .inner .img{
        width: calc(394px + ((1vw - 11px)*33));
    }
    .loanArea .inner .boxArea a.box .text span{
        font-size:calc(18px + ((1vw - 11px)*1));
    }
}
@media (max-width: 1100px) {   
    .loanArea .inner h3{
        font-size: 43px;
        padding: 0 0 0 48px;
    }
    .loanArea .inner h3 span{
        font-size: 64px;
        margin: 10px 0 0 -48px;
    }
    .loanArea .inner h4{
        font-size: 22px;
    }
    .loanArea .inner .text{
        font-size: 16px;
    }
    .loanArea .inner .img{
        width: 394px;
    }
    .loanArea .inner .boxArea a.box .text span{
        font-size: 18px;
    }
}
@media (max-width: 768px) { 
    .loanArea .pic{
        height:150px;
    }
    .loanArea .inner .contentWidth{
        padding:40px 0 0;
    }
    .loanArea .inner h2{
        width:92%;
        height:60px;
        line-height: 60px;
        font-size:24px;
        padding-left: 0;
        top:-52px;
        text-align: center;
    }
    .loanArea .inner h2::after{
        width:31px;
        height:31px;
        top:-16px;
        right:-16px;
    }
    .loanArea .inner h3{
        font-size:24px;
        padding:0 0 0 0;
    }
    .loanArea .inner h3 span{
        font-size:32px;
        margin: 10px 0 0 0;
    }
    .loanArea .inner h3 span::before{
        display: none;
    }
    .loanArea .inner h3 span::after{
        display: none;
    }
    .loanArea .inner h4{
        font-size:18px;
        margin: 30px auto 20px;
    }
    .loanArea .inner .text{
        font-size:14px;
    }
    .loanArea .inner .img{
        display: none;
    }
    .loanArea .inner .boxArea{
        margin: 30px auto 0 auto;
        display: block;
    }
    .loanArea .inner .boxArea a.box{
        width:100%;
        height: 100px;
        margin-top: 5px;
    }
    .loanArea .inner .boxArea a.box .thumb{
        display: none;
    }
    .loanArea .inner .boxArea a.box .text{
        width:100%;
        padding: 0 15px;
    }
    .loanArea .inner .boxArea a.box .text span{
        font-size:18px;
    }
    .loanArea .inner .boxArea a.box .text::after {
        right: 20px;
    }
}

/*--------------------------------------
    newsArea
--------------------------------------*/

.newsArea{
    width:100%;
    padding: 100px 0 110px;
    background: #F7F4ED;
    margin: 166px auto 0;
}
.newsArea .boxArea{
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.newsArea .boxArea article{
    width:572px;
}
.newsArea .boxArea article h2.style001{
    color:#333333;
    margin-bottom: 20px;
}
.newsArea .boxArea article h2.style001 span{
    color:#333333;
    font-size:40px;
}
.newsArea .boxArea article a.box{
    width:100%;
    background: #FFFFFF;
    border-radius: 6px;
    box-sizing: border-box;
    padding: 22px 24px;
    display: grid;
    column-gap:34px;
    grid-template-columns: 177px 1fr;
    margin: 12px auto 0 auto;
}
.newsArea .boxArea article a.box .thumbArea{
    width:177px;
    height:177px;
    position: relative;
    border-radius: 3px;
    overflow: hidden;
}
.newsArea .boxArea article a.box .thumbArea img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.newsArea .boxArea article a.box .textArea h3{
    font-size:18px;
    font-weight: 600;
    line-height: 1.3;
    margin:11px auto 22px auto;
}
.newsArea .boxArea article a.box .textArea .date{
    color:#BFBFBF;
}
@media (max-width: 1500px) {
    .newsArea .boxArea article{
        width:calc(470px + (1vw - 11px)*25.5);
    }
    .newsArea .boxArea article a.box .textArea h3 {
        font-size: calc(16px + (1vw - 11px)*0.5);
    }
    .newsArea .boxArea article a.box .textArea .date {
        font-size: calc(14px + (1vw - 11px)*0.5);
    }
}
@media (max-width: 1100px) {
    .newsArea .boxArea article{
        width:470px;
    }
    .newsArea .boxArea article a.box .textArea h3 {
        font-size: 16px;
    }
    .newsArea .boxArea article a.box .textArea .date {
        font-size: 15px;
    }
}
@media (max-width: 768px) {   
    .newsArea{
        padding: 50px 4% 50px 4%;
        box-sizing: border-box;
        margin: 50px auto 0 auto;
    }
    .newsArea .boxArea{
        display: block;
    }
    .newsArea .boxArea article{
        width:100%;
        margin: 0 auto 0 auto;
    }
    .newsArea .boxArea article:last-of-type{
        width:100%;
        margin: 40px auto 0 auto;
    }
    .newsArea .boxArea article h2.style001 {
        text-align: center;
    }
    .newsArea .boxArea article h2.style001 span{
        color: #FF7482;
        font-size:32px;
    }
    .newsArea .boxArea article a.box{
        padding: 12px 14px;
        display: block;
    }
    .newsArea .boxArea article a.box .thumbArea{
        margin: 0 auto 20px auto;
    }
    .newsArea .boxArea article a.box .textArea h3{
        font-size:16px;
    }
}

/*--------------------------------------
    snsArea
--------------------------------------*/

.snsArea{
    display: flex;
    justify-content: center;
    gap:68px;
    padding: 86px 0;
    background: #F7EAC6;
}
@media (max-width: 768px) {
    .snsArea{
        gap:20px;
        padding: 30px 10% 30px 10%;
    }
}


/*--------------------------------------
    staffArea
--------------------------------------*/

.staffArea{
    margin: 64px auto 96px;
}
.staffArea h2.style001 span{
    font-size:50px;
}
.staffArea ul{
    width:1300px;
    margin: 70px auto;
}
.staffArea ul li{
    width:260px;
    text-align: center;
}
.staffArea ul li .pic{
    width:260px;
    height:260px;
}
@media (max-width: 1500px) {
    .staffArea ul{
        width:1300px;
        width:min(calc(1010px + ((1vw - 11px)*72.5)),1300px);
    }
    .staffArea ul li{
        width:260px;
        width:min(calc(202px + ((1vw - 11px)*14.5)),260px);
    }
    .staffArea ul li .pic{
        width:260px;
        width:min(calc(202px + ((1vw - 11px)*14.5)),260px);
        height:260px;
        height:min(calc(202px + ((1vw - 11px)*14.5)),260px);
    }
}
@media (max-width: 1100px) {
    .staffArea ul{
        width:1010px;
    }
    .staffArea ul li{
        width:202px;
    }
    .staffArea ul li .pic{
        width:202px;
        height:202px;
    }
}
@media (max-width: 768px) {
    .staffArea{
        margin: 50px auto 50px auto;
    }
    .staffArea h2.style001 span{
        font-size:32px;
    }
    .staffArea ul{
        width:92%;
        margin: 50px auto;
    }
    .staffArea ul li .pic{
        width:100%;
        height:auto;
        position: relative;
    }
    .staffArea ul li .pic::after{
        content: "";
        width:100%;
        height:auto;
        padding-top: 100%;
        display: inline-block;
    }
    .staffArea ul li .pic img{
        width:100%;
        height:100%;
        object-fit: cover;
        position: absolute;
        top:0;
        left:0;
    }
}


/*--------------------------------------
    showroomArea
--------------------------------------*/

.showroomArea{
    width:1300px;
    padding-top: 154px;
    position: relative;    
    margin: 96px auto 0 auto;
}
.showroomArea .bg{
    width:726px;
    height:525px;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:auto;
    margin: auto;
    z-index: -1;
}
.showroomArea h2.style001{
    margin-bottom: 270px;
}
.showroomArea h2.style001 span{
    font-size:40px;
}
.showroomArea .boxArea{
    display: grid;
    column-gap: 95px;
    grid-template-columns: 1fr 1fr 1fr;
}
.showroomArea .boxArea .box{
    padding: 13px;
    background: #FF7482;
    position: relative;
}
.showroomArea .boxArea .box:nth-child(1)::before{
    width:507px;
    height:246px;
    content: "";
    background: url("../images/top/line_showroom_001.png") no-repeat center center/contain;
    position: absolute;
    top:auto;
    left:50%;
    right:auto;
    bottom:calc(100% - 2px);
}
.showroomArea .boxArea .box:nth-child(2)::before{
    width:145px;
    height:202px;
    content: "";
    background: url("../images/top/line_showroom_002.png") no-repeat center center/contain;
    position: absolute;
    top:auto;
    left:auto;
    right:50%;
    bottom:calc(100% - 2px);
}
.showroomArea .boxArea .box:nth-child(3)::before{
    width:358px;
    height:209px;
    content: "";
    background: url("../images/top/line_showroom_003.png") no-repeat center center/contain;
    position: absolute;
    top:auto;
    left:auto;
    right:50%;
    bottom:calc(100% - 2px);
}
.showroomArea .boxArea .box .pic{
    width:100%;
    height:185px;
    border-radius: 3px;
    overflow: hidden;
    background: #C9C9C9;
}
.showroomArea .boxArea .box .pic img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.showroomArea .boxArea .box h3{
    font-size:22px;
    font-weight: 600;
    color:#FFFFFF;
    margin: 20px 5px 10px;
}
.showroomArea .boxArea .box .address{
    font-size:14px;
    margin: 10px 5px;
    color:#FFFFFF;
}
.showroomArea .boxArea .box .tel{
    display: block;
    text-align: left;
    line-height: 36px;
    padding-left: 46px;
    background: url("../common/images/icon_tel_001.png") no-repeat left center/36px 36px;
    margin: 10px 5px;
}
.showroomArea .boxArea .box .tel,
.showroomArea .boxArea .box .tel a{
    font-family: Montserrat;
    font-size:36px;
    font-weight: 600;
    color:#FFFFFF;
}
@media (max-width: 768px) {
    .showroomArea{
        width:92%;
        padding-top: 0;
        margin: 50px auto 0 auto;
    }
    .showroomArea .bg{
        width:100%;
        height:auto;
        position: static;
    }
    .showroomArea h2.style001{
        margin-bottom: 40px;
    }
    .showroomArea h2.style001 span{
        font-size:32px;
    }
    .showroomArea .boxArea{
        gap: 5px;
        grid-template-columns: 1fr;
        margin: 20px auto 0 auto;
    }
    .showroomArea .boxArea .box:nth-child(1)::before{
        display: none;
    }
    .showroomArea .boxArea .box:nth-child(2)::before{
        display: none;
    }
    .showroomArea .boxArea .box:nth-child(3)::before{
        display: none;
    }
    .showroomArea .boxArea .box .pic{
        height:auto;
    }
    .showroomArea .boxArea .box .pic img{
        height:auto;
    }
    .showroomArea .boxArea .box h3{
        font-size:18px;
    }
    .showroomArea .boxArea .box .tel,
    .showroomArea .boxArea .box .tel a{
        font-size:24px;
        line-height: 36px;
    }
}