@charset "utf-8";

/* mVisual */
#mVisual{width: 100%; height: 100vh; position: relative; filter: brightness(1.05)}
#mVisual > .visual{height: 100%; position: relative;}
#mVisual > .visual::after{content: ''; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(to bottom,rgba(0,0,0,0.27), transparent, transparent, transparent, transparent); position: absolute;}
#mVisual > .visual > div{height: 100%;}
#mVisual > .visual > div > div{height: 100%;}
#mVisual .mv{height: 100%; width: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; position: relative; overflow: hidden;}
/*
#mVisual .mv.mv1{background-image: url(/images/main/mv1.png);}
#mVisual .mv.mv2{background-image: url(/images/main/mv1.png);}
#mVisual .mv.mv3{background-image: url(/images/main/mv1.png);}
*/
#mVisual .mv.mv1{}
#mVisual .mv.mv1 video{position: absolute; min-height: 100%; min-width: 100%; width: auto; height: auto; left: 50%; top: 50%; transform: translate(-50%, -50%)}
#mVisual .text{display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
#mVisual .text .txt p{font-size: var(--fz24); /*margin-bottom: 15px;*/}
#mVisual .text .txt p span{letter-spacing: 0.3em;}
#mVisual .text .txt h3{font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: var(--fz36); text-align: center;}
#mVisual .text .txt h3 span{font-weight: 700;}
#mVisual .text .scroll{position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);text-align: center; overflow: hidden;}
#mVisual .text .scroll p{font-size: var(--fz13); margin-top: 5px;}
#mVisual .text .dots_box{margin-top: 45px;}
#mVisual .text .dots_box .dots{margin: 0 5px; cursor: pointer;}
#mVisual .text .dots_box .dots img{max-width: 110px; filter: grayscale(1);}
#mVisual .text .dots_box .dots.slick-current img{filter: grayscale(0);}

@media all and (max-width:976px){
    #mVisual .text .dots_box{margin-top: 30px;}
    #mVisual .text .dots_box .dots img{max-width: 90px;}
}
@media all and (max-width:640px){
    #mVisual .text .dots_box .dots img{max-width: 80px;}
}


/* sec1 */
.sec1{padding: 120px 0;}
.sec1 .inner{}
.sec1 .inner .box{display: flex; flex-direction: row;}
.sec1 .inner .box:nth-child(even){flex-direction: row-reverse;}
.sec1 .inner .box:not(:last-child){padding-bottom: 120px;}
.sec1 .inner .box.box1{}
.sec1 .inner .box.box2{}
.sec1 .inner .box.box3{}
.sec1 .inner .box .img{width: 50%; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.sec1 .inner .box.box1 .img{background-image: url(/images/main/sec1_img1_230713.png);}
.sec1 .inner .box.box2 .img{background-image: url(/images/main/sec1_img2_230704.png);}
.sec1 .inner .box.box3 .img{background-image: url(/images/main/sec1_img3_230705.png);}
.sec1 .inner .box.box4 .img{background-image: url(/images/main/sec1_img4.png);}
.sec1 .inner .box .text{padding-left: 80px; width: 50%; padding-top: 70px; padding-bottom: 70px;}
.sec1 .inner .box:nth-child(even) .text{padding-left: 0; padding-right: 80px;}
.sec1 .inner .box .text .txt{}
.sec1 .inner .box .text .txt h3{font-size: var(--fz32); font-weight: 500; color: #777777;}
.sec1 .inner .box .text .txt h3 span{color: #000000; font-weight: 700;}
.sec1 .inner .box .text .txt p{font-size: var(--fz16); color: #666666; margin-top: 40px; line-height: 1.8em; word-break: keep-all;}
.sec1 .inner .box .text .txt p span{color: indianred; font-weight: 500;}
.sec1 .inner .box .text .scroll{margin-top: 240px;}
.sec1 .inner .box .text .scroll img{}

@media all and (max-width:1280px){
    .sec1{padding: 90px 0;}
    .sec1 .inner .box .text{padding-left: 50px; padding-top: 50px; padding-bottom: 50px;}
    .sec1 .inner .box:not(:last-child){padding-bottom: 90px;}
    .sec1 .inner .box:nth-child(even) .text{padding-right: 50px;}
    .sec1 .inner .box .text .txt h3{font-size: var(--fz30);}
    .sec1 .inner .box .text .txt p{margin-top: 30px;}
    .sec1 .inner .box .text .txt p br{display: none;}
    .sec1 .inner .box .text .scroll{margin-top: 120px;}
}
@media all and (max-width:976px){
    .sec1 .inner .box .text .txt h3{font-size: var(--fz24);}
    .sec1 .inner .box .text .scroll{margin-top: 90px;}
    .sec1 .inner .box:not(:last-child){padding-bottom: 70px;}
     .sec1 .inner .box .text{padding-left: 30px; padding-top: 30px; padding-bottom: 30px;}
    .sec1 .inner .box:nth-child(even) .text{padding-right: 30px;}
}
@media all and (max-width:640px){
    .sec1{padding: 70px 0 50px;}
    .sec1 .inner .box{flex-direction: column;}
    .sec1 .inner .box:not(:last-child){padding-bottom: 30px;}
    .sec1 .inner .box:nth-child(even){flex-direction: column;}
    .sec1 .inner .box .img{width: 100%; height: 60vw; object-fit: -1 !important;}
    .sec1 .inner .box .text {width: 100%; padding-left: 0; padding-right: 0 !important;}
    .sec1 .inner .box .text .scroll{display: none;}
}


/* sec2 */
.sec2{background: url(/images/main/sec2_bg_230704.png) no-repeat center center / cover; height: 644px;}
.sec2 p{height: 100%; text-align: center;color: #fff; display: flex; justify-content: center; align-items: center; font-size: var(--fz24); letter-spacing: 0.7em;}
.sec2 p b{}

@media all and (max-width:976px){
    .sec2{height: 60vw;}
}
@media all and (max-width:640px){
    .sec2 p{font-size: var(--fz18); letter-spacing: 0.4em;}
}