#wrap {width:100%;overflow-x:hidden !important;} .works-details-sec01 {width: 100%; height: 830px; position: relative;} .works-details-sec01 .txt_box {display:table; width:100%; height:100%;} .works-details-sec01 .txt_box .txt_inwrap {display:table-cell; vertical-align:middle; text-align:center;} .works-details-sec01 .txt_box .ctxt {font-size:24px; color:#fff; letter-spacing:0; -webkit-animation: fade-in-bottom 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s; animation: fade-in-bottom 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s; margin-bottom:0.5em;} .works-details-sec01 .txt_box .btxt {font-size:60px; letter-spacing:-0.04em; line-height:60px; font-weight:bold; color:#fff; margin-bottom:12px; -webkit-animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s; animation: fade-in-bottom 0.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s;} .works-details-sec01 .txt_box .stxt {font-size:14px; line-height:26px; font-weight:400; color:#fff; letter-spacing:0; -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s; animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both 0.5s; margin-top:35px;} .works-details-sec01 .txt_box span {display:inline-block; color:#fff;} .works-details-sec01 .txt_box p {color:#fff;} .works-details-sec01 .txt_box .client {margin-left:30px;} .works-details-sec01 .txt_box p a {color:#fff;} .works-details-sec02 {height:450px; width:100%; padding:135px 40px 0 340px; box-sizing:border-box; position:relative;} .works-details-sec02 .sec-tit {font-size:14px; letter-spacing:0; font-weight:400; color:#323232; position:absolute; top:140px; left:60px;} .works-details-sec02 .works-details-sec02-txt-box {} .works-details-sec02 .works-details-sec02-txt-box .eng-tit {font-size:18px; letter-spacing:0; font-weight:400; color:#303030; margin-bottom:10px;} .works-details-sec02 .works-details-sec02-txt-box .b-tit {font-size:18px; letter-spacing:-0.04em; font-weight:400; color:#303030; line-height:30px; margin-bottom:40px;} .works-details-sec02 .works-details-sec02-txt-box .s-txt {font-size:13px; letter-spacing:-0.04em; font-weight:400; color:#303030; line-height:26px;} .works-details-sec03 {/* padding-bottom:70px; */ background:#fff;} .works-details-sec03 img {/* width:auto; max-width:unset; */} .img-preview .img-frame{position:relative; text-align:center; overflow:hidden;} .c_gray{background:#e8edf1;} /* 삼영이엔씨 */ .works-samyung {background: url('/uxis/si/img/sub/06/works-samyung_bg.jpg') no-repeat center center; background-size: cover;} /* 김병준 레다스 */ .works-kbj {background: url('/uxis/si/img/sub/06/works-kbj_bg.jpg') no-repeat center center; background-size: cover;} /* 수정산 & 백양터널 */ .works-tunnel {background: url('/uxis/si/img/sub/06/works-tunnel_bg.jpg') no-repeat center center; background-size: cover;} /* 기술보증기금 */ .works-kibo {background: url('/uxis/si/img/sub/06/works-kibo_bg.jpg') no-repeat center center; background-size: cover;} /* etax */ .works-etax {background: url('/uxis/si/img/sub/06/works-etax_bg.jpg') no-repeat center center; background-size: cover;} /* 부산일보사 */ .works-bs-news {background: url('/uxis/si/img/sub/06/works-bs-news_bg.jpg') no-repeat center center; background-size: cover;} /* sckcorp */ .works-sckcorp {background: url('/uxis/si/img/sub/06/works-sckcorp_bg.jpg') no-repeat center center; background-size: cover;} /* kobongmin */ .works-kobongmin {background: url('/uxis/si/img/sub/06/works-kobongmin_bg.jpg') no-repeat center center; background-size: cover;} /* yeonje */ .works-yeonje {background: url('/uxis/si/img/sub/06/works-yeonje_bg.jpg') no-repeat center center; background-size: cover;} /* ouvillage */ .works-ouvillage {background: url('/uxis/si/img/sub/06/works-ouvillage_bg.jpg') no-repeat center center; background-size: cover;} .works-details-sec02.ouvillage {margin-top:-48px;} .ouvillage-video-zone {margin-top:130px; padding:0 60px; width:100%; text-align:center; box-sizing:border-box;} .ouvillage-video-zone .video {width:100%; height:845px;} /* famecs */ .works-famecs {background: url('/uxis/si/img/sub/06/works-famecs_bg.jpg') no-repeat center center; background-size: cover;} /* 울산시티투어 */ .works-Ucitytour {background: url('/uxis/si/img/sub/06/works-Ucitytour_bg.jpg') no-repeat center center; background-size: cover;} /* 울산시티투어 앱 */ .works-UcitytourApp {background: url('/uxis/si/img/sub/06/works-UcitytourApp_bg.png') no-repeat center center; background-size: cover;} .works-details-sec03.UcitytourApp {margin-top:-200px} /* 안산대학 */ .works-ansan {background: url('/uxis/si/img/sub/06/works-ansan_bg.jpg') no-repeat center center; background-size: cover;} /* 유바외과 */ .works-uva {background: url('/uxis/si/img/sub/06/works-uva_bg.jpg') no-repeat center center; background-size: cover;} /* UST */ .works-UST {background: url('/uxis/si/img/sub/06/works-UST_bg.jpg') no-repeat center center; background-size: cover;} /* PKVALVE */ .works-pkvalve {background: url('/uxis/si/img/sub/06/works-pkvalve_bg.jpg') no-repeat center center; background-size: cover;} /* 부산서구청 */ .works-bsseogu {background: url('/uxis/si/img/sub/06/works-bsseogu_bg.jpg') no-repeat center center; background-size: cover;} /* 부산과학기술협의회 */ .works-fobst {background: url('/uxis/si/img/sub/06/works-fobst_bg.jpg') no-repeat center center; background-size: cover;} /* LF스퀘어 */ .works-lfsq {background: url('/uxis/si/img/sub/06/works-lfsq_bg.jpg') no-repeat center center; background-size: cover;} /* BNK어울림뱅킹 */ .works-BNK-Banking {background: url('/uxis/si/img/sub/06/works-BNK-Banking_bg.jpg') no-repeat center center; background-size: cover;} /* 한성대기숙사 */ .works-hansung {background: url('/uxis/si/img/sub/06/works-hansung_bg.jpg') no-repeat center center; background-size: cover;} /* 부산시감염병관리지원단 */ .works-bscidc {background: url('/uxis/si/img/sub/06/works-bscidc_bg.jpg') no-repeat center center; background-size: cover;} /* 포스코청암재단 */ .works-postf {background: url('/uxis/si/img/sub/06/works-postf_bg.jpg') no-repeat center center; background-size: cover;} /* 한진해운노조 */ .works-hanjinapp {background: url('/uxis/si/img/sub/06/works-hanjinapp_bg.jpg') no-repeat center center; background-size: cover;} /* DRAXION */ .works-draxion {background: url('/uxis/si/img/sub/06/works-draxion_bg.jpg') no-repeat center center; background-size: cover;} /* 부산지방청 */ .works-bspolice {background: url('/uxis/si/img/sub/06/works-bspolice_bg.jpg') no-repeat center center; background-size: cover;} /* 매나테크코리아 */ .works-mannatech {background: url('/uxis/si/img/sub/06/works-mannatech_bg.jpg') no-repeat center center; background-size: cover;} /* 부산시정비사업 */ .works-dynamic {background: url('/uxis/si/img/sub/06/works-dynamic_bg.jpg') no-repeat center center; background-size: cover;} /* 메디투어부산 */ .works-meditour {background: url('/uxis/si/img/sub/06/works-meditour_bg.jpg') no-repeat center center; background-size: cover;} /* 부경대 수산과학대학 */ .works-pnkufish {background: url('/uxis/si/img/sub/06/works-pnkufish_bg.jpg') no-repeat center center; background-size: cover;} /* 오토닉스 */ .works-autonics {background: url('/uxis/si/img/sub/06/works-autonics_bg.jpg') no-repeat center center; background-size: cover;} /* 인디커넥트 */ .works-bicfest {background: url('/uxis/si/img/sub/06/works-bicfest_bg.jpg') no-repeat center center; background-size: cover;} /* 부산과학축전(19회) */ .works-bsf {background: url('/uxis/si/img/sub/06/works-bsf_bg.jpg') no-repeat center center; background-size: cover;} /* 강원도공공의료 */ .works-gwppi {background: url('/uxis/si/img/sub/06/works-gwppi_bg.jpg') no-repeat center center; background-size: cover;} /* 테크브릿지 */ .works-techbridge {background: url('/uxis/si/img/sub/06/works-techbridge_bg.png') no-repeat center center; background-size: cover;} /* 크랩크랩 */ .works-crabcrab {background: url('/uxis/si/img/sub/06/works-crabcrab_bg.png') no-repeat center center; background-size: cover;} /* 오리엔탈정공 */ .works-opco {background: url('/uxis/si/img/sub/06/works-opco_bg.jpg') no-repeat center center; background-size: cover;} /* 창원대학 */ .works-cwunv {background: url('/uxis/si/img/sub/06/works-cw-unv_bg.jpg') no-repeat center center; background-size: cover;} /* 신안산대학 */ .works-sau {background: url('/uxis/si/img/sub/06/works-sau_bg.jpg') no-repeat center center; background-size: cover;} /* 울산공공보건패밀리 */ .works-upmc {background: url('/uxis/si/img/sub/06/works-upmc_bg.png') no-repeat center center; background-size: cover;} /* 부산과학축전(20회) */ .works-bsf20th {background: url('/uxis/si/img/sub/06/works_bsf20th_bg.jpg') no-repeat center center; background-size: cover;} /* 오늘의 라면 */ .works-oramyun {background: url('/uxis/si/img/sub/06/works_oramyun_bg.png') no-repeat center center; background-size: cover;} /* 인디커넥트 2021 */ .works-bicfest21 {background: url('/uxis/si/img/sub/06/works-bicfest21_bg.png') no-repeat center center; background-size: cover;} /* 한국에너지시험원 */ .works-kel {background: url('/uxis/si/img/sub/06/works-kel_bg.jpg') no-repeat center center; background-size: cover;} /* 부산교통공사 */ .works-bsmetro {background: url('/uxis/si/img/sub/06/works_bsmetro_bg.png') no-repeat center center; background-size: cover;} /* 네이버 채용 */ .works-naver {background: url('/uxis/si/img/sub/06/works_naver_bg.png') no-repeat center center; background-size: cover;} /* 피케이밸브 2022 */ .works-pkvne {background: url('/uxis/si/img/sub/06/works-pkvne_bg.jpg') no-repeat center center; background-size: cover;} /* 부산교육 다모아 */ .works-damoa {background: url('/uxis/si/img/sub/06/works-damoa_bg.jpg') no-repeat center center; background-size: cover;} /* 기장군도시관리공단 */ .works-gijang {background: url('/uxis/si/img/sub/06/works-gijang_bg.jpg') no-repeat center center; background-size: cover;} /* 부산인디커넥트페스티벌22 */ .works-bicfest22 {background: url('/uxis/si/img/sub/06/works-bicfest22_bg.png') no-repeat center center; background-size: 1920px auto; background-position:center top; height:915px} /* 지산학부산 */ .works-tpp {background: url('/uxis/si/img/sub/06/works-tpp_bg.jpg') no-repeat center center; background-size: cover;} /* 위드건강해짐 */ .works-withgym {background: url('/uxis/si/img/sub/06/works-withgym_bg.jpg') no-repeat center center; background-size: cover;} /* 비대면 온라인 플랫폼 */ .works-jobfair {background: url('/uxis/si/img/sub/06/works-jobfair_bg.jpg') no-repeat center center; background-size: cover;} /* iotplex */ .works-iotplex {background: url('/uxis/si/img/sub/06/works-iotplex_bg.png') no-repeat center center; background-size: cover;} /* 요트탈래 키오스크 */ .works-kiosk {background: url('/uxis/si/img/sub/06/works-kiosk_bg.png') no-repeat center center; background-size: cover;} /* 삼성바이오로직스 */ .works-sbp {background: url('/uxis/si/img/sub/06/works-sbp_bg.png') no-repeat center center; background-size: cover;} /* 세입금정보포털 */ .works-bnktax {background: url('/uxis/si/img/sub/06/works-bnktax_bg.png') no-repeat center center; background-size: cover;} /* 청소년 상담 체계 */ .works-kyci {background: url('/uxis/si/img/sub/06/works-kyci_bg.png') no-repeat center center; background-size: cover;} .works-details-sec03.kyci {margin-top:-200px} /* 부산대 캡스톤 */ .works-PNUcapstone {background: url('/uxis/si/img/sub/06/works-PNUcapstone_bg.png') no-repeat center center; background-size: cover;} /* 혈액투석과 건강생활 */ .works-hemodialysis {background: url('/uxis/si/img/sub/06/works-hemodialysis_bg.png') no-repeat center center; background-size: cover;} /* 헬스업 */ .works-healthup {background: url('/uxis/si/img/sub/06/works-healthup_bg.png') no-repeat center center; background-size: cover;} /* 마음챙김 */ .works-mentalhealth {background: url('/uxis/si/img/sub/06/works-mentalhealth_bg.png') no-repeat center center; background-size: cover;} /* 부산교육 국회부산도서관 */ .works-nanet {background: url('/uxis/si/img/sub/06/works-nanet_bg.jpg') no-repeat center center; background-size: cover;} /* 드리지 */ .works-drizi {background: url('/uxis/si/img/sub/06/works-drizi_bg.png') no-repeat center center; background-size: cover;} /* LH주거복지정보 */ .works-lhcs {background: url('/uxis/si/img/sub/06/works-lhcs_bg.png') no-repeat center center; background-size: cover;} /* 국회부산도서관 어린이홈페이지 */ .works-nanet-kids {background: url('/uxis/si/img/sub/06/works-nanet-kids_bg.png') no-repeat center center; background-size: cover;} /* 부산교통공사 인사예산시스템 */ .works-humetro-s {background: url('/uxis/si/img/sub/06/works-humetro-s_bg.png') no-repeat center center; background-size: cover;} /* 메디투어부산 2024 */ .works-meditour-bs {background: url('/uxis/si/img/sub/06/works-meditour-bs_bg.png') no-repeat center center; background-size: cover;} @media screen and (max-width:1200px) { .works-details-sec02 {height:auto; padding:40px 20px;} .works-details-sec02 .sec-tit {position:relative; top:auto; left:auto; text-align:center; margin-bottom:30px;} .works-details-sec02 .works-details-sec02-txt-box {text-align:center;} .works-details-sec02 .works-details-sec02-txt-box .s-txt {word-break:keep-all;} .works-details-sec02 .works-details-sec02-txt-box .s-txt > br {display:none;} /* ouvillage */ .ouvillage-video-zone .video {height:500px;} /* 청소년 상담 체계 */ .works-details-sec03.kyci {margin-top:0px} /* 울산시티투어 앱 */ .works-details-sec03.UcitytourApp {margin-top:0px} } @media screen and (max-width:980px) { /* ouvillage */ .ouvillage-video-zone .video {height:400px;} } @media screen and (max-width:700px) { } @media screen and (max-width:680px) { .works-details-sec01 .txt_box .txt_inwrap {width:100%; padding:0 20px; box-sizing:border-box;} .works-details-sec01 .txt_box .btxt {font-size: 40px; line-height: 40px; word-break: keep-all; margin: 15px 20px;} .works-details-sec01 .txt_box span {display:block;} .works-details-sec01 .txt_box .client {margin:0;} /* ouvillage */ .works-details-sec02.ouvillage {margin-top:0;} .ouvillage-video-zone {margin-top:60px; padding:0 20px;} .ouvillage-video-zone .video {height:300px;} } @media screen and (max-width:450px){ /* ouvillage */ .ouvillage-video-zone .video {height:250px;} } @media screen and (max-width:350px){ /* ouvillage */ .ouvillage-video-zone .video {height:200px;} } /*img-preview*/ .img-preview, .img-preview2 {position:relative} .img-preview img, .img-preview2 img { max-width:100%; display:block; margin:0 auto;} .img-preview .preview-btn, .img-preview2 .preview-btn {display:none; position:relative;} .pr-img{text-align:center} .pr-img img{max-width:100%} @media screen and (min-width:1900px){ .pr-img img{min-width:1920px} } .sub-next-secBtn {display:none;width: 19px; height: 36px; background: url('../img/main/next-section.png') no-repeat center center; position: absolute; bottom: 60px; left: 50%; transform: translate(-50%); transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out;} .sub-next-secBtn:hover {bottom:75px;} /*2022 부산인디게임페스티발 추가css*/ .works-bicfest22.works-details-sec01 .txt_box .ctxt, .works-bicfest22.works-details-sec01 .txt_box .btxt, .works-bicfest22.works-details-sec01 .txt_box .stxt, .works-bicfest22.works-details-sec01 .txt_box p a{color:#000;letter-spacing:-0.04em} .works-bicfest22.works-details-sec01 .txt_box .btxt{letter-spacing:-0.06em} .works-bicfest22 ~ .works-details-sec02 .b-tit{letter-spacing:-0.04em} .works-bicfest22 .txt_box{height:820px; position:relative; color:#000} .works-bicfest22 .sub-next-secBtn{bottom:120px;} .works-bicfest22 ~ .works-details-sec02{margin-top:-80px} .works-bicfest22 ~ .works-details-sec03{padding:0;}