@charset "utf-8";
@import url('common.css');
@import url('amime.css');
@import url('slick-theme.css');
@import url('slick.css');


/*＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
TOP PAGE
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊*/



/* ＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
PCページレイアウト
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊ */


@media all and (min-width: 1025px) {


/* visu */


#visu{
	position: relative;
	vertical-align:middle;
	width:100%;
	height:100vh;
	margin:0 0 0 0;
	padding:0 0 0 0;
	text-align:center;
}


#visu div.txt{
	position: absolute;
	margin:0 0 0 0;
	padding:0 0 0 0;
	bottom: 15vh;
	right: 5vw;
	z-index:1000;
	text-align: right;
}

#visu div.txt h2{
	margin:2vw 0 1.5vw 0;
	padding:3px 30px 5px 30px;
	font-size:var(--font-58);
	font-weight:800;
	line-height:1.5;
	letter-spacing: 5px;
	background:rgba(255,255,255,0.8);
}

#visu h2 span{
	color:var(--color-BLU1);
}

#visu p span{
	display: inline--block;
	margin:0 0 10px 0;
	padding:3px 20px 5px 20px;
	font-size:var(--font-24);
	font-weight:600;
	line-height:2.1;
	letter-spacing: 2px;
	background:rgba(255,255,255,0.8);
}

#visu div.swiper{
	width:100%;
	height:100vh;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

.swiper-slide-active .swiper-slide__item,
.swiper-slide-duplicate-active .swiper-slide__item,
.swiper-slide-prev .swiper-slide__item {
  animation: zoomanime 8s linear 0s normal both;
}

@keyframes zoomanime {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.05);
  }
}


.swiper-slide img {
  width: 100%;
  height: 100vh;
	object-fit: cover;
}


.Home-Firstview__scroll {
	margin:0 0 0 0;
	padding:0 0 0 0;
	align-items:center;
	color: #ccc;
	display: flex;
	gap: 0;
	left: 50px;
	bottom:60px;
	mix-blend-mode: difference;
	position: absolute;
	transform: rotate(90deg) translate(-50%);
	transform-origin: 0 0;
	z-index: 10;
}

.Home-Firstview__scroll span.text{
	display:block;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-14);
	font-weight:400;
	line-height:2;
	letter-spacing: 1px;
}

.Home-Firstview__scroll:after {
    animation: scrollLine 2s var(--ease-outquart) both infinite;
    background: currentColor;
    content: "";
    display: block;
    flex: 0 0 auto;
    height: 1px;
    width: 100px;
}

:root {
    --ease-outquart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

@keyframes scrollLine {
0% {
    clip-path: inset(0 0 0 0);
}
50% {
    clip-path: inset(0 0 0 100%);
}
50.1% {
    clip-path: inset(0 100% 0 0);
}
100% {
    clip-path: inset(0 0 0 0);
}
}



.imgTxt {
	position: absolute;
	margin:0 0 0 0;
	padding:0 0 0 0;
	bottom:10px;
	right:20px;
	color:#fff;
	z-index:1;
	font-size:10px;
	font-weight:400;
	line-height:1.7;
text-shadow: 
    #666 1px 1px 3px, #666 -1px 1px 3px,
    #666 1px -1px 3px, #666 -1px -1px 3px;
}



/* topNews */

#topNews{
	position: relative;
	width:94%;
	max-width:1200px;
	margin:0 auto 0 auto;
	padding:130px 0 0 0;
	display: flex;
	align-items:stretch;
	flex-wrap:wrap;
}


#topNews div.title{
	width:25%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topNews div.title h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-16);
	font-weight:600;
	line-height:1.7;
	letter-spacing: 1px;
	display: flex;
	align-items:center;
	flex-wrap:wrap;
	color:var(--color-BLU1);
}

#topNews div.title h2 span{
	display:block;
	position: relative;
	margin:0 20px 0 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-38);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topNews div.title h2 span:first-letter{
	color:var(--color-BLU1);
}

#topNews div.title p a{
	display:inline-block;
	position: relative;
	margin:30px 0 0 0;
	padding:13px 30px;
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
	border:1px solid var(--color-BLU1);
}

