@font-face { font-family: 'GILROY-LIGHT'; src: url("../fonts/GILROY-LIGHT.OTF"); } @font-face { font-family: 'GILROY-REGULAR'; src: url("../fonts/GILROY-REGULAR.OTF"); } @font-face { font-family: 'GILROY-MEDIUM'; src: url("../fonts/GILROY-MEDIUM.OTF"); } @font-face { font-family: 'GILROY-BOLD'; src: url("../fonts/GILROY-BOLD.OTF"); } .font-12 { font-size: 12px; } .font-14, .c-sublink a, .campus-btn1, .c-crumbs a.link, .about-s4 .line-box li span, .admissions-s3 .item a, .admissions-s4 a, .research-s5 .item span, .news .search-content .con1 input[type="text"], .news .search-content .ta_date, .news-s3 .news-content li .time, .research-s6 li.flex .time { font-size: 14px; } .font-16, .fixed-search input, .fixed-search .link a, .lg-sub-html p, .admissions-s2 .item a, .admissions-s3 .item .para, .admissions-s5 .item p, .campus-s2 .item span, .campus-s5 .para, .campus-s7 .item .para, .academics-s1 a, .academics-s3 .item .para, .research-s2 .item p, .research-s3 .item p, .research-s3 .info, .research-s5 .item p, .global-s2 .map-block .dot span, .global-s3 .item .para, .global-s5 .item span, .global-s5 .item .mail, .global-s5 .item p, .global-s5 .desc p, .index-page .more-box a, .index-s3 .right-block .item p, .index-s4 .item span, .index-s5 .item .show .txt-box span, .index-s5 .item .hide .para, .index-s5 .right-block span, .index-s6 .center-block .item span, .news-s3 .first .tags a, .news-s3 .activity li .text, .news-s3 .activity li .tags a, .news-s3 .gallery li .title span, .news-s4 .title-info .info .tag a, .news-s4 .recommend li .tag a, .research-s6 li.flex .text { font-size: 1rem; } .font-18, .about-s1 .txt-box, .about-s3 .txt-box, .about-s5 .box span, .about-s5 .box a, .about-s6 .para, .about-s7 .para, .about-s8 .tab-cont .item .tit, .campus-s4 li a, .campus-s6 .item span, .research-s4 .info, .research-s4 .box .para, .global-s1 .para, .global-s2 .item .para, .global-s4 .para, .global-s4 .item li, .global-s5 .para, .news .public-sidebar .tags .con a, .news .subnav .mt20 a, .news-s4 .v_news_content, .news-s4 .info-con1 .f18, .news-s4 .info-con2 .f18 { font-size: 1.125rem; } .font-20, .admissions-s5 .item span, .research-s1 .item .para, .index-s2 .box span, .index-s3 .right-block .item span, .index-s6 .split-block .item span { font-size: 1.25rem; } .font-24, .fixed-search .tips, .lg-sub-html span, .about-s8 .tab-tit .item span, .about-s9 .item p, .about-s10 .item .para, .admissions-s1 .para, .admissions-s2 .para, .admissions-s2 .img-item span, .admissions-s2 .item .tit, .admissions-s3 .item span, .campus-s1 .item span, .campus-s2 .item .tit, .campus-s7 .item .label, .campus-s9 .item span, .academics-s3 .item .tit, .research-s1 .s-label, .research-s4 .s-label, .research-s4 .web, .research-s5 .item .tit, .global-s3 .item .tit, .global-s5 .item .name, .index-s4 .item .tit, .index-s5 .item .show .txt-box .tit, .index-s7 .item span, .news .search-content .f24, .news-s3 .news-content li .title, .news-s3 .first .dete, .news-s4 .title-info .info .time, .news-s4 .info-text, .news-s4 .recommend li .tit a, .research-s6 li.flex .f24 { font-size: 1.5rem; } .font-30, .global-s5 .s-label { font-size: 1.875rem; } .font-32, .about-s4 .item .tit, .campus-s3 .item span, .research-s2 .item span, .research-s3 .item span, .global-s2 .item .tit { font-size: 2rem; } .font-36, .about-s2 .txt, .admissions-s2 .s-label, .admissions-s4 .para, .campus-s6 .label, .global-s4 .item .tit, .global-s5 .label, .index-s2 .box .tit, .index-s2 .pagination span, .index-s3 .left-block .item span, .index-s5 .right-block .tit, .index-s6 .center-block .item .tit, .news .public-sidebar .tags .title, .news .subnav .title, .news-s4 .info-con1 .f36, .news-s4 .info-con2 .f36 { font-size: 2.25rem; } .font-40, .about-s10 .item span { font-size: 2.5rem; } .font-48, .about-s4 .item .year-box, .about-s5 .label, .about-s6 .tit, .about-s7 .tit, .admissions-s2 .label, .admissions-s3 .label, .admissions-s4 .label, .admissions-s5 .label, .campus-s1 .label, .campus-s2 .label, .campus-s3 .label, .campus-s5 .label, .academics-s1 .label, .academics-s2 .label, .academics-s3 .label, .research-s1 .label, .research-s2 .label, .research-s3 .label, .research-s4 .label, .research-s5 .label, .global-s2 .map-block .info p, .news-s4 .recommend .tabs span { font-size: 3rem; } .font-60, .fixed-search .label, .about-s9 .item .tit i, .index-s3 .label, .index-s4 .label, .index-s5 .label, .index-s6 .label, .index-s7 .label, .index-s8 .follow .label, .index-s9 .txt-box span, .news-s3 .news-content li .time span, .news-s3 .first .title, .news-s4 .title-info h1 { font-size: 3.75rem; } .font-70, .index-s1 .item span { font-size: 4.375rem; } .font-80, .c-banner .txt, .about-s9 .item .tit span, .global-s2 .map-block .info span, .global-s2 .map-block .info i { font-size: 5rem; } .font-120, .about-s4 .item:nth-of-type(1) .year-box { font-size: 7.5rem; } @keyframes o-upfade-top { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } @keyframes o-upfade-left { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateY(0); } } @keyframes ani-banner { 0% { transform: scale(1.2); } 100% { transform: scale(1); } } @keyframes indexsvg { 0% { stroke-dashoffset: 100; } 100% { stroke-dashoffset: 0; } } @keyframes ani-rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes ani-scaleX { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } @media screen and (min-width: 1025px) { .wow { visibility: hidden; } } @media screen and (min-width: 1025px) { .dom-loaded .header { transition: background .3s ease; } .dom-loaded .header:before { transition: opacity .3s ease; } .dom-loaded .header li a.single { transition: all .3s ease; } .dom-loaded .header li .subnav { transition: all .3s ease; } } .header { position: fixed; top: 0; left: 0; right: 0; font-size: 0; padding: 0 6.25vw; display: flex; justify-content: space-between; align-items: center; z-index: 9; } @media screen and (min-width: 1025px) { .header:hover, .header.down { background-color: #7c44a1; } .header:hover:before, .header.down:before { opacity: 1; } .header.down li a.single { line-height: 80px; } } .header:before { content: ''; width: 32.5vw; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background-image: url("../images/header.png"); background-repeat: no-repeat; background-position: left top; background-size: 100% auto; opacity: 0; } .header .logo { position: relative; z-index: 3; } .header .logo img { display: block; height: 48px; } .header .cont { position: relative; z-index: 3; } .header ul { display: inline-block; vertical-align: middle; } .header li { position: relative; display: inline-block; vertical-align: top; } .header li a.single { display: block; font-size: 16px; line-height: 100px; color: #fff; padding: 0 12px; } .header li .subnav { position: absolute; top: 100%; left: 0; width: 240px; padding: 1.25rem 0; background-color: #fff; opacity: 0; visibility: hidden; box-shadow: 0 0.625rem 1.875rem rgba(0, 0, 0, 0.1); } .header li .subnav a { display: block; font-size: 16px; color: #7c44a1; padding: 12px; transition: all .3s ease; } @media screen and (min-width: 1025px) { .header li .subnav a:hover { background-color: #7c44a1; color: #fff; } } @media screen and (min-width: 1025px) { .header li:hover a.single { background-color: #fff; color: #7c44a1; } .header li:hover .subnav { opacity: 1; visibility: visible; } } .header a.search { width: 20px; height: 20px; display: inline-block; vertical-align: middle; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/search-white.svg"); margin-left: 12px; } .header .lang { display: inline-block; vertical-align: middle; margin-left: 24px; position: relative; } .header .lang i { display: block; width: 20px; height: 20px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/lang-white.svg"); cursor: pointer; } .header .lang .hide { position: absolute; width: 90px; top: 100%; left: 50%; margin-left: -45px; padding-top: 24px; opacity: 0; visibility: hidden; } .header .lang .hide:before { content: ''; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #fff; display: block; margin: 0 auto; position: relative; z-index: 2; } .header .lang .hide .box { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); } .header .lang .hide a { display: block; font-size: 12px; line-height: 30px; color: #333; margin-bottom: 1px; text-align: center; background-color: #fff; transition: all .3s ease; } @media screen and (min-width: 1025px) { .header .lang .hide a:nth-of-type(1):hover { color: #ffffff; background-color: #b70031; } .header .lang .hide a:nth-of-type(2):hover { color: #ffffff; background-color: #489a52; } .header .lang .hide a:nth-of-type(3):hover { color: #ffffff; background-color: #f9b420; } } .header .lang:hover .hide { opacity: 1; visibility: visible; } .fixed-search { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; background-color: #7c44a1; display: none; } .fixed-search .close { width: 60px; height: 60px; background-position: center; background-repeat: no-repeat; background-size: contain; background-color: rgba(255, 255, 255, 0.3); border-radius: 50%; background-image: url("../images/close-1.svg"); background-size: auto 1.5rem; position: absolute; top: 3.125vw; right: 3.125vw; cursor: pointer; z-index: 3; } .fixed-search .main { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; } .fixed-search .box { width: 90%; max-width: 960px; margin: 0 auto; } .fixed-search .label { text-align: center; font-family: 'GILROY-BOLD'; color: #fff; text-transform: uppercase; margin-bottom: 4.5vw; } .fixed-search input { display: block; width: 100%; height: 6.25rem; border-bottom: 4px solid #fff; background-color: transparent; padding: 0 1.875rem; color: rgba(255, 255, 255, 0.5); } .fixed-search input::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.5); } .fixed-search input::-moz-placeholder { color: rgba(255, 255, 255, 0.5); } .fixed-search input:-ms-input-placeholder { color: rgba(255, 255, 255, 0.5); } .fixed-search .tips { color: #fff; margin-top: 2vw; } .fixed-search .link { margin-top: 1.25rem; font-size: 0; } .fixed-search .link a { display: inline-block; vertical-align: top; background-color: rgba(255, 255, 255, 0.2); line-height: 2.5rem; color: #fff; padding: 0 1.875rem; margin-left: 10px; transition: all .3s ease; } .fixed-search .link a:nth-of-type(1) { margin-left: 0; } @media screen and (min-width: 1025px) { .fixed-search .link a:hover { background-color: #fff; color: #7c44a1; } } .footer { background-color: #f2f3f9; padding: 0 6.25vw; font-size: 0; } .footer .top-block { padding: 5.625rem 0 3.75rem; display: flex; align-items: flex-end; justify-content: space-between; } .footer .top-block .logo { width: 31.875rem; } .footer .top-block .logo img { display: block; width: 100%; } .footer .top-block .follow a { position: relative; display: inline-block; vertical-align: top; width: 30px; height: 30px; background-color: #7c44a1; border-radius: 3px; margin-left: 4px; } .footer .top-block .follow a:nth-of-type(1) { margin-left: 0; } .footer .top-block .follow a i { display: block; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; } .footer .top-block .follow a .ewm { width: 7.5rem; position: absolute; bottom: 100%; left: 50%; margin-left: -3.75rem; padding-bottom: 20px; opacity: 0; visibility: hidden; transition: all .3s ease; z-index: 2; } .footer .top-block .follow a .ewm:after { content: ''; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #fff; position: absolute; left: 50%; bottom: 10px; margin-left: -10px; } .footer .top-block .follow a .ewm .img-box { box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .footer .top-block .follow a .ewm img { display: block; width: 100%; } @media screen and (min-width: 1025px) { .footer .top-block .follow a:hover .ewm { opacity: 1; visibility: visible; } } .footer .midtop-block { display: flex; justify-content: space-between; padding: 3.75rem 0; border-top: 2px solid #dad0e7; } .footer .midtop-block .box { margin-left: 2.5rem; } .footer .midtop-block .box span { display: block; font-size: 20px; color: #7c44a1; white-space: nowrap; } .footer .midtop-block .box .link { position: relative; border-top: 2px solid #dad0e7; margin-top: 1.5rem; padding-right: 1.5rem; } .footer .midtop-block .box .link:before { content: ''; width: 24px; height: 2px; background-color: #7c44a1; position: absolute; top: -2px; left: 0; } .footer .midtop-block .box a { display: block; font-size: 14px; margin-top: 10px; color: #7c44a1; opacity: 0.6; transition: opacity .3s ease; } @media screen and (min-width: 1025px) { .footer .midtop-block .box a:hover { opacity: 1; } } .footer .midtop-block .box:nth-of-type(1) { margin-left: 0; } .footer .midbot-block { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 0; border-top: 2px solid #dad0e7; } .footer .midbot-block span { position: relative; display: inline-block; vertical-align: top; font-size: 14px; line-height: 20px; color: rgba(124, 68, 161, 0.6); margin-right: 2rem; padding-left: 24px; } .footer .midbot-block span:before { content: ''; width: 16px; height: 16px; background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute; left: 0; top: 2px; } .footer .midbot-block span:nth-of-type(1):before { background-image: url("../images/foot-icon-1.svg"); } .footer .midbot-block span:nth-of-type(2):before { background-image: url("../images/foot-icon-1.svg"); } .footer .midbot-block span:nth-of-type(3) { margin-right: 0; } .footer .midbot-block span:nth-of-type(3):before { background-image: url("../images/foot-icon-2.svg"); } .footer .midbot-block a { width: 11.25rem; text-align: center; font-size: 14px; line-height: 3rem; color: #fff; border-radius: 3px; background-color: #7c44a1; white-space: nowrap; } .footer .bot-block { display: flex; align-items: flex-start; justify-content: space-between; padding: 2.5rem 0; border-top: 2px solid #dad0e7; } .footer .bot-block p, .footer .bot-block a { font-size: 14px; line-height: 2; color: #7c44a1; opacity: 0.6; } .footer .bot-block a { display: block; transition: opacity .3s ease; } @media screen and (min-width: 1025px) { .footer .bot-block a:hover { opacity: 1; } } .fixed-totop { position: fixed; right: 20px; bottom: 20px; z-index: 8; width: 3.75rem; height: 3.75rem; background-color: #7c44a1; background-position: center; background-repeat: no-repeat; background-image: url("../images/next-2.png"); background-size: auto 1.25rem; border-radius: 50%; transform: rotate(-90deg); cursor: pointer; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; transition: all .3s ease; } .fixed-totop.active { opacity: 1; visibility: visible; } @media screen and (max-width: 1367px) { .footer .midtop-block .box span { font-size: 18px; } } @media screen and (max-width: 1281px) { .header { padding: 0 3.125vw; } .header .logo img { height: 40px; } .header li .subnav a { font-size: 15px; } .header li a.single { font-size: 15px; padding: 0 8px; } .header a.search { margin-left: 8px; } .header .lang { margin-left: 16px; } .footer .top-block .logo { width: 26rem; } .footer .top-block .follow a { width: 26px; height: 26px; } } @media screen and (max-width: 1025px) { .font-120, .about-s4 .item:nth-of-type(1) .year-box { font-size: 6rem; } .font-80, .c-banner .txt, .about-s9 .item .tit span, .global-s2 .map-block .info span, .global-s2 .map-block .info i { font-size: 3.2rem; } .font-70, .index-s1 .item span { font-size: 2.8rem; } .font-60, .fixed-search .label, .about-s9 .item .tit i, .index-s3 .label, .index-s4 .label, .index-s5 .label, .index-s6 .label, .index-s7 .label, .index-s8 .follow .label, .index-s9 .txt-box span, .news-s3 .news-content li .time span, .news-s3 .first .title, .news-s4 .title-info h1 { font-size: 2.4rem; } .font-48, .about-s4 .item .year-box, .about-s5 .label, .about-s6 .tit, .about-s7 .tit, .admissions-s2 .label, .admissions-s3 .label, .admissions-s4 .label, .admissions-s5 .label, .campus-s1 .label, .campus-s2 .label, .campus-s3 .label, .campus-s5 .label, .academics-s1 .label, .academics-s2 .label, .academics-s3 .label, .research-s1 .label, .research-s2 .label, .research-s3 .label, .research-s4 .label, .research-s5 .label, .global-s2 .map-block .info p, .news-s4 .recommend .tabs span { font-size: 2rem; } .font-40, .about-s10 .item span { font-size: 2rem; } .font-36, .about-s2 .txt, .admissions-s2 .s-label, .admissions-s4 .para, .campus-s6 .label, .global-s4 .item .tit, .global-s5 .label, .index-s2 .box .tit, .index-s2 .pagination span, .index-s3 .left-block .item span, .index-s5 .right-block .tit, .index-s6 .center-block .item .tit, .news .public-sidebar .tags .title, .news .subnav .title, .news-s4 .info-con1 .f36, .news-s4 .info-con2 .f36 { font-size: 2rem; } .font-32, .about-s4 .item .tit, .campus-s3 .item span, .research-s2 .item span, .research-s3 .item span, .global-s2 .item .tit { font-size: 1.8rem; } .font-30, .global-s5 .s-label { font-size: 1.8rem; } .font-24, .fixed-search .tips, .lg-sub-html span, .about-s8 .tab-tit .item span, .about-s9 .item p, .about-s10 .item .para, .admissions-s1 .para, .admissions-s2 .para, .admissions-s2 .img-item span, .admissions-s2 .item .tit, .admissions-s3 .item span, .campus-s1 .item span, .campus-s2 .item .tit, .campus-s7 .item .label, .campus-s9 .item span, .academics-s3 .item .tit, .research-s1 .s-label, .research-s4 .s-label, .research-s4 .web, .research-s5 .item .tit, .global-s3 .item .tit, .global-s5 .item .name, .index-s4 .item .tit, .index-s5 .item .show .txt-box .tit, .index-s7 .item span, .news .search-content .f24, .news-s3 .news-content li .title, .news-s3 .first .dete, .news-s4 .title-info .info .time, .news-s4 .info-text, .news-s4 .recommend li .tit a, .research-s6 li.flex .f24 { font-size: 1.6rem; } .font-20, .admissions-s5 .item span, .research-s1 .item .para, .index-s2 .box span, .index-s3 .right-block .item span, .index-s6 .split-block .item span { font-size: 1.4rem; } .font-18, .about-s1 .txt-box, .about-s3 .txt-box, .about-s5 .box span, .about-s5 .box a, .about-s6 .para, .about-s7 .para, .about-s8 .tab-cont .item .tit, .campus-s4 li a, .campus-s6 .item span, .research-s4 .info, .research-s4 .box .para, .global-s1 .para, .global-s2 .item .para, .global-s4 .para, .global-s4 .item li, .global-s5 .para, .news .public-sidebar .tags .con a, .news .subnav .mt20 a, .news-s4 .v_news_content, .news-s4 .info-con1 .f18, .news-s4 .info-con2 .f18 { font-size: 1.4rem; } .footer { padding: 0 5%; } .footer .top-block, .footer .midtop-block { display: none; } .footer .midbot-block { display: block; padding: 2rem 0; border: none; } .footer .midbot-block span { margin: 1rem 0 0; display: block; } .footer .midbot-block span:nth-of-type(1) { margin-top: 0; } .footer .midbot-block a { display: block; width: 14rem; margin-top: 2rem; display: none; } .footer .bot-block { padding: 2rem 0; display: block; } .footer .bot-block a { display: inline-block; } .footer .bot-block a:nth-of-type(2) { margin-left: 20px; } .mNavBtn { display: block; width: 20px; height: 16px; right: 5%; top: 22px; position: fixed; cursor: pointer; z-index: 4; } .mNavBtn span { position: absolute; left: 0; width: 20px; height: 1px; background-color: #fff; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .mNavBtn span.line1 { top: 0; } .mNavBtn span.line2 { top: 8px; } .mNavBtn span.line3 { bottom: 0; } .mNavBtn.active span { background-color: #7c44a1; } .mNavBtn.active .line2 { display: none; } .mNavBtn.active .line1 { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); top: 8px; } .mNavBtn.active .line3 { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 7px; } .header { padding: 0 5%; height: 60px; background-color: #7c44a1; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .header .logo img { height: 36px; } .header .cont { margin-right: 35px; } .header a.search { margin-left: 0; } .header .lang { margin-left: 15px; } .header ul { position: fixed; top: 0; left: 100%; width: 100%; height: 100%; background-color: #fff; padding: 70px 30px; text-align: left; z-index: 3; transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1); overflow: auto; } .header ul.active { left: 0; } .header li { display: block; border-bottom: 1px solid #e6e6e6; } .header li i { width: 50px; height: 50px; position: absolute; right: 0; top: 0; background-position: center; background-repeat: no-repeat; background-image: url("../images/next-1.png"); background-size: auto 16px; } .header li a.single { line-height: 50px; font-size: 16px; color: #333; padding: 0; margin-right: 50px; } .header li .subnav { width: 100%; padding: 0 20px; position: static; opacity: 1; visibility: visible; box-shadow: none; display: none; } .header li .subnav a { padding: 10px 0; border-bottom: 1px solid #e6e6e6; } .header li .subnav a:last-of-type { border: none; } .fixed-search .link a { margin: 0 10px 10px 0; } } .wrap-s { width: 80%; max-width: 1440px; margin: 0 auto; position: relative; z-index: 3; } .txt-justify, .about-s1 .txt-box, .about-s2 .txt, .about-s3 .txt-box, .about-s7 .para, .admissions-s1 .para, .admissions-s2 .para, .admissions-s3 .item .para, .admissions-s4 .para, .campus-s5 .para, .campus-s7 .item .para, .academics-s3 .item .para, .research-s1 .item .para, .research-s4 .box .para, .research-s5 .item p, .global-s1 .para, .global-s2 .item .para, .global-s4 .para, .global-s4 .item li, .global-s5 .para, .research-s6 li.flex .text { text-align: justify; } .lg-sub-html { text-align: center; } .lg-sub-html span { font-family: 'GILROY-BOLD'; } .lg-sub-html p { font-family: 'GILROY-LIGHT'; } .c-bg-fixed, .about-s2, .admissions-s2, .admissions-s4, .campus-s2, .research-s3, .index-s2, .index-s9 { background-attachment: fixed; } .c-banner { position: relative; } .c-banner:before { content: ''; position: absolute; top: 0; left: 0; width: 32.5vw; height: 24.375vw; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/banner-img.png"); z-index: 2; } .c-banner .img-box { position: relative; z-index: 1; overflow: hidden; } .c-banner img { display: block; width: 100%; animation: ani-banner 6s linear forwards; } .c-banner .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; } .c-banner .txt-box:before, .c-banner .txt-box:after { content: ''; width: 100%; height: 40%; position: absolute; left: 0; z-index: 1; } .c-banner .txt-box:before { top: 0; background-image: linear-gradient(0deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); } .c-banner .txt-box:after { bottom: 0; background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); } .c-banner .txt { color: #fff; padding: 0 6.25vw 3.75rem; font-family: 'GILROY-BOLD'; position: absolute; bottom: 0; left: 0; right: 0; z-index: 2; } .c-banner.style .txt { padding-bottom: 5.625rem; } .c-sublink { border-bottom: 1px solid #e8e8e8; padding: 0 6.25vw; font-size: 0; } .c-sublink a { display: inline-block; vertical-align: top; line-height: 3.75rem; color: #333; position: relative; padding: 0 1.5rem; margin-right: 10px; transition: color .3s ease; } .c-sublink a:after { content: ''; width: 100%; height: 2px; background-color: #7c44a1; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: left center; } .c-sublink a.active { color: #7c44a1; } .c-sublink a.active:after { transform: scaleX(1); } .c-sublink a:last-of-type { margin-right: 0; } @media (any-hover: hover) { .c-sublink a:hover:after { transform: scaleX(1); transition: transform .3s linear; } } .campus-btn1 { display: block; width: 12.5rem; line-height: 3rem; border: 2px solid #7c44a1; text-transform: uppercase; font-family: 'GILROY-LIGHT'; color: #7c44a1; text-align: center; margin: 2.5rem auto 0; transition: all .3s ease; } .campus-btn1.white { border-color: #fff; color: #fff; } @media (any-hover: hover) { .campus-btn1:hover { border-color: transparent; background-color: #7c44a1; color: #fff; transform: translateY(-3px); box-shadow: 0 0.625rem 1.875rem rgba(124, 68, 161, 0.3); } } .c-crumbs { background-color: #f2f3f9; padding: 0 3.75rem; font-size: 0; position: relative; z-index: 5; } .c-crumbs a { display: inline-block; vertical-align: middle; position: relative; margin-right: calc(2.5rem + 4px); } .c-crumbs a.home { width: 16px; height: 16px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/home.svg"); } .c-crumbs a.link { font-family: 'GILROY-LIGHT'; line-height: 3.75rem; color: #333; } .c-crumbs a:last-of-type { margin-right: 0; } .c-crumbs a:last-of-type:after { display: none; } .c-crumbs a:after { content: ''; width: 4px; height: 8px; position: absolute; top: 50%; left: calc(100% + 1.25rem); margin-top: -4px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/right.svg"); } .c-crumbs.white { background-color: rgba(124, 61, 161, 0.9); margin-top: -3.75rem; } .c-crumbs.white a.home { background-image: url("../images/home-white.svg"); } .c-crumbs.white a.link { color: #fff; } .c-crumbs.white a:after { background-image: url("../images/right-white.svg"); } .c-crumbs.mt { margin-top: 80px; } .comm-page { font-size: 0; text-align: center; } .comm-page li { display: inline-block; vertical-align: top; margin: 0 5px; } .comm-page li:after { display: none; } .comm-page li a { display: block; width: 40px; height: 40px; font-size: 14px; color: #666; line-height: 38px; text-align: center; border: 1px solid #e2eaf3; transition: all .3s ease; } .comm-page li:first-of-type a, .comm-page li:last-of-type a { width: 9.375rem; font-size: 12px; text-transform: uppercase; } .comm-page li.active a { border-color: #7c44a1; background-color: #7c44a1; color: #fff; } @media (any-hover: hover) { .comm-page li:hover a { border-color: #7c44a1; background-color: #7c44a1; color: #fff; } } .video-pop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9; display: none; } .video-pop .bg { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.6); z-index: 1; } .video-pop .close { width: 32px; height: 32px; position: absolute; right: 20px; top: 20px; background: url("../images/close-1.svg") center no-repeat; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; transition: all 500ms ease; cursor: pointer; z-index: 2; } @media (any-hover: hover) { .video-pop .close:hover { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } } .video-pop video { position: absolute; top: 50%; left: 50%; max-height: 100%; max-width: 100%; z-index: 3; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .about-s1 { padding: 7.5rem 0; font-size: 0; } .about-s1 .txt-box { width: 58%; display: inline-block; vertical-align: middle; padding: 1.25rem 7.5rem 1.25rem 5rem; line-height: 1.875rem; color: #333; border-left: 0.625rem solid #7c44a1; } .about-s1 .img-box { width: 42%; max-width: 602px; display: inline-block; vertical-align: middle; } .about-s1 img { display: block; width: 100%; } .about-s2 { height: 50rem; background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; align-items: center; } .about-s2 .txt-box { width: 100%; } .about-s2 .txt { color: #fff; line-height: 3rem; } .about-s3 { padding: 7.5rem 0; } .about-s3 .txt-box { line-height: 1.875rem; color: #333; } .about-s3 .img-box { margin-top: 3.75rem; display: flex; } .about-s3 .item { flex: 1; overflow: hidden; } .about-s3 .item img { display: block; width: 100%; transition: transform .5s ease; } @media screen and (min-width: 769px) { .about-s3 .item:nth-of-type(2) { margin-left: 1.5rem; } } @media (any-hover: hover) { .about-s3 .item:hover img { transform: scale(1.1); } } .about-s4 { padding: 7.5rem 0; position: relative; } .about-s4 .line-box { position: absolute; right: 1.875rem; top: 0; bottom: 0; } .about-s4 .line-box ul { position: sticky; top: 0; padding: 7.5rem 0; } .about-s4 .line-box li { display: block; margin-top: .625rem; position: relative; cursor: pointer; } .about-s4 .line-box li:after { content: ''; position: absolute; top: 50%; left: 50%; margin: -5px 0 0 -5px; width: 10px; height: 10px; border-radius: 50%; border: 2px solid #7c44a1; box-sizing: border-box; transform: scale(0.5); transition: all .3s ease; } .about-s4 .line-box li span { display: block; width: 60px; text-align: center; line-height: 20px; background-color: #fff; border: 2px solid #7c44a1; border-radius: 12px; font-family: 'GILROY-BOLD'; color: #7c44a1; transform: scale(0.8); opacity: 0; transition: all .3s ease; } .about-s4 .line-box li:nth-of-type(1) { margin-top: 0; } .about-s4 .line-box li:first-of-type span, .about-s4 .line-box li:last-of-type span { opacity: 1; } .about-s4 .line-box li:first-of-type:after, .about-s4 .line-box li:last-of-type:after { opacity: 0; } .about-s4 .line-box li.active span, .about-s4 .line-box li.active:after { transform: scale(1); } .about-s4 .block { position: relative; } .about-s4 .block:before { content: ''; position: absolute; top: 3.75rem; left: calc(50% - 1px); width: 2px; height: 100%; background-color: #7c44a1; opacity: 0.2; z-index: 1; } .about-s4 .block:after { content: ''; width: 12px; height: 12px; border-radius: 50%; background-color: #7c44a1; position: absolute; top: 3.75rem; left: calc(50% - 6px); z-index: 1; } .about-s4 .line-ani { position: absolute; top: 3.75rem; left: calc(50% - 1px); width: 2px; background-color: #7c44a1; max-height: 100%; z-index: 2; } .about-s4 .item { position: relative; z-index: 3; } .about-s4 .item .year-box { position: absolute; top: 0; width: 15rem; color: #333; line-height: 7.5rem; font-family: 'GILROY-BOLD'; text-align: center; background-color: #fff; } .about-s4 .item .tit-box { min-height: 7.5rem; display: flex; align-items: center; } .about-s4 .item .tit { width: 100%; color: #333; line-height: 2.25rem; font-family: 'GILROY-BOLD'; } .about-s4 .item .img-box { margin-top: 1rem; display: inline-block; box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1); overflow: hidden; } .about-s4 .item .img-box img { display: block; max-width: 100%; transition: transform .5s ease; } @media (any-hover: hover) { .about-s4 .item .img-box:hover img { transform: scale(1.1); } } @media screen and (min-width: 769px) { .about-s4 .item:nth-of-type(1) .year-box { position: static; width: 100%; text-align: inherit; } .about-s4 .item:nth-of-type(1) .tit-box { min-height: auto; margin: 3.75rem 0; } .about-s4 .item:nth-of-type(odd) { padding-right: calc(50% + 7.5rem); text-align: right; } .about-s4 .item:nth-of-type(odd) .year-box { right: calc(50% - 7.5rem); } .about-s4 .item:nth-of-type(even) { padding-left: calc(50% + 7.5rem); } .about-s4 .item:nth-of-type(even) .year-box { left: calc(50% - 7.5rem); } } .about-s5 { padding: 7.5rem 0; } .about-s5 .label { color: #7c44a1; font-family: 'GILROY-BOLD'; } .about-s5 .items { margin-top: 1.5rem; font-size: 0; } .about-s5 .item { display: flex; align-items: flex-start; } .about-s5 .item:nth-of-type(odd) { background-color: #f2f3f9; } .about-s5 .box { display: flex; align-items: flex-start; } .about-s5 .box span { width: 50%; color: #7c44a1; line-height: 1.5rem; font-family: 'GILROY-MEDIUM'; padding: .5rem 2.5rem; } .about-s5 .box ul { width: 50%; padding: .5rem 0; } .about-s5 .box li { display: block; padding: 0 2.5rem; margin-top: 1rem; } .about-s5 .box li:nth-of-type(1) { margin-top: 0; } .about-s5 .box a { display: inline-block; color: #333; line-height: 1.5rem; transition: color .3s ease; } @media (any-hover: hover) { .about-s5 .box a:hover { color: #7c44a1; } } @media screen and (min-width: 1025px) { .about-s5 .box:nth-of-type(1) { width: 60%; } .about-s5 .box:nth-of-type(2) { width: 40%; } } .about-s6 { padding: 7.5rem 0; } .about-s6 .img-box { width: 30rem; margin: 0 auto; } .about-s6 .img-box img { display: block; width: 100%; } .about-s6 .tit { text-align: center; color: #333; font-family: 'GILROY-BOLD'; margin-top: 3.75rem; } .about-s6 .para { line-height: 1.875rem; color: #333; text-align: center; margin-top: 2.5rem; } .about-s7 { padding: 7.5rem 0; font-size: 0; border-bottom: 1.25rem solid #f2f2f2; } .about-s7 .circle-box { display: inline-block; vertical-align: middle; width: 23.75rem; height: 23.75rem; background-color: #fff; border-radius: 50%; position: relative; } .about-s7 .circle-box:after { content: ''; width: 6.25rem; height: 6.25rem; position: absolute; top: 50%; left: 50%; margin: -3.125rem 0 0 -3.125rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/about/img-6.png"); animation: ani-rotate 10s linear infinite; z-index: 3; } .about-s7 .circle-box .item { position: absolute; z-index: 1; } .about-s7 .circle-box .item img { display: block; width: 100%; transition: transform .5s ease; } .about-s7 .circle-box .item:nth-of-type(1) { width: 11.8125rem; top: 0; left: 10.35rem; } .about-s7 .circle-box .item:nth-of-type(2) { width: 7.75rem; top: 6.2rem; right: 0; } .about-s7 .circle-box .item:nth-of-type(3) { width: 14.65rem; left: 6rem; bottom: 0; } .about-s7 .circle-box .item:nth-of-type(4) { width: 9.25rem; top: 9.125rem; left: 0; } .about-s7 .circle-box .item:nth-of-type(5) { width: 11.25rem; top: .125rem; left: .125rem; } @media (any-hover: hover) { .about-s7 .circle-box .item:hover img { transform: scale(1.05); } } .about-s7 .txt-box { display: inline-block; vertical-align: middle; width: calc(100% - 23.75rem); padding-left: 7.5rem; } .about-s7 .tit { color: #333; font-family: 'GILROY-BOLD'; } .about-s7 .para { line-height: 1.875rem; color: #333; margin-top: 2.5rem; } .about-s8 { padding: 7.5rem 0; font-size: 0; border-bottom: 1.25rem solid #f2f2f2; } .about-s8 .tab-tit { text-align: center; border-bottom: 1px solid #e5e5e5; } .about-s8 .tab-tit .item { display: inline-block; vertical-align: top; padding: 0 3rem 2.5rem; position: relative; margin-left: 2.5rem; cursor: pointer; } .about-s8 .tab-tit .item:after { content: ''; width: 100%; height: 4px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: left center; } .about-s8 .tab-tit .item i { display: block; margin: 0 auto; width: 4.5rem; height: 4.5rem; background-position: center; background-repeat: no-repeat; background-size: contain; } .about-s8 .tab-tit .item span { display: block; font-family: 'GILROY-BOLD'; margin-top: 1.25rem; } .about-s8 .tab-tit .item:nth-of-type(1) { margin-left: 0; } .about-s8 .tab-tit .item:nth-of-type(1):after { background-color: #cf1031; } .about-s8 .tab-tit .item:nth-of-type(1) span { color: #cf1031; } .about-s8 .tab-tit .item:nth-of-type(2):after { background-color: #489a52; } .about-s8 .tab-tit .item:nth-of-type(2) span { color: #489a52; } .about-s8 .tab-tit .item:nth-of-type(3):after { background-color: #ea541f; } .about-s8 .tab-tit .item:nth-of-type(3) span { color: #ea541f; } .about-s8 .tab-tit .item:nth-of-type(4):after { background-color: #7253a0; } .about-s8 .tab-tit .item:nth-of-type(4) span { color: #7253a0; } .about-s8 .tab-tit .item:nth-of-type(5):after { background-color: #f5b328; } .about-s8 .tab-tit .item:nth-of-type(5) span { color: #f5b328; } .about-s8 .tab-tit .item.active:after { transform: scaleX(1); transition: transform .3s linear; } @media (any-hover: hover) { .about-s8 .tab-tit .item:hover i { transform: rotateY(360deg); transition: transform .6s linear; } } .about-s8 .tab-cont { margin-top: 3.75rem; } .about-s8 .tab-cont .child { display: none; } .about-s8 .tab-cont .child.active { display: block; -webkit-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards; -moz-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards; -ms-animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards; animation: o-upfade-top 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .about-s8 .tab-cont .child:nth-of-type(1) .tit:before { background-color: #cf1031; } .about-s8 .tab-cont .child:nth-of-type(2) .tit:before { background-color: #489a52; } .about-s8 .tab-cont .child:nth-of-type(3) .tit:before { background-color: #ea541f; } .about-s8 .tab-cont .child:nth-of-type(4) .tit:before { background-color: #7253a0; } .about-s8 .tab-cont .child:nth-of-type(5) .tit:before { background-color: #f5b328; } .about-s8 .tab-cont .items { display: flex; flex-wrap: wrap; } .about-s8 .tab-cont .item { width: calc((100% - 1.25rem) / 2); border: 1px solid #e6e6e6; border-radius: 3px; margin: 1.5rem 0 0 1.25rem; padding: 1.25rem 2.5rem; } .about-s8 .tab-cont .item .tit { margin-left: -2.5rem; padding-left: 2.5rem; position: relative; color: #333; } .about-s8 .tab-cont .item .tit:before { content: ''; width: 4px; height: 100%; position: absolute; left: -1px; top: 0; } @media screen and (min-width: 1025px) { .about-s8 .tab-cont .item:nth-of-type(1), .about-s8 .tab-cont .item:nth-of-type(2) { margin-top: 0; } .about-s8 .tab-cont .item:nth-of-type(odd) { margin-left: 0; } } .about-s9 { padding: 7.5rem 0; } .about-s9 .items { display: flex; flex-wrap: wrap; } .about-s9 .item { width: calc((100% - 3.75rem) / 2); min-height: 16.875rem; border-top: 1px solid #e6e6e6; padding: 2.5rem 0 2.5rem 15rem; position: relative; } .about-s9 .item .icon { position: absolute; width: 11.875rem; height: 11.875rem; background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 2.5rem; left: 0; } .about-s9 .item .tit span { font-family: 'GILROY-BOLD'; } .about-s9 .item .tit i { font-family: 'GILROY-BOLD'; font-style: normal; } .about-s9 .item p { color: #808080; font-family: 'GILROY-LIGHT'; margin-top: 1.25rem; } @media screen and (min-width: 769px) { .about-s9 .item:nth-of-type(even) { margin-left: 3.75rem; } .about-s9 .item:nth-of-type(1), .about-s9 .item:nth-of-type(2) { border: none; } } @media (any-hover: hover) { .about-s9 .item:hover .icon { transform: rotateY(360deg); transition: transform .6s linear; } } .about-s10 { padding: 7.5rem 0; font-size: 0; } .about-s10 .item { border-bottom: 1px solid #e6e6e6; position: relative; padding: 3.75rem 0; } .about-s10 .item:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: -1px; left: 0; background-color: #7c44a1; transform: scaleX(0); transform-origin: left center; } .about-s10 .item .img-box { display: inline-block; vertical-align: top; width: 20rem; height: 5.625rem; border: 1px solid #e6e6e6; text-align: center; } .about-s10 .item .img-box img { max-width: 90%; max-height: 90%; } .about-s10 .item .txt-box { display: inline-block; vertical-align: top; width: calc(100% - 20rem); padding-left: 3.75rem; } .about-s10 .item span { display: block; color: #333; font-family: 'GILROY-BOLD'; transition: color .3s ease; } .about-s10 .item .para { margin-top: 1.5rem; line-height: 1.5; color: #333; font-family: 'GILROY-LIGHT'; } .about-s10 .item:nth-of-type(1) { padding-top: 0; } @media (any-hover: hover) { .about-s10 .item:hover:after { transform: scaleX(1); transition: transform .5s ease; } .about-s10 .item:hover span { color: #7c44a1; } } .admissions-s1 { padding: 11.25rem 0; } .admissions-s1 .para { color: #000; line-height: 1.5; font-family: 'GILROY-LIGHT'; padding-left: 3.75rem; border-left: 6px solid #7c44a1; } .admissions-s2 { padding: 7.5rem 0; background-position: center; background-repeat: no-repeat; background-size: cover; } .admissions-s2 .label { font-family: 'GILROY-BOLD'; color: #fff; } .admissions-s2 .para { color: #fff; line-height: 1.5; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } .admissions-s2 .img-items { display: flex; margin-top: 2rem; } .admissions-s2 .img-item { flex: 1; position: relative; } .admissions-s2 .img-item:after { content: ''; width: 100%; height: 30%; position: absolute; bottom: 0; left: 0; background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); z-index: 2; } .admissions-s2 .img-item .img-box { position: relative; overflow: hidden; z-index: 1; } .admissions-s2 .img-item img { display: block; width: 100%; transition: transform .5s ease; } .admissions-s2 .img-item span { position: absolute; bottom: 0; left: 0; width: 100%; padding: 1.5rem; font-family: 'GILROY-BOLD'; color: #fff; z-index: 3; } @media screen and (min-width: 769px) { .admissions-s2 .img-item:nth-of-type(2) { margin-left: 1.5rem; } } @media (any-hover: hover) { .admissions-s2 .img-item:hover img { transform: scale(1.1); } } .admissions-s2 .s-label { color: #fff; font-family: 'GILROY-BOLD'; margin-top: 5rem; } .admissions-s2 .item { margin-top: 3.75rem; } .admissions-s2 .item .tit { color: #fff; font-family: 'GILROY-BOLD'; padding-left: 1.25rem; border-left: 4px solid #fff; } .admissions-s2 .item .link { margin-top: 1.25rem; display: flex; } .admissions-s2 .item a { width: 100%; position: relative; background-color: #fff; padding: 1.25rem 7.5rem 1.25rem 2.5rem; color: #333; font-family: 'GILROY-BOLD'; transition: all .3s ease; } .admissions-s2 .item a:after { content: ''; width: 1.25rem; height: 1.25rem; position: absolute; right: 2.5rem; top: 50%; margin-top: -0.625rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/admissions/icon-1.svg"); transition: all .3s ease; } @media (any-hover: hover) { .admissions-s2 .item a:hover { color: #7c44a1; background-color: #f2f3f9; } .admissions-s2 .item a:hover:after { background-image: url("../images/admissions/icon-1-1.svg"); } } .admissions-s2 .item.item-1 .link { flex-wrap: wrap; } .admissions-s2 .item.item-1 a { width: calc((100% - 1.5rem) / 2); margin: 10px 0 0 1.5rem; } @media screen and (min-width: 1025px) { .admissions-s2 .item.item-1 a:nth-of-type(1), .admissions-s2 .item.item-1 a:nth-of-type(2) { margin-top: 0; } .admissions-s2 .item.item-1 a:nth-of-type(odd) { margin-left: 0; } } .admissions-s3 { padding: 7.5rem 0; } .admissions-s3 .label { font-family: 'GILROY-BOLD'; color: #333; } .admissions-s3 .items { margin-top: 2.5rem; } .admissions-s3 .item { margin-top: 2.5rem; position: relative; } .admissions-s3 .item .img-box { width: 50%; overflow: hidden; } .admissions-s3 .item .img-box img { display: block; width: 100%; transition: transform .5s ease; } @media (any-hover: hover) { .admissions-s3 .item .img-box:hover img { transform: scale(1.1); } } .admissions-s3 .item .txt-box { width: 50%; height: 100%; position: absolute; top: 0; padding: 0 3.75rem; } .admissions-s3 .item span { display: block; color: #333; font-family: 'GILROY-BOLD'; } .admissions-s3 .item .para { line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; margin-top: 1.25rem; } .admissions-s3 .item a { display: block; width: 12.5rem; line-height: 3rem; text-transform: uppercase; font-family: 'GILROY-LIGHT'; color: #fff; text-align: center; background-color: #7c44a1; margin-top: 1.5rem; transition: all .3s ease; } @media (any-hover: hover) { .admissions-s3 .item a:hover { transform: translateY(-3px); box-shadow: 0 0.625rem 1.875rem rgba(124, 68, 161, 0.3); } } @media screen and (min-width: 1025px) { .admissions-s3 .item:nth-of-type(1) { margin-top: 0; } .admissions-s3 .item:nth-of-type(odd) .txt-box { right: 0; } .admissions-s3 .item:nth-of-type(even) .img-box { margin-left: 50%; } .admissions-s3 .item:nth-of-type(even) .txt-box { left: 0; } } .admissions-s4 { height: 67.5rem; background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; align-items: center; } .admissions-s4 .txt-box { width: 100%; } .admissions-s4 .label { font-family: 'GILROY-BOLD'; color: #fff; } .admissions-s4 .para { color: #fff; line-height: 3rem; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } .admissions-s4 a { display: block; width: 12.5rem; line-height: 3rem; text-transform: uppercase; font-family: 'GILROY-LIGHT'; color: #fff; text-align: center; background-color: #7c44a1; margin-top: 7.5rem; transition: all .3s ease; } @media (any-hover: hover) { .admissions-s4 a:hover { transform: translateY(-3px); box-shadow: 0 0.625rem 1.875rem rgba(124, 68, 161, 0.3); } } .admissions-s5 { padding: 7.5rem 0; } .admissions-s5 .label { font-family: 'GILROY-BOLD'; color: #333; } .admissions-s5 .items { margin-top: 3.75rem; display: flex; flex-wrap: wrap; position: relative; } .admissions-s5 .item { background-color: #fff; width: calc((100% - 4.5rem) / 4); box-shadow: 0 0 1.875rem rgba(0, 0, 0, 0.1); padding: 3.75rem 1.5rem 2.5rem; text-align: center; } .admissions-s5 .item i { display: block; width: 3rem; height: 3rem; margin: 0 auto; background-position: center; background-repeat: no-repeat; background-size: contain; } .admissions-s5 .item span { display: block; color: #7c44a1; font-family: 'GILROY-BOLD'; margin: 2.5rem 0 1.5rem; } .admissions-s5 .item p { line-height: 1.5rem; color: #000; font-family: 'GILROY-LIGHT'; } .admissions-s5 .item .img-box{ width: 12.5rem; border: 4px solid #7c44a1; margin: 5rem auto 0; } .admissions-s5 .item img{ display: block; width: 100%; } @media screen and (min-width: 769px) { .admissions-s5 .item:nth-of-type(1) { position: absolute; left: 0; top: 0; bottom: 0; margin: 0; } .admissions-s5 .item:nth-of-type(1) i { width: 6.875rem; height: 6.875rem; } .admissions-s5 .item:nth-of-type(1) span { margin: 12rem 0 2.5rem; } .admissions-s5 .item:nth-of-type(2), .admissions-s5 .item:nth-of-type(4){ margin-left: calc(25% + .375rem); } .admissions-s5 .item:nth-of-type(4), .admissions-s5 .item:nth-of-type(5) { margin-top: 1.5rem; } .admissions-s5 .item:nth-of-type(3), .admissions-s5 .item:nth-of-type(5) { margin-left: 1.5rem; margin-right: calc(25% + .375rem); } .admissions-s5 .item:nth-of-type(6) { position: absolute; right: 0; top: 0; bottom: 0; margin: 0; } .admissions-s5 .item:nth-of-type(6) span{ margin: 5rem 0 0; } } @media (any-hover: hover) { .admissions-s5 .item:hover i { transform: rotateY(360deg); transition: transform .6s linear; } } .campus-s1 { padding: 7.5rem 0; } .campus-s1 .label { font-family: 'GILROY-BOLD'; color: #333; text-align: center; } .campus-s1 .items { margin-top: 2.5rem; font-size: 0; } .campus-s1 .item { display: inline-block; vertical-align: top; width: calc((100% - 1.5rem) / 2); margin: 1.5rem 0 0 1.5rem; transition: box-shadow .3s ease; } .campus-s1 .item a { display: block; position: relative; } .campus-s1 .item a:before { content: ''; position: absolute; right: 0; bottom: 0; width: 25.5625rem; height: 16.5rem; background-position: center; background-repeat: no-repeat; background-size: contain; z-index: 2; } .campus-s1 .item .img-box { position: relative; overflow: hidden; z-index: 1; } .campus-s1 .item img { display: block; width: 100%; transition: transform .5s ease; } .campus-s1 .item span { position: absolute; right: 2.5rem; bottom: 2.5rem; color: #fff; font-family: 'GILROY-BOLD'; z-index: 3; } .campus-s1 .item:nth-of-type(1) a:before { background-image: url("../images/campus/img-4-1.png"); } .campus-s1 .item:nth-of-type(2) a:before { background-image: url("../images/campus/img-4-2.png"); } .campus-s1 .item:nth-of-type(3) a:before { background-image: url("../images/campus/img-4-3.png"); } .campus-s1 .item:nth-of-type(4) a:before { background-image: url("../images/campus/img-4-4.png"); } @media screen and (min-width: 769px) { .campus-s1 .item:nth-of-type(1), .campus-s1 .item:nth-of-type(2) { margin-top: 0; } .campus-s1 .item:nth-of-type(odd) { margin-left: 0; } } @media (any-hover: hover) { .campus-s1 .item:hover { box-shadow: 0 1.25rem 2.5rem rgba(91, 82, 135, 0.3); } .campus-s1 .item:hover img { transform: scale(1.1); } } .campus-s2 { padding: 7.5rem 0; background-position: center; background-repeat: no-repeat; background-size: cover; } .campus-s2 .label { font-family: 'GILROY-BOLD'; color: #fff; text-align: center; } .campus-s2 .items { margin-top: 2.5rem; position: relative; padding: 10px; } .campus-s2 .item { width: 60rem; background-color: #fff; transform-origin: center 70%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .campus-s2 .item .img-box { overflow: hidden; } .campus-s2 .item img { display: block; width: 100%; object-fit: cover; } .campus-s2 .item .txt-box { text-align: center; padding: 2rem; } .campus-s2 .item .tit { color: #000; font-family: 'GILROY-BOLD'; } .campus-s2 .item span { display: block; margin-top: 10px; color: #000; font-family: 'GILROY-LIGHT'; } .campus-s2 .button { width: 3.75rem; height: 3.75rem; position: absolute; top: 50%; margin-top: -1.875rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-size: auto 14px; background-color: rgba(255, 255, 255, 0.1); border-radius: 50%; cursor: pointer; z-index: 2; transition: all .3s ease; } @media (any-hover: hover) { .campus-s2 .button:hover { background-color: #fff; } } .campus-s2 .prev { left: -11.25rem; background-image: url("../images/prev-2.png"); } @media (any-hover: hover) { .campus-s2 .prev:hover { background-image: url("../images/prev-1.png"); } } .campus-s2 .next { right: -11.25rem; background-image: url("../images/next-2.png"); } @media (any-hover: hover) { .campus-s2 .next:hover { background-image: url("../images/next-1.png"); } } .campus-s2 .pagination { font-size: 0; text-align: center; margin-top: 2rem; display: none; } .campus-s2 .pagination span { display: inline-block; vertical-align: top; width: 6px; height: 6px; border-radius: 50%; background-color: #ccc; margin: 0 5px; cursor: pointer; transform: scale(0.6); transition: all .3s ease; } .campus-s2 .pagination span.active { background-color: #7c44a1; transform: scale(1); } .campus-s3 { padding: 7.5rem 0; } .campus-s3 .label { font-family: 'GILROY-BOLD'; color: #333; text-align: center; } .campus-s3 .items { margin-top: 2.5rem; font-size: 0; } .campus-s3 .item { display: inline-block; vertical-align: top; width: calc((100% - 3rem) / 3); margin: 1.5rem 0 0 1.5rem; } .campus-s3 .item a { display: block; position: relative; } .campus-s3 .item a:before { content: ''; position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.1)); z-index: 2; } .campus-s3 .item .img-box { position: relative; overflow: hidden; z-index: 1; } .campus-s3 .item img { display: block; width: 100%; transition: transform .5s ease; } .campus-s3 .item .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 2.5rem; z-index: 3; } .campus-s3 .item .txt-box:after { content: ''; width: 4px; height: 3.75rem; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .campus-s3 .item span { color: #fff; font-family: 'GILROY-BOLD'; z-index: 3; } .campus-s3 .item:nth-of-type(1) .txt-box:after { background-color: #139d47; } .campus-s3 .item:nth-of-type(2) .txt-box:after { background-color: #ff7300; } .campus-s3 .item:nth-of-type(3) .txt-box:after { background-color: #f5b327; } .campus-s3 .item:nth-of-type(4) .txt-box:after { background-color: #5f52a1; } .campus-s3 .item:nth-of-type(5) .txt-box:after { background-color: #b70031; } @media screen and (min-width: 769px) { .campus-s3 .item:nth-of-type(1), .campus-s3 .item:nth-of-type(2), .campus-s3 .item:nth-of-type(3) { margin-top: 0; } .campus-s3 .item:nth-of-type(3n-2) { margin-left: 0; } } @media (any-hover: hover) { .campus-s3 .item:hover img { transform: scale(1.1); } } .campus-s4 .left-box { width: 20rem; position: absolute; left: 0; top: 0; bottom: 0; padding: 7.5rem 0; } .campus-s4 ul { position: sticky; top: 0; } .campus-s4 li { margin-top: 1.875rem; } .campus-s4 li a { display: block; color: #333; font-family: 'GILROY-LIGHT'; text-align: right; padding: 1.25rem 2.5rem; transition: all .3s ease; } .campus-s4 li.active a { background-color: #7c44a1; color: #fff; } @media screen and (min-width: 1025px) { .campus-s4 li:nth-of-type(1) { margin-top: 0; } } @media (any-hover: hover) { .campus-s4 li:hover a { background-color: #7c44a1; color: #fff; } } .campus-s4 .right-box { margin-left: 20rem; border-left: 1px solid #e6e6e6; padding: 7.5rem 0 7.5rem 7.5rem; } .campus-s5 .label { font-family: 'GILROY-BOLD'; color: #000; } .campus-s5 .para { color: #000; line-height: 2; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } .campus-s5 .swiper-block { margin-top: 3.75rem; position: relative; } .campus-s5 .item .img-box { overflow: hidden; } .campus-s5 .item img { display: block; width: 100%; } .campus-s5 .s-items { margin-top: 10px; padding: 0 34px; } .campus-s5 .s-item { cursor: pointer; } .campus-s5 .s-item .img-box { overflow: hidden; position: relative; } .campus-s5 .s-item .img-box:after { content: ''; width: 100%; height: 100%; border: 2px solid #7c44a1; position: absolute; top: 0; left: 0; opacity: 0; z-index: 2; box-sizing: border-box; transition: opacity .3s ease; } .campus-s5 .s-item img { display: block; width: 100%; height: 4.375rem; object-fit: cover; } .campus-s5 .s-item.active .img-box:after { opacity: 1; } .campus-s5 .button { width: 24px; height: 4.375rem; position: absolute; bottom: 0; background-position: center; background-repeat: no-repeat; background-size: contain; background-color: #7c44a1; background-size: auto 14px; cursor: pointer; z-index: 2; } .campus-s5 .prev { left: 0; background-image: url("../images/prev-2.png"); } .campus-s5 .next { right: 0; background-image: url("../images/next-2.png"); } .campus-s5 .pagination { font-size: 0; text-align: center; margin-top: 2rem; display: none; } .campus-s5 .pagination span { display: inline-block; vertical-align: top; width: 6px; height: 6px; border-radius: 50%; background-color: #ccc; margin: 0 5px; cursor: pointer; transform: scale(0.6); transition: all .3s ease; } .campus-s5 .pagination span.active { background-color: #7c44a1; transform: scale(1); } .campus-s6 { font-size: 0; } .campus-s6 .label { font-family: 'GILROY-BOLD'; color: #000; } .campus-s6 .block { margin-top: 7.5rem; } .campus-s6 .block:nth-of-type(1) { margin-top: 0; } .campus-s6 .items { margin-top: 2.5rem; padding-top: 2.5rem; border-top: 1px solid #e6e6e6; } .campus-s6 .item { display: inline-block; vertical-align: top; width: calc((100% - 3rem) / 3); margin: 1.5rem 0 0 1.5rem; } .campus-s6 .item .img-box { overflow: hidden; } .campus-s6 .item img { display: block; width: 100%; transition: transform .5s ease; } .campus-s6 .item span { display: block; color: #000; font-family: 'GILROY-BOLD'; margin-top: 1.25rem; } @media screen and (min-width: 769px) { .campus-s6 .item:nth-of-type(1), .campus-s6 .item:nth-of-type(2), .campus-s6 .item:nth-of-type(3) { margin-top: 0; } .campus-s6 .item:nth-of-type(3n-2) { margin-left: 0; } } @media (any-hover: hover) { .campus-s6 .item:hover img { transform: scale(1.1); } } .campus-s7 { padding: 7.5rem 0; background-color: #f2f3f9; } .campus-s7 .item { margin-top: 3.75rem; } .campus-s7 .item .label { color: #333; padding-left: 1.25rem; border-left: 4px solid #7c44a1; font-family: 'GILROY-BOLD'; } .campus-s7 .item .para { line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } .campus-s7 .item:nth-of-type(1) { margin-top: 0; } .campus-s8 { padding: 7.5rem 0; position: relative; } .campus-s8 .swiper { width: 62.5vw; max-width: 1200px; margin: 0 auto; } .campus-s8 .item img { display: block; width: 100%; } .campus-s8 .button { width: 3.75rem; height: 3.75rem; position: absolute; top: 50%; margin-top: -1.875rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-size: auto 14px; background-color: rgba(124, 68, 161, 0.1); border-radius: 50%; cursor: pointer; z-index: 2; transition: all .3s ease; } @media (any-hover: hover) { .campus-s8 .button:hover { background-color: #7c44a1; } } .campus-s8 .prev { left: 3.125vw; background-image: url("../images/prev-1.png"); } @media (any-hover: hover) { .campus-s8 .prev:hover { background-image: url("../images/prev-2.png"); } } .campus-s8 .next { right: 3.125vw; background-image: url("../images/next-1.png"); } @media (any-hover: hover) { .campus-s8 .next:hover { background-image: url("../images/next-2.png"); } } .campus-s8 .pagination { font-size: 0; text-align: center; margin-top: 2rem; } .campus-s8 .pagination span { display: inline-block; vertical-align: top; width: 6px; height: 6px; border-radius: 50%; background-color: #ccc; margin: 0 5px; cursor: pointer; transform: scale(0.6); transition: all .3s ease; } .campus-s8 .pagination span.active { background-color: #7c44a1; transform: scale(1); } .campus-s9 { padding: 3.75rem 3.75rem 7.5rem; } .campus-s9 .items { font-size: 0; column-count: 3; column-gap: 1.5rem; } .campus-s9 .item { border-radius: 1.25rem; background-color: #f2f3f9; margin-bottom: 0.5rem; overflow: hidden; cursor: pointer; } .campus-s9 .item .img-box { overflow: hidden; } .campus-s9 .item img { display: block; width: 100%; transition: transform .5s ease; } .campus-s9 .item span { display: block; color: #000; font-family: 'GILROY-BOLD'; text-align: center; padding: 1.5rem; } @media (any-hover: hover) { .campus-s9 .item:hover img { transform: scale(1.1); } } .academics-s1 { padding: 7.5rem 0; } .academics-s1 .item { margin-top: 5.625rem; } .academics-s1 .item:nth-of-type(1) { margin-top: 0; } .academics-s1 .label { font-family: 'GILROY-BOLD'; color: #000; } .academics-s1 .link { margin-top: 2.5rem; } .academics-s1 a { display: block; position: relative; background-color: #f5f5f5; padding: 1.25rem 7.5rem 1.25rem 2.5rem; margin-top: 10px; color: #333; font-family: 'GILROY-BOLD'; transition: all .3s ease; } .academics-s1 a:after { content: ''; width: 1.25rem; height: 1.25rem; position: absolute; right: 2.5rem; top: 50%; margin-top: -0.625rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/admissions/icon-1.svg"); transition: all .3s ease; } .academics-s1 a:nth-of-type(1) { margin-top: 0; } @media (any-hover: hover) { .academics-s1 a:hover { color: #7c44a1; background-color: #f2f3f9; } .academics-s1 a:hover:after { background-image: url("../images/admissions/icon-1-1.svg"); } } .academics-s2 { padding: 7.5rem 0 5.625rem; } .academics-s2 .label { font-family: 'GILROY-BOLD'; color: #000; } .academics-s2 .img-box { margin-top: 2.5rem; } .academics-s2 img { display: block; width: 100%; } .academics-s3 { padding-bottom: 7.5rem; display: none; } .academics-s3 .label { font-family: 'GILROY-BOLD'; color: #000; } .academics-s3 .items { margin-top: 2.5rem; padding-top: 2.5rem; border-top: 1px solid #e6e6e6; } .academics-s3 .item { margin-top: 3.75rem; } .academics-s3 .item:nth-of-type(1) { margin-top: 0; } .academics-s3 .item .tit { color: #7c44a1; font-family: 'GILROY-BOLD'; } .academics-s3 .item .para { margin-top: 1.5rem; line-height: 1.5rem; color: #333; font-family: 'GILROY-LIGHT'; } .research-s1 { padding: 7.5rem 0; } .research-s1 .label { color: #000; font-family: 'GILROY-BOLD'; } .research-s1 .block { margin-top: 2.5rem; } .research-s1 .s-label { line-height: 3.75rem; color: #7c44a1; font-family: 'GILROY-BOLD'; padding: 0 1.25rem; background-color: #f2f3f9; } .research-s1 .item { margin-top: 2.5rem; display: flex; align-items: center; } .research-s1 .item .img-box { width: 50%; overflow: hidden; } .research-s1 .item img { display: block; width: 100%; transition: transform .5s ease; } .research-s1 .item .txt-box { width: 50%; padding-left: 2.5rem; } .research-s1 .item .para { line-height: 2rem; color: #000; font-family: 'GILROY-LIGHT'; } @media (any-hover: hover) { .research-s1 .item:hover img { transform: scale(1.1); } } .research-s2 { padding: 7.5rem 0; } .research-s2 .label { color: #000; font-family: 'GILROY-BOLD'; } .research-s2 .items { display: flex; flex-wrap: wrap; margin-top: 2.5rem; } .research-s2 .item { position: relative; width: calc((100% - 4.5rem) / 4); margin: 1.5rem 1.5rem 0 0; border: 1px solid #e6e6e6; border-radius: .625rem; text-align: center; overflow: hidden; transition: all .3s ease; } .research-s2 .item:after { content: ''; width: 15rem; height: 15rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/research/icon-1.svg"); position: absolute; bottom: -5rem; right: -3rem; opacity: 0; z-index: 1; animation: ani-rotate 10s linear infinite; transition: opacity .3s ease; } .research-s2 .item .box { display: block; padding: 3rem; position: relative; z-index: 2; } .research-s2 .item span { display: block; color: #7c44a1; font-family: 'GILROY-BOLD'; transition: color .3s ease; } .research-s2 .item p { color: #000; line-height: 1.25rem; font-family: 'GILROY-LIGHT'; margin-top: 10px; transition: color .3s ease; } @media screen and (min-width: 769px) { .research-s2 .item:nth-of-type(1), .research-s2 .item:nth-of-type(2), .research-s2 .item:nth-of-type(3), .research-s2 .item:nth-of-type(4) { margin-top: 0; } .research-s2 .item:nth-of-type(4n) { margin-right: 0; } } @media (any-hover: hover) { .research-s2 .item:hover { background-color: #7c44a1; box-shadow: 0 0.625rem 1.875rem rgba(124, 68, 161, 0.3); } .research-s2 .item:hover:after { opacity: 0.1; } .research-s2 .item:hover span, .research-s2 .item:hover p { color: #fff; } } .research-s3 { padding: 7.5rem 0; background-position: center; background-repeat: no-repeat; background-size: cover; } .research-s3 .label { color: #fff; font-family: 'GILROY-BOLD'; } .research-s3 .items { display: flex; flex-wrap: wrap; margin-top: 2.5rem; } .research-s3 .item { width: calc((100% - 1.5rem) / 2); margin: 1.5rem 1.5rem 0 0; border-radius: .625rem; background-color: #fff; transition: all .3s ease; } .research-s3 .item .box { display: flex; align-items: center; padding: 2rem 0; } .research-s3 .item span { width: 7.5rem; line-height: 3rem; color: #7c44a1; text-align: center; font-family: 'GILROY-BOLD'; border-right: 1px solid #cccccc; transition: all .3s ease; } .research-s3 .item p { width: calc(100% - 7.5rem); padding: 0 2.5rem; color: #000; line-height: 1.25rem; font-family: 'GILROY-LIGHT'; transition: color .3s ease; } @media screen and (min-width: 769px) { .research-s3 .item:nth-of-type(1), .research-s3 .item:nth-of-type(2) { margin-top: 0; } .research-s3 .item:nth-of-type(even) { margin-right: 0; } } @media (any-hover: hover) { .research-s3 .item:hover { background-color: #f2f3f9; } .research-s3 .item:hover span, .research-s3 .item:hover p { color: #7c44a1; } .research-s3 .item:hover span { border-color: #7c44a1; } } .research-s3 .info { line-height: 1.5rem; color: #fff; margin: 2.5rem 0 0 2.5rem; } .research-s4 { padding: 7.5rem 0; } .research-s4 .block { margin-top: 7.5rem; } .research-s4 .block:nth-of-type(1) { margin-top: 0; } .research-s4 .label { color: #000; font-family: 'GILROY-BOLD'; } .research-s4 .s-label { line-height: 3.75rem; color: #7c44a1; font-family: 'GILROY-BOLD'; border-left: 4px solid #7c44a1; background-color: #f2f3f9; padding: 0 2rem; margin-top: 2.5rem; } .research-s4 .info { line-height: 2rem; color: #333333; font-family: 'GILROY-LIGHT'; padding: 0 2rem; margin-top: 2.5rem; } .research-s4 .box { display: flex; align-items: center; margin-top: 2.5rem; } .research-s4 .box .img-box { width: 50%; overflow: hidden; } .research-s4 .box img { display: block; width: 100%; transition: transform .5s ease; } .research-s4 .box .txt-box { width: 50%; padding-left: 2.5rem; } .research-s4 .box .para { line-height: 2rem; color: #000; font-family: 'GILROY-LIGHT'; } @media (any-hover: hover) { .research-s4 .box:hover img { transform: scale(1.1); } } .research-s4 .web { margin-top: 2.5rem; padding: 0 2.5rem; color: #333; font-family: 'GILROY-LIGHT'; } .research-s4 .web a { color: #7c44a1; text-decoration: underline; } .research-s5 { padding: 7.5rem 0; } .research-s5 .label { color: #000; font-family: 'GILROY-BOLD'; } .research-s5 .item { padding: 2.5rem 0; border-bottom: 1px solid #e6e6e6; position: relative; } .research-s5 .item:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: -1px; left: 0; background-color: #7c44a1; transform: scaleX(0); transform-origin: left center; } .research-s5 .item .box { display: flex; align-items: center; } .research-s5 .item .img-box { width: 15rem; overflow: hidden; } .research-s5 .item img { display: block; width: 100%; transition: transform .5s ease; } .research-s5 .item .txt-box { width: calc(100% - 15rem); padding-left: 2.5rem; } .research-s5 .item .tit { color: #000; font-family: 'GILROY-BOLD'; } .research-s5 .item p { line-height: 1.5rem; color: #000; font-family: 'GILROY-LIGHT'; height: 9rem; overflow: hidden; margin: 1.5rem 0; } .research-s5 .item span { color: #7c44a1; } @media (any-hover: hover) { .research-s5 .item:hover:after { transform: scaleX(1); transition: transform .5s ease; } .research-s5 .item:hover img { transform: scale(1.1); } } .global-s1 { padding: 7.5rem 0; } .global-s1 .mt { margin-top: 3.75rem; } .global-s1 .para { line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; } .global-s1 .items { max-width: 62.5rem; margin-left: auto; margin-right: auto; } .global-s1 .items .item .img-box { overflow: hidden; } .global-s1 .items .item img { display: block; width: 100%; } .global-s1 .items .pagination { font-size: 0; text-align: center; margin-top: 1.875rem; } .global-s1 .items .pagination span { display: inline-block; vertical-align: top; width: 6px; height: 6px; border-radius: 50%; background-color: #cccccc; margin: 0 5px; transform: scale(0.66); cursor: pointer; transition: all .3s ease; } .global-s1 .items .pagination span.active { transform: scale(1); background-color: #7c44a1; } .global-s1 .single-pic { text-align: center; } .global-s1 .single-pic img { max-width: 80%; box-shadow: 0 1.25rem 1.875rem rgba(0, 0, 0, 0.1); } .global-s2 { padding: 7.5rem 0; } .global-s2 .map-block { position: relative; } .global-s2 .map-block svg { display: block; width: 100%; } .global-s2 .map-block .st1 { fill: #489450; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st2 { fill: #E57732; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st3 { fill: #E6AB2C; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st4 { fill-rule: evenodd; clip-rule: evenodd; fill: #AA3B58; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st5 { fill: #584F81; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st6 { fill: #2B8FBF; opacity: 0.2; cursor: pointer; transition: opacity .3s ease; } .global-s2 .map-block .st7 { fill-rule: evenodd; clip-rule: evenodd; fill: #C7E8FA; } .global-s2 .map-block .st8 { fill: #E2EEC5; } .global-s2 .map-block .st9 { fill: #E60012; } .global-s2 .map-block .info { position: absolute; bottom: 1.5rem; left: 1.5rem; color: #333; font-family: 'GILROY-BOLD'; } .global-s2 .map-block .info i { font-style: normal; } .global-s2 .map-block .dot { position: absolute; transform: translate(-50%, -50%); cursor: pointer; } .global-s2 .map-block .dot i { display: block; width: 12px; height: 12px; background-color: #fff; border-radius: 50%; position: relative; } .global-s2 .map-block .dot i:before { content: ''; width: 20px; height: 20px; position: absolute; top: 50%; left: 50%; border-radius: 50%; transform: translate(-50%, -50%); border: 4px solid; box-sizing: border-box; transition: all .3s ease; } .global-s2 .map-block .dot span { color: #333; font-family: 'GILROY-LIGHT'; position: absolute; top: 30px; left: 50%; transform: translateX(-50%); white-space: nowrap; transition: color .3s ease; } .global-s2 .map-block .dot:nth-of-type(1) { left: 78%; top: 20%; } .global-s2 .map-block .dot:nth-of-type(1) i:before { border-color: #489450; } .global-s2 .map-block .dot:nth-of-type(2) { left: 94%; top: 58%; } .global-s2 .map-block .dot:nth-of-type(2) i:before { border-color: #E57732; } .global-s2 .map-block .dot:nth-of-type(3) { left: 35%; top: 25%; } .global-s2 .map-block .dot:nth-of-type(3) i:before { border-color: #E6AB2C; } .global-s2 .map-block .dot:nth-of-type(4) { left: 23%; top: 16%; } .global-s2 .map-block .dot:nth-of-type(4) i:before { border-color: #AA3B58; } .global-s2 .map-block .dot:nth-of-type(5) { left: 45%; top: 68%; } .global-s2 .map-block .dot:nth-of-type(5) i:before { border-color: #584F81; } .global-s2 .map-block .dot:nth-of-type(6) { left: 11%; top: 39%; } .global-s2 .map-block .dot:nth-of-type(6) i:before { border-color: #2B8FBF; } .global-s2 .map-block .dot.active i:before { width: 32px; height: 32px; border-width: 2px; border-color: #fff; } .global-s2 .map-block .dot.active span { color: #fff; } .global-s2 .items { margin-top: 3.75rem; } .global-s2 .item { position: relative; border: 1px solid #e6e6e6; margin-top: 2.5rem; } .global-s2 .item:before { content: ''; width: 100%; height: 4px; position: absolute; top: -1px; left: 0; transform: scaleX(0); transform-origin: left top; transition: transform .3s ease; } .global-s2 .item .tit { position: relative; line-height: 7.5rem; padding: 0 3.75rem; color: #333; font-family: 'GILROY-BOLD'; cursor: pointer; } .global-s2 .item .tit:before { content: ''; width: 4px; height: 100%; position: absolute; left: -1px; top: 0; transition: opacity .3s ease; } .global-s2 .item .tit:after { content: ''; width: 1.875rem; height: 2rem; position: absolute; right: 3.75rem; top: 50%; margin-top: -1rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/global/icon-1.svg"); transition: all .3s ease; } .global-s2 .item .hide { border-top: 1px solid #e6e6e6; display: none; } .global-s2 .item .para { padding: 2.5rem 3.75rem; line-height: 2; color: #333; } .global-s2 .item:nth-of-type(1) { margin-top: 0; } .global-s2 .item:nth-of-type(1):before { background-color: #489450; } .global-s2 .item:nth-of-type(1) .tit:before { background-color: #489450; } .global-s2 .item:nth-of-type(1).active .tit:after { background-image: url("../images/global/icon-1-1.svg"); } .global-s2 .item:nth-of-type(2):before { background-color: #E57732; } .global-s2 .item:nth-of-type(2) .tit:before { background-color: #E57732; } .global-s2 .item:nth-of-type(2).active .tit:after { background-image: url("../images/global/icon-1-2.svg"); } .global-s2 .item:nth-of-type(3):before { background-color: #E6AB2C; } .global-s2 .item:nth-of-type(3) .tit:before { background-color: #E6AB2C; } .global-s2 .item:nth-of-type(3).active .tit:after { background-image: url("../images/global/icon-1-3.svg"); } .global-s2 .item:nth-of-type(4):before { background-color: #AA3B58; } .global-s2 .item:nth-of-type(4) .tit:before { background-color: #AA3B58; } .global-s2 .item:nth-of-type(4).active .tit:after { background-image: url("../images/global/icon-1-4.svg"); } .global-s2 .item:nth-of-type(5):before { background-color: #584F81; } .global-s2 .item:nth-of-type(5) .tit:before { background-color: #584F81; } .global-s2 .item:nth-of-type(5).active .tit:after { background-image: url("../images/global/icon-1-5.svg"); } .global-s2 .item:nth-of-type(6):before { background-color: #2B8FBF; } .global-s2 .item:nth-of-type(6) .tit:before { background-color: #2B8FBF; } .global-s2 .item:nth-of-type(6).active .tit:after { background-image: url("../images/global/icon-1-6.svg"); } .global-s2 .item.active:before { transform: scaleX(1); } .global-s2 .item.active .tit:before { opacity: 0; } .global-s2 .item.active .tit:after { transform: rotate(-90deg); } .global-s3 { padding: 7.5rem 0; } .global-s3 .item { margin-top: 10px; position: relative; background-color: #f5f5f5; transition: all .3s ease; } .global-s3 .item:before { content: ''; width: 4px; height: 100%; background-color: #7c44a1; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity .3s ease; } .global-s3 .item .box { display: block; padding: 2rem 2.5rem; } .global-s3 .item .tit { color: #333; font-family: 'GILROY-BOLD'; } .global-s3 .item .para { line-height: 2; color: #333; margin-top: 10px; } .global-s3 .item:nth-of-type(1) { margin-top: 0; } @media (any-hover: hover) { .global-s3 .item:hover { background-color: #f2f3f9; } .global-s3 .item:hover:before { opacity: 1; } } .global-s4 { padding: 7.5rem 0; } .global-s4 .para { line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; } .global-s4 .items { margin-top: 3.75rem; } .global-s4 .item { padding: 3.75rem 0; border-top: 4px solid #000; } .global-s4 .item .tit { color: #333; font-family: 'GILROY-BOLD'; } .global-s4 .item .para { margin-top: 2.5rem; } .global-s4 .item ul { margin-top: 2.5rem; } .global-s4 .item li { display: flex; align-items: flex-start; line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; } .global-s4 .item li span { width: 70px; white-space: nowrap; } .global-s4 .item li p { width: calc(100% - 70px); } .global-s4 .img-items { display: flex; } .global-s4 .img-item { flex: 1; overflow: hidden; } .global-s4 .img-item img { display: block; width: 100%; transition: transform .5s ease; } @media screen and (min-width: 769px) { .global-s4 .img-item:nth-of-type(2) { margin-left: 1.5rem; } } @media (any-hover: hover) { .global-s4 .img-item:hover img { transform: scale(1.1); } } .global-s5 { padding: 7.5rem 0; } .global-s5 .para { line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; } .global-s5 .top-block { margin-top: 3.75rem; padding: 3.75rem 0; border-top: 4px solid #000; border-bottom: 4px solid #000; } .global-s5 .bot-block { margin-top: 3.75rem; } .global-s5 .label { color: #333; font-family: 'GILROY-BOLD'; } .global-s5 .s-label { color: #333; font-family: 'GILROY-BOLD'; } .global-s5 .s-label:before { content: ''; width: 4px; height: 1.5rem; background-color: #7c44a1; margin: -2px 2.5rem 0 0; display: inline-block; vertical-align: middle; } .global-s5 .s-label.mt { margin-top: 2.5rem; } .global-s5 .s-label.pt { padding-top: 2.5rem; } .global-s5 .s-label.border { border-top: 1px solid #e6e6e6; } .global-s5 .items { margin-top: 2.5rem; display: flex; flex-wrap: wrap; } .global-s5 .item { width: 50%; display: flex; align-items: center; margin-top: 2.5rem; } .global-s5 .item .img-box { width: 11.25rem; } .global-s5 .item img { display: block; width: 100%; } .global-s5 .item .txt-box { width: calc(100% - 11.25rem); padding: 0 3.75rem 0 2.5rem; } .global-s5 .item span { line-height: 1.5rem; color: #808080; font-family: 'GILROY-LIGHT'; } .global-s5 .item .name { color: #333; font-family: 'GILROY-BOLD'; } .global-s5 .item .name.mt { margin-top: 1.5rem; } .global-s5 .item .mail { display: block; color: #7c44a1; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } .global-s5 .item p { line-height: 1.5rem; min-height: 4.5rem; max-height: 6rem; overflow: hidden; color: #333; font-family: 'GILROY-LIGHT'; margin-top: 1.5rem; } @media screen and (min-width: 769px) { .global-s5 .item:nth-of-type(1), .global-s5 .item:nth-of-type(2) { margin-top: 0; } } .global-s5 .desc { padding: 2.5rem 0; display: flex; align-items: flex-start; } .global-s5 .desc .s-label { width: 50%; } .global-s5 .desc p { width: 50%; line-height: 2; color: #333; font-family: 'GILROY-LIGHT'; } .index-page .more-box a { display: inline-block; color: #fff; text-transform: uppercase; } .index-page .more-box a:after { content: ''; width: 1.25rem; height: 1.25rem; display: inline-block; vertical-align: middle; margin: -2px 0 0 10px; background-position: center; background-repeat: no-repeat; background-size: contain; } .index-page .more-box.white a { color: #fff; } .index-page .more-box.white a:after { background-image: url("../images/index/icon-1.svg"); } .index-page .more-box.purple a { color: #7c44a1; } .index-page .more-box.purple a:after { background-image: url("../images/index/icon-2.svg"); } .index-s1 { position: relative; } .index-s1:before { content: ''; width: 32.5vw; height: 24.375vw; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/index/img-1.png"); position: absolute; top: 0; left: 0; z-index: 2; } .index-s1 .items { z-index: 1; } .index-s1 .item { height: 100vh; overflow: hidden; } .index-s1 .item .img-box { height: 100%; position: relative; z-index: 1; } .index-s1 .item img { display: block; width: 100%; height: 100%; object-fit: cover; } .index-s1 .item .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 6.25vw; z-index: 2; } .index-s1 .item span { display: block; width: 50rem; line-height: 1.2; color: #fff; font-family: 'GILROY-BOLD'; margin-top: 5em; } .index-s1 .item.swiper-slide-active img { animation: scale-bg 6s linear forwards; } .index-s1 .pagination { position: absolute; bottom: 3.75rem; left: 0; right: 0; text-align: center; font-size: 0; z-index: 2; } .index-s1 .pagination span { display: inline-block; vertical-align: top; position: relative; margin-left: 1rem; cursor: pointer; } .index-s1 .pagination span:nth-of-type(1) { margin-left: 0; } .index-s1 .pagination span:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-sizing: border-box; border-radius: 50%; border: 4px solid rgba(255, 255, 255, 0.3); opacity: 0; transition: opacity .3s ease; } .index-s1 .pagination span:after { content: ''; width: 12px; height: 12px; background-color: rgba(255, 255, 255, 0.3); border-radius: 50%; position: absolute; top: 50%; left: 50%; margin: -6px 0 0 -6px; transition: opacity .3s ease; } .index-s1 .pagination span svg { fill: none; stroke: #fff; stroke-width: 2px; stroke-dasharray: 100; stroke-dashoffset: 100; transform: rotate(-90deg); } .index-s1 .pagination span.active:before { opacity: 1; } .index-s1 .pagination span.active:after { opacity: 0; } .index-s1 .pagination span.active svg { animation: indexsvg 5s linear forwards; } .index-s2 { background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url("../images/index/img-2.jpg"); padding: 6.25vw; } .index-s2 .items { position: relative; } .index-s2 .swiper { margin-right: -20px; padding-right: 20px; } .index-s2 .item { position: relative; padding-top: 7.5vw; } .index-s2 .item.swiper-slide-active .box { animation: o-upfade-left 0.7s 0s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .index-s2 .item.swiper-slide-active .box:nth-of-type(2) { animation-delay: .1s; } .index-s2 .box { opacity: 0; } .index-s2 .box .img-box { overflow: hidden; } .index-s2 .box img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s2 .box span { display: block; color: #fff; margin-top: 2.5rem; } .index-s2 .box .tit { color: #fff; margin-top: 1.5rem; max-height: 8.1rem; overflow: hidden; } .index-s2 .box:nth-of-type(1) { width: 50vw; } .index-s2 .box:nth-of-type(1) .img-box { height: 28.125vw; } .index-s2 .box:nth-of-type(2) { position: absolute; right: 0; top: 0; width: 27.5vw; } .index-s2 .box:nth-of-type(2) .img-box { height: 27.5vw; } @media (any-hover: hover) { .index-s2 .box:hover img { transform: scale(1.1); } } .index-s2 .pagination { position: absolute; top: 0; left: 0; width: auto; bottom: auto; font-size: 0; z-index: 2; } .index-s2 .pagination span { display: inline-block; vertical-align: top; position: relative; color: rgba(255, 255, 255, 0.2); padding-right: 5.5rem; cursor: pointer; } .index-s2 .pagination span:before, .index-s2 .pagination span:after { content: ''; width: 3rem; height: 2px; position: absolute; right: 1.25rem; top: 50%; margin-top: -1px; } .index-s2 .pagination span:before { background-color: rgba(255, 255, 255, 0.2); z-index: 1; opacity: 0; transition: opacity .3s ease; } .index-s2 .pagination span:after { background-color: white; z-index: 2; transform: scaleX(0); transform-origin: left center; } .index-s2 .pagination span:last-of-type { padding-right: 0; } .index-s2 .pagination span:last-of-type:before, .index-s2 .pagination span:last-of-type:after { display: none; } .index-s2 .pagination span.active { color: #fff; } .index-s2 .pagination span.active:before { opacity: 1; } .index-s2 .pagination span.active:after { animation: ani-scaleX 5s linear forwards; } .index-s2 .more-box { text-align: right; } .index-s3 { position: relative; padding: 6.25vw; } .index-s3 .label { color: #333; font-family: 'GILROY-BOLD'; } .index-s3 .cont { margin-top: 2.5rem; display: flex; align-items: flex-start; } .index-s3 .left-block { width: 63.75vw; margin-left: -6.25vw; position: relative; } .index-s3 .left-block .item { padding-bottom: 5.625rem; } .index-s3 .left-block .item .img-box { display: block; overflow: hidden; } .index-s3 .left-block .item img { display: block; width: 100%; height: 35.8vw; object-fit: cover; } .index-s3 .left-block .item .txt-box { position: absolute; padding-right: 13.75rem; height: 11.25rem; left: 6.25vw; right: 6.25vw; bottom: 0; z-index: 2; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url("../images/index/img-5.jpg"); } .index-s3 .left-block .item a.cell-box { display: block; width: 100%; height: 100%; padding: 0 2.5rem; } .index-s3 .left-block .item span { color: #fff; line-height: 3rem; max-height: 9rem; overflow: hidden; } .index-s3 .right-block { width: 30vw; height: 35.8vw; padding-left: 3.75rem; position: relative; } .index-s3 .right-block:before { content: 'Feature'; text-transform: uppercase; font-family: 'GILROY-BOLD'; position: absolute; right: 0; top: 100%; font-size: 15rem; color: #f2eff7; transform: rotate(90deg) translateY(36%); transform-origin: right center; z-index: 1; display: none; } .index-s3 .right-block .en { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: translateY(50%); z-index: 1; } .index-s3 .right-block .en i { text-transform: uppercase; font-family: 'GILROY-BOLD'; position: absolute; right: 0; top: 100%; font-size: 12.5vw; font-style: normal; color: #f2eff7; transform: rotate(90deg) translateY(36%); transform-origin: right center; } .index-s3 .right-block .items { position: relative; z-index: 2; } .index-s3 .right-block .item { border-top: 1px solid #e6e6e6; position: relative; } .index-s3 .right-block .item:before, .index-s3 .right-block .item:after { content: ''; width: 100%; height: 4px; background-color: #7c44a1; position: absolute; left: 0; transform: scaleX(0); } .index-s3 .right-block .item:before { top: -1px; transform-origin: left center; } .index-s3 .right-block .item:after { bottom: -1px; transform-origin: right center; } .index-s3 .right-block .item .tit-box { height: 6.25vw; padding: 0 2.5rem; } .index-s3 .right-block .item .para-box { height: 0; overflow: hidden; padding: 0 2.5rem; transition: height .3s ease; } .index-s3 .right-block .item .para-box:after { content: ''; width: 1.25rem; height: 1.25rem; display: block; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/admissions/icon-1-1.svg"); margin-top: 1.25rem; } .index-s3 .right-block .item span { line-height: 2rem; max-height: 4rem; color: #333; overflow: hidden; } .index-s3 .right-block .item p { line-height: 1.5rem; height: 9rem; color: #808080; overflow: hidden; } .index-s3 .right-block .item:last-of-type { border-bottom: 1px solid #e6e6e6; } .index-s3 .right-block .item.active:before, .index-s3 .right-block .item.active:after { transform: scaleX(1); transition: transform .5s ease; } .index-s3 .right-block .item.active .para-box { height: calc(10.8vw - 5px); } .index-s3 .pagination { position: absolute; bottom: calc(5.625rem - 6px); right: 6.25vw; left: auto; width: 13.75rem; text-align: center; font-size: 0; z-index: 2; } .index-s3 .pagination span { display: inline-block; vertical-align: top; width: 12px; height: 12px; border-radius: 50%; border: 1px solid #fff; transition: all .3s ease; margin: 0 4px; cursor: pointer; } .index-s3 .pagination span.active { background-color: #fff; } .index-s3 .more-box { position: absolute; right: 6.25vw; bottom: calc(6.25vw + 2.5rem); z-index: 3; } .index-s4 { padding: 0 6.25vw 6.25vw; } .index-s4 .label { color: #333; font-family: 'GILROY-BOLD'; } .index-s4 .items { margin: 2.5rem -6.25vw 0; position: relative; } .index-s4 .items:before, .index-s4 .items:after { content: ''; width: 6.25vw; height: 100%; background-color: rgba(255, 255, 255, 0.5); position: absolute; top: 0; z-index: 2; } .index-s4 .items:before { left: 0; } .index-s4 .items:after { right: 0; } .index-s4 .swiper { padding: 0 6.25vw; } .index-s4 .item { width: 33.33%; } .index-s4 .item .img-box { overflow: hidden; } .index-s4 .item img { display: block; width: 100%; transition: transform .5s ease; } .index-s4 .item .txt-box { padding: 2.5rem; min-height: 15rem; position: relative; transition: all .3s ease; } .index-s4 .item .txt-box:before { content: ''; width: 1.25rem; height: 1.25rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/admissions/icon-1-1.svg"); position: absolute; left: 2.5rem; bottom: 2.5rem; opacity: 0; transition: opacity .3s ease; } .index-s4 .item .txt-box:after { content: ''; height: 1px; background-color: #e6e6e6; position: absolute; left: 2.5rem; right: 2.5rem; bottom: 0; transition: opacity .3s ease; } .index-s4 .item span { color: #7c44a1; } .index-s4 .item .tit { color: #333; margin-top: 1.5rem; transition: color .3s ease; } @media (any-hover: hover) { .index-s4 .item:hover img { transform: scale(1.1); } .index-s4 .item:hover .txt-box { background-color: #f2f3f9; } .index-s4 .item:hover .txt-box:after { opacity: 0; } .index-s4 .item:hover .txt-box:before { opacity: 1; } .index-s4 .item:hover .tit { color: #7c44a1; } } .index-s4 .button { width: 5rem; height: 5rem; position: absolute; top: calc(100% + 2.5rem); background-position: center; background-repeat: no-repeat; background-size: contain; background-size: auto 20px; border: 2px solid #b287d6; border-radius: 50%; cursor: pointer; z-index: 2; transition: all .3s ease; } @media (any-hover: hover) { .index-s4 .button:hover { background-color: #7c44a1; border-color: transparent; } } .index-s4 .prev { right: calc(9rem + 6.25vw); background-image: url("../images/prev-1.png"); } @media (any-hover: hover) { .index-s4 .prev:hover { background-image: url("../images/prev-2.png"); } } .index-s4 .next { right: calc(2.5rem + 6.25vw); background-image: url("../images/next-1.png"); } @media (any-hover: hover) { .index-s4 .next:hover { background-image: url("../images/next-2.png"); } } .index-s4 .pagination { text-align: center; font-size: 0; display: none; position: absolute; top: calc(100% + 2.5rem); right: calc(2.5rem + 6.25vw); left: auto; width: auto; } .index-s4 .pagination span { display: inline-block; vertical-align: top; width: 12px; height: 12px; border-radius: 50%; border: 1px solid #7c44a1; transition: all .3s ease; margin: 0 4px; cursor: pointer; } .index-s4 .pagination span.active { background-color: #7c44a1; } .index-s4 .more-box { margin-top: 2.5rem; margin-left: 2.5rem; } .index-s5 { position: relative; padding: 6.25vw; padding-top: 0; z-index: 1; } .index-s5:before { content: ''; width: 100%; height: 88vw; position: absolute; top: 100%; left: 0; transform: translateY(-35vw); background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url("../images/index/img-16.png"); z-index: 1; } .index-s5 .label { color: #333; font-family: 'GILROY-BOLD'; position: relative; z-index: 2; } .index-s5 .cont { margin-top: 2.5rem; display: flex; align-items: flex-start; position: relative; z-index: 2; } .index-s5 .left-block { width: calc((100% - 3.125rem) / 2); height: 42.5vw; background-color: #f2f3f9; padding: 0 3.125rem; } .index-s5 .item { border-top: 1px solid #7c44a1; } .index-s5 .item .show { height: 10.25vw; display: flex; align-items: center; } .index-s5 .item .show .img-box { width: 6.25vw; height: 6.25vw; border-radius: 50%; overflow: hidden; } .index-s5 .item .show .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; } .index-s5 .item .show .txt-box { width: calc(100% - 6.25vw); padding-left: 2.5rem; } .index-s5 .item .show .txt-box span { color: #7c44a1; } .index-s5 .item .show .txt-box .tit { line-height: 2rem; color: #333; margin-top: 1.5rem; max-height: 4rem; overflow: hidden; } .index-s5 .item .hide { padding-left: calc(6.25vw + 2.5rem); height: 0; overflow: hidden; transition: height .3s ease; transform: translateY(-1vw); } .index-s5 .item .hide .para { color: #808080; line-height: 1.5rem; height: 9rem; overflow: hidden; } .index-s5 .item .hide:after { content: ''; width: 1.25rem; height: 1.25rem; display: block; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/admissions/icon-1-1.svg"); margin-top: 1.25rem; } .index-s5 .item:nth-of-type(1) { border: none; } .index-s5 .item.active .hide { height: calc(11.75vw - 1px); } .index-s5 .right-block { width: calc((100% - 3.125rem) / 2); height: 42.5vw; margin-left: 3.125rem; position: relative; } .index-s5 .right-block a { display: block; height: 100%; } .index-s5 .right-block .img-box { height: 100%; overflow: hidden; } .index-s5 .right-block img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s5 .right-block .txt-box { position: absolute; bottom: 0; left: 0; right: 0; padding: 3rem; z-index: 3; } .index-s5 .right-block span { display: inline-block; background-color: #7c44a1; color: #fff; line-height: 2; padding: 0 10px; } .index-s5 .right-block .tit { color: #fff; margin-top: 2.5rem; } @media (any-hover: hover) { .index-s5 .right-block:hover img { transform: scale(1.1); } } .index-s5 .more-box { margin-top: 2.5rem; position: relative; z-index: 9; } .index-s6 { position: relative; z-index: 2; } .index-s6 .label { color: #fff; font-family: 'GILROY-BOLD'; text-align: center; } .index-s6 .cont { position: relative; margin-top: 2.5rem; } .index-s6 .center-block { width: 42.5vw; margin: 0 auto; background-color: #fff; position: relative; padding-bottom: 7.5rem; } .index-s6 .center-block .item .img-box { overflow: hidden; } .index-s6 .center-block .item img { display: block; width: 100%; transition: transform .5s ease; } .index-s6 .center-block .item .txt-box { padding: 2.5rem 3rem; } .index-s6 .center-block .item span { color: #7c44a1; } .index-s6 .center-block .item .tit { margin-top: 1.5rem; color: #333; } @media (any-hover: hover) { .index-s6 .center-block .item:hover img { transform: scale(1.1); } } .index-s6 .split-block .item { position: absolute; width: calc((100% - 42.5vw) / 2); height: calc(50% - 5.2vw); overflow: hidden; } .index-s6 .split-block .item:after { content: ''; width: 100%; height: 50%; position: absolute; bottom: 0; left: 0; right: 0; background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), black); z-index: 2; } .index-s6 .split-block .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s6 .split-block .item span { position: absolute; bottom: 0; left: 0; right: 0; color: #fff; padding: 0 3rem 3rem; z-index: 3; } @media screen and (min-width: 769px) { .index-s6 .split-block .item:nth-of-type(1), .index-s6 .split-block .item:nth-of-type(3) { top: 5.2vw; } .index-s6 .split-block .item:nth-of-type(2), .index-s6 .split-block .item:nth-of-type(4) { bottom: 5.2vw; } .index-s6 .split-block .item:nth-of-type(1), .index-s6 .split-block .item:nth-of-type(2) { left: 0; } .index-s6 .split-block .item:nth-of-type(3), .index-s6 .split-block .item:nth-of-type(4) { right: 0; } } @media (any-hover: hover) { .index-s6 .split-block .item:hover img { transform: scale(1.1); } } .index-s6 .pagination { position: absolute; bottom: 3.75rem; right: 0; left: 0; text-align: center; font-size: 0; z-index: 2; } .index-s6 .pagination span { display: inline-block; vertical-align: top; width: 12px; height: 12px; border-radius: 50%; border: 1px solid #7c44a1; transition: all .3s ease; margin: 0 4px; cursor: pointer; } .index-s6 .pagination span.active { background-color: #7c44a1; } .index-s6 .more-box { text-align: center; margin-top: 2.5rem; } .index-s7 { padding: 6.25vw; position: relative; z-index: 2; } .index-s7 .label { color: #333; font-family: 'GILROY-BOLD'; } .index-s7 .items { margin-top: 2.5rem; font-size: 0; } .index-s7 .item { display: inline-block; vertical-align: top; width: calc((100% - 9rem) / 4); background-color: #fff; margin-right: 3rem; } .index-s7 .item .img-box { overflow: hidden; } .index-s7 .item img { display: block; width: 100%; transition: transform .3s ease; } .index-s7 .item .txt-box { position: relative; padding: 2.5rem 2.5rem 3.75rem; transition: all .3s ease; } .index-s7 .item .txt-box:before { content: ''; width: 100%; height: 20vw; position: absolute; bottom: 0; left: 0; background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; background-image: url("../images/index/img-15.png"); opacity: 0; transition: opacity .3s ease; } .index-s7 .item span { color: #333; display: block; position: relative; z-index: 2; transition: color .3s ease; } .index-s7 .item:last-of-type { margin-right: 0; } @media screen and (min-width: 1025px) { .index-s7 .item:nth-of-type(2) { transform: translateY(30%); } .index-s7 .item:nth-of-type(3) { transform: translateY(60%); } .index-s7 .item:nth-of-type(4) { transform: translateY(90%); } } @media (any-hover: hover) { .index-s7 .item:hover img { transform: scale(1.1); } .index-s7 .item:hover .txt-box { background-color: #8c96cb; } .index-s7 .item:hover .txt-box:before { opacity: 1; } .index-s7 .item:hover span { color: #fff; } } .index-s7 .pagination { display: none; font-size: 0; margin-top: 2rem; } .index-s7 .pagination span { display: inline-block; vertical-align: top; width: 12px; height: 12px; border-radius: 50%; border: 1px solid #7c44a1; transition: all .3s ease; margin: 0 4px; cursor: pointer; } .index-s7 .pagination span.active { background-color: #7c44a1; } .index-s7 .more-box { text-align: right; margin-top: 2.5rem; } .index-s8 { position: relative; padding-top: 5.2vw; } .index-s8 .bg-img { position: relative; z-index: 1; } .index-s8 .bg-img img { display: block; width: 100%; } .index-s8 .follow { position: absolute; top: 0; left: 0; right: 0; padding: 0 6.25vw; z-index: 2; } .index-s8 .follow .label { color: #333; font-family: 'GILROY-BOLD'; text-align: center; } .index-s8 .follow .box { font-size: 0; margin-top: 2.5rem; text-align: center; } .index-s8 .follow a { position: relative; display: inline-block; vertical-align: top; width: 3.75rem; height: 3.75rem; background-color: #5b5287; border-radius: 50%; margin-left: 1.25rem; transition: all .3s ease; } .index-s8 .follow a:nth-of-type(1) { margin-left: 0; } .index-s8 .follow a i { display: block; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; } .index-s8 .follow a .ewm { width: 7.5rem; position: absolute; top: 100%; left: 50%; margin-left: -3.75rem; padding-top: 20px; opacity: 0; visibility: hidden; transition: all .3s ease; z-index: 2; } .index-s8 .follow a .ewm:after { content: ''; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #fff; position: absolute; left: 50%; top: 10px; margin-left: -10px; } .index-s8 .follow a .ewm .img-box { box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .index-s8 .follow a .ewm img { display: block; width: 100%; } .index-s8 .follow a.active { background-color: #7c44a1; } .index-s8 .follow a.active .ewm { opacity: 1; visibility: visible; } @media (any-hover: hover) { .index-s8 .follow a:hover { background-color: #7c44a1; } .index-s8 .follow a:hover .ewm { opacity: 1; visibility: visible; } } .index-s8 .items { position: absolute; left: 0; bottom: 6.25vw; right: 0; z-index: 2; } .index-s8 .swiper { padding-left: 6.25vw; padding-bottom: 2.5rem; } .index-s8 .swiper-scrollbar { width: 87.5vw; left: 6.25vw; background-color: rgba(255, 255, 255, 0.2); cursor: pointer; } .index-s8 .swiper-scrollbar-drag { background-color: #fff; } .index-s8 .item { margin-right: 12px; } .index-s8 .item .img-box { overflow: hidden; } .index-s8 .item .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } @media (any-hover: hover) { .index-s8 .item .img-box:hover img { transform: scale(1.1); } } .index-s8 .item:last-of-type { margin-right: 0; } .index-s8 .item:nth-of-type(4n-3) { width: 38.4375vw; height: 25.625vw; } .index-s8 .item:nth-of-type(4n-3) .img-box { height: 100%; } .index-s8 .item:nth-of-type(4n-1) { width: 25.625vw; height: 25.625vw; } .index-s8 .item:nth-of-type(4n-1) .img-box { height: 100%; } .index-s8 .item:nth-of-type(even) { width: 25.625vw; height: 25.625vw; } .index-s8 .item:nth-of-type(even) .img-box { position: absolute; height: calc(50% - 6px); } .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(1), .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(2) { width: calc(50% - 6px); top: 0; } .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(1) { left: 0; } .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(2) { right: 0; } .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(3) { width: 100%; left: 0; bottom: 0; } .index-s9 { background-position: center; background-repeat: no-repeat; background-size: cover; height: 50rem; display: flex; align-items: center; } .index-s9 .txt-box { width: 100%; padding: 0 6.25vw; text-align: center; } .index-s9 .txt-box span { color: #fff; font-family: 'GILROY-BOLD'; } .index-s9 .txt-box a { display: block; width: 5.875rem; height: 5.875rem; margin: 7.5rem auto 0; position: relative; } .index-s9 .txt-box a:before, .index-s9 .txt-box a:after { content: ''; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 0; left: 0; } .index-s9 .txt-box a:before { background-image: url("../images/index/icon-2-1.png"); animation: ani-rotate 5s linear infinite; } .index-s9 .txt-box a:after { background-image: url("../images/index/icon-2-2.png"); } .news .public-sidebar { width: 36%; height: 100%; padding: 3.75rem 3.75rem 7.5rem 0; position: absolute; right: 0; top: 0; } .news .public-sidebar .tags { width: 30rem; max-width: 90%; background-color: #fff; padding-top: 5.625rem; } .news .public-sidebar .tags .title { color: #000; font-family: 'GILROY-BOLD'; padding-left: 3.75rem; } .news .public-sidebar .tags .con { margin-top: 1.5rem; padding-left: 1.875rem; display: flex; flex-flow: column; align-items: flex-start; } .news .public-sidebar .tags .con a { line-height: 2.5rem; color: #333; font-family: 'GILROY-LIGHT'; padding: 0 1.875rem; border-radius: 5px; margin-top: 5px; transition: all .3s ease; } @media screen and (min-width: 1025px) { .news .public-sidebar .tags .con a:nth-of-type(1) { margin-top: 0; } .news .public-sidebar .tags .con a.showNow { background-color: #7c44a1; color: #fff; } } @media (any-hover: hover) { .news .public-sidebar .tags .con a:hover { background-color: #7c44a1; color: #fff; } } .news .news-content { border-right: 1px solid #e6e6e6; padding-bottom: 1.5rem; width: 64%; min-height: 54rem; } .news .search-content { background-color: #f2f3f9; padding: 3.75rem; } .news .search-content .f24 { color: #000; font-family: 'GILROY-BOLD'; } .news .search-content .con1 { position: relative; margin-top: 1.5rem; background-color: #fff; } .news .search-content .con1 input[type="text"] { display: block; width: 100%; padding: 0 5.625rem 0 1.875rem; line-height: 3.75rem; background-color: transparent; font-family: 'GILROY-LIGHT'; color: #808080; border: 1px solid transparent; transition: all .3s ease; } .news .search-content .con1 input[type="text"]:hover, .news .search-content .con1 input[type="text"]:focus { border-color: #7c44a1; box-shadow: 0 0 1.875rem rgba(124, 68, 161, 0.3); } .news .search-content .con1 input[type="submit"] { width: 3.75rem; height: 3.75rem; background-color: transparent; position: absolute; right: 0; top: 0; background-position: center; background-repeat: no-repeat; background-size: auto 1.25rem; background-image: url("../images/news/icon-2.svg"); background-color: transparent; cursor: pointer; } .news .search-content .data-search { margin-top: 3.75rem; } .news .search-content .ta_date { font-family: 'GILROY-LIGHT'; height: 3.75rem; line-height: 3.75rem; padding: 0 1.875rem; color: #808080; border: 1px solid transparent; transition: all .3s ease; margin-top: 1.5rem; } .news .search-content .ta_date:before { display: inline-block; vertical-align: middle; margin: -2px 10px 0 0; font-size: 1.25rem; color: #ccc; } @media (any-hover: hover) { .news .search-content .ta_date:hover { border-color: #7c44a1; box-shadow: 0 0 1.875rem rgba(124, 68, 161, 0.3); } } .news .search-content.flex { display: flex; } .news .search-content.flex .search, .news .search-content.flex .data-search { width: calc((100% - 1.5rem) / 2); } .news .search-content.flex .data-search { margin-left: 1.5rem; margin-top: 0; } .news .subnav { width: 30rem; max-width: 90%; padding-top: 5.625rem; background-color: #fff; } .news .subnav .title { color: #000; font-family: 'GILROY-BOLD'; padding-left: 3.75rem; } .news .subnav .mt20 { margin-top: 1.5rem; } .news .subnav .mt20 a { display: block; color: #333; font-family: 'GILROY-LIGHT'; padding: 1.25rem 3.75rem; transition: all .3s ease; } .news .subnav .mt20 a.on { background-color: #7c44a1; color: #fff; } @media (any-hover: hover) { .news .subnav .mt20 a:hover { background-color: #7c44a1; color: #fff; } } .news-s3 { position: relative; } .news-s3 .news-content li:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: -1px; left: 0; background-color: #7c44a1; transform: scaleX(0); transform-origin: left center; } .news-s3 .news-content li .pic { display: block; position: relative; margin-left: 7.5rem; overflow: hidden; } .news-s3 .news-content li img { display: block; width: 100%; transition: transform .5s ease; } .news-s3 .news-content li .time { position: absolute; top: 3.75rem; color: #808080; font-family: 'GILROY-LIGHT'; } .news-s3 .news-content li .time span { font-family: 'GILROY-BOLD'; color: #333333; display: block; } .news-s3 .news-content li .title { display: block; line-height: 1.2; color: #333; font-family: 'GILROY-BOLD'; transition: color .3s ease; } @media (any-hover: hover) { .news-s3 .news-content li:hover:after { transform: scaleX(1); transition: transform .5s ease; } .news-s3 .news-content li:hover img { transform: scale(1.1); } .news-s3 .news-content li:hover .title { color: #7c44a1; } } .news-s3 .first { padding: 3.75rem; border-bottom: 1px solid #e6e6e6; } .news-s3 .first .pic { margin-right: 8.75rem; overflow: hidden; } .news-s3 .first .pic img { display: block; width: 100%; transition: transform .5s ease; } @media (any-hover: hover) { .news-s3 .first .pic:hover img { transform: scale(1.1); } } .news-s3 .first .dete { color: #000; margin-top: 3.75rem; font-family: 'GILROY-LIGHT'; } .news-s3 .first .dete:before { content: ''; width: 1.5rem; height: 1.5rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-1.svg"); display: inline-block; vertical-align: middle; margin: -2px 10px 0 0; } .news-s3 .first .title { color: #333; margin-top: 2.5rem; font-family: 'GILROY-BOLD'; transition: color .3s ease; } @media (any-hover: hover) { .news-s3 .first .title:hover { color: #7c44a1; } } .news-s3 .first .tags { margin-top: 2.5rem; font-size: 0; } .news-s3 .first .tags a { display: inline-block; vertical-align: top; padding: 0 1.5rem; line-height: 2.375rem; color: #7c44a1; border: 1px solid rgba(124, 68, 161, 0.2); border-radius: 3px; margin-left: 10px; transition: all .3s ease; } .news-s3 .first .tags a:nth-of-type(1) { margin-left: 0; } @media (any-hover: hover) { .news-s3 .first .tags a:hover { border-color: transparent; background-color: #7c44a1; color: #fff; } } .news-s3 .activity { margin-bottom: 3.75rem; } .news-s3 .activity li { position: relative; padding: 3.75rem; border-bottom: 1px solid #e6e6e6; } .news-s3 .activity li .pic { width: 30rem; } .news-s3 .activity li .title { margin-top: 3.75rem; } .news-s3 .activity li .text { line-height: 1.5rem; color: #333; font-family: 'GILROY-LIGHT'; margin-top: 2.5rem; } .news-s3 .activity li .tags { margin-top: 2.5rem; font-size: 0; } .news-s3 .activity li .tags a { display: inline-block; vertical-align: top; padding: 0 1.5rem; line-height: 2.375rem; color: #7c44a1; border: 1px solid rgba(124, 68, 161, 0.2); border-radius: 3px; margin-left: 10px; transition: all .3s ease; } .news-s3 .activity li .tags a:nth-of-type(1) { margin-left: 0; } @media (any-hover: hover) { .news-s3 .activity li .tags a:hover { border-color: transparent; background-color: #7c44a1; color: #fff; } } .news-s3 .gallery { margin-bottom: 3.75rem; } .news-s3 .gallery li { position: relative; padding: 3.75rem; border-bottom: 1px solid #e6e6e6; } .news-s3 .gallery li .title { margin: 1.875rem 0 0 7.5rem; } .news-s3 .gallery li .title span { display: inline-block; vertical-align: middle; line-height: 1.875rem; margin-left: 2.5rem; background-color: #7c44a1; color: #fff; padding: 0 1rem; border-radius: 1rem; } .news-s3 .gallery li .pic .play { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3) url("../images/news/icon-3.svg") no-repeat center; background-size: auto 3.75rem; z-index: 3; } .news-s4 .title-info { padding: 3.75rem; border-bottom: 1px solid #e6e6e6; } .news-s4 .title-info h1 { color: #333; font-family: 'GILROY-BOLD'; font-weight: normal; } .news-s4 .title-info .info { font-size: 0; margin-top: 7.5rem; } .news-s4 .title-info .info .time { display: inline-block; vertical-align: middle; color: #000; } .news-s4 .title-info .info .time:before { content: ''; width: 24px; height: 24px; display: inline-block; vertical-align: middle; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-1.svg"); margin: -2px 10px 0 0; } .news-s4 .title-info .info .tag { display: inline-block; vertical-align: middle; margin-left: 3.75rem; } .news-s4 .title-info .info .tag a { display: inline-block; vertical-align: top; padding: 0 1.5rem; line-height: 2.5rem; color: #7c44a1; border: 1px solid rgba(124, 68, 161, 0.2); border-radius: 3px; margin-left: 10px; transition: all .3s ease; } .news-s4 .title-info .info .tag a:nth-of-type(1) { margin-left: 0; } @media (any-hover: hover) { .news-s4 .title-info .info .tag a:hover { border-color: transparent; background-color: #7c44a1; color: #fff; } } .news-s4 .title-info .info .sns { display: inline-block; vertical-align: middle; margin-left: 3.75rem; } .news-s4 .title-info .info .sns a { position: relative; display: inline-block; vertical-align: top; width: 2.5rem; height: 2.5rem; margin-right: 4px; border-radius: 3px; background-position: center; background-repeat: no-repeat; background-size: contain; transition: all .3s ease; } .news-s4 .title-info .info .sns a .ewm{ width: 7.5rem; position: absolute; bottom: 100%; left: 50%; margin-left: -3.75rem; padding-bottom: 20px; opacity: 0; visibility: hidden; transition: all .3s ease; z-index: 2; } .news-s4 .title-info .info .sns a .ewm:after{ content: ''; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #fff; position: absolute; left: 50%; bottom: 10px; margin-left: -10px; } .news-s4 .title-info .info .sns a .ewm .img-box{ box-shadow: 0 0 30px rgba(0,0,0,.1); } .news-s4 .title-info .info .sns a .ewm img{ display: block; width: 100%; } @media (any-hover: hover) { .news-s4 .title-info .info .sns a:hover .ewm{ opacity: 1; visibility: visible; } .news-s4 .title-info .info .sns a:nth-of-type(1):hover{ background-image: url('../images/facebook-1.png') !important; } .news-s4 .title-info .info .sns a:nth-of-type(2):hover{ background-image: url('../images/twitter-1.png') !important; } .news-s4 .title-info .info .sns a:nth-of-type(3):hover{ background-image: url('../images/Linkedin-1.png') !important; } .news-s4 .title-info .info .sns a:nth-of-type(4):hover{ background-image: url('../images/ins-1.png') !important; } .news-s4 .title-info .info .sns a:nth-of-type(5):hover{ background-image: url('../images/youtb-1.png') !important; } .news-s4 .title-info .info .sns a:nth-of-type(6):hover{ background-image: url('../images/wx-1.png') !important; } } .news-s4 .a-block { position: relative; } .news-s4 .content { padding: 3.75rem 3.75rem 0; } .news-s4 .v_news_content { line-height: 2; color: #333; min-height: 35em; } .news-s4 .v_news_content p { margin-top: 1rem; } .news-s4 .v_news_content p:nth-of-type(1) { margin-top: 0; } .news-s4 .v_news_content p img { max-width: 100%; height: auto !important; } .news-s4 .info-con1 { margin-top: 3.75rem; background-color: #f2f3f9; padding: 3.75rem; position: relative; } .news-s4 .info-con1:before { content: ''; width: 8.9375rem; height: 7.5rem; position: absolute; right: 3.75rem; top: 3.75rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-5-1.png"); } .news-s4 .info-con1 .info { display: flex; align-items: flex-start; } .news-s4 .info-con1 .pic { width: 15rem; height: 15rem; border-radius: 50%; overflow: hidden; } .news-s4 .info-con1 .pic img { display: block; width: 100%; height: 100%; object-fit: cover; } .news-s4 .info-con1 .f36 { width: calc(100% - 15rem); line-height: 3rem; color: #333; font-family: 'GILROY-BOLD'; text-align: left; padding-left: 2.5rem; } .news-s4 .info-con1 .f18 { line-height: 2; color: #333; margin-top: 2.5rem; } .news-s4 .info-con2 { margin-top: 3.75rem; background-color: #f2ecf5; padding: 3.75rem; position: relative; } .news-s4 .info-con2:before { content: ''; width: 8.9375rem; height: 7.5rem; position: absolute; right: 3.75rem; top: 3.75rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-5-2.png"); } .news-s4 .info-con2 .pic { width: 15rem; height: 15rem; margin: 0 auto; border-radius: 50%; overflow: hidden; } .news-s4 .info-con2 .pic img { display: block; width: 100%; height: 100%; object-fit: cover; } .news-s4 .info-con2 .f36 { line-height: 3rem; color: #333; font-family: 'GILROY-BOLD'; text-align: center; margin: 2.5rem 0 1.25rem; } .news-s4 .info-con2 .f18 { line-height: 2; color: #333; } .news-s4 .info-text { margin-top: 3.75rem; background-color: #efe7f7; padding: 5rem 3.75rem 5rem 16.4375rem; position: relative; line-height: 2.5rem; color: #333; min-height: 12.5rem; } .news-s4 .info-text:before { content: ''; width: 8.9375rem; height: 7.5rem; background-position: center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 50%; left: 3.75rem; margin-top: -3.75rem; background-image: url("../images/news/icon-5-3.png"); } .news-s4 .recommend { padding: 7.5rem 0; border-top: 1px solid #e6e6e6; } .news-s4 .recommend .tabs { display: flex; border-bottom: 1px solid #e6e6e6; } .news-s4 .recommend .tabs span { width: 50%; color: #000; font-family: 'GILROY-BOLD'; text-align: center; padding-bottom: 2.5rem; position: relative; cursor: pointer; } .news-s4 .recommend .tabs span:after { content: ''; width: 100%; height: 4px; background-color: #7c44a1; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); } .news-s4 .recommend .tabs span.cur:after { transform: scaleX(1); transition: transform .5s ease; } .news-s4 .recommend .dp-con { padding: 3.75rem 3.75rem 0; } .news-s4 .recommend .dp-none { display: none; } .news-s4 .recommend ul { display: flex; flex-wrap: wrap; } .news-s4 .recommend li { width: calc((100% - 7.5rem) / 3); margin: 5.625rem 2.5rem 0 0; } .news-s4 .recommend li .pic { overflow: hidden; } .news-s4 .recommend li img { display: block; width: 100%; transition: transform .5s ease; } .news-s4 .recommend li .txt-con { padding: 1.5rem 2.5rem 0; } .news-s4 .recommend li .tit a { display: block; line-height: 2rem; color: #000; } .news-s4 .recommend li .tag { margin-top: 2.5rem; font-size: 0; } .news-s4 .recommend li .tag a { display: inline-block; vertical-align: top; padding: 0 1.5rem; line-height: 2.375rem; color: #7c44a1; border: 1px solid rgba(124, 68, 161, 0.2); border-radius: 3px; margin-left: 10px; transition: all .3s ease; } .news-s4 .recommend li .tag a:nth-of-type(1) { margin-left: 0; } @media (any-hover: hover) { .news-s4 .recommend li .tag a:hover { border-color: transparent; background-color: #7c44a1; color: #fff; } } @media screen and (min-width: 769px) { .news-s4 .recommend li:nth-of-type(1), .news-s4 .recommend li:nth-of-type(2), .news-s4 .recommend li:nth-of-type(3) { margin-top: 0; } .news-s4 .recommend li:nth-of-type(3n) { margin-right: 0; } } @media (any-hover: hover) { .news-s4 .recommend li:hover img { transform: scale(1.1); } } .research-s6 { padding: 7.5rem 0; } .research-s6 li.flex { padding: 2.5rem 0; display: flex; align-items: center; border-bottom: 1px solid #e6e6e6; position: relative; } .research-s6 li.flex:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: -1px; left: 0; background-color: #7c44a1; transform: scaleX(0); transform-origin: left center; } .research-s6 li.flex .pic { width: 30rem; overflow: hidden; } .research-s6 li.flex img { display: block; width: 100%; transition: transform .5s ease; } .research-s6 li.flex .flex-1 { width: calc(100% - 30rem); padding-left: 2.5rem; } .research-s6 li.flex .f24 { display: block; line-height: 2rem; color: #000; font-family: 'GILROY-BOLD'; } .research-s6 li.flex .text { line-height: 24px; color: #000; margin-top: 1.5rem; font-family: 'GILROY-LIGHT'; max-height: 120px; overflow: hidden; } .research-s6 li.flex .time { margin-top: 1.5rem; color: #7c44a1; font-family: 'GILROY-LIGHT'; } .research-s6 li.flex .time:before { content: ''; width: 14px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-1-1.svg"); display: inline-block; vertical-align: middle; margin: -2px 10px 0 0; } .research-s6 li.flex:last-of-type { margin-bottom: 2.5rem; } @media (any-hover: hover) { .research-s6 li.flex:hover:after { transform: scaleX(1); transition: transform .5s ease; } .research-s6 li.flex:hover img { transform: scale(1.1); } } @media screen and (max-width: 1920px) { .index-s3 .right-block .item p { height: 7.5rem; } } @media screen and (max-width: 1800px) { html { font-size: 15px; } } @media screen and (max-width: 1681px) { html { font-size: 14px; } .campus-s2 .prev { left: -8rem; } .campus-s2 .next { right: -8rem; } } @media screen and (max-width: 1441px) { html { font-size: 13px; } .font-16, .fixed-search input, .fixed-search .link a, .lg-sub-html p, .admissions-s2 .item a, .admissions-s3 .item .para, .admissions-s5 .item p, .campus-s2 .item span, .campus-s5 .para, .campus-s7 .item .para, .academics-s1 a, .academics-s3 .item .para, .research-s2 .item p, .research-s3 .item p, .research-s3 .info, .research-s5 .item p, .global-s2 .map-block .dot span, .global-s3 .item .para, .global-s5 .item span, .global-s5 .item .mail, .global-s5 .item p, .global-s5 .desc p, .index-page .more-box a, .index-s3 .right-block .item p, .index-s4 .item span, .index-s5 .item .show .txt-box span, .index-s5 .item .hide .para, .index-s5 .right-block span, .index-s6 .center-block .item span, .news-s3 .first .tags a, .news-s3 .activity li .text, .news-s3 .activity li .tags a, .news-s3 .gallery li .title span, .news-s4 .title-info .info .tag a, .news-s4 .recommend li .tag a, .research-s6 li.flex .text { font-size: 14px; } .font-14, .c-sublink a, .campus-btn1, .c-crumbs a.link, .about-s4 .line-box li span, .admissions-s3 .item a, .admissions-s4 a, .research-s5 .item span, .news .search-content .con1 input[type="text"], .news .search-content .ta_date, .news-s3 .news-content li .time, .research-s6 li.flex .time { font-size: 12px; } .research-s6 li.flex .text { line-height: 20px; max-height: 100px; } } @media screen and (max-width: 1367px) { html { font-size: 12px; } .admissions-s3 .item .para { line-height: 1.2; } } @media screen and (max-width: 1281px) { html { font-size: 10px; } .campus-s2 .items { width: 80%; margin: 2.5rem auto 0; } .campus-s2 .item { width: 56rem; } } @media screen and (max-width: 1025px) { html { font-size: 10px; } .wrap-s { width: 90%; } .c-banner { margin-top: 60px; } .c-banner img { height: 26rem; object-fit: cover; } .c-banner .txt { padding: 0 2rem 2rem; font-size: 2.4rem; } .c-sublink { padding: 0 2rem; white-space: nowrap; } .c-sublink a { width: auto; } .about-s7 { padding: 4rem 0; } .about-s7 .circle-box { display: block; margin: 0 auto; } .about-s7 .txt-box { width: 100%; padding: 2rem 0 0; } .about-s7 .tit { text-align: center; } .about-s7 .para { margin-top: 1.5rem; line-height: 1.5; } .about-s8 { padding: 4rem 0; } .about-s8 .wrap-s { text-align: center; } .about-s8 .tab-tit { display: inline-block; width: auto; max-width: 100%; } .about-s8 .tab-tit .item { width: auto; padding: 0 1rem 1rem; margin-left: 0; } .about-s8 .tab-tit .item i { width: 3.6rem; height: 3.6rem; } .about-s8 .tab-tit .item span { margin-top: 1rem; } .about-s8 .tab-tit .item:after { height: 2px; } .about-s8 .tab-cont { text-align: left; margin-top: 2rem; } .about-s8 .tab-cont .item { width: 100%; margin: 1.5rem 0 0; padding: 1.5rem 2rem; } .about-s8 .tab-cont .item:nth-of-type(1) { margin-top: 0; } .about-s8 .tab-cont .item .tit:before { width: 2px; } .about-s8 .tab-cont .item .tit { margin-left: -2rem; padding-left: 2rem; } .about-s9 { padding: 4rem 0; } .about-s9 .item p { font-size: 1.4rem; } .about-s4 .line-box { display: none; } .about-s4 { padding: 4rem 0; } .about-s1 { padding: 4rem 0; } .about-s1 .txt-box { width: 100%; padding: 0 0 0 2rem; border-left-width: 2px; line-height: 1.5; } .about-s1 .img-box { display: block; width: 100%; margin: 2rem auto 0; } .c-bg-fixed, .about-s2, .admissions-s2, .admissions-s4, .campus-s2, .research-s3, .index-s2, .index-s9 { background-attachment: inherit; } .about-s2 { padding: 8rem 0; height: auto; } .about-s2 .txt { font-size: 1.8rem; line-height: 1.5; } .about-s3 { padding: 4rem 0; } .about-s3 .txt-box { line-height: 1.5; } .about-s3 .img-box { margin-top: 2rem; } .about-s5 { padding: 4rem 0; } .about-s5 .items { margin-top: 2rem; } .about-s5 .item { display: block; } .about-s5 .box { border-top: 1px solid #e6e6e6; } .about-s5 .box:nth-of-type(1) { border: none; } .about-s5 .box span { padding: 1.5rem 1rem; } .about-s5 .box ul { padding: 1.5rem 0; } .about-s6 { padding: 4rem 0; margin-top: 60px; } .about-s6 .tit { margin-top: 2rem; } .about-s6 .para { margin-top: 1.5rem; line-height: 1.5; } .about-s10 { padding: 4rem 0; } .about-s10 .item { padding: 2rem 0; } .about-s10 .item .txt-box { display: block; width: 100%; padding: 1.5rem 0 0; } .about-s10 .item span { font-size: 1.6rem; } .about-s10 .item .para { font-size: 1.4rem; } .academics-s2 { padding: 4rem 0; } .academics-s2 .img-box { margin-top: 2rem; } .academics-s3 { padding-bottom: 4rem; } .academics-s3 .items { margin-top: 2rem; padding-top: 2rem; } .academics-s3 .item { margin-top: 2rem; } .academics-s3 .item .para { line-height: 1.5; } .academics-s1 { padding: 4rem 0; } .academics-s1 .item { margin-top: 4rem; } .academics-s1 .link { margin-top: 2rem; } .academics-s1 a { padding: 1.5rem 4rem 1.5rem 1.5rem; } .academics-s1 a:after { right: 2rem; } .admissions-s1 { padding: 4rem 0; } .admissions-s1 .para { padding-left: 2rem; border-width: 2px; } .admissions-s2 { padding: 4rem 0; } .admissions-s2 .s-label { margin-top: 2rem; font-size: 1.8rem; } .admissions-s2 .item { margin-top: 2rem; } .admissions-s2 .item .tit { border-width: 2px; } .admissions-s2 .item.item-1 a { width: 100%; margin: 1rem 0 0; } .admissions-s2 .item.item-1 a:nth-of-type(1) { margin-top: 0; } .admissions-s2 .item a { padding: 1.5rem 4rem 1.5rem 1.5rem; } .admissions-s2 .item a:after { right: 2rem; } .admissions-s3 { padding: 4rem 0; } .admissions-s3 .items { margin-top: 2rem; } .admissions-s3 .item { margin-top: 2rem; } .admissions-s3 .item:nth-of-type(1) { margin-top: 0; } .admissions-s3 .item .img-box { width: 100%; } .admissions-s3 .item .txt-box { width: 100%; position: static; padding: 1.5rem 0 0; } .admissions-s4 .para { font-size: 1.6rem; line-height: 1.5; } .admissions-s4 { padding: 8rem 0; height: auto; } .admissions-s4 a { margin-top: 4rem; } .admissions-s5 { padding: 4rem 0; } .admissions-s5 .items { margin-top: 2rem; } .campus-s1 { padding: 4rem 0; } .campus-s1 .items { margin-top: 2rem; } .campus-s2 { padding: 4rem 0; } .campus-s2 .items { width: 100%; margin-top: 2rem; } .campus-s2 .pagination { display: block; } .campus-s2 .pagination span { margin: 0 1px; } .campus-s2 .button { display: none; } .campus-s3 { padding: 4rem 0; } .campus-s3 .items { margin-top: 2rem; } .campus-s4 { padding: 4rem 0; } .campus-s4 .left-box { width: 100%; position: static; padding: 0; font-size: 0; } .campus-s4 li { display: inline-block; vertical-align: top; margin-top: 0; } .campus-s4 li a { padding: 1rem; } .campus-s4 .right-box { border: none; margin-left: 0; margin-top: 2rem; padding: 0; } .campus-s5 .para { line-height: 1.5; } .campus-s5 .swiper-block { margin-top: 2rem; } .campus-s5 .s-item img { height: 14vw; } .campus-s5 .button { height: 12vw; display: none; } .campus-s5 .pagination { display: block; } .campus-s5 .pagination span { margin: 0 2px; } .campus-s5 .s-items { padding: 0; } .campus-s6 .items { margin-top: 2rem; padding-top: 2rem; } .campus-s6 .block { margin-top: 4rem; } .c-crumbs { display: none; } .campus-s7 { padding: 4rem 0; } .campus-s7 .item .label { border-left-width: 2px; font-size: 2rem; } .campus-s7 .item .para { line-height: 1.5; } .campus-s8 { padding: 4rem 0; } .campus-s8 .swiper { width: 90%; } .campus-s8 .button { display: none; } .campus-s8 .pagination span { margin: 0 2px; } .campus-s9 { padding: 4rem 5%; } .campus-s9 .item { margin-bottom: 2rem; } .global-s5 { padding: 4rem 0; } .global-s5 .para { line-height: 1.5; } .global-s5 .top-block { margin-top: 2rem; padding: 2rem 0; border-width: 2px; } .global-s5 .bot-block { margin-top: 2rem; } .global-s5 .desc { padding: 2rem 0; display: block; } .global-s5 .desc p { width: 100%; margin-top: 1.5rem; line-height: 1.5; } .global-s5 .items { margin-top: 2rem; } .global-s5 .s-label:before { width: 2px; margin-right: 10px; } .global-s5 .s-label.pt { padding-top: 2rem; } .global-s5 .s-label.mt { margin-top: 2rem; } .global-s4 { padding: 4rem 0; } .global-s4 .para { line-height: 1.5; } .global-s4 .items { margin-top: 2rem; } .global-s4 .item { padding: 2rem 0; border-width: 2px; } .global-s4 .item .para { margin-top: 1.5rem; } .global-s4 .item ul { margin-top: 1.5rem; } .global-s4 .item li { line-height: 1.5; } .global-s1 { padding: 4rem 0; } .global-s1 .para { line-height: 1.5; } .global-s1 .mt { margin-top: 2rem; } .global-s1 .items .pagination span { margin: 0 2px; } .global-s2 { padding: 2rem 0; } .global-s2 .map-block { margin-bottom: 6rem; } .global-s2 .map-block .info { bottom: -6rem; left: 0; } .global-s2 .map-block .dot i { transform: scale(0.6); } .global-s2 .map-block .dot span { transform: scale(0.8) translateX(-80%); top: 1.5rem; } .global-s2 .map-block .dot.active span { color: #333; } .global-s2 .items { padding-top: 2rem; margin-top: 0; } .global-s2 .item { margin-top: 2rem; } .global-s2 .item .tit { padding: 0 2rem; line-height: 6rem; } .global-s2 .item .tit:after { right: 1.5rem; } .global-s2 .item .para { padding: 2rem; line-height: 1.5; } .global-s3 { padding: 4rem 0; } .global-s3 .item .para { line-height: 1.5rem; } .global-s3 .item .box { padding: 2rem; } .research-s1 { padding: 4rem 0; } .research-s1 .block { margin-top: 2rem; } .research-s1 .s-label { padding: 0 1.5rem; } .research-s1 .item { margin-top: 2rem; } .research-s1 .item .txt-box { padding-left: 2rem; } .research-s1 .item .para { line-height: 1.5; } .research-s2 { padding: 4rem 0; } .research-s2 .items { margin-top: 2rem; } .research-s3 { padding: 4rem 0; } .research-s3 .items { margin-top: 2rem; } .research-s3 .info { margin: 2rem 0 0 2rem; } .research-s2 .item .box { padding: 2rem; } .research-s2 .item p { line-height: 1.2; } .research-s3 .item p { padding: 0 2rem; line-height: 1.2; } .research-s5 { padding: 4rem 0; } .research-s5 .item { padding: 2rem 0; } .research-s5 .item .txt-box { padding-left: 2rem; } .research-s5 .item p { height: auto; } .research-s4 { padding: 4rem 0; } .research-s4 .s-label { margin-top: 2rem; padding: 0 2rem; border-width: 2px; } .research-s4 .info { margin-top: 2rem; } .research-s4 .box { margin-top: 2rem; } .research-s4 .web { margin-top: 2rem; padding: 0 2rem; } .research-s4 .box .txt-box { padding-left: 2rem; } .research-s4 .block { margin-top: 4rem; } .index-s1 { margin-top: 60px; } .index-s1:before { display: none; } .index-s1 .item { height: 60vw; } .index-s2 .box span { margin-top: 2rem; } .index-s2 .box .tit { font-size: 1.6rem; line-height: 1.2; max-height: 5.76rem; } .index-s3 .left-block .item span { font-size: 1.6rem; line-height: 1.2; max-height: 5.76rem; } .index-s3 .left-block .item .txt-box { height: 9rem; } .index-s3 .left-block .item a.cell-box { padding: 0 2rem; } .index-s3 .pagination { bottom: calc(4.5rem - 3px); } .index-s3 .pagination span { width: 6px; height: 6px; margin: 0 2px; } .index-s3 .right-block .item .para-box { display: none; } .index-s3 .right-block .item .tit-box { height: 8.8vw; } .index-s4 .item .txt-box { padding: 2rem 2rem 0; } .index-s4 .button { display: none; } .index-s4 .pagination { display: block; } .index-s4 .pagination span { width: 6px; height: 6px; margin: 0 2px; } .index-s5 .left-block { padding: 0 2rem; } .index-s5 .item .hide { display: none; } .index-s5 .item .show { height: 13.25vw; } .index-s5 .right-block .tit { font-size: 1.6rem; margin-top: 2rem; } .index-s5 .item .show .txt-box { padding-left: 2rem; } .index-s5 .item .show .txt-box .tit { margin-top: 1rem; } .index-s6 .center-block .item .tit { font-size: 1.6rem; } .index-s6 .center-block .item .txt-box { padding: 2rem; } .index-s6 .pagination span { width: 6px; height: 6px; margin: 0 2px; } .index-s6 .split-block .item span { padding: 0 2rem 2rem; } .index-s7 .item { width: calc((100% - 6rem) / 4); margin-right: 2rem; } .index-s7 .item .txt-box { padding: 2rem; } .research-s6 { padding: 4rem 0; } .news .public-sidebar { padding: 2rem 2rem 2rem 0; } .news .news-content { padding-bottom: 4rem; } .news .search-content { padding: 2rem; } .news .search-content .data-search { margin-top: 2rem; } .news .subnav { padding-top: 2rem; } .news .subnav .title { padding-left: 2rem; } .news .subnav .mt20 a { padding: 1rem 2rem; } .news .public-sidebar .tags { padding-top: 2rem; } .news .public-sidebar .tags .title { padding-left: 2rem; } .news .public-sidebar .tags .con { padding-left: 1rem; } .news .public-sidebar .tags .con a { padding: 0 1rem; } .news-s3 { margin-top: 60px; } .news-s3 .public-sidebar .float-wrapper { top: 60px; position: static; } .news-s3 .gallery li { padding: 2rem; } .news-s3 .news-content li .time { top: 2rem; } .news-s3 .first { padding: 2rem; } .news-s3 .first .dete { margin-top: 2rem; } .news-s3 .first .title { margin-top: 2rem; font-size: 1.8rem; } .news-s3 .first .tags { margin-top: 2rem; } .news-s3 .activity li { padding: 2rem; } .news-s3 .activity li .title { margin-top: 2rem; } .news-s3 .activity li .text { margin-top: 2rem; } .news-s3 .activity li .tags { margin-top: 2rem; } .news-s3 .activity { margin-bottom: 2rem; } .news-s4 { margin-top: 60px; } .news-s4 .title-info { padding: 2rem 5%; } .news-s4 .title-info .info { margin-top: 2rem; } .news-s4 .content { padding: 2rem 2rem 0; } .news-s4 .info-con1 { margin-top: 2rem; } .news-s4 .info-con2 { margin-top: 2rem; } .news-s4 .info-text { margin-top: 2rem; } .news-s4 .title-info .info .sns { display: none; } .news-s4 .recommend { padding: 4rem 0; } .research-s6 li.flex { padding: 2rem 0; } .research-s6 li.flex .flex-1 { padding-left: 2rem; } .research-s6 li.flex:last-of-type { margin-bottom: 2rem; } .comm-page li a { width: 30px; height: 30px; line-height: 30px; font-size: 12px; } .comm-page li { margin: 1px; } .comm-page li:first-of-type a, .comm-page li:last-of-type a { width: 80px; } } @media screen and (max-width: 769px) { .about-s9 .item { padding: 1.5rem 0 1.5rem 7rem; width: 100%; min-height: 10rem; } .about-s9 .item:nth-of-type(1) { border: none; } .about-s9 .item .icon { width: 6rem; height: 6rem; } .about-s9 .item p { margin-top: 0; } .about-s9 .item .tit { margin-top: 1rem; } .about-s4 .line-ani, .about-s4 .block:before, .about-s4 .block:after { display: none; } .about-s4 .item .year-box { font-size: 3rem !important; width: 100%; line-height: 1.2; text-align: left; position: static; } .about-s4 .item .tit-box { min-height: auto; margin-top: 1rem; } .about-s4 .item .img-box { margin-top: 2rem; } .about-s4 .item { margin-top: 4rem; } .about-s4 .item:nth-of-type(1) { margin-top: 0; } .about-s3 .img-box { display: block; } .about-s3 .item { margin-top: 2rem; } .about-s3 .item:nth-of-type(1) { margin-top: 0; } .admissions-s2 .img-items { display: block; } .admissions-s2 .img-item { margin-top: 2rem; } .admissions-s2 .img-item:nth-of-type(1) { margin-top: 0; } .admissions-s4 { padding: 8rem 0; } .admissions-s5 .items { padding-left: 0; } .admissions-s5 .item { width: calc(50% - .75rem); padding: 2rem; margin-top: 1.5rem; } .admissions-s5 .item .img-box{ margin-top: 0; } .admissions-s5 .item:nth-of-type(1) { margin: 0; width: 100%; } .admissions-s5 .item:nth-of-type(3), .admissions-s5 .item:nth-of-type(5) { margin-left: 1.5rem; } .admissions-s5 .item:nth-of-type(6) { width: 100%; } .admissions-s5 .item:nth-of-type(6) span{ margin-bottom: 0; } .admissions-s5 .item span { margin: 1.5rem 0; } .campus-s1 .item { width: 100%; margin: 2rem 0 0; } .campus-s1 .item:nth-of-type(1) { margin-top: 0; } .campus-s2 .item { width: 100%; } .campus-s3 .item { width: 100%; margin: 2rem 0 0; } .campus-s3 .item:nth-of-type(1) { margin-top: 0; } .campus-s6 .item { width: 100%; margin: 2rem 0 0; } .campus-s6 .item:nth-of-type(1) { margin-top: 0; } .campus-s9 .items { column-count: 2; } .global-s5 .item { width: 100%; margin-top: 2rem; } .global-s5 .item:nth-of-type(1) { margin-top: 0; } .global-s4 .img-items { display: block; } .global-s4 .img-item { margin-top: 2rem; } .global-s4 .img-item:nth-of-type(1) { margin-top: 0; } .global-s1 .items { max-width: none; } .global-s1 .single-pic img { max-width: 100%; } .research-s1 .item { display: block; } .research-s1 .item .img-box { width: 100%; } .research-s1 .item .txt-box { width: 100%; padding: 1.5rem 0 0; } .research-s2 .item { width: calc((100% - 1.5rem) / 2); margin: 1.5rem 0 0 1.5rem; } .research-s2 .item:nth-of-type(1), .research-s2 .item:nth-of-type(2) { margin-top: 0; } .research-s2 .item:nth-of-type(odd) { margin-left: 0; } .research-s3 .item { width: 100%; margin-top: 1.5rem; } .research-s3 .item:nth-of-type(1) { margin-top: 0; } .research-s4 .box { display: block; } .research-s4 .box .img-box { width: 100%; } .research-s4 .box .txt-box { width: 100%; padding: 1.5rem 0 0; } .index-s1 .item span { width: 100%; font-size: 2rem; } .index-s1 .pagination { bottom: 2rem; transform-origin: bottom center; transform: scale(0.6); } .index-s2 { padding: 4rem 5%; } .index-s2 .swiper { margin: 0; padding: 0; } .index-s2 .item { padding-top: 0; } .index-s2 .box:nth-of-type(1) { width: 100%; } .index-s2 .box:nth-of-type(1) .img-box, .index-s2 .box:nth-of-type(2) .img-box { height: auto; } .index-s2 .box:nth-of-type(2) { position: static; width: 100%; margin-top: 2rem; } .index-s2 .pagination { top: calc(100% + 2.2rem); } .index-s2 .pagination span { font-size: 1.4rem; padding-right: 3rem; } .index-s2 .pagination span:before, .index-s2 .pagination span:after { width: 1.5rem; height: 1px; right: .75rem; } .index-s2 .more-box { margin-top: 2rem; } .index-s3 { padding: 4rem 5%; } .index-s3 .cont { margin-top: 2rem; display: block; } .index-s3 .left-block { width: 100%; margin: 0; } .index-s3 .left-block .item img { height: 50vw; } .index-s3 .left-block .item .txt-box { padding-right: 0; } .index-s3 .pagination { position: static; margin-top: 2rem; text-align: center; width: 100%; } .index-s3 .pagination span { border-color: #7c44a1; } .index-s3 .pagination span.active { background-color: #7c44a1; } .index-s3 .right-block { width: 100%; height: auto; padding: 0; margin-top: 2rem; } .index-s3 .right-block .en { display: none; } .index-s3 .right-block .item .tit-box { height: auto; padding: 2rem 0; } .index-s3 .more-box { position: static; margin-top: 2rem; text-align: center; } .index-s4 { padding: 0 5% 4rem; } .index-s4 .items { margin: 2rem 0 0; } .index-s4 .items:before, .index-s4 .items:after { display: none; } .index-s4 .swiper { padding: 0; } .index-s4 .item .txt-box { min-height: auto; } .index-s4 .item .txt-box:before, .index-s4 .item .txt-box:after { display: none; } .index-s4 .more-box { margin: 2rem 0 0; text-align: right; } .index-s4 .pagination { left: 0; text-align-last: left; } .index-s5 { padding: 0 5% 4rem; } .index-s5 .cont { margin-top: 2rem; display: block; } .index-s5 .left-block { width: 100%; height: auto; } .index-s5 .item .show { height: auto; padding: 2rem 0; } .index-s5 .item .show .img-box { width: 6rem; height: 6rem; } .index-s5 .item .show .txt-box { width: calc(100% - 6rem); } .index-s5 .right-block { width: 100%; margin: 2rem 0 0; } .index-s5 .right-block { height: auto; } .index-s5 .right-block .txt-box { padding: 2rem; } .index-s5 .more-box { margin-top: 2rem; text-align: center; } .index-s6 { padding: 0 5%; } .index-s6 .label { color: #333; text-align: left; } .index-s6 .cont { margin-top: 2rem; } .index-s6 .center-block { width: 100%; padding-bottom: 0; } .index-s6 .pagination { position: static; } .index-s6 .split-block { margin-top: 2rem; display: flex; flex-wrap: wrap; } .index-s6 .split-block .item { position: relative; width: calc(50% - .5rem); margin: 1rem 1rem 0 0; } .index-s6 .split-block .item:nth-of-type(1), .index-s6 .split-block .item:nth-of-type(2) { margin-top: 0; } .index-s6 .split-block .item:nth-of-type(even) { margin-right: 0; } .index-s6 .split-block .item span { bottom: 1rem; padding: 0 1rem; font-size: 1.2rem; line-height: 1.4rem; max-height: 4.2rem; overflow: hidden; } .index-s6 .split-block .item:after { height: 80%; } .index-s6 .more-box { margin-top: 2rem; } .index-s7 { padding: 4rem 5%; } .index-s7 .items { margin-top: 2rem; } .index-s7 .item { width: 100%; margin: 0; } .index-s7 .item .txt-box { background-color: #8c96cb; height: 8rem; } .index-s7 .item .txt-box:before { opacity: 1; height: 100vw; max-height: 285px; } .index-s7 .item span { color: #fff; line-height: 2rem; max-height: 4rem; overflow: hidden; } .index-s7 .pagination { display: block; } .index-s7 .pagination span { width: 6px; height: 6px; margin-top: 0 2px; } .index-s7 .more-box { margin-top: -1rem; } .index-s8 { padding-top: 8rem; } .index-s8 .follow { padding: 0 5%; } .index-s8 .follow .box { margin-top: 2rem; } .index-s8 .items { bottom: 4rem; } .index-s8 .item { margin-right: 2px; } .index-s8 .item:nth-of-type(4n-3) { width: 80vw; height: 53vw; } .index-s8 .item:nth-of-type(even) { width: 53vw; height: 53vw; } .index-s8 .item:nth-of-type(4n-1) { width: 53vw; height: 53vw; } .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(1), .index-s8 .item:nth-of-type(even) .img-box:nth-of-type(2) { width: calc(50% - 1px); } .index-s8 .item:nth-of-type(even) .img-box { height: calc(50% - 1px); } .index-s8 .bg-img img { height: 80vw; object-fit: cover; } .index-s9 { height: auto; padding: 8rem 0; } .index-s9 .txt-box { padding: 0 2rem; } .index-s9 .txt-box a { margin-top: 4rem; } .research-s6 li.flex { display: block; } .research-s6 li.flex .pic { width: 100%; } .research-s6 li.flex .flex-1 { width: 100%; padding: 2rem 0 0; } .news .search-content.flex { display: block; } .news .search-content.flex .search, .news .search-content.flex .data-search { width: 100%; } .news .search-content.flex .data-search { margin: 1.5rem 0 0; } .news-s3 { padding: 4rem 5%; } .news .public-sidebar { position: static; width: 100%; padding: 0; } .news .subnav { width: 100%; max-width: 100%; } .news .subnav .mt20 a { display: inline-block; vertical-align: top; } .news .news-content { width: 100%; border: none; padding: 0; } .news-s3 .gallery li { padding: 2rem 0; } .news-s3 .news-content li .time { top: 2rem; } .news-s3 .gallery li .title { margin: 2rem 0 0 0; line-height: 1.2; } .news-s3 .gallery { margin-bottom: 2rem; } .news .public-sidebar .tags { width: 100%; max-width: 100%; } .news .public-sidebar .tags .con { padding-left: 0; display: block; } .news .public-sidebar .tags .con a { padding: 0 2rem; display: inline-block; vertical-align: top; } .news-s3 .first { padding: 2rem 0; } .news-s3 .first .pic { margin-right: 0; } .news-s3 .activity li { padding: 2rem 0; } .news-s3 .activity li .pic { width: auto; } .news-s4 .a-block { padding: 2rem 5% 4rem; } .news-s4 .content { padding: 0; } .news-s4 .info-con1 { padding: 2rem; } .news-s4 .info-con1 .info { display: block; } .news-s4 .info-con1 .pic { width: 12rem; height: 12rem; } .news-s4 .info-con1 .f36 { margin-top: 1.5rem; width: 100%; padding-left: 0; font-size: 1.6rem; line-height: 1.2; } .news-s4 .info-con1 .f18 { margin-top: 1.5rem; line-height: 1.5; } .news-s4 .info-con2 { padding: 2rem; } .news-s4 .info-con2 .pic { width: 12rem; height: 12rem; margin-left: 0; } .news-s4 .info-con2 .f36 { margin: 1.5rem 0; text-align: left; font-size: 1.6rem; } .news-s4 .info-con2 .f18 { line-height: 1.5; } .news-s4 .info-text { padding: 2rem 2rem 2rem 9rem; font-size: 1.4rem; line-height: 1.2; min-height: auto; } .news-s4 .info-text:before { left: 2rem; margin-top: -2.5rem; } .news-s4 .info-con1:before, .news-s4 .info-con2:before, .news-s4 .info-text:before { width: 5rem; height: 5rem; } .news-s4 .recommend .dp-con { padding: 2rem 2rem 0; } .news-s4 .recommend .tabs span { padding-bottom: 2rem; } .news-s4 .recommend .tabs span:after { height: 2px; } .news-s4 .recommend li { width: 100%; margin: 2rem 0 0; } .news-s4 .recommend li:nth-of-type(1) { margin-top: 0; } .news-s4 .recommend li .txt-con { padding: 1.5rem 0 0; } .news-s4 .recommend li .tag { margin-top: 1.5rem; } .news-s4 .title-info .info .tag { display: block; margin: 1.5rem 0 0; } .news-s4 .public-sidebar { display: none; } } @media screen and (max-width: 481px) { .campus-s9 .items { column-count: 1; } .research-s5 .item .box { align-items: flex-start; } .research-s5 .item .img-box { width: 12rem; } .research-s5 .item .txt-box { width: calc(100% - 12rem); } .index-s8 .bg-img img { height: 110vw; } }