@charset "utf-8";
/**
 *.l-main
 *  ├─.l-section
 *  │ ├─.obj-container
 *  │ │  スリップオブジェクト群 (js で生成)
 *  │ ├─.l-section_container
 *  │ │  セクションの内容 (左半分と右半分は js で生成)
 *  │ └─.l-bg
 *  │    二等分背景色
 *  └─.js-effect
 *     グラデーションの帯群 (js で生成)
 */

.p-home .l-section {
	z-index: 1;
	position: relative;
	margin: 0 auto;
	padding-top: 160px;
	padding-bottom: 160px;
}

/* :::::: 左半分と右半分とオリジナル :::::: */
.js-bisection.transiency {
	pointer-events: none;
	position: absolute;
	top: 0;
}
.js-bisection.transiency.-d1 {
	left: 0;
	clip-path: polygon(0 0, calc(50% + 1px) 0, calc(50% + 1px) 100%, 0 100%);
}
.js-bisection.transiency.-d2 {
	right: 0;
	clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);
}
.js-bisection.original {
	color: transparent;
}

/**
 * TANKYU YOURSELF
 -------------------------------------------------- */
.l-keyvisual {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	min-height: 480px;
}
.l-keyvisual .l-section_container {
	width: auto;
}
.l-keyvisual .js-bisection.transiency.-d2 {
	color: white;
}

.l-keyvisual .c-title .t:last-child {
	margin-top: 64px;
}

@media screen and (max-width: 1024px) {
	.js-sc-wrap:not(.js-fixed) .l-keyvisual {
		padding-top: 50vh;
		padding-bottom: 20px;
	}
}
@media screen and (max-width: 767px) {
	.l-keyvisual .c-title .t:first-child {
		width: calc(559px / 2);
	}
	.l-keyvisual .c-title .t:last-child {
		width: calc(603px / 2);
		margin-top: 32px;
	}
}
@media screen and (max-width: 374px) {
	.l-keyvisual .c-title .t:first-child {
		width: calc(559px / 2.8);
	}
	.l-keyvisual .c-title .t:last-child {
		width: calc(603px / 2.8);
	}
}


/**
 * CONCEPT
 -------------------------------------------------- */
/*.js-fixed .p-home .l-concept {
	padding-bottom: 240px;
}*/
@media screen and (max-width: 1024px) {
	.js-sc-wrap.js-fixed .p-home .l-concept {
		padding-top: 48vh;
	}
	.js-sc-wrap:not(.js-fixed) .p-home .l-concept {
		padding-top: 80vh;
	}
}

.l-concept .l-section_container {
	max-width: 600px;
}
.l-concept .js-bisection.transiency.-d1 {
	color: white;
}

.l-concept p {
	margin-top: 24px;
	text-align: center;
}
.c-concept {
	margin-top: 64px;
}

