@charset "UTF-8";

.wrap {
	width:100%;
	padding:50px 0;
	text-align:center;
	background-color: #ffffff;
}
.contents {
	width:calc(100% - 60px);
	max-width:1100px;
	margin:0 auto;
	box-sizing:border-box;
	text-align:left;
	position:relative;
}
.wrap h2 {
	font-size:6.0rem;
    font-family: 'Lato', sans-serif;
    font-weight:500;
    letter-spacing:0.05em;
    text-align:center;
    line-height:1;
    margin-bottom:1em;
}
.wrap h2 span {
    display:block;
    font-size:2.1rem;
    line-height:1;
    color:#023894;
    font-weight:600;
    letter-spacing:normal;
    padding:.8em 0 0;
}


@media screen and (min-width:1889px){
	
#main {
	padding-top:944px;
}
	
}

#main {
	padding-top:calc(100vw * 0.504823);
}

/****/
#mainimg {
	position:relative;/*
	background:url(../img/top/mainimg.jpg) no-repeat center center;	
	background-size:cover;*/
	text-align: center;
	width:100%;
	overflow:hidden;
	position:fixed;
	top:150px;
	left:0;
	z-index:0;
}
#mainimg.off {
	z-index:-1;
}
#mainimg .swiper-slide {
	position:relative;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	text-align: center;
}
#mainimg .swiper-slide.slide1{
	background-image:url(../img/top/mainimg1.jpg);	
}
#mainimg .swiper-slide.slide2{
	background-image:url(../img/top/mainimg2.jpg);	
}
#mainimg .swiper-slide.slide3{
	background-image:url(../img/top/mainimg3.jpg);	
}


/*2023追加*/
#mainimg .swiper-slide.slide4{
	background-image:url(../img/top/mainimg4.jpg);	
}


#mainimg > div {
	width:100%;
	height:50vw;
	min-height:500px;
	/*max-height:calc(100vh - 150px);*/
	max-height: calc(100vh - 150px - 150px);
}
#mainimg .swiper-slide > div {
    width:calc(100% - 60px);
    max-width:1100px;
    height: 100%;
    margin:0 auto;
    position: relative;
}
#mainimg > div h1 {
	width:100%;
	font-size:5.5rem;
	text-align:left;
	color:#ffffff;
	line-height:1.3;
	box-sizing:border-box;
	margin-bottom:.5em;
}
#mainimg > div p {
	font-size:3.6rem;
	color:#ffffff;
	line-height:1.5;
    font-weight:600;
    text-align:left;
    margin:0;
	box-sizing:border-box;
}
#mainimg > div a {
	display:inline-block;
	width:auto;
	min-width:200px;
	background:#faa121;
	text-align:center;
	box-sizing:border-box;
	padding:0 1.5em;
	position:absolute;
	right:5%;
	bottom:calc(25% - 3em);
	font-size:1.8rem;
	color:#ffffff;
	line-height:3;
	transition:.3s;
	border:3px solid #faa121;
}
#mainimg > div a:hover {
	background:#ff6600;
}

#mainimg .swiper-slide > div > div {
	position:absolute;
}
#mainimg .swiper-slide.slide1 > div > div {
	left:5%;
	top:50%;
	transform:translateY(-50%);
}
#mainimg .swiper-slide.slide2 > div > div {
	left:5%;
	top:50%;
	transform:translateY(-50%);
}
#mainimg .swiper-slide.slide3 > div > div {
	left:5%;
	top:50%;
	transform:translateY(-40%);
}


/*2023追加*/
#mainimg .swiper-slide.slide4 > div > div {
	left:5%;
	top:50%;
	transform:translateY(-50%);
}


#mainimg > div .slide1 h1 {
	text-shadow:0px 0px 2px rgba(0,0,0,1),5px 5px 0px rgba(0,0,0,.66);

}
#mainimg > div .slide1 p {
	text-shadow: 0 0 3px rgba(0,0,0,.5),0 0 6px rgba(0,0,0,.5),0 0 9px rgba(0,0,0,.5);
}
#mainimg > div .slide2 h1 {
	text-shadow:5px 5px 0px rgba(255,255,255,.5);
	
}

