@charset "utf-8";
/* 공통 영역: 송도마디의 header / nav / depth1 / footer / wrap 명칭 사용 */
.wrap { width: calc(100% - 100px); max-width: 1500px; margin: 0 auto; }
.header { position: relative; width: 100%; background: #fff; z-index: 20; }
.header .top { min-height: 45px; display: flex; align-items: center; justify-content: center; gap: 35px; padding: 10px 24px; border-bottom: 1px solid #e7e7e7; font-size: 16px; }
.header .registration { display: flex; align-items: center; gap: 12px; padding-left: 25px; border-left: 1px solid #cdd7e5; font-size: 15px; font-weight: 800; color: #4a4a4a; }
.header .registration img { width: 25px; height: 24px; object-fit: contain; }
.header .head-wrap { width: 100%; min-height: 120px; padding: 25px 50px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; border-bottom: 1px solid #e7e7e7; }
.header .logo { line-height: 0; justify-self: start; }
.header .logo a { display: block; }
.header .logo img { width: 233px; height: 58px; object-fit: contain; }
.header .nav .depth1 { display: flex; align-items: center; justify-content: center; gap: 46px; white-space: nowrap; }
.header .nav .depth1 li { font-size: 18px; font-weight: 600; }
.header .nav .depth1 a { display: inline-flex; flex-direction: column; align-items: center; }
.header .nav .depth1 a::after { content: attr(data-text); height: 0; overflow: hidden; visibility: hidden; font-weight: 800; pointer-events: none; }
.header .nav .depth1 [aria-current] { color: #173e75; font-weight: 800; }
.header .nav .depth1 a:hover { color: #173e75; font-weight: 800; }
.header .tools { display: flex; align-items: center; justify-content: flex-end; justify-self: end; gap: 20px; }
.header .search { position: relative; width: 150px; height: 34px; border: 0; }
.header .search input { width: 100%; height: 34px; padding: 0 22px 0 0; border: 0; border-bottom: 1px solid #dadada; border-radius: 0; background: transparent; box-shadow: none; font-size: 14px; line-height: 34px; color: #212121; appearance: none; -webkit-appearance: none; }
.header .search input::placeholder { color: #757575; opacity: 1; }
.header .search input::-webkit-search-decoration,
.header .search input::-webkit-search-cancel-button,
.header .search input::-webkit-search-results-button { -webkit-appearance: none; appearance: none; display: none; }
.header .search input:focus,
.header .search input:focus-visible,
.header .search button:focus,
.header .search button:focus-visible { outline: none; }
.header .search button { position: absolute; right: 0; top: 50%; width: 18px; height: 32px; transform: translateY(-50%); }
.search-icon { width: 16px; height: 16px; fill: none; stroke: #212121; stroke-width: 1.7; }
.header .instagram { width: 25px; height: 25px; flex: 0 0 25px; }
.header .blog { font-family: Arial, sans-serif; font-size: 20px; font-weight: 700; color: #111; }
.header .side { display: none; width: 40px; height: 40px; flex: 0 0 40px; justify-content: center; flex-direction: column; align-items: center; gap: 5px; }
.header .side span { width: 23px; height: 2px; background: #173e75; }
#mobileMenu { border-bottom: 1px solid #e7e7e7; padding: 12px 24px; background: #f7f9fc; }
#mobileMenu .gnb { display: flex; flex-wrap: wrap; gap: 10px 24px; }
#mobileMenu .gnb li { font-size: 16px; padding: 7px 0; }
.footer { padding: 75px 0 55px; }
.footer .wrap { display: flex; align-items: flex-start; gap: 135px; }
.footer .flogo { width: 261px; flex: 0 0 261px; }
.footer .flogo img { width: 261px; height: auto; }
.footer .finfor { min-width: 0; font-size: 17px; line-height: 30px; font-weight: 400; }
.footer .finfor address { font-style: normal; }
.footer .copyright { margin-top: 25px; }
@media screen and (max-width: 1620px) {
 .header .head-wrap { padding: 25px 32px; grid-template-columns: 1fr auto 1fr; gap: 22px; }
 .header .logo img { width: 205px; height: auto; }
 .header .nav .depth1 { gap: 28px; }
 .header .nav .depth1 li { font-size: 16px; }
 .header .tools { gap: 15px; }
 .header .search { width: 130px; }
 .footer .wrap { gap: 75px; }
}
@media screen and (max-width: 1380px) {
 .wrap { width: calc(100% - 64px); }
 .header .head-wrap { grid-template-columns: 1fr auto 1fr; gap: 20px; }
 .header .logo img { width: 195px; }
 .header .nav .depth1 { gap: 22px; }
 .header .search { width: 105px; }
}
@media screen and (max-width: 1200px) {
 .header .head-wrap { grid-template-columns: 205px 1fr; padding: 22px 32px; min-height: 102px; }
 .header .nav { display: none; }
 .header .side { display: flex; }
}
@media screen and (max-width: 980px) {
 .footer .wrap { gap: 40px; }
 .footer .flogo { width: 210px; flex-basis: 210px; }
 .footer .finfor { font-size: 15px; line-height: 26px; }
}
@media screen and (max-width: 768px) {
 .wrap { width: calc(100% - 40px); }
 .header .top { font-size: 11px; padding: 7px 16px; gap: 12px; min-height: 38px; flex-wrap: wrap; }
 .header .registration { font-size: 11px; gap: 7px; padding-left: 12px; }
 .header .registration img { width: 19px; height: 19px; }
 .header .head-wrap { grid-template-columns: 165px minmax(0, 1fr); padding: 18px 20px; gap: 15px; min-height: 80px; }
 .header .logo img { width: 165px; }
 .header .tools { gap: 12px; }
 .header .search { width: 100px; }
 .header .instagram, .header .blog { display: none; }
 .footer { padding: 55px 0 35px; }
 .footer .wrap { flex-direction: column; gap: 25px; }
 .footer .flogo { flex: 0 0 auto; }
}
@media screen and (max-width: 480px) {
 .header .top { gap: 4px 12px; }
 .header .registration { border: 0; padding-left: 0; }
 .header .head-wrap { grid-template-columns: 145px minmax(0, 1fr); gap: 10px; }
 .header .logo img { width: 145px; }
 .header .search { width: 80px; }
 .header .search input { font-size: 12px; }
 .header .tools { gap: 7px; }
 .header .side { width: 30px; flex-basis: 30px; }
 .footer .finfor { font-size: 14px; line-height: 25px; }
}

/* 인스타그램: 선이 잘리지 않는 SVG와 중앙 정렬 */
.header .instagram{width:28px;height:28px;flex-basis:28px;align-items:center;justify-content:center;line-height:0;overflow:visible}
.header .instagram img{display:block;width:28px;height:28px;max-width:none;object-fit:contain}
@media(min-width:1201px){.header .instagram{display:flex}}