.col01 {color:var(--col01) !important;}
.col_red {color:var(--red) !important;}
.waitbox {text-align:center; border:10px solid var(--lbg); padding:40px 20px;}
.waitbox img {width:100%; max-width:240px; margin:0 auto 20px;}
.waitbox .t01 {font-size:1.5em; font-weight:700;}

/*sub*/
#sub .tit01 {color:var(--col01); font-weight:700; font-size:1.1em;}
#sub .tit02 {font-weight:700; font-size:1.25em;}
#sub .tabwrap {overflow-x:auto;}
#sub .tab01 {border-top:2px solid var(--col01); width:100%;}
#sub .tab01 tr {border-bottom:1px solid var(--border);}
#sub .tab01 th,
#sub .tab01 td {padding:0.5em; vertical-align:middle;}
#sub .tab01 th:not(:last-child),
#sub .tab01 td:not(:last-child) {border-right:1px solid var(--border);}
#sub .tab01 th {background:var(--lbg);}
#sub .subtab {display:flex; margin:0 0 40px; text-align:center; border-top:1px solid var(--border); border-left:1px solid var(--border);}
#sub .subtab span {flex:1; display:flex; align-items:center; justify-content:center; font-weight:700; padding:1em 0.5em; cursor:pointer; border-right:1px solid var(--border); border-bottom:1px solid var(--border); color:#888;}
#sub .subtab span.on {color:#fff; background:var(--col01);}

@media all and (min-width:768px) {
  #sub .tit01 {font-size:1.25em;}
  #sub .tit02 {font-size:1.5em;}
}

@media all and (min-width:1200px) {
  #sub .tit02 {font-size:1.75em;}
  #sub .tab01 th,
  #sub .tab01 td {padding:1em;}
  #sub .subtab span {font-size:1.1em;}
}


/*소개*/
#sub .intro .info01 .box {padding:20px; border-radius:8px; background:var(--lbg); border:1px solid var(--border);}
#sub .intro .info02 {border-radius:8px; border:1px solid var(--border); display:flex; flex-wrap:wrap;}
#sub .intro .info02 li {width:100%; text-align:center; padding:20px;}
#sub .intro .info02 li:not(:last-child) {border-bottom:1px solid var(--border);}
#sub .intro .info02 li > span {display:flex; align-items:center; background:var(--col01); color:#fff; padding:0 1em; height:30px; border-radius:100px; font-weight:700; width:fit-content; margin:0 auto;}
#sub .intro .info02 li img {width:min(40%, 60px); margin:20px auto;}
#sub .intro .info03 {display:flex; gap:10px; flex-wrap:wrap;}
#sub .intro .info03 > * {width:100%;}
#sub .intro .info03 p {padding:10px; border-radius:8px; border:1px solid var(--border); font-weight:600; background:var(--lbg);}
#sub .intro .info03 .dot_li {padding-left:10px;}
#sub .intro .info04 {padding:20px; border-radius:8px; border:1px solid var(--border); display:flex; align-items:center; gap:20px;}
#sub .intro .info04 img {width:60px;}
#sub .intro .info04 b {color:var(--red);}

@media all and (min-width:768px) {
  #sub .intro .info02 li {flex:1;}
  #sub .intro .info02 li:not(:last-child) {border-bottom:0; border-right:1px solid var(--border);}
}

@media all and (min-width:1200px) {
  #sub .intro .info01 {text-align:center;}
  #sub .intro .info01 .box {padding:40px; font-size:1.1em;}
  #sub .intro .info02 li {padding:40px;}
  #sub .intro .info03 {gap:20px;}
  #sub .intro .info03 p {padding:10px 20px;}
  #sub .intro .info03 .dot_li {padding-left:20px;}
  #sub .intro .info04 {padding:40px; gap:40px;}
}


/*이용안내*/
#sub .use .info01 .box {padding:20px; border-radius:8px; background:var(--lbg); border:1px solid var(--border);}
#sub .use .info02 {display:flex; flex-wrap:wrap; gap:20px;}
#sub .use .info02 li {width:100%; border:1px solid var(--border); border-radius:8px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; position:relative; padding:10px;}
#sub .use .info02 li:not(:last-child):after {content:'chevron_right'; font-family:var(--ic); display:flex; align-items:center; justify-content:center; text-align:center; width:20px; height:20px; border-radius:100%; background:#fff; background:var(--col02); color:#fff; position:absolute; right:10px; top:calc(50% - 10px);}
#sub .use .info02 li .t01 {display:flex; align-items:center; background:var(--col01); color:#fff; padding:0 1em; height:30px; border-radius:100px; font-weight:700; width:fit-content;}
#sub .use .info02 li .t02 {display:flex; align-items:center; gap:0.5em; color:#666;}
#sub .use .info02 li .t02 b {font-size:1.1em; font-weight:700; color:var(--col02);}