#topNews div.title p a:hover{
	display:inline-block;
	position: relative;
	margin:30px 0 0 0;
	padding:13px 30px;
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-WH);
	border:1px solid var(--color-BLU1);
	background:var(--color-BLU1);
}

#topNews div.newsList{
	width:70%;
	margin:15px 0 0 0;
	padding:0 0 0 0;
	border-top:1px solid var(--color-Gcc);
}

#topNews div.newsList dl{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	position: relative;
	width:100%;
	display: flex;
	align-items:stretch;
	flex-wrap:wrap;
}

#topNews div.newsList dl:hover{
	background:var(--color-Ged);
}

#topNews div.newsList dt{
	width:130px;
	margin:0 0 0 0;
	padding:30px 0 30px 20px;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-16);
	font-weight:400;
	line-height:1.7;
	letter-spacing: 1px;
}

#topNews div.newsList dd{
	width:calc(100% - 150px);
	margin:0 0 0 0;
	padding:0 0;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-16);
	font-weight:400;
	line-height:1.7;
	letter-spacing: 1px;
}

#topNews div.newsList dd a{
	margin:0 0 0 0;
	padding:30px 0 30px 20px;
	display: flex;
	align-items:center;
}








/* topFeatures */

#topFeatures{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:150px 0 0 0;
	background:url(../images/bg_top_features01.webp) no-repeat 50% 380px;
}

#topFeatures div.block{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topFeatures div.ph{
	width:48%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topFeatures div.ph img{
	width:100%;
	height:460px;
	object-fit: cover;
}

#topFeatures div.title{
	width:47%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topFeatures div.title h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-16);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	display: flex;
	align-items:center;
	flex-wrap:wrap;
	color:var(--color-BLU1);
}

#topFeatures div.title h2 span{
	display:block;
	position: relative;
	margin:0 20px 0 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-38);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topFeatures div.title h2 span:first-letter{
	color:var(--color-BLU1);
}

#topFeatures div.title h3{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:30px 0 0 0;
	font-size:var(--font-43);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topFeatures div.title p{
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:80px 0 0 0;
	font-size:var(--font-15);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
	color:var(--color-WH);
}

#topFeatures div.title p a:hover{
	display:inline-block;
	position: relative;
	margin:30px 0 0 0;
	padding:13px 30px;
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-WH);
	border:1px solid var(--color-BLU1);
	background:var(--color-BLU1);
}


#topFeatures div.block ul{
	display:block;
	position: relative;
	margin:50px 0 0 0;
	padding:0 0 0 0;
	position: relative;
	width:100%;
	display: flex;
	align-items:stretch;
	flex-wrap:wrap;
}

#topFeatures div.block li{
	display: inline-block;
	margin:0 20px 0 0;
	padding:0 0;
}

#topFeatures div.block li a{
	display: block;
	margin:0 0 0 0;
	padding:10px 40px;
	display: flex;
	align-items:center;
	font-size:var(--font-18);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
}

#topFeatures div.block li:nth-child(1) a{
	background:var(--color-WH);
}
#topFeatures div.block li:nth-child(1) a:hover{
	filter: brightness(90%);
}

#topFeatures div.block li:nth-child(2) a{
	background:var(--color-BL);
	color:var(--color-WH);
}
#topFeatures div.block li:nth-child(2) a:hover{
	opacity:0.8;
}




#topFeatures div.point{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:0 auto 0 auto;
	padding:80px 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topFeatures div.point div.list{
	display:block;
	position: relative;
	width:23%;
	max-width:310px;
	height:35vw;
	max-height:480px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	background:url(../images/bg_top_features02.webp) no-repeat 50% 0;
	background-size: 100% auto;
}

#topFeatures div.point div.list p.num{
	position: absolute;
	margin:0 0 0 0;
	padding-top:clamp(0px, 5.2vw, 78px);
	padding-left:clamp(0px, 1.8vw, 26px);
	font-family: "Oswald", sans-serif;
	font-size:var(--font-26);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	top:calc(134px / 10px);
	color:var(--color-G99);
	top:0;
}

