/*주석은 이렇게 달아요*/

/*
태그이름#아이디 { 속성1:속성값; 속성2:속성값; } 
태그이름.클래스명1, .클래스명2 { 속성1:속성값; 속성2:속성값; }
.클래스명#아이디 { 속성1:속성값; 속성2:속성값; }


공백삽입:  
*/




/* ===== 1. 루트 기준 설정 ===== */
html {
  font-size: 16px; /* 1rem = 16px */
}

/*
@supports (-webkit-touch-callout: none) {
  html, body {
    font-size: 16px !important;
  }
}*/

/* ===== 2. 글자 크기 계층 ===== */
:root {
  --font-title: 1.5rem;   /* 24px */
  --font-subtitle: 1.25rem; /* 20px */
  --font-body: 1rem;      /* 16px */
  --font-small: 0.875rem; /* 14px */
  --font-caption: 0.75rem; /* 12px */
}

/* ===== 3. 기본 텍스트 스타일 ===== */
h1 { font-size: var(--font-title); margin-bottom: 0.5em; }
h2 { font-size: var(--font-subtitle); margin-bottom: 0.5em; }
p  { font-size: var(--font-body); line-height: 1.5; margin-bottom: 1em; }
small { font-size: var(--font-small); }
.caption { font-size: var(--font-caption); color: #666; }

/* ===== 4. 버튼/링크 등 컴포넌트 ===== */
.button {
  font-size: var(--font-body); /* 본문 기준 */
  padding: 0.5em 1em; /* 글자 크기에 비례 */
  border-radius: 0.25em;
  background-color: #007bff;
  color: white;
  text-align: center;
  display: inline-block;
  cursor: pointer;
}

.button.small {
  font-size: var(--font-small);
  padding: 0.25em 0.5em;
}

/* ===== 5. 입력 필드 ===== */
input, textarea {
  font-size: var(--font-body);
  padding: 0.5em;
  border: 1px solid #ccc;
  border-radius: 0.25em;
}

/* ===== 6. 유틸리티 클래스 ===== */
.text-title { font-size: var(--font-title); }
.text-subtitle { font-size: var(--font-subtitle); }
.text-body { font-size: var(--font-body); }
.text-small { font-size: var(--font-small); }
.text-caption { font-size: var(--font-caption); }


.title{
  font-size: 1.5rem;
  font-weight: 700;

}

.subtitle , .subheading{
  font-size: 1.25rem;
  font-weight: 700;

}

.bodytitle{
  font-size: 1.2rem;
  font-weight: 700;
}


/*default: border*/
.ibox {
    background-color: white;
    padding: 5px;
    font-size: 0.98em;
    margin-left: 5px;
    line-height: 1.5;
    border: 1px dotted gray;
    margin-bottom: 0.5rem;
}

.ibox-inline {
  background-color: white;
  white-space: normal;
  font-size: 0.98em;
}


div.line {
display: flex;
}

.sign {
  width: 2.5em;
  text-align: right;
  margin-right: 6px;
}


div.border{
  border: 1px dotted black;
  padding: 5px;

}

div.subbox{

  background: #f7f9fc;
  padding: 5px 5px;
  border: 1px dotted black;
}

div.indent{
  margin-left: 8px;
  padding: 5px;
  /*border: 1px dotted black;*/
}


div.paper {
  background: #fff;
  border-radius: 6px;
  padding: 8px;

  box-sizing: border-box;
}

div.box {

  background: #F5F2F0;
  font-size: 0.98em;

}


div.pre-wrap{
white-space: pre-wrap;
}

div.pre{
white-space: pre;
}


.acnt-box {
  background: #FFF3A0;
  border-left: 5px solid #E6D65C;
  padding: 10px;
  font-weight: 600;
}

.acnt-inline { /* span */
  background: #FFF3A0;
  padding: 0 4px;
  font-weight: 600;
}

.line {
  white-space: normal;
}

.center {
 text-align : center;
}

.border {
  border: 1px solid darkgray;
}

.noBorder {
  border: none !important;
}

/* -----------------------------*/
.iList {
    padding-left: 1.0rem;
}

/* (,)가 없으므로 .korean-list의 자식인 li를 선택*/
.iList li {
  position: relative;
  padding-left: 1.5em; /* label 자리 확보 */
  line-height: 1.5;
}

/* (,)가 없으므로 .korean-list의 자식 중 label class를 말함*/
.iList .label {
  position: absolute;
  left: 0;
  top: 0;
  width: 3em;
  text-align: left;
  font-weight: bold;
}

ol, ul{
 white-space: normal;
 line-height: 130%;
 font-size: 0.96em;
/* background: #f4f4f4;*/
 background: #f7f9fc;
 border: 1px dotted black;
 margin-bottom: 0.5em;
}

ol {
 padding-left: 32px;   /* 기본은 보통 40px 정도 */
 margin-left: 0;
}

ul {
 padding-left: 16px;   /* 기본은 보통 40px 정도 */
 margin-left: 0;
 margin-bottom: 0px;
}

ul li {
 margin-bottom: 10px;
 padding-left: 0.2rem;
}



ol li {
 margin-bottom: 10px;
 padding-left: 0.2rem;
}


li::marker {
  color: black;
  font-size: 1.0em;
  font-weight: bold;
}

span.mark {
  font-size: 1.1em;
  font-weight: bold;
}

ul.hangul{

list-style-type: hangul;
list-style-position: outside; /* 기본값으로 복구 */
padding-left: 1.5rem;         /* 전체 항목을 오른쪽으로 밈 */
margin-left: 0;

}



/* custom의 자식 */
ol.custom {
 list-style-type: none;
 list-style-position: outside; /* 기본값으로 복구 */

 padding-left: 6px;
 margin-left: 0;
}

ol.custom li {
 display: flex;
 align-items: flex-start;   /* ← 핵심 */
 gap: 6px;
}

ol.custom .content {
  flex: 1;          /* 나머지 영역 */
}


ol.hangul {
  list-style: none;
  counter-reset: hangul;
  margin-left: 0;
}

ol.hangul > li {
  counter-increment: hangul;
  padding-left: 1.0em;
  position: relative;
}

ol.hangul > li::before {
  content: counter(hangul, hangul) ".";
  position: absolute;
  left: -0.5rem;
}
/* */


/*-- table ---*/
.itable {
    width: 100%;
    background: white;
    table-layout: auto; /* 기본값이며, 콘텐츠에 맞춰 너비를 조절합니다 */
    border-collapse: collapse;
    border: 1px solid #333;
    font-size: 0.96rem;
}

table.border {
    border: 1px solid #999;
    border-collapse: collapse; /* ★ 이게 핵심 */
    background: #f4f4f4;
    font-size: 0.96em;
}

table.border td {
    border: 1px solid #999;
    padding: 5px;
}

table.border th {
    border: 1px solid #333;
    padding: 5px;

}


.itable td {
   /* border: 1px solid #333;*/
    padding: 2px;
    vertical-align: top;
}

.td-min {
    white-space: nowrap; /* Prevents text from wrapping */
    width: 1%; /* This is the trick: a small, fixed width */
    padding: 0 3px;
}

.td-w4 {
  white-space: nowrap;
  width: 4rem; /* 4글자 기준 폭 */
  padding: 0 2px;
  overflow: hidden;
  text-overflow: ellipsis;
}


.td-number{
  text-align: right;
}

.td-auto {
    width: 99%; /* The remaining space */
    text-align: left;
    padding: 3px;
}
/*
|bl → border-left

|br → border-right

|bt → border-top

|bb → border-bottom*/

td.min, td.fixed {
    white-space: nowrap; /* Prevents text from wrapping */
    width: 1%; /* This is the trick: a small, fixed width */
    padding: 0 3px;
}

td.auto {
    width: auto;
    max-width: 60%;
    font-size: 0.95rem;
}

td.c , td.center{
text-align: center;
}

td.num {
 text-align: right;
}


td.bl {
  border-left: 1px solid black;
}

td.br {
  border-right: 1px solid black;
}

td.bt {
  border-top: 1px solid black;
}

td.result {
 border-top: 1px solid black;
 text-align: right;
}

td.bb {
  border-bottom: 1px solid black;
}

/* -------  */
div.tContainer{
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  /* Flexbox 설정 추가 */
  display: flex;
  flex-direction: column;
}

.tContainer::before {
  content: "← 좌우로 스크롤 →";
  display: block; /* Flex 아이템으로 동작 */
  width: 100%;   /* 전체 너비 확보 */
  font-size: 12px;
  color: #999;
  text-align: right;
  margin-bottom: 8px; /* 표와의 간격을 아래쪽 마진으로 조절 */

  /* iOS에서 텍스트가 잘리거나 위치가 튀는 것 방지 */
  line-height: 1.2;
  flex-shrink: 0;    /* 스크롤 시 크기가 변하지 않게 고정 */
}


table.full {
  width: max-content;
  min-width: 100%;
  font-size: 0.92rem;
  background-color: white;
  border-collapse: collapse;
  flex-shrink: 0;    /* 테이블 형태 유지 */
}

table.full td {
  padding: 5px;
  border: 1px dotted black;
  max-width: 50%;
}


/*-- table 끝 ---*/

.acnt1 {
 background: #FFD54A;
 color: #222222;
}

.acnt2 {
  background: #c0c0c0;
  color: #000000;
  font-weight: 600;
}

div.equation {
display: inline-flex;
align-items: center;   /* 핵심 */

}


.fraction {
  display: inline-flex;
  flex-direction: column;
  vertical-align: middle; /* 기본 정렬 */
  align-items: center;
  line-height: 1;
  font-size: 0.9em; /* 분수는 보통 주변 글자보다 약간 작아야 자연스럽습니다 */
  margin: 0 2px;
  /* 아래 코드는 텍스트 줄바꿈 시 분수가 겹치지 않게 위치를 미세 조정합니다 */
  position: relative;
  top: -0.1em;
}

.fraction .top {
  padding: 0 3px;
   border-bottom: 1px solid #000;
  display: block;
}

.fraction .bottom {
  padding: 0 3px;
  border-top: 1px solid #000;
  display: block;
}

div.journal {
 display: flex;
 border: 1px dotted black;

}

.journal .left {
flex: 1;
text-align: right;
padding-left: 5px;
padding-right: 5px;

}

.journal .right {
flex: 1;
padding-left: 5px;
padding-right: 5px;
border-left: 1px solid black;
text-align: right;

}


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


      div.a {
	   color:#686868;
        font-size: medium;
        text-align: left;
      }

      div.b {

        color:#787878;
        font-size: medium;
		line-height: 1.2;
		text-align: left;
		margin-left: 10;
      }


      @font-face {

        font-family:'IropkeBatang';
        src:url('./IropkeBatangM.woff');

      }


      body {

           background-color: #E1E1E1;
           font-size: clamp(16px, 1vw+1vh , 18px);
      }



       div.answer , .keywordnote, .keyword-note, .question {

              color:#686868;
              font-size: 0.95rem;
              text-align: left;

              font-family: 'IropkeBatang';
              white-space: pre-wrap; /* pre tag내에 word wrap */


            }



#question-div{

   white-space: pre-wrap; /* pre tag내에 word wrap */
   padding: 5px;

   font-family: 'IropkeBatang';
   font-size: 1.0rem;
   line-height: 140%;

   position: relative;
   top:5px;

}

