/*璁剧疆banner*/ /*-----------------------------------*/ .top-area{ width: 100%; position: relative; background: url(https://file.jingdiao.com/website/jingdiao/cn/images/domestic-branch/top.svg); background-position: top; background-size: 100%; background-repeat: no-repeat; background-color: #EEF0F1; /* background-color: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #EEF0F1 31.95%, #FFF 100%); */ } .top-container{ text-align: center; } .small-width{ margin-left: 19%; margin-right: 19%; } .top-title{ font-family: "闃块噷宸村反鏅儬浣 Bold"; font-size: 72px; line-height: 1; color: #004898; letter-spacing: 9px; } .top-info{ font-size: 18px; line-height: 36px; color: #333333; text-align: left; } .effect-group-container{ margin-left: auto; margin-right: auto; } @media only screen and (max-width: 1599px) { .small-width{ margin-left: 18%; margin-right: 18%; } .top-title{ font-size: 64px; } } @media only screen and (max-width: 1299px) { .small-width{ margin-left: 15%; margin-right: 15%; } .top-title{ font-size: 60px; } .top-info{ font-size: 18px; } } @media only screen and (max-width: 1024px) { .top-area{ background: url(https://file.jingdiao.com/website/jingdiao/cn/images/domestic-branch/top-m.svg); background-position: top; background-size: 100%; background-repeat: no-repeat; background-color: #EEF0F1; /* background-color: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #EEF0F1 31.95%, #FFF 100%); */ } .small-width{ margin-left: 3.8%; margin-right: 3.8%; } .top-title{ font-size: 42px; letter-spacing: 7px; } .top-info{ font-size: 16px; line-height: 1.7; } } @media only screen and (max-width: 450px) { .top-title{ font-size: 36px; letter-spacing: 6px; } .top-info{ font-size: 14px; } } @media only screen and (max-width: 380px) { .top-area{ padding-top: 100px; } } /*-----------------------------------*/ .regionName-select-block{ width: 800px; margin-left: auto; margin-right: auto; position: relative; } /*璁剧疆banner end*/ input[type="text"].regionName-select{ width: 800px; height: 58px; padding: 8px 40px 8px 40px; border-radius: 100px; border: 1px solid #E7E7E7; margin-left: auto; margin-right: auto; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url(https://file.jingdiao.com/website/jingdiao/cn/images/domestic-branch/chevron-down.svg) 95% 50% no-repeat scroll transparent; background-size: 24px 24px; background-color: #ffffff; overflow: hidden; color: #666; text-overflow: ellipsis; font-size: 24px; font-style: normal; font-weight: 400; line-height: 42px; /* 175% */ } .regionName-select-block ul{ display: none; background-color: #ffffff; padding: 6px 12px; position: absolute; width: 100%; max-height: 300px; overflow-y: auto; z-index: 500; top: 66px; border-radius: 4px; background: var(--Gray-White, #FFF); /* Shadow/Shadow-1 鍩虹鎶曞奖 */ box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.08), 0px 1px 10px 0px rgba(0, 0, 0, 0.05); backdrop-filter: blur(2px); } .regionName-select-block li{ font-size: 18px; font-style: normal; font-weight: 400; line-height: 24px; padding: 6px 18px; color: #1A1A1A; text-align: left; cursor: pointer; } .regionName-select-block li.current{ color: #004898; } .branchOffices{ display: grid; grid-template-columns: 33.3% 33.3% 33.3%; grid-template-rows: max-content ; justify-items: center; align-items: center; grid-gap: 16px; margin-top: -24px; } .branchOffice-block{ width: 100%; height: 100%; padding-top: 24px; } .branchOffice{ background-color: #ffffff; padding: 40px; height: 100%; } .branchOffice-header{ display: flex; align-items: center; position: relative; } .address-img{ width: 34px; height: 34px; } .copy-btn{ display: inline-flex; color: #004898; text-align: center; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ cursor: pointer; border: 1px solid #004898; align-items: center; padding: 6px 16px 6px 16px; border-radius: 2px; position: absolute; right: 0px; } .copy-btn img{ width: 16px; height: 16px; margin-right: 8px; } .branchOffice-name{ overflow: hidden; color: #004898; text-overflow: ellipsis; font-size: 28px; font-style: normal; font-weight: 500; line-height: 48px; /* 171.429% */ padding-top: 16px; padding-bottom: 20px; text-align: left; border-bottom: 1px solid #E7E7E7; } .branchOffice-items{ text-align: left; padding-top: 12px; } .branchOffice-item{ display: flex; } .branchOffice-item-key,.branchOffice-item-value{ display: inline-block; overflow: hidden; text-overflow: ellipsis; font-size: 18px; font-style: normal; font-weight: 400; line-height: 24px; padding-top: 12px; } .branchOffice-item-key{ color: #1A1A1A; min-width: 56px; } .branchOffice-item-value{ color: #666; flex: auto; } @media only screen and (max-width: 1024px) { .branchOffices{ display: grid; grid-template-columns: 100%; justify-items: center; align-items: center; grid-gap: 16px; } .branchOffice-block{ padding-top: 0px; } .regionName-select-blocks{ margin-left: 44px; margin-right: 44px; } .regionName-select-block{ width: 100%; } input[type="text"].regionName-select{ width: 100%; height: 38px; padding: 4px 24px 4px 24px; border-radius: 100px; background-size: 16px 16px; font-size: 16px; font-weight: 400; line-height: 30px; letter-spacing: 0em; text-align: left; color: #000000; } .regionName-select-block ul{ padding: 6px 12px; max-height: 200px; top: 44px; } .regionName-select-block li{ font-size: 14px; } .branchOffice{ padding: 24px; } .branchOffice-name{ font-size: 24px; font-weight: 500; line-height: 42px; letter-spacing: 0px; padding-top: 10px; padding-bottom: 16px; } .branchOffice-items{ text-align: left; padding-top: 12px; } .branchOffice-item-key,.branchOffice-item-value{ font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; padding-top: 4px; } .branchOffice-item-key{ min-width: 45px; } .address-img{ width: 30px; height: 30px; } .copy-btn{ font-size: 14px; padding: 3px 10px; } .copy-btn img{ width: 16px; height: 16px; margin-right: 8px; } }