#topFeatures div.point div.list h3{
	margin:0 0 0 0;
	padding-top:clamp(50px, 12vw, 175px);
	font-size:var(--font-24);
	font-weight:700;
	line-height:1.7;
	color:var(--color-WH);
	text-align:center;
}

#topFeatures div.point div.list p.txt{
	position: absolute;
	width:80%;
	margin:0 0 0 10%;
	padding-top:clamp(50px, 27vw, 390px);
	font-family: "Oswald", sans-serif;
	font-size:var(--font-16);
	font-weight:500;
	line-height:1.7;
	text-align: left;
	top:0;
}








/* topSystem */

#topSystem{
	position: relative;
	width:100%;
	margin:100px auto 0 auto;
	padding:50px 0 80px 0;
	text-align:center;
	background:url(../images/bg_system01.webp) ;
}

#topSystem h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-16);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topSystem h2 span{
	display:block;
	position: relative;
	margin:0 0 20px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-38);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topSystem h2 span:first-letter{
	color:var(--color-BLU1);
}

#topSystem h3{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
	font-size:var(--font-43);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topSystem p{
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:10px 0 0 0;
	font-size:var(--font-15);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
}

#topSystem div.block{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:50px auto 0 auto;
	padding:0 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topSystem div.block div.list{
	display:block;
	position: relative;
	width:49%;
	max-width:650px;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topSystem div.block div.list h4{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:10px 0;
	color:var(--color-WH);
	font-size:var(--font-24);
	font-weight:600;
	line-height:2;
	letter-spacing: 3px;
}

#topSystem div.block div.sys01 h4{
	background:#1DAED6;
}

#topSystem div.block div.sys02 h4{
	background:var(--color-BLU1);
}

#topSystem div.block div.list div.fig{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topSystem div.block div.list div.fig img{
	width:100%;
}

#topSystem div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:60px 0 0 0;
}

#topSystem div.btn a{
	display:inline-block;
	position: relative;
	width:300px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-17);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topSystem div.btn a:hover{
	background: var(--color-BLU2);
}


#topSystem div.sys03{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:50px auto 0 auto;
	padding:0 0 0 0;
	display: flex;
	justify-content:flex-start;
	align-items:stretch;
	flex-wrap:wrap;
}


#topSystem div.sys03 h4{
	display:block;
	position: relative;
	width:calc(25% - 2px);
	margin:0 0 0 0;
	padding:15px 0;
	color:var(--color-WH);
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 3px;
	background:var(--color-BLU2);
	border: 1px solid var(--color-BLU2);
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

#topSystem div.sys03 p{
	display:block;
	position: relative;
	width:calc(75% - 2px);
	margin:0 0 0 0;
	padding:15px 0;
	color:var(--color-BLU2);
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 1px;
	background:var(--color-WH);
	border: 1px solid var(--color-BLU2);
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}






/* topCase */

#topCase{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:80px 0 100px 0;
	text-align:center;
}

#topCase h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-16);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topCase h2 span{
	display:block;
	position: relative;
	margin:0 0 20px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-38);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCase h2 span:first-letter{
	color:var(--color-BLU1);
}

#topCase h3{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
	font-size:var(--font-36);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCase p{
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:10px 0 0 0;
	font-size:var(--font-15);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
}

#topCase div.block{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:50px auto 0 auto;
	padding:0 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topCase div.block div.list{
	display:block;
	position: relative;
	width:30%;
	max-width:420px;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.ph{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.ph img{
	width:100%;
}

#topCase div.block div.list h4{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 10px 0;
	padding:10px 0 0 0;
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 2px;
	text-align:left;
}

#topCase div.block div.list div.txt{
	width:100%;
	margin:0 0 0 0;
	padding:0 0;
	display: flex;
	align-items: center;
	flex-wrap:wrap;
}

#topCase div.block div.list div.txt p.cate01{
	margin:0 0 0 0;
	padding:7px 15px;
	border:1px solid var(--color-BLU1);
	color:var(--color-BLU1);
	font-size:var(--font-14);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCase div.block div.list div.txt p.cate02{
	margin:0 0 0 10px;
	padding:0 0;
	color:var(--color-BLU1);
	font-size:var(--font-14);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCase div.block div.list div.fig{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.fig img{
	width:100%;
}

#topCase div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:60px 0 0 0;
}

#topCase div.btn a{
	display:inline-block;
	position: relative;
	width:300px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-17);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCase div.btn a:hover{
	background: var(--color-BLU2);
}











