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

.kakugo a {display:block;}
img { max-width: 100%; width: 100%; height: auto; vertical-align: bottom}

* {word-break: break-all font-family: sans-serif;}

.dn {display: none!important;}
.chatbot { z-index:5!important;}
.wow {opacity: 0;}

.formTd .d-inline-block {display:block!important;}
.formTd .d-inline-block input { margin-right: .4vw;}
.requiredText {color:red; padding-left:.3vw;}

.maincont.on {opacity: 1; transition all 1s;}
body {background: #F2F2F2; color: #2C2C2C; font-size: 1vw; counter-reset: number 0;}
iframe {width: 100%; height: 30vw; border: none;}

.loading { position: fixed; z-index: 12; top: 0; left: 0; width: 100%; height: 100vh; background: #fff; transition: all .6s; opacity: 1;}
.loading.on {opacity: 0; top: -100vh; transition: all .6s;}


@media screen and (min-width: 1000px) {
.pcnobr br {display:none;}
.header {position: fixed; z-index: 10; top: -5vw; left: 0; width: 100%; height: 5vw; background: #fff; transition: all 1s; opacity: 0;}
.header.on { top: 0; transition: all 1s; opacity: 1;}
.header .main { padding: 1vw 2vw; display: flex; justify-content: space-between; align-items: center; width: 100%; box-sizing: border-box;}
.header .main .logo { width: 10vw; height: auto; display: block;}
.header .main .gmenu { display: flex; justify-content: flex-start; align-items: center;}
.header .main .gmenu a { display: block; width: max-content; margin: 0 2vw 0 0; font-size: 90%;}
.header .main .contact { width: 10vw; height: auto; display: block; color: #fff; font-size: 120%; text-align: center; padding: .3vw ; background: url(../../../system_panel/uploads/images/btnbg1.jpg) no-repeat center center; background-size: cover;}
.header .main .contact p {color: #fff;}
.header .spnavi,.header #spMenu { display: none;}

.btmcta { background: rgba(0,0,0,.1); padding: 5vw 0; text-align: center; }
.btmcta h2 {font-size: 180%; margin-bottom: 2vw;}
.btmcta p {margin-bottom: 5vw;}
.btmcta .btnbox {display: flex; justify-content: center; align-items: center; margin: 0 auto;}
.btmcta a.btn {width: 20vw; margin: 0 1vw;}
.footer {position: relative; z-index: 2; text-align: center; padding: 2vw 0 10vw;}
.pagetop {position: fixed; z-index: 999999999; display: block; width: 6vw; height: 6vw; bottom: 0; right: 0;}
.pagetop img { width: 100%; height: 100%; object-fit: contain;}

.form {width: 100%; margin: 0 auto;}
.form .formRow { margin: 0 0 2vw; padding: 0; text-align: left;}
.form .formRow input[type="text"],.form .formRow input[type="email"],.form .formRow select,.form .formRow textarea {width: 90%;}
.form .formRow textarea {height: 10em;}
.form p {margin-bottom: 0;}
.form .pp { display: block;width: 100%;height: 20vw; margin: 2vw auto;overflow: scroll;border: solid 1px #fafafa;padding: 1vw; box-sizing: border-box; text-align: left;}
.form .pp a {color: #000;}
.form .submit { text-align: center; margin: auto;}
.form .formRow input[type="text"],
.form .formRow input[type="email"],
.form .formRow textarea { padding: 0.5vw 2vw; border-radius: 20px; border: none;}
.form #submit {opacity: 0.4; position: relative; display: block; width: max-content; padding: 0.5vw 5.15vw 0.5vw 5.15vw; color: #fff; font-size: 130%; letter-spacing: 0.2rem; margin: 0 auto; text-align: center; border: none; border-radius: 0;background: url(../../../system_panel/uploads/images/btnbg1.jpg) no-repeat center center; background-size: cover;}
.form #submit.active {opacity: 1;}

.newslistpage .webgene-blog { height: auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
.newslistpage .webgene-item { display: block; width: 24.6%; height: auto; overflow: hidden; padding: 0; margin: 0 .4vw 1vw 0; padding: 1vw; box-sizing: border-box;}
.newslistpage .webgene-item:nth-of-type(4n) {margin-right: 0;}
.newslistpage .webgene-item .webgene-item-content {position: relative; width: 100%; height: auto; aspect-ratio: 1/.667;}
.newslistpage .webgene-item .webgene-item-content p {position: absolute; z-index: 2; top: 0; left: 0; background: #2C2C2C; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 90%; padding: .4vw;}
.newslistpage .webgene-item .webgene-item-content a { display: block; text-align: left;font-size: 100%; aspect-ratio: 1/.667; overflow: hidden;}
.newslistpage .webgene-item .webgene-item-content a img { width: 100%; height: 100%; object-fit: cover;}
.newslistpage .webgene-item .txt a {display: block; margin-top: .4vw;}
.newslistpage .webgene-item .txt a h2 { font-size: 100%;}
.newslistpage .webgene-item .txt a p {}

.catlist {display: block;}
.catlist section {display: flex; justify-content: center; flex-wrap: wrap; width: 100%;}
.catlist section article { display: block; width: max-content; margin: 0 2vw 2vw;}
.catlist section article a { color: #000; display: block; width: 100%; height: 100%; padding: 1vw 3vw; border: solid 1px #A6A7A6; text-align: center;}

.newsdetail .webgene-blog {width: 55vw; margin: auto;}
.newsdetail .webgene-blog .webgene-item {}
.newsdetail .webgene-blog .webgene-item header {margin-bottom: 4vw;}
.newsdetail .webgene-blog .webgene-item header h2 {font-size: 200%; margin-bottom: 1vw;}
.newsdetail .webgene-item-content {text-align: left; font-size: 140%;}
.newsdetail .webgene-item-content img { width: auto!important; height: auto;}

.localNavi {display: flex; justify-content: center; flex-wrap: wrap; width: 100%;}
.localNavi a { color: #000; display: block; width: 25%; height: 100%; padding: 1vw 3vw; margin: 0 2vw; border: solid 1px #A6A7A6; text-align: center;}

.imgbox { display: flex; justify-content: center;}
.imgbox.reverse {flex-direction: row-reverse;}
.imgbox.reverse .left { margin-right: 0; margin-left: .3vw;}
.imgbox .left { width: 35.2vw; aspect-ratio:1/1.136; margin-right: .3vw;}
.imgbox .right { width: 35.2vw;}
.imgbox .right img { aspect-ratio:1/.564;}
.imgbox .right img:nth-child(1) {margin-bottom: .3vw;}

.enttlbox {}
.enttlbox .ttl {}
.enttlbox .ttl p {font-family: "yu-mincho-pr6n", sans-serif; font-size: 700%; line-height: 1; font-weight: bold; text-align: left;}
.enttlbox .ttl h2 { text-align: left; font-size: 150%; margin-top: 2vw;}
.enttlbox .mainbox {position: relative; padding-left: 5vw; }
.enttlbox .mainbox .box { border-left:  solid 1px #A6A7A6; padding-left: 10vw; margin-top: 5vw; padding: 5vw 5vw 0 10vw; }
.enttlbox .mainbox .box .strength .head { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 1vw;}
.enttlbox .mainbox .box .strength .head p { line-height: 1; font-size: 390%; font-family: "din-2014-narrow", sans-serif; font-weight: 600; color: #487FC3; margin-right: 2vw;}
.enttlbox .mainbox .box .strength h3 {font-size: 170%;}


.staffbox {}
.staffbox .box {}
.staffbox .box .staffheader { position: relative; background: #487FC3; display: block; width: 100%; height: auto; padding: 1vw 0; text-align: center; margin-bottom: 3vw;}
.staffbox .box .staffheader p { font-size: 130%; color: #fff;}
.staffbox .box .staffheader.open:after { position: absolute; display: flex; justify-content: center; align-items: center; content:""; color: #fff; top: 0; bottom: 0; right: 1vw; margin: auto; width: 1.5vw; height: 1.5vw; background: url(../../../system_panel/uploads/images/minusicon.png) no-repeat center center; background-size:contain;}
.staffbox .box .staffheader:after { position: absolute; display: flex; justify-content: center; align-items: center; content:""; color: #fff; top: 0; bottom: 0; right: 1vw; margin: auto; width: 1.5vw; height: 1.5vw; background: url(../../../system_panel/uploads/images/plusicon.png) no-repeat center center; background-size:contain;}

.staffbox .box .staffcont {}
.staffbox .box .staffcont .profile { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 3vw;}
.staffbox .box .staffcont .profile .photo { width: 15%; aspect-ratio: 1/1; margin-right: 5%; overflow: hidden;}
.staffbox .box .staffcont .profile .photo img { display: block; width: 100%; height: 100%; object-fit: contain;}
.staffbox .box .staffcont .profile .txt {width: 80%; text-align: left;}
.staffbox .box .staffcont .profile .txt .name { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1vw;}
.staffbox .box .staffcont .profile .txt .name p:first-child { font-size: 130%; text-align: left;}
.staffbox .box .staffcont .profile .txt .name p:nth-child(2) { font-size: 100%; text-align: right;}
.staffbox .box .staffcont .profile .txt .profile {text-align: left;}

.mapcont { display: flex; justify-content: space-between; align-items: center; width: 100%;}
.mapcont .txt {width: 49%; text-align: right;}
.mapcont .txt .ttl p {font-family: "yu-mincho-pr6n", sans-serif; font-size: 450%; line-height: 1; font-weight: bold;}
.mapcont .txt h2 { text-align: left; font-size: 150%; padding: 1vw; color: #fff; background: #2C2C2C; width: max-content; margin-left: auto; margin-top: 2vw;}

.mapcont .map {width: 49%;}

.servicemenu {position: fixed; top: 5vw; background: #fff; opacity: 0; z-index: 2; transition: all .6s;}
.servicemenu .wow {opacity: 1!important;}
.servicemenu.active {opacity: 1; z-index: 7; transition: all .6s;}
.servicemenu {display: flex; justify-content: flex-start; align-items: center; width: 100%; box-sizing: border-box;}
.servicemenu .ttl {position: relative; background: #487FC3; display: flex; justify-content: flex-start; align-items: center; width: max-content; padding: .4vw 1vw;}
.servicemenu .ttl:after { position: absolute; content:""; display: block; width: 0; height: 0; border-style: solid; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid #487FC3; border-right: 0; right: -10px; top: 0; bottom: 0; margin: auto;}
.servicemenu img {width: 2vw; height: 2vw; margin: 0 1vw;}
.servicemenu h2 {color: #fff; font-size: 100%;}
.servicemenu a {display: block; margin: 0 0 0 2vw;}
.servicemenu.active * {visibility: visible!important;}

.maincont.index .enttlbox .box { padding-bottom: 1vw;}
.maincont.index .section .btn {border-radius: 0;}
.indexsec1 {padding: 0!important; margin: 0 auto 10vw!important;}
.indexsec1 .box {position: relative; display: flex; justify-content: space-between; align-items: center; margin-bottom: 15vw;}
.indexsec1 .box .img {width: 48%; position: relative; z-index: 1;}
.indexsec1 .box .txt {width: 48%; position: relative; z-index: 2; background: #fff; padding: 3vw; text-align: left; left: -7vw; top: 10vw;}
.indexsec1 .box .txt .en { position: absolute; z-index: 2; top: -2vw; background: #2C2C2C; padding: .4vw 1vw; width: max-content; color: #fff; font-size: 150%;}
.indexsec1 .box .txt .num { position: absolute; z-index: 2; top: -3vw; right: 1vw; color: #959595; line-height: 1; font-size: 500%; font-family: "din-2014-narrow", sans-serif; font-weight: 600; font-style: normal;}
.indexsec1 .box .txt h2 { font-size: 170%; margin: 2vw 0 2vw;}
.indexsec1 .box .txt h2 + p { margin-bottom: 3vw; text-align: left;}
.indexsec1 .box .txt .btn {margin-right: auto; margin-left: 0;}
.indexsec1 .box:nth-of-type(even) {flex-direction: row-reverse;}
.indexsec1 .box:nth-of-type(even) .txt {width: 48%; position: relative; z-index: 2; background: #fff; padding: 3vw; text-align: left; left: 7vw; top: 10vw;}

.wbg {background: #fff; padding: 0; overflow: hidden;}
.wbg .hbox {position: relative; display: block; text-align: center; margin: 0 auto 20vw;}
.wbg .hbox:after { position: absolute; content:""; width: 1px; height: 10vw; background: #959595; bottom: -13vw; right: 0;left: 0; margin: 0 auto;}

.indexservice { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto;}
.indexservice .cell {position: relative; width: 38%; margin: 0 auto 6vw  ;}
.indexservice .cell .num { position: absolute; z-index: 2; top: -2.5vw; left: 1vw; color: #959595; line-height: 1; font-size: 360%; font-family: "din-2014-narrow", sans-serif; font-weight: 600; font-style: normal;}
.indexservice .cell h3 {font-size: 140%; margin: 1vw 0;}
.indexservice .cell h3 + p {margin-bottom: 2vw;}

.indexCta {background: #F5F5F5; padding: 0; overflow: hidden;}

.indexnewsttl { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-bottom: 3vw; padding-bottom: 1vw; border-bottom: solid 1px #959595;}
.indexnewsttl h2 {font-size: 140%; width: max-content;}
.indexnewsttl .btn { margin-right: 0; margin-left: auto;}

.indexsns {position: fixed; z-index: 10; bottom: 2vw; left: 2vw; display: flex; justify-content: flex-start; align-items: center;}
.indexsns a {display: block; width: 2vw; height: 2vw; margin: 0 2vw 0 0!important; padding: 0!important;filter: invert(); opacity: .8; }
/*
font-family: "yu-mincho-pr6n", sans-serif;
*/



/*******************************/
.maincont {position: relative; z-index: 2; opacity: 0; transition all 1s; margin: 5vw auto 20vw;overflow: hidden;}

.pagettl {position: relative; width: 100%; height: 50vh; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.pagettl h1 {font-size: 300%; display: block; margin-bottom: 2vw; color: #fff;}
.pagettl p { display: block; color: #fff;}

.videoCont { position: absolute; top: 5vw; right: 0; z-index: 1; width: 100%; height: 50vh; background: url(../../../system_panel/uploads/images/videobg.jpg) no-repeat center center; background-size: cover;}
.videoCont video { width: 100%; height: 100%; aspect-ratio:1/0.5; object-fit: cover; opacity: .47;}

.mister {position: fixed; display: block; width: 10vw; height: auto; aspect-ratio: 1/.991; z-index: 9; left: 0; right: 0; top: 100vh; margin: auto; transition: all 1s; }
.mister.on { top: 92vh; transition: all 1s;}

.sign {width: 24vw; height: auto; display: block; margin-left: auto;}


.section {width: 76.3vw; margin: 0 auto; padding-top: 15vw;}
.maincont.service .section.full {padding-top: 0; margin-bottom: 20vw;}
.maincont.service .section#sec1 {margin-bottom: 25vw;}

.btn {border-radius: 2vw;position: relative; width: max-content; margin-left: auto; margin-right: auto; padding: .3vw 4vw; display: flex; justify-content: center; align-items: center;}
.btn {background: url(../../../system_panel/uploads/images/btnbg1.jpg) no-repeat center center; background-size: cover;}
.btn p {color: #fff; width: max-content; margin: 0; padding: 0;}

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

.w60 {width: 60%; display: block; margin-right: auto;margin-left: auto;}

.hbox {position: relative; display: block; text-align: center; margin: 0 auto 10vw;}
.hbox h2 { text-align: center; line-height: 1;font-size: 230%;}
.hbox p { text-align: center; margin-top: 2vw; font-size: 120%;}
.hbox:after { position: absolute; content:""; width: 1px; height: 5vw; background: #959595; bottom: -6vw; right: 0;left: 0; margin: 0 auto;}

.plainbox h2 { text-align: center; font-size: 230%;}

.txtlist .flcell { display: flex; justify-content: space-between; align-items: flex-start; margin: 0 auto; border-bottom: 1px solid rgba(0,0,0,.15); padding: 1.5vw;}
.txtlist .flcell:nth-of-type(1) { border-top: 1px solid rgba(0,0,0,.15);}
.txtlist .flcell .fleft { width: 30%; text-align: left; font-size: 100%;}
.txtlist .flcell .fright { width: 70%; text-align: left; font-size: 100%;}
.txtlist .flcell .fright a {color: #2C2C2C;}
.txtlist .flcell .fright .mail {width: auto; height: 1.3em;}

.duocell { height: auto; display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0 auto;}
.duocell .cell { display: block; height: auto; width: 37.9vw; margin: 0 .4vw .4vw 0; border: none; aspect-ratio: 1/.667; overflow: hidden;}
.duocell .cell img { aspect-ratio: 1/.667;}
.duocell .cell.full {width: 100%; aspect-ratio: 1/.332; margin: 0;}
.duocell .cell.full img { aspect-ratio: 1/.332;}
.duocell .cell:nth-of-type(2n) {margin-right: 0;}

.tricell { width: 100%; height: auto; display: flex; justify-content: flex-start; flex-wrap: wrap;}
.tricell .cell { display: block; height: auto; width: 31%; margin: 0 3.5% 4vw 0; border: none;}
.tricell .cell:nth-of-type(3n) {margin-right: 0;}

.quadcell {display: flex; justify-content: flex-start; flex-wrap: wrap;}
.quadcell .cell { display: block; width: 24.6%; height: auto; overflow: hidden; padding: 0; margin: 0 .4vw .4vw 0; padding: 1vw; box-sizing: border-box; background: rgba(0,0,0,.14);}
.quadcell .cell .img { aspect-ratio: 1/1.503; overflow: hidden; margin-bottom: 1vw;}
.quadcell .cell .img img { display: block; width: 100%; height: 100%; object-fit: cover;}
.quadcell .cell:nth-of-type(4n) {margin-right: 0;}
.quadcell .cell .ttl { display: flex; justify-content: space-between; align-items: center; width: 100%;}
.quadcell .cell .ttl h3 {font-size: 120%; font-weight: normal; width: 40%;}
.quadcell .cell .ttl p {font-size: 90%; font-weight: normal;}
.quadcell .cell .ttl a { display: block; width: 1vw; height: 2vw;}
.quadcell .cell .ttl a img { width: 100%; height: 100%; object-fit: contain;}


}

/* gjs-dashed */
.gjs-dashed {background: #F2F2F2!important;}
.gjs-dashed div,.gjs-dashed a {padding: 20px 5px!important;}
.gjs-dashed .wow {opacity: 1!important;}
.gjs-dashed .section { width: 100%;}
.gjs-dashed .header { top: 0!important;opacity: 1!important;}
.gjs-dashed .maincont {opacity: 1!important;}
.gjs-dashed .duolist .cell .flcell .fleft img {display: block; position: absolute; top: 3vw; left: 3vw; width: 80%; aspect-ratio: 1/.667; z-index: 2;}
.gjs-dashed .loading {opacity: 0!important; z-index:-100!important;}
.gjs-dashed .mister { top:0!important;}

.section_top .newslistpage .webgene-blog {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    overflow-y: scroll;
    height: 20vw;
    max-height: 296px;
}
.section_top .newslistpage .webgene-item {
    width: 100%;
    height: 100%;
    overflow: unset;
}
.newslistpage.contentsList #wgc-1715827383135 .webgene-item:nth-child(4) {
    display: none;
}