#omr-div{
  position: relative;
  top: 5px;

  padding-bottom: 10px;
  max-width: 400px;

}


#answer-div{

   white-space: pre-wrap; /* pre tag내에 word wrap */
   padding: 5px;

   font-family: 'IropkeBatang';
   font-size: 1.05rem;
   line-height: 140%;

   position: relative;
   top:5px;

}

.answer-mark {
  position: absolute;
  width:25%;
}

#result-div{

  text-align: center;
}


      div.notice {

         background-color: #E1E1E1;

          margin-top: 10px;
          font-size: 1.0rem;
          font-family: 'IropkeBatang';
          padding: 5px;
          white-space: pre-wrap; /* pre tag내에 word wrap */
       }





      div.book{
       display:table;
       background-color:#D9D9D9;
       width: 100%;
	   font-size: 0.95rem;

/*
	   font-weight:bold;
       font-family: Courier;*/

        color:black;
      }

      div.book_L {

      display: table-cell;
      padding:2px;



      border-right : 1px solid black;
      width: 46%;

      }

     div.book_R {

      display: table-cell;
      padding:2px;

      color:black;

      border-left : 1px solid black;


     }

     div.t_book , .t_book_LR, .Tbook{
       display:table;

       font-size: 0.90rem;
       color:black;
       background-color:#C9C9C9;
       width: 90%;
       vertical-align:top;

    }

      div.t_book_L, .Tbook_L {

      display: table-cell;
      padding:5px;
      border-top   : 5px solid black;
      border-right : 3px solid black;
      width: 40%;

      }

     div.t_book_R, .Tbook_R {

      display: table-cell;
      padding:5px;

      border-top : 5px solid black;
      border-left : 3px solid black;

      width: 40%;

     }

     /* ---------------------- */
     h3 {
       font-size: 20px;
       font-weight: bold;
       margin-bottom: 0.5em;
     }

     h4 {
       font-size: 16px;
       font-weight: bold;
       margin-bottom: 0.5em;
     }

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

      pre {

          font-size: 0.95rem;
          font-family: 'IropkeBatang';
		  padding:5px;

		  line-height:1.4rem;

		  overflow: auto;
          white-space: pre-wrap; /* pre tag내에 word wrap */
		  		  
      }

      pre.normal {

          font-size: 0.95rem;
          font-family: 'IropkeBatang';
		  padding:5px;

		  line-height:1.4rem;


		  overflow: auto;
          white-space: normal; /*  \n가 있어도 무시 , 자동줄바꿈만 적용하기 */
		  		  
      }

      .normal {

       white-space: normal; /*  \n가 있어도 무시 , 자동줄바꿈만 적용하기 */

      }


.law-li {

 text-indent: -1.0em;
 padding-left: 1.0em;

}


    /*
	 pre-wrap(자동 줄바꿈, 공백을 그대로 표시)
  	 
	*/



    span.accent {
     
     padding:5px;
     background-color:yellow;
     font-weight:bold;
    }


 .heading {
         font-size: 1.3rem;
         margin:2px;
         padding:0px;
    	 line-height:1.4rem;
         color: black;
         font-weight: bold;
    }

    .accent0, .a0 {
         font-size: 1.1rem;
         margin:2px;
         padding:0px;
    	 line-height:1.4;
         color: black;
         font-weight: bold;
    }


    .accent1,.a1 {
         font-size: 1.1rem;
          font-weight: bold;
         margin:2px;
         padding:0px;
    	 line-height:1.4;
         color: #A50E53;
         background-color: #FCE8E6;
    }

   /* 옅은 파란색 배경  */
    .accent2,.a2 {
         font-size: 1.1rem;
          font-weight: bold;
         margin:2px;
         padding:0px;
    	 line-height:1.4;
    	 color: black;
         /*color:#185ABE;*/
         background-color: #E8F0FE;
    }

    .accent3,.a3 {
         font-size: 1.1rem;
          font-weight: bold;
         margin:2px;
         padding:0px;
    	 line-height:1.4;
         color: #000;
        background-color: #fdf5d4;
    }

    .box-note {
      background-color: #eee;
      box-sizing: border-box;
      padding: 5px;
      width: 95%;
      margin: 0px;
      font-size: 1.0rem;
      line-height: 120%;
      border-style: dotted dotted dotted solid;
      border-color: black;
      /*border-width: 1px 1px 1px 2px*/
     /*위, 오른쪽, 아래, 왼쪽 */
    }

   .box-note1, .box-note0 {
      box-sizing: border-box;
      background-color: #eee;
      padding: 5px;
      font-size: 1.0rem;
      line-height: 150%;
      white-space: pre-wrap;
      border: 2px dotted black;
    }

   .box-note2 {
      background-color: #E8F0FE;
      padding: 5px;
      font-size: 1.0rem;
      line-height: 150%;
      border: 1px dotted black;
    }

   .box-note3 {
      background-color: #fdf5d4;
      padding: 5px;
      font-size: 1.0rem;
      line-height: 150%;
      border: 1px dotted black;
    }
/*
   .details {
    margin: 0px;
    padding:0px;
    white-space: normal;
   }

  .summary{
    margin: 0px;
    border-radius: 5px;
    width: 50%;
    background: white; border: 1px solid black;
  }
  */
  details {
    margin: 0.2em 0;
    padding: 0.5em;
    border: 1px solid #ccc;
    border-radius: 6px;
    white-space: normal;
  }
  details summary {
    font-weight: bold;
    background: #FAF7AE;
    font-size: 1.1rem;
    cursor: pointer;
  }


   div .box-line {
   font-size: 1.0rem;
   background: white;
   border: 1px dotted black;
   white-space: normal;
   }


   div.tb {
   display: table;
   width: 98%;
   font-size: 1.0rem;
   border: 1px dotted black;

   }

   div.tr {
   display: table-row;

   }

   div.tc_0 {
      display: table-cell;
      text-align: left;
      background: #fdf5d4;
   }

   div.tc {
      display: table-cell;
      text-align: left;
   }

   div.tc_num {

    display: table-cell;
    font-weight: bold;
    font-family: Courier;

   }

   table.custom{
     border-collapse: collapse;
   }

   table.custom td {

       border: 1px solid #999;
       padding: 8px 12px;
       vertical-align: top;
   }


   .td-min {
    white-space: nowrap;
    width: 1%;
   }

   .td-auto{
    text-align: center;
    width: auto;
    padding: 3px;
   }



    p.indent {
     /* text-indent : -15px;*/
      /* text-indent : -50%; */
      margin: 0px;
      padding-left: 0.5rem;
      padding-bottom: 0px;
    }



    span.green {
     
     margin:2px;
     padding:0px;
     color:black;
	 line-height:1.5rem;
     background-color:#D3FAD2
    }

 span.white {
     
	 font-size: 1.2rem;
     margin:2px;
     padding:0px;
     color:white;
	 line-height:1.4rem;
     background-color:black
    }

