.step-tl .index { width: 60px; height: 60px; line-height: 60px; text-align: center; background: #3680e3; font-size: 32px; color: #ffffff; float: left; margin-right: 24px; } .step-tl .t-box { padding-top: 5px; float: left; } .step-tl .t-box .cn { color: #333333; font-size: 24px; margin-bottom: 12px; } .step-tl .t-box .en { color: #999999; font-size: 18px; } .ser_a .block-title { background-color: #fafafa; } .ser_a .step_1 { padding: 3.5714% 0; } .ser_a .step_1 .top { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 50px; } .ser_a .step_1 .top .step-tl { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 120px; } .ser_a .step_1 .top .ser-tab-box { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; position: relative; } .ser_a .step_1 .top .ser-tab-box .tab { line-height: 60px; color: #666666; font-size: 18px; margin-right: 60px; position: relative; cursor: pointer; } .ser_a .step_1 .top .ser-tab-box .tab:last-child { margin-right: 0; } .ser_a .step_1 .top .ser-tab-box .tab::after { content: ""; width: 100%; height: 1px; background: #3680e3; left: 0; bottom: 0; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .ser_a .step_1 .top .ser-tab-box .tab:hover, .ser_a .step_1 .top .ser-tab-box .current { color: #3680e3; } .ser_a .step_1 .top .ser-tab-box .tab:hover::after, .ser_a .step_1 .top .ser-tab-box .current::after { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .ser_a .step_1 .top .ser-tab-box::before { content: ""; width: 100%; height: 1px; background: #d2edfa; left: 0; bottom: 0; } .ser_a .step_1 .content-box .current { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .ser_a .step_1 .content { display: none; position: relative; } .ser_a .step_1 .content .lt-box { width: 57.1429%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background-color: #dce3e6; padding: 2.95% 4.75%; } .ser_a .step_1 .content .lt-box .imgbox { margin-bottom: 26px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .ser_a .step_1 .content .lt-box .imgbox .index img { width: 100%; } .ser_a .step_1 .content .lt-box .imgbox .current .act { opacity: 1; } .ser_a .step_1 .content .lt-box .imgbox .current .nor { opacity: 0; } .ser_a .step_1 .content .lt-box .text-box { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .ser_a .step_1 .content .lt-box .text-box li { width: 30%; -webkit-box-flex: 0; -webkit-flex-grow: 0; -moz-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; line-height: 32px; color: #333333; } .ser_a .step_1 .content .lt-box .text-box li .te { position: relative; padding-left: 12px; } .ser_a .step_1 .content .lt-box .text-box li .te::after { content: ""; width: 4px; height: 4px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; left: 0; background-color: #999999; top: 14px; } .ser_a .step_1 .content .rt-box { position: absolute; left: 57.1429%; top: 0; height: 100%; right: 0; } .ser_a .step_1 .content .rt-box .text-box { background-color: #fafafa; padding: 6.9% 8.3% 0 8.3%; display: none; height: 100%; } .ser_a .step_1 .content .rt-box .text-box .title { font-size: 18px; color: #333333; margin-bottom: 18px; } .ser_a .step_1 .content .rt-box .text-box .text { font-size: 16px; line-height: 28px; color: #666666; text-align: justify; } .ser_a .step_1 .content .rt-box .text-box:first-child { display: block; } .ser_a .step_1 .content .rt-box .box { height: 50%; } .ser_a .step_1 .content .rt-box .imgbox { -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; } .ser_a .step_1 .content:nth-child(2) .lt-box { width: 72.0238%; } .ser_a .step_1 .content:nth-child(2) .lt-box .text-box li { width: 24%; margin-right: 1.3333%; } .ser_a .step_1 .content:nth-child(2) .lt-box .text-box li:last-child { margin-right: 0; } .ser_a .step_1 .content:nth-child(2) .rt-box { left: 72.0238%; } .ser_a .step_2 { padding: 0 0 3.5714% 0; } .ser_a .step_2 .step-tl { margin-bottom: 40px; } .ser_a .step_2 .question { border: 1px solid #d2edfa; border-bottom: none; } .ser_a .step_2 .question li { -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; border-bottom: 1px solid #d2edfa; background-color: #fafafa; } .ser_a .step_2 .question li .title { line-height: 70px; padding-left: 38px; font-size: 18px; color: #333333; cursor: pointer; -webkit-transition: all 0.2s; -o-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; } .ser_a .step_2 .question li .title span { padding-left: 22px; border-left: 4px solid #3680e3; } .ser_a .step_2 .question li .detail { padding: 0 0 48px; display: none; } .ser_a .step_2 .question li .detail .text-box { padding: 0 60px ; } .ser_a .step_2 .question li .detail .text-box .indiv { border: solid 1px #d2edfa; padding: 32px 60px; color: #666666; font-size: 16px; line-height: 32px; } .ser_a .step_2 .question .current { background: none; } .ser_a .step_2 .question li:hover .title { color: #0f8ec7; } .ser_a .ser2_content .step-img-box { padding: 40px 55px; background-color: #dce3e6; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-bottom: 50px; } .ser_a .ser2_content .step-img-box .step-tab { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid rgba(0, 0, 0, 0.04); } .ser_a .ser2_content .step-img-box .step-tab .tab { width: 120px; height: 40px; background-color: #b1c9d4; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-right: 30px; text-align: center; line-height: 40px; color: #ffffff; font-size: 18px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; cursor: pointer; } .ser_a .ser2_content .step-img-box .step-tab .tab:last-child { margin-right: 0; } .ser_a .ser2_content .step-img-box .step-tab .tab:hover, .ser_a .ser2_content .step-img-box .step-tab .current { background: #3680e3; } .ser_a .ser2_content .step-img-box .step-img img { width: 100%; display: none; } .ser_a .ser2_content .step-img-box .step-img img:nth-child(1) { display: block; } .ser_a .ser2_content .rulle { padding: 50px 55px; background-color: #f9f9f9; border: solid 1px #d2edfa; } .ser_a .ser2_content .rulle .rulle-tl { font-size: 18px; color: #3680e3; padding-bottom: 40px; border-bottom: 1px solid #d2edfa; margin-bottom: 40px; } .ser_a .ser2_content .rulle .rulle-box { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .ser_a .ser2_content .rulle .rulle-box .box { width: 50%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; line-height: 28px; color: #757575; } .ser_a .ser2_content .rulle .rulle-box .box .img { height: 70px; margin-bottom: 20px; } .ser_a .ser2_content .rulle .rulle-box .box:nth-child(1) { padding-right: 5%; border-right: 1px solid #d2edfa; } .ser_a .ser2_content .rulle .rulle-box .box:nth-child(2) { padding-left: 5%; } .ser_b { padding-bottom: 3.125%; } .ser_b .title-box { padding-bottom: 3.3333%; background: url(../images/ser_04.jpg) no-repeat center / cover; } .ser_b .title-box .block-title .cn { color: #fff; } .ser_b .title-box .block-title .en { color: #92c6dd; } .ser_b .title-box .tabline { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; border-bottom: 1px solid rgba(210, 237, 250, 0.2); } .ser_b .title-box .tabline .tab { height: 40px; padding: 0 40px; font-size: 18px; color: #ffffff; position: relative; cursor: pointer; } .ser_b .title-box .tabline .tab::after { content: ""; width: 1px; height: 14px; top: 2px; right: 0; background: rgba(255, 255, 255, 0.4); } .ser_b .title-box .tabline .tab::before { content: ""; width: 0px; height: 3px; background-color: #ffffff; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: -2px; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .ser_b .title-box .tabline .tab:hover::before, .ser_b .title-box .tabline .current::before { width: 40px; } .ser_b .div_out .bdiv { display: none; } .ser_b .div_out .bdiv .pub-list-news { padding-top: 40px; } .ser_b .div_out .bdiv .pub-list-news li { width: 32.1429%; margin: 1.78565% 1.78565% 0 0; } .ser_b .div_out .bdiv .pub-list-news li a .te { line-height: 30px; font-size: 16px; height: 104px; white-space: normal; overflow: auto; } .ser_b .div_out .bdiv .pub-list-news li:nth-child(3n) { margin-right: 0; } .ser_b .div_out .bdiv .pub-list-news li:nth-child(1), .ser_b .div_out .bdiv .pub-list-news li:nth-child(2), .ser_b .div_out .bdiv .pub-list-news li:nth-child(3) { margin-top: 0; } .ser_b .div_out .bdiv:first-child { display: block; } .ser_c { padding-bottom: 7.5%; } .ser_c .mapbox { margin: 0 auto; width: 962px; position: relative; } .ser_c .mapbox .mapimg{position: relative;left:-80px} .ser_c .mapbox .mapimg img:nth-child(2){ position: absolute; top: 5px; left:180px; width: 100%; } .ser_c .mapbox .point-box { position: absolute; left: -80px; top: 0; width: 100%; height: 100%; } .ser_c .mapbox .point-box .point { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; width: 220px; line-height: 50px; position: absolute; -webkit-box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.06); -moz-box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 4px 0px 0px rgba(0, 0, 0, 0.06); font-size: 18px; text-align: center; color: #fff; cursor: pointer; -webkit-transition: all 0.2s; -o-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; } .ser_c .mapbox .point-box .point .te { height: 100%; } .ser_c .mapbox .point-box .point i { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; width: 50px; height: 50px; position: absolute; display: block; top: 0; background: rgba(255, 255, 255, 0.1); } .ser_c .mapbox .point-box .point i::after, .ser_c .mapbox .point-box .point i::before { content: ""; background: #fff; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .ser_c .mapbox .point-box .point i::before { width: 3px; height: 20px; } .ser_c .mapbox .point-box .point i::after { width: 20px; height: 3px; } .ser_c .mapbox .point-box .point:nth-child(1) .te, .ser_c .mapbox .point-box .point:nth-child(3) .te { padding-right: 50px; } .ser_c .mapbox .point-box .point:nth-child(1) i, .ser_c .mapbox .point-box .point:nth-child(3) i { right: 0; } .ser_c .mapbox .point-box .point:nth-child(2) .te, .ser_c .mapbox .point-box .point:nth-child(4) .te, .ser_c .mapbox .point-box .point:nth-child(5) .te, .ser_c .mapbox .point-box .point:nth-child(6) .te { padding-left: 50px; } .ser_c .mapbox .point-box .point:nth-child(2) i, .ser_c .mapbox .point-box .point:nth-child(4) i, .ser_c .mapbox .point-box .point:nth-child(5) i, .ser_c .mapbox .point-box .point:nth-child(6) i { left: 0; } .ser_c .mapbox .point-box .point:nth-child(1) { left: 490px; top: 240px; } .ser_c .mapbox .point-box .point:nth-child(1) .te { background-color: #d13f3f; } .ser_c .mapbox .point-box .point:nth-child(1)::after { content: ""; width: 19px; height: 18px; background: url(../images/star.png) no-repeat; left: 188px; top: 69px; } .ser_c .mapbox .point-box .point:nth-child(2) { left: 856px; top: 453px; } .ser_c .mapbox .point-box .point:nth-child(2) .te { background-color: #ffae6c; } .ser_c .mapbox .point-box .point:nth-child(2)::after { content: ""; width: 12px; height: 12px; background: #ffae6c; left: -25px; top: 26px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .ser_c .mapbox .point-box .point:nth-child(3) { left: 580px; top: 532px; } .ser_c .mapbox .point-box .point:nth-child(3) .te { background-color: #0f8ec7; } .ser_c .mapbox .point-box .point:nth-child(3) .cir { position: absolute; width: 8px; height: 8px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; right: -10px; top: -10px; } .ser_c .mapbox .point-box .point:nth-child(3) .cir span { display: block; width: 100%; height: 100%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; position: absolute; left: 0; top: 0; background: #3680e3; } .ser_c .mapbox .point-box .point:nth-child(3) .cir span:nth-child(1) { background: #fff; z-index: 10; } .ser_c .mapbox .point-box .point:nth-child(3) .cir span:nth-child(2), .ser_c .mapbox .point-box .point:nth-child(3) .cir span:nth-child(3) { left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: scale1 3s linear infinite; -moz-animation: scale1 3s linear infinite; animation: scale1 3s linear infinite; } .ser_c .mapbox .point-box .point:nth-child(3) .cir span:nth-child(3) { -webkit-animation: scale1 3s 1.5s linear infinite; -moz-animation: scale1 3s 1.5s linear infinite; animation: scale1 3s 1.5s linear infinite; } .ser_c .mapbox .point-box .point:nth-child(4) { left: 850px; top: 539px; } .ser_c .mapbox .point-box .point:nth-child(4) .te { background-color: #beb388; } .ser_c .mapbox .point-box .point:nth-child(4)::after { content: ""; width: 12px; height: 12px; background: #beb388; left: -24px; top: -8px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .ser_c .mapbox .point-box .point:nth-child(6) { left: 726px; top: 610px; } .ser_c .mapbox .point-box .point:nth-child(6) .te { background-color: #7ca5b0; } .ser_c .mapbox .point-box .point:nth-child(6)::after { content: ""; width: 12px; height: 12px; background: #7ca5b0; left: -10px; top: 50px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .ser_c .mapbox .point-box .point:nth-child(5) { left: 520px; top: 460px; } .ser_c .mapbox .point-box .point:nth-child(5) .te { background-color: #46cc8e; } .ser_c .mapbox .point-box .point:nth-child(5)::after { content: ""; width: 12px; height: 12px; background: #46cc8e; left: -10px; top: 50px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .ser_c .tcbox { position: absolute; left: -192px; top: 267px; width: 640px; height: 550px; background-color: rgba(255, 255, 255, 0.6); -webkit-box-shadow: 0px 10px 20px 0px rgba(16, 77, 199, 0.08); -moz-box-shadow: 0px 10px 20px 0px rgba(16, 77, 199, 0.08); box-shadow: 0px 10px 20px 0px rgba(16, 77, 199, 0.08); border: solid 1px #d2edfa; padding: 28px; opacity: 0; } .ser_c .tcbox .tc { height: 100%; display: none; } .ser_c .tcbox .title { color: #0f8ec7; font-size: 18px; margin-bottom: 30px; } .ser_c .tcbox .cont-box { overflow: auto; height: -webkit-calc(100% - 48px); height: -moz-calc(100% - 48px); height: calc(100% - 48px); padding-right: 40px; } .ser_c .tcbox .cont-box .bf-box .bf { height: 40px; font-size: 16px; color: #333333; position: relative; cursor: pointer; text-align: center; } .ser_c .tcbox .cont-box .bf-box .bf::after { content: ""; width: 100%; height: 1px; background: #3680e3; left: 0; bottom: 0; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; z-index: 10; } .ser_c .tcbox .cont-box .bf-box .bf:hover::after, .ser_c .tcbox .cont-box .bf-box .current::after { -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .ser_c .tcbox .cont-box .bf-box::after { content: ""; left: 0; bottom: 0; height: 1px; background-color: #f0f0f0; width: 100%; } .ser_c .tcbox .cont-box .sect { display: none; } .ser_c .tcbox .cont-box .sect .lxbox { padding: 25px 0 25px; } .ser_c .tcbox .cont-box .sect .lxbox .addr { line-height: 24px; color: #333333; font-size: 16px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 16px; } .ser_c .tcbox .cont-box .sect .lxbox .addr img { margin-right: 12px; } .ser_c .tcbox .cont-box .sect .lxbox .addr:last-child { margin-bottom: 0; } .ser_c .tcbox .cont-box .sect ul li { margin: 0 3.7038% 3.7038% 0; width: 48.1481%; float: left; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; border: solid 1px #f0f0f0; padding: 9px; } .ser_c .tcbox .cont-box .sect ul li .imgbox { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 20px; } .ser_c .tcbox .cont-box .sect ul li .info { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; color: #333333; font-size: 16px; } .ser_c .tcbox .cont-box .sect ul li .info .name { padding: 25px 0 12px; border-bottom: 1px solid #f0f0f0; margin-bottom: 20px; } .ser_c .tcbox .cont-box .sect ul li:nth-child(2n) { margin-right: 0; } .ser_c .tcbox .cont-box .sect:nth-child(1) { display: block; } .ser_c .acttcbox { opacity: 1; } @-webkit-keyframes scale1 { 0% { width: 8px; height: 8px; } 100% { width: 48px; height: 48px; opacity: 0; } } @-moz-keyframes scale1 { 0% { width: 8px; height: 8px; } 100% { width: 48px; height: 48px; opacity: 0; } } @keyframes scale1 { 0% { width: 8px; height: 8px; } 100% { width: 48px; height: 48px; opacity: 0; } } @media (max-width: 1440px) { .step-tl .index { width: 50px; height: 50px; text-align: center; line-height: 50px; font-size: 26px; } .step-tl .t-box .cn { font-size: 20px; margin-bottom: 8px; } .ser_a .step_1 .top .ser-tab-box .tab { line-height: 50px; font-size: 16px; } .ser_a .step_1 .content .rt-box .text-box .text { font-size: 14px; line-height: 24px; } .ser_a .step_2 .question li .title { font-size: 16px; } .ser_a .step_2 .question li .title span { padding-left: 15px; } .ser_a .step_2 .question li .detail .text-box .indiv { padding: 20px 50px; font-size: 14px; line-height: 24px; } .ser_a .ser2_content .step-img-box .step-tab .tab { font-size: 16px; } .ser_b .title-box .tabline .tab { font-size: 16px; } .ser_c .tcbox { width: 620px; left: -170px; } .ser_c .mapbox .point-box .point .te { font-size: 16px; } } @media (max-width: 1280px) { .step-tl .t-box .cn { font-size: 18px; } .ser_b .div_out .bdiv .pub-list-news li a .title { padding-bottom: 16px; } .ser_b .div_out .bdiv .pub-list-news li a .te { font-size: 14px; line-height: 24px; } .ser_c .tcbox { width: 500px; left: -100px; padding: 30px 18px; } .ser_c .tcbox .title { font-size: 16px; margin-bottom: 20px; } .ser_c .tcbox .cont-box .sect .lxbox { padding: 18px 0; } .ser_c .tcbox .cont-box .sect .lxbox .addr { margin-bottom: 10px; font-size: 14px; } .ser_c .tcbox .cont-box .sect ul li { padding: 5px; } .ser_c .tcbox .cont-box .sect ul li .imgbox { width: 60px; margin-right: 10px; } .ser_c .tcbox .cont-box .sect ul li .info { font-size: 14px; } .ser_c .tcbox .cont-box .sect ul li .info .name { padding: 15px 0 7px; } } @media (max-width: 1024px) { .ser_c .mapbox { width: 750px; } .ser_c .mapbox .point-box .point { width: 160px; line-height: 30px; } .ser_c .mapbox .point-box .point .te { font-size: 12px; } .ser_c .mapbox .point-box .point i { width: 30px; height: 30px; } .ser_c .mapbox .point-box .point i::after { width: 14px; height: 1px; } .ser_c .mapbox .point-box .point i::before { width: 1px; height: 14px; } .ser_c .mapbox .point-box .point:nth-child(1) .te, .ser_c .mapbox .point-box .point:nth-child(3) .te { padding-right: 30px; } .ser_c .mapbox .point-box .point:nth-child(2) .te, .ser_c .mapbox .point-box .point:nth-child(4) .te, .ser_c .mapbox .point-box .point:nth-child(5) .te { padding-left: 30px; } .ser_c .mapbox .point-box .point:nth-child(1) { left: 392px; top: 190px; } .ser_c .mapbox .point-box .point:nth-child(2) { left: 668px; top: 346px; } .ser_c .mapbox .point-box .point:nth-child(3) { left: 466px; top: 413px; } .ser_c .mapbox .point-box .point:nth-child(4) { left: 665px; top: 425px; } .ser_c .mapbox .point-box .point:nth-child(5) { left: 565px; top: 490px; } .ser_c .mapbox .point-box .point:nth-child(1)::after { left: 140px; top: 44px; } .ser_c .mapbox .point-box .point:nth-child(5)::after { top: 30px; } .ser_c .tcbox { top: 175px; height: 480px; } } @media (max-width: 768px) { .ser_a .step-tl { margin-bottom: 10px; } .ser_a .step-tl .index { margin-right: 14px; } .ser_a .step_1 { padding: 30px 0; } .ser_a .step_1 .top { display: block; margin-bottom: 20px; } .ser_a .step_1 .top .step-tl { margin-right: 0; } .ser_a .step_1 .top .ser-tab-box .tab { font-size: 14px; width: 33.3333%; margin-right: 0; text-align: center; } .ser_a .step_1 .content-box .current { display: block; } .ser_a .step_1 .content-box .content .lt-box { width: 100%; } .ser_a .step_1 .content-box .content .lt-box .imgbox { margin-bottom: 10px; } .ser_a .step_1 .content-box .content .lt-box .text-box li { font-size: 12px; line-height: 20px; } .ser_a .step_1 .content-box .content .lt-box .text-box li .te::after { top: 7px; } .ser_a .step_1 .content-box .content .rt-box { width: 100%; position: static; } .ser_a .step_1 .content-box .content .rt-box .text-box { padding: 20px 3.3333%; } .ser_a .step_1 .content-box .content .rt-box .text-box .title { font-size: 16px; margin-bottom: 10px; } .ser_a .step_2 .question li .title { padding-left: 10px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 44px; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .ser_a .step_2 .question li .title span { width: 100%; padding-left: 10px; border-left: none; position: relative; line-height: 24px; display: block; } .ser_a .step_2 .question li .title span::after { content: ""; width: 2px; height: 16px; left: 0; top: 4px; background: #3680e3; } .ser_a .step_2 .question li .detail { padding-bottom: 20px; } .ser_a .step_2 .question li .detail .text-box { padding: 0 20px; } .ser_a .step_2 .question li .detail .text-box .indiv { padding: 15px 10px; } .ser_a .ser2_content .step-img-box { margin-bottom: 20px; padding: 20px 10px; } .ser_a .ser2_content .step-img-box .step-tab { padding-bottom: 10px; margin-bottom: 10px; } .ser_a .ser2_content .step-img-box .step-tab .tab { font-size: 14px; margin-right: 10px; } .ser_a .ser2_content .rulle { padding: 20px 10px; } .ser_a .ser2_content .rulle .rulle-tl { margin-bottom: 20px; padding-bottom: 20px; } .ser_a .ser2_content .rulle .rulle-box .box { padding: 0!important; width: 100%; } .ser_a .ser2_content .rulle .rulle-box .box .img { margin-bottom: 0; } .ser_a .ser2_content .rulle .rulle-box .box:first-child { border-right: none; margin-bottom: 20px; } .ser_b { padding-bottom: 0; } .ser_b .title-box .tabline .tab { padding: 0 5px; width: 25%; font-size: 14px; text-align: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; line-height: 20px; height: 46px; } .ser_b .div_out .bdiv .pub-list-news li { width: 100%; margin: 0 0 20px 0; } .ser_b .div_out .bdiv .pub-list-news li:last-child { margin-bottom: 0; } .ser_c { padding-bottom: 60px; } .ser_c .mapbox { width: 100%; } .ser_c .mapbox .point-box { position: static; width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 20px 0; } .ser_c .mapbox .point-box .point { position: relative; left: 0!important; top: 0!important; width: 48.5%; margin: 0 3% 3% 0; } .ser_c .mapbox .point-box .point .cir { display: none; } .ser_c .mapbox .point-box .point .te { padding-right: 30px!important; padding-left: 0px!important; } .ser_c .mapbox .point-box .point i { right: 0!important; left: auto!important; } .ser_c .mapbox .point-box .point::after { display: none; } .ser_c .mapbox .point-box .point:nth-child(2n) { margin-right: 0; } .ser_c .tcbox { width: 100%; position: static; padding: 20px 10px; } .ser_c .tcbox .cont-box { padding-right: 0; } .ser_c .tcbox .cont-box .bf-box .bf { font-size: 12px; padding-top: 10px; } .ser_c .tcbox .cont-box .sect .lxbox { padding: 10px 0; } .ser_c .tcbox .cont-box .sect ul li { width: 100%; margin: 0 0 10px 0; } .ser_c .mapbox .mapimg{left:0px} .ser_c .mapbox .mapimg img{width: 80%;} .ser_c .mapbox .mapimg img:nth-child(2){left: 0;left: 16%;width: 80%;} }