@charset "utf-8";

#banner{width: 100%; height: 0; padding-bottom: 33.0729%; position: fixed; z-index: 1; left: 0; top: 0; background: #111;}
#banner>div{width: 100%; height: 100%; background: no-repeat center/cover; position: absolute; top: 0; z-index: 1;}
#banner .wrap{position: absolute; z-index: 2; left: 0; right: 0; margin: auto;}
#banner .con{position: relative; top: 55%; text-align: right;}
#banner .t1{margin: 0 22% 0 0;}
#banner .t2{margin: 15px 0 0 0;}

/*---1440---*/
@media (max-width:1679px){

}
/*---1366---*/
@media (max-width:1439px){

}
/*---1280---*/
@media (max-width:1365px){

}
/*---MP---*/
@media (max-width:1279px){
  #banner{padding-bottom: 0; height: 80%;}
}


#space{height:0; padding-bottom: 33.0729%;}
/*---MP---*/
@media (max-width:1279px){
  #space{height: 80%; padding-bottom: 0;}
  #banner .con{top: 51%; text-align: center; transform: scale(.9);}
  #banner .t1, #banner .t2{margin: auto;}
  #banner .t2{margin-top: 15px;}
}


#path{position: relative; z-index: 2; background: #fff; color: #3e3a39; font-size: 1.7rem; padding: 60px 0 0 0;}
#path a{color: #3e3a39;}
#path a:hover{color: #666;}


#m1{position: relative; z-index: 2; background: #fff; padding: 130px 0 140px 0;}
#m1 .tit{font-size: 3.6rem; font-weight: bold; color: #3e3a39;}
#m1 .tit-en{font-size: 3rem; margin-top: 16px; font-weight: 300;}
#m1 .con{padding-left: 123px; box-sizing: border-box; position: relative; margin-top: 40px; color: #3e3a39; font-size: 1.8rem; display: flex; flex-wrap: wrap;}
#m1 .con::before{content: ''; display: block; width: 93px; height: 2px; background: #1b1b1b; position: absolute; left: 0; top: 21px;}
#m1 .con dl{min-width: 50%; margin-bottom: 70px;}
#m1 .con dt{font-size: 3rem; line-height: 2;}
#m1 .con dd{font-size: 2rem;}
#m1 .con dd p{line-height: 2;}


#m2{height: 100%; position: relative; z-index: 2; background: #191919 url('../img/culture.m2.jpg') no-repeat center/cover;}
#m2 .wrap{position: relative; top: 21.5%; color: #fff;}
#m2 .tit{font-size: 3.6rem; font-weight: bold;}
#m2 .tit-en{font-size: 3rem; margin-top: 16px; font-weight: 300;}
#m2 .con{margin-top: 108px; box-sizing: border-box; position: relative; color: #fff;}
#m2 .con::before{content: ''; display: block; width: 93px; height: 2px; background: #fff; position: absolute; left: 0; top: -58px;}
#m2 .con h2{font-size: 3rem;}
#m2 .con p{font-size: 2rem; line-height: 2.4; margin-top: 46px;}


#m3{height: 100%; position: relative; z-index: 2; background: #191919 url('../img/culture.m3.jpg') no-repeat center/cover;}
#m3 .wrap{text-align: right; position: relative; top: 25%;}
#m3 .tit{font-size: 3rem; font-weight: bold; color: #fff;}
#m3 .con{font-size: 2rem; color: #fff; line-height: 2.4; margin-top: 60px;}


/*---1440---*/
@media (max-width:1679px){
  #m1 .con dt{font-size: 2.9rem;}
  #m1 .con p{font-size: 1.9rem;}

  #m2 .con{font-size: 1.7rem;}
  #m2 .con p{font-size: 1.9rem;}

  #m3 .con{font-size: 1.9rem;}
}
/*---1366---*/
@media (max-width:1439px){
  #path{font-size: 1.6rem;}

  #m2 .wrap{padding-top: 0; top: 16%;}
  #m2 .con p{font-size: 1.8rem;}

  #m3 .con{font-size: 1.8rem;}
}
/*---1280---*/
@media (max-width:1365px){
  #path{font-size: 1.5rem;}

  #m1{padding: 100px 0 110px 0;}
  #m1 .con dt{font-size: 2.6rem;}
  #m1 .con p{font-size: 1.7rem;}

  #m2 .wrap{padding-top: 0; top: 15.5%;}
  #m2 .con dt{font-size: 1.5rem;}
  #m2 .con p{font-size: 1.7rem;}

  #m3{padding: 120px 0 140px 0;}
  #m3 .con{font-size: 1.7rem;}
}
/*---MP---*/
@media (max-width:1279px){
  #path{font-size: 1.5rem; padding: 50px 15px;}

  #m1{padding: 0 15px 60px 15px;}
  #m1 .tit{font-size: 3rem;}
  #m1 .tit-en{font-size: 2.4rem;}
  #m1 .con{width: 100%; padding-left: 83px;}
  #m1 .con::before{width: 63px; top: 15px;}
  #m1 .con dl{width: 100%; margin-bottom: 50px;}
  #m1 .con dt{font-size: 2rem;}
  #m1 .con dd p{font-size: 1.6rem;}

  #m2{height: auto; padding: 70px 0 90px 0;}
  #m2 .wrap{padding: 0 15px; top: 0;}
  #m2 .tit{font-size: 3rem;}
  #m2 .tit-en{font-size: 2.4rem;}
  #m3 .con::before{width: 63px;}
  #m3 .con{font-size: 1.6rem; padding: 0 15px;}

  #m3{height: auto;}
  #m3 .wrap{top: 0; padding: 0 15px;}
  #m3 .wrap .tit{font-size: 3rem;}
  #m3 .wrap .tit-en{font-size: 2.4rem;}
  #m4 .con{width: 100%; padding-right: 83px; float: none; font-size: 1.6rem;}
  #m4 .con::before{width: 63px;}
}