/* ------------------------------ PC Guide ------------------------------ */
@media screen and (max-width:1550px){
/* footer */
	.footer:before {left:0px;}
/* main */
	.mc02:after {left:-20px; margin-left:0;}
/* 시설현황 */
	.gym_status1 li {padding:20px;}
	.gym_status2 dt,
	.gym_status2 dd {width:50%;}
	.gym_status2 dd {padding:40px 0 0 40px;}
	.gym_status2 dd:before {width:100px; height:100px; background-size:50% 50%;}
	.gym_status2 dd .tt {font-size:22px;}
	.gym_status2 dd p {font-size:18px;}
/* 시설안내 */
	.gym_info {gap:30px;}
	.gym_info .imgfit {width:40%;}
	.gym_info ul {width:calc(60% - 30px);}
	.gym_info li {padding:30px 30px 30px 136px;}
/* table */
	.tbl col.w160 {width:15%;}
	.tbl col.w170 {width:15%;}
	.tbl col.w200 {width:16%;}
	.tbl col.w280 {width:20.6%;}
	.tbl col.w560 {width:41.2%;}
/* 오시는 길 */
	.map_info .logo {width:30%;}
	.map_info .info {width:70%; padding-left:30px;}
/* FAQ */
	.faq_top {padding:60px 200px; font-size:20px;}
	.faq_top:before {left:40px; width:150px;}
	.faq_top:after {right:40px; width:120px;}
}