#mainimg > div .slide3 h1 {
	color:#000000;
	text-shadow:0 0 2px rgba(255,255,255,1),0 0 3px rgba(255,255,255,1),0 0 5px rgba(255,255,255,1),5px 5px 0px rgba(0,0,0,.5);
}
#mainimg > div .slide3 p {
	color:#000000;
	text-shadow:0 0 4px rgba(255,255,255,1),0 0 4px rgba(255,255,255,1),0 0 4px rgba(255,255,255,1),0 0 4px rgba(255,255,255,1),0 0 6px rgba(255,255,255,1),0 0 6px rgba(255,255,255,1),0 0 6px rgba(255,255,255,1),0 0 6px rgba(255,255,255,1),0 0 8px rgba(255,255,255,1),0 0 8px rgba(255,255,255,1),0 0 8px rgba(255,255,255,1),0 0 8px rgba(255,255,255,1);
}

/*2023追加*/
#mainimg > div .slide4 h1 {
	text-shadow:0px 0px 2px rgba(0,0,0,1),5px 5px 0px rgba(0,0,0,.66);
}
#mainimg > div .slide4 p {
/*	text-shadow: 0 0 3px rgba(0,0,0,.5),0 0 6px rgba(0,0,0,.5),0 0 9px rgba(0,0,0,.5);*/
	font-size: 3rem;
	color: #535353;
	line-height: 1.1;
	padding-top: 7px;
}
#mainimg > div .slide4 .top-flexbox{
	display: flex;
	background-color: #e7ff56;
	padding: 5px 20px;
}
#mainimg > div .slide4 .top-flexbox img{
	height: 88px;
	margin-right: 14px;
}
/*2023追加*/


#mainimg > div .slide4 p br.sp {
	display:none;
} 
.swiper-button-prev:after, .swiper-button-next:after {
	color:#204b8d;
}

/**search***/
#search .wrap {
	padding-top:120px;
}
#search .searchwrap {
	width:100%;
	background:#f8f8f8;
	padding-bottom:50px;
}
#search .wrap h2 {
	text-align:left;
	transform:translateY(-.5em);
	margin-bottom:0;
}
#search .contents .fbox {
    width:100%;
}
#search .contents .fbox div {
	width:calc(100%/4 - 15px);
	box-sizing:border-box;
	border:1px solid #cdcdcd;
	text-align:center;
	overflow: hidden;
	position:relative;
}
#search .contents .fbox div select {
	width: 100%;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
#search .contents .fbox div select::-ms-expand {
    display: none;
}
#search .contents .fbox div::before {
	position: absolute;
	top: 50%;
	transform:translateY(-50%);
	right: 1.2em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 14px solid #181818;
	pointer-events: none;
}
#search .contents .fbox div select {
	box-sizing:border-box;
	font-size:1.8rem;
	font-weight:100;
	padding: 1.5em 2.5em 1.5em 1.5em;
}
#search .contents .fbox button {
	width:calc(100%/4 - 15px);
	background:#2e2e2e;
	color:#ffffff;
	text-align:center;
	font-size:2.4rem;
	line-height:3;
	transition:.3s;
	box-sizing:border-box;
	padding-right:1em
}
#search .contents .fbox button:hover {
    background:#000000;
}
#search .contents .fbox button::before {
	content:'';
	display:inline-block;
	width:1.2em;
	height:1.2em;
	background:url(../img/common/searchw.png) no-repeat center center;
	background-size:contain;
	margin-right:.5em;
	position:relative;
	top:.3em;
}

/**product**/
#product {
	background-color: #fff;
}

