@charset "utf-8";

#atc03{overflow:hidden;position:relative;width:100%;padding:130px 0 100px;background-color:#f2f2f2}
#atc03:before{display:block;content:"";position:absolute;left:50%;top:-40px;width:80px;height:80px;margin-left:-40px;background-color:#fff;-ms- transform:rotate(45deg);-webkit- transform:rotate(45deg);transform:rotate(45deg)}
#atc03_wrap{position:relative;width:1120px;margin:0 auto;text-align:center}

/* 마우스 */
#atc03 .mouse{}
#atc03 .scroll-down{position:absolute;top:0;left:50%;margin-left:-7px;-webkit-animation:scroll-inner 1.5s infinite ease;-ms-animation:scroll-inner 1.5s infinite ease;animation:scroll-inner 1.5s infinite ease}
@-webkit-keyframes scroll-inner{from{top:0;opacity:1}to{top:12px;opacity:0}}
@-ms-keyframes scroll-inner{from{top:0;opacity:1}to{top:12px;opacity:0}}
@keyframes scroll-inner{from{top:0;opacity:1}to{top:12px;opacity:0}}

/* 타이틀 */
#atc03_wrap h3{display:inline-block;position:relative;z-index:1;margin-bottom:40px;font-size:36px;letter-spacing:-.3px;font-family:notokr-light}
#atc03_wrap h3:before{content:"CLP";position:absolute;left:-110px;top:-55px;z-index:-1;font-size:100px;font-weight:900;color:#e6e6e6;font-family:Roboto}
#atc03_wrap h3 span{font-family:notokr-bold}
#atc03_wrap h3 span b{position:relative}
#atc03_wrap h3 span b:before{display:block;content:"";position:absolute;top:-5px;left:50%;margin-left:-2.5px;width:5px;height:5px;border-radius:5px;background-color:#296bc6}

