@import url(content.css);
@import url(board.css);
@import url(admin.css);
@import url(login.css);
@import url(sweetalert2.min.css);


:root{
  /* 무정차카드 */
  /********************
  01 비씨
  02 국민
  03 하나
  04 삼성
  06 신한
  07 현대
  08 롯데
  11 시티
  12 농협

  13 수협
  15 우리
  32 우체국
  44 카카오

  ********************/
  --card-default-border:#8e8e8e;
  --card-default-bg:#e8e8e8;

  --card-01-border:#e83e44;
  --card-01-bg:#f8c5c7;
  --card-02-border:#766c61;
  --card-02-bg:#d6d3cf;
  --card-03-border:#009b90;
  --card-03-bg:#b2e1dd;
  --card-04-border:#0b4da2;
  --card-04-bg:#b5c9e3;
  --card-06-border:#0046ff;
  --card-06-bg:#b2c7ff;
  --card-07-border:#000;
  --card-07-bg:#b2b2b2;
  --card-08-border:#ed1b23;
  --card-08-bg:#fababd;
  --card-11-border:#004087;
  --card-11-bg:#b2c5da;
  --card-12-border:#0066b3;
  --card-12-bg:#b2d1e8;
  --card-13-border:#0e6bb0;
  --card-13-bg:#b6d2e7;
  --card-15-border:#0083cb;
  --card-15-bg:#b2daef;
  --card-32-border:e61a0f;
  --card-32-bg:#f7bab7; 
  --card-44-border:#ffe300;
  --card-44-bg:#fff7b2;

  --modal_bg-color:#ebeef3;

  --subTopBx-bg:#a2cce9;
}


body{height:100%;}
/*#wrap .basicbtn{background:var(--main-color-classicblue); color:var(--main-color-white);}*/
.btnWrap{margin-top:20px; display: flex; flex-wrap:wrap; align-items: center; justify-content: center;}
.btnWrap a{margin:0 10px 10px 0!important;}

/**************** 헤더 ****************/
.headerBx{position:fixed; top:0; left:0; width:100%; z-index:1000;}
.pc_header{padding:0 40px; display:flex; align-items: center; justify-content: space-between; width:100%; border-bottom:1px solid rgba(0,0,0,0.2); background:var(--main-color-lightblue); transition: all 0.3s;}
.pc_header h1 a{display:block;}
.pc_header h1 a img{width:100%;}
.pc_header.scroll{background:var(--main-color-white);}
.pc_header .gnb{position:relative; display:flex; align-items: center; width:60%; height:100%; z-index:100; }
.pc_header .gnb > li{position:relative; width:25%; text-align: center; }
.pc_header .gnb > li:before{position:absolute; bottom:0; left:50%; width:0;  height:2px; content:''; background:var(--main-color-blue); transform:translateX(-50%); transition: all 0.3s;}
.pc_header .gnb > li:hover:before{width:80%;}
.pc_header .gnb > li > a{display:block; padding:38px 0; font-size:1.25em; white-space: nowrap;}
.pc_header .gnb > li a:hover{color:var(--main-color-blue);}
.pc_header .gnb .depth-1{display:none; position:absolute; top: 101px; left: 50%; transform: translateX(-50%); width: 100%; background: var(--main-color-white);}
.pc_header.on .gnb .depth-1{display:block;}
.pc_header .gnb .depth-1 ul{display:flex; flex-direction: column; width: 100%; padding:20px 0;}
.pc_header .gnb .depth-1 ul li{margin-bottom:5px;}
.pc_header .gnb .depth-1 ul li:last-child{margin-bottom:0;}
.pc_header .gnb .depth-1 ul li a{display:block; padding:8px 0; font-size:1em;}
.pc_header.on{background:var(--main-color-white);}
.pc_header.on:after{position:absolute; top:101px; left:0; width:100%; height:310px; content:''; background:var(--main-color-white); z-index:10;}
.pc_header .h_utile{display: flex; flex-direction: row; align-items: center;}
.pc_header .h_utile .util_join{position:relative; display: flex; flex-direction: column; align-items: center;}
.pc_header .h_utile .util_join span.icon-join{font-size:1.75em;}
.pc_header .h_utile .util_join .logTxt{display:inline-block; position:relative; padding:10px 0 10px 25px; font-size:0.9em; text-transform: uppercase;}
.pc_header .h_utile .util_join .logTxt:before{position:absolute; content:''; bottom:0; left:0; width:0; height:1px; background:var(--main-color-black); transition: all 0.3s;}
.pc_header .h_utile .util_join .logInTxt:after{position:absolute; content:''; top:50%; left:0; transform: translateY(-50%); width:16px; height:16px; background:url(../img/login.png) no-repeat center; }

/*.pc_header .h_utile .util_join .logoutTxt:after{width:18px; background:url(../img/logout.png) no-repeat center; }*/
.logoutBx{display:flex; align-items: center;}
.logoutBx .logoutTxt{padding:10px 0; margin-right:10px;}
.logoutBx .logoutBtn{border:1px solid rgba(0,0,0,0.1); border-radius: 5px; position:relative; padding:8px 8px 8px 30px; font-size:0.9em; text-transform: uppercase; transition: all 0.3s;}
.pc_header .util_join{margin-right:20px;}
.logoutBx .logoutBtn:hover{border:1px solid rgba(0,0,0,0.5); }
.logoutBx .logoutBtn:after{position:absolute; content:''; width:18px; height:15px; left:8px; top:50%; transform: translateY(-50%); background:url(../img/logout.png) no-repeat center; }
.pc_header .h_utile .util_join .logTxt:hover:before{width:100%;}

.pc_header .menu-trigger,
.pc_header .menu-trigger span{display: inline-block; transition: all 0.3s;} 
.pc_header .menu-trigger{position: relative; width: 26px; height: 24px;}
.pc_header .menu-trigger span{position: absolute; left: 0; width: 100%; height: 2px; background: var(--main-color-black);}
.pc_header .menu-trigger span:nth-of-type(1){top: 0;}
.pc_header .menu-trigger span:nth-of-type(2) {top: 10px;}
.pc_header .menu-trigger span:nth-of-type(3) {bottom: 0;}
.pc_header .menu-trigger.active span:nth-of-type(1) {transform: translateY(11px) rotate(-45deg);}
.pc_header .menu-trigger.active span:nth-of-type(2) {opacity: 0;}
.pc_header .menu-trigger.active span:nth-of-type(3) {transform: translateY(-11px) rotate(45deg);}
.pc_header .menu-trigger:hover{cursor:pointer;}
.mob_header{display:none;}
.conTit{padding-left:50px; position:relative; display:inline-block; font-weight:bold; letter-spacing: -0.1em; font-size:1.786em;}
.conTit:before{content:''; position:absolute; top:50%; left:0; transform:translateY(-50%); width: 44px; height: 33px; background:url(../img/title.png) no-repeat left center; background-size:contain;}

