@charset "utf-8";

#container {
    position: relative;
}

.isPopup #header,
.isPopup #btnNavi{
    display: none !important;
}
.isPopup #fNavi{
    transform: none;
}

/* dBlock */
.dBlock{
    display: block;
}

/* pnkz */
#pnkz.conceptPnkz{
    position: absolute;
    top: -1px;
    left: 0;
    color: #fff;
    background: linear-gradient(
        to top,
        rgba(39,44,55,0.5)
    );
    /* background: #272c37; */
    z-index: 100;
}
#pnkz.conceptPnkz a{
    color: #fff;
}
#pnkz.conceptPnkz li:last-child{
    color: #fff;
}
@media only screen and (max-width:767px){
    #pnkz.conceptPnkz{
        position: static;
        background: #fff;
        padding: 12.5px 0;
        /* bottom: 0; */
        position: relative;
        color: #000;
    }
    #pnkz.conceptPnkz a{
        color: #000;
    }
    #pnkz.conceptPnkz li:last-child{
        color: #006699;
    }
}

.brSp374{
    display: none;
}
.isDesktopIpad .brIpad{
    display: none;
}
@media only screen and (max-width:374px){
    .brSp374{
        display: inline;
    }
    .brIpad{
        display: none;
    }
}
/* brCncept */
.isDesktopIpad .brCncept{
    display: none;
}
@media only screen and (max-width:767px){
    .brCncept{
        display: none;
    }
}
.fPlyfair{
    font-family: "Playfair Display", serif;
}
.wrapper1200{
    width: 1200px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
}
.wrapper1340{
    width: 1340px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
}
.wrapper1400{
    width: 1400px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
}
.wrapper1465{
    width: 1465px;
    max-width: calc(100% - 40px);
    margin: 0 auto;
}
@media only screen and (max-width:767px){
    .wrapper1340,
    .wrapper1200,
    .wrapper1400,
    .wrapper1465{
        max-width: 100%;
        width: 100%;
    }
}
/*-----------------------------------------------
	jsHide
-----------------------------------------------*/
.jsHide{
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.jsHide:not(.jsShow){
    opacity: 0;
    transform: translate(0px, 50px);
}
/* upAnime */
.upAnime{
    text-decoration: none;
    transition: .3s!important;
    display: block
}
.upAnime:hover {
    transform: translateY(4px);
}

/*-----------------------------------------------
    index
-----------------------------------------------*/
.off #container {
    overflow: visible;
    contain: paint;
}
/* secHero */
.secHeroTop {
    position: relative;
    width: 100%;
    height: 100vh;
    z-index: 2;
    overflow: hidden;
}
.secHero{
    width: 100%;
    min-height: auto;
    transition: filter 0.6s ease;
    /* background: url(../img/lineup_crea/secHeroBg.jpg) center top / cover no-repeat fixed; */
    z-index: 1;
    position: relative;
}
.secHero .secHeroTop01{
    overflow: hidden;
    width: 100%;
    height: 108.6vh;
    padding-bottom: 10px;
    transition: filter .5s ease-out;
}
.secHero .imgBox{
    width: 100%;
    height: 100%;
    min-height: 950px;
    position: fixed;    
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: flex;
    transition: filter .5s ease-out;
    will-change: filter;
    /* background-color: #474040; */
}
.secHeroTop .Topimg{
    position: relative;
    padding-top: 279px;
}
.secHero  .bottomTxt{
    position: relative;
    display: flex;
    margin-top: 308px;
    opacity: 0;
    position: relative;
    z-index: 10;
    transform: translateY(50px);
    transition: opacity .8s ease-out .3s, visibility .8s ease-out .3s, transform .8s ease-out .3s;
}
.secHero .secHeroTop01.on .imgBox {
    filter: blur(10px);
    width: calc(100% + 20px);
    height: calc(100% + 20px);
    top: -10px;
    left: -10px;
}
.secHero .secHeroTop01.on.off .imgBox {
    z-index: -1;
    pointer-events: none;
}
.secHero .secHeroTop01.on .bottomTxt {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}
.secHero .secHeroTop01.on .bottomTxt.jsHide {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}
.secHero  .txt01{
    font-size: 33px;
    color: #fff;
    margin-top: 59px;
}
.secHero .imgBox01{
    transition-delay: 0.3s;
}
.secHero .txtbox01{
    transition-delay: 1.0s;
}
.secHero .txtbox01{
    padding-left: 296px;
    margin-top: -35px;
}
.mainBox{
    position: relative;
    z-index: 3;
    background-color: #fff;
}
@media only screen and (max-width:767px){
    .secHeroTop {
        position: relative;
        width: 100%;
        height: auto;
        z-index: 2;
        overflow: visible;
    }
    .secHero{
        width: 100%;
        min-height: auto;
        transition: filter 0.6s ease;
        /* background: url(../img/index/bgHero.jpg) center top / cover no-repeat fixed; */
        z-index: 1;
        position: relative;
    }
    .secHero .secHeroTop01{
        overflow: hidden;
        width: 100%;
        height: auto;
        padding-bottom: 70px;
        transition: filter .5s ease-out;
    }
    .secHero .imgBox{
        min-height: auto;
        width: calc(100% + 0px);
        height: calc(100% + 0px);
        top: 0;
        left: 0;
        transform: scale(1.1);
    }
    .secHeroTop .Topimg{
        position: relative;
        padding-top: 79px;
    }
    .secHero  .bottomTxt{
        position: relative;
        display: block;
        margin-top: 0;
        opacity: 0;
        position: relative;
        z-index: 10;
        transform: translateY(50px);
        transition: opacity .8s ease-out .3s, visibility .8s ease-out .3s, transform .8s ease-out .3s;
    }
    .secHero .secHeroTop01.on .imgBox {
        filter: blur(10px);
        width: calc(100% + 0px);
        height: calc(100% + 0px);
        top: 0;
        left: 0;
        transform: scale(1.1);
    }
    .secHero .secHeroTop01.on.off .imgBox {
        position: relative;
    }
    .secHero .secHeroTop01.on .bottomTxt {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
        margin: 0 auto;
        margin-top: 100px;
        /* max-width: 369px; */
    }
    .secHero .secHeroTop01.on .bottomTxt.jsHide {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translateY(0) !important;
    }
    .secHero  .txt01{
        font-size: 20px;
        color: #fff;
        margin-top: -17px;
        text-align: center;
        padding-left: 26px;
    }
    .secHero .imgBox01{
        transition-delay: 0.3s;
        max-width: 307px;
    }
    .secHero .txtbox01{
        transition-delay: 1.0s;
    }
    .secHero .txtbox01{
        padding-left: 0;
        margin-top: 0;
        margin: 0 auto;
        margin-top: 39px;
        max-width: 292px;
    }
}
.secHeroSpacer{
    height: 100vh;
    width: 100%;
}
.secConceptCover{
    background-color: #fff;
    position: relative;
    z-index: 2;
}
.secConcept{
    opacity: 0;
    transition: 0.5s;
}
.secConcept.jsHide:not(.jsShow){
    transform: none!important;
}
.secConcept.lazyloaded{
    background: url(../img/lineup_crea/mainBg.jpg) center top no-repeat;
}
.secConcept.lazyloaded{
    height: auto;
    padding-bottom: 203px;
}
.secConcept.jsShow{
    opacity: 1;
    transition: 0.5s;
}
.secConcept .BoxContenst{
    text-align: center;
}
.secConcept .ContenstTit{
    transition-delay: 0.3s;
    font-size: 60px;
    padding-top: 200px;
}
.secConcept .ContenstTxt{
    transition-delay: 0.6s;
    font-size: 18px;
    line-height:3.88;
    padding-top: 67px;
}
@media only screen and (max-width:767px){
    .secHeroSpacer{
        height: 100vh;
        width: 100%;
    }
    .secConcept{
        position: relative;
        z-index: 1;
    }
    .secConcept.lazyloaded{
        background: url(../img/lineup_crea/mainBg_sp.jpg) center top no-repeat;
        background-size: 100% auto;
    }
    .secConcept.lazyloaded{
        height: auto;
        padding-bottom: 48px;
    }
    .secConcept .BoxContenst{
        text-align: center;
    }
    .secConcept .ContenstTit{
        transition-delay: 0.3s;
        font-size: 20px;
        padding-top: 103px;
        text-shadow:  0 0 10px #fff,
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff;
    }
    .secConcept .ContenstTxt{
        transition-delay: 0.6s;
        font-size: 13px;
        line-height: 2.76;
        padding-top: 16px;
        text-shadow:  0 0 10px #fff,
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff, 
        0 0 10px #fff;
    }
}
.secConceptSpacer .performanceList{
    display: flex;
}
.secConceptSpacer .performanceItem{
    width: calc((100% - 158px) / 3);
    transition-delay: 0.3s;
}
.secConceptSpacer .performanceTit{
    font-size: 18px;
    position: relative;
    text-align: center;
    /* display: block; */
    /* padding: 0 15px; */
}
.secConceptSpacer .performanceTit span{
    position: relative;
    padding: 0 25px;
}
.secConceptSpacer .performanceTit span::after{
    background: #1a1a1a;
    width: 1px;
    height: 18px;
    left: 0;
    position: absolute;
    content: "";
}
.secConceptSpacer .performanceTit span::before{
    background: #1a1a1a;
    width: 1px;
    height: 18px;
    right: 0;
    position: absolute;
    content: "";
}

