@charset "utf-8";

/* ========== すべて共通 ========== */

/* ========== ページ遷移フェードアニメーション ========== */
.wrap {
	animation: fadein 0.8s forwards;
}
@keyframes fadein {
	0% {opacity: 0}
	100% {opacity: 1}
}
/* ========== /ページ遷移フェードアニメーション ========== */

html, body {
	font-family: "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	line-height: 25px;
	text-align: left;
	text-align: justify;
	color: #333333;
	background: #fff;
}

body, div, p, h1, h2, h3, h4, ul, figure {
	margin: 0;
	padding: 0;
}

img {
	width: 100%;
	height: auto;
}

.img-responsive {
	display: block;
	max-width: 100%;
	height: auto;
}

/* キービジュアル */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important;}
.sp { display: none !important;}
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
.pc { display: none !important; }
.sp { display: block !important; }
}

/*========= レイアウトのためのCSS ===============*/

h1 {
	font-family: 'Montserrat', sans-serif;
  font-size:1.4rem;
	font-weight: 500;
	letter-spacing: 0.05rem;
	color: #333;
	margin-top: 10px;
}

h2 {
	font-family: 'Montserrat', sans-serif;
  font-size:1.35rem;
	line-height: 35px;
  text-align: center;
	color: #333;
	font-weight: 600;
  margin: 0 0 10px 0;
}

a {
	text-decoration: none;
	color: #333333;
}

p {
	font-size: 1.05rem;
	line-height: 30px;
}

#header{
  background:#fff;
  color:#fff;
  text-align: center;
  padding: 20px;
}

.logo {
	width: 80px;
	height: auto;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
}

section{
  padding: 30px 30px;
}

.comment {
	font-family: serif;
	text-align: center;
	font-size: 1.7rem;
	line-height: 40px;
	font-weight: 500;
	color: #333;
	margin-top: 60px;
}

.home-keyvisua2 {
	width: 60%;
	height: auto;
	margin-top: 50px;
	margin-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
}

.home-keyvisua3 {
	width: 100%;
	height: auto;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

/* ジョブ=PCデスクトップ用のみの設定 */
@media screen and (min-width: 768px) {
	.job-container {
		width: 90%;
		margin: 0px auto 0px auto;
	  padding: 20px 50px 10px 50px;
		display: flex;
		flex-flow: row;
	}
	
	.job-image {
		flex: 1 1 570px;  
		order: 1;
	}
	
.job-text {
		flex: 1 1 570px;
		padding: 20px 20px 0 30px;
		text-align: left;
		order: 1;
	}
	
	.job-p {
		font-size: 1.3rem;
		line-height: 40px;
	  font-weight: 600;
		color: #333;
	}
	
}

small {
  color:#999;
  display: block;
  text-align: center;
}

/* ========== footer ========== */
.footer-container {
	font-size: 0.5rem;
	font-family: 'Montserrat', sans-serif;
	color: #444;
	margin-top: 5px;
	border-top: solid #c0c0c0 1px;
}
.footer-container p {
	font-size: 0.9rem;
	margin: 10px 0 30px 0;
	text-align: center;
}

/*========= SP用のためのCSS ===============*/
@media only screen and (max-width: 750px) {

	h1 {
  font-size:1.2rem;
	font-weight: 500;
	letter-spacing: 0.05rem;
	color: #333;
	margin-top: 10px;
}
	
h2 {
  font-size:1.1rem;
  text-align: center;
	color: #333;
	font-weight: 500;
  margin: 0 0 20px 0;
}
	
.comment {
	font-family: serif;
	text-align: center;
	font-size: 1.2rem;
	line-height: 30px;
	font-weight: 600;
	color: #333;
	margin-top: 40px;
}	
	
.logo {
	width: 80px;
	height: auto;
	margin-top: 10px;
	margin-bottom: -20px;
	margin-left: auto;
	margin-right: auto;
}	

section{
  padding: 30px 20px;
}	

section:nth-child(2n) { /*= 擬似クラス =*/
  background:#fff; 
}

}