@charset "utf-8"; /* 최종 적용할 땐 삭제, 임시로 작업해둠 */ .recommendArea{display: none !important;} /* //최종 적용할 땐 삭제, 임시로 작업해둠 */ /* common */ .p_hidden{display: none;} .ir_text {overflow: hidden;position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;border: 0;clip: rect(0 0 0 0);}/* 2021 웹접근성 추가 */ input{-webkit-appearance: none;-webkit-border-radius: 0;border-radius: 0;} input[type=text]::-ms-clear, input[type=tel]::-ms-clear{display: none;} /* select{-webkit-appearance: none;-moz-appearance: none;appearance: none;} */ select::-ms-expand{display: none;}/* IE 10, 11의 네이티브 화살표 숨기기 */ .layerPop01 input{-webkit-appearance: auto;-webkit-border-radius: 0;border-radius: 0;} /* header */ body{background: none;} #header{background: #ffffff;} /* 2021-05-13 footer 수정*/ #footer{position: relative;display: table;width: 100%;height: 252px;border-top: 1px solid #D8D8D8;background: #ffffff;} #footer .footer_box{display: table-cell;width: 100%;height: 100%;text-align: center;vertical-align: middle;} #footer .footer_box ul{display: block;width: 100%;height: auto;font-size: 0;margin-bottom: 4.44vw;} #footer .footer_box ul li{display: inline-block;width: auto;height: auto;vertical-align: top;} #footer .footer_box ul.new_btnmenu li{width: auto;line-height: 1;padding: 2.34vw 4.21vw;box-sizing: border-box;border: 1px solid #979797;border-radius: 2px;margin-right: 3.27vw;} #footer .footer_box ul.new_btnmenu li:last-child{margin-right: 0;} #footer .footer_box ul.new_btnmenu li a{display: block;font-size: 2.80vw;font-weight: bold;color: #242424;} #footer .footer_box ul.bmenu li{width: auto;line-height: 1;} #footer .footer_box ul.bmenu li::after{content: '';display: inline-block;width: 0.47vw;height: 2.80vw;background: #DFDFDF;margin: 0 3.50vw;} #footer .footer_box ul.bmenu li:last-child::after{content: none;} #footer .footer_box ul.bmenu li a{display: inline-block;font-size: 3.04vw;font-weight: bold;color: #404040;} #footer .footer_box .contactus{line-height: 4.67vw;font-size: 2.80vw;color: #707070;font-weight: 400;margin-bottom: 4.91vw;} #footer .footer_box .mark{width: 100%;height: auto;text-align: center;background: #ffffff;} #footer .footer_box .mark a{display: inline-block;} #footer .footer_box .mark a img{width: 100%;} #footer .footer_box .mark a.mark_1{width: 12.15vw;margin-right: 3.97vw;} #footer .footer_box .mark a.mark_2{width: 25.93vw;} /* //2021-05-13 footer 수정*/ /* 2023 상반기 접근성 수정 s */ #maincontents .add_mainvisual .slideBox{position: relative;font-family: 'Nanum Gothic', sans-serif;} #maincontents .add_mainvisual .slideBox ul.mySlide1{margin-bottom: 0;} #maincontents .add_mainvisual .slideBox ul.mySlide1 li a{display: block;width: 100%;height: 100%;} #maincontents .add_mainvisual .slideBox ul.mySlide1 li a img{display: block;width: 100%;} /* 2021 웹접근성 수정. 컨트롤 영역 추가 */ /* #maincontents .add_mainvisual .slideBox .slide_control{display: flex; align-items: center; justify-content: center; position: absolute; bottom: 4.81vw; left: 0; padding: 0;margin: 0;width: 100%;text-align: center;} */ /* #maincontents .add_mainvisual .slideBox .slide_control{display: flex; align-items: center; justify-content: center; position: absolute; bottom: 15px; left: 56%; padding: 0; margin: 0; text-align: center;} #maincontents .add_mainvisual .slideBox .slide_control .dots{display: inline-block; margin-right: 10px;} #maincontents .add_mainvisual .slideBox .slide_control .dots ul{margin: 0;} #maincontents .add_mainvisual .slideBox .slide_control button.auto{display: inline-block; width: 3.5vw; height: 3.5vw; border: none; background: no-repeat; font-size: 0; color:transparent; -webkit-appearance: none; appearance: none;} #maincontents .add_mainvisual .slideBox .slide_control button.auto.pause{background-image: url(/smc/resources/mobile/images/ic_stop.png); background-size: cover;} #maincontents .add_mainvisual .slideBox .slide_control button.auto.play{_display: none; background-image: url(/smc/resources/mobile/images/ic_play.png); background-size: cover;} */ /* //2021 웹접근성 수정. 컨트롤 영역 추가 */ #maincontents .add_mainvisual .slideBox .slide_control{display: flex; align-items: center; justify-content: center; position: absolute; bottom: 20px; left: 0; width: 100%; padding: 0; margin: 0; text-align: center;} #maincontents .add_mainvisual .slideBox .slide_control .dots{display: inline-block; margin-right: 10px;} #maincontents .add_mainvisual .slideBox .slide_control .dots ul{margin: 0;} #maincontents .add_mainvisual .slideBox .slide_control button.auto{display: inline-block; width: 3.5vw; height: 3.5vw; border: none; background: no-repeat; font-size: 0; color:transparent; -webkit-appearance: none; appearance: none;} #maincontents .add_mainvisual .slideBox .slide_control button.auto.pause{background-image: url(/smc/resources/mobile/images/ic_stop.png); background-size: cover;} #maincontents .add_mainvisual .slideBox .slide_control button.auto.play{/* display: none; */ background-image: url(/smc/resources/mobile/images/ic_play.png); background-size: cover;} /* #maincontents .add_mainvisual .slideBox ul.slick-dots{position: absolute;bottom: 4.81vw;left: 0;padding: 0;margin: 0;width: 100%;text-align: center;font-size: 0;} 2021 웹접근성 삭제 */ #maincontents .add_mainvisual .slideBox ul.slick-dots li{display: inline-block;float: none; /* width: auto;height: auto; */margin: 0 0.70vw;} #maincontents .add_mainvisual .slideBox ul.slick-dots li button{display: block;width: 1.87vw;height: 1.87vw;background: #ffffff; border: 1px solid #000000;border-radius: 50%;font-size: 0;padding: 0;} #maincontents .add_mainvisual .slideBox ul.slick-dots li.slick-active button{background: #000000;} @media screen and (max-width: 480px) { /* #maincontents .add_mainvisual .slideBox .slide_control {bottom: 17px; left: calc(56% + 10px);} #maincontents .add_mainvisual .slideBox .slide_control button.auto {width: 4vw; height: 4vw;} */ #maincontents .add_mainvisual .slideBox .slide_control {bottom: 25px;} #maincontents .add_mainvisual .slideBox .slide_control button.auto {width: 20px; height: 20px;} } /* // 2023 상반기 접근성 수정 e */ #maincontents .add_mainvisual .noticebox{display: table;width: 100%;height: 13.08vw;border-bottom: 1px solid #D6D6D6;font-family: 'Nanum Gothic', sans-serif;} #maincontents .add_mainvisual .noticebox > div{display: table-cell;width: 100%;padding: 0 6.31vw;padding-right: 0;box-sizing: border-box;vertical-align: middle;} #maincontents .add_mainvisual .noticebox > div h2{display: inline-block;font-size: 3.27vw;color: #000000;font-weight: bold;margin: 0;margin-right: 3.50vw;vertical-align: middle;} #maincontents .add_mainvisual .noticebox > div p{display: inline-block;width: 69.49vw;font-size: 3.27vw;color: #000000;letter-spacing: -0.2vw;margin: 0;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;vertical-align: middle;} #maincontents .add_container{padding-left: 6.31vw;box-sizing: border-box;font-family: 'Nanum Gothic', sans-serif;} #maincontents .add_container .add_mid_area{position: relative;padding-top: 9.35vw;box-sizing: border-box;} #maincontents .add_container .add_mid_area h1{display: inline-block;font-size: 5.14vw;font-weight: bold;color: #222222;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;text-align: left;margin-bottom: 3.74vw;} #maincontents .add_container .add_mid_area .mySlide2{width: 100%;height: auto;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list{width: 87.38vw;height: auto;margin-right: 2.34vw;box-sizing: border-box;background: #F9F9F9;padding: 7.48vw 8.64vw 9.35vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list h3{text-align: center;font-size: 3.27vw;font-weight: bold;color: #0C7EDE;margin-bottom: 9.34vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul{width: 100%;height: auto;margin: 0;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li{display: block;width: 100%;height: auto;border-bottom: 1px solid #D6D6D6;box-sizing: border-box;padding-bottom: 6.07vw;margin-top: 6.07vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li:first-child{margin-top: 0;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li:last-child{border-bottom: 0;padding-bottom: 0;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a{display: block;width: 100%;height: 100%;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div{display: inline-block;margin-bottom: 4.21vw;vertical-align: middle;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico{width: 17.29vw;height: 10.98vw;text-align: center;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img{display: inline-block;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img01{width: 10.74vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img02{width: 9.58vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img03{width: 8.41vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img04{width: 9.81vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img05{width: 10.98vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div.img_ico img.img06{width: 14.49vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div p{line-height: 6.07vw;font-size: 3.74vw;color: #000000;font-weight: 400;font-family: 'Nanum Gothic', sans-serif;margin: 0;letter-spacing: -0.2vw;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > div p span{font-weight: bold;} #maincontents .add_container .add_mid_area .mySlide2 .slide_list ul li a > button{display: block;width: 100%;height: 8.88vw;line-height: 7.98vw;text-align: center;letter-spacing: -0.2vw;font-size: 3.74vw;font-weight: 400;font-family: 'Nanum Gothic', sans-serif;background: #ffffff;border: 1px solid #515151;border-radius: 0.93vw;box-sizing: border-box;padding: 0;color: #000000;} #maincontents .add_container .add_mid_area ul.slick-dots{position: absolute;top: -7.31vw;right: 6.31vw;padding: 0;margin: 0;font-size: 0;} #maincontents .add_container .add_mid_area ul.slick-dots li{display: inline-block;float: none;width: auto;height: auto;margin: 0 0.70vw;} #maincontents .add_container .add_mid_area ul.slick-dots li button{display: block;width: 1.87vw;height: 1.87vw;background: #ffffff;border: 1px solid #000000;border-radius: 50%;font-size: 0;padding: 0;} #maincontents .add_container .add_mid_area ul.slick-dots li.slick-active button{background: #000000;} #maincontents .add_container .add_mid_area2{position: relative;padding-top: 9.35vw;box-sizing: border-box;} #maincontents .add_container .add_mid_area2 h1{display: inline-block;font-size: 5.14vw;font-weight: bold;color: #222222;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;text-align: left;margin-bottom: 3.74vw;} #maincontents .add_container .add_mid_area2 .payBox{position: relative;width: auto;height: auto;} #maincontents .add_container .add_mid_area2 .payBox > div{width: auto;} #maincontents .add_container .add_mid_area2 .payBox ul{position: relative;width: 100%;height: auto;margin: 0;} #maincontents .add_container .add_mid_area2 .payBox ul li{width: 87.38vw;height: 79.67vw;border: 0;border-radius: 2.34vw;margin-right: 2.34vw;background: url('/smc/resources/addImages/main/box_bg.png') no-repeat top center;padding: 6.64vw 10.75vw 6.78vw;text-align: center;box-sizing: border-box;background-size: 100% 100%;} #maincontents .add_container .add_mid_area2 .payBox ul li a{position: relative;display: block;width: 100%;height: 100%;text-decoration: none;} #maincontents .add_container .add_mid_area2 .payBox ul li a > span{display: inline-block;padding: 1.2vw 3.27vw;;border-radius: 1.40vw;border: 1px solid #979797;box-sizing: border-box;color: #636363;font-size: 3.04vw;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;} #maincontents .add_container .add_mid_area2 .payBox ul li a .logo{display: table;width: 100%;height: 11.68vw;margin: 3.27vw 0 2.27vw;} #maincontents .add_container .add_mid_area2 .payBox ul li a .logo p{display: table-cell;width: 100%;height: 100%;vertical-align: middle;text-align: center;overflow: hidden;} #maincontents .add_container .add_mid_area2 .payBox ul li a .logo p img{display: inline-block;max-height: 11.68vw;height: 100%;} #maincontents .add_container .add_mid_area2 .payBox ul li a .dataBox{width: 100%;padding-bottom: 3.67vw;border-bottom: 1px solid #D6D6D6;} #maincontents .add_container .add_mid_area2 .payBox ul li a .dataBox p.data_dec{width: 100%;font-size: 3.74vw;color: #000000;letter-spacing: -0.3vw;font-family: 'Nanum Gothic', sans-serif;margin-bottom: 0.64vw;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} #maincontents .add_container .add_mid_area2 .payBox ul li a .dataBox p.data_pay{width: 100%;font-size: 3.50vw;color: #0C7EDE;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;margin: 0;} #maincontents .add_container .add_mid_area2 .payBox ul li a .dataBox p.data_pay span{font-size: 6.07vw;font-weight: 700;color: #0C7EDE;letter-spacing: -0.2vw;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox{width: 100%;padding-top: 3.21vw;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p{width: 100%;margin-bottom: 1.50vw;font-size: 3.04vw;color: #000000;font-weight: 400;font-family: 'Nanum Gothic', sans-serif;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p:after{content: '';display: block;height: 0;clear: both;visibility: visible;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p:last-child{margin-bottom: 0;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p span{display: inline-block;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p span.tit{float: left;width: 12.29vw;font-weight: 700;text-align: left;} #maincontents .add_container .add_mid_area2 .payBox ul li a .subDataBox p span.data{float: right;width: 52.33vw;letter-spacing: -0.2vw;text-align: right;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} /* 2021 웹접근성 수정. 컨트롤영역 추가, 2023 상반기 접근성 수정 s */ #maincontents .add_container .add_mid_area2 .slide_control{display: flex; align-items:center; justify-content:center; position: absolute; bottom: -8.5vw; left: 0; width: 100%; text-align: center;} #maincontents .add_container .add_mid_area2 .slide_control .dots{display: inline-block; margin-right: 10px;} #maincontents .add_container .add_mid_area2 .slide_control .dots ul{margin: 0;} #maincontents .add_container .add_mid_area2 .slide_control button.auto{display: inline-block; width: 3.5vw; height: 3.5vw; border: none; background: no-repeat; font-size: 0; color:transparent; -webkit-appearance: none; appearance: none;} #maincontents .add_container .add_mid_area2 .slide_control button.auto.pause{background-image: url(/smc/resources/mobile/images/ic_stop.png); background-size: cover;} #maincontents .add_container .add_mid_area2 .slide_control button.auto.play{background-image: url(/smc/resources/mobile/images/ic_play.png); background-size: cover;} #maincontents .add_container .add_mid_area2 .slide_control ul.slick-dots li{display: inline-block;float: none;width: auto;height: auto;margin: 0 0.70vw;} #maincontents .add_container .add_mid_area2 .slide_control ul.slick-dots li button{display: block;width: 1.87vw;height: 1.87vw;background: #ffffff;border: 1px solid #000000;border-radius: 50%;font-size: 0;padding: 0;} #maincontents .add_container .add_mid_area2 .slide_control ul.slick-dots li.slick-active button{background: #000000;} @media screen and (max-width: 480px) { #maincontents .add_container .add_mid_area2 .slide_control button.auto {width: 20px; height: 20px;} } /* //2021 웹접근성 수정. 컨트롤영역 추가, 2023 상반기 접근성 수정 e */ #maincontents .add_container .add_mid_area3{position: relative;padding-top: 9.35vw;padding-right: 6.25vw;box-sizing: border-box;} #maincontents .add_container .add_mid_area3:after{content: '';display: block;height: 0;clear: both;visibility: visible;} #maincontents .add_container .add_mid_area3 h1{float: none;clear: both;display: inline-block;font-size: 5.14vw;font-weight: bold;color: #222222;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;text-align: left;margin-bottom: 3.74vw;} #maincontents .add_container .add_mid_area3 > a{float: right;display: inline-block;width: 11.92vw;vertical-align: top;text-align: right;margin-top: 1vw;} #maincontents .add_container .add_mid_area3 > a img{width: 100%;} #maincontents .add_container .add_mid_area3 .topDiv{float: none;clear: both;position: relative;margin-bottom: 4.91vw;} #maincontents .add_container .add_mid_area3 .topDiv p{display: inline-block;width: 100%;font-size: 3.04vw;font-weight: 400;color: #7E7E7E;font-family: 'Nanum Gothic', sans-serif;letter-spacing: -0.2vw;margin: 0;} #maincontents .add_container .add_mid_area3 ul{width: 100%;height: auto;font-size: 0;} #maincontents .add_container .add_mid_area3 ul li{display: inline-block;width: 40.65vw;vertical-align: top;margin-right: 6.07vw;} #maincontents .add_container .add_mid_area3 ul li:last-child{margin-right: 0;} #maincontents .add_container .add_mid_area3 ul li a{display: block;width: 100%;height: auto;} #maincontents .add_container .add_mid_area3 ul li p{width: 100%;color: #222222;font-family: 'Nanum Gothic', sans-serif;letter-spacing: -0.5px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;white-space: normal;line-height: 1.5;text-align: left;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} #maincontents .add_container .add_mid_area3 ul li p.img{width: 100%;border-radius: 0.93vw;margin-bottom: 3.50vw;overflow: hidden;} #maincontents .add_container .add_mid_area3 ul li p.img img{width: 100%;max-width: 100%;} #maincontents .add_container .add_mid_area3 ul li p.title{line-height: 5.11vw;font-size: 3.27vw;font-weight: 700;margin-bottom: 2.80vw;} #maincontents .add_container .add_mid_area3 ul li p.text{line-height: 4.67vw;font-size: 2.80vw;font-weight: 400;-webkit-line-clamp: 3;} #maincontents .add_container .add_mid_area4{position: relative;padding: 9.35vw 0;padding-right: 6.25vw;box-sizing: border-box;} #maincontents .add_container .add_mid_area4:after{content: '';display: block;height: 0;clear: both;visibility: visible;} #maincontents .add_container .add_mid_area4 h1{float: none;clear: both;display: inline-block;font-size: 5.14vw;font-weight: bold;color: #222222;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;text-align: left;margin-bottom: 3.74vw;} #maincontents .add_container .add_mid_area4 > a{float: right;display: inline-block;width: 11.92vw;vertical-align: top;text-align: right;margin-top: 1vw;} #maincontents .add_container .add_mid_area4 > a img{width: 100%;} #maincontents .add_container .add_mid_area4 .topDiv{float: none;clear: both;position: relative;margin-bottom: 4.91vw;} #maincontents .add_container .add_mid_area4 .topDiv p{display: inline-block;width: 100%;font-size: 3.04vw;font-weight: 400;color: #7E7E7E;font-family: 'Nanum Gothic', sans-serif;letter-spacing: -0.2vw;margin: 0;} #maincontents .add_container .add_mid_area4 ul{width: 100%;height: auto;font-size: 0;} #maincontents .add_container .add_mid_area4 ul li{display: block;width: 87.38vw;margin-bottom: 2.34vw;border-radius: 2.34vw;padding: 3.50vw 4.67vw;border: 1px solid #DFDFDF;box-sizing: border-box;} #maincontents .add_container .add_mid_area4 ul li:last-child{margin-bottom: 0;} #maincontents .add_container .add_mid_area4 ul li p{width: 100%;margin-bottom: 1.87vw;} #maincontents .add_container .add_mid_area4 ul li p span{display: inline-block;} #maincontents .add_container .add_mid_area4 ul li p span.ico{width: 16.36vw;margin-right: 3.27vw;vertical-align: top;} #maincontents .add_container .add_mid_area4 ul li p span.ico img{width: 100%;} #maincontents .add_container .add_mid_area4 ul li p span.date{font-size: 3.04vw;color: #7E7E7E;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;vertical-align: middle;} #maincontents .add_container .add_mid_area4 ul li a{display: block;width: 100%;font-size: 3.27vw;font-weight: 700;color: #222222;letter-spacing: -0.2vw;font-family: 'Nanum Gothic', sans-serif;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .add_container_monthly form .add_selectDiv2 .select dl dd select.btn_b{background: url('/smc/resources/addImages/mobile/icon/ico_select_b.png') no-repeat 95% center;background-size: 7.5px 5px !important;} .add_container_monthly form .add_selectDiv1 .select select.btn_w{background: url('/smc/resources/addImages/mobile/icon/ico_select_w.png') no-repeat 95% center;background-size: 7.5px 5px !important;} /* banner */ #banner01{position: relative;width: auto;height: auto;z-index: 9;padding: 0 12px 0 12px;box-sizing: border-box;} #banner02{position: relative;width: auto;height: auto;z-index: 9;padding: 0 12px 0 12px;box-sizing: border-box;} .banner{margin-bottom: 22.5px;} .banner ul{width: 100%;height: auto;font-size: 0;} .banner ul .slick-list{border: 1px solid #dcdcdc;box-sizing: border-box;} .banner ul li{display: inline-block;width: 100%;height: 100%;background: #fff;} .banner ul li a{display: block;width: 100%;height: 100%;padding: 14.5px 15.5px 15px;box-sizing: border-box;text-decoration: none;} .banner ul li a div{vertical-align: middle;} .banner ul li a div:after{content: '';display: block;clear: both;} .banner ul li a div.topDiv{width: 100%;position: relative;top: 0;left: 0;height: 30px;line-height: 30px;} .banner ul li a div.topDiv span{display: inline-block;float: left;font-size: 10px;font-weight: bold;color: #353535;} .banner ul li a div.topDiv span:last-child{float: right;} .banner ul li a div.middleDiv{width: 100%;display: inline-block;text-align: left;margin-bottom: 15px;} .banner ul li a div.middleDiv > div{float: left;} .banner ul li a div.middleDiv > div p.nameVal{font-size: 12px;font-weight: bold;color: #242424;margin-bottom: 5px;} .banner ul li a div.middleDiv > div p.nameVal span{display: inline-block;width: 47px;height: 23px;line-height: 22px;text-align: center;color: #353535;box-sizing: border-box;border: 1px solid #6e6e6e;border-radius: 3px;font-size: 10px;font-weight: 400;margin-right: 7px;} .banner ul li a div.middleDiv > div p.price{font-size: 13px;font-weight: bold;color: #002424;} .banner ul li a div.middleDiv > div p.price span{width: auto;font-size: 17px;color: #006ef4;vertical-align: bottom;} .banner ul li a div.middleDiv p.img{float: right;height: 30px;overflow: hidden;margin: 0;} .banner ul li a div.middleDiv p.img img{width: auto;height: 100%;} .banner ul li a div.bottomDiv{display: inline-block;} .banner ul li a div.bottomDiv p{font-size: 10px;color: #242424;letter-spacing: -0.3px;margin-bottom: 5px;} .banner ul li a div.bottomDiv p span{display: inline-block;width: 40px;font-size: 10px;color: #444444;font-weight: bold;vertical-align: top;} .banner ul li a div.bottomDiv p span.bottomDiv_con{width: auto;font-size: 10px;font-weight: normal;vertical-align: top;} .banner ul.slick-dots{width: 100%;height: auto;text-align: center;font-size: 0;margin-top: 15px;border: none;} .banner ul.slick-dots li{display: inline-block;width: 8px;height: 8px;background: #9b9b9b;margin-right: 5px;border-radius: 50%;} .banner ul.slick-dots li button{display: block;width: 100%;height: 100%;font-size: 0;} .banner ul.slick-dots li.slick-active{background: #0c7ede;} /* content */ .container .add_contentsarea{} .container .add_contentsarea h2{} .container .add_contentsarea .feecompare{} .container .add_contentsarea .feecompare .add_pageinfo{height: 143px;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox{width: 100%;padding: 0 12px 25px 12px;background: #fff;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox h3{margin: 20px 0;padding: 0 0 11px !important;font-size: 18px;font-weight: bold;} .container .add_contentsarea .feecompare .add_contentsbox p.txt{font-size: 13px;font-weight: bold;line-height: 16.5px;color: #222222;} .container .add_contentsarea .feecompare .add_contentsbox p.txt span{display: block;margin: 12.5px 0 19px;font-size: 13px;font-weight: 400;line-height: 16.5px;color: #444444;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset{width: 100%;border-radius: 15px;border: 2px solid #3793ff;background: #fff;box-sizing: border-box;margin: 0 0 15px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li{display: table;width: 100%;height: auto;padding: 20px 27px;vertical-align: middle;border-top: 0;border-bottom: 1px solid #e5e5e5;font-size: 0;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype{border-bottom: 0;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li h5{display: block;width: 59.5px;min-width: 59.5px;height: 100%;font-size: 14px;text-align: left;box-sizing: border-box;vertical-align: middle;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p{float: none;display: block;line-height: 20px;font-size: 10.5px;font-weight: bold;color: #222;box-sizing: border-box;vertical-align: middle;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input{width: 14px;height: 14px;vertical-align: middle;cursor: pointer;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p .input_wrap{display: inline-block; position: relative; padding-left: 2px;margin-right: 10px;vertical-align: middle;}/* 2021 웹접근성 수정 */ .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p .input_wrap label{cursor: pointer;}/* 2021 웹접근성 수정 */ .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio]:checked + label{color: #006ef4;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio]:disabled + label{color: #c7c7c7;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio]{position: absolute; top: 3px; left: 2px; width: 14px;height: 14px; opacity:0.1; appearance:none; -webkit-appearance: none;}/* 2021 웹접근성 수정 */ .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio] + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_off.png');background-size: 100% 100%;vertical-align: middle;margin-right: 2px;margin-top: -2px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio]:checked + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_on.png');background-size: 100% 100%;vertical-align: middle;margin-right: 2px;margin-top: -2px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li p input[type=radio]:disabled + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_disable.png');background-size: 100% 100%;vertical-align: middle;margin-right: 2px;margin-top: -2px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox{width: 260px;padding: 10px 0;overflow: hidden;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox span{display: block;font-size: 8px;color: #6b6b6b;font-weight: 400;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]{width: 100%;min-width: 100%;max-width: 100%;background: #ffffff;/* background: url('/smc/resources/addImages/range_bg.jpg') repeat-x 0 0;background-size: 5px 11px; */} /* .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]::-ms-track{width: 100%;cursor: pointer;background: #ffffff;background: url('/smc/resources/addImages/range_bg.jpg') repeat-x 0 0;background-size: 5px 11px;border-color: transparent;color: transparent;} */ .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]:focus{outline: none;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]::-webkit-slider-thumb{/* -webkit-appearance: none; */background: #ffffff;cursor: pointer;height: 11.5px;width: 11.5;/* margin-top: -11px; */border-radius: 3px;border: 1px solid #2077e1;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]::-moz-range-thumb{/* -webkit-appearance: none; */background: #ffffff;cursor: pointer;height: 11.5;width: 11.5;/* margin-top: -11px; */border-radius: 3px;border: 1px solid #2077e1;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox input[type=range]::-ms-thumb{/* -webkit-appearance: none; */background: #ffffff;cursor: pointer;height: 11.5;width: 11.5;/* margin-top: -11px; */border-radius: 3px;border: 1px solid #2077e1;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks{display: block;font-size: 0;margin-top: 5px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span{position: relative;display: inline-block;line-height: 14px;font-size: 7.5px;color: #222222;white-space: normal;vertical-align: top;text-align: center;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span::before{display: block;content: '';width: 1px;height: 5px;background: #222222;margin: 0 auto;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData01{left: 0;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData02{left: 30px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData03{left: 55px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData04{left: 77px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData05{left: 100px;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks span.basicData06{left: 123px;} /* .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.basicDataBox #tickmarks option::after{content: '';position: absolute;top: -27px;left: 50%;width: 2px;height: 23px;background: #2077e1;} */ .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.line2.btninner{padding-top: 0;} .container .add_contentsarea .feecompare .add_contentsbox ul.conditionsset li.feetype p.line2.btninner label{margin-right: 7.5px;margin-top: 0;} .container .add_contentsarea .feecompare .add_contentsbox .btn_compareok{float: none;width: 100%;font-size: 0;text-align: center;margin:0 0 22px} .container .add_contentsarea .feecompare .add_contentsbox .btn_compareok button{display: inline-block;width: 102px;height: 40px;border-radius: 2.5px;font-size: 13px;font-family: ngb;font-weight: bold;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox .btn_compareok button.btn_reset{color: #424242;background: url('/smc/resources/addImages/btn/btn_reset.png') repeat-x 0 0;border: 1px solid #c5c5c5;margin-right: 20px;} .container .add_contentsarea .feecompare .add_contentsbox .btn_compareok button.btn_h40_bl{color: #fff;background: url('/smc/resources/addImages/btn/btn_h40_bl.png') repeat-x 0 0;border: 1px solid #166ad2;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox{} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox h4{height: auto;background: none;padding: 0;margin: 0 0 13.5px;font-size: 13px;font-weight: bold;color: #222222;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .font_13_444_dot{line-height: 16.5px;background: none;padding: 0;font-size: 13px;color: #444444;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox{width: 100%;height: auto;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box{width: 100%;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul{display: table;width: 100%;margin: 26.5px 0 20px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li{display: table-cell;width: 50% !important;height: 31.5px;border-radius: 10px 10px 0 0;vertical-align: middle;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.comm{border: 1px solid #297add;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.mvno{border: 1px solid #1f9401;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.comm.on{background: #297add;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.mvno.on{background: #1f9401; border:1px solid #1f9401 !important;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li a{display: block;width: 100%;height: 100%;line-height: 31.5px;font-size: 11px;font-weight: bold;text-align: center;border-radius: 10px 10px 0 0;text-decoration: none;background: transparent;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.comm a{color: #297add;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.mvno a{color: #1f9401;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.comm.on a, .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .tab_box ul li.mvno.on a{color: #fff;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mnoSelect, .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mvnoSelect{font-size: 0;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mnoSelect select, .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mvnoSelect select{-webkit-appearance: none;width: 79.8px;height: 27px;padding: 0 5px;border: 1px solid #d5d5d5;border-left: 0;box-sizing: border-box;font-size: 10.5px;font-weight: bold;color: #444444;background: url('/smc/resources/addImages/icon/ico_select.png') no-repeat 90% center;background-size: 8px 5px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mnoSelect select:first-child, .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .mvnoSelect select:first-child{border-left: 1px solid #d5d5d5;} /* .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox{line-height: 37px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox a{display: inline-block;margin-right: 16px;font-size: 13px;font-weight: bold;color: #9d9d9d;text-decoration: none;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox a:last-child{margin-right: 0;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox a.selectoption{color: #242424;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox a:before{display: inline-block;content: '';width: 10px;height: 9px;margin-right: 6px;background: url('/smc/resources/addImages/icon/ico_sortChk_off.png') no-repeat top center;background-size: 100% 100%;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .sortBox a.selectoption:before{display: inline-block;content: '';width: 10px;height: 9px;margin-right: 6px;background: url('/smc/resources/addImages/icon/ico_sortChk_on.png') no-repeat top center;background-size: 100% 100%;} */ .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents{margin-top: 20px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .feeresulttable{} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone{width: 100%;height: auto;background: none;margin-bottom: 10px;border: 0;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a{display: block;width: 100%;height: 100%;padding: 20px 15px;border: 1px solid #d5d5d5;box-sizing: border-box;text-decoration: none;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table{width: 100%;height: 100%;border: none;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr{width: 100%;height: auto;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td{height: 100%;height: auto;padding: 0;border: 0;vertical-align: middle;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.mvno_logo{border: none;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.mvno_logo p img{max-width: 100%;max-height: 35px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo{line-height: 1;font-size: 25px;font-weight: bold;color: #006ef4;padding-left: 12.5px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo p{display: block;font-size: 13px;font-weight: bold;color: #222222;margin-bottom: 7.5px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo p:last-child{font-size: 14px;color: #006ef4;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo ul{position: unset;bottom: 0;right: 0;display: inline-block;vertical-align: middle;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo ul li{font-size: 10px;padding: 5px 10px;border-color: #b2b2b2;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo ul li:first-child{border-left: 1px solid #b2b2b2;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01{padding-top: 10px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p{font-size: 11.5px;margin: 0;margin-bottom: 5px;padding: 0 0 0 28px;color: #464646;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type01{background: url('/smc/resources/addImages/icon/ico_type01.png') no-repeat 2% center;background-size: 8.5px 9px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type02{background: url('/smc/resources/addImages/icon/ico_type02.png') no-repeat 2% center;background-size: 9px 9px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type03{margin-bottom: 0;background: url('/smc/resources/addImages/icon/ico_type03.png') no-repeat 2% center;background-size: 10px 7px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p span{display: inline-block;width: 40px;font-weight: bold;color: #242424; font-size:12px;} .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents.mvno .savephone a table tbody tr td.payinfo p.mvnoprice{display: inline-block;font-size: 14px;color: #1f9401;} /* .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .feeresultlist_save{margin: 40px 0 20px;text-align: center;font-weight: bold;font-size: 11px;} */ /* 2021 웹접근성 수정. 컨트롤 영역 추가 */ .container .add_contentsarea .feecompare .slide_control{display: flex; align-items:center; justify-content:center; width: 100%; margin-top: 2vw; text-align: center;} .container .add_contentsarea .feecompare .slide_control .dots{display: inline-block; margin-right: 10px;} .container .add_contentsarea .feecompare .slide_control .dots ul{margin: 0;} .container .add_contentsarea .feecompare .slide_control button.auto{display: inline-block; width: 26px; height: 26px; border: none; background: no-repeat; font-size: 0; color:transparent; -webkit-appearance: none; appearance: none;} .container .add_contentsarea .feecompare .slide_control button.auto.pause{background-image: url(/smc/resources/mobile/images/ic_stop_blue.png);} .container .add_contentsarea .feecompare .slide_control button.auto.play{display: none; background-image: url(/smc/resources/mobile/images/ic_play_blue.png);} /* //2021 웹접근성 수정. 컨트롤 영역 추가 */ .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li {width:100%; padding:0; box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li h5 { display: table-cell; width:78px; min-width:78px; padding:13px 0 14px 18px; background:#f9f9f9;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap {display: table-cell; padding:13px 15px;box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap p label {float:left; display:block; padding-left: 0;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap p:after {content:''; clear: both; display: block;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .basicDataBox select {-webkit-appearance: none; width:237px; height: 31px; padding: 0 5px 0 10px;border: 1px solid #d5d5d5 !important;border-left: 0;box-sizing: border-box;font-size: 13px;color: #444444;background: url('/smc/resources/addImages/icon/ico_select.png') no-repeat 95% center;background-size: 8px 5px; box-sizing: border-box;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .membertype_area {width:220px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .membertype_area label:nth-child(8) {margin-right: 0;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .feetype_area {width:240px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .feetype_area label {width:80px; margin-right:0 !important;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap p input[type=radio] + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_off.png');background-size: 100% 100%;vertical-align: middle;margin-right: 3.5px;margin-top: -2px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap p input[type=radio]:checked + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_on.png');background-size: 100% 100%;vertical-align: middle;margin-right: 3.5px;margin-top: -2px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap p input[type=radio]:disabled + label::before{display: inline-block;content: '';width: 14px;height: 14px;background: none;background-image: url('/smc/resources/addImages/icon/ico_checked_disable.png');background-size: 100% 100%;vertical-align: middle;margin-right: 3.5px;margin-top: -2px;} /* 요금제 검색 결과 */ /* 2023-12-08, 2023-12-13 수정 s */ .container .add_contentsarea .feecompare .add_contentsbox_hwa {} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .mnoSelect {width: calc(100% - 150px);} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .mvnoSelect {width:calc(100% - 150px);;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .mnoSelect select, .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .mvnoSelect select {width:25%} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .selinfo {width: 150px; padding:0;} /* // 2023-12-08, 2023-12-13 수정 e */ .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.payinfo {padding-left: 0;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p {padding: 0 0 0 22.5px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type01{background: url('/smc/resources/addImages/icon/ico_type01.png') no-repeat 0 center;background-size: 10.5px 11px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type02{background: url('/smc/resources/addImages/icon/ico_type02.png') no-repeat 0 center;background-size: 12px 12px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 p.type03{margin-bottom: 0;background: url('/smc/resources/addImages/icon/ico_type03.png') no-repeat 0 center;background-size: 12px 8px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddencontents .savephone a table tbody tr td.mvno_logo p {text-align:center;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddenwrap .bottxt {text-align: right; font-size: 8px; margin:10px 0 12px !important;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddenwrap .moreBox {width: 100%; text-align: center; margin: 0 0 21px;} .container .add_contentsarea .feecompare .add_contentsbox_hwa .fee_resultbox .hiddenwrap .moreBox .moreBtn {display: inline-block; width:122.5px; height:32.5px; line-height: 32.5px; border: 1px solid #8a8a8a; text-align: center; font-size:11px; font-weight: bold; box-sizing: border-box; border-radius: 25px; text-decoration: none;} @media screen and (max-width: 360px) { .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .membertype_area {width:auto;} .container .add_contentsarea .feecompare .add_contentsbox_hwa ul.conditionsset li .type_wrap .feetype_area {width:auto;} } /* 이용패턴 기반 요금제 */ .container .contentsarea .add_contentsbox h3 {margin: 20px 0 0; padding:0 !important; border-bottom: 1px solid #444;} .container .contentsarea .add_contentsbox .feerecbox .font_13b_444 {margin-bottom: 20px;font-size: 15px; letter-spacing: -1px;} .feerecommend .add_fee_tabbox .fee_type_year, .feerecommend .add_fee_tabbox .fee_type_device, .feerecommend .add_fee_tabbox .fee_type_agreed, .feerecommend .add_fee_tabbox .fee_type_goods, .feerecommend .add_fee_tabbox .fee_type_service, .feerecommend .add_fee_tabbox .fee_type_network {position: relative; height:76.5px; padding:20px 0 0 99px; box-sizing: border-box;} .feerecommend .add_fee_tabbox .fee_type_voice, .feerecommend .add_fee_tabbox .fee_type_data, .feerecommend .add_fee_tabbox .fee_type_sms {position: relative; height:70px; padding:20px 0 0 99px; box-sizing: border-box;} .feerecommend .add_fee_tabbox .fee_type_device {border-bottom: 1px solid #ddd;} .feerecommend .add_fee_tabbox .fee_type_year:after, .feerecommend .add_fee_tabbox .fee_type_device:after, .feerecommend .add_fee_tabbox .fee_type_agreed:after, .feerecommend .add_fee_tabbox .fee_type_voice:after, .feerecommend .add_fee_tabbox .fee_type_data:after, .feerecommend .add_fee_tabbox .fee_type_sms:after, .feerecommend .add_fee_tabbox .fee_type_network:after, .feerecommend .add_fee_tabbox .fee_type_goods:after {content:''; clear: both; display: block;} .feerecommend .add_fee_tabbox .fee_type_text {margin-top: 15px; font-size: 14px;} .feerecommend .add_fee_tabbox h5 strong {font-size:15px; padding: 4px 0 0 30px; letter-spacing: -2px; box-sizing: border-box;} .feerecommend .add_fee_tabbox h5 strong.year {background:url('/smc/resources/images/mobile/icon/icon_fc_01.png') no-repeat 0 0; background-size:24px 21.5px} .feerecommend .add_fee_tabbox h5 strong.service {background:url('/smc/resources/addImages/mobile/icon/icon_fc_15.png') no-repeat 0 3px; background-size:21.5px 15.5px} .feerecommend .add_fee_tabbox h5 strong.device {background:url('/smc/resources/addImages/mobile/icon/icon_fc_16.png') no-repeat 0 0; background-size:17.5px 27.5px} .feerecommend .add_fee_tabbox h5 strong.agreed {background:url('/smc/resources/images/mobile/icon/icon_fc_03.png') no-repeat 0 0; background-size:24px 21.5px} .feerecommend .add_fee_tabbox h5 strong.agency {background:url('/smc/resources/images/mobile/icon/icon_fc_07.png') no-repeat 0 0} .feerecommend .add_fee_tabbox h5 strong.member {background:url('/smc/resources/images/mobile/icon/icon_fc_08.png') no-repeat 0 0} .feerecommend .add_fee_tabbox h5 strong.product {background:url('/smc/resources/images/mobile/icon/icon_fc_02.png') no-repeat 0 0} .feerecommend .add_fee_tabbox h5 strong.voice {background:url('/smc/resources/images/mobile/icon/icon_fc_04.png') no-repeat 0 0; background-size:24px 21px} .feerecommend .add_fee_tabbox h5 strong.data {background:url('/smc/resources/images/mobile/icon/icon_fc_05.png') no-repeat 0 0; background-size:24px 21px} .feerecommend .add_fee_tabbox h5 strong.sms {background:url('/smc/resources/images/mobile/icon/icon_fc_06.png') no-repeat 0 0; background-size:24px 21px} .feerecommend .add_fee_tabbox ul.fee_tabbox_sub {margin: 0;} .feerecommend .add_fee_tabbox ul.fee_tabbox_sub li {height: 35px; line-height: 35px;} .feerecommend .add_fee_tabbox ul.fee_tabbox_sub li a {height: 30px; line-height: 30px;} .feerecommend .add_fee_tabbox .fee_type_year ul.fee_tabbox_sub li a {height: 30px; line-height: 15px;} .feerecommend .add_fee_tabbox .fee_type_device ul.fee_tabbox_sub li a {height: 30px; line-height:30px;} .feerecommend .add_fee_tabbox p.insertbox {margin: 0;} .feerecommend .add_fee_tabbox .fee_type_agreed ul.fee_tabbox_sub li {width: 33.3%;} .feerecommend .add_fee_tabbox .fee_type_goods ul.fee_tabbox_sub li {width: 50%;} .feerecommend .add_fee_tabbox .fee_btnset {height:38px;} .feerecommend .add_fee_tabbox .fee_btnset a {height:38px;} /* .add_contentsarea .banner ul li a::after {content: ''; clear: both; display: block;}fee_type_goods .add_contentsarea .banner ul li a div.middleDiv {float: left;} .add_contentsarea .banner ul li a div.bottomDiv {float: left; width:52%} .add_contentsarea .banner ul li a div.bottomDiv .bottomDiv_title {display: inline-block;width: 40px;font-size: 10px;color: #444444;font-weight: bold;vertical-align: top;} .add_contentsarea .banner ul li a div.bottomDiv .bottomDiv_con {display: inline-block;width: 129px;font-size: 10px;color: #444444;font-weight: normal;vertical-align: top;} */ /* 월납부액 계산하기 */ .add_container_monthly .contentsarea .contentsbox h3 {} .add_container_monthly .contentsbox .mtTit {font-size: 13px; font-weight: bold; color:#222222;line-height: 16.5px;} .add_container_monthly .contentsbox .add_mt25 {margin-top:24px; font-size:13px; color:#666666;line-height: 16.5px;} .add_container_monthly .contentsbox .mpRed {font-size:13px; color:#ff0000;line-height: 16.5px;} .add_container_monthly form {width:100%; margin:20px auto 36px;} .add_container_monthly form:after {content:''; width:100%; height: 55px; background: #2077e1; border-top-left-radius:5px; border-top-right-radius:5px;} .add_container_monthly form .add_selectDiv1 {width:100%; height: 55px; background: #2077e1; border-bottom: none; border-top-left-radius:5px; border-top-right-radius:5px;box-sizing: border-box;} .add_container_monthly form .add_selectDiv1 .select {float: none; width:89.2%; margin:13px auto 0; text-align: center;} .add_container_monthly form .add_selectDiv1 .select select {float: left; width:30%; height:25px; margin:0; line-height: 25px; background:#2077e1; border:none; border-bottom: 1px solid #fff; font-size: 14px; color:#fff; font-weight: bold;} .add_container_monthly form .add_selectDiv1 .select select option{color: #444444;} .add_container_monthly form .add_selectDiv1 .select select:nth-child(2) {margin:0 5%;} .add_container_monthly form .add_selectDiv2 {width:100%; margin:0 auto; background:#fff; border:2.5px solid #2077e1; border-top:none; border-bottom-left-radius:5px; border-bottom-right-radius:5px; box-sizing: border-box;} .add_container_monthly form .add_selectDiv2 .select {float: none; width:89.2%; margin:0 auto; padding:16px 0 19px; text-align: center;} .add_container_monthly form .add_selectDiv2 .select dl {display: block; width:100%; height:31px; margin-bottom: 12px;} .add_container_monthly form .add_selectDiv1 .select dl:after {content: ''; clear: both; display: block;} .add_container_monthly form .add_selectDiv2 .select dl:last-child {margin-bottom: 0;} .add_container_monthly form .add_selectDiv2 .select dl dt, .add_container_monthly form .add_selectDiv2 .select dl dd {float: left; display: block; height:31px;} .add_container_monthly form .add_selectDiv2 .select dl dt {width: 24.8%; line-height: 31px; font-size:14px; text-align: left; font-weight: bold; color:#222222; } .add_container_monthly form .add_selectDiv2 .select dl dd {width: 75.2%;} .add_container_monthly form .add_selectDiv2 .select dl dd:after {content: ''; clear: both; display: block;} .add_container_monthly form .add_selectDiv2 .select dl dd select {width:100%; height:31px; line-height: 31px; padding-left: 10px; font-size: 11.5px;} .add_container_monthly form .add_selectDiv2 .select dl dd select option {color:#444; font-weight: 400;} .add_container_monthly form .add_selectDiv2 .select dl dd select ooption[value=""] {color:#444; font-weight: 400;} .add_container_monthly form .add_selectDiv2 .select dl dd input {width:100%; height:31px; line-height: 31px; font-size: 11.5px; box-sizing: border-box;} .add_container_monthly form .add_selectDiv2 .select dl dd .input_text {float:left; display: block; width:66%; height: 31px; line-height: 31px; padding-left:10px; border-radius:4px; font-weight: bold; border-top-right-radius:0; border-bottom-right-radius:0; border:1px solid #dddddd; vertical-align: middle; font-size:11.5px; color:#2077e1; box-sizing: border-box; } .add_container_monthly form .add_selectDiv2 .select dl dd .input_text::-ms-input-placeholder, .add_container_monthly form .add_selectDiv2 .select dl dd .input_text::-webkit-input-placeholder, .add_container_monthly form .add_selectDiv2 .select dl dd .input_text::-moz-placeholder { color: #848484; font-weight: normal !important;} .add_container_monthly form .add_selectDiv2 .select dl dd button {float:left; display: block; margin-left: -1.5%; width:35.4%; height: 31px; border-radius: 4px; border:1px solid #707070; color:#6f6f6f; font-size:11.5px; font-weight: bold; background: #fff; box-sizing: border-box;} .add_container_monthly form .add_selectDiv2 .select dl dd .input_part {float:left; display: block; width:45.9%; } .add_container_monthly form .add_selectDiv2 .select dl dd .gap_text {float:left; display: block; width:8.1%; text-align: center; font-size: 14px; font-weight: bold; color:#222; height: 31px; line-height: 31px;} .add_container_monthly form .add_selectDiv2 .select dl dd .input_part input {width:100%;padding-left:10px; border-radius:4px; font-weight: bold; border:1px solid #dddddd; } .add_container_monthly form .btn_compareok {float: none; width: 100%; font-size: 0;text-align: center; margin:20px 0 0} .add_container_monthly form .btn_compareok button, .add_container_monthly form .btn_compareok a {display: inline-block;width: 102px;height: 40px;border-radius: 2.5px;font-size: 13px;font-family: ngb;font-weight: bold;box-sizing: border-box;} .add_container_monthly form .btn_compareok .btn_reset{color: #424242;background: url('/smc/resources/addImages/btn/btn_reset.png') repeat-x 0 0;border: 1px solid #c5c5c5;margin-right: 20px;} .add_container_monthly form .btn_compareok .btn_dandongsch {color: #fff;background: url('/smc/resources/addImages/btn/btn_h40_bl.png') repeat-x 0 0;border: 1px solid #166ad2;} .add_container_monthly .sns_wrap {text-align: right; font-size: 0;} .add_container_monthly .sns_wrap a {display:inline-block; width:21.5px; height: 21px; font-size: 0;} .add_container_monthly .sns_wrap a:nth-child(2) {margin:0 2px 0 2.5px;} .add_container_monthly .sns_wrap a:last-child {margin-left: 2px;} .add_container_monthly .sns_wrap a img {width:100%;} /* 팝업 */ .popupwrap.monthlyPopup {width:80% !important; top:20% !important; margin:0 0 0 -40%; border:1px solid #444 !important;} .monthlyPopup h1.monthlyPopup_title {height:46px;line-height: 46px; padding: 0 15px; font-size:15px; background: #f3f3f3 !important; box-sizing: border-box; border:none;} .monthlyPopup .popcontents {padding:0 15px;border: 0;} .monthlyPopup .popcontents .monthlyPopupInner {width:100%; height:270px; margin:18px 0 16px ; box-sizing:border-box; overflow-y: auto;} .monthlyPopup .popcontents .monthlyPopupInner h1.monthlyValue {height:35px;line-height: 35px;padding: 0 7.5px; margin-bottom: 8px;border: 1px solid #d5d5d5; border-radius: 5px; color:#585858; font-size: 11.5px; font-weight: bold; background: #fff;box-sizing: border-box; } .monthlyPopup .popcontents .monthlyPopupInner h1.monthlyValue:last-child {margin: 0;} .monthlyPopup .popcontents .monthlyPopupInner h1.click { border: 1px solid #96bff1; color:#2077e1; background: #fff !important; font-weight: bold;} .monthlyPopup .popcontents .mothlybtn {width:100%; display: block; height:31.5px; margin:0 auto 12px; text-align: center;} .monthlyPopup .popcontents .mothlybtn button {width:105px; height:31.5px; margin: 0 auto ; text-align: center; background-color:#2077e1; border: 1px solid #2077e1; border-radius: 5px; color: #fff; font-size:12.5px; font-weight: bold;} .monthlyPopup .btn_modalclose {position: absolute; right:3.2%; top:16px; width: 14.5px; height: 14.5px; background: url('/smc/resources/addImages/mobile/icon/icon_layerclose_02.png') no-repeat 50% 50%;text-indent: -99999px;background-size: 100% 100%;} /* 결과 화면 */ .add_container_monthly .add_serchResult {} .add_container_monthly .add_serchResult .termsBox {width: 100%; margin-bottom:33px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area {display: block; width:100%; height: 155px; border-radius: 5px; border:2px solid #2077e1; box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .top_title_group {width: 100%; height: 36.5px; margin-top: 0; background: #f5f9fd; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box; } .add_container_monthly .add_serchResult .termsBox.termsBox_all .terms_top_area .top_title_group { padding:10px 4.1% 0 4.1%;} .add_container_monthly .add_serchResult .termsBox.termsBox_noPay .terms_top_area .top_title_group { padding:10px 4.1% 0 4.1%;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .top_title_group .title_text {font-size: 13px; font-weight: bold; color: #2077e1; letter-spacing: -0.5px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .top_title_group .sub_text {display: inline-block;font-size: 13px; font-weight: 400; color: #464646; letter-spacing: -0.5px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group {width: 100%; padding:0 4.1%; height: 116.5px;box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group:after {content: ''; clear: both; display: block;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .img_box {float:left; display: block; width:77px; margin-right:17px ; text-align: center;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .img_box img {width:100%; margin: 12px auto 0;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box {float:left; display: block; width:226px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box:after {content: ''; clear: both; display: block;} .add_container_monthly .add_serchResult .termsBox.termsBox_all .terms_top_area .bottom_cont_group .cont_box { margin-top: 30px;} .add_container_monthly .add_serchResult .termsBox.termsBox_noPay .terms_top_area .bottom_cont_group .cont_box { margin-top: 32px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl {float:left; display: block; margin-bottom:11px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:after {content: ''; clear: both; display: block;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:last-child {margin-bottom: 0;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl dt, .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl dd {float: left; display: block; font-size: 12px; letter-spacing: -1px;box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:nth-child(odd) {width:62.1%} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:nth-child(even) {width:37.9%; vertical-align: top;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:nth-child(odd) dt {width:30.7%;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl:nth-child(even) dt {width:47%;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl dt {font-weight: bold; color: #222222;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl dd {margin-left: 0; font-weight: 400; color: #464646} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area {display: block; width:100%; height: auto; margin-top:15px;border-radius: 5px; border:2px solid #2077e1;box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .top_title_group {width: 100%; height: 36.5px; margin-top: 0; padding:10.5px 0 0 4.1%; background: #f5f9fd; border-top-left-radius: 5px; border-top-right-radius: 5px; box-sizing: border-box; font-size: 0;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .top_title_group .agency_text {display:inline-block; width:43px; height: 16.5px; margin-right: 8px; line-height: 15.5px; border: 1px solid #b2b2b2; background: #fff; text-align: center; font-size: 10px; font-weight: bold; color: #222222; letter-spacing: -1px;box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .top_title_group .title_text {display:inline-block; font-size: 13px; color: #222222; font-weight: bold; letter-spacing: -0.5px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group {padding:13px 4.1% 0 ;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_title {margin-bottom: 14px; font-size: 14px; color: #242424; font-weight: bold;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box {} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl {display: block; width: 100%; margin-bottom: 11px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl:after {content: ''; clear: both; display: block;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl:last-child {margin-bottom: 13px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dt {float: left; display: block; width: 58px; padding-left: 19px; font-size: 12px; color: #242424; font-weight: bold;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dt.type01{background: url('/smc/resources/addImages/icon/ico_type01.png') no-repeat 0 center;background-size: 8.5px 9px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dt.type02{background: url('/smc/resources/addImages/icon/ico_type02.png') no-repeat 0 center;background-size: 9px 9px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dt.type03{margin-bottom: 0;background: url('/smc/resources/addImages/icon/ico_type03.png') no-repeat 0 center;background-size: 10px 7px;} .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dd {float: left; display:block; min-width:195px; font-size: 12px; font-weight: 400; color: #464646;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} .add_container_monthly .add_serchResult .moreBox{text-align: center;} .add_container_monthly .add_serchResult .moreBox a{display: inline-block;width: 102px;height: 40px;line-height: 38px;border-radius: 2.5px;font-size: 13px;font-family: ngb;font-weight: bold;box-sizing: border-box;color: #fff;background: url(/smc/resources/addImages/btn/btn_h40_bl.png) repeat-x 0 0;border: 1px solid #166ad2;} .add_container_monthly .termsBox_noMobile .terms_top_area {background:#f0f0f0; height:57.5px !important; border:2px solid #f0f0f0 !important; display: table !important;} .add_container_monthly .termsBox_noPay .terms_bottom_area {background:#f0f0f0; height:57.5px !important; border:2px solid #f0f0f0 !important; display: table !important;} .add_container_monthly .termsBox .no_text { display: table-cell; vertical-align: middle; text-align: center; font-size: 10px; font-weight: bold; color:#9e9e9e;} /* table 영역*/ .add_container_monthly .add_resultBoard {width:100%; margin-bottom:15px; border-radius: 5px; border: 1px solid #cbcbcb; border-top:none;} .add_container_monthly .add_resultBoard .scCon {position: relative; height:62px; margin:0 !important; padding:12px 4.1% 13px; background: #f5f9fd; border-top-left-radius: 5px; border-top-right-radius: 5px; border: 1px solid #cbcbcb; border-bottom: none; border-left: none; border-right: none; box-sizing:border-box ;} .add_container_monthly .add_resultBoard .scCon .agencyBox_area {position: relative; left:0; width:78px; border:1px solid #bfc0c1; background-color: #fff; font-size: 10px; color:#222 ; text-align: center;} .add_container_monthly .add_resultBoard .scCon .agencyBox_area:after {content: ''; clear: both; display: block;} .add_container_monthly .add_resultBoard .scCon .agencyBox_area .agencyBox_left {float: left; display: block; width:43px; height:16.5px; line-height: 16.5px; font-size:10px; font-weight: bold;} .add_container_monthly .add_resultBoard .scCon .agencyBox_area .agencyBox_right {float: left; display: block; width:34px; height:16.5px; line-height: 16.5px; border-left:1px solid #eaeaea ; font-size:10px; font-weight: bold;} .add_container_monthly .add_resultBoard .scCon .title_area {position: absolute; width: 100%; padding:0 4.1%; left:0; top:37.5px; font-size: 12px; font-weight: bold; box-sizing: border-box;} .add_container_monthly .add_resultBoard .scCon .title_area .title_text {float:left; color:#222; letter-spacing: -1px;} .add_container_monthly .add_resultBoard .scCon .title_area .payTxt {float:right; color:#006ef4; letter-spacing: -1px;} .add_container_monthly .add_resultBoard .notice_box {margin:12px 0 5px; padding:0 4.1%;} .add_container_monthly .add_resultBoard .notice_text {padding-left: 13px; background: url('/smc/resources/addImages/mobile/icon/icon_notice.png') no-repeat 0 center;background-size: 8.5px 12px; color:#464646; font-size:10px; font-weight:400;} .add_container_monthly .add_resultBoard .resultMP_Table { width:91.8%; margin:0 auto 14px; overflow: auto; box-sizing: border-box;} .add_container_monthly .add_resultBoard .resultMP_Table .table_wrap { width:100%; min-width:650px;} .add_container_monthly .add_resultBoard table {width: 100%;table-layout:fixed; white-space:nowrap; border-top: 1px solid #2077e1; border-collapse:collapse;} .add_container_monthly .add_resultBoard table th {font-size: 12px; color:#222222; border-collapse:collapse;} .add_container_monthly .add_resultBoard table td {font-size: 12px; color:#222222; padding-top: 8px; padding-bottom: 6px;border-collapse:collapse;} .add_container_monthly .add_resultBoard table thead th {height: 30px; border-top: 1px solid #2077e1; border-bottom: 1px solid #ddd;} .add_container_monthly .add_resultBoard table thead th, .add_container_monthly .add_resultBoard table thead td {font-size: 12px; color:#222222; font-weight: 400;} .add_container_monthly .add_resultBoard table tbody tr.thead th {height: 30px; border-top: 1px solid #2077e1; border-bottom: 1px solid #ddd;border-right: 1px solid #dddddd;} .add_container_monthly .add_resultBoard table tbody tr.thead th:last-child{border-right: 0;} .add_container_monthly .add_resultBoard table tbody tr.thead th, .add_container_monthly .add_resultBoard table tbody tr.thead td {font-size: 10px; color:#222222; font-weight: 400;background: #f6f6f6;} .add_container_monthly .add_resultBoard table tbody tr.thead:first-child th:first-child{background: #ffffff;} .add_container_monthly .add_resultBoard table tbody td {height: 25px; border-top: none; border-bottom: 1px solid #ddd;padding: 0;} .add_container_monthly .add_resultBoard table th:last-child, .add_container_monthly .add_resultBoard table td:last-child {border-right: none;} .add_container_monthly .add_resultBoard table td.selectTd {background-color: #f5f9fd !important;color: #77a4f7;} .add_container_monthly .add_resultBoard table td.selectTd a {color: #77a4f7;font-size: 12px;text-decoration: underline;} .add_container_monthly .add_resultBoard table td a {color:#222222; font-size: 12px;} .add_container_monthly .add_resultBoard table thead th {} .add_container_monthly .devicesupport .cautionbox {padding:17px 4.5% 18px 4.5%;} .add_container_monthly .devicesupport .cautionbox h5 {height: auto; margin:0 0 10px; padding:0; background: none; font-size: 11px;} .add_container_monthly .devicesupport .cautionbox ul li {background: url(/smc/resources/images/mobile/icon/icon_3x3_666.gif) no-repeat 0 7px; background-size: 3px 3px; font-size: 11px;} @media screen and (max-width: 360px){ .add_container_monthly .add_resultBoard .scCon {height:70px;} } @media screen and (max-width:768px) { .add_container_monthly .add_resultBoard .resultMP_Table .table_wrap {overflow-x:auto; } } /* 20210518 수정사항 table 글자 bold 처리 */ .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .top_title_group .title_text {color:#2077e1} .add_container_monthly .add_resultBoard .resultMP_Table .table_wrap table th.bold_text, .add_container_monthly .add_resultBoard .resultMP_Table .table_wrap table td.bold_text {font-weight:bold;} /* 월납부액 비교하기 */ .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group {width: 100%; padding:0 4.1%; display: table;height: 116.5px; box-sizing: border-box;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap {display: table-cell; width: 100%; vertical-align: middle;font-size: 0;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap .img_box {float:none; display: inline-block; width:57px; margin:0; text-align: left;vertical-align: middle;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap .img_box img {max-height:85px; width:auto; max-width: 100%; margin:0;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap .cont_box {float:none; display: block; width:228px; display: inline-block; margin:0 0 0 19px ; vertical-align: middle;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl {float: none; display: inline-block;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .cont_box dl dt {} .add_container_monthly .resultBoard2 table tbody th .gudie_box {display: inline-block; width: 80px; box-sizing: border-box; margin: 7px 3px 0; font-size: 8px; padding:5px 10px; border:1px solid #b2b2b2;} .add_container_monthly .resultBoard2 table thead th {background-color:#f5f9fd;} .add_container_monthly .resultBoard2 table tbody tr.tLst {background-color:#f5f9fd;} .add_container_monthly .resultBoard2 table tbody tr.tLst td:nth-child(2), .add_container_monthly .resultBoard2 table tbody tr.tLst td:nth-child(3) {color:#006ef4} .add_container_monthly .resultBoard2 table tbody tr.mtLast {border:2px solid #2077e1; background: #fff;} .add_container_monthly .resultBoard2 table tbody tr.mtLast td {color:#2077e1;} /* 할부수수료보기 */ .add_container_monthly .contentsbox .mpRed {border:2px solid #2077e1; color:#2077e1; text-align: center; padding: 12px 0;} .add_container_monthly ul.common_tabbox2 li a {background-color: #fff;} .add_container_monthly ul.common_tabbox2 li a.disable {background-color: #f8f8f8;} /* 유의사항 */ .add_container_monthly .devicesupport .cautionbox {background:#fff; border:1px solid #e0e0e0; padding: 17px 4.3% 19px 4.3%;} .add_container_monthly .devicesupport .cautionbox h5 {background: url(/smc/resources/images/mobile/addImages/notice_mark.gif) no-repeat 0 1px !important; background-size: 12px 12px !important; padding-left:17px; font-size: 12px; font-weight:bold;} .add_container_monthly .contentsbox .mpRed.guide_text {border:none; color: #ff0000; text-align: left; padding: 0;} .add_container_monthly .add_resultBoard table tbody tr.thead th img {padding-right:5px; box-sizing: border-box;} @media screen and (max-width: 360px){ .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap .img_box {width: 50px;} .add_container_monthly .add_serchResult .termsBox .terms_top_area .bottom_cont_group .bottom_cont_wrap .cont_box {width: 212px;} } /* smartLifeTip 01 ~ 04 */ /* .container.Tip1 .contentsarea .feecompare::after{content: '';position: absolute;top: -49px;left: 0;width: 100%;height: 1833px;background: #FFFFFF;/*url('/smc/resources/addImages/mobile/smartLifeTip/temp_m_1.png') no-repeat top center;z-index: -1;opacity: 0.5;} .container.Tip2 .contentsarea .feecompare::after{content: '';position: absolute;top: -49px;left: 0;width: 100%;height: 2028px;background: #FFFFFF;/*url('/smc/resources/addImages/mobile/smartLifeTip/temp_m_2.jpg') no-repeat top center;/z-index: -1;opacity: 0.5;} .container.Tip3 .contentsarea .feecompare::after{content: '';position: absolute;top: -49px;left: 0;width: 100%;height: 1459px;background: #ffffff;/*url('/smc/resources/addImages/mobile/smartLifeTip/temp_m_3.png') no-repeat top center;z-index: -1;opacity: 0.5;} .container.Tip4 .contentsarea .feecompare::after{content: '';position: absolute;top: -56px;left: 0;width: 100%;height: 1772px;background: #ffffff;/*url('/smc/resources/addImages/mobile/smartLifeTip/temp_m_4.png') no-repeat top center;/z-index: -1;opacity: 0.5;} */ /* 공통 */ .container.smartLifeTip .contentsarea .feecompare{position: relative;width: 100%;height: auto;z-index: 1;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .pageinfo{margin: 0;background: url('/smc/resources/images/common/bg_subtit_line.gif') repeat-x 0 100%;} .container.smartLifeTip .contentsarea .feecompare .pageinfo h3{letter-spacing: -0.5px;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap{width: 100%;height: auto;margin-top: 19px;padding: 0 12px;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box{width: 100%;height: auto;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box h3{color: #242424;line-height: 1;letter2021-05-27-spacing: -3.1px;border-bottom: 2px solid #444444;box-sizing: border-box;font-size: 18px;font-weight: bold;padding-bottom: 8px;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul{margin-top: 18.6px; width: 100%;height: 45.4px;font-size: 0;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li{display: inline-block;width: 25%;height: 100%;line-height: 20px;vertical-align: top;background: #FFFFFF;border: 1px solid #CCCCCC;border-right: 0;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li:last-child{border-right: 1px solid #CCCCCC;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li.on{border: 1px solid #0C7EDE;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li a{display: block;width: 100%;height: 100%;line-height: 16px;text-align: center;font-size: 12px;font-weight: bold;color: #444444;text-decoration: none;padding-top: 5px;box-sizing: border-box;letter-spacing: 0px;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li:last-child a{line-height: 33px;letter-spacing: -1px;} .container.smartLifeTip .contentsarea .feecompare .contents{width: 100%;height: auto;padding: 30px 12px 0;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .contents .kv_box{width: 100%;} .container.smartLifeTip .contentsarea .feecompare .contents .kv_box img{width: 100%;} .container.smartLifeTip .contentsarea .feecompare .contents .section{margin-bottom:0;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box{width: 100%;height: auto;margin: 26px 0;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box h1{line-height: 19px;font-size: 16px;color: #242424;letter-spacing: -1px;padding-bottom: 12px;border-bottom: 1px solid #E59CB6;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box h1 span{font-weight: 400;font-size: 12px;line-height: 14px;margin-left: 0;letter-spacing: -1px;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box p{line-height: 24px;color: #242424;font-size: 14px; letter-spacing: -1px;margin-top: 20px;} /* .container.smartLifeTip .contentsarea .feecompare{position: relative;width: 100%;height: auto;z-index: 1;padding: 0 12px;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .pageinfo{margin: 0;background: url('/smc/resources/images/common/bg_subtit_line.gif') repeat-x 0 100%;} .container.smartLifeTip .contentsarea .feecompare .pageinfo h3{letter-spacing: -0.5px;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap{width: 100%;height: auto;margin-top: 3px;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box{width: 100%;height: auto;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box h3{color: #222222; line-height: 42.9px;letter-spacing: -1.4px;border-bottom: 2px solid #444444;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul{margin-top: 18.6px; width: 100%;height: 45.4px;font-size: 0;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li{display: inline-block;width: 25%;height: 100%;line-height: 20px; vertical-align: top;background: url('/smc/resources/images/btn/btn_h40_wh.jpg') repeat-x 0 0;border: 1px solid #CCCCCC;border-right: 0;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li.on{background: #ffffff;border-bottom: 0;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li a{display: block;width: 100%;height: 100%;text-align: center;font-size: 13px;font-weight: bold;color: #444444;text-decoration: none;} .container.smartLifeTip .contentsarea .feecompare .tab_wrap .tab_box ul li:last-child a{line-height: 39px;letter-spacing: -3px;} .container.smartLifeTip .contentsarea .feecompare .contents{width: 100%;height: auto;padding: 30px 0 0;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .contents .kv_box{width: 100%;} .container.smartLifeTip .contentsarea .feecompare .contents .kv_box img{width: 100%;} .container.smartLifeTip .contentsarea .feecompare .contents .section{margin-bottom:0;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box{width: 100%;height: auto;margin-bottom: 55px;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box h1{line-height: 28px;color: #242424;letter-spacing: -0.6px;padding-bottom: 20px;border-bottom: 1px solid #E59CB6;box-sizing: border-box;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box h1 span{font-weight: 400;} .container.smartLifeTip .contentsarea .feecompare .contents .section .text_box p{line-height: 25.8px;color: #242424;font-size: 14px;letter-spacing: -1.7px;margin-top: 14.6px;} */ /* Tip1 */ .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box{width: 100%;font-size: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li{position: relative;display: table;width: 100%;height: 84px;border: 1px solid #D9D9D9;border-radius: 12px;box-sizing: border-box;padding-left: 24px;margin-bottom: 9px;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li:last-child{margin-bottom: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li div{position: relative;display: table-cell;width: 100%;height: 100%;vertical-align: middle;overflow: hidden;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li div span{display: inline-block;width: 31px;height: 31px;line-height: 31px;text-align: center;font-size: 12px;color: #FFFFFF;font-weight: bolder;border-radius: 50%;background: #E33B6F;cursor: default;vertical-align: middle;padding-top: 1px;padding-right: 1.5px;box-sizing: border-box;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li div p{display: inline-block;line-height: 24px;font-size: 14px;color: #242424;font-weight: bold;letter-spacing: -1px;vertical-align: middle;margin-left: 14px;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li div img{position: absolute;display: inline-block;vertical-align: middle;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(1) div img{top: 11px;right: 7px;max-width: 74px;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(2) div img{top: 11px;right: 23px;max-width: 51px;} .container.Tip1 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(3) div img{top: 11px;right: 28px;max-width: 43px;} .container.Tip1 .contentsarea .feecompare .contents .sec02{margin-bottom: 36px;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .text_box{margin: 41px 0 20px;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .text_box h1{padding: 0;border-bottom: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table{width: 100%;height: auto;margin-bottom: 18px;border: 2px solid #E59CB6;box-sizing: border-box;border-radius: 10px;overflow: hidden;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table{width: 100%;height: auto;table-layout: auto;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table tr th{width: 50%;height: 78px;line-height: 24px;font-size: 14px;font-weight: bold;letter-spacing: -1px;color: #242424;border-right: 1px solid #DFDFDF;background: #FBFBFB;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table tr th:last-child{border-right: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table tr td{width: 50%;height: 106px;line-height: 23px;text-align: center;font-size: 14px;font-weight: 400;letter-spacing: -1px;color: #242424;border-right: 1px solid #DFDFDF;vertical-align: top;padding-top: 10px;box-sizing: border-box;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table tr td:last-child{border-right: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .table table tr td span{display: block;margin-top: 3px;line-height: 24px;font-size: 12px;font-weight: 400;letter-spacing: 0;color: #242424;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .caption{width: 100%;} .container.Tip1 .contentsarea .feecompare .contents .sec02 .caption p{line-height: 20px;font-size: 12px;color: #242424;letter-spacing: 0;} .container.Tip1 .contentsarea .feecompare .contents .sec03{margin-bottom: 25px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 .text_box{margin-bottom: 10px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 .text_box p{font-weight: bold;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul{width: 100%;} /* .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li{line-height: 24px;font-size: 13px;color: #242424;padding-left: 13px;background: url('/smc/resources/addImages/smartLifeTip/new_dot.png') no-repeat 0 20%;background-size: 5px 5px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li:nth-child(1){letter-spacing: -1px;background: url('/smc/resources/addImages/smartLifeTip/new_dot.png') no-repeat 0 20%;} */ .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li{line-height: 24px;font-size: 13px;color: #242424;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li:nth-child(1){letter-spacing: -1px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li:nth-child(2){letter-spacing: -1px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li:nth-child(3){letter-spacing: -0.7px;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li::before{} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li span{display: inline-block;width: 85%;} .container.Tip1 .contentsarea .feecompare .contents .sec03 ul li span.dot{width: 5px;height: 5px;border-radius: 50%;background: #007DEB;margin-right: 8px;margin-top: 9px;vertical-align: top;} /* Tip2 */ .container.Tip2 .contentsarea .feecompare .contents .section .text_box{margin-bottom: 57px;} .container.Tip2 .contentsarea .feecompare .contents .section .text_box h1{color: #242424;border-bottom: 2px solid #1BBEDF;box-sizing: border-box;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box{position: relative;width: auto;padding-top:25.5px; font-size: 0;text-align: center;box-sizing: border-box;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box::before{position: absolute;top: -34px;left: 50%;content: '';width: 205px;height: 49px;margin-left: -102.5px;background: url('/smc/resources/addImages/smartLifeTip/tip2_tit.png') no-repeat top center;background-size: 100% 100%;z-index: 1;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li{position: relative;display: inline-block;width: 100%;height: 84px;border: 1px solid #DFDFDF; border-radius:12px; margin-bottom: 10px; vertical-align: top;box-sizing: border-box;text-align: left; padding-left: 35px;padding-top: 17px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li div{display: table-cell;vertical-align: middle;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li img{display: inline-block;vertical-align: middle;margin-right: 38px; max-width: 39.5px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(1) img{margin-left:4px; max-width: 44px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(2) img{margin-left:9px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(3) img{margin-top: 3.6px; margin-left:7px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li:nth-child(4) img{margin-left:7px;} .container.Tip2 .contentsarea .feecompare .contents .sec01 ul.item_box li p{display: inline-block; line-height: 24px;color: #242424;font-size: 14px;font-weight: bold;letter-spacing: -1px;vertical-align: middle;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .text_box{margin-bottom: 22px;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .text_box h3{line-height: 12px;padding-bottom: 15px;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .text_box p{line-height: 25px;letter-spacing: -1px;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table{width: 100%;height: auto;border: 2px solid #22C1DC;box-sizing: border-box;border-radius: 10px;overflow: hidden;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table{width: 100%;height: 237px;table-layout: auto;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table tr th{width: 126px;height: 46px;line-height: 46px;border-bottom: 1px solid #DFDFDF;box-sizing: border-box;font-size: 15px;font-weight: bold;color: #242424;letter-spacing: -0.5px;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table tr:nth-child(2) td{width: 435px; height: 128px; line-height: 23.5px;text-align: center; box-sizing: border-box;font-size: 14px;font-weight: 400;color: #242424;letter-spacing: -1px;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table tr:nth-child(3) td{width: 100%;box-sizing: border-box;font-size: 0; vertical-align: top;text-align: center;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table tr:nth-child(3) td a{display: inline-block;line-height: 18px;margin-right: 20px; padding: 8px 17px;font-size: 12px;font-weight: bold;color: #242424;letter-spacing: -0.5px;background: url('/smc/resources/images/btn/btn_h40_wh.jpg') repeat-x 0 0;border: 1px solid #929292;border-radius: 2px;box-sizing: border-box;} .container.Tip2 .contentsarea .feecompare .contents .sec02 .table table tr:nth-child(3) td a:last-child{margin-right: 0;} .container.Tip2 .contentsarea .feecompare .contents .sec03 .text_box{margin-bottom: 26px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 .text_box h3{line-height: 12px; letter-spacing: -2.5px; margin-top: 40px; padding-bottom: 17px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 .text_box p{line-height: 24px; letter-spacing: -1px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul{width: 100%;font-size: 0;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul li{display: inline-block;width: auto;vertical-align: top;margin-bottom: 14px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul li:first-child{margin-right: 66px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul li img{display: inline-block;vertical-align: middle; margin-right: 10px; max-width: 57px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul li p{display: inline-block;line-height: 22px;margin-left: 9px;font-size: 14px;font-weight: bold;color: #242424;vertical-align: middle;letter-spacing: -1px;} .container.Tip2 .contentsarea .feecompare .contents .sec03 ul li p span{color: #19C1E4;} .container.Tip2 .contentsarea .feecompare .contents .sec04{margin-bottom: 70px;} /* Tip3 */ .container.Tip3 .contentsarea .feecompare .contents .sec01 .text_box{color: #242424; margin-top: 28px; margin-bottom: 23px;} .container.Tip3 .contentsarea .feecompare .contents .sec01 img{width: 100%;} .container.Tip3 .contentsarea .feecompare .contents .sec01 .text_box h1{border-bottom: 1px solid #f1948d;} .container.Tip3 .contentsarea .feecompare .contents .sec01 .text_box p{line-height: 24.5px;color: #242424;font-size: 14px;letter-spacing: -1px;margin-top: 16px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 .text_box{color: #242424; margin-bottom: 20px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 .text_box h3{ border-bottom:none; margin-top: 39px;letter-spacing: -2.4px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box{width: auto;height: 100%; border: 2px solid #f1948d;border-radius: 10px;box-sizing: border-box; font-size: 0;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li{display: block; text-align: center; box-sizing: border-box;;margin-left: 22px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li p{display:block; color: #242424; text-align:left; font-size: 14px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li span{display: block;;width: 39px;height: 39px;line-height: 40px;font-size: 14px;color: #FFFFFF;font-weight: bolder;border-radius: 50%;background: #fc5f53;cursor: default;box-sizing:border-box;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(1){padding-top: 26px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(1) p{margin-top: 10px; letter-spacing: -1px;line-height: 38px;font-weight: bold;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(1) p.line_one{margin-top:22px;line-height:13.9px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(2) {margin-top:25px;line-height: 27.5px;font-weight: bold;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(2) p{padding-top:15px;letter-spacing: -1px; line-height: 27.5px;font-weight: bold;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(3) {margin-top:20px;border-right: none;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li:nth-child(3) p{line-height:26px;font-weight: bold; padding: 14px 0 26px 0; letter-spacing: -1px;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li .min_text span{display: inline-block; width:56.57px; margin-right: 8.8px; height: 20px; border-radius: 5px; font-size: 12px;line-height: 22px;text-align: center;} .container.Tip3 .contentsarea .feecompare .contents .sec02 ul.item_box li p.min_text{font-weight: normal;line-height: 22px; letter-spacing: -1px} /* Tip4 */ .container.Tip4 .contentsarea .feecompare .contents .sec01 .text_box {color: #242424;} .container.Tip4 .contentsarea .feecompare .contents .sec01 .text_box h1{line-height: 20px;} .container.Tip4 .contentsarea .feecompare .contents .sec01 .text_box .img_box{text-align: center;padding: 24px 49px 7px;box-sizing: border-box;} .container.Tip4 .contentsarea .feecompare .contents .sec01 .text_box .img_box img{display: inline-block;width: 100%;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .text_box{color: #242424; margin: 33px 0 0;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .text_box h1{line-height: 24px; border-bottom: none;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table{width: 100%;height: auto;margin-top:6px;margin-bottom: 38px;color: #242424; border: 2px solid #E58E93;box-sizing: border-box;border-radius: 10px;overflow: hidden; table-layout: auto;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table table{width: 100%;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr th{background:#FBFBFB; height: 58px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(2) td{height: 104px;padding: 0px 21px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(2) td p{display: inline-block;letter-spacing: -1px;width: 93%;line-height: 24px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(4) td{height: 172px;padding: 0px 22.2px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(4) td p{display: inline-block;letter-spacing: -1px;width: 93%;line-height: 24px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(4) td p.sub_text{display: block;width: 100%;padding-left: 9px;font-size: 12px; color:#EF2A59; line-height: 20px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(6) td{height: 104px;padding: 0px 23px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(6) td p{display: inline-block;letter-spacing: -1px;width: 93%;line-height: 24px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(8) td{height: 86px;padding: 0px 21px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr:nth-child(8) td p{display: inline-block;letter-spacing: -1px;width: 93%;line-height: 24px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr td span.short_bar {position: relative;top: 10px;display: inline-block;width: 5px;height: 1px;background: #242424;vertical-align: top;margin-right: 5px;} .container.Tip4 .contentsarea .feecompare .contents .sec02 .table tr td span.sub_short_bar {position: relative;top: 10px;display: inline-block;width: 5px;height: 1px;background: #ffffff;vertical-align: top;margin-right: 5px;} /* 이용패턴 기반 요금제 추천 select box 디자인 수정 */ .add_contentsbox .feesoldwrap .sortSelect select {-webkit-appearance: none;width: 145px; height: 27px;padding: 0 5px;border: 1px solid #d5d5d5; box-sizing: border-box;font-size: 14px; color: #444444;background: url('/smc/resources/addImages/icon/ico_select.png') no-repeat 90% center;background-size: 8px 5px;} .feerecommend .add_fee_tabbox .insertbox select {-webkit-appearance: listbox;-moz-appearance: listbox; appearance: listbox;} /* 월납부액 디자인 수정 */ .container .add_contentsarea .feecompare .add_contentsbox .fee_resultbox .hiddencontents .savephone a table tbody tr td.opt01 span {font-size:12px;} /* @media screen and (max-width:375px) { .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dd { white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 242px;} } @media screen and (min-width:376px) and (max-width:425px) { .add_container_monthly .add_serchResult .termsBox .terms_bottom_area .bottom_cont_group .cont_box dl dd { white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 260px;} } */ ul.slick-dots li button:focus-visible, .slide_control button:focus-visible{outline:1px dotted #666 !important;}/* 2021 웹접근성 추가수정 */ /* 2024-04-26 추가 s */ #tab {margin: 0 -18px;} #tab .tab_list { display: flex; } #tab .tab_list li a {display: flex; align-items: center; justify-content: center; position: relative; height: 60px; color:#979797;} #tab .tab_list li a:after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background:#d5d5d5;} #tab .tab_list li.active a {color:#3d79ea;} #tab .tab_list li.active a:after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px;background:#3d79ea;} #tab .tab-contents { position: relative;} #tab .tab-contents div {width: 100%; height: 100%; display: none;} #tab .tab-contents div.active {display: block; display: flex; justify-content: center; align-items: center;} /* 2024-04-26 추가 e */ /* 2024.11 다임즈 */ .container .contentsarea .contentsbox h3 {position: relative} .container .contentsarea .contentsbox h3 .btn-topback { position: absolute; left:10px; top:0; width:40px; height: 55px; display: flex; align-items: center; justify-content: center; } .container .contentsarea .contentsbox h3 .btn-topback:before {content: ''; display: block; width:10px; height: 10px; border-left: 2px solid #000; border-bottom:2px solid #000; transform: rotate(45deg); ;} .container .contentsarea .contentsbox h3 .btn-share { position: absolute; right:0; top:0; width:55px; height: 55px; background: url(../../imagesNew/mobileImage/new/ico_share.svg) no-repeat 50% 50%; background-size: 24px auto;} .bold { font-weight:600 !important} .new-wrap { padding:0 18px ; background-color: #fff;} .mps__row.type2 { border-bottom: 0;} .new-flex { display: flex; flex-wrap: wrap; gap:10px 0; margin:0 -5px 0;} .new-flex label { display: grid; width:33.33333%; padding:0 5px; box-sizing: border-box; } .new-flex.auto label { width:auto; flex:1; } .radio-txt { position: absolute; left:0; z-index:-1; display: none;} .radio-txt + div { text-align: center; border-radius:5px; position: relative; text-align: center; padding:8px 0; cursor: pointer; } .radio-txt + div:before {content:''; position: absolute; left:0; top:0; right:0; bottom:0; border-radius:5px; border:1px solid #A7B5C2} .radio-txt + div strong { display: block; font-size:13px; color:#4A7AE2; font-weight:500; line-height: 1; } .radio-txt + div small { font-size:11px; color:#6C757D; } .radio-txt:checked + div:before, .radio-txt + div:hover:before { border:2px solid #10254A} .radio-txt:checked + div strong, .radio-txt + div:hover strong { color:#10254D; font-weight:600; } .radio-txt + p { text-align: center; border-radius:5px; position: relative; text-align: center; height:40px; line-height: 39px; cursor: pointer; font-size:15px;color:#10254D; font-weight:500 } .radio-txt + p:before {content:''; position: absolute; left:0; top:0; right:0; bottom:0; border-radius:5px; border:1px solid #A7B5C2} .radio-txt:checked + p:before, .radio-txt + p:hover:before { border:2px solid #10254A} .radio-txt:checked + p strong, .radio-txt + p:hover strong { color:#10254D; font-weight:600; } .radio-txt:disabled + div, .radio-txt:disabled + p { background-color: #f8fafd;color:#6c757d; } .radio-txt:disabled + div strong {color:#6c757d; } .radio-txt:disabled + div:before, .radio-txt:disabled + p:before {border-color:#DCE2E8; border-width:1px;} .check-txt + p { text-align: center; border-radius:5px; position: relative; text-align: center; height:40px; line-height: 39px; cursor: pointer; font-size:15px;color:#10254D; font-weight:500 } .check-txt + p:before {content:''; position: absolute; left:0; top:0; right:0; bottom:0; border-radius:5px; border:1px solid #A7B5C2} .check-txt:checked + p:before { border:2px solid #10254A} .check-txt:checked + p strong, .check-txt + p:hover strong { color:#10254D; font-weight:600; } .check-txt:disabled + div, .check-txt:disabled + p { background-color: #f8fafd;color:#6c757d; } .check-txt:disabled + div strong {color:#6c757d; } .check-txt:disabled + div:before, .check-txt:disabled + p:before {border-color:#DCE2E8; border-width:1px;} .mt10 { margin-top:10px} .mt20 { margin-top:20px} .mb0 { margin-bottom:0 !important} .mb5 { margin-bottom:5px !important} .mb15 { margin-bottom:15px} .mb20 { margin-bottom:20px} .mb30 { margin-bottom:30px} .mb40 { margin-bottom:40px} .progressbar-wrap .desc { margin-bottom: 15px; text-align: center; font-size:12px; font-weight:500; color:#A7B5C2;} .progressbar-wrap .desc .blue1 { font-size:12px; } .progress-box { position: relative; margin:0 5px 20px; } .progress-box .slider{position: relative; height: 5px; background: #D6DBE3; border-radius: 5px; cursor: pointer;} .progress-box .line { position: relative;} .progress-box .line span:before, .progress-box .line span:after { content:''; position: absolute; left:0; top:0; width:1px; height: 5px; background-color: #fff; z-index:1;} .progress-box .line span:first-child:before { left:20%;} .progress-box .line span:first-child:after { left:40%;} .progress-box .line span:nth-child(2):before { left:60%;} .progress-box .line span:nth-child(2):after { left:80%;} .progress-box .line.line5 span:first-child:before { left: 16.6666%; ;} .progress-box .line.line5 span:first-child:after { left: 33.33333%; ;} .progress-box .line.line5 span:nth-child(2):before { left:50%;} .progress-box .line.line5 span:nth-child(2):after { left:66.6666%;} .progress-box .line.line5 span:nth-child(3):before { left:83.3333%;} .progress-box .line.line3 span:first-child:before { left: 25%; ;} .progress-box .line.line3 span:first-child:after { left: 50%; ;} .progress-box .line.line3 span:nth-child(2):before { left: 75%; ;} .progress-box .line.line3 span:nth-child(2):after { display: none;} .progress-box .ui-slider-handle{position: absolute; top: 50%; left: 0%; transform: translate(-50%, -50%); display: block; width: 26px; height: 26px; border-radius: 100%; background: #10254D; cursor: pointer;z-index:2; font-size:0; color:rgba(0,0,0,0);outline:none;} .progress-box .ui-slider-range{position: absolute; top: 0; height: 100%; background: #4A7AE2; border: 0; border-radius: 5px; cursor: pointer;} .slider-txt { display: flex; justify-content: space-between; font-size:10px; color:#000; margin-top:14px;} /* .progressbar-wrap.type2 { padding: 20px 30px; border-radius:5px; background: rgba(214,219,227,0.3); margin-bottom: 20px;} .progressbar-wrap.type2 .progress-box { margin-bottom: 0;} */ .slider-choice-btns { margin-bottom:20px; } .slider-choice-btns ul { } .slider-choice-btns ul li { margin-bottom: 8px; } .slider-choice-btns button{ width:100%; height: 50px; text-align: left; padding-left: 20px; font-size:11px; color:#6C757D; display: flex; align-items: center; position: relative;} .slider-choice-btns button:before {content:''; position: absolute; left:0; top:0; right:0; bottom:0; border-radius:5px; border:1px solid #A7B5C2; } .slider-choice-btns button strong { color:#4A7AE2; font-size:14px; flex:0 0 90px; } .slider-choice-btns button.active:before { border:2px solid #10254A; } .plat-path { padding: 10px 20px; border-top:1px solid #D6DBE3; border-bottom: 1px solid #D6DBE3; background-color: #F2F3F6; margin:0 -18px 30px; } .plat-path ul { display: flex; flex-wrap: wrap; gap:8px; } .plat-path ul li p { overflow: hidden; line-height: 28px; height: 30px; border-radius:30px; padding:0 12px; font-size:12px; color:#10254D; background-color: #fff; border:1px solid #A7B5C2;} .plan-head { display: flex; justify-content: space-between; margin-bottom: 20px; align-items: center;} .plan-head .right { display: flex; gap:10px; } .h3 { font-size:16px; font-weight:600; color:#222; } .select1 { width:100px; height: 30px; border-radius:4px; border:1px solid #A7B5C2; font-size:12px; padding-left: 12px; color:#10254D; background: url(/smc/resources/imagesNew/mobileImage/new/select.svg) no-repeat right 50%; background-position: right 10px center;-webkit-appearance:none;} .btn-filter { height: 30px; border-radius:4px; border:1px solid #A7B5C2; font-size:12px;color:#10254D; padding:0 12px;} .btn-filter:before {content: ''; display: inline-block; vertical-align: middle; width:10px; height: 10px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_filter.svg) no-repeat 0 0; margin:-3px 4px 0 0;} .planItem { padding: 16px; border-radius:10px;border:1px solid #A7B5C2; margin-bottom: 20px; } .planItem .title1 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;} .planItem .title1 .logo img { max-height: 32px;} .planItem .title1 .type p { display: inline-block; width:52px; height: 26px; border-radius:26px; text-align: center; line-height: 26px; background-color: #E7EBF1; font-size:12px; font-weight:500; color:#647189; } .planItem .title2 { margin-bottom: 5px; } .planItem .title2 .subj ul { display: flex; gap:8px; flex-wrap: wrap; } .planItem .title2 .subj ul li { font-size:12px; color:#E30000; font-weight:500; display: flex; align-items: center; gap:3px; } .planItem .title2 .subj ul li i { display: inline-block; vertical-align: middle; width:11px; height: 11px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_info.svg) no-repeat 0 0; margin:-3px 0 0 0;} .planItem .title2 .subj ul li.us { color:#647189; padding-right: 10px; margin-right:1px; position: relative; } /* 2024.12.03 2줄 추가 */ .planItem .title2 .subj ul li.us.no-border { padding-right:0;} .planItem .title2 .subj ul li.us.no-border:after { display: none;} .planItem .title2 .subj ul li.us:after {content: ''; position: absolute; right:0; top:2px; bottom:2px; width:1px; background-color: #A7B5C2;} .planItem .title2 .subj .name { font-size:18px; font-weight:600; color:#222; margin:5px 0;} .planItem .title2 .price { display: flex; justify-content:flex-end; align-items: center; margin-bottom: 10px;} .planItem .title2 .price small { font-size:13px; color:#A7B5C2; font-weight:500; margin-right:10px; } .planItem .title2 .price strong { font-size:20px; font-weight:600; color:#4A7AE2;} .planItem .info-box {padding: 20px 17px 10px; border-radius:5px; background-color: #F3F4F7;} .planItem .info-box ul {} .planItem .info-box ul + ul { margin-top:8px; } .planItem .info-box ul li { padding-left: 25px; position: relative; font-size:12px; color:#10254D; } .planItem .info-box ul li + li { margin-top:10px; } .planItem .info-box ul li i { position: absolute; left:0; top:0; width:15px; height: 16px; background-position: 0 50%; background-repeat: no-repeat; } .planItem .info-box ul li i.ico-wifi { background-image: url(/smc/resources/imagesNew/mobileImage/new/ico_wifi.svg);top:2px;} .planItem .info-box ul li i.ico-tel { background-image: url(/smc/resources/imagesNew/mobileImage/new/ico_phone.svg);} .planItem .info-box ul li i.ico-sms { background-image: url(/smc/resources/imagesNew/mobileImage/new/ico_letter.svg);} .planItem .info-box ul li i.ico-benefit { background-image: url(/smc/resources/imagesNew/mobileImage/new/ico_gift.svg); top:2px;} .planItem .info-box ul li .t1 { font-size:14px; font-weight:600; } .planItem .info-box ul li .t2 { font-weight:500; } .planItem .info-box ul li .t3 { font-weight:600; } .planItem .info-box ul li button.t3 { padding-right:18px; position: relative;border:0;outline:none; font-size:12px;} .planItem .info-box ul li button.t3:before {content:''; position: absolute; right:0; top:50%; margin-top:-3px; width:11px; height: 7px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_arrow_down.svg) no-repeat 0 0;} .planItem .info-box ul li .t3.active + .t3-on { display: block;} .planItem .info-box ul li .t3-on { display: none;} .planItem .compa { display: flex; justify-content: space-between; align-items: center; margin-top:16px;} .planItem .compa .btns a { display: inline-block; font-size:14px; font-weight:500; color:#10254A} .planItem .compa .btns a:after {content: ''; display: inline-block; vertical-align: middle; width:7px; height: 12px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_arrow_more.svg) no-repeat 0 0; margin:-2px 0 0 8px;;} .checkbox-txt { position: absolute; display: none;} .checkbox-txt + div { display: flex; align-items: center; gap:8px; cursor: pointer; } .checkbox-txt + div em { width:20px; height: 20px; border-radius:100%; background: #E5E5E5 url(/smc/resources/imagesNew/mobileImage/new/checkbox.svg) no-repeat 55% 52%; } .checkbox-txt + div span { font-size:13px; font-weight:500; color:#10254A} .checkbox-txt:checked + div em { background-color: #10254D;} .checkbox-txt:checked + div span { font-weight:600; } .checkbox-txt.type2 + div { padding-left: 28px; position: relative;} .checkbox-txt.type2 + div em { position: absolute; left:0; top:0; } .checkbox-txt.type2 + div span {font-size:14px; } .checkbox-txt.type2 + div span small { display: block; font-size:12px; color:#6C757D; font-weight:400; margin-top:5px;;} .more-plan { text-align: center; margin:34px 0;} .more-plan a { display: inline-block; font-size:16px; color:#6C757D; font-weight:500; } .more-plan a:after {content: ''; display: inline-block; vertical-align: middle; width:16px; height: 10px; margin:-3px 0 0 16px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_arrow_more2.svg) no-repeat 0 0;} .hidden { position: absolute; left: -9999px; display: none;} .plan-bottom-area { padding:20px 0; background-color: #fff; position: sticky; bottom:0; height: 100px;} .compalist ul { display: flex; flex-wrap: wrap; gap:8px; margin-top:15px; } .compalist ul li { flex:1; min-width: 0; } .compalist ul li .item { height: 36px; border-radius:5px; border:1px solid #A7B5C2; padding:0 27px 0 12px; position: relative; box-sizing: border-box;} .compalist ul li .item .tit {line-height: 34px; font-size:13px; color:#10254A; font-weight:500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .compalist ul li .item .btn-del { position: absolute; right:0; top:0; width:30px; height: 34px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_delete.svg) no-repeat 50% 50%;} .popup-wrap { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 999000; background: rgba(0, 0, 0, 0.5); overflow: auto; display: none; } .popup-box { display: table; width: 100%; height: 100%; } .popup-cont {} .popup-in { background: #fff; margin: 0 auto; position: relative; } .popup-head { position: sticky; top:0; display: flex; justify-content: space-between; align-items: center; height: 63px; padding:0 18px; border-bottom: 1px solid #E5E5E5; background-color: #fff; z-index:10;} .popup-body { padding:18px; } .h3-popup { font-size: 18px; font-weight: 600; color:#20254D; } .popup-in .btn-close { width:35px; height: 35px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_close_pop.svg) no-repeat 50% 50%; } .popup-foot { position: sticky; left:0; right:0;bottom:0; padding:18px; display: flex; justify-content: center; gap:20px; border-top:1px solid #E5E5E5; background-color: #fff; z-index:10; } .popup-foot .scwBotBtns { margin:0; align-items: flex-start; } .popup-foot a { flex:1; height: 44px; border-radius:5px; border:1px solid #10254D; font-size:16px; font-weight:600; color:#10254D; line-height: 42px; text-align: center; box-sizing: border-box;} .popup-foot a:hover { box-shadow:0 5px 10px rgba(0, 0, 0, 0.25); color:#fff; background-color: #10254D; } .popup-wrap.type2 { overflow: hidden;} .popup-wrap.type2 .popup-body { padding-top:0; } .popup-wrap.type2 .popup-box { position: fixed; left:0; right:0; border-radius:10px 10px 0 0; top:10vh;bottom:0; height: auto; display: block; overflow: auto; overflow-x:hidden;} .popup-wrap.type2 .popup-box::-webkit-scrollbar { display: none;} .popup-wrap.type2 .popup-head { height: 55px; border-bottom: 0;} .plan-compa ul + .h4-head { margin-top:10px; } .plan-compa > ul { display: flex; gap:8px; } .plan-compa > ul > li { flex:1; margin-bottom: 20px; } .plan-compa .opt1 { height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; padding: 5px; text-align: center; border-radius:5px; background-color: rgba(214,219,227,0.3); word-break: break-all; } .plan-compa .opt1 + .opt1 { margin-top:10px;} .plan-compa .opt1 del { display: block; font-size:11px; font-weight:500; color:#A7B5C2; margin-bottom: 5px;} .plan-compa .opt1 small { display: block; font-size:9px; color:#10254D;} .plan-compa .opt1 .t1 { font-size:14px; font-weight:600; color:#10254D; } .plan-compa .opt1 .t2 { font-size:13px; font-weight:600; color:#10254D; } .plan-compa .opt1 .t3 { font-size:13px; } .plan-compa .opt1.active { background-color: #E6EFFD;} .plan-compa .opt1.active small, .plan-compa .opt1.active .t1, .plan-compa .opt1.active .t2 { color:#4A7AE2} .plan-compa .opt2 { padding:5px 10px; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border-radius:5px; background-color: rgba(214,219,227,0.3);} .plan-compa .opt2 .t1 { font-size:13px; color:#10254D; font-weight:600; } .plan-compa .opt2 .t1 small { font-size:11px; color:#6C757D; font-weight:400; display: block;} .plan-compa .opt2 .desc { width:100%; border-top:1px solid rgba(167,181,194,0.5); font-size:11px; font-weight:500; padding-top:4px; margin-top:4px; } .plan-compa .opt2.active { background-color: #E6EFFD;} .plan-compa .opt2.active small, .plan-compa .opt2.active .t1 { color:#4A7AE2} .plancom-item { } .plancom-item .top-info { height: 100%; border-radius:10px; border:1px solid #A7B5C2; display: flex; flex-direction: column; justify-content: space-between; } /* 2024.12.03 */ .plancom-item .top-info .head { position: relative; padding:12px; padding-bottom: 10px; box-sizing: border-box; min-height:139px;} /* 2024.12.06 */ .plancom-item .top-info .head .t1 { font-size:12px; font-weight:500; color:#20254D; padding:20px 0 10px; } .plancom-item .top-info .head .t1 p { margin-bottom: 8px;} .plancom-item .top-info .head .t1 img { max-height: 20px; ;} .plancom-item .top-info .head .t2 { margin-bottom: 15px;; font-size:16px; font-weight:600; color:#10254D; line-height: 24px; height: 48px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-all;} .plancom-item .top-info .head ul { display: block; gap:8px; } .plancom-item .top-info .head ul li { font-size:12px; color:#E30000; font-weight:500; display: flex; align-items: center; gap:3px; margin-top:3px; } .plancom-item .top-info .head ul li i { display: inline-block; vertical-align: middle; width:11px; height: 11px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_info.svg) no-repeat 0 0;} .plancom-item .top-info .head .btn-del { position: absolute; right:5px; top:5px; width:20px; height: 20px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_delete2.svg) no-repeat 50% 50%;} .plancom-item .top-info .btn-detail { display: block; text-align: center; font-size:12px; font-weight:500; color:#10254D; border-top:1px solid #A7B5C2; line-height: 37px;} .h4 { font-size:14px; font-weight:600; margin-bottom: 15px; color:#222;} .h4-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;} .h4-head .h4 { margin-bottom: 0;} .h4-head .right { display: flex; gap:10px; align-items: center; } .tips { font-size:12px; color:#10254D; font-weight:600; } .tips .ico-tip { width:12px; height: 12px; vertical-align: middle; display: inline-block; margin:-3px 0 0 2px; background: url(/smc/resources/imagesNew/mobileImage/new/ico_que.svg) no-repeat 0 0; background-size: contain; } .switch { position: absolute; display: none;} .switch + div { width:36px; height: 22px; border-radius:20px; background-color: #CBD2DD; position: relative; transition: all 0.5s ease;} .switch + div em { position: absolute; left:2px; top:2px; width:18px; height: 18px; border-radius:100%; background-color: #fff; transition: all 0.5s ease;} .switch:checked + div { background-color: #4A7AE2;} .switch:checked + div em { left: 16px; ;} .blue1 { color:#4A7AE2 !important; } .pop-tabs { display: flex; flex-wrap: nowrap; overflow: auto; position: relative; margin:0 -18px 30px; position: sticky; top:55px; background-color: #fff; z-index:10; border-bottom: 1px solid #A7B5C2; } .pop-tabs::-webkit-scrollbar { display: none ;} /* .pop-tabs:before {content:''; position: absolute; left:0; right:0; bottom:0; height: 1px; background-color: #A7B5C2;} */ .pop-tabs a { line-height: 38px; padding:0 10px; font-size:14px; font-weight:500; color:#10254D;position: relative; white-space: nowrap;} .pop-tabs a.active:before {content:''; position: absolute; left:0; right:0; bottom:0; height: 2px; background-color: #4A7AE2;} .hr1 { display: block; margin:30px 0; width:100%; padding:0; border:0; outline:none; height: 1px; background-color: rgba(167,181,194,0.3); } .progress-tabs ul { display: flex; flex-wrap: wrap; gap:4px 8px; } .radio-txt2 { position: absolute; display: none;} .radio-txt2 + div { padding:0 13px; height: 30px; line-height: 28px; border-radius:36px;font-size:13px; color:#10254D; position: relative; cursor: pointer; box-sizing: border-box;} .radio-txt2 + div:before { content:''; position: absolute; left:0; top:0; right:0; bottom:0; border-radius:36px; border:1px solid #A7B5C2; } .radio-txt2:checked + div:before { border:2px solid #10254D; } .radio-txt2:checked + div { font-weight:600; } .check-list1 { margin-bottom: 40px;} .check-list1.type2 { } .check-list1.type2 ul {display: flex; flex-wrap: wrap; gap:14px 0;} .check-list1.type2 ul li { width:50%; margin-bottom: 0; } .check-list1 ul { } .check-list1 ul li { margin-bottom: 10px; } .description1 { font-size:12px; color:#10254A} .flex2 { } .flex2 .item { display: flex; align-items: center;} .flex2 .item + .item { margin-top:20px; } .flex2 .item:first-child:before {content:''; position: absolute; right:-20px; top:5px; width:1px; height: 80px; background-color: #A7B5C2;} .flex2 .item .h4 { margin-bottom: 0; flex:0 0 70px; } .flex2 .item .new-flex { flex:1; display: flex; gap:8px; margin-bottom: 0;} .flex2 .item .new-flex label { flex:1; padding:0; } .flex2 .new-flex {margin:0 0 20px; margin-top:0} .mobile-list { padding: 20px; border-radius:5px; background-color: rgba(214,219,227,0.3); display: none;} .mobile-list ul { display: flex; flex-wrap: wrap; gap:12px 0; } .mobile-list ul li { width:50%; } .mobile-list ul li .checkbox-txt + div span { font-size:12px; } .btn-fliplist { text-align:center; width:100%; height:42px; font-size:15px; color:#6C757D; } .btn-fliplist:after { content: ''; display: inline-block; vertical-align: middle; width:7px; height: 7px; border-left: 2px solid #6C757D; border-bottom: 2px solid #6C757D; transform: rotate(-45deg); margin:-2px 0 6px 8px; transition: all 0.5s ease;} .btn-fliplist.active:after { transform: rotate(135deg); margin-bottom: -2px;} .tab-cont { position: relative;} .fixed-bottom-wrap { position: sticky; margin:0 -18px; left:0; right:0; bottom:0; z-index:10; padding:11px 18px; border-top:1px solid #D6DBE3; background-color: #fff; } .fixed-bottom-wrap .fixed-bottom { ;} .container.renew .midarea.type2 { padding-bottom: 0; background-color: #fff;} .tabMenuList { display: flex; margin:0 -18px 20px; ;} .tabMenuList li { flex:1; } .tabMenuList .tmlLink { display: block; line-height: 40px; text-align: center; background-color: #E6EFFD; font-size:14px; color:#4a7ae2; ;} .tabMenuList .tmlLink.active { background-color: #4A7AE2; color:#fff; font-weight:500; } .disable-click { pointer-events:none; opacity: 0.5;} #tabs-2 { display: none; }