section { padding: 42px 0 72px; background-color: rgba(210, 216, 255, 0.6); } .hidden { display: none !important; } .section-title { display: grid; grid-template-rows: 52px 25px; line-height: 1; } .section-title-left { grid-template-columns: 1fr auto; } .section-title-center { justify-items: center; } .section-title-zh { color: #155BB1; font-size: 40px; font-weight: bold; } .section-title-en { grid-row: 2; color: #474747; font-size: 23px; font-weight: lighter; } .section-title-buttons { display: flex; align-items: center; gap: 28px; grid-row: 1/-1; } .section-title-button { background: #D0DAF8; color: #6894D0; line-height: 63px; font-size: 28px; font-weight: lighter; padding: 0 1em; text-decoration: none; border-radius: 63px; } .section-title-button.active { background: #6894D0; color: #fff; } .part { border-radius: 20px; overflow: hidden; margin-top: 30px; } .xmjs .tabs { background-color: #6894D0; border-radius: 20px 20px 0 0; line-height: 80px; display: flex; justify-content: space-around; font-size: 26px; font-weight: lighter; color: rgba(255, 255, 255, 0.5); } .xmjs .tab { cursor: pointer; } .xmjs .tab.active { color: #fff; border-bottom: 4px solid #91243D; } .xmjs .panel-wrap { background: #fff url(../images/img7.jpg) bottom no-repeat; min-height: 754px; border-radius: 0 0 20px 20px; } .xmjs .panel { padding: 26px 52px 32px; } .zyjs .cards { display: grid; grid-template-columns: repeat(4, 282px); grid-auto-rows: 338px; justify-content: space-between; } .zyjs .card { border-radius: 20px; font-size: 23px; font-weight: lighter; line-height: 26px; color: #fff; padding-top: 40px; display: grid; grid-template-rows: 138px auto; cursor: pointer; } .zyjs .card:nth-child(1) { background: #913B4A; } .zyjs .card:nth-child(2) { background: #3E3372; } .zyjs .card:nth-child(3) { background: #E87C72; } .zyjs .card:nth-child(4) { background: #7BA6AA; } .zyjs .card-img { justify-self: center; align-self: center; } .zyjs .card-content { text-align: center; margin-top: 27px; } .zyjs .card-title { font-size: 32px; line-height: 1; } .zyjs .card-content p { margin: 0; margin-top: 22px; } .zyjs .title { font-size: 27px; font-weight: bold; margin: 50px 0 44px; color: #494949; } .zyjs .title .sub { font-size: 20px; font-weight: 100; margin-left: 2em; } .zyjs .table { display: grid; grid-template-rows: repeat(3, 55px); row-gap: 1px; border-radius: 20px; overflow: hidden; } .zyjs .table .row { background: #fff; font-size: 20px; font-weight: 100; line-height: 55px; padding-left: 2em; } .zyjs .cards2 { display: grid; grid-template-columns: repeat(2, 586px); grid-template-rows: repeat(2, 336px); gap: 28px; } .zyjs .card2 { border-radius: 20px; background: var(--color); display: grid; grid-template-rows: 77px 1fr 5px; } .zyjs .card2:nth-child(1) { --color: #913B4A; } .zyjs .card2:nth-child(2) { --color: #3E3372; } .zyjs .card2:nth-child(3) { --color: #E87C72; } .zyjs .card2:nth-child(4) { --color: #7BA6AA; } .zyjs .card2-title { line-height: 77px; color: #fff; text-align: center; font-size: 30px; font-weight: 100; position: relative; } .zyjs .card2-title::after { content: ''; display: block; border-radius: 0 0 6px; width: 36px; height: 36px; background: linear-gradient(135deg ,transparent 30%, var(--color) 30%); position: absolute; left: 275px; bottom: -14px; transform: rotate(45deg); } .zyjs .card2-content { background: #fff; border-radius: 20px; box-sizing: border-box; padding: 42px 38px 0; font-size: 16px; font-weight: 100; line-height: 26px; text-align: justify; } .zyjs-course.Business { --color: #913B4A; } .zyjs-course.Global-Trade-and-Business { --color: #3E3372; } .zyjs-course.Financial-Services { --color: #E87C72; } .zyjs-course.Business-with-Accounting { --color: #7BA6AA; } .zyjs-course { display: grid; grid-template-rows: 95px auto; } .zyjs-course .course-title { background: var(--color); padding-left: 38px; padding-top: 22px; display: grid; grid-template-columns: 160px 1fr auto; grid-template-rows: 38px 20px; color: #fff; font-weight: 100; } .zyjs-course .course-icon { margin-top: -10px; position: absolute; } .zyjs-course .course-title-zh { grid-column: 2; font-size: 28px; } .zyjs-course .course-title-en { font-size: 19px; grid-column: 2; } .zyjs-course .course-btns { align-self: center; grid-column: 3; grid-row: 1 / -1; display: flex; padding-right: 40px; font-size: 22px; opacity: 0.5; gap: 1em; } .zyjs-course .course-btn { cursor: pointer; } .zyjs-course .course-btn-split { width: 1px; background: #fff; } .zyjs-course .course-content { background: #fff; padding: 52px 38px 44px; } .zyjs-course .course-content h2 { color: #155BB1; font-size: 20px; font-weight: bold; } .zyjs-course .course-content p { font-size: 16px; font-weight: 100; text-indent: 2em; text-align: justify; line-height: 26px; } .bkzn .tabs { background-color: #6894D0; border-radius: 20px 20px 0 0; line-height: 80px; display: flex; justify-content: space-around; font-size: 26px; font-weight: lighter; color: rgba(255, 255, 255, 0.5); } .bkzn .tab { cursor: pointer; } .bkzn .tab.active { color: #fff; border-bottom: 4px solid #91243D; } .bkzn .panel-wrap { background: #fff; min-height: 600px; border-radius: 0 0 20px 20px; } .bkzn .panel { padding: 26px 52px 32px; } .bkzn .cards { display: grid; grid-template-columns: repeat(3, 342px); justify-content: space-between; row-gap: 30px; margin-top: 50px; } .bkzn .card { border-radius: 22px; overflow: hidden; font-size: 16px; font-weight: lighter; line-height: 24px; padding: 20px 28px 0; display: grid; grid-template-rows: 130px 25px auto; height: 460px; } .bkzn .card:nth-child(1){ background: url(../images/card7.png) no-repeat; } .bkzn .card:nth-child(2) { background: url(../images/card8.png) no-repeat; } .bkzn .card:nth-child(3) { background: url(../images/card9.png) no-repeat; } .bkzn .card-img { justify-self: center; align-self: center; } .bkzn .card-content { text-align: justify; } .bkzn .card-content p { margin: 0.6em 0; } .bkzn .card-title { font-size: 25px; font-weight: bold; text-align: center; color: #155BB1; } .bkzn h2 { color: #155BB1; font-size: 20px; font-weight: bold; } .bkzn .cards2 { display: grid; grid-template-columns: repeat(3, 1fr); justify-content: space-between; align-content: center; margin-top: 50px; height: 446px; } .bkzn .card2 { display: grid; grid-template-rows: 100px auto; } .bkzn .card2-img { justify-self: center; align-self: center; width: 100px; height: 100px; } .bkzn .card2-content { font-size: 20px; font-weight: lighter; color: #515151; text-align: center; margin-top: 50px; } .xyfc-section-title { width: 212px; height: 70px; font-size: 32px; font-weight: 100; color: #fff; background: rgba(21, 91, 177, .6); display: flex; justify-content: center; align-items: center; border-radius: 70px; margin: 54px auto 25px; } .xyqx { border-radius: 20px; background: #fff; border: 1px solid rgba(21, 91, 177, .5); padding: 62px 75px; display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 55px; text-align: center; } .xyqx .student-name { color: #155BB1; font-size: 29px; font-weight: bold; margin: 25px 0 23px; } .xyqx .student-info { color: #2D2D2D; font-size: 23px; font-weight: 100; line-height: 34px; } .xysj .student { border-radius: 20px; background-color: #fff; background-image: url(../images/divider.svg); background-repeat: no-repeat; background-position: 50px 270px; border: 1px solid rgba(21, 91, 177, .5); padding: 50px 60px 40px 50px; display: grid; grid-template-columns: 175px 56px auto; grid-template-rows: 50px auto 72px auto; } .xysj .student + .student { margin-top: 18px; } .xysj .student-img { grid-row: span 2; } .xysj .student-name { color: #155BB1; font-size: 29px; font-weight: bold; } .xysj .student-info { grid-column: 3; display: flex; align-items: flex-end; gap: 30px; font-size: 20px; font-weight: 100; } .xysj .student-quote { grid-column: 3 / -1; font-size: 18px; font-weight: 100; line-height: 28px; background-image: url(../images/quote-l.svg), url(../images/quote-r.svg); background-repeat: no-repeat; background-size: 30px auto; background-position: 60px 30px, right bottom; padding: 30px 60px 0 130px; } .xysj .student-content { grid-row: 4; grid-column: 1 / -1; font-weight: 100; line-height: 23px; }