﻿body {
}

/* カルーセルを画面いっぱいに */
#mainCarousel .carousel-item {
    height: 100vh; /* 全画面表示 */
}

    #mainCarousel .carousel-item img {
        object-fit: cover;
        height: 100%;
        width: 100%;
    }

.carousel-item h1 {
    font-size: 3.4rem;
}

/*@media (min-width: 768px) {
    .carousel-item h1 {
        font-size: 6.7rem;
    }
}
*/
.carousel-item p {
    font-size: 1.5rem;
}
/* ナビバーを重ねる */
.navbar-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
}

.carousel-caption.centered {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: auto;
    right: auto;
    text-align: center;
}

h1 {
    font-size: 5rem;
}

.h5, h5 {
    font-size: 1.1rem;
}

.scrolled, footer {
    background-color: rgba(52,58,64,0.8) !important; /* Bootstrapの bg-dark と同等  #343a40  */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
/*カード*/
.card-title {
    min-height: 4rem;
}

.card-text {
    min-height: 1.5rem;
}

/*商品カード*/
    .truncate-multi {
        display: -webkit-box; /* flexboxのように扱う */
        -webkit-line-clamp: 3; /* 表示する行数 */
        -webkit-box-orient: vertical;
        overflow: hidden; /* はみ出し非表示 */
    }


/*フローティングボックス*/
.floating-box {
    position: fixed;
    bottom: 0px; /*bottom: 20px;*/
    right: 0px; /*right: 20px;*/
    width: 360px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    padding: 12px 16px 16px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    z-index: 1044;
    transition: all 0.3s ease;
}

    .floating-box.hidden {
        display: none;
    }

.reopen-button {
    position: fixed;
    bottom: 20px;
    right: 0px; /*ディフォルト20px*/
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #c40000;
    color: white;
    font-size: 20px;
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    z-index: 1043;
    display: none; /* 最初は非表示 */
    /* 中央揃え */
    /*display: flex;*/
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

#backToTop {
    position: fixed;
    bottom: 20px;
    right: 45px; /* ディオルト65px 最初から確定位置に */
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #c40000;
    color: white;
    font-size: 20px;
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    z-index: 1045;
    display: none; /* 最初は非表示 */
    /* 中央揃え */
    /* display: flex;*/
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.contact-title {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 6px;
}

.phone-row,
.email-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 14px;
    margin-bottom: 4px;
}

.phone-label,
.email-label {
    color: gray;
    font-size: 13px;
    white-space: nowrap;
}

.phone-number,
.email-address {
    color: #d10000;
    font-weight: bold;
    font-size: 15px;
}

.inquiry-button {
    background-color: #c40000;
    color: white;
    border: none;
    padding: 6px 20px;
    font-size: 13px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 2px;
    white-space: nowrap;
    /*margin-top: 10px;*/
}
/*.email-row {
            display: flex;
            align-items: center;
            gap: 10px;*/ /* メールアドレスとボタンの間隔 */
/*margin-top: 10px;
        }

        .email-label {
            min-width: 60px;
            font-weight: bold;
        }

        .email-address {
            white-space: nowrap;
        }

        .inquiry-button {
            padding: 5px 10px;
            cursor: pointer;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
        }*/
.office-hours {
    font-size: 11px;
    color: #333;
    margin-top: 10px;
    line-height: 1.3;
}

.close-button {
    position: absolute;
    top: 8px;
    right: 10px;
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
    cursor: pointer;
}

.close-button:hover {
    color: #333;
}

/*Loading*/
.lazy-img {
    background: url('img/common/load.gif') center center no-repeat;
    background-size: 40px 40px;
    min-height: 200px;
    display: block;
}

h2 {
    letter-spacing: 10px;
}

.h2-2625 {
    font-size: 2.625rem;
    letter-spacing: 20px;
}

.pos1 {
    background: url(../img/common/ya.png) no-repeat 0 5px;
    padding-left: 20px;
    /*float: left;*/
    width: 100%;
    font-weight: 200;
}

.nav-link.level-1 {
    padding-left: 1rem;
}

.nav-link.level-2 {
    padding-left: 2rem;
}

.nav-link.level-3 {
    padding-left: 3rem;
}

.navbar-toggler {
 border:1px solid;
}

.navbar-toggler:focus,
.navbar-toggler:active {
    border:1px solid;
    outline: none !important;
    box-shadow: none !important;
}

.section {
    scroll-margin-top: 70px; /* navbarの高さ分 */
}


/*画面サイズ*/
/* Extra small (スマホ縦〜) */
@media (max-width: 575.98px) {
    .logo-img {
        width: 60px;
        height: 60px;
    }

    .discover-img {
        width: 60px;
    }

    .visit-img {
        width: 120px;
    }

    .h2-2625 {
        font-size: 1.25rem;
    }
    .carousel-item h1 {
        font-size: 1.32rem;
    }

    .carousel-item p {
        font-size: 0.5rem;
    }

    .card-title {
        width: 325px;
        display: block; /* ブロック化して横幅を効かせる */
        /*white-space: nowrap;*/ /* 横幅に収める場合、省略したい時 */
        overflow: hidden;
        text-overflow: ellipsis;
        height:64px;
    }
    .card {
        width: 392px;
    }
    .w-90 {
        width: 95% !important;
    }
}

/* Small (スマホ横・小型タブレット〜) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .carousel-item h1 {
        font-size: 2.036rem;
    }

    .carousel-item p {
        font-size: 0.76rem;
    }
    .card-title {
        width: 325px;
        display: block; /* ブロック化して横幅を効かせる */
        /*white-space: nowrap;*/ /* 横幅に収める場合、省略したい時 */
        overflow: hidden;
        text-overflow: ellipsis;
        height: 64px;
    }
 
}

/* Medium (タブレット縦〜) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .carousel-item h1 {
        font-size: 2.71rem;
    }
    .carousel-item p {
        font-size: 1.02rem;
    }
}

/* Large (PC小〜) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    #main-headr d-flex {
        margin-right: 15px;
    }
    .carousel-item h1 {
        font-size: 3.5rem;
    }
    .carousel-item p {
        font-size:1.32rem;
    }
}

/* Extra large (PC大〜) */
@media (min-width: 1200px) {
    #main-headr d-flex {
        margin-right: 15px;
    }
    .carousel-item h1 {
        font-size: 4.2rem;
    }
}

div {
    border: 0px solid red;
}

a:hover img {
    filter: brightness(120%); /* 120%にして少し明るくする */
    transition: filter 0.3s ease; /* アニメーションで自然に */
}
/*a:hover {
    text-decoration: none;
}
a {
    text-decoration: none;*/ /* 常に下線なし */
/*}*/

/*div {
border: 1px solid red;
}
section {
border: 1px solid blue;
}

h2 {
border: 1px dashed green;
    }*/