@charset "utf-8";

/* 全体********************************************************************** */
html {
	scroll-behavior: smooth;
	overflow-x: hidden;
}

/* ページ内リンクの位置調整 */
.anchor {
	display: block;
	padding-top: 120px;
	margin-top: -120px;
}

body {
	background-color: white;
}

body.business {
	background-color: #333333;
}

body.technica {
	background-color: #f2f2f2;
}

/* コンテンツ量が少ない時フッターをブラウザの下部固定 */
/* .wrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.wrap .footer {
	margin-top: auto;
} */


.wrap {
	display: grid;
	grid-template-rows: auto 1fr auto;
	grid-template-columns: 100%;
	min-height: calc(100vh - 30vw);
}

@media screen and (max-width:768px) {
	.wrap {
		min-height: calc(100vh - 70px);
	}
}

/* フォント********************************************************************** */
html {
	font-size: 62.5%;
	font-family: "Noto Sans JP", sans-serif;
}

.gothic {
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
}

.oswald {
	font-family: "Oswald", sans-serif;
}

h1 {}

h4 {
	font-size: 3.2em;
	color: white;
	font-weight: 300;
	letter-spacing: 4px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
}

h5 {
	font-size: 4.8em;
	color: rgba(0, 160, 233, 0.5);
	font-weight: 400;
	mix-blend-mode: multiply;
}

h6 {
	font-size: 2.7em;
}

.f100 {
	font-size: 1vw;
}

.f120 {
	font-size: 1.2vw;
}

.f30 {
	font-size: 1.5vw;
}

.f25 {
	font-size: 1.3vw;
}

.f22 {
	font-size: 1.15vw;
}

.f17 {
	font-size: 0.9vw;
}

.fcolor_blue {
	color: #00a0e9;
}

.fcolor_white {
	color: white;
}

.fweight500 {
	font-weight: 500;
}

p {
	line-height: 2;
}

.br_sp_only {
	display: none;
}

@media screen and (max-width:768px) {
	.br_pc_only {
		display: none;
	}
}

/* スマホ対応 */
@media screen and (max-width:768px) {
	h4 {
		font-size: 1.6em;
	}

	h5 {
		font-size: 2.4em;
	}

	.h6_sp {
		font-size: 2em;
	}

	.f17_sp {
		font-size: min(2.7vw, 15px);
	}

	.f25_sp {
		font-size: 1em;
	}

	.f30_sp {
		font-size: 1.6em;
	}

	.f100_sp {
		font-size: 1.6em;
	}

	.f120_sp {
		font-size: 1.8em;
	}

	.br_sp_only {
		display: block;
	}
}


/* マージン********************************************************************** */
.ml50 {
	margin-left: 5vw;
}

.mt50 {
	margin-top: 5vw;
}


/* ヘッダー********************************************************************** */
/*========= 上部固定させるためのCSS ===============*/
.header {
	height: 80px;
	/*高さ指定*/
	width: 100%;
	/*横幅指定*/
	/*以下はレイアウトのためのCSS*/
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: white;
	color: black;
	text-align: center;
	position: fixed;
	/*fixedを設定して固定*/
	z-index: 999;
	/*最前面へ*/
	top: 0;
	/*位置指定*/
	left: 0;
	/*位置指定*/
}

.header::after {
	content: '';
	position: absolute;
	width: 100vw;
	height: 4px;
	background-color: rgba(105, 190, 40, 1);
	z-index: 888;
	bottom: -4px;
	pointer-events: none;
}

main {
	padding-top: 80px;
}

@media screen and (max-width:768px) {
	.header {
		height: 50px;
	}

	main {
		padding-top: 50px;
	}
}

.top-logo-sp {
	display: none;
}

.top-logo-pc img {
	height: 80px;
	width: 100%;
}

@media screen and (max-width:768px) {
	.top-logo-pc {
		display: none;
	}

	.top-logo-sp {
		display: block;
	}

	.top-logo-sp img {
		height: 50px;
		width: auto;
	}
}

