/********************** public *******************/
	html,body{
		position: relative;
		height: 100%;
	}


/********************** header *******************/
	header{
		width: 100%;
		height: 120px;
		z-index: 99;
		position: absolute;
		top: 0;
		text-align: center;
		background-color: #333;
		.myContainer{
			padding: 0 10%;
			ul{
				li{
					width: 14%;
					display: inline-block;
					vertical-align: text-bottom;
					a{
						color: #fff;
						font-size: 1.2em;
						transition: .4s all;
						img{
							width: 65px;
							margin-top: 15px;
							transition: .4s all;
						}
						span{
							display: block;
						}
					}
				}
				li:hover{
					a{
						color: #cfb683;
						img{
							transform: scale(1.1);
						}
					}
				}
			}
		}
	}
	.headerBot{
		width: 100%;
		height: 100px;
		top: 120px;
		text-align: center;
		position: absolute;
		background-color: #fff;
		ul{
			margin-top: 15px;
			li{
				display: inline-block;
				padding: 0 15px;
				a{
					img{
						width: 40px;
						transition: all .4s;
					}
					p{
						color: #6c6d74;
						font-size: 1em;
						transition: all .4s;
					}
				}
			}
			li:hover{
				a{
					img{
						transform: scale(1.1);
					}
					p{
						color: #a52e23;
					}
				}
			}
		}
	}


/********************** index ********************/
	.swiper-container {
		height: 100%;
		position: relative;
	    .swiper-slide {
	        img{
	        	width: 100%;
	        }
			.swiperBoxWord{
				position: absolute;
				max-width: 300px;
				right: 10%;
				top: 62%;
				// text-align: left;
				// h2{
				// 	color: #fff;
				// 	line-height: 1.8;
				// 	font-weight: 600;
				// 	font-size: 2.2em;
				// 	letter-spacing: .2em;
				// 	span{
				// 		letter-spacing: 0;
				// 	}
				// }
				// h1{
				// 	color: #fff;
				// 	letter-spacing: 1em;
				// 	font-weight: 600;
				// 	margin-top: 35px;
				// 	font-weight: 300;
				// }
			}
			.swiperBoxWord1{
			}
	    }
	}
	.swiper-pagination{
		bottom: 50px !important;
	}
	.pause{
		right: 39%;
		bottom: 45px;
		z-index: 99;
		width: 10px;
		position: absolute;
	}
	.colBox{
		position: absolute;
		text-align: center;
		left: 0;
		width: 100%;
	}
	.swiper-pagination-bullet{
		width:80px;
		height:8px;
		border-radius: 0;
		background: #fff;
		color: #fff;
		text-align: center;
		margin: 0 20px !important;
		p{
			font-size: .9em;
			margin-top: 10px;
			letter-spacing: .2em;
		}
	}
	.swiper-pagination-bullet-active{
		.bar{
			width:0px;
			height:8px;
			background:#86704c;
			position: relative;
			bottom: 35px;
		}
	}
	.indexSec{
		position: relative;
		img{
			width: 100%;
		}
		.indexSecWord{
			position: absolute;
			top: 47%;
			left: 10%;
			text-align: left;
			width: 25%;
			h2{
				color: #a87f4c;
				margin-bottom: 25px;
				letter-spacing: .2em;
			}
			h4{
				color: #a87f4c;
				margin-bottom: 35px;
				letter-spacing: .2em;
			}
			.indexSecWordP{
				box-shadow: 0 0 10px #efefef;
				padding: 30px 25px;
				background-color: #fff;
				p{
					color: #a87f4c;
					font-size: 1.2em;
					letter-spacing: .2em;
				}
			}
		}
	}
    .indexThr{
    	padding: 5% 0;
    	background-color: #000;
    	.indexThrBox{
	    	.myContainer{
	    		h1{
	    			color: #fff;
	    			margin: 0;
	    			letter-spacing: 1em;
	    			margin-bottom: 5%;
	    			font-weight: 300;
	    		}
	    		.indexThrBoxRow{
	    			margin-bottom: 2%;
	    			.indexThrBoxCol{
	    				margin-right: 2%;
	    				width: 23%;
	    				padding: 0;
	    				position: relative;
	    				overflow: hidden;
	    				p{
	    					position: absolute;
	    					left: 7%;
	    					top: 4%;
	    					color: #fff;
	    					font-size: 1.4em;
	    					letter-spacing: .1em;
	    				}
	    				img{
	    					width: 100%;
	    					transition: .4s all;
	    				}
	    				.indexThrBoxColSmallPng{
	    					width: 55px;
	    					height: auto;
	    					position: absolute;
	    					bottom: 7%;
	    					right: 8%;
	    				}
	    			}
	    			.indexThrBoxCol:last-child{
	    				margin-right: 0;
	    			}
	    			.indexThrBoxCol:hover{
	    				img{
	    					transform: scale(1.2);
	    				}
	    			}
	    		}
	    	}
    	}
    }