#product .wrap {
    padding-bottom:100px;
	width: calc(100% - 60px);
    max-width: 1100px;
    margin: 0 auto;
}
#product .contents {
	width:100%;
	max-width:100%;
}
#product .contents ul {
    width:100%;
}
#product .contents li {
	width:50%;
	overflow:hidden;
	position:relative;
	z-index:1;
}
#product .contents li a {
	display:block;
	height:250px;
	position:relative;
	text-align:center;
	transition:.3s;
	z-index:2;
}
#product .contents li a:hover {
	opacity:.8;
}
#product .contents li a::after {
	content:'';
	display:block;
	width:58px;
	height:58px;
	background-image:url(../img/common/arrow.png);
	background-color:#023894;
	border-radius:50%;
	box-sizing:border-box;
	border:2px solid #023894;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	position:absolute;
	right:10px;
	bottom:10px;
	transition:.3s;
}
#product .contents li a:hover::after {
	border:2px solid #ffffff;
	background-color:rgba(255,255,255,0);
}
#product .contents li h3 {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    font-size:3.0rem;
    line-height:1;
    color:#ffffff;
    letter-spacing:.1em;
    text-shadow:0 0 3px rgba(0,0,0,1),0 0 5px rgba(0,0,0,1),0 0 7px rgba(0,0,0,1),0 0 9px rgba(0,0,0,1),0 0 3px rgba(0,0,0,1),0 0 5px rgba(0,0,0,1),0 0 7px rgba(0,0,0,1),0 0 9px rgba(0,0,0,1);
}
#product .contents li::after {
	content:'';
	display:block;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center center;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	transition:.3s;
}
#product .contents li:hover::after {
	transform:scale(1.05);
}
#product .contents li:nth-child(1)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/product1.jpg);
}
#product .contents li:nth-child(2)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/product2.jpg);
}
#product .contents li:nth-child(3)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/product3.jpg);
}
#product .contents li:nth-child(4)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/product4.jpg);
}

/**solution**/
#solution .wrap {
    background:url(/wp/wp-content/uploads/2021/08/solution_bg.jpg) no-repeat center center;
    background-size:auto 100vh;
    background-attachment:fixed;
	background-color: #ffffff;
}
#solution .wrap h2,
#solution .wrap h2 span {
    color:#ffffff;
}
#solution .contents ul {
	width:100%;
}
#solution .contents li {
    width:calc(100%/3 - 20px);
    box-sizing:border-box;
    border-right:1px solid #ffffff;
    border-bottom:1px solid #ffffff;
    text-align:center;
    box-sizing:border-box;
    padding-bottom:30px;
    transition:.3s;
    position:relative;
    z-index:1;
}
#solution .contents li:hover {
	transform:scale(1.1);
	z-index:2;
}
#solution .contents li > div {
    width:100%;
}
#solution .contents li > div > img {
	width:25%;
	margin-bottom:40px;
}
#solution .contents li > div > h3 {
	font-size:3.0rem;
	line-height:1;
	color:#Ffffff;
	margin-bottom:.8em;
}
#main #solution .contents li > div > p {
    font-size:2.0rem;
    color:#ffffff;
    line-height:1.5;
    margin-bottom:1em;
}
#main #solution .contents li > a {
	font-size:2.0rem;
	line-height:1;
	color:#ffffff;
	transition:.3s;
}
#main #solution .contents li > a:hover {
	opacity:.8;
}
#main #solution .contents li > a::before {
	content:'';
	display:inline-block;
	width:.8em;
	height:.8em;
	background:url(../img/common/arroww_right.png) no-repeat center center;
	background-size:contain;
	margin-right:.5em;
	transition:.3s;
}
#main #solution .contents li > a:hover::before {
	margin-right:.3em;
}

/**news**/
#news .wrap {
	padding-top:100px;
}
#news .wrap .news {
	position:relative;
}
#news .wrap .news dl {
	width:100%;
	font-size:1.6rem;
	box-sizing:border-box;
	padding:1.5em 0;
	border-bottom:1px solid #ebebeb;
}
#news .wrap .news dd:first-child {
	width:7em;
	position:relative;
}
#news .wrap .news dd.cat {
	width:7em;
	box-sizing:border-box;
	padding-right:1em;
}
#news .wrap .news dd.cat span {
	display:block;
	color:#ffffff;
	text-align:center;
	line-height:2;
	font-size:1.4rem;
}
#news .wrap .news dd.cat span.company {
	background:#54cea4;
}
#news .wrap .news dd.cat span.product {
	background:#f7bf53;
}
#news .wrap .news dd.cat span.event {
	background:#f999c0;
}
#news .wrap .news dt {
    width:calc(100% - 14em);
}
#news .wrap .news > a {
	font-size:1.8rem;
	line-height:2;
	width:6em;
	text-align:center;
    display:block;
    margin:0 auto;
    position:absolute;
    top:-3em;
    right:0;
    background:#F3F3F3;
    border:1px solid #ebebeb;
    transition:.3s;
}
#news .wrap .news > a:hover {
	background:#204b8d;
	color:#ffffff;
}


