/* ************************************************
*  jorunal
* ************************************************ */
.journal-container {
	display: block;
	max-width: 950px;
	width: 90%;
	background-color: #ffffff;
	padding: 50px;
	margin: 50px auto;
}
.journal-title {
	font-size: 28px;
	margin:0 0 20px 0;
	font-weight: bold;
	font-family: 'Noto Serif JP', serif;
}
.journal-eyecatch {	text-align: center;}
.content div, .content p {margin-top: 1rem;}
.journal-container ul {display: block;}
.content ol li, .content ul li {
	margin-top: 1rem;
	padding-left: 1.7rem;
}
.memo-title,
.sanko-title,
.yougo-title,
.listtitle {margin-top: 0 !important;}
.pic-box {margin: 40px auto !important;}


/* ************************************************
*  table
* ************************************************ */
.content table {
	width: 100%;
	color: #42210b;
	font-size: 16px;
	border-collapse:collapse;
    border-spacing:0;
}
.content table th {
	background-color: rgba(66,33,11,.8);
	color: #ffffff;
	border: 1px solid #ffffff;
	font-weight: 500;
	padding: 10px;
	text-align: left;
}
.content table td {
	border: 1px solid rgba(66,33,11,.5);
	padding: 10px;
}
.content table tr:nth-child(odd) td {
	background-color: rgba(66,33,11,.08);
}



