/*
Theme Name: ms consulting
*/
/* この下に通常のcssを書いていく */

.news-container {
  margin-bottom: 8em;
}
.news-container ul.sns {
  border-bottom: 1px solid #E7E7E7;
  display: flex;
  justify-content: end;
  padding-bottom: 2.5em;
}
.news-container ul.sns li:first-child {
  margin-right: 1em;
}
.news-container ul.sns a {
  display: block;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
  transition: all .3s;
}
.news-container ul.sns a:hover {
  transition: all .3s;
  filter: brightness(1.4);
}
.news-container ul.sns img {
  width: 42px;
}
.news-container a.detail-link {
  display: block;
  transition: all .3s;
}
.news-container a.detail-link:hover {
  background-color: #F3FAFF;
}
.news-container dl {
  border-bottom: 1px solid #E7E7E7;
  padding: 1.8em 1em;
  display: flex;
  align-items: center;
}
.news-container dl dt {
  color: #5D5D5D;
  font-size: 1.4rem;
  line-height: 1.2;
  margin-right: 2em;
  font-weight: 700;
  font-family: "Inter", sans-serif;
}
.news-container dl dd {
  display: flex;
  align-items: center;
}
.news-container dl dd span,
dl.news-head dd span {
  font-size: 1.2rem;
  line-height: 1;
  font-weight: 700;
  color: #fff;
  border-radius: 4px;
  padding: 0.5em 2em;
  background-color: #00C2CD;
}
.news-container dl dd span.お知らせ,
dl.news-head dd span.お知らせ {
	background: #FF8A78;
}
.news-container dl dd span.セミナー,
dl.news-head dd span.セミナー {
	background: #0081CC;
}
.news-container dl dd p {
  font-size: 1.4rem;
  line-height: 1.2;
  margin-left: 3em;
}


/* navigation */
.page-navigation {
	margin-top: 2.5em;
}
.page-navigation ul {
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-navigation ul li {
  font-size: 1.6rem;
}
.page-navigation ul li:not(:last-child) {
  margin-right: 10px;
}
.page-navigation ul li a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  width: 3em;
  height: 3em;
  background-color: #EFEFEF;
  color: #004B81;
  transition: .3s;
}
.page-navigation ul li a:hover {
  background-color: #004B81;
  color: #fff;
  transition: .3s;
}
.page-navigation ul li a:hover img {
  transition: .3s;
  filter: invert(100%) sepia(97%) saturate(13%) hue-rotate(220deg) brightness(103%) contrast(103%);
}
.page-navigation ul li.current {
  width: 3em;
  height: 3em;
  font-size: 1.4rem;
  background-color: #004B81;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-navigation ul img {
  width: 20px;
}

/* 個別記事 */
.news-container-detail {
  margin-bottom: 6em;
}
dl.news-head {
  display: flex;
  margin-bottom: 3em;
}
dl.news-head dt {
  color: #5D5D5D;
  font-size: 1.4rem;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  line-height: 1.2;
  margin-right: 2em;
}
.news-content dt h3 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.2;
  border-bottom: 2px solid #E7E7E7;
  padding-bottom: .9em;
  margin-bottom: 2em;
}
.news-content dd p {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #202020;
  margin-bottom: 1em;
}

@media (max-width: 520px) {
	.news-container {
		margin-bottom: 4em;
	}
	.news-container ul.sns li:first-child {
		margin-right: .5em;
	}
	.news-container dl {
		padding: .8em 0;
		flex-direction: column;
		align-items: flex-start;
	}
	.news-container dl dt {
		font-size: .85rem;
		margin-bottom: 1em;
		padding-left: .4em;
	}
	.news-container dl dd span, dl.news-head dd span {
		font-size: .8rem;
		padding: .5em 1em;
	}
	.news-container dl dd p {
		font-size: .9rem;
    	margin-left: 1.5em;
	}
	.page-navigation {
		margin-top: 1.5em;
	}
	.page-navigation ul li:not(:last-child) {
        margin-right: 5px;
    }
	.page-navigation ul li a, .page-navigation ul li.current {
		width: 2.4em;
        height: 2.4em;
        font-size: .8rem;
	}
	
	.news-container ul.sns {
		padding-bottom: 1.2em;
	}
	.news-container-detail {
		margin-bottom: 4em;
	}
	dl.news-head {
		margin-bottom: 2em;
	}
	dl.news-head dt {
		font-size: .85rem;
		margin-right: 1.5em;
	}
	dl.news-head dd span {
		font-size: .75rem;
		padding: .3em 1.1em;
	}
	.news-container dl dd {
		padding-left: .3em;
	}
	.news-content dt h3 {
		font-size: 1.1rem;
		margin-bottom: 1em;
	}
	.news-content dd p {
		font-size: .8rem;
	}
}