@charset "utf-8";

/*
 * 共通
 * --------------------------------------------------
 */

* {
    min-height: 0 !important;
    min-width: 0 !important;
    box-sizing: border-box;
    font-family: "Noto Sans JP", "Yu Gothic Medium", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    color: #000000;
    font-weight: 500;
}

html,
body {
    color: #333333;
    font-size: 62.5%;
    margin: 0px;
}

// タブレット用
body {
    min-width: 1060px !important;
    overflow-x: hidden !important;
}

// スマートフォン用
@media screen and (max-width: 767px) {
    body {
        min-width: initial !important;
    }
}

* img {
    vertical-align: top;
    width: 100%;
}

* a {
    color: #dc0917;
    text-decoration: none;
}

* a:hover {
    color: #ff0000;
    text-decoration: none;
}

a:hover img {
    filter: brightness(1.1);
}

@media screen and (min-width: 768px) {
    .hidden-pc {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .hidden-mobile {
        display: none !important;
    }
}

.my-15 {
    margin: 15px 0px;
}

.my-30 {
    margin: 30px 0px;
}

.my-60 {
    margin: 60px 0px;
}

.my-120 {
    margin: 120px 0px;
}

.mt-15 {
    margin-top: 15px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-120 {
    margin-top: 120px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-120 {
    margin-bottom: 120px;
}

.py-15 {
    padding-top: 15px 0px;
}

.py-30 {
    padding-top: 30px 0px;
}

.py-60 {
    padding-bottom: 60px 0px;
}

.pt-15 {
    padding-top: 15px;
}

.pt-30 {
    padding-top: 30px;
}

.pt-60 {
    padding-bottom: 60px;
}

.pb-15 {
    padding-bottom: 15px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-60 {
    padding-bottom: 60px;
}

@media screen and (max-width: 767px) {
    .my-30 {
        margin: 15px 0px;
    }

    .my-60 {
        margin: 30px 0px;
    }

    .my-120 {
        margin: 60px 0px;
    }

    .mt-30 {
        margin-top: 15px;
    }

    .mt-60 {
        margin-top: 30px;
    }

    .mt-120 {
        margin-top: 60px;
    }

    .mb-30 {
        margin-bottom: 15px;
    }

    .mb-60 {
        margin-bottom: 30px;
    }

    .mb-120 {
        margin-bottom: 60px;
    }

    .py-30 {
        padding-top: 15px 0px;
    }

    .py-60 {
        padding-bottom: 30px 0px;
    }

    .pt-30 {
        padding-top: 15px;
    }

    .pt-60 {
        padding-bottom: 30px;
    }

    .pb-30 {
        padding-bottom: 15px;
    }

    .pb-60 {
        padding-bottom: 30px;
    }
}

.spacer-5 {
    height: 5px;
    font-size: 0px;
}

.spacer-10 {
    height: 10px;
    font-size: 0px;
}

.spacer-15 {
    height: 15px;
    font-size: 0px;
}

.spacer-30 {
    height: 30px;
    font-size: 0px;
}

.spacer-60 {
    height: 60px;
    font-size: 0px;
}

.spacer-80 {
    height: 80px;
    font-size: 0px;
}

.spacer-120 {
    height: 120px;
    font-size: 0px;
}

.spacer-160 {
    height: 160px;
    font-size: 0px;
}

@media screen and (max-width: 767px) {
    .spacer-30 {
        height: 15px;
    }

    .spacer-60 {
        height: 30px;
    }

    .spacer-80 {
        height: 40px;
    }

    .spacer-120 {
        height: 60px;
    }

    .spacer-160 {
        height: 80px;
    }
}

/*
 * カラム
 * --------------------------------------------------
 */

.eventcontainer-fulid {
    display: block;
    width: 100%;
    margin: 0 auto;
    overflow-x: hidden;
    padding: 0px;
}

.eventcontainer {
    display: block;
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
    padding: 30px;
}

@media screen and (max-width: 767px) {
    .eventcontainer {
        padding: 15px;
    }
}

/*
 * ヘッダー
 * --------------------------------------------------
 */

.secHeader {
    background: #ffffff;
    padding: 0px;

}

header {
    display: flex;
    width: 100%;
    height: 80px;
    position: relative;
    align-items: center;
}

header .logo {
    height: 25%;
    width: auto;
    position: absolute;
    left: 20px;
}

header .btn_a {
    display: inline-block;
    width: 120px;
    height: 40px;
    background: #a67c52;
    position: absolute;
    right: 160px;
    padding: 10px;
}

header .btn_b {
    display: inline-block;
    width: 120px;
    height: 40px;
    background: #a67c52;
    position: absolute;
    right: 20px;
    padding: 10px;
}

/*
 * メイン
 * --------------------------------------------------
 */
.secMainimage {
    display: flex;
    justify-content: center;
    align-items: center;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 30px 60px;
}

.mainimage_title {
    width: 100%;
    height: auto;
}

.secWelcome {
    width: 100%;
    display: flex;
    position: relative;
    padding: 0px;
}

.welcome_banner {
    display: flex;
    width: 80%;
    height: calc(2vw + 80px);
    border: 1px solid#000000;
    background: #ffffff;
    font-size: 2.5vw;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: 0.1rem;
    padding: 30px 40px;
    position: absolute;
    top: calc(-40px + -1vw);
    left: 10%;
    align-items: center;
    justify-content: left;
}

@media screen and (max-width:767px) {
    .secMainimage {
        padding: 100px 10px;
    }

    .welcome_banner {
        width: calc(100% - 30px);
        left: 15px;
        font-size: 4vw;
        padding: 15px 20px;
        top: calc(-20px + -5vw);
        height: calc(10vw + 40px);
    }
}

@media screen and (min-width:1160px) {
    .welcome_banner {
        font-size: 3.2rem;
        top: calc(-40px + -1.6rem);
        height: calc(3.2rem + 80px);
    }
}

/*
 * secIdea
 * --------------------------------------------------
 */
.secIdea_title h2 {
    display: inline-block;
    width: 100%;
    font-size: 7.0rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0px;
    margin: 0px 0px 10px 0px;
}

.secIdea_title p {
    display: inline-block;
    width: 100%;
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0px;
}

.secIdea_content {
    display: flex;
    flex-wrap: wrap;
    gap: 0px;
}

.idea_item {
    display: flex;
    width: calc(100% / 3);
    flex-direction: column;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.idea_item:hover {
    filter: brightness(1.1);
    transition: all 0.5s ease;
}

.idea_item_number {
    display: inline-block;
    width: 100%;
}

.idea_item_number img {
    width: clamp(30px, 20%, 200px);
    margin: 20px 0px 0px 20px;
}

.idea_item_image {
    display: inline-block;
    width: 100%;
    position: relative;
    aspect-ratio: 3/1;
}

.idea_item_image img {
    width: 50%;
    position: absolute;
    bottom: -15px;
    left: 40px;
}

.idea_item_detail {
    display: inline-block;
    margin-left: 40px;
    margin-bottom: 40px;
    width: calc(100% - 80px);
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
}

.idea_item_detail h3 {
    display: inline-block;
    text-align: center;
    word-break: break-all;
    width: calc(100% + 40px);
    font-size: 1.5vw;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0px;
    padding: 15px 0px;
    margin: 0px 0px 0px -20px;
}

.idea_item_detail p {
    display: inline-block;
    text-align: center;
    word-break: keep-all;
    width: 100%;
    font-size: 2vw;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0px;
    position: relative;
    padding: 5px;
    margin: 0px;
}

.idea_item_detail p::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    border-top: solid 1px #000000;
    border-left: solid 1px #000000;
    height: 40px;
    width: 20px;
}

.idea_item_detail p::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    border-bottom: solid 1px #000000;
    border-right: solid 1px #000000;
    height: 40px;
    width: 20px;
}



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

    .secIdea_title h2 {
        font-size: 5rem;
    }

    .secIdea_title p {
        font-size: 1.5rem;
    }

    .idea_item {
        width: calc(100% / 2);
    }

    .idea_item_detail h3 {
        font-size: 3vw;
        width: calc(100% + 20px);
        margin-left: -10px;
        word-break: keep-all;
    }

    .idea_item_detail {
        margin-left: 10px;
        margin-bottom: 10px;
        width: calc(100% - 20px);
        padding: 10px;
    }

    .idea_item_detail p {
        font-size: 4.5vw;

    }
}

/*
 * secPoint
 * --------------------------------------------------
 */
.secPoint {
    background-image: url(/library/img/lp/point_bg.png);
    background-repeat: repeat;
    background-size: 250px 250px;

}

.point_title {
    background: #a67c52;
    display: flex;
    padding: 40px;
    flex-wrap: nowrap;
    gap: 20px;
}

.point_title_number {
    display: flex;
    width: 10%;
    justify-content: center;
    align-items: center;
}

.point_title_number img {
    height: auto;
    width: 100%;
    padding: 10px;
}

.point_title_subtitle {
    display: flex;
    width: 40%;
    justify-content: left;
    align-items: center;
    color: #ffffff;
    font-size: 2vw;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0px;
    word-break: keep-all;
}

.point_title_maintitle {
    display: flex;
    width: 50%;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #ffffff;
    font-size: 3vw;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.1rem;
    position: relative;
    word-break: keep-all;
}

.point_title_maintitle::before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    border-top: solid 2px #ffffff;
    border-left: solid 2px #ffffff;
    height: 6vw;
    width: 3vw;
}

.point_title_maintitle::after {
    content: "";
    display: inline-block;
    position: absolute;
    bottom: 0;
    right: 0;
    border-bottom: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    height: 6vw;
    width: 3vw;
}

.point_detail {
    display: inline-block;
    width: 100%;
    padding: 0px;
    margin: 0px;
}

.point_detail_image {
    display: flex;
    flex-wrap: wrap;
}

.point_detail_image img {
    display: inline-block;
    width: calc(100% /3);
    object-fit: contain;
}


.point_border {
    border: 1px solid #333333;
    margin: 30px 0px;
}

.point_pregrid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 30px;
}

