/***********HOME************/
nav{
 width: 100%;
 height: 150px;
 position: fixed;
 z-index: 99;
 background-color: white;
}
#logo{
 width: 554px;
 height: 86px;
 float:left; 
 margin-left: 250px;
 margin-top: 40px;
}
#logo img{
 width: 80%;
}
#main_menu{
 width: 20%;
 height: 100%;
 float: right;
 margin-right: 10%;
 display: flex;
}
#main_menu li{
 height: 35px;
 width: 25%;
 text-align: center;
 margin-top: 50px;
 padding-top: 15px;
}
#main_menu li a{
 display: block;
 width: 100%;
 height: 100%;
 text-decoration: none;
 color:black;
 transition-duration: 0.5s;
 transition-property: color;
 transition-timing-function: ease;
 transition-delay: 0s; 
}
#main_menu li a:hover{
 color:goldenrod;
}
header{
 width: 100%;
 position: relative;
 top:150px;
 background-image: url(../image/header_img.png);
 background-repeat:no-repeat;
 background-position:center center;
 background-attachment:fixed;
}
header h1{
 position: relative;
 top: 50%;
 font-size: 2em;
 text-align: center;
 color: white;
}
main{
 width: 100%;
 height: auto;
 position: relative;
 padding-top: 200px;
}
.title{
 width: 100%;
 height: 85px;
 text-align: center;
 background-color: #CDC931;
 font-size: 1.5em;
 padding-top: 60px;
}
.title-text{
 width: 80%;
 height: 150px;
 line-height: 1.8em;
 padding-left: 10%;
 padding-right: 10%;
 padding-top: 80px;
}
#main-sec-1{
 background-color: #B4D6D9;
}
#main-sec-2{
 background-color: #F9F7A2;
}
#main-sec-3{
 background-color: #B4D6D9;
}
#main-sec-4{
 background-color: #F9F7A2;
}
#main-sec-5{
 background-color: white;
 height: 700px;
 padding-top: 0px;
}
#main-sec-6{
 background-color: white;
 width: 100%;
 height: 1663px;
 padding-top: 0px;
}
.main-sec{
 margin-left: auto;
 margin-right: auto;
 width: 90%;
 height: 780px;
 padding-top: 100px;
}
.main-sec ul{
 width: 100%;
 height: auto;
 display: flex;
 justify-content: center;
}
.main-sec ul li{
 width: 25%;
}
.main-sec ul li img{
 width: 100%;
}
#main-sec-4 ul li{
 width: 70%;
}
#main-sec-5 ul{
 justify-content: space-between;
}
#main-sec-5 ul li{
 width: 45%;
}
#main-sec-6-img{
 width: 90%;
 margin-left: auto;
 margin-right: auto;
}
#main-sec-6-img img{
 width: 100%;
}
#main-sec-6 ul{
 width: 70%;
 height: auto;
 position: relative;
 top: -100px;
 margin-left: auto;
 margin-right: auto;
 display: flex;
 justify-content: space-between;
}
#main-sec-6 ul li{
 width: 20%;
 height: auto;
}
#main-sec-6 ul li img{
 display: block;
 width: 100%;
 background-color: darkgoldenrod;
 border-radius: 50%;
}
#main-sec-6 ul li p{
 padding-top: 100px;
 line-height: 1.8em;
}
footer{
 width: 100%;
 height: 550px;
 background-color: #365B5E;
 margin-top: 200px;
}
#footer_menu{
 width: 20%;
 height: 50px;
 padding-top: 50px;
 margin-left: auto;
 margin-right: auto;
 display: flex;
 justify-content: space-between;
 border-bottom: 1px solid white;
}
#footer_menu li{
 width: 22%;
 height: 30px;
 text-align: center;
 padding-top: 10px;
}
#footer_menu li a{
 display: block;
 width: 100%;
 height: 100%;
 color: wheat;
 text-decoration: none;
 text-align: center;
 transition-duration: 0.5s;
 transition-property: color;
 transition-timing-function: ease;
 transition-delay: 0s; 
}
#footer_menu li a:hover{
 color: goldenrod;
}
#socil{
 width: 80%;
 height: 220px;
 margin-left: auto;
 margin-right: auto;
 display: flex;
 padding-top: 80px;
 justify-content: space-between;
}
#socil li{
 width: 50%;
 height: 200px;
}
#socil_logo{
 border-right: 1px solid white;
}
#socil_fb a{
 display: block;
 width: 60px;
 height: 60px;
 background-image: url(../image/FB.png);
 margin-left: 20%;
 transition-duration: 0.5s;
 transition-property: background-image;
 transition-timing-function: ease;
 transition-delay: 0s;
}
#socil_fb a:hover{
 background-image: url(../image/FB_1.png);
}
#socil_fb h1{
 margin-left: 20%;
 margin-top: 2%;
 color: white;
}
#Copyright{
 color: wheat;
 text-align: center;
 padding-top: 50px;
 padding-bottom: 50px;
}

