/*閫氱敤*/ /*------------------------------------*/ .part1 .main-title { font-family: "闃块噷宸村反鏅儬浣 Bold"; font-size: 72px; color: #004898; letter-spacing: 0.32em; line-height: 1; text-align: center; } .part1 .main-desc { width: 80%; max-width: 1400px; font-family: "闃块噷宸村反鏅儬浣 Bold"; font-size: 28px; color: #333; text-align: center; margin: 0 auto; } .part1 { position: relative; padding-bottom: calc(500 / 1920 * 100%); background-image: url('https://file.jingdiao.com/website/jingdiao/cn/images/recent-activities/main-bg.png'); background-repeat: no-repeat; background-size: cover; } .part1 .main-info { position: absolute; width: 100%; top: 0; left: 0; } @media only screen and (max-width: 1599px) { .part1 .main-title { font-size: 64px; } .part1 .main-desc { font-size: 24px; } } @media only screen and (max-width: 1024px) { .part1 { padding-bottom: calc(600 / 750 * 100%); background-image: url('https://file.jingdiao.com/website/jingdiao/cn/images/recent-activities/m-main-bg.png') } .part1 .main-title { margin-top: 40px; font-size: 42px; letter-spacing: 0.1em; line-height: 1.3; } .part1 .main-subtitle { margin-top: 16px; font-size: 20px; } .part1 .main-desc { width: 100%; margin-top: 16px; font-size: 16px; line-height: 1.7; } } @media only screen and (max-width: 450px) { .part1 .main-title { font-size: 36px; } .part1 .main-subtitle { font-size: 20px; } .part1 .main-desc { font-size: 14px; } } /*------------------------------------*/ /*閫氱敤 end*/ .part-title { color: #000; font-size: 50px; font-weight: 700; line-height: 72px; letter-spacing: 0px; text-align: center; } .info-item { font-size: 18px; font-weight: 400; line-height: 36px; letter-spacing: 0px; text-align: left; } .info-item a { color: #005bac; text-decoration: underline; } .info-item a:hover { color: #004898; } @media only screen and (max-width: 1599px) { .part-title { font-size: 40px; } } @media only screen and (max-width: 1024px) { .part-title { font-size: 24px; line-height: 42px; padding-top: 40px; padding-bottom: 40px; } .info-item { font-size: 14px; line-height: 28px; } } .part2 .part2-main { display: flex; display: -ms-flexbox; display: -webkit-flex; align-items: flex-start; -webkit-align-items: flex-start; } .part2 .part2-main .part2-left { position: relative; flex: 6; -ms-flex: 6; -webkit-flex: 6; } .part2 .part2-main .part2-left .part2-img-wrapper { background-repeat: no-repeat; background-size: cover; background-image: none; padding-bottom: 0px; } .part2 .part2-main .part2-left .part2-img-title { position: absolute; top: 50%; left: 0; width: 100%; padding: 0 15px; transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); font-family: "闃块噷宸村反鏅儬浣 Bold"; text-align: center; color: #FFF; line-height: 1.8; font-size: 40px; box-sizing: border-box; } .part2 .part2-main .part2-right { flex: 5; -ms-flex: 5; -webkit-flex: 5; padding-left: 4.17%; } .part2 .part2-main .part2-right img { width: 50%; } .part2 .part2-main .part2-right .activities-buttons { display: flex; display: -ms-flexbox; display: -webkit-flex; } .part2 .part2-main .part2-right .activities-buttons .effect-group-container { width: 240px; } .part2 .part2-main .part2-right .activities-buttons .effect-group-container:first-child { margin-right: 15px; } .part2 .part2-main .part2-right .appointment-btn { display: block; width: 100%; line-height: 42px; background-color: #004898; color: #FFF; text-align: center; border-radius: 21px; } .part2-flex{ display: flex; display: -webkit-flex; } @media only screen and (max-width: 1599px) { .part2 .part2-main .part2-left .part2-img-title { font-size: 32px; } } @media only screen and (max-width: 1299px) { } @media only screen and (max-width: 1105px) { .part2-flex1{ width: 89px; } .part2-flex2{ width: calc(100% - 89px); } } @media only screen and (max-width: 1024px) { .part2 { margin-bottom: 40px; } .part2 .part2-main { display: block; } .part2 .part2-main .part2-right { padding-left: 0; } .part2 .part2-main .part2-right img { width: 66.667%; margin: 16px 0; } .part2 .part2-main .part2-right .activities-buttons { display: block; } .part2 .part2-main .part2-right .activities-buttons .effect-group-container { width: auto; } .part2 .part2-main .part2-right .activities-buttons .effect-group-container:first-child { margin-right: 0; } .part2 .part2-main .part2-right .activities-buttons .effect-group-container:last-child .appointment-btn { margin-top: 15px; } .part2 .part2-main .part2-right .appointment-btn { width: 169px; line-height: 36px; border-radius: 18px; font-size: 16px; margin: 24px auto 0; } .part2 .part2-main .part2-left .part2-img-title { font-size: 20px; } .part2-flex1{ width: 79px; } .part2-flex2{ width: calc(100% - 79px); } } @media only screen and (max-width: 450px) { .part2 .part2-main .part2-right .appointment-btn { font-size: 14px; } .part2 .part2-main .part2-left .part2-img-title { font-size: 18px; } .part2-flex1{ width: 69px; } .part2-flex2{ width: calc(100% - 69px); } } .part3-items { display: flex; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; } .part3-items .part3-item { /*flex: 1; -ms-flex: 1; -webkit-flex: 1;*/ margin-right: 15px; width: calc((100% - 31px) / 3); } .part3-items .part3-item:nth-child(3n) { margin-right: 0; } .part3-items .part3-item:last-child { margin-right: 0; } .part3-items .part3-item .part3-img-wrapper { position: relative; display: block; overflow: hidden; border-radius: 10px; } .part3-items .part3-item:hover .part3-img { transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); -moz-transform: scale(1.1); -webkit-transform: scale(1.1); } .part3-items .part3-item .part3-img-wrapper .part3-img { background-repeat: no-repeat; background-size: cover; transition: all .4s; -o-transition: all .4s; -ms-transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; background-image: none; padding-bottom: 0px; } .part3-items .part3-item .part3-img-wrapper .part3-img img, .part2 .part2-main .part2-left .part2-img-wrapper img{ width: 100%; aspect-ratio: 576/360; border-radius: 10px; } .part3-items .part3-item .part3-img-wrapper .part3-img-title { position: absolute; top: 50%; left: 0; width: 100%; padding: 0 15px; transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); font-family: "闃块噷宸村反鏅儬浣 Bold"; text-align: center; color: #FFF; line-height: 1.8; font-size: 36px; box-sizing: border-box; } .part3-items .part3-item .part3-item-title { display: block; color: #333333; font-size: 28px; font-weight: 700; line-height: 48px; letter-spacing: 0px; text-align: left; } @media only screen and (max-width: 1599px) { .part3-items .part3-item .part3-img-wrapper .part3-img-title { font-size: 26px; } .part3-items .part3-item .part3-item-title { font-size: 22px; } } @media only screen and (max-width: 1024px) { .part3 { background-color: #F6F6F6; } .part3-items { display: block; } .part3-items .part3-item { width: 100%; margin-right: 0; padding-bottom: 24px; } .part3-items .part3-item .part3-item-title { font-size: 20px; line-height: 1.5; } .part3-items .part3-item .part3-img-wrapper .part3-img-title { font-size: 20px; } } @media only screen and (max-width: 1024px) { .part3-items .part3-item .part3-item-title { font-size: 18px; line-height: 30px; margin-top: 16px; margin-bottom: 10px; } .part3-items .part3-item .part3-img-wrapper .part3-img-title { font-size: 18px; } } .part2-right-title{ font-family: "闃块噷宸村反鏅儬浣 Bold"; color: rgb(0, 72, 152); font-size: 32px; line-height: 1.3; } @media only screen and (max-width: 1599px) { .part2-right-title { font-size: 22px; } } @media only screen and (max-width: 1024px) { .part2-right-title { font-size: 18px; margin-top: 16px; } } .statusMark{ display: inline-block; position: absolute; z-index: 8; right: 30px; top: -2px; } .activities-buttons a, .activities-buttons a:hover, .activities-buttons a:visited{ font-size: 22px; font-weight: 500; line-height: 36px; letter-spacing: 0px; text-align: left; color: #004898; } .activitie-subscribe{ position: absolute; z-index: 8; left: 50%; transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); bottom: 30px; cursor: pointer; } .latest-doing-activitie{ display: grid; grid-template-columns: 25% 60% 15%; align-items: center; justify-items: center; background-image: url(https://file.jingdiao.com/website/jingdiao/cn/images/recent-activities/banner-bg-pc.png); background-size: cover; padding: 40px 0px; cursor: default; } .latest-doing-activitie-title{ font-size: 48px; font-weight: 700; line-height: 48px; letter-spacing: 0px; text-align: center; color: #333333; margin-bottom: 30px; } .latest-doing-activitie-items{ display: grid; grid-template-columns: auto auto; row-gap: 4px; } .latest-doing-activitie-item{ text-align: left; } .latest-doing-activitie-item span:last-child{ font-size: 28px; font-weight: 700; line-height: 45px; letter-spacing: 0px; text-align: left; color: #004898; } .latest-doing-activitie-item span:first-child{ font-size: 24px; font-weight: 400; line-height: 45px; letter-spacing: 0px; text-align: left; color: #333333; } .latest-doing-activitie-subscribe{ cursor: pointer; padding: 40px; } @media only screen and (max-width: 1599px) { .latest-doing-activitie-title { font-size: 38px; line-height: 38px; margin-bottom: 20px; } .latest-doing-activitie-item span:last-child{ font-size: 20px; line-height: 36px; } .latest-doing-activitie-item span:first-child{ font-size: 18px; line-height: 36px; } } @media only screen and (max-width: 1024px) { .latest-doing-activitie{ grid-template-columns: 100%; align-items: center; justify-items: center; background-image: url(https://file.jingdiao.com/website/jingdiao/cn/images/recent-activities/banner-bg-m.png); padding: 40px 0px; cursor: default; } .latest-doing-activitie-items{ grid-template-columns: 100%; } .latest-doing-activitie-title { display: none; } .activities-buttons a, .activities-buttons a:hover, .activities-buttons a:visited{ font-size: 18px; line-height: 30px; margin-top: 10px; } } .mask{ display: none; position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; background: #00000080; z-index: 20; } .subscribe-dialog-area{ background-color: #FFFFFF; height: 90%; max-height: 565px; width: 92%; max-width: 800px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); overflow: auto; } .subscribe-dialog-area-close{ text-align: right; padding: 20px 20px 15px 20px; } .subscribe-dialog-area-close img{ width: 25px; display: inline-block; cursor: pointer; } .subscribe-dialog-area-title{ padding: 0px 80px 28px 80px; font-size: 40px; font-weight: 700; line-height: 48px; letter-spacing: 0px; color: #333333; } .subscribe_form{ padding: 0px 80px 80px 80px; } .fm_title{ font-size: 22px; font-weight: 400; line-height: 24px; letter-spacing: 0px; text-align: left; color: #333333; margin-top: 24px; } .bluetip{ color:#CC0000; font-size: 24px; } .fm_title .hint{ color:#CC0000; font-size: 16px; } .subscribe_form .fm_input{ font-size: 22px; line-height: 40px; width: 100%; border: 1px solid #333333; margin-top: 16px; } .fm_tip{ font-size: 16px; font-weight: 400; line-height: 18px; letter-spacing: 0px; color: #333333; margin-top: 24px; } .bluetip{ color:#CC0000; font-size: 24px; } .fm_submit{ width: 200px; height: 42px; margin-top: 58px; font-size: 18px; font-weight: 500; line-height: 42px; letter-spacing: 0px; text-align: center; color: #FFFFFF; margin-left: auto; margin-right: auto; cursor: pointer; border: none; } @media only screen and (max-width: 1024px) { .subscribe-dialog-area{ max-height: 408px; max-width: 338px; } .subscribe-dialog-area-close{ text-align: right; padding: 16px 16px 0px 16px; } .subscribe-dialog-area-title{ padding: 0px 24px 0px 24px; font-size: 28px; line-height: 48px; } .subscribe_form{ padding: 0px 24px 40px 24px; } .fm_title{ font-size: 16px; margin-top: 16px; } .fm_title .hint{ font-size: 14px; } .subscribe_form .fm_input{ font-size: 16px; line-height: 24px; margin-top: 10px; } .fm_tip{ font-size: 14px; line-height: 18px; margin-top: 16px; } .bluetip{ color:#CC0000; font-size: 24px; } .fm_submit{ width: 169px; height: 36px; margin-top: 30px; font-size: 14px; line-height: 36px; } } /*寮圭獥鏍峰紡*/ .alertify{ border: none; border-radius: 0; box-shadow: 0; -webkit-box-shadow: 0; left: 0; right: 0; margin: auto; width: 560px; } .alertify-dialog{ padding: 40px 15px 40px 15px; } .alertify-message{ margin: 0; font-size: 24px; font-family: "闃块噷宸村反鏅儬浣 Bold"; } .alertify-big{ font-family: "闃块噷宸村反鏅儬浣 Bold"; font-size: 24px; line-height: 24px; color: #000000; margin: 0; margin-bottom: 31px; } .alertify-little{ font-size: 18px; line-height: 36px; color: #333333; margin: 0; } .alertify-button, .alertify-button:hover, .alertify-button:focus, .alertify-button:active, .alertify-button:link, .alertify-button:visited, .alertify-button-ok, .alertify-button-ok:hover, .alertify-button-ok:focus, .alertify-button-ok:active{ border: 2px solid #004898; background: #FFFFFF; width: 240px; height: 40px; border-radius: 6px; color: #ffffff; font-size: 22px; text-shadow: none; font-family: "闃块噷宸村反鏅儬浣 Bold"; outline: none; margin-top: 31px; padding: 0; line-height: 36px; } /*绉诲姩绔?/ @media only screen and (max-width: 1024px) { .alertify{ width: 480px; } .alertify-dialog { padding: 30px 15px 30px 15px; } .alertify-big { font-size: 18px; line-height: 18px; margin-bottom: 20px; } .alertify-little { font-size: 16px; line-height: 30px; } .alertify-button, .alertify-button:hover, .alertify-button:focus, .alertify-button:active, .alertify-button:link, .alertify-button:visited, .alertify-button-ok, .alertify-button-ok:hover, .alertify-button-ok:focus, .alertify-button-ok:active{ border: 1px solid #004898; width: 140px; height: 32px; font-size: 16px; line-height: 30px; margin-top: 25px; } } @media only screen and (max-width: 680px) { .alertify { left: 0; margin: auto; width: 400px; } } @media only screen and (max-width: 450px) { .alertify{ width: 300px; } } /*寮圭獥鏍峰紡 End*/