@charset "utf-8";
/* CSS Document */
*{ margin:0; padding:0; font-family:"微软雅黑";}
a{text-decoration:none;}
ul,li{list-style:none; border:none;}
p,h1,h2,h3,h4,h5,h6,ul,li,img,form{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{font-size:14px;font-weight:900;}	
img{ border:none;}
.clear{ clear:both;}

/*banner*/
#vision_banner{ width: 100%; background: url(../images/vision_banner_bg.jpg) no-repeat center; margin: 0 auto;}
#vision_banner img{ display: block; margin: 0 auto;}
#vision_banner_yd{ width: 100%; display: none;}
#vision_banner_yd img{ width: 100%;}
/*bannerOver*/

.vision_title{ width: 1220px; text-align: center; margin: 0 auto; padding: 60px 0 50px;}
.vision_title h2{ font-size: 60px; color: #474548;}
.vision_title h2 span.vision_title_b{background: url(../images/vision_title_bg.png) no-repeat left top; padding-left: 10px;}
.vision_title h2 span.vision_title_c{ color: #5c63fb;}
.vision_title h2 span.vision_title_d{ width: 10px; height: 10px; padding-left: 5px;}
.vision_title h3{ font-size: 22px; padding-top: 10px; color: #5e5e5e; font-weight: normal;}
.vision_title h2.chjy_title_color,.vision_title h3.chjy_title_color{ color: #fff;}

#vision_suit a,#vision_aid a,#vision_circle a,#vision_choice a,#vision_class>a,#vision_infor a,#vision_ask a{ display: block; width: 315px; height: 66px; line-height: 66px; background-color: #fc2ba5; font-size: 36px; color: #fff; margin: 50px auto; text-align: center; border-radius: 50px;}

#vision_what{ width: 100%; background: url(../images/vision_what_bg.jpg) no-repeat center top;}

/*为什么学新媒体视觉*/

#vision_why,#vision_learn{ width: 100%; padding-bottom: 50px;}
#vision_why_main{ width: 1220px; margin: 0 auto;}
#vision_why_main ul li{ float: left; margin-left: 40px;}
#vision_why_main ul li:nth-of-type(1){ margin-left: 0;}
#vision_why_main ul li img{ display: block; width: 100%;}
.vision_why_area{ width: 100%; background-color: #657efc; color: #fff; text-align: center; padding: 20px 0 30px;}
.vision_why_area h4{ font-size: 28px;}
.vision_why_area p{ font-size: 20px; padding-top: 4px;}

/*为什么学新媒体视觉*/

/*新媒体视觉都学什么*/

#vision_learn_main{ width: 1220px; margin: 0 auto; background: url(../images/vision_learn_bg.png) no-repeat left top; }
#vision_learn_sub{ width: 275px; float: left; margin: 50px 0 0 40px;}
#vision_learn_sub h4{ width: 240px; height: 80px; line-height: 80px; background-color: #f5f5f5; border: 1px solid #e5e5e5; font-size: 28px; color: #565656; font-weight: normal; margin-bottom: 40px;  cursor: pointer;}
@font-face {font-family:BEBAS; /*这里是说明调用来的字体名字*/src: url(../fonts/BEBAS.TTF); /*这里是字体文件路径*/}
#vision_learn_sub h4 span{ display: block; font-size: 50px; font-family:"BEBAS"; margin:0 10px; line-height: 80px; float: left;}
#vision_learn_sub h4.vision_learn_color{ background-color: #f538a6; border: 1px solid #f538a6; color: #fff;}

#vision_learn_exp{ width: 905px; float: left;}
.vision_learn_pack{width: 100%; display: none;}
.vision_learn_pack ul { margin-top: 1rem;}
.vision_learn_pack ul li{ width:278px; float: left; margin:0 0 15px 12px;}
.vision_learn_pack ul li:nth-of-type(3n+1){ margin-left: 32px;}
.vision_learn_pack ul li img{ display: block; width: 100%;}
.vision_learn_pack ul li h4{ width:100%; background-color: #657efc; height: 46px; line-height: 46px; font-size: 24px; text-align: center; color: #fff; font-weight: normal;}

/*新媒体视觉都学什么*/

/*适合人群和好处*/

#vision_gain{ width: 100%; background: #2d4efb url(../images/vision_gain_bg.jpg) no-repeat center top;}

/*适合人群*/
#vision_suit{ width: 100%; padding-bottom: 50px;}
#vision_suit_main{ width: 1220px; margin: 0 auto;}
#vision_suit_main ul li{width: 380px;  float: left; margin-left: 40px; background-color: #fff; border-radius: 10px; }
#vision_suit_main ul li:nth-of-type(1){ margin-left: 0;}
#vision_suit_main ul li img{ float: left; margin: 20px 10px 0;}
.vision_suit_text{float: left; width: 220px; }
.vision_suit_text h4{ font-size: 30px; color: #3c3c3c; padding-top: 20px;}
.vision_suit_text span{ display: block; width: 65px; height: 3px; background-color: #f538a6; margin: 18px 0;}
.vision_suit_text p{ font-size: 18px; line-height: 32px; color: #434343; padding:0 10px 0 0;}

/*适合人群*/

/*好处*/
#vision_benefit{ width: 100%; padding-bottom: 80px; }
#vision_benefit_main{ width:1220px; margin: 0 auto;}
#vision_benefit_main img{ float: left; border-radius: 10px;}
.vision_benefit_text{ width: 480px; float: left; color: #fff; margin-left: 40px;}
.vision_benefit_text h4{ font-size: 36px; color: #fff; padding-top: 20px;}
.vision_benefit_text p{ font-size: 20px; color: #fff; line-height: 40px; padding: 30px 20px 60px 0 ;}
.vision_benefit_text a{ display: block; width: 315px; height: 66px; font-size: 32px; color: #fff; line-height: 66px; background-color: #fc2ba5; text-align: center; border-radius: 50px;}

/*好处*/

/*适合人群和好处*/

/*就业岗位和课程大纲*/

#vision_content{ width: 100%;  background: url(../images/vision_content_bg.jpg) no-repeat center top;}

/*就业岗位*/

#vision_jobs{ width: 100%; padding-bottom: 30px;}
#vision_jobs_main{ width: 1220px; margin: 0 auto;}
#vision_jobs_main ul li{ float: left; width: 290px; margin-left: 20px;} 
#vision_jobs_main ul li:nth-of-type(1){ margin-left: 0;}
#vision_jobs_main ul li img{ display: block; width: 100%; transition: 0.6s;}
.vision_jobs_pic{ overflow: hidden;}
#vision_jobs_main ul li h4{ width: 100%; height: 52px; line-height: 52px; background-color: #f538a6; font-size: 24px; color: #fff; text-align: center; font-weight: normal;  }
.vision_jobs_pic img:hover {transform: scale(1.1);}

/*就业岗位*

/*课程大纲*/

#vision_course{ width: 100%; padding-bottom: 100px;}
#vision_course_main{ width: 1218px; border: 1px solid #fc2ba5; margin: 30px auto 0;}
#vision_course_sub{ width: 1218px; margin-top: -30px; }
#vision_course_sub h4{ width: 120px; height: 50px; line-height: 50px; font-size: 18px; color: #373737; float: left; text-align: center; background-color: #fff; border: 1px solid #e0e0e0; border-radius: 50px; margin-left: 20px;}
#vision_course_sub h4:nth-of-type(1){ margin-left: 50px;}
#vision_course_sub h4.vision_course_color{ background-color: #f72da2; border: 1px solid #f72da2; color: #fff;}

#vision_course_exp{width: 1218px;}
.vision_content{ width: 1178px; margin: 30px 20px 20px; display: none;}
.vision_content_left{ width: 540px; float: left;}
.vision_content_left img{ display: block; float: left; }
.vision_content_left img:nth-of-type(1){ margin-bottom: 14px;}
.vision_content_left img:nth-of-type(3){ margin-left: 14px;}
.vision_content_right{ width: 598px; height: 500px; float: left; background-color: #3e4efb; color: #fff; padding: 20px;}
.vision_content_right h4{ font-size: 28px;}
.vision_content_right h3{ font-size: 24px; padding: 20px 0 10px;}
.vision_content_right p{ font-size: 18px; line-height: 36px;}
/*课程大纲*/

/*就业岗位和课程大纲*/

/*师资阵容*/

#vision_teacher{ width: 100%; background: #2d4efb url(../images/vision_gain_bg.jpg) no-repeat center top; padding-bottom: 80px;}
#vision_teacher_main{ width: 1220px; margin: 0 auto;}
#vision_teacher_main ul li{ width: 272px; float: left; margin-left: 44px;}
#vision_teacher_main ul li:nth-of-type(1){ margin-left: 0;}
#vision_teacher_main ul li img{ display: block; width: 100%;}
.vision_teacher_area{ width: 100%; height: 260px; background-color: #fff; text-align: center;}
.vision_teacher_area h4{ font-size: 28px; color: #2c2c2c; padding: 10px 0 6px;}
.vision_teacher_area h5{ font-size: 20px; color: #626262; font-weight: normal;}
.vision_teacher_area span{ display: block; width: 58px; height: 4px; background-color: #fc2ba5; margin: 12px auto; }
.vision_teacher_area p{ font-size: 18px; color: #878787; line-height: 32px; padding: 0 10px 20px;}

/*师资阵容*/

/*作品展示*/
#vision_works{ width: 100%; background: url(../images/vision_what_bg.jpg) no-repeat center top; padding-bottom: 80px;}
#vision_works_main{ width: 1220px; margin: 0 auto;}
#vision_works_sub{ width: 1220px; background: url(../images/vision_works_sub_bg.jpg) no-repeat center;}
#vision_works_sub h4{ width: 170px; height: 56px; font-size: 20px; color: #383838; line-height: 56px; text-align: center; background-color: #fff; border: 1px solid #e0e0e0; float: left; margin-left: 48px;}
#vision_works_sub h4:nth-of-type(1){ margin-left: 200px;}
#vision_works_sub h4.vision_works_color{color: #fff; background-color: #f72da2; border: 1px solid #f72da2;}

#vision_works_exp{ width: 1220px; margin: 0 auto; padding-top: 40px}
.vision_works_area{ width: 1220px; height: 770px; position: relative; display: none;}
.vision_works_area ul li{ position: absolute;}
.vision_works_area ul li.vision_works_m1{ top: 0; left: 0;}
.vision_works_area ul li.vision_works_m2{ top:0; left: 488px;}
.vision_works_area ul li.vision_works_m3{top: 0; left: 854px; }
.vision_works_area ul li.vision_works_m4{ top:282px; left: 0;}
.vision_works_area ul li.vision_works_m5{ top:282px; left: 366px;}
.vision_works_area ul li.vision_works_m6{top:528px; left: 366px; }
.vision_works_area ul li.vision_works_m7{ top:528px; left:654px}
.vision_works_area ul li.vision_works_m8{ top:528px; left: 942px;}

/*作品展示*/

/*项目实战和实训就业*/

#vision_actual{ width: 100%; background: url(../images/vision_actual_bg.jpg) no-repeat center top; padding-bottom: 50px; }

/*项目实战*/
#vision_project{ width: 100%; padding-bottom: 50px;}
#vision_project_main{ width: 1220px; margin: 0 auto;}
#vision_project_main ul li{ width: 372px; height: 520px; float: left; margin-left: 52px; text-align: center; position: relative; overflow: hidden; }
#vision_project_main ul li:nth-of-type(1){ margin-left: 0;}
#vision_project_main ul li img{ display: block; width: 100%;}
#vision_project_main ul li h4{width: 100%; height: 65px;  background: rgba(15,18,55,0.7); line-height: 65px; font-size: 30px; color: #fff; position: absolute; bottom: 0;}
.vision_project_mask{ width: 100%; height: 520px; background: rgba(15,18,55,0.7); position: absolute; top: 0; display: none; }
.vision_project_mask h5{ font-size: 38px; color: #f4e500; margin-top: 100px;}
.vision_project_mask span{ display: block; width: 100px; height: 2px; background-color: #fff; margin: 40px auto;}
.vision_project_mask p{ font-size: 24px; color: #fff; line-height: 46px;}
#vision_project_main ul li:hover h4{ display: none;}
#vision_project_main ul li:hover .vision_project_mask{ display: block;}

/*项目实战*/


/*实训就业*/
#vision_aid{ width: 100%;}
#vision_aid_main{ width: 1220px; margin: 0 auto;}
#vision_aid_main ul li{ float: left; margin:0 0 30px 39px; }
#vision_aid_main ul li:nth-of-type(3n+1){ margin-left: 0;}
#vision_aid_main ul li img{ display: block; width: 100%;}
.vision_aid_area{ width: 380px; text-align: center; background-color: #fff;}
.vision_aid_area h4{ font-size: 30px; color: #353535; padding-top: 20px;}
.vision_aid_area p{ font-size: 20px; color: #707070; padding: 5px 0 20px;}
/*实训就业*/

/*项目实战和实训就业*/


/*圈子和选择我们*/
#vision_join{ width: 100%; background: url(../images/vision_join_bg.jpg) no-repeat center top;}

/*圈子*/
#vision_circle{ width: 100%;}
#vision_circle_main{ width: 1220px; height: 440px; margin: 0 auto; background: url(../images/vision_circle_bg.png) no-repeat center top;}

.example {width: 1220px; height: 440px; margin:0 auto;}
.ft-carousel {position: relative; width: 100%; height: 100%; overflow: hidden;}
.ft-carousel .carousel-inner { position: absolute;	left: 0; top: 0; height: 100%;}
.ft-carousel .carousel-inner .carousel-item { float: left; height: 100%;}

.ft-carousel .carousel-btn{ position: absolute; top: 45%; width: 46px; height: 100px; margin-top: -50px; cursor: pointer; background-color: #FCFC0A; }
.ft-carousel .carousel-prev-btn{left: 0; background: url(../images/chjy_prev.png) no-repeat;}
.ft-carousel .carousel-next-btn{right: 0; background: url(../images/chjy_next.png) no-repeat;}

.vision_circle_box{width: 1220px; margin: 0 auto;}
.vision_circle_box img{ width: 100%; display: block;}
.vision_circle_box h4{ font-size: 32px; color: #fff; margin:40px 0 0 80px;}
.vision_circle_box ol{ margin-top: 30px;}
.vision_circle_box ol li{ float: left; margin-left: 54px;}
.vision_circle_box ol li:nth-of-type(1){ margin-left: 70px;}

#vision_circle_yd{ display: none;}
/*圈子*/

/*选择我们*/
#vision_choice{ width: 100%; padding-bottom: 50px;}
#vision_choice_main{ width: 1220px; margin: 0 auto;}
#vision_choice_main ul li{ width: 270px; height: 140px; float: left; color: #fff; margin: 0 0 50px 85px; text-align: center; padding: 30px 40px;}
#vision_choice_main ul li:nth-of-type(3n+1){ margin-left: 0;}
#vision_choice_main ul li:nth-of-type(1){ background:url(../images/vision_choice_bg_01.jpg) no-repeat center top;}
#vision_choice_main ul li:nth-of-type(2){ background:url(../images/vision_choice_bg_02.jpg) no-repeat center top;}
#vision_choice_main ul li:nth-of-type(3){ background: url(../images/vision_choice_bg_03.jpg) no-repeat center top;}
#vision_choice_main ul li:nth-of-type(4){ background: url(../images/vision_choice_bg_04.jpg) no-repeat center top;}
#vision_choice_main ul li:nth-of-type(5){ background: url(../images/vision_choice_bg_05.jpg) no-repeat center top;}
#vision_choice_main ul li:nth-of-type(6){ background: url(../images/vision_choice_bg_06.jpg) no-repeat center top;}
#vision_choice_main ul li h4{ font-size: 32px; font-weight: 700;}
#vision_choice_main ul li span{ display: block; width: 40px; height: 2px; background-color: #fff; margin: 15px auto;}
#vision_choice_main ul li p{ font-size: 20px; line-height: 32px; color: #dbdfff;}
/*选择我们*/

/*圈子和选择我们*/

/*实录课堂和企业荣誉*/
#vision_record{ width: 100%; background: url(../images/vision_record_bg.jpg) no-repeat center top; padding-bottom: 60px;}
/*实录课堂*/
#vision_class{ width: 100%;}
#vision_class_main{ width: 1220px; margin: 0 auto;}
#vision_class_main ul li{ width: 356px; float: left; background-color: #fff; border-radius: 16px; padding: 16px; margin:0 0 30px 28px;}
#vision_class_main ul li:nth-of-type(3n+1){ margin-left: 0;}
#vision_class_main ul li img{ display: block; border-radius: 10px;}
#vision_class_main ul li h4{ font-size: 24px; color: #1e1e1e; text-align: center; font-weight: normal; padding:15px 0 5px;}
.vision_class_box{ width: 100%; position: relative;}
.vision_class_mask{ position: absolute; left: 10px; bottom: 10px;}
.vision_class_mask img{ width: 18%;}
/*实录课堂*/
/*企业荣誉*/
#vision_honor{ width: 100%;}
#vision_honor_main{ width: 1220px; margin: 0 auto;}
#vision_honor_left{ width: 540px;  float: left;}
#vision_honor_left video{ width: 100%; height: 400px; display: block; background-color: #2a2a2a;}
#vision_honor_left h4{ width: 100%; height: 60px; line-height: 60px; text-align: center; background-color: #fff; font-size: 20px; color: #484848;}

#vision_honor_right{ width: 680px; float: left;}
#vision_honor_right ul li{ width: 316px;  float: left; margin:0 0 20px 24px; position: relative;}
#vision_honor_right ul li img{ display: block;}
#vision_honor_right ul li h4{ width: 100%; background: rgba(0,0,0,0.5); height: 40px; line-height: 40px; font-size: 18px; color: #fff; text-align: center; font-weight: normal; position: absolute; left: 0; bottom: 0;}
/*企业荣誉*/

/*实录课堂和企业荣誉*/

/*招聘信息*/
#vision_infor{ width: 100%; background-color: #f6f6f8;}
#vision_infor_main{ width: 1220px; margin: 0 auto;}
#vision_infor_main ul li{ width: 398px; float: left; background-color: #fff; margin: 0 0 20px 13px;}
#vision_infor_main ul li:nth-of-type(3n+1){ margin-left: 0;}
.vision_infor_box{ width: 348px; height: 122px; padding: 20px 25px 10px;}
.vision_infor_top{ width: 348px;}
.vision_infor_h{ width: 348px;}
.vision_infor_h h4{ float: left; font-size: 20px; color: #535353;}
.vision_infor_h b{float: right; font-size: 20px; color: #fd7747;}
.vision_infor_top p{ font-size: 16px; color: #6e6e6e; float: left; padding: 10px 0;}
.vision_infor_top p span,.vision_infor_d p span{ display: inline-block; width: 1px; height: 12px; vertical-align: middle; background: #6e6e6e; margin: 0 10px;}
.vision_infor_bottom{ width: 348px; border-top: 1px solid #eeeeee; padding: 10px 0;}
.vision_infor_p{ width: 200px; float: left;}
.vision_infor_p img{ float: left; margin-right: 10px;}
.vision_infor_p h6{ font-size: 14px; color: #5c5c5c; padding-top: 8px;}
.vision_infor_d{ width: 138px; float: right;}
.vision_infor_d p{ font-size: 14px; color: #989898; padding-top: 8px;}

.vision_infor_box_more{ width: 398px; height: 124px;}
.vision_infor_box_more_01 img{ display: block; margin: 28px auto 0;}
.vision_infor_box_more_01 p{ font-size: 16px; color: #989898; text-align: center; padding: 15px 0;}
.vision_infor_box_more_02{ display: none; background-color: #fff; padding-bottom: 20px;}
.vision_infor_box_more_02 img{ display: block; margin: 18px auto 0; }
.vision_infor_box_more:hover .chjy_infor_more_01{ display: none;}
.vision_infor_box_more:hover .chjy_infor_more_02{ display: block;}

/*招聘信息*/

/*学习环境*/
#vision_place{ width: 100%;}
#vision_place ul li{ float: left; margin-left: 0.55%; margin-bottom: 0.55%;}
#vision_place ul li img{ width: 100%; display: block; }
#vision_place ul li:nth-of-type(5n+1){ margin-left: 0;}
#vision_place ul li.vision_space_w1{ width: 24.45%;}
#vision_place ul li.vision_space_w2{ width: 16.2%;}
/*学习环境*/

/*疑惑解答*/
#vision_ask{ width: 100%; background: url(../images/vision_join_bg.jpg) no-repeat center top; padding-bottom: 50px;}
#vision_ask_main{ width: 1220px; margin: 0 auto;}
#vision_ask_main ul li{ float: left; width: 378px; margin:0 0 50px 40px; border: 1px solid #3251fa; line-height: 60px; font-size: 24px;}
#vision_ask_main ul li:nth-of-type(3n+1){ margin-left: 0;}
#vision_ask_main ul li span{ display: block; width: 60px; height: 60px; line-height: 60px; background-color: #3251fa; float: left; font-size: 28px; color: #fff; text-align: center; border-radius: 0 10px 20px 0; margin-right: 20px;} 
/*疑惑解答*/

/*结尾*/
#vision_ending{ width: 100%; background: url(../images/vision_ending_bg.jpg) no-repeat center top; padding-bottom: 220px;}
#vision_ending_main{ width: 1220px; margin: 0 auto; color: #fff;}
#vision_ending_main h4{ font-size: 72px; padding: 180px 0 0 50px;}
#vision_ending_main p{ font-size: 60px; padding:50px 0 50px 50px;}
#vision_ending_main a{ display: block; width: 315px; height: 66px; line-height: 66px; background-color: #fc2ba5; font-size: 36px; color: #fff; margin: 30px 0 0 50px; text-align: center; border-radius: 50px;}
/*结尾*/

@media only screen and (min-width: 768px) and (max-width: 1024px){
	
	#vision_banner{ display: none;}
	#vision_banner_yd{ display: block;}
	
	.vision_title{ width: 100%; padding: 2rem 0 1.4rem;}
	.vision_title h2{font-size: 2.8rem; }
	.vision_title h2 span.vision_title_b{ padding-left: 1rem;}
	.vision_title h3{ font-size: 1.6rem; padding: 0.5rem 2rem 0; }
	
	#vision_suit a,#vision_aid a,#vision_circle a,#vision_choice a,#vision_class>a,#vision_infor a,#vision_ask a{width: 46%; height: 4.6rem; line-height: 4.6rem; font-size: 1.8rem; margin: 2rem auto; }
	
	#vision_why,#vision_learn{padding-bottom: 2rem;}
	#vision_why_main{ width: 100%; }
	#vision_why_main ul li{ width: 32%; margin-left: 1%;}
	#vision_why_main ul li:nth-of-type(1){ margin-left: 1%;}
	.vision_why_area{ padding: 0.5rem 0 0.6rem;}
	.vision_why_area h4{ font-size: 1.6rem;}
	.vision_why_area p{ font-size: 1.2rem; padding-top: 0.6rem;}
	
	#vision_learn_main{ width: 100%; background: none;}
	#vision_learn_sub{ width: 100%; float: none;  margin: 1rem 0 0 0;}
	#vision_learn_sub h4 { width: 22.5%; float: left; margin-left: 2%; height: 5rem; line-height: 5rem; font-size: 1.4rem; margin-bottom: 1rem;}
	#vision_learn_sub h4 span{font-size: 2.0rem; margin:0 0.5rem; line-height: 5rem;}
	
	#vision_learn_exp{ width: 100%; float: none;}
	.vision_learn_pack ul { margin-top: 1rem;}
	.vision_learn_pack ul li{ width:47%; margin:0 0 1rem 2%;}
	.vision_learn_pack ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_learn_pack ul li h4{ height: 4rem; line-height: 4rem; font-size: 1.4rem;}
	
	#vision_suit_main{ width: 100%;}
	#vision_suit_main ul li{ width: 30%; margin-left: 2.5%;}
	#vision_suit_main ul li:nth-of-type(1){ margin-left: 2.5%;}
	#vision_suit_main ul li img{ width: 60%; margin:0 0 0 20%;}
	.vision_suit_text{ width: 100%; }
	.vision_suit_text h4{ font-size: 1.8rem; padding-top: 0.8rem; text-align: center;}
	.vision_suit_text span{ margin: 0.8rem auto;}
	.vision_suit_text p{ font-size: 1.2rem; line-height: 1.8rem; padding:0 1rem 1rem; text-align: center;}
	
	#vision_benefit{padding-bottom: 2rem;}
	#vision_benefit_main{ width:100%;}
	#vision_benefit_main img{ float: none; width: 90%; margin-left: 5%;}
	.vision_benefit_text{ width: 90%; float: none;  margin-left: 5%;}
	.vision_benefit_text h4{ font-size: 2.4rem;  padding-top: 1rem;}
	.vision_benefit_text p{ font-size: 1.4rem; line-height: 2.4rem; padding: 2rem 0;}
	.vision_benefit_text a{ width: 40%; height: 4rem; margin: 0 auto; font-size: 1.8rem; line-height: 4rem;}
	
	#vision_jobs_main{ width: 100%;}
	#vision_jobs_main ul li{ width: 47%; margin:0 0 1rem 2%;} 
	#vision_jobs_main ul li:nth-of-type(1){ margin-left: 2%;}
	#vision_jobs_main ul li h4{ height:4rem; line-height: 4rem; font-size: 1.6rem; }
	
	#vision_course{ padding-bottom: 2rem;}
	#vision_course_main{ width: 96%; padding: 1%; margin:0 auto;}
	#vision_course_sub{ display: none;}
	#vision_course_exp{ width: 100%;}
	.vision_content{ width: 100%;  margin: 0; display: block;}
	.vision_content_left{ width: 100%; float: none;}
	.vision_content_left img{ width: 100%; display: block;}
	.vision_content_left img:nth-of-type(1){ margin-bottom: 0;}
	.vision_content_left img:nth-of-type(2),.vision_content_left img:nth-of-type(3){ display: none;}
	.vision_content_right{ float: none; height: auto; width:96%; padding: 0; padding: 2%; margin-bottom: 1rem;}
	.vision_content_right h4{ font-size: 2.0rem;}
	.vision_content_right h3{ font-size: 1.8rem; padding: 1.2rem 0 1rem;}
	.vision_content_right p{ font-size: 1.4rem; line-height: 2.4rem;}
	
	#vision_teacher{ padding-bottom: 2rem;}
	#vision_teacher_main{ width: 100%;}
	#vision_teacher_main ul li{ width: 47%; margin:0 0 1rem 2%;}
	#vision_teacher_main ul li:nth-of-type(1){ margin-left: 2%;}
	.vision_teacher_area{ height: 19rem;}
	.vision_teacher_area h4{ font-size: 1.8rem; padding: 1rem 0 0.6rem;}
	.vision_teacher_area h5{ font-size:1.6rem; }
	.vision_teacher_area span{ margin: 1rem auto; }
	.vision_teacher_area p{ font-size: 1.4rem; line-height: 2.4rem; padding: 0 1rem 1rem;}
	
	#vision_works{ padding-bottom: 2rem;}
	#vision_works_main{ width: 100%;}
	#vision_works_sub{ width: 100%;}
	#vision_works_sub h4{ width: 22.5%; height: 5rem; font-size: 1.4rem; line-height: 5rem; margin-left: 2%;}
	#vision_works_sub h4:nth-of-type(1){ margin-left: 2%;}
	
	#vision_works_exp{ width: 100%; padding-top: 1rem;}
	.vision_works_area{ width: 100%; height: auto;}
	.vision_works_area ul li{ position: static; float: left; width: 47%; height: 18rem; margin:0 0 1rem 2%; overflow: hidden;}
	.vision_works_area ul li:nth-of-type(1),.vision_works_area ul li:nth-of-type(5){ width: 96%; height: 22rem; margin-left: 2%;}
	.vision_works_area ul li:nth-of-type(2),.vision_works_area ul li:nth-of-type(8){ display: none;}
	.vision_works_area ul li img{ width: 100%;}
	
	#vision_actual{ padding-bottom: 1.4rem;}
	#vision_project{ padding-bottom: 2rem;}
	#vision_project_main{ width: 100%;}
	#vision_project_main ul li{ width: 30%; height: auto; margin-left: 2.5%; font-size: 1.4rem;}
	#vision_project_main ul li:nth-of-type(1){ margin-left: 2.5%;}
	#vision_project_main ul li h4{ height: 3rem; line-height: 3rem; font-size: 1.6rem;}
	.vision_project_mask{ height: 20rem;}
	.vision_project_mask h5{ font-size: 1.8rem; margin-top: 2.8rem;}
	.vision_project_mask span{ width: 3rem; height: 0.2rem; margin: 2rem auto;}
	.vision_project_mask p{ font-size: 1.4rem; line-height: 2.6rem;}
	
	#vision_aid_main{ width: 100%;}
	#vision_aid_main ul li{ width: 47%; margin: 0 0 1.0rem 2%;}
	#vision_aid_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_aid_area{ width: 100%; }
	.vision_aid_area h4{ font-size: 1.8rem; padding-top: 1.6rem;}
	.vision_aid_area p{ font-size: 1.2rem;  padding: 0.3rem 0 1.6rem;}
	
	#vision_circle{ padding-bottom: 2rem;}
	#vision_circle_main{ width: 100%; height: auto; background: none; margin-bottom: 2rem;}
	.example{ display: none;}
	#vision_circle_yd{ display: block;}
	
	.vision_circle_box{ width: 100%;}
	.vision_circle_box h4{ font-size: 1.8rem; color: #2b2b2b; margin: 0.5rem 0 1rem 0.5rem;}
	.vision_circle_box ol{ margin-top: 0;}
	.vision_circle_box ol li{ width: 47%; margin-left: 2%;}
	.vision_circle_box ol li:nth-of-type(1){ display: none;}
	
	#vision_choice{padding-bottom: 2rem;}
	#vision_choice_main{ width: 100%;}
	#vision_choice_main ul li{ width: 45%; height: 9rem; margin: 0 0 1rem 2%; padding: 1rem 1%;}
	#vision_choice_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	#vision_choice_main ul li h4{ font-size: 1.8rem;}
	#vision_choice_main ul li span{ margin: 1rem auto;}
	#vision_choice_main ul li p{ font-size: 1.2rem; line-height: 2.2rem; padding: 0 1rem;}
	
	#vision_record,#vision_class{padding-bottom: 2rem;}
	#vision_class_main{ width: 100%;}
	#vision_class_main ul li{ width: 43%; padding: 1rem; margin:0 0 1rem 2%;}
	#vision_class_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_class_box>img{ width: 98%; }
	#vision_class_main ul li h4{ font-size: 1.4rem; padding:1.5rem 0 0.5rem;}
	
	#vision_honor_main{ width: 100%;}
	#vision_honor_left{ width: 100%; float: none; padding-bottom: 1rem;}
	#vision_honor_left video{ width: 90%; height: auto; margin-left: 5%;}
	#vision_honor_left h4{width: 90%; margin-left: 5%; height: 4rem; line-height: 4rem; font-size: 1.4rem; }
	
	#vision_honor_right{ width: 90%; float: none;  margin-left: 5%; border: 1px solid #f00;}
	#vision_honor_right ul li{ width: 49%; margin:0 0 1rem 2%;}
	#vision_honor_right ul li:nth-of-type(2n+1){ margin-left: 0;}
	#vision_honor_right ul li img{ width: 100%;}
	#vision_honor_right ul li h4{height: 4rem; line-height: 4rem; font-size: 1.4rem;}
	
	#vision_infor_main{ width: 100%; padding: 2rem 0 1rem; background: #f6f6f8;}
	#vision_infor_main ul li{ width:90%; margin: 0 0 1.4rem 5%;}
	#vision_infor_main ul li:nth-of-type(3n+1){ margin-left: 5%;}
	.vision_infor_box{width: 90%; height: 9rem; padding: 1rem 1rem 0.5rem;}
	.vision_infor_top{ width: 100%;}
	.vision_infor_h{ width: 100%;}
	.vision_infor_h h4{font-size: 1.4rem;}
	.vision_infor_h b{ font-size: 1.4rem;}
	.vision_infor_top p{ font-size: 1.2rem; color: #6e6e6e; padding: 1rem 0;}
	.vision_infor_top p span,.vision_info_d p span{margin: 0 1rem;}
	.vision_infor_bottom{ width: 100%; padding: 1rem 0;}
	.vision_infor_p{ width: 65%;}
	.vision_infor_p img{ margin-right: 0.5rem;}
	.vision_infor_p h6{ font-size: 1.4rem; padding-top: 0.3rem;}
	.vision_infor_d{ width: 35%;}
	.vision_infor_d p{ font-size: 1.4rem; padding-top: 0.3rem;}
	
	.vision_infor_box_more{ width: 100%; height: 9rem; overflow: hidden;}
	.vision_infor_box_more_01{ height: 9rem;}
	.vision_infor_box_more_01 img{ margin: 2rem auto 0;}
	.vision_infor_box_more_01 p{ font-size: 1.4rem; padding: 1rem 0;}
	.vision_infor_box_more_02{ height: 6rem;}
	.vision_infor_box_more_02 img{ margin: 1rem auto; }
	
	#vision_place ul li{ margin-left: 2%; margin-bottom: 1rem;}
	#vision_place ul li:nth-of-type(5n+1){ margin-left: 2%;}
	#vision_place ul li.vision_space_w1{ width: 47%;}
	#vision_place ul li.vision_space_w2{ display: none}
	
	#vision_ask{ padding-bottom: 2rem;}
	#vision_ask_main{ width: 100%; }
	#vision_ask_main ul li{ width: 47%; margin:0 0 1rem 2%; line-height: 5rem; font-size: 1.4rem;}
	#vision_ask_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	#vision_ask_main ul li:nth-last-of-type(1){ display: none;}
	#vision_ask_main ul li span{width: 5rem; height: 5rem; line-height: 5rem; font-size: 1.8rem; margin-right: 1rem} 
	
	#vision_ending{ padding-bottom: 5rem;}
	#vision_ending_main{ width: 100%;}
	#vision_ending_main h4{ font-size: 3rem; padding: 4rem 0 0 3rem;}
	#vision_ending_main p{ font-size: 1.8rem; padding:1.6rem 0 1rem 3rem;}
	#vision_ending_main a{ width: 40%; height: 4.6rem; line-height: 4.6rem; font-size: 1.8rem; margin: 1.2rem 0 0 3rem;}
	
	
}
@media only screen and (min-width: 320px) and (max-width: 767px){
	
	#vision_banner{ display: none;}
	#vision_banner_yd{ display: block;}
	
	.vision_title{ width: 100%; padding: 1.4rem 0 1.0rem;}
	.vision_title h2{font-size: 1.6rem; }
	.vision_title h2 span.vision_title_b{ padding-left: 0.6rem; background-size:30%;}
	.vision_title h2 span.vision_title_d{ width: 0.1rem; height:0.1rem; padding-left: 0.3rem;}
	.vision_title h3{ font-size: 1.0rem; padding: 0.6rem 1rem 0; }
	
	#vision_suit a,#vision_aid a,#vision_circle a,#vision_choice a,#vision_class>a,#vision_infor a,#vision_ask a{width: 70%; height: 3rem; line-height: 3rem; font-size: 1.4rem; margin: 1rem auto; }
	
	#vision_why,#vision_learn{padding-bottom: 0.6rem;}
	#vision_why_main{ width: 100%; }
	#vision_why_main ul li{ width: 80%; float: none; margin:0 0 0.6rem 10%;}
	#vision_why_main ul li:nth-of-type(1){ margin-left: 10%;}
	.vision_why_area{ padding: 0.3rem 0 0.4rem;}
	.vision_why_area h4{ font-size: 1.4rem;}
	.vision_why_area p{ font-size: 1.0rem; padding-top: 0.2rem;}
	
	#vision_learn_main{ width: 100%; background: none;}
	#vision_learn_sub{ width: 100%; float: none;  margin: 0.5rem 0 0 0;}
	#vision_learn_sub h4 { width: 47%; float: left; margin-left: 2%; height: 3rem; line-height: 3rem; font-size:1.0rem; margin-bottom: 1rem;}
	#vision_learn_sub h4 span{font-size: 1.6rem; margin:0 0.5rem; line-height: 3rem;}
	
	#vision_learn_exp{ width: 100%; float: none;}
	.vision_learn_pack ul { margin-top: 0;}
	.vision_learn_pack ul li{ width:47%; margin:0 0 1rem 2%;}
	.vision_learn_pack ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_learn_pack ul li h4{ height: 2rem; line-height: 2rem; font-size: 1.0rem;}
	
	#vision_suit_main{ width: 100%;}
	#vision_suit_main ul li{ width: 90%; margin:0 0 1rem 5%;}
	#vision_suit_main ul li:nth-of-type(1){ margin-left: 5%;}
	#vision_suit_main ul li img{ width: 30%; margin:0; float: left; padding-right: 4%}
	.vision_suit_text{ width: 66%; float: left;}
	.vision_suit_text h4{ font-size: 1.4rem; padding-top: 0.8rem; }
	.vision_suit_text span{ margin:0.5rem 0;}
	.vision_suit_text p{ font-size: 1.0rem; line-height: 1.8rem; padding:0;}
	
	#vision_benefit{padding-bottom: 1.4rem;}
	#vision_benefit_main{ width:100%;}
	#vision_benefit_main img{ float: none; width: 90%; margin-left: 5%;}
	.vision_benefit_text{ width: 90%; float: none;  margin-left: 5%;}
	.vision_benefit_text h4{ font-size: 1.8rem;  padding-top: 1rem;}
	.vision_benefit_text p{ font-size: 1.0rem; line-height: 1.6rem; padding: 1rem 0;}
	.vision_benefit_text a{ width: 70%; height: 3rem; margin: 0 auto; font-size: 1.4rem; line-height: 3rem;}
	
	#vision_jobs_main{ width: 100%;}
	#vision_jobs_main ul li{ width: 47%; margin:0 0 0.6rem 2%;} 
	#vision_jobs_main ul li:nth-of-type(1){ margin-left: 2%;}
	#vision_jobs_main ul li h4{ height:2rem; line-height: 2rem; font-size: 1.0rem; }
	
	#vision_course{ padding-bottom: 1.4rem;}
	#vision_course_main{ width: 96%; padding: 1%; margin:0 auto;}
	#vision_course_sub{ display: none;}
	#vision_course_exp{ width: 100%;}
	.vision_content{ width: 100%;  margin: 0; display: block;}
	.vision_content_left{ width: 100%; float: none;}
	.vision_content_left img{ width: 100%; display: block;}
	.vision_content_left img:nth-of-type(1){ margin-bottom: 0;}
	.vision_content_left img:nth-of-type(2),.vision_content_left img:nth-of-type(3){ display: none;}
	.vision_content_right{ float: none; height: auto; width:94%; padding: 0; padding: 3%; margin-bottom: 0.5rem;}
	.vision_content_right h4{ font-size: 1.4rem; padding-top: 0.3rem;}
	.vision_content_right h3{ font-size: 1.2rem; padding: 0.6rem 0 0.4rem}
	.vision_content_right p{ font-size: 1.0rem; line-height: 1.8rem}
	
	#vision_teacher{ padding-bottom: 1.4rem;}
	#vision_teacher_main{ width: 100%;}
	#vision_teacher_main ul li{ width: 90%; margin:0 0 0.8rem 5%;}
	#vision_teacher_main ul li:nth-of-type(1){ margin-left: 5%;}
	.vision_teacher_area{ height: auto;}
	.vision_teacher_area h4{ font-size: 1.4rem; padding: 0.6rem 0 0.4rem;}
	.vision_teacher_area h5{ font-size:1.2rem; }
	.vision_teacher_area span{ margin: 0.6rem auto; }
	.vision_teacher_area p{ font-size: 1.0rem; line-height: 1.6rem; padding: 0 0.2rem 1rem;}
	
	#vision_works{ padding-bottom: 1.4rem;}
	#vision_works_main{ width: 100%;}
	#vision_works_sub{ width: 100%;}
	#vision_works_sub h4{ width: 47%; height: 3rem; font-size: 1.0rem; line-height: 3rem; margin-left: 2%; margin-bottom: 0.5rem;}
	#vision_works_sub h4:nth-of-type(1){ margin-left: 2%;}
	
	#vision_works_exp{ width: 100%; padding-top: 0;}
	.vision_works_area{ width: 100%; height: auto;}
	.vision_works_area ul li{ position: static; float: left; width: 96%; height: auto; margin:0 0 0.2rem 2%;}
	.vision_works_area ul li img{ width: 100%;}
	
	#vision_actual{ padding-bottom: 1.4rem;}
	#vision_project{ padding-bottom: 1.4rem;}
	#vision_project_main{ width: 100%;}
	#vision_project_main ul li{ width: 80%; height: auto; margin-left: 10%; font-size: 1.4rem; margin-bottom: 0.6rem;}
	#vision_project_main ul li:nth-of-type(1){ margin-left: 10%;}
	#vision_project_main ul li h4{ height: 2.6rem; line-height: 2.6rem; font-size: 1.4rem;}
	.vision_project_mask{ height: 23rem;}
	.vision_project_mask h5{ font-size: 1.6rem; margin-top: 2.8rem;}
	.vision_project_mask span{ width: 3rem; height: 0.2rem; margin: 2rem auto;}
	.vision_project_mask p{ font-size: 1.2rem; line-height: 2.6rem;}
	
	#vision_aid_main{ width: 100%;}
	#vision_aid_main ul li{ width: 47%; margin: 0 0 1.0rem 2%;}
	#vision_aid_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_aid_area{ width: 100%; height: 5rem;}
	.vision_aid_area h4{ font-size: 1.2rem; padding-top:0.8rem;}
	.vision_aid_area p{ font-size: 0.9rem;  padding: 0.1rem 0 0.8rem;}
	
	#vision_circle{ padding-bottom: 1.4rem;}
	#vision_circle_main{ width: 100%; height: auto; background: none; margin-bottom: 1.4rem;}
	.example{ display: none;}
	#vision_circle_yd{ display: block;}
	
	.vision_circle_box{ width: 100%;}
	.vision_circle_box h4{ font-size: 1.4rem; color: #2b2b2b; margin: 0.5rem 0 1rem 0.5rem;}
	.vision_circle_box ol{ margin-top: 0;}
	.vision_circle_box ol li{ width: 47%; margin-left: 2%;}
	.vision_circle_box ol li:nth-of-type(1){ display: none;}
	
	#vision_choice{padding-bottom: 1.4rem;}
	#vision_choice_main{ width: 100%;}
	#vision_choice_main ul li{ width: 45%; height: 6rem; margin: 0 0 0.8rem 2%; padding: 0.8rem 1%;}
	#vision_choice_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	#vision_choice_main ul li h4{ font-size: 1.4rem;}
	#vision_choice_main ul li span{ margin: 0.6rem auto;}
	#vision_choice_main ul li p{ font-size: 0.9rem; line-height: 1.4rem; padding: 0 0.4rem;}
	
	#vision_record,#vision_class{padding-bottom: 1.4rem;}
	#vision_class_main{ width: 100%;}
	#vision_class_main ul li{ width: 44%; padding: 0.3rem; margin:0 0 1rem 2%;}
	#vision_class_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_class_box>img{ width: 99%; }
	#vision_class_main ul li h4{ font-size: 1.0rem; padding:0.6rem 0 0.3rem;}
	.vision_class_mask img{ width: 25%;}
	
	#vision_honor_main{ width: 100%;}
	#vision_honor_left{ width: 100%; float: none; padding-bottom: 1rem;}
	#vision_honor_left video{ width: 98%; height: auto; margin-left: 1%;}
	#vision_honor_left h4{width: 98%; margin-left: 1%; height: 3rem; line-height: 3rem; font-size: 1.0rem; }
	
	#vision_honor_right{ width: 98%; float: none;  margin-left: 1%; border: 1px solid #f00;}
	#vision_honor_right ul li{ width: 100%; margin:0 0 0.8rem 0;}
	#vision_honor_right ul li img{ width: 100%;}
	#vision_honor_right ul li h4{height: 2.6rem; line-height: 2.6rem; font-size: 1.0rem;}
	
	#vision_infor_main{ width: 100%; padding: 1rem 0 0.5rem; background: #f6f6f8;}
	#vision_infor_main ul li{ width:96%; margin: 0 0 1.0rem 2%; }
	#vision_infor_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	.vision_infor_box{width: 94%; height: 6rem; padding: 0.8rem 0.6rem 1rem;}
	.vision_infor_top{ width: 100%;}
	.vision_infor_h{ width: 100%;}
	.vision_infor_h h4{font-size: 1.0rem;}
	.vision_infor_h b{ font-size: 1.0rem;}
	.vision_infor_top p{ font-size: 0.9rem; color: #6e6e6e; padding: 0.5rem 0;}
	.vision_infor_top p span,.vision_info_d p span{margin: 0 0.5rem;}
	.vision_infor_bottom{ width: 100%; padding: 0.5rem 0;}
	.vision_infor_p{ width: 60%;}
	.vision_infor_p img{ margin-right: 0.2rem;}
	.vision_infor_p h6{ font-size: 0.7rem; padding-top: 0.4rem;}
	.vision_infor_d{ width: 40%;}
	.vision_infor_d p{ font-size: 0.7rem; padding-top: 0.4rem;}
	
	.vision_infor_box_more{ width: 100%; height: 7.8rem; overflow: hidden;}
	.vision_infor_box_more_01{ height: 7.8rem;}
	.vision_infor_box_more_01 img{ margin: 1rem auto 0;}
	.vision_infor_box_more_01 p{ font-size: 1.0rem; padding: 1rem 0;}
	.vision_infor_box_more_02{ height: 6rem;}
	.vision_infor_box_more_02 img{ margin: 0.5rem auto; }
	
	#vision_place ul li{ margin-left: 2%; margin-bottom: 0.5rem;}
	#vision_place ul li:nth-of-type(5n+1){ margin-left: 2%;}
	#vision_place ul li.vision_space_w1{ width: 96%;}
	#vision_place ul li.vision_space_w2{ display: none}
	
	#vision_ask{ padding-bottom: 1.4rem;}
	#vision_ask_main{ width: 100%; }
	#vision_ask_main ul li{ width: 96%; margin:0 0 0.5rem 2%; line-height: 3rem; font-size: 1.0rem;}
	#vision_ask_main ul li:nth-of-type(3n+1){ margin-left: 2%;}
	#vision_ask_main ul li span{width: 3rem; height: 3rem; line-height: 3rem; font-size: 1.4rem; margin-right: 0.8rem} 
	
	#vision_ending{ padding-bottom: 2.4rem;}
	#vision_ending_main{ width: 100%;}
	#vision_ending_main h4{ font-size: 2rem; padding: 3rem 0 0 1rem;}
	#vision_ending_main p{ font-size: 1.4rem; padding:1.2rem 0 1rem 1rem;}
	#vision_ending_main a{ width: 60%; height: 3rem; line-height: 3rem; font-size: 1.4rem; margin: 0.6rem 0 0 1rem;}
}