@charset "UTF-8";
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {margin-bottom: 0; font-weight: normal;}
h1,h2,h3,h4 {font-weight: bold;}
p {margin-bottom: 0; line-height: 1.6;}

a:link { text-decoration: none; color: #3E3D3D;}
a:visited { text-decoration: none; color: #3E3D3D;}
a:hover { text-decoration: none;}
a:active { text-decoration: none; color: #3E3D3D;}
a:link,a:visited,a:hover,a:active {transition: all .6s; }
a:hover { opacity: .4;}

img { max-width: 100%; width: 100%; height: auto; vertical-align: bottom}
.markImg { width: auto; height: 5vw; display:block; margin: 1vw 0 0;}
* {word-break: break-all;}
.requiredText {color:red; padding-left:.3vw;}
.btnbox a {margin-left: auto; margin-right: auto; text-align:center;}
.wow {opacity: 0;}

.maincont {opacity: 1;}
.maincont.on {opacity: 1; transition: all .6s;}

iframe { width: 100%; height: 40vw; margin-left: auto; margin-right: auto; border: none;}

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

.header {position: fixed; z-index: 9; top: 0; left: 0; width: 100%; height: 5.2vw; background: #fff; display: flex; justify-content: space-between; align-items: center;}
.header .logo { display: block; margin-left: 3.3vw; width: 15%;}
.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: flex; justify-content: flex-start; align-items: flex-start; height: 100%;}
.header .gmenu a {position: relative; display: flex; justify-content: center; align-items: center; width: auto; height: 100%; margin: 0 1vw 0 0;}
.header .gmenu a.on:before { position: absolute; top: 0; left: 0; right: 0; content:""; width: 1px; height: 1vw; background: #D80C18; margin: 0 auto;}
.header .gmenu a p {}
.header .btnBox { display: flex; justify-content: flex-start; align-items: center;}
.header .btnBox a {display: block; width: 10.9vw; height: auto;}
.header .btnBox a img { display: block; width: 100%; height: 100%; object-fit: contain;}

.spnavi {display: none;}

.btnCta { width: 100%; height: auto; background: url(../../../system_panel/uploads/images/cta_bg.jpg) no-repeat center bottom; padding: 3vw 0 0; margin: 0 auto; box-sizing: border-box; text-align: center;}
.btnCta h2 { font-size: 150%; text-align: center; background: url(../../../system_panel/uploads/images/cta_contact.png) no-repeat center center; background-size:36.2vw auto; overflow: visible; height: 10vw; line-height: 10vw; text-decoration: underline;}
.btnCta h2 br { display: none;}
.btnCta .linkBox { display: flex; justify-content: space-between; align-items: center; width: auto; margin: 3vw auto; width: max-content;}
.btnCta .linkBox a { display: block; width: 15.6vw; height: auto; margin: 0 2vw  ;}

.footer {background: #000; padding: 2vw 3.3vw; box-sizing: border-box; display: flex;justify-content: space-between; align-items: flex-start; color: #fff;}
.footer a {color: #fff;}
.footer .left { width: 50%; text-align: left; padding-left: 3vw;}
.footer .left h2 {font-size: 150%;}
.footer .right { width: 50%; text-align: left;}
.footer .right .box {width: 100%; display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1vw;}
.footer .right .box img { display: block; width: 15%; height: auto;}
.footer .right .box img.footer-logo { width: auto; height: 5.3vw;}

.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: 19.3vw; background: url(../../../system_panel/uploads/images/bg_contact.jpg) no-repeat; background-size: 100% auto; text-align: center; margin: 0 auto;}
.contactTop h2 { font-size: 150%; margin-bottom: 2vw;line-height: 1.6;}
.contactTop .box { width: 44.8vw; height: auto; padding: 1vw; 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;}
.contactTop .box a img { width: 100%; height: auto; display: block;}
.contactTop .box p {}

.form {width: 54.1vw; margin: 0 auto;}
.form .formRow { margin: 0 0 2vw; padding: 0; text-align: left;}
.form .radioArea {display: flex; justify-content: flex-start; align-items: center; width: 100%;}
.form .radioArea .d-inline-block {width: max-content; 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: 20vw; 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: 72.9vw;}
.company .bg1 .whiteBg .ttl {display: block; width: 34.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; width: 100%;}
.company .bg1 .whiteBg .flcell .fleft { width: 30%; }
.company .bg1 .whiteBg .flcell .fleft img {display: block; margin-bottom: 1vw;}
.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: 60%; margin: 0 5%; }
.company .bg1 .whiteBg .flcell .fright p {margin-bottom: 3vw;}
.company .bg1 .whiteBg .labelImg {position: absolute; z-index: 2; right: -8vw; bottom: -2vw; width: 13.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: 49.2vw; margin-left: 30.9vw; background: #fff;}
.company .bg2 .img1 {position: relative; left: 15vw; top: 3vw; width: 57.3vw; 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: 39vw; position: relative;}
.company .bg3 .carousel .prev { display: block; width: 3vw; height: 3vw; position: absolute; z-index: 2; right: 8vw; top: -1vw;}
.company .bg3 .carousel .next { display: block; width: 3vw; height: 3vw; position: absolute; z-index: 2; right: 3vw; top: -1vw;}
.company .bg3 .carousel .serviceList {position: absolute; width: 100%; height: 39vw; display: flex; margin-bottom: 0;}
.company .bg3 .carousel .serviceList .box {position: relative; width: 34vw; height: 39vw; flex: 0 0 auto;}
.company .bg3 .carousel .serviceList .box .contBox {position: relative; width: 30vw; min-height: 13vw; background: #fff; border-radius: 14px;box-shadow: 0px 0px 10px rgba(226, 55, 65, 0.4); margin: 4vw 2vw; padding: 3vw 2vw 2vw; 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: 10vw;}
.company .bg3 .carousel .serviceList .box .contBox .head { position: absolute; color: #D80C18; font-style: italic; font-weight: bold; font-size: 270%; text-align: left; top: -2vw;}
.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: 67.7vw; 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: 60%; 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: 81.1vw;}
.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: 60%; height: auto; padding: 3vw; box-sizing: border-box; text-align: center; margin: auto;}
#fasMain #fasImg { width: 60%; 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: 100%; 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: 51.7vw; margin: 5vw 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: 2vw; 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: 4vw; border-bottom: solid 1px #707070;}
.maincont.newslist .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.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: auto; background: #eee; padding: 1vw;}
.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: 49.3vw; 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: auto;}
.maincont.news .section .webgene-blog .webgene-item-info .cat { color: #D80C18; font-size: 80%; width: auto; background: #eee; padding: 1vw; margin: 0 1vw;}
.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 { width: 76.2vw; margin: 5vw auto 0; }
.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 {display: block; color: #D80C18; font-size: 80%; width: auto; background: #eee; padding: 1vw; margin: 0 1vw;}
.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: 32%; height: auto; overflow: hidden; padding: 0; margin: 0 2% 2vw 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 { width: 50vw; margin: 10vw auto 0; }
.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: 79.4vw; margin: 0 auto;}
.maincont.product .sec3 {width: 66.9vw; margin: 2vw auto 0;}
.maincont.product .sec3 h3 {padding: .3vw; text-align: center; background: #000; color: #fff; font-size: 170%; margin-bottom: 2vw;}
.maincont.product .sec3 p {font-size: 140%; 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: 3vw; overflow: hidden;}
.maincont.service .bg1 .flcell { display: flex; justify-content: flex-start; align-items: flex-start; width: 80%; margin: 0 auto;}
.maincont.service .bg1 .flcell 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: 23%; height: auto; margin: 0 2vw;}

.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: 40vw; margin: 0; }
.maincont.service .bg2 .serviceCont .cell .photo { position: absolute; width: 45vw; aspect-ratio:1/.669; z-index: 2; box-sizing: border-box;}
.maincont.service .bg2 .serviceCont .cell .number { position: absolute; display: block; width: auto; height: 8.1vw; z-index: 2;}
.maincont.service .bg2 .serviceCont .cell .bkbg { position: absolute; background: #000; padding: 5vw 8vw; z-index: 1; width: 60vw; min-height: 28vw ; 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;}

.maincont.service .bg2 .serviceCont .cell:nth-of-type(odd) .photo { top: -4vw; left: 0;}
.maincont.service .bg2 .serviceCont .cell:nth-of-type(odd) .number { top: -7vw; right: 6.3vw;}
.maincont.service .bg2 .serviceCont .cell:nth-of-type(odd) .bkbg { right: 0;}

.maincont.service .bg2 .serviceCont .cell:nth-of-type(even) .photo { top: -4vw; right: 0;}
.maincont.service .bg2 .serviceCont .cell:nth-of-type(even) .number { top: -7vw; left: 6.3vw;}
.maincont.service .bg2 .serviceCont .cell:nth-of-type(even) .bkbg { left: 0;}

.kv {position: relative; top: 0; left: 0; width: 100%; height: 49.8vw;}
.kv .slide {position: absolute; z-index: 1; top: 0; left: 0; width: 78.1vw; 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: 13.2vw; right: 3vw; width: 45.9vw; 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: 30.3vw; margin: 3.4vw 0 0 9vw; color: #fff;}
.kv .txt .box h2 { color: #fff;text-align: left; font-size: 150%; 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: 220%; 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;}
.kv .txt .mainimg {position: absolute; z-index: 2; display: block; width: 25.6vw; aspect-ratio:1/.7; margin: 1vw auto 0; left: 11vw; }
.kv .txt .kvnews {position: absolute; z-index: 1; display: block; width: 46.8vw; aspect-ratio:1/.247; margin: 0 auto;background: url(../../../system_panel/uploads/images/bg_kvnews.png) no-repeat center center;background-size: contain; bottom: -10vw; right: -3vw;}
.kv .txt .kvnews .newsbox { width: 80%; height: auto; margin: 2vw 0 0 4vw; }
.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; }
.kv .txt .kvnews .newsbox .webgene-blog article .webgene-item-content * {font-size: 90%; 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;}
.kv .txt .kvnews .newsbox .linkbtn p {font-size: 90%;}
.kv .txt .kvnews .newsbox .linkbtn img { width: 1em; height: 1em; display: block; margin-left: 1vw;}

.indexsec1 {background: url(../../../system_panel/uploads/images/bg_indexsec1.jpg) no-repeat center top; background-size: cover; width: 100%; height: 63vw; padding-top: 10vw;}
.indexsec1 .whiteBg {width: 77.1vw; padding-bottom: 20vw;}
.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: 3vw 0; overflow: hidden; margin-top: 2vw;}
.indexsec1 .box {position: absolute; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; width: 90%; height: auto;}
.indexsec1 .box img {width: 17vw; height: auto; display: block;}
.indexsec1 .box img:nth-child(odd) {margin-top: 3vw;}

.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; width: 83.2vw; height: auto;}
.indexsec2 .box .cell:nth-of-type(even) {margin-top: 3vw;}
.indexsec2 .box .cell {position: relative; width: 24.4vw; text-align: left;}
.indexsec2 .box .imgtxt {width: auto; height: 5.6vw; 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: 2vw; 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: 1.5vw 4vw; background: url(../../../system_panel/uploads/images/btnbg_b.png) no-repeat center center; background-size: contain; }

.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; width: 80%; margin: 0 auto;}
.indexsec3 .flcell .fleft { width: 45%; margin-right: 2%;}
.indexsec3 .flcell .fright { width: 50%; 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; width: max-content; height: auto;}
.indexsec4 .box img {display: block; width: 18.7vw; height: auto; margin-right: 1.8vw;}
.indexsec4 .box img:nth-child(even) {margin-top: 10.1vw;}
.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: 3vw; 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;}
.indexsec5 .flcell { display: flex; justify-content: space-between; align-items: flex-start; width: 80%; margin: 0 auto;}
.indexsec5 .flcell .fleft { width: 30vw; 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 .6em; }
.indexsec5 .flcell .fleft a:first-child {border-top: dotted 1px #fff;}
.indexsec5 .flcell .fright { width: 50vw;}

.productdetail .flcell { display: flex; justify-content: space-between; margin: 0 auto 0; padding: 6vw 10%; 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: 30%; padding: 0; display: flex; justify-content: center; align-items: center; }
.productdetail .flcell .fright { width: 68%; margin-left: 2%; text-align: left; padding: 1vw; box-sizing: border-box;}
.productdetail .flcell .fright h3 {font-size: 160%; padding-bottom: 1vw; border-bottom: solid 1px #fff; margin-bottom: 1vw;}
.productdetail .flcell:nth-of-type(even) .fright h3 {border-bottom: solid 1px #000;}
.productdetail .flcell .fright .box {display: flex; justify-content: space-between; align-items: flex-end; width: 100%;}
.productdetail .flcell .fright .box p {width: 70%;}
.productdetail .flcell:nth-of-type(odd) .fright .box a { display: block; width: max-content; margin: 0 ; color: #000; font-size: 100%; padding: 1.5vw 2vw; 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;}
.productdetail .flcell:nth-of-type(even) .fright .box a { display: block; width: max-content; margin: 0 ; font-size: 100%; padding: 1.5vw 2vw; 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;}

.company .bg1 .whiteBg .redTxt,.company .bg3 .carousel .serviceList .box .contBox .head,.hbox p {font-family: "century-gothic", sans-serif;}
/*
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;}






.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: 5.2vw auto 0; text-align: center;}
.section {padding-top: 3.1vw;}
.section {position: relative; display: block; margin: 0vw auto 10vw; text-align: center; width: 60vw; }

.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;}

}




/* gjs-dashed */
.gjs-dashed .maincont {opacity: 1!important;}
.gjs-dashed * { padding: 10px!important;}
.gjs-dashed .header { width: 100%; height: 10vw;}
.gjs-dashed img {padding: 0px!important;}
.gjs-dashed .section { width: 100%;}

.gjs-dashed .carousel {position: relative; width:100%; height: max-content!important; overflow: hidden; position: relative;!important}
.gjs-dashed .carousel .serviceList {position: relative!important; width: 100%; height: max-content!important; display: flex; flex-wrap: wrap; margin-bottom: 0;}
.gjs-dashed .carousel .serviceList .box {position: relative!important; width: 100%; height: max-content!important; flex: 0 0 auto;}
.gjs-dashed .carousel .serviceList .box .contBox {position: relative!important; width: 100%; min-height: auto; background: #fff; border-radius: 14px;box-shadow: 0px 0px 10px rgba(226, 55, 65, 0.4); margin: 4vw 2vw; padding: 3vw 2vw 2vw; box-sizing: border-box;}
.gjs-dashed .carousel .serviceList .box .contBox:nth-of-type(1) {margin-left: 0!important;}
.gjs-dashed .carousel .serviceList .box .contBox:nth-of-type(2) {margin-left: 0!important;}
.gjs-dashed .maincont.facility .detailbox p {display: block;}
.gjs-dashed .kv {position: relative; top: 0; left: 0; width: 100%; height: 300vh!important;}
.gjs-dashed .kv .txt .mainimg {position: absolute; z-index: 2; display: block; width: 15.6vw; aspect-ratio:1/.7; margin: 1vw auto 0; left: 11vw; }