/***********ABOUT************/
.about-sec{
 width: 90%;
 height: auto;
 margin-left: auto;
 margin-right: auto;
}
#about-sec-1{
 margin-bottom: 100px;
}
#about-sec-1 img{
 display: block;
 width: 100%;
 margin-top: 100px;
 margin-left: auto;
 margin-right: auto;
}
#about-sec-1 h2{
 width: 80%;
 font-size: 1.5em;
 margin-top: 5%;
 margin-left: auto;
 margin-right: auto;
}
#about-sec-1 h3{
 width: 80%;
 font-size: 1.2em;
 color: #B7B104;
 margin-top: 2%;
 margin-left: auto;
 margin-right: auto;
}
#about-sec-1 p{
 width: 80%;
 font-size: 1em;
 margin-top: 1%;
 margin-left: auto;
 margin-right: auto;
}
#about-sec-2 ul{
 width: 100%;
 height: auto;
 display: flex;
 justify-content: center;
 padding-top: 100px;
 padding-bottom: 100px;
}
#about-sec-2 ul li{
 width: 30%;
 height: auto;
 margin-left: 10px;
}
#about-sec-2 ul li img{
 width: 100%;
}
#about-sec-2-text{
 padding-top: 100px;
 border: 1px solid black;
}
#about-sec-2-text p{
 margin-left: 4em;
 line-height: 1.5em;
}
#about-sec-2-text h3{
 font-size: 1.2em;
 margin-top: 1.8em;
 margin-left: 4em;
 color: #CDC931;
 line-height: 1.5em;
}
#about-sec-3{
 width: 70%;
}
#about-sec-3 h1{
 width: 200px;
 height: 20px;
 border-radius: 35px;
 background-color: #589C9A;
 color: white;
 text-align: center;
 font-size: 1.5em;
 padding: 20px;
}
#about-sec-3 h2{
 width: 800px;
 height: 20px;
 border-radius: 35px;
 background-color: #CDC931;
 color: white;
 text-align: center;
 font-size: 1.3em;
 padding: 20px;
 margin-left: auto;
 margin-right: auto;
 margin-top: 100px;
}
#about-sec-3 h4{
 width: 100%;
 height: 20px;
 border-radius: 35px;
 text-align: center;
 font-size: 1.3em;
 padding: 20px;
 margin-top: 20px;
}
#about-sec-3 h5{
 width: 300px;
 height: 20px;
 border-radius: 35px;
 background-color: #F05255;
 color: white;
 font-size: 1.2em;
 text-align: center;
 padding: 20px;
 margin-top: 20px;
}
#about-sec-3 p{
 width: 80%;
 height: auto;
 font-size: 1em;
 line-height: 1.8em;
 padding: 20px;
 margin-top: 20px;
 margin-left: auto;
 margin-right: auto;
}

/***********e-catalogT************/
#e-catalog-sec-1 ul{
 width: 90%;
 height: auto;
 margin-left: auto;
 margin-right: auto;
 margin-top: 100px;
 margin-bottom: 100px;
 display: flex;
 justify-content: center;
}
#e-catalog-sec-1 ul li{
 width: 40%;
 height: auto;
 margin-left: 10px;
}
#e-catalog-sec-1 ul li img{
 width: 100%;
}
#e-catalog-sec-1 ul li h1{
 width: 300px;
 height: 30px;
 background-color: #589C9A;
 border-radius: 20px;
 color: white;
 text-align: center;
 font-size: 1.3em;
 margin-left: auto;
 margin-right: auto;
 margin-top: 50px;
 padding-top: 10px;
}
#e-catalog-sec-1 ul li p{
 width: 70%;
 height: auto;
 font-size: 1em;
 margin-left: auto;
 margin-right: auto;
 padding-top: 30px;
 line-height: 1.8em;
}
#e-catalog-sec-1 .btn{
 display: block;
 width: 100px;
 height: 30px;
 background-color: #F05255;
 border-radius: 20px;
 color: white;
 text-align: center;
 text-decoration: none;
 font-size: 1.3em;
 margin-left: auto;
 margin-right: auto;
 margin-top: 20px;
 padding-top: 10px;
 transition-duration: 0.5s;
 transition-property: background-color;
 transition-timing-function: ease;
 transition-delay: 0s;
}
#e-catalog-sec-1 .btn:hover{
 background-color: gold;
}

/***********contact************/
#contact-sec-1{
 margin-top: 150px;
}
#contact-sec-1 p{
 width: 60%;
 height: auto;
 line-height: 1.8em;
 margin-left: auto;
 margin-right: auto;
}
#map{
 width: 70%;
 height: auto;
 margin-top: 100px;
 margin-left: auto;
 margin-right: auto;
}
#contact-sec-1 h1{
 width: 250px;
 height: 40px;
 background-color: #F05255;
 color: white;
 font-size: 1.3em;
 text-align: center;
 padding-top: 15px;
 border-radius: 30px;
 margin-left: auto;
 margin-right: auto;
 margin-top: 100px;
 margin-bottom: 100px;
}
.info{
 width: 60%;
 height: auto;
 margin-left: auto;
 margin-right: auto;
}
.info li{
 display: flex;
 margin-bottom: 20px;
}
.info li img{
 display: block;
 width: 60px;
 height: auto;
}
.info li h5{
 margin-left: 20px;
 padding-top: 20px;
}