@charset "utf-8";
/* CSS Document */

body {text-align: center; font-size: 13px; min-height: 1650px;}
.row {margin: 0px;}

.tab_wrap {width: 800px; height: 75px; margin: 0 auto;}
.btn-group {width: 100%; margin: 20px 0 10px; }
.tab_wrap button {width: 33%; height: 45px; background-color: #606e89; color: #afb6c4; }

.graph_wrap {width: 800px; height: 465px; background-color: #f4f6f8; border: 1px solid #dadddf; margin: 0 auto; padding: 40px; position: relative;}
.graph_area {width: 395px; height: 379px; background: url("/img/analysis/_bccNew/graph_11.jpg"); float: left;}
.icon_area {position: absolute; right: 30px; }
.icon_box
.title_select {margin: 20px 0; border-top: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; height: 30px; color: #757575; font-weight: bold; line-height: 25px; background-color: #f6f6f6;}
.icon_select {text-align: left; padding: 0px; line-height: 32px; list-style: none; color: #757575;}
.icon_select li span{margin: 0 0 0 10px;}
.icon_select li img{vertical-align: baseline;}
.btn_icon_text {position: absolute; top: 12px; left: 85px; color: #ffffff; font-size: 16px; }
.btn_icon_text span {font-weight: bold;}

.control_wrap {margin: 0 auto; width: 800px; height: 280px; background-color: #edeff2; border: 1px solid #d5d5d5; border-top: hidden; padding: 40px;}
.col-md-4 {padding: 0px;}

.dropdown-menu, .form-control {font-size: 12px;}
.input-group {}
.input-daterange {position: relative;}
.input-group-carlL {position: absolute; color: #888888; right: 165px; top: 5px}
.input-group-carlR {position: absolute; color: #888888; right: 10px; top: 5px}
.input-daterange input {text-align: left; padding: 0 0 0 20px; color: #888888;}


.btn-group.month {width: 100%; margin: 0px; }
.month {font-size: 11px; font-weight: 100; color: #888888; }


.cont_wrap {display: inline-flex; margin-top:35px; position: relative;}
.cont_wrap .icon{
  margin: 0 10px;
  text-align: center;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  z-index: 2;
  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.cont_wrap .icon span{
  display: block;
  height: 40px;
  width: 40px;
  background: #fff;
  border-radius: 50%;
  position: relative;
  z-index: 2;
  box-shadow: 0px 5px 5px rgba(0,0,0,0.1);
  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  color: #495057;
}
.cont_wrap .icon span i{
  line-height: 40px;
  font-size: 14px;
}
.cont_wrap .icon .tooltip{
  position: absolute;
  top: 0;
  z-index: 1;
  background: #fff;
  color: #fff;
  padding: 6px 6px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 25px;
  opacity: 0;
  min-width: 85px;
  pointer-events: none;
  box-shadow: 0px 5px 5px rgba(0,0,0,0.1);
  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  text-align: center;
  left: -23px;
}
.cont_wrap .icon:hover .tooltip{
  top: 55px;
  opacity: 1;
  pointer-events: auto;
}
.icon .tooltip:before{
  position: absolute;
  content: "";
  height: 13px;
  width: 13px;
  background: #fff;
  left: 50%;
  bottom: 23px;
  transform: translateX(-50%) rotate(45deg);
  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.cont_wrap .icon:hover span{
  color: #fff;
}
.cont_wrap .icon:hover span,
.cont_wrap .icon:hover .tooltip{
  text-shadow: 0px -1px 0px rgba(0,0,0,0.4); 
}
.cont_wrap .facebook:hover span,
.cont_wrap .facebook:hover .tooltip,
.cont_wrap .facebook:hover .tooltip:before{
  background: #3B5999; text-align: center;
}
.cont_wrap .github:hover span,
.cont_wrap .github:hover .tooltip,
.cont_wrap .github:hover .tooltip:before{
  background: #333; text-align: center;
}
.cont_wrap .instagram:hover span,
.cont_wrap .instagram:hover .tooltip,
.cont_wrap .instagram:hover .tooltip:before{
  background: #e1306c; text-align: center;
}

.guide_wrap{width: 800px;  margin: 20px auto 50px; border:1px solid #dadddf; padding: 30px; position: relative;  }
.contentArea {
    overflow: hidden;
    line-height: 160%;
	font-size: 12px;}
.contentArea h4 {
    border-left: 4px solid #2c9bd3;
    padding-left: 7px;
    display: inline-block;
	float: left;
    font-weight: 600;
    font-size: 14px;
    color: #31343f;
    margin-bottom: 10px;
}
.ListTableStyle01 {margin: 15px 0 20px 0;}
.tableStyle01 table {
    width: 100%;
    margin: 15px 0 0 0;
    border-collapse: collapse;
    border-top: 2px solid #67585b;
    border-bottom: 1px solid #e5e6e6;
}
.tableStyle01 table tbody tr th {
    color: #6c6e6f;
    padding: 10px 16px 13px 20px;
    font-size: 12px;
	border: 1px solid #e5e6e7;
    border-width: 1px 0 0 1px;
}
.tableStyle01 table tr th.bg, .tableStyle01 table tr td.bg {
	background-color: #f7f7f7;}
.tableStyle01 table tr th.borL0, .tableStyle01 table tr td.borL0 {
    border-left: 0;
}
.tableStyle01 table tbody tr td {
    padding: 6px 10px 6px 30px;
    }

.tableStyle01 table tbody tr td:hover{
    background-color: #f7f7f7;}

table tr th.tl, table tr td.tl {
    padding-left: 16px !important;
    padding-right: 16px !important;
    text-align: left;
}
.tableStyle01 table tr td {
    line-height: 160%;
    vertical-align: middle;
    text-align: left;
    color: #4d4d4d;
    border: 1px solid #e5e6e7;
    border-width: 1px 0 0 1px;
	background-color: #ffffff;
}
.tableStyle01 .ulList01 {
    margin-bottom: 0px;
}
.ListTableStyle01 .ulList01 {
    margin: 5px 0;
	padding-left: 0px;
}
.tableStyle01 .ulList01 > li {
    padding-left: 10px;
    color: #4d4d4d;
    background: url(/img/analysis/_bccNew/bul_ul01.gif) no-repeat 0 7px;}
.ListTableStyle01 .ulList01 li ul {
    padding-left: 10px;}
.tableStyle01 .ulList01 > li > ul > li {
    padding-left: 7px;
    background: url(/img/analysis/_bccNew/bul_dotted01.png) no-repeat 0px 8px;}


dl, ul, menu, li {
    list-style-type: none;
}

.listBulDot {
    clear: both; padding-left: 5px; 
    margin-top: 15px;}
.listBulDot > li {
    margin-bottom: 6px;
    background: url(/img/analysis/_bccNew/bul_ul01.gif) 0 8px no-repeat;
    padding-left: 12px;
    color: #4d4d4d;
	font-size: 14px;text-align: left;}

.p3 { 
    margin-bottom: 30px;
    color: #444444;font-size: 12px;
    font-style: normal;
}

.modal-dialog {
    margin: 100px auto 0px;
}

.modal-dialog {
    position: relative;
    width: auto;
    pointer-events: none;
}
.inmodal .modal-title span {font-weight: bold; color: #2c9bd3;}

label {
    display: inline-block;
    margin-bottom: 0px; margin: 0 0 0 5px;
}

.inmodal .modal-header {background-color: #f7f7f7;}
.modal-footer {text-align: center; margin: 0 auto; border: 0;}

/* 추가 */
.block1,.block2,.block3,.block4,.block5,.block6,.block7,.block8,.block9,.block10,.block11,.block12,.block13,.block14,.block15,.block16,.block17{
		   position:absolute; 
		 /* background-color:#abc; */ 
		  left:249px;  
		  top:200px;  
		  /* width:90px; */ 
		  /* height:-90px; */
		  /*margin:-5px;  딱 맞추기 위하여 */
}



/* 추가 css 211223 */
.width_33 {width: 33.3%}
.width_41 {width: 41.6%}
.width_25 {width: 25%}
.p_l_10 {padding: 0 0 0 10px;}
.prog_wrap {margin: 30px 0 10px; position: relative;}
.prog_yymm_1 {position: absolute; top: 45px; left: 0px; color: #999999; font-size: 11px;}

/* 추가 css 2112230 꼬리 */
.tail {position: absolute; top:60px; left:110px;}