@charset "utf-8";
/* CSS Document */

/* b-main ----------*/
.b-main .b-img{
  background-image:url(../about/image/main.jpg);
}

/* sec-msg ----------*/
.sec-msg{
  position: relative;
  overflow-x:hidden;
  min-height:570px;
  padding-bottom:0;
  margin-bottom:100px;
}
.sec-msg .b-txt{
  width:600px;
  padding-top:30px;
  padding-right:75px;
  z-index: 1;
}
.sec-msg .b-img{
  position: absolute;
  top:0;
  z-index: 0;
  background:url(../about/image/msg.png) top left no-repeat;
  width:50%;
  height:570px;
}
@media screen and (min-width: 1201px) {
  .sec-msg .b-img{
    right:0;
  }
}
@media screen and (max-width: 1200px) {
  .sec-msg .b-img{
    left:600px;
  }
}
@media screen and (max-width: 767px) {
  .sec-msg .b-txt{
    width:100%;
    padding-right:0;
  }
  .sec-msg .b-img{
    position: static;
    width:90%;
    height:70vw;
    margin:5vw 5% 0;
    background-size:contain;
  }
  .sec-msg .e-txt p+p{
    margin-top:.8em;
  }
}
@media screen and (max-width: 600px) {
  .sec-msg{
    margin-bottom:10vw;
  }
  .sec-msg .b-txt{
    padding:5vw 0 0 0;
  }
  .sec-msg .b-img{
    position: static;
    width:90%;
    height:70vw;
    margin:5vw 5% 0;
    background-size:contain;
  }
}


/* sec-over ----------*/
.sec-over{
  background:#fff;
}
.sec-over .container{
  display: flex;
  justify-content: space-between;
  align-items:flex-start;
}
.sec-over .b-ttl{
  width:270px;
  min-width:270px;
  margin-left:0;
}
.sec-over .b-tbl,
.sec-over table{
  width:100%;
}
.sec-over table{
  animation-delay: .2s;
}
.sec-over th{
  min-width:170px;
}
@media screen and (max-width: 767px){
  .sec-over .container{
    display: block;
  }
}
@media screen and (max-width: 600px){
  .sec-over th{
    min-width:25vw;
  }
}

/* sec-gree ----------*/
.sec-gree .container{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-direction: row-reverse;
}
.sec-gree .container > .b-txt{
  padding-top:40px;
  padding-left:7%;
}
.sec-gree .b-img{
  width:40%;
  min-width:40%;
  max-width:450px;
}
.sec-gree .b-img figcaption{
  margin-top:15px;
}
.sec-gree .b-img .e-name{
  display: flex;
  align-items: center;
  font-size:2rem;
  line-height:1;
}
.sec-gree .b-img .e-name span{
  font-size:1.5rem;
}
.sec-gree .b-img figcaption p{
  line-height:1.5;
  margin-top:10px;
}
/*
@media screen and (max-width: 767px){
  .sec-gree .b-ttlWrap{
    display: flex;
    align-items: flex-start;
  }
  .sec-gree .container > .b-txt{
    width:100%;
    padding-top:0;
    padding-left:0;
  }
  .sec-gree .b-img figcaption{
    margin-top:0;
  }
  .sec-gree .b-txt p{
    margin-top:30px;
  }
}
*/
@media screen and (max-width: 767px){
  .sec-gree .b-ttlWrap{
    display:block;
  }
  .sec-gree .container > .b-txt{
    width:100%;
    padding-top:0;
    padding-left:0;
  }
  .sec-gree .b-ttlWrap .b-img{
    width:80%;
    margin: 3vw auto 5vw;
  }
  .sec-gree .b-ttlWrap .b-img figcaption{
   text-align: center;
  }
  .sec-gree .b-img .e-name{
    justify-content: center;
  }
  .sec-gree .b-txt p{
    margin-top:1em;
  }
}
@media screen and (max-width: 600px){
  .sec-gree .b-ttlWrap .b-img figcaption{
   text-align: center;
  }
  .sec-gree .b-img .e-name{
    justify-content: center;
    font-size:4vw;
  }
  .sec-gree .b-img .e-name span{
    font-size:3.3vw;
  }
  .sec-gree .b-img figcaption p{
    font-size:3.0vw;
  }
}

