@charset "utf-8";

/*-- TOPだけルール ------------------------*/
.text {
	color: #ccc;
}
/* wrap */
.wrap1440 {
	width: 1440px;
	margin-left: auto;
	margin-right: auto;
}
/* topheadline */
.topheadline {
	color: #eee;
	line-height: 2.0;
	font-family: "Noto Serif Japanese", serif;;
	font-feature-settings : "palt";
	font-weight: 200;
}
/* topheadline--01 */
.topheadline.topheadline--01__concept {
	line-height: 1;		
}
.topheadline.topheadline--01__concept img {	
	width: 457px;
}
.topheadline.topheadline--01__concept + .text {
	margin-top: 90px;
	line-height: 2.9;
	letter-spacing: 0.3em;
	text-align: center;
}
.topheadline.topheadline--01__position {
	line-height: 1;	
}
.topheadline.topheadline--01__position img {
	width: 525px;	
}
.topheadline.topheadline--01 {
	line-height: 1;
}
.topheadline.topheadline--01 img {
	width: 396px;
}
.topheadline.topheadline--01__position + .text,
.topheadline.topheadline--01 + .text {
	margin-top: 40px;
}
.content--enttl {
	display: block;
	font-size: 12px;
	letter-spacing: 0.7em;
	line-height: 1;
	color: #b9af8f;
	transform: scale(0.9,1);
	transform-origin: top left;
	width: 111.1111111111%;	
	margin-bottom: 25px;
}
.content--enttl .en {
	opacity: 0;
	transition: .4s;	
}
.content--enttl.aos-animate .en {
	opacity: 1;
}
.content--enttl .number {
	height: 1em;
	font-size: 26px;
	margin-right: 20px;
	vertical-align: middle;
	overflow: hidden;
	position: relative;
}
.content--enttl .number p {
	display: inline-block;
	letter-spacing: 0;
	font-weight: 100;
}
/* topheadline--02 */
.topheadline.topheadline--02 {
	font-size: 24px;
	letter-spacing: 0.06em;
}
.topheadline.topheadline--02 small {
	display: block;
	font-size: 12px;
	letter-spacing: 0.5em;
	color: #b9af8f;
	margin-left: -15px;
}
.topheadline.topheadline--02 + .text {
	margin-top: 40px;
}
/* topheadline--03 */
.topheadline.topheadline--03 {
	font-size: 46px;
	font-family: 'Playfair Display', serif;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.topheadline.topheadline--03 {
		letter-spacing: 0.05em;
	}
}
/* topheadline--04 */
.topheadline.topheadline--04 img{
	width: 319px;
}
@media screen and (max-width: 1440px){
	.wrap1440 {
		width: 100%;
		padding-left: 30px;
		padding-right: 30px;
		box-sizing: border-box;
	}
}
@media screen and (max-width: 768px){
	/* topheadline--01 */
	.topheadline.topheadline--01__concept img {
		width: 96%;
	}
	.topheadline.topheadline--01__concept + .text {
		margin-top: 40px;
	}
	.topheadline.topheadline--01__position img {
		width: 70%;
	}
	.topheadline.topheadline--01 img {
		width: 68%;
	}
	.topheadline.topheadline--01__position + .text,
	.topheadline.topheadline--01 + .text {
		margin-top: 30px;
	}
	.topheadline.topheadline--02 {
		font-size: 18px;
	}
	.topheadline.topheadline--02 small {
		margin-bottom: 10px;
	}
	.topheadline.topheadline--02 + .text {
		margin-top: 30px;
	}
	/* topheadline--03 */
	.topheadline.topheadline--03 {
		font-size: 26px;
	}
	/* topheadline--04 */
	.topheadline.topheadline--04 img {
		width: 66%;
	}
}


