@charset "UTF-8";

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
img,legend{border:0}legend,td,th{padding:0}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,optgroup,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre,textarea{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}table{border-collapse:collapse;border-spacing:0}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

:root {
	--base-color-blue: #066cbb;
	--base-color-blue-RGB: 6, 108, 187;
	--base-color-blue-RGBa-90: rgba(6, 108, 187, .9);
	--base-color-green: #149D73;
	--base-color-black: #111111;
	--base-font-color: #333;
	--base-line-color: #d1d1d1;
	--base-transition-time: .4s;

	--debug: 1px solid red;
}

@media screen and (max-width: 1400px) {}
@media screen and (min-width: 1025px) {}
@media screen and (max-width: 1024px) {}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

body {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-family: 'Poppins', 'Noto Sans JP', "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #333;
	position: relative;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	width: 100%;
	min-height: 100vh;
	overflow-x: hidden;
	background-color: #fff;
}
*,
*::before,
*::after {box-sizing: border-box;}

h1,h2,h3,h4,h5,h6,p {margin:0;padding:0;}

p,pre,blockquote,ul,ol,dl,dt,dd,hr,form,input {
	margin:0;
	padding:0;
}

img,figure {
	display: block;
	margin:0;
	padding:0;
	border:0;
}

table {
	margin:0;
	padding:0;
	border:0;
	border-collapse:collapse;
	border-spacing:0;
	empty-cells:show;
	table-layout: fixed;
}

strong {font-weight: bold;}
li {list-style:none;}

address {font-style:normal;}

img {
	margin:0;
	padding:0;
	border:none;
	vertical-align:bottom;
}
a {-webkit-tap-highlight-color:transparent;}
a:hover {text-decoration: none;}


.inlineblock {
	display: inline-block;
}
.fontsmall {
	font-size: 75%;
}
.fontlarge {
	font-size: 125%;
}
@media screen and (max-width: 1024px) {
	.sp-delete {
		display: none;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

#splash {
    position: fixed;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background:var(--base-color-blue);
    text-align:center;
    color:#fff;
}
#splash_text {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 9999;
    width: 100%;
    transform: translate(-50%, -50%);
    color: #fff;
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

@keyframes animeWidth100 {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

@keyframes animeTopOpacity {
	0% {
		top: 100px;
		opacity: 0;
	}
	100% {
		top: 0;
		opacity: 1;
	}
}

@keyframes animeToLeftOpacity {
	0% {
		left: -200px;
		opacity: 0;
	}
	100% {
		left: 0;
		opacity: 1;
	}
}
@keyframes animeToRightOpacity {
	0% {
		right: -200px;
		opacity: 0;
	}
	100% {
		right: 0;
		opacity: 1;
	}
}
@keyframes animeTitle {
	0% {
		width: 100%;
	}
	100% {
		width: 0;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

body.globalMenu--active {
	height: 100vh;
	overflow: hidden;
}

header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9989;
	display: flex;
}
header h1 {
	margin: 40px;
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

/* @media screen and (min-width: 1025px) {
	body:not(#index) main {
		padding-top: 120px;
	}
}
@media screen and (max-width: 1024px) {
	body:not(#index) main {
		padding-top: 70px;
	}
} */

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

#globalNav {
	position: fixed;
	top: 0;
	right: 0;
	font-size: 14px;
	z-index: 9990;
}
#globalNav > * {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100px;
	height: 100px;
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	font-size: 14px;
	line-height: 1;
	color: #fff;
	transition: background-color var(--base-transition-time);
	cursor: pointer;
}
#globalNav > *:hover {
	background-color: var(--base-color-black);
}
#globalNav-menu {
	flex-direction: column;
	background-color: var(--base-color-blue);
}
#globalNav-menu > div {
	margin-bottom: .5em;
}
#globalNav-menu svg {
	fill: #fff;
}
#globalNav-entry {
	background-color: var(--base-color-green);
	text-decoration: none;
}

@media screen and (min-width: 1025px) {}
@media screen and (max-width: 1024px) {
	header h1 {
		margin: 20px;
	}
	header h1 img {
		width: auto;
		height: 30px;
	}
	#globalNav > * {
		width: 60px;
		height: 60px;
		font-size: 10px;
	}
	#globalNav-menu svg {
		width: 24px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.globalMenu--active #globalMenu {
	right: 0;
}

#globalMenu {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -100%;
	width: 100%;
	height: 100vh;
	padding: 40px;
	background-color: var(--base-color-blue);
	z-index: 9991;
	transition: right var(--base-transition-time);
	overflow-y: auto;
}
#globalMenu.is--middle > div {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}
#globalMenu-close {
	width: 100%;
	max-width: 640px;
	margin: auto;
	display: flex;
	justify-content: flex-end;
	padding-bottom: 40px;
}
#globalMenu-close div {
	position: relative;
	padding: 0.6em 1.5em;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	color: #fff;
	line-height: 1;
	border: 2px solid #fff;
	border-radius: 5em;
	transition: background-color var(--base-transition-time);
	cursor: pointer;
}
#globalMenu-close div:hover {
	color: var(--base-color-blue);
	background-color: #fff;
}

#globalMenu-main {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	grid-gap: 40px;
	gap: 40px;
	width: 100%;
	max-width: 640px;
	margin: auto;
}
#globalMenu-main > div h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 24px;
	line-height: 1;
	color: #fff;
	letter-spacing: .05em;
}
#globalMenu-main ul {
	position: relative;
	margin-top: 1.5em;
	padding-top: .6em;
}
#globalMenu-main ul::after {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 1.5em;
	height: 1px;
	background-color: rgba(255, 255, 255, .5);
}
#globalMenu-main li {
	margin-top: 1em;
	margin-left: 1.2em;
}
#globalMenu-main a {
	position: relative;
	color: #fff;
	line-height: 1.2;
	text-decoration: none;
}
#globalMenu-main a::after {
	position: absolute;
	content: '';
	top: .65em;
	left: -1.2em;
	width: .4em;
	height: 1px;
	background-color: #fff;
	transition: left var(--base-transition-time);
}
#globalMenu-main a:hover::after {
	left: -.8em;
}

@media screen and (max-width: 1024px) {
	#globalMenu {
		height: auto;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.fv-text {
	position: relative;
	margin: auto;
	padding-top: 120px;
	overflow: hidden;
}
.fv-text::after {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAylpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LjE0NjI4OTk3NzcsIDIwMjMvMDYvMjUtMjM6NTc6MTQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNS4wIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE3RDZGQUZENzVDQjExRUU5OEQwQzkxQjA5NTAzRTk5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE3RDZGQUZFNzVDQjExRUU5OEQwQzkxQjA5NTAzRTk5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTdENkZBRkI3NUNCMTFFRTk4RDBDOTFCMDk1MDNFOTkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTdENkZBRkM3NUNCMTFFRTk4RDBDOTFCMDk1MDNFOTkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6X2xa8AAAATUlEQVR42mK8e/fufyUlJUYGILh37x4DMQCoHqT2PxNMI6kApI+JgQLACHQ22ZopsnlU85DRzEJm0oRohjFIyRhwZ4NyBzm2g/QBBBgASmsYtNabOscAAAAASUVORK5CYII=");
	background-repeat: repeat;
	background-position: 0 0;
	animation: bg-scrolling-reverse 3s linear infinite;
	/* background-image: 
	linear-gradient(#efefef 1px, transparent 0),
	linear-gradient(90deg, #efefef 1px, transparent 0);
	background-size: 15px 15px;
	border-bottom: 1px solid #efefef; */
}

@keyframes bg-scrolling-reverse {
	100% { background-position: 15px -15px; }
}

.fv-text > div {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 100%;
	max-width: 1120px;
	height: 280px;
	margin: auto;
	padding-top: .5em;
	color: #fff;
	line-height: 1;
}
.fv-text > div * {
	position: relative;
	z-index: 10;
}
.fv-text > div::after {
	position: absolute;
	content: '';
	width: 0;
	height: 100%;
	background-color: var(--base-color-blue-RGBa-90);
	animation: animeWidth100 1s ease .3s forwards;
	z-index: 1;
}
.fv-text h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 64px;
	text-align: center;
	letter-spacing: 1px;
}
.fv-text p {
	margin-top: 1.0em;
	font-size: 18px;
	line-height: 1.6;
	text-align: center;
}

.fv-text h2,
.fv-text p {
	position: relative;
	top: 100px;
	opacity: 0;
	animation: animeTopOpacity 1s ease .3s forwards;
}

@media screen and (max-width: 1400px) {
	.fv-text h2 {
		font-size: calc(32px + 32 * (100vw - 300px) / 1100);
	}
	.fv-text p {
		font-size: calc(16px + 2 * (100vw - 300px) / 1100);
	}
}
@media screen and (max-width: 1024px) {
	.fv-text {
		padding-top: 70px;
	}
	.fv-text::after {
		display: none;
	}
	.fv-text > div {
		height: 200px;
	}
	.fv-text > div::after {
		background-color: var(--base-color-blue);
	}
}

/*---------------------------------------------------------*/