/* topCompany */

#topCompany{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:80px 0 100px 0;
	text-align: center;
	background: var(--color-BLU3);
}

#topCompany h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-16);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topCompany h2 span{
	display:block;
	position: relative;
	margin:0 0 20px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-38);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCompany h2 span:first-letter{
	color:var(--color-BLU1);
}

#topCompany div.block{
	display:block;
	position: relative;
	width:94%;
	max-width:1340px;
	margin:60px auto 0 auto;
	padding:0 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topCompany div.block div.ph{
	display:block;
	position: relative;
	width:45%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCompany div.block div.ph img{
	width:100%;
}

#topCompany div.block table{
	display:block;
	position: relative;
	width:50%;
	max-width:680px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	border-collapse: collapse;
	border-top:1px solid var(--color-Gcc);
}

#topCompany div.block th{
	width:200px;
	margin:0;
	padding:15px 10px;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-16);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	text-align: left;
}

#topCompany div.block td{
	width:500px;
	margin:0;
	padding:15px 10px;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-16);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	text-align: left;
}


#topCompany div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:60px 0 0 0;
}

#topCompany div.btn a{
	display:inline-block;
	position: relative;
	width:300px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-17);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCompany div.btn a:hover{
	background: var(--color-BLU2);
}


}













/* ＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
SPページレイアウト
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊ */

@media all and (max-width: 1024px) {


/* visu */


#visu{
	position: relative;
	vertical-align:middle;
	width:100%;
	height:100vh;
	margin:0 0 0 0;
	padding:0 0 0 0;
	text-align:center;
}


#visu div.txt{
	position: absolute;
	margin:0 0 0 0;
	padding:0 0 0 0;
	bottom: 10vh;
	right: 0;
	z-index:1000;
}

#visu div.txt h2{
	width:75vw;
	max-width:440px;
	display: inline--block;
	margin:2vw 0 1.5vw 20vw;
	padding:8px 0 10px 5vw;
	font-size:min(8vw,50px);
	font-weight:800;
	line-height:1.4;
	letter-spacing: 5px;
	background:rgba(255,255,255,0.7);
	text-align: left;
}

#visu h2 span{
	color:var(--color-BLU1);
}

#visu p{
	margin:20px 0 0 0;
	padding:0 0 0 0;
	text-align: right;
}

#visu p span{
	display: inline-block;
	margin:0 0 3px 0;
	padding:5px 10px 7px 20px;
	font-size:min(3.5vw,20px);
	font-weight:600;
	line-height:1.6;
	letter-spacing: 1px;
	background:rgba(255,255,255,0.7);
}

#visu div.swiper{
	width:100%;
	height:100vh;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

.swiper-slide-active .swiper-slide__item,
.swiper-slide-duplicate-active .swiper-slide__item,
.swiper-slide-prev .swiper-slide__item {
  animation: zoomanime 8s linear 0s normal both;
}

@keyframes zoomanime {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.05);
  }
}


.swiper-slide img {
  width: 100%;
  height: 100vh;
	object-fit: cover;
}


.Home-Firstview__scroll {
	margin:0 0 0 0;
	padding:0 0 0 0;
	align-items:center;
	color: #ccc;
	display: flex;
	gap: 0;
	left: 50px;
	bottom:35px;
	mix-blend-mode: difference;
	position: absolute;
	transform: rotate(90deg) translate(-50%);
	transform-origin: 0 0;
	z-index: 10;
	display: none;
}

.Home-Firstview__scroll span.text{
	display:block;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-14);
	font-weight:400;
	line-height:2;
	letter-spacing: 1px;
}

.Home-Firstview__scroll:after {
    animation: scrollLine 2s var(--ease-outquart) both infinite;
    background: currentColor;
    content: "";
    display: block;
    flex: 0 0 auto;
    height: 1px;
    width: 50px;
}

