@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;}


#history{position: relative; z-index: 2; background: #fff; padding: 140px 0 260px 0;}
#history .list{padding-left: 155px; box-sizing: border-box; position: relative;}
#history .list::before{content: ''; display: block; width: 1px; height: calc(100% - 88px); position: absolute; left: 72px; top: 50px; background: #3f3939;}
#history .item{margin-bottom: 90px; position: relative;}
#history .item::before{content: ''; display: block; width: 32px; height: 32px; background: rgba(0,0,0, .2); position: absolute; left: -99px; top: calc(50% - 16px); border-radius: 50%;}
#history .item::after{content: ''; display: block; width: 16px; height: 16px; background: #3f3939; position: absolute; left: -91px; top: calc(50% - 8px); border-radius: 50%;}
#history dl{display: inline-block; background: #eeefef; padding: 40px 180px 15px 38px; position: relative;}
#history dl>dt{position: absolute; right: 0; top: -34px; color: #3f3a39; font-size: 6rem; font-weight: bold;}
#history dl>dd{color: #3e3a39; line-height: 2; font-size: 2rem; font-weight: 300;}
#history .item:last-child::before{top: calc(50% - 4px);}
#history .item:last-child::after{top: calc(50% + 4px);}
#history .item:last-child dl{background: #fff; padding-left: 0;}
#history .item:last-child dd{font-weight: bold; font-size: 2.6rem;}


/*---1440---*/
@media (max-width:1679px){
  #history dl>dt{font-size: 5.6rem;}
  #history dl>dd{font-size: 1.8rem;}
}
/*---1366---*/
@media (max-width:1439px){
  #path{font-size: 1.6rem;}

  #history dl>dt{font-size: 5.2rem;}
  #history dl>dd{font-size: 1.7rem;}
}
/*---1280---*/
@media (max-width:1365px){
  #path{font-size: 1.5rem;}

  #history dl>dt{font-size: 5rem;}
  #history dl>dd{font-size: 1.6rem;}
}
/*---MP---*/
@media (max-width:1279px){
  #path{font-size: 1.5rem; padding: 50px 15px;}

  #history{padding: 40px 0 80px 0;}
  #history .list{padding-left: 55px;}
  #history .list::before{height: calc(100% - 88px); left: 25px; top: 50px;}
  #history .item{margin-bottom: 60px; position: relative; padding-right: 15px;}
  #history .item::before{width: 26px; height: 26px; left: -42px; top: calc(50% - 16px); border-radius: 50%;}
  #history .item::after{width: 12px; height: 12px; left: -35px; top: calc(50% - 8px); border-radius: 50%;}
  #history dl{display: block; padding: 35px 20px 20px 20px; position: relative;}
  #history dl>dt{top: -20px; font-size: 3.6rem; right: unset; left: 22px;}
  #history dl>dd{color: #3e3a39; line-height: 2; font-size: 1.5rem;}
  #history .item:last-child::before{top: calc(50% - 4px);}
  #history .item:last-child::after{top: calc(50% + 4px);}
  #history .item:last-child dl{margin-top: -36px;}
  #history .item:last-child dd{font-size: 2.2rem;}
}