@media all and (min-width:768px) {
  #sub .use .info02 li {flex:1; padding:20px;}
  #sub .use .info02 li:not(:last-child):after {right:-10px;}
  #sub .use .info02 li .t01 {margin:0 auto;}
  #sub .use .info02 li .t02 {width:100%; justify-content:center;}
}

@media all and (min-width:1200px) {
  #sub .use .info01 {text-align:center;}
  #sub .use .info02 li .t02 b {font-size:1.25em;}
}


/*주차안내*/
#sub .parking .info01 {padding:20px; border-radius:8px; background:var(--lbg); border:1px solid var(--border);}
#sub .parking .info01.type01 {background:none;}
#sub .parking .info01 p.ref {color:var(--col01); font-size:0.9em;}
#sub .parking .info02 .img {display:block; margin:0 auto 20px; border:1px solid var(--border); border-radius:8px; width:100%; max-width:1020px;}
#sub .parking .info02 ul {display:flex; flex-wrap:wrap; align-items:flex-start; gap:20px 2%;}
#sub .parking .info02 li {width:100%; border:1px solid var(--border); border-radius:8px; overflow:hidden;}
#sub .parking .info02 li .txt {display:flex; flex-wrap:wrap; align-items:center; gap:5px 10px; padding:20px 10px;}
#sub .parking .info02 li .txt h5 {font-size:1.1em; font-weight:700;}
#sub .parking .info02 li .txt em {display:flex; padding:0 0.8em; width:fit-content; background:var(--col02); color:#fff; border-radius:100px; font-weight:600;}
#sub .parking .info02 li .txt p {width:100%; color:var(--col01);}
#sub .parking .info02 li a {display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; background:#D7D2CB; font-weight:700; height:50px; transition:0.3s;}
#sub .parking .info02 li a:hover {background:var(--col01);}

@media all and (min-width:768px) {
  #sub .parking .info02 .img {margin:0 auto 40px;}
  #sub .parking .info02 li {flex:1; transition:0.3s;}
  #sub .parking .info02 li:hover {transform:translate(-10px,-10px); -webkit-box-shadow:0px 10px 40px 0px rgba(0,0,0,0.05); -moz-box-shadow:0px 10px 40px 0px rgba(0,0,0,0.05); box-shadow:0px 10px 40px 0px rgba(0,0,0,0.05);}
  #sub .parking .info02 li .txt {padding:20px;}
  #sub .parking .info02 li .txt h5 {font-size:1.25em;}
  #sub .parking .info02 li a {height:60px;}
}

@media all and (min-width:1200px) {
  #sub .parking .info01 {padding:40px;}
  #sub .parking .info02 li .txt h5 {font-size:1.35em;}
}

/*시설안내*/
#sub .fac table em.label {display:inline-block; padding:0 0.25em; background:#9a8767; color:#fff; border-radius:2px; font-size:0.95em; margin:0 0.25em; vertical-align:bottom;}
#sub .fac .tabcontent {background:#e4e4e2; padding:40px 0;}
#sub .fac .tabcontent img {width:100%; max-width:640px; margin:0 auto;}
#sub .fac .tabcontent img.mo {display:block;}
#sub .fac .tabcontent img.pc {display:none;}

@media all and (min-width:1200px) {
  #sub .fac .tabcontent {padding:0;}
  #sub .fac .tabcontent img {max-width:1080px;}
  #sub .fac .tabcontent img.mo {display:none;}
  #sub .fac .tabcontent img.pc {display:block;}
}

