@charset "UTF-8";

.loca {margin-left:4rem;}
.loca ul li a {font-size:16rem; color:#005353;}
.loca ul li a.home {display:inline-block; position:relative; top:3rem; width:18rem; height:18rem; background:url('/design/counselyouth/img/sub/home.png') no-repeat 0 0/contain; text-indent:-9999rem;}

.bdc {background:none; padding:13rem 0;}

#container {position:relative;}
#container:before {content:''; position:absolute; top:0; left:0; width:100%; height:229rem; background:#fff3cb url('/design/counselyouth/img/sub/bg2.jpg') 0 0/cover; z-index:-1;}
#container > .wrap {display:flex; justify-content:space-between; padding-top:98rem; margin-bottom:60rem;}
#snb {width:260rem;}
#snb .h2 {position:relative; background:#005353 url('/design/counselyouth/img/sub/bg.jpg') no-repeat left bottom; padding:50rem 25rem; color:#fff; text-align:center; border-radius:20rem 20rem 0 0;}
#snb .h2 h2 {font-weight:600; font-size:22rem; font-family:'BinggraeTaom'; transform:rotate(0.04deg);}
#snb .depth1 {background:#fff; padding:20rem; border-radius:0 0 20rem 20rem; box-shadow:0 0 20rem rgba(66,66,66,0.1);}
#snb .depth1 a {display:block; padding:13rem; font-weight:500; font-family:'BinggraeTaom'; transform:rotate(0.04deg);}
#snb .depth1 > li > a {position:relative; font-size:18rem;}
#snb .depth1 > li.on > a {font-weight:600; padding-left:20rem;}
#snb .depth1 > li.on > a:before {content:''; position:absolute; top:0; left:0; width:calc(100% + 50rem); height:100%; background:#ffa633; border-radius:10rem; z-index:-1;}
#snb .depth1 > li.on > a:after {content:''; position:absolute; top:23rem; right:-30rem; width:12rem; height:8rem; background:url('/design/counselyouth/img/layout/arrow.png') no-repeat 0 66.666%/100% auto; transform:rotate(-90deg);}
#snb .depth1 > li.on a+.depth2 > li:last-child > a {border-bottom:1px solid #005353;}
#snb .depth2 {display:none; margin-bottom:10rem;}
#snb .depth2 > li {position:relative;}
#snb .depth2 > li:before {content:''; position:absolute; top:23rem; left:18rem; width:7rem; height:1px; background:#565656;}
#snb .depth2 > li > a {padding-left:37rem; color:#565656; border-bottom:1px dashed #dcdcdc; font-size:16rem; line-height:1.5; }
#snb .depth2 > li.on > a,
#snb .depth2 > li:hover > a {font-weight:600; text-decoration:underline;}
#snb a[target="_blank"] span:before {content:''; position:absolute; top:4rem; right:0; width:13rem; height:13rem; background:url('/design/gouiseong/img/layout/blank.png') no-repeat 0 0/400% auto;}
.article {position:relative; width:calc(100% - 260rem - 90rem);}
.article .top {padding:20rem 0 0 0;}
.article .top h3 {font-size:32rem; font-weight:600; font-family:'BinggraeTaom'; transform:rotate(0.04deg); color:#005353;}
#content {margin:80rem 0;}
@media all and (max-width:1440px){
  #snb {width:240rem;}
  .article {width:calc(100% - 240rem - 80rem);}
}
@media all and (max-width:1240px){
  #container:before {display:none;}
  #container > .wrap {flex-wrap:wrap; padding:0;}
  #snb {display:none;}
  .loca ul {justify-content:center}
  .article {width:100%;}
  .article .top {padding:40rem 20rem; background:#fff3cb url('/design/counselyouth/img/sub/bg2.jpg') 0 0/cover; text-align:center;}
  #content {padding:0 20rem; margin:40rem 0;}
}