.letter-short { display: block; }
.tb { display: none; }

.message,
.business,
.strength,
.partner,
.ceo-interview {
	padding: 0 1rem;
}
/* NSPJに興味を持ってくださったみなさまへ */
.message .slide-txt h1.letter-short {
	padding: 0rem;
}
.message .slide-txt h1.letter-short span {
	padding: 0 2rem;
	letter-spacing: 0;
}
.message p {
	margin: 3rem 0;
}
/* What's NSPJ? */
.business > h1 {
	margin: 4rem 0;
	font-size: 2.4rem;
}
.business > h2 {
	margin: 4rem 0 2rem;
	font-size: 2rem;
}
.business p {
	margin: 3rem 0;
}
.business-field-img {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 2rem auto;
}
.business-field-img div {
	margin: 1rem;
	width: 12rem;
	height: 12rem;
	border: var(--introduction) solid 0.2rem;
	border-radius: 6rem;
	background: var(--bg-white);
}
.business-field-img img {
	display: block;
	margin: 2rem auto 0;
	width: 50%;
	height: auto;	
}
p.icon {
	margin: 0.5rem auto;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	letter-spacing: -0.05em;
}
.business-field {
	display: flex;
	flex-direction: column;
	margin: 2rem 0;
	padding: 2rem 1rem 2rem 3rem;
	border: var(--introduction) solid 0.2rem;
	background: var(--bg-white);
}
.business-field ul {
	margin: 0;
	padding: 0;
	width: 100%;
	list-style-position: outside;
	list-style-type: square;
}
.business-field li {
	font-size: 1.4rem;
}
/* NSPJの強み */
section.strength-number {
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 4rem 0 0 0;
	padding: 0;
}
div.strength-number {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 2rem 0 0 0;
	padding: 0;
}
.strength-number .container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 4rem;
	padding: 0;
	width: 20rem;
	height: 20rem;
	border-radius: 10rem;
	background: var(--introduction);
}
.strength-number i {
	display: block;
	margin: 2rem 0 0 0;
	padding: 0;
	color: var(--txt-white);
	font-size: 7rem;
}
.strength-number .container h1 {
	margin: 0.5rem 0 0 0;
	padding: 0;
	color: var(--txt-white);
	font-size: 2rem;
}
.strength-number p {
	margin-bottom: 2rem;
}
/* 外から見たNSPJ */
section.partner-interview {
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	width: 70%;
	background: var(--bg-white);
}
.partner-interview.photo img {
	width: 100%;
	height: auto;
}
.partner-interview.cap {
	margin: 0;
	padding: 1.4rem;
}
.partner-interview h1 {
	margin: 2rem 0 0 0;
	padding: 0;
	font-size: 1.6rem;
}
.partner-interview .partner-interview h2 {
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
}
.panel {
  border: none;
  border-left: none;
  border-right:none;
  background-color: white;
  padding: 1rem 2rem 4rem 2rem;
  display: none;
}
.partner-interview-contents {
  background-color: #eee;
  display: inline-block;
  width: 100%;
  border: none;
	margin: 4rem auto 0;
}
.acd-btn{
  display: block;
  flex-grow: 1;
  width: 100%;
  padding: 2rem;
  background: var(--bg-white);
	color: var(--txt-black);
  outline: none;
  border: 0.4rem solid var(--introduction);
  cursor: pointer;
  text-align: left;
}
.acd-btn:hover {
	border: 0.4rem solid var(--txt-black);
  background-color: var(--bg-black);
	color: var(--txt-white);
}
.partner-interview-contents i {
  float: right;
	color: var(--intro);	
}
.fa-arrow-down:hover {
	color: var(--txt-white);
}
.partner-interview-contents .panel h1 {
	margin: 3rem 0 1rem 0;
	padding: 0;
	font-size: 1.8rem;
	color: var(--introduction);
}
.partner-interview-contents .panel h2 {
	margin: 0 0 2rem 2rem;
	padding: 0;
	font-size: 1.8rem;
}
.partner-interview-contents .panel p {
	margin: 0 0 1rem 2rem;
	padding: 0;
	font-size: 1.6rem;
}
/* CEOインタビュー */
div.ceo-interview-link {
	position: relative;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	background: var(--bg-black);
}
div.ceo-interview-link img {
	display: block;
	width: 100%;
	cursor: pointer;
  transition-duration: 0.3s;
}
.ceo-interview div.ceo-interview-link p.cap {
	position: absolute;
	bottom: 0rem;
	right: 0rem;
	margin: 0;
	padding: 0;
	width: 100%;
	background: var(--bg-black);
	color: var(--txt-white);
	font-size: 1.8rem;
	font-weight: bold;
	letter-spacing: 0;
	text-align: center;
	opacity: 0.7;
}
div.ceo-interview-link img:hover {
  transform: scale(1.1);
	opacity: 0.6;
  transition-duration: 0.3s;
}



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

