@charset "utf-8";

#spinner:not([hidden]) {position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; background: rgba(0,0,0,0.5); z-index:999;}
#spinner::after {content: ""; width: 80px; height: 80px; border: 2px solid #f3f3f3; border-top: 3px solid #f25a41; border-radius: 100%; will-change: transform; animation: spin 1s infinite linear;}
@keyframes spin {from {transform: rotate(0deg);} to {transform: rotate(360deg);}}
.myDiv{font-size:27px; font-weight:600; text-align:center; vertical-align:middle;}
.myDiv span {font-size:15px;}

#ipd {width: 100%; overflow: hidden;}
#ipd * {box-sizing: border-box;}
#ipd img {display: block; max-width: 100%; margin: 0 auto;}
.ipd-head {padding: 15px 0;}
.ipd-head h1 {width: 205px; margin: 0 auto;}
.ipd-head h1 a {display: block; text-indent: -9999px; height: 44px; background: url('https://img.megastudyth.com/common/gnb_logo.png')no-repeat center center / cover;}
	


.ipd-top {padding-top: 120px; background: url('https://img.megastudyth.com/event/2023/ipad/ipad_top_bg.jpg')no-repeat center center / cover;}
.ipd-top img {}

.ipd-form {background: #0082ff; padding: 120px 0;}
.ipd-form h5 {text-align: center; color: #fff; font-size: 24px; font-weight: 500;}
.ipd-form h3 {text-align: center; color: #fff; font-size: 40px; margin-bottom: 20px;}
.ipd-form__box {max-width: 420px; width: 100%; background: #fff; padding: 30px; margin: 0 auto; -webkit-border-radius: 10px; border-radius: 10px;}
.ipd-form__box label:not([type='radio'] + label) {display: block; font-size: 15px; margin-top: 20px; margin-bottom: 10px;}
.ipd-form__box ul li {margin-bottom: 5px; position: relative;}
.ipd-form__box ul li:last-child {margin-bottom: 0; margin-top: 20px;}
.ipd-form__box ul li:first-child label {margin-top: 0;}
.ipd-form__box input:not([type='radio']),
.ipd-form__box select {display: block; width: 100%; height: 50px; border: solid 1px #ddd; -webkit-border-radius: 0px; border-radius: 0px; -webkit-appearance: none; appearance: none; -webkit-border-radius: 5px; border-radius: 5px;}
.ipd-form__box input {padding: 0 10px;}
.ipd-form__box select {padding-left: 10px; padding-right: 40px; background: none; cursor: pointer;}
.ipd-form__box input:focus,
.ipd-form__box select:focus {border-width: 2px; border-color: #0082ff;}
.ipd-form__box input[type='radio'] {margin-right: 5px;}
.ipd-form__box input[type='radio'] + label {margin-right: 15px; cursor: pointer;}
.ipd-form__select:after {content: ''; display: block; width: 6px; height: 6px; border-right: solid 1px #333; border-bottom: solid 1px #333; position: absolute; right: 15px; bottom: 24px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}
.ipd-form__submit {display: block; width: 100%; height: 50px; border: solid 1px #ddd; -webkit-border-radius: 0px; border-radius: 0px; -webkit-appearance: none; appearance: none; -webkit-border-radius: 5px; border-radius: 5px; background: #201e56; border-color: #201e56; color: #fff; margin-top: 10px; height: 60px; font-size: 24px; font-weight: 500;}
.ipd-form__schedule {display: flex; flex-wrap: wrap; margin: 0 -5px;}
.ipd-form__schedule dt {width: 100%; padding: 0 5px; margin-top: 20px; margin-bottom: 10px; font-size: 15px;}
.ipd-form__schedule dd {width: 50%; padding: 0 5px; position: relative;}
.ipd-form__date {position: relative;}
.ipd-form__date input[type="text"] + button {display: block; position: absolute; right: 5px; top: 0; width: 40px; height: 50px; text-indent: -9999px; background: url('https://img.megastudyth.com/reservation/datepicker_calendar.png')no-repeat center center / 16px auto;}


.ipd-review {padding: 120px 0; background: url('https://img.megastudyth.com/event/2023/ipad/ipad_review_bg.jpg')no-repeat center center / cover;}
.ipd-review__title {}
.ipd-review__title img {}
.ipd-review__img {margin-top: 30px; }
.ipd-review__img img {-webkit-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0px 5px 20px 0px rgba(0,0,0,0.3); box-shadow: 0px 5px 20px 0px rgba(0,0,0,0.3);}
.ipd-review__slider {margin-top: 60px;}
.ipd-review__slider,
.ipd-review__slider .slick-list,
.ipd-review__slider .slick-track {overflow: visible !important;}
.ipd-review__slider .slick-dots {text-align: center; margin-top: 30px;}
.ipd-review__slider .slick-dots li {display: inline-block; margin: 0 3px;}
.ipd-review__slider .slick-dots li button {display: block; width: 10px; height: 10px; background: rgba(255,255,255,0.7); -webkit-border-radius: 50%; border-radius: 50%; text-indent: -9999px;}
.ipd-review__slider .slick-dots li.slick-active button {background: #0082ff;}


.ipd-tutor {padding: 120px 0; background: url('https://img.megastudyth.com/event/2023/ipad/ipad_tutor_bg.jpg')no-repeat center center / cover;}
.ipd-tutor__title {margin-bottom: 40px;}
.ipd-tutor__title img {}
.ipd-tutor__slider {position: relative; margin: 0 -20px;}
.ipd-tutor__slider .slick-slide {padding: 0 20px;}
.ipd-tutor__slider .slick-arrow {display: block; width: 40px; height: 40px; background: none; text-indent: -9999px; position: absolute; top: 50%; margin-top: -20px;}
.ipd-tutor__slider .slick-prev {left: -40px;}
.ipd-tutor__slider .slick-next {right: -40px;}
.ipd-tutor__slider .slick-arrow:after {content: ''; display: block; width: 20px; height: 20px; position: absolute; left: 50%; top: 50%;}
.ipd-tutor__slider .slick-prev:after {border-left: solid 3px rgba(255,255,255,0.5); border-bottom: solid 3px rgba(255,255,255,0.5); margin-top: 5px; margin-left: -5px; -webkit-transform: rotate(45deg) translate(-50%, -50%); transform: rotate(45deg) translate(-50%, -50%);}
.ipd-tutor__slider .slick-next:after {border-right: solid 3px rgba(255,255,255,0.5); border-top: solid 3px rgba(255,255,255,0.5); margin-top: 5px; margin-left: -15px; -webkit-transform: rotate(45deg) translate(-50%, -50%); transform: rotate(45deg) translate(-50%, -50%);}
.ipd-tutor__slider .slick-prev:hover:after {border-left-color: #fff; border-bottom-color: #fff;}
.ipd-tutor__slider .slick-next:hover:after {border-right-color: #fff; border-top-color: #fff;}


.ipd-tutor__univ {margin-top: 30px;}
.ipd-tutor__univ img {}

.ipd-vs {padding: 120px 0;}
.ipd-vs img {}

.ipd-product {background: #CFECFF; padding: 120px 0;}
.ipd-product__title {}
.ipd-product__title img {}
.ipd-product__tab {display: flex; margin: 60px 0;}
.ipd-product__tab li {flex: auto;}
.ipd-product__tab li button {display: flex; width: 100%; height: 70px; align-items: center; justify-content: center; background: #fff; font-size: 24px; font-weight: 700; border: solid 1px #0082ff; border-left: none; border-right: solid 1px #0082ff;}
.ipd-product__tab li:first-child button {border-left: solid 1px #0082ff; -webkit-border-radius: 15px 0 0 15px; border-radius: 15px 0 0 15px;}
.ipd-product__tab li:last-child button {-webkit-border-radius: 0 15px 15px 0; border-radius: 0 15px 15px 0;}
.ipd-product__tab li button.active {background: #0082ff; color: #fff;}
.ipd-product__cont {display: none;}
.ipd-product__cont ul {margin: 0 -15px;}
.ipd-product__cont ul:after {content: ''; display: table; clear: both;}
.ipd-product__cont ul li {float: left; padding: 0 15px;}
.ipd-product__cont ul.col1 li {width: 100%;}
.ipd-product__cont ul.col2 li {width: 50%;}
.ipd-product__cont ul.col3 li {width: 33.33%;}
.ipd-product__cont ul.col4 li {width: 25%;}

.ipd-service {padding: 120px 0 240px;}
.ipd-service__title {}
.ipd-service__title img {}
.ipd-service__list {display: flex; flex-wrap: wrap; margin: -20px; padding-top: 60px;}
.ipd-service__list li {width: 33.33%; padding: 20px;}
.ipd-service__list li img {}

.ipd-quick {padding: 60px 0; background: #01042d;}
.ipd-quick button {display: block; margin: 0 auto; background: #CF0000; color: #fff; width: 320px; height: 80px; font-size: 32px; font-weight: 700; -webkit-border-radius: 15px; border-radius: 15px;}

.ipd-completed {padding: 240px 0; text-align: center; background: url('https://img.megastudyth.com/event/2023/ipad/ipad_top_bg.jpg')no-repeat center center / cover;}
.ipd-completed h3 {font-size: 60px; font-weight: 900; color: #00ffb9; text-shadow: 0px 5px 0px #000;}
.ipd-completed p {font-size: 34px; font-weight: 400; color: #fff; text-shadow: 0px 5px 0px #000; margin-top: 10px;}
.ipd-completed a {display: inline-block; margin-top: 60px; background: #0082ff; color: #fff; width: 200px; height: 60px; line-height: 60px; font-size: 24px; font-weight: 500; -webkit-border-radius: 15px; border-radius: 15px;}


@media (max-width:768px) {
	.ipd-head {padding: 10px 0;}
	.ipd-head h1 {width: 168px;}
	.ipd-head h1 a {height: 36px;}
	.ipd-top {padding-top: 60px;}
	.ipd-form {padding: 60px 0;}
	.ipd-form h5 {font-size: 16px; font-weight: 400;}
	.ipd-form h3 {font-size: 30px; margin-top: 5px;}
	.ipd-form__box {padding: 30px 20px;}
	.ipd-form__box input,
	.ipd-form__box select {height: 40px;}
	.ipd-form__submit {height:50px; font-size: 20px;}

	.ipd-review {padding: 60px 0;}
	.ipd-review__img {margin-top: 30px; }
	.ipd-review__slider {margin-top: 30px;}
	.ipd-review__slider,
	.ipd-review__slider .slick-list,
	.ipd-review__slider .slick-track {overflow: hidden !important;}
	.ipd-tutor {padding: 60px 0;}
	.ipd-tutor__title {margin-bottom: 20px;}
	.ipd-tutor__slider {margin: 0 -5px;}
	.ipd-tutor__slider .slick-slide {padding: 0 5px;}
	.ipd-tutor__univ {margin-top: 30px;}
	.ipd-vs {padding: 60px 0; margin: 0 -20px;}
	.ipd-product {padding: 60px 0;}
	.ipd-product__tab {margin: 30px 0;}
	.ipd-product__tab li button {height: 46px; font-size: 16px;}
	.ipd-product__tab li:first-child button {-webkit-border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px;}
	.ipd-product__tab li:last-child button {-webkit-border-radius: 0 10px 10px 0; border-radius: 0 10px 10px 0;}
	.ipd-product__cont ul {margin: 0 -5px;}
	.ipd-product__cont ul li {padding: 0 5px; margin-bottom: 30px;}

	.ipd-product__cont ul.col1 li {width: 50%; margin-left: 25%;}
	.ipd-product__cont ul.col2 li {width: 50%;}
	.ipd-product__cont ul.col3 li {width: 50%;}
	.ipd-product__cont ul.col3 li:last-child {margin-left: 25%;}
	.ipd-product__cont ul.col4 li {width: 50%;}

	.ipd-service {padding: 60px 0 200px;}
	.ipd-service__list {margin: -5px; padding-top: 40px;}
	.ipd-service__list li {width: 50%; padding: 5px;}
	.ipd-quick {padding: 30px 0;}
	.ipd-quick button {width: 200px; height: 50px; font-size: 24px; -webkit-border-radius: 10px; border-radius: 10px;}
	.ipd-completed {padding: 120px 0;}
	.ipd-completed h3 {font-size: 40px;}
	.ipd-completed p {font-size: 20px;}
}

