html { font-size: 20px; } body { font-size: 1rem; } .inner { max-width: 1300px; margin: 0 auto; position: relative; } .container { overflow: auto; position: relative; /* padding-bottom: 137px; */ min-height: 100%; min-width: 1280; } /* .img-box { top:0; } */ nav.mobile-menu { display: none; position: fixed; right: 0; top: 0; bottom: 0; background-color: #fff; z-index: 10; width: 200px; overflow-y: auto; } nav.mobile-menu * { touch-action: auto !important; } nav.mobile-menu .mobile-menu-wrap { overflow-y: auto; position: relative; height: auto; } nav.mobile-menu .mobile-menu-wrap .mobile-menu-group { position: relative; height: auto; } nav.mobile-menu .mobile-menu-wrap .close-btn { position: absolute; right: 24px; top: 16px; width: 24px; height: 24px; background: url("../images/close@3x.png") no-repeat center/cover; } nav.mobile-menu .mobile-menu-wrap ul.depth1 { padding-top: 56px; text-align: left; } nav.mobile-menu .mobile-menu-wrap ul.depth1 a.depth1-txt { display: inline-block; width: 100%; line-height: 60px; padding: 0 24px; font-size: 18px; letter-spacing: -0.4px; color: #121517; } /* nav.mobile-menu .mobile-menu-wrap ul.depth1 a.depth1-txt.toggle { background: url("../images/drop.png") no-repeat center right 24px/24px 24px; } nav.mobile-menu .mobile-menu-wrap ul.depth1 a.depth1-txt.toggle.on { background: url("../images/up.png") no-repeat center right 24px/24px 24px; } */ nav.mobile-menu .mobile-menu-wrap ul.depth1 a.depth1-txt.on~ul.depth2 { display: block; } nav.mobile-menu .mobile-menu-wrap ul.depth1 ul.depth2 { padding: 8px 0; background-color: #f8f9fa; display: none; } nav.mobile-menu .mobile-menu-wrap ul.depth1 ul.depth2 a { line-height: 46px; padding: 0 24px; font-size: 14px; letter-spacing: -0.31px; color: #495057; width: 100%; } /* nav.mobile-menu .mobile-menu-wrap .mobile__menu__info { margin: 0 24px; border-top: 1px solid #ccc; padding-top: 15px; font-size: 0; } nav.mobile-menu .mobile-menu-wrap .mobile__menu__info .menu-box { display: inline-block; vertical-align: middle; } nav.mobile-menu .mobile-menu-wrap .mobile__menu__info .menu-box+.menu-box { margin-left: 14px; } nav.mobile-menu .mobile-menu-wrap .mobile__menu__info a { display: inline-block; line-height: 18px; font-size: 12px; padding: 0; } */ header { position: absolute; top: 0; left: 0; right: 0; z-index: 10; } header .header__wrap { position: relative; margin: 0 auto; height: 144px; max-width: 1600px; background-color: #0c64d2; } header .header__wrap .logo { position: absolute; left: 110px; top: 45px; z-index: 10; } header .header__wrap .logo a { /* width: 291px; height: 53px; */ width: 14.55rem; height: 2.65rem; background: url("../images/logo.png") no-repeat center/cover; } nav.gnb a { color: #fff; } .main-menu { text-align: center; padding-left: 400px; } .menu-item { margin-left: 30px; margin-top: 75px; display: inline-block; position: relative; white-space: nowrap; } .menu-item > a { display: block; font-size: 24px; padding: 5px 5px 25px; margin-bottom: 7px; } .menu-item > a.on { color: #ffe800; text-align: center; margin-bottom: 7px; } .menu-item > a:after { content: ""; position: absolute; left: 0; bottom: -3px; width: 0; left: 50%; height: 2px; background: #fff; transition: all 0.3s; } .menu-item > a.on::after { width: 100%; left: 0; z-index: 10; } .menu-sub { position: absolute; text-align: center; opacity: 0; pointer-events: none; } a.on~ .menu-sub { background: #0c64d2; opacity: 1; font-size: 20px; pointer-events: auto; transition: all, 0.3s; position: absolute; width: 100%; } .menu-sub li { line-height: 35px; } .menu-sub li a:hover { color: #ffe800; } .menu-sub li a:hover:before { content: '▶ '; font-size: 10px; line-height: -20px; position: absolute; left: 10px; } nav.spot { position: absolute; right: 107px; top: 0; } nav.spot ul { display: flex; text-align: center; align-items: center; justify-content: center; } nav.spot ul li { margin-left: 2px; width: 165px; height: 45px; padding-top: 7px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; background-color: #d9d9d9; box-sizing: border-box; } nav.spot ul li a { font-size: 18px; } nav.spot ul li:hover { background-color: #dbf0ff; } nav.spot a { display: inline-block; width: 100%; color: #000; font-size: 18px; } .wrapper {} section.main__page__visual { max-width: 1600px; margin: 0 auto; } section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide { position: relative; } section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide .img-box {} section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide .img-box img { width: 100%; } section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide .txt-box { position: absolute; left: 75%; top: 80%; transform: translate(-50%, -50%); white-space: nowrap; text-align: center; } section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide .txt-box .main-txt { color: #fff; /* font-family: "Barlow"; */ font-size: 40px; text-shadow: 0 0 5px rgba(0, 0, 0, 0.63); font-weight: 400; } section.main__page__visual .swiper-container .swiper-wrapper .swiper-slide .txt-box .sub-txt { text-shadow: 0 0 10px rgba(0, 0, 0, 0.8); font-size: 25px; line-height: 34px; color: #fff; padding-top: 15px; } section.main__page__visual .swiper-container .swiper-pagination { bottom: 87px; } section.main__page__visual .swiper-container .swiper-pagination-bullet { width: 20px; height: 20px; border: 3px solid #fff; background-color: transparent; opacity: 1; } section.main__page__visual .swiper-container .swiper-pagination-bullet-active { background-color: #fff; } section.main__info__icon { margin: 80px 0 60px; } section.main__info__icon .icon-wrapper { height: 137px; width: 100%; font-size: 21px; display: flex; /* text-align: center; */ /* align-items: center; */ /* vertical-align: middle; */ /* justify-content: center; */ /* position: relative; */ /* justify-content: space-around; */ } .apply-icon { width: 25%; height: 137px; position: relative; border-top-left-radius: 25px; border-bottom-left-radius: 25px; background: #a5d9ff; display: flex; align-items: center; justify-content: center; transition: all 0.3s; } .apply-icon div > a { padding-left: 10px; transition: all 0.3s; } .apply-icon:hover { background: #d6eeff; } .apply-icon:hover { background: #d6eeff; } .apply-icon a:hover { color: #cc9900; font-size: 25px; } .apply-icon a:hover + div > a { color: #cc9900; font-size: 25px; } .apply-icon::after { content: ''; height: 50%; width: 1px; position: absolute; right: 0; top: 25%; background-color: #73a5cb; } .education-icon { /* display: inline-block; */ width: 25%; height: 137px; position: relative; background: #a5d9ff; display: flex; align-items: center; justify-content: center; transition: all 0.3s; } .education-icon div > a { padding-left: 10px; transition: all 0.3s; } .education-icon:hover { background: #d6eeff; } .education-icon a:hover { color: #cc9900; font-size: 25px; } .education-icon > a:hover + div > a { color: #cc9900; font-size: 25px; } .education-icon:after { content: ''; height: 50%; width: 1px; position: absolute; right: 0; top: 25%; background-color: #73a5cb; } .bmc-icon { display: inline-block; height: 137px; width: 25%; position: relative; background: #a5d9ff; display: flex; align-items: center; justify-content: center; transition: all 0.3s; } .bmc-icon div > a { padding-left: 10px; transition: all 0.3s; } .bmc-icon:hover { background: #d6eeff; } .bmc-icon a:hover { color: #cc9900; font-size: 25px; } .bmc-icon > a:hover + div > a { color: #cc9900; font-size: 25px; } .bmc-icon:after { content: ''; height: 50%; width: 1px; position: absolute; right: 0; top: 25%; background-color: #73a5cb; } .community-icon { display: inline-block; height: 137px; width: 25%; position: relative; border-top-right-radius: 25px; border-bottom-right-radius: 25px; background: #a5d9ff; display: flex; align-items: center; justify-content: center; transition: all 0.3s; } .community-icon div > a { padding-left: 10px; transition: all 0.3s; } .community-icon:hover { background: #d6eeff; } .community-icon a:hover { color: #cc9900; font-size: 25px; } .community-icon > a:hover + div > a { color: #cc9900; font-size: 25px; } /* .community-icon div > a:hover { color:#cc9900; font-size:28px; } */ /* .community-icon div > a { display: inline-block; width: 100%; transition: all 0.3s; } */ section.main__info__koica { margin-bottom: 60px; } section.main__info__koica .koica-wrapper { display: flex; align-items: center; justify-content: center; height: 288px; font-size: 21px; /* position: relative; */ /* padding-top: 100%; */ /* overflow: hidden; */ } .koica-wrapper .info-peru1 { display: inline-block; max-width: 50%; } .koica-wrapper .info-peru1 h2 { color: #383838; padding: 20px; } .koica-wrapper .info-peru1 p { padding: 20px; word-break: keep-all; color: #6c6c6c; } .koica-wrapper .info-peru2 { max-width: 80%; height: 288px; border-top-right-radius: 25px; border-bottom-right-radius: 25px; overflow: hidden; } .koica-wrapper .info-peru2 a { opacity: 1; transition: all 0.3s ease 0s; overflow: hidden; } .koica-wrapper .info-peru2 a:hover { box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); } section.main__info__con__inha { padding-bottom: 38px; } .con-inha-wrapper { display: flex; align-items: center; justify-content: center; } .consitech-wrapper { width: 48%; display: flex; align-items: center; border-radius: 25px; margin-right: 20px; background: #f0f0f0; } .consitech-wrapper:hover { background: #e4f2fc; } .consitech-wrapper:hover h2 { color: #0c64d2; } .con-inha-wrapper h2 { color: #383838; font-size: 32px; } .con-inha-wrapper p { color: #6c6c6c; font-size: 21px; } .consitech-img { display: inline-block; padding: 60px; } .consitech-txt { padding: 10px 5px; display: inline-block; word-break: keep-all; } .inha-wrapper { width: 48%; display: flex; align-items: center; border-radius: 25px; margin-left: 20px; background: #f0f0f0; } .inha-wrapper:hover { background: #e4f2fc; } .inha-wrapper:hover h2 { color: #0c64d2; } .inha-img { display: inline-block; padding: 60px; } .inha-txt { padding: 10px 5px; display: inline-block; word-break: keep-all; } section.main__info__gcc__n15 { padding-bottom: 67px; } .gcc-n15-wrapper { display: flex; align-items: center; justify-content: center; } .gcc-wrapper { width: 48%; display: flex; align-items: center; border-radius: 25px; margin-right: 20px; background: #f0f0f0; } .gcc-wrapper:hover { background: #e4f2fc; } .gcc-wrapper:hover h2 { color: #0c64d2; } .gcc-n15-wrapper h2 { color: #383838; font-size: 32px; } .gcc-n15-wrapper p { color: #6c6c6c; font-size: 21px; } .gcc { display: inline-block; padding: 60px; } .gcc-txt { padding: 10px 5px; display: inline-block; word-break: keep-all; } .n15-wrapper { width: 48%; display: flex; align-items: center; border-radius: 25px; margin-left: 20px; background: #f0f0f0; } .n15-wrapper:hover { background: #e4f2fc; } .n15-wrapper:hover h2 { color: #0c64d2; } .n15-img { display: inline-block; padding: 60px; } .n15-txt { padding: 10px 5px; display: inline-block; word-break: keep-all; } section.main__page__academy__info { padding: 74px 0 24px; margin: 0 auto; background: #149bff; max-width: 1600px; position: relative; } section.main__page__academy__info .ai { position: absolute; left: 7%; top: 20px; font-size: 32px; } section.main__page__academy__info .swiper-container { max-width: 1300px; position: relative; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a { display: block; position: relative; width: 100%; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a:hover .hover-box { display: block; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a .img-box { position: relative; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide .img-box img { width: 100%; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a .hover-box { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.4); } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a .hover-box .hover-txt-box { position: absolute; top: 45%; transform: translateY(-50%); width: 100%; font-size: 40px; font-weight: 400; text-align: center; color: #fff; line-height: 48px; } section.main__page__academy__info .swiper-container .swiper-wrapper .swiper-slide a .txt-box { color: #414042; padding: 0 10px; font-size: 18px; line-height: 24px; margin-top: -20px; } section.main__page__academy__info .swiper-control { position: absolute; left: 0; right: 0; top: 45%; transform: translateY(-50%); z-index: 10; } section.main__page__academy__info .swiper-control a { width: 24px; height: 48px; display: inline-block; vertical-align: middle; outline: none; } section.main__page__academy__info .swiper-control a.prev-btn { position: absolute; left: 85px; top: 10px; background: url("../images/ic_swiper_prev.png") no-repeat center/cover; } section.main__page__academy__info .swiper-control a.next-btn { background: url("../images/ic_swiper_next.png") no-repeat center/cover; position: absolute; right: 85px; top: 10px; } section.main__info__board { padding: 60px 0 50px; max-width: 1600px; background: #f0f0f0; margin: 0 auto; } section.main__info__board .board__list__wrap { display: flex; } .list__box.l1 { display: inline-block; width: 40%; } .list__box.l2 { display: inline-block; width: 49%; padding-left: 130px; border-left: 1px solid #949494; } .list__box.l1 .board-tit { color: #414042; font-size: 32px; margin-bottom: 14px; padding-left: 20px; } .list__box.l2 .board-tit { background: #414042; font-size: 32px; padding: 3px 20px 2px; } .board-con { padding: 20px; overflow: hidden; } .board-con ul li a { display: block; position: relative; /* padding-right: 65px; */ /* padding-right: 1px; */ /* text-overflow: ellipsis 사용하기 위함 */ } .board-con ul li a:hover .date-txt, .board-con ul li a:hover .subject-txt { color: #383838; font-weight: 600; text-decoration: underline; } .board-con ul li a .subject-txt { text-overflow: ellipsis; overflow: hidden; max-width: 100%; white-space: nowrap; line-height: 40px; padding-right: 60px; color: #6c6c6c; } .board-con ul li a .subject-txt.system { padding-right: 5px; } .board-con ul li a .subject-txt.system:after { content: '▶'; position: absolute; top: 2px; width: 2px; height: 2px; color: #9a9a9a; padding-left: 30px; } /* .board-con ul li a .subject-txt.new:after { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } */ .board-con ul li a .date-txt { /* display: inline-block; */ /* vertical-align: middle; */ position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: #6c6c6c; /* font-size: 21px; */ /* padding-right: 25px; */ /* margin-left: 10px; */ } .tab_content { text-align: left; position: relative; } /* input을 안보이게 처리 */ input[type="radio"] { display: none; } /* 버튼 공통 속성 */ input[type="radio"] + label { display: inline-block; padding: 3px 20px 0; margin-bottom: 14px; background: #f0f0f0; color: #999; font-size: 32px; cursor: pointer; } /* 선택된 버튼속성 */ input[type="radio"]:checked + label { background: #383838; color: #ffffff; position: relative; } input[type="radio"]:checked + label::after { content: ''; position: absolute; left: 50%; top: 40px; transform: translateX(-50%); width: 0; height: 0; border-width: 10px; border-style: solid; border-color: #383838 transparent transparent transparent; } /* 컨텐츠박스 공통 속성 */ .board-con.con1, .con2 { display: none; text-align: left; padding: 20px; box-sizing: border-box; } /* 인풋에 체크가 해당 요소보이게 설정 */ input[id="tab01"]:checked ~ .con1 { display: block; } input[id="tab02"]:checked ~ .con2 { display: block; } section.main__page__photo__zone { padding: 38px 0 24px; margin: 75px auto; max-width: 1600px; position: relative; } section.main__page__photo__zone .ai { position: absolute; left: 7%; top: -25px; color: #383838; font-size: 32px; } section.main__page__photo__zone .swiper-container { max-width: 1300px; position: relative; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a { display: block; position: relative; width: 100%; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a:hover .hover-box { display: block; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a .img-box { position: relative; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide .img-box img { width: 100%; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a .hover-box { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.4); } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a .hover-box .hover-txt-box { position: absolute; top: 45%; transform: translateY(-50%); width: 100%; font-size: 40px; font-weight: 400; text-align: center; color: #fff; line-height: 48px; } section.main__page__photo__zone .swiper-container .swiper-wrapper .swiper-slide a .txt-box { color: #414042; padding: 0 10px; font-size: 18px; line-height: 24px; margin-top: -20px; } section.main__page__photo__zone .swiper-control { position: absolute; left: 0; right: 0; top: 45%; transform: translateY(-50%); z-index: 10; } section.main__page__photo__zone .swiper-control a { width: 24px; height: 48px; display: inline-block; vertical-align: middle; outline: none; } section.main__page__photo__zone .swiper-control a.prev-btn2 { position: absolute; left: 85px; top: 10px; background: url("../images/ic_swiper_prev.png") no-repeat center/cover; } section.main__page__photo__zone .swiper-control a.next-btn2 { background: url("../images/ic_swiper_next.png") no-repeat center/cover; position: absolute; right: 85px; top: 10px; } footer .footer__wrap { margin: 0 auto; text-align: center; padding: 80px 0 60px; } footer .footer__wrap p { color: #3b3b3b; font-size: 16px; } /* ==================================================================================== */ /* article.page__tit__info .page__tit .tit-txt.type1:after { content: ''; position: absolute; left: -2px; right: -10px; bottom: -10px; height: 15px; background-color: #4bb9e6; } */ article.table__search__form { position: relative; font-size: 0; margin-bottom: 20px; height: 40px; } /* article.table__search__form .inner { height: 100%; } */ article.table__search__form.division { margin: 17px 0; } article.table__search__form .sbox.long { width: 260px; } article.table__search__form .sbox+.sbox { margin-left: 10px; } /* article.table__search__form .input__form { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } article.table__search__form .input__form .tbox { display: inline-block; vertical-align: middle; width: 290px; border: 1px solid #989898; } article.table__search__form .input__form .form-btn { display: inline-block; vertical-align: middle; border-radius: 5px; line-height: 40px; color: #fff; text-align: center; width: 100px; font-size: 16px; margin-left: 6px; } */ /* article.table__search__form .input__form .form-btn.type1 { background: url("../img/img_btn_bg1.png"); } article.table__search__form .input__form .form-btn.type2 { background: url("../img/img_btn_bg2.png"); } */ section.sub__page__visual .img-box { max-width: 1600px; margin: 0 auto; } section.sub__page__visual .img-box img { width: 100%; } article.nav__display { position: absolute; right: 0; top: -50%; transform: translateY(-50%); } article.nav__display .nav-txt { position: relative; font-size: 12px; } article.nav__display .nav-txt+.nav-txt { margin-left: 15px; } article.nav__display .nav-txt+.nav-txt:after { content: '>'; font-size: 12px; position: absolute; top: 50%; left: -12px; transform: translateY(-50%); } article.page__tit__info { padding: 80px 0 0; } article.page__tit__info .page__tit { position: relative; margin-bottom: 40px; } article.page__tit__info .page__tit .tit-txt { font-size: 40px; letter-spacing: -0.4px; position: relative; color: #0b63d0; } article.page__tit__info .page__des { font-size: 21px; /* letter-spacing: -0.23px; */ color: #666666; word-break: keep-all; /* padding: 10px */ margin: 0 5px; } article.page__tit__info .page__des p { padding: 0.5rem 0 1rem; } article.page__tit__info .page__des h1 { padding-bottom: 30px; text-align: left; font-size: 45px; color: #383838; } article.page__tit__info .page__des h2 { color: #383838; margin: 20px 0 15px; } article.page__tit__info .page__des li { color: #0b63d0; } article.page__tit__info .page__des .mission { float: left; padding: 0 25px 20px 0; width: 28%; } article.page__tit__info .page__des .vision { display: inline; padding: 0 20px 20px 0; width: 50%; } article.page__tit__info .page__des h3 { padding-top: 30px; font-weight: bold; } article.page__tit__info .page__des .st { font-family: 'Bahnschrift'; } article.page__tit__info .page__des #img1 { float: right; padding-left: 40px; /* max-width: 100%; height: auto; */ } .vol_sch_box { display: flex; justify-content: center; /* align-items: center; */ text-align: center; } .vol_sch_box .vol_txt { text-align: left; /* word-break: break-all; */ } .vol_sch_box .sch_txt { text-align: left; /* word-break: break-all; */ } .vol_box { display: inline-block; width: 50%; padding-right: 5px; text-align: center; display: table; } .sch_box { display: inline-block; width: 50%; padding-left: 5px; } .vol_box_img { /* padding-top: 10px; padding-bottom: 20px; max-width: 100%; height: auto; */ width: 256px; height: 197px; overflow: hidden; margin: 0 auto; /* display: table-cell; vertical-align: middle; */ } .vol_box_img img { width: 100%; height: 100%; object-fit: scale-down; } .sch_box_img { /* padding-bottom: 10px; max-width: 100%; height: auto; */ width: 256px; height: 197px; overflow: hidden; margin: 0 auto; } .sch_box_img img { width: 100%; height: 100%; object-fit: scale-down; } .vision_img { padding-bottom: 15px; max-width: 100%; height: auto; } .page__des .swiper-container { padding-top: 20px; max-width: 1600px; position: relative; } .page__des .swiper-container { max-width: 1300px; position: relative; } .page__des .swiper-container .swiper-wrapper .swiper-slide a { display: block; position: relative; width: 100%; } .page__des .swiper-container .swiper-wrapper .swiper-slide a:hover .hover-box { display: block; } .page__des .swiper-container .swiper-wrapper .swiper-slide a .img-box { position: relative; } .page__des .swiper-container .swiper-wrapper .swiper-slide .img-box img { width: 100%; } .page__des .swiper-container .swiper-wrapper .swiper-slide a .hover-box { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.4); } .page__des .swiper-container .swiper-wrapper .swiper-slide a .hover-box .hover-txt-box { position: absolute; top: 45%; transform: translateY(-50%); width: 100%; font-size: 40px; font-weight: 400; text-align: center; color: #fff; line-height: 48px; } .page__des .swiper-container .swiper-wrapper .swiper-slide a .txt-box { color: #414042; padding: 0 10px; font-size: 18px; line-height: 24px; margin-top: -20px; } .page__des .swiper-control { position: absolute; left: 0; right: 0; top: 45%; transform: translateY(-50%); z-index: 10; } .page__des .swiper-control a { width: 24px; height: 48px; display: inline-block; vertical-align: middle; outline: none; } .page__des .pz { position: relative; } .page__des .swiper-control a.prev-btn2 { position: absolute; left: -25px; top: 10px; background: url("../images/ic_swiper_prev.png") no-repeat center/cover; } .page__des .swiper-control a.next-btn2 { background: url("../images/ic_swiper_next.png") no-repeat center/cover; position: absolute; right: -25px; top: 10px; } div.refRoomTable table th { background-color: #00a8ff; padding: 12px 10px; color: white; } div.refRoomTable table tbody tr td { padding: 13px 10px; text-align: center; } div.refRoomTable table tbody tr { border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; } div.refRoomTable table tbody tr:first-child { /* padding: 13px 150px; */ border-top: 1px solid #cccccc; } div.refRoomTable table tbody tr:last-child { /* padding: 13px 50px; */ border-bottom: 1px solid #cccccc; } /* ============================== */ div.refRoomDoc table tbody tr td { text-align: center; padding: 13px 10px; table-layout: fixed; } div.refRoomDoc table th { background-color: #00a8ff; padding: 12px 20px; color: white; white-space: nowrap; } div.refRoomDoc table tbody tr { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } div.refRoomDoc table tbody tr td:nth-child(2) { text-align: left; white-space: nowrap; } div.refRoomDoc table tbody tr:nth-child(3) td { text-align: left; padding: 30px; line-height: 28px; } .pbox_wrap { display: flex; font-size: 15px; } .pbox { text-align: left; overflow: hidden; padding: 20px; } .pbox img { max-width: 100%; height: 292px; object-fit: cover; overflow: hidden; } /* Useful Classes */ .xy-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .transition { transition: all 350ms ease-in-out; } .r-3-2 { width: 100%; padding-bottom: 66.667%; background-color: #ddd; } .image-holder { background-size: cover; background-position: center center; background-repeat: no-repeat; } /* Main Styles */ .gallery-wrapper { position: relative; overflow: hidden; } .gallery { position: relative; white-space: nowrap; font-size: 0; } .item-wrapper { cursor: pointer; width: 23%; /* arbitrary value */ display: inline-block; background-color: white; } .gallery-item { opacity: 0.5; } .gallery-item.active { opacity: 1; } .controls { font-size: 0; border-top: none; } .move-btn { display: inline-block; width: 50%; border: none; color: #ccc; background-color: transparent; padding: 0.2em 1.5em; } .move-btn:first-child { border-right: none; } .move-btn.left { font-size: 40px; cursor: w-resize; } .move-btn.right { font-size: 40px; cursor: e-resize; } .oz_intro { } .out_box { display: flex; max-width: 100%; /* width:100%; */ /* font-size: 15px; */ /* flex-wrap: wrap; */ } .box_line { /* max-width: 100%; */ /* height: 1235px; */ width: 50%; padding-left: 40px; /* padding-left: 26px; padding-bottom: 46px; */ object-fit: contain; /* mix-blend-mode: multiply; */ border: solid 20px #00a8ff; /* background-color: #00a8ff; */ display: inline-block; } .box_line img { padding-top: 20px; padding-bottom: 20px; } .gp { margin: 0 40px 25px 0; width: 100%; height: auto; margin-bottom: 60px; } .gp > img { max-width: 100%; height: auto; } .b_txt { max-width: 100%; height: auto; color: #333333; word-break: keep-all; padding-bottom: 60px; } .box_line.one { border-right: none; padding: 0 20px; } .box_line.two { border-left: none; background-image: linear-gradient(to bottom, #00a8ff 10%, rgba(255, 255, 255, 0) 0%); background-position: left; background-size: 3px 15px; background-repeat: repeat-y; } .page__des.concytec img { padding-top: 94px; } .out_box_wrap { padding: 20px 0; /* margin:0 auto; */ /* text-align: center; */ } .in_box_wrap { display: flex; flex-direction: row; text-align: center; align-items: center; width: 100%; flex-wrap: wrap; justify-content: center; } .box_wrap { display: inline-block; width: 32%; height: 580px; /* padding-top: 40%; */ border: 1px solid#dadada; box-sizing: border-box; margin: 5px; position: relative; word-break: keep-all; } .box_wrap img { max-width: 100%; height: auto; } .box_wrap .el { box-sizing: border-box; max-width: 100%; } .box_wrap .el.n2 { position: absolute; top: 40%; padding: 0 10px; } .box_wrap .el.n3 { position: absolute; top: 85%; left: 50%; transform: translateX(-50%); } .a3 .n1 { position: absolute; width: 100%; top: 5%; left: 50%; transform: translateX(-50%); } .a4 .n1 { position: absolute; width: 100%; top: 5%; left: 50%; transform: translateX(-50%); } .a5 .n1 { position: absolute; width: 100%; top: 10%; left: 50%; transform: translateX(-50%); } .a6 .n1 { position: absolute; width: 100%; top: 7%; left: 50%; transform: translateX(-50%); } .a7 .n1 { position: absolute; width: 100%; top: 4%; left: 50%; transform: translateX(-50%); } .a8 .n1 { position: absolute; width: 100%; top: 5%; left: 50%; transform: translateX(-50%); } .page__des.ucsm { position: relative; /* text-align: center; */ } .page__des.ucsm .ucsm_img1 > img { float: right; padding: 0 0 30px 30px; } .ucsm_chart img { max-width: 100%; } /* dot new -> */ .dot_wrap { padding-left: 15px; /* list-style-position: outside; */ } .dot_wrap li { list-style-type: disc; color: #0b63d0; } .dot_wrap span { position: relative; left: -5px; } .dot_wrap li span > p { color: #666666; padding: 0 !important; } .dot_wrap li > p { color: #666666; } .dot_wrap li span > strong { color: #666666; } /* <- */ /* dot old -> */ .ourgoals { display: flex; align-items: center; } .ourgoals .goals_img { display: inline-block; flex: 1; } .ourgoals .goals_txt_box { display: inline-block; flex: 2; } .goals_txt_wrap { display: flex; } .dot_box { display: inline-block; } .dot { display: inline-block; width: 8px; height: 8px; background-color: #0b63d0; border-radius: 70%; transform: translateY(-50%); margin-right: 10px; margin-left: 10px; } .dot_txt { display: inline-block; color: #666666; } /* .dot_txt li { display: inline-block; } */ .dot_txt p { display: inline-block; padding-top: 0 !important; } /* <- */ .inha_txt_img { float: right; padding: 0 0 25px 25px; } .list_college { padding-left: 25px; } .list_college li { list-style: disc; } .report { display: flex; align-items: center; background-color: #f0f0f0; line-height: 30px; border-radius: 25px; max-width: 100%; } .report .lf { flex: 1; background: url("../images/dot_img.png") right no-repeat; padding-left: 10px; } .report .rh { flex: 1; padding-left: 10px; } .report p { display: inline-block; padding: 20px 0 !important; } .ar { /* margin-left: 10px; */ } .strategy { display: flex; flex-wrap: wrap; } .stg_box { display: inline-block; width: 305px; height: 110px; border-radius: 25px; background: #e4f2fc; position: relative; margin: 5px; } .stg_box p { padding-left: 20px !important; display: inline-block; position: absolute; top: 50%; transform: translateY(-50%); } .step_in_box { display: flex; flex-wrap: wrap; /* justify-items: center; */ /* align-items: center; */ /* text-align: center; */ } .step_in_box .step { display: inline-block; margin: 2px; } .core_pro { display: flex; flex-wrap: wrap; } .core_box { flex: 1; } .sub_gccei img { float: right; padding: 0 0 25px 25px; } .gccei_vision_mission { max-width: 55%; height: auto; } .gccei_vision_mission img { max-width: 100%; } .gccei_techno_valley { display: flex; flex-wrap:wrap; } .gccei_box { /* flex:1; */ padding: 10px; } .gccei_techno_valley img { object-fit: cover; max-width: 410px; height: auto; } .gccei_leadership { display: flex; flex-wrap:wrap; } .leadership_box { /* flex:1; */ padding: 10px; } .gccei_leadership img { object-fit: cover; max-width: 300px; height: auto; } .n15_txt_img { float: right; padding: 0 0 25px 25px; } .achievements { display: flex; text-align: center; flex-wrap: wrap; } .achievements p { padding: 10px; } .n15_acc { display: flex; flex-wrap: wrap; } .n15_acc div { margin: 10px; } .n15_acc img { max-width: 300px; height: auto; } .open_inno { display: flex; flex-wrap: wrap; } .open_inno div { padding: 10px; } .open_inno img { max-width: 300px; height: auto; } .n15_company_img img { max-width: 98%; height: auto; } .staff img { margin: 10px; } .directors_box1 { display: inline-block; width: 325px; height: 100px; background: #05a7f3; position: relative; text-align: center; margin: 10px; } .directors_box1 p { padding-top: 15px; } .directors_box2 { width: 325px; height: 50px; background: #333333; position: absolute; top: 50px; left: 0; z-index: 10; color: #fff; } .page__des.ucsp .ucsp_img1 img { float: right; padding: 0 0 25px 25px; } .page__des.unalm .unalm_img1 img { float: right; padding: 0 0 25px 25px; } .Manager_box1 { /* display: inline-block; */ width: 325px; height: 100px; background: #05a7f3; position: relative; text-align: center; margin: 20px 30px 20px 10px; } /* .Manager_box1 p { padding-top: 15px; } */ .Manager_box2 { width: 325px; height: 50px; background: #333333; position: absolute; top: 50px; left: 0; z-index: 10; color: #fff; } .unalm_office { display: flex; } .unalm_2 { background: #e4f2fc; padding: 15px 30px; } .unalm_2 li { list-style: disc; color: #666666; } .moto { color: #0b63d0; } .uni_1 { display: flex; flex-wrap: wrap; } .uni_office .codi_box { display: inline-block; background: #05a7f3; width: 610px; height: 120px; margin: 10px; color: #fff; position: relative; } .uni_office .codi_box p { padding-top: 0 !important; } .uni_office .in_codi_box { background: #333333; color: #fff; top: 70px; height: 50px; width: 100%; position: absolute; } .uni_office p { position: absolute; top: 10px; text-align: left; left: 20px; } .uni_office span { position: absolute; top: 10px; text-align: right; right: 20px; } .clave { display: flex; } .clave_box { flex: 1; } .unmsm_codi { display: flex; flex-wrap: wrap; justify-content: center; } .unmsm_codi_box { /* flex-shrink: 0; */ background: #e4f2fc; margin: 5px; position: relative; color: #333333; width: 310px; height: 313px; display: flex; justify-content: center; box-sizing: border-box; } .unmsm_codi_box p { padding: 30px 5px; } .unmsm_codi_box2 { /* flex:1; */ position: absolute; width: 100%; height: 60px; background: #07b4ee; color: #fff; bottom: 0; display: flex; align-items: center; justify-content: center; } .unsa_img1 { float: right; padding: 0 0 25px 25px; } .unsa_codi { display: flex; flex-wrap: wrap; justify-content: center; } .unsa_codi_box { /* flex: 1 ; */ background: #e4f2fc; margin: 10px; position: relative; color: #333333; width: 620px; /* max-width: 100%; */ height: 150px; display: flex; box-sizing: border-box; } .unsa_codi_box p { padding: 10px 20px !important; } .unsa_codi_box2 p { padding: 15px 20px !important; } .unsa_codi_box span { position: absolute; right: 20px; } .unsa_codi_box2 { /* flex:1; */ position: absolute; width: 100%; height: 90px; background: #05a7f3; color: #fff; bottom: 0; display: flex; /* align-items: center; */ } .unsa_codi_box3 { position: absolute; width: 100%; height: 46px; background: #555555; color: #fff; bottom: 0; display: flex; align-items: center; } .unt_img_group { display: flex; } .unt_box { flex: 1; margin: 10px; } .unt_img_group_3 { margin: 10px; } .unt_txt_img img { max-width: 100%; height: auto; } .udep_codi { display: flex; flex-wrap: wrap; justify-content: center; /* text-align: center; */ } .udep_codi_box { background: #e4f2fc; margin: 10px; position: relative; color: #333333; width: 300px; height: 448px; display: flex; box-sizing: border-box; overflow: hidden; font-size: 18px; /* flex:1; */ } .udep_codi_box img { width: 100%; height: 307px; object-fit: cover; } .udep_codi_box p { padding: 10px 20px !important; } .udep_codi_box2 p { padding: 5px 20px; } .udep_codi_box span { position: absolute; right: 20px; } .udep_codi_box2 { /* flex:1; */ position: absolute; width: 100%; height: 103px; background: #05a7f3; color: #fff; bottom: 64px; display: flex; /* align-items: center; */ } .udep_codi_box3 { position: absolute; width: 100%; height: 46px; background: #555555; color: #fff; bottom: 0; display: flex; align-items: center; } .udep_codi_box4 { position: absolute; width: 100%; height: 64px; background: #fff; color: #666666; bottom: 0; display: flex; align-items: center; } .unheval_txt_img2 { float: left; padding: 0 25px 5px 0; } .page__des.business .n1 { color: #0fadff; } .page__des.business .par1 { display: flex; } .page__des.business .par1 .chil1 { flex: 1; white-space: nowrap; } .page__des.business .par1 .chil2 { /* flex:1; */ padding-left: 20px; } .page__des.business .par2 { display: flex; align-items: center; /* flex-wrap: wrap; */ /* white-space: nowrap; */ } .page__des.business .par2 .chil1 { padding: 10px; flex: 2; /* font-size: 1.1vw; */ } .page__des.business .par2 .chil2 { flex: 4; /* overflow: hidden; */ padding: 10px; /* width: 50%; */ max-width: 100%; } .page__des.business .par2 .chil2 img { width: 100%; height: 100%; object-fit: cover; } .page__des.business .par3 { display: flex; flex-wrap: wrap; } .page__des.business .par3 .chil1 { padding: 10px; } .page__des.business .par3 .chil2 { padding: 10px; } .page__des.business .par3 .chil3 { padding: 10px; } .page__des.business img { object-fit: cover; width: 100%; } .page__des.business .ict_innovacion_txt_img { text-align: center; } .page__des.business .ict_innovacion_txt_img img { width: auto; }