@charset "utf-8";

.topCoverHeader.primary {
    text-shadow: 2px 2px 5px rgba(255, 255, 255, .5);
}

.topVoiceTit br {
	display: block;
}

.topConceptImgBox {
    aspect-ratio: 635/674;
}

.topMenu::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -2;
    background: var(--white);
}

.topMenuItemTitleBox {
    display: contents !important;
}

.topMenuItemTitleBoxRight {
    order: 3;
}

.topMenuDecoText {
    pointer-events: none;
}

.topVoiceBoxLeft {
    display: contents !important;
}

.topVoiceButtomBox {
    order: 3;
}

.topVoiceRightRow, .topVoiceRightRow:nth-of-type(2n) {
    flex-direction: column-reverse !important;
    align-items: center !important;
}

.topVoiceFukidashi {
    position: relative;
    /*margin-top: 40px;*/
    padding: 15px;
    border-radius: 20px;
    background-color: var(--white);
    text-align: left;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #000000;
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
}

.topVoiceFukidashi::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
    border-width: 0px 16px 30px 16px;
    position: absolute;
    left: calc(50% - 16px);
    top: -15px;
}

.topVoiceFukidashiText s {
    text-decoration: none;
    font-weight: 700;
    color: var(--primary);
}

.topInfoItemTextBox p {
    line-height: 2em;
}

.topMessage {
    border-top: 30px solid;
    border-bottom: 30px solid;
    border-image: url(/system_panel/uploads/images/top_message_bg.svg) 31 / 31px 0 stretch;
}

.topMessageBox::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 10px;
    bottom: 10px;
    left: 0;
    background: var(--secondary);
}

.topMessageBox::after {
    content: "";
    position: absolute;
    z-index: 2;
    top: 10px;
    right: 0;
    bottom: 0;
    left: 10px;
    border: 1px solid var(--tertiary);
}

.topMessageText {
    font-size: 20px;
    line-height: 1.75;
    letter-spacing: 0;
    font-weight: 700;
}

.topMessageText s {
    font-size: 21px;
    line-height: 1.59;
    text-decoration: none;
    color: var(--primary);
}

.topMessageButton {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    width: 100%;
    max-width: 400px;
    height: 100px;
    padding: 0 20px;
    border-radius: 10px;
    transition: all .3s;
}

.topMessageButton::before {
    content: "";
    display: block;
    width: 28px;
    aspect-ratio: 27/7;
    transition: all .3s;
}

.topMessageButton p {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.5;
    font-family: var(--fontB);
    transition: all .3s;
}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:544px) {

    .topVoiceTit br {
        display: none;
    }
  
    .topVoiceRightRow {
        flex-direction: row-reverse !important;
        align-items: flex-start !important;
    }
  
	.topVoiceRightRow:nth-of-type(2n) {
        flex-direction: row !important;
        align-items: flex-start !important;
    }
  
    .topVoiceFukidashi::before {
        content: "";
        position: absolute;
        top: -6%;
        border-style: solid;
        translate: -50% 100%;
    }

    .topVoiceFukidashi01::before {
        left: -9px;
        border-color: transparent #fff transparent transparent;
        border-width: 16px 20px 16px 0px;
    }

    .topVoiceFukidashi02::before {
        right: -28px;
        left: auto;
        border-color: transparent transparent transparent #fff;
        border-width: 16px 0px 16px 20px;
    }

    .topVoiceFukidashiBox {
        width: 63% !important;
    }
  
    .topVoiceRightImgBlock {
        width: 30% !important;
    }
  
}

/* min-width: 544px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:768px) {

    .topMenuItemTitleBox {
        display: flex !important;
    }

    .topVoiceFukidashi {
        padding: 22px 26px;
    }
  
    .topVoiceFukidashi::before {
        top: 16%;
    }
  
    .topVoiceFukidashi01::before {
        left: -9px;
    }

    .topVoiceFukidashi02::before {
        right: -28px;
    }

    .topMessageText {
        font-size: 24px;
    }

    .topMessageText s {
        font-size: 25px;
    }

    .topMessageButton {
        max-width: 720px;
        height: 124px;
        padding: 0 42px;
    }

    .topMessageButton p {
        font-size: 28px;
    }

    .topMessageButton p br {
        display: none;
    }
}

/* min-width: 768px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:1024px) {
    
        .topVoiceBoxLeft {
            display: block !important;
        }

    .topInfoItemAddress br {
        display: none;
    }

    .topMessageText {
        font-size: 32px;
    }

    .topMessageText s {
        font-size: 34px;
    }

}

/* min-width: 1024px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:1200px) {

    .topInfoItemTitle {
        font-size: 28px !important;
    }

    .topMessageText {
        font-size: 40px;
    }

    .topMessageText s {
        font-size: 44px;
    }

}

/* min-width: 1200px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (min-width:1440px) {

    .topCoverHeader {
        font-size: 70px !important;
    }

}

/* min-width: 1440px ここまで */

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */