/*フォント設定*/
body {
 font-family: 'Raleway', sans-serif;
font-size:1.70em; 
}
h1, h2, h3 {
 font-family: 'Merriweather', serif;
}

/*h1タグの設定*/
h1 {
  font-size:1em; 
	color: #696969;/*文字色*/
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 2px #696969;
}

/*h2タグの設定*/
h2 {
  padding: .25em 0 .25em .75em;
  border-left: 6px solid #ccc;
}

/*h3タグの設定*/
h3 {
	border-bottom:dotted;/*下線を点線*/
	border-color:#000000;
	border-width:1px;
	font-size: 21px;
}
/*h4タグの設定*/
h4 { 
border-bottom: solid 2px darkgray; 
border-left: solid 28px darkgray; 
font-size:1.9em; 
text-indent: 0.8em; 
font-weight: bold; 
margin-top:14px;
margin-bottom:14px;
}
/*h5タグの設定*/
h5 { 
border-left: solid 9px #DCDCDC; 
background-color: snow;
font-size:1.1em; 
text-indent: 0.4em; 
margin-top:14px;
margin-bottom:14px;
}



/*箇条書きの設定 sample1*/
ul.sample1{
  position: relative;
  padding: 0.8em;
  font: 16px/1.6 'arial narrow', sans-serif;
  width:100%;
  background:#F2EFE7;
  list-style: none;
  -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.2) inset,0 0 4px rgba(0, 0, 0, 0.2) ;
  -moz-box-shadow: 0 0 40px rgba(0, 0, 0, 0.2) inset,0 0 4px rgba(0, 0, 0, 0.2) ;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.2) inset,0 0 4px rgba(0, 0, 0, 0.2) ;
}
 
ul.sample1 li{
  position:relative;
  font-weight: bold;
  color: #333;
  border-bottom:dashed 1px #ccc;
  padding:4px 0 4px 2em;
}
ul.sample1 li:last-child{
  margin-bottom:15px;
}
ul.sample1 li:before{
  content: "・";
  position: absolute;
  left: 10px;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*箇条書きの設定 sample2*/
ul.sample2{
  counter-reset:list;
  list-style-type:none;
  font: 16px/1.6 'arial narrow', sans-serif;
  padding:0;
	margin-left:15px;
}
ul.sample2 li{
  position:relative;
  color: #333;
  padding: 0 0 0 20px;
  margin: 7px 0px;
  line-height: 30px;
  border-bottom: dashed 1px #ccc;
}
ul.sample2 li:before{
  counter-increment: list;
  content: counter(list) ".";
  display: block;
  position: absolute;
  left: -10px;
  font-weight: bold;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}




/*番号付き箇条書きの設定*/
ol {
  counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/
  padding:0.5em;
  border: dashed 1px gray;
}

ol li {
  position: relative;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 30px;
}

ol li:before{
  /* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*数字のデザイン変える*/
  display:inline-block;
  background: #a9a9a9;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  /*以下上下中央寄せのため*/
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

/*文中の文字を囲む*/
.kakomu{
	padding:2px 8px; /* 枠と文字の空間 */
	margin:0 5px; /* 枠の外の空間 */
	background-color:#f9f9f9; /* 枠の背景色 */
	border:1px solid #777; /* 枠の線の太さ・種類・色 */
	 /*border-radius:2px; 枠の角を丸くする */
	box-shadow: 1px 2px 2px #ddd; /*影をいれる*/
	font-family:inherit; /* フォントの種類を継承する */
	font-size:0.85em;	/* フォントの大きさ */
}


/*アンダーラインマーカー*/
.marker-orange {
background: linear-gradient(transparent 60%, #ffa500 0%);
/*background-color: #ffa500;*/
}
.marker-blue {
background: linear-gradient(transparent 60%, #99ccff 0%);
/*background-color: #99ccff;*/
}

/*文字協調*/
.str {
  display       : inline-block;        /* ブロック化              */
  font-weight   : bold;                /* 太字                    */
  font-size     : 150%;                /* 文字を大きくする        */
  border-bottom : 2px solid #0059b3;   /* 下線                    */
  color         : #ff0000;             /* 文字色                  */
}

/*文書を枠で囲む*/
.box1 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 2px #b0c4de;
    border-radius: 8px;
}
.box1 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #696969;
    font-weight: bold;
}
.box1 p {
    margin: 0; 
    padding: 0;
}