@charset "utf-8";
.contactbanner{position: relative;width: 100%;}
.contactbanner picture img{display: block; width: 100%; height: auto;}
.contactbanner article{ width: 30%; height: 100%; position: absolute; top:0; left: 3%;  display: flex; align-items: center; }
.contactbanner article .text{}
.contactbanner article .text h3{font-size: 2rem!important; }
.contactbanner article .text p{ font-size: .875rem;line-height: 24px; }

@media screen and (max-width : 900px) {
    .contactbanner article{width: 100%; text-align: left; padding-top: 10px; position: relative;}
}


.contact-us{padding: 5% 0 2% 0;}
.contact-us .row{display: flex;padding: 0 5%;}
.contact-us .row .text{width: 50%;display: flex;align-items: center;justify-content: center;}
.contact-us .row .text article ul{}
.contact-us .row .text article ul .title{font-size: 2rem;color: #000;line-height: 1.25;font-family: Sterling Display A;font-weight: 400;font-style: normal;padding-bottom: 14px;}
.contact-us .row .text article ul li{font-size: 16px; font-family: Sterling Display A;font-weight: 400;font-style: normal;line-height: 2.5;align-items: center;margin: 0 0 8px;}
.contact-us .row .text article ul li .iconfont{font-size: 22px;margin-right: 10px;}
.contact-us .row .text article ul li .icon-s{font-size: 16px;}
.contact-us .row .text article ul li a{color: #000;}
.contact-us .row picture{padding: 0 5%;width: 50%;display: flex;justify-content: center;}
.contact-us .row picture .picture{width: 408px;height: 408px;}
.contact-us .row picture .picture img{width: 100%;}

@media screen and (max-width : 900px) {
    .contact-us .row{display: block;padding: 0;}
    .contact-us .row .text{width: 100%;display: block;}
    .contact-us .row picture{width: 100%;padding: 0;display: block;}
    .contact-us .row picture .picture{width: 100%;padding: 24px 0;height: 100%; }
}



.businesstime{}
.businesstime article{width: 100%;padding: 5% 0;text-align: center;}
.businesstime article p{font-size: 16px;margin: 0;line-height: 26px;}



.book{position: relative;margin-bottom: 8%;}
.book .row picture img{display: block; width: 100%;}
.book .row .text{height: 100%; display: flex; align-items: center;}
.book .row article{width: 50%; height: 100%; position: absolute; top: 0; right: 0;}
.book .row article .block{ width: 80%; }
.book .row article .block h3{ font-size: 26px;padding-bottom: 12px; }
.book .row article .block p{ font-size: .875rem;line-height: 24px; }
.book .row article .block a{display: inline-block; color: #000;}
.book .row article .block a:after{ content:""; display: block; width: 0px; border-bottom:#81d8d0 1px solid; transition: 0.5s;}
.book .row article .block a:hover:after{ width: 100%;}

@media screen and (max-width: 900px) {
    .book .row article{width: 100%;position: relative;padding: 20px;}
}



.welcome{width: 100%;text-align: center;background-color: #eff9f9;padding: 5% 0 5%;}
.welcome article h3{font-size: 26px;}
.welcome article p{padding: 0 25%;line-height: 26px;font-size: 16px;color: #555;}
.welcome article a{display: inline-block; color: #000;font-size: 18px;}
.welcome article a:after{ content:""; display: block; width: 0px; border-bottom:#81d8d0 1px solid; transition: 0.5s;}
.welcome article a:hover:after{ width: 100%;}

@media screen and (max-width: 900px) {
    .welcome article p{padding: 0 5%;}
}



.help{padding-bottom: 50px;border-bottom: 2px #81d8d0 solid; padding-top: 50px;}
.help .row .topic{width: 100%; text-align: center; padding-bottom: 24px;}
.help .row .topic h3{font-size: 30px;}
.help .row ul{display: flex;flex-wrap: wrap;}
.help .row ul li{width: 25%;outline: none;padding: 0 12px;box-sizing: border-box;}
.help .row ul li .img{width: 100%;}
.help .row ul li img{ width:100%; }
.help .row ul li .text{ padding: 3% 0; line-height: 1.5; text-align: center;}
.help .row ul li .text div{ text-align: center; }
.help .row ul li .text .title{font-size: 20px;line-height: 40px;}
.help .row ul li .text .desc{font-size: 16px;color: #555;line-height: 30px;padding-bottom: 10px;}

.help .row .text .link a{display: inline-block; color: #000;font-size: 16px;}
.help .row .text .link a:after{ content:""; display: block; width: 0px; border-bottom:#81d8d0 1px solid; transition: 0.5s;}
.help .row .text .link a:hover:after{ width: 100%;}


@media screen and (max-width: 900px) {
    .help .row ul li{width: 50%;}
}