/*-- topmainVisual -------------------------*/
.topmainVisual {
	width: 100%;
}
/* mainAnimate */
.mainAnimate {
	position: relative;
	overflow: hidden;
}
.mainAnimate .mainAnimate--shadow {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 4;
}
.mainAnimate .mainAnimate--anim01 {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
}
.mainAnimate .mainAnimate--anim01__txt {
	display: none;
	width: 25.677083333333332%;
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	margin:auto;
	text-align: center;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 4;
}
.mainAnimate .mainAnimate--anim02 {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
}
.mainAnimate .mainAnimate--anim02 .mainAnimate--anim02__img {
	position: absolute;
	left: 0;
	top: 0;
}
.mainAnimate .mainAnimate--anim02__txt {
	display: none;
	width: 32.55208333333333%;
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	margin:auto;
	text-align: center;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 3;
}
.mainAnimate .mainAnimate--anim03 {
	position: relative;
	overflow: hidden;
}
.mainAnimate .mainAnimate--anim03 .mainAnimate--anim03__img {
	transition: 3.2s;
	-webkit-transform-origin:center bottom 0;
    -moz-transform-origin:center bottom 0;
    -ms-transform-origin:center bottom 0;
    -o-transform-origin:center bottom 0;
    transform-origin:center bottom 0;
}
.mainAnimate .mainAnimate--anim03 .mainAnimate--anim03__img.zoomIn {
	transform: scale(1.2);
}
.mainAnimate .mainAnimate--anim03__txt {
	display: none;
	width: 38.54166666666667%;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 40px;
	margin: auto;
	text-align: center;
	z-index: 3;
}
@media screen and (max-width: 768px){
	.mainAnimate {
		width: 100%;
	}
	.mainAnimate .mainAnimate--shadow {
		width:100%;
	    /*height:760px;*/
	}
	.mainAnimate .mainAnimate--shadow .mainAnimate--shadow__img {
		width:100%;
	    height:100%;
	    position: relative;
	    overflow: hidden;
	}
	.mainAnimate .mainAnimate--shadow .mainAnimate--shadow__img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.mainAnimate .mainAnimate--anim01 {
		width:100%;
	    /*height:760px;*/
	}		
	.mainAnimate .mainAnimate--anim01 .mainAnimate--anim01__img {
		width:100%;
	    height:100%;
	    position: relative;
	    overflow: hidden;
	}
	.mainAnimate .mainAnimate--anim01 .mainAnimate--anim01__img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.mainAnimate .mainAnimate--anim01__txt {
		width: 49.84375%;
	}
	.mainAnimate .mainAnimate--anim02 {
		width:100%;
	    /*height:760px;*/
		position: absolute;
		left: 0;
		top: 0;
		z-index: 2;
	}
	.mainAnimate .mainAnimate--anim02 .mainAnimate--anim02__img {
		width:100%;
	    height:100%;
	    position: relative;
	    overflow: hidden;
	}
	.mainAnimate .mainAnimate--anim02 .mainAnimate--anim02__img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);	
	}
	.mainAnimate .mainAnimate--anim02__txt {
		width: 78.59375%;
	}
	.mainAnimate .mainAnimate--anim03 {
		/*height: 100%;*/
		overflow: hidden;
	}
	.mainAnimate .mainAnimate--anim03 .mainAnimate--anim03__img {
		width: auto;
		height: 100%;
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 0;
		transition: 3.2s;
		
		-webkit-transform-origin:right bottom 0;
	    -moz-transform-origin:right bottom 0;
	    -ms-transform-origin:right bottom 0;
	    -o-transform-origin:right bottom 0;
	    transform-origin:right bottom 0;
	}
	.mainAnimate .mainAnimate--anim03 .mainAnimate--anim03__img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top: 90%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -90%);

		/*max-width: inherit;
		height: 100%;*/
	}
	.mainAnimate .mainAnimate--anim03__txt {
		width: 81.5625%;
	}
}

