/*
 Theme Name:   fukugistudio
 Theme URI:    fukugistudio
 Description:  WordPress Theme for fukugistudio
 Author:       DONGURI
 Author URI:   https://www.don-guri.com/
 Template:     twentynineteen
 Version:      0.0.1
 Tags:         news, entertainment
 Text Domain:  twentynineteen
*/

@charset "utf-8";

/*! Mediaqueries
 * 
 * @media screen and (max-width: 1024px) {}
 * @media screen and (max-width: 767px) {}
 * @media screen and (max-width: 567px) {}
 * @media screen and (max-width: 374px) {}
 * 
 * @media screen and (min-width: 568px) and (max-width: 1024px) {}
 * 
 * @media screen and (min-width: 375px) {}
 * @media screen and (min-width: 568px) {}
 * @media screen and (min-width: 768px) {}
 * @media screen and (min-width: 1025px) {}
 -------------------------------------------------- */


/**
 * js-sc
 -------------------------------------------------- */
.js-sc-dummy {
	position: relative;
}
.js-sc-wrap.js-fixed {
	z-index: 1;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	/*overflow: hidden;*/
}
.js-sc-wrap[style],
.js-sc-slip[style] {
	will-change: transform;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}


/**
 * common
 -------------------------------------------------- */
.l-main {
	padding: 0 20px;
}
.l-page {
	max-width: 1040px;
	margin: 0 auto;
	padding-top: 100px;
}
@media screen and (min-width: 768px) {
	.l-page {
		padding-top: 200px;
	}
}

/* :::::: section :::::: */
.l-section {
	max-width: 1120px;
	margin: 0 auto;
	padding: 40px 0;
}
@media screen and (min-width: 768px) {
	.l-section {
		padding: 80px 0;
	}
}

/* :::::: page title :::::: */
.l-page_title {
	text-align: center;
	line-height: 1;
	font-weight: 500;
}
.l-page_title .main {
	color: #0c1114;
	font-size: 4rem;
	font-family: Cormorant, serif;
	font-weight: 400;
}
.l-page_title .sub {
	font-size: 1.2rem;
}
@media screen and (min-width: 768px) {
	.l-page_title .main {
		font-size: 8rem;
	}
}

/* :::::: title :::::: */
.c-title,
.c-title_s {
	line-height: 1.4;
}
.c-title {
	text-align: center;
}
.c-title .main,
.c-title_s .main {
	font-weight: 500;
	letter-spacing: .02em;
}
.c-title .main {
	font-size: 2.6rem;
}
.c-title_s .main {
	font-size: 1.8rem;
	margin-right: 8px;
}
.c-title .sub,
.c-title_s .sub {
	color: #505050;
	font-size: 1.2rem;
	font-family: Cormorant, serif;
	font-weight: 400;
}
@media screen and (min-width: 375px) {
	.c-title_s {
		display: flex;
		align-items: baseline;
	}
}
@media screen and (min-width: 768px) {
	.c-title .main {
		font-size: 3.2rem;
	}
}
@media screen and (min-width: 1025px) {
	.c-title_s .main {
		margin-right: 16px;
	}
}

/* :::::: lead :::::: */
.c-lead {
	font-size: 1.5rem;
	line-height: 2.1;
	letter-spacing: .1em;
}

