@charset "utf-8";
/*
Theme Name: takeo mayumi 2
Theme URI: https://takeomayumi.com/
Version: 2.0
*/

/* common
---------------------------------------------------------------------------*/
:root {
	--color-text: #136A39;
	--color-bg: #FBFFF9;
	--color-bg-dark: #F3F8F0;
	--color-bg-green: #E3EADE;
	--color-border: #DCE7D7;
	--color-border-green-light: #E2EADE;
	--color-border-green: rgba(19,106,57,0.7);
	--font-gothic: 'yu-gothic-pr6n', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	--font-sans-l: 'NeueHaasUnicaPro-Light', sans-serif;
	--font-sans-r: 'NeueHaasUnicaPro-Regular', sans-serif;
}

body {
	overflow-y: scroll;
	background-color: var(--color-bg);
	color: var(--color-text);
	font-size: 14px;
	font-family: var(--font-gothic);
	font-weight: 400;
	line-height: 1;
	font-feature-settings: 'palt' 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: none !important;
}

body.noscroll { position: fixed; width: 100%; }

::-moz-selection { background: #F3F8F0; color: var(--color-text); }
::selection { background: #F3F8F0; color: var(--color-text); }

p { font-size: 14px; line-height: 2; letter-spacing: 0.07em; margin-bottom: 14px; }
p:last-child { margin-bottom: 0 !important; }
address,i { font-style: normal; }
img { max-width: none; }

.block { display: inline-block !important; }
.wide { display: inline-block !important; }
.narrow { display: none !important; }
.nav-sp, .btn-nav { display: none !important; }

/* #loading
------------------------------------*/
#loading {
	display: none !important;
}

/* link
------------------------------------*/
a { color: var(--color-text); text-decoration: none; transition: .15s ease-out; -webkit-transform: translateZ(0); }
.hover { cursor: pointer; transition: .15s ease-out; }
a:hover,.hover:hover { text-decoration: none; opacity: 0.6; }
img.hover:hover { opacity: 0.8; }

.line { display: inline-block; position: relative; padding-bottom: 1px; line-height: 1; }
.line:after { display: block; content: ''; position: absolute; bottom: 0; left: 0; background-color: var(--color-text); width: 100%; height: 1px; }

/* .btn
------------------------------------*/
.btn-back a {
	display: inline-block;
	position: relative;
	padding: 5px 10px 10px 25px;
	font-family: var(--font-sans-l);
	font-size: 15px;
	letter-spacing: 0.03em;
	white-space: nowrap;
}
.btn-back a i { display: block; position: absolute; top: 3px; left: 0; transform: scaleX(-1); }

.btn-ac .plus {
	position: absolute;
	top: 32px;
	right: 27px;
	width: 17px;
	height: 17px;
	transition: .8s cubic-bezier(0.23, 1, 0.32, 1); /* easeOutQuint */
	transform: rotate(0deg);
}
.btn-ac.active .plus { transform: rotate(225deg); }

.btn-ac .plus:before, .btn-ac .plus:after { display: block; content: ''; position: absolute; background-color: var(--color-text); }
.btn-ac .plus:before { top: 0; left: 8px; width: 1px; height: 100%; }
.btn-ac .plus:after { top: 8px; left: 0; width: 100%; height: 1px; }


/* #wrap
---------------------------------------------------------------------------*/
#wrap {
	position: relative;
	box-sizing: border-box;
	min-width: 1240px;
	min-height: 100vh;
	padding: 0 0 0 255px;
}


/* header
---------------------------------------------------------------------------*/
header, footer { width: 255px; }

header {
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	margin: 0;
	padding: 0;
	z-index: 1;
}

header .title { position: absolute; top: 55px; left: 38px; }
header .title-jp { margin: 6px 0 10px; }
header .title-sub { margin-left: 2px; }

header .title-en {
	position: relative;
}

header .title-en .loading-wrap {
	position: absolute;
	top: 0;
	left: 64px;
}

header .title-en .loading {
	margin: 1px 0 0;
	opacity: 0;
}

header .title-en .loading-logo {
	position: absolute;
	top: 0;
	left: 1px;
	overflow: hidden;
	width: 20px;
	height: 20px;
	/*opacity: 0;*/
}

