@charset "utf-8";
/*-----------------------------------------------
    Zen Kaku Gothic 縦書き
-----------------------------------------------*/
@font-face{
    font-family:'Zen Kaku Gothic New Vertical';
    font-style:normal;
    font-weight:400;
    src:url(../fonts/Zen_Kaku_Gothic_New/vertical/ZenKakuGothicNew-Regular.woff2) format('woff2'),
        url(../fonts/Zen_Kaku_Gothic_New/vertical/ZenKakuGothicNew-Regular.woff) format('woff'),
        url(../fonts/Zen_Kaku_Gothic_New/vertical/ZenKakuGothicNew-Regular.ttf) format('opentype');
}
.fVerticalSans{
    font-family: 'Zen Kaku Gothic New Vertical', sans;
}
@media only screen and (max-width:1215px){
    .fVerticalSans_sp{
        font-family: 'Zen Kaku Gothic New Vertical', sans;
    }
}

/*-----------------------------------------------
    カーソルカスタマイズ
-----------------------------------------------*/

#cursor{
    position: fixed;
    border-radius:100%;
    width: 1.25rem;
    height: 1.25rem;
    margin: -1.7rem 0 0 -1.25rem;
    z-index: 9999999;
    pointer-events: none;
    opacity: 0;
    transition: transform .5s;
    opacity: .7 !important;
    color: #b7b3b1;
    width: 1.25rem;
    height: 1.25rem;
    transition: margin 1.5s;
}
#cursor.active{
    margin: -5rem 0 0 -5rem;
}
#cursor .cursorIn{
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid;
    border-color: #fff;
    border-radius: 50%;
    transition: .8s;
    transition-property: background-color;
    width: 0;
    height: 0;
    transition: width 1.5s, height 1.5s;
    opacity: 0;
}
#cursor.in .cursorIn{
    opacity: 1;
}
#cursor.active .cursorIn{
    width: 8.2rem;
    height: 8.2rem;
    opacity: 1;
    border-color: #b7b3b1;
}
#cursor .cursorIn::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 1.6rem;
    height: 0.4rem;
    background: url(../img/common/iconArrow_Circle_gray.png) center top / cover no-repeat;
    opacity:0;
    transition-delay: 1.3s;
    transition: .5s;
}
#cursor.active .cursorIn::before{
    opacity:1;
}
@keyframes animation_css {
    0% {
        top: 50%;
        left: 50%;
    }
    100% {
        top: -130%;
        left: -280%;
    }
}

#loadingScreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: 0.85s all cubic-bezier(.275,0,0,1);
}
#loadingScreen.loadingComplete {
    height: 0%;
}

.loadingLogo {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transition: all 1.5s cubic-bezier(.275,0,0,1);
}
.loadingLogo.logoFade {
    transform: translateY(-1vw);
    opacity: 0;
}
.logoSvg {
    display: block;
}

.progressBar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.2);
    overflow: hidden;
}
.progressFill {
    width: 0%;
    height: 100%;
    background-color: #000;
}

/* header */
#btnNavi,
#header {
    transition: all 2s cubic-bezier(.275,0,0,1);
    transform: translateY(-1vw);
    opacity: 0;
}
.loaded #btnNavi,
.loaded #header {
    transform: translateY(0);
    opacity: 1;
    transition-delay: 0.6s;
}

/* container */
#container{
    position: relative;
    z-index: 1;
}
#container::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.8s;
    z-index: -1;
}
#container.bgWh::after {
    background-color: var(--whiteColor);
}
#container.bgBl::after {
    background-color: var(--blackColor);
}
@media only screen and (max-width:1215px){
    #container.bgWh::after,
    #container.bgBl::after {
        display: none;
    }
}
/*-----------------------------------------------
    index
-----------------------------------------------*/
/* secHero */
.secHero{
    position: relative;
    background-color: rgba(0, 0, 0);
}
.secHero .wrapper{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    max-width: calc(100% - 20rem);
    z-index: 4;
}
.secHero .boxHeroTit{
    margin-top: 10.5rem;
}
.secHero .boxHeroTit .txt{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: left;
    font-size: var(--pcFontSize150);
    color: var(--whiteColor);
    font-weight: 300;
}
.secHero .boxHeroTit .txt_anim {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    visibility: hidden;
}
.secHero .boxHeroTit .txt_italic {
    position: relative;
    font-style: italic;
    right: 1rem;
}
.loaded .secHero .boxHeroTit .txt_anim {
    visibility: visible;
}
.secHero .boxHeroTit .txt_anim +  .txt_anim {
    margin-top: -1.5rem;
}
.secHero .boxHeroTit .cursor {
    display: inline-block;
    width: 0.2rem;
    height: 1em;
    background: var(--whiteColor);
    vertical-align: bottom;
    margin-left: 0.2rem;
    animation: blink 1.06s steps(1) infinite;
}
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
/* boxHeroTxt */
.secHero .boxHeroTxt {
    position: absolute;
    bottom: 10rem;
    left: 0;
    font-size: var(--pcFontSize36);
    line-height: var(--pcLineHeight36_80);
    letter-spacing: var(--pcLetterSpacing36_40);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
}
.loaded .secHero .boxHeroTxt {
    animation: animetionLeft 1s cubic-bezier(.785,.135,.15,.86) .5s normal forwards;
}
@keyframes animetionLeft{
    0% {
        -webkit-clip-path: inset(0 100% 0 0);
        clip-path: inset(0 100% 0 0);
    }
    to {
        -webkit-clip-path: inset(0);
        clip-path: inset(0);
    }
}
.secHero .boxHeroTxt .txtBgBlack{
    background-color: var(--blackColor);
    color: var(--whiteColor);
    display: inline;
    padding: 0 1.5rem 0.3rem 1.5rem;
    line-height: var(--pcLineHeight36_67);
}
/* boxScroll */
.secHero .boxScroll{
    position: absolute;
    bottom: 0;
    left: 5.2rem;
    margin: auto;
    display: flex;
    justify-content: center;
    z-index: 3;
    width: 0.1rem;
    padding-bottom: 10rem;
}
.secHero .boxScroll::before,
.secHero .boxScroll::after {
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    bottom: 0;
    right: 0;
    width: 0.1rem;
    height: 10rem;
    background-color: var(--whiteColor);
}
.secHero .boxScroll::before {
    opacity: 0.2;
}
.secHero .boxScroll::after {
    animation: scroll 2s infinite;
}
.secHero .boxScroll .txtScroll{
    position: relative;
    color: var(--whiteColor);
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_40);
    transform: rotate(90deg);
    left: 0.2rem;
    bottom: 2.2rem;
    white-space: nowrap;
}
@keyframes scroll {
    0% {
        transform: scale(1, 0);
        transform-origin: 0 0;
    }
    50% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }
    51% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }
    100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}

/* boxSlider */
.secHero .boxSlider {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}
.secHero .swiper_origin,
.secHero .swiper_origin_wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}
.secHero .item {
    position: relative;
    opacity: 0;
    display: none;
    width: 100%;
    height: 100vh;
    transition: opacity 0.6s cubic-bezier(0.14, 1, 0.34, 1);
}
.secHero .item:after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    right: 0;
    width: 93rem;
    height: 100%;
    background-image: -moz-linear-gradient( 0deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
    background-image: -ms-linear-gradient( 0deg, rgba(0,0,0,0) 0%, rgb(0,0,0) 100%);
    opacity: 0.4;
}
.secHero .item:first-child {
    opacity: 1;
    display: block;
}

.secHero .item,
.secHero .item .img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.secHero .item .img {
    top: -8%;
    bottom: auto;
}
.secHero .img{
    width: 100%;
    height: 108%;
}
/* .secHero .img img {
	animation: moveDown 11s linear 0s 1 normal both;
}
@keyframes moveDown {
	0% {
		transform: translateY(0%);
	}
	100% {
		transform: translateY(4%);
	}
} */
@media only screen and (max-width:1215px){
    .secHero{
        height: 66.77rem;
        min-height: 66.77rem;
    }
    .secHero .wrapper{
        max-width: 40rem;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
    .secHero .boxHeroTit{
        position: absolute;
        bottom: 2rem;
        right: -1rem;
    }
    .secHero .boxHeroTit .txt{
        font-size: var(--spFontSize32);
        letter-spacing: var(--spLetterSpacing60_0);
    }
    .secHero .boxHeroTit .txt_anim +  .txt_anim {
        margin-top: 0;
    }
    .secHero .boxHeroTit .txt_italic {
        right: 0.2rem;
    }
    /* boxHeroTxt */
    .secHero .boxHeroTxt {
        position: static;
        font-size: var(--spFontSize16);
        line-height: var(--spLineHeight16_36);
        letter-spacing: var(--spLetterSpacing16_0);
        gap: 0.6rem;
        writing-mode: vertical-rl;
        text-orientation: upright;
        margin-top: 2rem;
        -webkit-clip-path: inset(0 0 100% 0);
        clip-path: inset(0 0 100% 0);
    }
    @keyframes animetionLeft{
        0% {
            -webkit-clip-path: inset(0 0 100% 0);
            clip-path: inset(0 0 100% 0);
        }
        to {
            -webkit-clip-path: inset(0);
            clip-path: inset(0);
        }
    }
    .secHero .boxHeroTxt .txtBgBlack{
        padding: 0.5rem 0.4rem 0.3rem 0.4rem;
        line-height: var(--spLineHeight16_22);
    }
    /* boxScroll */
    .secHero .boxScroll{
        left: 2.4rem;
        padding-bottom: 4rem;
    }
    .secHero .boxScroll::before,
    .secHero .boxScroll::after {
        width: 0.1rem;
        height: 4rem;
    }
    .secHero .boxScroll .txtScroll{
        font-size: var(--spFontSize13);
        letter-spacing: var(--spLetterSpacing13_0);
        bottom: 1.5rem;
    }
    .secHero .boxSlider,
    .secHero .item{
        height: 100%;
	}
    .secHero .item:after{
        width: 100%;
        height: 100%;
        background-image: -moz-linear-gradient( 0deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
        background-image: -webkit-linear-gradient( 0deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
        background-image: -ms-linear-gradient( 0deg, rgb(0,0,0) 0%, rgba(0,0,0,0) 100%);
        opacity: 0.2;
    }
}
@media only screen and (max-width:767px){
    .secHero{
        min-height: 50rem;
    }
}

/* secTopics */
.secTopics{
    padding: 6.8rem 0;
}
.secTopics .tit{
    position: relative;
    display: inline-block;
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_80);
    color: var(--whiteColor);
    font-weight: bold;
    padding-right: 11rem;
}
.secTopics .tit::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 10rem;
    height: 0.1rem;
    background-color: var(--whiteColor);
}
/* boxSlider */
.secTopicsSlider .boxSlider{
    position: relative;
    overflow: hidden;
    margin-top: 4rem;
}
.secTopicsSlider .swiper{
    width: 68rem;
    overflow: visible;
}
.secTopicsSlider .imgSlider{
    display: block;
    height: 0;
    padding-top: 39.706%;
    position: relative;
}
@media only screen and (max-width:1215px){
    .secTopics{
        padding: 2.7rem 0;
        background-color: var(--blackColor);
    }
    .secTopics .tit{
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_0);
        padding-right: 7rem;
    }
    .secTopics .tit::after{
        width: 6rem;
    }
    /* boxSlider */
    .secTopicsSlider .boxSlider{
        margin-top: 2rem;
    }
    .secTopicsSlider .swiper{
        width: 86.67%;
    }
}