/**bnr**/
#bnr .wrap {
    padding-bottom:60px;
}
#bnr ul {
	width:100%;
}
#bnr li {
    width:calc(50% - 20px);
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
    margin-bottom:40px;
	box-sizing:border-box;
	padding:10px;
	overflow:hidden;
	cursor:pointer;
	position:relative;
}
#bnr li:nth-child(1) {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr1.jpg);
}
#bnr li:nth-child(2) {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr2.jpg);
}
#bnr li:nth-child(3) {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr3.jpg);
}
#bnr li:nth-child(4) {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr4.jpg);
}
#bnr li::after {
	content:'';
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
    transition:.5s;
    opacity:0;
}
#bnr li:nth-child(1)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr1_on.jpg);
}
#bnr li:nth-child(2)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr2_on.jpg);
}
#bnr li:nth-child(3)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr3_on.jpg);
}
#bnr li:nth-child(4)::after {
	background-image:url(/wp/wp-content/uploads/2021/08/bnr4_on.jpg);
}
#bnr li a {
	width:100%;
	height:220px;
	box-sizing:border-box;
	border:1px solid #ffffff;
	position:relative;
	z-index:2;
}
#bnr li a h3 {
	width:100%;
	text-align:center;
	font-size:4.8rem;
	color:#ffffff;
	line-height:1;
    font-family: 'Lato', sans-serif;
    font-weight:400;
    letter-spacing:.05em;
    margin-bottom:0;
}
#bnr li a h3 span {
    display:block;
    font-size:1.8rem;
    font-weight:600;
    letter-spacing:normal;
    line-height:1;
    padding:.6em 0 1em;
}
#bnr li a > span {
	font-size:1.4rem;
	line-height:2.4;
	width:14em;
	text-align:center;
	background:#Ffffff;
	transition:.3s;
	box-sizing:border-box;
	border:3px solid #ffffff;
}
#bnr li:hover a > span {
	background:none;
	color:#ffffff;
}
#bnr li:hover::after {
    opacity:1;
}

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

#mainimg > div h1 {
	font-size:3.6vw;
}
#mainimg > div p {
	font-size:2.6vw;
}

}

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

#main {
	padding-top:500px;
}
.contents {
	width:calc(100% - 40px);
}

#mainimg > div h1 {
	font-size:3.8rem;
}
#mainimg > div p {
	font-size:2.8rem;
}

}

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

#solution .wrap {
    background-size:cover;
    background-attachment: unset;
}

}

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

.wrap {
	padding:10vw 0;
}

.wrap h2 {
	font-size:9vw;
}
.wrap h2 span {
    font-size:4vw;
}

#main {
	padding-top:400px;
}
	
/****/
#mainimg {
	top:calc(100vw * 0.187);
}
#mainimg > div {
	min-height:400px;
	height:50vw;
	
}
#mainimg > div > a:hover {
	background:#faa121;
}


#mainimg > div h1 {
	font-size:6.5vw;
}
#mainimg > div p {
	font-size:4.5vw;
}
#mainimg > div a {
	font-size:3vw;
	min-width:240px;
	padding:0;
	bottom:30px;
	right:50%;
	transform:translateX(50%);
}
#mainimg > div > a:hover {
	background:#ff6600;
}
#mainimg .swiper-slide > div {
    width: calc(100% - 40px);
}
#mainimg .swiper-slide.slide1 > div > div {
	top:30%;
}
#mainimg .swiper-slide.slide2 > div > div {
	top:30%;
}
#mainimg .swiper-slide.slide3 > div > div {
	top:30%;
}
#mainimg .swiper-slide.slide4 > div > div {
	top:42%;
}
#mainimg > div .slide1 h1 {
	text-shadow:0px 0px 2px rgba(0,0,0,1),3px 3px 0px rgba(0,0,0,.66);

}
#mainimg > div .slide2 h1 {
	text-shadow:3px 3px 0px rgba(255,255,255,.5);
	
}
#mainimg > div .slide3 h1 {
	color:#000000;
	text-shadow:0 0 2px rgba(255,255,255,1),0 0 3px rgba(255,255,255,1),0 0 5px rgba(255,255,255,1),3px 3px 0px rgba(0,0,0,.5);
}


#mainimg > div .slide3 h1 br.sp,
#mainimg > div .slide3 p br.sp {
	display:inline;
}