.secConceptSpacer  .imgList{
    padding-top: 3px;
}
.secConceptSpacer .listBox{
    text-align: center;
}
.secConceptSpacer .listBox .listTit{
    font-size: 32px;
    letter-spacing: 3px;
}
.secConceptSpacer .listTxt{
    font-size: 14px;
    margin-top: 24px;
    letter-spacing: 0px;
}
.secConceptSpacer .listTxt02{
    font-size: 16px;
    margin-top: 40px;
}
.secConceptSpacer .performanceItem{
    position: relative;
}
.secConceptSpacer .performanceItem:nth-child(2){
    transition-delay: 1.0s;
    margin-left: 87px;
}
.secConceptSpacer .performanceItem:nth-child(3){
    transition-delay: 1.8s;
    margin-left: 79px;
}
.secConceptSpacer .performanceItem:not(.jsShow):not(:first-child)::before,
.secConceptSpacer .performanceItem:not(.jsShow):not(:first-child)::after{
    opacity: 0;
}
.secConceptSpacer .performanceItem:not(:first-child)::before,
.secConceptSpacer .performanceItem:not(:first-child)::after{
    content: "";
    position: absolute;
    transform: translateY(-50%) rotate(-45deg);
    background-color: #1a1a1a;
    z-index: 1;
    width: 55px;
    height: 1px;
    transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-delay: 2.5s;
}
.secConceptSpacer .performanceItem:not(:first-child)::before{
    transform:  translateY(-50%) rotate(45deg);
}
.secConceptSpacer .performanceItem:nth-child(2)::before{
    top: calc(50% - 54px);
    left: -73px;
}
.secConceptSpacer .performanceItem:nth-child(2)::after{
    right: 0;
    top: calc(50% - 54px);
    left: -71px;
}
.secConceptSpacer .performanceItem:nth-child(3)::before{
    top: calc(50% - 53px);
    left: -76px;
}
.secConceptSpacer .performanceItem:nth-child(3)::after{
    top: calc(50% - 53px);
    left: -76px;
}
@media only screen and (max-width:767px){
    .secConceptSpacer .performanceList{
        display: block;
        width: 89.335%;
        margin: 0 auto;
    }
    .secConceptSpacer .performanceItem{
        width: 100%;
        margin: 0 auto;
        transition-delay: 0.3s;
        display: flex;
        justify-content: center;
        max-width: 335px;
    }
    .secConceptSpacer .performanceTit{
        font-size: 12px;
        position: relative;
        text-align: left;
        padding-left: 0;
    }
    .secConceptSpacer  .imgList{
        padding-top: 3px;
        max-width: 129px;
        /* margin: 0 auto; */
        margin-left: 0;
    }
    .secConceptSpacer .listBox{
        text-align: center;
        padding-left: 29px;
        margin-top: 9px;
        flex: 1;
    }
    .secConceptSpacer .listBox .listTit{
        font-size: 20px;
        text-align: left;
        padding-top: 9px;
        letter-spacing: 1px;
    }
    .secConceptSpacer .performanceItem:first-child .listBox .listTit{
        letter-spacing: 0;
    }

    .secConceptSpacer .listTxt{
        font-size: 11px;
        margin-top: 15px;
        letter-spacing: 0px;
        text-align: left;
    }
    .secConceptSpacer .listTxt02{
        font-size: 12px;
        margin-top: 12px;
        line-height: 1.66;
        text-align: left;
    }
    .secConceptSpacer .performanceItem:nth-child(2){
        transition-delay: 1.0s;
        margin-left: 0;
        position: relative;
        margin: 0 auto;
        margin-top: 16px;
    }
    .secConceptSpacer .performanceItem:nth-child(3){
        transition-delay: 1.8s;
        margin-left: 0;
        position: relative;
        margin: 0 auto;
        margin-top: 18px;
        /* margin: 0 auto; */
    }
    .secConceptSpacer .performanceItem:nth-child(2)::before,
    .secConceptSpacer .performanceItem:nth-child(3)::before{
        content: "";
        position: absolute;
        top: calc(50% - 74px);
        left: calc(129px - 72px);
        width: 18px;
        height: 1px;
        background-color: #1a1a1a;
    }
    .secConceptSpacer .performanceItem:nth-child(2)::after,
    .secConceptSpacer .performanceItem:nth-child(3)::after{
        left: 0;
        width: 18px;
        top: calc(50% - 74px);
        left: 86px;
        left: calc(129px - 72px);
    }
    .secConceptSpacer .performanceTit span {
        position: relative;
        padding: 0 10px;
    }
    .secConceptSpacer .performanceTit span::before {
        height: 15px;
    }
    .secConceptSpacer .performanceTit span::after {
        height: 15px;
    }
    
}
@media only screen and (max-width: 367px) {
    .secConceptSpacer .listBox .listTit {
        font-size: 20px;
        letter-spacing: 1px;
    }
    .secConceptSpacer .listTxt {
        font-size: 10px;
    }
}
@media only screen and (max-width: 360px) {
    .secConceptSpacer .listBox {
        padding-left: 20px;
    }
    .secTkano .takanoTxt{
        font-size: 11px;
        margin-top: -6px;
    }
    .secDesign .txt_1{
        font-size: 12px;
    }
    .secDesign .boxWhatsInner:nth-child(2n) .txt_1{
        font-size: 12px;
    }
    .secDesign .boxWhatsInner:nth-child(2) .txt_2{
        font-size: 12px;
    }
}
@media only screen and (max-width: 345px) {
    .secConceptSpacer .listTxt02 {
        font-size: 10px;
    }
    .secConceptSpacer .listBox .listTit {
        font-size: 18px;
        letter-spacing: 1px;
    }
}
@media only screen and (max-width: 322px) {
    .secConceptSpacer .listBox .listTit {
        font-size: 17px;
    }
}
.secCrea{
    margin-top: 219px;
}
.secCrea .bgBox.lazyloaded{
    background: url(../img/lineup_crea/ceraBg.jpg) center top no-repeat;
}
.secCrea .bgBox{
    height: auto;
    position: relative;
    padding-bottom: 365px;
}
.secCrea .creaTxtbox{
    margin-top: -50px;
    position: absolute;
    content: "";
    top: -28px;
}
.secCrea .creaTxtbox .creaTit{
    font-size: 120px;
    color: #000;
    position: relative;
}
.secCrea .creaTxtbox .creaTit.lazyloaded::after{
    background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
    background-size: 100% auto;
}
.secCrea .creaTxtbox .creaTit::after{
    position: absolute;
    content: "";
    right: -93px;
    bottom: -24px;
    width:130px;
    height: 57px;
}
.secCrea .creaTxtbox .creaTxt{
    font-size: 24px;
    margin-top: 50px;
    padding-left: 7px;
    letter-spacing: 9px;
}
.secCrea .creaImgbox{
    text-align: center;
    transition-delay: 1.5s;
    padding-top: 364px;
}
/* anime */
.animeWrapper .animeLeft,
.animeWrapper .animeRight{
    opacity: 0;
    transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
}
.animeWrapper .animeRight{
    transform: translateX(-100px);
}
.animeWrapper .animeLeft{
    transform: translateX(-100px);
}
.animeWrapper.jsShow .animeLeft,
.animeWrapper.jsShow .animeRight{
    opacity: 1;
    transform: none;
}
@media only screen and (max-width: 767px){
    .secCrea{
        margin-top: 96px;
    }
    .secCrea .bgBox.lazyloaded{
        background: url(../img/lineup_crea/ceraBg_sp.jpg) center top no-repeat;
        background-size: 100% auto;
    }
    .secCrea .bgBox{
        height: auto;
        position: relative;
        padding-bottom: 282px;
    }
    .secCrea .creaTxtbox{
        margin-top: 0;
        position: absolute;
        content: "";
        top: -27px;
        left: 17px;
    }
    .secCrea .creaTxtbox .creaTit{
        font-size: 40px;
        color: #000;
        position: relative;
    }
    .secCrea .creaTxtbox .creaTit.lazyloaded::after{
        background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
        background-size: 100% auto;
    }
    .secCrea .creaTxtbox .creaTit::after{
        position: absolute;
        content: "";
        right: -25px;
        bottom: -15px;
        width: 66px;
        height: 29px;
    }
    .secCrea .creaTxtbox .creaTxt{
        font-size: 13px;
        margin-top: 23px;
        padding-left: 0;
        letter-spacing: 1.5px;
    }
    .secCrea .creaImgbox{
        text-align: center;
        margin: 0 auto;
        transition-delay: 2.5s;
        padding-top: 186px;
        max-width: 124px;
        height: auto;
    }
    /* anime */
    .animeWrapper .animeLeft,
    .animeWrapper .animeRight{
        opacity: 0;
        transition: all 3s cubic-bezier(0.19, 1, 0.22, 1);
    }
    .animeWrapper .animeRight{
        transform: translateX(-100px);
    }
    .animeWrapper .animeLeft{
        transform: translateX(-100px);
    }
    .animeWrapper.jsShow .animeLeft,
    .animeWrapper.jsShow .animeRight{
        opacity: 1;
        transform: none;
    }
}
.secHealth .healthBg.lazyloaded{
    background: url(../img/lineup_crea/mainBg_01.jpg) center top no-repeat;
}
.secHealth .healthBg{
    height: 1507px;
    padding-top: 138px;
}
.secHealth .healthTxtbox{
    text-align: center;
}
.secHealth  .healthTit{
    color: #ffffff;
    font-size: 30px;
    line-height:2.26;
    letter-spacing: 5px;
}
.secHealth  .healthList{
    display: flex;
    justify-content: center;
    margin: 0 auto;
    margin-top: 16px;
    width: 735px;
}
.secHealth  .healthItem{
    width: calc((100% - 30px) / 2);
}
.secHealth  .healthItem:nth-child(2){
    margin-left: 38px;
    transition-delay: 0.6s;
}
.secHealth  .healthTxt{
    font-size: 18px;
    line-height: 2.22;
    color: #fff;
    text-align: center;
    margin-top: 30px;
    letter-spacing: 3px;
}
@media only screen and (max-width: 767px){
    .secHealth .healthBg.lazyloaded{
        background: url(../img/lineup_crea/mainBg_01_sp.jpg) center top no-repeat;
        background-size: cover;
        position: relative;
    }
    .secHealth .healthBg.lazyloaded::before{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: url(../img/lineup_crea/mainBg_02_sp.jpg) center top no-repeat;
        background-size: cover;
        opacity: 0;
        transition: opacity 1.5s ease;
        z-index: 0;
    }
    .secHealth .healthBg.lazyloaded.bgChanged::before{
        opacity: 1;
    }
    .secHealth .healthBg{
        height: auto;
        padding-top: 75px;
        padding-bottom: 70px;
        position: relative;
    }
    .secHealth .healthBg > *{
        position: relative;
        z-index: 1;
    }
    .secHealth .healthTxtbox{
        text-align: center;
    }
    .secHealth  .healthTit{
        color: #ffffff;
        font-size: 20px;
        line-height: 1.7;
        letter-spacing: 5px;
    }
    .secHealth  .healthList{
        display: flex;
        justify-content: center;
        margin: 0 auto;
        margin-top: 31px;
        width: 85.87%;
    }
    .secHealth  .healthItem{
        width: calc((100% - 13px) / 2);
    }
    .secHealth  .healthItem:nth-child(2){
        margin-left: 13px;
        transition-delay: 0.6s;
    }
    .secHealth  .healthTxt{
        font-size: 13px;
        line-height: 2.76;
        color: #fff;
        text-align: center;
        margin-top: 30px;
        letter-spacing: 1px;
    }

}
.secScenario{
    margin-top: 148px;
    padding-bottom: 164px;
}
.secScenario .scenarioTxtbox{
    text-align: center;
}
.secScenario  .scenarioTit{
    font-size: 24px;
    letter-spacing: 7px;
}
.secScenario  .scenarioTxt{
    font-size: 18px;
    margin-top: 39px;
}
.secScenario  .scenarioList{
    margin-top: 94px;
    display: flex;
}
.secScenario  .scenarioList .scenarioItem{
    width: calc((100% - 140px) / 3);
}
.secScenario  .scenarioList .scenarioItem:nth-child(n+2){
    margin-left: 70px;
}
.secScenario  .scenarioList .scenarioItem:nth-child(2){
    transition-delay: 0.6s;
}
.secScenario  .scenarioList .scenarioItem:nth-child(3){
    transition-delay: 0.9s;
}
.secScenario .imgBox{
    position: relative;
    padding-left: 6px;
}
.secScenario .imgBox.lazyloaded::after{
    background: url(../img/lineup_crea/scenarioIcon.png) center top no-repeat;
}
.secScenario .imgBox::after{
    width: 94px;
    height: 32px;
    left: -25px;
    top: -32px;
    position: absolute;
    content: "";
}
.secScenario .mainScerio{
    margin-top: 26px;
}
.secScenario .scenarioTxt01{
    font-size: 20px;
    line-height: 2.1;
    text-align: center;
    margin-top: 30px;
}
@media only screen and (max-width: 767px){
    .secScenario{
        margin-top: 74px;
        padding-bottom: 105px;
    }
    .secScenario .scenarioTxtbox{
        text-align: center;
    }
    .secScenario  .scenarioTit{
        font-size: 16px;
        letter-spacing: 1px;
        line-height: 1.75;
    }
    .secScenario  .scenarioTxt{
        font-size: 12px;
        margin-top: 8px;
        line-height: 2;
    }
    .secScenario  .scenarioList{
        width: 89.339%;
        margin: 0 auto;
        margin-top: 23px;
        display: block;
    }
    .secScenario  .scenarioList .scenarioItem{
        width: 100%;
        display: flex;
        max-width: 335px;
        margin: 0 auto;
    }
    .secScenario  .scenarioList .scenarioItem:nth-child(n+2){
        margin-left: 0;
        margin-top: -6px;
    }
    .secScenario  .scenarioList .scenarioItem:nth-child(2){
        transition-delay: 0.6s;
        margin-top: 19px;
        margin-left: auto;
    }
    .secScenario  .scenarioList .scenarioItem:nth-child(3){
        transition-delay: 0.9s;
        margin-top: 19px;
        margin-left: auto;
    }
    .secScenario .imgBox{
        position: relative;
        padding-left: 0;
        max-width: 160px;
    }
    .secScenario .imgBox.lazyloaded::after{
        background: url(../img/lineup_crea/scenarioIcon.png) center top no-repeat;
    }
    .secScenario .imgBox::after{
        width: 94px;
        height: 32px;
        left: -25px;
        top: -32px;
        position: absolute;
        content: "";
        display: none;
    }
    .secScenario .mainScerio{
        margin-top: 0;
        max-width: 160px;
    }
    .secScenario .scenarioTxt01{
        font-size: 13px;
        line-height: 1.57;
        text-align: left;
        margin-top: 9px;
        padding-left: 5px;
        /* white-space: nowrap; */
    }
    .secScenario  .spBox01 {
        padding-left: 6px;
        margin-top: 13px;
        flex: 1;
    }
}
.secTkano{
    position: relative;
}
.secTkano::after{
    position: absolute;
    content: "";
    width: 1px;
    height: 150px;
    left: calc(50% - 0px);
    top: -75px;
    background: #1a1a1a;
    transform-origin: top center;
    transform: scaleY(0);
}

