.page-container-cipac { background-color: #F2F3F4; background-image: url(../static/images/cipac/15.png); background-position: left top; background-repeat: repeat; background-size: 100% auto; padding-bottom: 200px; position: relative; }
.right-join-vip-btn { position: fixed; z-index: 1000; top: 24%; width: 70px; right: 10px; cursor: pointer; }
.banner-container { position: relative; }
.banner-image { display: block; width: 100%; object-fit: cover; min-height: 300px; }
.banner-image.mo { display: none; }
.banner-wrapper { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 10; color: #FFFFFF; }
.banner-wrap { display: table; height: 100%; }
.banner-content { display: table-cell; vertical-align: middle; }
.banner-desc { padding-top: 20px; padding-bottom: 40px; }
.color { color: #F69234; }
.join { background: linear-gradient(90deg, #EF5A24 0%, #F9AE3B 100%); box-shadow: 0px 10px 20px 0px rgba(123, 123, 123, 0.2); background-color: #EF5A24; color: #FFFFFF; display: inline-block; padding: 1em 3.2em; transition: all 0.4s; }
.join:hover { color: #FFFFFF; opacity: 0.9; }

.anchor-wrapper { background: linear-gradient(90deg, #1B1464, #0071BA); background-color: #1B1464; }
.anchor-link { height: 88px; line-height: 88px; color: #FFFFFF; display: block; text-align: center; transition: all 0.8s; }
.anchor-link:hover { background: linear-gradient(90deg, #4215FF 0%, #D615FF 100%); box-shadow: 0px 10px 20px 0px rgba(123, 123, 123, 0.2); background-color: #D615FF; color: #FFFFFF; cursor: pointer; }
@media screen and (max-width: 768px) {
  .banner-image.pc { display: none; }
  .banner-image.mo { display: block; }
}



.link-container { background: linear-gradient(145deg, rgba(35, 62, 150, 0.3) 0%, rgba(35, 62, 150, 0.03) 50%, rgba(35, 62, 150, 0.3) 100%); background-color: rgba(35, 62, 150, 0.3); border-width: 1px; border-style: solid; border-color: rgba(38, 161, 206, 0.3); color: #FFFFFF; position: relative; }
.link-container .layui-row { background-position: left center; background-repeat: no-repeat; background-size: 40% auto; }
.link-container .details { text-align: justify; }
@media screen and (max-width: 996px) {
  .link-container .layui-row { padding-top: 100px }
  .link-container .layui-row { background-position: center 20px; background-size: auto 150px; }
}

#link1 { margin-top: 140px; }
#link1 .context { padding: 80px 30% 80px 30px; }
#link1 .title { font-weight: bold; }
#link1 .details { line-height: 1.8; margin-top: 40px; }
#link1 .box-img { position: absolute; right: -44px; top: -44px; }
@media screen and (max-width: 996px) {
  #link1 .context { text-align: center; padding: 80px; }
}
@media screen and (max-width: 768px) {
  #link1 { margin-top: 40px; }
  #link1 .context { text-align: center; padding: 80px 10px; }
  #link1 .details { padding: 0 30px; }
  .anchor-link { font-size: 18px !important; }
}


.title-wrapper { text-align: center; font-weight: bold; margin-top: 100px; color: #FFFFFF; margin-bottom: 50px; position: relative; z-index: 4; }
.title-wrapper .title-wrap { display: inline-block; vertical-align: middle; margin: 0 20px; }
.title-wrapper .line-image { display: inline-block; vertical-align: middle; height: 16px; }
@media screen and (max-width: 996px) {
  .title-wrapper .line-image { display: block; margin: 10px auto; }
}
@media screen and (max-width: 768px) {
  .page-container-cipac { padding-bottom: 55px; }
  .title-wrapper { margin-top: 58px; }
  #web { overflow-x: hidden; }
}


.link2-table { display: table; width: 100%; table-layout: fixed; }
.link2-table .table-row { border-bottom: 1px solid #172A78; padding: 60px 20px; }
.link2-table .table-col-left { display: table-cell; vertical-align: middle; color: #FFFFFF; text-align: center; }
.link2-table .table-col-left .left-box { width: 400px; }
.link2-table .table-col-right { display: table-cell; vertical-align: middle; color: rgba(255,255,255,0.5); padding-right: 10%; width: 100%}
.link2-table .icon { margin-bottom: 15px; }
@media screen and (max-width: 996px) {
  .link2-table .table-col-left .left-box { width: 300px; }
  .link2-table .table-col-right { padding-right: 20px; }
}
@media screen and (max-width: 768px) {
  .link2-table { display: block; }
  .link2-table .table-col-left { display: block; text-align: center; width: 100%; }
  .link2-table .table-col-left .left-box { width: 100%; }
  .link2-table .table-col-right { display: block; width: 100%; padding: 40px 20px 0; }
}


#link3 { padding: 70px 110px; }
@media screen and (max-width: 996px) {
  #link3 { padding: 50px 50px; }
}
@media screen and (max-width: 768px) {
  #link3 { padding: 40px 30px; }
}



.question-item-wrapper { padding: 70px 110px; border-bottom: 1px solid #172A78; }
.question-item-wrapper .question { margin-bottom: 26px; }
.question-item-wrapper .answer { line-height: 1.8; color: rgba(255,255,255,0.5); }
@media screen and (max-width: 996px) {
  .question-item-wrapper { padding: 50px 50px; }
}
@media screen and (max-width: 768px) {
  .question-item-wrapper { padding: 40px 30px; }
}


.star { position: absolute; z-index: 0; }
.star1 { right: 0; top: 1200px; }
.star2 { left: 0; top: 1800px; }
.star3 { left: 40%; bottom: 0; }