@media screen and (min-width: 1025px) {
	.fv-text-scroll {
		display: flex;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 2240px;
		opacity: .1;
		animation :infinity-scroll-left 95s infinite linear 0.5s both;
	}
	.fv-text-scroll li {
		white-space: nowrap;
	}
}
@media screen and (max-width: 1024px) {
	.fv-text-scroll {
		display: none;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.fv-hasPht {
	position: relative;
	width: 100%;
	padding-top: 120px;
	/* overflow: hidden; */
}
.fv-hasPht::after {
	position: absolute;
	content: '';
	/* top: 120px; */
	top: 0;
	left: 0;
	width: 100%;
	/* height: calc( 100% - 120px ); */
	height: 100%;
	z-index: -1;
	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAylpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LjE0NjI4OTk3NzcsIDIwMjMvMDYvMjUtMjM6NTc6MTQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyNS4wIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE3RDZGQUZENzVDQjExRUU5OEQwQzkxQjA5NTAzRTk5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE3RDZGQUZFNzVDQjExRUU5OEQwQzkxQjA5NTAzRTk5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTdENkZBRkI3NUNCMTFFRTk4RDBDOTFCMDk1MDNFOTkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTdENkZBRkM3NUNCMTFFRTk4RDBDOTFCMDk1MDNFOTkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6X2xa8AAAATUlEQVR42mK8e/fufyUlJUYGILh37x4DMQCoHqT2PxNMI6kApI+JgQLACHQ22ZopsnlU85DRzEJm0oRohjFIyRhwZ4NyBzm2g/QBBBgASmsYtNabOscAAAAASUVORK5CYII=");
	background-repeat: repeat;
	background-position: 0 0;
	animation: bg-scrolling-reverse 3s linear infinite;
	/* background-image: 
	linear-gradient(#efefef 1px, transparent 0),
	linear-gradient(90deg, #efefef 1px, transparent 0);
	background-size: 15px 15px; */
	/* border-top: 1px solid #efefef;
	border-bottom: 1px solid #efefef; */
}
.fv-hasPht-pht {
	position: relative;
}
@media screen and (min-width: 1025px) {
	.fv-hasPht-text-panel {
		position: relative;
		color: #fff;
	}
	.fv-hasPht-text-panel::after {
		position: absolute;
		content: '';
		bottom: 0;
		right: 100px;
		width: 100%;
		height: 100%;
		background-color: var(--base-color-blue-RGBa-90);
		animation: fvtextpanel 1s ease .3s forwards;
		opacity: 0;
		z-index: -1;
	}
	@keyframes fvtextpanel {
		0% {
			opacity: 0;
			right: 100px;
		}
		100% {
			opacity: 1;
			right: 0;
		}
	}
	.fv-hasPht-text {
		position: absolute;
		top: 120px;
		left: 50%;
		width: 100%;
		max-width: 1120px;
		height: calc( 100% - 240px );
		color: #fff;
		transform: translateX(-50%);
		z-index: 1;
	}
	.fv-hasPht-text-panel {
		flex-direction: column;
		width: 50%;
		height: 100%;
		margin-top: 120px;
		padding: 60px;
	}
	.fv-hasPht-text--center .fv-hasPht-text-panel {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.fv-hasPht-pht {
		display: flex;
		justify-content: flex-end;
		width: 100%;
		max-width: 1120px;
		margin: auto;
	}
	.fv-hasPht-pht img {
		position: relative;
		display: block;
		width: auto;
		height: 600px;
		right: -200px;
		opacity: 0;
		animation: fvpht 1s ease .3s forwards;
	}
	@keyframes fvpht {
		0% {
			right: -200px;
			opacity: 0;
		}
		100% {
			right: 0;
			opacity: 1;
		}
	}
	
	.fv-hasPht-text h2 {
		font-family: 'Montserrat', sans-serif;
		font-size: 64px;
	}
	.fv-hasPht-text p {
		font-weight: bold;
		font-size: 28px;
		line-height: 1.6;
	}
	.fv-hasPht-text h2 + p {
		margin-top: 1.2em;
	}
	
	#interviewDetail .fv-hasPht-text-panel,
	#diaryDetail .fv-hasPht-text-panel {
		display: flex;
		justify-content: flex-end;
		align-items: flex-end;
	}
	#interviewDetail .fv-hasPht-text-panel p {
		width: 100%;
		font-weight: bold;
		font-size: 24px;
	}
	#diaryDetail .fv-hasPht-text-panel p {
		width: 100%;
		font-weight: bold;
		font-size: 34px;
	}
	
	.fv-hasPht-text-panel-name {
		margin-top: 6em;
		line-height: 1;
	}
	#message .fv-hasPht-text-panel-name {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		margin-top: 2em;
	}
	
	.fv-hasPht-text-panel-name > *:nth-child(1) {
		position: relative;
	}
	.fv-hasPht-text-panel-name > *:nth-child(1)::after {
		position: absolute;
		content: '';
		top: 0.6em;
		left: -40px;
		width: 30px;
		height: 1px;
		background-color: #fff;
	}
	#message .fv-hasPht-text-panel-name > *:nth-child(1)::after {
		top: 0.4em;
	}
	#interviewDetail .fv-hasPht-text-panel-name > *:nth-child(1)::after {
		top: 0.4em;
	}
	
	.fv-hasPht-text-panel-name em {
		display: block;
		position: relative;
		font-size: 24px;
		font-style: normal;
	}
	
	#message .fv-hasPht-text-panel-name > *:nth-child(2) {
		display: inline-block;
		padding-left: .5em;
	}
	#interviewDetail .fv-hasPht-text-panel-name > *:nth-child(2),
	#diaryDetail .fv-hasPht-text-panel-name > *:nth-child(2) {
		display: block;
		margin-top: .3em;
		line-height: 1.6;
	}
	.fv-hasPht-text > div > * {
		position: relative;
		top: 100px;
		opacity: 0;
		animation: animeTopOpacity 1s ease .3s forwards;
	}
	.fv-hasPht-letter {
		position: absolute;
		top: 120px;
		left: calc( 50% - 200px );
		width: 100%;
		max-width: 1120px;
		transform: translateX(-50%);
		opacity: 0;
		animation: fvLetter 1s ease .3s forwards;
	}
	@keyframes fvLetter {
		0% {
			opacity: 0;
			left: calc( 50% - 200px );
		}
		100% {
			opacity: .1;
			left: 50%;
		}
	}
}
@media screen and (max-width: 1400px) {
	.fv-hasPht-text h2 {
		font-size: calc(22px + 42 * (100vw - 300px) / 1100);
	}
	.fv-hasPht-text p {
		font-size: calc(14px + 14 * (100vw - 300px) / 1100);
	}
	#interviewDetail .fv-hasPht-text-panel p {
		font-size: calc(14px + 10 * (100vw - 300px) / 1100);
	}
	#diaryDetail .fv-hasPht-text-panel p {
		font-size: calc(16px + 18 * (100vw - 300px) / 1100);
	}
	.fv-hasPht-text-panel-name em {
		font-size: calc(12px + 12 * (100vw - 300px) / 1100);
	}
	.fv-hasPht-text-panel-name span {
		font-size: calc(10px + 6 * (100vw - 300px) / 1100);
	}
}
@media screen and (max-width: 1024px) {
	.fv-hasPht {
		padding-top: 70px;
	}
	.fv-hasPht-pht {
		width: calc( 100vw - 160px );
		height: auto;
		margin: auto;
	}
	.fv-hasPht::after {
		top: 0;
		height: 100%;
	}
	.fv-hasPht-pht img {
		object-fit: cover;
		width: 100%;
		height: auto;
	}
	.fv-hasPht-text {
		position: absolute;
		bottom: 40px;
		left: 40px;
	}
	.fv-hasPht-text-panel-name {
		display: flex;
		flex-direction: column;
	}
	.fv-hasPht-text-panel-name > * + * {
		margin-top: 4px;
	}
	.fv-hasPht-text h2,
	.fv-hasPht-text p,
	.fv-hasPht-text span,
	.fv-hasPht-text em {
		position: relative;
		margin-right: auto;
		font-style: normal;
		line-height: 1.2;
		color: #fff;
		background-color: var(--base-color-blue);
	}
	.fv-hasPht-text h2::after,
	.fv-hasPht-text p::after,
	.fv-hasPht-text span::after,
	.fv-hasPht-text em::after {
		position: absolute;
		content: '';
		top: 0;
		bottom: 0;
		right: 0;
		margin: auto;
		width: 100%;
		height: 110%;
		background-color: var(--base-color-blue);
		animation: animeTitle .5s ease .3s forwards;
	}
	.fv-hasPht-text h2 {
		margin-top: 4px;
		margin-bottom: 4px;
		padding: .1em 12px;
	}
	.fv-hasPht-text p {
		margin-top: 4px;
		margin-bottom: 4px;
		padding: .4em 12px;
	}
	.fv-hasPht-text span {
		padding: .4em 12px;
	}
	.fv-hasPht-text em {
		padding: .3em 12px;
	}
	.fv-hasPht-letter {
		position: absolute;
		top: 60px;
		left: 20px;
		width: calc( 100% - 40px );
		opacity: .2;
	}
	.fv-hasPht-letter img {
		max-width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 768px) {
	.fv-hasPht-pht {
		width: calc( 100vw - 20px );
	}
	.fv-hasPht-text {
		bottom: -10px;
		left: 20px;
	}
	#interviewDetail .fv-hasPht-text-panel-name span,
	#diaryDetail .fv-hasPht-text-panel-name span {
		display: none;
	}
	#diaryDetail .fv-hasPht-text-panel-name > * + * {
		margin-top: 0;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

body:not(#index) section:not(#common-message) {
	position: relative;
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (min-width: 1025px) {
	body:not(#index):not(#message):not(#interviewDetail) section {
		margin: 120px auto;
	}
}
@media screen and (max-width: 1024px) {
	body:not(#index):not(#message):not(#interviewDetail) section {
		margin: 60px auto;
	}
}
body:not(#index) main section:last-child {
	margin-bottom: 0;
}

.section-inner.section-inner-cssAnimation {
	position: relative;
	top: 100px;
	opacity: 0;
}
.section-inner.section-inner-cssAnimation-is-active {
	animation: contentanime 1s ease .3s forwards;
}
@keyframes contentanime {
	0% {
		top: 100px;
		opacity: 0;
	}
	100% {
		top: 0;
		opacity: 1;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-title-line {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
.common-title-line::after {
	position: absolute;
	content: '';
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 100%;
	height: 1px;
	background-color: var(--base-color-blue);
	z-index: -1;
}
.common-title-line > * {
	position: relative;
	padding: 0 .4em;
	font-size: 40px;
	line-height: 1.2;
	color: var(--base-color-blue);
	background-color: #fff;
	z-index: 1;
}

@media screen and (max-width: 1400px) {
	.common-title-line > * {
		font-size: calc(20px + 20 * (100vw - 300px) / 1100);
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-table {
	border-top: 1px solid var(--base-line-color);
}

@media screen and (min-width: 1025px) {
	.common-table dl {
		display: flex;
		width: 100%;
		border-bottom: 1px solid var(--base-line-color);
	}
	.common-table dt,
	.common-table dd {
		padding: 20px 0;
		line-height: 1.4;
	}
	.common-table dt {
		width: 220px;
		padding-right: 1em;
	}
	.common-table dd {
		width: calc( 100% - 220px );
	}
}
@media screen and (max-width: 1024px) {
	.common-table dl {
		padding: 16px 0;
		border-bottom: 1px solid var(--base-line-color);
	}
	.common-table dt {
		font-weight: normal;
		font-size: 12px;
		color: var(--base-color-blue);
		line-height: 1.0;
	}
	.common-table dd {
		padding-top: 10px;
		font-size: 14px;
		line-height: 1.6;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-listMark li {
	position: relative;
	padding-left: 1.2em;
}
.common-listMark li + li {
	margin-top: .5em;
}
.common-listMark li::before {
	position: absolute;
	left: 0;
}

.common-listMark--square li::before {
	content: '■';
}

.common-listMark--disc li::before {
	content: '・';
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-chippedBox-body p {
	line-height: 2.4;
}
#philosophy .common-chippedBox-body dl {
	display: flex;
	line-height: 1.8;
}
#philosophy .common-chippedBox-body dl + dl {
	margin-top: 1em;
}
#philosophy .common-chippedBox-body dt {
	width: 3em;
	white-space: nowrap;
}
#philosophy .common-chippedBox-body dt span {
	display: inline-block;
	width: .7em;
	text-align: center;
}
#philosophy .common-chippedBox-body dd {
	width: calc( 100% - 3em );
}

@media screen and (min-width: 1025px) {
	.common-chippedBox {
		position: relative;
	}
	.common-chippedBox::after {
		position: absolute;
		content: '';
		top: 40px;
		left: 0;
		width: 100%;
		height: calc( 100% - 40px );
		border: 1px solid var(--base-line-color);
		z-index: -1;
	}
	.common-chippedBox:not(:nth-child(1)) {
		margin: 80px 0;
	}
	.common-chippedBox-title {
		display: flex;
		align-items: center;
		position: relative;
		width: calc( 100% - 160px );
		margin: auto;
		color: #fff;
		background-color: var(--base-color-blue);
	}
	.common-chippedBox-title::after {
		position: absolute;
		bottom: -8px;
		left: 0;
		width: 100%;
		height: 8px;
		content: '';
		background-image: repeating-linear-gradient(-45deg, var(--base-color-blue), var(--base-color-blue) 1px, transparent 2px, transparent 5px);
		background-size: 7px 7px;
		border: 1px solid var(--base-color-blue);
	}
	.common-chippedBox-title > * {
		padding: .6em 1em;
		font-family: 'Montserrat', sans-serif;
		font-size: 32px;
		line-height: 1.2;
	}
	.common-chippedBox-title > em {
		margin-left: auto;
		font-size: 16px;
		font-style: normal;
		line-height: 1;
	}
	.common-chippedBox-body {
		padding: 80px;
		font-size: 20px;
	}
}
@media screen and (max-width: 1024px) {
	.common-chippedBox:not(:nth-child(1)) {
		margin: 60px 0;
	}
	.common-chippedBox-title {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}
	.common-chippedBox-title::after {
		position: absolute;
		content: '';
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		width: 100%;
		height: 1px;
		background-color: var(--base-color-blue);
		z-index: -1;
	}
	.common-chippedBox-title > * {
		position: relative;
		padding: 0 .4em;
		font-size: calc(20px + 12 * (100vw - 300px) / 1100);
		line-height: 1.2;
		color: var(--base-color-blue);
		background-color: #fff;
		z-index: 1;
	}
	.common-chippedBox-title > em {
		position: absolute;
		bottom: -1.5em;
		left: 0;
		right: 0;
		margin: auto;
		font-family: 'Montserrat', sans-serif;
		font-size: 10px;
		font-style: normal;
		text-align: center;
	}
	.common-chippedBox-body {
		margin-top: 40px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

#interview .common-memberlist:first-child {
	margin-top: 0;
}
#interview .common-memberlist:last-child {
	margin-bottom: 0;
}

.common-memberlist-pht {
	width: 240px;
	height: 240px;
	border-radius: 50%;
	overflow: hidden;
}
.common-memberlist-pht img {
	width: 100%;
	height: auto;
}
#index .common-memberlist-main {
	color: #fff;
}
.common-memberlist-main p {
	font-weight: bold;
	font-size: 24px;
	line-height: 1.6;
}
.common-memberlist-main em {
	display: flex;
	align-items: center;
	margin-top: .8em;
	padding-left: 2.4em;
	font-style: normal;
	font-size: 16px;
}
.common-memberlist-main em span:nth-child(1) {
	position: relative;
	font-size: 12px;
	line-height: 1;
}
.common-memberlist-main em span:nth-child(1)::before {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: -2.4em;
	margin: auto;
	width: 1.6em;
	height: 1px;
	font-size: 16px;
	background-color: var(--base-color-black);
}
#index .common-memberlist-main em span:nth-child(1)::before {
	background-color: #fff;
}
.common-memberlist-main em span:nth-child(2) {
	padding-left: .6em;
	line-height: 1;
}
.common-memberlist-main a {
	display: inline-flex;
	position: relative;
	margin-top: 1.4em;
	padding: .8em 3.4em .8em 1.4em;
	font-family: 'Montserrat', sans-serif;
	line-height: 1;
	color: var(--base-color-black);
	border: 2px solid var(--base-color-black);
	border-radius: 5em;
	text-decoration: none;
	transition: background-color var(--base-transition-time);
}
#index .common-memberlist-main a {
	color: #fff;
	border: 2px solid #fff;
}
.common-memberlist-main a .icon-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.0em;
	margin: auto;
	transition: right var(--base-transition-time);
}
.common-memberlist-main a .icon-to-right svg {
	fill: var(--base-color-black);
}
#index .common-memberlist-main a .icon-to-right svg {
	fill: #fff;
}
.common-memberlist-main a:hover {
	background-color: rgba(255, 255, 255, .1);
}
.common-memberlist-main a:hover .icon-to-right {
	right: -1em;
}

