/*모달 팝업*/
.top_popup {position:relative; padding:15px 0; width:100%; height:100%; font-size:18px; font-weight:400; line-height:40px; color:#222; background-color:#dde4ec; text-align:center; z-index:1; box-sizing:border-box;}
.top_popup .btn_area {position:absolute; bottom:15px; right:40px; font-weight:300; color:#000;}
.top_popup .btn_area input[type="checkbox"] + label:before {content:""; margin:0 auto; position:relative; top:-2px; left:-3px; display:inline-block; width:18px; height:18px; font-size:15px; line-height:22px; text-align:center; vertical-align:middle; border:1px solid #cfcfcf; border-radius:5px; background-color:#fff;}
.top_popup .btn_area input[type="checkbox"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; border:0;}
.top_popup .btn_area input[type="checkbox"] + label {display:inline-block; position:relative; cursor:pointer;}
.top_popup .btn_area input[type="checkbox"] + label:active:before, input[type="checkbox"]:checked + label:active:before {color:#f36f21;}
.top_popup .btn_area input[type="checkbox"]:checked + label:before {content:"\2713"; color:#fff; background-color:#f36f21; border:0; width:20px; height:20px;}
.top_popup .btn_area input[type="checkbox"]:checked + label {color:#f36f21; font-weight:500;}
.top_popup .btn_area .close_btn {position:relative; bottom:0; right:0; margin:0 0 0 10px; width:34px; height:34px; cursor:pointer;}
.main2 .modal_back {display:block;}
#modal_subscribe.modal_wrap {width:500px; background-color:#fff;}
#foot_modal_subscribe.modal_wrap {width:500px; background-color:#fff;}
#modal_cancel.modal_wrap {width:500px; background-color:#fff;}
#modal_question.modal_wrap {display:block; position:fixed; top:50%; left:50%; width:850px; z-index:999; transform:translate(-450px, -50%); background-color:#fff;}
#modal_guide.modal_wrap {display:block; position:fixed; top:82px; left:5%; width: auto; max-width: 90%; height: auto; max-height: 80vh; z-index:999; transform:translate(0, 0); background-color:#fff;}
#modal_guide.modal_wrap .modal_title .ty2 img {width: 60px;} 


/*모달 팝업 - 제목*/
.modal_wrap {position:fixed; top:50%; left:50%; display:none; width:100%; z-index:999; transform:translate(-250px, -40%);}
.modal_wrap.active {transform:translate(-250px, -50%); transition: all 0.5s;}
.modal_inner {position:relative; padding:0 0 25px 0; width:100%;}
.modal_inner.ty2 {padding:0; width:100%;}
.modal_inner .modal_title {width:100%; height:50px; background-color:#1f2c5e;}
.modal_inner .modal_title .tit {margin:0 0 0 30px; font-size:20px; font-weight:700; line-height:50px; color:#fff;}
.modal_inner .modal_title .tit img {padding: 6px 0; width: 60px;}
.modal_inner .modal_title .close {position:absolute; top:0; right:0; padding:17px 0; width:50px; height:16px; text-align:center; background-color:rgba(0, 0, 0,  0.5); cursor:pointer;}
.modal_inner .modal_title .close img {width:16px; height:16px;}
.modal_inner .modal_title.ques {position:relative; width:100%; height:82px; background-color:#1f2c5e;}
.modal_inner .modal_title.ques .tit {margin:0 0 0 20px; padding:28px 0; font-size:26px; font-weight:700; line-height:26px; color:#fff;}
.modal_inner .modal_title.ques .close {position:absolute; top:0; right:0; padding:26.5px 0; width:82px; height:29px; text-align:center; background-color:rgba(0, 0, 0,  0.5); cursor:pointer;}
.modal_inner .modal_title.ques .close img {width:29px; height:29px;}
.modal_inner .modal_title.ty2 {position:relative; width:100%; height:60px; background-color:#9F1C20;}
.modal_inner .modal_title.ty2 .tit {padding:14px 0; line-height:32px;}
.modal_inner .modal_title.ty2 .close {position:absolute; top:0; right:0; padding:15.5px 0; width:60px; height:60px; text-align:center; background-color:rgba(0, 0, 0,  0.5); cursor:pointer;}
.modal_inner .modal_title.ty2 .close img {width:29px; height:29px;}

/*모달 팝업 - 내용*/
.modal_inner .modal_content.ques {margin:0 auto; width:90%; height:550px; overflow-y:auto;}
.modal_inner .modal_content .modal_toparea {margin:40px 0 30px 0; width:100%; height:100px; background-color:#f4f4f4; display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; justify-content:center;}
.modal_inner .modal_content .modal_toparea .icon {width:70px; height:70px; background-image:url("/images/icon/icon_pop01.png");}
.modal_inner .modal_content .modal_toparea .txt {padding:10px 0 0 20px; font-size:18px; font-weight:400; line-height:25px; color:#222;}

.modal_inner .modal_content .qu_content li {margin:0 0 25px 0;}
.modal_inner .modal_content .qu_content .text_q {font-size:18px; font-weight:700; line-height:38px; color:#222;}
.modal_inner .modal_content .qu_content .chk_ra {font-size:18px; font-weight:400; line-height:30px; color:#222;}
.modal_inner .modal_content .qu_content .chk_ra span {padding:0 0 0 20px;}
.modal_inner .modal_content .qu_content .chk_ra span:first-child {padding:0;}
.modal_inner .modal_content .qu_content .textbox {width:100%; height:100px; padding:10px; font-size:16px; line-height:25px; border:1px solid #999; box-sizing:border-box; resize:none;}

.modal_inner .modal_content {margin:0 auto; width:95%; overflow-y:auto;}
.modal_inner .modal_content.ty2 {margin:0 auto; padding: 30px; width:100%; height: 100%; max-height: 70vh; overflow: auto;}
.modal_inner .modal_content.ty2::-webkit-scrollbar {display: block; width: 6px;}
.modal_inner .modal_content.ty2::-webkit-scrollbar-track {border-radius: 5px;}
.modal_inner .modal_content.ty2::-webkit-scrollbar-thumb {background: #ddd; border-radius: 5px;}
.modal_inner .modal_content .input_box {padding:4% 3%; width:94%; background-color:#f4f4f4;}
.modal_inner .modal_content .input_box h2 {margin:0 0 10px 5px; font-size:14px; font-weight:700; line-height:20px; color:#222;}
.modal_inner .modal_content .input_box .email_list ul {display:flex; align-items:center; justify-content:center; flex-wrap:wrap;}
.modal_inner .modal_content .input_box .email_list ul li {margin:0 0 10px 0; width:46.5%;}
.modal_inner .modal_content .input_box .email_list ul li:nth-child(2) {padding:0; width:6%; text-align:center;}
.modal_inner .modal_content .input_box .email_list ul li:nth-child(4) {padding:0; width:100%;}
.modal_inner .modal_content .input_box .email_list ul li .txtfield {padding:0 0 0 5%; width:95%; height:35px; font-size:14px; color:#333; opacity:1;}
.modal_inner .modal_content .input_box .email_list .select select {padding:0 0 0 3%; width:100%; height:35px; font-size:14px; border-radius:5px; color:#333}
.modal_inner .modal_content .input_box .email_list .select:after {top:14px;}

.modal_inner .modal_txt1 {margin:40px 0 20px 0; width:100%; font-size:18px; font-weight:700; line-height:25px; color:#222; text-align:center;}
.modal_inner .modal_content .modal_txt2 {margin:20px 0;}
.modal_inner .modal_content .modal_txt2 h2 {font-size:14px; font-weight:700; line-height:20px; color:#222;}
.modal_inner .modal_content .modal_txt2 p {margin:10px 0 0 0; font-size:14px; font-weight:400; line-height:20px; color:#000;}
.modal_inner .modal_content .modal_txt2 p .modal_chk {margin:0 5px 0 0;}
.modal_inner .modal_content .modal_txt2 table thead {font-size:14px; font-weight:500; line-height:14px; color:#000; border-top:2px solid #626262;}
.modal_inner .modal_content .modal_txt2 table tbody {font-size:14px; font-weight:400; line-height:14px; color:#666;}
.modal_inner .modal_content .modal_txt2 table th {height:35px; text-align:center; border-bottom:1px solid #bec0c2; vertical-align:middle;}
.modal_inner .modal_content .modal_txt2 table td {height:35px; text-align:center; border-bottom:1px solid #bec0c2; vertical-align:middle;}
.modal_inner .modal_content .modal_txt2 table tbody tr:last-child td {border-bottom:1px solid #828282;}
.modal_inner .modal_content .modal_txt3 {margin:40px 0 30px 0; width:100%; font-size:30px; font-weight:700; line-height:30px; color:#222;}
.modal_inner .modal_content .modal_txt4 {font-size:18px; font-weight:300; line-height:30px; color:#222;}
.modal_inner .modal_content .modal_txt4 .bold {font-weight:700; letter-spacing:-1px;}
.modal_inner.ty2 .modal_content .cont_btn {margin:30px auto; width:142px; height:40px; text-align:center;}
.modal_inner.ty2 .modal_content .cont_btn a.btn_blk {display:inline-block; width:142px; height:40px; font-size:16px; font-weight:400; line-height:40px; color:#fff; text-align:center; background-color:#222;}

/*모달 팝업 - 버튼*/
.modal_inner .modal_btn {margin:0 auto; width:100%; display:flex; align-items:center; justify-content:center;}
.modal_inner .modal_btn.mg10 {padding:20px 0 0 0;}
.modal_inner .modal_btn .btn {padding:10px 0; margin:0 0 0 10px; width:178px; font-size:15px; font-weight:400; line-height:20px; text-align:center; cursor:pointer;}
.modal_inner .modal_btn .btn.sub {color:#fff; background-color:#f36f21;}
.modal_inner .modal_btn .btn.cancel {color:#fff; background-color:#5d7183;}
.modal_inner .modal_btn .btn.close {color:#222; background-color:#e2e2e4;}
.modal_inner .modal_btn_ty2 {margin:30px auto; width:100%; display:flex; align-items:center; justify-content:center;}
.modal_inner .modal_btn_ty2 .btn {padding:10px 0; margin:0 0 0 10px; width:178px; font-size:15px; font-weight:400; line-height:20px; text-align:center; cursor:pointer;}
.modal_inner .modal_btn_ty2 .btn.sub {color:#fff; background-color:#f36f21;}
.modal_inner .modal_btn_ty2 .btn.cancel {color:#fff; background-color:#5d7183;}
.modal_inner .modal_btn_ty2 .btn.close {color:#222; background-color:#e2e2e4;}
.modal_inner.ty2 .modal_btn {padding:0 0 0 30px; width:100%; height:47px; font-size:18px; font-weight:300; line-height:30px; color:#222; border-top:1px solid #ddd; background-color:#f6f6f6; justify-content:flex-start; box-sizing:border-box;}
.modal_inner.ty2 .modal_btn input[type="checkbox"] + label:before {content:""; margin:0 auto; position:relative; top:-2px; left: -4px; display:inline-block; width:18px; height:18px; font-size:15px; line-height:22px; text-align:center; vertical-align:middle; border:1px solid #cfcfcf; border-radius:5px; background-color:#fff;}
.modal_inner.ty2 .modal_btn input[type="checkbox"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; border:0;}
.modal_inner.ty2 .modal_btn input[type="checkbox"] + label {display:inline-block; position:relative; cursor:pointer;}
.modal_inner.ty2 .modal_btn input[type="checkbox"] + label:active:before, input[type="checkbox"]:checked + label:active:before {color:#f36f21;}
.modal_inner.ty2 .modal_btn input[type="checkbox"]:checked + label:before {content:"\2713"; color:#fff; background-color:#f36f21; border:0; width:20px; height:20px;}
.modal_inner.ty2 .modal_btn input[type="checkbox"]:checked + label {color:#f36f21; font-weight:500;}


@media (max-width: 1024px) {
	#modal_guide.modal_wrap {top: 80px; left: 50%; transform: translateX(-50%); width: 90%; height: 60vh;}
	.modal_inner .modal_content.ty2 {height: 50vh;}
}

@media (max-width: 768px) {
	#modal_guide.modal_wrap {top: 50px; height: 80vh;}
	.modal_inner .modal_title.ty2 {height: 42px;}
	.modal_inner .modal_title.ty2 img {width: 46px;}
	.modal_inner .modal_title.ty2 .tit {padding: 7px 0; line-height: 16px;}
	.modal_inner .modal_title.ty2 .close {padding: 12px 0; width: 42px; height: 42px;}
	.modal_inner .modal_title.ty2 .close img {width: 16px; height: 16px;}
	.modal_inner .modal_content.ty2 {height: 73vh;}
	
	.modal_inner.ty2 .modal_btn {height: 40px; font-size: 14px;}
	.modal_inner.ty2 .modal_btn input[type="checkbox"] + label:before {top: -1px; left: -4px; width: 14px; height: 14px;}
	.modal_inner.ty2 .modal_btn label {padding-left: 4px;}
}