.system_con {
  padding-top: 10vw;
}

.system_title {
  padding-bottom: 5vw;
}

.system_content {
  background-image: url(../../sub/website/mo/system/bg.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
  height: 350vw;
  position: relative;
  /* display: none; */
}

.system_title h2 {
  font-weight: 500;
  font-size: 4.5vw;
  color: #d2a776;
}

.system_title h1 {
  font-weight: 700;
  font-size: 5.5vw;
  padding-top: 2vw;
  color: #0c193d;
}

.system_title p {
  font-size: 2.5vw;
  line-height: 4vw;
  font-weight: 300;
  padding-top: 3vw;
}

.system_top {
  width: 90%;
  margin: 0 auto;
}

.top_box {
  background: #d2a776;
  position: absolute;
  z-index: 1;
  padding: 2vw 5vw;
  height: 8vw;
  width: 90%;
  top: 10vw;
}

.top_box img {
  position: absolute;
  left: 20vw;
  top: 3vw;
  width: 8vw;
  z-index: 2;
}

.top_box p {
  position: absolute;
  right: 28vw;
  top: 3.5vw;
  color: #fff;
  font-size: 5.5vw;
  z-index: 2;
}

.top_box2 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 23vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.top_box2 h3 {
  font-size: 3.5vw;
  color: #d2a776;
  font-weight: 550;
  padding: 3vw;
}

.top_box2 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.top_box3 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 48vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.top_box3 h3 {
  font-size: 3.5vw;
  color: #d2a776;
  font-weight: 550;
  padding: 3vw;
}

.top_box3 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

/*top*/

.system_bottom {
  width: 90%;
  margin: 0 auto;

  display: none;
}

.bottom_box {
  background: #0c193d;
  position: absolute;
  z-index: 1;
  padding: 2vw 5vw;
  height: 8vw;
  width: 90%;
  top: 145vw;
}

.bottom_box img {
  position: absolute;
  left: 20vw;
  top: 2.5vw;
  width: 7vw;
  z-index: 2;
}

.bottom_box p {
  position: absolute;
  right: 24vw;
  top: 3.5vw;
  color: #fff;
  font-size: 5.5vw;
  z-index: 2;
}

.bottom_box2 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 158vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.bottom_box2 h3 {
  font-size: 3.5vw;
  color: #0c193d;
  font-weight: 550;
  padding: 3vw;
}

.bottom_box2 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.bottom_box3 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 183vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.bottom_box3 h3 {
  font-size: 3.5vw;
  color: #0c193d;
  font-weight: 550;
  padding: 2vw;
  line-height: 4vw;
}

.bottom_box3 h3 span {
  font-size: 2vw;
  color: #0c193d;
  font-weight: 500;
}

.bottom_box3 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.bottom_box4 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 208vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.bottom_box4 h3 {
  font-size: 3.5vw;
  color: #0c193d;
  font-weight: 550;
  padding: 3vw;
}

.bottom_box4 h3 span {
  font-size: 2vw;
  color: #0c193d;
  font-weight: 500;
}

.bottom_box4 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.bottom_box5 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 233vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.bottom_box5 h3 {
  font-size: 3.5vw;
  color: #0c193d;
  font-weight: 550;
  padding: 3vw;
}

.bottom_box5 h3 span {
  font-size: 2vw;
  color: #0c193d;
  font-weight: 500;
}

.bottom_box5 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.bottom_box6 {
  position: absolute;
  z-index: 1;
  width: 90%;
  background: #fcfcfc;
  top: 258vw;
  height: 20vw;
  padding: 2vw 5vw;
}

.bottom_box6 h3 {
  font-size: 3.5vw;
  color: #0c193d;
  font-weight: 550;
  padding: 3vw;
}

.bottom_box6 h3 span {
  font-size: 2vw;
  color: #0c193d;
  font-weight: 500;
}

.bottom_box6 p {
  color: #616161;
  font-size: 2.5vw;
  line-height: 4vw;
}

.system_img_01 {
  position: absolute;
  top: 75vw;
  left: 5vw;
  width: 90%;
  z-index: 1;
}

.system_img {
  position: absolute;
  top: 285vw;
  left: 5vw;
  width: 90%;
  display: none;
}

.system_notice {
  border: 1px solid #d1d1d1;
  width: 95%;
  /* position: absolute; */
  left: 2.5vw;
  bottom: 24vw;
  margin: 10vw auto;
  /* padding: 5vw; */
}

.not_txt p {
  font-size: 1.3vw;
  color: #858585;
  padding: 3vw 1vw;
  text-align: center;
  line-height: 3vw;
  letter-spacing: -0.5;
}

/* new */
.sys_desc {
  height: 580vw;
  position: relative;
  padding-top: 150vw;
}
.sys_item {
  width: 94%;
  margin: 0 auto;
}
.sys_item.sys_item01 {
  height: 140vw;
  margin-bottom: 10vw;
}
.sys_item .title {
}
.sys_item .title span {
  font-weight: 500;
  font-size: 4.5vw;
  color: #2c2c2c;
  letter-spacing: -1.7px;
}
.sys_item .title h3 {
  font-weight: 700;
  font-size: 5.5vw;
  letter-spacing: -1.7px;
  color: #0c193d;
  margin: 2vw 0 10vw;
}

.sys_item .sys_wwep {
}
.sys_item .sys_wwep .sys_tt {
  text-align: start;
}
.sys_item .sys_wwep .sys_tt h5 {
  font-size: 4vw;
  font-weight: 700;
  color: #2c2c2c;
}
.sys_item .sys_wwep .sys_tt span {
  width: 10vw;
  height: 0.7vw;
  background: #2c2c2c;

  display: block;
  margin: 3vw 0;
}

.sys_item .sys_wwep .sys_slider01 {
  width: 100%;
  margin: 0 auto;
}
.sys_item .sys_wwep .sys_slider01 .item {
}
.sys_item .sys_wwep .sys_slider01 .item img {
}

.sys_item.sys_item02 {
  height: 84vw;
  margin-top: 10vw;
}
.sys_item.sys_item02 .sys_wwep {
}
.sys_item.sys_item02 .sys_wwep .cont {
}
.sys_item.sys_item02 .sys_wwep .cont img {
}

.sys_item.sys_item03 {
  margin-top: 10vw;
}
.sys_item.sys_item03 .sys_wwep .sys_slider02 {
  height: 67vw;
}
.sys_item.sys_item03 .sys_wwep .sys_slider02 .item {
}
.sys_item.sys_item03 .sys_wwep .sys_slider02 .item img {
}

.sys_item.sys_item03 .sys_wwep .sys_slider03 {
  height: 82vw;
}
.sys_item.sys_item03 .sys_wwep .sys_slider03 .item {
}
.sys_item.sys_item03 .sys_wwep .sys_slider03 .item img {
}