@media screen and (max-width: 1400px) {
	.common-memberlist-main p {
		font-size: calc(16px + 8 * (100vw - 300px) / 1100);
	}
}
@media screen and (min-width: 1200px) {
	.common-memberlist {
		position: relative;
		display: flex;
		align-items: center;
		width: calc( 100% - ( 240px * 2 ) );
		min-height: 240px;
		margin: 40px auto;
	}
	.index-title + .common-memberlist {
		margin-top: 80px;
	}
	.common-memberlist-main {
		padding: 0 80px;
	}
	.common-memberlist-pht {
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
	}
	.common-memberlist:nth-child(odd) .common-memberlist-pht {
		left: -240px;
	}
	.common-memberlist:nth-child(even) .common-memberlist-pht {
		right: -240px;
	}
}
@media screen and (min-width: 821px) and (max-width: 1199px) {
	.common-memberlist {
		position: relative;
		display: flex;
		align-items: center;
		width: 100%;
		min-height: 240px;
		margin: 40px auto;
	}
	.common-memberlist:nth-child(odd) {
		flex-direction: row-reverse;
	}
	.common-memberlist:nth-child(odd) .common-memberlist-main {
		padding-right: 80px;
	}
	.common-memberlist:nth-child(even) .common-memberlist-main {
		padding-left: 80px;
	}
}
@media screen and (max-width: 820px) {
	.common-memberlist {
		width: 100%;
		max-width: 360px;
		margin: 60px auto;
	}
	.common-memberlist:last-child {
		margin-bottom: 0;
	}
	.common-memberlist-pht {
		margin: 0 auto;
	}
	.common-memberlist-main {
		display: flex;
		flex-direction: column;
		padding: 20px 0 0 0;
	}
	.common-memberlist-main p {
		text-align: center;
	}
	.common-memberlist-main em,
	.common-memberlist-main a {
		justify-content: flex-end;
		margin-left: auto;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-others {
	width: 100%;
	max-width: 1120px;
	margin: 100px auto;
}
.common-others h4 {
	font-family: 'Montserrat', sans-serif;
	font-size: 46px;
	line-height: 1;
	text-align: center;
}
.common-others ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 0 0 0 -30px;
}
.common-others li {
	width: calc( 20% - 30px );
	margin: 30px 0 0 30px;
}
.common-others a {
	position: relative;
	display: block;
	top: 0;
	transition: top var(--base-transition-time);
}
.common-others a:hover {
	top: -20px;
}
.common-others img {
	width: 100%;
	height: auto;
	border-radius: 50%;
}

@media screen and (max-width: 1400px) {
	.common-others h4 {
		font-size: calc(18px + 18 * (100vw - 300px) / 1100);
	}
}
@media screen and (min-width: 1025px) {
	.common-others {
		width: calc( 100% - 120px );
	}
}
@media screen and (max-width: 1024px) {
	.common-others {
		width: calc( 100% - 80px );
		margin: 60px auto;
	}
	.common-others li {
		width: calc( 35% - 30px );
		min-width: 100px;
		max-width: 200px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.common-message {
	position: relative;
	overflow: hidden;
}
.common-message-letter {
	position: absolute;
	top: 0;
	left: 0;
	opacity: .1;
}
.common-message-letter img {
	width: 10vw;
	height: auto;
}
.common-message .section-inner {
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.common-message-title {
	position: relative;
}
.common-message-title img {
	display: block;
	width: 60%;
	max-width: 400px;
	height: auto;
	margin: 0 auto;
	border-radius: 50%;
	overflow: hidden;
}
.common-message-title h3 {
	display: flex;
	justify-content: center;
	position: absolute;
	bottom: .5em;
	left: 0;
	right: 0;
	padding-left: .7em;
	font-size: 42px;
	line-height: 1;
	color: #fff;
	text-align: center;
	transform: rotate(-8deg);
	text-shadow: rgba(0, 0, 0, .2) 0 0 10px;
}
.common-message-main {
	width: 90%;
	max-width: 980px;
	margin-top: 70px;
	margin-left: auto;
	margin-right: auto;
	font-size: 18px;
	line-height: 2.4em;
	color: #fff;
}

@media screen and (max-width: 1400px) {
	.common-message-main {
		font-size: calc(14px + 4 * (100vw - 300px) / 1100);
	}
	.common-message-title h3 {
		font-size: calc(20px + 22 * (100vw - 300px) / 1100);
	}
}

@media screen and (max-width: 1024px) {
	.common-message-letter img {
		width: 25vw;
		height: auto;
	}
	.common-message-main {
		margin-top: 40px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.pageNav {
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1120px;
	margin: 20px auto;
}
.pageNav nav {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	margin: -10px 0 0 -10px;
}
.pageNav a {
	position: relative;
	margin: 10px 0 0 10px;
	padding: .6em 2.5em .6em 1.5em;
	color: #fff;
	line-height: 1.0;
	text-decoration: none;
	background-color: var(--base-color-blue);
	border-radius: 5em;
	border: 2px solid var(--base-color-blue);
	transition: background-color var(--base-transition-time);
}
.pageNav svg {
	width: 18px;
	height: auto;
}
.pageNav .pageNav-icon {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: .8em;
	margin: auto;
	fill: #fff;
}
.pageNav a:hover {
	color: var(--base-color-blue);
	background-color: #fff;
}
.pageNav a:hover .pageNav-icon {
	fill: var(--base-color-blue);
}

@media screen and (max-width: 1024px) {
	.pageNav a {
		font-size: 12px;
	}
	.pageNav svg {
		width: 16px;
		height: auto;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

.cvrbtnset {
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	font-size: 38px;
	line-height: 1;
}
.cvrbtnset a,
.cvrbtnset a:link {
	position: relative;
	width: 50%;
	padding: 1.4em 2.0em;
	color: #fff;
	text-decoration: none;
}
.cvrbtnset a:nth-child(1) {
	background: var(--base-color-blue);
	background: linear-gradient(90deg, #066CBB 0%, #0492C7 100%);
}
.cvrbtnset a:nth-child(2) {
	background-color: var(--base-color-green);
	background: linear-gradient(90deg, #149D73 0%, #09b682 100%);
}
.cvrbtnset em {
	display: block;
	margin-bottom: 0.8em;
	padding-left: .1em;
	font-style: normal;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 1px;
}
.cvrbtnset a .icon-to-right {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.6em;
	margin: auto;
	width: 2em;
	height: 2em;
	border: 2px solid #fff;
	background-color: #fff;
	border-radius: 50%;
	transition: background-color var(--base-transition-time);
}
.cvrbtnset a .icon-to-right svg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: .8em;
	height: auto;
	margin: auto;
}
.cvrbtnset a:nth-child(1) .icon-to-right svg {
	fill: var(--base-color-blue);
}
.cvrbtnset a:nth-child(2) .icon-to-right svg {
	fill: var(--base-color-green);
}
.cvrbtnset a:hover .icon-to-right {
	background-color: rgba(255, 255, 255, 0);
}
.cvrbtnset a:hover .icon-to-right svg {
	fill: #fff;
}

@media screen and (max-width: 1400px) {
	.cvrbtnset {
		font-size: calc(18px + 20 * (100vw - 300px) / 1100);
	}
	.cvrbtnset em {
		font-size: calc(10px + 4 * (100vw - 300px) / 1100);
	}
}
@media screen and (max-width: 1024px) {
	.cvrbtnset a,
	.cvrbtnset a:link {
		padding: .8em 1.0em;
	}
	.cvrbtnset a .icon-to-right {
		right: 0.8em;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

#pageTopBtn {
	position: relative;
	position: fixed;
	bottom: -100px;
	right: 20px;
	width: 60px;
	height: 60px;
	background-color: var(--base-color-black);
	border: 2px solid var(--base-color-black);
	border-radius: 50%;
	z-index: 9989;
	transition: background-color var(--base-transition-time), bottom var(--base-transition-time);
}
#pageTopBtn.is--active {
	bottom: 20px;
}
#pageTopBtn svg {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	fill: #fff;
	transition: top var(--base-transition-time);
}
#pageTopBtn:hover {
	background-color: #fff;
}
#pageTopBtn:hover svg {
	top: -20px;
	fill: var(--base-color-black);
}
@media screen and (max-width: 1024px) {
	#pageTopBtn {
		bottom: -100px;
		right: 20px;
	}
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/

footer {
	position: sticky;
	top: 100vh;
	left: 0;
	width: 100%;
	color: #fff;
	background-color: var(--base-color-black);
}
#footer {
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1120px;
	margin: auto;
}
#footerMenu {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	grid-gap: 40px;
	gap: 40px;
	padding: 80px 0;
}
#footerMenu h2 {
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	line-height: 1;
	letter-spacing: .05em;
}
#footerMenu ul {
	position: relative;
	margin-top: 1.5em;
	padding-top: .6em;
}
#footerMenu ul::after {
	position: absolute;
	content: '';
	top: 0;
	left: 0;
	width: 1.5em;
	height: 1px;
	background-color: rgba(255, 255, 255, .5);
}
#footerMenu li {
	margin-top: 1.2em;
	font-size: 14px;
	line-height: 1;
}
#footerMenu li,
#footerBtm li {
	margin-left: 1.2em;
}
#footerMenu a {
	position: relative;
	color: #fff;
	line-height: 1.2;
	text-decoration: none;
}
#footerMenu a::after,
#footerBtm ul:nth-child(1) a::after {
	position: absolute;
	content: '';
	top: .7em;
	left: -1.2em;
	width: .4em;
	height: 1px;
	background-color: #fff;
	transition: left var(--base-transition-time);
}
#footerMenu a:hover::after,
#footerBtm ul:nth-child(1) a:hover::after {
	left: -.8em;
}