/* 월 납입금 */
#carMonthPayMain{position:relative;width:100%;height:620px;text-align:left;background-color:#fff;-webkit-box-shadow:4px 4px 24px -5px rgba(0,0,0,0.3);-moz-box-shadow:4px 4px 24px -5px rgba(0,0,0,0.3);box-shadow:4px 4px 24px -5px rgba(0,0,0,0.3)}
#carMonthPayMain .scroll::-webkit-scrollbar{width:4px}
#carMonthPayMain .scroll::-webkit-scrollbar-thumb{height:50px;border-radius:5px;background:#4c4f54}
#carMonthPayMain .scroll::-webkit-scrollbar-track{background:#e6e6e6}
#carMonthPayMain .maker{overflow-y:scroll;position:absolute;left:0;top:0;width:120px;height:100%;text-align:center}
#carMonthPayMain .maker ul li{padding:10px 0;cursor:pointer;transition:all .3s}
#carMonthPayMain .maker ul li:hover{background-color:#dfe9f7}
#carMonthPayMain .maker ul li.car_select{background-color:#dfe9f7}
#carMonthPayMain .model{overflow-y:scroll;position:absolute;left:125px;top:0;width:245px;height:100%;font-size:16px;line-height:47px;letter-spacing:-.3px;color:#fff}
#carMonthPayMain .model:before{display:block;content:"";position:absolute;top:0;left:0;z-index:0;width:98%;height:100%;background-color:#3c4f69}
#carMonthPayMain .model ul li{position:relative;width:98%;padding-left:25px;border-bottom:1px solid #506178;cursor:pointer;background-color:#3c4f69;transition:all .3s}
#carMonthPayMain .model ul li:hover{padding-left:37px;background-color:#273344}
#carMonthPayMain .model ul li:before{display:block;content:"";position:absolute;left:20px;top:14.5px;width:4px;height:18px;background-color:#fff;opacity:0}
#carMonthPayMain .model ul li:hover:before{opacity:1}
#carMonthPayMain .model ul li.car_select{padding-left:37px;background-color:#273344}
#carMonthPayMain .model ul li.car_select:before{opacity:1}
#carMonthPayMain .car_cont{position:absolute;left:370px;top:0;width:750px;height:100%;text-align:center}
#carMonthPayMain .car_cont a{display:block;height:100%;padding:70px 50px}
#carMonthPayMain .car_cont a img{max-height:227px}
#carMonthPayMain .car_cont .sbj_area{overflow:hidden;margin:25px 0 30px}
#carMonthPayMain .car_cont .sbj_area h4{float:left;font-size:25px;color:#222;font-family:notokr-bold}
#carMonthPayMain .car_cont .sbj_area p{float:right;padding:8px 20px;border-radius:2px;font-size:15px;color:#fff;background-color:#3c4f69;font-family:notokr-medium}
#carMonthPayMain .car_cont .cont_area .bar{position:relative;width:100%;height:3px;background-color:#333}
#carMonthPayMain .car_cont .cont_area .bar:before, #carMonthPayMain .car_cont .cont_area .bar:after{display:block;content:"";position:absolute;left:0;top:-3px;width:9px;height:9px;border-radius:8px;background-color:#333}
#carMonthPayMain .car_cont .cont_area .bar:after{left:auto;right:0}
#carMonthPayMain .car_cont .cont_area ul{position:relative}
#carMonthPayMain .car_cont .cont_area ul:before{content:"~";position:absolute;top:33px;left:50%;margin-left:-7px;font-size:24px;font-family:notokr-bold}
#carMonthPayMain .car_cont .cont_area ul:after{display:block;content:"";visibility:hidden;clear:both}
#carMonthPayMain .car_cont .cont_area ul li{float:left;position:relative;z-index:0;width:50%;padding-top:30px;font-size:18px;color:#333;text-align:center;font-family:notokr-medium}
#carMonthPayMain .car_cont .cont_area ul li span{font-size:28px;font-family:notokr-bold}
#carMonthPayMain .car_cont .cont_area ul li span.c_blue{color:#296bc6}
#carMonthPayMain .car_cont .cont_area ul li.min:before, #carMonthPayMain .car_cont .cont_area ul li.max:before{content:url(/sh_img/make24/include_03/img/min.png);position:absolute;top:-11px;left:50%;margin-left:-9px}
#carMonthPayMain .car_cont .cont_area ul li.max:before{content:url(/sh_img/make24/include_03/img/max.png)}
#carMonthPayMain .car_cont .cont_area ul li.min:after{content:"";position:absolute;top:-25px;left:50%;z-index:-1;width:50px;height:50px;margin-left:-25px;border-radius:50px;background-color:rgba(93,144,232,.1);
-webkit-animation:circle 2s infinite;animation:circle 2s infinite}
@-webkit-keyframes circle{from{opacity:0}50%{opacity:1}to{opacity:0}}
@keyframes circle{from{opacity:0}50%{opacity:1}to{opacity:0}}
#carMonthPayMain .car_cont .txt{position:relative;padding:25px 30px;margin-top:20px;font-size:16px;color:#777;text-align:left;background-color:#f2f2f2}
#carMonthPayMain .car_cont .txt span{color:#222;font-family:notokr-medium}
#carMonthPayMain .car_cont .txt .btn{position:absolute;top:-45px;right:-25px;width:84px;height:84px;border-radius:84px;font-size:13px;line-height:84px;text-align:center;color:#fff;background-color:#e8114f;webkit-box-shadow:11px 11px 15px -2px rgba(232,17,79,0.28);
-moz-box-shadow:11px 11px 15px -2px rgba(232,17,79,0.28);box-shadow:11px 11px 15px -2px rgba(232,17,79,0.28);transition:all .3s;font-family:notokr-medium}
#carMonthPayMain .car_cont .txt .btn:hover{background-color:#dd0040;webkit-box-shadow:8px 8px 10px -2px rgba(232,17,79,0.58);-moz-box-shadow:8px 8px 10px -2px rgba(232,17,79,0.58);box-shadow:8px 8px 10px -2px rgba(232,17,79,0.58)}	