#allWrap{position:relative; overflow:hidden;} /* 메인비주얼 */ @keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} } * { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body, html {cursor: none;/* width: 100%; *//* height: 100%; */overflow-x: hidden;position: relative;} svg{display: none;} /* 커서 */ .Cursor{pointer-events: none;position: fixed;display: block;border-radius: 0;transform-origin: center center;mix-blend-mode: difference;top: 0;left: 0;z-index: 1000;filter: url("#goo");} .Cursor span {position: absolute;display: block;width: 26px;height: 26px;border-radius: 20px;background-color: #fed12b82; transform-origin: center center;transform: translate(-50%, -50%);} /* mVisual */ #mVisual #wrapper{min-width: 0; width: 100%;} #mVisual .vis_wr{position: relative; border-radius: 40px; overflow: hidden; height: 875px; background: url("/images/main/visual-bg.png") center center; width: auto; box-shadow: inset 10px 0px 100px 0 rgb(0 0 0 / 3%); margin: 15px;} #mVisual .vis_wr .slo-1{position:absolute; left: 6%; top: 50%; transform:translateY(-50%);} #mVisual .vis_wr .slo-1 .mTit{} #mVisual .vis_wr .slo-1 .mTit > h1{font-weight: 300; font-size: 60px; color: #0f1b20;} #mVisual .vis_wr .slo-1 .mTit > h1 b{font-weight: 800;} #mVisual .vis_wr .slo-1 .mTit > h1 b.blue{color: #2b65fe;} #mVisual .vis_wr .slo-1 h2.sTit{margin-top: 60px; font-weight: 300; font-size: 30px; color: #0f1b20;} #mVisual .vis_wr .slo-1 h2.sTit b{font-weight: 700;} #mVisual .vis_wr .slo-1 > p{margin-top: 95px; font-family: 'Pretendard'; font-weight: 600; font-size: 24px; line-height: 1.3; color: #999;} #mVisual .vis_wr .slo-1 > p b{font-weight: 600; color: #0f1b20;} #mVisual .vis_wr .quick-1{position:absolute; right:0; bottom:0;} /* 메인_태그 클라우드 */ #mVisual .tags-cloud {position: absolute; top: calc(50% - 30vmin); left: calc(50% - 10vmin); height: 60vmin; width: 60vmin; list-style: none; opacity: 0;} #mVisual .tags-cloud.-loaded {animation: fadeIn 1s ease-out forwards;} #mVisual .tags-cloud > .tag {position: absolute;top: 50%;left: 50%;color:#002da3;font-size: 50px;width: 100%;font-family: 'Tenada';font-weight: bold;transition: transform .5s linear, opacity .5s linear;} #mVisual .tags-cloud > .tag > .wrap {display: inline-block; transform: translateX(-50%) translateY(-50%);} /* 메인_퀵메뉴 */ #mVisual .quick_wrap{position: fixed;top: 50%;right: -560px;transform:translateY(-50%);cursor:pointer;z-index: 1001;transition:0.4s;transition-timing-function: ease-out;} #mVisual .quick_wrap .quick:after{display:block; content:''; clear:both;} #mVisual .quick_wrap .quick .tit_box{width: 100px; height: 435px; top: 50%; transform: translateY(-50%); position: absolute; right: 554px; cursor:pointer; transition:0.4s; font-family: 'Paperlogy';} #mVisual .quick_wrap .quick .tit_box > div{position: relative;width: 100px;} #mVisual .quick_wrap .quick .con_box{position: relative; height: 100%; padding: 35px; background-color: #fff; background-image: url('../images/main/quick_color.png'); background-repeat: no-repeat; background-position: bottom; border-radius: 40px; box-shadow:5px 5px 25px 13px rgba(4,14,41,0.15);} #mVisual .quick_wrap .quick .con_box .cal_close_btn{position: absolute; top: 25px; right: 25px; width: 24px; height: 24px; opacity: .5; transition: all 0.4s ease;} #mVisual .quick_wrap .quick .con_box .cal_close_btn:hover{opacity: 1;} #mVisual .quick_wrap .quick .con_box .cal_close_btn img{width: 100%; filter: invert(99%) sepia(0%) saturate(1672%) hue-rotate(171deg) brightness(85%) contrast(90%);} #mVisual .quick_wrap .quick .con_box > img{max-width:100%;} #mVisual .quick_wrap .quick .tit_box .on p{transition:all 0.4s ease;} #mVisual .quick_wrap .quick .tit_box:hover .on p i{transform:scale(1.4); color:#2c65fd;} #mVisual .quick_wrap .quick .tit_box:hover .on p{color:#0f1b20;} #mVisual .quick_wrap .quick .tit_box .off > img{display:none;} #mVisual .quick_wrap.on{right: 15px;} #mVisual .quick_wrap.open{right: 15px;} #mVisual .quick_wrap.on .tit_box{right: 460px!important; z-index: -1;} #mVisual .quick_wrap .on p{font-size: 24px;text-transform: uppercase;white-space: nowrap;display: block;transform: rotate(90deg);transition:0.4s;} #mVisual .quick_wrap .on p:before{content:"";background: url("/images/main/quick_icon.png") no-repeat 0 50%/contain; width:35px;height:35px;position:absolute;transform: rotate(-90deg);top: -3px;left: -48px;} #mVisual .quick_wrap .on p i{position:absolute; color:#374359; font-size:40px;bottom:-5px; right:-210px; transform:translate(-0%, -0%);transition:0.4s;} #mVisual .quick_wrap.open .quick .tit_box div.on{display:none;} #mVisual .quick_wrap.open .quick .tit_box .off > img{display:block;} #mVisual .quick_wrap.on .quick .tit_box div.on{display:none;} #mVisual .quick_wrap.on .quick .tit_box .off > img{display:block;} #mVisual .quick_wrap .quick .tit_box > div.on{position: absolute; top: 0; right: 5px; width: 76px; height: 434px; background: #fff; border-radius: 20px 0 0 20px; box-shadow: -3px 0 15px rgba(0,0,0,.1);} #mVisual .quick_wrap .quick .tit_box > div.on::before{content: ''; position: absolute; top: -19px; right: 0; display: block; width: 20px; height: 20px; background: url('/images/main/outline_top.png') no-repeat 0 0/contain; z-index: 1;} #mVisual .quick_wrap .quick .tit_box > div.on::after{content: ''; position: absolute; bottom: -19px; right: 0; display: block; width: 20px; height: 20px; background: url('/images/main/outline_bottom.png') no-repeat 0 0/contain; z-index: 1;} #mVisual .quick_wrap .quick .tit_box > div.on p{position: absolute; top: 192px; right: -87px;} #mVisual .quick_wrap .on p i{right: -80px;} @media (max-width: 1600px){ #mVisual .vis_wr{height: 750px;} #mVisual .vis_wr .slo-1 .mTit > h1{font-size: 50px;} #mVisual .vis_wr .slo-1 h2.sTit{margin-top: 40px; font-size: 24px;} #mVisual .vis_wr .slo-1 > p{margin-top: 50px; font-size: 20px;} #mVisual .tags-cloud{left: auto; right: 17%; top: calc(50% - 26vmin); width: 400px; height: 400px; transform: scale(0.8);} } @media (max-width: 1200px){ #mVisual .vis_wr{height: 600px; border-radius: 20px;} #mVisual .vis_wr .slo-1 .mTit > h1{font-size: 40px;} #mVisual .vis_wr .slo-1 h2.sTit{margin-top: 35px; font-size: 22px;} #mVisual .vis_wr .slo-1 > p{margin-top: 45px; font-size: 18px;} #mVisual .tags-cloud{left: auto; right: 12%; top: calc(50% - 27vmin); transform: scale(0.6);} #mVisual .quick_wrap .on p{right: -75px; font-size: 20px;} #mVisual .quick_wrap .on p:before{top: 0; left: -36px; width: 24px; height: 24px;} #mVisual .quick_wrap .on p i{font-size: 25px; right: -35px; bottom: 0;} #mVisual .quick_wrap .quick .tit_box{top: 180px; width: auto; height: auto;} #mVisual .quick_wrap .quick .tit_box > div.on p{top: 156px; right: -75px;} #mVisual .quick_wrap .quick .tit_box > div.on{width: 60px; height: 334px;} #mVisual .quick_wrap .quick .con_box{border-radius: 25px;} } @media (max-width: 1000px){ #mVisual .vis_wr{height: 480px; border-radius: 15px;} #mVisual .vis_wr .slo-1 .mTit > h1{font-size: 32px;} #mVisual .vis_wr .slo-1 h2.sTit{margin-top: 30px; font-size: 20px;} #mVisual .vis_wr .slo-1 > p{margin-top: 35px; font-size: 17px;} #mVisual .tags-cloud{right: 0; top: 0; transform: scale(0.4);} #mVisual .quick_wrap{right: -480px;} #mVisual .quick_wrap .on p{font-size: 18px;} #mVisual .quick_wrap .on p:before{top: 1px; left: -30px; width: 18px; height: 18px;} #mVisual .quick_wrap .on p i{font-size: 20px; right: -30px; bottom: 0;} #mVisual .quick_wrap .quick .tit_box > div.on{right: -75px; width: 42px; height: 290px; border-radius: 15px 0 0 15px;} #mVisual .quick_wrap .quick .tit_box > div.on p{top: 136px; right: -70px;} #mVisual .quick_wrap .quick .con_box{padding: 30px 20px; border-radius: 20px;} } @media (max-width: 767px){ #mVisual .vis_wr{height: 480px; margin: 10px; border-radius: 12px;} #mVisual .vis_wr .slo-1{top: 200px; transform: translateY(0);} #mVisual .vis_wr .slo-1 .mTit > h1{font-size: 25px;} #mVisual .vis_wr .slo-1 h2.sTit{margin-top: 20px; font-size: 18px;} #mVisual .vis_wr .slo-1 > p{margin-top: 25px; padding-right: 40px; font-size: 16px;} #mVisual .tags-cloud{right: -10%; top: -38px; transform: scale(0.3);} #mVisual .quick_wrap{top: 20px; right: -340px; transform: translateY(0);} #mVisual .quick_wrap .quick .tit_box > div.on{right: -214px;} #mVisual .quick_wrap .quick .con_box .cal_close_btn{display: block;} } @media (max-width: 500px){ #mVisual .tags-cloud{right: -20%;} #mVisual .vis_wr .slo-1 .mTit > h1{font-size: 22px;} #mVisual .vis_wr .slo-1 h2.sTit{font-size: 16px;} #mVisual .vis_wr .slo-1 > p{font-size: 14px;} #mVisual .quick_wrap{padding: 0 0 0 10px;} #mVisual .quick_wrap.on{right: 0;} #mVisual .quick_wrap.open{right: 0;} #mVisual .quick_wrap .on p{font-size: 14px;} #mVisual .quick_wrap .on p:before{top: 0; left: -25px; width: 15px; height: 15px;} #mVisual .quick_wrap .on p i{font-size: 15px; right: -24px; bottom: 0;} #mVisual .quick_wrap .quick .tit_box > div.on{width: 36px; height: 212px;} #mVisual .quick_wrap .quick .tit_box > div.on p{top: 100px; right: -52px;} #mVisual .quick_wrap .quick .tit_box:hover .on p i{transform: scale(1);} #mVisual .quick_wrap .quick .con_box{padding: 20px 10px; border-radius: 15px 0 0 15px;} } /* 메인_스크롤 */ .scroll_wr{position: absolute; top: 620px; right: 6%; width: 154px; height: 154px; border-radius: 50%; background: #fff; box-shadow: 10px 10px 10px rgba(32,36,84,.18); text-align: center; line-height: 154px; transition:all 0.4s ease;} .scroll_wr::before{content: ''; position: absolute; top: calc(50% - 62px); left: calc(50% - 62px); display: block; width: 124px; height: 124px; background: url('../images/main/scroll_circle_txt.png') no-repeat 0 0/contain; animation: circle_tx 60s infinite linear; z-index: 0; transition:all 0.4s ease;} .scroll_wr img{display: inline-block; width: 38px; height: 38px; transition:all 0.4s ease;} @media (max-width: 1600px){ .scroll_wr{top: auto; bottom: 20px; right: 90px; width: 140px; height: 140px; line-height: 140px;} .scroll_wr::before{top: calc(50% - 55px); left: calc(50% - 55px); width: 110px; height: 110px;} .scroll_wr img{width: 34px; height: 34px;} } @media (max-width: 1200px){ .scroll_wr{right: 70px; width: 120px; height: 120px; line-height: 120px;} .scroll_wr::before{top: calc(50% - 48px); left: calc(50% - 48px); width: 96px; height: 96px;} .scroll_wr img{width: 32px; height: 32px;} } @media (max-width: 1000px){ .scroll_wr{display: none; width: 90px; height: 90px; line-height: 90px;} .scroll_wr::before{top: calc(50% - 39px); left: calc(50% - 39px); width: 78px; height: 78px;} .scroll_wr img{width: 24px; height: 24px;} } /* 퀵메뉴_캘린더 */ .quick_wrap{width: 100%; max-width: 560px;} .quick_wrap .sch_top{} .quick_wrap .sch_top .date_wrap{display: flex; justify-content: center; align-items: center; gap: 12px; margin-bottom: 15px;} .quick_wrap .sch_top .date_wrap button{background: none; border-radius: 0; border: 0;} .quick_wrap .sch_top .date_wrap button > a img{display: block; width: 36px; height: 36px; filter: invert(27%) sepia(20%) saturate(653%) hue-rotate(179deg) brightness(98%) contrast(81%);} .quick_wrap .sch_top .date_wrap button.prev_Btn{} .quick_wrap .sch_top .date_wrap button.next_Btn{} .quick_wrap .sch_top .date_wrap > h4.date{font-weight: 700; font-size: 22px;} .quick_wrap .sch_top .table_wr{} .quick_wrap .sch_top .table_wr .sunday{color: #007e9b;} .quick_wrap .sch_top .table_wr .saturday{color: #1959bf;} .quick_wrap .sch_top .table_wr table{width:100%; border:0; border-collapse:collapse; border-spacing:0; empty-cells:show; margin:0; padding: 0;} .quick_wrap .sch_top .table_wr table.t_list tbody td{} .quick_wrap .sch_top .table_wr table thead{min-height:51px;} .quick_wrap .sch_top .table_wr table tfoot{min-height:51px;} .quick_wrap .sch_top .table_wr table thead tr{} .quick_wrap .sch_top .table_wr table tfoot tr{} .quick_wrap .sch_top .table_wr table th{font-weight: 600; font-size: 18px; line-height: 1; color: #222; padding: 12px 5px; text-align: center;} .quick_wrap .sch_top .table_wr table th > label{font-weight:400; color: #1a1a1a;} .quick_wrap .sch_top .table_wr table tbody th{line-height:1; font-size:15px; font-weight:400; color:#1a1a1a; padding:18px 5px; text-align:center;} .quick_wrap .sch_top .table_wr table td{padding: 14px 20px; text-align: center;} .quick_wrap .sch_top .table_wr table td p{font-weight: 600; font-size: 14px; line-height: 1.6; color: #222;} .quick_wrap .sch_top .table_wr table td.today p{position: relative; margin-bottom: 6px; color: #fff; z-index: 0;} .quick_wrap .sch_top .table_wr table td.today p::before{content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 28px; height: 28px; border-radius: 50%; background: #2b65fe; z-index: -1;} .quick_wrap .sch_top .table_wr table td ul.evt_circle{display: flex; flex-wrap: wrap; justify-content: center; gap: 3px; /* width: 18px; */ margin: 0 auto;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li{} .quick_wrap .sch_top .table_wr table td ul.evt_circle li a{display: block; width: 6px; height: 6px; border-radius: 50%;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li:nth-child(1) a{background: #32cba5;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li:nth-child(2) a{background: #895ef6;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li:nth-child(3) a{background: #305dae;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li:nth-child(4) a{background: #4da1f7;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li.long a{width: 8px; height: 6px; border-radius: 0; clip-path: polygon(50% 0%, 0% 100%, 100% 100%);} .quick_wrap .sch_top .table_wr table td ul.evt_circle li.long:nth-child(1) a{background: #e0a300;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li.long:nth-child(2) a{background: #f03063;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li.long:nth-child(3) a{background: #ff7640;} .quick_wrap .sch_top .table_wr table td ul.evt_circle li.long:nth-child(4) a{background: #ca6419;} .quick_wrap .sch_bot{} .quick_wrap .sch_bot .tit_wr{display: flex; align-items: center; justify-content: space-between; padding: 20px 5px 12px; border-top: 1px solid #e2e2e2;} .quick_wrap .sch_bot .tit_wr h4{font-weight: 400; font-size: 22px; color: #333;} .quick_wrap .sch_bot .tit_wr h4 b{font-weight: 700;} .quick_wrap .sch_bot .tit_wr .arrow_box{display: flex; align-items: center; gap: 8px;} .quick_wrap .sch_bot .tit_wr .arrow_box button{background: none; border-radius: 50%; display: inline-block; width: 38px; height: 38px; padding-top: 2px; border: 1px solid #e9e9e9; text-align: center; transition: all 0.4s ease;} .quick_wrap .sch_bot .tit_wr .arrow_box button i{font-size: 24px; line-height: 1;} .quick_wrap .sch_bot .tit_wr .arrow_box button.sch_prev{} .quick_wrap .sch_bot .tit_wr .arrow_box button.sch_next{} .quick_wrap .sch_bot .tit_wr .arrow_box button:hover{border-color: #222;} .quick_wrap .sch_bot .tit_wr .arrow_box button:hover i{color: #2b65fe;} .quick_wrap .sch_bot .slide_wr{height: 200px; overflow-y: scroll;} .quick_wrap .sch_bot .slide_wr ul{} .quick_wrap .sch_bot .slide_wr ul li{margin-bottom: 10px;} .quick_wrap .sch_bot .slide_wr ul li a{position: relative; display: flex; justify-content: space-between; align-items: flex-start; height: 95px; padding: 15px; border-radius: 20px; background: #f3f4fd;} .quick_wrap .sch_bot .slide_wr ul li a span.type{display: inline-block; width: 84px; padding: 5px; border-radius: 10px; background: #0138c7; font-weight: 600; font-size: 14px; text-align: center; color: #fff;} .quick_wrap .sch_bot .slide_wr ul li a .txt_box{display: flex; flex-direction: column; justify-content: space-between; width: calc(100% - 84px); height: 100%; padding: 0 28px; text-align: left;} .quick_wrap .sch_bot .slide_wr ul li a .txt_box h5{height: 36px; font-weight: 600; font-size: 15px; color: #333; overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} .quick_wrap .sch_bot .slide_wr ul li a .txt_box p{font-weight: 400; font-size: 14px; color: #838383;} .quick_wrap .sch_bot .slide_wr ul li a img.more{position: absolute; top: 15px; right: 15px; width: 24px; height: 24px; opacity: .5; z-index: 1; transition:all 0.4s ease;} .quick_wrap .sch_bot .slide_wr ul li a:hover img.more{filter: invert(31%) sepia(92%) saturate(4327%) hue-rotate(223deg) brightness(107%) contrast(99%); opacity: 1;} .quick_wrap .sch_bot .slide_wr .slick-slide > div{margin: 0 5px 14px;} .quick_wrap .sch_bot .slide_wr .slick-slide > div:last-child{margin-bottom: 0;} @media (max-width: 1200px){ .quick_wrap .sch_bot .slide_wr{min-height: 210px;} } @media (max-width: 1000px){ .quick_wrap{max-width: 480px;} .quick_wrap .sch_top .table_wr table th{padding: 8px 5px; font-size: 14px;} .quick_wrap .sch_top .table_wr table td{padding: 12px 10px; } .quick_wrap .sch_top .table_wr table td p{font-size: 12px;} .quick_wrap .sch_top .date_wrap > h4.date{font-size: 18px;} .quick_wrap .sch_top .date_wrap button > a img{width: 28px; height: 28px;} .quick_wrap .sch_bot .tit_wr{padding: 15px 5px 10px;} .quick_wrap .sch_bot .tit_wr h4{font-size: 18px;} .quick_wrap .sch_bot .tit_wr .arrow_box{gap: 4px;} .quick_wrap .sch_bot .tit_wr .arrow_box button{width: 30px; height: 30px;} .quick_wrap .sch_bot .tit_wr .arrow_box button i{font-size: 18px;} .quick_wrap .sch_bot .slide_wr ul li a{display: block; height: auto; border-radius: 12px;} .quick_wrap .sch_bot .slide_wr ul li a span.type{width: auto; margin-bottom: 8px; padding: 5px; border-radius: 6px; font-size: 12px;} .quick_wrap .sch_bot .slide_wr ul li a .txt_box{width: 100%; padding: 0;} .quick_wrap .sch_bot .slide_wr ul li a .txt_box h5{margin-bottom: 5px; } .quick_wrap .sch_bot .slide_wr ul li a img.more{top: 12px; width: 16px; height: 16px;} .quick_wrap .sch_bot .slide_wr .slick-slide > div{margin: 0 5px 10px;} } @media (max-width: 757px){ .quick_wrap{max-width: 340px;} } /* 공통 */ .mTit_wr{} .mTit_wr h3.eng{position: relative; margin-bottom: 50px; padding-left: 26px; font-weight: 800; font-size: 22px; color: #2b65fe;} .mTit_wr h3.eng::before{content: ''; position: absolute; top: -34px; left: 0; display: block; width: 23px; height: 23px; border: 5px solid #2b65fe; border-radius: 50%; z-index: 0;} .mTit_wr h2.kor{font-weight: 700; font-size: 42px; line-height: 1.3; color: #111;} @media (max-width: 1600px){ .mTit_wr h3.eng{margin-bottom: 30px; padding-left: 18px; font-size: 20px;} .mTit_wr h3.eng::before{top: -12px; width: 12px; height: 12px; border: 3px solid #2b65fe;} .mTit_wr h2.kor{font-size: 34px;} } @media (max-width: 1200px){ .mTit_wr h2.kor{font-size: 28px;} .mTit_wr h3.eng{margin-bottom: 20px; padding-left: 12px; font-size: 16px;} .mTit_wr h3.eng::before{top: -6px; width: 8px; height: 8px; border: 2px solid #2b65fe;} } @media (max-width: 740px){ .mTit_wr h3.eng{margin-bottom: 12px; font-size: 14px;} .mTit_wr h2.kor{font-size: 24px;} } @media (max-width: 500px){ .mTit_wr h3.eng{padding-left: 12px; font-size: 12px;} .mTit_wr h3.eng::before{left: 0;} .mTit_wr h2.kor{font-size: 20px;} } @media (max-width: 400px){ .mTit_wr h2.kor{font-size: 18px;} } /* section01 : 지원 프로그램 */ #mProg{margin: 15px; padding: 125px 0 130px 6%; background: #f5f9ff; border-radius: 40px;} #mProg .top_wr{display: flex; justify-content: space-between; align-items: flex-end; gap: 50px; padding-right: 70px;} #mProg .top_wr .mTit_wr{width: 50%;} #mProg .top_wr .progress{display: block; width: 38%; height: 2px; margin: 0 auto 40px; overflow: hidden; background-color: #f0f0f0; margin-top: 15px; background-image: linear-gradient(to right, #2b65fe, #2b65fe); background-repeat: no-repeat; background-size: 0 100%; transition: background-size .4s ease-in-out;} #mProg .top_wr .sr-only{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;} #mProg .g-control{position: relative; display: block; margin-right: 40px; z-index:10;} #mProg .g-control .g-arrow{position: relative; display: flex; align-items: center; margin: 0; padding: 0; border: 0; transition: .3s; background: none; color: #222;} #mProg .g-control .g-arrow button{position: relative; display: flex; justify-content: center; align-items: center; width: 90px; height: 90px; text-align: center; line-height: 90px; background: none; border: 0; border-radius: 0; opacity: .3; transition:all 0.6s ease;} #mProg .g-control .g-arrow button::before{content: ''; position: absolute; top: 0; left: 0; display: block; width: 90px; height: 90px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='black' stroke-width='3' stroke-dasharray='2%2c 11' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e"); border-radius: 50%; z-index: 0;} #mProg .g-control .g-arrow button img{width: 36px; height: 36px; filter: invert(26%) sepia(6%) saturate(151%) hue-rotate(169deg) brightness(98%) contrast(83%); transition:all 0.6s ease;} #mProg .g-control .g-arrow button p{margin-top: 15px; font-weight: 600; font-size: 12px; letter-spacing: 1px; transition:all 0.6s ease;} #mProg .g-control .g-arrow button.btn-prev{margin-right: -12px;} #mProg .g-control .g-arrow button.btn-prev img{transform: scaleX(-1);} #mProg .g-control .g-arrow button.btn-next{} #mProg .g-control .g-arrow button:hover{transform: scale(1.1);} #mProg .g-control .g-arrow button:hover::before{animation: circle_tx 60s infinite linear;} #mProg .prog_wr{display: flex; justify-content: flex-end; margin-top: 50px;} #mProg .prog_wr .gall-cont{position: relative; width: 100%; height: 500px; display: flex; justify-content: flex-end; /* width: 1600px; height: 500px; */ margin-right: -150px;} #mProg .prog_wr .gall-cont .g-con{width: 100%; max-width: 1800px;} #mProg .prog_wr .m-gall{position:relative; width: 100%;} #mProg .prog_wr .m-gall .slick-list{display:block; margin-top:20px;} #mProg .prog_wr .m-gall .slick-list .slick-track{margin: 0 !important;} #mProg .prog_wr .m-gall .slick-active{margin-top:0;} #mProg .prog_wr .m-gall .slick-active + .slick-active{margin-top:60px;} #mProg .prog_wr .m-gall .slick-active + .slick-active + .slick-active{margin-top:0;} #mProg .prog_wr .m-gall .slick-active + .slick-active + .slick-active + .slick-active{margin-top:60px;} #mProg .prog_wr .m-gall .item{position:relative; margin-right: 35px; overflow: hidden; transition:.6s;} #mProg .prog_wr .m-gall .item a > span{display:block;} #mProg .prog_wr .m-gall .item a .item-img{position:relative; display:block; width:100%; height: 300px; overflow:hidden; border-radius: 40px; margin: 0; padding: 0; transition:all 0.4s ease; z-index: 0;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr{position: absolute; top: 16px; left: 16px; display: flex; align-items: center; gap: 6px; z-index: 1;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span{display: inline-block; padding: 15px; font-weight: 700; font-size: 16px; border-radius: 100px;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span.tag01{background: #fff; color: #111;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span.tag02{} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span.tag02.on{background: #e4007f; color: #fff;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span.tag02.off{background: #d5d5d5; color: #8a8a8a;} #mProg .prog_wr .m-gall .item a .item-img img{position: absolute; bottom: 0; left: 0; right: 0; top: 0; width:100%; height: auto; opacity:0; opacity:1; transition: transform 2s ease;} #mProg .prog_wr .m-gall .item a .item-img .link_wr{position: absolute; top: -5px; right: -5px; width: 130px; height: 130px; background: url('../images/main/Prog_white.png') no-repeat 0 0/contain; z-index: 1; transition:all 0.4s ease;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box{position: absolute; top: 24px; right: 24px; display: block; width: 54px; height: 54px; border: 1px solid #ca1c3b; border-radius: 50%; z-index: 1; transition:all 0.4s ease;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box::before{content:''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 20px; height: 20px; background: url('../images/main/Prog_link.png') no-repeat 0 0/contain; transition:all 0.4s ease;} #mProg .prog_wr .m-gall .item a .item-cont{margin-top: 30px; width:100%; opacity:.9;} #mProg .prog_wr .m-gall .item a > *{display:block; letter-spacing:-.3px;} #mProg .prog_wr .m-gall .item a .item-cont p.s_tit{display:block; font-weight: 700; font-size: 22px; letter-spacing: -0.5px; line-height: 1.4; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} #mProg .prog_wr .m-gall .item a .item-cont h3.ca-tit{display:block; margin-top: 20px; font-weight: 500; font-size: 16px; color: #5b6471; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} @media (min-width: 740px){ #mProg .prog_wr .m-gall .item a:hover .item-img img{transform: translate(0, -40%);} } @media (min-width: 500px){ #mProg .g-control .g-arrow button:hover{opacity:1;} #mProg .g-control .g-arrow button:hover img{-webkit-filter: none; filter: none;} #mProg .g-control .g-arrow button:hover p{color: #f29900;} #mProg .g-control .g-arrow button.btn-prev:hover, #mProg .g-control .g-arrow button.btn-next:hover{border-color: #f29900;} #mProg .prog_wr .m-gall .item a:hover .item-img .link_wr .arrow_box{background: #ca1c3b;} #mProg .prog_wr .m-gall .item a:hover .item-img .link_wr .arrow_box::before{background-image: url('../images/main/Prog_link_hover.png');} } @media (max-width: 1820px){ #mProg .prog_wr .gall-cont .g-con{max-width: 1600px;} } @media (max-width: 1600px){ #mProg{padding: 70px 0 40px 4%;} #mProg .top_wr{gap: 20px;} #mProg .g-control{padding: 60px 0 0 60px;} #mProg .g-control .g-arrow button{width: 80px; height: 80px; line-height: 80px;} #mProg .g-control .g-arrow button::before{width: 80px; height: 80px;} #mProg .g-control .g-arrow button img{width: 32px;} #mProg .prog_wr{margin-top: 20px;} #mProg .prog_wr .gall-cont{width: 1400px; margin-top: 40px;} #mProg .prog_wr .gall-cont .g-con{max-width: 1400px;} #mProg .prog_wr .m-gall .item{margin-right: 25px;} #mProg .prog_wr .m-gall .item a .item-img{height: 256px; border-radius: 20px;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr{gap: 4px;} #mProg .prog_wr .m-gall .item a .item-img .tag_wr > span{padding: 8px 12px; font-size: 14px;} #mProg .prog_wr .m-gall .item a .item-img .link_wr{width: 88px; height: 88px;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box{top: 18px; right: 18px; width: 35px; height: 35px;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box::before{width: 12px; height: 12px;} #mProg .prog_wr .m-gall .item a .item-cont{margin-top: 15px;} #mProg .prog_wr .m-gall .item a .item-cont p.s_tit{font-size: 18px;} #mProg .prog_wr .m-gall .item a .item-cont h3.ca-tit{margin-top: 10px; font-size: 15px;} } @media (max-width: 1200px){ #mProg{border-radius: 20px;} #mProg .top_wr{position: relative; display: block; padding-right: 162px;} #mProg .top_wr .mTit_wr{width: 100%;} #mProg .top_wr .progress{width: 100%; margin-top: 30px;} #mProg .g-control{position: absolute; top: 0; right: 0; margin-right: 20px; padding: 0;} #mProg .g-control .g-arrow button{width: 60px; height: 60px; line-height: 60px;} #mProg .g-control .g-arrow button::before{width: 60px; height: 60px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='black' stroke-width='3' stroke-dasharray='2%2c 5' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e");} #mProg .g-control .g-arrow button img{width: 24px;} #mProg .g-control .g-arrow button.btn-prev{margin-right: -8px;} #mProg .prog_wr{justify-content: flex-start;} #mProg .prog_wr .gall-cont{width: 1000px; margin-top: 0; margin-right: 0;} #mProg .prog_wr .gall-cont .g-con{max-width: 1000px;} #mProg .prog_wr .m-gall .slick-list{margin-top: 0;} #mProg .prog_wr .m-gall .item a .item-cont p.s_tit{font-size: 16px;} #mProg .prog_wr .m-gall .item a .item-cont h3.ca-tit{font-size: 14px;} } @media (max-width: 740px){ #mProg{overflow: hidden; padding: 50px 0 100px 40px; border-radius: 20px;} #mProg .top_wr{padding-right: 117px;} #mProg .top_wr .progress{margin: 20px auto 30px;} #mProg .g-control .g-arrow button{width: 45px; height: 45px; line-height: 45px;} #mProg .g-control .g-arrow button::before{width: 45px; height: 45px;} #mProg .g-control .g-arrow button img{width: 22px;} #mProg .prog_wr{margin-top: 0;} #mProg .prog_wr .gall-cont{margin-top: 0;} #mProg .prog_wr .m-gall .item{margin: 0 10px;} #mProg .prog_wr .m-gall .slick-active{margin-top:0;} #mProg .prog_wr .m-gall .slick-active + .slick-active{margin-top:0;} #mProg .prog_wr .m-gall .slick-active + .slick-active + .slick-active{margin-top:0;} #mProg .prog_wr .m-gall .slick-active + .slick-active + .slick-active + .slick-active{margin-top:0;} } @media (max-width: 540px){ #mProg{padding: 40px 20px 40px 20px; border-radius: 12px;} #mProg .top_wr{padding-right: 0;} #mProg .top_wr .progress{margin: 20px auto 15px;} #mProg .prog_wr .m-gall{width: 100%;} #mProg .prog_wr .m-gall .item{margin: 0 5px;} #mProg .prog_wr .gall-cont{width: 100%; height: 420px;} #mProg .prog_wr .gall-cont .g-con{max-width: none;} #mProg .g-control{position: relative; margin-right: 5px;} #mProg .g-control .g-arrow{justify-content: flex-end; margin-bottom: 15px;} } @media (max-width: 400px){ #mProg .g-control .g-arrow button img{width: 22px;} #mProg .g-control .g-arrow button p{display: none; } #mProg .prog_wr .m-gall .item a .item-img .link_wr{width: 78px; height: 78px;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box{width: 28px; height: 28px;} #mProg .prog_wr .m-gall .item a .item-img .link_wr .arrow_box::before{width: 10px; height: 10px;} #mProg .prog_wr .gall-cont{margin-top: 10px;} } /* section02 : 소식 */ #mNews{width: 100%; max-width: 1650px; margin: 0 auto; padding-top: 150px;} #mNews .top_wr{position: relative; margin-bottom: 65px;} #mNews .top_wr .v_more{position: absolute; bottom: -25px; right: 0; display: block; width: 200px; padding: 22px 0; border-bottom: 1px solid #000;} #mNews .top_wr .v_more a{display: flex; justify-content: space-between;} #mNews .top_wr .v_more a span{font-weight: 600; font-size: 18px; color: #2d2d2d;} #mNews .top_wr .v_more a .arrow{position: absolute; top: -26px; right: -42px; display: flex; justify-content: center; align-items: center; width: 115px; height: 115px; transition:all 0.6s ease;} #mNews .top_wr .v_more a .arrow::before{content: ''; position: absolute; top: 0; left: 0; display: block; width: 115px; height: 115px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='black' stroke-width='3' stroke-dasharray='2%2c 11' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e"); border-radius: 50%; opacity: .6; z-index: 0; transition:all 0.6s ease;} #mNews .top_wr .v_more a .arrow img{width: 36px; height: 36px; opacity: .6; transition:all 0.6s ease;} #mNews .top_wr .v_more a .arrow:hover{transform: scale(1.1);} #mNews .top_wr .v_more a .arrow:hover::before{opacity: 1; animation: circle_tx 60s infinite linear;} #mNews .top_wr .v_more a .arrow:hover img{opacity: 1;} #mNews .news_wr{} #mNews .news_wr .main-tab{display: flex; gap: 60px; margin-bottom: 40px;} #mNews .news_wr .main-tab li{position: relative; display: inline-block; padding: 12px 0; cursor: pointer; transition:all 0.6s ease;} #mNews .news_wr .main-tab li::before{content:''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 0; height: 4px; background: #2d2d2d; opacity: 0; transition:all 0.6s ease;} #mNews .news_wr .main-tab li span{font-weight: 600; font-size: 26px; letter-spacing: -0.4px; color: #7a7a7a; transition:all 0.6s ease;} #mNews .news_wr .main-tab li:hover::before{width: 100%; opacity: 1;} #mNews .news_wr .main-tab li:hover span{color: #2d2d2d;} #mNews .news_wr .main-tab li.active{border-color: #f29900;} #mNews .news_wr .main-tab li.active::before{width: 100%; opacity: 1;} #mNews .news_wr .main-tab li.active span{font-weight: 800; color: #2d2d2d;} #mNews .news_wr .news_list .main-tabcontent{position: relative; display: none;} #mNews .news_wr .news_list ul{display: flex; justify-content: space-between; border: 1px solid #d8d8d8; border-radius: 40px;} #mNews .news_wr .news_list ul li{position: relative; width: 25%; height: 310px; margin: 38px 0; border-right: 1px dotted #d8d8d8;} #mNews .news_wr .news_list ul li a{display: inline-block; padding: 0 50px;} #mNews .news_wr .news_list ul li:last-child{border-right: 0;} #mNews .news_wr .news_list ul li span{display: inline-block; margin-bottom: 15px; padding: 8px 12px; font-weight: 500; font-size: 17px; border-radius: 100px;} #mNews .news_wr .news_list ul li span.type01{background: #f7f6fc; color: #6a48ca;} #mNews .news_wr .news_list ul li span.type02{background: #f2fbff; color: #01b4ff;} #mNews .news_wr .news_list ul li h4.tit{display: block; font-weight: 700; font-size: 26px; color: #2d2d2d; overflow: hidden; text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} #mNews .news_wr .news_list ul li p.date{position: absolute; bottom: 0; left: 50px; font-weight: 600; font-size: 16px; color: #5d6572;} #mNews .btn_wr{display: flex; justify-content: space-between; gap: 30px; margin-top: 45px; padding-bottom: 70px;} #mNews .btn_wr > div{width: 50%;} #mNews .btn_wr .left{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 45px;} #mNews .btn_wr .left .box{overflow: hidden; position: relative; width: calc(50% - 23px); height: 385px; border-radius: 40px;} #mNews .btn_wr .left .box > a{display: block; width: 100%; height: 100%; padding: 45px;} #mNews .btn_wr .left .box span.menu{display: block; margin-bottom: 30px; font-weight: 500; font-size: 20px;} #mNews .btn_wr .left .box h4{position: relative; font-weight: 700; font-size: 32px; z-index: 1;} #mNews .btn_wr .left .box .deco{position: absolute; bottom: -40px; right: -24px; z-index: 0;} #mNews .btn_wr .left .box01{background: #407ff0;} #mNews .btn_wr .left .box01 > a{color: #fff;} #mNews .btn_wr .left .box01 > span.menu{color: #fff;} #mNews .btn_wr .left .box01 > h4{color: #fff;} #mNews .btn_wr .left .box01 > .deco img.circle{} #mNews .btn_wr .left .box01 > a:hover > .deco img.circle{-webkit-animation: flip-vertical-right 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; animation: flip-vertical-right 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; /* animation: up_down 3s infinite ease; */} #mNews .btn_wr .left .box02{padding: 65px 45px;} #mNews .btn_wr .left .box02 > h4{width: 100%; margin-bottom: 30px; font-size: 32px; text-align: center;} #mNews .btn_wr .left .box02 > h4 b{font-weight: 700; color: #407ff0;} #mNews .btn_wr .left .box02 > p{width: 100%; font-weight: 500; font-size: 17px; line-height: 1.5; color: #a3a3a3; text-align: center;} #mNews .btn_wr .left .box02 > a.btn{display: flex; justify-content: center; align-items: center; width: 210px; height: 60px; margin: 75px auto 0; padding: 0; border: 2px solid #ddd; border-radius: 100px; transition:all 0.6s ease;} #mNews .btn_wr .left .box02 > a.btn > span{display: inline-block; margin-right: 10px; font-weight: 600; font-size: 18px; line-height: 60px;} #mNews .btn_wr .left .box02 > a.btn > img{width: 24px; height: 24px; filter: invert(38%) sepia(90%) saturate(1760%) hue-rotate(205deg) brightness(99%) contrast(91%);} #mNews .btn_wr .left .box02 > a.btn:hover{border-color: #407ff0;} #mNews .btn_wr .left .box03{background: #d7e8ff;} #mNews .btn_wr .left .box03 .deco{bottom: 30px; right: 0; z-index: 0;} #mNews .btn_wr .left .box03 .deco img.half{position: absolute; bottom: 0; right: -10px; z-index: 0;} #mNews .btn_wr .left .box03 .deco img.dott{position: absolute; bottom: 0; right: 50px; z-index: -1;} #mNews .btn_wr .left .box03:hover .deco img.half{animation: left_move 3s infinite ease;} #mNews .btn_wr .left .box03:hover .deco img.dott{animation: circle_tx 60s infinite linear;} #mNews .btn_wr .left .box04{background: #f4f4f8;} #mNews .btn_wr .left .box04 .deco{bottom: 40px; right: -8px; z-index: 0;} #mNews .btn_wr .left .box04 .deco img{display: block;} #mNews .btn_wr .left .box04:hover .deco img.line01{animation: right_move 3s infinite ease;} #mNews .btn_wr .left .box04:hover .deco img.line02{animation: right_move 3s .4s infinite ease;} #mNews .btn_wr .left .box04:hover .deco img.line03{animation: right_move 3s .8s infinite ease;} #mNews .btn_wr .right{overflow: hidden; position: relative; border-radius: 40px; transition:all 0.6s ease;} #mNews .btn_wr .right::before{content: ''; position: absolute; top: 0; right: 0; display: block; width: 100%; height: 100%; background: url('../images/main/box_BG.jpg') no-repeat 50% 50%/cover; z-index: -1; transition:all 1s ease;} #mNews .btn_wr .right:hover::before{transform: scale(1.1);} #mNews .btn_wr .right > a{display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; width: 100%; height: 100%; padding: 60px 70px;} #mNews .btn_wr .right span.menu{display: block; margin-bottom: 74px; font-weight: 700; font-size: 24px; color: #fff;} #mNews .btn_wr .right h4{font-weight: 500; font-size: 24px; line-height: 1.4; color: #fff;} #mNews .btn_wr .right .info{} #mNews .btn_wr .right .info dl{display: inline-block; align-self: flex-end; margin-bottom: 10px;} #mNews .btn_wr .right .info dl dt{display: inline-block; margin-right: 20px; color: #fff;} #mNews .btn_wr .right .info dl dt img{padding-bottom: 8px;} #mNews .btn_wr .right .info dl dt span{} #mNews .btn_wr .right .info dl dd{display: inline-block; color: #fff;} #mNews .btn_wr .right .info dl.tel dt{} #mNews .btn_wr .right .info dl.tel dd{font-weight: 700; font-size: 60px; letter-spacing: -.2px;} #mNews .btn_wr .right .info dl.mail dd{font-weight: 700; font-size: 30px; letter-spacing: -.2px;} #mNews .btn_wr .right .info dl.time{width: 100%; margin-top: 20px;} #mNews .btn_wr .right .info dl.time dt{font-weight: 500; font-size: 19px;} #mNews .btn_wr .right .info dl.time dd{font-weight: 500; font-size: 19px;} @media (max-width: 1820px){ #mNews{padding: 50px 40px;} #mNews .top_wr .v_more{right: 6%;} } @media (max-width: 1600px){ #mNews .top_wr .v_more{right: 5%; bottom: -56px; width: 165px; padding: 15px 0;} #mNews .top_wr .v_more a span{font-size: 16px;} #mNews .top_wr .v_more a .arrow{width: 90px; height: 90px;} #mNews .top_wr .v_more a .arrow::before{width: 90px; height: 90px;} #mNews .top_wr .v_more a .arrow img{width: 30px; height: 30px;} #mNews .news_wr .main-tab{gap: 30px; margin-bottom: 20px;} #mNews .news_wr .main-tab li span{font-size: 22px;} #mNews .news_wr .news_list ul{border-radius: 20px;} #mNews .news_wr .news_list ul li{height: 240px; margin: 30px 0;} #mNews .news_wr .news_list ul li a{padding: 0 25px;} #mNews .news_wr .news_list ul li h4.tit{font-size: 22px;} #mNews .news_wr .news_list ul li span{font-size: 15px;} #mNews .news_wr .news_list ul li p.date{left: 25px; font-size: 14px;} #mNews .btn_wr .right{border-radius: 25px;} #mNews .btn_wr .right span.menu{margin-bottom: 50px; font-size: 20px;} #mNews .btn_wr .right h4{font-size: 22px;} #mNews .btn_wr .right > a{padding: 50px;} #mNews .btn_wr .right .info dl{display: block;} #mNews .btn_wr .right .info dl dt img{width: 20px;} #mNews .btn_wr .right .info dl.tel dd{font-size: 26px;} #mNews .btn_wr .right .info dl.mail dd{font-size: 22px;} #mNews .btn_wr .right .info dl.time dt{font-size: 17px;} #mNews .btn_wr .right .info dl.time dd{font-size: 17px;} #mNews .btn_wr .left{gap: 20px;} #mNews .btn_wr .left .box{width: calc(50% - 10px); height: 330px; border-radius: 25px;} #mNews .btn_wr .left .box > a{padding: 30px 25px;} #mNews .btn_wr .left .box span.menu{font-size: 17px;} #mNews .btn_wr .left .box h4{font-size: 26px;} #mNews .btn_wr .left .box02{padding: 55px 20px;} #mNews .btn_wr .left .box02 > h4{font-size: 28px;} #mNews .btn_wr .left .box02 > p{font-size: 16px;} #mNews .btn_wr .left .box02 > a.btn{width: 190px; height: 50px; margin: 30px auto 0;} #mNews .btn_wr .left .box02 > a.btn > span{font-size: 16px;} } @media (max-width: 1200px){ #mNews .top_wr .v_more{width: 140px; padding: 12px 0;} #mNews .top_wr .v_more a .arrow{top: -15px; right: -18px; width: 70px; height: 70px;} #mNews .top_wr .v_more a .arrow::before{width: 70px; height: 70px;} #mNews .top_wr .v_more a .arrow img{width: 24px; height: 24px;} #mNews .top_wr .v_more a span{font-size: 14px;} #mNews .news_wr .main-tab{gap: 22px;} #mNews .news_wr .main-tab li{padding: 10px 0;} #mNews .news_wr .main-tab li span{font-size: 20px;} #mNews .news_wr .news_list ul{border-radius: 15px;} #mNews .news_wr .news_list ul li{height: 200px; margin: 20px 0;} #mNews .news_wr .news_list ul li a{padding: 0 20px;} #mNews .news_wr .news_list ul li span{font-size: 14px;} #mNews .news_wr .news_list ul li h4.tit{font-size: 20px;} #mNews .news_wr .news_list ul li p.date{font-size: 13px;} #mNews .btn_wr{gap: 20px;} #mNews .btn_wr .right{border-radius: 15px;} #mNews .btn_wr .right > a{padding: 30px;} #mNews .btn_wr .right span.menu{margin-bottom: 30px; font-size: 17px;} #mNews .btn_wr .right h4{font-size: 18px;} #mNews .btn_wr .right .info dl{margin-bottom: 5px;} #mNews .btn_wr .right .info dl dt{margin-right: 10px;} #mNews .btn_wr .right .info dl dt img{width: 15px;} #mNews .btn_wr .right .info dl.tel dd{font-size: 22px;} #mNews .btn_wr .right .info dl.mail dd{font-size: 18px;} #mNews .btn_wr .right .info dl.time dt{font-size: 15px;} #mNews .btn_wr .right .info dl.time dd{font-size: 15px;} #mNews .btn_wr .left{gap: 15px;} #mNews .btn_wr .left .box{width: calc(50% - 8px); height: 245px; border-radius: 15px;} #mNews .btn_wr .left .box > a{padding: 25px;} #mNews .btn_wr .left .box span.menu{font-size: 15px; margin-bottom: 15px;} #mNews .btn_wr .left .box h4{font-size: 20px;} #mNews .btn_wr .left .box .deco{right: 15px;} #mNews .btn_wr .left .box .deco img{width: 90px;} #mNews .btn_wr .left .box02{padding: 32px 20px; border-radius: 25px;} #mNews .btn_wr .left .box02 > h4{margin-bottom: 20px; font-size: 22px;} #mNews .btn_wr .left .box02 > p{font-size: 15px;} #mNews .btn_wr .left .box02 > a.btn{width: 162px; height: 45px; margin: 20px auto 0;} #mNews .btn_wr .left .box02 > a.btn > span{font-size: 14px;} #mNews .btn_wr .left .box03 .deco{bottom: 16px;} #mNews .btn_wr .left .box03 .deco img.half{width: 80px;} #mNews .btn_wr .left .box03 .deco img.dott{width: 80px;} #mNews .btn_wr .left .box04 .deco{bottom: 20px;} } @media (max-width: 1000px){ #mNews .btn_wr{gap: 15px; margin-top: 30px;} #mNews .btn_wr .left{flex-direction: column;} #mNews .btn_wr .left .box{width: 100%; height: 128px;} #mNews .btn_wr .left .box span.menu{margin-bottom: 10px;} #mNews .btn_wr .left .box h4{padding-right: 40px; font-size: 18px;} #mNews .btn_wr .left .box h4 br{display: none;} #mNews .btn_wr .left .box .deco{bottom: 15px;} #mNews .btn_wr .left .box .deco img{width: 70px;} #mNews .btn_wr .left .box02{position: relative; height: auto; padding: 15px 20px; text-align: left;} #mNews .btn_wr .left .box02 h4{margin-bottom: 10px; text-align: left;} #mNews .btn_wr .left .box02 > p{font-size: 14px; text-align: left;} #mNews .btn_wr .left .box02 > a.btn{width: 154px; height: 40px; margin: 10px 0 0;} #mNews .btn_wr .left .box02 > a.btn > img{width: 18px; height: 18px;} #mNews .btn_wr .left .box02 > a.btn > span{line-height: 40px;} #mNews .btn_wr .left .box03 .deco{right: -18px;} #mNews .btn_wr .left .box03 .deco img.dott{width: 60px;} #mNews .btn_wr .left .box03 .deco img.half{right: 8px; width: 60px;} } @media (max-width: 740px){ #mNews h2.kor br{display: none;} #mNews .top_wr .v_more{width: 120px; padding: 8px 0;} #mNews .top_wr .v_more a .arrow{top: -8px; right: -5px; width: 50px; height: 50px;} #mNews .top_wr .v_more a .arrow::before{width: 50px; height: 50px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='black' stroke-width='3' stroke-dasharray='2%2c 8' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e");} #mNews .top_wr .v_more a .arrow img{width: 20px; height: 20px;} #mNews .news_wr .main-tab li{padding: 8px 0;} #mNews .news_wr .main-tab li::before{height: 2px;} #mNews .news_wr .main-tab li span{font-size: 18px;} #mNews .news_wr .news_list ul{flex-wrap: wrap;} #mNews .news_wr .news_list ul li{width: 100%; height: auto; margin: 0 20px; border-right: 0; border-bottom: 1px dotted #d8d8d8;} #mNews .news_wr .news_list ul li a{width: 100%; padding: 20px 0;} #mNews .news_wr .news_list ul li h4.tit{font-size: 18px;} #mNews .news_wr .news_list ul li p.date{position: relative; margin-top: 10px; left: auto;} #mNews .btn_wr{flex-direction: column;} #mNews .btn_wr > div{width: 100%;} #mNews .btn_wr .left{flex-direction: row; gap: 10px;} #mNews .btn_wr .left .box{width: calc(50% - 5px); height: 158px;} #mNews .btn_wr .left .box > a{padding: 25px 20px;} #mNews .btn_wr .left .box .deco img{width: 50px;} #mNews .btn_wr .left .box span.menu{font-size: 14px;} #mNews .btn_wr .left .box h4{font-size: 16px;} #mNews .btn_wr .left .box03 .deco{right: -32px;} #mNews .btn_wr .left .box03 .deco img.dott{width: 45px;} #mNews .btn_wr .left .box03 .deco img.half{right: 22px; width: 45px;} #mNews .btn_wr .right span.menu{margin-bottom: 15px; font-size: 14px;} #mNews .btn_wr .right h4{margin-bottom: 10px; font-size: 16px;} #mNews .btn_wr .right .info dl dt img{width: 13px;} #mNews .btn_wr .right .info dl.tel dd{font-size: 18px;} #mNews .btn_wr .right .info dl.mail dd{font-size: 15px;} #mNews .btn_wr .right .info dl.time{margin-top: 12px;} #mNews .btn_wr .right .info dl.time dt{font-size: 14px;} #mNews .btn_wr .right .info dl.time dd{font-size: 14px;} } @media (max-width: 500px){ #mNews{padding: 40px 20px;} #mNews .top_wr{margin-bottom: 80px;} #mNews .news_wr .main-tab{gap: 15px;} #mNews .news_wr .main-tab li span{font-size: 17px;} #mNews .news_wr .news_list ul li a{padding: 15px 0;} #mNews .news_wr .news_list ul li span{margin-bottom: 10px; font-size: 12px;} #mNews .news_wr .news_list ul li h4.tit{font-size: 16px;} #mNews .btn_wr .left .box{width: 100%; height: auto; border-radius: 12px;} #mNews .btn_wr .left .box h4{padding-right: 70px;} #mNews .btn_wr .right > a{padding: 25px 20px;} #mNews .btn_wr .right h4{font-size: 14px;} } @keyframes mymove{ from{transform:scale(1.1);} to{transform:scale(1);} } @keyframes left_move { 0{transform: translateX(0)} 50%{transform: translateX(-15px)} 100%{transform: translateX(0)} } @keyframes right_move { 0{transform: translateX(0)} 50%{transform: translateX(15px)} 100%{transform: translateX(0)} } @keyframes up_down { 0{transform: translateY(0)} 50%{transform: translateY(-15px)} 100%{transform: translateY(0)} } @keyframes circle_tx { 0{transform:rotate(0);} 50%{transform:rotate(360deg);} 100% {transform:rotate(0);} } .flip-vertical-right { -webkit-animation: flip-vertical-right 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; animation: flip-vertical-right 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both; } @keyframes flip-vertical-right { 0% { -webkit-transform: rotateY(0); transform: rotateY(0); } 100% { -webkit-transform: rotateY(180deg); transform: rotateY(180deg); } } /* 메인 타이틀 */ #allWrap .m-tit{position:relative; text-align:left; z-index:10;} #allWrap .m-tit small{letter-spacing:.5px; padding-left:20px; text-transform:uppercase; line-height:1; margin-bottom:15px; position:relative; font-size:17px; font-weight:600; color:#7141b1; display:inline-block;} #allWrap .m-tit small:before{letter-spacing:-2px; content:"//"; position:absolute; left:0; top:0; display:inline-block; font-size:17px; font-weight:300; color:#7141b1;} #allWrap .m-tit big{font-size:50px; line-height:1; font-weight:700; color:#1b1d21; display:block; text-transform:uppercase;} #allWrap .m-tit small{opacity:0; transform:translateY(20px);} #allWrap .in-view .m-tit small{opacity:1;transform:translateY(0px); transition:all 0.4s ease;} #allWrap .m-tit big{opacity:0; transform:translateY(40px);} #allWrap .in-view .m-tit big{opacity:1; transform:translateY(0px); transition:all 0.8s ease;} @media (max-width: 1280px){ #allWrap .m-tit{text-align:center;} } @media (max-width: 767px){ #allWrap .m-tit big{font-size:42px;} } @media (max-width: 520px){ #allWrap .m-tit small{font-size:16px; margin-bottom:10px;} #allWrap .m-tit big{font-size:34px;} } /* 하단 */ footer{width: 100%; max-width: 1650px; margin: 0 auto;} footer > article{display: flex; justify-content: space-between;} footer .ft-left{} footer .ft-left .ft-info{} footer .ft-left .ft-info .ft-logo{margin-bottom: 45px;} footer .ft-left .ft-info .ft-logo img{width: 345px; height: 70px;} footer .ft-left .ft-cont{display: flex; flex-wrap: wrap;} footer .ft-left .ft-cont dl{display: flex;} footer .ft-left .ft-cont dl + dl{margin-right: 45px;} footer .ft-left .ft-cont dl dt{margin-right: 12px; font-weight: 500; font-size: 16px; color: #a4a9af;} footer .ft-left .ft-cont dl dd{font-weight: 500; font-size: 16px;} footer .ft-left .ft-cont dl.addr{width: 100%; margin-bottom: 25px;} footer .ft-left .ft-cont dl.addr dd{font-size: 16px;} footer .ft-right{margin-top: 65px; text-align: right;} footer .ft-right .select_footer{position: relative;width:270px;height:52px;z-index:10;text-align:left;} footer .ft-right .select_footer ul{position: absolute; bottom: 62px; display: none; width: 270px; border-radius: 10px; border : 0; background: #fff; transition: .3s; backdrop-filter : blur(3px); z-index: 999; } footer .ft-right .select_footer ul.open{display:block; padding: 14px 0; background: rgba(72,147,254,.9);} footer .ft-right .select_footer ul li{color: #bebebe; text-indent:25px;} footer .ft-right .select_footer ul li a{display:block; font-size:16px; color: #fff; padding: 7px 0; opacity: .7; transition:all 0.4s ease;} footer .ft-right .select_footer ul li a:hover{opacity: 1;} footer .ft-right .select_footer button.select_f_btn{border: 0; display: block; width: 270px; height: 52px; border-radius: 100px; text-align: left; padding: 0 25px; font-size: 16px; background: none; border: 1px solid #dde1e6; color: #878d96; letter-spacing: -.5px; font-weight: 600;} footer .ft-right .select_footer button.select_f_btn span.ir{width: 100%; display: flex; height: 100%; align-items: center; justify-content: space-between; transition:all 0.4s ease;} footer .ft-right .select_footer button.select_f_btn span.ir i{font-size:22px;color: #878d96;font-weight: normal;} footer .ft-right .select_footer button.select_f_btn.on span.ir i{transform: rotate(45deg);} footer .ft-right .sns_wr{margin-top: 20px;} footer .ft-right .sns_wr a{display: inline-block; width: 32px; height: 32px; margin-left: 5px; text-align: center; line-height: 30px; border-radius: 50%; background: #878d96;} footer .ft-right .sns_wr a img{display: inline-block;} footer .copyright{display: flex; align-items: center; justify-content: space-between; margin-top: 86px; padding: 28px 50px; background: #001970; border-radius: 30px 30px 0 0;} footer .copyright cite{font-weight: 500; font-size: 14px; font-style: normal; color: #fff;} footer .copyright cite b{font-weight: 500; color: #407ff0;} footer .copyright cite a{color: #fff;} footer .copyright ul{display: flex; gap: 40px;} footer .copyright ul li{} footer .copyright ul li a{font-weight: 600; font-size: 16px; color: #fff;} @media (max-width: 1820px){ footer{padding: 0 80px;} } @media (max-width: 1400px){ footer .ft-left .ft-info .ft-logo{margin-bottom: 30px;} footer .ft-left .ft-info .ft-logo img{width: 250px; height: 50px;} footer .ft-right .select_footer{width: 220px; height: 42px;} footer .ft-right .select_footer button.select_f_btn{width: 220px; height: 42px; padding: 0 20px; font-size: 14px;} footer .ft-right .select_footer ul{width: 220px;} footer .ft-right .select_footer ul.open{padding: 10px 0;} footer .ft-right .select_footer ul li{text-indent: 15px;} footer .ft-right .select_footer ul li a{font-size: 14px;} footer .ft-right .sns_wr a{width: 30px; height: 30px; line-height: 30px;} footer .ft-right .sns_wr a img{width: 12px;} footer .ft-right .sns_wr a:nth-child(3) img{width: 8px;} footer .ft-left .ft-cont dl{width: 100%;} footer .ft-left .ft-cont dl.addr{margin-bottom: 20px;} footer .ft-left .ft-cont dl.mail{margin-top: 10px;} footer .copyright{margin-top: 40px; padding: 25px; border-radius: 20px 20px 0 0;} footer .copyright cite{font-size: 12px;} footer .copyright ul{gap: 20px;} footer .copyright ul li a{font-size: 12px;} } @media (max-width: 1000px){ footer{padding: 0 50px;} footer .ft-left .ft-info .ft-logo{margin-bottom: 20px;} footer .ft-left .ft-info .ft-logo img{width: 210px; height: 42px;} footer .ft-left .ft-cont dl dt{margin-right: 8px; font-size: 14px;} footer .ft-left .ft-cont dl dd{font-size: 14px;} footer .ft-left .ft-cont dl.addr{margin-bottom: 10px;} footer .ft-left .ft-cont dl.addr dd{font-size: 14px;} footer .ft-right{margin-top: 40px;} footer .ft-right .select_footer{width: 194px; height: 38px;} footer .ft-right .select_footer ul{bottom: 48px; width: 194px; border-radius: 6px;} footer .ft-right .select_footer ul li a{padding: 5px 0;} footer .ft-right .select_footer button.select_f_btn{width: 194px; height: 38px; font-size: 12px;} footer .ft-right .select_footer button.select_f_btn span.ir i{font-size: 18px;} footer .copyright{flex-wrap: wrap; justify-content: center; padding: 15px 20px;} footer .copyright cite{width: 100%; text-align: center;} footer .copyright ul{justify-content: center; gap: 15px; width: 100%; margin-top: 15px;} } @media (max-width: 740px){ footer > article{flex-wrap: wrap;} footer .ft-left, footer .ft-right{width: 100%;} footer .ft-right{margin-top: 20px;} footer .ft-left .ft-info .ft-logo{margin-bottom: 15px;} footer .ft-left .ft-info .ft-logo img{width: 185px; height: 38px;} footer .ft-right .sns_wr{margin-top: 10px;} } @media (max-width: 500px){ footer{padding: 0 20px;} footer .copyright{border-radius: 15px 15px 0 0;} footer .copyright ul{flex-wrap: wrap; row-gap: 8px;} }