/* 사회봉사 상단 서브메뉴 */
@media (min-width:768px){
  body .page-sub-nav nav ul{max-width:710px}
}
body .justify-content-between{width:90%; margin:0 auto !important}
body .localnav-curtain{-webkit-transition:opacity 1s ease 0.2s,width 0s ease 1.2s,height 0s ease 1.2s; transition:opacity 1s ease 0.2s,width 0s ease 1.2s,height 0s ease 1.2s}
body .topnav-play:checked ~ .localnav-curtain, body .topnav-play:target ~ .localnav-curtain{opacity:1; right:0; bottom:0; width:100%; height:100%}
body .topnav-actions{right:2px; padding:0; position:absolute; top:0; z-index:1; padding-right:calc(22px + constant(safe-area-inset-right))}
@supports (padding:calc(max(0px))){
 /* body .topnav-actions{padding-right:calc(max(22px, env(safe-area-inset-right)))} */
}
body .topnav-action{line-height:56px}
body .topnav-actions-center{left:50%}
body .topnav-actions-center .topnav-action-menucta{margin-left:-20px; left:0; position:absolute; z-index:1}
body .topnav-action-button,.topnav-action-violator{margin-left:35px; float:right}
body .page-top-background{min-height:48px; -webkit-transition:background-color 0.5s ease 0.7s; transition:background-color 0.5s ease 0.7s}
@supports ((-webkit-backdrop-filter:initial) or (backdrop-filter:initial)){
  body .topnav-play:checked ~ .page-top-nav .page-top-background, body .topnav-play:target ~ .page-top-nav .page-top-background {-webkit-backdrop-filter:saturate(180%) blur(20px); backdrop-filter:saturate(180%) blur(20px); background-color:rgba(255,255,255,0.9)}
}
body .page-top-background:after{margin-left:0; left:0; width:100%}
body .page-title-parent h3{font-size:17px}
body .page-sub-nav{font-size:14px; line-height:1.5; font-weight:400; letter-spacing:-.01em; padding-top:0; width:100%}
body .page-sub-nav nav{float:none; overflow:hidden; pointer-events:none; visibility:hidden; width:100%; max-height:0; -webkit-transition:max-height 0.5s cubic-bezier(0.28, 0.11, 0.32, 1) 0.4s,visibility 0s linear 1s; transition:max-height 0.5s cubic-bezier(0.28, 0.11, 0.32, 1) 0.4s,visibility 0s linear 1s}
body .topnav-play:checked ~ .page-top-nav nav, body .topnav-play:target ~ .page-top-nav nav{max-height:400px; max-height:calc(100vh - 48px - 48px); overflow-y:auto; -webkit-overflow-scrolling:touch; pointer-events:auto; visibility:visible; -webkit-transition-delay:0.2s, 0s; transition-delay:0.2s, 0s}
body .topnav-play:checked ~ .localnav.localnav-opening .page-sub-nav nav, body .topnav-play:target ~ .localnav.localnav-opening .page-sub-nav nav{overflow-y:hidden}
body .page-sub-nav nav ul{opacity:0; padding:10px 32px 28px 32px; -webkit-transform:translate3d(0, -150px, 0); transform:translate3d(0, -150px, 0); -webkit-transition:opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.2s,-webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; transition:opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.2s,-webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; transition:transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s,opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; transition:transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s,opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.2s,-webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s}
body .topnav-play:checked ~ .page-top-nav nav ul, body .topnav-play:target ~ .page-top-nav nav ul{opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); -webkit-transition-delay:0.2s, 0.4s; transition-delay:0.2s, 0.4s}
body .page-sub-nav nav ul li a{color:#333 !important}
body .page-sub-nav nav ul li{margin-left:0; display:inline-block; float:none; width:100%; height:42px}
body .page-sub-nav nav ul li:first-child a{border-top:0}
body .page-sub-nav nav ul li:nth-child(1) a {-webkit-transition-delay:0.07s; transition-delay:0.07s}
body .page-sub-nav nav ul li:nth-child(2) a {-webkit-transition-delay:0.14s; transition-delay:0.14s}
body .page-sub-nav nav ul li:nth-child(3) a {-webkit-transition-delay:0.21s; transition-delay:0.21s}
body .page-sub-nav nav ul li:nth-child(4) a {-webkit-transition-delay:0.28s; transition-delay:0.28s}
body .page-sub-nav nav ul li:nth-child(5) a {-webkit-transition-delay:0.35s; transition-delay:0.35s}
body .page-sub-nav nav ul li:nth-child(6) a {-webkit-transition-delay:0.42s; transition-delay:0.42s}
body .page-sub-nav nav ul li:nth-child(7) a {-webkit-transition-delay:0.49s; transition-delay:0.49s}
body .page-sub-nav nav ul li:nth-child(8) a {-webkit-transition-delay:0.56s; transition-delay:0.56s}
body .page-sub-nav nav ul li:nth-child(9) a {-webkit-transition-delay:0.64s; transition-delay:0.64s}
body .page-sub-nav nav ul li:nth-child(10) a{-webkit-transition-delay:0.70s; transition-delay:0.70s}
body .page-sub-nav nav ul li:nth-child(11) a{-webkit-transition-delay:0.77s; transition-delay:0.77s}
body .page-sub-nav nav ul li:nth-child(12) a{-webkit-transition-delay:0.83s; transition-delay:0.83s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(1) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(1) a  {-webkit-transition-delay:0.90s; transition-delay:0.90s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(2) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(2) a  {-webkit-transition-delay:0.83s; transition-delay:0.83s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(3) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(3) a  {-webkit-transition-delay:0.75s; transition-delay:0.75s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(4) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(4) a  {-webkit-transition-delay:0.68s; transition-delay:0.68s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(5) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(5) a  {-webkit-transition-delay:0.61s; transition-delay:0.61s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(6) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(6) a  {-webkit-transition-delay:0.56s; transition-delay:0.56s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(7) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(7) a  {-webkit-transition-delay:0.49s; transition-delay:0.49s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(8) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(8) a  {-webkit-transition-delay:0.42s; transition-delay:0.42s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(9) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(9) a  {-webkit-transition-delay:0.35s; transition-delay:0.35s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(10) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(10) a {-webkit-transition-delay:0.28s; transition-delay:0.28s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(11) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(11) a {-webkit-transition-delay:0.21s; transition-delay:0.21s}
body .topnav-play:checked ~ .page-top-nav nav ul li:nth-child(12) a,
body .topnav-play:target ~ .page-top-nav nav ul li:nth-child(12) a {-webkit-transition-delay:0.14s; transition-delay:0.14s}
body .page-sub-nav nav ul li a{border-top:1px solid rgba(214,214,214,0.5); display:block; line-height:42px; opacity:0; -webkit-transform:translate3d(0, -25px, 0); transform:translate3d(0, -25px, 0); -webkit-transition:0.5s ease; transition:0.5s ease; -webkit-transition-property:opacity, -webkit-transform; transition-property:opacity, -webkit-transform; transition-property:transform, opacity; transition-property:transform, opacity, -webkit-transform}
body .topnav-play:checked ~ .page-top-nav nav ul li a, body .topnav-play:target ~ .page-top-nav nav ul li a{color:#333 !important; opacity:1; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0)}
body .topnav-play:checked ~ .page-top-nav nav ul li.current_page_item a, body .topnav-play:target ~ .page-top-nav nav ul li.current_page_item a{color:#33333380 !important}
body .topnav-play:checked ~ .page-top-nav h3 a, body .topnav-play:target ~ .page-top-nav h3 a{color:#333 !important; -webkit-transition:0.5s ease; transition:0.5s ease}
body .topnav-action-menucta{float:left; display:block}
body .page-title-parent{font-size:20px; line-height:2; font-weight:500; display:inline-block; line-height:48px; height:48px}
body .nav-curtain{-webkit-transition:opacity 1s ease 0.2s,width 0s ease 1.2s,height 0s ease 1.2s; transition:opacity 1s ease 0.2s,width 0s ease 1.2s,height 0s ease 1.2s}
body #topnav-play:checked ~ .nav-curtain, body #topnav-play:target ~ .nav-curtain{opacity:1; right:0; bottom:0; width:100%; height:100%}
@media only screen and (min-width:768px){
  body .page-top-nav > div{position:relative; margin:0 auto}
  body .page-top-nav .row{width:90%}
  body .page-sub-nav nav ul{max-width:100%;}
  body .topnav-play:checked ~ .page-top-nav .page-top-background, body .topnav-play:target ~ .page-top-nav .page-top-background{opacity: .98}
  body .headroom--not-top .page-top-nav .page-top-background:after{opacity:0}
}
@media only screen and (min-width:1070px){
  body .page-top-nav .row{width:100%; padding:0 30px}
  body .topnav-actions{right:39px}
}

@media only screen and (min-width: 768px){
	body .headroom--not-top .page-top-nav .page-top-background:after	{opacity:inherit}
  body .page-sub-nav nav ul li a:hover{text-decoration: underline}
}

@media(min-width:1070px){
  body .page-top{max-width:100%; position:relative; padding:0}
  body .page-top .row{flex-wrap:wrap!important; margin:0 auto; padding:0 30px}
  body .page-sub-nav nav {margin-left:0!important; padding:0!important}
  body .page-sub-nav nav ul{display:block!important; flex-direction:inherit!important; flex-wrap:inherit!important}
  body .page-sub-nav nav ul li{margin-left:0!important; line-height:0; float:none}
  body .page-sub-nav nav ul li a{position:relative}
  body .page-sub-nav nav ul li.current_page_item a::after{display:none!important}
  body .page-sub-nav nav ul li a:hover::after{display:none!important}
  body .dark .page-sub-nav nav ul li.current_page_item a::after{background-color:#fff;}
  body .topnav-actions{display:inline-block!important}
}