문서 편집 권한이 없습니다. 다음 이유를 확인해주세요: 요청한 명령은 다음 중 하나의 권한을 가진 사용자에게 제한됩니다: 사용자, 관리자. 문서를 고치려면 이메일 인증 절차가 필요합니다. 사용자 환경 설정에서 이메일 주소를 입력하고 이메일 주소 인증을 해주시기 바랍니다. 문서의 원본을 보거나 복사할 수 있습니다. /* # 등장 애니메이션 */ .IMA-mainimg { opacity: 0; animation: IMA-mainimg; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.2s; animation-fill-mode: forwards; transition: .2s ease; } @keyframes IMA-mainimg { from {opacity: 0;} to {opacity: 1;} } .IMA-maintext { opacity: 0; animation: IMA-maintext; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.2s; animation-fill-mode: forwards; transition: .2s ease; transform: translateY(0%); } @keyframes IMA-maintext { from {opacity: 0; transform: translateY(-20%);} to {opacity: 1; transform: translateY(0%);} } .IMA-maintext1 { opacity: 0; animation: IMA-maintext2; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.2s; animation-fill-mode: forwards; transition: .2s ease; transform: translateY(0%); } .IMA-maintext2 { opacity: 0; animation: IMA-maintext2; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.4s; animation-fill-mode: forwards; transition: .2s ease; transform: translateY(0%); } .IMA-maintext3 { opacity: 0; animation: IMA-maintext2; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.6s; animation-fill-mode: forwards; transition: .2s ease; transform: translateY(0%); } @keyframes IMA-maintext2 { from {opacity: 0; transform: translateY(-2%);} to {opacity: 1; transform: translateY(0%);} } .IMA-subtext { opacity: 0; animation: IMA-subtext; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.2s; animation-fill-mode: forwards; transition: .2s ease; transform: translateX(0%); } @keyframes IMA-subtext { from {opacity: 0; transform: translateX(-2%);} to {opacity: 1; transform: translateX(0%);} } /* # 모바일 반응성 */ @media screen and (min-width: 700px) { .IM-PO-WebDisplay { display:inherit; } } @media screen and (min-width: 700px) { .IM-PO-MobileDisplay { display:none; } } @media screen and (max-width: 700px) { .IM-PO-WebDisplay { display:none; } } @media screen and (max-width: 700px) { .IM-PO-MobileDisplay { display:inherit; } } /* # CSS 일반 */ .IM-PO-z { z-index:2; } .IM-PO-BW { filter: grayscale(100%); } .invert-template{ filter: invert(100%); } .IM-Newsimg img { height:150px; width:100%; object-fit: cover; object-position: center top; } .IM-Newsimg1 img { height:150px; width:100%; object-fit: cover; object-position: center center; } .IM-Newsimg2 img { height:150px; width:100%; object-fit: cover; object-position: center bottom; } /* # 반응 애니메이션 */ .IM-NotImg { filter:brightness(0.9); box-shadow:0px 0px 4px rgba(0,0,0,0); transition: filter 0.5s, box-shadow 0.5s; } .IM-NotImg:hover { box-shadow:0px 0px 7px rgba(92, 255, 206,1); filter:brightness(1.2); } .IM-NotImg2 { box-shadow:0px 0px 4px rgba(0,0,0,0); transition:box-shadow 0.5s; } .IM-NotImg2:hover { box-shadow:0px 0px 7px rgba(92, 255, 206,1); } .IM-NotImg2 .IM-NotImg3 { filter:brightness(0.9); transition: filter 0.5s; } .IM-NotImg2:hover .IM-NotImg3 { filter:brightness(1.2); } .IM-NotImg4 { filter:brightness(0.9); transition: filter 0.5s; } .IM-NotImg4:hover { filter:brightness(1.2); } .IM-NotImg6 { } .IM-NotImg6 .IM-NotImg5 { filter:brightness(0.9); transition: filter 0.5s; } .IM-NotImg6:hover .IM-NotImg5 { filter:brightness(1.2); } 틀:Imyunakitof/styles.css 문서로 돌아갑니다.