.center_top { position:relative; min-height:280px; display: inline-block; width: 100%; margin-bottom: 50px;}

.student {margin:0 auto; 
	/* width:140px;  */
	border: 1px solid #efefef;
	display: inline-block; 
	vertical-align: top;
	border-radius: 20px;
	padding: 30px 40px;
	box-sizing: border-box;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.student h3 { margin:0 0 5px 0 !important;}
.student_pceoimg { 
	width:120px; 
	height:160px;
	display: inline-block; 
	vertical-align: top;
	border: 1px solid #ddd;
}
.student ul {display: inline-block; padding-left: 30px; width: 180px;}
.student ul li {line-height: 2;}
#content .student ul > li{background: none; padding: 0;}
#content .student ul > li::before {
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50px;
	background-color: #333;
	display: inline-block;
	margin-right: 10px;
    /* background: url(/design/layout/images/common/icon/h_li.gif) no-repeat scroll left 16px transparent; */
	margin-bottom: 5px;
  
}

/* .student_notice { float:left; width:697px;} */
.student_notice h3 {font-size:18px; margin:0 0 5px 0 !important;  background:url(/design/layout/images/common/icon/h3_1.png) no-repeat 1px 8px; /*padding:0 !important;*/}
.student_notice_more { position:absolute; top:5px; right:2px;}

.center_edu { position:relative; }

.process { position:absolute; right:0; top:0;}
.process li {float:left; height:17px; line-height:13px; padding:0 0 0 26px !important; margin-left:10px;}

.pro1con {background: url("/design/layout/images/ceo/pceo_menu/cen_process_1.jpg") no-repeat scroll 0 0 !important;}
.pro2con {background: url("/design/layout/images/ceo/pceo_menu/cen_process_2.jpg") no-repeat scroll 0 0 !important;}
.pro3con {background: url("/design/layout/images/ceo/pceo_menu/cen_process_3.jpg") no-repeat scroll 0 0 !important;}
.pro4con {background: url("/design/layout/images/ceo/pceo_menu/cen_process_4.jpg") no-repeat scroll 0 0 !important;}