header .title-en .loading-logo > img {
	display: block;
	position: relative;
	z-index: 2;
}

header .title-en .loading-logo .mask-bg {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: linear-gradient(135deg, #136A39 46.07%, #FBFFF9 107.72%);
	width: 19px;
	height: 19px;
	z-index: 0;
}

header .title-en .loading-logo .mask {
	display: block;
	position: absolute;
	top: 5px;
	left: 10px;
	background: var(--color-bg);
	width: 11px;
	height: 8px;
	transform-origin: left center;
	z-index: 1;
	/*opacity: 0;*/
}

header .title-en .loading-logo .mask-bg,
header .title-en .loading-logo .mask { animation: spin .5s infinite linear; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); }}


/* .gnav
------------------------------------*/
.gnav {
	position: absolute;
	top: 50%;
	left: 28px;
	margin-top: -45px;
	transform: translateY(-50%);
}

.gnav a { display: block; padding: 10px 10px 10px; }
.gnav strong { display: block; margin-bottom: -2px; font-weight: normal; }
.gnav em { display: block; margin-left: 1px; }

@media (max-height: 780px) {
	header { min-height: 700px; }
	header .title { top: 45px; }
	.gnav { margin-top: -30px; }
	.gnav strong img { height: 41px; }
	.gnav em img { height: 23px; }
	footer { padding-bottom: 32px; }
}


/* footer
---------------------------------------------------------------------------*/
footer {
	box-sizing: border-box;
	position: fixed;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 0 0 36px 38px;
	z-index: 2;
}

.sns { display: -webkit-box; display: flex; margin: -5px -5px 16px; }
.sns li a { display: block; padding: 0 5px; }
.pagetop { position: absolute; bottom: 38px; right: 40px; }


/* contents
---------------------------------------------------------------------------*/
#mainContents { display: block; width: 100%; margin: 0 auto; padding: 0; text-align: left; }

.contents {
	position: relative;
	padding: 215px 40px 305px 100px;
	opacity: 0;
}

#profileContents,
#contactContents {
	padding-top: 265px;
}

.contents:before {
	display: block;
	content: '';
	position: absolute;
	top: 35px;
	left: 100px;
	background-color: var(--color-border);
	width: calc(100% - 100px - 40px);
	height: 1px;
}

/* .title-page
------------------------------------*/
.title-page {
	position: absolute;
	top: 60px;
	right: 48px;
	text-align: right;
	white-space: nowrap;
}

.title-page .h1 {
	margin-bottom: 14px;
	font-size: 24px;
	letter-spacing: 0.1em;
	transform: translateX(4px);
}

.title-page .h2 {
	font-family: var(--font-sans-l);
	font-size: 17px;
	letter-spacing: 0.05em;
}

/* .dot-list
------------------------------------*/
.dot-list li {
	position: relative;
	margin: 0 0 2px 4px;
	padding-left: 13px;
	font-size: 13px;
	letter-spacing: 0.09em;
}

.dot-list li, .dot-list li p { line-height: 1.8; }
.dot-list li:last-of-type { margin-bottom: 0; }
.dot-list li:before { display: block; content: '・'; position: absolute; top: 0; left: 0; }


/* page top
---------------------------------------------------------------------------*/
.project-wrap { max-width: 810px; }

/* .project-feature
------------------------------------*/
.project-feature { margin-bottom: 100px; }

.project-feature > h2 {
	margin: 0 0 35px 10px;
	font-family: var(--font-sans-l);
	font-size: 18px;
	letter-spacing: 0.07em;
}

/* .project-list-category
------------------------------------*/
.project-list-category {
	display: -webkit-box;
	display: flex;
	margin: 0 0 32px 10px;
	white-space: nowrap;
}

.project-list-category h2 {
	margin-right: 14px;
	font-family: var(--font-sans-l);
	font-size: 12px;
	letter-spacing: 0.05em;
	transform: translateY(7px);
}

.project-list-category h2 .all { display: inline-block; }

.project-list-category ul { display: -webkit-box; display: flex; }
.project-list-category li { margin-right: 5px; font-size: 16px; letter-spacing: 0.05em; }
.project-list-category li.active { pointer-events: none; }

.project-list-category li span {
	display: block;
	position: relative;
	padding: 4px;
}