.g-nav {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.pc-nav {
	display: flex;
}

.sp-nav {
	display: none;
}

.openbtn {
	display: none;
}

@media screen and (max-width:768px) {
	.g-nav {
		flex-direction: column;
		align-items: normal;
	}

	.pc-nav {
		display: none;
	}

	.sp-nav {
		display: block;
	}

	.openbtn {
		display: block;
	}
}

.pc-menu {
	display: flex;
	justify-content: center;
}

.pc-nav a {
	font-size: 1.15vw;
}

.inquiry-btn a {
	font-size: 1.15vw;
	display: flex;
	height: 80px;
	background-color: #00a0e9;
	justify-content: center;
	align-items: center;
	color: white;
	transition: opacity .3s;
}

.inquiry-btn a:hover {
	opacity: 0.5;
}

.inquiry-btn {
	width: 15vw;
	max-width: 300px;
	min-width: 100px;
	position: relative;
}

.triangle_inquiry {
	height: 48px;
	width: 40px;
	clip-path: polygon(100% 0, 100% 100%, 0 100%);
	background-color: #c9c5c0;
	position: absolute;
	bottom: 0;
	right: 0;
}

@media screen and (max-width:768px) {
	.inquiry-btn {
		right: 50px;
	}

	.inquiry-btn a {
		font-size: max(2vw, 10px);
		height: 50px;
	}

	.triangle_inquiry {
		display: none;
	}
}

.pc-nav .pc-menu ul {
	display: block;
	position: absolute;
	top: 0;
}

.pc-nav .pc-menu .parent-list {
	width: 15vw;
	max-width: 300px;
}


.pc-nav .pc-menu .parent-btn {
	height: 80px;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 30px;
	padding-right: 30px;
}

.pc-nav .pc-menu .parent-btn:hover {
	color: #00a0e9;
}

.pc-nav .pc-menu li a {
	transition: all .3s;
	position: relative;
}

.pc-nav .pc-menu li li::after {
	content: "";
	display: block;
	width: 1px;
	height: 16px;
	background-color: white;
	position: absolute;
	top: 42%;
}

.pc-nav .pc-menu li li:first-child::after {
	width: 0px;
}

.pc-nav .pc-menu li li a {
	position: relative;
	display: inline-block;
}

.pc-nav .pc-menu li li a::before {
	content: '';
	position: absolute;
	top: -3vw;
	left: -5vw;
	right: -5vw;
	bottom: -3vw;
}

.pc-nav .pc-menu li li a::after {
	position: absolute;
	bottom: -8px;
	left: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: white;
	transform: scale(0, 1);
	transform-origin: center top;
	transition: transform .3s;
}

.pc-nav .pc-menu li li a:hover::after {
	transform: scale(1, 1);
}

.pc-nav li.has-child ul {
	position: absolute;
	top: 80px;
	left: 0;
	z-index: 888;
	display: none;
	justify-content: space-between;
	flex-wrap: nowrap;
	background: #00a0e9;
	width: 100vw;
	visibility: hidden;
	opacity: 0;
	transition: all .3s;
	padding: 4vw;
}

.pc-nav li.has-child:hover>ul {
	display: flex;
	visibility: visible;
	opacity: 1;
}

.pc-nav li.has-child ul li {
	width: 100%;
}

.pc-nav li.has-child ul li a {
	color: white;
}

/* ハンバーガーメニュー */
.sp-nav {
	/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
	position: fixed;
	z-index: 999;
	/*ナビのスタート位置と形状*/
	top: -120%;
	left: 0;
	width: 100%;
	height: 100vh;
	/*ナビの高さ*/
	background-color: #c9c5c0;
	/*動き*/
	transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
.sp-nav.panelactive {
	top: 0;
}

/*ナビゲーションの縦スクロール*/
.sp-nav.panelactive .sp-nav-list {
	/*ナビの数が増えた場合縦スクロール*/
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100vh;
	/*表示する高さ*/
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	line-height: 1;
}

/*ナビゲーション*/
.sp-nav .sp-menu {
	/*ナビゲーション天地中央揃え*/
	position: absolute;
	z-index: 999;
	left: 20px;
	top: 50px;
	text-align: left;
	font-size: 14px;
}

.sp-nav .sp-menu .parent-btn {}

/*リストのレイアウト設定*/
.sp-nav ul li {
	position: relative;
}

.sp-nav ul li a {
	display: block;
	padding: 15px;
	transition: all .3s;
	white-space: nowrap;
}

.sp-nav ul li a:hover {
	color: #00a0e9;
}

/*2階層目を持つliの矢印の設定*/
.sp-nav ul li.has-child-sp::before {
	content: '';
	position: absolute;
	right: 0px;
	top: 18px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #00a0e9;
	border-right: 2px solid #00a0e9;
	transform: rotate(45deg);
	transition: all .3s;
}

.sp-nav ul li.has-child-sp:hover::before {
	right: -10px;
}

/*下の階層を持っているulの指定*/
.sp-nav li.has-child-sp ul {
	/*絶対配置で位置を指定*/
	position: absolute;
	left: 110%;
	top: 0;
	z-index: 888;
	/*形状を指定*/
	background: #c9c5c0;
	width: 200px;
	/*はじめは非表示*/
	visibility: hidden;
	opacity: 0;
	/*アニメーション設定*/
	transition: all .3s;
}

/*hoverしたら表示*/
.sp-nav li.has-child-sp:hover>ul,
.sp-nav li.has-child-sp ul li:hover>ul,
.sp-nav li.has-child-sp:active>ul,
.sp-nav li.has-child-sp ul li:active>ul {
	visibility: visible;
	opacity: 1;
}

/*ナビゲーションaタグの形状*/
.sp-nav li.has-child-sp ul li a {
	color: #fff;
}

.sp-nav li.has-child-sp ul li:last-child>a {
	border-bottom: none;
}

.sp-nav li.has-child-sp ul li a:hover,
.sp-nav li.has-child-sp ul li a:active {
	background: #00a0e9;
}



/*========= ボタンのためのCSS ===============*/
.openbtn {
	position: fixed;
	z-index: 9999;
	/*ボタンを最前面に*/
	top: 0;
	right: 0;
	cursor: pointer;
	width: 50px;
	height: 50px;
	background-color: #c9c5c0;
}

/*×に変化*/
.openbtn span {
	display: inline-block;
	transition: all .4s;
	position: absolute;
	left: 14px;
	height: 3px;
	border-radius: 2px;
	background-color: #00a0e9;
	width: 45%;
}

.openbtn span:nth-of-type(1) {
	top: 15px;
}

.openbtn span:nth-of-type(2) {
	top: 23px;
}

.openbtn span:nth-of-type(3) {
	top: 31px;
}

.openbtn.active span:nth-of-type(1) {
	top: 18px;
	left: 18px;
	transform: translateY(6px) rotate(-45deg);
	width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
	top: 30px;
	left: 18px;
	transform: translateY(-6px) rotate(45deg);
	width: 30%;
}


/* フッター********************************************************************** */
body {
	min-height: 100vh;
	position: relative;
	box-sizing: border-box;
}

footer {
	width: 100vw;
	max-width: 1920;
	padding: 30px 6.7vw;
	background-color: #e6e6e6;
	position: absolute;
	z-index: 900;
}

footer a {
	transition: all 0.3s;
}

footer a:hover {
	opacity: 0.5;
}

.footer_navigation {
	width: 86.5vw;
	max-width: 1660px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;

}

.footer_logo img {
	width: 18vw;
	max-width: 345px;
}

.footer_nav {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	position: relative;
}

.footer_nav .to-top_btn {
	position: absolute;
	display: block;
	width: 1vw;
	right: -40px;
	top: 120px;
}

.footer_nav .to-top_btn a {
	display: block;
	transition: all 0.3s ease-in-out;
	transform: translateY(0);
}

.footer_nav .to-top_btn a:hover {
	transform: translateY(-10px);
	opacity: 1;
}



.footer_nav .to-top_btn img {
	width: 100%;
}

.footer_nav .footer_address {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding-top: 20px;
	width:36vw;
	max-width:692px;
	gap:2vw;
}

.footer_nav .footer_address li {
	padding-right: 10px;
}

.footer_nav .footer_address li p {
	font-size: max(1vw, 9px);
	line-height: 1.5;
}

.footer_nav .footer_address li p:first-child {
	font-size: max(1vw, 9px);
	font-weight: 500;
	padding-bottom: 10px;
}

.footer_nav .footer_menu {
	display: flex;
	flex-direction: row;
	font-size: max(1vw, 10px);
	line-height: 2;
	width:48.5vw;
	max-width:932px;
	gap:20px;
}

.footer_nav .footer_menu .footer_menu_inn {
	padding-left: 2vw;
}

.footer_nav .footer_menu .footer_blue_txt {
	display: block;
	color: #00a0e9;
	font-weight: 500;
	border-bottom: 1px solid #00a0e9;
	padding-bottom: 5px;
	margin-bottom: 5px;
}

.copyright {
	color: black;
	text-align: right;
}


@media screen and (max-width:768px) {
	footer .footer_navigation {
		display: none;
	}

	.copyright {
		text-align: center;
	}
}

/* ふわっと出てくる**********************************************************************  */
/* 下から */
.fadeUpTrigger {
	opacity: 0;
}

.fadeLeftTrigger {
	opacity: 0;
}

.fadeRightTrigger {
	opacity: 0;
}

.fadeUp {
	animation-name: fadeUpAnime;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeUpAnime {
	from {
		opacity: 0;
		transform: translateY(100px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 左から */
.fadeLeft {
	animation-name: fadeLeftAnime;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeLeftAnime {
	from {
		opacity: 0;
		transform: translateX(-100px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* 右から */
.fadeRight {
	animation-name: fadeRightAnime;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeRightAnime {
	from {
		opacity: 0;
		transform: translateX(100px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}



/* トップページ********************************************************************** */
/* マージン */
.top_sec,
.news_sec,
.recruit_sec,
.contact_sec,
.links_sec {
	margin-bottom: 80px;
}

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

	.top_sec,
	.news_sec,
	.recruit_sec,
	.contact_sec,
	.links_sec {
		margin-bottom: 50px;
	}
}

/* メイントップ */
.top_sec {
	position: relative;
	height: 100vh;
}

.top_sec .top_txt {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	display: flex;
	flex-direction: column;
}

.top_sec .top_txt img {
	width: 100%;
	height: auto;
}

.top_sec .top_txt .top_txt_img {
	width: 44vw;
	max-width: 850px;
	margin-bottom: 3.125vw;
}

.top_sec .top_txt .top_txt_img2 {
	width: 22vw;
	max-width: 425px;
	margin-bottom: 3.125vw;
}

.top_sec .top_txt .top_txt_img3 {
	font-size: max(0.9vw, 17px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: white;
	inline-size: 90vw;
	overflow-wrap: break-word;
	line-height: 2;
}

@media screen and (max-width:768px) {
	.top_sec .top_txt .top_txt_img {
		width: 70vw;
		margin-bottom: 8vw;
	}

	.top_sec .top_txt .top_txt_img2 {
		width: 35vw;
	}
}

.top_video {
	position: absolute;
	width: 100%;
	height: calc(100vh - 80px);
	overflow: hidden;
}

#video {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.top_slider {
	position: relative;
	z-index: 1;
	/*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
	height: calc(100vh - 80px);
}

/*　背景画像設定　*/

.top_slider-item01 {
	background: url(../img/index/main_image01.jpg);
}

.top_slider-item02 {
	background: url(../img/index/main_image01.jpg);
}

.top_slider-item03 {
	background: url(../img/index/main_image01.jpg);
}

.top_slider-item {
	width: 100%;
	height: calc(100vh - 80px);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

@media screen and (max-width:768px) {
	.top_video {
		height: calc(100vh - 50px);
	}

	.top_slider {
		height: calc(100vh - 50px);
	}

	.top_slider-item {
		height: calc(100vh - 50px);
	}

}

.slick-dots {
	position: relative;
	z-index: 3;
	text-align: center;
	margin: -50px 0 0 0;
}

.slick-dots li {
	display: inline-block;
	margin: 0 5px;
}

.slick-dots button {
	color: transparent;
	outline: none;
	width: 16px;
	height: 4px;
	display: block;
	background-color: white;
	border: 0px solid white;
}

.slick-dots .slick-active button {
	background: #00a0e9;
}

/* 新着情報 リンク */
.news_sec,
.links_sec {
	width: 62.5vw;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}


.news_sec .news_box {
	margin-top: 40px;
}

.news_sec time {
	color: #808080;
	margin-right: 20px;
	font-size: max(0.9vw, 17px);
}

.news_sec .news_type {
	width: 75px;
	background-color: #00a0e9;
	padding-top: 10px;
	padding-bottom: 10px;
	border-radius: 30px;
	margin-right: 20px;
	color: white;
	text-align: center;
}

.news_sec .news_txt {
	width: 50vw;
	max-width: 960px;
	font-size: max(0.9vw, 17px);
	line-height: 1;
}

.news_sec li:first-child {
	margin-bottom: 20px;
}

.news_sec li a {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.news_sec details {
	border: #00a0e9 1px solid;
	padding: 20px 20px 20px 40px;
}

.news_sec details li {
	padding-top: 20px;
}

.news_sec details summary {
	color: #00a0e9;
	font-size: max(0.9vw, 17px);
}

.news_sec details summary {
	list-style: none;
	position: relative;
	cursor: pointer;
}

.news_sec details summary::-webkit-details-marker {
	display: none;
}

.news_sec details summary:after {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(../img/index/summary_arrow.png);
	background-size: contain;
	position: absolute;
	right: 0;
	top: -5px;
}


@media screen and (max-width:768px) {
	.news_sec {
		width: 90vw;
	}

	.news_sec h2,
	.links_sec h2 {
		font-size: min(5vw, 20px);
	}

	.news_sec h2::before,
	.links_sec h2::before {
		font-size: min(7.8vw, 50px);
		top: -1.5vw;
	}

	.news_sec time {
		font-size: max(0.9vw, 12px);
		margin-right: 10px;
	}

	.news_sec .news_type {
		margin-right: 10px;
	}

	.news_sec .news_txt {
		font-size: max(0.9vw, 12px);
	}

	.news_sec details {
		padding: 10px;
	}
}

.links_sec .links_btn_box {
	margin-top: 40px;
	display: flex;
	flex-direction: row;
	text-align: center;
	justify-content: center;
}

.links_sec .links_btn {
	margin-right: 30px;
	margin-left: 30px;
}

.links_sec .links_btn a {
	display: block;
	width: 18.125vw;
	max-width: 348px;
	padding-top: 30px;
	padding-bottom: 30px;
	font-size: min(1.15vw, 22px);
	border: 1px solid #00a0e9;
	color: #00a0e9;
	white-space: nowrap;
	position: relative;
	transition: all 0.3s;
}

.links_sec .links_btn a:hover {
	color: white;
	background-color: #00a0e9;
}

.links_sec .links_btn a::after {
	position: absolute;
	content: "";
	width: 30px;
	height: 30px;
	clip-path: polygon(0 100%, 100% 100%, 100% 0);
	background: #00a0e9;
	bottom: -1px;
	right: -1px;
}


@media screen and (max-width:768px) {
	.links_sec .links_btn {
		margin-right: 10px;
		margin-left: 10px;
	}

	.links_sec .links_btn a {
		width: 40vw;
		font-size: max(1vw, 10px);
	}
}

/* 会社概要/事業紹介 */
.intro_sec {
	width: 100vw;
	max-width: 1920px;
	height: 26vw;
	max-height: 500px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: row;
	text-align: center;
	justify-content: space-between;
}

.intro_sec a:hover {
	opacity: 0.5;
}

.intro_sec .company_box,
.intro_sec .business_box {
	width: 50vw;
	max-width: 960px;

}

.intro_sec .company_box {
	background-image: url(../img/index/to-company-btn-img.png);
	background-size: cover;
	background-position: bottom 0px right 0px;
}

.intro_sec .business_box {
	background-image: url(../img/index/to-business-btn-img.png);
	background-size: cover;
	background-position: bottom 0px right 0px;
}

.intro_sec h2 {
	font-size: min(7.8vw, 150px);
	font-family: "Oswald", sans-serif;
	letter-spacing: 0.2rem;

}

.intro_sec .company_box h2 {
	position: relative;
	top: 9vw;
	color: rgba(255, 255, 255, 0.9);
	font-weight: 400;
}

.intro_sec .company_box h2::before {
	position: absolute;
	content: '会社概要';
	font-size: min(1.875vw, 36px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: black;
	font-weight: bold;
	top: 3vw;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}

.intro_sec .business_box h2 {
	color: rgba(0, 0, 0, 0.3);
	position: relative;
	top: 9vw;
	font-weight: 400;
}

.intro_sec .business_box h2::before {
	position: absolute;
	content: '事業紹介';
	font-size: min(1.875vw, 36px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: white;
	font-weight: bold;
	top: 3vw;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}

@media screen and (max-width:768px) {
	.intro_sec h2 {
		font-size: min(7.8vw, 50px);
	}

	.intro_sec .company_box h2::before {
		font-size: min(5vw, 20px);
		top: 2vw;
	}

	.intro_sec .business_box h2::before {
		font-size: min(5vw, 20px);
		top: 2vw;
	}

}

/* 採用情報 */
.recruit_sec a:hover {
	opacity: 0.5;
}

.recruit_sec .recruit_box {
	display: block;
	width: 100vw;
	max-width: 1920px;
	height: 20vw;
	max-height: 400px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	background-image: url(../img/index/to-recruit-btn-img.png);
	background-size: cover;
	background-position: bottom 0px right 0px;
}

/* お問い合わせ */
.contact_sec a:hover {
	opacity: 0.5;
}

.contact_sec .contact_box {
	display: block;
	width: 62.5vw;
	max-width: 1200px;
	height: 15vw;
	max-height: 300px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	background-image: url(../img/index/to-contact-btn-img.png);
	background-size: cover;
	background-position: bottom 0px right 0px;
	position: relative;
}


.recruit_sec h2,
.contact_sec h2 {
	font-size: min(7.8vw, 150px);
	font-family: "Oswald", sans-serif;
	color: rgba(122, 213, 255, 0.3);
	font-weight: 400;
	position: relative;
}

.recruit_sec h2 {
	top: 6vw;
	color: rgba(0, 89, 131, 0.5);
}

.contact_sec h2 {
	top: 2vw;
}

.contact_sec p {
	color: white;
	position: absolute;
	bottom: 2vw;
	font-size: min(1.15vw, 22px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}

.recruit_sec h2::before {
	position: absolute;
	content: '採用情報';
	letter-spacing: 0.2rem;
	font-size: min(1.875vw, 36px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: white;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold;
	white-space: nowrap;
	top: 3vw;
}

.contact_sec h2::before {
	position: absolute;
	content: 'お問い合わせ';
	letter-spacing: 0.2rem;
	font-size: min(1.875vw, 36px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: white;
	font-weight: 400;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold;
	white-space: nowrap;
	top: 3vw;
}

@media screen and (max-width:768px) {
	.contact_sec .contact_box {
		width: 90vw;
		height: 20vw;
	}

	.recruit_sec h2,
	.contact_sec h2 {
		font-size: min(7.8vw, 50px);
	}

	.recruit_sec h2::before,
	.contact_sec h2::before {
		font-size: min(5vw, 20px);
		top: 2vw;
	}

	.contact_sec p {
		font-size: min(2vw, 10px);
	}
}

/* パンくずリスト********************************************************************** */
.breadcrumb {
	width: 86.5vw;
	max-width: 1660px;
	margin: 30px auto;
	padding: 0;
	list-style: none;
	font-size: min(0.8vw, 15px);
}

.breadcrumb li {
	display: inline;
	/*横に並ぶように*/
	list-style: none;
	font-weight: bold;
	/*太字*/
}

.breadcrumb li:after {
	/* >を表示*/
	content: '>';
	padding: 0 0.2em;
	color: #00a0e9;
}

.breadcrumb li:last-child:after {
	content: '';
}

.breadcrumb li a {
	text-decoration: none;
	color: #00a0e9;
	transition: all 0.3s;
}

.breadcrumb li a:hover {
	opacity: 0.5;
}

@media screen and (max-width:768px) {
	.breadcrumb {
		display: none;
	}
}


/* メインタイトル共通********************************************************************** */
.main_ttl {
	background-color: #00a0e9;
	position: relative;
}

.main_ttl_img {
	background-size: cover;
	width: 100vw;
	height: 18vw;
	max-width: 1920px;
	max-height: 345px;
	margin-left: auto;
	margin-right: auto;
}

.interview_ttl_img {
	background-image: url(../img/ttl_img/interview_top_img.png );
}

.privacy_ttl_img {
	background-image: url(../img/ttl_img/privacy_top_img.png );
}

.guideline_ttl_img {
	background-image: url(../img/ttl_img/guideline_top_img.png );
}

.welfare_ttl_img {
	background-image: url(../img/ttl_img/welfare_top_img.png );
}

.company_ttl_img {
	background-image: url(../img/ttl_img/company_top_img.png );
}

.business_ttl_img {
	background-image: url(../img/ttl_img/business_top_img.png );
}

.main_ttl h4 {
	position: absolute;
	top: 7vw;
	left: 6.25vw;
	z-index: 3;
}

.main_ttl h5 {
	position: absolute;
	top: 8vw;
	left: 6.25vw;
	z-index: 2;
}

/* スマホ対応 */
@media screen and (max-width:768px) {}

/* サブタイトル共通********************************************************************* */
.sub_ttl {
	text-align: center;
	margin-top: 8vw;
	margin-bottom: 8vw;
}

.sub_ttl h2 {
	position: relative;
	font-size: min(2.5vw, 48px);
	font-family: "Oswald", sans-serif;
	color: rgba(0, 153, 214, 0.3);
	font-weight: 400;
	text-align: center;
	letter-spacing: 0.2rem;
	z-index: 2;
}

.sub_ttl h2::before {
	position: absolute;
	font-size: min(1.6vw, 32px);
	font-family: "Zen Kaku Gothic New", sans-serif;
	color: black;
	font-weight: 500;
	top: -0.5vw;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	white-space: nowrap;
}

/* トップページ */
.sub_ttl.news_ttl h2::before {
	content: '新着情報';
}

.sub_ttl.links_ttl h2::before {
	content: 'リンク集';
}

/* 会社概要 */
.sub_ttl.philosophy_ttl h2::before {
	content: '経営理念';
}

.sub_ttl.message_ttl h2::before {
	content: 'ごあいさつ';
}

.sub_ttl.info_ttl h2::before {
	content: '会社情報';
}

.sub_ttl.history_ttl h2::before {
	content: '会社沿革';
	color: white;
}

.sub_ttl.qp_ttl h2::before {
	content: '品質方針';
}

.sub_ttl.ep_ttl h2::before {
	content: '環境方針';
}

.sub_ttl.crs_ttl h2::before {
	content: 'CSR情報';
}

/* 事業紹介 */
.sub_ttl.strong_ttl h2::before {
	content: 'テクニカの強み';
	color: white;
}

.sub_ttl.technical_ttl h2::before {
	content: '技術紹介';
	color: white;
}

.sub_ttl.product_ttl h2::before {
	content: '製品紹介';
	color: white;
}

.sub_ttl.equipment_ttl h2::before {
	content: '設備紹介';
	color: white;
}

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

	.sub_ttl h2 {
		font-size: min(7.8vw, 50px);
	}

	.sub_ttl h2::before {
		font-size: min(5vw, 20px);
		top: 25%;
	}
}

.sub_inn {
	width: 86.5vw;
	max-width: 1660px;
	margin: 0 auto 50px auto;
}

/* ボックスタイトル共通********************************************************************** */
.box_ttl {
	font-size: min(1.6vw, 30px);
	color: #00a0e9;
	font-weight: bold;
	padding: 20px;
	margin-bottom: 20px;
	border-left: 1px solid #c9c5c0;
	border-bottom: 1px solid #c9c5c0;
}

.box_ttl_txt h7 {
	display: block;
	text-align: center;
	line-height: 2;
	font-size: min(1vw, 20px);
	padding-top: 40px;
}

.box_ttl_txt p {
	line-height: 2;
	font-size: min(1vw, 20px);
}

.box_ttl_txt ol {
	margin-left: 20px;
	font-size: min(1vw, 20px);
}

.box_ttl_txt ol li {
	padding-left: 10px;
	line-height: 2;
}

.box_ttl_txt ol li::marker {
	color: #00a0e9;
	font-weight: bold;
}

@media screen and (max-width:768px) {
	.box_ttl {
		font-size: min(2.7vw, 45px);
		padding: 10px;
		margin-bottom: 10px;
	}

	.box_ttl_txt h7 {
		line-height: 2;
		font-size: min(2.7vw, 45px);
	}

	.box_ttl_txt p {
		line-height: 2;
		font-size: min(2.7vw, 45px);
	}

	.box_ttl_txt ol {
		margin-left: 20px;
		font-size: min(2.7vw, 45px);
	}
}

/* 個人情報保護方針ページ********************************************************************** */
.privacy_box {
	margin-bottom: 40px;
}

@media screen and (max-width:768px) {
	.privacy_box {
		margin-bottom: 20px;
	}
}

/* 会社概要********************************************************************** */
/* 経営理念 */
.philosophy_sec {
	background-image: url(../img/company/philosophy_back_img.png);
	background-size: cover;
	padding-top: 1vw;
	padding-bottom: 6vw;
}

.philosophy_sec .sub_ttl {
	margin-top: 7vw;
	margin-bottom: 4vw;
}

.philosophy_sec p {
	display: block;
	text-align: center;
	line-height: 2;
	font-weight: 500;
}

@media screen and (max-width:768px) {
	.philosophy_sec {
		margin-top: 8vw;
	}
}

/* ごあいさつ */
.message_sec {
	width: 86.5vw;
	max-width: 1660px;
	margin: 0 auto 50px auto;
}

.message_inn {
	background-image: url(../img/company/message_back_img.png);
	background-position: left top;
	background-size: cover;
	display: flex;
	flex-direction: row;
}

.message_inn .message_txt_box {
	color: white;
	padding: 3vw 2vw 2.5vw 4vw;
}

.message_sec .president_name {
	text-align: right;
}

.message_inn .message_img_box {
	padding-right: 3vw;
}

.message_inn .message_img_box img {
	width: 40vw;
	max-width: 760px;
	transform: translateY(-2vw);
}

@media screen and (max-width:768px) {
	.message_sec {
		width: 100vw;
	}

	.message_inn {
		flex-direction: column;
		padding-bottom: 20px;
	}

	.message_inn .message_txt_box {
		padding: 20px 0px;
		width: 90vw;
		margin-left: auto;
		margin-right: auto;
	}

	.message_inn .message_txt_box p:first-child {
		font-size: 1.8em;
	}

	.message_inn .message_img_box {
		padding-right: 0px;
		text-align: center;
	}

	.message_inn .message_img_box img {
		width: 90vw;
		max-width: none;
		transform: translateY(0);
	}

	.message_sec .president_name span {
		font-size: 2em;
	}
}

/* 品質保証　環境方針　CRS */

.gray_back {
	background-color: #f2f2f2;
	padding-top: 2vw;
	padding-bottom: 8vw;
}


.qp_sec,
.ep_sec,
.crs_sec {
	width: 62.5vw;
	max-width: 1200px;
	margin-right: auto;
	margin-left: auto;
}

.qp_sec .sub_ttl,
.ep_sec .sub_ttl,
.crs_sec .sub_ttl {
	margin-bottom: 4vw;
}

.qp_sec p {
	line-height: 2;
}

.ep_txt {
	margin-bottom: 20px;
}

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

	.qp_sec,
	.ep_sec,
	.crs_sec {
		width: 90vw;
		max-width: auto;
		margin-right: auto;
		margin-left: auto;
	}
}

.crs_sec {
	padding-bottom: 8vw;
}

.crs_sec .guideline_box {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
}

.crs_sec .guideline_box .box_ttl_txt a:hover {
	color: #00a0e9;
}

.crs_sec .guideline_box .guideline_img img {
	width: 20vw;
}

@media screen and (max-width:768px) {
	.crs_sec .guideline_box {
		flex-direction: column;
	}

	.crs_sec .guideline_box .guideline_img {
		margin-right: auto;
		margin-left: auto;
	}

	.crs_sec .guideline_box .guideline_img img {
		width: 60vw;
	}
}

/* 会社情報 */
.sub_ttl_explanation {
	width: 42vw;
	max-width: 800px;
	font-size: max(1vw, 12px);
	margin-left: auto;
	margin-right: auto;
	margin-top: 4.375vw;
	text-align: left;
}
.sub_ttl_explanation p:first-child{
	margin-bottom:2vw;
}

@media screen and (max-width:768px) {
	.sub_ttl_explanation {
		padding: 20px 0px;
		width: 90vw;
		margin-left: auto;
		margin-right: auto;
	}
}

.info_sec .info_inn .info_table02_sp {
	display: none;
}

@media screen and (max-width:768px) {
	.info_sec .info_inn .info_table02_pc {
		display: none;
	}

	.info_sec .info_inn .info_table02_sp {
		display: block;
	}
}

.info_inn table,
td,
th {
	font-size: max(1vw, 12px);
	line-height: 1.5;
}

.info_sec .info_inn a:hover {
	color: #00a0e9;
}

.info_sec .info_inn {
	width: 78vw;
	max-width: 1500px;
	margin-right: auto;
	margin-left: auto;
}

.info_sec .info_inn th {
	width: 12vw;
	padding-top: 3vw;
	padding-bottom: 3vw;
	vertical-align: middle;
	border-top: 1.5px solid #00a0e9;
}

.info_sec .info_inn .organization th {
	border-bottom: 1.5px solid #00a0e9;
}

.info_sec .info_inn td {
	width: 66vw;
	padding: 3vw 2.5vw;
	border-top: 1.5px solid #c9c5c0;
}

.info_sec .info_inn .location td {
	display: block;
}

.info_sec .info_inn .organization td {
	border-bottom: 1.5px solid #c9c5c0;
}

.info_sec .info_inn .organization td a {
	position: relative;
}

.info_sec .info_inn .organization td a::after {
	content: '';
	display: inline-block;
	width: 25px;
	height: 25px;
	background-image: url(../img/pdf_mark.png);
	background-size: cover;
	position: absolute;
	top: 50%;
	right: -30px;
	transform: translateY(-50%);
}

.info_sec .info_inn td a .map_icon {
	position: relative;
}

.info_sec .info_inn td a .map_icon::after {
	content: '';
	display: inline-block;
	width: 40px;
	/*画像の幅*/
	height: 20px;
	/*画像の高さ*/
	background-image: url(../img/company/map_icon.png);
	background-size: cover;
	position: absolute;
	top: 50%;
	right: -50px;
	transform: translateY(-50%);
}

.info_sec .info_inn .info_table02_pc td {
	width: 66vw;
}



@media screen and (max-width:768px) {
	.info_sec .info_inn {
		width: 100vw;
	}

	.info_sec .info_inn th {
		width: 25vw;
	}

	.info_sec .info_inn td {
		width: 75vw;
		padding-left: 5vw;
	}

	.info_sec .info_inn .access td {
		display: block;
		width: 75vw;
	}
}

/* GoogleMap */
.googlemap {
	/* height: 50vh; */
	aspect-ratio: 16/9;
	width:30vw;
	margin-top:20px;
}

.googlemap iframe {
	filter: hue-rotate(15deg);
	-webkit-filter: hue-rotate(15deg);
	width: 100%;
	height: calc(100% + 56px);
}

/* 会社沿革 */
.history_sec {
	background-image: url(../img/company/history_back_img.png);
	background-size: cover;
	background-position: top;
	padding-top: 2vw;
	padding-bottom: 16vw;
	margin-top: 8vw;
}

.white_txt {
	color: white;
}

.yellow_txt {
	color: #fdd23e;
}

.blue_txt {
	color: #00a0e9;
	font-size: min(3.125vw, 60px);
	font-weight: 500;
	width: 20vw;
	max-width: 240px;
}

.ex_notes {
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.ex_notes p {
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid white;
	font-size: min(1.15vw, 22px);
}

.timeline_box {
	width: 86.5vw;
	max-width: 1660px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2vw;
}

.timeline_box li .white_txt,
.timeline_box li .yellow_txt {
	font-size: min(1.5vw, 22px);
}

.timeline_box .history_event .white_txt {
	font-size: min(1.7vw, 22px);
}

.timeline_box ul li {
	display: flex;
	flex-direction: row;
	align-items: center;
	padding-left: 16.7vw;
	height: 100px;
}

.timeline_box ul li p {
	padding-left: 3.125vw;
	position: relative;
}

.timeline_box ul li p:first-child:before {
	content: '';
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #00a0e9;
	position: absolute;
	top: 55%;
	left: -50px;
	transform: translateY(-50%);
}

.timeline_box ul .history_event p:first-child:before {
	width: 30px;
	height: 30px;
	left: -55px;
	transform: translateY(-50%);
}

.timeline_box ul li p:first-child:after {
	content: '';
	width: 2px;
	height: 100px;
	background-color: #00a0e9;
	position: absolute;
	top: 3.125vw;
	left: -41px;
}

.timeline_box ul li:last-child p:first-child:after {
	background-color: #009fe900;
	content: url(../img/company/history_dot_line100.png);
}

@media screen and (max-width:768px) {
	.timeline_box {
		width: 100vw;
	}

	.ex_notes p {
		font-size: max(1.5vw, 10px);
	}

	.timeline_box {
		font-size: max(1.5vw, 10px);
		width: 90vw;
	}

	.timeline_box li .white_txt,
	.timeline_box li .yellow_txt {
		font-size: max(1.5vw, 12px);
	}

	.timeline_box .history_event .white_txt {
		font-size: max(1.7vw, 12px);
	}

	.timeline_box ul li p:first-child:before {
		width: 10px;
		height: 10px;
		left: -10px;
	}

	.timeline_box ul .history_event p:first-child:before {
		width: 15px;
		height: 15px;
		left: -13px;
		transform: translateY(-50%);
	}

	.timeline_box ul li p:first-child:after {
		top: 20px;
		left: -6px;
		height: 50px;
	}

	.timeline_box ul li:last-child p:first-child:after {
		content: url(../img/company/history_dot_line50.png);
	}

	.timeline_box ul li {
		padding-left: 8vw;
		height: 50px;
	}

	.blue_txt {
		font-size: 18px;
		max-width: 75px;
	}
}