/* boxCmnTop */
.boxCmnTop{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
@media only screen and (max-width:1215px){
    .cmnWrapper{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .boxCmnTop{
        display: contents;
        align-items: center;
        flex-direction: column;
    }
    .boxCmnTop + .boxCmnWrap{
        order: 2;
    }
}

/* boxCmnTit */
.boxCmnTit.fWhite{
    color: var(--whiteColor);
}
.boxCmnTit .titEng{
    font-size: var(--pcFontSize90);
    font-weight: 300;
}
.boxCmnTit .titJp{
    font-size: var(--pcFontSize18);
    margin-top: 0.5rem;
}
@media only screen and (max-width:1215px){
    .boxCmnTit{
        width: 100%;
    }
    .boxCmnTop .boxCmnTit{
        order: 1;
    }
    .boxCmnTit .titEng{
        font-size: var(--spFontSize30);
        font-weight: 400;
    }
    .boxCmnTit .titJp{
        font-size: var(--spFontSize12);
        margin-top: 0.5rem;
    }
}

/* boxCmnBtn */
.boxCmnBtn {
    display: flex;
    justify-content: flex-end;
}
.boxCmnBtn .linkCmnBtn {
    position: relative;
    display: block;
    min-width: 28rem;
    width: auto;
    padding: 2.5rem 3rem;
    background-color: var(--gray_f5f_Color);
    border-radius: 3rem;
}
.boxCmnBtn .linkCmnBtn::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 3.5rem;
    width: 1.5rem;
    height: 0.3rem;
}
.boxCmnBtn .linkCmnBtn.lazyloaded::after{
    background: url(../img/common/iconArrow_right.png) center top / cover no-repeat;
}
.boxCmnBtn .txtLink {
    font-size: var(--pcFontSize14);
    font-weight: bold;
    padding-right: 2.5rem;
}
/* hover */
.boxCmnBtn .linkCmnBtn::after{
    transition: all 0.4s ease-out;
}
.boxCmnBtn .linkCmnBtn:hover::after{
    /* transform: rotate(360deg); */
    right: 3rem;
}
@media only screen and (max-width:1215px){
    .boxCmnBtn {
        margin-top: 4rem;
        order: 3;
    }
    .boxCmnTop .boxCmnBtn {
        order: 3;
    }
    .boxCmnBtn .linkCmnBtn {
        min-width: 20.5rem;
        padding: 1.9rem 3rem;
        border-radius: 2.5rem;
    }
    .boxCmnBtn .linkCmnBtn::after{
        right: 2.7rem;
    }
    .boxCmnBtn .txtLink {
        font-size: var(--spFontSize12);
        padding-right: 2.5rem;
    }
}


/* swiper */
.boxSliderRight .swiper{
    overflow: visible;
    position: relative;
}
/* .boxSliderRight .swiper-pointer-events{
    cursor: grab;
}
.boxSliderRight .swiper-pointer-events:active {
    cursor: grabbing;
} */
.boxSliderRight .swiper:not(.wrapper){
    width: 120rem;
    margin: 0 auto;
    right: 7rem;
}
.boxSliderRight .swiper-button-next{
    top: 0;
    bottom: 0;
    right: auto;
    left: -4.5rem;
    margin: auto;
    width: 9rem;
    height: 9rem;
    box-shadow: 0 0.1rem 0 0 rgba(0, 0, 0, 0.15);
    background-color: var(--whiteColor);
    border-radius: 50%;
    opacity: 1!important;
    pointer-events: auto !important;
}
.boxSliderRight .swiper-button-next.bgBlack{
    background-color: var(--blackColor);
}
.boxSliderRight .swiper-button-next:after{
    display: none;
}
.boxSliderRight .swiper-button-next .txt{
    position: relative;
    color: var(--blackColor);
    padding-right: 1.8rem;
}
.boxSliderRight .swiper-button-next.bgBlack .txt{
    color: var(--whiteColor);
}
.boxSliderRight .swiper-button-next .txt:after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 1.4rem;
    height: 0.4rem;
    transition: all 0.4s ease-out;
}
.boxSliderRight .swiper-button-next.lazyloaded .txt:after{
    background: url(../img/common/iconArrow_next.png) center top / cover no-repeat;
}
.boxSliderRight .swiper-button-next.bgBlack.lazyloaded .txt:after{
    background: url(../img/common/iconArrow_next_white.png) center top / cover no-repeat;
}
.boxSliderRight .swiper-button-next:not(.swiper-button-disabled):hover .txt::after{
    right: -0.5rem;
}
.boxSliderRight .swiper-scrollbar.spOnly{
    display: none;
}
.boxSliderRight .swiper-horizontal>.swiper-scrollbar,
.boxSliderRight .swiper-scrollbar.swiper-scrollbar-horizontal{
    position: absolute;
    left: -1rem;
    bottom: 1rem;
    height: 5px;
    background: transparent;
}
.boxSliderRight .swiper-scrollbar-drag{
    max-width: 58rem !important;
    border-radius: 0.15rem;
    background-color: var(--gray_b8b_Color);
    opacity: 0.5;
}
@media only screen and (max-width:1215px){
    .boxSliderRight .swiper{
        margin: 0 auto 0 1.5rem!important;
    }
    .boxSliderRight .swiper:not(.wrapper){
        width: 78.67%;
        right: 0;
    }
    .boxSliderRight .swiper-button-next{
        display: none;
    }
    .boxSliderRight .swiper-scrollbar.spOnly{
        display: block
    }
    .boxSliderRight .swiper-scrollbar-drag{
        max-width: 16rem !important;
    }
}


/* secEvent */
.secEvent{
    padding: 13.8rem 0 14rem;
    margin-top: -0.1rem;
}
.secEvent .boxWapperSelect{
    margin-top: 5rem;
}
.secEvent .boxArea:not(.active){
    display: none;
}
/* boxSlider */
.secEvent .boxSlider{
    margin-top: 3rem;
}
.secEvent .boxSlider .swiper-slide{
    height: auto;
}
/* disabled */
.secEvent .disabled .swiper-wrapper {
    gap: 4rem;
}
.secEvent .disabled .swiper-slide{
    width: calc((100% - 7.999rem) / 3);
}
/* link */
.secEvent .boxSlider .link{
    position: relative;
    padding-bottom: 7rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}
/* boxImg */
.secEvent .boxImg{
    text-align: center;
    width: 100%;
    overflow: hidden;
}
.secEvent .boxImg .img{
    width: 100%;
    height: 0;
    padding-top: 125%;
}
/* boxInfo */
.secEvent .boxInfo{
    margin-top: 3rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /* height: calc(100% - 55.5rem); */
}
/* boxEventTag */
.secEvent .boxEventTag{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.boxEventTag .tag{
    width: 6rem;
    height: 2.5rem;
    text-align: center;
    font-size: var(--pcFontSize12);
    color: var(--whiteColor);
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 0.1rem;
}
.boxEventTag .tag.isActive{
    background-color: var(--isActive_bg_Color);
}
.boxEventTag .tag.isEntry{
    background-color: var(--isEntry_bg_Color);
}
.boxEventTag .txtArea{
    font-size: var(--pcFontSize14);
    color: var(--whiteColor);
}
.secEvent .boxEventTit .tit{
    font-size: var(--pcFontSize24);
    line-height: var(--pcLineHeight24_36);
    letter-spacing: var(--pcLetterSpacing24_40);
    font-weight: bold;
    color: var(--whiteColor);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: calc(var(--pcFontSize24) * var(--pcLetterSpacing24_40) * 2);
}
/* boxEventTxt */
.secEvent .boxEventTxt{
    margin-top: 0.8rem;
}
.secEvent .boxEventTxt .txt{
    font-size: var(--pcFontSize14);
    line-height: var(--pcLineHeight14_25);
    letter-spacing: var(--pcLetterSpacing14_80);
    color: #c6c6c6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.secEvent .boxEventTxt .txt:only-child{
    margin-bottom: calc((var(--pcFontSize14) * var(--pcLineHeight14_25) * 1) + 0.1rem);
}
/* cmnArrowCircle */
.secEvent .cmnArrowCircle{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 4.7rem;
    height: 4.7rem;
    opacity: 0.3;
}
/* swiper-scrollbar */
.secEvent .boxSliderRight .swiper-horizontal>.swiper-scrollbar,
.secEvent .boxSliderRight .swiper-scrollbar.swiper-scrollbar-horizontal{
    position: static;
    margin-top: 5rem;
}
.secEvent .boxSliderRight .swiper-scrollbar-drag{
    opacity: 0.1;
}
/* swiper-button-next */
.secEvent .boxSliderRight .swiper-button-next{
    top: 25%;
    bottom: auto;
}
/* bgWh */
.secEvent .boxEventTit .tit,
.secEvent .boxWapperSelect .txtSelect,
.secEvent .boxCmnTit{
    color: var(--whiteColor);
    transition: 0.8s;
}
.bgWh .secEvent .boxEventTit .tit,
.bgWh .secEvent .boxWapperSelect .txtSelect,
.bgWh .secEvent .boxCmnTit{
    color: var(--blackColor);
}
@media only screen and (max-width:1215px){
    .secEvent{
        padding: 8rem 0 4.5rem;
        background-color: var(--blackColor);
    }
    .secEvent .boxWapperSelect{
        margin-top: 0;
    }
    /* boxSlider */
    .secEvent .boxCmnWrap {
        width: 100%;
    }
    /* boxSlider */
    .secEvent .boxSlider{
        margin-top: 2rem;
    }
    .secEvent .boxSlider .swiper {
        margin: 0 !important;
        width: 71.015%;
    }
    /* disabled */
    .secEvent .disabled .swiper-wrapper {
        gap: 0;
    }
    .secEvent .disabled .swiper-slide{
        width: 100%;
    }
    /* link */
    .secEvent .boxSlider .link{
        padding-bottom: 5rem;
    }
    /* boxImg */
    .secEvent .boxImg .img{
        padding-top: 124.9%;
    }
    /* boxInfo */
    .secEvent .boxInfo{
        margin-top: 2rem;
        /* height: 11.5rem; */
    }
    /* boxEventTag */
    .secEvent .boxEventTag{
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 1rem;
        margin-bottom: 0.5rem;
    }
    .boxEventTag .tag{
        width: 5rem;
        height: 2.1rem;
        font-size: var(--spFontSize11);
        padding-bottom: 0.1rem;
    }
    .boxEventTag .txtArea{
        font-size: var(--spFontSize11);
    }
    .secEvent .boxEventTit .tit{
        font-size: var(--spFontSize15);
        line-height: var(--spLineHeight15_23);
        letter-spacing: var(--spLetterSpacing15_0);
        max-height: calc(var(--spFontSize15) * var(--spLineHeight15_23) * 2);
    }
    /* boxEventTxt */
    .secEvent .boxEventTxt{
        margin-top: 0.5rem;
    }
    .secEvent .boxEventTxt .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_20);
        letter-spacing: var(--spLetterSpacing12_0);
    }
    .secEvent .boxEventTxt .txt:only-child{
        margin-bottom: calc((var(--spFontSize12) * var(--spLineHeight12_24) * 1) + 0.1rem);
    }
    /* cmnArrowCircle */
    .secEvent .cmnArrowCircle{
        width: 3.7rem;
        height: 3.7rem;
    }
    /* swiper-scrollbar */
    .secEvent .boxSliderRight .swiper-horizontal>.swiper-scrollbar,
    .secEvent .boxSliderRight .swiper-scrollbar.swiper-scrollbar-horizontal{
        margin-top: 1rem;
    }
    /* swiper-button-next */
    .secEvent .boxSliderRight .swiper-button-next{
        display: none;
    }
}

