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

/* Default Layout */
#seoul-common-gnb {width: 100%; height: 48px; background-color: #fff;}
#wrap {width:100%; height: 100%;}

/*메뉴*/
.toparea {z-index: 200; position: relative;}
.toparea {position: relative; padding-bottom: 140px;}
.toparea h1 {z-index: 80; position: absolute; top: 36px; left: calc((100% - 1300px)/2);}
.toparea .topmenu {z-index: 85; display: flex; display:-webkit-flex; position: absolute; left: 0; top: 0; width: 100%; background-color: #fff; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
.toparea .topmenu:hover {background: #fff url('/images/hmpg/bg_topmenu.png') no-repeat center 140px;}
.toparea .topmenu .gnb {margin: 0 auto; padding-left: 100px; display: flex; display:-webkit-flex; justify-content: space-between; width: 850px;}
.toparea .topmenu .gnb * {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.toparea .topmenu .gnb > li {width: 100%; text-align: center;}
.toparea .topmenu .gnb > li > a {position: relative; display: inline-block; line-height: 140px; color: #333; font-size: 20px; font-weight: 500;}
.toparea .topmenu .gnb > li:hover > a::after {content: ''; position: absolute; left: calc(50% - 3px); top: 46px; width: 6px; height: 6px; border-radius: 5px; background-color: #c65100;}
.toparea .topmenu .gnb > li .menu_list {display: none; padding: 30px 0; width: 100%; height: auto !important; position: absolute; top: 141px; left: 0; box-shadow: 0px 8px 8px -6px rgba(0, 0, 0, 0.2); background-color: #fff;}
.toparea .topmenu .gnb > li:hover .menu_list {display: block;}
.toparea .topmenu .gnb > li .menu_list > ul {display: flex; display:-webkit-flex; width: 1300px; margin: 10px auto;}
.toparea .topmenu .gnb > li .menu_list > ul > li {margin-right: 8px;}
.toparea .topmenu .gnb > li .menu_list > ul > li:last-child {margin-right: 0;}
.toparea .topmenu .gnb > li .menu_list > ul > li > a {display: block; width: 208px; height: 50px; font-size: 16px; line-height: 48px; border-radius: 50px; color: #c65100; border: 1px solid #c65100;}
.toparea .topmenu .gnb > li:nth-child(3) .menu_list > ul > li:nth-child(1) > a {width: 260px;}
.toparea .topmenu .gnb > li:nth-child(1) .menu_list > ul > li > a {width: auto; padding: 0 21px;}
.toparea .topmenu .gnb > li .menu_list > ul > li:hover > a {background-color: #c65100; color: #fff;}
.toparea .topmenu .gnb > li .menu_list > ul > li.active > a {background-color: #c65100; color: #fff;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul {margin-top: 15px; width: 210px; line-height: 22px; text-align: left; letter-spacing: -1px; word-break: keep-all;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li {margin-bottom: 5px; padding-left: 12px; position: relative;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li:last-child {margin-bottom: 0;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li::before {content: ''; position: absolute; left: 5px; top: 12px; width: 2px; height: 2px; background-color: #666;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li a {font-size: 15px; color: #666;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li:hover a {border-bottom: 1px solid #000; color: #000;}
.toparea .topmenu .gnb > li .menu_list > ul > li > ul li.active a {border-bottom: 1px solid #000; color: #000;}
.toparea .topmenu .btn_allgnb {display: none;}
.toparea .membershiparea {position: absolute; top: 55px; right: calc((100% - 1300px)/2); display: flex; display:-webkit-flex;}
.toparea .membershiparea li {position: relative; display: flex; display:-webkit-flex; align-items: center; font-size: 14px; padding-right: 10px; margin-left: 10px;}
.toparea .membershiparea li:last-child {padding-right: 0;}
.toparea .membershiparea li::after {position: absolute; right: 0; top: 8px; content: ''; width: 1px; height: 12px; background-color: #ccc;}
.toparea .membershiparea li:last-child:after {display: none;}
.toparea .membershiparea li a {font-size: 14px;}
.toparea .membershiparea li button.btn_search {margin-right: 13px;}
.toparea .total_search_area {z-index: 212; display: none; position: absolute; left: 0; top: 141px; padding: 50px 0 60px; width: 100%; height: 176px; background-color: #fff; border-top: 1px solid #ddd; box-shadow: 0px 8px 8px -6px rgba(0, 0, 0, 0.2);}
.toparea .total_search_area .btn_close {position: absolute; top: calc(50%  - 12px); right: calc(50% - 640px); background-color: #fff;}
.toparea .total_search_area .box_wrap {margin: 0 auto; padding-top: 5px;}
.toparea .total_search_area .box_wrap.active {position: absolute; left: calc(50% - 370px); top: 50px; width: 740px; border-radius: 10px; background-color: #fff; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);}
.toparea .total_search_area .box_wrap.active .recent_box {display: block;}
.toparea .total_search_area .search_box {position: relative; margin: 0 auto; width: 700px; height: 55px; border-bottom: 2px solid #222;}
.toparea .total_search_area .search_box input {padding: 0 40px 0 10px; width: 100%; height: 100%; font-size: 22px; background-color: transparent;}
.toparea .total_search_area .search_box input:focus {outline: none;}
.toparea .total_search_area .search_box button.btn_search {position: absolute; right: 10px; top: calc(50% - 15px);}
.toparea .total_search_area .search_box button.btn_search .icon {width: 28px; height: 28px;}
.toparea .total_search_area .search_box button.btn_search .icon::after {width: 18px; height: 18px; border-width: 2px;}
.toparea .total_search_area .search_box button.btn_search .icon::before {width: 11px; height: 2px;}
.toparea .total_search_area .recent_box {display: none; width: 100%; border-radius: 10px; background-color: #fff;} 
.toparea .total_search_area .recent_box p.nodata {padding: 70px 0; font-size: 18px; text-align: center;}
.toparea .total_search_area .recent_box span.tit {margin: 15px 30px 5px; display: block; font-size: 16px; color: #666;}
.toparea .total_search_area .recent_box ul.list {padding-bottom: 15px;}
.toparea .total_search_area .recent_box ul.list li {padding: 0 30px; height: 30px; line-height: 28px;}
.toparea .total_search_area .recent_box ul.list li:hover {background-color: #f9fafb;}
.toparea .total_search_area .recent_box ul.list li a {padding-left: 26px; position: relative; display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.toparea .total_search_area .recent_box ul.list li a::before {position: absolute; top: 6px; left: 0; content: ''; display: block; width: 18px; height: 18px; background: url('/images/hmpg/icon_search.png') no-repeat center;}
.toparea .total_search_area .recent_box ul.list li a span.keyword {margin-right: 5px; font-size: 16px; color: #666; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.toparea .total_search_area .recent_box ul.list li a span.date {font-size: 13px; color: #666;}
.toparea .total_search_area .recent_box .recent_box_footer {margin: 0 20px; padding: 13px 10px; display: flex; display:-webkit-flex; justify-content: space-between; border-top: 1px solid #e6e6e6;}
.toparea .total_search_area .recent_box .recent_box_footer button {font-size: 15px; color: #666; border-bottom: 1px solid #666;}
.toparea .total_search_bg {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);}

.toparea .allmenu-category {display: none !important;}
.toparea .allmenu-category .membership {display: none;}

.main_visual {position: relative;}
.main_visual .main_slide {width: 100%; height: 100%; overflow: hidden;}
.main_visual .main_slide .slick-slide img {width: 100%;}
.main_visual .main_slide .slick-arrow.slick-prev {left: calc(50% - 230px);}
.main_visual .main_slide .slick-arrow.slick-next {right: calc(50% - 230px);}
.main_visual .slick-dots {position: absolute; bottom: 35px; right: calc((100% - 400px) / 2 + 30px);}
.main_visual .slick-dots li {margin: 0 6px; float: left; width: 12px; height: 12px; line-height: 12px;}
.main_visual .slick-dots li button {width: 14px; height: 14px; line-height: 14px; font-size: 0; vertical-align: top; background-color: rgba(0, 0, 0, 0.2); border-radius: 12px;}
.main_visual .slick-dots li.slick-active button {background-color: #345bbf;}
.main_visual .slick-pause {position: absolute; bottom: 30px; right: calc((100% - 400px) / 2); width: 22px; height: 22px; border-radius: 22px; background: #575757 url('/images/hmpg/icon_stop.png') no-repeat center / 8px 10px;}
.main_visual.pause .slick-pause {background-image: url('/images/hmpg/icon_play.png');}
.main_visual .slick-arrow {top: calc(50% - 35px); width: 70px; height: 70px; border-radius: 70px; background-color: rgba(255, 255, 255, 0.6);}
.main_visual .slick-arrow::after, .main_visual .slick-arrow::before {content: ''; position: absolute; left: 24px; top: 34px; width: 22px; background-color: #333;}
.main_visual .slick-arrow:hover {background-color: #fff;}

.main_visual .main_slide .slick-list {overflow: visible;}
.main_visual .main_slide .slick-list .slick-current a:focus {display: block; margin: 2px; width: calc(100% - 4px) !important;}

.sub_visual {position: relative;}
.sub_visual .sub_slide {width: 100%; height: 100%; overflow: hidden;}
.sub_visual .sub_slide .slick-slide img {width: 100%;}
.sub_visual .sub_slide .slick-arrow.slick-prev {left: calc(50% - 170px);}
.sub_visual .sub_slide .slick-arrow.slick-next {right: calc(50% - 170px);}
.sub_visual .slick-dots {position: absolute; bottom: 35px; right: calc((100% - 300px) / 2 + 30px);}
.sub_visual .slick-dots li {margin: 0 6px; float: left; width: 12px; height: 12px; line-height: 12px;}
.sub_visual .slick-dots li button {width: 14px; height: 14px; line-height: 14px; font-size: 0; vertical-align: top; background-color: rgba(0, 0, 0, 0.2); border-radius: 12px;}
.sub_visual .slick-dots li.slick-active button {background-color: #345bbf;}
.sub_visual .slick-pause {position: absolute; bottom: 30px; right: calc((100% - 300px) / 2); width: 22px; height: 22px; border-radius: 22px; background: #575757 url('/images/hmpg/icon_stop.png') no-repeat center / 8px 10px;}
.sub_visual.pause .slick-pause {background-image: url('/images/hmpg/icon_play.png');}
.sub_visual .slick-arrow {top: calc(50% - 35px); width: 70px; height: 70px; border-radius: 70px; background-color: rgba(255, 255, 255, 0.6);}
.sub_visual .slick-arrow::after, .sub_visual .slick-arrow::before {content: ''; position: absolute; left: 24px; top: 34px; width: 22px; background-color: #333;}
.sub_visual .slick-arrow:hover {background-color: #fff;}

.sub_visual .sub_slide .slick-list {overflow: visible;}
.sub_visual .sub_slide .slick-list .slick-current a:focus {display: block; margin: 2px; width: calc(100% - 4px) !important;}

.footer_visual {position: relative;}
.footer_visual .footer_slide {width: 100%; height: 100%; overflow: hidden;}
.footer_visual .footer_slide .slick-slide img {width: 100%;}
.footer_visual .footer_slide .slick-arrow.slick-prev {left: calc(50% - 170px);}
.footer_visual .footer_slide .slick-arrow.slick-next {right: calc(50% - 170px);}
.footer_visual .slick-dots {position: absolute; bottom: 35px; right: calc((100% - 300px) / 2 + 30px);}
.footer_visual .slick-dots li {margin: 0 6px; float: left; width: 12px; height: 12px; line-height: 12px;}
.footer_visual .slick-dots li button {width: 14px; height: 14px; line-height: 14px; font-size: 0; vertical-align: top; background-color: rgba(0, 0, 0, 0.2); border-radius: 12px;}
.footer_visual .slick-dots li.slick-active button {background-color: #345bbf;}
.footer_visual .slick-pause {position: absolute; bottom: 30px; right: calc((100% - 300px) / 2); width: 22px; height: 22px; border-radius: 22px; background: #575757 url('/images/hmpg/icon_stop.png') no-repeat center / 8px 10px;}
.footer_visual.pause .slick-pause {background-image: url('/images/hmpg/icon_play.png');}
.footer_visual .slick-arrow {top: calc(50% - 35px); width: 70px; height: 70px; border-radius: 70px; background-color: rgba(255, 255, 255, 0.6);}
.footer_visual .slick-arrow::after, .footer_visual .slick-arrow::before {content: ''; position: absolute; left: 24px; top: 34px; width: 22px; background-color: #333;}
.footer_visual .slick-arrow:hover {background-color: #fff;}

.sub_visual .sub_slide .slick-list {overflow: visible;}
.sub_visual .sub_slide .slick-list .slick-current a:focus {display: block; margin: 2px; width: calc(100% - 4px) !important;}

.maincontents .section {position: relative;}
.maincontents .section .title_box {margin-bottom: 40px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.maincontents .section .title_box h2 {font-size: 34px; font-weight: 700; line-height: 34px; color: #000; font-family: 'Nanum Square', sans-serif;}
.maincontents .section.section1 .d_area {padding: 60px 0;}
.maincontents .section.section1 .d_area .title_box h2 {color: #c65100;}
.maincontents .section.section1 .d_area ul {display: flex; display:-webkit-flex;}
.maincontents .section.section1 .d_area ul li {width: 100%; margin-right: 30px;}
.maincontents .section.section1 .d_area ul li:last-child {margin-right: 0;}
.maincontents .section.section1 .d_area ul li a {display: block; padding-top: 190px; height: 260px; font-size: 22px; font-weight: 600; line-height: 30px; text-align: center; border-radius: 25px; color: #000; border: 3px solid #cfcfcf; font-family: 'Nanum Square', sans-serif; background-repeat: no-repeat; background-position: center bottom; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section1 .d_area ul li a.ico1 {background: url('/images/hmpg/main_contents1_1.png') no-repeat center 38px;}
.maincontents .section.section1 .d_area ul li a.ico2 {background: url('/images/hmpg/main_contents1_2.png') no-repeat center 38px;}
.maincontents .section.section1 .d_area ul li a.ico3 {padding-top: 175px; background: url('/images/hmpg/main_contents1_3.png') no-repeat center 50px;}
.maincontents .section.section1 .d_area ul li a.ico4 {background: url('/images/hmpg/main_contents1_4.png') no-repeat center 45px;}
.maincontents .section.section1 .d_area ul li a.ico5 {background: url('/images/hmpg/main_contents1_5.png') no-repeat center 40px;}
.maincontents .section.section1 .d_area ul li a.ico6 {background: url('/images/hmpg/main_contents1_6.png') no-repeat center 55px;}
.maincontents .section.section1 .d_area ul li a.ico7 {background: url('/images/hmpg/main_contents1_7.png') no-repeat center 50px;}
.maincontents .section.section1 .d_area ul li a:hover {background-color: #c65100; border-color: #c65100; color: #fff;}

.maincontents .section.section2 {padding: 75px 0 70px; background: url('/images/hmpg/bg_main_section2.png') no-repeat center / cover;}
.maincontents .section.section2 .d_area .title_box h2 {color: #fff;}
.maincontents .section.section2 .d_area .search_box {display: flex; display:-webkit-flex; justify-content: space-between;}
.maincontents .section.section2 .d_area .search_box .optionbox {width: 50%; height: 83px; margin-right: 10px;}
.maincontents .section.section2 .d_area .search_box .optionbox select {padding: 0 30px;}
.maincontents .section.section2 .d_area .search_box .optionbox:last-child {margin-right: 0;}
.maincontents .section.section2 .d_area ul {margin-top: 30px; display: flex; display:-webkit-flex; justify-content: space-between;}
.maincontents .section.section2 .d_area ul li {margin-right: 10px; width: calc((100% - 260px)/7);}
.maincontents .section.section2 .d_area ul li:last-child {margin-right: 0;}
.maincontents .section.section2 .d_area ul li a {display: block; height: 70px; line-height: 66px; font-size: 18px; text-align: center; color: #fff; border-radius: 10px; border: 2px solid #fff;}
.maincontents .section.section2 .d_area ul li.active a {color: #fff; background-color: #c65100; border: 2px solid #c65100;}
.maincontents .section.section2 .d_area ul li.btn_serviceSearch {width: 190px !important;}
.maincontents .section.section2 .d_area ul li.btn_serviceSearch a {background-color: #c65100; border-color: #c65100; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section2 .d_area ul li.btn_serviceSearch a img {margin-right: 15px;}
.maincontents .section.section2 .d_area ul li.btn_serviceSearch a:hover {background-color: #423c9c; border-color: #423c9c;}

.maincontents .section.section3 {padding: 60px 0; background-color: #f6f7fb;}
.maincontents .section.section3 .d_area {display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.maincontents .section.section3 .d_area .title_box {margin-bottom: 0; width: 230px;}
.maincontents .section.section3 .d_area ul {width: calc(100% - 230px); display: flex; display:-webkit-flex;}
.maincontents .section.section3 .d_area ul li {margin-right: 10px; width: 16.66666666666667%;}
.maincontents .section.section3 .d_area ul li:last-child {margin-right: 0;}
.maincontents .section.section3 .d_area ul li a {display: block; height: 54px; line-height: 52px; font-size: 18px; text-align: center; color: #666; background-color: #fff; border-radius: 54px; border: 1px solid #ddd; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section3 .d_area ul li a:hover {color: #fff; background-color: #c65100; border: 1px solid #c65100;}

.maincontents .section.section4 {padding: 90px 0 80px;}
.maincontents .section.section4 .d_area {display: flex; display:-webkit-flex; justify-content: space-between;}
.maincontents .section.section4 .d_area .title_box {margin-bottom: 20px;}
.maincontents .section.section4 .d_area .title_box h2 {font-size: 26px;}
.maincontents .section.section4 .d_area .title_box .btn_more .icon {width: 25px; height: 25px; background-color: #666; border-radius: 25px;}
.maincontents .section.section4 .d_area .title_box .btn_more .icon::after, 
.maincontents .section.section4 .d_area .title_box .btn_more .icon::before {left: 6px; top: calc(50% - 1px); width: 13px; height: 1px; background-color: #fff;} 
.maincontents .section.section4 .d_area .section4_notice {width: calc(100% - 380px); margin-right: 50px;}
.maincontents .section.section4 .d_area .section4_notice ul {display: flex; display:-webkit-flex; justify-content: space-between;}
.maincontents .section.section4 .d_area .section4_notice ul li {margin-right: 25px; width: 33.333%; height: auto;}
.maincontents .section.section4 .d_area .section4_notice ul li:last-child {margin-right: 0;}
.maincontents .section.section4 .d_area .section4_notice ul li a {padding: 25px; display: block; width: 100%; border: 1px solid #ddd; border-radius: 15px; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section4 .d_area .section4_notice ul li a .tit {height: 60px; font-size: 19px; font-weight: 500; line-height: 30px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.maincontents .section.section4 .d_area .section4_notice ul li a .txt {height: 78px; margin: 18px 0; font-size: 16px; line-height: 26px; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.maincontents .section.section4 .d_area .section4_notice ul li a .date {font-size: 15px; line-height: 26px; color: #666;}
.maincontents .section.section4 .d_area .section4_notice ul li:hover a {border: 1px solid #c65100;}
.maincontents .section.section4 .d_area .section4_sns {width: 330px;}
.maincontents .section.section4 .d_area .section4_sns ul li {margin-bottom: 13px; width: 100%;}
.maincontents .section.section4 .d_area .section4_sns ul li.sns1 {background: url('/images/hmpg/icon_main_section4_instargram.png') no-repeat 7px 7px;}
.maincontents .section.section4 .d_area .section4_sns ul li.sns2 {background: url('/images/hmpg/icon_main_section4_blog.png') no-repeat 7px 7px;}
.maincontents .section.section4 .d_area .section4_sns ul li.sns3 {background: url('/images/hmpg/icon_main_section4_youtube.png') no-repeat 7px 7px;}
.maincontents .section.section4 .d_area .section4_sns ul li a {padding-left: 84px; position: relative; display: block; height: 75px; line-height: 73px; border: 1px solid #ddd; border-radius: 75px; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section4 .d_area .section4_sns ul li a::after {content: ''; position: absolute; top: 16px; right: 24px; width: 40px; height: 40px; background: #d6d6d6 url('/images/hmpg/icon_main_section4_arrow.png') no-repeat center; border-radius: 40px; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.maincontents .section.section4 .d_area .section4_sns ul li a span {font-size: 20px; letter-spacing: -0.5px; color: #666;}
.maincontents .section.section4 .d_area .section4_sns ul li a:hover {border: 1px solid #c65100;}
.maincontents .section.section4 .d_area .section4_sns ul li a:hover::after {background-color: #c65100;}

.maincontents .section.section5 .d_area {padding-top: 0;}
.maincontents .section.section5 .d_area .title_box {margin-bottom: 25px;}
.maincontents .section.section5 .d_area .title_box h2 {font-size: 26px;}
.maincontents .section.section5 .d_area .slide_box.site {position: relative; margin-bottom: 35px; padding: 0 50px; width: 100%;}
.maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide {padding: 0 5px;}
.maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide a { width: 100%; height: 70px; border: 1px solid #d7d7d7; border-radius: 15px; display: flex !important; display:-webkit-flex !important; align-items: center; justify-content: center;}
.maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide a img {max-width: 80%; max-height: 80%;}
.maincontents .section.section5 .d_area .slide_box.site .slick-arrow {opacity: 1; top: calc(50% - 18px); width: 36px; height: 36px; border: 1px solid #d7d7d7; border-radius: 36px;}
.maincontents .section.section5 .d_area .slide_box.site .slick-prev.slick-arrow {left: 0;}
.maincontents .section.section5 .d_area .slide_box.site .slick-next.slick-arrow {right: 0;}
.maincontents .section.section5 .d_area .slide_box.site .slick-arrow::after, 
.maincontents .section.section5 .d_area .slide_box.site .slick-arrow::before {left: 12px; top: 16px; width: 10px; height: 1px; background-color: #666; border-radius: 5px;}

.bottomarea {background-color: #ecedf0;}
.bottomarea .d_area {position: relative; padding: 40px 0 60px;}
.bottomarea .d_area .agree_area {margin-bottom: 30px; display: flex; display:-webkit-flex;}
.bottomarea .d_area .agree_area > li {margin-left: 20px;}
.bottomarea .d_area .agree_area > li:first-child {margin-left: 0;}
.bottomarea .d_area .agree_area > li a {color: #666;}
.bottomarea .d_area .agree_area > li.pri a {color: #333; font-weight: 500;}
.bottomarea .familysite {position: absolute; right: 0; top: 40px; display: flex; display:-webkit-flex;}
.bottomarea .familysite:first-child {margin-left: 0;}
.bottomarea .dropdown {position: relative; margin-left: 30px; display: flex; display:-webkit-flex;}
.bottomarea .dropdown:first-child {margin-left: 0;}
.bottomarea .dropdown .select {z-index: 21; position: relative; padding-right: 55px; min-width: 210px; height: 50px; font-size: 14px; line-height: 48px; text-align: left; border: 1px solid #b7b7b7;}
.bottomarea .dropdown .select::after, .bottomarea .dropdown .select::before {content: ''; position: absolute; top: 50%; width: 7px; height: 1px; background-color: #666; transition: 0.3s;}
.bottomarea .dropdown .select::after {right: 20px; transform: rotate(45deg);}
.bottomarea .dropdown .select::before {right: 25px; transform: rotate(-45deg);}
.bottomarea .dropdown.open .select::after {transform: rotate(-45deg);}
.bottomarea .dropdown.open .select::before {transform: rotate(45deg);}
.bottomarea .dropdown .select .dropdown-label {overflow: hidden; padding-left: 12px; display: block; color: #666; text-overflow: ellipsis; white-space: nowrap;}
.bottomarea .dropdown .go {z-index: 10; position: relative; width: 50px; height: 100%; line-height: 48px; text-align: center; border: 1px solid #b7b7b7; border-left: 0;}
.bottomarea .dropdown .dropdown-menu {overflow-y: auto; position: absolute; left: 0; bottom: 0; padding: 18px; width: 210px; max-height: 50vh; height: 49px; border: 1px solid #b7b7b7; background-color: #fff; transition: 0.3s; opacity: 0;}
.bottomarea .dropdown:nth-child(1) .dropdown-menu {width: calc(100% - 50px);}
.bottomarea .dropdown.open .dropdown-menu {bottom: 49px; height: auto; opacity: 1; z-index: 999;}
.bottomarea .dropdown.open .dropdown-menu li {margin-bottom: 10px;}
.bottomarea .dropdown.open .dropdown-menu li:last-child {margin-bottom: 0;}
.bottomarea .dropdown.open .dropdown-menu a {display: block; color: #666; font-size: 14px; line-height: 20px;}
.bottomarea .d_area .address_box {display: flex; display:-webkit-flex; align-items: start;}
.bottomarea .d_area .address_box > img {width: 9%;}
.bottomarea .d_area .address_box address {margin-left: 20px;}
.bottomarea .d_area .address_box address p {font-size: 14px; line-height: 26px; color: #666;}
.bottomarea .d_area .address_box address p span {margin-left: 15px;}
.bottomarea .d_area .address_box address p.copyright {font-size: 13px;}

/* WA 20250228 추가 */
.bottomarea .d_area .address_box:has(.wa) {padding-top: 20px;}
.bottomarea .d_area .address_box:has(.wa) address {flex-grow: 1;}
.bottomarea .d_area .address_box .wa a {display: block;}
.bottomarea .d_area .address_box .wa img {block-size: 54px;}

/*팝업*/
.modal {display: none; overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 600; -webkit-overflow-scrolling: touch; outline: 0; background-color: rgba(0, 0, 0, 0.6);}
.modal.on {display: block;}
.popup {overflow-y: auto; overflow-x: hidden; z-index: 1100; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 40px; width: 420px; max-height: calc(100% - 30px); max-width: calc(100% - 30px); background: #fff;}
.popup .popup_title {margin-bottom: 40px;}
.popup .popup_title h3 {color: #222; font-size: 30px; font-weight: 600; font-family: 'Nanum Square', sans-serif;}
.modal .modal_close {position: absolute; right: 0; top: 0; flex: none; width: 50px; height: 50px; background-color: #0a32ba;}
.modal .modal_close::after, .modal .modal_close::before {content: ''; position: absolute; left: calc(50% - 15px); top: calc(50% - 1px); width: 31px; height: 1px; background-color: #fff; transform-origin: center;}
.modal .modal_close::after {transform: rotate(-45deg);}
.modal .modal_close::before {transform: rotate(45deg);}
.popup .popup_inner {word-break: keep-all;}
.popup .popup_inner .text_box h4 {margin-bottom: 15px; color: #0a32ba; font-size: 18px;}
.popup.img_box {overflow-y: auto; padding: 0; display: flex; display:-webkit-flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: transparent; border: 0;}
.popup.img_box img {max-height: 100%;}
#popup-img .modal_close {z-index: 1161; position: fixed; right: 10px; top: 10px;}
.popup.privacy {width: 1000px; display: flex; display:-webkit-flex; flex-flow: column;}
.popup.privacy .popup_inner {overflow: auto;}

/*메인팝업*/
.popup.main {padding: 0; transform: translate(0, 0); border: 1px solid #000;}
.popup.main .popup_title {margin-bottom: 25px;}
.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;}

/*서브팝업*/
.popup.popup1 {padding: 0;}
.popup.popup1 .popup_title {padding: 0 20px; height: 46px; line-height: 46px; margin-bottom: 0; background-color: #000;}
.popup.popup1 .popup_title h3 {font-size: 15px; color: #fff;}
.popup.popup1 .popup_inner {padding: 35px 20px 40px;}
.popup.popup1 .popup_inner p {text-align: center;}
.popup.popup1 .popup_inner p.txt1 {font-size: 16px; font-weight: 500; color: #333;}
.popup.popup1 .popup_inner p.txt2 {margin-top: 10px; font-size: 15px; line-height: 26px; color: #666;}
.modal .popup.popup1 .modal_close {top: 15px; right: 15px; width: 16px; height: 16px; background: none;}
.modal .popup.popup1 .modal_close::after, .modal .popup.popup1 .modal_close::before {left: calc(50% - 10px); width: 20px;}

/*게시판팝업*/
.popup.board {padding: 0; width: 400px; overflow-y: auto;}
.popup.board .popup_title {margin-bottom: 0; padding-left: 20px; height: 46px; line-height: 46px; background-color: #111;}
.popup.board .popup_title h3 {color: #fff; font-size: 15px;}
.popup.board .popup_inner {padding: 25px 25px 30px;}
.popup.board .popup_inner .popup_txt {font-size: 15px; line-height: 26px; color: #666;}
.popup.board .popup_inner .board_box {margin-bottom: 30px; padding: 30px; background-color: #f9f9f9;}
.popup.board .popup_inner .board_box p {font-size: 18px; font-weight: 500; text-align: center; color: #333;}
.popup.board .popup_inner .board_box p span {color: #104dec;}
.popup.board .popup_inner .popup_top {text-align: center;}
.popup.board .popup_inner .popup_top span.tit {font-size: 25px; font-weight: 500;}
.popup.board .popup_inner .popup_top p {margin: 20px 0;}
.popup.board .modal_close {background: 0; right: 0; top: 0; width: 46px; height: 46px;}
.popup.board .modal_close::after, .popup.board .modal_close::before {left: calc(50% - 10px); top: 50%; width: 20px;}
.popup.board .button_box {margin-top: 25px;}
.popup.board .tablebasic table tr td.email .button_box {margin-top: 10px;}
.popup.board .boardview {margin-top: 0;}

/*사이트맵팝업*/
.popup.sitemap {padding: 0; width: 1400px; height: 100%; overflow-y: auto;}
.popup_sitemap_wrap {position: relative; max-width: 1280px; width: 100%; margin: 0 auto;}
.popup.sitemap .popup_title {margin-bottom: 0; padding: 50px 0 40px; border-bottom: 1px solid #555;}
.popup.sitemap .popup_title h3 {font-size: 26px; color: #000;}
.popup.sitemap .popup_inner .section {padding-top: 30px; display: flex; display:-webkit-flex; border-bottom: 1px solid #ddd;}
.popup.sitemap .popup_inner .section:last-child {border-bottom: 0;}
.popup.sitemap .popup_inner .section > span {display: block; width: 225px; font-size: 22px; font-weight: 500; color: #c65100;}
.popup.sitemap .popup_inner .section > ul {display: flex; display:-webkit-flex; flex-wrap: wrap; width: calc(100% - 225px);}
.popup.sitemap .popup_inner .section > ul > li {width: calc(25% - 22.5px); margin-right: 30px; margin-bottom: 30px;}
.popup.sitemap .popup_inner .section > ul > li:nth-child(4n) {margin-right: 0;}
.popup.sitemap .popup_inner .section > ul > li > a {font-size: 18px; font-weight: 500; color: #333;}
.popup.sitemap .popup_inner .section > ul > li > ul {margin-top: 10px;}
.popup.sitemap .popup_inner .section > ul > li > ul > li {padding-left: 10px; position: relative; line-height: 30px;}
.popup.sitemap .popup_inner .section > ul > li > ul > li::before {content: '-'; position: absolute; top: 0; left: 0;}
.popup.sitemap .popup_inner .section > ul > li > ul > li a {font-size: 16px; color: #707070;}
.popup.sitemap .modal_close {background: 0; right: 0; top: 48px; width: 26px; height: 26px;}
.popup.sitemap .modal_close::after, .popup.sitemap .modal_close::before {left: calc(50% - 15px); top: 50%; width: 30px; background-color: #000;}

/*QR*/
.qr {padding: 60px 15px; margin: 0 auto; width: 500px;}
.qr h1 {padding-bottom: 30px; font-size: 22px; font-weight: 600; text-align: center; font-family: 'Nanum Square', sans-serif;}
.qr .btn_close {position: absolute; top: 15px; right: 15px;}
.qr .btn_close .icon {width: 18px; height: 18px;}
.qr .btn_close .icon::after, .qr .btn_close .icon::before {left: -2px; top: 8px; width: 22px;}
.qr .btn_cancel {width: 100%; height: 45px; font-size: 15px; background-color: #717684; color: #fff;}
.qr .qr_box {margin-bottom: 30px; text-align: center;}
.qr .qr_box .qr_img {margin: 0 auto; width: 140px; height: 140px;}
.qr .qr_box .qr_img img {width: 100%; height: 100%;}
.qr .qr_box .txt1 {margin: 10px 0 20px; font-size: 15px; font-weight: 500;}
.qr .qr_box .txt1 span {color: #fd0000;}
.qr .qr_box .txt2 {font-size: 12px; line-height: 18px;}
.qr_produce {margin: 20px 0 50px; padding: 0 20px; display: flex; display:-webkit-flex;}
.qr_produce li {margin-right: 20px; position: relative; width: 50%; text-align: center; border-radius: 10px;}
.qr_produce li.start {background-color: #f0831e;}
.qr_produce li.end {background-color: #214ab1;}
.qr_produce li:last-child {margin-right: 0;}
.qr_produce li:after {content: ""; display: block; padding-bottom: 100%;}
.qr_produce li a {display: block; position: absolute; left: 0; width: 100%; height: 100%; font-size: 16px; color: #fff;}
.qr_produce li a span {width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.qr_camera {margin: 20px 0 50px; padding: 0 15px; display: flex; display:-webkit-flex;}
.qr_camera li {margin-right: 10px; padding: 20px 20px 10px; position: relative; width: 50%; text-align: center; border-radius: 10px;}
.qr_camera li p {margin-bottom: 15px; font-size: 16px; font-weight: 500; }
.qr_camera li.start {border: 2px solid #f0831e;}
.qr_camera li.start p {color: #f0831e;}
.qr_camera li.end {border: 2px solid #3f6bdb}
.qr_camera li.end p {color: #3f6bdb;}
.qr_camera li:last-child {margin-right: 0;}
.qr_camera li a {margin-bottom: 5px; display: block; width: 100%; height: 25px; line-height: 23px; font-size: 13px;}
.qr_camera li.start a {background-color: #f0831e; color: #fff;}
.qr_camera li.end a {background-color: #3f6bdb; color: #fff;}
.qr .qr_notice {margin-top: 25px;}
.qr .qr_notice h2 {font-size: 15px; font-weight: 500; color: #000;}
.qr .qr_notice ul {margin-top: 12px;}
.qr .qr_notice ul li {margin-bottom: 8px; padding-left: 18px; position: relative; font-size: 12px; line-height: 18px; color: #333;}
.qr .qr_notice ul li:last-child {margin-bottom: 0;}
.qr .qr_notice ul li span {position: absolute; top: 0; left: 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 .error_box {padding: 0 50px 50px; width: 780px; text-align: center; word-break: keep-all;}
.error .error_box p.p1 {margin: 60px 0; font-size: 40px; font-weight: 600; font-family: 'Nanum Square', sans-serif;}
.error .error_box p.p2 {font-size: 18px;}

/*오픈준비중*/
.preparing {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;}
.preparing .preparing_box {padding: 30px; text-align: center; word-break: keep-all;}
.preparing .preparing_box p.p1 {margin: 80px 0 40px; padding-bottom: 20px; font-size: 60px; line-height: 60px; font-weight: 600; font-family: 'Jalnan'; border-bottom: 6px solid #000;}
.preparing .preparing_box p.p1 span {color: #c65100;}
.preparing .preparing_box p.p2 {font-size: 40px; line-height: 40px; font-weight: 600;}



@media screen and (max-width:1500px) {
    /*사이트맵팝업*/
    .popup.sitemap {padding: 0 30px; width: 100%;}
    .popup.sitemap .popup_title {padding: 50px 0 40px;}
    .popup.sitemap .popup_inner .section > ul > li {width: calc(33.33333% - 20px);}
    .popup.sitemap .popup_inner .section > ul > li:nth-child(3n) {margin-right: 0;}
    .popup.sitemap .popup_inner .section > ul > li:nth-child(4n) {margin-right: 30px;}
}
@media screen and (max-width:1440px) {
    .toparea h1 {left: 15px; top: 36px;}
    .toparea .topmenu .gnb {width: 800px;}
    .toparea .topmenu .gnb > li > a {font-size: 18px;}
    .toparea .topmenu .gnb > li .menu_list {padding: 30px 15px;}
    .toparea .membershiparea {right: 15px;}
    .toparea .total_search_area .btn_close {right: 15px;}
    .maincontents .section.section1 .d_area {padding:60px 15px;}
    .maincontents .section.section1 .d_area ul li a {font-size: 18px;}
    .maincontents .section.section2 .d_area ul li a {font-size: 16px;}
    .bottomarea .d_area {position: relative; padding: 40px 15px 60px;}
    .bottomarea .familysite {right: 15px}

    .maincontents .main_visual .main_slide .slick-arrow.slick-prev {left: 15px;}
    .maincontents .main_visual .main_slide .slick-arrow.slick-next {right: 15px;}
    .maincontents .main_visual .slick-dots {right: 55px;}
    .maincontents .main_visual .slick-pause {right: 30px;}
}
@media screen and (max-width:1250px) {
    .toparea h1 a img {height: 50px;}
    .toparea .topmenu .gnb {padding-left: 50px; width: 700px;}

    /*사이트맵팝업*/
    .popup.sitemap .popup_inner .section > ul > li {width: calc(50% - 15px);}
    .popup.sitemap .popup_inner .section > ul > li:nth-child(2n) {margin-right: 0;}
    .popup.sitemap .popup_inner .section > ul > li:nth-child(3n) {margin-right: 30px;}

    .maincontents .main_visual .slick-dots {right: 40px;}
    .maincontents .main_visual .slick-pause {right: 15px;}
}
@media screen and (max-width:1024px) {
    /*메뉴*/
    #seoul-common-gnb {display: none;}
    .toparea {z-index: 200; position: relative;}
    .toparea {position: relative; padding-bottom: 0;}
    .toparea h1 {z-index: 80; position: absolute; top: 10px; left: 15px;}
    .toparea h1 a img {width: auto; height: 40px;}
    .toparea .topmenu {height: 60px; border-top: 0;}
    .toparea .topmenu:hover {background: #fff;}
    .toparea .topmenu .gnb {display: none; display:-webkit-none;}
    .toparea .topmenu .btn_allgnb {display: block; z-index: 210; position: absolute; right: 15px; top: 23px; transform: translateY(0); width: 20px; height: 14px;}
    .toparea .topmenu .btn_allgnb span {position: absolute; left: 0; display: block; width: 20px; height: 2px; background-color: #000;}
    .toparea .topmenu .btn_allgnb span.line1 {top: 0;}
    .toparea .topmenu .btn_allgnb span.line2 {top: 100%; transform: translateY(-50%);}
    .toparea .membershiparea {top: 20px; right: 55px;}
    .toparea .membershiparea li {padding-right: 0; margin-left: 0;}
    .toparea .membershiparea li::after {display: none;}
    .toparea .membershiparea li a {display: none;}
    .toparea .membershiparea li button.btn_search {margin-right: 0; transform: scale(0.85);}
    .toparea .total_search_area {top: 59px; padding: 15px; height: auto; background-color: #fff; border-top: 0; box-shadow: none;}
    .toparea .total_search_area .btn_close {top: -40px; right: 55px; transform: scale(0.85);}
    .toparea .total_search_area .box_wrap {margin: 0 auto; padding-top: 5px; position: static !important; width: 100%; border-radius: 0; box-shadow: none;}
    .toparea .total_search_area .box_wrap.active {margin: 0 auto; padding-top: 5px; position: static !important; width: 100%; border-radius: 0; box-shadow: none;}
    .toparea .total_search_area .box_wrap .recent_box {display: block;}
    .toparea .total_search_area .search_box {width: 100%; height: 30px;}
    .toparea .total_search_area .search_box input {padding: 0 25px 0 5px; font-size: 13px;}
    .toparea .total_search_area .search_box button.btn_search {right: 0; top: calc(50% - 15px); transform: scale(0.64);}
    .toparea .total_search_area .search_box button.btn_search .icon::after {border-width: 3px;}
    .toparea .total_search_area .search_box button.btn_search .icon::before {height: 3px;}
    .toparea .total_search_area .recent_box {border-radius: 0;} 
    .toparea .total_search_area .recent_box p.nodata {padding: 50px 0; font-size: 14px;}
    .toparea .total_search_area .recent_box span.tit {margin: 15px 0 5px; font-size: 12px;}
    .toparea .total_search_area .recent_box ul.list {padding-bottom: 15px;}
    .toparea .total_search_area .recent_box ul.list li {padding: 0; height: 25px; line-height: 23px;}
    .toparea .total_search_area .recent_box ul.list li a {padding-left: 17px;}
    .toparea .total_search_area .recent_box ul.list li a::before {width: 13px; height: 13px; background-size: 13px 13px;}
    .toparea .total_search_area .recent_box ul.list li a span.keyword {font-size: 12px;}
    .toparea .total_search_area .recent_box ul.list li a span.date {font-size: 11px;}
    .toparea .total_search_area .recent_box .recent_box_footer {margin: 0; padding: 10px 0 0;}
    .toparea .total_search_area .recent_box .recent_box_footer button {font-size: 11px; border-bottom: 0;}
    .toparea .total_search_bg.active {display: block;}

    .toparea .allmenu-category {z-index: 212; position: fixed; top: 0; transform: translateX(0); width: 100%; height: 100% !important; background-color: rgba(0, 0, 0, 0.8); animation: allmenu 1s 1;}
    @keyframes allmenu {
        0% {left: 0;}
        99% {left: 100%;}
        100% {display: none;}
    }
    .toparea .allmenu-category.active {display: block !important; animation: allmenu2 1s 1;}
    @keyframes allmenu2 {
        0% {left: 100%;}
        1% {display: block;}
        100% {left: 0;}
    }
    .toparea .allmenu-category a.logo {position: absolute; top: 10px; left: 15px;}
    .toparea .allmenu-category a.logo img {width: auto; height: 40px;}
    .toparea .allmenu-category .btn_search {position: absolute; top: 20px; right: 55px; transform: scale(0.85);}
    .toparea .allmenu-category .btn_close {position: absolute; top: 19px; right: 15px; transform: scale(0.85); background-color: #fff;}
    .toparea .allmenu-category .membership {display: block; position: relative; padding: 6px 15px 12px;}
    .toparea .allmenu-category .membership p.txt {margin-bottom: 10px; font-size: 14px; color: #666;}
    .toparea .allmenu-category .membership p.txt span {color: #0a32ba; font-weight: 500;}
    .toparea .allmenu-category .membership a.login {font-size: 12px; color: #666;}
    .toparea .allmenu-category .membership a.join {position: absolute; top: 0; right: 15px; width: 65px; height: 30px; line-height: 28px; font-size: 12px; text-align: center; border-radius: 30px; border: 1px solid #ddd; color: #666;}
    .toparea .allmenu-category .membership a.logout {position: absolute; top: 0; right: 15px; width: 65px; height: 30px; line-height: 28px; font-size: 12px; text-align: center; border-radius: 30px; border: 1px solid #ddd; color: #666;}
    .toparea .allmenu-category .d_area {padding: 0;}
    .toparea .allmenu-category .menu_box {overflow-y: auto; position: relative; padding-top: 60px; height: 100%; background-color: #fff;}
    .toparea .allmenu-category .menu_box .all_gnb {display: block; border-top: 1px solid #acb5bb;}
    .toparea .allmenu-category .menu_box .all_gnb > li {display: flex; display:-webkit-flex; width: 100%; height: 50px; position: relative;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a {z-index: 99; padding: 0 10px; display: block; position: absolute; top : 0; left: 0; width: 95px; font-size: 12px; font-weight: 500; height: 50px; line-height: 50px; text-align: center; background-color: #fff; color: #000;}
    .toparea .allmenu-category .menu_box .all_gnb > li > a .icon {display: none !important; position: relative; margin-left: 10px; display: inline-block; width: 10px; height: 10px;}
    .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: 50%; width: 100%; height: 1px; background-color: #333;}
    .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::before {transform: rotate(0deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list {z-index: 9; display: none; position: absolute; right: 0; top: 0px; width: 100%; min-height: 251px; border-bottom: 1px solid #acb5bb; background: url('/images/hmpg/bg_allmenu.png') repeat-y 0 0;}
    .toparea .allmenu-category .menu_box .all_gnb.login > li .menu_list {min-height: 351px;}
    .toparea .allmenu-category .menu_box .all_gnb > li.active .menu_list {display: block;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(2) .menu_list {top: -50px;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(3) .menu_list {top: -100px;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(4) .menu_list {top: -150px;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(5) .menu_list {top: -200px;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(6) .menu_list {top: -250px;}
    .toparea .allmenu-category .menu_box .all_gnb > li:nth-child(7) .menu_list {top: -300px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li {margin-left: 96px; line-height: 49px; background-color: #f7f7f7; border-bottom: 1px solid #acb5bb;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li:last-child {border-bottom: 0;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a {padding: 0 10px; display: block; width: 100%; height: 100%; font-size: 14px; font-weight: 500; letter-spacing: 0; color: #333;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > a .icon {margin-left: 10px; position: relative; display: inline-block; width: 10px; height: 10px;}
    .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: 50%; width: 100%; height: 1px; background-color: #333;}
    .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::before {transform: rotate(0deg);}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul {display: none; padding: 13px; background-color: #fff; border-top: 1px solid #acb5bb;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li {position: relative; padding-left: 8px; line-height: 26px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li::before {content: ''; position: absolute; left: 0; top: 12px; width: 2px; height: 2px; border-radius: 2px; background-color: #666;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul {display: flex !important; display:-webkit-flex !important;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul li {position: relative; margin-right: 20px;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul li:last-child {margin-right: 0;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul li::after {position: absolute; top: calc(50% - 5px); left: -12px; content: ''; display: block; width: 1px; height: 10px; background-color: #888;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul li:first-child::after {display: none;}
    .toparea .allmenu-category .menu_box .all_gnb > li .menu_list > li > ul > li > ul li a {font-size: 12px; color: #888;}

    .maincontents {padding-top: 60px;}
    .maincontents .main_visual .main_slide .slick-arrow {transform: scale(0.4);}
    .maincontents .main_visual .main_slide .slick-arrow.slick-prev {left: -5px;}
    .maincontents .main_visual .main_slide .slick-arrow.slick-next {right: -5px; transform: scale(0.4) rotate(180deg);}
    .maincontents .main_visual .slick-dots {bottom: 18px;}
    .maincontents .main_visual .slick-dots li {width: 10px; height: 10px;}
    .maincontents .main_visual .slick-dots li button {width: 10px; height: 10px;}
    .maincontents .main_visual .slick-pause {bottom: 15px; width: 18px; height: 18px; background: #575757 url('/images/hmpg/icon_stop.png') no-repeat center / 6px auto;}
    .maincontents .main_visual .slick-arrow {top: calc(50% - 28px);}
    .maincontents .main_visual .pro-bar {bottom: 28px;}
    
    .maincontents .section .title_box {margin-bottom: 15px;}
    .maincontents .section .title_box h2 {font-size: 20px;}
    .maincontents .section.section1 .d_area {padding: 25px 15px;}
    .maincontents .section.section1 .d_area ul {flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: center;}
    .maincontents .section.section1 .d_area ul li {width: calc(33.3333333% - 4px); margin-right: 5px; margin-bottom: 5px;}
    .maincontents .section.section1 .d_area ul li:nth-child(3) {margin-right: 0;}
    .maincontents .section.section1 .d_area ul li:last-child {margin-right: 0;}
    .maincontents .section.section1 .d_area ul li a {padding-top: 74px; height: 102px; font-size: 9px; line-height: 12px; border-radius: 10px; color: #000; border: 2px solid #cfcfcf;}
    .maincontents .section.section1 .d_area ul li a.ico1 {background: url('/images/hmpg/main_contents1_1.png') no-repeat center 14px / auto 40px;}
    .maincontents .section.section1 .d_area ul li a.ico2 {background: url('/images/hmpg/main_contents1_2.png') no-repeat center 14px / auto 40px;}
    .maincontents .section.section1 .d_area ul li a.ico3 {padding-top: 68px; background: url('/images/hmpg/main_contents1_3.png') no-repeat center 18px / auto 34px;}
    .maincontents .section.section1 .d_area ul li a.ico4 {background: url('/images/hmpg/main_contents1_4.png') no-repeat center 15px / auto 40px;}
    .maincontents .section.section1 .d_area ul li a.ico5 {background: url('/images/hmpg/main_contents1_5.png') no-repeat center 17px / auto 38px;}
    .maincontents .section.section1 .d_area ul li a.ico6 {background: url('/images/hmpg/main_contents1_6.png') no-repeat center 17px / auto 38px;}
    .maincontents .section.section1 .d_area ul li a:hover {background-color: #fff; border-color: #cfcfcf; color: #000;}

    .maincontents .section.section2 {padding: 30px 0 80px;}
    .maincontents .section.section2 .d_area .search_box .optionbox {width: 50%; height: 42px; margin-right: 5px;}
    .maincontents .section.section2 .d_area .search_box .optionbox select {padding: 0 10px;}
    .maincontents .section.section2 .d_area .search_box .optionbox:last-child {margin-right: 0;}
    .maincontents .section.section2 .d_area ul {margin-top: 15px; display: block; overflow: hidden;}
    .maincontents .section.section2 .d_area ul li {margin-right: 5px; margin-bottom: 5px; width: calc(25% - 3.75px); float: left;}
    .maincontents .section.section2 .d_area ul li:nth-child(4n) {margin-right: 0;}
    .maincontents .section.section2 .d_area ul li a {height: 35px; line-height: 33px; font-size: 9px; border-radius: 5px; border: 1px solid #fff;}
    .maincontents .section.section2 .d_area ul li.btn_serviceSearch {position: absolute; left: calc(50% - 47.5px); bottom: 30px; width: 95px !important;}
    .maincontents .section.section2 .d_area ul li.btn_serviceSearch a img {margin-right: 7px; width: 12px; height: 12px;}

    .maincontents .section.section3 {padding: 30px 0;}
    .maincontents .section.section3 .d_area {display: block;}
    .maincontents .section.section3 .d_area .title_box {margin-bottom: 10px; width: auto;}
    .maincontents .section.section3 .d_area ul {width: 100%; display: block; overflow: hidden;}
    .maincontents .section.section3 .d_area ul li {margin-right: 5px; margin-bottom: 5px; width: calc(50% - 2.5px); float: left;}
    .maincontents .section.section3 .d_area ul li:nth-child(2n) {margin-right: 0;}
    .maincontents .section.section3 .d_area ul li a {height: 35px; line-height: 33px; font-size: 9px; border-radius: 33px;}

    .maincontents .section.section4 {padding: 40px 0;}
    .maincontents .section.section4 .d_area {display: block;}
    .maincontents .section.section4 .d_area .title_box {margin-bottom: 15px;}
    .maincontents .section.section4 .d_area .title_box h2 {font-size: 20px;}
    .maincontents .section.section4 .d_area .title_box .btn_more .icon {width: 20px; height: 20px; border-radius: 20px;}
    .maincontents .section.section4 .d_area .title_box .btn_more .icon::after, 
    .maincontents .section.section4 .d_area .title_box .btn_more .icon::before {left: 5px; width: 10px;} 
    .maincontents .section.section4 .d_area .section4_notice {width: 100%; margin-right: 0; margin-bottom: 40px;}
    .maincontents .section.section4 .d_area .section4_notice ul {display: block;}
    .maincontents .section.section4 .d_area .section4_notice ul li {margin-right: 0; margin-bottom: 5px; width: 100%;}
    .maincontents .section.section4 .d_area .section4_notice ul li a {padding: 15px; border-radius: 10px;}
    .maincontents .section.section4 .d_area .section4_notice ul li a .tit {height: auto; font-size: 15px; line-height: 23px;}
    .maincontents .section.section4 .d_area .section4_notice ul li a .txt {height: auto; margin: 13px 0; font-size: 11px; line-height: 18px;}
    .maincontents .section.section4 .d_area .section4_notice ul li a .date {font-size: 10px; line-height: 20px;}
    .maincontents .section.section4 .d_area .section4_sns {width: 100%;}
    .maincontents .section.section4 .d_area .section4_sns ul li {margin-bottom: 5px;}
    .maincontents .section.section4 .d_area .section4_sns ul li.sns1 {background: url('/images/hmpg/icon_main_section4_instargram.png') no-repeat 5px 5px / 42px auto;}
    .maincontents .section.section4 .d_area .section4_sns ul li.sns2 {background: url('/images/hmpg/icon_main_section4_blog.png') no-repeat 5px 5px / 42px auto;}
    .maincontents .section.section4 .d_area .section4_sns ul li.sns3 {background: url('/images/hmpg/icon_main_section4_youtube.png') no-repeat 5px 5px / 42px auto;}
    .maincontents .section.section4 .d_area .section4_sns ul li a {padding-left: 56px; height: 50px; line-height: 50px; border-radius: 45px;}
    .maincontents .section.section4 .d_area .section4_sns ul li a::after {top: 10px; right: 12px; width: 27px; height: 27px; background: #d6d6d6 url('/images/hmpg/icon_main_section4_arrow.png') no-repeat center / 16px auto; border-radius: 27px;}
    .maincontents .section.section4 .d_area .section4_sns ul li a span {font-size: 13px;}

    .maincontents .section.section5 .d_area .title_box {margin-bottom: 15px;}
    .maincontents .section.section5 .d_area .title_box h2 {font-size: 20px;}
    .maincontents .section.section5 .d_area .slide_box.site {margin-bottom: 50px; padding: 0 30px;}
    .maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide {padding: 0 5px;}
    .maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide a {height: 45px; border-radius: 10px;}
    .maincontents .section.section5 .d_area .slide_box.site .slick-slider .slick-slide a img {max-width: 60%; max-height: 60%;}
    .maincontents .section.section5 .d_area .slide_box.site .slick-arrow {top: calc(50% - 12px); width: 25px; height: 25px; border-radius: 25px;}
    .maincontents .section.section5 .d_area .slide_box.site .slick-arrow::after, 
    .maincontents .section.section5 .d_area .slide_box.site .slick-arrow::before {left: 8px; top: 11px; width: 7px; height: 1px;}

    .bottomarea {background-color: #ecedf0;}
    .bottomarea .d_area {padding: 25px 15px 55px;}
    .bottomarea .d_area .agree_area {margin-bottom: 20px; justify-content: center;}
    .bottomarea .d_area .agree_area > li {margin-left: 15px;}
    .bottomarea .d_area .agree_area > li:last-child {display: none;}
    .bottomarea .d_area .agree_area > li a {font-size: 11px; line-height: 13px;}
    .bottomarea .familysite {top: 65px; left: calc(50% - 90px);}
    .bottomarea .dropdown .select {padding-right: 33px; min-width: 0; width: 145px; height: 35px; line-height: 33px; font-size: 10px;}
    .bottomarea .dropdown .select::after {right: 10px;}
    .bottomarea .dropdown .select::before {right: 15px;}
    .bottomarea .dropdown .select .dropdown-label {padding-left: 10px;}
    .bottomarea .dropdown .go {width: 35px; height: 100%; line-height: 33px; font-size: 10px;}
    .bottomarea .dropdown:nth-child(1) .dropdown-menu {width: calc(100% - 35px);}
    .bottomarea .dropdown .dropdown-menu {overflow-y: auto; position: absolute; left: 0; bottom: 0; padding: 12px; max-height: 35vh; height: 33px;}
    .bottomarea .dropdown.open .dropdown-menu {bottom: 34px;}
    .bottomarea .dropdown.open .dropdown-menu a {font-size: 10px; line-height: 18px;}
    .bottomarea .d_area .address_box {padding-top: 60px; display: block; text-align: center;}
    .bottomarea .d_area .address_box > img {width: 90px; height: auto;}
    .bottomarea .d_area .address_box address {margin-left: 0; margin-top: 20px;}
    .bottomarea .d_area .address_box address p {font-size: 9px; text-align: center; line-height: 15px;}
    .bottomarea .d_area .address_box address p span {margin-left: 5px;}
    .bottomarea .d_area .address_box address p.copyright {font-size: 9px;}

    /* WA */
    .bottomarea .d_area .address_box:has(.wa) {padding-top: 60px;}
    .bottomarea .d_area .address_box .wa {margin-top: 20px;}
    
    /*팝업*/
    .popup {padding: 20px;}
    .popup .popup_title {margin-bottom: 20px;}
    .popup .popup_title h3 {font-size: 17px;}
    .popup .popup_inner .text_box h4 {margin-bottom: 10px; font-size: 15px;}
    .popup.privacy {max-height: calc(100% - 140px);}
    .modal .modal_close {width: 35px; height: 35px; right: 0; top: 0;}
    .modal .modal_close::after, .modal .modal_close::before {left: calc(50% - 10.5px); width: 21px;}

    /*메인팝업*/
    .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;}

    /*서브팝업*/
    .popup.popup1 .popup_title {padding: 0 15px; height: 30px; line-height: 30px;}
    .popup.popup1 .popup_title h3 {font-size: 12px;}
    .popup.popup1 .popup_inner {padding: 15px 15px 20px;}
    .popup.popup1 .popup_inner p.txt1 {font-size: 13px;}
    .popup.popup1 .popup_inner p.txt2 {margin-top: 10px; font-size: 12px; line-height: 18px;}
    .modal .popup.popup1 .modal_close {top: 8px; right: 10px; width: 12px; height: 12px; background: none;}
    .modal .popup.popup1 .modal_close::after, .modal .popup.popup1 .modal_close::before {left: calc(50% - 7px); top: calc(50% - 0px); width: 14px;}
    .popup.popup1 .button_box {margin-top: 25px;}
    .popup.popup1 .button_box button {width: 100%;}

    /*게시판팝업*/
    .popup.board .popup_title {padding-left: 20px; height: 36px; line-height: 36px;}
    .popup.board .popup_title h3 {font-size: 13px;}
    .popup.board .popup_inner {padding: 15px 15px 20px;}
    .popup.board .popup_inner .popup_txt {font-size: 13px; line-height: 22px;}
    .popup.board .popup_inner .inpbox, .popup.board .popup_inner .optionbox {height: 26px;}
    .popup.board .popup_inner .board_box {margin-bottom: 20px; padding: 20px;}
    .popup.board .popup_inner .board_box p {font-size: 15px;}
    .popup.board .popup_inner .popup_top span.tit {font-size: 20px;;}
    .popup.board .popup_inner .popup_top p {margin: 10px 0;}
    .popup.board .modal_close {width: 36px; height: 36px;}
    .popup.board .modal_close::after, .popup.board .modal_close::before {left: calc(50% - 8px); top: 50%; width: 16px;}
    .popup.board .button_box {margin-top: 15px;}
    .popup.board .button_box button {width: 100%; height: 35px; line-height: 33px;}
    .popup.board .btn_check {height: 30px; font-size: 13px;}

    /*QR*/
    .qr {width: 100%;}

    /*에러페이지*/
    .error .error_box {padding: 0 30px 30px; width: 100%; border-left: 0; border-right: 0;}
    .error .error_box img {width: 120px;}
    .error .error_box p.p1 {margin: 30px 0; font-size: 20px;}
    .error .error_box p.p2 {font-size: 13px;}
    .error .button_box {padding: 0 15px; margin-top: 20px; width: 100%;}

    /*오픈준비중*/
    .preparing .preparing_box {padding: 20px;}
    .preparing .preparing_box  img {width: 220px; height: auto;}
    .preparing .preparing_box p.p1 {margin: 40px 0 20px; padding-bottom: 10px; font-size: 30px; line-height: 30px; border-bottom: 3px solid #000;}
    .preparing .preparing_box p.p2 {font-size: 20px; line-height: 20px;}
    
    .main_visual .main_slide .slick-arrow.slick-prev {left: 2%;}
	.main_visual .main_slide .slick-arrow.slick-next {right: 2%;}
	.main_visual .slick-dots {position: absolute; bottom: 35px; right: calc((100% - 400px) / 2 + 60px);}
	.main_visual .slick-pause {position: absolute; bottom: 30px; right: calc((100% - 400px) / 2 + 30px); width: 22px; height: 22px; border-radius: 22px; background: #575757 url('/images/hmpg/icon_stop.png') no-repeat center / 8px 10px;}

}
@media screen and (max-width:640px){

}
@media screen and (max-width:480px){
    /*오픈준비중*/
    .preparing .preparing_box  img {width: 180px; height: auto;}
    .preparing .preparing_box p.p1 {font-size: 24px; line-height: 24px;}
    .preparing .preparing_box p.p2 {font-size: 16px; line-height: 16px;}
}
@media screen and (max-width:360px){
    /*오픈준비중*/
    .preparing .preparing_box p.p1 {line-height: 30px;}
}
@media screen and (max-width:320px){
    
}

/* 테이블 팝업 */
.popup.table {
    width: 60%;

}
.popup.table th {
    font-weight: bold;
}
@media screen and (max-width: 1024px) {
    .popup.table {
        width: 100%;
    }
    .popup.table th[rowspan="3"] {
        display: none;
    }
}

/* Footer 서울시 배너 */
.bottomarea .d_area .address_box .footer_logo_wrap .footer_logo {
    width: 130px;
}

[class*="seoul_banner_"] {
    overflow: hidden;
}

.address_box .seoul_banner_pc {
    width: 468px;
    height: 60px;
}

.address_box .seoul_banner_mo {
    display: none;
}

.bottomarea .d_area .address_box:has(.wa) {
    gap: 5px 20px;
}

@media screen and (max-width: 1024px){
    .bottomarea .d_area .address_box .footer_logo_wrap {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .bottomarea .d_area .address_box .footer_logo_wrap .footer_logo {
        width: 90px;
        height: auto;
    }

    .address_box .seoul_banner_pc {
        display: none;
    }

    .address_box .seoul_banner_mo {
        display: block;
        /*width: 210px;
        height: 70px;*/
    }
}