/*-- contents--top01 ------------------------*/
.contents--top01 .wrap1440 {
	position: relative;
}
.contents--top01 .contents--top01--img {
	width: 100%;
	text-align: right;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
}
.contents--top01--bgBox {
	width: 66.66666666666666%;
	padding: 160px 110px 96px 100px;
	box-sizing: border-box;
	position: relative;
	z-index: 2;
}
.contents--top01--bgBox__black {
	width: 100%;
	height: 100%;
	background: #222;
	position: absolute;
	left: 0;
	top: 100px;
}
.topheadline.topheadline--02 {
	position: relative;
	z-index: 3;
}
.topheadline.topheadline--02 ul li {
	opacity: 0;
}
.topheadline.topheadline--02 ul.start li:first-child {
	-webkit-animation: topmainTxt 1.8s ease 1.0s 1 forwards;/*表示時間+start時間*/
	animation: topmainTxt 1.8s ease 1.0s 1 forwards;/*表示時間+start時間*/
}
.topheadline.topheadline--02 ul.start li:nth-child(2) {
	-webkit-animation: topmainTxt 1.8s ease 1.1s 1 forwards;/*表示時間+start時間*/
	animation: topmainTxt 1.8s ease 1.1s 1 forwards;/*表示時間+start時間*/
}
.topheadline.topheadline--02 ul.start li:nth-child(3) {
	-webkit-animation: topmainTxt 1.8s ease 1.2s 1 forwards;/*表示時間+start時間*/
	animation: topmainTxt 1.8s ease 1.2s 1 forwards;/*表示時間+start時間*/
}
.topheadline.topheadline--02 ul.start li:nth-child(4) {
	-webkit-animation: topmainTxt 2.0s ease 1.3s 1 forwards;/*表示時間+start時間*/
	animation: topmainTxt 2.0s ease 1.3s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes topmainTxt {
  100% {
  	opacity: 1;
  }
}
@keyframes topmainTxt {
  100% {
  	opacity: 1;
  }
}
/* contents--top01--clmBox */
.contents--top01--clmBox {
	width: 100%;
	margin: 90px 0 0;
}
.contents--top01--clmBox .clmBox--content:nth-child(n+2) {
	margin-left: 5.75%;
}
.contents--top01--clmBox .clmBox--content:first-child {
	width: 21.5%;
}
.contents--top01--clmBox .clmBox--content:nth-child(2) {
	width: 26.5%;
}
.contents--top01--clmBox .clmBox--content:last-child {
	width: 24.5%;
}
.contents--top01--clmBox .number {
	width: auto;
	display: inline-block;
	font-size: 20px;
	color:#b9af8f;
	padding-bottom: 14px;
	margin: 0 0 27px;
	position: relative;
}
.contents--top01--clmBox .number:before {
	content: '';
	width: 100%;
	height: 1px;
	background-color: #b9af8f;
	position: absolute;
	left: 0;
	bottom: 0;
}
.contents--top01--clmBox .text {
	transform: scale(0.97,1);
	transform-origin: top left;
	width: 103.0927835052%;
}
.contents--top01--clmBox .text .Mont {
	font-weight: 400;
}
@media screen and (max-width: 768px){
	.contents--top01 .wrap1440{
		padding:0;
	}
	.contents--top01 .contents--top01--img {
		top: -130px;
	}
	.contents--top01 .contents--top01--img .caption {
		position: absolute;
		right: 5px;
		top: 2px;
	}
	.contents--top01--bgBox {
		width: 80%;
		padding: 0;
		margin-top: 130px;
		background: none;
	}
	.contents--top01--bgBox__black {
		top: 0;
	}
	.contents--top01--bgBox .topheadline {
		width: 80%;	
		height: 100%;
		padding: 40px 30px 30px;
	}
	/* contents--top01--clmBox */
	.contents--top01--clmBox {
		width: 85%;
		margin:30px auto 0;
	}
	.contents--top01--clmBox .clmBox--content:nth-child(n+2) {
		margin-left: 0;
		margin-top: 30px;
	}
	.contents--top01--clmBox .clmBox--content:first-child {
		width: 100%;
	}
	.contents--top01--clmBox .clmBox--content:nth-child(2) {
		width: 100%;
	}
	.contents--top01--clmBox .clmBox--content:last-child {
		width: 100%;
	}
	.contents--top01--clmBox .number {
		padding-bottom: 5px;
		margin: 0 0 15px;
	}

}


.contents--bg {
	width: 100%;
	position: relative;
}
.contents--bg:before {
	content: '';
	width: 100%;
	height: 100%;
	background: url(../imgs/bg-01.png) no-repeat center 340px;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
	text-align: center;
	opacity: 0;
}
.contents--bg.fadein:before {
	-webkit-animation: cntBg 2.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
	animation: cntBg 2.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes cntBg {
	100% {
		opacity: 1;
	}
}
@keyframes cntBg {
	100% {
		opacity: 1;
	}
}

@media screen and (max-width: 768px){
	.contents--bg:before {
		background: url(../imgs/bg-01.png) no-repeat center bottom;
		background-size: 100%;
	}

}

/*-- contents--top02 ------------------------*/
.contents--top02 .wrap1440 {
	padding-right: 6.944444444444445%;
	box-sizing: border-box;
	position: relative;
}
.contents--top02--ttl {
	font-family: 'Playfair Display', serif;
	font-size: 140px;
	line-height: 1;
	letter-spacing: 0.05em;
	color: #333333;
	display: block;
	-ms-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    transform:rotate(90deg);
    position: absolute;
    right: -12px;
    top: 180px;
}
.contents--top02--ttl small {
	font-size: 100px;
}
.contents--top02--clmBox {
	position: relative;
}
.contents--top02--img {
	width: 57.362%;
	position: relative;
	text-align: center;
}
.contents--top02--img:before {
	content: '';
	width: 93.872%;
	height: 360px;
	background: #333333;
	position: absolute;
	left: 0;
	top: 60px;

	opacity: 0;
}
.contents--top02--img:after {
	content: '';
	width: 94%;
	height: 360px;
	border: solid 1px #333;
	position: absolute;
	right: 0;
	top: 0;

	opacity: 0;
}
.contents--top02--img.start:before {	
	-webkit-animation: iphoneBg 1.5s ease 1.0s 1 forwards;/*表示時間+start時間*/
	animation: iphoneBg 1.5s ease 1.0s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes iphoneBg {
  100% {
  	opacity: 1;
  }
}
@keyframes iphoneBg {
  100% {
  	opacity: 1;
  }
}
.contents--top02--img.start:after {	
	-webkit-animation: iphoneLine 1.5s ease 1s 1 forwards;/*表示時間+start時間*/
	animation: iphoneLine 1.5s ease 1s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes iphoneLine {
  100% {
  	left: auto;
	right: 0;
	top: 105px;
  	opacity: 1;
  }
}
@keyframes iphoneLine {
  100% {
  	left: auto;
	right: 0;
	top: 105px;
  	opacity: 1;
  }
}
.contents--top02--img .iphoneBox {
	position: relative;
	z-index: 2;
}
.contents--top02--img .iphoneBox .iphoneBox--iphone {
	/*width: 277px;*/
	width: 31.44736842105263%;
	margin:0 auto;
	position: relative;
	filter: drop-shadow(-5px 10px 10px rgba(0,0,0,.5));
}
.contents--top02--img .iphoneBox .iphoneBox--movie {
	width: 87.86610878661088%;
	height: 95.62139917695474%;
	border-radius: 25px;
	overflow: hidden;
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	margin: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.contents--top02--img .iphoneBox .iphoneBox--movie video {
	height: 100%;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
}
.contents--top02--img .caption {
	position: absolute;
	right: 45px;
	bottom: 40px;
}
/* contents--top02--txt */
.contents--top02--txt {
	width: 42.638%;
	padding:120px 0 0 5.7%;
	box-sizing: border-box;
}
.contents--top02--txt .cvBtn--request {
	margin: 70px 0 0 auto;
}
@media screen and (max-width: 768px){
	.contents--top02 .wrap1440 {
		padding: 0;
	}	
	.contents--top02--ttl {
		font-size: 94px;
		right: -73px;
	    top: 70px;
	}
	.contents--top02--ttl small {
		font-size: 64px;
	}
	.contents--top02--img {
		width: 100%;
		margin-top: 70px;
	}
	.contents--top02--img:before {
		width: 100%;
		height: 210px;
	}
	.contents--top02--img:after {
		content: none;
	}
	.contents--top02--img .iphoneBox {
		width: 50%;
		margin:0 auto;
	}
	.contents--top02--img .iphoneBox .iphoneBox--iphone {
		width: 90%;
	}
	.contents--top02--img .iphoneBox .iphoneBox--movie {
		height: 94.62139917695474%;
		border-radius: 30px;		
		z-index: 2;
	}
	.contents--top02--img .caption {
		position: static;
		padding-right: 20px;
	}
	/* contents--top02--txt */
	.contents--top02--txt {
		width: 100%;
		padding:50px 20px 0 40px;
	}
}
@media screen and (max-width: 441px){
	.contents--top02--img .iphoneBox .iphoneBox--movie {
		border-radius: 20px;
	}
}

/*-- contents--top03 ------------------------*/
.contents--top03 {
	text-align: center;
	padding:175px 0 290px;
	position: relative;
}
.contents--top03 .wrap {
	position: relative;
	z-index: 2;
}
.contents--top03 .content--enttl {
	font-size: 14px;
	margin-bottom: 30px;
}
@media screen and (max-width: 768px){
	.contents--top03 {
		padding:150px 0 170px;
	}
	.contents--top03 .contents--top03--bg {
		background: url(../imgs/bg-01.png) no-repeat center;
		background-size: 138%;
	}
}


/*-- contents--top04 ------------------------*/
.contents--top04 {
	padding: 0 0 185px;
}
.contents--top04 .wrap1440 {
	position: relative;
	padding: 135px 0 95px 11.805555555555555%;
	box-sizing: border-box;
	background: #333333;
}
.contents--top04 .contents--top04--ttl {
	font-size: 170px;
	font-family: 'Playfair Display', serif;
	background-image: url(../imgs/bg-shibuya.png);
	background-attachment: fixed;
	background-position: center;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: absolute;
	left: 100px;
	top: -200px;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.contents--top04 .contents--top04--ttl {
		background-image: none;
		color: #333;
	}
}
.contents--top04 .topheadline.topheadline--01 {
	font-size: 34px;
}
.contents--top04 .contents--top04--img01 {
	width: 470px;
	position: absolute;
	right: 0;
	top: -75px;
}
.contents--top04 .contents--top04--img02 {
	width: 370px;
	position: absolute;
	right: 16.666666666666664%;
	bottom: -205px;	
}
.contents--top04 .btn--more {
	margin-left: -60px;
}
@media screen and (max-width: 768px){
	.contents--top04 {
		padding: 0;
	}
	.contents--top04 .wrap1440 {
		padding: 0 0 50px;
		box-sizing: border-box;
	}
	.contents--top04 .contents--top04--ttl {
		background-attachment: initial;
		background-position: center 80%;
		font-size: 70px;
		left: 0;
		top: -80px;
	}
	.contents--top04 .topheadline.topheadline--01 {
		font-size: 24px;
	}
	.contents--top04 .contents--top04--img01 {
		width: 100%;
		height:300px;
	    position: relative;
	    overflow: hidden;
		top: auto;
	}
	.contents--top04 .contents--top04--img01 img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.contents--top04 .contents--top04--img02 {
		display: none;
		width: 60%;
		position: static;
	}
	.contents--top04 .contents--top04--txt {
		padding:50px 30px 0;
	}
	.contents--top04 .btn--more {
		margin-left: -40px;
	}
}

/* btn--more */
.btn--more {
	width: 100%;
	margin-top: 85px;
	position: relative;
}
.btn--more a {
	color: #fff;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.25em;
	padding-left: 70px;
	position: relative;
	overflow: hidden;
}
.btn--more a:before {
	content: '';
	width: 45px;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 0;
	top: 0.5em;
}
.btn--more a i.Mont {
    letter-spacing: 0.25em;
	position: relative;
	bottom: 0;
	transition: .6s;
}
.btn--more a i.jp {
	opacity: 0;
	position: absolute;
	left: 70px;
	top: -1em;
	transition: .6s;
}
.btn--more a:hover i.Mont {
	opacity: 0;
	bottom: -1em;
}
.btn--more a:hover i.jp {
	opacity: 1;
	top: 0;

	-webkit-animation: btnMore 1.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
	animation: btnMore 1.0s ease 0.2s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes btnMore {
	100% {
		color: #b9af8f;
	}
}
@keyframes btnMore {
	100% {
		color: #b9af8f;
	}
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.btn--more a:hover i.jp {
		top: 3px;
	}
}
@media screen and (max-width: 768px){
	.btn--more {
		margin-top: 50px;
	}
	.btn--more a:before {
		height: 0.5px;
	}
}


/*-- contents--top05 ------------------------*/
.contents--top05 {
	margin-top: 100px;
}
.contents--top05 .wrap1240 {
	padding-top: 120px;
	position: relative;
}
.contents--top05--clmBox .contents--top05--txt {
	width: 46.935483870967744%;
	padding:65px 60px 35px;
	margin-right: 70px;
	box-sizing: border-box;
	border:solid 1px #333333;
	position: relative;
	z-index: 2;
}
.contents--top05--clmBox .contents--top05--txt:before {
	content: '';
	width: 100%;
	height: 100%;
	border:solid 1px #333333;
	position: absolute;
	left: 6px;
	top: 6px;	
}
.contents--top05 .btn--more {
	display: flex;
	flex-direction: row-reverse;
	margin-left: 105px;
}
.contents--top05--clmBox .contents--top05--img {
	position: absolute;
	left: 70px;
	top: 0;
	transform: translateY(50px);
	transition: .6s;
}
.contents--top05--clmBox .contents--top05--img.scrUp {
	transform: translateY(0);
}
.contents--top05--clmBox .contents--top05--img.hover {	
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}
@media screen and (max-width: 768px){
	.contents--top05 {
		margin-top: 0;
	}
	.contents--top05 .wrap1240 {
		padding-top: 220px;
	}
	.contents--top05--clmBox .contents--top05--txt {
		width: 100%;
		padding:40px 30px 30px;
		margin-right: -40px;
	}
	.contents--top05--clmBox .contents--top05--img {
		width:80%;
	    height:250px;
	    overflow: hidden;
	    left: 0;
	}
	.contents--top05--clmBox .contents--top05--img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.contents--top05--clmBox .contents--top05--img .caption {
		padding-left: 5px;
	}
	.contents--top05 .btn--more {
		flex-direction: row;
		margin-left: -60px;		
	}
}
@media screen and (max-width: 441px){
	.contents--top05--clmBox .contents--top05--img img {
		width: auto;
	    height: 100%;
	}
}



/*-- contents--top06 ------------------------*/
.contents--top06 {
	margin-top: 100px;
}
.contents--top06 .wrap1240 {
	padding-bottom: 120px;
	position: relative;
}
.contents--top06--clmBox .contents--top06--txt {
	width: 46.935483870967744%;
	padding:65px 60px 35px;
	margin-right: 70px;
	box-sizing: border-box;
	border:solid 1px #333333;
	position: relative;
	z-index: 2;
}
.contents--top06--clmBox .contents--top06--txt:before {
	content: '';
	width: 100%;
	height: 100%;
	border:solid 1px #333333;
	position: absolute;
	left: 6px;
	top: 6px;	
}
.contents--top06 .btn--more {
	margin-left: -90px;
}
.contents--top06--clmBox .contents--top06--img {
	position: absolute;
	right: 70px;
	top: 60px;
	transform: translateY(0);
	transition: .6s;
}
.contents--top06--clmBox .contents--top06--img.scrUp {
	transform: translateY(50px);
}
.contents--top06--clmBox .contents--top06--img.hover {	
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}
@media screen and (max-width: 768px){
	.contents--top06 .wrap1240 {
		padding-top: 220px;
		padding-bottom: 0;
	}
	.contents--top06--clmBox .contents--top06--txt {
		width: 100%;
		padding:40px 30px 30px;
		margin-top: 50px;
		margin-right: 0;
		margin-left: -40px;
	}
	.contents--top06--clmBox .contents--top06--img {
		width:80%;
	    height:250px;
	    overflow: hidden;
	    right: 0;
	    top: 0;
	}
	.contents--top06--clmBox .contents--top06--img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.contents--top06--clmBox .contents--top06--img .caption {
		padding-right: 5px;
	}
	.contents--top06 .btn--more {
		margin-left: 74%;		
	}
}
@media screen and (max-width: 441px){
	.contents--top06--clmBox .contents--top06--img img {
		width: auto;
	    height: 100%;		
	}
}



/*-- contents--top07 ------------------------*/
.contents--top07 {
	margin-top: 230px;
}
.contents--top07 .wrap1240 {
	padding-top: 80px;
	position: relative;
}
.contents--top07--clmBox .contents--top07--txt {
	width: 46.935483870967744%;
	padding:65px 60px 35px;
	margin-right: 70px;
	box-sizing: border-box;
	border:solid 1px #333333;
	position: relative;
	z-index: 2;
}
.contents--top07--clmBox .contents--top07--txt:before {
	content: '';
	width: 100%;
	height: 100%;
	border:solid 1px #333333;
	position: absolute;
	left: 6px;
	top: 6px;	
}
.contents--top07 .btn--more {
	display: flex;
	flex-direction: row-reverse;
	margin-left: 105px;
}
.contents--top07--clmBox .contents--top07--img {
	position: absolute;
	left: 70px;
	top: 0;
	transform: translateY(50px);
	transition: .6s;
}
.contents--top07--clmBox .contents--top07--img.scrUp {
	transform: translateY(0);
}
.contents--top07--clmBox .contents--top07--img.hover {	
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
}
@media screen and (max-width: 768px){
	.contents--top07 {
		margin-top: 100px;
	}
	.contents--top07 .wrap1240 {
		padding-top: 220px;
	}
	.contents--top07--clmBox .contents--top07--txt {
		width: 100%;
		padding:40px 30px 30px;
		margin-right: -40px;
	}
	.contents--top07--clmBox .contents--top07--img {
		width:80%;
	    height:250px;
	    overflow: hidden;
	    left: 0;
	    top: 0;
	}
	.contents--top07--clmBox .contents--top07--img img {
		width: 100%;
	    height: auto;
	    max-width: inherit; /* 初期状態にリセット */
	    position: absolute;
	    top:50%; /* または200px(heightの半分) */
	    left: 50%; /* この値を変更すると左右に位置をずらせる */
	    transform: translate(-50%, -50%);
	}
	.contents--top07--clmBox .contents--top07--img .caption {
		padding-left: 5px;
	}
	.contents--top07 .btn--more {
		flex-direction: row;
		margin-left: -60px;		
	}
}
@media screen and (max-width: 441px){
	.contents--top07--clmBox .contents--top07--img img {
		width: auto;
	    height: 100%;		
	}
}

/*-- contents--top08 ------------------------*/
.contents--top08 {
	margin-top: 160px;
}
.contents--top08 .topheadline.topheadline--03 {
	display: flex;
	justify-content: center;
}
.contents--top08 .topheadline.topheadline--03 span {
	opacity: 0;
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(1){
	-webkit-animation: hTtlAnimation 1.2s ease 0.6s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.6s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(2){
	-webkit-animation: hTtlAnimation 1.2s ease 0.67s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.67s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(3){
	-webkit-animation: hTtlAnimation 1.2s ease 0.74s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.74s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(4){
	-webkit-animation: hTtlAnimation 1.2s ease 0.81s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.81s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(5){
	-webkit-animation: hTtlAnimation 1.2s ease 0.88s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.88s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(6){
	-webkit-animation: hTtlAnimation 1.2s ease 0.95s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 0.95s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(7){
	-webkit-animation: hTtlAnimation 1.2s ease 1.02s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.2s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(8){
	-webkit-animation: hTtlAnimation 1.2s ease 1.09s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.09s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(9){
	-webkit-animation: hTtlAnimation 1.2s ease 1.16s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.16s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(10){
	-webkit-animation: hTtlAnimation 1.2s ease 1.23s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.23s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(11){
	-webkit-animation: hTtlAnimation 1.2s ease 1.3s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.3s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(12){
	-webkit-animation: hTtlAnimation 1.2s ease 1.37s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.37s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(13){
	-webkit-animation: hTtlAnimation 1.2s ease 1.44s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.44s 1 forwards;/*表示時間+start時間*/		
}
.contents--top08 .topheadline.topheadline--03.aos-animate span:nth-child(14){
	-webkit-animation: hTtlAnimation 1.2s ease 1.51s 1 forwards;/*表示時間+start時間*/
	animation: hTtlAnimation 1.2s ease 1.51s 1 forwards;/*表示時間+start時間*/		
}
@-webkit-keyframes hTtlAnimation {
  100% {
    opacity: 1;
  }
}
@keyframes hTtlAnimation {
  100% {
    opacity: 1;
  }
}
.contents--top08 .contents--top08--clmBox {
	margin-top: 60px;
}
.contents--top08 .contents--top08--clmBox .clmBox--content:nth-child(2) {
	margin-top: 50px;
}
.contents--top08 .contents--top08--clmBox .clmBox--content:nth-child(3) {
	margin-top: 100px;
}
.contents--top08 .contents--top08--clmBox .contents--top08--clmBox--img {
	margin-bottom: 35px;
	transition: .6s;
}
.contents--top08 .contents--top08--clmBox .contents--top08--clmBox--img.hover {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);	
}
.contents--top08 .btn--more {
	display: flex;
	flex-direction: row-reverse;
	margin-top: 25px;
}
@media screen and (max-width: 768px){
	.contents--top08 {
		margin-top: 120px;
	}
	.contents--top08 .contents--top08--clmBox {
		margin-top: 20px;
	}
	.contents--top08 .contents--top08--clmBox .clmBox--content:nth-child(2) ,
	.contents--top08 .contents--top08--clmBox .clmBox--content:nth-child(3) {
		margin-top: 70px;
	}
	.contents--top08 .contents--top08--clmBox .contents--top08--clmBox--img {
		margin-bottom: 20px;
	}
	.contents--top08 .contents--top08--clmBox .contents--top08--clmBox--img img {
		width: 100%
	}
}



/*--- aos -----------------*/
/* anchor：アニメーションの起点用 */
[data-aos="anchor"]{
}
[data-aos="anchor"].aos-animate{
}

/*slowfade*/
[data-aos="slowfade"]{
	opacity: 0;
}
[data-aos="slowfade"].aos-animate{
	-webkit-animation: slowfade 4.0s ease 0.6s 1 forwards;/*表示時間+start時間*/
	animation: slowfade 4.0s ease 0.6s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes slowfade {
	100% {
		opacity: 1;
	}
}
@keyframes slowfade {
	100% {
		opacity: 1;
	}
}


/*blur*/
[data-aos="blur"]{
	opacity:0;
	-webkit-filter: blur(5px);
	filter: blur(5px);
	/*transform: scale(1.1);*/
}
[data-aos="blur"].aos-animate {
  -webkit-animation: blurAnim 3.0s ease 0.8s 1 forwards;/*表示時間+start時間*/
	animation: blurAnim 3.0s ease 0.8s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes blurAnim {
	50% {
		opacity:1;		
	}
	100% {
		opacity:1;	
		-webkit-filter: blur(0px);
		filter: blur(0px);
		/*transform: scale(1.0);*/
	}
}
@keyframes blurAnim {
	50% {
		opacity:1;		
	}
	100% {
		opacity:1;	
		-webkit-filter: blur(0px);
		filter: blur(0px);
		/*transform: scale(1.0);*/
	}
}
@media only screen and (max-width:736px) {
	[data-aos="blur"]{
		-webkit-filter: blur(0);
		filter: blur(0);
		/*transform: scale(1);*/
	}	
}
[data-aos="numberA"]{
	opacity: 0;	
	transform: translateY(-0.5em);
}
[data-aos="numberA"].aos-animate {
  -webkit-animation: numberA 0.6s ease 0.6s 1 forwards;/*表示時間+start時間*/
	animation: numberA 0.6s ease 0.6s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes numberA {
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes numberA {
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
[data-aos="numberB"]{
	opacity: 0;
	transform: translateY(0.5em);
}
[data-aos="numberB"].aos-animate {
  -webkit-animation: numberB 0.6s ease 0.6s 1 forwards;/*表示時間+start時間*/
	animation: numberB 0.6s ease 0.6s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes numberB {
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes numberB {
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
/* enttl */
[data-aos="enttlAnim"]{
	opacity: 0;
}
[data-aos="enttlAnim"].aos-animate {
  -webkit-animation: enttlAnim 0.6s ease 0.8s 1 forwards;/*表示時間+start時間*/
	animation: enttlAnim 0.6s ease 0.8s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes enttlAnim {
	100% {
		opacity: 1;
	}
}
@keyframes enttlAnim {
	100% {
		opacity: 1;
	}
}
/*fastupIn*/
[data-aos="fastupIn"]{
	opacity: 0;
	transform: translateY(50px);
}
[data-aos="fastupIn"].aos-animate{
	-webkit-transition: 1s cubic-bezier(0, 0.4, 0.6, 1) 1.8s;
    transition: 1s cubic-bezier(0, 0.4, 0.6, 1) 1.8s;

	-webkit-animation: fastupIn 1.6s ease 1.2s 1 forwards;/*表示時間+start時間*/
	animation: fastupIn 1.6s ease 1.2s 1 forwards;/*表示時間+start時間*/
}
@-webkit-keyframes fastupIn {
	80% {
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes fastupIn {
	80% {
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}