@charset "utf-8";

#free {width: 100%; overflow: hidden; color: #333; line-height: 1.3; letter-spacing: -0.025rem;}
#free * {box-sizing: border-box;}
#free img {display: block; max-width: 100%; margin: 0 auto;}
#free button {-webkit-appearance: none; appearance: none;}
#free #body_temp {}
.container {max-width: 1320px; padding-left: 20px; padding-right: 20px;}


.free-top {padding-top: 96px; padding-bottom: 56px; background: url('https://img.megastudyth.com/event/2024/free/free_top_bg.jpg')no-repeat center center / cover;}
.free-guide {margin-top: 80px;}
.free-guide__title {margin-bottom: 24px; font-size: 24px;}
.free-guide__video {display: flex; margin: 0 -10px;}
.free-guide__video li {width: 50%; padding: 0 10px;}
.free-guide__video li a {display: block; overflow: hidden; -webkit-border-radius: 16px; border-radius: 16px; position: relative;}
.free-guide__video li a span {display: block; padding: 16px 24px; color: #fff; font-weight: 500; font-size: 20px; background: rgba(0,0,0,0.5); position: absolute; left: 0; right: 0; bottom: 0;}
.free-guide__video li a:before {content: ''; display: block; width: 52px; height: 52px; background: #e5274f; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.free-guide__video li a:after {content: ''; display: block; width: 0px; height: 0px; border-style: solid; border-width: 9.5px 0 9.5px 13px; border-color: transparent transparent transparent #fff; transform: rotate(0deg); position: absolute; left: 50%; top: 50%; margin-left: 2px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}

.free-guide__btn {margin-top: 40px; display: flex; justify-content: center;}
.free-guide__btn li {padding: 0 5px;}
.free-guide__btn li a {padding: 0 20px; width: 304px; height: 56px; font-size: 20px; font-weight: 500; display: flex; align-items: center; justify-content: space-between; -webkit-border-radius: 32px; border-radius: 32px;}
.free-guide__btn li:nth-child(1) a {background: #e6f9ee; color: #19b132;}
.free-guide__btn li:nth-child(2) a {background: #ebf1fe; color: #3c74f6;}
.free-guide__btn li a em {display: block; width: 32px; height: 32px; position: relative; background: #fff; -webkit-border-radius: 50%; border-radius: 50%;}
.free-guide__btn li a em:before {content: ''; display: block; width: 32px; height: 2px; background: #333; position: absolute; right: 50%; bottom: 50%; margin-right: -4px; margin-bottom: -4px;}
.free-guide__btn li a em:after {content: ''; display: block; width: 12px; height: 2px; background: #333; position: absolute; right: 50%; bottom: 50%; margin-right: -4px; margin-bottom: -4px; transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

.free-coupon {margin-top: 56px;}
.free-coupon__box {background: #dfe6f3; padding: 24px 0; display: flex; align-items: center; -webkit-border-radius: 8px; border-radius: 8px;}
.free-coupon__box dt {flex-shrink: 0;}
.free-coupon__box dt img {}
.free-coupon__box dd {flex-grow: 1; padding-right: 24px;}
.free-coupon__box dd p {font-size: 28px; font-weight: 500;}
.free-coupon__box dd h5 {font-size: 32px; color: #3c74f6; font-weight: 600; margin-top: 4px;}
.free-coupon__box dd span {display: inline-flex; height: 45px; padding: 0 16px; background: #fff; font-size: 24px; font-weight: 500; margin-top: 8px; align-items: center; justify-content: center; -webkit-border-radius: 32px; border-radius: 32px;}

.free-lecture {padding: 80px 0; margin-top: 80px; background: #f6f6f6;}
.free-lecture__tab {width: 720px; margin: 0 auto; background: #ddd; outline: solid 4px #ddd; position: relative; -webkit-border-radius: 30px; border-radius: 30px;}
.free-lecture__tab ul {display: flex; position: relative;}
.free-lecture__tab ul li {width: 33.3333%;}
.free-lecture__tab ul li button {color: #999; width: 100%; height: 60px; 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;}
.free-lecture__tab ul li button.active {color: #fff;}
.free-lecture__tab span {display: block; height: 60px; width: 33.3333%; background: #333; position: absolute; left: 0; top: 0; -webkit-border-radius: 30px; border-radius: 30px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
.free-lecture__tab span:after {content: ''; position: absolute; top: 100%; left: 50%; display: block; width: 0px; height: 0px; border-style: solid; border-width: 11px 7px 0 7px; border-color: #333333 transparent transparent transparent; transform: rotate(0deg); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0);}

.free-lecture__depth {display: flex; justify-content: center; margin-top: 48px; margin-bottom: 32px;}
.free-lecture__depth li {margin: 0 6px;}
.free-lecture__depth li button {width: 108px; height: 48px; background: #ddd; color: #999; font-size: 20px; font-weight: 500; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 8px; border-radius: 8px;}
.free-lecture__depth li button.active {background: #333; color: #fff;}

.free-lecture__list {display: flex; flex-wrap: wrap; margin: -8px;}
.free-lecture__list li {width: 25%; padding: 8px;}
.free-lecture__list li a {display: block;}
.free-lecture__list li a em {display: block; padding-bottom: 59.6153%; -webkit-border-radius: 8px; border-radius: 8px;}
.free-lecture__list li a h5 {margin-top: 8px; font-size: 18px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.free-lecture__list li a p {margin-top: 4px; font-size: 15px; color: #999; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.3; height: 2.6em; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}



@media (max-width:1280px) {
	.free-coupon__box {padding: 24px 0;}
	.free-coupon__box dt img {width: 184px;}
	.free-coupon__box dd p {font-size: 24px;}
	.free-coupon__box dd h5 {font-size: 26px;}
	.free-coupon__box dd span {height: 40px; font-size: 20px;}
	.free-lecture__tab {width: 640px;}
}

@media (max-width:992px) {	
	.free-guide {margin-top: 64px;}
	.free-guide__title {margin-bottom: 16px; font-size: 20px;}
	.free-guide__video {margin: 0 -5px;}
	.free-guide__video li {padding: 0 5px;}
	.free-coupon__box dd p {font-size: 17px;}
	.free-coupon__box dd h5 {font-size: 19px;}
	.free-coupon__box dd span {height: 32px; font-size: 16px;}
	.free-lecture {padding: 64px 0; margin-top: 64px;}
	.free-lecture__tab {width: 480px;}
}

@media (max-width:768px) {
	.free-top {padding-top: 64px; padding-bottom: 40px;}
	.free-guide {margin-top: 40px;}
	.free-guide__title {margin-bottom: 8px; font-size: 16px;}
	.free-guide__video {display: block; margin: 0;}
	.free-guide__video li {width: 100%; margin-bottom: 8px;}
	.free-guide__video li:last-child {margin-bottom: 0;}
	.free-guide__video li a span {padding: 8px 12px; font-size: 13px;}
	.free-guide__btn {margin-top: 24px; display: block;}
	.free-guide__btn li {padding: 0; margin-bottom: 8px;}
	.free-guide__btn li a {width: 100%; height: 48px; font-size: 16px;}
	.free-guide__btn li a em {width: 24px; height: 24px;}
	.free-guide__btn li a em:before {width: 24px;}
	.free-guide__btn li a em:after {width: 10px;}
	.free-coupon {margin-top: 32px;}
	.free-coupon__box {display: block;}
	.free-coupon__box dd {padding: 24px 24px 0; text-align: center;}
	.free-coupon__box dd p {font-size: 16px;}
	.free-coupon__box dd h5 {font-size: 18px;}
	.free-coupon__box dd span {margin-top: 16px;}
	.free-lecture {padding: 48px 0; margin-top: 48px;}
	.free-lecture__tab {width: 100%;}
	.free-lecture__tab ul li button {height: 40px; font-size: 14px;}
	.free-lecture__tab span {height: 40px;}
	.free-lecture__depth {margin-top: 16px; margin-bottom: 24px;}
	.free-lecture__depth li {margin: 0 2px;}
	.free-lecture__depth li button {width: 72px; height: 32px; font-size: 13px;}
	.free-lecture__list {margin: -12px -4px;}
	.free-lecture__list li {width: 50%; padding: 12px 4px;}
	.free-lecture__list li a h5 {font-size: 14px;}
	.free-lecture__list li a p {font-size: 12px;}
}

@media (max-width:320px) {

}




.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);}




