/* layout */ body{width:100%; -webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased; font-smoothing: antialiased;} #wrap{ overflow:hidden; position:relative;width:100%; min-width:320px;} #visual{width:100%;} #contents{position:relative; width:100%;} .in_Layer{ width: 100%;max-width:1180px;margin:0 auto;} .clear_obj:after{content:""; display:block; clear:both;} .top_center{top:50%; -webkit-transform:translate3d(0,-50%,0); -moz-transform:translate3d(0,-50%,0); -ms-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0); } .ef-3{ -webkit-transition:all .3s; -moz-transition:all .3s; transition:all .3s; } .ef-5{ -webkit-transition:all .5s; -moz-transition:all .5s; transition:all .5s; } #skip a{ overflow:hidden;display:block; position:absolute; top:0; left:0; width:100%; height:0; font-size:0; text-align:center; white-space:nowrap;} #skip a:active, #skip a:focus{position:relative; top:0; left:0; width:100%; height:32px; padding:8px 0 0 0; background-color:#333; font-size:18px; font-weight:600; color:#fff;} @media(max-width:1180px) { .in_Layer{ width:100%;margin:0 auto; padding:0 15px; } } .clamp3{ overflow:hidden; display:-webkit-box; white-space:normal; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:3; -webkit-box-orient: vertical; } .wrap_bg { display:none; position:fixed; top:60px; left:0; width:100%; height:100%; background:rgba(0,0,0, 0.7); z-index:115; } #header { display: flex !important; align-items: center; position: fixed; top: 0; left: 0; width: 100%; height: 80px; background: #ffffff; border-bottom: none; z-index: 500; transition: box-shadow 0.3s; font-family: "Noto Sans","Noto Sans KR"; } #header > .in_Layer { position: relative; max-width: 1670px; margin: 0 auto; padding: 0 15px; } .sub_page #header { border-bottom: 1px solid #f1f1f1; } #header .logo { position: absolute; top: 50%; left: 15px; transform: translate(0,-50%); } #header .logo a { display: block; position: relative; font-size: 28px; font-weight:800; color:rgb(8, 16, 33); } #header .logo a img { width: 100%; } #header .logo a img.logo_basic { opacity: 1; } #header .logo a img.logo_color { display: none; } #header .top_mypage_wrap { position: relative; } #header .top_mypage { display: block; margin-left: 20px; font-size: 16px; font-weight: 700; letter-spacing: -0.02em; color: #262626; } #header .login-menu { display:none; position:absolute; top:100%; left: 50%; width:160px; margin-top:21px; padding:20px; background:#fff; border:1px solid #333; border-radius:3px; z-index:110; transform: translate(-50%,0); } #header .login-menu .user-name { margin-bottom:15px; font-size:14px; font-weight:500; color:#0148d4; } #header .login-menu .user-name strong { font-weight:700; } #header .login-menu .user-menu li a { display:inline-block; position:relative; font-size:18px; font-weight:400; line-height:32px; color:#333; transition:.3s; } #header .login-menu .user-menu li a:after { content:''; position:absolute; bottom:5px; left:0; width:100%; height:1px; background:#333; transition:.3s; opacity:0; } #header .login-menu .user-menu li:hover a { font-weight:700; } #header .login-menu .user-menu li:hover a:after { opacity:1; } #header .gnb { display: flex; justify-content: center; align-items: center; gap:72px; } #header .gnb > li {position:relative;} #header .gnb > li a { display:flex; align-items:center; height:80px; font-weight: 700; font-size: 20px; letter-spacing: -0.02em; color: #424242; } #header .gnb > li a span {background: linear-gradient(90deg, #7292FF 0%, #A876ED 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-fill-color: transparent; } #header .gnb>li:hover .submenu {display:block;} #header .right { display: flex; flex-wrap:wrap; align-items: center; position: absolute; top: 50%; right:15px; transform: translate(0,-50%); } #header .top_login { margin-left: 20px; font-size: 16px; font-weight: 700; letter-spacing: -0.02em; color: #262626; } #header .top_join { display: flex; justify-content: center; align-items: center; width: 120px; height: 44px; margin-left: 40px; background: #1E51FF; border-radius: 10px; font-family: 'SUIT'; font-size: 16px; font-weight: 600; letter-spacing: -0.02em; color: #FFFFFF; font-style: normal; } #header .btn_top_cs { display: flex; justify-content: center; align-items: center; width: 120px; height: 44px; margin-left: 40px; background: #1E51FF; border-radius: 10px; font-family: 'SUIT'; font-size: 16px; font-weight: 600; line-height: 100%; letter-spacing: -0.02em; color: #FFFFFF; } #header .submenu {display:none; position:absolute; top:calc(100% - 12px); left:50%; width:max-content; background:#FFF; border-radius:12px; box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.15); transform:translateX(-50%);} #header .submenu .menu_list {padding:27px 32px;} #header .submenu .menu + .menu {margin-top:23px;} #header .submenu .menu a {height:auto; font-size:18px; text-align:center;} #header .submenu .menu a:hover {color:rgba(66, 66, 66, 0.5);} .head_search { float: right; position: relative; margin-top: 17px; border-bottom: 2px solid #000; font-size: 0; } .head_search select { width: 115px;; height: 44px; padding-left: 7px; background:url('/template/resp/images/ico_arr01.png') calc(100% - 12px) center no-repeat; border: none; font-size: 18px; color: #c5c5c5; } .head_search select:focus, .head_search select:hover { background-image: url('/template/resp/images/ico_arr01_on.png'); } .head_search input[type="text"] { width: 250px; height: 44px; padding-right: 40px; border: none; font-size: 18px; font-weight: 400; letter-spacing:-0.05em; color: #000; text-align: right; } .head_search input[type="text"]::placeholder { color: #000; } .head_search .division { content:''; display: inline-block; width: 1px; height: 18px; background: #d6e0e6; vertical-align: middle; } .head_search .btn_submit { position: absolute; right: 9px; bottom: 11px; width: 20px; height: 18px; background:url('/template/resp/images/ico_search.png') 0 0 no-repeat; font-size: 0; text-indent: -999em; } .m_top_util { display:none; } @media(max-width:1180px) { .m_top_util{display:block; } #header {height: 60px;justify-content: center;} #header .top_join, #header .top_login, #header .top_admin, #header .gnb, #header .top_mypage_wrap { display: none;} #header .logo {margin: 0 auto; } #header .logo a { display: flex; align-items: center; justify-content: center; } #header .logo a img {width: 32px;} .sub_page #header.down {box-shadow: none;} .head_search select {width: 92px; height: 35px; padding-left: 6px; background:url('/template/resp/images/ico_arr01.png') calc(100% - 10px) center no-repeat; font-size: 14px;} .head_search input[type="text"] {width: 200px; height: 35px; padding-right: 32px; font-size: 14px;} .head_search .division {width: 1px; height: 14px;} .head_search .btn_submit {right: 7px; bottom: 9px; width: 16px; height: 14px;} #header .right { right: 59px; } #header .btn_top_cs { width: 81px; height: 36px; border-radius:18px; font-size: 14px; } } .left_Box{position:fixed; top:0; left:-100%; width:78%; height:100%; min-width:250px; z-index:300; } .left_Box .nav_in{position:absolute; top:0; left:0; width:100%; height:100%; padding:60px 0 0 0; background:#fff; z-index:600; overflow-x:hidden; overflow-y:auto; } .left_Box .loginTop{width:100%; height:55px; padding:0 15px; background:#000; } .left_Box .loginTop:after{content:""; display:block; clear:both;} .left_Box .loginTop .login{ line-height:55px;float:left; } .left_Box .loginTop .login a{display:block; font-size:18px; line-height:55px; color:#fff;} .left_Box .loginTop .login a img{width:16px; margin-top:-4px; margin-right:4px; vertical-align:middle;} .left_Box .loginTop .myPage{ padding:15px 0;float:right; } .left_Box .loginTop .myPage a{display:block; width:28px;} .left_Box .loginTop .myPage a img{display:block; width:100%; } .left_Box ul.gnb_m{width:100%;} .left_Box ul.gnb_m li{width:100%;} .left_Box ul.gnb_m > li > a{display:block; position:relative; width:100%; padding:12px 45px 12px 15px; border-bottom:1px solid #eee; font-size:16px; font-weight:400; } .left_Box ul.gnb_m > li > a:hover {color:#000} .left_Box ul.gnb_m > li > a.activeOn + ul.depth_m{display:block; } .left_Box ul.gnb_m > li > a.depth_has:before{content:""; display:block; position:absolute; top:50%; right:15px; width:13px; height:1px; margin-top:-0.5px; background:#32186d;} .left_Box ul.gnb_m > li > a.depth_has:after{content:""; display:block; position:absolute; top:50%; right:15px; width:13px; height:1px; margin-top:-0.5px; background:#32186d; -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition:all .3s; -o-transition:all .3s; transition:all .3s; -webkit-transform: rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .left_Box ul.gnb_m > li > a.depth_has.active:after{ -webkit-transform: rotate(0); -moz-transform:rotate(0); -ms-transform:rotate(0); -o-transform: rotate(0); transform: rotate(0); } .left_Box ul.gnb_m > li > a.en{ font-weight:600;color:#ab0c24; } .left_Box ul.gnb_m ul.depth_m{display:none; width:100%; padding:15px 0; background:#f8f8f8; border-bottom:1px solid #eee;} .left_Box ul.gnb_m ul.depth_m li{width:100%;} .left_Box ul.gnb_m ul.depth_m li a{display:block; position:relative; width:100%; padding:8px 15px 8px 25px; font-size:14px; font-weight:400; } .left_Box ul.gnb_m ul.depth_m li a.active{ font-weight:600;color:#32186d;} .left_Box ul.gnb_m ul.depth_m li a:hover {color:#000;} .left_Box ul.gnb_m ul.depth_m li a:before{content:""; display:block; position:absolute; top:50%; left:15px; width:2px; height:2px; background:#000; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius:1px ; } .menuOpen { position:absolute; top:50%; right:15px; width: 30px; height: 21px; z-index: 600; transform: translate(0,-50%); } .menuOpen .line_wrap { position: absolute; top: 50%; left: 50%; width:30px; height:21px; transform: translate(-50%,-50%); } .menuOpen .line_wrap > span { display:block; position:absolute; left:0; width:100%; height:3px; background:#219eff; -webkit-border-radius:1px; -moz-border-radius:1px; border-radius:1px; -webkit-transition:all .5s; -moz-transition:all .5s; -ms-transition:all .5s; -o-transition:all .5s; transition:all .5s; -webkit-transform: rotate(0); -moz-transform:rotate(0); -ms-transform:rotate(0); -o-transform: rotate(0); transform: rotate(0); } .menuOpen .line_wrap > span.line1 { top:0; } .menuOpen .line_wrap > span.line2 { top:50%; -webkit-transform:translate3d(0,-50%,0); -moz-transform:translate3d(0,-50%,0); -ms-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0); } .menuOpen .line_wrap > span.line3 { bottom:0; } .menuOpen.active .line_wrap > span.line1 { top:50%; -webkit-transform:translate3d(0,-50%,0); -moz-transform:translate3d(0,-50%,0); -ms-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0); -webkit-transform: rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .menuOpen.active .line_wrap > span.line2 { width:0; } .menuOpen.active .line_wrap > span.line3 { top:50%; bottom:auto; -webkit-transform:translate3d(0,-50%,0); -moz-transform:translate3d(0,-50%,0); -ms-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0); -webkit-transform: rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .grdH{position:absolute; top:0; width:25px; height:100%; z-index:10;} .grdH.prevH{left:0;} .grdH.nextH{right:0;} .plus .grdH.nextH{right:30px; } .topFixedGnb{ display: none !important; width:100%; } .fixedGnbIn{position:fixed; top: 65px; left: 0; z-index: 150; width:100%; height:50px; background:#000;} /* .fixedGnbIn.fixed{position:fixed; top:0; left:0; z-index:150;} */ .fixedGnbIn.plus{padding-right:40px;} .fixedGnbIn.plus .backPlus{display:block; } .fixedGnbIn .backPlus{display:none; position:absolute; top:0; right:0; width:35px; height:100%; background:#774eef; z-index:30;} .fixedGnbIn .backPlus:before{content:""; display:block; position:absolute; top:50%; right:10px; width:13px; height:2px; margin-top:-1px; background:#fff; z-index:20;} .fixedGnbIn .backPlus:after{content:""; display:block; position:absolute; top:50%; right:10px; width:13px; height:2px; margin-top:-1px; background:#fff; z-index:20; -webkit-transform: rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .fixedGnbIn ul{ display:-webkit-inline-box; display:-webkit-inline-flex; display:inline-flex; -webkit-justify-content: space-between; justify-content: space-between;min-width:100%; -webkit-box-pack:justify; } .fixedGnbIn ul:before, .fixedGnbIn ul:after{content:""; display:block; clear:both;} .fixedGnbIn ul li{ position:relative; width: auto; } .fixedGnbIn ul li.active:after{content:""; display:block; position:absolute; bottom:-1px; left:50%; width:42px; height:4px; margin-left:-21px; background:#fff;} .fixedGnbIn ul li a{display:block; height:100%; padding:0 25px; font-size:16px; font-weight:500; line-height:50px; color:#fff; text-align:center; white-space: nowrap; } @media(max-width:1180px) { .topFixedGnb{display:block !important; } } #visual{background-color: #000;} #visual .main_visual{position:relative; width:100%; height:560px; margin:0 auto; } #visual .main_visual .slick-track, #visual .main_visual .slick-list{ overflow:hidden;width:100%; height:100%;} #visual .main_visual .slick-slide div{width:100%; height:100%;} #visual .main_visual .pic{position:relative; width:100%; height:100%;background-position: center center; -webkit-background-size: cover !important; background-size: cover !important;background-repeat: no-repeat; -webkit-transform:scale(1.05); -ms-transform:scale(1.05); -moz-transform:scale(1.05); -o-transform:scale(1.05); transform:scale(1.05); -webkit-transition:all 1.5s cubic-bezier(.58, .36, .84, .87); -moz-transition:all 1.5s cubic-bezier(.58, .36, .84, .87); -ms-transition:all 1.5s cubic-bezier(.58, .36, .84, .87); -o-transition:all 1.5s cubic-bezier(.58, .36, .84, .87); transition:all 1.5s cubic-bezier(.58, .36, .84, .87); } #visual .main_visual .slick-active .pic{ -webkit-transform:scale(1.0); -ms-transform:scale(1.0); -moz-transform:scale(1.0); -o-transform:scale(1.0); transform:scale(1.0); } #visual .main_visual a{height:100%;} #visual .main_visual .slick-arrow{position:absolute; top:50%; width:31px; height:60px; margin-top:-30px; padding:0; background-position: 0 0; -webkit-background-size: 100%; background-size:100%; background-repeat: no-repeat; background-color:rgba(0,0,0,0); border:none; font-size:0; z-index:20; cursor:pointer;} #visual .main_visual .slick-arrow.slick-prev{left:50px; background-image:url("../image/visualPrev.png");} #visual .main_visual .slick-arrow.slick-next{right:50px; background-image:url("../image/visualNext.png");} @media(max-width:1180px) { #visual .main_visual{height:auto;} #visual .main_visual .slick-slide > div {padding-bottom: 41.094%;font-size: 0;} #visual .main_visual .pic {position: absolute;} /* #visual .main_visual .slick-slide:before{content:""; display:block; position:absolute; top:0; left:0; z-index:300; width:100%; height:100%; background-color:rgba(0,0,0,0.8);} */ #visual .main_visual .slick-arrow{width:24px; height:46px; margin-top:-23px;} #visual .main_visual .slick-arrow.slick-prev{left:20px; } #visual .main_visual .slick-arrow.slick-next{right:20px; } } @media(max-width:767px) { } /* 슬라이드 기본 dot arrow */ .slick-arrow{position:absolute; padding:0; background-position: 0 0; -webkit-background-size:100%; background-size:100%; background-repeat: no-repeat; background-color:rgba(0,0,0,0); border:none; font-size:0; z-index:80; cursor:pointer;} .slick-dots{position:absolute; left:0; width:100%; font-size:0; text-align:center; } .slick-dots li{display:inline-block; *display:inline; *zoom:1; cursor:pointer;} .slick-dots li button{ width:100%; height:100%;margin:0; padding:0; font-size:0; } .col1{color:#e3052a;} .tit_txt_01{width:100%; margin-bottom:8%; padding:0 15px; font-size:40px; font-weight:300; color:#000; text-align:center;} .tit_txt_02{padding-bottom:5px; font-size:26px; font-weight:500; color:#000;} .tit_txt_02 span.cap{display:inline-block; padding-left:15px; font-size:18px; font-weight:300; color:#000; } @media(max-width:1080px) { .tit_txt_01{font-size:30px;} .tit_txt_02{font-size:22px;} .tit_txt_02 span.cap{padding-left:12px; font-size:16px;} } @media(max-width:767px) { .tit_txt_01{font-size:25px; } .tit_txt_02{font-size:18px; } .tit_txt_02 span.cap{display:block; padding-left:0; font-size:14px;} } .ico_condition{display:inline-block; height:22px; margin-right:5px; padding:1px 6px; font-size:15px; font-weight:600; line-height:22px; color:#fff; text-align:center; } .ico_condition:last-child{margin-right:0; } .bg_red01{background-color: #e3052a;} .bg_blue01{background-color: #00bbff;} .bg_black01{background-color: #000;} @media(max-width:1080px) { .ico_condition{height:20px; font-size:13px; line-height:20px; } } .main_sec{width:100%; } .main_sec01{padding:8% 0 12% 0; background: url("../image/bg_sec_01.jpg") center center no-repeat; -webkit-background-size:cover; background-size:cover;} .main_sec01 .tit_txt{padding-bottom:3%; font-size:50px; font-weight:600; color:#fff; text-align:center; } .main_sec01 .cap_txt{font-size:18px; font-weight:100; line-height:30px; color:rgba(255,255,255,0.6); text-align:center; } .main_sec01 ul.list_soliution{width:100%; padding:10% 0 0 0; font-size:0; text-align:center; } .main_sec01 ul.list_soliution li{display:inline-block; *display:inline; width:calc(100% / 4 - 20.1px); margin:0 10px; *zoom:1; } .main_sec01 ul.list_soliution li img{display:block; width:100%; } @media(max-width:1080px) { .main_sec01 .tit_txt{font-size:35px;} .main_sec01 .cap_txt{font-size:16px; line-height:28px;} .main_sec01 ul.list_soliution li{width:calc(100% / 4 - 10.01px); margin:0 5px; } } @media(max-width:767px) { .main_sec01 .tit_txt{font-size:25px;} .main_sec01 .cap_txt{font-size:14px; line-height:26px;} .main_sec01 ul.list_soliution li{width:calc(100% / 2 - 20.01px); max-width:250px; margin:0 10px; } } .main_sec02{padding:100px 0 150px 0;} .main_sec02 .tit_txt_01{position:relative; padding:0 150px; } .main_sec02 .tit_txt_01:before, .main_sec02 .tit_txt_01:after{content:""; display:block; position:absolute; top:50%; width:130px; height:1px; margin-top:-0.5px; background-color: #c8c8c8;} .main_sec02 .tit_txt_01:before{left:0; } .main_sec02 .tit_txt_01:after{right:0; } .main_sec02 ul.list_event{width:calc(100% + 13px); margin-left:-13px;} .main_sec02 ul.list_event:after{content:""; display:block; clear:both;} .main_sec02 ul.list_event li{ width:calc(100% / 4 - 13.01px); margin-left:13px;float:left; } .main_sec02 ul.list_event li a{display:block; position:relative; width:100%; } .main_sec02 ul.list_event .box_img{position:relative; width:100%; margin-bottom:20px; padding-top:100%; } .main_sec02 ul.list_event .box_img img{display:block; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;} .main_sec02 ul.list_event .box_txt{width:100%; padding:0 8px;} .main_sec02 ul.list_event .box_txt dt{ overflow:hidden;width:100%; padding-bottom:10px; font-size:20px; font-weight:500; color:#000; text-overflow:ellipsis; white-space:nowrap; } .main_sec02 ul.list_event .box_txt dd{height:72px; font-size:16px; font-weight:300; line-height:24px; color:#666;} .main_sec02 ul.list_event .obj_over{position:absolute; top:0; left:0; width:100%; height:100%; background:url("../image/obj_event_over.jpg") center center no-repeat; -webkit-background-size: cover; background-size:cover; opacity:0; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; transition: all .5s; -webkit-transform:scale(1,0); -moz-transform:scale(1,0); -ms-transform:scale(1,0); -o-transform:scale(1,0); transform:scale(1,0); -webkit-transform-origin:center top; -moz-transform-origin:center top; -ms-transform-origin:center top; -o-transform-origin:center top; transform-origin:center top; } .main_sec02 ul.list_event a:hover .obj_over{opacity:1; -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -ms-transform:scale(1,1); -o-transform:scale(1,1); transform:scale(1,1);} .main_sec02 ul.list_event .obj_over .in{position:absolute; top:50%; left:0; width:100%; padding:0 25px; text-align:center; -webkit-transform: translate3d(0,-50%,0); -moz-transform: translate3d(0,-50%,0); -ms-transform: translate3d(0,-50%,0); -o-transform: translate3d(0,-50%,0); transform: translate3d(0,-50%,0); } .main_sec02 ul.list_event .obj_over .in p{width:100%; margin-bottom:25px; font-size:30px; font-weight:100; color:#fff; } .main_sec02 ul.list_event .obj_over .in .btn_more{width:100%; height:42px; max-width:154px; margin:0 auto; border:1px solid #fff; font-size:13px; font-weight:300; line-height:40px; color:#fff; text-align:center; } @media(max-width:1080px) { .main_sec02 ul.list_event .box_txt dt{font-size:18px;} .main_sec02 ul.list_event .box_txt dd{height:66px; font-size:14px; line-height:22px;} .main_sec02 ul.list_event .obj_over{display:none; } } @media(max-width:767px) { .main_sec02{padding:80px 0 80px 0;} .main_sec02 .tit_txt_01{padding:0 40px;} .main_sec02 .tit_txt_01:before, .main_sec02 .tit_txt_01:after{width:30px;} .main_sec02 ul.list_event{width:100%; margin-left:0;} .main_sec02 ul.list_event li{width:calc(100% / 2 - 10.01px); margin:0 5px 25px; } .main_sec02 ul.list_event .box_img{margin-bottom:10px;} .main_sec02 ul.list_event .box_txt dt{padding-bottom:5px; } } .gray_area{width:100%; background:#fff url("../image/gd_bg.jpg") left 42% repeat-x;} .main_sec03{position:relative; padding:0 0 280px 0;} .slider_sample{position:relative; width:100%;} .slider_sample .slick-slide{ -webkit-transition: transform .5s; -moz-transition: transform .5s; -ms-transition: transform .5s; -o-transition: transform .5s; transition: transform .5s; } .slider_sample .slick-slide, .slider_sample .slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"]{ -webkit-transform: scale(0.7,0.7); -moz-transform:scale(0.7,0.7); -ms-transform: scale(0.7,0.7); -o-transform: scale(0.7,0.7); transform: scale(0.7,0.7); } .slider_sample .slick-center, .slider_sample .slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"]{ -webkit-transform: scale(0.9,0.9); -moz-transform:scale(0.9,0.9); -ms-transform: scale(0.9,0.9); -o-transform: scale(0.9,0.9); transform: scale(0.9,0.9); } .slider_sample .slick-slide a{display:block; position:relative; width:100%; padding-top:56%; } .slider_sample .slick-slide img{display:block; position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;} .slider_sample .slick-arrow{top:50%; width:18px; height:33px; margin-top:-16.5px;} .slider_sample .slick-arrow.slick-prev{left:25%; background-image:url("../image/btn_prev.png");} .slider_sample .slick-arrow.slick-next{right:25%; background-image:url("../image/btn_next.png");} .slider_sample .slick-dots{bottom:-14%; } .slider_sample .slick-dots li{width:12px; height:12px; margin:0 20px; } .slider_sample .slick-dots li button{background-color: #fff; border:1px solid #6d6d6d; border-radius:6px;} .slider_sample .slick-dots li.slick-active button{background-color: #030303; border:1px solid #030303;} @media(max-width:1080px) { .main_sec03{padding:0 0 180px 0;} .slider_sample .slick-arrow.slick-prev{left:12%;} .slider_sample .slick-arrow.slick-next{right:12%;} } @media(max-width:767px) { .main_sec03{padding:0 0 100px 0;} .slider_sample .slick-arrow{width:14px; height:26px; margin-top:-13px;} .slider_sample .slick-arrow.slick-prev{left:55px;} .slider_sample .slick-arrow.slick-next{right:55px;} .slider_sample .slick-dots li{margin:0 10px; } } @media(max-width:375px) { .slider_sample .slick-arrow.slick-prev{left:35px;} .slider_sample .slick-arrow.slick-next{right:35px;} } .main_sec04{position:relative; padding-bottom:15%; } ul.slider_teacher{width:calc(100% + 40px); margin-left:-40px; padding-top:40px; } ul.slider_teacher .slick-slide{margin:0 0 0 40px; } ul.slider_teacher .slick-slide a{display:block; width:100%;} ul.slider_teacher .slick-slide .imgD{width:100%; margin-bottom:25px;} ul.slider_teacher .slick-slide .imgD img{display:block; width:100%;} ul.slider_teacher .slick-slide p{padding-bottom:8px; font-size:18px; font-weight:400; } ul.slider_teacher .slick-slide p.name{position:relative; padding-bottom:35px;} ul.slider_teacher .slick-slide p.name:after{content:""; display:block; position:absolute; bottom:16px; left:0; width:67px; height:2px; background:#770ad2;} ul.slider_teacher .slick-slide p.name span{font-size:24px; font-weight:400;} ul.slider_teacher .slick-arrow{position:absolute; top:-45px; width:56px; height:56px; padding:0; background:#fff; border:1px solid #a4a4a4; font-size:0; z-index:20; cursor:pointer; opacity:0.3; filter:alpha(opacity=30); -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition:all .3s; } ul.slider_teacher .slick-arrow:hover{opacity:1; filter:alpha(opacity=100);} ul.slider_teacher .slick-arrow.slick-prev{right:55px; background:#fff url("../image/prev.png") center center no-repeat;} ul.slider_teacher .slick-arrow.slick-next{right:0; background:#fff url("../image/next.png") center center no-repeat;} @media(max-width:1080px) { ul.slider_teacher{width:calc(100% + 20px); margin-left:-20px;} ul.slider_teacher .slick-slide{margin:0 0 0 20px; } ul.slider_teacher .slick-slide .imgD{margin-bottom:15px;} ul.slider_teacher .slick-slide p{padding-bottom:6px; font-size:14px;} ul.slider_teacher .slick-slide p.name{padding-bottom:20px;} ul.slider_teacher .slick-slide p.name:after{bottom:10px; width:35px; height:2px;} ul.slider_teacher .slick-slide p.name span{font-size:18px;} ul.slider_teacher .slick-arrow{top:0; width:36px; height:36px; -webkit-background-size:100%; background-size:100%;} ul.slider_teacher .slick-arrow.slick-prev{right:35px; } ul.slider_teacher .slick-arrow.slick-next{right:0; } } .main_sec05{position:relative; padding:6% 0 10% 0; } .main_sec05 .in_Layer{position:relative; } .main_sec05 h3.reviewTitle{ display:inline-block; *display:inline;position:absolute; top:187px; left:0; font-size:26px; font-weight:100; color:#ff85a8; z-index:20; *zoom:1; transform: rotate(-90deg) translate(0,0); -webkit-transform: rotate(-90deg) translate(0,0); -moz-transform: rotate(-90deg) translate(0,0); transform-origin: left top; } .main_sec05 h3.reviewTitle b{font-weight:600; color:#fff; } .slider_review{ overflow:hidden;position:relative; width:calc(100% - 75px); margin-left:75px; padding-bottom:50px; z-index:30;} .slider_review ul.swiper-wrapper{} .slider_review li{padding:60px 30px; background-color: #fff; border:1px solid #ccc; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2) ; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2) ; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2) ; } .slider_review dl{width:100%;} .slider_review dl dt{padding-bottom:30px; font-size:18px; font-weight:600; color:#000;} .slider_review dl dd{font-size:16px; font-weight:100;} .slider_review dl dd.txt_area{height:90px; margin-bottom:40px; line-height:30px; color:#000; } .slider_review dl dd.data{color:#a0a0a0;} .slider_review .swiper-scrollbar1{position:absolute; bottom:0; left:0; width:100%; height:5px; background-color: #eaeaea;} .slider_review .swiper-scrollbar1 .swiper-scrollbar-drag{position:relative; top:0; left:0; width:100%; height:100%; background:#000;} .main_sec05 .grd_bg{position:absolute; top:0; right:45%; width:1180px; height:calc(100% + 80px); margin-left:0; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #774eef), color-stop(1, #e3052a)); background: -moz-linear-gradient(-45deg, #774eef 0%, #e3052a 100%); background: -webkit-linear-gradient(-45deg, #774eef 0%, #e3052a 100%); background: -o-linear-gradient(-45deg, #774eef 0%, #e3052a 100%); background: -ms-linear-gradient(-45deg, #774eef 0%, #e3052a 100%); background: linear-gradient(-45deg, #774eef 0%, #e3052a 100%); z-index:10; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#774eef', endColorstr='#e3052a', gradientType=1); } @media(max-width:1080px) { .main_sec05{padding:60px 0 8% 0; } .main_sec05 h3.reviewTitle{position:inherit; top:0; padding-bottom:20px; font-size:22px; transform: rotate(0) translate(0,0); -webkit-transform: rotate(0) translate(0,0); -moz-transform: rotate(0) translate(0,0); } .slider_review{width:100%; margin-left:0; padding-bottom:30px;} .slider_review li{padding:40px 20px;} .slider_review dl dt{padding-bottom:20px; font-size:16px;} .slider_review dl dd{font-size:14px;} .slider_review dl dd.txt_area{height:78px; margin-bottom:20px; line-height:26px; } .main_sec05 .grd_bg{right:45%; width:900px; } } @media(max-width:767px) { .main_sec05{padding:30px 0 15% 0; } .main_sec05 .grd_bg{right:25%; width:670px; height:calc(100% + 30px); } } .main_sec06{padding:150px 0 13% 0; background-color: #f7f7f7;} ul.slider_lecture{width:calc(100% + 28px); margin-left:-28px; padding-top:40px; } ul.slider_lecture .slick-slide{margin:0 0 0 28px; } ul.slider_lecture .slick-slide a{display:block; width:100%;} ul.slider_lecture .slick-slide .imgD{width:100%; margin-bottom:25px;} ul.slider_lecture .slick-slide .imgD img{display:block; width:100%;} ul.slider_lecture .slick-slide .box_txt{width:100%;} ul.slider_lecture .slick-slide .box_txt dt{ overflow:hidden;padding-bottom:5px; font-size:18px; font-weight:500; color:#000; text-overflow:ellipsis; white-space:nowrap; } ul.slider_lecture .slick-slide .box_txt dd.cap{padding-bottom:20px; font-size:18px; color:#666;} ul.slider_lecture .slick-slide .box_txt dd.box_price:after{content:""; display:block; clear:both;} ul.slider_lecture .slick-slide .box_txt dd.box_price .box_condition{ padding-bottom:5px; font-size:0;float:left; } ul.slider_lecture .slick-slide .box_txt dd.box_price .price{ font-size:18px; font-weight:500; color:#d70303;float:right;} ul.slider_lecture .slick-arrow{position:absolute; top:-45px; width:56px; height:56px; padding:0; background:#fff; border:1px solid #a4a4a4; font-size:0; z-index:20; cursor:pointer; opacity:0.3; filter:alpha(opacity=30); -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition:all .3s; } ul.slider_lecture .slick-arrow:hover{opacity:1; filter:alpha(opacity=100);} ul.slider_lecture .slick-arrow.slick-prev{right:55px; background:#fff url("../image/prev.png") center center no-repeat;} ul.slider_lecture .slick-arrow.slick-next{right:0; background:#fff url("../image/next.png") center center no-repeat;} @media(max-width:1080px) { ul.slider_lecture{width:calc(100% + 20px); margin-left:-20px;} ul.slider_lecture .slick-slide{margin:0 0 0 20px; } ul.slider_lecture .slick-slide .imgD{margin-bottom:15px;} ul.slider_lecture .slick-slide .box_txt dt{font-size:16px; } ul.slider_lecture .slick-slide .box_txt dd.cap{padding-bottom:15px; font-size:16px;} ul.slider_lecture .slick-slide .box_txt dd.box_price .price{font-size:16px;} ul.slider_lecture .slick-arrow{top:0; width:36px; height:36px; -webkit-background-size:100%; background-size:100%;} ul.slider_lecture .slick-arrow.slick-prev{right:35px; } ul.slider_lecture .slick-arrow.slick-next{right:0; } } @media(max-width:767px) { .main_sec06{padding:100px 0 16% 0; background-color: #f7f7f7;} ul.slider_lecture{width:calc(100% + 10px); margin-left:-10px;} ul.slider_lecture .slick-slide{margin:0 0 0 10px; } ul.slider_lecture .slick-slide .box_txt dd.cap{font-size:14px;} ul.slider_lecture .slick-slide .box_txt dd.box_price .price{font-size:14px;} } #contents .noS .slick-arrow{position:absolute; top:-45px; width:56px; height:56px; padding:0; background:#fff; -webkit-background-size: 100%; background-size:100%; border:1px solid #a4a4a4; font-size:0; z-index:20; cursor:pointer; opacity:0.3; filter:alpha(opacity=30); -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition:all .3s; } #contents .noS .slick-arrow:hover{opacity:1; filter:alpha(opacity=100);} #contents .noS .slick-arrow.slick-prev{right:55px; background:#fff url("/template/1/type1/images/prev.png") center center no-repeat;} #contents .noS .slick-arrow.slick-next{right:0; background:#fff url("/template/1/type1/images/next.png") center center no-repeat;} #contents .m_reviewArea{position:relative; width:100%; height:752px; margin-bottom:100px;} #contents .m_reviewArea:after{content:""; display:block; position:absolute; top:0; left:0; width:50%; height:752px; margin-left:-324px; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #8100d1), color-stop(1, #4247db)); background: -moz-linear-gradient(-30deg, #8100d1 0%, #4247db 100%); background: -webkit-linear-gradient(-30deg, #8100d1 0%, #4247db 100%); background: -o-linear-gradient(-30deg, #8100d1 0%, #4247db 100%); background: -ms-linear-gradient(-30deg, #8100d1 0%, #4247db 100%); background: linear-gradient(-30deg, #8100d1 0%, #4247db 100%); z-index:10; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8100d1', endColorstr='#4247db', gradientType=1); } #contents .m_reviewArea .in_Layer{position:relative; height:100%; z-index:140; } /* #contents .m_reviewArea .in_Layer:after{content:""; display:block; position:absolute; top:0; left:-374px; z-index:10; width:730px; height:752px; background:url("/template/1/type1/images/m4Bg.jpg") 0 0 no-repeat;} */ #contents .m_reviewArea h3.reviewTitle{ display:inline-block; *display:inline;position:relative; top:45px; left:-158px; font-size:26px; font-weight:100; color:#bbb9ff; z-index:20; *zoom:1; transform: rotate(-90deg) translate(0,0); -webkit-transform: rotate(-90deg) translate(0,0); -moz-transform: rotate(-90deg) translate(0,0); transform-origin: 100% 100%; } #contents .m_reviewArea h3.reviewTitle b{font-weight:600; color:#fff; } #contents .m_reviewArea .reviewSlider{position:relative; top:45px; padding-left:60px; z-index:100; } #contents .m_reviewArea .reviewSlider:before{content:""; display:block; position:absolute; top:0; left:0; width:333px; height:267px; background:#fff; z-index:1;} #contents .m_reviewArea .reviewB{position:relative; top:45px; left:60px; width:640px; padding:80px 60px; background:#2c2c2d url("/template/1/type1/images/conLogo.png") 92% 92% no-repeat; z-index:100;} #contents .m_reviewArea .reviewB:before{content:""; display:block; position:absolute; top:-57px; right:0; width:100px; height:57px; background:url("/template/1/type1/images/reviewshow.png") 0 0 no-repeat; -webkit-background-size: 100%; background-size:100%;} #contents .m_reviewArea .reviewB .slick-list{ overflow:hidden;width:100%; height:100%;} #contents .m_reviewArea .reviewB .slick-arrow{position:absolute; top:auto; right:-420px; bottom:0; } #contents .m_reviewArea .reviewB .slick-arrow.slick-prev{right:-365px;} #contents .m_reviewArea .reviewB .title{ overflow:hidden;width:100%; padding:0 0 50px 0; font-size:26px; font-weight:500; color:#fff; text-overflow:ellipsis; white-space:nowrap; } #contents .m_reviewArea .reviewB .area{ overflow:hidden; display:-webkit-box;width:100%; height:315px; margin-bottom:32px; font-size:18px; font-weight:100; line-height:24px; color:#666; white-space:normal; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:13; -webkit-box-orient: vertical; } #contents .m_reviewArea .reviewB .area span{font-size:100%; color:#978eff; } #contents .m_reviewArea .reviewB .caption{font-size:18px; color:#aaa;} #contents .m_reviewArea .reviewB .caption span.bul{display:inline-block; padding:0 8px; } #contents .m_reviewArea .reviewB .caption span.w{color:#fff; } #contents .m_reviewArea .reviewNav{ overflow:hidden;position:absolute; top:26px; left:268px; width:1330px; height:267px; background:#333;} #contents .m_reviewArea .reviewNav:before{content:""; display:block; position:absolute; top:0; left:0; width:333px; height:267px; background:#fff; z-index:1;} #contents .m_reviewArea .reviewNav .slick-list, #contents .m_reviewArea .reviewNav .slick-track, #contents .m_reviewArea .reviewNav .slick-slide div, #contents .m_reviewArea .reviewNav .slick-slide li{ overflow:hidden;height:100%;} #contents .m_reviewArea .reviewNav li{padding:6px 5px;} #contents .m_reviewArea .reviewNav li a{display:block; width:100%; height:100%; padding:95px 0; background: url("/template/1/type1/images/reviewNav.gif") 0 0 no-repeat; -webkit-background-size: 100%; background-size: 100%; font-size:18px; font-weight:100; color:#606060; text-align:center; } #contents .m_reviewArea .reviewNav li a span{display:block; font-size:100%; color:#978eff; } #contents .m_reviewArea .inTextBox{position:absolute; right:0; bottom:58px; width:425px; height:270px;} #contents .m_reviewArea .inTextBox .title{padding-bottom:28px; font-size:20px; font-weight:100; color:#141414; } #contents .m_reviewArea .inTextBox p{font-size:16px; font-weight:100; color:#141414;} #contents .m_reviewArea .inTextBox strong{font-size:20px; font-weight:500; color:#141414;} #contents .m_reviewArea .inTextBox .more{position:absolute; bottom:0; left:0; } #contents .m_reviewArea .inTextBox .more a{display:block; font-size:16px; font-weight:800; letter-spacing:-0.5px; color:#000; } #contents .m_reviewArea .inTextBox .more a img{display:inline-block; margin-left:8px; vertical-align:middle; } @media(max-width:1180px){ #contents .m_reviewArea{height:510px;} #contents .m_reviewArea h3.reviewTitle{top:0; left:0; color:#000; z-index:20; transform: rotate(0) translate(0,0); -webkit-transform: rotate(0) translate(0,0); -moz-transform: rotate(0) translate(0,0); } #contents .m_reviewArea h3.reviewTitle b{color:#000; } #contents .m_reviewArea:after{display:none; } #contents .m_reviewArea .reviewB{ top:45px;left:0; width:600px; padding:32px 30px; } #contents .m_reviewArea .reviewB:before{top:-42px; width:74px; height:42px;} #contents .m_reviewArea .reviewB .slick-arrow{right:auto; left:calc(100% + 70px); } #contents .m_reviewArea .reviewB .slick-arrow.slick-prev{right:auto; left:calc(100% + 10px); } #contents .m_reviewArea .reviewB .title{padding:0 0 40px 0; font-size:24px; font-weight:500; color:#fff; } #contents .m_reviewArea .reviewB .area{ height:242px;font-size:16px; -webkit-line-clamp:10; } #contents .m_reviewArea .reviewB .caption{font-size:16px;} #contents .m_reviewArea .reviewNav{top:37px; left:292px; width:1000px; height:202px; } #contents .m_reviewArea .reviewNav:before{width:250px; height:202px; } #contents .m_reviewArea .reviewNav li a{padding:68px 0; font-size:16px;} #contents .m_reviewArea .inTextBox{ right:15px;bottom:0; width:auto; height:auto; margin-top:0;} #contents .m_reviewArea .inTextBox .title{display:none;} #contents .m_reviewArea .inTextBox p{display:none;} #contents .m_reviewArea .inTextBox strong{display:none;} #contents .m_reviewArea .inTextBox .more{position:relative; padding:0; } } @media(max-width:920px){ #contents .noS .slick-arrow{width:45px; height:45px;} #contents .m_reviewArea .reviewB{width:500px; } #contents .m_reviewArea .reviewB .slick-arrow{left:calc(100% + 10px); } #contents .m_reviewArea .reviewB .slick-arrow.slick-prev{display:none !important; } #contents .m_reviewArea .reviewNav{left:192px;} #contents .m_reviewArea .inTextBox .more a img{display:block; margin:0; } } @media(max-width:680px){ #contents .noS .slick-arrow{width:40px; height:40px;} #contents .m_reviewArea{height:424px;} #contents .m_reviewArea h3.reviewTitle{ font-size:24px;} #contents .m_reviewArea .reviewB{width:calc(100% - 132px); } #contents .m_reviewArea .reviewB .slick-arrow{left:calc(100% + 5px); } #contents .m_reviewArea .reviewB .title{padding:0 0 30px 0; font-size:20px;} #contents .m_reviewArea .reviewB .area{ height:172px;font-size:14px; -webkit-line-clamp:7; } #contents .m_reviewArea .reviewB .caption{font-size:14px;} #contents .m_reviewArea .reviewNav{top:35px; right:0; left:auto; width:440px; height:178px; } #contents .m_reviewArea .reviewNav:before{width:220px; height:178px; } #contents .m_reviewArea .reviewNav li a{padding:60px 0; font-size:14px;} } @media(max-width:470px){ #contents .m_reviewArea{height:350px;} #contents .m_reviewArea .reviewB{width:calc(100% - 64px); -webkit-background-size: 130px; background-size:130px; } #contents .m_reviewArea .reviewB:before{top:-26px; width:46px; height:26px;} #contents .m_reviewArea .reviewB .slick-arrow{display:none !important; } #contents .m_reviewArea .reviewB .area{height:98px; -webkit-line-clamp:4; } #contents .m_reviewArea .reviewNav{top:50px; right:-95px;} #contents .m_reviewArea .reviewNav li a{padding:60px 0 60px 48px; text-align:left; } #contents .m_reviewArea .inTextBox{right:5px;} #contents .m_reviewArea .inTextBox .more a{font-size:14px; } } .dis_in{display:block; } #contents .mSec3{ overflow:hidden;position:relative; width:100%; margin-bottom:100px; padding:105px 0; background:#f2f2f2;} #contents .mSec3 > .in_Layer:after{content:""; display:block; clear:both;} #contents .mSec3 .textBox{ width:238px; padding-top:130px;float:left;} #contents .mSec3 .textBox strong{display:block; margin-bottom:15px; font-size:30px; font-weight:400; color:#000;} #contents .mSec3 .textBox p{font-size:16px; font-weight:400; } #contents .mSec3 .move1Slider{position:relative; width:942px; float:left;} #contents .mSec3 .move1Slider ul.movieB{ overflow:hidden;position:relative; width:702px; background:#fff; font-size:0; z-index:100;} #contents .mSec3 .move1Slider ul.movieB .slick-list{overflow:hidden; } #contents .mSec3 .move1Slider ul.movieB li a, #contents .mSec3 .move1Slider ul.movieB li img{display:block; width:100%;} #contents .mSec3 .move1Slider ul.movieNav{ overflow:hidden;position:absolute; top:50%; right:-394px; width:950px; font-size:0; -webkit-transform:translate(0,-50%); -moz-transform:translate(0,-50%); -ms-transform:translate(0,-50%); -o-transform:translate(0,-50%); transform:translate(0,-50%); } #contents .mSec3 .move1Slider ul.movieNav .slick-list{overflow:hidden;} #contents .mSec3 .move1Slider ul.movieNav .slick-list, #contents .mSec3 .move1Slider ul.movieNav .slick-track, #contents .mSec3 .move1Slider ul.movieNav .slick-slide div, #contents .mSec3 .move1Slider ul.movieNav .slick-slide li{height:100%;} #contents .mSec3 .move1Slider ul.movieNav li{padding:0 9px; cursor:pointer; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .mSec3 .move1Slider ul.movieNav li a, #contents .mSec3 .move1Slider ul.movieNav li img{display:block; width:100%; } #contents .mSec3 .move1Slider .sampleBtn{position:absolute; bottom:-52px; left:-35px; width:124px; z-index:100; } #contents .mSec3 .move1Slider .sampleBtn a, #contents .mSec3 .move1Slider .sampleBtn img{display:block; width:100%; } @media(max-width:1180px){ .dis_in{display:inline-block; } #contents .mSec3 .textBox{ width:100%; margin-bottom:25px; padding:0; text-align:center;float:none; } #contents .mSec3 .textBox strong{font-size:28px;} #contents .mSec3 .textBox p{font-size:14px;} #contents .mSec3 .move1Slider{left:-50px; width:640px; max-width:80%; margin:0 auto; float:none; } #contents .mSec3 .move1Slider ul.movieB{width:100%; } #contents .mSec3 .move1Slider ul.movieNav{right:-536px; width:800px; } } @media(max-width:780px){ #contents .mSec3 .textBox strong{margin-bottom:12px; font-size:25px;} #contents .mSec3 .move1Slider{left:0; max-width:70%; } #contents .mSec3 .move1Slider .sampleBtn{bottom:-42px; left:-25px; width:95px; } } @media(max-width:767px){ .re_dis_block{display:block; } #contents .mSec3{margin-bottom:50px; padding:60px 0; } #contents .mSec3 .tit_txt_01{margin-bottom:24px;} #contents .mSec3 .textBox strong{font-size:24px;} #contents .mSec3 .move1Slider{min-width:290px;} } .btn_search span {display: inline-block;width: 20px;height: 18px;margin-top: 1px;background:url('/template/resp/images/ico_search02.png') 0 0 no-repeat;font-size: 0;vertical-align: top;text-indent: -999em;} .btn_search.active span {background:url('/template/resp/images/ico_close.png') 0 0 no-repeat;} @media(min-width:1181px) { .head_search_bg.type_book {display: block!important} } @media(max-width: 1180px) { .m_top_util .btn_search {position: absolute;top: 23px;right: 50px;z-index: 600;} .head_search_bg.type_book {display: none;position: absolute;left: 0;width: 100%;background: #f3f8fe;border-top: 1px solid #ececec;border-bottom: 1px solid #ececec;z-index:400;} .type_book .head_search {float: none;width: 512px;height: 56px;margin:82px auto;background: #fff;border: 1px solid #dedede;} .type_book .head_search select { background: #fff; width: 124px; height: 54px; padding-left: 22px; font-size:16px; color: #000; } .type_book .head_search .btn_submit { position: static; float: right; top: 0; right: 0; width: 105px !important; height: 54px; padding-left: 26px; font-size: 16px; color: #000; text-indent: 0; background-position: 0 center; text-align: left; } .type_book .head_search input[type="text"] { text-align: left; width: 272px; height: 54px; padding:0 16px; font-size: 16px; } } @media(max-width: 767px) { .type_book .head_search {width: 448px;height:49px;max-width:90vw; margin:50px auto;} .type_book .head_search select {width: 108px;height: 47px;padding-left: 19px;font-size:14px;} .type_book .head_search .btn_submit {width: 31px !important;height: 47px;padding-left: 22px;font-size: 0} .type_book .head_search input[type="text"] {width: calc(100% - 140px);height: 47px;padding:0 14px;font-size: 14px;} } .head_search.mypage{ margin-bottom: 10px; border: 1px solid #dedede; } .head_search.mypage input[type="text"]{ text-align:left; } /* footer */ #footer { background:url('/USER_SKIN/whz24/images/foot_bg.png') center/cover no-repeat; letter-spacing: normal; font-family: "Noto Sans","Noto Sans KR"; } #footer .in_Layer { position: relative; max-width: 1680px; margin: 0 auto; padding: 0 20px; } #footer .topmove { display: flex; align-items: center; gap:12px; position: absolute; top: 80px; right:20px; font-size: 20px; font-weight: 800; color: #F8F8F8; } #footer .topmove .ico { } #footer .foot_info { display: inline-block; margin-top: 81px; vertical-align: top; } #footer .foot_info + .foot_info { margin-left: 42px; } #footer .foot_info .tit { display: block; font-size: 20px; font-weight: 800; line-height: 1; color: #F8F8F8; } #footer .foot_info .txt { margin-top: 15px; font-family: 'SUIT'; font-size: 16px; font-weight: 500; line-height: 32px; color: #D5D5D5; font-style: normal; } #footer .foot_info .txt strong { font-weight: 700; } #footer .foot_info .txt .divider { display: inline-block; vertical-align: middle; position: relative; top: -2px; width: 2px; height: 12px; margin: 0 7px; background: #262626; border-radius:2px; vertical-align: middle; } #footer .cs_number { display: flex; flex-wrap: wrap; align-items: center; gap:78px; margin-top: 72px; } #footer .cs_number > li { position: relative; } #footer .cs_number > li::after { content:''; position: absolute; top: 50%; right: -39px; width: 2px; height: 20px; background: #262626; border-radius:2px; transform: translate(0,-50%); } #footer .cs_number > li:last-child::after { display: none; } #footer .cs_number > li .tit { display: block; font-family: 'SUIT'; font-size: 16px; font-weight: 500; line-height: 1; line-height: 16px; color: #D5D5D5; } #footer .cs_number > li .num { display: block; margin-top: 14px; font-size: 26px; font-weight: 800; line-height: 1; color: #F8F8F8; } #footer .foot_bottom { display: flex; align-content: center; margin-top: 99px; padding: 32px 0 33px; border-top: 1px solid #262626; } #footer .foot_bottom .left { display: flex; flex-wrap: wrap; align-items: center; } #footer .foot_bottom .foot_logo { margin-right: 32px; } #footer .foot_bottom .foot_logo img { display: block; width: 64px; } #footer .foot_bottom .copy { font-family: 'SUIT'; font-size: 16px; font-weight: 500; line-height: 1; color: #4D4D4D; } #footer .foot_bottom .right { display: flex; flex-wrap:wrap; align-items: center; margin-left: auto; } #footer .foot_bottom .foot_menu { display: flex; align-items: center; gap:48px; } #footer .foot_bottom .foot_menu > li { position: relative; } #footer .foot_bottom .foot_menu > li::after { content:''; position: absolute; top: 50%; right:-24px; width: 2px; height: 12px; background: #262626; border-radius:2px; transform: translate(0,-50%); } #footer .foot_bottom .foot_menu > li:last-child::after { display: none; } #footer .foot_bottom .foot_menu > li a { font-family: 'SUIT'; font-size: 16px; font-weight: 600; color: #D5D5D5; } @media(max-width: 1180px) { #footer .topmove { gap: 10px; top: 64px; font-size: 16px; } #footer .topmove .ico { width: 19px; } #footer .foot_info { margin-top: 65px; } #footer .foot_info + .foot_info { margin-left: 34px; } #footer .foot_info .tit { font-size: 16px; } #footer .foot_info .txt { margin-top: 12px; font-size: 13px; line-height: 26px; } #footer .foot_info .txt .divider { height: 10px; margin: 0 6px; } #footer .cs_number { gap: 62px; margin-top: 58px; } #footer .cs_number > li::after { right: -31px; height: 16px; } #footer .cs_number > li .tit { font-size: 13px; } #footer .cs_number > li .num { margin-top: 11px; font-size: 21px; } #footer .foot_bottom { margin-top: 79px; padding: 26px 0 26px; } #footer .foot_bottom .foot_logo { margin-right: 26px; } #footer .foot_bottom .foot_logo img { width: 51px; } #footer .foot_bottom .copy { font-size: 13px; } #footer .foot_bottom .foot_menu { gap: 38px; } #footer .foot_bottom .foot_menu > li::after { right: -19px; height: 10px; } #footer .foot_bottom .foot_menu > li a { font-size: 13px; } } @media(max-width: 767px) { #footer { padding-top: 59px; } #footer .topmove { display: none; } #footer .foot_info { margin-top: 0; display: block; } #footer .foot_info + .foot_info { margin-left: 0; margin-top: 36px; } #footer .foot_info .tit { font-size: 14px; } #footer .foot_info .txt { margin-top: 12px; font-size: 12px; line-height: 24px; } #footer .foot_info .txt .divider { margin: 0 8px; top: -1px; } #footer .cs_number { gap:40px; margin-top: 115px; } #footer .cs_number > li::after { right: -20px; } #footer .cs_number > li .tit { font-size: 14px; } #footer .cs_number > li .num { margin-top: 12px; font-size: 20px; } #footer .foot_bottom { display: block; margin-top: 38px; padding: 47px 0 58px; } #footer .foot_bottom .foot_logo { margin-right: 12px; } #footer .foot_bottom .foot_logo img { width: 40px; } #footer .foot_bottom .copy { font-size: 10px; } #footer .foot_bottom .foot_menu { gap:24px; margin-top: 11px; } #footer .foot_bottom .foot_menu > li::after { right:-12px; } #footer .foot_bottom .foot_menu > li a { font-size: 12px; } }