.secTkano.jsShow::after{
    animation: secTkanoLineDraw 0.8s ease-out forwards;
}

@keyframes secTkanoLineDraw{
    0%{
        transform: scaleY(0);
    }
    100%{
        transform: scaleY(1);
    }
}
.secTkano .tkanoBg.lazyloaded{
    background: url(../img/lineup_crea/takanoBg.jpg) center top no-repeat;
}
.secTkano .tkanoBg{
    height: 1080px;
    padding-top: 111px;
    padding-bottom: 219px;
}
.secTkano .tkanoTit{
    text-align: center;
    font-size: 36px;
    line-height: 2.22;
    /* font-weight:bold; */
    letter-spacing: 2px;
}
.secTkano  .takanomainBox{
    display: flex;
    margin-top: 108px;
    justify-content: center;
}
.secTkano  .takanoTxt{
    font-size: 20px;
    line-height:2.5;
    margin-top: 23px;
    text-align: left;
    text-shadow: 2px 2px 4px rgba(212, 207, 196, 0.8);
}
.secTkano .leftBox .img{
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.secTkano .rightBox{
    padding-left: 154px;
    margin-top: -48px;
}
@media only screen and (max-width: 767px){
    .secTkano::after{
        position: absolute;
        content: "";
        width: 1px;
        height: 50px;
        left: calc(50% - 2px);
        top: -25px;
        background: #1a1a1a;
        transform-origin: top center;
        transform: scaleY(0);
    }
    .secTkano .tkanoBg.lazyloaded{
        background: url(../img/lineup_crea/takanoBg.jpg) center top no-repeat;
    }
    .secTkano .tkanoBg{
        height: auto;
        padding-top: 69px;
        padding-bottom: 76px;
    }
    .secTkano .tkanoTit{
        text-align: center;
        font-size: 16px;
        line-height: 1.75;
        /* font-weight:bold; */
        letter-spacing: 2px;
    }
    .secTkano  .takanomainBox{
        display: flex;
        margin-top: 32px;
        justify-content: center;
        flex-direction: column-reverse;
    }
    .secTkano  .takanoTxt{
        font-size: 12px;
        line-height: 1.83;
        margin-top: -11px;
        text-align: left;
        padding-left: 23px;
    }
    .secTkano  .leftBox{
        display: flex;
        justify-content: flex-start;
        width: 92%;
        margin: 0 auto;
        margin-top: 36px;
        max-width: 345px;
    }
    .secTkano .leftBox .img{
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
        max-width: 136px;
        height: auto;
        max-height: 89px;
    }
    .secTkano .rightBox{
        padding-left: 0;
        margin-top: 0;
    }
    .secTkano .rightBox .img{
        max-width: 335px;
        margin: 0 auto;
    }
}
.secDesign{
    margin-top: 183px;
    position: relative;
}
.secDesign .DesignTxtbox .DesignTit {
    font-size: 120px;
    color: #000;
    position: relative;
}
.secDesign .DesignTxtbox .DesignTit.lazyloaded::after {
    background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
    background-size: 100% auto;
}
.secDesign .DesignTxtbox .DesignTit::after {
    position: absolute;
    content: "";
    right: auto;
    left: 357px;
    bottom: -24px;
    width: 130px;
    height: 57px;
}
.secDesign .DesignTxtbox .DesignTxt {
    font-size: 24px;
    margin-top: 50px;
    padding-left: 7px;
    letter-spacing: 9px;
}
.secDesign .designImgbox{
    margin-top: 98px;
    max-width: 1790px;
    margin-left: auto;
    transition-delay: 0.8s;
}
.secDesign  .designTxtbox{
    text-align: center;
    margin-top: 81px;
}
.secDesign  .designTxtbox .designTxt{
    font-size: 24px;
    line-height:2.33;
    letter-spacing: 9px;
}
.secDesign .designBg.lazyloaded{
    background: url(../img/lineup_crea/designBg.jpg) center top no-repeat;
}
.secDesign .designBg{
    margin-top: 140px;
    /* height: 1080px; */
    position: relative;
    padding-top: 196px;
}
.secDesign .designBg::after {
    position: absolute;
    content: "";
    width: 1px;
    height: 150px;
    left: calc(50% - 0px);
    top: -75px;
    background: #1a1a1a;
    transform-origin: top center;
    transform: scaleY(0);
}
.secDesign .designBg.jsShow::after {
    animation: secTkanoLineDraw 0.8s ease-out forwards;
}
@keyframes secTkanoLineDraw{
    0%{
        transform: scaleY(0);
    }
    100%{
        transform: scaleY(1);
    }
}
.secDesign .boxWhatsInner{
    position: relative;
    display: flex;
    align-items: flex-start;
}
.secDesign .boxWhatsInner:nth-child(2n){
    flex-direction: row-reverse;
    margin-top: 159px;
}
.secDesign .boxWhatsInner:nth-child(3){
    margin-top: 159px;
}
.secDesign .imgBox01{
    position: sticky;
    top: 0;
    left: 0;
}
/* boxWhatsTxt */
.secDesign .boxImg{
    width: calc(100% - 552px);
    text-align: left;
    padding-left: 94px;
    padding-bottom: 222px;
}
.secDesign .boxWhatsInner:nth-child(2n) .boxImg{
    width: calc(100% - 552px);
    text-align: left;
    padding-left:0;
    padding-bottom: 0;
    padding-right: 40px;
}
.secDesign .boxWhatsInner:nth-child(3) .boxImg{

}
.secDesign .boxImg .tit01{
    position: relative;
    display: inline-block;
    font-size: 20px;
}
.secDesign .boxImg .txt01{
    font-size: 50px;
    line-height: 1.4;
    margin-top: 13px;
}
.secDesign .boxImg .tit::after{
    position: absolute;
    content: '';
    margin: auto;
    display: block;
    bottom: -23px;
    left: 0;
    width: 100%;
    height: 7px;
    background: url(../img/index/txtLine.png);
    background-size: contain;
}
.secDesign .boxLogo{
    margin-top: 60px;
}
.secDesign .boxImg .txt{
    margin-top: 55px;
}
.secDesign .txt_1{
    font-size: 16px;
    line-height:3.125;
    margin-top: 53px;
    position: relative;
}
.secDesign .boxWhatsInner:nth-child(2n) .txt_1{
    font-size: 16px;
    line-height: 2.375;
    margin-top: 53px;
    position: relative;
}
.secDesign .boxWhatsInner:nth-child(4) .txt_1{
    font-size: 15px;
    line-height: 2.4;
    margin-top: 53px;
    position: relative;
}
.secDesign .txt_1::after{
    position: absolute;
    content: "";
    left: 0;
    top: -26px;
    background: #1a1a1a;
    width: 40px;
    height: 1px;
}
.secDesign .scrollImg{
    margin-top: 30px;
    max-width: 550px;
}
.secDesign .boxWhatsInner:nth-child(2n) .scrollImg{   
    margin-top: 34px;
}
.secDesign .boxWhatsInner:nth-child(2) .scrollImg.sub{
    margin-top: 40px;
}
.secDesign .boxWhatsInner:nth-child(2) .boxTxt01{
    margin-top: 31px;
}
.secDesign .boxWhatsInner:nth-child(2) .tit02{
    font-size: 20px;
    font-weight: bold;
}
.secDesign .boxWhatsInner:nth-child(2) .txt_2{
    margin-top: 20px;
    font-size: 14px;
    line-height: 2.14;
}
.secDesign  .pasibuList{
    position: relative;
    margin-top: 61px;
}
.secDesign  .pasibuList::after{
    position: absolute;
    content: "";
    left: 6px;
    top: -38px;
    background: #1a1a1a;
    width: 40px;
    height: 1px;
}
.secDesign  .pasibuItem:nth-child(n+2){
    margin-top: 23px;
}
.secDesign  .pasibuItem:nth-child(3){
    margin-top: 33px;
}
.secDesign .pasibuTit{
    font-size: 18px;
    color: #00821f;
}
.secDesign .pasibuTxt{
    font-size: 13px;
    line-height: 2;
    margin-top: 12px;
}
.secDesign .itemImg{
    margin-top: -87px;
}
.secDesign .flexBox1{
    display: flex;
    margin-top: 58px;
}
.secDesign .flexBox1 .pasibuTit01{
    font-size: 22px;
    color: #22773a;
}
.secDesign .flexBox1  .pasibuTit02{
    font-size: 14px;
    margin-top: 13px;
    font-weight: bold;
    letter-spacing: 1px;
}
.secDesign .flexBox1 .rightBox{
    padding-left: 17px;
    margin-top: -6px;
}
.secDesign .flexBox2{
    display: flex;
    margin-top: 11px;
    flex-direction: row-reverse;
    justify-content: flex-end;
}
.secDesign .flexBox2 .leftBox{
    padding-left: 26px;
}
.secDesign .flexBox2 .pasibuTit01{
    font-size: 22px;
    color: #22773a;
}
.secDesign .flexBox2  .pasibuTit02{
    font-size: 14px;
    margin-top: 13px;
    font-weight: bold;
    letter-spacing: 1px;
}
.secDesign .flexBox2 .rightBox{
    padding-left: 0;
    margin-top: -6px;
}
.secDesign .Box2{
    /* text-align: center; */
    margin-top: 12px;
    margin-left: 58px;
}
@media only screen and (max-width:767px){
    .secDesign{
        margin-top: 73px;
        position: relative;
    }
    .secDesign .DesignTxtbox .DesignTit {
        font-size: 120px;
        color: #000;
        position: relative;
        font-size: 40px;
        color: #000;
        position: relative;
    }
    .secDesign .DesignTxtbox .DesignTit.lazyloaded::after {
        background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
        background-size: 100% auto;
    }
    .secDesign .DesignTxtbox .DesignTit::after {
        position: absolute;
        content: "";
        right: auto;
        left: 108px;
        bottom: -16px;
        width: 66px;
        height: 29px;
    }
    .secDesign .DesignTxtbox .DesignTxt {
        font-size: 24px;
        margin-top: 50px;
        padding-left: 7px;
        letter-spacing: 9px;
        font-size: 13px;
        margin-top: 23px;
        font-weight: bold;
        padding-left: 0;
        letter-spacing: 1.5px;
    }
    .secDesign .designImgbox{
        margin-top: 38px;
        /* max-width: 355px; */
        width: 94.67%;
        margin-left: auto;
        transition-delay: 0.8s;
    }
    .secDesign  .designTxtbox{
        text-align: center;
        margin-top: 33px;
    }
    .secDesign  .designTxtbox .designTxt{
        font-size: 12px;
        line-height:2.33;
        letter-spacing: 0px;
        text-align: center;
    }
    .secDesign .designBg.lazyloaded{
        background: url(../img/lineup_crea/designBg.jpg) center top no-repeat;
        background: none;
    }
    .secDesign .designBg{
        margin: 0 auto;
        /* CORNER-SHAPE: SUPERELLIPSE(0.5); */
        margin-top: 0;
        /* height: 1080px; */
        position: relative;
        padding-top: 143px;
        /* width: 89.335%; */
    }
    .secDesign .designBg::after {
        position: absolute;
        content: "";
        width: 1px;
        height: 50px;
        left: calc(50% - 4px);
        top: 41px;
        background: #1a1a1a;
        transform-origin: top center;
        transform: scaleY(0);
    }
    .secDesign .boxWhatsInner{
        position: relative;
        display: block;
        align-items: flex-start;
    }
    .secDesign .boxWhatsInner:nth-child(2n){
        flex-direction: row-reverse;
        margin-top: 79px;
    }
    .secDesign .boxWhatsInner:nth-child(3){
        margin-top: 73px;
    }
    .secDesign .boxWhatsInner:nth-child(4){
        margin-top: 73px;
    }
    .secDesign .imgBox01{
        position: static;
        top: 0;
        left: 0;
        width: 89.335%;
        margin: 0 auto;
    }
    /* boxWhatsTxt */
    .secDesign .boxImg{
        width: 100%;
        text-align: left;
        padding-left: 0;
        padding-bottom: 0;
        position: relative;
    }
    .secDesign .boxWhatsInner:nth-child(2n) .boxImg{
        width: 100%;
        text-align: left;
        padding-left:0;
        padding-bottom: 0;
        padding-right: 0;
    }
    .secDesign .boxWhatsInner:nth-child(3) .boxImg{
    
    }
    .secDesign .boxImg .tit01{
        position: relative;
        display: none;
        font-size: 15px;
        line-height: 1.73;
    }
    .secDesign .spwhitwBox{
        background: #fff;
        width: 270px;
        /* max-width: 335px; */
        margin: 0 auto;
        height: auto;
        position: absolute;
        top: -78px;
        padding: 22px 22px 27px;
    }
    .secDesign .boxImg .tit02{
        position: relative;
        display: inline-block;
        font-size: 15px;
        line-height: 1.73;
    }
    .secDesign .boxImg .txt01{
        font-size: 22px;
        line-height: 1.63;
        margin: 0 auto;
        margin-top: -21px;
        /* padding: 0 20px; */
        position: relative;
        width: 89.335%;
        /* margin: 0 auto; */
    }
    .secDesign .boxImg .tit::after{
        position: absolute;
        content: '';
        margin: auto;
        display: block;
        bottom: -23px;
        left: 0;
        width: 100%;
        height: 7px;
        background: url(../img/index/txtLine.png);
        background-size: contain;
    }
    .secDesign .boxLogo{
        margin-top: 60px;
    }
    .secDesign .boxImg .txt{
        margin-top: 55px;
    }
    .secDesign .txt_1{
        font-size: 13px;
        line-height: 2.15;
        margin-top: 14px;
        position: relative;
        /* padding: 0 20px; */
    }
    .secDesign .boxWhatsInner:nth-child(2n) .txt_1{
        font-size: 13px;
        line-height: 2.15;
        margin-top: 17px;
        position: relative;
    }
    .secDesign .boxWhatsInner:nth-child(4) .txt_1{
        font-size: 13px;
        line-height: 2.15;
        margin-top: 13px;
        position: relative;
    }
    .secDesign .txt_1::after{
        position: absolute;
        content: "";
        left: 0;
        top: -26px;
        background: #1a1a1a;
        width: 40px;
        height: 1px;
        display: none;
    }
    .secDesign .scrollImg{
        margin: 0 auto;
        margin-top: 22px;
        max-width: 100%;
        width: 89.335%;
    }
    .secDesign .boxWhatsInner:nth-child(2n) .scrollImg{
        margin-top: 21px;
    }
    .secDesign .boxWhatsInner:nth-child(2) .scrollImg.sub{
        margin-top: 23px;
    }
    .secDesign .boxWhatsInner:nth-child(2) .boxTxt01{
        margin: 0 auto;
        margin-top: 16px;
        /* padding: 0 20px; */
        width: 89.335%;
    }
    .secDesign .boxWhatsInner:nth-child(2) .tit02{
        font-size: 15px;
        font-weight: normal;
    }
    .secDesign .boxWhatsInner:nth-child(2) .txt_2{
        margin-top: 5px;
        font-size: 13px;
        line-height: 2.14;
    }
    .secDesign  .pasibuList{
        position: relative;
        width: 89.335%;
        margin: 0 auto;
        margin-top: 19px;
    }
    .secDesign  .pasibuList::after{
        position: absolute;
        content: "";
        left: 6px;
        top: -38px;
        background: #1a1a1a;
        width: 40px;
        height: 1px;
        display: none;
    }
    .secDesign  .pasibuItem:nth-child(n+2){
        margin-top: 23px;
    }
    .secDesign  .pasibuItem:nth-child(3){
        margin-top: 22px;
    }
    .secDesign  .pasibuItem:nth-child(4){
        margin-top: 28px;
    }
    .secDesign .pasibuTit{
        font-size: 15px;
        color: #00821f;
    }
    .secDesign .pasibuTxt{
        font-size: 13px;
        line-height: 2.15;
        margin-top: 12px;
    }
    .secDesign .pasibuTxt.sptxt{
        font-size: 8px;
        line-height: 2.12;
        margin-top: 6px;
    }
    .secDesign .itemImg{
        margin-top: 24px;
    }
    .secDesign .flexBox1{
        display: flex;
        margin: 0 auto;
        margin-top: 24px;
        width: 89.335%;
        max-width: 335px;
    }
    .secDesign .flexBox1 .pasibuTit01{
        font-size: 15px;
        color: #22773a;
    }
    .secDesign .flexBox1  .pasibuTit02{
        font-size: 10px;
        margin-top: 8px;
        font-weight: bold;
        letter-spacing: 0px;
    }
    .secDesign .flexBox1 .rightBox{
        padding-left: 12px;
        margin-top: -3px;
        max-width: 111px;
        flex: 1;
    }
    .secDesign .flexBox2{
        display: flex;
        margin: 0 auto;
        margin-top: 2px;
        flex-direction: row-reverse;
        justify-content: flex-end;
        max-width: 375px;
    }
    .secDesign .flexBox2 .leftBox{
        padding-left: 26px;
    }
    .secDesign .flexBox2 .pasibuTit01{
        font-size: 15px;
        color: #22773a;
    }
    .secDesign .flexBox2  .pasibuTit02{
        font-size: 10px;
        margin-top: 7px;
        font-weight: bold;
        letter-spacing: 0px;
    }
    .secDesign .flexBox2 .rightBox{
        padding-left: 20px;
        margin-top: -2px;
        max-width: 108px;
    }
    .secDesign .Box2{
        /* text-align: center; */
        margin: 0 auto;
        margin-top: 7px;
        /* margin-left: 59px; */
        max-width: 264px;
    }
    .secDesign .boxTxt {
        width: 89.335%;
        margin: 0 auto;
    }
}
.secWite{
    margin-top: 325px;
}
.secWite .withBg.lazyloaded{
    background: url(../img/lineup_crea/wihtBg.jpg) center top no-repeat;
}
.secWite .withBg{
    height: auto;
    position: relative;
    padding-bottom: 86px;
}
.secWite .DesignTxtbox {
    margin-top: -50px;
    position: absolute;
    content: "";
    top: -19px;
}
.secWite .withBg .DesignTit {
    font-size: 120px;
    color: #000;
    position: relative;
    letter-spacing: 3px;
}
.secWite .withBg .DesignTit.lazyloaded::after {
    background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
    background-size: 100% auto;
}
.secWite .withBg .DesignTit::after {
    position: absolute;
    content: "";
    right: auto;
    /* left: calc(50% - 1px); */
    right: -79px;
    bottom: -32px;
    width: 130px;
    height: 57px;
}
.secWite .withBg .DesignTxt {
    font-size: 24px;
    margin-top: 50px;
    padding-left: 7px;
    letter-spacing: 9px;
}
.secWite .creaTxtBox{
    text-align: center;
    padding-top: 260px;
}
.secWite .creaTxtBox .creaTit01{
    font-size: 70px;
    letter-spacing: 0;
}
.secWite .creaTxtBox .creaTit02{
    font-size: 22px;
    margin-top: 33px;
}
.secWite .creaTxtBox  .creaTxt01{
    font-size: 18px;
    line-height: 2.44;
    margin-top: 27px;
}
.secWite .secViewBtm{
    width: 400px;
    margin: 0 auto;
    margin-top: 0;
}
.secWite .secViewBtm01{
    width: 400px;
    margin: 0 auto;
    margin-top: 86px;
}
.secWite .secViewBtm02{
    width: 400px;
    margin: 0 auto;
    margin-top: 121px;
}
.secWite .swiper{
    width: 100%;
    overflow: visible;
}
.secWite .swiper-wrapper{
    transition-timing-function: linear;
}
.secWite .swiper-slide{
    width: 900px!important;
}
.secWite .swiper-slide.type_02{
    width: 400px!important;
}
.secWite .flexBox01{
    display: flex;
    margin-top: 62px;
}
.secWite .imgFlex{
    transition-delay: 0.3s;
}
.secWite .txtBoxRight{
    padding-left: 112px;
    padding-top: 30px;
    transition-delay: 0.8s;
}
.secWite .nubnrImg{
    width: 50px;
}
.secWite .nubnrTit{
    font-size: 22px;
    margin-top: 41px;
    margin-bottom: 29px;
}
.secWite  .nubnrTxt{
    font-size: 14px;
    line-height:2.28;
}
.secWite .seirrBox02{
    margin-top: 228px;
    background: #f3f4f4;
    padding-top: 31px;
    padding-bottom: 154px;
}
.secWite .seirrBox02.lazyloaded{
    background: url(../img/lineup_crea/repertBg.jpg) center top repeat;
    background-size: 25px  auto;
}
@media only screen and (max-width:767px){
    .secWite{
        margin-top: 156px;
    }
    .secWite .withBg.lazyloaded{
        background: url(../img/lineup_crea/wihtBg_sp.jpg) center top no-repeat;
        background-size: cover;
    }
    .secWite .withBg{
        height: auto;
        position: relative;
        padding-bottom: 50px;
    }
    .secWite .DesignTxtbox {
        margin-top: -50px;
        position: absolute;
        content: "";
        top: 27px;
    }
    .secWite .withBg .DesignTit {
        font-size: 40px;
        color: #000;
        position: relative;
        letter-spacing: 2px;
    }
    .secWite .withBg .DesignTit.lazyloaded::after {
        background: url(../img/lineup_crea/cera_txt.png) center top no-repeat;
        background-size: 100% auto;
    }
    .secWite .withBg .DesignTit::after {
        position: absolute;
        content: "";
        right: auto;
        /* left: calc(50% - 1px); */
        right: -24px;
        bottom: -16px;
        width: 66px;
        height: 29px;
    }
    .secWite .withBg .DesignTxt {
        font-size: 13px;
        margin-top: 23px;
        padding-left: 7px;
        letter-spacing: 1px;
    }
    .secWite .creaTxtBox{
        text-align: center;
        padding-top: 99px;
    }
    .secWite .creaTxtBox .creaTit01{
        font-size: 26px;
        letter-spacing: 0;
    }
    .secWite .creaTxtBox .creaTit02{
        font-size: 16px;
        margin-top: 19px;
    }
    .secWite .creaTxtBox  .creaTxt01{
        font-size: 12px;
        line-height: 1.83;
        margin-top: 15px;
    }
    .secWite .secViewBtm{
        width: 200px;
        margin: 0 auto;
        margin-top: 0;
    }
    .secWite .secViewBtm01{
        width: 400px;
        margin: 0 auto;
        margin-top: 86px;
    }
    .secWite .secViewBtm02{
        width: 400px;
        margin: 0 auto;
        margin-top: 0;
    }
    .secWite .swiper{
        width: 100%;
        overflow: visible;
    }
    .secWite .swiper-wrapper{
        transition-timing-function: linear;
    }
    .secWite .swiper-slide{
        width: 900px!important;
    }
    .secWite .swiper-slide.type_02{
        width: 400px!important;
    }
    .secWite .flexBox01{
        display: block;
        margin-top: 35px;
        width: 89.335%;
    }
    .secWite .txtBoxRight{
        padding-left: 0;
        padding-top: 0;
    }
    .secWite .nubnrImg{
        width: 28px;
    }
    .secWite .nubnrTit{
        font-size: 13px;
        margin-top: 13px;
        margin-bottom: 13px;
        font-weight: bold;
    }
    .secWite  .nubnrTxt{
        font-size: 13px;
        line-height: 2.15;
    }
    .secWite .seirrBox02{
        margin-top: -13px;
        background: none;
        padding-top: 0;
        padding-bottom: 76px;
    }
    .secWite .swiper-container{
        height: 200px;
    }
    .secWite  .swiper-slide{
        width: 313px !important;
    }
    .secWite .swiper-slide.type_02{
        width: 140px!important;
    }
    .secWite .spTxt01{
        font-size: 18px;
        line-height: 1.66;
        margin-top: 6px;
    }
    .secWite .seirrBox02.lazyloaded{
        background:none;
        background-size: 25px  auto;
    }
}
@media only screen and (max-width: 360px) {
    .secWite .nubnrTit{
        line-height: 1.5;
    }
}

.sechousing{
    position: relative;
    margin-top: 252px;
    padding-top: 81px;
}
.sechousing::after{
    position: absolute;
    content: "";
    width: 1px;
    height: 150px;
    left: calc(50% - 2px);
    top: -152px;
    background: #1a1a1a;
    transform-origin: top center;
    transform: scaleY(0);
}
.sechousing.jsShow::after{
    animation: secTkanoLineDraw 0.8s ease-out forwards;
}

@keyframes secTkanoLineDraw{
    0%{
        transform: scaleY(0);
    }
    100%{
        transform: scaleY(1);
    }
}
.sechousing .housingTit{
    font-size: 24px;
    line-height: 2.33;
    text-align: center;
    /* margin-top: 30px; */
    letter-spacing: 8px;
}
.sechousing .housingList{
    margin-top: 65px;
    display: flex;
    flex-wrap: wrap;
}
.sechousing .housingItem{
    width: calc((100% - 84px) / 4);
}
.sechousing .housingItem:nth-child(2){
    transition-delay: 0.3s;
}
.sechousing .housingItem:nth-child(3){
    transition-delay: 0.6s;
}
.sechousing .housingItem:nth-child(4){
    transition-delay: 0.9s;
}
.sechousing .housingItem:nth-child(5){
    transition-delay: 1.2s;
}
.sechousing .housingItem:nth-child(6){
    transition-delay: 1.5s;
}
.sechousing .housingItem:nth-child(7){
    transition-delay: 1.8s;
}
.sechousing .housingItem:nth-child(8){
    transition-delay: 2.1s;
}
.sechousing .housingItem:nth-child(n+2){
    margin-left: 27px;
}
.sechousing .housingItem:nth-child(n+5){
    margin-top: 60px;
}
.sechousing .housingItem:nth-child(5){
    margin-left: 0;
}
.sechousing .housingTit01{
    font-size: 20px;
    text-align: center;
    margin-top: 29px;
}
.sechousing .housingItem:nth-child(5) .housingTit01,
.sechousing .housingItem:nth-child(6) .housingTit01{
    margin-top: 26px;
}
@media only screen and (max-width:767px){
    .sechousing{
        position: relative;
        margin-top: 45px;
        padding-top: 91px;
    }
    .sechousing::after{
        position: absolute;
        content: "";
        width: 1px;
        height: 50px;
        left: calc(50% - -1px);
        top: 0px;
        background: #1a1a1a;
        transform-origin: top center;
        transform: scaleY(0);
    }
    .sechousing .housingTit{
        font-size: 15px;
        line-height: 2;
        text-align: center;
        /* margin-top: 30px; */
        letter-spacing: 0px;
    }
    .sechousing .housingList{
        width: 89.335%;
        margin: 0 auto;
        margin-top: 23px;
        display: flex;
        flex-wrap: wrap;
    }
    .sechousing .housingItem{
        width: calc((100% - 15px) / 2);
    }
    .sechousing .housingItem:nth-child(2){
        transition-delay: 0.3s;
    }
    .sechousing .housingItem:nth-child(3){
        transition-delay: 0.6s;
    }
    .sechousing .housingItem:nth-child(4){
        transition-delay: 0.9s;
    }
    .sechousing .housingItem:nth-child(5){
        transition-delay: 1.2s;
    }
    .sechousing .housingItem:nth-child(6){
        transition-delay: 1.5s;
    }
    .sechousing .housingItem:nth-child(7){
        transition-delay: 1.8s;
    }
    .sechousing .housingItem:nth-child(8){
        transition-delay: 2.1s;
    }
    .sechousing .housingItem:nth-child(n+2){
        margin-left: 0;
    }
    .sechousing .housingItem:nth-child(n+3){
        margin-top: 19px;
    }
    .sechousing .housingItem:nth-child(2n){
        margin-left: 15px;
    }
    .sechousing .housingItem:nth-child(n+5){
        margin-top: 19px;
    }
    .sechousing .housingItem:nth-child(5){
        margin-left: 0;
    }
    .sechousing .housingTit01{
        font-size: 13px;
        text-align: center;
        margin-top: 17px;
    }
    .sechousing .housingItem:nth-child(5) .housingTit01,
    .sechousing .housingItem:nth-child(6) .housingTit01{
        margin-top: 16px;
    }
}
.sccBnrLink{
    background: #f6f8f7;
    padding-top: 132px;
    margin-top: 201px;
    text-align: center;
    padding-bottom: 111px;
}
.sccBnrLink.lazyloaded{
    background: url(../img/lineup_crea/repertBg.jpg) center top repeat;
    background-size: 25px  auto;
}
.sccBnrLink .bnrTit{
    font-size: 24px;
    line-height: 2.33;
    letter-spacing: 7px;
}
.sccBnrLink  .linkBox1{
    max-width: 1800px;
    margin: 0 auto;
    margin-top: 74px;
}
.sccBnrLink  .linkBox1.contact{
    margin-top: 60px;
}
@media only screen and (max-width:767px){
    .sccBnrLink{
        background: #f6f8f7;
        padding-top: 69px;
        margin-top: 81px;
        text-align: center;
        padding-bottom: 80px;
    }
    .sccBnrLink .bnrTit{
        font-size: 15px;
        line-height: 2;
        letter-spacing: 0;
    }
    .sccBnrLink  .linkBox1{
        max-width: 670px;
        margin: 0 auto;
        margin-top: 24px;
    }
    .sccBnrLink  .linkBox1.contact{
        margin-top: 19px;
    }
}
#footer {
    position: relative;
    z-index: 3;
}
/* ▼260303追記 */
@media only screen and (min-width:768px){
    .secHeroTop{
        min-height: 100vh;
        height: auto;
    }
    .secHeroTop .Topimg{
        padding-bottom: 200px;
    }
    .secHero .secHeroTop01{
        min-height: 108.6vh;
        height: auto;
    }
    .secHero .bottomTxt{
        margin-top: 0;
        padding-top: 308px;
        padding-bottom: 250px;
    }
    @media only screen and (max-width:1480px){
        .secHero .txtbox01{
            padding-left: 0;
            flex: 1;
            text-align: right;
        }
    }
}
@media only screen and (max-width:767px){
    .secHeroTop .Topimg{
        max-width: 375px;
        margin: 0 auto;
    }
    .secConceptSpacer .performanceTit span::after,
    .secConceptSpacer .performanceTit span::before{
        top: calc(50% - 7px);
    }
}
@media only screen and (max-width:360px){
    .secHero .txtbox01{
        width: calc(100% - 20px);
        
    }
}