@charset "iso-8859-9";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,latin-ext);
body,span,label,div,h1,h2,h3,h4,h5,h6,th,td,tr,li,ul,p{margin:0; padding:0;}
*{outline:none; list-style-type:none; text-decoration:none;}
a{color:#000000;}
body{font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size:13px; }
.clear{clear:both;}
.left{float:left;}
.right{float:right;}
#outline{overflow: hidden;}
#header {text-align: center; height: 285px;}
#header #logo{height: 180px;}
#header #logo a{display:inline-block; height: 100%; margin-bottom: 35px;}
#header #logo a img {height: 100%;}
#header #logo h1{font-weight: normal; height: 80px; line-height: 40px; margin-top: -25px;}
#mini_tel{display: none;height: 30px;line-height: 30px; font-size: 15px;}
/*#header #logo h1 a{}
*/
#header #logo h1 a b{display: inline-block;}
#menu{ height: 50px;  background-color: #00acbd; text-align: center;}
#menu_in{display: inline-block; width: 1170px;  margin:0 auto;}
#menu_1 {float: left; font-weight: 500; line-height: 50px; margin-right: 20px;}
#menu_2, #menu_3{float: right;}
#menu_1 .main, #menu_2 ul, #menu_3 ul{display: inline-block;}
#menu_in ul li{float: left;}
#menu_1 .main .main_sub a{display: inline-block; height: 100%; padding: 0 15px; font-size: 18px;}
#menu_1 .main .main_sub a:hover{background-color: #06e1f770;}
#menu_1 .main .main_sub{position: relative;}
#menu_1 .main .main_sub .sub_main_1{position: absolute; z-index: 1; width: 300px; display: none; top: 50px;}
#menu_1 .main .main_sub .sub_main_1 .sub_1{width: 300px; height: 40px; line-height: 40px; float: none; text-align: left; background-image: url(slider_info_bg.png); margin-bottom: 1px; position: relative;}
#menu_1 .main .main_sub .sub_main_1 .sub_1 a{color: #FFF; width: 80%; padding: 0 10%; height: 100%;}
#menu_1 .main .main_sub .sub_main_1 .sub_1 a:hover{background-color: transparent; text-decoration: underline;}
#menu_1 .main .main_sub:hover .sub_main_1{display: block;}
#menu_1 .main .main_sub .sub_main_1 li:hover .sub_main_1_1{display: block;}
.sub_main_1_1{position: absolute; left: 300px; margin-top: -40px; width: 300px; padding-left: 1px; display: none;}

.sub_1_1_1{width: 100%; background-image: url(slider_info_bg.png); margin-bottom: 1px;}
#menu_2{margin-right: 20px; line-height: 50px;}
#menu_3 {margin-top: 5px;}
#menu_3 ul li {margin-left: 5px; line-height: 40px; }
#menu_3 ul li a{display: inline-block; background-color: #3D3D3B; color: #FFF; height: 30px; width: 30px; border-radius: 50%;}
#menu_3 ul li a i{line-height: 30px;}



/**/
#mini_menu{position: fixed; top: 0; left: -300px; z-index: 999; height: 100%; overflow-y: scroll; background-color: #FFF; width: 300px;}
#m_m_icon{display: none; position: fixed;top: 20px; z-index: 999; background-color: #FFF; padding: 10px; border:solid 1px #656565; cursor: pointer; left:20px;}
#m_m_icon_2{display: none; position: fixed;top: 20px; z-index: 999; background-color: #FFF; padding: 10px; border:solid 1px #656565; cursor: pointer; left:20px;}
#mini_search {text-align: center; display: none;}
#mini_search form{margin:0; display: inline-block; width: 90%;}
#mini_search form input{width: 100%; margin-top: 10px; margin-bottom: 10px; line-height: 34px; padding: 5px; float: left;background-image: url(search_btn.png);background-size: 48px;background-repeat: no-repeat;background-position: right;border: solid 1px #CCC;border-radius: 5px;}
#mini_search form i{width: 30px; line-height: 34px; background-color: #666; color: #FFF; margin-top: 20px; padding-left: 5px;}
#mini_menu_content ul li{border-bottom: 1px solid #f6f6f6;}
#mini_menu_content ul li a{color: #656565;line-height: 45px;padding: 10 20px;}
#mini_menu_content ul li a span{display: inline-block; width: 160px;}
#mini_menu_content ul li i{width: 20px; margin-right: 20px; float: right; padding:10px 20px; cursor: pointer; text-align: right;}
#mini_menu_content ul li .mini_product_menu_1{padding-left: 30px; display: block;}
#mini_menu_content ul li .mini_product_menu_1 li{list-style-type: disc; list-style-position: inside;}
#mini_menu_content ul li ul li{border:none; border-top: solid 1px #f6f6f6; }
#mini_menu_content ul li ul li ul{text-indent: 20px; font-size: 11px;}
#mini_menu_content ul li ul li a{padding-left: 0;margin-left: -8px;}
#mini_menu_content ul li ul li ul li a{line-height: 30px;}
#mini_menu_content ul li .mini_product_menu_1 {display: none;}
#mini_social{text-align: center; margin-top: 30px;}
#mini_social i{width: 40px; height: 40px; background-color: #3D3D3B; line-height: 40px; color: #FFF; border-radius: 50%;}

/**/



#slider .slider_info_area {width: 90%;position: absolute;bottom: 0; padding: 20px 5%;background-image: url(slider_info_bg.png);color: #FFF;font-size: 30px;}

#content #homepage_out{width: 1170px; margin:0 auto; }
#content #homepage{width: 1040px; margin:0 auto; margin-top: 30px;}
.gray{background-color: #7B7B7E; color: #FFF;}
.gray a{color: #FFF;}
.blue{background-color: #00acbd;}
#content #homepage li{display: inline-block; width: 250px; height: 280px; float: left; margin:0 5px 10px 5px;}
#content #homepage li h2{ width: 90%; margin:0 auto; text-align: center; margin-top: 10px; line-height: 25px;  height: 50px;}
#content #homepage li .part_img{display: block; width: 80px; height: 80px; background-color: #FFF; margin:10px auto 10px auto; border-radius: 50%; border:solid 5px #FFF; box-shadow: 1px 1px 1px 1px #999;}
#content #homepage li .part_detail{width: 80%; margin:0 10%; text-align: center; position: relative; height: 80px;}
#content #homepage li .part_detail .read{display: inline-block; width: 100%; margin-top: 10px; position: absolute; bottom: 0; left: 50%; margin-left: -50%;}
#content #homepage li .part_detail .read:hover{text-decoration: underline;}
#content #homepage .alt_calisma{display: inline-block; width: 96%; padding: 0 2%; text-align: center; font-size: 12px;}
#content #homepage .alt_calisma li{width: 100%; height: auto; line-height:20px; }
#content #homepage .alt_calisma li:hover{text-decoration: underline;}

#content #page_img{width: 100%; height: 200px; overflow: hidden; position: relative; border-bottom: solid 1px #e5e5e5;}
#content #page_img img{width: 100%; min-height: 100%;}
#content #page_img .title{display: table; width:1170px; height: 200px; position: absolute; left: 50%; top: 0; margin-left: -585px;}
#content #page_img .title h2{display: table-cell; font-size: 40px; vertical-align: middle; text-align: center;}
#content #page_img .title h2 span{display: inline-block; background-image: url(white_bg.png); padding: 5px 40px;box-shadow: 1px 1px 1px #CCC; position: absolute; left: 0px; bottom: 20px; font-size: 30px;}

#content #page_txt{width: 1170px; margin:30px auto; font-size: 15px !important; line-height: 25px !important; text-align: left;}
#content #page_txt .article_detail_img{float: left; width: 150px; height: 150px; margin-right: 15px; margin-bottom: 15px; border:solid 1px #e5e5e5; border-radius: 10px;}
#content #page_txt .text_detail{float: left; width: 1003px;}

#articles{width: 1170px; margin:30px auto;}
#articles .article{display: table; width: 1128px; height: 180px; padding: 20px; border:solid 1px #e5e5e5; margin-bottom: 20px;}
#articles .article .article_img{float: left; width: 100px; height: 100px; margin-right: 20px; border:solid 1px #e5e5e5; border-radius: 50%;}
#articles .article .article_abstract{display: table-cell; vertical-align: middle; font-size: 15px !important; line-height: 25px !important; text-align: justify;}
#articles .article .article_abstract .article_title{margin-bottom: 10px;}
#articles .article .article_abstract .article_read{display: inline-block; font-style: italic; margin-top: 10px; border:solid 1px #e5e5e5; padding: 5px 10px; background-color: #CEE9F6; box-shadow: 1px 1px 1px #e5e5e5;}
#articles .article .article_abstract .article_read:hover{background-color: #8dd2f3;}


#contact_area{ border:1px solid #e2e2e2; padding: 50px 60px; margin-bottom: 20px;}
#contact_area #left_box{width: 40%; float: left;}
#contact_area #left_box input{width: 98%; padding: 0 1%;  margin-bottom: 20px; line-height: 32px; border:solid 1px #e5e5e5;}
#contact_area #left_box select{width: 98%; line-height: 40px; height: 40px; border:solid 1px #e5e5e5;}
#contact_area #right_box{width: 50%; margin-left: 5%; float: right;}
#contact_area #right_box textarea{width: 98%; padding: 1% 1%; height:142px;  resize: none; margin-bottom: 20px; border:solid 1px #e5e5e5;}
#contact_area #right_box input{width: 98%; height: 40px;  border:solid 1px #e5e5e5; background-color: #3D3D3B; color: #FFF; font-size: 16px;}

#contact_area .info_area{width: 100%; line-height: 40px; height: 40px; text-align: center; margin-top: 20px; color: #FFF;}
.red{background-color: #e74c3c;}
.green{background-color: #2ecc71;}


#footer{margin-top: 30px; width: 100%; text-align: center; height: 50px; line-height: 50px; background-color: #3D3D3B; color: #FFF;}
@media only screen and (max-width: 1170px) {
body{overflow-x: hidden;}
#header{height: 310px;}
#mini_search{display: block;}
#m_m_icon{display: inline-block;}
#menu{display: none;}
#content #homepage{width: 100%;}
#content #homepage_out{width: 100%;}
#content #homepage_out{width: 100%;}
#content #homepage li{width: 23%; margin: 0 1%;}

#content #page_txt{width: 90%;}
#articles{width: 100%;}
#articles .article{width: 80%; padding: 5%; margin:0 auto; margin-bottom: 5%;}
#content #page_img .title{width: 100%; margin-left: -50%; height: 15%;}
#content #page_txt .text_detail{width: 100%;}
#mini_tel{display: inline-block; font-size: 15px;}

#content #page_img{height: auto;}




}
@media only screen and (min-width: 0px) and (max-width: 860px) {
#content #homepage li{width: 46%; margin: 0 2%;}
#content #homepage li{margin-bottom: 30px;}
#content #homepage{margin-top: 20px;}

}
@media only screen and (min-width: 0px) and (max-width: 767px) {
#articles .article .article_img_out{display: inline-block; width: 100%; text-align: center; margin-bottom: 20px;}
#articles .article .article_img{float: none;}
#articles .article .article_abstract{display: block;}
#contact_area #left_box{width: 100%; margin-bottom: 20px;}
#contact_area #right_box{width: 100%;}


}
@media only screen and (min-width: 0px) and (max-width: 600px) {    
#content #homepage li{width: 96%; margin: 0 2%;}
#content #homepage li{margin-bottom: 10px;}
#content #homepage{margin-top: 10px;}      
#content #page_txt .article_detail_img{float: none;}
#content #page_txt .article_detail_img{width: 100px; height: 100px;}
#content #page_img .title h2 span{font-size: 25px;}
#footer{font-size: 8px;}
}
@media only screen and (min-width: 0px) and (max-width: 480px) {
 

}
@media only screen and (min-width: 0px) and (max-width: 400px) {


}