/* video */
.top video{
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    z-index: -1;
    }


/* main visual */
#mainVisual{
    height: 100vh;
    z-index: 1;
    position: relative;
    }
#mainVisual .cntText{}
#title h2,
#title02 h2{
    font-feature-settings: "palt";
    font-size: 10.4rem;
    line-height: 1.0;
    }
#title .mv_ttl,
#title02 .mv_ttl{
    display: block;
    font-size: 4.4rem;
    font-weight: bold;
    }
#title {
    /*position: fixed;*/
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    transition: all 0.01s ease;
    z-index: 1000;
    opacity: 1;
    width: 96%;
    margin: auto;
    box-sizing: border-box;
    }
#title.static {
    position: static;
    transform: none;
    color: #111;
    opacity: 1;
    }
#title.static span{color:var(--c-main);}
/*.content1 {position: relative;}
.content2 {}*/

#title02{
    transform: none;
    color: #111;
    opacity: 1;
    width: 96%;
    margin: auto;
    }
#title02 span{color:var(--c-main);}
@media screen and (max-width: 1290px) {
    #title h2,#title02 h2{font-size: 8.4rem;}
    #title .mv_ttl,
    #title02 .mv_ttl{font-size: 3.4rem;}
    }
/* TAB */
@media screen and (max-width: 899px) {
    #title h2,#title02 h2{font-size: 5.4rem;}
    #title .mv_ttl,
    #title02 .mv_ttl{font-size: 2.4rem;}
    }
/* SP */
@media screen and (max-width: 480px) {
    #title h2,#title02 h2{font-size: 3.4rem;}
    #title .mv_ttl,#title02 .mv_ttl{font-size: 1.5rem;}
    }

/* greeting */
#_greeting{
    height: 1000px;
    color: #fff;
    position: relative;
    box-sizing: border-box;
    }
#_greeting .cntInner{
    max-width: 1280px;
    width: 96%;
    margin: 0 auto;
    }
#_greeting .cntInner .cntText{
    position: absolute;
    top: 20%;
    }
#_greeting .cntInner h3{
    font-size: 4.4rem;
    font-weight: bold;
    font-feature-settings: "palt";
    line-height: 2.0;
    }

/* TAB */
@media screen and (max-width: 899px) {
#_greeting{height: 600px;}
#_greeting .cntInner h3{
    font-size: 2.5rem;
    line-height: 2.5;
    }
}
/* SP */
@media screen and (max-width: 480px) {
#_greeting{height: 500px;}
#_greeting .cntInner h3{
    font-size: 2.0rem;
    line-height: 2.0;
    }
}

/* content2 */
#content2{
    min-height:980px;
    padding-top: 100px;
    background: url("../img/top/product.jpg")no-repeat bottom center ,#fff;
    background-size: cover;
    }

/* TAB */
@media screen and (max-width: 899px) {
    #content2{min-height:680px;padding-top: 50px;}
}
/* SP */
@media screen and (max-width: 480px) {
    #content2{min-height:400px;padding-top: 40px;}
}


/* mainBox
----------------------------------------------*/
#mainBox{background: #fff;}
#mainBox p{
    font-size: 1.8rem;
    line-height: 2.2;
    font-weight: normal;
    }

/* business */
#_business{
    padding: 120px 0 200px;
    background: #fff;
    position: relative;
    }
#_business::after{
    position: absolute;
    content: "";
    width: 55%;
    height: 60%;
    background: url("../img/top/business.jpg")no-repeat right bottom;
    bottom: 150px;
    right: 0;
    }
#_business .cntList{margin-top: 80px;}
#_business .cntBox{width: 45%}
/* TAB */
@media screen and (max-width: 899px) {
#mainBox p{
    font-size: 1.7rem;
    line-height: 1.8;
    }
    
#_business{padding: 60px 0 100px;}   
    
#_business::after{
    width: 50%;
    height: 50%;
    background: url("../img/top/business.jpg")no-repeat right bottom;
    background-size: cover;
    bottom: 100px;
    }  
#_business .cntList{margin-top: 40px;} 
    
}
/* SP */
@media screen and (max-width: 480px) {
#mainBox p{
    font-size: 1.5rem;
    line-height: 1.7;
    }
    
#_business{padding: 40px 0 240px;}  
    
#_business::after{
    width: 100%;
    height: 200px;
    background: url("../img/top/business.jpg")no-repeat right bottom;
    background-size: cover;
    bottom: 0;
    }
    