/*em : 상위 요소기준 */
/*rem : 최상위 요소기준 */


 b {
     
     font-family: -apple-system, BlinkMacSystemFont, "Noto Sans KR", "Malgun Gothic",
             sans-serif;
     font-size: 1.05rem;
	 line-height: 1.3rem;
     color: black;
	 font-weight: 600;
  }




 span.label_s , .label_1, .label-1{

     margin:1px;
     padding: 0;
     font-size: 1.2rem;
	 line-height: 1.5rem;
     color: black;
	 font-weight: bold;
  }
  
  span.label_m , .label_2, .label-2 {

   padding: 0;
    font-size: 1.5rem;
	line-height: 1.8rem;
    color: black;
	 font-weight: bold;
  }

  span.label_big , .label_3, .big{

    font-size: 2.2rem;
    color: black;
	line-height: 1.5rem;
	 font-weight: bold;
  }

  span.hanja , .hj{

    font-size: 2.2rem;
    color: black;
	line-height: 1.5rem;
  }


  span.h3 {

    font-size: 1.2rem;
    font-weight: bold;
  }

  span.h4 {

      font-size: 1.1rem;
      font-weight: bold;
    }


 span.e {

         margin:2px;
         padding:2px;

         background-color:#FCF7EF;

      }


  span.bold {

     margin:2px;
     padding:0px;
     color:black;
	 line-height:1.5rem;
     font-weight: bold;

    }

  span.b1 {

    margin:2px;
    padding:0px;
    font-size: 1.2rem;
    color:black;
    line-height:1.5rem;
    font-weight: bold;

   }


    span.b2 {
        margin:2px;
        padding:0px;
        font-size: 1.4rem;
        color:black;
        line-height:1.5rem;
        font-weight: bold;

      }

   span.b3 {
        margin:2px;
        padding:0px;
        font-size: 1.8rem;
        color:black;
        line-height:2.0rem;
        font-weight: bold;

      }


  span.size0 {

     font-size: 0.92em;

    }


    span.size1 {

     font-size: 1.2rem;
	 line-height: 1.2rem;

    }


    span.size2 {

     font-size: 1.4rem;
	 line-height: 2.0;

    }

    span.size3, .size4 {

     font-size: 1.8rem;
	 line-height: 3.0rem;

    }


 span.small {

  line-height:1.2rem;
      padding:1px;
      color:black;
  	 font-size:0.9em;

 }


  span.blue {
 
     font-size:1.2rem;
	 line-height:1.2rem;
     margin:2px;
     padding:2px;
     color:white;
     background-color:#3390FF;
    }
 


   span.yellow , .y{

     font-size:1.1rem;
     margin:0px;
     padding:0px;
     color:black;
	 line-height:1.4rem;
     background-color:#FED651;
    }

   
    span.gray {
     
     margin:2px;
     padding:2px;
     color:white;
     background-color:gray;

 
    }


 span.number {
     
	 font-size:1.2rem;
     margin:1px;
     padding:0px;
     color:blue;
 
    }
	
    span.red, .r{

     margin:1px;
     padding:0px;
     font-size: 1.05rem;
	 line-height:1.5rem;
     color:red;
     background-color:#FFEBEB;
 
    }


 span.mid {

     font-size: 1.5rem;
     margin:0px;
     padding:0px;
	 line-height:2.0;
     color:black;
     background-color:white;
     font-weight: bold;


    }



    span.b, .black{

      margin:0px;
     padding:0px;
     font-size: 1.1rem;
	 line-height:1.5rem;
     color:black;
     background-color:white;
     font-weight: bold;


    }




  span.q, .book{

     font-size: 1.2rem;
     color:black;
     line-height:2.0rem;
     background-color:#D1D1D1;
 
    }

  span.g{

     font-size: 1.1rem;
     color:black;
     line-height:1.5rem;
     background-color:#D1D1D1;

    }



    U {


     margin:0px;
     padding:2px;

     color:black;
     text-decoration : none;
     border-bottom : 2px solid #FF0000;
     padding-bottom : 0px;
	 line-height: 1.5rem;
   
    }
     

    U.r {

     text-decoration : none;
     border-bottom : 2px solid #FF0000;

     margin-top: 5px; 
     padding-bottom : 0px; 
   
    }

   U.cancel {

      text-decoration: line-through;
	  border-bottom : 2px solid #FFFFFF;
      padding-bottom : 3px;
   }

    ul.no_dot {
   
    list-style:none;

   }
   
   ul.type1 {
	      margin:0;
   }

   li.type1 {
	   
	   margin: 0;
	   padding:0;
   }
   
  /*   font-family: 'Nanum Gothic';	*/

    P.p1 {
		  	
    margin-top:2px;
    padding-top:0px;
    padding-left:10px;
    font-size:0.96em;
	line-height:1.3rem;
   }
   


     p.law {

          margin-top:2px;
          padding-top:0px;
          padding-left:5px;
          font-size:0.95em;
          line-height:1.3rem;

          white-space: normal; /* pre tag내에 word wrap */
          color:black;
          background-color:#FBEBEB;

         }


 p.law-line {

          margin-top:2px;
          padding-top:0px;
          padding-left:5px;
          font-size:0.95em;
          line-height:1.2rem;

          overflow:auto;
          white-space: normal; /* pre tag내에 word wrap */
          color:black;
          background-color:#FBEBEB;

         }

