@charset "utf-8";
/* CSS Document */

/* --------------------  sec 1 start -------------------------*/

#section1bg{ padding: 100px 0 100px; background-image: url(../img/sub1_sec1_bg.jpg); background-size: cover; background-position:left center; 
        background-repeat: no-repeat; background-attachment: fixed; min-height: 100vh; overflow: hidden }
#section1bg h2 { font-size:28px; text-align: center; color:#fff; font-weight: 600; margin-bottom:30px;}

ul.case_list li span { padding:10px; -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.8); box-shadow: 5px 5px 10px rgba(0,0,0,0.8);
    background: #b68d4c;
    background: -moz-linear-gradient(-45deg,  #b68d4c 3%, #f3e2c7 26%, #c19e67 50%, #b68d4c 51%, #e9d4b3 79%, #ad7248 99%);
    background: -webkit-linear-gradient(-45deg,  #b68d4c 3%,#f3e2c7 26%,#c19e67 50%,#b68d4c 51%,#e9d4b3 79%,#ad7248 99%);
    background: linear-gradient(135deg,  #b68d4c 3%,#f3e2c7 26%,#c19e67 50%,#b68d4c 51%,#e9d4b3 79%,#ad7248 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b68d4c', endColorstr='#ad7248',GradientType=1 );
}
ul.case_list li h3 { padding: 10px 0 40px; color:#fff; font-size: 20px; text-align: center }

@media screen and (min-width:375px) {




}

@media screen and (min-width:412px) {
    
    

}

@media screen and (min-width:1200px) {
    
    .section1 { width: 100%; }
    #section1bg{ padding: 280px 0 100px; background-color:#fff; background-image: url(../img/sub1_sec1_bg.jpg); background-size: auto; background-position:center center; 
        background-repeat: no-repeat; background-attachment: fixed; min-height: 100vh; overflow: hidden }
    
    #section1bg h2 { font-size:38px; position: relative; color:#fff; text-align: center; font-weight: 600; margin-bottom:50px;}
    ul.case_list { text-align: center }
    ul.case_list li { float:left; width:50%; text-align: center; margin-bottom:30px; }
    ul.case_list li span { padding:10px; -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,0.8); box-shadow: 5px 5px 10px rgba(0,0,0,0.8);
        background: #b68d4c;
        background: -moz-linear-gradient(-45deg,  #b68d4c 3%, #f3e2c7 26%, #c19e67 50%, #b68d4c 51%, #e9d4b3 79%, #ad7248 99%);
        background: -webkit-linear-gradient(-45deg,  #b68d4c 3%,#f3e2c7 26%,#c19e67 50%,#b68d4c 51%,#e9d4b3 79%,#ad7248 99%);
        background: linear-gradient(135deg,  #b68d4c 3%,#f3e2c7 26%,#c19e67 50%,#b68d4c 51%,#e9d4b3 79%,#ad7248 99%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b68d4c', endColorstr='#ad7248',GradientType=1 );
        
    }
    ul.case_list li img { max-width: 100% }
    ul.case_list li h3 { padding: 10px 0 30px; color:#fff; font-size: 24px;}
    
    
}

/* --------------------  sec 1 end -------------------------*/

/* --------------------  sec 2 start -------------------------*/


.section2 { width: 100%; }
#section2bg{ padding: 100px 0 100px; background-color:#fff; background-image: url(../img/sub1_sec2_bg.jpg); background-size: cover; background-position:center center; 
        background-repeat: no-repeat; overflow: hidden }
#section2bg h2 { font-size:28px; position: relative; color:#38322e; text-align: center; font-weight: 600; margin-bottom:50px;}
ul.letter_list li { text-align: center; margin-left:15px; }
ul.letter_list li img { max-width: 100% }




@media screen and (min-width:375px) {




}

@media screen and (min-width:412px) {




}

@media screen and (min-width:1200px) {
    
    .section2 { width: 100%; }
    #section2bg{ padding: 100px 0 100px; background-color:#fff; background-image: url(../img/sub1_sec2_bg.jpg); background-size: cover; background-position:center center; 
        background-repeat: no-repeat; background-attachment: fixed; height: auto; overflow: hidden }
    
    #section2bg h2 { font-size:38px; position: relative; color:#38322e; text-align: center; font-weight: 600; margin-bottom:50px;}
    ul.letter_list { text-align: center }
    ul.letter_list li { float:left; width:48%; text-align: center; margin-bottom:30px; }
    ul.letter_list li img { max-width: 100% }

}







/* --------------------  sec 2 end -------------------------*/

/* --------------------  sec 3 start -------------------------*/

    .section3 { width: 100%; }
    #section3bg{ padding: 100px 0 100px; background-color:#fff; background-image: url(../img/sub1_sec3_bg.jpg); background-size: cover; background-position:center center; 
        background-repeat: no-repeat; height: auto; overflow: hidden }
    
    #section3bg .left_con {width:100%}
    #section3bg h2 { font-size:24px; position: relative; color:#b0905e; font-weight:400; margin-bottom:20px;}
    #section3bg .trust_reason { margin-top:30px;}
    #section3bg .trust_reason li { font-size: 18px; color:#E5DBBC; margin-top:60px; }
    #section3bg .trust_reason li h3 { font-size: 20px; border:3px solid #b0905e; border-radius: 0 10px 0 10px; padding: 8px 40px; max-width: 100%; margin-bottom:30px; }


@media screen and (min-width:375px) {




}

@media screen and (min-width:412px) {




}    
    


@media screen and (min-width:1200px) {
    
    .section3 { width: 100%; }
    #section3bg{ padding: 100px 0 100px; background-color:#fff; background-image: url(../img/sub1_sec3_bg.jpg); background-size: cover; background-position:center center; 
        background-repeat: no-repeat; height: 850px; overflow: hidden }
    
    #section3bg .left_con {width:50%}
    #section3bg h2 { font-size:24px; position: relative; color:#b0905e; font-weight:400; margin-bottom:20px;}
    #section3bg .trust_reason { margin-top:30px;}
    #section3bg .trust_reason li { font-size: 22px; color:#E5DBBC; margin-top:60px; }
    #section3bg .trust_reason li h3 { border:3px solid #b0905e; border-radius: 0 10px 0 10px; padding: 8px 40px; max-width: 90%; margin-bottom:30px; }
    
    
}








/* --------------------  sec 3 end -------------------------*/

/* --------------------  sec 4 start -------------------------*/




@media screen and (min-width:375px) {




}

@media screen and (min-width:412px) {




}    
    


@media screen and (min-width:1200px) {
    
    .section4 { width: 100%; }
    #section4bg{height:1278px; background-color:#fff; background-image: url(../img/section_4_bg.png);background-size: auto; background-position:center center; background-repeat: no-repeat }
    #section4bg .inner { height: 100%; text-align: center }
    #section4bg .certificate img { display: inline-block; margin:60px 20px }
    
    #section4bg h1 { color: #fff; font-size: 50px; margin: 40px 0}
    .btn_counsell { border:2px solid #f55f54; padding:10px 30px; font-size: 30px; font-weight: 600; color:#f55f54; display: inline-block; min-width: 250px; }
    
}






/* --------------------  sec 4 end -------------------------*/