.point_pregrid h3 {
    font-size: 2vw;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0px;
    margin: 1.4rem 0px 2.8rem 0px;
}

.point_pregrid p {
    font-size: 1.2vw;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0px;
}

.point_pregrid_01 {
    grid-area: 1 / 1 / 2 / 2;
}

.point_pregrid_02 {
    grid-area: 2 / 1 / 3 / 2;

}

.point_pregrid_03 {
    grid-area: 1 / 3 / 2 / 4;

}

.point_pregrid_04 {
    grid-area: 2 / 3 / 3 / 4;

}

.point_pregrid_05 {
    grid-area: 1 / 2 / 3 / 3;

}


@media screen and (max-width:767px) {
    .point_title {
        padding: 10px;
        gap: 10px;
    }

    .point_pregrid {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .point_title_subtitle {
        font-size: 2.5vw;
    }

    .point_title_maintitle {
        font-size: 4vw;
        line-height: 1.2;
    }

    .point_title_number img {
        padding: 5px;
    }

    .point_pregrid h3 {
        font-size: 5vw;
        font-weight: 700;
        line-height: 1;
        letter-spacing: 0px;
        margin-bottom: 20px;
    }

    .point_pregrid p {
        font-size: 3vw;
        font-weight: 400;
        line-height: 1.5;
        letter-spacing: 0px;
    }

    .point_pregrid_01 {
        display: inline-block;
        width: calc((100% - 30px) /2);
        order: 2;

    }

    .point_pregrid_02 {
        display: inline-block;
        width: calc((100% - 30px) /2);
        order: 3;
    }

    .point_pregrid_03 {
        display: inline-block;
        width: calc((100% - 30px) /2);
        order: 4;
    }

    .point_pregrid_04 {
        display: inline-block;
        width: calc((100% - 30px) /2);
        order: 5;
    }

    .point_pregrid_05 {
        display: inline-block;
        width: 100%;
        order: 1;

    }

}

@media screen and (min-width:1160px) {
    .point_title_subtitle {
        font-size: 2.8rem;
    }

    .point_title_maintitle {
        font-size: 3.6rem;
    }

    .point_pregrid h3 {
        font-size: 2.8rem;
    }

    .point_pregrid p {
        font-size: 1.8rem;
    }
}

/*
 * .secEndbigimage
 * --------------------------------------------------
 */
.secEndbigimage {
    padding: 0px;
}

.endbigimage {
    display: inline-block;
    position: relative;
    width: 100%;
    aspect-ratio: 16/9;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.endbtn {
    display: flex;
    flex-wrap: nowrap;
    width: calc(100% - 120px);
    border: 1px solid #000000;
    position: absolute;
    background: #ffffff;
    top: calc((-60px + -4vw) / 2);
    left: 60px;
    padding: 30px;
}

.endbtn:hover {
    background: #fff7ef;
    transition: all 0.5s ease;
}

.endbtn:hover div {
    color: #5f4224;
    transition: all 0.5s ease;
}

.endbtn div {
    display: flex;
    width: 50%;
    justify-content: center;
    align-items: center;
}

.endbtn_left {
    font-size: 1.8vw;
    line-height: 1.5;
    letter-spacing: 0px;
    font-weight: 500;
    text-align: center;
    display: inline-block;
    width: 50%;
}

.endbtn_right {
    font-size: 4vw;
    line-height: 1;
    letter-spacing: 0px;
    font-weight: 600;
    text-align: center;
    display: inline-block;
    width: 50%;
}

@media screen and (max-width:767px) {
    .endbtn {
        width: calc(100% - 30px);
        top: calc((-30px + -6vw) / 2);
        left: 15px;
        padding: 15px;
    }

    .endbtn_left {
        font-size: 3vw;
    }

    .endbtn_right {
        font-size: 5vw;
    }
}

@media screen and (min-width:1160px) {
    .endbtn_left {
        font-size: 2.8rem;
    }

    .endbtn_right {
        font-size: 3.6rem;
    }
}

/*
 * フッター
 * --------------------------------------------------
 */
footer {
    display: inline-block;
    width: 100%;
    height: 80px;
    background: #000000;
}

/*
 * LP用フォーム
 * --------------------------------------------------
 */
.secMap {
    width: 100% !important;
}

.bnrReserve {
    width: 100% !important;
}

.secForm {
    width: 100%;
    max-width: 1000px;
}

@media only screen and (max-width: 767px) {
    .bnrReserve {
        margin: 0 auto;
        width: calc(100% - 30px) !important;
    }
}