@charset "utf-8";


/* 모의예측 */
#plan * {box-sizing: border-box;}
#plan {display: flex; flex-direction: column; background: url('https://img.megastudyth.com/plan/plan_bg.jpg')no-repeat center center / cover;}
#plan .container {max-width: 1180px !important;}
.plan-top {flex-shrink: 0; display: flex;}
.plan-top dl {padding: 64px 0;}
.plan-top dl dt {text-align: center;}
.plan-top dl dt h2 {font-size: 34px; font-weight: 600; line-height: 1.1;}
.plan-top dl dt h2 span {color: #0082FF;}
.plan-top dl dt p {font-size: 14px; color: #333; margin-top: 8px; line-height: 1.3;}
.plan-top dl dd {align-self: flex-end; margin-top: 40px;}
.plan-top dl dd ul {overflow: hidden; display: flex; margin: 0 -10px;}
.plan-top dl dd ul li {position: relative; width: 33.3333%; padding: 0 10px;}
.plan-top dl dd ul li:before {display: block; color: #54B7FF; flex-shrink: 0; font-size: 12px;}
.plan-top dl dd ul li:nth-child(1):before {content: '01';}
.plan-top dl dd ul li:nth-child(2):before {content: '02';}
.plan-top dl dd ul li:nth-child(3):before {content: '03';}
.plan-top dl dd ul li span {display: block; position: relative; z-index: 2; font-size: 14px; color: #54B7FF; margin-top: 8px; padding-top: 8px; border-top: solid 1px #54B7FF;}
.plan-top dl dd ul li span:after {content: ''; display: block; box-sizing: border-box; position: absolute; right: 0; top: 0; margin-top: -3px; width: 5px; height: 5px; border-top: solid 1px #54B7FF; border-right: solid 1px #54B7FF; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.plan-top dl dd ul li.active:before {color: #0082FF;}
.plan-top dl dd ul li.active span {color: #0082FF; border-top-color: #0082FF; font-weight: 700;}
.plan-top dl dd ul li.active span:after {border-color: #0082FF;}

.plan-bg {padding-bottom: 64px; flex-grow: 1;}
.plan-load {background: #fff; padding: 56px; display: flex; flex-direction: column; align-items: center; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-cont {flex-grow: 1; width: 100%;}
.plan-bot {width: 100%; margin-top: 56px; position: relative; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between;}
.plan-bot button {height: 44px; padding: 0 24px; color: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 30px; border-radius: 30px;}
.plan-bot button:disabled {cursor: not-allowed; opacity: 0.5;}
.plan-bot button.plan-bot__prev {background: #666;}
.plan-bot button.plan-bot__next {background: #0082FF;}
.plan-bot button.plan-bot__prev:before,
.plan-bot button.plan-bot__next:after {content: ''; display: block; width: 8px; height: 8px; border-top: solid 2px #fff; box-sizing: border-box;}
.plan-bot button.plan-bot__prev:before {margin-right: 16px; border-left: solid 2px #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.plan-bot button.plan-bot__next:after {margin-left: 16px; border-right: solid 2px #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.plan-cont.sm,
.plan-bot.sm {max-width: 820px;}

@media(max-width:1280px){
	#plan .container {padding-left: 16px; padding-right: 16px;}
	.plan-top dl {padding: 40px 0;}
	.plan-top dl dt h2 {font-size: 30px;}
	.plan-top dl dt p {font-size: 13px;}
	.plan-top dl dd {margin-top: 24px;}
	.plan-top dl dd ul li span {font-size: 12px;}
	.plan-load {padding: 32px;}
}

@media(max-width:992px){
	.plan-top dl {padding: 32px 0;}
	.plan-top dl dt h2 {font-size: 26px;}
	.plan-top dl dt p {font-size: 12px;}
	.plan-top dl dd ul li span {font-size: 11px;}
}

@media(max-width:768px){
	.plan-top dl {padding: 24px 0; display: block;}
	.plan-top dl dt h2 {font-size: 22px;}
	.plan-top dl dt p {font-size: 10px; margin-top: 4px;}
	.plan-top dl dd {margin-top: 16px;}
	.plan-top dl dd ul {margin: 0 -4px;}
	.plan-top dl dd ul li {padding: 0 4px;}
	.plan-top dl dd ul li span {font-size: 10px; padding-top: 4px; margin-top: 4px;}
	.plan-bg {}
	.plan-load {margin: 0 -16px; padding: 32px 16px; -webkit-border-radius: 0; border-radius: 0;}
	.plan-bot {margin-top: 32px;}
	.plan-bot button {height: 36px; padding: 0; font-size: 12px; width: 80px;}
	.plan-bot button.plan-bot__prev:before,
	.plan-bot button.plan-bot__next:after {width: 6px; height: 6px;}
	.plan-bot button.plan-bot__prev:before {margin-right: 8px;}
	.plan-bot button.plan-bot__next:after {margin-left: 8px; }
}


.plan-main {}
.plan-main > dt {text-align: center; font-size: 16px; color: #8A8A8A;}
.plan-main > dd {margin-top: 32px;}
.plan-main > dd ul {margin: 0 -10px; display: flex; align-items: center; justify-content: center;}
.plan-main > dd ul li {padding: 0 10px; width: 50%;}
.plan-main > dd ul li button {width: 100%;}
.plan-main > dd ul li button dl {position: relative; overflow: hidden; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-main > dd ul li button dl dt {position: relative;}
.plan-main > dd ul li button dl dt img {display: block; width: 100%;}
.plan-main > dd ul li button dl dd {padding: 16px; background: #000; color: #fff; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.plan-main > dd ul li button dl dd h5 {font-size: 18px; font-weight: 600;}
.plan-main > dd ul li button dl dd p {font-size: 13px; font-weight: 300;}
.plan-main > dd ul li button.active {animation: bounce 0.5s infinite alternate;}
.plan-main__start {margin-top: 48px; display: flex; align-items: center; justify-content: center;}
.plan-main__start button {width: 270px; height: 60px; background: #0082FF; color: #fff; font-size: 18px; font-weight: 700; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 40px; border-radius: 40px;}
.plan-main__start button:disabled {background: #ddd;}
@keyframes bounce {0%{transform: translate3d(0, 0, 0);}100%{transform: translate3d(0, -10px, 100px);}}

@media(max-width:1280px){
	.plan-main > dd ul li button h5 {font-size: 16px;}
	.plan-main__start button {width: 240px; height: 56px; font-size: 16px;}
}

@media(max-width:992px){
	.plan-main > dd ul {margin: 0 -8px;}
	.plan-main > dd ul li {padding: 0 8px;}
	.plan-main > dd ul li button dl dd h5 {font-size: 16px;}
	.plan-main > dd ul li button dl dd p {font-size: 11px;}
	.plan-main__start {margin-top: 24px;}
	.plan-main__start button {width: 200px; height: 48px; font-size: 14px;}
}

@media(max-width:768px){
	.plan-main > dt {font-size: 14px;}
	.plan-main > dd {margin-top: 24px;}
	.plan-main > dd ul {margin: 0; display: block;}
	.plan-main > dd ul li {padding: 0; margin-bottom: 8px; width: 100%;}
	.plan-main > dd ul li:last-child {margin-bottom: 0;}
	.plan-main > dd ul li button dl dd h5 {font-size: 14px;}
	.plan-main > dd ul li button dl dd p {font-size: 10px;}
	.plan-main > dd ul li button img {flex-shrink: 0; width: 120px; margin-right: 16px;}
	.plan-main__start button {width: 136px; height: 40px; font-size: 13px;}
}









.plan-svy__title {text-align: center; font-size: 14px; color: #8A8A8A; font-weight: 400;}
.plan-svy__question {position: relative;}
.plan-svy__card {display: none; margin-top: 24px;}
.plan-svy__card h5 {text-align: center; font-size: 22px; text-align: center; font-weight: 700; padding: 32px; border: solid 1px #F2F2F4; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-svy__card ul {display: flex; margin: 0 -12px; padding-top: 24px;}
.plan-svy__card ul li {width: 25%; padding: 0 12px;}
.plan-svy__card ul li input[type="radio"] {display: none;}
.plan-svy__card ul li input[type="radio"] + label {padding: 48px 16px; min-height: 220px; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; cursor: pointer; -webkit-border-radius: 20px; border-radius: 20px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.plan-svy__card ul li input[type="radio"] + label p {font-size: 13px; text-align: center; margin-top: 24px; line-height: 1.3; flex-grow: 1;}
.plan-svy__card ul li input[type="radio"] + label:before {content: ''; display: block; width: 26px; height: 26px; flex-shrink: 0;}
.plan-svy__card ul li:nth-child(1) input[type="radio"] + label {background: #FFFDF8; border: solid 8px rgba(255, 182, 0, 0.1);}
.plan-svy__card ul li:nth-child(2) input[type="radio"] + label {background: #FFF8FF; border: solid 8px rgba(255, 0, 255, 0.1);}
.plan-svy__card ul li:nth-child(3) input[type="radio"] + label {background: #FFF7F7; border: solid 8px rgba(255, 0, 0, 0.1);}
.plan-svy__card ul li:nth-child(4) input[type="radio"] + label {background: #F9F9FF; border: solid 8px rgba(0, 0, 255, 0.1);}
.plan-svy__card ul li:nth-child(1).active input[type="radio"] + label {border-color: rgba(255, 182, 0, 1);}
.plan-svy__card ul li:nth-child(2).active input[type="radio"] + label {border-color: rgba(255, 0, 255, 1);}
.plan-svy__card ul li:nth-child(3).active input[type="radio"] + label {border-color: rgba(255, 0, 0, 1);}
.plan-svy__card ul li:nth-child(4).active input[type="radio"] + label {border-color: rgba(0, 0, 255, 1);}
.plan-svy__card ul li:nth-child(1) input[type="radio"] + label:hover {border-color: rgba(255, 182, 0, 1);}
.plan-svy__card ul li:nth-child(2) input[type="radio"] + label:hover {border-color: rgba(255, 0, 255, 1);}
.plan-svy__card ul li:nth-child(3) input[type="radio"] + label:hover {border-color: rgba(255, 0, 0, 1);}
.plan-svy__card ul li:nth-child(4) input[type="radio"] + label:hover {border-color: rgba(0, 0, 255, 1);}
.plan-svy__card ul li:nth-child(1) input[type="radio"] + label:before {background: url('https://img.megastudyth.com/plan/survey_icon_1.png')no-repeat center center / 100% auto;}
.plan-svy__card ul li:nth-child(2) input[type="radio"] + label:before {background: url('https://img.megastudyth.com/plan/survey_icon_2.png')no-repeat center center / 100% auto;}
.plan-svy__card ul li:nth-child(3) input[type="radio"] + label:before {background: url('https://img.megastudyth.com/plan/survey_icon_3.png')no-repeat center center / 100% auto;}
.plan-svy__card ul li:nth-child(4) input[type="radio"] + label:before {background: url('https://img.megastudyth.com/plan/survey_icon_4.png')no-repeat center center / 100% auto;}
.plan-svy__bot {margin-top: 40px; display: flex; align-items: center; justify-content: center;}
.plan-svy__bot button {width: 40px; height: 40px; background: #ddd; display: flex; align-items: center; justify-content: center;}
.plan-svy__dots {margin-top: 24px; display: flex; align-items: center; justify-content: center;}
.plan-svy__dots li {display: block; width: 10px; height: 10px; background: #E6E6E6; cursor: pointer; margin: 0 5px; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-svy__dots li.active {background: #0082FF;}
.plan-svy__arrow {display: block; width: 40px; height: 40px; background: none; opacity: 0.3; text-indent: -9999px; position: absolute; bottom: 110px; margin-bottom: -20px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.plan-svy__arrow:hover {opacity: 1;}
.plan-svy__prev {right: 100%; margin-right: 10px;}
.plan-svy__next {left: 100%; margin-left: 10px;}
.plan-svy__arrow:after {content: ''; display: block; width: 20px; height: 20px; border-top: solid 3px #444; position: absolute; left: 50%; top: 50%; margin-top: -10px;}
.plan-svy__prev:after {border-left: solid 3px #444; margin-left: -4px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.plan-svy__next:after {border-right: solid 3px #444; margin-left: -16px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.plan-svy__result {display: none;}
.plan-svy__result dt h4 {font-size: 20px; text-align: center; font-weight: 400; line-height: 1.2;}
.plan-svy__result dt h4 strong {font-weight: 700;}
.plan-svy__result dt ul {width: 100%; max-width: 560px; margin: 40px auto 0; border-top: solid 1px #E9E9E9;}
.plan-svy__result dt ul li {border-bottom: solid 1px #E9E9E9; padding: 16px; display: flex;}
.plan-svy__result dt ul li span {flex-shrink: 0; width: 88px;}
.plan-svy__result dt ul li strong {color: #FE41AD; flex-grow: 1; font-weight: 600;}
.plan-svy__result dd {margin-top: 40px; display: flex; align-items: center; justify-content: center;}
.plan-svy__result dd button {background: #0082FF; color: #fff; width: 270px; height: 60px; font-size: 18px; font-weight: 600; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 30px; border-radius: 30px;}
@keyframes pulsate {0% {box-shadow: 0 0 0 0vmin rgba(181, 225, 255, 1);}100% {box-shadow: 0 0 0 3vmin rgba(181, 225, 255, 0);}}

@media(max-width:1280px){
	.plan-svy__dots {bottom: 32px;}
	.plan-svy__result dt h4 {font-size: 18px;}
	.plan-svy__result dd button {width: 240px; height: 56px; font-size: 16px;}
}

@media(max-width:992px){
	.plan-svy__card h5 {font-size: 18px; padding: 24px;}
	.plan-svy__card ul {margin: 0 -4px;}
	.plan-svy__card ul li {padding: 0 4px;}
	.plan-svy__card ul li input[type="radio"] + label {padding: 24px 8px; min-height: 180px; border-width: 6px !important;}
	.plan-svy__card ul li input[type="radio"] + label p {font-size: 12px; margin-top: 16px;}
	.plan-svy__arrow {bottom: 90px; width: 30px; height: 30px; margin-bottom: -15px;}
	.plan-svy__prev {margin-right: 0;}
	.plan-svy__next {margin-left: 0;}
	.plan-svy__arrow:after {width: 16px; height: 16px; border-top: solid 2px #444; margin-top: -8px;}
	.plan-svy__prev:after {border-left: solid 2px #444;}
	.plan-svy__next:after {border-right: solid 2px #444;}
	.plan-svy__result dt h4 {font-size: 16px;}
	.plan-svy__result dt ul {margin-top: 24px;}
	.plan-svy__result dt ul li {font-size: 13px;}
	.plan-svy__result dd {margin-top: 24px;}
	.plan-svy__result dd button {width: 200px; height: 48px; font-size: 14px;}
}

@media(max-width:768px){
	.plan-svy__card {margin-top: 16px;}
	.plan-svy__card h5 {font-size: 14px; padding: 16px; -webkit-border-radius: 10px; border-radius: 10px;}
	.plan-svy__card ul {margin: 0; display: block; padding-top: 16px;}
	.plan-svy__card ul li {padding: 0; width: 100%; margin-bottom: 8px;}
	.plan-svy__card ul li:last-child {margin-bottom: 0;}
	.plan-svy__card ul li input[type="radio"] + label {padding: 16px; min-height: auto; flex-direction: row; justify-content: flex-start; text-align: left; -webkit-border-radius: 10px; border-radius: 10px;}
	.plan-svy__card ul li input[type="radio"] + label:before {margin-right: 16px;}
	.plan-svy__card ul li input[type="radio"] + label p {font-size: 13px; margin-top: 0;}
	.plan-svy__dots {margin-top: 24px; height: auto; position: static; -webkit-transform: translateX(0); transform: translateX(0);}
	.plan-svy__dots li {width: 6px; height: 6px; margin: 0 3px;}

	.plan-svy__arrow {bottom: 0; width: 20px; height: 20px; z-index: 1; margin-bottom: 0; bottom: auto; top: 100%; margin-top: 16px; opacity: 1;}
	.plan-svy__prev {margin-right: 0; right: auto; left: 0;}
	.plan-svy__next {margin-left: 0; left: auto; right: 0;}
	.plan-svy__arrow:after {width: 12px; height: 12px; margin-top: -8px;}
	.plan-svy__next:after {margin-left: -10px;}

	.plan-svy__result dt {-webkit-border-radius: 10px; border-radius: 10px;}
	.plan-svy__result dt h4 {font-size: 13px;}
	.plan-svy__result dt ul li {font-size: 12px;}
	.plan-svy__result dt ul li span {font-size: 11px; width: 64px;}
	.plan-svy__result dd button {width: 136px; height: 40px; font-size: 13px;}
}



.plan-crs__title {text-align: center; color: #FE41AD; margin-bottom: 32px;}
.plan-crs__title h3 {font-size: 18px;}
.plan-crs__title p {font-size: 14px; font-weight: 300; margin-top: 8px;}
.plan-crs__list {margin: -8px; display: flex; flex-wrap: wrap;}
.plan-crs__list li {width: 33.3333%; padding: 8px;}
.plan-crs__list li button {display: block; width: 100%; height: 100%; text-align: left; position: relative; border: solid 1px #ddd; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-crs__list li button dl {padding: 24px; display: flex; align-items: center;}
.plan-crs__list li button dl dt {flex-shrink: 0; margin-right: 24px;}
.plan-crs__list li button dl dd {flex-grow: 1;}
.plan-crs__list li button img {width: 40px; display: block; filter: grayscale(1) brightness(1.5);}
.plan-crs__list li button h5 {font-size: 16px; color: #9A9A9A; padding-right: 40px; word-break: auto-phrase;}
.plan-crs__list li button p {font-size: 12px; color: #9A9A9A; margin: -2px; padding-top: 8px; display: flex; flex-wrap: wrap;}
.plan-crs__list li button p span {display: block; border: solid 1px #e5e5e5; padding: 2px 6px; margin: 2px; font-size: 9px; -webkit-border-radius: 4px; border-radius: 4px;}
.plan-crs__list li button em {width: 30px; height: 30px; background: #0082FF; color: #fff; text-align: center; font-size: 14px; font-weight: 700; font-style: normal; position: absolute; right: 24px; top: 24px; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 30px; border-radius: 30px;}
.plan-crs__list li button.active {border-color: #54B7FF; -webkit-box-shadow: inset 0px 0px 0px 1px #54B7FF; box-shadow: inset 0px 0px 0px 1px #54B7FF;}
.plan-crs__list li button.active h5 {color: #0082FF;}
.plan-crs__list li button.active img {filter: none;}
.plan-crs__login {display: none; padding: 24px; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 1000; background: rgba(0,0,0,0.3); align-items: center; justify-content: center;}
.plan-crs__pop {background: #fff; width: 100%; max-width: 470px; text-align: center; padding: 56px 40px 44px; position: relative; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-crs__pop h3 {font-size: 20px; font-weight: 700;}
.plan-crs__close {content: ''; display: block; width: 24px; height: 24px; background: none; position: absolute; right: 16px; top: 16px; text-indent: -9999px;}
.plan-crs__close:before,
.plan-crs__close:after {content: ''; display: block; background: #888; position: absolute; left: 50%; top: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-border-radius: 6px; border-radius: 6px;}
.plan-crs__close:before {width: 16px; height: 2px; margin-left: -8px; margin-top: -1px;}
.plan-crs__close:after {width: 2px; height: 16px; margin-top: -8px; margin-left: -1px;}
.plan-crs__slider {margin-top: 24px; padding: 0 40px;}
.plan-crs__slider .slick-list {border: solid 1px #54B7FF; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-crs__slider .slick-slide {}
.plan-crs__slider .slick-dots {margin-top: 16px; display: flex; justify-content: center; align-items: center;}
.plan-crs__slider .slick-dots li {margin-right: 12px;}
.plan-crs__slider .slick-dots li:last-child {margin-right: 0;}
.plan-crs__slider .slick-dots li button {display: block; width: 10px; height: 10px; text-indent: -9999px; background: #E6E6E6; -webkit-border-radius: 50%; border-radius: 50%; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.plan-crs__slider .slick-dots li.slick-active button {background: #54B7FF;}
.plan-crs__txt {margin-top: 24px;}
.plan-crs__txt p {font-size: 14px; color: #666; line-height: 1.3;}
.plan-crs__btn {margin-top: 24px; display: flex; justify-content: center;}
.plan-crs__btn a {width: 170px; height: 48px; background: #0082FF; color: #fff; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 6px; border-radius: 6px;}

@media(max-width:1280px){
	.plan-crs__list li button dl {padding: 16px;}
	.plan-crs__list li button dl dt {margin-right: 16px;}
	.plan-crs__list li button img {width: 32px;}
	.plan-crs__list li button h5 {font-size: 14px; padding-right: 24px;}
	.plan-crs__list li button p {font-size: 11px; padding-top: 4px;}
	.plan-crs__list li button em {width: 20px; height: 20px; font-size: 12px; right: 16px; top: 16px;}
}

@media(max-width:992px){
	.plan-crs__list li {width: 50%;}
}

@media(max-width:768px){
	.plan-crs__list {margin: 0;}
	.plan-crs__list li {padding: 0; width: 100%; margin-bottom: 8px;}
	.plan-crs__list li:last-child {margin-bottom: 0;}
	.plan-crs__pop {padding: 48px 16px 32px;}
	.plan-crs__pop h3 {font-size: 18px;}
	.plan-crs__slider {margin-top: 16px; padding: 0 16px;}
	.plan-crs__txt {margin-top: 16px;}
	.plan-crs__txt p {font-size: 13px;}
	.plan-crs__btn {margin-top: 16px;}
}





.plan-ipt__wrap {display: flex;}
.plan-ipt__title {margin-bottom: 24px;}
.plan-ipt__title h3 {font-size: 20px; font-weight: 600;}
.plan-ipt__title p {font-size: 16px; color: #333; margin-top: 8px;}
.plan-ipt__warn {color: #FE41AD; margin-top: 16px; text-align: right;}
.plan-ipt__left {flex-shrink: 0; width: 336px; margin-right: 24px;}
.plan-ipt__list li {margin-bottom: 16px;}
.plan-ipt__list li:last-child {margin-bottom: 0;}
.plan-ipt__list li button {display: block; width: 100%; height: 100%; text-align: left; position: relative; border: solid 1px #ddd; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-ipt__list li button dl {padding: 24px; display: flex; align-items: center;}
.plan-ipt__list li button dl dt {flex-shrink: 0; margin-right: 24px;}
.plan-ipt__list li button dl dd {flex-grow: 1;}
.plan-ipt__list li button img {width: 40px; display: block; filter: grayscale(1) brightness(1.5);}
.plan-ipt__list li button h5 {font-size: 16px; color: #9A9A9A;}
.plan-ipt__list li button p {font-size: 12px; color: #9A9A9A; margin: -2px; padding-top: 8px; display: flex; flex-wrap: wrap;}
.plan-ipt__list li button p span {display: block; border: solid 1px #e5e5e5; padding: 2px 6px; margin: 2px; font-size: 9px; -webkit-border-radius: 4px; border-radius: 4px;}
.plan-ipt__list li button.active {background: #F9F9FA; border-color: #54B7FF; -webkit-box-shadow: inset 0px 0px 0px 1px #54B7FF; box-shadow: inset 0px 0px 0px 1px #54B7FF;}
.plan-ipt__list li button.active h5 {color: #0082FF;}
.plan-ipt__list li button.active img {filter: none;}
.plan-ipt__right {flex-grow: 1; padding: 40px; background: #F9F9FA; border: solid 1px #E7E7E7; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-ipt__group {}

.plan-ipt__item {background: #fff; margin-bottom: 24px; padding: 8px; border-top: solid 2px #0082FF; display: flex; flex-wrap: wrap; -webkit-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; box-shadow: 0px 4px 16px 0px #112A801A;}
.plan-ipt__item:last-child {margin-bottom: 0;}
.plan-ipt__dtl {}
.combo-wrapper {width: 50%; padding: 8px; position: relative;}
.combo-wrapper input[type="text"] {display: block; height: 46px; width: 100%; padding-left: 12px; font-size: 14px; border: solid 1px #ccc; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-border-radius: 8px; border-radius: 8px; -webkit-appearance: none; appearance: none; background: #fff url('https://img.megastudyth.com/member/select_arrow.png')no-repeat right 12px center / 10px auto; cursor: pointer; padding-right: 34px;}
.combo-wrapper ul {top: 100% !important; font-size: 14px; margin-top: -8px; left: 8px !important; right: 8px !important; width: auto !important; height: 240px !important; overflow-y: auto; overflow-x: hidden;}
.ui-menu .ui-menu-item-wrapper {padding: 8px !important;}

.plan-ipt__del {width: 100%; padding: 8px; margin-top: 8px; display: flex; justify-content: flex-end;}
.plan-ipt__del button {font-size: 14px; color: #0082FF; font-weight: 500;}
.plan-ipt__del button:disabled {opacity: 0.3; cursor: not-allowed;}

.plan-ipt__add {margin-top: 24px;}
.plan-ipt__add button {background: #fff; border: solid 1px #ccc; width: 100%; height: 48px; font-size: 14px; font-weight: 500; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 8px; border-radius: 8px;}
.plan-ipt__add button em {display: block; width: 12px; height: 12px; position: relative; margin-right: 8px;}
.plan-ipt__add button em:before,
.plan-ipt__add button em:after {content: ''; display: block; background: #0082FF; position: absolute; left: 50%; top: 50%; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-ipt__add button em:before {width: 12px; height: 2px; margin-left: -6px; margin-top: -1px;}
.plan-ipt__add button em:after {width: 2px; height: 12px; margin-left: -1px; margin-top: -6px;}

@media(max-width:1280px){
	.plan-ipt__title {margin-bottom: 16px;}
	.plan-ipt__title h3 {font-size: 18px;}
	.plan-ipt__title p {font-size: 13px;}
	.plan-ipt__warn {font-size: 13px; margin-top: 8px;}
	.plan-ipt__left {width: 280px;}
	.plan-ipt__list li {margin-bottom: 8px;}
	.plan-ipt__list li button dl {padding: 16px;}
	.plan-ipt__list li button dl dt {margin-right: 16px;}
	.plan-ipt__list li button img {width: 32px;}
	.plan-ipt__list li button h5 {font-size: 14px;}
	.plan-ipt__list li button p {font-size: 11px; padding-top: 4px;}
	.plan-ipt__right {padding: 24px;}
	.plan-ipt__dtl ul {margin: -4px;}
	.plan-ipt__dtl ul li {padding: 4px;}
	.plan-ipt__dtl ul li select {font-size: 12px;}
	.combo-wrapper {padding: 4px;}
	.combo-wrapper input[type="text"] {font-size: 12px;}
	.combo-wrapper ul {font-size: 12px; max-height: 200px;}
	.plan-ipt__del {padding: 4px;}
}

@media(max-width:992px){
	.plan-ipt__title {margin-bottom: 8px;}
	.plan-ipt__title h3 {font-size: 16px;}
	.plan-ipt__title p {font-size: 12px;}
	.plan-ipt__warn {font-size: 12px;}
	.plan-ipt__left {width: 224px;}
	.plan-ipt__list li button dl {padding: 16px; display: block;}
	.plan-ipt__list li button dl dt {display: none;}
	.plan-ipt__dtl ul {margin: 0;}
	.plan-ipt__dtl ul li {padding: 0; width: 100%; margin-bottom: 4px;}
	.plan-ipt__dtl ul li:last-child {margin-bottom: 0;}
	.plan-ipt__dtl ul li select {height: 40px; font-size: 11px;}
	.combo-wrapper {width: 100%; padding: 0; margin-bottom: 4px;}
	.combo-wrapper input[type="text"] {height: 40px; font-size: 11px;}
	.combo-wrapper ul {font-size: 11px; margin-top: 0; left: 0 !important; right: 0 !important;}

}

@media(max-width:768px){
	.plan-ipt__wrap {display: block;}
	.plan-ipt__left {width: 100%; margin-right: 0;}
	.plan-ipt__list {display: flex; margin: 0 -2px;}
	.plan-ipt__list li {width: 100%; margin-bottom: 0; padding: 0 2px;}
	.plan-ipt__list li:first-child:nth-last-child(2),
	.plan-ipt__list li:first-child:nth-last-child(2) ~ li {width: 50%;}
	.plan-ipt__list li:first-child:nth-last-child(3),
	.plan-ipt__list li:first-child:nth-last-child(3) ~ li {width: 33.3333%;}
	.plan-ipt__list li button {text-align: center; -webkit-border-radius: 5px; border-radius: 5px;}
	.plan-ipt__list li button dl {padding: 8px;}
	.plan-ipt__list li button h5 {font-size: 12px;}
	.plan-ipt__list li button p {display: none;}
	.plan-ipt__right {margin-top: 16px; padding: 0; background: none; border: none;}
	.plan-ipt__item {margin-bottom: 16px;}
	.plan-ipt__dtl ul li select {height: 34px;}
	.combo-wrapper input[type="text"] {height: 34px;}
	.plan-ipt__del button {font-size: 12px;}
	.plan-ipt__add {margin-top: 16px;}
	.plan-ipt__add button {height: 40px; font-size: 12px;}
	.plan-ipt__add button em {width: 10px; height: 10px; margin-right: 6px;}
	.plan-ipt__add button em:before {width: 10px; margin-left: -5px;}
	.plan-ipt__add button em:after {height: 10px; margin-top: -5px;}
}





.plan-score__tab {display: flex;}
.plan-score__tab li {margin-right: 10px;}
.plan-score__tab li button {display: block; background: #ddd; padding: 0 16px; height: 40px; display: flex; align-items: center; justify-content: center;}
.plan-score__tab li button.active {background: #f00;}

.plan-score__plan {display: flex; margin-top: 16px;}
.plan-score__plan li {margin-right: 10px;}
.plan-score__plan li button {display: block; background: #ddd; padding: 0 16px; height: 40px; display: flex; align-items: center; justify-content: center;}
.plan-score__plan li button.active {background: #f00;}

.plan-score__wrap {}
.plan-score__info {margin-top: 32px; display: flex; justify-content: space-between;}
.plan-score__info dt {}
.plan-score__info dt h5 {font-size: 26px;}
.plan-score__info dt p {font-size: 14px;}
.plan-score__info dd {}
.plan-score__info dd ul {display: flex; align-items: center;}
.plan-score__info dd ul li {margin-right: 8px;}
.plan-score__info dd ul li:last-child {margin-right: 0;}
.plan-score__info dd ul li div {border: solid 1px #666; padding: 8px; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.plan-score__info dd ul li h5 {}
.plan-score__info dd ul li p {}

.plan-score__detail {margin: -6px -10px; padding-top: 24px; display: flex; flex-wrap: wrap;}
.plan-score__detail li {width: 50%; padding: 6px 10px;}
.plan-score__detail li dl {height: 100%; display: flex; flex-direction: column;}
.plan-score__detail li dl dt {font-size: 14px; font-weight: 700; flex-grow: 1;}
.plan-score__detail li dl dd {display: flex; flex-shrink: 0; background: #F0F0F0; margin-top: 4px; overflow: hidden; -webkit-border-radius: 5px; border-radius: 5px;}
.plan-score__detail li dl dd span {height: 24px; font-size: 12px; color: #fff; white-space: nowrap; width: 0; overflow: hidden; animation: progress 1s ease-out forwards; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0;}
.plan-score__detail li:nth-child(1) dl dd span {background: #FF43CA;}
.plan-score__detail li:nth-child(2) dl dd span {background: #00BE85;}
.plan-score__detail li:nth-child(3) dl dd span {background: #FF4387;}
.plan-score__detail li:nth-child(4) dl dd span {background: #00CDE9;}
.plan-score__detail li:nth-child(5) dl dd span {background: #FF4343;}
.plan-score__detail li:nth-child(6) dl dd span {background: #1CADFF;}
.plan-score__detail li:nth-child(7) dl dd span {background: #FF7B43;}
.plan-score__detail li:nth-child(8) dl dd span {background: #0088F8;}
.plan-score__detail li:nth-child(9) dl dd span {background: #FFB443;}
.plan-score__detail li:nth-child(10) dl dd span {background: #377AFF;}
.plan-score__detail li:nth-child(11) dl dd span {background: #9DFF00;}
.plan-score__detail li:nth-child(12) dl dd span {background: #00FF8E;}
.plan-score__detail li:nth-child(13) dl dd span {background: #9C68FF;}
.plan-score__detail li:nth-child(14) dl dd span {background: #ED00E1;}
@keyframes progress {100% {width: calc(var(--p)*1%);}}

.plan-score__total {margin-top: 32px; padding-top: 24px; border-top: solid 1px #D9D9D9;}
.plan-score__total h4 {font-size: 20px;}
.plan-score__total ul {display: flex; margin-top: 16px;}
.plan-score__total ul li {height: 60px; font-size: 14px; color: #fff; width: 0; overflow: hidden; white-space: nowrap; animation: progress 1s ease-out forwards; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.plan-score__total ul li:first-child {border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
.plan-score__total ul li:last-child {border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
.plan-score__total ul li:nth-child(1) {background: #FFC520;}
.plan-score__total ul li:nth-child(2) {background: #FF43CA; animation-delay: 1s;}
.plan-score__total ul li:nth-child(3) {background: #00BFED; animation-delay: 2s;}
.plan-score__total ul li:nth-child(4) {background: #2739D7; animation-delay: 3s;}
.plan-score__total ul li:nth-child(5) {background: #9862FF; animation-delay: 4s;}

@media(max-width:1280px){
	.plan-score__total {margin-top: 24px; padding-top: 16px;}
	.plan-score__total h4 {font-size: 18px;}
	.plan-score__total ul {margin-top: 8px;}
	.plan-score__total ul li {height: 48px; font-size: 13px;}
}

@media(max-width:992px){
	.plan-score__detail {margin: 0;}
	.plan-score__detail li {width: 100%; padding: 0; margin-bottom: 16px;}
	.plan-score__detail li:last-child {margin-bottom: 0;}
	.plan-score__detail li dl dt {font-size: 13px;}
	.plan-score__total {padding-top: 0; border-top: none;}
	.plan-score__total h4 {font-size: 16px;}
	.plan-score__total ul li {height: 40px; font-size: 11px;}
}

@media(max-width:768px){

}





.plan-goal__wrap {display: flex;}
.plan-goal__left {width: 240px; margin-right: 60px; flex-shrink: 0;}
.plan-goal__list {border-top: solid 1px #E9E9E9;}
.plan-goal__list li {border-bottom: solid 1px #E9E9E9;}
.plan-goal__list li button {height: 70px; padding: 0 24px; width: 100%; text-align: left; display: flex; align-items: center; justify-content: center;}
.plan-goal__list li button.active {background: #F4F4F5;}
.plan-goal__list li button em {background: #E8F5FF; color: #0082FF; width: 30px; height: 30px; font-style: normal; font-weight: 700; margin-right: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-goal__list li button strong {flex-grow: 1; font-size: 18px; color: #9A9A9A; font-weight: 500; line-height: 1.1; word-break: break-word;}
.plan-goal__list li button.active em {background: #0082FF; color: #E8F5FF;}
.plan-goal__list li button.active strong {color: #000;}
.plan-goal__right {width: calc(100% - 240px - 60px);}
.plan-goal__tab {background: #F9F9FA; padding: 2px; display: inline-flex; align-items: center; flex-wrap: wrap; -webkit-border-radius: 6px; border-radius: 6px;}
.plan-goal__tab li {margin: 2px;}
.plan-goal__tab li button {padding: 0 8px; height: 28px; background: #F9F9FA; color: #9A9A9A; font-size: 12px; display: flex; align-items: center; flex-wrap: wrap; -webkit-border-radius: 6px; border-radius: 6px;}
.plan-goal__tab li button.active {background: #fff; color: #0082FF; font-weight: 600;}
.plan-goal__load {margin-top: 16px;}
.plan-goal__box {padding: 40px; background: #F9F9FA; border: solid 1px #E7E7E7; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-goal__title h4 {font-size: 24px; font-weight: 700;}
.plan-goal__title h6 {font-size: 16px; margin-top: 8px;}
.plan-goal__title p {font-size: 12px; margin-top: 4px; color: #666;}
.plan-goal__info {display: flex; margin: -4px; padding-top: 24px; flex-wrap: wrap;}
.plan-goal__info li {width: 33.3333%; padding: 4px;}
.plan-goal__info li dl {background: #fff; border: solid 1px #9A9A9A; text-align: center; padding: 16px; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; -webkit-border-radius: 8px; border-radius: 8px;}
.plan-goal__info li dl dt {font-size: 14px; font-weight: 500; flex-grow: 1;}
.plan-goal__info li dl dd {font-size: 12px; margin-top: 4px; flex-shrink: 0;}
.plan-goal__info li dl dd strong {color: #0082FF; font-size: 24px; margin: 0 4px;}
.plan-goal__group {margin-top: 40px;}
.plan-goal__item {border-top: solid 1px #D9D9D9; margin-top: 24px; padding-top: 24px;}
.plan-goal__item h3 {font-size: 20px; font-weight: 700;}
.plan-goal__item:nth-child(1) h3 {color: #0082FF;}
.plan-goal__item:nth-child(2) h3 {color: #FF4343;}
.plan-goal__item:nth-child(3) h3 {color: #00B27C;}
.plan-goal__item ul {display: flex; margin: -4px; padding-top: 16px; flex-wrap: wrap;}
.plan-goal__item ul li {width: 33.3333%; padding: 4px;}
.plan-goal__item ul li dl {height: 100%; background: #fff; padding: 20px; position: relative; -webkit-border-radius: 8px; border-radius: 8px; display: flex; flex-direction: column;}
.plan-goal__item ul li dl dt {flex-grow: 1;}
.plan-goal__item ul li dl dt h5 {font-size: 16px;}
.plan-goal__item ul li dl dt p {font-size: 14px; color: #9A9A9A; margin-top: 8px;}
.plan-goal__item ul li dl dd {margin-top: 16px; display: flex; flex-shrink: 0; align-items: center;}
.plan-goal__item ul li dl dd input[type="text"] {display: block; width: 56px; text-align: center; height: 30px; flex-shrink: 0; -webkit-border-radius: 0; border-radius: 0; border: solid 1px #999; -webkit-appearance: none; appearance: none;}
.plan-goal__item ul li dl dd input[type="text"] + label {width: 50%; font-size: 14px; color: #9A9A9A; margin-left: 4px;}
.plan-goal__item ul li dl dd input[type="text"]:focus {border-color: #0082FF;}
.plan-goal__item ul li dl p.error {background: #FF4343; color: #fff; padding: 6px 8px; font-size: 10px; z-index: 1; margin-top: -12px; position: absolute; left: 20px; top: 100%; -webkit-border-radius: 4px; border-radius: 4px;}
.plan-goal__item ul li dl p.error:before {content: ''; display: block; position: absolute; bottom: 100%; left: 24px; width: 0px; height: 0px; border-style: solid; border-width: 0 5px 6px 5px; border-color: transparent transparent #FF4343 transparent; transform: rotate(0deg);}


.plan-goal__loading {width: 100%;}
.plan-goal__loading p {text-align: center; font-size: 20px; margin-bottom: 56px; line-height: 1.4;}
.plan-goal__loading:after {content: ''; width: 258px; height: 212px; display: block; margin: 0 auto; animation: bounce 0.5s infinite alternate; background: url('https://img.megastudyth.com/plan/elephant.png')no-repeat center center / cover;}

@media(max-width:1280px){
	.plan-goal__left {margin-right: 24px;}
	.plan-goal__list li button {height: 64px; padding: 0 16px;}
	.plan-goal__list li button em {width: 24px; height: 24px; margin-right: 8px;}
	.plan-goal__list li button strong {font-size: 16px;}
	.plan-goal__right {width: calc(100% - 240px - 24px);}
	.plan-goal__box {padding: 24px;}
	.plan-goal__item ul li {width: 50%;}
	.plan-goal__loading p {font-size: 18px;}
}

@media(max-width:992px){
	.plan-goal__left {width: 200px;}
	.plan-goal__list li button {height: 56px;}
	.plan-goal__list li button em {width: 20px; height: 20px; font-size: 12px;}
	.plan-goal__list li button strong {font-size: 14px;}
	.plan-goal__right {width: calc(100% - 200px - 24px);}
	.plan-goal__title h4 {font-size: 20px;}
	.plan-goal__title h6 {font-size: 14px;}
	.plan-goal__title p {font-size: 11px;}
	.plan-goal__info {padding-top: 16px;}
	.plan-goal__info li dl {padding: 16px 8px;}
	.plan-goal__info li dl dt {font-size: 11px;}
	.plan-goal__info li dl dd {font-size: 10px;}
	.plan-goal__info li dl dd strong {font-size: 18px;}
	.plan-goal__item ul li dl {padding: 16px;}
	.plan-goal__item ul li dl dt h5 {font-size: 14px;}
	.plan-goal__item ul li dl dt p {font-size: 12px;}
	.plan-goal__item ul li dl dd input[type="text"] + label {font-size: 12px;}
	.plan-goal__item ul li dl p.error {left: 16px; margin-top: -8px;}
	.plan-goal__loading p {font-size: 16px;}
}

@media(max-width:768px){
	.plan-goal__wrap {display: block;}
	.plan-goal__left {width: 100%; margin-right: 0;}
	.plan-goal__list {display: flex; margin: 0 -2px; border-top: none;}
	.plan-goal__list li {width: 100%; margin-bottom: 0; padding: 0 2px; border-bottom: none;}
	.plan-goal__list li:first-child:nth-last-child(2),
	.plan-goal__list li:first-child:nth-last-child(2) ~ li {width: 50%;}
	.plan-goal__list li:first-child:nth-last-child(3),
	.plan-goal__list li:first-child:nth-last-child(3) ~ li {width: 33.3333%;}
	.plan-goal__list li button {height: 100%; padding: 8px; text-align: center; border: solid 1px #ddd; -webkit-border-radius: 5px; border-radius: 5px; flex-direction: column;}
	.plan-goal__list li button em {width: 16px; height: 16px; font-size: 11px;}
	.plan-goal__list li button strong {font-size: 12px; margin-top: 4px;}
	.plan-goal__right {width: 100%; margin-top: 8px;}
	.plan-goal__box {padding: 0; border: none; background: none;}
	.plan-goal__item ul li dl {border: solid 1px #ddd;}
	.plan-goal__loading p {font-size: 14px; margin-bottom: 40px;}
	.plan-goal__loading:after {width: 200px; height: 164px;}
}




.plan-gauge {width: 200px; height: 136px; padding: 10px 10px 0; margin: -10px -10px 0; overflow: hidden;}
.plan-gauge__inner {width: 100%; padding-bottom: 100%; background: #14337D; position: relative; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-gauge__full {position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; -webkit-border-radius: 50%; border-radius: 50%; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out;}
.plan-gauge__full:before {content: ''; display: block; position: absolute; left: 0; right: 0; top: 50%; bottom: 0; background: #0082FF;}
.plan-gauge__full:after {content: ''; display: block; width: 8px; height: 8px; background: #0082FF; position: absolute; left: 0; top: 50%; margin-top: -4px; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-gauge__handle {position: absolute; left: 0; right: 0; top: 50%; margin-top: -12px; height: 24px; z-index: 4; transition: transform 0.5s ease-out; -webkit-transition: transform 0.5s ease-out;}
.plan-gauge__handle:after {content: ''; display: block; background: #333; width: 24px; height: 24px; background: #0082FF; border: solid 4px #E8F5FF; box-sizing: border-box; position: absolute; left: -8px; top: 0; -webkit-border-radius: 50%; border-radius: 50%; box-shadow: 0px 4px 4px 0px #00000040;}
.plan-gauge__ball {background: #fff; position: absolute; left: 0; right: 0; top: 50%; bottom: 0; z-index: 2;}
.plan-gauge__ball:before,
.plan-gauge__ball:after {content: ''; display: block; width: 8px; height: 8px; position: absolute; top: 0; margin-top: -4px; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-gauge__ball:before {left: 0; background: #0082FF;}
.plan-gauge__ball:after {right: 0; background: #14337D;}
.plan-gauge__txt {background: #fff; position: absolute; left: 8px; right: 8px; top: 8px; bottom: 8px; z-index: 3; font-size: 32px; font-weight: 600; color: #0082FF; padding-bottom: calc(50% - 30px); display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-gauge__txt:before,
.plan-gauge__txt:after {content: ''; display: block; width: 40px; text-align: center; font-size: 14px; color: #000; font-weight: 500; position: absolute; top: 50%; margin-top: 10px; z-index: 4;}
.plan-gauge__txt:before {content: 'ต่ำ'; left: -24px;}
.plan-gauge__txt:after {content: 'สูง'; right: -24px;}

.plan-result__wrap {margin: -12px; display: flex; flex-wrap: wrap;}
.plan-result__col {width: 50%; padding: 12px;}
.plan-result__col:last-child {width: 100%;}
.plan-result__box {background: #fff; padding: 32px; height: 100%; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-result__score {display: flex; flex-direction: column;}
.plan-result__score h4 {font-size: 18px; font-weight: 600;}
.plan-result__score p {font-size: 14px; color: #666; margin-top: 8px;}
.plan-result__score dl {flex-shrink: 0;}
.plan-result__score dl dt {font-size: 16px; font-weight: 700; text-align: center;}
.plan-result__score dl dd {font-size: 14px; margin-top: 12px; display: flex; justify-content: center;}
.plan-result__score dl dd span {display: flex; align-items: center;}
.plan-result__score dl dd span:after {content: '/'; margin: 0 8px;}
.plan-result__score dl dd span:last-child:after {display: none;}
.plan-result__gauge {flex-grow: 1; margin: 16px 0; display: flex; justify-content: center; align-items: center; position: relative;}
.plan-result__info dd {margin-top: 16px;}
.plan-result__info dd ul li {background: #F9F9FA; border: solid 1px #ccc; padding: 16px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-result__info dd ul li:last-child {margin-bottom: 0;}
.plan-result__info dd ul li h5 {font-size: 14px; flex-shrink: 0;}
.plan-result__info dd ul li p {font-size: 14px; color: #0082FF; flex-grow: 1; text-align: right;}
.plan-result__info dd ul li p strong {font-size: 16px; margin-right: 4px;}
.plan-result__info dd u {display: block; font-size: 12px; margin-top: 16px; color: #999; text-decoration: none;}
.plan-result__legend li {margin-bottom: 4px; font-size: 12px; display: flex; align-items: center;}
.plan-result__legend li:last-child {margin-bottom: 0;}
.plan-result__legend li:before {content: ''; display: block; width: 14px; height: 14px; margin-right: 8px;}
.plan-result__legend li:nth-child(1):before {background: linear-gradient(180deg, #FF43CA 0%, #377AFF 100%);}
.plan-result__legend li:nth-child(2):before {background: #14337D;}
.plan-result__detail .plan-score__detail li dl dd:last-child span {background: #14337D;}

@media(max-width:1280px){
	.plan-result__score h4 {font-size: 16px;}
	.plan-result__score p {font-size: 12px;}
	.plan-result__info dd ul li h5 {font-size: 12px;}
	.plan-result__info dd ul li p {font-size: 10px;}
	.plan-result__info dd u {font-size: 10px;}
}

@media(max-width:992px){
	.plan-result__wrap {margin: -8px;}
	.plan-result__col {width: 100%; padding: 8px;}
}

@media(max-width:768px){
	.plan-result__wrap {margin: 0;}
	.plan-result__col {width: 100%; padding: 0; margin-bottom: 16px;}
	.plan-result__col:last-child {margin-bottom: 0;}
	.plan-result__box {padding: 16px; border: solid 1px #ddd;}
}





.plan-rcmd__top {padding-bottom: 128px; position: relative;}
.plan-rcmd__top:before {content: ''; display: block; height: 92px; background: #F4F4F5; position: absolute; left: -100%; right: -100%; bottom: 0;}
.plan-rcmd__top:after {content: ''; display: block; background: #fff; height: 20px; position: absolute; left: -56px; right: -56px; bottom: 72px; -webkit-border-radius: 0px 0px 20px 20px; border-radius: 0px 0px 20px 20px;}
.plan-rcmd__bot {position: relative; padding-top: 56px; margin: 0 -56px;}
.plan-rcmd__bot:before {content: ''; display: block; background: #fff; position: absolute; left: -100%; right: -100%; top: 0; bottom: -188px;}
.plan-rcmd__bot:after {content: ''; display: block; width: 48px; height: 48px; position: absolute; bottom: 100%; left: 50%; margin-left: -24px; margin-bottom: 12px; background: url('https://img.megastudyth.com/plan/recommend_arrow.png')no-repeat center center / 27px auto;}
.plan-rcmd__inner {position: relative;}
.plan-rcmd__title {font-size: 20px; font-weight: 600; text-align: center;}
.plan-rcmd__tab {padding-top: 32px; margin: 0 -8px; display: flex; justify-content: center;}
.plan-rcmd__tab li {width: 25%; padding: 0 8px;}
.plan-rcmd__tab li button {width: 100%; height: 64px; border: solid 1px #ccc; padding: 0 16px; text-align: left; display: flex; align-items: center; -webkit-border-radius: 10px; border-radius: 10px;}
.plan-rcmd__tab li button em {width: 32px; height: 32px; background: #0082FF; color: #fff; font-style: normal; margin-right: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-rcmd__tab li button strong {flex-grow: 1; font-size: 16px; color: #9A9A9A; font-weight: 500; line-height: 1.1; word-break: auto-phrase;}
.plan-rcmd__tab li button.active {background: #E8F5FF; border-color: #0082FF; -webkit-box-shadow: inset 0px 0px 0px 1px #0082FF; box-shadow: inset 0px 0px 0px 1px #0082FF;}
.plan-rcmd__tab li button.active strong {color: #000;}
.plan-rcmd__goal {margin-top: 32px; border-bottom: solid 1px #d9d9d9; display: flex; justify-content: center; flex-wrap: wrap;}
.plan-rcmd__goal li {}
.plan-rcmd__goal li button {width: 100%; height: 32px; padding: 0 16px; color: #666; font-size: 12px; font-weight: 500; position: relative; display: flex; align-items: center; justify-content: center;}
.plan-rcmd__goal li button.active {color: #0082FF;}
.plan-rcmd__goal li button.active:after {content: ''; display: block; background: #0082FF; height: 2px; position: absolute; left: 0; right: 0; bottom: -1px;}
.plan-rcmd__goal + .plan-goal__load {margin-top: 32px;}
.plan-rcmd__goal + .plan-goal__load .plan-score__total {padding-top: 0; border-top: none; margin-top: 0;}
.plan-rcmd__step {margin-top: 40px;}
.plan-rcmd__step:first-child {margin-top: 0;}
.plan-rcmd__step h2 {text-align: center; font-size: 20px; color: #0082FF; font-weight: 700; margin-bottom: 16px;}
.plan-rcmd__group {margin-bottom: 24px;}
.plan-rcmd__group:last-child {margin-bottom: 0;}
.plan-rcmd__group h4 {text-align: center; font-size: 16px; font-weight: 600;}
.plan-rcmd__list {padding-top: 24px; margin: -4px; display: flex; flex-wrap: wrap;}
.plan-rcmd__list li {width: 16.6666%; padding: 4px;}
.plan-rcmd__item {display: flex; flex-direction: column;}
.plan-rcmd__item a {display: flex; flex-direction: column; position: relative; background: #F4F9FF;}
.plan-rcmd__item a:after {content: ''; display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; border: solid 1px #ccc; -webkit-border-top-left-radius: 20px; border-top-left-radius: 20px;}
.plan-rcmd__item div {padding: 20px;}
.plan-rcmd__item em {display: block; padding-bottom: 68%; -webkit-border-top-left-radius: 20px; border-top-left-radius: 20px;}
.plan-rcmd__item em.none {background: #eee url('https://img.megastudyth.com/common/noimage.png')no-repeat center center / 50px auto;}
.plan-rcmd__item h5 {font-size: 16px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.2; height: 4.8em; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.plan-rcmd__item dl {margin-top: 16px; display: flex; flex-direction: column; justify-content: flex-end;}
.plan-rcmd__item dl dt {font-size: 16px; font-weight: 400;}
.plan-rcmd__item dl dt span {color: #FF0600; margin-right: 8px;}
.plan-rcmd__item dl dd {color: #BCBCBC; font-size: 14px; margin-top: 4px; text-decoration: line-through;}
.plan-rcmd__item a.active:after {border: solid 2px #0082FF;}
.plan-rcmd__item a.active h5 {color: #0082FF;}
.plan-rcmd__bot + .plan-bot {width: auto; margin-left: -56px; margin-right: -56px;}
.plan-rcmd__cart {position: absolute; top: 100%; right: 0; width: auto; z-index: 1;}
.plan-rcmd__cart button {margin-top: -4px;}
.plan-rcmd__none {text-align: center; font-size: 18px; color: #666; padding: 64px 0; line-height: 1.3;}
.plan-banner {position: relative; margin: 56px -56px 0; padding-top: 56px;}
.plan-banner:before {content: ''; display: block; background: #F4F4F5; position: absolute; left: -100%; right: -100%; top: 0; bottom: -56px;}
.plan-banner ul {display: flex; margin: 0 -10px; position: relative;}
.plan-banner ul li {width: 50%; padding: 0 10px;}
.plan-banner ul li a {display: block; overflow: hidden; border: solid 6px #ddd; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-banner ul li:nth-child(1) a {border-color: #000;}
.plan-banner ul li:nth-child(2) a {border-color: #7000FF;}
.plan-circle {display: none; position: absolute; right: 0; top: 0; margin-right: -24px; margin-top: -24px;}
.plan-circle a {text-align: center; background: #00ffc0 url('https://img.megastudyth.com/plan/banner.png')no-repeat center bottom / cover; width: 160px; height: 160px; border: solid 1px #000; display: block; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-circle span {height: 55%; font-size: 16px; color: #0038b8; font-weight: 600; text-align: center; display: flex; align-items: center; justify-content: center;}
.plan-circle button {position: absolute; right: 0; top: 0; width: 32px; height: 32px; background: #fff; border: solid 1px #000; text-indent: -9999px; -webkit-border-radius: 50%; border-radius: 50%;}
.plan-circle button:before,
.plan-circle button:after {content: ''; display: block; width: 14px; height: 2px; background: #000; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -1px;}
.plan-circle button:before {-webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.plan-circle button:after {-webkit-transform: rotate(45deg); transform: rotate(45deg);}

@media(max-width:1280px){
	.plan-rcmd__top {padding-bottom: 88px;}
	.plan-rcmd__top:before {height: 52px;}
	.plan-rcmd__top:after {left: -32px; right: -32px; bottom: 32px;}
	.plan-rcmd__bot {padding-top: 32px; margin: 0 -32px;}
	.plan-rcmd__bot:before {bottom: -164px;}
	.plan-rcmd__bot:after {margin-bottom: -8px;}
	.plan-rcmd__title {font-size: 18px;}
	.plan-rcmd__tab {padding-top: 24px; margin: 0 -4px;}
	.plan-rcmd__tab li {width: 33.3333%; padding: 0 4px;}
	.plan-rcmd__tab li button em {width: 24px; height: 24px; font-size: 11px; margin-right: 8px;}
	.plan-rcmd__tab li button strong {font-size: 14px;}
	.plan-rcmd__goal {margin-top: 24px;}
	.plan-rcmd__goal + .plan-goal__load {margin-top: 24px;}
	.plan-rcmd__item div {padding: 16px;}
	.plan-rcmd__item h5 {font-size: 15px;}
	.plan-rcmd__item p {font-size: 11px;}
	.plan-rcmd__item dl dt {font-size: 14px;}
	.plan-rcmd__item dl dd {font-size: 12px;}
	.plan-rcmd__bot + .plan-bot {margin-left: -32px; margin-right: -32px;}
	.plan-rcmd__none {padding: 40px 0; font-size: 16px;}
	.plan-banner {margin: 56px -32px 0;}
	.plan-banner ul li a {border-width: 4px;}
	.plan-circle {margin-right: -8px; margin-top: -8px;}
}

@media(max-width:992px){
	.plan-rcmd__title {font-size: 16px;}
	.plan-rcmd__tab {padding-top: 16px; margin: 0 -2px;}
	.plan-rcmd__tab li {padding: 0 2px;}
	.plan-rcmd__tab li button {height: 56px; padding: 0 12px;}
	.plan-rcmd__tab li button em {width: 20px; height: 20px; font-size: 10px; }
	.plan-rcmd__tab li button strong {font-size: 13px;}
	.plan-rcmd__goal {margin-top: 16px;}
	.plan-rcmd__list li {width: 25%;}
	.plan-rcmd__none {padding: 32px 0; font-size: 14px;}
	.plan-banner ul li a {-webkit-border-radius: 10px; border-radius: 10px;}
	.plan-circle {margin-right: 0; margin-top: 0;}
	.plan-circle a {width: 120px; height: 120px;}
	.plan-circle a span {font-size: 12px;}
	.plan-circle button {width: 24px; height: 24px;}

}

@media(max-width:768px){
	.plan-rcmd__top {padding-bottom: 48px;}
	.plan-rcmd__top:before {height: 8px;}
	.plan-rcmd__top:after {display: none;}
	.plan-rcmd__bot {margin: 0;}
	.plan-rcmd__bot:before {display: none;}
	.plan-rcmd__bot:after {display: none;}
	.plan-rcmd__tab li button {height: 40px; padding: 0 8px; text-align: center; -webkit-border-radius: 8px; border-radius: 8px;}
	.plan-rcmd__tab li button em {display: none;}
	.plan-rcmd__tab li button strong {font-size: 12px;}
	.plan-rcmd__goal {margin-top: 8px;}
	.plan-rcmd__goal + .plan-goal__load {margin-top: 16px;}
	.plan-rcmd__step h2 {margin-bottom: 8px;}
	.plan-rcmd__list li {width: 50%;}
	.plan-rcmd__bot + .plan-bot {margin-left: 0; margin-right: 0;}
	.plan-rcmd__cart button {width: auto; padding: 0 16px;}
	.plan-rcmd__none {padding: 24px 0; font-size: 12px;}
	.plan-banner {margin: 32px 0 0; padding-top: 32px;}
	.plan-banner:before {bottom: -32px;}
	.plan-banner ul {margin: 0; display: block;}	
	.plan-banner ul li {margin-bottom: 4px; width: 100%; padding: 0;}
	.plan-banner ul li:last-child {margin-bottom: 0;}
	.plan-banner ul li a {border-width: 2px;}
	.plan-circle {position: relative; width: 100%; margin-top: 24px;}
	.plan-circle a {width: 100%; height: 64px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; -webkit-border-radius: 0; border-radius: 0; background-size: 120px auto; background-position: right 8px bottom;}
	.plan-circle a:after {content: ''; display: block; width: 6px; height: 6px; margin-left: 16px; border-top: solid 1px #000; border-right: solid 1px #000; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
	.plan-circle a span {font-size: 18px; height: 100%; justify-content: flex-start;}
	.plan-circle button {display: none;}
}




.plan-intro {padding: 64px 24px; min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; background: url('https://img.megastudyth.com/plan/intro_bg.jpg')no-repeat center center / cover;}
.plan-intro__title {text-align: center;}
.plan-intro__title h3 {font-size: 86px; color: #000; font-style: italic; font-weight: 700; text-shadow: 0px 4px 10px rgba(0,0,0,0.25);}
.plan-intro__title h4 {font-size: 54px; color: #fff; font-style: italic; font-weight: 700; position: relative; margin-top: 8px;}
.plan-intro__title h4 span {display: block; padding: 0 10px; white-space: nowrap;}


.plan-intro__title h4 span:nth-child(1) {position: relative; z-index: 1; background-color: red; background-image: linear-gradient(90deg, #006FFF 0%, #FF68F5 100%); background-size: 100%; background-repeat: repeat; -webkit-background-clip: text; -webkit-text-fill-color: transparent;  -moz-background-clip: text; -moz-text-fill-color: transparent;}
.plan-intro__title h4 span:nth-child(2) {position: absolute; left: 1px; top: 1px; color: #fff;}
.plan-intro__menu {width: 100%; max-width: 1000px; margin: 0 auto; padding-top: 56px; display: flex; position: relative;}
.plan-intro__menu:after {content: ''; display: block; width: 158px; height: 132px; position: absolute; top: 100%; left: 50%; margin-left: -79px; margin-top: -66px; background: url('https://img.megastudyth.com/plan/intro_robot.png')no-repeat center center / auto 100%;}
.plan-intro__menu li {padding: 0 12px; width: 50%;}
.plan-intro__menu li dl {position: relative; overflow: hidden; -webkit-border-radius: 20px; border-radius: 20px;}
.plan-intro__menu li dl dt {position: relative;}
.plan-intro__menu li dl dt img {display: block; width: 100%;}
.plan-intro__menu li dl dd {padding: 16px; background: #000; color: #fff; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.plan-intro__menu li dl dd h5 {font-size: 18px; font-weight: 600;}
.plan-intro__menu li dl dd p {font-size: 13px; font-weight: 300; margin-top: 8px;}
.plan-intro__btn {margin-top: 72px; position: relative;}
.plan-intro__btn a {width: 370px; height: 70px; background: #5AFAFF; font-size: 20px; font-weight: 700; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 40px; border-radius: 40px;}
.plan-intro__btn a:after {content: ''; display: block; box-sizing: border-box; width: 12px; height: 12px; margin-left: 16px; border-top: solid 2px #000; border-right: solid 2px #000; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

@media(max-width:1280px){
	.plan-intro__title h3 {font-size: 68px;}
	.plan-intro__title h4 {font-size: 48px;}
	.plan-intro__menu {padding-top: 40px;}
	.plan-intro__btn a {width: 320px; height: 60px; font-size: 18px;}
	.plan-intro__btn a:after {width: 10px; height: 10px; margin-left: 8px;}
}

@media(max-width:992px){
	.plan-intro__title h3 {font-size: 56px;}
	.plan-intro__title h4 {font-size: 40px;}
	.plan-intro__menu {padding-top: 24px;}
	.plan-intro__menu li dl dd h5 {font-size: 16px;}
	.plan-intro__menu li dl dd p {font-size: 11px;}
	.plan-intro__btn {margin-top: 56px;}
	.plan-intro__btn a {width: 280px; height: 56px; font-size: 16px;}
}

@media(max-width:768px){
	.plan-intro__title h3 {font-size: 32px;}
	.plan-intro__title h4 {font-size: 18px; margin-top: 4px;}
	.plan-intro__title h4 span:nth-child(2) {display: none;}
	.plan-intro__title:after {height: 96px; margin: 0;}
	.plan-intro__menu {display: block; padding-top: 16px;}
	.plan-intro__menu li {width: 100%; padding: 0; margin-bottom: 8px;}
	.plan-intro__menu li:last-child {margin-bottom: 0;}
	.plan-intro__menu li dl {display: flex; -webkit-border-radius: 10px; border-radius: 10px;}
	.plan-intro__menu li dl dt {flex-shrink: 0; width: 120px;}
	.plan-intro__menu li dl dd {flex-grow: 1; display: flex; align-items: center; text-align: center; font-size: 14px;}
	.plan-intro__menu li dl dd h5 {font-size: 13px;}
	.plan-intro__menu li dl dd p {display: none;}
	.plan-intro__btn {margin-top: 24px;}
	.plan-intro__btn a {width: 200px; height: 48px; font-size: 14px; padding-left: 24px;}
	.plan-intro__btn a:before {width: 120px; height: 100px; left: 0; margin-left: -64px; bottom: auto;}
	.plan-intro__btn a:after {width: 7px; height: 7px;}
}