@charset "UTF-8";
*{
    font-family:'Montserrat', 'Pretendard';
}

body, header{min-width: 280px !important;}

.floatRight{
    float: right;
}

.floatRight:after{content: ""; display: block; clear: both;}

.renewal2 .conts_wrap{
    width:100%;
    max-width: 1200px;
}


/*헤더 : 시작*/
.renewal2 .head_inner h1 img{
  width: 134px;
}


.renewal2 .menu_top li a{
  font-size:14px;
  color:#666 !important;
}
.renewal2 .menu_top li a.admin{
  font-weight:700;
  color:#329ae7 !important;
}


.renewal2 #gnb ul li a {
    display: inline-block;
    width: 100%;
    padding: 0 !important;
    word-break: keep-all;
    font-size: 20px !important;
    height: 54px;
    color:#333
}

.renewal2 #gnb ul li:hover a{color:#00ABFF !important}

.buttonMenu{display: none;}

.mobileNav{display: none}

.dimmMoMenu{display: none;}

/*헤더 : 끝*/



/*메인 1 - 시작*/
.renewal2 #gnb ul li:hover a {
    color: #333
}

.renewal2 #gnb ul li:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 0;
  height: 4px;
  background: #00ABFF;
  transform: translateY(-50%);
  transition: all 0.3s;
}

.renewal2  #gnb ul li:hover:after {
  left: 0;
  width: 100%;
}

.renewal2 .visual_main {
    position: relative;
    height: 720px;
    background: url(/images/renewal/mainBG2.png) center center no-repeat;
    background-size: cover  !important;
}

.renewal2 .visual_inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 160px;
    color: #fff;
}

