@charset "utf-8";
@import url("font.css");

/* Default Layout */
#wrap {width:100%; height: 100%;}

/*메뉴*/
.toparea .topmenu {z-index: 9999; display: flex; display:-webkit-flex; justify-content: right; position: absolute; left: 0; top: 0; width: 100%; background: url('../../images/hmpg/bg_topmenu.png') repeat-x center 97px;}
.toparea .topmenu h1 {z-index: 900; position: absolute; top: 33px; left: calc((100% - 1200px)/2 + 25px);}
.toparea .topmenu h1 a {display: block; width: 179px; height: 34px; background: url('../../images/hmpg/logo.png') no-repeat;}
.toparea .topmenu .gnb {margin: 0 auto; display: flex; display:-webkit-flex; padding-left: 230px; width: 1200px;}
.toparea .topmenu .gnb > li {width: 220px; text-align: center; cursor: pointer;}
.toparea .topmenu .gnb > li > a {padding: 0 30px; transition: none; position: relative; display: block; line-height: 98px; font-size: 22px; font-weight: 500; text-align: left; color: #fff; font-family: 'SCDream', sans-serif;}
.toparea .topmenu .gnb > li:nth-child(1) > a {text-align: center;}
.toparea .topmenu .gnb > li:nth-child(2) > a {text-align: center;}
.toparea .topmenu .gnb > li:nth-child(3) > a {text-align: center;}
.toparea .topmenu .gnb > li:nth-child(4) > a {padding: 0 40px;}
.toparea .topmenu .gnb > li:hover {background-color: #f4f7ff; color: #2656f6;}
.toparea .topmenu .gnb > li:hover > a {background: url('../../images/hmpg/bg_topmenu_active.png') repeat-x center 97px;}
.toparea .topmenu .gnb > li .menu_list {display: none; margin-top: 0px !important; padding: 10px 0 50px !important; width: 100%; height: auto !important; text-align: left;}
.toparea .topmenu .gnb > li .menu_list > li {display: none; margin-bottom: 10px;}
.toparea .topmenu .gnb > li .menu_list > li:last-child {margin-bottom: 0;}
.toparea .topmenu .gnb > li .menu_list > li.active {position: relative;}
.toparea .topmenu .gnb > li .menu_list > li > a {padding: 0 20px; display: block; width: 100%; height: 34px; line-height: 32px; font-size: 16px; font-weight: 500; letter-spacing: -1px; color: #222;}
.toparea .topmenu .gnb > li .menu_list > li > a:hover,
.toparea .topmenu .gnb > li .menu_list > li.active > a {color: #fff; background-color: #2656f6;}
.toparea .topmenu .gnb > li .menu_list > li > a .icon {display: none; position: absolute; top: 8px; right: 20px; width: 15px; height: 15px;}
.toparea .topmenu .gnb > li .menu_list > li > a .icon::after, 
.toparea .topmenu .gnb > li .menu_list > li > a .icon::before {content: ''; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: 2px; background-color: #fff;}
.toparea .topmenu .gnb > li .menu_list > li > a .icon::before {transform: rotate(90deg);}
.toparea .topmenu .gnb > li .menu_list > li.active a .icon {display: block;}
.toparea .topmenu .gnb > li .menu_list > li.active a .icon::before {transform: rotate(0deg);}
.toparea .topmenu .gnb > li .menu_list > li > .menu_list_s {display: none !important; height: auto !important; padding: 10px 40px 0;}
.toparea .topmenu .gnb > li .menu_list > li.active > .menu_list_s {display: block !important;}
.toparea .topmenu .gnb > li .menu_list > li > .menu_list_s li a {font-weight: 500;}
.toparea .topmenu .gnb > li .menu_list > li > .menu_list_s li a:hover {color: #2656f6;}
.toparea .topmenu .gnb > li .menu_list > li > .menu_list_s li.active a {color: #2656f6;}
.toparea .topmenu.active {background: #fff url('../../images/hmpg/bg_topmenu_active.png') repeat-x center 97px; box-shadow: 0 16px 16px -16px #ccc;}
.toparea .topmenu.active h1 a {background: url('../../images/hmpg/logo_active.png') no-repeat;}
.toparea .topmenu.active .gnb > li > a {color: #222;}
.toparea .topmenu.active .gnb > li:hover > a {color: #2656f6;}
.toparea .topmenu.active .gnb > li .menu_list > li {display: block;}
.toparea .topmenu .btn_allgnb {display: none;}
.toparea .allmenu-category {display: none !important;}
.toparea .allmenu-category .membership {display: none;}

/*메인메뉴*/
.maincontents {padding: 100px 0 0;}
#main .toparea .topmenu {top: 81px; background: #fff;}
#main .toparea .topmenu.active {background: #fff url('../../images/hmpg/bg_topmenu_active.png') repeat-x center 97px;}
#main .toparea .topmenu h1 a {background: url('../../images/hmpg/logo_active.png') no-repeat;}
#main .toparea .topmenu .gnb > li > a {color: #222;}

/*topbar*/
.topbar {background-color: #f4f7ff; border-bottom: 1px solid #c5d2ff;}
.topbar .d_area {height: 80px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.topbar .d_area .topbar_text {padding-left: 60px; width: calc(100% - 100px); background: url('../../images/hmpg/icon_main_topbar_speaker.png') no-repeat;}
.topbar .d_area .topbar_text a {display: block; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: 'SCDream', sans-serif;}
.topbar .d_area .topbar_logo {width: 82px; height: 24px; background: url('../../images/hmpg/icon_main_topbar_logo.png') no-repeat center / auto 100%;}

/*search_fixed*/
.search_fixed {box-shadow: 0 0 8px 0 #eee; position: fixed; top: 0; left: 0; width: 100%;  background-color: #fff; border-bottom: 1px solid #2656f6; z-index: 9999; transition: transform 0.3s linear; will-change: transform;}
.search_fixed:not(.on) {transform: translateY(-200%);}
.search_fixed .search {height: 80px; position: relative; display: flex; display:-webkit-flex; justify-content: center; align-items: center;}
.search_fixed .search h1 {margin-right: 30px; width: 125px; height: 24px;}
.search_fixed .search h1 .search_logo {display: block; width: 100%; height: 100%; background: url('../../images/hmpg/icon_main_search_logo.png') no-repeat center / 100% auto;}
.search_fixed .search .search_inp {position: relative;}
.search_fixed .search .search_inp input {outline: none; padding: 0 50px 0 35px; width: 640px; height: 60px; font-size: 20px; font-family: 'SCDream', sans-serif; background: url('../../images/hmpg/icon_main_section1_search_heart.png') no-repeat 0 center / 18px auto;}
.search_fixed .search .search_inp .btn_search {position: absolute; top: 10px; right: 0; width: 41px; height: 41px; border-radius: 50%; background-color: #2656f6;}
.search_fixed .search .search_inp .btn_search .icon {margin: 0 auto; width: 25px; height: 25px;}
.search_fixed .search .search_inp .btn_search .icon::before {right: 0; bottom: 4px; width: 8px; height: 2px; background-color: #fff;}
.search_fixed .search .search_inp .btn_search .icon::after {left: 0; top: 0; width: 17px; height: 17px; border: 2px solid #fff}

/*main_quick*/
.main_quick {z-index: 9999; position: absolute; top: 400px; right: 0; padding: 20px 0; width: 120px; background-color: #fff; border-radius: 10px 0 0 10px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
.main_quick li {margin-bottom: 20px;}
.main_quick li:last-child {margin-bottom: 0;}
.main_quick li a {display: block; padding-top: 70px; font-size: 14px; font-weight: 500; line-height: 20px; letter-spacing: -1px; text-align: center; color: #222;  font-family: 'SCDream', sans-serif;}
.main_quick li.quick1 a {background: url('../../images/hmpg/icon_main_quick1.png') no-repeat center 0;}
.main_quick li.quick2 a {background: url('../../images/hmpg/icon_main_quick2.png') no-repeat center 0;}
.main_quick li.quick3 a {background: url('../../images/hmpg/icon_main_quick3.png') no-repeat center 0;}
.main_quick li.quick4 a {background: url('../../images/hmpg/icon_main_quick4.png') no-repeat center 0;}
.main_quick li.quick5 a {background: url('../../images/hmpg/icon_main_quick5.png') no-repeat center 0;}
.main_quick li.quick6 a {background: url('../../images/hmpg/icon_main_quick6.png') no-repeat center 0;}
.main_quick li.quick7 a {background: url('../../images/hmpg/icon_main_quick7.png') no-repeat center 0;}

/*section*/
.section {position: relative;}
.section .title_box {margin-bottom: 20px; font-family: 'SCDream', sans-serif;}
.section .title_box h3 {line-height: 26px; font-size: 26px; font-weight: 500; color: #222;}

/*section1*/
.section1 {padding: 30px 0 25px; position: relative; font-family: 'SCDream', sans-serif;}
.section1 .search {position: relative; display: flex; display:-webkit-flex; justify-content: center; align-items: center;}
.section1 .search h1 {margin-right: 25px; width: 96px; height: 45px;}
.section1 .search h1 .search_logo {display: block; width: 100%; height: 100%; background: url('../../images/hmpg/icon_main_section1_logo.png') no-repeat;}
.section1 .search .search_inp {position: relative;}
.section1 .search .search_inp input {padding: 0 70px; width: 704px; height: 60px; font-size: 20px; border-radius: 60px; border: 1px solid #2656f6; font-family: 'SCDream', sans-serif; background: url('../../images/hmpg/icon_main_section1_search_heart.png') no-repeat 35px center;}
.section1 .search .search_inp .btn_search {position: absolute; top: 13px; right: 30px;}
.section1 .search .search_inp .btn_search .icon {width: 33px; height: 33px;}
.section1 .search .search_inp .btn_search .icon::before {right: -1px; bottom: 4px; width: 11px; height: 3px; background-color: #2656f6;}
.section1 .search .search_inp .btn_search .icon::after {left: 0; top: 0; width: 23px; height: 23px; border: 3px solid #2656f6}
.section1 .popularSearches {padding: 40px 0 0; display: flex; display:-webkit-flex; justify-content: center; align-items: center; gap: 10px; font-size: 15px;}
.section1 .popularSearches span {padding: 0 12px 0 33px; height: 34px; line-height: 34px; border-radius: 34px; color: #fff; background: #2656f6 url('../../images/hmpg/icon_popularSearches.png') no-repeat 12px center;}
.section1 .popularSearches button {padding: 0 12px; height: 34px; font-size: 15px; border-radius: 34px; color: #666; border: 2px dotted #dedede; font-family: 'SCDream', sans-serif;}
.section1 .menu {margin: 50px 0 0;}
.section1 .menu ul {display: flex; display:-webkit-flex; justify-content: center;}
.section1 .menu ul li a {display: block; width: 120px;}
.section1 .menu ul li a .icon {margin: 0 auto 15px; position: relative; display: flex; display:-webkit-flex; justify-content: center; align-items: center; width: 70px; height: 70px; border-radius: 20px; box-shadow: 0 0 8px 0 #ddd; background-image:linear-gradient(0deg, #01c657 0%, #2657f4 100%); background-origin: border-box; background-clip: border-box;}
.section1 .menu ul li a .icon span {display: block; width: 100%; height: 100%; border-radius: 18px;}
.section1 .menu ul li:hover a .icon span {width: calc(100% - 6px); height: calc(100% - 6px);}
.section1 .menu ul li.list1 a .icon span {background: #fff url('../../images/hmpg/icon_main_section1_menu1.png') no-repeat center;}
.section1 .menu ul li.list2 a .icon span {background: #fff url('../../images/hmpg/icon_main_section1_menu2.png') no-repeat center;}
.section1 .menu ul li.list3 a .icon span {background: #fff url('../../images/hmpg/icon_main_section1_menu3.png') no-repeat center;}
.section1 .menu ul li.list4 a .icon span {background: #fff url('../../images/hmpg/icon_main_section1_menu4.png') no-repeat center;}
.section1 .menu ul li.list5 a .icon span {background: #fff url('../../images/hmpg/icon_main_section1_menu5.png') no-repeat center;}
.section1 .menu ul li.more a .icon::after {position: absolute; top: -6px; right: -6px; content: ''; display: block; width: 26px; height: 26px; background: url('../../images/hmpg/icon_main_section1_more.png') no-repeat center;}
.section1 .menu ul li a .title {font-size: 18px; font-weight: 500; text-align: center;}
.section1 .menu_more {display: none; z-index: 9; width: 100%; position: absolute; top: 320px; left: 0; background-color: #6889f9;}
.section1 .menu_more.active {display: block;}
.section1 .menu_more::after {position: absolute; top: -30px; content: ''; display: block; width: 0; height: 0; border-bottom: 15px solid #6889f9; border-top: 15px solid transparent; border-left: 15px solid transparent; border-right: 15px solid transparent;}
.section1 .menu_more .d_area {padding: 30px 65px; display: flex; display:-webkit-flex; flex-wrap: wrap;}
.section1 .menu_more .d_area button {margin: 8px 8px 8px 0; padding: 0 10px; min-width: 110px; height: 34px; font-weight: 500; border-radius: 34px; color: #1d2535; background-color: #fff;}
.section1 .menu_more .d_area button.active {color: #fff; background-color: #2656f6;}
.section1 .menu_more .d_area button.active span {padding-right: 20px; background: url('../../images/hmpg/icon_main_section1_shortcuts.png') no-repeat center right 0;}
.section1 .menu_more.list2_more::after {left: calc(50% - 135px);}
.section1 .menu_more.list3_more::after {left: calc(50% - 15px);}

/*section_menu*/
.section_menu {margin: 45px 0 0;}
.section_menu ul {display: flex; display:-webkit-flex; justify-content: center;}
.section_menu ul li a {display: block; width: 160px; font-size: 17px; font-weight: 500; text-align: center; font-family: 'SCDream', sans-serif;}
.section_menu ul li a .icon {margin: 0 auto 15px; position: relative; display: flex; display:-webkit-flex; justify-content: center; align-items: center; width: 80px; height: 80px; border-radius: 30px; background-image:linear-gradient(0deg, #01c657 0%, #2657f4 100%); background-origin: border-box; background-clip: border-box;}
.section_menu ul li:nth-child(odd) a .icon {background-image:linear-gradient(0deg, #8de8db 0%, #8de8db 100%);}
.section_menu ul li:nth-child(even) a .icon {background-image:linear-gradient(0deg, #add9fc 0%, #add9fc 100%);}
.section_menu ul li:hover a .icon {background-image:linear-gradient(0deg, #01c657 0%, #2657f4 100%);}
.section_menu ul li a .icon span {display: block; width: calc(100% - 6px); height: calc(100% - 6px); border-radius: 28px;}
.section_menu ul li.list1 a .icon span {background: #ddfffa url('../../images/hmpg/icon_section_menu1.png') no-repeat center;}
.section_menu ul li.list2 a .icon span {background: #dceffe url('../../images/hmpg/icon_section_menu2.png') no-repeat center;}
.section_menu ul li.list3 a .icon span {background: #ddfffa url('../../images/hmpg/icon_section_menu3.png') no-repeat center;}
.section_menu ul li.list4 a .icon span {background: #dceffe url('../../images/hmpg/icon_section_menu4.png') no-repeat center;}
.section_menu ul li.list5 a .icon span {background: #ddfffa url('../../images/hmpg/icon_section_menu5.png') no-repeat center;}
.section_menu ul li.list6 a .icon span {background: #dceffe url('../../images/hmpg/icon_section_menu5.png') no-repeat center;}
.section_menu ul li:hover a .icon span {background-color: #fff !important;}

/*section2*/
.section2 {padding: 35px 0; width: 100%; height: 500px; position: relative; background-color: #e7ecfd;}
.section2 .d_area {display: flex; display:-webkit-flex; justify-content: space-between;}
.section2 .d_area .text_box {padding: 50px 45px; width: 395px; border-radius: 20px; background-color: #2656f6;}
.section2 .d_area .text_box .text1 {display: inline-block; width: 288px; height: 40px; line-height: 40px; text-align: center; border-radius: 40px; background-color: #fff; font-family: 'SCDream', sans-serif;}
.section2 .d_area .text_box .text1 strong {font-weight: 700;}
.section2 .d_area .text_box .text2 {margin-bottom: 20px; padding: 35px 0 40px; position: relative; line-height: 46px; font-size: 42px; color: #fff; font-family: 'GEPEB', sans-serif;}
.section2 .d_area .text_box .text2::after {position: absolute; bottom: 0; left: 0; content: ''; display: block; width: 30px; height: 4px; background-color: #6cffac;}
.section2 .d_area .text_box .text2 span {font-size: 30px;}
.section2 .d_area .text_box .text2 span strong {font-size: 46px; color: #6cffac;}
.section2 .d_area .text_box .logo {display: inline-block; width: 182px; height: 28px; background: url('../../images/hmpg/icon_main_section2_logo.png') no-repeat center / 100% auto;}
.section2 .d_area .img_box {width: 394px;}
.section2 .d_area .slide_box {position: relative; width: calc(100% - 425px);}
/*슬라이드*/
.slider {max-width: 100%; padding-left: 40px; font-size: 0;}
.slider .inner {overflow: hidden; width: calc(100% + 200px); height: 430px; margin: 0 auto; padding: 65px 0;}
.slide_list > li {z-index: 0; position: relative; width: 33.33333333%; height: 215px; margin: 40px 0 0; border-radius: 20px; filter: grayscale(100%); transform: scale(1); transition: all 0.3s; background-repeat: no-repeat; background-size: cover; background-position: center;}
.slide_list > li.swiper-slide-prev {display: none;}
.slide_list > li.swiper-slide-active + .swiper-slide + .swiper-slide {margin-left: -155px;}
/*크기*/
.slide_list > li.swiper-slide-next,
.slide_list > li.swiper-slide-prev,
.slide_list > li.swiper-slide-duplicate-next,
.slide_list > li.swiper-slide-duplicate-prev {z-index: 50;transform: scale(1.5);}
.slide_list > li.swiper-slide-active,
.slide_list > li.swiper-slide-duplicate-active {margin: 40px 0 0 78px; z-index: 100; transform: scale(2); filter: grayscale(0);}
/*밝기*/
.slide_list > li:after {content:'';position: absolute; top: 0; left: 0;width: 100%; height: 100%; background:rgba(0,0,0,0.5); transition: all 0.6s; opacity: 1; border-radius: 20px;}
.slide_list > li.swiper-slide-next:after,
.slide_list > li.swiper-slide-prev:after,
.slide_list > li.swiper-slide-duplicate-next:after,
.slide_list > li.swiper-slide-duplicate-prev:after {background:rgba(0,0,0,0.3);} 
.slide_list > li.swiper-slide-active:after,
.slide_list > li.swiper-slide-duplicate-active:after{opacity: 0;}
/*버튼*/
.slider .btn {z-index: 9; position: absolute; top: calc(50% - 35px); display: inline-block; width: 70px; height: 70px; border-radius: 50%; background: #6889f9 url('../../images/hmpg/icon_main_section5_arrow.png') no-repeat center / 20px auto; text-indent: -999em; cursor: pointer;}
.slider .btn.btn_prev {left: 0;}
.slider .btn.btn_next {left: 640px; transform: rotateY(180deg);}
  
/*section3 section4 교육정보*/
.section3 {margin: 75px 0 100px;}
.section3 .d_area, .section4 .d_area {position: relative;}
.section3 .title_box,
.section4 .title_box {display: flex; display:-webkit-flex; justify-content: space-between; align-items: flex-end}
.section4 .title_box .flex {display: flex; display:-webkit-flex; align-items: center;}
.section4 .title_box .btn_hortcuts {margin-left: 10px; padding: 0 40px 0 15px; height: 44px; font-size: 14px; border-radius: 10px; color: #2656f6; border: 1px solid #ddd; background: url('../../images/hmpg/icon_shortcuts.png') no-repeat right 12px center; font-family: 'SCDream', sans-serif;}
.section3 .order {display: flex; display:-webkit-flex;}
.section3 .order li {margin-left: 20px; padding-left: 20px; position: relative;}
.section3 .order li::before {content: ''; position: absolute; top: calc(50% - 7px); left: -1px; width: 2px; height: 13px; background-color: #ccc;}
.section3 .order li:first-child::before {display: none;}
.section3 .order li a {font-size: 17px; font-weight: 300; color: #999;}
.section3 .order li.active a {font-weight: 500; color: #2656f6;}
.section3 .program_list ul li,
.section4 .program_list ul li {margin-bottom: 0;}
.section4 {margin: 0 0 100px;}
.section3 .program_list,
.section4 .program_list {margin-left: -10px; width: calc(100% + 20px);}
.program_list .slick-list .slick-slide {margin: 0 10px;}
.program_list .slick-pause,
.program_list .slick-pause {z-index: 11; position: absolute; left: 0; top: -5px; width: 40px; height: 40px; font-size: 0; border-radius: 100%; border: 1px solid #c5d2ff; background: url('../../images/hmpg/icon_main_section6_stop.png') no-repeat center / 10px auto;} 
.program_list .slick-pause.pause,
.program_list .slick-pause.pause {background: url('../../images/hmpg/icon_main_section6_play.png') no-repeat center;} 
.section3 .program_list .slick-pause {left: 337px;}
.section4 .program_list .slick-pause {left: 248px; top: 15px;}
.program_list .slick-arrow {opacity: 9; z-index: 999; position: absolute; top: -5px; width: 40px; height: 40px; font-size: 0; color: transparent; border-radius: 100%; border: 1px solid #c5d2ff; background: url('../../images/hmpg/icon_main_section7_arrow.png') no-repeat center / 12px auto;} 
.program_list .slick-arrow:hover {background: #2656f6 url('../../images/hmpg/icon_main_section7_arrow_active.png') no-repeat center / 12px auto;}
.program_list .slick-arrow::after, 
.program_list .slick-arrow::before {display: none;}
.program_list .slick-arrow.slick-prev {left: 290px;} 
.program_list .slick-arrow.slick-next {left: 385px; transform: rotate(180deg);} 
.section4 .program_list .slick-arrow.slick-prev {left: 200px; top: 15px;} 
.section4 .program_list .slick-arrow.slick-next {left: 295px; top: 15px;} 

.libox {width: 220px; position: relative; font-size: 16px; font-weight: 500;}
.libox a {padding: 0 40px 0 15px; display: block; width: 100%; line-height: 44px; border-radius: 10px; border: 1px solid #2656f6; background-color: #fff;}
.libox a::after {position: absolute; top: calc(50% - 4px); right: 20px; content: ''; display: block; width: 14px; height: 9px; background: url('../../images/hmpg/icon_select.png') no-repeat;}
.libox.active a::after {transform: rotateX(180deg);}
.libox ul {z-index: 121; position: absolute; width: 100%; left: 0; top: 55px; display: none;}
.libox.active ul {display: block; border-radius: 10px; border: 1px solid #2656f6; background-color: #fff;}
.libox ul li {padding: 0 15px; line-height: 56px; text-align: left; letter-spacing: -1px; color: #999; cursor: pointer;}
.libox ul li:first-child {border-radius: 10px 10px 0 0;}
.libox ul li:last-child {border-radius: 0 0 10px 10px;}
.libox ul li.active {color: #2656f6; background-color: #f4f7ff;}
.libox ul li:hover {color: #2656f6; background-color: #f4f7ff;}

/*section5 기타정보*/
.section5 {padding: 45px 0 95px; background: url('../../images/hmpg/bg_main_section5.png') repeat-x 0 0;} 
.section5 .d_area {position: relative; display: flex; display:-webkit-flex;}
.section5 .title_box {width: 250px;}
.section5 .title_box h3 {color: #b2b2b2;}
.section5 .title_box span {margin-top: 30px; display: block; font-size: 28px; line-height: 34px; color: #b2b2b2;} 
.section5 .title_box span strong {font-weight: 500; color: #fff;}
.section5 .other_list {width: calc(100% - 250px); overflow: hidden;}
.section5 .other_list .slick-list {overflow: visible;}
.section5 .other_list .slick-list .slick-slide {margin-left: 20px;}
.section5 .other_list .slick-slider a {padding: 35px 25px; position: relative; display: block; height: 0; padding-bottom: 132%; border-radius: 10px; color: #fff; background-position: center top; background-size: cover;}
.section5 .other_list .slick-slider a .top .keyword {margin-bottom: 10px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-break: keep-all;}
.section5 .other_list .slick-slider a .top .keyword span {margin-right: 10px;}
.section5 .other_list .slick-slider a .top .keyword span:last-child {margin-right: 0;}
.section5 .other_list .slick-slider a .top .title {line-height: 34px; font-size: 26px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.section5 .other_list .slick-slider a .bottom {position: absolute; bottom: 0; left: 0; padding: 0 25px 30px;}
.section5 .other_list .slick-slider a .bottom .mark {margin-bottom: 13px; padding: 0 15px; display: inline-block; height: 30px; line-height: 28px; font-size: 15px; border-radius: 30px; color: #fff; border: 1px solid #fff;}
.section5 .other_list .slick-slider a .bottom .time {margin-bottom: 8px; padding-left: 25px; line-height: 18px; font-size: 15px; background: url('../../images/hmpg/icon_time.png') no-repeat 0 center;}
.section5 .other_list .slick-slider a .bottom .date {padding-left: 25px; line-height: 18px; font-size: 15px; background: url('../../images/hmpg/icon_calendar3.png') no-repeat 0 center; }
.section5 .other_list .slick-arrow {opacity: 1; z-index: 9999; position: absolute; top: 224px; width: 14px; height: 21px; font-size: 0; color: transparent; background: url('../../images/hmpg/icon_main_section5_arrow.png') no-repeat center;} 
.section5 .other_list .slick-arrow::after, 
.section5 .other_list .slick-arrow::before {display: none;} 
.section5 .other_list .slick-arrow.slick-prev {left: 0;} 
.section5 .other_list .slick-arrow.slick-next {left: 35px; transform: rotate(180deg);} 

/*section6 공지사항*/
.section6 {position: relative;} 
.section6 .notice {overflow: hidden; padding: 10px 5px 85px; margin-left: -15px; width: calc(100% + 30px);}
.section6 .notice .slick-list {overflow: visible;}
.section6 .notice .slick-list .slick-slide {margin: 0 15px;}
.section6 .notice .slick-slider a {padding: 25px 40px; border-radius: 20px; border: 1px solid #fff; box-shadow: 0 0 8px -0 #ddd;} 
.section6 .notice .slick-slider a:hover {border-color: #2656f6;}
.section6 .notice .slick-slider a .info {display: flex; display:-webkit-flex; justify-content: space-between; align-items: center; font-family: 'SCDream', sans-serif;}
.section6 .notice .slick-slider a .info .date {display: flex; display:-webkit-flex; flex-direction: column; justify-content: center; align-items: center; width: 76px; height: 76px; background-color: #f4f7ff; border-radius: 50%;}
.section6 .notice .slick-slider a .info .date .date1 {margin-bottom: 5px; line-height: 14px; font-size: 14px; color: #666;}
.section6 .notice .slick-slider a .info .date .date2 {line-height: 24px; font-size: 24px; font-weight: 800; color: #2656f6;}
.section6 .notice .slick-slider a .info .place {font-weight: 500; color: #999;}
.section6 .notice .slick-slider a:hover .info .place {color: #2656f6;}
.section6 .notice .slick-slider a .title {display: flex; display:-webkit-flex; align-items: flex-end; margin: 20px 0 15px; font-size: 23px; font-weight: 500; color: #222;}
.section6 .notice .slick-slider a .title .title1 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.section6 .notice .slick-slider a .title.new .title1 {width: calc(100% - 22px);}
.section6 .notice .slick-slider a .title .icon {width: 22px; height: 22px; line-height: 22px; font-size: 14px; font-weight: 600; text-align: center; border-radius: 50%; color: #fff; background-color: #ff6500;}
.section6 .notice .slick-slider a .text {font-size: 19px; color: #999; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.section6 .notice .slick-arrow {display: none !important;}
.section6 .notice .slick-pause {z-index: 11; position: absolute; left: calc(50% + 0px); bottom: 0; width: 50px; height: 50px; font-size: 0; border-radius: 100%; border: 1px solid #2656f6; background: url('../../images/hmpg/icon_main_section6_stop.png') no-repeat center;} 
.section6 .notice .slick-pause.pause {background: url('../../images/hmpg/icon_main_section6_play.png') no-repeat center;} 
.section6 .notice .slick-dots {position: absolute; left: calc(50% - 50px); bottom: 17px; display: flex; display: -webkit-flex; justify-content: center; align-items: center; color: #999;} 
.section6 .notice .slick-dots li {display: none; font-size: 18px; line-height: 18px; font-weight: 700; letter-spacing: 2px;} 
.section6 .notice .slick-dots li button {margin-top: -4px; font-size: 18px; line-height: 18px; font-weight: 700; letter-spacing: 2px;}
.section6 .notice .slick-dots li.slick-active {display: block;} 
.section6 .notice .slick-dots li.slick-active button {color: #2656f6;}
.section6 .notice .slick-dots li.all {display: block;} 

/*section7 관련사이트*/
.section7 {padding: 50px 0 70px;}
.section7 .site {position: relative; width: 100%;}
.section7 .site .slick-list .slick-slide {padding: 0 5px;}
.section7 .site .slick-slider a {display: block; width: 140px; height: 155px; display: flex !important; display:-webkit-flex !important; flex-direction: column; justify-content: space-between; align-items: center;}
.section7 .site .slick-slider a .icon {margin: 15px 0 0; width: 95px; height: 95px; border-radius: 100%; background-color: #f4f4f4; background-position: center; background-repeat: no-repeat;}
.section7 .site .slick-slider a .icon.icon1 {background-image: url('../../images/hmpg/icon_main_section7_icon1.png');}
.section7 .site .slick-slider a .icon.icon2 {background-image: url('../../images/hmpg/icon_main_section7_icon2.png');}
.section7 .site .slick-slider a .icon.icon3 {background-image: url('../../images/hmpg/icon_main_section7_icon3.png');}
.section7 .site .slick-slider a .icon.icon4 {background-image: url('../../images/hmpg/icon_main_section7_icon4.png');}
.section7 .site .slick-slider a .icon.icon5 {background-image: url('../../images/hmpg/icon_main_section7_icon5.png');}
.section7 .site .slick-slider a .icon.icon6 {background-image: url('../../images/hmpg/icon_main_section7_icon6.png');}
.section7 .site .slick-slider a .icon.icon7 {background-image: url('../../images/hmpg/icon_main_section7_icon7.png');}
.section7 .site .slick-slider a .icon.icon8 {background-image: url('../../images/hmpg/icon_main_section7_icon8.png');}
.section7 .site .slick-slider a:hover .icon.icon1 {background-image: url('../../images/hmpg/icon_main_section7_icon1_active.png');}
.section7 .site .slick-slider a:hover .icon.icon2 {background-image: url('../../images/hmpg/icon_main_section7_icon2_active.png');}
.section7 .site .slick-slider a:hover .icon.icon3 {background-image: url('../../images/hmpg/icon_main_section7_icon3_active.png');}
.section7 .site .slick-slider a:hover .icon.icon4 {background-image: url('../../images/hmpg/icon_main_section7_icon4_active.png');}
.section7 .site .slick-slider a:hover .icon.icon5 {background-image: url('../../images/hmpg/icon_main_section7_icon5_active.png');}
.section7 .site .slick-slider a:hover .icon.icon6 {background-image: url('../../images/hmpg/icon_main_section7_icon6_active.png');}
.section7 .site .slick-slider a:hover .icon.icon7 {background-image: url('../../images/hmpg/icon_main_section7_icon7_active.png');}
.section7 .site .slick-slider a:hover .icon.icon8 {background-image: url('../../images/hmpg/icon_main_section7_icon8_active.png');}
.section7 .site .slick-slider a:hover .icon {margin: 0; width: 125px; height: 125px; background-color: #f4f7ff;}
.section7 .site .slick-slider a .title {letter-spacing: -1px; color: #999;}
.section7 .site .slick-slider a:hover .title {color: #2656f6;}
.section7 .site .slick-arrow {opacity: 1; z-index: 9999; position: absolute; top: calc(50% - 40px); width: 50px; height: 50px; font-size: 0; color: transparent; border-radius: 100%; border: 1px solid #2656f6; background: url('../../images/hmpg/icon_main_section7_arrow.png') no-repeat center;} 
.section7 .site .slick-arrow:hover {background: #2656f6 url('../../images/hmpg/icon_main_section7_arrow_active.png') no-repeat center;}
.section7 .site .slick-arrow::after, 
.section7 .site .slick-arrow::before {display: none;}
.section7 .site .slick-arrow.slick-prev {left: -70px;} 
.section7 .site .slick-arrow.slick-next {left: auto; right: -70px; transform: rotate(180deg);} 

.bottomarea {padding: 45px 85px 130px; background-color: #373d50;}
.bottomarea .d_area {position: relative;}
.bottomarea .d_area .privacy {margin-bottom: 20px; display: block; width: 180px; height: 50px; line-height: 48px; font-size: 18px; text-align: center; border-radius: 50px; color: #fff; border: 1px solid #6f7278;}
.bottomarea .d_area .address_box {display: flex; display:-webkit-flex; align-items: center;}
.bottomarea .d_area .address_box address p {color: #ebebeb;}
.bottomarea .d_area .address_box address p:last-child {margin-top: 10px;}
.bottomarea .d_area .logo_bottom {position: absolute; top: 0; right: 0;  width: 153px; height: 28px; background: url('../../images/hmpg/logo_bottom.png') no-repeat;}

/*팝업*/
.modal {display: none; overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1101; -webkit-overflow-scrolling: touch; outline: 0; background-color: rgba(0, 0, 0, 0.8);}
.modal.on {display: block;}
.popup {z-index: 1100; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 700px; max-width: calc(100% - 40px); max-height: calc(100% - 40px); background: #fff; border-radius: 30px 0 30px 30px;}
.popup .modal_close {position: absolute; top: 0; right: -50px; width: 50px; height: 50px; border-radius: 0 0 10px 0; background-color: #4a5767;}
.popup .modal_close::after, .popup .modal_close::before {content: ''; position: absolute; left: 7px; top: calc(50% - 0.5px); width: 35px; height: 1px; background-color: #fff; border-radius: 3px;}
.popup .modal_close::after {transform: rotate(-45deg);}
.popup .modal_close::before {transform: rotate(45deg);}
.popup .popup_scroll {overflow-y: auto; max-height: calc(100vh - 40px);}
.popup .popup_title {padding: 30px 35px 0;}
.popup .popup_title h3 {padding-right: 30px; color: #333; font-size: 24px; font-weight: 500;}
.popup .popup_inner {padding: 0 35px 40px;}
.popup .popup_inner .button_box {margin-top: 20px;}
.popup .boardview {margin-top: 30px;}
.popup .boardview h4 {margin-bottom: 5px; font-size: 18px; color: #333;}
.popup .boardview table thead tr th {padding: 12px 15px;}
.popup .boardview table tr th {font-size: 15px;}
.popup .boardview table tr td {font-size: 15px;}
.boardview.boardpopup table thead tr th {text-align: center; border-left: 1px solid #ddd;}
.boardview.boardpopup table thead tr th:first-child {border-left: 0;}
.boardview.boardpopup table tr td {text-align: center; border-left: 1px solid #ddd;}
.boardview.boardpopup table tr td:first-child {border-left: 0;}
.boardview.boardpopup table tr td .file a {font-size: 15px;}

/*레이어팝업*/
.popup.password {width: 420px;} 
.popup.password .popup_inner .password_box {padding-top: 40px; text-align: center; color: #666; word-break: keep-all;} 
.popup.password .popup_inner .password_box .inpbox {margin: 30px auto 0; max-width: 250px;} 
.popup.password .popup_inner .button_box {margin-top: 40px;} 

/*메인팝업*/
.popup.main {padding: 0; transform: translate(0, 0); border: 1px solid #000; border-radius: 0;}
.popup.main .popup_title {margin-bottom: 25px; padding: 0;}
.popup.main .popup_title h3 {color: #333; font-size: 22px;}
.popup.main .popup_inner {padding: 40px;}
.popup.main .popup_inner img {max-width: 100%;}
.popup.main .popup_inner .content_box {margin-bottom: 20px;}
.popup.main .button_box {margin-top: 0;}
.popup.main .button_box button {margin-left: 0; width: 100%; height: 40px; color: #d2d2d2; font-size: 15px; font-weight: 500; background-color: #0b0e16;}
.popup.main .button_box button:first-child {border-right: 1px solid #393c48;}
.popup.main.img .popup_inner {padding: 0;}

/*에러페이지*/
.error {position: fixed; width: 100%; height: 100%; display: flex; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-flow: column; align-items: center; justify-content: center;}
.error h1 {margin-bottom: 30px;}
.error .error_box {padding: 40px 50px 60px; width: 800px; text-align: center; word-break: keep-all; box-shadow: 0 12px 12px -12px #ccc; border-radius: 15px; border: 1px solid #ddd;}
.error .error_box .txt1 {padding: 145px 0 15px; font-size: 26px; font-weight: 500; background: #fff url('../../images/hmpg/icon_error_warning.png') no-repeat center 0;}
.error .error_box .txt2 {font-size: 16px; line-height: 24px; color: #666;}
.error .error_box .button_box {margin-top: 60px;}
.error .error_box .button_box button {width: 200px; height: 55px; background-color: #2656f6; color: #fff; border-radius: 8px;}
.error .error_box .button_box button.btn_prev img {margin: -4px 10px 0 0;}
.error .error_box .button_box button.btn_home img {margin: -4px 0 0 8px;}

@media screen and (max-width:1366px) {
    .toparea .topmenu h1 {left: 20px;}
    .toparea .topmenu .gnb {padding-left: 250px;}
    .bottomarea {padding: 45px 20px 130px;}
    .bottomarea .d_area .logo_bottom {right: 20px;}
    .section1 .search .search_inp {margin-right: 0;}
    .section2 .d_area .slide_box {margin-right: -20px; width: calc(100% - 390px);}
    .slider {padding-left: 0;}
    .slider .inner {padding-right: 100px !important; width: 100%; height: 430px; padding: 0;}
    .slide_list > li {width: 100%; height: 100%; margin: 0; transform: scale(1);}
    .slide_list > li.swiper-slide-prev {display: block;}
    .slide_list > li.swiper-slide-active + .swiper-slide + .swiper-slide {margin-left: 0;}
    .slide_list > li.swiper-slide-next,
    .slide_list > li.swiper-slide-prev,
    .slide_list > li.swiper-slide-duplicate-next,
    .slide_list > li.swiper-slide-duplicate-prev {transform: scale(1);}
    .slide_list > li.swiper-slide-active,
    .slide_list > li.swiper-slide-duplicate-active {margin: 0; transform: scale(1);}
    .slide_list > li.swiper-slide-next,
    .slide_list > li.swiper-slide-duplicate-next {transform: scale(0.9);}
    .slider .btn.btn_prev {left: -35px;}
    .slider .btn.btn_next {left: auto; right: 70px;}
    .section5 .other_list .slick-arrow.slick-prev {left: 20px;} 
    .section5 .other_list .slick-arrow.slick-next {left: 55px;} 
    .section7 .site {padding: 0 50px;}
    .section7 .site .slick-list .slick-slide {padding: 0;}
    .section7 .site .slick-slider a .title {font-size: 14px; letter-spacing: -1px;}
    .section7 .site .slick-arrow.slick-prev {left: 0;} 
    .section7 .site .slick-arrow.slick-next {right: 0;} 
}
@media screen and (max-width:1200px) {
    .toparea .topmenu .gnb > li .menu_list > li > a {font-size: 15px;}
}
@media screen and (max-width:1024px) {
    /*메뉴*/
    .toparea {z-index: 200; position: relative;}
    .toparea .topmenu {top: 0; height: 70px;}
    .toparea .topmenu h1 {left: calc(50% - 43.5px); top: 27px;}
    .toparea .topmenu h1 a {width: 97px; height: 20px; background-size: 100% auto;}
    .toparea .topmenu .gnb {display: none; display:-webkit-none;}
    .toparea .topmenu .btn_allgnb {display: block; z-index: 210; position: absolute; right: 20px; top: 28px; transform: translateY(0); width: 20px; height: 12px;}
    .toparea .topmenu .btn_allgnb span {position: absolute; left: 0; display: block; width: 20px; height: 2px; background-color: #fff;}
    .toparea .topmenu .btn_allgnb span.line1 {top: 0;}
    .toparea .topmenu .btn_allgnb span.line2 {top: calc(100% + 1px); transform: translateY(-50%);}
    .toparea .allmenu-category {z-index: 9999; position: fixed; top: 0; transform: translateX(0); width: 100%; height: 100% !important; background-color: rgba(0, 0, 0, 0.45); animation: allmenu 1s 1;}
    .toparea .allmenu-category.active {display: flex !important; display: -webkit-flex !important; justify-content: right; animation: allmenu2 1s 1;}
    @keyframes allmenu {
        0% {left: 0;}
        99% {left: 100%;}
        100% {display: none;}
   }
    @keyframes allmenu2 {
        0% {left: 100%;}
        1% {display: block;}
        100% {left: 0;}
   }
    .toparea .allmenu-category .btn_close {position: absolute; top: 22px; right: 27px; transform: scale(0.9);}
    .toparea .allmenu-category .btn_close .icon::after, .toparea .allmenu-category .btn_close .icon::before {height: 2px;}
    .toparea .allmenu-category .menu_box {overflow-y: auto; position: relative; width: 70%; height: 100%; background-color: #fff;}
    .toparea .allmenu-category .menu_box .all_gnb {padding: 60px 20px 0; display: block;}
    .toparea .allmenu-category .menu_box .all_gnb > li {position: relative; width: 100%; border-bottom: 1px solid #ddd;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a {z-index: 99; display: block; width: 100%; height: 58px; line-height: 58px; font-size: 18px; font-weight: 500; color: #000; font-family: 'SCDream', sans-serif;}
    .toparea .allmenu-category .menu_box .all_gnb > li.active > a {color: #2656f6;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a .icon {display: none; position: absolute; top: 14px; right: 10px; width: 20px; height: 20px;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a .icon::after, 
    .toparea .allmenu-category .menu_box .all_gnb > li > a .icon::before {content: ''; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: 2px; background-color: #2656f6;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a .icon::before {transform: rotate(90deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li.active > a .icon {display: block;}
    .toparea .allmenu-category .menu_box .all_gnb > li.active > a .icon::before {transform: rotate(0deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list {display: none; padding: 0 0 20px; width: 100%;}
    .toparea .allmenu-category .menu_box .all_gnb > li.active .menu_list {display: block;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li {margin-bottom: 5px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li:last-child {margin-bottom: 0;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a {display: block; position: relative; padding: 0 10px; line-height: 26px; height: 28px; font-size: 16px; color: #222;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li.active > a {color: #fff; background-color: #2656f6;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a .icon {display: none; position: absolute; top: 6px; right: 12px; width: 15px; height: 15px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a .icon::after, 
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a .icon::before {content: ''; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: 2px; background-color: #fff;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a .icon::before {transform: rotate(90deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li.active a .icon {display: block;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li.active a .icon::before {transform: rotate(0deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > .menu_list_s {display: none !important; padding: 10px 10px 5px; background-color: #f4f7ff;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li.active > .menu_list_s {display: block !important;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > .menu_list_s li {margin-bottom: 5px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li.active {position: relative;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > .menu_list_s li a {font-size: 14px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > .menu_list_s li.active a {color: #2656f6;}

    /*메인메뉴*/
    .maincontents {padding: 80px 0 0;}
    #main .toparea .topmenu {top: 0; height: 80px; background: #fff;}
    #main .toparea .topmenu h1 {left: calc(50% - 70px); top: 25px;}
    #main .toparea .topmenu h1 a {width: 140px; height: 27px; background: url('../../images/hmpg/logo_active.png') no-repeat center / 100% auto;}
    #main .toparea .topmenu .btn_allgnb span {width: 24px; height: 3px; background-color: #2656f6;}
    #main .toparea .topmenu .btn_allgnb span.line2 {top: calc(100% + 2px);}

    /*topbar*/
    .topbar .d_area {padding: 0; height: 40px;}
    .topbar .d_area .topbar_text {padding-left: 55px; width: 100%; background: url('../../images/hmpg/icon_main_topbar_speaker.png') no-repeat 20px center / 24px auto;}
    .topbar .d_area .topbar_text a {display: block; font-size: 15px; text-overflow: initial;}
    .topbar .d_area .topbar_logo {display: none;}

    /*search_fixed*/
   .search_fixed {display: none;}
   
    /*main_quick*/
    .main_quick {display: none;}

    /*section*/
    .section .title_box {margin-bottom: 15px;}
    .section .title_box h3 {line-height: 24px; font-size: 24px;}

    /*section1*/
    .section1 {padding: 0 0 20px;}
    .section1 .search {padding: 0;}
    .section1 .search h1 {margin-right: 10px; width: 55px; height: 26px;}
    .section1 .search h1 .search_logo {background: url('../../images/hmpg/icon_main_section1_logo.png') no-repeat center / 100% auto;}
    .section1 .search .search_inp {width: calc(100% - 65px);}
    .section1 .search .search_inp input {padding: 0 37px 0 43px; width: 100%; height: 40px; font-size: 11px; letter-spacing: -0.3px; border-radius: 40px; background: url('../../images/hmpg/icon_main_section1_search_heart.png') no-repeat 15px center / 18px auto;}
    .section1 .search .search_inp .btn_search {top: 10px; right: 15px;}
    .section1 .search .search_inp .btn_search .icon {width: 20px; height: 20px;}
    .section1 .search .search_inp .btn_search .icon::before {right: -1px; bottom: 2px; width: 7px; height: 2px;}
    .section1 .search .search_inp .btn_search .icon::after {left: 0; top: 0; width: 14px; height: 14px; border: 2px solid #2656f6;}
    .section1 .popularSearches {padding: 25px 0 0; justify-content: center; flex-wrap: wrap; gap: 6px;}
    .section1 .menu {margin: 35px 0 0;}
    .section1 .menu ul {justify-content: center;}
    .section1 .menu ul li a {display: block; width: 100px;}
    .section1 .menu ul li a .icon {margin: 0 auto 10px; width: 60px; height: 60px; box-shadow: 0 0 4px 0 #ddd;}
    .section1 .menu ul li:hover a .icon span {width: calc(100% - 4px); height: calc(100% - 4px);}
    .section1 .menu ul li.list1 a .icon span {background-size: 42px auto;}
    .section1 .menu ul li.list2 a .icon span {background-size: 28px auto;}
    .section1 .menu ul li.list3 a .icon span {background-size: 27px auto;}
    .section1 .menu ul li.list4 a .icon span {background-size: 41px auto;}
    .section1 .menu ul li.list5 a .icon span {background-size: 28px auto;}
    .section1 .menu ul li.more a .icon::after {position: absolute; top: -6px; right: -6px; content: ''; display: block; width: 26px; height: 26px; background: url('../../images/hmpg/icon_main_section1_more.png') no-repeat center;}
    .section1 .menu ul li a .title {font-size: 15px;}
    .section1 .menu_more {top: 265px;}
    .section1 .menu_more::after {top: -24px; border-bottom: 12px solid #6889f9; border-top: 12px solid transparent; border-left: 12px solid transparent; border-right: 12px solid transparent;}
    .section1 .menu_more .d_area {padding: 16px 20px;}
    .section1 .menu_more .d_area button {margin: 8px 10px 8px 0; border-radius: 5px;}
    .section1 .menu_more .d_area button.active span {padding-right: 18px; background-size: 12px auto;}
    .section1 .menu_more.list2_more::after {left: calc(50% - 112px);}
    .section1 .menu_more.list3_more::after {left: calc(50% - 12px);}

    /*section_menu*/
    .section_menu {margin: 30px 0 0;}
    .section_menu ul li a {width: 140px; font-size: 15px;}
    .section_menu ul li a .icon {margin: 0 auto 10px; width: 60px; height: 60px; border-radius: 20px;}
    .section_menu ul li a .icon span {border-radius: 18px;}
    .section_menu ul li.list1 a .icon span {background-size: 32px auto;}
    .section_menu ul li.list2 a .icon span {background-size: 32px auto;}
    .section_menu ul li.list3 a .icon span {background-size: 32px auto;}
    .section_menu ul li.list4 a .icon span {background-size: 32px auto;}
    .section_menu ul li.list5 a .icon span {background-size: 32px auto;}
    .section_menu ul li.list6 a .icon span {background-size: 32px auto;}
    .section_menu ul li:hover a .icon span {background-color: #fff !important;}

    /*section2*/
    .section2 {padding: 0; height: auto; background: 0;}
    .section2 .d_area {display: block;}
    .section2 .d_area .text_box {display: none;}
    .section2 .d_area .img_box {width: 100%;}
    .section2 .d_area .img_box img {width: 100%; height: auto;}
    .section2 .d_area .slide_box {margin: 20px 0 0 -20px; padding: 35px 0 35px 20px; width: calc(100% + 40px); background-color: #e7ecfd;}
    /*슬라이드*/
    .slider .inner {padding-right: 100px !important; height: auto;}
    .slide_list > li {height: 0; padding-bottom: 67%; border-radius: 10px;}
    /*밝기*/
    .slide_list > li:after {border-radius: 10px;}
    /*버튼*/
    .slider .btn {top: calc(50% - 18px); width: 36px; height: 36px; background: #6889f9 url('../../images/hmpg/icon_main_section5_arrow.png') no-repeat center / 10px auto;}
    .slider .btn.btn_prev {left: 10px;}
    .slider .btn.btn_next {right: 90px;}

    /*section3 section4 교육정보*/
    .section3 {margin: 45px 0 50px;}
    .section3 .title_box,
    .section4 .title_box {margin-bottom: 0; display: block;}
    .section4 .title_box {margin-bottom: 70px;}
    .section4 .title_box .flex {margin: 20px 0; position: absolute; top: 22px; right: 20px;}
    .section4 .title_box .btn_hortcuts {margin-left: 10px; padding: 0 33px 0 10px; height: 37px; font-size: 12px; border-radius: 5px; background: url('../../images/hmpg/icon_shortcuts.png') no-repeat right 10px center / 15px auto;}
    .section3 .order {margin: 20px 0 25px; justify-content: center;}
    .section3 .order li {margin: 0 5px; padding-left: 0;}
    .section3 .order li::before {display: none;}
    .section3 .order li a {display: block; width: 96px; height: 34px; line-height: 32px; font-size: 15px; text-align: center; border-radius: 5px; border: 1px solid #e2e2e2;;}
    .section3 .order li.active a {color: #2656f6; border-color: #2656f6;}
    .section3 .program_list,
    .section4 .program_list {padding-bottom: 30px; margin-left: 0; width: calc(100% + 20px); overflow-x: scroll;}
    .section3 .program_list::-webkit-scrollbar, .section4 .program_list::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section3 .program_list::-webkit-scrollbar-thumb, .section4 .program_list::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
    .section3 .program_list ul,
    .section4 .program_list ul {width: 984px; flex-wrap: nowrap;}
    .section3 .program_list ul li,
    .section4 .program_list ul li {margin-bottom: 0; margin-right: 20px !important;}
    .section3 .program_list ul li a .text_box .title,
    .section4 .program_list ul li a .text_box .title {width: 230px !important;}
    .section4 {margin: 0 0 50px;}
    .program_list .slick-slider {display: flex; display:-webkit-flex; touch-action: auto;}
    .program_list .slick-pause, .program_list .slick-pause {display: none;}
    .libox {width: 160px; font-size: 14px;}
    .libox a {padding: 0 25px 0 10px; line-height: 35px; border-radius: 5px;}
    .libox a::after {position: absolute; top: calc(50% - 3px); right: 10px; content: ''; display: block; width: 14px; height: 6px; background-size: 9px auto;}
    .libox ul {top: 43px; padding: 8px 0;}
    .libox.active ul {border-radius: 5px;}
    .libox ul li {padding: 0 10px; line-height: 32px;}
    .libox ul li:first-child {border-radius: 5px 5px 0 0;}
    .libox ul li:last-child {border-radius: 0 0 5px 5px;}

    /*section5 기타정보*/
    .section5 {padding: 35px 0 0; background-size: auto 335px;}
    .section5 .d_area {display: block;}
    .section5 .title_box span {margin-top: 15px; font-size: 24px; line-height: 30px;} 
    .section5 .other_list {width: calc(100% + 20px); overflow-x: scroll;}
    .section5 .other_list::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section5 .other_list::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
    .section5 .other_list .slick-slider {padding-bottom: 35px; display: flex; display:-webkit-flex; touch-action: auto;}
    .section5 .other_list .slick-slider a {margin-right: 20px; padding: 25px 20px; padding-bottom: 270px; border-radius: 5px;}
    .section5 .other_list .slick-slider a .top .keyword {margin-bottom: 5px; line-height: 12px; font-size: 12px;}
    .section5 .other_list .slick-slider a .top .keyword span {margin-right: 5px;}
    .section5 .other_list .slick-slider a .top .title {width: 170px !important; line-height: 24px; font-size: 18px;}
    .section5 .other_list .slick-slider a .bottom {padding: 0 20px 20px;}
    .section5 .other_list .slick-slider a .bottom .mark {margin-bottom: 10px; padding: 0 10px; height: 21px; line-height: 19px; font-size: 12px; border-radius: 21px;}
    .section5 .other_list .slick-slider a .bottom .time {margin-bottom: 5px; padding-left: 20px; line-height: 15px; font-size: 12px; background-size: 12px auto;}
    .section5 .other_list .slick-slider a .bottom .date {padding-left: 20px; line-height: 15px; font-size: 12px; background-size: 15px auto;}
    .section5 .other_list .slick-arrow {display: none !important;} 

    /*section6 공지사항*/
    .section6 {padding: 50px 0 0; position: relative;} 
    .section6 .notice {padding: 10px 5px 0; margin-left: -5px; width: calc(100% + 25px); overflow-x: scroll;}
    .section6 .notice::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section6 .notice::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
    .section6 .notice .slick-list .slick-slide {margin: 0 10px;}
    .section6 .notice .slick-slider {padding-bottom: 35px; display: flex; display:-webkit-flex; touch-action: auto;}
    .section6 .notice .slick-slider a {margin-right: 20px; padding: 20px 25px; border-radius: 10px; border: 1px solid #fff; box-shadow: 0 0 4px -0 #ddd;}
    .section6 .notice .slick-slider a:last-child {margin-right: 0;} 
    .section6 .notice .slick-slider a .info .date {width: 62px; height: 62px;}
    .section6 .notice .slick-slider a .info .date .date1 {line-height: 12px; font-size: 12px;}
    .section6 .notice .slick-slider a .info .date .date2 {line-height: 18px; font-size: 18px;}
    .section6 .notice .slick-slider a .info .place {font-size: 15px;}
    .section6 .notice .slick-slider a .title {margin: 15px 0 10px; font-size: 17px;}
    .section6 .notice .slick-slider a .title.new .title1 {width: calc(100% - 16px);}
    .section6 .notice .slick-slider a .title .icon {width: 16px; height: 16px; line-height: 16px; font-size: 10px;}
    .section6 .notice .slick-slider a .text {width: 230px !important; font-size: 15px;}
    .section6 .notice .slick-arrow {display: none !important;}
    .section6 .notice .slick-pause {display: none !important;} 
    .section6 .notice .slick-dots {display: none !important;} 

    /*section7 관련사이트*/
    .section7 {padding: 50px 0 65px;}
    .section7 .site {padding: 0; position: relative; width: calc(100% + 20px); overflow-x: scroll;}
    .section7 .site::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section7 .site::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
    .section7 .site .slick-slider {padding-bottom: 35px; display: flex; display:-webkit-flex; touch-action: auto;}
    .section7 .site .slick-slider a {margin-left: -10px; height: 120px;}
    .section7 .site .slick-slider a .icon {margin: 10px 0 0; width: 71px; height: 71px;}
    .section7 .site .slick-slider a .icon.icon1 {background-size: 38px auto;}
    .section7 .site .slick-slider a .icon.icon2 {background-size: 37px auto;}
    .section7 .site .slick-slider a .icon.icon3 {background-size: 36px auto;}
    .section7 .site .slick-slider a .icon.icon4 {background-size: 30px auto;}
    .section7 .site .slick-slider a .icon.icon5 {background-size: 37px auto;}
    .section7 .site .slick-slider a .icon.icon6 {background-size: 35px auto;}
    .section7 .site .slick-slider a .icon.icon7 {background-size: 40px auto;}
    .section7 .site .slick-slider a .icon.icon8 {background-size: 39px auto;}
    .section7 .site .slick-slider a:hover .icon.icon1 {background-size: 38px auto;}
    .section7 .site .slick-slider a:hover .icon.icon2 {background-size: 37px auto;}
    .section7 .site .slick-slider a:hover .icon.icon3 {background-size: 36px auto;}
    .section7 .site .slick-slider a:hover .icon.icon4 {background-size: 30px auto;}
    .section7 .site .slick-slider a:hover .icon.icon5 {background-size: 37px auto;}
    .section7 .site .slick-slider a:hover .icon.icon6 {background-size: 35px auto;}
    .section7 .site .slick-slider a:hover .icon.icon7 {background-size: 40px auto;}
    .section7 .site .slick-slider a:hover .icon.icon8 {background-size: 39px auto;}
    .section7 .site .slick-slider a:hover .icon {width: 94px; height: 94px;}
    .section7 .site .slick-slider a .title {width: 113px !important; font-size: 14px; text-align: center;}
    .section7 .site .slick-arrow {display: none !important;} 

    .bottomarea {padding: 25px 0 55px; text-align: center;}
    .bottomarea .d_area .privacy {position: static; margin: 0 auto 25px; width: 135px; height: 38px; line-height: 36px; font-size: 14px; border-radius: 38px;}
    .bottomarea .d_area .address_box {display: block;}
    .bottomarea .d_area .address_box address p {line-height: 18px; font-size: 12px; word-break: keep-all;}
    .bottomarea .d_area .address_box address p:last-child {margin-top: 5px;}
    .bottomarea .d_area .logo_bottom {margin: 30px auto 0; position: static; width: 92px; height: 17px; background-size: 100% auto;}

    /*팝업*/
    .popup {border-radius: 20px 0 20px 20px;}
    .popup .modal_close {position: absolute; top: 12px; right: 15px; width: 25px; height: 25px; border-radius: 0; background: 0;}
    .popup .modal_close::after, .popup .modal_close::before {left: 2px; top: calc(50% - 0.5px); width: 20px; height: 1px; background-color: #000;}
    .popup .popup_title {position: relative; padding: 15px 15px 0;}
    .popup .popup_title h3 {padding-right: 0; font-size: 20px;}
    .popup .popup_inner {padding: 0 15px 20px;}
    .popup .boardview {margin-top: 15px;}
    .popup .boardview h4 {font-size: 16px;}
    .popup .boardview table thead tr th {padding: 12px 15px;}
    .popup .boardview table tr th {font-size: 13px;}
    .popup .boardview table tr td {font-size: 13px;}
    .boardview.boardpopup table thead tr {display: none;}
    .boardview.boardpopup table thead tr th {text-align: left; border-left: 0;}
    .boardview.boardpopup table tr td {text-align: left; border-left: 0;}
    .boardview.boardpopup table tr td .w_hidden {display: inline-block !important; margin-right: 5px;}
    .boardview.boardpopup table tr td .file a {font-size: 13px;}
    
    /*레이어팝업*/
    .popup.password .popup_inner .password_box {padding-top: 20px;} 
    .popup.password .popup_inner .password_box .inpbox {margin: 15px auto 0;} 
    .popup.password .popup_inner .button_box {margin-top: 20px;} 

    /*메인팝업*/
    .popup.main {transform: translate(-50%, 0); width: 100% !important; height: auto !important; left: 50% !important;}
    .popup.main.img {top: 220px !important;}
    .popup.main .popup_title {margin-bottom: 10px;}
    .popup.main .popup_title h3 {font-size: 16px;}
    .popup.main .popup_inner {padding: 20px;}
    .popup.main .popup_inner .content_box {margin-bottom: 10px;}
    .popup.main .button_box button {height: 35px; font-size: 12px;}

    /*에러페이지*/
    .error h1 {margin-bottom: 20px;}
    .error h1 img {width: auto; height: 33px;}
    .error .error_box {margin: 0 15px; padding: 50px 30px 40px; width: calc(100% - 30px); box-shadow: 0 8px 8px -8px #ccc; border-radius: 8px;}
    .error .error_box .txt1 {padding: 110px 0 15px; font-size: 15px; background-size: 70px auto;}
    .error .error_box .txt2 {font-size: 14px; line-height: 20px;}
    .error .error_box .button_box {margin-top: 30px;}
    .error .error_box .button_box button {width: 100%; height: 45px; font-size: 15px; border-radius: 5px;}
    .error .error_box .button_box button img {display: none;}
}
@media screen and (max-width:840px){
   /*section_menu*/
    .section_menu {padding-bottom: 30px; margin-left: 20px; overflow-x: auto;}
    .section_menu ul {margin: 0 auto; width: 840px;}
    .section_menu::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section_menu::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
}
@media screen and (max-width:640px){
    /*section2*/
    /*슬라이드*/
    .slider .inner {padding-right: 50px !important;}
    /*버튼*/
    .slider .btn.btn_next {right: 40px;}
}
@media screen and (max-width:540px){
    /*section1*/
    .section1 .menu {margin: 29px 0 0; padding: 6px 0 30px; width: calc(100% + 20px); overflow-x: scroll;}
    .section1 .menu ul {justify-content: flex-start; width: 500px;}
    .section1 .menu::-webkit-scrollbar {height: 5px; background-color: #d9d9d9; border-radius: 5px 0 0 5px;}
    .section1 .menu::-webkit-scrollbar-thumb {background: #999; border-radius: 5px;}
}
@media screen and (max-width:480px){
}
@media screen and (max-width:360px){
}
@media screen and (max-width:320px){ 
}