@font-face { font-family: 'GmarketSans'; font-weight: 100; font-style: normal; src: url('/contents/fonts/GmarketSansLight.woff') format('woff'); }
 @font-face { font-family: 'GmarketSans'; font-weight: 300; font-style: normal; src: url('/contents/fonts/GmarketSansMedium.woff') format('woff'); }
 @font-face { font-family: 'GmarketSans'; font-weight: 400; font-style: normal; src: url('/contents/fonts/GmarketSansBold.woff') format('woff'); }
 body {font-family: 'GmarketSans','MalgunGothic','돋움','dotum',sans-serif; font-size: 16px; line-height: 1; font-weight: 300; color: #333;}
 select, input, textarea, button {font-family: 'GmarketSans','MalgunGothic','돋움','dotum',sans-serif; font-size: inherit; font-weight: 300; vertical-align: middle;}
 button {border: 0; background-color: transparent;}
 #wrap {width: 100%; overflow: hidden;}
 .inner { position: relative; width: 1680px; padding: 0 140px; box-sizing: border-box; margin: 0 auto;}
  .gnb {display: flex;align-items: center; height: 100%;}
 .gnbA {height: 100%;}
 .gnbA > a {position: relative; display: block; height: 100%; font-size: 21px; line-height: 120px; padding: 0 12px; transition: padding .2s;}
 .gnbA > a:hover, .gnbA.on > a { color: #0b899b;}
 .gnbA.on > a::after {position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); content: ''; display: block; width: 8px; height: 8px; border-radius: 100%; background-color: #0b899b;}
 .gnbB_wrap { display: none; position: absolute; top: 120px; left: 0; width: 100%; background: linear-gradient(to right, #085e71 50%, #fff 50%); z-index: 100;}
 .gnbB_wrap .gnb_inner { display: flex; width: 1400px; margin: 0 auto;}
 .gnbB_wrap .tit {order: 1; position: relative; width: 290px; background-color: #085e71; padding-top: 62px; overflow: hidden;}
 .gnbB_wrap .tit::after {position: absolute; top: -6px; right: -6px; content: ''; display: block; width: 113px; height: 135px; background: url(/images/lifelong/common/sp_layout.png?build_20251106001) no-repeat -20px -75px;}
 .gnbB_wrap .tit h2 {font-size: 34px; color: #fff;word-break: keep-all;}
 .gnbB_wrap .tit h2::before { content: ''; display: block; width: 30px; height: 4px; border-radius: 2px; background-color: #ffe778; margin-bottom: 18px;}
 .gnbB_wrap .gnbB { order: 2; display: flex; flex-wrap: wrap; width: calc(100% - 290px); background-color: #fff; padding: 60px 0 90px 60px;}
 .gnbB_wrap .gnbB > li {width: calc(25% - 12.75px); margin: 17px 0 0 17px;}
 .gnbB_wrap .gnbB > li:nth-child(-n+4) {margin-top: 0;}
 .gnbB_wrap .gnbB > li:nth-child(4n-3) { margin-left: 0;}
 .gnbB_wrap .gnbB > li > a { position: relative; display: block; width: 100%; height: 50px; font-size: 18px; line-height: 48px; border: 1px solid #e5e5e5; border-radius: 15px; background-color: #fff; padding: 0 34px; box-sizing: border-box; transition: all .2s;}
 .gnbB_wrap .gnbB > li > a::after {position: absolute; top: 20px; right: 18px; content: ''; display: block; width: 6px; height: 9px; background: url(/images/lifelong/common/sp_layout.png?build_20251106001) no-repeat -269px -28px;}
 .gnbB_wrap .gnbB > li > a:hover, .gnbB_wrap .gnbB > li.on > a {font-weight: 400; color: #004467; border-color: #004467; background-color: #f3f6fb;}
 .gnbB_wrap .gnbB > li > a:hover::after, .gnbB_wrap .gnbB > li.on > a::after { background-position: -305px -28px;}
  #header { position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 120px; border-bottom: 1px solid #e5e5e5; padding: 0 18px; box-sizing: border-box;}
 #header .logo { width: 408px; height: 37px;}
 #header .logo a { display: block; width: 100%; height: 100%; background: url(/images/caregiver/common/logo_caregiver.png?build_20251106001) no-repeat; text-indent: -9999px; background-size: 100%;}
 #header .util, #header .util ul { display: flex; align-items: center;}
 #header .util .info li + li { margin-left: 20px;}
 #header .util .info li a { font-size: 16px; color: #909090;}
 #header .util .info li a::before { content: ''; display: inline-block; background-image: url(/images/lifelong/common/sp_layout.png?build_20251106001); background-repeat: no-repeat; vertical-align: middle; margin: -2px 6px 0 0;}
 #header .util .info li.logout a::before { width: 15px; height: 21px; background-position: -65px -22px;}
 #header .util .info li.login a::before {width: 15px; height: 21px; background-position: -20px -22px;}
 #header .util .info li.join a::before, #header .util .info li.my a::before {width: 21px;height: 21px; background-position: -110px -22px;}
 #header .util .btn {width: 181px; height: 85px; border-radius: 48px 12px 48px 48px; background-color: #0b899b; margin-left: 30px;}
 #header .util .btn li { position: relative; width: 50%;}
 #header .util .btn li + li::before {position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%); content: ''; display: block; width: 1px; height: 55px; background-color: rgba(255,255,255,.2);}
 #header .util .btn li a {display: block; background-image: url(/images/lifelong/common/sp_layout.png?build_20251106001); background-repeat: no-repeat; text-indent: -9999px; margin: 0 auto;}
 #header .util .btn li.search a { width: 26px; height: 25px; background-position: -160px -20px;}
 #header .util .btn li.sitemap a {width: 23px; height: 19px; background-position: -216px -23px;}
  #footer {width: 100%;color: #fff; background-color: #273437;}
 #footer .top {display: flex; align-items: center; justify-content: space-between; padding: 25px 0 30px;}
 #footer .top a { display: block; font-size: 16px; color: #fff;}
 #footer .top .list {display: flex; margin-top: 6px;}
 #footer .top .list li a::before { content: ''; display: inline-block; width: 1px; height: 14px; background-color: #3d4957; vertical-align: middle; margin: 0 20px;}
 #footer .top .list li:first-child a { color: #f9d424;}
 #footer .top .list li:first-child a::before { display: none;}
 #footer .top .link { margin-left: auto;}
 #footer .top .link li { position: relative;}
 #footer .top .link li > a { width: 240px; height: 55px; line-height: 53px; border: 1px solid #3d4957; border-radius: 15px; padding: 0 28px; box-sizing: border-box;}
 #footer .top .link li > a::after { position: relative; top: 22px; float: right; content: ''; display: block; width: 15px; height: 9px; background: url(/images/lifelong/common/sp_layout.png?build_20251106001) no-repeat -376px -28px; transition: transform .2s;}
 #footer .top .link li > a.on::after { transform: rotate(180deg);}
 #footer .top .link li > a .state { display: inline-block; text-indent: -9999px;}
 #footer .top .linkbox { display: none; position: absolute; bottom: 60px; left: 0; width: 100%; height: auto; border-radius: 12px; background-color: #235584; padding: 25px 20px; box-sizing: border-box; z-index: 1;}
 #footer .top .linkbox a { line-height: 30px;}
 #footer .top .btn_top { width: 110px; height: 55px; line-height: 53px; border: 1px solid #3d4957; border-radius: 15px; padding: 0 20px; box-sizing: border-box; margin-left: 10px;}
 #footer .top .btn_top::after { position: relative; top: 22px; float: right; content: ''; display: block; width: 15px; height: 9px; background: url(/images/lifelong/common/sp_layout.png?build_20251106001) no-repeat -376px -28px;}
 #footer .bot { display: flex; border-top: 1px solid #3d4957; padding: 48px 0 120px;}
 #footer .bot .logo { width: 180px; height: 37px; background: url(/images/lifelong/common/logo.png?build_20251106001) no-repeat; text-indent: -9999px; margin-right: 80px;}
 #footer .bot address { line-height: 1.6; margin-top: -4px;}
 #footer .bot address span {display: block; color: #80999f; margin-top: 28px;}
 @media screen and (max-width: 1680px) { .inner {width:100%; padding: 0 7%;}
 .gnbA > a { padding: 0 6px; font-size: 19px;}
 #header .util .btn { margin-left: 30px;}
 }
 @media screen and (max-width: 1750px) { #header .logo { width:330px}
 }
 @media screen and (max-width: 1550px) { #wrap {width:1550px;}
 }
 .contents_tools ul.box { width: 200px;}
 .contents_tools .opt_box, .contents_tools ul.box, .contents_tools .st_qr { border: 1px solid #dedede; margin-top: 5px;}
 .contents_tools .st_qr .ly_p_dsc { letter-spacing: -0.03em;}
 .contents_tools .qr_area { margin-top: 0;}