/* 서브 공통 */
.sub{width:100%;display:flex; flex-direction: column;}
.subTit{background: url(../img/sub_titleBg.jpg) no-repeat center; background-size: cover; position: relative; padding:70px 0;}
.subTit .layout{display:flex; flex-direction: column; align-items: center;}
.subTit .sub_bread{display:flex; align-items:center; margin-bottom:20px;}
.subTit .sub_bread li{ position:relative; color:#555; }
.subTit .sub_bread li:not(:last-child)::after{content:''; display:inline-block; width:8px; height:8px; border-top:1px solid #555; border-right:1px solid #555; transform:rotate(45deg); margin:0 15px;}
.subTit h3{font-size:2.6em;}
.content{ padding:70px 0 100px; }
.content .layout{display:flex; flex-direction: column; align-items: center;}
.content .layout .sub_tabMenu{display: flex;  justify-content: center; border-radius: 40px; padding:8px; margin-bottom:50px;  background: #eef2f5 }
.content .layout .sub_tabMenu li a{border-radius: 30px; padding:15px 70px; font-size:1.125em; color:#555; white-space: nowrap;}
.content .layout .sub_tabMenu li.on a{background:#004ea2; color:var(--main-color-white);}
.subWrap{width:100%; display:flex;}

/*********** 기존 소스 수정*************/
.tab_content{width:100%;}
.tab_content .grayBx{display:flex; flex-direction: column; min-height:400px;    justify-content: center;  align-items: center;}
.tab_content .grayBx p{font-size:1.2em; margin-top:30px;}

.pro_viewBx,
.pro_viewBx .s-inner,
.pro_viewBx #program02{width:100%;}
.pro_viewBx #program02{display:flex; flex-direction: column;}
.pro_viewBx #program02 .pro_view_top{ margin-bottom:60px;}
.pro_viewBx #program02 .pro_view_top .title{display:flex; align-items: center; justify-content: center;}
.pro_viewBx #program02 .pro_view_top .title h3{ font-size:2.2em;}
.pro_viewBx #program02 .pro_view_top .title_bot{display:flex; justify-content: space-between; gap:80px; padding-top:60px; }
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_s_img{min-width:452px;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_s_img img{width:100%; border-radius: 20px;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right{width: 100%; display: flex; flex-direction: column; align-items: flex-start;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl{margin-bottom:20px;}
.pro_viewBx #program02 .contwrap{display:flex; margin-top:80px; padding-top:80px; border-top:1px solid #ccc;}
.pro_viewBx .stateBtn{font-size:1rem; padding:10px 20px; border-radius: 30px; margin-right:20px; font-weight: normal; color:var(--main-color-white);}
/*접수중*/
.pro_viewBx .stateBtn.s1{background:var(--state-color-01)}
/*접수예정*/
.pro_viewBx .stateBtn.s2{background:var(--state-color-01)}
/*접수마감*/
.pro_viewBx .stateBtn.s3{background:var(--state-color-02)}
.pro_viewBx #program02 .contwrap img{margin:0 auto;}



/*상담및예약*/
.reserveTop {border-top:2px solid #f36f23;  border-left: 1px solid #eee; border-right: 1px solid #eee; border-bottom: 1px solid #eee; 
box-sizing: border-box; padding: 2%; background: #F9F9F9; margin-bottom:5%}
.reserveTop ul li {margin:0.5% 0}

.tarea_h6{ position: relative; font-weight:600; text-align:left;  font-size: 1.2em; color:#2a2f42; padding-left: 20px; }
.tarea_h6:before { content:''; width: 10px; height: 3px; background-color:#0070c2; position: absolute; left:0; top: 50%; margin-top: -1.5px;  }



.pro_submit form{width:100%;}
.mt50{margin-top:50px;}

/* 1-1 센터 소개*/
.sub_intro{position:relative; border-radius:50px; border:1px solid #ccc; padding:130px 70px; }

/* =========================
   circle 기준 wrapper 추가
========================= */

.sub_intro .circle_wrap{
    position:absolute;
    z-index:0;
    top:50%;
    left:50%;
    width:560px;
    height:560px;
    transform:translate(-50%, -50%);
}

/* =========================
   circle
========================= */

.sub_intro .intro_circle{
    position:absolute;
    width:100%;
    height:100%;
    border:2px dashed #efefef;
    box-shadow:0 0 40px rgba(0,0,0,0.05) inset;

    animation:circleRotate 20s linear infinite;
}

.sub_intro .intro_circle,
.sub_intro .intro_circle .inner,
.sub_intro .intro_circle .inner .logo,
.sub_intro .introWrap .item .ico{
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
}

.sub_intro .intro_circle .inner{
    width:430px;
    height:430px;
    background:#f7f8fa;

    animation:circleReverse 20s linear infinite;
}

.sub_intro .intro_circle .inner .logo{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:300px;
    height:300px;
    box-shadow:0 0 20px rgba(0,0,0,0.1);
    background:var(--main-color-white) url(../img/intro_logo.gif) no-repeat center center;
}

.sub_intro .intro_circle .inner .logo p:first-child{font-size:1.2em;}
.sub_intro .intro_circle .inner .logo p:last-child{font-size:1.8em; font-weight:600;}


.sub_intro .circle_arrows{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    pointer-events:none;
}

.sub_intro .circle_arrows .arrow{
    position:absolute;
}

.sub_intro .circle_arrows .arrow span{
    display:block;
    width:14px;
    height:14px;
    border-top:3px solid #ccc;
    border-right:3px solid #ccc;
}

/* arrow 위치 */

.sub_intro .circle_arrows .arrow.top{
    top:-6px;
    left:50%;
    transform:translateX(-50%);
}

.sub_intro .circle_arrows .arrow.right{
    right:-6px;
    top:50%;
    transform:translateY(-50%);
}

.sub_intro .circle_arrows .arrow.bottom{
    bottom:-6px;
    left:50%;
    transform:translateX(-50%);
}

.sub_intro .circle_arrows .arrow.left{
    left:-6px;
    top:50%;
    transform:translateY(-50%);
}

/* arrow 방향 */

.sub_intro .circle_arrows .arrow.top span{
    transform:rotate(225deg);
}

.sub_intro .circle_arrows .arrow.right span{
    transform:rotate(315deg);
}

.sub_intro .circle_arrows .arrow.bottom span{
    transform:rotate(45deg);
}

.sub_intro .circle_arrows .arrow.left span{
    transform:rotate(135deg);
}


.sub_intro .introWrap{display:flex; flex-wrap: wrap; justify-content: space-between; gap:100px; z-index: 0;}

.sub_intro .introWrap .item {display:flex; align-items: center; gap:50px; }

.sub_intro .introWrap .item:nth-of-type(2n+1){flex-direction: row-reverse;}

.sub_intro .introWrap .item .box{display:flex; flex-direction: column;}

.sub_intro .introWrap .item .box .tit{font-size:1.7em; margin-bottom:25px; font-weight: 600; color:#0071bb;}

.sub_intro .introWrap .item.on .box .tit{color:#f36f23;}

.sub_intro .introWrap .item .box .cont{line-height:1.8; word-break: keep-all; border-left:1px solid #ccc; padding:5px 0 5px 20px;}

.sub_intro .introWrap .item .ico{width:125px; height:125px; background:#0071bb;}

.sub_intro .introWrap .item.on .ico{position:relative; background: #f36f23; z-index: 1;}

.sub_intro .introWrap .item.on .ico:after{position:absolute; width:calc(100% + 20px); height:calc(100% + 20px);border-radius: 50%; content:'';  background: #f36f23; opacity: 0.3; z-index: -1;}

.sub_intro .introWrap .item .ico,
.sub_intro .introWrap .item .box .tit{
    transition: all 0.4s ease;
}

.sub_intro .introWrap .item{
    transform:scale(0.9);
    transition:all 0.5s ease;
}

.sub_intro .introWrap .item.on{
    transform:scale(1);
}

.sub_intro .introWrap .item.on .ico{
    background:#f36f23;
    transform:scale(1.1);
}

.sub_intro .introWrap .item.on .ico:after{
    position:absolute;
    width:calc(100% + 20px);
    height:calc(100% + 20px);
    border-radius:50%;
    content:'';
    background:#f36f23;
    opacity:0.25;
    animation:pulse 1.2s infinite;
}

@keyframes pulse{
    0%{
        transform:scale(1);
        opacity:0.4;
    }
    100%{
        transform:scale(1.3);
        opacity:0;
    }
}

.sub_intro .introWrap .item .box{
    transform:translateY(15px);
    transition:all 0.5s ease;
    width:calc(100% - 155px);
}

.sub_intro .introWrap .item.on .box{
    transform:translateY(0);
}


/* =========================
   circle animation
========================= */

@keyframes circleRotate{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}

@keyframes circleReverse{
    from{transform:rotate(0deg);}
    to{transform:rotate(-360deg);}
}

/* 1-2 찾아오시는 길 */
.locWrap,
.loc_top{width:100%;}
.loc_top{display:flex;}
.loc_top .mapBx{position:relative; min-height:630px;width:70%; overflow: hidden; border:1px solid #ccc;}
.loc_top .mapBx .loc_info{position:absolute; display:flex; align-items: center; justify-content: space-between; border-radius: 50px; padding:10px; background:#1d2a36; bottom:30px; width:calc(100% - 100px); left:50%; transform: translateX(-50%); z-index: 9999;} 
.loc_top .mapBx .loc_info .left{font-size:1.125em; color:var(--main-color-white);}
.loc_top .mapBx .loc_info .left strong{margin:0 20px;}
.loc_top .mapBx,
.loc_bot .bot_right .item,
.loc_top .trans_info{ border-radius: 30px;}
.loc_top .trans_info{width:36%; display:flex; flex-direction: column; padding:40px; justify-content: center; border:1px solid #ccc;}
.loc_top .trans_info .box{}
.loc_top .trans_info .box h4{font-size:1.3em; margin-bottom:20px;}
.loc_top .trans_info .box{ padding-bottom:30px; margin-bottom:30px; border-bottom:1px solid #ccc; }
.loc_top .trans_info .box:last-child{ padding-bottom:0; margin-bottom:0;border-bottom:0; }
.loc_top .trans_info .subway
.loc_top .trans_info .subway,
.loc_top .trans_info .bus ul{display:flex; flex-direction: column;}
.loc_top .trans_info .subway_top{display:flex;font-weight:bold; align-items: center; margin-bottom:10px;}
.loc_top .trans_info .subway_top .line{display:flex; align-items: center; margin-right:25px;}
.loc_top .trans_info .subway_top .line strong{display:flex; align-items: center; justify-content: center; color:var(--main-color-white); background: #de4552; border-radius: 50%; font-size:1.25em; font-weight:500; width:32px; height:32px; margin-right:10px;}
.loc_top .trans_info .subway_top .line span{color:#de4552; font-size:1.125em;}
.loc_top .trans_info .subway_top .exit{font-size:1.2em; font-weight:500;}
.loc_top .trans_info .bus p{font-size:1.2em; margin-bottom:20px;}
.loc_top .trans_info .bus ul li{display:flex;align-items: center;  font-size:1.1em; margin-bottom:10px;}
.loc_top .trans_info .bus ul li .tit{white-space: nowrap; padding:5px 20px; font-size:0.9em; color:var(--main-color-white); border-radius: 30px; margin-right:20px;}
.loc_top .trans_info .bus ul li.type01 .tit{background:#3cc344;}
.loc_top .trans_info .bus ul li.type02 .tit{background:#386de8;}
.loc_top .trans_info .bus ul li.type03 .tit{background:#ff451e;}
.loc_top,
.loc_bot .bot_right{gap:40px}

.loc_bot{margin-top:70px; display:flex; justify-content: space-between; align-items: center; }
.loc_bot .bot_left{}
.loc_bot .bot_left .tit{font-size:1.2em;}
.loc_bot .bot_left .time{font-size:1.9em; margin:20px 0 10px; display:inline-block;}
.loc_bot .bot_left .info{font-size:1.025em; color:#555;}
.loc_bot .bot_right{display:flex; width:60%;}
.loc_bot .bot_right .item{width:100%; padding:150px 30px 30px;position:relative; display:flex; flex-direction: column; background: #eef2f5; transition: all 0.3s;}
.loc_bot .bot_right .item:before{position:absolute; width:76px; height:70px; right:30px; top:30px; content:''; }
.loc_bot .bot_right .item:nth-of-type(1):before{background: url(../img/sub_loc_ico1.png) no-repeat; background-size: contain}
.loc_bot .bot_right .item:nth-of-type(2):before{background: url(../img/sub_loc_ico2.png) no-repeat; background-size: contain}
.loc_bot .bot_right .item:nth-of-type(3):before{background: url(../img/sub_loc_ico3.png) no-repeat; background-size: contain}
.loc_bot .bot_right .item .fc01{font-size:1.1em; font-weight:600; margin-bottom:10px;}
.loc_bot .bot_right .item .bot{font-size:1.35em; font-weight:600;}
.loc_bot .bot_right .item:last-child .bot{font-size:1.2em; font-weight:normal;}
.loc_bot .bot_right .item:hover{transform: translateY(-10px);}
.btn_kakao{padding:10px 20px 10px 50px; position: relative; border-radius: 50px; background:#fae000; font-size:1.025em; transition: all 0.3s; transform: scale(1.0);}
.btn_kakao:before{position:absolute; top:50%; left:20px; width:20px; height:24px; transform: translateY(-50%); content:''; background:url(../img/kakao_ico.jpg) no-repeat; background-size: contain;}
.btn_kakao:hover{transform: scale(1.05);}


.loc_top .trans_info .box .conLst2{padding-left:0;}


/* 2-2 프로그램 신청 리스트 */
.sub_proLstBx{display:flex; flex-direction: column;}
.proLst{display:flex; flex-wrap: wrap; gap:60px 40px;}
.proLst li{border:1px solid #efefef; max-width:calc(33.3333% - 30px); width:100%; margin-right:0; font-size:15px; padding:20px;}
.proLst li a .pro_title{min-height:auto; font-size:1.5em;}
.proLst li a .pro_state{padding:12px 20px; border-radius: 0 20px 0 20px;}
/* 리스트 페이징  */
.pg_wrap{}
.stateTab{display:flex; justify-content: center; gap:20px; margin:20px 0 50px;}

.stateTab > li > a{padding:0 15px 15px; font-size:1.125em; position:relative;}
.stateTab > li.on > a{position: relative; color:var(--main-color-orange);}
.stateTab > li > a:before{position:absolute; bottom:0; left:0; height:3px; background:var(--main-color-orange); content:''; width:0; transition: all 0.3s;}
.stateTab > li.on > a:before{ width:100%;}
.sub_proLstBx .proLst li a .pro_state{border-radius: 0 20px 0 20px;}

.sub_login{justify-content: center; align-items: center;}
.grayBx,
#bo_v,
#bo_w{padding:50px; border:1px solid #efefef; border-radius: 30px;}

/****************회원관련****************/
/* 박스 */
.login_box {
    width:100%;
    max-width:500px;
}
.login_box.mypage_wrap{max-width:none;}
.login_box.prog_view,
.find_wrap{max-width:1300px;}

/* 타이틀 */
.login_title {
    text-align:center;
    font-size:24px;
    font-weight:700;
    margin-bottom:30px;
}

/* 인풋 */
.input_group {
    margin-bottom:15px;
}

.input_group input {
    width:100%;
    height:48px;
    padding:0 15px;
    border:1px solid #ddd;
    border-radius:8px;
    font-size:1em;
    transition:0.2s;
}

.input_group input:focus {
    border-color:#4a90e2;
    outline:none;
}

/* 옵션 */
.login_option {
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:1em;
    margin-bottom:20px;
}

.login_option input {
    margin-right:5px;
}

.find_pw {
    color:#666;
    text-decoration:none;
}

.find_pw:hover {
    text-decoration:underline;
}


.login_btn:hover {
    background:#357bd8;
}

/* 하단 */
.login_bottom {
    text-align:center;
    margin-top:40px;
    font-size:1em;
}
.login_bottom p{color:#777; font-size:0.9em;}
.join_btn {
    margin-top:5px;
    font-weight:600;
    text-decoration:none;
}

.join_btn:hover {
    text-decoration:underline;
}


/* 좌우 정렬 */
.find_inner {
    display:flex;
    gap:50px;
}

/* 각각 박스 */
.find_box {
    flex:1;
}

/* 타이틀 */
.login_box h3 {
    font-size:1.3em;
    font-weight:600;
    margin-bottom:25px;
    text-align:center;
}

/* 구분선 느낌 (선택) */
.find_box + .find_box {
    border-left:1px solid #eee;
    padding-left:50px;
}
.login_box .basicBtn.btn_confirm{width:100%;}
.login_box.prog_view .basicBtn.btn_confirm{width:auto;}
.join_wrap {
    max-width:600px;
}

/* 그룹 */
.form_group {
    margin-bottom:30px;
}

.form_group label {
    display:block;
    font-weight:600;
    margin-bottom:8px;
}



/* 인풋 */
.form_group input {
    width:100%;
}

/* 가로 정렬 */
.flex_row {
    display:flex;
    gap:10px;
}


.custom_radio {
    display:flex;
    gap:10px;
}

/* input 숨김 */
.custom_radio input {
    display:none;
}

/* 기본 텍스트 */
.custom_radio span {
    display:inline-block;
    padding:10px 20px;
    border:1px solid #ddd;
    border-radius:8px;
    cursor:pointer;
    transition:0.2s;
}

/* hover */
.custom_radio span:hover {
    border-color:var(--main-color);
    color:var(--main-color);
}

/* 선택됐을 때 */
.custom_radio input:checked + span {
    background:var(--main-color);
    color:#fff;
    border-color:var(--main-color);
}
.flex_row.phone{align-items: center;}
.flex_row input {
    flex:1;
}

.custom_check {
    display:flex;
    gap:10px;
}

/* input 숨김 */
.custom_check input {
    display:none;
}

/* 버튼 스타일 */
.custom_check span {
    display:inline-block;
    padding:10px 20px;
    border:1px solid #ddd;
    border-radius:8px;
    cursor:pointer;
    transition:0.2s;
}

/* hover */
.custom_check span:hover {
    border-color:var(--main-color);
    color:var(--main-color);
}

/* 체크됐을 때 */
.custom_check input:checked + span {
    background:var(--main-color);
    color:#fff;
    border-color:var(--main-color);
}


/* 폰번호 */
.phone input {
    width:60px;
    text-align:center;
}

/* 생년월일 */
.birth input {
    text-align:center;
}

/* 라디오 */
.radio_group {
    display:flex;
    gap:10px;
}
/* 약관 */

.agree_box {margin-bottom:20px;}
.agree_box ul{display:flex; flex-direction: column; gap:10px;}
.agree_box ul li{display:flex; align-items: center; justify-content: space-between; padding:15px 20px; background: #eef2f5; border-radius: 8px;}
.agree_box ul li label{margin:0;}
.agree_box ul li .btn_link{font-size:0.9em; color:#555; text-decoration: underline;}

/* 메시지 */
.form_msg {
    font-size:0.9em;
    color:#888;
    margin-top:8px;
}
.addressBx{display:flex; flex-direction: column; gap:10px;}
.input_readonly {
    /*width:100%;*/
    background:#e5e7e9;
    color:#555;
}

/* 포커스 막기 느낌 */
.input_readonly:focus {
    outline:none;
    border-color:#ddd;
    box-shadow: none;
}



/****************** 테이블 *****************/
/* 테이블 */
.table_wrap{
    overflow-x:auto;
}


.commtbl{
    width:100%;
    border-collapse:collapse;
    font-size:1em;
    border-top:2px solid var(--main-color-black);
}

.commtbl thead{
    background:#f5f7fa;
}
.commtbl tbody{width:100%;}

.commtbl thead th{
    padding:16px 10px;
    font-weight:600;
    border-bottom:1px solid #ddd;
    text-align:center;
}

.commtbl tbody th{
    border-bottom:1px solid #222;
}
.commtbl td{
    padding:12px;
    border-bottom:1px solid #eee;
    
}
.commtbl th.tac,
.commtbl td.tac{text-align:center;}
/* 제목 */
.commtbl .title{
    text-align:left;
}

.commtbl .title a{
    color:#333;
    text-decoration:none;
    transition:0.2s;
}

.commtbl .title a:hover{
    color:var(--main-color);
}

/* 상태 뱃지 */
.commtbl .status{
    display:inline-block;
    padding:4px 10px;
    border-radius:20px;
    font-weight:600;
    white-space: nowrap;
}

.commtbl .status.approved{
    background:#e6f4ff;
    color:var(--state-color-01)
}

.commtbl .status.wait{
    background:#fff4e5;
    color:#ff9800;
}

.commtbl .status.reject{
    background:#ffe5e5;
    color:#e74c3c;
}

/* 페이징 */
.pg_wrap{margin-top:50px;}

.pg_wrap .pg{
    display:flex;
    justify-content:center;
    gap:10px;
    width:100%;
}

.pg_wrap .pg [class*='pg']{
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:50%;
    background:#eef2f5;
    width:50px;
    height:50px;
    position:relative;
    transition: all 0.3s;
}
.pg_wrap .pg [class*='pg']:hover{cursor: pointer; transform: translateY(-10px);box-shadow: 0 0 10px rgba(112,133,211,0.4); }
.pg_prev,
.pg_start,
.pg_next,
.pg_end{font-size:0; }
.pg_wrap .pg .pg_current{
    background:var(--main-color);
    color:#fff;
    font-size:16px;
}
/* 이전, 다음, 맨처음, 맨끝 */
.pg_prev::before{
    content:'';
    width:8px;
    height:8px;
    border-left:2px solid #333;
    border-bottom:2px solid #333;
    transform:rotate(45deg);
}
.pg_next::before{
    content:'';
    width:8px;
    height:8px;
    border-right:2px solid #333;
    border-top:2px solid #333;
    transform:rotate(45deg);
}
.pg_start::before,
.pg_start::after{
    content:'';
    position:absolute;
    width:8px;
    height:8px;
    border-left:2px solid #333;
    border-bottom:2px solid #333;
    transform:rotate(45deg);
}

.pg_start::before{ left:16px; }
.pg_start::after{ left:24px; }

.pg_wrap .pg .pg_end::before{
    content:'>>';
    font-size:16px;
    font-weight:600;
}

.pg_wrap .pg .pg_end::before{
    content:'';
    width:8px;
    height:8px;
    border-top:2px solid #333;
    border-right:2px solid #333;
    transform:rotate(45deg);
    display:inline-block;
    margin-right:-2px;
}

.pg_wrap .pg .pg_end::after{
    content:'';
    width:8px;
    height:8px;
    border-top:2px solid #333;
    border-right:2px solid #333;
    transform:rotate(45deg);
    display:inline-block;
}
.prog_write_top{font-size:1.5em; text-align: center; font-weight:600; margin-bottom:20px;}



.confirmBx{display:flex; flex-direction: column; align-items: center; width:100%; max-width: 30%; margin:0 auto;}
.confirmBx .inputWrap{width:100%; margin:30px auto 10px;}

.al{display:flex; justify-content: space-between; align-items: center; width:100%; margin-bottom:10px;}
.confirmTxt{ text-align:center; margin:20px auto 30px; }
.confirmTxt strong{display:inline-block; margin-top:10px; color:var(--main-color); font-size:1.3em;}
@media screen and (max-width: 1700px) {
/* 서브 공통 */
.subTit h3{font-size:2.2em;}
.content .layout .sub_tabMenu li a{padding:12px 50px;}

/* 1-1 센터 소개*/
.sub_intro{padding:120px 40px;}
.sub_intro .introWrap{justify-content: center; gap:100px 10%;}
.sub_intro .introWrap .item .box .tit{font-size:1.5em;}
.sub_intro .circle_wrap{width:500px; height:500px;}
.sub_intro .intro_circle .inner{width:380px; height:380px;}
.sub_intro .intro_circle .inner .logo{width:280px; height:280px;}
.sub_intro .introWrap .item{width:45%;}
.sub_intro .introWrap .item .ico{width:100px; height:100px;}
.sub_intro .introWrap .item .ico img{width:60%;}
.sub_intro .intro_circle .inner .logo p:first-child{font-size:1.025em;}
.sub_intro .intro_circle .inner .logo p:last-child{font-size:1.6em;}
.sub_intro .introWrap .item .box .cont br{display:none;}
.sub_intro .introWrap .item .box{width:calc(100% - 150px);}

/* 1-2 찾아오시는 길 */
.loc_top .trans_info .bus p,
.loc_top .trans_info .bus ul li{font-size:1.1em;}
.loc_top,
.loc_bot .bot_right{gap:30px}
.loc_bot .bot_right{width:70%;}
}





@media screen and (max-width: 1440px) {
    /* 서브 공통 */
    .subTit{padding:60px 0;}
    .content{padding:50px 0 70px;}
    .subTit .sub_bread{margin-bottom:10px;}
    .content .layout .sub_tabMenu{margin-bottom:40px;}
    .content .layout .sub_tabMenu li a{font-size:1.025em;}

    /* 1-1 센터 소개*/
    .sub_intro{padding:90px 40px; border-radius: 30px;}
    .sub_intro .circle_wrap{width:470px; height:470px;}
    .sub_intro .introWrap{gap:15px 20%;}
    .sub_intro .introWrap .item{width:40%;}
    .sub_intro .introWrap .item .box .tit{margin-bottom:15px;}


    /* 1-2 찾아오시는 길 */
    .loc_top .mapBx .loc_info{width:calc(100% - 60px)}
    .loc_top .trans_info{padding:30px;}
    .loc_top .mapBx .loc_info .left,
    .loc_top .trans_info .subway_top .exit{font-size:1.025em;}
    .loc_top .trans_info .box:first-child{padding-bottom:30px; margin-bottom:30px;}



    .grayBx,
    #bo_v,
    #bo_w{padding:40px;}
    .commtbl thead th{padding:15px 5px;}
    .commtbl td{padding:12px 5px;}
    .commtbl thead th,
    .commtbl td{font-size:1em;}

    .pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl td{padding:12px 15px;}



}


@media screen and (max-width:1200px) {
    /* 서브 공통 */
    .loc_top .mapBx, .loc_bot .bot_right .item, .loc_top .trans_info{border-radius: 20px;}

    /* 1-1 센터 소개*/
    .sub_intro{padding:70px 30px;}
    .sub_intro .circle_wrap{width:350px; height:350px;}
    .sub_intro .intro_circle .inner{width:250px; height:250px;}
    .sub_intro .intro_circle .inner .logo{width:120px; height:120px; background-size:70%;}
    .sub_intro .intro_circle .inner .logo p{display:none;}
    .sub_intro .introWrap{gap:30px 4%;}
    .sub_intro .introWrap .item{width:48%;}


    /* 1-2 찾아오시는 길 */
    .loc_top,
    .loc_bot{flex-direction: column;}
    .loc_bot{margin-top:50px;}
    .loc_top .mapBx, .loc_top .trans_info{width:100%;}
    .loc_top .mapBx{min-height:450px;}
    .loc_bot .bot_right .item{padding:120px 30px 20px;}
    .loc_bot .bot_right .item:before{width:56px; height:50px;}
    .loc_bot .bot_right{width:100%}
    .loc_bot .bot_left .tit,
    .loc_bot .bot_right .item:last-child .bot{font-size:1.025em;}
    .loc_bot .bot_left .time{font-size:1.7em;}
    .loc_bot .bot_right .item .bot{font-size:1.2em;}
    .loc_bot .bot_left .info{text-align: center;}
    .loc_bot .bot_left{display:flex; flex-direction: column; align-items: center; margin-bottom:40px;}

    .proLst{gap:50px 40px;}
    .proLst li{max-width:calc(50% - 20px);}
     .proLst li a .pro_title{font-size:1.25em;}



     .pro_viewBx #program02 .pro_view_top .title_bot .thumb_s_img{min-width:40%;}
     .pro_viewBx #program02 .pro_view_top .title h3{font-size:1.8em;}
     .pro_viewBx #program02 .pro_view_top .title_bot{gap:60px; padding-top:40px;}


.confirmBx{ max-width: 50%;}
}



@media screen and (max-width:1024px) {
    /* 서브 공통 */
    .subTit{padding:50px 0;}
    .subTit h3{font-size:1.8em;}
    .content .layout .sub_tabMenu{margin-bottom:30px;}
    .loc_top .mapBx .loc_info{width:calc(100% - 40px);}



   /* 1-1 센터 소개*/
   .sub_intro{padding:0; border:0;}
   .sub_intro .introWrap .item:nth-of-type(2n+1){flex-direction: row;}
   .sub_intro .circle_wrap{display:none;}
   .sub_intro .introWrap{gap:20px; flex-direction: column;}
   .sub_intro .introWrap .item{width:96%; margin:0 auto; border:1px solid #ccc; padding:30px; border-radius: 15px;}
   .sub_intro .introWrap .item.on .ico:after{width:calc(100% + 10px); height:calc(100% + 10px);}

.sub_intro .introWrap .item.on .ico,
.sub_intro .introWrap .item{transform:scale(1.0);}
.sub_intro .introWrap .item .box{transform:translateY(0);}

    /* 1-2 찾아오시는 길 */
    .loc_top .mapBx{min-height:400px;}



    /****************회원관련****************/
    .login_box, 
    .find_wrap,
    .login_box.prog_view{max-width:80%;}
        .find_wrap .find_inner{flex-direction: column; gap:40px;}
        .find_box + .find_box{padding:40px 0 0 0; border-top:1px solid #eee; border-left:0;}

            .grayBx,
            #bo_v,
            #bo_w{padding:30px;}



    .commtbl{border-top:0;} 
    .commtbl .col_num{display:none;}           
    .commtbl thead{
        display:none;
    }

    .commtbl tr{
        display:block;
        margin-bottom:15px;
        border:1px solid #ddd;
        border-radius:10px;
        padding:20px;
    }
    .commtbl thead th, .commtbl td{font-size:1em;}
    .commtbl td{
        display:flex;
        justify-content:center;
        padding:2px 0;
        border:none;
    }

    .commtbl .title{
        flex-direction:column;
        align-items:center;
        font-size:1.125em;
        font-weight:bold;
        padding-bottom:12px;
        margin-bottom:12px;
        border-bottom:1px solid #ddd;
    }
  .pg_wrap .pg{
        gap:6px;
    }

    .pg_wrap .pg [class*='pg']{
        width:40px;
        height:40px;
    }

    .pg_wrap .pg .pg_end::before,
    .pg_wrap .pg .pg_end::after{
        width:6px;
        height:6px;
    }



    .grayBx.mypage_wrap{padding:0; border:0;}
.pg_wrap{margin-top:30px;}


.commtbl .basicBtn.btn_cancel{margin:10px auto 0;}


.prog_view .commtbl{border:1px solid #ddd; padding:20px; border-radius:10px; display:flex; flex-wrap: wrap;}
.prog_view .commtbl tr{padding:0; border-radius: 0; border:0; width:100%; display:flex; flex-direction: column; gap:10px;}
.prog_view .commtbl tr th,
.prog_view .commtbl tr td,
.prog_view .commtbl tr td input{width:100%}
.prog_view .commtbl tr th{text-align: left; border-bottom:0;}
.prog_view .commtbl tr td{margin-bottom:10px;}

.prog_view .commtbl .radio_group,
.prog_view .commtbl .radio_group label,
.prog_view .commtbl .custom_radio input + span,
.prog_view .commtbl .custom_check,
.prog_view .commtbl .check_group label,
.prog_view .commtbl .check_group input + span{width:100%;}
.prog_view .commtbl .custom_radio input + span,
.prog_view .commtbl .check_group input + span{text-align: center;}

.pro_viewBx .stateBtn{padding:6px 15px;}
.pro_viewBx #program02 .pro_view_top .title h3{font-size:1.6em;}
.pro_viewBx #program02 .pro_view_top .title_bot {flex-direction: column; align-items: center;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl td{padding:10px 0 0;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl tbody{display:flex; flex-wrap: wrap; justify-content: space-between;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl tbody tr{width:calc(50% - 10px);}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl tbody th{border-bottom:0; text-align: center;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl td{justify-content: flex-start;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right{align-items: center;}
.pro_viewBx #program02 .contwrap{margin-top:60px; padding-top:60px;}
 .pro_viewBx #program02 .pro_view_top .title_bot{gap:40px;}


#program04 .commtbl tr{padding:0; border:0;margin:0;}
#program04 .commtbl tr input{width:100%;}
#program04 .commtbl tr td{margin-bottom:20px;}
#program04 .commtbl tbody th{border:0; padding-bottom:5px;}
#program04 .radio_group,
#program04 .custom_check{width:100%;}



}






@media screen and (max-width: 768px) {
    /* 서브 공통 */
    .subTit{padding:30px 0;}
    .btn_kakao{font-size:1em;}
    .subTit .sub_bread li{font-size:0.9em;}
    .subTit .sub_bread li:not(:last-child)::after{margin:0 10px;}
    .subTit h3{font-size:1.4em;}
    .content{padding:40px 0;}
    .content .layout .sub_tabMenu{padding:3px;}
    .content .layout .sub_tabMenu li a{font-size:1em; padding:8px 9px;}
    .grayBx,
    #bo_v,
    #bo_w{padding:20px; border-radius: 15px;}



     /* 1-1 센터 소개*/

     .sub_intro .introWrap .item .ico{width:80px; height:80px;}
     .sub_intro .introWrap .item{width:100%; padding:25px;}
    .sub_intro .introWrap .item .box{width:calc(100% - 130px);}
    .sub_intro .introWrap .item .box .tit{font-size:1.3em;}
    .sub_intro .introWrap .item .box .cont{padding:0; border:0;}

    /* 1-2 찾아오시는 길 */
    .loc_top .mapBx{min-height:350px;}
    .loc_top .mapBx, .loc_bot .bot_right .item, .loc_top .trans_info{border-radius:15px;}
    .loc_top .mapBx .loc_info{flex-direction: column; bottom:10px; border-radius: 15px; width:calc(100% - 20px);}
    .loc_top .mapBx .loc_info .left{width:80%; text-align: center; word-break: keep-all; margin-bottom:10px; font-size:1em;}
    .loc_top .mapBx .loc_info .left strong{display:none;}
    .loc_top .trans_info{padding:20px;}
    .loc_top .trans_info .box h4{font-size:1.2em; margin-bottom:15px;}
    .loc_top .trans_info .subway_top .line span,
    .loc_top .trans_info .bus ul li{font-size:1em;}
    .loc_top .trans_info .box:first-child{padding-bottom:20px; margin-bottom:20px;}
    .loc_top .trans_info .bus ul li .tit{margin-right:10px;}
    .loc_bot .bot_left .time{font-size:1.5em;}
    .loc_bot .bot_right{flex-direction: column;}
    .loc_bot .bot_right .item{padding:30px 80px 30px 30px;}
    .loc_bot .bot_right{gap:20px;}
    .loc_bot .bot_right .item:before{width:46px; height:40px; top:50% ; transform: translateY(-50%);}
    .loc_bot .bot_right .item:hover{transform: translateY(0);}

        /****************회원관련****************/
    .form_group{margin-bottom:20px;}



    .login_box, .find_wrap, .login_box.prog_view{max-width:none;}


    .proLst{gap:40px;}
    .proLst li{max-width:100%;}
    .stateTab{gap:10px;}
.stateTab > li > a{font-size:1em; padding:0 8px 10px;}


/*********** 기존 소스 수정*************/
.tab_content .grayBx{ min-height:300px;}
.tab_content .grayBx img{width:100px;}
.tab_content .grayBx p{font-size:1.025em; margin-top:20px;}
.pro_viewBx #program02 .pro_view_top .title_bot{gap:20px; padding-top:30px;}
.pro_viewBx #program02 .pro_view_top .title_bot .thumb_right .commtbl tbody tr{width:100%; padding:15px;}
.pro_viewBx #program02 .contwrap{margin-top:40px; padding-top:40px;}
.pro_viewBx #program02 .pro_view_top .title{flex-direction: column;}
.pro_viewBx .stateBtn{font-size:0.9rem; margin:0 0 15px 0;}

.confirmBx{ max-width: 100%;}
.proLst li a .pro_info p strong,
.proLst li a .pro_info p,
.proLst li a .pro_info p{font-size:1em;}


.commtbl tr{border:0; padding:0;}
.commtbl tbody th{border-bottom:0; }
.commtbl td{width:100%; margin:5px 0 20px;}
.commtbl td input{width:100%;}
.radio_group,
.custom_check,
.radio_group input,
.custom_check input,
.radio_group label,
.custom_check label,
.radio_group span,
.custom_check span{width:100%;}
.radio_group span,
.custom_check span{text-align: center;}

.commtbl.view_commTbl td{justify-content: flex-start;}
}


@media screen and (max-width:425px) {
  /* 1-1 센터 소개*/
  .sub_intro .introWrap .item,
  .sub_intro .introWrap .item:nth-of-type(2n+1){flex-direction: column;}
  .sub_intro .introWrap .item .box{width:100%;}
  .sub_intro .introWrap .item{gap:15px; padding:20px;}
  .sub_intro .introWrap .item .box .tit,
  .sub_intro .introWrap .item .box .cont{text-align: center;}

}