*{margin: 0; padding: 0;}
.page-joinus{   font-size: 14px; background: #fff; min-height: calc(100vh - 220px); }
.page-joinus--inner{ width: 1200px; margin: 0 auto; }
.page-joinus--banner{ text-align: center; background: url('/youshua/img/inviate/banner.png') no-repeat top center; height: 240px; }
/* .page-joinus--banner{ text-align: center; background: url('https://dummyimage.com/1920x240') no-repeat top center; height: 240px; } */
.page-joinus--banner img{ margin: 0 auto; }
.page-joinus--content{ display: flex; margin: 30px 0;  }
.page-joinus--content-nav{ flex: 0 0 160px; }
.page-joinus--content-nav .nav-item{ background: #f5f5f5; padding: 0 12px; height: 44px; line-height: 44px; text-align: center; cursor: pointer; }
.page-joinus--content-nav .nav-contact{ background: #f5f5f5; text-align: center; margin-top: 20px; padding: 0 12px 15px; font-size: 12px; color: #999;}
.page-joinus--content-nav .nav-contact-tit{  font-size: 14px; color: #333; line-height: 24px; }
.page-joinus--content-nav .nav-item:not(:first-child){ margin-top: 1px; }
.page-joinus--content-nav .nav-item i{ display: inline-block; position: relative; top: -2px; margin-right: 2px; vertical-align: middle;  background-repeat: no-repeat; width: 22px; height: 22px; }
.page-joinus--content-nav .nav-item:hover, .page-joinus--content-nav .nav-item.current{ color: #fff; background: #6a83db; }
.page-joinus--content-nav .nav-item:nth-child(1):hover i, .page-joinus--content-nav .nav-item:nth-child(1).current i{ background: url('/youshua/img/inviate/icon-all-current.png') no-repeat;}
.page-joinus--content-nav .nav-item:nth-child(2):hover i, .page-joinus--content-nav .nav-item:nth-child(2).current i{background: url('/youshua/img/inviate/icon-social-current.png') no-repeat; }
.page-joinus--content-nav .nav-item:nth-child(3):hover i, .page-joinus--content-nav .nav-item:nth-child(3).current i{ background: url('/youshua/img/inviate/icon-school-current.png') no-repeat; }
.page-joinus--content-nav .nav-item:nth-child(1) i{ background: url('/youshua/img/inviate/icon-all.png') no-repeat; }
.page-joinus--content-nav .nav-item:nth-child(2) i{ background: url('/youshua/img/inviate/icon-social.png') no-repeat;  }
.page-joinus--content-nav .nav-item:nth-child(3) i{ background: url('/youshua/img/inviate/icon-school.png') no-repeat; }
.page-joinus--content-list { margin-left: 20px; flex: auto; }
.page-joinus--content-list .list-tr{ display: flex; border-bottom: 1px solid #ebebeb; cursor: pointer; }
.page-joinus--content-list .list-tr:hover{ background: #f9f9f9; }
.page-joinus--content-list .list-th:first-child, .page-joinus--content-list .list-tb:first-child{ flex: 40%; }
.page-joinus--content-list .list-th:nth-child(2), .page-joinus--content-list .list-tb:nth-child(2){ flex: 20%; }
.page-joinus--content-list .list-th:nth-child(3), .page-joinus--content-list .list-tb:nth-child(3){ flex: 20%; }
.page-joinus--content-list .list-th:nth-child(4), .page-joinus--content-list .list-tb:nth-child(4){ flex: 20%; }
.page-joinus--content-list .list-th, .page-joinus--content-list .list-tb{ height: 44px; line-height: 44px; padding: 0 20px; }
.page-joinus--content-list .list-th{ flex: 1; background: #f5f5f5; }
.page-joinus--content-list .list-tb{ flex: 1; }    
.page-joinus--content-list .list-body-empty{ background:url('/youshua/img/inviate/icon-empty.png') no-repeat; width: 240px; height: 172px; margin: 30px auto; }    
.page-joinus--popup{ position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; }
.page-joinus--popup-mask{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 997; background: rgba(0,0,0,.5); }
.page-joinus--popup-inner{ position: absolute; width: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; z-index: 998; padding: 20px;}
.page-joinus--popup-tit{ position: relative; background: #f5f5f5; height: 45px; text-align: center; line-height: 45px; font-size: 16px; }
.page-joinus--popup-content{ font-size: 14px; line-height: 24px;}
.page-joinus--popup-content .tit{  font-size: 16px; color: #333; margin-top: 10px; }
.page-joinus--popup-content .title{ font-size: 14px; color: #333; margin-top: 10px; }
.page-joinus--popup-close{position: absolute; right: 10px; top:50%; transform: translate(0, -50%); width: 24px; height: 24px; border-radius: 50%; background-color: #ccc; border: none; cursor: pointer; }
.page-joinus--popup-close::before,.page-joinus--popup-close::after{content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 2px; background-color: #fff; transform: translate(-50%, -50%); }
.page-joinus--popup-close::before{transform: translate(-50%, -50%) rotate(45deg);-webkit-transform: translate(-50%, -50%) rotate(45deg);}
.page-joinus--popup-close::after{transform: translate(-50%, -50%) rotate(-45deg);-webkit-transform: translate(-50%, -50%) rotate(-45deg);}
.hidden{ display: none !important; }