.rec_top{
    width: 60%;
    margin: 30px auto 60px;
    max-width: 840px;
    padding: 10px 0 50px;
    color:#fff;
    text-align: center;
    font-size: 1.2rem;
    
}
.rec_catch{
    width: 80%;
    margin: 0 auto;
}
.rec_top p{
    margin: 30px auto;
    color:fff;
}
.rec_work{
    width: 100%;
    margin: 40px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.rec_work_item1{
    width: 50%;
    display: flex;
    flex-direction: column;
}
.rec_work_item2{
    width: 46%;
    display: flex;
    flex-direction: column;
}
.rec_work_item2 img{
    margin: 10px 0;
}
.rec_st_1{
    width: 100%;
    font-size: 2rem;
    color:#fff;
    text-align: center;
    padding: 5px 0;
    border:3px solid #fff;
    border-radius: 8px;
    margin: 50px auto 50px;
}
.rec_pdf{
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.rec_btn{
    width: 48%;
}
.rec_btn img:hover{
    -webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.2));
}
.rec_big{
    font-size: 1.8rem;
}
.rec_large{
    font-size: 2.2rem;
    font-weight: 600;
}
.rec_large a{
        text-decoration: none;

}
.rec_large a:hover{
filter: drop-shadow(0px 3px 3px rgba(0,0,0,0.6));
}
.contact{
    width: 48%;
    margin: 0 auto 60px;
}
.contact img:hover {
	-webkit-transform: translateY(-2px);
	        transform: translateY(-2px);
filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.2));
}
.concept_area{
    width: 60%;
    padding: 30px 0 60px ;
    margin: 0 auto;
    max-width: 840px;
}
.mark{
    width: 250px;
    margin: 0 auto;
}
.conce_catch{
    text-align: center;
    font-size: 3rem;
    font-weight: 500;
    color: #704233;
    line-height: 4rem;
}
.conce_box{
    width: 100%;
    margin: 50px auto;
    display:flex;
    justify-content: space-between;
}
.conce_photo{
    width: 40%;
    text-align: center;
    line-height: 1.6rem;
    font-size:1.2rem;
}
.conce_photo img{
    border-radius: 10px;
    margin-bottom: 5px;
}
.conce_photo span{
    font-size:0.9rem;
}
.conce_copy{
    width: 56%;
    margin: 40px 0;
}
.conce_copy img{
    width: 90%;
    margin:20px auto 0; 
}
.conce_staff{
    width: 100%; 
    margin: 40px auto;
}
.conce_staff img{
    border-radius: 10px;
    box-shadow: 2px 2px 6px 0 rgba(0,0,0,0.2); 
}
@media screen and (max-width:900px){
.rec_top{
    width: 70%;
    margin: 20px auto 40px;
    max-width: 840px;
    padding: 10px 0 20px;
    color:#fff;
    text-align: center;
    font-size: 1.2rem;
}
.rec_work{
    width: 100%;
    margin: 40px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.rec_work_item1{
    width: 50%;
    display: flex;
    flex-direction: column;
}
.rec_work_item2{
    width: 46%;
    display: flex;
    flex-direction: column;
}
.rec_work_item2 img{
    margin: 10px 0;
}
.rec_st_1{
    width: 100%;
    font-size: 1.7rem;
    color:#fff;
    text-align: center;
    padding: 5px 0;
    border:3px solid #fff;
    border-radius: 8px;
    margin: 50px auto 50px;
}
.concept_area{
    width: 70%;
    padding: 30px 0 60px ;
    margin: 0 auto;
    max-width: 840px;
}
.mark{
    width: 200px;
    margin: 0 auto;
}
.conce_catch{
    text-align: center;
    font-size: 3rem;
    font-weight: 500;
    color: #704233;
    line-height: 4rem;
}
.conce_box{
    width: 100%;
    margin: 30px auto;
    display:flex;
    justify-content: space-between;
}
.conce_photo{
    width: 40%;
    text-align: center;
    line-height: 1.6rem;
    font-size:1.2rem;
}
.conce_photo img{
    border-radius: 10px;
    margin-bottom: 5px;
}
.conce_photo span{
    font-size:0.9rem;
}
.conce_copy{
    width: 56%;
    margin: 40px 0 20px;
}
.conce_copy img{
    width: 90%;
    margin:20px 5% 0; 
}
.conce_staff{
    width: 100%; 
    margin: 20px auto 30px;
}
}
@media screen and (max-width:480px){
.rec_top{
    width: 90%;
    margin: 30px auto 60px;
    max-width: 840px;
    padding: 10px 0 50px;
    color:#fff;
    text-align: center;
    font-size: 1.2rem;
    
}
.rec_catch{
    width: 80%;
    margin: 0 auto;
}
.rec_top p{
    margin: 20px auto;
    color:fff;
    line-height: 1.8rem;
}
.rec_work{
    width: 100%;
    margin: 40px auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.rec_work_item1{
    width: 80%;
    display: flex;
    flex-direction: column;
    margin: o auto 20px;
}
.rec_work_item2{
    width: 80%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}
.rec_work_item2 img{
    margin: 10px 0;
}
.rec_st_1{
    width: 100%;
    font-size: 1.2rem;
    color:#fff;
    text-align: center;
    padding: 5px 0;
    border:3px solid #fff;
    border-radius: 8px;
    margin: 40px auto 30px;
    font-weight: 600;
}
.rec_pdf{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.rec_btn{
    width: 80%;
    margin: 10px auto;
}

.rec_big{
    font-size: 1.8rem;
    line-height: 3rem;
}
.rec_large{
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 4rem;
}
.rec_large a{
        text-decoration: none;

}
.contact{
    width: 80%;
    margin: 0 auto 40px;
}
.concept_area{
    width: 80%;
    padding: 0 0 30px ;
    margin: 0 auto;
    max-width: 480px;
}
.mark{
    width: 150px;
    margin: 0 auto;
}
.conce_catch{
    text-align: center;
    font-size: 2.5rem;
    font-weight: 500;
    color: #704233;
    line-height: 3rem;
}
.conce_box{
    width: 100%;
    margin: 20px auto;
    display:flex;
    flex-direction: column-reverse;
    justify-content: space-between;
}
.conce_photo{
    width: 60%;
    margin: 20px auto 0;
    text-align: center;
    line-height: 1.6rem;
    font-size:1.2rem;
}
.conce_photo img{
    border-radius: 10px;
    margin: 20px auto 0;
}
.conce_photo span{
    font-size:0.9rem;
}
.conce_copy{
    width: 100%;
    margin: 0 0;
}
.conce_copy img{
    width: 90%;
    margin:20px 5% 0; 
}
.conce_staff{
    width: 100%; 
    margin: 20px auto 40px;
}
.conce_staff img{
    border-radius: 10px;
    box-shadow: 2px 2px 6px 0 rgba(0,0,0,0.2); 
}
}