/**************** #1 비주얼****************/
.visual{position:relative; height:calc(100vh - 101px);  padding:20vh 0; background:var(--main-color-lightblue) url(../img/main_bg.png) no-repeat center; background-size:100%; z-index:0;}
.visual .m_search{display:flex; flex-direction: column; justify-content: space-between; align-items: center;}
.visual .m_search .search_logo{margin-bottom:50px; display:flex; align-items: center;}
.visual .m_search .search_logo img{max-width:100%;}
.visual .m_search .search_logo img:first-child{margin-right:15px;}
.visual .m_search .searchBx{position:relative; padding:0; width:100%; max-width:748px; border-radius:60px; overflow:hidden; transition:all 0.3s; background:var(--main-color-white);}
.visual .m_search .searchBx form{width:100%;}
.visual .m_search .searchBx:hover{box-shadow:10px 10px 20px rgba(0,0,0,0.2);}
.visual .m_search .searchBx input::placeholder{color:var(--main-color-black); font-size:1.25em;}
.visual .m_search .searchBx input:focus{outline: none !important;}
.visual .m_search .searchBx input,
.visual .m_search .searchBx a{height:100%; display:block;}
.visual .m_search .searchBx input{width: calc(100% - 122px); padding:35px; border:0;}
.visual .m_search .searchBx .searchBtn{position:absolute; top:0; right:0; display: flex; justify-content: center; align-items: center; width: 122px; background:var(--main-color-black);}
.visual .m_search .searchBx .searchBtn:hover{cursor: pointer;}
.visual .m_search .searchBx .searchBtn span{font-size:1.9em; font-weight:600; color:var(--main-color-white);}
.visual .quickLink{position:absolute; bottom:0; width: 100%; overflow:hidden; z-index:10; }
.visual .quickLink .layout{display:flex; width: 1400px; background:var(--main-color-classicblue);}
.visual .quickLink:after{position:absolute; content:''; width: calc((100% - 1400px) / 2); display:block;  height:100%; bottom:0; right:0; background:var(--main-color-classicblue); z-index:1;}
.visual .quickLink .titBx{display:flex; flex-direction: column; justify-content: center; width: 280px; padding:0 30px; background:rgba(0,0,0,0.3);}
.visual .quickLink .titBx p,
.visual .quickLink .quickIco li p{color: var(--main-color-white);}
.visual .quickLink .titBx p:first-child{margin-bottom:20px; font-size:1.563em; text-transform: uppercase;}
.visual .quickLink .quickIco{display:flex; justify-content: center; width:calc(100% - 280px); padding:30px; }
.visual .quickLink .quickIco li{display:flex; flex-direction: column; align-items: center; width:16.66667%; transition:all 0.3s; }
.visual .quickLink .quickIco li a{width:82px; height:82px; background:var(--main-color-white); border-radius:15px; margin-bottom:10px; }
.visual .quickLink .quickIco li:hover {margin-top:-8px; }
.visual .quickLink .quickIco li:hover a{box-shadow:10px 10px 10px rgba(0,0,0,0.2);}
.visual .left_car{width:15%; z-index:-1; position: absolute; opacity:1; left: 14%; bottom: 33%;animation-name: leftCarmove; animation-duration: 5s; /*animation-iteration-count: infinite;*/}
.visual .right_car{width:13%;z-index:-1; position: absolute; opacity:1; right: 16%; top: 20%; animation-name: rightCarmove; animation-duration: 3s; /*animation-iteration-count: infinite;*/}
.visual .left_car img,
.visual .right_car img{width:100%;}

@keyframes leftCarmove {
  0% {
  	opacity:0.5;
    left: 40%; 
    bottom: 0 ;
  }
  25% {
    opacity:1;
    left: 14%; 
    bottom: 33%;
  }
  50% {
  	opacity:1;
    left: 20%; 
    bottom: 25% ;
  }
  75% {
    opacity:1;
    left: 14%; 
    bottom: 33%;
  }


}

@keyframes rightCarmove {
  /* keyframe */
  from {
  	opacity:0.5;
    right: 26%; 
    top: 6% ;
  }
  /* keyframe */
  to{
    opacity:1;
    right: 16% ; 
    top: 20%;
  }
}