/* secSearch */
.secSearch{
    padding: 20rem 0 0;
}
.secSearch .boxCmnWrap{
    display: flex;
    padding: 0 3rem;
    margin-top: 5rem;
}
/* boxMap */
.secSearch .boxMap{
    position: relative;
    width: 68.282%;
    height: 43.75vw;
    background-color: var(--gray_f7f_Color);
}
.secSearch #map{
    width: 100%;
    height: 100%;
    max-height: none;
    z-index: 0;
}
.secSearch .boxCmnBtn{
    position: absolute;
    bottom: 4rem;
    right: 4rem;
    z-index: 3;
}
.secSearch .boxCmnBtn .linkCmnBtn {
    background-color: var(--blackColor);
    color: var(--whiteColor);
    box-shadow: 0 0.3rem 0.3rem var(--black_000_10_Color);
    padding-left: 6.8rem;
}
.secSearch .linkCmnBtn::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    left: 3.5rem;
    width: 2.3rem;
    height: 2.2rem;
}
.secSearch .linkCmnBtn.lazyloaded::before{
    background: url(../img/common/iconLinkMap.png) center top / cover no-repeat;
}
/* boxList */
.secSearch .boxList{
    width: 31.722%;
    display: flex;
    align-items: center;
}
.secSearch .list{
    display: flex;
    flex-direction: column;
}
.secSearch .item{
    width: 100%;
    color: var(--whiteColor);
}
.secSearch .item:first-child{
    display: none;
}
.secSearch .item .link{
    position: relative;
    width: 100%;
    display: block;
}
.secSearch .item .boxTxt{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: space-between;
    top: 5rem;
    left: 5rem;
    margin: auto;
    width: calc(100% - 10rem);
    height: calc(100% - 10rem);
    z-index: 2;
}
.secSearch .item .txt{
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    color: var(--gray_b2b_Color);
    font-size: var(--pcFontSize12);
    padding-right: 1.8rem;
}
.secSearch .item .txt::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 1.5rem;
    height: 0.1rem;
    background-color: var(--gray_b2b_Color);
}
.secSearch .item .tit{
    font-weight: bold;
    font-size: var(--pcFontSize30);
    margin-left: 2rem;
}
.secSearch .item .boxImg{
    position: relative;
}
.secSearch .item .boxImg::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--gray_4f4_Color);
    opacity: 0.6;
    transition: all 0.4s ease-out;
    mix-blend-mode: multiply;
}
.secSearch .link:hover .boxImg::after{
    opacity: 0.4;
}
/* bgBl */
.secSearch .boxCmnTit{
    transition: 0.8s;
}
.bgBl .secSearch .boxCmnTit{
    color: var(--whiteColor);
}
/* is_noData */
/* .secSearch .boxMap.is_noData{
    display: none;
}
.secSearch .boxMap.is_noData + .boxList{
    width: 100%;
}
.secSearch .boxMap.is_noData + .boxList .list{
    flex-direction: row;
} */
@media only screen and (max-width:1215px){
    .secSearch{
        padding: 4.8rem 0 0;
        background-color: var(--blackColor);
        margin-top: -0.1rem;
    }
    .secSearch .boxCmnTit{
        color: var(--whiteColor);
    }
    .secSearch .boxCmnWrap{
        flex-direction: column-reverse;
        padding: 0;
        width: 100%;
        margin-top: 2rem;
    }
    /* boxMap */
    .secSearch .boxMap{
        width: 100vw;
        height: auto;
        margin: 0 calc(50% - 50vw) 0;
        padding: 2rem 1.5rem 8rem;
    }
    .secSearch #map{
        height: 50rem;
    }
    .secSearch .boxCmnBtn{
        position: static;
        justify-content: center;
        margin-top: 2rem;
    }
    .secSearch .boxCmnBtn .linkCmnBtn {
        padding-left: 6.8rem;
    }
    .secSearch .linkCmnBtn::before{
        left: 3.5rem;
        width: 1.7rem;
        height: 1.6rem;
    }
    /* boxList */
    .secSearch .boxList{
        display: block;
        width: 100%;
        margin-top: 2rem;
    }
    .secSearch .list{
        flex-direction: row;
        gap: 0.3rem;
    }
    .secSearch .item{
        flex: 1 1 calc((100% - 0.3rem) / 4);
        padding: 1.2rem 0;
        background-color: var(--gray_282_Color);
        border-top-right-radius: 1rem;
    }
    .secSearch .item.active{
        background-color: var(--gray_f7f_Color);
        color: var(--textColor);
    }
    .secSearch .item:first-child{
        display: block;
    }
    .secSearch .item .boxTxt{
        position: static;
        justify-content: center;
        width: auto;
        height: auto;
    }
    .secSearch .item .txt{
        display: none;
    }
    .secSearch .item .tit{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_18);
        text-align: center;
        margin-left: 0;
    }
    .secSearch .item .cmnArrowCircle,
    .secSearch .item .boxImg{
        display: none;
    }
    /* is_noData */
    .secSearch .boxMap.is_noData{
        display: block;
    }
}