/*---------------------------------------------------------*/

#footerBtm {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 20px 0;
	border-top: 1px solid rgba(255, 255, 255, .3);
}
#footerBtm li:nth-child(1) {
	margin-right: 20px;
}
#footerBtm ul:nth-child(1) a {
	position: relative;
	font-size: 14px;
	color: #fff;
	line-height: 1.2;
	text-decoration: none;
}

#footerBtm-sns a {
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
}
.footerBtm-sns--instagram a {
	background: url(../img/common/snsbk-instagram.png) no-repeat 50% 50%;
	background-size: cover;
}
.footerBtm-sns--instagram a svg {
	fill: #fff;
}

address {
	margin: 1em 0;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	line-height: 1;
}
@media screen and (min-width: 1025px) {
	#footerBtm ul {
		display: flex;
		flex-wrap: wrap;
	}
	address {
		margin-left: auto;
	}
}
@media screen and (max-width: 1024px) {
	#footerMenu {
		padding: 40px 0;
	}
	#footerBtm ul:nth-child(1) li {
		margin-top: 1em;
	}
	#footerBtm-sns {
		margin-left: auto;
	}
	address {
		width: 100%;
		margin: 2em 0;
	}
}

/*---------------------------------------------------------*/
/* index.html */
/*---------------------------------------------------------*/


@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
@keyframes infinity-scroll-right {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0%);
	}
}

#index #fv {
	position: relative;
}
@keyframes fvcatch {
	0% {
		filter: blur(20px);
		opacity: 0;
	}
	100% {
		filter: blur(0);
		opacity: 1;
	}
}

#index .fv-wrap {
	display: flex;
	overflow: hidden;
}

#index .fv-wrap-list {
	display: flex;
}

#index .fv-wrap-list--left {
	animation :infinity-scroll-left 95s infinite linear 0.5s both;
}
#index .fv-wrap-list--right {
	animation :infinity-scroll-right 95s infinite linear 0.5s both;
}
#index .fv-wrap-list-item img {
	width: auto;
	height: calc( 50vh - 50px );
	min-height: 280px;
	max-height: 500px;
}

#index #fv-scroll {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: absolute;
	bottom: 20px;
	right: 50px;
	width: 120px;
	height: 120px;
	border: 2px solid var(--base-color-blue);
	border-radius: 50%;
}
#index #fv-scroll span {
	margin-bottom: 1em;
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	font-size: 10px;
	color: var(--base-color-blue);
	line-height: 1;
}
#index #fv-scroll svg {
	fill: var(--base-color-blue);
}
#index #fv-scroll div {
	position: relative;
	transition: top var(--base-transition-time);
	animation: fvscroll 2s ease-in-out infinite;
}
@keyframes fvscroll {
	0%,30%{top:0;}
	15%,45%{top:10px;}
	100%{top:0;}
}

#index #fv #fv-catch .st0 {
	enable-background:new;
	fill: var(--base-color-blue);
	stroke: var(--base-color-blue);
	stroke-dasharray: 2000;
	stroke-dashoffset: 0;
	stroke-width: 1;
}
#index #fv .fv-catch-is-active .st0 {
	animation: indexCatch 5s ease-in 0s;
}
@keyframes indexCatch {
	0% {
		stroke-dashoffset: 2000;
		fill:transparent;
	}
	5% {
		stroke-dashoffset: 2000;
		fill:transparent;
	}
	80% {
		fill:transparent;
	}
	100% {
		stroke-dashoffset: 0;
		fill: var(--base-color-blue);
	}
}

@media screen and (min-width: 1025px) {
	#index #fv #fv-catch {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 10;
	}
}
@media screen and (max-width: 1024px) {
	#index #fv {
		padding-top: 70px;
	}
	#index .fv-wrap-list-item img {
		height: 30svh;
		min-height: 100px;
		max-height: 320px;
	}
	#index #fv #fv-catch {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		height: 20svh;
		padding: 20px;
	}
	#index #fv #fv-catch svg {
		width: auto;
		max-width: 80vw;
		height: auto;
		max-height: 80%;
	}
	#index #fv-scroll {
		right: 0;
		left: 0;
		margin: auto;
		width: 60px;
		height: 60px;
	}
	#index #fv-scroll span {
		display: none;
	}
}

/*---------------------------------------------------------*/

.section--gradation {
	background: rgb(6,108,187);
	background: linear-gradient(135deg, #066CBB 0%, #0492C7 100%);
}
#index .section-inner,
#common-message .section-inner {
	position: relative;
	width: calc( 100vw - 16% );
	min-width: 280px;
	max-width: 1120px;
	margin: auto;
}
@media screen and (min-width: 1025px) {
	#index .section-inner,
	#common-message .section-inner {
		padding: 120px 0;
	}
}
@media screen and (max-width: 1024px) {
	#index .section-inner,
	#common-message .section-inner {
		padding: 60px 0;
	}
}

/*---------------------------------------------------------*/

