@charset "utf-8";

@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
  font-family:'Noto Sans KR';
  src:url('../font/notokr-light.eot');src:local(※), url('../font/notokr-light.woff') format('woff');
  font-weight:300;
}

/********************************
 공통 스타일
********************************/
.direct_wrap {margin: auto; letter-spacing: -0.25px;	font-family: "나눔고딕", "NanumGothic"; min-width: 1280px; max-width: 1920px;}
.direct_wrap button {font-family: "나눔고딕", "NanumGothic"; cursor: pointer;}
.direct_wrap .inner {margin: 0 auto; padding: 0 10px; max-width:1280px; min-width: 1260px; box-sizing: border-box;}
.btn_primary {padding: 13px 30px 12px; border-radius: 6px; background-color: #323949; border: 0; cursor: pointer;}
.btn_primary span {display: inline-block; font-size: 16px; color: #fff; }

.w100 {width: 100%;}
.fw600 {font-weight: 600;}
.line_dash {margin: 30px 0; display: block; height: 1px; background: url("/html/images/front/ko/direct/line.png") repeat-x;}

/* 스크롤 스타일 */
.no_scroll {overflow:hidden;}
.scroll {height:100%; overflow-y:auto; box-sizing:border-box;}
.scroll::-webkit-scrollbar {width:6px;}
.scroll::-webkit-scrollbar-thumb {background-color:#ccc; border-radius:6px;}
.scroll::-webkit-scrollbar-track {background-color:transparent; border-radius:6px; box-shadow:transparent;}

/* 검은색 닫기 버튼 */
.ui_close {overflow:hidden; display:block; position:absolute; width:24px; height:0; padding:24px 0 0; background-color:#333; z-index:2; border-radius:50%; cursor: pointer;}
.ui_close:before, .ui_close:after {content:'';display:block;position:absolute;left:50%;top:50%;width: 12px;height:2px;margin:-1px 0 0 -6px;background:#fff;-webkit-transition:all 0.3s ease;transition:all 0.3s ease; cursor: pointer;}
.ui_close:before {-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.ui_close:after {-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);}

/* 버튼 컬러 */
.btn_blk {color:#fff; background-color: #323949; border: 0; cursor: pointer;}
.btn_blue {color:#fff; background-color: #05b7d1; border: 0; cursor: pointer;}

/* 다이렉트센터 페이지 Form 스타일 */
input.input_form {padding:0 20px;height:46px;font-size:16px;color:#323949;border:1px solid #bfbfbf;border-radius:6px;box-sizing:border-box;font-family:inherit;}
input.input_form:disabled, input.input_form:disabled, input.input_form:disabled, input.input_form:disabled {background-color:#f5f5f5; color:#c9c9ca;}
textarea.input_form {padding:10px 20px; height:100px;font-size:16px;color:#323949;border:1px solid #bfbfbf;border-radius:6px;box-sizing:border-box;font-family:inherit; resize:none;}
input.input_form::placeholder,
textarea.input_form::placeholder {color:#c9c9ca;}

select.input_form {padding:0 50px 0 20px; min-width:150px; height:46px; -webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:16px; color:#666; background:url("/html/images/front/ko/direct/arrow_select.png") bottom 50% right 20px no-repeat #fff; border:1px solid #bfbfbf;border-radius:6px;box-sizing:border-box;font-family:inherit;}
select.input_form::-ms-expand{display:none;/*for IE10,11*/}

.chk_box, .radio_box {position:relative; display:inline-block;}
.chk_box + .chk_box {margin-left:30px;}
.radio_box + .radio_box {margin-left:30px;}
.chk_box input[type="checkbox"], .radio_box input[type="radio"] {padding:0;margin:0;position:relative;border:0;width:0;height:0;overflow:hidden;}
.chk_box input[type="checkbox"] + label, .radio_box input[type="radio"] + label
{padding-left:34px; display: inline-block; font-size:16px; color:#323949; font-weight:300; cursor:pointer;}
.chk_box input[type="checkbox"] + label:before, .radio_box input[type="radio"] + label:before {content:"";  display:block; position:absolute; left:0; top:0; background-color: #fff; box-sizing: border-box;}
.chk_box input[type="checkbox"] + label span, .radio_box input[type="radio"] + label span {line-height:22px;}

.chk_box input[type="checkbox"] + label:before {content:"";  display:block; position:absolute; left:0; top:0; width:24px; height:24px; border:1px solid #ccc; border-radius: 3px;}
.chk_box input[type="checkbox"]:checked + label:before {border-color:#00a2bd; background-color: #00a2bd;}
.chk_box input[type="checkbox"]:checked + label:after {
  content: "";
  display: block;
  position: absolute;
  left: 6px;
  top: 6px;
  width: 10px;
  height: 6px;
  border-style: solid;
  border-color: #fff;
  border-width: 0 0 2px 2px;
  transform: rotate( -45deg );
}
.chk_box input[type="checkbox"]:disabled + label:before {opacity:40%;}
.chk_box input[type="checkbox"] + label .text {line-height: 24px;}

.radio_box input[type="radio"] + label:before {border: 1px solid #dee3e6; border-radius: 50%; background-color: #f6f7f7; width:22px; height:22px; box-sizing: border-box;}
.radio_box input[type="radio"]:checked + label:before {background-color: #fff;}
.radio_box input[type="radio"]:checked + label:after {content: ""; position: absolute; left: 6px; top: 6px; display: block; border-radius: 50%; width: 10px; height: 10px;  background-color: #00a2bd;}
.radio_box input[type="radio"]:disabled + label:before {opacity:40%;}

/********************************
 애니메이션 스타일
********************************/
@keyframes toggle-shadow {
  0% {box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);}
  100% {box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.15);}
}
@-webkit-keyframes toggle-shadow {
  0% {-webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);}
  100% {-webkit-box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.15);}
}

@keyframes item-shadow {
  0% {box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
  100% {box-shadow: 5px 8px 10px 0px rgba(0, 0, 0, 0.2);}
}
@-webkit-keyframes item-shadow {
  0% {-webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);}
  100% {-webkit-box-shadow: 5px 8px 10px 0px rgba(0, 0, 0, 0.2);}
}

@keyframes pop-floating {
	0% {transform: translateY(0%);}
	50% {transform: translateY(8%);}
	100% {transform: translateY(0%);}
}
@-webkit-keyframes pop-floating {
	0% {-webkit-transform: translateY(0%);}
	50% {-webkit-transform: translateY(8%);}
	100% {-webkit-transform: translateY(0%);}
}

/********************************
 swiper 스타일
********************************/
.direct_pagination {position: relative; text-align: center;}
.direct_pagination .swiper-pagination-bullet {margin: 0 5px; border:3px solid #ccc; background-color: transparent; opacity: 1;}
.direct_pagination .swiper-pagination-bullet-active {border-color: #00b1c9; background-color: #00b1c9;}

.direct_button_prev,
.direct_button_next {position: absolute; top:50%; margin-top: -30px; width: 60px; height: 60px; border: 1px solid #ccc; background-color: #fff; border-radius: 50%; box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1); box-sizing: border-box; z-index: 10;}
.direct_button_prev:after,
.direct_button_next:after {content: ""; display: block; position: absolute; top: 20px; width: 18px; height: 18px; border-style: solid; border-color: #7a8490; border-width: 0 0 2px 2px;}
.direct_button_prev {left: 0; cursor: pointer;}
.direct_button_prev:after {left:24px; transform: rotate(45deg);}
.direct_button_next {right: 0; cursor: pointer; }
.direct_button_next:after {right:24px; transform: rotate(-135deg);}
.swiper-button-disabled {display: none;}

/********************************
 페이징
********************************/
.paging {margin-top: 30px; text-align: center;}
.paging .paging_list {font-size: 0;}
.paging .paging_list li {display: inline-block; padding: 0 8px;}
.paging .paging_list li.first,
.paging .paging_list li.last,
.paging .paging_list li.prev,
.paging .paging_list li.next {padding: 0 5px; width: 42px;}
.paging .paging_list li.prev {padding-right: 20px;}
.paging .paging_list li.next {padding-left: 20px;}
.paging .paging_list li a {display: block; width: 24px; height: 24px; line-height: 24px; border-radius: 50%; font-size: 16px; color: #727272; background-color: #fff; text-align: center;}
.paging .paging_list li.active a {color: #fff; background-color: #222;}

/********************************
 토글 스타일
********************************/
.blk_toggle {border-radius: 0 0 12px 12px; overflow: hidden;}
.blk_toggle > dt {padding: 24px 40px; position: relative; height: 70px; background-color: #323949; border-radius: 12px; box-sizing: border-box; cursor: pointer; overflow: hidden;}
.blk_toggle > dt p {float: left; font-size: 24px; color: #fff; font-weight: 600;}
.blk_toggle > dt span.btn_more {padding-right:35px; float: right; font-size: 20px; color:#fff; font-weight: 600;}
.blk_toggle > dt span.btn_more:after {content: ""; position: absolute; right:40px; top:18px; display: inline-block; width: 18px; height: 18px; border-style: solid; border-color: #323949; border-width: 0 0 2px 2px; transform: rotate(-45deg);}
.blk_toggle > dd {display: none; padding: 40px; font-size: 16px; color: #000; line-height: 34px;}
.blk_toggle > dd .img_area {text-align: center;}
.blk_toggle > dd .img_area img {max-width: 100%;}
.blk_toggle.active {
  animation: toggle-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  -webkit-animation: toggle-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.blk_toggle.active > dt span.btn_more:after {top:30px; transform: rotate(135deg);}
.blk_toggle.active > dd {display: block;}

/********************************
 우측 퀵메뉴
********************************/
.aside_quick {position: fixed; right: 10px; bottom: 20px; z-index: 999; font-family: 'GmarketSansMedium'; text-align: center;}
.aside_quick.active {bottom: 720px;}
.aside_quick .q_top a {margin: 20px 0; padding: 10px; display: block; width: 90px; height: 90px; border-radius: 50%; background-color: #fff; box-shadow: 3px 2px 6px 0px rgba(0, 0, 0, 0.35); box-sizing: border-box; overflow: hidden;}
.aside_quick .q_top a .icon {display: block;}
.aside_quick .q_top a .text {display: block; font-size: 14px; line-height: 16px; color: #00a2bd;}
.aside_quick .q_btm {margin: 20px 0; width: 90px; border-radius: 45px; background-color: #377be1; box-shadow: 3px 2px 6px 0px rgba(0, 0, 0, 0.35);}
.aside_quick .q_btm li {padding: 0 16px; height: 75px;}
.aside_quick .q_btm li:first-child,
.aside_quick .q_btm li:first-child a {height: 110px;}
.aside_quick .q_btm li:nth-child(3),
.aside_quick .q_btm li:nth-child(3) a {height: 85px;}
.aside_quick .q_btm li + li:before {content: ""; display: block; width:100%; height: 1px; background: url("/html/images/front/ko/direct/quick_line.png") repeat-x 0 0;}
.aside_quick .q_btm li a {display: table-cell; width: 100vw; height: 75px; vertical-align: middle;}
.aside_quick .q_btm li a .text {display: block; font-size: 16px; line-height: 20px; color: #fff; letter-spacing: -0.08em;}
.aside_quick .q_btm li a .icon + .text {margin-top: 8px;}
.aside_quick .btn_top {margin: auto; display: none; width: 60px; height: 60px; border-radius: 50%; box-shadow: 3px 2px 6px 0px rgba(0, 0, 0, 0.35); overflow: hidden;}
.aside_quick .btn_top.active {display: block;}

/********************************
 다이렉트센터 네비게이션
********************************/

/*.direct_nav {position: fixed;bottom:120px; left: 10px; z-index: 20; }
.direct_nav.active {bottom: 740px;}*/

.direct_nav {position: fixed; top:50%; margin-top:-180px; left: 10px; z-index: 20; }
.direct_nav.active {bottom: 740px; top:0;}

.direct_nav.bt {position: fixed; bottom:130px;}
.direct_nav li {position:relative; height: 54px;}
.direct_nav li + li {margin-top: 30px;}
.direct_nav li a {position: relative;}
.direct_nav li a:before {/**content: "";**/ position: absolute; left: 0; top: 26px; display: block; width: 80px; height: 2px; background-color: #f7f7f7;}
.direct_nav li a .icon {position: absolute; left: 40px; top:22px; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: #00b1c9;}
.direct_nav li a .icon img {display: none; position: absolute;}
.direct_nav li.section01 a .icon img {left: 14px; top: 10px;}
.direct_nav li.section02 a .icon img {left: 12px; top: 12px;}
.direct_nav li.section03 a .icon img {left: 11px; top: 14px;}
.direct_nav li.section04 a .icon img {left: 15px; top: 11px;}
.direct_nav li.section05 a .icon img {left: 12px; top: 13px;}
.direct_nav li a .txt {position: relative; display: block; left:65px; font-size: 16px; line-height: 54px; color: #666; font-weight: 600;}

.direct_nav li.active a:before {background-color: #f3088f;}
.direct_nav li.active a .icon {position: absolute; top:0;  width: 52px; height:52px; background-color: #f3088f;}
.direct_nav li.active a .icon img {display: block;}
.direct_nav li.active a .txt {left:110px; font-size: 20px; color: #f3088f; font-weight: 700;}


/********************************
 다이렉트센터 비주얼
********************************/
.direct_visual {position: relative; min-width: 1280px; z-index:99;}
.direct_visual .swiper-container {padding-bottom: 50px;}
.direct_visual .swiper-slide a {display: block;}
.direct_visual .swiper-slide .visual {position: relative; display: block; width: 100%; height: 580px; overflow: hidden; text-align: center;}
.direct_visual .swiper-slide .visual img {position: absolute; left:50%; margin-left: -960px;}
.direct_visual .swiper-slide .v_item {position: absolute; left:50%; margin-left: -640px; bottom: -50px; display: block; width: 370px; height: 200px; z-index: 10;}
.direct_visual .swiper-slide .v_item img {max-width: 100%; width: 100%;}
.direct_visual .swiper_control {position: absolute; top: 495px; right: 50%; margin-right: -640px; width: 260px; height: 36px; background-color: rgba(16, 18, 23, .5); border-radius: 18px; z-index: 10; overflow: hidden;}
.direct_visual .swiper-pagination {position: absolute; left: 40px; top: 13px; display: inline-block;}
.direct_pagination {position: relative; text-align: center;}
.direct_visual .swiper-pagination .swiper-pagination-bullet {margin: 0 5px; width: 8px; height: 8px; background-color: rgba(255, 255, 255, .5);}
.direct_visual .swiper-pagination .swiper-pagination-bullet-active {width: 10px; height: 10px; background-color: #fff100;}

.direct_visual .swiper-pagination2 {position: absolute; left: 17px; top: 10px; font-size: 0;}
.direct_visual .swiper-pagination2 .swiper-pagination-current {position: absolute; left: 0; color: #fff100; font-size: 14px; font-family: 'GmarketSansBold'; }
.direct_visual .swiper-pagination2 .swiper-pagination-total {margin-left: 120px; color: #fff; font-size: 14px; font-family: 'GmarketSansBold'; }
.direct_visual .btn_swiper {position: absolute; left: 180px; top:10px;}
.direct_visual .btn_swiper li {display: inline-block; width: 26px; height: 23px; text-align: center; cursor: pointer;}

.direct_visual .btn_swiper .btn_start,
.direct_visual .btn_swiper .btn_stop {display: none;}
.direct_visual .btn_swiper .btn_start.active,
.direct_visual .btn_swiper .btn_stop.active {display: inline;}


/********************************
 01. 상품선택
********************************/
.direct_product {padding-top: 70px;}

/* 상품선택 - 타이틀 */
.product_txt {text-align: center;}
.product_txt .title {font-size: 46px; color: #000; font-weight: 600;}
.product_txt .title span {color: #00b1c9; font-weight: 700; /* vertical-align: bottom; */}
.product_txt .copy {margin-top: 30px; font-size: 32px; color: #000}
.product_txt .copy strong {font-weight: 600;}

/* 상품선택 - 상품선택 */
.product_sel {margin-top: 70px; font-size: 0; box-sizing:border-box;}
.product_sel .box {position: relative; display: inline-block; width: calc(33.3333% - 30px); height: 120px; line-height: 120px; background-color: #eee; border-radius: 20px 20px 40px 40px; box-sizing: border-box; cursor: pointer; text-align: center; vertical-align: middle;}
.product_sel .box + .box {margin-left: 40px;}
.product_sel .box .icon {display: inline-block; vertical-align: middle;}
.product_sel .box .p_name {margin-left: 20px; display: inline-block; color: #000; font-size: 30px; font-weight: 600; vertical-align: middle;}
.product_sel .box.active {
  background-color: #00b1c9;
  -webkit-animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
.product_sel .box.active .p_name {color: #fff;}


/* 상품선택 - 상품 서비스 선택 (슬라이드) */
.product_svc1 {margin-top: 30px; position: relative;}
.product_svc1:before {content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background: url("/html/images/front/ko/direct/arrow_prod.png") top center no-repeat;}
.product_svc1 .slide-container {position: relative; margin: 0 70px;}
.product_svc1 .slide-container .swiper-container {padding:75px 70px 60px; margin: 0 -70px;}
.product_svc1 .slide-container .swiper-container:after {content: ""; display: block;}
.product_svc1 .box {border: 2px solid #ccc; border-radius: 12px; box-sizing: border-box; overflow: hidden; cursor: pointer;}
.product_svc1 .box .svc_cont_area {display: table-cell; width: 100vw; height: 140px; vertical-align: middle;}
.product_svc1 .box .svc_cont_area .svc_tag {font-size: 0; text-align: center;}
.product_svc1 .box .svc_cont_area .svc_tag li {padding: 7px 20px; display: inline-block; height: 30px; border-radius: 15px; box-sizing: border-box;}
.product_svc1 .box .svc_cont_area .svc_tag li + li {margin-left: 10px;}
.product_svc1 .box .svc_cont_area .svc_tag li.t_direct {background-color: #fc6d42;}
.product_svc1 .box .svc_cont_area .svc_tag li.t_recomm {background-color: #0083cd;}
.product_svc1 .box .svc_cont_area .svc_tag li.t_best {background-color: #9f4ec6;}
.product_svc1 .box .svc_cont_area .svc_tag li.t_new {background-color: #00b2bb;}
.product_svc1 .box .svc_cont_area .svc_tag li span {font-size: 14px; color: #fff; font-weight: 600;}
.product_svc1 .box .svc_cont_area p.label {margin: 15px 5px; font-size: 24px; font-weight: 600; text-align: center; color: #000000;}
.product_svc1 .box .svc_desc_area {padding: 20px 0 25px; background-color: #f5f5f5;}
.product_svc1 .box .svc_desc_area p.text {font-size: 16px; color: #000; text-align: center;}
.product_svc1 .box .btn_calculator {padding: 0; position: absolute; left: 50%; margin-left: -22px; bottom: -22px; width: 44px; height: 44px; border-radius: 50%; border: 0; background-color: #7a8490; cursor: pointer; box-sizing: border-box;}
.product_svc1 .box .btn_calculator .icon {display: block; padding: 11px 15px;}
.product_svc1 .box .btn_calculator .text {font-size: 0; text-indent: -9999px;}
.product_svc1 .box.active {border-color: #00b1c9;}
.product_svc1 .box.active .svc_desc_area {background-color: #e9fcff;}
.product_svc1 .box.active .btn_calculator {background-color: #00b1c9;}

.product_svc1 .slide-container:after {
  content: "";
  position: absolute;
  top: 0;
  right: -70px;
  display: block;
  width: 60px;
  height: 100%;
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 100%);
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 100%);
  z-index: 10;
}

.product_svc1 .slide-container:before {
  content: "";
  position: absolute;
  top: 0;
  left: -70px;
  display: block;
  width: 60px;
  height: 100%;
  background: -webkit-linear-gradient(left, white 0%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(90deg, white 0%, rgba(255, 255, 255, 0) 100%);
  z-index: 10;
}
/* 상품 서비스 상품설명 토글 */
.option_toggle {margin-top: 60px;}
.option_toggle > dt {padding:24px 0px; position: relative; box-sizing: border-box; cursor: pointer; border-bottom: 2px solid #323949; text-align:center;}
.option_toggle > dt p {display: inline-block; font-size: 32px; color: #000; font-weight: 600;}
.option_toggle > dt span.btn_more {margin-left: 10px; position: relative; top:-5px; display: inline-block; font-size: 0;}
.option_toggle > dt span.btn_more:after {content: ""; display: inline-block; width: 18px; height: 18px; border-style: solid; border-color: #323949; border-width: 0 0 2px 2px; transform: rotate(-45deg);}
.option_toggle > dd {display: none; padding: 40px 0 0 0; font-size: 18px; color: #000; line-height: 30px;}
.option_toggle > dd .img_area {text-align: center;}
.option_toggle > dd .img_area img {max-width: 100%;}
.option_toggle > dd > p {font-size: 48px; color: #000; font-weight: 600; line-height: 1.2;}
.option_toggle > dd > p span {font-size: 36px; color: #000; font-weight: 400;}
.option_toggle > dd > p strong {color: #00afca; font-weight: 700;}

.option_toggle.active > dt span.btn_more {top:5px;}
.option_toggle.active > dt span.btn_more:after {transform: rotate(135deg);}
.option_toggle.active > dd {display: block;}

/* 상품 서비스 자세히보기 토글 (할인옵션) */
.discount_toggle {margin: 40px auto 0; width: calc(100% - 80px); letter-spacing: -0.05em; border: 1px solid #ccc; border-radius: 30px; overflow: hidden;}
.discount_toggle > dt {padding:12px 30px; position: relative; background-color: #f5f5f5;}
.discount_toggle > dt p {display: inline-block; font-size: 20px; color: #323949; font-weight: 600; vertical-align: middle;}
.discount_toggle > dt .btn_more {margin-left: 20px; position: relative; display: inline-block; width: 36px; height: 36px; background-color: #192a4e; border-radius: 50%; font-size: 0; text-indent: -9999px; cursor: pointer; vertical-align: middle;}
.discount_toggle > dt .btn_more:before, .discount_toggle > dt .btn_more:after {content: ""; position: absolute; display: block; background-color: #fff;}
.discount_toggle > dt .btn_more:before {left:10px; top:17px; width:16px; height: 2px;}
.discount_toggle > dt .btn_more:after {left:17px; top:10px; width:2px; height: 16px;}
.discount_toggle.active > dt .btn_more:after {display: none;
}
.discount_toggle > dd {padding: 0 70px 70px; display: none; border-top: 1px solid #ccc;}
.discount_toggle.active > dd {display: block;}
.discount_toggle > dd .dis_desc {padding: 40px 0 35px; font-size: 40px; color: #323949; font-family: 'GmarketSansMedium'; text-align: center;}
.discount_toggle > dd .dis_desc span {color: #e93d6a; font-family: 'GmarketSansBold';}

.discount_box {padding: 40px; background-color:#e9eef2; font-family: 'GmarketSansMedium'; border-radius: 20px; }
.discount_box dl.item dt.item_title {padding: 18px 40px 12px; position: relative; border-radius: 30px; background-color:#cdd6de; overflow: hidden;}
.discount_box dl.item dt.item_title p {font-size: 28px; color: #323949; font-family: 'GmarketSansBold';}
.discount_box dl.item dt.item_title a {padding:17px 0; position: absolute; right: 0; top: 0; display: block; width: 150px; height: 60px; border-radius: 30px; background-color: #fff; box-sizing: border-box; text-align: center; box-shadow: -5px 0px 10px 0px rgba(50, 57, 73, 0.2);}
.discount_box dl.item dt.item_title a span {font-size: 20px; color: #323949; font-family: 'GmarketSansBold';}
.discount_box dl.item dt.item_title a span:after {content: ""; margin-left: 5px; display: inline-block; width: 12px; height: 12px; border-style: solid; border-color: #323949; border-width: 0 0 2px 2px; transform: rotate(-135deg);}
.discount_box dl.item dd.item_cont {padding: 20px 70px; position: relative;}
.discount_box dl.item dd.item_cont .item_img {position: absolute; right: 0; top: 50px;}
.discount_box dl.item dd.item_cont > ul > li + li {margin-top: 15px;}
.discount_box dl.item dd.item_cont .title {font-size: 24px; line-height: 48px; color: #323949;}
.discount_box dl.item dd.item_cont .text_detail {padding: 0 30px;}
.discount_box dl.item dd.item_cont .text_detail > li {padding-left: 10px; position: relative; font-size: 20px; line-height: 30px; color: #555;}
.discount_box dl.item dd.item_cont .text_detail > li:before {content: "·"; position: absolute; left: 0; top: 0;}
.discount_box dl.item dd.item_cont p.text_etc,
.discount_box dl.item dd.item_cont .text_etc li {font-size: 18px; line-height: 28px; color: #7a8490;}


/* 상품 서비스 자세히보기 토글 (할인옵션_240221 추가) */
.dc_card {margin-top:60px !important;}
.dc_card h2 {float:left; color:#000000; font-size:26px;}
.dc_card a {margin-left:20px; line-height:36px; font-size:16px;}
.dc_card span {text-decoration:underline; text-underline-position:from-font;}

.dc_price {margin-top:60px !important;}
.dc_price h2 {color:#000000; font-size:26px;margin-bottom:20px;}
.dc_info {font-size:16px; line-height:30px;}

.dc_table  {width:80%; border-collapse:collapse;border-spacing:0; margin:20px 0;}
.dc_table td{border-color:black;border-style:solid;border-width:1px;font-size:14px; overflow:hidden;padding:10px 5px;word-break:normal;}
.dc_table th{border-color:black;border-style:solid;border-width:1px;font-size:14px; font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
.dc_table .tit{border-color:inherit;font-size:18px;font-weight:bold;text-align:center;vertical-align:top;color:#323949;}
.dc_table .card{background-color:#f5f5f5;border-color:#656565;font-size:16px;font-weight:bold;text-align:left;vertical-align:top; color:#323949;}
.dc_table .be{border-color:#656565;font-size:16px;text-align:left; color:#323949; font-weight:bold;} 
.dc_table .be span{color:#00BCD4;}
.dc_table .bes{border-color:#656565;font-size:16px;text-align:left; color:#323949; font-weight:bold; line-height:26px;}
.dc_table .bes span{color:#00BCD4;}
.dc_table .bes p{color:#595959; font-weight:normal;font-size:14px;}

/********************************
 02. 납부요금 계산
********************************/
/* 납부요금 계산 - 버튼 */
.direct_calculator {padding: 60px 0 130px; position: relative; text-align: center;}
.direct_calculator .btn_calculator {width: 600px; height: 90px; border-radius: 45px; background-color: #00b1c9; border:0; cursor: pointer;}
.direct_calculator .btn_calculator .icon {display: inline-block; vertical-align: middle;}
.direct_calculator .btn_calculator .text {margin-left: 15px; display: inline-block; vertical-align: middle; font-size: 30px; color: #fff; font-weight: 600; letter-spacing: -0.05em;}

/********************************
 03. 추천상품
********************************/
.direct_recomm {padding:100px 0 70px; background-color: #f5f5f5;}
.direct_recomm .inner {position: relative;}
.direct_recomm .recomm_title {font-size: 36px; color: #000; font-weight: 600; text-align: center;}
.direct_recomm .recomm_title_m {font-size: 28px; color: #000; text-align: center; padding-bottom:10px;}

.direct_recomm .recomm_list {position: relative;}
.direct_recomm .recomm_list .swiper-container {padding: 60px 10px 40px; margin: 0 60px;}
/*
.direct_recomm .recomm_list .box {padding: 28px; height: 180px; background-color: #fff;  border-radius: 12px; border: 2px solid #fff; box-sizing: border-box; cursor: pointer;}
.direct_recomm .recomm_list .box:hover,
.direct_recomm .recomm_list .box.active {
  border-color: #00b1c9;
  -webkit-animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
*/
.direct_recomm .recomm_list .box {height: 534px; cursor: pointer;}


.direct_recomm .recomm_list .box .copy {position: relative; font-size: 20px; line-height: 30px; font-weight: 600; z-index: 1; letter-spacing: -0.05em; color: #000000;}
.direct_recomm .recomm_list .box .detail {margin-top: 15px; padding-top: 25px; position: relative; font-size: 18px; color: #00b1c9; z-index: 1; letter-spacing: -0.05em;}
.direct_recomm .recomm_list .box .detail:before {content: ""; position: absolute; top: 1px; left:0; display: block; width: 30px; height: 1px; background-color: #323949;}
/*
.direct_recomm .recomm_list .box .img {position: absolute; right: 20px; top: 20px; z-index: 0;}
*/
.direct_recomm .recomm_list .box .img {position: absolute; z-index: 0;}
/********************************
 03. 고객정보
********************************/
.custmer_info {padding: 60px 0 0;}
.custmer_info .inner {padding: 0 40px;}
.copy_title {margin: 50px 0 10px; text-align: center;}
.copy_title p {font-size: 36px; color: #000; font-weight: 700;}
/* 20220630 추가 */
.copy_title_l {margin: 0 0 60px; text-align: center;}
.copy_title_l p {font-size: 16px; color: #000;}

.info_title {padding: 60px 0 25px; font-size: 32px; color: #222; font-weight: 600; border-bottom: 2px solid #323a47;}
.info_notice {display: inline; font-size: 19px; color: #000; font-weight: normal;}
.inner .info_notice2 {margin-top: 10px; font-size: 16px; color: #666666; vertical-align: middle;}
.info_table {margin-top: 40px;}
.info_table dl {display: table; width: 100%; font-size: 0;}
.info_table dl + dl {}
.info_table dl dt {display: table-cell; width: 180px;	font-size: 18px; color: #000; font-weight: 600; text-align: left;}
.info_table dl dd {padding: 12px 0; display: table-cell; width: calc(100% - 180px);}
.info_table dl dd .input_form + .btn_primary {margin-left: 10px;}
.info_table dl.info_rrn span {display: inline-block; font-size: 16px; vertical-align: middle;}
.info_table dl.info_rrn span.dash {width:20px; text-align: center;}
.info_table dl.info_rrn span.blind {margin-left: 15px;}

.info_table .info_local .country_area {font-size: 0;}
.info_table .info_local .country_area .country_item {display: inline-block;}
.info_table .info_local .country_area .country_item + .country_item {margin-left: 10px;}
.info_table .info_local .country_area p {margin-left: 20px; display: inline-block; font-size: 16px; color: #666; vertical-align: middle;}
.info_table .info_address .post_area {font-size: 0;}
.info_table .info_address .post_area .post_item {display: inline-block;}
.info_table .info_address .post_area .post_item + .post_item {margin-left: 10px;}
.info_table .info_address .address_area .post_item {margin-top: 14px; display: block;}
.info_table .info_address .address_area .input_form {width: 510px;}
.info_table .info_date {font-size: 0;}
.info_table .info_date .date_area {font-size: 0;}
.info_table .info_date .date_area .date_item {display: inline-block; vertical-align: middle;}
.info_table .info_date .date_area .date_item + .date_item {margin-left: 10px;}
/* 20220630 추가 */
.info_table .info_notice_b {margin-top: 10px; font-size: 16px; color: #000; vertical-align: middle;}
.info_table .info_notice_t {margin-left: 180px; font-size: 16px; color: #f00; vertical-align: middle;}

.info_table .input_name, .info_table .input_phone {width: 380px;}
.info_table .input_rrn1 {width: 310px;}
.info_table .input_rrn2 {width: 50px;}
.info_table .input_calender {width: calc(100% - 44px);}
.info_table .input_country,
.info_table .input_time {width: 250px;}
.info_table .input_post {width: 350px;}
.info_table .btn_post {padding: 13px 15px 12px; width: 150px;}

.input_cal_wrap {width: 510px; border: 1px solid #bfbfbf; border-radius: 6px; overflow: hidden; vertical-align: middle; box-sizing: border-box;}
.input_cal_wrap .input_calender {padding-left: 15px; height: 42px; border: 0; font-size: 16px; box-sizing: border-box;}
.input_cal_wrap .btn_cal {display: inline-block; width: 44px; height: 44px; line-height: 44px; cursor: pointer; text-align: center; vertical-align: middle;}

/********************************
 04. 납부정보
********************************/
.pay_info .inner {padding: 0 40px;}
.pay_info .info_table dl + dl {margin-top: 30px;}

.certi_sel {margin-top: 25px; display: none; font-size: 0;}
.certi_sel.active {display: block;}
.certi_sel .certi_item {display: inline-block; vertical-align: middle;}
.certi_sel .certi_item + .certi_item {margin-left: 10px;}
.certi_sel.kakao .certi_item input.input_form {width: 640px;}
.certi_sel.email .certi_item input.input_form {width: 200px;}
.certi_sel.email .certi_item .e_text {padding: 0 8px; font-size: 18px; color:#323949; vertical-align: middle;}
.certi_sel.card .card_line2  {margin-top: 24px;}
.certi_sel .certi_item select.input_form {width: 200px;}
.certi_sel.bank .certi_item input.input_form {width: 430px;}
.certi_sel.card .certi_item input.input_form {width: 90px;}
.certi_sel.card .certi_item span {vertical-align: middle;}
.certi_sel.card .certi_item span.c_dash {padding:0 8px; font-size: 18px; color:#323949;}

/* 약관동의 */
.info_agree{margin-top: 40px;}
.info_agree .all_box {padding:35px 40px; position: relative; background-color: #f5f5f5; border-radius: 12px; box-sizing: border-box; overflow: hidden;}
.info_agree .all_box .title {float: left; font-size: 24px; color: #222; font-weight: 600;}
/* 20220630 추가 */
.info_agree .all_box .notice {float: left; font-size: 16px; color: #000;}

.info_agree .all_box .chk_box {float: right; width: 36px; height: 36px;}
.info_agree .all_box .chk_box input[type="checkbox"] + label {padding-left: 0;}
.info_agree .all_box .chk_box input[type="checkbox"] + label:before {width: 36px; height: 36px;}
.info_agree .all_box .chk_box input[type="checkbox"]:checked + label:after {width: 15px; height: 10px; top: 8px; left:10px;}
.info_agree .agree_box {margin-top: 35px;}
.info_agree .agree_box .agree_title {overflow: hidden;}
.info_agree .agree_box .agree_title .title {float: left; font-size: 20px; color: #222; font-weight: 600;}
/* 20220630 추가 */
.info_agree .agree_box .agree_title .notice {margin-left: 20px; float: left; font-size: 16px; color: #000; }

.info_agree .agree_box .chk_box {float: right;}
.info_agree .agree_box .chk_box input[type="checkbox"] + label {padding: 0 35px 0 0;}
.info_agree .agree_box .chk_box input[type="checkbox"] + label:before {left: inherit; right: 0;}
.info_agree .agree_box .chk_box input[type="checkbox"]:checked + label:after {left: inherit; right: 5px;}
.info_agree .agree_box .chk_box label .text {font-size: 18px; color: #333;}

.info_agree .agree_box .agree_cont {margin-top: 15px; padding: 12px 2px 12px 15px; height: 250px; border: 2px solid #cdcdcd; border-radius: 12px; font-size: 12px; color: #666; line-height: 24px; box-sizing: border-box;}
/* 20220706 추가 */
.info_agree .agree_box .agree_cont h3{padding-bottom:15px; font-size: 12px; }

.info_agree .agree_box .agree_cont .scroll {padding: 0 15px;}
.info_agree .agree_box.active .agree_cont {border-color: #07a5bf; }
.alert_chk {margin-top: 20px;}
.alert_chk .chk_email {margin-top: 20px; display: none;}
.alert_chk .chk_email.active {display: block;}
/* 안내사항 토글 */
.info_toggle {margin-top: 70px ;}
/* 20220704 추가 */
.info_toggle b {
    text-decoration-line: underline;
}

/********************************
 sns 공유
********************************/
.direct_share {margin-top: 100px; text-align: center;}
.direct_share .share_list li {display: inline-block;  width: 40px; height: 40px; border-radius: 50%;}
.direct_share .share_list li + li {margin-left: 16px;}
.direct_share .share_tit {margin: 30px 0; font-size: 16px; color: #222;}
.direct_share .share_tit {}


/********************************
 딜친소 배너
********************************/
.friend_share {
    position: relative;
    text-align: center;
    width: 1200px;
    margin: 80px auto 0;
}

/********************************
 푸터
********************************/
.direct_footer {margin-top: 55px; padding: 50px 0 120px 0; background-color: #eee; border-top: 1px solid #c9c9ca;}
.direct_footer .ft_info {margin-top: 30px; font-size: 0;}
.direct_footer .ft_info li {position: relative; padding-left: 25px ;display: inline-block; font-size: 16px; line-height: 30px; color: #7a8490; font-family: 'Noto Sans KR', sans-serif;}
.direct_footer .ft_info li:before {content: ""; position: absolute; left: 0; top: 12px; display: block; width: 6px; height: 6px; border-radius: 50%; background-color: #7a8490;}
.direct_footer .ft_info li + li {margin-left: 20px;}
.direct_footer .ft_info li strong {font-weight: 400;}
.direct_footer .ft_info li span {margin-left: 20px;}

/********************************
 하단 고정 컨텐츠
********************************/
.direct_btm {
  display: none;
  position: fixed; left:50%; bottom: 0; width: 1280px;
  transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  -moz-transform:translateX(-50%);
  -ms-transform:translateX(-50%);
  -o-transform:translateX(-50%);
  z-index: 100;
}
.direct_btm.active {display: block;}
.direct_btm .price_area {height: 110px; border: 2px solid #323949; border-bottom-width: 1px; border-radius: 10px 10px 0 0; overflow: hidden;} /* 20240206 수정 */
.direct_btm .price_area:after {content: ""; display: block; clear: both;}
.direct_btm .price_area .price_pay {padding: 0 40px; display: table-cell; float: left; width: 50%; height: 100%; background-color: #fff; box-sizing: border-box; vertical-align: middle; cursor: pointer;}
.direct_btm .price_area .price_pay:after {content: ""; display: block; clear: both;}
/* 20240206 추가 */
.direct_btm .price_area .price_pay > li {clear: both;position: relative;padding: 5px 0;}
.direct_btm .price_area .price_pay > li:after {content: ""; display: block; clear: both;}
/* 20240206 추가끝*/
.direct_btm .price_area .price_pay .pay_label {padding: 15px 0 0 0; float: left; } /* 20240206 수정 */
.direct_btm .price_area .price_pay .pay_label i {display: inline-block; vertical-align: middle;}
.direct_btm .price_area .price_pay .pay_label p {margin-left: 20px; display: inline-block; vertical-align: middle; color: #323949;}
.direct_btm .price_area .price_pay .pay_label p strong {font-size: 26px; font-weight: 600;}
.direct_btm .price_area .price_pay .pay_label p span {margin-top: 5px; display: block; font-size: 14px; font-weight: 600;}

.direct_btm .price_area .price_pay .payment {padding: 20px 0 10px 0; float: right;} /* 20240206 수정 */
.direct_btm .price_area .price_pay .payment p {display: inline-block; font-size: 32px; color: #00a0e9; font-weight: 700; vertical-align: middle; text-align: right;}
.direct_btm .price_area .price_pay .payment p strong {font-size: 32px;color: #e93d6a;font-weight: 700;display: block;} /* 20240206 수정 */
.direct_btm .price_area .price_pay .payment p > span {padding-top:4px; margin-top: 2px;display: block;font-size: 14px;color: #ffffff;font-weight: bold;width: 64px;float: right;height: 22px;text-align: center;background-color: #e93d6a;border-radius: 3px;} /* 20240206 추가 */
/* 카운트다운애니메이션 수정_20220707 */
/*.direct_btm .price_area .price_pay .payment p > span {margin-top: 2px; display: block; font-size: 14px; color: #323949; font-weight: 600;}*/
.direct_btm .price_area .price_pay .payment i {display: inline-block;  margin-left: 15px; vertical-align: middle;}
.direct_btm .price_area .btn_area {float: right; width: 50%; height: 100%; background-color: #00a0e9;}
.direct_btm .price_area .btn_area .btn_join {width: 100%; height: 100%; background-color: #00a0e9; border: 0; text-align: center; cursor: pointer;}
.direct_btm .price_area .btn_area .btn_join i {vertical-align: middle;}
.direct_btm .price_area .btn_area .btn_join span {margin-left: 15px; color: #fff; font-size: 30px; font-weight: 700; font-family: "나눔고딕", "NanumGothic"; vertical-align: middle;}


/********************************
 팝업 레이아웃
********************************/
.popup_dim {display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000; overflow-y:auto; box-sizing:border-box; background-color:rgba(51,51,51,0.5);}
.popup_meg {display:none; position: fixed; left:0; top:0; width:100%; height:100%; overflow-y:auto; z-index:1000;}

.popup {position:relative; top:50%; left:50%; background-color: #fff; width: 800px; letter-spacing: -0.25px;	font-family: "나눔고딕", "NanumGothic"; box-sizing: border-box; border-radius: 20px; box-shadow: 5px 5px 10px rgba(3, 32, 15, .2); z-index: 1000; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -webkit-overflow-scrolling:touch; }
.popup:before {content:""; display:block; width:100%; position:absolute; bottom:-20px; top:0; z-index:-1;}

.pop_header {position:relative; padding:22px 25px; border-radius: 20px 20px 0 0; border: 2px solid #323949; border-bottom: 0;}
.pop_header strong {font-size:24px; color:#fff; font-weight:600;}
.pop_contents {border: 2px solid #323949; border-top:0; border-bottom:0; box-sizing: border-box;}
.pop_footer {padding: 40px 38px 40px 38px; border-radius: 0 0 20px 20px; border: 2px solid #323949; border-top:0; box-sizing: border-box;}
.pop_footer .closetext { font-size: 16px; line-height: 40px; color:#323949; letter-spacing: -0.05em; text-align: center; margin-top: 20px; }
.pop_footer .btn_wrap {text-align: center; font-size: 0;}
.pop_footer .btn_wrap .btn_pop {padding: 20px 0; display: inline-block; width: 500px; height: 70px; border-radius: 35px; box-sizing: border-box; font-family: inherit;}
.pop_footer .btn_wrap .btn_pop span {font-size: 24px; font-weight: 600; vertical-align: middle;}
.pop_footer .btn_wrap .btn_pop i {margin-left: 10px; vertical-align: middle;}

.popup_dim .pop_header {background-color:#323949;}
.popup_dim .pop_contents {padding: 0 38px;}

.popup_consulting .popup,
.popup_calculator .popup,
.popup_post .popup,
.popup_alert3 .popup {
  top:20px;
  transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  -moz-transform:translateX(-50%);
  -ms-transform:translateX(-50%);
  -o-transform:translateX(-50%);
}


/********************************
 컨텐츠 팝업
********************************/
.popup .pop_close {padding:30px 0 0; position:absolute; top:20px; right:25px; display: block; width:30px; height:30px; z-index: 1; overflow: hidden; box-sizing: border-box; cursor: pointer;}
.popup .pop_close .text {font-size: 0; text-indent: -9999px;}

.popup .pop_close:before, .popup .pop_close:after {content:'';display:block;position:absolute;left:50%;top:50%;width: 26px;height:2px;margin:-1px 0 0 -13px; background:#fff;-webkit-transition:all 0.3s ease;transition:all 0.3s ease; cursor: pointer;}
.popup > .pop_close:before {-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.popup > .pop_close:after {-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);}

/* 팝업 : 회색박스 공통 스타일 - 정렬좌우 */
.pop_box1 {padding: 50px; display:block; width:100%; border-radius:10px; background-color:#e9eef2; box-sizing:border-box;}
.pop_box1 dl {overflow:hidden;}
.pop_box1 dl + dl {margin-top: 24px;}
.pop_box1 dl dt {float:left; width:130px; font-size:18px; line-height:46px; color:#000; font-weight: 600;}
.pop_box1 dl dd {float:right; width:calc(100% - 130px);}

/* 팝업 : 동의 스타일 */
.pop_contents .agree_box {margin-top: 35px;}
.pop_contents .agree_box .chk_box label .text {font-size: 20px; color: #222; font-weight: 600;}

.pop_contents .agree_box .agree_cont {margin-top: 16px; padding: 12px 2px 12px 15px; height: 170px; border: 2px solid #cdcdcd; border-radius: 12px; font-size: 16px; color: #666; line-height: 24px; box-sizing: border-box;}
.pop_contents .agree_box .agree_cont .scroll {padding: 0 15px;}
.pop_contents .agree_box.active .agree_cont {border-color: #07a5bf; }

/* 팝업 : 뻐른상담신청 */
.popup_consulting .copy {padding: 40px 0 30px; font-size: 24px; color: #323949;}
.popup_consulting .copy strong {position: relative; display: inline-block; color:#e93d6a; font-weight: 700; z-index: 1;}
.popup_consulting .copy strong:before {content: ""; position: absolute; left: 0; top: 15px; display: inline-block; height: 24px; width: 100%; background-color: #fff799; z-index: -1;}

/* 팝업 : 다이렉트 할인 요금 계산기 */
.popup_calculator .sum_area .tip,
.popup_calculator dt .tip {position: relative; top: -15px; left:5px; cursor: pointer;}
.popup_calculator .cal_header {margin: 0 -38px; border-bottom: 1px solid #ced8df;}
.popup_calculator .cal_header .tip {padding: 6px 38px; background-color: #e9eef2;}
.popup_calculator .cal_header .tip strong {font-size: 14px; font-family: 'GmarketSansBold';}
.popup_calculator .cal_header .tip span {font-size: 14px; font-family: 'GmarketSansMedium';}
.popup_calculator .cal_header .copy {padding: 23px 38px 17px; font-size: 20px; color: #323949; font-weight: 600;}
.popup_calculator .cal_title {margin-top: 30px; font-size: 24px; color: #222; font-weight: 600;}
.popup_calculator .cal_cont {margin-top: 15px; }

.popup_calculator .p_detail_01 {padding: 30px 30px 70px 30px; background-color: #e9eef2; border-radius: 20px; box-sizing: border-box;}
.popup_calculator .p_product_sel {font-size: 0;}
.popup_calculator .p_product_sel li {display: inline-block; width: 33.3333%; vertical-align: top;}
.popup_calculator .p_product_sel .box {margin: 0 7px; padding: 30px; position: relative; display: block; height: 90px; border-radius: 20px; background-color: #ced8df; border: 3px solid #ced8df; text-align: center; box-sizing: border-box; cursor: pointer;}
.popup_calculator .p_product_sel .box .p_name {width: 100%; font-size: 24px; color: #323949; font-weight: 600;}

.popup_calculator .p_product_sel .box.active {border-color: #05b7d1; background-color: #fff; -webkit-animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  animation: item-shadow 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;}
.popup_calculator .p_payment_area {margin-top: 30px; border: 3px solid #05b7d1; border-radius: 20px; overflow: hidden;}
.popup_calculator .p_payment_area dt {height: 80px; background-color: #05b7d1;}
.popup_calculator .p_payment_area dt select {width: 100%; height: 80px; color: #fff; font-size: 24px; font-weight: 600; background: url("/html/images/front/ko/direct/pop_arrow.png") 97% 50% no-repeat #05b7d1; border: 0;}
.popup_calculator .p_payment_area dd {padding: 30px; background-color: #fff; overflow: hidden;}
.popup_calculator .p_payment_area dd strong {float: left; font-size: 26px; font-weight: 600; color: #192a4e;}
.popup_calculator .p_payment_area dd strong span {position: relative; top: 6px; font-size: 14px; font-weight: 400;}
.popup_calculator .p_payment_area dd p {float: right; text-align: right;}
.popup_calculator .p_payment_area dd p del {display: block; font-size: 18px; color: #192a4e;}
.popup_calculator .p_payment_area dd p span {display: block; font-size: 36px; color:#e93d6a; font-weight: 700;}
.popup_calculator .p_payment_area dd > ul > li:after {content: ""; display:block; clear:both;}
.popup_calculator .p_payment_area .modalBenefit {margin-top: 5px; display: block; font-size: 36px; color:#e93d6a; font-weight: 700;}
/* 카운트다운애니메이션_20220707 추가 */
.popup_calculator .p_payment_area dd p > strong {margin-top: 5px; display: block; }
.popup_calculator .p_payment_area dd p > strong span {font-size: 36px; color:#e93d6a; font-weight: 700;}

.popup_calculator .p_detail_02 {padding: 0 30px; position: relative; top: -40px; box-sizing: border-box;}
.popup_calculator .p_toggle dt {position: relative; padding: 27px 30px; height: 80px; background-color: #fff;}
.popup_calculator .p_toggle dt .title {font-size: 24px; color: #323949; font-weight: 600;}
.popup_calculator .p_toggle dt p {margin-right: 40px ;float: right; font-size: 26px; color: #323949; font-weight: 700;}
.popup_calculator .p_toggle dt span.btn_more {position: absolute; right:30px; top:25px; display: block; width: 30px; height: 30px; font-size: 0; cursor: pointer;}
.popup_calculator .p_toggle dt span.btn_more:after {content: ""; position: absolute; left: 8px; top: 5px; display: block; width: 12px; height: 12px; border-style: solid; border-color: #323949; border-width: 0 0 2px 2px; transform: rotate(-45deg);}
.popup_calculator .p_toggle.active > dt span.btn_more:after {top:12px; transform: rotate(135deg);}
.popup_calculator .p_toggle dd {display: none;}
.popup_calculator .p_toggle.active dd {display: block;}

.popup_calculator .p_detail dt {border-radius: 20px 20px 0 0; border:2px solid #ced8df; border-bottom-width: 1px; box-sizing: border-box;}
.popup_calculator .p_detail dd {padding: 24px 35px; background-color: #f5f5f5; border-top:1px solid #ced8df; border-bottom:1px solid #ced8df;}
.popup_calculator .p_detail .detail_area > ul > li {position: relative; padding: 6px 0 6px 10px;} /* 20240206 수정 */
.popup_calculator .p_detail .detail_area > ul > li:after {content: ""; display: block; clear: both;}
.popup_calculator .p_detail .detail_area .d_label {float: left; font-size: 18px; color: #222; font-weight: 600;}
.popup_calculator .p_detail .detail_area .d_price {margin-right: 25px; position: relative; float: right;}
.popup_calculator .p_detail .detail_area .d_price .cash {font-size: 18px; color: #323949; font-weight: 700; /*vertical-align: middle;*/}
.popup_calculator .p_detail .detail_area .d_price .won {font-size: 18px; color: #323949;}
.popup_calculator .p_detail .detail_area .d_price .btn_tip {position: absolute; right: -23px; top: -10px; cursor: pointer;}
.popup_calculator .p_detail .detail_area .d_top:after {content: ""; display: block; clear: both;}
.popup_calculator .p_detail .detail_body {margin-top: 20px; padding-top: 20px ; border-top: 1px solid #d8d8d8; font-size: 16px; line-height: 22px; color: #222;}

/* 20240206 추가 */
.popup_calculator .p_detail .detail_area .detail_title{border-bottom: 1px solid #d8d8d8;padding: 10px 0;margin-bottom: 20px;}

.popup_calculator .p_detail .detail_area .t_label {float: left; font-size: 20px; color: #222; font-weight: 600;}
.popup_calculator .p_detail .detail_area .d_label {float: left; font-size: 18px; color: #222; font-weight: 600;}
.popup_calculator .p_detail .detail_area .d_price {margin-right: 25px; position: relative; float: right;}
.popup_calculator .p_detail .detail_area .d_price .t_cash {font-size: 20px; color: #323949; font-weight: 700; /*vertical-align: middle;*/}
.popup_calculator .p_detail .detail_area .d_price .cash {font-size: 18px; color: #323949; font-weight: 700;/*vertical-align: middle;*/}
.popup_calculator .p_detail .detail_area .d_price .won {font-size: 18px; color: #323949;}
.popup_calculator .p_detail .detail_area .d_price .btn_tip {position: absolute; right: -23px; top: -10px; cursor: pointer;}
.popup_calculator .p_detail .detail_area .d_top:after {content: ""; display: block; clear: both;}
.popup_calculator .p_detail .detail_body {margin: 20px 0; padding: 20px 0 ; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; font-size: 16px; line-height: 22px; color: #222;}

.popup_calculator .p_detail .discount_area > ul > li  {position: relative; padding: 6px 0 6px 10px;}
.popup_calculator .p_detail .discount_area > ul > li:after {content: ""; display: block; clear: both;}

.popup_calculator .p_detail .discount_area .detail_title{border-bottom: 1px solid #d8d8d8;padding: 10px 0;margin-bottom: 20px;}

.popup_calculator .p_detail .discount_area .t_label {float: left; font-size: 20px; color: #222; font-weight: 600;}
.popup_calculator .p_detail .discount_area .d_label {float: left; font-size: 18px; color: #222; font-weight: 600;}
.popup_calculator .p_detail .discount_area .d_label .btn_tip {position: relative; top: -10px; cursor: pointer;}

.popup_calculator .p_detail .discount_area .d_price {margin-right: 25px; position: relative; float: right;}
.popup_calculator .p_detail .discount_area .d_price .t_cash {font-size: 20px; color: #323949; font-weight: 700; /*vertical-align: middle;*/}
.popup_calculator .p_detail .discount_area .d_price .cash {font-size: 18px; color: #e93d6a; font-weight: 700;}
.popup_calculator .p_detail .discount_area .d_price .won {font-size: 18px; color: #222;}
.popup_calculator .p_detail .discount_area .d_price .btn_tip {position: absolute; right: -23px; top: -10px; cursor: pointer;}
.popup_calculator .p_detail .discount_area .d_top:after {content: ""; display: block; clear: both;}
.popup_calculator .p_detail .discount_area .d_btm {margin-top: 20px;}
.popup_calculator .p_detail .discount_area .d_btm p {font-size: 14px}
.popup_calculator .p_detail .discount_area .d_btm select.input_form {width: calc(100% - 43px);}
/* 20240206 추가 끝 */

.popup_calculator .p_sum .sum_area {padding: 25px 30px; height: 80px; background-color: #fff; border:2px solid #ced8df; border-top-width: 1px; overflow: hidden; box-sizing: border-box;}
.popup_calculator .p_sum .sum_area .sum_label {float: left; font-size: 24px; color: #323949; font-weight: 600;}
.popup_calculator .p_sum .sum_price {float: right; font-size: 26px; color: #323949; font-weight: 700;}
.popup_calculator .p_sum .discount_area {padding: 0 50px; background-color: #f5f5f5;}
.popup_calculator .p_sum .discount_area > ul > li {padding: 20px 0; border-top: 1px solid #d8d8d8; }
.popup_calculator .p_sum .discount_area > ul > li:first-child {border-top: 0;}
.popup_calculator .p_sum .discount_area > ul > li:after {content: ""; display: block; clear: both;}
.popup_calculator .p_sum .discount_area .d_label {float: left; font-size: 20px; color: #222; font-weight: 400;}
.popup_calculator .p_sum .discount_area .d_label .btn_tip {position: relative; top: -10px; cursor: pointer;}
.popup_calculator .p_sum .discount_area .d_price {position: relative; float: right;}
.popup_calculator .p_sum .discount_area .d_price .cash {font-size: 20px; color: #e93d6a; font-weight: 700;}
.popup_calculator .p_sum .discount_area .d_price .won {font-size: 20px; color: #222;}
.popup_calculator .p_sum .discount_area .d_price .btn_tip {position: absolute; right: -23px; top: -10px; cursor: pointer;}
.popup_calculator .p_sum .discount_area .d_top:after {content: ""; display: block; clear: both;}
.popup_calculator .p_sum .discount_area .d_btm {margin-top: 20px;}
.popup_calculator .p_sum .discount_area .d_btm p {font-size: 14px}
.popup_calculator .p_sum .discount_area .d_btm select.input_form {width: calc(100% - 43px);}

.popup_calculator .benefit_toggle {overflow: hidden;}
.popup_calculator .benefit_toggle dt {position: relative; padding: 24px 30px; height: 80px; background-color: #fff; box-sizing: border-box; cursor: pointer; border-radius: 0 0 20px 20px; border : 2px solid #ced8df;}
.popup_calculator .benefit_toggle.active dt {border-radius: 0;}
.popup_calculator .benefit_toggle dt span.btn_more {font-size: 0;}
.popup_calculator .benefit_toggle dt span.btn_more:after {content: ""; position: absolute; right:40px; top:30px; display: inline-block; width: 12px; height: 12px; border-style: solid; border-color: #323949; border-width: 0 0 2px 2px; transform: rotate(-45deg);}
.popup_calculator .benefit_toggle.active > dt span.btn_more:after {top:40px; transform: rotate(135deg);}
.popup_calculator .benefit_toggle dt i {vertical-align: middle;}
.popup_calculator .benefit_toggle dt span {margin-left: 10px; vertical-align: middle;}
.popup_calculator .benefit_toggle dt .title {color: #323949; font-size: 24px; font-weight: 600;}
.popup_calculator .benefit_toggle dd {display: none; padding: 20px 30px; background-color: #e9eef2; border-radius: 0 0 20px 20px; text-align: center; font-size: 0;}
.popup_calculator .benefit_toggle dd .img {display: inline-block; width: 260px; vertical-align: middle;}
.popup_calculator .benefit_toggle dd .text {padding: 20px 0; margin-left: 20px; display: inline-block; width: calc(100% - 280px); text-align: left; vertical-align: middle;}
.popup_calculator .benefit_toggle dd .text span {font-size: 24px; line-height: 40px; font-weight: 600; color: #222; word-break: keep-all;}
.popup_calculator .benefit_toggle.active dd {display: block;}
.popup_calculator .banner_evt {margin-top: 50px;}

.popup_calculator .tooltip {display: none; padding: 15px 40px 15px 15px; position: absolute; right: -42px; bottom: 62px; max-width: 300px; border-radius: 10px; border: 1px solid #323949; background-color: #e9eef2; box-sizing: border-box; }
.popup_calculator .tooltip:after {content: ""; position: absolute; bottom: -20px; right: 40px; display: block; width: 26px; height: 20px; background: url("/html/images/front/ko/direct/arrow_tooltip.png") no-repeat;}
.popup_calculator .tooltip .item_cont p {font-size: 14px; color: #323949; font-family: 'GmarketSansMedium';}
.popup_calculator .tooltip .item_cont p span {font-family: 'GmarketSansBold';}
.popup_calculator .tooltip .item_cont p span.red {color: #e93d6a;}
.popup_calculator .tooltip .ui_close {right: 10px; top: 10px;}

/* 팝업 : 우편번호 검색 */
.popup_post .pop_contents {padding-top: 50px;}
.popup_post .boder_box {padding: 28px; border:2px solid #ccc; border-radius: 12px; box-sizing: border-box;}
.popup_post .boder_box .certi_radio {border-bottom: 1px solid #ccc; padding-bottom: 20px;}
.popup_post .boder_box .adress_sel {display: none; margin-top: 24px;}
.popup_post .boder_box .adress_sel.active {display: block;}
.popup_post .boder_box .adress_sel .box:after {content: ""; display: block; clear: both;}
.popup_post .boder_box .adress_sel .adress_item {float: left; height: 72px;}
.popup_post .boder_box .adress_sel .adress_item + .adress_item {margin-left: 10px;}
.popup_post .boder_box .adress_sel .adress_item dt {font-size: 14px; color: #323949;}
.popup_post .boder_box .adress_sel .adress_item dd {margin-top: 8px; font-size: 18px;}
.popup_post .boder_box .adress_sel .adress_item.city_item {width: 190px;}
.popup_post .boder_box .adress_sel .adress_item.city_item .city_form {width: 100%;}
.popup_post .boder_box .adress_sel .adress_item.load_item {width: 190px;}
.popup_post .boder_box .adress_sel .adress_item.load_item .load_form {width: 100%;}
.popup_post .boder_box .adress_sel .adress_item.num_item dd {font-size: 0;}
.popup_post .boder_box .adress_sel .adress_item.num_item dd span {display: inline-block; font-size: 18px;}
.popup_post .boder_box .adress_sel .adress_item.num_item .num_form {width: 70px;}
.popup_post .boder_box .adress_sel.lotnum .adress_item.num_item .num_form {width: 160px;}
.popup_post .boder_box .adress_sel .adress_item.num_item .post_dash {width: 20px; text-align: center;}
.popup_post .boder_box .adress_sel .adress_item .btn_post_search {margin-top: 25px; padding:13px 10px 12px; width: 90px; vertical-align: bottom;}

.popup_post .boder_box .text_etc {margin-top: 5px; font-size: 14px; color: #666; line-height: 20px;}
.popup_post .adress_area {margin-top: 30px;}
.popup_post .adress_area .ad_head {background-color: #e9eef2; border-top: 3px solid #323949; border-bottom: 1px solid #7a8490;}
.popup_post .adress_area .ad_head dl {font-size: 0;}
.popup_post .adress_area .ad_head dl dt {padding: 15px 0; font-size: 16px; font-weight: 600; text-align: center; color: #192a4e;}
.popup_post .adress_area .ad_head .adress_label {display: inline-block; width: calc(100% - 110px);}
.popup_post .adress_area .ad_head .post_label {display: inline-block; width: 110px;}

.popup_post .adress_area .ad_body {padding: 3px 2px 3px 0;height: 350px; border-bottom: 1px solid #dde2e5; box-sizing: border-box;}
.popup_post .adress_area .list_post {}
.popup_post .adress_area .list_post li {padding-left: 20px; cursor: pointer;}
.popup_post .adress_area .list_post li:hover {background-color: #f5fdfe;}
.popup_post .adress_area .list_post li:after {content: ""; display: block; clear: both;}
.popup_post .adress_area .list_post li + li {border-top: 1px solid #dde2e5;}
.popup_post .adress_area .list_post li:after {content: ""; display: block; clear: both;}
.popup_post .adress_area .list_post li .address_area {padding: 10px 0; float: left; width: calc(100% - 90px);}
.popup_post .adress_area .list_post li .address_area dl {overflow: hidden;}
.popup_post .adress_area .list_post li .address_area dl + dl {margin-top: 10px;}
.popup_post .adress_area .list_post li .address_area .ad_title {float: left; background-color:#7a8490; font-size: 12px; color:#fff;  font-weight: 600; width: 50px; height: 20px; line-height: 20px; text-align: center;}
.popup_post .adress_area .list_post li .address_area .ad_info {padding: 0 10px; font-size: 14px; color:#333; box-sizing: border-box; overflow: hidden;}
.popup_post .adress_area .list_post li .ad_num {float: right; width: 90px; font-size: 14px; line-height: 70px; font-weight: 600; color: #333; text-align: center;}

.popup_post .adress_area .list_post li.no_item {padding: 20px 0;display: table; width: 100%; box-sizing: border-box; cursor: inherit;}
.popup_post .adress_area .list_post li.no_item .box {display: table-cell; text-align: center;}
.popup_post .adress_area .list_post li.no_item .box span {display: inline-block;}

.popup_post .pop_footer {padding: 25px 0;}
/********************************
 툴팁 팝업
 ********************************/
.popup_tooltip {display: none; position: absolute; border: 1px solid #323949; width: 610px; border-radius: 10px; background-color: #e9eef2; z-index: 100; left: 50%;
 transform:translate(-50%, -50%);
 -webkit-transform:translate(-50%, -50%);
 -moz-transform:translate(-50%, -50%);
 -ms-transform:translate(-50%, -50%);
 -o-transform:translate(-50%, -50%);
}
.popup_tooltip .ui_close {right: 15px; top:15px;}
.popup_tooltip .tooltip_cont {padding: 40px;}

.popup_tooltip .item_cont {padding: 35px 30px; position: relative; font-family: 'GmarketSansMedium';}
.popup_tooltip .item_cont.font_nanum {font-family: "나눔고딕", "NanumGothic";}
.popup_tooltip .item_cont + .item_cont {padding-top: 0; }
.popup_tooltip ul.item_cont > li + li {margin-top: 15px;}
.popup_tooltip .item_cont > ul > li + li {margin-top: 15px;}
.popup_tooltip .item_cont .title {font-size: 22px; line-height: 26px; color: #323949;}
.popup_tooltip .item_cont .title span.plus {margin: 0 5px; display: inline-block; vertical-align: middle;}
.popup_tooltip .item_cont .text_detail {margin-top: 10px; padding: 0 30px;}
.popup_tooltip .item_cont .text_detail > li {padding-left: 10px; position: relative; font-size: 18px; line-height: 26px; color: #555;}
.popup_tooltip .item_cont .text_detail > li:before {content: "·"; position: absolute; left: 0; top: 0;}
.popup_tooltip .item_cont p.text_etc,
.popup_tooltip .item_cont .text_etc li {font-size: 16px; line-height: 28px; color: #7a8490;}

.popup_tooltip .item_cont .box {margin-top: 15px; padding: 15px 30px; background-color: #fff; border-radius: 10px;}
.popup_tooltip .item_cont .box:after {content: ""; display: block; clear: both;}

.popup_tooltip .item_cont p.text {font-size: 16px; color: #323949; font-weight: 600;}
.popup_tooltip .item_cont p.text:before {content: "*";}
.popup_tooltip .item_cont .text_list {margin-top: 10px;}
.popup_tooltip .item_cont .text_list li {position: relative; padding-left: 20px; font-size: 16px; color: #323949;}
.popup_tooltip .item_cont .text_list li:before {content: "ㆍ"; position: absolute; left: 0; top:0;}
.popup_tooltip .item_cont .text_list li + li {margin-top: 5px;}
.popup_tooltip .item_cont .btn_more {margin-top:10px; float: right; font-size: 16px; font-weight: 600; color: #00a2bd;}
.popup_tooltip .item_cont .service_list li {display: table; width: 100%; padding: 15px 0; border-bottom: 1px solid #d8d8d8; }
.popup_tooltip .item_cont .service_list li:after {content: ""; display: block; clear: both;}
.popup_tooltip .item_cont .service_list li > div {display: table-cell; vertical-align: middle;}
.popup_tooltip .item_cont .service_list li .service_logo {width: calc(100% - 415px);}
.popup_tooltip .item_cont .service_list li .service_price {width: 145px;}
.popup_tooltip .item_cont .service_list li .service_price p {font-size: 16px; color: #323949; text-align: center;}
.popup_tooltip .item_cont .service_list li .service_price p strong {font-size: 20px; font-family: 'GmarketSansBold';}
.popup_tooltip .item_cont .service_list li .service_tel {width: 270px; text-align: center;}
.popup_tooltip .item_cont .service_list li .service_tel .tag {padding: 3px 20px; display: inline-block; min-width: 150px; height: 30px; background-color: #e93d6a; border-radius: 15px; box-sizing: border-box;}
.popup_tooltip .item_cont .service_list li .service_tel .tag span {font-size: 16px; color: #fff; letter-spacing: -0.05em;}
.popup_tooltip .item_cont .service_list li .service_tel p {margin-top: 10px; font-size: 12px; line-height: 16px; color: #323949; letter-spacing: -0.08em;}
.popup_tooltip .item_cont .service_etc {margin-top: 10px;}
.popup_tooltip .item_cont .service_etc li {padding-left: 15px; position: relative; font-size: 14px; letter-spacing: -0.05em; color: #7a8490;}
.popup_tooltip .item_cont .service_etc li:before {content: "※"; position: absolute; left: 0; top: 3px;}

/********************************
 이벤트 팝업
 ********************************/
.popup_evt {display:none; position:absolute; z-index:99;}
.popup_evt.active {display:block;}
.popup_evt dt {font-size:0;}

/* 스크롤퀵배너 */
.popup_quick_evt {display:none; position:absolute; z-index:99;}
.popup_quick_evt.active {display:block;}
.popup_quick_evt dt {font-size:0;}

.popup_quick {
  animation-name: pop-floating;
  -webkit-animation-name: pop-floating;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  left:78%;
  margin-left: -160px;
  z-index:999;
  /*margin-top:17%; 큰 팝업_230201*/
  margin-top:23%;
 }
.popup_quick .quick_close {right: 1px; top: 1px;}

.quick_close {overflow:hidden; display:block; position:absolute; width: 54px;height:54px; padding:30px 0 0;  z-index:2;cursor: pointer;}
.quick_close:before, .quick_close:after {content:'';display:block;position:absolute;left:50%;top:50%;background: url("/html/images/front/ko/direct/pop_chicken_close.png"); margin:-1px 0 0 -6px;-webkit-transition:all 0.3s ease;transition:all 0.3s ease; cursor: pointer;}
.quick_close:before {-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.quick_close:after {-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);}


/* 납부요금 계산 버튼 이벤트 배너 */
.popup_evt1 {
  animation-name: pop-floating;
  -webkit-animation-name: pop-floating;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  left:50%;
  margin-left: -160px;
 }
.popup_evt1 .ui_close {right: 10px; top: 30px;}

/* 수신동의 이벤트 배너 */
.popup_evt2 {margin-top: 30px; position: relative;}
.popup_evt2 > dl {display: block; overflow: hidden;}
.popup_evt2 > dl dd:before{content: ''; display: inline-block;width: 0; height: 0; position: absolute; top: -20px; left: 40px; border-right: 15px solid transparent; border-left:15px solid transparent; border-bottom:20px solid #e8edf3;}
.popup_evt2 .ui_close {left: 265px; top:10px;}

/********************************
 클로즈 메세지 팝업(알림)
 ********************************/
.popup_meg .ui_close {right: 20px; top: 20px;}
.popup_meg .pop_contents .img_area {margin-top: 30px; text-align: center;}

.popup_alert1 .text {margin: 0 40px; font-size: 30px; line-height: 40px; color:#323949; letter-spacing: -0.05em; text-align: center;}
.popup_alert1 .closetext { font-size: 16px; line-height: 40px; color:#323949; letter-spacing: -0.05em; text-align: center; margin-top: 20px;}

.popup_alert2 .alert_wrap {margin: 0 auto; width: 640px;}
.popup_alert2 .alert_wrap:after {content: ""; display: block; clear: both;}
.popup_alert2 .alert_wrap .img_area {margin-top: 0;}
.popup_alert2 .alert_wrap .text_area {padding: 15px 0; text-align: center;}
.popup_alert2 .alert_wrap .text_area .text_point {font-size: 42px; font-weight: 700;  color:#323949; margin-top: 10px;}
.popup_alert2 .alert_wrap .text_area .text_desc {margin-top: 35px; font-size: 36px; line-height: 48px; color:#323949;}

.popup_alert3 .text {margin: 0 40px; font-size: 30px; line-height: 40px; font-weight: 600; color:#323949;}

@media (max-width: 1320px) {
  html {overflow-x: auto !important;}
  .direct_nav {display: none;}
}


/********************************
 신청내역
 ********************************/
 .direct_app {margin: 100px 0 100px;}
 .direct_app .btn_wrap {text-align: center;}
 .direct_app .app_desc {margin: auto; width: 840px; padding:20px 0; border-radius: 50px; font-size: 30px; line-height: 50px; color: #000; text-align: center; background-color: #f5f5f5;}
 .direct_app .app_desc span {color: #00b1c9; font-weight: 600;}
 .direct_app .box {margin: 60px auto 230px; padding: 70px 110px; width: 840px; border: 2px solid #ccc; border-radius: 20px 20px 40px 40px; box-sizing: border-box;}
.direct_app .box dl {font-size: 0;}
.direct_app .box dl + dl {margin-top: 24px;}
.direct_app .box dl dt {display: inline-block; width: 160px; font-size: 18px; font-weight: 600; color: #000;}
.direct_app .box dl dd {display: inline-block; width: calc(100% - 160px);}
.direct_app .box dl dd .input_name {width: 100%;}
.direct_app .box dl dd .input_phone {width: calc(100% - 130px);}
.direct_app .box dl dd .btn_auth {padding: 14px 20px 13px; margin-left: 10px; width: 120px;}
.direct_app .box .btn_wrap .btn_app {margin-top: 40px; width: 300px; height: 50px; border-radius: 25px; background-color: #00b1c9; text-align: center; border: 0;}
.direct_app .box .btn_wrap .btn_app span {color: #fff; font-size: 22px; font-weight: 600;}

.direct_app .table_wrap {margin-top: 50px; padding: 0 40px;}
.direct_app .table_wrap .tbl_desc {text-align: right; margin-top: 10px; font-size: 18px; color: #666;}
.direct_app .table_wrap .tbl_app {margin-top: 15px; width: 100%; border-top: 3px solid #323949;}
.direct_app .table_wrap .tbl_app th {padding: 20px 0; font-size: 16px; color: #192a4e; font-weight: 600; text-align: center; background-color: #e9eef2; border-bottom: 1px solid #7a8490;}
.direct_app .table_wrap .tbl_app td {padding: 15px 0; font-size: 16px; color: #333; text-align: center; border-bottom: 1px solid #dde2e5;}
.direct_app .table_wrap .tbl_app tr:hover {background-color: #f5fdfe;}
.direct_app .btn_link {margin-top: 80px; width: 340px; height: 60px; background-color: #001b6a; border-radius: 12px;}
.direct_app .btn_link span {display: inline; font-size: 22px; color: #fff; font-weight: 600; vertical-align: middle;}
.direct_app .btn_link i {margin-left: 15px;}



/* 링크 스타일 추가 _20220706 */
<style>
a { text-decoration: none; color: black; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:focus { text-decoration: none; }
a:hover, a:active { text-decoration: none; }
</style>

/* 테이블 스타일 추가_20220706 */
<style>
table{margin:5px 0;}

table tr td {
	border:1px solid #767676;
	padding:2px;
}
table tr th{
    background-color: #f5f5f5;
	border:1px solid #767676;
	padding:2px;}

</style>