@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
body  {
    font-family: 'Nanum Gothic';
	background-color:#eee;
}
input[type=checkbox]{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  margin-right:0.5em;
}
input[type=radio]{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  x-margin-right:0.5em;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input.input-sm {
    height: 26px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
label  {display:block; padding:10px; cursor:pointer;font-family: 'Nanum Gothic';}
label.active {background-color:#337AB7; color:#fff; font-weight:bold;}
label.normal {display:inline;}
.panel .panel-body .list-group .list-group-item {
    padding: 0px;
}

u {
	text-decoration:underline;
	text-underline-position : under;
}
sup {font-weight:bold; color:#00f;}


/* 텍스트 박스 높이 fix*/
.panel .panel-body .list-group .list-group-item input.etc-text {
height: 30px;
vertical-align:middle;
}

.panel .panel-body .list-group .etcfix .btnfix { padding-top: 5px}
.panel .panel-body .list-group .etcfix label {
    padding: 5px 10px
}
/* 부트스트랩보정 : 타이틀 가운데로 */
p.navbar-text	{width:100%; text-align:center;}
.container>.navbar-header,
.container-fluid>.navbar-header,
.container>.navbar-collapse,
.container-fluid>.navbar-collapse
{ width:100%; margin-left:0;  margin-right:0;}


.navbar {   max-width: 800px; margin:auto; margin-bottom:5px;}

/* 타이틀 색상 조정 (부트스트랩 보정) */
.navbar-inverse {background-color:#337ab7;}
.navbar-inverse .navbar-text {
    color: #ffffff;
	letter-spacing:-1px;
}

/* panel-primary */
.panel-primary {font-weight:bold;font-size:1.3em; color:#ffffff;}

.panel-heading p {
	word-break:keep-all;
}

/* ----------------------- */


table.table-condensed label { padding:0};

.narrow		{letter-spacing:-1px;} 
td.narrow	{letter-spacing:-1px;} 
span.narrow	{letter-spacing:-1px;} 
div.narrow	{letter-spacing:-1px;}
table div.narrow {letter-spacing:-1px;}

.narrow2 , span.narrow2 {letter-spacing:-2px;}

/* 포커스 색상 */
input:focus {
	box-shadow: 0 0 10px rgba(200, 0, 0, 5);
	border: 1px solid #ff0000;
	border: 1px solid rgba(0, 0, 0, 5);
}

/* INPUT 읽기전용 스타일 */
.form-control[readonly], input.readonly {background-color:#8BF3A6; border:solid 1px #000;}
.form-control[readonly], input:-moz-read-only { background-color:#8BF3A6; border:solid 1px #000;}	/* For Firefox */
.form-control[readonly], input[readonly]{background-color:#8BF3A6; border:solid 1px #000;}	/*IE*/
.form-control[disabled], input.disabled {background-color:#EEEEEE; border:solid 1px #000;} /* class */

/* PC화면 대응 최대폭*/
.svey-body{
	max-width:800px;
	margin:auto;
	background-color:#fff; 
	padding:20px;
}
@media screen and (max-width: 768px) {
.svey-body{
	padding:5px;
}
}
.svey-body .center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width:90%;
}

/* 하단 다음 버튼 */
input[type=submit] {max-width:200px;}

/*형광펜, 강조*/
/*형광펜?*/
.ypen {background-color:#FFEB35;}
.ypen2 {background-color:#dddddd;}
.red-pen {background-color:#ff0000; color:#fff;}
.impact2 {
	font-weight:bold;
	color: #0000ff;
	background-color:#F0F0F0;
	text-decoration:underline;
	text-underline-position : under;
}
.impact {
	font-weight:bold;
	color: #0000ff;
	
	/*굵은 파랑  */
}

.active .impact  {color:#fff; background-color:#579AD0}
.active .impact2 {color:#fff; background-color:#579AD0}


.bg-white	{background-color:#ffffff;}
.bg-gray	{background-color:#F5F5F5;}

form {margin-bottom:3.0em;}
.active input {color:#000;}

input.iptext {border:solid 1px #acacac;}

/* 5점척도 이미지*/
.ans5-wrapper {width: 100%;}
.ans5-wrapper td {text-align:center;width:20%;}
.ans5-wrapper input[type=radio] {
    border: 0px;
    width: 100%;
    height: 2em;
}

/* 6점척도 이미지*/
.ans6-wrapper {width: 100%;}
.ans6-wrapper td {text-align:center;width:16.6%;}
.ans6-wrapper input[type=radio] {
    border: 0px;
    width: 100%;
    height: 2em;
}

/* 7점척도 이미지*/
.ans7-wrapper {width: 100%;}
.ans7-wrapper td {text-align:center;width:14.2%;}
.ans7-wrapper input[type=radio] {
    border: 0px;
    width: 100%;
    height: 2em;
}

/* 8점척도 이미지*/
.ans8-wrapper {width: 100%;}
.ans8-wrapper td {text-align:center;width:12.5%;}
.ans8-wrapper input[type=radio] {
    border: 0px;
    width: 100%;
    height: 1.5em;
}


.tab5 {background:url(./res/img/eval_bg.png) repeat-x; background-position: 0 50%; }
.tab5 {background:url(/survey/res/img/eval_bg.png) repeat-x; background-position: 0 50%; }
/* */

/* 라디오,채크 위치조정(2줄이상)*/
.btnfix {
	height:100%;float:left; margin-right:5px;
}

/*숫자입력부분*/
.numint, .numfloat {text-align:right;}
.ask, .ask2, .sum10 {width:50px;text-align:center;}



/* 순위 선택 스타일 */
.trnk1 {color:#ee0000;background-color:#FFEB35;}
/* 텍스트 박스*/
textarea.form-control , textarea.textarea { height:5.0em;}

.vcenter_mon {
 position: relative;
}
.vcenter {
  position: absolute;
  top: 50%;
  left:50%;
  transform: translate(-50%,-50%);
  border: 1px dashed deeppink;
} /* 수직 정렬*/

.keep-all {
	word-break: keep-all;
}

/* 설문 페이지 타이틀 제목*/
.top-head {
	font-size:1.1em; padding:0.8em; text-align:left;
}


/* 기타에 텍스트 */
input.w50, input.etc-text {width:50%; display: inline;}
input.w40 {width:40%; display: inline;}
input.w35 {width:35%; display: inline;}
input.w30 {width:30%; display: inline;}

input.s1 {width:100px;}
input.s2 {width:200px;}

input.s20x  {width:20px;}
input.s30x  {width:30px;}
input.s40x  {width:40px;}	/* 4글자 들어가는 스타일 예) 년도 */
input.s50x  {width:50px;}
input.s60x  {width:60px;}
input.s80x  {width:80px;}
input.s100x {width:100px;}

/* 고정크기 2글자짜리 (나이는? : 00세) , 4글자 짜리 (연도는? 2020년 ) */
input.fix2, select.fix2 {width:5.0em; text-align:center; display: inline;}
input.fix4, select.fix4 {width:6.0em; text-align:center; display: inline;}
input.fix1, select.fix1 {width:4.0em; text-align:center; display: inline;}

input.fix10 select.fix10 {width:10.0em; text-align:center; display: inline;}
input.fix20 select.fix20 {width:20.0em; text-align:center; display: inline;}

/* 부트스트랩 기본 label 속성에서 좁게 만듦 */
.mini-label label {
	padding:0; 
}

/* 테이블 가운데 정렬 */
table.middle>thead>tr>th, table.middle>tbody>tr>th, table.middle>tfoot>tr>th, table.middle>thead>tr>td, table.middle>tbody>tr>td, table.middle>tfoot>tr>td {
    vertical-align: middle;
}
table.middle td, div.middle {vertical-align:middle;}

.bold, table tr.bold, table tr td.bold {font-weight:bold;}


/* 볼드 취소*/
span.normal {font-weight:normal;}

ul.list, ul.nopadding {padding-left:1.2em; word-break:keep-all}	/* 들여쓰기 리스트 */
 
.box {
	/* 노란박스 , Top*/
    min-height: 20px;
    padding: 9px;
    margin-bottom: 10px;
    background-color: #FCF5A0;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
}

.box-gray {
	/* 노란박스 , Top*/
    min-height: 20px;
    padding: 9px;
    margin-bottom: 10px;
    background-color: #eeeeee;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
}



.box2 {
	/* 주황 (2차) , Top*/
    min-height: 20px;
    padding: 9px;
    margin-bottom: 10px;
    background-color: #F2B968;
    border: 1px solid #F0AD4E;
	font-weight:bold;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
}


/* 전화번호 형태 */
.TEL { text-align:center;
		max-width:300px;
}


/* 설문형태에 어울리게 일부 수정 */
dl {}
dt {margin-right:0}
.dl-horizontal dd {margin-left:10px;}

@media (min-width: 768px) {
	.dl-horizontal dd {padding-left:20px;}
}
@media (min-width: 992px) {
	.dl-horizontal dd {padding-left:20px;}
}
@media (min-width: 1200px) {
	.dl-horizontal dd {padding-left:20px;}
}

/* 단순선택형 matrix4 */
@media screen and (min-width: 769px) {
	/*PC*/
	div.matrix2  li {width:50%;float:left;}
	div.matrix22 li {width:50%;float:left;}
	div.matrix3  li {width:33.3%;float:left;}
	div.matrix4  li {width:25%;float:left;}
	div.matrix5  li {width:20%;float:left;}
	label div.br {display:none;}
	input.w30_50 {width:30%; display:inline;}
	.pc50 {width:50%; margin:auto;}	/* 컴에서 50% > 모바일은 100%*/
	.pc70 {width:70%; margin:auto;}	/* 컴에서 50% > 모바일은 100%*/
	.pc-center {text-align:center}
	.pc-right {text-align:right}
	br.pc {}
	br.hp {display:none;}
}
@media screen and (max-width: 768px) {
	/*Mobile*/
	/* matrix2 */
	div.matrix22 li {width:50%;float:left;}
	div.matrix4 li {width:50%;float:left;}
	label div.br {display:none;}
	input.w30_50 {width:50%; display:inline;}
	.pc50 {width:100%}
	.hp-center {text-align:center}
	.hp-right {text-align:right}
	br.pc {display:none;}
	br.hp {}

	table.ans7-wrapper .answer {
		width:1.5em;
		height:1.5em;
	}

}

@media screen and (min-width: 768px) {
	.table_sc2 td.sc4_td {display:none;}
}

 /* 반응형 테이블 .mmtable */
@media screen and (max-width: 768px) {
	.mmtable table { border-collapse: collapse; }


  .mmtable table, .mmtable thead, .mmtable tbody, .mmtable th, .mmtable td, .mmtable tr { 
   display: block; 
  }
  
  /* Hide table headers (but not display: none;, for accessibility) */
  .mmtable thead tr { 
   position: absolute;
   top: -9999px;
   left: -9999px;
  }
  
  .mmtable x-tr { border: 1px solid #ccc; }
  
  .mmtable td { 
   /* Behave  like a "row" */
   border: none;
   x-border-bottom: 1px solid #eee; 
   position: relative;
   x-padding-left: 50%; 
  }
  
  .mmtable td:before { 
   /* Now like a table header */
   position: absolute;
   /* Top/left values mimic padding */
   top: 6px;
   left: 6px;
   width: 45%; 
   padding-right: 10px; 
   white-space: nowrap;
  }

  .mmtable td.hp_left { 
		text-align:left;
  }
  .mmtable td div.hp_fleft { 
		float:left; min-width:50%;
		/*height:40px; border-bottom:solid 1px #acacac; margin-bottom:10px;*/
		height:40px; border-bottom:solid 0; margin-bottom:0px;
  }

/* 반응형 스케일 추가 */
	.table_sc2 table { border-collapse: collapse; }
	.table_sc2 table, .table_sc2 thead, .table_sc2 tbody, .table_sc2 th, .table_sc2 td, .table_sc2 tr { display: block; }
	.table_sc2 td.sc2_100 { width:100%;  clear:both; }
	.table_sc2 td.sc2_td, .table_sc2 td.sc3_td, .table_sc2 td.sc4_td   {width:14.2%; float:left;}

	.table_sc2 td.res_w3   {width:33.3%; float:left;}	/* 3점척도 */
	.table_sc2 td.res_w4   {width:25%; float:left;}		/* 4점척도 */
	.table_sc2 td.res_w5   {width:20%; float:left;}		/* 5점척도 */
	.table_sc2 td.res_w6   {width:16.6%; float:left;}	/* 6점척도 */
	.table_sc2 td.res_w7   {width:14.2%; float:left;}	/* 7점척도 */

	.table_sc2 thead td.sc2_td , .table_sc2 tbody td.sc4_td  { height:70px;}
	.table_sc2 thead td.sc3_td { height:30px;}
	.table_sc2 thead tr ,  .table_sc2 tbody tr   { clear:both;}
	.table_sc2 .text-out {	text-indent: 0em; margin-left: 0em; }	/* 내어 쓰기 취소 */

	.table_sc2 thead {display:none;}

	.table_sc2 tbody tr   {margin-bottom:140px;}
}



div.clear {clear:both; height:10px;  }
.blue {color:#00f;}

.xdebug_hide {display:none; color:#acacac;}


.box95 {width:95%; margin:auto; margin-top:0px;}


/*
h3.panel-title {width:2.5em; height:2.5em; float:left;}
*/


h3.panel-title { float:left; font-weight:bold;}
.panel-heading p { margin-left: 3em;}



.text-in  { text-indent: 1em; }						/* 들여 쓰기 */
.text-out {	text-indent: -1em; margin-left: 1em; }	/* 내어 쓰기 */

.text-in2  { text-indent: 2em; }					/* 들여 쓰기 2 */
.text-out2 { text-indent: -2em; margin-left: 2em; }	/* 내어 쓰기 2 */

.text-in5  { text-indent: 5em; }					/* 들여 쓰기 5 */
.text-out5 { text-indent: -5em; margin-left: 5em; }	/* 내어 쓰기 5 */

/* 대각선 */
.slash {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="100%" x2="100%" y2="0" stroke="gray" /></svg>');
}
.backslash {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><line x1="0" y1="0" x2="100%" y2="100%" stroke="gray" /></svg>');
}

.subtitle { font-size:1.2em; margin:5px 0 15px 0;}


/* 척도형 테이블 범용 버전 */
.table-scale input[type=radio]{
	transform: scale(1.0);
	-webkit-transform: scale(1.0);
	height:15px;
	width:15px;
}

.table-scale .w20			{ width:20%; }
.table-scale .w30			{ width:30%; }
.table-scale .w50			{ width:50%; }

.table-scale .scale-col4	{ width:12.5%; }
.table-scale .scale-col5	{ width:10%; }
.table-scale .scale-col6	{ width:8.3%; }
.table-scale .scale-col7	{ width:7.1%; }

.table-scale label {display: inline-block; text-align:center;
	padding: 5px 10px 5px 10px;
	margin-bottom: 0;
}

/* 5점 척도 테이블 버전 */
.table-tab5 .w10 {width:8%; 	line-height:100%; font-size:13px;}
.table-tab5 .w50 {width:60%;}
.table-tab5 label {display: inline-block; text-align:center;
	padding: 5px 10px 5px 10px;
	margin-bottom: 0;
}
.table-tab5 td {
	padding:0;
	line-height:100%;
}
.table-tab5 input[type=radio]{
	transform: scale(1.0);
	-webkit-transform: scale(1.0);
	height:15px;
	width:15px;
}
.table-tab5 .tbody td {padding:0;}
.table-tab5 .thead td {padding:0;}


/* 자동스케일 척도형 - 한줄 */

div.scale-line {margin-bottom:20px;}
div.scale-line table  {width:100%;}
div.scale-line label {padding:0; margin:0; display:block;}
div.scale-line .scale-text td { font-size: 0.9em; word-break:keep-all; vertical-align:bottom;  padding:5px 0 5px 0; }
div.scale-line .scale-number {  font-size: 1.0em;}

table.scale-line-4 input[type=radio] { width:30px; height:30px; border:solid 1px #000;}
table.scale-line-5 input[type=radio] { width:30px; height:30px; border:solid 1px #000;}
table.scale-line-6 input[type=radio] { width:28px; height:28px; border:solid 1px #000;}
table.scale-line-7 input[type=radio] { width:22px; height:22px; border:solid 1px #000;}
table.scale-line-8 input[type=radio] { width:22px; height:22px; border:solid 1px #000;}
table.scale-line-9 input[type=radio] { width:22px; height:22px; border:solid 1px #000;}
table.scale-line-10 input[type=radio] { width:22px; height:22px; border:solid 1px #000;}
table.scale-line-11 input[type=radio] { width:22px; height:22px; border:solid 1px #000;}



/* placeholder 스타일 적용*/
input::-webkit-input-placeholder { font-size: 90%; font-style: italic; }
input::-moz-placeholder { font-size: 90%;  font-style: italic;}
input:-ms-input-placeholder { font-size: 90%;  font-style: italic;}
input:-moz-placeholder { font-size: 90%;  font-style: italic;}
input::placeholder { font-size: 90%;  font-style: italic;}

textarea::-webkit-input-placeholder { font-size: 90%; font-style: italic; }
textarea::-moz-placeholder { font-size: 90%;  font-style: italic;}
textarea:-ms-input-placeholder { font-size: 90%;  font-style: italic;}
textarea:-moz-placeholder { font-size: 90%;  font-style: italic;}
textarea::placeholder { font-size: 90%;  font-style: italic;}

/* 백만원, 천원 */
span.hanWon { font-size:11px; color:#00f;}

.pl-10 {padding-left:10px;}
.pl-20 {padding-left:20px;}

/* 서브 (자식) 문항 숨김*/

.subs {display:none;}