.main-title-content { width: 100%; height: 100%; background: rgba(0, 0, 0, .4); color: #fff; box-sizing: border-box; padding: 9rem 23rem; } h1 { font-size: 4.38rem; font-weight: 600; } h3 { font-size: 1.63rem; letter-spacing: 0.2rem; font-weight: 400; margin-top: 2.5rem; } .introitem-title { display: flex; align-items: center; font-size: 2rem; color: #333; margin-bottom: 3rem; font-weight: bold; } .introitem-title img { margin-right: 0.75rem; } .culture-item { padding: 7.5rem 23rem 0; } .culture-item:last-child { margin-bottom: 7.5rem; } .culture-content { width: 100%; box-sizing: border-box; background: url('../../images/about/culture-item-bg.png') no-repeat center center/150%; border-left: 0.38rem solid #07A359; padding: 3rem; padding-right: 6rem; display: flex; align-items: center; justify-content: space-between; } .culture-info { width: 52rem; } .culture-img { width: 8.13rem; height: 8.13rem; flex-shrink: 0; } .culture-img > img { width: 100%; height: 100%; } .culinfo-title { font-size: 1.25rem; font-weight: 700; color: rgba(7, 163, 89, 1); } .culinfo-text { font-size: 1rem; line-height: 2; color: rgba(102, 102, 102, 1); text-align: justify; padding-top: 0.75rem; } .turnbox { display: flex; justify-content: space-between; align-items: center; } .tern-imgbox { width: 43%; } .tern-imgbox > img { width: 100%; } .turncontent-box { width: 52%; } .turncontent-box .title { width: 100%; /* height: 40px; */ line-height: 40px; background: url('../../images/about/whtitlebg.svg') no-repeat center center/100%; font-size: 24px; color: rgba(0, 105, 52, 1); letter-spacing: 20px; text-align: center; } .items { display: flex; flex-wrap: wrap; justify-content: space-between; color: rgba(102, 102, 102, 1); } .items .item-box { width: 47%; margin-top: 30px; margin-bottom: 20px; position: relative; } .items .item-box::before { content: ''; position: absolute; width: 85%; height: 2px; background: #07A359; bottom: -20px; left: 0; } .items .item-box::after { content: ''; position: absolute; width: 15%; height: 2px; background: rgba(252, 200, 14, 1); bottom: -20px; right: 0; } .items .item-box p { line-height: 2; } .items .item-title { display: flex; align-items: center; margin-bottom: 20px; } .items .item-title img { height: 20px; margin-right: 8px; } .items .item-title span { color: rgba(7, 163, 89, 1); font-size: 20px; font-weight: 600; } .lh-item { display: flex; align-items: center; margin-bottom: 34px; } .lh-item img { width: 32px; margin-right: 17px; } .lh-item p { line-height: 2; color: rgba(102, 102, 102, 1); } @media screen and (max-width: 1023px) { .culture-item { padding: 7.5rem 10rem 0; } .culture-info { width: 100%; padding-left: 3rem; } } @media screen and (max-width: 750px) { .item-content,.lh-item{ font-size: 12px; } .turncontent-box .title{ font-size: 14px; letter-spacing:14px } .main-title { width: 100%; height: 37.19rem; } .culture-img { width: 13.13rem; height: 13.13rem; flex-shrink: 0; } .introitem-title, h4, .culinfo-title { font-size: 16px; } .culinfo-text { font-size: 12px; } .turnbox { display: block; } .tern-imgbox { width: 100%; } .turncontent-box { width: 100%; } }