.index-title h2 {
	position: relative;
	margin-bottom: .5em;
	font-size: 18px;
	line-height: 1;
}
.index-title h2::after,
.index-title em::after {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	width: 100%;
	height: 110%;
	background-color: #fff;
}
#index-about .index-title h2::after,
#index-about .index-title em::after {
	background-color: var(--base-color-black);
}
.index-title em {
	position: relative;
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	font-size: 92px;
	font-style: normal;
	line-height: 1;
}
.section--gradation .index-title {
	color: #fff;
}

.index-title-is-active h2::after,
.index-title-is-active em::after {
	animation: animeTitle .5s ease .3s forwards;
}

@media screen and (min-width: 1025px) {
	.index-title-txt {
		display: flex;
		flex-direction: column;
	}
	#index-interview .index-title-txt > *,
	#index-message .index-title-txt > * {
		margin-right: auto;
	}
	#index-about .index-title-txt > * {
		margin-left: auto;
	}
	.index-title h2 {
		margin-left: .4em;
	}
}
@media screen and (max-width: 1024px) {
	.index-title-txt {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.index-title-txt > * {
		margin: auto;
		text-align: center;
	}
	.index-title {
		margin-top: 0;
	}
}

@media screen and (max-width: 1400px) {
	.index-title h2 {
		font-size: calc(16px + 2 * (100vw - 300px) / 1100);
	}
	.index-title em {
		font-size: calc(28px + 64 * (100vw - 300px) / 1100);
	}
}

/*---------------------------------------------------------*/

.index-about {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-left: -6%;
}
.index-about > div {
	width: calc( 33.33% - 6% );
	min-width: 260px;
	max-width: 320px;
	margin: 100px 0 0 6%;
}
.index-about-icon img {
	width: 100%;
	height: auto;
	border: 1px solid var(--base-color-black);
	border-radius: 50%;
}
.index-about h3 {
	margin: 1em auto;
	font-size: 24px;
	line-height: 1.0;
	text-align: center;
}
.index-about p {
	margin: 1.6em auto;
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}
.index-about a {
	display: flex;
	justify-content: center;
	position: relative;
	width: 160px;
	margin: 0 auto;
	padding: .8em 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	line-height: 1;
	color: var(--base-color-black);
	border: 2px solid var(--base-color-black);
	border-radius: 5em;
	text-decoration: none;
	transition: border-color var(--base-transition-time), color var(--base-transition-time);
}
.index-about a .icon-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.0em;
	margin: auto;
	fill: var(--base-color-black);
	transition: right var(--base-transition-time);
}
.index-about a:hover {
	color: var(--base-color-blue);
	border-color: var(--base-color-blue);
	fill: var(--base-color-blue);
}
.index-about a:hover .icon-to-right svg {
	fill: var(--base-color-blue);
}
.index-about a:hover .icon-to-right {
	right: -1em;
}

@media screen and (min-width: 1025px) {}
@media screen and (max-width: 1024px) {
	.index-about > div {
		margin-top: 60px;
	}
}

/*---------------------------------------------------------*/

.index-message {
	width: 90%;
	margin: 0 auto;
}
.index-message-main {
	color: #fff;
}
.index-message-main p {
	font-weight: bold;
	font-size: 30px;
	line-height: 1.6;
}
.index-message-main em {
	position: relative;
	display: flex;
	align-items: center;
	margin-top: .8em;
	padding-left: 2.4em;
	font-style: normal;
	font-size: 16px;
}
.index-message-main em::before {
	position: absolute;
	content: '';
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 1.6em;
	height: 1px;
	font-size: 16px;
	background-color: #fff;
}
.index-message-main em span:nth-child(1) {
	line-height: 1;
}
.index-message-main em span:nth-child(2) {
	padding-left: .6em;
	font-size: 22px;
	line-height: 1;
}
.index-message-pht {
	width: 40%;
	min-width: 300px;
	max-width: 360px;
}
.index-message-pht img {
	width: 100%;
	height: auto;
	border-radius: 50%;
	object-fit: cover;
}
.index-message-main a {
	display: inline-flex;
	position: relative;
	margin-top: 1.4em;
	padding: .8em 3.4em .8em 1.4em;
	font-family: 'Montserrat', sans-serif;
	line-height: 1;
	color: #fff;
	border: 2px solid #fff;
	border-radius: 5em;
	text-decoration: none;
	transition: background-color var(--base-transition-time);
}
.index-message-main a .icon-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.0em;
	margin: auto;
	fill: #fff;
	transition: right var(--base-transition-time);
}
.index-message-main a:hover {
	background-color: rgba(255, 255, 255, .1);
}
.index-message-main a:hover .icon-to-right {
	right: -1em;
}

@media screen and (max-width: 1400px) {
	.index-message-main p {
		font-size: calc(16px + 14 * (100vw - 300px) / 1100);
	}
}
@media screen and (min-width: 821px) {
	.index-message {
		display: flex;
		align-items: center;
		width: 100%;
		margin: 80px auto;
	}
	.index-title + .index-message {
		margin-top: 100px;
	}
	.index-message:last-child {
		margin-bottom: 0;
	}
	#index-message > div > div:nth-child(odd) {
		flex-direction: row-reverse;
	
	}
	.index-message:nth-child(even) .index-message-main {
		padding-left: 80px;
	}
	.index-message:nth-child(odd) .index-message-main {
		padding-right: 80px;
	}
}
@media screen and (max-width: 820px) {
	.index-message {
		max-width: 360px;
		margin: 60px auto;
	}
	.index-message:last-child {
		margin-bottom: 0;
	}
	.index-message-pht {
		width: 240px;
		min-width: 240px;
		max-width: 240px;
		margin: 0 auto;
	}
	.index-message-main {
		display: flex;
		flex-direction: column;
		padding: 20px 0 0 0;
	}
	.index-message-main p {
		text-align: center;
	}
	.index-message-main em,
	.index-message-main a {
		justify-content: flex-end;
		margin-left: auto;
	}
	.index-message-main em span:nth-child(1) {
		font-size: 12px;
	}
	.index-message-main em span:nth-child(2) {
		font-size: 16px;
	}
}

/*---------------------------------------------------------*/


.index-instagram-wrap {
	width: calc( 100vw - 16% );
	min-width: 280px;
	/* max-width: 1120px; */
	margin: 0 auto;
	margin-top: 100px;
}
.index-instagram-wrap ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	justify-content: center;
	gap: 30px;
}
/* .index-instagram-wrap ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: -30px 0 0 -30px;
}
.index-instagram-wrap li {
	width: calc( 33.3% - 30px );
	margin: 30px 0 0 30px;
}
.index-instagram-wrap li a {
	position: relative;
	display: block;
	padding-top: 100%;
	overflow: hidden;
}
.index-instagram-wrap img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 100%;
	height: auto;
} */
@media screen and (max-width: 1420px) {
	.index-instagram-wrap ul {grid-template-columns: 1fr 1fr;}
	.index-instagram-wrap li:nth-child(3) {
		display: none;
	}
}
@media screen and (max-width: 1020px) {
	.index-instagram-wrap ul {grid-template-columns: 1fr;}
	.index-instagram-wrap li {
		display: grid;
		justify-content: center;
	}
	.index-instagram-wrap li:nth-child(3),
	.index-instagram-wrap li:nth-child(2) {
		display: none;
	}
}

.index-instagram-btn {
	display: flex;
	justify-content: center;
	margin: 30px auto 100px auto;
}
.index-instagram-btn a {
	display: flex;
	align-items: center;
	text-decoration: none;
	color: var(--base-color-black);
}
.index-instagram-btn a div {
	width: 60px;
	height: 60px;
	margin-right: .5em;
	border-radius: 50%;
	background: url(../img/common/snsbk-instagram.png) no-repeat 50% 50%;
	background-size: cover;
	fill: #fff;
}
.index-instagram-btn a div svg {
	width: 100%;
	height: auto;
}
@media screen and (max-width: 1024px) {
	.index-instagram-wrap {
		margin-top: 60px;
	}
	.index-instagram-btn {
		margin-bottom: 40px;
	}
}
@media screen and (max-width: 824px) {
	/* .index-instagram-wrap li {
		width: calc( 50% - 30px );
	} */
}

/*---------------------------------------------------------*/
/* message-xxx.html */
/*---------------------------------------------------------*/

#message a.messagebtn {
	display: inline-flex;
	position: relative;
	margin-top: 2.0em;
	padding: 1.0em 3.4em 1.0em 1.4em;
	font-size: 18px;
	line-height: 1;
	color: #fff;
	border: 2px solid var(--base-color-blue);
	border-radius: 5em;
	text-decoration: none;
	background-color: var(--base-color-blue);
	transition: background-color var(--base-transition-time);
}
#message a.messagebtn .icon-to-right {
	display: flex;
	align-items: center;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1.0em;
	margin: auto;
	fill: #fff;
	transition: right var(--base-transition-time);
}
#message a.messagebtn:hover {
	color: var(--base-color-blue);
	background-color: #fff;
}
#message a.messagebtn:hover .icon-to-right {
	fill: var(--base-color-blue);
	right: -.8em;
}

#message .message-set-main p {
	font-size: 18px;
	line-height: 2.4;
}
#message .message-set-main p:not(:nth-child(1)) {
	margin-top: 1.6em;
}

#message .message-set:nth-child(1) {
	position: relative;
	top: 100px;
	opacity: 0;
}
#message .message-set:nth-child(2) .message-set-title,
#message .message-set:nth-child(2) .message-set-main {
	position: relative;
	top: 100px;
	opacity: 0;
}
#message .message-set-is-active {
	animation: animeTopOpacity 1s ease .3s forwards;
}
#message .message-set:nth-child(2) .message-set-title-is-active,
#message .message-set:nth-child(2) .message-set-main-is-active {
	animation: animeTopOpacity 1s ease .3s forwards;
}