/* sec-movie ----------*/
.b-nml{
  padding-top:0;
}
@media screen and (min-width: 601px){
  .b-nml{
    padding-bottom:120px;
  }
}
.b-nml .container{
  position: relative;
  height: 400px;
}
.b-nml .b-txt,
.b-nml .b-img{
  position: absolute;
}
.b-nml .b-txt{
  width:600px;
  z-index: 1;
  top:50%;
  transform: translateY(-50%) !important;
  background:rgba(255,255,255,.9);
  padding:70px 75px;
}
/* b-img */
.b-nml .b-img{
  width:800px;
  height:100%;
  background-size:cover;
  background-position: center center;
  top:0;
}

@media screen and (max-width: 1000px){
  .b-nml .b-txt{
    width:80%;
    left:50%;
    right:auto;
    transform: translate(-50%, -50%) !important;
    text-align: center;
  }
  .b-nml .b-img{
    width:100%;
  }
}
@media screen and (max-width: 767px){
  .b-nml .b-txt{
    padding:70px 5vw;
  }
}
@media screen and (max-width: 600px){
  .b-nml .b-txt{
    padding:8vw 5vw;
  }
  .b-nml .b-txt .b-ttl{
    margin-bottom:0;
  }
  .b-nml .container{
    height:60vw;
  }
}
/* sec-movie */
.sec-movie .b-txt{
  right:0;
}
.sec-movie .b-ttl{
  margin-bottom:0;
  font-feature-settings: "palt";
  line-height:1.5;
}
.sec-movie .b-img{
  overflow: hidden;
}
.sec-movie .b-img .b-inner{
  cursor:pointer
}
.sec-movie .b-img .b-inner img{
  transition: .4s;
}
.sec-movie .b-img:hover .b-inner img{
  transform: scale(1.1,1.1);
}
.sec-movie .b-img .b-inner::after{
  content:"";
  display: block;
  pointer-events: none;
  background:url(../image/common/ic-mv.png) center center / contain no-repeat;
  position: absolute;
  left:50%;
  top:50%;
  z-index: 1;
  transform: translate(-50%,-50%);
  width:100px;
  height:100px;
}
@media screen and (max-width: 1000px){
  .sec-movie .b-txt{
  }
  .sec-movie .b-txt{
    pointer-events: none;
    background:none;
    padding:0;
  }
  .sec-movie .b-ttl,
  .sec-movie .b-ttl span{
    color:#fff;
  }
  .sec-movie .b-ttl{
    transform:translate(0, -85%);
  }
  .sec-movie .b-img .b-inner::after{
    transform: translate(-50% , 15%);
  }
  .sec-movie .b-img{
    background-image:url(../image/index/movie.jpg);
  }
  .sec-movie .b-img .b-inner{
    height:400px;
  }
  .sec-movie .b-img .b-inner >img{
    display: none;
  }
}
@media screen and (min-width: 768px) and (max-width: 1000px){
  .sec-movie .b-ttl br{
    display: none
  }
}
@media screen and (max-width: 767px){
  .sec-movie .b-ttl{
    transform:translate( 0 , -40%);
  }
  .sec-movie .b-img .b-inner::after{
    width:80px;
    height:80px;
    transform: translate(-50% , 40%);
  }
}
@media screen and (max-width: 767px){
  .sec-movie .b-img .b-inner::after{
    width:12vw;
    height:12vw;
  }
}

/* movie */
#movie-area{
  width:800px;
  height:450px;
  position: relative;
}
#movie-area iframe{
  width:100%;
  height:100%;
}
@media screen and (max-width: 900px){
  #movie-area{
    height:45vw;
  }
}