/* ************************************************
*  style-user
* ************************************************ */
.content h2 {
    color: #ffffff;
    background-color: #42210b;
	font-family: 'Noto Serif JP', serif;
    padding: 20px;
    font-size: 1.2rem;
    line-height: 1.5;
    margin-top: 4rem;
}
.content h3{
    color: #42210b;
	font-family: 'Noto Serif JP', serif;
	padding: 10px 0 10px 20px;
    font-size: 1.2rem;
    line-height: 1.5;
    margin-top: 2rem;
    border-left: solid 4px #0096b0;
    border-bottom: solid 1px #d8d8d8;
}
.content h4{
    color: #42210b;
	font-family: 'Noto Serif JP', serif;
    padding-bottom: 10px;
    font-size: 18px;
    line-height: 1.5;
    margin-top: 2rem;
    border-bottom: dotted 2px #0096b0;
}
.content a {
    color: #0096b0;
}
.content .qtext {
    margin: 30px 0px;
    font-size: 17px;
}
.qtext .midpush {
    border-bottom: thin solid;
}
.content .list-text li:before {
    content: none;
}
.content .hitlist {
    border: #0096b0 2px solid;
    padding: 30px;
    border-radius: 15px;
    margin: 40px 0px;
}
.yougo-text {
    font-size: 14px;
    color: #3f3f3f;
}
.yougo-box {
    width: 90%;
    border-radius: 15px;
    background: rgba(66, 33, 11, .2);
    padding: 20px;
    border: 1px solid #ccc;
    margin: 60px auto !important;
}
.yougo-title {
    border-bottom: 1px dotted #42210b;
    font-weight: bold;
    position: relative;
	font-size: 15px;
}
.yougo-title:after {
    position: absolute;
    content: "";
    background-image: url("../journal/img/MediPalette_WORD_white.png");
    width: 170px;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
    right: -21px;
    top: -20px;
}
.listtitle {
    border-bottom: 2px dotted #0096b0;
	padding-bottom: 10px;
}
.listtitle {
    font-size: 17px;
    font-weight: bold;
}
.sanko-title {
    color: #88B742;
}
.memo-title {
    color: #29ABE2;
}
.alart-title {
    color: #F15A24;
}
.sanko-box {
    border: #88B742 2px solid;
}
.memo-box {
    border: #29ABE2 2px solid;
}
.alart-box {
    border: #F15A24 2px solid;
}
.memo-box,.alart-box,.sanko-box {
    border-radius: 15px;
    padding: 10px 20px;
    width: 90%;
    margin: 60px auto !important;
}
.memo-title,.alart-title,.sanko-title{
    position: relative;
    font-size: 15px;
    font-weight: bold;
    padding-left: 60px;
}
.memo-text,.alart-text,.sanko-text {
    padding: 0px 10px;
    font-size: 14px;
    color: #3f3f3f;
}
.memo-title:before,.alart-title:before,.sanko-title:before {content: "";position: absolute;width: 45px;height: 50px;background-repeat: no-repeat;background-size: contain;left: 0;}
.sanko-title:before,.alart-title:before{top: -12.5px;}
.memo-title:before{top: -13px;}
.sanko-title:before {background-image: url("../journal/img/site-1.jpg");}
.memo-title:before {background-image: url("../journal/img/memo-6.jpg");}
.alart-title:before {background-image: url("../journal/img/caution-1.jpg");}
.midpush {
    font-weight: bold;
}
.pros {
    font-weight: bold;
    background-image: linear-gradient(to bottom, transparent, 75%, #FCC800, 85%, transparent);
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.001) 70%, #FCC800 80%, rgba(255, 255, 255, 0.001) 100%);
}
.cons {
    background-image: linear-gradient(to bottom, transparent, 75%, #EB6100, 85%, transparent);
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.001) 70%, #EB6100 80%, rgba(255, 255, 255, 0.001) 100%);
    font-weight: bold;
}
.quotext{
  text-align: right;
  font-size: 11px;
}
.content table th.dnone:first-child {
    border: none;
    background: #fff;
}
.content table {
    border: none;
}
.content table td {
    border-left: 1px solid #E5E5E5;
}
.hw100{min-width:100px;}
.hw200{min-width:200px;}
.hw300{min-width:300px;}
.hw400{min-width:400px;}
.hw500{min-width:500px;}
.hw600{min-width:600px;}
.hw700{min-width:700px;}
.hp10{width:10%;}
.hp20{width:20%;}
.hp30{width:30%;}
.hp40{width:40%;}
.hp50{width:50%;}
.hp60{width:60%;}
.hp70{width:70%;}
.hp80{width:80%;}
.hp90{width:90%;}
@media screen and (max-width: 767px) {
.sphw100{min-width:100px;overflow:auto;}
.sphw200{min-width:200px;overflow:auto;}
.sphw300{min-width:300px;overflow:auto;}
.sphw400{min-width:400px;overflow:auto;}
.sphw500{min-width:500px;overflow:auto;}
.sphw600{min-width:600px;overflow:auto;}
.sphw700{min-width:700px;overflow:auto;}
.sphw800{min-width:800px;overflow:auto;}
.sphw900{min-width:900px;overflow:auto;}
.sphw1000{min-width:1000px;overflow:auto;}
.sphp10{width:10%;overflow:auto;}
.sphp20{width:20%;overflow:auto;}
.sphp30{width:30%;overflow:auto;}
.sphp40{width:40%;overflow:auto;}
.sphp50{width:50%;overflow:auto;}
.sphp60{width:60%;overflow:auto;}
.sphp70{width:70%;overflow:auto;}
.sphp80{width:80%;overflow:auto;}
.sphp90{width:90%;overflow:auto;}
.content .yougo-text,.content .alart-text,.content .sanko-text,.content .memo-text {
    font-size: 14px;
    margin-top: 0px;
}
.alart-title:before,.sanko-title:before,.memo-title:before {
  width: 20px;
  top: -8px;
  left: 9px;
}
.alart-title:before,.sanko-title:before {
  width: 25px;
  top: -7px;
  left: 9px;
}
.yougo-title{
  font-size:15px; padding-top: 10px;
}
.yougo-title:after {
   width: 80px;
   height: 25px;
   right: 0px;
   top: 0px;
}
.alart-title,.sanko-title,.memo-title {
    padding-left: 40px;
    font-size:14px;
}
.yougo-box{
  padding:10px;
}
.alart-box,.sanko-box,.memo-box {
    padding: 5px;
}
.content .hitlist {
    padding: 10px 20px;
}
.content .list-text li {
    padding-left: 0px;
}
.content .list-text li:last-child {
    margin-bottom: 10px;
}
}
@media only screen and (min-width: 768px) {
.content h4 {
    font-size: 1.2rem;
}
.pic-box {
    width: 60%;
    margin: auto;
}
.yougo-title:after {
    width: 154px;
}
}

@media screen and (max-width: 767px) {
	.journal-container {
		padding: 20px;
		margin: 100px auto 50px;
	}
	.journal-title {font-size: 18px;}
	.memo-box,.alart-box,.sanko-box,.pic-box,.yougo-box {
		margin: 30px auto !important;
	}
	.content table th,.content table td {
		font-size: 12px;
		padding: 5px;
	}
	.content p {font-size: 14px;}
	.content .qtext {font-size: 15px;}
	.content h2,.content h3 {font-size: 17px;}
	.listtitle {font-size: 15px;}
	.content .list-text li {font-size: 14px;}
}