@media screen and (min-width: 1025px) {
	#message .message-set {
		position: relative;
	}
	#message .message-set:nth-child(2) {
		padding: 120px 80px 0 0;
	}
	#message .message-set::after {
		position: absolute;
		content: '';
		top: 0;
		height: 100%;
		border-bottom: 1px solid var(--base-line-color);
		z-index: -1;
	}
	#message .message-set:nth-child(1):after {
		left: 80px;
		width: calc( 100% - 80px );
		border-left: 1px solid var(--base-line-color);
	}
	#message .message-set:nth-child(2):after {
		right: 0;
		width: 100%;
		border-right: 1px solid var(--base-line-color);
		border-bottom: none;
	}

	#message .message-set-title {
		position: relative;
	}
	#message .message-set-title-pht {
		width: 50%;
	}
	#message .message-set-title-pht img {
		display: block;
		width: 100%;
		height: auto;
	}
	#message .message-set-title h3 {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 60%;
		padding: .6em 1.0em;
		font-size: 32px;
		line-height: 1.4;
		color: #fff;
		z-index: 10;
	}
	#message .message-set-title h3::after {
		position: absolute;
		content: '';
		top: 0;
		left: 0;
		width: 0;
		height: 100%;
		background-color: var(--base-color-blue-RGBa-90);
		z-index: -1;
	}
	#message .message-set-title-is-active h3::after {
		animation: animeWidth100 .8s ease .3s forwards;
	}
	#message .message-set:nth-child(1) .message-set-main {
		margin-left: 80px;
		padding: 80px 0 80px 80px;
	}
	#message .message-set:nth-child(2) .message-set-main {
		margin-right: 80px;
		padding: 80px 0;
	}
}

@media screen and (max-width: 1400px) {
	#message a.messagebtn,
	#message .message-set-main p {
		font-size: calc(14px + 4 * (100vw - 300px) / 1100);
	}
	#message .message-set-title h3 {
		font-size: calc(20px + 12 * (100vw - 300px) / 1100);
	}
}
@media screen and (max-width: 1024px) {
	#message .message-set {
		margin-top: 60px;
	}
	#message .message-set:last-child {
		padding-bottom: 60px;
	}
	#message .message-set-title h3 {
		margin-bottom: 60px;
		text-align: center;
		color: var(--base-color-blue);
	}
	#message .message-set-title-pht {
		margin: 60px auto;
	}
	#message .message-set-title-pht img {
		width: calc( 100% - 30vw );
		min-width: 280px;
		max-width: 540px;
		height: auto;
		margin: auto;
	}
}

/*---------------------------------------------------------*/
/* interview-xxx.htnk */
/*---------------------------------------------------------*/

#interviewDetail .intervew-set-main h3 {
	display: inline-block;
	position: relative;
	margin-bottom: 1.8em;
	padding-left: 36px;
	font-size: 24px;
	line-height: 1.2;
	color: var(--base-color-blue);
}
#interviewDetail .intervew-set-main h3::after {
	position: absolute;
	content: '';
	top: 0.5em;
	left: 0;
	width: 24px;
	height: 2px;
	background-color: var(--base-color-blue);
}
#interviewDetail .intervew-set-main p {
	font-size: 18px;
	line-height: 2.0em;
}
#interviewDetail .intervew-set-pht img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 1400px) {
	#interviewDetail .intervew-set-main h3 {
		font-size: calc(18px + 7 * (100vw - 300px) / 1100);
	}
	#interviewDetail .intervew-set-main p {
		font-size: calc(14px + 4 * (100vw - 300px) / 1100);
	}
}
@media screen and (min-width: 1025px) {
	#interviewDetail .intervew-set {
		display: flex;
		padding: 80px;
		position: relative;
		overflow: hidden;
	}
	#interviewDetail .intervew-set:not(:nth-child(1)) > div {
		position: relative;
		width: calc( 50% - 40px );
	}
	#interviewDetail .intervew-set:nth-child(odd) {
		padding-right: 0;
	}
	#interviewDetail .intervew-set:nth-child(even) {
		padding-left: 0;
	}
	#interviewDetail .intervew-set:nth-child(1) {
		padding-left: 160px;
	}
	#interviewDetail .intervew-set:nth-child(odd):not(:nth-child(1)) .intervew-set-main,
	#interviewDetail .intervew-set:nth-child(even) .intervew-set-pht {
		opacity: 0;
		left: -200px;
	}
	#interviewDetail .intervew-set:nth-child(even):not(:nth-child(1)) .intervew-set-main,
	#interviewDetail .intervew-set:nth-child(odd) .intervew-set-pht {
		opacity: 0;
		right: -200px;
	}
	#interviewDetail .intervew-set:nth-child(odd).intervew-set-is-active .intervew-set-main,
	#interviewDetail .intervew-set:nth-child(even).intervew-set-is-active .intervew-set-pht {
		animation: animeToLeftOpacity 1s ease .3s forwards;
	}
	#interviewDetail .intervew-set:nth-child(odd).intervew-set-is-active .intervew-set-pht,
	#interviewDetail .intervew-set:nth-child(even).intervew-set-is-active .intervew-set-main {
		animation: animeToRightOpacity 1s ease .3s forwards;
	}

	#interviewDetail .intervew-set::after {
		position: absolute;
		content: '';
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border-bottom: 1px solid var(--base-line-color);
		z-index: -1;
	}
	#interviewDetail .intervew-set:last-child:after {
		border-bottom: none;
	}
	#interviewDetail .intervew-set:nth-child(odd)::after {
		border-left: 1px solid var(--base-line-color);
	}
	#interviewDetail .intervew-set:nth-child(even)::after {
		border-right: 1px solid var(--base-line-color);
	}
	#interviewDetail .intervew-set:nth-child(1)::after {
		left: 80px;
		border-left: 1px solid var(--base-line-color);
	}
	#interviewDetail .intervew-set:nth-child(odd) .intervew-set-pht {
		margin-left: 80px;
	}
	#interviewDetail .intervew-set:nth-child(even) {
		flex-direction: row-reverse;
	}
	#interviewDetail .intervew-set:nth-child(even) .intervew-set-pht {
		margin-right: 80px;
	}
	
}
@media screen and (max-width: 1024px) {
	#interviewDetail .intervew-set {
		margin: 60px auto;
	}
	#interviewDetail .intervew-set-main h3 {
		margin-bottom: 50px;
		padding-left: 0;
	}
	#interviewDetail .intervew-set-main h3::after {
		width: 50%;
		left: calc( -50% - .5em );
	}
	#interviewDetail .intervew-set-pht {
		width: 100%;
		margin-top: 60px;
	}
	#interviewDetail .intervew-set-pht img {
		width: calc( 100% - 30vw );
		min-width: 280px;
		max-width: 540px;
		height: auto;
		margin: 0 auto;
	}
	#interviewDetail .intervew-set:nth-child(odd) .intervew-set-pht {
		margin-left: auto;
	}
}

/*---------------------------------------------------------*/
/* diary-xxx.html */
/*---------------------------------------------------------*/

#diaryDetail .section-inner::before {
	position: absolute;
	content: '';
	top: 6px;
	left: 0;
	width: 2px;
	height: calc( 100% - 12px );
	background-color: var(--base-color-blue);
}
#diaryDetail .section-inner::after {
	position: absolute;
	content: '';
	bottom: -9px;
	left: -9px;
	width: 20px;
	height: 20px;
	background-color: var(--base-color-blue);
	border-radius: 50%;
}

#diaryDetail .diary-set:not(:nth-child(1)) {
	margin-top: 80px;
	margin-bottom: 80px;
}
#diaryDetail .diary-set {
	position: relative;
	margin-left: 100px;
}
#diaryDetail .diary-set:not(:nth-child(1)) {
	top: 100px;
	opacity: 0;
}
#diaryDetail .diary-set-is-active {
	animation: animeTopOpacity 1s ease .3s forwards;
}

#diaryDetail .diary-set h3 {
	position: relative;
	margin-top: -.5em;
	font-size: 24px;
	line-height: 1;
	color: var(--base-color-blue);
}
#diaryDetail .diary-set h3 em {
	display: inline-block;
	font-style: normal;
	width: 3.5em;
	font-size: 18px;
}
#diaryDetail .diary-set h3::before {
	position: absolute;
	content: '';
	top: 6px;
	left: -105px;
	width: 12px;
	height: 12px;
	background-color: var(--base-color-blue);
	border-radius: 50%;
}
#diaryDetail .diary-set:nth-child(1) h3::before {
	position: absolute;
	content: '';
	top: 2px;
	left: -109px;
	width: 20px;
	height: 20px;
	background-color: var(--base-color-blue);
	border-radius: 50%;
}
#diaryDetail .diary-set h3::after {
	position: absolute;
	content: '';
	top: 11px;
	left: -100px;
	width: 70px;
	height: 2px;
	background-color: var(--base-color-blue);
}
#diaryDetail .diary-set-day h3 {
	font-size: 32px;
}
#diaryDetail .diary-set-day:nth-child(1) h3::before {
	top: 5px;
}
#diaryDetail .diary-set-day:nth-child(1) h3::after {
	top: 14px;
}
#diaryDetail .diary-set > div {
	margin-top: 1.5em;
}
#diaryDetail .diary-set div p {
	flex-grow: 2;
	font-size: 18px;
	line-height: 2.2em;
}
#diaryDetail .diary-set div div {
	margin-left: 60px;
}

@media screen and (max-width: 1400px) {
	#diaryDetail .diary-set h3 {
		font-size: calc(18px + 6 * (100vw - 300px) / 1100);
	}
	#diaryDetail .diary-set-day h3 {
		font-size: calc(20px + 12 * (100vw - 300px) / 1100);
	}
	#diaryDetail .diary-set h3 em {
		font-size: calc(14px + 4 * (100vw - 300px) / 1100);
	}
	#diaryDetail .diary-set div p {
		font-size: calc(14px + 4 * (100vw - 300px) / 1100);
	}
}
@media screen and (min-width: 1025px) {
	#diaryDetail .diary-set h3 {
		display: flex;
		align-items: center;
	}
	#diaryDetail .diary-set div {
		display: flex;
	}
}
@media screen and (max-width: 1024px) {
	#diaryDetail .section-inner::after {
		bottom: -7px;
		left: -7px;
		width: 16px;
		height: 16px;
	}
	#diaryDetail .diary-set:not(:nth-child(1)) {
		margin-top: 40px;
		margin-bottom: 40px;
	}
	#diaryDetail .diary-set {
		margin-left: 40px;
	}
	#diaryDetail .diary-set h3 em {
		display: block;
		margin-bottom: .5em;
	}
	#diaryDetail .diary-set h3::before {
		top: 3px;
		left: -44px;
		width: 10px;
		height: 10px;
	}
	#diaryDetail .diary-set:nth-child(1) h3::before {
		top: 1px;
		left: -47px;
		width: 16px;
		height: 16px;
	}
	#diaryDetail .diary-set:nth-child(1) h3::before {
		top: 2px;
	}
	#diaryDetail .diary-set h3::after {
		top: 7px;
		left: -40px;
		width: 30px;
	}
	#diaryDetail .diary-set:nth-child(1) h3::after {
		top: 9px;
	}
	#diaryDetail .diary-set div div {
		margin-top: 1.4em;
		margin-left: 0;
	}
	#diaryDetail .diary-set img {
		width: 100%;
		max-width: 360px;
		height: auto;
		margin-left: auto;
	}
}