:root {
    --ease-outquart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

@keyframes scrollLine {
0% {
    clip-path: inset(0 0 0 0);
}
50% {
    clip-path: inset(0 0 0 100%);
}
50.1% {
    clip-path: inset(0 100% 0 0);
}
100% {
    clip-path: inset(0 0 0 0);
}
}



.imgTxt {
	position: absolute;
	margin:0 0 0 0;
	padding:0 0 0 0;
	bottom:10px;
	right:20px;
	color:#fff;
	z-index:1;
	font-size:10px;
	font-weight:400;
	line-height:1.7;
text-shadow: 
    #666 1px 1px 3px, #666 -1px 1px 3px,
    #666 1px -1px 3px, #666 -1px -1px 3px;
}



/* topNews */

#topNews{
	position: relative;
	width:90%;
	margin:0 auto 0 auto;
	padding:70px 0 0 0;
	display: flex;
	align-items:stretch;
	flex-wrap:wrap;
}


#topNews div.title{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
}

#topNews div.title h2{
	width:50%;
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-13);
	font-weight:600;
	line-height:1.7;
	letter-spacing: 1px;
	display: flex;
	align-items:center;
	flex-wrap:wrap;
	color:var(--color-BLU1);
}

#topNews div.title h2 span{
	display:inline-block;
	position: relative;
	margin:0 10px 0 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-28);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topNews div.title h2 span:first-letter{
	color:var(--color-BLU1);
}

#topNews div.title p{
	width:50%;
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	text-align:right;
}

#topNews div.title p a{
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:5px 20px;
	font-size:var(--font-13);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
	border:1px solid var(--color-BLU1);
}

#topNews div.newsList{
	width:100%;
	margin:15px 0 0 0;
	padding:0 0 0 0;
	border-top:1px solid var(--color-Gcc);
}

#topNews div.newsList dl{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:15px 0;
	position: relative;
	width:100%;
	border-bottom:1px solid var(--color-Gcc);
}

#topNews div.newsList dl:hover{
	background:var(--color-Ged);
}

#topNews div.newsList dt{
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-13);
	font-weight:400;
	line-height:1.7;
	letter-spacing: 1px;
}

#topNews div.newsList dd{
	margin:3px 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-15);
	font-weight:400;
	line-height:1.7;
	letter-spacing: 1px;
}

#topNews div.newsList dd a{
	margin:0 0 0 0;
	padding:0 0 0 0;
}








/* topFeatures */

#topFeatures{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:70px 0 0 0;
}

#topFeatures div.block{
	display:block;
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	text-align:center;
}

#topFeatures div.ph{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topFeatures div.ph img{
	width:100%;
	height:50vw;
	object-fit: cover;
}


#topFeatures div.title{
	width:100%;
	margin:0 auto;
	padding:50px 0 50px 0;
	background:url(../images/bg_top_features01.webp) no-repeat 50% 210px;
	background-size: auto 100%;
}

#topFeatures h2{
	display:block;
	position: relative;
	width:90%;
	margin:0 auto;
	padding:0 0 0 0;
	font-size:var(--font-13);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topFeatures h2 span{
	display:block;
	position: relative;
	margin:0 0 10px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-28);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topFeatures h2 span:first-letter{
	color:var(--color-BLU1);
}

#topFeatures h3{
	display:block;
	position: relative;
	width:90%;
	margin:0 auto;
	padding:30px 0 0 0;
	font-size:var(--font-24);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topFeatures p{
	display:inline-block;
	position: relative;
	width:90%;
	margin:0 auto;
	padding:50px 0 0 0;
	font-size:var(--font-14);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
	color:var(--color-WH);
	text-align:left;
}

#topFeatures div.block ul{
	display:block;
	position: relative;
	margin:30px 0 0 0;
	padding:0 0 0 0;
	position: relative;
	width:100%;
	display: flex;
	justify-content:center;
	align-items:stretch;
	flex-wrap:wrap;
}

#topFeatures div.block li{
	display: inline-block;
	margin:0 10px 0 0;
	padding:0 0;
}

#topFeatures div.block li a{
	display: block;
	margin:0 0 0 0;
	padding:10px 20px;
	display: flex;
	align-items:center;
	font-size:var(--font-14);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
}