/* secRecommend */
.secRecommend{
    position: relative;
    padding: 5rem 0 0;
    margin-bottom: 3rem;
}
.secRecommend .boxRecommendTit .tit{
    position: relative;
    display: inline-block;
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_80);
    font-weight: bold;
    padding-right: 11rem;
}
.secRecommend .boxRecommendTit .tit::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 10rem;
    height: 0.1rem;
    background-color: var(--blackColor);
}
/* boxList */
.secRecommend .boxList{
    margin-top: 5rem;
}
.secRecommend .list{
    display: flex;
    flex-direction: column;
    gap: 5rem;
}
.secRecommend .item{
    width: 100%;
}
.secRecommend .link{
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.secRecommend .boxImg{
    position: relative;
    overflow: hidden;
    width: 44.777%
}
.secRecommend .boxImg .img{
    aspect-ratio: 600 / 358;
}
/* boxTit */
.secRecommend .boxTit{
    width: 51.493%;
}
/* boxEstateTag */
.secRecommend .boxEstateTag{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}
.boxEstateTag .tag{
    position: relative;
    display: inline-block;
    text-align: center;
    padding: 0.7rem 0.8rem 0.8rem;
    border-radius: 0.3rem;
    color: var(--whiteColor);
}
.boxEstateTag .tag .txtTag{
    font-size: var(--pcFontSize12);
}
.boxEstateTag .tag.isLand{
    background-color: var(--isLand_color);
}
.boxEstateTag .tag.isBuilt{
    background-color: var(--isBuilt_color);
}
.boxEstateTag .tag.isCustom {
    background-color: var(--isCustom_color);
}
.boxEstateTag .tag.isLandOnly{
    background-color: var(--isLandOnly_color);
}
.boxEstateTag .tag.isMemberOnly{
    background-color: var(--memberColor);
}
.boxEstateTag .tag.isArea{
    background-color: var(--isArea_bg_Color);
    color: var(--blackColor);
}
/* boxEstateTxt */
.boxEstateTxt .txt{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.boxEstateTxt .txt{
    font-size: var(--pcFontSize14);
    line-height: var(--pcLineHeight14_25);
    letter-spacing: var(--pcLetterSpacing14_40);
}
.boxEstateTxt .tit{
    font-size: var(--pcFontSize28);
    line-height: var(--pcLineHeight28_42);
    font-weight: bold;
}
.boxEstateTxt .txtMemo{
    font-size: var(--pcFontSize13);
    line-height: var(--pcLineHeight13_26);
    letter-spacing: var(--pcLetterSpacing13_40);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: calc(var(--pcFontSize13) * var(--pcLineHeight13_26) * 2);
    margin-top: 0.5rem;
}
.boxEstateTxt .txtMemo a{
    color: var(--linkColor);
    text-decoration: underline;
}
/* boxInfoTxt */
.boxInfoTxt{
    position: relative;
    margin-top: 2.2rem;
    padding-top: 2rem;
    width: 100%;
    color: var(--blackColor);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.boxInfoTxt::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 0.1rem;
    background-color: var(--blackColor);
}
.boxInfoTxt .txt{
    position: relative;
    max-width: 85%;
    padding-left: 3rem;
    font-size: var(--pcFontSize13);
    line-height: var(--pcLineHeight13_22);
    letter-spacing: var(--pcLetterSpacing13_40);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: calc(var(--pcFontSize13) * var(--pcLineHeight13_22) * 2);
}
.boxInfoTxt .txt::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: 0;
    width: 2.2rem;
    height: 2.2rem;
}
.boxInfoTxt.lazyloaded .txt.isAccess::before{
    background: url(../img/common/iconEstateAccess.png) center top / cover no-repeat;
}
.boxInfoTxt.lazyloaded .txt.isPrice::before{
    background: url(../img/common/iconEstatePrice.png) center top / cover no-repeat;
}
.secRecommend .cmnArrowCircle{
    position: absolute;
    bottom: 2rem;
    right: 0;
    width: 4.7rem;
    height: 4.7rem;
}
.secRecommend .btn.isMember{
    width: 100%;
    height: 6.5rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 2rem;
}
.secRecommend .btn .btnTxt,
.secRecommend .btn .btnTit{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

}
.secRecommend .btn .btnTxt{
    width: 18rem;
    background-color: var(--memberColor2);
    font-size: var(--pcFontSize14);
    font-weight: bold;
}
.secRecommend .btn .btnTit{
    width: calc(100% - 18rem);
    background-color: var(--memberColor);
    color: var(--whiteColor);
    font-size: var(--pcFontSize16);
    font-weight: bold;
}
.secRecommend .btn .txt{
    position: relative;
    display: inline-block;
    padding-right: 2rem;
}
.secRecommend .btn .txt::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 1.1rem;
    height: 0.3rem;
}
.secRecommend .btn.lazyloaded .txt::after{
    background: url(../img/common/iconArrow_next_white.png) center top / cover no-repeat;
}
/* boxMore */
.secRecommend .boxMore{
    position: absolute;
    bottom: -0.1rem;
    left: 0;
    width: 100%;
    height: 25rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-image: -moz-linear-gradient( 90deg, rgb(255,255,255) 0%, rgba(255,255,255,0) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(255,255,255) 0%, rgba(255,255,255,0) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(255,255,255) 0%, rgba(255,255,255,0) 100%);
}
/* boxCmnBtn */
.secRecommend .boxCmnBtn{
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4rem;
}
.secRecommend .boxCmnBtn .linkCmnBtn{
    margin: 0 auto;
    background-color: var(--gray_1f1_Color);
    color: var(--whiteColor);
    text-align: center;
}
.secRecommend .boxCmnBtn .linkCmnBtn::after{
    display: none;
}
.secRecommend .boxCmnBtn .txtLink{
    position: relative;
    display: inline-block;
    padding-right: 1.3rem;
}
.secRecommend .boxCmnBtn .txtLink::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    width: 0.3rem;
    height: 1.5rem;
}
.secRecommend .linkCmnBtn.lazyloaded .txtLink::after{
    background: url(../img/common/iconArrow_more.png) center top / cover no-repeat;
}
@media only screen and (max-width:1215px){
    .secRecommend{
        padding: 4rem 0 0;
    }
    .secRecommend .boxRecommendTit .tit{
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_0);
        padding-right: 7rem;
    }
    .secRecommend .boxRecommendTit .tit::after{
        width: 6rem;
    }
    /* boxList */
    .secRecommend .boxList{
        margin-top: 3rem;
    }
    .secRecommend .boxCmnMask .titJp{
        font-weight: bold;
    }
    .secRecommend .list{
        gap: 3rem;
    }
    .secRecommend .item{
        width: 100%;
    }
    .secRecommend .link{
        align-items: center;
        flex-direction: column;
        padding-bottom: 3rem;
    }
    .secRecommend .boxImg,
    .secRecommend .boxTit{
        width: 100%;
    }
    .secRecommend .boxTit {
        margin-top: 1.5rem;
    }
    /* boxEstateTag */
    .secRecommend .boxEstateTag{
        margin-bottom: 1rem;
    }
    .boxEstateTag .tag{
        padding: 0.4rem 0.8rem 0.5rem;
    }
    .boxEstateTag .tag .txtTag{
        font-size: var(--spFontSize11);
    }
    /* boxEstateTxt */
    .secRecommend .boxEstateTxt .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_18);
        letter-spacing: var(--spLetterSpacing12_0);
    }
    .secRecommend .boxEstateTxt .tit{
        font-size: var(--spFontSize16);
        line-height: var(--spLineHeight16_24);
        margin-top: 0.2rem;
    }
    .secRecommend .txtMemo{
        font-size: var(--spFontSize11);
        line-height: var(--spLineHeight11_17);
        letter-spacing: var(--spLetterSpacing11_0);
        line-clamp: 3;
        -webkit-line-clamp: 3;
        overflow: hidden;
        max-height: calc(var(--spFontSize11) * var(--spLineHeight11_17) * 3);
        margin-top: 0;
    }
    /* boxInfoTxt */
    .secRecommend .boxInfoTxt{
        margin-top: 1.5rem;
        padding-top: 1.5rem;
    }
    .secRecommend .boxInfoTxt .txt{
        max-width: 100%;
        font-size: var(--spFontSize11);
        line-height: var(--spLineHeight11_17);
        letter-spacing: var(--spLetterSpacing11_0);
        max-height: calc(var(--spFontSize11) * var(--spLineHeight11_17) * 2);
        min-height: 2.2rem;
    }
    .secRecommend .link_member .boxInfoTxt .txt,
    .secRecommend .boxInfoTxt .txt.isPrice{
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_20);
        max-height: calc(var(--spFontSize13) * var(--spLineHeight13_20) * 2);
    }
    .secRecommend .cmnArrowCircle{
        bottom: 0;
        width: 3.7rem;
        height: 3.7rem;
    }
    /* link_member */
    .secRecommend .link_member .boxInfoTxt {
        flex-direction: row;
        gap: 2rem;
    }
    .secRecommend .link_member .boxInfoTxt::before {
        background-color: var(--gray_d0d_Color);
    }
    .secRecommend .btn.isMember{
        height: 4.5rem;
    }
    .secRecommend .btn .btnTxt{
        width: 11rem;
        font-size: var(--spFontSize10);
    }
    .secRecommend .btn .btnTit{
        width: calc(100% - 11rem);
        font-size: var(--spFontSize13);
    }
    /* boxMore */
    .secRecommend .boxMore{
        height: 15rem;
        z-index: 5;
    }
    /* boxCmnBtn */
    .secRecommend .boxCmnBtn{
        position: static;
    }
    .secRecommend .boxCmnBtn .linkCmnBtn{
        min-width: 24rem;
    }
}

/* secMember */
.secMember{
    margin-top: 14rem;
}
@media only screen and (max-width:1215px){
    .secMember{
        margin-top: 4rem;
    }
}
/* bgGrad */
.bgGrad,.bgGrad .cmnWrapper{
    position: relative;
}
.bgGrad .cmnWrapper{
    z-index: 1;
}
.bgGrad::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    bottom: 0;
    width: 100%;
    height: 20%;
    background-image: -moz-linear-gradient( 90deg, rgb(28,28,28) 0%, rgba(28,28,28,0) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(28,28,28) 0%, rgba(28,28,28,0) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(28,28,28) 0%, rgba(28,28,28,0) 100%);
}

