@charset "UTF-8";
/* ------------------------------
固定ページ「私たちについて」
------------------------------ */
.page-about #header{
	background-image: url(../img/page-about_main_visual.png);
	background-size: cover;
	background-position: 50% 50%;
}

.page-about #copy{
	display: table;
	width: 100%;
	padding:90px 55px;
	background-color: #0fae78;
	color: #fff;
}
.page-about #copy h2{
	display: table-cell;
	vertical-align: middle;
	padding-right: 75px;

	font-size:27px;
	font-size:2.7rem;
	letter-spacing: 0.2em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: bold;
	line-height: 1.8;

	white-space: nowrap;
}
.page-about #copy p{
	display: table-cell;
	vertical-align: middle;
	font-size:14px;
	font-size:1.4rem;
	letter-spacing: 0.15em;
}
/* 多面的なサポート */
.about-support{
	padding:95px 0;
}
.about-support h3{
	margin-bottom: 65px;
	font-size:17px;
	font-size:1.7rem;
	letter-spacing: 0.2em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 1.8;
	text-align:center;
}
.about-support ul{
	list-style: none;
	font-size: 0;
	margin-top: 60px;
}
.about-support li{
	display: inline-block;
	position: relative;
	width: 31.5%;
	padding-bottom: 40px;
	list-style:none;
	text-align: left;
	font-size:13px;
	font-size:1.3rem;
	letter-spacing: 0.05em;
	vertical-align: top;
}
.about-support li:nth-child(3n-1){
	margin:0 2.7%;
}
.about-support li h4{
	margin-bottom: 29px;
	font-size:16px;
	font-size:1.6rem;
	letter-spacing: 0.1em;
	text-align: center;
	height: 74px;
	line-height: 74px;
}
.about-support li.growup h4{
	border:solid 2px #54bacc;
	color: #54bacc;
}
.about-support li.practitioner h4{
	padding:13px 10px 10px 10px;
	border:solid 2px #0fae78;
	color: #0fae78;
	line-height: 1.4;
}
.about-support li.keisho h4{
	border:solid 2px #95c141;
	color: #95c141;
}
.about-support li.talentconsulting h4{
	border:solid 2px #96cc87;
	color: #96cc87;
}
.about-support li.academy h4{
	border:solid 2px #3ac996;
	color: #3ac996;
}
.about-support li.tax_accounting h4{
	border:solid 2px #009ca9;
	color: #009ca9;
}

.page #main .about-support a.btn{
	display: block;
	max-width: 270px;
	height: 60px;
	margin:10px auto 30px auto;

	text-align: center;
	color: #0fae78;
	letter-spacing: 0.2em;
	line-height: 60px;
	border:solid 1px #0fae78;

	background-image: url(../img/arrow_green_right.png);

	background-repeat: no-repeat;
	background-size: 8px auto;
	background-position: 95% 50% ;
	transition: background-color 0.3s ease 0.1s;
}
.page #main .about-support a.btn:hover{
	background-color: rgba(15, 174, 120, 0.1);
}

.relatedLink{
	margin-bottom: 70px;
}
.relatedLink ul{
	list-style: none;
	font-size: 0;
}
.relatedLink li{
	position: relative;
	float: left;
	width: 48.7%;
	min-height: 450px;
	margin-right: 2.5%;
	padding:80px 40px;
	color: #fff;
	font-size:13px;
	font-size:1.3rem;
	letter-spacing: 0.15em;
	text-align: center;

	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50% ;
}
.relatedLink li.success{
	background-image: url(../img/page-about_bg_success.png);
}
.relatedLink li.doctor{
	float: right;
	margin-right: 0%;
	background-image: url(../img/page-about_bg_doctor.png);
}
.relatedLink li h3{
	position: relative;
	margin-bottom: 60px;
	font-size: 22px;
	font-size: 2.2rem;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	letter-spacing: 0.2em;
	text-align: center;
	line-height: 1.5;
}
.relatedLink li h3:before{
	position: absolute;
	bottom: -20px;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: " ";
	border-bottom: solid 1px #fff;
	width: 15px;
}
.relatedLink li p{
	margin-bottom: 20px;
}
.page #main .relatedLink li a.btn{
	position: absolute;
	bottom: 75px;
	left: 0;
	right: 0;
	display: block;
	width: 270px;
	height: 60px;
	margin:0 auto;
	border:solid 1px #fff;

	color: #fff;
	font-size: 16px;
	font-size: 1.6rem;
	letter-spacing: 0.2em;
	line-height: 60px;

	background-image: url(../img/arrow_white_right.png);

	background-repeat: no-repeat;
	background-size: 8px auto;
	background-position: 94% 50% ;
	transition: background-color 0.3s ease 0.1s;
}
.page #main .relatedLink li a.btn:hover{
	background-color: rgba(255, 255, 255, 0.3);
}

