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

/*---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 70px 0;}
#path a{color: #3e3a39;}
#path a:hover{color: #666;}


#m1{position: relative; z-index: 2; background: #fff; padding-top: 30px; padding-bottom: 70px;}
#m1>.wrap>.tit{font-size: 3.6rem; color: #3e3a39; font-weight: bold;}
#m1>.wrap>.tit-en{font-size: 3rem; color: #3e3a39; font-weight: 300; margin-top: 10px;}
#m1 .line{width: 93px; height: 2px; background: #1b1b1b; margin: 60px 0;}
#m1 .con{display: flex; justify-content: space-between; flex-wrap: wrap;}
#m1 .con .item{width: calc((100% - 110px)/2); display: flex; justify-content: space-between; margin-bottom: 40px;}
#m1 .con .item .ico{width: 64px; height: 64px;}
#m1 .con .item .box{width: calc(100% - 90px); color: #3e3a39; padding-top: 8px;}
#m1 .con .item .box .title{font-size: 3rem;}
#m1 .con .item .box .desc{font-weight: 300; font-size: 1.9rem; line-height: 1.6; margin-top: 15px;}


#support{position: relative; z-index: 2; background: #191919 url('../img/join.support.jpg') no-repeat center/cover; height: 100%;}
#support .tit{font-size: 3.6rem; color: #fff; font-weight: bold; padding-top: 16%;}
#support .tit-en{font-size: 3rem; color: #fff; font-weight: 300; margin-top: 10px;}
#support .line{width: 93px; height: 2px; background: #fff; margin: 60px 0;}
#support dl{margin-bottom: 20px;}
#support dt, #support dd{display: inline-block; color: #fff; font-size: 2rem; line-height: 1.4;}
#support dt{font-weight: bold;}
#support dd{font-weight: 300;}


#process{position: relative; z-index: 2; background: #fff; padding: 120px 0 150px 0;}
#process .tit{font-size: 3.6rem; color: #3e3a39; font-weight: bold;}
#process .tit-en{font-size: 3rem; color: #3e3a39; font-weight: 300; margin-top: 10px;}
#process .line{width: 93px; height: 2px; background: #1b1b1b; margin: 60px 0;}
#process .con{color: #3e3a39;}
#process dl{margin-bottom: 60px;}
#process dt{font-size: 3.2rem;}
#process dd{font-size: 1.8rem; margin-top: 30px; padding-left: 3px;}
#process dd p{margin-left: -3px; margin-top: -8px; line-height: 2.1;}
#process dd ul{padding-left: 16px;}
#process dd ul>li{list-style: disc; margin-bottom: 20px;}
#process a{color: #3e3a39;}
#process a:hover{text-decoration: underline;}


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

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

  #m1{padding-top: 20px;}
  #m1>.wrap>.tit{font-size: 3.4rem;}
  #m1>.wrap>.tit-en{font-size: 2.8rem;}
  #m1 .line{width: 91px; margin: 56px 0;}
  #m1 .con .item{margin-bottom: 38px;}
  #m1 .con .item .box .title{font-size: 2.8rem;}
  #m1 .con .item .box .desc{font-size: 1.8rem;}

  #support>.wrap>.tit{font-size: 3.4rem;}
  #support>.wrap>.tit-en{font-size: 2.8rem;}
  #support .line{width: 91px; margin: 56px 0;}
  #support dt, #support dd{font-size: 1.9rem;}

  #process{padding: 110px 0 140px 0;}
  #process .tit{font-size: 3.4rem;}
  #process .tit-en{font-size: 2.8rem;}
  #process .line{width: 91px; margin: 56px 0;}
  #process dl{margin-bottom: 56px;}
  #process dt{font-size: 3rem;}
  #process dd{font-size: 1.7rem;}
}
/*---1280---*/
@media (max-width:1365px){
  #path{font-size: 1.5rem;}

  #m1{padding-top: 10px;}
  #m1>.wrap>.tit{font-size: 3.2rem;}
  #m1>.wrap>.tit-en{font-size: 2.6rem;}
  #m1 .line{width: 90px; margin: 56px 0;}
  #m1 .con .item{margin-bottom: 38px;}
  #m1 .con .item .box .title{font-size: 2.6rem;}
  #m1 .con .item .box .desc{font-size: 1.7rem;}

  #support>.wrap>.tit{font-size: 3.2rem; padding-top: 15%;}
  #support>.wrap>.tit-en{font-size: 2.6rem;}
  #support .line{width: 90px; margin: 56px 0;}
  #support dt, #support dd{font-size: 1.8rem;}

  #process{padding: 100px 0 130px 0;}
  #process .tit{font-size: 3.2rem;}
  #process .tit-en{font-size: 2.6rem;}
  #process .line{width: 90px; margin: 56px 0;}
  #process dl{margin-bottom: 56px;}
  #process dt{font-size: 2.8rem;}
  #process dd{font-size: 1.6rem;}
}
/*---MP---*/
@media (max-width:1279px){
  #path{font-size: 1.5rem; padding: 50px 15px;}

  #m1{padding: 0 15px 60px 15px;}
  #m1>.wrap>.tit{font-size: 3rem;}
  #m1>.wrap>.tit-en{font-size: 1.8rem;}
  #m1 .line{width: 80px; margin: 50px 0;}
  #m1 .con{display: block;}
  #m1 .con .item{width: 100%; margin-bottom: 40px;}
  #m1 .con .item .ico{width: 48px; height: 48px;}
  #m1 .con .item .box{width: calc(100% - 60px); color: #3e3a39; padding-top: 8px;}
  #m1 .con .item .box .title{font-size: 2.2rem;}
  #m1 .con .item .box .desc{font-size: 1.6rem;}

  #support{height: auto; padding: 50px 15px 60px 15px;}
  #support .tit{font-size: 3rem; padding-top: 0;}
  #support .tit-en{font-size: 1.8rem;}
  #support .line{width: 80px; margin: 50px 0;}
  #support dl{margin-bottom: 40px;}
  #support dt, #support dd{display: block;}
  #support dt{font-size: 2.2rem;}
  #support dd{font-size: 1.6rem; margin-top: 10px; line-height: 1.6;}

  #process{padding: 50px 15px 80px 15px;}
  #process .tit{font-size: 3.2rem;}
  #process .tit-en{font-size: 1.8rem;}
  #process .line{width: 80px; margin: 50px 0;}
  #process dl{margin-bottom: 50px;}
  #process dt{font-size: 2.2rem;}
  #process dd{font-size: 1.6rem; margin-top: 20px;}
  #process dd p{margin-left: -3px; margin-top: -8px; line-height: 2.1;}
  #process dd ul{padding-left: 16px;}
  #process dd ul>li{list-style: disc; margin-bottom: 20px; line-height: 1.5;}
  #process a{color: #3e3a39; font-size: 1.7rem;}
  #process a:hover{text-decoration: underline;}
}