/********************** footer *******************/
	.footer{
		padding: 3% 0;
		text-align: left;
		background-color: #242424;
		.row{
			padding: 0 15%;
			margin: 0;
			.footerLeft{
				img{
					width: 80px;
					height: auto;
				}
			}
			.footerRight{
				vertical-align: text-top;
				ul{
					margin-right: 3%;
					display: inline-block;
					li{
						list-style: none;
						text-decoration: none;
						margin-bottom: 15px;
						a{
							color: #fff;
							font-size: 1em;
						}
					}
					li:hover{
						a{
							color: #c9af86;
						}
					}
				}
			}
		}
	}


/********************** pagination ***************/
	.pate{
		text-align: center;
		margin: 30px 0 10px;
		button,
		span{
			display: inline-block;
			min-width: 34px;
			height: 34px;
			line-height: 32px;
			margin: 0 4px 8px;
			padding: 0 10px;
			border: 1px solid #dfe0e0;
			background: #fff;
			color: #58595b;
			font-size: .9em;
			vertical-align: middle;
			box-sizing: border-box;
		}
		button{
			transition: all .2s;
		}
		button:hover,
		button.active{
			color: #fff;
			border-color: #af986a;
			background: #af986a;
		}
		button:disabled{
			color: #b6b6b6;
			border-color: #e6e6e6;
			background: #f7f7f7;
			cursor: default;
		}
		span{
			border-color: transparent;
			background: transparent;
		}
	}


/********************** about ********************/
	.about{
		position: relative;
		top: 120px;
		.aboutSec{
			.myContainer{
				.aboutSecWord{
					text-align: left;
					padding: 4% 5%;
					padding-bottom: 0;
					position: relative;
					bottom: 130px;
					background-color: #fff;
					border: 1px solid #fff;
					transition: all .5s;
					h3{
						color: #af986a;
						margin-bottom: 25px;
					}
					p{
						color: #58595b;
						font-size: 1em;
						letter-spacing: .1em;
					}
					img{
						position: absolute;
						top: 115%;
						left: 48%;
						width: 40px;
						transition: all .5s;
					}
				}
				.aboutSecWordClick{
					padding-top: 12%;
					h3{
						text-align: center;
					}
					img{
						position: absolute;
						top: 60px;
					}
				}

			}
		}
		.aboutThr{
			img{
				width: 100%;
			}
		}
		.aboutFur{
			margin-bottom: 120px;
			img{
				width: 100%;
			}
		}
	}


/********************** men **********************/
	.men{
		position: relative;
		top: 120px;
		margin-bottom: 120px;
		.menSec{
			.myContainer{
				padding: 0 20%;
				p{
					margin-top: 3%;
					margin-bottom: 5%;
					color: #6c6d74;
				}
			}
		}
		.menThr{
			padding: 5% 0;
			.myContainer{
				.menThrRow{
					margin-bottom: 2%;
					.menThrCol{
						width: 48%;
						margin-right: 2%;
						display: inline-block;
						border: 1px solid #dfe0e0;
						.menThrRow2{
							.menThrCol2Left{
								padding: 0;
								padding: 3%;
								.menThrCol2Top{
									padding-bottom: 5px;
									margin-bottom: 15px;
									width: 45%;
									border-bottom: 1px solid #818284;
									h4{
										display: inline-block;
									}
									span{
										margin-left: 15px;
										display: inline-block;
										img{
											margin-right: 5px;
										}
									}
									p{
										font-size: 1em;
										color: #58595b;
									}
								}
								.menThrCol2Bot{
									p{
										padding-right: 15%;
										font-size: .8em;
									}
									span{
										padding-right: 10px;
									}
								}
							}
							.menThrCol2Right{
								padding: 0;
								img{
									width: 100%;
								}
							}
						}
					}
					.menThrCol:nth-child(2n){
						margin-right: 0;
					}
					.menThrCol:hover{
						cursor: pointer;
					}
				}
				.pate{
					text-align: center;
				}
			}
		}
	}

	.intro{
		padding: 5%;
		p{
			font-size: 1.4em;
			line-height: 1.2;
		}
	}