/* secPreceding */
.secPreceding{
    /* max-width: 192rem; */
    margin: 30rem auto 0;
    padding: 20rem 0 9rem;
    background-position: center 22rem;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: var(--blackColor);
}
.secPreceding.lazyloaded{
    background-image: url(../img/index/bgPreceding.jpg);
}
.secPreceding .boxSlider{
    padding: 6rem 0 9rem;
}
.secPreceding.disabled ul{
    display: flex;
    flex-wrap: wrap;
    gap: 5rem 4rem;
}
.secPreceding li{
    background-color: var(--whiteColor);
    box-shadow: 0px 0px 10px 0px var(--black_000_10_Color);
}
.secPreceding.disabled li{
    width: calc((100% - 7.9999rem) / 3);
}
.secPreceding .link,
.secPreceding .boxTit{
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}
.secPreceding .link{
    padding: 5.3rem 5rem;
    min-height: 35rem;
}
/* boxTit */
.secPreceding .boxTit .tit01{
    font-size: var(--pcFontSize28);
    line-height: var(--pcLineHeight28_42);
    letter-spacing: var(--pcLetterSpacing28_40);
}
.secPreceding .boxTit .tit02{
    font-size: var(--pcFontSize24);
    line-height: var(--pcLineHeight24_20);
    letter-spacing: var(--pcLetterSpacing24_40);
    margin-top: 0.8rem;
}
.secPreceding .boxTit .tit01,
.secPreceding .boxTit .tit02{
    font-weight: bold;
}
.secPreceding:not(.boxDetails) .boxTit .tit01,
.secPreceding:not(.boxDetails) .boxTit .tit02{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.secPreceding .boxTit .txt{
    font-size: var(--pcFontSize13);
    line-height: var(--pcLineHeight13_24);
    letter-spacing: var(--pcLetterSpacing13_40);
    margin-top: 1.5rem;
}
.secPreceding:not(.boxDetails) .boxTit .txt{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 5;
    -webkit-line-clamp: 5;
    overflow: hidden;
    max-height: calc(var(--pcFontSize13) * var(--pcLineHeight13_24) * 5);
}
/* boxTit */
.secPreceding .boxCmnNew{
    position: absolute;
    top: -1.5rem;
    left: 0;
}
/* cmnArrowCircle */
.secPreceding .cmnArrowCircle{
    position: absolute;
    bottom: 4rem;
    right: 4rem;
    width: 4.7rem;
    height: 4.7rem;
}
@media only screen and (max-width:1215px){
    .secPreceding{
        margin-top: 6rem;
        padding: 9.5rem 0 5rem;
        background-position: center 6rem;
        background-size: cover;
    }
    .secPreceding.lazyloaded{
        background-image: url(../img/index/bgPreceding_sp.jpg);
    }
    .secPreceding .boxSlider{
        padding: 3rem 0 0;
    }
    .secPreceding .swiper{
        width: 57.975%;
        margin-left: 0 !important;
    }
    .secPreceding .boxCmnWrap{
        width: 100%;
    }
    .secPreceding .boxCmnTit{
        width: 92%;
    }
    /* boxList */
    .secPreceding.disabled ul{
        gap: 1rem;
    }
    .secPreceding.disabled li{
        width: 100%;
    }
    .secPreceding .link{
        padding: 1.5rem;
        min-height: 16.5rem;
    }
    /* boxTit */
    .secPreceding .boxTit{
        padding-bottom: 1rem;
    }
    .secPreceding .boxTit .tit01,
    .secPreceding .boxTit .tit02{
        font-size: var(--spFontSize14);
        line-height: var(--spLineHeight14_21);
        letter-spacing: var(--spLetterSpacing14_0);
        margin-top: 0;
    }
    .secPreceding .boxTit .txt{
        font-size: var(--spFontSize11);
        line-height: var(--spLineHeight11_17);
        letter-spacing: var(--spLetterSpacing11_0);
        margin-top: 0.5rem;
    }
    .secPreceding:not(.boxDetails) .boxTit .txt{
        line-clamp: 3;
        -webkit-line-clamp: 3;
        max-height: calc(var(--spFontSize11) * var(--spLineHeight11_17) * 3);
    }
    /* cmnArrowCircle */
    .secPreceding .cmnArrowCircle{
        bottom: 1rem;
        right: 1rem;
        width: 3.7rem;
        height: 3.7rem;
    }
    .secPreceding .boxCmnNew {
        top: -2.2rem;
    }
    .secPreceding .boxCmnBtn {
        margin-top: 3rem;
    }
}
@media only screen and (max-width:767px){
    .secPreceding{
        background-size: contain;
    }
}

/* secConceptHouse */
.secConceptHouse{
    margin: 30rem auto 0;
    /* max-width: 192rem; */
    padding: 3rem 0 15rem;
    background-position: center 3rem;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: var(--blackColor);
}
.secPreceding + .secConceptHouse{
    margin-top: -0.1rem;
}
.secConceptHouse.lazyloaded{
    background-image: url(../img/index/bgConcepthouse.jpg);
}
.secConceptHouse .boxCmnBtn.spOnly{
    display: none;
}
.secConceptHouse .boxConcept{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 8.5rem;
    padding: 0 23.5rem 0 14rem;
}
.secConceptHouse .boxConcept .tit,
.secConceptHouse .boxConcept .txt{
    color: var(--whiteColor);
}
.secConceptHouse .boxConcept .txt{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_50);
    margin-top: 1.5rem;
}
.secConceptHouse .boxConcept .boxCmnBtn{
    margin-top: 5.5rem;
    justify-content: flex-start;
}
/* boxSlider */
.secConceptHouse .boxSlider{
    padding: 6rem 0 0;
}
.secConceptHouse .swiper{
    width: 70rem;
    margin: 0 auto 0 0 ;
}
.secConceptHouse.disabled .swiper{
    width: 100%;
}
.secConceptHouse.disabled ul{
    display: flex;
    /* flex-wrap: wrap; */
    transform: none !important;
    gap: 4rem;
}
.secConceptHouse li{
    height: auto;
}
.secConceptHouse .link {
    height: 100%;
    display: block;
}
.secConceptHouse.disabled li{
    width: calc((100% - 7.9999rem) / 2)!important;
}
.secConceptHouse .boxSlider .boxImg{
    position: relative;
    width: 100%;
    overflow: hidden;
}
.secConceptHouse .boxSlider .img{
    aspect-ratio: 700 / 420;
}
.secConceptHouse .boxSlider .boxTit{
    position: relative;
    width: calc(100% - 4rem);
    height: 24.7rem;
    margin: -3rem auto 0;
    background-color: var(--whiteColor);
    padding: 3rem 3rem 11rem;
}
.secConceptHouse .boxSlider .boxTit:before{
    position: absolute;
    content: 'Concept House';
    margin: auto;
    display: block;
    bottom: 4.5rem;
    left: 3rem;
    color: var(--gray_565_Color);
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_80);
    font-weight: bold;
}
/* boxEstateTxt */
.secConceptHouse .boxEstateTxt {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
}
.secConceptHouse .boxEstateTxt .tit{
    font-size: var(--pcFontSize24);
    line-height: var(--pcLineHeight24_36);
    letter-spacing: var(--pcLetterSpacing24_40);
    font-weight: bold;
    margin-top: 0.8rem;
    width: 100%;
}
.secConceptHouse .boxEstateTxt .titIn{
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: calc(var(--pcFontSize24) * var(--pcLineHeight24_36) * 2);
}
/* boxEstateTag */
.secConceptHouse .boxEstateTag{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}
.secConceptHouse .boxEstateTag .tag{
    position: relative;
    display: inline-block;
    text-align: center;
    min-width: 7rem;
    padding: 0.7rem 0.8rem 0.8rem;
    color: var(--whiteColor);
}
.secConceptHouse .boxEstateTag .tag .txtTag{
    font-size: var(--pcFontSize12);
}
.secConceptHouse .boxEstateTag .tag.isEntry {
    background-color: var(--isEntry_bg_Color);
}
.secConceptHouse .boxEstateTag .tag.isBuilding {
    background-color: var(--isBuilding_bg_Color);
}
.secConceptHouse .boxEstateTag .tag.isEnd {
    background-color: var(--isEnd_bg_Color);
    color: var(--blackColor);
}
/* cmnArrowCircle */
.secConceptHouse .cmnArrowCircle {
    position: absolute;
    bottom: 3rem;
    right: 3rem;
    width: 4.7rem;
    height: 4.7rem;
    opacity: 0.3;
}
.secConceptHouse .boxSliderRight .swiper-horizontal>.swiper-scrollbar,
.secConceptHouse .boxSliderRight .swiper-scrollbar.swiper-scrollbar-horizontal{
    bottom: -6rem;
}
.secConceptHouse.disabled .swiper-scrollbar,
.secConceptHouse.disabled .swiper-button-next{
    display: none!important;
}
@media only screen and (max-width:1215px){
    .secConceptHouse{
        margin-top: 6rem;
        padding: 4rem 0 0;
        background-size: cover;
        background-position: center top;
    }
    .secConceptHouse.lazyloaded{
        background-image: url(../img/index/bgConcepthouse_sp.jpg);
    }
    .secConceptHouse .boxCmnWrap{
        width: 100%;
    }
    .secConceptHouse .boxCmnTit{
        width: 92%;
    }
    .secConceptHouse .boxCmnTit .titEng{
        line-height: var(--spLineHeight30_34);
    }
    .secConceptHouse .boxCmnBtn.spOnly{
        display: block;
    }
    .secConceptHouse .boxConcept{
        display: block;
        margin-top: 4rem;
        padding: 0;
        width: 92%;
    }
    .secConceptHouse .boxConcept .tit{
        font-size: var(--spFontSize18);
        line-height: var(--spLineHeight18_34);
        letter-spacing: var(--spLetterSpacing18_80);
        font-weight: bold;
    }
    .secConceptHouse .boxConcept .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_24);
        margin-top: 0.5rem;
        font-weight: bold;
    }
    .secConceptHouse .boxConcept .boxCmnBtn{
        display: none;
    }
    /* boxSlider */
    .secConceptHouse .boxSlider{
        padding: 4.5rem 0 0;
    }
    .secConceptHouse .boxSlider .swiper{
        width: 85.51%;
        margin-left: 0 !important;
    }
    .secConceptHouse.disabled ul{
        gap: 1.5rem;
    }
    .secConceptHouse.disabled li{
        width: 100%!important;
    }
    .secConceptHouse .boxSlider .boxImg{
        position: relative;
        width: 100%;
        overflow: hidden;
    }
    .secConceptHouse .boxSlider .img{
        aspect-ratio: 600 / 358;
    }
    .secConceptHouse .boxSlider .boxTit{
        width: calc(100% - 2rem);
        height: 14.2rem;
        margin: -2rem auto 0 0;
        padding: 1.5rem 1.5rem 5.5rem;
    }
    .secConceptHouse .boxSlider .boxTit:before{
        bottom: 2.5rem;
        left: 1.5rem;
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_0);
    }
    /* boxEstateTxt */
    .secConceptHouse .boxEstateTxt .tit{
        font-size: var(--spFontSize15);
        line-height: var(--spLineHeight15_23);
        letter-spacing: var(--spLetterSpacing15_0);
        margin-top: 0.5rem;
    }
    .secConceptHouse .boxEstateTxt .titIn{
        max-height: calc(var(--spFontSize15) * var(--spLineHeight15_23) * 2);
    }
    /* boxEstateTag */
    .secConceptHouse .boxEstateTag .tag{
        min-width: 6rem;
        padding: 0.4rem 0.5rem 0.5rem;
    }
    .secConceptHouse .boxEstateTag .tag .txtTag{
        font-size: var(--spFontSize11);
    }
    /* cmnArrowCircle */
    .secConceptHouse .cmnArrowCircle {
        bottom: 1.5rem;
        right: 1.5rem;
        width: 3.7rem;
        height: 3.7rem;
    }
    .secConceptHouse .boxSliderRight .swiper-horizontal>.swiper-scrollbar,
    .secConceptHouse .boxSliderRight .swiper-scrollbar.swiper-scrollbar-horizontal{
        bottom: 0.5rem;
    }
}

/*-----------------------------------------------
    boxCampaignBnr
-----------------------------------------------*/
.boxCampaignBnr {
    margin-top: -0.1rem;
    background-color: var(--blackColor);
    padding-bottom: 3rem;
}
.boxCampaignBnr .link{
    position: relative;
    width: 100%;
    padding: 1rem 1rem 5.8rem;
    background-color: var(--whiteColor);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.boxCampaignBnr .tit{
    width: 7rem;
    padding: 0.7rem 1rem;
    display: inline-block;
    background-color: var(--reserveColor2);
    font-size: var(--pcFontSize12);
    letter-spacing: var(--pcLetterSpacing12_40);
    color: var(--whiteColor);
    margin-top: 3rem;
}
.boxCampaignBnr .titEng{
    font-size: var(--pcFontSize42);
    margin-top: 1rem;
}
.boxCampaignBnr .titJp{
    font-size: var(--pcFontSize18);
    font-weight: bold;
    margin-top: 1rem;
}
.boxCampaignBnr .txtJp{
    font-size: var(--pcFontSize16);
    margin-top: 2rem;
}
/* boxCmnBtn */
.boxCampaignBnr .boxCmnBtn{
    position: absolute;
    bottom: -3rem;
    left: 0;
    right: 0;
    margin: auto;
    justify-content: center;
    z-index: 3;
}
.boxCampaignBnr .boxCmnBtn .linkCmnBtn{
    width: 32rem;
    height: 6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--reserveBgColor);
    color: var(--whiteColor);
    border-radius: 0;
    z-index: 2;
}
.boxCampaignBnr .boxCmnBtn .txtLink{
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_80);
    color: var(--whiteColor);
}
.boxCampaignBnr .linkCmnBtn.lazyloaded::after{
    background: url(../img/common/iconArrow_right_white.png) center top / cover no-repeat;
}
@media only screen and (max-width:1215px){
    .boxCampaignBnr {
        padding: 6rem 0 2rem;
    }
    .boxCampaignBnr .link{
        width: 100%;
        padding: 0 0 4rem;
    }
    .boxCampaignBnr .tit{
        width: 5.5rem;
        padding: 0.4rem 0 0.4rem 0.4rem;
        text-align: center;
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_0);
        margin-top: 2rem;
    }
    .boxCampaignBnr .titEng{
        font-size: var(--spFontSize24);
        margin-top: 0.5rem;
    }
    .boxCampaignBnr .titJp{
        font-size: var(--spFontSize14);
        margin-top: 0.5rem;
    }
    .boxCampaignBnr .txtJp{
        font-size: var(--spFontSize11);
        margin-top: 1rem;
    }
    /* boxCmnBtn */
    .boxCampaignBnr .boxCmnBtn{
        bottom: -2rem;
    }
    .boxCampaignBnr .boxCmnBtn .linkCmnBtn{
        width: 17.5rem;
        height: 4rem;
        padding: 0;
        min-width: auto;
    }
    .boxCampaignBnr .boxCmnBtn .txtLink{
        font-size: var(--spFontSize12);
        letter-spacing: var(--spLetterSpacing11_0);
    }
}

