@charset "utf-8";

#end {width: 100%; overflow: hidden; line-height: 1.3; letter-spacing: -0.025rem;}
#end * {box-sizing: border-box;}
#end img {display: block; max-width: 100%; margin: 0 auto;}
#end button {-webkit-appearance: none; appearance: none;}
#end #body_temp {}
.container {max-width: 1240px; padding-left: 20px; padding-right: 20px;}


/* intro */
.end-intro {padding: 32px 0 88px; background: #111;}
.end-intro__logo {display: block; height: 24px; text-indent: -9999px; background: url('https://img.megastudyth.com/event/2023/end/intro_logo.png')no-repeat center bottom / auto 24px;}
.end-intro__title {text-align: center; font-size: 56px; font-weight: 600; color: #000;  -webkit-text-stroke: 1px #fff;}
.end-intro__title strong {color: #fff;}
.end-intro__count {margin-top: 56px; display: flex; align-items: center; justify-content: center;}
.end-intro__count li {width: 50%; position: relative; padding: 0 40px;}
.end-intro__count li:after {content: ''; display: block; width: 1px; height: 68px; background: #585858; position: absolute; right: 0; top: 50%; margin-top: -34px;}
.end-intro__count li:first-child {text-align: right;}
.end-intro__count li:last-child:after {display: none;}
.end-intro__count li p {color: #999; display: flex; align-items: center;}
.end-intro__count li:first-child p {justify-content: flex-end;}
.end-intro__count li p:before {content: ''; width: 20px; height: 20px; margin-right: 4px;}
.end-intro__count li:first-child p:before {background: url('https://img.megastudyth.com/event/2023/end/intro_user.png')no-repeat center bottom / cover;}
.end-intro__count li:last-child p:before {background: url('https://img.megastudyth.com/event/2023/end/intro_time.png')no-repeat center bottom / cover;}
.end-intro__count li h5 {color: #0082FF; font-size: 20px; line-height: 1.0; margin-top: 8px;}
.end-intro__count li h5 strong {font-size: 48px; margin-right: 4px;}

.end-intro__year {display: flex; justify-content: center; align-items: center; padding: 64px 0; overflow: hidden; position: relative;}
.end-intro__year:before,
.end-intro__year:after {content: ''; display: block; position: absolute; left: 0; right: 0; height: 64px; background: #f00; z-index: 1;}
.end-intro__year:before {top: 0; background: linear-gradient(to bottom,  rgba(17,17,17,1) 0%,rgba(17,17,17,1) 90%,rgba(17,17,17,0) 100%);}
.end-intro__year:after {bottom: 0; background: linear-gradient(to bottom,  rgba(17,17,17,0) 0%,rgba(17,17,17,1) 10%,rgba(17,17,17,1) 100%);}
.end-intro__year li {width: 25%; margin: 0 -2%;}
.end-intro__year li:nth-child(1) .end-digit__group {animation-iteration-count: 10;}
.end-intro__year li:nth-child(2) .end-digit__group {animation-iteration-count: 15;}
.end-intro__year li:nth-child(3) .end-digit__group {animation-iteration-count: 20;}
.end-intro__year li:nth-child(4) .end-digit__group {animation-iteration-count: 25;}
.end-digit {padding-bottom: 120%; position: relative;}
.end-digit__group {position: absolute; left: 0; top: 0; width: 100%; animation-timing-function: cubic-bezier(1, 0, 1, 0); animation-name: hundredths-ones; animation-duration: 0.1s;}
.end-digit__group span {display: block; padding-bottom: 120%;}
.end-digit__group span.num1 {background: url('https://img.megastudyth.com/event/2023/end/digit_1.png')no-repeat center center / 90%;}
.end-digit__group span.num2 {background: url('https://img.megastudyth.com/event/2023/end/digit_2.png')no-repeat center center / 90%;}
.end-digit__group span.num3 {background: url('https://img.megastudyth.com/event/2023/end/digit_3.png')no-repeat center center / 90%;}
.end-digit__group span.num4 {background: url('https://img.megastudyth.com/event/2023/end/digit_4.png')no-repeat center center / 90%;}
.end-digit__group span.num5 {background: url('https://img.megastudyth.com/event/2023/end/digit_5.png')no-repeat center center / 90%;}
.end-digit__group span.num6 {background: url('https://img.megastudyth.com/event/2023/end/digit_6.png')no-repeat center center / 90%;}
.end-digit__group span.num7 {background: url('https://img.megastudyth.com/event/2023/end/digit_7.png')no-repeat center center / 90%;}
.end-digit__group span.num8 {background: url('https://img.megastudyth.com/event/2023/end/digit_8.png')no-repeat center center / 90%;}
.end-digit__group span.num9 {background: url('https://img.megastudyth.com/event/2023/end/digit_9.png')no-repeat center center / 90%;}
.end-digit__group span.num0 {background: url('https://img.megastudyth.com/event/2023/end/digit_0.png')no-repeat center center / 90%;}

@keyframes hundredths-ones {
	0% {transform: translateY(-10%);}
	10% {transform: translateY(-20%);}
	20% {transform: translateY(-30%);}
	30% {transform: translateY(-40%);}
	40% {transform: translateY(-50%);}
	50% {transform: translateY(-60%);}
	60% {transform: translateY(-70%);}
	70% {transform: translateY(-80%);}
	80% {transform: translateY(-90%);}
	90% {transform: translateY(-100%);}
}

@media (max-width:992px) {
	.end-intro__title {font-size: 46px;}
	.end-intro__count {margin-top: 32px;}
	.end-intro__count li {padding: 0 24px;}
	.end-intro__count li h5 strong {font-size: 36px;}
	.end-intro__year {padding: 40px 0;}
	.end-intro__year:before,
	.end-intro__year:after {height: 40px;}
}

@media (max-width:768px) {
	.end-intro {padding: 32px 0 56px;}
	.end-intro__title {font-size: 26px; font-weight: 900; line-height: 1.1;}
	.end-intro__title strong {display: block; font-size: 40px; font-weight: 600;}
	.end-intro__count {display: block; margin-top: 32px;}
	.end-intro__count li {width: 100%; text-align: center; padding: 0;}
	.end-intro__count li:first-child {text-align: center; margin-bottom: 16px;}
	.end-intro__count li:after {display: none;}
	.end-intro__count li p {justify-content: center; font-size: 12px;}
	.end-intro__count li:first-child p {justify-content: center;}
	.end-intro__count li h5 {margin-top: 0; font-size: 14px;}
	.end-intro__count li h5 strong {font-size: 28px;}
	.end-intro__year {padding: 24px 0;}
	.end-intro__year:before,
	.end-intro__year:after {height: 24px;}
}




.end-story {padding: 48px 0 80px;}
.end-story__title {text-align: center;}
.end-story__title p {font-size: 32px;}
.end-story__title h3 {font-size: 56px; font-weight: 700;}
.end-story__top {margin-top: 56px; display: flex; justify-content: center; align-items: flex-end;}
.end-story__date {height: 52px; padding: 0 24px; border: solid 1px #333; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 40px; border-radius: 40px; -webkit-box-shadow: 0px 4px 0px 0px rgba(0,0,0,1); box-shadow: 0px 4px 0px 0px rgba(0,0,0,1);}
.end-story__date strong {margin: 0 4px; font-size: 20px;}
.end-story__nav {display: flex;}
.end-story__nav .slick-arrow {display: block; width: 40px; height: 40px; border: solid 1px #333; position: relative; text-indent: -9999px; -webkit-border-radius: 40px; border-radius: 40px; -webkit-box-shadow: 0px 4px 0px 0px rgba(0,0,0,1); box-shadow: 0px 4px 0px 0px rgba(0,0,0,1);}
.end-story__nav .slick-prev {margin-right: 4px;}
.end-story__nav .slick-arrow:after {content: ''; display: block; box-sizing: border-box; width: 8px; height: 8px; position: absolute; left: 50%; top: 50%; margin-top: -4px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.end-story__nav .slick-prev:after {border-left: solid 1px #333; border-bottom: solid 1px #333; margin-left: -2px;}
.end-story__nav .slick-next:after {border-top: solid 1px #333; border-right: solid 1px #333; margin-left: -6px;}
.end-story__list {margin: 40px -10px 0; position: relative;}
.end-story__list:before {content: ''; display: block; height: 1px; background: #333; position: absolute; left: -100%; right: -100%; top: 56px;}
.end-story__list .slick-slide {padding: 0 10px 4px;}
.end-story__item dt {text-align: center; font-size: 20px; font-weight: 700; margin-bottom: 32px; position: relative; height: 24px; line-height: 24px;}
.end-story__item dt:after {content: ''; display: block; width: 11px; height: 11px; background: #333; position: absolute; top: 100%; left: 50%; margin-top: 27px; margin-left: -5px; outline: solid 5px rgba(51,51,51,0.1); -webkit-border-radius: 40px; border-radius: 40px;}
.end-story__item dd {position: relative; padding-top: 64px;}
.end-story__item dd:before {content: ''; display: block; height: 64px; position: absolute; left: 50%; top: 0; border-left: dashed 1px #333;}
.end-story__box {border: solid 1px #333; height: 310px; padding: 24px; -webkit-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0px 4px 0px 0px rgba(0,0,0,1); box-shadow: 0px 4px 0px 0px rgba(0,0,0,1); transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-story__box p {font-size: 18px;}
.end-story__box h5 {font-size: 22px; font-weight: 700; margin-top: 12px;}
.end-story__box:hover {-webkit-border-radius: 30px; border-radius: 30px;}

@media (max-width:1280px) {
	.end-story__item dt {font-size: 18px;}
	.end-story__box {height: 280px; padding: 16px;}
	.end-story__box p {font-size: 13px;}
	.end-story__box h5 {font-size: 18px; margin-top: 4px;}
}

@media (max-width:992px) {
	.end-story__title p {font-size: 24px;}
	.end-story__title h3 {font-size: 40px;}
	.end-story__top {margin-top: 32px; justify-content: space-between;}
	.end-story__date {height: 40px; padding: 0 16px; font-size: 14px;}
	.end-story__date strong {font-size: 16px;}
}

@media (max-width:768px) {
	.end-story {padding: 56px 0;}
	.end-story__title p {font-size: 16px;}
	.end-story__title h3 {font-size: 26px;}
	.end-story__top {margin-top: 24px;}
	.end-story__date {height: 32px; padding: 0 8px; font-size: 12px; -webkit-box-shadow: 0px 2px 0px 0px rgba(0,0,0,1); box-shadow: 0px 2px 0px 0px rgba(0,0,0,1);}
	.end-story__date strong {font-size: 14px;}
	.end-story__nav .slick-arrow {width: 32px; height: 32px; -webkit-box-shadow: 0px 2px 0px 0px rgba(0,0,0,1); box-shadow: 0px 2px 0px 0px rgba(0,0,0,1);}
	.end-story__list {margin: 24px -6px 0; padding-right: 10%;}
	.end-story__list:before {top: 40px;}
	.end-story__list .slick-list {overflow: visible;}
	.end-story__list .slick-slide {padding: 0 6px 4px;}
	.end-story__item dt {font-size: 16px; margin-bottom: 16px; height: 20px; line-height: 20px;}
	.end-story__item dt:after {margin-top: 15px;}
	.end-story__item dd {padding-top: 32px;}
	.end-story__item dd:before {height: 32px;}
	.end-story__box {height: 240px;}
	.end-story__box p {font-size: 12px;}
	.end-story__box h5 {font-size: 16px;}
}



.end-growth {background: #EFF2F8; padding: 80px 0;}
.end-growth__title {text-align: center;}
.end-growth__title p {font-size: 32px;}
.end-growth__title h3 {font-size: 48px; font-weight: 700; margin-top: 8px;}
.end-growth__title h3 span {color: #0082FF;}
.end-growth__box {background: #fff; border: solid 1px #333; padding: 48px 0; margin-top: 56px; display: flex; position: relative; -webkit-border-radius: 10px; border-radius: 10px;}
.end-growth__box:before,
.end-growth__box:after {content: ''; display: block; position: absolute; z-index: 1;}
.end-growth__box:before {width: 143px; height: 250px; right: 100%; bottom: -32px; margin-right: -64px; background: url('https://img.megastudyth.com/event/2023/end/growth_cha_1.png')no-repeat center center / cover;}
.end-growth__box:after {width: 254px; height: 182px; left: 100%; margin-left: -144px; bottom: -1px; background: url('https://img.megastudyth.com/event/2023/end/growth_cha_2.png')no-repeat center center / cover;}
.end-growth__cont {width: 50%; padding: 0 48px; text-align: center; position: relative;}
.end-growth__cont:after {}
.end-growth__cont:nth-child(1):after {content: ''; display: block; background: #d9d9d9; width: 1px; position: absolute; top: 0; bottom: 0; right: 0;}
.end-growth__cont p {font-size: 20px;}
.end-growth__cont h5 {font-size: 36px; font-weight: 600; margin-top: 8px;}
.end-growth__cont h5 span {color: #0082FF;}
.end-growth__graph {margin-top: 24px; margin-left: auto; margin-right: auto;}
.end-growth__graph canvas {}

@media (max-width:1280px) {
	.end-growth__title p {font-size: 24px;}
	.end-growth__title h3 {font-size: 38px;}
	.end-growth__box {margin-top: 32px;}
	.end-growth__cont p {font-size: 14px;}
	.end-growth__cont h5 {font-size: 28px; margin-top: 4px;}
}

@media (max-width:992px) {
	.end-growth__title p {font-size: 16px;}
	.end-growth__title h3 {font-size: 28px;}
	.end-growth__box {padding: 32px 0; margin-top: 16px;}
	.end-growth__cont {padding: 0 24px;}
	.end-growth__cont p {font-size: 14px;}
	.end-growth__cont h5 {font-size: 24px; margin-top: 4px;}
}

@media (max-width:768px) {
	.end-growth {padding: 56px 0;}
	.end-growth__title p {font-size: 16px;}
	.end-growth__title h3 {font-size: 28px;}
	.end-growth__box {margin-top: 24px; padding: 24px; display: block;} 
	.end-growth__cont {padding: 0; width: 100%;}
	.end-growth__cont:nth-child(1):after {display: none;}
	.end-growth__cont:nth-child(2) {margin-top: 32px; padding-top: 32px; padding-left: 32px; padding-right: 32px; border-top: dashed 1px #ddd;}
	.end-growth__cont p {font-size: 14px;}
	.end-growth__cont h5 {font-size: 24px; margin-top: 4px;}
	.end-growth__box:before {display: none; width: 107px; height: 187px; bottom: auto; bottom: 50%; margin-right: -80px;}
	.end-growth__box:after {width: 190px; height: 136px; margin-left: -120px;}
	.end-growth__graph {margin-top: 0;}
}



.end-data {padding-top: 140px;}
.end-data__grid {display: grid; grid-template-rows: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr; row-gap: 20px; column-gap: 20px;}
.end-data__item {position: relative;}
.end-data__item:nth-child(1) {grid-row: 1 / 1; grid-column: 1 / 3;}
.end-data__item:nth-child(2) {grid-row: 1 / 3;}
.end-data__item:nth-child(3) {grid-row: 2 / 4;}
.end-data__item:nth-child(4) {grid-row: 2 / 2;}
.end-data__item:nth-child(5) {grid-row: 3 / 3; grid-column: 2 / 4;}

.end-data__card {height: 100%; position: relative; transform-style: preserve-3d; transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275); cursor: pointer;}
.end-data__card.flip {transform: rotateY(180deg);}
.end-data__card.flip-x.flip {transform: rotateX(180deg);}
.end-data__card > div {width: 100%; height: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-border-radius: 12px; border-radius: 12px;}

.end-data__card.main {display: flex; justify-content: space-between; cursor: default;}
.end-data__card.main:after {content: ''; display: block; flex-shrink: 0; width: 162px; height: 162px; background: url('https://img.megastudyth.com/event/2023/end/data_1.png')no-repeat center center / cover;}
.end-data__card.main p {font-size: 32px;}
.end-data__card.main h5 {font-size: 56px; font-weight: 700;}

.end-data__cover {padding: 40px 32px; border: solid 1px #333; font-size: 36px; font-weight: 600; position: absolute; left: 0; top: 0; display: flex; flex-direction: column;}
.end-data__cover:before {content: 'ตรวจสอบ'; height: 40px; border: solid 1px #333; font-size: 16px; padding: 0 18px; color: #333; position: absolute; left: 32px; bottom: 40px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 20px; border-radius: 20px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-data__cover:hover:before {background: #333; color: #fff;}
.end-data__card.ppl .end-data__cover {color: #A056FF;}
.end-data__card.blu .end-data__cover {color: #0082FF;}
.end-data__card.org .end-data__cover {color: #F97932;}
.end-data__card.grn .end-data__cover {color: #25B94E;}
.end-data__cover:after {content: ''; display: block; position: absolute; right: 40px; bottom: 40px;}
.end-data__card.ppl .end-data__cover:after {width: 108px; height: 108px; background: url('https://img.megastudyth.com/event/2023/end/data_2.png')no-repeat center center / cover; transform-origin: right bottom;}
.end-data__card.blu .end-data__cover:after {width: 120px; height: 120px; background: url('https://img.megastudyth.com/event/2023/end/data_3.png')no-repeat center center / cover; transform-origin: right bottom;}
.end-data__card.org .end-data__cover:after {width: 106px; height: 106px; background: url('https://img.megastudyth.com/event/2023/end/data_4.png')no-repeat center center / cover; transform-origin: right center; bottom: auto; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%);}
.end-data__card.grn .end-data__cover:after {width: 108px; height: 108px; background: url('https://img.megastudyth.com/event/2023/end/data_5.png')no-repeat center center / cover; transform-origin: right center; bottom: auto; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%);}

.end-data__cont {border: solid 1px #333; padding: 40px 32px; position: relative; transform: rotateY(180deg); display: flex; flex-direction: column; height: 100%;}
.end-data__card.flip-x .end-data__cont {transform: rotateX(180deg);}
.end-data__card.ppl .end-data__cont {background: #A056FF;}
.end-data__card.blu .end-data__cont {background: #0082FF;}
.end-data__card.org .end-data__cont {background: #F97932;}
.end-data__card.grn .end-data__cont {background: #25B94E;}

.end-data__grow {flex-grow: 1;}
.end-data__grow p {color: #fff;}
.end-data__grow h5 {font-size: 28px; font-weight: 600; color: #FFF069;}
.end-data__grow p + h5 {margin-top: 12px;}
.end-data__grow h5 + p {margin-top: 12px;}
.end-data__grow ul {color: #fff; margin-top: 36px;}
.end-data__grow ul li {margin-bottom: 12px; display: flex;}
.end-data__grow ul li:last-child {margin-bottom: 0;}
.end-data__grow ul li em {flex-shrink: 0; width: 32px; height: 22px; font-size: 14px; font-style: normal; border: solid 1px #fff; margin-right: 8px; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 12px; border-radius: 12px;}
.end-data__grow ul li span {flex-grow: 1;}
.end-data__grow ul li strong {font-size: 28px;}
.end-data__warn {color: #fff; flex-shrink: 0; display: flex; align-items: center;}
.end-data__warn:before {content: '!'; color: #333; display: block; width: 24px; height: 24px; background: #FFEB83; margin-right: 8px; font-size: 18px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; border-radius: 50%;}
.end-data__fav {flex-shrink: 0; display: flex; align-items: center; color: #fff; align-self: flex-end;}
.end-data__fav:before {content: ''; display: block; width: 20px; height: 20px; margin-right: 8px; background: url('https://img.megastudyth.com/event/2023/end/data_fav.png')no-repeat center center / cover;}

@media (max-width:1280px) {
	.end-data {padding-top: 80px;}
	.end-data__card.main:after {width: 120px; height: 120px;}
	.end-data__card.main p {font-size: 24px;}
	.end-data__card.main h5 {font-size: 40px;}
	.end-data__cover {padding: 24px; font-size: 30px;}
	.end-data__cover:before {font-size: 14px; padding: 0 16px; left: 16px; bottom: 16px;}
	.end-data__cover:after {right: 16px; bottom: 16px;}
	.end-data__cont {padding: 24px; min-height: 240px;}
	.end-data__grow h5 {font-size: 24px;}
	.end-data__grow p + h5 {margin-top: 8px;}
	.end-data__grow h5 + p {margin-top: 8px;}
	.end-data__grow ul {margin-top: 24px;}
	.end-data__grow ul li {margin-bottom: 8px;}
	.end-data__grow ul li strong {font-size: 22px;}
	.end-data__warn:before {width: 20px; height: 20px; font-size: 16px;}
}

@media (max-width:992px) {
	.end-data__grid {row-gap: 10px; column-gap: 10px;}
	.end-data__card.main:after {width: 96px; height: 96px;}
	.end-data__card.main p {font-size: 20px;}
	.end-data__card.main h5 {font-size: 30px;}
	.end-data__cover {padding: 16px; font-size: 24px;}
	.end-data__cover:before {height: 32px; font-size: 13px; padding: 0 8px;}
	.end-data__cover:after {transform: scale(0.7); -webkit-transform: scale(0.7);}
	.end-data__card.org .end-data__cover:after {-webkit-transform: translate(0, -50%) scale(0.7); transform: translate(0, -50%) scale(0.7);}
	.end-data__card.grn .end-data__cover:after {-webkit-transform: translate(0, -50%) scale(0.7); transform: translate(0, -50%) scale(0.7);}
	.end-data__cont {min-height: 200px;}
	.end-data__grow p {font-size: 13px;}
	.end-data__grow h5 {font-size: 18px;}
	.end-data__grow ul {margin-top: 16px;}
	.end-data__grow ul li {font-size: 13px;}
	.end-data__grow ul li em {width: 24px; height: 16px; font-size: 12px;}
	.end-data__grow ul li strong {font-size: 18px;}
	.end-data__warn:before {width: 16px; height: 16px; font-size: 14px;}
}

@media (max-width:768px) {
	.end-data {padding-top: 56px;}
	.end-data__grid {display: block;}
	.end-data__card.main {align-items: center; margin-top: 0;}
	.end-data__card.main:after {width: 72px; height: 72px;}
	.end-data__card.main p {font-size: 14px;}
	.end-data__card.main h5 {font-size: 26px;}
	.end-data__card {margin-top: 16px;}
	.end-data__card.org .end-data__cover:after {-webkit-transform: translate(0, 0) scale(0.7); transform: translate(0, 0) scale(0.7);}
	.end-data__card.grn .end-data__cover:after {-webkit-transform: translate(0, 0) scale(0.7); transform: translate(0, 0) scale(0.7);}
}




.end-rank {margin-top: 80px;}
.end-rank__box {border: solid 1px #333; padding: 48px; display: flex; -webkit-border-radius: 12px; border-radius: 12px;}
.end-rank__title {width: 50%; display: flex; flex-direction: column;}
.end-rank__title > div {flex-grow: 1;}
.end-rank__title:after {content: ''; flex-shrink: 0; display: block; width: 149px; height: 168px; background: url('https://img.megastudyth.com/event/2023/end/rank_icon.png')no-repeat center center / cover;}
.end-rank__title p {font-size: 24px;}
.end-rank__title h5 {font-size: 48px; font-weight: 600; margin-top: 12px;}
.end-rank__list {flex-shrink: 0; width: 50%; padding: 24px 0;}
.end-rank__list ul {display: flex;}
.end-rank__list ul:nth-child(1) {justify-content: flex-end;}
.end-rank__list ul:nth-child(2) {justify-content: flex-start;}
.end-rank__list ul:nth-child(3) {justify-content: center;}
.end-rank__list li {padding: 10px;}
.end-rank__list li dl {padding: 14px 32px 14px 14px; display: flex; align-items: center; -webkit-border-radius: 64px; border-radius: 64px;}
.end-rank__list li dl.blu {background: #e6f3ff;}
.end-rank__list li dl.ylw {background: #fffae9;}
.end-rank__list li dl.grn {background: #ebf5ee;}
.end-rank__list li dl.red {background: #ffeaf3;}
.end-rank__list li dl.ppl {background: #f4ebff;}
.end-rank__list li dl dt {width: 60px; margin-right: 12px; flex-shrink: 0; }
.end-rank__list li dl dd {flex-grow: 1;}
.end-rank__list li dl dd h5 {font-size: 20px; font-weight: 600;}
.end-rank__list li dl dd p {color: #999;}

@media (max-width:1280px) {
	.end-rank__title h5 {font-size: 40px; margin-top: 0;}
	.end-rank__list {padding: 0;}
	.end-rank__list li {padding: 8px;}
	.end-rank__list li dl {padding: 8px 24px 8px 8px;}
	.end-rank__list li dl dt {width: 48px; margin-right: 8px;}
	.end-rank__list li dl dd h5 {font-size: 18px;}
	.end-rank__list li dl dd p {font-style: 13px;}
}

@media (max-width:992px) {
	.end-rank__box {padding: 24px; justify-content: space-between;}
	.end-rank__title {width: auto;}
	.end-rank__title p {font-size: 18px;}
	.end-rank__title h5 {font-size: 34px;}
	.end-rank__title:after {width: 112px; height: 126px;}
	.end-rank__list {width: auto; margin-left: 24px;}
	.end-rank__list li dl dd h5 {font-size: 16px;}
	.end-rank__list li dl dd p {font-style: 12px;}
}

@media (max-width:768px) {
	.end-rank {margin-top: 56px;}
	.end-rank__box {display: block; padding: 24px 16px;}
	.end-rank__title {width: 100%; position: relative;}
	.end-rank__title p {font-size: 14px;}
	.end-rank__title h5 {font-size: 26px;}
	.end-rank__title:after {width: 75px; height: 84px; position: absolute; right: 0; top: 50%; margin-top: -42px;}
	.end-rank__list {width: 100%; margin-left: 0; margin-top: 24px;}
	.end-rank__list ul {display: block;}
	.end-rank__list li {padding: 4px;}
	.end-rank__list li dd {display: flex; align-items: center; justify-content: space-between;}
}



.end-inter {margin-top: 80px; padding: 80px 0; background: #F6F6F6;}
.end-inter__title {display: flex; align-items: center; justify-content: space-between;}
.end-inter__title p {font-size: 32px;}
.end-inter__title h3 {font-size: 56px; font-weight: 600;}
.end-inter__title:after {content: ''; display: block; width: 155px; height: 155px; flex-shrink: 0; background: url('https://img.megastudyth.com/event/2023/end/interest_icon.png')no-repeat center center / cover;}
.end-inter__box {padding: 56px; margin-top: 12px; border: solid 1px #333; background: #fff; -webkit-border-radius: 12px; border-radius: 12px;}
.end-inter__tab {width: 464px; margin: 0 auto; background: #ddd; position: relative; -webkit-border-radius: 24px; border-radius: 24px;}
.end-inter__tab ul {display: flex; position: relative;}
.end-inter__tab ul li {width: 25%;}
.end-inter__tab ul li button {color: #999; width: 100%; height: 48px; font-size: 20px; font-weight: 600; display: flex; align-items: center; justify-content: center; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-inter__tab ul li button.active {color: #fff;}
.end-inter__tab span {display: block; height: 48px; width: 25%; background: #333; position: absolute; left: 0; top: 0; -webkit-border-radius: 24px; border-radius: 24px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}

.end-inter__cloud {padding-top: 40px; display: none;}
.end-inter__cloud .tagcloud {margin: 0 auto;}
.end-inter__cloud .tagcloud--item {padding: 12px 24px; color: #fff; font-size: 30px; font-weight: 600; -webkit-border-radius: 40px; border-radius: 40px; white-space: nowrap;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(1) {background: #0047FF;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(2) {background: #408BD0;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(3) {background: #55B8FF;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(4) {background: #94C0E9;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(5) {background: #408BD0;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(6) {background: #55B8FF;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(7) {background: #AAB8EB;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(8) {background: #94C0E9;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(9) {background: #AAB8EB;}
.end-inter__cloud#cloud1 .tagcloud--item:nth-child(10) {background: #55B8FF;}

.end-inter__cloud#cloud2 .tagcloud--item:nth-child(1) {background: #FF5C00;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(2) {background: #FF8D23;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(3) {background: #FFA370;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(4) {background: #F3C933;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(5) {background: #EBDAC2;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(6) {background: #FF8D23;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(7) {background: #F3C933;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(8) {background: #FFA370;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(9) {background: #FFB257;}
.end-inter__cloud#cloud2 .tagcloud--item:nth-child(10) {background: #FF8D23;}

.end-inter__cloud#cloud3 .tagcloud--item:nth-child(1) {background: #AD00FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(2) {background: #BE6CFF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(3) {background: #E962FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(4) {background: #DC88EA;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(5) {background: #E962FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(6) {background: #C5A6FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(7) {background: #DC88EA;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(8) {background: #C5A6FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(9) {background: #E962FF;}
.end-inter__cloud#cloud3 .tagcloud--item:nth-child(10) {background: #DC88EA;}

.end-inter__cloud#cloud4 .tagcloud--item:nth-child(1) {background: #01A407;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(2) {background: #14C899;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(3) {background: #7CCA53;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(4) {background: #61D2B5;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(5) {background: #56D5DE;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(6) {background: #7CCA53;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(7) {background: #56D5DE;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(8) {background: #7CCA53;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(9) {background: #61D2B5;}
.end-inter__cloud#cloud4 .tagcloud--item:nth-child(10) {background: #56D5DE;}

@media (max-width:1280px) {
	.end-inter__title p {font-size: 28px;}
	.end-inter__title h3 {font-size: 44px;}
}

@media (max-width:992px) {
	.end-inter__title p {font-size: 20px;}
	.end-inter__title h3 {font-size: 32px;}
	.end-inter__title:after {width: 104px; height: 104px;}
	.end-inter__box {padding: 32px;}
	.end-inter__cloud {padding-top: 16px;}
}

@media (max-width:768px) {
	.end-inter {margin-top: 56px; padding: 56px 0;}
	.end-inter__title {align-items; flex-end;}
	.end-inter__title p {font-size: 13px;}
	.end-inter__title h3 {font-size: 24px;}
	.end-inter__title:after {width: 88px; height: 88px; margin-bottom: -8px;}
	.end-inter__box {padding: 24px 16px;}
	.end-inter__tab {width: 100%;}
	.end-inter__tab ul li button {height: 40px; font-size: 16px;}
	.end-inter__tab span {height: 40px;}
	.end-inter__cloud {padding-top: 16px; padding-bottom: 32px; max-width: 240px; height: 240px; margin: 0 auto;}
	.end-inter__cloud .tagcloud {transform-origin: left top; transform: scale(0.6); -webkit-transform: scale(0.6);}
	.end-inter__cloud .tagcloud--item {padding: 12px 24px; color: #fff; font-size: 30px; font-weight: 600; -webkit-border-radius: 40px; border-radius: 40px; white-space: nowrap;}
}




.end-cbt {padding-top: 80px; padding-bottom: 120px; background: #333;}
.end-cbt__title {color: #fff; display: flex; align-items: center; justify-content: space-between;}
.end-cbt__title p {font-size: 32px;}
.end-cbt__title h3 {font-size: 56px; font-weight: 600;}
.end-cbt__title:after {content: ''; display: block; width: 143px; height: 104px; flex-shrink: 0; margin-left: 24px; background: url('https://img.megastudyth.com/event/2023/end/cbt_icon.png')no-repeat center center / cover;}
.end-cbt__box {padding: 56px; margin-top: 40px; border: solid 1px #333; background: #fff; -webkit-border-radius: 12px; border-radius: 12px;}
.end-cbt__tab {width: 348px; margin: 0 auto; background: #ddd; position: relative; -webkit-border-radius: 24px; border-radius: 24px;}
.end-cbt__tab ul {display: flex; position: relative;}
.end-cbt__tab ul li {width: 33.3333%;}
.end-cbt__tab ul li button {color: #999; width: 100%; height: 48px; font-size: 20px; font-weight: 600; display: flex; align-items: center; justify-content: center; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-cbt__tab ul li button.active {color: #fff;}
.end-cbt__tab span {display: block; height: 48px; width: 33.3333%; background: #333; position: absolute; left: 0; top: 0; -webkit-border-radius: 24px; border-radius: 24px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-cbt__cont {margin-top: 40px;}
.end-cbt__cont dl {display: flex; align-items: center; justify-content: space-between;}
.end-cbt__cont dl dt {font-size: 40px; color: #999; font-weight: 600;}
.end-cbt__cont dl dt span {color: #0082FF;}
.end-cbt__cont dl dd {font-size: 20px; color: #0082FF;}
.end-cbt__cont dl dd strong {font-size: 48px;}

@media (max-width:1280px) {
	.end-cbt__title p {font-size: 28px;}
	.end-cbt__title h3 {font-size: 44px;}
	.end-cbt__box {padding: 32px; margin-top: 24px;}
	.end-cbt__cont {margin-top: 24px;}
	.end-cbt__cont dl dt {font-size: 32px;}
	.end-cbt__cont dl dd {font-size: 20px;}
	.end-cbt__cont dl dd strong {font-size: 32px;}
}

@media (max-width:992px) {
	.end-cbt__title p {font-size: 20px;}
	.end-cbt__title h3 {font-size: 32px;}
	.end-cbt__box {padding: 24px; margin-top: 8px;}
	.end-cbt__cont {margin-top: 16px;}
	.end-cbt__cont dl dt {font-size: 24px;}
	.end-cbt__cont dl dd {font-size: 16px;}
	.end-cbt__cont dl dd strong {font-size: 24px;}
}

@media (max-width:768px) {
	.end-cbt {padding-top: 56px; padding-bottom: 56px;}
	.end-cbt__title p {font-size: 12px;}
	.end-cbt__title h3 {font-size: 24px;}
	.end-cbt__title:after {width: 86px; height: 63px; margin-left: 16px;}
	.end-cbt__tab {width: 100%;}
	.end-cbt__tab ul li button {height: 40px; font-size: 16px;}
	.end-cbt__tab span {height: 40px;}
	.end-cbt__cont dl dt {font-size: 14px;}
	.end-cbt__cont dl dd {font-size: 12px;}
	.end-cbt__cont dl dd strong {font-size: 16px;}
}



.end-cbt__grid {margin-top: 20px; display: grid; grid-template-rows: 1fr 1fr 1fr; grid-template-columns: 4fr 3fr; row-gap: 20px; column-gap: 20px;}
.end-cbt__item {}
.end-cbt__item:nth-child(1) {grid-row: 1 / 3;}
.end-cbt__item:nth-child(2) {}
.end-cbt__item:nth-child(3) {}
.end-cbt__item:nth-child(4) {grid-column: 1 / 3;}

.end-cbt__atcl {height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 40px; -webkit-border-radius: 12px; border-radius: 12px;}
.end-cbt__atcl > div {flex-grow: 1;}
.end-cbt__atcl h5 {font-size: 28px; font-weight: 600;}
.end-cbt__atcl h4 {font-size: 36px; font-weight: 600; margin-top: 12px;}
.end-cbt__atcl p {flex-shrink: 0; font-size: 20px; color: #999; margin-top: 24px;}

.end-cbt__atcl.red {background: #fce1e1; padding-bottom: 0;}
.end-cbt__atcl.red:after {content: ''; display: block; width: 408px; height: 260px; align-self: self-end; transform-origin: right bottom; background: url('https://img.megastudyth.com/event/2023/end/cbt_exam.png')no-repeat center center / cover;}
.end-cbt__atcl.red > div:after {content: ''; display: block; width: 86px; height: 90px; margin-top: 24px; background: url('https://img.megastudyth.com/event/2023/end/cbt_x.png')no-repeat center center / cover;}
.end-cbt__atcl.red h4 {color: #F74081;}
.end-cbt__atcl.ylw {background: #fcf4d9;}
.end-cbt__atcl.ylw h4 {color: #FF7E21;}
.end-cbt__atcl.blu {background: #effbff;}
.end-cbt__atcl.blu h4 {color: #0082FF;}
.end-cbt__atcl.grn {background: #effff3; flex-direction: row;}
.end-cbt__atcl.grn h4 {color: #2A8E40;}

.end-cbt__itv {position: relative; flex-shrink: 0; flex-grow: 0 !important;}
.end-cbt__itv a {display: block; width: 313px; overflow: hidden; position: relative; -webkit-border-radius: 12px; border-radius: 12px;}
.end-cbt__itv a:before {content: ''; display: block; width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin-top: -20px; margin-left: -20px; background: #0082FF; -webkit-border-radius: 50%; border-radius: 50%;}
.end-cbt__itv a:after {content: ''; display: block; position: absolute; left: 50%; top: 50%; margin-top: -7px; margin-left: -4px; width: 0px; height: 0px; border-style: solid; border-width: 7px 0 7px 11px; border-color: transparent transparent transparent #fff; transform: rotate(0deg);}
.end-cbt__itv dl {position: absolute; right: 100%; top: 50%; margin-right: 8px; width: 100%; background: #fff; padding: 20px 24px; -webkit-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.2); box-shadow: 0px 4px 12px 0px rgba(0,0,0,0.2); -webkit-transform: translate(0, -50%); transform: translate(0, -50%);}
.end-cbt__itv dl dt {display: flex; justify-content: space-between; align-items: center;}
.end-cbt__itv dl dt h6 {font-size: 18px;}
.end-cbt__itv dl dt span {height: 32px; display: flex; align-items: center; justify-content: center; padding: 0 12px; background: #E6F3FF; color: #0082FF; font-weight: 500; -webkit-border-radius: 24px; border-radius: 24px;}
.end-cbt__itv dl dd {font-size: 16px; color: #999; margin-top: 12px;}
.end-cbt__itv dl:after {position: absolute; left: 100%; bottom: 16px; content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 12px 0 0 24px; border-color: transparent transparent transparent #fff;}

.end-cbt__buy {height: 80px; padding: 0 40px; background: #0082FF; margin-top: 20px; display: flex; align-items: center; justify-content: space-between; -webkit-border-radius: 40px; border-radius: 40px; -webkit-box-shadow: 0px 4px 0px 0px rgba(50,106,172,1); box-shadow: 0px 4px 0px 0px rgba(50,106,172,1);}
.end-cbt__buy strong {font-size: 24px; font-weight: 600; color: #fff;}
.end-cbt__buy strong br {display: none;}
.end-cbt__buy span {display: flex; color: #fff; align-items: center; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-cbt__buy span em {display: block; width: 28px; height: 28px; margin-left: 24px; position: relative; background: #B2D9FF; -webkit-border-radius: 16px; border-radius: 16px;}
.end-cbt__buy span em:before,
.end-cbt__buy span em:after {content: ''; display: block; position: absolute; right: 8px; top: 50%;}
.end-cbt__buy span em:before {width: 28px; height: 2px; background: #172a5c; margin-top: -1px;}
.end-cbt__buy span em:after {width: 10px; height: 10px; border-top: solid 2px #172a5c; border-right: solid 2px #172a5c; margin-top: -5px; box-sizing: border-box; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.end-cbt__buy:hover span {-webkit-transform: translate(16px, 0); transform: translate(16px, 0);}

@media (max-width:1280px) {
	.end-cbt__atcl {padding: 24px;}
	.end-cbt__atcl h5 {font-size: 20px;}
	.end-cbt__atcl h4 {font-size: 24px; margin-top: 0;}
	.end-cbt__atcl p {font-size: 14px; margin-top: 8px;}
	.end-cbt__atcl.red:after {width: 286px; height: 182px;}
	.end-cbt__itv a {width: 240px;}
	.end-cbt__itv dl {width: 120%; padding: 16px;}
	.end-cbt__itv dl dt h6 {font-size: 14px;}
	.end-cbt__itv dl dt span {height: 24px; padding: 0 8px; font-size: 13px;}
	.end-cbt__itv dl dd {font-size: 14px; margin-top: 8px;}
}

@media (max-width:992px) {
	.end-cbt__grid {margin-top: 10px; row-gap: 10px; column-gap: 10px;}
	.end-cbt__atcl {padding: 16px;}
	.end-cbt__atcl h5 {font-size: 18px;}
	.end-cbt__atcl h4 {font-size: 20px;}
	.end-cbt__atcl.red:after {width: 204px; height: 130px;}
	.end-cbt__atcl.red > div:after {width: 61px; height: 63px; margin-top: 8px;}
	.end-cbt__itv a {width: 200px;}
	.end-cbt__buy {margin-top: 10px; height: 64px; padding: 0 24px;}
	.end-cbt__buy strong {font-size: 20px;}
}

@media (max-width:768px) {
	.end-cbt__grid {display: block;}
	.end-cbt__item {margin-top: 10px;}
	.end-cbt__atcl {display: block;}
	.end-cbt__atcl.red:after {margin-top: 16px; margin-left: auto; margin-right: auto;}
	.end-cbt__atcl.red > div {position: relative; padding-right: 80px;}
	.end-cbt__atcl.red > div:after {width: 43px; height: 45px; margin-top: 0; position: absolute; right: 0; top: 0;}
	.end-cbt__itv {margin-top: 16px;}
	.end-cbt__itv a {width: 100%;}
	.end-cbt__itv dl {position: static; margin-top: 8px; width: 100%; -webkit-transform: translate(0, 0); transform: translate(0, 0);}
	.end-cbt__itv dl:after {display: none;}
	.end-cbt__buy {height: auto; flex-direction: column; padding: 8px 24px; text-align: center; -webkit-border-radius: 24px; border-radius: 24px;}
	.end-cbt__buy strong {font-size: 16px;}
	.end-cbt__buy strong br {display: block;}
	.end-cbt__buy span {margin-top: 8px;}
	.end-cbt__buy span em {margin-left: 16px;}

}










.end-sale {padding: 80px 0;}
.end-sale__title {display: flex; align-items: center; justify-content: space-between;}
.end-sale__title p {font-size: 32px;}
.end-sale__title h3 {font-size: 56px; font-weight: 600;}
.end-sale__title .end-sale__time {order: 2;}
.end-sale__time {flex-shrink: 0; margin-left: 24px; border: solid 1px #333; height: 44px; padding-left: 16px; background: #fff; text-align: center; font-size: 24px; position: relative; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 8px; border-radius: 8px;}
.end-sale__time:before {content: ''; display: block; width: 106px; height: 96px; position: absolute; right: 100%; top: 50%; margin-top: -56px; margin-right: -40px; background: url('https://img.megastudyth.com/event/2023/end/sale_time.png')no-repeat center center / cover;}
.end-sale__time#week {width: 240px; justify-content: flex-start; padding-left: 40px;}
.end-sale__time#week:before {width: 97px; height: 97px; background: url('https://img.megastudyth.com/event/2023/end/sale_week.png')no-repeat center center / cover;}
.end-sale__time#week span.days {background: #F66F7C; color: #fff; padding: 0 8px; margin-right: 8px; -webkit-border-radius: 8px; border-radius: 8px;}
.end-sale__time#week span.days:after {content: 'Day';}
.end-sale__time#day {width: 160px;}
.end-sale__time#day span.days {display: none;}
.end-sale__time span {margin-right: 4px;}
.end-sale__time span:last-child {margin-right: 0;}

.end-sale__rcm {margin-top: 32px; text-align: center; animation: bounce 0.5s infinite alternate;}
.end-sale__rcm p {display: inline-flex; height: 48px; padding: 0 16px; font-weight: 600; position: relative; border: solid 1px #3D4B58; align-items: center; -webkit-border-radius: 8px; border-radius: 8px;}
.end-sale__rcm p span {display: inline-block; color: #0082FF;}
.end-sale__rcm p:after {content: ''; display: block; background: #fff; box-sizing: border-box; width: 12px; height: 12px; position: absolute; left: 50%; margin-left: -6px; top: 100%; margin-top: -5px; border-right: solid 1px #333; border-bottom: solid 1px #333; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
@keyframes bounce {0%{transform: translate3d(0, 0, 0);}100%{transform: translate3d(0, 10px, 100px);}}

.end-sale__list {margin-top: 24px;}
.end-sale__list li {margin-bottom: 20px;}
.end-sale__list li:last-child {margin-bottom: 0;}
.end-sale__box {border: solid 1px #333; padding: 32px 40px; position: relative; -webkit-border-radius: 12px; border-radius: 12px;}
.end-sale__box dl {display: flex;}
.end-sale__box dl dt {flex-shrink: 0; order: 2; margin-left: 80px;}
.end-sale__box dl dt img {display: block; width: 376px; -webkit-border-radius: 8px; border-radius: 8px;}
.end-sale__box dl dd {flex-grow: 1;}
.end-sale__name {display: flex; align-items: center; padding-bottom: 16px; margin-bottom: 16px; border-bottom: solid 1px #ddd; position: relative;}
.end-sale__name:after {content: ''; display: block; width: 5px; height: 5px; position: absolute; left: 100%; bottom: -3px; background: #ddd; -webkit-border-radius: 50%; border-radius: 50%;}
.end-sale__name:before {content: ''; display: block; flex-shrink: 0; margin-right: 16px; width: 59px; height: 56px;}
.end-sale__name span {}
.end-sale__name h4 {font-size: 32px; font-weight: 600; margin-top: 8px;}
.end-sale__detail {}
.end-sale__detail h5 {font-size: 20px; font-weight: 600;}
.end-sale__detail p {margin-top: 12px;}
.end-sale__detail p span {color: #0A32BE;}
.end-sale__detail a {display: inline-flex; align-items: center; justify-content: space-between; position: relative; font-weight: 600; padding: 0 16px; height: 40px; border: solid 1px #333; background: #fff; margin-top: 20px; -webkit-border-radius: 20px; border-radius: 20px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-sale__detail a:after {content: ''; display: block; width: 16px; height: 2px; background: #333; margin-left: 16px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-sale__detail a:before {content: ''; position: absolute; right: 16px; top: 50%; margin-top: -4px;  display: block; width: 0; height: 0; border-style: solid; border-width: 4px 0 4px 4px; border-color: transparent transparent transparent #333333; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-sale__detail a:hover {background: #0082FF; border-color: #0082FF; color: #fff;}
.end-sale__detail a:hover:after {background: #fff;}
.end-sale__detail a:hover:before {border-color: transparent transparent transparent #fff;}

.end-sale__box.blu {background: #EDF6FF;}
.end-sale__box.blu .end-sale__name {border-bottom-color: #B8CDE1;}
.end-sale__box.blu .end-sale__name:after {background: #B8CDE1;}
.end-sale__box.blu .end-sale__name:before {background: url('https://img.megastudyth.com/event/2023/end/sale_icon_1.png')no-repeat center center / cover;}
.end-sale__box.blu .end-sale__name h4 {color: #1A3475;}
.end-sale__box.ylw {background: #FFF9EF;}
.end-sale__box.ylw .end-sale__name {border-bottom-color: #CBC0B2;}
.end-sale__box.ylw .end-sale__name:after {background: #CBC0B2;}
.end-sale__box.ylw .end-sale__name:before {background: url('https://img.megastudyth.com/event/2023/end/sale_icon_2.png')no-repeat center center / cover;}
.end-sale__box.ylw .end-sale__name h4 {color: #5C4117;}
.end-sale__box.grn {background: #EFFAEF;}
.end-sale__box.grn .end-sale__name {border-bottom-color: #BAD7BA;}
.end-sale__box.grn .end-sale__name:after {background: #BAD7BA;}
.end-sale__box.grn .end-sale__name:before {background: url('https://img.megastudyth.com/event/2023/end/sale_icon_3.png')no-repeat center center / cover;}
.end-sale__box.grn .end-sale__name h4 {color: #1A7549;}

.end-sale__more {margin-top: 32px; text-align: center;}
.end-sale__more a {padding: 0 24px; border: solid 1px #333; font-size: 20px; font-weight: 600; height: 52px; -webkit-border-radius: 32px; border-radius: 32px; display: inline-flex; align-items: center; justify-content: center; -webkit-box-shadow: 0px 4px 0px 0px rgba(0,0,0,1); box-shadow: 0px 4px 0px 0px rgba(0,0,0,1);}
.end-sale__more a:before {content: ''; display: block; width: 20px; height: 20px; margin-right: 8px; background: url('https://img.megastudyth.com/event/2023/end/sale_more.png')no-repeat center center / cover;}

.end-sale__badge {width: 240px; height: 270px; padding-top: 16px; position: absolute; right: 0; top: 0; right: -104px; top: -104px; -webkit-transform: rotate(30deg); transform: rotate(30deg); display: flex; flex-direction: column; align-items: center; justify-content: center; background: url('https://img.megastudyth.com/event/2023/end/sale_badge.png')no-repeat center center / cover;}
.end-sale__badge p {font-size: 18px; font-weight: 600; color: #fff;}
.end-sale__badge h5 {font-size: 28px; font-weight: 600; color: #F2DF2D;}


@media (max-width:1280px) {
	.end-sale__title p {font-size: 24px;}
	.end-sale__title h3 {font-size: 48px;}
	.end-sale__box {padding: 24px;}
	.end-sale__box dl dt {margin-left: 40px;}
	.end-sale__box dl dt img {width: 320px;}
	.end-sale__name {padding-bottom: 8px; margin-bottom: 8px;}
	.end-sale__name h4 {font-size: 24px; margin-top: 0;}
	.end-sale__detail h5 {font-size: 16px;}
	.end-sale__detail p {margin-top: 4px; font-size: 13px;}
	.end-sale__detail a {margin-top: 12px;}

	.end-sale__badge {width: 192px; height: 216px; right: -64px; top: -64px;}
	.end-sale__badge p {font-size: 16px;}
	.end-sale__badge h5 {font-size: 24px;}

}

@media (max-width:992px) {
	.end-sale__title p {font-size: 18px;}
	.end-sale__title h3 {font-size: 40px;}
	.end-sale__time {margin-left: 16px; height: 32px; padding-left: 8px; font-size: 18px;}
	.end-sale__time:before {width: 74px; height: 67px; margin-top: -36px; margin-right: -28px;}
	.end-sale__time#week {width: 176px; padding-left: 24px;}
	.end-sale__time#week:before {width: 80px; height: 80px;}
	.end-sale__time#day {width: 120px;}
	.end-sale__box {padding: 24px;}
	.end-sale__box dl dt {margin-left: 40px;}
	.end-sale__box dl dt img {width: 240px;}
	.end-sale__more {margin-top: 24px;}
}

@media (max-width:768px) {
	.end-sale {padding: 56px 0;}
	.end-sale__title {display: block; text-align: center;}
	.end-sale__title p {font-size: 12px;}
	.end-sale__title h3 {font-size: 26px; margin-top: 8px;}
	.end-sale__time {margin-left: auto; margin-right: auto;}
	.end-sale__time#week:before {width: 64px; height: 64px;}
	.end-sale__rcm {margin-top: 16px;}
	.end-sale__rcm p {height: 32px; font-size: 12px;}
	.end-sale__box dl {display: block;}
	.end-sale__box dl dt {margin-left: 0;}
	.end-sale__box dl dt img {width: 100%;}
	.end-sale__name {display: block; margin-top: 16px;}
	.end-sale__name:before {display: none;}
	.end-sale__name span {font-size: 12px;}
	.end-sale__name h4 {font-size: 18px;}
	.end-sale__detail {text-align: center;}
	.end-sale__detail h5 {font-size: 14px; text-align: left;}
	.end-sale__detail p {font-size: 12px; text-align: left;}
	.end-sale__detail a {margin-top: 12px;}
	.end-sale__more a {padding: 0 16px; font-size: 16px; height: 40px;}
	.end-sale__more a:before {width: 16px; height: 16px;}
	.end-sale__badge {width: 120px; height: 135px; right: -48px; top: -40px; padding-top: 8px;}
	.end-sale__badge p {font-size: 11px; line-height: 1.1;}
	.end-sale__badge h5 {font-size: 16px;}
}








.end-oneday {padding: 80px 0; background: #FDF9EF;}
.end-oneday__title {margin-bottom: 56px; display: flex; align-items: center; justify-content: space-between;}
.end-oneday__title p {font-size: 32px;}
.end-oneday__title h3 {font-size: 56px; font-weight: 600;}

.end-oneday__list {margin: 0 -8px;}
.end-oneday__list .slick-list {}
.end-oneday__list .slick-slide {padding: 0 8px; }
.end-oneday__list .slick-slide > div {position: relative; padding-bottom: 264px;}
.end-oneday__list .slick-slide > div > div {cursor: pointer; display: block !important; width: auto !important; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-oneday__list .slick-slide > div > div {left: 0; right: 50%;}
.end-oneday__list .slick-center > div > div {left: -50%; right: -50%; z-index: 2 !important;}
.end-oneday__list .slick-center + .slick-slide > div > div {left: 50%; right: 0;}
.end-oneday__list .slick-arrow {display: block; width: 48px; height: 48px; background: #333; text-indent: -9999px; position: absolute; top: 50%; margin-top: -24px; z-index: 1; -webkit-border-radius: 50%; border-radius: 50%;}
.end-oneday__list .slick-prev {left: -16px;}
.end-oneday__list .slick-next {right: -16px;}
.end-oneday__list .slick-arrow:after {content: ''; display: block; box-sizing: border-box; width: 10px; height: 10px; position: absolute; left: 50%; top: 50%; margin-top: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.end-oneday__list .slick-prev:after {border-left: solid 2px #fff; border-bottom: solid 2px #fff; margin-left: -3px;}
.end-oneday__list .slick-next:after {border-top: solid 2px #fff; border-right: solid 2px #fff; margin-left: -7px;}

.end-oneday__box {height: 100%; border: solid 1px #333; overflow: hidden; display: flex; flex-direction: column; -webkit-border-radius: 12px; border-radius: 12px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.end-oneday__box dt {flex-shrink: 0; height: 56px; background: #EFE4D4; font-size: 20px; font-weight: 600; display: flex; align-items: center; justify-content: center;}
.end-oneday__box dd {flex-grow: 1; background: #fff;}
.end-oneday__summary {height: 100%; padding: 20px; display: flex; flex-direction: column; justify-content: space-between;}
.end-oneday__summary ul {}
.end-oneday__summary ul li {font-weight: 600; margin-bottom: 8px;}
.end-oneday__summary ul li:last-child {margin-bottom: 0;}
.end-oneday__summary img {width: 65px;}

.end-oneday__item {height: 100%; padding: 24px; display: none; align-items: center; justify-content: center;}
.end-oneday__item li {width: 50%; height: 100%; padding: 0 8px;}
.end-oneday__coupon {display: flex; height: 100%; padding: 24px; max-width: 320px; margin: 0 auto; background: #D9D9D9; color: #999; position: relative; flex-direction: column; justify-content: space-between; -webkit-border-radius: 8px; border-radius: 8px;}
.end-oneday__coupon:before,
.end-oneday__coupon:after {content: ''; display: block; width: 28px; height: 28px; background: #fff; position: absolute; top: 50%; margin-top: -14px; -webkit-border-radius: 16px; border-radius: 16px;}
.end-oneday__coupon:before {left: -14px;}
.end-oneday__coupon:after {right: -14px;}
.end-oneday__coupon > div:before {content: ''; display: block; width: 101px; height: 95px; position: absolute; left: 50%; top: 50%; background: url('https://img.megastudyth.com/event/2023/end/oneday_logo_2.png')no-repeat center center / cover; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.end-oneday__coupon h5 {font-size: 16px; font-weight: 600; position: relative;}
.end-oneday__coupon p {font-size: 14px; margin-top: 8px; position: relative;}
.end-oneday__coupon a {width: 112px; height: 32px; position: relative; padding-left: 12px; padding-right: 2px; font-size: 13px; font-weight: 500; background: #fff; color: #999; align-self: flex-end; display: flex; align-items: center; justify-content: space-between; -webkit-border-radius: 16px; border-radius: 16px;}
.end-oneday__coupon a:after {content: ''; display: block; width: 28px; height: 28px; background: #999 url('https://img.megastudyth.com/event/2023/end/oneday_down.png')no-repeat center center / 20px auto; -webkit-border-radius: 16px; border-radius: 16px;}

.end-oneday__item.active .end-oneday__coupon {background: #0082FF;  color: #fff;}
.end-oneday__item.active .end-oneday__coupon > div:before {background: url('https://img.megastudyth.com/event/2023/end/oneday_logo_1.png')no-repeat center center / cover;}
.end-oneday__item.active .end-oneday__coupon a {color: #0082FF;}
.end-oneday__item.active .end-oneday__coupon a:after {background: #0082FF url('https://img.megastudyth.com/event/2023/end/oneday_down.png')no-repeat center center / 20px auto;}
.end-oneday__list .slick-center .end-oneday__summary {display: none;}
.end-oneday__list .slick-center .end-oneday__item {display: flex;}


@media (max-width:1280px) {
	.end-oneday__title p {font-size: 24px;}
	.end-oneday__title h3 {font-size: 48px;}
}

@media (max-width:992px) {
	.end-oneday__title {margin-bottom: 32px;}
	.end-oneday__title p {font-size: 18px;}
	.end-oneday__title h3 {font-size: 40px;}
	.end-oneday__list {margin: 0 -4px;}
	.end-oneday__list .slick-slide {padding: 0 4px;}
	.end-oneday__list .slick-slide > div {padding-bottom: 240px;}
	.end-oneday__box dt {height: 40px; font-size: 16px;}
	.end-oneday__summary ul li {font-size: 13px; margin-bottom: 4px;}
	.end-oneday__item {padding: 16px 12px;}
	.end-oneday__coupon {padding: 16px;}
}

@media (max-width:768px) {
	.end-oneday {padding: 56px 0;}
	.end-oneday__title {display: block; text-align: center; margin-bottom: 24px;}
	.end-oneday__title p {font-size: 14px;}
	.end-oneday__title h3 {font-size: 28px;}
	.end-oneday__title .end-sale__time {margin-top: 16px;}
	.end-oneday__list {padding: 0 10%;}
	.end-oneday__list .slick-list {overflow: visible;}
	.end-oneday__list .slick-slide > div {padding-bottom: 0;}
	.end-oneday__list .slick-slide > div > div {position: relative; left: 0; right: 0;}
	.end-oneday__list .slick-center > div > div {left: 0; right: 0;}
	.end-oneday__list .slick-center + .slick-slide > div > div {left: 0;}
	.end-oneday__box {height: 240px;}
	.end-oneday__summary {display: none;}
	.end-oneday__item {display: flex; padding: 12px 16px; flex-direction: column;}
	.end-oneday__item li {width: 100%; height: 50%; padding: 4px 0;}
	.end-oneday__coupon {padding: 16px;}
	.end-oneday__coupon:before,
	.end-oneday__coupon:after {width: 16px; height: 16px; margin-top: -8px;}
	.end-oneday__coupon:before {left: -8px;}
	.end-oneday__coupon:after {right: -8px;}
	.end-oneday__coupon > div:before {width: 60px; height: 57px;}
	.end-oneday__coupon p {font-size: 13px; margin-top: 0;}
	.end-oneday__coupon a {width: 56px; height: auto; position: absolute; right: 0; top: 0; bottom: 0; padding-left: 8px; padding-right: 8px; font-size: 12px; background: #adb5bb; color: #ddd; text-align: center; flex-direction: column; justify-content: center; -webkit-border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0;}
	.end-oneday__coupon a:after {content: ''; display: block; width: 20px; height: 20px; opacity: 0.5; background: url('https://img.megastudyth.com/event/2023/end/oneday_down.png')no-repeat center center / cover !important; -webkit-border-radius: 0; border-radius: 0;}
	.end-oneday__item.active .end-oneday__coupon a {background: #4c5a67; color: #fff;}
	.end-oneday__item.active .end-oneday__coupon a:after {opacity: 1;}
}




.end-last {padding: 80px 0; background: #333;}
.end-last h3 {font-size: 40px; font-weight: 600; color: #fff;}
.end-last p {font-size: 24px; color: #C2C2C2; margin-top: 24px;}
.end-last p span {color: #3fa1ff;}
.end-fixed {position: fixed; left: 0; right: 0; bottom: 24px; z-index: 10; margin: 0 auto; max-width: 600px; height: 48px; padding: 0 12px 0 24px; background: #333; box-shadow: 0px 0px 12px 0px #0000003D; display: flex; align-items: center; justify-content: space-between; -webkit-border-radius: 24px; border-radius: 24px;}
.end-fixed span {display: flex; align-items: center; color: #fff; font-size: 24px; font-weight: 400;}
.end-fixed span strong {color: #FFE456; font-weight: 400; margin-left: 4px;}
.end-fixed span:before {flex-shrink: 0; content: ''; display: block; width: 52px; height: 28px; margin-right: 12px; background: url('https://img.megastudyth.com/event/2023/end/fixed_coupon.png')no-repeat center center / cover;}
.end-fixed em {flex-shrink: 0; display: block; width: 24px; height: 24px; background: #fff; -webkit-border-radius: 50%; border-radius: 50%; position: relative; margin-left: 16px;}
.end-fixed em:after {content: ''; display: block; box-sizing: border-box; width: 8px; height: 8px; border-top: solid 2px #333; border-right: solid 2px #333; position: absolute; left: 50%; top: 50%; margin-top: -4px; margin-left: -5px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

@media (max-width:1280px) {
	.end-last h3 {font-size: 34px;}
	.end-last p {font-size: 20px; margin-top: 16px;}
}

@media (max-width:992px) {
	.end-last h3 {font-size: 26px;}
	.end-last p {font-size: 18px; margin-top: 8px;}
	.end-fixed {left: 16px; bottom: 16px; right: auto; margin: 0; width: auto;}
	.end-fixed span {font-size: 20px;}
}

@media (max-width:768px) {
	.end-last {padding: 56px 0;}
	.end-last h3 {font-size: 20px;}
	.end-last p {font-size: 14px;}
	.end-fixed {left: 8px; bottom: 8px; padding-left: 16px;}
	.end-fixed span {font-size: 14px; display: block; position: relative; padding-left: 48px; line-height: 1.1;}
	.end-fixed span:before {width: 40px; height: 20px; position: absolute; left: 0; top: 50%; margin-top: -10px;}
	.end-fixed span strong {display: block; margin-left: 0;}
}






.Modal-overlay {display: table; position: fixed; z-index: 1001; left: 0; top: 0; width: 100%; height: 100%; background: rgba(51,51,51,0.7);}
.Modal-inner {display: table-cell; width: 100%; vertical-align: middle; padding-left: 15px; padding-right: 15px;}
.Modal-box {width: 100%; max-width: 620px; margin: 0 auto; position: relative;}
.video-container {padding-bottom: 56.25%; position: relative; background: #000;}
.video-container iframe {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.Modal-close {position: absolute; right: 0; bottom: 100%; z-index: 1; width: 40px; padding-top: 35px; font-size: 12px; text-align: center; color: #fff;}
.Modal-close:before,
.Modal-close:after {content: ''; display: block; width: 36px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; margin-left: -18px; margin-top: -6px;}
.Modal-close:before {-webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.Modal-close:after {-webkit-transform: rotate(45deg); transform: rotate(45deg);}








