@charset "utf-8"; /* CSS Document */

/**/
.step_tit { text-align:center; } 
.step_tit .t1 { font-size:2.000em; font-weight:600; } 
.step_tit .t2 { font-size:1.188em; margin-top:1.25em; } 

.step_st { display:flex; justify-content:center; gap:0 5em; margin:2.5em 0 3em 0; word-break:keep-all; counter-reset:stepIdx; } 
.step_st:first-child { margin-top:0; } 
.step_st > li { width:6.5em; counter-increment:stepIdx; } 
.step_st > li .ico { position:relative } 
.step_st > li:not(:last-child) .ico:before { content:""; position:absolute; left:100%; top:50%; width:5em; height:1px; background:#ddd } 
.step_st > li .ico .xi { position:relative; font-size:1em; width:1.875em; height:1.875em; margin:0 auto; display:flex; align-items:center; justify-content:center; color:#fff; background:#ccc; border-radius:50% } 
.step_st > li .ico .xi:before { content:counter(stepIdx); } 
.step_st > li .tt { margin-top:.75em; text-align:center; font-size:1.063em; color:#666; font-weight:500; line-height:1.3; } 
.step_st > li.on .tt { font-weight:600; color:var(--siteC) } 
.step_st > li.on .ico .xi,
.step_st > li.on .ico:before { background:var(--siteC); } 
.step_st > li.on .ico .xi:before { content:"\e928" } 
.step_st > li.on .ico .xi:after { content:""; position:absolute; top:-.25em; bottom:-.25em; left:-.25em; right:-.25em; border:2px dotted var(--siteC); border-radius:50%; opacity:.4; } 
.step_st > li:not(.on) .ico .xi:before { font-size:.875em; font-weight:700; } 

/**/
.swiperBtn { width:2.5em; height:2.5em; position: static; display:flex; align-items:center; justify-content:center; z-index:100; cursor:pointer; font-size:1.125em; opacity:1; transition:.3s } 
.swiperBtn:before { font-family:xeicon } 
.swiperBtn.prev:before { content:"\e93d" } 
.swiperBtn.next:before { content:"\e940" } 
.swiperBtn.pause:before { content:"\ea3b" } 
.swiperBtn.play:before { content:"\ea3e" } 
.swiperBtn.ab { position:absolute; top:50%; } 
.swiperBtn.ab.prev { left:0; transform:translate(-50%, -50%) } 
.swiperBtn.ab.next { right:0; transform:translate(50%, -50%) } 
.swiperBtn.ab.in.prev { transform:translate(.5em, -50%) } 
.swiperBtn.ab.in.next { transform:translate(-.5em, -50%) } 
.swiperBtn.line { border:1px solid #ddd } 
.swiperBtn.round { border-radius:50% } 
.swiperBtn.s1 { font-size:2em } 
.swiperBtn.ico1.prev:before { content:"\e908" } 
.swiperBtn.ico1.next:before { content:"\e90b" } 
.swiperBtn:hover { background:#111; color:#fff } 
.swiperBtn.white { color:#fff; border-color:rgba(255,255,255,.5) } 
.swiperBtn.c1 { background:#eee; color:#999; } 
.swiperBtn.line.white:hover,
.swiperBtn.line.white.play { background:#1f5aa7; border-color:rgba(255,255,255,.2) } 

.swiperControl { display:flex; align-items:center; gap:.5em; z-index:10 } 
.swiperControl.hc { justify-content:center; } 
.swiperControl .paging { width:auto; display:flex; align-items:center; gap:.5em } 
.swiperControl .paging.grow { flex:1 1 0%; min-width:0 } 
.swiperControl .paging:first-child { margin-right:1em } 
.swiperControl .swiper-pagination-fraction .swiper-pagination-current { font-weight:700 } 
.swiperControl .paging .swiper-pagination-bullet { position:relative; border:1px solid #111; background:none; opacity:1; border-radius:0; width:.5em; height:.5em; margin:0; transition:.5s } 
.swiperControl .paging .swiper-pagination-bullet.swiper-pagination-bullet-active { background:#111; transform:rotate(45deg) } 

.swiperPauseWrap .play { display: none } 
.swiperPauseWrap.pause .play { display: flex; background:#111; color:#fff } 
.swiperPauseWrap.pause > .pause { display: none } 
.swiperPaging span.swiper-pagination-progressbar-fill { background:#111 } 
.slider_wrap { position:relative } 

.gsSplit > i { min-width:.25em; transform:translateY(0); opacity:0 } 
.gsSplit.on > i { animation-name: splitAni; animation-duration: .5s; animation-fill-mode: forwards; } 
@keyframes splitAni { 30% { transform:translateY(-.5em); opacity:0 } 
100% { transform:translateY(0); opacity:1 } 
 }

.gsSvg > path { transform:translateY(0); opacity:0 } 
.gsSvg.on > path { animation-name: splitSvgAni; animation-duration: 1.5s; animation-fill-mode: forwards; } 
@keyframes splitSvgAni { 30% { transform:translateY(-200%); opacity:0 } 
100% { transform:translateY(0); opacity:1 } 
 }
.gsSvg.on > path:nth-child(2) { animation-delay:.1s } 
.gsSvg.on > path:nth-child(3) { animation-delay:.2s } 
.gsSvg.on > path:nth-child(4) { animation-delay:.3s } 
.gsSvg.on > path:nth-child(5) { animation-delay:.4s } 
.gsSvg.on > path:nth-child(6) { animation-delay:.5s } 
.gsSvg.on > path:nth-child(7) { animation-delay:.6s } 
.gsSvg.on > path:nth-child(8) { animation-delay:.7s } 

.gsClass.opacity { opacity:0; transition:1.5s } 
.gsClass.opacity.on { opacity:1 } 

.gsClass.move { opacity:0; transition:1s } 
.gsClass.move.mT { transform:translateY(10vmin) } 
.gsClass.move.mB { transform:translateY(-10vmin) } 
.gsClass.move.mL { transform:translateX(15vmin) } 
.gsClass.move.mR { transform:translateX(-15vmin) } 
.gsClass.move.on { opacity:1; transform:translate(0) } 

.gsClass.tShow .el { overflow:hidden } 
.gsClass.tShow .el > i { transform:translateY(-100%); transition:1s } 
.gsClass.tShow.on .el > i { transform:translateY(0) } 

.gsClass.imgShow { overflow:hidden } 
.gsClass.imgShow .el { transition:1s; } 
.gsClass.imgShow.left .el { transform:translateX(-100%) } 
.gsClass.imgShow.right .el { transform:translateX(100%) } 
.gsClass.imgShow.top .el { transform:translateY(-100%) } 
.gsClass.imgShow.bottom .el { transform:translateY(100%) } 
.gsClass.imgShow.on .el { transform:translate(0) } 

.gsClass.listShow .el { transform:translateY(20vmin); opacity:0; transition:1s } 
.gsClass.listShow.on .el { transform:translateY(0); opacity:1 } 
.gsClass.listShow.on .el:nth-child(1) { transition-delay:.2s } 
.gsClass.listShow.on .el:nth-child(2) { transition-delay:.4s } 
.gsClass.listShow.on .el:nth-child(3) { transition-delay:.6s } 
.gsClass.listShow.on .el:nth-child(4) { transition-delay:.8s } 
.gsClass.listShow.on .el:nth-child(5) { transition-delay:1s } 
.gsClass.listShow.on .el:nth-child(6) { transition-delay:1.2s } 
.gsClass.listShow.on .el:nth-child(7) { transition-delay:1.4s } 
.gsClass.listShow.on .el:nth-child(8) { transition-delay:1.6s } 
.gsClass.listShow.on .el:nth-child(9) { transition-delay:1.8s } 
.gsClass.listShow.on .el:nth-child(10) { transition-delay:2s } 

.gsClass.accordion .el { transition:1.5s } 
.gsClass.accordion .el:nth-child(1) { transform:translate(0,0) } 
.gsClass.accordion .el:nth-child(2) { transform:translate(-100%,0) } 
.gsClass.accordion .el:nth-child(3) { transform:translate(-200%,0) } 
.gsClass.accordion .el:nth-child(4) { transform:translate(-300%,0) } 
.gsClass.accordion.on .el { transform:translate(0,0) } 

.gsClass.on { /* transition-timing-function:ease-in */ } 
.gsClass.on.d1 { transition-delay:.3s } 
.gsClass.on.d2 { transition-delay:.6s } 

/**/
.visualSlide { height:50vh; } 
.visualSlide .el { position: relative; overflow:hidden; /* background:#fff */ } 
.visualSlide .el .bg { position:absolute; left:0; top:0; width:100%; height:100%; transform:scale(1.1) } 
.visualSlide .el .vod_wrap { position:relative; height:100% } 
.visualSlide .el .vod_wrap:after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000 } 
.visualSlide .el.swiper-slide-active .vod_wrap:after,
.visualSlide .el.swiper-slide-duplicate-active .vod_wrap:after { transition:2s; opacity:.2 } 
.visualSlide .el.swiper-slide-active .bg,
.visualSlide .el.swiper-slide-duplicate-active .bg { transition:4s; transform:scale(1) rotate(.001deg) } 

.visualSlideSlogan_wrap { position:absolute; left:0; width:100%; top: 50%; transform: translateY(-50%); bottom:0; box-sizing:border-box; z-index:10; color:#fff } 
.visualSlideSlogan_wrap .wrapF { display:flex; flex-direction:column; height:100% } 
.visualSlideSlogan_wrap .wrapF .visual_con { flex:1 1 0%; min-height:0; display:flex; flex-direction:column; justify-content:center; gap:3em; margin-top:10vh } 

.visualSlide_wrap .wrapF { position:relative; overflow:hidden; border-radius:1em } 
.visualSlide_wrap .slogan { box-sizing:border-box; padding:0 5vw; text-align:center;} 
.visualSlide_wrap .slogan .t1 { font-size:2.5vmin; letter-spacing:.5vmin; opacity:.7; margin-bottom:1.5vmin;} 
.visualSlide_wrap .slogan .t1 .el i{ transform: translateY(-250%); transition: 1.5s;}
.visualSlide_wrap .slogan .t2 { font-size:7vmin; font-weight:900; text-transform:uppercase } 
.visualSlide_wrap .slogan .t3 { font-size:2.4vmin; line-height:1.6; margin-top:5vmin } 
.visualSlide_wrap .slogan .t3 .el i{ transform: translateY(-250%); transition: 1.5s;}

.swiper-slide-active .visualSlideSlogan_wrap .slogan .t3 .el i,
.swiper-slide-active .visualSlideSlogan_wrap .slogan .t1 .el i{ transform: translateY(0);}

.visualSlideSlogan_control{ position: absolute; right: 1.5em; bottom: 1em; color: #fff; z-index: 99;}
.visualSlide_control { margin-top:2em; display:flex; align-items:flex-end; width:100% } 
.visualSlide_control .control { margin:0 0 .5em auto; gap:1em } 
.visualSlide_control .swiperBtn{ min-width: 2.5em;}

/**/
#quickN { position:fixed; right:0; bottom:0; max-width:100%; z-index:1000; filter:drop-shadow(0 -1em 1em rgba(0,0,0,.1)) } 
#quickN .list { display:flex; flex-direction:column; align-items:flex-end } 
#quickN .list > li { position:relative } 
#quickN .list > li .st { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.25em; background:#fff; color:#666; width:6em; height:6em } 
#quickN .list > li:not(:last-child) .st { border-bottom:1px solid rgba(0,0,0,.1) } 
#quickN .list > li .st.c1 { background:var(--siteGra); color:#fff } 
#quickN .list > li .st.c2 { background:var(--siteC); color:#fff } 
#quickN .list > li .st .ico { width:2em; height:2em; display:flex; align-items:center; justify-content:center; font-size:1em } 
#quickN .list > li .st .ico:before { font-size:1.5em } 
#quickN .list > li .st .tt { font-size:.813em } 
#quickN .list > li:nth-child(1) .st { border-top-left-radius:1em; } 
#quickN .list > li:nth-last-child(2) .st { border-bottom-left-radius:1em } 
#quickN .list > li.top { margin:1em 1.25em 1em 0 } 
#quickN .list > li.top .st { border-radius:50%; width:3.5em; height:3.5em; box-shadow:0 0 1em rgba(0,0,0,.1) } 
#quickN .list > li:not(.top) { z-index:1 } 
#quickN .list > li:not(.top) .st:hover { padding:0 .5em; transition:padding .3s; box-shadow:-1em 0 1em rgba(0,0,0,.1); border-radius:1em 0 0 1em } 

/**/
.classTit { display:flex; align-items:center; flex-wrap:wrap; gap:1em } 
.classTit .tCate { color:var(--siteC); font-weight:500; position:relative; border:1px solid #ddd; border-radius:1em; padding:.25em 1em } 
.classTit .tTit { font-weight:700; font-size:1.188em; display:flex; align-items:baseline; gap:.25em } 
.classTit .tClass { font-weight:normal; font-size:.813em; color:#666; display:inline-flex } 
.classTit .tClass:before { content:"(" } 
.classTit .tClass:after { content:"강)" } 
.classTit .tClass.total:before { content:"(총\00a0" } 
.classTitW { display:flex; flex-wrap:wrap; align-items:center; gap:1em } 
.classTitW .mgL { margin-left:auto } 
.classTitW .btn { display:flex; gap:.25em } 

.tNTit { font-weight:500; color:#111 } 
.tNCo1 { color:green } 
.tNCo2 { color:red } 
.tNA { width:1.5em; height:1.5em; display:inline-flex; align-items:center; justify-content:center; border:1px solid #ccc; border-radius:50%; margin:0 2px; font-weight:500; font-size:.875em } 

.input_st.ico { background:none; border:1px solid transparent; color:#111; box-shadow:none !important } 
.input_st.ico .xi { font-size:1.375em } 
.input_st.ico.modify .xi:before { content:"\ea39" } 
.input_st.ico.delete .xi:before { content:"\e96f" } 
.input_st.ico.drag { cursor:grab; } 
.input_st.ico.drag:active { cursor:grabbing; } 
.input_st.ico.drag .xi:before { content:"\eabe" } 
.input_st.ico.back .xi:before { content:"\eb46" } 
.input_st.s3.fix { width:4.5em } 

.infoN { display:flex; align-items:center; gap:3em } 
.infoN > li { display:flex; gap:.25em; position:relative } 
.infoN > li:not(:last-child):after { content:""; position:absolute; right:-1.5em; top:50%; width:1px; height:80%; transform:translateY(-50%); background:#ccc } 
.infoN > li .tit { font-weight:500 } 
.infoN > li .tt { color:#666 } 

.memoStN { border:1px solid #ddd; border-radius:.5em; padding:1em; display:flex; flex-direction:column; gap:.5em } 
.memoStN > li { font-size:.875em; color:#666 } 
.memoStN > li[data-ico] { position:relative; padding-left:1.5em } 
.memoStN > li[data-ico]:before { content:attr(data-ico); position:absolute; left:0; top:0 } 

.inpW { display:flex; flex-wrap:wrap; gap:.5em } 
.inpW > * { flex:1 } 
.inpW .wAuto { flex:0 0 auto } 

.leveltestW { width:100%; height:100% } 
.leveltestW > form { height:100% } 
.leveltestW .doc { padding-bottom:5vmin; box-sizing:border-box; min-height:100% } 

.vodPlayerW { box-sizing:border-box; height:100%; width:100%; padding:1em; background:#f5f5f5; display:flex; flex-direction:column; gap:1em; overflow-y:auto } 
.vodPlayerW .inSt { background:#fff; padding:1em; box-shadow:0 0 1em rgba(0,0,0,.1) } 
.vodPlayerW .content_container .tt { font-size:.938em; color:#333; line-height:1.6; padding:1em } 
.vodPlayerW .vodBtnW { display:flex; align-items:center; gap:.5em } 
.vodPlayerW .vodBtnW .mgL { margin-left:auto } 

.stickyT { position:sticky; top:0; z-index:2 } 

.main_con { padding: 5.5em 0; } 
.main_con.bg1 { background: var(--siteBg2); } 
.main_con.bg2 { background: var(--siteBg3); } 

/*main why*/
.why_wrapper { display: flex; gap: 2em; } 
.why_wrapper > .left { width: 30%; } 
.why_wrapper > .left > .img_con { width: 100%; height: 100%; border-radius: 1em; overflow: hidden; } 
.why_wrapper > .left > .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.why_wrapper > .right { width: 70%; } 

.colorBox { } 
.colorBox > li { } 
.colorBox > li > .in { position:relative; padding: 2.5em; box-sizing: border-box; background: var(--siteBg4); border-radius: 1em; } 
.colorBox > li > .in > .tit { font-size: 1.25em; font-weight: 600; margin-bottom: 1em; } 
.colorBox > li > .in > .desc { font-size: 1em; color: #666; line-height: 1.6; } 
.colorBox > li > .in > .icon { position: absolute; bottom: 2em; right: 1em; } 
.colorBox > li > .in > .icon > img { width: 6em; height: 70px; object-fit: contain; } 

.colorBox.p1 > li > .in { padding: 2.5em 2.5em 5em 2.5em; } 

/*main search*/
.main_search { position:relative; padding: 3.5em 2.5em; box-sizing: border-box; overflow: hidden; border-radius: 1em; background: var(--siteBg2); margin-top: 3em; display: flex; gap: 3em; align-items: center; justify-content: center; } 
.main_search .search_icon { position:absolute; bottom: -1em; left: 3.5em; } 
.main_search .search_icon > img { width: 10em; object-fit: contain; } 
.main_search .search_txt { position: relative; display: flex; padding-left: 9.5em; } 
.main_search .search_txt > .tit { font-size: 1.715em; display: flex; align-items: center; font-weight: 700; } 
.main_search .search_txt > .tit > i { vertical-align: baseline; margin-left: .25em; } 
.main_search .search_txt > .tit > .xi { color: var(--siteC); transform: rotate(-90deg); margin-left: .5em; font-size: .8em; } 
.main_search .search_wrap { display: flex; gap: 1em; align-items: center; } 
.main_search .search_wrap .main_button { display: flex; align-items: center; background: var(--siteC2); border-radius: 100em; height: 3.5em; padding: 0 1.5em; color: #fff; box-shadow: 3px 0 9px rgba(0,0,0, .1); } 
.main_search .search_wrap .cate_warp { display: flex; border-radius: 100em; border: 1px solid var(--siteC); overflow: hidden; } 
.main_search .search_wrap .cate_warp .label_select { background: var(--siteC); color: #fff; border-radius: 0em; width: 13.5em; } 
.main_search .search_wrap .cate_warp .label_select option { color: #111; } 
.main_search .search_wrap .cate_warp .label_select:after { color: #fff; } 
.main_search .search_wrap .cate_warp .input_cate,
.main_search .search_wrap .cate_warp .input_tit { height: 3.5em; border: none; } 
.main_search .search_wrap .cate_warp .input_tit { width: 20em; padding: 0 1.5em; } 
.main_search .search_wrap .cate_warp .inp { position: relative; } 
.main_search .search_wrap .cate_warp .inp > .in { position: absolute; right: .5em; top: 50%; transform: translateY(-50%); } 
.main_search .search_wrap .cate_warp .inp > .in > .input_st { border: none; border-radius: 0; width: auto; padding: 0 1em; background: #fff; } 
.main_search .search_wrap .cate_warp .inp > .in > .input_st:hover { background: #fff; opacity: 1; box-shadow: none; } 
.main_search .search_wrap .cate_warp .inp > .in > .input_st > .xi { color: var(--siteC); } 

.main_search .search_wrap .cate_warp .input_cate { padding-left: 1.5em; } 

/*main edu*/
.main_edu { } 
.eduList { } 
.eduList > li { } 
.eduList > li > .in { box-shadow: 3px 0 24px rgba(0,0,0, .25); margin: 0 0 2em 2em !important; border-radius: 1em; overflow: hidden; } 
.eduList > li > .in > .img_con { position:relative; width: 100%; height: 13.5em; overflow: hidden; } 
.eduList > li > .in > .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.eduList > li > .in > .info { padding: 2.5em 2em; box-sizing: border-box; background: #fff; } 
.eduList > li > .in > .info > .type { font-size: 1.063em; font-weight: 400; margin-bottom: .4em; color: var(--siteC2); } 
.eduList > li > .in > .info > .tit { font-size: 1.215em; font-weight: 700; height: 3em; line-height: 1.4; } 
.infoBtm { margin-top: 1em; } 
.infoBtm .edu_tag { display: flex; gap: 1.5em; } 
.infoBtm .edu_tag > li { position:relative; font-size: .9em; color: #666; font-weight: 400; margin-bottom: .5em; } 
.infoBtm .edu_tag > li:before { position: absolute; right: -.75em; background: #ddd; width: 1px; height: 15px; top: 50%; transform: translateY(-50%); content: ''; } 
.infoBtm .edu_tag > li:last-of-type:before { display: none; } 
.infoBtm .price { font-size: 1.25em; font-weight: 700; } 

.eduTag { position: absolute; bottom: 0; right: 0; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; background-color: #000; color: white; font-weight: bold; font-size: 16px; display: flex; align-items: center; justify-content: center; border-radius: 50% 50% 0 50%; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } 
.eduTag > .tt { font-size: 1.063em; font-weight: 600; } 
.eduTag.c1 { background-color: #f44336; } 
.eduTag.c2 { background-color: #774cf1; } 

.con_idx { position:relative } 
.con_idx > .idx { position:absolute; left:0; top:0; width:100%; visibility:hidden; filter:alpha(opacity=0); opacity:0; display: none; } 
.con_idx > .idx.on { position:relative; visibility: visible; filter:alpha(opacity=100); opacity:1; display: block; } 

.mainBtn { display: flex; box-shadow: 4px 0 12px rgba(0, 0, 0, .1); border: 2px solid #111; border-radius: .75em !important; } 
.mainBtn:hover { opacity: 1 !important; } 

/*main_btn*/
.main_more { display: inline-block; cursor: pointer; } 
.main_more.pd1 { padding-top:2.5em; } 
.main_more.pd2 { padding-top:4em; } 
.main_more > .more { text-align:center; padding:0.825em 2em; background:#2a6bb6; border:1px solid #2a6bb6; border-radius:.5em; font-weight: 600; font-size: 1.05em; color:#fff; transition:.3s; cursor: pointer; } 
.main_more > .more.f-s { font-size: .8em; } 
.main_more > .more.submit { padding: .625em 1.5em; font-size: .85em; } 
.main_more > .more > .tt { font-size:.875em; } 
.main_more > .more > .tt ~ .xi { margin-left:.5em; } 
.main_more > .more > .xi { font-size:1.250em; padding-left: .5em; transform: rotate(-45deg); position: relative; top: 3px; } 
.main_more > .more.re:hover { background:#2a6bb6; border-color:#2a6bb6; color:#fff; } 

.main_more.white > .more { border: none; background: none; padding: 0em; color: #111; color: #222; } 
.main_more.bgin > .more { background: none; color: #fff; border: 1px solid #fff; border-radius: .5em; font-weight: 500; } 
.main_more.bgin > .more:hover { background: #fff; color: #111; } 
.main_more.bgin > .more:hover > .xi { color: #2a6bb6; } 


/*main update*/
.main_update { display: flex; gap: 2em; align-items: center; } 
.main_update .update_control { margin-top: 4em; } 
.main_update .page_tit { width: 30%; } 
.main_update .updateSlide_wrap { width: 70%; } 

.update_control { margin-top: 3em; } 
.update_control .paging { color:#fff; width:auto; display:flex; align-items: center; } 
.update_control .control { position: relative; display: flex; align-items: center; gap: .75em; } 
.update_control .control .progress-container { display: flex; align-items: center; gap: 1em; } 
.update_control .control .progress-container .progress-bar { position: relative; bottom: 0; width: 150px; height: 3px; background: rgba(255,255,255, 1); } 
.update_control .control .progress-container .progress-bar span { background: var(--siteC); } 
.update_control .control .progress-container .current-slide,
.update_control .control .progress-container .total-slide { font-weight: 600; } 

.update_control .control .prev,
.update_control .control .next { background: transparent; font-size: 1.25em; width: 1.25em; } 

.updateSlide { overflow: hidden; } 
.updateSlide .update-container { } 
.updateSlide .update-container .inner { display: flex; align-items: center; background: #fff; border-radius: 1em; overflow: hidden; } 
.updateSlide .update-container .inner .info { width: 40%; padding: 2.5em; box-sizing: border-box; } 
.updateSlide .update-container .inner .info .type { font-size: 1.063em; color: var(--siteC2); font-weight: 400; margin-bottom: .5em; } 
.updateSlide .update-container .inner .info .tit { font-size: 1.515em; font-weight: 700; margin-bottom: 1em; } 
.updateSlide .update-container .inner .info .desc { font-size: 1.063em; font-weight: 400; color: #666; line-height: 1.4; } 
.updateSlide .update-container .inner .img_con { width: 60%; height: 25em;} 
.updateSlide .update-container .inner .img_con > img { width: 100%; height: 100%; object-fit: cover; } 

/*main partner*/
.main_partner { } 
.main_partner .logoList { } 
.main_partner .logoList > li { } 
.main_partner .logoList > li > .in { margin: 0 0 3em 0; } 
.main_partner .logoList > li > .in > .logo { width: 100%; height: 100%; } 
.main_partner .logoList > li > .in > .logo > img { width: 100%; height: 50px; object-fit: contain; } 
.main_partner.st1 .logoList{--h:3.125em; gap:3em 4em; justify-content:center}
.main_partner.st1 .logoList > li{ flex:0 0 auto; max-width:calc(var(--h) * 4)}
.main_partner.st1 .logoList > li > .in{ margin-bottom:0}
.main_partner.st1 .logoList > li > .in > .logo{ }
.main_partner.st1 .logoList > li > .in > .logo img{ height:var(--h) }


/*main membership*/
.main_member { display: flex; gap: 3em; align-items: center; justify-content: center;} 
.main_member .left { width: 25%; } 
.main_member .left .innerWrap { display: flex; gap: 1em; } 
.main_member .left .innerWrap .innerB { flex: 1; padding: 2.5em; box-sizing: border-box; text-align: center; border-radius: 1em; } 
.main_member .left .innerWrap .innerB.c1 { background: var(--siteC); } 
.main_member .left .innerWrap .innerB.c2 { background: var(--siteC2); } 
.main_member .left .innerWrap .innerB .iconB { margin: 0 auto; width: 6em; height: 6em; border-radius: 50%; background: rgba(255,255,255, .3); display: flex; align-items: center; justify-content: center; } 
.main_member .left .innerWrap .innerB .iconB > img { width: 5em; height: 60px; object-fit: contain; } 
.main_member .left .innerWrap .innerB .title { font-size: 1.415em; font-weight: 700; margin: 1em 0; color: #fff; } 
.main_member .left .innerWrap .innerB .mainBtn { width: 100%; background: #fff; border: none; color: var(--siteC2); justify-content: space-between; } 
.main_member .left .innerWrap .innerB.c1 .mainBtn:hover { background: var(--siteC2); color: #fff; } 
.main_member .left .innerWrap .innerB.c2 .mainBtn:hover { background: var(--siteC); color: #fff; } 
.main_member .right { width: 55%; } 
.main_member .right .main_iconList { display: flex; gap: 2em; } 
.main_member .right .main_iconList > li { } 
.main_member .right .main_iconList > li > .con { } 
.main_member .right .main_iconList > li > .con > .icon { background: #fff; width: 9em; height: 9em; border-radius: 50%; display: flex; align-items: center; justify-content: center; } 
.main_member .right .main_iconList > li > .con > .icon > img { width: 6em; height: 70px; object-fit: contain; } 
.main_member .right .main_iconList > li > .con > .tt { text-align: center; margin-top: 1em; font-size: 1.15em; color: #444; font-weight: 600; } 

/*sub partner*/
.partnerTop { } 
.partnerTop .img_con { position: relative; width: 100%; height: 30em; } 
.partnerTop .img_con:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .2); content: ''; } 
.partnerTop .img_con .info { position: absolute; top: 50%; left: 50%; width: 100%; padding: 0 4em; box-sizing: border-box; transform: translate(-50%, -50%); text-align: center; } 
.partnerTop .img_con .info > .tt { color: #fff; font-size: 2.15em; font-weight: 700; } 
.partnerTop .img_con .info .desc { margin-top: 2em; } 
.partnerTop .img_con .info .desc > .tt { font-size: 1.15em; line-height: 1.6; font-weight: 400; color: rgba(255,255,255, .9); } 
.partnerTop .img_con .info .desc > .tt > i { font-weight: 600; color: #fff; vertical-align: baseline; } 
.partnerTop .img_con > img { width: 100%; height: 100%; object-fit: cover; } 

.intro-cont { margin-top:40px; } 
.intro-cont .intro-box { margin-bottom: 100px; display: flex; align-items: center; } 
.intro-cont .intro-box:last-of-type { margin-bottom: 0px; } 
.intro-cont .intro-box::after { content:''; display: block; clear: both; } 
.intro-cont .intro-box > .img-area { width:50%; float:left; height: 26em; border-radius: 1em; overflow: hidden; } 
.intro-cont .intro-box > div> img { width: 100%; height: 100%; object-fit: cover; } 
.intro-cont .intro-box .desc-area { width:calc(50%); margin-left:100px; } 
.intro-cont .intro-box .desc-area .title { color:#212121; font-size:27px; font-weight: 600; margin-bottom:25px; } 
.intro-cont .intro-box .desc-area .chk-desc li { font-size:18px; color:#6B6B6B; margin-bottom:25px; position: relative; padding-left:33px; line-height: 1.4; } 
.intro-cont .intro-box .desc-area .chk-desc li:before { position: absolute; left: 0; top: 2px; content: '\e928'; font-family: 'xeicon'; color: var(--siteC); } 

.partnerImg_joy { } 
.partnerImg_joy .img_con { position:relative; width: 100%; height: 20em; border-radius: 1em; overflow: hidden; } 
.partnerImg_joy .img_con:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .4); content: ''; } 
.partnerImg_joy .img_con > img { width: 100%; height: 100%; object-fit: cover; } 
.partnerImg_joy .img_con > .info { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; } 
.partnerImg_joy .img_con > .info > .tit { font-size: 2.15em; font-weight: 700; color: #fff } 
.partnerImg_joy .img_con > .info > .desc { font-size: 1.15em; line-height: 1.6; color: rgba(255,255,255, .9); margin-top: 1.5em; } 
.partnerImg_joy .img_con > .info > .desc > i { font-weight: 600; color: #fff; vertical-align: baseline; } 

.contactBox { margin-top: 1.5em; } 
.contactBox > li { } 
.contactBox > li > .in { padding: 1em; margin: 0 0 0 1em !important; box-sizing: border-box; background: var(--siteBg2); gap: .25em; display: flex; align-items: center; justify-content: center; border-radius: .5em; } 
.contactBox > li > .in > .left_con { display: flex; align-items: center; } 
.contactBox > li > .in > .left_con > .icon { } 
.contactBox > li > .in > .left_con > .icon > img { width: 3em; object-fit: contain; height: 35px; } 
.contactBox > li > .in > .left_con > .tit { font-size: 1.063em; font-weight: 600; } 
.contactBox > li > .in > .telN { font-size: 1.063em; font-weight: 400; color: #333; } 

/*sub community*/
.community_tit{ text-align: center; margin-bottom: 2em;}
.community_tit .tt{ font-size: 2.15em; font-weight: 700;}

/*community_list*/
.community_wrapper{ padding-top: 3.5em;}
.community_listW{ margin-top: 2.5em;}
.community_listW .community_list{}
.community_listW .community_list > li{}
.community_listW .community_list > li .inner{ display: block; border: 1px solid #ddd; border-radius: 1em; overflow: hidden; transition: .3s;}
.community_listW .community_list > li .inner:hover{ box-shadow: 3px 6px 24px rgba(0,0,0, .05); border: 1px solid var(--siteC);}
.community_listW .community_list > li .inner > .viewImg{ position: relative; width: 100%; height: 15vh;}
.community_listW .community_list > li .inner > .viewImg > img{ width: 100%; height: 100%; object-fit: cover;}
.community_listW .community_list > li .inner > .viewImg >.instructorImg{ position: absolute; bottom: -2em; left: 1.5em; width: 4.5em; height: 4.5em; border-radius: .5em; overflow: hidden;}
.community_listW .community_list > li .inner > .viewImg >.instructorImg > img{ width: 100%; height: 100%; object-fit: cover;} 
.community_listW .community_list > li .inner > .info{ padding: 3.5em 1em 1em 1.5em; box-sizing: border-box;}
.community_listW .community_list > li .inner > .info .title{ font-size: 1.215em; font-weight: 600; line-height: 1;}
.community_listW .community_list > li .inner > .info .visibility{ margin-top: 1em; font-size: .765em; color: rgba(0,0,0, .5); font-weight: 500;}
.community_listW .user_list{ margin-top: 2em; display: flex;}
.community_listW .user_list > li{}
.community_listW .user_list > li:nth-child(1){}
.community_listW .user_list > li > .profile{ width: 30px; height: 30px; border-radius: 50%; overflow: hidden;}
.community_listW .user_list > li > .profile > img{ width: 100%; height: 100%; object-fit: cover;}

.dp1_mypageS .community_wrapper{ padding-top: 0em;}
.dp1_mypageS .community_listW{ margin-top: 0em;}
.dp1_mypageS .community_listW .community_list > li > .in{ margin: 0 0 2em 1em;}

/*community_view*/
.community_view_wrapper{}
.community_view_wrapper .community_viewA{ border-radius: 1.5em; overflow: hidden; border: 1px solid #ddd;}
.community_view_wrapper .community_viewA .community_viewImg{ position:relative; width: 100%; height: 27vh;}
.community_view_wrapper .community_viewA .community_viewImg > img{ width: 100%; height: 100%; object-fit: cover;}
.community_view_wrapper .community_viewA .community_viewImg .instructorImg{ position: absolute; bottom: -3em; left: 3em; width: 6em; height: 6em; border-radius: 1em; overflow: hidden;}
.community_view_wrapper .community_viewA .community_viewImg .instructorImg > img{ width: 100%; height: 100%; object-fit: cover;}
.community_view_wrapper .community_viewA .infoInner{ position:relative; padding: 4.75em 3em 3em 3em; box-sizing: border-box;}
.community_view_wrapper .community_viewA .infoInner .BtnP{ position: absolute; display: flex; gap: .25em; align-items: center; top: 1.5em; right: 2em;}
.community_view_wrapper .community_viewA .infoInner .title{ font-size: 1.715em; font-weight: 600; line-height: 1.4;}
.community_view_wrapper .community_viewA .infoInner .desc{ font-size: .95em; line-height: 1.4; color: rgba(16,16,16, .7); margin-top: 1em;}

.community_view_wrapper .commu-tab{ margin-top: 2.5em; gap: .5em;}
.community_view_wrapper .commu-tab > li{}
.community_view_wrapper .commu-tab > li > .tab-btn{ cursor: pointer; padding: .5em 1em; box-sizing: border-box; background: #f5f5f5; border: 1px solid #ddd; border-radius: .25em;}
.community_view_wrapper .commu-tab > li.on > .tab-btn{ background: var(--siteC); border: 1px solid var(--siteC); color: #fff;}

.memberInner{ margin-top: 2em;}
.memberInner .innerCon{ margin-bottom: 5em;}
.memberInner .innerCon:last-of-type{ margin-bottom: 0em;}
.memberInner .wrapTit{ margin-bottom: 1em; align-items: center;}
.memberInner .tit{ font-size: 1.815em; font-weight: 500;}
.memberInner .host{}
.memberInner .host > li{}
.memberInner .host > li > .in{ border: 1px solid #ddd; padding: 1.5em; box-sizing: border-box; background: #f9f9f9; border-radius: 1em;}
.memberInner .host > li > .in > .profileImg{ margin: 0 auto; width: 8em; height: 8em; border-radius: 50%; overflow: hidden; border: 1px solid #ddd;}
.memberInner .host > li > .in > .profileImg > img{ width: 100%; height: 100%; object-fit: cover;}
.memberInner .host > li > .in > .name{ text-align: center; margin-top: 1em; font-size: 1.063em;}
.memberInner .memList{ margin-top: 2.5em;}
.memberInner .memList > li{}
.memberInner .memList > li > .in{ position: relative; margin: 0 0 1.8em 1em;}
.memberInner .memList > li > .in > .name{ display: flex; align-items: center; padding: 0 .5em; box-sizing: border-box; border-radius: .25em; justify-content: center; height: 3.5em; border: 1px solid #ddd; background: #f9f9f9; font-size: 1.063em;}
.memberInner .memList > li > .in > .label_st{ position: absolute; right: -.1em; top: -1.4em;}

/*mypage 탈퇴*/
.fin_box { border-radius:.5em; border:1px solid transparent; padding:2em; background:#f5f5f5; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:1.5em } 
.fin_box.p1 { padding:2em } 
.fin_box.p2 { padding:1em } 
.fin_box.g1 { gap:.5em } 
.fin_box.hl { align-items:flex-start } 
.fin_box .tit1 { font-size:1.75em; font-weight:700; text-align:center; word-break: keep-all;} 
.fin_box .tit1.s1 { font-size:1.375em } 
.fin_box .tit1.s2 { font-size:1.125em } 
.fin_box .tt1 { line-height:1.5; font-size:1.125em; opacity:.7 } 
.fin_box .tt2 { color:#666; line-height:1.4 } 
.fin_box .fs:not(:last-child):after { content:"," } 
.fin_box .fin_ico { font-size:4em; opacity:.1 } 
.fin_box.st1 { background:none; color:#fff } 
.fin_box.st1 .fin_ico { opacity:1 } 

/*이용가이드*/
.use_guide{ width: 800px; padding: 2.5em; box-sizing: border-box; margin: 0 auto; border: 1px solid #ddd; border-radius: 1em;}
.use_guide .guide_con{ margin-bottom: 3.5em;}
.use_guide .guide_con:last-of-type{ margin-bottom: 0em;}
.use_guide .guide_con h1{ font-size: 1.415em; font-weight: 700; margin-bottom: .75em; padding-bottom: .75em; border-bottom: 1px solid #ddd;}
.use_guide .guide_con h2{ font-size: 1.15em; font-weight: 500; margin-bottom: .3em; margin-top: 1em;}
.use_guide .guide_con .page_dot_list{}
.use_guide .guide_con .page_dot_list > li{ position: relative; padding-left: 2.5em; margin-bottom: .25em;}
.use_guide .guide_con .page_dot_list > li:before{ position: absolute; top: 7px; left: 1.75em; width: 4px; height: 4px; border-radius: 50%; background: #111; content: '';}