TABLET

------------------------------------------------------------------- */
@media screen and (min-width: 560px) {
	.letter-short { display: none; }
	.tb { display: block; }
	.message,
	.business,
	.strength,
	.partner,
	.ceo-interview {
		padding: 0 3rem;
	}
	.slide-txt {
		margin-left: 0;
		padding: 0;
	}
	.message .slide-txt h1.tb span {
		padding: 0 1rem;
	}
	.business-field {
		width: 50rem;
		margin-left: auto;
		margin-right: auto;
	}
	.strength-number-contents {
		width: 60%;
	}
	section.partner-interview {
		max-width: 40rem;
	}
	div.ceo-interview-link {
		max-width: 80rem;
	}
	.ceo-interview div.ceo-interview-link p.cap {
		font-size: 2.4rem;
		letter-spacing: inherit;
	}
}
/* -------------------------------------------------------------------

PC  1280

------------------------------------------------------------------- */
@media screen and (min-width: 1280px) {
	.message .slide-txt h1.tb span {
		padding: 0 5rem;
	}
	.business-field {
		flex-direction: row;
		margin: 4rem auto;
		width: 95%;
	}
	.business-field ul {
		width: 48%;
		padding-left: 1rem;
	}
	section.strength-number {
		flex-direction: row;
	}
	div.strength-number {
		flex-basis: 33%;
	}
	.strength-number .container {
		width: 20rem;
		height: 20rem;
		border-radius: 10rem;
	}
	.strength-number .container h1 {
		font-size: 2.2rem;
	}
	.strength-number-contents {
		width: 100%;
	}
	.strength-number p {
		margin: 0 auto;
		width: 90%;
		font-size: 1.6rem;
	}
	section.partner-interview {
		flex-direction: row-reverse;
		justify-content: space-between;
		width: 100%;
		max-width: initial;
		margin: 0 auto;
	}
	.partner-interview.photo {
		flex-basis: 30%;
	}
	.partner-interview.photo img {
		width: 100%;
		height: auto;
		vertical-align: bottom;
	}
	.partner-interview.cap {
		flex-basis: 70%;
		margin: 0;
		padding: 1.6rem 1.6rem 0 1.6rem;
		font-size: 1.8rem;
	}
	.partner-interview h1 {
		margin: 2.4rem 0 0 0;
		padding: 0;
		font-size: 1.8rem;
	}
	.partner-interview .partner-interview h2 {
		margin: 0;
		padding: 0;
		font-size: 2.2rem;
	}
	.partner-interview.cap {
		padding: 2rem 2rem 2rem 4rem;
	}
	.partner-interview-contents button {
		font-size: 1.8rem;
	}
	section.ceo-interview-link div.ceo-interview-link p.ceo-interview-link {
		position: absolute;
		bottom: 0rem;
		padding: 0.5rem 1rem;
		font-size: 3rem;
	}
}