/*---------------------------------------------------------*/
/* company.html */
/*---------------------------------------------------------*/

#company .section-flex {
	position: relative;
	top: 100px;
	opacity: 0;
	animation: contentanime 1s ease .3s forwards;
}

#company #business .business-info {
	display: flex;
	flex-wrap: wrap;
	/* justify-content: center; */
	justify-content: space-around;
	margin-left: -30px;
}
#company #business .business-info > div {
	width: 256px;
	width: calc( 25% - 30px );
	min-width: 240px;
	margin: 80px 0 0 30px;
}
@media screen and (max-width: 1024px) {
	#company #business .business-info {
		margin-left: -50px;
	}
	#company #business .business-info > div {
		width: calc( 40% - 50px );
		margin: 80px 0 0 50px;
	}
}

#company #business .business-info-icon img {
	width: 100%;
	height: auto;
	border: 1px solid var(--base-color-black);
	border-radius: 50%;
}
#company #business .business-info h4 {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 5em;
	font-size: 18px;
	line-height: 1.2;
	text-align: center;
}
#company #business .business-info p {
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}

@media screen and (min-width: 1025px) {
	#company .section-flex {
		display: flex;
		align-items: flex-start;
	}
	#company .section-flex-title h3 {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 240px;
		height: 240px;
		margin-right: 40px;
		font-size: 20px;
		line-height: 1;
		color: #fff;
		background-color: var(--base-color-blue);
	}
	
	#company #information > div:not(.section-flex-title) {
		width: calc( 100% - 280px );
	}

	#company #history > div:not(.section-flex-title) {
		width: calc( 100% - 280px );
		border-bottom: 1px solid var(--base-line-color);
	}
	#company #history .history-block {
		display: flex;
		border-top: 1px solid var(--base-line-color);
	}
	#company #history .history-block h4 {
		width: 6em;
		font-weight: normal;
		font-size: 16px;
		padding: 20px 0;
		line-height: 1.4;
	}
	#company #history .history-block-detail {
		width: calc( 100% - 6em );
	}
	#company #history .history-block-detail dl {
		display: flex;
		width: 100%;
		padding: 20px 0;
		line-height: 1.4;
	}
	#company #history .history-block-detail dl:not(:nth-child(1)) {
		border-top: 1px solid var(--base-line-color);
	}
	#company #history .history-block-detail dt {
		width: 4em;
		padding-right: 1em;
		text-align: right;
	}
	#company #history .history-block-detail dd {
		width: calc( 100% - 4em );
	}
}

@media screen and (max-width: 1024px) {
	#company .section-flex-title {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
	}
	#company .section-flex-title::after {
		position: absolute;
		content: '';
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		width: 100%;
		height: 1px;
		background-color: var(--base-color-blue);
		z-index: -1;
	}
	#company .section-flex-title > * {
		position: relative;
		padding: 0 .4em;
		line-height: 1.2;
		color: var(--base-color-blue);
		background-color: #fff;
		z-index: 1;
	}

	#company #information > div:not(.section-flex-title),
	#company #history > div:not(.section-flex-title) {
		margin-top: 20px;
		border-top: 1px solid var(--base-line-color);
	}
	#company #history .history-block {
		padding: 16px 0;
		border-bottom: 1px solid var(--base-line-color);
	}
	#company #history .history-block h4 {
		font-weight: normal;
		font-size: 12px;
		color: var(--base-color-blue);
		line-height: 1.0;
	}
	#company #history .history-block dl {
		margin-top: 10px;
		display: flex;
	}
	#company #history .history-block dt {
		width: 3.5em;
	}
	#company #history .history-block dd {
		width: calc( 100% - 3.5em );
		font-size: 14px;
	}

	#company #business .business-info > div {
		margin-top: 40px;
	}
	#company #business .business-info h4 {
		height: 4em;
		font-size: 16px;
	}
}

/*---------------------------------------------------------*/
/* philosophy.html */
/*---------------------------------------------------------*/

#philosophy .philosophyBox {
	display: flex;
	margin: 80px auto;
}

#philosophy .philosophyBox > div:nth-child(1) {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 32%;
	min-height: 320px;
	padding: 80px 10px;
	color: var(--base-color-blue);
	border-top: 5px solid var(--base-color-blue);
	border-bottom: 2px solid var(--base-color-blue);
}
#philosophy .philosophyBox > div:nth-child(2) {
	display: flex;
	align-items: center;
	width: 68%;
	min-height: 320px;
	padding: 80px 20px;
	border-top: 5px solid var(--base-line-color);
	border-bottom: 2px solid var(--base-line-color);
}

#philosophy .philosophyBox h3 {
	font-size: 32px;
	line-height: 1;
}
#philosophy .philosophyBox em {
	margin-top: .6em;
	font-family: 'Montserrat', sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: 1;
}
#philosophy .philosophyBox p {
	font-size: 20px;
	line-height: 2.4;
}
/* #philosophy .philosophyBox p .inlineblock {
	display: block;
} */

@media screen and (max-width: 1024px) {
	#philosophy .philosophyBox h3 {
		font-size: calc(20px + 12 * (100vw - 300px) / 1100);
	}
	#philosophy .philosophyBox em {
		font-size: calc(10px + 8 * (100vw - 300px) / 1100);
	}
	#philosophy .philosophyBox p {
		font-size: calc(14px + 6 * (100vw - 300px) / 1100);
	}

	#philosophy .philosophyBox {
		flex-direction: column;
	}
	#philosophy .philosophyBox > div:nth-child(1) {
		width: 100%;
		min-height: auto;
		padding: 30px 0;
		border-bottom-width: 1px;
	}
	#philosophy .philosophyBox > div:nth-child(2) {
		justify-content: center;
		width: 100%;
		min-height: auto;
		padding: 30px 0;
		border-top: none;
		border-bottom-width: 5px;
	}
	#philosophy .philosophyBox p {
		text-align: center;
	}

	/* #philosophy .philosophyBox p .inlineblock {
		display: inline-block;
	} */
}

/*---------------------------------------------------------*/
/* event.html */
/*---------------------------------------------------------*/

#event .section-inner {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 60px;
}
#event .eventset-thm {
	position: relative;
	max-width: 320px;
	margin: auto;
}
#event .eventset-thm img {
	width: 100%;
	height: auto;
}
#event .eventset-thm em {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 54px;
	height: 54px;
	font-family: 'Montserrat', sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 1;
	color: #fff;
	background-color: var(--base-color-blue);
}

#event .eventset-caption {
	margin-top: .8em;
	text-align: center;
	line-height: 1.2;
}

@media screen and (max-width: 824px) {
	#event section {
		gap: 40px;
	}
}

/*---------------------------------------------------------*/
/* benefit.html */
/*---------------------------------------------------------*/

#benefit .section-inner {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 60px;
}

#benefit .benefitset img {
	width: 100%;
	max-width: 320px;
	height: auto;
	margin: auto;
}
#benefit .benefitset-caption em {
	display: block;
	margin: 1.0em 0 .8em 0;
	font-weight: bold;
	font-style: normal;
	font-size: 20px;
	line-height: 1.2;
	text-align: center;
}
#benefit .benefitset-caption p {
	max-width: 320px;
	margin: auto;
	font-size: 14px;
	line-height: 1.6;
}

@media screen and (max-width: 824px) {
	#benefit section {
		gap: 40px;
	}
	#benefit .benefitset-caption em {
		font-size: 16px;
	}
	#benefit .benefitset-caption p {
		text-align: center;
	}
}

/*---------------------------------------------------------*/
/* survey.html */
/*---------------------------------------------------------*/

#survey .section-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-top: -2px;
}
#survey .section-inner > div {
	width: calc( 50% - 2px );
	margin: 2px 0 0 2px;
	background-color: var(--base-color-blue);
}
#survey .section-inner > div:last-child {
	width: calc( 100% - 2px );
}
#survey .section-inner > div img {
	width: 100%;
	height: auto;
}
@media screen and (max-width: 824px) {
	#survey .section-inner > div {
		width: calc( 100% - 2px );
	}
}

/*---------------------------------------------------------*/
/* recruit.html */
/*---------------------------------------------------------*/

#recruit .borderWrap-list {
	position: relative;
	margin-top: calc( 40px + .5em );
	border: 1px solid var(--base-color-blue);
}

#recruit .borderWrap-list dt {
	position: absolute;
	top: -.5em;
	left: 20px;
	padding: 0 10px;
	font-weight: bold;
	font-size: 18px;
	line-height: 1;
	color: var(--base-color-blue);
	background-color: #fff;
	z-index: 10;
}
#recruit .borderWrap-list dd {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(10em, 1fr));
	grid-gap: .5em;
	gap: .5em;
	padding: 30px;
}

@media screen and (max-width: 1024px) {
	#recruit .borderWrap-list dd {
		font-size: 12px;
	}
	#recruit .common-chippedBox:not(:nth-child(1)) {
		margin: 40px 0;
	}
}

#recruit #process img {
	display: block;
	width: 100%;
	height: auto;
	margin: auto;
}
@media screen and (max-width: 679px) {
	#recruit #process img {
		width: 80%;
		max-width: 360px;
		height: auto;
	}
}
#recruit #process .common-title-line + div {
	margin-top: 80px;
}

@media screen and (max-width: 1024px) {
	#recruit #process .common-title-line + div {
		margin-top: 60px;
	}
}

