/* font-size:3.875rem; font-weight:300; color:#fff; E70012 14 = 0.875 16 = 1 18 = 1.125 20 = 1.25 22 = 1.375 24 = 1.5 28 = 1.75 36 = 2.25 48 = 3 56 = 3.5 60 = 3.75 62 = 3.875 */ /* 스와이퍼 5버전 부터 ie 미지원으로 화살표 미노출에 대한 레거시 처리 */ @media all and (-ms-high-contrast:none) { .swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; } .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); left: 10px; right: auto; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); right: 10px; left: auto; } .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-lock { display: none; } } /* 비쥬얼 슬라이더 */ #main_visual_wrap {position: relative; padding-top:70px; width:100%; height:600px; background:#E70012; overflow:hidden; } .visual_decoimg_wrap {position: absolute; z-index:2;} .visual_decoimg_wrap.cerc01 { left:-15%; animation: cercle01 10s linear infinite;} @keyframes cercle01 { 0% { top:3%; } 25% { top:7%; } 50% { top:10%; } 75% { top:7%; } 100% {top:3%; } } .visual_decoimg_wrap.cerc02 { left:20%; animation: cercle02 10s linear infinite;} @keyframes cercle02 { 0% { top:40%; } 25% { top:50%; } 50% { top:60%; } 75% { top:50%; } 100% {top:40%; } } .visual_decoimg_wrap.cerc03 { right:-13%; animation: cercle03 10s linear infinite;} @keyframes cercle03 { 0% { top:20%; } 25% { top:15%; } 50% { top:10%; } 75% { top:15%; } 100% {top:20%; } } .visual_swiper_container { width: 100%; height: 100%; overflow: hidden; } .visual_swiper_container .swiper-slide { position: relative; padding:0 10vw; z-index:1; } .visual_swiper_container .swiper-slide .title { padding-top:5vw; width:50%; font-size:3.75rem; font-weight:800; color:#fff; } .visual_swiper_container .swiper-slide .title p { font-size:1.125rem; font-weight:500; color:#fff; } .visual_swiper_container .swiper-slide .text { padding-top:2vw; width:50%; } .visual_swiper_container .swiper-slide .text img { max-width:100%; } .visual_swiper_container .swiper-slide .date { width:40%; margin-top:40px; font-size:1.375rem; font-weight:800; color:#fff; } p.btn_visual_more { display:block; width:120px;border:1px solid rgba(255,255,255,0.4); padding:3px 0 3px 2px; margin-top:50px; text-align:center; } p.btn_visual_more a { font-size:0.875rem; font-weight:300; color:#fff; } .visual_swiper_container .swiper-slide .img {position: absolute; right:10vw; top:3vw; width:100%; max-width: 650px; z-index:999; } .visual_swiper_container .swiper-slide .img img { width:100%; border-radius:30px; box-shadow: 0px 10px 30px rgba(0,0,0,0.4);} .swiper-button-prev.ilevisual, .swiper-button-next.ilevisual { top: 55%; color:#fff; } .swiper-button-prev.ilevisual { left:3vw;} .swiper-button-next.ilevisual { right:3vw; } /* 2022.02.11 for 익스 디폴트 화살표 제거 */ .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-next, .swiper-container-rtl .swiper-button-prev{background:none;} .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after, .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after{display:none;} .ilevisual i{font-size:2.4rem;} /* 2022.02.11 for 익스 디폴트 화살표 제거 // */ .swiper-pagination.ilevisual {bottom:20px; left:calc(50% - 80px); width:80px; height:30px; line-height:30px; margin:0 auto; background:rgba(0,0,0,0.4); color:#fff; border-radius:50px;} .swiper_control_wrap {margin-left:8px !important; position: absolute; bottom:20px; height:30px; line-height:30px; left:calc(50%); width:80px; margin:0 auto; background:rgba(0,0,0,0.4); color:#fff; border-radius:50px; text-align:center; z-index: 10; } .swiper_control_wrap > div { display:inline-block; } .swiper_control_wrap > div span { margin:0; padding:0;cursor:pointer; cursor:hand; } @media screen and (max-width: 1679px) { .visual_swiper_container .swiper-slide .title { padding-top:5vw; font-size:3rem; width:40%; } .visual_swiper_container .swiper-slide .text { width:40%; } } @media screen and (max-width: 1439px) { #main_visual_wrap { height:600px; } .visual_swiper_container .swiper-slide .title { padding-top:10vw; width:46%; font-size:2.25rem; } .visual_swiper_container .swiper-slide .text { width:46%; } .visual_swiper_container .swiper-slide .date { width:40%; margin-top:40px; font-size:1.375rem; font-weight:800; } .visual_swiper_container .swiper-slide .img { top:6vw; max-width: 540px; } } @media screen and (max-width: 1279px) { #main_visual_wrap { height:520px; } .visual_swiper_container .swiper-slide .title { font-size:1.5rem; } .visual_swiper_container .swiper-slide .date { margin-top:30px; font-size:1.25rem; font-weight:600; } .visual_swiper_container .swiper-slide .img { max-width: 440px; } } @media screen and (max-width: 1023px) { #main_visual_wrap { height:auto; padding-bottom:0px;} .visual_swiper_container .swiper-slide .title { padding-top:10vw; font-size:2rem; } .visual_swiper_container .swiper-slide .title p { font-size:1rem; } .visual_swiper_container .swiper-slide .text { width:100%; } .visual_swiper_container .swiper-slide .date { width:100%; margin-top:20px; font-size:1.75rem; } p.btn_visual_more { margin-top:20px; } .visual_swiper_container .swiper-slide .img { position: relative; width:100%;max-width:100%; right:0; margin:0; padding:0; padding-bottom:18vw; z-index:5; } .swiper-button-prev.ilevisual { left:0%; } .swiper-button-next.ilevisual { right:0%; } .visual_decoimg_wrap.cerc01 { left:-25%; } .visual_decoimg_wrap.cerc02 { left:50%; } @keyframes cercle02 { 0% { top:-10%; } 25% { top:-5%; } 50% { top:0%; } 75% { top:-5%; } 100% {top:-10%; } } .visual_decoimg_wrap.cerc03 { right:-30%; } } @media screen and (max-width: 767px) { .visual_swiper_container .swiper-slide .title { width:calc(90%); font-size:1.5rem; } .visual_swiper_container .swiper-slide .title p { font-size:1rem; } .visual_swiper_container .swiper-slide .date { width:100%; margin-top:20px; font-size:1rem; } .swiper-button-prev.ilevisual { display:none; } .swiper-button-next.ilevisual { display:none;} .swiper-pagination.ilevisual {bottom:10px;} .swiper_control_wrap { bottom:10px; } } @media screen and (max-width: 479px) { .visual_decoimg_wrap.cerc01 { left:-70%; } .visual_decoimg_wrap.cerc02 { left:35%; } @keyframes cercle02 { 0% { top:-10%; } 25% { top:-5%; } 50% { top:0%; } 75% { top:-5%; } 100% {top:-10%; } } .visual_decoimg_wrap.cerc03 { right:-80%; } } /* 비쥬얼 하단 퀵 배너 */ #main_squarebanner_wrap { overflow:hidden; width:100vw;} div.quickSwiper img { width:100% !important; } /* #main_squarebanner_wrap > ul {} #main_squarebanner_wrap > ul > li { float:left; width:25%;} @media screen and (max-width: 969px) { #main_squarebanner_wrap > ul > li { width:50%;} } @media screen and (max-width: 479px) { #main_squarebanner_wrap > ul > li { width:100%;} } */ /* 바로가기 메뉴 */ #main_quickgoto_wrap { margin:50px 0 140px;} #main_quickgoto_wrap dl {} #main_quickgoto_wrap dl > dt { float:left; width:20%; font-size:3rem; font-weight:800; color:#111; } #main_quickgoto_wrap dl > dt > p { font-size:1.125rem; font-weight:400; color:#555; margin-top:0px;} #main_quickgoto_wrap dl > dt > p > a { cursor:pointer; cursor:hand; font-size:1.125rem; font-weight:400; color:#555; margin-top:0px; margin-bottom:10px; border:1px solid #d4d4d4; padding:5px 15px; margin-right:5px; border-radius:50px; } #main_quickgoto_wrap dl > dt > p > a.on { background:#E70012; color:#fff; border:1px solid #E70012; } #main_quickgoto_wrap dl > dt > strong {display:block; font-size:1.125rem; font-weight:400; color:#555; margin-top:30px;} #main_quickgoto_wrap dl > dd { float:left; width:80%;} #quickgoto_daechi { display:block; } #quickgoto_apgujung { display:none; } ul.main_quickgoto_box {} ul.main_quickgoto_box > li { float:left; width:16.666%; padding-left:10px;} ul.main_quickgoto_box > li > a {transition:.5s; width:10vw; height:10vw; font-size:1.125rem; font-weight:600; color:#111; padding-top:2vw; background:#F4F5F9; color:#111; border-radius:30px; text-align:center; } ul.main_quickgoto_box > li > a > img { max-width:50%; } ul.main_quickgoto_box > li > a > p { margin-top:1vw; } ul.main_quickgoto_box > li:hover a{background:#E70012; color:#fff; transform:translateY(-10px); box-shadow: 0px 4px 8px rgb(150 150 150 / 20%);} @media screen and (max-width: 1679px) { #main_quickgoto_wrap { margin:80px 0;} #main_quickgoto_wrap dl > dt { float:none; width:100%; } #main_quickgoto_wrap dl > dd { float:none; width:100%; margin-top:30px;} ul.main_quickgoto_box > li > a { width:14vw; height:14vw; padding-top:2.5vw; font-size:1rem; } } @media screen and (max-width: 1023px) { ul.main_quickgoto_box > li { padding-right:15px; } ul.main_quickgoto_box > li > a { width:13vw; height:13vw; padding-top:2.5vw; font-size:0.875rem; } } @media screen and (max-width: 767px) { ul.main_quickgoto_box > li { float:left; width:33.333%; padding-left:0px; margin-top:15px;} ul.main_quickgoto_box > li > a { width:28vw; height:28vw; padding-top:6vw; font-size:1rem; } #main_quickgoto_wrap dl > dt { font-size:2.25rem; } #main_quickgoto_wrap dl > dt > strong { font-size:1.rem; margin-top:10px;} } @media screen and (max-width: 479px) { ul.main_quickgoto_box > li > a { font-size:0.872rem; } } /* 과정별 슬라이드 팝존배너 */ #main_classpopzone_wrap {position: relative; } div.popzone_swiper_container .swiper-slide {position: relative; text-align:right; background:#fff; } div.class_popzone_text_box { position: absolute; left:0; top:0; padding:30px 70px 0 0; width:30%; height:75%; background:#fff; z-index:99; text-align:left; } dl.class_popzone_item {} dl.class_popzone_item > dt { font-size:2.375rem; font-weight:600; color:#111;} dl.class_popzone_item > dt > p { margin-top:80px; font-size:4.375rem; font-weight:800; color:#111; margin-bottom:20px; } dl.class_popzone_item > dd {margin:40px 0; font-size:1.125rem; font-weight:400; color:#555;} div.btn_popzone_more a { color:#111; } div.btn_popzone_more a:hover { color:#E70012;} div.btn_popzone_more a img { margin-left:10px; } /* 화살표 디자인 바꾸기 */ .swiper-button-next.arrow_popzone { left:150px; top:20px; width:40px !important; height:40px !important; background: url(/ileschool/_images/main/popzone_arrow_next.png) no-repeat; background-position: center;} .swiper-button-prev.arrow_popzone { left:70px; top:20px; width:40px !important; height:40px !important; background: url(/ileschool/_images/main/popzone_arrow_prev.png) no-repeat; background-position: center;} .swiper-button-next.arrow_popzone::after, .swiper-button-prev.arrow_popzone::after { display: none; } .swiper-button-next.arrow_popzone::before { content: ""; position: absolute; left:-20px; top:7px; display: block; width: 1px; background:#ddd; height:25px; } @media screen and (max-width: 1679px) { div.class_popzone_text_box { width:40%; height:80%; } } @media screen and (max-width: 1439px) { div.class_popzone_text_box { padding:0px 40px 0 0; } dl.class_popzone_item > dt { font-size:2.375rem; } dl.class_popzone_item > dt > p { font-size:3.375rem; } } @media screen and (max-width: 1335px) { div.class_popzone_text_box { width:60%; height:auto; margin:0 20%; padding:0 40px 40px; background:rgba(255,255,255,0.8); } dl.class_popzone_item > dt { font-size:1.5rem; } dl.class_popzone_item > dt > p { font-size:3rem; margin-top:30px;} dl.class_popzone_item > dd {margin:20px 0; } .swiper-button-prev.arrow_popzone { left:calc(50% - 50px); top:-30px; } .swiper-button-next.arrow_popzone { left:calc(50% + 10px); top:-30px; } .swiper-button-next.arrow_popzone::before { content: ""; position: absolute; left:-10px; top:7px; display: block; width: 1px; background:#ddd; height:25px; } } @media screen and (max-width: 767px) { div.class_popzone_text_box { width:80%;margin:0 10%; padding:0 30px 30px;} dl.class_popzone_item > dt { font-size:1.0rem; } dl.class_popzone_item > dt > p { font-size:2rem; margin-top:10px; margin-bottom:10px;} dl.class_popzone_item > dd {margin:10px 0; font-size:1rem;} } @media screen and (max-width: 479px) { div.class_popzone_text_box { width:100%; height:100%; margin:0%; padding:0 20px 0;} dl.class_popzone_item > dt { margin:20px 0 20px 0;} dl.class_popzone_item > dt > p {font-size: 1.5rem; margin-top: 0px; } dl.class_popzone_item > dd { display:none; } } /* 커리큘럼 */ #main_curriculum_wrap {margin:140px 0;} ul.main_curriculum_box {} ul.main_curriculum_box > li {position: relative; float:left; width:20%;padding:70px 0 0 70px; } ul.main_curriculum_box > li:first-child { float:left; width:60%; } ul.main_curriculum_box > li.mark_bg {background: url("../../_images/main/ile_mark.jpg") no-repeat 0px 95px; } dl.main_curriculum_title {} dl.main_curriculum_title > dt {position: relative; font-size:4.375rem; font-weight:800; color:#111; margin-bottom:20px;} dl.main_curriculum_title > dt::after { content: ""; position: absolute; left:0px; bottom:-50px; display: block; width: 60px; background:#111; height:3px; } dl.main_curriculum_title > dd {margin:180px 0 0; font-size:1.125rem; font-weight:400; color:#555;} dl.main_curriculum_item { margin-top:100px;} dl.main_curriculum_item > dt {position: relative; } dl.main_curriculum_item > dt > p { position: absolute; left:0px; bottom:-4px;width:60%; height:50px; line-height:50px; background:#fff; font-size:1.5rem; font-weight:600; color:#111;} dl.main_curriculum_item > dd { font-size:1.125rem; font-weight:400; color:#555; line-height:130%;} dl.main_curriculum_item > dd > p {margin:30px 0;} @media screen and (max-width: 1679px) { #main_curriculum_wrap {margin:80px 0;} dl.main_curriculum_title > dd {margin:100px 0 0; } } @media screen and (max-width: 1335px) { ul.main_curriculum_box > li { float:left; width:30%;padding:0 0 0 10%; } ul.main_curriculum_box > li:first-child { float:none; width:100%; padding:0;} ul.main_curriculum_box > li:nth-child(2) { margin-left:40%; } ul.main_curriculum_box > li.mark_bg {background: url("../../_images/main/ile_mark.jpg") no-repeat 35px 40px; } } @media screen and (max-width: 1279px) { dl.main_curriculum_title > dt { font-size:3rem; } ul.main_curriculum_box > li { float:left; width:40%;padding:0 0 0 10%; } ul.main_curriculum_box > li:nth-child(2) { margin-left:20%; } } @media screen and (max-width: 767px) { dl.main_curriculum_title > dt { font-size:2.25rem; } dl.main_curriculum_title > dt::after {bottom:-24px; } dl.main_curriculum_title > dd {margin:50px 0 0; } dl.main_curriculum_item { margin-top:50px;} ul.main_curriculum_box > li { float:left; width:50%; padding:0 5%; } ul.main_curriculum_box > li:nth-child(2) { margin-left:0%; } ul.main_curriculum_box > li.mark_bg {background:none; } dl.main_curriculum_item > dt > p {width:70%; line-height:60px; font-size:1.5rem;} dl.main_curriculum_item > dd { font-size:1rem; } } @media screen and (max-width: 520px) { dl.main_curriculum_item > dt > p {width:90%; line-height:60px; font-size:1.25rem;} dl.main_curriculum_item > dd { font-size:0.875rem; } } /* 세로형 이미지 배너 */ #main_Verticalbanner_wrap {} #main_Verticalbanner_wrap > ul {} #main_Verticalbanner_wrap > ul > li { float:left; width:25%;} @media screen and (max-width: 767px) { #main_Verticalbanner_wrap > ul { padding:0 20px 80px;} #main_Verticalbanner_wrap > ul > li { float:left; width:50%;} } /* 공지사항 */ #main_notice_wrap {padding:140px 0; background:#F9EEEF; } dl.main_notice_box {} dl.main_notice_box > dt {float:left; width:30%;} dl.main_notice_box > dd {float:left; width:70%; overflow:hidden; } dl.main_notice_title > dt {position: relative; font-size:4.375rem; font-weight:800; color:#111; margin-bottom:30px;} dl.main_notice_title > dd {font-size:1.125rem; font-weight:400; color:#555;} dl.main_notice_title > dd > p { margin-bottom:100px;} ul.main_notice_list {} ul.main_notice_list > li {position: relative; float:left; width:calc(33.333% - 50px); padding:30px; background:#fff; margin-left:50px; cursor:pointer; cursor:hand;} ul.main_notice_list > li > dl { min-height:455px;} ul.main_notice_list > li > dl > dt {} ul.main_notice_list > li > dl > dt > p { font-size:1.5rem; font-weight:600; color:#111; margin:35px 0 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; } ul.main_notice_list > li > dl > dd {font-size:1.125rem; font-weight:400; color:#555; } div.main_notice_date { position: absolute; left:30px; bottom:30px;font-size:1rem; font-weight:400; color:#999; margin-top:50px;} div.main_notice_more { position: absolute; right:0px; bottom:0px; width:60px; height:60px; line-height:60px; text-align:center; } ul.main_notice_list > li:hover div.main_notice_more { background:#E70012; color:#fff; } @media screen and (max-width: 1679px) { #main_notice_wrap {padding:80px 0; } dl.main_notice_title > dt {margin-bottom:10px;} dl.main_notice_title > dd > p { margin-bottom:30px;} ul.main_notice_list { margin-top:80px; } ul.main_notice_list > li {width:calc(33.333% - 14px); padding:20px; margin-left:20px; } ul.main_notice_list > li:first-child {margin-left:0px; } div.main_notice_date { left:20px; } } @media screen and (max-width: 1335px) { dl.main_notice_box > dt {float:none; width:100%;} dl.main_notice_box > dd {float:none; width:100%; } ul.main_notice_list > li { width:calc(33.333% - 27px); padding:30px; background:#fff; margin-left:40px; } ul.main_notice_list > li > dl { min-height:390px;} ul.main_notice_list > li > dl > dt > p { font-size:1.125rem; margin:25px 0 15px;} ul.main_notice_list > li > dl > dd {font-size:1rem; } } @media screen and (max-width: 1279px) { dl.main_notice_title > dt { font-size:3rem; } dl.main_notice_title > dd {font-size:1.125rem; } } @media screen and (max-width: 1023px) { ul.main_notice_list > li { width:calc(33.333% - 14px); padding:20px; background:#fff; margin-left:20px; padding-bottom:60px; } ul.main_notice_list > li > dl > dt > p { font-size:1rem; margin:25px 0 15px;} ul.main_notice_list > li > dl > dd {font-size:0.875rem; } ul.main_notice_list > li > dl { min-height:330px;} div.main_notice_date { left:20px; } } @media screen and (max-width: 767px) { ul.main_notice_list { margin-top:50px; } ul.main_notice_list > li {position: relative; float:none; width:100%; margin:0 0 15px 0; } ul.main_notice_list > li > dl { min-height:auto;} ul.main_notice_list > li > dl > dt img { display:none; } ul.main_notice_list > li > dl > dt > p { font-size:1.25rem; margin:0px 0 10px;} ul.main_notice_list > li > dl > dd {font-size:1rem; } div.main_notice_date { left:20px; bottom:15px } dl.main_notice_title > dt { font-size:2.25rem; } dl.main_notice_title > dd {font-size:1.125rem; } } @media screen and (max-width: 479px) { ul.main_notice_list > li > dl > dt > p { font-size:1.125rem; } ul.main_notice_list > li > dl > dd {font-size:1rem; } } /* 교육정보 */ #main_eduinfo_wrap {padding:0 0 140px; background:#F9EEEF; } dl.main_eduinfo_box {} dl.main_eduinfo_box > dt {float:left; width:30%;} dl.main_eduinfo_box > dd {float:left; width:70%; overflow:hidden; } dl.main_eduinfo_title > dt {position: relative; font-size:4.375rem; font-weight:800; color:#111; margin-bottom:30px;} dl.main_eduinfo_title > dd {font-size:1.125rem; font-weight:400; color:#555;} dl.main_eduinfo_title > dd > p { margin-bottom:100px;} ul.main_eduinfo_list {} ul.main_eduinfo_list > li {position: relative; float:left; width:calc(33.333% - 50px); padding:30px; background:#fff; margin-left:50px; margin-bottom:50px; cursor:pointer; cursor:hand;} ul.main_eduinfo_list > li > dl { min-height:7vw;} ul.main_eduinfo_list > li > dl > dt {} ul.main_eduinfo_list > li > dl > dt > p { font-size:1.5rem; font-weight:600; color:#111; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; } ul.main_eduinfo_list > li > dl > dd {font-size:1.125rem; font-weight:400; color:#555; } div.main_eduinfo_date { position: absolute; left:30px; bottom:30px;font-size:1rem; font-weight:400; color:#999; margin-top:50px;} div.main_eduinfo_more { position: absolute; right:0px; bottom:0px; width:60px; height:60px; line-height:60px; text-align:center; } ul.main_eduinfo_list > li:hover div.main_notice_more, ul.main_eduinfo_list > li:hover .main_eduinfo_more { background:#E70012; color:#fff; } @media screen and (max-width: 1679px) { #main_eduinfo_wrap {padding:0 0 80px; } dl.main_eduinfo_title > dt {margin-bottom:10px;} dl.main_eduinfo_title > dd > p { margin-bottom:30px;} ul.main_eduinfo_list { margin-top:80px; } ul.main_eduinfo_list > li {width:calc(33.333% - 14px); padding:20px; margin-left:20px; } ul.main_eduinfo_list > li:first-child, ul.main_eduinfo_list > li:nth-child(4) {margin-left:0px; } div.main_eduinfo_date { left:20px; } } @media screen and (max-width: 1335px) { dl.main_eduinfo_box > dt {float:none; width:100%;} dl.main_eduinfo_box > dd {float:none; width:100%; } ul.main_eduinfo_list > li { width:calc(33.333% - 27px); padding:30px; background:#fff; margin-left:40px; } ul.main_eduinfo_list > li > dl > dt > p { font-size:1.125rem; margin:0 0 15px 0;} ul.main_eduinfo_list > li > dl > dd {font-size:1rem; } } @media screen and (max-width: 1279px) { dl.main_eduinfo_title > dt { font-size:3rem; } dl.main_eduinfo_title > dd {font-size:1.125rem; } } @media screen and (max-width: 1023px) { ul.main_eduinfo_list > li { width:calc(33.333% - 14px); padding:20px; background:#fff; /*for 교육정보 태블릿 박스 margin-left */margin-left:14px; padding-bottom:60px; margin-bottom:25px; } ul.main_eduinfo_list > li > dl > dt > p { font-size:1rem; margin:0 0 22px;} ul.main_eduinfo_list > li > dl > dd {font-size:0.875rem; } ul.main_eduinfo_list > li > dl { min-height:6vw;} div.main_notice_date { left:20px; } } @media screen and (max-width: 767px) { ul.main_eduinfo_list { margin-top:50px; } ul.main_eduinfo_list > li {position: relative; float:none; width:100%; margin-left:0px; } ul.main_eduinfo_list > li > dl { min-height:4vw;} ul.main_eduinfo_list > li > dl > dt img { display:none; } ul.main_eduinfo_list > li > dl > dt > p { font-size:1.25rem; margin:0px 0 10px;} ul.main_eduinfo_list > li > dl > dd {font-size:1rem; } div.main_eduinfo_date { left:20px; bottom:15px } dl.main_eduinfo_title > dt { font-size:2.25rem; } dl.main_eduinfo_title > dd {font-size:1.125rem; } } @media screen and (max-width: 479px) { ul.main_eduinfo_list > li > dl > dt > p { font-size:1.125rem; } ul.main_eduinfo_list > li > dl > dd {font-size:1rem; } } /* SNS 정보 */ #main_sns_wrap {padding:0 0 140px; background:#F9EEEF; } dl.main_sns_box {} dl.main_sns_box > dt {float:right; width:30%;} dl.main_sns_box > dd {float:left; width:70%; overflow:hidden; } dl.main_sns_title > dt {position: relative; font-size:4.375rem; font-weight:800; color:#111; margin-bottom:30px; text-align:right; } dl.main_sns_title > dd {font-size:1.125rem; font-weight:400; color:#555; text-align:right; } dl.main_sns_title > dd > p { margin-bottom:30px;} ul.main_sns_list {} ul.main_sns_list > li {position: relative; float:left; width:calc(25% - 50px); padding:0px; background:#fff; margin-right:50px; margin-bottom:50px; cursor:pointer; cursor:hand;} ul.main_sns_list > li > dl { min-height:7vw;} ul.main_sns_list > li > dl > dt {} ul.main_sns_list > li > dl > dt > p { font-size:1.5rem; font-weight:600; color:#111; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; } ul.main_sns_list > li > dl > dd {font-size:1.125rem; font-weight:400; color:#555; } div.main_sns_date { position: absolute; left:30px; bottom:30px;font-size:1rem; font-weight:400; color:#999; margin-top:50px;} div.main_sns_more { position: absolute; right:0px; bottom:0px; width:60px; height:60px; line-height:60px; text-align:center; } ul.main_sns_list > li:hover div.main_notice_more, ul.main_sns_list > li:hover .main_eduinfo_more { background:#E70012; color:#fff; } div.mySNS div.swiper-slide { position: relative; text-align: center; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } /* 샐 메인 하단 sns */ #body_wrap{overflow:hidden;} #main_sns_wrap .inner70{padding:0;} div.mySNS div.swiper-slide > a{position:relative; width:100%; height:100%; } div.mySNS div.swiper-slide p { position: absolute; right:0px; bottom:0px; width:70px; height:70px; line-height:70px; background:rgba(0,0,0,0.2); z-index:3; text-align:center; transition: .5s; } div.mySNS div.swiper-slide img {/*max-width:100%;*/ width:100%; } div.mySNS div.swiper-slide p img{width: 40px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);} div.mySNS div.swiper-slide:hover p { width:100%; height:100%; line-height:auto; } div.mySNS div.swiper-slide:hover p img{width: 120px;} /* 샐 메인 하단 sns //*/ /* 지점별 약도 */ #main_locationmap_wrap {padding:140px 0; } .main_branch_menu{ width:100%; height:auto; overflow:hidden;} .main_branch_menu > ul { padding:0; margin:0; list-style:none; overflow:hidden; } .main_branch_menu > ul > li { float:left; display:block; margin-right:4vw; line-height:40px; font-size:2.25rem; font-weight:600; color:#111; border-bottom:2px solid #fff; cursor:pointer; } .main_branch_menu > ul > li:hover, .main_branch_menu > ul > li.on{ color:#E70012; border-bottom:2px solid #E70012; } .main_branch_menu .conBox { width:100%; height:auto; overflow:hidden; display:none;min-height:200px; background:#fff; text-align:center; } .main_branch_menu .conBox.on{display:block; } .main_branch_menu .conBox.on .hov{display:block; } div.main_branch_info {} div.main_branch_info > ul { margin:70px 0 40px;} div.main_branch_info > ul > li { float:left; width:24%;} div.main_branch_info > ul > li:first-child { width:52%;} dl.main_branch_info_item {} dl.main_branch_info_item > dt { float:left; font-size:1.25rem; font-weight:600; color:#C2BFBF; margin-right:15px; } dl.main_branch_info_item > dt > p { display:inline-block; width:60px; height:60px; line-height:60px; background:#f5f2f2; border-radius:20px; text-align:center; color:#C2BFBF; } dl.main_branch_info_item > dt > p > span {font-size:30px; } dl.main_branch_info_item > dd { float:left; font-size:1.5rem; font-weight:600; color:#111;} dl.main_branch_info_item > dd > p { font-size:1.25rem; font-weight:600; color:#C2BFBF; text-align:left; } /* 다음 지도 높이값 잡기 */ .root_daum_roughmap .wrap_map { position: relative; height: 400px; } /* 지도 스크롤 막기 */ .root_daum_roughmap {pointer-events: none;} .map_wrapper { position: relative; } .map_wrapper .hov { color: #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 999; background: rgba(0, 0, 0, .3); display: table; z-index: 2; } .map_wrapper .hov p { display: table-cell; vertical-align: middle; font-size: 20px; font-weight: bold; letter-spacing: normal; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); } .map_wrapper .hov p i, .map_wrapper .hov p span { vertical-align: middle; display: inline-block } @media screen and (max-width: 1679px) { #main_locationmap_wrap {padding:80px 0; } } @media screen and (max-width: 1279px) { .main_branch_menu > ul > li { font-size:1.5rem; } div.main_branch_info > ul { margin:40px 0 40px;} dl.main_branch_info_item > dd { font-size:1rem; } dl.main_branch_info_item > dd > p { font-size:0.875rem; margin-top:12px;} } @media screen and (max-width: 1023px) { .root_daum_roughmap .wrap_map { position: relative; height: 300px; } div.main_branch_info > ul > li { float:none; width:100%; margin-top:10px; } div.main_branch_info > ul > li:first-child { width:100%; margin-top:0px; } } @media screen and (max-width: 767px) { dl.main_branch_info_item > dt > p { width:40px; height:40px; line-height:40px; border-radius:6px;} dl.main_branch_info_item > dt > p > span {font-size:20px; } dl.main_branch_info_item > dd > p { margin-top:0px;} .root_daum_roughmap .wrap_map { position: relative; height: 200px; } } @media screen and (max-width: 479px) { .main_branch_menu > ul > li { font-size:1.25rem; } dl.main_branch_info_item > dd { font-size:0.875rem; } } /********************** 팝존 **********************/ div.popzone_wrap { position: relative;} div.popzone_wrap img { max-width:100%; height:auto; }