@charset "utf-8";
	@import url('https://fonts.googleapis.com/css?family=Noto+Serif+KR');
	@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR');
	@import url(http://fonts.googleapis.com/earlyaccess/kopubbatang.css);   /* font-family:‘KoPub Batang’ */
	@import url(http://fonts.googleapis.com/earlyaccess/jejugothic.css);  /*  font?family:‘Jeju Gothic’  */
	@import url(http://fonts.googleapis.com/earlyaccess/jejuhallasan.css);   /* font-family:‘Jeju Hallasan’  */ 
	@import url(http://fonts.googleapis.com/earlyaccess/jejumyeongjo.css);    /* font?family:‘Jeju Myeongjo’ */
	@import url('https://fonts.googleapis.com/css?family=Roboto');
	@import url('https://fonts.googleapis.com/css?family=Hahmlet');
	@import url('https://fonts.googleapis.com/css?family=Gowun+Dodum');

	:root {
		--bkColor: white;
		--qfColor: white;
		--errColor: red; 
		--headColor: #ddd; 
		--btnbkColor: #ECE5B6; 
		--baseFontFamily: "Noto Serif KR",  "Gowun Dodum", Serif;
		--qtextFontFamily: "맑은 고딕",  "Noto Sans KR",  Sans-serif;
		--h1FontFamily:  Hahmlet, "Noto Sans KR", Sans; /* "Jeju Hallasan"; */
		--h3FontFamily:  Hahmlet, "Noto Sans KR", Sans;
		--h4FontFamily:  "Noto Sans KR", Hahmlet, Sans;
		--qfBorderStyle: none; 
		--qfBorderColor: lavender; 
	}

	body {
		background-color: var(--bkColor); 
		max-width: 800px;
		min-width: 320px; 
		width: 100%;
		margin:auto; 
		font-family: var(--baseFontFamily); 
		font-size : 15px; 
	}

	fieldset { 
		border-style:var(--qfBorderStyle); 
		border-color:var(--qfBorderColor); 
		background-color:var(--qfColor);  /*  #e3e4fa; */
	}  

	h1 { font-family:var(--h1FontFamily); }
	h2 { font-family:"Jeju Hallasan"; }
	h3 { 
		font-family: var(--h3FontFamily);
		font-weight: bolder; 
    	font-size:large;
	}
	   	   
	h4 { 
		font-family: var(--h4FontFamily);
		/* font-weight: bolder; */
    	font-size: medium; 
	}
	   
	input [type=checkbox]    {      transform : scale(1.5);    }
	input [type=radio]       {      transform : scale(1.5);    }
	input [type=number]     {  text-align: right; width:5em; padding-right: 0px; border-radius: 7px; }
	input [type=button], button  { text-align: center; border-radius: 7px; }
	input [type= range]   {  width: 250px;   margin: 0;	}	
	input [type= text]     { border-radius: 7px; }
	select                      { border-radius: 7px; }
	   

	ul { list-style-type: square; }
	li { clear:both; margin: 0 0 1px 0; padding: 3px; word-break: keep-all; } 

	label { padding: 2px; word-break:keep-all; }

	em { color: red;
	     font-weight: bold;
	}

	cite { color: blue; }

	table, th, td {
		margin:  auto;  
		border-style: none; 
		border-collapse: collapse;
		border: 2px solid var(--qfColor); 
		/* padding: 3px;  */
	}

	th {  
		background-color: var(--headColor);
		/* font-size:15px; */
		word-break: keep-all;
		padding: 5px; 
		text-align: center; 
		vertical-align: middle; 
	}

	td {  
		/* font-size:14px; */
		padding: 5px;
		word-break: keep-all;
		text-align: center; 
	}
	
	label { padding: 2px; word-break:keep-all; }

	header { 
		text-align:center; 
		background-color:#222B35; color: #FFFFFF; 
		font-family:"맑은 고딕"; 
		font-size: 24px;
	}
	
	em { color: red;
	     font-style: normal;
	}

	progress { max-width :100px;}

	.qtext { 
		font-family:  "Noto Sans KR",  Hahmlet,  Sans;
		/*font-weight:light; */
		text-align:left ;
		font-size:15px;
		word-break: keep-all; 
	}

	.display { 
		font-family:  "Noto Sans KR",  Hahmlet,  Sans;
		/* font-weight:light; */
		text-align:left ;
		font-size:15px;
		word-break: keep-all; 
	}

	.QT2 li, .QT3 li {   
		text-indent: -1.5em; 
		text-align: left;
		list-style-type:none;
	}        

	.QT7  	{   list-style-type:none;  }      /* Rank */
	/* .QT7 li  {   text-indent: -1.4em;      }        */

	.displayfieldset {  
		font-family: "Gowun Dodum",  "Noto Serif KR", Serif;
		background-color:var(--bkColor); 
		border-style:none; 
		word-break: keep-all; 
	}  
	.qfieldset {    
		background-color:var(--qfColor);   /* Lavender Blue #e3e4fa; */
		border-style:var(--qfBorderStyle); 
		border-color:var(--qfBorderColor); 
		word-break: keep-all; 
	}  

	.qtable {    
		background-color:var(--qfColor);   /* Lavender Blue #e3e4fa; */
		border: 1px solid var(--bkColor);
		border-collapse: collapse;
	}  

	.buttonPanel {
		background-color:#ECE5B6;
		text-align:center;
		border-style:none;
	}

	.buttons {
		text-align:center;width:70pt; font-size:12pt;
	}

	.ErrorMessage {
		color:var(--errColor); 
		display:none;
		font-size:10.5pt   
	}

	/*  .QT6  tr:last-child   {  background-color:#F3F3F3;  }          /* constant sum */

	.QT4	{ width: auto; max-width:70%;  }                      /* integer */
	.QT4    td:first-child      { text-align:right;  }                      /* integer */
	.QT5, .QT6       { width: auto; max-width:80%;  }                      /* integer */
	.QT5, .QT6    td:first-child      { text-align:right;  }                      /* integer */

	.QT9        {  width:85%; text-align:center; }     /*  HScale  */
	.QT9  td 	{  width:5%;  /*text-align:center; */}     /*  HScale  */
	.QT9  th    {  vertical-align:bottom;  }    

	.QT15 td, .QT16 td, .QT17 td { border: 2px solid var(--bkColor); }
	.QT15 th, .QT16 th, .QT17 th { border: 2px solid var(--bkColor); }

	.QT15 td:nth-child(2n+2)  {  background-color:#F3F3F3;  } /* EGrid */      
	.QT15 td:nth-child(n+2)   {  width:8%; /*text-align:center; */}       
	.QT15 td:first-child      { text-align:right; }    
	.QT15  th              {  vertical-align:bottom; }    

	.QT17               {  }
	.QT17 td:nth-child(2n+2)  {  background-color:#F3F3F3;  } /* VGrid */      
	.QT17 td:nth-child(n+2)   {  width:8%; /*text-align:center; */}       
	.QT17 td:first-child      { text-align:right; }    
	.QT17  th              	  {	vertical-align:bottom; }    

	.QT16               {  }
	.QT16 tr:nth-child(2n+1)  {  background-color:#F3F3F3;  }  /* HGrid */
	.QT16 td:nth-child(n+2)   { width:8%;  /*text-align:center; */}    
	.QT16 td:first-child      { text-align:right; }    
	.QT16  th              {  vertical-align:bottom; }    


	.qfieldset>tbody, .qfieldset>tbody>tr>th, .qfieldset>tbody>tr>td, 
	.qfieldset>table>tbody, .qfieldset>table>tbody>tr>th, .qfieldset>table>tbody>tr>td {    /* within PageStart  */
		background-color: var(--qfColor); 
		border: 2px solid lightgray; 
		border-collapse: collapse; 
	}

	.QT26>tbody, .QT26>tbody>tr>th, .QT26>tbody>tr>td, 
	.QT26>table>tbody, .QT26>table>tbody>tr>th, .QT26>table>tbody>tr>td {    /* within PageStart  */
		background-color: var(--qfColor); 
		border: 2px solid lightgray; 
		border-collapse: collapse; 
	}

/*
	.QT26, .QT26>tr>td, .QT26>tbody>tr>td {
		background-color: var(--qfColor);
		border: 2px solid var(--bkColor); 
	}
	
	.QT26>tr>th, .QT26>tbody>tr>th {
		border: 2px solid var(--bkColor); 
	}
*/

	.tblleft, .tblleft>tbody>tr>td {
		text-align:left; 
		background-color: var(--bkColor);
		border: 2px solid var(--bkColor); 
		font-weight:bold;
	}

	.tblleft>tbody>tr>th {
		text-align:left; 
		border: 2px solid var(--bkColor); 
	}

	.tblcenter, .tblcenter>tbody>tr>td {
		text-align:center; 
		background-color: var(--bkColor);
		border: 2px solid var(--qfColor); 
	}

	.tblcenter>tbody>tr>th {
		background-color: var(--headColor);
		text-align:center; 
		border: 2px solid var(--bkColor); 
	}

	
	/* .QT5 table, td, .QT6 td { background-color: blue;  }                      /* string, integer */

	/*
	.QT7  input[type="number"]::-webkit-outer-spin-button, 
	input[type="number"]::-webkit-inner-spin-button { 
	-webkit-appearance: none; 
	-moz-appearance: none; 
	appearance: none; }
	.QT7 input[type="number"] { -moz-appearance: textfield;  }  /* fire fox */

	input[type="number"]::-moz-outer-spin-button,    -moz-inner-spin-button {  -moz-appearance: textfield;  }  /* fire fox */
	input[type="number"]::-webkit-outer-spin-button,    -webkit-inner-spin-button {  -webkit-appearance: none; }