@charset "utf-8";



/* CSS Document */



.f_lft{float:left}      .f_rgt{float:right}      .f_clr{clear:both}



.menu{height:55px; background:#54acd2 repeat; font-weight:bold; line-height:normal}



.nav{width:1000px; margin:0 auto; font-size:17px; font-weight:normal}



.logo{padding:13px 25px 0 0; width:123px; list-style-type:none; float:left}



.navUl{list-style-type:none; padding:16px 0 0 0; width:500px; float:left}     .navUl li{float:left; margin-right:32px; padding:0 0 11px 0}



.navUl li a{color:#FFF; text-decoration:none}    .navUl li:hover{border-bottom:4px solid #FFF}







/*Template List Page*/



.main{width:100%; max-width:62.5em; margin:4.125em auto 0 auto}



.lft_con{width:74.4%; float: right;}



.lft_cmn{padding:4.5em 3.125em 2.25em 3.125em; width:86.29%; border:1px solid #efefef; background:#FFF; border-radius:4px; margin-top:0.55em}



.rgt_cmn{padding:1.3em 1.625em 1.3em 1.625em; width:18.2%; border: 1px solid #efefef; background: #f8f8f8; float:left; position: relative; border-radius: 4px; margin-top:0.55em}



.rgt_h2{font-size:1.05em; font-weight: 500; color: #3d4351; padding-left:1.47em}



.rgt_cmn h2{font-size:1.125em; color:#161718; font-weight:700; margin:1.444em 0 0.555em 0}



.rgt_cmn ul{list-style-type:none}      .rgt_cmn ul li{height: 32px; line-height: 32px;}



.rgt_cmn ul li a{color:#686c78; text-decoration:none; font-size:0.944em}    .rgt_cmn ul li a:hover{text-decoration:underline}



.lft_cmn h1{font-size:1.88em; color:#3d4351; font-weight:normal; text-align:center; margin:0 0 1.17em 0; line-height:1.2em}



.tem_img{box-shadow: 0 1px 1px 1px rgba(0,0,0,0.1); -webkit-box-shadow: 0 1px 1px 1px rgba(0,0,0,0.1); transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s}

.tem_img:hover{box-shadow: 0 8px 15px 2px rgba(0,0,0,0.1); -webkit-box-shadow: 0 8px 15px 2px rgba(0,0,0,0.1)}



.lft_cmn a{display:block; text-align:center; margin-bottom:1.75em}



.lft_cmn p{text-align:left; font-size:1.05em; line-height:1.78em; margin-bottom:1.3125em; color:#686c78}



.startbtn{margin:0 0 3.125em 13.4em}



.startbtn a{display: block; text-align: center; border-radius: 0.444em; border: 1px solid #44c4e7; text-decoration: none; font-size: 1em; width: 49.10%; height:11%; line-height:3em; color: #44c4e7; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s}



.startbtn a:hover{background: #44c4e7; color: #fff}



.related_ctn{padding:3.5em 3.125em 3.5em 3.125em; width:86.29%; border:1px solid #e7e7e7; background:#FFF; margin:1.875em 0 4.125em 0; border-radius:4px}



.related_ctn h3{font-size: 1.55em; font-weight: normal; color: #3d4351; margin:0 0 0.3em 0}



.related_ctn ul li{float:left;  width:47%; list-style-type:disc; list-style-position:outside; margin:0.75em 1.875em 0 0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:1.3em}



.related_ctn ul li:nth-child(2n){margin-right:0}



.related_ctn ul li a{color:#686c78; text-decoration:none}    .related_ctn ul li a:hover{text-decoration:underline; color:#44c4e7}







/*Template Catalog Page*/



.banBg{background:url(../jpg/tem_bg.jpg) no-repeat center center !important}



.tem_ban{width:66.66em; margin:0 auto; padding:8.54em 0 5.40em 0}



.tem_ban h1{font-size:2.77em; color:#FFF; font-weight:400; text-align:center; margin:0 0 0.45em 0}



.tem_ban p{font-size:1.27em; color:#FFF; text-align:center; word-spacing:200; font-weight:400; line-height:1.5em; opacity:0.7}



.tem_ban ul{list-style-type:none; margin:0 auto 0 auto}



.tem_ban ul li{color:#FFF; text-align:center}



.cat_img {width: 100%; max-width: 100%; display: block}



.tem_ban ul li a{display:block; text-align:center; border-radius:0.444em; border:1px solid #FFF; text-decoration:none; font-size:1em; width:13.66em; height:3em; line-height:3em; color:#FFF; margin:3.60em auto 0 auto; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s}



.tem_ban ul li a:hover{background: #fff; color:#44c4e7;}



.tem_con{width:74.4%; padding:0 0 3.5em 0; max-width:74.4%; float: right;position: relative}



.tem_con ul li{list-style-type:none; margin:0 0 1.3125em 0; width:31.45%; float:left; box-shadow:0 1px 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1); transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s}



.tem_con ul li:hover{box-shadow:0 8px 15px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0 8px 15px 2px rgba(0, 0, 0, 0.1)}



.tem_con ul li:nth-child(3n){margin-right:0}



.tem_con ul li span{display: block; border-top: 1px solid #e4e4e4; font-size: 0.88em; float: left; width: 94.5%; padding: 6.94% 0 6.94% 5.5%; text-align: left; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: #FFF}



.tem_con ul li span a{text-decoration:none; display:block; width:100%; line-height:1.5em; color:#686c78; overflow: hidden; white-space: nowrap; text-overflow: ellipsis}



.tem_con ul li span a:hover{color:#44c4e7}



.rgt_cmn ul li:hover > a{color:rgba(68, 196, 231,1); text-decoration:none}







.slider-div{



    position: absolute;



    width:0.22em;



    height:16em;



    left: 1.1em;



    right: 4.22em;



    background: #e9eaeb;



}



.slider-div-contain{



    position: relative;



    width: 100%;



    height:100%;



}



.slider-div-handle{



    position:absolute;



    top: 0;



    width:0.22em;



    height:1.77em;



    background: #44c4e7;



}