@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video { max-width: 100%; }
/* IE 6 does not support max-width so default to width 100% */
.ie6 img { width: 100%; }
/*
    Dreamweaver Fluid Grid Properties
    ----------------------------------
    dw-num-cols-mobile:     4;
    dw-num-cols-tablet:     8;
    dw-num-cols-desktop:    12;
    dw-gutter-percentage:   25;
    
    Inspiration from "Responsive Web Design" by Ethan Marcotte 
    http://www.alistapart.com/articles/responsive-web-design
    
    and Golden Grid System by Joni Korpi
    http://goldengridsystem.com/
*/

.fluid { clear: both; margin-left: 0; width: 100%; float: left; display: block; }
.fluidList { list-style: none; list-style-image: none; margin: 0; padding: 0; }
/* Mobile Layout: 480px and below. */
  
.gridContainer { margin-left: auto; margin-right: auto; width: 100%; padding-left: 0%; padding-right: 0%; clear: none; float: none; }
#div1 { }
.zeroMargin_mobile { margin-left: 0; }
.hide_mobile { display: none; }
/* TOP */
.topItem { width: 90%; margin: auto; height: 60px; background-color: #FFF; }
.topItem .logoSpace { float: left; }
.topItem .logoSpace img { padding: 20px 0px; width: 60%; }
.topItem .navSpace { display: none; }
/* Banner */
.bannerSpace { width: 100%; height: 220px; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/Banner2.jpg); }
/* Event Information */
.eventInfoSkin { padding: 0px 0px 40px 0px; width: 90%; margin: auto; }
.titleSpace { padding: 20px 0px; }
.titleSpace img { width: 100px; }
.info_desc { padding-bottom: 20px; font-size: 1em; line-height: 1.6em; color: #777; }
.info_more_desc { width: 100%; margin-bottom: 40px; }
.info_more_desc>ul { width: 100%; }
.info_more_desc>ul>li { width: 100%; margin-right: 0px; margin-bottom: 30px; font-size: 0.8em; line-height: 1.6em; color: #777; float: none; }
.info_more_desc>ul>li:last-child { margin-right: 0px; margin-bottom: 0px; }
.sub_title { font-size: 1em; font-weight: bold; color: #fa3e66 !important; padding-bottom: 10px; }
.sub_title>img { margin-right: 5px; }
/* Instructor Introduction */
.iiSkin { width: 100%; padding-bottom: 0px; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/bg_2.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.iiSpace { width: 90%; margin: auto; }
.userSpace { width: 100%; }
.userSpace>ul>li { width: 100%; margin-bottom: 40px; margin-right: 0px; float: none; height: 400px; overflow: hidden; }
.userSpace>ul>li:nth-child(4n) { margin-right: 0px; }
.u_face { text-align: center; }
.u_face img { width: 160px; }
.u_name { text-align: center; font-size: 1.4em; padding: 10px 0px; color: #fa3e66; }
.u_subname { text-align: center; font-size: 0.8em; padding: 0px 0px 10px 0px; color: #CCC; }
.u_info { font-size: 0.8em; color: #FFF; line-height: 24px; padding: 0px 5%; }
/* High Light */
.hlSpace { padding: 0px 0px 40px 0px; width: 90%; margin: auto; }
.hl_descSpace { width: 100%; }
.hl_descSpace>ul>li { width: 80%; height: 280px; float: left; margin: 0px 0px 20px 0px; border: solid 1px #fa3e66; text-align: center; padding: 10%; color: #777; cursor: pointer; }
.hl_descSpace>ul>li:last-child { margin: 0px 0px 0px 0px; }
.hl_descSpace>ul>li:hover { border: solid 1px #B02023; }
.hl_img>img { width: 100px; }
.hl_title { color: #fa3e66; padding: 20px 0px; font-size: 1.6em; }
.hl_desc { text-align: left; line-height: 24px; font-size: 0.8em; }
/* Sign Up */
.signupSkin { width: 100%; padding-bottom: 40px; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/bg_3.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.signupSpace { width: 90%; margin: auto; }
.s_inputSkin { width: 100%; }
.si_left { width: 100%; margin: 0px 0px 40px 0px; float: none; }
.si_right { width: 100%; float: none; }
.si_right>div:nth-child(1) { font-size: 1.0em; font-weight: bold; color: #fa3e66; }
.si_right>div:nth-child(2) { font-size: 0.8em; line-height: 1.6em; padding: 10px; margin-top: 10px; border: dashed 1px #CCC; color: #777; }
.si_left>ul>li { }
.oneList { width: 100%; }
.oleft { width: 100%; float: none; font-size: 0.8em; height: auto; line-height: normal; text-align: left; margin: 10px 0px 0px 0px; color: #999; }
.oright { width: 100%; border-bottom: solid 1px #CCC; float: none; height: 40px; color: #999; font-size: 14px; }
.oright>input[type="text"] { height: 38px; width: 100%; background-color: transparent; border: none; font-size: 16px; font-family: "微软雅黑", "Microsoft YaHei UI"; color: #333333; }
.oright>p { line-height: 40px; padding-left: 20px; color: #333; font-size: 16px; }
a.btn { width: 100%; height: 40px; display: block; background-color: #fa3e66; font-size: 16px; text-align: center; line-height: 40px; color: #FFF; }
/* Footer */
.FooterSkin { width: 100%; background-color: #333; color: #fff; text-align: center; padding: 30px 0px 90px 0px; font-size: 0.8em; }
.FooterSkin a{ color: #fa3e66;}

/* 浮动层 */
.floatSpace{ width: 100%; background-color:rgba(0,0,0,0.50); height: 60px; position:fixed; bottom: 0px; text-align:center; line-height: 60px;}
.floatSpace a{ display:inline-block; width: 80%; height: 32px; color:#FFF; background-color:#fa3e66; line-height: 32px;}
.floatSpace img{ width: 20px; margin-top:-4px; margin-right:5px; display:inline-block;}

/*报名成功*/
.SignUp_Complete{ width: 100%; background-color:rgba(0,0,0,0.50); height: 100%; position:fixed; top: 0px; text-align:center; z-index:8920;}
.scSkin{ width: 80%; height: 160px; background-color:#FFF; border-radius: 10px; margin: 30% auto auto auto; color:#1aad19; font-size: 1em; font-weight: bold;}
.scSkin>img{ width: 60px; padding: 30px 0px;}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 321px) {
.info_more_desc>ul>li { font-size: 0.9em; }
.u_name { font-size: 1.4em; }
.u_subname { font-size: 0.9em; }
.u_info { font-size: 0.9em; }
.userSpace>ul>li { height: 380px; }
.hl_title { padding: 20px 0px; font-size: 1.6em; }
.hl_desc { line-height: 24px; font-size: 0.9em; }
.FooterSkin { font-size: 0.9em; }
.bannerSpace { height: 240px;}
}

@media only screen and (min-width: 376px) {
.info_more_desc>ul>li { font-size: 1em; }
.u_name { font-size: 1.6em; }
.u_subname { font-size: 1em; }
.u_info { font-size: 1em; }
.userSpace>ul>li { height: 400px; }
.hl_img>img { width: 120px; }
.hl_title { padding: 20px 0px; font-size: 1.6em; }
.hl_desc { line-height: 1.6em; font-size: 1em; }
.FooterSkin { font-size: 1em; }
.bannerSpace { height: 280px;}
}

@media only screen and (min-width: 481px) {
.gridContainer { width: 100%; padding-left: 0%; padding-right: 0%; clear: none; float: none; margin-left: auto; }
#div1 { }
.zeroMargin_tablet { margin-left: 0; }
.hide_tablet { display: none; }
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
.gridContainer { width: 100%; /*    max-width: 1232px;*/ padding-left: 0%; padding-right: 0%; margin: auto; clear: none; float: none; margin-left: auto; }
#div1 { }
.zeroMargin_desktop { margin-left: 0; }
.hide_desktop { display: none; }
/* TOP */
.topItem { width: 1000px; margin: auto; height: 80px; background-color: #FFF; }
.topItem .logoSpace { float: left; }
.topItem .logoSpace img { padding: 20px 0px; width: 100%; }
.topItem .navSpace { float: right; font-size: 16px; line-height: 80px; display: block; }
.topItem .navSpace>ul>li { float: left; padding: 0px 10px; }
.topItem .navSpace>ul>li a { display: block; height: 60px; width: 100%; }
.topItem .navSpace>ul>li a.on { border-bottom: solid 2px #fa3e66; color: #fa3e66; }
/* Banner */
.bannerSpace { width: 100%; height: 500px; background-position: center; background-repeat: no-repeat; background-size: contain 100%; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/Banner.jpg);  /*transition-property: all; transition-duration: 0.5s; transition-timing-function: cubic-bezier(0.22, 0.56, 0.25, 0.72); transition-delay: 0s; */ }
/*.bannerSpace:hover { background-size:contain 105%; background-color: #DDD; transition-property: all; transition-duration: 0.5s; transition-timing-function: cubic-bezier(0.22, 0.56, 0.25, 0.72); transition-delay: 0s; }*/

/* Event Information */
.eventInfoSkin { padding: 0px 0px 80px 0px; width: 940px; margin: auto; }
.titleSpace { padding: 40px 0px; }
.titleSpace img { width: 120px; }
.info_desc { padding-bottom: 40px; font-size: 18px; line-height: 32px; color: #777; }
.info_more_desc { width: 100%; margin-bottom: 40px; }
.info_more_desc>ul>li { width: 300px; margin-right: 20px; font-size: 14px; line-height: 32px; color: #777; float: left; }
.info_more_desc>ul>li:last-child { margin-right: 0px; }
.sub_title { font-size: 18px; font-weight: bold; color: #fa3e66 !important; padding-bottom: 10px; }
.sub_title>img { margin-right: 5px; }
/* Instructor Introduction */
.iiSkin { width: 100%; padding-bottom: 40px; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/bg_2.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.iiSpace { width: 940px; margin: auto; }
.userSpace { width: 100%; }
.userSpace>ul>li { width: 220px; margin-bottom: 40px; margin-right: 20px; float: left; height: 450px; overflow: hidden; }
.userSpace>ul>li:nth-child(4n) { margin-right: 0px; }
.u_face { text-align: center; }
.u_face img { width: 180px; }
.u_name { text-align: center; font-size: 24px; padding: 10px 0px; color: #fa3e66; }
.u_subname { text-align: center; font-size: 14px; padding: 0px 0px 10px 0px; color: #CCC; }
.u_info { font-size: 14px; color: #FFF; line-height: 24px; }
/* High Light */
.hlSpace { padding: 0px 0px 80px 0px; width: 940px; margin: auto; }
.hl_descSpace { width: 100%; }
.hl_descSpace>ul>li { width: 238px; height: 330px; float: left; margin: 0px 20px 0px 0px; border: solid 1px #fa3e66; text-align: center; padding: 30px; color: #777; cursor: pointer; }
.hl_descSpace>ul>li:last-child { margin: 0px 0px 00px 0px; }
.hl_descSpace>ul>li:hover { border: solid 1px #B02023; }
.hl_img>img { width: 140px; }
.hl_title { color: #fa3e66; padding: 20px 0px; font-size: 24px; }
.hl_desc { text-align: left; line-height: 24px; font-size: 14px; }
/* Sign Up */
.signupSkin { width: 100%; padding-bottom: 80px; background-image: url(http://hangjianetindex.image.alimmdn.com/e/e1107/bg_3.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.signupSpace { width: 940px; margin: auto; }
.s_inputSkin { width: 100%; }
.si_left { width: 580px; margin: 0px 20px 0px 0px; float: left; }
.si_right { width: 340px; float: left; }
.si_right>div:nth-child(1) { font-size: 16px; font-weight: bold; color: #fa3e66; }
.si_right>div:nth-child(2) { font-size: 14px; line-height: 24px; padding: 10px; margin-top: 10px; border: dashed 1px #CCC; color: #777; }
.si_left>ul>li { }
.oneList { width: 560px; }
.oleft { width: 100px; float: left; font-size: 16px; height: 40px; line-height: 40px; text-align: right; margin: 0px 10px 0px 0px; color: #333; }
.oright { width: 440px; border-bottom: solid 1px #CCC; float: left; height: 40px; color: #999; font-size: 14px; }
.oright>input[type="text"] { height: 38px; width: 440px; background-color: transparent; border: none; font-size: 16px; font-family: "微软雅黑", "Microsoft YaHei UI"; color: #333333; }
.oright>p { line-height: 40px; padding-left: 20px; color: #333; font-size: 16px; }
a.btn { width: 280px; height: 40px; display: block; background-color: #fa3e66; font-size: 16px; text-align: center; line-height: 40px; color: #FFF; }
/* Footer */
.FooterSkin { width: 100%; background-color: #333; color: #fff; text-align: center; padding: 30px 0px 110px 0px; font-size: 16px; }
.FooterSkin a{ color: #fa3e66;}

/* 浮动层 */
.floatSpace{ width: 100%; background-color:rgba(0,0,0,0.50); height: 80px; position:fixed; bottom: 0px; text-align:center; line-height: 80px;}
.floatSpace a{ display:inline-block; width: 280px; height: 40px; color:#FFF; background-color:#fa3e66; line-height: 40px;}
.floatSpace img{ width: 24px; margin-top:-4px; margin-right:5px; display:inline-block;}

/*报名成功*/
.SignUp_Complete{ width: 100%; background-color:rgba(0,0,0,0.50); height: 100%; position:fixed; top: 0px; text-align:center; z-index:8920;}
.scSkin{ width: 280px; height: 160px; background-color:#FFF; border-radius: 10px; margin: 10% auto auto auto; color:#1aad19; font-size: 16px; font-weight: bold;}
.scSkin>img{ width: 60px; padding: 30px 0px;}
}