@charset "utf-8";

/*
 * File Name : Content.css
 */


/********************************************************
 
 *  Main
 
 ********************************************************/

/*-----------------------------------------------------------------------------
 *  Section : Contant top
 *----------------------------------------------------------------------------*/
.content .cont_top {display:flex; align-items: center; flex-wrap:wrap; width:100%;}
.content .scheBox {display: flex; align-items: center; width:67%; padding-right:25px;}
.content .scheBox .lb {margin-right: 20px;}
.content .scheBox::after {content:""; display:block; clear:both;;}
.content .scheBox .img_b {width:40%; display:inline-block;}
.content .scheBox h2 {color:#000; font-size:25px; margin-bottom:20px; text-align: center;}
.ph_edu .no_edu {width: 100%; height: 150px; background-color: #fff; display: flex; justify-content: center; align-items: center; text-align: center; font-weight: 500; font-size: 20px; border: 1px solid #ddd; cursor: default;}
.ph_edu .no_edu:hover, .ph_edu .no_edu:focus {text-decoration: none;}
.ph_edu .items {display:flex;}
.ph_edu .items > li {width:49%; background-color:#fff; position:relative; box-shadow:0 5px 20px rgba(0, 0, 0, 0.1); transition:all .25s ease;}
.ph_edu .items > li a {display:flex; width:100%; height:150px;}
.ph_edu .items > li:hover {box-shadow:0 5px 20px rgba(0, 0, 0, 0.3);}
.ph_edu .items > li:not(:nth-child(2n)) {margin-right:2%;}
.ph_edu .items > li .r_con {width:60%; background-color:#fff; padding:15px 10px 15px 15px;}
.ph_edu .items .img_b img {display:block; width: 100%; height: 100%;}
.ph_edu .r_con span {color:#8cc63f; font-size:16px; padding-bottom:5px;}
.ph_edu .r_con h4 {color:#000; font-size:18px; max-width:240px; word-break:keep-all; font-weight:500; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-y: hidden; height: 50px; margin-bottom: 15px;}
.ph_edu .r_con .inBox > li {position:relative; font-size: 15px; color: #000;}
.ph_edu .r_con .inBox > li:not(:last-child) {margin-bottom:7px;}
.ph_edu .r_con .inBox > li h5 {color:#000; font-size:16px; font-weight:500;}
.ph_edu .r_con .inBox > li p {color:#000; font-size:15px;}
.mainCtrl {display: flex;}
.mainCtrl .swiper-button-prev,
.mainCtrl .swiper-button-next {position: static; display: inline-flex; justify-content: center; align-items: center; width:50px; height:50px; background-color:#fff; border-radius:50%; overflow:hidden; box-shadow:0 5px 20px rgba(0, 0, 0, 0.1); transition:.25s ease;}
.mainCtrl .swiper-button-prev i,
.mainCtrl .swiper-button-next i {font-size:25px; color:#000;}
.mainCtrl .swiper-button-prev {margin-right: 10px;}
.mainCtrl .preBtn:hover,
.mainCtrl .nexBtn:hover {background-color:#134496;}
.mainCtrl .preBtn:hover i,
.mainCtrl .nexBtn:hover i {color:#Fff;}
.mainCtrl .swiper-pagination {z-index:0;}
.mainCtrl .swiper-pagination span {font-size:18px;}
.qBox {width:33%;}
.qBox ul {width:100%; height:150px; display:flex;}
.qBox ul .s_item {width:25%; height:100%; text-align:center; color:#fff;}
.qBox ul .s_item span.img_b {z-index:1;}
.qBox ul .s_item span.en {color:rgba(255, 255, 255, 0.5); font-size:14px; margin:10px 0 5px; z-index:1; margin:15px 0 0;}
.qBox ul .s_item p {font-size:17px; color:#fff; font-weight:500; z-index:1;}
.qBox ul .s_item a {width:100%; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; position:relative;}
.qBox ul .s_item a:hover {text-decoration:none; background:url("/resources/user/edu/images/main/hv1.jpg"); background-size:cover; transition:all .25s ease;}
.qBox ul .s_item a:hover .black_bg {transition:all .25s ease;}
.qBox ul .s_item a:hover .black_bg:before {display:block; content:""; background:rgba(0, 0, 0, 0.6); position:absolute; width:100%; height:100%; top:0; left:0;}
.qBox ul .s_item.s1 {background-color:#3b80ff;}
.qBox ul .s_item.s2 {background-color:#42adc4;}
.qBox ul .s_item.s3 {background-color:#726fef;}
.qBox ul .s_item.s4 {background-color:#42c488;}

.content .cont_bott {width:100%; border-top-left-radius:20px; overflow:hidden; background-color:#fff; box-shadow:3px 3px 15px 3px rgba(0, 0, 0, 0.1);}
.mainTab .tabs_head {background-color:#222e45; position:relative;}
.mainTab .tabs_head .tab.tabs_head_active {background-color:#fff; color:#333; font-weight:500;}
.mainTab .tabs_head .tab {width:20%; text-align:center; padding:17px 0; color:#c5cbd9; font-size:18px;}
.mainTab .tabs_content {padding:50px; height:275px;}
.mainTab .tabs_content .list_con {display:flex;}
.mainTab .tabs_content .list_con li {width:23.75%;}
.mainTab .tabs_content .list_con li:hover a {text-decoration:none;}
.mainTab .tabs_content .list_con li:hover a p {text-decoration:underline;}
.mainTab .tabs_content .list_con li h3 {color:#333; font-size:19px; font-weight:500;	display:-webkit-box; height:50px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; word-wrap:break-word;
-webkit-box-orient:vertical;}
.mainTab .tabs_content .list_con li p {font-size:16px; color:#777; line-height:1.6;	display:-webkit-box; height:100px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:3; word-wrap:break-word;
  -webkit-box-orient:vertical; margin-bottom:20px; padding:20px 0;}
.mainTab .tabs_content .list_con li span {font-size:14px; color:#777; font-weight:500;}
.mainTab .tabs_content .list_con li:not(:last-child) {margin-right:5%;}
.mainTab .btn_more {width:14px; height:15px; position:absolute; z-index:1; top:38%; right:2%;}
.mainTab .btn_more img:hover {transform:rotate(90deg); transition:all .25s ease;}

@media screen and (max-width:1080px) {
  .content .scheBox {width: 100%; padding-right: 0; margin-bottom: 20px;}
  .qBox {width: 100%;}
}


@media screen and (max-width:880px){
  .infoSlide span {width: 11%;}
  .infoSlide a p {max-width: unset; width: 80%;}
  .content .cont_top {margin-bottom:30px;}
  .content .scheBox {width:100%; padding-right:0; flex-wrap: wrap;}
  .content .scheBox .lb {width: 100%; margin-right: 0; margin-bottom: 20px;}
  .content .scheBox h2 {font-size:20px; margin-bottom: 10px;}
  .qBox {width:100%; margin-top:25px;}
  .s_item {clear:both;}
  .mainCtrl {width:100%; justify-content: center; top:-10px; right:-1%;}
  .mainCtrl .swiper-pagination {bottom:18px;}
  .mainCtrl .swiper-pagination span {font-size:16px;}
  .mainCtrl .swiper-button-prev, .mainCtrl .swiper-button-next {width:40px; height:40px;}
  .mainCtrl .swiper-button-prev i, .mainCtrl .swiper-button-next i {font-size:20px;}
  .ph_edu .items { flex-wrap:wrap;}
  .ph_edu .items > li {width:100%;}
  .ph_edu .items > li:not(:last-child) {margin-bottom:20px;}
  .ph_edu .items > li .r_con {width:70%;top:3%; left:27%;}
  .ph_edu .r_con span {font-size:15px;}
  .ph_edu .r_con h4 {font-size:16px; padding-bottom:8px; max-width:100%; margin-top: 3px; height: 46px;}
  .ph_edu .r_con h4 br {display: none;}
  .ph_edu .r_con .inBox > li h5 {font-size:14px;}
  .ph_edu .r_con .inBox > li:not(:last-child) {margin-bottom:5px;}
  .ph_edu .r_con .inBox > li p {font-size:14px;}
  .ph_edu .items .img_b {display:inline-block; width:200px; height:auto;}
  .ph_edu .items .img_b img {width:100%; height:100%;}
  .ph_edu .items > li:not(:nth-child(2n)) {margin-right:0;}
  
  .mainTab .tabs_head .tab {width:auto; font-size:15px; padding:15px 17px;}
  .mainTab .tabs_head .tab.tabs_head_active {font-size:15px;}
  .mainTab .btn_more {top:34%; right:5%;}
  .mainTab .tabs_content {padding:20px; height:auto;}
  .mainTab .tabs_content .list_con {flex-wrap:wrap;}
  .mainTab .tabs_content .list_con li {width:100%;}
  .mainTab .tabs_content .list_con li h3 {display:block; font-size:16px; overflow:hidden;  height:auto; text-overflow: ellipsis; white-space:nowrap;}
  .mainTab .tabs_content .list_con li p {font-size:14px; padding:5px 0; display:-webkit-box; height:45px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; word-wrap:break-word;
  -webkit-box-orient:vertical; line-height:1.4; margin-bottom:5px;}
  .mainTab .tabs_content .list_con li:not(:last-child) {margin:0 0 10px 0; border-bottom:1px solid #ddd; padding-bottom:10px;}
  .qBox ul .s_item p {font-size:16px;}
  .qBox ul .s_item span.img_b img {width:48px;}
}


@media screen and (max-width:480px) {
  #visual .notice_slide {padding: 0 10px 0 30px;}
  #visual .notice_slide .type {font-size: 13px; width: 37px;}
  #visual .notice_slide .title {font-size: 13px;}
  #visual .notice_slide .date {font-size: 13px;}
  #visual .ns_ctrl {left: 28px;}
  #visual .btn_ns_prev i, #visual .btn_ns_next i {font-size: 16px;}
  #visual .notice_slide .btn_more {padding-top: 1px;}
  #visual .notice_slide .btn_more i {font-size: 13px;}
  .infoSlide span {width: 17%;}
  #visual .s_ctrl {top: 23%; right: 3%;}
  .ph_edu .no_edu {font-size: 14px;}
  .ph_edu .items .img_b {width: 100px;}
  .ph_edu .items > li:not(:last-child) {margin-bottom: 10px;}
  .ph_edu .items > li a {height: 100px;}
  .ph_edu .items > li .r_con {padding: 10px; padding-left: 15px;}
  .ph_edu .r_con span {font-size: 13px;}
  .ph_edu .r_con h4 {font-size: 13px; height: 38px; margin-bottom: 0;}
  .ph_edu .r_con .inBox > li {font-size: 13px;}
  .qBox ul {flex-wrap: wrap; margin-bottom: 100px;}
  .qBox ul .s_item {width: 50%;}
}