/* secConcept */
.secConcept{
    position: relative;
    margin-top: -0.1rem;
    padding: 15rem 0 20rem;
    background-color: var(--blackColor);
    background-position: center 29.4rem;
    background-size: auto;
    background-repeat: no-repeat;
    background-color: var(--blackColor);
}
.secConcept::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 29.4rem;
    left: 0;
    width: 100%;
    height: 15rem;
    background-image: -moz-linear-gradient( 90deg, rgba(28,28,28,0) 0%, rgb(28,28,28) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgba(28,28,28,0) 0%, rgb(28,28,28) 100%);
    background-image: -ms-linear-gradient( 90deg, rgba(28,28,28,0) 0%, rgb(28,28,28) 100%);
}
.secMember + .secConcept{
    margin-top: 30rem;
}
.secConcept.lazyloaded{
    background-image: url(../img/index/bgConcept.png);
}
.boxConceptTicker{
    overflow: hidden;
}
.boxConceptTicker .boxTicker {
    display: flex;
}
.boxConceptTicker .itemTicker:nth-child(odd) {
    animation: loop 80s -40s linear infinite;
    backface-visibility: hidden;
    will-change: transform;
    transform: translate3d(0, 0, 0);
}
.boxConceptTicker .itemTicker:nth-child(even) {
    animation: loop2 80s linear infinite;
}
@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
}
@keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
}
/* boxConcept */
.secConcept .boxConcept{
    text-align: left;
}
.secConcept .boxConcept .boxTit{
    position: relative;
}
.secConcept .boxConcept .tit{
    position: absolute;
    top: -4rem;
    left: 0;
}
.secConcept .boxConcept .boxTxt{
    display: flex;
    justify-content: flex-end;
    padding-top: 17rem;
}
.secConcept .boxConcept .txt{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_50);
    letter-spacing: var(--pcLetterSpacing16_40);
    color: var(--whiteColor);
}
.secConcept .boxConcept .txtIn{
    display: inline-block;
    margin-top: 1rem;
}
/* boxConceptLink */
.secConcept .boxConceptLink{
    margin-top: 10rem;
}
.boxConceptLink .boxList{
    width: calc(100% - 6rem);
    margin: 0 auto;
    display: flex;
    gap: 2.1rem;
}
.boxConceptLink .item{
    position: relative;
    width: calc((100% - 4.199rem) / 3);
    color: var(--whiteColor);
}
.boxConceptLink .item .link{
    position: relative;
    width: 100%;
    display: block;
}
.boxConceptLink .item .boxNum{
    position: absolute;
    top: -3rem;
    right: 3rem;
    z-index: 1;
}
.boxConceptLink .item .boxTxt{
    position: absolute;
    top: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    z-index: 2;
    padding: 0!important;
    text-align: center;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.boxConceptLink .item .tit{
    position: static;
    font-weight: bold;
    font-size: var(--pcFontSize40);
}
.boxConceptLink .item .txt{
    font-size: var(--pcFontSize13);
    letter-spacing: var(--pcLetterSpacing13_40);
    margin-top: 0.3rem;
}
.boxConceptLink .item .txt2{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_34);
    letter-spacing: var(--pcLetterSpacing16_40);
    margin-top: 1.2rem;
}
.boxConceptLink .item .cmnArrowCircle{
    position: absolute;
    bottom: 5rem;
    right: 5rem;
}
.boxConceptLink .item .boxImg{
    position: relative;
}
.boxConceptLink .item .boxImg::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black_000_40_Color);
    transition: all 0.4s ease-out;
}
.boxConceptLink .link:hover .boxImg::after{
    background-color: var(--black_000_20_Color);
}
/* .boxConceptLink .item:nth-child(2) {
    transition-delay: 0.5s;
}
.boxConceptLink .item:nth-child(3) {
    transition-delay: 1s;
} */
@media only screen and (max-width:1215px){
    .secConcept{
        padding: 8rem 0;
        background-position: center 10rem;
    }
    .secConcept::before{
        display: none;
    }
    .secMember + .secConcept{
        margin-top: 6rem;
    }
    .secConcept.lazyloaded{
        background-image: url(../img/index/bgConcept_sp.png);
    }
    .boxConceptTicker .imgTicker{
        width: auto;
        height: 14rem;
    }
    /* boxConcept */
    .secConcept .boxConcept{
        text-align: left;
    }
    .secConcept .boxConcept .boxTit{
        width: 24rem;
        margin: 0;
    }
    .secConcept .boxConcept .tit{
        top: -2.5rem;
    }
    .secConcept .boxConcept .boxTxt{
        justify-content: flex-start;
        padding-top: 11rem;
    }
    .secConcept .boxConcept .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_24);
        letter-spacing: var(--spLetterSpacing12_0);
        font-weight: bold;
    }
    /* boxConceptLink */
    .secConcept .boxConceptLink{
        margin-top: 5rem;
    }
    .boxConceptLink .boxList{
        width: 100%;
        flex-wrap: wrap;
        gap: 1rem;
    }
    .boxConceptLink .item{
        width: 100%;
    }
    .boxConceptLink .item .boxNum{
        position: absolute;
        top: 2rem;
        right: auto;
        left: 2rem;
        width: 4.4rem;
    }
    .boxConceptLink .item .boxTxt{
        justify-content: center;
    }
    .boxConceptLink .item .tit{
        font-size: var(--spFontSize24);
    }
    .boxConceptLink .item .txt{
        font-size: var(--spFontSize13);
        letter-spacing: var(--spLetterSpacing13_0);
        margin-top: 0.3rem;
    }
    .boxConceptLink .item .txt2{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_20);
        letter-spacing: var(--spLetterSpacing12_0);
        margin-top: 0.2rem;
        font-weight: bold;
    }
    .boxConceptLink .item .cmnArrowCircle{
        width: 3.7rem;
        height: 3.7rem;
        bottom: 2rem;
        right: 2rem;
    }
}


/* secWorks */
.secWorks{
    position: relative;
    padding: 20rem 0 30rem;
}
.secWorks .boxCmnBtn{
    margin: 0 1rem 1.5rem 0;
}
.secWorks .boxSlider{
    position: relative;
    margin-top: 5rem;
}
.secWorks .swiper::before{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: -24%;
    width: calc(100% - 91rem);
    height: 100%;
    background-color: var(--whiteColor);
    z-index: 2;
}
.secWorks .boxSlider .swiper-slide{
    height: auto;
}


/* アクティブ以外のスライドは非表示 */
.boxCase .swiper-slide:not(.swiper-slide-active) {
    opacity: 0;
}
/* アクティブと次の3枚は表示 */
.boxCase .swiper-slide-active + .swiper-slide,
.boxCase .swiper-slide-active + .swiper-slide + .swiper-slide,
.boxCase .swiper-slide-active + .swiper-slide + .swiper-slide + .swiper-slide {
    opacity: 1;
}

/* -----アクティブ以外----- */
/* 細くする */
.boxCase .swiper-slide {
    clip-path: inset(0 0 0 108rem); /* 左から108rem分隠す */
}
/* 右に画像表示 */
.boxCase .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev) .boxImg {
    transform: translate(50rem, 0);
}
/* 膜表示 */
.boxCase:not(.disabled) .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev) .boxImg::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black_000_Color);
    opacity: 0.6;
    transition: all 0.8s ease-out 0.4s;
}

/* -----アクティブの時----- */
/* 全面表示 */
.boxCase .swiper-slide-active.move_end {
    transition: 1.3s cubic-bezier(0.43, 0.05, 0.17, 1);
    clip-path: inset(0); /* 全面表示 */
}
/* 左に画像表示 */
.boxCase .swiper-slide-prev .boxImg,
.boxCase .swiper-slide-active.move_end .boxImg{
    transform: inherit;
}

/* -----アクティブ後のスライド----- */
.boxCase .swiper-slide.swiper-slide-prev {
    opacity: 1;
}
.boxCase .swiper-slide.swiper-slide-prev.move_end_prev {
    clip-path: inset(0 100% 0 0); /* 右側に全て隠す */
    transition: 0.9s cubic-bezier(0.43, 0.05, 0.17, 1) 0.025s;
}

/* -----初期表示----- */
/* 1枚目はトランジションしないように */
.boxCase .swiper-slide-active.move_end.initial {
    transition: none !important;
}
.boxCase .swiper-slide-active.move_end .boxImg{
    transition: 1.3s cubic-bezier(0.43, 0.05, 0.17, 1);
}
.boxCase .swiper-slide-active.move_end.initial .boxImg {
    transition: none !important;
    transform: translate(0, 0)!important;
}
.boxCase .swiper-slide-active.move_end.initial .boxImg::after{
    opacity: 0;
}

.boxCase .swiper-slide-prev .boxImg::after,
.boxCase .swiper-slide-active.move_end .boxImg::after{
    opacity: 0;
}

/* pagination */
.boxCase .swiper-pagination{
    top: 1rem;
    right: 5rem;
}
.boxCase .swiper-pagination.custom-pagination,
.boxCase .swiper-pagination-bullets.swiper-pagination-horizontal{
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 1rem;
}
/* ここから、pxのままにする */
.boxCase .swiper-pagination-bullet{
    position: relative;
    width: 6px;
    height: 6px;
    background-color: var(--blackColor)!important;
    opacity: 1!important;
}
.boxCase .swiper-pagination-bullet:last-child{
    margin-right: 0;
}
.boxCase .swiper-pagination-bullet .svg {
    opacity: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -5px;
    right: 0;
    margin: auto;
    transform:rotate(-90deg);
}
.boxCase .swiper-pagination-bullet.swiper-pagination-bullet-active .svg {
    opacity: 1;
}
.boxCase .swiper-pagination-bullet.swiper-pagination-bullet-active .circle {
    stroke: var(--blackColor);
    stroke-width: 1px;
    fill: transparent;
    stroke-dasharray: 63px;
    stroke-dashoffset: 63px;
}
.boxCase:not(.stopSlider) .swiper-pagination-bullet.swiper-pagination-bullet-active .circle {
    animation: circleAnim 8.5s forwards;
}
/* ここまで、pxのままにする */
/* slider_2 */
.slider_2 .swiper-pagination span:nth-child(n+3){
    display: none;
}
.slider_3 .swiper-pagination span:nth-child(n+4){
    display: none;
}

@keyframes circleAnim {
to {
    stroke-dashoffset: 0;
    }
}