.project-list-category li span i {
	display: block;
	position: absolute;
	bottom: 3px;
	left: 4px;
	background: var(--color-text);
	/*width: calc(100% - 10px);*/
	width: 0;
	height: 1px;
	opacity: 0.8;
}

.project-list-category li span i {
	animation: project-list-category_line_out .1s ease-out forwards;
}
@keyframes project-list-category_line_out {
	0% { left: inherit; right: 4px; width: calc(100% - 9px); }
	100% { left: inherit; right: 4px; width: calc(0%); }
}

.project-list-category li.active span i {
	animation: project-list-category_line_in .35s cubic-bezier(0.19, 1, 0.22, 1) .15s forwards;
}
@keyframes project-list-category_line_in {
	0% { left: 4px; width: calc(0%); }
	100% { left: 4px; width: calc(100% - 9px); }
}


/* .project-list
------------------------------------*/
.project-list article {
	border-bottom: 1px solid var(--color-border);
}

.project-list article a {
	display: -webkit-box;
	display: flex;
	justify-content: space-between;
	padding: 19px 10px;
}

.project-list article h2 {
	font-size: 18px;
	line-height: 1.6;
	letter-spacing: 0.09em;
}

.project-list article .category {
	display: -webkit-box;
	display: flex;
	transform: translateY(-1px);
}

.project-list article .category span {
	display: inline-block;
	border: 1px solid var(--color-border-green);
	border-radius: 7px;
	margin-left: 10px;
	padding: 6px 6px 6px 7px;
	font-size: 14px;
	letter-spacing: 0.07em;
}


/* page project single
---------------------------------------------------------------------------*/
#projectContents .btn-back {
	position: absolute;
	top: 50px;
	left: 105px;
}

.project-single-wrap {
	width: 95%;
	max-width: 900px;
	padding-right: 60px;
	padding-left: 5px;
}

/* .project-title
------------------------------------*/
.project-title { margin-bottom: 35px; }

.project-title .year {
	display: inline-block;
	margin-right: 8px;
	margin-left: 2px;
	font-family: var(--font-sans-l);
	font-size: 13px;
	letter-spacing: 0.07em;
	white-space: nowrap;
	opacity: 0.8;
}

