@charset "utf-8";

/*********** 記事ページ ***********/

.article_box a:hover {
	cursor: pointer;
}

.article_box h1 {
	font-size: 1.6rem;
}
.article_box h2 {
	font-size: 1.6rem;
	font-weight: 400;
	padding: 0.5em 0;
	border-top: 3px solid #8EC1DB;
	border-bottom: 3px solid #8EC1DB;
	margin: 80px auto 25px;
}
.article_box h3 {
	font-size: 1.35rem;
	font-weight: 400;
	background: #D4ECF7;
	padding: 0.3em 0.7em;
	border-radius: 5px;
	margin: 50px auto 15px;
}

.article_box .main_img_box {
	margin:40px auto;
}

.article_box .index_box {
	width: 100%;
	padding: 25px 35px;
	margin-top: 40px;
	border: 1px solid #B1B1B1;
	border-radius: 20px;
	box-sizing: border-box;
}

.article_box ol li {
	margin: 10px auto;
}
.article_box .txt_box ol {
	margin: 40px auto;
}

.article_box p a {
	text-decoration: underline;
}

.article_box .point_box {
	position: relative;
	width: 90%;
	max-width: 785px;
	margin: 50px auto;
	padding: 25px 25px 15px 25px;
	border:1px solid #B1B1B1;
	border-radius: 5px;
	box-sizing: border-box;
}
.article_box .balloon {
  	position: absolute;
  	display: inline-block;
	top: -50px;
	left: 30px;
  	margin: 1.5em 0;
  	padding: 7px 25px;
  	max-width: 100%;
  	color: #fff;
  	font-size: 16px;
  	background: #C3C3C3;
	border-radius: 500px;
}
.article_box .balloon:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 30px;
  border: 5px solid transparent;
  border-top: 8px solid #C3C3C3;
}

.article_box .article_img_box {
	width: 90%;
	max-width: 785px;
	margin: 40px auto;
}

.article_box .table_box,.article_box .table_box2,.article_box .table_box3 {
	width: 100%;
	max-width: 785px;
	margin: 40px auto;
}
.article_box .table_box table,.article_box .table_box2 table,.article_box .table_box3 table {
	width: 100%;
	border:1px solid #707070;
	border-radius: 20px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.article_box .table_box th, .article_box .table_box td,
.article_box .table_box2 th, .article_box .table_box2 td,
.article_box .table_box2 th, .article_box .table_box3 td {
	border-bottom:1px solid #707070;
	border-right:1px solid #707070;
	box-sizing: border-box;
	padding: 0.8em 1.5em;
	vertical-align: middle;
}
.article_box .table_box tr th:last-child,
.article_box .table_box tr td:last-child,
.article_box .table_box2 tr th:last-child,
.article_box .table_box2 tr td:last-child,
.article_box .table_box3 tr th:last-child,
.article_box .table_box3 tr td:last-child {
	border-right: none;
}
.article_box .table_box tr:last-child td,
.article_box .table_box2 tr:last-child td,
.article_box .table_box3 tr:last-child td{
	border-bottom: none;
}
.article_box .table_box2 th:last-child {
	border-bottom: none;
}
.article_box .table_box th:first-child,
.article_box .table_box2 th:first-child{
	width: 35%;
	text-align: center;
	background: #8EC1DB;
	color: #fff;
}
.article_box .table_box th:last-child,
.article_box .table_box2 th:last-child {
	width: 65%;
	text-align: center;
	background: #8EC1DB;
	color: #fff;
}
.article_box .table_box2 th:first-child {
	width: 28%;
	background: #529BBF;
	color: #fff;
	border-bottom: none;
}
.article_box .table_box2 th:last-child {
	width: 72%;
}
.article_box .table_box2 .blue {
	color: #529BBF;
}
.article_box .table_box3 .bg_blue {
	background: #529BBF;
	color: #fff;
}

.article_box .number_box {
	background: #F5F5F5;
	max-width: 785px;
	width: 90%;
	margin: 0 auto 20px;
	padding: 10px 20px;
	border-radius: 5px;
	border: 1px #D6D6D6 solid;
	box-sizing: border-box;
}
.article_box .comment_box ul {
	max-width: 680px;
	widows: 95%;
	display: flex;
}
.article_box .comment_box ul li:first-child {
	width: 90px;
}
.article_box .comment_box ul li:last-child {
	width: calc(100% - 90px);
}
.article_box .comment_box .balloon-left {
	position: relative;
	display: inline-block;
	margin: 0.5em 0 1.5em 25px;
	padding: 15px 25px;
	background: #FDFCEF;
	border: solid 1px #EDD75D;
	border-radius: 5px;
	box-sizing: border-box;
}
.article_box .comment_box .balloon-left:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -24px;
	margin-top: -16px;
	border: 12px solid transparent;
	border-right: 12px solid #FDFCEF;
	z-index: 2;
}
.article_box .comment_box .balloon-left:after {
	content: "";
	position: absolute;
	top: 50%;
	left: -27px;
	margin-top: -17px;
	border: 13px solid transparent;
	border-right: 13px solid #EDD75D;
	z-index: 1;
}

.article_box .attention_box ul {
	width: 90%;
	max-width: 785px;
	display: flex;
	align-items: center;
	margin: 0 auto 20px;
	background: #FFEBEB;
	padding: 15px 25px;
	box-sizing: border-box;
	border-radius: 5px;
}
.article_box .attention_box ul li:first-child {
	width: 60px;
}
.article_box .attention_box ul li:last-child {
	width: calc(100% - 60px);
	border-left: 1px solid #C13A39;
	margin-left: 25px;
	padding-left: 25px;
}
.article_box .bnr_box_s {
	width: 390px;
	margin: 0 auto 20px;
}


@media screen and (max-width: 920px) {
	
}


@media screen and (max-width: 767px) {
	
.article_box .comment_box ul li:first-child {
	width: 70px;
}
.article_box .comment_box ul li:last-child {
	width: calc(100% - 70px);
}
.article_box .comment_box .balloon-left {
	position: relative;
	display: inline-block;
	margin: 0.5em 0 1.5em 25px;
	padding: 15px 25px;
	background: #FDFCEF;
	border: solid 1px #EDD75D;
	border-radius: 5px;
	box-sizing: border-box;
}
.article_box .comment_box .balloon-left:before {
	content: "";
	position: absolute;
	top: 0;
	left: -24px;
	margin-top: 15px;
	border: 12px solid transparent;
	border-right: 12px solid #FDFCEF;
	z-index: 2;
}
.article_box .comment_box .balloon-left:after {
	content: "";
	position: absolute;
	top: 0;
	left: -27px;
	margin-top: 14px;
	border: 13px solid transparent;
	border-right: 13px solid #EDD75D;
	z-index: 1;
}
	
.article_box .attention_box ul {
	display: block;
	align-items: center;
	margin: 0 auto 20px;
	background: #FFEBEB;
	padding: 15px 25px;
	box-sizing: border-box;
	border-radius: 5px;
}
.article_box .attention_box ul li:first-child {
	width: 45px;
	text-align: center;
	margin: auto;
}
.article_box .attention_box ul li:last-child {
	width: calc(100%);
	border-left: none;
	border-top: 1px solid #C13A39;
	margin-left: 0;
	padding-left: 0;
	margin-top: 20px;
	padding-top: 20px;
}
.article_box .bnr_box_s {
	width: 85%;
	margin: 0 auto 20px;
}
	
.article_box .table_box2 th:first-child {
	width: 32%;
	background: #529BBF;
	color: #fff;
	border-bottom: none;
}
.article_box .table_box2 th:last-child {
	width: 68%;
}
	
}