/*2023追加*/
#mainimg > div .slide4 h1 {
text-shadow:0px 0px 2px rgba(0,0,0,1),2px 2px 0px rgba(0,0,0,.66);
}
#mainimg > div .slide4 h1 br.sp,
#mainimg > div .slide4 p br.sp {
	display:inline;
}
	#mainimg > div .slide4 p {
	font-size: 1.8rem;
	line-height: 1.1;
	padding-top: 5px;
}
#mainimg > div .slide4 .top-flexbox{
	padding: 5px 5px;
	margin-top: 30px;
}
#mainimg > div .slide4 .top-flexbox img{
	height: 50px;
	margin-right: 5px;
}
/*2023追加*/

	
.swiper-button-prev:after, .swiper-button-next:after {
	content:none;
}

/**search***/
#search .wrap {
	padding-top:20vw;
	padding-bottom:0;
}
#search .searchwrap {
	padding-bottom:15vw;
}
#search .wrap h2 {
	text-align:center;
	margin-bottom:.5em;
}
#search .contents .fbox div {
	width:100%;
	margin-bottom:5vw;
}
#search .contents .fbox div select {
	box-sizing:border-box;
	font-size:4vw;
	font-weight:100;
	padding: 1.0em 2.5em 1.0em 1.0em;
}
#search .contents .fbox button {
	line-height:3;
    font-size:4.5vw;
	width:50%;
	margin:0 auto;
	transition:0;
	-webkit-box-ordinal-group: 1;
	-ms-flex-order: 4;
	order: 4;
}
#search .contents .fbox button:hover {
	background:#2e2e2e;
}

/**product**/
#product .wrap {
    padding-bottom:10vw;
}
#product .contents li {
    width:100%;
}
#product .contents li a {
	height:125px;
	transition:0;
}
#product .contents li a:hover {
	opacity:1;
}
#product .contents li a::after {
	transition:0;
	width:34px;
	height:34px;
}
#product .contents li a:hover::after {
	transform:scale(1.0);
}
#product .contents li h3 {
    font-size:6vw;
}

/**solution**/
#solution .contents li {
    width:90%;
    margin:0 auto 10vw;
    padding-bottom:8vw;
}
#solution .contents li:hover {
	transform:scale(1);
}
#solution .contents li:last-child {
	margin-bottom:0;
}
#solution .contents li > div > img {
	width:20%;
	margin-bottom:5vw;
}
#solution .contents li > div > h3 {
	font-size:5.5vw;
}
#main #solution .contents li > div > p {
    font-size:3.6vw;
    margin-bottom:1.5em;
}
#main #solution .contents li > a {
    font-size:3.4vw;
	transition:0;
}
#main #solution .contents li > a:hover {
	opacity:1;
}

/**news**/
#news .wrap {
	padding-top:10vw;
}
#news .wrap .news {
	padding-bottom:10vw;
}
#news .wrap .news dl {
	width:100%;
	font-size:4vw;
	padding:1.0em 0;
  -webkit-box-pack: start;
     -ms-flex-pack: start;
   justify-content: flex-start;
}
#news .wrap .news dl:first-child {
	padding-top:0;
}
#news .wrap .news dl:nth-last-child(2) {
	margin-bottom:5vw;
}
#news .wrap .news dd.cat span {
	display:block;
	color:#ffffff;
	text-align:center;
	line-height:2;
	font-size:3.6vw;
}
#news .wrap .news dt {
    width:100%;
    padding-top:1em;
}
#news .wrap .news > a {
	font-size:4.5vw;
    transition:0;
    bottom:0;
    top:auto;
}
#news .wrap .news > a:hover {
    background:#F3F3F3;
	color:#202020;
}

/**bnr**/
#bnr .wrap {
	padding-top:0;
    padding-bottom:10vw;
}
#bnr li {
    margin-bottom:5vw;
	padding:5px;
	width:100%;
}
#bnr li a {
	width:100%;
	height:150px;
}
#bnr li a h3 {
    font-size:9vw
}
#bnr li a h3 span {
	font-size:4vw;
}
#bnr li a > span {
	line-height:2.6;
	width:12em;
	transition:0;	
	font-size:3.4vw;
}
#bnr li:hover a > span {
	background:#Ffffff;
	color:#202020;
}

@media screen and (max-width:480px){
#mainimg > div a {
	font-size:5vw;
}
#mainimg .swiper-slide.slide3 > div > div {
	top:34%;
}
}
	
@media screen and (max-width:360px){

}