.renewal2 .txt_visual span{color:#111946 !important}

.renewal2 .txt_desc {
    width: 40%;
    margin-top: 32px;
    line-height: 1.6;
    font-size:16px;
    word-break: keep-all;
    color:#17174D !important;
}

.renewal2 .btn_start_intv {
    position: relative;
    overflow: hidden;
    width: 204px;
    height: 56px;
    margin-right: 20px;
    border-radius: 28px;
    padding: 0;
    background: #111946;
    font-size: 1.20rem;
    font-weight: 500;
    color: #f1f1f1;
    z-index: 2;
}


.renewal2 .box_info {
    position: relative;
    bottom: auto;
    transform: translate(0, -50%);
    right: 0;
    left: 0;
    width:calc(100% - 40px);
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 60px;
    background: #fff;
    border-radius: 40px !important;
    border:1px solid #E0E4E6;
    box-shadow: 0 -4px 10px /*4px*/ rgba(0,0,0, 0.2);
    text-align: center;
}

.renewal2 .box_info.ver2 > div:nth-child(1) {
    width: 74%;
    background: none;
    padding-left: 0;
}



.renewal2 .box_info.ver2 > div:nth-child(1):after{
  content: ""; display: block; clear: both;
}

.renewal2 .box_info.ver2 > div:nth-child(1) .boxImg1{
  float: left;
  width: 140px;
  line-height: 0;
}

.renewal2 .box_info.ver2 > div:nth-child(1) .boxImg1 img{width: 100%}

.renewal2 .box_info.ver2 > div:nth-child(1) .imgCol2{
  float: right;
  width: calc(100% - 196px);
}

.renewal2 .box_info.ver2>div:nth-child(2) {
    width: auto;
    float: right;
}

.renewal2 .txt_info1 {
    font-size: 23px;
    font-weight: 600;
    color:#232323;
    padding:20px 0 0;
    text-align: left;
}

.renewal2 .txt_info2 {
    margin-top: 20px;
    line-height: 24px;
    font-size: 16px;
    color:#666666;
    text-align: left;
}
.renewal2 .box_info > div:nth-child(1):before{display: none !important;}

.renewal2 .box_info.ver2 span{display: block;}

.mainBoxButton1{
    display: block;
    float: left;
    width: 130px !important;
    height: 124px !important;
    background: url(/images/renewal/ic_result.png) center 14px no-repeat !important;
    background-size: 64px 64px !important;
    text-align: center;
    padding:91px 0 0 !important;
    line-height: 24px;
    font-size:15px;
    font-weight: 500;
    color:#232323;
}

.mainBoxButton2{
    display: block;
    float: left;
    width: 130px !important;
    height: 124px !important;
    background: url(/images/renewal/ic_result.png) center 14px no-repeat !important;
    background-size: 64px 64px !important;
    text-align: center;
    padding:91px 0 0 !important;
    line-height: 24px;
    font-size:15px;
    font-weight: 500;
    color:#232323;
}
/*메인 1 - 끝*/






/*메인 2 - 시작*/
.renewal2 .conts_wrap h2{
    font-size: 42px;
}
.renewal2 .intro_inear .conts_wrap{padding:10px 0 0}

.renewal2 .txt_side{
    width: 100%;
    text-align: center;
    font-size:18px;
    line-height: 30px;
    margin:20px 0 0;
    color:#555;
}

.renewal2 .main2ImgA{
    width: calc(100% - 40px);
    max-width: 1060px;
    margin:0 auto;
}

.renewal2 .main2ImgA.main2ImgA2{display: none;}
.renewal2 .main2ImgA.main2ImgA3{display: none;}

.renewal2 .main-text-new {
    text-align: center;
    padding: 48px 0 120px;
}

.renewal2 .intro_ai_new{
    background-color: #F5FCFE;
    padding-bottom:80px;
}

.main3Tabs{
    display: block;
    width: 100%;
    margin:80px 0 0;
    padding:0 40px;
}

.main3Tabs:after{content: ""; display: block; clear: both;}

.main3Tab{
    display: block;
    float: left;
    width: calc((100% - 120px) / 3);
    height: 56px;
    line-height: 52px;
    border-radius: 28px;
    border:2px solid #88BFF6;
    text-align: center;
    font-size: 21px;
    font-weight: 700;
    color:#232323 !important;
}

.main3Tab + .main3Tab{margin:0 0 0 60px}

.main3Tab.active{
    background: #056EC7;
    color:#fff !important;
    border-radius: 28px 28px 28px 0;
}


.main3TabArea{
    display: none;
    width: 100%;
    padding:40px 60px;
}

.main3TabArea.active{display: block;}

.mBox1{
    display: block;
    width: 100%;
    border-bottom:2px dashed #0C74DB;
    padding:0 0 32px;
    position: relative;
}

.mBox1:after{content: ""; display: block; clear: both}

.mBox1 .row1{
    display: block;
    width: 100%;
    float: left;
}

.mBox1 .row1:after{content: ""; display: block; clear: both}

.mBox1 .row1 .mTxt1{
    display: block;
    float: left;
    font-size:28px;
    font-weight: 700;
    text-align: left;
    line-height: 53px;
    color:#232323;
    border-bottom:4px solid #0982FB;
}

.mBox1 .row2{
    display: block;
    width: calc(100% - 300px);
    margin:20px 0 0;
    float: left;
}

.mBox1 .row2:after{content: ""; display: block; clear: both}

.mBox1 .row2 .mTxt2{
    display: block;
    width: 100%;
    font-size: 17px;
    line-height: 28px;
    text-align: left;
    font-weight: 400;
    color:#0982FB;
}

.mBox1 .row2 .mTxt3{
    display: block;
    width: 100%;
    font-size: 17px;
    line-height: 28px;
    text-align: left;
    font-weight: 400;
    color:#676C70;
    margin:3px 0 0;
}

.mBox1 .gotoDetail{
    display: block;
    width: 180px;
    height: 48px;
    line-height: 48px;
    border-radius: 24px;
    text-align: center;
    color:#fff !important;
    background: #43A0FC;
    font-size: 18px;
    font-weight: 500;
    position: absolute;
    z-index: 0;
    right: 130px;
    bottom:36px;
}

.mBox2{
    display: block;
    width: 100%;
    padding:60px 0 60px;
}

.mBox2:after{content: ""; display: block; clear: both;}
.mBox2 .mImg1{
    float: left;
    display: block;
    width: 480px;
}

.mBox2 .mImg1mo{display: none;}

.mBox2 .mContents{
    float: right;
    width: calc(100% - 560px);
}

.stepWrap{
    display: block;
    width: 100%;
}

.stepWrap + .stepWrap{margin:40px 0 0;}

.stepWrap:after{content: ""; display: block; clear: both;}

.stepWrap .stepLabel{
    display: block;
    float: left;
    width: 140px;
    height: 40px;
    line-height: 40px;
    background: #171B33;
    text-align: center;
    border-radius: 20px 20px 0 20px;
    color : #fff;
    font-size: 17px;
    font-weight: 500;
}

.stepWrap .txtWrap{
    float: right;
    width: calc(100% - 160px);
}

.stepWrap .txtWrap .txtTitle{
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 700;
    text-align: left;
    color:#232323;
    line-height: 38px;
}

.stepWrap .txtWrap .txtStep{
    display: block;
    width: 100%;
    margin:18px 0 0;
}

.stepWrap .txtWrap .txtStep + .txtStep{
    margin:6px 0 0;
}

.stepWrap .txtWrap .txtStep:after{content: ""; display: block; clear: both}

.stepWrap .txtWrap .txtStep .t1{
    float: left;
    display: block;
    width: 70px;
    font-size:16px;
    line-height: 24px;
    font-weight: 700;
    color: #43A0FC;
}

.stepWrap .txtWrap .txtStep .t2{
    float: right;
    display: block;
    width: calc(100% - 81px);
    font-size:15px;
    line-height: 24px;
    font-weight: 400;
    color: #232323;    word-break: keep-all;
}

.stepWrap .txtWrap .txtStep .t3{
  
    display: block;
    width: calc(100% - 81px);
    font-size:15px;
    line-height: 24px;
    font-weight: 400;
    color: #232323;
}
/*메인 2 - 끝*/






/*메인 3 - 시작*/
.renewal2 .conts_wrap h4{
    margin:80px 0 0;
    font-size:20px;
    line-height: 1;
    font-weight: 700;
    border: none;
    padding:0;
}

.renewal2 .video_lst li{
    border:1px solid #C8D3E5;
    border-radius: 20px;
    padding:24px 20px
    box-shadow: none;
}

.renewal2 .tit_video{
    font-size:16px;
    font-weight: 500;
    color:#232323;
}

.renewal2 .video_area{margin:8px 0 0;}

.renewal2 .txt_video{
    font-size:14px;
    line-height: 20px;
    margin:20px 0 0;
       min-height: 80px;
}

.renewal2 .txt_tips {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    padding:0 16px;
    background: #2e3843;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    border-radius: 12px;
}

.btn_scroll_top{box-shadow: 0 2px 10px rgba(0,0,0,0.16)}

.btn_scroll_top img{
    width: 32px;
    transform: translateY(-4px);
}

/*메인 3 - 끝*/


/*푸터 : 시작*/
.newFooter{
    padding:40px 0;
    background: #000000 !important;
}

.newFooter .conts_wrap{padding:0 20px;}

.conts_wrap:after{content: ""; display: block; clear: both;}

.newFooter .copyRight{
    float: left;
}

.newFooter .buttonEtc{
    float: right;
    
}

.newFooter .buttonEtc .btn_inquiry + .btn_inquiry{margin:0 0 0 24px}

.newFooter .buttonEtc .btn_inquiry{
    float: left;
    width: 100px;
    height: 32px;
    line-height: 28px;
    border:2px solid rgba(255,255,255,0.8);
    border-radius: 16px;
    text-align: center;
    color:#fff !important;
    font-size: 16px;
    font-weight: 400;
    padding:0;
    background: none;
}

.newFooter .buttonEtc:after{content: ""; display: block; clear: both;}

.newFooter .copyRight{
    color:#C5C5C5;
    font-size:14px;
    line-height: 24px;
    text-align: left;
    font-weight: 400;
}
/*푸터 : 끝*/





/*마이페이지 : 시작*/

.renewal2.mypage {
    margin-top: 164px;
}

.renewal2 .visual_sub {
    height: 200px;
    background: url(/images/renewal/bg_mypage.png) center center no-repeat;
    background-size: cover;
}
.renewal2 .txt_desc_sub{
    display: block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
    padding:8px 0 50px;
    color:#8C8C8D;
}

.tabMenu2{
    display: block;
    width: 100%;
    text-align: center;
    margin:0 0 40px;
}

.inside{display: inline-block;}

.inside:after{content: ""; display: block; clear: both;}

.tabMenu2 .tab2{
    display: block;
    width: 240px;
    float: left;
    height: 40px;
    line-height: 36px;
    border-radius: 20px;
    text-align: center;
    border:2px solid #CCD8E2;
    font-size:19px;
    color:#333 !important;
    font-weight: 400;
    background: #fff;
}

.tabMenu2 .tab2.active{
    background: #056EC7;
    color: #fff !important;
    border:2px solid #056EC7;
}

.tabMenu2 .tab2 + .tab2{margin:0 0 0 20px}

.renewal2 .tbl_mypage{
    width: 100%;
    border-top:2px solid #232323;
    margin:0 0  70px;
}

.renewal2 .tbl_mypage th {
    background: #fff !important;
    font-weight: 700;
    color: #232323 !important;
    font-size:16px;
    line-height: 23px;
    padding:21px 0;
}

.renewal2 .tbl_mypage td{
    border:none;
    padding:14px 10px;
    line-height: 32px;
    font-size:16px;
    color:#666;
    font-weight: 400;
}

.renewal2 .tbl_mypage th:nth-child(1), .renewal2  .tbl_mypage td:nth-child(1){width:10%}
.renewal2 .tbl_mypage th:nth-child(2), .renewal2  .tbl_mypage td:nth-child(2){width:*}
.renewal2 .tbl_mypage th:nth-child(3), .renewal2  .tbl_mypage td:nth-child(3){width:15%}
.renewal2 .tbl_mypage th:nth-child(4), .renewal2  .tbl_mypage td:nth-child(4){width:15%}
.renewal2 .tbl_mypage th:nth-child(5), .renewal2  .tbl_mypage td:nth-child(5){width:15%}
.renewal2 .buttonContinue{
    display: inline-block;
    width: 104px;
    height: 32px;
    line-height: 28px;
    text-align: center;
    border-radius: 16px;
    border:2px solid #3092F2;
    color:#056EC7 !important;
    background: #fff;
    font-size: 16px;
    font-weight: 400;
}

.renewal2 .buttonContinue:hover{
    border:2px solid #43A0FC;
    color:#fff !important;
    background: #43A0FC;
}

.renewal2 .buttonDetail{
    display: inline-block;
    height: 32px;
    width: 32px;
    text-align: center;
    background: url(/images/renewal/ic_view.png);
    background-size: 32px 32px;cursor:pointer
}

.renewal2 .buttonDetail:hover{
    display: inline-block;
    height: 32px;
    width: 32px;
    text-align: center;
    background: url(/images/renewal/ic_view_ov.png);
    background-size: 32px 32px;
}

.renewal2 .pagination{
    display: block;
    text-align: center;
    padding:0 0 84px;
}

.renewal2 .pagination li{float: left;}

.renewal2 .pagination .pagination-arow{
    display: block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    font-weight: 400;
    color:#666666 !important;
}

.renewal2 .pagination .page{
    display: block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
    font-weight: 400;
    color:#666666 !important;
}

.renewal2 .pagination .active .page{
    background: #3E444A;
    color:#fff !important;
    border-radius: 5px;
}




.renewal2 .pagination .pagination-arow img{
    width: 32px;
}


/*마이페이지 : 끝*/







/*모달 : 시작*/
.modalNormal{
    display: none;
    width: calc(100% - 40px);
    max-width: 480px;
    position: absolute;
    z-index: 20000;
   /* top:50%;
    left: 50%;
	
    transform: translate(-50%, -50%);*/
    border-radius: 20px;
    border:10px solid #0FA9F5;
    background: #0FA9F5;
}

.modalInside{
    display: block;
    width: 100%;
    padding:30px;
    background: #fff;
    border-radius: 16px;
}

.modalNormal.active{display: block;}

.modalNormal .titleRoW{
    display: block;
    width: 100%;
    position: relative;
    padding:0 0 15px;
    border-bottom: 2px solid rgba(220, 219, 223, 0.5);
}

.modalNormal .titleRoW:after{content: ""; display: block; clear: both;}

.modalNormal .titleRoW .title{
    float: left;
    display: block;
    height: 36px;
    line-height: 36px;
    text-align: left;
    color:#00ABFF;
    font-weight: 500;
}

.modalNormal .titleRoW .title.login{
    background: url(/images/renewal/ic_login.png) left no-repeat;
    background-size: 36px 36px;
    padding:0 0 0 46px;
}

.modalNormal .titleRoW .title.inquiry{
    background: url(/images/renewal/ic_inquriy.png) left no-repeat;
    background-size: 36px 36px;
    padding:0 0 0 46px;
}

.modalNormal .titleRoW .buttonCloseModal{
    position: absolute;
    top:0;
    right: 0;
    width: 24px;
    height: 24px;
    background: url(/images/renewal/ic_close.png) center no-repeat;
    background-size: 24px 24px;
}

.modalContent{
    display: block;
    width:100%;
    margin:24px 0 0;
    overflow-y: auto;
    max-height: calc(100vh - 280px);
}

.modalContent::-webkit-scrollbar{
    width: 8px;
}
.modalContent::-webkit-scrollbar-thumb{
    background: rgba(0,0,0,0.2);
    border-radius: 4px;
}
.modalContent::-webkit-scrollbar-track{
    background: rgba(0,0,0,0);
}

.modalContent .inputWrap{
    display: block;
    width: 100%;
    position: relative;
}

.modalContent .inputWrap + .inputWrap{margin:12px 0 0;}

.modalContent .inputWrap .idIcon{
    position: absolute;
    top:14px;
    left:24px;
    width:20px;
    height:20px;
    background: url(/images/renewal/ic_id.png) center no-repeat;
    background-size: 20px 20px;
}

.modalContent .inputWrap .passwordIcon{
    position: absolute;
    top:14px;
    left:24px;
    width:20px;
    height:20px;
    background: url(/images/renewal/ic_pw.png) center no-repeat;
    background-size: 20px 20px;
}

.inputNormal{
    display: block;
    width: 100%;
    height: 48px;
    line-height: 48px;
    border-radius: 24px;
    background: #F6F7FC;
    color:#111;
    font-size:14px;
    text-align: left;
    padding:0 10px 0 54px;
    font-weight: 400;
    border: none !important;
}

.inputNormal::placeholder{color:#666 !important}

.txtaNormal{
    display: block;
    width: 100%;
    height: 240px;
    font-size:14px;
    line-height: 22px;
    border-radius: 24px;
    background: #F6F7FC;
    color:#111;
    text-align: left;
    padding:16px 15px;
    font-weight: 400;
    border: none !important;
}

.txtaNormal:focus{outline: none !important;}

.label2{
    height: 240px !important;
    line-height: 240px !important;
}

.buttonLogin{
    display: block;
    width: 100%;
    height: 48px;
    line-height: 48px;
    text-align: center;
    color:#fff !important;
    font-size: 18px;
    font-weight: 500;
    border-radius: 24px;
    background: #43A0FC;
	 transition: all 0.2s;
}

.buttonLogin:hover{
   opacity:0.8
}


.dimm{
    display: none;
    position: fixed;
    z-index: 19000;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,0.6);
    top:0;
    left: 0;
}

.dimm.active{display: block;}

.inputWrap:after{content: ""; display: block; clear: both;}

.inputWrap .label{
    display: block;
    width: 120px;
    float: left;
    height: 48px;
    line-height: 48px;
    text-align: left;
    font-size: 16px;
    font-weight: 400;
    color:#232323;
}

.inputWrap .row{
    width: calc(100% - 120px);
    float: right;
    display: block;
}

.inputWrap .row .inputNormal{padding:0 10px 0 15px}

.modalInquiry{
    max-width: 680px !important;
    padding-bottom: 20px;
}

.inputWrap .row .txt1{
    display: block;
    width: 100%;
    color:#8C8C8D;
    font-size:14px;
    line-height: 23px;
    padding:7px 0 0;
    text-align: left;
}

.modalInquiry .modalInside{padding-bottom: 6px}

.buttonInquiry{
    display: block;
    width: 320px;
    height: 48px;
    line-height: 44px;
    text-align: center0;
    border-radius: 24px;
    border:2px solid #fff;
    color:#fff !important;
    font-size: 18px;
    font-weight: 500;
    margin:20px auto 0;
}
/*모달  : 끝*/


.goUp{
    animation-name: goUp;
    animation-duration:0.7s;
}

.goUp2{
    animation-name: goUp2;
    animation-duration:0.7s;
}

@keyframes goUp {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes goUp {
  0% {
    transform: translateY(30px);
    opacity:0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}


@keyframes goUp2 {
  0% {
    transform: translateY(30px);
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@-webkit-keyframes goUp2 {
  0% {
    transform: translateY(30px);
    opacity:1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}





.renewal2 .section2 .conts_wrap{
    padding-top : 0 !important
}









































































@media screen and (max-width: 1200px) {
.mBox2 .mImg1{width: 33%}    
.mBox2 .mContents {
    float: right;
    width: calc(67% - 40px);
}

.mBox1 .row2 .mTxt2{font-size:18px; line-height: 26px;}
.mBox1 .row2 .mTxt3{font-size:18px; line-height: 26px;}

}









@media screen and (max-width: 1160px) {
.hide1160{display: none;}

.renewal2 .box_info{
    padding:20px 40px 30px;
}

.renewal2 .box_info.ver2 > div:nth-child(1) .imgCol2{
    width:calc(100% - 154px);
}

.renewal2 .box_info.ver2 > div:nth-child(1) {
    width: calc(100% - 260px);
}

.renewal2 .box_info.ver2 > div:nth-child(1) .boxImg1{width: 120px}

.mainBoxButton1{width: 100px; font-size: 14px}
.mainBoxButton2{width: 100px; font-size: 14px}



.stepWrap .stepLabel{font-size:17px}
.stepWrap .txtWrap .txtTitle{font-size:20px;}
.stepWrap .txtWrap .txtStep .t1{
    font-size:17px;
    width: 66px;
}
.stepWrap .txtWrap .txtStep .t2{
    font-size:17px;
    width: calc(100% - 67px);
}


.tabMenu2 .tab2{
    width: 200px;
    font-size: 16px;
}

.renewal2 .buttonContinue {
    width: 74px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    border-radius: 16px;
    border: 2px solid #3092F2;
    color: #056EC7 !important;
    background: #fff;
    font-size: 14px;
    font-weight: 400;
}

.renewal2 .tbl_mypage td{
    font-size:15px;
    line-height: 30px;
}

} /*반응형 1160px 끝*/



@media screen and (max-width: 900px) {
.renewal2 .box_info.ver2 > div:nth-child(1){width:100%}
.renewal2 .box_info.ver2>div:nth-child(2){
    float: none;
    display: inline-block;
    margin: 30px auto 0;
    padding:0;
}

.renewal2 .box_info{
    width: calc(100%);
    transform: translate(0, -50px);
    box-shadow: none;
    border:none;
    border-radius: 50px 50px 0 0 !important;
    padding:20px 36px 30px;
}

.renewal2 .box_info.ver2 > div:nth-child(1) .boxImg1{width:100px}
.renewal2 .box_info.ver2 > div:nth-child(1) .imgCol2{width: calc(100% - 124px);}

.renewal2 .visual_inner {
    margin: 0 auto;
    padding: 58px 22px 0 36px;
    color: #fff;
}

.renewal2 .txt_desc{width:80%}

.renewal2 .intro_inear .conts_wrap {
    padding: 40px 16px 0;
}

.renewal2 .visual_main {
    padding:0;
    position: relative;
    height: 800px;
    background: url(/images/renewal/mainBG2mo.png) center center no-repeat;
    background-size: cover !important;
}

.renewal2 .main2ImgA.main2ImgA1{display: none;}
.renewal2 .main2ImgA.main2ImgA2{display: block;}


.main3Tabs{
    margin:50px 0 0;
    padding:0 16px;
}

.main3Tab{
    font-size: 20px;
    width: calc((100% - 40px) / 3);

}

.main3Tab + .main3Tab{margin:0 0 0 20px}

.main3TabArea{padding:30px 26px}

.mBox1 .row1 .mTxt1{
    font-size:35px;
    line-height: 43px;
}

.mBox1 .row2{width: 100%}
/*.mBox1 .row2 .mTxt2{font-size:20px; line-height: 30px}
.mBox1 .row2 .mTxt3{font-size:20px; line-height: 30px}*/
.mBox1 .gotoDetail{
    position: relative;
    float: left;
    bottom:auto;
    right: auto;
    margin:30px 0 0;
}

.mBox2 .mContents{
    width: 100%;
    float: left;
}

.mBox2 .mImg1{display: none;}
.mBox2 .mImg1mo{
    display: block;
    float: right;
    width: calc(100% - 40px);
    max-width: 400px;
    margin:30px 0 0;
}

.h2_wrap {
    position: relative;
    height: 100%;
    background: url(/images/renewal/bg_mypageMo.png) calc(50% - 60px) no-repeat;
    background-size: cover !important;
}


} /*반응형 900px 끝*/



@media screen and (max-width: 800px) {


} /*반응형 800px 끝*/




@media screen and (max-width: 768px) {
.head_inner{height: 64px}

.renewal2 .head_inner h1 img{
    width: 140px;
    transform: translateY(1px);
}

.buttonMenu{
    display: block;
    width: 48px;
    height: 48px;
    background: url(/images/renewal/btn_menu.png) center no-repeat;
    position: absolute;
    background-size: 24px 24px;
    top:8px;
    right:4px;
    z-index: 30;
}

.renewal2 .conts_wrap h2{font-size:36px; line-height: 48px}
.renewal2 .txt_side{
    font-size: 17px;
    line-height: 24px;
    margin:13px 0 0;
}

.main3Tabs{padding:0;}

.main3Tab{
    width: calc((100% - 20px) / 3);
    font-size:16px;
}

.main3Tab + .main3Tab{
    margin:0 0 0 10px;
}

.stepWrap .txtWrap{
    width: 100%;
    margin:20px 0 0;
}


.stepWrap + .stepWrap{margin:60px 0 0}

.stepWrap .txtWrap .txtStep{margin:10px 0 0}


.newFooter {text-align: center;}

.newFooter .copyRight{
    display: block;
    width: 100%;
    font-size:14px;
    line-height: 21px;
    padding:0 0 30px;
    text-align: center;
}

.newFooter{padding:50px 0 100px}

.newFooter .buttonEtc{
    float: none;
    margin:0 auto;
    display: inline-block;
}
.newFooter .buttonEtc .btn_inquiry{margin:0}

.newFooter .buttonEtc .btn_inquiry + .btn_inquiry{margin:0 0 0 18px}

.btn_scroll_top img{width: 28px;}



.dimmMoMenu{
    display: none;
    position: fixed;
    z-index: 9900;
    top:0;
    right: 0;
    width: 100%;
    height: 100vh;
    padding:0 !important;
    background: rgba(0,0,0,0.6);
}

.dimmMoMenu.active{display: block;}


.mobileNav{
    display: block;
    width: 400px;
    top:0;
    right: -400px;
    position: fixed;
    z-index: 10000;
    background: #fff;
    height: 100vh;
    overflow-y: auto;
    transition: right 0.4s;
}

.mobileNav.active{
    right: 0;
    transition: right 0.4s;
}

.mobileNav .moMenuTop{
    display: block;
    width: 100%;
    height: 64px;
    padding:0 28px;
    position: relative;
    border-bottom:2px solid #DCDBDF;
}

.mobileNav .moMenuTop img{
    float: left;
    width: 120px;
    margin:22px 0 0 ;
}

.closeMoMenu{
    display: block;
    position: absolute;
    top:8px;
    right: 3px;
    width: 48px;
    height: 48px;
    background: url(/images/renewal/btn_close.png) center no-repeat;
    background-size: 24px 24px;
}

.moMenus{
    display: block;
    width: 100%;
    padding:22px 28px 50px;
}

.moMenus a{
    display: block;
    width: 100%;
    height: 55px;
    line-height: 53px;
    text-align: left;
    font-size: 18px;
    font-weight: 400;
    color:#232323 !important;
    border-bottom: 2px solid rgba(220,219,223,0.35);
}
.moMenus a.active{
    color:#00ABFF !important;
    font-weight: 500;
}

.moMenus2{
    display: block;
    text-align: center;
}

.logoutMo{
    display: block;
    border:1px solid #e0e0e0;
    width: 120px;
    height: 36px;
    line-height: 34px;
    text-align: center;
    font-size:14px;
    color:#232323 !important;
    font-weight: 400;
    background: #fff;
    margin:30px 0 0 28px;
    border-radius: 3px;
    float: left;
}

.forConnection{
    display: block;
    width: 100%;
    float: left;
    padding: 30px 28px;
}

.forConnection:after{content: ""; display: block; clear: both;}

.loginMo{
    display: block;
    border:1px solid #e0e0e0;
    width: calc(50% - 5px);
    height: 36px;
    line-height: 34px;
    text-align: center;
    font-size:14px;
    color:#232323 !important;
    font-weight: 400;
    background: #fff;
    border-radius: 3px;
	margin: 0 auto;
}

.joinMo{
    display: block;
    border:1px solid #e0e0e0;
    width: calc(50% - 5px);
    height: 36px;
    line-height: 34px;
    text-align: center;
    font-size:14px;
    color:#232323 !important;
    font-weight: 400;
    background: #fff;
    border-radius: 3px;
    float: right;
}





.renewal2.mypage {
    margin-top: 64px;
}


.tabMenu2 .inside{
    display: block;
    width: 100%;
}

.tabMenu2 .inside .tab2{
    width: calc((100% - 16px) / 3);
    font-size: 14px;
}

.tabMenu2 .inside .tab2 + .tab2{margin:0 0 0 8px}

.tbl_mypage td.title p{
    overflow: visible;
    white-space: normal;
}

.renewal2 .tbl_mypage th:nth-child(1), .renewal2 .tbl_mypage td:nth-child(1){
    width:47px !important; float: left;
    font-size:13px;
    font-weight: 500;
    color:#666;
}

.renewal2 .tbl_mypage th:nth-child(2), .renewal2 .tbl_mypage td:nth-child(2){
    width:calc(100% - 47px) !important; float: left;
    font-size:17px;
    font-weight: 700 !important;
    color:#232323;
    padding:14px 0;
}

.renewal2 .tbl_mypage td:nth-child(2) strong{font-weight: 700 !important;}

.renewal2 .tbl_mypage th:nth-child(3), .renewal2 .tbl_mypage td:nth-child(3){
    width:100% !important;
    float: left;
    font-size:13px;
    font-weight: 400 !important;
    color:#232323;
    padding:0 10px;
}

.renewal2 .tbl_mypage th:nth-child(4), .renewal2 .tbl_mypage td:nth-child(4){
    padding:0 10px;
    font-size:16px;
    font-weight: 400 !important;
    color:#232323;
    float: left;
    width: calc(100% - 94px) !important;
}

.renewal2 .tbl_mypage th:nth-child(5), .renewal2 .tbl_mypage td:nth-child(5){
    padding:0px 20px 7px 10px;
    float: right;
    width: 94px !important;
    text-align: right;
}

.renewal2 .tbl_mypage{border-top: none !important}

/*.tbl_mypage tr{margin:20px 0 0 !important;}*/

.tbl_mypage tr:after{content: ""; display: block; clear: both;}

.renewal2 .tbl_mypage{margin:0 0 20px;}


.h2_wrap p{font-size:16px; line-height: 24px;}

.renewal2 .section2 .conts_wrap{
    padding-top : 30px !important
}

} /*반응형 768px 끝*/




@media screen and (max-width: 600px) {
.renewal2 .main2ImgA.main2ImgA2{display: none;}
.renewal2 .main2ImgA.main2ImgA3{
    display: block;
    width: 100%;
}

.renewal2 .box_info{
    border-radius: 36px 36px 0 0 !important;
    transform: translate(0, -70px);
}


} /*반응형 600px 끝*/



@media screen and (max-width: 500px) {
.renewal2 .conts_wrap h2{
    font-size:28px;
    line-height: 35px;
}

.mBox1 .row1 .mTxt1{font-size: 28px}

.mBox1 .gotoDetail{font-size:17px}

.renewal2 .conts_wrap h4{
    font-size:17px;
    line-height: 24px;
}

.video_lst {
    margin-top: 20px;
}

.main3TabArea{padding: 30px 10px;}

.mBox1 .row2 .mTxt2{
    font-size:14px;
    line-height: 22px;
}

.mBox1 .row2 .mTxt3{
    font-size:14px;
    line-height: 22px;
}

.moMenus{padding:22px 28px 30px}

.mobileNav{
    width: 280px;
    right: -280px;
}

.moMenus a{
    height: 48px;
    line-height: 46px;
    font-size: 17px;
}

.renewal2 .txt_desc_sub{
    font-size:14px;
    line-height: 22px;
    padding:8px 0 30px;
}


.tabMenu2 .inside .tab2{
    display: block;
    width: 100%;

}

.tabMenu2 .inside .tab2 + .tab2{margin:14px 0 0}


} /*반응형 500px 끝*/


@media screen and (max-width: 450px) {
.txt_visual{
    font-size:24px;
    line-height: 30px;
}
.renewal2 .txt_desc{
    font-size:14px;
    line-height: 22px;
}

.renewal2 .btn_start_intv{
    width: 160px;

}

.renewal2 .visual_inner {
    padding: 43px 14px 0 25px;
}

.row_btn{margin:36px 0 0}

.stepWrap .txtWrap .txtStep .t1{
    font-size: 15px;
    line-height: 22px;
    width: 50px;
}

.stepWrap .txtWrap .txtStep .t2{
    font-size: 15px;
    line-height: 22px;
    width: calc(100% - 51px);
}


} /*반응형 450px 끝*/


@media screen and (max-width: 400px) {
.renewal2 .tbl_mypage th:nth-child(1), .renewal2 .tbl_mypage td:nth-child(1){
    line-height: 23px;
}

.renewal2 .tbl_mypage th:nth-child(2), .renewal2 .tbl_mypage td:nth-child(2){
    font-size:15px;
    line-height: 23px;
}

.renewal2 .tbl_mypage th:nth-child(4), .renewal2 .tbl_mypage td:nth-child(4){
    font-size:15px;
    line-height: 23px;
    padding:4px 10px 0;
}

.buttonInquiry{width: calc(100% - 40px)}

.inputWrap .label, .inputWrap .label2{
    display: block;
    width: 100%;
    height: 30px !important;
    line-height: 30px !important;
}

.inputWrap .row{
    width: 100%;
}

.inputNormal{
    height: 44px;
    line-height: 44px;
    border-radius: 22px;
}

} /*반응형 400px 끝*/


@media screen and (max-width: 360px) {
.txt_visual{
    font-size:22px;
    line-height: 27px;
}

.mobileNav{
    width: 80%;
    right: -80%;
}


} /*반응형 360px 끝*/


@media screen and (max-width: 340px) {

} /*반응형 340px 끝*/

@media screen and (max-width: 320px) {
.visual_sub h2{font-size:30px}
} /*반응형 320px 끝*/


@media screen and (max-width: 300px) {
.txt_visual{
    font-size:32px;
    line-height: 40px;
}

.visual_sub h2{font-size:27px}

} /*반응형 300px 끝*/