#recruit .faqset {
	position: relative;
}
#recruit .faqset:not(:last-child) {
	margin: 80px 0;
}
#recruit .faqset::after {
	position: absolute;
	content: '';
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: calc( 100% - 80px );
	height: 100%;
	border: 1px solid var(--base-color-black);
	z-index: -1;
}
#recruit .faqset h4 {
	position: relative;
	top: -.5em;
	left: 50%;
	display: inline-block;
	padding: 0 .5em;
	font-size: 20px;
	line-height: 1;
	background-color: #fff;
	transform: translateX(-50%);
}
#recruit .faqset dl {
	margin-top: 20px;
	font-size: 18px;
	background-color: #fff;
	border: 1px solid var(--base-color-black);
}
#recruit .faqset dt {
	position: relative;
	padding: 1.5em 4em;
	line-height: 1.4;
	background: url(../img/recruit/faq-icon-q.svg) no-repeat;
	background-size: 1.8em;
	background-position: 1.4em 1.3em;
	cursor: pointer;
}
#recruit .faqset dt::before {
	position: absolute;
	content: '';
	top: 0;
	right: calc( 1.9em + 5px );
	bottom: 0;
	margin: auto;
	width: 2px;
	height: 12px;
	background-color: var(--base-color-black);
	transition: var(--base-transition-time);
}
#recruit .faqset dt::after {
	position: absolute;
	content: '';
	top: 0;
	right: 1.9em;
	bottom: 0;
	margin: auto;
	width: 12px;
	height: 2px;
	background-color: var(--base-color-black);
}
#recruit .faqset dd {
	display: none;
	padding: 1em 1em 1em 4em;
	line-height: 2;
	background: url(../img/recruit/faq-icon-a.svg) no-repeat;
	background-size: 1.8em;
	background-position: 1.4em 1em;
	border-top: 1px dotted var(--base-color-black);
}

#recruit .faqset dt.faqset-is-active::before {
	transform: rotate(90deg);
}

@media screen and (max-width: 1024px) {
	#recruit .faqset:not(:last-child) {
		margin: 40px 0;
	}
	#recruit .faqset::after {
		width: calc( 100% - 20px );
	}
	#recruit .faqset h4 {
		font-size: 18px;
	}
	#recruit .faqset dl {
		margin-top: 10px;
		font-size: 16px;
	}
	#recruit .faqset h4 + dl {
		margin-top: 0;
	}
	#recruit .faqset dt {
		padding: 16px 34px 16px 42px;
		background-size: 24px;
		background-position: 10px 14px;
	}
	#recruit .faqset dt::before {
		right: 18px;
		height: 10px;
	}
	#recruit .faqset dt::after {
		right: 14px;
		width: 10px;
	}
	#recruit .faqset dd {
		padding: 12px 12px 12px 42px;
		background-size: 24px;
		background-position: 10px 14px;
	}
}

/*---------------------------------------------------------*/
/* entry.html */
/*---------------------------------------------------------*/

#entry dl {
	display: flex;
	border-top: 1px solid var(--base-line-color);
	border-bottom: 1px solid var(--base-line-color);
}
#entry dl + dl {
	border-top: none;
}
#entry dt {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 320px;
	padding: 20px;
	background-color: #fafafa;
}
#entry dd {
	width: calc( 100% - 320px );
	padding: 20px 0 20px 20px;
	word-break:break-all;
	word-wrap:break-word;
	overflow-wrap: break-word;
}

#entry dt p {
	line-height: 1.2;
}

#formset .tag {
	margin-right: 1em;
	padding: .5em .8em;
	font-size: 10px;
	line-height: 1;
	color: #fff;
	border-radius: 5em;
	white-space: nowrap;
}
#formset .tag-required {
	background-color: #BA0E0E;
}
#formset .tag-free {
	background-color: var(--base-color-green);
}

#formset .error {
	position: relative;
	z-index: 9981;
}
#formset .error span:not(:empty) {
	position: relative;
	bottom: 8px;
	left: 0;
	display: block;
	width: 100%;
	padding: .6em 1em;
	font-size: 12px;
	line-height: 1.2;
	color: #fff;
	background-color: #BA0E0E;
	box-shadow: 0 0 8px rgba(0, 0, 0, .2);
}
#formset .error span:not(:empty):after {
	position: absolute;
	content: '';
	bottom: -8px;
	left: 15px;
	width: 0;
	height: 0;
	border-top: 10px solid #BA0E0E;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
}

#formset .note {
	margin: 10px 0;
	font-size: 80%;
	line-height: 1.2;
}
#formset dd .note:last-child {
	margin-bottom: 0;
}
#formset dl + .note,
#formset > .note {
	margin-top: 30px;
	text-align: center;
}

#formset dd > *:not(div.error):not(:last-child) {
	margin-bottom: 10px;
}
#formset dd > * + div.error {
	margin-top: 20px;
}

#formset fieldset {
	position: relative;
	border: none;
	padding: 0;
}
#formset fieldset::after {
	position: absolute;
	content: '';
	top: -10px;
	left: 12px;
	width: 1em;
	height: 1em;
	border-top: 1px solid var(--base-line-color);
	border-left: 1px solid var(--base-line-color);
	z-index: -1;
}
#formset fieldset legend {
	position: relative;
	left: 2em;
	display: inline-block;
	padding: 0 .5em 3px .5em;
	font-size: 12px;
	line-height: 1;
	background-color: #fff;
}

.formflexbox {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	margin-top: -20px;
	margin-left: -20px;
}
.formflexbox > * {
	position: relative;
	margin-top: 20px;
	margin-left: 20px;
}
.formflexbox-2column > * {
	width: calc( 50% - 20px );
}
.formflexbox-3column > * {
	width: calc( 33.33% - 20px );
}

@media screen and (max-width: 1024px) {
	#entry dl {
		display: block;
	}
	#entry dt {
		width: 100%;
		padding: 10px;
		font-size: 14px;
	}
	#entry dd {
		width: 100%;
		padding: 20px 0;
	}

	.formflexbox {
		display: grid;
		gap: 20px;
		margin-top: 0;
		margin-left: 0;
	}
	.formflexbox > * {
		width: 100%;
		margin-top: 0;
		margin-left: 0;
	}
}

/*---------------------------------------------------------*/

input,
textarea,
select {
	-webkit-appearance: none;
	appearance: none;
	border: none;
	outline: none;
}

input[type="text"],
textarea {
	display: block;
	width: 100%;
	min-height: 40px;
	padding: 0 .8em;
	background-color: #fff;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time)
}
textarea {
	width: 100%;
	min-height: 40px;
	padding: 0.8em .8em;
	line-height: 1.6;
	background-color: #fff;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time);
}
input[type="text"].w50 {
	width: 50%;
}
@media screen and (max-width: 1024px) {
	input[type="text"].w50 {
		width: 100%;
	}
}

select {
	min-width: 50%;
	height: 40px;
	padding: 0 36px 0 .8em;
	line-height: 1.2;
	border-radius: 8px;
	border: 1px solid var(--base-line-color);
	outline: none;
	transition: var(--base-transition-time);
	background: #fff url(../img/form-arrow.svg) right 12px center no-repeat;
	background-size: 12px 12px;
}

::-webkit-input-placeholder {color:#bebebe}

input[type="text"]:focus,
textarea:focus,
select:focus {
	border-color: var(--base-color-blue);
	box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}
input[type="text"].error,
textarea.error,
select.error {
	border-color: #BA0E0E;
}

/*---------------------------------------------------------*/

input[type='radio'],
input[type='checkbox'] {
	width: 0;
	height: 0;
}
.radioset {
	display: flex;
	align-items: center;
}
.radioset label {
	cursor: pointer;
}
.radioset p {
	display: flex;
	align-items: center;
	position: relative;
	min-height: 40px;
	padding-left: 48px;
	line-height: 1.2;
}
.radioset label input {
	position: absolute;
	opacity: 0;
}
.radioset p::before {
	position:absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	width: 40px;
	height: 40px;
	background-color: #fff;
	border: 1px solid var(--base-line-color);
	transition: .3s;
}
.radioset input[type='radio'] + p::before {
	border-radius: 50%;
}
.radioset input[type='checkbox'] + p::before {
	border-radius: 8px;
}
.radioset input[type='radio'] + p::after {
	position:absolute;
	top: 0;
	bottom: 0;
	left: calc((40px - 18px)/2);
	margin: auto;
	content: '';
	width: 18px;
	height: 18px;
	border: 3px solid #E8E8E8;
	background-color: #E8E8E8;
	border-radius: 50%;
}
.radioset input[type='checkbox'] + p::after {
	position:absolute;
	top: 11px;
	left: 11px;
	content: '';
	width: 18px;
	height: 12px;
	border-left: 4px solid #E8E8E8;
	border-bottom: 4px solid #E8E8E8;
	transform: rotate(-45deg);
}
.radioset input[type='radio']:checked + p::before,
.radioset input[type='checkbox']:checked + p::before {
	background-color: var(--base-color-blue);
	border-color: var(--base-color-blue);
	box-shadow: 0 0 10px var(--base-color-blue);
}
.radioset input[type='radio']:checked + p::after {
	background-color: #fff;
	border-color: #fff;
}
.radioset input[type='checkbox']:checked + p::after {
	border-color: #fff;
}
.radioset p:hover::before {
	box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

/*---------------------------------------------------------*/

.submitset {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 10px auto 0 auto;
	padding: 0 20px;
}
.submitset > * {
	width: calc( 50% - 40px );
	min-width: 240px;
	max-width: 320px;
	margin: 20px 10px 0 10px;
}
.submitset > * > * {
	-webkit-appearance: none;
	appearance: none;
	border: none;
	outline: none;
	
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 1.2em 2.0em;
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
	border-radius: 5em;
	color: #fff;
	background-color: var(--base-color-green);
	border: 2px solid var(--base-color-green);
	transition: border-color var(--base-transition-time), var(--base-transition-time), box-shadow var(--base-transition-time);
	cursor: pointer;
}
.submitset > * > *:hover {
	border-color: var(--base-color-blue);
	background-color: var(--base-color-blue);
	box-shadow: 0 0 10px rgba(0, 0, 0, .4);
}

.submitset > *.rewrite > * {
	color: var(--base-color-black);
	background-color: #fff;
	border-color: var(--base-color-gray);
}

.thanks {
	line-height: 1.8;
}
.thanks > *:not(:nth-child(1)) {
	margin-top: 1em;
}

/*---------------------------------------------------------*/
/*---------------------------------------------------------*/