#topFeatures div.block li:nth-child(1) a{
	background:var(--color-WH);
}
#topFeatures div.block li:nth-child(1) a:hover{
	filter: brightness(90%);
}

#topFeatures div.block li:nth-child(2) a{
	background:var(--color-BL);
	color:var(--color-WH);
}
#topFeatures div.block li:nth-child(2) a:hover{
	opacity:0.8;
}




#topFeatures div.point{
	display:block;
	position: relative;
	width:94%;
	margin:0 auto 0 auto;
	padding:30px 0 0 0;
	display: flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
}

#topFeatures div.point div.list{
	display:block;
	position: relative;
	width:49%;
	height:73vw;
	max-height:1000px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	background:url(../images/bg_top_features02.webp) no-repeat 50% 0;
	background-size: 100% auto;
}

#topFeatures div.point div.list p.num{
	position: absolute;
	margin:0 0 0 0;
	padding-top:11vw;
	padding-left:4vw;
	font-family: "Oswald", sans-serif;
	font-size:min(4.5vw,280%);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	color:var(--color-G99);
}

#topFeatures div.point div.list h3{
	width:100%;
	margin:0 0 0 0;
	padding-top:26vw;
	font-size:min(4vw,270%);
	font-weight:700;
	line-height:1.7;
	color:var(--color-WH);
	text-align:center;
}

#topFeatures div.point div.list p.txt{
	display:block;
	position: absolute;
	width:80%;
	margin:0 0 0 10%;
	padding-top:19vw;
	font-size:min(2.3vw,138%);
	font-weight:500;
	line-height:1.7;
	text-align: left;
	color:var(--color-BL);
}








/* topSystem */

#topSystem{
	position: relative;
	width:100%;
	margin:50px auto 0 auto;
	padding:50px 0 50px 0;
	text-align:center;
	background:url(../images/bg_system01.webp) ;
}

#topSystem h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-14);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topSystem h2 span{
	display:block;
	position: relative;
	margin:0 0 10px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-24);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topSystem h2 span:first-letter{
	color:var(--color-BLU1);
}

#topSystem h3{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:30px 0 0 0;
	font-size:var(--font-30);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topSystem p{
	display:inline-block;
	position: relative;
	margin:0 0 0 0;
	padding:10px 0 0 0;
	font-size:var(--font-15);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
}

#topSystem div.block{
	display:block;
	position: relative;
	width:80%;
	margin:30px auto 0 auto;
	padding:0 0 0 0;
}

#topSystem div.block div.list{
	display:block;
	position: relative;
	width:100%;
	margin:20px 0 0 0;
	padding:0 0 0 0;
}

#topSystem div.block div.list h4{
	display:block;
	position: relative;
	width:calc(100% - 2px);
	margin:0 0 0 0;
	padding:10px 0;
	color:var(--color-WH);
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 3px;
}

#topSystem div.block div.sys01 h4{
	background:#1DAED6;
}

#topSystem div.block div.sys02 h4{
	background:var(--color-BLU1);
}

#topSystem div.block div.list div.fig{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topSystem div.block div.list div.fig img{
	width:100%;
}

#topSystem div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
}

#topSystem div.btn a{
	display:inline-block;
	position: relative;
	width:260px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topSystem div.btn a:hover{
	background: var(--color-BLU2);
}




#topSystem div.sys03{
	display:block;
	position: relative;
	width:80%;
	margin:30px auto 0 auto;
	padding:0 0 0 0;
}


#topSystem div.sys03 h4{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:10px 0;
	color:var(--color-WH);
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 3px;
	background:var(--color-BLU2);
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

#topSystem div.sys03 p{
	display:block;
	position: relative;
	width:calc(100% - 2px);
	margin:0 0 0 0;
	padding:15px 0;
	color:var(--color-BLU2);
	font-size:var(--font-20);
	font-weight:600;
	line-height:2;
	letter-spacing: 1px;
	background:var(--color-WH);
	border: 1px solid var(--color-BLU2);
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}






/* topCase */

#topCase{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:70px 0 70px 0;
	text-align:center;
}

#topCase h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-14);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topCase h2 span{
	display:block;
	position: relative;
	margin:0 0 10px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-24);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCase h2 span:first-letter{
	color:var(--color-BLU1);
}

