@charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap'); html{font-size:16px;} body{height:100%; font-size:1rem; font-weight:normal; font-family: 'Noto Sans KR', sans-serif; line-height:24px; background-color:#fff; color:#000; letter-spacing:-1px;} /*** [reset] ***/ *{box-sizing:border-box;} *:after{clear:both;} dl, ol, ul{margin:0; padding:0;} ul li{list-style:none} dl, dd{margin-bottom:0;} label{margin-bottom:0;} em{font-style:normal;} a{display:block; color:#333;} a:hover{color:inherit;} p{margin:0;} h1, h2, h3, h4, h5, h6{margin:0;} img{display:block;} /*** [reset 끝] ***/ /*** [bootstrap reset] ***/ a:focus{text-decoration:none;} dl, dd, dt{line-height:initial;} .btn {padding:0; line-height:inherit; font-size:inherit; font-weight:inherit; border-radius:0; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;} pre{margin:0; padding:0; font-size:1rem; font-weight:normal; font-family: 'Noto Sans KR', sans-serif; line-height:24px; background-color:#fff; border:0; overflow:auto; white-space:pre-wrap;} /*** [bootstrap reset 끝] ***/ /* 부트스크랩 color */ .bg-light-gray {background-color: #f6f6f6 !important;} /* color-black */ .text-black {color: #000 !important;} /* 텍스트 자르기 */ .word-keep {word-break: keep-all;} .word-break {word-break: break-all;} /* color-primary */ .text-primary {color: #01b4d0 !important;} .bg-primary {background-color: #01b4d0 !important;} .btn-primary {color: #fff !important; background-color: #01b4d0 !important; border-color: #01b4d0 !important;} .btn-primary:focus {color: #fff; background-color: #01b4d0 !important; border-color: #01b4d0 !important;} .btn-outline-primary {color: #01b4d0 !important; border-color: #01b4d0 !important;} .btn-outline-primary:focus {color: #01b4d0 !important; border-color: #01b4d0 !important;} .badge-primary {color: #fff !important; background-color: #01b4d0 !important;} .badge-outline-primary {border: 1px solid #01b4d0 !important; color: #01b4d0 !important;} .btn-primary.active, .btn-primary:focus, .btn-primary.active, .btn-primary:focus, .btn-primary:hover {color: #fff !important; background-color: #286090 !important; border-color: #286090 !important;} /* color-warning */ .text-warning {color: #fea811 !important;} .bg-warning {background-color: #fea811 !important;} .btn-warning {color: #fff !important; background-color: #fea811 !important; border-color: #fea811 !important;} .btn-warning:focus {color: #fff !important; background-color: #fea811 !important; border-color: #fea811 !important;} .btn-outline-warning {color: #fea811 !important; border-color: #fea811 !important;} .btn-outline-warning:focus {color: #fea811 !important; border-color: #fea811 !important;} .badge-warning {color: #fff !important; background-color: #fea811 !important;} .badge-outline-warning {border: 1px solid #fea811 !important; color: #fea811 !important;} .btn-warning.active, .btn-warning:focus, .btn-warning.active, .btn-warning:focus, .btn-warning:hover {color: #fff !important; background-color: #d98a00 !important; border-color: #d98a00 !important;} /* color-danger */ .text-danger {color: #ff5d16 !important;} .bg-danger {background-color: #ff5d16 !important;} .btn-danger {color: #fff !important; background-color: #ff5d16 !important; border-color: #ff5d16 !important;} .btn-danger:focus {color: #fff !important; background-color: #ff5d16 !important; border-color: #ff5d16 !important;} .btn-outline-danger {color: #ff5d16 !important; border-color: #ff5d16 !important;} .btn-outline-danger:focus {color: #ff5d16 !important; border-color: #ff5d16 !important;} .badge-danger {color: #fff !important; background-color: #ff5d16 !important;} .badge-outline-danger {border: 1px solid #ff5d16 !important; color: #ff5d16 !important;} .btn-danger.active, .btn-danger:focus, .btn-danger.active, .btn-danger:focus, .btn-danger:hover {color: #fff !important; background-color: #c9302c !important; border-color: #c9302c !important;} /* color-info */ .text-info {color: #1accaa !important;} .bg-info {background-color: #1accaa !important;} .btn-info {color: #fff !important; background-color: #1accaa !important; border-color: #1accaa !important;} .btn-info:focus {color: #fff !important; background-color: #1accaa !important; border-color: #1accaa !important;} .btn-outline-info {color: #1accaa !important; border-color: #1accaa !important;} .btn-outline-info:focus {color: #1accaa !important; border-color: #1accaa !important;} .badge-info {color: #fff !important; background-color: #1accaa !important;} .badge-outline-info {border: 1px solid #1accaa !important; color: #1accaa !important;} .btn-info.active, .btn-info:focus, .btn-info.active, .btn-info:focus, .btn-info:hover {color: #fff !important; background-color: #31b0d5 !important; border-color: #269abc !important;} /* color-secondary */ .text-secondary {color: #6c757d !important;} .bg-secondary {background-color: #6c757d !important;} .btn-secondary {color: #fff !important; background-color: #6c757d !important; border-color: #6c757d !important;} .btn-secondary:focus {color: #fff !important; background-color: #6c757d !important; border-color: #6c757d !important;} .btn-outline-secondary {color: #6c757d !important; border-color: #6c757d !important;} .btn-outline-secondary:focus {color: #6c757d !important; border-color: #6c757d !important;} .badge-secondary {color: #fff !important; background-color: #6c757d !important;} .badge-outline-secondary {border: 1px solid #6c757d !important; color: #6c757d !important;} .btn-secondary.active, .btn-secondary:focus, .btn-secondary.active, .btn-secondary:focus, .btn-secondary:hover {color: #fff !important; background-color: #51565a !important; border-color: #51565a !important;} /* 바디 마스크 */ .body_mask {width: 100%; height: 100%; position: fixed; background-color: #000000b3; z-index: 9000; display: none;} /* 리스트 인라인 재선언 */ .list-inline {margin-left: 0 !important;} /* 네비바 */ .nav-select-tab {display: table; width: 100%; border-bottom: 1px solid #6c757d !important;} .nav-select-tab.tab-3 > li {width: 33.3%;} .nav-select-tab.tab-4 > li {width: 25%;} .nav-select-tab.tab-5 > li {width: 20%;} .nav-select-tab.tab-6 > li {width: 16.6%;} .nav-select-tab > li {display: table-cell; text-align: center; margin-bottom: 0;} .nav-select-tab > li:first-child > a {margin-left: 0 !important;} .nav-select-tab > li > a.active, .nav-select-tab > li > a.active:hover, .nav-select-tab > li > a.active:focus {;opacity: 1; background-color: #f6f6f6 !important; color: #6c757d !important; border-color: #6c757d !important;} .nav-select-tab > li:first-child > a {margin-left: 1.5rem;} .nav-select-tab > li > a {padding: 17.5px 5px; color: #353535 !important; background-color: #fff; border-color: #ddd !important; border-bottom: none; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;} .nav-select-tab > li:last-child > a {margin-right: 0;} .nav-select-tab>li>a:hover, .nav-select-tab>li>a:focus{border-color: #777 !important; background-color: #f4ffff;} /*** [공통] ***/ /* a 링크 호버 시 액션 */ a:hover{opacity:0.9;} /* ver-mid */ .ver-mid {display: inline-block; vertical-align: middle !important;} /* form-control */ .form-control {height: 40px !important; border-radius: 0 !important;} /* 영역 */ #main, #sub, #mypage{position:relative; min-height:100vh;} .container{width:1300px; padding:0;} /* 이미지 */ img{max-width:100%;} /* 정렬 */ .in-block{font-size:0;} .in-block > *{display:inline-block; font-size:1rem; vertical-align:middle;} /* Form tag */ label{position:relative; cursor:pointer;} /* label input[type="radio"]{margin:0; padding:0; width:1px; height:1px;} */ input[type="checkbox"]{width:20px; height:20px;} input{width:100%; padding:22px 20px; border:1px solid #c1c1c1;} input::placeholder, input[type="date"]{font-weight:normal; color:#616161;} /* 타이틀 */ .cmn_ttl dt {margin-left: 5%;} /* 페이저 */ .common_pager{margin-top:30px; text-align:center;} .common_pager ul{display:inline-block; *display:inline; zoom:1; margin:0; padding:0; clear:both;} .common_pager ul li{list-style:none; float:left; min-width:55px; text-align:center;} .common_pager ul li a{padding:0 7px; font-size:1.125rem; color:#999; border:1px solid transparent;} .common_pager ul li.active a, .common_pager ul li.active a:focus, .common_pager ul li.active a:active{padding-bottom:10px; font-weight:bold; color:#d72426; border-bottom:1px solid #d72426;} .common_pager ul li.arrow_pager a{font-weight:bold; color:#222;} .common_pager ul li.arrow_pager a span{display:none;} .common_pager ul li.arrow_pager a:focus{background-color:transparent; border-color:transparent} .common_pager ul li.arrow_pager a:hover{color:#000;} /** 버튼 & a 링크 **/ /* 기본 버튼 공통 (#01b4d0 - 파란색) */ .btn {cursor: pointer !important;} .btn_base{display:block; padding:21.5px 0; font-size:18px; line-height:25px; text-align:center; background-color:#fff; border:1px solid #01b4d0;} .btn_bg_base{display:block; padding:9px 0; font-size:18px; line-height:25px; text-align:center; background-color:#01b4d0; color:#fff !important; border:1px solid #01b4d0;} /* 민트색 선 */ .btn_mint_border{display:block; padding:9px 0; font-size:18px; text-align:center; background-color:#fff; color:#3d9799; border:1px solid #3d9799;} /* Java */ .btn_bg_Java{display:block; padding:9px 0; font-size:18px; line-height:25px; text-align:center; background-color:#1accaa; color:#fff !important; border:1px solid #1accaa;} /* 상태별 버튼 */ .btn_sta_upd{display:block; padding:0.25rem 0; font-size:1rem; line-height:32px; text-align:center; background-color:#1accaa; color:#fff !important; border:1px solid #1accaa;} .btn_sta_upd:hover{color:#fff;} .btn_sta_del{display:block; font-size: 18px !important; padding:5.5px 0; font-size:1rem; line-height:32px; text-align:center; background-color:#ff5d16; color:#fff; border:1px solid #ff5d16;} .btn_sta_del:hover{color:#ff5d16;} .btn_skyblue {background: #0291e3; border-color: #0291e3;} .btn_red {background-color: #d72426 !important; border-color: #d72426 !important;} /* 버튼 정렬 (여백 10px) */ .btn_aling_pad10_lst{font-size:0;} .btn_aling_pad10_lst > *{display:inline-block; margin-right:10px; font-size:16px; vertical-align:middle;} .btn_aling_pad10_lst > *:last-child{margin-right:0;} /** 버튼 & a 링크 끝 **/ /* 탭 */ .comn_cont_tab_wrap{margin-bottom:10px;} .comn_cont_tab_lst{border-bottom:0;} .comn_cont_tab_lst > li{width:237px; margin-right:10px; border:1px solid #fff;} .comn_cont_tab_lst > li:last-child{margin-right:0;} .comn_cont_tab_lst > li > a{width:100%; padding:16px 0; font-size:21px; line-height:26px; text-align:center; color:#222; border:2px solid #c6c6c6; border-radius:0;} .comn_cont_tab_lst >li > a:focus, .comn_cont_tab_lst >li > a:hover{background-color:#fff; color:#222; border:2px solid #c6c6c6; opacity:1; cursor:pointer;} .comn_cont_tab_lst > li.active{border:1px solid #0291e3;} .comn_cont_tab_lst > li.active > a{font-weight:400; color:#0291e3; border:2px solid #0291e3;} .comn_cont_tab_lst >li.active > a, .comn_cont_tab_lst >li.active > a:focus, .comn_cont_tab_lst >li.active > a:hover{background-color:#fff; color:#0291e3; border:2px solid #0291e3; opacity:1; cursor:pointer;} /* 컨텐츠 */ .cmn_cont_wrap .ui-widget.ui-widget-content{border:0;} /* 텍스트 컬러 */ .txt_Cerulean{color:#01b4d0;} /* 텍스트 크기 */ .txt_size_md{font-size:135%;} /* 마우스 올렸을때 */ .text_hover_cursor{cursor:pointer;} .d-table > li {display: table-cell; vertical-align: middle;} /*** [공통 끝] ***/ /*** [초기 설정] ***/ #content_section{min-height:300px;} /*** [초기 설정 끝] ***/ /*** [팝업] ***/ /* 팝업 오버레이 */ .ui-widget-overlay{background:none; background-color:#fff; opacity:0;} /* 팝업 전체 */ .ui-dialog{padding:2px; border:1px solid #b7b7b7; max-width: 600px;} .ui-dialog input{height:40px; border:1px solid #c1c1c1; color:#373737; outline:0;} .ui-dialog .chosen-container-single .chosen-single{height:40px; padding:13px 13px 13px 20px; border:1px solid #b7b7b7;} .ui-dialog .chosen-container-single .chosen-single div b:after, .ui-dialog .chosen-container-active.chosen-with-drop .chosen-single div b:after{padding:13px 0;} /* .ui-dialog .btn{min-width:80px; padding:7px 0 !important; line-height:51px !important;} */ /* 헤더 */ .ui-dialog .ui-dialog-titlebar{padding:23px 0; font-size:1.75rem; font-weight:bold; text-align:center; background-image:url('/common/css/image/dialog_header_left.png'), url('/common/css/image/dialog_header_right.png') !important; background-repeat:no-repeat !important; background-position:top left,bottom right !important; background-size:contain !important; background-color:#1accaa !important; color:#fff;} .ui-dialog .ui-dialog-title{float:none; margin:0;} .ui-dialog .ui-dialog-titlebar-close{right:20px; width:20px; height:20px; line-height:20px;} .ui-widget-header .ui-dialog-titlebar-close .ui-icon{background:url(/common/css/image/dialog_close.png) no-repeat center; background-size:contain;} .ui-dialog .ui-state-hover, .ui-dialog .ui-widget-content .ui-state-hover, .ui-dialog .ui-widget-header .ui-state-hover, .ui-dialog .ui-state-focus, .ui-dialog .ui-widget-content .ui-state-focus, .ui-dialog .ui-widget-header .ui-state-focus{font-weight:normal; background:none; border:none;} .ui-dialog .ui-button-text-only .ui-button-text{padding:9px 0; font-size:1.125rem;} .ui-dialog .ui-dialog-buttonpane{margin-top:0; margin-bottom:38px; padding:0; border-top:0;} .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{float:none; width:100%; margin:0 auto; text-align:center;} .ui-dialog .ui-state-default, .ui-dialog .ui-widget-content .ui-state-default, .ui-dialog .ui-widget-header .ui-state-default{width:215px; font-weight:normal; background-image:none; background-color:#fff; color:#01b4d0; border:1px solid #01b4d0;} /* 바디 */ .ui-dialog .ui-dialog-content{padding:30px 30px 19px !important; text-align:center;} .ui-buttonset{margin-right:0;} /* 바디 > chosen 재정의 */ .ui-dialog .chosen-container-single .chosen-single{padding:5px 12px 5px 20px;} /* 바디 > Form tag */ .ui-dialog input{padding:5px 12px 5px 20px;} /* 바디 > 라벨 */ .dialog_label_lst{width:100%; border:1px solid #b7b7b7;} .dialog_label_lst > li{width: 33.3%; text-align:center; margin-right: 0 !important; padding-left: 5px; padding-right: 5px;} .dialog_label_lst > li > a {border: 1px solid #dcdcdc;} .dialog_label_lst > li > a.active {border-color: #3366b9; color: #3366b9;} /* .dialog_label_lst > li:last-child{border-right:0;} .dialog_label_lst label{display:block; margin:1px; padding:5px 0; font-weight:400;} .dialog_label_lst label.active{background-color:#1accaa; color:#fff;} */ /* 날짜 선택 */ .ui-datepicker-calendar .ui-state-default, .ui-datepicker-calendar .ui-widget-content .ui-state-default, .ui-datepicker-calendar .ui-widget-header .ui-state-default, .ui_tpicker_minute_slider .ui-state-default, .ui_tpicker_minute_slider .ui-widget-content .ui-state-default, .ui_tpicker_minute_slider .ui-widget-header .ui-state-default, .ui_tpicker_hour_slider .ui-state-default, .ui_tpicker_hour_slider .ui-widget-content .ui-state-default, .ui_tpicker_hour_slider .ui-widget-header .ui-state-default, .ui_tpicker_second_slider .ui-state-default, .ui_tpicker_second_slider .ui-widget-content .ui-state-default, .ui_tpicker_second_slider .ui-widget-header .ui-state-default{width:inherit; font-weight:normal; background-image:none; background-color:#fff; color:inherit; border:1px solid #e2e2e2;} /* 하단 */ /* .ui-dialog .ui-dialog-buttonpane{display:none;} */ /* 글 스타일 */ .dialogue_wrap{font-size:1.125rem; font-weight:300; line-height:32px; color:#373737;} /* 안내문 중앙정렬 */ .alert_center_txt{text-align:center;} .alert_center_txt .gud_badge{vertical-align:middle;} /*** [팝업 끝] ***/ /*** [플러그인 재정의] ***/ /* chosen 재정의 */ .chosen-container{font-size:18px;} .chosen-container-single .chosen-default{color:#222;} .chosen-container-single .chosen-single{height:auto; padding:20px 12px 20px 20px; background:none; background-color:#fff; color:#616161; border:1px solid #c1c1c1; border-radius:0; box-shadow:none;} .chosen-container-active.chosen-with-drop .chosen-single{background:none; background-color:#fff; border:1px solid #c1c1c1; border-radius:0;} .chosen-container .chosen-drop{border:1px solid #c1c1c1; border-top:none; box-shadow:none;} .chosen-container .chosen-results{margin:0; padding:0;} .chosen-container .chosen-results li{padding:5px 6px 5px 10px;} .chosen-container .chosen-results li.highlighted{background:none; background-color:#666;} .chosen-container-single .chosen-single div b{background:none;} .chosen-container-single .chosen-single div b:after{content: "\f107"; padding:20px 0; font-family: "Font Awesome 5 Pro"; font-weight: 100; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased;} .chosen-container-active.chosen-with-drop .chosen-single div b:after{content: "\f106"; padding:20px 0; color:#6f7073; font-family: "Font Awesome 5 Pro"; font-weight: 100; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased;} /*** [플러그인 재정의 끝] ***/ /*** [상단 메뉴] ***/ /* 상단 메뉴 */ #top_menu_section, #top_menu_section{position:absolute; top:0; width:100%;} #top_menu{position:relative;} /* 상단 메뉴 > 나열 */ #top_menu .container{font-size:0;} #top_menu .container:after{content:""; display:block; clear:both; overflow:hidden;} #top_menu .container > div{display:inline-block; font-size:1rem; vertical-align:top;} #top_menu .top_menu_logo{padding:27px 0;} #top_menu .top_menu_tool_wrap{float:right;} /* 상단 메뉴 > 대메뉴 */ #top_menu .top_menu_lst{padding-left:63px; font-size:0;} #top_menu .top_menu_lst > li{position:relative; z-index:30; display:inline-block; width:200px; height:104px; margin-right:10px; padding-top:40px; font-size:21px; text-align:center; background-color:#fff; vertical-align:top; overflow:hidden;} #top_menu .top_menu_lst > li.menu_noraml{width:167px;} #top_menu .top_menu_lst > li:last-child{margin-right:0;} #top_menu .top_menu_lst > li > a{display:block; padding-bottom:40px; color:#000;} #top_menu .top_menu_lst > li > a span{padding-bottom:11px;} /* 상단 메뉴 > 중메뉴 */ #top_menu .top_menu_lst .top_menu_det_lst{position:absolute; top:104px; left:0; z-index:20; width:100%; text-align:left;} #top_menu .top_menu_lst .top_menu_det_lst > li > a{display:block; padding:10px 1.25rem; font-size:1rem; text-align:center; color:#5b3c1c;} /* 상단 메뉴 > 호버(.active) + 페이지 위치(.on) 시 액션 */ #top_menu .top_menu_lst > li.active{box-shadow:0 8px 10px rgba(0, 0, 0, 0.2);} #top_menu .top_menu_lst > li.active > a span, #top_menu .top_menu_lst > li.on > a span{border-bottom:3px solid #d92427;} #top_menu .top_menu_lst > li > a:hover{text-decoration:none;} /* 상단 메뉴 > 로그인/마이페이지 도구 */ #top_menu .top_menu_tool_lst{margin-right:-165px;} #top_menu .top_menu_tool_lst li{margin-right:10px; vertical-align:top;} #top_menu .top_menu_tool_lst li a{display:block; cursor:pointer;} #top_menu .top_menu_tool_lst li:hover a{opacity:0.9;} #top_menu .top_menu_tool_lst li:last-child{margin-right:0;} #top_menu .top_menu_tool_lst .tool_log_in a{width:77px; height:91px; background:url('image/icon_login.png') no-repeat center; background-size:contain;} #top_menu .top_menu_tool_lst .tool_log_out a{width:78px; height:57px; background:url('image/icon_logout.png') no-repeat center; background-size:contain;} #top_menu .top_menu_tool_lst .tool_my_page a{width:77px; height:91px; background:url('image/icon_mypage.png') no-repeat center; background-size:contain;} #top_menu .top_menu_tool_lst .tool_mem_join a{width:78px; height:57px; background:url('image/icon_mem_join.png') no-repeat center; background-size:contain;} #top_menu .top_menu_tool_lst li span{display:none;} /*** [상단 메뉴 끝] ***/ /*** [하단 홈페이지 정보] ***/ /* 영역 */ #footer_section{position:absolute; bottom:0; width:100%;} /* 하단 홈페이지 정보 */ #footer{padding:70px 0; background-color:#1c1b1b;} /* 하단 홈페이지 정보 > 나열 */ #footer .container{font-size:0;} #footer .container > div{display:inline-block; font-size:1rem; color:#999; vertical-align:middle;} #footer .container > div a{color:#999;} #footer .footer_logo{width:20%;} #footer .footer_info{width:60%;} #footer .footer_family_site{width:20%;} /* 하단 홈페이지 정보 > 로고 */ #footer .footer_logo{vertical-align:middle;} /* 하단 홈페이지 정보 > 정보 */ #footer .footer_info .footer_info_lst{margin-bottom:-4px; font-size:0;} #footer .footer_info .footer_info_lst li{display:inline-block; font-size:14px;} #footer .footer_info .footer_info_lst:first-child li:after{content:","; margin-right:4px;} #footer .footer_info .footer_info_lst:first-child li:last-child:after{display:none; margin-right:0;} #footer .footer_info .footer_info_lst .pinfo_hdlgpolicy a{color:#cf3131;} #footer .footer_info .footer_polcy_wrap_lst > li{margin-right:0.5rem;} /* 하단 홈페이지 정보 > 패밀리 사이트 */ /* 하단 홈페이지 정보 > 패밀리 사이트 > 옵션 박스 */ #footer .footer_family_site{position:relative;} #footer .footer_family_site .family_site_box{font-size:14px; border:1px solid #676767;} #footer .footer_family_site .family_site_box p{padding:7px 14px; clear:both; overflow:hidden;} #footer .footer_family_site .family_site_box p:after{content: "\f0d7"; float:right; height:15px; font-family: "Font Awesome 5 Pro"; font-weight: 900; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased;} /* 하단 홈페이지 정보 > 패밀리 사이트 > 리스트 */ #footer .footer_family_site .family_site_lst{position:absolute; bottom:40px; display:none; width:100%;text-align:center; background-color:#404040; color:#999; border:1px solid #676767; border-bottom:0;} #footer .footer_family_site .family_site_lst li a{display:block; padding:8px 5px; color:#999; text-decoration:none;} #footer .footer_family_site .family_site_lst li a:hover{background-color:#666; color:#f5f5f5;} /* 하단 홈페이지 정보 > 패밀리 사이트 > 리스트 클릭 시 이벤트 */ #footer .footer_family_site .more_slide_up p:after{content:"\f0de"; padding-top:5px;} /*** [하단 홈페이지 정보 끝] ***/ /*** [로그인 관련 공통] ***/ /* 영역 및 제목 */ .mem_login_func_form_wrap{padding:68px; border:1px solid #c6c6c6;} .mem_login_func_form_wrap .mem_login_func_form_box{width:475px; margin:0 auto;} .mem_login_func_dfnt_lst{text-align:center;} .mem_login_func_dfnt_lst dt{margin-bottom:26px; font-size:21px; line-height:24px; font-weight:normal; color:#1d1d1d;} .mem_login_func_dfnt_lst dd{margin-top:18px; font-size:18px; line-height:24px; color:#666;} .mem_login_func_dfnt_lst dd.no_result{display:none;} /* 폼 태그 스타일 및 영역 */ /* .mem_login_func_form_inner input{padding:12px 14px; color:#202020;} */ .mem_login_func_form_inner input::placeholder{color:#a8a8a8;} .mem_login_func_tool_wrap{margin-top:15px;} /* 버튼 */ .mem_login_func_btn_wrap{margin:0 auto; margin-top:36px; text-align:center;} .mem_login_func_btn_wrap button, .mem_login_func_btn_wrap a{width:100%; padding:18px 0; font-size:21px; line-height:32px;} /*** [로그인 관련 공통 끝] ***/ /*** [로그인] ***/ /* ID & PW 입력 폼 */ .mem_login_func_form_inner .login_id_wrap{margin-bottom:15px;} /** 자동 로그인 관련 기능 **/ /* 영역 */ .mem_login_tool_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .mem_login_tool_wrap .login_save_id{float:left;} .mem_login_tool_wrap .super_login{float:right;} /* 아이디 저장 */ .login_save_id input[type="checkbox"] + label:before{content:""; display:inline-block; width:24px; height:24px; background:url('image/ico_check.png') no-repeat center; background-size:contain;} .login_save_id input[type="checkbox"]:checked + label:before{background:url('image/ico_check_active.png') no-repeat center; background-size:contain;} .login_save_id input[type="checkbox"] + label span{margin-left:10px; font-size:1.125rem; line-height:26px; font-weight:normal; color:#666; vertical-align:top;} .login_save_id input[type="checkbox"]{display:none;} /* 개발자 로그인 */ .super_login span{font-size:1.125rem; line-height:26px; font-weight:normal; color:#a4a4a4;} /** 자동 로그인 관련 기능 끝 **/ /** 로그인 기능 툴 **/ /* 영역 */ .mem_login_func_wrap{margin-top:36px;} /* 회원가입, 아이디·비밀번호 찾기 */ .mem_login_func_lst_wrap{margin-top:43px;} .mem_login_func_lst{margin-left:-23.5px; margin-right:-23.5px;} .mem_login_func_lst li{position:relative; width:calc(100% / 3); text-align:center;} .mem_login_func_lst li:after{content:""; display:inline-block; position:absolute; top:50%; right:0; width:1px; height:17px; background-color:#c1c1c1; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);} .mem_login_func_lst li:last-child:after{display:none;} .mem_login_func_lst li a{font-size:18px; line-height:26px; color:#666;} /** 로그인 기능 툴 끝 **/ /*** [로그인 끝] ***/ /*** [아이디·비밀번호 찾기] ***/ /* 영역 및 공통 재설정 */ .mem_login_find_form_wrap{padding:47px;} .mem_login_find_form_wrap .mem_login_func_dfnt_lst dt{margin-bottom:13px;} .mem_login_find_form_wrap .mem_login_func_btn_wrap{margin-top:2rem;} /* 탭 초기화 */ .COMMON_TABS{padding:0; border:0;} /* 폼 태그 영역 */ .mem_login_find_info{position:relative; margin-top:1rem;} .mem_login_find_info .find_check .badge_check{position:absolute; top:48%; right:20px; margin:0; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);} /* 인증 팝업 */ .info_fd_popup{line-height:45px; font-size:1.125rem; font-weight:300; color:#373737;} .info_fd_popup strong{display:block; line-height:37px; font-size:24px; font-weight:500; color:#01b4d0;} .info_fd_popup .info_fd_gud{margin:10px 0; font-size:21px; font-weight:500;} .info_fd_popup .info_fd_gud span{margin-left:10px;} .info_fd_popup .info_fd_popup_det_inpt{width:327px; margin-right:10px; padding-top: 11px; padding-bottom: 11px;} .info_fd_popup .info_fd_popup_lst > li{width:103px;} .info_fd_popup .info_fd_popup_lst .btn_cfm_wrap{margin-right:10px;} .info_fd_popup .info_fd_popup_lst .btn_cfm_wrap a{display:block; text-align:center; background-color:#1accaa; color:#fff !important; border:1px solid #1accaa; line-height: 35px;} /*** [아이디·비밀번호 찾기 끝] ***/ /*** [회원가입] ***/ /** 동의 여부 **/ /* 영역 */ .mem_join_func_form_wrap{padding:50px 47px;} .mem_join_info_outer{margin-top:0; margin-bottom:40px;} .mem_join_info_outer .comn_cont_info_inner{padding:44px 50px;} /* 제목 */ .mem_join_ttl{margin-bottom:14px; font-size:24px; line-height:28px; font-weight:normal; color:#1d1d1d;} /* 폼 태그 */ .mem_join_cond_chk_wrap input[type="checkbox"] {vertical-align: -5px;} .mem_join_cond_chk_wrap input[type="checkbox"] + label span{margin-left:10px; font-size:1rem; font-weight:400; color:#222; vertical-align:top;} /* 개인정보 동의 여부 체크 */ .mem_join_cond_lst li{margin-bottom:17px;} .mem_join_cond_lst li:last-child{margin-bottom:0;} .mem_join_cond_lst li:not(.mem_join_cond_tot_agr) .mem_join_cond_chk_wrap{width:265px; margin-right:23px;} .mem_join_cond_trms_view{font-size:1rem;} .mem_join_cond_cont_wrap{vertical-align:top;} .mem_join_cond_trms_view span:after{content:"\f107"; margin-left:10px; font-size:24px; color:#6f7073; vertical-align:middle; font-family: "Font Awesome 5 Pro"; font-weight: 100; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased;} .mem_join_cond_trms_view.JS-trms-view-ico span:after{content:"\f106";} .mem_join_cond_trms{display:none; margin-top:20px;} .mem_join_cond_trms textarea{width:100%; height:200px; padding:13px 20px; border:1px solid #c1c1c1;} .mem_join_cond_lst li.mem_join_cond_tot_agr input[type="checkbox"] + label span{font-weight:500; color:#000;} /* 회원가입 양식 */ .mem_join_wrap dl{min-height:50px; line-height:50px; margin-bottom:10px; font-size:0;} .mem_join_wrap dl > *{display:inline-block; font-size:1rem; vertical-align:middle;} .mem_join_wrap dl:last-child{margin-bottom:0;} .mem_join_wrap dl dt{width:145px; font-size:1.125rem; font-weight:normal; color:#666;} .mem_join_wrap dl dd .mem_join_wrap{width:850px;} .mem_join_auth_wrap .mem_join_btn_wrap{width:175px; margin-left:30px;} .mem_login_func_btn_wrap .mem_login_func_inner{width:475px; margin:0 auto;} /*** [회원가입 끝] ***/ /*** [메인] ***/ /* 메인 메뉴 스타일 */ #main{position:relative;} #main #top_menu_section{position:absolute; top:0; z-index:10; width:100%;} #main #top_menu_section #top_menu .top_menu_lst > li{background-color:rgba(255, 255, 255, 0);} #main #top_menu_section #top_menu .top_menu_lst > li.menu_noraml.active{background-color:transparent;} #main #top_menu_section #top_menu .top_menu_lst > li > a{color:#fff;} #main #top_menu_section #top_menu .top_menu_lst .top_menu_det_lst > li > a{color:transparent; pointer-events:none;} #main #top_menu_section #top_menu .top_menu_lst > li.menu_noraml.active:hover a{color:#fff;} #main #top_menu_section #top_menu .top_menu_lst > li.menu_noraml.active:hover > a span{border-color:#fff;} /* 호버 액션 */ #main #top_menu_section #top_menu .top_menu_lst > li.active{background-color:#fff;} #main #top_menu_section #top_menu .top_menu_lst > li.active > a{color:#000;} #main #top_menu_section #top_menu .top_menu_lst > li.active .top_menu_det_lst > li > a{color:#5b3c1c; pointer-events:auto;} /* 메인 이미지 */ #main_content .section_main{width:100%; overflow:hidden;} #main_content .section_main .img_wrap{position:relative; width:100%; height:899px; background:url('/common/css/image/okshot_main_img_01.jpg') no-repeat top;} #main_content .section_main a[class|="pstn"]{position:absolute; left:50%; width:122px; height:122px; line-height:30px; padding-top:30px; font-size:24px; font-weight:500; text-align:center; background:rgba(215, 35, 38, 0.7); color:#fff; border-radius:50%; box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); letter-spacing:-1px; animation:scaleBounce 1.5s alternate infinite;} @keyframes scaleBounce{ 0% {transform:scale(1.0)} 50% {transform:scale(1.05)} 100% {transform:scale(0.9)} } #main_content .section_main .pstn-01{top:52%; margin-left:-140px; padding-top:34px !important; animation-delay:0s !important;} #main_content .section_main .pstn-02{top:37%; margin-left:-182px; animation-delay:0.5s !important;} #main_content .section_main .pstn-03{top:26.6%; margin-left:-77px; animation-delay:1.0s !important;} #main_content .section_main .pstn-04{top:32.2%; margin-left:55px; animation-delay:1.5s !important;} /** 문자서비스 **/ /* 영역 */ .section_func_info_wrap{padding:90px 0 150px; background-color:#fafafa;} /* 메인 제목 */ .main_cmn_ttl{text-align:center;} .main_cmn_ttl dt{font-size:36px; font-weight:500; color:#000802;} .main_cmn_ttl dt:after{content:""; display:block; width:20px; height:2px; margin:13px auto 23px; background-color:#000;} .main_cmn_ttl dd{font-size:18px; color:#666;} /* 리스트 */ .func_info_lst_wrap{margin-top:66px;} .func_info_lst{margin:auto -20px; font-size:0;} .func_info_lst > li{display:inline-block; width:calc(100% / 4); font-size:16px; vertical-align:middle;} .func_info_lst .func_info_inner{height:480px; margin:0 20px; padding-top:25px; box-shadow:1px 1px 10px rgba(0, 0, 0, 0.2);} .func_info_lst .img_wrap{position:relative; width:78px; height:55px; margin-left:29px; margin-bottom:18px; background:url('/common/css/image/double_speech-bubble.png') no-repeat center; background-size:contain;} .func_info_lst .img_wrap span{position:absolute; top:7px; left:18px; font-size:1.125rem; text-align:center; color:#ecef01;} .func_info_lst .txt_wrap dl{text-align:center;} .func_info_lst .txt_wrap dt{font-size:26px; font-weight:500; color:#333333;} .func_info_lst .txt_wrap dd{margin-top:21px; font-size:17px; color:#6f6f6f;} .func_info_lst .func_info_optin_01 .func_info_inner{background:url('/common/css/image/func_lst_bg_01.jpg') no-repeat bottom; background-size:contain;} .func_info_lst .func_info_optin_02 .func_info_inner{background:url('/common/css/image/func_lst_bg_02.jpg') no-repeat bottom; background-size:contain;} .func_info_lst .func_info_optin_03 .func_info_inner{background:url('/common/css/image/func_lst_bg_03.jpg') no-repeat bottom; background-size:contain;} .func_info_lst .func_info_optin_04 .func_info_inner{background:url('/common/css/image/func_lst_bg_04.jpg') no-repeat bottom; background-size:contain;} /** 문자서비스 끝 **/ /** 카운트 **/ .wide_contents_inner{position:relative; width:100%; height:795px;; background:url('/common/css/image/main_cont_bg.jpg') no-repeat center; background-size:cover;} .wide_contents_wrap{position:absolute; top:46%; left:50%; -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transform:translate(-50%, -50%);} .wide_contents_wrap h1{text-align:center; font-size:40px; line-height:50px; font-weight:300; color:#fff; letter-spacing:-1px;} .wide_contents_wrap .box_card_wrap{margin-top:64px;} .wide_contents_wrap .box_card_wrap .box_card{position:relative; width:722px; height:223px; background-color:rgba(255, 255, 255, 0.25); border:2px solid #fff;} .wide_contents_wrap .box_card_wrap .box_card .box_card_inner{position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transform:translate(-50%, -50%);} .wide_contents_wrap .box_card_wrap .box_card ul{margin:0 -128px; font-size:0;} .wide_contents_wrap .box_card_wrap .box_card ul li{display:inline-block; margin:0 64px; font-size:16px; vertical-align:top;} .wide_contents_wrap .box_card_wrap .box_card ul li p{margin-bottom:7px; font-size:18px; text-align:center; color:#fff;} .wide_contents_wrap .box_card_wrap .box_card ul li h2{font-size:42px; line-height:52px; text-align:center; color:#fff;} .wide_contents_wrap .box_card_wrap .box_card ul li h2 span{display:block;} .wide_contents_wrap .box_card_wrap .box_card ul li h2 span.JS-contUp-01{min-width:81px;} .wide_contents_wrap .box_card_wrap .box_card ul li h2 span.JS-contUp-02{min-width:46px;} .wide_contents_wrap .box_card_wrap .box_card ul li h2 span.JS-contUp-03{min-width:69px;} .wide_contents_wrap .box_card_wrap > p{margin-top:30px; font-size:18px; font-weight:300; text-align:center; color:#fff;} /*** [메인 끝] ***/ /*** [네비게이터] ***/ /* 영역 스타일 */ #mypage .navigator_section{background-color:#c0133a;} .navigator_section{color:#fff; background-color:#13c099;} .navigator_section.sms_sendg_cont_list{ background-color: #ffaa5e; } .navigator_section.mem_send_num_lst_list{background-color:#139ec0;} .navigator_section.mem_addr_grp_bas_list{background-color:#a38dc4;} .navigator_section > .container:after{content:""; display:block; clear:both; overflow:hidden;} /* 대제목 및 메뉴 */ .navigator_section .top_navi_dfnt_lst{margin-bottom:12px; padding-top:35px; text-align:center;} .navigator_section .top_navi_dfnt_lst dt{margin-bottom:12px; font-size:2.5rem; font-weight:normal;} .navigator_section .top_navi_dfnt_lst dd{font-size:1.125rem; font-weight:300;} .navigator_section .top_navi_preview_lst{font-size:0;} .navigator_section .top_navi_preview_lst li{display:inline-block; font-size:1.125rem;} .navigator_section .top_navi_preview_lst li:after{content:","; margin-right:6px;} .navigator_section .top_navi_preview_lst li:last-child:after{display:none;} .navigator_section .top_navi_dfnt_lst dd .no_result{display:none;} /* 위치 정보 */ .navigator_section .navi_depth{float:right; margin-bottom:7px;} .navigator_section .navi_depth_lst{font-size:0;} .navigator_section .navi_depth_lst li{display:inline-block; font-size:15px;} .navigator_section .navi_depth_lst li a{display:inline-block; color:#fff;} .navigator_section .navi_depth_lst li:after{content:"\f105"; margin:0 5px; font-family: "Font Awesome 5 Pro"; font-weight: 100; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased;} .navigator_section .navi_depth_lst li:last-child:after{display:none;} /*** [네비게이터 끝] ***/ /*** [마이페이지] ***/ .mem_login_func_form_inner dl > dd > ul > li > a.btn {line-height: 46px;} /* 영역 */ .my_curr_blnc_wrap{font-size:0; background-color:#f0f0f0;} .my_curr_blnc_wrap > div{display:inline-block; width:50%; padding:50px; font-size:1rem; vertical-align:top;} /* 현재 잔액 */ /* 현재 잔액 > 현재 잔액 */ .my_curr_blnc_outer{position:relative;} .my_curr_blnc_outer:after{content:""; position:absolute; top:50px; right:-1px; width:1px; height:75%; background-color:#dedede;} .my_curr_blnc_inner{padding:33px 30px 17px; background-color:#fff; border:1px solid #dedede;} .my_curr_blnc_dfnt_lst{font-size:0;} .my_curr_blnc_dfnt_lst:after{content:""; display:block; clear:both; overflow:hidden;} .my_curr_blnc_dfnt_lst > *{display:inline-block; font-size:1rem;} .my_curr_blnc_dfnt_lst > dt{font-size:0; vertical-align:middle;} .my_curr_blnc_dfnt_lst > dt > *{display:inline-block; font-size:1.5rem; font-weight:500; vertical-align:middle;} .my_curr_blnc_dfnt_lst > dt .img_wrap{margin-right:7px;} .my_curr_blnc_dfnt_lst > dd{float:right; margin-top:-29px; font-size:24px; color:#666;} .my_curr_blnc_dfnt_lst > dd strong{margin-right:10px; font-size:48px; color:#1accaa;} /* 현재 잔액 > 버튼 */ .btn_blnc_charg_lst{margin-top:20px; margin-right:-10px; font-size:0;} .btn_blnc_charg_lst > li{display:inline-block; font-size:21px; color:#fff;} .btn_blnc_charg_lst > li:first-child{margin-right:10px;} .btn_blnc_charg_lst > li > a{display:block; padding:10px; font-size:0; color:#fff; text-align: center;} .btn_blnc_charg_lst > li > a > *{display:inline-block; font-size:21px; font-weight:400; vertical-align:middle;} .btn_blnc_charg_lst > li > a .img_wrap{margin-right:10px;} .btn_blnc_charg_lst .btn_blnc_charg{width: calc(50% - 10px);} .btn_blnc_charg_lst .btn_blnc_dsc{width: calc(50% - 10px);} /* 현재 잔액 > 안내글 */ .my_curr_blnc_info_lst{margin-top:14px;} .my_curr_blnc_info_lst > li:first-child{margin-bottom:6px;} .my_curr_blnc_info_dfnt_lst{font-size:0;} .my_curr_blnc_info_dfnt_lst > *{display:inline-block; font-size:18px; color:#575757; vertical-align:middle;} .my_curr_blnc_info_dfnt_lst dt{margin-right:3px; font-weight:normal;} .my_curr_blnc_info_dfnt_lst dt span{font-weight:300;} .my_curr_blnc_info_lst .point_bullet{display:inline-block; margin-right:5px; width:20px; height:20px; line-height:20px; text-align:center; font-size:8px; background-color:#6d6e71; color:#fff; border-radius:50%; vertical-align:middle;} .my_curr_blnc_info_dfnt_lst dd{font-weight:500;} /* 내 정보 수정하기 */ .my_cash_wrap .mem_login_func_btn_wrap{width:100%; margin-top:17px; text-align:center;} .my_cash_wrap .mem_login_func_btn_wrap a{padding:2px 0; font-size:18px;} .my_cash_wrap .mem_login_func_btn_wrap a i + span{margin-left:10px;} /* 발신 번호 */ .send_num_outer{position:relative;} .send_num_outer:after{content:""; position:absolute; top:50px; left:1px; width:1px; height:75%; background-color:#fff;} .send_num_inner{padding:33px 30px 37px; background-color:#fff; border:1px solid #dedede;} .send_num_use_pcond{font-size:24px; font-weight:400; color:#575757;} .send_num_use_pcond strong{font-weight:500; color:#1accaa;} .send_num_func_wrap{margin-top:32px; font-size:0;} .send_num_func_wrap > *{display:inline-block; width:50%; font-size:18px; vertical-align:middle;} .send_num_use_lst{margin-top:3px; padding-right:32px; vertical-align:top;} .send_num_use_lst li{min-height:33px; padding:0 9px; color:#575757; border-bottom:1px solid #adadad;} .btn_send_num_mngt{text-align:center;} .btn_send_num_mngt > a{display:block; padding:35px 54px; background-color:#fea811; color:#fff; border:1px solid #fea811; text-decoration:none;} .btn_send_num_mngt .img_wrap{display:inline-block; text-indent:-9999px; width:59px; height:62px; margin-bottom:0.625rem; background:url('image/ico_btn_blnc_charg_03.png') no-repeat center; background-size:contain;} .btn_send_num_mngt p{font-size:21px;} /* 마이 리스트 > 제목 */ .my_lst_wrap{margin-top:5rem;} .my_lst_main_wrap{position:relative; padding:149px 50px 38px; background:url('/common/css/image/bg_my_page_lst.jpg') no-repeat center; background-size:cover;} .my_lst_main_wrap .my_lst_ttl{color:#fff;} .my_lst_main_wrap .my_lst_ttl dt{margin-bottom:22px; font-size:31px; font-weight:500;} .my_lst_main_wrap .my_lst_ttl dt:after{content:""; display:block; width:44px; height:2px; margin-top:16px; background-color:#fff;} .my_lst_main_wrap .my_lst_ttl dd strong{font-size:21px; font-weight:400; color:#f0a65d;} .my_lst_main_wrap .btn_more_wrap a{position:absolute; bottom:0; right:0; padding:7px 13px; background-color:#d72426; color:#fff; text-decoration:none;} .my_lst_main_wrap .btn_more_wrap a i + span{margin-left:10px;} /* 마이 리스트 > 테이블 */ .my_lst_tbl_wrap{margin-top:30px;} .my_lst_tbl_wrap table tr th.dt{width:7.5%;} .my_lst_tbl_wrap table tr th.num{width:10.5%;} .my_lst_tbl_wrap table tr th.sxn{width:6.5%;} .my_lst_tbl_wrap table tr th.sendg_exps, .my_lst_tbl_wrap table tr th.sendg_cnt, .my_lst_tbl_wrap table tr th.rsl{width:8.5%;} .my_lst_tbl_wrap table tr th.sta, .my_lst_tbl_wrap table tr th.det_dspy{width:6%;} .my_lst_tbl_wrap table tr td.cont{padding:0 42px 0 23px;} .my_lst_tbl_wrap table tr td.cont span{display:block; max-height:24px; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; white-space:normal; word-break:break-all; word-wrap:break-word; word-break:break-word;} .my_lst_tbl_wrap table tr td.sxn .img_wrap img{margin:0 auto;} /**- 충전하기 팝업 -**/ /* 마이페이지 > 충전하기 */ .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt:after{content:""; display:block; clear:both; overflow:hidden;} .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt{margin-bottom:1rem; font-size:1.125rem; font-weight:400;} .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt > *{line-height:36px;} .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt > h1{float:left; margin-bottom:0; font-size:22px;} .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt > p{float:right; margin-bottom:0;} .charg_btm_ardy_wrap .charg_btm_ardy_1st_dfnt_lst dt .cashpoint_span_hb{font-size:24px; font-weight:bold; color:#48d6bb;} .charg_btm_ardy_2nd_dfnt_lst{margin:1rem 0 1.25rem;} .charg_btm_ardy_2nd_dfnt_lst:after{content:""; display:block; width:100%; height:1px; background-color:#c6c6c6;} .charg_btm_ardy_2nd_dfnt_lst dt{display:none;} .charg_btm_ardy_2nd_dfnt_lst dd{font-size:0;} .charg_btm_ardy_2nd_dfnt_lst dd > *{display:inline-block; font-size:1rem;} .charg_btm_ardy_2nd_dfnt_lst dd > input{width:95%;} .charg_btm_ardy_2nd_dfnt_lst dd > span{width:5%; text-align:right; color:#111;} .charg_btm_ardy_2nd_dfnt_lst dd > p{margin:11px 0 20px; font-size:1.125rem; color:#636363;} .charg_btm_ardy_2nd_dfnt_lst dd .point_bullet{display:inline-block; margin-right:5px; width:20px; height:20px; line-height:20px; text-align:center; font-size:8px; background-color:#6d6e71; color:#fff; border-radius:50%; vertical-align:middle;} .charg_btm_ardy_3rd_dfnt_lst dt{display:none;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst{font-size:0;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst li{display:inline-block; font-size:1rem; width: 33.3%;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst li i {font-size: 1.25rem;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst li:last-child{margin-right:0;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst li label{display: block; padding:6px 0; text-align:center; background-color:#fff; color:#3366b9; border:1px solid #3366b9;} .charg_btm_ardy_3rd_dfnt_lst .btn_charg_btm_ardy_lst li label:hover{background-color:#3366b9; color:#fff;} /* 마이페이지 > 충전하기 > 무통장입금 */ .nil_bank_rcpt_gud_wrap .nil_bank_rcpt_annc{font-size:1.125rem; text-align:center; color:#373737;} .nil_bank_rcpt_gud_wrap .nil_bank_rcpt_annc strong{font-size:22px; color:#ff0517;} .nil_bank_rcpt_gud{margin:20px 0; padding:26px 0.3rem 22px; text-align:center; color:#111; border:1px solid #b7b7b7;} .nil_bank_rcpt_gud .nil_bank_rcpt_gud_lst{margin:0; padding:0;} .nil_bank_rcpt_gud .nil_bank_rcpt_gud_lst > li{list-style:none; margin-bottom:1rem;} .nil_bank_rcpt_gud .nil_bank_rcpt_gud_lst > li:last-child{margin-bottom:0;} .nil_bank_rcpt_gud .nil_bank_rcpt_gud_lst > li p{margin-bottom:0; font-size:24px; font-weight:bold;} .nil_bank_rcpt_gud_sms_srv_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .nil_bank_rcpt_gud_sms_srv_outer{float:left; font-size:0;} .nil_bank_rcpt_gud_sms_srv_outer > *{display:inline-block; line-height:59px; font-size:1.125rem; color:#373737;} .nil_bank_rcpt_gud_sms_srv_outer .nil_bank_rcpt_gud_sms_srv{width:252px; margin:0 11px;} .nil_bank_rcpt_gud_sms_srv_outer .nil_bank_rcpt_gud_sms_srv select{width:100%; padding:11px 0 11px 20px; border:1px solid #b7b7b7;} .nil_bank_rcpt_gud_sms_srv_wrap .btn_nil_bank_rcpt_gud_sms_srv{float:right; width:105px;} .nil_bank_rcpt_gud_sms_srv_wrap .btn_nil_bank_rcpt_gud_sms_srv a{display:block; padding:17px; text-align:center; background-color:#1accaa; color:#fff;} .nil_bank_rcpt_gud_form_btn_wrap:before{content:""; display:block; width:100%; height:1px; margin:20px 0; background-color:#b7b7b7;} .nil_bank_rcpt_gud_form_btn_wrap .nil_bank_rcpt_gud_form_btn_lst{font-size:0; margin:0 auto; text-align:center;} .nil_bank_rcpt_gud_form_btn_wrap .nil_bank_rcpt_gud_form_btn_lst li{list-style:none; display:inline-block; font-size:1.125rem;} .nil_bank_rcpt_gud_form_btn_wrap .nil_bank_rcpt_gud_form_btn_lst li:first-child{margin-right:20px;} .nil_bank_rcpt_gud_form_btn_wrap .nil_bank_rcpt_gud_form_btn_lst li a{display:block; width:170px; padding:13px 0; font-weight:500;} /*** [마이페이지 끝] ***/ /*** [서브 영역 공통] ***/ /* 영역 */ .content_section{margin:69px 0 6.25rem;} /* 컨텐츠 제목 */ .cmn_ttl{margin-bottom:14px;} .cmn_ttl dt{margin-bottom:0.5rem; font-size:1.75rem; font-weight:500; color:#221613;} .cmn_ttl dd .no_sub_ttl{display:none;} /* 컨텐츠 제목 옆에 옵션이 있을때 */ .cmn_plus_optn:after{content:""; display:block; clear:both; overflow:hidden;} .cmn_plus_optn dl{float:left; width:83%;} .cmn_plus_optn dl dt{margin-bottom:0; line-height:50px;} .cmn_plus_optn .cmn_ttl_optn{float:right; width:17%;} .cmn_plus_optn .cmn_ttl_optn .chosen-container-single .chosen-single{padding:12px 13px 12px 20px;} .cmn_plus_optn .cmn_ttl_optn .chosen-container-single .chosen-single div b:after, .cmn_plus_optn .cmn_ttl_optn .chosen-container-active.chosen-with-drop .chosen-single div b:after{padding:12px 0;} /** 컨텐츠 테이블 공통 **/ .comn_tbl_wrap table{width:100%; border:1px solid #c6c6c6; border-collapse:inherit;} .comn_tbl_wrap table tr th{padding:26px 0; font-size:1.125rem; font-weight:500; text-align:center; color:#666; border-bottom:2px solid #d72426;} .comn_tbl_wrap table tr th:not(:first-child){border-right:1px solid #c6c6c6;} .comn_tbl_wrap table tr th:last-child{border-right:0;} .comn_tbl_wrap table tr th:first-child{background-color:#d72426; color:#fff;} .comn_tbl_wrap table tr td{padding:0.625rem 5px; text-align:center; border-bottom:1px solid #c6c6c6; color:#1d1d1d;} .comn_tbl_wrap table tr:last-child td{border-bottom:0;} .comn_tbl_wrap table tr td input[type="text"]{margin:-1.5px 0;} .comn_tbl_wrap table tr td a {cursor: inherit;} .comn_tbl_wrap table tr td a:hover {color: #666;} /* 내역보기 > 전송내역보기 */ .comn_tbl_wrap table tr .sta_suces{color:#2356fe;} .comn_tbl_wrap table tr .sta_fail{color:#fd1212;} /* 내역보기 > 충전/사용 내역보기 */ .comn_tbl_wrap .sxn_use{font-weight:500; color:#ff0517;} .comn_tbl_wrap .sxn_charg{font-weight:500; color:#037efc;} /** 컨텐츠 테이블 공통 끝 **/ /*** 컨텐츠 안내 및 툴바 ***/ /* 영역 */ .cont_prev_tool_wrap{position:relative; margin:10px 0;} .cont_prev_tool_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .cont_prev_tool_wrap > *{line-height:45px;} .cont_prev_tool_wrap .align_left{float:left;} .cont_prev_tool_wrap .align_right{float:right;} /* 프리뷰 안내 */ .cont_prev_tool_wrap .info_prev_nm{font-size:18px; color:#222;} .cont_prev_tool_wrap.has_btn .info_prev_nm{position:absolute; bottom:-9px;} .info_prev_nm span{margin-left:5px;} /* 컨텐츠 툴바 */ .cont_tool_lst{font-size:0;} .cont_tool_lst > li{display:inline-block; width:200px; margin-right:10px; font-size:18px; vertical-align:middle;} .cont_tool_lst > li:last-child{margin-right:0;} /*** 컨텐츠 안내 및 툴바 끝***/ /* 수정 및 삭제 등 상태 버튼 리스트 */ .comn_btn_sta_lst li{width:105px; margin-right:0.625rem;} .comn_btn_sta_lst li:last-child{margin-right:0;} .comn_tbl_wrap table .comn_btn_sta_lst{padding:0 0.625rem;} /** 안내 영역 **/ /* 영역 */ .comn_cont_info_outer{margin-top:50px;} .comn_cont_info_inner{padding:20px 20px 24px 20px; background-color:#fafafa; border-top:1px solid #bfbfbf;} /* 안내 타이틀 */ .comn_cont_info_outer .comn_cont_info_ttl span{color:#019478;} /* 안내문 */ .comn_cont_info_dfnt_lst{margin-bottom:24px;} .comn_cont_info_dfnt_lst:last-child{margin-bottom:0;} .comn_cont_info_dfnt_lst dt{font-size:1.125rem; font-weight:500; color:#ed2373;} .comn_cont_info_dfnt_lst dt .point_bullet{display:inline-block; margin-right:10px; width:20px; height:20px; line-height:20px; text-align:center; font-size:8px; background-color:#ed2373; color:#fff; border-radius:50%; vertical-align:middle;} .comn_cont_info_dfnt_lst dd{margin-left:33px; color:#222;} .comn_cont_info_outer .comn_cont_info_ttl{margin-bottom:25px; font-size:24px; line-height:28px; text-align:center; color:#323232;} /* 안내 영역 속 도표 */ .comn_cont_tbl_wrap{margin:0 20px 0 20px;} .comn_cont_tbl_wrap .comn_tbl_wrap table{background-color:#fff;} /* 안내문 */ .sm_gud_lst li{margin-bottom:0.625rem; font-size:1rem; line-height:28px; color:#222;} .sm_gud_lst li:last-child{margin-bottom:0;} .gud_badge{display:inline-block; min-width:10px; margin-right:0.625rem; padding:3px 7px; font-size:12px; font-weight:700; line-height:1; color:#fff; text-align:center; white-space:nowrap; vertical-align:baseline; background-color:#9e9e9e; border-radius:10px;} /** 안내 영역 끝 **/ /* 조건 선택 영역 */ .comn_optin_box_outer{padding:30px 45px; border:1px solid #c6c6c6;} /* 문자 이미지 */ .ico_msg_short{display:inline-block; text-indent:-9999px; width:48px; height:41px; background:url('image/ico_msg_short.png') no-repeat center; background-size:contain;} .ico_msg_long{display:inline-block; text-indent:-9999px; width:48px; height:41px; background:url('image/ico_msg_long.png') no-repeat center; background-size:contain;} .ico_msg_photo{display:inline-block; text-indent:-9999px; width:48px; height:41px; background:url('image/ico_msg_photo.png') no-repeat center; background-size:contain;} /*** [서브 영역 공통 끝 ] ***/ /*** [문자보내기 공통] ***/ /* 단계바 */ #sub .cmn_progress_bar{padding:17px 30px; font-size:1.125rem; font-weight:500; background-color:#d8eb9b; color:#00211b; overflow:hidden;} #sub .cmn_progress_bar li{position:relative; padding-right:36px;} #sub .cmn_progress_bar li:after{content:""; display:inline-block; position:absolute; top:50%; right:0; width:36px; height:38px; background:url('image/ico_arrow_right_w.png') no-repeat center; background-size:contain; -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); -o-transform:translateY(-50%); transform:translateY(-50%);} #sub .cmn_progress_bar li:last-child:after{display:none;} #sub .cmn_progress_bar li.on:after{background:url('image/ico_arrow_right_g.png') no-repeat center;} #sub .cmn_progress_bar li a{padding:0 25px; font-size:18px; color:#00211b;} #sub .cmn_progress_bar li:first-child a{padding-left:0;} #sub .cmn_progress_bar li.on a{font-size:21px; color:#019478;} /* 작성 중 문자 안내문 */ .bas_sns_sendg_info_wrap .comn_cont_info_outer{margin-top:20px;} .bas_sns_sendg_info_wrap .ltst_tmp_list_wrap .comn_cont_info_inner:after{content:""; display:block; clear:both; overflow:hidden;} .bas_sns_sendg_info_wrap .ltst_tmp_list_wrap .comn_cont_info_dfnt_lst{float:left; margin-bottom:0;} .bas_sns_sendg_info_wrap .comn_cont_info_dfnt_lst dt a, .bas_sns_sendg_info_wrap .comn_cont_info_dfnt_lst dt p{display:inline-block; color:#ed2373; vertical-align:middle;} .bas_sns_sendg_info_wrap .ltst_tmp_list_wrap .comn_cont_info_dfnt_lst dt a span{color:#1d1d1d; text-decoration:underline;} .bas_sns_sendg_info_wrap .info_close_wrap{float:right; width:60px;} .bas_sns_sendg_info_wrap .info_close_wrap a{padding:3px 0; color:#ed2373 !important; border-color:#ed2373 !important;} /*** [문자 보내기 공통 끝] ***/ /*** [문자 보내기 > 회원선택] ***/ /* 공통 */ /* .addn_mem_box_wrap{height:250px;} */ /* 일반 문자 전송 > step1 회원 선택 > 주소록에서 추가 */ /* .card_bas_srch_mem_addn .card-body{height:352px; overflow:hidden;} */ .table-scroll {height: 350px; overflow-y: auto;} .table-scroll.table-scroll-220px {height: 220px;} .card_bas_srch_mem_addn .Okdc_mem_adden .card-body .addn_mem_box_wrap {height:230px;} .addn_mem_box_wrap .table .addn_mem_tb_mem_count{width:30%;} .addn_mem_box_wrap .table .addn_mem_tb_add{width:7.5%;} /* 일반 문자 전송 > step1 회원 선택 > 검색으로 회원 추가 */ .addn_mem_optn_wrap .form_optn_lst .srchvalu_srch{width:345px;} /* 일반 문자 전송 > step1 회원 선택 > 직접 입력으로 회원 추가 */ .direc_addn_form_wrap{height:277px;} /* 일반 문자 전송 > step1 회원 선택 > 추가된 회원 */ .sh_mem_chc_form_body{min-height:460px;} /* 일반 문자 전송 > step1 회원 선택 > 추가된 회원 + 외주 소스 */ .addn_mem_cfm_wrap .message_info p:first-child{color:#ed2373; font-size:1.125rem; margin:10px 5px;} .addn_mem_cfm_wrap .message_info p:last-child{color:#222; font-weight:300; letter-spacing:-1.5px;} .addn_mem_cfm_wrap .message_info span{display:inline-block; width:20px; height:20px; background:url('image/ico_info.png') no-repeat 50%; vertical-align:middle; margin-right:7px;} /*** [문자 보내기 > 회원선택 끝] ***/ /*** [문자 보내기 > 최근 발송 문구] ***/ .sub2 .cmn_box_wrap .ct_box2{padding:30px;} .sub2 .cmn_box_wrap .ct_box2 .common_pager{margin-top:0;} .sub2 .cmn_box_wrap .ct_box2 .search_btn:last-child{margin-left:20px;} .sub2 .message_copy_ex{height:24px;} .sub2 .message_copy_ex span{letter-spacing:-1px;} .sub2 .message_copy_ex span i{margin-right:0.625rem;} .sub2 .cmn_box_wrap .ct_box2 .message_copy textarea{background-color:#fff;} /*** [문자 보내기 > 최근 발송 문구 끝] ***/ /*** [** 외주 파일 : 문자 보내기] ***/ /* sub common */ .sms_sendg_cont_wrap .red_orange_btn { background-color: #ff5d16; border-radius: 3px; color: #fff; font-size: 1rem; font-weight: 500; cursor: pointer; text-align: center; display: inline-block; padding: 0 30px; } .sms_sendg_cont_wrap .blue_green_btn { background-color: #1accaa; border-radius: 3px; color: #fff; font-size: 1rem; font-weight: 500; cursor: pointer; text-align: center; padding: 12px 30px; display: inline-block; } .sms_sendg_cont_wrap .selected_ct li{ background-color: #ffaa5e; border-radius: 50px; margin: 0 20px 20px 0; padding: 0 22px 0 34px; color: #fff; font-weight: 400; line-height: 44px; text-align: center; } .sms_sendg_cont_wrap .selected_ct span { text-indent: -9999px; background: url(image/ico_member_close.png) no-repeat; background-size: cover; display: inline-block; width: 19px; height: 19px; vertical-align: middle; margin-left: 20px; position: relative; top: -2px; cursor: pointer; } .sms_sendg_cont_wrap .send_meth input[type="checkbox"]+label::before { width: 19px; height: 19px; content: " "; display: inline-block; background: url(image/ico_cb.png) no-repeat; vertical-align: top; margin-right: 10px; } .sms_sendg_cont_wrap .send_meth input[type="checkbox"]:checked+label::before { background: url(image/ico_cb_checked.png) no-repeat; } .sms_sendg_cont_wrap .send_meth input[type="radio"]+label::before { width: 20px; height: 20px; border-radius: 50%; border: 1px solid #019478; content: " "; display: inline-block; position: relative; margin-right: 12px; vertical-align: middle; } .sms_sendg_cont_wrap .send_meth input[type="radio"]:checked+label::before { background-color: #019478; } .sms_sendg_cont_wrap input[type="radio"]{display:none;} .sms_sendg_cont_wrap select { height: 40px; border: 1px solid #c1c1c1; font-size: 1rem; color: #323232; padding: 0 10px 0 15px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents p::-webkit-scrollbar-track { height: 70px; } .sms_sendg_cont_wrap .cmn_progress_bar { margin-bottom: 50px;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_phone { background: url(image/img_mobile_bg.png) no-repeat 50%; width: 367px; height: 606px; position: relative; padding: 83px 24px 15px 24px; color: #323232; font-size: 1rem; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number span { font-weight: 500; margin-right: 20px; } .sms_sendg_cont_wrap .cmn_box_wrap:after {content: ""; display: block; clear: both;} .sms_sendg_cont_wrap .cmn_box_wrap > div { float: left; } .sms_sendg_cont_wrap .message_copy_ex { margin-bottom:10px; } /* group_member - Step1:회원선택 - 단체회원(group_member_radio)에서 선택*/ .sms_sendg_cont_wrap .cmn_box_wrap > .group_box { margin-top: 30px; width: 100%; border: 1px solid #c6c6c6; } .sms_sendg_cont_wrap .cmn_box_wrap > .group_box > div { float: right; } .sms_sendg_cont_wrap .cmn_box_wrap .group_title { width: 225px; position: absolute; background-color: #dfdfdf; color: #363636; font-size: 1.313rem; font-weight: 500; line-height: 151.5px; text-align: center; } .sms_sendg_cont_wrap .cmn_box_wrap .group_ct { padding: 15px 30px; font-size: 1.125rem; color: #333; font-weight: 300; width: 1073px; } /* 모바일 박스 */ .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 { width:405px; padding-right: 40px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number { padding: 10px 0; border-bottom: 1px solid #dfdfdf; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_phone select { width: 236px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_phone select:-ms-input-placeholder { width: 236px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents { margin-top: 20px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents p { height: 320px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents textarea{ border: none; font-weight: 300; width: 100%; max-height: 320px; font-size: 1rem; overflow-y:scroll; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents textarea::placeholder { font-size: 1rem; color: #000; line-height: 1.6; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_state { margin-top: 20px; font-size: 1rem; color: #323232; font-weight: 300; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_state span { color: #000; font-weight: 400; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_save .save_btn{ width: 163px; height: 38px; background: #ee2d30; color: #fff; line-height: 37px; margin-top: 25px; font-weight: 500; font-size: 1rem; position: relative; left: 50%; transform: translateX(-50%); outline:0; border:0;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_save .save_btn span { text-indent: -9999px; display: inline-block; background: url(image/ico_save.png) no-repeat 50%; width: 19px; height: 20px; position: relative; top: 9px; margin-right: 10px; } .sms_sendg_cont_wrap .cmn_box_wrap .message_info p:first-child { color: #ed2373; font-size: 1.125rem; margin: 24px 0 12px; } .sms_sendg_cont_wrap .cmn_box_wrap .message_info p:last-child { color: #222; font-weight: 300; } .sms_sendg_cont_wrap .cmn_box_wrap .message_info span { display: inline-block; width: 20px; height: 20px; background: url(image/ico_info.png) no-repeat 50%; vertical-align: middle; margin-right: 7px; } /* 문자 박스 */ .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2_wrap { width:calc(100% - 405px); } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2_wrap .ct_box2 { width: 100%; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 { width:calc(100% - 405px); background-color: #fcf8f0; padding: 30px 30px 0 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_title { font-size: 1.75rem; font-weight: 500; margin-bottom: 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .text_search_input { width: 590px; height: 40px; box-sizing: border-box; margin-bottom: 20px; vertical-align:top; padding:0 0 0 10px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .search_btn, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .select_del { width: 105px; height: 40px; padding: 0!important; line-height: 40px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .search_btn { margin-left: 10px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .select_del { margin-left: 15px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy ul { overflow: hidden; width: 832px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy li { float: left; width: 196px; margin-right: 16px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy li:nth-child(4n) { margin-right: 0; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy .m_title { width: 163px; height: 31px; padding-left: 10px; vertical-align:middle; padding:0 0 0 10px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy .mc4 { vertical-align:middle; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy textarea { width: 196px; height: 160px; border: 1px solid #c1c1c1; padding: 20px; font-size: 1rem; line-height: 1.4; overflow:auto; resize: none;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy .message_copy_tmp_ct textarea { width: 196px; height: 160px; border: 3px solid #1accaa; padding: 20px; font-size: 1rem; line-height: 1.4; overflow:auto; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy textarea::placeholder { color: #333; font-size: 1rem; font-weight: 300; line-height: 1.4; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy input[type="checkbox"]+label::before { vertical-align: middle !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy input[type="checkbox"]+label+.m_title { font-size: 1rem; color: #666; font-weight: 300; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy input[type="checkbox"]:checked+label+.m_title::placeholder { color: #333; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .copy_active_btn { width: 105px; height: 38px; background: #bababa; color: #fff; font-weight: 500; line-height: 38px; text-align: center; margin: 10px auto 30px; cursor: pointer; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 { margin-bottom: 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 { width: 100%; height: 133px; border: 1px solid #c6c6c6; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_title { line-height: 133px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .test_ex { font-size: 1.125rem; color: #666; font-weight: 300; margin-bottom: 20px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct { padding: 20px 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .test_ex span { color: #ed2373; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .test_btn { height: 50px; margin-left: 30px; line-height: 50px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct .chosen-select { width: 263px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 { width: 100%; margin-top: 40px; border-top: 1px solid #bfbfbf; padding-top: 30px; padding-bottom: 30px; background-color:#fafafa; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number .chosen-container { width:236px !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct .chosen-container { width:263px !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .chosen-container { width:98px !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .select_date + .chosen-container { width:196px !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .select_time + .chosen-container { margin:0 15px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .chosen-container-single .chosen-single div b:after, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct .chosen-container-single .chosen-single div b:after, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number .chosen-container-single .chosen-single div b:after{ padding:7px 0; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .chosen-container-single .chosen-single{ padding:7px 0; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct .chosen-container-single .chosen-single, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number .chosen-container-single .chosen-single { padding:7px 0 7px 20px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box3 .group_ct .chosen-container .chosen-results li, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_number .chosen-container .chosen-results li{ padding-left:20px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 p { font-size: 1.5rem; color: #019478; font-weight: 500; text-align: center; margin-bottom: 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .send_meth { font-size: 1.125rem; color: #222; font-weight: 500; display: inline-block; position: relative; left: 50%; transform: translateX(-50%); margin-bottom: 20px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .send_meth label:first-of-type { margin-right: 35px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .send_meth input[type="radio"]+label::before { margin-right: 4px !important; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .send_date { text-align: center; margin-bottom: 30px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .send_btn { position: relative; left: 50%; transform: translateX(-50%); display: block; padding: 0; width: 132px; height: 45px; line-height: 45px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .select_date { width: 196px; } .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .select_time, .sms_sendg_cont_wrap .cmn_box_wrap .ct_box4 .select_min { width: 98px; margin-left: 20px; } /* sms_sendg_cont_wrap - dialog */ .sms_sendg_cont_wrap .send_finish { display: none; } .sms_sendg_cont_wrap .ui-dialog .dialog_inner { padding: 30px 50px 17px 50px; } .sms_sendg_cont_wrap .ui-dialog .dia_ct { text-align: center; } .sms_sendg_cont_wrap .send_finish .dia_ct p { font-size: 1.5rem; font-weight: 500; color: #01b4d0; } .sms_sendg_cont_wrap .send_finish .dia_ct span { font-size: 1.125rem; font-weight: 300; color: #373737; display: block; margin: 30px 0 50px; } .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn { overflow: hidden; } .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn > div { float: left; width: 216px; height: 44px; } .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn > div:first-child { margin-right: 14px; } .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn a{ width: 100%; height: 44px; line-height: 44px; display: block; font-size: 1.125rem; border: 1px solid #01b4d0; color: #01b4d0; } .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn a:hover, .sms_sendg_cont_wrap .ui-dialog .dia_ct .btn a:active{ background-color: #01b4c0; color: #fff; } .sms_sendg_cont_wrap .plus_group { display: none; } .sms_sendg_cont_wrap .plus_group .dia_ct p { font-size: 1.125rem; color: #373737; margin-bottom: 37px; } .sms_sendg_cont_wrap .plus_group .dia_ct p span { color: #01b4d0; } .sms_sendg_cont_wrap .plus_group .dia_ct .group_name span { display: block; color: #373737; text-align: left; margin-bottom: 10px; } .sms_sendg_cont_wrap .plus_group input { width: 440px; height: 40px; margin-bottom: 30px; font-size: 1.125rem; } .sms_sendg_cont_wrap .plus_group input::placeholder { font-size: 1.125rem; color: #666; } .sms_sendg_cont_wrap .plus_group .dia_ct .btn div { position: relative; left: 50%; transform: translateX(-50%); } /*** [** 외주 파일 : 문자 보내기 끝] ***/ /*** [내역보기 공통] ***/ /* 영역 */ .dsc_dspy_optin_box_outer{padding:20px;} /** 조건 선택 영역 - 첫번째 줄 **/ /* 날짜 지정 */ .sendg_dsc_txt_wrap{max-width:270px; margin-right:15px;} .sendg_dsc_txt_inner .img_wrap{display:inline-block; text-indent:-9999px; width:50px; height:50px; margin-right:10px; background:url('image/ico_cal.png') no-repeat center; background-size:contain;} .sendg_dsc_txt_wrap .date_selct_wrap{width:132px; margin-right:5px;} .sendg_dsc_txt_txt{font-size:21px; line-height:26px; font-weight:500; color:#1d1d1d; vertical-align:middle;} /* 옵션 선택 */ .sendg_dsc_optn{width:147px;} .sendg_dsc_selct_wrap{width:135px;} .sendg_dsc_optn + .sendg_dsc_selct_wrap{margin-left:24px;} .sendg_dsc_wide_selct_wrap{width:432px;} /* 버튼 */ .sendg_dsc_inp_btn_wrap .btn_comn_cond{margin-left:10px; width:105px;} .sendg_dsc_inp_btn_wrap .btn_comn_cond a{display:block; padding:21px 15px; font-size:21px; font-weight:400; text-align:center; background-color:#ff5d16; color:#fff;} .btn-info {background-color: #1accaa; color: #fff;} /* 검색바 */ .sendg_dsc_inp_srch_wrap{width:232px;} .sendg_dsc_inp_srch_wrap input{padding:20px 12px 20px 20px;} .sendg_dsc_selct_wrap + .sendg_dsc_inp_srch_wrap{margin-left:24px;} /** 조건 선택 영역 - 첫번째 줄 끝 **/ /* 도표 */ .dsc_dspy_tbl_wrap{margin-top:50px} /*** [내역보기 공통 끝] ***/ /*** [충전/사용 내역보기] ***/ /* 내역 테이블 */ .charg_use_dsc_dspy_tbl_wrap .comn_tbl_wrap table .sxn{width:7.5%;} .charg_use_dsc_dspy_tbl_wrap .comn_tbl_wrap table .dsc{width:69%;} .charg_use_dsc_dspy_tbl_wrap .comn_tbl_wrap table td{padding:20px 0;} .charg_use_dsc_dspy_tbl_wrap .comn_tbl_wrap table td.dsc{padding-left:43px; text-align:left;} /*** [충전/사용 내역보기 끝] ***/ /*** [전송 내역 보기] ***/ /* 전송 내역 테이블 */ .sendg_dsc_tbl_wrap table tr th.dt{width:7.5%;} .sendg_dsc_tbl_wrap table tr th.num{width:10.5%;} .sendg_dsc_tbl_wrap table tr th.clsf{width:7%;} .sendg_dsc_tbl_wrap table tr th.sxn{width:6.5%;} .sendg_dsc_tbl_wrap table tr th.sendg_exps, .sendg_dsc_tbl_wrap table tr th.sendg_cnt, .sendg_dsc_tbl_wrap table tr th.rsl{width:8.5%;} .sendg_dsc_tbl_wrap table tr th.sta, .sendg_dsc_tbl_wrap table tr th.det_dspy{width:6%;} .sendg_dsc_tbl_wrap table tr td.cont{padding:0 43px 0 23px;} .sendg_dsc_tbl_wrap table tr td.cont span{display:block; max-height:22px; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical; white-space:normal; word-break:break-all; word-wrap:break-word; word-break:break-word;} .sendg_dsc_tbl_wrap .det_dspy a:hover{text-decoration:underline;} /*** [전송 내역 보기 끝] ***/ /*** [충전/사용 내역보기 > 상세보기] ***/ /* 전송 내용 상세보기 */ .sendg_cont_det_dspy_outer_wrap{margin-bottom:36px;} /* 전송 내용 상세보기 > 영역 */ .sendg_cont_det_dspy_wrap{font-size:0; background-color:#f0f0f0;} .sendg_cont_det_dspy_wrap > div{display:inline-block; width:50%; padding:50px; font-size:1rem; vertical-align:top;} /**- ok멤버 문자서비스 -**/ /*ok멤버 문자서비스 공통 */ .sendg_cont_det_nrml_box{padding:30px; padding-left:40px; background-color:#ffe9be; border-radius:15px;} /* ok멤버 문자서비스 > ok멤버 문자서비스 */ .sendg_cont_det_dspy_outer{position:relative;} .sendg_cont_det_dspy_outer:after{content:""; position:absolute; top:40px; right:-1px; width:1px; height:370px; background-color:#dedede;} .sendg_cont_det_dspy_inner{font-size:0;} .sendg_cont_det_dspy_inner > *{display:inline-block; font-size:1rem; vertical-align:top;} .sendg_cont_det_dspy_bg_wrap .img_wrap{position:relative; background:url('/common/css/image/ico_msg_phone.png') no-repeat top center; width:200px; height:369px; background-size:contain;} .sendg_cont_det_dspy_bg_wrap .img_wrap span{display:none;} .sendg_cont_det_nrml_box_outer{margin-top:10px; margin-left:-15px;} .sendg_cont_det_nrml_box_outer .sendg_cont_det_nrml_box{width:365px;} .sendg_cont_det_nrml_msg_box dt{margin-bottom:1rem; padding-bottom:1rem; font-size:28px; font-weight:400; color:#d72426; border-bottom:1px solid #fff;} .sendg_cont_det_nrml_msg_box dd{height:218px; overflow-y:scroll; overflow-x:hidden} /* ok멤버 문자서비스 > 문자 정보 리스트 */ .sendg_cont_det_dspy_lst_outer{position:relative;} .sendg_cont_det_dspy_lst_outer:after{content:""; position:absolute; top:40px; left:1px; width:1px; height:370px; background-color:#fff;} .sendg_cont_det_dspy_lst_outer .sendg_cont_det_nrml_box{margin-top:10px; padding-bottom:20px;} .sendg_cont_det_dspy_lst li{border-bottom:1px solid #fff;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst{padding-top:9px; padding-bottom:9px; font-size:0;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst > *{display:inline-block; font-size:1.125rem; vertical-align:middle;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst dt{position:relative; width:135px; padding-left:15px; padding-bottom:5px; font-size:0; color:#d72426;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst dt:after{content:""; position:absolute; bottom:-10px; right:0; width:1px; height:9px; background-color:#fff;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst dt > *{display:inline-block; font-size:1.125rem; vertical-align:middle;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst dt .txt{padding-left:15px;} .sendg_cont_det_dspy_lst .sendg_cont_det_dspy_dfnt_lst dd{padding-left:25px; font-weight:500;} /**- ok멤버 문자서비스 끝 -**/ /* 전송 대상 개별 내역 */ .sendg_obj_indv_dsc_tbl_wrap table .dt{width:10%;} .sendg_obj_indv_dsc_tbl_wrap table .clsf, .sendg_obj_indv_dsc_tbl_wrap table .sxn{width:15%;} .sendg_obj_indv_dsc_tbl_wrap table .sendg_rsl{width:16%;} /* 전송 대상 개별 내역 > 전송 결과 */ .sendg_obj_indv_dsc_tbl_wrap table .sendg_rsl .img_wrap img{margin:0 auto;} /*** [충전/사용 내역보기 > 상세보기 끝] ***/ /*** [발신번호관리] ***/ /** 발신번호관리 도표 **/ /* 도표 여백 */ .send_num_mngt_wrap .comn_tbl_wrap table tr td{padding:22px 0;} .send_num_mngt_wrap .comn_tbl_wrap table tr td:not(.sequ){padding:11.5px 0;} .send_num_mngt_wrap .comn_tbl_wrap table tr td.no_num{padding:0;} /* 도표 영역 */ /* .send_num_mngt_wrap .sequ{width:7.5%;} .send_num_mngt_wrap tr th:not(.sequ), .send_num_mngt_wrap tr td:not(.sequ){width:calc(100% / 3 - 7.5%);} */ /* 이름 수정 */ .send_num_mngt_nm_wrap .send_num_mngt_nm_inpt{margin:-6px 5px;} .send_num_mngt_nm_wrap .send_num_mngt_nm_inpt input{padding:5px;} .send_num_mngt_nm_wrap .send_num_mngt_nm_btn{margin-top:-10px; margin-bottom:-10px;} .send_num_mngt_nm_wrap .send_num_mngt_nm_btn a{padding:9px 38px; line-height:revert;} /* 발신번호 등록 */ .send_num_mngt_wrap .no_num a{display:block; width:193px; margin:0 auto; padding:5px 0; font-size:0; text-align:center; background-color:#1accaa; color:#fff; border:1px solid #1accaa;} .send_num_mngt_wrap .no_num a > *{display:inline-block; font-size:1rem; vertical-align:middle;} .send_num_mngt_wrap .no_num a .img_wrap{display:inline-block; text-indent:-9999px; width:33px; height:33px; margin-right:15px; background:url('image/ico_call.png') no-repeat center; background-size:contain;} /* 등록일 */ .send_num_mngt_wrap .regs_dt .date_wrap{min-width:72px;} .send_num_mngt_wrap table .btn_sta_del{padding:9px 38px; line-height:revert; background-color:#ff5d16; color:#fff; border:1px solid #ff5d16;} .btn_warning {border:1px solid #d72426 !important; background-color: #d72426 !important;} /** 발신번호관리 도표 끝 **/ /** 발신번호관리 > 발신번호 등록 팝업 **/ /* 발신번호 등록하기 */ .pop_send_num_mngt_wrap{margin-top:-18px;} .send_num_regs_gud{line-height:45px; font-size:1.125rem; font-weight:300; color:#373737;} .send_num_regs_gud strong{display:block; line-height:37px; font-size:24px; font-weight:500; color:#01b4d0;} .send_num_regs_selt_lst_wrap{margin-top:21px;} .send_num_regs_selt_lst_wrap p{margin-bottom:13px; font-size:1.125rem; line-height:24px; font-weight:500; font-style:normal; color:#373737;} .send_num_regs_selt_lst{margin:0 auto; font-size:0;} .send_num_regs_selt_lst > li{display:inline-block; font-size:1.125rem;} .send_num_regs_selt_lst > li:first-child{margin-right:25px;} .send_num_regs_selt_lst > li > a{display:block; min-width:210px; padding:8px; font-size:17px; text-align:center; color:#01b4d0; letter-spacing:-1px;} .send_num_regs_selt_lst > li a.active{font-weight:300; background-color:#01b4d0; color:#fff !important;} /* 휴대폰 번호 */ .mp_num_regs_det_info{display:none; margin-top:20px; padding:0 24px;} .mp_num_regs_det_info:before{content:""; display:block; width:100%; height:1px; margin-bottom:20px; background-color:#c6c6c6;} .mp_num_regs_det_info .mp_num_regs_det_inpt{width:327px; margin-right:25px;} .mp_num_regs_det_info .mp_num_regs_det_inpt input{padding:4px 20px; font-size:16px; color:#666;} .mp_num_regs_det_info .btn_comn_pop{width:103px;} .mp_num_regs_det_info .btn_comn_pop a{display:block; padding:7px 0; text-align:center; background-color:#1accaa; color:#fff; border:1px solid #1accaa;} /* 휴대폰 번호 > 번호 인증 */ .num_auth_inp_form_wrap{margin-top:10px;} .num_auth_inp_form_wrap .num_auth_inp_btn{width:85px; margin-left:0.625rem;} .num_auth_inp_form_wrap .num_auth_inp_btn a{border-radius:0} .num_auth_inp_form_wrap .num_auth_inp_btn .btn_sta_upd{color:#fff;} .num_auth_inp_form_wrap .num_auth_inp_btn .btn_sta_del{color:#fff;} /* 일반 전화 등록 */ .genl_num_regs_det_info{display:none; margin-top:20px;} .genl_num_regs_det_info .genl_num_regs_det_info_box{margin:23px 23px 20px; padding:25px 0;background-color:#e1e1e1; color:#373737;} .genl_num_regs_det_info .genl_num_regs_det_info_box strong{color:#ed2373;} .genl_num_regs_det_info .genl_num_regs_det_info_box .sentn_sxn{margin-top:12px;} .genl_num_regs_det_info .genl_num_regs_det_btn_wrap{width:215px; margin:0 auto;} .genl_num_regs_det_info .genl_num_regs_det_btn_wrap a{padding:8px 0;} /** 발신번호관리 > 발신번호 등록 팝업 끝 **/ /*** [발신번호관리 끝] ***/ /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 관리] ***/ /* 조건 선택 영역 - 첫번째 줄 */ .sendg_dsc_input_wrap{width:395px; margin-left:25px;} /* 표 */ .mem_addr_bas_list_tbl_wrap th, .mem_addr_bas_list_tbl_wrap td{width:18%;} .mem_addr_bas_list_tbl_wrap .tb_optn{width:7.5%;} /* 새 그룹 만들기 팝업 */ .pop_grp_nm_wrap .pop_grp_nm_inner .pop_grp_nm_gud{font-size:1rem; line-height:24px; color:#373737;} .pop_grp_nm_wrap .pop_grp_nm_inner .pop_grp_nm_box{padding:0 0.9375rem 0 1.25rem;} .pop_grp_nm_wrap .pop_grp_nm_inner .pop_grp_nm_box input{width:340px;} /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 관리 끝] ***/ /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 상단 공통] ***/ /* 연락처 등록 상단 탭 공통 :: 영역 */ .grp_ctc_mngt_wrap{position:relative; padding-bottom:0.625rem; border-bottom:1px solid #c6c6c6;} /* 연락처 등록 상단 탭 공통 :: 오른쪽 탭 */ .grp_ctc_mngt_btn_posn_lst{position:absolute; bottom:10px; right:0;} .grp_ctc_mngt_btn_lst li{margin-right:23px; line-height:20px;} .grp_ctc_mngt_btn_lst li:last-child{margin-right:0;} .grp_ctc_mngt_btn_lst input[type="radio"] + label:before{content:""; display:inline-block; width:20px; height:20px; background-color:#fff; border:1px solid #02a0fa; border-radius:50%;} .grp_ctc_mngt_btn_lst input[type="radio"]:checked + label:before{background-color:#02a0fa;} .grp_ctc_mngt_btn_lst input[type="radio"] + label span{margin-left:13px; font-size:1.125rem; font-weight:normal; vertical-align:top;} .grp_ctc_mngt_btn_lst input[type="radio"]{display:none;} /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 상단 공통] ***/ /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 직접입력] ***/ /* 영역 */ .grp_mngt_ctc_regs_optn_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .grp_mngt_ctc_regs_optn_wrap .grp_mngt_ctc_regs_optn_outer{float:left;} .grp_mngt_ctc_regs_optn_wrap .grp_mngt_ctc_regs_separ_wrap{float:right; margin-top:5px;} /* 옵션 공통 */ .grp_mngt_ctc_regs_optn_wrap dt{margin-right:40px; font-size:1.125rem; line-height:26px; font-weight:normal; color:#222;} /* 그룹선택 */ .grp_mngt_ctc_regs_optn_dfnt_lst .chosen-container-single .chosen-single, .grp_mngt_ctc_regs_optn_dfnt_lst .chosen-container-active.chosen-with-drop .chosen-single{width:235px; padding:10px; padding-left:20px; border:1px solid #c1c1c1;} .grp_mngt_ctc_regs_optn_dfnt_lst .chosen-container-single .chosen-single div b:after{padding:10px 0;} .grp_mngt_ctc_regs_optn_inner .btn_bg_Java{width:132px; margin-left:10px; padding:9.5px 0;} /* 구분자 */ .grp_mngt_ctc_regs_separ_dfnt_lst{text-align:right;} .grp_ctc_mngt_btn_separ_dct_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .grp_ctc_mngt_btn_separ_dct_wrap .grp_ctc_mngt_btn_separ_optn_wrap{float:left; margin-right:0.625rem;} .grp_ctc_mngt_btn_separ_dct_wrap .grp_ctc_mngt_btn_separ_inner_btn_wrap{float:right; visibility:hidden;} .grp_ctc_mngt_btn_separ_dct_wrap .grp_ctc_mngt_btn_separ_inner_btn_wrap.JS-visible{visibility:visible;} .grp_ctc_mngt_btn_separ_dct_wrap .grp_ctc_mngt_btn_separ_inner_btn_wrap input{width:235px; padding:10px; padding-left:20px; border:1px solid #c1c1c1;} .grp_mngt_ctc_regs_separ_dfnt_lst .grp_ctc_mngt_btn_lst li label{line-height:42px;} .grp_mngt_ctc_regs_separ_dfnt_lst .grp_ctc_mngt_btn_lst li label:before{vertical-align:middle;} /* 연락처 목록 */ .grp_ctc_mngt_ctc_lst_wrap{margin-top:0.625rem;} .grp_ctc_mngt_ctc_lst_wrap textarea{padding:36px 30px; font-size:1.125rem; line-height:26px; color:#323232; border:1px solid #c6c6c6;} /* 하단 안내문 및 입력완료 버튼 */ .grp_ctc_mngt_bottom_wrap:after{content:""; display:block; clear:both; overflow:hidden;} .grp_ctc_mngt_bottom_wrap{margin-top:20px;} .grp_ctc_mngt_bottom_wrap .grp_ctc_mngt_bottom_gud_wrap{float:left;} .grp_ctc_mngt_bottom_wrap .grp_ctc_mngt_bottom_btn_wrap{float:right;} .grp_ctc_mngt_bottom_wrap .grp_ctc_mngt_bottom_btn_wrap a{width:175px;} /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 직접입력] ***/ /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 엑셀 일괄 등록] ***/ /* 영역 */ .sendg_dsc_bg_wrap{border:1px solid #c6c6c6;} .sendg_dsc_bg_wrap .comn_optin_box_outer{margin:0.625rem; padding:30px 44px; background-color:#f0f0f0; border:0;} .sendg_dsc_bg_wrap .sendg_dsc_selct_line > *{vertical-align:top;} /* 공통 */ .sendg_dsc_selct_line_ttl{font-size:24px; line-height:26px; font-weight:normal; color:#323232;} .sendg_dsc_bg_wrap .sendg_dsc_inp_btn_wrap a{min-width:225px; padding:8px 5px; font-weight:normal;} /** 엑셀 샘플 파일 다운로드 **/ /* 영역 */ .sendg_dsc_selct_line_down_wrap{position:relative; width:33%; padding-right:40px;} .sendg_dsc_selct_line_down_wrap:after{content:""; position:absolute; top:0; right:-1px; width:1px; height:126px; background-color:#dedede;} /* 내부 영역 */ .sendg_dsc_selct_line_down_wrap .sendg_dsc_inp_outer:after{content:""; display:block; clear:both; overflow:hidden;} .sendg_dsc_selct_line_down_wrap .sendg_dsc_inp_outer .sendg_dsc_inp_txt_wrap{} .sendg_dsc_selct_line_down_wrap .sendg_dsc_inp_outer .sendg_dsc_inp_btn_wrap{width:273px; margin-top:23px; margin-left:66px;} /* 다운로드 텍스트 */ .sendg_dsc_inp_txt_wrap .sendg_dsc_down_img_wrap{display:inline-block; text-indent:-9999px; width:47px; height:50px; margin-right:17px; background:url('image/img_download.png') no-repeat center; background-size:contain; vertical-align:middle;} /** 엑셀 샘플 파일 다운로드 끝 **/ /** 작성한 엑셀 파일 업로드 **/ /* 영역 */ .sendg_dsc_selct_line_up_wrap{position:relative; width:67%; padding-left:49px;} .sendg_dsc_selct_line_up_wrap:after{content:""; position:absolute; top:0; left:1px; width:1px; height:126px; background-color:#fff;} .sendg_dsc_up_img_wrap{display:inline-block; text-indent:-9999px; width:47px; height:50px; margin-right:17px; background:url('image/img_upload.png') no-repeat center; background-size:contain; vertical-align:middle;} /* 내부영역 */ .sendg_dsc_selct_line_up_wrap .sendg_dsc_inp_outer:after{content:""; display:block; clear:both; overflow:hidden;} .sendg_dsc_selct_line_up_wrap .sendg_dsc_inp_outer .sendg_dsc_inp_btn_wrap{float:left;} .sendg_dsc_selct_line_up_wrap .sendg_dsc_inp_outer .sendg_dsc_inp_opt_wrap{float:right;} /* 옵션 */ .sendg_dsc_inp_opt_sel_outer .chosen-container-single .chosen-single{padding:10px 10px 10px 20px;} .sendg_dsc_inp_opt_sel_outer .chosen-container-single .chosen-single div b:after{padding:10px 0;} .sendg_dsc_inp_opt_sel_outer .sendg_dsc_inp_opt_sel_inner{width:220px; margin-right:23px;} .sendg_dsc_inp_opt_sel_outer .sendg_dsc_inp_opt_sel_btn{width:115px;} /* 엑셀 등록 */ .sendg_dsc_inp_regs_wrap{margin-top:28px;} .sendg_dsc_inp_regs_wrap .sendg_dsc_inp_regs_nm{width:360px; margin-right:30px;} .sendg_dsc_inp_regs_wrap .sendg_dsc_inp_regs_nm input{padding:8.5px 10px; background-color:#fff; border-color:#c1c1c1;} .sendg_dsc_inp_regs_wrap .sendg_dsc_inp_regs_btn{width:357px;} .sendg_dsc_inp_regs_wrap .sendg_dsc_inp_regs_btn a{padding:8px 5px;} /* 엑셀 추가 목록 */ .sendg_dsc_info_outer table tr th:not(.regs_dt){width:15%;} .sendg_dsc_info_outer table tr td.upd{padding:0.625rem;} /*** [그룹/연락처관리 > 내 연락처 관리 > 연락처 등록 > 엑셀 일괄 등록 끝] ***/ /*** [이용약관] ***/ .pre_table{margin:5px 0; border:1px solid #ddd; border-collapse:collapse;} .pre_table tr th{padding:5px 15px; text-align:center; border:1px solid #ddd;} .pre_table tr td{padding:5px 15px; border:1px solid #ddd;} /*** [이용약관 끝] ***/ /*** [메인 이미지 버튼 시작] ***/ .loading_btn { border: 0; position: relative; color: #FFFFFF; background-color: transparent !important; background-image: none !important; border-color: transparent; position: absolute; left: 40.5%; top: 17.65%; } .loading_btn div {display: none; } .loading_btn::before, .loading_btn::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .loading_btn_spin { height: 122px; width: 122px; } .loading_btn_spin::before, .loading_btn_spin::after { top: 0; left: 0; } .loading_btn_spin::before { border: 5px solid transparent; } .loading_btn_spin:hover::before { border-top-color: #FF0000; border-right-color: #FF0000; border-bottom-color: #FF0000; transition: border-top-color 0.15s linear, border-right-color 0.15s linear 0.10s, border-bottom-color 0.15s linear 0.20s; } .loading_btn_spin::after { border: 0 solid transparent; } .loading_btn_spin:hover::after { border-top: 5px solid #FF0000; border-left-width: 5px; border-right-width: 5px; transform: rotate(270deg); transition: transform 0.4s linear 0s, border-left-width 0s linear 0.35s, -webkit-transform 0.4s linear 0s; } .loading_btn_spin:hover .loading_btn_circle_text { display: block; animation: fadein 2s; -webkit-animation: fadein 2s;} @-webkit-keyframes fadein { from { opacity:0;} to { opacity:0.45;}} .loading_btn_circle { border-radius: 100%; box-shadow: none; } .loading_btn_circle::before, .loading_btn_circle::after { border-radius: 100%; } .loading_btn_circle_text {width:113px;height:113px;border-radius:75px;margin:0 auto; background-color: #C0133A; opacity: 0.45} /*** [메인 이미지 버튼 끝] ***/ /*********** 2021.06 추가 ************/ /*** [일반문자 전송 > step1 > 작성했던 문자 팝업] ***/ /* 작성했던 문자 리스트 */ .sms_rec_lst{width:100%; margin:0 auto;} .sms_rec_lst > li{padding:13px 20px; border-bottom:1px solid #c6c6c6;} .sms_rec_lst > li:first-child{border-top:1px solid #c6c6c6;} .sms_rec_lst > li:after{content:""; display:block; clear:both; overflow:hidden;} .sms_rec_lst .sms_wrap{float:left; width:80%; text-align:center;} .sms_rec_lst .sms_wrap > a{line-height:31px;} .sms_rec_lst .del_wrap{float:right; width:20%;} .sms_rec_lst .del_wrap > a{padding:2px 0; line-height:revert;} /*** [일반문자 전송 > step1 > 작성했던 문자 팝업 끝] ***/ /*** [내 연락처 관리 > 그룹] ***/ /* 그룹명 */ .mem_grop_nm_outer{margin:20px 0 10px;} .mem_grop_nm_inner > *{font-size:1.75rem; font-weight:500; color:#221613;} .mem_grop_nm_inner i{color:#666;} .mem_grop_nm_inner i + h3{margin-left:5px;} @media screen and (max-width: 1023px){ /* 모바일) 그룹명 */ .mem_grop_nm_outer{margin:10px 0 5px;} } /*** [내 연락처 관리 > 그룹 끝] ***/ /*** [내 연락처 관리 > 연락처 등록] ***/ /* 연락처 등록하기 팝업 */ .ctc_regs_dialogue_wrap .alert_center_txt{margin-bottom:20px;} .ctc_regs_dialogue_wrap table tr{border-bottom:1px solid #c6c6c6;} .ctc_regs_dialogue_wrap table thead tr{border-top:1px solid #c6c6c6;} .ctc_regs_dialogue_wrap table tr th, .ctc_regs_dialogue_wrap table tr td{padding:13px 8px;} .ctc_regs_dialogue_wrap table tr th{text-align:center;} @media screen and (max-width: 1023px){ /* 모바일) 연락처 등록하기 팝업 */ .ctc_regs_dialogue_wrap table tr th, .ctc_regs_dialogue_wrap table tr td{padding:8px 3px;} } /*** [내 연락처 관리 > 연락처 등록 끝] ***/ /*** [문자/이메일 보내기 공통] ***/ /* 단계바 */ @media screen and (max-width: 419px){ #sub .cmn_progress_bar li.on a{font-size:14px !important;} } @media screen and (max-width: 360px){ #sub .cmn_progress_bar li a span{display:none;} #sub .cmn_progress_bar li.on a{font-size:18px !important;} #sub .cmn_progress_bar li.on a span{display:inline-block;} } /*** [문자/이메일 보내기 공통 끝] ***/ /*** [충전/사용 내역보기] ***/ /* 날짜 입력 폼 */ @media screen and (max-width: 419px){ .sub_history .history_date .date_range .date_from{padding-left:2% !important;} .sub_history .history_date .date_range > div > *{font-size:14px;} .sub_history .history_date .date_to label, .sub_history .history_date .date_from label{margin-right:10px;} .sub_history .history_date span{width:20px !important; height:18px !important;} .sub_history .history_date .date_to input, .sub_history .history_date .date_from input, .sub_history .history_date strong{margin-right:0 !important;} } /*** [충전/사용 내역보기 끝] ***/ /*** [전송 내역보기 > 상세] ***/ /* 전송 대상 개별 내역 > 전송결과 */ #sub.sub_history3 .comn_tbl_wrap table tr td.sendg_rsl .img_wrap img{margin:0 auto;} /*** [전송 내역보기 > 상세 끝 ] ***/ /*** [컨텐츠 공통] ***/ /* 텍스트 + 버튼 정렬 구조*/ .comn_txt_btn_in_block .btn_sta_del{display:inline-block; margin-left:10px; padding:0 8px;} @media screen and (max-width: 1023px){ .comn_txt_btn_in_block .btn_sta_del{padding:0 5px; line-height:revert;} } /*** [컨텐츠 공통 끝] ***/ /*** [발신번호 관리] ***/ /* 발신번호 정보 */ #sub.sub_number1 .c_number_wrap .c_number_detail ul li span{position:static !important; width:auto; height:auto; background:none; transform:none;} /*** [발신번호 관리 끝] ***/ /*********** 2021.06 추가 끝 ************/ /*********** 2021.07 수정 ************/ /*** [내 연락처 관리] ***/ /* 그룹명 기본 */ .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap .mem_add_grp_nm_inner:after{content:""; display:block; clear:both; overflow:hidden;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap .mem_add_grp_nm_inner .nm_wrap{float:left; width:calc(100% - 105px); padding-right:5px; text-align:left;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap .mem_add_grp_nm_inner .nm_wrap input{padding:9.5px 20px;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap .mem_add_grp_nm_inner .tot_btn_wrap{float:right; width:105px;} /* 그룹명 수정 */ .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap.mem_add_grp_nm_inp_wrap .mem_add_grp_nm_inner .nm_wrap{width:calc(100% - 215px); margin-top:0;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap.mem_add_grp_nm_inp_wrap .mem_add_grp_nm_inner .tot_btn_wrap{width:215px; font-size:0;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap.mem_add_grp_nm_inp_wrap .mem_add_grp_nm_inner .tot_btn_wrap > *{display:inline-block; width:105px; font-size:16px; vertical-align:middle;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap.mem_add_grp_nm_inp_wrap .mem_add_grp_nm_inner .tot_btn_wrap > *:first-child{margin-right:5px;} .mem_addr_bas_list_tbl_wrap .mem_add_grp_nm_wrap.mem_add_grp_nm_inp_wrap .mem_add_grp_nm_inner .tot_btn_wrap a{padding:9.5px; line-height:unset;} /* 회원수 */ .mem_addr_bas_list_tbl_wrap .tb_optn{width:5%;} .mem_addr_bas_list_tbl_wrap th.mem_num, .mem_addr_bas_list_tbl_wrap td.mem_num, .mem_addr_bas_list_tbl_wrap th.cre_dt, .mem_addr_bas_list_tbl_wrap td.cre_dt{width:10%;} .mem_addr_bas_list_tbl_wrap th.set, .mem_addr_bas_list_tbl_wrap td.set{width:12%;} /*** [발신번호 관리 끝] ***/ /*** [내 정보 변경] ***/ /* 비멀번호 변경하기 버튼 */ .mem_join_wrap dl.pw_upd_wrap dd .mem_join_wrap{width:300px;} .mem_join_wrap dl.pw_upd_wrap dd .mem_join_wrap a{padding:11.5px 0;} /* 하단 버튼 */ .mem_login_func_btn_wrap .btn_aling_pad10_lst > *{width:300px;} /*** [내 정보 변경 끝] ***/ /*** [문자 보내기] ***/ /** step2 문자 내용 입력 **/ /* 문자 내용 입력란 */ .sms_sendg_cont_wrap .cmn_box_wrap .ct_box1 .message_contents textarea{padding-right:24px;} /* 최근 발송 문구 */ .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2{padding-bottom:30px;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy > ul{margin-bottom:-30px;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .message_copy li{margin-bottom:30px;} .sms_sendg_cont_wrap .cmn_box_wrap .ct_box2 .copy_active_btn{margin-bottom:0;} .sms_sendg_cont_wrap .message_copy_ex i + span{margin-left:10px;} .sms_sendg_cont_wrap .message_copy_ex span{letter-spacing:-0.3px;} /*** [문자 보내기 끝] ***/ /*********** 2021.07 수정 끝 ************/ /*********** 2021.08 수정 ************/ /*** [내 연락처 관리 > 그룹 이동/복사 팝업] ***/ .grup_mv_pop_wrap .alert {margin-bottom: 5px;} .grup_mv_pop_wrap .chs_optn:after{content:""; display:block; clear:both; overflow:hidden;} .grup_mv_pop_wrap .chs_optn{font-size:1.125rem; line-height:45px; font-weight:300; text-align:right; color:#373737;} .grup_mv_pop_wrap .chs_optn .badge{padding:3px 7px 3px 5px;} .grup_mv_pop_wrap .pop_ttl{font-size:1.5rem; line-height:50px; font-weight:500; text-align:center; color:#373737;} .grup_mv_pop_wrap .hf_sec{width:50%; margin:0 auto 20px;} .grup_mv_pop_wrap .no-gutters {margin-bottom: 10px;} .grup_mv_pop_wrap .no-gutters > div:first-child {margin-bottom: 5px;} .grup_mv_pop_wrap label, .grup_mv_pop_wrap input[type="radio"]{vertical-align:middle;} .grup_mv_pop_wrap label{font-size:1.125rem; font-weight:400;} .grup_mv_pop_wrap input[type="radio"]{width:25px; margin-right:10px;} .grup_mv_pop_wrap .line_hei_sec{line-height:35px;} .grup_mv_pop_wrap .mem_addr_grp_bas_grp_nm{font-size: 20px;} .grup_mv_pop_wrap .mem_addr_grp_bas_grp_select_box{width: 140px; height: 40px; padding: 5px; border: 1px solid #c1c1c1;} /*** [내 연락처 관리 > 그룹 이동/복사 팝업 끝] ***/ /*** [내 연락처 관리 > 상세보기] ***/ /* 수정 테이블 */ .send_num_mngt_nm_wrap.sec_comn_btn .send_num_mngt_nm_btn{margin-top:0; margin-bottom:0;} /*** [내 연락처 관리 > 상세보기 끝] ***/ /*** [통합계정인증] ***/ /* 안내문 */ .comn_cont_info_inner p{fonst-size:16px; line-height:32px; color:#222;} /* 입력 */ .cash_move_form .mem_join_wrap dl dd{width:calc(100% - 145px);} .cash_move_form .mem_join_wrap dl dd .mem_join_wrap{width:100%;} /* 버튼 */ .mem_login_func_btn_wrap{font-size:0;} .mem_login_func_btn_wrap > *{display:inline-block; font-size:revert; vertical-align:middle;} .mem_login_func_btn_wrap .mem_login_func_inner{margin-right:20px; width:373px;} .mem_login_func_btn_wrap .mem_login_func_inner:last-child{margin-right:0;} /*** [통합계정인증 끝] ***/ /*********** 2021.08 수정 끝 ************/ /*********** 2021.09 수정 ************/ /*** [아이디/비밀번호 찾기] ***/ /* 확인 뱃지 */ .badge_check{margin:0 10px; font-weight:500; background-color:#fff; color:#00b050; border:1px solid #92d050;} .badge_check i + span{margin-left:5px;} /* 컬러 */ .text-white{color:#fff !important;} /*** [아이디/비밀번호 찾기 끝] ***/ /*** [아이디 찾기] ***/ .find_mem_info_lst{display:inline-block; margin:20px auto 0; text-align:left;} .find_mem_info_lst > li{margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid #b7b7b7;;} .find_mem_info_lst > li:last-child{margin-bottom:0;} /*** [아이디 찾기 끝] ***/ /*********** 2021.09 수정 끝 ************/ /*********** 2021.09 추가 ************/ /*** [발신번호 등록하기 > 일반 전화 등록] ***/ .pop_send_num_mngt_wrap .user_info_inp .send_meth{margin:10px 0 20px; font-size:0;} .pop_send_num_mngt_wrap .user_info_inp .send_meth > div{display:inline-block; min-width:80px; font-size:16px; vertical-align:middle;} .pop_send_num_mngt_wrap .user_info_inp .send_meth > div > *{display:inline-block; font-weight:normal; vertical-align:middle;} .pop_send_num_mngt_wrap .user_info_inp .send_meth > div > input[type="radio"]{width:16px; height:16px; margin-right:5px;} .pop_send_num_mngt_wrap .user_info_inp dl{width:91.35%; margin:0 auto 20px;} .pop_send_num_mngt_wrap .user_info_inp dl dt{width:20%; padding-right:20px;} .pop_send_num_mngt_wrap .user_info_inp dl dd{width:80%;} /*** [발신번호 등록하기 > 일반 전화 등록 끝] ***/ /*********** 2021.09 추가 끝 ************/ /* 22.04.11 추가사항 */ /* 회원가입 폼 */ #secImgWrap .img-thumbnail {height: 50px;} .auto_regs_rm_plac_inp_wrap input {height: 50px; margin-left: 5px;} .auto_regs_rm_plac_refh_wrap .ico_wrap {padding: 11px 15px; margin-left: 10px;} /* 팝업창 - SMS인증 */ .info_fd_popup_det_inpt input[type="tel"] {height: 50px !important;} .info_fd_popup_lst a.btn {padding: 2.5px 0 !important;} /* 포토문자 이미지 */ .msg_sendg_photo_regs_ul .cop_photo_regs {font-size: .875rem; background: url(/common/css/image/ico_camera.png) no-repeat center 30px #fff; color: #666; } .msg_sendg_photo_regs_ul .badge_mv_btn {position: absolute; top: 3px; left: 13%; z-index: 2; width: 25px; height: 25px; background-color: green; color: #fff; font-size: .875rem; border-radius: 5px; transform: translateX(-50%); padding: 0 !important;} .msg_sendg_photo_regs_ul .badge_mv_btn i {vertical-align: 2px;} .msg_sendg_photo_regs_ul .badge_del_btn {position: absolute; top: 3px; left: 88%; z-index: 2; width: 25px; height: 25px; background-color: red; color: #fff; font-size: .875rem; border-radius: 5px; transform: translateX(-50%); padding: 0 !important;} .msg_sendg_photo_regs_ul {margin-top: 6px; margin-bottom: -20px; font-size: 0; } .msg_sendg_photo_regs_ul > li {position: relative; display: inline-block; width: 120px; height: 120px; margin: 0 7.5px 20px; font-size: initial; text-align: center; background-color: #fff; border: 1px solid #c6c6c6; border-radius: 10px; vertical-align: top; overflow: hidden; cursor: pointer; } .msg_sendg_photo_regs_ul > li:hover {border-color: #666;} .msg_sendg_photo_regs_ul > li a:hover {text-decoration: none; opacity: 1;} .msg_sendg_photo_regs_ul .cop_photo_regs p {margin-top: 75px;} /* 22.04.13 추가사항 */ /* 전송내역보기 - 상태 수정 */ .sta .img_wrap > img {display: inline-block; text-align: center;} /* 22.04.19 추가사항 */ /* 메인화면 */ @media screen and (min-width: 1630px) { .p_section_main {min-width: 1630px;} .p_section_func_info_wrap {min-width: 1630px;} .p_footer_section {min-width: 1630px;} .p_footer {min-width: 1630px;} #sub_nav .navigator_section {min-width: 1630px;} } @media screen and (max-width: 1630px) { .p_section_main {min-width: 1300px;} .p_section_func_info_wrap {min-width: 1300px;} .p_footer_section {min-width: 1300px;} .p_footer {min-width: 1300px;} #sub_nav .navigator_section {min-width: 1300px;} #top_menu .top_menu_lst > li {width: 180px;} #top_menu .top_menu_tool_lst {margin-right: 0;} #footer .footer_info {width: 55%;} } @media screen and (min-width: 1024px) { .form-control {height: 60px !important;} .form-control:not(.btn) {border-radius: 0 !important;} .btn {border-radius: 0.25rem !important;} } /* 푸터 패딩 수정 */ #footer .container {padding-left: 2.5%;} /* 회원가입 - 14세이상 폼 */ .mem_join_kid_apv_wrap > p {font-size: 1.5rem;} .mem_join_kid_apv_wrap ul > li {vertical-align: middle; padding: 0rem 1rem; text-align: center;} .mem_join_kid_apv_wrap ul > li > a.btn {width: 200px; padding: 0.75rem 2rem; font-size: 1.25rem;}