@media screen and (max-width: 767px) {
	.l-concept .c-title .t {
		width: calc(558px / 2);
	}
}
@media screen and (max-width: 374px) {
	.l-concept .c-title .t {
		width: calc(558px / 2.8);
	}
}
/* inview */
.c-concept p.js-inview.anima {
	transition: opacity .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.c-concept p.js-inview.anima:not(.in-view) {
	transition-duration: .1s;
}
.c-concept p.js-inview:not(.in-view) {
	opacity: 0;
	transform: scale(.94);
}


/**
 * PROJECT
 -------------------------------------------------- */
.js-fixed .p-home .l-project {
	padding-bottom: 360px;
}
@media screen and (max-width: 1024px) {
	.js-sc-wrap.js-fixed .p-home .l-project {
		padding-top: 48vh;
	}
	.js-sc-wrap:not(.js-fixed) .p-home .l-project {
		padding-top: 80vh;
	}
}

.l-project .l-section_container {
	max-width: 760px;
}
html:not(.isTouch) .l-project .c-button {
	z-index: 1;
	position: relative;
	border-color: black;
	transition: color .3s;
}
html:not(.isTouch) .l-project .c-button::after {
	content: "";
	z-index: -1;
	position: absolute;
	top: -2px;
	left: -2px;
	width: calc(100% + 4px);
	height: calc(100% + 4px);
	background: black;
	transform-origin: 0 0;
	transition: transform .3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .l-project .c-button:not(:hover)::after {
	transform: scaleY(0);
	transform-origin: 100% 100%;
}
html:not(.isTouch) .l-project .c-button:hover {
	color: white;
}

/* :::::: プロジェクト一覧 :::::: */
.c-project {
	margin-top: 64px;
}
.c-project_item:not(:first-child) {
	margin-top: 40px;
}
.c-project_item a {
	align-items: center;
}
.c-project .post_photo .spacer {
	padding-bottom: calc(220% / 4.4);
}
.c-project .post_date time,
.c-project .post_excerpt span {
	position: relative;
	left: 4px;
}
.c-project .post_date time {
	padding: 2px 0;
}
.c-project .post_excerpt span {
	padding: 4px 0;
}

@media screen and (max-width: 767px) {
	.l-project .c-title .t {
		width: calc(521px / 2);
	}
}
@media screen and (max-width: 567px) {
	.c-project .post_text {
		margin-top: -10px;
	}
	.c-project .post_excerpt {
		margin-top: 16px;
	}
	.c-project .post_date time,
	.c-project .post_excerpt span {
		background: #fbf355;
	}
	.c-project .post_date time {
		box-shadow: -4px 0 0 #fbf355, 4px 0 0 #fbf355;
	}
	.c-project .post_excerpt span {
		box-shadow: -4px 0 0 #fbf355, 1em 0 0 #fbf355;
	}
}
@media screen and (max-width: 374px) {
	.l-project .c-title .t {
		width: calc(521px / 2.8);
	}
}
@media screen and (min-width: 568px) {
	.c-project .c-post_item a {
		display: flex;
	}
	.c-project .post_photo {
		flex-basis: 55.265%;
	}
	.c-project .post_text {
		flex-basis: calc(100% - 55.265% - 40px);
		margin-left: 40px;
	}
	.c-project .post_excerpt {
		margin-top: 24px;
	}
	.c-project .post_date time,
	.c-project .post_excerpt span {
		color: white;
		background: black;
	}
	.c-project .post_date time {
		box-shadow: -4px 0 0 black, 4px 0 0 black;
	}
	.c-project .post_excerpt span {
		box-shadow: -4px 0 0 black, 1em 0 0 black;
	}
}


/**
 * MESSAGE
 -------------------------------------------------- */
/*.js-fixed .p-home .l-message {
	padding-bottom: 320px;
}*/
@media screen and (max-width: 1024px) {
	.js-sc-wrap.js-fixed .p-home .l-message {
		padding-top: 64vh;
	}
	.js-sc-wrap:not(.js-fixed) .p-home .l-message {
		padding-top: 72vh;
	}
}

.l-message .l-section_container {
	max-width: 600px;
}
.l-message .js-bisection.transiency.-d2 {
	color: white;
}
.l-message p {
	margin-top: 24px;
}

.c-message {
	margin-top: 64px;
}

@media screen and (max-width: 767px) {
	.l-message .c-title .t {
		width: calc(532px / 2);
	}
}
@media screen and (max-width: 374px) {
	.l-message .c-title .t {
		width: calc(532px / 2.8);
	}
}
/* inview */
.c-message p.js-inview.anima {
	transition: opacity .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.c-message p.js-inview.anima:not(.in-view) {
	transition-duration: .1s;
}
.c-message p.js-inview:not(.in-view) {
	opacity: 0;
	transform: scale(.94);
}


/**
 * NEWS
 -------------------------------------------------- */
/*.js-fixed .p-home .l-news {
	padding-bottom: 40px;
}*/
@media screen and (max-width: 1024px) {
	.js-sc-wrap.js-fixed .p-home .l-news {
		padding-top: 64vh;
	}
	.js-sc-wrap:not(.js-fixed) .p-home .l-news {
		padding-top: 56vh;
	}
}

.l-news .l-section_container {
	max-width: 960px;
}
.l-news .js-bisection.transiency.-d1 {
	color: white;
}
.l-news .js-bisection.transiency.-d1 .c-button {
	border-color: white !important;
}
.l-news .js-bisection.transiency.-d2 .c-button {
	border-color: black !important;
}
.l-news .js-bisection.original .c-button {
	border-color: transparent !important;
}
html:not(.isTouch) .l-news .c-button {
	z-index: 1;
	position: relative;
	transition: color .3s;
}
html:not(.isTouch) .l-news .c-button::after {
	content: "";
	z-index: -1;
	position: absolute;
	top: -2px;
	left: -2px;
	width: calc(100% + 4px);
	height: calc(100% + 4px);
	background: white;
	transform-origin: 100% 0;
	transition: transform .3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .l-news .c-button:not(:hover)::after {
	transform: scaleY(0);
	transform-origin: 0 100%;
}
html:not(.isTouch) .l-news .c-button:hover {
	color: black;
}

/* :::::: ニュース一覧 :::::: */
.c-news {
	margin-top: 64px;
}
.c-news_item {
	border-bottom: 1px solid currentcolor;
}
.c-news_item a {
	padding: 20px 0;
}
.c-news .post_photo .spacer {
	padding-bottom: calc(105% / 2);
}
.c-news .post_excerpt {
	font-size: 1.3rem;
}

@media screen and (max-width: 767px) {
	.l-news .c-title .t {
		width: calc(351px / 2);
	}
	.c-news .post_text {
		margin-top: 12px;
	}
}
@media screen and (max-width: 374px) {
	.l-news .c-title .t {
		width: calc(351px / 2.8);
	}
	.c-news_item:first-child {
		border-top: 1px solid currentcolor;
	}
}
@media screen and (min-width: 375px) {
	.c-news {
		display: flex;
		flex-wrap: wrap;
	}
	.c-news_item {
		flex-basis: calc(50% - 12px);
	}
	.c-news_item:nth-child(2n) {
		margin-left: 24px;
	}
	.c-news_item:nth-child(-n+2) {
		border-top: 1px solid currentcolor;
	}
}
@media screen and (min-width: 568px) {
	.c-news_item {
		flex-basis: calc(50% - 24px);
	}
	.c-news_item:nth-child(2n) {
		margin-left: 48px;
	}
	.c-news_item,
	.c-news_item:nth-child(-n+2) {
		border-width: 2px;
	}
	.c-news_item a {
		padding: 40px 0;
	}
}
@media screen and (min-width: 768px) {
	.c-news .c-post_item a {
		display: flex;
	}
	.c-news .post_photo {
		flex-basis: 50%;
		max-width: 200px;
	}
	.c-news .post_text {
		flex-basis: 50%;
		display: flex;
		flex-direction: column;
		margin-left: 20px;
	}
	.c-news .post_date {
		flex-grow: 1;
	}
}


/**
 * INSTAGRAM
 -------------------------------------------------- */
/*.js-fixed .p-home .l-instagram {
}*/
.l-instagram .l-section_container {
	max-width: 1000px;
}
.c-instagram {
	display: flex;
	flex-wrap: wrap;
	margin-top: 64px;
}
.c-instagram_item .spacer {
	display: block;
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 100%;
}
.c-instagram_item img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 767px) {
	.l-news .c-title .t {
		width: calc(772px / 2);
	}
}
@media screen and (max-width: 374px) {
	.l-news .c-title .t {
		width: calc(772px / 2.8);
	}
	.c-instagram_item {
		flex-basis: calc(33.33333% - 20px / 3);
	}
	.c-instagram_item:not(:nth-child(3n+1)) {
		margin-left: 10px;
	}
	.c-instagram_item:nth-child(n+4) {
		margin-top: 10px;
	}
}
@media screen and (min-width: 375px) and (max-width: 567px) {
	.c-instagram_item {
		flex-basis: calc(25% - 7.5px);
	}
	.c-instagram_item:not(:nth-child(4n+1)) {
		margin-left: 10px;
	}
	.c-instagram_item:nth-child(n+5) {
		margin-top: 10px;
	}
}
@media screen and (min-width: 568px) and (max-width: 767px) {
	.c-instagram_item {
		flex-basis: calc(25% - 15px);
	}
	.c-instagram_item:not(:nth-child(4n+1)) {
		margin-left: 20px;
	}
	.c-instagram_item:nth-child(n+5) {
		margin-top: 20px;
	}
}
@media screen and (min-width: 768px) {
	.c-instagram_item {
		flex-basis: calc(100% / 6 - 50px / 6);
	}
	.c-instagram_item:not(:nth-child(6n+1)) {
		margin-left: 10px;
	}
	.c-instagram_item:nth-child(n+7) {
		margin-top: 10px;
	}
}
@media screen and (min-width: 1025px) {
	.c-instagram_item {
		flex-basis: calc(100% / 6 - 100px / 6);
	}
	.c-instagram_item:not(:nth-child(6n+1)) {
		margin-left: 20px;
	}
	.c-instagram_item:nth-child(n+7) {
		margin-top: 20px;
	}
}
/* inview */
.c-instagram.js-inview.anima .c-instagram_item {
	transition: opacity .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.c-instagram.js-inview.anima:not(.in-view) .c-instagram_item {
	transition-duration: .1s;
	transition-delay: 0s !important;
}
.c-instagram.js-inview:not(.in-view) .c-instagram_item {
	opacity: 0;
	transform: scale(.94);
}
.c-instagram.js-inview.anima .c-instagram_item:nth-child(3)  { transition-delay: 0s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(2)  { transition-delay: .1s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(1)  { transition-delay: .2s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(6)  { transition-delay: .1s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(5)  { transition-delay: .2s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(4)  { transition-delay: .3s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(9)  { transition-delay: .2s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(8)  { transition-delay: .3s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(7)  { transition-delay: .4s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(12) { transition-delay: .3s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(11) { transition-delay: .4s; }
.c-instagram.js-inview.anima .c-instagram_item:nth-child(10) { transition-delay: .5s; }
@media screen and (min-width: 375px) {
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(4)  { transition-delay: 0s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(3)  { transition-delay: .1s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(2)  { transition-delay: .2s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(1)  { transition-delay: .3s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(8)  { transition-delay: .1s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(7)  { transition-delay: .2s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(6)  { transition-delay: .3s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(5)  { transition-delay: .4s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(12) { transition-delay: .2s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(11) { transition-delay: .3s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(10) { transition-delay: .4s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(9)  { transition-delay: .5s; }
}
@media screen and (min-width: 768px) {
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(6)  { transition-delay: 0s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(5)  { transition-delay: .1s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(4)  { transition-delay: .2s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(3)  { transition-delay: .3s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(2)  { transition-delay: .4s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(1)  { transition-delay: .5s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(12) { transition-delay: .1s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(11) { transition-delay: .2s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(10) { transition-delay: .3s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(9)  { transition-delay: .4s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(8)  { transition-delay: .5s; }
	.c-instagram.js-inview.anima .c-instagram_item:nth-child(7)  { transition-delay: .6s; }
}
