@charset "utf-8";
.eyecatch_inc.about .eyecatch_inc02 .eye_img{
	background-image: url(../img/about/eye01.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.about .eyecatch_inc02 .eye_img{
		background-image: url(../img/about/eye01_sp.jpg);
		height: calc(100vh - 90px);
	}
}
.eyecatch_inc.top.about .eyecatch_inc01{
	justify-content: center;
	align-items: center;
}
@media only screen and (max-width: 767px) {
	 .eyecatch_inc.top .eyecatch_inc01{
	 	width: 93%;
	 	max-width: 345px;
	 }	
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01{
	text-align: center;
	margin: 0;
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text01{
	font-size: 42px;
	line-height: 52px;
	letter-spacing: 0.05em;
	margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text01{
		font-size: 35px;
		line-height: 45px;
	}
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text01{
	font-size: 42px;
	line-height: 52px;
	letter-spacing: 0.05em;
	margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text01{
		font-size: 35px;
		line-height: 45px;
	}
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 h2{
	font-size: 13px;
	line-height: 23px;
	letter-spacing: 0.04em;
	margin-bottom: 56px;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 h2{
		font-size: 12px;
		line-height: 22px;
		margin-bottom: 20px;
	}
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text06{
	font-size: 77px;
	line-height: 87px;
	letter-spacing: 0.01em;
	margin-bottom: 53px;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text06{
		font-size: 45px;
		line-height: 58px;
		letter-spacing: 0;
		margin-bottom: 20px;
	}
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text06 span{
	font-weight: 600;
}
.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text02{
	font-size: 17px;
	line-height: 35px;
	letter-spacing: 0.08em;
}
@media only screen and (max-width: 767px) {
	.eyecatch_inc.top.about .eyecatch_inc01 .eyecatch_inc01_01 .text02{
		font-size: 14px;
		line-height: 32px;
		letter-spacing: 0.02em;
	}
}
/*.eyecatch_inc.top.about .scroll{
	width: 1px;
	height: 67px;
	background-color: #fff;
	position: absolute;
	bottom: 56px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 10;
}*/

/*スクロールダウン全体の場所*/
.scrolldown1{
    /*描画位置※位置は適宜調整してください*/
  position:absolute;
  left:50%;
  bottom:56px;
    /*全体の高さ*/
  height:67px;
}



/* 線の描写 */
.scrolldown1::after{
  content: "";
    /*描画位置*/
  position: absolute;
  top: 0;
    /*線の形状*/
  width: 1px;
  height: 30px;
  background: #eee;
    /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity:0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:57px;
    opacity: 1;
  }
  100%{
    height:0;
    top:67px;
    opacity: 0;
  }
}


/*.contents01ここから*/
.contents01{
	width: 100%;
	height: auto;
	display: block;
}
.contents01 .contents01_01{
	width: 1180px;
	height: auto;
	padding: 70px 0 80px;
	margin: 0 auto;
	display: block;
	text-align: center;
}
@media only screen and (max-width: 767px) {
	.contents01 .contents01_01{
		width: 90%;
		padding: 39px 0 50px;
	}
}
/*contents01ここまで*/

/*contents02ここから*/
.contents02{
	width: 100%;
	height: auto;
	display: block;
	background-color: #FBFCFB;
	padding: 100px 0;
}
@media only screen and (max-width: 767px) {
	.contents02{
		padding: 50px 0;
	}
}
.contents02 .contents02_01{
	width: 1180px;
	height: auto;
	margin: 0 auto 73px;
	display: block;
	text-align: center;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_01{
		width: 90%;
		max-width: 320px;
		margin: 0 auto 40px;
	}
}

.contents02 .contents02_02{
	width: 100%;
	height: 530px;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-bottom: 62px;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02{
		height: auto;
		flex-direction: column;
		margin-bottom: 40px
	}
}
.contents02 .contents02_02_01{
	width:calc(100% - (100% - 38%) / 2);
	margin: 0 0 0 auto;
	height: 530px;
	background-image: url(../img/about/ceo.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center left;
	position: absolute;
	right: 0;
	top: 0;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02_01{
		display: none;
	}
}
.contents02 .contents02_02 .contents02_02_02{
	width: 1180px;
	height: auto;
	margin: 0 auto;
	display: block;
	position: relative;
	z-index: 10;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02 .contents02_02_02{
		width: 90%;
		height: auto;
		margin: 0 auto 40px;
	}
}
.contents02 .contents02_02 .contents02_02_02 h4{
	font-size: 32px;
	line-height: 64px;
	letter-spacing: 0.03em;
	margin-bottom: 51px;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02 .contents02_02_02 h4{
		font-size: 21px;
		line-height: 34px;
		margin-bottom: 20px;
	}
}
.contents02 .contents02_02 .contents02_02_02 .text03{
	font-size: 16px;
	line-height: 26px;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02 .contents02_02_02 .text03{
		font-size: 11px;
		line-height: 21px;
	}
}
.contents02 .contents02_02 .contents02_02_02 .text03 span{
	font-size: 20px;
	line-height: 30px;
	letter-spacing: 0.05em;
	margin-left: 27px;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02 .contents02_02_02 .text03 span{
		font-size: 14px;
		letter-spacing: 0.05em;
		line-height: 22px;
	}
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_02 .img01{
		width: 100%;
		height: auto;
		display: block;
	}
}
.contents02 .contents02_03{
	width: 1180px;
	height: auto;
	display: block;
	margin: 0 auto;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_03{
		width: 90%;
	}
}
.contents02 .contents02_03 .text04{
	font-size: 15px;
	line-height: 32px;
}
@media only screen and (max-width: 767px) {
	.contents02 .contents02_03 .text04{
		font-size: 14px;
		line-height: 28px;
	}
}
/*contents02ここまで*/

.contents03{
	width: 100%;
	height: auto;
	display: block;
	background-color: #FBFCFB;
	padding: 75px 0;
	background-image: url(../img/about/bg01.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
@media only screen and (max-width: 767px) {
	.contents03{
		padding: 50px 0;
	}
}
.contents03 .contents03_01{
	width: 1180px;
	height: auto;
	margin: 0 auto 73px;
	display: block;
	text-align: center;
}
@media only screen and (max-width: 767px) {
	.contents03 .contents03_01{
		width: 100%;
		background-image: url(../img/about/bg01_sp.jpg);
		margin: 0 auto;
	}
}
.contents03 .contents03_01 ul{
	width: 980px;
	height: auto;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	margin: 0 auto;
}
@media only screen and (max-width: 767px) {
	.contents03 .contents03_01 ul{
		width: 90%;
		margin: 0 auto;
	}
}
.contents03 .contents03_01 ul li{
	width: 100%;
	height: auto;
	padding: 40px;
	background-color: #fff;
	text-align: left;
	margin-top: 15px;
}
@media only screen and (max-width: 767px) {
	.contents03 .contents03_01 ul li{
		padding: 30px 20px;
	}
}
.contents03 .contents03_01 ul li:first-of-type{
	margin-top: 46px;
}
@media only screen and (max-width: 767px) {
	.contents03 .contents03_01 ul li:first-of-type{
		margin-top: 0;
	}
}
.contents03 .contents03_01 ul li h4{
	font-size: 20px;
	line-height: 55px;
	letter-spacing: 0.05em;
	margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
	.contents03 .contents03_01 ul li h4{
		font-size: 18px;
		line-height: 28px;
		letter-spacing: 0;
	}
}
.contents03 .contents03_01 ul li .text05{
	font-size: 14px;
	line-height: 24px;
}
/*contents03 ここまで*/

/*btnエリアここから*/
.contents04 {
	width:1180px;
	height: auto;
	margin: 0 auto;
	padding: 75px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
@media only screen and (max-width: 767px) {
	.contents04 {
		width:90%;
		padding: 50px 0;
		flex-direction: column;
	}
}
.contents04 li{
	width: 564px;
	height: 180px;
	display: block;
	background-image: url(../img/about/btn_bg01.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
@media only screen and (max-width: 767px) {
	.contents04 li{
		width: 320px;
		height: 102px;
		background-image: url(../img/about/btn_bg01_sp.jpg);
	}
	.contents04 li:first-of-type{
		margin-bottom: 20px;
	}
}
.contents04 li:last-of-type{
	background-image: url(../img/about/btn_bg02.jpg);
}
@media only screen and (max-width: 767px) {
	.contents04 li:last-of-type{
		background-image: url(../img/about/btn_bg02_sp.jpg);
	}
}
.contents04 li a{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
}
.contents04 li a .b_text01{
	font-size: 27px;
	line-height: 37px;
	color: #fff;
	margin-bottom: 5px;
}
@media only screen and (max-width: 767px) {
	.contents04 li a .b_text01{
		font-size: 18px;
		line-height: 28px;
		margin-bottom: 1px;
	}
}
.contents04 li a .b_text02{
	font-size: 19px;
	line-height: 29px;
	letter-spacing: 0.07em;
	color: #fff;
}
@media only screen and (max-width: 767px) {
	.contents04 li a .b_text02{
		font-size: 13px;
		line-height: 23px;
		letter-spacing: 0.07em;
		color: #fff;
	}
}
.contents04 li a .item{
	width: 38px;
	height: auto;
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 42px;
	margin: auto;
}
@media only screen and (max-width: 767px) {
	.contents04 li a .item{
		width: 22px;
		right: 23px;
	}
}

/*サブタイトル共通*/
.sub01{
	font-size: 42px;
	line-height: 52px;
	margin-bottom: 6px;
	letter-spacing: 0.05em;
}
@media only screen and (max-width: 767px) {
	.sub01{
		font-size: 35px;
		line-height: 45px;
		margin-bottom: 4px;
		letter-spacing: 0;
	}
}
.sub02{
	font-size: 13px;
	line-height: 23px;
	color: #888888;
}
@media only screen and (max-width: 767px) {
	.sub02{
		font-size: 12px;
		line-height: 22px;
		margin-bottom: 28px;
	}
}
.sub03{
	font-size: 32px;
	line-height: 55px;
	letter-spacing: 0.03em;
	margin-top: 40px;
}
@media only screen and (max-width: 767px) {
	.sub03{
		font-size: 22px;
		line-height: 32px;
		margin-top: 28px;
	}
}


.eachTextAnime span{opacity: 0;}
.eachTextAnime.appeartext span{ animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
	0% {opacity:0;}
	100% {opacity:1;}
}


