/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
}

@media (min-width: 600px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 480px) {
}

@media (min-width: 481px) and (max-width:767px) {
}

@media (min-width: 768px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 767px) {
}

@media (min-width: 768px) {
}

/* ---------------------------------------- common */

@media (max-width: 767px) {
	article { padding: 0 1em; }
}

@media (min-width: 768px) {
	article { padding: 0 1.5em; }
}

/* ---------------------------------------- article h2 */

article h2 {
	position: relative;
	text-align: center;
	margin: 0 0 3em;
}
article h2 em {
	color: #F3f3f3;
	font-family: "Lilita One", sans-serif;
}
article#philosophy h2 em {
	color: #F0D541;
}
article h2 span {
	color: #FC9913;
	font-weight: 600;
	position: absolute;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}
article#philosophy h2 span {
	color: #000;
}

@media (max-width: 767px) {
	article h2 em {
		font-size: clamp(4.4rem, 1.139rem + 8.05vw, 8rem);
	}
	article h2 span {
		font-size: clamp(1.8rem, 0.678rem + 2.24vw, 2.8rem);
	}
}

@media (min-width: 768px) {
	article h2 em {
		font-size: clamp(7rem, -1.832rem + 12.93vw, 10rem);
	}
	article h2 span {
		font-size: clamp(2.4rem, -0.155rem + 3.45vw, 3.2rem);
	}
}

/* ---------------------------------------- overview */

#overview table {
	width: 100%;
}
#overview table th,
#overview table td {
	border-top: 1px #FC9913 solid;
	border-bottom: 1px #FC9913 solid;
	line-height: 1.6;
	vertical-align: middle;
}
#overview table td p + p { margin: .5em 0 0; }

@media (max-width: 767px) {

	#overview { margin: 0 0 5em; }

	#overview table {
		font-size: clamp(1.3rem, -0.278rem + 5.45vw, 1.6rem)
	}
	#overview table th {
		width: 7em;
		padding: 1.5em 0;
	}
	#overview table td {
		padding: 1.5em 0;
	}
}

@media (min-width: 768px) {

	#overview { margin: 0 0 8em; }

	#overview table {
		font-size: clamp(1.3rem, 0.192rem + 1.29vw, 1.6rem);
	}
	#overview table th {
		width: 16.5em;
		padding: 1.5em;
	}
	#overview table td {
		padding: 1.25em 1em 1.25em 0;
	}
}

#overview table td a {
	text-decoration: underline;
	white-space: nowrap;
}

/* ---------------------------------------- philosophy */

#philosophy .inner {
	background: #FCE879;
	border-radius: 2em;
	
}
#philosophy .inside { margin: 0 0 3em; }
#philosophy p { line-height: 2; }


#philosophy section {
	background: #fff;
	padding: 0;
	border-radius: 1.5em;
	margin: 0 0 2em;
}

#philosophy section h3 {
	color: #fff;
	background: #DC000C;
	padding: 1em 1.5em;
	border-radius: 1.5em 0 1.5em 0;
}
#philosophy section h3 em {
	font-family: "Lilita One", sans-serif;
}
#philosophy section h3 span {
	line-height: 1.6;
}

#philosophy section p {
	padding: 1.5em;
}

@media (max-width: 767px) {

	#philosophy { margin: 0 0 5em; }
	#philosophy .inner {
		padding: 3.8em 1em 1em;
	}
	#philosophy section h3 em {
		display: block;
		font-size: clamp(2.4rem, -0.682rem + 10.91vw, 3rem);
		margin: 0 0 .25em;
	}


}

@media (min-width: 768px) {

	#philosophy { margin: 0 0 8em; }
	#philosophy .inner {
		padding: 3.8em 3.5em 2.5em;
	}
	#philosophy section h3 {
		display: table;
		width: 45%;
	}
	#philosophy section h3 > * {
		display: table-cell;
		vertical-align: middle;
	}
	#philosophy section h3 em {
		width: 3.5em;
		font-size: clamp(2rem, -1.233rem + 5.17vw, 3.2rem);
	}
	
}

@media (min-width: 768px) and (max-width:999px) {

	#philosophy section h3 {
		width: 55%;
	}
}

/* ---------------------------------------- history */

#historyList .history-date,
#historyList .history-year {
	color: #FC9913;
}
#historyList .history-date em,
#historyList .history-year em {
	font-family: "Lilita One", sans-serif;
	vertical-align: text-bottom;
}
#historyList .history-year,
#historyList .history-date {
	margin: 0 0 1em;
}

#historyList .history-content {
	border-top: 4px #e8dfd1 solid;
	padding: 3em 1.5em 0 0;
	position: relative;
}
#historyList .history-content::before {
	content: "";
	display: block;
	width: 1px;
	height: 3em;
	background: #FC9913;
	position: absolute;
	top: 0;
	left: 2em;
}
#historyList .history-content::after {
	content: "";
	display: block;
	width: 1em;
	aspect-ratio: 1;
	background: #FC9913;
	border-radius: 100%;
	position: absolute;
	top: calc( -.5em - 2px );
	left: 1.5em;
}

#historyList .history-box {
	background: #fbfaf6;
	padding: 1em;
	border-radius: 10px;
}

#historyList .history-timeline {
	display: table;
	width: 100%;
	line-height: 1.6;
}
#historyList .history-timeline > * {
	display: table-cell;
	vertical-align: top;
}
#historyList .history-timeline > dt {
	width: 3em;
	text-align: right;
	padding: 0 .75em 0 0;
}

#history-arrow .slide-arrow.prev-arrow,
#history-arrow .slide-arrow.next-arrow {
	display: inline-block;
	width: 2.25em;
	aspect-ratio: 1;
	cursor: pointer;
}
#history-arrow .slide-arrow.prev-arrow {
	background: url( ../images/company/arrowLeft_about.svg ) no-repeat center center;
	background-size: contain;
	margin: 0 .5em 0 0;
}
#history-arrow .slide-arrow.next-arrow {
	background: url( ../images/company/arrowRight_about.svg ) no-repeat center center;
	background-size: contain;
}

@media (max-width: 767px) {
	#historyList .slick-list{
		overflow: visible !important;
	}
	#historyList .history-date em,
	#historyList .history-year em {
		font-size: clamp(1.8rem, -1.057rem + 10.91vw, 2.4rem);
	}
	#historyList .history-timeline {
		font-size: clamp(1.3rem, -0.278rem + 5.45vw, 1.6rem);
	}

	#history-arrow {
		text-align: right;
		margin: 0 0 1.5em;
	}
}

@media (min-width: 599px) {

	#historyList .slick-list{
		overflow: visible !important;
	}
	#historyList .history-date em,
	#historyList .history-year em {
		font-size: clamp(1.8rem, -0.116rem + 2.59vw, 2.4rem);
	}
	#historyList .history-timeline {
		font-size: clamp(1.3rem, 0.192rem + 1.29vw, 1.6rem);
	}

	#history-arrow {
		text-align: center;
		margin: 0 0 2em;
	}
}

@media (min-width: 768px) {
	#history-arrow {
		text-align: right;
		margin: 0 0 1.5em;
	}
}