#topCase h3{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
	font-size:var(--font-24);
	font-weight:700;
	line-height:1.4;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCase p{
	display:inline-block;
	position: relative;
	width:90%;
	margin:0 auto 0 auto;
	padding:10px 0 0 0;
	font-size:var(--font-14);
	font-weight:500;
	line-height:2;
	letter-spacing: 1px;
}

#topCase div.block{
	display:block;
	position: relative;
	width:80%;
	margin:20px auto 0 auto;
	padding:0 0 0 0;
}

#topCase div.block div.list{
	display:block;
	position: relative;
	width:100%;
	margin:30px 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.ph{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.ph img{
	width:100%;
}

#topCase div.block div.list h4{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:7px 0 7px 0;
	font-size:var(--font-18);
	font-weight:600;
	line-height:2;
	letter-spacing: 2px;
	text-align:left;
}

#topCase div.block div.list div.txt{
	width:100%;
	margin:0 0 0 0;
	padding:0 0;
	display: flex;
	align-items: center;
	flex-wrap:wrap;
}

#topCase div.block div.list div.txt p.cate01{
	width:35%;
	margin:0 10px 0 0;
	padding:7px 0;
	border:1px solid var(--color-BLU1);
	color:var(--color-BLU1);
	font-size:var(--font-13);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCase div.block div.list div.txt p.cate02{
	width:50%;
	margin:0 0 0 0;
	padding:0 0;
	color:var(--color-BLU1);
	font-size:var(--font-14);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
	text-align:left;
}

#topCase div.block div.list div.fig{
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCase div.block div.list div.fig img{
	width:100%;
}

#topCase div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
}

#topCase div.btn a{
	display:inline-block;
	position: relative;
	width:260px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCase div.btn a:hover{
	background: var(--color-BLU2);
}











/* topCompany */

#topCompany{
	position: relative;
	width:100%;
	margin:0 auto 0 auto;
	padding:70px 0 70px 0;
	text-align: center;
	background: var(--color-BLU3);
}

#topCompany h2{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:0 0 0 0;
	font-size:var(--font-14);
	font-weight:600;
	line-height:1;
	letter-spacing: 1px;
	color:var(--color-BLU1);
}

#topCompany h2 span{
	display:block;
	position: relative;
	margin:0 0 10px 0;
	padding:0 0 0 0;
	font-family: "Oswald", sans-serif;
	font-size:var(--font-24);
	font-weight:500;
	line-height:1;
	letter-spacing: 2px;
	color:var(--color-BL);
}

#topCompany h2 span:first-letter{
	color:var(--color-BLU1);
}

#topCompany div.block{
	display:block;
	position: relative;
	width:90%;
	margin:50px auto 0 auto;
	padding:0 0 0 0;
}

#topCompany div.block div.ph{
	display:block;
	position: relative;
	width:100%;
	margin:0 0 0 0;
	padding:0 0 0 0;
}

#topCompany div.block div.ph img{
	width:100%;
}

#topCompany div.block table{
	display:block;
	position: relative;
	width:100%;
	margin:30px auto 0 auto;
	padding:0 0 0 0;
	border-collapse: collapse;
}

#topCompany div.block th{
	width:40%;
	margin:0;
	padding:15px 0 15px 0;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-13);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	text-align: left;
}

#topCompany div.block td{
	width:60%;
	margin:0;
	padding:15px 0 15px 0;
	border-bottom:1px solid var(--color-Gcc);
	font-size:var(--font-14);
	font-weight:500;
	line-height:1.7;
	letter-spacing: 1px;
	text-align: left;
}


#topCompany div.btn{
	display:block;
	position: relative;
	margin:0 0 0 0;
	padding:50px 0 0 0;
}

#topCompany div.btn a{
	display:inline-block;
	position: relative;
	width:260px;
	margin:0 0 0 0;
	padding:17px 0;
	background: var(--color-BLU1);
	color: var(--color-WH);
	font-size:var(--font-15);
	font-weight:500;
	line-height:1;
	letter-spacing: 1px;
}

#topCompany div.btn a:hover{
	background: var(--color-BLU2);
}

}