@charset "utf-8";

/*main start*/

#main .sec1_slider .swiper-slide.img1{background: url(../img/sub3/1/image1.jpg) no-repeat; background-size: cover; background-position: center; }
#main .sec1_slider .swiper-slide.img2{background: url(../img/sub3/1/image2.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img3{background: url(../img/sub3/1/image3.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img4{background: url(../img/sub3/1/image4.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img5{background: url(../img/sub3/1/image5.jpg) no-repeat; background-size: cover; background-position: center;}
#main .sec1_slider .swiper-slide.img6{background: url(../img/sub3/1/image6.jpg) no-repeat; background-size: cover; background-position: center;}

#fac { margin-top: 140px; }
#fac .fac-in { position: relative; }
#fac .fac-in::before { position: absolute; left: 0; bottom: 0; content: ""; width: 100%; height: 75%; background: #f8f8f8; z-index: -1;}
#fac .fac-in .fac-wrap { position: relative; display: flex; justify-content: space-between; align-items: end; }
#fac .fac-in .fac-wrap::before {  }
#fac .fac-in .fac-wrap .left {  width: 50%; padding: 140px 0; }
#fac .fac-in .fac-wrap .left h1 { font-family: 'Old Standard TT'; font-size: 47px; font-weight: 400; letter-spacing: 1; }
#fac .fac-in .fac-wrap .left p { margin-top: 40px; font-size: 12px; line-height: 25px; }
#fac .fac-in .fac-wrap .left p span { font-weight: 600; font-size: 13px; }
/* #fac .fac-in .fac-wrap .left .left-in { width: 50%; } */
#fac .fac-in .fac-wrap .right { width: 50%; text-align: center; }
#fac .fac-in .fac-wrap .left .right { display: none; }
/* #fac .fac-in .fac-wrap .left .left-in p { width: 50%; } */
#fac .fac-in .fac-wrap .right .imgbox { width: 100%; aspect-ratio: 4/3; background: url('../img/sub3/1/image4.jpg') no-repeat center/cover; }
#fac .fac-in .fac-wrap .right p { padding: 40px 0; font-family: 'Mulish'; font-size: 11px; letter-spacing: 4; opacity: .5; }
#fac .fac-in .fac-wrap .right p .br-480 { display: none; }

#banner3 { margin-top: 160px; }
#banner3 .banner3-in {text-align: center; }
#banner3 .title .title-in { text-align: center; }
#banner3 .title .title-in h1 { display: inline-block; width: auto; position: relative; font-family: 'Old Standard TT'; font-size: 47px; font-weight: 400; letter-spacing: 1; }
#banner3 .title .title-in h1::before { content: ''; position: absolute; top: -60px; left: 40%; width: 107px; height: 1px; background: #000000; }
#banner3 .title .title-in h1::after { content: ''; position: absolute; top: -55px; right: 40%; width: 107px; height: 1px; background: #000000; }
#banner3 p { margin-top: 60px; font-size: 12px; line-height: 25px; }

@media (max-width: 1305px) {

    
}

@media (max-width: 1280px) {
    #fac .fac-in .fac-wrap .left { padding: 80px 20px 80px 0; }
}

@media (max-width: 1024px) {
    #fac .fac-in::before { height: 90%; }
}
@media (max-width: 980px) {
    #fac { margin-top: 80px; }
    #fac .fac-in::before { height: 40%; }
    #fac .fac-in .fac-wrap { flex-direction: column; align-items: center; }
    #fac .fac-in .fac-wrap .left { width: 100%; padding: 0 0 40px 0;}
    #fac .fac-in .fac-wrap .right { width: 100%; }
    #fac .fac-in .fac-wrap .right .imgbox { aspect-ratio: 1.618/1; }

}

@media (max-width: 780px) {
    
	#main{height:50vh;}
	#main .sec1_slider { height: 100%; }
    .main-txt{display:none;}
    /* #fac { margin-top: 100px; }
    #fac .fac-in .fac-wrap .left { height: 583px; padding-top: 320px; }
    #fac .fac-in .fac-wrap .left h1 { font-size: 32px; }
    #fac .fac-in .fac-wrap .left p { margin-top: 20px; }
    #fac .fac-in .fac-wrap .right { bottom: 280px; right: 0px; width: 400px; text-align: right; }
    #fac .fac-in .fac-wrap .right img { width: 100%; }
    #fac .fac-in .fac-wrap .right p { margin-top: 20px; }
     */
    #banner3 { margin-top: 120px; }
    #banner3 .title .title-in h1 { font-size: 32px; }
    /* #banner3 .title .title-in h1::before { left: 170px; top: -45px; width: 70px; }
    #banner3 .title .title-in h1::after { right: 170px; top: -40px; width: 70px; } */
    #banner3 .title .title-in h1::before { top: -45px; width: 70px; }
    #banner3 .title .title-in h1::after { top: -40px; width: 70px; }
    #banner3 p { margin-top: 30px; }
}

@media (max-width: 480px) { 
    
    #fac { margin-top: 50px; }
    #fac .fac-in .fac-wrap { flex-flow: column; }
    #fac .fac-in .fac-wrap .left { height: auto; padding-top: 0px; padding-bottom: 40px; }
    #fac .fac-in .fac-wrap .left h1 { margin-top: 30px; font-size: 24px; }
    #fac .fac-in .fac-wrap .left p { font-size: 11px; line-height: 22px; }
    #fac .fac-in .fac-wrap .left p br { display: none; }
    #fac .fac-in .fac-wrap .left p br.br-480 { display: block; }
    #fac .fac-in .fac-wrap .left .right { position: static; display: block; width: 100%; }
    #fac .fac-in .fac-wrap .right p .br-480 { display: block; }

    /* #fac .fac-in .fac-wrap > .right { display: none;} */
    
    #banner3 { margin-top: 80px; }
    #banner3 .title .title-in h1 { font-size: 24px; }
    /* #banner3 .title .title-in h1 br { display: none; } */
    #banner3 .title .title-in h1::before { left: 40%; top: -25px; width: 50px; }
    #banner3 .title .title-in h1::after { right: 40%; top: -20px; width: 50px; }
    #banner3 p { font-size: 11px; line-height: 22px; }

}