.relatedBlog{
	margin-top: 70px;
	padding:65px 0;
	background-color: #fafafa;
}
.relatedBlog h3{
	position: relative;
	margin-bottom: 70px;
	font-size: 22px;
	font-size: 2.2rem;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	letter-spacing: 0.2em;
	text-align: center;
}
.relatedBlog h3:before{
	position: absolute;
	bottom: -20px;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: " ";
	border-bottom: solid 1px #000;
	width: 15px;
}

.relatedBlog .btn{
	display: block;
	width: 270px;
	height: 60px;
	margin:45px auto 0 auto;
	border:solid 1px #000;

	color: #000;
	font-size: 16px;
	font-size: 1.6rem;
	letter-spacing: 0.2em;
	line-height: 60px;
	text-align: center;

	background-image: url(../img/arrow_black_right.png);

	background-repeat: no-repeat;
	background-size: 8px auto;
	background-position: 94% 50% ;
	transition: background-color 0.3s ease 0.1s;
}
.relatedBlog .btn:hover{
	background-color: rgba(255, 255, 255, 0.6);
}

/* ---------------------------------------------------------------------------- 

▼▼▼ ウィンドウサイズ1170px以下にのみ適用されるcss ▼▼▼

---------------------------------------------------------------------------- */
@media only screen and (max-width: 1170px) {
.page-about #copy{
	padding:90px 0px;
}
.page-about #copy .wrap{
	padding-right: 2%;
	padding-left:2%;
}

.about-support{
	padding-right: 5%;
	padding-left:5%;
}

.relatedLink li {
	min-height: 355px;
	padding:7% 2%;
}

.page #main .relatedLink li a.btn{
	bottom: 50px;
}


.relatedBlog{
	padding-right: 5%;
	padding-left:5%;
}

}



/* ---------------------------------------------------------------------------- 

▼▼▼ ウィンドウサイズ768px以下にのみ適用されるcss ▼▼▼

---------------------------------------------------------------------------- */

@media screen and (max-width: 768px){
.page-about #copy{
	padding:30px 0;
	display: block;
}
.page-about #copy h2{
	padding: 0;
	display: block;
	margin-bottom: 1em;
	line-height: 1.5;
	letter-spacing: 0.1em;
	white-space: normal;
	text-align: center;
}
.page-about #copy p{
	display: block;
}

.about-support{
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 3%;
	padding-left:3%;
}
.about-support h3{
	margin-bottom: 20px;
	letter-spacing: 0.1em;
	text-align: left;
}
.about-support ul{
	margin-top: 20px;
}
.about-support li{
	display: block;
	width: 100%;
	padding-bottom:20px;
}
.about-support li:nth-child(3n-1){
	margin:0 ;
}
.about-support li h4{
	margin-bottom: 15px;
}
.about-support a.btn{
	max-width: 100%;
}


.relatedLink li{
	float: none;
	width: 100%;
	min-height: 100px;
	padding:13% 3%;
	margin-bottom:20px;
}
.relatedLink li:nth-child(2){
	float: none;
	margin-right: 0%;
}
.page #main .relatedLink li a.btn{
	position: static;
}


.relatedBlog h3{
	margin-bottom: 35px;
	letter-spacing: 0.1em;
	text-align: center;
	line-height: 1.4;
}
.relatedBlog{
	padding-right: 3%;
	padding-left:3%;
}
.relatedBlog .btn{
	width: 100%;
}

}