#_business .cntList{margin-top: 10px;} 
#_business .cntBox{width: 100%}    
    #_business .cntBox p br{display: none;}
    
}



/* _product */
#_product{
    padding: 180px 0 200px;
    background: url("../img/top/product_bg.jpg")no-repeat center;
    background-size: cover;
    color: #fff;
    }
#_product .cntList{margin-top: 30px;}
#_product .cntBox{width: 40%}
#_product .cntText{
    width: 60%;
    padding-top: 40px;
    }
#_slider{background: #fff;}
#_slider img{width: 100%;max-width: 100%;}
/* TAB */
@media screen and (max-width: 899px) {
#_product{padding: 100px 0;}
#_product .cntList{margin-top: 0;}
#_product .cntBox{width: 100%}
#_product .cntText{
    width: 100%;
    padding-top: 40px;
    } 
    #_product .cntText p br{display:none}
    
}
/* SP */
@media screen and (max-width: 480px) {
 #_product{padding: 50px 0;}   
}

/* factory */
#_factory{
    padding: 230px 0 200px;
    background: #fff;
    position: relative;
    }
#_factory::after{
    position: absolute;
    content: "";
    width: 40%;
    height: 65%;
    background: url("../img/top/factory.jpg")no-repeat left bottom;
    top: 180px;
    left: 0;
    }
#_factory .cntList{
    flex-direction: column-reverse;
    flex-direction: row-reverse;
    }
#_factory .cntBox{width: 55%;}

/* TAB */
@media screen and (max-width: 899px) {
#_factory{padding: 110px 0;}
#_factory::after{
    width: 40%;
    height: 65%;
    background: url("../img/top/factory.jpg")no-repeat left bottom;
    background-size: cover;
    top: 110px;
    }
}
/* SP */
@media screen and (max-width: 480px) {
#_factory{padding: 40px 0 240px;}
#_factory::after{
    width: 100%;
    height:200px;
    top: auto;
    bottom: 0;
    }
#_factory .cntBox{width: 100%;} 
}

/* company */
#_company{
    padding: 130px 0 100px;
    background: url("../img/top/company.jpg")no-repeat center right,#fff;
    background-size: contain;
    }
#_company .cntBox{width: 50%}
/* TAB */
@media screen and (max-width: 899px) {
#_company{
    padding: 100px 0 100px;
    background: url("../img/top/company.jpg")no-repeat center right,#fff;
    background-size: cover;
    }
#_company .cntBox{width: 70%}
}
/* SP */
@media screen and (max-width: 480px) {
#_company{padding: 50px 0;}
#_company .cntBox{width: 100%}      
}

/* concept */
#_concept{
    padding: 740px 0 200px;
    background:url("../img/top/concept_bg02.png")no-repeat center /100% ,url("../img/top/concept_bg01.png")no-repeat left bottom ,#fff;
    }
#_concept h3{
    font-size: 5.5rem;
    font-weight: 900;
    line-height: 1.4;
    }

@media screen and (max-width: 1290px) {
#_concept{padding: 600px 0 150px;}
#_concept h3{font-size: 4.0rem;}   
    
}
/* TAB */
@media screen and (max-width: 899px) {
#_concept{
    padding: 350px 0 80px;
    background:url("../img/top/concept_bg02.png")no-repeat center 10% /100% ,#fff;
    }
#_concept h3{font-size: 3.0rem;} 
    
}
/* SP */
@media screen and (max-width: 480px) {
#_concept{
    padding: 250px 0 30px;
    background:url("../img/top/concept_bg02.png")no-repeat center 5% /100% ,#fff;
    } 
#_concept h3{font-size: 2.3rem;}
 
}


/* recruitment */
#_recruitment{
    padding: 150px 0 0;
    background: var(--c-main);
    color: #fff;
    }
#_recruitment .cntBox{width: 40%;}
#_recruitment .cntText{width: 60%;padding-top: 40px;}

#_recruitment figure{margin-top: 100px;}
#_recruitment figure img{width: 100%;max-width: 100%;height: auto;}


/* TAB */
@media screen and (max-width: 899px) {
#_recruitment{padding: 70px 0 0;}
#_recruitment .cntBox{width: 100%;}
#_recruitment .cntText{width: 100%;}    
#_recruitment figure{margin-top: 70px;}   
    
}
/* SP */
@media screen and (max-width: 480px) {
#_recruitment{padding: 50px 0 0;}
#_recruitment .cntText{padding-top: 30px;}    
#_recruitment figure{margin-top: 40px;}    
    
    
}