@charset "UTF-8";
/* CSS Document */
/*----------------------------------------------  home   ----*/
.home-box1{
	position: relative;
	height: auto;/* 500px*/
}
.home-box1::after{
	content: '';
	display: block;
	padding-top: 31%;
}
.home-img1{
	position: absolute;
	display: block;
	width: 50%;/* 800px */
	height: auto;/* 800px */
	top: -74%;/* -370px */
	right: 4.3%;/* 70px */
	z-index: 10;
	border-radius: 15px;
}
.home-mark1{
	position: absolute;
	width: 46%;/* 740px */
	height: 150%;/* 800px */
	padding: 10% 6.3%;/* 170px 100px */
	background: #FFFFFF;
	border-radius: 15px;
	top: -110%;/* -550px */
	left: 5.6%;/* 90px */
	box-shadow: 0px 0px 18px -1px #777777;
	z-index: 20;
}
.home-switch1{
	width: 40%;/* 220px */
	padding: 3% 5%;/* 10px 13px */
	margin-top: 60px;/* 60px */
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 19px;/* 19px */
	color: #FFFFFF;
	text-align: center;
	line-height: 1;
	background-image: linear-gradient(30deg, rgba(8, 51, 189, 1) 59%, rgba(144, 185, 255, 1));
}
/*----------------------*/
.home-box2{
	position: relative;
	height: auto;/* 700px */
	background-image: linear-gradient(146deg, rgba(189, 219, 253, 1), rgba(8, 51, 189, 1) 60%);
}
.home-box2::after{
	content: '';
	display: block;
	padding-top: 43.7%;
}
.home-mark2{
	position: absolute;
	width: 62.5%;/* 1000px */
	color: #FFFFFF;
	text-align: center;
	margin: auto;
	top: 25.7%;/* 180px */
	left: 0;
	right: 0;
}
.m-foam3{
	position: absolute;
	width: 20.6%;/* 330px */
	height: auto;
	top: -10%;/* -70px */
	left: 0;
}
/*----------------------*/
.home-box3{
	position: relative;
	height: auto;/* 300px */
	background: rgb(242,242,242);
}
.home-box3::after{
	content: '';
	display: block;
	padding-top: 18.7%;
}
.m-foam4{
	position: absolute;
	width: 21.2%;/* 340px */
	height: auto;
	top: -90%;/* -270px */
	right: 0;
	z-index: 10;
}
.home-list{
	position: absolute;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 81%;/* 1300px */
	margin: auto;
	top: -60%;/* -180px */
	left: 0;
	right: 0;
	list-style: none;
	z-index: 20;
}
.home-list li{
	width: 25.8%;/* 335px */
	height: auto;/* 360px */
	border-radius: 10px;
	margin: 0 3.7%;/* 0 40px */
}
.home-list li img{
	width: 100%;
	height: auto;
}
/*----------------------*/
.home-box4{
	position: relative;
	padding: 9.3% 0;/* 150px 0*/
}
.home-box4-2{
	position: relative;
	width: 87.5%;/* 1400px */
	height: auto;/* 1040px */
	margin: auto;
	background: url("./img/home/home-back1.jpg");
	background-size: cover;
}
.home-box4-2::after{
	content: '';
	display: block;
	padding-top: 74.2%;
}
.home-mark3{
	position: absolute;
	width: 85.7%;/* 1200px */
	height: 900px;/* 900px */
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background:rgba(255,255,255,0.9);
	box-shadow: 0px 0px 18px -1px #525252;
	border-radius: 20px;
}
.home-mark3::after{
	content: '';
	display: block;
	padding-top: 75%;
}
.home-mark3-2{
	position: absolute;
	width: 83%;/* 1000px */
	top: 22%;/* 200px */
	left: 0;
	right: 0;
	margin: auto;
	text-align: center;
}
.home-menu{
	position: absolute;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 94.2%;/* 1320px */
	margin: auto;
	top: 55.7%;/* 580px */
	left: 0;
	right: 0;
	list-style: none;
}
.home-menu li{
	width: 32.2%;/* 425px */
	height: auto;/* 340px */
	overflow: hidden;
	border-radius: 20px;
}
.home-menu li img{
	width: 100%;
	height: auto;
}
/*--------------*/
.home-box5{
	position: relative;
	height: auto;/* 1080px */
	background:url("./img/home/home-back2.jpg");
	background-size: cover;
}
.home-box5::after{
	content: '';
	display: block;
	padding-top: 67.5%;
}
.home-title1{
	position: absolute;
	display: block;
	width: 20.6%;/* 330px */
	height: auto;
	padding: 9.3% 0; /* 150px 0*/
	background-image: linear-gradient(30deg, rgba(8, 51, 189, 1) 59%, rgba(144, 185, 255, 1));
	text-align: center;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 37px;/* 37px */
	line-height: 1;
	color: #FFFFFF;
	top: 18.5%;/* 200px */
	left: 7.5%;/* 120px */
}
/*-------  お知らせ　---*/
.home-img2{
	position: absolute;
	display: block;
	width: 18%;/* 290px */
	height: auto;/* 460px */
	box-shadow: 0px 4px 15px -5px #777777;
	top: 7.4%;/* 80px */
	right: 20%;/* 320px */
	z-index: 10;
}
.home-img3{
	position: absolute;
	display: block;
	width: 18%;/* 290px */
	height: auto;/* 460px */
	box-shadow: 0px 4px 15px -5px #777777;
	top: 42.5%;/* 460px */
	right: 5%;/* 160px */
	z-index: 5;
}
.home-news{
	position: absolute;
	width: 50%;/* 800px */
	height: auto;
	top: 57.4%;/* 620px */
	left: 7.5%;/* 120px */
	list-style: none;
}
.home-news a li{
	text-decoration: none;
	color: #FFFFFF;
}
.home-news li{
	display: flex;
	width: 100%;
	height: auto;
	background-image: linear-gradient(30deg, rgba(8, 51, 189, 1) 59%, rgba(144, 185, 255, 1));
	color: #FFFFFF;
	margin: 13px auto;/* 13px auto*/
	padding: 11px 0.9%;/* 11px 15px */
	ont-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 20px;/* 30px */
	line-height: 1;
	border-radius: 10px;
}
.news-day{
	margin: 0 10px;/* 0 10px*/
}
/*----------------------------------------------  about   ----*/
.ab-box1{
	position: relative;
	height: auto;/* 800px */
	background: url("./img/about/ab-box1back.png");
	background-size: cover;
}
.ab-box1::after{
	display: block;
	content: '';
	padding-top: 50%;
}
.ab-img1-1{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 20%;/* 200px */
	right: 6.3%;/* 100px */
}
.ab-img1-2{
	position: absolute;
	display: block;
	width: 18.7%;/* 300px */
	height: auto;/* 200px */
	border-radius: 15px;
	top: 57.5%;/* 500px */
	right: 1.8%;/* 30px */
}
.ab-mark1{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 26.3%;/* 250px */
	left: 5%;/* 80px */
}
.ab-deco1{
	position: absolute;
	display: inline-block;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 200px;/* 200px */
	color: #bbe2f1;
	line-height: 1;
	width: 100%;
	margin: auto;
	left: 0;
	right: 0;
	bottom: 0;
	margin-right: 20px;/* 20px*/
	z-index: -10;
}
/*-------------------*/
.ab-box1-2{
	position: relative;
	height: auto;/* 650px */
	background: url("./img/about/ab-box2back.png");
	background-size: cover;
}
.ab-box1-2::after{
	content: '';
	display: block;
	padding-top: 40.6%;
}
.ab-img1-3{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 12.3%;/* 200px */
	left: 6.2%;/* 100px */
}
.ab-mark1-2{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 20%;/* 250px */
	right: 5%;/* 80px */
}
/*-------------------*/
.ab-box2{
	position: relative;
	height: auto;/* 690px */
	overflow: hidden;
}
.ab-box2::after{
	content: '';
	display: block;
	padding-top: 43%;
}
.ab-mark2{
	position: absolute;
	width: 81%;/* 1300px */
	height: 40%;/* 380px */
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	color: #FFFFFF;
}
#ab-video{
	position: absolute;
    z-index: -100;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}