.project-title .client {
	display: inline-block;
	font-size: 13px;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

.project-title h1 {
	margin-top: 16px;
	font-size: 22px;
	line-height: 1.7;
	letter-spacing: 0.07em;
}

/* .project-main-img
------------------------------------*/
.project-main-img {
	position: relative;
	overflow: hidden;
	width: calc(100% + 70px);
	margin: 42px -35px 55px;
	padding-bottom: 40px;
}

.slider-project-main-img {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: calc(100%/3*2);
}

.slider-project-main-img.movie {
	padding-bottom: calc(56.25%);
}

.project-main-img .slick-list,
.project-main-img .slick-track,
.project-main-img .slick-slide {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
}

.project-main-img .inner {
	background-color: var(--color-bg-dark);
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	opacity: 0;
}

.project-main-img .inner:first-of-type {
	opacity: 1;
}

.project-main-img .inner img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.project-main-img .inner.movie.youtube iframe {
	position: absolute;
	left: -1px;
	width: calc(100% + 2px);
}

.slider-project-main-img.movie .inner.movie.youtube iframe {
	top: -1px;
	height: calc(100% + 3px);
}

.slider-project-main-img:not(.movie) .inner.movie.youtube iframe {
	top: 50%;
	transform: translateY(-50%);
	height: 84.5%;
}

.project-main-img .inner.movie.inline video {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
}

.project-main-img .slick-arrow {
	position: absolute;
	bottom: -45px;
	width: 40px;
	height: 30px;
	background: url(img/share/ico-arrow-slider.svg) no-repeat center center / 23px auto;
	text-indent: -9999px;
}

.project-main-img .slick-prev {
	right: 44px;
	transform: scaleX(-1);
}

.project-main-img .slick-next {
	right: 4px;
}

.project-main-img .slide-count {
	position: absolute;
	bottom: 3px;
	right: 105px;
	font-family: var(--font-sans-l);
	font-size: 13px;
	letter-spacing: 0.06em;
}

/* .project-txt
------------------------------------*/
.project-txt p a {
	text-decoration: underline;
}

.project-txt .jp p {
	font-size: 17px;
	line-height: 1.95;
	letter-spacing: 0.05em;
	text-align: justify;
	padding-right: 80px;
	margin-bottom: 25px;
}

.project-txt .en {
	margin: 55px 0 0 80px;
	font-family: var(--font-sans-l);
}

.project-txt .en h2 {
	margin-bottom: 19px;
	font-size: 19px;
	line-height: 1.75;
	letter-spacing: 0.02em;
}

.project-txt .en p {
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.02em;
}

.project-txt .credit-wrap {
	margin-top: 70px;
	padding-right: 80px;
}

.project-txt .credit-wrap + .credit-wrap {
	margin-top: 12px !important;
}

.project-txt .credit {
	font-size: 14px;
	line-height: 1.8;
	letter-spacing: -0.01em;
}

.project-txt .jp + .credit,
.project-txt .jp + .credit-wrap {
	margin-top: 35px;
}

.project-txt .credit > div,
.project-txt .credit > div dt,
.project-txt .credit > div dd {
	display: inline;
}

.project-txt .credit > div.year { margin-right: 4px; }
.project-txt .credit > div > i { padding-right: 3px; padding-left: 1px; }
.project-txt .credit > div:last-of-type > i { display: none; }

.project-txt .credit dt i { padding: 0 4px 0 1px; }
.project-txt .credit .year dt i { padding: 0 0 0 8px; }
.project-detail-inner.accordion .project-txt .credit dt i { padding-right: 0; }

.project-txt .url {
	margin-top: 40px;
	padding-bottom: 10px;
	font-family: var(--font-sans-l);
}

.project-txt .en + .url { margin-top: 70px; }

.project-txt .url li { margin-bottom: 12px; font-size: 17px; letter-spacing: 0; word-break: break-all; }
.project-txt .url li:last-of-type { margin-bottom: 0; }
.project-txt .url li i { padding: 0 6px 0 2px; }
.project-txt .url li a { display: inline; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.project-txt .url li a:after { display: none; }

/* .project-img
------------------------------------*/
.project-img { margin-top: 85px; }
.project-img:first-child { margin-top: 5px !important; }

.project-img .img { margin-bottom: 45px; }
.project-img .img:last-of-type { margin-bottom: 0; }
.project-img figure img { width: 100%; }

.project-img .img:has(+ .img) .caption-wrap:has(figcaption) {
	margin-bottom: -15px;
}

.project-img .caption-wrap:has(figcaption:nth-of-type(1)):has(figcaption:nth-of-type(2)) {
	display: flex;
	justify-content: space-between;
}

.project-img figcaption {
	display: block;
	margin-top: 18px;
	font-size: 14px;
	line-height: 2.1;
	letter-spacing: 0.06em;
}

.project-img figcaption:has(+figcaption),
.project-img figcaption + figcaption.size-s {
	margin-top: 12px;
}

.project-img figcaption.size-s {
	margin-left: 40px;
	margin-top: 8px;
	font-family: var(--font-sans-l);
	font-size: 12px;
	letter-spacing: 0.04em;
	text-align: right;
}

.project-img .img2 { display: -webkit-box; display: flex; justify-content: space-between; }
.project-img .img2 figure { width: 47.5%; }
.project-img .img2 figcaption { line-height: 1.7; }

.project-img .movie:not(:first-child),
.project-img .movie + .img:not(.movie) {
	margin-top: 60px;
}

.project-img .movie.youtube .iframe {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}

.project-img .movie.youtube iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.project-img .movie video { width: 100%; height: auto; }

/* .project-detail
------------------------------------*/
.project-detail { margin: 100px 0 0; }

.project-detail .project-detail-inner { margin-bottom: 90px; }
.project-detail .project-detail-inner.accordion { position: relative; margin-bottom: -23px; }
.project-detail .project-detail-inner.accordion:first-of-type { margin-top: -22px; }
.project-detail .project-detail-inner.accordion:last-of-type { margin-bottom: 0; border-bottom: 1px solid var(--color-border); }

.project-detail .project-detail-inner.accordion .mask {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--color-bg);
	width: 100%;
	height: 100%;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
}

.project-detail-inner > h2 {
	position: relative;
	background: var(--color-bg);
	padding: 18px 75px 18px 10px;
	cursor: pointer;
}

.project-detail .project-detail-inner.accordion > h2 {
	display: flex;
	align-items: center;
	position: sticky;
	top: 0;
	left: 0;
	min-height: 70px;
	padding-top: 42px;
	z-index: 2;
}

.project-detail .project-detail-inner.accordion > h2:before,
.project-detail .project-detail-inner.accordion > h2:after {
	display: block;
	content: '';
	position: absolute;
	left: 0;
	background: var(--color-border);
	width: 100%;
	height: 1px;
	transition: .2s ease-out;
}

.project-detail .project-detail-inner.accordion > h2:before { top: 23px; }
.project-detail .project-detail-inner.accordion > h2:after { bottom: 0; opacity: 0; }
.project-detail .project-detail-inner.accordion > h2.active.sticky:before { opacity: 0; }
.project-detail .project-detail-inner.accordion > h2.active.sticky:after { opacity: 1; }

.project-detail .project-detail-inner.accordion > h2.btn-ac .plus { top: 67px; }

.project-detail-inner > h2 span,
.project-detail-inner > h2.btn-ac .plus { transition: .15s ease-out; }
.project-detail-inner > h2:hover span,
.project-detail-inner > h2.btn-ac:hover .plus { opacity: 0.6; }

.project-detail-inner > h2 figure {
	align-self: flex-start;
	overflow: hidden;
	position: relative;
	width: 70px;
	min-width: 70px;
	height: 70px;
	margin-right: 27px;
}

.project-detail-inner > h2 figure img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.project-detail-inner > h2 span {
	font-size: 16px;
	letter-spacing: 0.1em;
}

.project-detail-inner > h2 em {
	display: block;
	margin: 10px 0 0 1px;
	font-family: var(--font-sans-l);
	font-size: 13px;
	line-height: 1.5;
	letter-spacing: 0.05em;
}

.project-detail-inner > h2 + div { display: none; padding: 0 10px 80px; }
.project-detail-inner .project-txt { padding-top: 40px; }
.project-detail-inner .project-txt p { font-size: 16px; }
.project-detail-inner .project-txt .credit-wrap { margin-top: 60px; }
.project-detail-inner .project-txt .jp + .credit-wrap { margin-top: 30px; }
.project-detail-inner .project-txt .url { margin-top: 30px; }
.project-detail-inner .project-img { margin-top: 65px; }

/* .project-modal
------------------------------------*/
.project-modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(227,234,222,0.95);
	width: 100%;
	height: 100%;
	z-index: 10100;
	opacity: 0;
}

