www.lightcourse.com/public/static/home/new/css/contact.css

243 lines
4.0 KiB
CSS
Raw Normal View History

2022-10-24 02:38:36 +00:00
.dot {
2022-10-29 09:03:04 +00:00
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.setBetween {
2022-10-29 09:03:04 +00:00
display: flex;
justify-content: space-between;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.setRowCenter {
2022-10-29 09:03:04 +00:00
display: flex;
align-items: center;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.setColumnCenter {
2022-10-29 09:03:04 +00:00
display: flex;
align-items: center;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.setCenter {
2022-10-29 09:03:04 +00:00
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.ra {
2022-10-29 09:03:04 +00:00
border-radius: 0.2rem;
overflow: hidden;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.bs {
2022-10-29 09:03:04 +00:00
box-shadow: 0 0 0.5rem #ebebeb;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.box-shadow {
2022-10-29 09:03:04 +00:00
box-shadow: 0rem 0.3rem 0.5rem 0rem rgba(36, 65, 116, 0.1);
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.btn {
2022-10-29 09:03:04 +00:00
padding: 0.3rem 0.9rem;
background-color: #3b52f6;
color: #fff !important;
border-radius: 2rem;
font-size: 0.9rem;
display: inline-block;
width: auto;
}
2022-10-24 02:38:36 +00:00
.btn.s1 {
2022-10-29 09:03:04 +00:00
background-color: transparent;
border: 1px solid #3b52f6;
color: #3b52f6 !important;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.a-hover:hover {
2022-10-29 09:03:04 +00:00
color: #3b52f6;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
.contact-banner{
position: relative;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
.contact-banner .main-center {
max-width: 100%;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-banner h1 {
2022-10-29 09:03:04 +00:00
font-family: "HarmonyOS_Sans_Black" !important;
background-color: #ffff1b;
font-size: 2.4rem;
font-size: 2rem;
line-height: 1.2;
padding: 5.4rem 0;
text-align: center;
}
2022-10-24 02:38:36 +00:00
.contact-banner h5 {
2022-10-29 09:03:04 +00:00
background-color: #284dfd;
padding: 6.5rem 0;
height: 46.45rem;
font-size: 1.9rem;
line-height: 1.45;
color: #ffffff;
text-align: center;
}
.contact-right-bg{
width: 14.5rem;
position: absolute;
right: 0;
top: 3rem;
z-index: 1;
}
.contact-left-bg{
width: 10.75rem;
position: absolute;
left: 0;
bottom: -10.35rem;
z-index: 1;
}
/* .contact-container section:not(:first-of-type) {
padding-top: 0;
} */
.contact-container{
padding-bottom: 2rem;
margin-top: -27.5rem;
position: relative;
z-index: 1;
}
.contact-container section{
padding: 0;
margin-bottom: 1.5rem;
}
.contact-container .main-center{
2022-11-02 09:12:14 +00:00
max-width: 70.21%;
2022-10-29 09:03:04 +00:00
}
.contact-container .container .item-bg{
width: 100%;
height: 17.25rem;
background-size: 100%;
}
2022-10-24 02:38:36 +00:00
.contact-container .container .item {
2022-10-29 09:03:04 +00:00
height: 100%;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem 2.5rem 1rem 4.5rem;
background-color: rgba(0,0,0,.7);
color: #fff;
}
.contact-container .container .item>.left{
width: 50%;
}
.contact-container .container .item h6 {
font-size: 1.3rem;
position: relative;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
.contact-container section:nth-of-type(even) .container .item h6 {
color: #ffff1b !important;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
.contact-container .container .item .left p{
font-size: 1.25rem;
line-height: 1.5;
margin-bottom: 0 !important;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item .text {
2022-10-29 09:03:04 +00:00
width: 45%;
border-radius: 0.25rem;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item .text img {
2022-10-29 09:03:04 +00:00
position: absolute;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item.item1 .text img {
2022-10-29 09:03:04 +00:00
bottom: -12%;
left: 45%;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item.item2 .text img {
2022-10-29 09:03:04 +00:00
bottom: -12%;
left: 83%;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item.item3 .text img {
2022-10-29 09:03:04 +00:00
bottom: -110%;
left: 90%;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item .mail {
2022-10-29 09:03:04 +00:00
text-align: center;
padding-top: 2rem;
2022-10-24 02:38:36 +00:00
}
2022-10-29 09:03:04 +00:00
2022-10-24 02:38:36 +00:00
.contact-container .container .item .mail a {
2022-10-29 09:03:04 +00:00
display: inline-block;
font-size: 0.9rem;
font-weight: bold;
color: #3b52f6;
padding: 0.6rem;
padding-bottom: 0.9rem;
padding-left: 4rem;
padding-right: 0.9rem;
background-image: url("../images/jx2.png");
background-repeat: no-repeat;
background-size: 100% 100%;
}
.container .item .text p {
display: flex;
font-size: 0.85rem;
line-height: 1.8;
margin-bottom: 0 !important;
}
.container .item .text p>em{
width: 1rem;
}
2022-10-24 02:38:36 +00:00
@media screen and (max-width: 1024px) {
2022-10-29 09:03:04 +00:00
.contact-container .container .item.item2 .text img {
max-width: 13rem;
}
.contact-container .container .item.item3 .text img {
max-width: 18rem;
}
}
2022-10-24 02:38:36 +00:00
@media screen and (max-width: 768px) {
2022-10-29 09:03:04 +00:00
.main-center {
padding-left: 2%;
padding-right: 2%;
}
.contact-container .container .item .text img,
.contact-container .container .item h6::before {
display: none;
}
.contact-container .container .item .mail a {
font-size: 1.1em;
}
.contact-container .container .item .text {
width: 100%;
padding: 1rem !important;
}
2022-10-24 02:38:36 +00:00
}