/* 基本の見た目 */
.boxCase .swiper .link {
    display: block;
}
.secWorks .boxSlider .link{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 70rem;
}
.secWorks .boxSlider .boxImg{
    position: relative;
    width: 70rem;
    transition: all 0.5s ease-out;
}
.boxCase .link .boxTxt {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1rem;
    margin: auto;
    display: flex;
    align-items: center;
    opacity: 0;
    transition: opacity 0.5s, transform 0.5s;
    z-index: 2;
    width: 58rem;
}
.boxCase .link.show .boxTxt {
    opacity: 1;
}
.boxCase .boxSlider .boxBg {
    position: relative;
    width: 100%;
    min-height: 28rem;
    padding: 5rem;
    color: var(--whiteColor);
    background-color: var(--black_000_Color);
}
.boxCase .link .tit,
.boxCase .link .txt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.boxCase .link .tit {
    font-size: var(--pcFontSize30);
    line-height: var(--pcLineHeight30_45);
    font-weight: bold;
    max-height: calc(var(--pcFontSize30) * var(--pcLineHeight30_45) * 2);
}
.boxCase .link .txt {
    font-size: var(--pcFontSize14);
    line-height: var(--pcLineHeight14_21);
    margin-top: 2rem;
    max-height: calc(var(--pcFontSize14) * var(--pcLineHeight14_21) * 2);
}
.boxCase .link .cmnArrowCircle {
    position: absolute;
    bottom: -6rem;
    right: 3rem;
    width: 8.2rem;
    height: 8.2rem;
    z-index: -1;
    display: none;
}
.boxCase .boxSlider .img {
    width: 100%;
    height: 0;
    padding-top: 100%;
}

/* disabled */
.boxCase.disabled .swiper {
    transition: none !important;
}
.boxCase.disabled .swiper .boxTxt,
.boxCase.disabled .boxThumb .swiper-slide,
.boxCase.disabled .swiper-slide {
    opacity: 1 !important;
    transition: none !important;
}
.boxCase.disabled .swiper-slide {
    clip-path: inherit !important;
}
.boxCase.disabled .swiper .boxImg {
    transform: inherit !important;
    transition: none !important;
}
.boxCase.disabled .swiper .boxImg::after{
    opacity: 0!important;
}


.boxCase .swiper-slide{
    background-color: var(--whiteColor);
}

/* デバッグ用 */
/* .boxCase .swiper-slide{
    background-color: var(--whiteColor);
} */
@media only screen and (max-width:1215px){
    .secWorks {
        padding: 8rem 0;
    }
    .secWorks .boxCmnBtn{
        margin: 1rem 0 0 0;
    }
    .secWorks .boxCmnTop .boxCmnTit {
        width: 92%;
    }
    .secWorks .boxCase{
        width: 100%
    }
    .secWorks .boxSlider{
        margin-top: 3.3rem;
    }
    .secWorks .swiper::before{
        display: none;
    }
    /* -----アクティブ以外----- */
    /* 細くする */
    .boxCase .swiper-slide {
        /* clip-path: inset(0 0 0 280px); */
        clip-path: inset(0px 0px 0px calc(100% - 1.7rem));
        background-color: inherit;
    }
    /* 右に画像表示 */
    .boxCase .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev) .boxImg {
        transform: inherit;
    }
    /* pagination */
    /* ここから、pxのままにする */
    .boxCase .swiper-pagination.custom-pagination,
    .boxCase .swiper-pagination-bullets.swiper-pagination-horizontal{
        top: -3rem;
        right: -4rem;
        height: 10px;
    }
    .boxCase .swiper-pagination-bullet{
        position: relative;
        width: 6px;
        height: 6px;
        background-color: var(--blackColor)!important;
        opacity: 1!important;
    }
    .boxCase .swiper-pagination-bullet:last-child{
        margin-right: 0;
    }
    .boxCase .swiper-pagination-bullet .svg {
        opacity: 0;
        position: absolute;
        top: 0;
        bottom: 0;
        left: -5px;
        right: 0;
        margin: auto;
        transform:rotate(-90deg);
    }
    .boxCase .swiper-pagination-bullet.swiper-pagination-bullet-active .svg {
        opacity: 1;
    }
    .boxCase .swiper-pagination-bullet.swiper-pagination-bullet-active .circle {
        stroke: var(--blackColor);
        stroke-width: 1px;
        fill: transparent;
        stroke-dasharray: 63px;
        stroke-dashoffset: 63px;
    }
    .boxCase:not(.stopSlider) .swiper-pagination-bullet.swiper-pagination-bullet-active .circle {
        animation: circleAnim 8.5s forwards;
    }
    /* ここまで、pxのままにする */

    /* 基本の見た目 */
    .secWorks .boxCmnWrap,
    .secWorks .boxSlider,
    .secWorks .boxSlider .swiper-slide{
        width: 100%;
    }
    .boxCase .swiper .link {
        display: block;
    }
    .secWorks .boxSlider .link{
        width: 100%;
        height: 100%;
    }
    .secWorks .boxSlider .boxImg{
        width: 100%;
    }
    .boxCase .link .boxTxt {
        position: static;
        opacity: 0;
        width: 100%;
        margin-top: 1.5rem;
    }
    .boxCase .link.show .boxTxt {
        opacity: 1;
    }
    .boxCase .boxSlider .boxBg {
        width: 100%;
        min-height: auto;
        padding: 0;
        color: var(--blackColor);
        background-color: var(--whiteColor);
    }
    .boxCase .link .tit {
        font-size: var(--spFontSize16);
        line-height: var(--spLineHeight16_24);
        max-height: calc(var(--spFontSize16) * var(--spLineHeight16_24) * 2);
    }
    .boxCase .link .txt {
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_20);
        max-height: calc(var(--spFontSize12) * var(--spLineHeight12_20) * 2);
        margin-top: 1rem;
    }
    .boxCase .link .cmnArrowCircle {
        position: relative;
        bottom: auto;
        right: auto;
        width: 3.7rem;
        height: 3.7rem;
        z-index: 1;
        margin: 1rem 0 0 auto;
    }
}

