@charset "utf-8";

/*-----------------------------------------------
    secHero
-----------------------------------------------*/
.secHero{
    background: #dcd4d4;
    height: 80rem;
    width: 100%;
    margin-top: 1rem;
    position: relative;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
    border-radius: 0 4rem 4rem 0;
    overflow: hidden;
}
.secHero .boxVideo {
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}
/* secHero 内の動画共通設定 */
.secHero .video-pc,
.secHero .video-sp {
    width: 102%;              /* 少しはみ出させて黒線防止 */
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    object-fit: cover;
}
/* デフォルトはPC用を表示、SP用を非表示 */
.secHero .video-pc {
    display: block;
}
.secHero:before{
    content: '';
    position: absolute;
    width: 0.1rem;
    height: 100%;
    top: 0;
    right: 0;
    background: rgb(150 198 243);
    z-index: 1;
}
.secHero .video-sp {
    display: none;
}

/* 1215px以下ではSP用を表示、PC用を非表示 */
@media (max-width: 1215px) {
    .secHero .video-pc {
        display: none;
    }
    .secHero .video-sp {
        display: block;
    }
    .secHero:before{
        display: none;
    }
}
.secHero .secHeroTit{
    color: var(--whiteColor);
}
.secHero .itemContents{
    padding-top: 12.4rem;
    position: relative;
    z-index: 1;
}

.secHero .titHero{
    font-size: var(--pcFontSize50);
    letter-spacing: var(--pcLetterSpacing50_120);
    line-height: var(--pcLineHeight50_94);
    font-weight: bold;
    text-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.5);
}

.secHero .txtHero{
    font-size: var(--pcFontSize18);
    line-height: var(--pcLineHeight18_50);
    letter-spacing: var(--pcLetterSpacing18_250);
    font-weight: bold;
    text-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.5);
}
.secHero .txtBoxTop{
    height: 70rem;
    width: 100%;
    position: relative;
}
.secHero .txtBoxUnder{
    background: var(--bgBlue);
    height: 10rem;
    width: 100%;
    position: relative;
    z-index: 1;
}
.secHero .wrapperTxt{
    display: flex;
    align-items: center;
    height: 100%;
}
.secHero .txtUnder{
    font-size: var(--pcFontSize14);
    line-height: var(--pcLineHeight14_28);
    letter-spacing: 0.05em;
    font-weight: bold;
    color: var(--keyColor03);
    width: 83%;
    white-space: nowrap;
}
.secHero .logoUnder{
    width: 21.334%;
    /* width: 100%; */
    max-width: 38.4rem;
    position: absolute;
    /* left: 0; */
    right: 30px;
}
.HeroWrapper{
    position: relative;
}
@media only screen and (max-width:1820px) {
    .secHero .txtUnder {
        font-size: var(--pcFontSize13);
    }
}
@media only screen and (max-width:1600px) {
    .secHero .txtUnder {
        font-size: var(--pcFontSize12);
    }
}
@media only screen and (max-width:1215px) {
    .secHero{
        height: 68rem;
        box-shadow: 0px 0px 16px 0rem rgba(0, 0, 0, 0.2);
        border-radius: 0 3rem 3rem 0;
    }
    .HeroWrapper {
        left: 0;
    }
    .secHero .titHero{
        font-size: var(--spFontSize30);
        letter-spacing: var(--spLetterSpacing30_120);
        gap: 3rem;
    }

    .secHero .txtBoxTop {
        height: 48rem;
        width: 100%;
    }

    .secHero .txtHero{
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_250);
        line-height: var(--spLineHeight11_30);
    }
    .secHero .secHeroTit {
        width: calc(100% - 6rem);
    }

    .secHero .txtBoxUnder {
        height: 20rem;
    }
    .secHero .wrapperTxt {
        width: calc(100% - 6rem);
        flex-direction: column-reverse;
        justify-content: center;
        gap: 1rem;
    }
    .secHero .txtUnder {
        font-size: var(--spFontSize10);
        line-height: var(--spLineHeight10_21);
        white-space: wrap;
        width: 100%;
        letter-spacing: 0.02em;
    }
    .secHero .logoUnder {
        max-width: 28.5rem;
        position: static;
        width: 100%;
    }
    .secHero .boxVideo {
        bottom: 0;
    }
}

/*-----------------------------------------------
    secRecommend
-----------------------------------------------*/
.secRecommend {
    margin-top: 9.4rem;
    position: relative;
}

/* naviOpen���ɃX���C�_�[��z-index�������� */
#header.naviOpen ~ * .secRecommend,
body #header.naviOpen ~ * .secRecommend {
    z-index: 1;
}

/* ���m���ȕ��@: body�ɃN���X���ǉ������ꍇ */
body.naviOpen .secRecommend {
    z-index: 1;
}

.secRecommend .cmnTitleBox {
    margin-bottom: 3.4rem;
}
.secRecommend .boxRecommendSlider {
    width: 100%;
    overflow: visible;
}

.secRecommend .boxRecommendSlider .recommendSwiper {
    position: relative;
    width: 100%;
    padding: 0;
    overflow: visible;
}

.secRecommend .boxRecommendSlider .recommendSwiper .swiper-wrapper {
    padding: 0 6rem;
}