.basics { 
	background-color:#f8f8f8; 
	width:100%;
	height:224px; 
	margin:20px 0 0 0; position:relative; 
	vertical-align: top;
}
	
	.basics p { background-color:#1555ad; color:#fff; width:93px; height:24px; font-weight:bold; text-align:center;  line-height:21px; padding: 8px;}
	
	.basics_pro { margin:80px 0 0 231px !important;}

	.basics_pro li{ 
		display: inline-block;
		
		padding: 10px; 
		border: 1px solid #333;
		box-sizing: border-box;
		width: 90px;
		/*height: 74px; */
		vertical-align: top;
		background-color: #fff;
		/* float:left; 
		width:62px; 
		height:62px;  margin:0 1px 0 0; 
		padding:11px 0 0 0 !important; */
		
		text-align:center; 
		color:#414141;
	}
	
	.basics_pro li span{display: block;}

	.basics_pro li a{
		display: block;
	}
	.quarter_wrap{display: block; margin: 0 auto; text-align: center; border: 1px solid #ddd; padding: 50px 20px; box-sizing: border-box;}

	.quarter {
		display: inline-block;
		vertical-align: bottom;
		border: 1px solid #ddd;
		padding: 20px 15px;
		border-radius: 10px;
		margin-right: 10px;
		margin-bottom: 10px;
		box-sizing: border-box;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
		width: calc((100% / 4) - 10px);
		}
		.quarter.last{margin-right: 0;}	
	#content .quarter ul {margin-top: 0;}
	.quarter ul li{
		border: 1px solid #c8005f;
		text-align: center;
		display: inline-block;
		/* width: 90px; */
		/* margin: 0 5px; */
		margin-right: 10px;
		border-radius: 5px;
		box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
		transition: all 0.2s;
		width: calc((100% / 2) - 10px);
		padding: 10px;
		box-sizing:border-box;
		}
		.quarter ul li:last-child{margin-right: 0;}	
	.quarter ul li:hover{
		border: 1px solid #c8005f;
		background-color: #c8005f;
		transition: all 0.2s;
	}
	.quarter ul li:hover a{
		color: #c8005f;

		color: #fff;
	}
	.quarter ul li a{display: block;  text-decoration: none;
	color:#c8005f}
	.quarter ul li a span{display: none;}
	
	.quarter.ot{border: none;}
	.quarter ul li.only{padding: 54px 0; border:none; box-shadow: none; background-color: #3c3c3c; color: #fff;}
	.quarter p{
		color: #fff;
		background-color :  #c8005f;
		border-radius: 30px;
		text-align: center;
		padding: 5px;
		margin-bottom: 20px;
		border: 1px solid #c8005f;
	}
	.quarter p.only{
		height: 136px;
	}
	.ot_wrap{
		display: block;
		margin: 0 auto; text-align: center;}

	.ot_wrap p.ot{
		padding: 0;
		color: #fff;
		text-align: center;
		margin: 0 auto;
		transform: rotate(45deg);
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
	}

		.drop-icon {
			position: relative;
			width: 100px;
			height: 100px;
			background: #3c3c3c;
			border-radius: 50% 50% 50% 0; 
			transform: rotate(-45deg); 
			text-align: center;
    		margin: 0 auto 50px;
		  }
		  
	
	/* li.pro1 {background: url("/design/layout/images/ceo/pceo_menu/pro1_b.jpg") no-repeat scroll 0 0 !important; color:#414141;}
	li.pro1 a {color:#414141 !important;}
	li.pro2 {background: url("/design/layout/images/ceo/pceo_menu/pro2_b.jpg") no-repeat scroll 0 0 !important; color:#414141;}
	li.pro2 a {color:#414141 !important;}
	li.pro3 {background: url("/design/layout/images/ceo/pceo_menu/pro3_b.jpg") no-repeat scroll 0 0 !important; color:#747474;}
	li.pro3 a {color:#747474 !important;}
	li.pro4 {background: url("/design/layout/images/ceo/pceo_menu/pro4_b.jpg") no-repeat scroll 0 0 !important; color:#414141;}
	li.pro4 a {color:#414141 !important;} */
	
	
	.basics_d { position:absolute; top:73px; left:321px; margin:0; padding:0; }

	.basics_d li { 
		display:inline-block; 
		width:180px; 
		
		text-align:center !important; 
		color:#414141; 
		border:1px solid #efefef;
		box-sizing: border-box;
		padding: 7px 5px;
		margin-bottom: 0;
		color: #fff;

		background-color: #c8005f; 
		/* border-radius: 15px 15px 0 0; */
	}
	
	/* li.bas_d1 {background: url("/design/layout/images/ceo/pceo_menu/basics_pro1.jpg") no-repeat scroll 0 0 !important;}
	li.bas_d3 {background: url("/design/layout/images/ceo/pceo_menu/basics_pro3.jpg") no-repeat scroll 0 0 !important;} */

.deepen {background-color:#f8f8f8; width:888px; height:224px; margin:30px 0 0 0; position:relative; }
	.deepen p { background-color:#c0272d; color:#fff; width:93px; height:24px; font-weight:bold; text-align:center; line-height:21px; }
	
	.deep_pro  { margin:80px 0 0 294px !important; color:#414141;}
	.deep_pro li { float:left; width:62px; height:62px; margin:0 1px 0 0; padding:7px 0 0 0 !important; text-align:center !important; line-height:15px; }
	
	.deep_ab { position:absolute; top:73px; left:294px; margin:0; padding:0;}
	.deep_ab li { float:left; width:251px; height:30px; margin:0 1px 0 0; padding:0 !important; text-align:center !important; color:#414141; line-height:25px;}
	
	li.dp_ab1 {background: url("/design/layout/images/ceo/pceo_menu/dp_pro1.jpg") no-repeat scroll 0 0 !important;}
	li.dp_ab1 a {color:#414141 !important;}
	li.dp_ab3 {background: url("/design/layout/images/ceo/pceo_menu/dp_pro3.jpg") no-repeat scroll 0 0 !important;}
	li.dp_ab3 a {color:#414141 !important;}


.camp {background-color:#f8f8f8; width:888px; height:140px; margin:30px 0 0 0; }
	.camp p { background-color:#9332ab; color:#fff; width:93px; height:24px; font-weight:bold; text-align:center; line-height:21px; }
	
	.camp_y { margin:0 0 0 294px !important;}
	.camp_y li { float:left; width:62px; height:62px; margin:0 1px 0 0; padding:7px 0 0 0 !important; text-align:center !important; line-height:15px;}
	

.etc_edu {background-color:#f8f8f8; width:888px; height:140px; margin:30px 0 0 0; }
	.etc_edu p {background-color:#46881b; color:#fff; width:93px; height:24px; font-weight:bold; text-align:center; line-height:21px; }
	
	.etc_educamp  { margin:0 0 0 294px !important; color:#414141;}
	.etc_educamp li { float:left; width:62px; height:62px; margin:0 1px 0 0; padding:7px 0 0 0 !important; text-align:center !important; line-height:15px; }

	@media screen and (max-width : 1080px){
		.quarter{
			width: calc((100% / 2) - 20px);

		}
		.quarter ul li{width: calc((100% / 2) - 20px)}
	}


	@media screen and (max-width : 640px){
		.student{width: 100%;}
		.student_pceoimg{width: auto;}

		.quarter {
			width: 100%;
			margin: 10px 0 ;
		}

	}