/*-------------------*/
.ab-box3{
	position: relative;
	height: auto;/* 840px */
	background: url("./img/about/ab-box4back.png");
	background-size: cover;
}
.ab-box3::after{
	content: '';
	display: block;
	padding-top: 52.5%;
}
.ab-img2-1{
	position: absolute;
	display: block;
	width: 23%;/* 370px */
	height: auto;/* 560px */
	border-radius: 15px;
	top: 11.9%;/* 150px */
	left: 6.2%;/* 100px */
}
.ab-img2-2{
	position: absolute;
	display: block;
	width: 16.2%;/* 260px */
	height: auto;/* 320px */
	border-radius: 15px;
	top: 57%;/* 480px */
	left: 25.6%;/* 410px */
}
.ab-mark3{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 23.8%;/* 250px */
	right: 8%;/* 130px */
}
.ab-deco1{
	position: absolute;
	width: 17.5%;/* 280px */
	right: 5%;/* 80-px */
	bottom: 0;
}
/*--------------------*/
.ab-box4{
	position: relative;
	height: auto;/* 830px */
}
.ab-box4::after{
	content: '';
	display: block;
	padding-top: 51.8%;
}
.ab-img3{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 12%;/* 130px */
	right: 6.3%;/* 100px */
}
.ab-mark4{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 15.6%;/* 130px */
	left: 5%;/* 80px */
}
.ab-deco2{
	position: absolute;
	width: 32%;/* 520px */
	left: 0;/* 0 */
	bottom: 3.6%;/* 30px */
}
/*----------------------------------------------  OEM   ----*/
.oem-box1{
	position: relative;
	height: auto;/* 1000px */
}
.oem-box1::after{
	content: '';
	display: block;
	padding-top: 63%;
}
.om-img1{
	position: absolute;
	width: 81%;/* 1300px */
	height: auto;/* 400px */
	top: 16%;/* 160px */
	right: 0;
	border-radius: 23px 0 0 23px;
}
.om-mark1{
	position: absolute;
	width: 75%;/* 1200px */
	margin: auto;
	top: 62%;/* 640px */
	left: 0;
	right: 0;
}
/*--------エンドロールスクロール ------------------*/
.end-scroll01{
	width: 100%;
	height: auto;
	overflow: hidden;
}
.end-scroll01 .roll-scroll{
	display: flex;
	white-space: nowrap;
}
.end-scroll01 .roll-scroll img {
	width: 31.25%; /* 530px 画像サイズは任意で調整可能 */
	height: auto;/* 340px */
	background: #DFDFDF;
	margin-right: 1.3%;/* 20px */
	border-radius: 10px;
}
/*---------------*/
.oem-box2{
	position: relative;
	height: auto;/* 570px */
}
.oem-box2::after{
	content: '';
	display: block;
	padding-top: 35.6%;
}
.om-img2{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 21%;/* 200px */
	right: 6.25%;/* 100px */
}
.po-title1{
	display: inline-block;
	padding: 10px 17px;/* 10px 17px */
	margin-bottom: 13px;/* 13px */
	background: #053c78;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 15px;/* 15px */
	line-height: 1;
	color: #FFFFFF;
	border-radius: 9px;
}
.om-mark2{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 29.8%;/* 250px */
	left: 5%;/* 80px */
}
/*---------------*/
.oem-box3{
	position: relative;
	height: au;/* 520px */
}
.oem-box3::after{
	content: '';
	display: block;
	padding-top: 32.5%;
}
.om-img3{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 9.6%;/* 200px */
	left: 6.25%;/* 100px */
}
.om-mark3{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 19.2%;/* 250px */
	right: 5%;/* 80px */
}
/*---------------*/
.oem-box4{
	position: relative;
	height: auto;/* 600px */
}
.oem-box4::after{
	content: '';
	display: block;
	padding-top: 37.5%;
}
.om-img4{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 8.3%;/* 200px */
	right: 6.25%;/* 100px */
}
.om-mark4{
	position: absolute;
	width: 43.7%;/* 700px */
	top: 16.6%;/* 250px */
	left: 5%;/* 80px */
}
/*--------------------*/
.oem-box5{
	background: #1b4388;
	padding: 8% 0;/* 130px 0*/
}
.client-msg{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 75%;/* 1200px */
	margin: 2.5% auto 0;/* 40px auto 0*/
	list-style: none;
	justify-content: space-between;
}
.client-msg li{
	position: relative;
	width: 47.5%;/* 570px */
	height: auto;/* 140px */
	background: #FFFFFF;
	overflow: hidden;
}
.client-msg li::after{
	content: '';
	display: block;
	padding-top: 24.5%;
}
.client-msg li .face1{
	position: absolute;
	display: block;
	width: 19.2%;/* 110px */
	height: auto;/* 110px */
	margin: auto;
	top: 0;
	bottom: 0;
	left: 1.7%;/* 10px */
	border-radius: 50%;
}
.msg-box{
	position: absolute;
	width: 73.6%;/* 420px */
	height: auto;/* 120px */
	margin: auto;
	top: 0;
	bottom: 0;
	right: 2.8%;/* 15px */
	vertical-align: top;
}
.msg-box::after{
	content: '';
	display: block;
	padding-top: 21%;
}
.client-tlt{
	position: absolute;
	width: 100%;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 25px;/* 25px */
	color: #ee7800;
	line-height: 1;
	top: 12.5%;/* 15px */
}
.msg{
	position: absolute;
	width: 100%;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 15px;/* 15px */
	line-height: 1.5;
	top: 45.8%;/* 55px */
}
/*------------------------- 事例紹介　------*/
.sample-block{
	position: relative;
	width: 75%;/* 1200px */
	height: auto;/* 500px */
	margin: 6.8% auto 0;/* 1100px */
	background: #FFFFFF;
}
.sample-block::after{
	content: '';
	display: block;
	padding-top: 41.6%;
}
.sample-obi{
	position: relative;
	width: 26.6%;/* 320px */
	padding: 20px;/* 20px */
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 20px;/* 20px */
	text-align: center;
	line-height: 1;
	color: #ee7800;
	background: #FFFFFF;
	border:  1px solid #1b4388;
	top: -30px;/* -30px */
	left: -21px;/* -21px */
}
.sample-obi::before{
	position: absolute;
	content: '';
	top: 100%;
	left: 0;
	border: none;
	border-bottom: solid 15px transparent;
	border-right: solid 20px #808080;
}
.face2{
	position: absolute;
	width: 9.16%;/* 110px */
	height: auto;/* 110px */
	border-radius: 50%;
	top: 14%;/* 70px */
	left: 4.2%;/* 50px */
}
.sample-title{
	position: absolute;
	display: inline-block;
	padding: 15px 30px;/* 15px 30px */
	background: #1b4388;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 28px;/* 28px */
	text-align: center;
	line-height: 1;
	color: #FFFFFF;
	top: 19%;/* 95px */
	left: 15%;/* 180px */
}
.sample-txt{
	position: absolute;
	width: 91.6%;/* 1100px */
	height: auto;
	margin: auto;
	top: 42%;/* 210px */
	left: 0;
	right: 0;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 17px;/* 17px */
	line-height: 1.8;
}
/*--------------------*/
.oem-box6{
	position: relative;
	height: auto;/* 1300px */
}
.oem-box6::after{
	content: '';
	display: block;
	padding-top: 81.25%;
}
.om-mark5{
	position: absolute;
	width: 28%;/* 450px */
	top: 9.2%;/* 120px */
	left: 12.5%;/* 200px */
}
.om-title1{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 75px;/* 75px */
	line-height: 1;
	color: #1b4388;
}
.om-title2{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 30px;/* 30px */
	line-height: 1.8;
}
.flow-img{
	position: absolute;
	width: 33%;/* 530px */
	height: 56%;/* 730px */
	background-size: cover;
	overflow: hidden;
	border-radius: 15px;
	top: 23.8%;/* 310px */
	left: 12.5%;/* 200px */
}
.flow-bg{
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center;
	display: none; /* 初期状態では非表示に設定 */
}
/*---流れの説明 --*/
.flow-box{
	position: absolute;
	display: block;
	width: 35%;/* 560px */
	height: 66%;/* 860px */
	top: 22.3%;/* 290px */
	right: 12.5%;/* 200px */
	overflow: scroll;
}
.flow-box .flow-list{
	width: 100%;
	height: auto;
	padding: 30px 20px;/* 30px 20px */
	border-bottom: 1px solid #D0D0D0;
}
.flow-no{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 30px;/* 30px */
	line-height: 1;
	color: #cba452;
	margin-bottom: 10px;/* 10px */
}
.flow-no::before{
	content: 'Step/';
	display: inline-block;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 18px;/* 18px */
	color: #cba452;
	padding-right: 10px;/* 10px */
}
.flow-title{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size: 25px;/* 25px */
	line-height: 1.5;
	margin-bottom: 10px;/* 10px */
}
/*-----------------*/
.oem-box7{
	position: relative;
	background: #faf6f0;
	padding: 120px 0;/* 120px 0*/
}
.product-box{
	width: 1200px;/* 1200px */
	margin: auto;
	padding: 80px 50px;/* 80px 50px */
	background: #FFFFFF;
	border-radius: 15px;
	overflow: hidden;
}
.om-title3{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
	font-size: 32px;/* 32px */
	color: #016eb8;
	line-height: 1;
	text-align: center;
}
.om-title3::before{
	display: block;
	content: 'Product';
	text-align: center;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
	font-size: 14px;/* 14px */
	color: #016eb8;
	line-height: 1;
	margin-bottom: 8px;
}
/*-------*/
.product-list{
	display: flex;
	flex-wrap: wrap;
	width: 1100px;/* 1100px */
	margin: 30px auto 0;/* 30px auto 0*/
	list-style: none;
}
.product-list li{
	width: 230px;/* 230px */
	height: 200px;/* 200px */
	background: #f5f5f5;
	margin: 15px 22px;/* 15px 22px */
	overflow: hidden;
    trasition: 1s;
}
.product-list li:hover{
    background: #D9F3FF;
}
.product-list li img{
	width: 100%;
	height: auto;
}
/*--------------------------------------------  OEM商品のページ　--*/
.pr-box1{
	position: relative;
	height: auto;/* 550px */
}
.pr-box1::after{
	content: '';
	display: block;
	padding-top: 42.3%;
}
.pr-img1{
	position: absolute;
	display: block;
	width: 46%;/* 600px */
	height: auto;/* 420px */
	top: 23.6%;/* 130px */
	left: 0;
}
.pr-mark1{
	position: absolute;
	width: 49%;/* 640px */
	top: 23.6%;/* 130px */
	right: 0;
}
/*----*/
.pr-box2{
	position: relative;
	height: auto;/* 650px */
}
.pr-box2::after{
	content: '';
	display: block;
	padding-top: 50%;
}
.pr-img2{
	position: absolute;
	display: block;
	width: 46%;/* 600px */
	height: auto;/* 420px */
	top: 18.5%;/* 120px */
	right: 0;
}
.pr-mark2{
	position: absolute;
	width: 49%;/* 640px */
	top: 18.5%;/* 120px */
	left: 0;
}
/*----*/
.pr-box3{
	position: relative;
	padding: 6.3% 0;/* 100px 0*/
	background: #f5f5f5;
}
.pr-title1{
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	color: #008000;
	font-size: 30px;/* 30px */
	line-height: 1.5;
	padding-bottom: 5px;
	border-bottom: 1px solid #008000;
}
/*----- 製造ロット数テーブル -----*/
.pr-table{
	width: 81.3%;/* 1300px */
	margin: 4.4% auto 0;/* 70px auto 0*/
	border: 1px solid #000000;
	border-collapse: collapse;
	background: #FFFFFF;
}
.pr-table tr{
	border-bottom: 1px solid #000000;
}
.pr-table th{
	width: 19%;/* 250px */
	padding: 10px;/* 10px */
	font-weight: normal;
	background: #bbe2f1;
	vertical-align: middle;
}
.pr-table td{
	padding: 10px 20px;/* 10px 20px */
}
/*------  製造事例  --*/
.pr-sample{
	width: 100%;/* 1300px */
	margin: 2.5% auto 0;
	list-style: none;
	font-size: 0;
}
.pr-sample li{
	display: inline-block;
	width: 24.5%;/* 324px */
	height: auto;/* 230px */
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.pr-sample li img{
	width: 100%;
	height: auto;
}
/*----*/
.pr-box4{
	position: relative;
	padding: 8.8% 0;/* 140px 0*/
}
.pr-title2{
	display: block;
	width: 31.2%;/* 500px */
	padding: 10px;/* 10px */
	margin: auto;
	text-align: center;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 28px;/* 28px */
	line-height: 1.5;
	color: #FFFFFF;
	background: #1b4388;
}
/*-------  担当からのメッセージ　------*/
.pr-msg-box{
	position: relative;
	width: 92.3%;/* 1200px */
	height: auto;
	min-height: 400px;/* 400px */
	border: 1px solid #000000;
	margin: 70px auto 0;/* 70px auto 0*/
}
.pr-face{
	position: absolute;
	width: 10%;/* 120px */
	height: auto;/* 120px */
	border-radius: 50%;
	top: 10%;/* 40px */
	left: 6.6%;/* 80px */
	overflow: hidden;
}
.pr-msg1{
	position: absolute;
	display: inline-block;
	padding: 15px 30px;/* 15px 30px */
	background: #ffa500;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: 28px;/* 28px */
	text-align: center;
	line-height: 1;
	color: #FFFFFF;
	top: 16.3%;/* 95px */
	left: 20.8%;/* 180px */
}
.pr-msg2{
	position: absolute;
	width: 91.6%;/* 1100px */
	margin: auto;
	top: 50%;/* 200px */
	left: 0;
	right: 0;
}
/*------------------------------------------  設備について　----*/
.fc-box1{
	padding: 11.3% 0;/* 180px 0*/
}
.fc-mark1{
	width: 68.8%;/* 1100px */
	text-align: center;
	margin: auto;
}
/*--------*/
.fc-box2{
	background-color: #eaf7ff;
	padding: 8.7% 0;/* 140px 0*/
}
/*---設備 --*/
.facility-deta{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 68.8%;/* 1100px */
	height: auto;/* 350px */
	padding: 30px;/* 30px */
	background: #FFFFFF;
	margin: 0 auto 60px;/* 0 auto 60px */
	border-radius: 15px;
	border: 4px solid #0068b7;
	overflow: hidden;
}
.facility-img{
	width: 36.4%;/* 400px*/
	height: auto;/* 285px */
}
.facility-msg{
	width: 54.5%;/* 600px */
}
.facility-name{
	display: block;
	padding: 7px 20px;/* 7px 20px */
	background: #0068b7;
	color: #FFFFFF;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 24px;/* 24px */
	line-height: 1.5;
}
/*------------------------------------------  RO水　----*/
.ro-box1{
	position: relative;
	height: auto;/* 850px */
	padding: 12.5% 0;/* 200px */
	background: url("./img/ro/ro-back1.jpg");
	background-size: cover;
}
.ro-mark1{
	width: 59.3%;/* 950px */
	margin: auto;
	text-align: center;
}
.ro-title1{
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: bold;
	font-size: 32px;/* 32px */
	line-height: 1.5;
	margin-bottom: 15px;/* 15px */
	color: #016eb8;
}
.ro-title1-2{
	font-size: 44px;/* 44px */
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: bold;
}
/*----------------*/
.ro-box2{
	position: relative;
	height: auto;/* 700px */
	background: #0071B5;
}
.ro-box2::after{
	content: '';
	display: block;
	padding-top: 43.7%;
}
.ro-img1{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 470px */
	top: 24.3%;/* 170px */
	left: 6.3%;/* 100px */
}
.ro-mark2{
	position: absolute;
	width: 43.8%;/* 700px */
	top: 24.3%;/* 170px */
	right: 6.3%;/* 100px */
	padding: 15px 0;/* 15px 0*/
	color: #FFFFFF;
}
/*------------------*/
.ro-box3{
	padding: 5% 0 8%;/* 80px 0 130px */
	background: #0071B5;
}
.ro-title2{
	display: block;
	width: 31%;/* 500px */
	padding: 15px 20px;/*　15px 20px */
	margin: auto;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: bold;
	font-size: 30px;/* 30px */
	line-height: 1;
	background: #ff8c00;
	color: #FFFFFF;
	text-align: center;
}
.ro-sistem{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 56.3%;/* 900px */
	margin: 4.4% auto 0;/* 70px auto 0*/
	list-style: none;
	justify-content: space-between;
}
.ro-sistem li{
	width: 45.5%;/* 410px */
	height: auto;/* 520px */
	background: #FFFFFF;
}
.sistem-img{
	width: 100%;
	height: auto;/* 200px */
}
.sistem-mark{
	padding: 12px 10px;/* 12px 10px */
}
.sistem-title{
	display: block;
	width: 60%;
	background: #016eb7;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: bold;
	font-size: 20px;/* 20px */
	line-height: 1.5;
	color: #FFFFFF;
	text-align: center;
	margin: auto;
	border-radius: 20px;
}
/*------------------*/
.ro-box4{
	padding: 8% 0 12.5%;/* 130px 0 200px */
}
.ro-title3{
	display: inline-block;
	color:  #016eb7;
	border-bottom: 2px solid #016eb7;
}
/*-----------------*/
.ro-sample{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin: 70px auto 0;/* 70px auto 0*/
	list-style: none;
	justify-content: space-around;
}
.ro-sample li{
	width: 30.8%;/* 400px */
	height: auto;/* 430px */
}
.sample-img{
	display: block;
	width: 100%;
	height: auto;/* 250px */
	border-radius: 15px;/* 15px */
	overflow: hidden;
}
.ro-sample-title{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 20px;/* 19px */
	font-weight: 500;/* 500 */
	font-style: normal;
	line-height: 2;
	color:  #016eb7;
}
.sample-mark{
	width: 100%;
	padding: 10px;/* 10px */
}
/*----------------------------------------------  会社概要   ----*/
.cm-box1{
	position: relative;
	height: auto;/* 1000px */
}
.cm-box1::after{
	content: '';
	display: block;
	padding-top: 62.5%;
}
.owner-img{
	position: absolute;
	display: block;
	width: 37.5%;/* 600px */
	height: auto;/* 450px */
	background: #C3C2C2;
	top: 30%;/* 300px */
	left: 6.25%;/* 100px */
	z-index: 10;
}
.cm-mark1{
	position: absolute;
	width: 46.3%;/* 740px */
	top: 30%;/* 300px */
	right: 4.4%;/* 70px */
	z-index: 10;
}
.cm-msg1{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 38px;/* 38px */
	font-weight: 500;
	font-style: normal;
	line-height: 1.2;
	color: #002bba;
	margin-bottom: 20px;
}
.cm-msg1::after{
	display: block;
	content: '代表メッセージ';
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 16px;/* 16px */
	font-weight: 400;
	font-style: normal;
	line-height: 1.2;
	color: #000000;
}
.cm-deco1{
	position: absolute;
	display: block;
	width: 80%;
	height: 63%;/* 630px */
	top: 21%;/* 210px */
	left: 0;
	background:rgba(135,206,250,0.4);
	border-radius: 0 20px 20px 0;
}
/*-------------------------*/
.cm-box2{
	position: relative;
	height: auto;/* 700px */
	background: url("./img/company/cm-back1.jpeg");
	background-size: cover;
}
.cm-box2::after{
	content: '';
	display: block;
	padding-top: 48.7%;
}
.cm-mark2{
	position: absolute;
	width: 40.6%;/* 650px */
	top: 21.4%;/* 150px */
	left: 6.3%;/* 100px */
	color: #FFFFFF;
}
.cm-title3{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "sans-serif";
	font-size: 36px;/* 34px */
	font-weight: 600;
	font-style: normal;
	line-height: 1.2;
	color: #FFFFFF;
}
.cm-title3::before{
	display: block;
	content: '経営理念';
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "sans-serif";
	font-size: 18px;/* 34px */
	font-weight: 300;
	font-style: normal;
	line-height: 1.2;
	color: #FFFFFF;
	margin-bottom: 4px;
}
.phi-title{
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: bold;
	font-size: 42px;/* 42px */
	line-height: 1.5;
	margin-top: 60px;
}
/*-------------------------*/
.cm-box3{
	position: relative;
	padding: 8% 0;/* 130px 0 */
	background: #1b4388;
}
.cm-title1{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 44px;/* 44px */
	font-weight: 600;
	font-style: normal;
	line-height: 1.2;
	color: #FFFFFF;
	text-align: center;
}
.cm-title1::before{
	display: block;
	content: 'COMPANY';
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 19px;/* 19px */
	font-weight: 500;
	font-style: normal;
	line-height: 1.2;
	color: #FFFFFF;
	text-align: center;
	margin-bottom: 8px;
}
.cm-title1::after{
	display: block;
	content: '会社概要';
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 17px;/* 17px */
	font-weight: 400;
	font-style: normal;
	line-height: 1.2;
	color: #FFFFFF;
	text-align: center;
	margin-top: 7px;
}
.cm-deta{
	width: 56.3%;/* 900px */
	margin: 3% auto 0;/* 50px auto 0*/
	border-collapse: collapse;
}
.cm-deta tr{
	border-bottom: 1px dotted #FFFFFF;
	font-size: 17px;/* 17px */
	line-height: 1.8;
	color: #FFFFFF;
}
.cm-deta tr th{
	width: 23.3%;/* 210px */
	padding: 17px 0;/* 17px 0*/
}
.cm-deta tr td{
	padding: 17px 0;/* 17px 0*/
}
/*-------------------------*/
.cm-box4{
	position: relative;
	padding: 6.3% 0;/* 100px 0*/
}
.cm-title2{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 44px;/* 44px */
	font-weight: 600;
	font-style: normal;
	line-height: 1.2;
}
.cm-title2::before{
	display: block;
	content: '事業所一覧';
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 19px;/* 19px */
	font-weight: 500;
	font-style: normal;
	line-height: 1.2;
	margin-bottom: 8px;
}
/*------------------------  事業所一覧　----*/
.office_grid{
	width: 100%;
	padding: 50px 0;/* 50px 0*/
	margin: 50px auto;/* 50px auto */
	border-top: 1px dotted #C7C7C7;
	border-bottom: 2px dotted #C7C7C7;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
}
.office_card{
	width: 620px;/* 620px */
	height: 230px;/* 230px */
	background: #dcdcdc;
	border-radius: 10px;
	overflow: hidden;
	padding: 30px;/* 30px */
	margin: 16px 0;/* 16px 0*/
}
.office_deta{
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 100%;
}
.office_img{
	width: 230px;/* 230px */
	height: 170px;/* 170px */
	background: #FFFFFF;
}
.office_adress{
	width: 300px;/* 300px */
	margin-left: 30px;/* 30px */
}
.office_name{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 20px;/* 20px */
	font-weight: 500;
	font-style: normal;
	line-height: 1.2;
	color: #0070C8;
}
.adress{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 15px;/* 15px */
	font-weight: 400;
	font-style: normal;
	line-height: 1.2;
	margin-top: 10px;
}
.office_map{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 15px;/* 15px */
	font-weight: 400;
	font-style: normal;
	line-height: 1.2;
	margin-top: 15px;/* 15px */
	color: #ffd700;
}
/*--------------------------------------------------------------  採用情報　-------------*/
.rec-box1{
	position: relative;
	height: auto;/* 600px */
}
.rec-box1::after{
	content: '';
	display: block;
	padding-top: 37.5%;
}
.rec-img1{
	position: absolute;
	display: block;
	width: 40.6%;/* 650px */
	height: auto;/* 445px */
	border-radius: 15px;
	top: 25%;/* 200px */
	left: 6.3%;/* 100px */
}
.rec-mark1{
	position: absolute;
	width: 40.6%;/* 650px */
	top: 26.6%;/* 160px */
	right: 6.3%;/* 100px */
}
/*----------------*/
.rec-box2-1{
	position: relative;
	padding: 11.2% 0 2.5%;/* 180px 0 40px*/
	height: auto;
}
.rec-box2-2{
	position: relative;
	width: 87.5%;/* 1400px */
	height: auto;
	margin: auto;
	padding: 6% 0;/* 100px 0*/
	background-color: #ccecff;
	border-radius: 30px;/* 30px */
}
.rec-mark2-1{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 89.2%;/* 1250px */
	margin: auto;
}
.rec-img2{
	width: 42.4%;/* 530px */
	height: auto;/* 440px */
}
.rec-mark2-2{
	width: 52%;/* 650px */
}
/*-------------*/
.rec-slide{
	width: 78.6%;/* 1100px */
	height: auto;
	margin: 90px auto 0;/* 90px auto 0*/
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
}
.slide-box1{
	position: relative;
	width: 100%;
	height: auto;/* 600px */
	background-color: #FFFFFF;
	border: 3px solid #4D9EDA;
	overflow: hidden;
	border-radius: 20px;/* 20px */
	flex-shrink: 0;
	padding: 50px;/* 50px */
	margin: 0 auto 40px;/* 0 auto 40px */
}
.stuff-box{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 90.9%;/* 1000px */
}
.face-img{
	width: 22%;/* 220px */
	height: auto;/* 220px */
	overflow: hidden;
}
.face-img img{
    width: 100%;
    height: auto;
}
.stuff-deta{
	width: 70%;/* 700px */
	padding: 0 0 20px;/* 0 0 20px */
}
.roll-point{
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 18px;/* 18px */
	line-height: 1.5;
}
.roll-name{
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 27px;/* 27px */
	line-height: 1.5;
	color: #0179C3;
}
.roll-disp{
	width: 100%;
	margin-top: 10px;/* 10px */
	border-top: 2px dotted #CDCDCD;
	padding-top: 15px;/* 15px */
}
.stuff-msg{
	width: 100%;
	margin-top: 30px;/* 30px */
	padding: 30px;/* 30px */
	background-color: #eaf7ff;
	border-radius: 10px;
	overflow: hidden;
}
.stuff-msg dt{
	padding: 12px 10px;/* 12px 10px */
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 18px;/* 18px */
	color: #0179C3;
	line-height: 1.5;
}
.stuff-msg dd{
	width: 100%;
	border-top: 2px dotted #CDCDCD;
	padding: 12px 10px;/* 12px 10px */
}
.stuff-answer{
	color: #0179C3;
}
/*-------------*/
.rec-box3{
	padding: 70px 0;/* 70px 0*/
}
.recruit-deta-box{
	position: relative;
	width: 81.3%;/* 1300px */
	height: auto;/* 1000px */
	overflow: hidden;
	background-color: #FFFFFF;
	margin: auto;
	padding: 5% 0 6.3%;/* 80px 0  100px */
	border-radius: 20px;
}
.recruit-tlt1{
	display: block;
	padding: 15px 20px;/* 15px 20px */
	background-color: #31b4ff;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
	font-optical-sizing: auto;
	font-style: normal;
	font-size: 30px;/* 30px */
	line-height: 1;
	color: #FFFEFE;
	margin: auto;
	border-radius: 10px;
}
.recruit-switch{
	display: flex;
	width: 69.2%;/* 900px */
	margin: 40px auto;/* 40px auto*/
	list-style: none;
	justify-content: space-between;
}
.recruit-switch li{
	width: 44.4%;/* 400px */
	height: auto;
	margin: 15px 1.6%;/* 15px */
	padding: 15px 0;/* 15px 0*/
	font-size: clamp(1.125rem, 0.667rem + 0.67vw, 1.25rem);/* 20px */
	font-weight: bold;
	text-align: center;
	border-radius: 14px;/* 14px */
}
.sw1{
	background: #e76a73;
	color: #FFFFFF;
}
.sw2{
	background: #0068b7;
	color: #FFFFFF;
}
.rec-area1{
    width: 76.9%;/* 1000px */
    height: auto;
    margin: auto;
    display: none;
}
.rec-area2{
    width: 76.9%;/* 1000px */
    height: auto;
    margin: auto;
    display: none;
}
.active{
	display: block;
}
/*------ 求人情報 --*/
.rec-deta{
    width: 100%;/* 1000px */
    margin: auto;
    border-collapse: collapse;
}
.rec-deta tr{
    line-height: 1.8;
}
.rec-deta th{
    width: 23%;/* 230px */
    border-bottom: 2px solid #ffa500;
    padding: 25px;
    vertical-align: middle;
    text-align: left;
    font-weight: normal;
    color: #78603b;
}
.rec-deta td{
    border-bottom:  2px solid #ACACAC;
    padding: 25px 40px;/* 25px 40px */
    vertical-align: middle;
}
.teate-list{
	list-style-position: inside;
}
/*-------------------------------------------------------------- お問い合わせ　　-----*/
.con-box1{
	padding: 10% 0;/* 160px 0*/
}
/*---------------------  お問い合わせフォーム　------*/
.contact-form{
	width: 50%;/* 800px */
	margin: auto;
}
.offer2{
	width: 87.5%;/* 700px */
	margin: 30px auto 0;/* 30px auto 0*/
}
.text1{
	width: 60%;
	padding: 10px 15px;/* 10px 15px */
	border: 1px solid #f5f5f5;
	background:rgba(220,220,220,0.3);
	border-radius: 5px;/* 5px */
	margin: 10px 0;/* 10px 0*/
	letter-spacing: 1px;
}
.text2{
	width: 100%;
	padding: 10px 15px;/* 10px 15px */
	border: 1px solid #f5f5f5;
	background:rgba(220,220,220,0.3);
	border-radius: 5px;/* 5px */
	margin: 10px 0;/* 10px 0*/
	letter-spacing: 1px;
}
.select2{
	width: 50%;
	margin: 10px 0;/* 10px 0*/
	padding: 10px 15px;/* 10px 15px */
	border: 1px solid #f5f5f5;
	background:rgba(220,220,220,0.3);
}
.textarea2{
	width: 100%;
	padding: 10px 15px;/* 10px 15px */
	min-height: 200px;/* 200px */
	border: 1px solid #f5f5f5;
	background:rgba(220,220,220,0.3);
	border-radius: 5px;/* 5px */
	margin: 10px 0;/* 10px 0 */
	letter-spacing: 1px;
}
::placeholder {
}
.submit-button{
	display: block;
	width: 37%;/* 300px */
	height: auto;/* 40px */
	background: #bbe2f1;
	border-radius: 10px;/* 10px */
	margin: 10px auto 0;/* 20px auto 0*/
	border: none;
	overflow: hidden;
	text-align: center;
	padding: 10px;/* 10px */
	transition: all 1s ease-in-out;
}
.submit-button:hover{
	background: #1076CB;
	color: #FFFFFF;
}
/*------------------------- メールプライバシー  ---------*/
.policy-title{
	display: block;
	width: 16.3%;/* 260px */
	background: #a9a9a9;
	padding: 7px;
	margin: 3.8% auto 0;/* 60px auto 0*/
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 1.2;
	font-size: 15px;
	color: #FFFFFF;
	text-align: center;
}
.mail-policy{
	width: 100%;/* 800px */
	height: 250px;/* 250px */
	margin: 20px auto;/* 20px auto */
	padding: 20px;/* 20px */
	border: 1px solid #C5C5C5;
	overflow: scroll;
}
.priv-box{
	width: 100%;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 1.5;
	font-size: 14px;
}
.priv-box dt{
	padding: 7px 0;
}
.priv-box dd{
	padding: 7px 0;
}
.riv-point{
	width: 100%;
	list-style-position: inside;
}