/********************** administration ***********/
	.administration{
		.administrationSec{
			padding: 5% 0;
			.myContainer{
				text-align: center;
				h2{
					color: #333;
					margin-bottom: 25px;
				}
				span{
					color: #818284;
					font-size: 1.2em;
				}
				img{
					width: 100%;
					margin: 5% 0;
				}
				p{
					color: #818284;
					font-size: 1.2em;
					margin-top: 10px;
					text-align: left;
					max-width: 60%;
				}
			}
		}
		.administrationThr{
			margin-top: 5%;
			.administrationThrRow{
				margin: 0;
				a{
					.administrationThrCol{
						overflow: hidden;
						position: relative;
						img{
							width: 100%;
							transition: all .4s;
						}
						.administrationThrColWord{
							top: 40%;
							left: 15%;
							position: absolute;
							h3{
								color: #fff;
								margin-bottom: 15px;
							}
							p{
								color: #fff;
								font-size: 1em;
							}
						}
					}
				}
				a:hover{
					.administrationThrCol{
						img{
							transform: scale(1.1);
						}
					}
				}
			}
		}
	}


/********************** business *****************/
	.business{
		.businessSec{
			padding: 5% 0;
			.myContainer{
				text-align: center;
				h2{
					color: #333;
					margin-bottom: 25px;
				}
				span{
					color: #818284;
					font-size: 1.2em;
				}
				img{
					width: 100%;
					margin: 5% 0;
				}
				p{
					color: #818284;
					font-size: 1.2em;
					margin-top: 10px;
					text-align: left;
					max-width: 60%;
				}
			}
		}
		.businessThr{
			margin-top: 5%;
			.businessThrRow{
				margin: 0;
				a{
					.businessThrCol{
						overflow: hidden;
						position: relative;
						img{
							width: 100%;
							transition: all .4s;
						}
						.businessThrColWord{
							top: 40%;
							left: 15%;
							position: absolute;
							h3{
								color: #fff;
								margin-bottom: 15px;
							}
							p{
								color: #fff;
								font-size: 1em;
							}
						}
					}
				}
				a:hover{
					.businessThrCol{
						img{
							transform: scale(1.1);
						}
					}
				}
			}
		}
	}


/********************** criminal *****************/
	.criminal{
		.criminalSec{
			padding: 5% 0;
			.myContainer{
				text-align: center;
				h2{
					color: #333;
					margin-bottom: 25px;
				}
				span{
					color: #818284;
					font-size: 1.2em;
				}
				img{
					width: 100%;
					margin: 5% 0;
				}
				p{
					color: #818284;
					font-size: 1.2em;
					margin-top: 10px;
					text-align: left;
					max-width: 60%;
				}
			}
		}
		.criminalThr{
			margin-top: 5%;
			.criminalThrRow{
				margin: 0;
				a{
					.criminalThrCol{
						overflow: hidden;
						position: relative;
						img{
							width: 100%;
							transition: all .4s;
						}
						.criminalThrColWord{
							top: 40%;
							left: 15%;
							position: absolute;
							h3{
								color: #fff;
								margin-bottom: 15px;
							}
							p{
								color: #fff;
								font-size: 1em;
							}
						}
					}
				}
				a:hover{
					.criminalThrCol{
						img{
							transform: scale(1.1);
						}
					}
				}
			}
		}
	}


/********************** architecture *************/
	.architecture{
		.architectureSec{
			padding: 5% 0;
			.myContainer{
				text-align: center;
				h2{
					color: #333;
					margin-bottom: 25px;
				}
				span{
					color: #818284;
					font-size: 1.2em;
				}
				img{
					width: 100%;
					margin: 5% 0;
				}
				p{
					color: #818284;
					font-size: 1.2em;
					margin-top: 10px;
					text-align: left;
					max-width: 60%;
				}
			}
		}
		.architectureThr{
			margin-top: 5%;
			.architectureThrRow{
				margin: 0;
				a{
					.architectureThrCol{
						overflow: hidden;
						position: relative;
						img{
							width: 100%;
							transition: all .4s;
						}
						.architectureThrColWord{
							top: 40%;
							left: 15%;
							position: absolute;
							h3{
								color: #fff;
								margin-bottom: 15px;
							}
							p{
								color: #fff;
								font-size: 1em;
							}
						}
					}
				}
				a:hover{
					.architectureThrCol{
						img{
							transform: scale(1.1);
						}
					}
				}
			}
		}
	}