.project-modal-inner {
	width: 100%;
	height: 100% !important;
}

.project-modal-close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 38px 40px;
	z-index: 2;
	opacity: 0;
}

.project-modal .slick-arrow {
	position: absolute;
	top: 0;
	background: url(img/share/ico-arrow-modal.svg) no-repeat center center;
	width: 106px;
	height: 100%;
	text-indent: -9999px;
	z-index: 1;
	transition: .15s ease-out;
}

.project-modal .slick-prev { left: 0; transform: scaleX(-1); }
.project-modal .slick-next { right: 0; }
.project-modal .slick-arrow:hover { opacity: 0.6; }

.project-modal-slide,
.project-modal-slide .slick-list,
.project-modal-slide .slick-track {
	width: 100% !important;
	height: 100% !important;
	z-index: 0;
}

.project-modal-slide .inner {
	position: absolute !important;
	top: 0 !important;
	left: 150px !important;
	width: calc(100% - 300px) !important;
	height: calc(100vh) !important;
}

.project-modal-slide .inner figure {
	position: relative;
	width: 100%;
	height: 100%;
	opacity: 0;
}

.project-modal-slide .inner.cap figure {
	height: calc(100vh - 205px) !important;
	margin-top: 100px;
}

.project-modal-slide .inner img {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) !important;
	width: auto;
	max-width: calc(100% - 0px);
	height: auto;
	max-height: calc(100% - 0px);
	margin: 0 auto !important;
}

.project-modal-slide .inner .caption {
	overflow: hidden;
	position: absolute;
	bottom: -105px;
	left: 50%;
	transform: translateX(-50%) !important;
	/*width: 940px;*/
	width: 100%;
	height: 80px;
	padding-top: 25px;
	font-size: 14px;
	line-height: 2;
	letter-spacing: 0.08em;
	text-align: justify;
}