@media (min-width:1216px) {
    .secRecommend .boxRecommendSlider {
        max-width: 170rem;
        margin: 0 auto;
        max-width: calc(100% - 10rem);
    }
    
    .secRecommend .boxRecommendSlider .recommendSwiper {
        width: 100%;
        max-width: 170rem;
        margin: 0 auto;
        
    }
    
    .secRecommend .boxRecommendSlider .recommendSwiper .swiper-wrapper {
        padding: 0;
    }
    
    .secRecommend .boxRecommendSlider .recommendSwiper .swiper {
        overflow: visible;
    }
    
    .secRecommend .boxRecommendSlider .recommendSwiper.disabled .swiper-wrapper {
        justify-content: center;
        display: flex;
        gap: 4rem;
    }
}

.cardRecommend {
    display: block;
    text-decoration: none;
    color: inherit;
    position: relative;
}

.cardRecommend .imgCover {
    aspect-ratio: 540 / 284;
    width: 100%;
    border-radius: 2rem;
    overflow: hidden;
    box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
}

.cardRecommend .imgCover img {
    object-position: center;
    border-radius: 2rem;
}

@media only screen and (max-width:1215px) {
    .recommendSwiper .swiper-slide {
        width: 26.5rem; /* 265px */
    }
    .secRecommend .boxRecommendSlider .recommendSwiper.disabled .swiper-wrapper {
        justify-content: center;
        display: flex;
    }
}

@media (min-width:1216px) {
    .recommendSwiper .swiper-slide {
        width: 31.765%;
        max-width: 54rem; /* 540px */
    }
}

.btnRecommend {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    background: var(--whiteColor);
    color: var(--textColor);
    width: 17rem;
    height: 4.8rem;
    border-radius: 2.4rem;
    text-decoration: none;
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_60);
    font-weight: bold;
    position: absolute;
    bottom: 2rem;
    right: 2rem;
    transition: all 0.3s;
    z-index: 5;
    padding-left: 1.5rem;
    box-shadow: 0 0 1.1rem 0.4rem rgba(0, 0, 0, 0.25);
}

.btnRecommend::before {
    content: '';
    width: 3.6rem;
    height: 3.6rem;
    background: var(--keyColor);
    border-radius: 50%;
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
}

.btnRecommend::after {
    content: '';
    width: 1.8rem;
    height: 0.8rem;
    background: url(../img/common/iconBtnArrow.png) center / cover no-repeat;
    position: absolute;
    z-index: 1;
    right: 1.5rem;
    filter: brightness(0) invert(1);
}

@media (min-width:1215px) {
    .cardRecommend:hover .btnRecommend {
        background: var(--keyColor);
        color: var(--whiteColor);
    }
    .cardRecommend:hover .btnRecommend::before {
        background: var(--whiteColor);
    }
    .cardRecommend:hover .btnRecommend::after {
        filter: brightness(0) saturate(100%) invert(18%) sepia(99%) saturate(2318%) hue-rotate(210deg) brightness(95%) contrast(101%);
    }
}

.recommendSwiper .swiper-button-prev,
.recommendSwiper .swiper-button-next {
    width: 5rem;
    height: 11rem;
    background: var(--keyColor);
    border-radius: 2.5rem;
    z-index: 10;
    margin-top: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.recommendSwiper .swiper-button-prev {
    left: -2.5rem;
}

.recommendSwiper .swiper-button-next {
    right: -2.5rem;
}

.recommendSwiper .swiper-button-prev::before,
.recommendSwiper .swiper-button-prev::after {
    content: '';
    position: absolute;
    width: 0.2rem;
    height: 1.2rem;
    background: var(--whiteColor);
    top: 50%;
    left: 55%;
}

.recommendSwiper .swiper-button-prev::before {
    transform: translate(-50%, -35%) rotate(-45deg);
    transform-origin: center bottom;
}

.recommendSwiper .swiper-button-prev::after {
    transform: translate(-50%, -65%) rotate(45deg);
    transform-origin: center top;
}

.recommendSwiper .swiper-button-next::before,
.recommendSwiper .swiper-button-next::after {
    content: '';
    position: absolute;
    width: 0.2rem;
    height: 1.2rem;
    background: var(--whiteColor);
    top: 50%;
    left: 45%;
}

.recommendSwiper .swiper-button-next::before {
    transform: translate(-50%, -35%) rotate(45deg);
    transform-origin: center bottom;
}

.recommendSwiper .swiper-button-next::after {
    transform: translate(-50%, -65%) rotate(-45deg);
    transform-origin: center top;
}

/* SP���̃��C�A�E�g */
@media only screen and (max-width:1215px) {
    .secRecommend {
        margin-top: 4rem;
    }
    
    .secRecommend .cmnTitleBox {
        margin-bottom: 1.3rem;
    }
    
    .secRecommend .boxRecommendSlider {
        overflow: hidden;
    }
    
    .secRecommend .boxRecommendSlider .recommendSwiper .swiper-wrapper {
        padding: 0rem;
    }
    
    /* SP���͒����񂹂ō��E�Ɍ��؂�� */
    .secRecommend .boxRecommendSlider .recommendSwiper .swiper {
        overflow: visible;
    }
    
    .recommendSwiper .swiper-button-prev {
        left: 0;
    }
    
    .recommendSwiper .swiper-button-next {
        right: 0;
    }
    
    .cardRecommend .imgCover {
        overflow: hidden;
        margin: 0.4rem;
        border-radius: 1.5rem;
        box-shadow: 0 0 0.4rem 0.2rem rgba(0, 0, 0, 0.15);
    }
    .cardRecommend .imgCover img {
        border-radius: 1.5rem;
    }
    
    .btnRecommend {
        display: none;
    }
    
    .recommendSwiper .swiper-button-prev,
    .recommendSwiper .swiper-button-next {
        width: 2.5rem;
        height: 5.5rem;
    }
    
    .recommendSwiper .swiper-button-prev::after,
    .recommendSwiper .swiper-button-next::after {
        font-size: 1.6rem;
    }
    
    /* �X�N���[���o�[�ƃy�[�W���[�{�^����335px�����Ɏ��߂� */
    .secRecommend .boxRecommendSlider .recommendSwiper {
        max-width: 33.5rem;
        margin: 0 auto;
    }
    
    .secRecommend .wrapperScroll .swiper-scrollbar {
        max-width: 33.5rem;
        margin-left: auto;
        margin-right: auto;
    }
    .recommendSwiper .swiper-button-next::before, 
    .recommendSwiper .swiper-button-next::after {
        width: 0.1rem;
        height: 0.6rem;
    }
    .recommendSwiper .swiper-button-prev::before, 
    .recommendSwiper .swiper-button-prev::after {
        width: 0.1rem;
        height: 0.6rem;
    }
}

/* �X�N���[���o�[�̃X�^�C�� */
.secRecommend .wrapperScroll .swiper-scrollbar {
    position: relative !important;
    margin: 4rem auto 0;
    height: 1rem;
    background: var(--bgScrollbar);
    border-radius: 0.5rem;
    width: 100%;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
}

.secRecommend .swiper-scrollbar-drag {
    background: var(--keyColor);
    height: 1rem;
    border-radius: 0.5rem;
    cursor: pointer;
}

@media only screen and (max-width:1215px) {
    .secRecommend .wrapperScroll .swiper-scrollbar {
        margin: 2.6rem auto 0;
        height: 0.6rem;
        border-radius: 0.3rem;
    }
    .secRecommend .swiper-scrollbar-drag {
        height: 0.6rem;
        border-radius: 0.3rem;
    }
}

/*-----------------------------------------------
    secNews
-----------------------------------------------*/
.secNews{
    margin-top: 9.4rem;
    position: relative;
}

/* naviOpen���ɃX���C�_�[��z-index�������� */
#header.naviOpen ~ * .secNews,
body #header.naviOpen ~ * .secNews {
    z-index: 1;
}

