/* table */
.tbl-basic {width:100%;}
.tbl-basic table {border-top:2px solid #000;}
.tbl-basic table tr th {padding:20px 16px; font-weight:600; font-size:15px; border:1px solid #e1e3e6; text-align:center; line-height:1.47; color:#000; background:#f8f8f8;}
.tbl-basic table tr td {padding:20px 16px; font-weight:400; font-size:15px; border:1px solid #e1e3e6; text-align:center; line-height:1.47; color:#666;}
.tbl-basic table tr.head-line th {background:#fff; border-bottom:1px solid #000;}
.tbl-basic table [scope="row"] {font-weight:600;}

.tbl-basic table .txt-list {list-style:none;}
.tbl-basic table .txt-list .txt-list {margin-top:8px;}
.tbl-basic table .txt-list+.txt-list {margin-top:12px;}
.tbl-basic table .txt-list li {position:relative; padding-left:20px; font-weight:400; font-size:15px; color:#666; line-height:1.47;}
.tbl-basic table .txt-list li+li {margin-top:8px;}
.tbl-basic table .txt-list li > span {position:absolute; left:0; display:inline-block; width:20px;}
.tbl-basic table .txt-list.disc > li, ul.circle > li, ul.hyphen > li {padding-left:12px !important;}
.tbl-basic table .txt-list.disc > li:before {content:''; position:absolute; left:0; top:9px; width:4px; height:4px; background-color:#797979; border-radius:50%;}
.tbl-basic table .txt-list.circle > li:before {content:''; position:absolute; left:0; top:8px; width:5px; height:5px; border:1px solid #797979; border-radius:50%;}
.tbl-basic table .txt-list.hyphen > li:before {content:''; position:absolute; left:0; top:10px; width:5px; height:1px; background-color:#797979; border-radius:50%;}
.tbl-basic table .txt-list.ast > li {padding-left:12px;}
.tbl-basic table .txt-list.ast > li:before {content:'*'; position:absolute; left:0; top:2px; font-weight:600;}


/* 부가설명 */
.content-box {width:100%;}
.content-box .content+.content {margin-top:60px;}
.content-box .content .title {margin-bottom:12px; font-weight:700; font-size:20px; color:#000; line-height:1.47;}
.content-box .content .head-title {font-size:24px;}
.content-box .content .sub-title {margin-bottom:20px; font-weight:600; font-size:17px; color:#000;}
.content-box .content .type-title {margin-top:10px; font-weight:600; font-size:16px; color:#000;}
.content-box .content p {font-weight:400; font-size:17px; color:#666; line-height:1.47;}
.content-box .content p+p {margin-top:8px;}
.content-box .content img {max-width:100%;}
.content-box .content ul li {position:relative; line-height:1.47; word-break:break-all; color:#666;}
.content-box .content ul li + li {margin-top:8px;}
.content-box .content .text > li {position:relative; padding-left:20px;}
.content-box .content .text > li .number {content:""; display:inline-block; position:absolute; left:0;}
.content-box .content .reference {margin-top:20px; font-weight:400; color:#acacac;}
.content-box .content .list > li {padding-left:16px; font-weight:400; font-size:16px;}
.content-box .content .list > li::before {content:""; display:inline-block; position:absolute; left:0; top:12px; width:3px; height:3px; vertical-align:top; border-radius:3px; background:#000;}
.content-box .content .list > li.fc_point{color: #ff4e00 !important; background: #fff9d1; display: inline-block; padding: 3px 3px 3px 16px;}
.content-box .content .dash > li {margin-top:6px; padding-left:14px;}
.content-box .content .dash > li::before {content:""; display:block; position:absolute; top:0; left:0; width:6px; height:1px; margin:12px 12px 0 0; background:#000;}
.content-box .content .list-number-round > li {padding-left:34px; font-size:19px; font-weight:600;}
.content-box .content .list-number-round > li + li {margin-top:12px;}
.content-box .content .list-number-round > li .number {position:absolute; top:4px; left:0; display:inline-block; width:24px; height:24px; line-height:24px; font-size:15px; font-weight:bolder; text-align:center; font-family:'roboto'; background:#D82146; color:#fff; border-radius:50%;}
.content-box .content .list-number-round > li .text > .number {top:0; width:auto; height:auto; line-height:inherit; font-size:inherit; color:#666; background:transparent; border-radius:inherit;}
.content-box .content .list-check > li {padding-left:23px; font-weight:600; font-size:17px; color:#000;}
.content-box .content .list-check > li + li {margin-top:12px;}
.content-box .content .list-check > li::before {content:""; display:block; position:absolute; top:0; left:0; width:15px; height:12px; margin:8px 0; background:url('../images/icon/ic_check.png') no-repeat;}
.content-box .content .division-area > li + li {margin-top:32px;}
.content-box .content [class^="list"] li > [class^="list"] {margin-top:8px;}
.content-box .content [class^="list"] strong {font-weight:600;}
.content-box .content .item-box {position:relative; padding:24px 30px; border:1px solid #e2e2e2;}
.content-box .content .item-box+.item-box {margin-top:20px;}
.content-box .content .item-box .btn-area {text-align:right}
.content-box .content .stepby-list {display:flex; margin:-10px -15px;}
.content-box .content .stepby-list li {display:inline-block; width:25%; margin-top:0; padding:10px 15px; vertical-align:top; }
.content-box .content .stepby-list li::after {content:""; display:block; position:absolute; right:-3px; top:50%; width:12px; height:12px; margin-top:-3px; border-top:2px solid #acacac; border-right:2px solid #acacac; transform:rotate(45deg); z-index:1;}
.content-box .content .stepby-list li:last-child::before,
.content-box .content .stepby-list li:last-child::after {display:none;}
.content-box .content .stepby-list li .item {height:100%; padding:24px 30px; border:1px solid #e2e2e2; border-radius: 15px;}
.content-box .content .stepby-list li .item > p {margin-top:0; margin-bottom:8px; font-weight:600; color:#4885FF; line-height:1.47;}
.content-box .content .stepby-list li .item > p > .num {font-weight:600; font-size:18px;}

.content-box .content .stepby-list.list3 {}
.content-box .content .stepby-list.list3 li {width:33.33%;}
.content-box .content .stepby-list li > span {display:block; font-weight:400; font-size:15px; color:#666; line-height:1.47; word-break:keep-all;}
.content-box .content .stepby-list li > span.qrcode_0V7h0 {position:relative;}
.content-box .content .stepby-list li > span.qrcode_0V7h0::after {content:""; display:block; width:90px; height:90px; margin-top:6px; background:url('../img/icon/qrcode_0V7h0.jpg') no-repeat; background-size:contain;}

.content-box .content .stepby-img-list {display:flex; font-size:0; margin-top:20px;}
.content-box .content .stepby-img-list::after {content:""; display:block; clear:both;}
.content-box .content .stepby-img-list li {position:relative; width:calc(100% / 4); margin-top:0; text-align:center;}
.content-box .content .stepby-img-list li figure {position:relative; padding:0 34px;}
.content-box .content .stepby-img-list li figure::after {content:""; display:block; position:absolute; right:0; top:50%; width:6px; height:6px; margin-top:-3px; margin-right:-3px; border-top:2px solid #acacac; border-right:2px solid #acacac; transform:rotate(45deg); z-index:1;}
.content-box .content .stepby-img-list li:last-child figure::after {display:none;}
.content-box .content .stepby-img-list li figure img {max-width:100%; border:1px solid #e2e2e2;}
.content-box .content .stepby-img-list li .text {max-width:182px; margin:12px auto 0; padding-left:0; font-size:15px; line-height:1.47;}
.content-box .content .stepby-img-list.img-pc li {width:33.33%;}
.content-box .content .stepby-img-list.img-pc li figure {padding:0 15px;}
.content-box .content .stepby-img-list.img-pc li .text {max-width:inherit; padding:0 15px;}
.content-box .content .stepby-list+.list,
.content-box .content .list+.stepby-list,
.content-box .content .list+.item-box,
.content-box .content p+.item-box,
.content-box .content .item-box+.stepby-list {margin-top:20px;}
.content-box .ico-warn {position:relative; padding-left:28px;}
.content-box .ico-warn::before {content:""; display:inline-block; position:absolute; left:0; width:20px; height:20px; background:url('../images/icon/ico_warning.png') no-repeat; background-size: contain;}
.content-box+.guide {margin-top:24px;}
.content-box .video-box {position:relative; width:70.5%; height:100%; padding-top:39.6%;}
.content-box .video-box iframe {position:absolute; top:0; left:0; width:100%; height:100%; background:#000;}
.content-box .video-box.align-center iframe {position:absolute; left:50%; margin-left:-25%;}


/****************************************
# pps layerpopup
****************************************/
#modal-pay2pay .modal-title {margin-bottom:20px;}
#modal-pay2pay .modal-cont {margin-bottom:20px;}
#modal-pay2pay .pay-price {display:table; width:100%; padding:16px 20px; font-size:18px; border-radius:8px 8px 0 0; background:#abc6ef;}
#modal-pay2pay .pay-price dt {display:table-cell; text-align:left; vertical-align:middle;}
#modal-pay2pay .pay-price dd {display:table-cell; text-align:right; font-weight:600; font-size:24px;}
#modal-pay2pay .pay-price dd strong {font-weight:800; font-size:24px;}
#modal-pay2pay .creditcard {overflow:hidden;  margin-bottom:20px; padding:0; border-radius:0 0 8px 8px; background:#f6f6f6;}
#modal-pay2pay .creditcard img {display:block; width:100%; max-height:100%; margin:0 auto;}
#modal-pay2pay .creditcard .inbox {position:relative; width:50%; margin:0 auto 30px; text-align:center;}
#modal-pay2pay .creditcard .desc {display:inline-block; position:relative; margin:30px 0; font-weight:600; font-size:20px; text-align:center; color:#000;}
#modal-pay2pay .creditcard .card-info {margin-top:40px;}
#modal-pay2pay .creditcard .card-info input {width:100%; height:36px; margin:0;}
#modal-pay2pay .creditcard .card-info li {position:absolute; width:100%;padding:0 30px;}
#modal-pay2pay .creditcard .card-info li .label {position:absolute; left:-9999px; width:1px; height:1px; margin:-1px; font-size:0; line-height:0;}
#modal-pay2pay .creditcard .card-info li .input {display:flex; margin: 0 -5px;}
#modal-pay2pay .creditcard .card-info li .input p {padding: 0 5px; font-weight:500; font-size:15px;}
#modal-pay2pay .creditcard .card-info li.card-no {bottom:26%;}
#modal-pay2pay .creditcard .card-info li.card-valid {bottom:4.5%; left:12%;}
#modal-pay2pay .creditcard .card-info li.card-valid .input {width:50%;}

#modal-account .t-type-02 tbody td {padding:15px 20px;}
#modal-account .table td {font-size: 16px;}
#modal-account .table td .acnt_no {margin: 0; padding: 0; font-size: 16px; border:0;}

@media all and (max-width:768px) {
	/* table */
	.tbl-basic table tr th {padding:15px 3%; font-size:13px;}
	.tbl-basic table tr td {padding:15px 3%; font-size:13px;}

	.tbl-basic table .txt-list .txt-list {margin-top:6px;}
	.tbl-basic table .txt-list+.txt-list {margin-top:12px;}
	.tbl-basic table .txt-list li {position:relative; padding-left:18px; font-size:14px;}
	.tbl-basic table .txt-list li+li {margin-top:6px;}
	.tbl-basic table .txt-list.disc > li, ul.circle > li, ul.hyphen > li {padding-left:10px !important;}


	/* 부가설명 */
	.content-box .content .title {margin-bottom:16px; font-size:18px;}
	.content-box .content .head-title {font-size:20px;}
	.content-box .content .sub-title {margin-bottom:16px; font-size:15px;}
	.content-box .content p {font-size:15px; line-height:1.474;}
	.content-box .content .list > li {padding-left:10px; font-size:15px; line-height:1.47;}
	.content-box .content .dash > li {padding-left:10px;}
	.content-box .content .dash > li::before {width:4px;}
	.content-box .content .list-number-round > li {padding-left:26px; font-size:16px; font-weight:500;}
	.content-box .content .list-number-round > li .number {width:20px; height:20px; line-height:20px; font-size:13px;}
	.content-box .content .list-check > li {padding-left:21px; font-size:16px;}
	.content-box .content .list-check > li::before {width:13px; height:10px; background-size:contain;}
	.content-box .content .item-box {padding:20px 24px;}
	.content-box .content .stepby-list {flex-wrap:wrap; margin:-10px;}
	.content-box .content .stepby-list li {width:50%; padding:10px;}
	.content-box .content .stepby-list li::after {display:none;}
	.content-box .content .stepby-list li .item {padding:16px 24px;}
	.content-box .content .stepby-list li .item > p > .num {font-size:16px;}
	.content-box .content .stepby-list li .item > span {font-size:14px;}
	.content-box .content .stepby-img-list {flex-wrap:wrap;}
	.content-box .content .stepby-img-list li {width:calc(100% / 2);}
	.content-box .content .stepby-img-list li:nth-child(3),
	.content-box .content .stepby-img-list li:nth-child(4) {margin-top:30px;}
	.content-box .content .stepby-img-list li figure {padding:0 12px !important}
	.content-box .content .stepby-img-list li .text {max-width:inherit; padding:0 12px !important; font-size:14px;}
	.content-box .content .stepby-img-list.img-pc li {width:100%;}
	.content-box .content .stepby-img-list.img-pc li + li {margin-top:30px;}
	.content-box .video-box {width:100%; padding-top:59.4%;}
	.content-box .video-box.align-center iframe {left:0; margin-left:0%;}

	.content-box .content .stepby-list+.list,
	.content-box .content .list+.stepby-list,
	.content-box .content .list+.item-box,
	.content-box .content p+.item-box,
	.content-box .content .item-box+.stepby-list {margin-top:16px;}
	.content-box .ico-warn {padding-left:24px;}
	.content-box .ico-warn::before {left:0; top:2px; width:16px; height:16px;}

	/****************************************
	# pps layerpopup
	****************************************/
	#modal-pay2pay .creditcard .inbox {width:inherit; margin:0 20px;}
	#modal-pay2pay .creditcard .desc {font-size:18px;}
	#modal-pay2pay .creditcard .card-info li.card-no {bottom:28.5%;}
	#modal-pay2pay .creditcard .card-info li.card-valid {bottom:7%; left:12%;}
	#modal-pay2pay .creditcard .card-info li.card-valid .input {width:50%;}
}

@media screen and (max-width:560px) {
	#modal-pay2pay .creditcard .card-info input {height:32px;}
	.content-box .content .stepby-list.list3 li {width:50%;}
	.content-box .content .stepby-list.list3 li:nth-child(1) {width:100%;}

	/****************************************
	# pps layerpopup
	****************************************/
	#modal-pay2pay .creditcard .card-info li.card-no {bottom:26%; padding: 0 20px;}
	#modal-pay2pay .creditcard .card-info li.card-valid {bottom:5.5%; left:11%;}

}



@media all and (max-width:460px) {
	#modal-pay2pay .creditcard .card-info li.card-no {bottom:25%; padding:0 10px;}
	#modal-pay2pay .creditcard .card-info li input {height:26px;}
	#modal-pay2pay .creditcard .card-info li .input p {padding: 0 3px;}
}
@media all and (max-width:410px) {
	#modal-pay2pay .creditcard .card-info li.card-no {bottom:24%;}
	#modal-pay2pay .creditcard .card-info li.card-valid {bottom:5.5%; left:7%;}
}
@media all and (max-width:360px) {
	#modal-pay2pay .creditcard .card-info li.card-no {bottom:20%;}
	#modal-pay2pay .creditcard .card-info li.card-valid {bottom:3%; left:6%;}
	#modal-pay2pay .creditcard .card-info li input {height:22px;}
}
