틀:JOtax/styles.css

2024년 4월 24일 (수) 15:26 판 (원본 보기) Ernst (토론 | 기여) 편집 요약 없음 ← 이전 편집		2024년 5월 18일 (토) 13:46 기준 최신판 (원본 보기) Ernst (토론 | 기여) 편집 요약 없음
(같은 사용자의 중간 판 3개는 보이지 않습니다)
1번째 줄:		1번째 줄:
			/*    # 모바일 반응성    */
			@media screen and (min-width: 800px) {
			.JO-WebDisplay {
			display:inherit;
			}
			}
			@media screen and (min-width: 800px) {
			.JO-MobileDisplay {
			display:none !important;
			}
			}
			@media screen and (max-width: 800px) {
			.JO-WebDisplay {
			display:none !important;
			}
			}
			@media screen and (max-width: 800px) {
			.JO-MobileDisplay {
			display:inherit;
			}
			}
			/*    # 기타    */
	.DO-HO-box {		.DO-HO-box {
	}		}
97번째 줄:		122번째 줄:
	@keyframes JO-tax-tap4 {		@keyframes JO-tax-tap4 {
	from {height:0px;opacity:0;}		from {height:0px;opacity:0;}
	50% {height:74px;opacity:1;}		50% {height:73px;opacity:1;}
	to {height:auto;opacity:1;}		to {height:auto;opacity:1;}
	}		}

---

2024년 5월 18일 (토) 13:46 기준 최신판

/*    # 모바일 반응성    */

@media screen and (min-width: 800px) {
	.JO-WebDisplay {
    	display:inherit;
	}
}
@media screen and (min-width: 800px) {
	.JO-MobileDisplay {
    	display:none !important;
	}
}
@media screen and (max-width: 800px) {
	.JO-WebDisplay {
    	display:none !important;
	}
}
@media screen and (max-width: 800px) {
	.JO-MobileDisplay {
    	display:inherit;
	}
}

/*    # 기타    */

.DO-HO-box {
}
.DO-HO-item1 {
  display:block;
}
.DO-HO-item2 {
  display:none;
}
.DO-HO-box:hover > .DO-HO-item2 {
  display:block;
}
.DO-HO-box:hover > .DO-HO-item1 {
  display:none;
}


.JO-tax-trigger {
	cursor: help;
}
.JO-tax-content {
  overflow:hidden;
  height:0px;
  opacity:0;
}
.JO-tax-trigger:hover > .JO-tax-content {
  animation: JO-tax-tap;
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

@keyframes JO-tax-tap {
  from {height:0px;opacity:0;}
  50% {height:26px;opacity:1;}
  to {height:auto;opacity:1;}
}

.JO-tax-trigger1 {
	cursor: help;
}
.JO-tax-trigger1:hover > .JO-tax-content {
  animation: JO-tax-tap1;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

@keyframes JO-tax-tap1 {
  from {height:0px;opacity:0;}
  50% {height:74px;opacity:1;}
  to {height:auto;opacity:1;}
}
.JO-tax-trigger2 {
	cursor: help;
}
.JO-tax-trigger2:hover > .JO-tax-content {
  animation: JO-tax-tap2;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
@keyframes JO-tax-tap2 {
  from {height:0px;opacity:0;}
  50% {height:81px;opacity:1;}
  to {height:auto;opacity:1;}
}

.JO-tax-trigger3 {
	cursor: help;
}
.JO-tax-trigger3:hover > .JO-tax-content {
  animation: JO-tax-tap3;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
@keyframes JO-tax-tap3 {
  from {height:0px;opacity:0;}
  50% {height:53px;opacity:1;}
  to {height:auto;opacity:1;}
}

.JO-tax-trigger4 {
	cursor: help;
}
.JO-tax-trigger4:hover > .JO-tax-content {
  animation: JO-tax-tap4;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
@keyframes JO-tax-tap4 {
  from {height:0px;opacity:0;}
  50% {height:73px;opacity:1;}
  to {height:auto;opacity:1;}
}