/**sub.css 옮겨온 내용*/

/*******금리안내****/
.conTsearch {background:#f7f7f8; text-align:center; padding:30px 20px; line-height:50px; font-size:16px; display:flex; flex-flow:row wrap; justify-content:center; align-items: center;}
.conTsearch span {color:#000; margin-right:30px; line-height: 22px;}
.conTsearch select {min-width:100px; box-sizing:border-box; border:0;  color:#000; margin:0 0 0 10px; background:#fff url(/_res/hf/ko/img/selarr_btn01.png) no-repeat 100% 50%;}
.conTsearch input[type="submit"] {background:#666; color:#fff; min-width:100px; padding:0 10px; border:none;margin:0 10px; transition:all .2s; height:50px;}
.conTsearch input[type="submit"]:hover {background:#444;}
.conTsearch + h2 {margin-top:40px!important;}

#content.annuity_layout .conTsearch {font-size:20px;} 
@media all and (max-width:1150px){
	#content.annuity_layout .conTsearch {font-size:16px;} 
}

.tbl td .checkIcon {border: 0; clip: rect(0, 0, 0, 0);  height: 1px;  margin: -1px !important;  overflow: hidden; padding: 0;   position: absolute;    width: 1px;}
.tbl td .checkIcon + label{background:url(/_res/hf/ko/img/check_off.png) no-repeat 50% 50%; width:26px; height:26px; display:inline-block; text-indent:-9999px; overflow:hidden;}
.tbl td .checkIcon:checked + label{background:url(/_res/hf/ko/img/check_on.png) no-repeat 50% 50%;}
.tbl td .readonly {border:0; background:#f2f2f2; text-align:center;}

.modal-wrapper { width: 100%; height: 100%; position: fixed; top: 0;  left: 0;visibility: hidden; z-index:9999;}
.modal-wrapper:before:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.4); position:absolute; top:0; left:0;} 
.modal-wrapper.open{opacity: 1; visibility: visible;}
.modal-wrapper .modal {width: 900px; height:700px; display: block; margin: 50% 0 0 -450px; position: relative; top: 50%; left: 50%; background: #fff; opacity: 0;}
.modal-wrapper .modal.browser_height{height:500px;}
.modal-wrapper.open .modal {margin-top: -350px; opacity: 1;}
.modal-wrapper.open .modal.browser_height{margin-top: -250px; opacity: 1;}
.modal-wrapper:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.4); position:absolute; top:0; left:0;} 
.modal-wrapper .head {background:#0579cc;}
.modal-wrapper .head h4 {padding:0 20px; font-size: 22px; color: #fff; line-height:60px;}
.modal-wrapper .btn-close { position: absolute; top: 0; right: 0; width:60px; height:60px; display:flex; align-items: center; justify-content: center; background:#0655a1;}
.modal-wrapper .btn-close img { display: block; width: 16px; height: 16px;}
.modal-wrapper .content { padding:30px; overflow-y: auto; height:calc(100% - 60px);}
.modal-wrapper .emptying{width:120px; border-radius:30px; font-size:14px; color:#333; background:#edeef2; border:1px solid #bfc2c7; padding:2px 0px; font-weight: 600; text-align:center; float:left;}
.modal-wrapper .btn_save{display:block; width: 100px; padding: 3px 0px; border: 1px solid #bfc2c7; font-size: 14px; font-weight: 600; text-align: center; margin: 20px 0px 0 0; color: #000; transition: all .3s; margin:0 auto; margin: 10px auto 0 auto;  line-height: 34px;}

#cms-content .modal-wrapper .content > .h4:first-child{margin-top:0;}

.modal-wrapper.open .product_explanation .memo{width:calc(100% - 300px);}


.manual-wrapper { width: 100%; height: 100%; position: fixed; top: 0;  left: 0;visibility: hidden; z-index:9999;}
.manual-wrapper:before:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.4); position:absolute; top:0; left:0;} 
.manual-wrapper.open{opacity: 1; visibility: visible;}
.manual-wrapper .modal {width: 900px; height:700px; display: block; margin: 50% 0 0 -450px; position: relative; top: 50%; left: 50%; background: #fff; opacity: 0;}
.manual-wrapper .modal.browser_height{height:500px;}
.manual-wrapper.open .modal {margin-top: -350px; opacity: 1;}
.manual-wrapper.open .modal.browser_height{margin-top: -250px; opacity: 1;}
.manual-wrapper:before {content:''; display:block; width:100%; height:100%; background:rgba(0,0,0,0.4); position:absolute; top:0; left:0;} 
.manual-wrapper .head {background:#0579cc;}
.manual-wrapper .head h4 {padding:0 20px; font-size: 22px; color: #fff; line-height:60px;}
.manual-wrapper .manual-wrapper_close { position: absolute; top: 0; right: 0; width:60px; height:60px; display:flex; align-items: center; justify-content: center; background:#0655a1;}
.manual-wrapper .manual-wrapper_close img { display: block; width: 16px; height: 16px;}
.manual-wrapper .content { padding:30px; overflow-y: auto; height:calc(100% - 60px);}
.manual-wrapper .emptying{width:120px; border-radius:30px; font-size:14px; color:#333; background:#edeef2; border:1px solid #bfc2c7; padding:2px 0px; font-weight: 600; text-align:center; float:left;}
.manual-wrapper .btn_save{display:block; width: 100px; padding: 3px 0px; border: 1px solid #bfc2c7; font-size: 14px; font-weight: 600; text-align: center; margin: 20px 0px 0 0; color: #000; transition: all .3s; margin:0 auto; margin: 10px auto 0 auto;  line-height: 34px;}

#cms-content .manual-wrapper .content > .h4:first-child{margin-top:0;}

.manual-wrapper.open .product_explanation .memo{width:calc(100% - 300px);}


.jfix_pro_wrap{margin:30px 10px 30px 10px;     justify-content: space-evenly; display: flex;}
.jfix_pro_wrap .jfix_pro{margin-right:30px;}
.jfix_pro_wrap .jfix_pro:last-child{margin-right:0px;}
.jfix_pro_wrap .jfix_pro .pro_img{position: relative; padding:0 10px;}
.jfix_pro_wrap .jfix_pro .pro_img img{width:54px;}
.jfix_pro_wrap .jfix_pro .pro_img .btn_close{ position: absolute; right:0px; top:0px;  display: flex; align-items: center; justify-content: space-around;background:#7d7d7d; border-radius: 50%; width:24px; height:24px;}
.jfix_pro_wrap .jfix_pro .pro_img .btn_close img {width:12px; height:12px; }
.jfix_pro_wrap .jfix_pro .pro_img span{display: flex; align-items: center; justify-content: space-around; margin:0 auto 10px auto; height:130px; width:130px; border-radius:50%; background:#f6f6f8;}
.jfix_pro_wrap .tbl_type2.over{width: 984px;}	
.jfix_pro_wrap .jfix_pro .pro_name{color:#333; font-size:18px; font-weight: 600; text-align: center; line-height: 25px;}


.tbl_type2{/*border-top:1px solid #ddd;*/ font-size:16px; line-height:24px;}
.tbl_type2 th{color:#000; font-weight: 500}
.tbl_type2 th, .tbl_type2 td{border-bottom:1px solid #ddd; padding:10px 15px;}
.tbl_type2 td{text-align:left; color:#888;}

@media all and (max-width:768px){
	.tbl_type2{width:600px;}
	/*.jfix_pro_wrap{width:600px; justify-content: space-between;}*/
	/*.jfix_pro_wrap{margin:10px 10px 10px 0px; display:block;}
	.jfix_pro_wrap .jfix_pro{display: flex; align-items: center; margin-bottom:20px; margin-right:0;}
	.jfix_pro_wrap .jfix_pro .pro_img{margin-right:30px;}
	.jfix_pro_wrap .jfix_pro .pro_img span{width:120px; height:120px;}*/
}	

.good-job { text-align: center; font-family: 'Montserrat', Arial, Helvetica, sans-serif; color: #0f64a9;}
.good-job .fa-thumbs-o-up { font-size: 60px;}
.good-job h1 {font-size: 45px;}

@media all and (max-width:768px){
	.conTsearch {justify-content:space-between;}
	.conTsearch span {width:100%; line-height:24px; margin-bottom:20px; display:block; margin-right:0;}
	.conTsearch select {width:calc(50% - 30px); margin:0;}
	.conTsearch input[type="submit"] {width:100%; margin:10px 0;}

    .conTsearch > p.ww100 {width:100%; margin-bottom:5px;}
    .conTsearch > p.ww100 select {width:100%;}
    .conTsearch > p.ww100.s3 {display:flex; justify-content: space-between;}
    .conTsearch > p.ww100.s3 select {width:calc(33.33% - 3px);}
}

@media all and (max-width:1000px){
    .modal-wrapper .modal, .manual-wrapper .modal{width:90%; margin: 50% 0 0 -45%;}
    .modal-wrapper .content > .tbl_wrap {margin-top:0;}
	.modal-wrapper.open .product_explanation .memo{width:100%;}
}
/*******금리안내****/
/*******금리안내 블릿 설정****/
ul[class^="list_ul02"]{ margin-top:40px;}
ul[class^="list_ul02"] >li{padding-left:25px;}
ul[class^="list_ul02"] >li:before {content: ''; position: absolute; left: 0; top:9px; width: 15px; height: 16px; background: url(/_res/hf/ko/img/bul_h4.png) no-repeat 0 0;
}
ul[class^="list_ul02"] li >ul >li{padding-left:15px; margin-top:10px; font-size:20px;}
ul[class^="list_ul02"] >li >ul >li:before {content: ''; position: absolute; width:5px; height:1px; left: 0; top:15px; background:#666666;}

@media all and (max-width:768px){

	ul[class^="list_ul02"] li >ul >li{font-size:18px;}
	
}
.graybox {background:#f7f7f7; padding:30px;}
.whitebox {border:1px solid #eee; padding:30px; position:relative;}

.bluebox {background:#C2E9FF; padding:50px;font-weight: bold;border-radius: 10px;}
.redbox {background:#FFD6D6; padding:50px;font-weight: bold;border-radius: 10px;}
.graybox2 {background:#f7f7f7; padding:50px;}
.whitebox2 {border:1px solid #0E2E77; padding-bottom:50px; position:relative;border-radius: 10px;display: flex; flex-direction: column; align-items: flex-start;}
.whitebox2 div {padding:0 50px;}
.whitebox2 .title {border-radius: 10px 10px 0 0;color: #fff;background: #002D73;padding: 20px;margin-bottom: 25px;text-align:center;font-size:26px;width: 100%;}
.whitebox2 .sub_title {color: #000; font-weight:600; margin-top:20px;display: inline-flex;align-items: center;gap: 8px;}
.whitebox2 .sub_title:before {content: ""; width: 19px; height: 19px; background-image: url('/_res/hf/ko/img/icon_sub04_11_04.png');background-size: contain; background-repeat: no-repeat; background-position: center;}
.whitebox2 .total {border-radius: 0 0 10px 10px;color: #000;background: #E9EBF0;padding: 20px;margin: 25px 0 -50px 0;text-align:center;font-size:26px;width: 100%;}
.whitebox2 .round_title,.whitebox2 .round_title2 {display: inline-flex;align-items: center;justify-content: center;color: red;background: #FFDC55;font-weight: 600;gap: 8px;border-radius: 20px;padding: 5px 20px;margin: 50px 0 10px 50px;}
.whitebox2 .round_title:before {content: ""; width: 19px; height: 19px; background-image: url('/_res/hf/ko/img/icon_sub04_11_03.png');background-size: contain; background-repeat: no-repeat; background-position: center; flex-shrink: 0;}
.whitebox2 .round_title2:before {content: ""; width: 19px; height: 19px; background-image: url('/_res/hf/ko/img/icon_sub04_11_05.png');background-size: contain; background-repeat: no-repeat; background-position: center; flex-shrink: 0;}



.bluebox .sub_title {font-size:26px; color: #335faa; font-weight:500; margin-bottom:20px; display: inline-flex;align-items: center;gap: 8px;}
.bluebox .sub_title:before {content: ""; width: 19px; height: 19px; background-image: url('/_res/hf/ko/img/icon_sub04_11_01.png');background-size: contain; background-repeat: no-repeat; background-position: center;}

.redbox .sub_title {font-size:26px; color: #ee3612; font-weight:500; margin-bottom:20px; display: inline-flex;align-items: center;gap: 8px;}
.redbox .sub_title:before {content: ""; width: 19px; height: 19px; background-image: url('/_res/hf/ko/img/icon_sub04_11_02.png');background-size: contain; background-repeat: no-repeat; background-position: center;}



h2.h2.line {border-bottom:1px solid #dedede; padding-bottom:15px;}
h2.h2.line + .special {margin-top:30px!important;}

h2.h2 span {display:inline-block; margin-left:10px; padding-left:10px; position:relative; }
h2.h2 span:before {content:''; width:1px; height:20px; background:#dedede; position:absolute; top:8px; left:0;}
.criteria {display:flex; justify-content:space-between; flex-flow:row wrap; font-size:16px;}
.criteria_type1{display:flex; align-items: center;}
.criteria_type1 img{width: 50px; margin-right: 10px;}

/*.jutec-search {position:relative; background:url(/_res/hf/ko/img/jutec_bg.jpg) no-repeat 50% 0; background-size:cover; display:flex; flex-flow:row wrap; justify-content:flex-start; padding:40px; margin-bottom:30px;}
.jutec-search > div {position:relative; width:30%; margin-bottom:20px; margin-right:5%; display:flex; flex-flow:row wrap;}
.jutec-search > div:nth-child(3n) {margin-right:0;}
.jutec-search > div label {display:block; width:100%; background:#7586a2; text-align:center; color:#fff; font-weight:600; font-size:20px; padding:7px 0px;}
.jutec-search > div select {display:block; width:100%; font-size:16px; background:#fff url(/_res/hf/ko/img/selarr_btn01.png) no-repeat 100% 50%;}
.jutec-search > div.multiselect2 select {width:50%}
.jutec-search > div.multiselect3 select {width:33.3333%}
.jutec-search > div.multiselect3 select:last-child{width:calc(100% - 66.6666%);}
*/
p.product_total {margin-top:50px; color:#000; border-bottom:2px solid #333; padding-bottom:5px;}
p.product_total span {color:#0054a4;}
p.product_total + h2.h2 {margin-top:30px!important;}

/*
.jutec-list {border-top:1px solid #dedede;}
.jutec-list > div {padding:20px 0px; display:flex; flex-flow:row wrap; justify-content:space-between; align-items: center; border-bottom:1px solid #dedede;}
.jutec-list > div .thum {background:#f6f6f8; width:15%;   text-align:center; padding:30px 0px;}
.jutec-list > div .thum img{width:54px;}
.jutec-list > div dl {width:calc(72% - 80px); }
.jutec-list > div dl dt {font-weight:600; color:#333; font-size:22px; margin-bottom:5px;}
.jutec-list > div dl dd ul li {position:relative; display:flex; justify-content:space-between; font-size:16px; line-height:24px; margin-bottom:5px;}
.jutec-list > div dl dd ul li strong{width:80px;  text-align: justify; display:inline-block; position:relative; color:#000;}
.jutec-list > div dl dd ul li strong:after {content:''; display:block; width:1px; height:13px; background:#dedede; position:absolute; top:6px; right:0;}
.jutec-list > div dl dd ul li span{width:calc(100% - 100px); color:#999; white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis; display:inline-block;}
.jutec-list > div .jbtn {width:13%;text-align:center; display:flex; flex-flow:column wrap; align-content:center;}
.jutec-list > div .jbtn a {display:inline-block; width:100px; padding:3px 0px; border:1px solid #bfc2c7; font-size:14px; font-weight:600; text-align:center; margin:2px 0px; color:#000; transition:all .3s;}
.jutec-list > div .jbtn a:nth-child(2) {background:#f2f2f2;}
.jutec-list > div .jbtn a:hover {background:#333; color:#fff;}

@media all and (max-width:640px){
    .jutec-search {display:block; padding:40px;}
    .jutec-search > div {width:100%; margin-right:0; margin-bottom:15px;}

    .jutec-list > div {align-items:flex-start; }
    .jutec-list > div .thum {width:calc(28% - 20px); padding:20px 0px;}
    .jutec-list > div .thum img{width:60px;}
    .jutec-list > div dl {width:72%; }
    
    .jutec-list > div dl dd ul li span{white-space:normal;    overflow: hidden;    text-overflow: ellipsis; display:inline-block;}
    .jutec-list > div .jbtn {width:100%;  flex-flow:row wrap; justify-content: flex-end; margin-top:15px;}
    .jutec-list > div .jbtn a {width:calc(36% - 2px); margin-left:4px;}
    .jutec-list > div .jbtn a:frst-child {margin-left:0px;}
}
*/
.jfixbox {background:#234672; position: fixed; bottom:0; left:0; width:100%; z-index:9999; visibility: hidden;}
.jfixbox.open{opacity: 1; visibility: visible;}
.jfixbox.jfixbox_close{visibility: hidden;}

.jfixbox > div {width:1260px; margin:0 auto; display:flex; flex-flow:row wrap; padding:30px; align-items: center; justify-content: space-between; position: relative;}
.jfixbox > div div.title { padding-left:60px; background:url(/_res/hf/ko/img/jfix_bg.png) no-repeat 0 30%; width:20%; box-sizing:border-box; width:200px; }
.jfixbox > div div.title p{color:#fff; font-size:30px; font-weight:600;}
.jfixbox > div div.title span{color:rgba(255,255,255,0.6); font-size:16px;}
.jfixbox > div ul {width:calc(100% - 400px);}
.jfixbox > div ul li {margin:0 5px; position:relative; }
.jfixbox > div ul li.hascon {display:block; box-sizing:border-box; border-radius:10px; background:#fff; height:110px; display:flex; align-items: center; justify-content: center;}
.jfixbox > div ul li.hascon span {font-size:18px; width:80%; line-height:24px; padding-left:45px;  text-align:center; font-weight:600; color:#333; display:block; box-sizing:border-box; position:relative;}
.jfixbox > div ul li.hascon img {width:40px; display:inline-block; position:absolute; top:calc(50% - 20px); left:0px;}
.jfixbox > div ul li.hascon a {position:absolute; top:5px; right:5px; width:30px; height:30px; display:block; background:#fff; text-indent:-9999px; overflow:hidden; background:url(/_res/hf/ko/img/btn_close01.png) no-repeat 50% 50%;}
.jfixbox > div ul li.off {display:block; padding:0px;}
.jfixbox > div ul li.off a {display:block; width:100%; height:110px; box-sizing:border-box; border-radius:10px; border:2px dashed #fff; text-align:center; color:#fff;  display:flex; align-items: center;
    flex-direction: column; justify-content: center; font-size:16px;}
.jfixbox > div ul li.off a:before {content:'+'; display:block; font-size:30px;}
.jfixbox > div a.comparison {width:150px; background:#ffcc00; color:#000; text-align:center; padding:10px 0; font-weight:600;}
.jfixbox > div .jfixbox_close{position: absolute; right: 30px; top: 10px; color: #fff; font-size:17px;}
.jfixbox > div .jfixbox_close img{width:10px;}
@media all and (max-width:1360px){
    .jfixbox > div {width:100%; box-sizing: border-box; padding:30px 20px;}
	
    
}

@media all and (max-width:1200px){
    .jfixbox > div ul {padding:0 50px; box-sizing:border-box;}
    .jfixbox > div ul button.slick-arrow {position:absolute; top:calc(50% - 22px); width:44px; height:44px; border-radius:50%; border:1px solid #dedede; overflow:hidden; text-indent:-9999px;}
    .jfixbox > div ul button.slick-arrow.slick-prev {left:0; background:url(/_res/hf/ko/img/arrow_prev.png) no-repeat 50% 50%;}
    .jfixbox > div ul button.slick-arrow.slick-next {right:0; background:url(/_res/hf/ko/img/arrow_next.png) no-repeat 50% 50%;}
}

@media all and (max-width:920px){
    .jfixbox > div {padding: 35px 20px 30px 20px;}
	.jfixbox > div ul li.hascon{/*height:160px;*/ height:110px;}
    .jfixbox > div div.title {width:50%; line-height: 30px;}
    .jfixbox > div ul {width:100%; margin-top:15px;}
    .jfixbox > div a.comparison {width:150px; position:absolute; top:40px; right:20px; padding: 5px 0;}
	.jfixbox > div .jfixbox_close{right:20px; top:5px;}
	
}

@media all and (max-width:680px){
    .jfixbox > div ul {padding:0 50px; box-sizing:border-box;}
    .jfixbox > div div.title p{font-size:26px;}
	
	.jfixbox > div ul button.slick-arrow{width:33px; height:33px;}
}

.search_tbl {border-top:2px solid #333;}
.search_tbl .tbl tbody th, .search_tbl .tbl tbody td {padding:17px 30px; position:relative; align-items: center;}
.search_tbl .tbl tbody th {background:#fff;}
.search_tbl .tbl tbody td select {background:#f4f4f4 url(/_res/hf/ko/img/selarr_btn01.png) no-repeat 100% 50%; border:none;}
.search_tbl .tbl tbody td input[type="radio"] {width:1px; height:1px; opacity:0; position:absolute; top:0; left:0;}
.search_tbl .tbl tbody td span { display:inline-block; line-height:26px; margin:5px 20px 5px 0px; }
.search_tbl .tbl tbody td input[type="radio"] + label{position:relative; display:flex; align-items: center; padding-left:30px;}
.search_tbl .tbl tbody td input[type="radio"] + label:before {content:''; width:24px; height:24px; box-sizing:border-box; border-radius:50%; outline:1px solid #dedede; position:absolute; top:0; left:0;}
.search_tbl .tbl tbody td input[type="radio"]:checked + label:before {background:#b40f1f; border:6px solid #fff;}

.search_tbl .tbl tbody td input[type="checkbox"] {width:1px; height:1px; opacity:0; position:absolute; top:0; left:0;}
.search_tbl .tbl tbody td input[type="checkbox"] + label{position:relative; display:flex; align-items: center; padding-left:30px;}
.search_tbl .tbl tbody td input[type="checkbox"] + label:before {content:''; width:24px; height:24px; box-sizing:border-box; border-radius:50%; outline:1px solid #dedede; position:absolute; top:0; left:0;}
.search_tbl .tbl tbody td input[type="checkbox"]:checked + label:before {background:#b40f1f; border:6px solid #fff;}


@media all and (max-width:768px){
    .search_tbl .tbl col.w20 {width:35%!important;}
}


ul.bunhal {display:flex; flex-flow:row wrap; border-top:2px solid #333; font-size:16px; position:relative;}
ul.bunhal:after {content:''; display:block;  width:100%; height:1px; background:#dedede; position:absolute; bottom:0; left:0;}
ul.bunhal li {width:50%; display:inline-block;  border-bottom:1px solid #dedede; display:flex; flex-flow:row wrap; align-items: center;}
ul.bunhal li > label {width:30%; display:inline-block; border-right:1px solid #dedede; padding:20px 20px; color:#000;}
/* ul.bunhal li:nth-child(2n) label {border-left:1px solid #dedede;} */
ul.bunhal li:nth-child(odd){border-right:1px solid #dedede;}
ul.bunhal li:nth-child(odd):last-child{border-right:1px solid #fff;}
ul.bunhal li label + p,
ul.bunhal li label + input[type="text"],
ul.bunhal li label + select {margin:0 15px; background:#f4f4f4; width:calc(70% - 30px); padding:0 10px; border:none; position:relative;}
ul.bunhal li label + select {background:#f4f4f4 url(/_res/hf/ko/img/selarr_btn01.png) no-repeat 100% 50%;}
ul.bunhal li label + p {background:transparent;}

ul.bunhal + ul.bunhal {margin-top:40px;}

@media all and (max-width:1024px){
    ul.bunhal li {width:100%; }
    ul.bunhal li:nth-child(odd) {border-right:none;}
}

@media all and (max-width:768px){
	ul.bunhal li label + p,
    ul.bunhal li label + input[type="text"],
	ul.bunhal li label + select {width:calc(65% - 30px);}
	ul.bunhal li > label {width:35%;}
}



span.radio_t01 { display:inline-block; line-height:26px; margin:5px 20px 5px 0px; position: relative;}
span.radio_t01 input[type="radio"] {width: 24px; height: 24px; opacity: 1;  position: absolute;top: -3px;left: -5px; z-index: 0;}
span.radio_t01 input[type="radio"] + label{position:relative; display:flex; align-items: center; padding-left:30px; z-index: 1;}
span.radio_t01 input[type="radio"] + label:before {content:''; width:24px; height:24px; box-sizing:border-box; border-radius:50%; outline:1px solid #dedede; position:absolute; top:0; left:0;}
span.radio_t01 input[type="radio"]:checked + label:before {background:#b40f1f; border:6px solid #fff;}

.imgslidebox {border:1px solid #eee; padding:60px 30px; position:relative; text-align:center;}
.imgslidebox ul {width:calc(100% - 160px); margin:0 auto;}
.imgslidebox ul li {width:100%;}
.imgslidebox ul li img {width:100%;}
.slideImg button.slick-arrow {position:absolute; top:calc(50% - 23px); width:46px; height:46px; border-radius:50%; border:1px solid #ccc; overflow:hidden; text-indent:-9999px; z-index:10; transition:all .3s;}
.slideImg button.slick-arrow.slick-prev {left:-80px; background:url(/_res/hf/ko/img/slide_arrow_prev.png) no-repeat 45% 50%;}
.slideImg button.slick-arrow.slick-next {right:-80px; background:url(/_res/hf/ko/img/slide_arrow_next.png) no-repeat 55% 50%;}
.slideImg button.slick-arrow:hover {background-color:#f2f2f2;}

@media all and (max-width:1024px){
    .imgslidebox {border:1px solid #eee; padding:40px 20px;}
    .imgslidebox ul {width:calc(100% - 120px);}
    .slideImg button.slick-arrow.slick-prev {left:-64px;}
    .slideImg button.slick-arrow.slick-next {right:-64px;}
}

.columtable {position:relative; display:flex; flex-flow:row wrap; align-items: stretch; border-top:2px solid #333;}
.columtable:after {content:''; display:block;  width:100%; height:1px; background:#dedede; position:absolute; bottom:0; left:0;}
.columtable li{display:flex; flex-flow:row wrap; align-items: stretch; width:50%; border-bottom:1px solid #dedede; font-size:16px;}
.columtable li strong {background:#f5f5f5; width:30%; padding:10px; color:#000; font-weight:600; display:flex; align-items: center; justify-content: center; box-sizing:border-box;}
.columtable li span {width:70%; padding:10px; display:flex; align-items: center; justify-content:flex-start; box-sizing:border-box; border-left:1px solid #dedede;}
.columtable li:nth-child(even) strong {border-left:1px solid #dedede;}
@media all and (max-width:768px){
    .columtable li{width:100%;}
    .columtable li:nth-child(even) strong {border-left:none;}
    .columtable li strong {width:35%;}
    .columtable li span {width:65%;}
    .mtaR {text-align:right!important;}
}



.h2.h2.has_underinfo {display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:20px!important;}
span.underinfo {font-size:16px!important; letter-spacing:0!important; padding-left:20px!important; position:relative!important; color:#666!important;}
span.underinfo:before {content:''; width:14px!important; height:10px!important; display:inline-block!important; background:url(/_res/hf/ko/img/check_01.png) no-repeat 0 0!important; position:absolute!important; top:calc(50% - 5px)!important; left:0!important;}
@media all and (max-width:768px){
    .h2.h2.has_underinfo {display:block;}
    .h2.h2.has_underinfo span {display:block!important; margin-left:0!important;}
}


ul.bunhal2 {display:flex; flex-flow:row wrap; border-top:2px solid #333; font-size:16px; position:relative;}
ul.bunhal2:after {content:''; display:block;  width:100%; height:1px; background:#dedede; position:absolute; bottom:0; left:0;}
ul.bunhal2 >li {width:100%; display:inline-block;  border-bottom:1px solid #dedede; display:flex; flex-flow:row wrap; align-items: center; position:relative;}

ul.bunhal2 >li.ww50 {width:50%;}
ul.bunhal2 >li > label, label.essential {width:220px; padding:10px 10px 10px 30px; color:#000; font-weight:600; display:flex; align-items: center; justify-content:flex-start; box-sizing:border-box; /*word-break: break-all; */line-height:24px;}
ul.bunhal2 >li > label.essential, label.essential {background:url(/_res/hf/ko/img/check_01.png) no-repeat 10px 15px;}
ul.bunhal2 >li > div {width:calc(100% - 220px); padding:10px 15px;  box-sizing:border-box; line-height:40px;}
ul.bunhal2 >li > div input[type=text],
ul.bunhal2 >li > div select {height:44px; border:0; background-color:#f4f4f4; width:calc((100% - 50%) - 148px); margin-right:5px; padding:0 10px;}
ul.bunhal2 >li > div select {background:#f4f4f4 url(/_res/hf/ko/img/selarr_btn01.png) no-repeat 100% 50%;}

ul.bunhal2 >li.ww50 input[type=text],
ul.bunhal2 >li.ww50 > div select {width:calc(100% - 25px);}

#content.annuity_layout ul.bunhal2{font-size:20px;}

input[type="date"]::-webkit-calendar-picker-indicator {
    background-image: url(/_res/hf/ko/img/date_icon.png); background-repeat: no-repeat; background-position: right 50%; width:20px; height:20px;
}
ul.bunhal2 >li > div input[type=date] {height:44px; border:0; background-color:#f4f4f4; padding:0 10px;}

ul.bunhal2 >li > div p {display:flex; align-items: center; flex-flow:row wrap;}
ul.bunhal2 >li > div p span.ages_01, ul.bunhal2 >li > div p span.ages_02{padding-left:6%;}
ul.bunhal2 >li > div p span.ages_01 input[type="text"], ul.bunhal2 >li > div p span.ages_02 input[type="text"]{width:180px; margin:0 10px;}
ul.bunhal2 >li > div .bbtn {line-height:42px; border:1px solid #333; width:100px; display:inline-block; text-align:center; margin-right:5px; color:#555; transition:all .3s;}
ul.bunhal2 >li > div .bbtn:hover {background:#f2f2f2;}
ul.bunhal2 >li > div .bbtn + input[type="text"] {width:calc(50% - 252px);}
ul.bunhal2 >li.ww50 > div .bbtn + input[type="text"] {width:calc(100% - 125px);}
ul.bunhal2 >li > div p.text {display:block; line-height:1.6em; margin-top:10px;}
ul.bunhal2 >li > div p.tel select,
ul.bunhal2 >li > div p.tel input[type=text] {width:107px;}
ul.bunhal2 >li > div p.bith select {width:107px;}
ul.bunhal2 >li > div em {display:inline-block; margin-left:15px;}



.securityWord {display:flex; width:180px; justify-content:space-between; align-items: center; position:relative; margin-right:10px;}
.securityWord img.securityimg {border:1px solid #333; width:155px; height:48px;}
.securityWord i {display:flex; width:20px; flex-flow:column wrap; justify-content:space-between;}
.securityWord i a {height:20px; width:20px; overflow:hidden; display:flex; justify-content:space-between; align-items: center;}
ul.bunhal2 >li > div p.security input[type=text] {width:calc(70% - 190px);}

ul.bunhal2 >li:before {content: ''; width:1px; height:100%; background:#dedede; position:absolute; top:0; left:220px;}
ul.bunhal2 >li.ww50.line:after {content: ''; width:1px; height:100%; background:#dedede; position:absolute; top:0; left:0;}

@media all and (max-width:1150px){
	#content.annuity_layout ul.bunhal2{font-size:16px;}
}
@media all and (max-width:1024px){
    ul.bunhal2 >li > div p.mw100 input[type=text] {width:100%!important;}
    ul.bunhal2 >li > div.add p:first-child input {width:calc(100% - 110px)!important;}    
    ul.bunhal2 >li > div.add p input[type=text].w90 {width:100%!important;}
    ul.bunhal2 >li > div p.tel select,
    ul.bunhal2 >li > div p.tel input[type=text] {width:calc((100% - 42px) / 3)!important;}
    ul.bunhal2 >li > div p.bith select {width:calc((100% - 18px) / 3)!important;}
    ul.bunhal2 >li.ww50 {width:100%;}
    ul.bunhal2 >li.ww50.line:after {display:none;}
    ul.bunhal2 >li > div input[type=text],
    ul.bunhal2 >li > div select {width:calc(100% - 25px);}
    ul.bunhal2 >li > div .bbtn + input[type="text"] {width:calc(100% - 130px)!important;}
    ul.bunhal2 >li > div p.security input[type=text] {width:calc(100% - 195px)!important;}
	
	ul.bunhal2 >li > div p span.ages_02, ul.bunhal2 >li > div p span.ages_01{padding-left:0; width:100%; margin-top:5px;}
	ul.bunhal2 >li > div p span.ages_02 input[type=text], ul.bunhal2 >li > div p span.ages_01 input[type=text]{width:calc(100% - 60px)!important;}
	
	
}

@media all and (max-width:768px){
    ul.bunhal2 >li > label {width:130px; }
    ul.bunhal2 >li:before {left:130px;}
    ul.bunhal2 >li > div {width:calc(100% - 130px);}
}

@media all and (max-width:580px){
    ul.bunhal2 >li > div p.security input[type=text] {width:100%!important;}
}

span.checkIcon2 { display:inline-block; line-height:26px; margin:5px 20px 5px 0px; position: relative;}
span.checkIcon2 input[type="checkbox"] {border: 0; clip: rect(0, 0, 0, 0);  height: 1px;  margin: -1px !important;  overflow: hidden; padding: 0;   position: absolute;    width: 1px;}
span.checkIcon2 input[type="checkbox"] + label{position:relative; display:flex; align-items: center; padding-left:30px; }
span.checkIcon2 input[type="checkbox"] + label:before {content:''; width:26px; height:26px; background:url(/_res/hf/ko/img/check_off.png) no-repeat 50% 50%; position:absolute; top:0; left:0;}
span.checkIcon2 input[type="checkbox"]:checked + label:before {background:url(/_res/hf/ko/img/check_on.png) no-repeat 50% 50%;}
span.checkIcon2 input[type="radio"] {/*border: 0; clip: rect(0, 0, 0, 0);  height: 1px;  margin: -1px !important;  overflow: hidden; padding: 0;   position: absolute;    width: 1px;*/}
span.checkIcon2 input[type="radio"] + label{position:relative; display:flex; align-items: center; padding-left:30px; }
span.checkIcon2 input[type="radio"] + label:before {content:''; width:26px; height:26px; background:url(/_res/hf/ko/img/check_off.png) no-repeat 50% 50%; position:absolute; top:0; left:0;}

span.checkIcon2 input[type="radio"]:disabled + label:before {background:url(/_res/hf/ko/img/check_off_disable.png) no-repeat 50% 50%;}

span.checkIcon2 input[type="radio"]:checked + label:before {background:url(/_res/hf/ko/img/check_on.png) no-repeat 50% 50%;}

/* 용어설명 말풍선 추가용 margin 축소용 3추가*/
span.checkIcon3 { display:inline-block; line-height:26px; margin:5px 0px; position: relative;}
span.checkIcon3 input[type="checkbox"] {border: 0; clip: rect(0, 0, 0, 0);  height: 1px;  margin: -1px !important;  overflow: hidden; padding: 0;   position: absolute;    width: 1px;}
span.checkIcon3 input[type="checkbox"] + label{position:relative; display:flex; align-items: center; padding-left:30px; }
span.checkIcon3 input[type="checkbox"] + label:before {content:''; width:26px; height:26px; background:url(/_res/hf/ko/img/check_off.png) no-repeat 50% 50%; position:absolute; top:0; left:0;}
span.checkIcon3 input[type="checkbox"]:checked + label:before {background:url(/_res/hf/ko/img/check_on.png) no-repeat 50% 50%;}
span.checkIcon3 input[type="radio"] {width: 26px; height: 26px;  position: absolute;  top: -3px;  left: -5px;   z-index: 0;}
span.checkIcon3 input[type="radio"] + label{position:relative; display:flex; align-items: center; padding-left:30px; }
span.checkIcon3 input[type="radio"] + label:before {content:''; width:26px; height:26px; background:url(/_res/hf/ko/img/check_off.png) no-repeat 50% 50%; position:absolute; top:0; left:0;}
span.checkIcon3 input[type="radio"]:checked + label:before {background:url(/_res/hf/ko/img/check_on.png) no-repeat 50% 50%;}


ul.l_01 {margin-top:10px;}
ul.l_01 li {line-height:1.6em; position:relative; padding-left:12px;}
ul.l_01 li:before {content:''; width:3px; height:3px; background:#666; position:absolute; top:12px; left:0;}
ul.l_02 {margin-top:10px;}
ul.l_01 li ul.l_02 {margin-top:0px;}
ul.l_02 li {line-height:1.6em; position:relative; padding-left:12px;}
ul.l_02 li:before {content:''; width:4px; height:1px; border-radius:50%; background:#666;  position:absolute; top:13px; left:0;}

ul.l_03 {margin-top:10px;}
ul.l_03 > li {line-height:1.6em; position:relative; padding-left:20px;}
ul.l_03 > li:before {content:'※'; width:3px; height:3px; position:absolute; left:0;}
ul.l_03 > li ul.l_02 {margin-top:0px;}