/* secPlan */
.secPlan{
    position: relative;
    padding: 18rem 0 20rem;
    color: var(--whiteColor);
    background-position: center top;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--blackColor);
}
.secPlan.lazyloaded{
    background-image: url(../img/index/bgPlan.jpg);
}
.secPlan .boxTit{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.secPlan .boxTxt{
    margin: 4rem 0;
}
.secPlan .boxTxt .tit{
    font-size: var(--pcFontSize40);
    line-height: var(--pcLineHeight40_70);
    letter-spacing: var(--pcLetterSpacing40_80);
    font-weight: bold;
}
.secPlan .boxTxt .txt{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_34);
    letter-spacing: var(--pcLetterSpacing16_40);
    margin-top: 2rem;
}
.secPlan .boxCmnTit .titEng{
    line-height: var(--pcLineHeight90_100);
}
.secPlan .boxCmnBtn .txtLink{
    color: var(--blackColor);
}
/* boxTitPlan */
.secPlan .boxSlider{
    margin-top: 19rem;
}
.secPlan .boxSlider .swiper-slide{
    width: 58rem;
    height: auto;
    background-color: var(--whiteColor);
}
.secPlan .boxSlider .link{
    position: relative;
    display: block;
    height: 100%;
}
.secPlan .boxTitPlan{
    height: 10rem;
    padding: 3.3rem 4rem;
    background-color: var(--black_000_Color);
}
.secPlan .boxTitPlan .tit{
    font-size: var(--pcFontSize22);
    line-height: var(--pcLineHeight22_33);
    letter-spacing: var(--pcLetterSpacing22_40);
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.secPlan .boxPlan{
    position: relative;
    height: calc(100% - 10rem);
    display: flex;
    align-items: center;
}
/* boxImg */
.secPlan .boxImg{
    text-align: center;
    width: 100%;
    padding: 10.5rem 0;
}
.secPlan .boxImg .img{
    width: 40rem;
    height: 0;
    padding-top: 50%;
    margin: 0 auto;
}
/* boxInfo */
.secPlan .boxInfo{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.secPlan .boxTsubo{
    position: relative;
    top: 3rem;
    left: 3rem;
    width: 9rem;
    height: 9rem;
    border-radius: 100%;
    background-color: var(--whiteColor);
    color: var(--blackColor);
    border: 0.1rem solid var(--gray_cbc_Color);
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    z-index: 2;
}
.secPlan .boxTsubo .txtTsuboNum{
    font-size: var(--pcFontSize24);
    line-height: var(--pcLineHeight24_20);
}
.secPlan .boxTsubo .txtTsubo{
    font-size: var(--pcFontSize16);
}
.secPlan .boxRank{
    position: absolute;
    top: 0;
    right: 0;
    width: 6rem;
    height: 4.6rem;
    background-color: var(--rankColor);
    color: var(--blackColor);
    clip-path: polygon(100% 0, 100% 100%, 50% 70%, 0 100%, 0 0);
    z-index: 2;
}
.secPlan .boxRank .txtRank{
    width: 100%;
    height: 3.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: var(--pcFontSize14);
    font-weight: bold;
}
/* boxMember */
.secPlan .boxMember{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--black_000_80_Color);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.secPlan .boxMember .tit{
    font-size: var(--pcFontSize26);
    font-weight: bold;
}
.secPlan .boxMember .txt{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_28);
    margin-top: 1.5rem;
}
.secPlan .boxMember .listMember{
    margin-top: 5rem;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.secPlan .boxMember .item{
    width: 22rem;
}
.secPlan .boxMember .btn{
    position: relative;
    width: 100%;
    height: 6.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.secPlan .boxMember .isLogin{
    background-color: var(--loginColor);
    color: var(--blackColor);
}
.secPlan .boxMember .isMember{
    background-color: var(--memberColor);
}
.secPlan .boxMember .btnTit{
    font-size: var(--pcFontSize16);
    font-weight: bold;
}
.secPlan .boxMember .btnTxt{
    position: absolute;
    top: -2rem;
    left: 0;
    background-color: var(--link_txtColor);
    color: var(--blackColor);
    font-size: var(--pcFontSize12);
    font-weight: bold;
    padding: 0.8rem 1rem;
}
@media only screen and (max-width:1215px){
    .secPlan{
        padding: 8rem 0;
        background-size: cover;
    }
    .secPlan.lazyloaded{
        background-image: url(../img/index/bgPlan_sp.jpg);
    }
    .secPlan .boxTit{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .secPlan .boxTxt{
        margin: 3.5rem 0 0;
    }
    .secPlan .boxTxt .tit{
        font-size: var(--spFontSize18);
        line-height: var(--spLineHeight18_34);
        letter-spacing: var(--spLetterSpacing18_40);
    }
    .secPlan .boxTxt .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_24);
        letter-spacing: var(--spLetterSpacing12_0);
        margin-top: 1rem;
    }
    .secPlan .boxCmnTit .titEng{
        line-height: var(--spLineHeight30_40);
    }
    .secPlan .boxCmnBtn{
        margin: 2rem auto 0;
    }
    /* boxTitPlan */
    .secPlan .boxSlider{
        margin-top: 4rem;
        width: 100%;
    }
    .secPlan .boxSlider .swiper-slide{
        width: 100%;
    }
    .secPlan .boxTitPlan{
        height: 6rem;
        padding: 2rem 1.5rem;
    }
    .secPlan .boxTitPlan .tit{
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_20);
        letter-spacing: var(--spLetterSpacing13_0);
    }
    .secPlan .boxPlan{
        height: calc(100% - 6rem);
    }
    /* boxImg */
    .secPlan .boxImg{
        padding: 5rem 0;
    }
    .secPlan .boxImg .img{
        width: 20rem;
        padding-top: 50.85%;
    }
    /* boxInfo */
    .secPlan .boxTsubo{
        top: 1rem;
        left: 1rem;
        width: 6rem;
        height: 6rem;
    }
    .secPlan .boxTsubo .txtTsuboNum{
        font-size: var(--spFontSize16);
        line-height: var(--spLineHeight16_14);
    }
    .secPlan .boxTsubo .txtTsubo{
        font-size: var(--spFontSize11);
    }
    .secPlan .boxRank{
        width: 4.4rem;
        height: 2.6rem;
    }
    .secPlan .boxRank .txtRank{
        height: 2rem;
        font-size: var(--spFontSize10);
    }
    .secPlan .cmnArrowCircle{
        position: absolute;
        bottom: 1.5rem;
        right: 1.5rem;
        width: 3.7rem;
        height: 3.7rem;
    }
    /* boxMember */
    .secPlan .boxMember .tit{
        font-size: var(--spFontSize18);
    }
    .secPlan .boxMember .txt{
        font-size: var(--spFontSize13);
        line-height: var(--spLineHeight13_20);
        margin-top: 1rem;
    }
    .secPlan .boxMember .listMember{
        margin-top: 3rem;
        width: 100%;
        gap: 1.5rem;
    }
    .secPlan .boxMember .item{
        width: 40%;
    }
    .secPlan .boxMember .btn{
        height: 4rem;
    }
    .secPlan .boxMember .btnTit{
        font-size: var(--spFontSize13);
    }
    .secPlan .boxMember .btnTxt{
        top: -1.5rem;
        font-size: var(--spFontSize10);
        padding: 0.5rem;
    }
}
@media only screen and (max-width:767px){
    .secPlan{
        background-size: contain;
    }
}


/* secColumn */
.secColumn{
    padding: 20rem 0 0;
}
.secColumn .boxList{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 4.6rem;
    margin-top: 6rem;
}
.secColumn .item{
    position: relative;
    width: calc((100% - 13.999rem) / 4);
}
.secColumn .item .link{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}
.secColumn .boxImg{
    width: 100%;
    margin: 0 auto;
}
.secColumn .boxImg .img{
    border-radius: var(--pcBorder_radius);
    aspect-ratio: 300 / 210;
}
.secColumn .boxTit{
    margin-top: 2.7rem;
}
.secColumn .boxDate{
    display: flex;
    align-items: center;
    gap: 0.8rem;
}
.secColumn .boxDate .txtDate{
    font-size: var(--pcFontSize14);
    letter-spacing: var(--pcLetterSpacing14_80);
}
.secColumn .boxDate .boxCmnNew{
    top: 0.1rem;
}
.secColumn .boxTit .txt{
    font-size: var(--pcFontSize16);
    line-height: var(--pcLineHeight16_28);
    font-weight: bold;
    margin-top: 0.5rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    overflow: hidden;
    max-height: calc(var(--pcFontSize16) * var(--pcLineHeight16_28) * 2);
}
.secColumn .boxTag{
    position: relative;
    margin-top: 3.2rem;
    width: 100%;
}
.secColumn .listTag{
    max-width: 80%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.secColumn .listTag .itemTag{
    display: inline-block;
    border-radius: 1rem;
    padding: 1.3rem 1rem;
    background-color: var(--gray_f5f_Color);
}
.secColumn .listTag .txtTag{
    font-size: var(--pcFontSize12);
}
.secColumn .boxTag .cmnArrowCircle{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 4.5rem;
    height: 4.5rem;
}
@media only screen and (max-width:1215px){
    .secColumn{
        padding: 8rem 0 0;
    }
    .secColumn .boxList{
        justify-content: space-between;
        gap: 3rem 0;
        margin-top: 2rem;
    }
    .secColumn .item{
        width: calc((100% - 1.1rem) / 2);
    }
    .secColumn .boxImg .img{
        border-radius: var(--spBorder_radius);
    }
    .secColumn .boxTit{
        margin-top: 1.5rem;
    }
    .secColumn .boxDate{
        gap: 0.4rem;
    }
    .secColumn .boxDate .txtDate{
        font-size: var(--spFontSize11);
        letter-spacing: var(--spLetterSpacing11_0);
    }
    .secColumn .boxDate .boxCmnNew{
        top: 0.1rem;
    }
    .secColumn .boxTit .txt{
        font-size: var(--spFontSize12);
        line-height: var(--spLineHeight12_20);
        margin-top: 0.5rem;
        max-height: calc(var(--spFontSize12) * var(--spLineHeight12_20) * 2);
    }
    .secColumn .boxTag{
        margin-top: 1rem;
    }
    .secColumn .listTag{
        max-width: none;
    }
    .secColumn .listTag .itemTag{
        border-radius: 0.5rem;
        padding: 0.8rem 0.5rem;
    }
    .secColumn .listTag .txtTag{
        font-size: var(--spFontSize10);
    }
    .secColumn .boxTag .cmnArrowCircle{
        display: none;
    }
}

/*-----------------------------------------------
	popup
-----------------------------------------------*/
#popup{
    display: none;
    z-index: 99999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    position: fixed;
    top: 0;
    left: 0;
}
#popup .popupContainer{
	display: table;
	width: 100%;
	height: 100vh;
}
#popup .popupContents{
	display: table-cell;
	vertical-align: middle;
}
#popup .popupMain{
	width: 900px;
	margin: 0 auto;
}
@media only screen and (max-width:1215px){
	#popup .popupMain{
		width: 100%;
		padding: 6.67%;
	}
}
@media only screen and (max-width:374px){
	#popup .popupMain{
		padding: 4.69%;
	}
}

/* secPopup */
.secPopup{
	display: none;
	position: relative;
}
.secPopupItem {
	background: var(--whiteColor);
    max-height: calc(100vh - 5rem);
	overflow-y: auto;
	overflow-x: hidden;
    padding: 5rem 3rem 3rem;
}
.secPopupItem::-webkit-scrollbar {
    width: 15px;
}
.secPopupItem::-webkit-scrollbar-thumb {
    background-color: #c2c2c2;
	border-radius: 10px;
    border: 5px solid var(--whiteColor)
}
.secPopupItem::-webkit-scrollbar {
    background: var(--whiteColor)
}
.secPopup .btnClose{
	position: absolute;
    top: 2rem;
    right: 2rem;
	background: var(--whiteColor);
    overflow: hidden;
    border-radius: 100%;
}
.secPopup .popupTit{
    font-size: var(--pcFontSize22);
    font-weight: bold;
}
/* boxCmnBtn */
.secPopup .boxCmnBtn{
    justify-content: center;
    margin-top: 5rem;
}
.secPopup .boxCmnBtn .linkCmnBtn{
    background-color: var(--gray_1f1_Color);
    color: var(--whiteColor);
}
.secPopup .boxCmnBtn .txtLink {
    padding-right: 0;
    text-align: center;
}
@media only screen and (max-width:1215px){
    .secPopupItem {
        padding: 3rem 2rem 2rem;
    }
	.secPopup .btnClose{
		width: 3.5rem;
		height: auto;
	}
    .secPopup .popupTit{
        font-size: var(--spFontSize17);
    }
    /* boxCmnBtn */
    .secPopup .boxCmnBtn{
        margin-top: 3rem;
    }
}


/* ラジオ */
.secPopup .boxItem {
    margin-top: 3rem;
}
.secPopup .boxRadio{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.7rem;
}
.secPopup .boxRadio input[type="radio"],
.secPopup .boxRadio .txtRadio::before,
.secPopup .boxRadio .txtRadio::after{
    width: 2.2rem;
    height: 2.2rem;
}
.secPopup .boxRadio input[type="radio"]{
    visibility: hidden;
    position: absolute;
    margin: 0;
}
.secPopup .boxRadio .itemRadio{width: 19%;}
.secPopup .boxRadio .labelRadio{
    position: relative;
    width: 100%;
    display: inline-block;
}
.secPopup .boxRadio .txtRadio{
    width: 100%;
    display: inline-flex;
    align-items: center;
    font-size: 0;
}
.secPopup .boxRadio .txtRadio::before,
.secPopup .boxRadio .txtRadio::after{
    content: "";
    border-radius: 100%;
}
.secPopup .boxRadio .txtRadio::before{
    background: var(--whiteColor);
    margin-right: 0.7rem;
    border: 0.1rem solid var(--gray_ddd_Color);
}
.secPopup .boxRadio input[type="radio"]:checked + .txtRadio::after{
    position: absolute;
    margin: auto;
    display: block;
    top: 0;
    bottom: 1px;
    left: 0;
    background: var(--radioColor);
    transform: scale(0.5);
}
.secPopup .boxRadio .txt{
    width: calc(100% - (4.2rem + 0.9rem));
    font-size: var(--pcFontSize14);
    line-height: var(--pcLineHeight14_21);
}
/* セレクトボックス */
.secPopup .boxSelect{
    position: relative;
    width: 100%;
    margin: auto;
}
.secPopup .boxSelect + .boxSelect{
    margin-top: 1rem;
}
.secPopup .boxSelect::before{
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.7rem 0.5rem 0 0.5rem;
    border-color: var(--blackColor) transparent transparent transparent;
    top: 0;
    bottom: 0;
    right: 2rem;
    margin: auto;
}
.secPopup .boxSelect select {
    width: 100%;
    padding: 1.7rem 2rem;
    font-size: var(--pcFontSize14);
    background: var(--whiteColor);
    border: 0.1rem solid var(--gray_d4d_Color);
    color: var(--blackColor);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: 0.3s;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    font-family: inherit;
}
@media only screen and (max-width:1215px){
    .secPopup .boxItem {
        margin-top: 2rem;
    }
    .secPopup .boxRadio{
        flex-direction: column;
    }
    .secPopup .boxRadio .itemRadio {
        width: 100%;
    }
    .secPopup .boxSelect + .boxSelect{
        margin-top: 0.5rem;
    }
    .secPopup .boxSelect::before{
        right: 1.5rem;
    }
    .secPopup .boxSelect select {
        padding: 1.2rem 1.8rem;
        background-color: var(--gray_f3f_Color);
        border: none;
        font-size: var(--spFontSize16);
        border-radius: 0.5rem;
    }
}