/**************** #2 실시간 주차장 ****************/
.realPark{position:relative; display:flex; align-items: center;}
.realPark .rp_left{padding:110px 0; width: 100%;}
.realPark .rp_left .sliderTop{display: flex; justify-content: space-between; align-items: flex-end;margin-bottom:50px;}
.realPark .rp_left .sliderTop .tit{position:relative; padding-top: 83px; display:inline-block; font-size:2.5em; z-index:10; letter-spacing: -0.05em; font-weight:600; }
.realPark .rp_left .sliderTop .tit:before{position:absolute; content:''; bottom:-6px; right:-70px; width: 121px; height: 120px; background:url(../img/p_ico.png); z-index:-1;}
.realPark .rp_left .sliderTop .sliderBtn{display: flex; align-items: center; margin-right:30px;}
.realPark .rp_left .sliderTop .sliderBtn > span,
.realPark .rp_left .sliderTop .sliderBtn a{display:block; margin-left:10px; border-radius: 50%; width: 52px; height: 52px; line-height:52px; text-align:center; background:var(--main-color-lightergray); transition:all 0.3s; }
.realPark .rp_left .sliderTop .sliderBtn a{background:var(--main-color-black); color:var(--main-color-white);}
.realPark .rp_left .sliderTop .sliderBtn > span:hover,
.realPark .rp_left .sliderTop .sliderBtn a:hover{cursor:pointer; box-shadow:10px 10px 10px rgba(0,0,0,0.2);}
.realPark .rp_left .sliderTop .sliderBtn .play{display:none;}
.realPark .rp_left .parkSlide li{margin-right:30px;}
.realPark .rp_left .parkSlide li .slideImg{position:relative; max-width:100%; width: 334px; height: 198px; border-radius: 0 30px 0 0; overflow:hidden;}
.realPark .rp_left .parkSlide li:nth-of-type(2n+1) .slideImg{background:#b7c8ee url(../img/slider_preimg1.jpg) no-repeat center center;}
.realPark .rp_left .parkSlide li:nth-of-type(2n) .slideImg{background:#b7c8ee url(../img/slider_preimg2.jpg) no-repeat center center;}
.realPark .rp_left .parkSlide li .slideImg .park_state{position:absolute; min-width:110px; top:0; right:0; display:inline-block; padding:15px 25px; color: var(--main-color-white); border-radius: 0 0 0 30px; text-align: center;}
.realPark .rp_left .parkSlide li .slideCont{padding:30px; border-radius: 0 0 0 30px; background:var(	--main-color-lightergray);}
.realPark .rp_left .parkSlide li .slideCont .tit{padding-bottom:15px; margin-bottom:15px; font-size:1.5em; font-weight:600; border-bottom: 1px solid var(--main-color-gray); }
.realPark .rp_left .parkSlide li .slideCont .txt{display: flex; align-items: center;}
.realPark .rp_left .parkSlide li .slideCont .txt .fontBl{font-size:1.5em;}
.realPark .rp_left .parkSlide li .slideCont .txt p{display:inline-block;}
.realPark .rp_left .parkSlide li .slideCont .txt .parkInfo2{display: flex; align-items: center; position:relative; margin-left:5px; padding-left:10px; color:var(--main-color-lightgray);}
.realPark .rp_left .parkSlide li .slideCont .txt .parkInfo2:before{position:absolute; left:0; content:'/'; color:var(--main-color-lightgray);}
.realPark .rp_left .parkSlide li .slideCont .moreBtn{display:block; margin-top:25px; text-align: center; padding:12px 0; background:var(--parking-btn-bg); border-radius:3px; border:1px solid var(--parking-btn-border); color:var(--main-color-white); font-size:0.938em; transition: all 0.3s;}
.realPark .rp_left .parkSlide li .slideCont .moreBtn:hover{ background:var(--parking-btn-border); box-shadow:10px 10px 10px rgba(0,0,0,0.2);}
.realPark .rp_left .parkSlide li img{width:100%; height:100%;}
.park_state.state_type1{background:var(--parking-state-1);}
.park_state.state_type2{background:var(--parking-state-2);}
.park_state.state_type3{background:var(--parking-state-3);}
.realPark .rp_right{position:absolute; left:calc(50% + 50px);width:calc(50% - 50px); height:100%; background: var(--main-color-gray);}


/***************** #3 정보마당 ****************/
.m_infoBx{padding:100px 0; background:var(--main-color-lightpurple);}
.m_infoBx .infoTit{margin-bottom:48px; text-align:center; font-size:2.5em; font-weight:600; }
.m_infoBx .layout{display:flex; flex-wrap: wrap; justify-content: space-between; }
.m_infoBx .layout .m_noticeBx,
.m_infoBx .layout .info_right > div{border-radius:10px; padding:40px 30px; box-shadow:5px 10px 10px rgba(0,0,0,0.1);}
.m_infoBx .layout .m_noticeBx{width:840px; background:var(--main-color-white); }
.m_infoBx .layout .info_right{display:flex; flex-direction: column; justify-content: space-between;}
.m_infoBx .layout .info_right .info_bot1{background:var(--info-box1-bg) url(../img/bot_ico1.png) no-repeat bottom right; border:1px solid var(--info-box1-border);}
.m_infoBx .layout .info_right .info_bot2{background:var(--info-box2-bg) url(../img/bot_ico2.png) no-repeat bottom right; border:1px solid var(--info-box2-border);}
.m_infoBx .layout .info_right{width:calc(1400px - 870px);}
.m_infoBx .layout .info_right > div{height:calc(50% - 15px);}
.m_infoBx .layout .info_right > div p,
.m_infoBx .layout .info_right > div h3,
.m_infoBx .layout .info_right > div a{color:var(--main-color-white);}
.m_infoBx .layout .info_right h3,
.m_noticeBx .tabTit li h3{font-size:1.625em;}
.m_infoBx .layout .info_right .linkBx{margin-top:15px;}
.m_infoBx .layout .info_right .linkBx a{display:inline-block; margin-right:10px; padding:10px 25px; border:1px solid rgba(255,255,255,0.9); border-radius: 3px; background: rgba(0,0,0,0.1); transition: background 0.3s;}
.m_infoBx .layout .info_right .linkBx a:hover{background:rgba(0,0,0,0.5); box-shadow:10px 10px 10px rgba(0,0,0,0.2);}


/* 공지사항 탭박스 */
.m_noticeBx{position: relative; width:100%;}
.m_noticeBx .tabTit{display:flex; align-items:center; width:100%; margin-bottom:40px;}
.m_noticeBx .tabTit li{position:relative; display:inline-block; cursor:pointer; padding:0 25px;}
.m_noticeBx .tabTit li:before{content:''; position:absolute; right:0; top:50%; width: 1px; height:14px; transform:translateY(-50%); background:var(--main-color-gray);}
.m_noticeBx .tabTit li:first-child{padding-left:0;}
.m_noticeBx .tabTit li:last-child:before{display:none;}
.m_noticeBx .tabTit li h3{position:relative; font-weight:normal; z-index:1;}
.m_noticeBx .tabTit li.on h3:after,
.m_noticeBx .tabTit li:hover h3:after{content:''; position:absolute;  z-index:-1; display:inline-block; left:50%; bottom:-5px; transform:translateX(-50%); width: 100%; height:10px;  background:var(--highlighter-yellow);}
.m_noticeBx .tabTit li:hover h3,
.m_noticeBx .tabTit li.on h3{font-weight:600;}
.m_noticeBx .tabContent{width:100%; min-height:218px; max-height:230px; overflow-y:scroll; display:none;}
.m_noticeBx .tabContent.on{display:block;}
.m_noticeBx .tabContent ul{display:flex; flex-direction: column;}
.m_noticeBx .tabContent ul li{margin-bottom:30px; padding-bottom:30px; border-bottom:1px dashed var(--main-color-gray);}
.m_noticeBx .tabContent ul li:last-child{margin-bottom:0; padding-bottom:0; border-bottom:0;}
.m_noticeBx .tabContent ul li a{display:flex; justify-content: space-between; align-items: center;}
.m_noticeBx .tabContent ul li a .date{display:flex; flex-direction: column; justify-content: center; align-items: center; width:80px; padding:15px 0 10px; border:1px solid var(--main-color-classicblue);} 
.m_noticeBx .tabContent ul li a .date span{margin-bottom:5px; font-size:2.500em; font-weight:700;}
.m_noticeBx .tabContent ul li a .date em{font-size:0.875em;}
.m_noticeBx .tabContent ul li a .date span,
.m_noticeBx .tabContent ul li a .date em{color: var(--main-color-classicblue);} 
.m_noticeBx .tabContent ul li a .text{width:calc(100% - 110px);}
.m_noticeBx .tabContent ul li a .text .tit{ margin-bottom:10px; font-weight:600; font-size:1.188em;}
.m_noticeBx .tabContent ul li a .text .txt{display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:0.938em; height:46px;overflow:hidden; text-overflow: ellipsis; word-break: break-all; color:var(--main-color-lightgray);}
.m_noticeBx .tabContent .viewInfo{position:absolute; top: 30px; right: 30px; display: flex;  align-items: center; justify-content: space-between;}
.m_noticeBx .tabContent .viewInfo select{padding:8px 15px 8px 10px;}
.m_noticeBx .tabContent .more-btn{margin-left:20px; transition:all 0.3s;}
.m_noticeBx .tabContent .more-btn span{font-size:1.24em;}
.m_noticeBx .tabContent .more-btn:hover{transform: rotate(180deg);}

*::-webkit-scrollbar{width:6px; height:6px;}
*::-webkit-scrollbar-thumb{background:var(--adm-nav-arrow);}
*::-webkit-scrollbar-track{background:var(--main-color-white);}


/* 레이어 팝업 */
#layerpop{position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); z-index:9999; max-width:50%; max-height:90vh; border-radius: 15px; overflow: hidden;}
/* #layerpop .thumb{max-height:80vh; overflow:auto; background: var(--main-color-white);} */
#layerpop .close{padding:8px 10px; background:var(--main-color-black);}
#layerpop .close form{display:flex; justify-content: space-between; align-items: center; }
#layerpop .close span{display:flex; align-items: center; color:var(--main-color-white); font-size:1em;}
#layerpop .close span#close{ display:inline-block; font-size: 0.9em; padding:0 10px; border:1px solid rgba(255,255,255,0.5); border-radius: 5px; font-size:0.9em; transition: all 0.3s;}
#layerpop .close span#close:hover{cursor: pointer; color:var(--main-color-black); background:var(--main-color-white);}
#layerpop .close input[type="checkbox"]{width:14px; height:14px; border-radius: 2px; margin-right:5px; background:var(--main-color-white);}
#layerpop .close input[type="checkbox"]::before{display:none;} 
#layerpop .close input[type="checkbox"]::after{font-size:0.9em; line-height:1.2em;}
#layerpop .close input[type="checkbox"]:checked {background: var(--main-color-blue);}
#layerpop .close input[type="checkbox"] + label{font-size:0.9em;}

#layerpop{position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); z-index:9999; max-width:50%; max-height:90vh; border-radius: 15px; overflow: hidden;}
#layerpop .thumb{overflow:auto; background: var(--main-color-white); width: 700px; height: 75vh;} /* max-height:80vh; */
#layerpop .thumb .popup_title h3{padding:10px 10px 0; font-size:1.125em;}
#layerpop .close{padding:8px 10px; background:var(--main-color-black);}
#layerpop .close form{display:flex; justify-content: space-between; align-items: center; }
#layerpop .close span{display:flex; align-items: center; color:var(--main-color-white); font-size:1em;}
#layerpop .close span#close{ display:inline-block; font-size: 0.9em; padding:0 10px; border:1px solid rgba(255,255,255,0.5); border-radius: 5px; font-size:0.9em; transition: all 0.3s;}
#layerpop .close span#close:hover{cursor: pointer; color:var(--main-color-black); background:var(--main-color-white);}
#layerpop .close input[type="checkbox"]{width:14px; height:14px; border-radius: 2px; margin-right:5px; background:var(--main-color-white);}
#layerpop .close input[type="checkbox"]::before{display:none;} 
#layerpop .close input[type="checkbox"]::after{font-size:0.9em; line-height:1.2em;}
#layerpop .close input[type="checkbox"]:checked {background: var(--main-color-blue);}
#layerpop .close input[type="checkbox"] + label{font-size:0.9em;}
#layerpop .popup_content p,
#layerpop .popup_content p img,
#layerpop .popup_content img{width:100% !important;} /* max-width:100% */


/* 회원가입, ip/pw찾기, 마이페이지 */
.memberWrap{padding:150px 0; min-height:calc(100vh - 101px); background:var(--main-color-lightblue) url(../img/certi_bg.png) no-repeat top center;}
.memberWrap .btn_type01{background: var(--adm-btn-type01)!important; color: var(--adm-white-color)!important;}
.memberWrap .layout{display:flex; flex-direction: column; align-items: center; width:100%; max-width:1030px;}
.memberWrap .layout .memTitle{margin-bottom:40px;}
.memberWrap .layout .memTitle p{text-align: center;}
.memberWrap .layout .memTitle .tit{margin-bottom:20px; font-size:1.875em; font-weight:bold;}
.memCont{width: 100%;}
.memCont ul{display:flex; justify-content: center;}
.memCont ul li{width: calc(100% - 40px); margin:0 20px; display:flex; align-items: center; flex-direction: column; padding:50px; background:var(--main-color-white);}
.memCont ul li .tit{font-size:1.5em; margin-bottom:40px;}
.memCont ul li .findTit{position:relative; padding-left:52px; line-height:40px; font-weight:bold; }
.memCont ul li .findTit:before{position:absolute; content:''; left:0; width:40px; height:40px; background:url(../img/check1.jpg) no-repeat center; background-size:contain;}
.memCont ul li .basicbtn{min-width:220px;margin-top:40px;}
.memberWrap .adm_table{border-top:1px solid var(--main-color-lightgray);}
.memberWrap .adm_table th span.fc03{font-size:1.125em;}
.memberWrap .adm_table th{text-align: left; white-space: nowrap;}
.memberWrap .adm_table th,
.memberWrap .adm_table td{padding:10px 20px;}
.idFindTbl .fs20{padding:50px; font-size:1.250em}
.idFindTbl .fs20 strong{color:var(--adm-btn-type01);}
.fc03{color:var(--adm-btn-type01)!important;}
.joinStep{display:flex; width: 100%; justify-content:center;  }
.joinStep ul{display:flex; align-items: center; margin-bottom:50px;}
.joinStep ul li{min-width:150px; padding:15px; display:flex; flex-direction: column; position:relative; margin-right:50px; border-radius: 10px; background:rgba(0,0,0,0.05);}
.joinStep ul li:after{position:absolute; content:''; right:-50px; top:50%; transform:translate(-50%, -50%); width:26px; height:14px; background:url(../img/join_step.gif) no-repeat;	}
.joinStep ul li.on{background:var(--adm-btn-type01);}
.joinStep ul li.on:after{background:url(../img/join_step_on.gif) no-repeat;}
.joinStep ul li span{font-size:0.9em;}
.joinStep ul li span,
.joinStep ul li strong{color:var(--main-color-black);}
.joinStep ul li strong{font-weight:normal;}
.joinStep ul li.on span,
.joinStep ul li.on strong{color:var(--main-color-white);}
.joinStep ul li:last-child{margin-right:0}
.joinStep ul li:last-child:after{display:none;}
.joinTermBx .tar{width:100%; margin-bottom:10px;}
.joinTermBx .btnBk{display:inline-block; border-radius: 5px; padding:10px 20px;}
.joinTermBx .ml5{margin-left:5px;}
.joinTermBx .carWrap{display:flex; flex-wrap: wrap;}
.joinTermBx .carWrap .carBox{display:flex; align-items: center; margin-right:10px; margin-bottom:10px; padding:10px 15px; background:var(--main-color-lightblue); border-radius: 10px;}
.joinTermBx .carWrap .carBox .deleteCar{margin-left:15px; width:20px; height:20px; font-size:0.9em; line-height: 19px; text-align: center; color:var(--main-color-white); background:var(--adm-btn-type01); border-radius: 50%; }
.joinFinal{display:flex; flex-direction: column; align-items: center; padding:50px 70px;}
.joinFinal .join_check{display: flex;  justify-content: center; align-items: center;width:54px; height:54px; background:var(--adm-btn-type01); border-radius: 50%; margin-bottom:35px;}
.joinFinal .join_check span{color:var(--main-color-white); font-size: 2em;}
.joinFinal .fs24{margin-bottom:35px; font-size:1.5em;}
.joinFinal .fs24 + .tac{color:var(--main-color-lightgray);}

.totalTermBx{display: flex; align-items: center; width:100%; padding:15px; margin-bottom:30px; background: var(--main-color-lightergray); }
.join_step1 .termTop{display: flex; align-items: center;}
.join_step1 .termBx label{font-size:1em;}
.join_step1 > ul > li{width:100%;}
.join_step1 > ul > li .useTermBx{width:100%;}
.join_step1 > ul > li .useTermBx textarea{width:100%; max-width:100%;}
.useTermBx{margin-bottom:20px;}
.useTermBx .termBx .termTextBx{border: 1px solid var(--login-gray); background:none;}

.useTermBx .termBx .termTextBx{width:100%; height:200px; font-size:1em;}
.useTermBx .termBx .termTextBx h4{font-size:1.025em; margin-bottom:10px;}
.useTermBx .termBx .termTextBx .term_item{margin-bottom:25px; color:var(--main-color-lightgray); font-size:0.95em;}

.useTermBx  .termBx .termTop{padding:10px 0; border:0;}
.useTermBx .termBx .termTextBx{height:200px; font-size:1em;}
.useTermBx .termBx .termTextBx .pl20{padding-left:20px; margin-bottom:20px;}
.useTermBx + .basicbtn{margin-top:0!important;}
.attachedFile{display:flex; justify-content: flex-start; flex-direction: column; align-items: flex-start;}
.fileLst{width:100%; display:flex; justify-content: flex-start; margin-bottom:10px; }
.fileLst li{text-align:left; padding:5px 10px; display:inline-block; border-radius:10px; border:1px solid var(--table-border-color); margin-bottom:5px;}
.attachedFile input[type="file"]{display:none;}


/*할인 사전 신청 조회*/
.stateBox{display:flex; flex-direction: column; align-items: center;}

/* 하위 - 정보마당 메인 표출, 메인 검색 페이지 CSS */
/* 줄바꿈 발생 시 생략기호 표출하여 내용 생략 */
.main_cnt, .main_search_data_wrap {
    display: block;
    width: 630px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    line-height: 1.2;
/*        height: 4.8em;*/
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2 ;
    -webkit-box-orient: vertical;
}
.m_noticeBx .selectWrap{white-space:nowrap; margin: 20px auto 0; text-align: center;}

/* footer */
#footer{background: var(--parking-btn-border);}
#footer .layout{padding:40px 0;}
#footer .layout .address{display:flex; flex-wrap: wrap; margin-bottom:10px;}
#footer .layout .address li{position:relative; padding-right:11px; margin-right:10px; color:var(--main-color-white);}
#footer .layout .address li:after{position:absolute; top:50%; right:0; content:''; width:1px; height:12px; transform:translateY(-50%); background:rgba(255,255,255,0.2);}
#footer .layout .address li:last-child{margin-right:0; padding-right:0;}
#footer .layout .address li:last-child:after{display:none;}
#footer .layout .copyright{color:rgba(255,255,255,0.3);}




/*모달 보일 때*/
#admWrap .modalBox input{border:1px solid var(--table-border-color);}
.ns_modal .modalTop{display:flex; width:100%; padding:15px 20px; align-items: center; justify-content: space-between;  background:var(--bg-color); z-index:1000; border-bottom:1px solid var(--main-color-gray); border-radius: 15px 15px 0 0;}
.ns_modal .modalTop .modalTit{display:flex; align-items: center;}
.ns_modal .modalTop .modalTit h3{color:var(--main-color-black);}
.ns_modal{background:rgba(0,0,0,0.7); width:100%; height:100%; position:fixed; visibility: hidden; left:0; top:0; z-index: 1000;}
.ns_modal.showBG{visibility: visible;}
.ns_modal .modalTop, .ns_modal .modalBot{background:var(--modal_bg-color);}
.ns_modal .modalCont{transition: all 0.5s ease-in-out;
    min-width: 20%;
    max-width: calc(100% - 40px);
    max-height: calc(100vh - 40px);
    border-radius: 10px;
    position: absolute;
    left: 50%;
    top: 50%;
    background: var(--main-color-white);
    transform: translate(-50%, -50%) scale(0);}
.ns_modal .modalBot > ul > li{margin-right:0; min-width:auto; max-width:none;}
.ns_modal .modalBot{display:flex; flex-direction:column;  border-radius:0 0 10px 10px; padding:15px 20px; overflow:auto; max-height:85vh;}
.modalBot > ul.modalItem > li .conBx,
.img_box img,
.img_box input{width:100%;}

.ns_modal .form-row{margin-bottom:0;}
.ns_modal .switchBox label{margin:0;}



/* 무정차정산 */
.nonstopWrap{display:flex; flex-direction: column; align-items: center;}
.nonstopWrap .nonstop_top{width:100%; display:flex; justify-content: center;}
.nonstopWrap .nonstop_top .wtBx{display:flex; margin-right:20px; align-items: center; width:calc(50% - 10px); border:1px solid var(--table-border-color); border-radius: 10px; transition: all 0.3s;}
.nonstopWrap .nonstop_top .wtBx:last-child{margin-right:0}
.nonstopWrap .nonstop_top .wtBx button[class*="nonstopBtn"]{width:100%; justify-content: center; margin:60px auto; padding-top:60px; display:flex; align-items: center; font-size:1.025em;}
.nonstopWrap .nonstop_top .wtBx .nonstopBtn_type01{background:url(../img/nonstop_ico1.jpg) no-repeat top center;}
.nonstopWrap .nonstop_top .wtBx .nonstopBtn_type02{background:url(../img/nonstop_ico2.jpg) no-repeat top center;}
.nonstopWrap .nonstop_top .nonstop_carWrap{padding:20px; width:100%;}
.nonstopWrap .nonstop_top .nonstop_carWrap .ns_car_top{display:flex; justify-content: space-between; margin-bottom:20px;}
.nonstopWrap .nonstop_top .nonstop_carWrap .ns_car_top h3{font-size:1.3em;}
.nonstopWrap .nonstop_top .nonstop_carWrap .ns_car_top button{font-size:0.95em; padding-left:25px; background:url(../img/car_add.gif) no-repeat left center;}

/*.nonstopWrap .nonstop_cardLst{display:grid; grid-template-columns: 1fr 1fr 1fr; gap:20px; margin-top:20px;}*/
.nonstopWrap .nonstop_cardLst li{width:100%; padding:20px 20px 10px; background:var(--card-default-bg); border: 1px solid var(--card-default-border); border-radius: 10px;}
.nonstopWrap .nonstop_cardLst li.ns_card_type01,
.ns_edit_card.ns_card_type01{background:var(--card-01-bg); border: 1px solid var(--card-01-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type02,
.ns_edit_card.ns_card_type02{background:var(--card-02-bg); border: 1px solid var(--card-02-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type03,
.ns_edit_card.ns_card_type03{background:var(--card-03-bg); border: 1px solid var(--card-03-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type04,
.ns_edit_card.ns_card_type04{background:var(--card-04-bg); border: 1px solid var(--card-04-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type06,
.ns_edit_card.ns_card_type06{background:var(--card-06-bg); border: 1px solid var(--card-06-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type07,
.ns_edit_card.ns_card_type07{background:var(--card-07-bg); border: 1px solid var(--card-07-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type08,
.ns_edit_card.ns_card_type08{background:var(--card-08-bg); border: 1px solid var(--card-08-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type11,
.ns_edit_card.ns_card_type11{background:var(--card-11-bg); border: 1px solid var(--card-11-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type12,
.ns_edit_card.ns_card_type12{background:var(--card-12-bg); border: 1px solid var(--card-12-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type13, 
.ns_edit_card.ns_card_type13{background:var(--card-13-bg); border: 1px solid var(--card-13-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type15,
.ns_edit_card.ns_card_type15{background:var(--card-15-bg); border: 1px solid var(--card-15-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type32,
.ns_edit_card.ns_card_type32{background:var(--card-32-bg); border: 1px solid var(--card-32-border);}
.nonstopWrap .nonstop_cardLst li.ns_card_type44,
.ns_edit_card.ns_card_type44{background:var(--card-44-bg); border: 1px solid var(--card-44-border);}
.nonstopWrap .nonstop_cardLst li .ns_card_bot{display:flex; flex-direction: column; margin-top:25px;padding:20px; background:var(--main-color-white); border-radius: 10px;}
.nonstopWrap .nonstop_cardLst li .ns_card_bot .card_numb{font-size:1.65em; font-weight: bold; text-align:center; letter-spacing: -0.2px;}
.nonstopWrap .nonstop_cardLst li .ns_card_bot .card_period{text-align: right; font-size:1.3em; font-weight: bold; margin:10px 3px 0 0;}
.ns_deleteBtn{font-size:1em; color:var(--main-color-gray05); text-decoration: underline; width:100%; text-align: center; margin-top:10px;}
.nonstopWrap .nonstop_cardLst .ns_card_top{display:flex; justify-content: space-between; align-items: flex-start;}
.nonstopWrap .nonstop_cardLst .ns_card_top .switchBox{display:flex; align-items: center; margin-top:5px;}


.ns_modal .modalBot{align-items: center;}
.ns_edit_card{padding:20px; border-radius: 10px; margin-bottom:20px;}
.ns_edit_card .ns_card_bot{margin-top:50px;display:flex; flex-direction: column;}
.ns_edit_card .ns_card_bot .card_numb{font-size:1.65em; font-weight: bold; text-align:center; letter-spacing: -0.2px;}
.ns_edit_card .ns_card_bot .card_period{text-align: right; font-size:1.3em; font-weight: bold; margin:10px 3px 0 0;}
.nonstopWrap .nonstop_cardLst .ns_card_top .ns_card_info p.card_img{font-size:1.3em; margin-bottom:10px; font-weight: bold;}


/* 무정차정산 변경 */
.nonstop_submit{max-width:1000px; margin:0 auto;}
.nonstop_top .nonstop_cardLst,
.nonstop_top .nonstop_carLst{width:100%;}
.nonstop_cardLst{display:flex;}

.nonstop_carLst{height:100%; display:flex; flex-direction:column; justify-content: space-between; padding:15px 15px 10px; background:var(--card-default-bg); border: 1px solid var(--card-default-border); border-radius: 10px;}
.nonstop_carLst .nonstop_carTop h5{font-size:1.3em;}
.nonstop_carLst .stateBtn{color:var(--main-color-white); border-radius: 30px; padding:2px 12px; margin-left:5px; font-size:0.95em;}
.nonstop_carLst .car_type01{background:var(--adm-btn-type01);}
.nonstop_carLst .car_type02{background:var(--adm-btn-green);}
.nonstop_carLst .car_type03{background:var(--adm-btn-type04);}
.nonstop_carLst .nonstop_carBot{background:var(--main-color-white); padding:30px 60px;  text-align:center; font-size:2em; font-weight:bold; border-radius: 10px;}



/* 서브레이아웃 추가 */
.subTopBx{position:relative;}
.subTopBx:before{position:absolute; top:0; left:0; width:50px; height:50px; border-top:1px solid var(--parking-btn-bg); border-left:1px solid var(--parking-btn-bg); content:''; z-index:10;}
.subTopBx:after{position:absolute; bottom:0; right:0; width:50px; height:50px; border-bottom:1px solid var(--parking-btn-bg); border-right:1px solid var(--parking-btn-bg); content:'';}
.subTopBx .wrap{position:relative; display: flex; flex-direction: column; justify-content: center; background:var(--main-color-lightergray);  margin-bottom:40px; min-height: 160px; padding:40px 30px 40px 170px;}
.subTopBx .wrap:after{position:absolute; top:50%; left:30px; width:110px; height:110px; border-radius: 50%; background:var(--parking-btn-bg) url(../img/subBx_ico.png) no-repeat 21px 50%; content:''; transform:translateY(-50%); }
.subTopBx h5{color:var(--point-color); font-size:1.2em; margin-bottom:10px;}


/* 미납주차요금 절차 순서 css*/
.pro_li{padding:30px 20px; display:flex; flex-direction: column; border:1px solid var(--main-color-lightergray);}
.pro_li li{display:flex; position:relative; width:100%; border-radius: 60px; margin-bottom:30px; border:1px solid var(--main-color-lightblue);}
.pro_li li:after{display:inline-block; position:absolute; bottom:-30px; left:50%; transform: translateX(-50%); content:''; border:10px solid transparent; border-top-color:var(--main-color-gray);}
.pro_li li:last-child{margin-bottom:0;}
.pro_li li:last-child:after{display:none;}
.pro_li li .tit{display:flex; align-items: center; width:30%;position:relative; background:var(--main-color-lightblue); padding:45px 10px 45px 125px; white-space: nowrap; font-size: 1.025em; font-weight: bold;  border-radius: 60px 0 0 60px; }
.pro_li li .tit:before{ position:absolute; left:10px; top:50%; width:100px; height:100px; border-radius: 50%; overflow:hidden; transform: translateY(-50%); content:''; background: var(--main-color-white);}
.pro_li li .tit:after{position:absolute; left:30px; top:50%; width:60px; height:60px;  transform: translateY(-50%); content:'';}
.pro_li li:nth-of-type(1) .tit:after{background:url(../img/pro_ico1.png) no-repeat center; background-size: cover;}
.pro_li li:nth-of-type(2) .tit:after{background:url(../img/pro_ico2.png) no-repeat center; background-size: cover;}
.pro_li li:nth-of-type(3) .tit:after{background:url(../img/pro_ico3.png) no-repeat center; background-size: cover;}
.pro_li li:nth-of-type(4) .tit:after{background:url(../img/pro_ico4.png) no-repeat center; background-size: cover;}
.pro_li li:nth-of-type(5) .tit:after{background:url(../img/pro_ico5.png) no-repeat center; background-size: cover;}
.pro_li li .txt{width:70%; display:flex; align-items: center; padding:20px;}



/* 카드번호 입력 */
.card_inputBx{display:flex; align-items: center;}
.card_inputBx span{margin:0 10px;}


/* ~ 1440px */
@media screen and (max-width:1440px){

  .layout{max-width:calc(100% - 40px);}
  .pc_header{padding:0 10px;}
  .pc_header .gnb{width:75%;}
  .pc_header .gnb > li > a{font-size:1.125em;}
  .pc_header .h_utile .util_join{margin-right:0;}
  .pc_header .logoutBtn{margin-right:5px;}

	/**************** �뿤�뜑 ****************/
	.pc_header h1{width:12%;}
	.pc_header .gnb{width:70%;}
	.pc_header .gnb > li > a{font-size:1.15em;}

	/**************** #1 鍮꾩＜�뼹 ****************/
	.visual{background:var(--main-color-lightblue); z-index: 0;}
	.visual:before{position:absolute; content:''; bottom:20%; left:0; background:url(../img/main_bg1.png) no-repeat center; width:289px; height:280px; background-size:contain; z-index:-1;}
	.visual:after{position:absolute; content:''; top:20px; right:0; background:url(../img/main_bg2.png) no-repeat center; width:270px; height:212px; background-size:contain; z-index:-1;}
	.visual .m_search{z-index:100;}	
	.visual .quickLink:after{display:none;}
	.visual .quickLink .layout{max-width:100%;}
	.visual .quickLink .titBx{width:20%;}
	.visual .quickLink .quickIco{width:80%; padding:20px 0;}
	.visual .left_car,
	.visual .right_car{display:none;}

	/**************** #2 �떎�떆媛� 二쇱감�옣 ****************/
	.realPark .rp_left{width:100%; padding:90px 0;}
	.realPark .rp_left .parkSlide li{margin-right:20px;}
	.realPark .rp_left .parkSlide li .slideImg{width:100%; /*height:auto;*/}
	.realPark .rp_left .parkSlide li .slideCont{padding:20px;}
	.realPark .rp_left .parkSlide li .slideCont .tit{font-size:1.25em; padding-bottom:10px; margin-bottom:10px;}
	.realPark .rp_left .parkSlide li .slideCont .txt .parkInfo1{font-size:0.9em;}
	.realPark .rp_left .parkSlide li .slideCont .txt .parkInfo2{font-size:0.9em;}
	.realPark .rp_right{left:calc(50% + 30px); width:calc(50% - 30px);}

	/**************** #3 �젙蹂대쭏�떦 ****************/
	.m_infoBx .layout .m_noticeBx{width:60%;}
	.m_infoBx .layout .info_right{width:calc(40% - 20px);}
	.m_infoBx .layout .info_right > div{height:calc(50% - 10px);}
	.realPark .rp_left .sliderTop .tit{font-size:2em; padding-top:60px;}
	.realPark .rp_left .parkSlide li .slideCont .txt{flex-direction: column; align-items: flex-start;}
	.realPark .rp_left .sliderTop .tit:before{bottom:0; right:-46px; width:81px; height:80px; background-size:contain;}
	.realPark .rp_left .sliderTop .sliderBtn{margin-right:20px;}
	.m_infoBx .layout .info_right .info_bot1,
	.m_infoBx .layout .info_right .info_bot2{background-size:30%;}
	.m_infoBx .layout .info_right .linkBx a{background:rgba(0,0,0,0.3); margin-right:5px;}


	/* �쉶�썝媛��엯, ip/pw李얘린, 留덉씠�럹�씠吏� */
	.memberWrap{background-size: contain; min-height:auto;}
	.memberWrap .layout{max-width:96%;}
	.memCont ul.twoBoxs li{width:calc(50% - 10px);}



  /* 무정차정산 */ 
  .nonstopWrap .nonstop_top .wtBx{width:calc(50% - 8px);}
  .nonstopWrap .nonstop_cardLst{gap:15px;}
  .nonstopWrap .nonstop_cardLst li{padding:15px 15px 10px;}
  .nonstopWrap .nonstop_cardLst li .ns_card_bot{padding:15px 10px; margin-top:15px;}
  .nonstopWrap .nonstop_cardLst li .ns_card_bot .card_numb,
  .ns_edit_card .ns_card_bot .card_numb{font-size:1.3em;}
  .nonstopWrap .nonstop_cardLst li .ns_card_bot .card_period,
  .ns_edit_card .ns_card_bot .card_period{font-size:1.2em;}
  .nonstopWrap .nonstop_cardLst li .ns_card_bot .card_period{ margin:10px 15px 0 0;}
  .nonstopWrap .nonstop_cardLst .ns_card_top .ns_card_info .card_img{max-width:160px;}
  .nonstopWrap .nonstop_top .nonstop_carWrap .nonstop_carLst{flex-direction: column;}
  .nonstopWrap .nonstop_top .nonstop_carWrap .nonstop_carLst li{ margin-bottom:10px;}
  .nonstopWrap .nonstop_top .nonstop_carWrap .nonstop_carLst li h5 + p{margin-bottom:0;}
  .ns_edit_card .ns_card_bot{margin-top:30px;}

	/* 팝업 */
	#layerpop .thumb{width: 500px;}
}

/* ~ 1023px */
@media screen and (max-width:1023px){


	/**************** �뿤�뜑 ****************/
	.pc_header{display:none;}
	.mob_header{position:fixed; padding:10px; height:70px; top:0; left:0; width:100%; display:flex; justify-content: space-between; align-items: center; background:var(--main-color-white);}
	.mob_header .realParkBtn{height:30px;}
	.mob_header h1{height:40px;}
	.mob_header .realParkBtn img,
	.mob_header h1 a img{height:100%;} 
	.mob-trigger,
	.mob-trigger span{display: inline-block; transition: all 0.3s;} 
	.mob-trigger{position: relative; width: 26px; height: 24px;}
	.mob-trigger span{position: absolute; left: 0; width: 100%; height: 2px; background: var(--main-color-black);}
	.mob-trigger span:nth-of-type(1){top: 0;}
	.mob-trigger span:nth-of-type(2) {top: 10px;}
	.mob-trigger span:nth-of-type(3) {bottom: 0;}
	.mob-trigger:hover{cursor:pointer;}
	.mob-trigger.active span:nth-of-type(1) {transform: translateY(11px) rotate(-45deg);}
	.mob-trigger.active span:nth-of-type(2) {opacity: 0;}
	.mob-trigger.active span:nth-of-type(3) {transform: translateY(-11px) rotate(45deg);}
	.mob_header .header_right{display:flex; align-items: center;}
  .mob_header .header_right .util_join{margin-right:20px;}
  .mob_header .header_right .util_join .logTxt{display:inline-block; position:relative; padding:10px 0; font-size:0.9em; text-transform: uppercase;}
  .mob_header .header_right .util_join .logTxt:before{position:absolute; content:''; bottom:0; left:0; width:0; height:1px; background:var(--main-color-black); transition: all 0.3s;}
  .mob_header .header_right .util_join .logTxt:hover:before{width:100%;}
  .logoutBx .logoutBtn{padding:6px 8px;}
  .logoutBx .logoutBtn:after{display:none;}
  .pc_header .h_utile .util_join .logTxt{padding:10px 0;}

	.mob_header .mNav{display:none; position:absolute; left:0; top:70px; width:100%; height:calc(100vh - 70px); background:var(--main-color-white);}
	.mob_header .mNav.active{display:block;}
	.mob_header .mNav > ul{display:flex; flex-direction: column; border-top:1px solid var(--main-color-lightergray);}
	.mob_header .mNav > ul > li{border-bottom:1px solid var(--main-color-lightergray);}
	.mob_header .mNav ul li a,
	.mob_header .mNav ul li span{display:block; }
	.mob_header .mNav ul li span:hover{cursor:pointer;}
	.mob_header .mNav > ul > li > a,
	.mob_header .mNav > ul > li > span{padding:20px; font-size:1.25em; font-weight:600;}
	.mob_header .mNav > ul > li > .depth-1{display:none; margin-bottom:10px;}
	.mob_header .mNav > ul > li > .depth-1.on{display:block;}
	.mob_header .mNav > ul > li > .depth-1 > ul > li > a{padding:10px 20px; font-size:0.9em;}
	.mob_header .mNav > ul > li > .depth-1 > ul > li:hover a{color:var(--main-color-blue);}

	/**************** #1 鍮꾩＜�뼹 ****************/
	.visual .quickLink .titBx{display:none;}
	.visual .quickLink .quickIco{width:100%; padding:30px;}
	.visual .m_search{margin-bottom:150px;}
	.visual .m_search .search_logo{margin-bottom:20px;}
	.visual .m_search .searchBx{max-width:70%;}
	.visual .m_search .searchBx .searchBtn{width:20%;}
	.visual .m_search .searchBx input{padding:25px; width:80%;}
	.visual .m_search .searchBx input::placeholder{font-size:1em;}
	.visual .m_search .searchBx .searchBtn span{font-size:1.5em;}


	/**************** #2 �떎�떆媛� 二쇱감�옣 ****************/
	.realPark{/*position:absolute; top:71px; left:-100%;height:calc(100vh - 70px); z-index:1111;*/ width:100%;  background:var(--main-color-white); flex-direction: column; }		
	.realPark .layout{max-width:calc(100% - 20px); margin-left:20px;}
	.realPark .rp_left{padding:30px 0; width:100%;}
	.realPark .rp_left .parkSlide li .slideCont .txt{flex-direction: row; align-items:center;}
	.realPark .rp_right{position:static; width:100%; min-height:700px;}

	/**************** #3 �젙蹂대쭏�떦 ****************/
	.m_infoBx{padding:80px 0;}
	.m_infoBx .infoTit{font-size:2em;}
	.m_infoBx .layout{flex-direction: column;} 
	.m_infoBx .layout .m_noticeBx{width:100%; margin-bottom:20px; }
	.m_infoBx .layout .info_right h3,
	.m_noticeBx .tabTit li h3{font-size:1.25em;}
	.m_noticeBx .tabContent{margin-top:20px; min-height: auto;}
	.m_noticeBx .tabContent ul li a .text .tit{font-size:1.1em;}
	.m_infoBx .layout .info_right{  flex-direction:row; justify-content: space-between; width:100%;}
	.m_infoBx .layout .info_right > div{width:calc(50% - 10px);}
	.m_infoBx .layout .info_right .linkBx a{padding:8px 10px;}

	/* �쉶�썝媛��엯, ip/pw李얘린, 留덉씠�럹�씠吏� */
	.memberWrap{padding:90px 0;background-size: contain; }
	.memberWrap .layout .memTitle .tit{font-size:1.5em; margin-bottom:10px;}

  /* footer */
  #footer .layout .address{justify-content: center;}
  #footer .layout .copyright{text-align: center;}



  /* 모달 한개 이상 일 때 탭으로 나눠지게 */
  .modalBot{border-radius: 0 0 15px 15px;}
  .modalBot .tabTit{display:flex; align-items:center; justify-content: center; width:100%; margin:10px 0 20px;}
  .modalBot .tabTit li{position:relative; display:inline-block; cursor:pointer; padding:0 25px;}
  .modalBot .tabTit li:before{content:''; position:absolute; right:0; top:50%; width: 1px; height:14px; transform:translateY(-50%); background:var(--main-color-gray);}
  .modalBot .tabTit li:first-child{padding-left:0;}
  .modalBot .tabTit li:last-child:before{display:none;}
  .modalBot .tabTit li h3{position:relative; font-weight:normal; z-index:1; font-size:1em;}
  .modalBot .tabTit li.on h3:after,
  .modalBot .tabTit li:hover h3:after{content:''; position:absolute;  z-index:-1; display:inline-block; left:50%; bottom:-2px; transform:translateX(-50%); width: 100%; height:8px;  background:var(--highlighter-yellow);}
  .modalBot .tabTit li:hover h3,
  .modalBot .tabTit li.on h3{font-weight:600;}
  .modalBot .tabContent{width:100%; display:none;}
  .modalBot .tabContent .modalH4{display:none;}
  .modalBot .tabContent.on{display:block;}
  .modalBox .modalCont{width:100%;}
  .ns_modal.modalBox .modalCont{overflow-y: auto;}
  .ns_modal.modalBox .modalCont .modalBot{max-height:none;}
  .modalBot > ul.modalLg > li{max-width:100%; margin-right:0;}
  
  .modalBot > ul.modalLg{min-width:auto;}

  /* 무정차정산 */ 
  .nonstopWrap .nonstop_cardLst{grid-template-columns: 1fr 1fr;}

  .ns_modal .modalBot > ul > li{margin-bottom:0; padding:10px;}
  .ns_modal.modalBox .modalBot > ul{flex-direction: row;}


  /* 미납주차요금 절차 순서 css*/
  .pro_li li .tit{width:45%;}
  .pro_li li .txt{width:55%;}
  
  /* 팝업 */
	#layerpop .thumb{width: 400px;}
}

/* ~ 767px */
@media screen and (max-width:768px){
	
	#layerpop .thumb{width: 100%; height: 65vh;} /* min-width:auto!important; min-height:auto!important; */
	
	/**************** #1 鍮꾩＜�뼹 ****************/
	.visual{padding:120px 0 60px; height:auto;}
	.visual:before,
	.visual:after{display:none;}
	.visual .m_search .searchBx{max-width:80%;}
	.visual .m_search{margin-bottom:50px;}
	.visual .m_search .searchBx input{padding:20px;}
	.visual .quickLink{position:static; overflow: inherit;}
	.visual .quickLink .layout{background:none;}
	.visual .quickLink .quickIco li a{width:64px; height:64px;}
	.visual .quickLink .quickIco li a img{width:100%;}
	.visual .quickLink .quickIco li p{color:var(--main-color-black);}
	.visual .quickLink .quickIco{padding:0; flex-wrap: wrap; }
	.visual .quickLink .quickIco li{width:33.3333%; margin-bottom:30px;}

  .visual .m_search .search_logo{width:20%;}
  .visual .m_search .search_logo img:first-child{display:none;}
  .visual .m_search .search_logo img:last-child{width:100%;}
	
	/**************** #3 �젙蹂대쭏�떦 ****************/
	.m_infoBx{padding:60px 0;}
	.m_infoBx .infoTit{display:none;}
	.m_infoBx .layout .m_noticeBx, 
	.m_infoBx .layout .info_right > div{padding:30px 20px;}
	.m_noticeBx .tabContent .more-btn{top:32px; right:20px;}
	.m_noticeBx .tabTit{width:calc(100% - 40px); margin-bottom:40px; overflow-y: scroll;  -ms-overflow-style: none; /* �씤�꽣�꽬 �씡�뒪�뵆濡쒕윭 */ scrollbar-width: none; /* �뙆�씠�뼱�룺�뒪 */}
  .m_noticeBx .tabTit::-webkit-scrollbar{display:none;}
  .m_noticeBx .tabTit li h3{white-space:nowrap;}


	/* �젅�씠�뼱�뙘�뾽 */
	#layerpop{width:100%; max-width:calc(100% - 20px);}
  	#layerpop .cont img,
	#layerpop .cont a img{width:100%!important;}

	/* �쉶�썝媛��엯, ip/pw李얘린, 留덉씠�럹�씠吏� */
	.memberWrap{padding:60px 0;}
	.memberWrap .layout .memTitle{margin-bottom:30px;}
	.memCont ul li{padding:30px 20px;}
	.memCont ul li{width:100%;}
	.memCont ul.twoBoxs li{width:calc(50% - 5px);}
	.memCont ul li .tit{font-size:1.35em; margin-bottom:30px;}
	.memCont ul li img{max-width:40%;}
	.memCont ul li .basicbtn{margin-top:30px; min-width:auto;}
	.idFindTbl .fs20{padding:30px 0; font-size:1em;}
	.memCont ul li .tit{height:30px; line-height:30px; padding-left:40px; margin-bottom:20px;}
	.memCont ul li .findTit:before{width:30px; height:30px;}
	.memberWrap .adm_table th,
	.memberWrap .adm_table td{padding:10px;}
	.joinStep ul li{min-width:auto;}
	.joinStep ul{width:100%; margin-bottom:20px;}
	.joinStep ul li{width:25%; background: rgba(255,255,255,0.6);}
	.joinFinal{padding:0;}

  .brNone br{display:none; }

 /* modal */
  .modalBox .modalCont{max-width:calc(100% - 20px);}
  .modalTop,
  .modalBot{padding:15px 10px;}
  .modalBot .tabTit{margin:5px 0 20px;}
  .modalBot > ul.modalItem > li{padding:10px; border-radius:5px;}

  /* 무정차정산 */ 
  .nonstopWrap .nonstop_top{flex-direction: column;}
  .nonstopWrap .nonstop_top .wtBx{width:100%; margin-bottom:10px;}
  .nonstopWrap .nonstop_top .wtBx button[class*="nonstopBtn"]{margin:15px auto;}
  .nonstopWrap .nonstop_top .nonstop_carWrap{padding:10px;}
/*  .nonstopWrap .nonstop_cardLst{margin-top:10px; grid-template-columns: 1fr;}*/

/*.nonstop_carLst{margin:10px 0 0 0;}*/
.nonstop_carLst .nonstop_carBot{margin-top:10px; padding:15px 30px; font-size:1.5em;}

  .subTopBx .wrap{margin-bottom:20px; padding:20px; min-height:auto;}
  .subTopBx .wrap:after{display:none;}

    /* 미납주차요금 절차 순서 css*/
    .pro_li{ padding:20px 10px;}
    .pro_li li{border-radius: 15px;}
    .pro_li li .tit{padding:20px 10px 20px 80px; border-radius: 15px 0 0 15px; width:40%;}
    .pro_li li .tit:before{width:60px; height:60px;}
    .pro_li li .tit:after{width:40px; height:40px; left:20px;}
    .pro_li li .txt{width:60%;}
    
    


}
/* ~ 639px */
@media screen and (max-width:639px){
	/**************** #2 �떎�떆媛� 二쇱감�옣 ****************/
	.realPark .rp_left .parkSlide li .slideCont .txt{}

	/**************** #3 �젙蹂대쭏�떦 ****************/
	.layout{max-width:calc(100% - 30px);}
	.m_infoBx .layout .info_right{flex-wrap: wrap; flex-direction: column;}
	.m_infoBx .layout .info_right > div{width:100%;}
	.m_infoBx .layout .info_right .info_bot1{margin-bottom:15px;}
	.m_infoBx .layout .info_right{margin-top:15px;}
	.m_noticeBx .tabTit{margin-bottom:30px;}
	.m_noticeBx .tabTit li{padding:0 15px;}
	.m_noticeBx .tabContent ul li{margin-bottom:20px; padding-bottom:20px;}
	.m_noticeBx .tabContent ul li a .date{ width:auto; max-width:70px; padding:10px 5px 5px; }
	.m_noticeBx .tabContent ul li a .date span{font-size:1.8em;}
	.m_noticeBx .tabContent ul li a .text{width:calc(100% - 80px);}
	.m_noticeBx .tabContent ul li a .text .tit{display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; font-size:1.05em; height:25px;overflow:hidden; text-overflow: ellipsis; word-break: break-all; margin-bottom:5px;}


	.joinFinal .join_check{width: 40px; height: 40px; margin-bottom:20px;}
	.joinFinal .join_check span{font-size:1.5em;}
	.joinFinal .fs24{margin-bottom:20px;}

  .joinStep ul li{padding:15px 10px; margin-right:30px;}
  .joinStep ul li:after{right:-25px; width:10px; background-position:right center;}
  .joinStep ul li.on:after{background-position:right center;}
  .joinStep ul li span{display:none;}


}
	/* ~ 567px */
@media screen and (max-width:567px){
	
	/**************** #2 �떎�떆媛� 二쇱감�옣 ****************/
	.realPark .layout{max-width:calc(100% - 10px); margin:0 10px;}
	.realPark .rp_left .sliderTop{align-items: center; flex-direction: column; margin-bottom: 30px;}
	.realPark .rp_left .sliderTop .sliderBtn{margin:20px 0 0 0;}
	.realPark .rp_left .parkSlide li{margin-right:0;}
	.realPark .rp_left .parkSlide li .slideCont .txt{flex-direction: column; align-items: flex-start;}
	.realPark .rp_left .parkSlide li .slideCont .txt p{display:block;}

	.joinTermBx .adm_table input{width:100%;}
	.joinTermBx .ml5{margin-left:0; margin-top:10px;}
	.joinTermBx .inputWrap span{display:inline-block; margin:5px 0;}

  .joinStep{display:none;}

  
    /* modal */
    .modalH3{font-size:1.5em;}
    .modalTop{flex-direction: column;}
    .modalTop .modalTit{margin-bottom:10px;}
    .modalBox .btnBx .basicbtn{padding:6px 20px;}
    .modalBot .tabTit{margin:5px 0 10px;}
    .form-row{flex-wrap: wrap; margin:0;}
    .form-row > li{margin-right:0; margin-bottom:10px;}
    
    .modalBot .tabTit{margin:10px 0;}
    .modalBot .tabTit li{padding:0 15px;}

    .pro_li li{flex-direction: column;}
    .pro_li li .tit{justify-content: center; padding:10px; border-radius: 10px 10px 0 0 ;}
    .pro_li li .tit:before,
    .pro_li li .tit:after{display:none;}
    .pro_li li .tit,
    .pro_li li .txt{width:100%; padding:10px;}
}

/* ~ 375px */
@media screen and (max-width:375px){

      .visual .m_search .search_logo{width:26%;}
	
	/**************** #3 �젙蹂대쭏�떦 ****************/
	.layout{max-width:calc(100% - 20px);}
	.m_noticeBx .tabContent ul li a{align-items: flex-start; flex-direction: column;}
	.m_noticeBx .tabContent ul li a .text{width:100%;}
	.m_noticeBx .tabContent ul li a .date{margin:0 auto 10px;}
	.m_infoBx .layout .info_right .linkBx{display:flex; flex-direction: column;}
	.m_infoBx .layout .info_right .linkBx a{margin-bottom:10px;}

	/* �쉶�썝媛��엯, ip/pw李얘린, 留덉씠�럹�씠吏� */
	.memCont ul{flex-wrap: wrap;}
	.memCont ul li,
	.memCont ul.twoBoxs li{width:100%; margin-bottom:20px; padding:15px;}


}