@charset "utf-8";


html,body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dd,dt,img,a,form,input,select,option,fieldset,textarea,button,label { font-weight:400; font-family:'Noto Sans KR','맑은 고딕',돋움,'Apple SD Gothic Neo',sans-serif; margin:0; padding:0; border:0; line-height:1; color:#666; text-decoration:none; font-size:15px; letter-spacing:-0.3px; box-sizing:border-box;}

table {width:100%; border-spacing:0; border-collapse:collapse;}

/* 폼초기화 */
select,button,input[type=text],input[type=submit],textarea	{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	border-radius:0;
}

select	{	box-sizing:border-box;}
/*크롬사라피*/
@media screen and (-webkit-min-device-pixel-ratio:0){
	select	{	padding-right:22px !important;	background:url(../images/bg_select.png) no-repeat right center; background-size:contain;}
}
/*파이어폭스*/
@-moz-document url-prefix(){
	select	{	padding-right:22px !important;	background:url(../images/bg_select.png) no-repeat right center; background-size:contain;}
}

/*========= input ===========*/
.ip_comm	{display:block; width:100%; height:30px; padding:0; border:0; background-color:transparent;  box-sizing:border-box;}
.ip_comm.tel	{float:left; width:32%;}
.ip_comm.tel+.bar	{float:left; width:2%;text-align:center; }
.set_tel	{overflow:hidden;}
select.ip_comm	{padding-right:0;}
textarea.ip_comm	{height:150px; padding:10px; line-height:1.5;}
.btn_sm	{display:block; width:100%; height:45px; border:0; background-color:#c63939; font-size:16px; color:#fff;}

.cont_center	{overflow:hidden; width:100%; max-width:1000px; margin:0 auto;}
.txt_hidden {position:absolute; overflow:hidden; width:0; height:0; font-size:0; text-indent:-9999%; line-height:0;}

.btn_hbg {position:relative; width:30px; height:30px;}
.btn_hbg span {position:absolute; left:0; top:50%; display:block; width:100%; height:1px; background-color:#fff; text-indent:-999%; font-size:0; line-height:0; transition:all 0.3s }
.btn_hbg span:before,
.btn_hbg span:after {content:""; position:relative; display:block; width:100%; height:1px; background-color:#fff; transition:all 0.3s}
.btn_hbg span:before {top:-6px;}
.btn_hbg span:after {top:5px;}
.on .btn_hbg span {background-color:transparent;}
.on .btn_hbg span:before {top:0px; transform:rotate(45deg);}
.on .btn_hbg span:after {top:-1px; transform:rotate(-45deg);}


/*========= header ===========*/
#header	{position:relative; height:400px; background-repeat:no-repeat; background-position:center; background-size:cover;}
#header .set_title {position:absolute; left:0; top:50%; width:100%; transform:translate(0,-40%);}
#header h1,
#header h2 {text-align:center; color:#fff;}
#header h1 {line-height:50px;font-size:36px; font-weight:800;}
#header h2 {margin-top:20px; font-size:24px;}
#header span {display:block; margin-top:20px; font-size:18px;}

#btn {position:absolute; left:0; top:25px; width:100%;}
#btn a {float:right; font-size:16px; font-weight:300; color:#fff;}
#btn a i {margin-right:4px;}
#btn .btn_list {float:left;}
#btn .btn_del {margin-left:14px;}



/*========= main ===========*/
#cont1 {padding:80px 0;}
#cont1 .tbl_ltv {border-top:1px solid #333;}
#cont1 .tbl_ltv th,
#cont1 .tbl_ltv td {padding:10px; border-right:1px solid #ccc; text-align:center; line-height:24px;}
#cont1 .tbl_ltv thead th {border-bottom:1px solid #333; font-weight:600;}
#cont1 .tbl_ltv thead tr th:last-child {border-right:0;}
#cont1 .tbl_ltv tbody td {border-bottom:1px solid #ccc;}
#cont1 .tbl_ltv tbody tr td:last-child {border-right:0;}
#cont1 .tbl_ltv .amt {color:#d81818;}

#cont2 {padding:80px 0; background-color:#ebf7f9; text-align:center;}
#cont2 h3 {line-height:47px; text-align:center; font-size:36px; font-weight:800; color:#333;}
#cont2 h3 strong {color:#0db077}
#cont2 p {text-align:center; font-size:22px; }
#cont2 p.crit {display:inline-block; margin:0 auto; margin-top:15px; padding:8px 25px 10px 25px ; border-radius:50px; font-weight:600; background-color:#555; color:#fff;}
#cont2 p.info {margin-top:25px; line-height:38px; letter-spacing:-1px;}
#cont2 p.info strong {color:#333;}

#cont3 {padding:80px 0;}
#cont1 h3,
#cont3 h3 {margin-bottom:40px; font-size:26px; font-weight:700; color:#333;}
#cont3 h4 {margin-bottom:20px; text-align:center; font-size:18px; font-weight:600;}

#cont3 .calculator {display:flex; align-items: center; justify-content: space-between; overflow:hidden; border:1px solid #ddd; background-color: #fff;}
#cont3 .calculator>div {width:50%; padding:40px 50px;}
#cont3 .calculator dl dt,
#cont3 .calculator dl dd {overflow:hidden; float:left; height:50px; line-height:30px; margin-bottom:4px; padding:10px;}
#cont3 .calculator dl dt,
#cont3 .calculator dl dt label {line-height:30px; font-weight:600; color:#444;}
#cont3 .calculator dl dd {position:relative; line-height:30px; }
#cont3 .calculator .m_label {display:none;}

#cont3 .calculator .input_data {background-color: #fff;}
#cont3 .calculator .input_data dt {width:79px;}
#cont3 .calculator .input_data dd {width:320px; background-color:#fff; border:1px solid #eee;}
#cont3 .calculator .input_data dd.readonly {background-color:#eee;}
#cont3 .calculator .input_data .unit {position:absolute; right:10px; top:50%; transform:translate(0,-50%); font-size:14px; font-weight:600;}
#cont3 .calculator .input_data .btn_sm {width:320px; margin-left:79px; margin-top:6px; }

#cont3 .calculator .cal_result {background-color: #f9f9f9; border-left:1px dashed #ddd}
#cont3 .calculator .cal_result .info_input {height:50px; margin-bottom:4px;  background-color:#224c9c; line-height:48px; text-align:center; font-size:20px; font-weight:600; color:#e5ff08; letter-spacing:0;}
#cont3 .calculator .cal_result .info_input .unit {font-size:14px; font-weight:300;}
#cont3 .calculator .cal_result .info_input .unit:after {content:"/"; display:inline-block; margin:0 10px; font-size:16px; color:#e5ff08;}
#cont3 .calculator .cal_result .info_input .unit:last-child:after {display:none;}
#cont3 .calculator .cal_result dl dt,
#cont3 .calculator .cal_result dl dd {width:50%; background-color:#fff; line-height:30px;}
#cont3 .calculator .cal_result dl dt {padding-left:10px; font-weight:600;}
#cont3 .calculator .cal_result dl dd {padding-right:10px; text-align:right; font-size:16px; color:#224c9c;}
#cont3 .calculator .cal_result dl dd.total {font-size:18px; font-weight:700;}
#cont3 .calculator .cal_result dl dd .unit {margin-left:6px; font-size:14px; font-weight:600; color:#666;}
#cont3 .calculator .cal_result .refer {margin-top:6px; line-height:50px; text-align:center ; font-size:16px; font-weight:300; }
#cont3 .wrap_graph {padding:40px 50px; border:1px solid #ddd; border-top:0; border-radius:0 0 20px 20px ; background-color:#f6f6f6}

.graph_cont	{overflow:hidden; width:700px; margin:0 auto;}
.graph_cont .set_graph	{float:left; width:385px;}
.graph_cont .set_graph .category	{}
.graph_cont .set_graph .category li	{display:inline-block; margin-right:15px; font-size:14px;}
.graph_cont .set_graph .category span {display:inline-block; margin-right:6px; text-align:center ;}
.graph_cont .set_graph .category .cate1 span	{color:#b2c6dd}
.graph_cont .set_graph .category .cate2 span	{color:#5289cd}
.graph_cont .set_graph .category .cate3 span	{}

.graph_cont .set_graph .graph	{height:130px; padding-top:11px; margin-top:10px; background:url(../images/graph_line.png)repeat-x; box-sizing: content-box;}
.graph_cont .set_graph .graph li	{position:relative; float:left; width:5%; height:130px; margin-right:3.6363%; background-color:#b9cde5;}
.graph_cont .set_graph .graph li:last-child	{margin-right:0;}
.graph_cont .set_graph .graph li>span	{position:absolute; left:0; bottom:0; display:block; width:100%; background-color:#558ed5;}

.graph_cont .explain	{margin-top:6px;}
.graph_cont .explain .set_arr	{overflow:hidden; width:100%;}
.graph_cont .explain .set_arr span	{display:block; float:left; width:50%; height:16px;}
.graph_cont .explain .set_arr span.l_arr	{background:url(../images/l_arr.png) no-repeat left center;}
.graph_cont .explain .set_arr span.r_arr	{background:url(../images/r_arr.png) no-repeat right center;}
.graph_cont .explain>p	{text-align:center; font-size:14px;}

.graph_cont .graph_tbl	{float:right; width:265px;}
.graph_cont .graph_tbl th,
.graph_cont .graph_tbl td	{width:50%; padding:10px 0; font-size:16px; vertical-align:top }
.graph_cont .graph_tbl th {text-align:left;}
.graph_cont .graph_tbl td	{text-align:right;}
.graph_cont .graph_tbl thead th	{border-bottom:1px solid #224c9c; text-align:left; font-weight:500; color:#224c9c;}
.graph_cont .graph_tbl tbody th	{font-weight:400;}
.graph_cont .graph_tbl tbody td	{ font-weight:600; color:#333;}
.graph_cont .graph_tbl tfoot th,
.graph_cont .graph_tbl tfoot td	{line-height:20px; border-top:1px solid #ccc; }
.graph_cont .graph_tbl tfoot td .point	{font-size:18px; color:#224c9c;}
.graph_cont .graph_tbl tfoot td .ex	{font-size:14px; font-weight:400;}

#cont3 .result {margin-top:35px; line-height:38px; text-align:center; font-size:22px; font-weight:700; color:#333;}
#cont3 .result strong {color:#224c9c}

/*========= footer ===========*/
#footer {padding:60px 0; background-color:#fcf3f3; text-align:center;}
#footer i {font-size:34px; color:#c63939}
#footer p {margin-top:10px; text-align:center; font-size:18px; line-height:28px; color:#c63939;}
#footer .set_btn {margin-top:30px; text-align:center;}
#footer .set_btn a {display:inline-block; width:230px; height:70px; margin:0 5px;  line-height:70px; border-radius:100px; text-align:center ;font-size:26px; font-weight:700; box-shadow:0 0 3px rgba(0,0,0,0.6) }
#footer .set_btn a.btn_cs {background-color:#ffa800; color:#333;}
#footer .set_btn a.btn_reveiw {background-color:#224c9c; color:#fff;}