/* ���m���ȕ��@: body�ɃN���X���ǉ������ꍇ */
body.naviOpen .secNews {
    z-index: 1;
}
.secNews .txtDate{
    font-size: var(--pcFontSize15);
    letter-spacing: var(--pcLetterSpacing15_50);
    flex-shrink: 0;
    color: var(--GrayColor);
}
.secNews .iconNew{
    font-size: var(--pcFontSize11);
    color: var(--whiteColor);
    width: 4.4rem;
    height: 2rem;
    border-radius: 1rem;
    background: var(--keyColor);
    display: flex;
    align-items: center;
    justify-content: center;
}
.secNews .iconBorder{
    font-size: var(--pcFontSize24);
    color: var(--borderColor05);
    margin: 0 1.7rem;
    position: relative;
}
.secNews .iconBorder::before{
    content: '';
    position: absolute;
    width: 0.1rem;
    height: 2.4rem;
    top: calc(50% - 1.2rem);
    background: var(--borderColor05);
}
.secNews .titNews{
    font-size: var(--pcFontSize16);
    letter-spacing: var(--pcLetterSpacing16_100);
    font-weight: bold;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.secNews .txtNews{
    display: flex;
    align-items: center;
    position: relative;
    gap: 2rem;
    padding: 2.4rem 3rem 2.4rem 0;
    border-bottom: 0.1rem solid var(--borderColor02);
}
.secNews .itemNews:first-child .txtNews{
    border-top: 0.1rem solid var(--borderColor02);
}
.secNews .txtNews::before {
    content: '';
    position: absolute;
    width: 1.8rem;
    height: 0.8rem;
    right: 0rem;
}
.secNews .txtNews.lazyloaded::before {
    background: url(../img/common/iconBtnArrow.png) center / cover no-repeat;
}
.secNews .cmnBtnBox .btnInner {
    margin-top: 3rem;
}
@media only screen and (max-width:1215px) {
    .secNews {
        margin-top: 6rem;
    }
    .secNews .txtNews {
        flex-wrap: wrap;
        gap: 0.8rem;
        padding: 1.8rem 3rem 1.8rem 0;
    }
    .secNews .txtDate {
        font-size: var(--spFontSize12);
        letter-spacing: var(--spLetterSpacing12_50);
    }
    .secNews .iconNew {
        font-size: var(--spFontSize10);
        width: 3.8rem;
        height: 1.6rem;
        border-radius: 1rem;
    }
    .secNews .iconBorder {
        display: none;
    }
    .secNews .titNews {
        font-size: var(--spFontSize14);
        letter-spacing: var(--spLetterSpacing14_50);
        width: 100%;
    }
}

/*-----------------------------------------------
    secNewsRecommend
-----------------------------------------------*/
.secNewsRecommend {
    margin-top: 9.4rem;
    position: relative;
}

#header.naviOpen ~ * .secNewsRecommend,
body #header.naviOpen ~ * .secNewsRecommend {
    z-index: 1;
}

body.naviOpen .secNewsRecommend {
    z-index: 1;
}   
.secNewsRecommend .cmnTitleBox {
    margin-bottom: 3.4rem;
}
.secNewsRecommend .cmnBtnBox .btnInner {
    margin-top: 6rem;
}
.secNewsRecommend .boxNewsRecommendSlider {
    width: 100%;
    overflow: visible;
}

.secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper {
    position: relative;
    width: 100%;
    padding: 0;
    overflow: visible;
}

.secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-wrapper {
    padding: 0;
}

@media (min-width:1216px) {
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-wrapper {
        display: flex;
        gap: 3.9%;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-slide {
        width: 30.72% !important;
        margin-right: 0;
        height: auto;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-button-prev,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-button-next {
        display: none;
    }
}

@media (min-width:1216px) {
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-wrapper {
        display: flex;
        gap: 3.9%;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-slide {
        width: 30.72% !important;
        margin-right: 0;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-button-prev,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-button-next {
        display: none;
    }
}

@media (min-width:1216px) {
    /* Swiper有効（=PCで4件以上）のときだけボタン表示 */
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next {
        display: flex !important;
    }

    /* PCでSwiper有効時は、flex gapを0にしてSwiperのspaceBetweenと一致させる */
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-wrapper {
        gap: 0 !important;
    }

    /* ボタンの見た目（SPと同様の装飾） */
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next {
        width: 4.0rem;
        height: 7.5rem;
        background: var(--keyColor);
        border-radius: 3.2rem;
        z-index: 10;
        margin-top: 0;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev {
        right: unset;
        left: -2rem;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next {
        left: unset;
        right: -2rem;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::before,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::after,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::before,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::after {
        content: '';
        position: absolute;
        width: 0.2rem;
        height: 1rem;
        background: var(--whiteColor);
        top: 50%;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::before,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::after {
        left: 55%;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::before,
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::after {
        left: 45%;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::before {
        transform: translate(-50%, -35%) rotate(-45deg);
        transform-origin: center bottom;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-prev::after {
        transform: translate(-50%, -65%) rotate(45deg);
        transform-origin: center top;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::before {
        transform: translate(-50%, -35%) rotate(45deg);
        transform-origin: center bottom;
    }

    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper.pcNewsRecommendSwiper .swiper-button-next::after {
        transform: translate(-50%, -65%) rotate(-45deg);
        transform-origin: center top;
    }
}

.secNewsRecommend .listNewsRecommend {
    display: flex;
    gap: 3.9%;
}
.secNewsRecommend .itemNewsRecommend {
    width: 30.72%;
}

.secNewsRecommend .txtNewsRecommend,
.secNewsRecommend .swiper-slide .txtNewsRecommend {
    padding: 3rem 3rem 4rem;
    background: var(--whiteColor);
    width: 100%;
    border-radius: 2rem;
    box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
    position: relative;
    display: block;
    transition: all 0.3s;
    text-decoration: none;
    height: 100%;
}

.secNewsRecommend .itemNewsRecommend .imgTour,
.secNewsRecommend .swiper-slide .imgTour {
    aspect-ratio: 370 / 522;
    width: 100%;
    border-radius: 0;
    overflow: hidden;
}

.secNewsRecommend .itemNewsRecommend .imgTour img,
.secNewsRecommend .swiper-slide .imgTour img {
    border-radius: 0;  
}

.secNewsRecommend .itemNewsRecommend .titNewsRecommend,
.secNewsRecommend .swiper-slide .titNewsRecommend {
    font-size: var(--pcFontSize16);
    letter-spacing: var(--pcLetterSpacing16_100);
    line-height: var(--pcLineHeight16_26);
    color: var(--keyColor);
    font-weight: bold;
    margin-top: 1.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.secNewsRecommend .itemNewsRecommend .txtPlace,
.secNewsRecommend .swiper-slide .txtPlace {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_50);
    line-height: var(--pcLineHeight14_28);
    margin-top: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 4rem;
    position: relative;
    min-height: 2.3rem;
}

.secNewsRecommend .itemNewsRecommend .txtPlace::before,
.secNewsRecommend .swiper-slide .txtPlace::before {
    content: '';
    position: absolute;
    width: 3rem;
    height: 2.3rem;
    left: 0rem;
    top: 50%;
    transform: translateY(-50%);
}

.secNewsRecommend.lazyloaded .itemNewsRecommend .txtPlace::before,
.secNewsRecommend.lazyloaded .swiper-slide .txtPlace::before {
    background: url(../img/common/iconPin.png) center center / cover no-repeat;
}

.secNewsRecommend .itemNewsRecommend .txtPeriod,
.secNewsRecommend .swiper-slide .txtPeriod {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_50);
    line-height: var(--pcLineHeight14_28);
    margin-top: 1.5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 4rem;
    position: relative;
    min-height: 2.3rem;
}

.secNewsRecommend .itemNewsRecommend .txtPeriod::before,
.secNewsRecommend .swiper-slide .txtPeriod::before {
    content: '';
    position: absolute;
    width: 3rem;
    height: 2.3rem;
    left: 0rem;
    top: 50%;
    transform: translateY(-50%);
}

.secNewsRecommend.lazyloaded .itemNewsRecommend .txtPeriod::before,
.secNewsRecommend.lazyloaded .swiper-slide .txtPeriod::before {
    background: url(../img/common/iconCalendar.png) center center / cover no-repeat;
}

.secNewsRecommend .txtNewsRecommend::after {
    content: '';
    width: 3.6rem;
    height: 3.6rem;
    background: var(--keyColor);
    border-radius: 50%;
    position: absolute;
    right: 3rem;
    bottom: 3.6rem;
    transition: all 0.5s;
}

.secNewsRecommend .txtNewsRecommend::before {
    content: '';
    width: 1.8rem;
    height: 0.8rem;
    position: absolute;
    bottom: 5rem;
    z-index: 1;
    right: 3.9rem;
    filter: brightness(0) invert(1);
}
.secNewsRecommend.lazyloaded .txtNewsRecommend::before {
    background: url(../img/common/iconBtnArrow.png) center / cover no-repeat;
}

@media (min-width:1215px) {
    .secNewsRecommend .txtNewsRecommend:hover::after {
        background: var(--whiteColor);
        border: 0.1rem solid var(--keyColor);
    }
    .secNewsRecommend .txtNewsRecommend:hover::before {
        filter: brightness(0) saturate(100%) invert(18%) sepia(99%) saturate(2318%) hue-rotate(210deg) brightness(95%) contrast(101%);
    }
}


@media only screen and (max-width:1215px) {
    .secNewsRecommend {
        margin-top: 6rem;
    }
    
    .secNewsRecommend .listNewsRecommend.pcOnly {
        display: none;
    }

    .secNewsRecommend .boxNewsRecommendSlider {
        width: 100%;
        overflow: visible;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper {
        position: relative;
        width: 100%;
        padding: 0;
        overflow: visible;
        max-width: 33.5rem;
    }
    
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-wrapper {
        padding: 0;
    }
    
    /* SP時、スライダーが1枚の時のみ中央寄せ */
    .secNewsRecommend .boxNewsRecommendSlider .newsRecommendSwiper .swiper-wrapper:has(.swiper-slide:only-child) {
        justify-content: center;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-slide {
        width: 26.5rem;
        height: auto;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-slide .txtNewsRecommend {
        display: block;
        width: 100%;
        padding: 2rem 2rem 2.5rem;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-slide .imgTour {
        border-radius: 0;
        box-shadow: 0 0 0.4rem 0.2rem rgba(0, 0, 0, 0.15);
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev,
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next {
        width: 2.5rem;
        height: 5.5rem;
        background: var(--keyColor);
        border-radius: 2.5rem;
        z-index: 10;
        margin-top: 0;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev {
        left: 0;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next {
        right: 0;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev::before,
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev::after {
        content: '';
        position: absolute;
        width: 0.1rem;
        height: 0.6rem;
        background: var(--whiteColor);
        top: 50%;
        left: 55%;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev::before {
        transform: translate(-50%, -35%) rotate(-45deg);
        transform-origin: center bottom;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-prev::after {
        transform: translate(-50%, -65%) rotate(45deg);
        transform-origin: center top;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next::before,
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next::after {
        content: '';
        position: absolute;
        width: 0.1rem;
        height: 0.6rem;
        background: var(--whiteColor);
        top: 50%;
        left: 45%;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next::before {
        transform: translate(-50%, -35%) rotate(45deg);
        transform-origin: center bottom;
    }
    
    .secNewsRecommend .newsRecommendSwiper .swiper-button-next::after {
        transform: translate(-50%, -65%) rotate(-45deg);
        transform-origin: center top;
    }
    .secNewsRecommend .cmnBtnBox .btnInner {
        margin-top: 3rem;
    }
    .secNewsRecommend .itemNewsRecommend .titNewsRecommend, .secNewsRecommend .swiper-slide .titNewsRecommend {
        font-size: var(--spFontSize15);
        letter-spacing: var(--spLetterSpacing15_50);
        line-height: var(--spLineHeight15_26);
        margin-top: 1.5rem;
    }
    .secNewsRecommend .itemNewsRecommend .imgTour img, 
    .secNewsRecommend .swiper-slide .imgTour img {
        border-radius: 0;
    }
    .secNewsRecommend .itemNewsRecommend .txtPlace::before,
    .secNewsRecommend .swiper-slide .txtPlace::before {
        left: 0.5rem;
    }
    .secNewsRecommend .itemNewsRecommend .txtPeriod::before, 
    .secNewsRecommend .swiper-slide .txtPeriod::before {
        left: 0.5rem;
    }
    .secNewsRecommend .txtNewsRecommend::after {
        content: '';
        width: 2.2rem;
        height: 2.2rem;
        background: var(--keyColor);
        border-radius: 50%;
        position: absolute;
        right: 2rem;
        bottom: 3rem;
    }
    .secNewsRecommend .txtNewsRecommend::before {
        content: '';
        width: 1.2rem;
        height: 0.6rem;
        bottom: 3.8rem;
        right: 2.5rem;
    }
}


/*-----------------------------------------------
    secPickup
-----------------------------------------------*/
.secPickup {
    margin-top: 9.4rem;
    position: relative;
}

#header.naviOpen ~ * .secPickup,
body #header.naviOpen ~ * .secPickup {
    z-index: 1;
}
body.naviOpen .secPickup {
    z-index: 1;
}
.secPickup .listPickup {
    display: flex;
    gap: 2rem 2.853%;
    flex-wrap: wrap;
}
.secPickup .itemPickup {
    width: 22.86%;
    max-width: 32rem;
    box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
    border-radius: 0.4rem;
    overflow: hidden;
}
.secPickup .imgPickup {
    aspect-ratio: 640 / 180;
    width: 100%;
    display: block;
}
@media only screen and (max-width:1215px) {
    .secPickup {
        margin-top: 5rem;
    }
    .secPickup .listPickup {
        display: flex;
        gap: 1.5rem;
        flex-direction: column;
        align-items: center;
        padding: 1.5rem;
        border-radius: 1rem;
        box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
    }
    .secPickup .itemPickup {
        width: 100%;
        max-width: unset;
    }
    .secPickup .imgPickup {
        box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
    }
}

/*-----------------------------------------------
    secFlow
-----------------------------------------------*/
.secFlow {
    margin-top: 12rem;
    padding-top: 9.4rem;
    padding-bottom: 9.4rem;
    position: relative;
    overflow: hidden;
}
.secFlow.lazyloaded{
    background: url(../img/index/bgFlow.jpg) center center / cover no-repeat;
}

.secFlow .wrapperFlow {
    position: relative;
}

#header.naviOpen ~ * .secFlow .wrapperFlow,
body #header.naviOpen ~ * .secFlow .wrapperFlow {
    z-index: 1;
}

.secFlow .cmnTitleBox {
    margin-bottom: 9rem;
}

.secFlow .listFlow {
    position: relative;
    left: 4rem;
    max-width: calc(100% - 10rem);
    width: 120.5rem;
    margin: 0 auto;
}

.secFlow .listFlow::before {
    content: '';
    position: absolute;
    left: -4rem;
    top: 6rem;
    bottom: 0;
    height: 156rem;
    width: 1.2rem;
    background-image: url(../img/index/flowDots.svg);
    background-size: 10px 34px;
    background-position: center top;
    background-repeat: repeat-y;
    z-index: 0;
}


.secFlow .itemFlow {
    position: relative;
    margin-bottom: 5rem;
    /* STEP本体はドットラインより手前に表示 */
    z-index: 1;
}

.secFlow .itemFlow:last-child {
    margin-bottom: 0;
}

/* �X�e�b�v�ԍ��̉~ */
.secFlow .itemFlow::before {
    content: '';
    position: absolute;
    left: -8.4rem;
    top: -2rem;
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    z-index: 2;
}

.secFlow.lazyloaded .itemFlow.itemStep01::before {
    background: url(../img/index/iconStep01.png) center center / cover no-repeat;
}
.secFlow.lazyloaded .itemFlow.itemStep02::before {
    background: url(../img/index/iconStep02.png) center center / cover no-repeat;
}
.secFlow.lazyloaded .itemFlow.itemStep03::before {
    background: url(../img/index/iconStep03.png) center center / cover no-repeat;
}
.secFlow.lazyloaded .itemFlow.itemStep04::before {
    background: url(../img/index/iconStep04.png) center center / cover no-repeat;
}
.secFlow.lazyloaded .itemFlow.itemStep05::before {
    background: url(../img/index/iconStep05.png) center center / cover no-repeat;
}
.secFlow.lazyloaded .itemFlow.itemStep06::before {
    background: url(../img/index/iconStep06.png) center center / cover no-repeat;
}

.secFlow .itemFlow .boxStep {
    position: relative;
}

.secFlow .itemFlow .titStep {
    font-size: var(--pcFontSize28);
    letter-spacing: var(--pcLetterSpacing28_100);
    font-weight: bold;
    color: var(--keyColor);
    padding-bottom: 2rem;
    border-bottom: 0.1rem solid var(--borderColor03);
    margin-bottom: 4rem;
    padding-left: 3.5rem;
}

.secFlow .itemFlow .txtStep {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_50);
    line-height: var(--pcLineHeight14_28);
    color: var(--textColor);
    width: 118rem;
    margin: 0 0 0 auto;
    background: var(--whiteColor);
    padding: 3.7rem 3rem;
    border-radius: 2rem;
    box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
}

.secFlow .itemFlow .listStepItem {
    margin-top: 2rem;
    display: flex;
    gap: 4.235%;
}
.secFlow .itemFlow .itemStepItem {
    background: var(--whiteColor);
    border-radius: 2rem;
    width: 118rem;
}
.secFlow .itemFlow.itemStep01 .itemStepItem {
    max-width: 36rem;
    width: 30.51%;
    box-shadow: 0 0 1rem 0.2rem rgba(0, 0, 0, 0.15);
}

.secFlow .itemFlow .titStepItem {
    font-size: var(--pcFontSize17);
    letter-spacing: var(--pcLetterSpacing17_50);
    font-weight: bold;
    color: var(--keyColor);
    text-align: center;
    padding: 0.7rem 1rem;
}

.secFlow .itemFlow .txtStepItem {
    /* font-size: var(--pcFontSize14); */
    font-size: var(--pcFontSize17);
    letter-spacing: var(--pcLetterSpacing14_20);
    line-height: var(--pcLineHeight14_23);
    color: var(--textColor);
    font-weight: bold;
}

.secFlow .itemFlow .txtRed {
    color: #E60012;
    font-weight: bold;
}

.secFlow .itemFlow .txtNote {
    font-size: var(--pcFontSize13);
    color: var(--GrayColor);
    margin-top: 0.5rem;
}

.secFlow .itemFlow .boxStore {
    margin-top: 1rem;
    padding-top: 0.5rem;
    border-top: 0.1rem solid var(--borderColor03);
}

.secFlow .itemFlow .boxStore:first-child {
    margin-top: 1rem;
    padding-top: 0;
    border-top: none;
}

.secFlow .itemFlow .nameStore {
    font-size: var(--pcFontSize16);
    letter-spacing: var(--pcLetterSpacing16_30);
    font-weight: bold;
}

.secFlow .itemFlow .txtAddress {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing13_30);
    line-height: var(--pcLineHeight14_28);
    color: var(--keyColor);
    font-weight: bold;
    padding-left: 3.5rem;
    position: relative;
    display: block;
}
.secFlow .itemFlow .txtAddress::before {
    content: '';
    position: absolute;
    width: 3rem;
    height: 2.3rem;
    left: 0rem;
    top: 0;
}
.secFlow.lazyloaded .itemFlow .txtAddress::before {
    background: url(../img/common/iconPin.png) center center / cover no-repeat;
}

.secFlow .itemFlow .txtTime {
    font-size: var(--pcFontSize13);
    font-weight: bold;
    letter-spacing: 0;
}

.secFlow .itemFlow .txtTel {
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_50);
    line-height: var(--pcLineHeight14_25);
    margin-bottom: 0.5rem;
}

.secFlow .itemFlow .txtTel a {
    color: var(--keyColor);
    text-decoration: none;
    font-weight: bold;
}

.secFlow .itemFlow .txtTel a:hover {
    text-decoration: underline;
}

.secFlow .itemFlow .txtStep.boxTopFlow {
    padding: 0;
    background: none;
    box-shadow: none;
}

.secFlow .boxTopFlow .listStepItem {
    display: flex;
    gap: 5rem;
}
.secFlow .boxTopFlow .itemStepItem {
    width: calc((100% - 10rem) / 3);
}

.secFlow .boxTopFlow .titStepItem {
    background: var(--keyColor);
    color: var(--whiteColor);
    border-radius: 2rem 2rem 0 0;
    height: 4.6rem;
}
.secFlow .boxTopFlow .boxStepItem {
    padding: 1.5rem 2.5rem;
}
.secFlow .boxTopFlow .boxStepItem .txtStepItem{
    font-size: var(--pcFontSize16);
}
.secFlow .telStepItem .nameStore {
    font-size: var(--pcFontSize16);
    letter-spacing: var(--pcLetterSpacing13_30);
    font-weight: bold;
}
.secFlow .telStepItem .txtAddress {
    font-size: var(--pcFontSize22);
    letter-spacing: var(--pcLetterSpacing22_60);
    font-weight: bold;
    padding-left: 0;
    line-height: 1;
    margin-bottom: 0.5rem;
}
.secFlow .telStepItem .txtAddress::before {
    display: none;
}
.secFlow .txtStepItem .colorRed {
    color: var(--colorRed);
}

@media only screen and (max-width:1215px) {
    .secFlow {
        margin-top: 6rem;
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
    .secFlow.lazyloaded{
        background: url(../img/index/bgFlow_sp.jpg) center bottom / cover no-repeat;
    }
    
    .secFlow .cmnTitleBox {
        margin-bottom: 5rem;
    }
    
    .secFlow .listFlow {
        padding-left: 0;
        max-width: calc(100% - 7rem);
        width: 100%;
        left: 0;
        margin: 0 0 0 auto;
    }
    
    .secFlow .itemFlow {
        margin-bottom: 3rem;
    }
    
    .secFlow .itemFlow .boxContent {
        padding: 0rem;
    }
    .secFlow .itemFlow::before {
        left: -7.4rem;
        top: -2rem;
        width: 6rem;
        height: 6rem;
    }
    .secFlow .listFlow::before {
        left: -5rem;
        top: -1.4rem;
        bottom: 0;
        height: calc(100% - 8rem);
        width: 1.2rem;
        background-image: url(../img/index/flowDots.svg);
        background-size: 10px 34px;
    }
    .secFlow .itemFlow .titStep {
        font-size: var(--spFontSize18);
        letter-spacing: var(--spLetterSpacing18_50);
        padding-bottom: 2rem;
        border-bottom: none;
        margin-bottom: 0rem;
        padding-left: 0;
    }
    .secFlow .itemFlow .txtStep {
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_20);
        line-height: var(--spLineHeight11_20);
        width: 100%;
        margin: 0;
        padding: 2rem 2rem;
        border-radius: 1.8rem;
    }
    .secFlow .boxTopFlow .listStepItem {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        margin-top: 1rem;
    }
    .secFlow .itemFlow.itemStep01 .itemStepItem {
        width: 100%;
    }
    .secFlow .itemFlow .titStepItem {
        font-size: var(--spFontSize14);
        letter-spacing: var(--spLetterSpacing14_50);
        padding: 0.7rem 1rem;
        height: 3.6rem;
    }
    .secFlow .boxTopFlow .boxStepItem {
        padding: 1.5rem 2rem;
    }
    .secFlow .boxTopFlow .boxStepItem .txtStepItem{
        font-size: var(--spFontSize11);
    }
    .secFlow .itemFlow .txtStepItem {
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_20);
        line-height: var(--spLineHeight11_20);
    }
    .secFlow .itemFlow .txtAddress {
        font-size: var(--spFontSize12);
        letter-spacing: var(--spLetterSpacing13_30);
        line-height: var(--spLineHeight12_22);
        padding-left: 3rem;
    }
    .secFlow .telStepItem .txtAddress {
        font-size: var(--spFontSize20);
        letter-spacing: var(--spLetterSpacing20_60);
        padding-left: 0;
        line-height: 1;
    }
    .secFlow .itemFlow .txtTime {
        font-size: var(--spFontSize12);
    }
}
@media only screen and (max-width:370px) {
    .secFlow .itemFlow .txtAddress {
        font-size: var(--spFontSize10);
    }
    .secFlow .itemFlow .nameStore {
        font-size: var(--pcFontSize14);
    }
    .secFlow .telStepItem .nameStore {
        font-size: var(--pcFontSize14);
    }
    .secFlow .boxTopFlow .boxStepItem {
        padding: 1rem 1rem;
    }
    .secFlow .telStepItem .txtAddress {
        font-size: var(--spFontSize18);
    }
    .secFlow .itemFlow .txtStep {
        padding: 1rem 1rem;
    }
}
/*-----------------------------------------------
    secBlog
-----------------------------------------------*/
.secBlog {
    margin-top: 0rem;
    position: relative;
    display: flex;
    gap: 4rem;
}
.secBlog .boxVoice,
.secBlog .boxBlog{
    width: 100%;
    margin-top: 0;
}
.secBlog:has(.boxBlog) .boxVoice,
.secBlog:has(.boxVoice) .boxBlog{
    width: calc((100% - 4rem) / 2);
}
.secBlog .cmnBtnBox .btnInner {
    margin-top: 6rem;
}
.secBlog .secNews .iconNew {
    height: 4.4rem;
    border-radius: 50%;
    flex-shrink: 0;
}
.secBlog .iconBorder::before{
    content: '';
    position: absolute;
    width: 0.1rem;
    height: 4.4rem;
    top: calc(50% - 2.2rem);
    background: var(--borderColor05);
}
.secBlog .txtNews {
    min-height: 9.2rem;
}
@media only screen and (max-width:1215px) {
    .secBlog {
        margin-top: 0rem;
        flex-direction: column;
        gap: 0;
    }
    .secBlog .boxVoice,
    .secBlog .boxBlog{
        width: 89.336%;
    }
    .secBlog:has(.boxBlog) .boxVoice,
    .secBlog:has(.boxVoice) .boxBlog{
         width: 89.336%;
    }
    .secBlog .secNews + .secNews {
        margin-top: 6rem;
    }
    .secBlog .secNews .iconNew {
        width: 3.8rem;
        height: 1.6rem;
        border-radius: 1rem;
    }
    .secBlog .txtNews {
        min-height: auto;
    }
    .secBlog .cmnBtnBox .btnInner {
        margin-top: 3rem;
    }
}

/*-----------------------------------------------
    secAccess
-----------------------------------------------*/
.secAccess {
    display: flex;
    gap: 2.85%;
    margin-top: 10rem;
}
.secAccess .secWrapper{
    display: block;
    width: 48.57%;
    border-radius: 2rem;
    overflow: hidden;
    color: var(--whiteColor);
}
.secAccess .secWrapper .inner{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1.9rem;
    height: 35rem;
    width: 100%;
}
.secAccess .secWrapper .txtEng{
    font-style: italic;
    font-weight: bold;
    font-size: var(--pcFontSize36);
}
.secAccess .secWrapper .titJp{
    font-weight: bold;
    font-size: var(--pcFontSize22);
    letter-spacing: var(--pcLetterSpacing22_150);
}
.secAccess .secWrapper .txtUnder{
    background: var(--keyColor);
    width: 100%;
    height: 50px;
    padding: 0 2rem;
    color: var(--whiteColor);
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_100);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.secAccess .secWrapper .txtUnder::after {
    content: '';
    width: 1.8rem;
    height: 0.8rem;
    filter: brightness(0) invert(1);
    margin-left: 1rem;
    transition: filter 0.3s;
}
.secAccess.lazyloaded .secWrapper .txtUnder::after {
    background: url(../img/common/iconBtnArrow.png) center / cover no-repeat;
}

.secAccess .secLinkBox {
    position: relative;
    display: block;
    border-radius: 2rem;
}

.secAccess.lazyloaded .secLinkBox {
    background: url(../img/index/bgService.jpg) center / cover no-repeat;
}
.secAccess.lazyloaded .secLinkBox.secCompany {
    background: url(../img/index/bgCompany.jpg) center / cover no-repeat;
}

@media only screen and (max-width:1500px) {
    .secAccess .secWrapper .txtUnder {
        font-size: var(--pcFontSize12);
    }
}
@media only screen and (max-width:1215px) {
    .secAccess {
        gap: 3rem;
        margin-top: 6rem;
        flex-direction: column;
    }
    .secAccess .secWrapper {
        width: 100%;
        border-radius: 1rem;
        padding-bottom: 6rem;
        position: relative;
    }
    .secAccess .secWrapper .inner {
        gap: 1.4rem;
        height: 19.7rem;
        width: 100%;
    }
    .secAccess .secWrapper .txtUnder {
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_20);
        letter-spacing: 0;
        color: var(--textColor);
        position: absolute;
        bottom: 0;
        background: none;
        padding: 0 4.6rem 0 0;
        font-weight: bold;
    }
    .secAccess .secLinkBox {
        position: static;
        border-radius: 1rem;
    }
    .secAccess .secWrapper .txtUnder::after {
        content: '';
        width: 3.6rem;
        height: 3.6rem;
        background: var(--keyColor);
        border-radius: 50%;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        filter: unset;
        margin-left: unset;
        transition: unset;
    }
    .secAccess.lazyloaded .secWrapper .txtUnder::after {
        background: var(--keyColor);
    }
    .secAccess .secWrapper .txtUnder::before {
        content: '';
        width: 1.8rem;
        height: 0.7rem;
        top: 50%;
        right: 0.8rem;
        transform: translateY(-50%);
        position: absolute;
        filter: brightness(0) invert(1);
        margin-left: 1rem;
        transition: filter 0.3s;
        z-index: 2;
    }
    .secAccess.lazyloaded .secWrapper .txtUnder::before {
        background: url(../img/common/iconBtnArrow.png) center / cover no-repeat;
    }
    .secAccess .secWrapper .txtEng {
        font-size: var(--spFontSize28);
    }
    .secAccess .secWrapper .titJp {
        font-size: var(--spFontSize18);
        letter-spacing: var(--spLetterSpacing18_150);
    }
}