.in-header{ width: 100%; height: 5rem; padding: 0 10%; display: flex; justify-content: space-between; border-bottom: 1px solid #c4c4c2; } .in-footer{ width: 100%; height: 7rem; padding: 0 10%; display: flex; align-items: center; justify-content: space-between; background-color: #f3f3f3; } .in-footer-link{ margin-bottom: 10px; } .in-footer-link span{ margin-right: 20px; } .in-footer img{ height:2.8rem; width: auto; } .in-footer .copyright{ color: #9fa3ae; font-weight: bold; font-size: 0.875rem; } .header-l{ display: flex; height: 100%; align-items: center; } .header-l img{ height:3.375rem; width: auto; } .header-r .lan{ display: flex; align-items: center; margin-left: 6.25rem; font-weight: bold; position: relative; cursor: pointer; } .header-r .active{ color: #45ae86; } .header-r .active::after{ position: absolute; left: 50%; bottom: 0; transform:translate(-50%,0); content: ""; width: 48px; height: 0px; border: 2px solid #45ae86; display: inline-block; } .in-banner img{ height: auto; width: 100%; } .in-imdes{ height: 9.5rem; text-align: center; line-height: 9.5rem; margin: 1.625rem 11rem; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); border-radius: 15px; font-size: 32px; font-weight: bold; color: #007047; } .in-home-title{ width: 100%; padding: 1.75rem 22%; font-weight: bold; } .in-home-title .title-one{ text-align: center; font-size: 1.5625rem; } .in-home-title .title-two{ font-size: 1.125rem; margin-top: 1.5rem; line-height: 1.875rem; text-align: justify; } .in-home-title .title-three{ color: #555555; font-size: 0.9375rem; margin-top: 1.5rem; line-height: 1.875rem; text-align: justify; } .com-img{ margin: 0 20% 0; } .com-img img{ width: 100%; height: auto; } .in-bus{ align-items: center; margin: 0 22% 0.5rem; font-weight: bold; height: 17rem; background: #f9fafc; background-image:; background-size: 100% 100%; background-repeat: no-repeat; } .in-bus-l{ padding: 8.4375rem 4.25rem 8.4375rem 1.25rem; position: relative; font-style: italic; letter-spacing: 5px; font-size: 20px; } .in-bus-l::after{ position: absolute; top: 50%; right: 0; transform: translate(0, -50%); content: ""; width: 0; height: 164px; border: 1px solid #e4e4e4; display: inline-block; } .in-bus-r{ padding: 4rem 0 4rem 5.625rem; height: 100%; justify-content: space-between; font-size: 1.25rem; } .in-his{ padding: 0 12.5rem 2rem 14.375rem; display: flex; justify-content: flex-start; } .in-his-l{ width: 11.25rem; color: #ababab; font-weight: bold; } .in-his-l .time{ font-size: 2rem; color: #036f4b; display: block; font-weight: bold; } .in-his-r{ flex: 1; } .in-his-r h4{ line-height: 2rem; margin-bottom: 0.625rem; position: relative; text-align: justify; } .in-his-r h4::before{ position: absolute; left: -11px; top: 12px; transform: translate(-50%, 0); content: ""; width: 8px; height: 8px; background: #00754c; display: inline-block; border-radius: 50%; } .in-his-r p{ line-height: 1.6875rem; font-size: 14px; color: #848383; font-family: none; margin-bottom: 0.4375rem; font-weight: 600; text-align: justify; } @media screen and (max-width: 1400px){ .in-home-title{ padding: 1.75rem 12%; } .in-imdes{ font-size: 28px; margin: 1.625rem 6rem; } .in-bus{ margin: 0 12% 0rem; } .com-img{ margin: 0 9% 0rem; } .in-his{ padding: 0 8.5rem 2rem 6.375rem; } .in-footer{ justify-content: space-around; flex-wrap: wrap; height: 9rem; } .in-footer .copyright{ text-align: center; } } @media screen and (max-width: 960px){ .in-imdes{ font-size: 20px; margin: 1.625rem 2rem; } .in-footer{ justify-content: center; } }