/********************** ask **********************/
	.ask{
	    .askThr{
	    	padding: 5% 0;
	    	.myContainer{
	    		ul{
	    			li{
	    				width: 23%;
	    				margin-right: 1%;
	    				margin-bottom: 10%;
	    				vertical-align: text-top;
	    				display: inline-block;
	    				.askThrColWord{
	    					h3{
	    						color: #595959;
	                            font-weight: 600;
	                            margin-bottom: 15px;
	    					}
	    				}
	    			}
	    			li:nth-child(4n){
	    				margin-right: 0;
	    			}
	    			li:hover{
	    				cursor: pointer;
	    			}
	    		}
	    	}
	    }


		.askBox {
	        position: fixed;
	        bottom: 0;
	        right: 0;
	        width: 100%;
	        height: 100%;
	        z-index: 1002;
	        display: none;
	        z-index: 99;

	        .askBoxSmall {
	            z-index: 999;
	            text-align: center;
	            background-color: #595959;
	            width: 100%;
	            height: 100%;
	            line-height: 1.8;
	            position: relative;
	            display: none;
	            overflow-y: scroll !important;

                .askBoxSmallRight {
                    margin-top: 4%;
                    .time {
                        font-size: 120%;
                        text-align: left;
                        padding: 0 5%;
                        .timeTitle{
                        	text-align: center;
                        }
                        span {
                            color: #fff;
                            display: block;
                            padding-bottom: 6%;
                            font-size: 140%;
                            border-bottom: 1px solid #bbc6d7;
                            vertical-align: text-bottom;
                            img {
                                vertical-align: bottom;
                                margin-right: 14px;
                            }
                        }
                        p {
                            color: #fff;
                            font-size: 110%;
                            margin-top: 4%;
                        }
                    }
                }

                .cat {
                    position: absolute;
                    right: 6%;
                    top: 12%;
                    cursor: pointer;

                    span {
                        font-size: 140%;
                        color: #fff;
                        vertical-align: middle;
                        font-weight: 500;
                    }

                    img {
                        width: 20px;
                        margin-left: 10px;
                    }
                }
	        }
	    }
	}


/********************** history ******************/
	.history{
		position: relative;
		top: 120px;
		margin-bottom: 120px;
		.historySec{
			padding: 20% 0 30% 0;
			background: url('/html/static/home/img/about/history/2.jpg');
			background-size: 100% 100%;
			background-repeat: no-repeat;
			.myContainer{
				position: relative;
				.historySecSwiper{
					justify-content: center;
					text-align: center;
					right: 60px;
					.swiper-wrapper{
						right: 60px;
						.swiper-slide{
							width: 9%;
							position: static;
							h2{
								color: #fff;
								padding-top: 80px;
							}
							h2:hover{
								cursor: pointer;
							}
							.historySecSwiperP{
								display: none;
								p{
									color: #fff;
								}
								img{
									width: 20px;
								}
							}
						}
						.swiper-slide-active{
							width: 360px;
							h2{
								font-size: 5em;
								padding-top: 50px;
								width: 260px;
								height: 200px;
								margin-left: 50px;
								background-color: #c9ae86;
							}
							.historySecSwiperP{
								display: block;
								margin-top: 20%;
								img{
									margin-bottom: 10%;
								}
							}
						}
					}
				}
				.swiper-button-next, .swiper-button-prev{
					top: 25% !important;
				}
				.swiper-button-prev{
					left: 0;
				}
				.swiper-button-next{
					right: 0;
				}
			}
		}
	}


/********************** honer ********************/
	.honer{
		.honerSec{
			margin-bottom: 6%;
			.historyList{
				dd{
					line-height: 2;
					color: #5e5e5e;
				}
				.right{
					dd{
						img{
							margin-right: 10px;
						}
					}
				}
				.left{
					dd{
						img{
							margin-left: 10px;
						}
					}
				}
			}
		}
	}