/* :::::: more :::::: */
.c-more {
	display: inline-block;
	font-size: 2.1rem;
	line-height: 1.4;
	font-family: Cormorant, serif;
	font-weight: 400;
	letter-spacing: .1em;
}
.c-more,
.c-link {
	background: linear-gradient(currentcolor, currentcolor) left bottom / 100% 1px no-repeat;
	transition: background-size .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .c-more:hover,
html:not(.isTouch) .c-link:hover {
	background-position: right bottom;
	background-size: 0 1px;
}
/* inview */
.c-title.js-inview.anima,
.c-title_s.js-inview.anima,
.c-lead.js-inview.anima,
.c-more.js-inview.anima {
	transition: opacity 1.2s, transform 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.c-title.js-inview:not(.active),
.c-title_s.js-inview:not(.active),
.c-lead.js-inview:not(.active),
.c-more.js-inview:not(.active) {
	opacity: 0;
	transform: translateY(24px);
}


/**
 * background color
 -------------------------------------------------- */
.js-bg {
	z-index: -1;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: white;
}
.in-.js-bg {
	background: #fbfaf4;
}


/**
 * GALLERY
 -------------------------------------------------- */
.l-gallery .c-lead {
	max-width: 480px;
	margin: 48px auto 0;
}
@media screen and (min-width: 768px) {
	.l-gallery .c-lead {
		margin-top: 104px;
	}
}

/* :::::: gallery list :::::: */
.c-gallery_list {
	display: flex;
	flex-wrap: wrap;
	margin-left: -20px;
}
.c-gallery_item {
	flex-basis: calc(50% - 20px);
	margin: 20px 0 0 20px;
}
.c-gallery_item a {
	cursor: pointer;
}
.c-gallery_item .spacer {
	display: block;
	position: relative;
	height: 0;
	padding-bottom: 100%;
}
.c-gallery_item .spacer img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
@media screen and (min-width: 568px) {
	.c-gallery_item {
		flex-basis: calc(33.33333% - 20px);
	}
}
@media screen and (min-width: 768px) {
	.c-gallery_item {
		flex-basis: calc(25% - 40px);
	}
	.c-gallery_list {
		margin-left: -40px;
	}
	.c-gallery_item {
		margin: 40px 0 0 40px;
	}
}

/* :::::: hover effect :::::: */
html:not(.isTouch) .c-gallery_item a {
	display: block;
	overflow: hidden;
}
html:not(.isTouch) .c-gallery_item .spacer {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: transform 1.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .c-gallery_item a:hover .spacer {
	transform: scale(1.2);
	transition-duration: 1.2s;
}


/**
 * NEWS
 -------------------------------------------------- */
.l-news {
	max-width: 1040px;
}

/* :::::: category tab :::::: */
.c-category_tab {
	display: flex;
	justify-content: center;
	margin-top: 48px;
	font-size: 1.5rem;
	line-height: 1.4;
	font-family: Cormorant, serif;
	font-weight: 400;
}
.c-category_item {
	flex-basis: 150px;
}
.c-category_item:not(:first-child) {
	margin-left: 20px;
}
.c-category_item a {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 10px 0;
}
.c-category_item a::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	border-bottom: 1px solid currentcolor;
}
.c-category_item .is-select::after {
	border-width: 2px;
}
@media screen and (min-width: 768px) {
	.c-category_tab {
		margin-top: 104px;
	}
}

/* :::::: news list :::::: */
.c-news_list {
	margin-top: 40px;
}
.c-news_photo .spacer {
	display: block;
	position: relative;
	height: 0;
	padding-bottom: calc(220% / 3.2);
}
.c-news_photo .spacer img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.c-news_text {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	padding: 8px;
}
.c-news_date {
	color: #888;
	font-size: 1.1rem;
}
.c-news_category {
	order: -1;
	color: #454545;
	font-size: 1.3rem;
	font-family: Cormorant, serif;
	font-weight: 400;
}
.c-news_excerpt {
	flex-basis: 100%;
	margin-top: 4px;
	color: #505050;
	font-size: 1.5rem;
}
.c-news_list img {
	width: 100%;
}
@media screen and (max-width: 374px) {
	.l-page .c-news_item {
		margin-top: 20px;
	}
}
@media screen and (min-width: 375px) {
	.l-page .c-news_list {
		display: flex;
		flex-wrap: wrap;
	}
	.c-news_text {
		padding: 16px;
	}
}
@media screen and (min-width: 375px) and (max-width: 767px) {
	.l-page .c-news_item {
		flex-basis: calc(50% - 10px);
	}
	.l-page .c-news_item:nth-child(2n) {
		margin-left: 20px;
	}
	.l-page .c-news_item:nth-child(n+3) {
		margin-top: 20px;
	}
}
@media screen and (min-width: 768px) {
	.l-page .c-news_list {
		margin-top: 64px;
	}
	.l-page .c-news_item {
		flex-basis: calc(33.33333% - 80px / 3);
	}
	.l-page .c-news_item:not(:nth-child(3n+1)) {
		margin-left: 40px;
	}
	.l-page .c-news_item:nth-child(n+4) {
		margin-top: 40px;
	}
	.c-news_text {
		padding: 20px;
	}
	.c-news_excerpt {
		margin-top: 8px;
	}
}

/* :::::: hover effect :::::: */
html:not(.isTouch) .c-news_photo {
	overflow: hidden;
}
html:not(.isTouch) .c-news_photo .spacer {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: transform 1.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .c-news_item a:hover .c-news_photo .spacer {
	transform: scale(1.2);
	transition-duration: 1.2s;
}


/**
 * NEWS - SINGLE
 -------------------------------------------------- */
.l-article {
	padding: 100px 20px 0;
}
@media screen and (min-width: 768px) {
	.l-article {
		padding-top: 200px;
	}
}

/* :::::: header :::::: */
.l-article_category,
.l-article_date,
.l-article_eyecatch {
	max-width: 1120px;
	margin: 0 auto;
}
.l-article_title,
.l-article_content,
.l-article_footer {
	max-width: 600px;
	margin: 0 auto;
}
.l-article_category .main {
	margin-right: 16px;
	font-size: 2.1rem;
	font-family: Cormorant, serif;
	font-weight: 400;
}
.l-article_category .sub {
	color: #505050;
	font-size: 1rem;
}
.l-article_date {
	margin-top: 24px;
	color: #888;
	font-size: 1.2rem;
}
@media screen and (max-width: 767px) {
	.l-article_category {
		line-height: 1.4;
	}
	.l-article_category .sub {
		display: block;
	}
}
@media screen and (min-width: 768px) {
	.l-article_category {
		display: flex;
		align-items: baseline;
	}
}

/* :::::: footer :::::: */
.l-article_footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 120px;
}
.c-share,
.c-share_list {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.c-share_title {
	font-size: 1.3rem;
	font-weight: 400;
}
.c-share_list {
	margin-left: 16px;
	line-height: 1;
}
.c-share_item a {
	display: block;
	padding: 8px;
}
.c-share_item img {
	width: 24px;
}

/* :::::: article :::::: */
.l-article_eyecatch {
	margin: 32px -20px;
}
@media screen and (min-width: 768px) {
	.l-article_eyecatch {
		margin: 48px auto 56px;
	}
}

.l-article_title {
	margin-top: 48px;
	font-size: 2.1rem;
	line-height: 1.6;
	font-weight: 500;
}
.l-article_content {
	word-break: break-all;
}
.l-article_content h2,
.l-article_content h3 {
	font-weight: 600;
}
.l-article_content h3,
.l-article_content p {
	font-size: 1.5rem;
}
.l-article_content h2 {
	margin: 48px 0 24px;
	font-size: 1.8rem;
}
.l-article_content h3 {
	margin: 40px 0 24px;
}
.l-article_content p {
	margin: 24px 0;
}
.l-article_content a[href] {
	padding: .1em 0;
	background: linear-gradient(currentcolor, currentcolor) left bottom / 100% 1px no-repeat;
	transition: background-size .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .l-article_content a[href]:hover {
	background-position: right bottom;
	background-size: 0 1px;
}
.l-article_content li {
	margin-top: 16px;
}
.l-article_content li::before {
	content: "・";
}
@media screen and (min-width: 768px) {
	.l-article_title {
		font-size: 3rem;
	}
}


/**
 * プロフィール/フォトグラファーの実績
 -------------------------------------------------- */
.c-photographer_container {
	max-width: 1160px;
	padding: 20px;
	margin: 0 auto;
	background: white;
}
.c-photographer_container .c-title_s {
	margin-bottom: 24px;
}
.c-photographer_container {
	overflow: auto;
	/*height: 720px;*/
	max-height: calc(100vh - 40px);
}
.c-works_item img {
	max-width: 100%;
}
@media screen and (max-width: 767px) {
	.c-works {
		margin-top: 40px;
	}
}
@media screen and (min-width: 375px) and (max-width: 767px) {
	.c-profile {
		display: flex;
		flex-wrap: wrap;
	}
}
@media screen and (min-width: 768px) {
	.c-photographer_container {
		display: flex;
		justify-content: center;
		padding: 40px;
	}
	.c-profile {
		flex-basis: 24%;
	}
	.c-works {
		flex-basis: calc(76% - 40px);
		margin-left: 40px;
	}
	.c-photographer_container .c-title_s {
		margin-bottom: 40px;
	}
}
@media screen and (min-width: 1025px) {
	.c-photographer_container {
		padding: 60px;
	}
	.c-profile {
		flex-basis: 220px;
	}
	.c-works {
		flex-basis: calc(100% - 300px);
		margin-left: 80px;
	}
}

.c-profile_name {
	line-height: 1.4;
}
.c-profile_name .main {
	display: inline-block;
	font-size: 1.8rem;
	font-weight: 500;
}
.c-profile_name .sub {
	display: inline-block;
	font-size: 1rem;
	font-family: Cormorant, serif;
	font-weight: 400;
}
.c-profile_comment {
	font-size: 1.2rem;
}
@media screen and (max-width: 374px) {
	.c-profile_photo {
		float: right;
		max-width: 120px;
		margin-left: 20px;
	}
	.c-profile_name {
		margin-top: 12px;
	}
	.c-profile_comment {
		margin-top: 8px;
	}
}
@media screen and (min-width: 375px) and (max-width: 767px) {
	.c-profile .c-title_s {
		flex-basis: 100%;
	}
	.c-profile_photo {
		flex-basis: 40%;
	}
	.c-profile_text {
		flex-basis: calc(60% - 32px);
		align-self: flex-end;
		margin-left: 32px;
	}
	.c-profile_name .main {
		margin-right: 8px;
	}
	.c-profile_comment {
		margin-top: 8px;
	}
}
@media screen and (min-width: 768px) {
	.c-profile_name {
		margin-top: 16px;
	}
	.c-profile_name .main {
		display: block;
	}
	.c-profile_name .sub {
		display: block;
	}
	.c-profile_comment {
		margin-top: 16px;
	}
}

/**
 * flickity
 -------------------------------------------------- */
.flickity-enabled {
	position: relative;
	outline: 0;
	height: 100%;
}
.flickity-enabled.is-draggable {
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.flickity-enabled {
	width: 100%;
	height: 0;
	padding-bottom: calc(490% / 8.3);
}
@media screen and (max-width: 767px) {
	.flickity-enabled {
		width: calc(100% + 40px);
		height: calc(490vw / 8.3);
		margin-right: -20px;
		margin-left: -20px;
		padding: 0;
	}
	html:not(.isTouch) .flickity-enabled {
		height: calc(490vw / 8.3 + 40px);
		padding-bottom: 40px;
	}
}

/* :::::: viewport :::::: */
.flickity-viewport {
	position: relative;
	overflow: hidden;
	height: 100%;
	cursor: ew-resize;
}
.flickity-enabled .flickity-viewport {
	position: absolute;
	top: 0;
	width: 100%;
}

/* :::::: slider :::::: */
.flickity-slider {
	position: absolute;
	width: 100%;
	height: 100%;
}
.flickity-enabled.is-fade .flickity-slider {
	transform: none !important;
}

/* :::::: slider-item :::::: */
.flickity-enabled .flickity-slider > * {
	width: 100%;
}
.flickity-enabled.is-fade .flickity-slider > * {
	pointer-events: none;
	z-index: 0;
	left: 0 !important;
}
/* タッチデバイスではフェードでなくスライド */
.flickity-enabled:not(.is-fade) .flickity-slider > * {
	height: 0;
	margin-right: 8px;
	padding-bottom: calc(490% / 8.3);
}
.flickity-enabled.is-fade .flickity-slider > .is-selected {
	pointer-events: auto;
	z-index: 1;
}
.flickity-enabled .flickity-slider img {
	width: 100%;
}
.flickity-enabled:not(.is-fade) .flickity-slider img {
	position: absolute;
	top: 0;
	left: 0;
	height 100%;
}
@media screen and (max-width: 767px) {
	.flickity-enabled:not(.is-fade) .flickity-slider > * {
		width: calc(100% - 40px);
	}
}

/* :::::: prev-next-button :::::: */
.flickity-prev-next-button {
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	position: absolute;
	cursor: pointer;
	top: 0;
	width: 40px;
	height: 100%;
}
.flickity-prev-next-button.previous {
	left: -40px;
}
.flickity-prev-next-button.next {
	right: -40px;
}
.flickity-button-icon {
	width: 40px;
	height: 40px;
	fill: none;
	stroke: currentcolor;
	stroke-width: 2;
}
@media screen and (max-width: 767px) {
	html.isTouch .flickity-prev-next-button {
		display: none;
	}
	html:not(.isTouch) .flickity-prev-next-button {
		top: auto;
		bottom: 0;
		height: 40px;
	}
	html:not(.isTouch) .flickity-prev-next-button.previous {
		left: 0;
	}
	html:not(.isTouch) .flickity-prev-next-button.next {
		right: 0;
	}
}

/* :::::: counter :::::: */
.flickity-counter {
	position: absolute;
	font-size: 1.3rem;
	font-family: "Cormorant Infant", serif;
	font-weight: 400;
}
@media screen and (max-width: 374px) {
	.flickity-counter {
		bottom: 10px;
		left: calc(50% - 1.5em);
	}
}
@media screen and (min-width: 375px) {
	.flickity-counter {
		bottom: calc(100% + 24px);
		right: 20px;
	}
}
@media screen and (min-width: 768px) {
	.flickity-counter {
		bottom: calc(100% + 40px);
		right: 0;
	}
}
.flickity-counter .cur {
	margin-right: 8px;
}
.flickity-counter .total {
	margin-left: 8px;
}

/* :::::: page-dots :::::: */
.flickity-page-dots {
	list-style: none;
	display: flex;
	z-index: 3;
}
.flickity-page-dots .dot {
	cursor: pointer;
	counter-increment: item;
	font-size: 1.3rem;
	font-family: "Cormorant Infant", serif;
	font-weight: 400;
	background: linear-gradient(currentcolor, currentcolor) right bottom / 0 1px no-repeat;
	transition: background-size .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
html:not(.isTouch) .flickity-page-dots .dot:hover,
.flickity-page-dots .dot.is-selected {
	background-position: left bottom;
	background-size: 100% 1px;
}
.flickity-page-dots .dot::after {
	content: counter(item);
	subset: cyrillic;
}
.flickity-page-dots .dot:not(:first-child) {
	margin-left: 2em;
}
@media screen and (max-width: 1024px) {
	.flickity-page-dots {
		justify-content: center;
		margin-top: 8px;
	}
}

/**
 * modal contents
 -------------------------------------------------- */
.l-modal {
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 10;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 20px;
}
.l-modal_overlay {
	z-index: -1;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(251,250,244,.95);
}
.l-modal_container {
	position: relative;
}
.l-modal_overlay {
	background: rgba(251,250,244,.95);
}
.js-modal-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 40px;
	height: 40px;
}
.js-modal-close::before,
.js-modal-close::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 20px;
	height: 1px;
	background: currentcolor;
}
.js-modal-close::before {
	transform: rotateZ(45deg);
}
.js-modal-close::after {
	transform: rotateZ(-45deg);
}
/* :::::: open/close :::::: */
.l-modal.anima .l-modal_overlay {
	transition: transform .8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.l-modal.anima:not(.is-open) .l-modal_overlay {
	transition-delay: .1s;
	transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}
.l-modal.anima .l-modal_container {
	transition: opacity .8s, transform .8s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.l-modal.anima.is-open .l-modal_container {
	transition-delay: .3s;
}
.l-modal:not(.is-open) {
	pointer-events: none;
}
.l-modal:not(.is-open) .l-modal_overlay {
	transform: translateY(100%);
}
.l-modal:not(.is-open).anima .l-modal_overlay {
	transform: translateY(-100%);
}
.l-modal:not(.is-open) .l-modal_container {
	opacity: 0;
	transform: scale(.94);
}