.project-modal-slide .inner .caption p {
	/*position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);*/
}

.project-modal-slide .inner .caption-wrap figcaption {
	display: none;
}

/* .project-other
------------------------------------*/
.project-other { margin-top: 200px; }

.project-detail > h2,
.project-other > h2 {
	margin: 0 0 30px 10px;
	font-size: 15px;
	letter-spacing: 0.08em;
}

.project-other .project-list {
	border-top: 1px solid var(--color-border);
}

.project-other .project-list article a {
	padding-top: 22px;
}

.project-other .project-list article h2 {
	font-size: 16px;
}


/* page profile
---------------------------------------------------------------------------*/
.sec-profile {
	display: -webkit-box;
	display: flex;
	justify-content: space-between;
	width: 82.5%;
	max-width: 900px;
}

.sec-profile .img {
	width: 175px;
	min-width: 175px;
	white-space: nowrap;
}

.sec-profile .img h4 {
	margin-bottom: 35px;
	font-family: var(--font-sans-l);
	font-size: 12px;
	letter-spacing: 0.08em;
}

.sec-profile .img h3 {
	margin-bottom: 20px;
	font-family: var(--font-sans-l);
	font-size: 22px;
	letter-spacing: 0.09em;
}

.sec-profile .img h2 {
	margin-bottom: 60px;
	font-size: 16px;
	letter-spacing: 0.09em;
}

.sec-profile .txt {
	width: calc((100% - 175px) * 0.82);
	margin-top: 42px;
}

.sec-profile .txt .jp {
	margin-bottom: 40px;
}

.sec-profile .txt .jp p {
	font-size: 16px;
	line-height: 1.95;
	letter-spacing: 0.05em;
	text-align: justify;
}

.sec-profile .txt .en p {
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: -0.01em;
}


/* page contact
---------------------------------------------------------------------------*/
.contact-wrap { width: 686px; }
.sec-contact { margin-bottom: 58px; }
.sec-contact p { font-size: 17px; line-height: 2.1; }

/* .form-wrap
------------------------------------*/
.form-wrap { margin-bottom: 60px; }

/* .sec-contact .sent{
	display: none!important
} */

.sent .form-wrap,
.sent .sec-privacy,
.sent .privacy-check,
.sent .btn-submit {
	display: none!important;
}

.form-wrap dl, .form-wrap dl p { line-height: 1.6; }
.form-wrap dl div { display: flex; margin-bottom: 26px; }
.form-wrap dl div:last-of-type { margin-bottom: 0; }

.form-wrap dt {
	box-sizing: border-box;
	width: 215px;
	padding-top: 15px;
}

.form-wrap dt, .form-wrap dt p {
	font-size: 16px;
	letter-spacing: 0.08em;
}

.form-wrap dl > div:last-of-type dt {
	padding-top: 10px;
	align-self: flex-start;
}

.form-wrap dt span {
	padding-left: 6px;
	font-size: 11px;
	letter-spacing: 0.1em;
}

.form-wrap dd {
  box-sizing: border-box;
	width: 408px;
	min-height: 54px;
}

.form-wrap dd p {
	font-size: 12px;
	line-height: 1.7;
	text-align: justify;
}

/* input
------------------------------------*/
.wpcf7-form-control-wrap {
	display: inline-block;
	position: relative;
	width: 100%;
}

.form-wrap input[type="text"],
.form-wrap input[type="email"],
.form-wrap input[type="tel"],
.form-wrap textarea,
.form-wrap .btn-select .customSelect {
	display: inline-block;
	box-sizing: border-box;
	background-color: #FFFFFF;
	border: 1px solid var(--color-border-green-light);
	width: 100%;
	height: 54px;
	padding: 12px 20px;
	font-size: 16px;
	letter-spacing: 0.1em;
}

.form-wrap textarea { height: 400px; padding: 18px 20px; }
::-webkit-input-placeholder { display: none; font-size: 0; }
:-moz-placeholder { display: none; font-size: 0; }
::-moz-placeholder { display: none; font-size: 0; }
:placeholder-shown { display: none; font-size: 0; }