/********************** contact ******************/
	.contact{
		position: relative;
		top: 120px;
		margin-bottom: 220px;
		.contactFirst{
			padding-top: 80px;
			text-align: center;
			h2{
	    		text-align: center;
				color: #af986a;
				margin-bottom: 30px;
				span{
					display: inline-block;
					position: relative;
				}
				span:before,
				span:after{
					content: "";
				    position: absolute;
				    border-top: 1px solid #af986a;
				    top: 44%;
				    width: 100px;
				}
				span:before{
					right: 100%;
					margin-right: 15px;
				}
				span:after{
					left: 100%;
					margin-left: 15px;
				}
	    	}
	    	span.contactSecSpan{
				font-size: 1.6em;
				margin: 1em 0 1.8em 0;
				display: block;
	    	}
	    	p{
				font-size: 1.6em;
				line-height: 1.4;
				margin-bottom: 15px;
	    	}
	    	ul{
	    		margin: 3% 0;
	    		li{
	    			width: 10%;
	    			margin-right: 3%;
	    			display: inline-block;
	    			img{
	    				width: 100%;
	    				margin: 2% 0 3% 0;
	    				border: 1px solid #efefef;
	    			}
	    			p{
	    				font-size: 1em;
	    			}
	    		}
	    	}
	    	
		}
		.contactSec{
			#map{
				width: 100%;
				height: 591px;
			}
		}
	}


/********************** News *********************/
	.news {
	    .news-sec {
	        ul {
	            li {
	                background-color: #f9f9f9;
	                .news-sec-details {
	                    .container {
	                        border-bottom: 2px solid #3aafe9;
	                        padding: 2% 0;

	                        .row {
	                            position: relative;

	                            .news-sec-details-left {
	                                position: static;

	                                span {
	                                    font-size: 120%;
	                                    color: #595757;
	                                }

	                                h3 {
	                                    color: #595959;
	                                    font-weight: 600;
	                                    padding: 4% 0;
	                                    padding-bottom: 6%;
	                                    font-family: 'ºÚÌå';
	                                }

	                                p {
	                                    padding-right: 35%;
	                                    font-size: 120%;
	                                    color: #595959;
	                                    line-height: 180%;
	                                    font-family: 'ºÚÌå';
	                                }

	                                a.asec {
	                                    color: #595959;
	                                    font-size: 100%;
	                                    position: absolute;
	                                    bottom: 0;
	                                    font-family: 'ºÚÌå';

	                                    i {
	                                        padding: 4px 4px 2px 6px;
	                                        border: 2px solid #595959;
	                                        border-radius: 30px;
	                                        margin-left: 10px;
	                                        font-size: 80%;
	                                    }
	                                }
	                            }

	                            .news-sec-details-right {
	                                img {
	                                    width: 300px;
	                                    height: 200px;
	                                    float: right;
	                                }
	                            }
	                        }
	                    }
	                }
	            }

	            li:first-child {
	                background-color: #fff;

	                .news-sec-details {
	                    .container {
	                        border: 0;
	                    }
	                }
	            }

	            li:last-child {
	                .news-sec-details {
	                    .container {
	                        border: 0;
	                    }
	                }
	            }
	        }
	    }

	    .NewsBox {
	        position: fixed;
	        bottom: 0;
	        right: 0;
	        width: 100%;
	        height: 100%;
	        z-index: 1002;
	        display: none;
	        z-index: 99;

	        .NewsBoxSmall {
	            z-index: 999;
	            text-align: center;
	            background-color: #fff;
	            width: 100%;
	            height: 100%;
	            line-height: 1.8;
	            position: relative;
	            display: none;
	            overflow-y: scroll !important;

                .NewsBoxSmallRight {
                    margin-top: 4%;
                    .time {
                        font-size: 140%;
                        span {
                            color: #595757;
                            display: block;
                            padding-bottom: 6%;
                            font-size: 140%;
                            border-bottom: 1px solid #bbc6d7;
                            vertical-align: text-bottom;
                            img {
                                vertical-align: bottom;
                                margin-right: 14px;
                            }
                        }
                        p {
                            color: #595757;
                            font-size: 110%;
                            margin-top: 4%;
                        }
                    }
                }

                .cat {
                    position: absolute;
                    right: 6%;
                    top: 12%;
                    cursor: pointer;

                    span {
                        font-size: 160%;
                        color: #005bac;
                        vertical-align: middle;
                        font-weight: 500;
                    }

                    img {
                        width: 20px;
                        margin-left: 10px;
                    }
                }
	        }
	    }
	}