/*	/Service/
------------------------------ */

/* Section Title */
article[role="introduction"] > header {
	text-align: center;
}

article[role="introduction"] > header > h2 {
	display: inline-block;
	font-size: 2.2rem;
	font-weight: 700;
	color: #6d6d6d;
	text-align: center;
	text-transform: uppercase;
	padding: 0 1rem 0.4rem;
	border-bottom: 2px solid #6d6d6d;
	margin: 0 auto;
}
article[role="introduction"] > header > h3 {
	font-size: 1.2rem;
	color: #3300FF;
	text-align: center;
	margin-top: 0.6rem;
}
article[role="introduction"] > header > h4 {
	font-size: 1.2rem;
	color: #333;
	text-align: left;
}

article[role="introduction"] > p {
	font-size: 1rem;
	line-height: 1.4rem;
	color: #333;
	text-align: left;
	padding: 0 2rem;
	margin: 2rem auto;
}
article[role="introduction"].bg_gray {
	background-color: #f2f2f2;
}

#cat-service2 .public_head {
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 3;
	background-color: #f2f2f2!important;
	padding: 1rem 0;
	margin: 2rem 0;
}


#cat-service2 {
	padding: 100px 0 0;
}


#cat-service2 .public_head h2 {
	font-size: 1.3rem;
	font-weight: 700;
}

#cat-service2 .wrapper {
	display: flex;
	justify-content: center;
	flex-direction: column;
	width: 90%;
	margin: 0 auto;
}
#cat-service2 h3.title {
	font-size: 1.4rem;
	font-weight: 700;
	padding: 0 0 0 1rem;
	border-left: 5px solid #000;
}

#cat-service2 .txt {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: 1rem auto;
}
#cat-service2 .txt h3 {
	font-size: 1.2rem;
	color: #3300ff;
	margin: .5rem 1rem 0 .5rem;
}
#cat-service2 .txt h3 span {
	margin-left: .3rem;
}
#cat-service2 .txt p {
	font-size: 1rem;
	color: #333;
	line-height: 1.5rem;
	margin: .5rem auto 1rem 2rem;
}

/* photos */
#cat-service2 .photos {
	display: flex;
	flex-wrap: wrap;	/* 折り返しあり */
	align-items: flex-end;		/* 下揃え */
	margin: 0 auto 3rem;
}
#cat-service2 .photos_end {
	display: flex;
	flex-wrap: wrap;	/* 折り返しあり */
	align-items: flex-end;		/* 下揃え */
	margin: 0 auto 3rem;
}
#cat-service2 .photos .ph
#cat-service2 .photos_end .ph {
	width: 100%;
	height: auto;
	margin: .5rem auto;
}
#cat-service2 .photos .ph p,
#cat-service2 .photos .ph_1 p,
#cat-service2 .photos .ph_3 p {
	font-size: .8rem;
	text-align: right;
}
#cat-service2 .photos .ph_1 {	/* 1カラム */
	width: 100%;
	height: auto;
	margin: .5rem auto;
}
#cat-service2 .photos .ph_3 {	/* 3カラム SP */
	width: 100%;
	height: auto;
	margin: .5rem auto;
}
#cat-service2 .ph img,
#cat-service2 .ph_1 img,
#cat-service2 .ph_3 img {
	width: 100%;
	height: auto;
}
#cat-service2 .photos .ph.bor {
/* 	border: 1px solid #ccc; */
}

.mb0 {
	margin-bottom: 0!important;
}

@media ( min-width : 959px ) { /* +960px */
	#cat-service2 .wrapper {
		width: 100%;
		max-width: 800px;
		margin: 0 auto;
	}
	#cat-service2 .photos .ph,
	#cat-service2 .photos_end .ph {
		width: 48%;
		height: auto;
		margin: .5rem 1%;
	}
	#cat-service2 .photos .ph_1 {	/* 1カラム */
		width: 98%;
		height: auto;
		margin: .5rem 1%;
	}
	#cat-service2 .photos .ph_3 {	/* 3カラム SP */
		width: 32%;
		height: auto;
		margin: .5rem .5%;
	}
	#cat-service2 .photos .ph p,
	#cat-service2 .photos .ph_1 p,
	#cat-service2 .photos .ph_3 p {
		font-size: .9rem;
	}
}

/* Sub Navi */
ul.sub_nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	width: 90%;
	margin: 2.5rem auto;
}
ul.sub_nav li {
	width: 33%;
	border-left: 1px solid #aaaaaa;
}
ul.sub_nav li:last-child {
	border-right: 1px solid #aaaaaa;
}
ul.sub_nav li a {
	display: flex;
  flex-direction: column;
  padding: 10px 0;
  font-weight: 700;
  text-align: center;
}
ul.sub_nav li a:link,
ul.sub_nav li a:visited {
	color: inherit;
	text-decoration: none;
}
ul.sub_nav li a:hover {
	opacity: .7;
	color: #3300FF;
	transition: .4s;
}

ul.sub_nav li.focus {
	color: #3300FF;
	transition: .4s;
}

@media ( min-width : 959px ) { /* +960px */
	ul.sub_nav {
		width: 600px;
		margin: 4rem auto;
	}
}