@charset "UTF-8"; @import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css"); @font-face { font-family: 'Cafe24Shiningstar'; src: url('../../fonts/Cafe24Shiningstar-v2.0.woff') format('woff'); font-weight: normal; font-style: normal; } @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300; 400; 500; 600; 700; 800; 900&display=swap'); @font-face { font-family: 'NanumSquare'; font-weight: 700; src: url('../../fonts/NanumSquareB.ttf') format('woff'), url('../../fonts/NanumSquareB.ttf') format('woff2'); } @font-face { font-family: 'NanumSquare'; font-weight: 900; src: url('../../fonts/NanumSquareEB.ttf') format('woff'), url('../../fonts/NanumSquareEB.ttf') format('woff2'); } /******************************************************************************* 애니메이션 ********************************************************************************/ @keyframes move { 0% { transform: translateY(0); opacity: 0; } 10% ,90% { opacity: 1; } 100% { transform: translateY(45vw); opacity: 0; } } /* ---------------------------------------------- * Generated by Animista on 2023-12-29 8:21:12 * Licensed under FreeBSD License. * See http://animista.net/license for more info. * w: http://animista.net, t: @cssanimista * ---------------------------------------------- */ /** * ---------------------------------------- * animation bounce-in-bottom * ---------------------------------------- */ @-webkit-keyframes bounce-in-bottom { 0% { -webkit-transform: translateY(500rem); transform: translateY(500rem); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 38% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; } 55% { -webkit-transform: translateY(65px); transform: translateY(65px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 72% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 81% { -webkit-transform: translateY(28px); transform: translateY(28px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 90% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 95% { -webkit-transform: translateY(8px); transform: translateY(8px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes bounce-in-bottom { 0% { -webkit-transform: translateY(500rem); transform: translateY(500rem); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 38% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; } 55% { -webkit-transform: translateY(65px); transform: translateY(65px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 72% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 81% { -webkit-transform: translateY(28px); transform: translateY(28px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 90% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 95% { -webkit-transform: translateY(8px); transform: translateY(8px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @-webkit-keyframes bounce-in-bottom-mo { 0% { -webkit-transform: translate(-50%,500rem); transform: translate(-50%,500rem); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 38% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; } 55% { -webkit-transform: translate(-50%,65px); transform: translate(-50%,65px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 72% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 81% { -webkit-transform: translate(-50%,28px); transform: translate(-50%,28px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 90% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 95% { -webkit-transform: translate(-50%,8px); transform: translate(-50%,8px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @keyframes bounce-in-bottom-mo { 0% { -webkit-transform: translate(-50%,500rem); transform: translate(-50%,500rem); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 38% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; } 55% { -webkit-transform: translate(-50%,65px); transform: translate(-50%,65px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 72% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 81% { -webkit-transform: translate(-50%,28px); transform: translate(-50%,28px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 90% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 95% { -webkit-transform: translate(-50%,8px); transform: translate(-50%,8px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } } @-webkit-keyframes opacity { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes opacity { 0% { opacity: 0; } 100% { opacity: 1; } } /******************************************************************************* layout ********************************************************************************/ .dndn-package * { box-sizing: border-box; } .dndn-package { font-family: 'Noto Sans KR', sans-serif; } .dndn-package-section02 { background: linear-gradient(180deg, #FDDBBC 10%, #FFBFA7 30%); } .dndn-package-section03 { position: relative; z-index: 1; overflow: hidden; background: #F0EFFA; } .dndn-package-section04 { background: #FFD786; } .dndn-package-section05 { background: #F4FDFC; } .dndn-package-section06 { background: #FFF6C4; } .dndn-package-section07 { background: #EBEBEB; } .dndn-package-section08 { background: #FFD786; } .dndn-package-section09 { background: linear-gradient(180deg, #FF8A6D 0%, #FFC26A 100%); } .dndn-package-width { width: 1080px; margin: 0 auto; padding: 100rem 0; text-align: center; } .dndn-package-sub-title { font-size: 60rem; margin-bottom: 80rem; color: #000; } .dndn-package-sub-title > span { font-size: 32rem; color: #000000; } .dndn-package-sub-title > span > strong { font-size: 40rem; } .dndn-package-sub-title > strong { color: #8150FF; } .dndn-package.container .maxWidth{padding: 0;} .dndn-package.container > article, .dndn-package.container section > article{padding: 0;} /******************************************************************************* 타이틀 ********************************************************************************/ .dndn-package-section01 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section01-bg01-221026.jpg") no-repeat center bottom; background-size: cover; } .dndn-package-section01-title { width: 75%; margin: 0 auto; padding: 80rem 60rem 80rem; background: #0C1B43; -webkit-border-radius: 15rem; -moz-border-radius: 15rem; border-radius: 15rem; color: #FFFFFF; font-size: 105rem; line-height: 1; } .dndn-package-section01-title > small { display: block; font-size: 34rem; line-height: 1.2; font-weight: 500; } .dndn-package-section01-title > strong { font-family: 'Cafe24Shiningstar', sans-serif; font-size: 200rem; font-weight: 400; color: #FAB52A; display: inline-block; line-height: 1; } .dndn-package-section01-title > span { display: inline-block; margin-top: 24rem; line-height: 1; font-size: 32rem; color: #0D1C43; background: #FAB52A; padding: 10rem 48rem; -webkit-border-radius: 8rem; -moz-border-radius: 8rem; border-radius: 8rem; font-weight: 700; } .dndn-package-section01-title > span > span { color: red; } .dndn-package-section01.dndn2406 .dndn-package-section01-title { background: #fff; color: #000000; line-height: 1.2; max-width: 712rem; font-size: 112rem; } .dndn-package-section01.dndn2406 .dndn-package-section01-title > small { color: #8E61FF; font-size: 40rem; font-weight: 700; } .dndn-package-section01.dndn2406 .dndn-package-section01-title > strong { display: block; color: #350FA8; line-height: 1; } .dndn-package-section01.dndn2406 .dndn-package-section01-title > span { display: block; background: #350FA8; color: #fff; line-height: 1.4; } .dndn-package-section01.dndn2406 .dndn-package-section01-title > span > span { color: #FFEA33; } /******************************************************************************* 무엇이 걱정되나요? ********************************************************************************/ .dndn-package-section02-title { font-size: 46rem; color: #000; margin-bottom: 50rem; line-height: 1.4; } .dndn-package-section02-title > span { display: inline-block; padding: 4rem 40rem; background: #8150FF; color: #fff; font-size: 60rem; } .dndn-package-section03-con-busan li, .dndn-package-section02-con { -webkit-border-radius: 30rem; -moz-border-radius: 30rem; border-radius: 30rem; background: #fff; margin-bottom: 8rem; padding: 20rem 0; } .dndn-package-section02-con > span { font-size: 28rem; font-weight: 500; color: #000; position: relative; } .dndn-package-section02-con > span::before { content: ''; position: absolute; left: 105%; top: 50%; transform: translateY(-50%); width: 104rem; height: 86rem; } .dndn-package-section02-con:nth-child(2n +1) > span::before { left: auto; right: 105%; } .dndn-package-section02-text { margin-top: 60rem; font-size: 32rem; color: #000; } .dndn-package-section02-text > strong > strong { color: #3F07CE; } .dndn-package-section02-row1 > span::before { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section02-img01-221026.png") no-repeat center center; background-size: cover; top: 20%; } .dndn-package-section02-row2 > span::before { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section02-img02-221026.png") no-repeat center center; background-size: cover; } .dndn-package-section02-row3 > span::before { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section02-img03-221026.png") no-repeat center center; background-size: cover; } .dndn-package-section02-row4 > span::before { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section02-img04-221026.png") no-repeat center center; background-size: cover; } .dndn-package-section02-row5 > span::before { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section02-img05-221026.png") no-repeat center center; background-size: cover; top: 100%; } /******************************************************************************* 어학연수 든든 패키지 ********************************************************************************/ .dndn-package-section03-title { font-size: 60rem; color: #000; margin-bottom: 60rem; position: relative; line-height: 1.2; } .dndn-package-section03-title::before { content: ''; position: absolute; right: 0; transform: translate(50%,-10%); top: 100%; width: 327rem; height: 260rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section03-img01-221026.png") no-repeat center top; background-size: cover; } .dndn-package-section03-title > span { font-size: 40rem; } .dndn-package-section03-title > strong { color: #8150FF; } .dndn-package-section03-con { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 20rem; margin-bottom: 40rem; } .dndn-package-section03-con-col { display: flex; justify-content: center; align-items: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 240rem; height: 240rem; background: #FFE064; border: 3rem solid #FFFFFF; margin: 0 auto; } .dndn-package-section03-con-col > span { font-size: 30rem; line-height: 1.2; font-weight: 700; } .dndn-package-section03-con-col > span > svg { width: 26rem; } .dndn-package-section03-textBox { padding: 38rem 0; background: #E7E5F5; -webkit-border-radius: 100rem; -moz-border-radius: 100rem; border-radius: 100rem; font-size: 32rem; color: #000; line-height: 1.2; position: relative; font-weight: 700; } .dndn-package-section03-textBox::before { content: ''; position: absolute; left: 0; top: 50%; transform: translate(-40%,-50%); width: 178rem; height: 227rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section03-img02-221026.png") no-repeat center center; background-size: cover; } .dndn-package-section03-textBox small { display: block; margin-top: 8rem; line-height: 1.4; font-size: 18rem; } .dndn-package-section03-textBox > span { color: #DD0000; } .busan #dndn-package-section03 * { font-family: 'NanumSquare', sans-serif; font-weight: 900; } .dndn-package-section03-con-busan { position: relative; } .dndn-package-section03-con-busan-row { padding: 50rem 16rem !important; border-radius: 4rem !important; box-shadow: 10rem 10rem 20rem rgba(0, 0, 0, 10%); } .dndn-package-section03-con-busan-row2 { background: #fff url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section03-con-busan-img01.png") no-repeat right center !important; background-size: 10% !important; } .dndn-package-section03-con-busan-row > span { display: inline-block; margin-bottom: 24rem; line-height: 1.2; font-weight: 900 !important; font-size: 34rem; } .dndn-package-section03-con-busan-row > span:last-child { margin-bottom: 0; } .dndn-package-section03-con-busan-row > span > span { display: inline-block; position: relative; z-index: 1; } .dndn-package-section03-con-busan-row > span > span::before { content: ''; position: absolute; z-index: -1; left: 4rem; top: 50%; height: 50%; width: 100%; background: #FFE06450; } .dndn-package-section03-con-busan strong { color: #DD0000; font-weight: 900; } .dndn-package-section03-con-busan small { display: block; font-weight: 400 !important; font-size: 14rem; color: #888888; font-family: 'Noto Sans KR', sans-serif !important; } .dndn-package-section03-con-busan-text { margin-bottom: 80rem; font-size: 14rem; color: #888888; font-family: 'Noto Sans KR', sans-serif !important; font-weight: 400 !important; } .busan .dndn-package-section03-title::before { display: none; } .busan .dndn-package-section03-title { font-family: 'Noto Sans KR', sans-serif; } .busan .dndn-package-section03-title > span , .busan .dndn-package-section03-title > strong { font-weight: 700; } .busan .dndn-package-section03-textBox { font-family: 'Noto Sans KR', sans-serif; font-weight: 700; } .busan .dndn-package-section03-textBox::before { display: none; } .dndn-package-section03.may { background: #FFE3F2; } .dndn-package-section03.may .dndn-package-section03-title > span { font-size: 75rem; letter-spacing: -1rem; } .dndn-package-section03.may .dndn-package-section03-title { font-size: 70rem; } .dndn-package-section03.may .dndn-package-section03-textBox { background: #F9D9E9; } /* 240529 6월 추가 */ .dndn2406 .dndn-package-section03-title { position: relative; } .dndn2406 .dndn-package-section03-title::before { right: 0; bottom: 0; top: auto; transform: translateY(50%); aspect-ratio: 327 / 260; width: 25%; height: auto; } .dndn-package-section03-con2 { display: grid; grid-template-columns: repeat(12,1fr); grid-gap: 24rem; margin-bottom: 40rem; } .dndn-package-section03-con2 li { grid-column: 4 span; padding: 40rem 20rem; background: #fff; border-radius: 20rem; box-shadow: 0 3rem 12rem #E0DEEF; } .dndn-package-section03-con2 li:nth-child(n + 4) { grid-column: 3 span; } .dndn-package-section03-con2 li > span { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; width: 32rem; margin: 0 auto 12rem; background: #B8B2EC; border-radius: 50%; font-weight: 700; font-size: 16rem; color: #fff; } .dndn-package-section03-con2 li > span > span { transform: translateY(-5%); } .dndn-package-section03-con2 li p { font-size: 26rem; font-weight: 700; color: #000; } .dndn-package-section03-con2 li p strong { display: block; color: #681AFF; } .dndn-package-section03-textBox2.dndn-package-section03-textBox::before { aspect-ratio: 166 / 162; height: 160rem; width: auto; background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section03-img02-240529.png') no-repeat center center; background-size: cover; transform: translateY(-50%); } .dndn-package-section03-textBox2 { margin-bottom: 40rem; border-radius: 20rem; } .dndn-package-section03-textBox2 > span { font-size: 26rem; } .dndn-package-section03-linkBox { display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 24rem; } .dndn-package-section03-linkBox > a { display: flex; justify-content: center; align-items: center; padding: 16rem 0; border-radius: 8rem; background: #2E04FF; box-shadow: 0 10rem 16rem #B7A8FF; font-size: 32rem; font-weight: 700; color: #fff; } .dndn-package-section03-linkBox > a > svg { aspect-ratio: 24 / 30; height: 30rem; } /******************************************************************************* 주목! 어학연수 혜택 베스트 ********************************************************************************/ .benefit-best{background-color: #FFEAA4; text-align: center; padding: 80rem 0;} .benefit-best .videoWrap.youtube{position: relative; cursor: pointer; background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden; aspect-ratio: 1024/576; width: 1024rem; margin: 0 auto; border-radius: var(--r-radius02); box-shadow: 0px 8rem 20rem 0px rgba(0, 0, 0, 0.12); max-width: 100%;} .benefit-best .videoWrap.youtube::after{display: none;} .benefit-best .videoWrap.youtube .video{width: 100%; height: 100%;} .benefit-best .videoWrap.youtube figure {position: absolute; width: 100%; height: 100%; object-fit: cover; top: 50%; left: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 2;} .benefit-best .videoWrap.youtube iframe { width: 100%; height: 100%; object-fit: cover; border: none; outline: 0;} .benefit-best .videoWrap.youtube figure::after{content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; background-size: cover; width: 82rem; height: 82rem; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/btn_play.png'); touch-action: none; pointer-events: none;} .benefit-best em{color: #640BFF;} .benefit-best *{font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;} .benefit-best .all-title .title{font-size: var(--f-fontSize01); font-weight: 700; color: var(--c-text01); margin-top: 8rem; margin-bottom: 93rem;} .benefit-best .roundWrap{position: relative; background-color: #fff; border-radius: var(--r-radius02); box-shadow: 0px 8rem 20rem 0px rgba(0, 0, 0, 0.12); padding: 80rem 60rem 60rem;} .benefit-best .roundWrap + .roundWrap{margin-top: 93rem;} .benefit-best .roundWrap .wrap-title{background-color: #000; position: absolute; color: #fff; width: 500rem; height: 66rem; border-radius: var(--r-radius03); top: -33rem; left: 50%; transform: translateX(-50%); line-height: 2.9; display: inline-block; font-size: var(--f-fontSize04); font-weight: 700;} .benefit-best .roundWrap .wrap-title em{color: #FFF843;} .benefit-best .article + .article{padding-top: 60rem; margin-top: 60rem; border-top: 1px solid #E4E8F1;} .benefit-best .article1{display: flex; flex-wrap: wrap; column-gap: 24rem; padding-left: 46rem; padding-right: 46rem;} .benefit-best .article1 .innerWrap{width: calc(50% - 12rem);} .benefit-best .article1 .textWrap{text-align: left; color: var(--c-text01); } .benefit-best .article1 .textWrap h3{font-size: var(--f-fontSize03); letter-spacing: -0.26rem; margin-bottom: 16rem; line-height: 150%; } .benefit-best .article1 .textWrap p{font-size: 24rem; letter-spacing: -0.24rem; font-weight: 500; line-height: 150%; } .benefit-best .article1 .textWrap .bottom{font-size: var(--f-body2); color: var(--c-text03); letter-spacing: -0.14rem; margin-top: 32rem;} .benefit-best .article1 .textWrap .bottom span{display: block; line-height: 150%; } .benefit-best .article1 .imgWrap{border-radius: var(--r-radius01); overflow: hidden; aspect-ratio: 506/270;} .benefit-best .article1 .imgWrap img{width: 100%; object-fit: cover; height: 100%;} .benefit-best .article2 .sub-title{font-size: var(--f-fontSize04); font-weight: 700; margin-bottom: 8rem; color: var(--c-text01); letter-spacing: -0.22rem;} .benefit-best .article2 h3{font-size: var(--f-fontSize02); font-weight: 700; line-height: 130%; color: var(--c-text01); letter-spacing: -0.64px;} .benefit-best .article2 .sub-bottom{font-size: var(--f-body2); color: var(--c-text03); margin-top: 12rem; letter-spacing: -0.16rem; line-height: 150%;} .benefit-best .article2 .roundBox{border-radius: var(--r-radius01); background-color: #fff; box-shadow: 0px 4rem 10rem 0px #EBEFF4; border: 1px solid #E4E8F1; } .benefit-best .article2 .box-2{display: flex; flex-wrap: wrap; column-gap: 24rem; margin-top: 40rem;} .benefit-best .article2 .box-2 .roundBox{width: calc(50% - 12rem); padding: 40rem 32rem;} .benefit-best .article2 .box-2 .roundBox p{font-size: var(--f-fontSize03); font-weight: 700; margin-bottom: 32rem;} .benefit-best .article2 .box-2 .roundBox img{margin: 0 auto;} .benefit-best .article2 .review-text{margin-top: 24rem; margin-bottom: 60rem;} .benefit-best .article2 .review-text .roundBox{padding: 40rem 72rem; display: flex; align-items: center;} .benefit-best .article2 .review-text .roundBox + .roundBox{margin-top: 12rem;} .benefit-best .article2 .review-text .roundBox .imgWrap{aspect-ratio: 1/1; width: 100rem; height: 100rem; border-radius: 50%; background-repeat: no-repeat; background-size: cover; background-position: center;} .benefit-best .article2 .review-text .roundBox .textWrap{width: calc(100% - 100rem); padding-left: 36rem; text-align: left; letter-spacing: -0.2rem; color: var(--c-text01); line-height: 150%;} .benefit-best .article2 .review-text .roundBox .textWrap .name{color: var(--c-text03); font-size: var(--f-body2); margin-top: 12rem; letter-spacing: -0.16rem;} .benefit-best .article2 .videoWrap{ overflow: hidden;} .benefit-best .roundWrap1 .article1 .textWrap .bottom{font-size: var(--f-detail); margin-top: 24rem;} /******************************************************************************* 수업 4주 무료 ********************************************************************************/ .dndn-package-section04-con { padding: 80rem; background: #ffff; -webkit-border-radius: 20rem; -moz-border-radius: 20rem; border-radius: 20rem; display: flex; justify-content: space-between; margin-bottom: 20rem; } .dndn-package-section04-con.dndn-package-section04-con1 { padding: 0 0 80rem; } .dndn-package-section04-textBox { width: 60%; text-align: left; } .dndn-package-section04-con-title { font-size: 46rem; color: #000; margin-bottom: 50rem; } .dndn-package-section04-con-title > span { font-size: 32rem; display: flex; align-items: center; } .dndn-package-section04-con-title-2 > span { justify-content: center; } .dndn-package-section04-con-title > span > strong { color: #8150FF; } .dndn-package-section04-con-title > span > span { font-size: 20rem; color: #fff; background: #F75252; display: inline-block; padding: 7rem 26rem; margin-right: 6rem; } .dndn-package-section04-con-title > span > span:first-child { color: #000; background: #FFE064; } .dndn-package-section04-con-title > strong { color: #8150FF; } .dndn-package-section04-con-title > small { font-size: 14rem; font-weight: 300; color: #888888; } .dndn-package-section04-con-text { font-size: 24rem; color: #000; margin-bottom: 40rem; } .dndn-package-section04-con-text > strong { color: #8150FF; } .dndn-package-section04-con-list li { color: #888888; font-size: 14rem; } .dndn-package-section04-con-list li::before { content: '※'; } .dndn-package-section04-imgBox { width: 40%; } .dndn-package-section04-con-wrap { padding: 80rem; background: #ffff; -webkit-border-radius: 20rem; -moz-border-radius: 20rem; border-radius: 20rem; margin-bottom: 20rem; } .dndn-package-section04-con-con2 { padding: 80rem 0 0; position: relative; } .dndn-package-section04-con-con2::before { content: ''; position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%); width: 100%; height: 4rem; border: 1px solid #ccc; -webkit-border-radius: 20rem; -moz-border-radius: 20rem; border-radius: 20rem; background: #CCCCCC; } .dndn-package-section04-con2-row1 { margin-bottom: 60rem; display: grid; grid-template-columns: repeat(2,1fr); grid-gap: 10rem; } .dndn-package-section04-con2-row1-left { background: #EBEBEB; padding: 40rem; -webkit-border-radius: 30rem; -moz-border-radius: 30rem; border-radius: 30rem; } .dndn-package-section04-con2-row1-left-title { font-size: 32rem; color: #000; margin-bottom: 40rem; } .dndn-package-section04-con2-row1-left-title > strong { color: #8150FF; } .dndn-package-section04-con2-row1-left-graph { width: 280rem; height: 280rem; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin: 0 auto 16rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-graph-221026.png") no-repeat center center; background-size: cover; font-size: 0; } .dndn-package-section04-con2-row1-left-color { display: flex; justify-content: space-between; align-items: center; } .dndn-package-section04-con2-row1-left-color > span { font-size: 14rem; color: #000; } .dndn-package-section04-con2-row1-left-color > span > span { display: inline-block; width: 12rem; height: 12rem; margin-right: 6rem; background: #000; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .dndn-package-section04-con2-row1-left-color > span:nth-child(1) > span { background: #4678DB; } .dndn-package-section04-con2-row1-left-color > span:nth-child(2) > span { background: #00CB9C; } .dndn-package-section04-con2-row1-left-color > span:nth-child(3) > span { background: #FF9900; } .dndn-package-section04-con2-row1-left-color > span:nth-child(4) > span { background: #976CEA; } .dndn-package-section04-con2-row1-left-color > span:nth-child(5) > span { background: #818181; } .dndn-package-section04-con2-row1-right { background: #743EFF; padding: 40rem; -webkit-border-radius: 30rem; -moz-border-radius: 30rem; border-radius: 30rem; } .dndn-package-section04-con2-row1-right-title { font-size: 32rem; color: #fff; margin-bottom: 40rem; } .dndn-package-section04-con2-row1-right-title > strong { color: #10FF9A; } .dndn-package-section04-con2-row1-right-list { display: inline-block; } .dndn-package-section04-con2-row1-right-list li { font-size: 20rem; color: #fff; text-align: left; border-bottom: 1px dashed #fff; padding: 10rem 0; } .dndn-package-section04-con2-row2 { margin-bottom: 100rem; } .dndn-package-section04-con2-row2-row { border: 1px solid #e5e5e5; margin-bottom: 12rem; box-shadow: 10rem 10rem 20rem #00000010; -webkit-border-radius: 10rem; -moz-border-radius: 10rem; border-radius: 10rem; text-align: left; padding: 40rem; display: flex; align-items: center; justify-content: space-between; } .dndn-package-section04-con2-row2-textBox { width: calc(95% - 130rem); } .dndn-package-section04-con2-row2-textBox > p { font-size: 20rem; margin-bottom: 12rem; } .dndn-package-section04-con2-row2-textBox > p > strong { color: #4D7DFF; font-weight: 400; } .dndn-package-section04-con2-row2-textBox > span { font-size: 18rem; color: #707070; } .dndn-package-section04-con2-row2-textBox > span > strong::after { content: '-'; } .dndn-package-section04-con2-row2-imgBox { width: 130rem; height: 130rem; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .dndn-package-section04-con2-row3 { width: 100%; height: 518rem; } .dndn-package-section04-con2-row3 > iframe { width: 100%; height: 100%; border: none; box-shadow: 15rem 15rem 30rem #00000020; } .dndn-package-section04-con2-row2-row1 .dndn-package-section04-con2-row2-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img08-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con2-row2-row2 .dndn-package-section04-con2-row2-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img09-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con2-row2-row3 .dndn-package-section04-con2-row2-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img10-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con2-row2-row4 .dndn-package-section04-con2-row2-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img11-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con1 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img01-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con2 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img02-240613.png") no-repeat center center; background-size: contain; } .dndn-package-section04-con3 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img03-241204.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con4 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img04-231030.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con5 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img05-221026.jpg") no-repeat center center; background-size: 80%; } .dndn-package-section04-con6 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img06-221026.jpg") no-repeat center center; background-size: contain; } .dndn-package-section04-con7 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img07-221026.jpg") no-repeat center center; background-size: contain; } .color-red .dndn-package-section04-con-title strong { color: #dd0000; } .color-red .dndn-package-section04-con-text span { color: #dd0000; font-weight: 700; } /******************************************************************************* 숙소 예약 마감 주의 ********************************************************************************/ .dndn-package-section09-con { padding: 80rem; background: #ffff; -webkit-border-radius: 20rem; -moz-border-radius: 20rem; border-radius: 20rem; } .dndn-package-section09-con { padding: 80rem; text-align: center; } .dndn-package-section09-title > p > em { display: inline-block; margin: 0 12rem; font-size: 32rem; font-weight: 700; color: #DD0000; vertical-align: middle; } .dndn-package-section09-title-icon { display: inline-block; width: 50rem; height: 50rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section09-icon01.png") no-repeat center center; background-size: contain; vertical-align: middle; } .dndn-package-section09-title > h2 { display: block; margin: 40rem 0 24rem; font-size: 46rem; color: #000; } .dndn-package-section09-con .color_purple { color: #8150FF; } .dndn-package-section09-text { font-size: 24rem; } .dndn-package-section09-text .color_purple { font-weight: 700; } /******************************************************************************* 어학연수 국가별 특징 ********************************************************************************/ .dndn-package-section05-con { display: flex; justify-content: space-between; margin-bottom: 60rem; } .dndn-package-section05-imgBox { width: 40%; -webkit-border-radius: 10rem; -moz-border-radius: 10rem; border-radius: 10rem; } .dndn-package-section05-con-textBox { width: calc(60% - 30rem); } .dndn-package-section05-con-title { font-size: 36rem; margin-bottom: 18rem; text-align: left; color: #8150FF; } .dndn-package-section05-table { background-color: #fff; border-collapse: collapse; width: 100%; border: 1px solid rgba(129, 80, 255, .27); } .dndn-package-section05-table th, .dndn-package-section05-table td { border-bottom: 1px solid rgba(129, 80, 255, .27); padding: 10rem 20rem; font-size: 20rem; width: auto; } .dndn-package-section05-table th { background: #F5F1FF; color: #555555; } .dndn-package-section05-table th:first-child { width: 20%; } .dndn-package-section05-table td { text-align: left; color: #000; } .dndn-package-section05-table td li::before { content: '-'; } .dndn-package-section05-img01 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img01-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img02 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img02-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img03 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img03-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img04 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img04-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img05 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img05-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img06 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img06-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img07 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img07-221026.jpg") no-repeat center center; background-size: cover; } .dndn-package-section05-img08 { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section05-img08-221026.jpg") no-repeat center center; background-size: cover; } /******************************************************************************* 선택에는 이유가 있습니다 ********************************************************************************/ .dndn-package-section06-con { padding: 80rem 100rem; background: #fff; -webkit-border-radius: 10rem; -moz-border-radius: 10rem; border-radius: 10rem; margin-bottom: 20rem; position: relative; } .dndn-package-section06-con:last-child { margin-bottom: 0; } .dndn-package-section06-con::before { content: ''; position: absolute; left: 50%; top: 0; transform: translate(-50%,-50%) rotate(45deg); width: 38rem; height: 38rem; background: linear-gradient(to right bottom, #FFF6C400 50%, #FFF6C4 50%); } .dndn-package-section06-title { color: #000; font-size: 36rem; margin-bottom: 8rem; } .dndn-package-section06-text { font-size: 14rem; color: #888888; margin-bottom: 60rem; } .dndn-package-section06-img { width: 100%; height: 300rem; margin-bottom: 80rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section06-img01-221026.png") no-repeat center center; background-size: contain; } .dndn-package-section06-text2 { display: inline-block; padding: 8rem 34rem; background: linear-gradient(to right, #EB38A6 , #8150FF ); font-size: 32rem; color: #fff; } .dndn-package-section06-con2 .dndn-package-section06-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section06-img02-221026.png") no-repeat center center; background-size: contain; } /******************************************************************************* 어학연수 후기를 확인하세요! ********************************************************************************/ .dndn-package-section07-con { margin-bottom: 38rem; } .dndn-package-section07-text { margin-bottom: 18rem; } .dndn-package-section07-text > span { color: #000; font-size: 32rem; } .dndn-package-section07-text > span::before { content: '#'; color: #8150FF; } .dndn-package-section07-youtube { width: 806rem; height: 454rem; margin: 0 auto; } .dndn-package-section07-youtube > iframe { width: 100%; height: 100%; } /******************************************************************************* edm유학센터가 함께하겠습니다. ********************************************************************************/ .dndn-package-section08-con { display: flex; justify-content: space-between; padding: 80rem; background: #fff; -webkit-border-radius: 20rem; -moz-border-radius: 20rem; border-radius: 20rem; text-align: left; margin-bottom: 20rem; } .dndn-package-section08-con5 { margin-bottom: 80rem; } .dndn-package-section08-con-textBox { width: 65%; } .dndn-package-section08-con-title { font-size: 46rem; margin-bottom: 40rem; color: #000; } .dndn-package-section08-con-title > strong { color: #8150FF; } .dndn-package-section08-con-text { font-size: 24rem; color: #000; margin-bottom: 20rem; } .dndn-package-section08-con-text > strong { color: #8150FF; } .dndn-package-section08-con-text > small { color: #888888; font-size: 14rem; } .dndn-package-section08-con-text > small::before { content: '*'; } .dndn-package-section08-con-imgBox { width: 35%; } .dndn-package-section08-con-imgBox li { margin-bottom: 10rem; background: #FCF6E5; padding: 10rem 20rem; -webkit-border-radius: 10rem; -moz-border-radius: 10rem; border-radius: 10rem; color: #6B6055; font-size: 16rem; display: flex; align-items: center; } .dndn-package-section08-text { font-size: 32rem; color: #DD0000; font-weight: 700; line-height: 1.4; } .dndn-package-section08-con-imgBox li:nth-child(1) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon01-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li:nth-child(2) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon02-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li:nth-child(3) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon03-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li:nth-child(4) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon04-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li:nth-child(5) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon05-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li:nth-child(6) .dndn-package-section08-con-imgBox-img { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-icon06-221026.jpg") no-repeat center center; } .dndn-package-section08-con-imgBox li .dndn-package-section08-con-imgBox-img { display: inline-block; width: 45rem; height: 28rem; background-size: cover; margin-right: 10rem; } .dndn-package-section08-con1 .dndn-package-section08-con-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-img01-221026.png") no-repeat center center; background-size: contain; } .dndn-package-section08-con2 .dndn-package-section08-con-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-img02-221026.png") no-repeat center center; background-size: contain; } .dndn-package-section08-con4 .dndn-package-section08-con-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-img03-221026.png") no-repeat center center; background-size: 80%; } .dndn-package-section08-con5 .dndn-package-section08-con-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-img04-221026.png") no-repeat center center; background-size: contain; } /******************************************************************************* 6월 이벤트 ********************************************************************************/ .dndn-package-section10 { background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section10-bg.png') no-repeat, radial-gradient(closest-side at 48% 41%, #F1FCEC 0%, #DFF6C4 64%, #BFF1AB 100%) center top; background-size: 100%; } .dndn-package-section10 .dndn-package-sub-title > strong { color: #1EC95B; } .dndn-package-section10-img { position: relative; aspect-ratio: 530 / 290; max-width: 530rem; margin: 0 auto 90rem; background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section10-img1.png') no-repeat center center; background-size: cover; } .dndn-package-section10-img2 { background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section10-img1-busan.png') no-repeat center center; background-size: cover; } .dndn-package-section10-img span { position: absolute; left: 50%; top: calc(100% + 45rem); transform: translate(-50%,-50%); display: flex; justify-content: center; align-items: center; aspect-ratio: 1 / 1; width: 54rem; background: #1EC95B; border-radius: 50%; } .dndn-package-section10-img span svg { width: 50%; } .dndn-package-section10-con { max-width: 712rem; margin: 0 auto; } .dndn-package-section10-con > div { border-radius: 16rem; background: #F7FDF1; } .dndn-package-section10-con .row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 40rem; padding: 32rem 40rem; } .dndn-package-section10-con .row .textBox { width: calc(100% - 200rem); text-align: left; font-size: 18rem; } .dndn-package-section10-con .row .textBox > strong { display: block; font-size: 26rem; } .dndn-package-section10-con .row .textBox > span { color: #666666; } .dndn-package-section10-con .row .img { width: 180rem; aspect-ratio: 183 / 90; background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section10-img2.png') no-repeat center center; background-size: cover; box-shadow: 10rem 10rem 20rem rgba(0, 0, 0, 10%); } .dndn-package-section10-con .row2 { display: grid; grid-template-columns: repeat(3,1fr); padding: 26rem 24rem; } .dndn-package-section10-con .row2 .col { display: flex; align-items: center; justify-content: center; } .dndn-package-section10-con .row2 .col + .col { border-left: 1px solid #C5C5C5; } .dndn-package-section10-con .row2 .col .icon { display: block; aspect-ratio: 1 / 1; height: 24rem; margin-right: 8rem; } .dndn-package-section10-con .row2 .col > p { font-size: 18rem; } /******************************************************************************* 지사 후기 ********************************************************************************/ .dndn-package-section11 { background: #F8F1FF url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section11-bg.png') no-repeat center top; background-size: 100%; } .dndn-package-section11 .dndn-package-sub-title { position: relative; } .dndn-package-section11 .dndn-package-sub-title::before { content: ''; position: absolute; left: 50%; bottom: 100%; transform: translate(-50%,25%); aspect-ratio: 52 / 42; width: 10%; max-width: 82rem; background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section11-img1.png') no-repeat center center; background-size: cover; } .dndn-package-section11-con { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 24rem; margin-bottom: 80rem; } .dndn-package-section11-con .col { padding: 16rem 20rem; background: #fff; border-radius: 12rem; box-shadow: 0 0 20rem rgba(129, 80, 255, 20%); } .dndn-package-section11-con .col .name { display: flex; justify-content: space-between; align-items: center; padding-bottom: 16rem; margin-bottom: 16rem; border-bottom: 1px solid #C5C5C5; } .dndn-package-section11-con .col .name > p { font-size: 18rem; font-weight: 700; } .dndn-package-section11-con .col .name > span { position: relative; display: inline-block; width: 64rem; aspect-ratio: 1 / 1; border-radius: 50%; background: #EFF1F6; } .dndn-package-section11-con .col .name > span::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 40rem; aspect-ratio: 1/ 1; background: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section11-img2.png') no-repeat center center; background-size: cover; } .dndn-package-section11-con .col .text { text-align: left; } .dndn-package-section11-con .col .text dt { margin-bottom: 8rem; font-size: 17rem; font-weight: 700; color: #8150FF; letter-spacing: -1rem; } .dndn-package-section11-con .col .text dd { font-size: 16rem; } .dndn-package-section11-con .col .text dd > span { color: #8150FF; } .dndn-package-section11 h3 { font-size: 26rem; color: #000; } /* 모바일 floating 버튼 */ .dndn-package-btn-call { display: none; } .container.dndn-package-default { overflow: initial; } .container.dndn-package-default .dndn-package-width { width: 100%; max-width: 1248rem; } .container .area_renewal * { font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important; overflow: initial; line-height: 150%; } .container .maxWidth { max-width: 1248rem; margin: 0 auto; } /* 비주얼 */ #heroArea .visual { position: relative; padding: 100rem 0; } #heroArea .visual .bgImage { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/heroArea-bg-250224.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } #heroArea .visual .titleWrap span { display: inline-block; color: #9C0703; background-color: #023CFC; border-radius: 8rem; font-size: var(--f-body1); line-height: 1.7; height: 30rem; font-weight: 700; padding: 0 10rem; margin-bottom: 8rem; } #heroArea .visual h1 { line-height: 130%; font-size: var(--f-display); } #heroArea .visual h1 em { line-height: 130%; color: #023CFC; } #heroArea .visual .contactWrap { font-size: var(--f-body2); margin-top: 24rem; } #heroArea .visual .contactWrap .box { display: flex; align-items: center; } #heroArea .visual .contactWrap .box + .box { margin-top: 12rem; } #heroArea .visual .contactWrap .box .tit { width: 56rem; } #heroArea .visual .contactWrap .box .tit strong { border: 1px solid #000; border-radius: 4rem; height: 24rem; min-width: 22rem; display: inline-block; padding: 0 8rem; vertical-align: top; font-weight: 500; } #heroArea .visual .contactWrap .box p { width: calc(100% - 56rem); } #heroArea .visual .contactWrap .contact-btn { background-color: #000; color: #fff; font-size: var(--f-body1); border-radius: var(--r-radius03); height: 40rem; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-top: 32rem; width: 170rem; } #heroArea .visual .contactWrap .contact-btn .arrow { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/buttonArrow.svg'); background-repeat: no-repeat; background-size: contain; background-position: center; width: 16rem; height: 16rem; margin-left: 4rem; } /* 블랙프라이데이 */ #heroArea.blackFriday .visual .bgImage { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/mainBanner-251127.png'); } #heroArea.blackFriday .visual .titleWrap span { background-color: #FFF828; } #heroArea.blackFriday .visual h1 { color: #fff; } #heroArea.blackFriday .visual h1 em { color: #FFE400; } #heroArea.blackFriday .visual .contactWrap .box { color: #fff; } #heroArea.blackFriday .visual .contactWrap .box .tit strong { border-color: #fff; } .program .navigation { display: flex; align-items: center; justify-content: flex-end; margin-bottom: 44rem; font-size: var(--f-body1); position: relative; z-index: 6; } .program .navigation button { background-color: #E2E2E5; width: 40rem; height: 40rem; border-radius: 50%; background-repeat: no-repeat; background-size: contain; background-position: center; } .program .navigation button:hover { background-color: #ccc; } .program .navigation button + button { margin-left: 16rem; } .program .navigation .nav-prev { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/nav_prev.svg'); } .program .navigation .nav-next { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/nav_next.svg'); } .program .navigation .control { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/control_stop.svg'); } .program .navigation .control.play { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/control_play.svg'); } .program .navigation .fraction { display: inline-block; width: auto; margin-right: 20rem; } .program .navigation .fraction .swiper-pagination-current { color: var(--c-text01); font-weight: 700; } .program .navigation .swiper-button-disabled { display: block !important; touch-action: none; pointer-events: none; opacity: 0.6; } /* 조회수 폭발 브이로그 */ .area-vlog { padding: 116rem 0 80rem; background: #D4AEFF; } .area-vlog .box-cont { position: relative; border-radius: 4rem; background-color: #fff; box-shadow: 0px 8rem 20rem 0px #0000001F; } .area-vlog .box-cont:before { position: absolute; top: -36rem; left: 50%; width: 192rem; height: 72rem; margin-left: -96rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_tag.png") no-repeat; background-size: cover; background-position: center; content: ""; } .area-vlog .tit-cont { padding: 48rem 112rem 32rem; border-radius: 4rem 4rem 0 0; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_bg.png") no-repeat; background-size: cover; text-align: center; } .area-vlog .tit-cont h2 { font-size: var(--f-fontSize01); line-height: 130%; letter-spacing: -0.8rem; color: var(--c-text01); } .area-vlog .tit-cont h2 strong { display: inline-block; line-height: 130%; color: #FF14C7; vertical-align: top; } /* 추가 혜택 어학교 */ .area-school { padding: 116rem 0 80rem; background: #A8F464; } .area-school .box-cont { position: relative; border-radius: 4rem; background-color: #fff; box-shadow: 0px 8rem 20rem 0px #0000001F; } .area-school .box-cont:before { position: absolute; top: -36rem; left: 50%; width: 192rem; height: 72rem; margin-left: -96rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_tag_green.png") no-repeat; background-size: cover; background-position: center; content: ""; } .area-school .tit-cont { padding: 48rem 112rem 32rem; border-radius: 4rem 4rem 0 0; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_bg.png") no-repeat; background-size: cover; text-align: center; } .area-school .tit-cont h2 { font-size: var(--f-fontSize01); line-height: 130%; letter-spacing: -0.8rem; color: var(--c-text01); } .area-school .tit-cont h2 strong { display: inline-block; line-height: 130%; color: #FF14C7; vertical-align: top; } .area-school .box-school { padding: 60rem; border-radius: 0 0 4rem 4rem; background-color: #D5FACE; text-align: center; } .area-school .list-school { display: grid; grid-template-columns: repeat(3,1fr); gap: 24rem; } .area-school .list-school > li { padding: 32rem; background-color: #fff; border-radius: 4rem; border: 1px solid #000; box-shadow: 1rem 2rem 0px 0px #000000; text-align: center; color: var(--c-text01); } .area-school .list-school > li > .logo { width: 100%; max-width: 200rem; margin: 0 auto; background-size: cover; background-position: center; aspect-ratio: 200/90; } .area-school .list-school > li > strong { display: block; padding: 8rem 0; font-size: var(--f-fontSize05); letter-spacing: -.3rem; } .area-school .list-school > li > p { font-size: var( --f-body1); letter-spacing: -.3rem; } .area-school .box-school .desc { padding: 24rem 0 32rem; font-size: var(--f-detail); } .area-school .box-school .title_link { display: block; font-size: var(--f-fontSize03); color: var(--c-text01); } .area-school .box-school .contact-btn { display: inline-block; margin: 16rem auto 0; border-radius: 999999rem; background-color: var(--c-text01); color: #fff; font-size: var(--f-body1); width: 302rem; height: 56rem; line-height: 150%; font-weight: 500; display: flex; align-items: center; justify-content: center; } .area-school .box-school .contact-btn .arrow { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/buttonArrow.svg'); background-repeat: no-repeat; background-size: contain; background-position: center; width: 24rem; height: 24rem; margin-left: 4rem; } /***************************************** 25-03월 update *****************************************/ .march.dndn-package .all-title{text-align: center;} .march.dndn-package .all-title .title{font-size: var(--f-fontSize01); font-weight: 700; color: var(--c-text01); margin-top: 8rem; margin-bottom: 93rem;} .march.dndn-package .link-btn .btn{background-color: #000; color: #fff; width: 240rem; height: 56rem; font-size: var(--f-body1); font-weight: 500; display: inline-block; border-radius: var(--r-radius03); display: flex; justify-content: center; align-items: center; margin: 0 auto; transition: background-color 0.3s ease;} .march.dndn-package .link-btn .btn svg{width: 24rem; height: 24rem; margin-left: 4rem;} .march.dndn-package .area-vlog .box-cont{border: 3rem solid #0C68A0; box-shadow: 4rem 8rem 0 rgba(0,0,0,0.12); padding: 0 0 60rem;} .march.dndn-package .area-vlog .box-cont + .box-cont{margin-top: 60rem;} .march.dndn-package .area-notice { padding: 80rem 0; background: #FC824D; } .march.dndn-package .area-notice .box-cont { padding: 40rem 60rem 60rem; border-radius: 24rem; background-color: #fff; box-shadow: 0px 8rem 20rem 0px #0000001F; text-align: center; } .march.dndn-package .area-notice .box-cont .tag-notice { display: block; position: relative; width: 200rem; height: 40rem; margin: 0 auto 24rem; background-color: #000; border-radius: var(--r-radius03); line-height: 40rem; font-weight: 700; color: #fff; } .march.dndn-package .area-notice .box-cont .tag-notice:before { position: absolute; bottom: -11rem; left: -20rem; width: 58rem; height: 64rem; background: url(https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/notice_bell_icon.png) no-repeat; background-size: cover; content: ""; } .march.dndn-package .area-notice .box-cont .tit-cont { margin: 24rem 0; font-size: var(--f-fontSize01); line-height: 130%; letter-spacing: -0.8rem; color: #FC1D01; } .march.dndn-package .area-notice .box-cont > p { font-size: var(--f-fontSize05); color: var(--c-text01); } .march.dndn-package .tag-top { position: absolute; top: -25rem; left: 50%; width: 130rem; height: 50rem; margin-left: -65rem; border-radius: var(--r-radius03); border: 1px solid #DC450B; background: linear-gradient(90deg, #FD6C34 0%, #DB470E 100%); box-shadow: 0px 4rem 10rem 0px #0000001F; font-size: var(--f-fontSize04); font-weight: 700; line-height: 50rem; text-align: center; color: #fff; } .march.dndn-package .area-vlog { padding: 80rem 0; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/march-v-log-bg-251127.png'); background-repeat: no-repeat; background-size: cover; background-position: top center;} .march.dndn-package .area-vlog .tit-cont{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/march-contTop_bg.png');} .march.dndn-package .area-vlog .tit-cont h2 span{position: relative; padding-left: 64rem; padding-right: 64rem; display: inline-block; line-height: inherit;} .march.dndn-package .area-vlog .tit-cont h2 strong{color: #023CFC; line-height: inherit;} .march.dndn-package .area-vlog .tit-cont h2 span::before, .march.dndn-package .area-vlog .tit-cont h2 span::after{content: ''; position: absolute; width: 44rem; aspect-ratio: 44/52; background-repeat: no-repeat; background-size: contain; background-position: center; top: 50%; transform: translateY(-50%);} .march.dndn-package .area-vlog .tit-cont h2 span::before{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/march-contTop_left.png'); left: 0;} .march.dndn-package .area-vlog .tit-cont h2 span::after{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/march-contTop_right.png'); right: 0;} .march.dndn-package .area-vlog .box-cont:before { display: none; } .march.dndn-package .area-vlog .text-cont { margin: 30rem 0; text-align: center; } .march.dndn-package .area-vlog .text-cont .logo img { display: block; width: 310rem; margin: 0 auto; background: #FFEDCB; } .march.dndn-package .area-vlog .text-cont .text { position: relative; margin-top: 12rem; font-size: var( --f-fontSize03); font-weight: 500; color: var(--c-text01); } .march.dndn-package .area-vlog .text-cont .text > em { color: #007456; } .march.dndn-package .area-vlog .text-cont .smile { display: inline-block; width: 39rem; height: 39rem; vertical-align: top; } .march.dndn-package .area-vlog .text-cont .smile img { vertical-align: top; } /* edm유학센터 어학연수가 특별한 이유 */ .march.dndn-package .area-vlog .box-cont.special .roundWrap{display: flex; flex-wrap: wrap; column-gap: 24rem; padding: 0 60rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox{width: calc(50% - 24rem); border-radius: 8rem; background-color: #fff; border: 1px solid #E4E8F1; box-shadow: 0 4rem 10rem #EBEFF4; text-align: center; padding: 40rem 40rem 20rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .tit{font-size: var(--f-fontSize03); font-weight: 700; line-height: 150%; letter-spacing: -0.26rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .tit em{color: #023CFC;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .sub{color: var(--c-text03); font-size: var(--f-body2); margin-top: 4rem; line-height: 150%; letter-spacing: -0.16rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .imgWrap{margin-top: 32rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .imgWrap img{max-width: 100%; object-fit: contain; margin: 0 auto;} /* 고객들의 진짜 어학연수 후기 */ .march.dndn-package .area-vlog .box-cont.review .slideWrap{padding: 0 60rem; } .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide{overflow: hidden; width: calc(100% + 80rem); margin-left: -40rem; padding: 0 40rem 20rem; position: relative;} .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::before, .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::after{content: ''; position: absolute; width: 40rem; height: 100%; top: 0; z-index: 2; touch-action: none; pointer-events: none;} .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::before{left: 0; background: linear-gradient(90deg, #fff 50%, transparent);} .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::after{right: 0; background: linear-gradient(-90deg, #fff 50%, transparent);} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide{position: relative; height: 340rem; border-radius: var(--r-radius02); box-shadow: 0 8rem 20rem rgba(0,0,0,0.12); padding: 40rem 24rem; font-size: var(--f-body2); font-weight: 700; line-height: 150%; letter-spacing: -0.16rem; overflow: hidden; color: #fff;} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide span{display: block; font-size: var(--f-detail); margin-top: 12rem; line-height: 150%; letter-spacing: -0.14rem;} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide figure{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: -1;} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide em{color: #13FF62;} .march.dndn-package .area-school { position: relative; padding-top: 0; background: linear-gradient(180deg, #C8FDFF 0%, #FFF8EF 100%); } .march.dndn-package .area-school .tag-top { width: 206rem; margin-left: -103rem; } .march.dndn-package .area-school .box-cont:before { display: none; } .march.dndn-package .area-school .box-school { border-radius: 0 0 24rem 24rem; } /* 국가별 어학연수 특징 */ .march.dndn-package .characteristic-country{background-color: #F3F6FF; padding: 80rem 0;} .march.dndn-package .characteristic-country .all-title .title{margin-bottom: 28rem;} .march.dndn-package .characteristic-country .slideWrap .slide{overflow: hidden; width: calc(100% + 80rem); margin-left: -40rem; padding: 0 40rem 20rem; position: relative;} .march.dndn-package .characteristic-country .slideWrap .slide::before, .march.dndn-package .characteristic-country .slideWrap .slide::after{content: ''; position: absolute; width: 40rem; height: 100%; top: 0; z-index: 2;} .march.dndn-package .characteristic-country .slideWrap .slide::before{left: 0; background: linear-gradient(90deg, #F3F6FF 50%, transparent);} .march.dndn-package .characteristic-country .slideWrap .slide::after{right: 0; background: linear-gradient(-90deg, #F3F6FF 50%, transparent);} .march.dndn-package .characteristic-country .slideWrap .navigation{margin-bottom: 28rem;} .march.dndn-package .characteristic-country .swiper-slide{background-color: #fff; border-radius: var(--r-radius01); box-shadow: 0 4rem 10rem rgba(0, 0, 0, 0.12); height: 474rem; overflow: hidden;} .march.dndn-package .characteristic-country .swiper-slide figure{width: 100%; aspect-ratio: 400/162; background-repeat: no-repeat; background-size: cover; background-position: center; height: auto;} .march.dndn-package .characteristic-country .swiper-slide .textWrap{padding: 24rem 24rem 32rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap h3{font-size: var(--f-fontSize04); text-align: center; margin-bottom: 16rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap h3 em{color: #6E31F5;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box{display: flex;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box + .box{margin-top: 12rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .left{width: 76rem; font-size: var(--f-detail);} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .left span{background-color: #6E7C9C; display: inline-block; color: #fff; font-weight: 700; border-radius: 4rem; height: 26rem; padding: 0 8rem; line-height: 1.85; letter-spacing: -0.14rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .right{width: calc(100% - 76rem); font-size: var(--f-body2); line-height: 150%; letter-spacing: -0.16rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .right .dotTxt{padding-left: 7rem; position: relative;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .right .dotTxt::before{content: ''; position: absolute; width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--c-text01); left: 0; top: 10rem;} /* */ .march.dndn-package .recommended-training{background-color: #B2DFFF; padding: 80rem 0;} .march.dndn-package .recommended-training .list{display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 24rem; row-gap: 24rem;} .march.dndn-package .recommended-training .list li{background-color: #fff; border-radius: var(--r-radius01); box-shadow: 0 4rem 10rem rgba(0, 0, 0, 0.12); overflow: hidden; text-align: center; height: 228rem; padding: 32rem;} .march.dndn-package .recommended-training .list li figure{margin: 0 auto 8rem; aspect-ratio: 200/90; height: 90rem; background-repeat: no-repeat; background-size: contain; background-position: center; max-width: 100%;} .march.dndn-package .recommended-training .list li p{font-size: var(--f-body1); margin-top: 8rem;} .march.dndn-package .recommended-training .bottom-txt{font-size: var(--f-detail); color: var(--c-text02); text-align: center; line-height: 150%; letter-spacing: -0.14rem; margin-top: 24rem;} .march.dndn-package .recommended-training .next-txt{margin: 40rem 0 16rem; font-size: var(--f-fontSize03); font-weight: 700; text-align: center; color: var(--c-text01); letter-spacing: -0.26rem; line-height: 150%;} /************************************************************* hover effect *************************************************************/ @media (hover: hover) and (pointer: fine) { .march.dndn-package .link-btn .btn:hover{background-color: var(--c-text03);} .benefit-best .article2 .review-text .moreBtn:hover{background-color: var(--c-text03);} } /***************************************** 25-05월 event update *****************************************/ .may { padding: 80rem 0; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-bg-251127.png'); background-repeat: no-repeat; background-size: cover; background-position: top center; } .may .box { padding: 60rem; border-radius: 4rem; background: #FFF; box-shadow: 4rem 8rem 0px 0px rgba(0, 0, 0, 0.12); } .may .title { font-size: var(--f-fontSize01); font-weight: 700; line-height: 130%; text-align: center; color: var(--c-text01); } .may .title > strong { line-height: 130%; font-weight: 700; color: var(--c-point); } .may .innerBox { width: 100%; max-width: 1036rem; margin: 60rem auto 0; } .may .listEvent li { display: flex; gap: 24rem; } .may .listEvent li + li { margin-top: 40rem; padding-top: 40rem; border-top: 1px solid #E4E8F1; } .may .listEvent .textWrap { width: calc(100% - 506rem - 24rem); } .may .listEvent .titleList { display: block; font-size: var(--f-fontSize02); font-weight: 700; line-height: 40rem; letter-spacing: -.2rem; color: #000; } .may .listEvent .titleList figure { display: inline-block; width: 32rem; height: 40rem; aspect-ratio: 1/1; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-flag01.png'); background-repeat: no-repeat; background-size: 32rem; background-position: center; vertical-align: top; } .may .listEvent .titleList figure.flag02 { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-flag02.png'); } .may .listEvent .titleList figure.flag03 { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-flag03.png'); } .may .listEvent .text { margin: 16rem 0 24rem; font-size: var(--f-fontSize05); color: #000; } .may .listEvent .text > strong { font-weight: 700; color: #FD4A34; } .may .listEvent .textWrap .contact-btn { display: flex; align-items: center; justify-content: center; width: 140rem; height: 40rem; background-color: #000; color: #fff; font-size: var(--f-body2); border-radius: var(--r-radius03); font-weight: 400; } .may .listEvent .textWrap .contact-btn .arrow { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/common/buttonArrow.svg'); background-repeat: no-repeat; background-size: cover; background-position: center; width: 16rem; height: 16rem; margin-left: 4rem; } .may .listEvent .imgWrap { width: 506rem; } .may .listEvent .imgWrap figure { aspect-ratio: 506/270; border-radius: 12rem; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-img01.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; } .may .listEvent .imgWrap figure.img02 { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-img02.jpg'); } .may .listEvent .imgWrap figure.img03 { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/may-benefit-img03.jpg'); } @media screen and (max-width: 1399px){ .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide{width: 100%; margin-left: 0; padding: 0;} .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::before{display: none;} .march.dndn-package .area-vlog .box-cont.review .slideWrap .slide::after{width: 100rem; background: linear-gradient(-90deg, #fff 20%, transparent);} .march.dndn-package .area-vlog .box-cont.review .navigation{position: static; margin-top: 20rem;} } @media screen and (max-width: 1280px){ .dndn-package.container .maxWidth{padding: 0 16rem;} } @media screen and (max-width: 1200px){ .dndn-package-width { width: 100%; padding: 5rem 1.5rem; } .dndn-package-section01-title { width: 100%; } .dndn-package-section02-con > span::before { display: none; } .dndn-package-section03 .dndn-package-width { padding: 5rem 1.5rem 8rem; } .container.dndn-package-default .dndn-package-section03 .dndn-package-width { padding: 5rem 16rem 8rem; } .dndn-package-section03-title::before { right: 0; transform: translate(30%,-40%); top: 0; } .dndn-package-section03-con { grid-template-columns: repeat(2,1fr); } .dndn-package-section03-textBox::before { transform: translate(0,0); } .dndn-package-section03-con-busan::before { display: none; } .dndn-package-section04 .dndn-package-width { padding: 5rem 1rem; } .dndn-package-section04-con { display: block; } .dndn-package-section04-textBox { width: 100%; text-align: center; } .dndn-package-section04-imgBox { width: 100%; height: 20rem; } .dndn-package-section04-con1 .dndn-package-section04-imgBox, .dndn-package-section04-con2 .dndn-package-section04-imgBox, .dndn-package-section04-con3 .dndn-package-section04-imgBox, .dndn-package-section04-con4 .dndn-package-section04-imgBox, .dndn-package-section04-con5 .dndn-package-section04-imgBox, .dndn-package-section04-con6 .dndn-package-section04-imgBox, .dndn-package-section04-con7 .dndn-package-section04-imgBox { background-size: contain; } .dndn-package-section04-con3 .dndn-package-section04-imgBox { margin-top: 2rem; } .dndn-package-section04-con2-row3 { height: 41vw; } .dndn-package-section04-con2-row1 { grid-template-columns: repeat(1,1fr); } .dndn-package-section06-con { padding: 4rem 2rem; } .dndn-package-section07-youtube { width: 100%; height: 50vw; } .dndn-package-section08-con { display: block; } .dndn-package-section08-con-textBox { width: 100%; text-align: center; margin-bottom: 1.5rem; } .dndn-package-section08-con-imgBox { width: 100%; } .dndn-package-section08-con1 .dndn-package-section08-con-imgBox { height: 13rem; } .dndn-package-section08-con2 .dndn-package-section08-con-imgBox, .dndn-package-section08-con4 .dndn-package-section08-con-imgBox, .dndn-package-section08-con5 .dndn-package-section08-con-imgBox { height: 10rem; } .dndn-package-section08-con2 .dndn-package-section08-con-imgBox { height: 32rem; } .dndn-package .maxWidth { padding: 0 16rem; } .container.dndn-package-default .dndn-package-width { padding: 100rem 16rem; } .march.dndn-package .recommended-training .list{grid-template-columns: repeat(2,1fr);} .march.dndn-package .characteristic-country .swiper-slide{height: auto;} } @media screen and (max-width: 768px){ .dndn-package-sub-title { font-size: calc(13rem + 4.75vw); } .dndn-package-sub-title > span { font-size: calc(13rem + 1vw); } .dndn-package-sub-title > span > strong { font-size: calc(13rem + 2.5002vw); } .dndn-package-section01-title { font-size: calc(13rem + 11.95vw); padding: 26rem 1rem 26rem; line-height: 1.2; } .dndn-package-section01-title > small { font-size: calc(13rem + 1.39vw); } .dndn-package-section01-title > strong { font-size: calc(13rem + 19vw); } .dndn-package-section01-title > span { font-size: calc(13rem + 0.85vw); width: 100%; padding: 6.5rem; } .dndn-package-section01.dndn2406 .dndn-package-section01-title { font-size: calc(13rem + 11.3898vw); } .dndn-package-section01.dndn2406 .dndn-package-section01-title > span { transform: translate(0); } .dndn-package-section01.dndn2406 .dndn-package-section01-title > span, .dndn-package-section01.dndn2406 .dndn-package-section01-title > small { font-size: calc(13rem + 2.5002vw); } .dndn-package-section02-title { font-size: calc(13rem + 3vw); } .dndn-package-section02-title > span { font-size: calc(13rem + 4.75vw); } .dndn-package-section02-con > span { font-size: calc(13rem + 0.85vw); } .dndn-package-section02-text { font-size: calc(13rem + 2vw); } .dndn-package-section03-con-busan-row2 { background: #fff url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section03-con-busan-img01.png") no-repeat right center !important; background-size: 20% !important; } .dndn-package-section03-title { font-size: calc(13rem + 4.75vw); } .dndn-package-section03-title > span { font-size: calc(13rem + 3vw); } .dndn-package-section03-con-busan li > span, .dndn-package-section03-con-col > span, .dndn-package-section03-textBox { font-size: calc(13rem + 1.39vw); } .dndn-package-section03-con-busan small { font-size: calc(13rem + -0.5556vw); } .dndn-package-section03-con-busan-text { text-align: left; font-size: calc(13rem + -0.5556vw); } .dndn-package-section03.may .dndn-package-section03-con-busan-row { padding: 32.5rem 10rem !important; letter-spacing: -2rem; } .dndn-package-section03.may .dndn-package-section03-textBox { border-radius: 12rem; } .dndn-package-section03.may .dndn-package-section03-title > span { font-size: calc(13rem + 6.3894vw); } .dndn-package-section03.may .dndn-package-section03-title { font-size: calc(13rem + 5.2782vw); } .dndn-package-section03-textBox small { font-size: calc(13rem + 0.5556vw); } .dndn2406 .dndn-package-section03-title::before { bottom: auto; top: 0; transform: translateY(-50%); width: 40%; } .dndn-package-section03-con2 { grid-template-columns: repeat(2,1fr); } .dndn-package-section03-con2 li { grid-column: 2 span; } .dndn-package-section03-con2 li:nth-child(n + 4) { grid-column: 1 span; } .dndn-package-section03-con2 li > span { width: 24rem; font-size: 14rem; } .dndn-package-section03-con2 li p { font-size: calc(13rem + 1.9446vw); } .dndn-package-section03-con2 li p strong { display: inline-block; } .dndn-package-section03-textBox2.dndn-package-section03-textBox { padding-top: calc(24.7rem + 104rem); } .dndn-package-section03-textBox2.dndn-package-section03-textBox::before { height: 78rem; top: 24.7rem; left: 50%; transform: translate(-50%,0); } .dndn-package-section03-textBox2 { margin-bottom: 26rem; } .dndn-package-section03-textBox2 > span { display: inline-block; margin-bottom: 16rem; font-size: calc(13rem + 1.9446vw); } .dndn-package-section03-linkBox { grid-template-columns: repeat(1,1fr); } .dndn-package-section03-linkBox > a { font-size: calc(13rem + 2.5002vw); } .dndn-package-section03-linkBox > a > svg { aspect-ratio: 24 / 30; font-size: calc(13rem + 2.5002vw); } .dndn-package-section04-con { padding: 26rem .5rem; } .dndn-package-section04-con.dndn-package-section04-con1 { padding: 0 0 26rem; } .dndn-package-section04-con-wrap { padding: 26rem .5rem; } .dndn-package-section04-textBox { margin-bottom: 13rem; } .dndn-package-section04-con-title { font-size: calc(13rem + 3vw); } .dndn-package-section04-con-title > span { margin-bottom: 10rem; font-size: calc(13rem + 1.39vw); justify-content: center; } .dndn-package-section04-con-title > span > span { font-size: calc(13rem + .3vw); } .dndn-package-section04-con-title > small { font-size: calc(13rem - .6vw); } .dndn-package-section04-con-text { font-size: calc(13rem + 0.85vw); } .dndn-package-section04-con-list li { font-size: calc(13rem - .6vw); } .dndn-package-section04-con2-row1-left-title { font-size: calc(13rem + 1.39vw); } .dndn-package-section04-con2-row1-left-color > span { font-size: calc(13rem - .6vw); } .dndn-package-section04-con2-row1-right-title { font-size: calc(13rem + 1.39vw); } .dndn-package-section04-con2-row1-right-list li { font-size: calc(13rem + .55vw); } .dndn-package-section04-con2-row2-textBox > p { font-size: calc(13rem + .55vw); } .dndn-package-section04-con2-row2-textBox > span { font-size: 13rem; } .dndn-package-section04-con2-row3 { height: 49.3vw; } .dndn-package-section04-con2-row2-textBox { width: calc(95% - 71.5rem); } .dndn-package-section04-con2-row2-imgBox { width: 71.5rem; height: 71.5rem; } .dndn-package-section04-con1 .dndn-package-section04-imgBox { height: 338rem; } .dndn-package-section04-con5 .dndn-package-section04-imgBox { height: 338rem; } .dndn-package-section04-con2 .dndn-package-section04-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section04-img02-240613.png") no-repeat center center; background-size: contain; } .dndn-package-section04-con3 .dndn-package-section04-imgBox { height: 169rem; } .dndn-package-section09-con { padding: 26rem .5rem; } .dndn-package-section05-con { display: block; } .dndn-package-section05-imgBox { width: 100%; height: 195rem; margin-bottom: 6.5rem; } .dndn-package-section05-con-textBox { width: 100%; } .dndn-package-section05-con-title { font-size: calc(13rem + 2vw); text-align: center; } .dndn-package-section05-table th, .dndn-package-section05-table td { font-size: calc(13rem + .55vw); } .dndn-package-section06-con { padding: 52rem 13rem; } .dndn-package-section06-img { height: 260rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section06-img03-221026.png") no-repeat center center; background-size: contain; } .dndn-package-section06-con2 .dndn-package-section06-img { height: 195rem; } .dndn-package-section06-title { font-size: calc(13rem + 2vw); } .dndn-package-section06-text { font-size: calc(13rem - .8vw); } .dndn-package-section06-text2 { font-size: calc(13rem + 2vw); } .dndn-package-section07-text > span { font-size: calc(13rem + .55vw); } .dndn-package-section08-con { padding: 26rem .5rem; } .dndn-package-section08-con-title { font-size: calc(13rem + 3vw); } .dndn-package-section08-con-text { font-size: calc(13rem + 0.85vw); } .dndn-package-section08-con-text > small { font-size: calc(13rem - 1vw); } .dndn-package-section08-con-imgBox li { font-size: calc(13rem + 0.3vw); } .dndn-package-section08-text { font-size: calc(13rem + 1vw); } .dndn-package-section08-con4 .dndn-package-section08-con-imgBox { background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-section08-img03-221026.png") no-repeat center center; background-size: contain; } .dndn-package-section10-con .row { margin-bottom: 13rem; padding: 20.8rem 13rem; } .dndn-package-section10-con .row .textBox { width: calc(100% - 104rem); font-size: 13rem; } .dndn-package-section10-con .row .textBox > strong { font-size: calc(13rem + 0.8334vw); } .dndn-package-section10-con .row .img { width: 91rem; } .dndn-package-section10-con .row2 { grid-template-columns: repeat(1,1fr); padding: 20.8rem 13rem; } .dndn-package-section10-con .row2 .col { justify-content: start; } .dndn-package-section10-con .row2 .col + .col { border-left: none; margin-top: 6.5rem; } .dndn-package-section10-con .row2 .col .icon { height: 16rem; margin-right: 13rem; } .dndn-package-section10-con .row2 .col .icon svg { height: 100%; } .dndn-package-section10-con .row2 .col > p { font-size: 13rem; } .dndn-package-section11 { background: #F8F1FF; } .dndn-package-section11 .dndn-package-sub-title::before { width: 15%; } .dndn-package-section11-con { grid-template-columns: repeat(1,1fr); } .dndn-package-section11-con .col { display: flex; justify-content: space-between; align-items: start; padding: 20rem; } .dndn-package-section11-con .col .name { display: flex; flex-direction: column-reverse; width: 20%; padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .dndn-package-section11-con .col .name > p { font-size: calc(13rem + 0.2778vw); } .dndn-package-section11-con .col .name > span { width: 100%; margin-bottom: 7rem; } .dndn-package-section11-con .col .name > span::before { width: 60%; } .dndn-package-section11-con .col .text { width: calc(80% - 20rem); } .dndn-package-section11-con .col .text dt, .dndn-package-section11-con .col .text dd, .dndn-package-section11 h3 { font-size: calc(13rem + 0.5556vw); } .dndn-package-btn-call { display: block; position: fixed; z-index: 10; right: 19.5rem; bottom: 102rem; width: 56rem; height: 56rem; background: #fff url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/dndn-package-icon-call-mo.png') no-repeat center center; background-size: 32rem; border: 1px solid #D8D5E1; border-radius: 28rem; box-shadow: 0 6rem 15rem #00000015; } #heroArea .visual { padding: 40rem 0; height: 433.94rem; } #heroArea .visual .bgImage { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/heroArea-bg-mo-250224.png'); } #heroArea .visual .titleWrap { padding: 0 8rem; } #heroArea .visual .titleWrap span { font-size: var(--f-body2); height: 26rem; padding: 0 7rem; line-height: 1.9; margin-bottom: 8rem; } #heroArea .visual h1 { font-size: 31.98rem; } #heroArea .visual .contactWrap { margin-top: 24rem; padding: 0 8rem; } #heroArea .visual .contactWrap .box { align-items: flex-start; } #heroArea .visual .contactWrap .box + .box { margin-top: 8rem; } #heroArea .visual .contactWrap .box .tit { width: 44.98rem; } #heroArea .visual .contactWrap .box .tit strong { height: 20.93rem; padding: 0 4rem; } #heroArea.blackFriday .visual .bgImage { background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/mainBanner-mo-251127.png'); } #heroArea.blackFriday .visual h1 { letter-spacing: -.4rem; } .program .navigation { position: absolute; bottom: 0; right: 16rem; margin: 0; padding: 0; } .program .navigation button.nav-prev, .program .navigation button.nav-next, .program .navigation button.control { display: none !important; } .program .navigation .fraction { background-color: #E2E2E5; border-radius: 999999rem; padding: 0 12rem; font-size: var(--f-body1); margin-right: 0; } .program .navigation .fraction span { display: inline-block; font-size: inherit; } .area-vlog { padding: 78rem 0 50.7rem; } .area-vlog .box-cont:before { width: 150rem; height: 58rem; top: -29rem; margin-left: -75rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_tag_mo.png") no-repeat; background-size: cover; } .area-vlog .tit-cont { padding: 40rem 16rem 24rem; } .area-vlog .tit-cont h2, .area-vlog .tit-cont h2 strong { line-height: 110%; } .area-school { padding: 78rem 0 50.7rem; } .area-school .box-cont:before { width: 150rem; height: 58rem; top: -29rem; margin-left: -75rem; background: url("https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/contTop_tag_green_mo.png") no-repeat; background-size: cover; } .area-school .tit-cont { padding: 40rem 16rem 24rem; } .area-school .tit-cont h2, .area-school .tit-cont h2 strong { line-height: 110%; } .area-school .box-school { padding: 30rem 8rem; } .area-school .list-school { grid-template-columns: repeat(2,1fr); gap: 8rem; } .area-school .list-school > li { padding: 12rem 16rem; } .area-school .list-school > li > .logo { width: 100%; max-width: 130rem; height: auto; aspect-ratio: 120/54; } .area-school .list-school > li > strong { padding: 0; padding-bottom: 4rem; } .area-school .list-school > li > p { line-height: 135%; } .area-school .box-school .desc { padding: 15.6rem 0 26rem; } .area-school .box-school .contact-btn { width: 262.08rem; height: 40.3rem; margin-top: 12.35rem; font-size: 18.2rem; } .march.dndn-package .all-title .sub{font-size: var(--f-fontSize05); letter-spacing: -0.16rem; line-height: 150%;} .march.dndn-package .all-title .title{margin-bottom: 55rem; margin-top: 8rem; line-height: 130%; letter-spacing: -0.5rem;} .march.dndn-package .link-btn .btn{font-size: var(--f-fontSize04); height: 39.91rem; width: 199.94rem;} .march.dndn-package .link-btn .btn svg{width: 16rem; height: 16rem; margin-left: 4rem;} .march.dndn-package .area-pg-visual .contactWrap { margin-top: 139.1rem; } .march.dndn-package .area-pg-visual .titleWrap span { padding: 2rem 8rem; font-size: 18.2rem; } .march.dndn-package .area-pg-visual .bgImage { background-image: url(https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/mainBanner_newyear_tablet.png); background-position: center center; } .march.dndn-package .area-notice .box-cont .tag-notice { width: 124rem; height: 36rem; font-size: 18rem; line-height: 36rem; } .march.dndn-package .area-notice .box-cont .tag-notice:before { top: -8rem; width: 46rem; height: 51rem; } .march.dndn-package .area-notice .box-cont { padding: 24rem 16rem 32rem; } .march.dndn-package .tag-top { width: 98.8rem; height: 36.4rem; top: 0; margin-top: -18.2rem; margin-left: -49.4rem; line-height: 36.4rem; } .march.dndn-package .area-vlog{background-color: #2859B3; background-image: none; padding: 50rem 0;} .march.dndn-package .area-vlog .box-cont{border-width: 2rem; padding-bottom: 30rem;} .march.dndn-package .area-vlog .box-cont + .box-cont{margin-top: 30rem;} .march.dndn-package .area-vlog .tit-cont{padding: 28rem 0; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/march-contTop_bg-mo.png');} .march.dndn-package .area-vlog .tit-cont h2{line-height: 130%; letter-spacing: -0.5rem; } .march.dndn-package .area-vlog .tit-cont h2 span{padding: 0 38rem;} .march.dndn-package .area-vlog .tit-cont h2 span::before, .march.dndn-package .area-vlog .tit-cont h2 span::after{width: 26rem; aspect-ratio: 26/32;} .march.dndn-package .area-vlog .box-cont.special .roundWrap{padding: 0 16rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox{width: 100%; padding: 24rem 16rem 20rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox + .roundBox{margin-top: 12rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .sub{font-size: var(--f-detail); letter-spacing: -0.13rem; margin-top: 8rem;} .march.dndn-package .area-vlog .box-cont.special .roundWrap .roundBox .imgWrap{margin-top: 16rem;} .march.dndn-package .area-vlog .box-cont.review .slideWrap{padding: 0 0 0 16rem;} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide{height: 72.2222vw; padding: 24rem; box-shadow: none;} .march.dndn-package .area-vlog .box-cont.review .slide .swiper-slide br{display: none;} .march.dndn-package .area-vlog .box-cont.review .navigation{margin: 16rem 16rem 14rem auto;} .march.dndn-package .area-vlog .box-cont.review .navigation .fraction{font-size: var(--f-body2); height: 24.96rem; line-height: 1.8; letter-spacing: -1.14rem; padding: 0 15rem;} .march.dndn-package .area-vlog .text-cont { margin: 24rem 0;} .march.dndn-package .area-vlog .text-cont .text { font-size: 16.9rem; line-height: 130%; } .march.dndn-package .area-school .tag-top { width: 164.06rem; margin-left: -82.03rem; } .benefit-best{padding: 50rem 0;} .benefit-best .videoWrap.youtube{border-radius: 4rem;} .benefit-best .roundWrap{padding: 40rem 16rem 18rem;} .benefit-best .roundWrap + .roundWrap{margin-top: 54rem;} .benefit-best .roundWrap .wrap-title{font-size: var(--f-fontSize05); width: 269.88rem; height: 47.97rem; line-height: 3;} .benefit-best .roundWrap .wrap-title.other{height: 55.9rem; line-height: 1.3; padding-top: 6rem; top: -27.95rem;} .benefit-best .article + .article{padding-top: 30rem; margin-top: 30rem;} .benefit-best .article1{padding: 0;} .benefit-best .article1 .textWrap{width: 100%;} .benefit-best .article1 .imgWrap{width: 100%; margin-top: 12rem;} .benefit-best .article1 .textWrap{text-align: center;} .benefit-best .article1 .textWrap h3{font-size: 16.9rem; margin-bottom: 8rem;} .benefit-best .article1 .textWrap p{font-size: var(--f-body1);} .benefit-best .article1 .textWrap .bottom, .benefit-best .roundWrap1 .article1 .textWrap .bottom{font-size: 11.96rem; line-height: 150%; letter-spacing: -0.12rem; margin-top: 12rem;} .benefit-best .article2 .sub-bottom{font-size: 11.96rem; line-height: 150%; letter-spacing: -0.12rem; margin-top: 8rem;} .benefit-best .article2 .sub-title{font-size: var(--f-body1); letter-spacing: -0.15rem; line-height: 150%; margin-bottom: 4rem;} .benefit-best .article2 .box-2{margin-top: 20rem;} .benefit-best .article2 .box-2 .roundBox{width: 100%; padding: 20rem 16rem 15rem;} .benefit-best .article2 .box-2 .roundBox + .roundBox{margin-top: 8rem;} .benefit-best .article2 .box-2 .roundBox p{margin-bottom: 16rem;} .benefit-best .article2 .review-text{margin-top: 8rem; margin-bottom: 30rem;} .benefit-best .article2 .review-text .roundBox{padding: 24rem 16rem; display: block;} .benefit-best .article2 .review-text .roundBox + .roundBox, .benefit-best .article2 .review-text .mo-btn + .roundBox{margin-top: 8rem;} .benefit-best .article2 .review-text .roundBox .imgWrap{width: 69.94rem; height: 69.94rem; margin: 0 auto 8rem;} .benefit-best .article2 .review-text .roundBox .textWrap{width: 100%; padding: 0; text-align: center; font-size: var(--f-body1); word-break: keep-all;} .benefit-best .article2 .review-text .roundBox .textWrap .name{font-size: var(--f-body2); margin-top: 8rem;} .benefit-best .article2 .review-text .moreBtn{background-color: #1EC95B; color: #fff; display: flex; align-items: center; justify-content: center; display: inline-block; border-radius: var(--r-radius03); height: 39.91rem; font-size: var(--f-fontSize04); font-weight: 500; width: 115.96rem; margin-top: 24rem; transition: background-color 0.3s ease;} .benefit-best .article2 .review-text .moreBtn svg{width: 15.99rem; height: 15.99rem;} .benefit-best .article2 .review-text .mo-btn ~ .roundBox{display: none;} .benefit-best .article2 .review-text .mo-btn.active{display: none;} .benefit-best .article2 .review-text .mo-btn.active ~ .roundBox{display: block;} .benefit-best .roundWrap1{padding-bottom: 30rem; padding-top: 50rem;} .benefit-best .roundWrap1 .article1 .imgWrap{margin-top: 24rem;} .benefit-best .roundWrap1 .article1 .textWrap p{font-size: var(--f-fontSize05);} .march.dndn-package .characteristic-country{padding: 50rem 0 40rem;} .march.dndn-package .characteristic-country .all-title .title{margin-bottom: 30rem;} .march.dndn-package .characteristic-country .slideWrap .slide{width: calc(100% + 32rem); margin-left: -16rem; padding: 0 16rem 10rem;} .march.dndn-package .characteristic-country .slideWrap .slide::before, .march.dndn-package .characteristic-country .slideWrap .slide::after{width: 16rem;} .march.dndn-package .characteristic-country .swiper-slide{height: auto;} .march.dndn-package .characteristic-country .swiper-slide .textWrap{padding: 16rem 16rem 26rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap h3{font-size: var(--f-fontSize03); margin-bottom: 12rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box + .box{margin-top: 12rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .left{width: 65rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .left span{padding: 0 5rem; height: 21.97rem;} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .right{width: calc(100% - 65rem);} .march.dndn-package .characteristic-country .swiper-slide .textWrap .box .right .dotTxt::before{top: 8rem;} .march.dndn-package .characteristic-country .slideWrap .navigation{position: static; margin-bottom: 20rem;} .march.dndn-package .characteristic-country .slideWrap .navigation .pagination{overflow-x: auto; display: flex; overflow-y: hidden;} .march.dndn-package .characteristic-country .slideWrap .navigation .swiper-pagination-bullet{width: auto; height: 33.93rem; border-radius: var(--r-radius03); background: #DAE0F0; color: var(--c-text02 ); opacity: 1; font-size: var(--f-detail); letter-spacing: -0.13rem; line-height: 35.1rem; padding: 0px 16rem; margin: 0;} .march.dndn-package .characteristic-country .slideWrap .navigation .swiper-pagination-bullet + .swiper-pagination-bullet{margin-left: 6rem;} .march.dndn-package .characteristic-country .slideWrap .navigation .swiper-pagination-bullet.swiper-pagination-bullet-active{background: #6E31F5; color: #fff; font-weight: 600;} .march.dndn-package .recommended-training{padding: 50rem 0;} .march.dndn-package .recommended-training .all-title .title{margin-bottom: 30rem;} .march.dndn-package .recommended-training .list{column-gap: 8rem; row-gap: 8rem; } .march.dndn-package .recommended-training .list li{height: 194rem; padding: 12rem 16rem;} .march.dndn-package .recommended-training .list li strong{font-size: var(--f-fontSize05); width: 100%;} .march.dndn-package .recommended-training .list li p{font-size: var(--f-body2); margin-top: 0; width: 100%;} .march.dndn-package .recommended-training .list li figure{aspect-ratio: 128/54; height: 53.95rem; margin-bottom: 0;} .march.dndn-package .recommended-training .list li .textWrap{height: calc(100% - 53.95rem); display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center;} .march.dndn-package .recommended-training .list li.ec figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-1-mo.png') !important;} .march.dndn-package .recommended-training .list li.kaplan figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-2-mo.png') !important;} .march.dndn-package .recommended-training .list li.ilsc figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-3-mo.png') !important;} .march.dndn-package .recommended-training .list li.ces figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-4-mo.png') !important;} .march.dndn-package .recommended-training .list li.bayswater figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-5-mo.png') !important;} .march.dndn-package .recommended-training .list li.vgc figure{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.edmuhak.com/uhak/r/v1/programs/dndn-package/recommended-training-6-mo.png') !important;} .march.dndn-package .recommended-training .bottom-txt{margin-top: 16rem;} .march.dndn-package .recommended-training .next-txt{margin: 30rem 0 12rem;} .may { padding: 50rem 0; background: #B32831; } .may .box { padding: 30rem 0; } .may .innerBox { max-width: 100%; margin-top: 32rem; } .may .listEvent li { display: block; padding: 0 16rem; } .may .listEvent li + li { margin-top: 32rem; padding-top: 32rem; } .may .listEvent .textWrap { width: 100%; margin-bottom: 24rem; text-align: center; } .may .listEvent .imgWrap { width: 100%; } .may .listEvent .titleList { line-height: 29.055rem; } .may .listEvent .titleList figure { width: 22.1rem; height: 29.055rem; background-size: 22.1rem; } .may .listEvent .text { margin: 8rem 0 16rem; } .may .listEvent .textWrap .contact-btn { width: 114.01rem; height: 31.98rem; margin: 0 auto; } .may .listEvent .textWrap .contact-btn .arrow { width: 16.12rem; height: 16.12rem; margin-left: 2rem; } } @media screen and (max-width: 767px){ .dndn-package-btn-call { bottom: 166rem; } } @media screen and (max-width: 430px){ .area-school .list-school > li > strong { display: flex; align-items: center; height: 5.85rem; } }