/*오시는 길*/
#sub .map .mapbox {width:100%; display:flex; flex-wrap:wrap; border:1px solid var(--border); border-radius:8px; overflow:hidden;}
#sub .map .mapbox > .map {width:100%;}
#sub .map .mapbox > .info {width:100%; background:var(--lbg); padding:20px; display:flex; align-items:center; flex-wrap:wrap; border-top:1px solid var(--border);}
#sub .map .mapbox > .info > * {width:100%;}
#sub .map .mapbox > .info h5 {font-size:1.25em; font-family:"Noto Serif KR", serif; letter-spacing:-0.05em; font-weight:600; border-bottom:1px solid var(--border); padding-bottom:20px; margin:auto 0 20px;}
#sub .map .mapbox > .info ul {margin:0 0 20px;}
#sub .map .mapbox > .info li {display:flex;}
#sub .map .mapbox > .info li b {width:6em; color:var(--col01);}
#sub .map .mapbox > .info li em {width:calc(100% - 6em);}
#sub .map .mapbox > .info .btns {display:flex; flex-wrap:wrap; align-items:center; gap:10px; text-align:center; margin:auto 0 0;}
#sub .map .mapbox > .info .btns a {flex:1; display:flex; align-items:center; justify-content:center; height:50px; border-radius:8px; color:#fff; font-weight:600; gap:10px;}
#sub .map .mapbox > .info .btns a:nth-child(1) {background:var(--col01);}
#sub .map .mapbox > .info .btns a:nth-child(2) {background:var(--col02);}
#sub .map .mapbox > .info .btns a img {width:1em;}
#sub .map .mapbox .map_border {display:none;}
#sub .map .mapbox .wrap_controllers {display:none;}
#sub .map .busbox .row {display:flex; flex-wrap:wrap; align-items:stretch; border-radius:8px; border:1px solid var(--border); overflow:hidden;}
#sub .map .busbox .row h5 {width:100%; font-weight:700; font-size:1.1em; display:flex; align-items:center; justify-content:center; text-align:center; background:var(--lbg); padding:10px 20px; border-bottom:1px solid var(--border);}
#sub .map .busbox .row ul {width:100%; padding:20px;}
#sub .map .busbox .row li {display:flex; align-items:flex-start; gap:10px;}
#sub .map .busbox .row li:not(:last-child) {margin-bottom:5px;}
#sub .map .busbox .row li span {display:flex; align-items:center; justify-content:center; text-align:center; width:4em; color:#fff; font-weight:600; font-size:0.9em; border-radius:4px; flex-shrink:0;}
#sub .map .busbox .row li span.type01 {background:#6175f5;}
#sub .map .busbox .row li span.type02 {background:#47af1b;}
#sub .map .busbox .row li span.type03 {background:#ff451e;}
#sub .map .busbox .row li span.type04 {background:#2391ee;}
#sub .map .busbox .row li span.type05 {background:#00afbd;}
#sub .map .busbox .row li span.type06 {background:#e47e34;}

@media all and (min-width:768px) {
  #sub .map .mapbox > .map {width:min(65%, calc(100% - 320px));}
  #sub .map .mapbox > .info {width:max(35%, 320px); padding:40px 20px; border-left:1px solid var(--border); border-top:0;}
  #sub .map .mapbox > .info .btns a {flex:unset; width:100%;}
  #sub .map .busbox .row h5 {width:20%; border-bottom:0; border-right:1px solid var(--border);}
  #sub .map .busbox .row ul {width:80%;}
}

@media all and (min-width:1200px) {
  #sub .map .mapbox > .info {padding:40px;}
  #sub .map .mapbox > .info h5 {font-size:1.5em;}
  #sub .map .mapbox > .info .btns a {flex:1;}
  #sub .map .busbox .row ul {padding:30px;}
}

/*개인정보처리방침*/
#sub .privacy h4 {font-size:1.25em; font-weight:600;}

/*이메일무단수집거부*/
#sub .noemail .box {background:var(--lbg); border:1px solid var(--border); padding:40px 20px; border-radius:8px;}
#sub .noemail .box h1 {font-size:1.5em; font-weight:700;}

@media all and (min-width:1200px) {
  #sub .noemail .box {padding:40px;}
}

/*사이트맵*/
#sub .sitemap li {display:flex; flex-wrap:wrap; width:100%; border:1px solid var(--border); border-radius:8px; overflow:hidden;}
#sub .sitemap li:not(:last-child) {margin-bottom:20px;}
#sub .sitemap li h1 {width:100%; display:flex; align-items:center; justify-content:center; text-align:center; font-weight:700; padding:10px; background:var(--lbg); border-bottom:1px solid var(--border);}
#sub .sitemap li .sub {width:100%; padding:10px;}
#sub .sitemap li .sub dl {display:flex; flex-wrap:wrap; justify-content:center; gap:10px; width:100%;}
#sub .sitemap li .sub dd {display:flex; align-items:center;}
#sub .sitemap li .sub dd:not(:last-of-type):after {content:''; display:inline-block; width:1px; height:0.8em; background:var(--border); margin-left:10px;}

@media all and (min-width:768px) {
  #sub .sitemap li h1,
  #sub .sitemap li .sub {padding:20px;}
  #sub .sitemap li h1 {width:20%; border-bottom:0; border-right:1px solid var(--border);}
  #sub .sitemap li .sub {width:80%;}
  #sub .sitemap li .sub dl {justify-content:flex-start;}
}

@media all and (min-width:1200px) {
  #sub .sitemap li h1,
  #sub .sitemap li .sub {padding:30px;}
}


@media all and (min-width:768px) {
}

@media all and (min-width:1200px) {
}