.main {
  position: relative;
}

.leftbox {
  width: 955px;
  display: inline-block;
}

.leftbox .logo {
  margin-top: 20px;
}

.leftbox .list {
  margin-left: 12px;
  border-left: 1px solid #d1d1d1;
  padding-left: 36px;
  padding-bottom: 35px;
}

.leftbox .list li {
  margin-top: 34px;
  position: relative;
}

.leftbox .list .year {
  color: #333333;
  font-size: 20px;
}

.leftbox .list .year:before {
  content: '';
  position: absolute;
  left: -50px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid #dadada;
  background: #ffffff;
}

.leftbox .list .year:after {
  content: '';
  position: absolute;
  top: 6px;
  left: -44px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #888888;
}

.leftbox .monthlist {
  padding-left: 32px;
}

.leftbox .monthlist .titlebox .month {
  font-size: 20px;
  color: #cccccc;
  display: inline-block;
  width: 44px;
  text-align: right;
  vertical-align: top;
}

.leftbox .monthlist .titlebox .title {
  font-size: 20px;
  color: #333333;
  margin-left: 30px;
  width: 790px;
  display: inline-block;
}

.leftbox .monthlist .content {
  color: #c2c2c2;
  margin-top: 24px;
  margin-left: 80px;
}

.rightbox {
  position: absolute;
  top: 67px;
  width: 78px;
  right: 20px;
  border-left: 1px solid #e2e2e2;
}

.rightbox li {
  padding-left: 22px;
  margin-bottom: 26px;
}

.rightbox li a {
  color: #b3b3b3;
  text-decoration: none;
}

.rightbox li.cur a,
.rightbox li a:hover {
  color: #8fc31f;
}

.rightbox li:last-child {
  margin-bottom: 4px;
}