@charset "utf-8";

#jd * {box-sizing: border-box;}
#jd img {display: block; max-width: 100%;margin: 0 auto;}

.jd-top {padding: 2.5rem 0 4.5rem; height: 55rem; position: relative; overflow: hidden; background: url("https://img.megastudyth.com/event/2026/jade/formula/top_bg.png") no-repeat center center / cover;}
.jd-top:before {content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 1; transition: opacity 1.5s ease-in-out;}
.jd-top.active::before {opacity: 0;}
.jd-top .main-inner {height: 100%; display: flex; flex-direction: column;}
.jd-top h6 {flex-shrink: 0; font-size: 1.125rem; color: #FFE07C; font-weight: 200; text-align: center;}
.jd-top h6:before {content: ''; display: block; height: 2.375rem; margin-bottom: 1rem; background: url("https://img.megastudyth.com/event/2026/jade/formula/top_deco.png") no-repeat center center / auto 100%;}
.jd-top dl {flex-grow: 1; line-height: 1.2; display: flex; flex-direction: column; justify-content: center;}
.jd-top dl dt {font-size: 1.75rem; color: #fff;}
.jd-top dl dd {font-size: 2.5rem; color: #FD0402; font-weight: 500;}
.jd-top h2 {flex-shrink: 0; font-size: 5.75rem; color: #fff; font-weight: 700; text-align: center;}
.jd-top h2 br {display: none;}
.jd-top p {flex-shrink: 0; margin-top: 5%; text-align: right; color: #fff; font-size: 1.25rem; font-weight: 200;}

.jd-last {padding: 7.5rem 0;}
.jd-last__title {text-align: center;}
.jd-last__title h3 {font-size: 3.75rem; font-weight: 700;}
.jd-last__title h3 span {color: #FD0402;}
.jd-last__title p {font-size: 1.75rem; font-weight: 500; margin-top: 0.5rem;}
.jd-last__book {margin-top: 2.5rem;}
.jd-last__book img {display: block; margin: 0 auto; width: 100%; max-width: 50rem !important; opacity: 0; transform: scale(0.5) translateY(50px); transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.6s ease-out;}
.jd-last__book.active img {opacity: 1; transform: scale(1) translateY(0);}
.jd-last__text {font-size: 1.5rem; text-align: center; font-weight: 500; margin-top: 2.5rem;}

.jd-point {padding: 7.5rem 0; background: #1C1C1C;}
.jd-point__title {text-align: center;}
.jd-point__title h3 {font-size: 3rem; color: #FD0402; font-weight: 600; line-height: 1.2;}
.jd-point__title h4 {font-size: 2rem; color: #fff; margin-top: 1rem; font-weight: 600;}
.jd-point__title p {font-size: 1.5rem; color: #fff; margin-top: 2rem; text-decoration: underline;}
.jd-point__list {margin-top: 3.75rem; display: flex; gap: 1rem;}
.jd-point__list li {background: #fff; flex: 1; padding: 3rem 1rem; text-align: center; border-radius: 1.25rem; display: flex; flex-direction: column;}
.jd-point__list li img {width: 5rem; flex-shrink: 0; opacity: 0; transform: scale(0.5) translateY(50px); transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.6s ease-out;}
.jd-point__list li h5 {flex-shrink: 0; font-size: 1.125rem; margin-top: 2rem; opacity: 0; transform: translateY(20px); transition: all 0.5s ease-out;}
.jd-point__list li p {flex-grow: 1; font-size: 0.875rem; font-weight: 300; margin-top: 0.75rem; opacity: 0; transform: translateY(20px); transition: all 0.5s ease-out;}
.jd-point__list.active li img,
.jd-point__list.active li h5,
.jd-point__list.active li p {opacity: 1; transform: scale(1) translateY(0);}
.jd-point__list.active li:nth-child(1) img { transition-delay: 0.1s; }
.jd-point__list.active li:nth-child(2) img { transition-delay: 0.3s; }
.jd-point__list.active li:nth-child(3) img { transition-delay: 0.5s; }
.jd-point__list.active li:nth-child(4) img { transition-delay: 0.7s; }
.jd-point__list.active li:nth-child(1) h5, .jd-point__list.active li:nth-child(1) p { transition-delay: 0.2s; }
.jd-point__list.active li:nth-child(2) h5, .jd-point__list.active li:nth-child(2) p { transition-delay: 0.4s; }
.jd-point__list.active li:nth-child(3) h5, .jd-point__list.active li:nth-child(3) p { transition-delay: 0.6s; }
.jd-point__list.active li:nth-child(4) h5, .jd-point__list.active li:nth-child(4) p { transition-delay: 0.8s; }

.jd-free {padding: 7.5rem 0; background: #EE000D url("https://img.megastudyth.com/event/2026/jade/formula/free_bg.jpg") no-repeat center top / cover;}
.jd-free__title {text-align: center;}
.jd-free__title h3 {font-size: 2.5rem; font-weight: 600; color: #fff; display: flex; flex-direction: column; align-items: center;}
.jd-free__title h3 span {display: block; background: #FEDF83; background: linear-gradient(to right, #FEDF83 0%, #FEFC86 69%, #F1A418 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.jd-free__title p {margin-top: 2.5rem; font-size: 1.5rem; color: #fff; text-decoration: underline; font-weight: 500;}
.jd-free__title dl {margin-top: 2.5rem; display: flex; justify-content: center; align-items: center;}
.jd-free__title dl dt {padding: 0 0.875rem; height: 1.75rem; background: #fff; border-radius: 2rem; line-height: 1; display: flex; justify-content: center; align-items: center;}
.jd-free__title dl dd {color: #fff; margin-left: 0.75rem;}
.jd-free__pic {margin: 3rem auto 0; width: 27.5rem; position: relative;}
.jd-free__pic dt {border-radius: 50%; overflow: hidden; background: #fff;}
.jd-free__pic dt img {opacity: 0; transform: translateX(100%); transition: transform 0.8s ease-out, opacity 0.8s ease-out;}
.jd-free__pic dd {width: 45%; position: absolute; right: 50%; top: 50%; transform: translateY(-50%); opacity: 0; transition: opacity 0.8s ease-in; transition-delay: 0.3s;}
.jd-free__pic dd img {display: block;}
.jd-free__pic dd img:first-child {position: relative; z-index: 1;}
.jd-free__pic dd img:last-child {position: absolute; right: 0; bottom: 0; transform-origin: right bottom; transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);}
.jd-free__pic.active dt img {opacity: 1; transform: translateX(0);}
.jd-free__pic.active dd {opacity: 1;}
.jd-free__pic.active dd img:last-child {transition-delay: 1.3s; transform: rotate(-20deg) translate(05%, -20%);}
.jd-free__pic2 {margin-top: 2rem;}
.jd-free__pic2 img {display: block; margin: 0 auto; width: 100%; max-width: 48.25rem !important; opacity: 0; transform: scale(0.5) translateY(50px); transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.6s ease-out;}
.jd-free__pic2.active img {opacity: 1; transform: scale(1) translateY(0);}
.jd-free__down {display: flex; justify-content: center;}
.jd-free__down a {width: 25rem; height: 5rem; background: #000; color: #fff; font-size: 1.5rem; border-radius: 0.625rem; display: flex; align-items: center; justify-content: center;}
.jd-free__qr {margin-top: 2.5rem; background: #A20009; padding: 1.5rem; display: flex; align-items: center;}
.jd-free__qr dt {width: 5rem; flex-shrink: 0;}
.jd-free__qr dd {flex-grow: 1; text-align: center; font-size: 1.25rem; color: #fff; margin-left: 1.5rem;}

@media (max-width:1280px) {
	.jd-top {height: 50rem;}
	.jd-top h6 {font-size: 1rem;}
	.jd-top h6:before {height: 2rem;}
	.jd-top dl dt {font-size: 1.5rem;}
	.jd-top dl dd {font-size: 2rem;}
	.jd-top h2 {font-size: 4.5rem;}
	.jd-top p {font-size: 1.125rem;}

	.jd-last__title h3 {font-size: 3rem;}
	.jd-last__title p {font-size: 1.5rem;}
	.jd-last__book {margin-top: 2rem;}
	.jd-last__text {font-size: 1.25rem; margin-top: 2rem;}

	.jd-point__title h3 {font-size: 2.75rem;}
	.jd-point__title h4 {font-size: 1.75rem; margin-top: 0;}
	.jd-point__title p {font-size: 1.25rem; margin-top: 1.5rem;}
	.jd-point__list {margin-top: 3rem;}
	.jd-point__list li {padding: 2rem 0.5rem; border-radius: 1rem;}
	.jd-point__list li h5 {font-size: 1rem; margin-top: 1rem;}
	.jd-point__list li p {font-size: 0.75rem;}

	.jd-free__title h3 {font-size: 2.25rem;}
	.jd-free__title p {margin-top: 2rem;}
	.jd-free__title dl {margin-top: 2rem;}
	.jd-free__pic {width: 25rem;}
	.jd-free__down a {width: 20rem; height: 4rem; font-size: 1.25rem;}
	.jd-free__qr dd {font-size: 1.125rem;}
}

@media (max-width:992px) {
	.jd-top {height: 45rem;}
	.jd-top dl dt {font-size: 1.25rem;}
	.jd-top dl dd {font-size: 1.75rem;}
	.jd-top h2 {font-size: 4rem;}
	.jd-top p {font-size: 1rem;}
}

@media (max-width:768px) {
	.jd-top {padding: 2rem 0; height: 35rem;}
	.jd-top h6 {font-size: 0.75rem;}
	.jd-top h6:before {height: 1.5rem; margin-bottom: 0.5rem;}
	.jd-top dl dt {font-size: 0.875rem;}
	.jd-top dl dd {font-size: 1.25rem;}
	.jd-top h2 {font-size: 2.5rem;}
	.jd-top h2 br {display: block;}
	.jd-top p {font-size: 0.875rem;}
	
	.jd-last {padding: 5rem 0;}
	.jd-last__title h3 {font-size: 2rem;}
	.jd-last__title p {font-size: 1.125rem; margin-top: 0.25rem;}
	.jd-last__book {margin-top: 1.5rem;}
	.jd-last__text {font-size: 1.125rem; margin-top: 1.5rem;}

	.jd-point {padding: 5rem 0;}
	.jd-point__title h3 {font-size: 2rem;}
	.jd-point__title h4 {font-size: 1.5rem;}
	.jd-point__title p {font-size: 0.875rem;}
	.jd-point__list {margin-top: 2rem; flex-wrap: wrap;}
	.jd-point__list li {flex: none; width: calc(50% - 0.5rem);}
	
	.jd-free {padding: 5rem 0;}
	.jd-free__title h3 {font-size: 2rem; line-height: 1.2;}
	.jd-free__title p {margin-top: 1rem; font-size: 1.25rem;}
	.jd-free__title dl {margin-top: 1.5rem;}
	.jd-free__pic {width: 20rem;}
	.jd-free__qr {padding: 1rem;}
	.jd-free__qr dt {width: 4rem; height: 4rem;}
	.jd-free__qr dd {font-size: 0.875rem; margin-left: 1rem;}
}