/* ═══ 사일삼 탑바(헤더) — 인블로그 이식본 ═══
본사이트 솔리드(라이트) 헤더 기준. fixed 대신 sticky(콘텐츠 안 가림).
드롭다운은 순수 CSS hover라 JS 불필요. */
#siteHeader, #siteHeader * { margin: 0; padding: 0; box-sizing: border-box; }
#siteHeader {
position: sticky; top: 0; z-index: 1000;
height: 70px; display: flex; align-items: center;
background: #fff; box-shadow: 0 4px 24px rgba(0,0,0,.08);
border-bottom: 1px solid rgba(0,0,0,.06);
font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
system-ui, Roboto, "Helvetica Neue", "Segoe UI",
"Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
#siteHeader a { text-decoration: none; }
#siteHeader .hd-bar {
display: flex; align-items: center; justify-content: space-between;
width: 100%; max-width: 1470px; margin: 0 auto; padding: 0 20px;
}
#siteHeader .hdLogo { display: flex; align-items: center; flex-shrink: 0; color: #0E1426; }
#siteHeader .hdLogo img { height: 24px; width: auto; display: block; }
#siteHeader .navLinks { display: flex; align-items: center; gap: 8px; }
#siteHeader .navLink {
padding: 8px 16px; font-size: 15px; font-weight: 500;
color: rgba(14,20,38,.7); border-radius: 8px; transition: background .2s, color .2s;
}
#siteHeader .navLink:hover { background: rgba(0,0,0,.05); color: #0E1426; }
#siteHeader .navLinks > a.navLink { margin-right: 17px; }
#siteHeader .navItem { position: relative; display: inline-flex; align-items: center; }
#siteHeader .navLinkDrop { position: relative; display: inline-flex; align-items: center; gap: 5px; }
#siteHeader .navChev { transition: transform .25s ease; }
#siteHeader .navItem:hover .navChev { transform: rotate(180deg); }
#siteHeader .navItem:hover > .navLinkDrop { background: transparent; }
#siteHeader .navItem:hover > .navLinkDrop::after {
content: ''; position: absolute; left: 16px; right: 16px; bottom: 3px;
height: 2px; background: currentColor; border-radius: 2px;
}
#siteHeader .navDrop {
position: absolute; top: 100%; left: 50%;
transform: translateX(-50%) translateY(8px); padding-top: 24px;
opacity: 0; visibility: hidden; transition: opacity .28s ease, transform .28s ease; z-index: 1001;
}
#siteHeader .navItem:hover .navDrop,
#siteHeader .navItem:focus-within .navDrop { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
#siteHeader .navDrop-card {
background: #fff; border-radius: 8px; box-shadow: 0 18px 42px rgba(11,16,32,.14);
border: 1px solid rgba(14,20,38,.05); padding: 20px 14px 22px;
width: max-content; min-width: 170px; max-width: 300px; text-align: left;
}
#siteHeader .navDrop-cat { font-size: 13px; font-weight: 500; color: #929292; margin: 0 0 8px; padding: 0 10px 12px; border-bottom: 1px solid #ededed; }
#siteHeader .navDrop-item { display: block; padding: 9px 10px; border-radius: 6px; transition: background .15s ease; }
#siteHeader .navDrop-item:hover { background: #f5f8fc; }
#siteHeader .navDrop-tt { display: block; font-size: 15px; font-weight: 700; color: #2c313a; line-height: 1.4; transition: color .15s ease; }
#siteHeader .navDrop-item:hover .navDrop-tt { color: #2E6BFF; }
#siteHeader .navDrop-desc { display: block; font-size: 13px; font-weight: 400; color: #8a8f98; line-height: 1.4; margin-top: 3px; }
#siteHeader .hd-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
#siteHeader .navCta {
display: inline-flex; align-items: center; justify-content: center; gap: 6px;
height: 42px; padding: 0 22px; background: #2E6BFF; color: #fff;
font-size: 14px; font-weight: 700; border-radius: 6px; white-space: nowrap;
flex-shrink: 0; transition: box-shadow .25s, transform .25s;
}
#siteHeader .navCta:hover { transform: translateY(-1px); }
#siteHeader .navCta-rocket { width: 18px; height: 18px; flex-shrink: 0; transition: transform .25s ease; }
#siteHeader .navCta:hover .navCta-rocket { animation: navRocketFly .7s ease-in-out infinite; }
@keyframes navRocketFly { 0%,100% { transform: translate(0,0) rotate(0); } 50% { transform: translate(3px,-3px) rotate(-6deg); } }
@media (prefers-reduced-motion: reduce) { #siteHeader .navCta:hover .navCta-rocket { animation: none; transform: translate(2px,-2px); } }
#siteHeader .navDivider { width: 1px; height: 24px; background: rgba(14,20,38,.15); flex-shrink: 0; }
#siteHeader .navPartner {
position: relative; overflow: hidden;
background: linear-gradient(135deg,#0D1017 0%,#2A303D 52%,#0D1017 100%);
border: 1px solid rgba(255,255,255,.1); border-radius: 8px; padding: 8px 14px;
color: rgba(255,255,255,.92); transition: color .2s, border-color .2s;
}
#siteHeader .navPartner::after {
content: ''; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
background: linear-gradient(105deg,transparent 0%,rgba(255,255,255,.14) 50%,transparent 100%);
transform: skewX(-20deg); animation: navPartnerSheen 3.6s ease-in-out infinite; pointer-events: none;
}
@keyframes navPartnerSheen { 0% { transform: translateX(0) skewX(-20deg); } 55%,100% { transform: translateX(475%) skewX(-20deg); } }
@media (prefers-reduced-motion: reduce) { #siteHeader .navPartner::after { animation: none; display: none; } }
#siteHeader .navPartner:hover { color: #fff; border-color: rgba(255,255,255,.24); background: linear-gradient(135deg,#0D1017 0%,#2A303D 52%,#0D1017 100%); }
@media (max-width: 900px) { #siteHeader .navLinks { display: none; } }
@media (max-width: 600px) {
#siteHeader .navCta { padding: 9px 16px; font-size: 13px; }
#siteHeader .navDivider, #siteHeader .navPartner { display: none; }
}/* ═══ 사일삼 푸터 스타일 — 인블로그 이식본 (main.css와 동일 디자인) ═══ */
.ft, .ft * { margin: 0; padding: 0; box-sizing: border-box; }
.ft {
background: #0B0F16; position: relative;
font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
system-ui, Roboto, "Helvetica Neue", "Segoe UI",
"Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
.ft-ct { width: 100%; max-width: 1470px; margin: 0 auto; padding-left: 20px; padding-right: 20px; }
.ft-cta-zone { background: transparent; padding: 64px 0 0; }
.ft-cta { position: relative; z-index: 2; display: flex; align-items: center; gap: 40px; background: #2f52e6; border-radius: 24px; padding: 44px 52px; margin-bottom: -96px; overflow: hidden; }
.ft-cta-media { flex: 0 0 32%; display: flex; justify-content: center; align-items: center; }
.ft-cta-illust { width: 100%; max-width: 240px; height: auto; filter: drop-shadow(0 14px 20px rgba(8,12,35,.55)); animation: ftRocketFloat 3.2s ease-in-out infinite; }
@keyframes ftRocketFloat { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-12px) rotate(-3deg); } }
@media (prefers-reduced-motion: reduce) { .ft-cta-illust { animation: none; } }
.ft-cta-body { flex: 1; min-width: 0; }
.ft-cta-title { font-size: 28px; font-weight: 800; line-height: 1.3; letter-spacing: -.5px; color: #fff; margin: 0 0 12px; }
.ft-cta-sub { font-size: 15px; color: rgba(255,255,255,.82); line-height: 1.6; margin: 0 0 22px; }
.ft-cta-actions { display: flex; width: fit-content; max-width: 100%; gap: 8px; padding: 8px; background: linear-gradient(135deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.02) 40%,rgba(23,23,27,.26) 100%); border: 1px solid rgba(255,255,255,.14); box-shadow: inset 0 1px 0 rgba(255,255,255,.2); border-radius: 8px; margin: 0 0 14px; }
.ft-cta-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; padding: 0 26px; border: 0; border-radius: 6px; font-size: 15px; font-weight: 700; cursor: pointer; white-space: nowrap; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.ft-cta-btn:hover { transform: translateY(-1px); }
.ft-cta-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.ft-cta-primary { background: #fff; color: #1c2a55; }
.ft-cta-primary svg { transition: transform .25s ease; }
.ft-cta-primary:hover svg { animation: ftArrowNudge .7s ease-in-out infinite; }
@keyframes ftArrowNudge { 0%,100% { transform: translateX(0); } 50% { transform: translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .ft-cta-primary:hover svg { animation: none; transform: translateX(4px); } }
.ft-cta-kakao { background: #FEE500; color: #3A1D1D; }
.ft-cta-fine { font-size: 13px; color: rgba(255,255,255,.9); line-height: 1.6; margin: 0; }
.ft-main-zone { background: transparent; padding: 132px 0 0; }
.ft-main { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; border: 1px solid rgba(255,255,255,.14); margin-bottom: 24px; }
.ft-main > * { padding: 32px 40px; }
.ft-main > *:not(:last-child) { border-right: 1px solid rgba(255,255,255,.14); }
.ft-col { display: flex; flex-direction: column; align-items: flex-start; }
.ft-col-t { font-size: 15px; font-weight: 800; color: #fff; margin: 0 0 15px; }
.ft-col-t.ft-col-t-link { color: #fff; text-decoration: none; transition: color .2s ease; }
.ft-col-t-link:hover { color: #5B8FFF; }
.ft-notes-list { width: 100%; margin-top: -8px; }
.ft-notes-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 6px 0; text-decoration: none; color: rgba(255,255,255,.62); transition: color .2s ease; }
a.ft-notes-row:hover { color: #5B8FFF; }
.ft-notes-title { flex: 1; min-width: 0; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ft-notes-date { flex: none; font-size: 12px; color: rgba(255,255,255,.4); }
.ft-col-split { padding: 0; align-self: stretch; }
.ft-col-split-item { width: 100%; margin: 0; padding: 32px 40px; box-sizing: border-box; flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; }
.ft-col-split-item:first-child { border-bottom: 1px solid rgba(255,255,255,.14); }
.ft-biz { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; flex-wrap: wrap; font-size: 12.5px; color: #C2C3C4; line-height: 1.6; margin: 0 0 24px; }
.ft-biz-tag { flex: none; white-space: nowrap; }
.ft-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; border-top: 1px solid rgba(255,255,255,.1); padding: 24px 0 40px; }
.ft-bottom-brand { display: flex; align-items: center; gap: 10px; }
.ft-bottom-logo { height: 16px; width: auto; display: block; filter: brightness(0) invert(1); opacity: .75; }
.ft-copy { font-size: 13px; line-height: 16px; color: rgba(255,255,255,.5); margin: 0; }
.ft-bottom-links { display: flex; align-items: center; gap: 22px; }
.ft-bottom-links a { font-size: 13px; color: rgba(255,255,255,.62); text-decoration: none; transition: color .2s ease; }
.ft-bottom-links a:hover { color: #5B8FFF; }
.ft-bottom-notice { font-size: 13px; color: rgba(255,255,255,.4); }
.ft-bottom-social { display: flex; align-items: center; gap: 10px; }
.ft-bottom-social a { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.08); display: inline-flex; align-items: center; justify-content: center; color: rgba(255,255,255,.55); transition: background .2s ease, color .2s ease; }
.ft-bottom-social a:hover { background: rgba(255,255,255,.18); color: #fff; }
.ft-bottom-social svg { display: block; width: 17px; height: 17px; }
@media (max-width: 900px) {
.ft-main { grid-template-columns: 1fr; }
.ft-main > * { padding: 24px; }
.ft-main > *:not(:last-child) { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
}
@media (max-width: 640px) {
.ft-cta { flex-direction: column; gap: 24px; padding: 34px 26px; text-align: center; margin-bottom: -74px; }
.ft-cta-media { flex: none; }
.ft-cta-illust { max-width: 150px; }
.ft-cta-title { font-size: 22px; }
.ft-cta-actions { flex-direction: column; width: auto; }
.ft-cta-btn { width: 100%; }
.ft-cta-fine { text-align: left; }
.ft-main-zone { padding-top: 104px; }
.ft-bottom { flex-direction: column; align-items: flex-start; padding-bottom: 32px; }
}/* ── 컨테이너 (디자인 토큰: 413.co.kr main.css와 동일 값) ── */
.nt-container {
--c-blue: #2E6BFF;
max-width: 1200px;
margin: 0 auto;
padding: 24px 20px 100px;
font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
system-ui, Roboto, "Helvetica Neue", "Segoe UI",
"Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
.nt-container * { margin: 0; padding: 0; box-sizing: border-box; }
/* ── 카테고리 탭 (구 nt-tabs) ── */
.nt-tabs { display: flex; flex-wrap: wrap; gap: 26px; align-items: center; margin-bottom: 44px; }
.nt-tab {
font-size: 20px; font-weight: 600; color: #a2a8b2; line-height: 1.4;
text-decoration: none; transition: color .2s ease;
}
.nt-tab:hover { color: #5b6472; }
.nt-tab.active { color: #111318; }
/* ── 글 목록 행 (구 nt-row) ── */
.nt-list-rows { display: flex; flex-direction: column; gap: 14px; }
.nt-row {
border: 1px solid #eaecf0; background: #fff;
transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.nt-row:hover { border-color: #111318; box-shadow: 0 10px 26px rgba(20,30,55,.08); transform: translateY(-2px); }
.nt-row-pinned { border-left: 3px solid var(--c-blue); }
.nt-row-link {
display: flex; align-items: center; justify-content: space-between;
gap: 40px; padding: 48px 54px; text-decoration: none; color: inherit;
}
.nt-row-text { flex: 1; min-width: 0; }
.nt-row-title {
font-size: 22px; font-weight: 800; color: #1a1c22; line-height: 1.45;
letter-spacing: -.4px; margin: 0 0 13px;
display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.nt-row-desc {
font-size: 16px; color: #5b6472; line-height: 1.6; margin: 0 0 17px;
display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.nt-row-date { font-size: 13px; color: #9aa1ac; margin: 0; }
.nt-row-thumb {
flex: none; width: 250px; aspect-ratio: 1200/630; border-radius: 8px;
background-color: #000; background-size: contain;
background-repeat: no-repeat; background-position: center;
}
/* ── 반응형 (구 900px/600px 브레이크포인트) ── */
@media (max-width: 900px) {
.nt-row-link { padding: 34px 32px; gap: 26px; }
.nt-row-thumb { width: 200px; }
}
@media (max-width: 600px) {
.nt-tabs { gap: 18px; margin-bottom: 30px; }
.nt-tab { font-size: 17px; }
.nt-row-link { gap: 16px; padding: 24px 20px; }
.nt-row-thumb { width: 110px; }
.nt-row-title { font-size: 17px; }
.nt-row-desc { font-size: 14px; }
}
/* 호스트(인블로그) 전역 a:hover 밑줄 규칙 방어 — 특이도 상향 */
a.nt-tab, a.nt-tab:hover, a.nt-row-link, a.nt-row-link:hover { text-decoration: none; }
(Sample) 인블로그 SEO 설정 가이드: 도메인 연결부터 사이트맵 제출까지
이 가이드는 도메인 설정, Google Search Console 연동, 사이트맵 제출을 통해 inblog를 구글 검색 엔진에 최적화하는 단계별 SEO 튜토리얼을 제공합니다.
이 가이드는 도메인 설정, Google Search Console 연동, 사이트맵 제출을 통해 inblog를
구글 검색 엔진에 최적화하는 단계별 SEO 튜토리얼을 제공합니다.
1. 도메인 연결하기 inblog 기본 도메인([인블로그 주소].inblog.io)에서 자사 도메인으로 블로그를 이전할 수 있습니다.
💡
도메인 설정에 도움이 필요하시다면 인블로그 팀의
테크니컬 미팅 을 예약해주세요!
블로그를 자체 도메인에 연결하는 세 가지 방법:
서브디렉토리 방식 : example.com/blog 서브도메인 방식 : blog. example.com루트 도메인 방식 : example.com (메인 도메인 자체를 연결) 도메인 연결
💡
서브디렉토리 설정은 개발자의 도움이 필요합니다.
미리 구매한 도메인 이름을 입력하세요.
(현재 Next.js, Webflow, Framer로 구축된 웹사이트, 혹은 nginx 웹서버를 사용하실 경우에만 공식적으로 서브디렉토리 연결을 지원합니다.) "내 도메인에 연결하기"를 클릭하면 서브디렉토리 설정 가이드를 받게 됩니다.
필요한 코드 설정이 완료되면 30분 이내에 연결이 완료됩니다.
연결하려는 도메인 이름을 입력하세요. 이는 미리 구매한 도메인이어야 합니다. "내 도메인에 연결하기"를 클릭하면 DNS 레코드 설정 안내를 받게 됩니다.
도메인 제공업체(예: GoDaddy, Namecheap)를 통해 DNS 레코드 설정을 구성하면 30분 이내에 연결이 완료됩니다. (아임웹, 카페24를 사용하고 계실 경우, 도메인 제공업체가 아닌 아임웹과 카페24에서 설정을 해주셔야 합니다.)
연결하려는 도메인 이름을 입력하세요. 이는 미리 구매한 도메인이어야 합니다. "내 도메인에 연결하기"를 클릭하면 DNS 레코드 설정 안내를 받게 됩니다.
제공된 DNS 레코드 설정을 완료하시면 30분 이내에 연결이 완료됩니다.
D. 나중에 연결해도 괜찮나요? 인블로그에서 기본 제공되는 서브도메인을 사용하시다 나중에 연결하셔도 괜찮습니다. 추후 연결하실 경우, 인블로그 기본 서브도메인에서 설정하시는 커스텀 도메인으로 308 영구 리디렉션 연결 및 캐노니컬 URL 일괄 변경을 지원합니다. “내 도메인 없이 계속하기”를 눌러주세요.
2. Google Search Console 연결하기 A. 이미 Search Console에 도메인 속성을 등록한 경우 "네, 등록했습니다"를 클릭하고 Google Search Console에 해당 도메인 속성의 소유자로 등록된 Google 계정(인블로그에 로그인하신 Google 계정과 다른 경우를 주의하세요) 을 선택하세요.
B. Search Console을 등록하지 않은 경우 Google Search Console 웹사이트 로 이동하여 "시작하기"를 클릭하세요.
(Google Search Console 에서) "URL 접두어" (설정 화면 오른쪽)를 선택하세요. (Google Search Console 에서) 완성된 도메인 URL을 입력하고 "계속"을 클릭하세요. URL에 https://를 반드시 포함해야 합니다. 커스텀 도메인 설정을 하셨다면, 인블로그에 연결한 서브도메인(예: blog.example.com) 또는 서브디렉토리(예: example.com/blog)를 통해 연결 해야 합니다.
(Google Search Console 에서) 소유권 확인을 위한 HTML 태그를 복사하세요.
(인블로그 대시보드로 돌아와서) 복사한 HTML 태그를 "3단계: 복사한 태그 붙여넣기" 필드에 붙여넣고 "계속"을 클릭하세요.
(Google Search Console에서) "Verify" 을 클릭하세요.
(인블로그 대시보드에서) Search Console 연결에 사용한 Google 계정으로 로그인하세요.
🚨
Q: 저는 Verify를 눌러도 승인이 되지 않습니다.
A: 저장 및 반영의 시간차로 인해 아직 데이터를 불러오지 못했을 수 있습니다. 3-4회 정도 다시 시도를 부탁드립니다.
여러번 재시도해도 Verify가 불가능하실 경우, url이 잘못 입력되었을 수 있으니 속성을 삭제하시고 처음부터 다시 진행해보시는 것을 권장드립니다. 이 경우, 메타 태그가 바뀔 수 있으니 기존에 추가된 메타 태그를 삭제하시고 새로 입력 하시길 부탁드립니다.
3. 사이트맵 제출하기
Google Search Console 웹사이트 로 이동하세요.드롭다운 메뉴에서 블로그 사이트를 선택하세요. 측면 네비게이션에서 Sitemaps 를 클릭하세요. "새 사이트맵 추가" 아래에 사이트맵 URL 슬러그를 입력하세요. 전체 사이트의 경우 sitemap.xml을 입력하세요 "Submit"을 클릭하세요. 사이트맵이 성공적으로 제출되면 확인 메시지가 표시됩니다.
✅ 기본 SEO 설정이 모두 완료되었습니다! 🎉
Share article
계약부터 권하는 곳들, 이상하지 않으셨나요?
사일삼은 계약 이야기 전에 무료 진단부터 시작합니다.
상담을 받으셨다고 계약을 권유드리지 않습니다.
공지사항 - 새로운 소식을 안내합니다.
[안내] 07/17 제헌절은 고객센터가 운영되지 않습니다. 2026-07-15
개인정보처리방침·이용약관 제정 안내 (2026년 7월 15일 시행) 2026-07-15
실무노트(인사이트) 서비스 오픈 안내 2026-07-15
실무노트 - 우리가 고민한 흔적
채용문의 - 소중한 인연을 기다립니다.
제휴문의 - 소중한 인연을 기대합니다.
(주)사일삼 · 대표 천원우 · 사업자등록번호 572-88-02516 · 인천광역시 남동구 호구포로 194, 마크원 15층 · 1800-0821 · ww.chun@413.co.kr
당신의 전문성이 빛나도록 - 사일삼마케팅
© 2026 Sailsam INC. All rights reserved