p.keyword {

          margin-top:2px;
          padding-top:0px;
          padding-left:5px;
          font-size:0.95em;
          line-height:1.2rem;

          overflow:auto;
          white-space: pre-wrap; /* pre tag내에 word wrap */
          color:black;
          background-color:#EBFBEB;

         }


 p.keyword-line {

           margin-top:2px;
           padding-top:0px;
           padding-left:5px;
           font-size:1.1rem;
           line-height:1.3rem;

           overflow:auto;
           white-space: normal; /* pre tag내에 word wrap */
           color:black;
           background-color:#EBFBEB;

          }

p.answer-line {

          margin-top:0px;
          padding-top:0px;
          padding-left:5px;
          font-size:0.95rem;
          line-height:1.0rem;

          overflow:auto;
          white-space: normal; /* pre tag내에 word wrap */
          color:black;
          background-color:#FBFBFB;

         }



p.question {

          margin-top:2px;
          padding-top:0px;
          padding-left:5px;
          font-size:1.1rem;
          line-height:1.3rem;

          overflow:auto;
          white-space: pre-wrap;
          color:black;
          background-color:#DBDBDB;

         }


p.question-line , .q-line{

          margin-top:2px;
          padding:5px;
          font-size:1.1rem;
          line-height:1.3rem;

          overflow:auto;
          white-space: normal; /* pre tag내에 word wrap */
          color:black;
          background-color:#EBEBEB;

         }






   span.bold {
     margin:2px;
     padding:0px;
     color:black;
	 line-height:1.5rem;
     font-weight: bold;

    }

   .normal, .line {
   white-space: normal;
   }

   .prewrap {
    white-space: pre-wrap;
   }

   span.line{

     white-space: normal;

    }

  span.size0 {

     font-size: 0.92em;

    }


    span.size1 {

     font-size: 1.1em;

    }


    span.size2 {

     font-size: 1.3em;

    }

  
 

    span.e {

      line-height:1.5rem;
	  color: black;
      margin:2px;
      padding:2px;
      background-color:#fef4bd;
   }


   .kwdlink {

    color:black;
    font-size: 1.5rem;
    background-color:yellow;

   }


div.keyword-dot, .keyword {

           border: 2px dotted black;

		   background-color:#EcEcEc;

		   color: #606060;
           margin-top:5px;
           padding: 2px;
           font-size:0.98em;

           overflow:auto;
           white-space: pre-wrap;

          }


  .bg-green {

      background-color:#EBFBEB;

  }

  .bg-pink {

      background-color:#FBEBEB;
  }


  .word-table {

     padding: 5px;

     border-top   : 2px solid black;
     border-left : 2px solid black;

  }