/* ------------------------------ Hover ------------------------------ */
@media screen and (min-width:1024px){
	.svisual.g01 .aside a:hover {background:#1E93BA;}
	.svisual.g02 .aside a:hover {background:#F58B00;}
	.svisual.g03 .aside a:hover {background:#EF6388;}
	.svisual.g04 .aside a:hover {background:#1DA770;}
}

/* ------------------------------ Tablet PC ------------------------------ */
@media screen and (max-width:1023px){
/* footer */
	.footer .info .flex {max-width:calc(100% - 230px); gap:5px 20px;}
/* main */
	.mc02:after {left:-10px; margin-left:0; width:15vw;}
/* 시설현황 */
	.gym_status1 ul {gap:10px;}
	.gym_status1 li {width:calc((100% - 20px)/3);}
	.gym_status2 dd {padding:20px 0 0 20px;}
	.gym_status2 dd:before {width:80px; height:80px;}
	.gym_status2 dd .tt {font-size:20px; margin:20px 0 14px;}
	.gym_status2 dd p {font-size:16px;}
/* 오시는 길 */
	.map_info .logo {background-size:80%;}
	.bus_station dt {font-size:20px; line-height:32px;}
	.bus_station dd {gap:10px; padding:20px 15px;}
	.bus_station dd span {font-size:14px; width:calc((100% - 40px)/5);}
/* 이용시간 */
	.hours_use .imgfit p {bottom:10px; left:20px; font-size:20px;}
	.hours_use .txt dt {font-size:15px; line-height:34px; height:34px; width:80px;}
	.closed_days {padding:30px; margin-top:30px;}
/* 이용안내 */
	.new_member {gap:14px;}
	.new_member li {width:calc((100% - 28px)/3);}
	.new_member li .box {padding:30px;}
	.new_member li i {margin-bottom:20px;}
	.new_member li .tit {font-size:20px; padding-bottom:16px; margin-bottom:15px;}
	.chk_txt p {line-height:24px;}
	.chk_txt p:before {height:24px;}
	.payment_info {padding:20px; gap:40px;}
	.payment_info .tit {padding-left:100px;}
	.payment_info .tit:before {width:80px; background-size:50%;}
	.payment_info .tit:after {right:-20px;}
	.payment_info .con {gap:20px;}
	.payment_info .con dl {gap:10px;}
	.payment_info .con dt {font-size:15px; line-height:34px; height:34px; width:80px;}
	.personal_locker > li {padding:30px 30px 30px 130px;}
	.personal_locker > li:before {left:30px;}
/* 대관안내 */
	.rental_guide_step {gap:10px;}
	.rental_guide_step li {width:calc((100% - 40px)/5);}
	.rental_guide_step li + li:before {left:-17px; width:24px;}
	.rental_guide_step .txt {padding:15px;}
	.rental_guide_step .txt strong {font-size:18px;}
	.rental_time {gap:10px;}
	.rental_time .box {width:calc(50% - 5px); padding:20px;}
	.rental_time .tit {font-size:18px; line-height:30px;}
	.rental_time .tit:after {width:30px;}
	.rental_time .con {padding-top:15px; margin-top:15px;}
	.rental_time dl {gap:10px;}
	.rental_time dt {font-size:15px; line-height:34px; height:34px; width:80px;}
	.rental_time dd {width:calc(100% - 80px);}
/* 강사현황 */
	.instructor_status {gap:20px;}
	.instructor_status > li {width:calc((100% - 40px)/3); border-radius:15px; padding:20px;}
	.instructor_status .cate span {font-size:13px; line-height:26px; height:26px; padding:0 14px;}
	.instructor_status .name {padding:15px 0; margin-bottom:24px; gap:12px;}
	.instructor_status .name strong {font-size:26px;}
	.instructor_status .name span {font-size:16px;}
	.instructor_status .con .tt {margin-bottom:6px;}
/* FAQ */
	.faq_top {padding:40px 160px; font-size:18px; margin-bottom:60px;}
	.faq_top:before {left:20px; width:140px;}
	.faq_top:after {right:20px; width:110px;}
	.faq_list dt button,
	.faq_list dd {padding:30px 80px 30px 100px;}
	.faq_list dt button:before,
	.faq_list dd:before {left:20px;}
	.faq_list dt button i {right:20px;}
	.faq_list dd {padding-right:30px;}
	.faq_list dd:before {top:14px;}
}

/* ------------------------------ Mobile ------------------------------ */
@media screen and (max-width:767px){
/* footer */
	.footer:before {bottom:calc(100% - 10px); width:60px;}
	.footer:after {width:120px;}
	.footer .info .flex {max-width:100%; gap:5px 10px;}
	.footer .flogo {position:relative; right:0; width:160px; margin-top:10px;}
/* main */
	.mc02:after {top:150px; left:0; width:20vw;}
	.mc02 .wrap-tab-container:before {width:100px; bottom:-30px; right:-30px;}
/* sub */
	.svisual {background-size:cover;}
	.svisual.g01 {background-image:url('../images/svisual01_m.jpg'); background-color:#1E93BA;}
	.svisual.g02 {background-image:url('../images/svisual02_m.jpg'); background-color:#F58B00;}
	.svisual.g03 {background-image:url('../images/svisual03_m.jpg'); background-color:#EF6388;}
	.svisual.g04 {background-image:url('../images/svisual04_m.jpg'); background-color:#1DA770;}
	.svisual.g01 .aside dt {background:#1E93BA;}
	.svisual.g02 .aside dt {background:#F58B00;}
	.svisual.g03 .aside dt {background:#EF6388;}
	.svisual.g04 .aside dt {background:#1DA770;}
	.svisual.g01 .aside a.on {color:#1E93BA;}
	.svisual.g02 .aside a.on {color:#F58B00;}
	.svisual.g03 .aside a.on {color:#EF6388;}
	.svisual.g04 .aside a.on {color:#1DA770;}
	.stit {line-height:30px;}
	.stit:before {height:30px;}
	.stit strong {display:block; font-size:16px; margin-left:0;}
/* 시설현황 */
	.gym_status1 ul {margin-top:15px; flex-direction:column;}
	.gym_status1 li {width:100%; padding:15px;}
	.gym_status1 .tt {font-size:18px; line-height:30px; padding-bottom:10px; margin-bottom:20px;}
	.gym_status1 .tt:after {width:30px; height:30px;}
	.gym_status1 .i1 dt {width:70px;}
	.gym_status1 .i1 dd {width:calc(100% - 70px);}
	.gym_status2 dl {flex-direction:column;}
	.gym_status2 dt,
	.gym_status2 dd {width:100%;}
	.gym_status2 dd {position:relative; padding:0 0 0 70px; margin-top:20px;}
	.gym_status2 dd:before {position:absolute; top:0; left:0; width:60px; height:60px;}
	.gym_status2 dd .tt {font-size:16px; margin:0 0 10px;}
	.gym_status2 dd p {font-size:13px;}
/* 시설안내 */
	.gym_info {flex-direction:column; gap:20px; padding-bottom:30px;}
	.gym_info .imgfit,
	.gym_info ul {width:100%;}
	.gym_info li {padding:20px 20px 20px 100px;}
	.gym_info i {left:20px; width:60px; height:60px; line-height:60px; font-size:20px;}
	.gym_info .tit {margin-bottom:4px; line-height:30px;}
	.gym_info .tit strong {font-size:20px;}
/* 오시는 길 */
	.map_area {border-radius:10px 10px 0 0;}
	.map_info {padding:0 0 20px; border-radius:0 0 10px 10px; flex-direction:column;}
	.map_info .logo,
	.map_info .info {width:100%;}
	.map_info .logo {height:60px; background-size:auto 30px;}
	.map_info .info {padding:0 15px;}
	.map_info .info dt {line-height:24px; padding-left:26px; width:70px;}
	.map_info .info dt:before {top:2px; width:20px; height:20px;}
	.map_info .info dd {width:calc(100% - 70px);}
	.bus_lines .box {margin-top:40px;}
	.bus_lines .tit {font-size:20px; padding-left:28px; margin-bottom:15px;}
	.bus_lines .tit:before {width:24px;}
	.bus_lines dl {padding:20px 20px 20px 50px;}
	.bus_lines dt {font-size:16px;}
	.bus_lines dt:before {left:-34px; width:24px;}
	.bus_station {flex-direction:column;}
	.bus_station dl {width:100%; border-radius:10px;}
	.bus_station dt {font-size:16px; line-height:24px; padding:10px; gap:8px;}
	.bus_station dt:before {width:24px; height:24px;}
	.bus_station dd {gap:5px; padding:15px;}
	.bus_station dd span {font-size:13px; width:calc((100% - 20px)/5);}
	.map_info .logo {background-size:80%;}
	.bus_station dt {font-size:20px; line-height:32px;}
	.bus_station dd {gap:10px; padding:20px 15px;}
	.bus_station dd span {font-size:14px; width:calc((100% - 40px)/5);}
/* 이용시간 */
	.hours_use .times {flex-direction:column; gap:10px;}
	.hours_use .times li {width:100%;}
	.hours_use .imgfit p {bottom:10px; left:10px; font-size:16px;}
	.hours_use .txt dt {font-size:14px; line-height:30px; height:30px; width:70px;}
	.closed_days {padding:20px; margin-top:20px;}
	.hours_use .imgfit p {bottom:10px; left:20px; font-size:20px;}
	.closed_days {padding:30px; margin-top:30px;}
/* 이용안내 */
	.registration_period {padding:15px; line-height:24px; gap:10px;}
	.new_member {gap:10px; flex-direction:column;}
	.new_member li {width:100%;}
	.new_member li .box {padding:20px;}
	.new_member li i {width:50px; margin-bottom:15px;}
	.new_member li i:before {mask-size:20px; -webkit-mask-size:20px;}
	.new_member li .tit {font-size:16px; padding-bottom:11px; margin-bottom:10px;}
	.chk_txt {margin-top:10px;}
	.chk_txt p {line-height:20px;}
	.chk_txt p:before {height:20px;}
	.gbox {padding:40px 0; margin:40px 0;}
	.payment_info {padding:15px; gap:40px; flex-direction:column;}
	.payment_info .tit {padding-left:80px; height:auto;}
	.payment_info .tit:before {width:60px;}
	.payment_info .tit:after {right:0; top:auto; bottom:-20px; transform:none; width:100%; height:1px;}
	.payment_info .con {gap:10px; flex-direction:column; align-items:flex-start;}
	.payment_info .con dl {gap:10px;}
	.payment_info .con dt {font-size:14px; line-height:30px; height:30px; width:70px;}
	.personal_locker {gap:10px;}
	.personal_locker > li {width:100%; padding:15px 15px 15px 80px; gap:5px;}
	.personal_locker > li:before {left:15px; width:50px; background-size:50%;}
	.personal_locker li .tt {font-size:16px;}
	.personal_locker .dots_list strong {width:70px;}
	.personal_locker .dots_list strong:after {right:5px;}
/* over_tbl */
	.over_tbl_m {position:relative;}
	.over_tbl_m:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:url('/pub/images/icon_hand.svg') no-repeat rgba(0,0,0,.5) 50% 50%/ auto 81px; z-index:3; pointer-events:none; transition:.5s linear;}
	.over_tbl_m.on:before {opacity:0;}
	.over_tbl_m .inscroll {overflow:auto;}
	.over_tbl_m .inscroll > * {width:768px;}
	.over_tbl_m .inscroll .wset {width:100%; min-width:600px;}
/* 대관안내 */
	.rental_guide_step {flex-direction:column;}
	.rental_guide_step li {width:100%;}
	.rental_guide_step li + li:before {left:50%; top:-20px; width:30px; transform:translateX(-50%) rotate(90deg);}
	.rental_guide_step .txt strong {font-size:16px;}
	.rental_time {flex-direction:column;}
	.rental_time .box {width:100%; padding:15px;}
	.rental_time .tit {font-size:16px; line-height:24px;}
	.rental_time .tit:after {width:24px;}
	.rental_time .con {padding-top:10px; margin-top:10px;}
	.rental_time dl {gap:8px;}
	.rental_time dt {font-size:14px; line-height:30px; height:30px; width:70px;}
	.rental_time dd {width:calc(100% - 70px);}
/* 프로그램 안내 */
	.program_guide {border-radius:10px; padding:40px 15px;}
	.program_guide .sample {height:120px; font-size:16px;}
/* 강사현황 */
	.instructor_status {gap:10px;}
	.instructor_status > li {width:calc(50% - 5px); border-radius:10px; padding:15px;}
	.instructor_status .cate span {font-size:12px; line-height:24px; height:24px; padding:0 10px; min-width:60px;}
	.instructor_status .name {padding:10px 0; margin-bottom:20px; gap:5px; flex-direction:column; align-items:flex-start;}
	.instructor_status .name strong {font-size:20px;}
	.instructor_status .name span {font-size:14px;}
	.instructor_status .con .tt {margin-bottom:4px;}
/* FAQ */
	.faq_top {padding:30px 20px 100px; font-size:15px; margin-bottom:40px;}
	.faq_top:before {width:100px;}
	.faq_top:after {width:80px;}
	.faq_list dt button,
	.faq_list dd {padding:20px 60px 20px 70px;}
	.faq_list dt button:before,
	.faq_list dt button i,
	.faq_list dd:before {width:40px;}
	.faq_list dt button:before,
	.faq_list dd:before {left:15px; font-size:18px;}
	.faq_list dt button i {right:15px;}
	.faq_list dd {padding-right:20px;}
	.faq_list dd:before {top:10px;}
}