@charset "utf-8";


/*
html,body{overflow:hidden;}
*/
body{}
#wrap{padding:0;}
body #contents{padding:0;}
.header .bottom-in{display:none;}
body #footer{margin-top:0;}
body #section2{margin-top:0;}



body#main #header{background:transparent;}
body#main #header>.in{max-width:1400px;}





.mainVisual-v{position:relative;  min-height:100vh; overflow:hidden; background-image:url('/imgs/main/bg-c1.jpg'); background-position:center; background-size:cover;}
/* .mainVisual-v:after{position:absolute; top:0; left:0; width:100%; height:100%; background:#000; content:""; opacity:0.3; z-index:11;} */
.mainVisual-v .bg-img{}
.mainVisual-v .bg-img img{position:relative; left:-50%; border-radius:50%; border:10px solid #111; }
.mainVisual-v .item{}
.mainVisual-v .in-center{position:relative; z-index:11; box-sizing:border-box; padding:100px 15px 0 15px;}
.mainVisual-v .in-center .txt{color:var(--c1);}
.mainVisual-v .in-center .txt h3{font-size:20px; letter-spacing:10px; margin-bottom:5px;}
.mainVisual-v .in-center .txt h2{font-size:30px; margin-bottom:20px; line-height:1.2;}
.mainVisual-v .in-center .txt p{font-size:16px; color:#fff;}
.mainVisual-v button.login{position:fixed; bottom:30px; left:50%; font-size:15px; font-weight:bold; transform:translateX(-50%); background:var(--c1); color:#111; border-radius:50px; padding:15px 25px; box-sizing:border-box; transition:0.3s; z-index:22;}
.mainVisual-v button.login:hover{background:var(--c1);}

.mainVisual-v .swiper-wrap{position:relative; transition:0.2s;}
.mainVisual-v .swiper-wrap:after{position:absolute; top:-340px; left:125px; width:1000px; height:1000px; box-sizing:border-box; border:2px solid #fff; opacity:0.2; content:""; border-radius:50%;}
.mainVisual-v .swiper{position:relative; top:-100px; width:700px;  padding-left:80px; height:450px;  box-sizing:border-box;  overflow:hidden;}
.mainVisual-v .swiper-container{height:100%;}
.mainVisual-v .swiper-container .item{height:150px; display:flex; align-items:center; box-sizing:border-box; border-radius:150px; transition:0.3s;}
.mainVisual-v .swiper-container .item .img{height:150px; width:150px;}
.mainVisual-v .swiper-container .item .img img{height:100%; width:auto;}
.mainVisual-v .swiper-container .item .txt{width:calc(100% - 150px); box-sizing:border-box; padding-left:15px; opacity:0; transition:0.3s;}
.mainVisual-v .swiper-container .item .txt h2{font-size:15px; margin-bottom:5px;}
.mainVisual-v .swiper-container .item .txt p{font-size:13px; margin-bottom:5px;}
.mainVisual-v .swiper-container .item .txt span{font-size:15px;}
.mainVisual-v .swiper-container .item.swiper-slide-active{background:var(--c1); }
.mainVisual-v .swiper-container .item.swiper-slide-active .txt{opacity:1;}
.mainVisual-v .swiper-container .item.swiper-slide-next{margin-left:-30px;}


@media all and (min-width:768px){
  .mainVisual-v{height:calc(100vh); box-sizing:border-box; padding:0 20px;}
  .mainVisual-v .bg-img{position:absolute; margin-left:-10px; box-sizing:border-box; padding:0 30px; top:50%; left:0; width:100%;  transform:translateY(-50%); text-align:center; z-index:10;}
  .mainVisual-v .bg-img img{left:0; border-width:30px;}
  .mainVisual-v .in-center{ padding:0; display:flex; height:calc(100vh); align-items:center; max-width:1400px; margin:0 auto;}
  .mainVisual-v .in-center .txt h3{font-size:25px; margin-bottom:20px; letter-spacing:24px;}
  .mainVisual-v .in-center .txt h2{font-size:50px; margin-bottom:40px;}
  .mainVisual-v .in-center .txt p{font-size:16px; }

  .mainVisual-v button.login{font-size:20px; padding:15px 35px; bottom:100px;}

  .mainVisual-v .swiper-wrap{position:absolute; top:70%; transform:translateY(-50%); left:45%; width:650px; z-index:11;}

}


@media all and (min-width:1100px){
    .mainVisual-v .swiper-wrap{top:50%; left:65%; }

    .mainVisual-v .swiper-wrap:after{top:-380px; width:1500px; height:1500px;}
    .mainVisual-v .swiper{top:0; height:720px;}
    .mainVisual-v .swiper-container .item{height:220px;}
    .mainVisual-v .swiper-container .item .img{height:220px; width:220px;}
    .mainVisual-v .swiper-container .item .txt{width:calc(100% - 220px); padding-left:25px;}
    .mainVisual-v .swiper-container .item .txt h2{font-size:30px;}
    .mainVisual-v .swiper-container .item .txt p{font-size:18px; margin-bottom:15px;}
    .mainVisual-v .swiper-container .item .txt span{font-size:22px;}
    .mainVisual-v .swiper-container .item.swiper-slide-next{margin-left:-60px;}
}





#main-login{ position:fixed; top:0; left:0; width:100%; height:100vh;display:none;align-items:center; justify-content:center; text-align:center; background:#111; box-sizing:border-box; padding:50px 15px; z-index:100;}
#main-login.on{display:flex; animation:fadeIn 1s;}
#main-login form{width:100%;}
#main-login fieldset{width:100%;}
#main-login h1{width:200px; margin:0 auto; margin-bottom:40px; }
#main-login #ol_id,
#main-login #ol_pw{background:#333; border-radius:7px; margin-top:10px; border:0; height:45px; color:#fff;}

#main-login #ol_submit{margin-top:30px;   border:0; border-radius:50px; cursor:pointer; height:45px; background:var(--c1); transition:0.3s;}
#main-login #ol_submit:hover{background:var(--c1);}
#main-login #ol_svc_{margin-top:5px; }
#main-login #ol_svc_ a{color:#ccc;}



@media all and (min-width:768px){
  #main-login{background:rgba(0,0,0,0.8);}
  #main-login h1{width:auto;}
  #main-login form{width:500px; background:#111; border-radius:50px; padding:90px 70px; box-sizing:border-box; }
  #main-login #ol_id,
  #main-login #ol_pw{margin-top:15px;}
  #main-login #ol_submit{margin-top:50px;}


}






























/**/