@charset "UTF-8";


@media screen and (max-width: 999px) {
body { font-size: 3vw; background: #fff; color: #000;font-family: "Noto Sans JP", sans-serif;}
.sp {display: block;}
.pc {display: none;}


.header {position: fixed; z-index: 9; top: 0; left: 0; width: 100%; height: 10vw; background: #fff; display: flex; justify-content: space-between; align-items: center;}
.header .logo { display: block; margin-left: 3.3vw; width: 35%;}
.header .logo img { display: block; width: 100%; height: auto; object-fit: contain;}
.header .logo h1 {font-size: 100%; font-weight: bold; text-align: center;}
.header .gmenu { display: none;}
.header .btnBox { display: none;}
.header .spmenu {display: block; width: 10vw; height: 10vw;}
.header .spmenu a { display: block; width: 100%; height: 100%; object-fit: cover;}

.spnavi { transition: all .6s; position: fixed; top: 0; right: -100vw; background: rgba(0,0,0,.9); color: #fff; z-index: 8; padding: 15vw 5vw 0; box-sizing: border-box; width: 100%; height: 100vh;}
.spnavi.active {right: 0; transition: all .6s; }
.spnavi a {display: block; color: #fff; padding: 4vw; border-bottom: dotted 1px #cacaca;}








.btnCta { width: 100%; height: auto; background: url(../../../system_panel/uploads/images/cta_bg.jpg) no-repeat center bottom; padding: 5vw 0 0; margin: 0 auto; box-sizing: border-box; text-align: center;}
.btnCta h2 { font-size: 120%; text-align: center; background: url(../../../system_panel/uploads/images/cta_contact.png) no-repeat center top; background-size:80% auto; overflow: visible; height: auto; padding-top: 15vw; text-decoration: underline; width: 90%; line-height: 1.4; margin: 0 auto;}
.btnCta .linkBox { display: flex; justify-content: center; align-items: center; flex-direction: column; width: auto; margin: 3vw auto 5vw; width: max-content;}
.btnCta .linkBox a { display: block; width: 70vw; height: auto; margin: 0 auto 4vw;}

.footer {background: #000; padding: 5vw 5vw 35vw; box-sizing: border-box;  display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff;}
.footer a {color: #fff;}
.footer .left { width: 100%; text-align: left; margin-bottom: 5vw;}
.footer .left h2 {font-size: 150%; margin-bottom: 3vw;}
.footer .right { width: 100%; text-align: left;}
.footer .right .box img { display: block; width: 30%; margin: 5vw 0;}
.footer .right .box img.footer-logo { width: auto; height: 20.5vw;}
.pagettl {display:flex; justify-content: center; align-items: center; position: relative; width: 100%; height: 15.6vw; background: url(../../../system_panel/uploads/images/bg_pagettl.jpg) no-repeat; background-size: 100% auto;}
.pagettl h2 {position: absolute; z-index: 2; top: 0; bottom: 0; left: 0; right: 0; margin: auto; color: #fff; font-size: 200%; width: max-content; height: max-content;}
.pagettl p {position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; margin: auto; font-family: "century-gothic", sans-serif; font-weight: bold; font-style: italic; font-size: 700%; opacity: .05; color: #fff; width: max-content; height: max-content;}

.contactTop {display:flex; justify-content: center; align-items: center; flex-direction: column; width: 100%; height: auto; background: url(../../../system_panel/uploads/images/bg_contact.jpg) no-repeat; background-size: cover; text-align: center; margin: 0 auto; overflow: hidden; padding: 5vw 0;}
.contactTop h2 { font-size: 100%; margin-bottom: 2vw;line-height: 1.6;}
.contactTop .box { width: 80%; height: auto; padding: 3vw 0; text-align: center; margin: 0 auto; box-sizing: border-box; background: #fff; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); }
.contactTop .box a { width: 80%; display: block; margin: auto; padding: 1vw; box-sizing: border-box;}
.contactTop .box a img { width: 100%; height: auto; display: block;}
.contactTop .box p {}

.form {width: 96%; margin: 5vw auto 0;}
.form .formRow { margin: 0 0 5vw; padding: 0; text-align: left;}
.form .radioArea {display: block; width: 100%;}
.form .radioArea .d-inline-block {width: 100%; text-align: left; margin-right: 1vw;}
.form .radioArea .d-inline-block input {margin-right: .3vw;}
.form .formTh {display: flex; justify-content: space-between; align-items: center; width: 100%;}
.form .requiredText {display:block!important; background: #E23741; color: #fff; font-size: 100%; padding: .3vw 1vw;}
.form .formRow input[type="text"],.form .formRow input[type="email"],.form .formRow select,.form .formRow textarea {width: 100%; }
.form .formRow textarea {height: 10em;}
.form p {margin-bottom: 0; font-size: 100%;}
.form .pp { display: block;width: 100%; height: 50vw; margin: 2vw auto;overflow: scroll;border: solid 1px #fafafa; background: #fff;padding: 1vw; box-sizing: border-box; text-align: left;}
.form .submit { text-align: center; margin: auto;}
.form .formRow input[type="text"],
.form .formRow input[type="email"],
.form .formRow textarea { padding: 0.5vw 1vw; border: none; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);}
.form #submit {opacity: 0.4; position: relative; display: flex; justify-content: center; align-items: center; width: max-content; padding: 1vw 5.15vw; color: #fff; font-size: 100%; letter-spacing: 0.2rem; margin: 0 auto; text-align: center; border: none; background: linear-gradient(#63bbff 0%, #325e80 100%);}
.form #submit.active {opacity: 1;}

.company .bg1 {background: url(../../../system_panel/uploads/images/bg_slashline1.jpg) no-repeat center top; background-size: 100% auto; padding-top: 5vw;margin-bottom: 10vw;}
.company .bg1 .whiteBg {width: 90vw;}
.company .bg1 .whiteBg .ttl {display: block; width: 64.8vw; margin-left: auto;margin-right: auto;}
.company .bg1 .whiteBg .redTxt { font-style: italic; font-weight: bold; font-size: 110%; color: #D80C18;}
.company .bg1 .whiteBg .flcell { display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; width: 100%;}
.company .bg1 .whiteBg .flcell .fleft { width: 100%; margin-bottom: 3vw; }
.company .bg1 .whiteBg .flcell .fleft img {display: block; margin: 2vw auto; width: 80%; }
.company .bg1 .whiteBg .flcell .fleft p {display: block; line-height: 1.3;}
.company .bg1 .whiteBg .flcell .fleft strong {font-size: 130%;}
.company .bg1 .whiteBg .flcell .fright { width: 100%; margin: 0; }
.company .bg1 .whiteBg .flcell .fright p {margin-bottom: 3vw;}
.company .bg1 .whiteBg .labelImg {position: absolute; z-index: 2; right: -3vw; bottom: -21vw; width: 17.6vw; height: auto; display: block;}

.company .bg2 {background: url(../../../system_panel/uploads/images/bg_company1.jpg) no-repeat center top; background-size: 100% auto; padding-top: 5vw; margin-bottom: 10vw;}
.company .bg2 .txtlist { width: 90%; background: #fff; margin: 1vw auto;}
.company .bg2 .img1 {position: relative; top: 3vw; width: 80vw; height: auto; }

.company .bg3 {background: url(../../../system_panel/uploads/images/bg_slashline2.jpg) no-repeat center 10vw; background-size: 100% auto; margin-bottom: 10vw;}
.company .bg3 .historyBox { width: 96.1vw; margin: 0 0 10vw 3.9vw; background: #F8F8F8; overflow: hidden; padding: 3vw 0; box-sizing: border-box;}

.company .bg3 .carousel {position: relative; width:100%; height: 85vw; position: relative;}
.company .bg3 .carousel .prev { display: block; width: 6vw; height: 8vw; position: absolute; z-index: 2; right: 15vw; top: -1vw;}
.company .bg3 .carousel .next { display: block; width: 6vw; height: 8vw; position: absolute; z-index: 2; right: 3vw; top: -1vw;}
.company .bg3 .carousel .serviceList {position: absolute; width: 100%; height: 75vw; display: flex; margin: 5vw 0 0;}
.company .bg3 .carousel .serviceList .box {position: relative; width: 76vw; height: 75vw; flex: 0 0 auto;}
.company .bg3 .carousel .serviceList .box:nth-last-of-type(1) {padding-right: 50vw;}
.company .bg3 .carousel .serviceList .box .contBox {position: relative; width: 70vw; min-height: 20vw; background: #fff; border-radius: 14px;box-shadow: 0px 0px 10px rgba(226, 55, 65, 0.4); margin: 5vw 2vw; padding: 5vw; box-sizing: border-box;}
.company .bg3 .carousel .serviceList .box .contBox:nth-of-type(1) {margin-left: 5vw;}
.company .bg3 .carousel .serviceList .box .contBox:nth-of-type(2) {margin-left: 8vw;}
.company .bg3 .carousel .serviceList .box .contBox .head { position: absolute; color: #D80C18; font-style: italic; font-weight: bold; font-size: 200%; text-align: left; top: -5vw;}
.company .bg3 .carousel .serviceList .box .contBox .time { position: relative; color: #D80C18; font-style: italic; font-weight: bold; font-size: 100%; text-align: left; margin-bottom: 1vw;}
.company .bg3 .carousel .serviceList .box .contBox .txt { text-align: left;}

.company .bg3 .whiteBg {width: 90vw; padding: 2vw; box-sizing: border-box;}

.facilitybox {display: flex; justify-content: flex-start; flex-wrap: wrap;}
.facilitybox a { display: block; width: 32%; height: auto; aspect-ratio: 1/.667; overflow: hidden; padding: 0; margin: 0 2% 2vw 0; box-sizing: border-box;}
.facilitybox a:nth-of-type(3n) {margin-right: 0;}
.facilitybox a:hover {opacity: 1;}
.facilitybox img { width: 100%; height: 100%; object-fit: cover;}

#galleryMain { position: fixed; z-index: -10; opacity: 0; top: 0; right: 0; width: 100%; height: 100vh; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column; background: rgba(0,0,0,.8); transition: all .6s;}
#galleryMain.on { opacity: 1; z-index: 35;}
#galleryMain #img { width: 80%; max-height: 80vh; overflow: hidden; margin: 5vw auto 2vw;}
#galleryMain #img img { width: 100%; height: 100%; object-fit: cover; cursor: pointer;}
#galleryMain .close { position: absolute; z-index: 3; right: 16vw; top: 4vw; width: 3vw; height: 3vw; display: block;}
#galleryMain .close img {display: block; width: 100%; height: 100%; object-fit: contain;}

.maincont.facility .bg1 {background: url(../../../system_panel/uploads/images/bg_slash3.jpg) no-repeat center top; background-size: 100% auto; padding: 10vw; overflow: hidden;}
.maincont.facility .bg1 .whiteBg { width: 100%;}
.maincont.facility .detailbox {display: flex; justify-content: flex-start; flex-wrap: wrap;}
.maincont.facility .detailbox a { display: block; width: 32%; height: auto; overflow: hidden; padding: 0; margin: 0 2% 2vw 0; box-sizing: border-box;}
.maincont.facility .detailbox a:nth-of-type(3n) {margin-right: 0;}
.maincont.facility .detailbox a:hover {opacity: 1;}
.maincont.facility .detailbox img { display: block; width: 100%; height: auto; aspect-ratio: 1/.751; margin-bottom: 1vw;}
.maincont.facility .detailbox h3 {display: block; font-size: 100%;}
.maincont.facility .detailbox p {display: none;}

#fasMain { position: fixed; z-index: -10; opacity: 0; top: 0; right: 0; width: 100%; height: 100vh; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column-reverse; background: rgba(0,0,0,.8); transition: all .6s;}
#fasMain.on { opacity: 1; z-index: 35;}
#fasMain #bg {position: relative; background: #fff; width: 90%; height: auto; padding: 3vw; box-sizing: border-box; text-align: center; margin: auto;}
#fasMain #fasImg { width: 100%; max-height: 80vh; overflow: hidden; margin: 0 auto; display: flex; justify-content: center; align-items: center; flex-direction: column-reverse;}
#fasMain #fasImg img { width: 100%; height: auto; display: block; margin: 1vw auto;}
#fasMain h3 {display: block; font-size: 130%; color: #D80C18;}
#fasMain p {text-align: left;}
#fasMain .close { position: absolute; z-index: 3; right: 1vw; top: 1vw; width: 3vw; height: 3vw; display: block;}
#fasMain .close img {display: block; width: 100%; height: 100%; object-fit: contain;}

.maincont.newslist .section { width: 90%; margin: 10vw auto 0; }
.maincont.newslist .section .hbox * {text-align: left;}
.maincont.newslist .section .catlist .webgene-blog {display: flex; justify-content: flex-start; align-items: center; width: 100%;}
.maincont.newslist .section .catlist .webgene-blog article { width: max-content; margin-right: 4vw; padding: 1vw; background: #eee; font-family: "century-gothic", sans-serif;}

.maincont.newslist .section .newslist .webgene-blog {}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content {position: relative; display: flex; justify-content: flex-start; align-items: center; width: 100%; height: auto; border-bottom: solid 1px #707070; padding: 3vw 0;}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content:after{display: block; position: absolute; content:""; width: 3vw; height: 3vw; right: 0; top: 0; bottom: 0; margin: auto; background: url(../../../system_panel/uploads/images/redbtn.png) no-repeat center center; background-size: contain;}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content * {font-size: 100%; text-align: left;}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content .date {font-style: italic; font-weight: bold; width: 20%;}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content .cat { color: #D80C18; font-size: 80%; width: 13%; padding: 1vw; background: #eee;}
.maincont.newslist .section .newslist .webgene-blog article .webgene-item-content a { display: block; position: relative; width: 60%; margin-left: 1vw;   }

.maincont.news .section .webgene-blog {width: 90%; margin: 10vw auto;}
.maincont.news .section .webgene-blog .webgene-item-info {width: 100%; display: flex; justify-content: flex-start; align-items: center; border-bottom: solid 1px #707070; padding-bottom: 2vw; margin-bottom: 1vw; }
.maincont.news .section .webgene-blog .webgene-item-info * {text-align: left; font-size: 100%;}
.maincont.news .section .webgene-blog .webgene-item-info .date {font-style: italic; font-weight: bold; width: 20%;}
.maincont.news .section .webgene-blog .webgene-item-info .cat { color: #D80C18; font-size: 80%; width: auto; padding: 1vw; background: #eee; margin: 0 2vw;}
.maincont.news .section .webgene-blog .webgene-item-info h2 { display: block; position: relative; width: 60%;   }
.maincont.news .section .webgene-blog .webgene-item-content {text-align: left;}

.maincont.productlist .section .hbox {position: relative; text-align: left;}
.maincont.productlist .section .hbox:after {display: block; position: absolute; right: 0; top: 0; bottom: 0; width: 80%; height: 1px; background: #0C0C0C; margin: auto; content:"";}

.maincont.productlist .section .catlist .webgene-blog {display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; width: 100%;}
.maincont.productlist .section .catlist .webgene-blog article { width: max-content; margin: 0 2vw 2vw 0; padding: 1vw; background: #000;}
.maincont.productlist .section .catlist .webgene-blog article a { display: block; width: 100%; height: 100%; text-align: center; color: #fff;}

.maincont.productlist .section .newslist .webgene-blog {}
.maincont.productlist .section .newslist .webgene-blog article {}
.maincont.productlist .section .newslist .webgene-blog article .webgene-item-content:after{display: block; position: absolute; content:""; width: 1.5vw; height: 1.5vw; right: 0; top: 0; bottom: 0; margin: auto; background: url(../../../system_panel/uploads/images/redbtn.png) no-repeat center center; background-size: contain;}
.maincont.productlist .section .newslist .webgene-blog article .webgene-item-content * {font-size: 100%; text-align: left;}
.maincont.productlist .section .newslist .webgene-blog article .webgene-item-content .date {font-style: italic; font-weight: bold; width: 20%;}
.maincont.productlist .section .newslist .webgene-blog article .webgene-item-content .cat { color: #D80C18; font-size: 80%; width: 10%;}
.maincont.productlist .section .newslist .webgene-blog article .webgene-item-content a { display: block; position: relative; width: 60%;   }


.maincont.productlist .section .productlist .webgene-blog {width: 100%; display: flex; justify-content: flex-start; flex-wrap: wrap;}
.maincont.productlist .section .productlist .webgene-blog article { display: block; width: 48%; height: auto; overflow: hidden; padding: 0; margin: 0 2% 4vw 0; box-sizing: border-box;}
.maincont.productlist .section .productlist .webgene-blog article:nth-of-type(3n) {margin-right: 0;}
.maincont.productlist .section .productlist .webgene-blog article .webgene-item-content a { display: block; aspect-ratio:1/.751; overflow: hidden; margin-bottom: 1vw;}
.maincont.productlist .section .productlist .webgene-blog article .webgene-item-content img {display: block; width: 100%; height: 100%; object-fit: cover;}
.maincont.productlist .section .productlist .webgene-blog article .txt a { display: flex; justify-content: flex-start; align-items: center; width: 100%;}
.maincont.productlist .section .productlist .webgene-blog article .txt a .cat { color: #fff; background: #000; padding: .5vw; text-align: center; width: max-content; font-size: 90%;}
.maincont.productlist .section .productlist .webgene-blog article .txt a h2 {text-align: left; padding-left: 1vw; text-align: left; font-size: 100%;}

.maincont.products .section .webgene-blog .webgene-item-info {width: 100%; display: flex; justify-content: flex-start; align-items: center; padding-bottom: 2vw; margin-bottom: 1vw; }
.maincont.products .section .webgene-blog .webgene-item-info * {text-align: left; font-size: 100%;}
.maincont.products .section .webgene-blog .webgene-item-info .cat { color: #fff; background: #000; padding: .5vw; text-align: center; width: max-content; font-size: 90%;}
.maincont.products .section .webgene-blog .webgene-item-info h2 {text-align: left; padding-left: 1vw; text-align: left; font-size: 120%;}
.maincont.products .section .webgene-blog .webgene-item-content {text-align: left;}
.maincont.products .section .webgene-blog .webgene-item-content .imgSec {margin-bottom: 3vw;}
.maincont.products .section .webgene-blog .webgene-item-content .imgSec .main {display: block; width: 100%; aspect-ratio:1/.751; overflow: hidden; margin-bottom: 2vw;}
.maincont.products .section .webgene-blog .webgene-item-content .imgSec .main img {width: 100%; height: 100%; object-fit: contain;}
.maincont.products .section .webgene-blog .webgene-item-content .imgSec .sub { width: 100%; display: flex; justify-content: space-between; align-items: center;}
.maincont.products .section .webgene-blog .webgene-item-content .imgSec .sub a { width: 30%; height: auto; aspect-ratio:1/.751; overflow: hidden; }
.maincont.products .section .webgene-blog .webgene-item-content .imgSec .sub a img {width: 100%; height: 100%; object-fit: contain;}
.maincont.products .section .webgene-blog .webgene-item-content .seg {margin-bottom: 5vw;}
.maincont.products .section .webgene-blog .webgene-item-content .seg h3 {margin-bottom: 2vw; color: #D80C18; font-size: 120%;}

.maincont.product .sec1 {width: 100%;}
.maincont.product .sec2 {width: 90%; margin: 0 auto;}
.maincont.product .sec3 {width: 90%; margin: 2vw auto 0;}
.maincont.product .sec3 h3 {padding: 2vw; text-align: center; background: #000; color: #fff; font-size: 130%; margin-bottom: 2vw;}
.maincont.product .sec3 p {font-size: 100%; display: block; margin-bottom: 2vw;}
.maincont.product .sec3 p strong {color: #D80C18;}

.maincont.service {background: url(../../../system_panel/uploads/images/bg_slash3.jpg) no-repeat center center; background-size: 100% auto;}
.maincont.service .bg1 {background: url(../../../system_panel/uploads/images/bg_service.jpg) no-repeat center top; background-size: cover; padding: 5vw 3vw; overflow: hidden;}
.maincont.service .bg1 .flcell { display: block; width: 90%; margin: 0 auto;}
.maincont.service .bg1 h3 { font-size: 120%; margin-bottom: 1vw;}
.maincont.service .bg1 .flcell p strong {color: #D80C18;}
.maincont.service .bg1 .flcell .imgbox { display: flex; justify-content: center; align-items: center; width: 100%; margin-bottom: 3vw;}
.maincont.service .bg1 .flcell .imgbox img { display: block; width: 35%; height: auto; margin: 0 5vw;}

.maincont.service .bg2 .hbox {background: url(../../../system_panel/uploads/images/txtbg_feature.png) no-repeat center center; background-size: 24% auto; padding: 3vw 0; overflow: hidden; margin-top: 2vw;}
.maincont.service .bg2 .serviceCont {}
.maincont.service .bg2 .serviceCont .cell {position: relative; width: 100%; height: auto; margin: 15vw auto 0; }
.maincont.service .bg2 .serviceCont .cell .photo { position: relative; width: 90%; aspect-ratio:1/.669; z-index: 2; box-sizing: border-box; margin: 0 auto;}
.maincont.service .bg2 .serviceCont .cell .number { position: absolute; display: block; width: auto; height: 11.1vw; z-index: 2; top: -6vw; right: 7vw;}
.maincont.service .bg2 .serviceCont .cell .bkbg { position: relative; background: #000; padding: 5vw 8vw; z-index: 1; width: 90%; margin: 0 auto; text-align: left; box-sizing: border-box;}
.maincont.service .bg2 .serviceCont .cell .bkbg h3 {font-size: 140%; margin-bottom: 3vw;color: #fff;}
.maincont.service .bg2 .serviceCont .cell .bkbg p {color: #fff;}

.kv {position: relative; top: 0; left: 0; width: 100%; height: 137vw;}
.kv .slide {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: auto; aspect-ratio: 1/.637; mask-image: url("../../../system_panel/uploads/images/kvmask.png") no-repeat center center; mask-size: 100% auto; -webkit-mask: url('../../../system_panel/uploads/images/kvmask.png') repeat center center / 100% 100%;}
.kv .slide img { width: 100%; height: 100%; object-fit: cover;}
.kv .txt { position: absolute; z-index: 2; top: 40vw; right: 3vw; width: 87vw; height: auto; aspect-ratio: 1/.714;background: url(../../../system_panel/uploads/images/bg_kvtxt.png) no-repeat center center;background-size: contain;}
.kv .txt .box { position: relative; width: 100%; margin: 3.4vw 18vw 0; color: #fff; box-sizing: border-box;}
.kv .txt .box h2 { color: #fff;text-align: left; font-size: 120%; margin-bottom: 1vw; -webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3));}
.kv .txt .box h3 { color: #fff;text-align: left; font-size: 140%; margin-bottom: 1vw; -webkit-filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3)); filter: drop-shadow(3px 3px 5px rgba(0,0,0,.3));}
.kv .txt .box p { color: #fff;text-align: left; display: block; width: 65%; margin-bottom: 2vw;}
.kv .txt .mainimg {position: absolute; z-index: 2; display: block; width: 40vw; aspect-ratio:1/.7; margin: 1vw auto 0; left: 11vw; }
.kv .txt .kvnews {position: absolute; z-index: 1; display: block; width: 95vw; aspect-ratio:1/.247; margin: 0 auto; padding: 10vw 1vw; background: url(../../../system_panel/uploads/images/bg_kvnews.png) no-repeat center center;background-size: auto 100%; background-position: left top; bottom: -35vw; right: -3vw; box-sizing: border-box;}
.kv .txt .kvnews .newsbox { width: 90%; height: auto; margin: 2vw 0 0 10vw; }
.kv .txt .kvnews .newsbox h1 { color: #fff; text-align:left; font-size: 110%; margin-bottom: 1vw;}
.kv .txt .kvnews .newsbox .webgene-blog article {margin-bottom: .5vw;}
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content {position: relative; display: flex; justify-content: flex-start; align-items: center; width: 100%; height: auto; margin-bottom: 2vw; }
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content * {font-size: 80%; text-align: left; font-weight: nomal;}
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content .date { width: 17%; color: #fff;}
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content .cat { color: #000; background: #fff; padding: .3vw; font-size: 80%; width: max-content; margin-right: 1vw;}
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content a { display: block; position: relative; width: 60%; color: #fff; font-weight: normal;  }
.kv .txt .kvnews .newsbox .linkbtn { color: #fff; text-align:left; font-size: 90%; margin: 0 0 0 auto; display: flex; justify-content: flex-end; align-items: center; width: max-content; padding-bottom: .3vw; border-bottom: solid 2px #fff; margin-right: 2vw;}
.kv .txt .kvnews .newsbox .linkbtn p {font-size: 90%;}
.kv .txt .kvnews .newsbox .linkbtn img { width: 1em; height: 1em; display: block; margin-left: 1vw;}


.spfixedBnr { display: flex; justify-content: space-between; align-items: center; position: fixed; bottom: 0; left: 0; z-index: 7;}
.spfixedBnr a {display: block; width: calc(100% / 3);}
.spfixedBnr a img { display: block; width: 100%; height: 100%; object-fit: cover;}

.indexsec1 {background: url(../../../system_panel/uploads/images/bg_indexsec1.jpg) no-repeat center top; background-size: cover; width: 100%; height: auto; padding-top: 10vw;}
.indexsec1 .whiteBg {width: 90%; padding-bottom: 20vw; height: auto; overflow: visible; position: relative;}
.indexsec1 .whiteBg p strong {color: #D80C18; font-weight: normal;}
.indexsec1 .hbox {background: url(../../../system_panel/uploads/images/bgtxt_indexsec1.png) no-repeat center center; background-size: auto 5vw; padding: 6vw 0; overflow: hidden; margin-top: 2vw;}
.indexsec1 .box {position: relative; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; width: 90%; height: auto;}
.indexsec1 .box img {display: block; width: 48%;}
.indexsec1 .box img:nth-child(odd) {margin-top: 6vw;}

.indexsec2 {background: url(../../../system_panel/uploads/images/bg_indexsec2.jpg) no-repeat center top; background-size: cover; width: 100%; height: auto; padding-top: 5vw;}
.indexsec2 .hbox {background: url(../../../system_panel/uploads/images/bgtxt_indexsec2.png) no-repeat center center; background-size: auto 5vw; padding: 3vw 0; overflow: hidden; margin-top: 2vw;}
.indexsec2 .box {position: relative; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; width: 83.2vw; height: auto;}
.indexsec2 .box .cell {position: relative; width: 100%; text-align: left; margin-bottom: 6vw;}
.indexsec2 .box .imgtxt {width: auto; height: 11vw; position: relative; z-index: 2;}
.indexsec2 .box .photo {width: 100%; height: auto; position: relative; z-index: 1; margin-top: -1vw;}
.indexsec2 .box .txtbox {width: 100%; height: auto; position: relative; z-index: 2; margin-top: -1vw; left: 2.2vw; background: #0C0C0C; padding: 5vw; box-sizing: border-box;}
.indexsec2 .box .txtbox h3 {font-size: 120%; color: #fff; margin-bottom: 1vw;}
.indexsec2 .box .txtbox p {font-size: 100%; color: #fff;}
.indexsec2 .linkbtn { display: block; width: max-content; margin-left: auto; margin-right: auto; color: #fff; font-size: 100%; padding: 2.5vw 4vw; background: url(../../../system_panel/uploads/images/btnbg_b.png) no-repeat center center; background-size: cover; }

.indexsec3 {background: url(../../../system_panel/uploads/images/bg_indexsec3.jpg) no-repeat center top; background-size: cover; width: 100%; height: auto; padding-bottom: 5vw; margin-top: 5vw; overflow: hidden;}
.indexsec3 .hbox {background: url(../../../system_panel/uploads/images/bgtxt_indexsec3.png) no-repeat center center; background-size: auto 5vw; padding: 3vw 0; overflow: hidden; margin-top: 2vw; }
.indexsec3 .hbox h2 {color: #fff;}
.indexsec3 .flcell { display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; width: 80%; margin: 0 auto;}
.indexsec3 .flcell .fleft { width: 80%; margin: 0 auto 4vw;}
.indexsec3 .flcell .fright { width: 80%;  margin: 0 auto;text-align: left;}
.indexsec3 .flcell .fright a {color: #fff; padding: 1vw 0; text-align: left; border-bottom: dotted 1px #fff; display: block; background: url(../../../system_panel/uploads/images/arrow_indexsec3.png) no-repeat center right; background-size: auto .6em; }
.indexsec3 .flcell .fright a:nth-child(1){margin-left: 2.4vw; padding-top: 0;}
.indexsec3 .flcell .fright a:nth-child(2){margin-left: 2vw;}
.indexsec3 .flcell .fright a:nth-child(3){margin-left: 1.6vw;}
.indexsec3 .flcell .fright a:nth-child(4){margin-left: 1.2vw;}
.indexsec3 .flcell .fright a:nth-child(5){margin-left: .8vw;}
.indexsec3 .flcell .fright a:nth-child(6){margin-left: .4vw;}
.indexsec3 .flcell .fright a:nth-child(7){}
.indexsec3 .btnbox { display: flex; justify-content: space-between; align-items: center; width: max-content; margin: 0 auto;}
.indexsec3 .linkbtn { display: block; width: max-content; margin: 0 2vw; color: #000; font-size: 100%; padding: 1.5vw 4vw; background: url(../../../system_panel/uploads/images/btnbg_w.png) no-repeat center center; background-size: contain; }

.indexsec4 {background: url(../../../system_panel/uploads/images/bg_indexsec4.jpg) no-repeat center top; background-size: cover; width: 100%; height: auto; margin: 3vw 0; overflow: hidden;}
.indexsec4 .hbox {background: url(../../../system_panel/uploads/images/bgtxt_indexsec4.png) no-repeat center center; background-size: auto 5vw; padding: 3vw 0; overflow: hidden; margin-top: 2vw;}
.indexsec4 .box { margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; width: 90%; height: auto;}
.indexsec4 .box img {display: block; width: 47%; height: auto; margin: 0 1vw 1vw; aspect-ratio: 1/1.281;}
.indexsec4 .box img:nth-child(even) {margin-top: 10vw;}
.indexsec4 .box img:last-child {margin-right: 0;}
.indexsec4 .linkbtn { display: block; width: max-content; margin-left: auto; margin-right: auto; color: #fff; font-size: 100%; padding: 1.5vw 4vw; background: url(../../../system_panel/uploads/images/btnbg_b.png) no-repeat center center; background-size: contain; }

.indexsec5 {background: url(../../../system_panel/uploads/images/bg_indexsec5.jpg) no-repeat center top; background-size: cover; width: 100%; height: auto; padding: 5vw 0; overflow: hidden;}
.indexsec5 .bg { width: 83.3vw; height: auto; padding: 5vw; box-sizing: border-box; margin: 0 auto; background: url(../../../system_panel/uploads/images/bg_indexsec3.jpg) no-repeat center top; background-size: cover;}
.indexsec5 .hbox {background: url(../../../system_panel/uploads/images/bgtxt_indexsec5.png) no-repeat center center; background-size: auto 5vw; padding: 3vw 0; overflow: hidden; color: #fff;}
.indexsec5 .bg p {color: #fff; text-align: left;}
.indexsec5 .flcell { display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; width: 100%; margin: 0 auto;}
.indexsec5 .flcell .fleft { width: 100%; text-align: left; margin-right: 5%;}
.indexsec5 .flcell .fleft a {color: #fff; padding: 1vw 0; text-align: left; border-bottom: dotted 1px #fff; display: block; background: url(../../../system_panel/uploads/images/arrow_indexsec5.png) no-repeat center right; background-size: auto 1em;  display: flex; justify-content: flex-start; align-items: center;}
.indexsec5 .flcell .fleft a:first-child {border-top: dotted 1px #fff;}
.indexsec5 .flcell .fright { width: 100%; margin-top: 3vw;}

.productdetail .flcell { display: block; margin: 0 auto; padding: 10vw 5%; width: 100%; box-sizing: border-box;}
.productdetail .flcell:nth-of-type(odd) {background: #000; color: #fff;}
.productdetail .flcell:nth-of-type(even) {background: #e6e6e6; color: #000;}
.productdetail .flcell .fleft { width: 100%; padding: 0; display: flex; justify-content: center; align-items: center; }
.productdetail .flcell .fright { width: 100%; text-align: left; padding: 2vw 0; box-sizing: border-box;}
.productdetail .flcell .fright h3 {font-size: 160%; padding-bottom: 1vw; border-bottom: solid 1px #fff; margin-bottom: 2vw;}
.productdetail .flcell:nth-of-type(even) .fright h3 {border-bottom: solid 1px #000;}
.productdetail .flcell .fright .box {display: block; width: 100%; margin: 0 auto;}
.productdetail .flcell .fright .box p {width: 100%; margin-bottom: 2vw;}
.productdetail .flcell:nth-of-type(odd) .fright .box a { display: flex; justify-content: center; align-items: center; width: 60%; margin: 0 auto; color: #000; font-size: 100%; padding: 1.5vw; background: url(../../../system_panel/uploads/images/btnbg_w.png) no-repeat center center; background-size: contain; }
.productdetail .flcell:nth-of-type(odd) .fright .box a p {width: 100%; color: #000; margin: 0 auto; text-align: center;}
.productdetail .flcell:nth-of-type(even) .fright .box a { display: flex; justify-content: center; align-items: center; width: 60%; margin: 0 auto; font-size: 100%; padding: 1.5vw; background: url(../../../system_panel/uploads/images/btnbg_b.png) no-repeat center center; background-size: contain; }
.productdetail .flcell:nth-of-type(even) .fright .box a p {width: 100%; color: #fff; margin: 0 auto; text-align: center;}
/*
font-family: "century-gothic", sans-serif;
red
D80C18
black
121212
img { width: 100%; height: 100%; object-fit: cover;}
background: url(../../../system_panel/uploads/images/bg_headerrecruit.jpg) no-repeat;
position: fixed; top: 0; left: 0; z-index: 1; content:""; display: block; width: 100%; height: 100%; background: url(../../../system_panel/uploads/images/bg_pagettl.png) no-repeat left top;
*/

.txtlist .flcell { display: flex; justify-content: space-between; margin: 0 auto 0px; border-bottom: 1px dotted #707070;}
.txtlist .flcell:nth-of-type(1) {  border-top: 1px dotted #707070;}
.txtlist .flcell .fleft { width: 30%; text-align: left; font-size: 100%; padding: 1vw; background: #F8F8F8; color: #D80C18;}
.txtlist .flcell .fright { width: 70%; text-align: left; font-size: 100%; padding: 1vw;}

.sptal {text-align: left;}




.whiteBg {position: relative; background: #fff; padding: 3vw; box-sizing: border-box; box-shadow: 0px 1px 10px rgba(226, 55, 65, 0.3); text-align: center; margin-left: auto; margin-right: auto;}


.hbox { display: block; margin-left: auto; margin-right: auto; text-align: center;}
.hbox h2 { font-size: 140%; }
.hbox p { font-weight: bold; color: #D80C18;}
.hbox.line {position: relative; z-index: 2; margin-bottom: 3vw;}
.hbox.line:after {display: block; position: absolute; content:""; display: block; width: 1px; height: 5vw; background: #E23741; bottom: -5vw; left: 0; right: 0; margin: 0 auto;}


a.btn { position: relative; display: block; width: max-content; padding: .5vw 5vw; background: #000; color: #fff; font-size: 100%; margin: 0 auto; text-align: center;}
a.btn p {font-size: 100%;}



.maincont {position: relative; z-index: 2; width: 100%; margin: 10vw auto 0; text-align: center; overflow-x: hidden;}
.section {padding-top: 3.1vw;}
.section {position: relative; display: block; margin: 0vw auto 10vw; text-align: center; width: 90%; }

.mb1 {margin-bottom: 1vw!important;}
.mb3 {margin-bottom: 3vw!important;}
.mb5 {margin-bottom: 5vw!important;}
.mb7 {margin-bottom: 7vw!important;}
.mb10 {margin-bottom: 10vw!important;}
.mt10 {margin-top: 10vw!important;}

.tac {text-align: center;}
.tal {text-align: left;}
.tar {text-align: right;}

.cnt { margin-left: auto; margin-right: auto;}

}