/* .privacy-check
------------------------------------*/
.privacy-check { margin-top: 20px; }
.privacy-check .wpcf7-form-control-wrap { width: auto; margin-right: 10px; transform: scale(1.1) translateY(1px); }
_::-webkit-full-page-media, _:future, :root .privacy-check .wpcf7-form-control-wrap { transform: scale(1.1) translateY(-2px); }
.privacy-check p { font-size: 15px; }

/* .btn-submit
------------------------------------*/
.btn-submit {
	position: relative;
	display: inline-block;
	margin: 80px 0 0;
}

.btn-submit:before {
	display: block;
	content: '';
	position: absolute;
	top: 9px;
	left: 0;
	background: url(img/share/logo-mark.svg) no-repeat left top;
	background-size: 100% auto;
	width: 24px;
	height: 24px;
	transform: scaleX(-1);
	pointer-events: none;
}

.btn-submit:after {
	display: block;
	content: '';
	position: absolute;
	bottom: 4px;
	left: 0;
	background-color: var(--color-text);
	width: calc(100% - 5px);
	height: 1px;
}

.btn-submit input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: block;
	background: none;
	box-sizing: border-box;
	border: none;
	margin: 0;
	padding: 0 5px 5px 0;
	font-size: 18px;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-align: left;
	white-space: nowrap;
	transition: .15s ease-out;
}

.btn-submit input:hover { opacity: 0.7; }

/* error
------------------------------------*/
.form-wrap .txt-error,
.wpcf7-not-valid-tip,
.txt-response,
.wpcf7-response-output { display: block; }

.form-wrap .txt-error,
.wpcf7-not-valid-tip {
	margin: 10px 0 0;
	padding: 0;
	font-size: 13px;
	line-height: 1.6;
	letter-spacing: 0.05em;
}

.screen-reader-response { display: none; }

.txt-response,
.wpcf7-response-output {
	margin: 30px 0 0;
	font-size: 17px;
	line-height: 1.6;
	letter-spacing: 0.08em;
}

.wpcf7-response-output:first-child { margin: -50px 0 45px; padding-top: 55px; }
.wpcf7-response-output:empty { margin: 0; padding-top: 0; }

.hidden-fields-container {
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* .sec-privacy
------------------------------------*/
.sec-privacy {
	overflow: hidden;
	box-sizing: border-box;
	background-color: var(--color-bg-dark);
	height: 282px;
	padding: 8px 6px;
}

.sec-privacy .inner {
	overflow-y: scroll;
	box-sizing: border-box;
	height: 100%;
	padding: 40px 40px;
}

.sec-privacy .inner::-webkit-scrollbar { width: 1px; }
.sec-privacy .inner::-webkit-scrollbar-track { border-radius: 0; background: none; }
.sec-privacy .inner::-webkit-scrollbar-thumb { border-radius: 0; background: var(--color-text); }

.sec-privacy h2 {
	margin-bottom: 30px;
	font-size: 15px;
	letter-spacing: 0.1em;
}

.sec-privacy p {
	font-size: 13px;
	line-height: 1.95;
	letter-spacing: 0.03em;
	text-align: justify;
}

.sec-privacy dl > div { margin-bottom: 30px; }
.sec-privacy dl > div:last-of-type { margin-bottom: 0; }
.sec-privacy dt { margin-bottom: 7px; }
.sec-privacy dt, .sec-privacy dt p { font-size: 14px; }
.sec-privacy dd ul { margin: -12px 0 12px; }
.sec-privacy dd ul.mt { margin-top: -2px; }
.sec-privacy dd .dot-list.mt li { margin-bottom: 4px; }

/* recaptcha
------------------------------------*/
.grecaptcha-badge { pointer-events: none; z-index: -999; opacity: 0; transition: .15s ease-out; }
body.contact .grecaptcha-badge { pointer-events: auto; z-index: 0; opacity: 1; }


/* page error
---------------------------------------------------------------------------*/
#errorContents h1 {
	margin-bottom: 24px;
	font-size: 21px;
	line-height: 1.6;
	letter-spacing: 0.1em;
}

.sec-contact p { font-size: 16px; }
.sec-contact p a { text-decoration: underline; }


/* print
---------------------------------------------------------------------------*/
@media print {

}