/* filepath: /home/sm.edmuhak.com/resources/css/programs/detail/english-plus.css */
.english-plus h1 { font-size: 120rem; }
.english-plus em { color: #CE1126; }
.english-plus .title { margin-bottom: 61rem; font-size: 54rem; font-weight: bold; line-height: 1.3; }
.english-plus .font40 { font-size: 40rem; }
.english-plus .font32 { font-size: 32rem; }
.english-plus .font26 { font-size: 26rem; }
.english-plus .flex { display: flex; flex-wrap: wrap; }
.english-plus .flex-center { display: flex; justify-content: center; flex-wrap: wrap; }
.english-plus .circleBox { margin-bottom: 12rem; color: #fff; text-align: center; }
.english-plus .circleBox span { display: inline-block; padding: 8rem 16rem; background-color: #1EC95B; font-size: 22rem; font-weight: bold; border-radius: 500rem; isolation: isolate; }
.english-plus .lineBox { display: flex; align-items: center; justify-content: center; padding: 50rem 16rem; font-size: 32rem; font-weight: bold; text-align: center; }
.english-plus .lineBox figure { margin-right: 24rem; width: 134rem; height: 86rem; background-repeat: no-repeat; background-position: center; background-size: contain; }
.english-plus .squareBox { display: inline-block; padding: 0 6rem; border: 1rem solid #1EC95B; font-size: 13rem; font-weight: 400; color: #1EC95B; border-radius: 4rem; isolation: isolate; }
.english-plus .youtube-channel .max-width{padding-top: 0; padding-bottom: 0; text-align: left;}
.english-plus .common-video-type .video-item{background-color: #fff;}

.english-plus { color: #000; }
.english-plus .visual { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_visual.jpg") no-repeat center/cover; }
.english-plus .visual .max-width { padding-top: 100rem; }
.english-plus .visual .font40 { font-weight: bold; }
.english-plus .visual .font32 { font-weight: bold; }
.english-plus .visual h1 { margin-bottom: 20rem; }
.english-plus .visual .boxWrap { margin-top: 197rem; }
.english-plus .visual .boxWrap .box { padding: 24rem 0; width: 474rem; background-color: rgba(255, 255, 255, 1); font-weight: bold; border-radius: 100rem; isolation: isolate; }
.english-plus .visual .boxWrap .box + .box { margin-left: -52rem; position: relative; }
.english-plus .visual .boxWrap .box + .box::before { position: absolute; top: 50%; left: 8rem; width: 40rem; height: 40rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_visual_icon.svg") no-repeat center/contain; content: ""; transform: translateY(-50%); }
.english-plus .mean { background-color: #E4F880; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mean_bg.png"); background-repeat: no-repeat; background-position: top center; background-size: 100%; }
.english-plus .mean .value .title { margin-bottom: 21rem; }
.english-plus .mean .value .sub { line-height: 1.4; }
.english-plus .mean .value .area { margin-top: 120rem; margin-bottom: 100rem; padding: 80rem 92rem 60rem; border: 1rem solid rgba(255, 255, 255, 0.6); box-shadow: 0 10rem 10rem rgba(0, 0, 0, 0.1); position: relative; background-color: rgba(255, 255, 255, 0.3); backdrop-filter: blur(200rem); border-radius: 10rem; isolation: isolate; }
.english-plus .mean .value .area .valueTitle { padding: 16rem 32rem; box-shadow: 0 3rem 6rem rgba(0, 0, 0, 0.2); position: absolute; top: -60rem; left: 50%; background-color: #1EC95B; font-weight: bold; color: #fff; text-align: center; white-space: nowrap; transform: translateX(-50%) rotate(-4deg); border-radius: 500rem; isolation: isolate; }
.english-plus .mean .value .area .boxWrap { justify-content: space-between; }
.english-plus .mean .value .area .boxWrap .box { padding-bottom: 56.4%; width: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 12rem; isolation: isolate; }
.english-plus .mean .value .area .boxWrap .box.col3 { padding-bottom: 31%; width: calc(33.3% - 16rem); }
.english-plus .mean .value .area .boxWrap .box:nth-child(1) { margin-bottom: 24rem; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mena01.jpg"); }
.english-plus .mean .value .area .boxWrap .box:nth-child(2) { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mena02.jpg"); }
.english-plus .mean .value .area .boxWrap .box:nth-child(3) { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mena03.jpg"); }
.english-plus .mean .value .area .boxWrap .box:nth-child(4) { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mena04.jpg"); }
.english-plus .mean .value .area .bottomText { display: inline-block; margin-top: 40rem; padding-left: 60rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_mean_icon.png") no-repeat left top/45rem; }

.english-plus .mean .youtubeArea { display: grid; grid-template-columns: repeat(12, 1fr); grid-gap: 24rem; }
.english-plus .mean .youtubeArea .youtube-wrap { overflow: hidden; width: 100%; grid-column: 9 span; border-radius: 12rem; isolation: isolate; }
.english-plus .mean .youtubeArea .youtube-wrap iframe { width: 100%; aspect-ratio: 16/9; }
.english-plus .mean .youtubeArea ul { display: grid; grid-template-rows: repeat(3, 1fr); grid-gap: 13rem; grid-column: 3 span; }
.english-plus .mean .youtubeArea ul li { overflow: hidden; position: relative; transition: all 0.3s ease; cursor: pointer; border-radius: 12rem; isolation: isolate; }
.english-plus .mean .youtubeArea ul li::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); content: ""; opacity: 0; }
.english-plus .mean .youtubeArea ul li::after { border: 4rem solid #1EC95B; position: absolute; top: 0; left: 0; z-index: 1; width: calc(100% - 8rem); height: calc(100% - 8rem); content: ""; pointer-events: none; border-radius: 12rem; isolation: isolate; opacity: 0; touch-action: none; }
.english-plus .mean .youtubeArea ul li img { width: 100%; height: 100%; }
.english-plus .mean .youtubeArea ul li.active::before { opacity: 1; }
.english-plus .mean .youtubeArea ul li.active::after { opacity: 1; }
.english-plus .mean .youtubeArea ul li:hover::after { opacity: 1; }
.english-plus .review { background-color: #FFE1C9; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_review_bg.png"); background-repeat: no-repeat; background-position: top center; background-size: 100%; }
.english-plus .review .boxWrap { justify-content: space-between; text-align: left; row-gap: 24rem; }
.english-plus .review .boxWrap .box { padding: 42rem 40rem 46rem; box-shadow: 0 0 20rem rgba(0, 0, 0, 0.1); width: calc(50% - 12rem); background-color: #fff; font-size: 18rem; font-weight: 300; border-radius: 12rem; isolation: isolate; }
.english-plus .review .boxWrap .box .name { margin-bottom: 24rem; padding-bottom: 24rem; padding-left: 42rem; border-bottom: 1rem solid #C5C5C5; position: relative; background-repeat: no-repeat; background-position: left top; background-size: 30rem; font-size: 20rem; font-weight: bold; }
.english-plus .review .boxWrap .box .name::after { position: absolute; top: 0; right: 0; width: 186rem; height: 30rem; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_review_star.png"); background-repeat: no-repeat; background-position: center; background-size: contain; content: ""; }
.english-plus .review .boxWrap .box strong { display: block; margin: 4rem 0; }
.english-plus .review .boxWrap .box .sub { margin-bottom: 24rem; }
.english-plus .courseType { padding: 120rem 16rem; background-color: #F9FFDF; background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_courseType_bg.png"); background-repeat: no-repeat; background-position: top center; background-size: 100%; }
.english-plus .courseType .max-width { padding: 0; }
.english-plus .courseType .typeWrap { margin-bottom: 120rem; row-gap: 40rem; column-gap: 24rem; }
.english-plus .courseType .typeWrap .type { box-shadow: 0 0 20rem rgba(0, 0, 0, 0.1); overflow: hidden; width: calc(33.3% - 16rem); background-color: #fff; border-radius: 12rem; isolation: isolate; }
.english-plus .courseType .typeWrap .type .imgWrap { position: relative; width: 100%; height: 180rem; }
.english-plus .courseType .typeWrap .type .imgWrap figure { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; object-fit: cover; }
.english-plus .courseType .typeWrap .type .imgWrap span { padding: 9rem 16rem; position: absolute; right: 12rem; bottom: 12rem; background-color: #1EC95B; font-weight: bold; color: #fff; border-radius: 500rem; isolation: isolate; }
.english-plus .courseType .typeWrap .type .textWrap { padding: 24rem 24rem 40rem; font-size: 18rem; text-align: left; }
.english-plus .courseType .typeWrap .type .textWrap span { margin-bottom: 8rem; }
.english-plus .courseType .typeWrap .type .textWrap p + span { margin-top: 24rem; }
.english-plus .courseType .typeWrap .type.last { display: flex; justify-content: space-between; flex-direction: column; -ms-flex-direction: column; box-shadow: none; background-color: transparent; }
.english-plus .courseType .typeWrap .type.last figure { width: 100%; height: calc(33.3% - 20rem); object-fit: cover; border-radius: 12rem; isolation: isolate; }
.english-plus .courseType .title.type2 { margin-bottom: 40rem; }
.english-plus .courseType .rec { position: relative; }
.english-plus .courseType .rec nav { padding: 10rem 0; position: sticky; top: 0; z-index: 10; background-color: #F9FFDF; }
.english-plus .courseType .rec nav li { background-color: #EFF1F6; font-size: 22rem; text-align: center; transition: all 0.3s ease; border-radius: 500rem; isolation: isolate; }
.english-plus .courseType .rec nav li + li { margin-left: 40rem; }
.english-plus .courseType .rec nav li.active { background-color: #1EC95B; font-weight: bold; color: #fff; }
.english-plus .courseType .rec nav li button { padding: 16rem 70rem; font-weight: inherit; color: inherit; }
.english-plus .courseType .rec .subTitle { display: flex; align-items: center; justify-content: center; margin-top: 80rem; margin-bottom: 60rem; font-weight: bold; }
.english-plus .courseType .rec .subTitle figure { margin-right: 12rem; width: 70rem; height: 46rem; background-repeat: no-repeat; background-position: center; background-size: contain; }
.english-plus .courseType .rec article { box-shadow: 0 3rem 6rem #E4E7EE; overflow: hidden; min-height: 301rem; background-color: #fff; border-radius: 12rem; isolation: isolate; }
.english-plus .courseType .rec article .imgWrap { position: relative; width: 32%; }
.english-plus .courseType .rec article .imgWrap .bgImage { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; object-fit: cover; }
.english-plus .courseType .rec article .imgWrap .bgImage.mo-image { display: none; }
.english-plus .courseType .rec article .imgWrap .logo { position: absolute; top: 0; left: 12rem; width: 124rem; height: 67rem; background-repeat: no-repeat; background-position: center; background-size: contain; object-fit: contain; border-radius: 0 0 8rem 8rem; isolation: isolate; }
.english-plus .courseType .rec article .textWrap { padding: 40rem 24rem; width: 68%; font-size: 18rem; color: #333; text-align: left; }
.english-plus .courseType .rec article .textWrap strong { font-size: 26rem; color: #000; }
.english-plus .courseType .rec article .textWrap .sub { margin-bottom: 24rem; }
.english-plus .courseType .rec article .textWrap .bottomText { margin-top: 24rem; padding-left: 72rem; position: relative; }
.english-plus .courseType .rec article .textWrap .bottomText .squareBox { position: absolute; top: 4rem; left: 0; font-weight: 600; }
.english-plus .courseType .rec article + article { margin-top: 60rem; }

#why .articleTitle h2 { margin-bottom: 0; }

@media screen and (max-width: 1200px) {
    .english-plus h1 { line-height: 1.3; }
    .english-plus .mean .youtubeArea { grid-template-columns: repeat(1, 1fr); grid-gap: 10rem; }
    .english-plus .mean .youtubeArea .youtube-wrap { grid-column: 1 span; }
    .english-plus .mean .youtubeArea ul { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(1, 1fr); grid-gap: 6rem; grid-column: 1 span; }
}
@media screen and (max-width: 991px) {
    .english-plus h1 { font-size: 50rem; }
    .english-plus .font40 { font-size: 24rem; }
    .english-plus .font32 { font-size: 22rem; }
    .english-plus .font26 { font-size: 18rem; }
    .english-plus .title { margin-bottom: 30rem; font-size: 28rem; line-height: 1.3; }
    .english-plus .lineBox { display: block; padding: 30rem 16rem; font-size: 20rem;}
    .english-plus .lineBox figure { margin: 0 auto 12rem; width: 93rem; height: 60rem; }
    .english-plus .circleBox { margin-bottom: 10.4rem; }
    .english-plus .circleBox span { padding: 7.8rem 16.9rem; font-size: 17.9rem; font-weight: 600; }
    .english-plus .squareBox { font-size: 13rem; }
    .english-plus .visual { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_visual_mo.jpg"); }
    .english-plus .visual .max-width { padding-top: 60rem; }
    .english-plus .visual h1 { margin: 4rem 0 11.7rem; }
    .english-plus .visual .boxWrap { margin-right: auto; margin-left: auto; max-width: 330rem; }
    .english-plus .visual .boxWrap .box { width: calc(100% - 48rem); height: auto; font-size: 16rem; line-height: 1.3; }
    .english-plus .visual .boxWrap .box + .box { margin-top: 12rem; margin-left: 0; }
    .english-plus .visual .boxWrap .box + .box::before { top: -20rem; left: 50%; width: 30rem; height: 30rem; transform: translateX(-50%); }
    .english-plus .mean .font32 { font-size: 19.9rem; }
    .english-plus .mean .value .area { margin-top: 78rem; margin-bottom: 65rem; padding: 70rem 13rem 30rem;}
    .english-plus .mean .value .area .valueTitle { padding: 10.4rem 26rem; font-size: 22rem; line-height: 1.2; }
    .english-plus .mean .value .area .boxWrap .box.col3 { padding-bottom: 49%; width: calc(50% - 4rem); }
    .english-plus .mean .value .area .boxWrap .box:last-child { display: none; }
    .english-plus .mean .value .area .bottomText { margin-top: 20rem; padding-left: 40rem; background-size: 30rem; text-align: left; word-break: break-all;}
    .english-plus .mean .youtubeArea ul li::after { width: calc(100% - 4rem); height: calc(100% - 4rem); border-width: 2rem; }
    .english-plus .review { background-image: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/renewal/programs/details/english-plus/english-plus_review_bg_mo.png"); }
    .english-plus .review .boxWrap { row-gap: 24rem; }
    .english-plus .review .boxWrap .box { padding: 30rem 24rem; width: 100%; }
    .english-plus .review .boxWrap .box .name { padding-bottom: 16rem; padding-left: 32.5rem; background-size: 242rem; background-size: 24rem; font-size: 16rem;}
    .english-plus .review .boxWrap .box .name::after { width: 151rem; height: 24rem; }
    .english-plus .review .boxWrap .box .textWrap { font-size: 14.9rem; word-break: break-word; }
    .english-plus .review .boxWrap .box .textWrap strong { margin: 0.3rem 0; font-size: 16rem; }
    .english-plus .review .boxWrap .box .sub { margin-bottom: 16rem; }
    .english-plus .courseType { padding: 60rem 16rem; }
    .english-plus .courseType .typeWrap { margin-bottom: 60rem; column-gap: 24rem; row-gap: 26rem;}
    .english-plus .courseType .typeWrap .type { width: 100%; }
    .english-plus .courseType .typeWrap .type .imgWrap { height: 38vw; max-height: 400rem; }
    .english-plus .courseType .typeWrap .type .imgWrap span { padding: 7.8rem 15.6rem; right: 12rem; bottom: 8rem; font-size: 16rem; }
    .english-plus .courseType .typeWrap .type .textWrap { padding: 24rem 24rem 30rem; font-size: 14.9rem; }
    .english-plus .courseType .typeWrap .type .textWrap p + span { margin-top: 28rem; }
    .english-plus .courseType .typeWrap .type.last { display: none; }
    .english-plus .courseType .title.type2 { margin-bottom: 26rem; }
    .english-plus .courseType .rec nav ul { gap: 12rem; justify-content: center; margin: 0 auto; max-width: 360rem; }
    .english-plus .courseType .rec nav ul li { padding: 2rem 0; font-size: 16rem; }
    .english-plus .courseType .rec nav ul li + li { margin-left: 0; }
    .english-plus .courseType .rec nav ul li button { padding: 5rem 19rem; }
    .english-plus .courseType .rec nav ul li.active { font-weight: inherit; }
    .english-plus .courseType .rec .subTitle { display: block; margin: 40rem 0; line-height: 1.3; }
    .english-plus .courseType .rec .subTitle figure { margin: 0 auto 4rem; width: 48rem; height: 32rem; }
    .english-plus .courseType .rec article .imgWrap { width: 100%; height: 31vw; }
    .english-plus .courseType .rec article .imgWrap .bgImage.pc-image { display: none; }
    .english-plus .courseType .rec article .imgWrap .bgImage.mo-image { display: block; }
    .english-plus .courseType .rec article .imgWrap .logo { top: auto; right: 13rem; bottom: -20rem; left: auto; width: 90rem; height: 50rem; border-radius: 8rem; isolation: isolate;}
    .english-plus .courseType .rec article .textWrap { padding: 27rem 24rem 30rem; width: 100%; font-size: 14.9rem; word-break: normal; }
    .english-plus .courseType .rec article .textWrap strong { font-size: 19.9rem; }
    .english-plus .courseType .rec article .textWrap .sub { margin: 4rem 0 25rem; }
    .english-plus .courseType .rec article .textWrap .bottomText { display: block; margin-top: 23rem; padding-left: 0; }
    .english-plus .courseType .rec article .textWrap .bottomText .squareBox { margin-bottom: 4rem; position: static; }
    .english-plus .courseType .rec article + article { margin-top: 24rem; }
}