@charset "UTF-8";

/* ====================================
	共通スタイル
 ==================================== */

.col_navi {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	margin-top: -15px;
}
.col_navi > div {
	width: 28.5%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	justify-content: center;
	padding-top: 10px;
	padding-right: 1%;
	padding-bottom: 0;
	padding-left: 1%;
}
.left {
    text-align: left;
    margin-right: auto;
    justify-content: left;
}


.bg_navi {
	border-radius:10px;
	background-color: #edf2e1;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	margin-top: 50px;
}
.bg_navi .container_block{
  display: flex;
}
.bg_navi .container_block .contents_l {
	width: 20%;
	background-color: #72af2d;
	padding: 12px;
	border-radius:10px;
	text-align: center;
	font-weight: 500;
	color: #FFF;
    margin-top: auto;
    margin-bottom: auto;
}
.bg_navi .container_block .contents_r {
  flex: 1;
  width: 78%;
  margin-left: 2%;
}

.bg_navi .container_block .contents_r p {
  font-size:108%;
  font-weight:500;
}

.bg_navi .col_4 {
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
	margin-top: 20px;
}
.bg_navi .col_4 > div {
	width: 25%;
	padding: 15px;
	text-align: center;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #72af2d;
}

.t-green {
	font-size: 108%;
	font-weight: 500;
	color: #72af2d;
}

/* ====================================
	スマートフォン専用スタイル
===================================== */
@media only screen and (max-width: 767px) {
.col_navi > div {
    width: 100%;
	margin-top: 40px;
}

.bg_navi .container_block{
  display: block;
}
.bg_navi .container_block .contents_l {
  width: 100%;
}
.bg_navi .container_block .contents_r {
  width: 100%;
  margin-left: 0%;
  margin-top: 2rem;
}
.bg_navi .col_4 > div {
 width: 100%;
}
.bg_navi .col_4 > div {
	border-right: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #72af2d;
}
.bg_navi .col_4 > div:last-child {
	border-bottom: none;
}
}


/* ====================================
	PC&タブレット、印刷専用スタイル
===================================== */
@media print , screen and (min-width: 768px) {
.col_navi > div:first-child {
	width: 38.4%;
}
.bg_navi .col_4 > div:last-child {
	border-right: none;
}
}
